Browse Source

fix:消息通知添加长连接

贾宇博 1 month ago
parent
commit
306428b601
4 changed files with 48 additions and 34 deletions
  1. 7 7
      src/layout/components/Sidebar/index.vue
  2. 36 2
      src/store/modules/sidebar.js
  3. 4 24
      src/views/login.vue
  4. 1 1
      vite.config.js

+ 7 - 7
src/layout/components/Sidebar/index.vue

@@ -65,14 +65,14 @@ const badgeObj =  computed(() => sidebarStore.badgeObj)
 const unreadCount = ref(0);  // 存储未读消息数量
 
 // 获取未读数量
-function getOnList(){
+// function getOnList(){
 
-  MessaGeUnreadMessageCount().then(res=>{
-    if(res.code == 200){
-      badgeObj.value.xxtzGqxxtzNum = res.data;
-    }
-  })
-}
+//   MessaGeUnreadMessageCount().then(res=>{
+//     if(res.code == 200){
+//       badgeObj.value.xxtzGqxxtzNum = res.data;
+//     }
+//   })
+// }
 
 
 // 获取未读数量,确保只在组件挂载时请求一次

+ 36 - 2
src/store/modules/sidebar.js

@@ -1,6 +1,12 @@
 import Cookies from 'js-cookie'
 import { MessaGeUnreadMessageCount } from "@/api/InformationWrapper/index"
 
+import { defineStore } from 'pinia'
+import useUserStore from '@/store/modules/user'
+
+
+
+
 const useSidebarStore = defineStore(
     'sidebar',
     {
@@ -14,11 +20,39 @@ const useSidebarStore = defineStore(
 
       actions: {
         getOnList(badgeObj) {
-          MessaGeUnreadMessageCount().then(res=>{
+          // MessaGeUnreadMessageCount().then(res=>{
             // if(res.code == 200){
             //   this.badgeObj.xxtzGqxxtzNum = res.data;
             // }
-          })
+          // })
+          
+          const userStore = useUserStore()
+
+          // 建立 WebSocket 连接
+          const ws = new WebSocket(`ws://192.168.100.119:8080/websocket/${userStore.id}`);
+          
+          ws.onopen = () => { // 连接建立后执行
+            console.log("WebSocket connection established");
+          };
+          
+          ws.onmessage = (event) => {
+            const { data: res } = event;
+            const data = JSON.parse(res);
+
+            if  (data.type == 'msgUnreadCount') {
+              this.badgeObj.xxtzGqxxtzNum = data.data || 0;
+            }
+            
+            console.log(data, '>>>>>>>event长连接data',  this.badgeObj)
+          }
+          
+          ws.onerror = (error) => {
+            console.error("WebSocket error:", error);
+          };
+          
+          ws.onclose = () => {
+            console.log("WebSocket connection closed");
+          };
         }
       }
     }

+ 4 - 24
src/views/login.vue

@@ -3,13 +3,14 @@
     <el-form ref="loginRef" :model="loginForm" :rules="loginRules" class="login-form">
       <h3 class="title">股权后台管理系统</h3>
       <el-form-item prop="username">
-        <el-input v-model="loginForm.username" type="text" size="large" auto-complete="off" autocomplete="new-password" placeholder="账号">
+        <el-input v-model="loginForm.username" type="text" size="large" auto-complete="off" autocomplete="new-password"
+          placeholder="账号">
           <template #prefix><svg-icon icon-class="user" class="el-input__icon input-icon" /></template>
         </el-input>
       </el-form-item>
       <el-form-item prop="password">
-        <el-input v-model="loginForm.password" type="password" size="large" auto-complete="off" autocomplete="new-password" placeholder="密码"
-          @keyup.enter="handleLogin">
+        <el-input v-model="loginForm.password" type="password" size="large" auto-complete="off"
+          autocomplete="new-password" placeholder="密码" @keyup.enter="handleLogin">
           <template #prefix><svg-icon icon-class="password" class="el-input__icon input-icon" /></template>
         </el-input>
       </el-form-item>
@@ -107,27 +108,6 @@ function handleLogin() {
           return acc;
         }, {});
         router.push({ path: redirect.value || "/", query: otherQueryParams });
-
-        // 建立 WebSocket 连接
-        const ws = new WebSocket("ws://192.168.100.119:8080/websocket");
-          
-        ws.onopen = () => { // 连接建立后执行
-          console.log("WebSocket connection established");
-        };
-
-        ws.onmessage = (event) => {
-          const { data } = event;
-          console.log(data, '>>>>>>>event长连接data')
-        }
-
-        ws.onerror = (error) => {
-          console.error("WebSocket error:", error);
-        };
-
-        ws.onclose = () => {
-          console.log("WebSocket connection closed");
-        };
-	      
       }).catch(() => {
         loading.value = false;
         // 重新获取验证码

+ 1 - 1
vite.config.js

@@ -34,7 +34,7 @@ export default defineConfig(({ mode, command }) => {
           // target: 'http://192.168.100.84:8080',
           // target: 'http://1.95.212.35:8080',
           target: 'http://192.168.100.119:8080', // 王文龙代理地址
-          // target: 'http://192.168.100.145:8080', // 李荣代理地址
+          // target: 'http://192.168.100.71:8080', // 李荣代理地址
           // target: 'https://api.wzs.pub/mock/13',
           changeOrigin: true,
           rewrite: (p) => p.replace(/^\/dev-api/, '')