Skip to content

Z
zhongtong-avi-web
Commit ad40b9a6 authored by 车宾's avatar 车宾
Browse files
Options

feat（钣金作业区）：功能联调

parent b8d852f4
Hide whitespace changes
Inline Side-by-side
Showing with 562 additions and 481 deletions
src/views/Monitor/components/ComplexionPaint.vue
View file @ ad40b9a6
......@@ -42,14 +42,6 @@
>
<p>{{query['HDG1-168'].busNo}}</p>
</div>
<!-- <div
class="paint-row-1-5"
@click="clickBtn(query['HDG1-166'].busNo)"
v-if="query.hasOwnProperty('HDG1-166') && query['HDG1-166'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-166'].busType, 'HDG1-166')"
>
<p>{{query['HDG1-166'].busNo}}</p> -->
<!-- </div> -->
<!-- 第二行 -->
<div
class="paint-row-2-0"
......@@ -91,14 +83,6 @@
>
<p>{{query['HDG1-171'].busNo}}</p>
</div>
<!-- <div
class="paint-row-2-5"
@click="clickBtn(query['HDG1-166'].busNo)"
v-if="query.hasOwnProperty('HDG1-166') && query['HDG1-166'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-166'].busType, 'HDG1-166')"
>
<p>{{query['HDG1-166'].busNo}}</p>
</div> -->
<!-- 第三行 -->
<div
class="paint-row-3-0"
......@@ -140,14 +124,6 @@
>
<p>{{query['HDG1-174'].busNo}}</p>
</div>
<!-- <div
class="paint-row-3-5"
@click="clickBtn(query['HDG1-166'].busNo)"
v-if="query.hasOwnProperty('HDG1-166') && query['HDG1-166'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-166'].busType, 'HDG1-166')"
>
<p>{{query['HDG1-166'].busNo}}</p>
</div> -->
<!-- 第四行 -->
<div
class="paint-row-4-0"
......@@ -189,14 +165,6 @@
>
<p>{{query['HDG1-177'].busNo}}</p>
</div>
<!-- <div
class="paint-row-4-5"
@click="clickBtn(query['HDG1-166'].busNo)"
v-if="query.hasOwnProperty('HDG1-166') && query['HDG1-166'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-166'].busType, 'HDG1-166')"
>
<p>{{query['HDG1-166'].busNo}}</p>
</div> -->
<!-- 第五行 -->
<div
class="paint-row-5-0"
......@@ -238,15 +206,6 @@
>
<p>{{query['HDG1-180'].busNo}}</p>
</div>
<!-- <div
class="paint-row-5-5"
@click="clickBtn(query['HDG1-166'].busNo)"
v-if="query.hasOwnProperty('HDG1-166') && query['HDG1-166'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-166'].busType, 'HDG1-166')"
>
<p>{{query['HDG1-166'].busNo}}</p>
</div> -->
<!-- 第六行 -->
<div
class="paint-row-6-0"
......@@ -288,15 +247,6 @@
>
<p>{{query['HDG1-183'].busNo}}</p>
</div>
<!-- <div
class="paint-row-6-5"
@click="clickBtn(query['HDG1-166'].busNo)"
v-if="query.hasOwnProperty('HDG1-166') && query['HDG1-166'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-166'].busType, 'HDG1-166')"
>
<p>{{query['HDG1-166'].busNo}}</p>
</div> -->
<!-- 第七行 -->
<div
class="paint-row-7-0"
......@@ -338,14 +288,6 @@
>
<p>{{query['HDG1-186'].busNo}}</p>
</div>
<!-- <div
class="paint-row-7-5"
@click="clickBtn(query['HDG1-166'].busNo)"
v-if="query.hasOwnProperty('HDG1-166') && query['HDG1-166'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-166'].busType, 'HDG1-166')"
>
<p>{{query['HDG1-166'].busNo}}</p>
</div> -->
<!-- 第八行 -->
<div
class="paint-row-8-0"
......@@ -387,14 +329,6 @@
>
<p>{{query['HDG1-189'].busNo}}</p>
</div>
<!-- <div
class="paint-row-8-5"
@click="clickBtn(query['HDG1-166'].busNo)"
v-if="query.hasOwnProperty('HDG1-166') && query['HDG1-166'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-166'].busType, 'HDG1-166')"
>
<p>{{query['HDG1-166'].busNo}}</p>
</div> -->
<!-- 第九行 -->
<div
class="paint-row-9-0"
......@@ -412,14 +346,6 @@
>
<p>{{query['HDG1-158'].busNo}}</p>
</div>
<!-- <div
class="paint-row-9-1"
@click="clickBtn(query['HDG1-190'].busNo)"
v-if="query.hasOwnProperty('HDG1-190') && query['HDG1-190'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-190'].busType, 'HDG1-190')"
>
<p>{{query['HDG1-190'].busNo}}</p>
</div> -->
<div
class="paint-row-9-2"
@click="clickBtn(query['HDG1-190'].busNo)"
......@@ -444,14 +370,6 @@
>
<p>{{query['HDG1-192'].busNo}}</p>
</div>
<!-- <div
class="paint-row-9-5"
@click="clickBtn(query['HDG1-166'].busNo)"
v-if="query.hasOwnProperty('HDG1-166') && query['HDG1-166'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-166'].busType, 'HDG1-166')"
>
<p>{{query['HDG1-166'].busNo}}</p>
</div> -->
<!-- 第十行 -->
<div
class="paint-row-10-0"
......@@ -492,14 +410,6 @@
>
<p>{{query['HDG1-195'].busNo}}</p>
</div>
<!-- <div
class="paint-row-10-5"
@click="clickBtn(query['HDG1-166'].busNo)"
v-if="query.hasOwnProperty('HDG1-166') && query['HDG1-166'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-166'].busType, 'HDG1-166')"
>
<p>{{query['HDG1-166'].busNo}}</p>
</div> -->
<!-- 第十一行 -->
<div
class=" paint-row-11-0"
......@@ -541,14 +451,6 @@
>
<p>{{query['HDG1-198'].busNo}}</p>
</div>
<!-- <div
class="paint-row-11-5"
@click="clickBtn(query['HDG1-166'].busNo)"
v-if="query.hasOwnProperty('HDG1-166') && query['HDG1-166'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-166'].busType, 'HDG1-166')"
>
<p>{{query['HDG1-166'].busNo}}</p>
</div> -->
<!-- 第十二行 -->
<div
class=" paint-row-12-0"
......@@ -651,71 +553,12 @@ export default {
},
data () {
return {
// 当前在线人数
onlineNum: null,
// 车体定位信息
busPosition: {},
// 面色/漆作业区域实时信息
query: {
'HDG1-134': {
areaId: 0,
areaName: 'DF20191010',
busNo: 'DF20191010',
busType: 'OTHER', //IN/OUT
code: 'string',
id: 0,
keyStation: true,
laneCode: 'string',
laneId: 0,
sequence: 0,
skidID: 0,
state: 'USE', //0.1 Y/N
workshopCode: 'string'
},
'HDG1-150': {
areaId: 0,
areaName: 'DF205411010',
busNo: 'DF20190110',
busType: 'OWN', //IN/OUT
code: 'string',
id: 0,
keyStation: true,
laneCode: 'string',
laneId: 0,
sequence: 0,
skidID: 0,
state: 'USE', //0.1 Y/N
workshopCode: 'string'
},
'HDG1-166': {
areaId: 0,
areaName: 'DF205411010',
busNo: 'DN20191010',
busType: 'OTHER', //IN/OUT
code: 'string',
id: 0,
keyStation: true,
laneCode: 'string',
laneId: 0,
sequence: 0,
skidID: 0,
state: 'USE', //0.1 Y/N
workshopCode: 'string'
},
'HDG1-167': {
areaId: 0,
areaName: 'DF205411010',
busNo: 'DN20191010',
busType: 'OTHER', //IN/OUT
code: 'string',
id: 0,
keyStation: true,
laneCode: 'string',
laneId: 0,
sequence: 0,
skidID: 0,
state: 'USE', //0.1 Y/N
workshopCode: 'string'
}
},
query: {},
// 根据车身号获得当前车体信息
BusInformation: {
saleOrderNo: '2019-10-11 11:09',
......@@ -740,7 +583,16 @@ export default {
this.$fetch('area-controller/realTime-get', { areaNo: '6' })
.then(res => {
// console.log(res);
this.query = _.cloneDeep(res);
// this.query = _.cloneDeep(res);
for (let i = 0; i < res.length; i++) {
if (res[i].code === '6') {
console.log(res[i]);
this.query = _.cloneDeep(res[i].stationMap);
// 获取当前在线人数
this.onlineNum = _.clone(res[i].onlineNum);
console.log(this.onlineNum)
}
}
console.log(this.query);
})
.catch(error => {
......
src/views/Monitor/components/Electrophoresis.vue
View file @ ad40b9a6
......@@ -449,54 +449,12 @@ export default {
},
data () {
return {
// 当前在线人数
onlineNum: null,
// 车体定位信息
busPosition: {},
// 电泳作业区域实时信息
query: {
'STC1-1': {
areaId: 0,
areaName: 'DF20191010',
busNo: 'DF20191010',
busType: 'OTHER', //IN/OUT
code: 'string',
id: 0,
keyStation: true,
laneCode: 'string',
laneId: 0,
sequence: 0,
skidID: 0,
state: 'USE', //0.1 Y/N
workshopCode: 'string'
},
'STC1-8': {
areaId: 0,
areaName: 'DF205411010',
busNo: 'DF20191010',
busType: 'OWN', //IN/OUT
code: 'string',
id: 0,
keyStation: true,
laneCode: 'string',
laneId: 0,
sequence: 0,
skidID: 0,
state: 'USE', //0.1 Y/N
workshopCode: 'string'
},
'HDG1-31': {
areaId: 0,
areaName: 'DF205411010',
busNo: 'DF20191010',
busType: 'OTHER', //IN/OUT
code: 'string',
id: 0,
keyStation: true,
laneCode: 'string',
laneId: 0,
sequence: 0,
skidID: 0,
state: 'USE', //0.1 Y/N
workshopCode: 'string'
}
},
query: {},
// 根据车身号获得当前车体信息
BusInformation: {
'saleOrderNo': '201905201252',
......@@ -535,6 +493,15 @@ export default {
this.$fetch('area-controller/realTime-get', { areaNo: '2' })
.then(res => {
console.log('getall', res);
for (let i = 0; i < res.length; i++) {
if (res[i].code === '2') {
console.log(res[i]);
this.query = _.cloneDeep(res[i].stationMap);
// 获取当前在线人数
this.onlineNum = _.clone(res[i].onlineNum);
console.log(this.onlineNum)
}
}
})
.catch(error => {
reject(error);
......
src/views/Monitor/components/SheetMetalCar.vue
View file @ ad40b9a6
......@@ -3,339 +3,601 @@
<div class="page-pack">
<div class="container-pack">
<!--第一行-->
<div class="sheet-row-1-1">
<p>CDA213</p>
</div>
<div class="sheet-row-1-2">
<p>CDA213</p>
</div>
<div class="sheet-row-1-3">
<p>CDA213</p>
</div>
<div class="sheet-row-1-4">
<p>CDA213</p>
</div>
<div class="sheet-row-1-5">
<p>CDA213</p>
<div
class="sheet-row-1-1"
@click="clickBtn(query['HDG1-5'].busNo)"
v-if="query.hasOwnProperty('HDG1-5') && query['HDG1-5'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-5'].busType, 'HDG1-5')"
>
<p>{{query['HDG1-5'].busNo}}</p>
</div>
<div
class="sheet-row-1-2"
@click="clickBtn(query['HDG1-4'].busNo)"
v-if="query.hasOwnProperty('HDG1-4') && query['HDG1-4'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-4'].busType, 'HDG1-4')"
>
<p>{{query['HDG1-4'].busNo}}</p>
</div>
<div
class="sheet-row-1-3"
@click="clickBtn(query['HDG1-3'].busNo)"
v-if="query.hasOwnProperty('HDG1-3') && query['HDG1-3'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-3'].busType, 'HDG1-3')"
>
<p>{{query['HDG1-3'].busNo}}</p>
</div>
<div
class="sheet-row-1-4"
@click="clickBtn(query['HDG1-2'].busNo)"
v-if="query.hasOwnProperty('HDG1-2') && query['HDG1-2'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-2'].busType, 'HDG1-2')"
>
<p>{{query['HDG1-2'].busNo}}</p>
</div>
<div
class="sheet-row-1-5"
@click="clickBtn(query['HDG1-1'].busNo)"
v-if="query.hasOwnProperty('HDG1-1') && query['HDG1-1'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-1'].busType, 'HDG1-1')"
>
<p>{{query['HDG1-1'].busNo}}</p>
</div>
<!--第二行-->
<div class="sheet-row-2-1">
<p>CDA213</p>
</div>
<div class="sheet-row-2-2">
<p>CDA213</p>
</div>
<div class="sheet-row-2-3">
<p>CDA213</p>
</div>
<div class="sheet-row-2-3">
<p>CDA213</p>
</div>
<div class="sheet-row-2-4">
<p>CDA213</p>
</div>
<div class="sheet-row-2-5">
<p>CDA213</p>
<div
class="sheet-row-2-1"
@click="clickBtn(query['HDG1-10'].busNo)"
v-if="query.hasOwnProperty('HDG1-10') && query['HDG1-10'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-10'].busType, 'HDG1-10')"
>
<p>{{query['HDG1-10'].busNo}}</p>
</div>
<div
class="sheet-row-2-2"
@click="clickBtn(query['HDG1-9'].busNo)"
v-if="query.hasOwnProperty('HDG1-9') && query['HDG1-9'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-9'].busType, 'HDG1-9')"
>
<p>{{query['HDG1-9'].busNo}}</p>
</div>
<div
class="sheet-row-2-3"
@click="clickBtn(query['HDG1-8'].busNo)"
v-if="query.hasOwnProperty('HDG1-8') && query['HDG1-8'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-8'].busType, 'HDG1-8')"
>
<p>{{query['HDG1-8'].busNo}}</p>
</div>
<div
class="sheet-row-2-4"
@click="clickBtn(query['HDG1-7'].busNo)"
v-if="query.hasOwnProperty('HDG1-7') && query['HDG1-7'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-7'].busType, 'HDG1-7')"
>
<p>{{query['HDG1-7'].busNo}}</p>
</div>
<div
class="sheet-row-2-5"
@click="clickBtn(query['HDG1-6'].busNo)"
v-if="query.hasOwnProperty('HDG1-6') && query['HDG1-6'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-6'].busType, 'HDG1-6')"
>
<p>{{query['HDG1-6'].busNo}}</p>
</div>
<!--第三行-->
<div class="sheet-row-3-1">
<p>CDA213</p>
</div>
<div class="sheet-row-3-2">
<p>CDA213</p>
</div>
<div class="sheet-row-3-3">
<p>CDA213</p>
</div>
<div class="sheet-row-3-4">
<p>CDA213</p>
</div>
<div class="sheet-row-3-5">
<p>CDA213</p>
<div
class="sheet-row-3-1"
@click="clickBtn(query['HDG1-15'].busNo)"
v-if="query.hasOwnProperty('HDG1-15') && query['HDG1-15'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-15'].busType, 'HDG1-15')"
>
<p>{{query['HDG1-15'].busNo}}</p>
</div>
<div
class="sheet-row-3-2"
@click="clickBtn(query['HDG1-14'].busNo)"
v-if="query.hasOwnProperty('HDG1-14') && query['HDG1-14'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-14'].busType, 'HDG1-14')"
>
<p>{{query['HDG1-14'].busNo}}</p>
</div>
<div
class="sheet-row-3-3"
@click="clickBtn(query['HDG1-13'].busNo)"
v-if="query.hasOwnProperty('HDG1-13') && query['HDG1-13'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-13'].busType, 'HDG1-13')"
>
<p>{{query['HDG1-13'].busNo}}</p>
</div>
<div
class="sheet-row-3-4"
@click="clickBtn(query['HDG1-12'].busNo)"
v-if="query.hasOwnProperty('HDG1-12') && query['HDG1-12'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-12'].busType, 'HDG1-12')"
>
<p>{{query['HDG1-12'].busNo}}</p>
</div>
<div
class="sheet-row-3-5"
@click="clickBtn(query['HDG1-11'].busNo)"
v-if="query.hasOwnProperty('HDG1-11') && query['HDG1-11'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-11'].busType, 'HDG1-11')"
>
<p>{{query['HDG1-11'].busNo}}</p>
</div>
<!--第四行-->
<div class="sheet-row-4-1">
<p>CDA213</p>
</div>
<div class="sheet-row-4-2">
<p>CDA213</p>
</div>
<div class="sheet-row-4-3">
<p>CDA213</p>
</div>
<div class="sheet-row-4-4">
<p>CDA213</p>
</div>
<div class="sheet-row-4-5">
<p>CDA213</p>
<div
class="sheet-row-4-1"
@click="clickBtn(query['HDG1-20'].busNo)"
v-if="query.hasOwnProperty('HDG1-20') && query['HDG1-20'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-20'].busType, 'HDG1-20')"
>
<p>{{query['HDG1-20'].busNo}}</p>
</div>
<div
class="sheet-row-4-2"
@click="clickBtn(query['HDG1-19'].busNo)"
v-if="query.hasOwnProperty('HDG1-19') && query['HDG1-19'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-19'].busType, 'HDG1-19')"
>
<p>{{query['HDG1-19'].busNo}}</p>
</div>
<div
class="sheet-row-4-3"
@click="clickBtn(query['HDG1-18'].busNo)"
v-if="query.hasOwnProperty('HDG1-18') && query['HDG1-18'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-18'].busType, 'HDG1-18')"
>
<p>{{query['HDG1-18'].busNo}}</p>
</div>
<div
class="sheet-row-4-4"
@click="clickBtn(query['HDG1-17'].busNo)"
v-if="query.hasOwnProperty('HDG1-17') && query['HDG1-17'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-17'].busType, 'HDG1-17')"
>
<p>{{query['HDG1-17'].busNo}}</p>
</div>
<div
class="sheet-row-4-5"
@click="clickBtn(query['HDG1-16'].busNo)"
v-if="query.hasOwnProperty('HDG1-16') && query['HDG1-16'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-16'].busType, 'HDG1-16')"
>
<p>{{query['HDG1-16'].busNo}}</p>
</div>
<!--第五行-->
<div class="sheet-row-5-1">
<p>CDA213</p>
</div>
<div class="sheet-row-5-2">
<p>CDA213</p>
</div>
<div class="sheet-row-5-3">
<p>CDA213</p>
</div>
<div class="sheet-row-5-4">
<p>CDA213</p>
</div>
<div class="sheet-row-5-5">
<p>CDA213</p>
<div
class="sheet-row-5-1"
@click="clickBtn(query['HDG1-25'].busNo)"
v-if="query.hasOwnProperty('HDG1-25') && query['HDG1-25'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-25'].busType, 'HDG1-25')"
>
<p>{{query['HDG1-25']}}</p>
</div>
<div
class="sheet-row-5-2"
@click="clickBtn(query['HDG1-24'].busNo)"
v-if="query.hasOwnProperty('HDG1-24') && query['HDG1-24'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-24'].busType, 'HDG1-24')"
>
<p>{{ query['HDG1-24'].busNo }}</p>
</div>
<div
class="sheet-row-5-3"
@click="clickBtn(query['HDG1-23'].busNo)"
v-if="query.hasOwnProperty('HDG1-23') && query['HDG1-23'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-23'].busType, 'HDG1-23')"
>
<p>{{ query['HDG1-23'].busNo }}</p>
</div>
<div
class="sheet-row-5-4"
@click="clickBtn(query['HDG1-22'].busNo)"
v-if="query.hasOwnProperty('HDG1-22') && query['HDG1-22'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-22'].busType, 'HDG1-22')"
>
<p>{{query['HDG1-22'].busNo}}</p>
</div>
<div
class="sheet-row-5-5"
@click="clickBtn(query['HDG1-21'].busNo)"
v-if="query.hasOwnProperty('HDG1-21') && query['HDG1-21'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-21'].busType, 'HDG1-21')"
>
<p>{{query['HDG1-21'].busNo}}</p>
</div>
<!--第六行-->
<div class="sheet-row-6-1">
<p>CDA213</p>
</div>
<div class="sheet-row-6-2">
<p>CDA213</p>
</div>
<div class="sheet-row-6-3">
<p>CDA213</p>
</div>
<div class="sheet-row-6-4">
<p>CDA213</p>
</div>
<div class="sheet-row-6-5">
<p>CDA213</p>
<div
class="sheet-row-6-1"
@click="clickBtn(query['HDG1-30'].busNo)"
v-if="query.hasOwnProperty('HDG1-30') && query['HDG1-30'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-30'].busType, 'HDG1-30')"
>
<p>{{query['HDG1-30'].busNo}}</p>
</div>
<div
class="sheet-row-6-2"
@click="clickBtn(query['HDG1-29'].busNo)"
v-if="query.hasOwnProperty('HDG1-29') && query['HDG1-29'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-29'].busType, 'HDG1-29')"
>
<p>{{query['HDG1-29'].busNo}}</p>
</div>
<div
class="sheet-row-6-3"
@click="clickBtn(query['HDG1-28'].busNo)"
v-if="query.hasOwnProperty('HDG1-28') && query['HDG1-28'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-28'].busType, 'HDG1-28')"
>
<p>{{query['HDG1-28']}}</p>
</div>
<div
class="sheet-row-6-4"
@click="clickBtn(query['HDG1-27'].busNo)"
v-if="query.hasOwnProperty('HDG1-27') && query['HDG1-27'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-27'].busType, 'HDG1-27')"
>
<p>{{query['HDG1-27']}}</p>
</div>
<div
class="sheet-row-6-5"
@click="clickBtn(query['HDG1-26'].busNo)"
v-if="query.hasOwnProperty('HDG1-26') && query['HDG1-26'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-26'].busType, 'HDG1-26')"
>
<p>{{query['HDG1-26'].busNo}}</p>
</div>
<!--第七行-->
<div class="sheet-7-1">
<p>CDA213</p>
</div>
<div class="sheet-7-2">
<p>CDA213</p>
<div
class="sheet-7-1"
@click="clickBtn(query['HDG1-53'].busNo)"
v-if="query.hasOwnProperty('HDG1-53') && query['HDG1-53'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-53'].busType, 'HDG1-53')"
>
<p>{{query['HDG1-53'].busNo}}</p>
</div>
<div
class="sheet-7-2"
@click="clickBtn(query['HDG1-54'].busNo)"
v-if="query.hasOwnProperty('HDG1-54') && query['HDG1-54'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-54'].busType, 'HDG1-54')"
>
<p>{{query['HDG1-54'].busNo}}</p>
</div>
<!--第八行-->
<div class="sheet-8-1">
<p>CDA213</p>
</div>
<div class="sheet-8-2">
<p>CDA213</p>
<div
class="sheet-8-1"
@click="clickBtn(query['HDG1-55'].busNo)"
v-if="query.hasOwnProperty('HDG1-55') && query['HDG1-55'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-55'].busType, 'HDG1-55')"
>
<p>{{query['HDG1-55'].busNo}}</p>
</div>
<div
class="sheet-8-2"
@click="clickBtn(query['HDG1-56'].busNo)"
v-if="query.hasOwnProperty('HDG1-56') && query['HDG1-56'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-56'].busType, 'HDG1-56')"
>
<p>{{query['HDG1-56'].busNo}}</p>
</div>
</div>
<!-- 信息展示弹窗 -->
<Tooltip
ref="toolRef"
:query="BusInformation"
>
</Tooltip>
</div>
</template>
<script>
export default {
data () {
return {}
import Tooltip from './Tooltip';
export default {
components: {
Tooltip
},
data () {
return {
// 当前在线人数
onlineNum: null,
// 车体定位信息
busPosition: {},
// 钣金车存放区实时信息
query: {},
// 根据车身号获得当前车体信息
BusInformation: {
saleOrderNo: '2019-10-11 11:09',
planOrderNo: '83848484',
code: 'EDSCSFDGVG',
busType: 'car',
orderSize: '2222222255555550',
unit: 'From China',
shop: '二号车间',
line: '4-25'
}
};
},
mounted () {
this.getSheetMetalInformation();
},
methods: {
// 获取钣金车存放区实时信息
getSheetMetalInformation () {
this.$fetch('area-controller/realTime-get', { areaNo: '1' })
.then(res => {
// this.query = _.cloneDeep(res);
// console.log(this.query);
console.log(res);
for (let i = 0; i < res.length; i++) {
if (res[i].code === '1') {
this.query = _.cloneDeep(res[i].stationMap);
console.log(this.query)
// 获取当前在线人数
this.onlineNum = _.clone(res[i].onlineNum);
console.log(this.onlineNum)
}
}
})
.catch(error => {
reject(error);
});
},
clickBtn (busNub) {
console.log(busNub);
let left = window.event.clientX;
let top = window.event.clientY;
console.log('left', left);
console.log('top', top);
this.$refs.toolRef.$refs.tooltip.style.visibility = 'visible';
this.$refs.toolRef.$refs.tooltip.style.top = top - 100 + 'px';
this.$refs.toolRef.$refs.tooltip.style.left = left - 100 + 'px';
this.$fetch('area-controller/busNo-get', { busNo: busNub })
.then(res => {
console.log('res', res);
// this.BusInformation = _.cloneDeep(res);
})
.catch(error => {
reject(error);
});
},
// 解析车体类型及车体定位样式
judgeCarTypeAndcarStationstyle (outOrIn, station) {
//根据车位编码Station 判断是否该车位已经被定位
// let stateTemp = _.cloneDeep(this.$route.query);
// console.log('aaa', stateTemp);
// this.$fetch('area-controller/busNo-get', {stateTemp}).then(res => {
// console.log(res);
// this.busPosition = _.cloneDeep(res);
// if (this.busPosition.hasOwnProperty(station)) {
// return 'isPositioned'
// } else {
if (outOrIn === 'OTHER') {
return 'carOutFactory';
} else {
return '';
}
// }
// }).catch(error => {
// reject(error);
// })
}
}
};
</script>
<style lang="scss" scoped>
.page-pack {
min-height: 100%;
background: rgba(0, 7, 12, 1);
.container-pack {
position: relative;
margin: 0 auto;
width: 1600px;
height: 900px;
background: url("../../../assets/images/Monitor/monitor_sheet_metal_car.png");
div {
position: absolute;
width: 140px;
height: 50px;
cursor: pointer;
background: url('../../../assets/images/Monitor/monitor_car.png') no-repeat;
background-size: 35px 18px;
background-position: 0 16px;
p {
font-size: 14px;
margin: 0;
color: #ffffff;
font-weight: bold;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.page-pack {
min-height: 100%;
background: rgba(0, 7, 12, 1);
.container-pack {
position: relative;
margin: 0 auto;
width: 1600px;
height: 900px;
background: url("../../../assets/images/Monitor/monitor_sheet_metal_car.png");
div {
position: absolute;
width: 140px;
height: 50px;
cursor: pointer;
background: url("../../../assets/images/Monitor/monitor_car.png")
no-repeat;
background-size: 35px 18px;
background-position: 0 16px;
p {
font-size: 14px;
margin: 0;
color: #ffffff;
font-weight: bold;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
// 第一行
.sheet-row-1-1 {
left: 285px;
top: 288px;
}
// 第一行
.sheet-row-1-1 {
left: 285px;
top: 288px;
}
.sheet-row-1-2 {
top: 288px;
left: 575px;
}
.sheet-row-1-2 {
top: 288px;
left: 575px;
}
.sheet-row-1-3 {
top: 288px;
left: 790px;
}
.sheet-row-1-3 {
top: 288px;
left: 790px;
}
.sheet-row-1-4 {
top: 288px;
left: 1020px;
}
.sheet-row-1-4 {
top: 288px;
left: 1020px;
}
.sheet-row-1-5 {
top: 288px;
left: 1235px;
}
.sheet-row-1-5 {
top: 288px;
left: 1235px;
}
// 第二行
.sheet-row-2-1 {
top: 347px;
left: 285px;
}
// 第二行
.sheet-row-2-1 {
top: 347px;
left: 285px;
}
.sheet-row-2-2 {
top: 347px;
left: 575px;
}
.sheet-row-2-2 {
top: 347px;
left: 575px;
}
.sheet-row-2-3 {
top: 347px;
left: 790px;
}
.sheet-row-2-3 {
top: 347px;
left: 790px;
}
.sheet-row-2-4 {
top: 347px;
left: 1020px;
}
.sheet-row-2-4 {
top: 347px;
left: 1020px;
}
.sheet-row-2-5 {
top: 347px;
left: 1235px;
}
.sheet-row-2-5 {
top: 347px;
left: 1235px;
}
// 第三行
.sheet-row-3-1 {
top: 406px;
left: 285px;
}
// 第三行
.sheet-row-3-1 {
top: 406px;
left: 285px;
}
.sheet-row-3-2 {
top: 406px;
left: 575px;
}
.sheet-row-3-2 {
top: 406px;
left: 575px;
}
.sheet-row-3-3 {
top: 406px;
left: 790px;
}
.sheet-row-3-3 {
top: 406px;
left: 790px;
}
.sheet-row-3-4 {
top: 406px;
left: 1020px;
}
.sheet-row-3-4 {
top: 406px;
left: 1020px;
}
.sheet-row-3-5 {
top: 406px;
left: 1235px;
}
.sheet-row-3-5 {
top: 406px;
left: 1235px;
}
// 第四行
.sheet-row-4-1 {
top: 465px;
left: 285px;
}
// 第四行
.sheet-row-4-1 {
top: 465px;
left: 285px;
}
.sheet-row-4-2 {
top: 465px;
left: 575px;
}
.sheet-row-4-2 {
top: 465px;
left: 575px;
}
.sheet-row-4-3 {
top: 465px;
left: 790px;
}
.sheet-row-4-3 {
top: 465px;
left: 790px;
}
.sheet-row-4-4 {
top: 465px;
left: 1020px;
}
.sheet-row-4-4 {
top: 465px;
left: 1020px;
}
.sheet-row-4-5 {
top: 465px;
left: 1235px;
}
.sheet-row-4-5 {
top: 465px;
left: 1235px;
}
// 第五行
.sheet-row-5-1 {
top: 528px;
left: 285px;
}
// 第五行
.sheet-row-5-1 {
top: 528px;
left: 285px;
}
.sheet-row-5-2 {
top: 528px;
left: 575px;
}
.sheet-row-5-2 {
top: 528px;
left: 575px;
}
.sheet-row-5-3 {
top: 528px;
left: 790px;
}
.sheet-row-5-3 {
top: 528px;
left: 790px;
}
.sheet-row-5-4 {
top: 528px;
left: 1020px;
}
.sheet-row-5-4 {
top: 528px;
left: 1020px;
}
.sheet-row-5-5 {
top: 528px;
left: 1235px;
}
.sheet-row-5-5 {
top: 528px;
left: 1235px;
}
// 第六行
.sheet-row-6-1 {
top: 584px;
left: 285px;
}
// 第六行
.sheet-row-6-1 {
top: 584px;
left: 285px;
}
.sheet-row-6-2 {
top: 584px;
left: 575px;
}
.sheet-row-6-2 {
top: 584px;
left: 575px;
}
.sheet-row-6-3 {
top: 584px;
left: 790px;
}
.sheet-row-6-3 {
top: 584px;
left: 790px;
}
.sheet-row-6-4 {
top: 584px;
left: 1020px;
}
.sheet-row-6-4 {
top: 584px;
left: 1020px;
}
.sheet-row-6-5 {
top: 584px;
left: 1235px;
}
.sheet-row-6-5 {
top: 584px;
left: 1235px;
}
// 第七行
.sheet-7-1 {
top: 642px;
left: 285px;
}
// 第七行
.sheet-7-1 {
top: 642px;
left: 285px;
}
.sheet-7-2 {
top: 642px;
left: 579px;
}
.sheet-7-2 {
top: 642px;
left: 579px;
}
// 第八行
.sheet-8-1 {
top: 700px;
left: 285px;
}
// 第八行
.sheet-8-1 {
top: 700px;
left: 285px;
}
.sheet-8-2 {
top: 700px;
left: 579px;
}
.sheet-8-2 {
top: 700px;
left: 579px;
}
}
}
</style>
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