修复短信登录手机号校验
This commit is contained in:
@@ -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 label="短信验证码" required>
|
||||||
|
<Space.Compact style={{ width: '100%' }}>
|
||||||
<Form.Item
|
<Form.Item
|
||||||
label="短信验证码"
|
|
||||||
name="code"
|
name="code"
|
||||||
|
noStyle
|
||||||
rules={[{ required: true, message: '请输入短信验证码' }]}
|
rules={[{ required: true, message: '请输入短信验证码' }]}
|
||||||
>
|
>
|
||||||
<Space.Compact style={{ width: '100%' }}>
|
|
||||||
<Input
|
<Input
|
||||||
prefix={<SafetyCertificateOutlined />}
|
prefix={<SafetyCertificateOutlined />}
|
||||||
maxLength={6}
|
maxLength={6}
|
||||||
placeholder="6 位数字验证码"
|
placeholder="6 位数字验证码"
|
||||||
/>
|
/>
|
||||||
|
</Form.Item>
|
||||||
<Button
|
<Button
|
||||||
|
htmlType="button"
|
||||||
loading={loading}
|
loading={loading}
|
||||||
disabled={loginSmsCountdown > 0}
|
disabled={loginSmsCountdown > 0}
|
||||||
onClick={requestLoginSmsCode}
|
onClick={requestLoginSmsCode}
|
||||||
|
|||||||
Reference in New Issue
Block a user