ff

src/components/BindPhoneDialog.vue

@@ -1,7 +1,9 @@
 <script setup>
 import { ref, computed, nextTick } from "vue";
 import { useDialogStore } from "@/stores/dialogStore";
+import { useAliyunCaptcha } from "@/composables/useAliyunCaptcha";
 
+const { runWithCaptcha } = useAliyunCaptcha();
 const emit = defineEmits(['bind-success'])
 const router = useRouter();
 const dialogStore = useDialogStore();
@@ -36,25 +38,33 @@ async function sendVerificationCode() {
         showToast({ message: "请输入有效的手机号" });
         return;
     }
-    const { data, error } = await useApiFetch("auth/sendSms")
-        .post({ mobile: phoneNumber.value, actionType: "bindMobile" })
-        .json();
 
-    if (data.value && !error.value) {
-        if (data.value.code === 200) {
-            showToast({ message: "获取成功" });
-            startCountdown();
-            // 聚焦到验证码输入框
-            nextTick(() => {
-                const verificationCodeInput = document.getElementById('verificationCode');
-                if (verificationCodeInput) {
-                    verificationCodeInput.focus();
-                }
-            });
-        } else {
-            showToast(data.value.msg);
+    // 使用阿里云滑块验证码
+    runWithCaptcha(
+        (captchaVerifyParam) =>
+            useApiFetch("auth/sendSms")
+                .post({ 
+                    mobile: phoneNumber.value, 
+                    actionType: "bindMobile",
+                    captchaVerifyParam 
+                })
+                .json(),
+        (res) => {
+            if (res.code === 200) {
+                showToast({ message: "获取成功" });
+                startCountdown();
+                // 聚焦到验证码输入框
+                nextTick(() => {
+                    const verificationCodeInput = document.getElementById('verificationCode');
+                    if (verificationCodeInput) {
+                        verificationCodeInput.focus();
+                    }
+                });
+            } else {
+                showToast(res.msg || "获取失败");
+            }
         }
-    }
+    );
 }
 
 function startCountdown() {

src/components/RealNameAuthDialog.vue

@@ -1,6 +1,9 @@
 <script setup>
 import { ref, computed } from "vue";
 import { useDialogStore } from "@/stores/dialogStore";
+import { useAliyunCaptcha } from "@/composables/useAliyunCaptcha";
+
+const { runWithCaptcha } = useAliyunCaptcha();
 const router = useRouter();
 const dialogStore = useDialogStore();
 const agentStore = useAgentStore();
@@ -54,18 +57,26 @@ async function sendVerificationCode() {
         showToast({ message: "请输入有效的手机号" });
         return;
     }
-    const { data, error } = await useApiFetch("auth/sendSms")
-        .post({ mobile: phoneNumber.value, actionType: "realName" })
-        .json();
 
-    if (data.value && !error.value) {
-        if (data.value.code === 200) {
-            showToast({ message: "获取成功" });
-            startCountdown();
-        } else {
-            showToast(data.value.msg);
+    // 使用阿里云滑块验证码
+    runWithCaptcha(
+        (captchaVerifyParam) =>
+            useApiFetch("auth/sendSms")
+                .post({ 
+                    mobile: phoneNumber.value, 
+                    actionType: "realName",
+                    captchaVerifyParam 
+                })
+                .json(),
+        (res) => {
+            if (res.code === 200) {
+                showToast({ message: "获取成功" });
+                startCountdown();
+            } else {
+                showToast(res.msg || "获取失败");
+            }
         }
-    }
+    );
 }
 
 function startCountdown() {