|
|
@@ -1,12 +1,6 @@
|
|
|
-import { BtnList } from '@/common/components/btnList/interface';
|
|
|
import { ContextMenuTemp } from "@/common/components/contextMenu/interface";
|
|
|
-import { handleContextMenu } from "@/common/components/contextMenu/setup";
|
|
|
-import { getTableColumns, initData } from "@/common/export/table";
|
|
|
-import { TableKey } from '@/common/methods/table/interface';
|
|
|
-import { handleModalComponent } from '@/common/setup/asyncComponent';
|
|
|
-import { onUnmounted, ref } from "vue";
|
|
|
-import { getBtnList_ } from './button';
|
|
|
-import { ButtonListKey, TableEventCB } from './interface';
|
|
|
+import { ref } from "vue";
|
|
|
+import { TableEventCB } from './interface';
|
|
|
|
|
|
/**
|
|
|
* 表格事件
|
|
|
@@ -63,54 +57,3 @@ export function getTableEvent<T>(param: TableEventCB) {
|
|
|
return { expandedRowKeys, selectedRow, Rowclick, btnClick, contextMenu, closeContext }
|
|
|
}
|
|
|
|
|
|
-export interface ComposeTableParam {
|
|
|
- queryFn: Function, // 查询表格数据
|
|
|
- menuType: keyof ButtonListKey, // 操作按钮列表key
|
|
|
- tableName: keyof TableKey, // 表头key
|
|
|
- tableFilterKey: string[], // 表格过滤字段
|
|
|
- isDetail: boolean, // 是否需要详情
|
|
|
-}
|
|
|
-
|
|
|
-// 表格 + 表头 + 右键 + 单击表格 + 按钮列表 通用处理逻辑
|
|
|
-export function handleComposeTable<T>({ queryFn, menuType, isDetail, tableName, tableFilterKey }: ComposeTableParam) {
|
|
|
- // 右键逻辑
|
|
|
- const { contextMenu, openContext, closeContext: closeContextAction } = handleContextMenu();
|
|
|
- // 表头数据
|
|
|
- const { columns, registerColumn, updateColumn } = getTableColumns();
|
|
|
- // 右键回调函数
|
|
|
- const eventsCB: TableEventCB = {
|
|
|
- contextmenuCB: (record: T, value: ContextMenuTemp) => {
|
|
|
- // 控制打开右键
|
|
|
- contextMenu.value = value
|
|
|
- }
|
|
|
- }
|
|
|
- // 表格事件
|
|
|
- const { expandedRowKeys, selectedRow, Rowclick } = getTableEvent<T>(eventsCB);
|
|
|
- // 表格操作按钮列表
|
|
|
- const [firstBtn, secondBtn] = getBtnList_(menuType, isDetail).value;
|
|
|
- // 控制异步组件
|
|
|
- const { componentId, closeComponent, openComponent } = handleModalComponent(queryFn, selectedRow);
|
|
|
- // 关闭右键
|
|
|
- function closeContext(value: BtnList | null) {
|
|
|
- // 打开对应的弹窗组件
|
|
|
- if (value) openComponent(value, selectedRow.value)
|
|
|
- // 关闭右键
|
|
|
- closeContextAction()
|
|
|
- }
|
|
|
- onUnmounted(() => {
|
|
|
- // 离开组件,手动关闭右键,防止出现bug
|
|
|
- closeContextAction()
|
|
|
- })
|
|
|
- initData(() => {
|
|
|
- // 获取列表数据
|
|
|
- queryFn();
|
|
|
- // 注册表头信息 过滤
|
|
|
- registerColumn(tableName, tableFilterKey);
|
|
|
- }); return {
|
|
|
- contextMenu, openContext, closeContext, // 右键
|
|
|
- columns, registerColumn, updateColumn, // 表头
|
|
|
- expandedRowKeys, selectedRow, Rowclick, // 表格折腾面板数据与单击、双击事件
|
|
|
- componentId, closeComponent, openComponent, // 控制异步组件
|
|
|
- firstBtn, secondBtn, // 表格按钮
|
|
|
- }
|
|
|
-}
|