joylink/rt-sim-training-client
6
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

iscs调整

Browse Source
This commit is contained in:
joylink_fanyuhong 2022-01-19 11:21:58 +08:00
parent bcf3188046
commit 8d3a20cc01
4 changed files with 171 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
src/views/iscs/iscsSystem/config/broadcast/centerHome.vue
View File

@ -21,7 +21,7 @@
<div class="pa-table-content" @click="clickArea(i,j)"> <div class="pa-table-content" @click="clickArea(i,j)">
<div class="pa-table-content-inside" :style="{background: selectedAreaList.includes(i + '-' + j)? '#2EFF74':'#CDCDCD'}" /> <div class="pa-table-content-inside" :style="{background: selectedAreaList.includes(i + '-' + j)? '#2EFF74':'#CDCDCD'}" />
</div> </div>
<div style="display: inline-block;margin-left: 5px;height: 18px;line-height: 18px;transform: translateY(-25%);color: #192780;">{{ deviceMap[i+ '-' +j].state }}</div> <div :id="'state-' +i + '-' + j" class="pa-tabel-state-box">{{ deviceMap[i+ '-' +j].state }}</div>
</div> </div>
</div> </div>
</div> </div>
@ -134,6 +134,53 @@ export default {
const index = this.iscsDeviceMap[item.code]; const index = this.iscsDeviceMap[item.code];
if (index) { if (index) {
this.$set(this.deviceMap[index], 'state', item.state); this.$set(this.deviceMap[index], 'state', item.state);
const div = document.getElementById('state-' + index);
if (div) {
switch (item.state) {
case '0':
div.style.background = '#CCCCCC';
break;
case '1':
div.style.background = '#FF0000';
break;
case '2':
div.style.background = '#880000';
break;
case '3':
div.style.background = '#0000FF';
break;
case '4':
div.style.background = '#554488';
break;
case '5':
div.style.background = '#44CC55';
break;
case '6':
div.style.background = '#FF00FF';
break;
case '7':
div.style.background = '#887711';
break;
case '8':
div.style.background = '#006600';
break;
case '9':
div.style.background = '#778877';
break;
case '10':
div.style.background = '#555454';
break;
case '11':
div.style.background = '#556688';
break;
case '12':
div.style.background = '#887711';
break;
case '13':
div.style.background = '#115577';
break;
}
}
} }
}); });
} }
@ -562,4 +609,14 @@ export default {
.iscs-pa-table { .iscs-pa-table {
height: 32px; height: 32px;
} }
.pa-tabel-state-box{
display: inline-block;
margin-left: 5px;
width: 20px;
text-align: center;
height: 18px;
line-height: 18px;
transform: translateY(-25%);
color: #000;
}
</style> </style>

4
src/views/iscs/iscsSystem/config/broadcast/stateTable.vue
View File

@ -21,13 +21,13 @@
<el-row style="margin-bottom: 10px" :gutter="10"> <el-row style="margin-bottom: 10px" :gutter="10">
<el-col :span="3"><div style="background: #0000FF;color: #000; text-align: center">3</div></el-col> <el-col :span="3"><div style="background: #0000FF;color: #000; text-align: center">3</div></el-col>
<el-col :span="9"><div>环调话筒广播</div></el-col> <el-col :span="9"><div>环调话筒广播</div></el-col>
<el-col :span="3"><div style="background: #555454;color: #000; text-align: center">11</div></el-col> <el-col :span="3"><div style="background: #555454;color: #000; text-align: center">10</div></el-col>
<el-col :span="9"><div>车站普通预录</div></el-col> <el-col :span="9"><div>车站普通预录</div></el-col>
</el-row> </el-row>
<el-row style="margin-bottom: 10px" :gutter="10"> <el-row style="margin-bottom: 10px" :gutter="10">
<el-col :span="3"><div style="background: #554488;color: #000; text-align: center">4</div></el-col> <el-col :span="3"><div style="background: #554488;color: #000; text-align: center">4</div></el-col>
<el-col :span="9"><div>中心紧急预录</div></el-col> <el-col :span="9"><div>中心紧急预录</div></el-col>
<el-col :span="3"><div style="background: #556688;color: #000; text-align: center">12</div></el-col> <el-col :span="3"><div style="background: #556688;color: #000; text-align: center">11</div></el-col>
<el-col :span="9"><div>ATS预录</div></el-col> <el-col :span="9"><div>ATS预录</div></el-col>
</el-row> </el-row>
<el-row style="margin-bottom: 10px" :gutter="10"> <el-row style="margin-bottom: 10px" :gutter="10">

114
src/views/iscs/iscsSystem/config/broadcast/stationHome.vue
View File

@ -20,37 +20,37 @@
<el-col :span="3"> <el-col :span="3">
<div v-if="checkHasDevice('LCD')" class="broadcast-mode-button" @click="selectedArea('LCD')"> <div v-if="checkHasDevice('LCD')" class="broadcast-mode-button" @click="selectedArea('LCD')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('LCD')? '#2EFF74':'#CDCDCD'}" /> <div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('LCD')? '#2EFF74':'#CDCDCD'}" />
<div style="position: relative; left: 25px;display: inline-block;color: #000;">{{ deviceMap['LCD'].state }}</div> <div id="LCD" class="pa-state-box">{{ deviceMap['LCD'].state }}</div>
</div> </div>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="3">
<div v-if="checkHasDevice('UP_STAND')" class="broadcast-mode-button" @click="selectedArea('UP_STAND')"> <div v-if="checkHasDevice('UP_STAND')" class="broadcast-mode-button" @click="selectedArea('UP_STAND')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('UP_STAND')? '#2EFF74':'#CDCDCD'}" /> <div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('UP_STAND')? '#2EFF74':'#CDCDCD'}" />
<div style="position: relative; left: 25px;display: inline-block;color: #000;">{{ deviceMap['UP_STAND'].state }}</div> <div id="UP_STAND" class="pa-state-box">{{ deviceMap['UP_STAND'].state }}</div>
</div> </div>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="3">
<div v-if="checkHasDevice('DOWN_STAND')" class="broadcast-mode-button" @click="selectedArea('DOWN_STAND')"> <div v-if="checkHasDevice('DOWN_STAND')" class="broadcast-mode-button" @click="selectedArea('DOWN_STAND')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('DOWN_STAND')? '#2EFF74':'#CDCDCD'}" /> <div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('DOWN_STAND')? '#2EFF74':'#CDCDCD'}" />
<div style="position: relative; left: 25px;display: inline-block;color: #000;">{{ deviceMap['DOWN_STAND'].state }}</div> <div id="DOWN_STAND" class="pa-state-box">{{ deviceMap['DOWN_STAND'].state }}</div>
</div> </div>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="3">
<div v-if="checkHasDevice('ADMINISTRATIVE_AREA')" class="broadcast-mode-button" @click="selectedArea('ADMINISTRATIVE_AREA')"> <div v-if="checkHasDevice('ADMINISTRATIVE_AREA')" class="broadcast-mode-button" @click="selectedArea('ADMINISTRATIVE_AREA')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('ADMINISTRATIVE_AREA')? '#2EFF74':'#CDCDCD'}" /> <div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('ADMINISTRATIVE_AREA')? '#2EFF74':'#CDCDCD'}" />
<div style="position: relative; left: 25px;display: inline-block;color: #000;">{{ deviceMap['ADMINISTRATIVE_AREA'].state }}</div> <div id="ADMINISTRATIVE_AREA" class="pa-state-box">{{ deviceMap['ADMINISTRATIVE_AREA'].state }}</div>
</div> </div>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="3">
<div v-if="checkHasDevice('GATE')" class="broadcast-mode-button" @click="selectedArea('GATE')"> <div v-if="checkHasDevice('GATE')" class="broadcast-mode-button" @click="selectedArea('GATE')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('GATE')? '#2EFF74':'#CDCDCD'}" /> <div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('GATE')? '#2EFF74':'#CDCDCD'}" />
<div style="position: relative; left: 25px;display: inline-block;color: #000;">{{ deviceMap['GATE'].state }}</div> <div id="GATE" class="pa-state-box">{{ deviceMap['GATE'].state }}</div>
</div> </div>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="3">
<div v-if="checkHasDevice('TRANSFER_CHANNEL')" class="broadcast-mode-button" @click="selectedArea('TRANSFER_CHANNEL')"> <div v-if="checkHasDevice('TRANSFER_CHANNEL')" class="broadcast-mode-button" @click="selectedArea('TRANSFER_CHANNEL')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('TRANSFER_CHANNEL')? '#2EFF74':'#CDCDCD'}" /> <div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('TRANSFER_CHANNEL')? '#2EFF74':'#CDCDCD'}" />
<div style="position: relative; left: 25px;display: inline-block;color: #000;">{{ deviceMap['TRANSFER_CHANNEL'].state }}</div> <div id="TRANSFER_CHANNEL" class="pa-state-box">{{ deviceMap['TRANSFER_CHANNEL'].state }}</div>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
@ -251,6 +251,53 @@ export default {
this.iscsDeviceList.forEach(device => { this.iscsDeviceList.forEach(device => {
this.$set(device, 'state', this.iscsDeviceState[device.code] ? this.iscsDeviceState[device.code].state : '0'); this.$set(device, 'state', this.iscsDeviceState[device.code] ? this.iscsDeviceState[device.code].state : '0');
this.iscsDeviceMap[device.code] = device; this.iscsDeviceMap[device.code] = device;
const div = document.getElementById(device.position);
if (div) {
switch (device.state) {
case '0':
div.style.background = '#CCCCCC';
break;
case '1':
div.style.background = '#FF0000';
break;
case '2':
div.style.background = '#880000';
break;
case '3':
div.style.background = '#0000FF';
break;
case '4':
div.style.background = '#554488';
break;
case '5':
div.style.background = '#44CC55';
break;
case '6':
div.style.background = '#FF00FF';
break;
case '7':
div.style.background = '#887711';
break;
case '8':
div.style.background = '#006600';
break;
case '9':
div.style.background = '#778877';
break;
case '10':
div.style.background = '#555454';
break;
case '11':
div.style.background = '#556688';
break;
case '12':
div.style.background = '#887711';
break;
case '13':
div.style.background = '#115577';
break;
}
}
}); });
}); });
}, },
@ -265,6 +312,53 @@ export default {
const device = this.iscsDeviceMap[item.code]; const device = this.iscsDeviceMap[item.code];
if (device) { if (device) {
this.$set(this.deviceMap[device.position], 'state', item.state); this.$set(this.deviceMap[device.position], 'state', item.state);
const div = document.getElementById(device.position);
if (div) {
switch (item.state) {
case '0':
div.style.background = '#CCCCCC';
break;
case '1':
div.style.background = '#FF0000';
break;
case '2':
div.style.background = '#880000';
break;
case '3':
div.style.background = '#0000FF';
break;
case '4':
div.style.background = '#554488';
break;
case '5':
div.style.background = '#44CC55';
break;
case '6':
div.style.background = '#FF00FF';
break;
case '7':
div.style.background = '#887711';
break;
case '8':
div.style.background = '#006600';
break;
case '9':
div.style.background = '#778877';
break;
case '10':
div.style.background = '#555454';
break;
case '11':
div.style.background = '#556688';
break;
case '12':
div.style.background = '#887711';
break;
case '13':
div.style.background = '#115577';
break;
}
}
} }
}); });
} }
@ -468,6 +562,7 @@ export default {
} }
.pa-check-box{ .pa-check-box{
position: relative; position: relative;
left: 2px;
display: inline-block; display: inline-block;
width: 12px; width: 12px;
height: 12px; height: 12px;
@ -620,6 +715,13 @@ export default {
width: 13%; width: 13%;
font-size: 12px; font-size: 12px;
} }
.pa-state-box{
position: relative;
left: 30px;
display: inline-block;
color: #000;
width: 20px;
}
</style> </style>
<style> <style>
.time-control-pa-home .el-date-editor.el-input, .el-date-editor.el-input__inner{ .time-control-pa-home .el-date-editor.el-input, .el-date-editor.el-input__inner{

6
src/views/iscs/iscsSystem/config/pis/mainScreen.vue
View File

@ -20,10 +20,11 @@
<div class="screen_station_name">{{ station.stationName }}</div> <div class="screen_station_name">{{ station.stationName }}</div>
</div> </div>
<div v-if="station.children&&station.children.length>0"> <div v-if="station.children&&station.children.length>0">
<div v-for="(child,index) in station.children" :key="station.code+index" class="each_data_info" style="text-align: center;" @click="selectArea(station.code,index)"> <div v-for="(child,index) in station.children" :key="station.code+index" class="each_data_info" style="display: flex;align-items: center;justify-content: center;" @click="selectArea(station.code,index)">
<div v-if="child.status==='default'" :id="station.code + '-' + index" class="button_default_content"> <div v-if="child.status==='default'" class="button_default_content">
<div class="button_default" :style="{background:selectedAreaList.includes(station.code + '-' + index)?'#2EFF74':'#CDCDCD'}" /> <div class="button_default" :style="{background:selectedAreaList.includes(station.code + '-' + index)?'#2EFF74':'#CDCDCD'}" />
</div> </div>
<div :id="station.code + '-' + index" style="width: 14px;height: 14px;margin-left: 5px;" />
</div> </div>
</div> </div>
</div> </div>
@ -401,7 +402,6 @@ border-top: 2px solid #8c8a89;border-left: 2px solid #8c8a89;border-right: 2px s
border-bottom: 2px solid #898888; border-bottom: 2px solid #898888;
} }
.button_default_content{ .button_default_content{
margin:0 auto;
height: 18px; height: 18px;
width: 18px; width: 18px;
background: #D4D4D4; background: #D4D4D4;