Skip to content

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

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

parents dde6c180 611ec26b
Hide whitespace changes
Inline Side-by-side
Showing with 372 additions and 78 deletions
src/views/Monitor/components/Electrophoresis.vue
View file @ cd0e1feb
......@@ -5,204 +5,487 @@
<!-- 第 1 行 -->
<div
class="elect-row-1-1"
@click="clickBtn()"
@click="clickBtn(query['STC1-1'].busNo)"
v-if="query.hasOwnProperty('STC1-1') && query['STC1-1'].state !== 'N'"
:class="judgeCarTypeAndcarStationstyle(query['STC1-1'].busType, 'STC1-1')"
>
<p>CDA11323</p>
<p>{{query['STC1-1'].busNo}}</p>
</div>
<div
class="elect-row-1-2"
@click="clickBtn()"
v-if="query.hasOwnProperty('STC1-8') && query['STC1-8'].state !== 'N'"
:class="judgeCarTypeAndcarStationstyle(query['STC1-8'].busType, 'STC1-8')"
>
<p>CDA11323</p>
<p>{{query['STC1-8'].busNo}}</p>
</div>
<div class="elect-row-1-3">
<p>CDA11323</p>
<div
class="elect-row-1-3"
v-if="query.hasOwnProperty('HDG1-31') && query['HDG1-31'].state !== 'N'"
:class="judgeCarTypeAndcarStationstyle(query['HDG1-31'].busType, 'HDG1-31')"
>
<p>{{query['HDG1-31'].busNo}}</p>
</div>
<!-- 第 2 行 -->
<div class="elect-row-2-1">
<p>CDA11323</p>
<div
class="elect-row-2-1"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>{{query['HDG1-31'].busNo}}</p>
</div>
<div class="elect-row-2-2">
<p>CDA11323</p>
<div
class="elect-row-2-2"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>{{query['HDG1-31'].busNo}}</p>
</div>
<div class="elect-row-2-3">
<div
class="elect-row-2-3"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<!-- 第 3 行 -->
<div class="elect-row-3-1">
<div
class="elect-row-3-1"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-3-2">
<div
class="elect-row-3-2"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-3-3">
<div
class="elect-row-3-3"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<!-- 第 4 行 -->
<div class="elect-row-4-1">
<div
class="elect-row-4-1"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-4-2">
<div
class="elect-row-4-2"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-4-3">
<div
class="elect-row-4-3"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<!-- 第 5 行 -->
<div class="elect-row-5-1">
<div
class="elect-row-5-1"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-5-2">
<div
class="elect-row-5-2"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-5-3">
<div
class="elect-row-5-3"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<!-- 第 6 行 -->
<div class="elect-row-6-1">
<div
class="elect-row-6-1"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-6-2">
<div
class="elect-row-6-2"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-6-3">
<div
class="elect-row-6-3"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<!-- 6.5行 -->
<div class="elect-row-6-4">
<div
class="elect-row-6-4"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<!-- 第 7 行 -->
<div class="elect-row-7-1">
<div
class="elect-row-7-1"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-7-2">
<div
class="elect-row-7-2"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-7-3">
<div
class="elect-row-7-3"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<!-- 第 8 行 -->
<div class="elect-row-8-1">
<div
class="elect-row-8-1"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-8-2">
<div
class="elect-row-8-2"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-8-3">
<div
class="elect-row-8-3"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<!-- 第 9 行 -->
<div class="elect-row-9-1">
<div
class="elect-row-9-1"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-9-2">
<div
class="elect-row-9-2"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-9-3">
<div
class="elect-row-9-3"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-9-4">
<div
class="elect-row-9-4"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<!-- 第 10 行 -->
<div class="elect-row-10-1">
<div
class="elect-row-10-1"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-10-2">
<div
class="elect-row-10-2"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-10-3">
<div
class="elect-row-10-3"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-10-4">
<div
class="elect-row-10-4"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-10-5">
<div
class="elect-row-10-5"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<!-- 第 11 行 -->
<div class="elect-row-11-1">
<div
class="elect-row-11-1"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-11-2">
<div
class="elect-row-11-2"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-11-3">
<div
class="elect-row-11-3"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-11-4">
<div
class="elect-row-11-4"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-11-5">
<div
class="elect-row-11-5"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<!-- 第 12 行 -->
<div class="elect-row-12-1">
<div
class="elect-row-12-1"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-12-2">
<div
class="elect-row-12-2"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-12-3">
<div
class="elect-row-12-3"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-12-4">
<div
class="elect-row-12-4"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-12-5">
<div
class="elect-row-12-5"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<!-- 第 13 行 -->
<div class="elect-row-13-1">
<div
class="elect-row-13-1"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-13-2">
<div
class="elect-row-13-2"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-13-3">
<div
class="elect-row-13-3"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-13-4">
<div
class="elect-row-13-4"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<div class="elect-row-13-5">
<div
class="elect-row-13-5"
v-if="query['HDG1-31'].state==='Y'?true:false"
:class="query['HDG1-31'].busType==='In'?'carInFactory':'carOutFactory'"
>
<p>CDA11323</p>
</div>
<Tooltip
ref="toolRef"
:query="query"
:query="BusInformation"
></Tooltip>
</div>
</div>
</template>
<script>
import Tooltip from './Tooltip'
import Tooltip from './Tooltip';
export default {
components: {
Tooltip
},
data () {
return {
query: {}
// 电泳作业区域实时信息
query: {
'STC1-1': {
areaId: 0,
areaName: 'DF20191010',
busNo: 'DF20191010',
busType: 'Out', //IN/OUT
code: 'string',
id: 0,
keyStation: true,
laneCode: 'string',
laneId: 0,
sequence: 0,
skidID: 0,
state: 'Y', //0.1 Y/N
workshopCode: 'string'
},
'STC1-8': {
areaId: 0,
areaName: 'DF205411010',
busNo: 'DF20191010',
busType: 'In', //IN/OUT
code: 'string',
id: 0,
keyStation: true,
laneCode: 'string',
laneId: 0,
sequence: 0,
skidID: 0,
state: 'Y', //0.1 Y/N
workshopCode: 'string'
},
'HDG1-31': {
areaId: 0,
areaName: 'DF205411010',
busNo: 'DF20191010',
busType: 'Out', //IN/OUT
code: 'string',
id: 0,
keyStation: true,
laneCode: 'string',
laneId: 0,
sequence: 0,
skidID: 0,
state: 'Y', //0.1 Y/N
workshopCode: 'string'
}
},
// 根据车身号获得当前车体信息
BusInformation: {
'saleOrderNo': '201905201252',
'planOrderNo': '83848484',
'code': 'EDSCSFDGVG',
'busType': 'car',
'orderSize': '20',
'unit': 'From China',
'shop': '二号车间',
'line': '4-25'
}
};
},
mounted () {
this.getElectrophoresisInformation();
for (let key in this.query) {
console.log(key)
}
},
methods: {
// 点击车位弹出车体信息
clickBtn (row) {
this.$refs.toolRef.$refs.tooltip.style.visibility = 'visible'
let left = window.event.clientX
let top = window.event.clientY
this.$refs.toolRef.$refs.tooltip.style.top = top - 100 + 'px'
this.$refs.toolRef.$refs.tooltip.style.left = left - 100 + 'px'
this.query = {
name: '111',
code: '222'
console.log(row)
this.$refs.toolRef.$refs.tooltip.style.visibility = 'visible';
let left = window.event.clientX;
let top = window.event.clientY;
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: row}).then(res => {
console.log('res', res);
}).catch(error => {
reject(error)
})
// this.BusInformation = {
// name: '111',
// code: '222'
// };
},
getElectrophoresisInformation () {
this.$fetch('area-controller/realTime-get', { areaNo: '2' })
.then(res => {
console.log('getall', res);
})
.catch(error => {
reject(error);
});
},
judgeCarTypeAndcarStationstyle (outOrIn, station) {
//根据车位编码Station 判断是否该车位已经被定位
/* .... */
console.log('outorin', outOrIn);
console.log('车位', station);
if (outOrIn === 'Out') {
return 'carOutFactory';
} else {
return '';
}
}
}
}
};
</script>
<style lang="scss" scoped>
......@@ -215,8 +498,7 @@ export default {
margin: 0 auto;
width: 1600px;
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-2,
.elect-row-1-3,
......@@ -270,7 +552,8 @@ export default {
width: 140px;
height: 40px;
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-position: 0 16px;
......@@ -481,6 +764,18 @@ export default {
.elect-row-13-2 {
left: 708px;
}
.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>
src/views/Monitor/components/Tooltip.vue
View file @ cd0e1feb
......@@ -3,15 +3,15 @@
class="tooltip"
ref="tooltip"
>
<p><span>销售订单号: </span><span>销售订单号</span></p>
<p><span>主计划工单号: </span><span>SCA11233</span></p>
<p><span>车间计划工单号: </span><span>SCA1123asadasd3</span></p>
<p><span>车型: </span><span>SCA11233</span></p>
<p><span>订单数量: </span><span>SCA11233</span></p>
<p><span>单位: </span><span>SCA11233</span></p>
<p><span>车间: </span><span>SCA11233</span></p>
<p><span>产线: </span><span>SCA11233</span></p>
<p><span>计划完工时间: </span><span>SCA11233</span></p>
<p><span>销售订单号: </span><span>{{ query.saleOrderNo }}</span></p>
<p><span>主计划工单号: </span><span>{{ query.planOrderNo }}</span></p>
<p><span>车间计划工单号: </span><span>{{ query.code }}</span></p>
<p><span>车型: </span><span>{{ query.busType }}</span></p>
<p><span>订单数量: </span><span>{{ query.orderSize }}</span></p>
<p><span>单位: </span><span>{{ query.unit }}</span></p>
<p><span>车间: </span><span>{{ query.shop }}</span></p>
<p><span>产线: </span><span>{{ query.line }}</span></p>
<!-- <p><span>计划完工时间: </span><span>{{ query.saleOrderNo }}</span></p> -->
<div
class="close-btn"
@click="closeTooltip"
......@@ -41,7 +41,6 @@ export default {
watch: {
query (v) {
this.data = _.cloneDeep(v)
console.log(this.data)
}
},
......
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