diff --git a/app/components/YourPuzzleComponent.vue b/app/components/YourPuzzleComponent.vue index 014f490..2a91174 100644 --- a/app/components/YourPuzzleComponent.vue +++ b/app/components/YourPuzzleComponent.vue @@ -2,7 +2,7 @@
- + +
{{ verifyTip }}
@@ -31,10 +34,7 @@
- -
- {{ verifyTip }} -
+ @@ -75,6 +75,15 @@ const verifySuccess = ref(false) const verifyError = ref(false) const verifyTip = ref('') +// 重置方法 +const reset = () => { + moveX.value = 0 + verifySuccess.value = false + verifyError.value = false + verifyTip.value = '' + isDragging.value = false +} + // DOM引用 const bgImage = ref(null) @@ -169,14 +178,18 @@ const handleMouseUp = async () => { verifySuccess.value = false verifyError.value = true verifyTip.value = '验证失败' - moveX.value = 0 // 验证失败,滑块返回原位 + } }) + } catch (error) { verifySuccess.value = false verifyError.value = true verifyTip.value = '验证失败' - moveX.value = 0 + }finally{ + setTimeout(() => { + reset() + }, 2000) } } @@ -222,8 +235,7 @@ onBeforeUnmount(() => { } .puzzle-container { - width: 100%; - max-width: 320px; + position: relative; margin: 0 auto; background: #fff; padding: 15px; diff --git a/app/components/slider-verify/slider-verify-image/de_DE/bg.png b/app/components/slider-verify/slider-verify-image/de_DE/bg.png new file mode 100644 index 0000000..3d9fb66 Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/de_DE/bg.png differ diff --git a/app/components/slider-verify/slider-verify-image/de_DE/bg_error.png b/app/components/slider-verify/slider-verify-image/de_DE/bg_error.png new file mode 100644 index 0000000..d5c0114 Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/de_DE/bg_error.png differ diff --git a/app/components/slider-verify/slider-verify-image/de_DE/error.png b/app/components/slider-verify/slider-verify-image/de_DE/error.png new file mode 100644 index 0000000..cf416ee Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/de_DE/error.png differ diff --git a/app/components/slider-verify/slider-verify-image/de_DE/success.png b/app/components/slider-verify/slider-verify-image/de_DE/success.png new file mode 100644 index 0000000..494273b Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/de_DE/success.png differ diff --git a/app/components/slider-verify/slider-verify-image/en_US/bg.png b/app/components/slider-verify/slider-verify-image/en_US/bg.png new file mode 100644 index 0000000..57fb091 Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/en_US/bg.png differ diff --git a/app/components/slider-verify/slider-verify-image/en_US/bg_error.png b/app/components/slider-verify/slider-verify-image/en_US/bg_error.png new file mode 100644 index 0000000..fb9cde1 Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/en_US/bg_error.png differ diff --git a/app/components/slider-verify/slider-verify-image/en_US/error.png b/app/components/slider-verify/slider-verify-image/en_US/error.png new file mode 100644 index 0000000..85a0b2b Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/en_US/error.png differ diff --git a/app/components/slider-verify/slider-verify-image/en_US/success.png b/app/components/slider-verify/slider-verify-image/en_US/success.png new file mode 100644 index 0000000..2a6b13e Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/en_US/success.png differ diff --git a/app/components/slider-verify/slider-verify-image/icon-button-normal.png b/app/components/slider-verify/slider-verify-image/icon-button-normal.png new file mode 100644 index 0000000..f6ad995 Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/icon-button-normal.png differ diff --git a/app/components/slider-verify/slider-verify-image/ja_JP/bg.png b/app/components/slider-verify/slider-verify-image/ja_JP/bg.png new file mode 100644 index 0000000..3720658 Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/ja_JP/bg.png differ diff --git a/app/components/slider-verify/slider-verify-image/ja_JP/bg_error.png b/app/components/slider-verify/slider-verify-image/ja_JP/bg_error.png new file mode 100644 index 0000000..80abf21 Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/ja_JP/bg_error.png differ diff --git a/app/components/slider-verify/slider-verify-image/ja_JP/error.png b/app/components/slider-verify/slider-verify-image/ja_JP/error.png new file mode 100644 index 0000000..c78245c Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/ja_JP/error.png differ diff --git a/app/components/slider-verify/slider-verify-image/ja_JP/success.png b/app/components/slider-verify/slider-verify-image/ja_JP/success.png new file mode 100644 index 0000000..256cb6d Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/ja_JP/success.png differ diff --git a/app/components/slider-verify/slider-verify-image/reload.png b/app/components/slider-verify/slider-verify-image/reload.png new file mode 100644 index 0000000..85f24ea Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/reload.png differ diff --git a/app/components/slider-verify/slider-verify-image/zh_CN/bg.png b/app/components/slider-verify/slider-verify-image/zh_CN/bg.png new file mode 100644 index 0000000..a6364dc Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/zh_CN/bg.png differ diff --git a/app/components/slider-verify/slider-verify-image/zh_CN/bg_error.png b/app/components/slider-verify/slider-verify-image/zh_CN/bg_error.png new file mode 100644 index 0000000..1cbeb01 Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/zh_CN/bg_error.png differ diff --git a/app/components/slider-verify/slider-verify-image/zh_CN/error.png b/app/components/slider-verify/slider-verify-image/zh_CN/error.png new file mode 100644 index 0000000..56ea2a1 Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/zh_CN/error.png differ diff --git a/app/components/slider-verify/slider-verify-image/zh_CN/success.png b/app/components/slider-verify/slider-verify-image/zh_CN/success.png new file mode 100644 index 0000000..2cbcd88 Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/zh_CN/success.png differ diff --git a/app/components/slider-verify/slider-verify-image/zh_TW/bg.png b/app/components/slider-verify/slider-verify-image/zh_TW/bg.png new file mode 100644 index 0000000..463b06f Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/zh_TW/bg.png differ diff --git a/app/components/slider-verify/slider-verify-image/zh_TW/bg_error.png b/app/components/slider-verify/slider-verify-image/zh_TW/bg_error.png new file mode 100644 index 0000000..34c416d Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/zh_TW/bg_error.png differ diff --git a/app/components/slider-verify/slider-verify-image/zh_TW/error.png b/app/components/slider-verify/slider-verify-image/zh_TW/error.png new file mode 100644 index 0000000..508e52a Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/zh_TW/error.png differ diff --git a/app/components/slider-verify/slider-verify-image/zh_TW/success.png b/app/components/slider-verify/slider-verify-image/zh_TW/success.png new file mode 100644 index 0000000..cab371d Binary files /dev/null and b/app/components/slider-verify/slider-verify-image/zh_TW/success.png differ diff --git a/app/components/slider-verify/slider-verify/index.vue b/app/components/slider-verify/slider-verify/index.vue new file mode 100644 index 0000000..040ce95 --- /dev/null +++ b/app/components/slider-verify/slider-verify/index.vue @@ -0,0 +1,418 @@ + + + + + \ No newline at end of file diff --git a/app/pages/login/index.vue b/app/pages/login/index.vue index 70176c7..424a1c2 100644 --- a/app/pages/login/index.vue +++ b/app/pages/login/index.vue @@ -3,7 +3,7 @@ import { useRouter, useRoute } from 'vue-router'; import Vcode from "vue3-puzzle-vcode"; import { useI18n } from 'vue-i18n' import countryCode from '../countryRegion/data/index.js' -import {senCode, userLogin,userCaptcha,userCaptchaValidate} from "@/api/auth/index.js"; +import {senCode, userLogin,userCaptcha,userCaptchaValidate,} from "@/api/auth/index.js"; import {authStore} from "@/stores/auth/index.js"; import {message} from '@/components/x-message/useMessage.js' import {fddCheck} from "~/api/goods/index.js"; @@ -14,7 +14,6 @@ const router = useRouter(); const route = useRoute(); const { locale } = useI18n() const imgs=ref([zu6020]) -console.log('zu6020'); definePageMeta({ name: 'login', @@ -93,7 +92,7 @@ const captchaUrl=ref('') const captchaVerifyUrl=ref('') const blockY=ref(0) const getCode =async () => { - +loadingRef.value.loading1=true const res=await userCaptcha({ "canvasWidth": 320, //画布的宽度(canvasWidth大于41并且(canvasWidth-10)/2 - 1> blockWidth) "canvasHeight": 191, //画布的高度(canvasHeight大于26并且 canvasHeight - blockHeight > 11 @@ -106,8 +105,9 @@ const getCode =async () => { captchaUrl.value=`data:image/png;base64,${res.data.canvasSrc}` captchaVerifyUrl.value=`data:image/png;base64,${res.data.blockSrc}` blockY.value=res.data.blockY - captcha.value=res.data.nonceStr + captcha.value.nonceStr=res.data.nonceStr isShow.value=true + loadingRef.value.loading1=false } // loadingRef.value.loading1=true // const res=await senCode({ @@ -184,16 +184,30 @@ const onClose=()=>{ isShow.value=false } const onLeave =async (moveX, callback) => { - console.log('moveX',moveX); - const res=await userCaptchaValidate({ - blockX:moveX, - nonceStr:captcha.value.nonceStr - }) - if (res.status===0){ - callback(true) - }else { - callback(false) - } + loadingRef.value.loading1=true + const res=await senCode({ + telNum:phoneNum.value, + zone:selectedZone.value, + verifyCaptcha:{ + blockX:moveX, + nonceStr:captcha.value.nonceStr + } + }) + loadingRef.value.loading1=false + if (res.status===408){ + callback(false) + getCode() + }else{ + callback(true) + setTimeout(() => { + pane.value = 1 + vanSwipeRef.value?.swipeTo(pane.value) + startCountdown(); + isShow.value=false + }, 1000) + + } + } @@ -273,7 +287,6 @@ const onLeave =async (moveX, callback) => {