看板修改

master
suixy 2 months ago
parent 34247b566a
commit 1336ef3554

@ -18,12 +18,15 @@
<div class="topNum bootRate"> <div class="topNum bootRate">
<span class="text" style="width: 5vw;letter-spacing: 0.4vw">开机率</span> <span class="text" style="width: 5vw;letter-spacing: 0.4vw">开机率</span>
<span></span> <span></span>
<span class="num">{{ runningData.runningRate }}</span> <!-- <span class="num">{{ runningData.runningRate }}</span>-->
<span class="num">{{
((((Math.min((runningData.RUNNINGCOUNT || 0) + runNum, runningData.TOTALCOUNT) || 0) / runningData.TOTALCOUNT) || 0) * 100) < 100 ? (((((Math.min((runningData.RUNNINGCOUNT || 0) + runNum, runningData.TOTALCOUNT) || 0) / runningData.TOTALCOUNT) || 0) * 100).toFixed(2)) : '100'
}}%</span>
</div> </div>
<div class="topNum runNum"> <div class="topNum runNum">
<span class="text">运行</span> <span class="text">运行</span>
<span></span> <span></span>
<span class="num">{{ Math.min((runningData.RUNNINGCOUNT||0) + 5,runningData.TOTALCOUNT) }}</span> <span class="num">{{ Math.min((runningData.RUNNINGCOUNT || 0) + runNum, runningData.TOTALCOUNT) || 0 }}</span>
<span class="unit"></span> <span class="unit"></span>
</div> </div>
<div class="topNum shutdownNum"> <div class="topNum shutdownNum">
@ -48,7 +51,7 @@
<div class="topNum unactivatedNum"> <div class="topNum unactivatedNum">
<span class="text">未开机</span> <span class="text">未开机</span>
<span></span> <span></span>
<span class="num">{{ Math.max((runningData.NOTSTARTEDCOUNT ||0) - 5 ,0) }}</span> <span class="num">{{ Math.max((runningData.NOTSTARTEDCOUNT || 0) - runNum, 0) }}</span>
<span class="unit"></span> <span class="unit"></span>
</div> </div>
<div class="centerContent"> <div class="centerContent">
@ -60,19 +63,27 @@
<div class="itemType itemType2" v-if="i.STATUSCODE===1"></div> <div class="itemType itemType2" v-if="i.STATUSCODE===1"></div>
<div class="itemType itemType3" v-if="i.STATUSCODE===0"></div> <div class="itemType itemType3" v-if="i.STATUSCODE===0"></div>
<div class="itemTime itemTime0" v-if="i.STATUSCODE===2"> <div class="itemTime itemTime0" v-if="i.STATUSCODE===2">
<span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{ parseFloat(i.value1||'0').toFixed(1) }}</span> <span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{
parseFloat(i.value1 || '0').toFixed(1)
}}</span>
<span>h</span> <span>h</span>
</div> </div>
<div class="itemTime itemTime1" v-if="i.STATUSCODE===3"> <div class="itemTime itemTime1" v-if="i.STATUSCODE===3">
<span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{ parseFloat(i.value1||'0').toFixed(1) }}</span> <span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{
parseFloat(i.value1 || '0').toFixed(1)
}}</span>
<span>h</span> <span>h</span>
</div> </div>
<div class="itemTime itemTime2" v-if="i.STATUSCODE===1"> <div class="itemTime itemTime2" v-if="i.STATUSCODE===1">
<span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{ parseFloat(i.value1||'0').toFixed(1) }}</span> <span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{
parseFloat(i.value1 || '0').toFixed(1)
}}</span>
<span>h</span> <span>h</span>
</div> </div>
<div class="itemTime itemTime3" v-if="i.STATUSCODE===0"> <div class="itemTime itemTime3" v-if="i.STATUSCODE===0">
<span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{ parseFloat(i.value1||'0').toFixed(1) }}</span> <span style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{
parseFloat(i.value1 || '0').toFixed(1)
}}</span>
<span>h</span> <span>h</span>
</div> </div>
<div class="itemText">待机时长</div> <div class="itemText">待机时长</div>
@ -85,19 +96,27 @@
<div class="itemType itemType2" v-if="i.STATUSCODE===1"></div> <div class="itemType itemType2" v-if="i.STATUSCODE===1"></div>
<div class="itemType itemType3" v-if="i.STATUSCODE===0"></div> <div class="itemType itemType3" v-if="i.STATUSCODE===0"></div>
<div class="itemTime itemTime0" v-if="i.STATUSCODE===2"> <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 style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{
timeData[i.DEVICECODE] || '0'
}}</span>
<span>h</span> <span>h</span>
</div> </div>
<div class="itemTime itemTime1" v-if="i.STATUSCODE===3"> <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 style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{
timeData[i.DEVICECODE] || '0'
}}</span>
<span>h</span> <span>h</span>
</div> </div>
<div class="itemTime itemTime2" v-if="i.STATUSCODE===1"> <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 style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{
timeData[i.DEVICECODE] || '0'
}}</span>
<span>h</span> <span>h</span>
</div> </div>
<div class="itemTime itemTime3" v-if="i.STATUSCODE===0"> <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 style="font-size: 1.5vw;margin-right: 0.2vw;;font-weight: 700">{{
timeData[i.DEVICECODE] || '0'
}}</span>
<span>h</span> <span>h</span>
</div> </div>
<div class="itemText">待机时长</div> <div class="itemText">待机时长</div>
@ -215,20 +234,15 @@ export default {
], ],
isData: false, isData: false,
configDialogVisible: false, configDialogVisible: false,
form: { form: {},
},
runningData: {}, runningData: {},
deviceData: [], deviceData: [],
timeData: {} timeData: {},
runNum: 0,
} }
}, },
async mounted() { async mounted() {
await this.getData() await this.getData()
getSimulateData({customCode: 'board-3' || '', customType: 1}).then(val => {
this.row = val.rows[0]
this.form = JSON.parse(val.rows[0].customData);
this.isData = true
})
this.$refs.chart1.setData({ this.$refs.chart1.setData({
title: [ title: [
{ {
@ -380,6 +394,12 @@ export default {
this.timeData[e.DEVICECODE] = ((e.STARTTIME / 60 / 60) || 0).toFixed(1) this.timeData[e.DEVICECODE] = ((e.STARTTIME / 60 / 60) || 0).toFixed(1)
}) })
}) })
getSimulateData({customCode: 'board-3' || '', customType: 1}).then(val => {
this.row = val.rows[0]
this.form = JSON.parse(val.rows[0].customData);
this.isData = true
this.runNum = this.form.table1.filter(v => v.STATUSCODE == 1).length
})
}, },
save() { save() {
@ -389,6 +409,7 @@ export default {
}).then(res => { }).then(res => {
Message({message: '保存成功', type: 'success'}) Message({message: '保存成功', type: 'success'})
this.configDialogVisible = false this.configDialogVisible = false
this.runNum = this.form.table1.filter(v => v.STATUSCODE == 1).length
}) })
} }
}, },
@ -411,6 +432,7 @@ export default {
top: 0; top: 0;
left: 0; left: 0;
} }
.top { .top {
position: absolute; position: absolute;
width: 12vw; width: 12vw;
@ -427,6 +449,7 @@ export default {
color: #d6eaed; color: #d6eaed;
letter-spacing: 0.1vw; letter-spacing: 0.1vw;
} }
.headTitle { .headTitle {
position: absolute; position: absolute;
top: 5%; top: 5%;

@ -107,10 +107,10 @@
form.isSimulate ? form.text12 : deviceStatusData.repairCount form.isSimulate ? form.text12 : deviceStatusData.repairCount
}}</span> }}</span>
</div> </div>
<div class="text3" style="top: 35.15%;left: 5.5%;">工单进度</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: 35.15%;left: 75%;">累计维修分析</div>
<div class="text3" style="top: 63.05%;left: 5.5%;">质量追溯</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: 30.2%;">设备总产量</div>
<div class="text3" style="top: 63.05%;left: 75%;">当日维修趋势</div> <div class="text3" style="top: 63.05%;left: 75%;">当日维修趋势</div>
<div class="deviceError" v-if="form.isSimulate ? form.view1 : alarmInfoData.hasAlarm "> <div class="deviceError" v-if="form.isSimulate ? form.view1 : alarmInfoData.hasAlarm ">
<div class="icon"></div> <div class="icon"></div>
@ -175,6 +175,46 @@
</div> </div>
</vue-seamless-scroll> </vue-seamless-scroll>
</div> </div>
<div class="scrollTable1">
<div style="background-color: #05346044">
<div class="scrollTableItem" style="font-weight: bold;width: 33.33%">
物料名称
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 33.33%">
质量缺陷名称
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 33.33%">
检测时间
</div>
</div>
<vue-seamless-scroll
:class-option="scrollTableOption"
:data="form.isSimulate ? form.table1 : qualityInspectionList"
class="case-item"
:key="key"
style="height: calc(100% - 20px - 1vw - 0.4vw);overflow: hidden;"
>
<div
v-for="(item, index) in form.isSimulate ? form.table1 : qualityInspectionList"
:key="index"
>
<div :style='"background-color:" + ((index % 2 === 0)? "#05346022":"#05346044") '>
<div
class="scrollTableItem" style="width: 33.33%;font-size: 0.8vw">
{{ form.isSimulate ? item.text1 : item.materialName }}
</div>
<div
class="scrollTableItem" style="width: 33.33%;font-size: 0.8vw">
{{ form.isSimulate ? item.text2 : item.qualityDefectName }}
</div>
<div
class="scrollTableItem" style="width: 33.33%;font-size: 0.8vw">
{{ form.isSimulate ? item.text3 : item.inspectorTime }}
</div>
</div>
</div>
</vue-seamless-scroll>
</div>
<div class="repairTimes"> <div class="repairTimes">
<div class="item" v-for="(i,k) in form.isSimulate ? form.table2 : repairAnalysisList "> <div class="item" v-for="(i,k) in form.isSimulate ? form.table2 : repairAnalysisList ">
<div class="num">{{ k + 1 }}</div> <div class="num">{{ k + 1 }}</div>
@ -185,12 +225,12 @@
<div class="times">{{ form.isSimulate ? i.text3 : i.repairCount }}</div> <div class="times">{{ form.isSimulate ? i.text3 : i.repairCount }}</div>
</div> </div>
</div> </div>
<div class="chart1"> <!-- <div class="chart1">-->
<Chart ref="chart1"></Chart> <!-- <Chart ref="chart1"></Chart>-->
</div> <!-- </div>-->
<div class="chart4"> <!-- <div class="chart4">-->
<Chart ref="chart4"></Chart> <!-- <Chart ref="chart4"></Chart>-->
</div> <!-- </div>-->
<div class="chart2"> <div class="chart2">
<Chart ref="chart2"></Chart> <Chart ref="chart2"></Chart>
</div> </div>
@ -484,6 +524,7 @@ import {
getOrderStatistics, getOrderStatistics,
getProductionTotal, getQualityStatistics, getQualityTraceList, getRepairAnalysisList, getRepairTrendList getProductionTotal, getQualityStatistics, getQualityTraceList, getRepairAnalysisList, getRepairTrendList
} from "@/api/board/board4"; } from "@/api/board/board4";
import {listQualityInspection} from "@/api/report/qualityInspection";
const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100 const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
export default { export default {
@ -577,6 +618,7 @@ export default {
qualityStatisticsData: {}, qualityStatisticsData: {},
qualityTraceList: [], qualityTraceList: [],
deviceProductionList: [], deviceProductionList: [],
qualityInspectionList:[],
runningData: {} runningData: {}
} }
}, },
@ -597,6 +639,9 @@ export default {
}, },
methods: { methods: {
async getData() { async getData() {
listQualityInspection({pageSize:99999999}).then(res => {
this.qualityInspectionList = res.rows
})
getDeviceStatusStatistics().then(e => { getDeviceStatusStatistics().then(e => {
this.runningData = e.data this.runningData = e.data
}) })
@ -633,82 +678,82 @@ export default {
this.chartInit() this.chartInit()
}, },
chartInit() { chartInit() {
this.$refs.chart1.setData({ // this.$refs.chart1.setData({
title: { // title: {
y: 'center', // y: 'center',
left: '60%', // left: '60%',
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}}`, // 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: { // textStyle: {
color: '#ffffff', // color: '#ffffff',
rich: { // rich: {
dot1: { // dot1: {
fontSize: 0.9 * vw, // fontSize: 0.9 * vw,
color: '#ffffff', // color: '#ffffff',
}, // },
dot2: { // dot2: {
fontSize: 0.9 * vw, // fontSize: 0.9 * vw,
color: '#4E97FF', // color: '#4E97FF',
}, // },
name: { // name: {
color: '#fff', // color: '#fff',
fontSize: 1 * vw, // fontSize: 1 * vw,
}, // },
value: { // value: {
color: '#fff', // color: '#fff',
fontSize: 1.1 * vw, // fontSize: 1.1 * vw,
fontWeight: '800', // fontWeight: '800',
} // }
} // }
} // }
}, // },
series: [ // series: [
{ // {
type: "pie", // type: "pie",
center: ["30%", "50%"], // center: ["30%", "50%"],
radius: ['57%', '63%'], // radius: ['57%', '63%'],
itemStyle: { // itemStyle: {
color: '#fff4' // color: '#fff4'
}, // },
labelLine: { // labelLine: {
show: false // show: false
}, // },
data: [1] // data: [1]
}, // },
{ // {
type: "pie", // type: "pie",
label: { // label: {
show: false, // show: false,
}, // },
center: ["30%", "50%"], // center: ["30%", "50%"],
radius: ['54%', '66%'], // radius: ['54%', '66%'],
clockwise: false, // clockwise: false,
labelLine: { // labelLine: {
show: false // show: false
}, // },
itemStyle: { // itemStyle: {
color: '#4E97FF' // color: '#4E97FF'
}, // },
data: [ // data: [
{ // {
value: this.form.isSimulate ? this.form.chart1.value2 : this.qualityStatisticsData.unqualifiedCount, // value: this.form.isSimulate ? this.form.chart1.value2 : this.qualityStatisticsData.unqualifiedCount,
name: '不合格数', // name: '',
itemStyle: { // itemStyle: {
color: '#4E97FF', // color: '#4E97FF',
borderColor: '#000', // borderColor: '#000',
borderWidth: 2 // borderWidth: 2
}, // },
}, // },
{ // {
value: this.form.isSimulate ? this.form.chart1.value1 : this.qualityStatisticsData.qualifiedCount, // value: this.form.isSimulate ? this.form.chart1.value1 : this.qualityStatisticsData.qualifiedCount,
name: '合格数', // name: '',
itemStyle: { // itemStyle: {
color: '#0000', // color: '#0000',
}, // },
}, // },
] // ]
}, // },
] // ]
}) // })
this.$refs.chart2.setData({ this.$refs.chart2.setData({
xAxis: { xAxis: {
data: this.form.isSimulate ? this.form.chart2.map(e => e.value1) : this.deviceProductionList.map(e => e.deviceName), data: this.form.isSimulate ? this.form.chart2.map(e => e.value1) : this.deviceProductionList.map(e => e.deviceName),
@ -921,75 +966,75 @@ export default {
}, },
], ],
}) })
this.$refs.chart4.setData({ // this.$refs.chart4.setData({
radar: { // radar: {
center: ["30%", "50%"], // center: ["30%", "50%"],
radius: '40%', // radius: '40%',
shape: 'circle', // shape: 'circle',
splitNumber: 1, // splitNumber: 1,
splitLine: { // splitLine: {
lineStyle: { // lineStyle: {
color: '#fff4', // color: '#fff4',
width: 1 // width: 1
} // }
}, // },
splitArea: { // splitArea: {
show: false // show: false
}, // },
axisLine: { // axisLine: {
show: false // show: false
}, // },
axisNameGap: 3, // axisNameGap: 3,
axisName: { // axisName: {
rotation: 90, // rotation: 90,
rotate: 90, // rotate: 90,
fontSize: 8, // fontSize: 8,
color: '#ddd', // color: '#ddd',
}, // },
indicator: this.form.isSimulate ? this.form.chart4.map(e => { // indicator: this.form.isSimulate ? this.form.chart4.map(e => {
return {name: e.value1, max: e.value3} // return {name: e.value1, max: e.value3}
}) : this.qualityTraceList.map(e => { // }) : this.qualityTraceList.map(e => {
return {name: e.materialName, max: e.passLimit} // return {name: e.materialName, max: e.passLimit}
}), // }),
//
}, // },
series: [ // series: [
{ // {
name: ' ', // name: ' ',
type: 'radar', // type: 'radar',
symbolSize: 3, // symbolSize: 3,
itemStyle: { // itemStyle: {
color: '#FBFCFC' // color: '#FBFCFC'
}, // },
lineStyle: { // lineStyle: {
color: '#478EEE', // color: '#478EEE',
width: 1, // width: 1,
}, // },
data: [ // data: [
{ // {
value: this.form.isSimulate ? this.form.chart4.map(e => { // value: this.form.isSimulate ? this.form.chart4.map(e => {
return e.value2 // return e.value2
}) : this.qualityTraceList.map(e => { // }) : this.qualityTraceList.map(e => {
return e.passRate // return e.passRate
}), // }),
name: 'Allocated Budget', // name: 'Allocated Budget',
areaStyle: { // areaStyle: {
color: { // color: {
type: 'radial', // type: 'radial',
x: 0.5, // x: 0.5,
y: 0.5, // y: 0.5,
r: 0.5, // r: 0.5,
colorStops: [ // colorStops: [
{offset: 0, color: '#fff0'}, // {offset: 0, color: '#fff0'},
{offset: 1, color: '#4C92F266'} // {offset: 1, color: '#4C92F266'}
] // ]
}, // },
} // }
} // }
] // ]
} // }
] // ]
}) // })
}, },
save() { save() {
updateCustomData({ updateCustomData({
@ -1117,6 +1162,14 @@ export default {
height: 20%; height: 20%;
} }
.scrollTable1 {
position: absolute;
top: 66%;
left: 3.3%;
width: 23.8%;
height: 29%;
}
.scrollTableItem { .scrollTableItem {
color: #65CDF9; color: #65CDF9;
margin: auto 0px; margin: auto 0px;

Loading…
Cancel
Save