From 8471fb104f02c65a3e7b8024af30fb3d29c884e4 Mon Sep 17 00:00:00 2001
From: log1997 <2694233102@qq.com>
Date: Fri, 9 Jan 2026 17:34:13 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E2=9C=A8=20=E6=89=8B=E6=9C=BA=E7=AB=AF?=
 =?UTF-8?q?=E8=AE=BF=E9=97=AE=E4=BA=8C=E7=BB=B4=E7=A0=81=E5=8F=97websocket?=
 =?UTF-8?q?=E8=BF=9E=E6=8E=A5=E7=8A=B6=E6=80=81=E6=8E=A7=E5=88=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layout/RightButton/index.vue        |  8 +++++++-
 src/store/serverConfig.ts               | 10 ++++++++++
 src/views/Config/Server/useViewModel.ts | 15 ++++++++++++++-
 3 files changed, 31 insertions(+), 2 deletions(-)

diff --git a/src/layout/RightButton/index.vue b/src/layout/RightButton/index.vue
index f1f6f9b..c83edce 100644
--- a/src/layout/RightButton/index.vue
+++ b/src/layout/RightButton/index.vue
@@ -2,13 +2,19 @@
 import { useFullscreen } from '@vueuse/core'
 import { useQRCode } from '@vueuse/integrations/useQRCode'
 import { Maximize, Minimize, TabletSmartphone } from 'lucide-vue-next'
+import { storeToRefs } from 'pinia'
 import { onMounted, ref, shallowRef, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useRoute, useRouter } from 'vue-router'
 import CustomDialog from '@/components/Dialog/index.vue'
+import useStore from '@/store'
 import { getOriginUrl, getUniqueSignature } from '@/utils/auth'
 import { usePlayMusic } from './usePlayMusic'
 
+const serverConfig = useStore().serverConfig
+const {
+    getServerStatus: serverStatus,
+} = storeToRefs(serverConfig)
 const { playMusic, currentMusic, nextPlay } = usePlayMusic()
 const { isFullscreen, toggle: toggleScreen } = useFullscreen()
 const { t } = useI18n()
@@ -110,7 +116,7 @@ onMounted(() => {
         <svg-icon :name="currentMusic.paused ? 'play' : 'pause'" />
       </div>
     </div>
-    <div class="tooltip tooltip-left" data-tip="访问手机端">
+    <div v-if="serverStatus" class="tooltip tooltip-left" data-tip="访问手机端">
       <div class="flex items-center justify-center w-10 h-10 p-0 m-0 cursor-pointer setting-container bg-slate-500/50 rounded-l-xl hover:bg-slate-500/80 hover:text-blue-400/90" @click="openMobileQrCode">
         <TabletSmartphone />
       </div>
diff --git a/src/store/serverConfig.ts b/src/store/serverConfig.ts
index 89ad8c6..1c4303b 100644
--- a/src/store/serverConfig.ts
+++ b/src/store/serverConfig.ts
@@ -8,6 +8,7 @@ export const useServerConfig = defineStore('server', {
             serverConfig: {
                 serverList: defaultServerHostList,
                 currentServer: defaultServerHostList[0],
+                serverStatus: false,
             },
         }
     },
@@ -20,6 +21,10 @@ export const useServerConfig = defineStore('server', {
         getCurrentServer(state) {
             return state.serverConfig.currentServer
         },
+        // 获取服务器状态
+        getServerStatus(state) {
+            return state.serverConfig.serverStatus
+        },
 
     },
     actions: {
@@ -36,11 +41,16 @@ export const useServerConfig = defineStore('server', {
         setCurrentServer(userServer: ServerType) {
             this.serverConfig.currentServer = userServer
         },
+        // 设置服务器状态
+        setServerStatus(status: boolean) {
+            this.serverConfig.serverStatus = status
+        },
         // 重置所有配置
         resetDefault() {
             this.serverConfig = {
                 serverList: defaultServerHostList,
                 currentServer: defaultServerHostList[0],
+                serverStatus: false,
             }
         },
     },
diff --git a/src/views/Config/Server/useViewModel.ts b/src/views/Config/Server/useViewModel.ts
index ce66994..b3ee5f0 100644
--- a/src/views/Config/Server/useViewModel.ts
+++ b/src/views/Config/Server/useViewModel.ts
@@ -9,7 +9,10 @@ import { IndexDb } from '@/utils/dexie'
 
 export function useViewModel() {
     const serverConfig = useStore().serverConfig
-    const { getServerList: serverList, getCurrentServer: currentServer } = storeToRefs(serverConfig)
+    const {
+        getServerList: serverList,
+        getCurrentServer: currentServer,
+    } = storeToRefs(serverConfig)
     const currentServerValue = ref<ServerType>(cloneDeep(currentServer.value))
     const wsUrl = ref<string>('ws://localhost:8080/echo')
     const msgList = ref<WsMsgData[]>([])
@@ -41,6 +44,16 @@ export function useViewModel() {
         currentServerValue.value.host = newValue
         serverConfig.updateServerList(currentServerValue.value)
     })
+
+    watch(
+        () => wsStatus.value,
+        (newValue) => {
+            if (newValue && (newValue.connected === true || newValue.connected === false)) {
+                serverConfig.setServerStatus(newValue.connected)
+            }
+        },
+    )
+
     onMounted(() => {
         getAllMsg()
     })