suojin
/
physical_examination_front
22
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

个人信息和密码修改拆分为两个tab

Browse Source
main
xuechunyuan 3 years ago
parent 511da8302d
commit bc76ae576f
4 changed files with 285 additions and 130 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. BIN
      dist.zip
  2. 2
      src/config/website.js
  3. 269
      src/option/user/info.js
  4. 144
      src/views/system/userinfo.vue

BIN
dist.zip
View File

Binary file not shown.

2
src/config/website.js
Unescape View File

@ -48,5 +48,5 @@ export default {
ssoUrl: 'http://localhost:8100/oauth/authorize?client_id=saber&response_type=code&redirect_uri=', ssoUrl: 'http://localhost:8100/oauth/authorize?client_id=saber&response_type=code&redirect_uri=',
// 单点登录回调地址(Saber服务的地址) // 单点登录回调地址(Saber服务的地址)
redirectUri: 'http://localhost:1888', redirectUri: 'http://localhost:1888',
filePrex: 'http://192.168.1.106:9000',//'http://www.qdscgs.com:9091',// 图片前缀 filePrex: 'http://www.qdscgs.com:9091',//'http://192.168.1.106:9000',// 图片前缀
} }

269
src/option/user/info.js
Unescape View File

@ -1,91 +1,188 @@
import website from "../../config/website"; import website from "../../config/website";
import { Message } from 'element-ui'; import { Message } from 'element-ui';
export default { // export default {
tabs: true, // tabs: true,
tabsActive: 1, // tabsActive: 1,
group: [ // group: [
{ // {
label: '个人信息', // label: '个人信息',
prop: 'info', // prop: 'info',
column: [{ // column: [{
label: '头像', // label: '头像',
prop: 'avatar', // prop: 'avatar',
type: 'upload', // type: 'upload',
listType: 'picture-img', // listType: 'picture-img',
propsHttp: { // propsHttp: {
home: website.filePrex, // home: website.filePrex,
res: 'data', // res: 'data',
url: 'link', // url: 'link',
}, // },
// canvasOption: { // // canvasOption: {
// text: ' ', // // text: ' ',
// ratio: 0.1 // // ratio: 0.1
// }, // // },
fileType: 'img',//img/video/audio, // fileType: 'img',//img/video/audio,
accept: 'image/png, image/jpeg', // accept: 'image/png, image/jpeg',
action: '/api/blade-resource/oss/endpoint/put-file', // action: '/api/blade-resource/oss/endpoint/put-file',
tip: '只能上传jpg/png用户头像，且不超过500kb', // tip: '只能上传jpg/png用户头像，且不超过500kb',
span: 12, // span: 12,
row: true, // row: true,
prop: 'avatar', // prop: 'avatar',
tip: '只能上传jpg/png用户头像，且不超过500kb', // tip: '只能上传jpg/png用户头像，且不超过500kb',
action: '/api/blade-resource/oss/endpoint/put-file', // action: '/api/blade-resource/oss/endpoint/put-file',
uploadBefore: (file, done, loading) => { // uploadBefore: (file, done, loading) => {
if (['image/png', 'image/jpeg'].indexOf(file.type) == -1) { // if (['image/png', 'image/jpeg'].indexOf(file.type) == -1) {
Message({ // Message({
message: '只能上传jpg/png用户头像', // message: '只能上传jpg/png用户头像',
type: 'error' // type: 'error'
}); // });
loading(); // loading();
} // }
else { // else {
done(); // done();
} // }
} // }
}, { // }, {
label: '姓名', // label: '姓名',
span: 12, // span: 12,
row: true, // row: true,
prop: 'realName' // prop: 'realName'
}, { // }, {
label: '用户名', // label: '用户名',
span: 12, // span: 12,
row: true, // row: true,
prop: 'name' // prop: 'name'
}, { // }, {
label: '手机号', // label: '手机号',
span: 12, // span: 12,
row: true, // row: true,
prop: 'phone' // prop: 'phone'
}, { // }, {
label: '邮箱', // label: '邮箱',
prop: 'email', // prop: 'email',
span: 12, // span: 12,
row: true, // row: true,
}] // }]
// },
// {
// label: '修改密码',
// prop: 'password',
// column: [{
// label: '原密码',
// span: 12,
// row: true,
// type: 'password',
// prop: 'oldPassword'
// }, {
// label: '新密码',
// span: 12,
// row: true,
// type: 'password',
// prop: 'newPassword'
// }, {
// label: '确认密码',
// span: 12,
// row: true,
// type: 'password',
// prop: 'newPassword1'
// }]
// }
// ],
// }
export const userInfoOption = {
column: [{
label: '头像',
prop: 'avatar',
type: 'upload',
listType: 'picture-img',
propsHttp: {
home: website.filePrex,
res: 'data',
url: 'link',
}, },
{ fileType: 'img',//img/video/audio,
label: '修改密码', accept: 'image/png, image/jpeg',
prop: 'password', action: '/api/blade-resource/oss/endpoint/put-file',
column: [{ tip: '只能上传jpg/png用户头像，且不超过500kb',
label: '原密码', span: 12,
span: 12, row: true,
row: true, prop: 'avatar',
type: 'password', tip: '只能上传jpg/png用户头像，且不超过500kb',
prop: 'oldPassword' action: '/api/blade-resource/oss/endpoint/put-file',
}, { uploadBefore: (file, done, loading) => {
label: '新密码', if (['image/png', 'image/jpeg'].indexOf(file.type) == -1) {
span: 12, Message({
row: true, message: '只能上传jpg/png用户头像',
type: 'password', type: 'error'
prop: 'newPassword' });
}, { loading();
label: '确认密码', }
span: 12, else {
row: true, done();
type: 'password', }
prop: 'newPassword1'
}]
} }
], }, {
label: '姓名',
span: 12,
row: true,
prop: 'realName'
}, {
label: '用户名',
span: 12,
row: true,
prop: 'name'
}, {
label: '手机号',
span: 12,
row: true,
prop: 'phone'
}, {
label: '邮箱',
prop: 'email',
span: 12,
row: true,
}]
} }
export const userPwdOption = {
column: [{
label: '原密码',
span: 12,
row: true,
type: 'password',
prop: 'oldPassword',
rules: [{
required: true,
message: "请输入原密码",
trigger: "blur"
}]
}, {
label: '新密码',
span: 12,
row: true,
type: 'password',
prop: 'newPassword',
rules: [{
required: true,
message: "请输入新密码",
trigger: "blur"
}]
}, {
label: '确认密码',
span: 12,
row: true,
type: 'password',
prop: 'newPassword1',
rules: [{ validator: validatePass2, trigger: 'blur' }]
}]
}
const validatePass2 = (rule, value, callback) => {
if (value === '') {
callback(new Error('请再次输入密码'));
} else if (value !== this.obj.password) {
callback(new Error('两次输入密码不一致!'));
} else {
callback();
}
};

144
src/views/system/userinfo.vue
Unescape View File

@ -1,14 +1,19 @@
<template> <template>
<div> <div>
<basic-container> <basic-container>
<avue-form :option="option" v-model="form" @tab-click="handleTabClick" <avue-tabs :option="tabOption" @change="handleTabClick"></avue-tabs>
@submit="handleSubmit"></avue-form> <div v-if="index === 0">
<avue-form :option="userInfoOption" v-model="form" @submit="handleSubmit"></avue-form>
</div>
<div v-else-if="index === 1"><avue-form ref="pwdForm" :option="userPwdOption" v-model="pwdform" @submit="handleSubmit2">
</avue-form>
</div>
</basic-container> </basic-container>
</div> </div>
</template> </template>
<script> <script>
import option from "@/option/user/info"; import { userInfoOption } from "@/option/user/info";
import { getUserInfo, updateInfo, updatePassword } from "@/api/system/user"; import { getUserInfo, updateInfo, updatePassword } from "@/api/system/user";
import md5 from 'js-md5'; import md5 from 'js-md5';
import func from "@/util/func"; import func from "@/util/func";
@ -16,10 +21,61 @@ import func from "@/util/func";
export default { export default {
data() { data() {
var validatePass2 = (rule, value, callback) => {
if (value === '') {
callback(new Error('请再次输入密码'));
} else if (value !== this.pwdform.newPassword1) {
callback(new Error('两次输入密码不一致!'));
} else {
callback();
}
};
return { return {
index: 0, index: 0,
option: option, tabOption: {
form: {} column: [{
label: '个人信息',
prop: '0',
}, {
label: '修改密码',
prop: '1',
},]
},
userInfoOption: userInfoOption,
userPwdOption: {
column: [{
label: '原密码',
span: 12,
row: true,
type: 'password',
prop: 'oldPassword',
rules: [{
required: true,
message: "请输入原密码",
trigger: "blur"
}]
}, {
label: '新密码',
span: 12,
row: true,
type: 'password',
prop: 'newPassword',
rules: [{
required: true,
message: "请输入新密码",
trigger: "blur"
}]
}, {
label: '确认密码',
span: 12,
row: true,
type: 'password',
prop: 'newPassword1',
rules: [{ validator: validatePass2, trigger: 'blur' }]
}]
},
form: {},
pwdform: {}
}; };
}, },
created() { created() {
@ -27,43 +83,42 @@ export default {
}, },
methods: { methods: {
handleSubmit(form, done) { handleSubmit(form, done) {
if (this.index === 0) { updateInfo(form).then(res => {
updateInfo(form).then(res => { if (res.data.success) {
if (res.data.success) { this.$message({
this.$message({ type: "success",
type: "success", message: "修改信息成功!"
message: "修改信息成功!" });
}); } else {
} else { this.$message({
this.$message({ type: "error",
type: "error", message: res.data.msg
message: res.data.msg });
}); }
} done();
done(); }, error => {
}, error => { window.console.log(error);
window.console.log(error); done();
done(); })
}) },
} else { handleSubmit2(form, done) {
updatePassword(md5(form.oldPassword), md5(form.newPassword), md5(form.newPassword1)).then(res => { updatePassword(md5(form.oldPassword), md5(form.newPassword), md5(form.newPassword1)).then(res => {
if (res.data.success) { if (res.data.success) {
this.$message({ this.$message({
type: "success", type: "success",
message: "修改密码成功!" message: "修改密码成功!"
}); });
} else { } else {
this.$message({ this.$message({
type: "error", type: "error",
message: res.data.msg message: res.data.msg
}); });
} }
done(); done();
}, error => { }, error => {
window.console.log(error); window.console.log(error);
done(); done();
}) })
}
}, },
handleWitch() { handleWitch() {
if (this.index === 0) { if (this.index === 0) {
@ -81,7 +136,10 @@ export default {
} }
}, },
handleTabClick(tabs) { handleTabClick(tabs) {
this.index = func.toInt(tabs.index); if(tabs.prop != '1'){
this.$refs.pwdForm.resetForm();
}
this.index = func.toInt(tabs.prop);
this.handleWitch(); this.handleWitch();
} }
} }

Write Preview
Loading…
Cancel
Save