bug修改，视频提前提醒部分

src/App.vue

@@ -33,10 +33,19 @@ export default {
   methods: {
     socketSucc(frame) {
       console.log(frame, '---初始化成功app')
+      // '/user/'+userId+'/queue/video'
+      let userInfo = JSON.parse(sessionStorage.getItem('userInfo'))
+      let url = `/user/${userInfo.phone}/queue/video`
+      // console.log(url, '---订阅地址')
+      this.$stompSocket.subscription(url, this.receivePush)
     },
     socketErr(frame) {
       console.log(frame, '---初始化失败app')
     },
+    receivePush(message) {
+      console.log(message, '---接收订阅消息')
+      // this.$store.commit('setVideoReminder', JSON.stringify(message))
+    },
     scriptWithDataSetExists(dataId) {
       const scriptElement = document.querySelector(`script[data-telephone="${dataId}"]`);
       return scriptElement !== null;

src/pages/layout/components/LayoutHeader.vue

@@ -34,15 +34,19 @@
               <div class="f14 color-text-regular">{{ userInfo.phone || '-' }}</div>
             </div>
           </div>
-                        <div class="flex-row justify-content-between align-items-center border-t-solid-lighter-1 p-16 cursor-pointer" @click="handleChangePassword">
+          <div class="flex-row justify-content-between align-items-center border-t-solid-lighter-1 p-16 cursor-pointer"
+               @click="handleChangePassword">
             <div class="f16 color-text-regular">密码管理</div>
             <div class="f16 color-text-secondary">修改密码<i class="el-icon-arrow-right"></i></div>
           </div>
-                        <div class="flex-row justify-content-between align-items-center border-t-solid-lighter-1 p-16 cursor-pointer" @click="handleChangePersonal">
+          <div class="flex-row justify-content-between align-items-center border-t-solid-lighter-1 p-16 cursor-pointer"
+               @click="handleChangePersonal">
             <div class="f16 color-text-regular">个人信息</div>
             <div class="f16 color-text-secondary">查看信息<i class="el-icon-arrow-right"></i></div>
           </div>
-                        <div class="border-t-solid-lighter-1 p-16 f16 color-1960F4 text-center cursor-pointer" @click="handleLoginOut()">退出登录</div>
+          <div class="border-t-solid-lighter-1 p-16 f16 color-1960F4 text-center cursor-pointer"
+               @click="handleLoginOut()">退出登录
+          </div>
         </div>
       </el-collapse-transition>
     </div>
@@ -188,6 +192,7 @@
 </template>
 <script>
 import api from "@/services/systemManage";
+
 export default {
   components: {
     SideMenu: () => import('./SideMenu'),
@@ -238,7 +243,11 @@
         ],
         pwd: [
           {required: true, validator: validatePass, trigger: 'change',},
-                        { pattern: /^(?=.*[a-zA-Z])(?=.*[0-9])(?=.*[\W_]).{6,18}$/, message: '只能输入由6-18个字母、数字、下划线组成的密码', trigger: ['blur', 'change']}
+          {
+            pattern: /^(?=.*[a-zA-Z])(?=.*[0-9])(?=.*[\W_]).{6,18}$/,
+            message: '只能输入由6-18个字母、数字、下划线组成的密码',
+            trigger: ['blur', 'change']
+          }
         ],
         confirmPwd: [
           {required: true, validator: validatePass2, trigger: 'change',},
@@ -334,7 +343,9 @@
         this.$store.commit('setToken', '');
         sessionStorage.removeItem('userInfo')
         this.$store.commit('setUserInfo', '');
-                        this.$store.commit('setRoutes','')
+        this.$store.commit('setRoutes', '');
+        sessionStorage.removeItem('brokerEndpoint');
+        this.$store.commit('brokerEndpoint', '');
         // }
 
       })
@@ -361,31 +372,52 @@
     border: 0 !important;
     top: 30px;
   }
-    .layou-header-right-box{width: 300px;display: inline-block;text-align: right;}
+
-    .layout-side-menu-wrap .side-menu-container{border-right: 0;}
+  .layou-header-right-box {
+    width: 300px;
+    display: inline-block;
+    text-align: right;
+  }
+
+  .layout-side-menu-wrap .side-menu-container {
+    border-right: 0;
+  }
+
   .el-menu {
     border: 0;
     background-color: transparent;
   }
-    .el-menu--horizontal > .el-menu-item{color: #FFFFFFB2;}
+
-    .el-menu--horizontal > .el-submenu .el-submenu__title{color: #FFFFFFB2;}
+  .el-menu--horizontal > .el-menu-item {
+    color: #FFFFFFB2;
+  }
+
+  .el-menu--horizontal > .el-submenu .el-submenu__title {
+    color: #FFFFFFB2;
+  }
 
   .el-menu--horizontal > .el-menu-item:hover {
     color: #C66A5B;
     background-color: transparent;
     color: #fff;
   }
+
   .el-menu--horizontal > .el-submenu:hover .el-submenu__title {
     color: #C66A5B;
     background-color: transparent;
     color: #fff;
   }
-    .el-submenu__title i{color:#FFFFFFB2; }
+
+  .el-submenu__title i {
+    color: #FFFFFFB2;
+  }
+
   .el-menu--horizontal > .el-menu-item.is-active {
     border-bottom: 2px solid #fff;
     background-color: transparent;
     color: #fff;
   }
+
   .el-menu--horizontal > .el-submenu.is-active .el-submenu__title {
     border-bottom: 2px solid #fff;
     background-color: transparent;
@@ -393,12 +425,15 @@
   }
 
 }
+
 .el-menu--horizontal .el-menu.el-menu--popup .el-menu-item:not(.is-disabled):hover {
   color: #C66A5B;
 }
+
 .el-menu--horizontal .el-menu .el-menu-item.is-active, .el-menu--horizontal .el-menu .el-submenu.is-active > .el-submenu__title {
   color: #C66A5B;
 }
+
 .layout-header-number {
   position: absolute;
   right: -10px;
@@ -425,10 +460,12 @@
   z-index: 999;
   box-shadow: 2px 2px 5px $border-color-lighter;
   transition: opacity 2s;
+
   .show-info-header {
     padding: 40px 16px;
   }
 }
+
 // 修改图标样式
 .el-icon-caret-bottom {
   font-size: 30px;

src/pages/login/index.vue

@@ -306,9 +306,18 @@ export default {
 
     socketSucc(frame) {
       console.log(frame, '---初始化成功login')
+      // '/user/'+userId+'/queue/video'
+      let userInfo = JSON.parse(sessionStorage.getItem('userInfo'))
+      let url = `/user/${userInfo.phone}/queue/video`
+      // console.log(url, '---订阅地址')
+      this.$stompSocket.subscription(url, this.receivePush)
     },
     socketErr(frame) {
       console.log(frame, '---初始化失败login')
+    },
+    receivePush(message) {
+      console.log(message, '---接收订阅消息')
+      // this.$store.commit('setVideoReminder', JSON.stringify(message))
     }
   }
 }

src/pages/mediation-page/components/MediationRoom.vue

@@ -223,6 +223,7 @@
 </template>
 <script>
 import api from "@/services/caseManagement";
+import {mapState} from 'vuex'
 export default {
   components: {
     caseVideoReservationDialog: () => import('./caseVideoReservationDialog'),//
@@ -376,6 +377,19 @@ export default {
       const seconds = totalSeconds % 60;
       return `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
     },
+    ...mapState({
+      videoReminder: state => state.videoReminder
+    }),
+  },
+  watch: {
+    videoReminder: {
+      deep: true,
+      handler: function (val) {
+        if (val){
+          console.log(val, '---视频提前5分钟提醒')
+        }
+      }
+    }
   },
   async created() {
     

src/store/index.js

@@ -25,6 +25,7 @@ const store = new Vuex.Store({
         idFrontPath: '',
         routes: [], // 从后端获取的路由菜单
         brokerEndpoint: '',
+        videoReminder: '',
     },
     plugins: [vuexPersisted],
     // 全局同步方法, 调用方法,this.$store.commit("xxx",'赋值数据')
@@ -44,6 +45,9 @@ const store = new Vuex.Store({
         setBrokerEndpoint(state, data) {
             state.brokerEndpoint = data;
         },
+        setVideoReminder(state, data) {
+            state.videoReminder = data;
+        }
 
     },
     // 异步方法 调用方法,this.$store.dispatch("xxx")