v1.2.95:兑换弹窗验证码错误改为在验证码行提示,并在失败后自动刷新验证码
ci/woodpecker/tag/build Pipeline was successful

- 问题:CDK 兑换/VIP 续费弹窗中,验证码错误或过期时错误红字显示在「兑换码」框下方,
  让用户误以为是兑换码出错。
- 修复:验证码类错误(message 含「验证码」)改为在「验证码」输入行下方红字提示,
  兑换码框不再误标红;验证码错误后自动刷新验证码并清空输入,便于直接重试。
This commit is contained in:
becomer
2026-09-29 10:22:26 +08:00
parent 195702c14f
commit 7dac485769
+18 -3
View File
@@ -77,6 +77,8 @@ const captchaId = ref('')
const captchaImage = ref('')
const captchaCode = ref('')
const captchaError = ref('')
// 兑换提交时的验证码错误(与验证码获取失败 captchaError 区分;仅用于在验证码行下显示红字)
const captchaSubmitError = ref('')
// VIP 到期时间短格式(2026-10-08)
const vipExpireShort = computed(() => {
@@ -197,6 +199,7 @@ function openRedeemModal(kind: 'count' | 'vip' = 'count') {
redeemCodeText.value = ''
redeemError.value = ''
captchaCode.value = ''
captchaSubmitError.value = ''
refreshCaptcha()
}
@@ -221,11 +224,12 @@ async function handleRedeem() {
return
}
if (!captchaCode.value.trim()) {
redeemError.value = '请输入验证码'
captchaSubmitError.value = '请输入验证码'
return
}
redeemError.value = ''
captchaSubmitError.value = ''
redeeming.value = true
try {
const res = await authApi.redeemCDK(redeemCodeText.value.trim(), captchaId.value, captchaCode.value.trim())
@@ -244,7 +248,16 @@ async function handleRedeem() {
}
closeRedeemModal()
} catch (err: any) {
redeemError.value = err.response?.data?.message || '兑换失败'
const msg: string = err.response?.data?.message || '兑换失败'
// 验证码类错误显示在「验证码」行下方(而非兑换码框),避免误导用户以为兑换码出错
if (msg.includes('验证码')) {
captchaSubmitError.value = msg
captchaCode.value = ''
// 验证码错误/过期:自动刷新验证码,方便用户直接重试
refreshCaptcha()
} else {
redeemError.value = msg
}
} finally {
redeeming.value = false
}
@@ -554,7 +567,8 @@ async function handleRedeemInvite() {
<Input
v-model="captchaCode"
placeholder="输入验证码"
class="h-10 text-sm flex-1"
:class="'h-10 text-sm flex-1' + (captchaSubmitError ? ' border-red-400 ring-1 ring-red-200' : '')"
@input="captchaSubmitError = ''"
/>
<img
v-if="captchaImage"
@@ -575,6 +589,7 @@ async function handleRedeemInvite() {
加载中
</div>
</div>
<p v-if="captchaSubmitError" class="text-xs text-red-500 mt-1">{{ captchaSubmitError }}</p>
</div>
<!-- 兑换按钮 -->