haozq
/
ah_jjzhgd_webservice
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

菜单管理

This commit is contained in:
cwchen 2024-02-27 17:52:21 +08:00
parent 2e2c75e57e
commit 491f9c9d59
5 changed files with 130 additions and 106 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
ah-jjzhgd-web/src/api/menu.js Normal file
View File

@ -0,0 +1,43 @@
import request from '@/utils/request'
/** 获取菜单列表*/
export function fetchList(query) {
return request({
url: '/system/sys/menu/getMenuList',
method: 'get',
params: query
})
}
/** 新增菜单*/
export function addMenu(data) {
return request({
url: '/system/sys/menu/addMenu',
method: 'post',
data
})
}
/** 获取菜单*/
export function getMenuById(query) {
return request({
url: '/system/sys/menu/getMenuById',
method: 'get',
params: query
})
}
/** 修改菜单*/
export function editMenu(data) {
return request({
url: '/system/sys/menu/editMenu',
method: 'post',
data
})
}
/** 删除菜单*/
export function deleteMenu(query) {
return request({
url: '/system/sys/menu/delMenu',
method: 'post',
params: query
})
}

5
ah-jjzhgd-web/src/api/select.js
View File

@ -16,9 +16,10 @@ export function fetchRoleList() {
}
/** 菜单查询 */
export function fetchMenuList() {
export function fetchMenuList(query) {
return request({
url: '/system/sys/select/getMenuTree',
method: 'post'
method: 'post',
params: query
})
}

180
ah-jjzhgd-web/src/views/system/menu/index.vue
View File

@ -1,7 +1,7 @@
<template>
<div class="app-container">
<div class="filter-container">
<el-input v-model="listQuery.roleName" placeholder="角色名称" style="width: 200px" class="filter-item"
<el-input v-model="listQuery.menuName" placeholder="菜单名称" style="width: 200px" class="filter-item"
:maxlength="30" @keyup.enter.native="handleFilter" />
<el-button v-waves style="margin-left: 40px" class="filter-item" type="primary" icon="el-icon-search"
@click="handleFilter">
@ -11,30 +11,37 @@
@click="handleCreate">
新增
</el-button>
<el-button class="filter-item" icon="el-icon-plus" @click="toggleExpandAll">展开/折叠</el-button>
</div>
<el-table :key="tableKey" v-loading="listLoading" :data="list" border fit highlight-current-row style="width: 100%"
:max-height="tableHeight" :default-expand-all="isExpandAll"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
<el-table-column key="menuName" prop="menuName" label="菜单名称" min-width="40px" align="center" />
<el-table-column key="menuLogo" prop="menuLogo" label="图标" min-width="40px" align="center" />
<el-table-column key="menuSort" prop="menuSort" label="排序" min-width="40px" align="center" />
<el-table-column key="menuUrl" prop="menuUrl" label="菜单路径" min-width="40px" align="center" />
<el-table v-if="refreshTable" row-key="menuId" v-loading="listLoading" :data="list" border style="width: 100%"
:default-expand-all="isExpandAll" :tree-props="defaulatTreeTableProps">
<el-table-column key="menuName" prop="menuName" label="菜单名称" />
<el-table-column prop="menuLogo" label="图标" align="center">
<template slot-scope="scope">
<svg-icon :icon-class="!scope.row.menuLogo ? '' : scope.row.menuLogo" />
</template>
</el-table-column>
<el-table-column key="menuType" prop="menuType" label="菜单类型" align="center">
<template slot-scope="{row}">
<span v-if="row.menuType === 0">目录</span>
<span v-if="row.menuType === 1">菜单</span>
<span v-if="row.menuType === 2">按钮</span>
</template>
</el-table-column>
<el-table-column key="menuSort" prop="menuSort" label="排序" align="center" />
<el-table-column key="menuUrl" prop="menuUrl" label="菜单路径" align="center" />
<el-table-column key="menuAuth" prop="menuAuth" label="权限" align="center" />
<el-table-column key="createTime" prop="createTime" label="创建时间" align="center" :show-overflow-tooltip="true" />
<el-table-column label="操作" align="center" width="300" class-name="small-padding fixed-width">
<el-table-column label="操作" align="center" width="200" class-name="small-padding fixed-width">
<template slot-scope="{ row, $index }">
<el-button type="primary" size="mini" plain icon="el-icon-edit" title="修改" @click="handleUpdate(row)" />
<el-button v-if="row.status != 'deleted'" plain size="mini" type="danger" icon="el-icon-delete"
title="删除" @click="handleDelete(row, $index)" />
<el-button size="mini" type="warning" plain icon="el-icon-user" title="授权"
@click="addMenu(row, $index)" />
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="listQuery.pageNum" :limit.sync="listQuery.pageSize"
@pagination="getList" />
<el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="600px">
<el-form ref="dataForm" :rules="rules" :model="temp" label-position="right" label-width="80px"
style="width: 400px; margin-left: 50px">
@ -59,12 +66,12 @@
<el-form-item label="菜单名称" prop="menuName">
<el-input v-model="temp.menuName" placeholder="菜单名称" :maxlength="50" />
</el-form-item>
<el-form-item label="权限" prop="menuAuth">
<el-input v-model="temp.menuAuth" placeholder="权限" :maxlength="50" />
</el-form-item>
<el-form-item label="菜单地址" prop="menuUrl" v-if="temp.menuType !== '2'">
<el-input v-model="temp.menuUrl" placeholder="菜单地址" :maxlength="100" />
</el-form-item>
<el-form-item label="权限" prop="menuAuth">
<el-input v-model="temp.menuAuth" placeholder="权限" :maxlength="50" />
</el-form-item>
<el-form-item label="排序" prop="menuSort">
<el-input-number v-model="temp.menuSort" :min="1" :max="1000"
controls-position="right"></el-input-number>
@ -81,9 +88,8 @@
</template>
<script>
import { fetchList, addRole, getRoleById, editRole, deleteRole, authMenu, getAuthMenus } from '@/api/role'
import { fetchList, addMenu, getMenuById, editMenu, deleteMenu } from '@/api/menu'
import { fetchMenuList } from '@/api/select'
import { validSort } from '@/utils/validate'
import waves from '@/directive/waves'
import { parseTime } from '@/utils'
import Pagination from '@/components/Pagination'
@ -112,35 +118,29 @@ export default {
return {
// 是否展开，默认全部折叠
isExpandAll: false,
// 重新渲染表格状态
refreshTable: true,
menuTypeArr: menuTypeArr,
menuOptions: [],
tableKey: 0,
list: null,
total: 0,
defaulatTreeTableProps: { children: 'children', hasChildren: 'hasChildren' },
list: [],
listLoading: true,
listQuery: {
pageNum: 1,
pageSize: 10
},
tableHeight: 650,
listQuery: {},
showReviewer: false,
roleNameParam: null,
menuNameParam: null,
temp: {
roleId: null,
roleName: '',
roleSort: '',
menuId: null,
menuType: '',
icon: undefined,
menuName: '',
menuType: '0',
menuSort: 1,
icon: undefined,
menuAuth: '',
parentId: null
},
pwdForm: {
userId: null,
password: ''
menuUrl: '',
parentId: null,
menuLogo: null
},
dialogFormVisible: false,
dialogFormVisible2: false,
dialogStatus: '',
downloadLoading: false,
textMap: {
@ -152,6 +152,9 @@ export default {
menuName: [
{ required: true, message: '菜单名称不能为空', trigger: 'blur' }
],
menuType: [
{ required: true, message: '请选择菜单类型', trigger: 'change' }
],
menuUrl: [
{ required: true, message: '菜单地址不能为空', trigger: 'blur' }
],
@ -169,40 +172,60 @@ export default {
// 选择图标
selected(name) {
this.temp.icon = name;
this.temp.menuLogo = name;
},
getMenuList() {
fetchMenuList().then((response) => {
/** 展开/折叠操作 */
toggleExpandAll() {
this.refreshTable = false;
this.isExpandAll = !this.isExpandAll;
this.$nextTick(() => {
this.refreshTable = true;
});
},
getMenuList(params) {
fetchMenuList(params).then((response) => {
console.log(response.data);
this.menuOptions = this.menuOptions.slice(0,0)
this.menuOptions = response.data
})
},
getList() {
this.listLoading = true
fetchList(this.listQuery).then((response) => {
this.list = response.rows
this.total = response.total
this.list = response.data
setTimeout(() => {
this.listLoading = false
}, 1 * 500)
})
},
// 刷新页面数据
reloadData() {
this.getList();
this.getMenuList();
},
handleFilter() {
this.listQuery.pageNum = 1
this.getList()
},
handleCreate() {
this.getMenuList()
this.dialogStatus = 'create'
this.dialogFormVisible = true
console.log(this.temp);
this.$nextTick(() => {
this.temp.roleId = null;
this.$refs['dataForm'].resetFields()
this.temp.menuId = null;
this.temp.icon = undefined;
this.temp.menuLogo = null;
this.temp.menuUrl = null;
})
},
createData() {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
this.temp.flag = false;
this.temp.flag = false
console.log(this.temp);
addRole(this.temp).then((response) => {
addMenu(this.temp).then((response) => {
this.temp.parentId = null;
this.dialogFormVisible = false
this.$message({
showClose: true,
@ -210,29 +233,31 @@ export default {
type: 'success',
duration: 2000
})
this.getList()
this.reloadData();
})
}
})
},
handleUpdate(row) {
getRoleById({ roleId: row.roleId }).then((response) => {
this.getMenuList({menuId:row.menuId})
getMenuById({ menuId: row.menuId }).then((response) => {
this.temp = Object.assign({}, response.data)
this.roleNameParam = response.data.roleName
this.temp.icon = !response.data.menuLogo ? undefined : response.data.menuLogo
this.temp.menuType = response.data.menuType + ''
this.menuNameParam = response.data.menuName
})
this.dialogStatus = 'update'
this.dialogFormVisible = true
this.$nextTick(() => {
this.temp.roleId = null;
this.temp.menuId = null;
this.$refs['dataForm'].resetFields()
})
},
updateData() {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
this.temp.flag = this.roleNameParam === this.temp.roleName ? false : true
console.log(this.temp);
editRole(this.temp).then((response) => {
this.temp.flag = this.menuNameParam === this.temp.menuName ? false : true
editMenu(this.temp).then((response) => {
this.dialogFormVisible = false
this.$message({
showClose: true,
@ -240,7 +265,7 @@ export default {
type: 'success',
duration: 2000
})
this.getList()
this.reloadData()
})
}
})
@ -251,14 +276,14 @@ export default {
title: '操作提示',
beforeClose: async (action, instance, done) => {
if (action === 'confirm') {
deleteRole({ roleId: row.roleId }).then((response) => {
deleteMenu({ menuId: row.menuId }).then((response) => {
this.$message({
showClose: true,
message: response.msg,
type: 'success',
duration: 2000
})
this.getList()
this.reloadData()
done()
})
} else {
@ -267,47 +292,6 @@ export default {
}
})
},
addMenu(row, index) {
this.getAuthMenus({
roleId: row.roleId
});
this.temp.roleId = row.roleId
this.dialogFormVisible2 = true
// 清空树
this.$refs.menuTree.setCheckedKeys([]);
},
addMenuData() {
let treeNodeData = this.$refs.menuTree.getCheckedNodes();
treeNodeData = treeNodeData.filter((item) => {
return item.level !== '2'
})
if (treeNodeData.length === 0) {
this.$message({
showClose: true,
message: "未选择授权数据",
type: 'warning',
duration: 2000
})
return;
}
let menuIdsArr = [];
treeNodeData.forEach(function (item, index) {
menuIdsArr.push(item.id);
});
let data = {
menuIds: menuIdsArr,
roleId: this.temp.roleId
}
authMenu(data).then((response) => {
this.dialogFormVisible2 = false
this.$message({
showClose: true,
message: response.msg,
type: 'success',
duration: 2000
})
})
},
formatJson(filterVal) {
return this.list.map((v) =>
filterVal.map((j) => {
@ -324,6 +308,6 @@ export default {
</script>
<style scoped>
.el-input-number {
width: 320px;
width: 320px;
}
</style>

6
ah-jjzhgd-web/src/views/system/roles/index.vue
View File

@ -94,7 +94,7 @@ export default {
label: 'label'
},
tableKey: 0,
list: null,
list: [],
total: 0,
listLoading: true,
listQuery: {
@ -109,10 +109,6 @@ export default {
roleName: '',
roleSort: '',
},
pwdForm: {
userId: null,
password: ''
},
dialogFormVisible: false,
dialogFormVisible2: false,
dialogStatus: '',

2
ah-jjzhgd-web/src/views/system/user/index.vue
View File

@ -177,7 +177,7 @@ export default {
roleArr: [],
accountStatusArr: accountStatusArr,
loginType: [],
list: null,
list: [],
total: 0,
listLoading: true,
listQuery: {