fix: 修改语音组件中判断isPc的逻辑 (#4854)

* fix: 修改语音组件中判断isPc的逻辑

* fix: 修改语音组件中判断isPc的逻辑

packages/web/common/system/utils.ts

@@ -16,3 +16,32 @@ export const getWebReqUrl = (url: string = '') => {
   if (!url.startsWith('/') || url.startsWith(baseUrl)) return url;
   if (!url.startsWith('/') || url.startsWith(baseUrl)) return url;
   return `${baseUrl}${url}`;
   return `${baseUrl}${url}`;
 };
 };
+
+export const isMobile = () => {
+  // 服务端渲染时返回 false
+  if (typeof window === 'undefined') return false;
+
+  // 1. 检查 User-Agent
+  const userAgent = navigator.userAgent.toLowerCase();
+  const mobileKeywords = [
+    'android',
+    'iphone',
+    'ipod',
+    'ipad',
+    'windows phone',
+    'blackberry',
+    'webos',
+    'iemobile',
+    'opera mini'
+  ];
+  const isMobileUA = mobileKeywords.some((keyword) => userAgent.includes(keyword));
+
+  // 2. 检查屏幕宽度
+  const isMobileWidth = window.innerWidth <= 900;
+
+  // 3. 检查是否支持触摸事件（排除触控屏PC）
+  const isTouchDevice = 'ontouchstart' in window || navigator.maxTouchPoints > 0;
+
+  // 综合判断：满足以下任一条件即视为移动端
+  return isMobileUA || (isMobileWidth && isTouchDevice);
+};

projects/app/src/components/core/chat/ChatContainer/ChatBox/Input/VoiceInput.tsx

@@ -16,6 +16,7 @@ import { useSystem } from '@fastgpt/web/hooks/useSystem';
 import { useContextSelector } from 'use-context-selector';
 import { useContextSelector } from 'use-context-selector';
 import { ChatBoxContext } from '../Provider';
 import { ChatBoxContext } from '../Provider';
 import MyIconButton from '@/pageComponents/account/team/OrgManage/IconButton';
 import MyIconButton from '@/pageComponents/account/team/OrgManage/IconButton';
+import { isMobile } from '@fastgpt/web/common/system/utils';
 
 
 export interface VoiceInputComponentRef {
 export interface VoiceInputComponentRef {
   onSpeak: () => void;
   onSpeak: () => void;
@@ -213,7 +214,7 @@ const MobileVoiceInput = ({
 const VoiceInput = forwardRef<VoiceInputComponentRef, VoiceInputProps>(
 const VoiceInput = forwardRef<VoiceInputComponentRef, VoiceInputProps>(
   ({ onSendMessage, resetInputVal }, ref) => {
   ({ onSendMessage, resetInputVal }, ref) => {
     const { t } = useTranslation();
     const { t } = useTranslation();
-    const { isPc } = useSystem();
+    const isPc = !isMobile();
 
 
     const outLinkAuthData = useContextSelector(ChatBoxContext, (v) => v.outLinkAuthData);
     const outLinkAuthData = useContextSelector(ChatBoxContext, (v) => v.outLinkAuthData);
     const appId = useContextSelector(ChatBoxContext, (v) => v.appId);
     const appId = useContextSelector(ChatBoxContext, (v) => v.appId);