@arim-aisdc/public-components 0.0.1

package/dist/TableMax/TableHeader/Cell.js

@@ -0,0 +1,125 @@
+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); }
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+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."); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+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); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+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."); }
+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); }
+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; }
+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; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { flexRender } from '@tanstack/react-table';
+import { useState } from 'react';
+import "./index.less";
+import { useDrag, useDrop } from 'react-dnd';
+import { ColumnType } from '..';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var Cell = function Cell(_ref) {
+  var header = _ref.header,
+    table = _ref.table,
+    filterFn = _ref.filterFn,
+    canFilter = _ref.canFilter,
+    hasGroup = _ref.hasGroup,
+    canSorting = _ref.canSorting,
+    rowHeight = _ref.rowHeight,
+    getHeaderCellProps = _ref.getHeaderCellProps;
+  var _useState = useState('onChange'),
+    _useState2 = _slicedToArray(_useState, 2),
+    columnResizeMode = _useState2[0],
+    setColumnResizeMode = _useState2[1];
+  var getState = table.getState,
+    setColumnOrder = table.setColumnOrder;
+  var _getState = getState(),
+    columnOrder = _getState.columnOrder,
+    sorting = _getState.sorting;
+  var column = header.column;
+  var _useDrop = useDrop({
+      accept: 'column',
+      drop: function drop(draggedColumn) {
+        var newColumnOrder = reorderColumn(draggedColumn.id, column.id, columnOrder);
+        setColumnOrder(newColumnOrder);
+      }
+    }),
+    _useDrop2 = _slicedToArray(_useDrop, 2),
+    dropRef = _useDrop2[1];
+  var _useDrag = useDrag({
+      collect: function collect(monitor) {
+        return {
+          isDragging: monitor.isDragging()
+        };
+      },
+      item: function item() {
+        return column;
+      },
+      type: 'column'
+    }),
+    _useDrag2 = _slicedToArray(_useDrag, 3),
+    isDragging = _useDrag2[0].isDragging,
+    dragRef = _useDrag2[1],
+    previewRef = _useDrag2[2];
+  function sortingRender() {
+    return {
+      asc: /*#__PURE__*/_jsxs("span", {
+        className: 'sort-flag',
+        children: [/*#__PURE__*/_jsx("i", {
+          className: 'triangle-up triangle-up-red'
+        }), /*#__PURE__*/_jsx("i", {
+          className: 'triangle-down'
+        })]
+      }),
+      desc: /*#__PURE__*/_jsxs("span", {
+        className: 'sort-flag',
+        children: [/*#__PURE__*/_jsx("i", {
+          className: 'triangle-up'
+        }), /*#__PURE__*/_jsx("i", {
+          className: 'triangle-down triangle-down-red'
+        })]
+      })
+    }[header.column.getIsSorted()];
+  }
+  return /*#__PURE__*/_jsx("div", {
+    ref: dropRef,
+    children: /*#__PURE__*/_jsxs("div", {
+      className: "cell-wapper ".concat(header.column.columnDef.columns ? 'wapper-top-parent' : ''),
+      ref: previewRef,
+      style: _objectSpread({
+        transform: header.column.parent || header.column.columnDef.columns || !hasGroup ? 'translateY(0px)' : 'translateY(-20px)'
+      }, getHeaderCellProps === null || getHeaderCellProps === void 0 ? void 0 : getHeaderCellProps(header.column.columnDef.columns)),
+      children: [/*#__PURE__*/_jsxs("div", {
+        className: 'cell-left',
+        onClick: header.column.getToggleSortingHandler(),
+        style: {
+          display: 'inline-block',
+          textAlign: header.column.columnDef.columns ? 'center' : 'left'
+        },
+        children: [flexRender(header.column.columnDef.header, header.getContext()), canSorting ? sortingRender() : null]
+      }), /*#__PURE__*/_jsx("div", {
+        className: 'cell-right',
+        onClick: header.column.getToggleSortingHandler(),
+        children: header.column.id === ColumnType.Darg || header.column.id === ColumnType.Selection || header.column.id === ColumnType.PlaceHolder ? null : /*#__PURE__*/_jsx("i", {
+          ref: dragRef,
+          className: "icon iconfont-other icon-other-drag drag-handler"
+        })
+      }), /*#__PURE__*/_jsx("div", {
+        className: "cell-resize-handler ".concat(header.column.getIsResizing() ? 'column-is-resizing' : ''),
+        onMouseDown: header.getResizeHandler(),
+        onTouchStart: header.getResizeHandler(),
+        style: {
+          transform: columnResizeMode === 'onEnd' && header.column.getIsResizing() ? "translateX(".concat(table.getState().columnSizingInfo.deltaOffset, "px)") : ''
+        }
+      })]
+    })
+  });
+};
+var reorderColumn = function reorderColumn(draggedColumnId, targetColumnId, columnOrder) {
+  columnOrder.splice(columnOrder === null || columnOrder === void 0 ? void 0 : columnOrder.indexOf(targetColumnId), 0, columnOrder.splice(columnOrder === null || columnOrder === void 0 ? void 0 : columnOrder.indexOf(draggedColumnId), 1)[0]);
+  return _toConsumableArray(columnOrder);
+};
+export default Cell;

package/dist/TableMax/TableHeader/index.js

@@ -0,0 +1,121 @@
+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); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+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); }
+// import { Column, flexRender } from '@tanstack/react-table';
+// import { useDrag, useDrop } from 'ahooks';
+import { useEffect, useMemo } from 'react';
+import { Filter } from "../components/ColumnFilter";
+// import ColumnHeader from '../components/ColumnHeader';
+import Cell from "./Cell";
+import "./index.less";
+import { getPinningStyle } from "./utils";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var TableHeader = function TableHeader(_ref) {
+  var _headerGroups, _headerGroups2;
+  var table = _ref.table,
+    headerGroups = _ref.headerGroups,
+    canFilter = _ref.canFilter,
+    enableFilters = _ref.enableFilters,
+    filterFn = _ref.filterFn,
+    canSorting = _ref.canSorting,
+    rowHeight = _ref.rowHeight,
+    hasGroup = _ref.hasGroup,
+    hasVerticalScrollBar = _ref.hasVerticalScrollBar,
+    getHeaderCellProps = _ref.getHeaderCellProps;
+  var getState = table.getState,
+    setColumnOrder = table.setColumnOrder,
+    columnPinning = table.columnPinning;
+  var _getState = getState(),
+    columnOrder = _getState.columnOrder,
+    sorting = _getState.sorting;
+  var hasPinning = useMemo(function () {
+    var columnPinning = table.getState().columnPinning;
+    console.log(44445555, JSON.stringify(columnPinning.left) !== '[]', JSON.stringify(columnPinning.right) !== '[]');
+    return JSON.stringify(columnPinning.left) !== '[]' || JSON.stringify(columnPinning.right) !== '[]' ? true : false;
+  }, [table.getState().columnPinning]);
+  useEffect(function () {
+    console.log(hasVerticalScrollBar, '********************hasVerticalScrollBar====================');
+  }, [hasVerticalScrollBar]);
+
+  // const [headerGroups, setHeaderGroups] = useState([])
+
+  // useEffect(() => {
+  //   console.log(7777)
+  //   setHeaderGroups([
+  //     ...(table.getCenterHeaderGroups() || []),
+  //     ...(table.getRightHeaderGroups() || [])]
+  //   )
+  // }, [table.getLeftHeaderGroups(), table.getCenterHeaderGroups(), table.getRightHeaderGroups()])
+
+  // console.log(666, table.getLeftHeaderGroups(), table.getCenterHeaderGroups(), table.getRightHeaderGroups())
+
+  console.log('header', table.getLeftHeaderGroups(), table.getCenterHeaderGroups(), table.getRightHeaderGroups(), table.getHeaderGroups());
+  return /*#__PURE__*/_jsxs("table", {
+    style: {
+      width: table.getTotalSize() + hasVerticalScrollBar ? 10 : 0
+    },
+    children: [/*#__PURE__*/_jsxs("colgroup", {
+      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) {
+        return /*#__PURE__*/_jsx("col", {
+          style: {
+            width: header.getSize() || 80
+          }
+        }, header.id);
+      }), hasVerticalScrollBar ? /*#__PURE__*/_jsx("col", {
+        style: {
+          width: 10
+        }
+      }, "verticalScrollBar") : null]
+    }), /*#__PURE__*/_jsxs("thead", {
+      children: [headerGroups === null || headerGroups === void 0 ? void 0 : headerGroups.map(function (headerGroup) {
+        return /*#__PURE__*/_jsxs("tr", {
+          className: 'table-thead-tr cus-table-thead-tr',
+          style: {
+            height: hasGroup && headerGroup.depth === 0 ? '40px' : 'auto',
+            width: '100%'
+          },
+          children: [headerGroup.headers.map(function (header) {
+            return /*#__PURE__*/_jsx("th", {
+              colSpan: header.colSpan,
+              style: _objectSpread({}, getPinningStyle(header, table, hasVerticalScrollBar)),
+              children: header.isPlaceholder ? null : /*#__PURE__*/_jsx(Cell, {
+                header: header,
+                table: table,
+                canFilter: canFilter,
+                filterFn: filterFn,
+                hasGroup: hasGroup,
+                canSorting: canSorting,
+                rowHeight: rowHeight,
+                getHeaderCellProps: getHeaderCellProps
+              }, header.id)
+            }, header.id);
+          }), hasVerticalScrollBar ? /*#__PURE__*/_jsx("th", {
+            className: "".concat(hasPinning ? 'th-scroll' : null, " ")
+          }, "scroll") : null]
+        }, headerGroup.id);
+      }), canFilter && enableFilters ? /*#__PURE__*/_jsxs("tr", {
+        className: 'table-filter-tr',
+        children: [headerGroups === null || headerGroups === void 0 || (_headerGroups2 = headerGroups[headerGroups.length - 1]) === null || _headerGroups2 === void 0 || (_headerGroups2 = _headerGroups2.headers) === null || _headerGroups2 === void 0 ? void 0 : _headerGroups2.map(function (header) {
+          return /*#__PURE__*/_jsx("th", {
+            className: 'table-filter-th',
+            style: _objectSpread({}, getPinningStyle(header, table, hasVerticalScrollBar)),
+            children: header.column.getCanFilter() ? /*#__PURE__*/_jsx("div", {
+              children: /*#__PURE__*/_jsx(Filter, {
+                column: header.column,
+                table: table,
+                filterFn: filterFn
+              })
+            }) : null
+          }, header.id + '1');
+        }), hasVerticalScrollBar ? /*#__PURE__*/_jsx("th", {
+          className: "".concat(hasPinning ? 'th-scroll' : null, " ")
+        }, "scroll") : null]
+      }, "table-filter-tr") : null]
+    })]
+  });
+};
+export default TableHeader;

package/dist/TableMax/TableHeader/index.less

@@ -0,0 +1,212 @@
+
+@globalColor1: #05081a; // 文字颜色
+@globalColor2: #5e6175;
+@globalColor3: #838695;
+@globalColor4: #dadbdf;
+@globalColor5: #ececee; // 网格线色
+@globalColor6: #f5f6f7;
+@globalColor7: #ffffff; // 背景色
+@globalColor8: #f5f6f7; // 背景衬托色
+@globalColor9: #f7f7f9; // 网格遮罩色（passed）
+@globalColor_18: #fdfdfe; // 网格遮罩色
+@globalColor_10:  #f5f6f7; // 网格遮罩色
+@globalColor_11:  #ececee; //
+@globalColor_12:  #838695; // 铁包运行左侧菜单线
+@globalColor_13:  #dadbdf; // 甘特图网格线颜色
+@globalColor_14:  #dadbdf; // 表头背景色
+@globalColor_15:  #C1C2CA; // 表格头线对应色
+@globalColor_16:  #F5F5F6; // 内嵌卡片背景
+@globalColor_17:  #C1C2CA; // 时间轴和工位栏颜色
+
+@tableColor1:  #212121; // 表格字体颜色
+@tableColor2:  rgba(94, 97, 117, 0.4); // 表格边框颜色
+@tableColor3:  #DADBDFFF; // 表格边框颜色
+@tableColor4:  #DADBDF7F; // 表格筛选区时间选择框分割线颜色
+@tableColor5:  #ffffff; // 表格列设置区拖拽图标颜色
+@tableColor6:  #FA541CFF; // 表格列设置区列显隐图标颜色
+@tableColor7:  #1A1D2EFF; // 表格列设置区列表元素边框颜色
+
+@scrollThumb:  rgba(255, 255, 255, 0.2);
+@scrollThumbHover: rgba(255, 255, 255, 0.3);
+@sliderRightBorder: #3e3b3b;
+// @selectTableRow: var(--select-table-row, rgb(245 246 247 / 15%));
+@selectTableRow:  #d0e37b;
+@globalColor_table-line:  #f0f0f0; // table行分隔线颜色
+
+table {
+  table-layout: fixed;
+  // background: @globalColor_14;
+  width: 100%;
+  border-collapse: collapse;
+
+  th {
+    position: relative;
+    padding: 0;
+    border: 0;
+    background: @globalColor_14;
+  }
+
+  .th-scroll {
+    position: sticky;
+    right: 0;
+  }
+}
+
+.cell-wapper {
+  background: @globalColor_14;
+  height: 40px;
+  line-height: 40px;
+  display: flex;
+  font-weight: 400;
+  padding: 0 8px;
+  text-align: left;
+
+  .cell-left {
+    flex: 1;
+    // text-align: center;
+    user-select: none;
+    touch-action: none;
+    color: @tableColor1;
+    cursor: pointer;
+    overflow: hidden;
+    white-space: nowrap
+  }
+
+  .drag-handler {
+    color: @tableColor3;
+    display: none;
+    // opacity: 0;
+    cursor: move;
+  }
+
+  &:hover .drag-handler {
+    display: inline-block;
+    // opacity: 1;
+  }
+
+  .sort-flag {
+    display: inline-block;
+    vertical-align: middle;
+    margin-left: 6px;
+
+    .triangle-up {
+      display: block;
+      width: 0;
+      height: 0;
+      border-left: 4px solid transparent;
+      border-right: 4px solid transparent;
+      border-bottom: 6px solid #B4B6BFFF;
+
+      &-red {
+        border-bottom: 6px solid #FA541CFF;
+      }
+    }
+
+    .triangle-down {
+      display: block;
+      width: 0;
+      height: 0;
+      margin-top: 3px;
+      border-left: 4px solid transparent;
+      border-right: 4px solid transparent;
+      border-top: 6px solid #B4B6BFFF;
+
+      &-red {
+        border-top: 6px solid #FA541CFF;
+      }
+    }
+  }
+
+  .cell-resize-handler {
+    position: absolute;
+    right: 0;
+    top: 30%;
+    height: 40%;
+    width: 5px;
+    // background-color: @globalColor_15;
+    border-right: 1px solid @globalColor_15;
+    cursor: ew-resize;
+    user-select: none;
+    touch-action: none;
+
+    &:hover {
+      border-right: 2px solid @globalColor_15;
+      top: 20%;
+      height: 60%;
+    }
+  }
+
+  .column-resizer.column-is-resizing {
+    height: 60%;
+    top: 20%;
+
+  }
+}
+
+.table-filter-tr {
+  border-top: 1px solid @tableColor2;
+
+  .table-filter-th {
+    text-align: center;
+    vertical-align: top;
+    padding: 6px 2px;
+
+    :global {
+      .custom-light-select:not(.custom-light-select-customize-input) .custom-light-select-selector {
+        border-radius: 2px;
+        background-color: #F5F6F7FF;
+        padding: 0 2px;
+      }
+
+      .custom-dark-select:not(.custom-dark-select-customize-input) .custom-dark-select-selector {
+        border-radius: 2px;
+        background-color: #494C5DFF;
+        padding: 0 2px;
+      }
+
+      .custom-light-input-number {
+        width: 100% !important;
+        border-radius: 2px;
+        background-color: #F5F6F7FF;
+      }
+
+      .custom-dark-input-number {
+        width: 100% !important;
+        border-radius: 2px;
+        background-color: #494C5DFF;
+      }
+
+      .custom-dark-select-single .custom-dark-select-selector .custom-dark-select-selection-search {
+        left: 2px;
+        right: 2px;
+      }
+
+      .custom-dark-select-single .custom-dark-select-clear {
+        background: transparent;
+      }
+
+      .custom-light-select-single .custom-light-select-selector .custom-light-select-selection-search {
+        left: 2px;
+        right: 2px;
+      }
+
+      .custom-dark-picker {
+        padding: 4px;
+        background: #494C5DFF;
+      }
+
+      .custom-dark-picker-input .custom-dark-picker-clear {
+        background: #494C5DFF;
+      }
+
+      .custom-light-picker {
+        padding: 4px;
+        background: #F5F6F7FF;
+      }
+
+      .custom-light-picker-input .custom-light-picker-clear {
+        background: #F5F6F7FF;
+      }
+    }
+  }
+}

package/dist/TableMax/TableHeader/utils.js

@@ -0,0 +1,55 @@
+export var getPinningStyle = function getPinningStyle(header, table, hasVerticalScrollBar) {
+  var column = header.column;
+  var columnSizes = table.getState().columnSizes;
+  var columnPinning = table.getState().columnPinning;
+  var columnSizesMap = {};
+  columnSizes.map(function (item) {
+    columnSizesMap[item === null || item === void 0 ? void 0 : item.id] = item.size;
+  });
+  switch (column.getIsPinned()) {
+    case 'left':
+      var offsetLeft = 0;
+      offsetLeft += getOffsetLeft(columnPinning.left, column, columnSizesMap);
+      return {
+        position: 'sticky',
+        left: offsetLeft,
+        zIndex: 100,
+        width: column.getSize()
+      };
+    case 'right':
+      var offsetRight = hasVerticalScrollBar ? 10 : 0;
+      offsetRight += getOffsetRight(columnPinning.right, column, columnSizesMap);
+      return {
+        position: 'sticky',
+        right: offsetRight,
+        zIndex: 100,
+        width: column.getSize()
+      };
+    default:
+      return {
+        width: column.getSize()
+      };
+  }
+};
+var getOffsetLeft = function getOffsetLeft(list, column, columnSizesMap) {
+  var x = 0;
+  for (var i = 0; i < list.length; i++) {
+    var curr = list[i];
+    if (curr === column.id) {
+      return x;
+    }
+    x += columnSizesMap[curr];
+  }
+  return x;
+};
+var getOffsetRight = function getOffsetRight(list, column, columnSizesMap) {
+  var x = 0;
+  for (var i = list.length - 1; i > 0; i--) {
+    var curr = list[i];
+    if (curr === column.id) {
+      return x;
+    }
+    x += columnSizesMap[curr];
+  }
+  return x;
+};

package/dist/TableMax/components/ColumnEdit/index.js

@@ -0,0 +1,87 @@
+var _excluded = ["editing", "dataIndex", "title", "required", "editComType", "record", "index", "children", "precision", "numberMin", "editOptions"];
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import { DatePicker, Form, Input, InputNumber, Select } from 'antd';
+import "./index.less";
+
+// 编辑组件类型
+import { jsx as _jsx } from "react/jsx-runtime";
+export var InputType = /*#__PURE__*/function (InputType) {
+  InputType["InputNumber"] = "InputNumber";
+  InputType["Input"] = "Input";
+  InputType["DatePicker"] = "DatePicker";
+  InputType["Select"] = "Select";
+  return InputType;
+}({});
+export var EditableCell = function EditableCell(_ref) {
+  var editing = _ref.editing,
+    dataIndex = _ref.dataIndex,
+    title = _ref.title,
+    required = _ref.required,
+    editComType = _ref.editComType,
+    record = _ref.record,
+    index = _ref.index,
+    children = _ref.children,
+    precision = _ref.precision,
+    numberMin = _ref.numberMin,
+    _ref$editOptions = _ref.editOptions,
+    editOptions = _ref$editOptions === void 0 ? [] : _ref$editOptions,
+    restProps = _objectWithoutProperties(_ref, _excluded);
+  var getEditComponent = function getEditComponent() {
+    switch (editComType) {
+      case InputType.InputNumber:
+        return /*#__PURE__*/_jsx(InputNumber, {
+          precision: precision,
+          placeholder: title,
+          min: numberMin ? numberMin : 0,
+          style: {
+            width: '100%'
+          }
+        });
+      case InputType.DatePicker:
+        return /*#__PURE__*/_jsx(DatePicker, {
+          showTime: true,
+          format: "YYYY-MM-DD HH:mm:ss",
+          allowClear: true,
+          placeholder: title,
+          suffixIcon: /*#__PURE__*/_jsx("i", {
+            className: "iconfont-other icon-other-calendar"
+          })
+        });
+      case InputType.Select:
+        return /*#__PURE__*/_jsx(Select, {
+          placeholder: title,
+          allowClear: true,
+          children: editOptions.map(function (item, index) {
+            return /*#__PURE__*/_jsx(Select.Option, {
+              value: item.value,
+              children: item.label
+            }, item.value || index);
+          })
+        });
+      case InputType.Input:
+      default:
+        return /*#__PURE__*/_jsx(Input, {
+          placeholder: title,
+          allowClear: true
+        });
+    }
+  };
+  return /*#__PURE__*/_jsx("div", {
+    className: 'wrapper',
+    children: editing ? /*#__PURE__*/_jsx(Form.Item, {
+      name: dataIndex,
+      style: {
+        margin: 0
+      },
+      rules: [{
+        required: required,
+        message: "\u8BF7\u8F93\u5165".concat(title)
+      }],
+      onClick: function onClick(e) {
+        return e === null || e === void 0 ? void 0 : e.stopPropagation();
+      },
+      children: getEditComponent()
+    }) : children
+  });
+};

package/dist/TableMax/components/ColumnEdit/index.less

@@ -0,0 +1,27 @@
+.wrapper {
+  // display: inline-block;
+  width: 100%;
+  padding: 0 8px;
+
+  :global {
+
+    .custom-dark-select,
+    .custom-dark-picker,
+    .custom-dark-input-number,
+    .custom-dark-input,
+    .custom-dark-input-affix-wrapper,
+    .custom-dark-switch {
+      background-color: #494C5DFF;
+    }
+
+    .custom-dark-switch-checked {
+      background-color: #fa541c;
+    }
+
+    .custom-dark-picker-clear,
+    .custom-dark-select-clear {
+      background-color: #494C5DFF;
+    }
+
+  }
+}