Compare commits

...

2 Commits

  1. 2
      ruoyi-ui/src/App.vue
  2. 1
      ruoyi-ui/src/main.js
  3. 33
      ruoyi-ui/src/views/JiHeExpressway/pages/service/board/index.vue
  4. 5
      ruoyi-ui/src/views/JiHeExpressway/pages/service/boardRecord/index.vue
  5. 64
      ruoyi-ui/src/views/websocket.vue

2
ruoyi-ui/src/App.vue

@ -54,9 +54,11 @@ export default {
}, },
methods:{ methods:{
onNewEvent(para){ onNewEvent(para){
if (para.subEvent == "0" || para.subEvent == "1"){
this.$refs["notifyShow"].showNotify(para); this.$refs["notifyShow"].showNotify(para);
} }
} }
}
}; };
</script> </script>

1
ruoyi-ui/src/main.js

@ -107,6 +107,7 @@ Vue.prototype.socket = Socket;
Vue.prototype.numberMul = numberMul; Vue.prototype.numberMul = numberMul;
Vue.prototype.emitter = emitter; Vue.prototype.emitter = emitter;
Vue.prototype.EventBus = new Vue();
// gis // gis
Vue.prototype.$GlobalConfig = config.GlobalConfig; Vue.prototype.$GlobalConfig = config.GlobalConfig;

33
ruoyi-ui/src/views/JiHeExpressway/pages/service/board/index.vue

@ -64,20 +64,21 @@
<div v-if="item.list.length > 0"> <div v-if="item.list.length > 0">
<el-checkbox-group class="deviceList" v-model="checkedDeviceIds" @change="____onSelectDevices"> <el-checkbox-group class="deviceList" v-model="checkedDeviceIds" @change="____onSelectDevices">
<el-checkbox v-for="(itm, index) in item.list" :label="itm.iotDeviceId" :key="index" <el-checkbox v-for="(itm, index) in item.list" :label="itm.iotDeviceId" :key="index"
:disabled="!itm.iotDeviceId || itm.iotDeviceId.includes('null') || itm.deviceState == 0 || itm.deviceState == null"> :disabled="!itm.iotDeviceId || itm.iotDeviceId.includes('null') || deviceStateLatest[itm.iotDeviceId]===false || (itm.deviceState == 0 || itm.deviceState == null)">
<el-tooltip content="设备未接入" placement="top" <el-tooltip content="设备未接入" placement="top"
v-if="!itm.iotDeviceId || itm.iotDeviceId.includes('null_')"> v-if="!itm.iotDeviceId || itm.iotDeviceId.includes('null_')">
<div class="title">{{ itm.deviceName }}</div> <div class="title">{{ itm.deviceName }}</div>
</el-tooltip> </el-tooltip>
<el-tooltip content="设备离线" placement="top" <el-tooltip content="设备离线" placement="top"
v-else-if="itm.deviceState == 0 || itm.deviceState == null"> v-else-if="deviceStateLatest[itm.iotDeviceId]===false || (itm.deviceState == 0 || itm.deviceState == null)">
<div class="title">{{ itm.deviceName }}</div> <div class="title">{{ itm.deviceName }}</div>
</el-tooltip> </el-tooltip>
<div v-else class="title">{{ itm.deviceName }}</div> <div v-else class="title">{{ itm.deviceName }}</div>
<el-tooltip :content="(itm.deviceState == 0 || itm.deviceState == null) ? '离线' : '在线'" <el-tooltip
:content="(deviceStateLatest[itm.iotDeviceId]===false || (itm.deviceState == 0 || itm.deviceState == null)) ? '离线' : '在线'"
placement="top"> placement="top">
<img src="@/assets/jihe/images/offline.svg" class="state" <img src="@/assets/jihe/images/offline.svg" class="state"
v-if="itm.deviceState == '0' || itm.deviceState == null"> v-if="deviceStateLatest[itm.iotDeviceId]===false || (itm.deviceState == 0 || itm.deviceState == null) ">
<img src="@/assets/jihe/images/online.svg" class="state" v-else> <img src="@/assets/jihe/images/online.svg" class="state" v-else>
</el-tooltip> </el-tooltip>
<el-tooltip content="回读" placement="top"> <el-tooltip content="回读" placement="top">
@ -308,6 +309,7 @@ export default {
scrollOptions, scrollOptions,
boardItemEdtingIndex: -1, boardItemEdtingIndex: -1,
isHideCtt: false, isHideCtt: false,
deviceStateLatest:{}
}; };
}, },
watch: { watch: {
@ -346,9 +348,26 @@ export default {
}); });
}, },
mounted(){ mounted(){
this.EventBus.$on("deviceState", deviceList => {
deviceList.forEach(item=>{
if(item.deviceType == "2"){
let bool;
if (item.deviceState === '0' || item.deviceState===null){
bool = false;
}else{
bool = true;
}
this.$set(this.deviceStateLatest, item.iotDeviceId, bool);
}
})
});
// this.rowDrop(); // this.rowDrop();
this.hideScrollFn(); this.hideScrollFn();
}, },
destroyed(){
this.EventBus.$off("deviceState");
},
computed: { computed: {
____boardScale() { ____boardScale() {
let arr = this.selectedSize.split("*"); let arr = this.selectedSize.split("*");
@ -513,6 +532,12 @@ export default {
this.$message.warning("设备未接入!"); this.$message.warning("设备未接入!");
return; return;
} }
if (this.deviceStateLatest[deviceFrom.iotDeviceId] === false){
this.$message.warning("设备已离线!");
return;
}
this.selectedBdMsg = []; this.selectedBdMsg = [];
getBoardDeviceInfo(deviceFrom.iotDeviceId, deviceFrom.id) getBoardDeviceInfo(deviceFrom.iotDeviceId, deviceFrom.id)
.then((res) => { .then((res) => {

5
ruoyi-ui/src/views/JiHeExpressway/pages/service/boardRecord/index.vue

@ -230,7 +230,10 @@ export default {
::v-deep .el-carousel__indicators--horizontal{ ::v-deep .el-carousel__indicators--horizontal{
line-height: 0; height: 16px; line-height: 0; height: 16px;
.el-carousel__indicator--horizontal{ .el-carousel__indicator--horizontal{
padding: 7px 4px; padding: 7px 2px;
.el-carousel__button {
width: 20px;
}
} }
} }
::v-deep .el-table__cell div.cell { ::v-deep .el-table__cell div.cell {

64
ruoyi-ui/src/views/websocket.vue

@ -56,10 +56,11 @@ export default {
const params = message.params; const params = message.params;
const subEvent = params.subEvent; const subEvent = params.subEvent;
const content = params.content; const content = params.content;
let contentList;
if(_.isString(content)){ if(_.isString(content)){
var contentList = JSON.parse(content); contentList = JSON.parse(content);
}else{ }else{
var contentList = content; contentList = content;
} }
switch (subEvent) { switch (subEvent) {
@ -104,6 +105,9 @@ export default {
case "1": case "1":
this.$emit("newEvent", params); this.$emit("newEvent", params);
break; break;
case "deviceState":
this.EventBus.$emit("deviceState", contentList );
break;
default: default:
} }
}; };
@ -114,61 +118,29 @@ export default {
mounted(){ mounted(){
let _this = this; let _this = this;
if (process.env.NODE_ENV == "development"){ if (process.env.NODE_ENV == "development"){
//websocket
return return
let et = 1; let deviceState = "0";
document.onkeydown = function (e) { document.onkeydown = function (e) {
let tp = _.sample(["0", "1", "0", "1", "0", "0", "0", "1", "0"]); deviceState == "0" ? deviceState = "1" : deviceState = "0";
if (e.code == 'Space') { if (e.code == 'Space') {
let params = { let params = {
"subEvent": tp, "subEvent": "deviceState",
"content": { "content": [
"event": { {
"id": "1555c6599eb14e3fb68d04e512182ee7", "id": 896,
"deptId": 103, "iotDeviceId": "8162-65535",
"stakeMark": "K059+289", "deviceType":"2",
"endStakeMark": "", deviceState
"direction": "1",
"userId": 1,
"estimatedEndTime": "2024-04-11 00:00:00",
"eventType": et,
"eventSubclass": "3-2",
"eventState": 0,
"eventSource": 1,
"inTunnel": 0,
"roadId": 1,
"occurrenceTime": "2024-04-10 16:56:02",
"warningTime": "2024-04-10 16:56:02",
"lang": "",
"dcEventTrafficControl": {
"controlType": 1,
"controlCause": 1,
"exitsInlets": 2,
"facilityId": 11,
"measure": 1,
"classify": 1,
"facilityIds": [
11
]
},
"createTime": "2024-05-08 18:02:40"
},
"content": "菏泽方向 K059+289 发生收费站封闭和限行事件"
} }
]
}; };
_this.$emit("newEvent", params); _this.EventBus.$emit("deviceState", params.content );
} }
if(tp == "0"){
et++;
if (et >= 12) {
et = 1;
}
}
} }
} }
} }
}; };
</script> </script>

Loading…
Cancel
Save