root/screen-hl-one
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改显示

Browse Source
This commit is contained in:
xiangxy
2022-08-01 14:21:39 +08:00
parent 57321311ef
commit 1b95362f70
1 changed files with 14 additions and 237 deletions
Download Patch File Download Diff File Expand all files Collapse all files

251
src/pages/DeviceScreen.vue
View File

@@ -220,6 +220,7 @@ export default {
data () { data () {
return { return {
interTime: this.$store.getters.setTime, interTime: this.$store.getters.setTime,
timer1: null,
timer2: null, timer2: null,
timer4: null, timer4: null,
timeOut1: null, timeOut1: null,
@@ -347,15 +348,14 @@ export default {
// array1: [{material_code: '001'}, {material_code: '001'}, {material_code: '001'}, {material_code: '001'}, {material_code: '001'}, {material_code: '001'}], // array1: [{material_code: '001'}, {material_code: '001'}, {material_code: '001'}, {material_code: '001'}, {material_code: '001'}, {material_code: '001'}],
// array2: [{material_code: '01'}, {material_code: '01'}, {material_code: '01'}, {material_code: '01'}], // array2: [{material_code: '01'}, {material_code: '01'}, {material_code: '01'}, {material_code: '01'}],
array1: [], array1: [],
array2: [], array2: []
num: 800
} }
}, },
computed: { computed: {
defaultOption1 () { defaultOption1 () {
return { return {
step: 0.4, // 数值越大速度滚动越快 step: 0.4, // 数值越大速度滚动越快
limitMoveNum: this.num, // 开始无缝滚动的数据量 this.dataList.length limitMoveNum: 5, // 开始无缝滚动的数据量 this.dataList.length
hoverStop: true, // 是否开启鼠标悬停stop hoverStop: true, // 是否开启鼠标悬停stop
direction: 1, // 0向下 1向上 2向左 3向右 direction: 1, // 0向下 1向上 2向左 3向右
openWatch: true, // 开启数据实时监控刷新dom openWatch: true, // 开启数据实时监控刷新dom
@@ -377,22 +377,17 @@ export default {
} }
} }
}, },
// created () {
// this.updateTime()
// this.timer = window.setInterval(this.updateTime, 1000)
// }
// beforeDestroy () {
// this.$once('hook:beforeDestroy', () => {
// clearInterval(this.timer)
// })
// }
created () { created () {
this.refresh() this.refresh()
}, },
beforeDestroy () { beforeDestroy () {
this.$once('hook:beforeDestroy', () => { this.$once('hook:beforeDestroy', () => {
clearInterval(this.timer1)
clearInterval(this.timer2) clearInterval(this.timer2)
clearInterval(this.timer4) clearInterval(this.interTime)
clearInterval(this.timeOut1)
clearInterval(this.timeOut2)
clearInterval(this.timeOut3)
}) })
}, },
methods: { methods: {
@@ -406,13 +401,16 @@ export default {
this._deviceStatusList() // 中grid this._deviceStatusList() // 中grid
this._deviceErrorNum() this._deviceErrorNum()
this._deviceErrorInfo() // 右grid this._deviceErrorInfo() // 右grid
this._errCensus()
}, },
refresh () { refresh () {
this.initData() this.initData()
this._errCensus() // 右下
this.timer2 = setInterval(() => { this.timer2 = setInterval(() => {
this.initData() this.initData()
}, this.interTime) }, this.interTime)
this.timer1 = setInterval(() => {
this._errCensus()
}, 60000)
}, },
fontSize (res) { fontSize (res) {
const clientWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth const clientWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth
@@ -1199,18 +1197,6 @@ export default {
borderColor: '#ffffff', borderColor: '#ffffff',
containLabel: true containLabel: true
}, },
// legend: {
// top: 0,
// right: 0,
// textStyle: {
// color: '#ffffff',
// fontSize: 12,
// lineHeight: 20
// },
// itemGap: 20,
// itemHeight: 8,
// data: ['总库存']
// },
xAxis: { xAxis: {
type: 'category', type: 'category',
axisTick: { axisTick: {
@@ -1228,7 +1214,6 @@ export default {
rotate: 50 rotate: 50
}, },
data: names data: names
// data: names.length >= 7 ? names.slice(0, 7) : names
}, },
yAxis: { yAxis: {
axisTick: { axisTick: {
@@ -1284,7 +1269,6 @@ export default {
}, },
// data: [100, 51, 90, 41, 91, 61, 51] // data: [100, 51, 90, 41, 91, 61, 51]
data: total, data: total,
// data: total.length >= 7 ? total.slice(0, 7) : total,
label: { label: {
show: true, show: true,
position: 'top', position: 'top',
@@ -1308,180 +1292,7 @@ export default {
window.addEventListener('resize', () => { window.addEventListener('resize', () => {
this.myCharts02.resize() this.myCharts02.resize()
}) })
// if (names.length > 7) {
// let t = 1
// let stotal = total.slice(0, 7)
// let snames = names.slice(0, 7)
// this.timer4 = setInterval(() => {
// stotal.shift()
// stotal.push(total[t + 6])
// snames.shift()
// snames.push(names[t + 6])
// this.myCharts02.setOption({
// xAxis: {
// data: snames
// },
// series: [
// {data: stotal}
// ]
// })
// if (t + 7 < names.length) {
// t++
// } else {
// t = -6
// }
// }, 2000)
// }
}, },
// setEchart002 () {
// // 左3
// let total = []
// let names = []
// let max = 0
// this.chartData1.map(el => {
// total.push(el.teep)
// names.push(el.workprocedure_name)
// max = Math.max(max, Number(el.teep))
// })
// let option = {
// grid: {
// top: 30,
// left: 0,
// right: 0,
// bottom: 0,
// borderColor: '#ffffff',
// containLabel: true
// },
// // legend: {
// // top: 0,
// // right: 0,
// // textStyle: {
// // color: '#ffffff',
// // fontSize: 12,
// // lineHeight: 20
// // },
// // itemGap: 20,
// // itemHeight: 8,
// // data: ['总库存']
// // },
// xAxis: {
// type: 'category',
// axisTick: {
// show: false
// },
// axisLine: {
// lineStyle: {
// color: '#8FABBF ',
// fontSize: 14,
// lineHeight: 14
// }
// },
// axisLabel: {
// color: '#8FABBF ',
// rotate: 50
// },
// // data: names
// data: names.length >= 7 ? names.slice(0, 7) : names
// },
// yAxis: {
// axisTick: {
// show: false
// },
// axisLine: {
// lineStyle: {
// color: '#909399'
// }
// },
// // axisLabel: {
// // color: '#909399'
// // },
// axisLabel: {
// formatter: '{value} %',
// textStyle: {
// color: '#8FABBF',
// fontSize: 14
// }
// },
// splitLine: {
// show: false,
// lineStyle: {
// type: [8, 4],
// dashOffset: 4,
// color: '#8FABBF',
// opacity: 0.2
// }
// },
// max: max
// },
// series: [
// {
// type: 'bar',
// barWidth: 8,
// itemStyle: {
// normal: {
// show: true,
// color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
// {
// offset: 0,
// color: '#0E90FD',
// opacity: 1
// },
// {
// offset: 1,
// color: 'rgba(96,112,128,0.10)',
// opacity: 0.1
// }
// ]),
// borderWidth: 0
// }
// },
// // data: [100, 51, 90, 41, 91, 61, 51]
// // data: total,
// data: total.length >= 7 ? total.slice(0, 7) : total,
// label: {
// show: true,
// position: 'top',
// // distance: 5,
// // fontSize: 12,
// textStyle: {
// color: '#8FABBF',
// fontSize: 14
// },
// formatter: function (data) {
// return data.value + '%'
// }
// }
// }
// ]
// }
// let echart = document.getElementById('echart_d02')
// this.myCharts02 = this.$echarts.init(echart)
// this.myCharts02.setOption(option)
// if (names.length > 7) {
// let t = 1
// let stotal = total.slice(0, 7)
// let snames = names.slice(0, 7)
// this.timer4 = setInterval(() => {
// stotal.shift()
// stotal.push(total[t + 6])
// snames.shift()
// snames.push(names[t + 6])
// this.myCharts02.setOption({
// xAxis: {
// data: snames
// },
// series: [
// {data: stotal}
// ]
// })
// if (t + 7 < names.length) {
// t++
// } else {
// t = -6
// }
// }, 2000)
// }
// },
setEchart10 () { setEchart10 () {
// 右3 // 右3
let total = [] let total = []
@@ -1498,7 +1309,7 @@ export default {
show: false, // 为true滚动条出现 show: false, // 为true滚动条出现
type: 'slider', // type:'inside'，滚动条在最下面，鼠标点击滚动 type: 'slider', // type:'inside'，滚动条在最下面，鼠标点击滚动
startValue: 0, // 从头开始。 startValue: 0, // 从头开始。
endValue: 6 // end百分比显示范围，endValue具体显示几个数值 endValue: 9 // end百分比显示范围，endValue具体显示几个数值
} }
], ],
grid: { grid: {
@@ -1526,7 +1337,6 @@ export default {
rotate: 50 rotate: 50
}, },
data: names data: names
// data: names.length >= 7 ? names.slice(0, 7) : names
}, },
yAxis: { yAxis: {
axisTick: { axisTick: {
@@ -1576,7 +1386,6 @@ export default {
}, },
// data: [100, 51, 90, 41, 91, 61, 51] // data: [100, 51, 90, 41, 91, 61, 51]
data: total data: total
// data: total.length >= 7 ? total.slice(0, 7) : total
} }
] ]
} }
@@ -1587,30 +1396,6 @@ export default {
window.addEventListener('resize', () => { window.addEventListener('resize', () => {
this.myCharts10.resize() this.myCharts10.resize()
}) })
// if (names.length > 7) {
// let t = 1
// let stotal = total.slice(0, 7)
// let snames = names.slice(0, 7)
// this.timer4 = setInterval(() => {
// stotal.shift()
// stotal.push(total[t + 6])
// snames.shift()
// snames.push(names[t + 6])
// this.myCharts10.setOption({
// xAxis: {
// data: snames
// },
// series: [
// {data: stotal}
// ]
// })
// if (t + 7 < names.length) {
// t++
// } else {
// t = -6
// }
// }, 2000)
// }
}, },
autoMove (option, type) { autoMove (option, type) {
if (type === 1) { if (type === 1) {
@@ -1640,7 +1425,7 @@ export default {
if (type === 3) { if (type === 3) {
this.timeOut3 = setInterval(() => { this.timeOut3 = setInterval(() => {
if (Number(option.dataZoom[0].endValue) === option.series[0].data.length - 1) { if (Number(option.dataZoom[0].endValue) === option.series[0].data.length - 1) {
option.dataZoom[0].endValue = 6 option.dataZoom[0].endValue = 9
option.dataZoom[0].startValue = 0 option.dataZoom[0].startValue = 0
} else { } else {
option.dataZoom[0].endValue = option.dataZoom[0].endValue + 1 option.dataZoom[0].endValue = option.dataZoom[0].endValue + 1
@@ -1681,7 +1466,6 @@ export default {
async _deviceUseRate () { async _deviceUseRate () {
let res = await deviceUseRate() let res = await deviceUseRate()
if (res.code === '1') { if (res.code === '1') {
// console.log(res.result)
this.chartData1 = res.result this.chartData1 = res.result
if (res.result.length) { if (res.result.length) {
clearInterval(this.timeOut2) clearInterval(this.timeOut2)
@@ -1696,7 +1480,6 @@ export default {
async _oeeAndTeep () { async _oeeAndTeep () {
let res = await oeeAndTeep() let res = await oeeAndTeep()
if (res.code === '1') { if (res.code === '1') {
// console.log(res.result)
this.data03 = res.result this.data03 = res.result
this.setEchart03() // 中1 this.setEchart03() // 中1
} else { } else {
@@ -1707,7 +1490,6 @@ export default {
async _queryDeviceByWork () { async _queryDeviceByWork () {
let res = await queryDeviceByWork() let res = await queryDeviceByWork()
if (res.code === '1') { if (res.code === '1') {
// console.log(res.result)
this.xData = [] this.xData = []
this.yData = [] this.yData = []
this.taskDate = [] this.taskDate = []
@@ -1730,7 +1512,6 @@ export default {
async _deviceCensus () { async _deviceCensus () {
let res = await deviceCensus() let res = await deviceCensus()
if (res.code === '1') { if (res.code === '1') {
// console.log(res.result)
this.data05_d0 = [] this.data05_d0 = []
this.data05_d1 = [] this.data05_d1 = []
this.data05_d2 = [] this.data05_d2 = []
@@ -1752,7 +1533,6 @@ export default {
async _deviceStatusList () { async _deviceStatusList () {
let res = await deviceStatusList() let res = await deviceStatusList()
if (res.code === '1') { if (res.code === '1') {
// console.log(res.result)
// let colors = ['#2D7CEB', '#07E083', '#00D5FF', '#CC6060', '#fc0'] // let colors = ['#2D7CEB', '#07E083', '#00D5FF', '#CC6060', '#fc0']
res.result.map((e, i) => { res.result.map((e, i) => {
if (e.device_status === '02') { if (e.device_status === '02') {
@@ -1782,7 +1562,6 @@ export default {
if (res.code === '1') { if (res.code === '1') {
this.data06_d0 = [] this.data06_d0 = []
this.data06_d1 = [] this.data06_d1 = []
// console.log(res.result)
res.result.map((e, i) => { res.result.map((e, i) => {
this.data06_d0.push(e.device_name) this.data06_d0.push(e.device_name)
this.data06_d1.push(e.err_num) this.data06_d1.push(e.err_num)
@@ -1796,7 +1575,6 @@ export default {
async _deviceErrorInfo () { async _deviceErrorInfo () {
let res = await deviceErrorInfo() let res = await deviceErrorInfo()
if (res.code === '1') { if (res.code === '1') {
// console.log(res.result)
this.array2 = res.result this.array2 = res.result
} else { } else {
this.Dialog(res.desc) this.Dialog(res.desc)
@@ -1806,7 +1584,6 @@ export default {
async _errCensus () { async _errCensus () {
let res = await errCensus() let res = await errCensus()
if (res.code === '1') { if (res.code === '1') {
// console.log(res.result)
this.chartData2 = res.result this.chartData2 = res.result
if (res.result.length) { if (res.result.length) {
clearInterval(this.timeOut3) clearInterval(this.timeOut3)