Skip to content

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

Merge branch 'dev' of git.vtstar.net:zhongtong/zhongtong-avi-web into dev

parents 1cfd91c0 61808aa1
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1588 additions and 731 deletions
src/views/Monitor/components/ComplexionPaint.vue
View file @ 1c2cf687
...@@ -533,6 +533,10 @@ ...@@ -533,6 +533,10 @@
> >
<p>{{query['HDG1-204'].busNo}}</p> <p>{{query['HDG1-204'].busNo}}</p>
</div> </div>
<!-- 实时车辆 -->
<div class="onlineNum">
<p>总量 <span>{{ this.onlineNum? this.onlineNum : '0' }}</span></p>
</div>
<Tooltip <Tooltip
ref="toolRef" ref="toolRef"
:query="BusInformation" :query="BusInformation"
...@@ -553,10 +557,12 @@ export default { ...@@ -553,10 +557,12 @@ export default {
}, },
data () { data () {
return { return {
// 定时器
timer: null,
// 当前在线人数 // 当前在线人数
onlineNum: null, onlineNum: null,
// 车体定位信息 // 车辆定位数据
busPosition: {}, carPostionInfo: {},
// 面色/漆作业区域实时信息 // 面色/漆作业区域实时信息
query: {}, query: {},
// 根据车身号获得当前车体信息 // 根据车身号获得当前车体信息
...@@ -574,26 +580,25 @@ export default { ...@@ -574,26 +580,25 @@ 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 => {
// console.log(res); for (let item of res) {
// this.query = _.cloneDeep(res); if (item.code === '6') {
for (let i = 0; i < res.length; i++) { this.query = item.stationMap;
if (res[i].code === '6') {
console.log(res[i]);
this.query = _.cloneDeep(res[i].stationMap);
// 获取当前在线人数 // 获取当前在线人数
this.onlineNum = _.clone(res[i].onlineNum); this.onlineNum = _.clone(item.onlineNum);
console.log(this.onlineNum) console.log(this.onlineNum);
break;
} }
} }
console.log(this.query);
}) })
.catch(error => { .catch(error => {
reject(error); reject(error);
...@@ -601,24 +606,16 @@ export default { ...@@ -601,24 +606,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 +634,34 @@ export default { ...@@ -637,6 +634,34 @@ 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);
} }
} }
}; };
...@@ -646,6 +671,20 @@ export default { ...@@ -646,6 +671,20 @@ export default {
min-height: 100%; min-height: 100%;
background: rgba(0, 7, 12, 1); background: rgba(0, 7, 12, 1);
.onlineNum {
position: absolute;
color: #ffffff;
z-index: 999;
right: 300px;
top: 50px;
color: #00b4ff;
font-size: 16px;
font-weight: 750;
span {
margin: 30px;
font-size: 24px;
}
}
.paint-content { .paint-content {
position: relative; position: relative;
margin: 0 auto; margin: 0 auto;
...@@ -730,7 +769,7 @@ export default { ...@@ -730,7 +769,7 @@ export default {
.paint-row-13-3, .paint-row-13-3,
.paint-row-13-5 { .paint-row-13-5 {
position: absolute; position: absolute;
width: 140px; width: 100px;
height: 40px; height: 40px;
cursor: pointer; cursor: pointer;
background: url("../../../assets/images/Monitor/monitor_car.png") background: url("../../../assets/images/Monitor/monitor_car.png")
...@@ -739,7 +778,7 @@ export default { ...@@ -739,7 +778,7 @@ export default {
background-position: 0 16px; background-position: 0 16px;
p { p {
font-size: 14px; font-size: 12px;
margin: 0; margin: 0;
color: #ffffff; color: #ffffff;
font-weight: bold; font-weight: bold;
......
src/views/Monitor/components/Electrophoresis.vue
View file @ 1c2cf687
...@@ -433,6 +433,10 @@ ...@@ -433,6 +433,10 @@
> >
<p>{{query['HDG1-66'].busNo}}</p> <p>{{query['HDG1-66'].busNo}}</p>
</div> </div>
<!-- 实时车辆 -->
<div class="onlineNum">
<p>总量 <span>{{ this.onlineNum? this.onlineNum : '0' }}</span></p>
</div>
<Tooltip <Tooltip
ref="toolRef" ref="toolRef"
:query="BusInformation" :query="BusInformation"
...@@ -449,57 +453,63 @@ export default { ...@@ -449,57 +453,63 @@ export default {
}, },
data () { data () {
return { return {
//定时器
timer: null,
// 车辆定位数据
carPostionInfo: {},
// 当前在线人数 // 当前在线人数
onlineNum: null, onlineNum: null,
// 车体定位信息
busPosition: {},
// 电泳作业区域实时信息 // 电泳作业区域实时信息
query: {}, query: {},
// 根据车身号获得当前车体信息 // 根据车身号获得当前车体信息
BusInformation: { BusInformation: {
'saleOrderNo': '201905201252', saleOrderNo: '201905201252',
'planOrderNo': '83848484', planOrderNo: '83848484',
'code': 'EDSCSFDGVG', code: 'EDSCSFDGVG',
'busType': 'car', busType: 'car',
'orderSize': '20', orderSize: '20',
'unit': 'From China', unit: 'From China',
'shop': '二号车间', shop: '二号车间',
'line': '4-25' line: '4-25'
} }
}; };
}, },
mounted () { mounted () {
this.getElectrophoresisInformation(); this.pollingGetInterface();
console.log(this.$route) console.log('2222', this.timer);
},
beforeDestroy () {
clearInterval(this.timer);
}, },
methods: { methods: {
// 点击车位弹出车体信息 // 点击车位弹出车体信息
clickBtn (row) { clickBtn (row) {
console.log(row) console.log(row);
this.$refs.toolRef.$refs.tooltip.style.visibility = 'visible'; this.$refs.toolRef.$refs.tooltip.style.visibility = 'visible';
let left = window.event.clientX; let left = window.event.clientX;
let top = window.event.clientY; let top = window.event.clientY;
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 - 100 + 'px';
this.$fetch('area-controller/busNo-get', {busNo: row}).then(res => { this.$fetch('area-controller/busNo-get', { busNo: row })
console.log('res', res); .then(res => {
// this.BusInformation = _.cloneDeep(res); console.log('res', res);
}).catch(error => { // this.BusInformation = _.cloneDeep(res);
reject(error) })
}) .catch(error => {
reject(error);
});
}, },
// 查询电泳实时信息 // 查询电泳实时信息
getElectrophoresisInformation () { getElectrophoresisInformation () {
this.$fetch('area-controller/realTime-get', { areaNo: '2' }) this.$fetch('area-controller/realTime-get', { areaNo: '2' })
.then(res => { .then(res => {
console.log('getall', res); for (let item of res) {
for (let i = 0; i < res.length; i++) { if (item.code === '2') {
if (res[i].code === '2') { this.query = item.stationMap;
console.log(res[i]);
this.query = _.cloneDeep(res[i].stationMap);
// 获取当前在线人数 // 获取当前在线人数
this.onlineNum = _.clone(res[i].onlineNum); this.onlineNum = _.clone(item.onlineNum);
console.log(this.onlineNum) console.log(this.onlineNum);
break;
} }
} }
}) })
...@@ -509,24 +519,43 @@ export default { ...@@ -509,24 +519,43 @@ 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.getElectrophoresisInformation();
this.timer = setInterval(() => {
this.carPostionInfo = {};
// 获取电泳作业区实时信息
this.getElectrophoresisInformation();
}, 20000);
} }
} }
}; };
...@@ -536,13 +565,27 @@ export default { ...@@ -536,13 +565,27 @@ export default {
.page-pack { .page-pack {
min-height: 100%; min-height: 100%;
background: rgba(0, 7, 12, 1); background: rgba(0, 7, 12, 1);
.onlineNum {
position: absolute;
color: #ffffff;
z-index: 999;
right: 300px;
top: 50px;
color: #00b4ff;
font-size: 16px;
font-weight: 750;
span {
margin: 30px;
font-size: 24px;
}
}
.elect-content { .elect-content {
position: relative; position: relative;
margin: 0 auto; margin: 0 auto;
width: 1600px; width: 1600px;
height: 900px; height: 900px;
background: url("../../../assets/images/Monitor/monitor_electrophoresis.png") no-repeat; background: url("../../../assets/images/Monitor/monitor_electrophoresis.png")
no-repeat;
.elect-row-1-1, .elect-row-1-1,
.elect-row-1-2, .elect-row-1-2,
.elect-row-1-3, .elect-row-1-3,
...@@ -596,7 +639,7 @@ export default { ...@@ -596,7 +639,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: 100px;
height: 40px; height: 40px;
cursor: pointer; cursor: pointer;
background: url("../../../assets/images/Monitor/monitor_car.png") background: url("../../../assets/images/Monitor/monitor_car.png")
...@@ -605,7 +648,7 @@ export default { ...@@ -605,7 +648,7 @@ export default {
background-position: 0 16px; background-position: 0 16px;
p { p {
font-size: 14px; font-size: 12px;
margin: 0; margin: 0;
color: #ffffff; color: #ffffff;
font-weight: bold; font-weight: bold;
...@@ -815,7 +858,8 @@ export default { ...@@ -815,7 +858,8 @@ export default {
.elect-row-13-2 { .elect-row-13-2 {
left: 708px; left: 708px;
} }
.elect-row-8-4,.elect-row-9-5 { .elect-row-8-4,
.elect-row-9-5 {
left: 830px; left: 830px;
} }
.carOutFactory { .carOutFactory {
......
src/views/Monitor/components/MiddleCoat.vue
View file @ 1c2cf687
This diff is collapsed.
src/views/Monitor/components/Putty.vue
View file @ 1c2cf687
This diff is collapsed.
src/views/Monitor/components/SheetMetalCar.vue
View file @ 1c2cf687
...@@ -283,7 +283,10 @@ ...@@ -283,7 +283,10 @@
<p>{{query['HDG1-56'].busNo}}</p> <p>{{query['HDG1-56'].busNo}}</p>
</div> </div>
</div> </div>
<!-- 实时车辆 -->
<div class="onlineNum">
<p>总量 <span>{{ this.onlineNum? this.onlineNum : '0' }}</span></p>
</div>
<!-- 信息展示弹窗 --> <!-- 信息展示弹窗 -->
<Tooltip <Tooltip
ref="toolRef" ref="toolRef"
...@@ -301,10 +304,12 @@ export default { ...@@ -301,10 +304,12 @@ export default {
}, },
data () { data () {
return { return {
// 定时器
timer: null,
// 当前在线人数 // 当前在线人数
onlineNum: null, onlineNum: null,
// 车体定位信息 // 车辆定位数据
busPosition: {}, carPostionInfo: {},
// 钣金车存放区实时信息 // 钣金车存放区实时信息
query: {}, query: {},
// 根据车身号获得当前车体信息 // 根据车身号获得当前车体信息
...@@ -321,23 +326,23 @@ export default { ...@@ -321,23 +326,23 @@ export default {
}; };
}, },
mounted () { mounted () {
this.getSheetMetalInformation(); this.pollingGetInterface();
},
beforeDestroy () {
clearInterval(this.timer);
}, },
methods: { methods: {
// 获取钣金车存放区实时信息 // 获取钣金车存放区实时信息
getSheetMetalInformation () { getSheetMetalInformation () {
this.$fetch('area-controller/realTime-get', { areaNo: '1' }) this.$fetch('area-controller/realTime-get', { areaNo: '1' })
.then(res => { .then(res => {
// this.query = _.cloneDeep(res); for (let item of res) {
// console.log(this.query); if (item.code === '1') {
console.log(res); this.query = item.stationMap;
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); this.onlineNum = _.clone(item.onlineNum);
console.log(this.onlineNum) console.log(this.onlineNum);
break;
} }
} }
}) })
...@@ -345,6 +350,7 @@ export default { ...@@ -345,6 +350,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 +358,8 @@ export default { ...@@ -352,8 +358,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 +371,43 @@ export default { ...@@ -365,24 +371,43 @@ 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);
} }
} }
}; };
...@@ -392,7 +417,20 @@ export default { ...@@ -392,7 +417,20 @@ export default {
.page-pack { .page-pack {
min-height: 100%; min-height: 100%;
background: rgba(0, 7, 12, 1); background: rgba(0, 7, 12, 1);
.onlineNum {
position: absolute;
color: #ffffff;
z-index: 999;
right: 300px;
top: 50px;
color: #00b4ff;
font-size: 16px;
font-weight: 750;
span {
margin: 30px;
font-size: 24px;
}
}
.container-pack { .container-pack {
position: relative; position: relative;
margin: 0 auto; margin: 0 auto;
...@@ -598,6 +636,18 @@ export default { ...@@ -598,6 +636,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 @ 1c2cf687
...@@ -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