linkmore-design 1.1.26 → 1.1.27-beta.1

package/lib/LmTable/hooks/useDndItems.js

@@ -0,0 +1,186 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _react = require("react");
+var _index = require("../common/index");
+function del(arr, target) {
+  if (!arr || !arr.length) {
+    return null;
+  }
+  var index = arr.findIndex(function (item) {
+    return item === target;
+  });
+  if (index !== -1) {
+    arr.splice(index, 1);
+  }
+}
+function getSortInsert(tableHeader, value, _ref) {
+  var columns = _ref.columns;
+  if (!tableHeader) {
+    return [];
+  }
+  var arr = new Array(columns.length);
+  tableHeader.push(value);
+  tableHeader.forEach(function (val) {
+    var index = columns.findIndex(function (item) {
+      return item.title === val;
+    });
+    columns[index].show = true;
+    arr.splice(index, 0, val);
+  });
+  return arr.filter(Boolean);
+}
+function getSortDndColumns(value, _ref2) {
+  var columns = _ref2.columns;
+  var tableHeader = value.tableHeader;
+  var hiddenArr = [].concat((0, _toConsumableArray2.default)(value.row), (0, _toConsumableArray2.default)(value.col)) || [];
+  if (!tableHeader || !tableHeader.length) {
+    return [];
+  }
+  var result = [];
+  var _loop = function _loop(i) {
+    var item = columns.find(function (item) {
+      return item.title === tableHeader[i];
+    });
+    if (item) {
+      item.order = i;
+      result.push(item);
+    }
+  };
+  for (var i = 0; i < tableHeader.length; i++) {
+    _loop(i);
+  }
+  var _loop2 = function _loop2(_i) {
+    var item = columns.find(function (item) {
+      return item.title === hiddenArr[_i];
+    });
+    if (item) {
+      item.show = false;
+      result.push(item);
+    }
+  };
+  for (var _i = 0; _i < hiddenArr.length; _i++) {
+    _loop2(_i);
+  }
+  return result;
+}
+function getDataIndexForTitle(row, columns) {
+  if (!row) {
+    return [];
+  }
+  return row.map(function (title) {
+    var col = columns.find(function (item) {
+      return item.title === title;
+    });
+    if (col) {
+      return col.dataIndex;
+    }
+  });
+}
+function useDndItems(props) {
+  var columns = props.columns,
+    colSortOpen = props.colSortOpen,
+    filterChange = props.filterChange,
+    openRowGroup = props.openRowGroup,
+    openColGroup = props.openColGroup,
+    customizeGroupRowKeys = props.customizeGroupRowKeys,
+    customizeGroupColKeys = props.customizeGroupColKeys;
+  var _useState = (0, _react.useState)(columns),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    dndColumns = _useState2[0],
+    setDndColumns = _useState2[1];
+  var _useState3 = (0, _react.useState)(customizeGroupRowKeys || []),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    groupRowKeys = _useState4[0],
+    setGroupRowKeys = _useState4[1];
+  var _useState5 = (0, _react.useState)(customizeGroupColKeys || []),
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    groupColKeys = _useState6[0],
+    setGroupColKeys = _useState6[1];
+  (0, _react.useEffect)(function () {
+    if (customizeGroupRowKeys) {
+      setGroupRowKeys(customizeGroupRowKeys);
+    }
+    if (customizeGroupColKeys) {
+      setGroupColKeys(customizeGroupColKeys);
+    }
+  }, [customizeGroupRowKeys, customizeGroupColKeys]);
+  // 初始化
+  var defaultItems = {
+    row: [],
+    col: [],
+    tableHeader: []
+  };
+  if (openColGroup || openRowGroup || colSortOpen) {
+    (0, _index.treeFind)(columns, function (node) {
+      if (groupRowKeys.includes(node.dataIndex)) {
+        defaultItems.row.push(node.title);
+      } else if (groupColKeys.includes(node.dataIndex)) {
+        defaultItems.col.push(node.title);
+      } else {
+        defaultItems.tableHeader.push(node.title);
+      }
+      return false;
+    });
+  }
+  var _useState7 = (0, _react.useState)(defaultItems),
+    _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+    items = _useState8[0],
+    setItems = _useState8[1];
+  (0, _react.useEffect)(function () {
+    if (customizeGroupRowKeys || customizeGroupColKeys) {
+      columns.forEach(function (c) {
+        if (customizeGroupRowKeys.includes(c.dataIndex) || customizeGroupColKeys.includes(c.dataIndex)) {
+          c.show = false;
+        }
+      });
+    }
+    setDndColumns(columns);
+    setItems(defaultItems);
+  }, [columns]);
+  // 更新
+  var updateItems = function updateItems(value, resume) {
+    value.row = value.row.filter(Boolean);
+    value.col = value.col.filter(Boolean);
+    if (resume) {
+      // 删除
+      del(value.row, resume);
+      del(value.col, resume);
+      value.tableHeader = getSortInsert(value.tableHeader, resume, {
+        columns: columns
+      });
+    }
+    // 列分组进行覆盖，只允许存在一个
+    if (value.col.length >= 2) {
+      value.tableHeader = getSortInsert(value.tableHeader, items.col[0], {
+        columns: columns
+      });
+      value.col = value.col.filter(function (item) {
+        return item !== items.col[0];
+      });
+    }
+    setItems(value);
+    setGroupRowKeys(getDataIndexForTitle(value.row, columns));
+    setGroupColKeys(getDataIndexForTitle(value.col, columns));
+    var newColumns = getSortDndColumns(value, {
+      columns: columns
+    });
+    setDndColumns(newColumns);
+    filterChange === null || filterChange === void 0 ? void 0 : filterChange(newColumns);
+  };
+  return {
+    dndColumns: dndColumns,
+    items: items,
+    groupRowKeys: groupRowKeys,
+    groupColKeys: groupColKeys,
+    updateItems: updateItems
+  };
+}
+var _default = useDndItems;
+exports.default = _default;

package/lib/LmTable/hooks/useGroupDataSource.js

@@ -1,50 +1,23 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = require("react");
-
 var _util = require("../util");
-
-var _expression = _interopRequireDefault(require("../expression"));
-
 /** 行分组 */
 function useGroupDataSource(_ref) {
   var groupRowKeys = _ref.groupRowKeys,
-      customizeDataSource = _ref.customizeDataSource,
-      columnsRef = _ref.columnsRef;
+    customizeDataSource = _ref.customizeDataSource;
   var groupDataSource = (0, _react.useMemo)(function () {
     if (!(groupRowKeys === null || groupRowKeys === void 0 ? void 0 : groupRowKeys.length)) {
       return customizeDataSource;
     }
-
-    var source = (0, _util.transformWithRowGroup)(customizeDataSource, groupRowKeys); // 获取需要计算的key，生成数组
-
-    var needCalcKeys = columnsRef.current.filter(function (col) {
-      return col.expression;
-    }).map(function (col) {
-      return [col.dataIndex, col.expression];
-    });
-
-    var deepChildren = function deepChildren(arr) {
-      arr === null || arr === void 0 ? void 0 : arr.forEach(function (item) {
-        if (item === null || item === void 0 ? void 0 : item.children) {
-          deepChildren(item === null || item === void 0 ? void 0 : item.children);
-          (0, _expression.default)(item, needCalcKeys);
-        }
-      });
-    };
-
-    deepChildren(source);
+    var source = (0, _util.transformWithRowGroup)(customizeDataSource, groupRowKeys);
     return source;
   }, [customizeDataSource, groupRowKeys]);
   return [groupDataSource];
 }
-
 var _default = useGroupDataSource;
 exports.default = _default;

package/lib/LmTable/hooks/useResizeObserver.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+interface Rect {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    left: number;
+    right: number;
+    bottom: number;
+    top: number;
+}
+export default function useResizeObserver(): (import("react").MutableRefObject<undefined> | Rect)[];
+export {};

package/lib/LmTable/hooks/useResizeObserver.js

@@ -0,0 +1,51 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useResizeObserver;
+var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = require("react");
+function useResizeObserver() {
+  var ref = (0, _react.useRef)();
+  var _useState = (0, _react.useState)({
+      x: 0,
+      y: 0,
+      width: 0,
+      height: 0,
+      left: 0,
+      right: 0,
+      bottom: 0,
+      top: 0
+    }),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    rect = _useState2[0],
+    setRect = _useState2[1];
+  console.log('useResizeObserver');
+  (0, _react.useEffect)(function () {
+    var ro = new ResizeObserver(function (entries) {
+      // 遍历改变的元素属性
+      var _iterator = (0, _createForOfIteratorHelper2.default)(entries),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var entry = _step.value;
+          setRect(entry.target.getBoundingClientRect());
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+    });
+    if (ref.current) {
+      ro.observe(ref.current);
+    }
+    return function () {
+      ro.disconnect();
+    };
+  }, []);
+  return [ref, rect];
+}

package/lib/LmTable/hooks/useRowSelectControllableValue.js

@@ -4,23 +4,19 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = require("react");
-
 var _utils = require("ahooks/lib/utils");
-
 var _ahooks = require("ahooks");
-
 function useControllableValue() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   var defaultValue = options.defaultValue,
-      _options$defaultValue = options.defaultValuePropName,
-      defaultValuePropName = _options$defaultValue === void 0 ? 'defaultValue' : _options$defaultValue,
-      _options$valuePropNam = options.valuePropName,
-      valuePropName = _options$valuePropNam === void 0 ? 'value' : _options$valuePropNam,
-      _options$trigger = options.trigger,
-      trigger = _options$trigger === void 0 ? 'onChange' : _options$trigger;
+    _options$defaultValue = options.defaultValuePropName,
+    defaultValuePropName = _options$defaultValue === void 0 ? 'defaultValue' : _options$defaultValue,
+    _options$valuePropNam = options.valuePropName,
+    valuePropName = _options$valuePropNam === void 0 ? 'value' : _options$valuePropNam,
+    _options$trigger = options.trigger,
+    trigger = _options$trigger === void 0 ? 'onChange' : _options$trigger;
   var value = props[valuePropName];
   var isControlled = props === null || props === void 0 ? void 0 : props.hasOwnProperty(valuePropName);
   var isControlledOnChange = props[trigger];
@@ -28,40 +24,30 @@ function useControllableValue() {
     if (isControlled) {
       return value;
     }
-
     if (props === null || props === void 0 ? void 0 : props.hasOwnProperty(defaultValuePropName)) {
       return props[defaultValuePropName];
     }
-
     return defaultValue;
   }, []);
   var stateRef = (0, _react.useRef)(initialValue);
-
   if (isControlled && isControlledOnChange) {
     stateRef.current = value;
   }
-
   var update = (0, _ahooks.useUpdate)();
-
   function setState(v) {
     var r = (0, _utils.isFunction)(v) ? v(stateRef.current) : v;
-
     if (!isControlledOnChange) {
       stateRef.current = r;
       update();
     }
-
     if (props[trigger]) {
       for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
         args[_key - 1] = arguments[_key];
       }
-
       props[trigger].apply(props, [r].concat(args));
     }
   }
-
   return [stateRef.current, (0, _ahooks.useMemoizedFn)(setState)];
 }
-
 var _default = useControllableValue;
 exports.default = _default;

package/lib/LmTable/index.js

@@ -1,14 +1,11 @@
 "use strict";
 
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _Table = _interopRequireWildcard(require("./Table"));
-
 _Table.default.Summary = _Table.Summary;
 var _default = _Table.default;
 exports.default = _default;

package/lib/LmTable/multipleContainersKeyboardCoordinates.d.ts

@@ -0,0 +1,3 @@
+import { KeyboardCoordinateGetter } from '@dnd-kit/core';
+declare const coordinateGetter: KeyboardCoordinateGetter;
+export default coordinateGetter;

package/lib/LmTable/multipleContainersKeyboardCoordinates.js

@@ -0,0 +1,99 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _core = require("@dnd-kit/core");
+var directions = [_core.KeyboardCode.Down, _core.KeyboardCode.Right, _core.KeyboardCode.Up, _core.KeyboardCode.Left];
+var coordinateGetter = function coordinateGetter(event, _ref) {
+  var _ref$context = _ref.context,
+    active = _ref$context.active,
+    droppableRects = _ref$context.droppableRects,
+    droppableContainers = _ref$context.droppableContainers,
+    collisionRect = _ref$context.collisionRect;
+  var _a;
+  if (directions.includes(event.code)) {
+    event.preventDefault();
+    if (!active || !collisionRect) {
+      return null;
+    }
+    var filteredContainers = [];
+    droppableContainers.getEnabled().forEach(function (entry) {
+      var _a;
+      if (!entry || (entry === null || entry === void 0 ? void 0 : entry.disabled)) {
+        return;
+      }
+      var rect = droppableRects.get(entry.id);
+      if (!rect) {
+        return;
+      }
+      var data = entry.data.current;
+      if (data) {
+        var type = data.type,
+          children = data.children;
+        if (type === 'container' && (children === null || children === void 0 ? void 0 : children.length) > 0) {
+          if (((_a = active.data.current) === null || _a === void 0 ? void 0 : _a.type) !== 'container') {
+            return;
+          }
+        }
+      }
+      switch (event.code) {
+        case _core.KeyboardCode.Down:
+          if (collisionRect.top < rect.top) {
+            filteredContainers.push(entry);
+          }
+          break;
+        case _core.KeyboardCode.Up:
+          if (collisionRect.top > rect.top) {
+            filteredContainers.push(entry);
+          }
+          break;
+        case _core.KeyboardCode.Left:
+          if (collisionRect.left >= rect.left + rect.width) {
+            filteredContainers.push(entry);
+          }
+          break;
+        case _core.KeyboardCode.Right:
+          if (collisionRect.left + collisionRect.width <= rect.left) {
+            filteredContainers.push(entry);
+          }
+          break;
+      }
+    });
+    var collisions = (0, _core.closestCorners)({
+      active: active,
+      collisionRect: collisionRect,
+      droppableRects: droppableRects,
+      droppableContainers: filteredContainers,
+      pointerCoordinates: null
+    });
+    var closestId = (0, _core.getFirstCollision)(collisions, 'id');
+    if (closestId != null) {
+      var newDroppable = droppableContainers.get(closestId);
+      var newNode = newDroppable === null || newDroppable === void 0 ? void 0 : newDroppable.node.current;
+      var newRect = newDroppable === null || newDroppable === void 0 ? void 0 : newDroppable.rect.current;
+      if (newNode && newRect) {
+        if (newDroppable.id === 'placeholder') {
+          return {
+            x: newRect.left + (newRect.width - collisionRect.width) / 2,
+            y: newRect.top + (newRect.height - collisionRect.height) / 2
+          };
+        }
+        if (((_a = newDroppable.data.current) === null || _a === void 0 ? void 0 : _a.type) === 'container') {
+          return {
+            x: newRect.left + 20,
+            y: newRect.top + 74
+          };
+        }
+        return {
+          x: newRect.left,
+          y: newRect.top
+        };
+      }
+    }
+  }
+  return null;
+};
+var _default = coordinateGetter;
+exports.default = _default;

package/lib/LmTable/resetConfig.js

@@ -9,23 +9,23 @@ exports.default = void 0;
 var checkConfig = {
   trigger: 'row',
   highlight: false
-}; // 列排序
-
+};
+// 列排序
 var sortConfig = {
   trigger: 'default',
   checkRowIds: []
-}; // 列过滤
-
+};
+// 列过滤
 var filterConfig = {
   trigger: 'default',
   checkRowIds: []
-}; // 分页
-
+};
+// 分页
 var pagerConfig = {
   pageSize: 30,
   pageIndex: 0
-}; // 编辑配置
-
+};
+// 编辑配置
 var editConfig = {
   enabled: false
 };

package/lib/LmTable/style/index.css

@@ -870,10 +870,15 @@ p {
 #lm_protable_warp .ant-table-wrapper,
 #lm_protable_warp .ant-spin-nested-loading,
 #lm_protable_warp .ant-spin-container,
-#lm_protable_warp .ant-table-container,
-#lm_protable_warp .ant-table-body {
+#lm_protable_warp .ant-table-container {
   height: 100%;
 }
+#lm_protable_warp.lm_protable_with_footer .ant-table-container {
+  height: auto;
+}
+#lm_protable_warp.lm_protable_with_footer .ant-table-footer {
+  background-color: #fff;
+}
 #lm_protable_warp .ant-card-body,
 #lm_protable_warp .ant-pro-card-body {
   padding: 0;
@@ -1661,3 +1666,9 @@ button.ant-table-row-expand-icon::after {
 .WeChatContactsAvatarTools .rightClickItems:last-child {
   border-bottom: 0;
 }
+.calc-select .ant-select-selection-item {
+  font-size: 12px !important;
+}
+.calc-select .ant-select-selection-placeholder {
+  font-size: 12px;
+}

package/lib/LmTable/style/variables.css

@@ -358,10 +358,15 @@
 #lm_protable_warp .ant-table-wrapper,
 #lm_protable_warp .ant-spin-nested-loading,
 #lm_protable_warp .ant-spin-container,
-#lm_protable_warp .ant-table-container,
-#lm_protable_warp .ant-table-body {
+#lm_protable_warp .ant-table-container {
   height: 100%;
 }
+#lm_protable_warp.lm_protable_with_footer .ant-table-container {
+  height: auto;
+}
+#lm_protable_warp.lm_protable_with_footer .ant-table-footer {
+  background-color: #fff;
+}
 #lm_protable_warp .ant-card-body,
 #lm_protable_warp .ant-pro-card-body {
   padding: 0;
@@ -1149,3 +1154,9 @@ button.ant-table-row-expand-icon::after {
 .WeChatContactsAvatarTools .rightClickItems:last-child {
   border-bottom: 0;
 }
+.calc-select .ant-select-selection-item {
+  font-size: 12px !important;
+}
+.calc-select .ant-select-selection-placeholder {
+  font-size: 12px;
+}