修复打手短信验证码发送

apps/frontend/src/pages/worker/WorkerLoginPage.tsx

@@ -1,15 +1,25 @@
-import { LockOutlined, UserOutlined } from '@ant-design/icons'
-import { App, Button, Card, Form, Input, Tabs, Typography } from 'antd'
-import { useState } from 'react'
+import { LockOutlined, MobileOutlined, UserOutlined } from '@ant-design/icons'
+import { App, Button, Card, Form, Input, Space, Tabs, Typography } from 'antd'
+import { useEffect, useState } from 'react'
 import { Navigate, useNavigate } from 'react-router'
 
-import { loginWorker, registerWorker } from '@/services/worker'
+import { loginWorker, registerWorker, sendWorkerSmsCode } from '@/services/worker'
 import { hasWorkerSession, setWorkerSession } from '@/utils/worker-auth'
 
+const SMS_COUNTDOWN_SECONDS = 60
+
 export default function WorkerLoginPage() {
   const navigate = useNavigate()
   const { message } = App.useApp()
   const [loading, setLoading] = useState(false)
+  const [registerForm] = Form.useForm()
+  const [countdown, setCountdown] = useState(0)
+
+  useEffect(() => {
+    if (countdown <= 0) return
+    const timer = window.setInterval(() => setCountdown((value) => value - 1), 1000)
+    return () => window.clearInterval(timer)
+  }, [countdown])
 
   if (hasWorkerSession()) {
     return <Navigate to="/worker/hall" replace />
@@ -29,17 +39,40 @@ export default function WorkerLoginPage() {
     }
   }
 
+  async function requestSmsCode() {
+    const phone = String(registerForm.getFieldValue('phone') || '').trim()
+    if (!/^1[3-9]\d{9}$/.test(phone)) {
+      message.error('请先填写正确的手机号')
+      return
+    }
+    setLoading(true)
+    try {
+      const response = await sendWorkerSmsCode({ phone })
+      setCountdown(SMS_COUNTDOWN_SECONDS)
+      message.success(
+        response.data.provider === 'mock'
+          ? '验证码已发送（开发模式，验证码见服务日志）'
+          : `验证码已发送，${response.data.expiresInSeconds} 秒内有效`,
+      )
+    } catch (error) {
+      message.error(error instanceof Error ? error.message : '验证码发送失败')
+    } finally {
+      setLoading(false)
+    }
+  }
+
   async function submitRegister(values: {
-    username: string
+    phone: string
+    code: string
     password: string
     displayName?: string
-    phone?: string
     inviteCode?: string
   }) {
     setLoading(true)
     try {
       await registerWorker(values)
-      message.success('注册成功，等待后台审核')
+      message.success('注册成功，请使用手机号登录')
+      registerForm.resetFields()
     } catch (error) {
       message.error(error instanceof Error ? error.message : '注册失败')
     } finally {
@@ -52,7 +85,7 @@ export default function WorkerLoginPage() {
       <Card className="worker-auth-card" bordered={false}>
         <Typography.Title level={3}>接单平台</Typography.Title>
         <Typography.Paragraph type="secondary">
-          账号注册后需要后台审核，通过后可进入抢单大厅。
+          使用手机号验证码注册，注册后可直接进入抢单大厅。
         </Typography.Paragraph>
         <Tabs
           items={[
@@ -62,9 +95,9 @@ export default function WorkerLoginPage() {
               children: (
                 <Form layout="vertical" onFinish={submitLogin}>
                   <Form.Item
-                    label="账号"
+                    label="账号 / 手机号"
                     name="username"
-                    rules={[{ required: true, message: '请输入账号' }]}
+                    rules={[{ required: true, message: '请输入账号或手机号' }]}
                   >
                     <Input prefix={<UserOutlined />} autoComplete="username" />
                   </Form.Item>
@@ -85,18 +118,30 @@ export default function WorkerLoginPage() {
               key: 'register',
               label: '注册',
               children: (
-                <Form layout="vertical" onFinish={submitRegister}>
+                <Form form={registerForm} layout="vertical" onFinish={submitRegister}>
                   <Form.Item
-                    label="账号"
-                    name="username"
-                    rules={[{ required: true, message: '请输入账号' }]}
+                    label="手机号"
+                    name="phone"
+                    rules={[
+                      { required: true, message: '请输入手机号' },
+                      { pattern: /^1[3-9]\d{9}$/, message: '手机号格式不正确' },
+                    ]}
                   >
-                    <Input prefix={<UserOutlined />} autoComplete="username" />
+                    <Input prefix={<MobileOutlined />} autoComplete="tel" maxLength={11} />
                   </Form.Item>
-                  <Form.Item label="昵称" name="displayName">
-                    <Input />
+                  <Form.Item
+                    label="短信验证码"
+                    name="code"
+                    rules={[{ required: true, message: '请输入短信验证码' }]}
+                  >
+                    <Space.Compact style={{ width: '100%' }}>
+                      <Input placeholder="6 位数字验证码" maxLength={6} />
+                      <Button loading={loading} disabled={countdown > 0} onClick={requestSmsCode}>
+                        {countdown > 0 ? `${countdown}s 后重发` : '获取验证码'}
+                      </Button>
+                    </Space.Compact>
                   </Form.Item>
-                  <Form.Item label="手机号" name="phone">
+                  <Form.Item label="昵称（选填）" name="displayName">
                     <Input />
                   </Form.Item>
                   <Form.Item label="邀请码（选填）" name="inviteCode">

apps/frontend/src/services/worker.ts

@@ -13,11 +13,18 @@ import type {
   WorkerWalletLedger,
 } from '@/types/worker-platform'
 
+export function sendWorkerSmsCode(payload: { phone: string }) {
+  return apiPost<{ sent: boolean; expiresInSeconds: number; provider: string }>(
+    '/api/v1/worker/auth/sms-code',
+    payload,
+  )
+}
+
 export function registerWorker(payload: {
-  username: string
+  phone: string
+  code: string
   password: string
   displayName?: string
-  phone?: string
   inviteCode?: string
 }) {
   return apiPost<{ worker: WorkerUser; reviewRequired: boolean }>(