Skip to content

Commit

Permalink
feat: 角色增加 type，适配各页面角色绑定逻辑
Browse files Browse the repository at this point in the history
  • Loading branch information
@cadecode
cadecode committed May 27, 2024
1 parent 981edb9 commit e1371e6
Show file tree
Hide file tree
Showing 5 changed files with 127 additions and 35 deletions.
5 changes: 3 additions & 2 deletions src/api/system.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -60,10 +60,11 @@ export function listUserRolesVoByUserIds(data) {
});
}

export function listRole() {
export function listRole(data) {
return request({
url: '/framework/system/role/list',
method: 'post'
method: 'post',
data
});
}

Expand Down
18 changes: 12 additions & 6 deletions src/view/System/Api/index.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<el-form-item label="接口路径" prop="url">
<el-input v-model="apisFilterForm.data.url" />
</el-form-item>
<el-form-item label="角色" prop="roleIdList">
<el-form-item label="访问角色" prop="roleIdList">
<el-select v-model="apisFilterForm.data.roleIdList" collapse-tags multiple filterable placeholder="请选择">
<el-option
v-for="item in roleTree.data"
Expand Down Expand Up @@ -62,13 +62,13 @@
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="3" :xl="3">
<el-tabs type="border-card" class="api-management-role">
<el-tab-pane label="角色绑定">
<el-tab-pane label="访问角色绑定">
<el-tree
v-if="apiListTable.currClick"
ref="roleTree"
:data="roleTree.data"
:props="roleTree.props"
node-key="code"
node-key="_typeCode"
show-checkbox
@check="roleCheck"
/>
Expand Down Expand Up @@ -148,6 +148,7 @@ import {
updateApi
} from '@/api/system';
import BaseDictLoader from '@/component/BaseDictLoader';
import {getRoleTypeCode, roleTypes} from '@/util/permission';
export default {
name: 'ApiManagement',
Expand Down Expand Up @@ -285,8 +286,13 @@ export default {
},
loadRoleTree() {
// 查询role列表
listRole().then(res => {
listRole({type: roleTypes.ROLE_TYPE_ACCESS}).then(res => {
this.roleTree.data = res.data;
if (this.roleTree.data && this.roleTree.data.length) {
this.roleTree.data.forEach(o => {
o._typeCode = getRoleTypeCode(o);
});
}
});
},
apiListTableClick(curr, old) {
Expand All @@ -304,15 +310,15 @@ export default {
addRoleApi([{id: this.apiListTable.currClick.id, roleId: obj.id}]).then(res => {
if (res.data) {
// 添加到对象中
this.apiListTable.currClick.roles.push(obj.code);
this.apiListTable.currClick.roles.push(obj._typeCode);
}
});
return;
}
removeRoleApi([{id: this.apiListTable.currClick.id, roleId: obj.id}]).then(res => {
if (res.data) {
// 删除该角色
const index = this.apiListTable.currClick.roles.indexOf(obj.code);
const index = this.apiListTable.currClick.roles.indexOf(obj._typeCode);
this.apiListTable.currClick.roles.splice(index, 1);
}
});
Expand Down
19 changes: 13 additions & 6 deletions src/view/System/Menu/index.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
<el-form-item label="菜单名" prop="menuName">
<el-input v-model="menusFilterForm.data.menuName" />
</el-form-item>
<el-form-item label="角色" prop="roleIdList">
<el-form-item label="访问角色" prop="roleIdList">
<el-select
v-model="menusFilterForm.data.roleIdList"
collapse-tags
Expand Down Expand Up @@ -147,13 +147,13 @@
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="3" :xl="3">
<el-tabs type="border-card" class="menu-management-role">
<el-tab-pane label="角色绑定">
<el-tab-pane label="访问角色绑定">
<el-tree
v-if="listTableCurrClick"
ref="roleTree"
:data="roleTree.data"
:props="roleTree.props"
node-key="code"
node-key="_typeCode"
show-checkbox
@check="roleCheck"
/>
Expand Down Expand Up @@ -227,6 +227,7 @@
v-model="addMenuForm.data.parentId"
:fetch-suggestions="listParentMenuSuggest"
placeholder="不填写时为顶级菜单"
:disabled="isHiddenRouteClicked()"
@select="handleParentMenuSelect"
/>
</el-form-item>
Expand Down Expand Up @@ -282,6 +283,7 @@ import {
updateMenuEnable
} from '@/api/system';
import {isExternalUrl} from '@/util/common';
import {getRoleTypeCode, roleTypes} from '@/util/permission';
export default {
name: 'MenuManagement',
Expand Down Expand Up @@ -558,8 +560,13 @@ export default {
},
loadRoleTree() {
// 查询role列表
listRole().then(res => {
listRole({type: roleTypes.ROLE_TYPE_ACCESS}).then(res => {
this.roleTree.data = res.data;
if (this.roleTree.data && this.roleTree.data.length) {
this.roleTree.data.forEach(o => {
o._typeCode = getRoleTypeCode(o);
});
}
});
},
listTableClick(curr, old) {
Expand All @@ -577,15 +584,15 @@ export default {
addRoleMenu([{id: this.listTableCurrClick.id, roleId: obj.id}]).then(res => {
if (res.data) {
// 添加到对象中
this.listTableCurrClick.roles.push(obj.code);
this.listTableCurrClick.roles.push(obj._typeCode);
}
});
return;
}
removeRoleMenu([{id: this.listTableCurrClick.id, roleId: obj.id}]).then(res => {
if (res.data) {
// 删除该角色
const index = this.listTableCurrClick.roles.indexOf(obj.code);
const index = this.listTableCurrClick.roles.indexOf(obj._typeCode);
this.listTableCurrClick.roles.splice(index, 1);
}
});
Expand Down
47 changes: 43 additions & 4 deletions src/view/System/Role/index.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,19 @@
<div class="app-container role-management-container">
<div class="role-management-filter">
<el-form ref="rolesFilterForm" size="small" inline :model="rolesFilterForm.data" :rules="rolesFilterForm.rules">
<el-form-item label="角色类型" prop="type">
<el-select
v-model="rolesFilterForm.data.type"
placeholder="请选择"
>
<el-option
v-for="item in roleTypes.ROLE_TYPES"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="角色代码" prop="code">
<el-input v-model="rolesFilterForm.data.code" />
</el-form-item>
Expand Down Expand Up @@ -29,6 +42,7 @@
<el-table-column property="id" label="ID" width="170px" fixed />
<el-table-column property="code" label="角色代码" width="140px" fixed />
<el-table-column property="name" label="角色名" width="180px" fixed />
<el-table-column property="type" label="角色类型" width="100px" />
<el-table-column property="updateTime" label="更新时间" width="150px" />
<el-table-column property="updateUser" label="更新人" width="160px" />
<el-table-column property="createTime" label="创建时间" width="150px" />
Expand Down Expand Up @@ -58,7 +72,7 @@
<el-tabs type="border-card" class="role-management-bind">
<el-tab-pane label="菜单绑定" class="role-management-bind-menu">
<el-tree
v-if="roleListTable.currClick"
v-if="isAccessRoleCurrClick"
ref="menuTree"
:data="menuTree.data"
:props="menuTree.props"
Expand All @@ -72,7 +86,7 @@
</el-tab-pane>
<el-tab-pane label="API绑定" class="role-management-bind-api">
<el-tree
v-if="roleListTable.currClick"
v-if="isAccessRoleCurrClick"
ref="apiTree"
:data="apiTree.data"
:props="apiTree.props"
Expand Down Expand Up @@ -123,6 +137,19 @@
<el-form-item label="角色名" prop="name">
<el-input v-model="addRoleForm.data.name" />
</el-form-item>
<el-form-item label="角色类型" prop="type">
<el-select
v-model="addRoleForm.data.type"
placeholder="请选择"
>
<el-option
v-for="item in roleTypes.ROLE_TYPES"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="描述" prop="description">
<el-input v-model="addRoleForm.data.description" />
</el-form-item>
Expand All @@ -149,17 +176,22 @@ import {
removeRoleMenu,
updateRole
} from '@/api/system';
import {roleTypes} from '@/util/permission';
export default {
name: 'RoleManagement',
data() {
return {
roleTypes,
rolesFilterForm: {
data: {
code: null,
name: null
name: null,
type: roleTypes.ROLE_TYPE_ACCESS
},
rules: {}
rules: {
type: [{required: true, message: '请选择角色类型', trigger: 'blur'}]
}
},
roleListTable: {
currClick: null,
Expand Down Expand Up @@ -206,17 +238,24 @@ export default {
data: {
code: null,
name: null,
type: null,
description: null
},
showDialog: false,
rule: {
code: [{required: true, message: '请输入角色代码', trigger: 'blur'}],
name: [{required: true, message: '请输入角色名', trigger: 'blur'}],
type: [{required: true, message: '请选择角色类型', trigger: 'blur'}],
description: [{required: true, message: '请输入描述', trigger: 'blur'}]
}
}
};
},
computed: {
isAccessRoleCurrClick() {
return this.roleListTable.currClick && this.roleListTable.currClick.type === roleTypes.ROLE_TYPE_ACCESS;
}
},
created() {
this.pageRoles(1);
this.loadMenuTree();
Expand Down
Loading

0 comments on commit e1371e6

Please sign in to comment.