From e1d9f555c83f2916964f7f76f459ab54ff8101fe Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=9D=8E=E5=B0=8F=E6=B6=9B?= <1537080775@qq.com> Date: Sat, 29 Jun 2024 14:46:37 +0800 Subject: [PATCH 1/2] =?UTF-8?q?feat(20240629=5Frole=5Fmenu):=20=E4=BC=98?= =?UTF-8?q?=E5=8C=96=E8=8F=9C=E5=8D=95=E7=AE=A1=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 优化在新增修改菜单的时候,父级菜单tree只显示目录 --- .../menu/components/MenuFormCom/index.vue | 114 ++--- web/src/views/system/menu/types.ts | 2 +- .../PermissionComNew/index copy.vue | 420 ++++++++++++++++++ .../components/PermissionComNew/index.vue | 2 +- 4 files changed, 480 insertions(+), 58 deletions(-) create mode 100644 web/src/views/system/role/components/PermissionComNew/index copy.vue diff --git a/web/src/views/system/menu/components/MenuFormCom/index.vue b/web/src/views/system/menu/components/MenuFormCom/index.vue index 5fa4abae..bb7ac328 100644 --- a/web/src/views/system/menu/components/MenuFormCom/index.vue +++ b/web/src/views/system/menu/components/MenuFormCom/index.vue @@ -10,21 +10,12 @@ - + - + @@ -35,12 +26,14 @@ - + - + @@ -48,46 +41,45 @@ - + - + + + + + + + + + + + - - - - - - - - - - - + - + - + @@ -96,7 +88,8 @@ - + @@ -118,6 +111,8 @@ import { lazyLoadMenu, AddObj, UpdateObj } from '../../api'; import { successNotification } from '/@/utils/message'; import { MenuFormDataType, MenuTreeItemType, ComponentFileItem, APIResponseData } from '../../types'; import type Node from 'element-plus/es/components/tree/src/model/node'; +import { log } from 'console'; +import XEUtils from 'xe-utils'; interface IProps { initFormData: Partial | null; @@ -148,14 +143,14 @@ const validateWebPath = (rule: any, value: string, callback: Function) => { }; const validateLinkUrl = (rule: any, value: string, callback: Function) => { - let pattern = /^\/.*?/; - let patternUrl = /http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/; - const reg = pattern.test(value) || patternUrl.test(value) - if (reg) { - callback(); - } else { - callback(new Error('请输入正确的地址')); - } + let pattern = /^\/.*?/; + let patternUrl = /http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/; + const reg = pattern.test(value) || patternUrl.test(value) + if (reg) { + callback(); + } else { + callback(new Error('请输入正确的地址')); + } }; const props = withDefaults(defineProps(), { @@ -172,7 +167,7 @@ const rules = reactive({ name: [{ required: true, message: '菜单名称必填', trigger: 'blur' }], component: [{ required: true, message: '请输入组件地址', trigger: 'blur' }], component_name: [{ required: true, message: '请输入组件名称', trigger: 'blur' }], - link_url: [{ required: true, message: '请输入外链接地址',validator:validateLinkUrl, trigger: 'blur' }], + link_url: [{ required: true, message: '请输入外链接地址', validator: validateLinkUrl, trigger: 'blur' }], }); let deptDefaultList = ref([]); @@ -189,9 +184,9 @@ let menuFormData = reactive({ description: '', is_catalog: false, is_link: false, - is_iframe: false, - is_affix: false, - link_url:'' + is_iframe: false, + is_affix: false, + link_url: '' }); let menuBtnLoading = ref(false); @@ -210,9 +205,9 @@ const setMenuFormData = () => { menuFormData.description = props.initFormData?.description || ''; menuFormData.is_catalog = !!props.initFormData.is_catalog; menuFormData.is_link = !!props.initFormData.is_link; - menuFormData.is_iframe =!!props.initFormData.is_iframe; - menuFormData.is_affix =!!props.initFormData.is_affix; - menuFormData.link_url =props.initFormData.link_url; + menuFormData.is_iframe = !!props.initFormData.is_iframe; + menuFormData.is_affix = !!props.initFormData.is_affix; + menuFormData.link_url = props.initFormData.link_url; } }; @@ -246,7 +241,7 @@ const createFilter = (queryString: string) => { const handleTreeLoad = (node: Node, resolve: Function) => { if (node.level !== 0) { lazyLoadMenu({ parent: node.data.id }).then((res: APIResponseData) => { - resolve(res.data); + resolve(XEUtils.filter(res.data, (i: MenuTreeItemType) => i.is_catalog)); }); } }; @@ -278,9 +273,14 @@ const handleCancel = (type: string = '') => { formRef.value?.resetFields(); }; +/** + * 初始化 + */ onMounted(async () => { props.treeData.map((item) => { - deptDefaultList.value.push(item); + if (item.is_catalog) { + deptDefaultList.value.push(item); + } }); setMenuFormData(); }); @@ -290,6 +290,7 @@ onMounted(async () => { .menu-form-com { margin: 10px; overflow-y: auto; + .menu-form-alert { color: #fff; line-height: 24px; @@ -298,6 +299,7 @@ onMounted(async () => { border-radius: 4px; background-color: var(--el-color-primary); } + .menu-form-btns { padding-bottom: 10px; box-sizing: border-box; diff --git a/web/src/views/system/menu/types.ts b/web/src/views/system/menu/types.ts index 79754789..e99086c8 100644 --- a/web/src/views/system/menu/types.ts +++ b/web/src/views/system/menu/types.ts @@ -65,5 +65,5 @@ export interface MenuFormDataType { is_link: boolean; is_iframe:boolean; is_affix:boolean; - link_url: string; + link_url: string|undefined; } diff --git a/web/src/views/system/role/components/PermissionComNew/index copy.vue b/web/src/views/system/role/components/PermissionComNew/index copy.vue new file mode 100644 index 00000000..0b1ca194 --- /dev/null +++ b/web/src/views/system/role/components/PermissionComNew/index copy.vue @@ -0,0 +1,420 @@ + + + + + + 当前授权角色: + {{ props.roleName }} + + + + + 保存菜单授权 + + + + + + + + + + + 页面显示权限 + + + 配置操作功能接口权限,配置数据权限点击小齿轮 + + + {{ btn.data_range !== null ? `${btn.name}(${formatDataRange(btn.data_range)})` : btn.name }} + + + + + + + + + + + 配置数据列字段权限 + + + + 字段 + + + + {{ head.label }} + + + + + + {{ c_item.title }} + + + + + + + + + + + + + + + + + + + + + + 确定 + 取消 + + + + + + + + + + + + diff --git a/web/src/views/system/role/components/PermissionComNew/index.vue b/web/src/views/system/role/components/PermissionComNew/index.vue index 0b1ca194..1e98eadd 100644 --- a/web/src/views/system/role/components/PermissionComNew/index.vue +++ b/web/src/views/system/role/components/PermissionComNew/index.vue @@ -160,7 +160,7 @@ let customDataPermission = ref([]); //获取菜单,按钮,权限 const getMenuBtnPermission = async () => { const resMenu = await getRolePermission({ role: props.roleId }) - menuData.value = resMenu + menuData.value = resMenu } // 获取按钮的数据权限下拉选项 -- Gitee From 798f9e8a7f71e941e13eda1b2f2893387306f7c4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=9D=8E=E5=B0=8F=E6=B6=9B?= <1537080775@qq.com> Date: Sat, 29 Jun 2024 22:42:37 +0800 Subject: [PATCH 2/2] =?UTF-8?q?feat(20240629=5Frole=5Fmenu):=20=E4=BC=98?= =?UTF-8?q?=E5=8C=96=E6=9D=83=E9=99=90=E9=85=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 重构权限配置前端页面布局 --- .../views/role_menu_button_permission.py | 36 +- .../PermissionComNew/index copy.vue | 420 ----------- .../components/PermissionComNew/index.vue | 709 +++++++++--------- 3 files changed, 388 insertions(+), 777 deletions(-) delete mode 100644 web/src/views/system/role/components/PermissionComNew/index copy.vue diff --git a/backend/dvadmin/system/views/role_menu_button_permission.py b/backend/dvadmin/system/views/role_menu_button_permission.py index e26d7eff..755ff80e 100644 --- a/backend/dvadmin/system/views/role_menu_button_permission.py +++ b/backend/dvadmin/system/views/role_menu_button_permission.py @@ -284,27 +284,21 @@ class RoleMenuButtonPermissionViewSet(CustomModelViewSet): RoleMenuPermission.objects.filter(role=pk).delete() RoleMenuButtonPermission.objects.filter(role=pk).delete() for item in body: - for menu in item["children"]: - if menu.get('isCheck'): - menu_parent = Menu.get_all_parent(menu.get('id')) - role_menu_permission_list = [] - for d in menu_parent: - 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'): - 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.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') - }) + if item.get('isCheck'): + RoleMenuPermission.objects.create(role_id=pk, menu_id=item["id"]) + for btn in item.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.dept.set(btn.get('dept', [])) + for col in item.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]) diff --git a/web/src/views/system/role/components/PermissionComNew/index copy.vue b/web/src/views/system/role/components/PermissionComNew/index copy.vue deleted file mode 100644 index 0b1ca194..00000000 --- a/web/src/views/system/role/components/PermissionComNew/index copy.vue +++ /dev/null @@ -1,420 +0,0 @@ - - - - - - 当前授权角色: - {{ props.roleName }} - - - - - 保存菜单授权 - - - - - - - - - - - 页面显示权限 - - - 配置操作功能接口权限,配置数据权限点击小齿轮 - - - {{ btn.data_range !== null ? `${btn.name}(${formatDataRange(btn.data_range)})` : btn.name }} - - - - - - - - - - - 配置数据列字段权限 - - - - 字段 - - - - {{ head.label }} - - - - - - {{ c_item.title }} - - - - - - - - - - - - - - - - - - - - - - 确定 - 取消 - - - - - - - - - - - - diff --git a/web/src/views/system/role/components/PermissionComNew/index.vue b/web/src/views/system/role/components/PermissionComNew/index.vue index 1e98eadd..9e12dfbb 100644 --- a/web/src/views/system/role/components/PermissionComNew/index.vue +++ b/web/src/views/system/role/components/PermissionComNew/index.vue @@ -1,205 +1,244 @@ - - - - - 当前授权角色: - {{ props.roleName }} - - - - - 保存菜单授权 - - - - - - - - - - - 页面显示权限 - - - 配置操作功能接口权限,配置数据权限点击小齿轮 - - - {{ btn.data_range !== null ? `${btn.name}(${formatDataRange(btn.data_range)})` : btn.name }} - - - - - - - - - - - 配置数据列字段权限 - - - - 字段 - - - - {{ head.label }} - - - - - - {{ c_item.title }} - - - - - - - - - - - - - - - - - - - - - - 确定 - 取消 - - - - - + + + + + + 当前授权角色: + {{ props.roleName }} + + + + + 保存菜单授权 + + + + + + + + + + + + + + + + + 配置操作功能接口权限,配置数据权限点击小齿轮 + + + {{ btn.data_range !== null ? `${btn.name}(${formatDataRange(btn.data_range)})` : btn.name }} + + + + + + + + + + + 配置数据列字段权限 + + + + 字段 + + + + {{ head.label }} + + + + + + {{ c_item.title }} + + + + + + + + + + + + + + + + + + + + 确定 + 取消 + + + + + -- Gitee