fix: 恢复登录手机号和短信倒计时
This commit is contained in:
@@ -21,6 +21,7 @@ const emit = defineEmits<{
|
|||||||
|
|
||||||
const COUNTDOWN_SECONDS = 60;
|
const COUNTDOWN_SECONDS = 60;
|
||||||
const COUNTDOWN_PREFIX = "ai-kb-sms-countdown:";
|
const COUNTDOWN_PREFIX = "ai-kb-sms-countdown:";
|
||||||
|
const PHONE_STORAGE_KEY = "ai-kb-login-phone";
|
||||||
const PHONE_PATTERN = /^1[3-9]\d{9}$/;
|
const PHONE_PATTERN = /^1[3-9]\d{9}$/;
|
||||||
|
|
||||||
const phone = ref("");
|
const phone = ref("");
|
||||||
@@ -56,7 +57,11 @@ const sendButtonText = computed(() => {
|
|||||||
let countdownTimer: ReturnType<typeof setInterval> | null = null;
|
let countdownTimer: ReturnType<typeof setInterval> | null = null;
|
||||||
let toastTimer: ReturnType<typeof setTimeout> | null = null;
|
let toastTimer: ReturnType<typeof setTimeout> | null = null;
|
||||||
|
|
||||||
onMounted(() => restoreCountdown());
|
onMounted(() => {
|
||||||
|
const storedPhone = window.localStorage.getItem(PHONE_STORAGE_KEY) ?? "";
|
||||||
|
if (PHONE_PATTERN.test(storedPhone)) phone.value = storedPhone;
|
||||||
|
restoreCountdown();
|
||||||
|
});
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
stopCountdownTimer();
|
stopCountdownTimer();
|
||||||
if (toastTimer) clearTimeout(toastTimer);
|
if (toastTimer) clearTimeout(toastTimer);
|
||||||
@@ -64,6 +69,7 @@ onUnmounted(() => {
|
|||||||
|
|
||||||
watch(phone, () => {
|
watch(phone, () => {
|
||||||
code.value = sanitizeDigits(code.value, 6);
|
code.value = sanitizeDigits(code.value, 6);
|
||||||
|
if (phoneValid.value) window.localStorage.setItem(PHONE_STORAGE_KEY, phone.value);
|
||||||
restoreCountdown();
|
restoreCountdown();
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -82,6 +88,7 @@ function sanitizeDigits(value: string, maxLength: number) {
|
|||||||
function clearPhone() {
|
function clearPhone() {
|
||||||
phone.value = "";
|
phone.value = "";
|
||||||
phoneTouched.value = false;
|
phoneTouched.value = false;
|
||||||
|
window.localStorage.removeItem(PHONE_STORAGE_KEY);
|
||||||
}
|
}
|
||||||
|
|
||||||
async function sendCode() {
|
async function sendCode() {
|
||||||
|
|||||||
@@ -295,7 +295,7 @@ textarea:focus-visible {
|
|||||||
padding: 5px 4px;
|
padding: 5px 4px;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
color: var(--login-muted);
|
color: var(--login-muted);
|
||||||
font-size: 13px;
|
font-size: 12px;
|
||||||
line-height: 1.7;
|
line-height: 1.7;
|
||||||
transition: background 0.18s ease, color 0.18s ease;
|
transition: background 0.18s ease, color 0.18s ease;
|
||||||
}
|
}
|
||||||
@@ -309,13 +309,13 @@ textarea:focus-visible {
|
|||||||
min-height: 34px;
|
min-height: 34px;
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 8px;
|
gap: 6px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.agreement-toggle input {
|
.agreement-toggle input {
|
||||||
width: 20px;
|
width: 18px;
|
||||||
height: 20px;
|
height: 18px;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
accent-color: var(--login-brand-dark);
|
accent-color: var(--login-brand-dark);
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|||||||
Reference in New Issue
Block a user