修复短信登录手机号校验

This commit is contained in:
yml2213
2026-08-20 16:13:07 +08:00
parent 01a1f0cc93
commit 218ee1577e
@@ -19,8 +19,9 @@ import {
Table, Table,
Tabs, Tabs,
Typography, Typography,
type InputRef,
} from 'antd' } from 'antd'
import { useEffect, useState } from 'react' import { useEffect, useRef, useState } from 'react'
import { Navigate, useNavigate } from 'react-router' import { Navigate, useNavigate } from 'react-router'
import { import {
@@ -64,11 +65,13 @@ export default function WorkerLoginPage() {
const [loading, setLoading] = useState(false) const [loading, setLoading] = useState(false)
const [registerForm] = Form.useForm() const [registerForm] = Form.useForm()
const [loginSmsForm] = Form.useForm<{ phone: string; code: string }>() const [loginSmsForm] = Form.useForm<{ phone: string; code: string }>()
const loginSmsPhoneInputRef = useRef<InputRef>(null)
const [resetForm] = Form.useForm<{ phone: string; code: string; password: string }>() const [resetForm] = Form.useForm<{ phone: string; code: string; password: string }>()
const [deviceForm] = Form.useForm<{ username: string; password: string }>() const [deviceForm] = Form.useForm<{ username: string; password: string }>()
const [countdown, setCountdown] = useState(0) const [countdown, setCountdown] = useState(0)
const [loginSmsCountdown, setLoginSmsCountdown] = useState(0) const [loginSmsCountdown, setLoginSmsCountdown] = useState(0)
const [loginMode, setLoginMode] = useState<'password' | 'sms'>('password') const [loginMode, setLoginMode] = useState<'password' | 'sms'>('password')
const [loginSmsPhone, setLoginSmsPhone] = useState('')
const [resetCountdown, setResetCountdown] = useState(0) const [resetCountdown, setResetCountdown] = useState(0)
const [forgotPasswordOpen, setForgotPasswordOpen] = useState(false) const [forgotPasswordOpen, setForgotPasswordOpen] = useState(false)
const [deviceManagerOpen, setDeviceManagerOpen] = useState(false) const [deviceManagerOpen, setDeviceManagerOpen] = useState(false)
@@ -129,7 +132,7 @@ export default function WorkerLoginPage() {
} }
async function requestLoginSmsCode() { async function requestLoginSmsCode() {
const phone = String(loginSmsForm.getFieldValue('phone') || '').trim() const phone = getLoginSmsPhone()
if (!/^1[3-9]\d{9}$/.test(phone)) { if (!/^1[3-9]\d{9}$/.test(phone)) {
message.error('请先填写正确的手机号') message.error('请先填写正确的手机号')
return return
@@ -153,7 +156,7 @@ export default function WorkerLoginPage() {
async function submitSmsLogin(values: { phone: string; code: string }) { async function submitSmsLogin(values: { phone: string; code: string }) {
setLoading(true) setLoading(true)
try { try {
const response = await loginWorkerBySmsCode(values) const response = await loginWorkerBySmsCode({ ...values, phone: getLoginSmsPhone() })
setWorkerSession(response.data.token, response.data.expiresAt, response.data.worker) setWorkerSession(response.data.token, response.data.expiresAt, response.data.worker)
message.success('登录成功') message.success('登录成功')
void navigate('/hall', { replace: true }) void navigate('/hall', { replace: true })
@@ -164,6 +167,10 @@ export default function WorkerLoginPage() {
} }
} }
function getLoginSmsPhone() {
return String(loginSmsPhoneInputRef.current?.input?.value || loginSmsPhone).trim()
}
async function loadManagedDevices(values?: { username: string; password: string }) { async function loadManagedDevices(values?: { username: string; password: string }) {
const credentials = values || deviceForm.getFieldsValue() const credentials = values || deviceForm.getFieldsValue()
if (!credentials.username || !credentials.password) { if (!credentials.username || !credentials.password) {
@@ -406,23 +413,29 @@ export default function WorkerLoginPage() {
]} ]}
> >
<Input <Input
ref={loginSmsPhoneInputRef}
prefix={<MobileOutlined />} prefix={<MobileOutlined />}
maxLength={11} maxLength={11}
placeholder="注册时使用的手机号" placeholder="注册时使用的手机号"
value={loginSmsPhone}
onChange={(event) => setLoginSmsPhone(event.target.value)}
/> />
</Form.Item> </Form.Item>
<Form.Item <Form.Item label="短信验证码" required>
label="短信验证码"
name="code"
rules={[{ required: true, message: '请输入短信验证码' }]}
>
<Space.Compact style={{ width: '100%' }}> <Space.Compact style={{ width: '100%' }}>
<Input <Form.Item
prefix={<SafetyCertificateOutlined />} name="code"
maxLength={6} noStyle
placeholder="6 位数字验证码" rules={[{ required: true, message: '请输入短信验证码' }]}
/> >
<Input
prefix={<SafetyCertificateOutlined />}
maxLength={6}
placeholder="6 位数字验证码"
/>
</Form.Item>
<Button <Button
htmlType="button"
loading={loading} loading={loading}
disabled={loginSmsCountdown > 0} disabled={loginSmsCountdown > 0}
onClick={requestLoginSmsCode} onClick={requestLoginSmsCode}