vf/vf_react
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update pay promo

Browse Source
This commit is contained in:
zzlgreat
2026-02-04 11:13:10 +08:00
parent 552b5d99aa
commit f05afe7b8a
1 changed files with 66 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

101
src/components/Auth/AuthFormContent.js
View File

@@ -190,7 +190,8 @@ export default function AuthFormContent() {
const wechatRef = useRef(null);
// Tab 状态: 'wechat' | 'phone'
const [activeTab, setActiveTab] = useState('wechat');
// 默认使用手机号登录
const [activeTab, setActiveTab] = useState('phone');
// 表单状态
const [isLoading, setIsLoading] = useState(false);
@@ -638,17 +639,6 @@ export default function AuthFormContent() {
// 根据当前 tab 显示其他两种登录方式
const otherOptions = [];
if (activeTab !== 'wechat') {
otherOptions.push({
key: 'wechat',
icon: <WechatOutlined />,
label: '微信',
color: THEME.wechat,
hoverBg: 'rgba(7, 193, 96, 0.1)',
onClick: isMobile ? handleWechatH5Login : () => handleTabChange('wechat'),
});
}
if (activeTab !== 'phone') {
otherOptions.push({
key: 'phone',
@@ -671,31 +661,72 @@ export default function AuthFormContent() {
});
}
// 微信登录单独渲染，更加醒目
const showWechatButton = activeTab !== 'wechat';
return (
<div style={styles.bottomDivider}>
<div style={styles.dividerLine} />
<div style={styles.otherLoginWrapper}>
<span>其他登录方式:</span>
{otherOptions.map((option) => (
<span
key={option.key}
style={{
...styles.otherLoginIcon,
color: option.color,
}}
onClick={option.onClick}
onMouseEnter={(e) => {
e.currentTarget.style.background = option.hoverBg;
}}
onMouseLeave={(e) => {
e.currentTarget.style.background = 'transparent';
}}
>
{option.icon} {option.label}
<div style={{ marginTop: '24px' }}>
{/* 微信登录按钮 - 更显眼 */}
{showWechatButton && (
<div
style={{
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
gap: '8px',
padding: '12px 20px',
marginBottom: '16px',
background: 'rgba(7, 193, 96, 0.1)',
border: '1px solid rgba(7, 193, 96, 0.3)',
borderRadius: '8px',
cursor: 'pointer',
transition: 'all 0.2s ease',
}}
onClick={isMobile ? handleWechatH5Login : () => handleTabChange('wechat')}
onMouseEnter={(e) => {
e.currentTarget.style.background = 'rgba(7, 193, 96, 0.2)';
e.currentTarget.style.borderColor = 'rgba(7, 193, 96, 0.5)';
}}
onMouseLeave={(e) => {
e.currentTarget.style.background = 'rgba(7, 193, 96, 0.1)';
e.currentTarget.style.borderColor = 'rgba(7, 193, 96, 0.3)';
}}
>
<WechatOutlined style={{ fontSize: '20px', color: THEME.wechat }} />
<span style={{ color: THEME.wechat, fontWeight: 500 }}>
微信扫码登录
</span>
))}
</div>
<div style={styles.dividerLine} />
</div>
)}
{/* 其他登录方式 */}
{otherOptions.length > 0 && (
<div style={styles.bottomDivider}>
<div style={styles.dividerLine} />
<div style={styles.otherLoginWrapper}>
<span>其他方式:</span>
{otherOptions.map((option) => (
<span
key={option.key}
style={{
...styles.otherLoginIcon,
color: option.color,
}}
onClick={option.onClick}
onMouseEnter={(e) => {
e.currentTarget.style.background = option.hoverBg;
}}
onMouseLeave={(e) => {
e.currentTarget.style.background = 'transparent';
}}
>
{option.icon} {option.label}
</span>
))}
</div>
<div style={styles.dividerLine} />
</div>
)}
</div>
);
};