linkmore-design 1.1.21 → 1.1.22-beta.1

package/es/LmTable/multipleContainersKeyboardCoordinates.js

@@ -0,0 +1,117 @@
+import { closestCorners, getFirstCollision, KeyboardCode } from '@dnd-kit/core';
+var directions = [KeyboardCode.Down, KeyboardCode.Right, KeyboardCode.Up, 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 KeyboardCode.Down:
+          if (collisionRect.top < rect.top) {
+            filteredContainers.push(entry);
+          }
+
+          break;
+
+        case KeyboardCode.Up:
+          if (collisionRect.top > rect.top) {
+            filteredContainers.push(entry);
+          }
+
+          break;
+
+        case KeyboardCode.Left:
+          if (collisionRect.left >= rect.left + rect.width) {
+            filteredContainers.push(entry);
+          }
+
+          break;
+
+        case KeyboardCode.Right:
+          if (collisionRect.left + collisionRect.width <= rect.left) {
+            filteredContainers.push(entry);
+          }
+
+          break;
+      }
+    });
+    var collisions = closestCorners({
+      active: active,
+      collisionRect: collisionRect,
+      droppableRects: droppableRects,
+      droppableContainers: filteredContainers,
+      pointerCoordinates: null
+    });
+    var closestId = 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;
+};
+
+export default coordinateGetter;

package/es/LmTable/style/index.css

@@ -870,8 +870,7 @@ 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 .ant-card-body,

package/es/LmTable/style/variables.css

@@ -358,8 +358,7 @@
 #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 .ant-card-body,

package/es/LmTable/testDemos/group.js

@@ -0,0 +1,131 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/extends"));
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _linkmoreDesign = require("linkmore-design");
+
+var createDataSource = function createDataSource(start) {
+  var arr = [];
+
+  for (var i = start; i < start + 30000; i += 1) {
+    var obj = {
+      key: "key_".concat(i),
+      name: "\u5C0F\u9EC4_".concat(i),
+      id: "id_".concat(i),
+      age: "87",
+      address: "\u676D\u5DDE_".concat(i),
+      height: i,
+      favorite2: "\u7BEE\u7403_".concat(i),
+      favorite: "\u8DB3\u7403_".concat(i),
+      sex: i % 3 === 0 ? '男' : '女'
+    };
+    arr.push(obj);
+  }
+
+  return arr;
+};
+
+var columns = [{
+  title: '姓名',
+  dataIndex: 'name',
+  key: 'name',
+  width: 100
+}, {
+  title: '爱好',
+  dataIndex: 'favorite',
+  key: 'favorite',
+  width: 100
+}, {
+  title: '爱好2',
+  dataIndex: 'favorite2',
+  key: 'favorite2',
+  width: 100
+}, {
+  title: '年龄',
+  dataIndex: 'age',
+  key: 'age',
+  etype: 'number',
+  width: 100
+}, {
+  title: '薪水',
+  dataIndex: 'height',
+  key: 'height',
+  etype: 'number',
+  width: 100,
+  expression: 'sum'
+}, {
+  title: '住址',
+  dataIndex: 'address',
+  key: 'address',
+  width: 100
+}];
+
+var App = function App() {
+  var _useState = (0, _react.useState)([]),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      dataSource = _useState2[0],
+      setDataSource = _useState2[1];
+
+  (0, _react.useEffect)(function () {
+    setTimeout(function () {
+      if (dataSource.length >= 500) {
+        return;
+      }
+
+      var data = createDataSource(dataSource.length);
+      setDataSource([].concat((0, _toConsumableArray2.default)(dataSource), (0, _toConsumableArray2.default)(data)));
+    }, 500);
+  }, [dataSource]);
+
+  var dataChange = function dataChange(newDataSource) {
+    setDataSource((0, _toConsumableArray2.default)(newDataSource));
+  };
+
+  var config = {
+    pagination: false,
+    scroll: {
+      y: 300
+    },
+    virtual: true,
+    hiddenPage: true
+  };
+  return /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Space, {
+    direction: "vertical",
+    style: {
+      width: '100%'
+    }
+  }, /*#__PURE__*/_react.default.createElement("div", null, "\u6570\u636E\u603B\u6570\uFF1A ", dataSource.length), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.LmTable, (0, _extends2.default)({}, config, {
+    dataSource: dataSource,
+    columns: columns // 表格行 key 的取值，可以是字符串或一个函数
+    ,
+    rowKey: "key",
+    size: "small",
+    dataChange: dataChange,
+    resizeable: true // 表头列宽度是否可拖动
+    ,
+    openRowGroup: true // 开启行分组
+    ,
+    rowGroupTitle: "\u884C\u5206\u7EC4\u6807\u9898",
+    openColGroup: true // 开启列分组
+    ,
+    colGroupTitle: "\u5217\u5206\u7EC4\u6807\u9898"
+  })));
+};
+
+var _default = App;
+exports.default = _default;

package/es/LmUpload/UploadList/ItemPictureCard.js

@@ -122,13 +122,13 @@ var PictureItem = function PictureItem(_ref) {
     });
   };
 
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", Object.assign({
     className: cn('lm_upload_item', 'lm_upload_item_card', isError && 'lm_upload_item_error'),
     style: {
       height: size,
       width: size
     }
-  }, /*#__PURE__*/React.createElement("div", {
+  }, listeners || {}), /*#__PURE__*/React.createElement("div", {
     className: "lm_upload_item_thumb"
   }, isError || !isImg ? renderThumb(resetFile) : /*#__PURE__*/React.createElement(Image, {
     width: resetSize.width,
@@ -149,13 +149,6 @@ var PictureItem = function PictureItem(_ref) {
     style: {
       fontSize: resetSize.fontSize
     }
-  })), /*#__PURE__*/React.createElement("div", Object.assign({
-    className: "action_preview"
-  }, listeners), /*#__PURE__*/React.createElement(IconFont, {
-    type: "lmweb-drag",
-    style: {
-      fontSize: resetSize.fontSize
-    }
   })), !readOnly && /*#__PURE__*/React.createElement("div", {
     className: "action_delete",
     onClick: function onClick() {

package/es/LmUpload/UploadList/index.js

@@ -6,14 +6,14 @@ import RenderItem from './RenderItem';
 var LmUploadList = function LmUploadList(_ref) {
   var instance = _ref.instance;
   var uid = instance.uid,
-      dispatch = instance.dispatch,
       getFileHasValue = instance.getFileHasValue,
       getFileList = instance.getFileList,
       itemRender = instance.itemRender,
       listType = instance.listType,
       showUploadList = instance.showUploadList,
       enableDrag = instance.enableDrag,
-      fileNames = instance.fileNames;
+      fileNames = instance.fileNames,
+      move = instance.move;
   if (!showUploadList) return null;
   var fileList = useMemo(function () {
     var _a;
@@ -40,10 +40,7 @@ var LmUploadList = function LmUploadList(_ref) {
 
         return v;
       });
-      dispatch({
-        type: 'changeFileList',
-        fileList: fileMap
-      });
+      move(active, over, fileMap);
     } catch (error) {
       console.log('移动出现了错误', error);
     }

package/es/LmUpload/fns/index.d.ts

@@ -15,6 +15,7 @@ declare const useCoreOptions: ({ state, dispatch, props }: {
         remove: (file: any) => Promise<void>;
         preview: (file: any) => void;
         download: (file: any) => void;
+        move: (active: any, over: any, fileList: any) => void;
     };
     RefMethods: {
         getState: () => any;

package/es/LmUpload/fns/index.js

@@ -471,7 +471,21 @@ var useCoreOptions = function useCoreOptions(_ref) {
     var _a;
 
     (_a = props.onDownload) === null || _a === void 0 ? void 0 : _a.call(props, file);
-  }, [props.onDownload]);
+  }, [props.onDownload]); // 拖拽移动事件
+
+  var move = useCallback(function (active, over, fileList) {
+    var _a;
+
+    (_a = props.onMove) === null || _a === void 0 ? void 0 : _a.call(props, active, over, fileList);
+    onChange === null || onChange === void 0 ? void 0 : onChange({
+      file: active,
+      fileList: fileList
+    });
+    dispatch({
+      type: 'changeFileList',
+      fileList: fileList
+    });
+  }, [props.onMove, onChange, dispatch]);
   var CoreMethods = {
     getIsMaxCount: getIsMaxCount,
     getFileHasValue: getFileHasValue,
@@ -481,7 +495,8 @@ var useCoreOptions = function useCoreOptions(_ref) {
     getUploadStatus: getUploadStatus,
     remove: remove,
     preview: preview,
-    download: download
+    download: download,
+    move: move
   };
   var RefMethods = {
     getState: function getState() {

package/es/index.d.ts

@@ -51,6 +51,7 @@ export type { TooltipProps } from './Tooltip';
 export { default as Form } from './Form';
 export { default as Spin } from './Spin';
 export { default as LmEditTable } from './LmEditTable';
+export type { CountdownHandle, TLmEditTable } from './LmEditTable/EditTable';
 export { default as List } from './List';
 export { default as LMQuickMenu } from './QuickMenu';
 export { default as DatePicker } from './DatePicker';

package/es/styles/variables.css

@@ -9937,6 +9937,9 @@ p {
 .lm_filter_basic_item .filter_item_icon.addon_before {
   color: var(--font-color);
 }
+.lm_filter_basic_item .filter_item_icon .icon_clear {
+  display: none;
+}
 .lm_filter_basic_item.expand .filter_item_icon.addon_after {
   transform: rotateX(180deg);
 }
@@ -9950,6 +9953,12 @@ p {
 .lm_filter_basic_item.active.lm_filter_complex_item .filter_item_label {
   color: var(--primary-color);
 }
+.lm_filter_basic_item.active:hover .icon_down {
+  display: none;
+}
+.lm_filter_basic_item.active:hover .icon_clear {
+  display: inline-block;
+}
 .ant-dropdown.filter_dropdown_container_cascader > div {
   transform: translateY(-4px);
 }
@@ -10953,8 +10962,7 @@ 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 .ant-card-body,

package/lib/LmDrag/LmDrag.d.ts

@@ -1,5 +1,4 @@
 import React from 'react';
-declare const _default: React.ForwardRefExoticComponent<Pick<{
-    [x: string]: any;
-}, string | number> & React.RefAttributes<unknown>>;
+import { LmDragProps } from '..';
+declare const _default: React.ForwardRefExoticComponent<LmDragProps & React.RefAttributes<unknown>>;
 export default _default;

package/lib/LmEditTable/EditTable.d.ts

@@ -22,6 +22,16 @@ interface ILmEditTable extends TableProps<any> {
     };
     /** 是否为强制更新 */
     shouldUpdate?: boolean;
+    rowSelection?: TableProps<any>['rowSelection'] & {
+        selectedRows?: Record<string, any>;
+    };
+}
+export interface CountdownHandle {
+    setRow: (data: any) => void;
+    getCheckboxRecords: () => any[];
+    clearSelect: () => void;
+    customSetCheckboxRecords: (data: any[]) => void;
+    valid: () => void;
 }
 interface ILmColumns extends TableColumnType<any> {
     editable?: 'input' | 'number' | 'inputRange' | 'date' | 'select' | 'multiple' | 'checkbox' | 'radio' | 'switch' | 'upload' | 'operate' | 'lm_edit_opetate' | 'render';
@@ -33,12 +43,12 @@ interface ILmColumns extends TableColumnType<any> {
     componentProps?: Record<string, any>;
     relevanceCols?: boolean;
 }
-export declare type TLmEditTable = {
+export declare type TLmEditTable = ILmEditTable & {
     onChange?: (data: any[]) => void;
     columns: ILmColumns[];
-} & ILmEditTable;
-declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<{
+};
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<ILmEditTable & {
     onChange?: (data: any[]) => void;
     columns: ILmColumns[];
-} & ILmEditTable & React.RefAttributes<unknown>>>;
+} & React.RefAttributes<CountdownHandle>>>;
 export default _default;