This commit is contained in:
ldj_willow
2022-10-24 09:52:37 +08:00
3 changed files with 20 additions and 223 deletions

View File

@@ -324,6 +324,16 @@ export default {
logOperation.getLogData(queryParam).then(res => {
this.showEmpty = false
if (res.data.result.length === 1) {
// 如果返回的日志是一样的就不显示
if (res.data.result[0].values.length === 1 && ansi_up.ansi_to_html(res.data.result[0].values[0][1]) === this.logs[this.logs.length - 1][1]) {
this.$notify({
title: '警告',
duration: 1000,
message: '当前时间段日志已最新!',
type: 'warning'
})
return
}
const log = res.data.result[0].values
for (const i in res.data.result[0].values) {
log[i][1] = ansi_up.ansi_to_html(res.data.result[0].values[i][1])

View File

@@ -1,223 +0,0 @@
<template>
<el-dialog
title="监控详情"
append-to-body
:visible.sync="dialogVisible"
fullscreen
@open="open"
@close="close"
>
<el-row :gutter="20">
<el-col :span="18" style="border: 1px solid white">
<span />
</el-col>
<el-col :span="6" style="margin-bottom: 20px">
<!-- <span style="float: right">
<el-button icon="el-icon-close" size="mini" type="info" @click="dialogVisible = false"> </el-button>
</span>-->
</el-col>
</el-row>
<el-card class="box-card" shadow="never">
<el-form ref="form" disabled :inline="true" :model="form" :rules="rules" size="mini" label-width="80px">
<el-form-item label="设备编码">
<el-input v-model="device_code" placeholder="自动生产" style="width: 200px;" />
</el-form-item>
<el-form-item label="设备名称" prop="dtl_count">
<el-input v-model="device_name" style="width: 200px;" />
</el-form-item>
</el-form>
</el-card>
<div class="crud-opts2" style="margin-top: 30px;margin-bottom: 15px">
<el-form ref="form" disabled :inline="true" :model="form" :rules="rules" size="mini" label-width="200px">
<el-form-item label="心跳">
<el-input v-model="form.heartbeat" style="width: 200px;" />
</el-form-item>
<el-form-item label="工作模式">
<el-input v-model="form.mode" style="width: 200px;" />
</el-form-item>
<el-form-item label="故障">
<el-input v-model="form.error" style="width: 200px;" />
</el-form-item>
<el-form-item label="故障次数">
<el-input v-model="form.error_num" style="width: 200px;" />
</el-form-item>
<el-form-item label="待机时间(调试)">
<el-input v-model="form.ready_time" style="width: 200px;" />
</el-form-item>
<el-form-item label="生产时间">
<el-input v-model="form.running_time" style="width: 200px;" />
</el-form-item>
<el-form-item label="故障时间">
<el-input v-model="form.error_time" style="width: 200px;" />
</el-form-item>
<el-form-item label="温度">
<el-input v-model="form.temperature" style="width: 200px;" />
</el-form-item>
<el-form-item label="当前生产产品编号">
<el-input v-model="form.material" style="width: 200px;" />
</el-form-item>
<el-form-item label="缺料信号">
<el-input v-model="form.lack_material" style="width: 200px;" />
</el-form-item>
<el-form-item label="上料数量">
<el-input v-model="form.feeding_qty" style="width: 200px;" />
</el-form-item>
<el-form-item label="下料数量">
<el-input v-model="form.blanking_qty" style="width: 200px;" />
</el-form-item>
<el-form-item label="当前生产合格品数量">
<el-input v-model="form.qualified_qty" style="width: 200px;" />
</el-form-item>
<el-form-item label="当前生产不合格品数量">
<el-input v-model="form.unqualified_qty" style="width: 200px;" />
</el-form-item>
<el-form-item label="生产完成">
<el-input v-model="form.finish" style="width: 200px;" />
</el-form-item>
<el-form-item label="任务号">
<el-input v-model="form.task" style="width: 200px;" />
</el-form-item>
<el-form-item label="设备暂停">
<el-input v-model="form.pause" style="width: 200px;" />
</el-form-item>
</el-form>
</div>
</el-dialog>
</template>
<script>
import { crud } from '@crud/crud'
export default {
name: 'XJDeviceMonitor',
components: {},
mixins: [crud()],
props: {
dialogShow: {
type: Boolean,
default: false
},
openParam: {
type: Object
}
},
dicts: [],
data() {
return {
dialogVisible: false,
form: {
heartbeat: '',
mode: '',
error: '',
error_num: '',
ready_time: '',
running_time: '',
error_time: '',
temperature: '',
material: '',
lack_material: '',
feeding_qty: '',
blanking_qty: '',
qualified_qty: '',
unqualified_qty: '',
finish: '',
task: '',
pause: ''
},
device_code: '',
device_name: '',
rules: {
}
}
},
watch: {
dialogShow: {
handler(newValue) {
this.dialogVisible = newValue
}
}
},
methods: {
open() {
this.webSocket()
},
close() {
this.$emit('AddChanged')
},
setForm(data) {
this.dialogVisible = true
this.form = data.data
this.device_code = data.device_code
this.device_name = data.device_name
// this.form = row
},
webSocket() {
const that = this
if (typeof (WebSocket) === 'undefined') {
this.$notify({
title: '提示',
message: '当前浏览器无法接收实时报警信息,请使用谷歌浏览器!',
type: 'warning',
duration: 0
})
} else {
const id = 'xj_device_monitor'
// 获取token保存到vuex中的用户信息此处仅适用于本项目注意删除或修改
// 实例化socket这里我把用户名传给了后台使后台能判断要把消息发给哪个用户其实也可以后台直接获取用户IP来判断并推送
// const wsUri = process.env.VUE_APP_WS_API + '/webSocket/' + id
const wsUri = window.g.prod.VUE_APP_BASE_API.replace('http', 'ws') + '/webSocket/' + id
this.socket = new WebSocket(wsUri)
// 监听socket打开
this.socket.onopen = function() {
console.log('浏览器WebSocket已打开')
// that.socket.send('测试客户端发送消息')
}
// 监听socket消息接收
this.socket.onmessage = function(msg) {
const list = JSON.parse(msg.data).msg.detail
// console.log(list)
for (const item of list) {
const obj = JSON.parse(JSON.stringify(item))
if (obj.device_code === that.device_code) {
that.form = obj.data
}
}
}
// 监听socket错误
this.socket.onerror = function() {
that.$notify({
title: '错误',
message: '服务器错误,无法接收实时报警信息',
type: 'error',
duration: 0
})
}
// 监听socket关闭
this.socket.onclose = function() {
console.log('WebSocket已关闭')
}
}
}
}
}
</script>
<style>
.crud-opts2 {
padding: 0 0;
display: -webkit-flex;
display: flex;
align-items: center;
}
.crud-opts2 .crud-opts-right2 {
margin-left: auto;
padding: 4px 4px;
}
.input-with-select {
background-color: #fff;
}
</style>

View File

@@ -328,6 +328,16 @@ export default {
console.log(res)
this.showEmpty = false
if (res.data.result.length === 1) {
// 如果返回的日志是一样的就不显示
if (res.data.result[0].values.length === 1 && ansi_up.ansi_to_html(res.data.result[0].values[0][1]) === this.logs[this.logs.length - 1][1]) {
this.$notify({
title: '警告',
duration: 1000,
message: '当前时间段日志已最新!',
type: 'warning'
})
return
}
const log = res.data.result[0].values
for (const i in res.data.result[0].values) {
log[i][1] = ansi_up.ansi_to_html(res.data.result[0].values[i][1])