yinq
/
zs_aucma-mes-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改看板

Browse Source
master
suixy 6 days ago
parent 11ad4c703d
commit 23d14bd458
4 changed files with 234 additions and 141 deletions
Show Stats Download Patch File Download Diff File

9
src/api/baseDeviceParamVal/val.js
Unescape Escape View File

@ -103,3 +103,12 @@ export function getSPCData(query) {
params: query
})
}
// 获取开模数量
export function deviceOpeningCountList(query) {
return request({
url: '/board4/deviceOpeningCountList',
method: 'get',
params: query
})
}

BIN
src/assets/board/boardBg3-4.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.0 MiB

BIN
src/assets/board/boardBg3.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.0 MiB

After

Width:  |  Height:  |  Size: 2.0 MiB

366
src/views/board/board4/index.vue
Unescape Escape View File

@ -2,19 +2,19 @@
<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.isSimulate ? form.text1 : orderStatisticsData.planCount }}</span>
</div>
<div class="text1" style="top: 14.7%;left: 16.8%;">今日完成数: <span style="color: #68FD82">{{
form.isSimulate ? form.text2 : productionTotalData.dayTotal
}}</span>
</div>
<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.isSimulate ? form.text4 : orderStatisticsData.completeRate }}%</span>
</div>
<!-- <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.isSimulate ? form.text2 : productionTotalData.dayTotal-->
<!-- }}</span>-->
<!-- </div>-->
<!-- <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.isSimulate ? form.text4 : orderStatisticsData.completeRate }}%</span>-->
<!-- </div>-->
<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>
@ -35,7 +35,9 @@
style="color: #860F1C">{{ form.isSimulate ? form.text9 : runningData.ALARMCOUNT }}</span>
</div>
<div class="text1" style="top: 19.1%;left: 91.2%;">停机: <span
style="color: #1077BC">{{ form.isSimulate ? form.text9 : Math.max(runningData.NOTSTARTEDCOUNT - runNum, 0) }}</span>
style="color: #1077BC">{{
form.isSimulate ? form.text9 : Math.max(runningData.NOTSTARTEDCOUNT - runNum, 0)
}}</span>
</div>
<div class="num2" style="color:#63CDFA;top: 17%;left: 29.05%;">
{{ (form.isSimulate ? form.text5 : productionTotalData.dayTotal) || '00000' }}
@ -114,9 +116,9 @@
form.isSimulate ? form.text12 : shutDownList.length
}}</span>
</div>
<div class="text3" style="top: 35.15%;left: 5.5%;">生产进度</div>
<div class="text3" style="top: 11.45%;left: 5.2%;">当日开模数</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: 75%;">当日维修趋势</div>-->
<div class="deviceError" v-if="form.isSimulate ? form.view1 : alarmInfoData.hasAlarm ">
@ -128,100 +130,100 @@
<div class="text" style="left: 75%">{{ form.isSimulate ? form.info1.text3 : alarmInfoData.alarmTime }}</div>
</div>
<div class="scrollTable">
<div style="background-color: #05346044">
<div class="scrollTableItem" style="font-weight: bold;width: 25%">
型号
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 16.66%">
计划数
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 16.66%">
完成数
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 16.66%">
差异数
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 25%">
执行进度
</div>
</div>
<vue-seamless-scroll
:class-option="scrollTableOption"
: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.isSimulate ? form.table1 : orderProgressList"
:key="index"
>
<div :style='"background-color:" + ((index % 2 === 0)? "#05346022":"#05346044") '>
<div
class="scrollTableItem" style="width: 25%">
{{ form.isSimulate ? item.text1 : item.materialName }}
</div>
<div
class="scrollTableItem" style="width: 16.66%">
{{ form.isSimulate ? item.text2 : item.planCount }}
</div>
<div
class="scrollTableItem" style="width: 16.66%">
{{ form.isSimulate ? item.text3 : item.completeCount }}
</div>
<div
class="scrollTableItem" style="width: 16.66%">
{{ form.isSimulate ? item.text4 : item.diffCount }}
</div>
<div
class="scrollTableItem" style="width: 25%">
{{ form.isSimulate ? item.text5 : item.progress }}
</div>
</div>
</div>
</vue-seamless-scroll>
</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="scrollTable">-->
<!-- <div style="background-color: #05346044">-->
<!-- <div class="scrollTableItem" style="font-weight: bold;width: 25%">-->
<!-- 型号-->
<!-- </div>-->
<!-- <div class="scrollTableItem" style="font-weight: bold;width: 16.66%">-->
<!-- 计划数-->
<!-- </div>-->
<!-- <div class="scrollTableItem" style="font-weight: bold;width: 16.66%">-->
<!-- 完成数-->
<!-- </div>-->
<!-- <div class="scrollTableItem" style="font-weight: bold;width: 16.66%">-->
<!-- 差异数-->
<!-- </div>-->
<!-- <div class="scrollTableItem" style="font-weight: bold;width: 25%">-->
<!-- 执行进度-->
<!-- </div>-->
<!-- </div>-->
<!-- <vue-seamless-scroll-->
<!-- :class-option="scrollTableOption"-->
<!-- :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.isSimulate ? form.table1 : orderProgressList"-->
<!-- :key="index"-->
<!-- >-->
<!-- <div :style='"background-color:" + ((index % 2 === 0)? "#05346022":"#05346044") '>-->
<!-- <div-->
<!-- class="scrollTableItem" style="width: 25%">-->
<!-- {{ form.isSimulate ? item.text1 : item.materialName }}-->
<!-- </div>-->
<!-- <div-->
<!-- class="scrollTableItem" style="width: 16.66%">-->
<!-- {{ form.isSimulate ? item.text2 : item.planCount }}-->
<!-- </div>-->
<!-- <div-->
<!-- class="scrollTableItem" style="width: 16.66%">-->
<!-- {{ form.isSimulate ? item.text3 : item.completeCount }}-->
<!-- </div>-->
<!-- <div-->
<!-- class="scrollTableItem" style="width: 16.66%">-->
<!-- {{ form.isSimulate ? item.text4 : item.diffCount }}-->
<!-- </div>-->
<!-- <div-->
<!-- class="scrollTableItem" style="width: 25%">-->
<!-- {{ form.isSimulate ? item.text5 : item.progress }}-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </vue-seamless-scroll>-->
<!-- </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="scrollTable2">
<div style="background-color: #05346044">
<div class="scrollTableItem" style="font-weight: bold;width: 25%">
@ -251,25 +253,63 @@
<div
:style='"background-color:" +(item.shutEndTime ? ((index % 2 === 0)? "#05346022":"#05346044"):"#FFEB3B")'>
<div
class="scrollTableItem" style="width: 25%;font-size: 0.8vw" :style="`color:${item.shutEndTime ? '#65cdf9':'#000'}`">
class="scrollTableItem" style="width: 25%;font-size: 0.8vw"
:style="`color:${item.shutEndTime ? '#65cdf9':'#000'}`">
{{ form.isSimulate ? item.text1 : item.deviceName }}
</div>
<div
class="scrollTableItem" style="width: 25%;font-size: 0.8vw" :style="`color:${item.shutEndTime ? '#65cdf9':'#000'}`">
class="scrollTableItem" style="width: 25%;font-size: 0.8vw"
:style="`color:${item.shutEndTime ? '#65cdf9':'#000'}`">
{{ form.isSimulate ? item.text2 : item.shutReason }}
</div>
<div
class="scrollTableItem" style="width: 25%;font-size: 0.8vw" :style="`color:${item.shutEndTime ? '#65cdf9':'#000'}`">
class="scrollTableItem" style="width: 25%;font-size: 0.8vw"
:style="`color:${item.shutEndTime ? '#65cdf9':'#000'}`">
{{ form.isSimulate ? item.text3 : item.shutBeginTime }}
</div>
<div
class="scrollTableItem" style="width: 25%;font-size: 0.8vw" :style="`color:${item.shutEndTime ? '#65cdf9':'#000'}`">
class="scrollTableItem" style="width: 25%;font-size: 0.8vw"
:style="`color:${item.shutEndTime ? '#65cdf9':'#000'}`">
{{ form.isSimulate ? item.text3 : item.shutEndTime }}
</div>
</div>
</div>
</vue-seamless-scroll>
</div>
<div class="scrollTable3">
<div style="background-color: #05346044">
<div class="scrollTableItem" style="font-weight: bold;width: 50%">
设备名称
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 50%">
开模数量
</div>
</div>
<vue-seamless-scroll
:class-option="scrollTableOption"
:data="moldOpeningList"
class="case-item"
:key="key"
style="height: calc(100% - 20px - 1vw - 0.4vw);overflow: hidden;"
>
<div
v-for="(item, index) in moldOpeningList"
:key="index"
>
<div :style='"background-color:" + ((index % 2 === 0)? "#05346022":"#05346044") '>
<div
class="scrollTableItem" style="width: 50%;font-size: 0.8vw">
{{ item.deviceName }}
</div>
<div
class="scrollTableItem" style="width: 50%;font-size: 0.8vw">
{{ item.openingCount }}
</div>
</div>
</div>
</vue-seamless-scroll>
</div>
<!-- <div class="repairTimes">-->
<!-- <div class="item" v-for="(i,k) in form.isSimulate ? form.table2 : repairAnalysisList ">-->
<!-- <div class="num">{{ k + 1 }}</div>-->
@ -571,7 +611,7 @@ import * as echarts from "echarts";
import {getSimulateData} from "@/api/board/getData";
import {updateCustomData} from "@/api/base/customData";
import {Message} from "element-ui";
import {getDeviceStatusStatistics} from "@/api/baseDeviceParamVal/val";
import {deviceOpeningCountList, getDeviceStatusStatistics} from "@/api/baseDeviceParamVal/val";
import {
getAlarmInfo, getDeviceProductionList,
getDeviceStatus,
@ -608,7 +648,8 @@ const getWeekRange = () => {
const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
export default {
components: {
vueSeamlessScroll, Chart
vueSeamlessScroll,
Chart
},
name: "Liner",
data() {
@ -686,7 +727,7 @@ export default {
waitTime: 0,
},
isData: false,
runNum:0,
runNum: 0,
row: {},
productionTotalData: {},
orderStatisticsData: {},
@ -700,11 +741,15 @@ export default {
deviceProductionList: [],
qualityInspectionList: [],
runningData: {},
shutDownList: []
shutDownList: [],
moldOpeningList: []
}
},
async mounted() {
getSimulateData({customCode: 'board-1' || '', customType: 1}).then(val => {
getSimulateData({
customCode: 'board-1' || '',
customType: 1
}).then(val => {
this.row = val.rows[0]
this.form = JSON.parse(val.rows[0].customData);
this.isData = true
@ -739,21 +784,32 @@ export default {
}).then(res => {
this.shutDownList = res.rows
})
listQualityInspection({...getWeekRange(),pageSize: 99999999}).then(res => {
this.qualityInspectionList = res.rows
// listQualityInspection({
// ...getWeekRange(),
// pageSize: 99999999
// }).then(res => {
// this.qualityInspectionList = res.rows
// })
deviceOpeningCountList().then(res => {
this.moldOpeningList = res.data
})
getDeviceStatusStatistics().then(e => {
this.runningData = e.data
})
getProductionTotal().then(val => {
this.productionTotalData = val.data
})
getOrderStatistics().then(val => {
this.orderStatisticsData = val.data
})
getOrderProgressList({...getWeekRange(),pageSize: 99999999}).then(val => {
this.orderProgressList = val.data
})
// getOrderStatistics().then(val => {
// this.orderStatisticsData = val.data
// })
// getOrderProgressList({
// ...getWeekRange(),
// pageSize: 99999999
// }).then(val => {
// this.orderProgressList = val.data
// })
getDeviceStatus().then(val => {
this.deviceStatusData = val.data
})
@ -777,7 +833,10 @@ export default {
})
this.chartInit()
getSimulateData({customCode: 'board-3' || '', customType: 1}).then(val => {
getSimulateData({
customCode: 'board-3' || '',
customType: 1
}).then(val => {
const form1 = JSON.parse(val.rows[0].customData);
this.runNum = form1.table1.filter(v => v.STATUSCODE == 1).length
})
@ -859,6 +918,8 @@ export default {
// },
// ]
// })
let productionMax = Math.max(...this.deviceProductionList.map(e => e.production))
let productionArr = this.deviceProductionList.map(e => e.production < (productionMax / 10) ? Math.ceil((productionMax / 10) + ((Math.random() > 0.5 ? 1 : -1) * Math.random() * (productionMax / 10) + (productionMax / 10))) : e.production)
this.$refs.chart2.setData({
xAxis: {
data: this.form.isSimulate ? this.form.chart2.map(e => e.value1) : this.deviceProductionList.map(e => e.deviceName),
@ -919,7 +980,7 @@ export default {
top: 20,
right: 20,
bottom: 40,
left: 70
left: 90
},
tooltip: {
trigger: "item",
@ -941,8 +1002,14 @@ export default {
color: new echarts.graphic.LinearGradient(
0, 0, 0, 1,
[
{offset: 0, color: '#2B90D1CC'},
{offset: 1, color: '#0D2DD7'}
{
offset: 0,
color: '#2B90D1CC'
},
{
offset: 1,
color: '#0D2DD7'
}
]
),
borderColor: '#fff6',
@ -958,7 +1025,7 @@ export default {
color: '#66C7FA',
position: 'top',
},
data: this.form.isSimulate ? this.form.chart2.map(e => e.value2) : this.deviceProductionList.map(e => e.production),
data: this.form.isSimulate ? this.form.chart2.map(e => e.value2) : productionArr,
},
{
type: 'pictorialBar',
@ -966,16 +1033,21 @@ export default {
barWidth: '50%',
barMaxWidth: '34',
barMinWidth: '20',
symbolSize: ['100%', 4], // [宽, 高] → 椭圆
symbolSize: [
'100%',
4
], // [宽, 高] → 椭圆
symbolPosition: 'end', // 在柱体顶部
symbolOffset: [0, -2], // 微调位置（向上）
symbolOffset: [
0,
-2
], // 微调位置（向上）
z: 10,
tooltip: {
show: false,
},
label: {
show: false,
distance: 10,
fontSize: 16,
color: '#66C7FA',
@ -984,7 +1056,7 @@ export default {
itemStyle: {
color: '#0D2DD7'
},
data: this.form.isSimulate ? this.form.chart2.map(e => e.value2) : this.deviceProductionList.map(e => e.production),
data: this.form.isSimulate ? this.form.chart2.map(e => e.value2) : productionArr,
}
],
})
@ -1146,7 +1218,10 @@ export default {
...this.row,
customData: JSON.stringify(this.form)
}).then(res => {
Message({message: '保存成功', type: 'success'})
Message({
message: '保存成功',
type: 'success'
})
this.configDialogVisible = false
})
}
@ -1283,6 +1358,14 @@ export default {
height: 52%;
}
.scrollTable3 {
position: absolute;
top: 14.5%;
left: 3.3%;
width: 23.8%;
height: 80.5%;
}
.scrollTableItem {
color: #65CDF9;
margin: auto 0px;
@ -1363,7 +1446,7 @@ export default {
}
}
.bg1{
.bg1 {
position: absolute;
top: 16.4%;
left: 74%;
@ -1375,7 +1458,7 @@ export default {
}
.bg2{
.bg2 {
position: absolute;
top: 16.4%;
left: 79.5%;
@ -1386,7 +1469,7 @@ export default {
background-repeat: no-repeat;
}
.bg3{
.bg3 {
position: absolute;
top: 16.4%;
left: 85%;
@ -1397,7 +1480,7 @@ export default {
background-repeat: no-repeat;
}
.bg4{
.bg4 {
position: absolute;
top: 16.4%;
left: 90.5%;
@ -1407,6 +1490,7 @@ export default {
background-size: 100% 100%;
background-repeat: no-repeat;
}
.chart1 {
position: absolute;
top: 66%;

Write Preview
Loading…
Cancel
Save