lb #12
@ -1,8 +1,9 @@
|
||||
<template>
|
||||
<div id="v3d-outter" ref="v3d-outter">
|
||||
<!-- <V3DApp @3d-loaded="handle3DLoaded" />
|
||||
<div v-if="showPage" id="v3d-main-content"> -->
|
||||
<div v-if="true" id="v3d-main-content">
|
||||
<div id="V3DData" style="position: fixed; top: 0; left: 0; display: hidden;" rel=""></div>
|
||||
<V3DApp @3d-loaded="handle3DLoaded" @click.native="handle3DClick" />
|
||||
<div v-if="showPage" id="v3d-main-content">
|
||||
<!-- <div v-if="true" id="v3d-main-content"> -->
|
||||
<techy-header :head-title="'合肥新能源数字工厂总览'" @toggle-full-screen="toggleFullScreen" />
|
||||
|
||||
<section id="techy-body-part">
|
||||
@ -19,24 +20,32 @@
|
||||
</techy-container>
|
||||
</div>
|
||||
|
||||
<div class="techy-body-part__middle">
|
||||
<div class="techy-body-part__middle" v-if="currentEquipment">
|
||||
<TechyBox>
|
||||
<div class="techy-body-part__middle__inner">
|
||||
<p>
|
||||
<b>产线名称 :</b>
|
||||
<span>A产线</span>
|
||||
<span>{{ currentEquipment.pl }}</span>
|
||||
</p>
|
||||
<p>
|
||||
<b>设备名称 :</b>
|
||||
<span>清洗机</span>
|
||||
<span>{{ currentEquipment.name }}</span>
|
||||
</p>
|
||||
<p>
|
||||
<b>累计加工 :</b>
|
||||
<span>20</span>
|
||||
<span>{{ currentEquipment.amount }}</span>
|
||||
</p>
|
||||
<p>
|
||||
<b>通信状态 :</b>
|
||||
<span class="round-dot">运行中</span>
|
||||
<span
|
||||
class="round-dot"
|
||||
:class="{
|
||||
'danger-dot': currentEquipment.status === '故障',
|
||||
'warning-dot': currentEquipment.status === '调试中'
|
||||
}"
|
||||
>
|
||||
{{ currentEquipment.status }}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</TechyBox>
|
||||
@ -109,6 +118,8 @@ import TechyBox from './components/TechyBox.vue'
|
||||
|
||||
import screenfull from 'screenfull'
|
||||
|
||||
import eqList from './v3dApp/data'
|
||||
|
||||
export default {
|
||||
name: '',
|
||||
components: {
|
||||
@ -128,6 +139,8 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
eqId: null,
|
||||
currentEquipment: null,
|
||||
showPage: false,
|
||||
toggleResize: 'toggle-1' // <=== no need to worry this
|
||||
}
|
||||
@ -152,6 +165,12 @@ export default {
|
||||
},
|
||||
handle3DLoaded() {
|
||||
this.showPage = true
|
||||
},
|
||||
handle3DClick() {
|
||||
this.eqId = document.getElementById('V3DData').rel
|
||||
if (this.eqId) {
|
||||
this.currentEquipment = eqList.find(item => item.id === this.eqId)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -348,4 +367,12 @@ export default {
|
||||
background-color: rgb(82, 231, 82);
|
||||
border-radius: calc(4px * var(--beilv));
|
||||
}
|
||||
|
||||
.danger-dot::before {
|
||||
background-color: #e71837;
|
||||
}
|
||||
|
||||
.warning-dot::before {
|
||||
background-color: #d6961f;
|
||||
}
|
||||
</style>
|
||||
|
||||
73
src/views/3DOverview/v3dApp/data.js
Normal file
73
src/views/3DOverview/v3dApp/data.js
Normal file
@ -0,0 +1,73 @@
|
||||
export default [
|
||||
{ id: 'C1-0', pl: 'A', name: '上片', amount: 32, status: '生产中' },
|
||||
{ id: 'C1-1', pl: 'A', name: '磨边', amount: 32, status: '生产中' },
|
||||
{ id: 'C1-2', pl: 'A', name: '磨边', amount: 32, status: '调试中' },
|
||||
{ id: 'C1-3', pl: 'A', name: '清洗', amount: 32, status: '生产中' },
|
||||
{ id: 'C1-4', pl: 'A', name: '打孔', amount: 32, status: '生产中' },
|
||||
{ id: 'C1-5', pl: 'A', name: '清洗', amount: 32, status: '生产中' },
|
||||
{ id: 'C1-6', pl: 'A', name: '丝印', amount: 32, status: '生产中' },
|
||||
{ id: 'C1-7', pl: 'A', name: '固化', amount: 32, status: '生产中' },
|
||||
{ id: 'C1-8', pl: 'A', name: '储片', amount: 32, status: '生产中' },
|
||||
{ id: 'C1-9', pl: 'A', name: '清洗', amount: 32, status: '生产中' },
|
||||
{ id: 'C1-10', pl: 'A', name: '下片', amount: 32, status: '生产中' },
|
||||
|
||||
{ id: 'C2-0', pl: 'B', name: '上片', amount: 32, status: '调试中' },
|
||||
{ id: 'C2-1', pl: 'B', name: '磨边', amount: 32, status: '生产中' },
|
||||
{ id: 'C2-2', pl: 'B', name: '磨边', amount: 32, status: '调试中' },
|
||||
{ id: 'C2-3', pl: 'B', name: '清洗', amount: 32, status: '调试中' },
|
||||
{ id: 'C2-4', pl: 'B', name: '打孔', amount: 32, status: '调试中' },
|
||||
{ id: 'C2-5', pl: 'B', name: '清洗', amount: 32, status: '生产中' },
|
||||
{ id: 'C2-6', pl: 'B', name: '丝印', amount: 32, status: '生产中' },
|
||||
{ id: 'C2-7', pl: 'B', name: '固化', amount: 32, status: '生产中' },
|
||||
{ id: 'C2-8', pl: 'B', name: '储片', amount: 32, status: '生产中' },
|
||||
{ id: 'C2-9', pl: 'B', name: '清洗', amount: 32, status: '生产中' },
|
||||
{ id: 'C2-10', pl: 'B', name: '下片', amount: 32, status: '生产中' },
|
||||
|
||||
{ id: 'C3-0', pl: 'C', name: '上片', amount: 32, status: '生产中' },
|
||||
{ id: 'C3-1', pl: 'C', name: '磨边', amount: 32, status: '生产中' },
|
||||
{ id: 'C3-2', pl: 'C', name: '磨边', amount: 32, status: '生产中' },
|
||||
{ id: 'C3-3', pl: 'C', name: '清洗', amount: 32, status: '生产中' },
|
||||
{ id: 'C3-4', pl: 'C', name: '打孔', amount: 32, status: '生产中' },
|
||||
{ id: 'C3-5', pl: 'C', name: '清洗', amount: 32, status: '故障' },
|
||||
{ id: 'C3-6', pl: 'C', name: '丝印', amount: 32, status: '生产中' },
|
||||
{ id: 'C3-7', pl: 'C', name: '固化', amount: 32, status: '生产中' },
|
||||
{ id: 'C3-8', pl: 'C', name: '储片', amount: 32, status: '生产中' },
|
||||
{ id: 'C3-9', pl: 'C', name: '清洗', amount: 32, status: '生产中' },
|
||||
{ id: 'C3-10', pl: 'C', name: '下片', amount: 32, status: '生产中' },
|
||||
|
||||
{ id: 'C4-0', pl: 'D', name: '上片', amount: 32, status: '故障' },
|
||||
{ id: 'C4-1', pl: 'D', name: '磨边', amount: 32, status: '生产中' },
|
||||
{ id: 'C4-2', pl: 'D', name: '磨边', amount: 32, status: '生产中' },
|
||||
{ id: 'C4-3', pl: 'D', name: '清洗', amount: 32, status: '故障' },
|
||||
{ id: 'C4-4', pl: 'D', name: '打孔', amount: 32, status: '故障' },
|
||||
{ id: 'C4-5', pl: 'D', name: '清洗', amount: 32, status: '生产中' },
|
||||
{ id: 'C4-6', pl: 'D', name: '丝印', amount: 32, status: '生产中' },
|
||||
{ id: 'C4-7', pl: 'D', name: '固化', amount: 32, status: '生产中' },
|
||||
{ id: 'C4-8', pl: 'D', name: '储片', amount: 32, status: '生产中' },
|
||||
{ id: 'C4-9', pl: 'D', name: '清洗', amount: 32, status: '生产中' },
|
||||
{ id: 'C4-10', pl: 'D', name: '下片', amount: 32, status: '生产中' },
|
||||
|
||||
{ id: 'C5-0', pl: 'E', name: '上片', amount: 32, status: '生产中' },
|
||||
{ id: 'C5-1', pl: 'E', name: '磨边', amount: 32, status: '生产中' },
|
||||
{ id: 'C5-2', pl: 'E', name: '磨边', amount: 32, status: '生产中' },
|
||||
{ id: 'C5-3', pl: 'E', name: '清洗', amount: 32, status: '生产中' },
|
||||
{ id: 'C5-4', pl: 'E', name: '打孔', amount: 32, status: '生产中' },
|
||||
{ id: 'C5-5', pl: 'E', name: '清洗', amount: 32, status: '生产中' },
|
||||
{ id: 'C5-6', pl: 'E', name: '丝印', amount: 32, status: '生产中' },
|
||||
{ id: 'C5-7', pl: 'E', name: '固化', amount: 32, status: '生产中' },
|
||||
{ id: 'C5-8', pl: 'E', name: '储片', amount: 32, status: '生产中' },
|
||||
{ id: 'C5-9', pl: 'E', name: '清洗', amount: 32, status: '生产中' },
|
||||
// { id: 'C5-10', pl: 'E', name: '下片', amount: 32, status: '生产中' },
|
||||
|
||||
{ id: 'C6-0', pl: 'F', name: '上片', amount: 32, status: '生产中' },
|
||||
{ id: 'C6-1', pl: 'F', name: '磨边', amount: 32, status: '生产中' },
|
||||
{ id: 'C6-2', pl: 'F', name: '磨边', amount: 32, status: '生产中' },
|
||||
{ id: 'C6-3', pl: 'F', name: '清洗', amount: 32, status: '生产中' },
|
||||
{ id: 'C6-4', pl: 'F', name: '打孔', amount: 32, status: '生产中' },
|
||||
{ id: 'C6-5', pl: 'F', name: '清洗', amount: 32, status: '生产中' },
|
||||
{ id: 'C6-6', pl: 'F', name: '丝印', amount: 32, status: '生产中' },
|
||||
{ id: 'C6-7', pl: 'F', name: '固化', amount: 32, status: '故障' },
|
||||
{ id: 'C6-8', pl: 'F', name: '储片', amount: 32, status: '故障' },
|
||||
// { id: 'C6-9', pl: 'F', name: '清洗', amount: 32, status: '生产中' },
|
||||
// { id: 'C6-10', pl: 'F', name: '下片', amount: 32, status: '生产中' },
|
||||
]
|
||||
Loading…
Reference in New Issue
Block a user