修改接口

master
夜笙歌 11 months ago
parent 368872e585
commit 8a3a17ec19

Binary file not shown.

Before

Width:  |  Height:  |  Size: 770 KiB

After

Width:  |  Height:  |  Size: 810 KiB

@ -60,8 +60,8 @@ export default {
background-image: url("../assets/board/logo.png");
background-repeat: no-repeat;
background-size: 100% 100%;
width: 8vw;
height:3vw;
width: 6vw;
height: 2.3vw;
position: absolute;
top: 1%;
left: 1%;

@ -75,8 +75,8 @@ export default {
background-image: url("../../assets/board/logo.png");
background-repeat: no-repeat;
background-size: 100% 100%;
width: 8vw;
height:3vw;
width: 6vw;
height: 2.3vw;
position: absolute;
top: 1%;
left: 1%;

@ -11,23 +11,19 @@
<div class="nowClass">{{ info.bz }}</div>
<div class="num">{{ info.sxsl }}</div>
<div class="info1Title">产品条码</div>
<div class="info1">{{ info.tm }}</div>
<div class="info2Title">扫描时间</div>
<div class="info2">{{ info.sj }}</div>
<div class="info3Title">产品型号</div>
<div class="info3">{{ info.xh }}</div>
<div class="info4Title">订单编号</div>
<div class="info4">{{ info.bh }}</div>
<div class="info5Title">订单数量</div>
<div class="info5">{{ info.ddsl }}</div>
<div class="info6Title">上线数量</div>
<div class="info6">{{ info.sxsl2 }}</div>
<div class="info7Title">提示信息</div>
<div class="info7">{{ info.tsxx }}</div>
<div class="info1Title">产品条码 <span style="color: #697bbb"> {{ info.tm }} </span></div>
<div class="info2Title">扫描时间 <span style="color: #697bbb"> {{ info.sj }} </span></div>
<div class="info3Title">产品型号 <span style="color: #697bbb"> {{ info.xh }} </span></div>
<div class="info4Title">订单编号 <span style="color: #697bbb"> {{ info.bh }} </span></div>
<div class="info5Title">订单数量 <span style="color: #697bbb"> {{ info.ddsl }} </span></div>
<div class="info6Title">上线数量 <span style="color: #697bbb"> {{ info.sxsl2 }} </span></div>
<div class="info7Title">提示信息 <span style="color: #0fbc7b"> {{ info.tsxx }} </span></div>
<div class="scrollTable">
<div style="background-color: #094170">
<div class="scrollTableItem" style="font-weight: bold;">
序号
</div>
<div class="scrollTableItem" style="font-weight: bold;">
订单号
</div>
@ -38,7 +34,10 @@
计划数量
</div>
<div class="scrollTableItem" style="font-weight: bold;">
上线数量
当日上线数量
</div>
<div class="scrollTableItem" style="font-weight: bold;">
订单上线数量
</div>
<div class="scrollTableItem" style="font-weight: bold;">
上线进度
@ -63,6 +62,10 @@
class="scrollTableItem">
{{ item.value1 }}
</div>
<div
class="scrollTableItem">
{{ item.value1 }}
</div>
<div
class="scrollTableItem">
{{ item.value2 }}
@ -75,6 +78,10 @@
class="scrollTableItem">
{{ item.value4 }}
</div>
<div
class="scrollTableItem">
{{ item.value4 }}
</div>
<div
class="scrollTableItem">
{{ item.value5 }}
@ -113,8 +120,8 @@ export default {
data() {
return {
title: [
'当日小时产量统计',
'当日型号产量统计',
'总装上线小时统计',
'总装上线型号统计',
'生产统计',
],
titlePosition: [
@ -381,7 +388,7 @@ export default {
text-overflow: ellipsis;
text-align: center;
display: inline-block;
width: 16.6%;
width: calc(100% / 8);
}
.chart1 {
@ -402,8 +409,8 @@ export default {
.title1 {
position: absolute;
top: 12.5%;
left: 12.7%;
top: 12.1%;
left: 11.3%;
transform: translate(-50%, -50%);
font-size: 1.2vw;
color: #d6eaed;
@ -411,171 +418,108 @@ export default {
.title2 {
position: absolute;
top: 12.5%;
left: 87.2%;
top: 12.1%;
left: 88.5%;
transform: translate(-50%, -50%);
font-size: 1.2vw;
color: #d6eaed;
white-space: nowrap;
}
.nowClass {
position: absolute;
top: 20%;
left: 12.7%;
top: 21%;
left: 11.3%;
font-size: 1.8vw;
letter-spacing: 4px;
transform: translate(-50%, -50%);
font-size: 1.2vw;
color: #d6eaed;
}
.num {
position: absolute;
top: 20%;
left: 87.2%;
top: 21%;
left: 88.5%;
transform: translate(-50%, -50%);
font-size: 1.2vw;
font-size: 1.8vw;
letter-spacing: 4px;
color: #d6eaed;
}
.info1Title {
position: absolute;
top: 9%;
left: 23.5%;;
width: 8.5%;
font-size: 1.1vw;
color: #55c280;
text-align: center;
top: 11.1%;
left: 23%;
width: 24%;
font-size: 1vw;
color: #fff9;
text-align: left;
}
.info1 {
position: absolute;
top: 9%;
left: 32%;
width: 18%;
font-size: 1.2vw;
color: #d6eaed;
text-align: center;
}
.info2Title {
position: absolute;
top: 9%;
left: 50%;
width: 8.5%;
font-size: 1.1vw;
color: #55c280;
text-align: center;
}
.info2 {
position: absolute;
top: 9%;
left: 58.5%;
width: 18%;
font-size: 1.2vw;
color: #d6eaed;
text-align: center;
top: 11.1%;
left: 52.7%;
width: 24%;
font-size: 1vw;
color: #fff9;
text-align: left;
}
.info3Title {
position: absolute;
top: 13.5%;
left: 23.5%;;
width: 8.5%;
font-size: 1.1vw;
color: #55c280;
text-align: center;
top: 14.8%;
left: 23%;
width: 24%;
font-size: 1vw;
color: #fff9;
text-align: left;
}
.info3 {
position: absolute;
top: 13.5%;
left: 32%;
width: 18%;
font-size: 1.2vw;
color: #d6eaed;
text-align: center;
}
.info4Title {
position: absolute;
top: 13.5%;
left: 50%;
width: 8.5%;
font-size: 1.1vw;
color: #55c280;
text-align: center;
}
.info4 {
position: absolute;
top: 13.5%;
left: 58.5%;
width: 18%;
font-size: 1.2vw;
color: #d6eaed;
text-align: center;
top: 14.8%;
left: 52.7%;
width: 24%;
font-size: 1vw;
color: #fff9;
text-align: left;
}
.info5Title {
position: absolute;
top: 18%;
left: 23.5%;;
width: 8.5%;
font-size: 1.1vw;
color: #55c280;
text-align: center;
}
.info5 {
position: absolute;
top: 18%;
left: 32%;
width: 18%;
font-size: 1.2vw;
color: #d6eaed;
text-align: center;
top: 18.4%;
left: 23%;
width: 24%;
font-size: 1vw;
color: #fff9;
text-align: left;
}
.info6Title {
position: absolute;
top: 18%;
left: 50%;
width: 8.5%;
font-size: 1.1vw;
color: #55c280;
text-align: center;
top: 18.3%;
left: 52.7%;
width: 24%;
font-size: 1vw;
color: #fff9;
text-align: left;
}
.info6 {
position: absolute;
top: 18%;
left: 58.5%;
width: 18%;
font-size: 1.2vw;
color: #d6eaed;
text-align: center;
}
.info7Title {
position: absolute;
top: 22.5%;
left: 23.5%;;
width: 8.5%;
font-size: 1.1vw;
color: #55c280;
text-align: center;
top: 22%;
left: 23%;
width: 24%;
font-size: 1vw;
color: #fff9;
text-align: left;
}
.info7 {
position: absolute;
top: 22.5%;
left: 32%;
width: 18%;
font-size: 1.2vw;
color: #d6eaed;
text-align: center;
}
</style>

@ -1362,6 +1362,622 @@
<!-- </vue-seamless-scroll>-->
</div>
</transition>
<transition name="table1">
<div class="scrollTable1" v-if="show ===4">
<div style="background-color: #094170; height: calc(25vh/7)">
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
工位
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 8%">
型号
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
状态
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
目标
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
计划
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
累计
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 7%">
达成率
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[0] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[1] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[2] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[3] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[4] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[5] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[6] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[7] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[8] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[9] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[10] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[11] }}
</div>
</div>
<!-- <vue-seamless-scroll-->
<!-- :class-option="scrollTableOption"-->
<!-- :data="scrollTableData1"-->
<!-- class="case-item"-->
<!-- style="height: 84%;overflow: hidden;"-->
<!-- >-->
<div
v-for="(item, index) in scrollTableData1.slice(24,30)"
:key="index"
style="height: calc(25vh/7)"
>
<div :style='"background-color:" + ((index % 2 === 0)? "#053460":"#032d57") '>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value1 }}
</div>
<div
class="scrollTableItem" style="width: 8%">
{{ item.value2 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value3 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value4 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value5 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value6 }}
</div>
<div
class="scrollTableItem" style="width: 7%">
{{ item.value7 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value8 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value9 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value10 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value11 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value12 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value13 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value14 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value15 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value16 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value17 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value18 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value19 }}
</div>
</div>
</div>
<!-- </vue-seamless-scroll>-->
</div>
</transition>
<transition name="table2">
<div class="scrollTable1" v-if="show === 5">
<div style="background-color: #094170;height: calc(25vh/7)">
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
工位
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 8%">
型号
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
状态
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
目标
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
计划
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
累计
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 7%">
达成率
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[0] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[1] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[2] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[3] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[4] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[5] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[6] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[7] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[8] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[9] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[10] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[11] }}
</div>
</div>
<!-- <vue-seamless-scroll-->
<!-- :class-option="scrollTableOption"-->
<!-- :data="scrollTableData1"-->
<!-- class="case-item"-->
<!-- style="height: 84%;overflow: hidden;"-->
<!-- >-->
<div
v-for="(item, index) in scrollTableData1.slice(30,36)"
:key="index"
style="height: calc(25vh/7)"
>
<div :style='"background-color:" + ((index % 2 === 0)? "#053460":"#032d57") '>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value1 }}
</div>
<div
class="scrollTableItem" style="width: 8%">
{{ item.value2 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value3 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value4 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value5 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value6 }}
</div>
<div
class="scrollTableItem" style="width: 7%">
{{ item.value7 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value8 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value9 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value10 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value11 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value12 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value13 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value14 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value15 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value16 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value17 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value18 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value19 }}
</div>
</div>
</div>
<!-- </vue-seamless-scroll>-->
</div>
</transition>
<transition name="table1">
<div class="scrollTable1" v-if="show === 6">
<div style="background-color: #094170;height: calc(25vh/7)">
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
工位
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 8%">
型号
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
状态
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
目标
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
计划
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
累计
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 7%">
达成率
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[0] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[1] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[2] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[3] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[4] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[5] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[6] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[7] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[8] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[9] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[10] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[11] }}
</div>
</div>
<!-- <vue-seamless-scroll-->
<!-- :class-option="scrollTableOption"-->
<!-- :data="scrollTableData1"-->
<!-- class="case-item"-->
<!-- style="height: 84%;overflow: hidden;"-->
<!-- >-->
<div
v-for="(item, index) in scrollTableData1.slice(36,42)"
:key="index"
style="height: calc(25vh/7)"
>
<div :style='"background-color:" + ((index % 2 === 0)? "#053460":"#032d57") '>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value1 }}
</div>
<div
class="scrollTableItem" style="width: 8%">
{{ item.value2 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value3 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value4 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value5 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value6 }}
</div>
<div
class="scrollTableItem" style="width: 7%">
{{ item.value7 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value8 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value9 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value10 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value11 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value12 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value13 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value14 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value15 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value16 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value17 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value18 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value19 }}
</div>
</div>
</div>
<!-- </vue-seamless-scroll>-->
</div>
</transition>
<transition name="table2">
<div class="scrollTable1" v-if="show === 7">
<div style="background-color: #094170;height: calc(25vh/7)">
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
工位
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 8%">
型号
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
状态
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
目标
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
计划
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
累计
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 7%">
达成率
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[0] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[1] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[2] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[3] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[4] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[5] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[6] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[7] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[8] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[9] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[10] }}
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
{{ hourArr[11] }}
</div>
</div>
<!-- <vue-seamless-scroll-->
<!-- :class-option="scrollTableOption"-->
<!-- :data="scrollTableData1"-->
<!-- class="case-item"-->
<!-- style="height: 84%;overflow: hidden;"-->
<!-- >-->
<div
v-for="(item, index) in scrollTableData1.slice(42,48)"
:key="index"
style="height: calc(25vh/7)"
>
<div :style='"background-color:" + ((index % 2 === 0)? "#053460":"#032d57") '>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value1 }}
</div>
<div
class="scrollTableItem" style="width: 8%">
{{ item.value2 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value3 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value4 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value5 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value6 }}
</div>
<div
class="scrollTableItem" style="width: 7%">
{{ item.value7 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value8 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value9 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value10 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value11 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value12 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value13 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value14 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value15 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value16 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value17 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value18 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value19 }}
</div>
</div>
</div>
<!-- </vue-seamless-scroll>-->
</div>
</transition>
<div class="total">
<div style="background-color: #094170">
<div class="scrollTableItem" style="font-weight: bold;width: 5%">

@ -162,6 +162,7 @@ export default {
'发泡料温度监控',
'门体发泡生产统计',
],
status1:0,
meter1: 0,
meter2: 0,
titlePosition: [

@ -54,27 +54,27 @@
<div :style='"background-color:" + ((index % 2 === 0)? "#053460":"#032d57") '>
<div
class="scrollTableItem">
{{ item.value1 }}
{{ item.COLUMN_A }}
</div>
<div
class="scrollTableItem">
AA-001
{{ item.COLUMN_B }}
</div>
<div
class="scrollTableItem">
{{ item.value3 }}
{{ item.COLUMN_C }}
</div>
<div
class="scrollTableItem">
{{ item.value4 }}
{{ item.COLUMN_D }}
</div>
<div
class="scrollTableItem">
{{ item.value6 }}
{{ item.COLUMN_E }}
</div>
<div
class="scrollTableItem">
2023-01-01 00:00:00
{{ item.COLUMN_F }}
</div>
</div>
</div>
@ -169,7 +169,7 @@ export default {
RequestDataSet: [
{
e: 'cp-1-01',
i: "",
i: "scada_cp_cp_cl_01('CX_01')",
f: (e) => {
this.$refs.chart1.setData({
tooltip: {
@ -190,7 +190,7 @@ export default {
legend: {
show: true,
itemGap: 50,
data: e.y.map(val => val.name),
data: ['实际产量','目标产量'],
textStyle: {
color: "#f9f9f9",
borderColor: "#fff",
@ -229,7 +229,7 @@ export default {
opacity: 0.3,
},
},
data: e.x,
data: e.map(val=>val.X_VALUE),
},
],
yAxis: [
@ -267,7 +267,7 @@ export default {
],
series: [
{
name: e.y[0].name,
name: '实际产量',
type: "bar",
barWidth: '70%',
label: {
@ -283,7 +283,7 @@ export default {
barBorderRadius: 5,
color: function (val) {
console.log()
if (e.y[0].data[val.dataIndex] >= e.y[1].data[val.dataIndex]) {
if (e[val.dataIndex].Y_VALUE_ONE >= e[val.dataIndex].Y_VALUE_TWO) {
return '#30e391'
} else {
return '#FE70A6'
@ -292,10 +292,10 @@ export default {
},
},
},
data: e.y[0].data,
data: e.map(val=>val.Y_VALUE_ONE),
},
{
name: e.y[1].name,
name: '目标产量',
type: "line",
// smooth: true, //线
// symbol:'circle', //
@ -324,7 +324,7 @@ export default {
// tooltip: {
// show: false
// },
data: e.y[1].data,
data: e.map(val=>val.Y_VALUE_TWO),
},
],
})
@ -339,7 +339,7 @@ export default {
},
{
e: 'cp-1-03',
i: "",
i: "scada_cp_zj_01('CX_01')",
f: (e) => {
this.$refs.chart2.setData({
grid: {
@ -360,7 +360,7 @@ export default {
},
legend: {
itemWidth: 3 * vw,
data: e.y.map(val => val.name),
data: ['不良数','一次不合格率','目标'],
textStyle: {
color: "#d1e6eb",
margin: 15,
@ -378,7 +378,7 @@ export default {
},
},
type: 'category',
data: e.x,
data: e.map(val=>val.X_VALUE),
axisPointer: {
type: 'shadow'
}
@ -420,13 +420,13 @@ export default {
],
series: [
{
name: e.y[0].name,
name: '不良数',
type: 'bar',
itemStyle: {
normal: {
color: function (val) {
console.log()
if (e.y[1].data[val.dataIndex] < e.y[2].data[val.dataIndex]) {
if (e[val.dataIndex].Y_VALUE_TWO < 3) {
return '#30e391'
} else {
return '#FE70A6'
@ -435,7 +435,7 @@ export default {
},
},
},
data: e.y[0].data,
data: e.map(val=>val.Y_VALUE_ONE),
label: {
show: true,
position: 'top',
@ -446,10 +446,10 @@ export default {
},
},
{
name: e.y[1].name,
name: '不合格率',
type: 'line',
yAxisIndex: 1,
data: e.y[1].data,
data: e.map(val=>val.Y_VALUE_TWO),
itemStyle: {
normal: {
color: '#F9A25B',
@ -457,10 +457,10 @@ export default {
},
},
{
name: e.y[2].name,
name: '目标',
type: 'line',
yAxisIndex: 1,
data: e.y[2].data,
data: e.map(val=>3),
itemStyle: {
normal: {
color: '#0DB99D',
@ -480,21 +480,21 @@ export default {
},
{
e: 'cp-1-05',
i: "",
i: "scada_cp_rk_jp_01('CX_01')",
f: (e) => {
this.loss = e
this.loss = e[0].X_VALUE
this.meter = e[0].Y_VALUE
}
},
{
e: 'cp-1-06',
i: "",
f: (e) => {
this.meter = e
}
},
{
e: 'cp-1-07',
i: "",
i: "scada_cp_rk_loss_01('CX_01')",
f: (e) => {
this.$refs.chart3.setData({
tooltip: {
@ -510,7 +510,7 @@ export default {
containLabel: true,
},
xAxis: {
data: e.x,
data: e.map(val=>val.X_VALUE),
axisLine: {
lineStyle: {
color: "#0177d4",
@ -576,7 +576,7 @@ export default {
),
},
},
data: e.y.data,
data: e.map(val=>val.Y_VALUE),
},
],
})
@ -584,7 +584,7 @@ export default {
},
{
e: 'cp-1-08',
i: "",
i: "scada_cp_rk_order_01('CX_01')",
f: (e) => {
this.scrollTableData = e
}
@ -600,7 +600,7 @@ export default {
RequestDataSet1: [
{
e: 'cp-2-01',
i: "",
i: "scada_cp_cp_cl_01('CX_02')",
f: (e) => {
this.$refs.chart1.setData({
tooltip: {
@ -621,7 +621,7 @@ export default {
legend: {
show: true,
itemGap: 50,
data: e.y.map(val => val.name),
data: ['实际产量','目标产量'],
textStyle: {
color: "#f9f9f9",
borderColor: "#fff",
@ -660,7 +660,7 @@ export default {
opacity: 0.3,
},
},
data: e.x,
data: e.map(val=>val.X_VALUE),
},
],
yAxis: [
@ -698,7 +698,7 @@ export default {
],
series: [
{
name: e.y[0].name,
name: '实际产量',
type: "bar",
barWidth: '70%',
label: {
@ -714,7 +714,7 @@ export default {
barBorderRadius: 5,
color: function (val) {
console.log()
if (e.y[0].data[val.dataIndex] >= e.y[1].data[val.dataIndex]) {
if (e[val.dataIndex].Y_VALUE_ONE >= e[val.dataIndex].Y_VALUE_TWO) {
return '#30e391'
} else {
return '#FE70A6'
@ -723,10 +723,10 @@ export default {
},
},
},
data: e.y[0].data,
data: e.map(val=>val.Y_VALUE_ONE),
},
{
name: e.y[1].name,
name: '目标产量',
type: "line",
// smooth: true, //线
// symbol:'circle', //
@ -755,7 +755,7 @@ export default {
// tooltip: {
// show: false
// },
data: e.y[1].data,
data: e.map(val=>val.Y_VALUE_TWO),
},
],
})
@ -770,7 +770,7 @@ export default {
},
{
e: 'cp-2-03',
i: "",
i: "scada_cp_zj_01('CX_02')",
f: (e) => {
this.$refs.chart2.setData({
grid: {
@ -791,7 +791,7 @@ export default {
},
legend: {
itemWidth: 3 * vw,
data: e.y.map(val => val.name),
data: ['不良数','一次不合格率','目标'],
textStyle: {
color: "#d1e6eb",
margin: 15,
@ -809,7 +809,7 @@ export default {
},
},
type: 'category',
data: e.x,
data: e.map(val=>val.X_VALUE),
axisPointer: {
type: 'shadow'
}
@ -851,13 +851,13 @@ export default {
],
series: [
{
name: e.y[0].name,
name: '不良数',
type: 'bar',
itemStyle: {
normal: {
color: function (val) {
console.log()
if (e.y[1].data[val.dataIndex] < e.y[2].data[val.dataIndex]) {
if (e[val.dataIndex].Y_VALUE_TWO < 3) {
return '#30e391'
} else {
return '#FE70A6'
@ -866,7 +866,7 @@ export default {
},
},
},
data: e.y[0].data,
data: e.map(val=>val.Y_VALUE_ONE),
label: {
show: true,
position: 'top',
@ -877,10 +877,10 @@ export default {
},
},
{
name: e.y[1].name,
name: '不合格率',
type: 'line',
yAxisIndex: 1,
data: e.y[1].data,
data: e.map(val=>val.Y_VALUE_TWO),
itemStyle: {
normal: {
color: '#F9A25B',
@ -888,10 +888,10 @@ export default {
},
},
{
name: e.y[2].name,
name: '目标',
type: 'line',
yAxisIndex: 1,
data: e.y[2].data,
data: e.map(val=>3),
itemStyle: {
normal: {
color: '#0DB99D',
@ -911,9 +911,10 @@ export default {
},
{
e: 'cp-2-05',
i: "",
i: "scada_cp_rk_jp_01('CX_02')",
f: (e) => {
this.loss = e
this.loss = e[0].X_VALUE
this.meter = e[0].Y_VALUE
}
},
{
@ -925,7 +926,7 @@ export default {
},
{
e: 'cp-2-07',
i: "",
i: "scada_cp_rk_loss_01('CX_02')",
f: (e) => {
this.$refs.chart3.setData({
tooltip: {
@ -941,7 +942,7 @@ export default {
containLabel: true,
},
xAxis: {
data: e.x,
data: e.map(val=>val.X_VALUE),
axisLine: {
lineStyle: {
color: "#0177d4",
@ -1007,7 +1008,7 @@ export default {
),
},
},
data: e.y.data,
data: e.map(val=>val.Y_VALUE),
},
],
})
@ -1015,7 +1016,7 @@ export default {
},
{
e: 'cp-2-08',
i: "",
i: "scada_cp_rk_order_01('CX_02')",
f: (e) => {
this.scrollTableData = e
}

@ -9,6 +9,7 @@
<div class="time" id="time">{{ time }}</div>
<div class="date" id="date">{{ date }}</div>
<div class="logo"></div>
<span style="position: absolute;top: 69.3%;left: 13.7%;color:#fff;font-size: 0.9vw;">合计{{ hj }}</span>
<!-- <div class="info1">订单数10 完成数量10 完成率100%</div>-->
<div class="chart1">
@ -87,12 +88,13 @@ export default {
name: '南海诸岛',
value: Math.random() * 200
}],
hj:1000,
title: [
'三日清单',
'产品发布',
'场景升级',
'重点工序监控',
'订单履约率(周)',
'订单履约率',
'产品市场',
'用户评价',
'质量分析',

Loading…
Cancel
Save