diff --git a/src/components/Alarm/index.vue b/src/components/Alarm/index.vue index 26f48bc0..d1cc4576 100644 --- a/src/components/Alarm/index.vue +++ b/src/components/Alarm/index.vue @@ -2,7 +2,7 @@ - + diff --git a/src/components/Button/index.scss b/src/components/Button/index.scss index 330ee321..93ba46ef 100644 --- a/src/components/Button/index.scss +++ b/src/components/Button/index.scss @@ -45,6 +45,10 @@ button:after { display: block; } +.wjh-button-disable { + background-color: var(--wjh-color-gray) !important; +} + .wjh-button-shape-rounded { border-radius: 1000Px; } diff --git a/src/components/Button/index.vue b/src/components/Button/index.vue index 49e6ca19..93c11acb 100644 --- a/src/components/Button/index.vue +++ b/src/components/Button/index.vue @@ -1,8 +1,9 @@ @@ -15,14 +16,16 @@ type PropsType = { size?: "small" | "middle" | "large", shape?: "circle" | "rounded" | "default", block?: boolean, - color?: "green" | "yellow" | "blue" | "cyan" + color?: "green" | "yellow" | "blue" | "cyan", + disable: boolean } const props = withDefaults(defineProps(), { size: "middle", shape: "default", block: false, - color: "green" + color: "green", + disable: false }); const sizeClass = computed(() => @@ -30,7 +33,7 @@ const sizeClass = computed(() => ); const blockClass = computed(() => - props.block ? "wjh-button-block": undefined + props.block ? "wjh-button-block" : undefined ); const shapeClass = computed(() => diff --git a/src/pages/bind/YXY/index.vue b/src/pages/bind/YXY/index.vue index 1e4259e1..5bdb45d0 100644 --- a/src/pages/bind/YXY/index.vue +++ b/src/pages/bind/YXY/index.vue @@ -13,6 +13,7 @@ const phoneCode = ref(""); const helpContent = helpText.bind.yxy; const isShowHelp = ref(false); +const timeCounter = ref(0); // 获取图形验证码 const { @@ -30,10 +31,18 @@ const { manual: true, onSuccess: (res) => { if (res.data.code !== 1) { - Taro.showToast({title: res.data.msg, icon: "none"}); + Taro.showToast({ title: res.data.msg, icon: "none" }); getGraphAPI(); } else { - Taro.showToast({title: "已发送验证码", icon: "success"}); + Taro.showToast({ title: "已发送验证码", icon: "success" }); + getGraphAPI(); + graphCode.value = ""; + timeCounter.value = 60; + const timer = setInterval(() => { + timeCounter.value--; + if (timeCounter.value === 0) + clearInterval(timer); + }, 1000); } } }); @@ -49,9 +58,9 @@ const { run: loginYxyAPI } = useRequest(YxyService.loginYxy, { onSuccess: (res) => { Taro.hideLoading(); if (res.data.code !== 1) { - Taro.showToast({icon: "none", title: res.data.msg}); + Taro.showToast({ icon: "none", title: res.data.msg }); } else { - Taro.showToast({icon: "success", title: "绑定成功"}); + Taro.showToast({ icon: "success", title: "绑定成功" }); store.commit("setBindYXY", true); } }, @@ -64,13 +73,14 @@ const { run: loginYxyAPI } = useRequest(YxyService.loginYxy, { * 验证图形验证码,同时获取手机验证码 */ const handleSendGraphCode = () => { - if(graphCode.value.length && phoneNumber.value.length) + if (timeCounter.value > 0) return; + if (graphCode.value.length && phoneNumber.value.length) sendGraphAuthCodeAPI({ captcha: graphCode.value, phoneNum: phoneNumber.value }); else { - Taro.showToast({icon: "none", title: "请输入手机号和图形验证码"}); + Taro.showToast({ icon: "none", title: "请输入手机号和图形验证码" }); } }; @@ -82,7 +92,7 @@ const handleLoginYXY = () => { }); } else { - Taro.showToast({icon: "none", title: "请输入手机号和手机验证码"}); + Taro.showToast({ icon: "none", title: "请输入手机号和手机验证码" }); } }; @@ -111,26 +121,19 @@ onMounted(() => { - + 加载中... - + 点击重试 - - 获取手机验证码 + + + 获取手机验证码 + 重新发送({{ timeCounter }}) + 手机验证码 @@ -142,6 +145,12 @@ onMounted(() => { 请先下载易校园app,注册并绑定浙工大校园卡,之后在此界面用同一手机号接收验证码即可完成注册 + + tips:验证码获取存在一定的不稳定性,如果无法获取成功,请再不同时间段进行尝试 + + + 🔗 如何绑定 + 确认绑定