修改接口调用

master
suixy 1 week ago
parent a25e72e95b
commit 9bcb12bee4

@ -54,19 +54,19 @@
<div class="itemType itemType3" v-if="i.STATUSCODE===0"></div>
<div class="itemTime itemTime0" v-if="i.STATUSCODE===2">
<span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{ timeData[i.DEVICECODE] || '0' }}</span>
<span>min</span>
<span>h</span>
</div>
<div class="itemTime itemTime1" v-if="i.STATUSCODE===3">
<span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{ timeData[i.DEVICECODE] || '0' }}</span>
<span>min</span>
<span>h</span>
</div>
<div class="itemTime itemTime2" v-if="i.STATUSCODE===1">
<span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{ timeData[i.DEVICECODE] || '0' }}</span>
<span>min</span>
<span>h</span>
</div>
<div class="itemTime itemTime3" v-if="i.STATUSCODE===0">
<span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{ timeData[i.DEVICECODE] || '0' }}</span>
<span>min</span>
<span>h</span>
</div>
<div class="itemText">待机时长</div>
</div>
@ -239,7 +239,7 @@ export default {
this.getData()
timer = setInterval(() => {
this.getData()
}, 1000 * 30)
}, 1000 * 60 * 10)
},
methods: {
getData() {
@ -254,7 +254,7 @@ export default {
setTimeout(() => {
getDeviceStartTimeList().then(res => {
res.data.forEach(e => {
this.timeData[e.DEVICECODE] = ((e.STARTTIME / 60) || 0).toFixed(1)
this.timeData[e.DEVICECODE] = ((e.STARTTIME / 60 / 60) || 0).toFixed(1)
})
})
}, 1000 * 2)

@ -2,98 +2,110 @@
<div class="app-container">
<div class="headTitle">数字化注塑车间管控中心</div>
<div class="centerDevice"></div>
<div class="text1" style="top: 14.7%;left: 5.5%;">今日计划数: <span style="color: #6ACBFD">{{ form.text1 }}</span>
<div class="text1" style="top: 14.7%;left: 5.5%;">今日计划数: <span
style="color: #6ACBFD">{{ form.isSimulate ? form.text1 : orderStatisticsData.planCount }}</span>
</div>
<div class="text1" style="top: 14.7%;left: 16.8%;">今日完成数: <span style="color: #68FD82">{{
form.text2
form.isSimulate ? form.text2 : orderStatisticsData.completeCount
}}</span>
</div>
<div class="text1" style="top: 24%;left: 5.5%;">今日差异数: <span style="color: #FEF16A">{{ form.text3 }}</span>
<div class="text1" style="top: 24%;left: 5.5%;">今日差异数: <span
style="color: #FEF16A">{{ form.isSimulate ? form.text3 : orderStatisticsData.diffCount }}</span>
</div>
<div class="text1" style="top: 24%;left: 16.8%;">今日完成率: <span style="color: #69CBFE">{{ form.text4 }}%</span>
<div class="text1" style="top: 24%;left: 16.8%;">今日完成率: <span
style="color: #69CBFE">{{ form.isSimulate ? form.text4 : orderStatisticsData.completeRate }}%</span>
</div>
<div class="text1" style="top: 12%;left: 29%;">今日用水(t):</div>
<div class="text1" style="top: 12%;left: 44%;">今日用电(kwh):</div>
<div class="text1" style="top: 12%;left: 59%;">今日用气():</div>
<div class="text1" style="top: 19.1%;left: 75%;">正常: <span style="color: #6AFD81">{{ form.text8 }}</span></div>
<div class="text1" style="top: 19.1%;left: 82.4%;">告警: <span style="color: #FFF46C">{{ form.text9 }}</span>
<div class="text1" style="top: 12%;left: 29%;">日累计产量</div>
<div class="text1" style="top: 12%;left: 44%;">月累计产量</div>
<div class="text1" style="top: 12%;left: 59%;">年累计产量</div>
<div class="text1" style="top: 19.1%;left: 75%;">正常: <span
style="color: #6AFD81">{{ form.isSimulate ? form.text8 : deviceStatusData.normalCount }}</span></div>
<div class="text1" style="top: 19.1%;left: 82.4%;">告警: <span
style="color: #FFF46C">{{ form.isSimulate ? form.text9 : deviceStatusData.alarmCount }}</span>
</div>
<div class="text1" style="top: 19.1%;left: 89.8%;">停机: <span style="color: #F9241F">{{ form.text10 }}</span>
<div class="text1" style="top: 19.1%;left: 89.8%;">停机: <span
style="color: #F9241F">{{ form.isSimulate ? form.text10 : deviceStatusData.stopCount }}</span>
</div>
<div class="num1" style="color:#63CDFA;top: 17%;left: 30.05%;">{{
(form.text5 || '').padStart(5, '0').split('')[0]
((form.isSimulate ? form.text5 : (''+productionTotalData.dayTotal)) || '').padStart(5, '0').split('')[0]
}}
</div>
<div class="num1" style="color:#63CDFA;top: 17%;left: 32.55%;">{{
(form.text5 || '').padStart(5, '0').split('')[1]
((form.isSimulate ? form.text5 : (''+productionTotalData.dayTotal)) || '').padStart(5, '0').split('')[1]
}}
</div>
<div class="num1" style="color:#63CDFA;top: 17%;left: 35.05%;">{{
(form.text5 || '').padStart(5, '0').split('')[2]
((form.isSimulate ? form.text5 : (''+productionTotalData.dayTotal)) || '').padStart(5, '0').split('')[2]
}}
</div>
<div class="num1" style="color:#63CDFA;top: 17%;left: 37.55%;">{{
(form.text5 || '').padStart(5, '0').split('')[3]
((form.isSimulate ? form.text5 : (''+productionTotalData.dayTotal)) || '').padStart(5, '0').split('')[3]
}}
</div>
<div class="num1" style="color:#63CDFA;top: 17%;left: 40.05%;">{{
(form.text5 || '').padStart(5, '0').split('')[4]
((form.isSimulate ? form.text5 : (''+productionTotalData.dayTotal)) || '').padStart(5, '0').split('')[4]
}}
</div>
<div class="num1" style="color:#69FD80;top: 17%;left: 45.05%;">{{
(form.text6 || '').padStart(5, '0').split('')[0]
((form.isSimulate ? form.text6 : (''+productionTotalData.monthTotal)) || '').padStart(5, '0').split('')[0]
}}
</div>
<div class="num1" style="color:#69FD80;top: 17%;left: 47.55%;">{{
(form.text6 || '').padStart(5, '0').split('')[1]
((form.isSimulate ? form.text6 : (''+productionTotalData.monthTotal)) || '').padStart(5, '0').split('')[1]
}}
</div>
<div class="num1" style="color:#69FD80;top: 17%;left: 50.05%;">{{
(form.text6 || '').padStart(5, '0').split('')[2]
((form.isSimulate ? form.text6 : (''+productionTotalData.monthTotal)) || '').padStart(5, '0').split('')[2]
}}
</div>
<div class="num1" style="color:#69FD80;top: 17%;left: 52.55%;">{{
(form.text6 || '').padStart(5, '0').split('')[3]
((form.isSimulate ? form.text6 : (''+productionTotalData.monthTotal)) || '').padStart(5, '0').split('')[3]
}}
</div>
<div class="num1" style="color:#69FD80;top: 17%;left: 55.05%;">{{
(form.text6 || '').padStart(5, '0').split('')[4]
((form.isSimulate ? form.text6 : (''+productionTotalData.monthTotal)) || '').padStart(5, '0').split('')[4]
}}
</div>
<div class="num1" style="color:#FEF26A;top: 17%;left: 60.05%;">{{
(form.text7 || '').padStart(5, '0').split('')[0]
((form.isSimulate ? form.text7 : (''+productionTotalData.yearTotal)) || '').padStart(5, '0').split('')[0]
}}
</div>
<div class="num1" style="color:#FEF26A;top: 17%;left: 62.55%;">{{
(form.text7 || '').padStart(5, '0').split('')[1]
((form.isSimulate ? form.text7 : (''+productionTotalData.yearTotal)) || '').padStart(5, '0').split('')[1]
}}
</div>
<div class="num1" style="color:#FEF26A;top: 17%;left: 65.05%;">{{
(form.text7 || '').padStart(5, '0').split('')[2]
((form.isSimulate ? form.text7 : (''+productionTotalData.yearTotal)) || '').padStart(5, '0').split('')[2]
}}
</div>
<div class="num1" style="color:#FEF26A;top: 17%;left: 67.55%;">{{
(form.text7 || '').padStart(5, '0').split('')[3]
((form.isSimulate ? form.text7 : (''+productionTotalData.yearTotal)) || '').padStart(5, '0').split('')[3]
}}
</div>
<div class="num1" style="color:#FEF26A;top: 17%;left: 70.05%;">{{
(form.text7 || '').padStart(5, '0').split('')[4]
((form.isSimulate ? form.text7 : (''+productionTotalData.yearTotal)) || '').padStart(5, '0').split('')[4]
}}
</div>
<div class="text2" style="top: 12.7%;left: 84.7%;">设备总数: <span style="color: #68CBFF">{{ form.text11 }}</span>
<div class="text2" style="top: 12.7%;left: 84.7%;">设备总数: <span style="color: #68CBFF">{{
form.isSimulate ? form.text11 : deviceStatusData.totalCount
}}</span>
</div>
<div class="text2" style="top: 41%;left: 84.7%;">总维修次数: <span style="color: #EF241E">{{ form.text12 }}</span>
<div class="text2" style="top: 41%;left: 84.7%;">总维修次数: <span style="color: #EF241E">{{
form.isSimulate ? form.text12 : deviceStatusData.repairCount
}}</span>
</div>
<div class="text3" style="top: 35.15%;left: 5.5%;">工单进度</div>
<div class="text3" style="top: 35.15%;left: 75%;">维修分析</div>
<div class="text3" style="top: 63.05%;left: 5.5%;">质量追溯</div>
<div class="text3" style="top: 63.05%;left: 30.2%;">设备分析</div>
<div class="text3" style="top: 63.05%;left: 75%;">告警趋势</div>
<div class="deviceError" v-if="form.view1">
<div class="deviceError" v-if="form.isSimulate ? form.view1 : alarmInfoData.hasAlarm ">
<div class="icon"></div>
<div class="text" style="left: 18%">{{ form.info1.text1 }}</div>
<div class="text" style="left: 42%;color: #F42223">{{ form.info1.text2 }}</div>
<div class="text" style="left: 75%">{{ form.info1.text3 }}</div>
<div class="text" style="left: 18%">{{ form.isSimulate ? form.info1.text1 : alarmInfoData.deviceName }}</div>
<div class="text" style="left: 42%;color: #F42223">
{{ form.isSimulate ? form.info1.text2 : alarmInfoData.alarmReason }}
</div>
<div class="text" style="left: 75%">{{ form.isSimulate ? form.info1.text3 : alarmInfoData.alarmTime }}</div>
</div>
<div class="scrollTable">
@ -116,48 +128,48 @@
</div>
<vue-seamless-scroll
:class-option="scrollTableOption"
:data="form.table1"
:data="form.isSimulate ? form.table1 : orderProgressList"
class="case-item"
:key="key"
style="height: calc(100% - 20px - 1vw - 0.4vw);overflow: hidden;"
>
<div
v-for="(item, index) in form.table1"
v-for="(item, index) in form.isSimulate ? form.table1 : orderProgressList"
:key="index"
>
<div :style='"background-color:" + ((index % 2 === 0)? "#05346022":"#05346044") '>
<div
class="scrollTableItem" style="width: 25%">
{{ item.text1 }}
{{ form.isSimulate ? item.text1 : item.materialName }}
</div>
<div
class="scrollTableItem" style="width: 16.66%">
{{ item.text2 }}
{{ form.isSimulate ? item.text2 : item.planCount }}
</div>
<div
class="scrollTableItem" style="width: 16.66%">
{{ item.text3 }}
{{ form.isSimulate ? item.text3 : item.completeCount }}
</div>
<div
class="scrollTableItem" style="width: 16.66%">
{{ item.text4 }}
{{ form.isSimulate ? item.text4 : item.diffCount }}
</div>
<div
class="scrollTableItem" style="width: 25%">
{{ item.text5 }}
{{ form.isSimulate ? item.text5 : item.progress }}
</div>
</div>
</div>
</vue-seamless-scroll>
</div>
<div class="repairTimes">
<div class="item" v-for="(i,k) in form.table2">
<div class="item" v-for="(i,k) in form.isSimulate ? form.table2 : repairAnalysisList ">
<div class="num">{{ k + 1 }}</div>
<div class="deviceName">{{ i.text1 }}</div>
<div class="deviceName">{{ form.isSimulate ? i.text1 : i.deviceName }}</div>
<div class="schedule">
<div class="progressBar" :style="{width: i.text2 + '%'}"></div>
<div class="progressBar" :style="{width: (form.isSimulate ? i.text2: i.percent) + '%'}"></div>
</div>
<div class="times">{{ i.text3 }}</div>
<div class="times">{{ form.isSimulate ? i.text3 : i.repairCount }}</div>
</div>
</div>
<div class="chart1">
@ -183,6 +195,13 @@
:visible.sync="configDialogVisible"
width="70%">
<el-form :inline="true" :model="form" label-width="120px">
<el-form-item label="是否使用模拟数据">
<el-switch
v-model="form.isSimulate"
active-color="#13ce66"
inactive-color="#ff4949">
</el-switch>
</el-form-item>
<el-form-item label="今日计划数">
<el-input v-model="form.text1" autocomplete="off"></el-input>
</el-form-item>
@ -445,6 +464,13 @@ import {getSimulateData} from "@/api/board/getData";
import {updateCustomData} from "@/api/base/customData";
import {Message} from "element-ui";
import {getDeviceStatusStatistics} from "@/api/baseDeviceParamVal/val";
import {
getAlarmInfo, getDeviceProductionList,
getDeviceStatus,
getOrderProgressList,
getOrderStatistics,
getProductionTotal, getQualityStatistics, getQualityTraceList, getRepairAnalysisList, getRepairTrendList
} from "@/api/board/board4";
const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
export default {
@ -527,10 +553,20 @@ export default {
waitTime: 0,
},
isData: false,
row: {}
row: {},
productionTotalData: {},
orderStatisticsData: {},
orderProgressList: [],
deviceStatusData: {},
alarmInfoData: {},
repairAnalysisList: [],
repairTrendList: [],
qualityStatisticsData: {},
qualityTraceList: [],
deviceProductionList:[]
}
},
mounted() {
async mounted() {
getSimulateData({customCode: 'board-1' || '', customType: 1}).then(val => {
this.row = val.rows[0]
this.form = JSON.parse(val.rows[0].customData);
@ -539,14 +575,51 @@ export default {
this.chartInit()
})
})
await this.getData()
setInterval(async () => {
await this.getData()
}, 1000 * 60 * 10)
},
methods: {
async getData(){
getProductionTotal().then(val => {
this.productionTotalData = val.data
})
getOrderStatistics().then(val => {
this.orderStatisticsData = val.data
})
getOrderProgressList().then(val => {
this.orderProgressList = val.data
})
getDeviceStatus().then(val => {
this.deviceStatusData = val.data
})
getAlarmInfo().then(val => {
this.alarmInfoData = val.data
})
getRepairAnalysisList().then(val => {
this.repairAnalysisList = val.data
})
await getRepairTrendList().then(val => {
this.repairTrendList = val.data
})
await getQualityStatistics().then(val => {
this.qualityStatisticsData = val.data
})
await getQualityTraceList().then(val => {
this.qualityTraceList = val.data
})
await getDeviceProductionList().then(val => {
this.deviceProductionList = val.data
})
this.chartInit()
},
chartInit() {
this.$refs.chart1.setData({
title: {
y: 'center',
left: '60%',
text: `{dot1|●} {name|合格数} {value|${this.form.chart1.value1}}\n\n\n{dot2|●} {name|不合格数} {value|${this.form.chart1.value2}}`,
text: `{dot1|●} {name|合格数} {value|${this.form.isSimulate ? this.form.chart1.value1 : this.qualityStatisticsData.qualifiedCount}}\n\n\n{dot2|●} {name|不合格数} {value|${this.form.isSimulate ? this.form.chart1.value2 : this.qualityStatisticsData.unqualifiedCount}}`,
textStyle: {
color: '#ffffff',
rich: {
@ -599,7 +672,7 @@ export default {
},
data: [
{
value: this.form.chart1.value2,
value: this.form.isSimulate ? this.form.chart1.value2 : this.qualityStatisticsData.unqualifiedCount,
name: '不合格数',
itemStyle: {
color: '#4E97FF',
@ -608,7 +681,7 @@ export default {
},
},
{
value: this.form.chart1.value1,
value: this.form.isSimulate ? this.form.chart1.value1 : this.qualityStatisticsData.qualifiedCount,
name: '合格数',
itemStyle: {
color: '#0000',
@ -643,9 +716,12 @@ export default {
fontSize: 8,
color: '#ddd',
},
indicator: this.form.chart4.map(e => {
indicator: this.form.isSimulate ? this.form.chart4.map(e => {
return {name: e.value1, max: e.value3}
})
}) : this.qualityTraceList.map(e => {
return {name: e.materialName, max: e.passLimit}
}),
},
series: [
{
@ -661,8 +737,10 @@ export default {
},
data: [
{
value: this.form.chart4.map(e => {
value: this.form.isSimulate ? this.form.chart4.map(e => {
return e.value2
}) : this.qualityTraceList.map(e => {
return e.passRate
}),
name: 'Allocated Budget',
areaStyle: {
@ -684,7 +762,7 @@ export default {
})
this.$refs.chart2.setData({
xAxis: {
data: this.form.chart2.map(e => e.value1),
data: this.form.isSimulate ? this.form.chart2.map(e => e.value1) : this.deviceProductionList.map(e => e.deviceName),
axisLine: {
lineStyle: {
color: '#377097',
@ -770,7 +848,7 @@ export default {
color: '#66C7FA',
position: 'top',
},
data: this.form.chart2.map(e => e.value2),
data: this.form.isSimulate ? this.form.chart2.map(e => e.value2) : this.deviceProductionList.map(e => e.production),
},
{
type: 'pictorialBar',
@ -785,13 +863,13 @@ export default {
itemStyle: {
color: '#0D2DD7'
},
data: this.form.chart2.map(e => e.value2),
data: this.form.isSimulate ? this.form.chart2.map(e => e.value2) : this.deviceProductionList.map(e => e.production),
}
],
})
this.$refs.chart3.setData({
xAxis: {
data: this.form.chart3.map(e => e.value1),
data: this.form.isSimulate ? this.form.chart3.map(e => e.value1) : this.repairTrendList?.map(e => e.timeHour),
boundaryGap: false,
axisLine: {
lineStyle: {
@ -868,7 +946,7 @@ export default {
label: {
show: false,
},
data: this.form.chart3.map(e => e.value2),
data: this.form.isSimulate ? this.form.chart3.map(e => e.value2) : this.repairTrendList.map(e => e.repairCount),
},
],
})

@ -3,63 +3,89 @@
<div class="headTitle">数字化注塑车间管控中心</div>
<div class="text1" style="top: 11.8%;left: 4.5%;letter-spacing: 0.3vw">
<span>工单总数:</span>
<span style="color: #fff;letter-spacing: 0.2vw"> {{ form.text1 }}</span>
<span style="color: #fff;letter-spacing: 0.2vw"> {{
form.isSimulate ? form.text1 : orderWorkStatisticsData.totalCount
}}</span>
<span style="color: #fff;letter-spacing: 0.2vw"></span>
</div>
<div class="text1" style="top: 11.8%;left: 19%;letter-spacing: 0.5vw">
<span>已完成:</span>
<span style="color: #43FC36;letter-spacing: 0.2vw"> {{ form.text2 }}</span>
<span style="color: #43FC36;letter-spacing: 0.2vw"> {{
form.isSimulate ? form.text2 : orderWorkStatisticsData.completeCount
}}</span>
<span style="color: #fff;letter-spacing: 0.2vw"></span>
</div>
<div class="text1" style="top: 11.8%;left: 33.8%;letter-spacing: 0.5vw">
<span>完成率:</span>
<span style="color: #43FC35;letter-spacing: 0.2vw"> {{ form.text3 }}</span>
<span style="color: #43FC35;letter-spacing: 0.2vw"> {{
form.isSimulate ? form.text3 : orderWorkStatisticsData.completeRate
}}</span>
<span style="color: #fff;letter-spacing: 0.2vw">%</span>
</div>
<div class="text1" style="top: 11.8%;left: 48.2%;letter-spacing: 0.3vw">
<span>停机工单:</span>
<span style="color: #EF0506;letter-spacing: 0.2vw"> {{ form.text4 }}</span>
<span style="color: #EF0506;letter-spacing: 0.2vw"> {{
form.isSimulate ? form.text4 : orderWorkStatisticsData.stopCount
}}</span>
<span style="color: #fff;letter-spacing: 0.2vw"></span>
</div>
<div class="text1" style="top: 11.8%;left: 62.9%;letter-spacing: 0.1vw">
<span>平均响应时间:</span>
<span style="color: #ECB808;letter-spacing: 0.2vw"> {{ form.text5 }}</span>
<span style="color: #ECB808;letter-spacing: 0.2vw"> {{
form.isSimulate ? form.text5 : (parseFloat(repairTimeStatisticsData.avgResponseTime) > 1000 ? '无响应' : repairTimeStatisticsData.avgResponseTime)
}}</span>
<span style="color: #fff;letter-spacing: 0.2vw">min</span>
</div>
<div class="text1" style="top: 11.8%;left: 84%;letter-spacing: 0.1vw">
<span>平均维修时间:</span>
<span style="color: #E10806;letter-spacing: 0.2vw"> {{ form.text6 }}</span>
<span style="color: #E10806;letter-spacing: 0.2vw"> {{
form.isSimulate ? form.text6 : repairTimeStatisticsData.avgRepairTime
}}</span>
<span style="color: #fff;letter-spacing: 0.2vw">H</span>
</div>
<div class="text2" style="top: 19.7%;left: 11%;">设备保养执行情况</div>
<div class="text2" style="top: 19.7%;left: 42.5%;">设备巡检执行情况</div>
<div class="text2" style="top: 19.7%;left: 74.5%;">故障原因统计TOP5</div>
<div class="text2" style="top: 59.7%;left: 9.7%;">故障数量曲线</div>
<div class="text2" style="top: 59.7%;left: 74.5%;">备件消耗费用TOP5</div>
<div class="text2" style="top: 59.7%;left: 74.5%;">机台产量TOP5</div>
<div class="text3" style="top: 31%;left: 20.9%;">计划保养</div>
<div class="text3" style="top: 31%;left: 27.5%">已保养</div>
<div class="text3" style="top: 42.5%;left: 18.8%;">待保养</div>
<div class="text3" style="top: 42.5%;left: 24.6%;">保养中</div>
<div class="text3" style="top: 42.5%;left: 30.3%;">待验证</div>
<div class="text4" style="top: 34.3%;left: 20.9%;font-size: 1vw">{{ form.text7 }}</div>
<div class="text4" style="top: 34.3%;left: 27.5%;font-size: 1vw">{{ form.text8 }}</div>
<div class="text4" style="top: 45.6%;left: 18.8%;">{{ form.text9 }}% / <span style="font-size: 0.6vw">{{
form.text10
<div class="text4" style="top: 34.3%;left: 20.9%;font-size: 1vw">
{{ form.isSimulate ? form.text7 : maintStatisticsData.planCount }}
</div>
<div class="text4" style="top: 34.3%;left: 27.5%;font-size: 1vw">
{{ form.isSimulate ? form.text8 : maintStatisticsData.completeCount }}
</div>
<div class="text4" style="top: 45.6%;left: 18.8%;">
{{ form.isSimulate ? form.text9 : maintStatisticsData.waitingCount }}% / <span style="font-size: 0.6vw">{{
form.isSimulate ? form.text10 : maintStatisticsData.waitingRate
}}</span></div>
<div class="text4" style="top: 45.6%;left: 24.6%;">{{ form.text11 }}% / <span
style="font-size: 0.6vw">{{ form.text12 }}</span></div>
<div class="text4" style="top: 45.6%;left: 30.3%;">{{ form.text13 }}% / <span
style="font-size: 0.6vw">{{ form.text14 }}</span></div>
<div class="text4" style="top: 45.6%;left: 24.6%;">{{
form.isSimulate ? form.text11 : maintStatisticsData.doingCount
}}% / <span
style="font-size: 0.6vw">{{ form.isSimulate ? form.text12 : maintStatisticsData.doingRate }}</span></div>
<div class="text4" style="top: 45.6%;left: 30.3%;">
{{ form.isSimulate ? form.text13 : maintStatisticsData.verifyCount }}% / <span
style="font-size: 0.6vw">{{ form.isSimulate ? form.text14 : maintStatisticsData.verifyRate }}</span></div>
<div class="chart1">
<div class="title"><span style="font-size: 1.5vw;font-weight: 800">{{ form.text15 }}</span>%</div>
<div class="title"><span style="font-size: 1.5vw;font-weight: 800">{{
form.isSimulate ? form.text15 : maintStatisticsData.completeRate
}}</span>%
</div>
<div class="subTitle">完成率</div>
<Chart ref="chart1"></Chart>
</div>
<div class="chart2">
<div class="deviceNum">应检设备<span style="color: #56BDFF;font-weight: 800;margin-left: 1vw">{{
form.text16
form.isSimulate ? form.text16 : inspectStatisticsData.deviceCount
}}</span></div>
<div class="title"><span style="font-size: 1.5vw;font-weight: 800">{{ form.text17 }}</span>%</div>
<div class="title"><span style="font-size: 1.5vw;font-weight: 800">{{
form.isSimulate ? form.text17 : inspectStatisticsData.completeRate
}}</span>%
</div>
<div class="subTitle">完成率</div>
<Chart ref="chart2"></Chart>
</div>
@ -76,13 +102,13 @@
</div>
<div class="repairTimes">
<div class="expendImg" v-if="toggle"></div>
<div class="item" v-for="(i,k) in form.chart2" v-else>
<div class="item" v-for="(i,k) in form.isSimulate ? form.chart2 :productionTop5Data " v-else>
<div class="num">{{ k + 1 }}</div>
<div class="deviceName">{{ i.value1 }}</div>
<div class="deviceName">{{ form.isSimulate ? i.value1 : i.deviceName }}</div>
<div class="schedule">
<div class="progressBar" :style="{width: i.value2 + '%'}"></div>
<div class="progressBar" :style="{width: (form.isSimulate ? i.value2 :i.percent ) + '%'}"></div>
</div>
<div class="times">{{ i.value3 }}</div>
<div class="times">{{ form.isSimulate ? i.value3 : i.production }}</div>
</div>
</div>
<div class="config">
@ -94,6 +120,13 @@
:visible.sync="configDialogVisible"
width="70%">
<el-form :inline="true" :model="form" label-width="120px">
<el-form-item label="是否使用模拟数据">
<el-switch
v-model="form.isSimulate"
active-color="#13ce66"
inactive-color="#ff4949">
</el-switch>
</el-form-item>
<el-form-item label="工单总数">
<el-input v-model="form.text1" autocomplete="off"></el-input>
</el-form-item>
@ -251,6 +284,14 @@ import {getSimulateData} from "@/api/board/getData";
import {updateCustomData} from "@/api/base/customData";
import {Message} from "element-ui";
import {getDeviceStatusStatistics} from "@/api/baseDeviceParamVal/val";
import {
getDeviceStatusDistribution, getFaultSourceDistribution, getFaultTrendList,
getInspectStatistics,
getMaintStatistics,
getOrderWorkStatistics, getProductionTop5,
getRepairTimeStatistics
} from "@/api/board/board5";
import Log from "@/views/monitor/job/log.vue";
const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
export default {
@ -303,24 +344,60 @@ export default {
configDialogVisible: false,
toggle: false,
isData: false,
row: {}
row: {},
orderWorkStatisticsData: {},
repairTimeStatisticsData: {},
maintStatisticsData: {},
inspectStatisticsData: {},
deviceStatusDistributionData: {},
faultSourceDistributionData: {},
faultTrendList: [],
productionTop5Data: []
}
},
mounted() {
async mounted() {
getSimulateData({customCode: 'board-2' || '', customType: 1}).then(val => {
this.row = val.rows[0]
this.form = JSON.parse(val.rows[0].customData);
this.isData = true
this.$nextTick(() => {
this.chartInit()
})
})
await this.getData()
setInterval(async () => {
await this.getData()
}, 1000 * 60 * 10)
},
methods: {
async getData() {
await getOrderWorkStatistics().then(res => {
this.orderWorkStatisticsData = res.data
})
await getRepairTimeStatistics().then(res => {
this.repairTimeStatisticsData = res.data
})
await getMaintStatistics().then(res => {
this.maintStatisticsData = res.data
})
await getInspectStatistics().then(res => {
this.inspectStatisticsData = res.data
})
await getDeviceStatusDistribution().then(res => {
this.deviceStatusDistributionData = res.data
})
await getFaultSourceDistribution().then(res => {
this.faultSourceDistributionData = res.data
})
await getFaultTrendList().then(res => {
this.faultTrendList = res.data
})
await getProductionTop5().then(res => {
this.productionTop5Data = res.data
})
this.chartInit()
},
chartInit() {
let data = [
{
value: this.form.value1,
value: this.form.isSimulate ? this.form.value1 : this.deviceStatusDistributionData.experimentPercent,
name: '实验设备',
index: 0,
itemStyle: {
@ -330,7 +407,7 @@ export default {
},
},
{
value: this.form.value2,
value: this.form.isSimulate ? this.form.value2 : this.deviceStatusDistributionData.uncheckedPercent,
name: '未检设备',
index: 1,
itemStyle: {
@ -340,7 +417,7 @@ export default {
},
},
{
value: this.form.value3,
value: this.form.isSimulate ? this.form.value3 : this.deviceStatusDistributionData.normalPercent,
name: '正常设备',
index: 2,
itemStyle: {
@ -350,7 +427,7 @@ export default {
},
},
{
value: this.form.value4,
value: this.form.isSimulate ? this.form.value4 : this.deviceStatusDistributionData.abnormalPercent,
index: 3,
name: '异常设备',
itemStyle: {
@ -362,7 +439,7 @@ export default {
]
let chartData = [
{
value: this.form.value5,
value: this.form.isSimulate ? this.form.value5 : this.faultSourceDistributionData.maintainPercent,
name: '维护故障',
index: 0,
itemStyle: {
@ -372,7 +449,7 @@ export default {
},
},
{
value: this.form.value6,
value: this.form.isSimulate ? this.form.value6 : this.faultSourceDistributionData.runningPercent,
name: '运行故障',
index: 1,
itemStyle: {
@ -382,7 +459,7 @@ export default {
},
},
{
value: this.form.value7,
value: this.form.isSimulate ? this.form.value7 : this.faultSourceDistributionData.naturalPercent,
name: '自然故障',
index: 2,
itemStyle: {
@ -407,15 +484,15 @@ export default {
},
data: [
{
value: Math.min(parseFloat(this.form.text15), 100),
name: '合格数',
value: Math.min(parseFloat(this.form.isSimulate ? this.form.text15 : (this.maintStatisticsData.completeCount)), 100),
name: '合格数',
itemStyle: {
color: '#00AFFF'
},
},
{
value: Math.max((100 - parseFloat(this.form.text15)), 0),
name: '合格数',
value: Math.max((100 - parseFloat((this.form.isSimulate ? this.form.text15 : this.maintStatisticsData.completeCount))), 0),
name: '合格数',
itemStyle: {
color: '#0000'
},
@ -554,7 +631,7 @@ export default {
this.$refs.chart4.setData({
xAxis: {
data: this.form.chart1.map(e => e.value1),
data: this.form.isSimulate ? this.form.chart1.map(e => e.value1) : this.faultTrendList.map(e => e.dateValue),
boundaryGap: false,
axisLine: {
lineStyle: {
@ -630,7 +707,7 @@ export default {
label: {
show: false,
},
data: this.form.chart1.map(e => e.value2),
data: this.form.isSimulate ? this.form.chart1.map(e => e.value2) : this.faultTrendList.map(e => e.faultCount),
},
]
})
@ -709,9 +786,9 @@ export default {
.title {
position: absolute;
bottom: 51%;
top: 51%;
left: 50%;
transform: translateX(-50%);
transform: translate(-50%, calc(-100% - 0.4vw));
color: #55BCFE;
font-size: 1.1vw;
letter-spacing: 0.2vw;
@ -746,9 +823,9 @@ export default {
.title {
position: absolute;
bottom: 51%;
top: 51%;
left: 23%;
transform: translateX(-50%);
transform: translate(-50%, calc(-100% - 0.4vw));
color: #55BCFE;
font-size: 1.1vw;
letter-spacing: 0.2vw;

Loading…
Cancel
Save