This commit is contained in:
吕才卓 2024-04-07 17:36:32 +08:00
parent 351232b4be
commit a25572301d
5 changed files with 56 additions and 111 deletions

2
package-lock.json generated
View File

@ -1605,7 +1605,7 @@
}, },
"node_modules/pinia-plugin-persistedstate": { "node_modules/pinia-plugin-persistedstate": {
"version": "3.2.1", "version": "3.2.1",
"resolved": "https://registry.npmmirror.com/pinia-plugin-persistedstate/-/pinia-plugin-persistedstate-3.2.1.tgz", "resolved": "https://registry.npmjs.org/pinia-plugin-persistedstate/-/pinia-plugin-persistedstate-3.2.1.tgz",
"integrity": "sha512-MK++8LRUsGF7r45PjBFES82ISnPzyO6IZx3CH5vyPseFLZCk1g2kgx6l/nW8pEBKxxd4do0P6bJw+mUSZIEZUQ==", "integrity": "sha512-MK++8LRUsGF7r45PjBFES82ISnPzyO6IZx3CH5vyPseFLZCk1g2kgx6l/nW8pEBKxxd4do0P6bJw+mUSZIEZUQ==",
"peerDependencies": { "peerDependencies": {
"pinia": "^2.0.0" "pinia": "^2.0.0"

View File

@ -74,12 +74,8 @@ const rules = reactive({
message: "必须填写", message: "必须填写",
}, },
{ {
min: 10, pattern: /^\d{10}$/, // 10
message: "输入不正确", message: "学号必须是10位数字",
},
{
max: 10,
message: "输入不正确",
}, },
], ],
password: [ password: [
@ -92,36 +88,17 @@ const rules = reactive({
message: "请输入 8 位密码", message: "请输入 8 位密码",
}, },
{ {
pattern: /[A-Z]+/, pattern: /^(?=.*[A-Z])(?=.*\d)[A-Za-z\d]{8,}$/u,
message: "密码必须包含大写字母", message: "密码必须包含至少一个大写字母,并由字母和数字组成",
}, },
], ],
}); });
const onReset = () => {
//
formData.account = "";
formData.password = "";
MessagePlugin.success("重置成功");
};
// const onSubmit = () => {
// this.$refs.form.validateResult((valid,errors) => {
// console.log(valid);
// if (valid) {
// MessagePlugin.success("");
// } else {
// MessagePlugin.error("");
// console.log("Errors: ", errors);
// return false;
// }
// });
// };
const onSubmit = async () => { const onSubmit = async () => {
try { try {
const validateResult = await this.$refs.form.validate(); const validateResult = await this.$refs.form.validate();
if (validateResult.result) { if (validateResult.result) {
await reqUser(); await reqUser(formData.account, formData.password);
MessagePlugin.success("提交成功"); MessagePlugin.success("提交成功");
await router.push("/"); await router.push("/");
} else { } else {
@ -135,18 +112,13 @@ const onSubmit = async () => {
} }
}; };
// const Login = async () => {
// await reqUser();
// };
onMounted(() => { onMounted(() => {
reqUser(); reqUser();
}); });
function handleForgotPasswordClick() { function handleForgotPasswordClick() {
router.push("/password-reset") router.push("/password-reset");
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>

View File

@ -48,51 +48,55 @@ import { reactive } from "vue";
import router from "@/router"; import router from "@/router";
const INITIAL_DATA = { const INITIAL_DATA = {
account: '', account: "",
password: '', password: "",
rePassword: '', rePassword: "",
}; };
const formData = reactive({ const formData = reactive({
...INITIAL_DATA, ...INITIAL_DATA,
}); });
const rePassword = (val) =>
new Promise((resolve) => {
const timer = setTimeout(() => {
resolve(formData.password === val);
clearTimeout(timer);
});
});
const rules = reactive({ const rules = reactive({
account: [ account: [
{ {
required: true, required: true,
message: '学号必填', message: "学号必填",
type: 'error', type: "error",
}, },
{ {
min: 10, pattern: /^\d{10}$/, // 10
message: "输入不正确", message: "学号必须是10位数字",
},
{
max: 10,
message: "输入不正确",
}, },
], ],
password: [ password: [
{ {
required: true, required: true,
message: '密码必填', message: "密码必填",
type: 'error', type: "error",
}, },
{ {
len: 8, len: 8,
message: "请输入 8 位密码", message: "请输入 8 位密码",
}, },
{ {
pattern: /[A-Z]+/, pattern: /^(?=.*[A-Z])(?=.*\d)[A-Za-z\d]{8,}$/u,
message: "密码必须包含大写字母", message: "密码必须包含至少一个大写字母,并由字母和数字组成",
}, },
], ],
rePassword: [ rePassword: [
{ {
required: true, required: true,
message: '密码必填', message: "密码必填",
type: 'error', type: "error",
}, },
{ {
len: 8, len: 8,
@ -102,78 +106,47 @@ const rules = reactive({
pattern: /[A-Z]+/, pattern: /[A-Z]+/,
message: "密码必须包含大写字母", message: "密码必须包含大写字母",
}, },
{
validator: rePassword,
trigger: ["blur", "change"],
message: "两次密码不一致",
},
], ],
}); });
const onReset = () => { const onReset = () => {
MessagePlugin.success('重置成功'); MessagePlugin.success("重置成功");
}; };
const onSubmit = ({ validateResult, firstError }) => { const onSubmit = async () => {
if (validateResult === true) { try {
MessagePlugin.success('提交成功'); const validateResult = await this.$refs.form.validate();
} else { if (validateResult.result) {
console.log('Errors: ', validateResult); await reqUser(formData.account, formData.password, formData.rePassword);
MessagePlugin.warning(firstError); MessagePlugin.success("提交成功");
await router.push("/login");
} else {
const firstError = validateResult.errors[0]?.message || "未知错误";
console.log("Errors: ", validateResult.errors);
MessagePlugin.warning(firstError);
}
} catch (error) {
console.error("请求失败:", error);
MessagePlugin.error("提交失败");
} }
}; };
const onValidate = ({ validateResult, firstError }) => { const onValidate = ({ validateResult, firstError }) => {
if (validateResult === true) { if (validateResult === true) {
console.log('Validate Success'); onSubmit();
console.log("Validate Success");
} else { } 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 passwordValidator = (val) => {
if (val.length > 0 && val.length <= 2) {
return {
result: false,
message: '太简单了!再开动一下你的小脑筋吧!',
type: 'error',
};
}
if (val.length > 2 && val.length < 4) {
return {
result: false,
message: '还差一点点,就是一个完美的密码了!',
type: 'warning',
};
}
return {
result: true,
message: '太强了,你确定自己记得住吗!',
type: 'success',
};
};
//
const rePassword = (val) => new Promise((resolve) => {
const timer = setTimeout(() => {
resolve(formData.password === val);
clearTimeout(timer);
});
});
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
.password-container { .password-container {
display: flex; display: flex;
justify-content: center; justify-content: center;

View File

@ -43,5 +43,5 @@ import { MessagePlugin } from "tdesign-vue-next";
import { ref } from "vue"; import { ref } from "vue";
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
</style> </style>

View File

@ -11,7 +11,7 @@ export default defineConfig({
server: { server: {
proxy: { proxy: {
"/api": { "/api": {
target: "http://192.168.1.10:8000", target: "http://192.168.1.10:8080",
changeOrigin: true, changeOrigin: true,
}, },
}, },