前端代码格式化

This commit is contained in:
2026-02-19 11:46:27 +08:00
parent d310a29c03
commit f0f0763ceb
101 changed files with 8952 additions and 13203 deletions
@@ -9,26 +9,12 @@
<div class="auth-card">
<div class="auth-header">
<h1 class="auth-title">找回密码</h1>
<p class="auth-subtitle">
输入您的邮箱我们将发送重置密码链接
</p>
<p class="auth-subtitle">输入您的邮箱我们将发送重置密码链接</p>
</div>
<a-form
ref="forgotFormRef"
:model="forgotForm"
:rules="forgotRules"
class="auth-form"
@finish="handleSubmit"
layout="vertical"
>
<a-form ref="forgotFormRef" :model="forgotForm" :rules="forgotRules" class="auth-form" @finish="handleSubmit" layout="vertical">
<a-form-item name="email">
<a-input
v-model:value="forgotForm.email"
placeholder="请输入注册邮箱"
size="large"
@pressEnter="handleSubmit"
>
<a-input v-model:value="forgotForm.email" placeholder="请输入注册邮箱" size="large" @pressEnter="handleSubmit">
<template #prefix>
<MailOutlined />
</template>
@@ -37,36 +23,20 @@
<a-form-item name="captcha" v-if="showCaptcha">
<div style="display: flex; gap: 12px">
<a-input
v-model:value="forgotForm.captcha"
placeholder="请输入验证码"
size="large"
style="flex: 1"
>
<a-input v-model:value="forgotForm.captcha" placeholder="请输入验证码" size="large" style="flex: 1">
<template #prefix>
<SafetyOutlined />
</template>
</a-input>
<a-button
type="default"
size="large"
:disabled="captchaDisabled"
@click="sendCaptcha"
>
<a-button type="default" size="large" :disabled="captchaDisabled" @click="sendCaptcha">
{{ captchaButtonText }}
</a-button>
</div>
</a-form-item>
<a-form-item>
<a-button
type="primary"
:loading="loading"
size="large"
html-type="submit"
block
>
{{ loading ? "提交中..." : "发送重置链接" }}
<a-button type="primary" :loading="loading" size="large" html-type="submit" block>
{{ loading ? '提交中...' : '发送重置链接' }}
</a-button>
</a-form-item>
</a-form>
@@ -74,9 +44,7 @@
<div class="auth-footer">
<p class="auth-footer-text">
想起密码了
<router-link to="/login" class="auth-link">
返回登录
</router-link>
<router-link to="/login" class="auth-link"> 返回登录 </router-link>
</p>
</div>
</div>
@@ -84,113 +52,113 @@
</template>
<script setup>
import { reactive, ref } from "vue";
import { useRouter } from "vue-router";
import { message } from "ant-design-vue";
import { MailOutlined, SafetyOutlined } from "@ant-design/icons-vue";
import "@/assets/style/auth.scss";
import { reactive, ref } from 'vue'
import { useRouter } from 'vue-router'
import { message } from 'ant-design-vue'
import { MailOutlined, SafetyOutlined } from '@ant-design/icons-vue'
import '@/assets/style/auth.scss'
defineOptions({
name: "ResetPasswordPage",
});
name: 'ResetPasswordPage',
})
const router = useRouter();
const forgotFormRef = ref(null);
const loading = ref(false);
const showCaptcha = ref(false);
const captchaDisabled = ref(false);
const countdown = ref(60);
const router = useRouter()
const forgotFormRef = ref(null)
const loading = ref(false)
const showCaptcha = ref(false)
const captchaDisabled = ref(false)
const countdown = ref(60)
// Forgot password form data
const forgotForm = reactive({
email: "",
captcha: "",
});
email: '',
captcha: '',
})
// Captcha button text
const captchaButtonText = ref("获取验证码");
const captchaButtonText = ref('获取验证码')
// Form validation rules
const forgotRules = {
email: [
{ required: true, message: "请输入邮箱地址" },
{ type: "email", message: "请输入正确的邮箱地址" },
{ required: true, message: '请输入邮箱地址' },
{ type: 'email', message: '请输入正确的邮箱地址' },
],
captcha: [
{ required: true, message: "请输入验证码" },
{ len: 6, message: "验证码为6位数字" },
{ required: true, message: '请输入验证码' },
{ len: 6, message: '验证码为6位数字' },
],
};
}
// Send captcha code
const sendCaptcha = async () => {
if (!forgotForm.email) {
message.warning("请先输入邮箱地址");
return;
message.warning('请先输入邮箱地址')
return
}
// Validate email format
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/
if (!emailRegex.test(forgotForm.email)) {
message.warning("请输入正确的邮箱地址");
return;
message.warning('请输入正确的邮箱地址')
return
}
try {
// Simulate API call - Replace with actual API call
// Example: const response = await sendCaptchaApi(forgotForm.email)
await new Promise((resolve) => setTimeout(resolve, 500));
await new Promise((resolve) => setTimeout(resolve, 500))
message.success("验证码已发送至您的邮箱");
message.success('验证码已发送至您的邮箱')
// Start countdown
captchaDisabled.value = true;
captchaDisabled.value = true
const timer = setInterval(() => {
countdown.value--;
captchaButtonText.value = `${countdown.value}秒后重试`;
countdown.value--
captchaButtonText.value = `${countdown.value}秒后重试`
if (countdown.value <= 0) {
clearInterval(timer);
captchaDisabled.value = false;
captchaButtonText.value = "获取验证码";
countdown.value = 60;
clearInterval(timer)
captchaDisabled.value = false
captchaButtonText.value = '获取验证码'
countdown.value = 60
}
}, 1000);
}, 1000)
showCaptcha.value = true;
showCaptcha.value = true
} catch (error) {
console.error("Send captcha failed:", error);
message.error("发送验证码失败,请稍后重试");
console.error('Send captcha failed:', error)
message.error('发送验证码失败,请稍后重试')
}
};
}
// Handle submit
const handleSubmit = async () => {
if (!forgotFormRef.value) return;
if (!forgotFormRef.value) return
try {
await forgotFormRef.value.validate();
loading.value = true;
await forgotFormRef.value.validate()
loading.value = true
// Simulate API call - Replace with actual API call
// Example: const response = await forgotPasswordApi(forgotForm)
// Simulated delay
await new Promise((resolve) => setTimeout(resolve, 1500));
await new Promise((resolve) => setTimeout(resolve, 1500))
// Success message
message.success("密码重置链接已发送至您的邮箱,请注意查收");
message.success('密码重置链接已发送至您的邮箱,请注意查收')
// Redirect to login page
setTimeout(() => {
router.push("/login");
}, 2000);
router.push('/login')
}, 2000)
} catch (error) {
console.error("Forgot password failed:", error);
message.error("提交失败,请检查邮箱地址和验证码");
console.error('Forgot password failed:', error)
message.error('提交失败,请检查邮箱地址和验证码')
} finally {
loading.value = false;
loading.value = false
}
};
}
</script>