From 52d7fdefb80482cf3cc9c22c616176bf3e54f79f Mon Sep 17 00:00:00 2001
From: fangyuan <527392886@qq.com>
Date: 星期三, 14 十二月 2022 16:08:57 +0800
Subject: [PATCH] 图片管理页面修改
---
src/views/layout/components/Header/updatePassword/index.vue | 260 ++++++++++++++++++++++++++++-----------------------
1 files changed, 143 insertions(+), 117 deletions(-)
diff --git a/src/views/layout/components/Header/updatePassword/index.vue b/src/views/layout/components/Header/updatePassword/index.vue
index 6a7d481..5e5c04c 100644
--- a/src/views/layout/components/Header/updatePassword/index.vue
+++ b/src/views/layout/components/Header/updatePassword/index.vue
@@ -1,139 +1,165 @@
<template>
- <div class="createUser">
- <main>
- <div class="mainContent">
- <el-form ref="password" label-width="140px" :rules="passwordRules" autoComplete="on" :model="password"
- label-position="right">
- <el-form-item class="optionItem" label="褰撳墠瀵嗙爜:" prop="oldPassword">
- <el-input type="password" v-model="password.oldPassword" placeholder="璇峰～鍐欏綋鍓嶅瘑鐮�"></el-input>
- </el-form-item>
- <el-form-item class="optionItems" label="鏂板瘑鐮�:" prop="newPassword">
- <el-input type="password" v-model="password.newPassword" placeholder="璇峰～鍐欐柊瀵嗙爜"></el-input>
- </el-form-item>
- <el-form-item class="optionItems" label="纭畾鏂板瘑鐮�:" prop="confirmPassword">
- <el-input type="password" v-model="password.confirmPassword" placeholder="璇峰啀娆″～鍐欐柊瀵嗙爜"></el-input>
- </el-form-item>
- <el-form-item class="optionItems">
- <el-button type="primary" @click="onSubmit">鎻愪氦</el-button>
- </el-form-item>
- </el-form>
- </div>
- </main>
- </div>
+ <div class="createUser">
+ <main>
+ <div class="mainContent">
+ <el-form ref="password" label-width="140px" :rules="passwordRules" autoComplete="on" :model="password"
+ label-position="right">
+ <el-form-item class="optionItem" label="褰撳墠瀵嗙爜:" prop="oldPassword">
+ <el-input type="password" v-model="password.oldPassword" placeholder="璇峰～鍐欏綋鍓嶅瘑鐮�"></el-input>
+ </el-form-item>
+ <el-form-item class="optionItems" label="鏂板瘑鐮�:" prop="newPassword">
+ <el-input type="password" v-model="password.newPassword" placeholder="璇峰～鍐欐柊瀵嗙爜"></el-input>
+ </el-form-item>
+ <el-form-item class="optionItems" label="纭畾鏂板瘑鐮�:" prop="confirmPassword">
+ <el-input type="password" v-model="password.confirmPassword" placeholder="璇峰啀娆″～鍐欐柊瀵嗙爜"></el-input>
+ </el-form-item>
+ <el-form-item class="optionItems">
+ <el-button type="primary" @click="onSubmit">鎻愪氦</el-button>
+ </el-form-item>
+ </el-form>
+ </div>
+ </main>
+ </div>
</template>
<script>
import users from "@/api/users";
export default {
- data() {
- return {
- updatePasswordParam:{
- newPassword:"",
- oldPassword:"",
- username:""
- },
- password: {
- oldPassword: null,
- newPassword: null,
- confirmPassword: null
- },
- passwordRules: {
- newPassword: [{ required: true, trigger: 'blur', message: '瀵嗙爜涓嶈兘涓虹┖' }],
- oldPassword: [{ required: true, trigger: 'blur', message: '鏂板瘑鐮佷笉鑳戒负绌�' }],
- confirmPassword: [{ required: true, trigger: 'blur', message: '鏂板瘑鐮佷笉鑳戒负绌�' }],
- },
- }
- },
- created() {
- },
- methods: {
- onSubmit() {
- this.$refs.password.validate(valid => {
- if (valid) {
- this.updatePasswordParam.oldPassword=this.password.oldPassword;
- this.updatePasswordParam.username=sessionStorage.getItem('name');
- this.updatePasswordParam.newPassword=this.password.newPassword;
- users.updatePassword(this.updatePasswordParam)
- .then(() => {
- this.$message.success('淇敼瀵嗙爜鎴愬姛, 鍗冲皢閲嶆柊鐧诲綍');
- this.logout();
- location.reload();
- })
- .catch(err => this.$message.error(err))
+ data() {
+ const validatePass = (rule, value, callback) => {
+ if (!value) {
+ callback(new Error("鐢ㄦ埛瀵嗙爜涓嶈兘涓虹┖"));
+ } else {
+ if (value.length < 6 || value.length > 16) {
+ callback(new Error("鐢ㄦ埛瀵嗙爜闀垮害涓嶅悎娉�"));
+ } else {
+ const rep = /^\w+$/;
+ if (!rep.test(value)) {
+ callback(new Error("瀵嗙爜鍙兘鏄互鏁板瓧銆�26涓嫳鏂囧瓧姣嶆垨鑰呬笅鍒掔嚎缁勬垚鐨勫瓧绗︿覆"));
+ } else {
+ callback();
}
- })
- },
- logout() {
- users.logout()
- .then(() => {
- sessionStorage.clear();
- })
- .catch(err => this.$message.error(err))
+ }
}
- },
+ };
+ return {
+ updatePasswordParam: {
+ newPassword: "",
+ oldPassword: "",
+ username: ""
+ },
+ password: {
+ oldPassword: null,
+ newPassword: null,
+ confirmPassword: null
+ },
+ passwordRules: {
+ newPassword: [
+ {required: true, trigger: 'blur', message: '瀵嗙爜涓嶈兘涓虹┖'},
+ {validator: validatePass, trigger: 'blur'}
+ ],
+ oldPassword: [
+ {required: true, trigger: 'blur', message: '鏂板瘑鐮佷笉鑳戒负绌�'},
+ {validator: validatePass, trigger: 'blur'}
+ ],
+ confirmPassword: [
+ {required: true, trigger: 'blur', message: '鏂板瘑鐮佷笉鑳戒负绌�'},
+ {validator: validatePass, trigger: 'blur'}
+ ],
+ }
+ }
+ },
+ created() {
+ },
+ methods: {
+ onSubmit() {
+ this.$refs.password.validate(valid => {
+ if (valid) {
+ this.updatePasswordParam.oldPassword = this.password.oldPassword;
+ this.updatePasswordParam.username = sessionStorage.getItem('name');
+ this.updatePasswordParam.newPassword = this.password.newPassword;
+ users.updatePassword(this.updatePasswordParam)
+ .then(() => {
+ this.$message.success('淇敼瀵嗙爜鎴愬姛, 鍗冲皢閲嶆柊鐧诲綍');
+ this.logout();
+ location.reload();
+ })
+ .catch(err => this.$message.error(err))
+ }
+ })
+ }
+ ,
+ logout() {
+ users.logout()
+ .then(() => {
+ sessionStorage.clear();
+ })
+ .catch(err => this.$message.error(err))
+ }
+ },
}
</script>
<style lang="scss" scoped>
.createUser {
- border-radius: 1px;
+ border-radius: 1px;
+ background-color: #09152f;
+
+ main {
+ text-align: left;
+ padding: 0 55px;
background-color: #09152f;
+ padding-bottom: 50px;
- main {
- text-align: left;
- padding: 0 55px;
- background-color: #09152f;
- padding-bottom: 50px;
+ .mainContent {
+ display: flex;
+ justify-content: center;
+ padding-top: 50px;
- .mainContent {
- display: flex;
- justify-content: center;
- padding-top: 50px;
+ .el-form-item__content {
+ width: 400px;
- .el-form-item__content {
- width: 400px;
-
- .el-select {
- width: 100%;
- }
- }
-
- .optionHandleSp {
- display: flex;
-
- .areaNumber,
- .moreNumber {
- flex: 1;
- }
-
- .telNumber {
- flex: 2;
- }
- }
-
- .optionBtn {
- display: flex;
- margin-top: 20px;
-
- .btn {
- padding: 12px 50px;
- }
- }
-
+ .el-select {
+ width: 100%;
}
- }
+ }
- &::v-deep .el-textarea__inner {
- background-color: #09152f;
- border: 1px solid #17324c;
- }
+ .optionHandleSp {
+ display: flex;
- ::v-deep .el-form-item__label {
- color: #4b9bb7;
- }
+ .areaNumber,
+ .moreNumber {
+ flex: 1;
+ }
- ::v-deep .el-input__inner {
- background-color: #09152f;
- border: 1px solid #17324c;
+ .telNumber {
+ flex: 2;
+ }
+ }
+
+ .optionBtn {
+ display: flex;
+ margin-top: 20px;
+
+ .btn {
+ padding: 12px 50px;
+ }
+ }
+
}
+ }
+
+ &::v-deep .el-textarea__inner {
+ background-color: #09152f;
+ border: 1px solid #17324c;
+ }
+
+ ::v-deep .el-form-item__label {
+ color: #4b9bb7;
+ }
+
+ ::v-deep .el-input__inner {
+ background-color: #09152f;
+ border: 1px solid #17324c;
+ }
}
-</style>
\ No newline at end of file
+</style>
--
Gitblit v1.8.0