Merge remote-tracking branch 'origin/feature/0905_登录注册流程重构' into test

This commit is contained in:
rd
2025-09-16 17:29:22 +08:00
5 changed files with 61 additions and 7 deletions

View File

@ -19,7 +19,7 @@
padding: 0 16px; padding: 0 16px;
height: 28px; height: 28px;
} }
} }
.ant-btn-default { .ant-btn-default {
&:disabled { &:disabled {
@ -86,7 +86,7 @@
} }
&:active { &:active {
background: $color-error-5 !important; background-color: $color-error-7 !important;
} }
} }
} }
@ -105,6 +105,11 @@
color: $color-primary-5 !important; color: $color-primary-5 !important;
background-color: #fff !important; background-color: #fff !important;
} }
&:active {
border-color: $color-primary-7 !important;
color: $color-primary-7 !important;
}
} }
&.ant-btn-dangerous { &.ant-btn-dangerous {
border: 1px solid $color-error !important; border: 1px solid $color-error !important;
@ -119,6 +124,11 @@
border-color: $color-error-5 !important; border-color: $color-error-5 !important;
color: $color-error-5 !important; color: $color-error-5 !important;
} }
&:active {
border-color: $color-error-7 !important;
color: $color-error-7 !important;
}
} }
} }
} }
@ -136,6 +146,11 @@
border-color: $color-primary-5 !important; border-color: $color-primary-5 !important;
color: $color-primary-5 !important; color: $color-primary-5 !important;
} }
&:active {
border-color: $color-primary-7 !important;
color: $color-primary-7 !important;
}
} }
&.ant-btn-dangerous { &.ant-btn-dangerous {
@ -150,6 +165,11 @@
border-color: $color-error-5 !important; border-color: $color-error-5 !important;
color: $color-error-5 !important; color: $color-error-5 !important;
} }
&:active {
border-color: $color-error-7 !important;
color: $color-error-7 !important;
}
} }
} }
} }
@ -167,6 +187,10 @@
color: $color-primary-5 !important; color: $color-primary-5 !important;
border-color: transparent !important; border-color: transparent !important;
} }
&:active {
color: $color-primary-7 !important;
}
} }
&.ant-btn-dangerous { &.ant-btn-dangerous {
color: $color-error !important; color: $color-error !important;
@ -177,6 +201,10 @@
&:hover { &:hover {
color: $color-error-5 !important; color: $color-error-5 !important;
} }
&:active {
color: $color-error-7 !important;
}
} }
} }
} }
@ -194,6 +222,10 @@
color: $color-primary-5 !important; color: $color-primary-5 !important;
border-color: transparent !important; border-color: transparent !important;
} }
&:active {
color: $color-primary-7 !important;
}
} }
&.ant-btn-dangerous { &.ant-btn-dangerous {
color: $color-error !important; color: $color-error !important;
@ -204,6 +236,10 @@
&:hover { &:hover {
color: $color-error-5 !important; color: $color-error-5 !important;
} }
&:active {
color: $color-error-7 !important;
}
} }
} }
} }

View File

@ -14,7 +14,13 @@
<p class="cts mt-36px !color-#211F24 mb-24px">验证成功请更改密码</p> <p class="cts mt-36px !color-#211F24 mb-24px">验证成功请更改密码</p>
<Form ref="formRef" :model="formData" :rules="formRules" auto-label-width class="w-348 form-wrap"> <Form ref="formRef" :model="formData" :rules="formRules" auto-label-width class="w-348 form-wrap">
<FormItem name="password" class="password-form-item"> <FormItem name="password" class="password-form-item">
<Input.Password v-model:value="formData.password" placeholder="新密码" size="large" class="!h-48px"> <Input.Password
v-model:value="formData.password"
class="!h-48px"
placeholder="新密码"
size="large"
@change="onPasswordChange"
>
<template #iconRender="visible"> <template #iconRender="visible">
<img :src="visible ? icon2 : icon1" width="20" height="20" class="cursor-pointer" /> <img :src="visible ? icon2 : icon1" width="20" height="20" class="cursor-pointer" />
</template> </template>
@ -26,6 +32,7 @@
placeholder="密码确认" placeholder="密码确认"
size="large" size="large"
class="!h-48px" class="!h-48px"
@change="onPasswordChange"
> >
<template #iconRender="visible"> <template #iconRender="visible">
<img :src="visible ? icon2 : icon1" width="20" height="20" class="cursor-pointer" /> <img :src="visible ? icon2 : icon1" width="20" height="20" class="cursor-pointer" />
@ -146,6 +153,12 @@ const onCheckPass = (captcha) => {
formData.value.captcha = captcha; formData.value.captcha = captcha;
}; };
const onPasswordChange = () => {
nextTick(() => {
formRef.value.clearValidate('confirm_password');
});
};
const getCaptcha = async () => { const getCaptcha = async () => {
try { try {
const { code, message: msg } = await postUpdatePasswordCaptcha(); const { code, message: msg } = await postUpdatePasswordCaptcha();

View File

@ -9,6 +9,7 @@
:value="item.value" :value="item.value"
:class="{ error: isError, fill: item.value }" :class="{ error: isError, fill: item.value }"
@input="handleInput(index, $event.target.value)" @input="handleInput(index, $event.target.value)"
@focus="handleFocus"
:maxlength="1" :maxlength="1"
placeholder="" placeholder=""
/> />
@ -35,6 +36,10 @@ const errorMessage = ref('');
const isError = ref(false); const isError = ref(false);
const inputRef = ref(null); const inputRef = ref(null);
const handleFocus = (index) => {
isError.value = false;
errorMessage.value = '';
};
// 处理输入事件 // 处理输入事件
const handleInput = (index, value) => { const handleInput = (index, value) => {
if (!value) { if (!value) {

View File

@ -33,7 +33,7 @@
</div> </div>
</template> </template>
</Input> </Input>
<p class="color-#F64B31 text-12px font-400 lh-20px font-family-regular" v-show="errMsg"> <p class="color-#F64B31 text-12px font-400 h-20px lh-20px font-family-regular">
{{ errMsg }} {{ errMsg }}
</p> </p>
</FormItem> </FormItem>
@ -43,7 +43,7 @@
<img :src="visible ? icon2 : icon1" width="20" height="20" class="cursor-pointer" /> <img :src="visible ? icon2 : icon1" width="20" height="20" class="cursor-pointer" />
</template> </template>
</Input.Password> </Input.Password>
<p v-show="errMsg" class="color-#F64B31 h-20px text-12px font-400 lh-20px font-family-regular"> <p class="color-#F64B31 h-20px text-12px font-400 lh-20px font-family-regular">
{{ errMsg }} {{ errMsg }}
</p> </p>
</FormItem> </FormItem>

View File

@ -50,12 +50,12 @@
</div> </div>
</template> </template>
</Input> </Input>
<p class="color-#F64B31 text-12px font-400 lh-20px font-family-regular" v-show="errMsg"> <p class="color-#F64B31 text-12px font-400 lh-20px h-20px font-family-regular">
{{ errMsg }} {{ errMsg }}
</p> </p>
</FormItem> </FormItem>
<FormItem class="mt-52px"> <FormItem class="mt-32px">
<div class="text-12px flex justify-center items-center mb-16px"> <div class="text-12px flex justify-center items-center mb-16px">
<Checkbox v-model:checked="hasCheck" class="mr-8px"></Checkbox> <Checkbox v-model:checked="hasCheck" class="mr-8px"></Checkbox>
<span class="text-12px color-#737478 font-400 lh-20px font-family-regular" <span class="text-12px color-#737478 font-400 lh-20px font-family-regular"