style(button): 优化按钮样式和交互

This commit is contained in:
rd
2025-09-16 11:55:56 +08:00
parent 473a6e6229
commit b951114936
3 changed files with 28 additions and 22 deletions

View File

@ -50,7 +50,7 @@
<FormItem class="mt-32px">
<div class="text-12px flex justify-center items-center mb-16px">
<Checkbox v-model:checked="hasCheck" class="mr-8px"></Checkbox>
<Checkbox v-model:checked="hasAgree" class="mr-8px"></Checkbox>
<span class="text-12px color-#737478 font-400 lh-20px font-family-regular"
>登录即代表同意<span class="color-#6D4CFE"> 用户协议 </span><span class="color-#6D4CFE">
隐私政策</span
@ -70,7 +70,7 @@
<div>
<Button
v-show="!isCaptchaLogin"
class="!color-#939499 !p-0 !h-22px hover:color-#6D4CFE"
class="!color-#939499 !p-0 !h-22px !hover:color-#6D4CFE !active:color-#573DCB"
size="small"
type="text"
@click="onForgetPassword"
@ -81,7 +81,7 @@
<Button
type="text"
class="!color-#939499 !p-0 !h-22px hover:color-#6D4CFE"
class="!color-#939499 !p-0 !h-22px !hover:color-#6D4CFE !active:color-#573DCB"
size="small"
@click="onRegister"
>
@ -134,7 +134,7 @@ const isLogin = ref(true);
const isVerificationVisible = ref(false);
const hasGetCode = ref(false);
const submitting = ref(false);
const hasCheck = ref(false);
const hasAgree = ref(false);
const mobileNumber = ref('');
const selectAccountModalRef = ref(null);
const accounts = ref([]);
@ -215,10 +215,10 @@ const clearErrorMsg = () => {
const disabledSubmitBtn = computed(() => {
if (isCaptchaLogin.value) {
return !hasCheck.value || !isLegalMobile.value || !loginForm.captcha.trim() || !/^\d{6}$/.test(loginForm.captcha);
return !hasAgree.value || !isLegalMobile.value || !loginForm.captcha.trim() || !/^\d{6}$/.test(loginForm.captcha);
}
// 密码登录时的验证逻辑
return !hasCheck.value || !isLegalMobile.value || !loginForm.password.trim();
return !hasAgree.value || !isLegalMobile.value || !loginForm.password.trim();
});
const validateField = (field: string) => {
@ -299,7 +299,7 @@ const handleSubmit = async () => {
// 校验所有字段
await formRef.value.validate();
if (!hasCheck.value) {
if (!hasAgree.value) {
message.error('请先勾选同意用户协议');
return;
}