Skip to content

bdc / bdcjg-web

Go to a project
Toggle navigation
Toggle navigation pinning
f8a7f1e2 by xiaomiao
Options

增加个人中心模块

1 parent 3dfb9317
Inline Side-by-side
Showing 6 changed files with 463 additions and 0 deletions
<template>
<div class="content">
<div class="user-info">
<el-form
ref="form"
label-width="100px"
:model="form"
class="form-wrapper"
:rules="rules"
>
<el-form-item label="用户名:" required>
<el-input v-model="form.loginName" clearable disabled />
</el-form-item>
<el-form-item label="姓名:">
<el-input v-model="form.name" clearable />
</el-form-item>
<el-form-item label="性别:">
<el-radio-group v-model="form.sex">
<el-radio
v-for="(item, index) in sexList"
:key="index"
:label="item.value"
>{{ item.name }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="身份证号:" prop="idCard">
<el-input v-model="form.idCard" clearable />
</el-form-item>
<el-form-item label="手机号码:" prop="mobilePhone">
<el-input v-model="form.mobilePhone" clearable type="number" />
</el-form-item>
<el-form-item label="办公电话:">
<el-input v-model="form.telephone" clearable />
</el-form-item>
<el-form-item label="办公地址:">
<el-input v-model="form.address" clearable />
</el-form-item>
</el-form>
<div class="bottom-wrapper">
<el-button type="primary" @click="updateInfo">更新信息</el-button>
</div>
</div>
</div>
</template>
<script>
// import { api, getAction, putAction, getDictItems } from '@api/manageApi'
export default {
props: {
// userInfo: {
// type: Object,
// default: null
// }
},
data() {
return {
form: {
"id": "3127e455-43ba-45ff-9326-0e02ef89485e",
"name": "超级管理员",
"sort": 1,
"loginName": "admin",
"email": null,
"lastLoginTime": null,
"mobilePhone": "18291003568",
"isLocked": false,
"status": "ACTIVE",
"passwordChangeTime": "2021-12-10T08:01:01.569+0000",
"idCard": "612725202111021521",
"departmentId": "2eae5304-544f-4f5b-b354-8f5d47433c9b",
"departmentName": null,
"organizationId": "0bca67ae-1d9e-4b41-b057-f165586d24aa",
"sex": "0",
"isDuty": true,
"code": "123324",
"jobLevel": null,
"telephone": "028-87720898",
"address": "办公地点修改测试"
},
sexList: [],
rules: {
mobilePhone: [
{
pattern:
/^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/,
message: '手机号码格式有误',
trigger: 'blur'
}
],
idCard: [
{
pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,
message: '身份证号格式有误',
trigger: 'blur'
}
]
}
}
},
watch: {
// userInfo: {
// handler: function(val) {
// if (val) {
// this.getUserInfo(val.id)
// }
// }
// }
},
mounted() {
// getDictItems('XB').then((res) => {
// if (res.status === 1) {
this.sexList = [
{
"id": "079c72b2-f3de-4a4f-b2a1-e5c8f085cc5f",
"createdAt": "2021-06-11T02:42:02.000+0000",
"updatedAt": "2021-09-03T09:21:46.000+0000",
"createdBy": "3127e455-43ba-45ff-9326-0e02ef89485e",
"updatedBy": "3127e455-43ba-45ff-9326-0e02ef89485e",
"sort": 2,
"name": "男",
"description": "",
"code": "N362",
"value": "0",
"parentId": null,
"baseDataCategoryId": "11441374-5e2a-4635-bfa5-d1a430222019",
"version": 1,
"valid": true,
"standard": false,
"standardName": null,
"standardValue": null,
"children": [],
"commonName": "男(N362)"
},
{
"id": "4d6f845d-6f6a-4848-8fc2-a3760764c196",
"createdAt": "2021-06-11T02:42:12.000+0000",
"updatedAt": "2021-09-03T09:21:46.000+0000",
"createdBy": "3127e455-43ba-45ff-9326-0e02ef89485e",
"updatedBy": "3127e455-43ba-45ff-9326-0e02ef89485e",
"sort": 1,
"name": "女",
"description": "",
"code": "N922",
"value": "1",
"parentId": null,
"baseDataCategoryId": "11441374-5e2a-4635-bfa5-d1a430222019",
"version": 1,
"valid": true,
"standard": false,
"standardName": null,
"standardValue": null,
"children": [],
"commonName": "女(N922)"
},
{
"id": "637c360b-d4e2-4afb-aa18-33624cf3abcb",
"createdAt": "2021-06-11T02:42:29.000+0000",
"updatedAt": "2021-09-03T09:21:43.000+0000",
"createdBy": "3127e455-43ba-45ff-9326-0e02ef89485e",
"updatedBy": "3127e455-43ba-45ff-9326-0e02ef89485e",
"sort": 0,
"name": "保密",
"description": "",
"code": "BM816",
"value": "2",
"parentId": null,
"baseDataCategoryId": "11441374-5e2a-4635-bfa5-d1a430222019",
"version": 1,
"valid": true,
"standard": false,
"standardName": null,
"standardValue": null,
"children": [],
"commonName": "保密(BM816)"
}
]
// } else {
// this.$message.error({ message: res.message, showClose: true })
// }
// })
},
methods: {
// getUserInfo(id) {
// getAction(`${api.users}/${id}`).then((res) => {
// if (res.status === 1) {
// } else {
// this.$message.error({ message: res.message, showClose: true })
// }
// })
// },
// updateInfo() {
// this.$refs.form.validate((valid) => {
// if (valid) {
// putAction(`${api.users}/${this.form.id}`, this.form).then((res) => {
// if (res.status === 1) {
// this.$message.success({ message: res.message, showClose: true })
// this.getUserInfo(this.form.id)
// } else {
// this.$message.error({ message: res.message, showClose: true })
// }
// })
// }
// })
// }
}
}
</script>
<style scoped lang="scss">
.user-info {
margin: 36px 200px;
background: #ffffff;
max-height: 90%;
overflow-y: auto;
.form-wrapper {
padding: 24px 120px 0px;
.el-form-item {
margin-bottom: 24px;
.el-form-item__label {
color: #747e8c;
}
::v-deep .el-input .el-input__inner {
padding: 0 8px;
height: 40px;
line-height: 40px;
border: 1px solid #dfe7f3;
}
}
}
.bottom-wrapper {
padding: 32px 120px 24px;
text-align: right;
}
}
</style>
<template>
<div class="information from-clues">
<div class="from-clues-header">
<el-form ref="ruleForm" :model="form" label-width="100px">
<el-form-item>
<Breadcrumb />
</el-form-item>
<el-row class="mb-5">
<el-col :span="3" class="btnColRight">
<btn nativeType="cx" @click="information()">基本信息</btn>
<btn nativeType="cx" @click="password()">修改秘密</btn>
</el-col>
</el-row>
</el-form>
</div>
<div class="from-clues-content">
<div class="contentbox">
<base-set :user-info="userData" v-show="isshow" />
<password-edit :user-info="userData" v-show="!isshow" />
</div>
</div>
<edit-dialog ref="dialogForm" />
<authorizationdiglog ref="rolesForm" />
</div>
</template>
<script>
import BaseSet from "./base-set.vue";
import PasswordEdit from "./password-edit.vue";
export default {
components: {
BaseSet,
PasswordEdit,
},
data() {
return {
active: "baseSet",
isshow: true,
};
},
computed: {},
watch: {},
created() {},
mounted() {},
methods: {
information() {
this.isshow = true;
},
password() {
this.isshow = false;
},
},
};
</script>
<style scoped lang="scss">
@import "~@/styles/public.scss";
.information{
.btnColRight{
margin-top: 20px;
}
/deep/.content {
.el-input__inner{
background: none;
}
.user-info {
background: none;
}
}
/deep/.el-tabs {
.el-tabs__content {
height: 100%;
width: 100%;
}
}
.contentbox{
height: 650px;
}
}
</style>
<template>
<div class="content">
<div class="user-info">
<el-form
ref="form"
label-width="100px"
:model="form"
class="form-wrapper"
:rules="rules"
>
<el-form-item label="旧密码:" required prop="oldPassword">
<el-input
v-model="form.oldPassword"
clearable
type="password"
show-password
/>
</el-form-item>
<el-form-item label="新密码:" required prop="newPassword">
<el-input
v-model="form.newPassword"
clearable
type="password"
show-password
/>
</el-form-item>
<el-form-item label="确认密码:" required prop="confirmPassword">
<el-input
v-model="form.confirmPassword"
clearable
type="password"
show-password
/>
</el-form-item>
</el-form>
<div class="bottom-wrapper">
<el-button type="primary" @click="updatePassword">确认修改</el-button>
</div>
</div>
</div>
</template>
<script>
// import { updateUserPassword } from '@api/organizationManage'
export default {
props: {
// userInfo: {
// type: Object,
// default: null
// }
},
data() {
return {
form: {},
sexList: [],
userId: '',
rules: {
oldPassword: [
{ required: true, message: '旧密码不能为空', trigger: 'blur' }
],
newPassword: [
{ required: true, message: '新密码不能为空', trigger: 'blur' }
],
confirmPassword: [
{ required: true, message: '确认密码不能为空', trigger: 'blur' },
{ validator: this.validatorConfirmPassword, trigger: 'blur' }
]
}
}
},
computed: {},
watch: {
// userInfo: {
// handler: function(val) {
// if (val) {
// this.userId = val.id
// }
// }
// }
},
mounted() {},
// methods: {
// validatorConfirmPassword(rule, value, callback) {
// const { newPassword } = this.form
// if (value !== newPassword) {
// callback('两次输入密码不一致')
// } else {
// callback()
// }
// },
// updatePassword() {
// this.$refs.form.validate((valid) => {
// if (valid) {
// const params = Object.assign({}, this.form, { id: this.userId })
// updateUserPassword(params).then((res) => {
// if (res.status === 1) {
// this.$message.success({ message: res.message, showClose: true })
// } else {
// this.$message.error({ message: res.message, showClose: true })
// }
// })
// }
// })
// }
// }
}
</script>
<style scoped lang="scss">
.user-info {
margin: 36px 200px;
background: #ffffff;
max-height: 90%;
overflow-y: auto;
.form-wrapper {
padding: 24px 120px 0px;
.el-form-item {
margin-bottom: 24px;
.el-form-item__label {
color: #747e8c;
}
::v-deep .el-input .el-input__inner {
padding: 0 8px;
height: 40px;
line-height: 40px;
border: 1px solid #dfe7f3;
}
}
}
.bottom-wrapper {
padding: 32px 120px 24px;
text-align: right;
}
}
</style>
......@@ -343,6 +343,9 @@ export default {
<style scoped lang="scss">
@import "~@/styles/mixin.scss";
@import "~@/styles/public.scss";
.btnColRight{
margin-top: 20px;
}
/deep/.el-table__expand-icon{
color: #fff;
}
......
......@@ -253,4 +253,8 @@ export default {
<style scoped lang="scss">
@import "~@/styles/mixin.scss";
@import "~@/styles/public.scss";
.btnColRight{
margin-left: -30px;
margin-top: 20px;
}
</style>
......
......@@ -368,4 +368,7 @@ export default {
<style scoped lang="scss">
@import "~@/styles/mixin.scss";
@import "~@/styles/public.scss";
.btnColRight{
margin-top: 20px;
}
</style>
......