接口返回错误时重置人机校验

src/components/VerificationCode/index.vue

@@ -68,7 +68,7 @@ import { useI18n } from '@/hooks/web/useI18n'
 import Snackbar from '@/plugins/snackbar'
 import Verify from '@/components/Verifition'
 
-const emits = defineEmits(['handleEnter'])
+const emits = defineEmits(['handleEnter', 'verifySuccess'])
 const { t } = useI18n()
 const props = defineProps({
   phoneDisabled: Boolean,
@@ -129,16 +129,20 @@ const emailRules = ref([
 // }
 
 // 获取验证码
+let stopHandleCode = false // 人机校验重启不自动获取短信
 const smsVerify = ref()
-const getCode = async () => {
+const getCode = async (stop = false) => {
+  stopHandleCode = stop
   // 弹出验证码 // 已开启：则展示验证码；只有完成验证码的情况，才进行登录
   smsVerify.value.show()
 }
-// const captchaVerification = ref('')
 const verifySuccess = (params) => {
-  // captchaVerification.value = params.captchaVerification
   loginData.captchaVerification = params.captchaVerification
-  handleCode()
+  if (!stopHandleCode) handleCode()
+  else emits('verifySuccess', loginData.captchaVerification)
+}
+const clearCaptcha = () => {
+  loginData.captchaVerification = ''
 }
 
 // 获取验证码
@@ -214,6 +218,8 @@ const handleEnter = () => {
 
 defineExpose({
   // resetForm, 
+  clearCaptcha, 
+  getCode, 
   loginData, 
   phoneForm
 })

src/views/login/components/editPassword.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="mt-3">
-    <PhonePage ref="phoneRef" style="width: 370px;" :phone="phone" :scene="scene" openVerify :phoneDisabled="phone ? true : false"></PhonePage>
+    <PhonePage ref="phoneRef" style="width: 370px;" :phone="phone" :scene="scene" openVerify :phoneDisabled="phone ? true : false" @verifySuccess="handleSubmit"></PhonePage>
     <v-form ref="passwordRef" style="width: 370px;">
       <v-text-field
         v-model="query.password"
@@ -88,26 +88,32 @@ const confirmPassword = computed(() => {
 })
 
 
-const handleClose = () => {
+const handleClose = (cancel = 0) => {
   query = {
     password: '',
     checkPassword: ''
   }
   passwordType.value = false
-  loading.value = false
-  emit('cancel')
+  // loading.value = false
+  if (cancel) emit('cancel')
 }
 
 // 修改
 const handleSubmit = async () => {
   const passwordValid = await passwordRef.value.validate()
   const phoneValid = await phoneRef.value.phoneForm.validate()
-  if (!passwordValid.valid || !phoneValid.valid) return
+  if (!passwordValid.valid || !phoneValid.valid) {
+    phoneRef.value.clearCaptcha()
+    return
+  }
   const data = {
+    captchaVerification: phoneRef.value.loginData.captchaVerification,
     password: query.password,
     code: phoneRef.value.loginData.code
   }
 
+  if (!data.captchaVerification) return phoneRef.value.getCode(true)
+
   // 重置密码需要手机号
   if (props.isReset) data.phone = phoneRef.value.loginData.phone
   loading.value = true
@@ -115,9 +121,10 @@ const handleSubmit = async () => {
   try {
     await api(data)
     Snackbar.success('修改成功')
-  } finally {
+    handleClose(1)
+  } catch (error) {
+    phoneRef.value.clearCaptcha()
     loading.value = false
-    handleClose()
   }
 }
 

src/views/login/components/editPasswordEnt.vue

@@ -177,9 +177,12 @@ autoTimer()
 const handleSubmit = async () => {
   const emailValid = await emailRef.value.validate()
   const passwordValid = await passwordRef.value.validate()
-  if (!emailValid.valid || !passwordValid.valid) return
+  if (!emailValid.valid || !passwordValid.valid) {
+    captchaVerification.value = false // 清空人机验证
+    return
+  }
   if (!captchaVerification.value) {
-    getCode()
+    getCode(true)
     return
   }
   const data = {
@@ -195,6 +198,7 @@ const handleSubmit = async () => {
       router.push({ path: '/login', query: { entLogin: true } })
     }, 1000);
   } catch (error) {
+    captchaVerification.value = false // 清空人机验证
     Snackbar.warning(error?.msg || error)
   } finally {
     loading.value = false
@@ -203,8 +207,10 @@ const handleSubmit = async () => {
 
 
 // 获取验证码
+let stopHandleCode = false // 人机校验重启不自动获取短信
 const entEditPasswordVerify = ref()
-const getCode = async () => {
+const getCode = async (stop = false) => {
+  stopHandleCode = stop
   // 弹出验证码 // 已开启：则展示验证码；只有完成验证码的情况，才进行登录
   entEditPasswordVerify.value.show()
 }
@@ -212,7 +218,8 @@ const getCode = async () => {
 const captchaVerification = ref(false)
 const verifySuccess = (params) => {
   captchaVerification.value = params.captchaVerification
-  handleCode()
+  if (!stopHandleCode) handleCode()
+  else handleSubmit()
 }
 </script>
 

src/views/login/index.vue

@@ -169,6 +169,8 @@ const handleLogin = async () => {
 
   } catch (err) {
     console.log(err)
+    captchaStr.value = '' // 清空人机验证
+    phoneRef.value.clearCaptcha() // 清空人机验证
     if (!err.code) return
     if (err.code === 1100017022) {
       // 密码不安全
@@ -230,10 +232,6 @@ const getCode = async () => {
 const captchaStr = ref('')
 const verifySuccess = (params) => {
   captchaStr.value = params.captchaVerification
-  // if (!isEnterpriseLogin.value && tab.value === 1 && phoneRef.value) {
-  //   nextTick(() => { phoneRef.value.handleCode() }) // 在获取验证码之前加人机验证
-  // } else {
-  // }
   handleLogin()
 }
 

src/views/recruit/enterprise/systemManagement/groupAccount/inviteConfirm.vue

@@ -23,7 +23,7 @@
           <v-btn v-if="!isMobile" class="mt-10" color="warning" to="/recruitHome">{{ $t('common.toHome') }}</v-btn>
         </div>
         <div v-else>
-          <phoneFrom ref="phoneRef" openVerify showEmailInput @handleEnter="handleLogin" class="text-left" :style="{'width': isMobile ? '100%' : '350px' }"></phoneFrom>
+          <phoneFrom ref="phoneRef" openVerify showEmailInput @handleEnter="handleLogin" @verifySuccess="handleLogin" class="text-left" :style="{'width': isMobile ? '100%' : '350px' }"></phoneFrom>
           <v-btn :loading="loginLoading" color="warning" class="white--text mt-5" min-width="350" @click="handleLogin" :style="{'width': isMobile ? '100%' : '350px' }">
             {{ $t('common.confirmJoin') }}
           </v-btn>
@@ -88,11 +88,16 @@ const handleLogin = async () => {
       getUserBaseInfos(userId)
       return
     }
+    if (!params.captchaVerification) {
+      phoneRef.value.getCode(true)
+      return
+    }
     const data = await useUserStore().handleSmsLogin(params)
     copyLoginData = params.phone + params.code.toString()
     userId = data.userId
     getUserBaseInfos(data.userId)
   } catch (error) {
+    phoneRef.value.clearCaptcha()
     const msg = error?.msg || error
     Snackbar.error(msg)
     logoutFun()
@@ -135,9 +140,10 @@ const join = async () => {
     joinSuccess.value = true
     Snackbar.success('加入成功')
   } catch (error) {
+    phoneRef.value.clearCaptcha()
     // 1.手机号绑定的userId或2.输入的邮箱已加入则不能再加入
-    Snackbar.error(error)
     // if (phoneRef.value?.resetPhone) phoneRef.value.resetForm()
+    Snackbar.error(error)
   } finally {
     if (isMobile.value) logoutFun() // 网页打开保留登录状态
     loginLoading.value = false

src/views/recruit/enterprise/systemManagement/groupAccount/inviteConfirmEnt.vue

@@ -25,7 +25,7 @@
             </v-btn>
           </div>
           <div v-show="!showCompanySelect">
-            <phoneFrom ref="phoneRef" openVerify @handleEnter="handleClick()" :style="{'width': isMobile ? '100%' : '350px' }"></phoneFrom>
+            <phoneFrom ref="phoneRef" openVerify @verifySuccess="handleConfirmJoin" :style="{'width': isMobile ? '100%' : '350px' }"></phoneFrom>
             <v-btn :loading="loginLoading" color="warning" class="white--text mt-3" min-width="350" @click="handleConfirmJoin" :style="{'width': isMobile ? '100%' : '350px' }">
               {{ quickRegister ? $t('login.register') : $t('common.confirmJoin') }}
             </v-btn>
@@ -86,16 +86,19 @@ const handleConfirmJoin = async () => {
   phoneParams = { ...phoneRef.value.loginData }
   const { valid } = await phoneRef.value.phoneForm.validate()
   if (!valid) return
+  if (!phoneParams.captchaVerification) {
+    phoneRef.value.getCode(true)
+    return
+  }
   loginLoading.value = true
   try {
     const res = await smsLogin(phoneParams)
     setToken(res.accessToken)
     setRefreshToken(res.refreshToken)
     quickRegister.value ? getApplyInfo() : getEnterpriseList()
-    // if (quickRegister.value) getApplyInfo()
-    // else getEnterpriseList()
   } catch (error) {
-    Snackbar.error('查询用户数据失败')
+    phoneRef.value.clearCaptcha()
+    Snackbar.error(error?.msg || error)
   } finally {
     loginLoading.value = false
   }
@@ -120,7 +123,7 @@ const getEnterpriseList = async() => {
       join(data[0].enterpriseId)
     }
   } catch (error) {
-    Snackbar.error('查询用户企业失败')
+    Snackbar.error(error?.msg || error)
     logoutFun()
   } finally {
     loginLoading.value = false
@@ -149,7 +152,8 @@ const join = async (enterpriseId) => {
     Snackbar.success('加入成功')
     joinSuccess.value = true
   } catch (error) {
-    Snackbar.error('加入失败! ' + error)
+    phoneRef.value.clearCaptcha()
+    Snackbar.error(error?.msg || error)
   } finally {
     loginLoading.value = false
     logoutFun()

src/views/register/person.vue

@@ -71,6 +71,7 @@ const handleRegister = async () => {
       localStorage.removeItem('loginAccount')
     } else emit('success')
   } catch (err) {
+    phoneRef.value.clearCaptcha()
     loading.value = false
   } finally {
     loading.value = false