🐞 fix: css格式scss修改为less
This commit is contained in:
parent
74ceb12353
commit
e0ea35c789
|
@ -11,4 +11,4 @@
|
|||
|
||||
<script setup></script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
<style lang="less" scoped></style>
|
||||
|
|
|
@ -48,9 +48,9 @@ import { reactive } from "vue";
|
|||
import router from "@/router";
|
||||
|
||||
const INITIAL_DATA = {
|
||||
account: '',
|
||||
password: '',
|
||||
rePassword: '',
|
||||
account: "",
|
||||
password: "",
|
||||
rePassword: "",
|
||||
};
|
||||
|
||||
const formData = reactive({
|
||||
|
@ -61,8 +61,8 @@ const rules = reactive({
|
|||
account: [
|
||||
{
|
||||
required: true,
|
||||
message: '学号必填',
|
||||
type: 'error',
|
||||
message: "学号必填",
|
||||
type: "error",
|
||||
},
|
||||
{
|
||||
min: 10,
|
||||
|
@ -76,8 +76,8 @@ const rules = reactive({
|
|||
password: [
|
||||
{
|
||||
required: true,
|
||||
message: '密码必填',
|
||||
type: 'error',
|
||||
message: "密码必填",
|
||||
type: "error",
|
||||
},
|
||||
{
|
||||
len: 8,
|
||||
|
@ -91,8 +91,8 @@ const rules = reactive({
|
|||
rePassword: [
|
||||
{
|
||||
required: true,
|
||||
message: '密码必填',
|
||||
type: 'error',
|
||||
message: "密码必填",
|
||||
type: "error",
|
||||
},
|
||||
{
|
||||
len: 8,
|
||||
|
@ -106,74 +106,75 @@ const rules = reactive({
|
|||
});
|
||||
|
||||
const onReset = () => {
|
||||
MessagePlugin.success('重置成功');
|
||||
MessagePlugin.success("重置成功");
|
||||
};
|
||||
|
||||
const onSubmit = ({ validateResult, firstError }) => {
|
||||
if (validateResult === true) {
|
||||
MessagePlugin.success('提交成功');
|
||||
MessagePlugin.success("提交成功");
|
||||
} else {
|
||||
console.log('Errors: ', validateResult);
|
||||
console.log("Errors: ", validateResult);
|
||||
MessagePlugin.warning(firstError);
|
||||
}
|
||||
};
|
||||
const onValidate = ({ validateResult, firstError }) => {
|
||||
if (validateResult === true) {
|
||||
console.log('Validate Success');
|
||||
console.log("Validate Success");
|
||||
} else {
|
||||
console.log('Validate Errors: ', firstError, validateResult);
|
||||
console.log("Validate Errors: ", firstError, validateResult);
|
||||
}
|
||||
};
|
||||
// 自定义异步校验器,使用 resolve 返回结果控制校验结果、校验信息、校验结果类型
|
||||
const userNameValidator = (val) => new Promise((resolve) => {
|
||||
const timer = setTimeout(() => {
|
||||
if (['Zhang', 'Li', 'Wang'].includes(val)) {
|
||||
resolve({
|
||||
result: true,
|
||||
});
|
||||
} else {
|
||||
resolve({
|
||||
result: false,
|
||||
message: '用户名不存在',
|
||||
type: 'error',
|
||||
});
|
||||
}
|
||||
clearTimeout(timer);
|
||||
}, 10);
|
||||
});
|
||||
const userNameValidator = (val) =>
|
||||
new Promise((resolve) => {
|
||||
const timer = setTimeout(() => {
|
||||
if (["Zhang", "Li", "Wang"].includes(val)) {
|
||||
resolve({
|
||||
result: true,
|
||||
});
|
||||
} else {
|
||||
resolve({
|
||||
result: false,
|
||||
message: "用户名不存在",
|
||||
type: "error",
|
||||
});
|
||||
}
|
||||
clearTimeout(timer);
|
||||
}, 10);
|
||||
});
|
||||
// 自定义校验器,不同的值输出不同的校验结果。支持异步校验(文案选自某密码重置站点,如有侵权,请联系我们删除)
|
||||
const passwordValidator = (val) => {
|
||||
if (val.length > 0 && val.length <= 2) {
|
||||
return {
|
||||
result: false,
|
||||
message: '太简单了!再开动一下你的小脑筋吧!',
|
||||
type: 'error',
|
||||
message: "太简单了!再开动一下你的小脑筋吧!",
|
||||
type: "error",
|
||||
};
|
||||
}
|
||||
if (val.length > 2 && val.length < 4) {
|
||||
return {
|
||||
result: false,
|
||||
message: '还差一点点,就是一个完美的密码了!',
|
||||
type: 'warning',
|
||||
message: "还差一点点,就是一个完美的密码了!",
|
||||
type: "warning",
|
||||
};
|
||||
}
|
||||
return {
|
||||
result: true,
|
||||
message: '太强了,你确定自己记得住吗!',
|
||||
type: 'success',
|
||||
message: "太强了,你确定自己记得住吗!",
|
||||
type: "success",
|
||||
};
|
||||
};
|
||||
// 自定义异步校验器
|
||||
const rePassword = (val) => new Promise((resolve) => {
|
||||
const timer = setTimeout(() => {
|
||||
resolve(formData.password === val);
|
||||
clearTimeout(timer);
|
||||
const rePassword = (val) =>
|
||||
new Promise((resolve) => {
|
||||
const timer = setTimeout(() => {
|
||||
resolve(formData.password === val);
|
||||
clearTimeout(timer);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
<style lang="less" scoped>
|
||||
.password-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
@ -193,4 +194,4 @@ const rePassword = (val) => new Promise((resolve) => {
|
|||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
|
|
@ -43,5 +43,4 @@ import { MessagePlugin } from "tdesign-vue-next";
|
|||
import { ref } from "vue";
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
<style lang="less" scoped></style>
|
||||
|
|
Loading…
Reference in New Issue
Block a user