@arim-aisdc/public-components 0.0.2 → 0.0.4
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/Foo/index.d.ts +6 -0
- package/dist/{Foo → components/Foo}/index.js +6 -0
- package/dist/components/Foo/index.less +3 -0
- package/dist/components/TableMax/TableBody/Row.d.ts +38 -0
- package/dist/{TableMax → components/TableMax}/TableBody/Row.js +0 -1
- package/dist/components/TableMax/TableBody/index.d.ts +49 -0
- package/dist/{TableMax → components/TableMax}/TableBody/index.js +6 -12
- package/dist/components/TableMax/TableHeader/Cell.d.ts +13 -0
- package/dist/{TableMax → components/TableMax}/TableHeader/Cell.js +32 -17
- package/dist/components/TableMax/TableHeader/index.d.ts +16 -0
- package/dist/{TableMax → components/TableMax}/TableHeader/index.js +8 -15
- package/dist/{TableMax → components/TableMax}/TableHeader/index.less +23 -17
- package/dist/components/TableMax/TableHeader/utils.d.ts +1 -0
- package/dist/components/TableMax/TableMax.d.ts +18 -0
- package/dist/{TableMax/index.js → components/TableMax/TableMax.js} +170 -201
- package/dist/components/TableMax/components/ColumnEdit/components/numberRange/index.d.ts +8 -0
- package/dist/{TableMax → components/TableMax}/components/ColumnEdit/components/numberRange/index.js +4 -3
- package/dist/components/TableMax/components/ColumnEdit/index.d.ts +28 -0
- package/dist/{TableMax → components/TableMax}/components/ColumnEdit/index.js +31 -12
- package/dist/{TableMax → components/TableMax}/components/ColumnEdit/index.less +9 -4
- package/dist/components/TableMax/components/ColumnFilter/FilterDateRange/index.d.ts +16 -0
- package/dist/{TableMax → components/TableMax}/components/ColumnFilter/FilterDateRange/index.js +5 -4
- package/dist/components/TableMax/components/ColumnFilter/MultipleSelect/index.d.ts +8 -0
- package/dist/{TableMax → components/TableMax}/components/ColumnFilter/MultipleSelect/index.js +3 -2
- package/dist/components/TableMax/components/ColumnFilter/SingleSelect/index.d.ts +8 -0
- package/dist/{TableMax → components/TableMax}/components/ColumnFilter/SingleSelect/index.js +3 -2
- package/dist/components/TableMax/components/ColumnFilter/customFilterFns.d.ts +6 -0
- package/dist/{TableMax → components/TableMax}/components/ColumnFilter/customFilterFns.js +6 -1
- package/dist/components/TableMax/components/ColumnFilter/index.d.ts +21 -0
- package/dist/{TableMax → components/TableMax}/components/ColumnFilter/index.js +39 -36
- package/dist/components/TableMax/components/ColumnSetting/index.d.ts +18 -0
- package/dist/{TableMax → components/TableMax}/components/ColumnSetting/index.js +16 -29
- package/dist/components/TableMax/components/CustomDragerLayer/index.d.ts +2 -0
- package/dist/{TableMax → components/TableMax}/components/CustomDragerLayer/index.js +49 -9
- package/dist/{TableMax → components/TableMax}/components/CustomDragerLayer/index.less +9 -5
- package/dist/components/TableMax/index.d.ts +7 -0
- package/dist/components/TableMax/index.js +5 -0
- package/dist/{TableMax/index.less → components/TableMax/tableMax.less} +3 -7
- package/dist/components/TableMax/type.d.ts +250 -0
- package/dist/components/TableMax/type.js +1 -0
- package/dist/components/TableMax/utils.d.ts +6 -0
- package/dist/{TableMax → components/TableMax}/utils.js +1 -1
- package/dist/constants/index.d.ts +0 -0
- package/dist/constants/index.js +0 -0
- package/dist/hooks/usePageCacheState/config.d.ts +5 -0
- package/dist/hooks/usePageCacheState/config.js +1 -0
- package/dist/hooks/usePageCacheState/index.d.ts +25 -0
- package/dist/hooks/usePageCacheState/index.js +210 -0
- package/dist/hooks/usePageCacheState/tableDemoConfig.d.ts +3 -0
- package/dist/hooks/usePageCacheState/tableDemoConfig.js +5 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.js +3 -2
- package/dist/themes/ThemeContext.d.ts +6 -0
- package/dist/themes/ThemeContext.js +51 -0
- package/dist/themes/custom-dark.css +28466 -0
- package/dist/themes/custom-light.css +28092 -0
- package/dist/themes/theme.d.ts +75 -0
- package/dist/themes/theme.js +147 -0
- package/dist/themes/variables.less +70 -0
- package/dist/utils/index.d.ts +1 -0
- package/package.json +92 -89
- package/dist/Foo/index.less +0 -3
- package/dist/TableMax/type.d.ts +0 -216
- /package/dist/{TableMax → components/TableMax}/TableBody/index.less +0 -0
- /package/dist/{TableMax → components/TableMax}/TableHeader/utils.js +0 -0
- /package/dist/{TableMax → components/TableMax}/components/ColumnEdit/components/numberRange/index.less +0 -0
- /package/dist/{TableMax → components/TableMax}/components/ColumnFilter/FilterDateRange/index.less +0 -0
- /package/dist/{TableMax → components/TableMax}/components/ColumnFilter/MultipleSelect/index.less +0 -0
- /package/dist/{TableMax → components/TableMax}/components/ColumnFilter/SingleSelect/index.less +0 -0
- /package/dist/{TableMax → components/TableMax}/components/ColumnSetting/index.less +0 -0
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { OnSelectChangeType } from "../type";
|
|
2
|
+
import { Table } from '@tanstack/react-table';
|
|
3
|
+
import { Dispatch, FC, SetStateAction } from 'react';
|
|
4
|
+
import './index.less';
|
|
5
|
+
declare const Row: ({ table, tableId, row, rowSelectedId, setRowSelectedId, selectedRowChange, onSelectChange, canSelection, reorderRow, tableContainerWidth, canRowDrag, rowClassName, cellClassName, rowStyle, getCellProps, editting, rowEditing, renderSubComponent, selectedRowDragging, setSelectedRowDragging, onRowMouseEnter, onRowMouseLeave, onRowMouseClick, onRowMouseDoubleClick, rowHeight, disableDragRowIds, selectRowWhenClick, hasVerticalScrollBar, handleEditRowWhenDClick, canEditRowWhenDClick, theme, }: {
|
|
6
|
+
table: Table<any>;
|
|
7
|
+
tableId: string;
|
|
8
|
+
row: any;
|
|
9
|
+
rowSelectedId?: string;
|
|
10
|
+
setRowSelectedId?: Dispatch<SetStateAction<string | undefined>>;
|
|
11
|
+
selectedRowChange?: Function;
|
|
12
|
+
onSelectChange?: OnSelectChangeType;
|
|
13
|
+
tableContainerWidth?: number;
|
|
14
|
+
canSelection?: boolean;
|
|
15
|
+
reorderRow?: Function;
|
|
16
|
+
canRowDrag?: boolean;
|
|
17
|
+
rowClassName?: Function;
|
|
18
|
+
cellClassName?: Function;
|
|
19
|
+
rowStyle?: object;
|
|
20
|
+
getCellProps?: Function;
|
|
21
|
+
editting?: boolean;
|
|
22
|
+
rowEditing?: boolean;
|
|
23
|
+
renderSubComponent?: FC<any>;
|
|
24
|
+
selectedRowDragging?: boolean;
|
|
25
|
+
setSelectedRowDragging?: FC<any>;
|
|
26
|
+
onRowMouseEnter?: Function;
|
|
27
|
+
onRowMouseLeave?: Function;
|
|
28
|
+
onRowMouseClick?: Function;
|
|
29
|
+
onRowMouseDoubleClick?: Function;
|
|
30
|
+
rowHeight: number;
|
|
31
|
+
disableDragRowIds: any[];
|
|
32
|
+
selectRowWhenClick: boolean;
|
|
33
|
+
hasVerticalScrollBar: boolean;
|
|
34
|
+
handleEditRowWhenDClick: (row: any) => void;
|
|
35
|
+
canEditRowWhenDClick: boolean;
|
|
36
|
+
theme: string;
|
|
37
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
38
|
+
export default Row;
|
|
@@ -30,7 +30,6 @@ var Row = function Row(_ref) {
|
|
|
30
30
|
selectedRowChange = _ref.selectedRowChange,
|
|
31
31
|
onSelectChange = _ref.onSelectChange,
|
|
32
32
|
canSelection = _ref.canSelection,
|
|
33
|
-
rowSelectionChange = _ref.rowSelectionChange,
|
|
34
33
|
reorderRow = _ref.reorderRow,
|
|
35
34
|
tableContainerWidth = _ref.tableContainerWidth,
|
|
36
35
|
canRowDrag = _ref.canRowDrag,
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { OnSelectChangeType } from "../type";
|
|
2
|
+
import './index.less';
|
|
3
|
+
type TableBodyPropsType = {
|
|
4
|
+
table: any;
|
|
5
|
+
tableId: any;
|
|
6
|
+
theme: any;
|
|
7
|
+
reorderRow: any;
|
|
8
|
+
rowSelectedId: any;
|
|
9
|
+
setRowSelectedId: any;
|
|
10
|
+
selectedRowChange: any;
|
|
11
|
+
onSelectChange: OnSelectChangeType;
|
|
12
|
+
canFilter: any;
|
|
13
|
+
canSelection: any;
|
|
14
|
+
tableBodyHeight: any;
|
|
15
|
+
tableHeadHeight: any;
|
|
16
|
+
setTableHeadHeight: any;
|
|
17
|
+
bodyContentHeight: any;
|
|
18
|
+
tableContainerWidth: any;
|
|
19
|
+
selectedRowDragging: any;
|
|
20
|
+
setSelectedRowDragging: any;
|
|
21
|
+
canRowDrag: any;
|
|
22
|
+
rowKey: any;
|
|
23
|
+
hasGroup: any;
|
|
24
|
+
tableDatas: any;
|
|
25
|
+
canSorting: any;
|
|
26
|
+
loading: boolean;
|
|
27
|
+
rowClassName: any;
|
|
28
|
+
cellClassName: any;
|
|
29
|
+
rowStyle: any;
|
|
30
|
+
getCellProps: any;
|
|
31
|
+
rowHeight: any;
|
|
32
|
+
renderSubComponent: any;
|
|
33
|
+
onRowMouseEnter: any;
|
|
34
|
+
onRowMouseLeave: any;
|
|
35
|
+
onRowMouseClick: any;
|
|
36
|
+
onRowMouseDoubleClick: any;
|
|
37
|
+
enableFilters: any;
|
|
38
|
+
enableVirtualList: any;
|
|
39
|
+
disableDragRowIds: any;
|
|
40
|
+
selectRowWhenClick: any;
|
|
41
|
+
datas: any;
|
|
42
|
+
hasVerticalScrollBar: boolean;
|
|
43
|
+
emptyDataHeight: number;
|
|
44
|
+
canEditRowWhenDClick: boolean;
|
|
45
|
+
editingRowId: string;
|
|
46
|
+
handleEditRowWhenDClick: (row: any) => void;
|
|
47
|
+
};
|
|
48
|
+
declare const TableBody: ({ table, tableId, theme, reorderRow, rowSelectedId, setRowSelectedId, selectedRowChange, onSelectChange, canFilter, canSelection, tableBodyHeight, tableHeadHeight, setTableHeadHeight, bodyContentHeight, tableContainerWidth, selectedRowDragging, setSelectedRowDragging, canRowDrag, rowKey, loading, rowClassName, cellClassName, rowStyle, getCellProps, rowHeight, renderSubComponent, onRowMouseEnter, onRowMouseLeave, onRowMouseClick, onRowMouseDoubleClick, enableFilters, enableVirtualList, disableDragRowIds, selectRowWhenClick, hasVerticalScrollBar, datas, emptyDataHeight, canEditRowWhenDClick, editingRowId, handleEditRowWhenDClick, }: TableBodyPropsType) => import("react/jsx-runtime").JSX.Element;
|
|
49
|
+
export default TableBody;
|
|
@@ -1,16 +1,18 @@
|
|
|
1
|
+
import "antd/es/spin/style";
|
|
2
|
+
import _Spin from "antd/es/spin";
|
|
1
3
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
2
4
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
3
5
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
4
6
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
5
7
|
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
6
8
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
|
-
import { Spin } from 'antd';
|
|
8
9
|
// import { useVirtualizer } from "@tanstack/react-virtual";
|
|
9
10
|
import { useDrop } from 'react-dnd';
|
|
10
11
|
import { CustomDragLayer } from "../components/CustomDragerLayer";
|
|
11
12
|
// import RowContent from "../components/RowContent";
|
|
12
|
-
|
|
13
|
+
|
|
13
14
|
import Row from "./Row";
|
|
15
|
+
import "./index.less";
|
|
14
16
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
15
17
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
16
18
|
var TableBody = function TableBody(_ref) {
|
|
@@ -25,14 +27,10 @@ var TableBody = function TableBody(_ref) {
|
|
|
25
27
|
onSelectChange = _ref.onSelectChange,
|
|
26
28
|
canFilter = _ref.canFilter,
|
|
27
29
|
canSelection = _ref.canSelection,
|
|
28
|
-
rowSelectionChange = _ref.rowSelectionChange,
|
|
29
|
-
scroll = _ref.scroll,
|
|
30
|
-
setScroll = _ref.setScroll,
|
|
31
30
|
tableBodyHeight = _ref.tableBodyHeight,
|
|
32
31
|
tableHeadHeight = _ref.tableHeadHeight,
|
|
33
32
|
setTableHeadHeight = _ref.setTableHeadHeight,
|
|
34
33
|
bodyContentHeight = _ref.bodyContentHeight,
|
|
35
|
-
setBodyContentHeight = _ref.setBodyContentHeight,
|
|
36
34
|
tableContainerWidth = _ref.tableContainerWidth,
|
|
37
35
|
selectedRowDragging = _ref.selectedRowDragging,
|
|
38
36
|
setSelectedRowDragging = _ref.setSelectedRowDragging,
|
|
@@ -45,7 +43,6 @@ var TableBody = function TableBody(_ref) {
|
|
|
45
43
|
getCellProps = _ref.getCellProps,
|
|
46
44
|
rowHeight = _ref.rowHeight,
|
|
47
45
|
renderSubComponent = _ref.renderSubComponent,
|
|
48
|
-
isAllRowExpanded = _ref.isAllRowExpanded,
|
|
49
46
|
onRowMouseEnter = _ref.onRowMouseEnter,
|
|
50
47
|
onRowMouseLeave = _ref.onRowMouseLeave,
|
|
51
48
|
onRowMouseClick = _ref.onRowMouseClick,
|
|
@@ -183,7 +180,7 @@ var TableBody = function TableBody(_ref) {
|
|
|
183
180
|
width: "".concat(tableContainerWidth - (hasVerticalScrollBar ? 10 : 0), "px"),
|
|
184
181
|
height: emptyDataHeight
|
|
185
182
|
},
|
|
186
|
-
children: loading ? /*#__PURE__*/_jsx(
|
|
183
|
+
children: loading ? /*#__PURE__*/_jsx(_Spin, {}) : /*#__PURE__*/_jsxs("span", {
|
|
187
184
|
className: "empty-content",
|
|
188
185
|
ref: dropRef,
|
|
189
186
|
children: [/*#__PURE__*/_jsx("img", {
|
|
@@ -216,7 +213,6 @@ var TableBody = function TableBody(_ref) {
|
|
|
216
213
|
canSelection: canSelection,
|
|
217
214
|
selectedRowDragging: selectedRowDragging,
|
|
218
215
|
setSelectedRowDragging: setSelectedRowDragging,
|
|
219
|
-
rowSelectionChange: rowSelectionChange,
|
|
220
216
|
canRowDrag: canRowDrag,
|
|
221
217
|
rowClassName: rowClassName,
|
|
222
218
|
cellClassName: cellClassName,
|
|
@@ -260,9 +256,7 @@ var TableBody = function TableBody(_ref) {
|
|
|
260
256
|
children: [/*#__PURE__*/_jsx("colgroup", {
|
|
261
257
|
children: headerGroups === null || headerGroups === void 0 || (_headerGroups = headerGroups[headerGroups.length - 1]) === null || _headerGroups === void 0 || (_headerGroups = _headerGroups.headers) === null || _headerGroups === void 0 ? void 0 : _headerGroups.map(function (header) {
|
|
262
258
|
return /*#__PURE__*/_jsx("col", {
|
|
263
|
-
|
|
264
|
-
width: header.getSize() || 80
|
|
265
|
-
}
|
|
259
|
+
width: header.getSize() || 80
|
|
266
260
|
}, header.id);
|
|
267
261
|
})
|
|
268
262
|
}), /*#__PURE__*/_jsx("tbody", {
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { TableMaxColumnType } from "../type";
|
|
2
|
+
import { ColumnResizeMode, Header, Table } from '@tanstack/react-table';
|
|
3
|
+
import './index.less';
|
|
4
|
+
type ICellType = {
|
|
5
|
+
header: Header<TableMaxColumnType, unknown>;
|
|
6
|
+
table: Table<TableMaxColumnType>;
|
|
7
|
+
hasGroup?: boolean;
|
|
8
|
+
canSorting?: boolean;
|
|
9
|
+
getHeaderCellProps?: Function;
|
|
10
|
+
columnResizeMode: ColumnResizeMode;
|
|
11
|
+
};
|
|
12
|
+
declare const Cell: ({ header, table, hasGroup, canSorting, getHeaderCellProps, columnResizeMode }: ICellType) => import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export default Cell;
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
+
import "antd/es/tooltip/style";
|
|
3
|
+
import _Tooltip from "antd/es/tooltip";
|
|
2
4
|
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
3
5
|
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
4
6
|
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
@@ -15,25 +17,19 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
|
|
|
15
17
|
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
16
18
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
17
19
|
import { flexRender } from '@tanstack/react-table';
|
|
18
|
-
import {
|
|
19
|
-
import "./index.less";
|
|
20
|
+
import { useMemo } from 'react';
|
|
20
21
|
import { useDrag, useDrop } from 'react-dnd';
|
|
21
|
-
import { ColumnType } from
|
|
22
|
+
import { ColumnType } from "../TableMax";
|
|
23
|
+
import "./index.less";
|
|
22
24
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
23
25
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
24
26
|
var Cell = function Cell(_ref) {
|
|
25
27
|
var header = _ref.header,
|
|
26
28
|
table = _ref.table,
|
|
27
|
-
filterFn = _ref.filterFn,
|
|
28
|
-
canFilter = _ref.canFilter,
|
|
29
29
|
hasGroup = _ref.hasGroup,
|
|
30
30
|
canSorting = _ref.canSorting,
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
var _useState = useState('onChange'),
|
|
34
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
35
|
-
columnResizeMode = _useState2[0],
|
|
36
|
-
setColumnResizeMode = _useState2[1];
|
|
31
|
+
getHeaderCellProps = _ref.getHeaderCellProps,
|
|
32
|
+
columnResizeMode = _ref.columnResizeMode;
|
|
37
33
|
var getState = table.getState,
|
|
38
34
|
setColumnOrder = table.setColumnOrder;
|
|
39
35
|
var _getState = getState(),
|
|
@@ -84,22 +80,41 @@ var Cell = function Cell(_ref) {
|
|
|
84
80
|
})
|
|
85
81
|
}[header.column.getIsSorted()];
|
|
86
82
|
}
|
|
83
|
+
var columnDef = useMemo(function () {
|
|
84
|
+
return header.column.columnDef;
|
|
85
|
+
}, [header]);
|
|
86
|
+
var columns = useMemo(function () {
|
|
87
|
+
return columnDef.columns;
|
|
88
|
+
}, [header]);
|
|
87
89
|
return /*#__PURE__*/_jsx("div", {
|
|
88
90
|
ref: dropRef,
|
|
89
91
|
children: /*#__PURE__*/_jsxs("div", {
|
|
90
|
-
className: "cell-wapper ".concat(
|
|
92
|
+
className: "cell-wapper ".concat(columns ? 'wapper-top-parent' : '', " tableMax-cell-wrapper"),
|
|
91
93
|
ref: previewRef,
|
|
92
94
|
style: _objectSpread({
|
|
93
|
-
transform: header.column.parent ||
|
|
94
|
-
}, getHeaderCellProps === null || getHeaderCellProps === void 0 ? void 0 : getHeaderCellProps(
|
|
95
|
+
transform: header.column.parent || columns || !hasGroup ? 'translateY(0px)' : 'translateY(-20px)'
|
|
96
|
+
}, getHeaderCellProps === null || getHeaderCellProps === void 0 ? void 0 : getHeaderCellProps(columns)),
|
|
95
97
|
children: [/*#__PURE__*/_jsxs("div", {
|
|
96
98
|
className: "cell-left",
|
|
97
99
|
onClick: header.column.getToggleSortingHandler(),
|
|
98
100
|
style: {
|
|
99
|
-
|
|
100
|
-
textAlign: header.column.columnDef.columns ? 'center' : 'left'
|
|
101
|
+
textAlign: columns ? 'center' : 'left'
|
|
101
102
|
},
|
|
102
|
-
children: [
|
|
103
|
+
children: [columnDef.ellipsis ? /*#__PURE__*/_jsx(_Tooltip, {
|
|
104
|
+
placement: "topLeft"
|
|
105
|
+
// @ts-ignore
|
|
106
|
+
,
|
|
107
|
+
title: flexRender(columnDef.header, header.getContext()),
|
|
108
|
+
mouseEnterDelay: 0.5,
|
|
109
|
+
children: /*#__PURE__*/_jsx("div", {
|
|
110
|
+
className: "cell-left-header",
|
|
111
|
+
children:
|
|
112
|
+
// @ts-ignore
|
|
113
|
+
flexRender(columnDef.header, header.getContext())
|
|
114
|
+
})
|
|
115
|
+
}) :
|
|
116
|
+
// @ts-ignore
|
|
117
|
+
flexRender(columnDef.header, header.getContext()), canSorting ? sortingRender() : null]
|
|
103
118
|
}), /*#__PURE__*/_jsx("div", {
|
|
104
119
|
className: "cell-right",
|
|
105
120
|
onClick: header.column.getToggleSortingHandler(),
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { ColumnResizeMode } from '@tanstack/react-table';
|
|
2
|
+
import './index.less';
|
|
3
|
+
type TableHeaderProps = {
|
|
4
|
+
table: any;
|
|
5
|
+
canFilter?: boolean;
|
|
6
|
+
enableFilters?: boolean;
|
|
7
|
+
canSorting?: boolean;
|
|
8
|
+
rowHeight?: number;
|
|
9
|
+
hasGroup?: boolean;
|
|
10
|
+
headerGroups?: any[];
|
|
11
|
+
hasVerticalScrollBar: boolean;
|
|
12
|
+
getHeaderCellProps?: Function;
|
|
13
|
+
columnResizeMode: ColumnResizeMode;
|
|
14
|
+
};
|
|
15
|
+
declare const TableHeader: ({ table, headerGroups, canFilter, enableFilters, canSorting, rowHeight, hasGroup, hasVerticalScrollBar, getHeaderCellProps, columnResizeMode, }: TableHeaderProps) => import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export default TableHeader;
|
|
@@ -6,6 +6,7 @@ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _ty
|
|
|
6
6
|
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
7
7
|
// import { Column, flexRender } from '@tanstack/react-table';
|
|
8
8
|
// import { useDrag, useDrop } from 'ahooks';
|
|
9
|
+
|
|
9
10
|
import { useEffect, useMemo } from 'react';
|
|
10
11
|
import { Filter } from "../components/ColumnFilter";
|
|
11
12
|
import Cell from "./Cell";
|
|
@@ -19,12 +20,12 @@ var TableHeader = function TableHeader(_ref) {
|
|
|
19
20
|
headerGroups = _ref.headerGroups,
|
|
20
21
|
canFilter = _ref.canFilter,
|
|
21
22
|
enableFilters = _ref.enableFilters,
|
|
22
|
-
filterFn = _ref.filterFn,
|
|
23
23
|
canSorting = _ref.canSorting,
|
|
24
24
|
rowHeight = _ref.rowHeight,
|
|
25
25
|
hasGroup = _ref.hasGroup,
|
|
26
26
|
hasVerticalScrollBar = _ref.hasVerticalScrollBar,
|
|
27
|
-
getHeaderCellProps = _ref.getHeaderCellProps
|
|
27
|
+
getHeaderCellProps = _ref.getHeaderCellProps,
|
|
28
|
+
columnResizeMode = _ref.columnResizeMode;
|
|
28
29
|
var getState = table.getState,
|
|
29
30
|
setColumnOrder = table.setColumnOrder,
|
|
30
31
|
columnPinning = table.columnPinning;
|
|
@@ -67,14 +68,10 @@ var TableHeader = function TableHeader(_ref) {
|
|
|
67
68
|
children: [/*#__PURE__*/_jsxs("colgroup", {
|
|
68
69
|
children: [headerGroups === null || headerGroups === void 0 || (_headerGroups = headerGroups[headerGroups.length - 1]) === null || _headerGroups === void 0 || (_headerGroups = _headerGroups.headers) === null || _headerGroups === void 0 ? void 0 : _headerGroups.map(function (header) {
|
|
69
70
|
return /*#__PURE__*/_jsx("col", {
|
|
70
|
-
|
|
71
|
-
width: header.getSize() || 80
|
|
72
|
-
}
|
|
71
|
+
width: header.getSize() || 80
|
|
73
72
|
}, header.id);
|
|
74
73
|
}), hasVerticalScrollBar ? /*#__PURE__*/_jsx("col", {
|
|
75
|
-
|
|
76
|
-
width: 10
|
|
77
|
-
}
|
|
74
|
+
width: 10
|
|
78
75
|
}, "verticalScrollBar") : null]
|
|
79
76
|
}), /*#__PURE__*/_jsxs("thead", {
|
|
80
77
|
children: [headerGroups === null || headerGroups === void 0 ? void 0 : headerGroups.map(function (headerGroup) {
|
|
@@ -91,12 +88,10 @@ var TableHeader = function TableHeader(_ref) {
|
|
|
91
88
|
children: header.isPlaceholder ? null : /*#__PURE__*/_jsx(Cell, {
|
|
92
89
|
header: header,
|
|
93
90
|
table: table,
|
|
94
|
-
canFilter: canFilter,
|
|
95
|
-
filterFn: filterFn,
|
|
96
91
|
hasGroup: hasGroup,
|
|
97
92
|
canSorting: canSorting,
|
|
98
|
-
|
|
99
|
-
|
|
93
|
+
getHeaderCellProps: getHeaderCellProps,
|
|
94
|
+
columnResizeMode: columnResizeMode
|
|
100
95
|
}, header.id)
|
|
101
96
|
}, header.id);
|
|
102
97
|
}), hasVerticalScrollBar ? /*#__PURE__*/_jsx("th", {
|
|
@@ -111,9 +106,7 @@ var TableHeader = function TableHeader(_ref) {
|
|
|
111
106
|
style: _objectSpread({}, getPinningStyle(header, table, hasVerticalScrollBar)),
|
|
112
107
|
children: header.column.getCanFilter() ? /*#__PURE__*/_jsx("div", {
|
|
113
108
|
children: /*#__PURE__*/_jsx(Filter, {
|
|
114
|
-
column: header.column
|
|
115
|
-
table: table,
|
|
116
|
-
filterFn: filterFn
|
|
109
|
+
column: header.column
|
|
117
110
|
})
|
|
118
111
|
}) : null
|
|
119
112
|
}, header.id + '1');
|
|
@@ -35,7 +35,16 @@ table {
|
|
|
35
35
|
color: @tableColor1;
|
|
36
36
|
cursor: pointer;
|
|
37
37
|
overflow: hidden;
|
|
38
|
-
white-space: nowrap
|
|
38
|
+
white-space: nowrap;
|
|
39
|
+
display: flex;
|
|
40
|
+
align-items: center;
|
|
41
|
+
margin-right: 20px;
|
|
42
|
+
.cell-left-header {
|
|
43
|
+
display: inline-block;
|
|
44
|
+
overflow: hidden;
|
|
45
|
+
text-overflow: ellipsis;
|
|
46
|
+
white-space: nowrap;
|
|
47
|
+
}
|
|
39
48
|
}
|
|
40
49
|
|
|
41
50
|
.drag-handler {
|
|
@@ -63,10 +72,10 @@ table {
|
|
|
63
72
|
height: 0;
|
|
64
73
|
border-left: 4px solid transparent;
|
|
65
74
|
border-right: 4px solid transparent;
|
|
66
|
-
border-bottom: 6px solid #
|
|
75
|
+
border-bottom: 6px solid #b4b6bfff;
|
|
67
76
|
|
|
68
77
|
&-red {
|
|
69
|
-
border-bottom: 6px solid #
|
|
78
|
+
border-bottom: 6px solid #fa541cff;
|
|
70
79
|
}
|
|
71
80
|
}
|
|
72
81
|
|
|
@@ -77,10 +86,10 @@ table {
|
|
|
77
86
|
margin-top: 3px;
|
|
78
87
|
border-left: 4px solid transparent;
|
|
79
88
|
border-right: 4px solid transparent;
|
|
80
|
-
border-top: 6px solid #
|
|
89
|
+
border-top: 6px solid #b4b6bfff;
|
|
81
90
|
|
|
82
91
|
&-red {
|
|
83
|
-
border-top: 6px solid #
|
|
92
|
+
border-top: 6px solid #fa541cff;
|
|
84
93
|
}
|
|
85
94
|
}
|
|
86
95
|
}
|
|
@@ -107,7 +116,6 @@ table {
|
|
|
107
116
|
.column-resizer.column-is-resizing {
|
|
108
117
|
height: 60%;
|
|
109
118
|
top: 20%;
|
|
110
|
-
|
|
111
119
|
}
|
|
112
120
|
}
|
|
113
121
|
|
|
@@ -125,29 +133,28 @@ table {
|
|
|
125
133
|
vertical-align: top;
|
|
126
134
|
padding: 6px 2px;
|
|
127
135
|
|
|
128
|
-
|
|
129
136
|
.custom-light-select:not(.custom-light-select-customize-input) .custom-light-select-selector {
|
|
130
137
|
border-radius: 2px;
|
|
131
|
-
background-color: #
|
|
138
|
+
background-color: #f5f6f7ff;
|
|
132
139
|
padding: 0 2px;
|
|
133
140
|
}
|
|
134
141
|
|
|
135
142
|
.custom-dark-select:not(.custom-dark-select-customize-input) .custom-dark-select-selector {
|
|
136
143
|
border-radius: 2px;
|
|
137
|
-
background-color: #
|
|
144
|
+
background-color: #494c5dff;
|
|
138
145
|
padding: 0 2px;
|
|
139
146
|
}
|
|
140
147
|
|
|
141
148
|
.custom-light-input-number {
|
|
142
149
|
width: 100% !important;
|
|
143
150
|
border-radius: 2px;
|
|
144
|
-
background-color: #
|
|
151
|
+
background-color: #f5f6f7ff;
|
|
145
152
|
}
|
|
146
153
|
|
|
147
154
|
.custom-dark-input-number {
|
|
148
155
|
width: 100% !important;
|
|
149
156
|
border-radius: 2px;
|
|
150
|
-
background-color: #
|
|
157
|
+
background-color: #494c5dff;
|
|
151
158
|
}
|
|
152
159
|
|
|
153
160
|
.custom-dark-select-single .custom-dark-select-selector .custom-dark-select-selection-search {
|
|
@@ -166,21 +173,20 @@ table {
|
|
|
166
173
|
|
|
167
174
|
.custom-dark-picker {
|
|
168
175
|
padding: 4px;
|
|
169
|
-
background: #
|
|
176
|
+
background: #494c5dff;
|
|
170
177
|
}
|
|
171
178
|
|
|
172
179
|
.custom-dark-picker-input .custom-dark-picker-clear {
|
|
173
|
-
background: #
|
|
180
|
+
background: #494c5dff;
|
|
174
181
|
}
|
|
175
182
|
|
|
176
183
|
.custom-light-picker {
|
|
177
184
|
padding: 4px;
|
|
178
|
-
background: #
|
|
185
|
+
background: #f5f6f7ff;
|
|
179
186
|
}
|
|
180
187
|
|
|
181
188
|
.custom-light-picker-input .custom-light-picker-clear {
|
|
182
|
-
background: #
|
|
189
|
+
background: #f5f6f7ff;
|
|
183
190
|
}
|
|
184
191
|
}
|
|
185
|
-
|
|
186
|
-
}
|
|
192
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const getPinningStyle: any;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { RowData } from '@tanstack/react-table';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import './tableMax.less';
|
|
4
|
+
import type { TableContextType, TableMaxProps } from './type';
|
|
5
|
+
declare module '@tanstack/react-table' {
|
|
6
|
+
interface TableMeta<TData extends RowData> {
|
|
7
|
+
updateData: (rowIndex: number, columnId: string, value: unknown) => void;
|
|
8
|
+
}
|
|
9
|
+
}
|
|
10
|
+
export declare enum ColumnType {
|
|
11
|
+
Selection = "selection-column",
|
|
12
|
+
Darg = "darg-column",
|
|
13
|
+
PlaceHolder = "placeholder-column",
|
|
14
|
+
Expander = "expander"
|
|
15
|
+
}
|
|
16
|
+
export declare const TableContext: React.Context<TableContextType>;
|
|
17
|
+
declare const _default: React.ForwardRefExoticComponent<TableMaxProps & React.RefAttributes<unknown>>;
|
|
18
|
+
export default _default;
|