From 363fd3929832881933fe42efcbb45df15e8bf2d7 Mon Sep 17 00:00:00 2001
From: luorijun <luorijun@outlook.com>
Date: Tue, 16 Dec 2025 10:18:03 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E7=99=BB=E5=BD=95=E6=B5=81?=
 =?UTF-8?q?=E7=A8=8B=E7=8A=B6=E6=80=81=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/send-msg.tsx | 46 ++++++++++++++++++++-----------------
 1 file changed, 25 insertions(+), 21 deletions(-)

diff --git a/src/components/send-msg.tsx b/src/components/send-msg.tsx
index 052df45..89a38d9 100644
--- a/src/components/send-msg.tsx
+++ b/src/components/send-msg.tsx
@@ -4,39 +4,24 @@ import Cap from '@cap.js/widget'
 import {sendSMS} from '@/actions/verify'
 import {toast} from 'sonner'
 import {Button} from '@/components/ui/button'
+import {LoaderIcon} from 'lucide-react'
 
 export default function SendMsg(props: {
   phone: string
 }) {
   const [countdown, setCountdown] = useState(0)
   const [progress, setProgress] = useState(0)
+  const [mode, setMode] = useState<'ready' | 'wait' | 'check'>('ready')
   const cap = useRef(new Cap({apiEndpoint: '/'}))
-  cap.current.addEventListener('solve', (event) => {
-    console.log('captcha solve', event)
-  })
-  cap.current.addEventListener('error', (event) => {
-    console.error('captcha error', event)
-  })
-  cap.current.addEventListener('reset', (event) => {
-    console.log('captcha reset', event)
-  })
   cap.current.addEventListener('progress', (event) => {
     setProgress(event.detail.progress)
   })
 
-  // 计时
-  useEffect(() => {
-    const interval = setInterval(() => {
-      if (countdown > 0) {
-        setCountdown(countdown - 1)
-      }
-    }, 1000)
-    return () => clearInterval(interval)
-  }, [countdown])
-
   // 发送验证码
   const sendCode = async () => {
     try {
+      setMode('check')
+
       // 检查手机号
       const valid = /^1\d{10}$/.test(props.phone)
       if (!valid) {
@@ -58,16 +43,31 @@ export default function SendMsg(props: {
         throw new Error(`验证码发送失败: ${resp.message}`)
       }
 
+      setMode('wait')
       setCountdown(60)
       toast.success('验证码已发送')
     }
     catch (e) {
+      setMode('ready')
       toast.error('验证码发送失败', {
         description: (e as Error).message,
       })
     }
   }
 
+  // 计时
+  useEffect(() => {
+    const interval = setInterval(() => {
+      if (countdown > 0) {
+        setCountdown(countdown - 1)
+      }
+      else if (mode === 'wait') {
+        setMode('ready')
+      }
+    }, 1000)
+    return () => clearInterval(interval)
+  }, [countdown, mode])
+
   return (
     <Button
       type="button"
@@ -76,8 +76,12 @@ export default function SendMsg(props: {
       disabled={countdown > 0}
       onClick={sendCode}
     >
-      {cap.current.token ? '1' : '0'}
-      {countdown > 0 ? `${countdown}秒后重发` : '获取验证码'}
+      {mode === 'check' && <LoaderIcon className="animate-spin"/>}
+      <span>
+        {mode === 'check' && '检查登录环境'}
+        {mode === 'wait' && `${countdown}秒后重发`}
+        {mode === 'ready' && '获取验证码'}
+      </span>
     </Button>
   )
 }