添加websocket推送

src/api/yInfo/yInfo.js

@@ -17,3 +17,5 @@ export function getUnread(query) {
   return request({ url: '/yInfo/getUnread', method: 'GET', params: data })
 }
 
+export const ws = '/api/monitor/ws'
+

src/store/modules/app.js

@@ -19,6 +19,9 @@ const mutations = {
       Cookies.set('sidebarStatus', 0)
     }
   },
+  SET_SYSMESSAGE_COUNT: (state, count) => {
+    state.sysMessageCount = count;
+  },
   CLOSE_SIDEBAR: (state, withoutAnimation) => {
     Cookies.set('sidebarStatus', 0)
     state.sidebar.opened = false
@@ -40,6 +43,9 @@ const actions = {
   closeSideBar({ commit }, { withoutAnimation }) {
     commit('CLOSE_SIDEBAR', withoutAnimation)
   },
+  setSysMessageCount({ commit }, count) {
+    commit("SET_SYSMESSAGE_COUNT", count);
+  },
   toggleDevice({ commit }, device) {
     commit('TOGGLE_DEVICE', device)
   },

src/views/index.vue

@@ -168,12 +168,15 @@
 </template>
 
 <script>
+import VueStomp from 'vue-stomp'
+import Vue from 'vue'
+Vue.use(VueStomp)
 import { login1 } from '@/api/system/user/login.js'
 import * as echarts from "echarts";
 import PieChartrenyuan from '@/views/echarts/components/PieChartrenyuan'
 import HomeMap from '@/views/dashboard/components/HomeMap'
 import { getCallPolicePage } from '@/api/callPolice/callPolice'
-import { getInfoPage, getUnread } from '@/api/yInfo/yInfo'
+import { getInfoPage, getUnread, ws } from '@/api/yInfo/yInfo'
 import { getStatusCount } from '@/api/device/device'
 import { init } from 'events';
 // 1.1入侵报警饼图
@@ -293,9 +296,9 @@ export default {
   },
   created() {
     var _self = this
-    setInterval(function () {
-      _self.getMessage();
-    }, 20000)
+    // setInterval(function () {
+    //   _self.getMessage();
+    // }, 20000)
 
     this.init()
   },
@@ -320,12 +323,33 @@ export default {
       // console.log('-------------查询未读信息结果：' + response.data)
       // if (response.code === 20000 && response.data) {
       // this.$store.dispatch('app/setSysMessageCount', response.data)
-      this.$store.dispatch('app/setSysMessageCount', "lllll")
+      this.$store.dispatch('app/setSysMessageCount', "11111")
       // } else {
       //     this.$store.dispatch('app/setSysMessageCount', 0)
       //   }
       // })
     },
+    responseCallback(frame) {
+      var data = JSON.parse(frame.body)
+      // 语音播放
+      // this.bofang1(data)
+      // 报警
+      this.$notify({
+        title: '订单消息',
+        dangerouslyUseHTMLString: true,
+        // message: "<img src='/image/yujing.png'>" + data.createTime,
+        // message: "<img src='/image/yujing.png'><span>32123312</span>",
+        message: "<div style='display: flex;flex-direction: row;flex-wrap: nowrap;justify-content: flex-start;align-items:center;margin: 0 auto;height:60px;line-height: 60px;'><img style='width:40px;height:40px;margin: 0 10px 0 0;' src='/image/yujing.png'>" + "<span style='display: inline-block;margin: 0 0px 0 0;height:40px;line-height: 40px;font-weight: bold;'>" + data.callType + "</span></div>",
+        position: 'bottom-right',
+        onClick: () => {
+          // this.playText(data.createTime)
+          // this.getServicePageLists()
+        },
+        duration: 3000,
+      })
+
+      // this.$store.dispatch('app/setSysMessageCount', this.sysmesCount + 1)
+    },
     onConnected(frame) {
       // 订阅广播系统通知
       this.$stompClient.subscribe(
@@ -335,11 +359,11 @@ export default {
       )
       //
       // 订阅点对点 通过用户id指定用户
-      this.$stompClient.subscribe(
-        '/user/' + this.userId + '/queue/subscribewarn',
-        this.responseCallback,
-        this.onFailed
-      )
+      // this.$stompClient.subscribe(
+      //   '/user/' + this.userId + '/queue/subscribewarn',
+      //   this.responseCallback,
+      //   this.onFailed
+      // )
     },
     onFailed(frame) {
       console.log('gongzuotai连接ws失败： ' + JSON.stringify(frame))
@@ -350,23 +374,23 @@ export default {
       this.connetWM(ws, headers, this.onConnected, this.onFailed)
     },
     onConnected(frame) {
-      订阅广播系统通知
+      // 订阅广播系统通知
       this.$stompClient.subscribe(
         '/topic/subscribe',
         this.responseCallback,
         this.onFailed
       )
       // 订阅点对点 通过用户id指定用户
-      this.$stompClient.subscribe(
-        '/user/' + this.userId + '/queue/subscribewarn',
-        this.responseCallback,
-        this.onFailed
-      )
+      // this.$stompClient.subscribe(
+      //   '/user/' + this.userId + '/queue/subscribewarn',
+      //   this.responseCallback,
+      //   this.onFailed
+      // )
     },
     init() {
-      // this.toDoMessagge()
-      // this.timer = setInterval(this.toDoMessagge, 60000)
-      // this.connectSrv()
+      this.toDoMessagge()
+      this.timer = setInterval(this.toDoMessagge, 60000)
+      this.connectSrv()
       getStatusCount({ deviceType: 1 }).then(res => {
         this.statusDataSp = res.data
         this.shipinjiankong_Chart.Data.seriesData = []