From 7d6bad04ab4b3b4263bb6b8335f8bcd46a844881 Mon Sep 17 00:00:00 2001
From: zhaowei <1755871297@qq.com>
Date: Fri, 22 Apr 2022 13:48:24 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/layout/components/Device/index.vue | 91 ++++++++++++++++-----
src/layout/components/MusicManage/index.vue | 4 +-
vue.config.js | 2 +-
3 files changed, 73 insertions(+), 24 deletions(-)
diff --git a/src/layout/components/Device/index.vue b/src/layout/components/Device/index.vue
index 85be8d6..7569a36 100644
--- a/src/layout/components/Device/index.vue
+++ b/src/layout/components/Device/index.vue
@@ -52,7 +52,7 @@
设备状态
- {{item.status==0?'正常':'异常'}}
+ {{item.status==1?'正常':'异常'}}
+ -->
@@ -151,11 +151,10 @@ export default {
addDevice: false,
form: {
-
- location:null,
- deviceIp:null,
- note:null,
- volume:null,
+ location: null,
+ deviceIp: null,
+ note: null,
+ volume: null
},
rules: {},
deviceData: []
@@ -163,8 +162,62 @@ export default {
},
created() {
this.getList();
+ this.initWebSocket();
},
methods: {
+ initWebSocket() {
+ if (typeof WebSocket == "undefined") {
+ console.log("您的浏览器不支持WebSocket");
+ } else {
+ console.log("您的浏览器支持WebSocket");
+ const a = "123:0";
+ const arr = a.split(":");
+ console.log(arr[0]);
+ if (this.socket != null) {
+ this.socket.close();
+ this.socket = null;
+ }
+ //实现化WebSocket对象，指定要连接的服务器地址与端口 建立连接
+ this.socket = new WebSocket(
+ "ws://192.168.31.27:8080/websocket/message"
+ );
+ //打开事件
+ this.socket.onopen = function() {
+ console.log("websocket已打开");
+ };
+ //获得消息事件
+ listMusic(this.queryParams).then(result => {
+ this.deviceData = result.rows;
+ this.loading = false;
+ console.log(this.deviceData,888)
+ });
+ this.socket.onmessage = function(msg) {
+ // deviceId:0 status:'1'
+ console.log(msg.data);
+ const deviceMsg = msg.data.split(":");
+ // this.deviceData = msg.data;
+
+ console.log(999)
+ this.deviceData.forEach(element => {
+ if (element.deviceId === deviceMsg[0]) {
+ element.status = deviceMsg[1];
+ }
+ });
+ //发现消息进入 开始处理前端触发逻辑
+ };
+ // console.log(this.deviceData,888)
+
+ //关闭事件
+ this.socket.onclose = function() {
+ console.log("websocket已关闭");
+ };
+ //发生了错误事件
+ this.socket.onerror = function() {
+ console.log("websocket发生了错误");
+ };
+ }
+ },
+
//查询设备数据
getList() {
this.loading = true;
@@ -189,9 +242,7 @@ export default {
// this.deviceData.push({location});
},
//
- deleteDevice(){
-
- },
+ deleteDevice() {},
//删除对应的喇叭
removeItem(index, deviceData) {
this.$modal
@@ -202,9 +253,7 @@ export default {
.then(() => {
this.$modal.msgSuccess("删除成功");
})
- .catch(() => {
-
- });
+ .catch(() => {});
}
}
};
@@ -343,17 +392,17 @@ export default {
/* 新增对话框样式 */
::v-deep .el-dialog {
background: #111658 !important;
- border:1px solid gray;
+ border: 1px solid gray;
}
::v-deep .el-dialog__body {
color: white !important;
}
-::v-deep .el-form .el-form-item__label{
- color:white;
+::v-deep .el-form .el-form-item__label {
+ color: white;
}
-::v-deep .el-input3 .el-input__inner{
- background-color: #1c257f!important;
+::v-deep .el-input3 .el-input__inner {
+ background-color: #1c257f !important;
border: 1px solid rgba(25, 186, 139, 0.17) !important;
- color:white;
+ color: white;
}
\ No newline at end of file
diff --git a/src/layout/components/MusicManage/index.vue b/src/layout/components/MusicManage/index.vue
index 761b110..f6f8d5e 100644
--- a/src/layout/components/MusicManage/index.vue
+++ b/src/layout/components/MusicManage/index.vue
@@ -37,8 +37,8 @@
- 正常
- 异常
+ 正常
+ 异常
diff --git a/vue.config.js b/vue.config.js
index bba4013..aca7ce5 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -35,7 +35,7 @@ module.exports = {
proxy: {
// detail: https://cli.vuejs.org/config/#devserver-proxy
[process.env.VUE_APP_BASE_API]: {
- target: `http://192.168.31.97:8080`,
+ target: `http://192.168.31.27:8080`,
changeOrigin: true,
pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: ''