- 问题:CDK 兑换/VIP 续费弹窗中,验证码错误或过期时错误红字显示在「兑换码」框下方, 让用户误以为是兑换码出错。 - 修复:验证码类错误(message 含「验证码」)改为在「验证码」输入行下方红字提示, 兑换码框不再误标红;验证码错误后自动刷新验证码并清空输入,便于直接重试。
This commit is contained in:
@@ -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>
|
||||
|
||||
<!-- 兑换按钮 -->
|
||||
|
||||
Reference in New Issue
Block a user