Skip to content

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

fea(密封防腐区): 功能联调(90%)

parent f1191a7e
Hide whitespace changes
Inline Side-by-side
Showing with 98 additions and 36 deletions
src/views/Monitor/components/SealedAnticorrosion.vue
View file @ 311861ab
......@@ -6,225 +6,270 @@
<div
class="sealed-row-1-1"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-57') && sealedAnticorrosion['HDG1-57'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-57'].busType, 'HDG1-57')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-57'].busType, 'HDG1-57')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-57'].busNo)">
<p>{{sealedAnticorrosion['HDG1-57'].busNo}}</p>
</div>
<div
class="sealed-row-1-2"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-67') && sealedAnticorrosion['HDG1-67'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-67'].busType, 'HDG1-67')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-67'].busType, 'HDG1-67')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-67'].busNo)">
<p>{{sealedAnticorrosion['HDG1-67'].busNo}}</p>
</div>
<div
class="sealed-row-1-3"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-68') && sealedAnticorrosion['HDG1-68'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-68'].busType, 'HDG1-68')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-68'].busType, 'HDG1-68')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-68'].busNo)">
<p>{{sealedAnticorrosion['HDG1-68'].busNo}}</p>
</div>
<div
class="sealed-row-1-4"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-69') && sealedAnticorrosion['HDG1-69'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-69'].busType, 'HDG1-69')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-69'].busType, 'HDG1-69')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-69'].busNo)">
<p>{{sealedAnticorrosion['HDG1-69'].busNo}}</p>
</div>
<div
class="sealed-row-1-5"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-70') && sealedAnticorrosion['HDG1-70'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-70'].busType, 'HDG1-70')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-70'].busType, 'HDG1-70')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-70'].busNo)">
<p>{{sealedAnticorrosion['HDG1-70'].busNo}}</p>
</div>
<!-- 第二行 -->
<div
class="sealed-row-2-1"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-58') && sealedAnticorrosion['HDG1-58'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-58'].busType, 'HDG1-58')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-58'].busType, 'HDG1-58')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-58'].busNo)">
<p>{{sealedAnticorrosion['HDG1-58'].busNo}}</p>
</div>
<div
class="sealed-row-2-2"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-71') && sealedAnticorrosion['HDG1-71'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-71'].busType, 'HDG1-71')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-71'].busType, 'HDG1-71')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-71'].busNo)">
<p>{{sealedAnticorrosion['HDG1-71'].busNo}}</p>
</div>
<div
class="sealed-row-2-3"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-72') && sealedAnticorrosion['HDG1-72'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-72'].busType, 'HDG1-72')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-72'].busType, 'HDG1-72')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-72'].busNo)">
<p>{{sealedAnticorrosion['HDG1-72'].busNo}}</p>
</div>
<div
class="sealed-row-2-4"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-73') && sealedAnticorrosion['HDG1-73'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-73'].busType, 'HDG1-73')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-73'].busType, 'HDG1-73')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-73'].busNo)">
<p>{{sealedAnticorrosion['HDG1-73'].busNo}}</p>
</div>
<div
class="sealed-row-2-5"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-74') && sealedAnticorrosion['HDG1-74'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-74'].busType, 'HDG1-74')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-74'].busType, 'HDG1-74')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-74'].busNo)">
<p>{{sealedAnticorrosion['HDG1-74'].busNo}}</p>
</div>
<!-- 第三行 -->
<div
class="sealed-row-3-1"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-75') && sealedAnticorrosion['HDG1-75'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-75'].busType, 'HDG1-75')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-75'].busType, 'HDG1-75')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-75'].busNo)">
<p>{{sealedAnticorrosion['HDG1-75'].busNo}}</p>
</div>
<div
class="sealed-row-3-2"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-76') && sealedAnticorrosion['HDG1-76'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-76'].busType, 'HDG1-76')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-76'].busType, 'HDG1-76')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-76'].busNo)">
<p>{{sealedAnticorrosion['HDG1-76'].busNo}}</p>
</div>
<div
class="sealed-row-3-3"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-77') && sealedAnticorrosion['HDG1-77'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-77'].busType, 'HDG1-77')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-77'].busType, 'HDG1-77')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-77'].busNo)">
<p>{{sealedAnticorrosion['HDG1-77'].busNo}}</p>
</div>
<div
class="sealed-row-3-4"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-78') && sealedAnticorrosion['HDG1-78'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-78'].busType, 'HDG1-78')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-78'].busType, 'HDG1-78')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-78'].busNo)">
<p>{{sealedAnticorrosion['HDG1-78'].busNo}}</p>
</div>
<div
class="sealed-row-3-5"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-79') && sealedAnticorrosion['HDG1-79'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-79'].busType, 'HDG1-79')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-79'].busType, 'HDG1-79')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-79'].busNo)">
<p>{{sealedAnticorrosion['HDG1-79'].busNo}}</p>
</div>
<!-- 第四行 -->
<div
class="sealed-row-4-1"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-80') && sealedAnticorrosion['HDG1-80'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-80'].busType, 'HDG1-80')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-80'].busType, 'HDG1-80')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-80'].busNo)">
<p>{{sealedAnticorrosion['HDG1-80'].busNo}}</p>
</div>
<div
class="sealed-row-4-2"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-81') && sealedAnticorrosion['HDG1-81'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-81'].busType, 'HDG1-81')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-81'].busType, 'HDG1-81')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-81'].busNo)">
<p>{{sealedAnticorrosion['HDG1-81'].busNo}}</p>
</div>
<div
class="sealed-row-4-3"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-82') && sealedAnticorrosion['HDG1-82'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-82'].busType, 'HDG1-82')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-82'].busType, 'HDG1-82')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-82'].busNo)">
<p>{{sealedAnticorrosion['HDG1-82'].busNo}}</p>
</div>
<div
class="sealed-row-4-4"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-83') && sealedAnticorrosion['HDG1-83'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-83'].busType, 'HDG1-83')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-83'].busType, 'HDG1-83')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-83'].busNo)">
<p>{{sealedAnticorrosion['HDG1-83'].busNo}}</p>
</div>
<div
class="sealed-row-4-5"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-84') && sealedAnticorrosion['HDG1-84'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-84'].busType, 'HDG1-84')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-84'].busType, 'HDG1-84')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-84'].busNo)">
<p>{{sealedAnticorrosion['HDG1-84'].busNo}}</p>
</div>
<!-- 第五行 -->
<div
class="sealed-row-5-1"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-85') && sealedAnticorrosion['HDG1-85'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-85'].busType, 'HDG1-85')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-85'].busType, 'HDG1-85')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-85'].busNo)">
<p>{{sealedAnticorrosion['HDG1-85'].busNo}}</p>
</div>
<div
class="sealed-row-5-2"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-86') && sealedAnticorrosion['HDG1-86'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-86'].busType, 'HDG1-86')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-86'].busType, 'HDG1-86')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-86'].busNo)">
<p>{{sealedAnticorrosion['HDG1-86'].busNo}}</p>
</div>
<div
class="sealed-row-5-3"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-87') && sealedAnticorrosion['HDG1-87'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-87'].busType, 'HDG1-87')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-87'].busType, 'HDG1-87')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-87'].busNo)">
<p>{{sealedAnticorrosion['HDG1-87'].busNo}}</p>
</div>
<div
class="sealed-row-5-4"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-88') && sealedAnticorrosion['HDG1-88'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-88'].busType, 'HDG1-88')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-88'].busType, 'HDG1-88')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-88'].busNo)">
<p>{{sealedAnticorrosion['HDG1-88'].busNo}}</p>
</div>
<div
class="sealed-row-5-5"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-89') && sealedAnticorrosion['HDG1-89'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-89'].busType, 'HDG1-89')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-89'].busType, 'HDG1-89')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-89'].busNo)">
<p>{{sealedAnticorrosion['HDG1-89'].busNo}}</p>
</div>
<!-- 第六行 -->
<div
class="sealed-row-6-1"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-90') && sealedAnticorrosion['HDG1-90'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-90'].busType, 'HDG1-90')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-90'].busType, 'HDG1-90')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-90'].busNo)">
<p>{{sealedAnticorrosion['HDG1-90'].busNo}}</p>
</div>
<div
class="sealed-row-6-2"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-91') && sealedAnticorrosion['HDG1-91'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-91'].busType, 'HDG1-91')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-91'].busType, 'HDG1-91')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-91'].busNo)">
<p>{{sealedAnticorrosion['HDG1-91'].busNo}}</p>
</div>
<div
class="sealed-row-6-3"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-92') && sealedAnticorrosion['HDG1-92'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-92'].busType, 'HDG1-92')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-92'].busType, 'HDG1-92')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-92'].busNo)">
<p>{{sealedAnticorrosion['HDG1-92'].busNo}}</p>
</div>
<div
class="sealed-row-6-4"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-93') && sealedAnticorrosion['HDG1-93'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-93'].busType, 'HDG1-93')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-93'].busType, 'HDG1-93')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-93'].busNo)">
<p>{{sealedAnticorrosion['HDG1-93'].busNo}}</p>
</div>
<div
class="sealed-row-6-5"
v-if="sealedAnticorrosion.hasOwnProperty('HDG1-94') && sealedAnticorrosion['HDG1-94'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-94'].busType, 'HDG1-94')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG1-94'].busType, 'HDG1-94')"
@click="doCarStationClick(sealedAnticorrosion['HDG1-94'].busNo)">
<p>{{sealedAnticorrosion['HDG1-94'].busNo}}</p>
</div>
<!-- 右一列 -->
<div
class="sealed-right-column-1-1"
v-if="sealedAnticorrosion.hasOwnProperty('HDG5-8') && sealedAnticorrosion['HDG5-8'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG5-8'].busType, 'HDG5-8')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG5-8'].busType, 'HDG5-8')"
@click="doCarStationClick(sealedAnticorrosion['HDG5-8'].busNo)">
<p>{{sealedAnticorrosion['HDG5-8'].busNo}}</p>
</div>
<div
class="sealed-right-column-1-2"
v-if="sealedAnticorrosion.hasOwnProperty('HDG5-9') && sealedAnticorrosion['HDG5-9'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG5-9'].busType, 'HDG5-9')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG5-9'].busType, 'HDG5-9')"
@click="doCarStationClick(sealedAnticorrosion['HDG5-9'].busNo)">
<p>{{sealedAnticorrosion['HDG5-9'].busNo}}</p>
</div>
<div
class="sealed-right-column-1-3"
v-if="sealedAnticorrosion.hasOwnProperty('HDG5-10') && sealedAnticorrosion['HDG5-10'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG5-10'].busType, 'HDG5-10')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG5-10'].busType, 'HDG5-10')"
@click="doCarStationClick(sealedAnticorrosion['HDG5-10'].busNo)">
<p>{{sealedAnticorrosion['HDG5-10'].busNo}}</p>
</div>
<div
class="sealed-right-column-1-4"
v-if="sealedAnticorrosion.hasOwnProperty('HDG5-11') && sealedAnticorrosion['HDG5-11'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG5-11'].busType, 'HDG5-11')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG5-11'].busType, 'HDG5-11')"
@click="doCarStationClick(sealedAnticorrosion['HDG5-11'].busNo)">
<p>{{sealedAnticorrosion['HDG5-11'].busNo}}</p>
</div>
<div
class="sealed-right-column-1-5"
v-if="sealedAnticorrosion.hasOwnProperty('HDG5-12') && sealedAnticorrosion['HDG5-12'].state !== 'FREE'"
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG5-12'].busType, 'HDG5-12')">
:class="judgeCarTypeAndCarStationStyle(sealedAnticorrosion['HDG5-12'].busType, 'HDG5-12')"
@click="doCarStationClick(sealedAnticorrosion['HDG5-12'].busNo)">
<p>{{sealedAnticorrosion['HDG5-12'].busNo}}</p>
</div>
</div>
<!-- 详细信息展示组件 -->
<Tooltip
ref="toolRef"
:query="currentBusInfo">
</Tooltip>
</div>
</template>
<script>
import Tooltip from './Tooltip'
export default {
components: {
Tooltip
},
data () {
return {
// 密封防腐作业区域实时数据
......@@ -234,7 +279,9 @@
// 筛选条件工单号
workOrderNo: '',
// 车体定位数据
carPostion: {}
carPostion: {},
// 当前车体信息
currentBusInfo: {}
}
},
methods: {
......@@ -250,6 +297,18 @@
}
}
},
// 点击工位
doCarStationClick (busNo) {
let queryParams = { busNo: busNo }
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', queryParams).then(response => {
this.currentBusInfo = _.cloneDeep(response)
})
},
// 获取密封防腐作业区实时数据
getSealedAnticorrosionRealTimeData () {
let queryParams = { areaNo: '3' }
......@@ -294,6 +353,7 @@
.page-pack {
min-height: 100%;
background: rgba(0, 7, 12, 1);
position: relative;
.container-pack {
position: relative;
......
src/views/Monitor/components/Tooltip.vue
View file @ 311861ab
......@@ -85,6 +85,8 @@ export default {
opacity: 0.8;
color: #ffffff;
visibility: hidden;
top: 0;
left: 0;
p {
margin: 5px 0;
......
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