projects/mesxc-zhp #290
@ -1,7 +1,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2024-01-29 16:50:26
|
* @Date: 2024-01-29 16:50:26
|
||||||
* @LastEditTime: 2024-03-28 14:44:45
|
* @LastEditTime: 2024-03-28 16:35:49
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@ -19,8 +19,8 @@
|
|||||||
<h3 class="time">{{ times }}</h3>
|
<h3 class="time">{{ times }}</h3>
|
||||||
<el-button type="text" class="title-button" :style="{ right: 18 + 'px', top: 26 + 'px',fontSize:'32px'}"
|
<el-button type="text" class="title-button" :style="{ right: 18 + 'px', top: 26 + 'px',fontSize:'32px'}"
|
||||||
@click="changeFullScreen">
|
@click="changeFullScreen">
|
||||||
<svg-icon v-if="isFullScreen" icon-class="unFullScreenView" />
|
<svg-icon width="32" height="32" v-if="isFullScreen" icon-class="unFullScreenView" />
|
||||||
<svg-icon v-else icon-class="fullScreenView" />
|
<svg-icon width="32" height="32" v-else icon-class="fullScreenView" />
|
||||||
</el-button>
|
</el-button>
|
||||||
</el-row>
|
</el-row>
|
||||||
<el-row class="container-main flex-col" type="flex">
|
<el-row class="container-main flex-col" type="flex">
|
||||||
@ -272,7 +272,7 @@ export default {
|
|||||||
},
|
},
|
||||||
|
|
||||||
watch: {
|
watch: {
|
||||||
isFullScreen: function (val) {
|
isFullScreen:function (val) {
|
||||||
if (val) {
|
if (val) {
|
||||||
const _this = this;
|
const _this = this;
|
||||||
_this.beilv2 = document.documentElement.clientWidth / 1920
|
_this.beilv2 = document.documentElement.clientWidth / 1920
|
||||||
@ -301,6 +301,7 @@ export default {
|
|||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
window.location.reload()
|
window.location.reload()
|
||||||
}, 86400000)
|
}, 86400000)
|
||||||
|
// this.getData()
|
||||||
},
|
},
|
||||||
destroyed() {
|
destroyed() {
|
||||||
this.CutWebsocketClose()
|
this.CutWebsocketClose()
|
||||||
@ -392,7 +393,6 @@ export default {
|
|||||||
this.$refs.thirdPileChart.initChart(nameList, [topNameList[2]], [nameWasteList[2]], [productList[2]], [wasteList[2]])
|
this.$refs.thirdPileChart.initChart(nameList, [topNameList[2]], [nameWasteList[2]], [productList[2]], [wasteList[2]])
|
||||||
this.$refs.fourthPileChart.initChart(nameList, [topNameList[3]], [nameWasteList[3]], [productList[3]], [wasteList[3]])
|
this.$refs.fourthPileChart.initChart(nameList, [topNameList[3]], [nameWasteList[3]], [productList[3]], [wasteList[3]])
|
||||||
this.$refs.fifthPileChart.initChart(nameList, [topNameList[4]], [nameWasteList[4]], [productList[4]], [wasteList[4]])
|
this.$refs.fifthPileChart.initChart(nameList, [topNameList[4]], [nameWasteList[4]], [productList[4]], [wasteList[4]])
|
||||||
|
|
||||||
// this.$refs.productChart.initChart(nameList, yieldList, sumAreaList)
|
// this.$refs.productChart.initChart(nameList, yieldList, sumAreaList)
|
||||||
this.getTimes()
|
this.getTimes()
|
||||||
// console.log(moment(this.logoutTime - 28800000).format('HH:mm:ss'));
|
// console.log(moment(this.logoutTime - 28800000).format('HH:mm:ss'));
|
||||||
@ -414,6 +414,39 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// getData() {
|
||||||
|
// let detData = [
|
||||||
|
// {
|
||||||
|
// name: '1',
|
||||||
|
// run: '运行',
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// name: '2',
|
||||||
|
// run: '未运行',
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// name: '3',
|
||||||
|
// run: '运行',
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// name: '4',
|
||||||
|
// run: '未运行',
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// name: '1',
|
||||||
|
// run: '运行',
|
||||||
|
// },
|
||||||
|
// ]
|
||||||
|
// this.realEqList = detData.map((item, index) => [
|
||||||
|
// // console.log(item)
|
||||||
|
// `<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
||||||
|
// </span>`,
|
||||||
|
// `<span style="color:rgba(255,255,255,0.5)">${item.name || ''}</span>`,
|
||||||
|
// `<span style="color:rgba(255,255,255,0.5)"><div style="${item.run == '运行' ? 'box-shadow: 0px 0px 2px 1px #2760FF;width:6px;height:6px;border-radius: 50%;background-color: #2760FF;float:left;margin:10px 10px 0 0 ' : 'box-shadow: 0px 0px 2px 1px #FFBD02;width:6px;height:6px;border-radius: 50%; background-color: #FFBD02;float:left;margin:10px 10px 0 0 '}"></div> ${item.run || ''}</span>`,
|
||||||
|
// ])
|
||||||
|
// this.realEqConfig.data = this.realEqList
|
||||||
|
// this.$refs['realEqScrollBoard'].updateRows(this.realEqList)
|
||||||
|
// },
|
||||||
CutWebsocketClose(e) {
|
CutWebsocketClose(e) {
|
||||||
this.Cutws.ws.onclose = (event) => { console.log(event );}
|
this.Cutws.ws.onclose = (event) => { console.log(event );}
|
||||||
},
|
},
|
||||||
@ -488,11 +521,14 @@ export default {
|
|||||||
`<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
`<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
||||||
</span>`,
|
</span>`,
|
||||||
`<span style="color:rgba(255,255,255,0.5)">${item.name || ''}</span>`,
|
`<span style="color:rgba(255,255,255,0.5)">${item.name || ''}</span>`,
|
||||||
`<span style="color:rgba(255,255,255,0.5)"><div style="${item.run == '运行' ? 'width:10px;height:10px;border-radius: 50%;backdrop-filter: blur(5px);background-color: blue;float:left;margin:12px 10px 0 0 ' : 'width:10px;height:10px;border-radius: 50%; backdrop-filter: blur(5px); background-color: yellow;float:left;margin:12px 10px 0 0 '}"></div> ${item.run || ''}</span>`,
|
`<span style="color:rgba(255,255,255,0.5)"><div style="${item.run == '运行' ? 'box-shadow: 0px 0px 2px 1px #2760FF;width:6px;height:6px;border-radius: 50%;background-color: #2760FF;float:left;margin:10px 10px 0 0 ' : 'box-shadow: 0px 0px 2px 1px #FFBD02;width:6px;height:6px;border-radius: 50%; background-color: #FFBD02;float:left;margin:10px 10px 0 0 '}"></div> ${item.run || ''}</span>`,
|
||||||
])
|
])
|
||||||
}
|
}
|
||||||
this.realEqConfig.data = this.realEqList
|
this.realEqConfig.data = this.realEqList
|
||||||
this.$refs['realEqScrollBoard'].updateRows(this.realEqList)
|
this.$nextTick(() => {
|
||||||
|
this.$refs['realEqScrollBoard'].updateRows(this.realEqList)
|
||||||
|
|
||||||
|
})
|
||||||
};
|
};
|
||||||
// if (typeof (WebSocket) === 'undefined') {
|
// if (typeof (WebSocket) === 'undefined') {
|
||||||
// alert('您的浏览器不支持WebSocket')
|
// alert('您的浏览器不支持WebSocket')
|
||||||
@ -601,8 +637,8 @@ export default {
|
|||||||
</span>`,
|
</span>`,
|
||||||
`<span style="color:rgba(255,255,255,0.5)" >${i || ''}
|
`<span style="color:rgba(255,255,255,0.5)" >${i || ''}
|
||||||
</span>`,
|
</span>`,
|
||||||
`<span style="color:rgba(255,255,255,0.5)"><div style="${this.funWsData.data.annealFanInfo[i] == '运行' ? 'width:10px;height:10px;border-radius: 50%; background-color: blue;float:left;margin:12px 10px 0 0 ' : 'width:10px;height:10px;border-radius: 50%; background-color: yellow;float:left;margin:12px 10px 0 0 '}"></div> ${this.funWsData.data.annealFanInfo[i] || ''}</span>`,
|
`<span style="color:rgba(255,255,255,0.5)">${item.name || ''}</span>`,
|
||||||
// `<span style="color:rgba(255,255,255,0.5)"> ${this.funWsData.data.annealFanInfo[i] || ''}</span>`,
|
`<span style="color:rgba(255,255,255,0.5)"><div style="${item.run == '运行' ? 'box-shadow: 0px 0px 2px 1px #2760FF;width:6px;height:6px;border-radius: 50%;background-color: #2760FF;float:left;margin:10px 10px 0 0 ' : 'box-shadow: 0px 0px 2px 1px #FFBD02;width:6px;height:6px;border-radius: 50%; background-color: #FFBD02;float:left;margin:10px 10px 0 0 '}"></div> ${item.run || ''}</span>`,
|
||||||
])
|
])
|
||||||
}
|
}
|
||||||
this.annealFunConfig.data = arr
|
this.annealFunConfig.data = arr
|
||||||
@ -616,8 +652,8 @@ export default {
|
|||||||
arr.push([
|
arr.push([
|
||||||
`<span style="color:rgba(255,255,255,0.5)" >${index || ''}</span>`,
|
`<span style="color:rgba(255,255,255,0.5)" >${index || ''}</span>`,
|
||||||
`<span style="color:rgba(255,255,255,0.5)" >${i || ''}</span>`,
|
`<span style="color:rgba(255,255,255,0.5)" >${i || ''}</span>`,
|
||||||
`<span style="color:rgba(255,255,255,0.5)"><div style="${this.funWsData.data.fanInfo[i] == '运行' ? 'width:10px;height:10px;border-radius: 50%; backdrop-filter: blur(5px);background-color: blue;float:left;margin:12px 10px 0 0 ' : 'width:10px;height:10px;border-radius: 50%; backdrop-filter: blur(5px); background-color: yellow;float:left;margin:12px 10px 0 0 '}"></div> ${this.funWsData.data.fanInfo[i] || ''}</span>`,
|
`<span style="color:rgba(255,255,255,0.5)">${item.name || ''}</span>`,
|
||||||
// `<span style="color:rgba(255,255,255,0.5)">${this.funWsData.data.fanInfo[i] || ''}</span>`,
|
`<span style="color:rgba(255,255,255,0.5)"><div style="${item.run == '运行' ? 'box-shadow: 0px 0px 2px 1px #2760FF;width:6px;height:6px;border-radius: 50%;background-color: #2760FF;float:left;margin:10px 10px 0 0 ' : 'box-shadow: 0px 0px 2px 1px #FFBD02;width:6px;height:6px;border-radius: 50%; background-color: #FFBD02;float:left;margin:10px 10px 0 0 '}"></div> ${item.run || ''}</span>`,
|
||||||
])
|
])
|
||||||
}
|
}
|
||||||
this.funConfig.data = arr
|
this.funConfig.data = arr
|
||||||
@ -702,79 +738,6 @@ export default {
|
|||||||
// console.log(size[0] + '*' + size[1] + '*' + size[2]);
|
// console.log(size[0] + '*' + size[1] + '*' + size[2]);
|
||||||
return size[0] + '*' + size[1] + '*' + size[2]
|
return size[0] + '*' + size[1] + '*' + size[2]
|
||||||
},
|
},
|
||||||
// 数据接收
|
|
||||||
// cutWebsocketOnMessage(e) {
|
|
||||||
// this.cutWsData = e?.data ? JSON.parse(e?.data) : {}
|
|
||||||
// if (this.cutWsData.type === 'cutting' && this.cutWsData.name === 'table') {
|
|
||||||
// let cutArr = this.cutWsData.productHourData.map((item, index) => [
|
|
||||||
// `<span style="color:rgba(255,255,255,0.7)" >${index + 1 || ''}
|
|
||||||
// </span>`,
|
|
||||||
// `<span style="color:rgba(255,255,255,0.7)" >${item.lineName || ''}
|
|
||||||
// </span>`,
|
|
||||||
// `<span style="color:rgba(255,255,255,0.7)">${this.formatTime(item.time) || ''}</span>`,
|
|
||||||
// `<span style="color:rgba(255,255,255,0.7)">${this.getSize(item.size) || ''}</span>`,
|
|
||||||
// `<span style="color:rgba(255,255,255,0.7)">${item.productArea + '㎡' || ''}</span>`,
|
|
||||||
// `<span style="color:rgba(255,255,255,0.7)">${item.wasteArea + '㎡' || ''}</span>`,
|
|
||||||
// `<div style = "${(item.product * 100).toFixed(2) > 91 ? 'display:block;color:#00FFF7' : 'display:none;'}">${(item.product * 100).toFixed(2) + '%' || ''}</div>
|
|
||||||
// <div style = "${(item.product * 100).toFixed(2) < 91 ? 'display:block; color:rgba(255, 209, 96, 1)' : 'display:none;'}">${(item.product * 100).toFixed(2) + '%' || ''}</div>`
|
|
||||||
// ])
|
|
||||||
// this.cutConfig.data = cutArr
|
|
||||||
// this.$refs['cutScrollBoard'].updateRows(cutArr)
|
|
||||||
// } else if (this.cutWsData.type === 'cutting' && this.cutWsData.name === 'chart' && this.cutWsData.dateType === 'day') {
|
|
||||||
// let nameList = []
|
|
||||||
// let nameWasteList = []
|
|
||||||
// let topNameList = []
|
|
||||||
// let productList = []
|
|
||||||
// let wasteList = []
|
|
||||||
// let sumAreaList = []
|
|
||||||
// let yieldList = []
|
|
||||||
// // this.cutTableDataList =
|
|
||||||
// this.cutWsData.coldDetData.forEach((ele, index) => {
|
|
||||||
// nameList.push(ele.lineName)
|
|
||||||
// topNameList.push('产线: ' + ele.lineName + ' ' + '总面积:' + ele.sumArea)
|
|
||||||
// productList.push(ele.productArea)
|
|
||||||
// wasteList.push(ele.wastArea)
|
|
||||||
// nameWasteList.push('缺陷面积:' + ele.wastArea)
|
|
||||||
// sumAreaList.push(ele.sumArea)
|
|
||||||
// yieldList.push((ele.yield *100).toFixed(3))
|
|
||||||
// })
|
|
||||||
// this.$refs.pileChart.initChart(nameList, topNameList, nameWasteList, productList, wasteList)
|
|
||||||
// this.$refs.productChart.initChart(nameList, yieldList, sumAreaList)
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// SJGWebsocketOnOpen() {
|
|
||||||
// console.log('socket连接成功')
|
|
||||||
// this.SJGWebsocket.onmessage()
|
|
||||||
// },
|
|
||||||
// 连接建立失败重连
|
|
||||||
// SJGWebsocketOnError(e) {
|
|
||||||
// this.SJGInitWebSocket()
|
|
||||||
// },
|
|
||||||
// 数据接收
|
|
||||||
// SJGWebsocketOnMessage(e) {
|
|
||||||
// this.SJGWsData = e?.data ? JSON.parse(e?.data) : {}
|
|
||||||
// if (this.SJGWsData.type === 'isra') {
|
|
||||||
// console.log('222222', this.SJGWsData.detData)
|
|
||||||
// console.log(this.SJGWsData.detData);
|
|
||||||
// let chartData = this.SJGWsData.detData.map((item, index) => {
|
|
||||||
// return {
|
|
||||||
// name: item.type,
|
|
||||||
// num:item.num
|
|
||||||
// }
|
|
||||||
// })
|
|
||||||
// this.$refs['ISRAChart'].updateChart(chartData)
|
|
||||||
// } else if (this.SJGWsData.type === 'equipment') {
|
|
||||||
// this.realEqList = this.SJGWsData.detData.map((ele, index) =>[
|
|
||||||
// // console.log(item)
|
|
||||||
// `<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
|
||||||
// </span>`,
|
|
||||||
// `<span style="color:rgba(255,255,255,0.5)">${ele.name || ''}</span>`,
|
|
||||||
// `<span style="color:rgba(255,255,255,0.5)">${ele.run || ''}</span>`,
|
|
||||||
// ])
|
|
||||||
// }
|
|
||||||
// this.realEqConfig.data = this.realEqList
|
|
||||||
// this.$refs['realEqScrollBoard'].updateRows(this.realEqList)
|
|
||||||
// },
|
|
||||||
windowWidth(value) {
|
windowWidth(value) {
|
||||||
this.clientWidth = value
|
this.clientWidth = value
|
||||||
this.beilv2 = this.clientWidth / 1920
|
this.beilv2 = this.clientWidth / 1920
|
||||||
@ -794,7 +757,7 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
changeFullScreen() {
|
changeFullScreen() {
|
||||||
this.containerWidth = 223223223
|
// this.containerWidth = 223223223
|
||||||
if (!screenfull.isEnabled) {
|
if (!screenfull.isEnabled) {
|
||||||
this.$message({
|
this.$message({
|
||||||
message: 'you browser can not work',
|
message: 'you browser can not work',
|
||||||
|
@ -1,8 +1,8 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zwq
|
* @Author: zwq
|
||||||
* @Date: 2022-01-21 14:43:06
|
* @Date: 2022-01-21 14:43:06
|
||||||
* @LastEditors: zwq
|
* @LastEditors: zhp
|
||||||
* @LastEditTime: 2022-01-24 13:27:41
|
* @LastEditTime: 2024-03-28 16:30:54
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
@ -61,7 +61,7 @@ export default {
|
|||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.initChart()
|
// this.initChart()
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
|
@ -2,7 +2,7 @@
|
|||||||
* @Author: zwq
|
* @Author: zwq
|
||||||
* @Date: 2022-01-21 14:43:06
|
* @Date: 2022-01-21 14:43:06
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @LastEditTime: 2024-01-25 17:41:44
|
* @LastEditTime: 2024-03-28 16:45:24
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
@ -90,6 +90,7 @@ export default {
|
|||||||
bottom: 0,
|
bottom: 0,
|
||||||
itemHeight: 10,
|
itemHeight: 10,
|
||||||
itemWidth: 10,
|
itemWidth: 10,
|
||||||
|
icon:'roundRect',
|
||||||
formatter: function(name) {
|
formatter: function(name) {
|
||||||
let pieLegendVale = {}
|
let pieLegendVale = {}
|
||||||
lData.filter((item, index) => {
|
lData.filter((item, index) => {
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2023-09-21 09:06:28
|
* @Date: 2023-09-21 09:06:28
|
||||||
* @LastEditTime: 2024-03-28 14:25:51
|
* @LastEditTime: 2024-03-28 16:31:20
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@ -78,7 +78,7 @@ export default {
|
|||||||
this.$el.addEventListener('resize', () => {
|
this.$el.addEventListener('resize', () => {
|
||||||
console.log('resziing.....');
|
console.log('resziing.....');
|
||||||
});
|
});
|
||||||
this.initChart()
|
// this.initChart()
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
if (!this.chart) {
|
if (!this.chart) {
|
||||||
|
@ -70,7 +70,7 @@ export default {
|
|||||||
// this.dataList.forEach(ele => {
|
// this.dataList.forEach(ele => {
|
||||||
// console.log(ele);
|
// console.log(ele);
|
||||||
// this.series = []
|
// this.series = []
|
||||||
this.initChart()
|
// this.initChart()
|
||||||
// this.$nextTick(() => {
|
// this.$nextTick(() => {
|
||||||
// // this.initChart()
|
// // this.initChart()
|
||||||
// })
|
// })
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2023-12-27 13:54:52
|
* @Date: 2023-12-27 13:54:52
|
||||||
* @LastEditTime: 2024-03-28 14:21:03
|
* @LastEditTime: 2024-03-28 16:30:14
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@ -15,6 +15,7 @@
|
|||||||
import * as echarts from 'echarts';
|
import * as echarts from 'echarts';
|
||||||
import 'echarts/theme/macarons' // echarts theme
|
import 'echarts/theme/macarons' // echarts theme
|
||||||
import resize from './mixins/resize'
|
import resize from './mixins/resize'
|
||||||
|
import { raw } from 'body-parser';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'OverviewBar',
|
name: 'OverviewBar',
|
||||||
@ -77,7 +78,7 @@ export default {
|
|||||||
// this.dataList.forEach(ele => {
|
// this.dataList.forEach(ele => {
|
||||||
// console.log(ele);
|
// console.log(ele);
|
||||||
// this.series = []
|
// this.series = []
|
||||||
this.initChart()
|
// this.initChart()
|
||||||
// this.$nextTick(() => {
|
// this.$nextTick(() => {
|
||||||
// // this.initChart()
|
// // this.initChart()
|
||||||
// })
|
// })
|
||||||
@ -94,7 +95,8 @@ export default {
|
|||||||
let rawData = []
|
let rawData = []
|
||||||
let colors = ['#0fdedb', '#2359ec']
|
let colors = ['#0fdedb', '#2359ec']
|
||||||
rawData.push(passRateList, wasteList)
|
rawData.push(passRateList, wasteList)
|
||||||
const totalData = [];
|
const totalData = [];
|
||||||
|
// if (rawData.length != 0 && raw,Data,length != 0) {
|
||||||
for (let i = 0; i < rawData[0].length; ++i) {
|
for (let i = 0; i < rawData[0].length; ++i) {
|
||||||
let sum = 0;
|
let sum = 0;
|
||||||
for (let j = 0; j < rawData.length; ++j) {
|
for (let j = 0; j < rawData.length; ++j) {
|
||||||
@ -102,6 +104,7 @@ export default {
|
|||||||
}
|
}
|
||||||
totalData.push(sum);
|
totalData.push(sum);
|
||||||
}
|
}
|
||||||
|
// }
|
||||||
console.log('total', totalData)
|
console.log('total', totalData)
|
||||||
this.chart = echarts.init(document.getElementById(this.id))
|
this.chart = echarts.init(document.getElementById(this.id))
|
||||||
const series = [
|
const series = [
|
||||||
|
@ -2,7 +2,7 @@
|
|||||||
* @Author: zwq
|
* @Author: zwq
|
||||||
* @Date: 2021-07-19 15:18:30
|
* @Date: 2021-07-19 15:18:30
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @LastEditTime: 2024-03-28 15:31:07
|
* @LastEditTime: 2024-03-28 16:10:47
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
@ -16,10 +16,10 @@
|
|||||||
许昌安彩深加工看板
|
许昌安彩深加工看板
|
||||||
<h3 class="unit">单位:河南汇融数字科技有限公司</h3>
|
<h3 class="unit">单位:河南汇融数字科技有限公司</h3>
|
||||||
<h3 class="time">{{ times }}</h3>
|
<h3 class="time">{{ times }}</h3>
|
||||||
<el-button type="text" class="title-button" :style="{ right: 18 + 'px', top: 26 + 'px', fontSize: '32px' }"
|
<el-button type="text" class="title-button" :style="{ right: 18 + 'px', top: 26 + 'px',fontSize:'32px'}"
|
||||||
@click="changeFullScreen">
|
@click="changeFullScreen">
|
||||||
<svg-icon v-if="isFullScreen" icon-class="unFullScreenView" />
|
<svg-icon width="32" height="32" v-if="isFullScreen" icon-class="unFullScreenView" />
|
||||||
<svg-icon v-else icon-class="fullScreenView" />
|
<svg-icon width="32" height="32" v-else icon-class="fullScreenView" />
|
||||||
</el-button>
|
</el-button>
|
||||||
</el-row>
|
</el-row>
|
||||||
<el-row class="container-main flex-col" type="flex">
|
<el-row class="container-main flex-col" type="flex">
|
||||||
@ -238,7 +238,6 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
// ...mapGetters(['sidebar']),
|
|
||||||
styles() {
|
styles() {
|
||||||
const v = Math.floor(this.value * this.beilv2 * 100) / 10000
|
const v = Math.floor(this.value * this.beilv2 * 100) / 10000
|
||||||
return {
|
return {
|
||||||
@ -247,7 +246,6 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
watch: {
|
watch: {
|
||||||
isFullScreen: function (val) {
|
isFullScreen: function (val) {
|
||||||
if (val) {
|
if (val) {
|
||||||
@ -269,12 +267,10 @@ export default {
|
|||||||
_this.timer = false
|
_this.timer = false
|
||||||
}, 500)
|
}, 500)
|
||||||
}
|
}
|
||||||
// 这里可以添加修改时的方法
|
|
||||||
this.windowWidth(val);
|
this.windowWidth(val);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.getData()
|
|
||||||
this.init()
|
this.init()
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
window.location.reload()
|
window.location.reload()
|
||||||
@ -285,67 +281,67 @@ export default {
|
|||||||
this.SJGWebsocketClose()
|
this.SJGWebsocketClose()
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
let detData = [
|
// let detData = [
|
||||||
{
|
// {
|
||||||
id:'1',
|
// id:'1',
|
||||||
name: '测试工单',
|
// name: '测试工单',
|
||||||
progressRate:0.933333
|
// progressRate:0.933333
|
||||||
},
|
// },
|
||||||
{
|
// {
|
||||||
id: '2',
|
// id: '2',
|
||||||
name: '测试工单2',
|
// name: '测试工单2',
|
||||||
progressRate: 0.932323
|
// progressRate: 0.932323
|
||||||
}, {
|
// }, {
|
||||||
id: '3',
|
// id: '3',
|
||||||
name: '测试工单3',
|
// name: '测试工单3',
|
||||||
progressRate: 0.23232
|
// progressRate: 0.23232
|
||||||
}, {
|
// }, {
|
||||||
id: '4',
|
// id: '4',
|
||||||
name: '测试工单4',
|
// name: '测试工单4',
|
||||||
progressRate: 0.32323
|
// progressRate: 0.32323
|
||||||
}
|
// }
|
||||||
// {
|
// // {
|
||||||
// id: '5',
|
// // id: '5',
|
||||||
// name: '测试工单',
|
// // name: '测试工单',
|
||||||
// progressRate: 0.5555
|
// // progressRate: 0.5555
|
||||||
// }, {
|
// // }, {
|
||||||
// id: '6',
|
// // id: '6',
|
||||||
// name: '测试工单',
|
// // name: '测试工单',
|
||||||
// progressRate: 0.66564
|
// // progressRate: 0.66564
|
||||||
// },
|
// // },
|
||||||
]
|
// ]
|
||||||
this.orderList = detData.map((ele, index) => {
|
// this.orderList = detData.map((ele, index) => {
|
||||||
if (ele.progressRate && ele.progressRate != 1) {
|
// if (ele.progressRate && ele.progressRate != 1) {
|
||||||
return {
|
// return {
|
||||||
id: ele.id,
|
// id: ele.id,
|
||||||
name: ele.name,
|
// name: ele.name,
|
||||||
progressRate: parseFloat((ele.progressRate * 100).toFixed(3))
|
// progressRate: parseFloat((ele.progressRate * 100).toFixed(3))
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
});
|
// });
|
||||||
let EnergyNameList = ['Y61', 'Y62', 'Y63', 'Y64', 'Y65',]
|
// let EnergyNameList = ['Y61', 'Y62', 'Y63', 'Y64', 'Y65',]
|
||||||
this.EnergyMonitoringNameList = EnergyNameList
|
// this.EnergyMonitoringNameList = EnergyNameList
|
||||||
let EnergyDataList = [1, 2, 3, 4, 5]
|
// let EnergyDataList = [1, 2, 3, 4, 5]
|
||||||
// this.wsData.data.forEach((ele) => {
|
// // this.wsData.data.forEach((ele) => {
|
||||||
// EnergyDataList.push(ele.useQuantity)
|
// // EnergyDataList.push(ele.useQuantity)
|
||||||
// })
|
// // })
|
||||||
this.EnergyMonitoringList = EnergyDataList
|
// this.EnergyMonitoringList = EnergyDataList
|
||||||
// console.log(EnergyDataList)
|
// // console.log(EnergyDataList)
|
||||||
this.$refs.EnergyMonitoringChart.initChart(this.EnergyMonitoringNameList, this.EnergyMonitoringList)
|
// this.$refs.EnergyMonitoringChart.initChart(this.EnergyMonitoringNameList, this.EnergyMonitoringList)
|
||||||
let eqArr = this.qualityYearList.map((item, index) => [
|
// let eqArr = this.qualityYearList.map((item, index) => [
|
||||||
`<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
// `<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
||||||
</span>`,
|
// </span>`,
|
||||||
// formatDate(item.planStartTime) || '',
|
// // formatDate(item.planStartTime) || '',
|
||||||
`
|
// `
|
||||||
<span style="color:rgba(255,255,255,0.5)" >${item.name || ''}
|
// <span style="color:rgba(255,255,255,0.5)" >${item.name || ''}
|
||||||
</span>`,
|
// </span>`,
|
||||||
`<span style="color:rgba(255,255,255,0.5)">${item.code || ''}</span>`,
|
// `<span style="color:rgba(255,255,255,0.5)">${item.code || ''}</span>`,
|
||||||
`<span style="color:rgba(255,255,255,0.5)">${item.status || ''}</span>`,
|
// `<span style="color:rgba(255,255,255,0.5)">${item.status || ''}</span>`,
|
||||||
`<span style="color:rgba(255,255,255,0.5)">${item.error || ''}</span>`,
|
// `<span style="color:rgba(255,255,255,0.5)">${item.error || ''}</span>`,
|
||||||
])
|
// ])
|
||||||
this.eqConfig.data = eqArr
|
// this.eqConfig.data = eqArr
|
||||||
this.$refs['eqScrollBoard'].updateRows(eqArr)
|
// this.$refs['eqScrollBoard'].updateRows(eqArr)
|
||||||
this.$refs.productLineChart.initChart(['D61', 'D62', 'D63', 'D64', 'D65',], [98, 97, 98.7, 98.5, 98.3,], [3134, 2323, 3232, 3233, 2321])
|
// this.$refs.productLineChart.initChart(['D61', 'D62', 'D63', 'D64', 'D65',], [98, 97, 98.7, 98.5, 98.3,], [3134, 2323, 3232, 3233, 2321])
|
||||||
// this.getList()
|
// this.getList()
|
||||||
this.initWebSocket()
|
this.initWebSocket()
|
||||||
this.SJGInitWebSocket()
|
this.SJGInitWebSocket()
|
||||||
@ -359,7 +355,9 @@ export default {
|
|||||||
this.beilv2 = _this.clientWidth / 1920
|
this.beilv2 = _this.clientWidth / 1920
|
||||||
})()
|
})()
|
||||||
}
|
}
|
||||||
|
this.getData()
|
||||||
},
|
},
|
||||||
|
|
||||||
// beforeDestroy() {
|
// beforeDestroy() {
|
||||||
// //离开页面删除检测器和所有侦听器
|
// //离开页面删除检测器和所有侦听器
|
||||||
// // erd.uninstall(document); //这里用ref是因为vue离开页面后获取不到dom
|
// // erd.uninstall(document); //这里用ref是因为vue离开页面后获取不到dom
|
||||||
@ -550,122 +548,10 @@ export default {
|
|||||||
} else if (this.SJGInitWebSocket === 'inspection') {
|
} else if (this.SJGInitWebSocket === 'inspection') {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
// if (typeof (WebSocket) === 'undefined') {
|
|
||||||
// alert('您的浏览器不支持WebSocket')
|
|
||||||
// } else {
|
|
||||||
// let date = new Date().valueOf()
|
|
||||||
// // console.log(date);
|
|
||||||
// console.log(process.env);
|
|
||||||
// const SJGWsUrl = process.env.VUE_APP_Socket_API + `/websocket/message?userId=SJG${date}`
|
|
||||||
// this.SJGWebsocket = new WebSocket(SJGWsUrl)
|
|
||||||
// // 监听 WebSocket 连接
|
|
||||||
// this.SJGWebsocket.onopen = this.SJGWebsocketOnOpen
|
|
||||||
// // 监听 WebSocket 错误信息
|
|
||||||
// this.SJGWebsocket.onerror = this.SJGWebsocketOnError
|
|
||||||
// // 监听 WebSocket 消息
|
|
||||||
// this.SJGWebsocket.onmessage = this.SJGWebsocketOnMessage
|
|
||||||
// // 监听 webSocket 断开信息
|
|
||||||
// this.SJGWebsocket.onclose = this.SJGWebsocketClose
|
|
||||||
// }
|
|
||||||
},
|
},
|
||||||
// SJGWebsocketOnOpen() {
|
|
||||||
// console.log('socket连接成功')
|
|
||||||
// // console.log(this.SJGWebsocket.onmessage);
|
|
||||||
// this.SJGWebsocket.onmessage()
|
|
||||||
// },
|
|
||||||
// // 连接建立失败重连
|
|
||||||
// SJGWebsocketOnError(e) {
|
|
||||||
// // console.log('11111', e)
|
|
||||||
// this.SJGInitWebSocket()
|
|
||||||
// },
|
|
||||||
// 数据接收
|
|
||||||
// SJGWebsocketOnMessage(e) {
|
|
||||||
// console.log(1111, e)
|
|
||||||
// this.SJGWsData = e?.data ? JSON.parse(e?.data) : {}
|
|
||||||
// // console.log(this.wsData.detData);
|
|
||||||
// // console.log('22222', this.wsData.data)
|
|
||||||
// if (this.SJGWsData.type === 'order') {
|
|
||||||
// this.orderList = this.SJGWsData.detData.map((ele, index) => {
|
|
||||||
// if (ele.progressRate != 1) {
|
|
||||||
// return {
|
|
||||||
// id: ele.id,
|
|
||||||
// name: ele.name,
|
|
||||||
// progressRate: ele.progressRate.toFixed(3)
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
// console.log(this.orderList)
|
|
||||||
// } else if (this.SJGWsData.type === 'equipment') {
|
|
||||||
// let eqArr = this.SJGWsData.detData.map((item, index) => [
|
|
||||||
// `<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''}
|
|
||||||
// </span>`,
|
|
||||||
// `<span style="color:rgba(255,255,255,0.5)" >${item.name || ''}
|
|
||||||
// </span>`,
|
|
||||||
// `<span style="color:rgba(255,255,255,0.5)">${item.code || ''}</span>`,
|
|
||||||
// `<span style="color:rgba(255,255,255,0.5)">${item.status || ''}</span>`,
|
|
||||||
// `<span style="color:rgba(255,255,255,0.5)">${item.error || ''}</span>`,
|
|
||||||
// ])
|
|
||||||
// this.eqConfig.data = eqArr
|
|
||||||
// this.$refs['eqScrollBoard'].updateRows(eqArr)
|
|
||||||
// // console.log(SJGWsData.orderList)
|
|
||||||
// } else if (this.SJGWsData.type === 'productline') {
|
|
||||||
// console.log('aaaaaaaaaaaaaaaaaaa', this.SJGWsData);
|
|
||||||
// let nameList = []
|
|
||||||
// let passRateList = []
|
|
||||||
// let outputNumList = []
|
|
||||||
// this.SJGWsData.detData.forEach((ele) => {
|
|
||||||
// // if (item.id == ele.productionLineId) {
|
|
||||||
// // if (item.name.substr(0, 1) == "D") {
|
|
||||||
// // console.log(ele)
|
|
||||||
// nameList.push(ele.lineName)
|
|
||||||
// outputNumList.push(ele.outputNum)
|
|
||||||
// passRateList.push(ele.passRate)
|
|
||||||
// // }
|
|
||||||
// // }
|
|
||||||
// })
|
|
||||||
// this.$refs.productLineChart.initChart(nameList, passRateList, outputNumList)
|
|
||||||
// } else if (this.SJGInitWebSocket === 'inspection') {
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
SJGWebsocketClose(e) {
|
SJGWebsocketClose(e) {
|
||||||
this.SJGws.ws.onclose = (event) => { console.log(event); }
|
this.SJGws.ws.onclose = (event) => { console.log(event); }
|
||||||
},
|
},
|
||||||
// // 连接建立之后执行send方法发送数据
|
|
||||||
// websocketOnOpen() {
|
|
||||||
// console.log('socket连接成功')
|
|
||||||
// this.websocket.onmessage()
|
|
||||||
// },
|
|
||||||
// 连接建立失败重连
|
|
||||||
// websocketOnError(e) {
|
|
||||||
// console.log('11111', e)
|
|
||||||
// this.initWebSocket()
|
|
||||||
// },
|
|
||||||
// 数据接收
|
|
||||||
// websocketOnMessage(e) {
|
|
||||||
// // console.log(1111, e)
|
|
||||||
// this.wsData = e?.data ? JSON.parse(e?.data) : {}
|
|
||||||
// // console.log('22222', this.wsData.data)
|
|
||||||
// if (this.wsData.type === 'EnergyMonitoring') {
|
|
||||||
// let EnergyNameList = []
|
|
||||||
// this.wsData.data.forEach((ele) => {
|
|
||||||
// EnergyNameList.push(ele.lineName)
|
|
||||||
// })
|
|
||||||
// this.EnergyMonitoringNameList = EnergyNameList
|
|
||||||
// let EnergyDataList = []
|
|
||||||
// this.wsData.data.forEach((ele) => {
|
|
||||||
// EnergyDataList.push(ele.useQuantity
|
|
||||||
// )
|
|
||||||
// })
|
|
||||||
// this.EnergyMonitoringList = EnergyDataList
|
|
||||||
// console.log(EnergyDataList)
|
|
||||||
// this.$refs.EnergyMonitoringChart.initChart(this.EnergyMonitoringNameList, this.EnergyMonitoringList)
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// 数据发送
|
|
||||||
// websocketSend() {
|
|
||||||
// this.websocket.send('11111')
|
|
||||||
// },
|
|
||||||
// // 关闭
|
|
||||||
websocketClose(e) {
|
websocketClose(e) {
|
||||||
this.wsHeartbeat.ws.onclose = (event) => { console.log(event); }
|
this.wsHeartbeat.ws.onclose = (event) => { console.log(event); }
|
||||||
},
|
},
|
||||||
@ -674,10 +560,14 @@ export default {
|
|||||||
this.beilv2 = this.clientWidth / 1920
|
this.beilv2 = this.clientWidth / 1920
|
||||||
},
|
},
|
||||||
change() {
|
change() {
|
||||||
|
console.log(this.isFullScreen);
|
||||||
|
debugger;
|
||||||
this.isFullScreen = screenfull.isFullscreen
|
this.isFullScreen = screenfull.isFullscreen
|
||||||
},
|
},
|
||||||
init() {
|
init() {
|
||||||
|
console.log(screenfull.isEnabled);
|
||||||
if (screenfull.isEnabled) {
|
if (screenfull.isEnabled) {
|
||||||
|
debugger;
|
||||||
screenfull.on('change', this.change)
|
screenfull.on('change', this.change)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -687,7 +577,7 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
changeFullScreen() {
|
changeFullScreen() {
|
||||||
this.containerWidth = 223223223
|
// this.containerWidth = 223223223
|
||||||
if (!screenfull.isEnabled) {
|
if (!screenfull.isEnabled) {
|
||||||
this.$message({
|
this.$message({
|
||||||
message: 'you browser can not work',
|
message: 'you browser can not work',
|
||||||
|
Loading…
Reference in New Issue
Block a user