From 000a59c7e4382198374485d55411aac357cb8b67 Mon Sep 17 00:00:00 2001
From: Admin <978517621@qq.com>
Date: 星期二, 20 九月 2022 16:17:56 +0800
Subject: [PATCH] Default Changelist
---
src/views/loginPage/component/accountLogin.vue | 174 +++++++++++++++++++------------------------
src/api/login/index.ts | 10 ++
2 files changed, 87 insertions(+), 97 deletions(-)
diff --git a/src/api/login/index.ts b/src/api/login/index.ts
index ac55ce0..61d862f 100644
--- a/src/api/login/index.ts
+++ b/src/api/login/index.ts
@@ -21,6 +21,14 @@
url: import.meta.env.VITE_API_URL + '/auth/logout',
method: 'post'
});
- }
+ },
+ // 更改密码
+ changeCode: (params: object) => {
+ return request({
+ url: import.meta.env.VITE_API_URL + '/account/pwd/forget',
+ method: 'post',
+ data: params
+ });
+ },
};
}
diff --git a/src/views/loginPage/component/accountLogin.vue b/src/views/loginPage/component/accountLogin.vue
index 7455f9e..d22d99a 100644
--- a/src/views/loginPage/component/accountLogin.vue
+++ b/src/views/loginPage/component/accountLogin.vue
@@ -13,7 +13,7 @@
<el-icon class="el-input__icon" style="margin-right: 20px"><img src="../../../assets/loginPage/login_icon_password.png" style="width: 24px; height: 24px" /></el-icon>
</template>
<template #suffix>
- <i class="iconfont el-input__icon login-content-password" :class="isShowPassword ? 'icon-yincangmima' : 'icon-xianshimima'" @click="isShowPassword = !isShowPassword"> </i>
+ <i class="iconfont el-input__icon login-content-password" :class="isShowPassword ? 'icon-xianshimima' : 'icon-yincangmima'" @click="isShowPassword = !isShowPassword"> </i>
</template>
</el-input>
</el-form-item>
@@ -27,42 +27,42 @@
</el-button>
</el-form-item>
</el-form>
- <el-dialog v-model="identifyDialog" title="重置密码须进行身份校验(仅供测试)" width="30%" center @close="clearIdentity">
+ <el-dialog v-model="identifyDialog" title="重置密码" width="30%" center @close="clearIdentity">
<el-form :model="identity" label-width="80px" ref="identifyRef" :rules="identityRules">
- <el-form-item label="姓名" prop="userName">
- <el-input v-model="identity.userName"/>
+ <el-divider border-style="dashed">身份验证</el-divider>
+ <el-form-item label="姓名" prop="realName">
+ <el-input v-model="identity.realName"/>
</el-form-item>
- <el-form-item label="身份证号" prop="ID">
- <el-input v-model="identity.ID"/>
+ <el-form-item label="身份证号" prop="identify">
+ <el-input v-model="identity.identify"/>
</el-form-item>
<el-form-item label="手机号" prop="phone">
<el-input v-model="identity.phone"/>
+ </el-form-item>
+ <el-divider border-style="dashed">重设密码</el-divider>
+ <el-form-item label="密码" prop="password">
+ <el-input v-model="identity.password" :type="showPass ? 'text': 'password'" autocomplete="off">
+ <template #suffix>
+ <i class="iconfont el-input__icon login-content-password" :class="showPass ? 'icon-xianshimima' : 'icon-yincangmima'" @click="showPass = !showPass"> </i>
+ </template>
+ </el-input>
+ </el-form-item>
+ <el-form-item label="确认密码" prop="rePassword">
+ <el-input
+ v-model="identity.rePassword"
+ :type="showRePass ? 'text': 'password'"
+ autocomplete="off"
+ >
+ <template #suffix>
+ <i class="iconfont el-input__icon login-content-password" :class="showRePass ? 'icon-xianshimima' : 'icon-yincangmima'" @click="showRePass = !showRePass"> </i>
+ </template>
+ </el-input>
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button type="warning" @click="identifyDialog = false" size="default">取消</el-button>
<el-button type="primary" @click="confirmIdentity(identifyRef)" size="default">确认</el-button>
- </span>
- </template>
- </el-dialog>
- <el-dialog v-model="changeDialog" title="修改密码" width="30%" center @close="clearCode">
- <el-form :model="codeForm" label-width="80px" ref="codeRef" :rules="codeRules">
- <el-form-item label="密码" prop="pass">
- <el-input v-model="codeForm.pass" type="password" autocomplete="off" />
- </el-form-item>
- <el-form-item label="确认密码" prop="checkPass">
- <el-input
- v-model="codeForm.checkPass"
- type="password"
- autocomplete="off"
- />
- </el-form-item>
- </el-form>
- <template #footer>
- <span class="dialog-footer">
- <el-button type="warning" @click="changeDialog = false" size="default">取消</el-button>
- <el-button type="primary" @click="confirmChange(codeRef)" size="default">确认修改</el-button>
</span>
</template>
</el-dialog>
@@ -96,6 +96,8 @@
const router = useRouter();
const state = reactive({
isShowPassword: false,
+ showPass: false,
+ showRePass: false,
saveCode: false,
ruleForm: {
username: '',
@@ -105,19 +107,15 @@
signIn: false
},
identity:{
- name: '',
- ID: '',
- phone: ''
+ realName: '',
+ identify: '',
+ phone: '',
+ password: '',
+ rePassword: ''
},
- codeForm:{
- pass: '',
- checkPass: ''
- },
- identifyDialog: false,
- changeDialog: false
+ identifyDialog: false
});
const identifyRef = ref<FormInstance>()
- const codeRef = ref<FormInstance>()
// 页面载入时执行方法
onMounted(() => {
@@ -152,10 +150,33 @@
}else callback();
}, 400)
}
+ // 修改密码
+ const validatePass = (rule: any, value: any, callback: any) => {
+ if (value === '') {
+ callback(new Error('该内容不能为空'))
+ } else {
+ if (state.identity.rePassword !== '') {
+ if (!identifyRef.value) return
+ identifyRef.value.validateField('rePassword', () => null)
+ }
+ callback()
+ }
+ }
+ const validatePass2 = (rule: any, value: any, callback: any) => {
+ if (value === '') {
+ callback(new Error('该内容不能为空'))
+ } else if (value !== state.identity.password) {
+ callback(new Error("两次输入的密码不一致!"))
+ } else {
+ callback()
+ }
+ }
const identityRules = reactive({
- userName: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
- ID: [{ required: true, validator: checkCode, trigger: 'blur'}],
- phone: [{ required: true, validator: checkPhone, trigger: 'blur' }]
+ realName: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
+ identify: [{ required: true, validator: checkCode, trigger: 'blur'}],
+ phone: [{ required: true, validator: checkPhone, trigger: 'blur' }],
+ password: [{ required: true, validator: validatePass, trigger: 'blur' }],
+ rePassword: [{ required: true, validator: validatePass2, trigger: 'blur' }]
});
// 时间获取
@@ -238,10 +259,21 @@
// 提交验证
const confirmIdentity = (formEl: FormInstance | undefined) => {
if (!formEl) return
- formEl.validate((valid) => {
+ formEl.validate(async(valid) => {
if (valid) {
+ const res = await useLoginApi().changeCode(state.identity);
+ if(res.data.code == '200'){
+ ElMessage({
+ type: 'success',
+ message: '修改成功,请使用新密码登录'
+ });
+ }else{
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
state.identifyDialog = false
- state.changeDialog = true
} else {
console.log('error submit!')
return false
@@ -250,71 +282,21 @@
}
const clearIdentity = ()=>{
state.identity = {
- name: '',
- ID: '',
- phone: ''
- }
- }
- // 修改密码
- const validatePass = (rule: any, value: any, callback: any) => {
- if (value === '') {
- callback(new Error('请输入密码'))
- } else {
- if (state.codeForm.checkPass !== '') {
- if (!codeRef.value) return
- codeRef.value.validateField('checkPass', () => null)
- }
- callback()
- }
- }
- const validatePass2 = (rule: any, value: any, callback: any) => {
- if (value === '') {
- callback(new Error('请输入密码'))
- } else if (value !== state.codeForm.pass) {
- callback(new Error("两次输入的密码不一致!"))
- } else {
- callback()
+ realName: '',
+ identify: '',
+ phone: '',
+ password: '',
+ rePassword: ''
}
}
- const codeRules = reactive({
- pass: [{ required: true, validator: validatePass, trigger: 'blur' }],
- checkPass: [{ required: true, validator: validatePass2, trigger: 'blur' }]
- })
-
- const confirmChange = (formEl: FormInstance | undefined) => {
- if (!formEl) return
- formEl.validate((valid) => {
- if (valid) {
- ElMessage({
- type: 'success',
- message: '修改成功,请使用新密码登录'
- });
- state.changeDialog = false
- router.push('/login');
- } else {
- console.log('error submit!')
- return false
- }
- })
- }
- const clearCode=()=>{
- state.codeForm = {
- pass: '',
- checkPass: ''
- }
- }
return {
identifyRef,
- codeRef,
identityRules,
- codeRules,
clearIdentity,
onSignIn,
identify,
confirmIdentity,
- confirmChange,
- clearCode,
validatePass,
validatePass2,
...toRefs(state)
--
Gitblit v1.9.2