Skip to content

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

feat（腻子作业区，钣金作业区）：功能联调（90%）

parent dc7f3396
Hide whitespace changes
Inline Side-by-side
Showing with 413 additions and 176 deletions
src/views/Monitor/components/ComplexionPaint.vue
View file @ eb42b233
...@@ -553,10 +553,12 @@ export default { ...@@ -553,10 +553,12 @@ export default {
}, },
data () { data () {
return { return {
// 定时器
timer: null,
// 当前在线人数 // 当前在线人数
onlineNum: null, onlineNum: null,
// 车体定位信息 // 车辆定位数据
busPosition: {}, carPostionInfo: {},
// 面色/漆作业区域实时信息 // 面色/漆作业区域实时信息
query: {}, query: {},
// 根据车身号获得当前车体信息 // 根据车身号获得当前车体信息
...@@ -574,11 +576,13 @@ export default { ...@@ -574,11 +576,13 @@ export default {
}, },
mounted () { mounted () {
this.getComplexionPaintInformation(); this.pollingGetInterface();
},
beforeDestroy () {
clearInterval(this.timer);
}, },
methods: { methods: {
// 查询面色/漆作业区实时信息 // 获取面色/漆作业区实时信息
getComplexionPaintInformation () { getComplexionPaintInformation () {
this.$fetch('area-controller/realTime-get', { areaNo: '6' }) this.$fetch('area-controller/realTime-get', { areaNo: '6' })
.then(res => { .then(res => {
...@@ -601,24 +605,16 @@ export default { ...@@ -601,24 +605,16 @@ export default {
}, },
// 解析车体类型及车体定位样式 // 解析车体类型及车体定位样式
judgeCarTypeAndcarStationstyle (outOrIn, station) { judgeCarTypeAndcarStationstyle (outOrIn, station) {
//根据车位编码Station 判断是否该车位已经被定位 // 判断有无车体定位信息
// let stateTemp = _.cloneDeep(this.$route.query); if (this.carPostionInfo.hasOwnProperty(station)) {
// console.log('aaa', stateTemp); return 'isPositioned'
// 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 { } else {
return ''; if (outOrIn === 'OTHER') {
return 'carOutFactory';
} else {
return '';
}
} }
// }
// }).catch(error => {
// reject(error);
// })
}, },
clickBtn (busNub) { clickBtn (busNub) {
console.log(busNub); console.log(busNub);
...@@ -637,6 +633,29 @@ export default { ...@@ -637,6 +633,29 @@ export default {
.catch(error => { .catch(error => {
reject(error); reject(error);
}); });
},
// 查询车辆定位
getCarPostion () {
let queryParams = { orderNo: '1111', workOrderNo: '' }
// 请求接口
this.$fetch('area-controller/busNo-get', {queryParams}).then(res => {
this.carPostionInfo = _.cloneDeep(res)
})
},
// 轮询请求接口
pollingGetInterface () {
// 查询车辆定位
console.log('2222', this.$route.query)
if (this.$route.query.hasOwnProperty('orderNo') || this.$route.query.hasOwnProperty('workOrderNo')) {
this.getCarPostion()
}
// 获取面色/漆作业区实时信息
this.getComplexionPaintInformation()
this.timer = setInterval(() => {
this.carPostionInfo = {}
// 获取面色/漆作业区实时信息
this.getComplexionPaintInformation()
}, 20000)
} }
} }
}; };
......
src/views/Monitor/components/Electrophoresis.vue
View file @ eb42b233
...@@ -449,10 +449,12 @@ export default { ...@@ -449,10 +449,12 @@ export default {
}, },
data () { data () {
return { return {
//定时器
timer: null,
// 车辆定位数据
carPostionInfo: {},
// 当前在线人数 // 当前在线人数
onlineNum: null, onlineNum: null,
// 车体定位信息
busPosition: {},
// 电泳作业区域实时信息 // 电泳作业区域实时信息
query: {}, query: {},
// 根据车身号获得当前车体信息 // 根据车身号获得当前车体信息
...@@ -469,8 +471,11 @@ export default { ...@@ -469,8 +471,11 @@ export default {
}; };
}, },
mounted () { mounted () {
this.getElectrophoresisInformation(); this.pollingGetInterface();
console.log(this.$route) console.log('2222', this.timer)
},
beforeDestroy () {
clearInterval(this.timer)
}, },
methods: { methods: {
// 点击车位弹出车体信息 // 点击车位弹出车体信息
...@@ -509,24 +514,38 @@ export default { ...@@ -509,24 +514,38 @@ export default {
}, },
// 解析车体类型及车体定位样式 // 解析车体类型及车体定位样式
judgeCarTypeAndcarStationstyle (outOrIn, station) { judgeCarTypeAndcarStationstyle (outOrIn, station) {
//根据车位编码Station 判断是否该车位已经被定位 // 判断有无车体定位信息
// let stateTemp = _.cloneDeep(this.$route.query); if (this.carPostionInfo.hasOwnProperty(station)) {
// console.log('aaa', stateTemp); return 'isPositioned'
// 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 { } else {
return ''; if (outOrIn === 'OTHER') {
return 'carOutFactory';
} else {
return '';
}
}
},
// 查询车辆定位
getCarPostion () {
let queryParams = { orderNo: '1111', workOrderNo: '' }
// 请求接口
this.$fetch('area-controller/busNo-get', {queryParams}).then(res => {
this.carPostionInfo = _.cloneDeep(res)
})
},
// 轮询请求接口
pollingGetInterface () {
// 查询车辆定位
if (this.$route.query.hasOwnProperty('orderNo') || this.$route.query.hasOwnProperty('workOrderNo')) {
this.getCarPostion()
} }
// } // 获取电泳作业区实时信息
// }).catch(error => { this.getElectrophoresisInformation()
// reject(error); this.timer = setInterval(() => {
// }) this.carPostionInfo = {}
// 获取电泳作业区实时信息
this.getElectrophoresisInformation()
}, 20000)
} }
} }
}; };
...@@ -596,7 +615,7 @@ export default { ...@@ -596,7 +615,7 @@ export default {
.elect-row-13-4, .elect-row-13-4,
.elect-row-13-5 { .elect-row-13-5 {
position: absolute; position: absolute;
width: 140px; width: 90px;
height: 40px; height: 40px;
cursor: pointer; cursor: pointer;
background: url("../../../assets/images/Monitor/monitor_car.png") background: url("../../../assets/images/Monitor/monitor_car.png")
......
src/views/Monitor/components/Putty.vue
View file @ eb42b233
<template> <template>
<div class="page-body"> <div class="page-body">
<div class="putty-content"> <div class="putty-content">
<div class="putty-row-1-1"> <div
<p>CDA233231231231321312</p> class="putty-row-1-1"
</div> @click="clickBtn(query['HDG1-95'].busNo)"
<div class="putty-row-1-2"> v-if="query.hasOwnProperty('HDG1-95') && query['HDG1-95'].state !== 'FREE'"
<p>CDA213</p> :class="judgeCarTypeAndcarStationstyle(query['HDG1-95'].busType, 'HDG1-95')"
>
<p>{{ query['HDG1-95'].busNo }}</p>
</div> </div>
<div class="putty-row-1-3"> <div
<p>CDA213</p> class="putty-row-1-2"
@click="clickBtn(query['HDG1-96'].busNo)"
v-if="query.hasOwnProperty('HDG1-96') && query['HDG1-96'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-96'].busType, 'HDG1-96')"
>
<p>{{query['HDG1-96'].busNo}}</p>
</div> </div>
<div class="putty-row-1-4"> <div
<p>CDA213</p> class="putty-row-1-3"
@click="clickBtn(query['HDG1-97'].busNo)"
v-if="query.hasOwnProperty('HDG1-97') && query['HDG1-97'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-97'].busType, 'HDG1-97')"
>
<p>{{query['HDG1-97'].busNo}}</p>
</div> </div>
<div class="putty-row-1-5"> <div
<p>CDA213</p> class="putty-row-1-4"
@click="clickBtn(query['HDG1-98'].busNo)"
v-if="query.hasOwnProperty('HDG1-98') && query['HDG1-98'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-98'].busType, 'HDG1-98')"
>
<p>{{query['HDG1-98'].busNo}}</p>
</div> </div>
<div class="putty-row-1-6"> <div
<p>CDA213</p> class="putty-row-1-5"
@click="clickBtn(query['HDG1-99'].busNo)"
v-if="query.hasOwnProperty('HDG1-99') && query['HDG1-99'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-99'].busType, 'HDG1-99')"
>
<p>{{query['HDG1-99'].busNo}}</p>
</div> </div>
<div class="putty-row-2-1"> <div
<p>CDA213</p> class="putty-row-1-6"
@click="clickBtn(query['HDG5-13'].busNo)"
v-if="query.hasOwnProperty('HDG5-13') && query['HDG5-13'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG5-13'].busType, 'HDG5-13')"
>
<p>{{query['HDG5-13'].busNo}}</p>
</div> </div>
<div class="putty-row-2-2"> <div
<p>CDA213</p> class="putty-row-2-1"
@click="clickBtn(query['HDG1-100'].busNo)"
v-if="query.hasOwnProperty('HDG1-100') && query['HDG1-100'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-100'].busType, 'HDG1-100')"
>
<p>{{query['HDG1-100'].busNo}}</p>
</div> </div>
<div class="putty-row-2-3"> <div
<p>CDA213</p> class="putty-row-2-2"
@click="clickBtn(query['HDG1-101'].busNo)"
v-if="query.hasOwnProperty('HDG1-101') && query['HDG1-101'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-101'].busType, 'HDG1-101')"
>
<p>{{query['HDG1-101'].busNo}}</p>
</div> </div>
<div class="putty-row-2-4"> <div
<p>CDA213</p> class="putty-row-2-3"
@click="clickBtn(query['HDG1-102'].busNo)"
v-if="query.hasOwnProperty('HDG1-102') && query['HDG1-102'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-102'].busType, 'HDG1-102')"
>
<p>{{query['HDG1-102'].busNo}}</p>
</div> </div>
<div class="putty-row-2-5"> <div
<p>CDA213</p> class="putty-row-2-4"
@click="clickBtn(query['HDG1-103'].busNo)"
v-if="query.hasOwnProperty('HDG1-103') && query['HDG1-103'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-103'].busType, 'HDG1-103')"
>
<p>{{query['HDG1-103'].busNo}}</p>
</div> </div>
<div class="putty-row-2-6"> <div
<p>CDA213</p> class="putty-row-2-5"
@click="clickBtn(query['HDG1-104'].busNo)"
v-if="query.hasOwnProperty('HDG1-104') && query['HDG1-104'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-104'].busType, 'HDG1-104')"
>
<p>{{query['HDG1-104'].busNo}}</p>
</div> </div>
<div class="putty-row-3-1"> <div
<p>CDA213</p> class="putty-row-2-6"
@click="clickBtn(query['HDG5-14'].busNo)"
v-if="query.hasOwnProperty('HDG5-14') && query['HDG5-14'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG5-14'].busType, 'HDG5-14')"
>
<p>{{query['HDG5-14'].busNo}}</p>
</div> </div>
<div class="putty-row-3-2"> <div
<p>CDA213</p> class="putty-row-3-1"
@click="clickBtn(query['HDG1-105'].busNo)"
v-if="query.hasOwnProperty('HDG1-105') && query['HDG1-105'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-105'].busType, 'HDG1-105')"
>
<p>{{query['HDG1-105'].busNo}}</p>
</div> </div>
<div class="putty-row-3-3"> <div
<p>CDA213</p> class="putty-row-3-2"
@click="clickBtn(query['HDG1-106'].busNo)"
v-if="query.hasOwnProperty('HDG1-106') && query['HDG1-106'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-106'].busType, 'HDG1-106')"
>
<p>{{query['HDG1-106']}}</p>
</div> </div>
<div class="putty-row-3-4"> <div
<p>CDA213</p> class="putty-row-3-3"
@click="clickBtn(query['HDG1-107'].busNo)"
v-if="query.hasOwnProperty('HDG1-107') && query['HDG1-107'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-107'].busType, 'HDG1-107')"
>
<p>{{query['HDG1-107'].busNo}}</p>
</div> </div>
<div class="putty-row-3-5"> <div
<p>CDA213</p> class="putty-row-3-4"
@click="clickBtn(query['HDG1-108'].busNo)"
v-if="query.hasOwnProperty('HDG1-108') && query['HDG1-108'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-108'].busType, 'HDG1-108')"
>
<p>{{query['HDG1-108'].busNo}}</p>
</div> </div>
<div class="putty-row-3-6"> <div
<p>CDA213</p> class="putty-row-3-5"
@click="clickBtn(query['HDG1-109'].busNo)"
v-if="query.hasOwnProperty('HDG1-109') && query['HDG1-109'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-109'].busType, 'HDG1-109')"
>
<p>{{query['HDG1-109'].busNo}}</p>
</div> </div>
<div class="putty-row-4-1"> <div
<p>CDA213</p> class="putty-row-3-6"
@click="clickBtn(query['HDG5-15'].busNo)"
v-if="query.hasOwnProperty('HDG5-15') && query['HDG5-15'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG5-15'].busType, 'HDG5-15')"
>
<p>{{query['HDG5-15'].busNo}}</p>
</div> </div>
<div class="putty-row-4-2"> <div
<p>CDA213</p> class="putty-row-4-1"
@click="clickBtn(query['HDG1-110'].busNo)"
v-if="query.hasOwnProperty('HDG1-110') && query['HDG1-110'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-110'].busType, 'HDG1-110')"
>
<p>{{query['HDG1-110'].busNo}}</p>
</div> </div>
<div class="putty-row-4-3"> <div
<p>CDA213</p> class="putty-row-4-2"
@click="clickBtn(query['HDG1-111'].busNo)"
v-if="query.hasOwnProperty('HDG1-111') && query['HDG1-111'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-111'].busType, 'HDG1-111')"
>
<p>{{query['HDG1-111'].busNo}}</p>
</div> </div>
<div class="putty-row-4-4"> <div
<p>CDA213</p> class="putty-row-4-3"
@click="clickBtn(query['HDG1-112'].busNo)"
v-if="query.hasOwnProperty('HDG1-112') && query['HDG1-112'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-112'].busType, 'HDG1-112')"
>
<p>{{query['HDG1-112'].busNo}}</p>
</div> </div>
<div class="putty-row-4-5"> <div
<p>CDA213</p> class="putty-row-4-4"
@click="clickBtn(query['HDG1-113'].busNo)"
v-if="query.hasOwnProperty('HDG1-113') && query['HDG1-113'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-113'].busType, 'HDG1-113')"
>
<p>{{query['HDG1-113'].busNo}}</p>
</div> </div>
<div class="putty-row-4-6"> <div
<p>CDA213</p> class="putty-row-4-5"
@click="clickBtn(query['HDG1-114'].busNo)"
v-if="query.hasOwnProperty('HDG1-114') && query['HDG1-114'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-114'].busType, 'HDG1-114')"
>
<p>{{query['HDG1-114'].busNo}}</p>
</div> </div>
<div <div
v-popover:nasdsd class="putty-row-4-6"
class="putty-row-5-6" @click="clickBtn(query['HDG5-16'].busNo)"
@click="showPopover(data, data.pr56, 'popover2')" v-if="query.hasOwnProperty('HDG5-16') && query['HDG5-16'].state !== 'FREE'"
:class="judgeCarTypeAndcarStationstyle(query['HDG5-16'].busType, 'HDG5-16')"
> >
<p>{{ data.pr56.name }}</p> <p>{{query['HDG5-16'].busNo}}</p>
</div> </div>
</div> </div>
<el-popover <!-- 信息展示弹窗 -->
:ref="item.name" <Tooltip
v-for="(item, index) in options" ref="toolRef"
:key="Math.random(index)" :query="BusInformation"
placement="top"
width="300"
trigger="click"
> >
<div class="flex-content"> </Tooltip>
<p>111: <span>{{ item.car }}</span></p>
<p>111: <span>{{ item.code }}</span></p>
<p>111: <span>{{ item.name }}</span></p>
<p>111: <span>{{ item.no }}</span></p>
<p>111: <span>{{ item.time }}</span></p>
</div>
</el-popover>
</div> </div>
</template> </template>
<script> <script>
...@@ -104,54 +207,108 @@ ...@@ -104,54 +207,108 @@
* @author MARS 2019-09-28 <wangyunfan@vtstar.net> * @author MARS 2019-09-28 <wangyunfan@vtstar.net>
* @fileoverview 腻子作业区 * @fileoverview 腻子作业区
*/ */
import Tooltip from './Tooltip';
export default { export default {
components: {
Tooltip
},
data () { data () {
return { return {
show: true, // 定时器
data: { timer: null,
pr56: { // 腻子作业区实时信息
name: 'nasdsd',
code: '这是编码啊',
no: '2233123',
time: '2019-09-29',
car: '中通客车'
},
pr51: {
name: 'qqqname',
code: 'qqq这是编码啊',
no: 'qqq2233123',
time: '2222019-09-29',
car: '中通222客车'
}
},
query: {}, query: {},
popover: null, // 根据车身号获取当前车体区域信息
options: [] BusInformation: {},
} // 车辆定位数据
carPostionInfo: {},
// 当前在线人数
onlineNum: null
};
}, },
mounted () {}, mounted () {
this.pollingGetInterface();
},
methods: { methods: {
/** // 获取腻子作业区实时信息
* @method 点击展示popover getPuttyInformation () {
* @description this.$fetch('area-controller/realTime-get', { areaNo: '4' })
*/ .then(res => {
showPopover (data, val, item) { console.log(res);
let keys = [] for (let i = 0; i < res.length; i++) {
let values = [] if (res[i].code === '4') {
for (let key in data) { this.query = _.cloneDeep(res[i].stationMap);
keys.push(key) console.log(this.query);
values.push(data[key]) // 获取当前在线人数
this.onlineNum = _.clone(res[i].onlineNum);
console.log(this.onlineNum);
}
}
// 1.for of(数组)
// 2.foreach(数组)
})
.catch(error => {
reject(error);
});
},
// 解析车体类型及车体定位样式
judgeCarTypeAndcarStationstyle (outOrIn, station) {
// 判断有无车体定位信息
if (this.carPostionInfo.hasOwnProperty(station)) {
return 'isPositioned'
} else {
if (outOrIn === 'OTHER') {
return 'carOutFactory';
} else {
return '';
}
} }
let newArr = [] },
newArr = _.cloneDeep(values) // 点击车辆工位
this.options = newArr.filter(item => val.name === item.name) clickBtn (busNub) {
console.log(this.options) console.log(busNub);
console.log(this.$refs.nasdsd) 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}px`;
this.$fetch('area-controller/busNo-get', { busNo: busNub })
.then(res => {
console.log('res', res);
// this.BusInformation = _.cloneDeep(res);
})
.catch(error => {
reject(error);
});
},
// 查询车辆定位
getCarPostion () {
let queryParams = { orderNo: '', workOrderNo: '' }
// 请求接口
this.$fetch('area-controller/busNo-get', {queryParams}).then(res => {
this.carPostionInfo = _.cloneDeep(res)
})
},
// 轮询请求接口
pollingGetInterface () {
// 查询车辆定位
if (this.$route.query.hasOwnProperty('orderNo') || this.$route.query.hasOwnProperty('workOrderNo')) {
this.getCarPostion()
}
// 获取腻子作业区实时信息
this.getPuttyInformation()
this.timer = setInterval(() => {
this.carPostionInfo = {}
// 获取腻子作业区实时信息
this.getPuttyInformation()
}, 20000)
} }
} }
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.page-body { .page-body {
...@@ -163,7 +320,7 @@ export default { ...@@ -163,7 +320,7 @@ export default {
margin: 0 auto; margin: 0 auto;
width: 1600px; width: 1600px;
height: 900px; height: 900px;
background: url('../../../assets/images/Monitor/putty-bg.png') no-repeat; background: url("../../../assets/images/Monitor/putty-bg.png") no-repeat;
// ? 公共样式 // ? 公共样式
.putty-row-1-1, .putty-row-1-1,
...@@ -195,7 +352,8 @@ export default { ...@@ -195,7 +352,8 @@ export default {
width: 140px; width: 140px;
height: 50px; height: 50px;
cursor: pointer; cursor: pointer;
background: url('../../../assets/images/Monitor/monitor_car.png') no-repeat; background: url("../../../assets/images/Monitor/monitor_car.png")
no-repeat;
background-size: 35px 18px; background-size: 35px 18px;
background-position: 0 16px; background-position: 0 16px;
...@@ -302,10 +460,21 @@ export default { ...@@ -302,10 +460,21 @@ export default {
.putty-row-5-6 { .putty-row-5-6 {
left: 1256px; left: 1256px;
} }
.putty-row-5-6 { .putty-row-5-6 {
top: 655px; top: 655px;
} }
.carOutFactory {
background: url("../../../assets/images/Monitor/monitor_car_external.png")
no-repeat;
background-size: 35px 18px;
background-position: 0 16px;
}
.isPositioned {
background: url("../../../assets/images/Monitor/monitor_position_car.gif")
no-repeat;
background-size: 35px 18px;
background-position: 0 16px;
}
} }
} }
</style> </style>
src/views/Monitor/components/SheetMetalCar.vue
View file @ eb42b233
...@@ -283,7 +283,6 @@ ...@@ -283,7 +283,6 @@
<p>{{query['HDG1-56'].busNo}}</p> <p>{{query['HDG1-56'].busNo}}</p>
</div> </div>
</div> </div>
<!-- 信息展示弹窗 --> <!-- 信息展示弹窗 -->
<Tooltip <Tooltip
ref="toolRef" ref="toolRef"
...@@ -301,10 +300,12 @@ export default { ...@@ -301,10 +300,12 @@ export default {
}, },
data () { data () {
return { return {
// 定时器
timer: null,
// 当前在线人数 // 当前在线人数
onlineNum: null, onlineNum: null,
// 车体定位信息 // 车辆定位数据
busPosition: {}, carPostionInfo: {},
// 钣金车存放区实时信息 // 钣金车存放区实时信息
query: {}, query: {},
// 根据车身号获得当前车体信息 // 根据车身号获得当前车体信息
...@@ -321,7 +322,10 @@ export default { ...@@ -321,7 +322,10 @@ export default {
}; };
}, },
mounted () { mounted () {
this.getSheetMetalInformation(); this.pollingGetInterface();
},
beforeDestroy () {
clearInterval(this.timer)
}, },
methods: { methods: {
// 获取钣金车存放区实时信息 // 获取钣金车存放区实时信息
...@@ -345,6 +349,7 @@ export default { ...@@ -345,6 +349,7 @@ export default {
reject(error); reject(error);
}); });
}, },
// 点击车辆工位
clickBtn (busNub) { clickBtn (busNub) {
console.log(busNub); console.log(busNub);
let left = window.event.clientX; let left = window.event.clientX;
...@@ -352,8 +357,8 @@ export default { ...@@ -352,8 +357,8 @@ export default {
console.log('left', left); console.log('left', left);
console.log('top', top); console.log('top', top);
this.$refs.toolRef.$refs.tooltip.style.visibility = 'visible'; this.$refs.toolRef.$refs.tooltip.style.visibility = 'visible';
this.$refs.toolRef.$refs.tooltip.style.top = top - 100 + 'px'; this.$refs.toolRef.$refs.tooltip.style.top = `${top - 100}px`;
this.$refs.toolRef.$refs.tooltip.style.left = left - 100 + 'px'; this.$refs.toolRef.$refs.tooltip.style.left = `${left}px`;
this.$fetch('area-controller/busNo-get', { busNo: busNub }) this.$fetch('area-controller/busNo-get', { busNo: busNub })
.then(res => { .then(res => {
console.log('res', res); console.log('res', res);
...@@ -365,24 +370,38 @@ export default { ...@@ -365,24 +370,38 @@ export default {
}, },
// 解析车体类型及车体定位样式 // 解析车体类型及车体定位样式
judgeCarTypeAndcarStationstyle (outOrIn, station) { judgeCarTypeAndcarStationstyle (outOrIn, station) {
//根据车位编码Station 判断是否该车位已经被定位 // 判断有无车体定位信息
// let stateTemp = _.cloneDeep(this.$route.query); if (this.carPostionInfo.hasOwnProperty(station)) {
// console.log('aaa', stateTemp); return 'isPositioned'
// 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 { } else {
return ''; if (outOrIn === 'OTHER') {
return 'carOutFactory';
} else {
return '';
}
} }
// } },
// }).catch(error => { // 查询车辆定位
// reject(error); getCarPostion () {
// }) let queryParams = { orderNo: '1111', workOrderNo: '' }
// 请求接口
this.$fetch('area-controller/busNo-get', {queryParams}).then(res => {
this.carPostionInfo = _.cloneDeep(res)
})
},
// 轮询请求接口
pollingGetInterface () {
// 查询车辆定位
if (this.$route.query.hasOwnProperty('orderNo') || this.$route.query.hasOwnProperty('workOrderNo')) {
this.getCarPostion()
}
// 获取钣金作业区实时信息
this.getSheetMetalInformation()
this.timer = setInterval(() => {
this.carPostionInfo = {}
// 获取钣金作业区实时信息
this.getSheetMetalInformation()
}, 20000)
} }
} }
}; };
...@@ -405,8 +424,7 @@ export default { ...@@ -405,8 +424,7 @@ export default {
width: 140px; width: 140px;
height: 50px; height: 50px;
cursor: pointer; cursor: pointer;
background: url("../../../assets/images/Monitor/monitor_car.png") background: url("../../../assets/images/Monitor/monitor_car.png") no-repeat;
no-repeat;
background-size: 35px 18px; background-size: 35px 18px;
background-position: 0 16px; background-position: 0 16px;
...@@ -598,6 +616,18 @@ export default { ...@@ -598,6 +616,18 @@ export default {
top: 700px; top: 700px;
left: 579px; left: 579px;
} }
.carOutFactory {
background: url("../../../assets/images/Monitor/monitor_car_external.png")
no-repeat;
background-size: 35px 18px;
background-position: 0 16px;
}
.isPositioned {
background: url("../../../assets/images/Monitor/monitor_position_car.gif")
no-repeat;
background-size: 35px 18px;
background-position: 0 16px;
}
} }
} }
</style> </style>
src/views/Monitor/components/Tooltip.vue
View file @ eb42b233
...@@ -74,12 +74,12 @@ export default { ...@@ -74,12 +74,12 @@ export default {
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss">
.tooltip { .tooltip {
position: absolute; position: absolute;
padding: 20px 0 0 0; padding: 20px 0 0 0;
width: 260px; width: 260px;
height: 266px; height: 246px;
border-radius: 9px; border-radius: 9px;
background: #000000; background: #000000;
opacity: 0.8; opacity: 0.8;
......
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