<template>
|
<div class="main">
|
<dv-border-box-7>
|
<div class="d-flex pt-2 pl-2">
|
<div class="d-flex">
|
<span class="fs-xl text mx-2">OP070螺栓拧紧</span>
|
</div>
|
</div>
|
<div class="item bg-color-black">
|
<CenterChart
|
:id="rate[0].id"
|
:tips="rate[0].tips"
|
:colorObj="rate[0].colorData"
|
/>
|
</div>
|
<div style="width: 110px;height: 78px;margin-left: 7px;background-color: #171c33">
|
<div style="width: 120px;height: 30px">
|
<span style="margin-right: 73px;margin-top: 15px;float: right;font-size: 20px">合格</span>
|
</div>
|
<div style="margin-left: 45px;margin-top: 20px">
|
<span style="font-size: 30px;color: #71CAFC">{{OK1}}</span>
|
</div>
|
</div>
|
<div style="width: 110px;height: 78px;margin-left: 133px;margin-top: -78px;background-color: #171c33">
|
<div style="width: 140px;height: 30px">
|
<span style="margin-right: 72px;float: right;margin-top: -20px;font-size: 20px">不合格</span>
|
</div>
|
<div style="margin-left: 50px;margin-top: 20px">
|
<span style="font-size: 30px;color: #FB9D7E">{{NG1}}</span>
|
</div>
|
</div>
|
</dv-border-box-7>
|
<dv-border-box-7>
|
<div class="d-flex pt-2 pl-2">
|
<div class="d-flex">
|
<span class="fs-xl text mx-2">OP100合箱螺栓拧紧</span>
|
</div>
|
</div>
|
<div class="item bg-color-black">
|
<CenterChart
|
:id="rate[1].id"
|
:tips="rate[1].tips"
|
:colorObj="rate[1].colorData"
|
/>
|
</div>
|
<div style="width: 110px;height: 78px;margin-left: 7px;background-color: #171c33">
|
<div style="width: 120px;height: 30px">
|
<span style="margin-right: 73px;margin-top: 15px;float: right;font-size: 20px">合格</span>
|
</div>
|
<div style="margin-left: 45px;margin-top: 20px">
|
<span style="font-size: 30px;color: #71CAFC">{{OK2}}</span>
|
</div>
|
</div>
|
<div style="width: 110px;height: 78px;margin-left: 133px;margin-top: -78px;background-color: #171c33">
|
<div style="width: 140px;height: 30px">
|
<span style="margin-right: 72px;float: right;margin-top: -20px;font-size: 20px">不合格</span>
|
</div>
|
<div style="margin-left: 50px;margin-top: 20px">
|
<span style="font-size: 30px;color: #FB9D7E">{{NG2}}</span>
|
</div>
|
</div>
|
</dv-border-box-7>
|
<dv-border-box-7>
|
<div class="d-flex pt-2 pl-2">
|
<div class="d-flex">
|
<span class="fs-xl text mx-2">OP140绝缘耐压检测</span>
|
</div>
|
</div>
|
<div class="item bg-color-black">
|
<CenterChart
|
:id="rate[2].id"
|
:tips="rate[2].tips"
|
:colorObj="rate[2].colorData"
|
/>
|
</div>
|
<div style="width: 110px;height: 78px;margin-left: 7px;background-color: #171c33">
|
<div style="width: 120px;height: 30px">
|
<span style="margin-right: 73px;margin-top: 15px;float: right;font-size: 20px">合格</span>
|
</div>
|
<div style="margin-left: 45px;margin-top: 20px">
|
<span style="font-size: 30px;color: #71CAFC">{{OK3}}</span>
|
</div>
|
</div>
|
<div style="width: 110px;height: 78px;margin-left: 133px;margin-top: -78px;background-color: #171c33">
|
<div style="width: 140px;height: 30px">
|
<span style="margin-right: 72px;float: right;margin-top: -20px;font-size: 20px">不合格</span>
|
</div>
|
<div style="margin-left: 50px;margin-top: 20px">
|
<span style="font-size: 30px;color: #FB9D7E">{{NG3}}</span>
|
</div>
|
</div>
|
</dv-border-box-7>
|
<dv-border-box-7>
|
<div class="d-flex pt-2 pl-2">
|
<div class="d-flex">
|
<span class="fs-xl text mx-2">OP150性能测试</span>
|
</div>
|
</div>
|
<div class="item bg-color-black">
|
<CenterChart
|
:id="rate[3].id"
|
:tips="rate[3].tips"
|
:colorObj="rate[3].colorData"
|
/>
|
</div>
|
<div style="width: 110px;height: 78px;margin-left: 7px;background-color: #171c33">
|
<div style="width: 120px;height: 30px">
|
<span style="margin-right: 73px;margin-top: 15px;float: right;font-size: 20px">合格</span>
|
</div>
|
<div style="margin-left: 45px;margin-top: 20px">
|
<span style="font-size: 30px;color: #71CAFC">{{OK4}}</span>
|
</div>
|
</div>
|
<div style="width: 110px;height: 78px;margin-left: 133px;margin-top: -78px;background-color: #171c33">
|
<div style="width: 140px;height: 30px">
|
<span style="margin-right: 72px;float: right;margin-top: -20px;font-size: 20px">不合格</span>
|
</div>
|
<div style="margin-left: 50px;margin-top: 20px">
|
<span style="font-size: 30px;color: #FB9D7E">{{NG4}}</span>
|
</div>
|
</div>
|
</dv-border-box-7>
|
<dv-border-box-7>
|
<div class="d-flex pt-2 pl-2">
|
<div class="d-flex">
|
<span class="fs-xl text mx-2">EOP080PCBA螺栓拧紧</span>
|
</div>
|
</div>
|
<div class="item bg-color-black">
|
<CenterChart
|
:id="rate[4].id"
|
:tips="rate[4].tips"
|
:colorObj="rate[4].colorData"
|
/>
|
</div>
|
<div style="width: 110px;height: 78px;margin-left: 7px;background-color: #171c33">
|
<div style="width: 120px;height: 30px">
|
<span style="margin-right: 73px;margin-top: 15px;float: right;font-size: 20px">合格</span>
|
</div>
|
<div style="margin-left: 45px;margin-top: 20px">
|
<span style="font-size: 30px;color: #71CAFC">{{OK5}}</span>
|
</div>
|
</div>
|
<div style="width: 110px;height: 78px;margin-left: 133px;margin-top: -78px;background-color: #171c33">
|
<div style="width: 140px;height: 30px">
|
<span style="margin-right: 72px;float: right;margin-top: -20px;font-size: 20px">不合格</span>
|
</div>
|
<div style="margin-left: 50px;margin-top: 20px">
|
<span style="font-size: 30px;color: #FB9D7E">{{NG5}}</span>
|
</div>
|
</div>
|
</dv-border-box-7>
|
<dv-border-box-7>
|
<div class="d-flex pt-2 pl-2">
|
<div class="d-flex">
|
<span class="fs-xl text mx-2">EOP090PCB焊接</span>
|
</div>
|
</div>
|
<div class="item bg-color-black">
|
<CenterChart
|
:id="rate[5].id"
|
:tips="rate[5].tips"
|
:colorObj="rate[5].colorData"
|
/>
|
</div>
|
<div style="width: 110px;height: 78px;margin-left: 7px;background-color: #171c33">
|
<div style="width: 120px;height: 30px">
|
<span style="margin-right: 73px;margin-top: 15px;float: right;font-size: 20px">合格</span>
|
</div>
|
<div style="margin-left: 45px;margin-top: 20px">
|
<span style="font-size: 30px;color: #71CAFC">{{OK6}}</span>
|
</div>
|
</div>
|
<div style="width: 110px;height: 78px;margin-left: 133px;margin-top: -78px;background-color: #171c33">
|
<div style="width: 140px;height: 30px">
|
<span style="margin-right: 72px;float: right;margin-top: -20px;font-size: 20px">不合格</span>
|
</div>
|
<div style="margin-left: 50px;margin-top: 20px">
|
<span style="font-size: 30px;color: #FB9D7E">{{NG6}}</span>
|
</div>
|
</div>
|
</dv-border-box-7>
|
</div>
|
</template>
|
|
<script>
|
import CenterChart from '@/components/echart/center/centerChartRate'
|
export default {
|
name: "bottom",
|
components: {
|
CenterChart
|
},
|
data() {
|
return {
|
value:'',
|
NG1: 0,
|
NG2: 0,
|
NG3: 0,
|
NG4: 0,
|
NG5: 0,
|
NG6: 0,
|
OK1: 30,
|
OK2: 30,
|
OK3: 30,
|
OK4: 30,
|
OK5: 30,
|
OK6: 30,
|
rate: [
|
{
|
id: 'centerRate1',
|
tips: 100,
|
colorData: {
|
textStyle: '#3fc0fb',
|
series: {
|
color: ['#00bcd44a', 'transparent'],
|
dataColor: {
|
normal: '#03a9f4',
|
shadowColor: '#97e2f5'
|
}
|
}
|
}
|
},
|
{
|
id: 'centerRate2',
|
tips: 100,
|
colorData: {
|
textStyle: '#3fc0fb',
|
series: {
|
color: ['#00bcd44a', 'transparent'],
|
dataColor: {
|
normal: '#03a9f4',
|
shadowColor: '#97e2f5'
|
}
|
}
|
}
|
},
|
{
|
id: 'centerRate3',
|
tips: 100,
|
colorData: {
|
textStyle: '#3fc0fb',
|
series: {
|
color: ['#00bcd44a', 'transparent'],
|
dataColor: {
|
normal: '#03a9f4',
|
shadowColor: '#97e2f5'
|
}
|
}
|
}
|
},
|
{
|
id: 'centerRate4',
|
tips: 100,
|
colorData: {
|
textStyle: '#3fc0fb',
|
series: {
|
color: ['#00bcd44a', 'transparent'],
|
dataColor: {
|
normal: '#03a9f4',
|
shadowColor: '#97e2f5'
|
}
|
}
|
}
|
},
|
{
|
id: 'centerRate5',
|
tips: 100,
|
colorData: {
|
textStyle: '#3fc0fb',
|
series: {
|
color: ['#00bcd44a', 'transparent'],
|
dataColor: {
|
normal: '#03a9f4',
|
shadowColor: '#97e2f5'
|
}
|
}
|
}
|
},
|
{
|
id: 'centerRate6',
|
tips: 100,
|
colorData: {
|
textStyle: '#3fc0fb',
|
series: {
|
color: ['#00bcd44a', 'transparent'],
|
dataColor: {
|
normal: '#03a9f4',
|
shadowColor: '#97e2f5'
|
}
|
}
|
}
|
}
|
],
|
}
|
},
|
mounted() {
|
this.tops();
|
this.changeTiming();
|
this.$bus.$on('refresh-components', (value) => {
|
// 刷新初始化方法
|
this.value = value;
|
this.tops()
|
})
|
},
|
methods: {
|
tops(){
|
this.$http.get('http://172.20.1.10:8080/productionOrdeInfo/bottomData?workOrderNo='+this.value)
|
// this.$http.get('http://127.0.0.1:8080/productionOrdeInfo/bottomData?workOrderNo='+this.value)
|
.then((response)=>{
|
this.NG1 = response.data.data.unqualifiedList[0];
|
this.NG2 = response.data.data.unqualifiedList[1];
|
this.NG3 = response.data.data.unqualifiedList[2];
|
this.NG4 = response.data.data.unqualifiedList[3];
|
this.NG5 = response.data.data.unqualifiedList[4];
|
this.NG6 = response.data.data.unqualifiedList[5];
|
|
this.OK1 = response.data.data.qualifiedList[0];
|
this.OK2 = response.data.data.qualifiedList[1];
|
this.OK3 = response.data.data.qualifiedList[2];
|
this.OK4 = response.data.data.qualifiedList[3];
|
this.OK5 = response.data.data.qualifiedList[4];
|
this.OK6 = response.data.data.qualifiedList[5];
|
|
this.rate[0].tips = response.data.data.passRate[0];
|
this.rate[1].tips = response.data.data.passRate[1];
|
this.rate[2].tips = response.data.data.passRate[2];
|
this.rate[3].tips = response.data.data.passRate[3];
|
this.rate[4].tips = response.data.data.passRate[4];
|
this.rate[5].tips = response.data.data.passRate[5];
|
})
|
},
|
changeTiming() {
|
setInterval(() => {
|
this.tops();
|
}, 300000)
|
},
|
}
|
}
|
</script>
|
|
<style scoped>
|
.main{
|
display: grid;
|
grid-template-columns: 3fr 3fr 3fr 3fr 3fr 3fr;
|
height: 297px;
|
width: 1518px;
|
}
|
.text {
|
color: #c3cbde;
|
font-size: 20px;
|
margin-top: -1px;
|
}
|
|
</style>
|