diff --git a/CHANGELOG.md b/CHANGELOG.md index b12f27de..bbc70741 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,9 @@ +# 1.1.2 + +**OTHERS** + +- 菜单管理 改为虚拟滚动 + # 1.1.1 **REFACTOR** diff --git a/apps/web-antd/src/views/system/dept/index.vue b/apps/web-antd/src/views/system/dept/index.vue index afd663de..69ebeb04 100644 --- a/apps/web-antd/src/views/system/dept/index.vue +++ b/apps/web-antd/src/views/system/dept/index.vue @@ -4,12 +4,7 @@ import type { Recordable } from '@vben/types'; import { nextTick } from 'vue'; import { Page, useVbenDrawer, type VbenFormProps } from '@vben/common-ui'; -import { - eachTree, - getVxePopupContainer, - listToTree, - removeEmptyChildren, -} from '@vben/utils'; +import { eachTree, getVxePopupContainer } from '@vben/utils'; import { Popconfirm, Space } from 'ant-design-vue'; @@ -43,13 +38,7 @@ const gridOptions: VxeGridProps = { const resp = await deptList({ ...formValues, }); - const treeData = listToTree(resp, { - id: 'deptId', - pid: 'parentId', - children: 'children', - }); - removeEmptyChildren(treeData); - return { rows: treeData }; + return { rows: resp }; }, // 默认请求接口后展开全部 不需要可以删除这段 querySuccess: () => { @@ -62,15 +51,21 @@ const gridOptions: VxeGridProps = { }, }, }, + /** + * 虚拟滚动 默认关闭 + */ + scrollY: { + enabled: false, + gt: 0, + }, rowConfig: { isHover: true, keyField: 'deptId', }, - treeConfig: { parentField: 'parentId', rowField: 'deptId', - transform: false, + transform: true, }, id: 'system-dept-index', }; diff --git a/apps/web-antd/src/views/system/menu/index.vue b/apps/web-antd/src/views/system/menu/index.vue index b045b693..b2bce276 100644 --- a/apps/web-antd/src/views/system/menu/index.vue +++ b/apps/web-antd/src/views/system/menu/index.vue @@ -6,12 +6,7 @@ import { computed } from 'vue'; import { useAccess } from '@vben/access'; import { Page, useVbenDrawer, type VbenFormProps } from '@vben/common-ui'; import { Fallback } from '@vben/common-ui'; -import { - eachTree, - getVxePopupContainer, - listToTree, - removeEmptyChildren, -} from '@vben/utils'; +import { eachTree, getVxePopupContainer } from '@vben/utils'; import { Popconfirm, Space } from 'ant-design-vue'; @@ -49,13 +44,7 @@ const gridOptions: VxeGridProps = { const resp = await menuList({ ...formValues, }); - const treeData = listToTree(resp, { - id: 'menuId', - pid: 'parentId', - children: 'children', - }); - removeEmptyChildren(treeData); - return { rows: treeData }; + return { rows: resp }; }, }, }, @@ -63,11 +52,19 @@ const gridOptions: VxeGridProps = { isHover: true, keyField: 'menuId', }, - + /** + * 开启虚拟滚动 + * 数据量小可以选择关闭 + */ + scrollY: { + enabled: true, + gt: 0, + }, treeConfig: { parentField: 'parentId', rowField: 'menuId', - transform: false, + // 自动转换为tree 由vxe处理 无需手动转换 + transform: true, }, id: 'system-menu-index', }; diff --git a/apps/web-antd/src/views/workflow/category/index.vue b/apps/web-antd/src/views/workflow/category/index.vue index b54ede7d..ab5869ec 100644 --- a/apps/web-antd/src/views/workflow/category/index.vue +++ b/apps/web-antd/src/views/workflow/category/index.vue @@ -4,7 +4,7 @@ import type { Recordable } from '@vben/types'; import { nextTick } from 'vue'; import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui'; -import { getVxePopupContainer, listToTree } from '@vben/utils'; +import { getVxePopupContainer } from '@vben/utils'; import { Popconfirm, Space } from 'ant-design-vue'; @@ -38,12 +38,7 @@ const gridOptions: VxeGridProps = { const resp = await categoryList({ ...formValues, }); - const treeData = listToTree(resp, { - id: 'id', - pid: 'parentId', - children: 'children', - }); - return { rows: treeData }; + return { rows: resp }; }, // 默认请求接口后展开全部 不需要可以删除这段 querySuccess: () => { @@ -53,13 +48,20 @@ const gridOptions: VxeGridProps = { }, }, }, + /** + * 虚拟滚动 默认关闭 + */ + scrollY: { + enabled: false, + gt: 0, + }, rowConfig: { keyField: 'id', }, treeConfig: { parentField: 'parentId', rowField: 'id', - transform: false, + transform: true, }, // 表格全局唯一表示 保存列配置需要用到 id: 'workflow-category-index',