Skip to content

Commit e951225

Browse files
author
piexlmax
committed
修改用户管理编辑模式，增加手机号邮箱操作
1 parent d025ae8 commit e951225

File tree

3 files changed

+98
-91
lines changed

3 files changed

+98
-91
lines changed

‎server/model/system/sys_user.go

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,4 +18,6 @@ type SysUser struct {
1818
AuthorityId string `json:"authorityId" gorm:"default:888;comment:用户角色ID"` // 用户角色ID
1919
Authority SysAuthority `json:"authority" gorm:"foreignKey:AuthorityId;references:AuthorityId;comment:用户角色"`
2020
Authorities []SysAuthority `json:"authorities" gorm:"many2many:sys_user_authority;"`
21+
Phone string `json:"phone" gorm:"comment:用户手机号"` // 用户角色ID
22+
Email string `json:"email" gorm:"comment:用户邮箱"` // 用户邮箱
2123
}

‎server/source/system/user.go

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,8 @@ func (u *user) TableName() string {
1818

1919
func (u *user) Initialize() error {
2020
entities := []system.SysUser{
21-
{UUID: uuid.NewV4(), Username: "admin", Password: "e10adc3949ba59abbe56e057f20f883e", NickName: "超级管理员", HeaderImg: "https://qmplusimg.henrongyi.top/gva_header.jpg", AuthorityId: "888"},
22-
{UUID: uuid.NewV4(), Username: "a303176530", Password: "3ec063004a6f31642261936a379fde3d", NickName: "QMPlusUser", HeaderImg: "https:///qmplusimg.henrongyi.top/1572075907logo.png", AuthorityId: "9528"},
21+
{UUID: uuid.NewV4(), Username: "admin", Password: "e10adc3949ba59abbe56e057f20f883e", NickName: "超级管理员", HeaderImg: "https://qmplusimg.henrongyi.top/gva_header.jpg", AuthorityId: "888", Phone: "17611111111", Email: "333333333@qq.com"},
22+
{UUID: uuid.NewV4(), Username: "a303176530", Password: "3ec063004a6f31642261936a379fde3d", NickName: "QMPlusUser", HeaderImg: "https:///qmplusimg.henrongyi.top/1572075907logo.png", AuthorityId: "9528", Phone: "17611111111", Email: "333333333@qq.com"},
2323
}
2424
if err := global.GVA_DB.Create(&entities).Error; err != nil {
2525
return errors.Wrap(err, u.TableName()+"表数据初始化失败!")

‎web/src/view/superAdmin/user/user.vue

Lines changed: 94 additions & 89 deletions
Original file line numberDiff line numberDiff line change
@@ -5,33 +5,21 @@
55
<div class="gva-btn-list">
66
<el-button size="small" type="primary" icon="plus" @click="addUser">新增用户</el-button>
77
</div>
8-
<el-table :data="tableData">
9-
<el-table-column align="left" label="头像" min-width="50">
8+
<el-table
9+
:data="tableData"
10+
row-key="ID"
11+
>
12+
<el-table-column align="left" label="头像" min-width="75">
1013
<template #default="scope">
1114
<CustomPic style="margin-top:8px" :pic-src="scope.row.headerImg" />
1215
</template>
1316
</el-table-column>
14-
<el-table-column align="left" label="UUID" min-width="250" prop="uuid" />
17+
<el-table-column align="left" label="ID" min-width="50" prop="ID" />
1518
<el-table-column align="left" label="用户名" min-width="150" prop="userName" />
16-
<el-table-column align="left" label="昵称" min-width="100" prop="nickName">
17-
<template #default="scope">
18-
<p v-if="!scope.row.editFlag" class="nickName">{{ scope.row.nickName }}
19-
<el-icon class="pointer" color="#66b1ff" @click="openEidt(scope.row)">
20-
<edit />
21-
</el-icon>
22-
</p>
23-
<p v-if="scope.row.editFlag" class="nickName">
24-
<el-input v-model="scope.row.nickName" />
25-
<el-icon class="pointer" color="#67c23a" @click="enterEdit(scope.row)">
26-
<check />
27-
</el-icon>
28-
<el-icon class="pointer" color="#f23c3c" @click="closeEdit(scope.row)">
29-
<close />
30-
</el-icon>
31-
</p>
32-
</template>
33-
</el-table-column>
34-
<el-table-column align="left" label="用户角色" min-width="150">
19+
<el-table-column align="left" label="昵称" min-width="150" prop="nickName" />
20+
<el-table-column align="left" label="手机号" min-width="180" prop="phone" />
21+
<el-table-column align="left" label="邮箱" min-width="180" prop="email" />
22+
<el-table-column align="left" label="用户角色" min-width="200">
3523
<template #default="scope">
3624
<el-cascader
3725
v-model="scope.row.authorityIds"
@@ -45,21 +33,24 @@
4533
/>
4634
</template>
4735
</el-table-column>
48-
<el-table-column align="left" label="操作" min-width="150">
36+
37+
<el-table-column label="操作" min-width="250" fixed="right">
4938
<template #default="scope">
50-
<el-popover v-model:visible="scope.row.visible" placement="top" width="160" trigger="click">
39+
<el-popover v-model:visible="scope.row.visible" placement="top" width="160">
5140
<p>确定要删除此用户吗</p>
5241
<div style="text-align: right; margin-top: 8px;">
5342
<el-button size="small" type="text" @click="scope.row.visible = false">取消</el-button>
5443
<el-button type="primary" size="small" @click="deleteUserFunc(scope.row)">确定</el-button>
5544
</div>
5645
<template #reference>
57-
<el-button type="text" icon="delete" size="small" @click="scope.row.visible = true">删除</el-button>
46+
<el-button type="text" icon="delete" size="small">删除</el-button>
5847
</template>
5948
</el-popover>
49+
<el-button type="text" icon="edit" size="small" @click="openEdit(scope.row)">编辑</el-button>
6050
<el-button type="text" icon="magic-stick" size="small" @click="resetPasswordFunc(scope.row)">重置密码</el-button>
6151
</template>
6252
</el-table-column>
53+
6354
</el-table>
6455
<div class="gva-pagination">
6556
<el-pagination
@@ -73,35 +64,52 @@
7364
/>
7465
</div>
7566
</div>
76-
<el-dialog v-model="addUserDialog" custom-class="user-dialog" title="新增用户">
77-
<el-form ref="userForm" :rules="rules" :model="userInfo" label-width="80px">
78-
<el-form-item label="用户名" prop="username">
79-
<el-input v-model="userInfo.username" />
80-
</el-form-item>
81-
<el-form-item label="密码" prop="password">
82-
<el-input v-model="userInfo.password" />
83-
</el-form-item>
84-
<el-form-item label="别名" prop="nickName">
85-
<el-input v-model="userInfo.nickName" />
86-
</el-form-item>
87-
<el-form-item label="用户角色" prop="authorityId">
88-
<el-cascader
89-
v-model="userInfo.authorityIds"
90-
style="width:100%"
91-
:options="authOptions"
92-
:show-all-levels="false"
93-
:props="{ multiple:true,checkStrictly: true,label:'authorityName',value:'authorityId',disabled:'disabled',emitPath:false}"
94-
:clearable="false"
95-
/>
96-
</el-form-item>
97-
<el-form-item label="头像" label-width="80px">
98-
<div style="display:inline-block" @click="openHeaderChange">
99-
<img v-if="userInfo.headerImg" class="header-img-box" :src="(userInfo.headerImg && userInfo.headerImg.slice(0, 4) !== 'http')?path+userInfo.headerImg:userInfo.headerImg">
100-
<div v-else class="header-img-box">从媒体库选择</div>
101-
</div>
102-
</el-form-item>
67+
<el-dialog
68+
v-model="addUserDialog"
69+
custom-class="user-dialog"
70+
title="用户"
71+
:show-close="false"
72+
:close-on-press-escape="false"
73+
:close-on-click-modal="false"
74+
>
75+
<div style="height:60vh;overflow:auto;padding:0 12px;">
76+
<el-form ref="userForm" :rules="rules" :model="userInfo" label-width="80px">
77+
<el-form-item v-if="dialogFlag === 'add'" label="用户名" prop="userName">
78+
<el-input v-model="userInfo.userName" />
79+
</el-form-item>
80+
<el-form-item v-if="dialogFlag === 'add'" label="密码" prop="password">
81+
<el-input v-model="userInfo.password" />
82+
</el-form-item>
83+
<el-form-item label="昵称" prop="nickName">
84+
<el-input v-model="userInfo.nickName" />
85+
</el-form-item>
86+
<el-form-item label="手机号" prop="phone">
87+
<el-input v-model="userInfo.phone" />
88+
</el-form-item>
89+
<el-form-item label="邮箱" prop="email">
90+
<el-input v-model="userInfo.email" />
91+
</el-form-item>
92+
<el-form-item label="用户角色" prop="authorityId">
93+
<el-cascader
94+
v-model="userInfo.authorityIds"
95+
style="width:100%"
96+
:options="authOptions"
97+
:show-all-levels="false"
98+
:props="{ multiple:true,checkStrictly: true,label:'authorityName',value:'authorityId',disabled:'disabled',emitPath:false}"
99+
:clearable="false"
100+
/>
101+
</el-form-item>
102+
<el-form-item label="头像" label-width="80px">
103+
<div style="display:inline-block" @click="openHeaderChange">
104+
<img v-if="userInfo.headerImg" class="header-img-box" :src="(userInfo.headerImg && userInfo.headerImg.slice(0, 4) !== 'http')?path+userInfo.headerImg:userInfo.headerImg">
105+
<div v-else class="header-img-box">从媒体库选择</div>
106+
</div>
107+
</el-form-item>
108+
109+
</el-form>
110+
111+
</div>
103112

104-
</el-form>
105113
<template #footer>
106114
<div class="dialog-footer">
107115
<el-button size="small" @click="closeAddUserDialog">取 消</el-button>
@@ -120,6 +128,7 @@ export default {
120128
</script>
121129

122130
<script setup>
131+
123132
import {
124133
getUserList,
125134
setUserAuthorities,
@@ -242,40 +251,12 @@ const setOptions = (authData) => {
242251
setAuthorityOptions(authData, authOptions.value)
243252
}
244253
245-
const backNickName = ref('')
246-
const openEidt = (row) => {
247-
if (tableData.value.some(item => item.editFlag)) {
248-
ElMessage('当前存在正在编辑的用户')
249-
return
250-
}
251-
backNickName.value = row.nickName
252-
row.editFlag = true
253-
}
254-
255-
const enterEdit = async(row) => {
256-
const res = await setUserInfo({ nickName: row.nickName, ID: row.ID })
257-
if (res.code === 0) {
258-
ElMessage({
259-
type: 'success',
260-
message: '设置成功'
261-
})
262-
}
263-
backNickName.value = ref('')
264-
row.editFlag = false
265-
}
266-
267-
const closeEdit = (row) => {
268-
row.nickName = backNickName.value
269-
backNickName.value = ''
270-
row.editFlag = false
271-
}
272-
273254
const deleteUserFunc = async(row) => {
274255
const res = await deleteUser({ id: row.ID })
275256
if (res.code === 0) {
276257
ElMessage.success('删除成功')
277-
await getTableData()
278258
row.visible = false
259+
await getTableData()
279260
}
280261
}
281262
@@ -286,11 +267,11 @@ const userInfo = ref({
286267
nickName: '',
287268
headerImg: '',
288269
authorityId: '',
289-
authorityIds: []
270+
authorityIds: [],
290271
})
291272
292273
const rules = ref({
293-
username: [
274+
userName: [
294275
{ required: true, message: '请输入用户名', trigger: 'blur' },
295276
{ min: 5, message: '最低5位字符', trigger: 'blur' }
296277
],
@@ -310,12 +291,25 @@ const enterAddUserDialog = async() => {
310291
userInfo.value.authorityId = userInfo.value.authorityIds[0]
311292
userForm.value.validate(async valid => {
312293
if (valid) {
313-
const res = await register(userInfo.value)
314-
if (res.code === 0) {
315-
ElMessage({ type: 'success', message: '创建成功' })
294+
const req = {
295+
...userInfo.value
296+
}
297+
if (dialogFlag.value === 'add') {
298+
const res = await register(req)
299+
if (res.code === 0) {
300+
ElMessage({ type: 'success', message: '创建成功' })
301+
await getTableData()
302+
closeAddUserDialog()
303+
}
304+
}
305+
if (dialogFlag.value === 'edit') {
306+
const res = await setUserInfo(req)
307+
if (res.code === 0) {
308+
ElMessage({ type: 'success', message: '编辑成功' })
309+
await getTableData()
310+
closeAddUserDialog()
311+
}
316312
}
317-
await getTableData()
318-
closeAddUserDialog()
319313
}
320314
})
321315
}
@@ -327,7 +321,11 @@ const closeAddUserDialog = () => {
327321
userInfo.value.authorityIds = []
328322
addUserDialog.value = false
329323
}
324+
325+
const dialogFlag = ref('add')
326+
330327
const addUser = () => {
328+
dialogFlag.value = 'add'
331329
addUserDialog.value = true
332330
}
333331
const changeAuthority = async(row, flag) => {
@@ -344,6 +342,13 @@ const changeAuthority = async(row, flag) => {
344342
ElMessage({ type: 'success', message: '角色设置成功' })
345343
}
346344
}
345+
346+
const openEdit = (row) => {
347+
dialogFlag.value = 'edit'
348+
userInfo.value = JSON.parse(JSON.stringify(row))
349+
addUserDialog.value = true
350+
}
351+
347352
</script>
348353
349354
<style lang="scss">

0 commit comments

Comments
 (0)