修改看板

IOT
夜笙歌 2 months ago
parent 7f13a635aa
commit f485b0889f

@ -10,10 +10,10 @@
<div class="span1" style="top: 23.5%;left: 24%;">运行速度</div>
<div class="span1" style="top: 29.8%;left: 24%;">升降状态</div>
<div class="span1" style="top: 36.2%;left: 24%;">实时位置</div>
<div class="info1" style="top: 17.3%;right: 64.5%;color:#a80d1b">{{ AlarmInfo.deviceStatus }}</div>
<div class="info1" style="top: 23.5%;right: 64.5%;">{{ AlarmInfo.runSpeed }}m/s</div>
<div class="info1" style="top: 29.8%;right: 64.5%;">{{ AlarmInfo.liftStatus }}</div>
<div class="info1" style="top: 36.2%;right: 64.5%;">位置{{ AlarmInfo.realAddr }}#</div>
<div class="info1" style="top: 17.3%;right: 64.5%;color:#a80d1b">{{ setDeviceStatus(DeviceInfo.deviceStatus) }}</div>
<div class="info1" style="top: 23.5%;right: 64.5%;">{{ DeviceInfo.runSpeed }}m/s</div>
<div class="info1" style="top: 29.8%;right: 64.5%;">{{ setLiftStatus(DeviceInfo.liftStatus) }}</div>
<div class="info1" style="top: 36.2%;right: 64.5%;">位置{{ DeviceInfo.realAddr }}</div>
<div class="span2" style="top: 49.6%;left: 6%;">平均温度</div>
@ -43,66 +43,68 @@
<el-button type="primary" class="analyse" size="mini">告警分析</el-button>
<div class="table">
<div style="background-color: #1077bc19">
<div class="scrollTableItem" style="width:20%;color:#65c2f3;font-weight: bold;">
报警开始时间
<div class="scrollTableItem" style="width:40%;color:#65c2f3;font-weight: bold;">
报警时间
</div>
<div class="scrollTableItem" style="width:8%;color:#65c2f3;font-weight: bold;">
<div class="scrollTableItem" style="width:10%;color:#65c2f3;font-weight: bold;">
报警类型
</div>
<div class="scrollTableItem" style="width:8%;color:#65c2f3;font-weight: bold;">
<div class="scrollTableItem" style="width:10%;color:#65c2f3;font-weight: bold;">
报警来源
</div>
<div class="scrollTableItem" style="width:8%;color:#65c2f3;font-weight: bold;">
告警等级
</div>
<div class="scrollTableItem" style="width:13%;color:#65c2f3;font-weight: bold;">
报警对象
<div class="scrollTableItem" style="width:15%;color:#65c2f3;font-weight: bold;">
报警位置
</div>
<div class="scrollTableItem" style="width:18%;color:#65c2f3;font-weight: bold;">
<div class="scrollTableItem" style="width:15%;color:#65c2f3;font-weight: bold;">
报警内容
</div>
<div class="scrollTableItem" style="width:8%;color:#65c2f3;font-weight: bold;">
采集资源
</div>
<div class="scrollTableItem" style="width:15%;color:#65c2f3;font-weight: bold;">
操作
<div class="scrollTableItem" style="width:10%;color:#65c2f3;font-weight: bold;">
是否处理
</div>
<!-- <div class="scrollTableItem" style="width:8%;color:#65c2f3;font-weight: bold;">-->
<!-- 采集资源-->
<!-- </div>-->
<!-- <div class="scrollTableItem" style="width:15%;color:#65c2f3;font-weight: bold;">-->
<!-- 操作-->
<!-- </div>-->
</div>
<vue-seamless-scroll
:class-option="scrollTableOption"
:data="scrollTableData"
:data="AlarmInfo"
class="case-item"
style="height: calc(100% - 30px);overflow: hidden;"
>
<div
v-for="(item, index) in scrollTableData"
v-for="(item, index) in AlarmInfo"
:key="index"
>
<div :style='"background-color:" + ((index % 2 === 0)? "#1077bc19":"#1077bc05") '>
<div class="scrollTableItem" style="width:20%;color:#65c2f3;">
{{ item.value1 }}
<div class="scrollTableItem" style="width:40%;color:#65c2f3;">
{{ item.alarmTime }}
</div>
<div class="scrollTableItem" style="width:8%;color:#65c2f3;">
{{ item.value2 }}
<div class="scrollTableItem" style="width:10%;color:#65c2f3;">
{{ item.alarmType }}
</div>
<div class="scrollTableItem" style="width:8%;color:#65c2f3;">
{{ item.value3 }}
<div class="scrollTableItem" style="width:10%;color:#65c2f3;">
<span v-if="item.alarmSource ==1"></span>
<span v-if="item.alarmSource ==2"></span>
</div>
<div class="scrollTableItem" style="width:8%;color:#65c2f3;">
{{ item.value4 }}
</div>
<div class="scrollTableItem" style="width:13%;color:#65c2f3;">
{{ item.value5 }}
</div>
<div class="scrollTableItem" style="width:18%;color:#65c2f3;">
{{ item.value6 }}
</div>
<div class="scrollTableItem" style="width:8%;color:#65c2f3;">
{{ item.value7 }}
<div class="scrollTableItem" style="width:15%;color:#65c2f3;">
{{ item.alarmAddr }}
</div>
<div class="scrollTableItem" style="width:15%;color:#65c2f3;">
操作
{{ item.alarmContent }}
</div>
<div class="scrollTableItem" style="width:10%;color:#65c2f3;">
<span v-if="item.isFlag ==1"></span>
<span v-if="item.isFlag ==2"></span>
</div>
<!-- <div class="scrollTableItem" style="width:8%;color:#65c2f3;">-->
<!-- {{ item.value7 }}-->
<!-- </div>-->
<!-- <div class="scrollTableItem" style="width:15%;color:#65c2f3;">-->
<!-- 操作-->
<!-- </div>-->
</div>
</div>
</vue-seamless-scroll>
@ -591,11 +593,29 @@ export default {
})
},
methods: {
setDeviceStatus(e){
if(e == 1){
return '自动'
}
if(e == 2){
return '本地'
}
if(e == 3){
return '报警'
}
},
setLiftStatus(e){
if(e == 1){
return '正常'
}else{
return '报警'
}
},
getData() {
let _this = this
const socket = new WebSocket('ws://192.168.2.165:7181/ws');
const socket = new WebSocket('ws://192.168.202.241:7181/ws');
socket.onopen = function (event) {
console.log('WebSocket 连接已打开');

@ -51,7 +51,7 @@
报警来源
</div>
<div class="scrollTableItem" style="width:16%;color:#65c2f3;font-weight: bold;">
告警等级
报警类型
</div>
<div class="scrollTableItem" style="width:16%;color:#65c2f3;font-weight: bold;">
报警内容
@ -75,13 +75,14 @@
{{ item.recordTime }}
</div>
<div class="scrollTableItem" style="width:16%;color:#65c2f3;">
{{ item.value2 }}
{{ item.busbarAlias }}
<!-- 智能巡检-->
</div>
<div class="scrollTableItem" style="width:16%;color:#65c2f3;">
{{ item.value3 }}
{{ item.alarmType}}
</div>
<div class="scrollTableItem" style="width:16%;color:#65c2f3;">
{{ item.value4 }}
{{ item.alarmContent }}
</div>
<div class="scrollTableItem" style="width:30%;color:#65c2f3;">
<el-button type="primary" size="mini">查看</el-button>
@ -106,6 +107,7 @@ import {
} from "@/api/board/index2";
export default {
dicts:['alarm_type'],
data() {
return {
scrollTableOption: {
@ -165,8 +167,12 @@ export default {
},
mounted() {
this.getData()
this.setAlarmType()
},
methods: {
setAlarmType(e){
console.log(this.dict.type.alarm_type)
},
getData(){
baseMonitorInfoList().then(e=>{

Loading…
Cancel
Save