From 7e4929e2609d1cd7cd5e29e7799b067b17af30d0 Mon Sep 17 00:00:00 2001
From: zhangyahui <yhzhang@aidlab.hk>
Date: Fri, 13 Mar 2026 13:20:37 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=A7=BB=E5=8A=A8=E7=AB=AF=E9=80=82?=
 =?UTF-8?q?=E9=85=8D=E5=B7=A5=E5=85=B7=E5=87=BD=E6=95=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/utils/flexible.js |  2 +-
 src/utils/isMobile.ts | 35 +++++++++++++++++++++++++++++++++++
 2 files changed, 36 insertions(+), 1 deletion(-)
 create mode 100644 src/utils/isMobile.ts

diff --git a/src/utils/flexible.js b/src/utils/flexible.js
index aeb5333..8b29bed 100644
--- a/src/utils/flexible.js
+++ b/src/utils/flexible.js
@@ -30,7 +30,7 @@ let flexible = (designWidth, maxWidth, minWidth) => {
       width < minWidth && (width = minWidth)
       designWidth = oldDesignWidth
     } else {
-      designWidth = 393
+      designWidth = 750
     }
     console.log(width, designWidth)
 
diff --git a/src/utils/isMobile.ts b/src/utils/isMobile.ts
new file mode 100644
index 0000000..7b2998d
--- /dev/null
+++ b/src/utils/isMobile.ts
@@ -0,0 +1,35 @@
+import { ref, onMounted, onUnmounted } from 'vue'
+
+export const useIsMobile = () => {
+  const isMobile = ref(false)
+
+  const checkDevice = () => {
+    // 1. 现代 Client Hints API（Chrome/Edge 最准）
+    if (navigator.userAgentData?.mobile !== undefined) {
+      isMobile.value = navigator.userAgentData.mobile
+      return
+    }
+
+    // 2. 综合判断（兼容所有浏览器）
+    const ua = navigator.userAgent.toLowerCase()
+    const mobileRegex = /android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i
+
+    const hasTouch = 'ontouchstart' in window || navigator.maxTouchPoints > 1
+    const smallScreen = window.innerWidth <= 768 // 你可以改成 1024 等
+
+    isMobile.value = mobileRegex.test(ua) || (hasTouch && smallScreen)
+  }
+
+  onMounted(() => {
+    checkDevice()
+    window.addEventListener('resize', checkDevice)
+    window.addEventListener('orientationchange', checkDevice) // 手机旋转必备
+  })
+
+  onUnmounted(() => {
+    window.removeEventListener('resize', checkDevice)
+    window.removeEventListener('orientationchange', checkDevice)
+  })
+
+  return { isMobile }
+}