From a121c2973542e851d7b429e812320af0119d7f1b Mon Sep 17 00:00:00 2001
From: liuzhi <1306086303@qq.com>
Date: Tue, 18 Mar 2025 17:52:51 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E5=BF=98=E8=AE=B0?=
 =?UTF-8?q?=E5=AF=86=E7=A0=81=E4=BF=AE=E6=94=B9=E6=8A=A5=E9=94=99=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/login/components/email/index.vue    |  5 +---
 src/views/login/components/password/index.vue | 25 +++++++++++++++---
 src/views/login/components/phone/index.vue    | 26 +++++++------------
 3 files changed, 33 insertions(+), 23 deletions(-)

diff --git a/src/views/login/components/email/index.vue b/src/views/login/components/email/index.vue
index 9067803..3f22211 100644
--- a/src/views/login/components/email/index.vue
+++ b/src/views/login/components/email/index.vue
@@ -9,7 +9,6 @@
     @submit="handleLogin"
   >
     <a-form-item field="email" hide-label>
-      <!-- <a-input v-model="form.email" placeholder="请输入邮箱" allow-clear /> -->
       <a-input ref="inputRefd" v-model="form.email" placeholder="请输入邮箱" allow-clear @input="validatePhone">
         <template #prefix>
           <icon-email />
@@ -17,7 +16,6 @@
       </a-input>
     </a-form-item>
     <a-form-item field="captcha" hide-label>
-      <!-- <a-input v-model="form.captcha" placeholder="请输入验证码" :max-length="6" allow-clear style="flex: 1 1" /> -->
       <a-input v-model="form.captcha" placeholder="请输入验证码" :max-length="6" allow-clear style="flex: 1 1">
         <template #prefix>
           <icon-safe />
@@ -35,7 +33,6 @@
     </a-form-item>
     <a-form-item>
       <a-space direction="vertical" fill class="w-full">
-        <!-- <a-button disabled class="btn" type="primary" :loading="loading" html-type="submit" size="large" long>立即登录</a-button> -->
         <a-button class="btn" type="primary" :loading="loading" html-type="submit" size="large" long>立 即 登 录</a-button>
       </a-space>
     </a-form-item>
@@ -52,7 +49,6 @@
 <script setup lang="ts">
 import { type FormInstance, Message } from '@arco-design/web-vue'
 import { type BehaviorCaptchaReq, getEmailCaptcha } from '@/apis'
-// import { type BehaviorCaptchaReq, getEmailCaptcha } from '@/apis'
 import { useTabsStore, useUserStore } from '@/stores'
 import * as Regexp from '@/utils/regexp'
 import { timeFix } from '@/utils'
@@ -103,6 +99,7 @@ const onCaptcha = async () => {
   if (isInvalid) return
   VerifyRef.value.show()
 }
+
 // 获取验证码
 const getCaptcha = async (captchaReq: BehaviorCaptchaReq) => {
   if (captchaLoading.value) return
diff --git a/src/views/login/components/password/index.vue b/src/views/login/components/password/index.vue
index 46b20dc..41e51b4 100644
--- a/src/views/login/components/password/index.vue
+++ b/src/views/login/components/password/index.vue
@@ -32,7 +32,7 @@
       </a-input>
       <a-button
         class="captcha-btn" :loading="captchaLoading" :disabled="!captchaDisable" size="large"
-        @click="onCaptcha({})"
+        @click="onCaptcha"
       >
         {{ captchaBtnName }}
       </a-button>
@@ -42,6 +42,13 @@
         <a-button class="btn" type="primary" :loading="loading" html-type="submit" size="large" long>立 即 修 改</a-button>
       </a-space>
     </a-form-item>
+    <Verify
+      ref="VerifyRef"
+      :captcha-type="captchaType"
+      :mode="captchaMode"
+      :img-size="{ width: '330px', height: '155px' }"
+      @success="getCaptcha"
+    />
   </a-form>
 </template>
 
@@ -75,6 +82,11 @@ const rules: FormInstance['rules'] = {
   captcha: [{ required: true, message: '请输入验证码' }],
 }
 
+const VerifyRef = ref<InstanceType<any>>()
+const captchaType = ref('blockPuzzle')
+const captchaMode = ref('pop')
+const captchaLoading = ref(false)
+
 const captchaTimer = ref()
 const captchaTime = ref(60)
 const captchaBtnName = ref('获取验证码')
@@ -94,9 +106,16 @@ const resetCaptcha = () => {
   captchaDisable.value = true
 }
 
-const captchaLoading = ref(false)
+// 弹出行为验证码
+const onCaptcha = async () => {
+  if (captchaLoading.value) return
+  const isInvalid = await formRef.value?.validateField('email')
+  if (isInvalid) return
+  VerifyRef.value.show()
+}
+
 // 获取验证码
-const onCaptcha = async (captchaReq: BehaviorCaptchaReq) => {
+const getCaptcha = async (captchaReq: BehaviorCaptchaReq) => {
   if (captchaLoading.value) return
   const isInvalid = await formRef.value?.validateField('email')
   if (isInvalid) return
diff --git a/src/views/login/components/phone/index.vue b/src/views/login/components/phone/index.vue
index 89c37d1..8847460 100644
--- a/src/views/login/components/phone/index.vue
+++ b/src/views/login/components/phone/index.vue
@@ -9,11 +9,6 @@
     @submit="handleLogin"
   >
     <a-form-item field="phone" hide-label>
-      <!-- <a-input v-model="form.phone" placeholder="请输入手机号" :max-length="11" allow-clear>
-        <template #prefix>
-          <icon-phone />
-        </template>
-      </a-input> -->
       <a-space direction="vertical" size="mini">
         <a-input-group>
           <a-select
@@ -71,7 +66,6 @@ import { type FormInstance, Message } from '@arco-design/web-vue'
 import axios from 'axios'
 import { countryNameMap } from './code'
 import type { BehaviorCaptchaReq } from '@/apis'
-// import { type BehaviorCaptchaReq, getSmsCaptcha } from '@/apis'
 import { useTabsStore, useUserStore } from '@/stores'
 import * as Regexp from '@/utils/regexp'
 import { getSmsCaptcha } from '@/apis'
@@ -143,15 +137,6 @@ const VerifyRef = ref<InstanceType<any>>()
 const captchaType = ref('blockPuzzle')
 const captchaMode = ref('pop')
 const captchaLoading = ref(false)
-// 弹出行为验证码
-const onCaptcha = async () => {
-  if (captchaLoading.value) return
-  const isInvalid = await formRef.value?.validateField('phone')
-  if (isInvalid) return
-  // 重置行为参数
-  VerifyRef.value.instance.refresh()
-  VerifyRef.value.show()
-}
 
 const captchaTimer = ref()
 const captchaTime = ref(60)
@@ -172,8 +157,17 @@ const resetCaptcha = () => {
   captchaDisable.value = true
 }
 
-// 获取验证码
+// 弹出行为验证码
+const onCaptcha = async () => {
+  if (captchaLoading.value) return
+  const isInvalid = await formRef.value?.validateField('phone')
+  if (isInvalid) return
+  // 重置行为参数
+  VerifyRef.value.instance.refresh()
+  VerifyRef.value.show()
+}
 
+// 获取验证码
 const getCaptcha = async (captchaReq: BehaviorCaptchaReq) => {
   try {
     captchaLoading.value = true