Merge branch 'master' of https://gitee.com/huge-dream/django-vue3-admin into develop

# Conflicts:
#	backend/dvadmin/system/views/role_menu_button_permission.py
#	web/src/views/system/role/components/PermissionComNew/index.vue
#	web/src/views/system/role/components/PermissionComNew/types.ts

backend/dvadmin/system/views/role_menu_button_permission.py

@@ -23,13 +23,13 @@ class RoleMenuButtonPermissionSerializer(CustomModelSerializer):
     """
     菜单按钮-序列化器
     """
+
     class Meta:
         model = RoleMenuButtonPermission
         fields = "__all__"
         read_only_fields = ["id"]
 
 
-
 class RoleMenuButtonPermissionCreateUpdateSerializer(CustomModelSerializer):
     """
     初始化菜单按钮-序列化器
@@ -67,17 +67,17 @@ class RoleButtonPermissionSerializer(CustomModelSerializer):
             return None
         return obj.data_range
 
-
     class Meta:
         model = MenuButton
         fields = ['id', 'name', 'value', 'isCheck', 'data_range']
 
-class RoleFieldPermissionSerializer(CustomModelSerializer):
 
+class RoleFieldPermissionSerializer(CustomModelSerializer):
     class Meta:
         model = FieldPermission
         fields = "__all__"
 
+
 class RoleMenuFieldSerializer(CustomModelSerializer):
     is_query = serializers.SerializerMethodField()
     is_create = serializers.SerializerMethodField()
@@ -103,24 +103,38 @@ class RoleMenuFieldSerializer(CustomModelSerializer):
         if queryset:
             return queryset.is_update
         return False
+
     class Meta:
         model = MenuField
         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):
     """
     菜单和按钮权限
     """
-    name = serializers.SerializerMethodField()
+    # name = serializers.SerializerMethodField()
     isCheck = serializers.SerializerMethodField()
     btns = serializers.SerializerMethodField()
     columns = serializers.SerializerMethodField()
 
-    def get_name(self, instance):
-        parent_list = Menu.get_all_parent(instance['id'])
-        names = [d["name"] for d in parent_list]
-        return "/".join(names)
+    # def get_name(self, instance):
+    #     parent_list = Menu.get_all_parent(instance['id'])
+    #     names = [d["name"] for d in parent_list]
+    #     return "/".join(names)
     def get_isCheck(self, instance):
         params = self.request.query_params
         return RoleMenuPermission.objects.filter(
@@ -138,12 +152,11 @@ class RoleMenuPermissionSerializer(CustomModelSerializer):
         serializer = RoleMenuFieldSerializer(col_list, many=True, request=self.request)
         return serializer.data
 
-
-
     class Meta:
         model = Menu
         fields = ['id', 'name', 'isCheck', 'btns', 'columns']
 
+
 class RoleMenuButtonPermissionViewSet(CustomModelViewSet):
     """
     菜单按钮接口
@@ -171,47 +184,47 @@ class RoleMenuButtonPermissionViewSet(CustomModelViewSet):
         if role is None:
             return ErrorResponse(msg="未获取到角色信息")
         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:
         #     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').all()
-        # serializer = RoleMenuPermissionSerializer(queryset,many=True,request=request)
-        # data = serializer.data
+        #     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)
-        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])
     def set_role_premission(self, request, pk):
@@ -224,7 +237,8 @@ class RoleMenuButtonPermissionViewSet(CustomModelViewSet):
         body = request.data
         RoleMenuPermission.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'):
                     menu_parent = Menu.get_all_parent(menu.get('id'))
                     role_menu_permission_list = []
@@ -232,21 +246,21 @@ class RoleMenuButtonPermissionViewSet(CustomModelViewSet):
                         role_menu_permission_list.append(RoleMenuPermission(role_id=pk, menu_id=d["id"]))
                     RoleMenuPermission.objects.bulk_create(role_menu_permission_list)
                     # RoleMenuPermission.objects.create(role_id=pk, menu_id=menu.get('id'))
-            for btn in menu.get('btns', []):
+                for btn in menu.get('btns'):
                     if btn.get('isCheck'):
                         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', []))
-            for col in menu.get('columns', []):
-                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')
+                for col in menu.get('columns'):
+                    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="授权成功")
 
-
-
     @action(methods=['GET'], detail=False, permission_classes=[IsAuthenticated])
     def role_menu_get_button(self, request):
         """

web/src/views/system/role/components/PermissionComNew/index.vue

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

web/src/views/system/role/components/PermissionComNew/types.ts

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