Skip to content

Z
zhongtong-avi-web
Commit 82a87bf7 authored by 李志鸣's avatar 李志鸣
Browse files
Options

fea(Led Avi 轮播): 新增各个区域页面文件及背景图片

parent ed7700f3
Show whitespace changes
Inline Side-by-side
Showing with 268 additions and 26 deletions
src/views/LedCarouselAvi/components/ComplexionPaint.vue 0 → 100644
View file @ 82a87bf7
<template>
<!-- 面/色漆工作区 -->
<div></div>
</template>
<script>
export default {
data () {
return {}
}
}
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
src/views/LedCarouselAvi/components/Finished.vue 0 → 100644
View file @ 82a87bf7
<template>
<!-- 成品车存放区 -->
<div></div>
</template>
<script>
export default {
data () {
return {}
}
}
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
src/views/LedCarouselAvi/components/MiddleCoat.vue 0 → 100644
View file @ 82a87bf7
<template>
<!-- 中涂工作区 -->
<div></div>
</template>
<script>
export default {
data () {
return {}
}
}
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
src/views/LedCarouselAvi/components/Putty.vue 0 → 100644
View file @ 82a87bf7
<template>
<!-- 腻子工作区 -->
<div></div>
</template>
<script>
export default {
data () {
return {}
}
}
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
src/views/LedCarouselAvi/components/SealedAnticorrosion.vue
View file @ 82a87bf7
<template> <template>
<!-- 密封防腐作业区 -->
<div class="page-pack"> <div class="page-pack">
<div class="container"> <div class="container">
<!-- 在线车体数量 -->
<div class="online-number">
<span>数量：{{onlineNumber !== null ? onlineNumber : '0'}}</span>
</div>
<div class="view-pack"> <div class="view-pack">
<!-- 第一行 --> <!-- 第一行 -->
<div class="HDG1-57"></div> <div class="HDG1-57"
<div class="HDG1-67"></div> v-if="realData.hasOwnProperty('HDG1-57') && realData['HDG1-57'].state !== 'FREE'"
<div class="HDG1-68"></div> :class="resolveCarTypeStyle(realData['HDG1-57'].busType)">
<div class="HDG1-69"></div> </div>
<div class="HDG1-70"></div> <div class="HDG1-67"
v-if="realData.hasOwnProperty('HDG1-67') && realData['HDG1-67'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-67'].busType)">
</div>
<div class="HDG1-68"
v-if="realData.hasOwnProperty('HDG1-68') && realData['HDG1-68'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-68'].busType)">
</div>
<div class="HDG1-69"
v-if="realData.hasOwnProperty('HDG1-69') && realData['HDG1-69'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-69'].busType)">
</div>
<div class="HDG1-70"
v-if="realData.hasOwnProperty('HDG1-70') && realData['HDG1-70'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-70'].busType)">
</div>
<!-- 第二行 --> <!-- 第二行 -->
<div class="HDG1-58"></div> <div class="HDG1-58"
<div class="HDG1-71"></div> v-if="realData.hasOwnProperty('HDG1-58') && realData['HDG1-58'].state !== 'FREE'"
<div class="HDG1-72"></div> :class="resolveCarTypeStyle(realData['HDG1-58'].busType)">
<div class="HDG1-73"></div> </div>
<div class="HDG1-74"></div> <div class="HDG1-71"
<div class="HDG5-8"></div> v-if="realData.hasOwnProperty('HDG1-71') && realData['HDG1-71'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-71'].busType)">
</div>
<div class="HDG1-72"
v-if="realData.hasOwnProperty('HDG1-72') && realData['HDG1-72'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-72'].busType)">
</div>
<div class="HDG1-73"
v-if="realData.hasOwnProperty('HDG1-73') && realData['HDG1-73'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-73'].busType)">
</div>
<div class="HDG1-74"
v-if="realData.hasOwnProperty('HDG1-74') && realData['HDG1-74'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-74'].busType)">
</div>
<div class="HDG5-8"
v-if="realData.hasOwnProperty('HDG5-8') && realData['HDG5-8'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG5-8'].busType)">
</div>
<!-- 第三行 --> <!-- 第三行 -->
<div class="HDG1-75"></div> <div class="HDG1-75"
<div class="HDG1-76"></div> v-if="realData.hasOwnProperty('HDG1-75') && realData['HDG1-75'].state !== 'FREE'"
<div class="HDG1-77"></div> :class="resolveCarTypeStyle(realData['HDG1-75'].busType)">
<div class="HDG1-78"></div> </div>
<div class="HDG1-79"></div> <div class="HDG1-76"
<div class="HDG5-9"></div> v-if="realData.hasOwnProperty('HDG1-76') && realData['HDG1-76'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-76'].busType)">
</div>
<div class="HDG1-77"
v-if="realData.hasOwnProperty('HDG1-77') && realData['HDG1-77'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-77'].busType)">
</div>
<div class="HDG1-78"
v-if="realData.hasOwnProperty('HDG1-78') && realData['HDG1-78'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-78'].busType)">
</div>
<div class="HDG1-79"
v-if="realData.hasOwnProperty('HDG1-79') && realData['HDG1-79'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-79'].busType)">
</div>
<div class="HDG5-9"
v-if="realData.hasOwnProperty('HDG5-9') && realData['HDG5-9'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG5-9'].busType)">
</div>
<!-- 第四行 --> <!-- 第四行 -->
<div class="HDG1-80"></div> <div class="HDG1-80"
<div class="HDG1-81"></div> v-if="realData.hasOwnProperty('HDG1-80') && realData['HDG1-80'].state !== 'FREE'"
<div class="HDG1-82"></div> :class="resolveCarTypeStyle(realData['HDG1-80'].busType)">
<div class="HDG1-83"></div> </div>
<div class="HDG1-81"
v-if="realData.hasOwnProperty('HDG1-81') && realData['HDG1-81'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-81'].busType)">
</div>
<div class="HDG1-82"
v-if="realData.hasOwnProperty('HDG1-82') && realData['HDG1-82'].state !== 'FREE'"
:class="resolveCarTypeStyle(realData['HDG1-82'].busType)">
</div>
<div class="HDG1-83"
>
</div>
<div class="HDG1-84"></div> <div class="HDG1-84"></div>
<div class="HDG5-10"></div> <div class="HDG5-10"></div>
<!-- 第五行 --> <!-- 第五行 -->
...@@ -36,6 +103,13 @@ ...@@ -36,6 +103,13 @@
<div class="HDG1-88"></div> <div class="HDG1-88"></div>
<div class="HDG1-89"></div> <div class="HDG1-89"></div>
<div class="HDG5-11"></div> <div class="HDG5-11"></div>
<!-- 第六行 -->
<div class="HDG1-90"></div>
<div class="HDG1-91"></div>
<div class="HDG1-92"></div>
<div class="HDG1-93"></div>
<div class="HDG1-94"></div>
<div class="HDG5-12"></div>
</div> </div>
</div> </div>
</div> </div>
...@@ -44,7 +118,50 @@ ...@@ -44,7 +118,50 @@
<script> <script>
export default { export default {
data () { data () {
return {} return {
// 实时车体数量
onlineNumber: null,
// 密封防腐实时数据
realData: {},
// 定时器
timer: ''
}
},
methods: {
// 查询密封防腐实时信息
getSealedAnticorrosionInformation () {
let queryParams = {areaNo: '3'};
this.$fetch('area-controller/realTime-get', queryParams).then(res => {
for (let item of res) {
if (item.code === '3') {
this.realData = _.cloneDeep(item.stationMap);
this.onlineNumber = _.cloneDeep(item.onlineNum);
break;
}
}
})
},
// 解析车体样式
resolveCarTypeStyle (type) {
if (type === 'OTHER') {
return 'car-out';
} else {
return '';
}
}
},
mounted () {
setTimeout(() => {
// 查询密封防腐实时信息
this.getSealedAnticorrosionInformation()
this.timer = setInterval(() => {
// 查询密封防腐实时信息
this.getSealedAnticorrosionInformation()
}, 20000)
}, 0)
},
beforeDestroy () {
clearInterval(this.timer);
} }
} }
</script> </script>
...@@ -59,6 +176,18 @@ ...@@ -59,6 +176,18 @@
background: url("../../../assets/images/LedCarouselAvi/sealed_anticorrosion-bg.png"); background: url("../../../assets/images/LedCarouselAvi/sealed_anticorrosion-bg.png");
overflow: hidden; overflow: hidden;
position: relative; 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 { .view-pack {
width: 1338px; width: 1338px;
...@@ -196,7 +325,39 @@ ...@@ -196,7 +325,39 @@
top: 377px; top: 377px;
left: 1194px; left: 1194px;
} }
// 第六行
.HDG1-90 {
top: 460px;
left: 35px;
}
.HDG1-91 {
top: 460px;
left: 234px;
}
.HDG1-92 {
top: 460px;
left: 429px;
}
.HDG1-93 {
top: 460px;
left: 627px;
}
.HDG1-94 {
top: 460px;
left: 823px;
}
.HDG5-12 {
top: 460px;
left: 1194px;
}
}
} }
// 轻客车体样式
.car-out {
background: url('../../../assets/images/LedCarouselAvi/car_out.png');
background-position: center 0;
background-repeat: no-repeat;
background-size: 100% 100%;
} }
} }
</style> </style>
\ No newline at end of file
src/views/LedCarouselAvi/components/SheetMetal.vue
View file @ 82a87bf7
...@@ -177,7 +177,6 @@ ...@@ -177,7 +177,6 @@
if (item.code === '1') { if (item.code === '1') {
this.realData = _.cloneDeep(item.stationMap); this.realData = _.cloneDeep(item.stationMap);
this.onlineNumber = _.cloneDeep(item.onlineNum); this.onlineNumber = _.cloneDeep(item.onlineNum);
console.log(this.onlineNumber)
break; break;
} }
} }
......
src/views/LedCarouselAvi/index.vue
View file @ 82a87bf7
...@@ -6,7 +6,15 @@ ...@@ -6,7 +6,15 @@
<!-- 钣金工作区 --> <!-- 钣金工作区 -->
<!-- <SheetMetal></SheetMetal> --> <!-- <SheetMetal></SheetMetal> -->
<!-- 密封防腐工作区 --> <!-- 密封防腐工作区 -->
<SealedAnticorrosion></SealedAnticorrosion> <!-- <SealedAnticorrosion></SealedAnticorrosion> -->
<!-- 腻子工作区 -->
<!-- <Putty></Putty> -->
<!-- 中涂工作区 -->
<!-- <MiddleCoat></MiddleCoat> -->
<!-- 面/色漆工作区 -->
<!-- <ComplexionPaint></ComplexionPaint> -->
<!-- 成品车存放区 -->
<!-- <finished></finished> -->
</div> </div>
</div> </div>
</template> </template>
...@@ -15,12 +23,20 @@ ...@@ -15,12 +23,20 @@
import Electrophoresis from './components/Electrophoresis' import Electrophoresis from './components/Electrophoresis'
import SheetMetal from './components/SheetMetal' import SheetMetal from './components/SheetMetal'
import SealedAnticorrosion from './components/SealedAnticorrosion' import SealedAnticorrosion from './components/SealedAnticorrosion'
import Putty from './components/Putty'
import MiddleCoat from './components/MiddleCoat'
import ComplexionPaint from './components/ComplexionPaint'
import finished from './components/Finished'
export default { export default {
components: { components: {
Electrophoresis, Electrophoresis,
SheetMetal, SheetMetal,
SealedAnticorrosion SealedAnticorrosion,
Putty,
MiddleCoat,
ComplexionPaint,
finished
}, },
data () { data () {
return {} return {}
......
src/views/Monitor/components/SealedAnticorrosion.vue
View file @ 82a87bf7
...@@ -361,7 +361,9 @@ export default { ...@@ -361,7 +361,9 @@ export default {
response => { response => {
for (let item of response) { for (let item of response) {
if (item.code === '3') { if (item.code === '3') {
this.sealedAnticorrosion = _.cloneDeep(item); this.sealedAnticorrosion = _.cloneDeep(item.stationMap);
this.onlineNum = _.cloneDeep(item.onlineNum);
break;
} }
} }
} }
......
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