fix: remove avatar upload in personal center; fix system management module issues

This commit is contained in:
张家训
2026-08-20 19:45:10 +08:00
parent fe64d97063
commit a2d71f720c
5 changed files with 138 additions and 135 deletions
+23 -36
View File
@@ -17,38 +17,33 @@
<Form :rules="userRuleCustom" :model="userFormItem" ref="userFormItem" :label-width="120"
label-position="right">
<Row :gutter="32">
<Col span="32">
<FormItem label="头像" prop="avatar">
<uploadAvatar ref="uploadAvatar"></uploadAvatar>
</FormItem>
</Col>
<Col span="32">
<FormItem label="登录账号" prop="username">
<Col span="24">
<FormItem label="登录账号">
{{ userFormItem.username }}
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="用户昵称" prop="nickname">
<Input type="text" class="form-input" v-model="userFormItem.nickname" placeholder="请输入用户昵称"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="联系电话" prop="phone">
<Input type="text" class="form-input" v-model="userFormItem.phone" placeholder="请输入联系电话"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="电子邮箱" prop="email">
<Input type="text" class="form-input" v-model="userFormItem.email" placeholder="请输入电子邮箱"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="个性签名" prop="signature">
<Input type="textarea" class="form-input" v-model="userFormItem.signature" :rows="4" maxlength="100"
show-word-limit placeholder="请输入个性签名"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem>
<Button type="primary"
:loading="userSubmitLoading"
@@ -66,24 +61,24 @@
<Form :rules="changePasswordRuleCustom" :model="changePasswordFormItem" ref="changePasswordFormItem"
:label-width="120" label-position="right">
<Row :gutter="32">
<Col span="32">
<FormItem label="登录账号" prop="username">
<Col span="24">
<FormItem label="登录账号">
{{ userFormItem.username }}
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="原密码" prop="oldPassword">
<Input type="password" password class="form-input" v-model="changePasswordFormItem.oldPassword"
placeholder="请输入原密码"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="新密码" prop="newPassword">
<Input type="password" password class="form-input" v-model="changePasswordFormItem.newPassword"
placeholder="请输入新密码"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem>
<Button type="primary"
:loading="changePasswordSubmitLoading"
@@ -102,14 +97,10 @@
<script>
import {getPersonalInfo, update, updatePassword} from '@/api/sys/sys-user'
import uploadAvatar from "@/components/my-components/upload-avatar"
import {mapActions} from "vuex";
import {mapActions, mapMutations} from "vuex";
export default {
name: "personal-center",
components: {
uploadAvatar
},
data() {
return {
currentMenu: 'basicInfo',
@@ -118,16 +109,12 @@
id: '',
username: '',
nickname: '',
avatar: '',
phone: '',
email: '',
signature: '',
status: '1',
},
userRuleCustom: {
username: [{
required: true, message: '请输入登录账号', trigger: 'blur'
}],
nickname: [{
required: true, message: '请输入用户昵称', trigger: 'blur'
}],
@@ -135,7 +122,7 @@
required: true, message: '请输入联系电话', trigger: 'blur'
}],
email: [{
required: true, message: '请输入联系电话', trigger: 'blur'
required: true, message: '请输入电子邮箱', trigger: 'blur'
}],
},
changePasswordSubmitLoading: false,
@@ -158,19 +145,17 @@
...mapActions([
'handleLogOut'
]),
...mapMutations([
'setNickname'
]),
toChangeMenu(name) {
this.currentMenu = name
},
getPersonalInfo() {
getPersonalInfo().then(res => {
let temp = res.data.data.entity
let temp = res.data.data
if (!temp) return
this.userFormItem.id = temp.id
this.userFormItem.avatar = temp.avatar
let avatar = temp.avatar
if (temp.avatar === null || temp.avatar === "") {
avatar = "https://732128096-read.oss-cn-hangzhou.aliyuncs.com/avatar.png"
}
this.$refs.uploadAvatar.setData(temp.id, avatar);
this.userFormItem.username = temp.username
this.userFormItem.nickname = temp.nickname
this.userFormItem.phone = temp.phone
@@ -191,6 +176,8 @@
setTimeout(() => {
this.userSubmitLoading = false
this.$Message.success("个人信息保存并生效!")
// 同步更新顶栏昵称
this.setNickname(this.userFormItem.nickname)
}, 300)
})
}
@@ -205,8 +192,8 @@
updatePassword(data).then(res => {
setTimeout(() => {
this.changePasswordSubmitLoading = false
if (res.data.code === 419) {
this.$Message.warning(res.data.message)
if (res.data.code === 419 || !res.data.success) {
this.$Message.warning(res.data.message || "修改密码失败")
} else {
this.$Message.success("修改密码保存并生效!")
this.handleLogOut().then(() => {
+24 -21
View File
@@ -69,7 +69,7 @@
<Modal v-model="modal" :title="modalTitle" :styles="{top: '20px'}" width="500" :mask-closable="false" @on-cancel="cancel()">
<Form :rules="ruleCustom" :model="formItem" ref="formItem" :label-width="120" label-position="right">
<Row :gutter="32">
<Col span="32">
<Col span="24">
<FormItem label="上级部门" prop="parentId">
<treeselect ref="treeSelect"
class="form-input"
@@ -81,22 +81,22 @@
/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="部门名称" prop="deptName">
<Input type="text" class="form-input" v-model="formItem.deptName" placeholder="请输入部门名称"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="部门编码" prop="deptCode">
<Input type="text" class="form-input" v-model="formItem.deptCode" placeholder="请输入部门编码"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="部门排序" prop="sort">
<InputNumber :min="0" v-model="formItem.sort" placeholder="请输入部门排序"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="部门描述" prop="deptDesc">
<Input type="textarea" maxlength="100" show-word-limit :rows="4" class="form-input" v-model="formItem.deptDesc" placeholder="请输入部门描述"/>
</FormItem>
@@ -216,7 +216,7 @@
},
ruleCustom: {
parentId: [{
type: 'number', required: true, message: '请选择上级部门', trigger: 'blur'
required: true, message: '请选择上级部门', trigger: 'change'
}],
deptName: [{
required: true, message: '请输入部门名称', trigger: 'blur'
@@ -256,7 +256,7 @@
getDataList(data).then(res => {
let page = res.data.data
if (page != null ){
this.pageTotal = page.size
this.pageTotal = page.total
this.dataList = page.records
}
// 延迟300毫秒,给它更流畅的感觉
@@ -276,24 +276,29 @@
this.modalTitle = "编辑"
let temp = this.dataList[index]
this.formItem.id = temp.id
this.formItem.parentId = temp.parentId
this.formItem.deptName = temp.deptName
this.formItem.deptCode = temp.deptCode
this.formItem.level = temp.level
this.formItem.deptDesc = temp.deptDesc
this.formItem.sort = temp.sort
this.modal = true
this.addModal = false
this.editModal = true
this.modal = true
this.$nextTick(() => {
// 清除上次校验状态,避免编辑回显报红
if (this.$refs.formItem) {
this.$refs.formItem.resetFields()
}
this.formItem.id = temp.id
this.formItem.parentId = temp.parentId
this.formItem.deptName = temp.deptName
this.formItem.deptCode = temp.deptCode
this.formItem.level = temp.level
this.formItem.deptDesc = temp.deptDesc
this.formItem.sort = temp.sort
})
},
submit(formItem) {
// modal 提交
this.$refs[formItem].validate((valid) => {
if (valid) {
if (this.addModal) {//添加
console.log("add")
add(this.formItem).then(res => {
this.refresh()
this.getTreeSelectList()
@@ -302,7 +307,6 @@
this.$Message.success("添加成功!")
})
} else {//编辑
console.log("edit")
update(this.formItem).then(res => {
this.refresh()
this.getTreeSelectList()
@@ -324,10 +328,9 @@
let temp = this.dataList[index]
let data = {
id: temp.id,
status: '9'
id: temp.id
}
update(data).then(res => {
remove(data).then(res => {
this.refresh()
this.getDataList()
this.$Message.success("删除成功!")
+39 -34
View File
@@ -71,7 +71,7 @@
@on-cancel="cancel()">
<Form :rules="ruleCustom" :model="formItem" ref="formItem" :label-width="120" label-position="right">
<Row :gutter="32">
<Col span="32">
<Col span="24">
<FormItem label="上级菜单" prop="pId">
<treeselect ref="treeSelect"
class="form-input"
@@ -82,37 +82,37 @@
/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="菜单名称" prop="permissionName">
<Input type="text" class="form-input" v-model="formItem.permissionName" placeholder="请输入菜单名称"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="菜单编码" prop="permissionCode">
<Input type="text" class="form-input" v-model="formItem.permissionCode" placeholder="请输入菜单编码"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="菜单图标" prop="icon">
<icon-choose v-model="formItem.icon"></icon-choose>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="路由地址" prop="url">
<Input type="text" class="form-input" v-model="formItem.url" placeholder="请输入路由地址"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="组件地址" prop="component">
<Input type="text" class="form-input" v-model="formItem.component" placeholder="请输入组件地址"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="菜单排序" prop="sort">
<InputNumber :min="0" v-model="formItem.sort" placeholder="请输入菜单排序"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="菜单描述" prop="permissionDesc">
<Input type="textarea" maxlength="100" show-word-limit :rows="4" class="form-input"
v-model="formItem.permissionDesc" placeholder="请输入菜单描述"/>
@@ -133,7 +133,7 @@
</template>
<script>
import {getTreeList, getTreeSelectList, getDataList, add, update} from '@/api/sys/sys-permission'
import {getTreeList, getTreeSelectList, getDataList, add, update, remove} from '@/api/sys/sys-permission'
import {objectUtil, utils, exportExcel} from "@/common/js/util"
import IconChoose from "@/components/my-components/icon-choose"
import Treeselect from '@riophae/vue-treeselect'
@@ -261,19 +261,15 @@
// 获取选中的节点信息
let choose = this.$refs.tree.getSelectedNodes();
if (choose.length > 0) {
console.log("选中!")
this.formItem.parentId = choose[0].id
this.formItem.level = choose[0].level + 1
this.search.parentId = choose[0].id
this.getDataList()
} else {
console.log("取消选中!")
}
},
getTreeList() {
getTreeList().then(res => {
this.treeList = res.data.data
console.log("treeList:",this.treeList)
})
},
getTreeSelectList() {
@@ -287,8 +283,7 @@
this.tableLoading = true
getDataList(data).then(res => {
let page = res.data.data
console.log(page)
this.pageTotal = page.size
this.pageTotal = page.total
this.dataList = page.records
// 延迟300毫秒,给它更流畅的感觉
setTimeout(() => {
@@ -303,36 +298,46 @@
}
this.modalTitle = "添加"
this.modal = true
this.addModal = true
this.editModal = false
this.modal = true
this.$nextTick(() => {
if (this.$refs.formItem) {
this.$refs.formItem.resetFields()
}
})
},
toEdit(index) {
this.modalTitle = "编辑"
let temp = this.dataList[index]
this.formItem.id = temp.id
this.formItem.parentId = temp.parentId
this.formItem.permissionName = temp.permissionName
this.formItem.permissionCode = temp.permissionCode
this.formItem.level = temp.level
this.formItem.icon = temp.icon
this.formItem.url = temp.url
this.formItem.component = temp.component
this.formItem.permissionDesc = temp.permissionDesc
this.formItem.sort = temp.sort
this.modal = true
this.addModal = false
this.editModal = true
this.modal = true
this.$nextTick(() => {
// 先清除上次校验状态,再回填数据,避免编辑回显报红
if (this.$refs.formItem) {
this.$refs.formItem.resetFields()
}
this.formItem.id = temp.id
this.formItem.parentId = temp.parentId
this.formItem.permissionName = temp.permissionName
this.formItem.permissionCode = temp.permissionCode
this.formItem.level = temp.level
this.formItem.icon = temp.icon
this.formItem.url = temp.url
this.formItem.component = temp.component
this.formItem.permissionDesc = temp.permissionDesc
this.formItem.sort = temp.sort
})
},
submit(formItem) {
// modal 提交
this.$refs[formItem].validate((valid) => {
if (valid) {
if (this.addModal) {//添加
console.log("add")
add(this.formItem).then(res => {
this.refresh()
this.getTreeSelectList()
@@ -341,7 +346,6 @@
this.$Message.success("添加成功!")
})
} else {//编辑
console.log("edit")
update(this.formItem).then(res => {
this.refresh()
this.getTreeSelectList()
@@ -363,11 +367,12 @@
let temp = this.dataList[index]
let data = {
id: temp.id,
status: '9'
id: temp.id
}
update(data).then(res => {
remove(data).then(res => {
this.refresh()
this.getTreeSelectList()
this.getTreeList()
this.getDataList()
this.$Message.success("删除成功!")
})
+18 -12
View File
@@ -53,23 +53,23 @@
@on-cancel="cancel()">
<Form :rules="ruleCustom" :model="formItem" ref="formItem" :label-width="120" label-position="right">
<Row :gutter="32">
<Col span="32">
<Col span="24">
<FormItem label="角色名称" prop="roleName">
<Input type="text" class="form-input" v-model="formItem.roleName" placeholder="请输入角色名称"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="角色编码" prop="roleCode">
<Input type="text" class="form-input" v-model="formItem.roleCode" placeholder="请输入角色编码"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="角色描述" prop="roleDesc">
<Input type="textarea" maxlength="100" show-word-limit :rows="4" class="form-input"
v-model="formItem.roleDesc" placeholder="请输入角色描述"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="部门名称" prop="deptId">
<treeselect ref="treeSelect"
class="form-input"
@@ -81,12 +81,12 @@
/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="排序" prop="sort">
<InputNumber :min="0" v-model="formItem.sort" placeholder="请输入角色排序"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="默认角色" prop="isDefault">
<RadioGroup v-model="formItem.isDefault">
<Radio label="1">
@@ -267,7 +267,7 @@ export default {
this.tableLoading = true
getDataList(data).then(res => {
let page = res.data.data
this.pageTotal = page.size
this.pageTotal = page.total
this.dataList = page.records
// 延迟300毫秒,给它更流畅的感觉
setTimeout(() => {
@@ -291,6 +291,15 @@ export default {
this.modalTitle = '编辑'
let temp = this.dataList[index]
this.addModal = false
this.editModal = true
this.modal = true
this.$nextTick(() => {
// 清除上次校验状态,避免编辑回显报红
if (this.$refs.formItem) {
this.$refs.formItem.resetFields()
}
this.formItem.id = temp.id
this.formItem.roleName = temp.roleName
this.formItem.roleCode = temp.roleCode
@@ -298,10 +307,7 @@ export default {
this.formItem.isDefault = temp.isDefault
this.formItem.deptId = temp.deptId
this.formItem.sort = temp.sort
this.modal = true
this.addModal = false
this.editModal = true
})
},
submit (formItem) {
// modal 提交
@@ -444,7 +450,7 @@ export default {
// 存叶子节点
let rolePermissionArr = []
for (let i = 0; i < checkedNodes.length; i++) {
if (checkedNodes[i].children.length === 0) {
if ((checkedNodes[i].children || []).length === 0) {
let rolePermission = {
roleId: this.curRoleId,
permissionId: checkedNodes[i].id
+34 -32
View File
@@ -60,27 +60,27 @@
@on-cancel="cancel()">
<Form :rules="ruleCustom" :model="formItem" ref="formItem" :label-width="120" label-position="right">
<Row :gutter="32">
<Col span="32">
<Col span="24">
<FormItem label="登录账号" prop="username">
<Input type="text" class="form-input" v-model="formItem.username" placeholder="请输入登录账号"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="用户昵称" prop="nickname">
<Input type="text" class="form-input" v-model="formItem.nickname" placeholder="请输入用户昵称"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="联系电话" prop="phone">
<Input type="text" class="form-input" v-model="formItem.phone" placeholder="请输入联系电话"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="电子邮箱" prop="email">
<Input type="text" class="form-input" v-model="formItem.email" placeholder="请输入电子邮箱"/>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="用户类型" prop="userType">
<RadioGroup v-model="formItem.userType">
<Radio label="userType001" disabled>
@@ -92,9 +92,9 @@
</RadioGroup>
</FormItem>
</Col>
<Col span="32">
<Col span="24">
<FormItem label="角色权限" prop="roleIds">
<Select v-model="formItem.roleIds" multiple style="width:260px">
<Select v-model="formItem.roleIds" multiple style="width:100%">
<Option v-for="item in roleSelectList"
:value="item.value"
:key="item.value">{{ item.label }}
@@ -282,7 +282,7 @@
required: true, message: '请输入联系电话', trigger: 'blur'
}],
email: [{
required: true, message: '请输入联系电话', trigger: 'blur'
required: true, message: '请输入电子邮箱', trigger: 'blur'
}],
roleIds: [{
required: true, type: 'array', message: '请选择角色权限', trigger: 'blur'
@@ -297,10 +297,8 @@
this.tableLoading = true
getDataList(data).then(res => {
let page = res.data.data;
this.pageTotal = page.size
this.pageTotal = page.total
this.dataList = page.records
console.log("this.dataList:")
console.log(this.dataList)
// 延迟300毫秒,给它更流畅的感觉
setTimeout(() => {
this.tableLoading = false
@@ -310,11 +308,10 @@
getRoleSelectList() {
// 加载角色下拉列表
getRoleSelectList().then(res => {
let roleSelectList = res.data.data
let roleSelectList = res.data.data || []
this.roleSelectList = roleSelectList
this.isDefaultRoleId = [roleSelectList[0].value]
this.isDefaultRoleId = roleSelectList.length > 0 ? [roleSelectList[0].value] : []
this.formItem.roleIds = this.isDefaultRoleId
})
},
toAdd() {
@@ -329,19 +326,27 @@
this.modalTitle = "编辑"
let temp = this.dataList[index]
this.formItem.id = temp.id
this.formItem.username = temp.username
this.formItem.nickname = temp.nickname
this.formItem.userType = temp.userType
this.formItem.phone = temp.phone
this.formItem.email = temp.email
if (temp.roleIds != null) {
this.formItem.roleIds = temp.roleIds.split(',')
}
this.modal = true
this.addModal = false
this.editModal = true
this.modal = true
this.$nextTick(() => {
// 清除上次校验状态,避免编辑回显报红
if (this.$refs.formItem) {
this.$refs.formItem.resetFields()
}
this.formItem.id = temp.id
this.formItem.username = temp.username
this.formItem.nickname = temp.nickname
this.formItem.userType = temp.userType
this.formItem.phone = temp.phone
this.formItem.email = temp.email
if (temp.roleIds != null && temp.roleIds !== '') {
this.formItem.roleIds = temp.roleIds.split(',')
} else {
this.formItem.roleIds = []
}
})
},
submit(formItem) {
// modal 提交
@@ -362,13 +367,11 @@
})
if (this.addModal) {//添加
console.log("add")
add(data).then(res => {
this.getDataList()
this.$Message.success("添加成功!")
})
} else {//编辑
console.log("edit")
update(data).then(res => {
this.getDataList()
this.$Message.success("编辑成功!")
@@ -393,8 +396,6 @@
},
toDelete(index) {
let temp = this.dataList[index]
console.log("this.dataList[index]:")
console.log(this.dataList[index])
if (temp.username === 'admin' && temp.userType === 'userType001') {
this.$Message.warning("系统内置管理员账号不可删除!")
return
@@ -470,9 +471,10 @@
},
toExport() {
// 导出到Excel
getDataList({pageNum: 1, pageSize: this.pageTotal}).then(res => {
let pageInfo = res.data.data.pageInfo
exportExcel(this.exportColumns, this.dataList, "用户数据")
getDataList({pageNum: 1, pageSize: this.pageTotal || 1000}).then(res => {
let page = res.data.data
let data = (page && page.records) ? page.records : this.dataList
exportExcel(this.exportColumns, data, "用户数据")
})
},
toDownload() {