f

src/components/AgentApplicationForm.vue

@@ -118,10 +118,15 @@
 </template>
 
 <script setup>
+import { ref, computed, nextTick } from 'vue'
 const router = useRouter();
 const show = defineModel("show");
 import { useCascaderAreaData } from "@vant/area-data";
 import { showToast } from "vant"; // 引入 showToast 方法
+import { useAliyunCaptcha } from '@/composables/useAliyunCaptcha'
+
+const { runWithCaptcha } = useAliyunCaptcha()
+
 const emit = defineEmits(); // 确保 emit 可以正确使用
 const props = defineProps({
     ancestor: {
@@ -171,20 +176,31 @@ const getSmsCode = async () => {
 
     loadingSms.value = true;
 
-    const { data, error } = await useApiFetch("auth/sendSms")
+    runWithCaptcha(
-        .post({ mobile: form.value.mobile, actionType: "agentApply" })
+        (captchaVerifyParam) =>
-        .json();
+            useApiFetch('auth/sendSms')
-
+                .post({ 
-    loadingSms.value = false;
+                    mobile: form.value.mobile, 
-
+                    actionType: 'agentApply',
-    if (data.value && !error.value) {
+                    captchaVerifyParam 
-        if (data.value.code === 200) {
+                })
-            showToast({ message: "获取成功" });
+                .json(),
-            startCountdown(); // 启动倒计时
+        (res) => {
-        } else {
+            loadingSms.value = false;
-            showToast(data.value.msg);
+            if (res.code === 200) {
+                showToast({ message: "获取成功" });
+                startCountdown();
+                nextTick(() => {
+                    const codeInput = document.querySelector('input[name="code"]');
+                    if (codeInput) {
+                        codeInput.focus();
+                    }
+                });
+            } else {
+                showToast(res.msg || "获取失败");
+            }
         }
-    }
+    );
 };
 let timer = null;
 

src/components/LoginDialog.vue

@@ -5,6 +5,9 @@ import { showToast } from 'vant'
 import ClickCaptcha from '@/components/ClickCaptcha.vue'
 import { useDialogStore } from '@/stores/dialogStore'
 import { useUserStore } from '@/stores/userStore'
+import { useAliyunCaptcha } from '@/composables/useAliyunCaptcha'
+
+const { runWithCaptcha } = useAliyunCaptcha()
 
 const emit = defineEmits(['login-success'])
 const dialogStore = useDialogStore()
@@ -47,25 +50,31 @@ async function sendVerificationCode() {
         showToast({ message: "请输入有效的手机号" });
         return
     }
-    const { data, error } = await useApiFetch('auth/sendSms')
-        .post({ mobile: phoneNumber.value, actionType: 'login' })
-        .json()
 
-    if (data.value && !error.value) {
+    runWithCaptcha(
-        if (data.value.code === 200) {
+        (captchaVerifyParam) =>
-            showToast({ message: "获取成功" });
+            useApiFetch('auth/sendSms')
-            startCountdown()
+                .post({ 
-            // 聚焦到验证码输入框
+                    mobile: phoneNumber.value, 
-            nextTick(() => {
+                    actionType: 'login',
-                const verificationCodeInput = document.getElementById('verificationCode');
+                    captchaVerifyParam 
-                if (verificationCodeInput) {
+                })
-                    verificationCodeInput.focus();
+                .json(),
-                }
+        (res) => {
-            });
+            if (res.code === 200) {
-        } else {
+                showToast({ message: "获取成功" });
-            showToast(data.value.msg)
+                startCountdown();
+                nextTick(() => {
+                    const verificationCodeInput = document.getElementById('verificationCode');
+                    if (verificationCodeInput) {
+                        verificationCodeInput.focus();
+                    }
+                });
+            } else {
+                showToast(res.msg || "获取失败");
+            }
         }
-    }
+    );
 }
 
 function startCountdown() {