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
1 <template>
2 <div class="content">
3 <div class="user-info">
4 <el-form
5 ref="form"
6 label-width="100px"
7 :model="form"
8 class="form-wrapper"
9 :rules="rules"
10 >
11 <el-form-item label="用户名:" required>
12 <el-input v-model="form.loginName" clearable disabled />
13 </el-form-item>
14 <el-form-item label="姓名:">
15 <el-input v-model="form.name" clearable />
16 </el-form-item>
17 <el-form-item label="性别:">
18 <el-radio-group v-model="form.sex">
19 <el-radio
20 v-for="(item, index) in sexList"
21 :key="index"
22 :label="item.value"
23 >{{ item.name }}</el-radio>
24 </el-radio-group>
25 </el-form-item>
26 <el-form-item label="身份证号:" prop="idCard">
27 <el-input v-model="form.idCard" clearable />
28 </el-form-item>
29 <el-form-item label="手机号码:" prop="mobilePhone">
30 <el-input v-model="form.mobilePhone" clearable type="number" />
31 </el-form-item>
32 <el-form-item label="办公电话:">
33 <el-input v-model="form.telephone" clearable />
34 </el-form-item>
35 <el-form-item label="办公地址:">
36 <el-input v-model="form.address" clearable />
37 </el-form-item>
38 </el-form>
39 <div class="bottom-wrapper">
40 <el-button type="primary" @click="updateInfo">更新信息</el-button>
41 </div>
42 </div>
43 </div>
44 </template>
45
46 <script>
47 // import { api, getAction, putAction, getDictItems } from '@api/manageApi'
48 export default {
49 props: {
50 // userInfo: {
51 // type: Object,
52 // default: null
53 // }
54 },
55 data() {
56 return {
57 form: {
58 "id": "3127e455-43ba-45ff-9326-0e02ef89485e",
59 "name": "超级管理员",
60 "sort": 1,
61 "loginName": "admin",
62 "email": null,
63 "lastLoginTime": null,
64 "mobilePhone": "18291003568",
65 "isLocked": false,
66 "status": "ACTIVE",
67 "passwordChangeTime": "2021-12-10T08:01:01.569+0000",
68 "idCard": "612725202111021521",
69 "departmentId": "2eae5304-544f-4f5b-b354-8f5d47433c9b",
70 "departmentName": null,
71 "organizationId": "0bca67ae-1d9e-4b41-b057-f165586d24aa",
72 "sex": "0",
73 "isDuty": true,
74 "code": "123324",
75 "jobLevel": null,
76 "telephone": "028-87720898",
77 "address": "办公地点修改测试"
78 },
79 sexList: [],
80 rules: {
81 mobilePhone: [
82 {
83 pattern:
84 /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/,
85 message: '手机号码格式有误',
86 trigger: 'blur'
87 }
88 ],
89 idCard: [
90 {
91 pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,
92 message: '身份证号格式有误',
93 trigger: 'blur'
94 }
95 ]
96 }
97 }
98 },
99 watch: {
100 // userInfo: {
101 // handler: function(val) {
102 // if (val) {
103 // this.getUserInfo(val.id)
104 // }
105 // }
106 // }
107 },
108 mounted() {
109 // getDictItems('XB').then((res) => {
110 // if (res.status === 1) {
111 this.sexList = [
112 {
113 "id": "079c72b2-f3de-4a4f-b2a1-e5c8f085cc5f",
114 "createdAt": "2021-06-11T02:42:02.000+0000",
115 "updatedAt": "2021-09-03T09:21:46.000+0000",
116 "createdBy": "3127e455-43ba-45ff-9326-0e02ef89485e",
117 "updatedBy": "3127e455-43ba-45ff-9326-0e02ef89485e",
118 "sort": 2,
119 "name": "男",
120 "description": "",
121 "code": "N362",
122 "value": "0",
123 "parentId": null,
124 "baseDataCategoryId": "11441374-5e2a-4635-bfa5-d1a430222019",
125 "version": 1,
126 "valid": true,
127 "standard": false,
128 "standardName": null,
129 "standardValue": null,
130 "children": [],
131 "commonName": "男(N362)"
132 },
133 {
134 "id": "4d6f845d-6f6a-4848-8fc2-a3760764c196",
135 "createdAt": "2021-06-11T02:42:12.000+0000",
136 "updatedAt": "2021-09-03T09:21:46.000+0000",
137 "createdBy": "3127e455-43ba-45ff-9326-0e02ef89485e",
138 "updatedBy": "3127e455-43ba-45ff-9326-0e02ef89485e",
139 "sort": 1,
140 "name": "女",
141 "description": "",
142 "code": "N922",
143 "value": "1",
144 "parentId": null,
145 "baseDataCategoryId": "11441374-5e2a-4635-bfa5-d1a430222019",
146 "version": 1,
147 "valid": true,
148 "standard": false,
149 "standardName": null,
150 "standardValue": null,
151 "children": [],
152 "commonName": "女(N922)"
153 },
154 {
155 "id": "637c360b-d4e2-4afb-aa18-33624cf3abcb",
156 "createdAt": "2021-06-11T02:42:29.000+0000",
157 "updatedAt": "2021-09-03T09:21:43.000+0000",
158 "createdBy": "3127e455-43ba-45ff-9326-0e02ef89485e",
159 "updatedBy": "3127e455-43ba-45ff-9326-0e02ef89485e",
160 "sort": 0,
161 "name": "保密",
162 "description": "",
163 "code": "BM816",
164 "value": "2",
165 "parentId": null,
166 "baseDataCategoryId": "11441374-5e2a-4635-bfa5-d1a430222019",
167 "version": 1,
168 "valid": true,
169 "standard": false,
170 "standardName": null,
171 "standardValue": null,
172 "children": [],
173 "commonName": "保密(BM816)"
174 }
175 ]
176 // } else {
177 // this.$message.error({ message: res.message, showClose: true })
178 // }
179 // })
180 },
181 methods: {
182 // getUserInfo(id) {
183 // getAction(`${api.users}/${id}`).then((res) => {
184 // if (res.status === 1) {
185
186 // } else {
187 // this.$message.error({ message: res.message, showClose: true })
188 // }
189 // })
190 // },
191 // updateInfo() {
192 // this.$refs.form.validate((valid) => {
193 // if (valid) {
194 // putAction(`${api.users}/${this.form.id}`, this.form).then((res) => {
195 // if (res.status === 1) {
196 // this.$message.success({ message: res.message, showClose: true })
197 // this.getUserInfo(this.form.id)
198 // } else {
199 // this.$message.error({ message: res.message, showClose: true })
200 // }
201 // })
202 // }
203 // })
204 // }
205 }
206 }
207 </script>
208
209 <style scoped lang="scss">
210 .user-info {
211 margin: 36px 200px;
212 background: #ffffff;
213 max-height: 90%;
214 overflow-y: auto;
215 .form-wrapper {
216 padding: 24px 120px 0px;
217 .el-form-item {
218 margin-bottom: 24px;
219 .el-form-item__label {
220 color: #747e8c;
221 }
222 ::v-deep .el-input .el-input__inner {
223 padding: 0 8px;
224 height: 40px;
225 line-height: 40px;
226 border: 1px solid #dfe7f3;
227 }
228 }
229 }
230 .bottom-wrapper {
231 padding: 32px 120px 24px;
232 text-align: right;
233 }
234 }
235 </style>
1 <template>
2 <div class="information from-clues">
3 <div class="from-clues-header">
4 <el-form ref="ruleForm" :model="form" label-width="100px">
5 <el-form-item>
6 <Breadcrumb />
7 </el-form-item>
8 <el-row class="mb-5">
9 <el-col :span="3" class="btnColRight">
10 <btn nativeType="cx" @click="information()">基本信息</btn>
11 <btn nativeType="cx" @click="password()">修改秘密</btn>
12 </el-col>
13 </el-row>
14 </el-form>
15 </div>
16 <div class="from-clues-content">
17 <div class="contentbox">
18 <base-set :user-info="userData" v-show="isshow" />
19 <password-edit :user-info="userData" v-show="!isshow" />
20 </div>
21 </div>
22 <edit-dialog ref="dialogForm" />
23 <authorizationdiglog ref="rolesForm" />
24 </div>
25 </template>
26 <script>
27 import BaseSet from "./base-set.vue";
28 import PasswordEdit from "./password-edit.vue";
29 export default {
30 components: {
31 BaseSet,
32 PasswordEdit,
33 },
34 data() {
35 return {
36 active: "baseSet",
37 isshow: true,
38 };
39 },
40 computed: {},
41 watch: {},
42 created() {},
43 mounted() {},
44 methods: {
45 information() {
46 this.isshow = true;
47 },
48 password() {
49 this.isshow = false;
50 },
51 },
52 };
53 </script>
54
55 <style scoped lang="scss">
56 @import "~@/styles/public.scss";
57 .information{
58 .btnColRight{
59 margin-top: 20px;
60 }
61 /deep/.content {
62 .el-input__inner{
63 background: none;
64 }
65 .user-info {
66 background: none;
67 }
68 }
69 /deep/.el-tabs {
70
71 .el-tabs__content {
72 height: 100%;
73 width: 100%;
74
75
76 }
77 }
78 .contentbox{
79 height: 650px;
80 }
81 }
82
83 </style>
1 <template>
2 <div class="content">
3 <div class="user-info">
4 <el-form
5 ref="form"
6 label-width="100px"
7 :model="form"
8 class="form-wrapper"
9 :rules="rules"
10 >
11 <el-form-item label="旧密码:" required prop="oldPassword">
12 <el-input
13 v-model="form.oldPassword"
14 clearable
15 type="password"
16 show-password
17 />
18 </el-form-item>
19 <el-form-item label="新密码:" required prop="newPassword">
20 <el-input
21 v-model="form.newPassword"
22 clearable
23 type="password"
24 show-password
25 />
26 </el-form-item>
27 <el-form-item label="确认密码:" required prop="confirmPassword">
28 <el-input
29 v-model="form.confirmPassword"
30 clearable
31 type="password"
32 show-password
33 />
34 </el-form-item>
35 </el-form>
36 <div class="bottom-wrapper">
37 <el-button type="primary" @click="updatePassword">确认修改</el-button>
38 </div>
39 </div>
40 </div>
41 </template>
42
43 <script>
44 // import { updateUserPassword } from '@api/organizationManage'
45 export default {
46 props: {
47 // userInfo: {
48 // type: Object,
49 // default: null
50 // }
51 },
52 data() {
53 return {
54 form: {},
55 sexList: [],
56 userId: '',
57 rules: {
58 oldPassword: [
59 { required: true, message: '旧密码不能为空', trigger: 'blur' }
60 ],
61 newPassword: [
62 { required: true, message: '新密码不能为空', trigger: 'blur' }
63 ],
64 confirmPassword: [
65 { required: true, message: '确认密码不能为空', trigger: 'blur' },
66 { validator: this.validatorConfirmPassword, trigger: 'blur' }
67 ]
68 }
69 }
70 },
71 computed: {},
72 watch: {
73 // userInfo: {
74 // handler: function(val) {
75 // if (val) {
76 // this.userId = val.id
77 // }
78 // }
79 // }
80 },
81 mounted() {},
82 // methods: {
83 // validatorConfirmPassword(rule, value, callback) {
84 // const { newPassword } = this.form
85 // if (value !== newPassword) {
86 // callback('两次输入密码不一致')
87 // } else {
88 // callback()
89 // }
90 // },
91 // updatePassword() {
92 // this.$refs.form.validate((valid) => {
93 // if (valid) {
94 // const params = Object.assign({}, this.form, { id: this.userId })
95 // updateUserPassword(params).then((res) => {
96 // if (res.status === 1) {
97 // this.$message.success({ message: res.message, showClose: true })
98 // } else {
99 // this.$message.error({ message: res.message, showClose: true })
100 // }
101 // })
102 // }
103 // })
104 // }
105 // }
106 }
107 </script>
108
109 <style scoped lang="scss">
110 .user-info {
111 margin: 36px 200px;
112 background: #ffffff;
113 max-height: 90%;
114 overflow-y: auto;
115 .form-wrapper {
116 padding: 24px 120px 0px;
117 .el-form-item {
118 margin-bottom: 24px;
119 .el-form-item__label {
120 color: #747e8c;
121 }
122 ::v-deep .el-input .el-input__inner {
123 padding: 0 8px;
124 height: 40px;
125 line-height: 40px;
126 border: 1px solid #dfe7f3;
127 }
128 }
129 }
130 .bottom-wrapper {
131 padding: 32px 120px 24px;
132 text-align: right;
133 }
134 }
135 </style>
...@@ -343,6 +343,9 @@ export default { ...@@ -343,6 +343,9 @@ export default {
343 <style scoped lang="scss"> 343 <style scoped lang="scss">
344 @import "~@/styles/mixin.scss"; 344 @import "~@/styles/mixin.scss";
345 @import "~@/styles/public.scss"; 345 @import "~@/styles/public.scss";
346 .btnColRight{
347 margin-top: 20px;
348 }
346 /deep/.el-table__expand-icon{ 349 /deep/.el-table__expand-icon{
347 color: #fff; 350 color: #fff;
348 } 351 }
......
...@@ -253,4 +253,8 @@ export default { ...@@ -253,4 +253,8 @@ export default {
253 <style scoped lang="scss"> 253 <style scoped lang="scss">
254 @import "~@/styles/mixin.scss"; 254 @import "~@/styles/mixin.scss";
255 @import "~@/styles/public.scss"; 255 @import "~@/styles/public.scss";
256 .btnColRight{
257 margin-left: -30px;
258 margin-top: 20px;
259 }
256 </style> 260 </style>
......
...@@ -368,4 +368,7 @@ export default { ...@@ -368,4 +368,7 @@ export default {
368 <style scoped lang="scss"> 368 <style scoped lang="scss">
369 @import "~@/styles/mixin.scss"; 369 @import "~@/styles/mixin.scss";
370 @import "~@/styles/public.scss"; 370 @import "~@/styles/public.scss";
371 .btnColRight{
372 margin-top: 20px;
373 }
371 </style> 374 </style>
......