Commit ed7700f3 authored by 李志鸣's avatar 李志鸣

fea(Avi Led 轮播): 电泳、钣金、密封防腐模块开发

parent ea104d86
<template>
<!-- 电泳工作区 -->
<div class="page-pack">
<div class="container">
<!-- 在线车体数量 -->
<div class="online-number">
<span>数量:{{onlineNumber !== null ? onlineNumber : '0' }}</span>
</div>
<!-- 显示区域 -->
<div class="view-pack">
<!-- 第一列 -->
<div class="HDG5-2"
v-if="realData.hasOwnProperty('HDG5-2') && realData['HDG5-2'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG5-2'].busType)">
</div>
<div class="HDG5-3"
v-if="realData.hasOwnProperty('HDG5-3') && realData['HDG5-3'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG5-3'].busType)">
</div>
<div class="HDG5-4"
v-if="realData.hasOwnProperty('HDG5-4') && realData['HDG5-4'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG5-4'].busType)">
</div>
<div class="HDG5-5"
v-if="realData.hasOwnProperty('HDG5-5') && realData['HDG5-5'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG5-5'].busType)">
</div>
<div class="HDG5-6"
v-if="realData.hasOwnProperty('HDG5-6') && realData['HDG5-6'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG5-6'].busType)">
</div>
<div class="HDG5-7"
v-if="realData.hasOwnProperty('HDG5-7') && realData['HDG5-7'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG5-7'].busType)">
</div>
<!-- 第二列 -->
<div class="STC1-1"
v-if="realData.hasOwnProperty('STC1-1') && realData['STC1-1'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['STC1-1'].busType)">
</div>
<div class="STC1-2"
v-if="realData.hasOwnProperty('STC1-2') && realData['STC1-2'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['STC1-2'].busType)">
</div>
<div class="STC1-3"
v-if="realData.hasOwnProperty('STC1-3') && realData['STC1-3'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['STC1-3'].busType)">
</div>
<div class="STC1-4"
v-if="realData.hasOwnProperty('STC1-4') && realData['STC1-4'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['STC1-4'].busType)">
</div>
<div class="STC1-5"
v-if="realData.hasOwnProperty('STC1-5') && realData['STC1-5'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['STC1-5'].busType)">
</div>
<div class="STC1-6"
v-if="realData.hasOwnProperty('STC1-6') && realData['STC1-6'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['STC1-6'].busType)">
</div>
<div class="STC1-7"
v-if="realData.hasOwnProperty('STC1-7') && realData['STC1-7'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['STC1-7'].busType)">
</div>
<div class="HDG2-2"
v-if="realData.hasOwnProperty('HDG2-2') && realData['HDG2-2'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG2-2'].busType)">
</div>
<div class="HDG1-45"
v-if="realData.hasOwnProperty('HDG1-45') && realData['HDG1-45'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-45'].busType)">
</div>
<div class="HDG1-37"
v-if="realData.hasOwnProperty('HDG1-37') && realData['HDG1-37'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-37'].busType)">
</div>
<div class="HDG1-41"
v-if="realData.hasOwnProperty('HDG1-41') && realData['HDG1-41'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-41'].busType)">
</div>
<div class="HDG1-59"
v-if="realData.hasOwnProperty('HDG1-59') && realData['HDG1-59'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-59'].busType)">
</div>
<div class="HDG1-63"
v-if="realData.hasOwnProperty('HDG1-63') && realData['HDG1-63'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-63'].busType)">
</div>
<!-- 第三列 -->
<div class="HDG1-36"
v-if="realData.hasOwnProperty('HDG1-36') && realData['HDG1-36'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-36'].busType)">
</div>
<div class="HDG1-46"
v-if="realData.hasOwnProperty('HDG1-46') && realData['HDG1-46'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-46'].busType)">
</div>
<div class="HDG1-38"
v-if="realData.hasOwnProperty('HDG1-38') && realData['HDG1-38'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-38'].busType)">
</div>
<div class="HDG1-42"
v-if="realData.hasOwnProperty('HDG1-42') && realData['HDG1-42'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-42'].busType)">
</div>
<div class="HDG1-60"
v-if="realData.hasOwnProperty('HDG1-60') && realData['HDG1-60'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-60'].busType)">
</div>
<div class="HDG1-64"
v-if="realData.hasOwnProperty('HDG1-64') && realData['HDG1-64'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-64'].busType)">
</div>
<!-- 第四列 -->
<div class="STC1-8"
v-if="realData.hasOwnProperty('STC1-8') && realData['STC1-8'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['STC1-8'].busType)">
</div>
<div class="STC1-9"
v-if="realData.hasOwnProperty('STC1-9') && realData['STC1-9'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['STC1-9'].busType)">
</div>
<div class="STC1-10"
v-if="realData.hasOwnProperty('STC1-10') && realData['STC1-10'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['STC1-10'].busType)">
</div>
<div class="STC1-11"
v-if="realData.hasOwnProperty('STC1-11') && realData['STC1-11'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['STC1-11'].busType)">
</div>
<div class="STC1-12"
v-if="realData.hasOwnProperty('STC1-12') && realData['STC1-12'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['STC1-12'].busType)">
</div>
<div class="STC1-13"
v-if="realData.hasOwnProperty('STC1-13') && realData['STC1-13'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['STC1-13'].busType)">
</div>
<div class="STC1-14"
v-if="realData.hasOwnProperty('STC1-14') && realData['STC1-14'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['STC1-14'].busType)">
</div>
<div class="HDG2-1"
v-if="realData.hasOwnProperty('HDG2-1') && realData['HDG2-1'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG2-1'].busType)">
</div>
<div class="HDG1-47"
v-if="realData.hasOwnProperty('HDG1-47') && realData['HDG1-47'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-47'].busType)">
</div>
<div class="HDG1-39"
v-if="realData.hasOwnProperty('HDG1-39') && realData['HDG1-39'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-39'].busType)">
</div>
<div class="HDG1-43"
v-if="realData.hasOwnProperty('HDG1-43') && realData['HDG1-43'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-43'].busType)">
</div>
<div class="HDG1-61"
v-if="realData.hasOwnProperty('HDG1-61') && realData['HDG1-61'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-61'].busType)">
</div>
<div class="HDG1-65"
v-if="realData.hasOwnProperty('HDG1-65') && realData['HDG1-65'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-65'].busType)">
</div>
<!-- 第五列 -->
<div class="HDG1-31"
v-if="realData.hasOwnProperty('HDG1-31') && realData['HDG1-31'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-31'].busType)">
</div>
<div class="HDG1-32"
v-if="realData.hasOwnProperty('HDG1-32') && realData['HDG1-32'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-32'].busType)">
</div>
<div class="HDG1-33"
v-if="realData.hasOwnProperty('HDG1-33') && realData['HDG1-33'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-33'].busType)">
</div>
<div class="HDG1-34"
v-if="realData.hasOwnProperty('HDG1-34') && realData['HDG1-34'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-34'].busType)">
</div>
<div class="HDG1-49"
v-if="realData.hasOwnProperty('HDG1-49') && realData['HDG1-49'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-49'].busType)">
</div>
<div class="HDG1-50"
v-if="realData.hasOwnProperty('HDG1-50') && realData['HDG1-50'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-50'].busType)">
</div>
<div class="HDG1-51"
v-if="realData.hasOwnProperty('HDG1-51') && realData['HDG1-51'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-51'].busType)">
</div>
<div class="HDG1-52"
v-if="realData.hasOwnProperty('HDG1-52') && realData['HDG1-52'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-52'].busType)">
</div>
<div class="HDG1-35"
v-if="realData.hasOwnProperty('HDG1-35') && realData['HDG1-35'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-35'].busType)">
</div>
<div class="HDG1-48"
v-if="realData.hasOwnProperty('HDG1-48') && realData['HDG1-48'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-48'].busType)">
</div>
<div class="HDG1-40"
v-if="realData.hasOwnProperty('HDG1-40') && realData['HDG1-40'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-40'].busType)">
</div>
<div class="HDG1-44"
v-if="realData.hasOwnProperty('HDG1-44') && realData['HDG1-44'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-44'].busType)">
</div>
<div class="HDG1-62"
v-if="realData.hasOwnProperty('HDG1-62') && realData['HDG1-62'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-62'].busType)">
</div>
<div class="HDG1-66"
v-if="realData.hasOwnProperty('HDG1-66') && realData['HDG1-66'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-66'].busType)">
</div>
</div>
</div>
</div>
</template>
<script>
export default {
data () {
return {
// 定时器
timer: null,
// 电泳区实时信息
realData: {},
// 当前在线车体数量
onlineNumber: null
}
},
methods: {
// 查询电泳实时信息
getElectrophoresisInformation () {
this.$fetch('area-controller/realTime-get', { areaNo: '2' }).then(res => {
for (let item of res) {
if (item.code === '2') {
this.realData = _.cloneDeep(item.stationMap);
this.onlineNumber = _.cloneDeep(item.onlineNum);
break;
}
}
})
},
// 解析车体类型样式
resolveCarTypeStyle (type) {
if (type === 'OTHER') {
return 'car-out';
} else {
return '';
}
}
},
mounted () {
setTimeout(() => {
// 查询电泳实时信息
this.getElectrophoresisInformation();
this.timer = setInterval(() => {
// 查询电泳实时信息
this.getElectrophoresisInformation();
}, 20000);
}, 0)
},
beforeDestroy () {
clearInterval(this.timer);
}
}
</script>
<style lang="scss" scoped>
.page-pack {
height: 100%;
width: 100%;
.container {
width: 1556px;
height: 1037px;
background: url("../../../assets/images/LedCarouselAvi/electrophoresis_bg.png") no-repeat;
overflow: hidden;
position: relative;
// 在线车体数量
.online-number {
width: 270px;
height: 50px;
position: absolute;
right: 126px;
top: 43px;
text-align: center;
line-height: 50px;
font-size: 35px;
color: rgb(255,255,255);
}
// 显示区域
.view-pack {
width: 1070px;
height: 893px;
margin-top: 108px;
margin-left: 242px;
position: relative;
div {
width: 70px;
height: 40px;
position: absolute;
background: url("../../../assets/images/LedCarouselAvi/car.png");
background-position: center 0;
background-repeat: no-repeat;
background-size: 100% 100%;
}
// 第一列
.HDG5-2 {
top: 567px;
left: 65px;
}
.HDG5-3 {
top: 620px;
left: 65px;
}
.HDG5-4 {
top: 672px;
left: 65px;
}
.HDG5-5 {
top: 725px;
left: 65px;
}
.HDG5-6 {
top: 787px;
left: 65px;
}
.HDG5-7 {
top: 840px;
left: 65px;
}
// 第二列
.STC1-1 {
top: 52px;
left: 352px;
}
.STC1-2 {
top: 107px;
left: 352px;
}
.STC1-3 {
top: 162px;
left: 352px;
}
.STC1-4 {
top: 262px;
left: 352px;
}
.STC1-5 {
top: 318px;
left: 352px;
}
.STC1-6 {
top: 373px;
left: 352px;
}
.STC1-7 {
top: 428px;
left: 352px;
}
.HDG2-2 {
top: 500px;
left: 333px;
}
.HDG1-45 {
top: 567px;
left: 403px;
}
.HDG1-37 {
top: 659px;
left: 315px;
}
.HDG1-41 {
top: 726px;
left: 315px;
}
.HDG1-59 {
top: 786px;
left: 315px;
}
.HDG1-63 {
top: 838px;
left: 363px;
}
// 第三列
.HDG1-36 {
top: 500px;
left: 552px;
}
.HDG1-46 {
top: 565px;
left: 552px;
}
.HDG1-38 {
top: 658px;
left: 502px;
}
.HDG1-42 {
top: 724px;
left: 502px;
}
.HDG1-60 {
top: 784px;
left: 541px;
}
.HDG1-64 {
top: 839px;
left: 541px;
}
// 第四列
.STC1-8 {
top: 52px;
left: 633px;
}
.STC1-9 {
top: 141px;
left: 633px;
}
.STC1-10 {
top: 198px;
left: 633px;
}
.STC1-11 {
top: 255px;
left: 633px;
}
.STC1-12 {
top: 313px;
left: 633px;
}
.STC1-13 {
top: 370px;
left: 633px;
}
.STC1-14 {
top: 428px;
left: 633px;
}
.HDG2-1 {
top: 501px;
left: 643px;
}
.HDG1-47 {
top: 568px;
left: 699px;
}
.HDG1-39 {
top: 659px;
left: 691px;
}
.HDG1-43 {
top: 725px;
left: 691px;
}
.HDG1-61 {
top: 785px;
left: 730px;
}
.HDG1-65 {
top: 838px;
left: 730px;
}
// 第五列
.HDG1-31 {
top: 71px;
left: 865px;
}
.HDG1-32 {
top: 128px;
left: 865px;
}
.HDG1-33 {
top: 185px;
left: 865px;
}
.HDG1-34 {
top: 242px;
left: 865px;
}
.HDG1-49 {
top: 298px;
left: 922px;
}
.HDG1-50 {
top: 341px;
left: 922px;
}
.HDG1-51 {
top: 384px;
left: 922px;
}
.HDG1-52 {
top: 427px;
left: 922px;
}
.HDG1-35 {
top: 500px;
left: 867px;
}
.HDG1-48 {
top: 566px;
left: 918px;
}
.HDG1-40 {
top: 659px;
left: 879px;
}
.HDG1-44 {
top: 726px;
left: 925px;
}
.HDG1-62 {
top: 791px;
left: 881px;
}
.HDG1-66 {
top: 841px;
left: 929px;
}
}
}
// 轻客车体样式
.car-out {
background: url('../../../assets/images/LedCarouselAvi/car_out.png');
background-position: center 0;
background-repeat: no-repeat;
background-size: 100% 100%;
}
}
</style>
\ No newline at end of file
<template>
<div class="page-pack">
<div class="container">
<div class="view-pack">
<!-- 第一行 -->
<div class="HDG1-57"></div>
<div class="HDG1-67"></div>
<div class="HDG1-68"></div>
<div class="HDG1-69"></div>
<div class="HDG1-70"></div>
<!-- 第二行 -->
<div class="HDG1-58"></div>
<div class="HDG1-71"></div>
<div class="HDG1-72"></div>
<div class="HDG1-73"></div>
<div class="HDG1-74"></div>
<div class="HDG5-8"></div>
<!-- 第三行 -->
<div class="HDG1-75"></div>
<div class="HDG1-76"></div>
<div class="HDG1-77"></div>
<div class="HDG1-78"></div>
<div class="HDG1-79"></div>
<div class="HDG5-9"></div>
<!-- 第四行 -->
<div class="HDG1-80"></div>
<div class="HDG1-81"></div>
<div class="HDG1-82"></div>
<div class="HDG1-83"></div>
<div class="HDG1-84"></div>
<div class="HDG5-10"></div>
<!-- 第五行 -->
<div class="HDG1-85"></div>
<div class="HDG1-86"></div>
<div class="HDG1-87"></div>
<div class="HDG1-88"></div>
<div class="HDG1-89"></div>
<div class="HDG5-11"></div>
</div>
</div>
</div>
</template>
<script>
export default {
data () {
return {}
}
}
</script>
<style lang="scss" scoped>
.page-pack {
width: 100%;
height: 100%;
.container {
width: 1556px;
height: 1037px;
background: url("../../../assets/images/LedCarouselAvi/sealed_anticorrosion-bg.png");
overflow: hidden;
position: relative;
// 显示区域
.view-pack {
width: 1338px;
height: 527px;
margin-top: 255px;
margin-left: 109px;
position: relative;
div {
width: 70px;
height: 40px;
position: absolute;
background: url("../../../assets/images/LedCarouselAvi/car.png");
background-position: center 0;
background-repeat: no-repeat;
background-size: 100% 100%;
}
// 第一行
.HDG1-57 {
top: 37px;
left: 36px;
}
.HDG1-67 {
top: 37px;
left: 234px;
}
.HDG1-68 {
top: 37px;
left: 429px;
}
.HDG1-69 {
top: 37px;
left: 627px;
}
.HDG1-70 {
top: 37px;
left: 823px;
}
// 第二行
.HDG1-58 {
top: 124px;
left: 36px;
}
.HDG1-71 {
top: 124px;
left: 234px;
}
.HDG1-72 {
top: 124px;
left: 429px;
}
.HDG1-73 {
top: 124px;
left: 627px;
}
.HDG1-74 {
top: 124px;
left: 823px;
}
.HDG5-8 {
top: 120px;
left: 1154px;
}
// 第三行
.HDG1-75 {
top: 203px;
left: 80px;
}
.HDG1-76 {
top: 207px;
left: 234px;
}
.HDG1-77 {
top: 207px;
left: 429px;
}
.HDG1-78 {
top: 207px;
left: 627px;
}
.HDG1-79 {
top: 207px;
left: 823px;
}
.HDG5-9 {
top: 207px;
left: 1154px;
}
// 第四行
.HDG1-80 {
top: 291px;
left: 76px;
}
.HDG1-81 {
top: 291px;
left: 285px;
}
.HDG1-82 {
top: 291px;
left: 476px;
}
.HDG1-83 {
top: 291px;
left: 689px;
}
.HDG1-84 {
top: 291px;
left: 880px;
}
.HDG5-10 {
top: 291px;
left: 1154px;
}
// 第五行
.HDG1-85 {
top: 377px;
left: 35px;
}
.HDG1-86 {
top: 377px;
left: 234px;
}
.HDG1-87 {
top: 377px;
left: 429px;
}
.HDG1-88 {
top: 377px;
left: 627px;
}
.HDG1-89 {
top: 377px;
left: 823px;
}
.HDG5-11 {
top: 377px;
left: 1194px;
}
}
}
}
</style>
\ No newline at end of file
<template>
<!-- 钣金工作区 -->
<div class="page-pack">
<div class="container">
<!-- 在线车体数量 -->
<div class="online-number">
<span>数量:{{onlineNumber !== null ? onlineNumber : '0' }}</span>
</div>
<!-- 显示区域 -->
<div class="view-pack">
<!-- 第一行 -->
<div class="HDG1-5"
v-if="realData.hasOwnProperty('HDG1-5') && realData['HDG1-5'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-5'].busType)">
</div>
<div class="HDG1-4"
v-if="realData.hasOwnProperty('HDG1-4') && realData['HDG1-4'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-4'].busType)">
</div>
<div class="HDG1-3"
v-if="realData.hasOwnProperty('HDG1-3') && realData['HDG1-3'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-3'].busType)">
</div>
<div class="HDG1-2"
v-if="realData.hasOwnProperty('HDG1-2') && realData['HDG1-2'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-2'].busType)">
</div>
<div class="HDG1-1"
v-if="realData.hasOwnProperty('HDG1-1') && realData['HDG1-1'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-1'].busType)">
</div>
<!-- 第二行 -->
<div class="HDG1-10"
v-if="realData.hasOwnProperty('HDG1-10') && realData['HDG1-10'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-10'].busType)">
</div>
<div class="HDG1-9"
v-if="realData.hasOwnProperty('HDG1-9') && realData['HDG1-9'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-9'].busType)">
</div>
<div class="HDG1-8"
v-if="realData.hasOwnProperty('HDG1-8') && realData['HDG1-8'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-8'].busType)">
</div>
<div class="HDG1-7"
v-if="realData.hasOwnProperty('HDG1-7') && realData['HDG1-7'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-7'].busType)">
</div>
<div class="HDG1-6"
v-if="realData.hasOwnProperty('HDG1-6') && realData['HDG1-6'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-6'].busType)">
</div>
<!-- 第三行 -->
<div class="HDG1-15"
v-if="realData.hasOwnProperty('HDG1-15') && realData['HDG1-15'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-15'].busType)">
</div>
<div class="HDG1-14"
v-if="realData.hasOwnProperty('HDG1-14') && realData['HDG1-14'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-14'].busType)">
</div>
<div class="HDG1-13"
v-if="realData.hasOwnProperty('HDG1-13') && realData['HDG1-13'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-13'].busType)">
</div>
<div class="HDG1-12"
v-if="realData.hasOwnProperty('HDG1-12') && realData['HDG1-12'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-12'].busType)">
</div>
<div class="HDG1-11"
v-if="realData.hasOwnProperty('HDG1-11') && realData['HDG1-11'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-11'].busType)">
</div>
<!-- 第四行 -->
<div class="HDG1-20"
v-if="realData.hasOwnProperty('HDG1-20') && realData['HDG1-20'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-20'].busType)">
</div>
<div class="HDG1-19"
v-if="realData.hasOwnProperty('HDG1-19') && realData['HDG1-19'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-19'].busType)">
</div>
<div class="HDG1-18"
v-if="realData.hasOwnProperty('HDG1-18') && realData['HDG1-18'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-18'].busType)">
</div>
<div class="HDG1-17"
v-if="realData.hasOwnProperty('HDG1-17') && realData['HDG1-17'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-17'].busType)">
</div>
<div class="HDG1-16"
v-if="realData.hasOwnProperty('HDG1-16') && realData['HDG1-16'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-16'].busType)">
</div>
<!-- 第五行 -->
<div class="HDG1-25"
v-if="realData.hasOwnProperty('HDG1-25') && realData['HDG1-25'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-25'].busType)">
</div>
<div class="HDG1-24"
v-if="realData.hasOwnProperty('HDG1-24') && realData['HDG1-24'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-24'].busType)">
</div>
<div class="HDG1-23"
v-if="realData.hasOwnProperty('HDG1-23') && realData['HDG1-23'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-23'].busType)">
</div>
<div class="HDG1-22"
v-if="realData.hasOwnProperty('HDG1-22') && realData['HDG1-22'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-22'].busType)">
</div>
<div class="HDG1-21"
v-if="realData.hasOwnProperty('HDG1-21') && realData['HDG1-21'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-21'].busType)">
</div>
<!-- 第六行 -->
<div class="HDG1-30"
v-if="realData.hasOwnProperty('HDG1-30') && realData['HDG1-30'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-30'].busType)">
</div>
<div class="HDG1-29"
v-if="realData.hasOwnProperty('HDG1-29') && realData['HDG1-29'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-29'].busType)">
</div>
<div class="HDG1-28"
v-if="realData.hasOwnProperty('HDG1-28') && realData['HDG1-28'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-28'].busType)">
</div>
<div class="HDG1-27"
v-if="realData.hasOwnProperty('HDG1-27') && realData['HDG1-27'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-27'].busType)">
</div>
<div class="HDG1-26"
v-if="realData.hasOwnProperty('HDG1-26') && realData['HDG1-26'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-26'].busType)">
</div>
<!-- 第七行 -->
<div class="HDG1-53"
v-if="realData.hasOwnProperty('HDG1-53') && realData['HDG1-53'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-53'].busType)">
</div>
<div class="HDG1-54"
v-if="realData.hasOwnProperty('HDG1-54') && realData['HDG1-54'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-54'].busType)">
</div>
<!-- 第八行 -->
<div class="HDG1-55"
v-if="realData.hasOwnProperty('HDG1-55') && realData['HDG1-55'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-55'].busType)">
</div>
<div class="HDG1-56"
v-if="realData.hasOwnProperty('HDG1-56') && realData['HDG1-56'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-56'].busType)">
</div>
</div>
</div>
</div>
</template>
<script>
export default {
data () {
return {
// 定时器
timer: '',
// 钣金实时信息
realData: {},
// 当前在线车体数量
onlineNumber: null
}
},
methods: {
// 查询钣金实时信息
getSheetMetalInformation () {
this.$fetch('area-controller/realTime-get', { areaNo: '1' }).then(res => {
for (let item of res) {
if (item.code === '1') {
this.realData = _.cloneDeep(item.stationMap);
this.onlineNumber = _.cloneDeep(item.onlineNum);
console.log(this.onlineNumber)
break;
}
}
})
},
// 解析车体样式
resolveCarTypeStyle (type) {
if (type === 'OTHER') {
return 'car-out';
} else {
return '';
}
}
},
mounted () {
setTimeout(() => {
// 查询钣金实时信息
this.getSheetMetalInformation();
this.timer = setInterval(() => {
// 查询钣金实时信息
this.getSheetMetalInformation();
}, 20000);
}, 0)
},
beforeDestroy () {
clearInterval(this.timer);
}
}
</script>
<style lang="scss" scoped>
.page-pack {
width: 100%;
height: 100%;
.container {
width: 1556px;
height: 1037px;
background: url("../../../assets/images/LedCarouselAvi/sheet_metal_bg.png");
overflow: hidden;
position: relative;
// 在线车体数量
.online-number {
width: 270px;
height: 50px;
position: absolute;
right: 126px;
top: 43px;
text-align: center;
line-height: 50px;
font-size: 35px;
color: rgb(255,255,255);
}
// 显示区域
.view-pack {
width: 1272px;
height: 663px;
margin-top: 190px;
margin-left: 141px;
position: relative;
div {
width: 70px;
height: 40px;
position: absolute;
background: url("../../../assets/images/LedCarouselAvi/car.png");
background-position: center 0;
background-repeat: no-repeat;
background-size: 100% 100%;
}
// 第一行
.HDG1-5 {
top: 78px;
left: 22px;
}
.HDG1-4 {
top: 81px;
left: 346px;
}
.HDG1-3 {
top: 81px;
left: 597px;
}
.HDG1-2 {
top: 81px;
left: 874px;
}
.HDG1-1 {
top: 81px;
left: 1127px;
}
// 第二行
.HDG1-10 {
top: 147px;
left: 22px;
}
.HDG1-9 {
top: 147px;
left: 349px;
}
.HDG1-8 {
top: 147px;
left: 602px;
}
.HDG1-7 {
top: 147px;
left: 872px;
}
.HDG1-6 {
top: 147px;
left: 1126px;
}
// 第三行
.HDG1-15 {
top: 220px;
left: 22px;
}
.HDG1-14 {
top: 220px;
left: 349px;
}
.HDG1-13 {
top: 220px;
left: 602px;
}
.HDG1-12 {
top: 220px;
left: 872px;
}
.HDG1-11 {
top: 220px;
left: 1126px;
}
// 第四行
.HDG1-20 {
top: 291px;
left: 22px;
}
.HDG1-19 {
top: 291px;
left: 349px;
}
.HDG1-18 {
top: 291px;
left: 602px;
}
.HDG1-17 {
top: 291px;
left: 872px;
}
.HDG1-16 {
top: 291px;
left: 1126px;
}
// 第五行
.HDG1-25 {
top: 365px;
left: 22px;
}
.HDG1-24 {
top: 365px;
left: 349px;
}
.HDG1-23 {
top: 365px;
left: 602px;
}
.HDG1-22 {
top: 365px;
left: 872px;
}
.HDG1-21 {
top: 365px;
left: 1126px;
}
// 第六行
.HDG1-30 {
top: 434px;
left: 22px;
}
.HDG1-29 {
top: 434px;
left: 349px;
}
.HDG1-28 {
top: 434px;
left: 602px;
}
.HDG1-27 {
top: 434px;
left: 872px;
}
.HDG1-26 {
top: 434px;
left: 1126px;
}
// 第七行
.HDG1-53 {
top: 505px;
left: 22px;
}
.HDG1-54 {
top: 505px;
left: 365px;
}
// 第八行
.HDG1-55 {
top: 575px;
left: 22px;
}
.HDG1-56 {
top: 575px;
left: 365px;
}
}
}
// 轻客车体样式
.car-out {
background: url('../../../assets/images/LedCarouselAvi/car_out.png');
background-position: center 0;
background-repeat: no-repeat;
background-size: 100% 100%;
}
}
</style>
\ No newline at end of file
<template>
<div class="page-pack">
<div class="container"></div>
<div class="container">
<!-- 电泳工作区 -->
<!-- <Electrophoresis></Electrophoresis> -->
<!-- 钣金工作区 -->
<!-- <SheetMetal></SheetMetal> -->
<!-- 密封防腐工作区 -->
<SealedAnticorrosion></SealedAnticorrosion>
</div>
</div>
</template>
<script>
import Electrophoresis from './components/Electrophoresis'
import SheetMetal from './components/SheetMetal'
import SealedAnticorrosion from './components/SealedAnticorrosion'
export default {
components: {
Electrophoresis,
SheetMetal,
SealedAnticorrosion
},
data () {
return {}
}
......@@ -21,7 +37,6 @@
width: 1556px;
height: 1037px;
margin: 0 auto;
background: url("../../assets/images/LedCarouselAvi/test.png") no-repeat;
}
}
</style>
\ No newline at end of file
......@@ -178,11 +178,11 @@
pageSize: this.tableConfig.paginationConfig.pageSize,
pageNum: this.tableConfig.paginationConfig.currentPage
}
queryParams.filters.push({
fieldCode: 'workshopCode',
fieldType: 'STRING',
value: this.currentWorkshopCode
})
// queryParams.filters.push({
// fieldCode: 'workshopCode',
// fieldType: 'STRING',
// value: this.currentWorkshopCode
// })
return new Promise((resolve, reject) => {
this.$fetch('equipment-controller/data-post', queryParams).then((response) => {
this.tableConfig.data = _.cloneDeep(response.list)
......@@ -214,11 +214,11 @@
searchCode: this.currentSearchCode,
filters: _.cloneDeep(this.searchList.filters) || []
}
queryParams.filters.push({
fieldCode: 'workshopCode',
fieldType: 'STRING',
value: this.currentWorkshopCode
})
// queryParams.filters.push({
// fieldCode: 'workshopCode',
// fieldType: 'STRING',
// value: this.currentWorkshopCode
// })
try {
let response = await request({
url: `${process.env.API_HOST}/api/equipment/data/export`,
......
......@@ -193,11 +193,11 @@
pageSize: this.tableConfig.paginationConfig.pageSize,
pageNum: this.tableConfig.paginationConfig.currentPage
}
queryParams.filters.push({
fieldCode: 'workshopCode',
fieldType: 'STRING',
value: this.currentWorkshopCode
})
// queryParams.filters.push({
// fieldCode: 'workshopCode',
// fieldType: 'STRING',
// value: this.currentWorkshopCode
// })
return new Promise((resolve, reject) => {
this.$fetch('equipment-controller/data-post', queryParams).then((response) => {
this.tableConfig.data = _.cloneDeep(response.list)
......@@ -229,11 +229,11 @@
searchCode: this.currentSearchCode,
filters: _.cloneDeep(this.searchList.filters) || []
}
queryParams.filters.push({
fieldCode: 'workshopCode',
fieldType: 'STRING',
value: this.currentWorkshopCode
})
// queryParams.filters.push({
// fieldCode: 'workshopCode',
// fieldType: 'STRING',
// value: this.currentWorkshopCode
// })
try {
let response = await request({
url: `${process.env.API_HOST}/api/equipment/data/export`,
......
......@@ -198,11 +198,11 @@
pageSize: this.tableConfig.paginationConfig.pageSize,
pageNum: this.tableConfig.paginationConfig.currentPage
}
queryParams.filters.push({
fieldCode: 'workshopCode',
fieldType: 'STRING',
value: this.currentWorkshopCode
})
// queryParams.filters.push({
// fieldCode: 'workshopCode',
// fieldType: 'STRING',
// value: this.currentWorkshopCode
// })
return new Promise((resolve, reject) => {
this.$fetch('equipment-controller/data-post', queryParams).then((response) => {
this.tableConfig.data = _.cloneDeep(response.list)
......@@ -234,11 +234,11 @@
searchCode: this.currentSearchCode,
filters: _.cloneDeep(this.searchList.filters) || []
}
queryParams.filters.push({
fieldCode: 'workshopCode',
fieldType: 'STRING',
value: this.currentWorkshopCode
})
// queryParams.filters.push({
// fieldCode: 'workshopCode',
// fieldType: 'STRING',
// value: this.currentWorkshopCode
// })
try {
let response = await request({
url: `${process.env.API_HOST}/api/equipment/data/export`,
......
......@@ -212,11 +212,11 @@
pageSize: this.tableConfig.paginationConfig.pageSize,
pageNum: this.tableConfig.paginationConfig.currentPage
}
queryParams.filters.push({
fieldCode: 'workshopCode',
fieldType: 'STRING',
value: this.currentWorkshopCode
})
// queryParams.filters.push({
// fieldCode: 'workshopCode',
// fieldType: 'STRING',
// value: this.currentWorkshopCode
// })
return new Promise((resolve, reject) => {
this.$fetch('equipment-controller/data-post', queryParams).then((response) => {
this.tableConfig.data = _.cloneDeep(response.list)
......@@ -248,11 +248,11 @@
searchCode: this.currentSearchCode,
filters: _.cloneDeep(this.searchList.filters) || []
}
queryParams.filters.push({
fieldCode: 'workshopCode',
fieldType: 'STRING',
value: this.currentWorkshopCode
})
// queryParams.filters.push({
// fieldCode: 'workshopCode',
// fieldType: 'STRING',
// value: this.currentWorkshopCode
// })
try {
let response = await request({
url: `${process.env.API_HOST}/api/equipment/data/export`,
......
......@@ -178,11 +178,11 @@
pageSize: this.tableConfig.paginationConfig.pageSize,
pageNum: this.tableConfig.paginationConfig.currentPage
}
queryParams.filters.push({
fieldCode: 'workshopCode',
fieldType: 'STRING',
value: this.currentWorkshopCode
})
// queryParams.filters.push({
// fieldCode: 'workshopCode',
// fieldType: 'STRING',
// value: this.currentWorkshopCode
// })
return new Promise((resolve, reject) => {
this.$fetch('equipment-controller/data-post', queryParams).then((response) => {
this.tableConfig.data = _.cloneDeep(response.list)
......@@ -214,11 +214,11 @@
searchCode: this.currentSearchCode,
filters: _.cloneDeep(this.searchList.filters) || []
}
queryParams.filters.push({
fieldCode: 'workshopCode',
fieldType: 'STRING',
value: this.currentWorkshopCode
})
// queryParams.filters.push({
// fieldCode: 'workshopCode',
// fieldType: 'STRING',
// value: this.currentWorkshopCode
// })
try {
let response = await request({
url: `${process.env.API_HOST}/api/equipment/data/export`,
......
......@@ -178,11 +178,11 @@
pageSize: this.tableConfig.paginationConfig.pageSize,
pageNum: this.tableConfig.paginationConfig.currentPage
}
queryParams.filters.push({
fieldCode: 'workshopCode',
fieldType: 'STRING',
value: this.currentWorkshopCode
})
// queryParams.filters.push({
// fieldCode: 'workshopCode',
// fieldType: 'STRING',
// value: this.currentWorkshopCode
// })
return new Promise((resolve, reject) => {
this.$fetch('equipment-controller/data-post', queryParams).then((response) => {
this.tableConfig.data = _.cloneDeep(response.list)
......@@ -214,11 +214,11 @@
searchCode: this.currentSearchCode,
filters: _.cloneDeep(this.searchList.filters) || []
}
queryParams.filters.push({
fieldCode: 'workshopCode',
fieldType: 'STRING',
value: this.currentWorkshopCode
})
// queryParams.filters.push({
// fieldCode: 'workshopCode',
// fieldType: 'STRING',
// value: this.currentWorkshopCode
// })
try {
let response = await request({
url: `${process.env.API_HOST}/api/equipment/data/export`,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment