From b010df597367dbaccc34d9c0d3a562560ffbb33c Mon Sep 17 00:00:00 2001
From: sc <shencheng@heronshn.com>
Date: Thu, 9 Jun 2022 12:36:51 +0800
Subject: [PATCH] =?UTF-8?q?ADD=20=E8=B4=A6=E6=88=B7=E4=BF=A1=E6=81=AF=20?=
 =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E5=AF=86=E7=A0=81=E4=BF=AE=E6=94=B9=E6=A8=A1?=
 =?UTF-8?q?=E6=9D=BF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/userCenter/index.vue         |  6 ++
 src/views/userCenter/user/password.vue | 80 ++++++++++++++++++++++++++
 2 files changed, 86 insertions(+)
 create mode 100644 src/views/userCenter/user/password.vue

diff --git a/src/views/userCenter/index.vue b/src/views/userCenter/index.vue
index 92e2e5e5..db47f194 100644
--- a/src/views/userCenter/index.vue
+++ b/src/views/userCenter/index.vue
@@ -45,6 +45,7 @@
 			account: defineAsyncComponent(() => import('./user/account')),
 			seting: defineAsyncComponent(() => import('./user/seting')),
 			pushSettings: defineAsyncComponent(() => import('./user/pushSettings')),
+			password: defineAsyncComponent(() => import('./user/password')),
 			space: defineAsyncComponent(() => import('./user/space')),
 			logs: defineAsyncComponent(() => import('./user/logs')),
 			upToEnterprise: defineAsyncComponent(() => import('./user/upToEnterprise'))
@@ -65,6 +66,11 @@
 								title: "个人设置",
 								component: "seting"
 							},
+							{
+								icon: "el-icon-lock",
+								title: "密码",
+								component: "password"
+							},
 							{
 								icon: "el-icon-bell",
 								title: "通知设置",
diff --git a/src/views/userCenter/user/password.vue b/src/views/userCenter/user/password.vue
new file mode 100644
index 00000000..5e8827d3
--- /dev/null
+++ b/src/views/userCenter/user/password.vue
@@ -0,0 +1,80 @@
+<template>
+	<el-card shadow="never" header="修改密码">
+		<el-alert title="密码更新成功后，您将被重定向到登录页面，您可以使用新密码重新登录。" type="info" show-icon style="margin-bottom: 15px;"/>
+		<el-form ref="form" :model="form" :rules="rules" label-width="120px" style="margin-top:20px;">
+			<el-form-item label="当前密码" prop="userPassword">
+				<el-input v-model="form.userPassword" type="password" show-password placeholder="请输入当前密码"></el-input>
+				<div class="el-form-item-msg">必须提供当前登录用户密码才能进行更改</div>
+			</el-form-item>
+			<el-form-item label="新密码" prop="newPassword">
+				<el-input v-model="form.newPassword" type="password" show-password placeholder="请输入新密码"></el-input>
+				<sc-password-strength v-model="form.newPassword"></sc-password-strength>
+				<div class="el-form-item-msg">请输入包含英文、数字的8位以上密码</div>
+			</el-form-item>
+			<el-form-item label="确认新密码" prop="confirmNewPassword">
+				<el-input v-model="form.confirmNewPassword" type="password" show-password placeholder="请再次输入新密码"></el-input>
+			</el-form-item>
+			<el-form-item>
+				<el-button type="primary" @click="save">保存密码</el-button>
+			</el-form-item>
+		</el-form>
+	</el-card>
+</template>
+
+<script>
+	import scPasswordStrength from '@/components/scPasswordStrength'
+
+	export default {
+		components: {
+			scPasswordStrength
+		},
+		data() {
+			return {
+				form: {
+					userPassword: "",
+					newPassword: "",
+					confirmNewPassword: ""
+				},
+				rules: {
+					userPassword: [
+						{ required: true, message: '请输入当前密码'}
+					],
+					newPassword: [
+						{ required: true, message: '请输入新密码'}
+					],
+					confirmNewPassword: [
+						{ required: true, message: '请再次输入新密码'},
+						{validator: (rule, value, callback) => {
+							if (value !== this.form.newPassword) {
+								callback(new Error('两次输入密码不一致'));
+							}else{
+								callback();
+							}
+						}}
+					]
+				}
+			}
+		},
+		methods: {
+			save(){
+				this.$refs.form.validate(valid => {
+					if (valid) {
+						this.$alert("密码修改成功，是否跳转至登录页使用新密码登录", "修改成功", {
+							type: 'success',
+							center: true
+						}).then(() => {
+							this.$router.replace({
+								path: '/login'
+							})
+						}).catch(() => {})
+					}else{
+						return false
+					}
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+</style>