diff --git a/src/components/Tree/src/BasicTree.vue b/src/components/Tree/src/BasicTree.vue index 4c7117e..4a09f8c 100644 --- a/src/components/Tree/src/BasicTree.vue +++ b/src/components/Tree/src/BasicTree.vue @@ -386,7 +386,7 @@ export default defineComponent({ expose(instance) return () => { - const { title, helpMessage, toolbar, search, checkable } = props + const { title, helpMessage, toolbar, search, checkable, showStrictlyButton } = props const showTitle = title || toolbar || search || slots.headerTitle const scrollStyle: CSSProperties = { height: 'calc(100% - 38px)' } return ( @@ -399,6 +399,7 @@ export default defineComponent({ title={title} search={search} toolbar={toolbar} + showStrictlyButton={showStrictlyButton} helpMessage={helpMessage} onStrictlyChange={onStrictlyChange} onSearch={handleSearch} diff --git a/src/components/Tree/src/components/TreeHeader.vue b/src/components/Tree/src/components/TreeHeader.vue index 4a06a67..91cff71 100644 --- a/src/components/Tree/src/components/TreeHeader.vue +++ b/src/components/Tree/src/components/TreeHeader.vue @@ -51,6 +51,11 @@ const props = defineProps({ type: Boolean, default: false }, + // 是否显示toolbar的 层级关联/层级独立按钮 + showStrictlyButton: { + type: Boolean, + default: true + }, checkable: { type: Boolean, default: false @@ -89,7 +94,7 @@ const getInputSearchCls = computed(() => { }) const toolbarList = computed(() => { - const { checkable } = props + const { checkable, showStrictlyButton } = props const defaultToolbarList = [ { label: t('component.tree.expandAll'), value: ToolbarEnum.EXPAND_ALL }, { @@ -99,19 +104,33 @@ const toolbarList = computed(() => { } ] - return checkable - ? [ - { label: t('component.tree.selectAll'), value: ToolbarEnum.SELECT_ALL }, + const retList = [ + { + label: t('component.tree.selectAll'), + value: ToolbarEnum.SELECT_ALL + }, + { + label: t('component.tree.unSelectAll'), + value: ToolbarEnum.UN_SELECT_ALL, + divider: checkable + }, + ...defaultToolbarList + ] + if (showStrictlyButton) { + retList.push( + ...[ { - label: t('component.tree.unSelectAll'), - value: ToolbarEnum.UN_SELECT_ALL, - divider: checkable + label: t('component.tree.checkStrictly'), + value: ToolbarEnum.CHECK_STRICTLY }, - ...defaultToolbarList, - { label: t('component.tree.checkStrictly'), value: ToolbarEnum.CHECK_STRICTLY }, - { label: t('component.tree.checkUnStrictly'), value: ToolbarEnum.CHECK_UN_STRICTLY } + { + label: t('component.tree.checkUnStrictly'), + value: ToolbarEnum.CHECK_UN_STRICTLY + } ] - : defaultToolbarList + ) + } + return checkable ? retList : defaultToolbarList }) function handleMenuClick(e) { diff --git a/src/components/Tree/src/types/tree.ts b/src/components/Tree/src/types/tree.ts index 6513dff..c5fd725 100644 --- a/src/components/Tree/src/types/tree.ts +++ b/src/components/Tree/src/types/tree.ts @@ -66,6 +66,11 @@ export const treeProps = buildProps({ default: '' }, defaultExpandAll: Boolean, + // 是否显示toolbar的 层级关联/层级独立按钮 + showStrictlyButton: { + type: Boolean, + default: true + }, fieldNames: { type: Object as PropType @@ -178,3 +183,28 @@ export interface TreeActionType { getSearchValue: () => string getSelectedNode: (key: KeyType, treeList?: TreeItem[], selectNode?: TreeItem | null) => TreeItem | null } + +export interface CheckedEvent { + checked: boolean // 是否选中节点 一个没选为false + checkedNodes: T[] // 选中的节点 类型为treeData的类型 + checkedNodesPositions?: any // 选中节点的位置 eg:0-0-1 节点独立时候为null + event: 'check' + halfCheckedKeys?: number[] // 父子节点关联时为祖先节点ids, 独立时为null + nativeEvent: PointerEvent + node: any +} + +/** + * 父子节点关联情况下 + * 为选中的菜单id(包含子菜单 不包含父菜单) + * + * 父子节点独立情况下 + * checked为选中的菜单 + * halfChecked为祖先节点数组 + */ +export type CheckedKeys = + | number[] + | { + checked: number[] + halfChecked: number[] + } diff --git a/src/views/system/role/RoleMenuModal.vue b/src/views/system/role/RoleMenuModal.vue index 688466b..b0638e8 100644 --- a/src/views/system/role/RoleMenuModal.vue +++ b/src/views/system/role/RoleMenuModal.vue @@ -3,12 +3,16 @@