dishui 0.0.83 → 0.0.89
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Demo/index.js +2 -2
- package/dist/components/Demo/index.js.map +1 -1
- package/dist/components/Input/index.js +52 -62
- package/dist/components/Input/index.js.map +1 -1
- package/dist/components/LayoutSuite/index.d.ts +10 -0
- package/dist/components/LayoutSuite/index.js +27 -18
- package/dist/components/LayoutSuite/index.js.map +1 -1
- package/dist/components/Markdown/markdownComponents.js +1 -0
- package/dist/components/Markdown/markdownComponents.js.map +1 -1
- package/dist/components/Markdown/useMarkdownSource.js +46 -31
- package/dist/components/Markdown/useMarkdownSource.js.map +1 -1
- package/dist/components/Markdown/useMarkmapRenderer.js +44 -31
- package/dist/components/Markdown/useMarkmapRenderer.js.map +1 -1
- package/dist/components/Markdown/useMermaidRenderer.js +49 -31
- package/dist/components/Markdown/useMermaidRenderer.js.map +1 -1
- package/dist/components/Page/index.d.ts +18 -4
- package/dist/components/Page/index.js +47 -35
- package/dist/components/Page/index.js.map +1 -1
- package/dist/components/ProtectedRoute/index.d.ts +2 -1
- package/dist/components/ProtectedRoute/index.js +16 -6
- package/dist/components/ProtectedRoute/index.js.map +1 -1
- package/dist/components/Select/index.d.ts +6 -0
- package/dist/components/Select/index.js +166 -136
- package/dist/components/Select/index.js.map +1 -1
- package/dist/components/Tabs/index.d.ts +12 -1
- package/dist/components/Tabs/index.js +42 -17
- package/dist/components/Tabs/index.js.map +1 -1
- package/dist/components/Text/index.d.ts +1 -1
- package/dist/components/Text/index.js +2 -2
- package/dist/components/Text/index.js.map +1 -1
- package/dist/components/pro/ArticleContextMenu/index.js +7 -7
- package/dist/components/pro/CodeEditor/editors/CodeEditor.js +200 -189
- package/dist/components/pro/CodeEditor/editors/CodeEditor.js.map +1 -1
- package/dist/components/pro/CodeEditor/types.d.ts +3 -0
- package/dist/components/pro/DataTable/DataTable.d.ts +1 -1
- package/dist/components/pro/DataTable/DataTable.js +98 -240
- package/dist/components/pro/DataTable/DataTable.js.map +1 -1
- package/dist/components/pro/DataTable/components/TableBody.js +14 -16
- package/dist/components/pro/DataTable/components/TableBody.js.map +1 -1
- package/dist/components/pro/DataTable/components/TablePagination.d.ts +3 -9
- package/dist/components/pro/DataTable/components/TablePagination.js +29 -25
- package/dist/components/pro/DataTable/components/TablePagination.js.map +1 -1
- package/dist/components/pro/DataTable/tanstack-table.d.ts +2 -2
- package/dist/components/pro/DataTable/tanstack-table.js +29 -21
- package/dist/components/pro/DataTable/tanstack-table.js.map +1 -1
- package/dist/components/pro/DataTable/treeDataUtils.d.ts +2 -0
- package/dist/components/pro/DataTable/treeDataUtils.js +18 -19
- package/dist/components/pro/DataTable/treeDataUtils.js.map +1 -1
- package/dist/components/pro/DataTable/types.d.ts +24 -0
- package/dist/components/pro/DataTable/useDataTableModel.d.ts +16 -0
- package/dist/components/pro/DataTable/useDataTableModel.js +148 -0
- package/dist/components/pro/DataTable/useDataTableModel.js.map +1 -0
- package/dist/components/pro/FileExplorer/Breadcrumb.js +12 -12
- package/dist/components/pro/Flow/nodes/DataNodeView.js +87 -82
- package/dist/components/pro/Flow/nodes/DataNodeView.js.map +1 -1
- package/dist/components/pro/Flow/nodes/MediaContent.js +1 -1
- package/dist/components/pro/Flow/nodes/MediaContent.js.map +1 -1
- package/dist/components/pro/Flow/nodes/MediaOverlay.js +1 -1
- package/dist/components/pro/Flow/nodes/MediaOverlay.js.map +1 -1
- package/dist/components/pro/Flow/nodes/Model3DView.js +69 -63
- package/dist/components/pro/Flow/nodes/Model3DView.js.map +1 -1
- package/dist/components/pro/Flow/nodes/chartGeometryBudget.d.ts +14 -0
- package/dist/components/pro/Flow/nodes/chartGeometryBudget.js +76 -0
- package/dist/components/pro/Flow/nodes/chartGeometryBudget.js.map +1 -0
- package/dist/components/pro/Flow/nodes/demandRender.d.ts +11 -0
- package/dist/components/pro/Flow/nodes/demandRender.js +26 -0
- package/dist/components/pro/Flow/nodes/demandRender.js.map +1 -0
- package/dist/components/pro/RichTextEditor/SlashMenu.js +68 -58
- package/dist/components/pro/RichTextEditor/SlashMenu.js.map +1 -1
- package/dist/contexts/AppContext.d.ts +1 -0
- package/dist/contexts/AppContext.js +144 -145
- package/dist/contexts/AppContext.js.map +1 -1
- package/dist/contexts/authentication.d.ts +7 -0
- package/dist/contexts/authentication.js +22 -0
- package/dist/contexts/authentication.js.map +1 -0
- package/dist/dishui.css +1 -1
- package/dist/hooks/useControllableState.d.ts +6 -14
- package/dist/hooks/useControllableState.js +21 -15
- package/dist/hooks/useControllableState.js.map +1 -1
- package/dist/hooks/useTableColumns.d.ts +3 -3
- package/dist/hooks/useTableColumns.js +2 -2
- package/dist/hooks/useTableColumns.js.map +1 -1
- package/dist/hooks/useTableData.d.ts +11 -4
- package/dist/hooks/useTableData.js +44 -26
- package/dist/hooks/useTableData.js.map +1 -1
- package/dist/index-nostyled.d.ts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +97 -97
- package/dist/layouts/Sidebar.d.ts +3 -1
- package/dist/layouts/Sidebar.js +131 -122
- package/dist/layouts/Sidebar.js.map +1 -1
- package/dist/utils/i18n.js +1 -1
- package/dist/utils/i18n.js.map +1 -1
- package/dist/utils/routerBuilder.d.ts +7 -5
- package/dist/utils/routerBuilder.js +11 -15
- package/dist/utils/routerBuilder.js.map +1 -1
- package/dist/utils/safeStorage.d.ts +8 -0
- package/dist/utils/safeStorage.js +45 -0
- package/dist/utils/safeStorage.js.map +1 -0
- package/package.json +22 -5
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableBody.js","names":[],"sources":["../../../../../src/components/pro/DataTable/components/TableBody.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as TanStackTable, flexRender } from '../tanstack-table';\nimport Table from '../../../Table';\nimport { RowEventHandler, CellEventHandler } from '../types';\nimport type {\n DataTableApi,\n DataTableCellContext,\n DataTableExtension,\n DataTableRowContext,\n} from '../extension';\n\ninterface TableBodyProps<T extends object> {\n table: TanStackTable<T>;\n expandedRowsState: Record<string, boolean>;\n onRowClick?: RowEventHandler;\n onRowDoubleClick?: RowEventHandler;\n onRowMouseEnter?: RowEventHandler;\n onRowMouseLeave?: RowEventHandler;\n onCellClick?: CellEventHandler;\n onCellDoubleClick?: CellEventHandler;\n onCellMouseEnter?: CellEventHandler;\n onCellMouseLeave?: CellEventHandler;\n enableExpanding: boolean;\n indentSize: number;\n handleRowExpand: (rowId: string, row: T) => void;\n // 扩展系统\n extensions?: DataTableExtension<T>[];\n extensionApi?: DataTableApi<T>;\n getRowId?: (row: T, index: number) => string;\n onCellContextMenu?: (\n e: React.MouseEvent,\n row: T,\n column: any,\n rowIndex: number,\n ) => void;\n}\n\nexport function TableBody<T extends object>({\n table,\n expandedRowsState,\n onRowClick,\n onRowDoubleClick,\n onRowMouseEnter,\n onRowMouseLeave,\n onCellClick,\n onCellDoubleClick,\n onCellMouseEnter,\n onCellMouseLeave,\n enableExpanding,\n indentSize,\n handleRowExpand,\n extensions = [],\n extensionApi,\n getRowId,\n onCellContextMenu,\n}: TableBodyProps<T>) {\n const hasExtensions = extensions.length > 0 && !!extensionApi;\n\n return (\n <Table.Body>\n {table.getRowModel().rows.length === 0 ? (\n <Table.Row>\n <Table.Cell colSpan={table.getAllColumns().length} className=\"text-center py-4\">\n 没有数据\n </Table.Cell>\n </Table.Row>\n ) : (\n table.getRowModel().rows.map((row, rowIndex) => {\n const rowData = row.original as any;\n const depth = rowData.__depth || 0;\n const hasChildren = rowData.__hasChildren || false;\n const rowId = rowData.__id;\n const isExpanded = hasChildren && expandedRowsState[rowId] || false;\n const isChildRow = depth > 0;\n const parentId = rowData.__parentId;\n const parentExpanded = parentId ? expandedRowsState[parentId] || false : true;\n\n // 根据层级和展开状态应用不同的CSS类\n const rowClassName = `\n ${row.getIsSelected() ? 'bg-primary/10' : ''}\n ${hasChildren ? (isExpanded ? 'tree-row-expanded' : '') : ''}\n `;\n\n // 如果是子行且父行未展开,则不显示\n if (isChildRow && !parentExpanded) {\n return null;\n }\n\n // 扩展的行级上下文与注入属性\n const resolvedRowId = getRowId\n ? getRowId(row.original, rowIndex)\n : String(rowId ?? rowIndex);\n const rowCtx: DataTableRowContext<T> = {\n row: row.original,\n rowId: resolvedRowId,\n rowIndex,\n selected: row.getIsSelected(),\n };\n const extraRowProps = hasExtensions\n ? extensions.reduce<React.HTMLAttributes<HTMLTableRowElement>>(\n (acc, ext) =>\n Object.assign(acc, ext.rowProps?.(rowCtx, extensionApi!) ?? {}),\n {},\n )\n : {};\n\n const rowElement = (\n <Table.Row\n key={row.id}\n className={rowClassName}\n onClick={onRowClick ? e => onRowClick(row.original, e) : undefined}\n onDoubleClick={onRowDoubleClick ? e => onRowDoubleClick(row.original, e) : undefined}\n onMouseEnter={onRowMouseEnter ? e => onRowMouseEnter(row.original, e) : undefined}\n onMouseLeave={onRowMouseLeave ? e => onRowMouseLeave(row.original, e) : undefined}\n {...(extraRowProps as any)}\n >\n {row.getVisibleCells().map((cell, cellIndex) => {\n // 为第一列添加缩进和展开/折叠控件\n const isFirstColumn = cellIndex === 0;\n\n // 扩展可覆写单元格渲染。\n let cellContent: React.ReactNode | undefined;\n if (hasExtensions) {\n const cellCtx: DataTableCellContext<T> = {\n value: cell.getValue(),\n row: row.original,\n rowId: resolvedRowId,\n rowIndex,\n columnId: cell.column.id,\n };\n for (const ext of extensions) {\n const out = ext.cell?.(cellCtx, extensionApi!);\n if (out !== undefined) {\n cellContent = out;\n break;\n }\n }\n }\n if (cellContent === undefined) {\n cellContent = flexRender(\n cell.column.columnDef.cell,\n cell.getContext(),\n );\n }\n\n return (\n <Table.Cell\n key={cell.id}\n onClick={onCellClick ? e => {\n e.stopPropagation(); // 防止触发行点击事件\n onCellClick(row.original, cell.column, e);\n } : undefined}\n onDoubleClick={onCellDoubleClick ? e => {\n e.stopPropagation(); // 防止触发行双击事件\n onCellDoubleClick(row.original, cell.column, e);\n } : undefined}\n onMouseEnter={onCellMouseEnter ? e => onCellMouseEnter(row.original, cell.column, e) : undefined}\n onMouseLeave={onCellMouseLeave ? e => onCellMouseLeave(row.original, cell.column, e) : undefined}\n >\n <div\n className=\"flex items-center\"\n onContextMenu={\n onCellContextMenu\n ? e =>\n onCellContextMenu(\n e,\n row.original,\n cell.column,\n rowIndex,\n )\n : undefined\n }\n >\n {isFirstColumn && enableExpanding && (\n <>\n <div style={{ width: `${depth * indentSize}px` }} />\n {hasChildren ? (\n <button\n onClick={(e) => {\n e.stopPropagation();\n handleRowExpand(rowId, row.original);\n }}\n className=\"mr-2 focus:outline-none\"\n >\n {/* 完全重写箭头图标部分,使用内联样式控制方向 */}\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"h-4 w-4\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n style={{\n transition: 'transform 0.3s ease',\n transform: isExpanded ? 'rotate(90deg)' : 'rotate(0deg)'\n }}\n >\n {/* 使用右箭头,通过旋转变为下箭头 */}\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"2\"\n d=\"M9 5l7 7-7 7\"\n />\n </svg>\n </button>\n ) : (\n <div className=\"w-6\"></div>\n )}\n </>\n )}\n {cellContent}\n </div>\n </Table.Cell>\n );\n })}\n </Table.Row>\n );\n\n // 让扩展包裹整行(如在行下方追加 detail 面板)。\n if (hasExtensions) {\n const wrapped = extensions.reduce<React.ReactNode>(\n (node, ext) => ext.wrapRow?.(node, rowCtx, extensionApi!) ?? node,\n rowElement,\n );\n if (wrapped !== rowElement) {\n return <React.Fragment key={row.id}>{wrapped}</React.Fragment>;\n }\n }\n\n return rowElement;\n })\n )}\n </Table.Body>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"TableBody.js","names":[],"sources":["../../../../../src/components/pro/DataTable/components/TableBody.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as TanStackTable, flexRender } from '../tanstack-table';\nimport Table from '../../../Table';\nimport { RowEventHandler, CellEventHandler } from '../types';\nimport type {\n DataTableApi,\n DataTableCellContext,\n DataTableExtension,\n DataTableRowContext,\n} from '../extension';\n\ninterface TableBodyProps<T extends object> {\n table: TanStackTable<T>;\n expandedRowsState: Record<string, boolean>;\n onRowClick?: RowEventHandler;\n onRowDoubleClick?: RowEventHandler;\n onRowMouseEnter?: RowEventHandler;\n onRowMouseLeave?: RowEventHandler;\n onCellClick?: CellEventHandler;\n onCellDoubleClick?: CellEventHandler;\n onCellMouseEnter?: CellEventHandler;\n onCellMouseLeave?: CellEventHandler;\n enableExpanding: boolean;\n indentSize: number;\n handleRowExpand: (rowId: string, row: T) => void;\n // 扩展系统\n extensions?: DataTableExtension<T>[];\n extensionApi?: DataTableApi<T>;\n getRowId?: (row: T, index: number) => string;\n onCellContextMenu?: (\n e: React.MouseEvent,\n row: T,\n column: any,\n rowIndex: number,\n ) => void;\n}\n\nexport function TableBody<T extends object>({\n table,\n expandedRowsState,\n onRowClick,\n onRowDoubleClick,\n onRowMouseEnter,\n onRowMouseLeave,\n onCellClick,\n onCellDoubleClick,\n onCellMouseEnter,\n onCellMouseLeave,\n enableExpanding,\n indentSize,\n handleRowExpand,\n extensions = [],\n extensionApi,\n getRowId,\n onCellContextMenu,\n}: TableBodyProps<T>) {\n const hasExtensions = extensions.length > 0 && !!extensionApi;\n\n return (\n <Table.Body>\n {table.getRowModel().rows.length === 0 ? (\n <Table.Row>\n <Table.Cell colSpan={table.getAllColumns().length} className=\"text-center py-4\">\n 没有数据\n </Table.Cell>\n </Table.Row>\n ) : (\n table.getRowModel().rows.map((row, rowIndex) => {\n const depth = row.depth;\n const hasChildren = row.subRows.length > 0;\n const rowId = row.id;\n const isExpanded = hasChildren && expandedRowsState[rowId] || false;\n\n // 根据层级和展开状态应用不同的CSS类\n const rowClassName = `\n ${row.getIsSelected() ? 'bg-primary/10' : ''}\n ${hasChildren ? (isExpanded ? 'tree-row-expanded' : '') : ''}\n `;\n\n\n // 扩展的行级上下文与注入属性\n const resolvedRowId = getRowId\n ? getRowId(row.original, rowIndex)\n : row.id;\n const rowCtx: DataTableRowContext<T> = {\n row: row.original,\n rowId: resolvedRowId,\n rowIndex,\n selected: row.getIsSelected(),\n };\n const extraRowProps = hasExtensions\n ? extensions.reduce<React.HTMLAttributes<HTMLTableRowElement>>(\n (acc, ext) =>\n Object.assign(acc, ext.rowProps?.(rowCtx, extensionApi!) ?? {}),\n {},\n )\n : {};\n\n const rowElement = (\n <Table.Row\n key={row.id}\n className={rowClassName}\n onClick={onRowClick ? e => onRowClick(row.original, e) : undefined}\n onDoubleClick={onRowDoubleClick ? e => onRowDoubleClick(row.original, e) : undefined}\n onMouseEnter={onRowMouseEnter ? e => onRowMouseEnter(row.original, e) : undefined}\n onMouseLeave={onRowMouseLeave ? e => onRowMouseLeave(row.original, e) : undefined}\n {...(extraRowProps as any)}\n >\n {row.getVisibleCells().map((cell, cellIndex) => {\n // 为第一列添加缩进和展开/折叠控件\n const isFirstColumn = cellIndex === 0;\n\n // 扩展可覆写单元格渲染。\n let cellContent: React.ReactNode | undefined;\n if (hasExtensions) {\n const cellCtx: DataTableCellContext<T> = {\n value: cell.getValue(),\n row: row.original,\n rowId: resolvedRowId,\n rowIndex,\n columnId: cell.column.id,\n };\n for (const ext of extensions) {\n const out = ext.cell?.(cellCtx, extensionApi!);\n if (out !== undefined) {\n cellContent = out;\n break;\n }\n }\n }\n if (cellContent === undefined) {\n cellContent = flexRender(\n cell.column.columnDef.cell,\n cell.getContext(),\n );\n }\n\n return (\n <Table.Cell\n key={cell.id}\n onClick={onCellClick ? e => {\n e.stopPropagation(); // 防止触发行点击事件\n onCellClick(row.original, cell.column, e);\n } : undefined}\n onDoubleClick={onCellDoubleClick ? e => {\n e.stopPropagation(); // 防止触发行双击事件\n onCellDoubleClick(row.original, cell.column, e);\n } : undefined}\n onMouseEnter={onCellMouseEnter ? e => onCellMouseEnter(row.original, cell.column, e) : undefined}\n onMouseLeave={onCellMouseLeave ? e => onCellMouseLeave(row.original, cell.column, e) : undefined}\n >\n <div\n className=\"flex items-center\"\n onContextMenu={\n onCellContextMenu\n ? e =>\n onCellContextMenu(\n e,\n row.original,\n cell.column,\n rowIndex,\n )\n : undefined\n }\n >\n {isFirstColumn && enableExpanding && (\n <>\n <div style={{ width: `${depth * indentSize}px` }} />\n {hasChildren ? (\n <button\n onClick={(e) => {\n e.stopPropagation();\n handleRowExpand(rowId, row.original);\n }}\n className=\"mr-2 focus:outline-none\"\n >\n {/* 完全重写箭头图标部分,使用内联样式控制方向 */}\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"h-4 w-4\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n style={{\n transition: 'transform 0.3s ease',\n transform: isExpanded ? 'rotate(90deg)' : 'rotate(0deg)'\n }}\n >\n {/* 使用右箭头,通过旋转变为下箭头 */}\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"2\"\n d=\"M9 5l7 7-7 7\"\n />\n </svg>\n </button>\n ) : (\n <div className=\"w-6\"></div>\n )}\n </>\n )}\n {cellContent}\n </div>\n </Table.Cell>\n );\n })}\n </Table.Row>\n );\n\n // 让扩展包裹整行(如在行下方追加 detail 面板)。\n if (hasExtensions) {\n const wrapped = extensions.reduce<React.ReactNode>(\n (node, ext) => ext.wrapRow?.(node, rowCtx, extensionApi!) ?? node,\n rowElement,\n );\n if (wrapped !== rowElement) {\n return <React.Fragment key={row.id}>{wrapped}</React.Fragment>;\n }\n }\n\n return rowElement;\n })\n )}\n </Table.Body>\n );\n}\n"],"mappings":"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"}
|
|
@@ -1,15 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { Table as TanStackTable } from '../tanstack-table';
|
|
2
|
+
import { Table as TanStackTable, PaginationState } from '../tanstack-table';
|
|
3
3
|
interface TablePaginationProps<T extends object> {
|
|
4
4
|
enablePagination: boolean;
|
|
5
5
|
table: TanStackTable<T>;
|
|
6
|
-
|
|
7
|
-
internalPageSize: number;
|
|
8
|
-
handlePageChange: (newPage: number) => void;
|
|
9
|
-
setInternalPageSize: (newSize: number) => void;
|
|
10
|
-
setInternalPageIndex: (page: number) => void;
|
|
11
|
-
onPageSizeChange?: (pageSize: number) => void;
|
|
12
|
-
onPageChange?: (page: number) => void;
|
|
6
|
+
onPaginationChange: (pagination: PaginationState) => void;
|
|
13
7
|
}
|
|
14
|
-
export declare function TablePagination<T extends object>({ enablePagination, table,
|
|
8
|
+
export declare function TablePagination<T extends object>({ enablePagination, table, onPaginationChange, }: TablePaginationProps<T>): React.JSX.Element | null;
|
|
15
9
|
export {};
|
|
@@ -1,9 +1,19 @@
|
|
|
1
1
|
import "react";
|
|
2
2
|
import { jsx as e, jsxs as t } from "react/jsx-runtime";
|
|
3
3
|
//#region src/components/pro/DataTable/components/TablePagination.tsx
|
|
4
|
-
function n({ enablePagination: n, table: r,
|
|
4
|
+
function n({ enablePagination: n, table: r, onPaginationChange: i }) {
|
|
5
5
|
if (!n) return null;
|
|
6
|
-
let { pageIndex:
|
|
6
|
+
let { pageIndex: a, pageSize: o } = r.state.pagination, s = r.getPageCount(), c = (e) => i({
|
|
7
|
+
pageIndex: e,
|
|
8
|
+
pageSize: o
|
|
9
|
+
}), l = [.../* @__PURE__ */ new Set([
|
|
10
|
+
5,
|
|
11
|
+
10,
|
|
12
|
+
15,
|
|
13
|
+
20,
|
|
14
|
+
25,
|
|
15
|
+
o
|
|
16
|
+
])].sort((e, t) => e - t);
|
|
7
17
|
return /* @__PURE__ */ t("div", {
|
|
8
18
|
className: "mt-4 flex justify-between items-center",
|
|
9
19
|
children: [
|
|
@@ -11,9 +21,9 @@ function n({ enablePagination: n, table: r, internalPageIndex: i, internalPageSi
|
|
|
11
21
|
className: "text-sm",
|
|
12
22
|
children: [
|
|
13
23
|
"第 ",
|
|
14
|
-
|
|
24
|
+
s === 0 ? 0 : a + 1,
|
|
15
25
|
" 页,共 ",
|
|
16
|
-
|
|
26
|
+
s,
|
|
17
27
|
" 页"
|
|
18
28
|
]
|
|
19
29
|
}) }),
|
|
@@ -22,33 +32,33 @@ function n({ enablePagination: n, table: r, internalPageIndex: i, internalPageSi
|
|
|
22
32
|
children: [
|
|
23
33
|
/* @__PURE__ */ e("button", {
|
|
24
34
|
className: "join-item btn btn-sm",
|
|
25
|
-
onClick: () =>
|
|
35
|
+
onClick: () => c(0),
|
|
26
36
|
disabled: !r.getCanPreviousPage(),
|
|
27
37
|
children: "<<"
|
|
28
38
|
}),
|
|
29
39
|
/* @__PURE__ */ e("button", {
|
|
30
40
|
className: "join-item btn btn-sm",
|
|
31
|
-
onClick: () =>
|
|
41
|
+
onClick: () => c(a - 1),
|
|
32
42
|
disabled: !r.getCanPreviousPage(),
|
|
33
43
|
children: "<"
|
|
34
44
|
}),
|
|
35
|
-
Array.from({ length: Math.min(5,
|
|
36
|
-
let r =
|
|
37
|
-
return r < 0 && (r = n), r >=
|
|
38
|
-
className: `join-item btn btn-sm ${r ===
|
|
39
|
-
onClick: () =>
|
|
45
|
+
Array.from({ length: Math.min(5, s) }).map((t, n) => {
|
|
46
|
+
let r = a - 2 + n;
|
|
47
|
+
return r < 0 && (r = n), r >= s && (r = s - 5 + n), s <= 5 && (r = n), r < 0 || r >= s ? null : /* @__PURE__ */ e("button", {
|
|
48
|
+
className: `join-item btn btn-sm ${r === a ? "btn-active" : ""}`,
|
|
49
|
+
onClick: () => c(r),
|
|
40
50
|
children: r + 1
|
|
41
51
|
}, r);
|
|
42
52
|
}),
|
|
43
53
|
/* @__PURE__ */ e("button", {
|
|
44
54
|
className: "join-item btn btn-sm",
|
|
45
|
-
onClick: () =>
|
|
55
|
+
onClick: () => c(a + 1),
|
|
46
56
|
disabled: !r.getCanNextPage(),
|
|
47
57
|
children: ">"
|
|
48
58
|
}),
|
|
49
59
|
/* @__PURE__ */ e("button", {
|
|
50
60
|
className: "join-item btn btn-sm",
|
|
51
|
-
onClick: () =>
|
|
61
|
+
onClick: () => c(s - 1),
|
|
52
62
|
disabled: !r.getCanNextPage(),
|
|
53
63
|
children: ">>"
|
|
54
64
|
})
|
|
@@ -56,18 +66,12 @@ function n({ enablePagination: n, table: r, internalPageIndex: i, internalPageSi
|
|
|
56
66
|
}),
|
|
57
67
|
/* @__PURE__ */ e("div", { children: /* @__PURE__ */ e("select", {
|
|
58
68
|
className: "select select-sm select-bordered",
|
|
59
|
-
value:
|
|
60
|
-
onChange: (e) => {
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
},
|
|
64
|
-
children:
|
|
65
|
-
5,
|
|
66
|
-
10,
|
|
67
|
-
15,
|
|
68
|
-
20,
|
|
69
|
-
25
|
|
70
|
-
].map((e) => /* @__PURE__ */ t("option", {
|
|
69
|
+
value: o,
|
|
70
|
+
onChange: (e) => i({
|
|
71
|
+
pageIndex: 0,
|
|
72
|
+
pageSize: Number(e.target.value)
|
|
73
|
+
}),
|
|
74
|
+
children: l.map((e) => /* @__PURE__ */ t("option", {
|
|
71
75
|
value: e,
|
|
72
76
|
children: [e, " 条/页"]
|
|
73
77
|
}, e))
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TablePagination.js","names":[],"sources":["../../../../../src/components/pro/DataTable/components/TablePagination.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as TanStackTable } from '../tanstack-table';\n\ninterface TablePaginationProps<T extends object> {\n enablePagination: boolean;\n table: TanStackTable<T>;\n
|
|
1
|
+
{"version":3,"file":"TablePagination.js","names":[],"sources":["../../../../../src/components/pro/DataTable/components/TablePagination.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as TanStackTable, PaginationState } from '../tanstack-table';\n\ninterface TablePaginationProps<T extends object> {\n enablePagination: boolean;\n table: TanStackTable<T>;\n onPaginationChange: (pagination: PaginationState) => void;\n}\n\nexport function TablePagination<T extends object>({\n enablePagination,\n table,\n onPaginationChange,\n}: TablePaginationProps<T>) {\n if (!enablePagination) return null;\n\n const { pageIndex, pageSize } = table.state.pagination;\n const pageCount = table.getPageCount();\n const handlePageChange = (next: number) => onPaginationChange({ pageIndex: next, pageSize });\n const pageSizes = [...new Set([5, 10, 15, 20, 25, pageSize])].sort((a, b) => a - b);\n\n return (\n <div className=\"mt-4 flex justify-between items-center\">\n <div>\n <span className=\"text-sm\">\n 第 {pageCount === 0 ? 0 : pageIndex + 1} 页,共 {pageCount} 页\n </span>\n </div>\n <div className=\"join\">\n <button\n className=\"join-item btn btn-sm\"\n onClick={() => handlePageChange(0)}\n disabled={!table.getCanPreviousPage()}\n >\n {'<<'}\n </button>\n <button\n className=\"join-item btn btn-sm\"\n onClick={() => handlePageChange(pageIndex - 1)}\n disabled={!table.getCanPreviousPage()}\n >\n {'<'}\n </button>\n {Array.from({ length: Math.min(5, pageCount) }).map((_, i) => {\n // 显示当前页前后两页\n let pageNum = pageIndex - 2 + i;\n\n // 确保页码在合法范围内\n if (pageNum < 0) pageNum = i;\n if (pageNum >= pageCount) pageNum = pageCount - 5 + i;\n\n // 如果总页数小于5,直接显示全部页码\n if (pageCount <= 5) {\n pageNum = i;\n }\n\n // 如果页码超出范围,不显示\n if (pageNum < 0 || pageNum >= pageCount) return null;\n\n return (\n <button\n key={pageNum}\n className={`join-item btn btn-sm ${pageNum === pageIndex ? 'btn-active' : ''}`}\n onClick={() => handlePageChange(pageNum)}\n >\n {pageNum + 1}\n </button>\n );\n })}\n <button\n className=\"join-item btn btn-sm\"\n onClick={() => handlePageChange(pageIndex + 1)}\n disabled={!table.getCanNextPage()}\n >\n {'>'}\n </button>\n <button\n className=\"join-item btn btn-sm\"\n onClick={() => handlePageChange(pageCount - 1)}\n disabled={!table.getCanNextPage()}\n >\n {'>>'}\n </button>\n </div>\n <div>\n <select\n className=\"select select-sm select-bordered\"\n value={pageSize}\n onChange={(e) => onPaginationChange({ pageIndex: 0, pageSize: Number(e.target.value) })}\n >\n {pageSizes.map((pageSize) => (\n <option key={pageSize} value={pageSize}>\n {pageSize} 条/页\n </option>\n ))}\n </select>\n </div>\n </div>\n );\n}\n"],"mappings":";;;AASA,SAAgB,EAAkC,EAC9C,qBACA,UACA,yBACwB;CACxB,IAAI,CAAC,GAAkB,OAAO;CAE9B,IAAM,EAAE,cAAW,gBAAa,EAAM,MAAM,YACtC,IAAY,EAAM,aAAa,GAC/B,KAAoB,MAAiB,EAAmB;EAAE,WAAW;EAAM;CAAS,CAAC,GACrF,IAAY,CAAC,mBAAG,IAAI,IAAI;EAAC;EAAG;EAAI;EAAI;EAAI;EAAI;CAAQ,CAAC,CAAC,CAAC,CAAC,MAAM,GAAG,MAAM,IAAI,CAAC;CAElF,OACI,kBAAC,OAAD;EAAK,WAAU;EAAf,UAAA;GACI,kBAAC,OAAD,EAAA,UACI,kBAAC,QAAD;IAAM,WAAU;IAAhB,UAAA;KAA0B;KACnB,MAAc,IAAI,IAAI,IAAY;KAAE;KAAM;KAAU;IACrD;GACL,CAAA,EAAA,CAAA;GACL,kBAAC,OAAD;IAAK,WAAU;IAAf,UAAA;KACI,kBAAC,UAAD;MACI,WAAU;MACV,eAAe,EAAiB,CAAC;MACjC,UAAU,CAAC,EAAM,mBAAmB;MAEnC,UAAA;KACG,CAAA;KACR,kBAAC,UAAD;MACI,WAAU;MACV,eAAe,EAAiB,IAAY,CAAC;MAC7C,UAAU,CAAC,EAAM,mBAAmB;MAEnC,UAAA;KACG,CAAA;KACP,MAAM,KAAK,EAAE,QAAQ,KAAK,IAAI,GAAG,CAAS,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,MAAM;MAE1D,IAAI,IAAU,IAAY,IAAI;MAc9B,OAXI,IAAU,MAAG,IAAU,IACvB,KAAW,MAAW,IAAU,IAAY,IAAI,IAGhD,KAAa,MACb,IAAU,IAIV,IAAU,KAAK,KAAW,IAAkB,OAG5C,kBAAC,UAAD;OAEI,WAAW,wBAAwB,MAAY,IAAY,eAAe;OAC1E,eAAe,EAAiB,CAAO;OAEtC,UAAA,IAAU;MACP,GALC,CAKD;KAEhB,CAAC;KACD,kBAAC,UAAD;MACI,WAAU;MACV,eAAe,EAAiB,IAAY,CAAC;MAC7C,UAAU,CAAC,EAAM,eAAe;MAE/B,UAAA;KACG,CAAA;KACR,kBAAC,UAAD;MACI,WAAU;MACV,eAAe,EAAiB,IAAY,CAAC;MAC7C,UAAU,CAAC,EAAM,eAAe;MAE/B,UAAA;KACG,CAAA;IACP;;GACL,kBAAC,OAAD,EAAA,UACI,kBAAC,UAAD;IACI,WAAU;IACV,OAAO;IACP,WAAW,MAAM,EAAmB;KAAE,WAAW;KAAG,UAAU,OAAO,EAAE,OAAO,KAAK;IAAE,CAAC;IAErF,UAAA,EAAU,KAAK,MACZ,kBAAC,UAAD;KAAuB,OAAO;KAA9B,UAAA,CACK,GAAS,MACN;IAFK,GAAA,CAEL,CACX;GACG,CAAA,EACP,CAAA;EACJ;;AAEb"}
|
|
@@ -14,9 +14,9 @@
|
|
|
14
14
|
* 组装细节。请始终从本模块导入表格相关类型与工具,而不要直接依赖
|
|
15
15
|
* `@tanstack/react-table`。
|
|
16
16
|
*/
|
|
17
|
-
import { useTable, flexRender, tableFeatures, type ReactTable, coreFeatures, columnFilteringFeature, columnOrderingFeature, columnVisibilityFeature, globalFilteringFeature, rowSortingFeature, rowPaginationFeature, rowSelectionFeature, rowExpandingFeature, createCoreRowModel, createFilteredRowModel, createSortedRowModel, createPaginatedRowModel, createExpandedRowModel } from '@tanstack/react-table';
|
|
17
|
+
import { useTable, flexRender, sortFns as builtInSortFns, tableFeatures, type ReactTable, coreFeatures, columnFilteringFeature, columnOrderingFeature, columnVisibilityFeature, globalFilteringFeature, rowSortingFeature, rowPaginationFeature, rowSelectionFeature, rowExpandingFeature, createCoreRowModel, createFilteredRowModel, createSortedRowModel, createPaginatedRowModel, createExpandedRowModel } from '@tanstack/react-table';
|
|
18
18
|
import type { RowData, OnChangeFn, Updater, CellContext as CoreCellContext, HeaderContext as CoreHeaderContext, SortingState, ColumnFiltersState, RowSelectionState, PaginationState, ColumnOrderState, ExpandedState, ColumnVisibilityState, StockFeatures, Column as CoreColumn, ColumnDef as CoreColumnDef, Row as CoreRow, Cell as CoreCell, Header as CoreHeader, HeaderGroup as CoreHeaderGroup, SortFnOption, SortFn as CoreSortFn, FilterFn as CoreFilterFn, ColumnMeta as CoreColumnMeta, TableOptions } from '@tanstack/react-table';
|
|
19
|
-
export { flexRender, useTable, tableFeatures };
|
|
19
|
+
export { flexRender, useTable, tableFeatures, builtInSortFns };
|
|
20
20
|
export type DishUITableFeatures = StockFeatures;
|
|
21
21
|
export { coreFeatures, columnFilteringFeature, columnOrderingFeature, columnVisibilityFeature, globalFilteringFeature, rowSortingFeature, rowPaginationFeature, rowSelectionFeature, rowExpandingFeature, createCoreRowModel, createFilteredRowModel, createSortedRowModel, createPaginatedRowModel, createExpandedRowModel, };
|
|
22
22
|
export type Table<TData extends RowData> = ReactTable<DishUITableFeatures, TData>;
|
|
@@ -1,49 +1,57 @@
|
|
|
1
1
|
import { useMemo as e } from "react";
|
|
2
|
-
import { columnFilteringFeature as t, columnOrderingFeature as n, columnVisibilityFeature as r, coreFeatures as i, createCoreRowModel as a, createExpandedRowModel as o, createFilteredRowModel as s, createPaginatedRowModel as c, createSortedRowModel as l,
|
|
2
|
+
import { columnFilteringFeature as t, columnOrderingFeature as n, columnVisibilityFeature as r, coreFeatures as i, createCoreRowModel as a, createExpandedRowModel as o, createFilteredRowModel as s, createPaginatedRowModel as c, createSortedRowModel as l, filterFns as u, flexRender as d, globalFilteringFeature as f, rowExpandingFeature as p, rowPaginationFeature as m, rowSelectionFeature as h, rowSortingFeature as g, sortFns as _, tableFeatures as v, useTable as y } from "@tanstack/react-table";
|
|
3
3
|
//#region src/components/pro/DataTable/tanstack-table.ts
|
|
4
|
-
var
|
|
4
|
+
var b = v({
|
|
5
5
|
...i,
|
|
6
6
|
columnFilteringFeature: t,
|
|
7
7
|
columnOrderingFeature: n,
|
|
8
8
|
columnVisibilityFeature: r,
|
|
9
|
-
globalFilteringFeature:
|
|
10
|
-
rowSortingFeature:
|
|
11
|
-
rowPaginationFeature:
|
|
12
|
-
rowSelectionFeature:
|
|
13
|
-
rowExpandingFeature:
|
|
9
|
+
globalFilteringFeature: f,
|
|
10
|
+
rowSortingFeature: g,
|
|
11
|
+
rowPaginationFeature: m,
|
|
12
|
+
rowSelectionFeature: h,
|
|
13
|
+
rowExpandingFeature: p,
|
|
14
|
+
sortFns: _,
|
|
15
|
+
filterFns: u,
|
|
14
16
|
coreRowModel: a(),
|
|
15
17
|
filteredRowModel: s(),
|
|
16
18
|
sortedRowModel: l(),
|
|
17
19
|
paginatedRowModel: c(),
|
|
18
20
|
expandedRowModel: o()
|
|
19
21
|
});
|
|
20
|
-
function
|
|
21
|
-
let { sortFns:
|
|
22
|
-
if (!
|
|
22
|
+
function x(d) {
|
|
23
|
+
let { sortFns: x, filterFns: S, ...C } = d, w = e(() => {
|
|
24
|
+
if (!x && !S) return b;
|
|
23
25
|
let e = {
|
|
24
26
|
...i,
|
|
25
27
|
columnFilteringFeature: t,
|
|
26
28
|
columnOrderingFeature: n,
|
|
27
29
|
columnVisibilityFeature: r,
|
|
28
|
-
globalFilteringFeature:
|
|
29
|
-
rowSortingFeature:
|
|
30
|
-
rowPaginationFeature:
|
|
31
|
-
rowSelectionFeature:
|
|
32
|
-
rowExpandingFeature:
|
|
30
|
+
globalFilteringFeature: f,
|
|
31
|
+
rowSortingFeature: g,
|
|
32
|
+
rowPaginationFeature: m,
|
|
33
|
+
rowSelectionFeature: h,
|
|
34
|
+
rowExpandingFeature: p,
|
|
33
35
|
coreRowModel: a(),
|
|
34
36
|
filteredRowModel: s(),
|
|
35
37
|
sortedRowModel: l(),
|
|
36
38
|
paginatedRowModel: c(),
|
|
37
39
|
expandedRowModel: o()
|
|
38
40
|
};
|
|
39
|
-
return
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
41
|
+
return e.sortFns = {
|
|
42
|
+
..._,
|
|
43
|
+
...x
|
|
44
|
+
}, e.filterFns = {
|
|
45
|
+
...u,
|
|
46
|
+
...S
|
|
47
|
+
}, v(e);
|
|
48
|
+
}, [x, S]);
|
|
49
|
+
return y({
|
|
50
|
+
features: w,
|
|
51
|
+
...C
|
|
44
52
|
});
|
|
45
53
|
}
|
|
46
54
|
//#endregion
|
|
47
|
-
export { t as columnFilteringFeature, n as columnOrderingFeature, r as columnVisibilityFeature, i as coreFeatures, a as createCoreRowModel, o as createExpandedRowModel, s as createFilteredRowModel, c as createPaginatedRowModel, l as createSortedRowModel,
|
|
55
|
+
export { _ as builtInSortFns, t as columnFilteringFeature, n as columnOrderingFeature, r as columnVisibilityFeature, i as coreFeatures, a as createCoreRowModel, o as createExpandedRowModel, s as createFilteredRowModel, c as createPaginatedRowModel, l as createSortedRowModel, d as flexRender, f as globalFilteringFeature, p as rowExpandingFeature, m as rowPaginationFeature, h as rowSelectionFeature, g as rowSortingFeature, v as tableFeatures, x as useReactTable, y as useTable };
|
|
48
56
|
|
|
49
57
|
//# sourceMappingURL=tanstack-table.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tanstack-table.js","names":[],"sources":["../../../../src/components/pro/DataTable/tanstack-table.ts"],"sourcesContent":["/**\n * TanStack Table v9 适配层(全面使用 v9 原生 API)。\n *\n * DishUI 的 DataTable 现已全面迁移到 TanStack Table v9 的原生 API:\n * - `useTable` + `tableFeatures({...})` 显式注册特性与 row model 工厂;\n * - row model 通过 `createCoreRowModel()` / `createSortedRowModel()` 等工厂注册;\n * - 使用 `table.state`(而非 v8 的 `table.getState()`)读取状态;\n * - 列定义的自定义排序使用 `sortFn`(v8 为 `sortingFn`)。\n *\n * 本模块把 v9 的多泛型类型(`<TFeatures, TData, TValue>`)用 `StockFeatures`\n * 预绑定成单泛型别名(`ColumnDef<T>`、`Row<T>`、`Table<T>` 等),让上层代码\n * 保持简洁;同时保留一个 v8 命名习惯的 `useReactTable` 包装器,内部把\n * 「row model 工厂」组装进 v9 的 `features`,从而对调用方屏蔽 v9 的 `features`\n * 组装细节。请始终从本模块导入表格相关类型与工具,而不要直接依赖\n * `@tanstack/react-table`。\n */\nimport {\n useTable,\n flexRender,\n tableFeatures,\n type ReactTable,\n // 核心特性\n coreFeatures,\n // 各功能特性\n columnFilteringFeature,\n columnOrderingFeature,\n columnVisibilityFeature,\n globalFilteringFeature,\n rowSortingFeature,\n rowPaginationFeature,\n rowSelectionFeature,\n rowExpandingFeature,\n // row model 工厂\n createCoreRowModel,\n createFilteredRowModel,\n createSortedRowModel,\n createPaginatedRowModel,\n createExpandedRowModel,\n} from '@tanstack/react-table';\nimport type {\n RowData,\n OnChangeFn,\n Updater,\n CellContext as CoreCellContext,\n HeaderContext as CoreHeaderContext,\n // 状态类型\n SortingState,\n ColumnFiltersState,\n RowSelectionState,\n PaginationState,\n ColumnOrderState,\n ExpandedState,\n ColumnVisibilityState,\n // 多泛型类型(用 StockFeatures 预绑定为单泛型别名)\n StockFeatures,\n Column as CoreColumn,\n ColumnDef as CoreColumnDef,\n Row as CoreRow,\n Cell as CoreCell,\n Header as CoreHeader,\n HeaderGroup as CoreHeaderGroup,\n SortFnOption,\n SortFn as CoreSortFn,\n FilterFn as CoreFilterFn,\n ColumnMeta as CoreColumnMeta,\n TableOptions,\n} from '@tanstack/react-table';\nimport { useMemo } from 'react';\n\nexport { flexRender, useTable, tableFeatures };\n\n/**\n * 一个包含全部常用特性 + row model 工厂的默认 features 预设。\n * `useReactTable` 会用它作为默认 `features`,因此调用方无需手动组装。\n * (内部常量:其推断类型引用了 table-core 的内部路径,不对外导出以避免\n * 声明文件的可移植性问题;对外通过 `DishUITableFeatures` 类型别名暴露。)\n */\nconst dishuiTableFeatures = tableFeatures({\n ...coreFeatures,\n columnFilteringFeature,\n columnOrderingFeature,\n columnVisibilityFeature,\n globalFilteringFeature,\n rowSortingFeature,\n rowPaginationFeature,\n rowSelectionFeature,\n rowExpandingFeature,\n coreRowModel: createCoreRowModel(),\n filteredRowModel: createFilteredRowModel(),\n sortedRowModel: createSortedRowModel(),\n paginatedRowModel: createPaginatedRowModel(),\n expandedRowModel: createExpandedRowModel(),\n});\n\nexport type DishUITableFeatures = StockFeatures;\n\n// v9 原生 row model 工厂再导出(供需要精细控制 features 的调用方使用)。\nexport {\n coreFeatures,\n columnFilteringFeature,\n columnOrderingFeature,\n columnVisibilityFeature,\n globalFilteringFeature,\n rowSortingFeature,\n rowPaginationFeature,\n rowSelectionFeature,\n rowExpandingFeature,\n createCoreRowModel,\n createFilteredRowModel,\n createSortedRowModel,\n createPaginatedRowModel,\n createExpandedRowModel,\n};\n\n// 单泛型(StockFeatures 预绑定)类型别名,保持上层简洁。\n// `Table` 映射到 `useTable` 返回的 ReactTable(具备 `.state` / `.FlexRender`)。\nexport type Table<TData extends RowData> = ReactTable<DishUITableFeatures, TData>;\nexport type Column<TData extends RowData, TValue = unknown> = CoreColumn<DishUITableFeatures, TData, TValue>;\nexport type ColumnDef<TData extends RowData, TValue = unknown> = CoreColumnDef<DishUITableFeatures, TData, TValue>;\nexport type Row<TData extends RowData> = CoreRow<DishUITableFeatures, TData>;\nexport type Cell<TData extends RowData, TValue = unknown> = CoreCell<DishUITableFeatures, TData, TValue>;\nexport type Header<TData extends RowData, TValue = unknown> = CoreHeader<DishUITableFeatures, TData, TValue>;\nexport type HeaderGroup<TData extends RowData> = CoreHeaderGroup<DishUITableFeatures, TData>;\nexport type CellContext<TData extends RowData, TValue = unknown> = CoreCellContext<DishUITableFeatures, TData, TValue>;\nexport type HeaderContext<TData extends RowData, TValue = unknown> = CoreHeaderContext<DishUITableFeatures, TData, TValue>;\n\n// 状态类型(沿用 v8 惯用命名)。\nexport type {\n SortingState,\n ColumnFiltersState,\n RowSelectionState,\n PaginationState,\n ColumnOrderState,\n ExpandedState,\n OnChangeFn,\n Updater,\n RowData,\n};\n\n/** v8 `VisibilityState` -> v9 `ColumnVisibilityState`。 */\nexport type VisibilityState = ColumnVisibilityState;\n\n/** 列的自定义排序函数(v9:`sortFn`)。 */\nexport type SortingFnOption<TData extends RowData> = SortFnOption<DishUITableFeatures, TData>;\nexport type SortingFn<TData extends RowData> = CoreSortFn<DishUITableFeatures, TData>;\nexport type FilterFn<TData extends RowData> = CoreFilterFn<DishUITableFeatures, TData>;\nexport type ColumnMeta<TData extends RowData, TValue = unknown> = CoreColumnMeta<DishUITableFeatures, TData, TValue>;\n\n/**\n * v8 命名习惯的表格 hook 包装器。\n *\n * 接收「已经组装好的」表格选项(不含 `features`),自动注入 DishUI 的默认\n * `features` 预设(含 core + 全部常用特性 + row model 工厂),返回 v9 原生\n * 的 `useTable` 实例。若需自定义排序/筛选函数注册表,可通过 `sortFns` /\n * `filterFns` 传入(会并入 features)。\n */\nexport function useReactTable<TData extends RowData>(\n options: Omit<TableOptions<DishUITableFeatures, TData>, 'features'> & {\n /** 自定义排序函数注册表(v9:合入 features 的 sortFns)。 */\n sortFns?: Record<string, SortingFn<TData>>;\n /** 自定义筛选函数注册表(v9:合入 features 的 filterFns)。 */\n filterFns?: Record<string, FilterFn<TData>>;\n },\n): Table<TData> {\n const { sortFns, filterFns, ...rest } = options;\n\n const features = useMemo(() => {\n if (!sortFns && !filterFns) return dishuiTableFeatures;\n const merged: Record<string, unknown> = {\n ...coreFeatures,\n columnFilteringFeature,\n columnOrderingFeature,\n columnVisibilityFeature,\n globalFilteringFeature,\n rowSortingFeature,\n rowPaginationFeature,\n rowSelectionFeature,\n rowExpandingFeature,\n coreRowModel: createCoreRowModel(),\n filteredRowModel: createFilteredRowModel(),\n sortedRowModel: createSortedRowModel(),\n paginatedRowModel: createPaginatedRowModel(),\n expandedRowModel: createExpandedRowModel(),\n };\n
|
|
1
|
+
{"version":3,"file":"tanstack-table.js","names":[],"sources":["../../../../src/components/pro/DataTable/tanstack-table.ts"],"sourcesContent":["/**\n * TanStack Table v9 适配层(全面使用 v9 原生 API)。\n *\n * DishUI 的 DataTable 现已全面迁移到 TanStack Table v9 的原生 API:\n * - `useTable` + `tableFeatures({...})` 显式注册特性与 row model 工厂;\n * - row model 通过 `createCoreRowModel()` / `createSortedRowModel()` 等工厂注册;\n * - 使用 `table.state`(而非 v8 的 `table.getState()`)读取状态;\n * - 列定义的自定义排序使用 `sortFn`(v8 为 `sortingFn`)。\n *\n * 本模块把 v9 的多泛型类型(`<TFeatures, TData, TValue>`)用 `StockFeatures`\n * 预绑定成单泛型别名(`ColumnDef<T>`、`Row<T>`、`Table<T>` 等),让上层代码\n * 保持简洁;同时保留一个 v8 命名习惯的 `useReactTable` 包装器,内部把\n * 「row model 工厂」组装进 v9 的 `features`,从而对调用方屏蔽 v9 的 `features`\n * 组装细节。请始终从本模块导入表格相关类型与工具,而不要直接依赖\n * `@tanstack/react-table`。\n */\nimport {\n useTable,\n flexRender,\n sortFns as builtInSortFns,\n filterFns as builtInFilterFns,\n tableFeatures,\n type ReactTable,\n // 核心特性\n coreFeatures,\n // 各功能特性\n columnFilteringFeature,\n columnOrderingFeature,\n columnVisibilityFeature,\n globalFilteringFeature,\n rowSortingFeature,\n rowPaginationFeature,\n rowSelectionFeature,\n rowExpandingFeature,\n // row model 工厂\n createCoreRowModel,\n createFilteredRowModel,\n createSortedRowModel,\n createPaginatedRowModel,\n createExpandedRowModel,\n} from '@tanstack/react-table';\nimport type {\n RowData,\n OnChangeFn,\n Updater,\n CellContext as CoreCellContext,\n HeaderContext as CoreHeaderContext,\n // 状态类型\n SortingState,\n ColumnFiltersState,\n RowSelectionState,\n PaginationState,\n ColumnOrderState,\n ExpandedState,\n ColumnVisibilityState,\n // 多泛型类型(用 StockFeatures 预绑定为单泛型别名)\n StockFeatures,\n Column as CoreColumn,\n ColumnDef as CoreColumnDef,\n Row as CoreRow,\n Cell as CoreCell,\n Header as CoreHeader,\n HeaderGroup as CoreHeaderGroup,\n SortFnOption,\n SortFn as CoreSortFn,\n FilterFn as CoreFilterFn,\n ColumnMeta as CoreColumnMeta,\n TableOptions,\n} from '@tanstack/react-table';\nimport { useMemo } from 'react';\n\nexport { flexRender, useTable, tableFeatures, builtInSortFns };\n\n/**\n * 一个包含全部常用特性 + row model 工厂的默认 features 预设。\n * `useReactTable` 会用它作为默认 `features`,因此调用方无需手动组装。\n * (内部常量:其推断类型引用了 table-core 的内部路径,不对外导出以避免\n * 声明文件的可移植性问题;对外通过 `DishUITableFeatures` 类型别名暴露。)\n */\nconst dishuiTableFeatures = tableFeatures({\n ...coreFeatures,\n columnFilteringFeature,\n columnOrderingFeature,\n columnVisibilityFeature,\n globalFilteringFeature,\n rowSortingFeature,\n rowPaginationFeature,\n rowSelectionFeature,\n rowExpandingFeature,\n sortFns: builtInSortFns,\n filterFns: builtInFilterFns,\n coreRowModel: createCoreRowModel(),\n filteredRowModel: createFilteredRowModel(),\n sortedRowModel: createSortedRowModel(),\n paginatedRowModel: createPaginatedRowModel(),\n expandedRowModel: createExpandedRowModel(),\n});\n\nexport type DishUITableFeatures = StockFeatures;\n\n// v9 原生 row model 工厂再导出(供需要精细控制 features 的调用方使用)。\nexport {\n coreFeatures,\n columnFilteringFeature,\n columnOrderingFeature,\n columnVisibilityFeature,\n globalFilteringFeature,\n rowSortingFeature,\n rowPaginationFeature,\n rowSelectionFeature,\n rowExpandingFeature,\n createCoreRowModel,\n createFilteredRowModel,\n createSortedRowModel,\n createPaginatedRowModel,\n createExpandedRowModel,\n};\n\n// 单泛型(StockFeatures 预绑定)类型别名,保持上层简洁。\n// `Table` 映射到 `useTable` 返回的 ReactTable(具备 `.state` / `.FlexRender`)。\nexport type Table<TData extends RowData> = ReactTable<DishUITableFeatures, TData>;\nexport type Column<TData extends RowData, TValue = unknown> = CoreColumn<DishUITableFeatures, TData, TValue>;\nexport type ColumnDef<TData extends RowData, TValue = unknown> = CoreColumnDef<DishUITableFeatures, TData, TValue>;\nexport type Row<TData extends RowData> = CoreRow<DishUITableFeatures, TData>;\nexport type Cell<TData extends RowData, TValue = unknown> = CoreCell<DishUITableFeatures, TData, TValue>;\nexport type Header<TData extends RowData, TValue = unknown> = CoreHeader<DishUITableFeatures, TData, TValue>;\nexport type HeaderGroup<TData extends RowData> = CoreHeaderGroup<DishUITableFeatures, TData>;\nexport type CellContext<TData extends RowData, TValue = unknown> = CoreCellContext<DishUITableFeatures, TData, TValue>;\nexport type HeaderContext<TData extends RowData, TValue = unknown> = CoreHeaderContext<DishUITableFeatures, TData, TValue>;\n\n// 状态类型(沿用 v8 惯用命名)。\nexport type {\n SortingState,\n ColumnFiltersState,\n RowSelectionState,\n PaginationState,\n ColumnOrderState,\n ExpandedState,\n OnChangeFn,\n Updater,\n RowData,\n};\n\n/** v8 `VisibilityState` -> v9 `ColumnVisibilityState`。 */\nexport type VisibilityState = ColumnVisibilityState;\n\n/** 列的自定义排序函数(v9:`sortFn`)。 */\nexport type SortingFnOption<TData extends RowData> = SortFnOption<DishUITableFeatures, TData>;\nexport type SortingFn<TData extends RowData> = CoreSortFn<DishUITableFeatures, TData>;\nexport type FilterFn<TData extends RowData> = CoreFilterFn<DishUITableFeatures, TData>;\nexport type ColumnMeta<TData extends RowData, TValue = unknown> = CoreColumnMeta<DishUITableFeatures, TData, TValue>;\n\n/**\n * v8 命名习惯的表格 hook 包装器。\n *\n * 接收「已经组装好的」表格选项(不含 `features`),自动注入 DishUI 的默认\n * `features` 预设(含 core + 全部常用特性 + row model 工厂),返回 v9 原生\n * 的 `useTable` 实例。若需自定义排序/筛选函数注册表,可通过 `sortFns` /\n * `filterFns` 传入(会并入 features)。\n */\nexport function useReactTable<TData extends RowData>(\n options: Omit<TableOptions<DishUITableFeatures, TData>, 'features'> & {\n /** 自定义排序函数注册表(v9:合入 features 的 sortFns)。 */\n sortFns?: Record<string, SortingFn<TData>>;\n /** 自定义筛选函数注册表(v9:合入 features 的 filterFns)。 */\n filterFns?: Record<string, FilterFn<TData>>;\n },\n): Table<TData> {\n const { sortFns, filterFns, ...rest } = options;\n\n const features = useMemo(() => {\n if (!sortFns && !filterFns) return dishuiTableFeatures;\n const merged: Record<string, unknown> = {\n ...coreFeatures,\n columnFilteringFeature,\n columnOrderingFeature,\n columnVisibilityFeature,\n globalFilteringFeature,\n rowSortingFeature,\n rowPaginationFeature,\n rowSelectionFeature,\n rowExpandingFeature,\n coreRowModel: createCoreRowModel(),\n filteredRowModel: createFilteredRowModel(),\n sortedRowModel: createSortedRowModel(),\n paginatedRowModel: createPaginatedRowModel(),\n expandedRowModel: createExpandedRowModel(),\n };\n merged.sortFns = { ...builtInSortFns, ...sortFns };\n merged.filterFns = { ...builtInFilterFns, ...filterFns };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n return tableFeatures(merged as any);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [sortFns, filterFns]);\n\n return useTable<DishUITableFeatures, TData>({\n features,\n ...rest,\n } as TableOptions<DishUITableFeatures, TData>) as unknown as Table<TData>;\n}\n"],"mappings":";;;AA+EA,IAAM,IAAsB,EAAc;CACxC,GAAG;CACH;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA,SAAS;CACE;CACX,cAAc,EAAmB;CACjC,kBAAkB,EAAuB;CACzC,gBAAgB,EAAqB;CACrC,mBAAmB,EAAwB;CAC3C,kBAAkB,EAAuB;AAC3C,CAAC;AAgED,SAAgB,EACd,GAMc;CACd,IAAM,EAAE,YAAS,WAAA,GAAW,GAAG,MAAS,GAElC,IAAW,QAAc;EAC7B,IAAI,CAAC,KAAW,CAAC,GAAW,OAAO;EACnC,IAAM,IAAkC;GACtC,GAAG;GACH;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,cAAc,EAAmB;GACjC,kBAAkB,EAAuB;GACzC,gBAAgB,EAAqB;GACrC,mBAAmB,EAAwB;GAC3C,kBAAkB,EAAuB;EAC3C;EAIA,OAHA,EAAO,UAAU;GAAE,GAAG;GAAgB,GAAG;EAAQ,GACjD,EAAO,YAAY;GAAE,GAAG;GAAkB,GAAG;EAAU,GAEhD,EAAc,CAAa;CAEpC,GAAG,CAAC,GAAS,CAAS,CAAC;CAEvB,OAAO,EAAqC;EAC1C;EACA,GAAG;CACL,CAA6C;AAC/C"}
|
|
@@ -2,6 +2,8 @@ import { Row } from './tanstack-table';
|
|
|
2
2
|
export declare const treeRowAnimationStyles = "\n.tree-row-icon {\n transition: transform 0.3s ease;\n}\n\n.tree-row-expanded .tree-row-icon {\n transform: rotate(90deg);\n}\n";
|
|
3
3
|
export declare function findAllChildRowIds<T>(row: any, parentId: string, subDataKey: string, getRowId?: (row: T, index: number) => string, prefix?: string): string[];
|
|
4
4
|
export declare function flattenTreeData<T extends object>(items: T[], expandedRowsState: Record<string, boolean>, subDataKey: string, getRowId?: (row: T, index: number) => string, depth?: number, parentId?: string, isParentExpanded?: boolean, result?: any[], onlyTopLevel?: boolean): any[];
|
|
5
|
+
/** Keep the hierarchy intact for TanStack's filter → sort → root-page → expand pipeline. */
|
|
6
|
+
export declare function prepareTreeData<T extends object>(items: T[], expanded: Record<string, boolean>, subDataKey: string, getRowId?: (row: T, index: number) => string, depth?: number, parentId?: string): T[];
|
|
5
7
|
export declare function createTreeSortingFns<T extends object>(): {
|
|
6
8
|
treeSortAsc: (rowA: Row<T>, rowB: Row<T>, columnId: string) => number;
|
|
7
9
|
};
|
|
@@ -2,32 +2,31 @@
|
|
|
2
2
|
var e = "\n.tree-row-icon {\n transition: transform 0.3s ease;\n}\n\n.tree-row-expanded .tree-row-icon {\n transform: rotate(90deg);\n}\n";
|
|
3
3
|
function t(e, n, r, i, a = "") {
|
|
4
4
|
let o = [], s = e[r];
|
|
5
|
-
return Array.isArray(s) && s.length > 0 && s.forEach((e,
|
|
6
|
-
let
|
|
7
|
-
o.push(
|
|
8
|
-
let
|
|
9
|
-
o.push(...
|
|
5
|
+
return Array.isArray(s) && s.length > 0 && s.forEach((e, a) => {
|
|
6
|
+
let s = i ? i(e, a) : `${n}_${a}`;
|
|
7
|
+
o.push(s);
|
|
8
|
+
let c = t(e, s, r, i);
|
|
9
|
+
o.push(...c);
|
|
10
10
|
}), o;
|
|
11
11
|
}
|
|
12
|
-
function n(e, t, r, i, a = 0, o = ""
|
|
13
|
-
return e.
|
|
14
|
-
let
|
|
12
|
+
function n(e, t, r, i, a = 0, o = "") {
|
|
13
|
+
return e.map((e, s) => {
|
|
14
|
+
let c = i ? i(e, s) : a > 0 ? `${o}_${s}` : String(s), l = e[r], u = Array.isArray(l) ? l : [];
|
|
15
|
+
return {
|
|
15
16
|
...e,
|
|
16
|
-
|
|
17
|
-
__id:
|
|
17
|
+
[r]: n(u, t, r, i, a + 1, c),
|
|
18
|
+
__id: c,
|
|
18
19
|
__parentId: o,
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
__childCount:
|
|
20
|
+
__depth: a,
|
|
21
|
+
__hasChildren: u.length > 0,
|
|
22
|
+
__childCount: u.length,
|
|
23
|
+
__isExpanded: t[c] || !1
|
|
22
24
|
};
|
|
23
|
-
|
|
24
|
-
let p = t[d] || !1;
|
|
25
|
-
Array.isArray(e[r]) && e[r].length > 0 && p && !l && n(e[r], t, r, i, a + 1, d, s && p, c, l);
|
|
26
|
-
}), c;
|
|
25
|
+
});
|
|
27
26
|
}
|
|
28
27
|
function r() {
|
|
29
28
|
return { treeSortAsc: (e, t, n) => {
|
|
30
|
-
let r = e.original, i = t.original, a = r.__depth
|
|
29
|
+
let r = e.original, i = t.original, a = e.depth ?? r.__depth ?? 0, o = t.depth ?? i.__depth ?? 0;
|
|
31
30
|
if (a !== o) return 0;
|
|
32
31
|
if (a === 0 && o === 0) {
|
|
33
32
|
let r = e.getValue(n), i = t.getValue(n);
|
|
@@ -37,6 +36,6 @@ function r() {
|
|
|
37
36
|
} };
|
|
38
37
|
}
|
|
39
38
|
//#endregion
|
|
40
|
-
export { r as createTreeSortingFns, t as findAllChildRowIds, n as
|
|
39
|
+
export { r as createTreeSortingFns, t as findAllChildRowIds, n as prepareTreeData, e as treeRowAnimationStyles };
|
|
41
40
|
|
|
42
41
|
//# sourceMappingURL=treeDataUtils.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"treeDataUtils.js","names":[],"sources":["../../../../src/components/pro/DataTable/treeDataUtils.ts"],"sourcesContent":["import { Row } from './tanstack-table';\n\nexport const treeRowAnimationStyles = `\n.tree-row-icon {\n transition: transform 0.3s ease;\n}\n\n.tree-row-expanded .tree-row-icon {\n transform: rotate(90deg);\n}\n`;\n\nexport function findAllChildRowIds<T>(\n row: any,\n parentId: string,\n subDataKey: string,\n getRowId?: (row: T, index: number) => string,\n prefix: string = '',\n): string[] {\n const childIds: string[] = [];\n const subs = row[subDataKey];\n\n if (Array.isArray(subs) && subs.length > 0) {\n subs.forEach((subRow: any, index: number) => {\n const childId = getRowId\n ? getRowId(subRow, index)\n : `${
|
|
1
|
+
{"version":3,"file":"treeDataUtils.js","names":[],"sources":["../../../../src/components/pro/DataTable/treeDataUtils.ts"],"sourcesContent":["import { Row } from './tanstack-table';\n\nexport const treeRowAnimationStyles = `\n.tree-row-icon {\n transition: transform 0.3s ease;\n}\n\n.tree-row-expanded .tree-row-icon {\n transform: rotate(90deg);\n}\n`;\n\nexport function findAllChildRowIds<T>(\n row: any,\n parentId: string,\n subDataKey: string,\n getRowId?: (row: T, index: number) => string,\n prefix: string = '',\n): string[] {\n const childIds: string[] = [];\n const subs = row[subDataKey];\n\n if (Array.isArray(subs) && subs.length > 0) {\n subs.forEach((subRow: any, index: number) => {\n const childId = getRowId\n ? getRowId(subRow, index)\n : `${parentId}_${index}`;\n\n childIds.push(childId);\n\n const subChildIds = findAllChildRowIds(\n subRow, childId, subDataKey, getRowId,\n );\n childIds.push(...subChildIds);\n });\n }\n\n return childIds;\n}\n\nexport function flattenTreeData<T extends object>(\n items: T[],\n expandedRowsState: Record<string, boolean>,\n subDataKey: string,\n getRowId?: (row: T, index: number) => string,\n depth: number = 0,\n parentId: string = '',\n isParentExpanded: boolean = true,\n result: any[] = [],\n onlyTopLevel: boolean = false,\n) {\n items.forEach((item: any, index: number) => {\n const rowId = getRowId\n ? getRowId(item, index)\n : parentId ? `${parentId}_${index}` : `${index}`;\n\n const rowWithMeta = {\n ...item,\n __depth: depth,\n __id: rowId,\n __parentId: parentId,\n __hasChildren: Array.isArray(item[subDataKey]) && item[subDataKey].length > 0,\n __isExpanded: expandedRowsState[rowId] || false,\n __childCount: Array.isArray(item[subDataKey]) ? item[subDataKey].length : 0,\n };\n\n if (onlyTopLevel) {\n if (depth === 0) result.push(rowWithMeta);\n } else {\n if (depth === 0 || isParentExpanded) result.push(rowWithMeta);\n }\n\n const isExpanded = expandedRowsState[rowId] || false;\n if (Array.isArray(item[subDataKey]) && item[subDataKey].length > 0 && isExpanded && !onlyTopLevel) {\n flattenTreeData(\n item[subDataKey], expandedRowsState, subDataKey, getRowId,\n depth + 1, rowId, isParentExpanded && isExpanded, result, onlyTopLevel,\n );\n }\n });\n\n return result;\n}\n\n/** Keep the hierarchy intact for TanStack's filter → sort → root-page → expand pipeline. */\nexport function prepareTreeData<T extends object>(\n items: T[],\n expanded: Record<string, boolean>,\n subDataKey: string,\n getRowId?: (row: T, index: number) => string,\n depth = 0,\n parentId = '',\n): T[] {\n return items.map((item, index) => {\n const id = getRowId ? getRowId(item, index) : depth > 0 ? `${parentId}_${index}` : String(index);\n const children = (item as Record<string, unknown>)[subDataKey];\n const subs = Array.isArray(children) ? children as T[] : [];\n return {\n ...item,\n [subDataKey]: prepareTreeData(subs, expanded, subDataKey, getRowId, depth + 1, id),\n __id: id,\n __parentId: parentId,\n __depth: depth,\n __hasChildren: subs.length > 0,\n __childCount: subs.length,\n __isExpanded: expanded[id] || false,\n };\n });\n}\n\nexport function createTreeSortingFns<T extends object>() {\n return {\n treeSortAsc: (rowA: Row<T>, rowB: Row<T>, columnId: string) => {\n const valueA = rowA.original as any;\n const valueB = rowB.original as any;\n\n const depthA = rowA.depth ?? valueA.__depth ?? 0;\n const depthB = rowB.depth ?? valueB.__depth ?? 0;\n\n if (depthA !== depthB) return 0;\n\n if (depthA === 0 && depthB === 0) {\n const colA = rowA.getValue(columnId);\n const colB = rowB.getValue(columnId);\n\n if (colA === colB) return 0;\n if (colA == null) return -1;\n if (colB == null) return 1;\n\n if (typeof colA === 'number' && typeof colB === 'number') {\n return colA - colB;\n }\n if (colA instanceof Date && colB instanceof Date) {\n return colA.getTime() - colB.getTime();\n }\n return String(colA).localeCompare(String(colB));\n }\n\n return 0;\n },\n };\n}\n"],"mappings":";AAEA,IAAa,IAAyB;AAUtC,SAAgB,EACd,GACA,GACA,GACA,GACA,IAAiB,IACP;CACV,IAAM,IAAqB,CAAC,GACtB,IAAO,EAAI;CAiBjB,OAfI,MAAM,QAAQ,CAAI,KAAK,EAAK,SAAS,KACvC,EAAK,SAAS,GAAa,MAAkB;EAC3C,IAAM,IAAU,IACZ,EAAS,GAAQ,CAAK,IACtB,GAAG,EAAS,GAAG;EAEnB,EAAS,KAAK,CAAO;EAErB,IAAM,IAAc,EAClB,GAAQ,GAAS,GAAY,CAC/B;EACA,EAAS,KAAK,GAAG,CAAW;CAC9B,CAAC,GAGI;AACT;AA+CA,SAAgB,EACd,GACA,GACA,GACA,GACA,IAAQ,GACR,IAAW,IACN;CACL,OAAO,EAAM,KAAK,GAAM,MAAU;EAChC,IAAM,IAAK,IAAW,EAAS,GAAM,CAAK,IAAI,IAAQ,IAAI,GAAG,EAAS,GAAG,MAAU,OAAO,CAAK,GACzF,IAAY,EAAiC,IAC7C,IAAO,MAAM,QAAQ,CAAQ,IAAI,IAAkB,CAAC;EAC1D,OAAO;GACL,GAAG;IACF,IAAa,EAAgB,GAAM,GAAU,GAAY,GAAU,IAAQ,GAAG,CAAE;GACjF,MAAM;GACN,YAAY;GACZ,SAAS;GACT,eAAe,EAAK,SAAS;GAC7B,cAAc,EAAK;GACnB,cAAc,EAAS,MAAO;EAChC;CACF,CAAC;AACH;AAEA,SAAgB,IAAyC;CACvD,OAAO,EACL,cAAc,GAAc,GAAc,MAAqB;EAC7D,IAAM,IAAS,EAAK,UACd,IAAS,EAAK,UAEd,IAAS,EAAK,SAAS,EAAO,WAAW,GACzC,IAAS,EAAK,SAAS,EAAO,WAAW;EAE/C,IAAI,MAAW,GAAQ,OAAO;EAE9B,IAAI,MAAW,KAAK,MAAW,GAAG;GAChC,IAAM,IAAO,EAAK,SAAS,CAAQ,GAC7B,IAAO,EAAK,SAAS,CAAQ;GAYnC,OAVI,MAAS,IAAa,IACtB,KAAQ,OAAa,KACrB,KAAQ,OAAa,IAErB,OAAO,KAAS,YAAY,OAAO,KAAS,WACvC,IAAO,IAEZ,aAAgB,QAAQ,aAAgB,OACnC,EAAK,QAAQ,IAAI,EAAK,QAAQ,IAEhC,OAAO,CAAI,CAAC,CAAC,cAAc,OAAO,CAAI,CAAC;EAChD;EAEA,OAAO;CACT,EACF;AACF"}
|
|
@@ -46,14 +46,21 @@ export interface DataTableProps<T extends object> {
|
|
|
46
46
|
enableSelection?: boolean;
|
|
47
47
|
enableColumnReordering?: boolean;
|
|
48
48
|
enableColumnResizing?: boolean;
|
|
49
|
+
/** 跳过本地筛选;服务端分页时始终跳过。 */
|
|
49
50
|
manualFiltering?: boolean;
|
|
51
|
+
/** 跳过本地排序;服务端分页时始终跳过。 */
|
|
52
|
+
manualSorting?: boolean;
|
|
53
|
+
/** 按根节点分页,展开后代不占页大小。默认仅对根节点筛选,保留匹配根的整个子树。 */
|
|
50
54
|
enableExpanding?: boolean;
|
|
51
55
|
subDataKey?: string;
|
|
52
56
|
onRowExpand?: ExpandRowHandler;
|
|
53
57
|
expandedRows?: Record<string, boolean>;
|
|
58
|
+
defaultExpandedRows?: Record<string, boolean>;
|
|
54
59
|
onExpandedRowsChange?: (expandedRows: Record<string, boolean>) => void;
|
|
60
|
+
/** 必须全表唯一;服务端分页/数据重排时应提供稳定业务 ID。默认 ID 是输入索引(子行用父 ID_index)。 */
|
|
55
61
|
getRowId?: (row: T, index: number) => string;
|
|
56
62
|
indentSize?: number;
|
|
63
|
+
/** 默认 true:只排序根节点,后代保持输入顺序。false:逐层排序同级节点,仍保持树结构。 */
|
|
57
64
|
enableTreeSort?: boolean;
|
|
58
65
|
toolbar?: ToolbarOptions;
|
|
59
66
|
customFilterPanel?: React.ComponentType<CustomFilterPanelProps>;
|
|
@@ -71,19 +78,36 @@ export interface DataTableProps<T extends object> {
|
|
|
71
78
|
onTableClick?: TableEventHandler;
|
|
72
79
|
onTableMouseEnter?: TableEventHandler;
|
|
73
80
|
onTableMouseLeave?: TableEventHandler;
|
|
81
|
+
/** 默认 false:data 是完整客户端数据,先筛选/排序再分页。
|
|
82
|
+
* true:data 已由服务端完成筛选/排序/分页,不再做本地转换;需提供 rowCount 或 pageCount。
|
|
83
|
+
* enablePagination=false 只关闭本地切片和分页控件,不取消 manual* 的含义。
|
|
84
|
+
*/
|
|
85
|
+
manualPagination?: boolean;
|
|
86
|
+
/** 服务端筛选后的根节点总数;仅 manualPagination 时使用。 */
|
|
87
|
+
rowCount?: number;
|
|
88
|
+
/** 服务端总页数,优先于 rowCount;必须是非负整数(不支持未知总页数 -1)。 */
|
|
89
|
+
pageCount?: number;
|
|
74
90
|
pageSize?: number;
|
|
91
|
+
defaultPageSize?: number;
|
|
92
|
+
/** 从 0 开始。客户端非受控页码在数据缩短时夹到最后一页;受控页码由父组件负责保持有效。 */
|
|
75
93
|
pageIndex?: number;
|
|
94
|
+
defaultPageIndex?: number;
|
|
76
95
|
onPageChange?: (page: number) => void;
|
|
77
96
|
onPageSizeChange?: (pageSize: number) => void;
|
|
78
97
|
selectedRows?: RowSelectionState;
|
|
98
|
+
defaultSelectedRows?: RowSelectionState;
|
|
79
99
|
onRowSelectionChange?: (selectedRows: RowSelectionState) => void;
|
|
80
100
|
sortingState?: SortingState;
|
|
101
|
+
defaultSortingState?: SortingState;
|
|
81
102
|
onSortingChange?: (sortingState: SortingState) => void;
|
|
82
103
|
columnFilters?: ColumnFiltersState;
|
|
104
|
+
defaultColumnFilters?: ColumnFiltersState;
|
|
83
105
|
onColumnFiltersChange?: (columnFilters: ColumnFiltersState) => void;
|
|
84
106
|
columnVisibility?: VisibilityState;
|
|
107
|
+
defaultColumnVisibility?: VisibilityState;
|
|
85
108
|
onColumnVisibilityChange?: (columnVisibility: VisibilityState) => void;
|
|
86
109
|
columnOrder?: string[];
|
|
110
|
+
defaultColumnOrder?: string[];
|
|
87
111
|
onColumnOrderChange?: (columnOrder: string[]) => void;
|
|
88
112
|
extensions?: DataTableExtension<T>[];
|
|
89
113
|
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { type PaginationState, type Updater } from './tanstack-table';
|
|
2
|
+
import type { DataTableProps } from './types';
|
|
3
|
+
/** Shared by the view and executable row-model regression tests. */
|
|
4
|
+
export declare function useDataTableModel<T extends object>(props: DataTableProps<T>): {
|
|
5
|
+
table: import("./tanstack-table").Table<T>;
|
|
6
|
+
rowSelection: import("@tanstack/table-core").RowSelectionState;
|
|
7
|
+
visibilityState: import("@tanstack/table-core").ColumnVisibilityState;
|
|
8
|
+
columnOrderState: string[];
|
|
9
|
+
setColumnOrderState: import("react").Dispatch<import("react").SetStateAction<string[]>>;
|
|
10
|
+
expandedRowsState: Record<string, boolean>;
|
|
11
|
+
handleRowExpand: (rowId: string, row: T) => void;
|
|
12
|
+
resolveRowId: (row: T, index: number) => string;
|
|
13
|
+
internalPageIndex: number;
|
|
14
|
+
internalPageSize: number;
|
|
15
|
+
handlePaginationChange: (updater: Updater<PaginationState>) => void;
|
|
16
|
+
};
|