优化 PWA 安装提示组件

src/composables/usePWAInstall.ts

@@ -25,10 +25,10 @@ export function usePWAInstall() {
     const isFullscreen = window.matchMedia('(display-mode: fullscreen)').matches
     const isMinimalUI = window.matchMedia('(display-mode: minimal-ui)').matches
     const isWindowControlsOverlay = window.matchMedia('(display-mode: window-controls-overlay)').matches
-    
+
     // iOS Safari特殊检查
     const isIOSStandalone = (window.navigator as any).standalone === true
-    
+
     return isStandalone || isFullscreen || isMinimalUI || isWindowControlsOverlay || isIOSStandalone
   }
 
@@ -42,18 +42,18 @@ export function usePWAInstall() {
     try {
       // 显示浏览器的安装提示
       await installPrompt.value.prompt()
-      
+
       // 等待用户响应
       const { outcome } = await installPrompt.value.userChoice
       installOutcome.value = outcome
-      
+
       // 如果用户接受安装，清除安装提示
       if (outcome === 'accepted') {
         isInstallable.value = false
         installPrompt.value = null
         isInstalled.value = true
       }
-      
+
       return outcome === 'accepted'
     } catch (error) {
       console.error('Failed to show install prompt:', error)
@@ -65,7 +65,7 @@ export function usePWAInstall() {
   const handleBeforeInstallPrompt = (e: BeforeInstallPromptEvent) => {
     // 阻止默认行为
     e.preventDefault()
-    
+
     // 保存安装提示
     installPrompt.value = e
     isInstallable.value = true
@@ -103,48 +103,48 @@ export function usePWAInstall() {
 
     if (isIOS && isSafari) {
       return {
-        platform: 'iOS Safari',
-        steps: [
-          '点击浏览器底部的分享按钮',
-          '向下滑动并点击"添加到主屏幕"',
-          '点击右上角的"添加"',
-        ],
+        platform: 'ios',
+        platformKey: 'ios',
       }
     } else if (isAndroid && isChrome) {
       return {
-        platform: 'Android Chrome',
-        steps: [
-          '点击浏览器右上角的菜单按钮（三个点）',
-          '选择"添加到主屏幕"',
-          '点击"添加"确认',
-        ],
+        platform: 'android',
+        platformKey: 'android',
       }
     } else if (isEdge) {
       return {
-        platform: 'Microsoft Edge',
-        steps: [
-          '点击地址栏右侧的安装按钮',
-          '或点击菜单中的"应用" > "安装此站点"',
-          '点击"安装"确认',
-        ],
+        platform: 'edge',
+        platformKey: 'edge',
       }
     } else if (isFirefox && isAndroid) {
       return {
-        platform: 'Firefox Android',
-        steps: [
-          '点击浏览器右上角的菜单按钮',
-          '选择"安装"',
-          '点击"添加到主屏幕"',
-        ],
+        platform: 'firefox',
+        platformKey: 'android', // Firefox on Android uses similar steps to Chrome
+      }
+    } else if (isFirefox) {
+      return {
+        platform: 'firefox',
+        platformKey: 'firefox',
+      }
+    } else if (isChrome) {
+      return {
+        platform: 'chrome',
+        platformKey: 'chrome',
+      }
+    } else if (isSafari) {
+      return {
+        platform: 'safari',
+        platformKey: 'safari',
+      }
+    } else if (isAndroid) {
+      return {
+        platform: 'mobile',
+        platformKey: 'mobile',
       }
     } else {
       return {
-        platform: '您的浏览器',
-        steps: [
-          '查看浏览器的菜单或设置',
-          '寻找"安装应用"或"添加到主屏幕"选项',
-          '按照提示完成安装',
-        ],
+        platform: 'desktop',
+        platformKey: 'desktop',
       }
     }
   }
@@ -152,16 +152,16 @@ export function usePWAInstall() {
   onMounted(() => {
     // 检查是否已安装
     isInstalled.value = checkIfInstalled()
-    
+
     // 监听安装提示事件
     window.addEventListener('beforeinstallprompt', handleBeforeInstallPrompt)
-    
+
     // 监听安装成功事件
     window.addEventListener('appinstalled', handleAppInstalled)
-    
+
     // 监听display-mode变化
     const mediaQuery = window.matchMedia('(display-mode: standalone)')
-    mediaQuery.addEventListener('change', (e) => {
+    mediaQuery.addEventListener('change', e => {
       isInstalled.value = e.matches
     })
   })
@@ -179,4 +179,4 @@ export function usePWAInstall() {
     showInstallPrompt,
     getInstallInstructions,
   }
-}
+}

src/composables/useRecentPlugins.ts

@@ -50,7 +50,7 @@ export function useRecentPlugins() {
       // 按访问时间倒序排列
       return recentPlugins.sort((a, b) => b.access_time - a.access_time).map(recentPluginToPlugin)
     } catch (error) {
-      console.error('获取最近访问插件失败:', error)
+      console.error(error)
       return []
     }
   }
@@ -76,7 +76,7 @@ export function useRecentPlugins() {
 
       localStorage.setItem(RECENT_PLUGINS_KEY, JSON.stringify(recentPlugins))
     } catch (error) {
-      console.error('保存最近访问插件失败:', error)
+      console.error(error)
     }
   }
 
@@ -85,7 +85,7 @@ export function useRecentPlugins() {
     try {
       localStorage.removeItem(RECENT_PLUGINS_KEY)
     } catch (error) {
-      console.error('清除最近访问插件失败:', error)
+      console.error(error)
     }
   }
 
@@ -100,7 +100,7 @@ export function useRecentPlugins() {
 
       localStorage.setItem(RECENT_PLUGINS_KEY, JSON.stringify(recentPlugins))
     } catch (error) {
-      console.error('移除最近访问插件失败:', error)
+      console.error(error)
     }
   }