diff --git a/public/img/service.jpg b/public/img/service.jpg
new file mode 100644
index 00000000..1b9f4000
Binary files /dev/null and b/public/img/service.jpg differ
diff --git a/src/components/Auth/AuthFormContent.js b/src/components/Auth/AuthFormContent.js
index 1bc06275..910ac41e 100644
--- a/src/components/Auth/AuthFormContent.js
+++ b/src/components/Auth/AuthFormContent.js
@@ -2,8 +2,8 @@
// 统一的认证表单组件 - Ant Design 版本 - 黑金主题 - Tab 切换布局
import React, { useState, useEffect, useRef } from "react";
import { useNavigate } from "react-router-dom";
-import { Form, Input, Button, Typography, Modal, message, Tooltip } from 'antd';
-import { LockOutlined, WechatOutlined, MobileOutlined, QrcodeOutlined, UserOutlined, KeyOutlined } from '@ant-design/icons';
+import { Form, Input, Button, Typography, Modal, message, Tooltip, Popover } from 'antd';
+import { LockOutlined, WechatOutlined, MobileOutlined, QrcodeOutlined, UserOutlined, KeyOutlined, CustomerServiceOutlined } from '@ant-design/icons';
import { useBreakpointValue } from "@chakra-ui/react";
import { useAuth } from "../../contexts/AuthContext";
import { useAuthModal } from "../../hooks/useAuthModal";
@@ -15,7 +15,7 @@ import WechatRegister from './WechatRegister';
import { logger } from '../../utils/logger';
import { getApiBase } from '../../utils/apiConfig';
import { useAuthEvents } from '../../hooks/useAuthEvents';
-import { isWeChatBrowser } from '../MiniProgramLauncher/hooks/useWechatEnvironment';
+import { isWeChatBrowser, isMobileDevice } from '../MiniProgramLauncher/hooks/useWechatEnvironment';
const { Link } = Typography;
@@ -192,10 +192,15 @@ export default function AuthFormContent() {
// 检测是否在微信浏览器中
const isInWeChatBrowser = isWeChatBrowser();
+ // 检测是否为移动端设备
+ const isMobileEnv = isMobileDevice();
+ // 移动端非微信浏览器（如 iPhone Chrome）- 不支持微信登录
+ const isMobileNonWechat = isMobileEnv && !isInWeChatBrowser;
// Tab 状态: 'wechat' | 'phone' | 'password'
// 如果在微信浏览器中，默认显示 phone tab（因为微信 tab 会显示 H5 登录按钮）
- const [activeTab, setActiveTab] = useState(isInWeChatBrowser ? 'phone' : 'wechat');
+ // 如果在移动端非微信浏览器中，默认显示 phone tab（不支持微信登录）
+ const [activeTab, setActiveTab] = useState((isInWeChatBrowser || isMobileNonWechat) ? 'phone' : 'wechat');
// 表单状态
const [isLoading, setIsLoading] = useState(false);
@@ -724,15 +729,16 @@ export default function AuthFormContent() {
// 根据当前 Tab 决定显示哪些其他登录方式
const otherMethods = [];
- if (activeTab !== 'wechat') {
+ // 移动端非微信浏览器不显示微信登录选项（无法使用）
+ if (activeTab !== 'wechat' && !isMobileNonWechat) {
otherMethods.push({
key: 'wechat',
label: isInWeChatBrowser ? '微信一键' : '微信',
icon: ,
color: THEME.wechat,
hoverBg: 'rgba(7, 193, 96, 0.1)',
- // 微信浏览器内直接调用H5登录，否则切换到微信Tab
- onClick: isInWeChatBrowser ? handleWechatH5Login : (isMobile ? handleWechatH5Login : () => handleTabChange('wechat')),
+ // 微信浏览器内直接调用H5登录，PC端切换到微信Tab显示二维码
+ onClick: isInWeChatBrowser ? handleWechatH5Login : () => handleTabChange('wechat'),
});
}
@@ -789,24 +795,40 @@ export default function AuthFormContent() {
// 获取右上角折角的颜色（根据要切换到的登录方式）
const getCornerColor = () => {
+ // 移动端非微信浏览器：只在微信Tab和手机Tab之间切换（手机Tab -> 密码Tab）
+ if (isMobileNonWechat) {
+ return activeTab === 'phone' ? THEME.textSecondary : THEME.goldPrimary;
+ }
// 微信 Tab -> 显示手机颜色（金色），手机/密码 Tab -> 显示微信颜色（绿色）
return activeTab === 'wechat' ? THEME.goldPrimary : THEME.wechat;
};
// 获取右上角图标
const getCornerIcon = () => {
+ // 移动端非微信浏览器：手机Tab显示密码图标，密码Tab显示手机图标
+ if (isMobileNonWechat) {
+ return activeTab === 'phone' ? : ;
+ }
// 微信 Tab -> 显示手机图标，手机/密码 Tab -> 显示二维码图标
return activeTab === 'wechat' ? : ;
};
// 获取右上角切换的目标 Tab
const getCornerTargetTab = () => {
+ // 移动端非微信浏览器：在手机和密码之间切换
+ if (isMobileNonWechat) {
+ return activeTab === 'phone' ? 'password' : 'phone';
+ }
// 微信 Tab -> 切换到手机，手机/密码 Tab -> 切换到微信
return activeTab === 'wechat' ? 'phone' : 'wechat';
};
// 获取右上角提示文字
const getCornerTooltip = () => {
+ // 移动端非微信浏览器
+ if (isMobileNonWechat) {
+ return activeTab === 'phone' ? '切换到密码登录' : '切换到验证码登录';
+ }
if (activeTab === 'wechat') return '切换到验证码登录';
return isInWeChatBrowser ? '切换到微信一键登录' : '切换到微信登录';
};
@@ -859,6 +881,51 @@ export default function AuthFormContent() {
{/* 底部其他登录方式 */}
{renderBottomDivider()}
+ {/* 客服联系 */}
+
+
+ 
+
+ 扫码添加企业微信客服
+
+