admin/django-vue3-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

!19 修改权限配置页面的布局

Browse Source 
Merge pull request !19 from 木子-李/muzili
This commit is contained in:
dvadmin
2024-06-20 23:50:31 +00:00
committed by Gitee
parent c686a6e74a 089e0ca5c1
commit a812f1304b
3 changed files with 186 additions and 170 deletions
Download Patch File Download Diff File Expand all files Collapse all files

118
backend/dvadmin/system/views/role_menu_button_permission.py
View File

@@ -23,13 +23,13 @@ class RoleMenuButtonPermissionSerializer(CustomModelSerializer):
""" """
菜单按钮-序列化器 菜单按钮-序列化器
""" """
class Meta: class Meta:
model = RoleMenuButtonPermission model = RoleMenuButtonPermission
fields = "__all__" fields = "__all__"
read_only_fields = ["id"] read_only_fields = ["id"]
class RoleMenuButtonPermissionCreateUpdateSerializer(CustomModelSerializer): class RoleMenuButtonPermissionCreateUpdateSerializer(CustomModelSerializer):
""" """
初始化菜单按钮-序列化器 初始化菜单按钮-序列化器
@@ -67,17 +67,17 @@ class RoleButtonPermissionSerializer(CustomModelSerializer):
return None return None
return obj.data_range return obj.data_range
class Meta: class Meta:
model = MenuButton model = MenuButton
fields = ['id', 'name', 'value', 'isCheck', 'data_range'] fields = ['id', 'name', 'value', 'isCheck', 'data_range']
class RoleFieldPermissionSerializer(CustomModelSerializer):
class RoleFieldPermissionSerializer(CustomModelSerializer):
class Meta: class Meta:
model = FieldPermission model = FieldPermission
fields = "__all__" fields = "__all__"
class RoleMenuFieldSerializer(CustomModelSerializer): class RoleMenuFieldSerializer(CustomModelSerializer):
is_query = serializers.SerializerMethodField() is_query = serializers.SerializerMethodField()
is_create = serializers.SerializerMethodField() is_create = serializers.SerializerMethodField()
@@ -103,24 +103,38 @@ class RoleMenuFieldSerializer(CustomModelSerializer):
if queryset: if queryset:
return queryset.is_update return queryset.is_update
return False return False
class Meta: class Meta:
model = MenuField model = MenuField
fields = ['id', 'field_name', 'title', 'is_query', 'is_create', 'is_update'] fields = ['id', 'field_name', 'title', 'is_query', 'is_create', 'is_update']
class RoleMenuSerializer(CustomModelSerializer):
menus = serializers.SerializerMethodField()
def get_menus(self, instance):
menu_list = Menu.objects.filter(parent=instance['id']).values('id', 'name')
serializer = RoleMenuPermissionSerializer(menu_list, many=True, request=self.request)
return serializer.data
class Meta:
model = Menu
fields = ['id', 'name', 'menus']
class RoleMenuPermissionSerializer(CustomModelSerializer): class RoleMenuPermissionSerializer(CustomModelSerializer):
""" """
菜单和按钮权限 菜单和按钮权限
""" """
name = serializers.SerializerMethodField() # name = serializers.SerializerMethodField()
isCheck = serializers.SerializerMethodField() isCheck = serializers.SerializerMethodField()
btns = serializers.SerializerMethodField() btns = serializers.SerializerMethodField()
columns = serializers.SerializerMethodField() columns = serializers.SerializerMethodField()
def get_name(self, instance): # def get_name(self, instance):
parent_list = Menu.get_all_parent(instance['id']) # parent_list = Menu.get_all_parent(instance['id'])
names = [d["name"] for d in parent_list] # names = [d["name"] for d in parent_list]
return "/".join(names) # return "/".join(names)
def get_isCheck(self, instance): def get_isCheck(self, instance):
params = self.request.query_params params = self.request.query_params
return RoleMenuPermission.objects.filter( return RoleMenuPermission.objects.filter(
@@ -138,12 +152,11 @@ class RoleMenuPermissionSerializer(CustomModelSerializer):
serializer = RoleMenuFieldSerializer(col_list, many=True, request=self.request) serializer = RoleMenuFieldSerializer(col_list, many=True, request=self.request)
return serializer.data return serializer.data
class Meta: class Meta:
model = Menu model = Menu
fields = ['id', 'name', 'isCheck', 'btns', 'columns'] fields = ['id', 'name', 'isCheck', 'btns', 'columns']
class RoleMenuButtonPermissionViewSet(CustomModelViewSet): class RoleMenuButtonPermissionViewSet(CustomModelViewSet):
""" """
菜单按钮接口 菜单按钮接口
@@ -171,47 +184,47 @@ class RoleMenuButtonPermissionViewSet(CustomModelViewSet):
if role is None: if role is None:
return ErrorResponse(msg="未获取到角色信息") return ErrorResponse(msg="未获取到角色信息")
is_superuser = request.user.is_superuser is_superuser = request.user.is_superuser
if is_superuser:
queryset = Menu.objects.filter(status=1, is_catalog=True).values('name', 'id').all()
else:
role_id = request.user.role.values_list('id', flat=True)
menu_list = RoleMenuPermission.objects.filter(role__in=role_id).values_list('id', flat=True)
queryset = Menu.objects.filter(status=1, is_catalog=True, id__in=menu_list).values('name', 'id').all()
serializer = RoleMenuSerializer(queryset, many=True, request=request)
data = serializer.data
return DetailResponse(data=data)
# data = []
# if is_superuser: # if is_superuser:
# queryset = Menu.objects.filter(status=1, is_catalog=False).values('name', 'id').all() # queryset = Menu.objects.filter(status=1, is_catalog=False).values('name', 'id').all()
# else: # else:
# role_id = request.user.role.values_list('id', flat=True) # role_id = request.user.role.values_list('id', flat=True)
# menu_list = RoleMenuPermission.objects.filter(role__in=role_id).values_list('id', flat=True) # menu_list = RoleMenuPermission.objects.filter(role__in=role_id).values_list('id', flat=True)
# queryset = Menu.objects.filter(status=1, is_catalog=False,id__in=menu_list).values('name', 'id').all() # queryset = Menu.objects.filter(status=1, is_catalog=False, id__in=menu_list).values('name', 'id')
# serializer = RoleMenuPermissionSerializer(queryset,many=True,request=request) # for item in queryset:
# data = serializer.data # parent_list = Menu.get_all_parent(item['id'])
# names = [d["name"] for d in parent_list]
# completeName = "/".join(names)
# isCheck = RoleMenuPermission.objects.filter(
# menu__id=item['id'],
# role__id=role,
# ).exists()
# mbCheck = RoleMenuButtonPermission.objects.filter(
# menu_button=OuterRef("pk"),
# role__id=role,
# )
# btns = MenuButton.objects.filter(
# menu__id=item['id'],
# ).annotate(isCheck=Exists(mbCheck)).values('id', 'name', 'value', 'isCheck',
# data_range=F('menu_button_permission__data_range'))
# dicts = {
# 'name': completeName,
# 'id': item['id'],
# 'isCheck': isCheck,
# 'btns': btns,
#
# }
# data.append(dicts)
# return DetailResponse(data=data) # return DetailResponse(data=data)
data = []
if is_superuser:
queryset = Menu.objects.filter(status=1,is_catalog=False).values('name', 'id').all()
else:
role_id = request.user.role.values_list('id', flat=True)
menu_list = RoleMenuPermission.objects.filter(role__in=role_id).values_list('id',flat=True)
queryset = Menu.objects.filter(status=1, is_catalog=False,id__in=menu_list).values('name', 'id')
for item in queryset:
parent_list = Menu.get_all_parent(item['id'])
names = [d["name"] for d in parent_list]
completeName = "/".join(names)
isCheck = RoleMenuPermission.objects.filter(
menu__id=item['id'],
role__id=role,
).exists()
mbCheck = RoleMenuButtonPermission.objects.filter(
menu_button=OuterRef("pk"),
role__id=role,
)
btns = MenuButton.objects.filter(
menu__id=item['id'],
).annotate(isCheck=Exists(mbCheck)).values('id', 'name', 'value', 'isCheck',
data_range=F('menu_button_permission__data_range'))
dicts = {
'name': completeName,
'id': item['id'],
'isCheck': isCheck,
'btns': btns,
}
data.append(dicts)
return DetailResponse(data=data)
@action(methods=['PUT'], detail=True, permission_classes=[IsAuthenticated]) @action(methods=['PUT'], detail=True, permission_classes=[IsAuthenticated])
def set_role_premission(self, request, pk): def set_role_premission(self, request, pk):
@@ -224,7 +237,8 @@ class RoleMenuButtonPermissionViewSet(CustomModelViewSet):
body = request.data body = request.data
RoleMenuPermission.objects.filter(role=pk).delete() RoleMenuPermission.objects.filter(role=pk).delete()
RoleMenuButtonPermission.objects.filter(role=pk).delete() RoleMenuButtonPermission.objects.filter(role=pk).delete()
for menu in body: for item in body:
for menu in item["menus"]:
if menu.get('isCheck'): if menu.get('isCheck'):
menu_parent = Menu.get_all_parent(menu.get('id')) menu_parent = Menu.get_all_parent(menu.get('id'))
role_menu_permission_list = [] role_menu_permission_list = []
@@ -235,14 +249,18 @@ class RoleMenuButtonPermissionViewSet(CustomModelViewSet):
for btn in menu.get('btns'): for btn in menu.get('btns'):
if btn.get('isCheck'): if btn.get('isCheck'):
data_range = btn.get('data_range', 0) or 0 data_range = btn.get('data_range', 0) or 0
instance = RoleMenuButtonPermission.objects.create(role_id=pk, menu_button_id=btn.get('id'),data_range=data_range) instance = RoleMenuButtonPermission.objects.create(role_id=pk, menu_button_id=btn.get('id'),
data_range=data_range)
instance.dept.set(btn.get('dept', [])) instance.dept.set(btn.get('dept', []))
for col in menu.get('columns'): for col in menu.get('columns'):
FieldPermission.objects.update_or_create(role_id=pk,field_id=col.get('id'),is_query=col.get('is_query'),is_create=col.get('is_create'),is_update=col.get('is_update')) FieldPermission.objects.update_or_create(role_id=pk, field_id=col.get('id'),
defaults={
'is_query': col.get('is_query'),
'is_create': col.get('is_create'),
'is_update': col.get('is_update')
})
return DetailResponse(msg="授权成功") return DetailResponse(msg="授权成功")
@action(methods=['GET'], detail=False, permission_classes=[IsAuthenticated]) @action(methods=['GET'], detail=False, permission_classes=[IsAuthenticated])
def role_menu_get_button(self, request): def role_menu_get_button(self, request):
""" """

87
web/src/views/system/role/components/PermissionComNew/index.vue
View File

@@ -1,8 +1,6 @@
<template> <template>
<el-drawer v-model="drawerVisible" title="权限配置" direction="rtl" size="60%" :close-on-click-modal="false" <el-drawer v-model="drawerVisible" title="权限配置" direction="rtl" size="60%" :close-on-click-modal="false"
:before-close="handleDrawerClose" :before-close="handleDrawerClose" :destroy-on-close="true">
:destroy-on-close="true"
>
<template #header> <template #header>
<el-row> <el-row>
<el-col :span="4"> <el-col :span="4">
@@ -19,53 +17,42 @@
</el-row> </el-row>
</template> </template>
<div class="permission-com"> <div class="permission-com">
<el-collapse v-model="collapseCurrent" @change="handleCollapseChange" accordion> <el-tabs>
<el-collapse-item v-for="(item,mIndex) in menuData" :key="mIndex" :name="mIndex" <el-tab-pane v-for="(item, mIndex) in menuData" :key="mIndex" :label="item.name">
style=" background-color: #fafafa;"> <el-tabs tab-position="left">
<template #title> <el-tab-pane v-for="(menu, mIndex) in item.menus" :key="mIndex" :label="menu.name" >
<div> <el-checkbox v-model="menu.isCheck">页面显示权限</el-checkbox>
<div class="pc-collapse-title">
<el-checkbox v-model="item.isCheck" @click.stop="null">
<span>{{ item.name }}</span>
</el-checkbox>
</div>
<div v-show="!collapseCurrent.includes(mIndex)" @click.stop="null" style="text-align: left;">
<el-checkbox v-for="btn in item.btns" :key="btn.value" :label="btn.value" v-model="btn.isCheck">
{{ btn.name }}
</el-checkbox>
</div>
</div>
</template>
<div class="pc-collapse-main"> <div class="pc-collapse-main">
<div class="pccm-item"> <div class="pccm-item">
<p>允许对这些数据有以下操作</p> <div class="menu-form-alert"> 配置操作功能点权限 </div>
<el-checkbox v-for="(btn,bIndex) in item.btns" :key="bIndex" v-model="btn.isCheck" :label="btn.value"> <el-checkbox v-for="(btn, bIndex) in menu.btns" :key="bIndex" v-model="btn.isCheck"
:label="btn.value">
<div class="btn-item"> <div class="btn-item">
{{ btn.data_range !== null ? `${btn.name}(${formatDataRange(btn.data_range)})` : btn.name }} {{ btn.data_range !== null ? `${btn.name}(${formatDataRange(btn.data_range)})` : btn.name }}
<span v-show="btn.isCheck" @click.stop.prevent="handleSettingClick(item, btn.id)"> <span v-show="btn.isCheck" @click.stop.prevent="handleSettingClick(menu, btn.id)">
<el-icon><Setting/></el-icon> <el-icon>
<Setting />
</el-icon>
</span> </span>
</div> </div>
</el-checkbox> </el-checkbox>
</div> </div>
<div class="pccm-item" v-if="item.columns&&item.columns.length>0"> <div class="pccm-item" v-if="menu.columns && menu.columns.length > 0">
<p>对这些数据有以下字段权限</p> <div class="menu-form-alert"> 配置数据列字段权限 </div>
<ul class="columns-list"> <ul class="columns-list">
<li class="columns-head"> <li class="columns-head">
<div class="width-txt"> <div class="width-txt">
<span>字段</span> <span>字段</span>
</div> </div>
<div v-for="(head, hIndex) in column.header" :key="hIndex" class="width-check"> <div v-for="(head, hIndex) in column.header" :key="hIndex" class="width-check">
<el-checkbox :label="head.value" @change="handleColumnChange($event, item, head.value)"> <el-checkbox :label="head.value" @change="handleColumnChange($event, menu, head.value)">
<span>{{ head.label }}</span> <span>{{ head.label }}</span>
</el-checkbox> </el-checkbox>
</div> </div>
</li> </li>
<li v-for="(c_item, c_index) in item.columns" :key="c_index" class="columns-item"> <li v-for="(c_item, c_index) in menu.columns" :key="c_index" class="columns-item">
<div class="width-txt">{{ c_item.title }}</div> <div class="width-txt">{{ c_item.title }}</div>
<div v-for="(col, cIndex) in column.header" :key="cIndex" class="width-check"> <div v-for="(col, cIndex) in column.header" :key="cIndex" class="width-check">
<el-checkbox v-model="c_item[col.value]" class="ci-checkout"></el-checkbox> <el-checkbox v-model="c_item[col.value]" class="ci-checkout"></el-checkbox>
@@ -74,8 +61,10 @@
</ul> </ul>
</div> </div>
</div> </div>
</el-collapse-item> </el-tab-pane>
</el-collapse> </el-tabs>
</el-tab-pane>
</el-tabs>
<el-dialog v-model="dialogVisible" title="数据权限配置" width="400px" :close-on-click-modal="false" <el-dialog v-model="dialogVisible" title="数据权限配置" width="400px" :close-on-click-modal="false"
:before-close="handleDialogClose"> :before-close="handleDialogClose">
@@ -84,18 +73,9 @@
placeholder="请选择"> placeholder="请选择">
<el-option v-for="item in dataPermissionRange" :key="item.value" :label="item.label" :value="item.value" /> <el-option v-for="item in dataPermissionRange" :key="item.value" :label="item.label" :value="item.value" />
</el-select> </el-select>
<el-tree-select <el-tree-select v-show="dataPermission === 4" node-key="id" v-model="customDataPermission"
v-show="dataPermission === 4" :props="defaultTreeProps" :data="deptData" multiple check-strictly :render-after-expand="false"
node-key="id" show-checkbox class="dialog-tree" />
v-model="customDataPermission"
:props="defaultTreeProps"
:data="deptData"
multiple
check-strictly
:render-after-expand="false"
show-checkbox
class="dialog-tree"
/>
</div> </div>
<template #footer> <template #footer>
<div> <div>
@@ -119,7 +99,7 @@ import {
setRolePremission, setRolePremission,
setBtnDatarange setBtnDatarange
} from './api'; } from './api';
import {MenuDataType, DataPermissionRangeType, CustomDataPermissionDeptType} from './types'; import { MenuDataType, MenusType, DataPermissionRangeType, CustomDataPermissionDeptType } from './types';
import { ElMessage } from 'element-plus' import { ElMessage } from 'element-plus'
const props = defineProps({ const props = defineProps({
@@ -199,13 +179,13 @@ const handleCollapseChange = (val: string) => {
* @param record 当前菜单 * @param record 当前菜单
* @param btnType 按钮类型 * @param btnType 按钮类型
*/ */
const handleSettingClick = (record: MenuDataType, btnId: number) => { const handleSettingClick = (record: MenusType, btnId: number) => {
menuCurrent.value = record; menuCurrent.value = record;
menuBtnCurrent.value = btnId; menuBtnCurrent.value = btnId;
dialogVisible.value = true; dialogVisible.value = true;
}; };
const handleColumnChange = (val: boolean, record: MenuDataType, btnType: string) => { const handleColumnChange = (val: boolean, record: MenusType, btnType: string) => {
for (const iterator of record.columns) { for (const iterator of record.columns) {
iterator[btnType] = val; iterator[btnType] = val;
} }
@@ -229,7 +209,8 @@ const handleDialogConfirm = () => {
} }
//if (dataPermission.value !== 4) {} //if (dataPermission.value !== 4) {}
for (const iterator of menuData.value) { for (const item of menuData.value) {
for (const iterator of item.menus) {
if (iterator.id === menuCurrent.value.id) { if (iterator.id === menuCurrent.value.id) {
for (const btn of iterator.btns) { for (const btn of iterator.btns) {
if (btn.id === menuBtnCurrent.value) { if (btn.id === menuBtnCurrent.value) {
@@ -242,6 +223,7 @@ const handleDialogConfirm = () => {
} }
} }
} }
}
handleDialogClose(); handleDialogClose();
}; };
const handleDialogClose = () => { const handleDialogClose = () => {
@@ -296,6 +278,15 @@ onMounted(() => {
.pccm-item { .pccm-item {
margin-bottom: 10px; margin-bottom: 10px;
.menu-form-alert {
color: #fff;
line-height: 24px;
padding: 8px 16px;
margin-bottom: 20px;
border-radius: 4px;
background-color: var(--el-color-primary);
}
.btn-item { .btn-item {
display: flex; display: flex;
align-items: center; align-items: center;

11
web/src/views/system/role/components/PermissionComNew/types.ts
View File

@@ -19,11 +19,18 @@ export interface CustomDataPermissionMenuType {
children: CustomDataPermissionMenuType[] children: CustomDataPermissionMenuType[]
} }
export interface MenuDataType { export interface MenusType{
id: string; id: string;
name: string; name: string;
isCheck: boolean; isCheck: boolean;
radio: string; radio: string;
btns: { id:number,label: string; value: string; isCheck: boolean; data_range: number;dept:object }[]; btns: { id:number,name: string; value: string; isCheck: boolean; data_range: number;dept:object }[];
columns: { [key: string]: boolean | string; }[] columns: { [key: string]: boolean | string; }[]
} }
export interface MenuDataType {
id: string;
name: string;
menus:MenusType[];
}