@nokecy/qc-ui 1.0.81 → 1.0.83

package/dist/cjs/draggableModal/index.js

@@ -10,10 +10,13 @@ var _antd = require("antd");
 var _react = _interopRequireWildcard(require("react"));
 var _reactDraggable = _interopRequireDefault(require("react-draggable"));
 require("./style.less");
+var _excluded = ["wrapClassName", "width"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+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; }
 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); }
@@ -21,9 +24,9 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 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; }
 /**
- * 可拖拽Modal
- * @param props 
- * @returns 
+ * 可拖拽Modal - 支持拖拽、全屏切换和缩放
+ * @param props
+ * @returns
  */
 var DraggableModal = function DraggableModal(props) {
   var _useState = (0, _react.useState)(true),
@@ -44,6 +47,39 @@ var DraggableModal = function DraggableModal(props) {
     _useState6 = _slicedToArray(_useState5, 2),
     fullScreen = _useState6[0],
     setFullScreen = _useState6[1];
+  var _useState7 = (0, _react.useState)('normal'),
+    _useState8 = _slicedToArray(_useState7, 2),
+    zoom = _useState8[0],
+    setZoom = _useState8[1];
+
+  // 调整大小相关状态
+  var _useState9 = (0, _react.useState)(false),
+    _useState10 = _slicedToArray(_useState9, 2),
+    isResizing = _useState10[0],
+    setIsResizing = _useState10[1];
+  var _useState11 = (0, _react.useState)(''),
+    _useState12 = _slicedToArray(_useState11, 2),
+    resizeDirection = _useState12[0],
+    setResizeDirection = _useState12[1];
+  var _useState13 = (0, _react.useState)({
+      width: 0,
+      height: 0
+    }),
+    _useState14 = _slicedToArray(_useState13, 2),
+    modalSize = _useState14[0],
+    setModalSize = _useState14[1];
+  var _useState15 = (0, _react.useState)({
+      x: 0,
+      y: 0
+    }),
+    _useState16 = _slicedToArray(_useState15, 2),
+    modalPosition = _useState16[0],
+    setModalPosition = _useState16[1];
+
+  // 解构 props,分离出 wrapClassName
+  var propsWrapClassName = props.wrapClassName,
+    width = props.width,
+    restProps = _objectWithoutProperties(props, _excluded);
   var _onStart = function onStart(_event, uiData) {
     var _draggleRef$current;
     var _window$document$docu = window.document.documentElement,
@@ -63,50 +99,240 @@ var DraggableModal = function DraggableModal(props) {
   var toggleFullScreen = function toggleFullScreen() {
     setFullScreen(!fullScreen);
   };
-  var titleRender = function titleRender() {
-    var title = props.title;
-    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, title, /*#__PURE__*/_react.default.createElement("button", {
-      type: "button",
-      className: "ant-modal-close",
-      style: {
-        right: 42
-      },
-      onClick: toggleFullScreen
-    }, /*#__PURE__*/_react.default.createElement("span", {
-      className: "ant-modal-close-x"
-    }, fullScreen ? /*#__PURE__*/_react.default.createElement(_icons.ShrinkOutlined, null) : /*#__PURE__*/_react.default.createElement(_icons.ArrowsAltOutlined, null))));
+  var handleZoomIn = function handleZoomIn() {
+    if (zoom === 'small') {
+      setZoom('normal');
+    } else if (zoom === 'normal') {
+      setZoom('large');
+    }
+  };
+  var handleZoomOut = function handleZoomOut() {
+    if (zoom === 'large') {
+      setZoom('normal');
+    } else if (zoom === 'normal') {
+      setZoom('small');
+    }
+  };
+
+  // 拖动调整大小的处理函数
+  var handleResizeMouseDown = function handleResizeMouseDown(e, direction) {
+    var _draggleRef$current2;
+    e.preventDefault();
+    e.stopPropagation();
+    if (fullScreen) return;
+
+    // 查找.ant-modal,它在draggleRef的父级
+    var modal = (_draggleRef$current2 = draggleRef.current) === null || _draggleRef$current2 === void 0 ? void 0 : _draggleRef$current2.closest('.ant-modal');
+    if (!modal) {
+      return;
+    }
+    var rect = modal.getBoundingClientRect();
+    setModalSize({
+      width: rect.width,
+      height: rect.height
+    });
+    setModalPosition({
+      x: rect.left,
+      y: rect.top
+    });
+    setResizeDirection(direction);
+    setIsResizing(true);
+    var startX = e.clientX;
+    var startY = e.clientY;
+    var startWidth = rect.width;
+    var startHeight = rect.height;
+    var startLeft = rect.left;
+    var startTop = rect.top;
+    var handleMouseMove = function handleMouseMove(moveEvent) {
+      var deltaX = moveEvent.clientX - startX;
+      var deltaY = moveEvent.clientY - startY;
+      var newWidth = startWidth;
+      var newHeight = startHeight;
+      var newLeft = startLeft;
+      var newTop = startTop;
+
+      // 根据方向计算新尺寸
+      if (direction.includes('e')) {
+        newWidth = Math.max(400, startWidth + deltaX);
+      }
+      if (direction.includes('w')) {
+        newWidth = Math.max(400, startWidth - deltaX);
+        newLeft = startLeft + (startWidth - newWidth);
+      }
+      if (direction.includes('s')) {
+        newHeight = Math.max(300, startHeight + deltaY);
+      }
+      if (direction.includes('n')) {
+        newHeight = Math.max(300, startHeight - deltaY);
+        newTop = startTop + (startHeight - newHeight);
+      }
+
+      // 限制最大尺寸
+      var maxWidth = window.innerWidth * 0.95;
+      var maxHeight = window.innerHeight * 0.95;
+      newWidth = Math.min(newWidth, maxWidth);
+      newHeight = Math.min(newHeight, maxHeight);
+
+      // 直接更新DOM以实现实时效果
+      modal.style.width = "".concat(newWidth, "px");
+      modal.style.height = "".concat(newHeight, "px");
+
+      // 同时更新 modal-content 的高度
+      var modalContent = modal.querySelector('.ant-modal-content');
+      if (modalContent) {
+        modalContent.style.height = "".concat(newHeight, "px");
+        modalContent.style.display = 'flex';
+        modalContent.style.flexDirection = 'column';
+      }
+
+      // 仍然更新state以保持React状态同步
+      setModalSize({
+        width: newWidth,
+        height: newHeight
+      });
+      setModalPosition({
+        x: newLeft,
+        y: newTop
+      });
+    };
+    var handleMouseUp = function handleMouseUp() {
+      setIsResizing(false);
+      setResizeDirection('');
+      document.removeEventListener('mousemove', handleMouseMove);
+      document.removeEventListener('mouseup', handleMouseUp);
+    };
+    document.addEventListener('mousemove', handleMouseMove);
+    document.addEventListener('mouseup', handleMouseUp);
   };
+
+  // 合并类名
+  var zoomClass = !fullScreen && zoom !== 'normal' ? "modal-wrap-zoom-".concat(zoom) : '';
+  var fullScreenClass = fullScreen ? 'modal-wrap-fullscreen' : '';
+  var resizingClass = isResizing ? 'modal-wrap-resizing' : '';
+  var mergedWrapClassName = [propsWrapClassName, fullScreenClass, zoomClass, resizingClass].filter(Boolean).join(' ');
   return /*#__PURE__*/_react.default.createElement(_antd.Modal, _extends({
     maskClosable: false,
-    wrapClassName: "".concat(fullScreen ? 'modal-wrap-fullscreen' : '')
-  }, props, {
+    width: width
+  }, restProps, {
+    wrapClassName: mergedWrapClassName,
     title: /*#__PURE__*/_react.default.createElement("div", {
       style: {
         width: '100%',
-        cursor: 'move'
+        cursor: fullScreen ? 'default' : 'move'
       },
       onMouseOver: function onMouseOver() {
-        if (disabled) {
+        if (!fullScreen && disabled) {
           setDisabled(false);
         }
       },
       onMouseOut: function onMouseOut() {
-        setDisabled(true);
+        if (!fullScreen) {
+          setDisabled(true);
+        }
       },
       onFocus: function onFocus() {},
       onBlur: function onBlur() {}
-    }, titleRender()),
+    }, props.title, !fullScreen && zoom !== 'large' && /*#__PURE__*/_react.default.createElement("button", {
+      type: "button",
+      className: "ant-modal-close",
+      style: {
+        right: 106
+      },
+      onClick: function onClick(e) {
+        e.stopPropagation();
+        handleZoomIn();
+      },
+      title: "\u653E\u5927"
+    }, /*#__PURE__*/_react.default.createElement("span", {
+      className: "ant-modal-close-x"
+    }, /*#__PURE__*/_react.default.createElement(_icons.ZoomInOutlined, null))), !fullScreen && zoom !== 'small' && /*#__PURE__*/_react.default.createElement("button", {
+      type: "button",
+      className: "ant-modal-close",
+      style: {
+        right: 74
+      },
+      onClick: function onClick(e) {
+        e.stopPropagation();
+        handleZoomOut();
+      },
+      title: "\u7F29\u5C0F"
+    }, /*#__PURE__*/_react.default.createElement("span", {
+      className: "ant-modal-close-x"
+    }, /*#__PURE__*/_react.default.createElement(_icons.ZoomOutOutlined, null))), /*#__PURE__*/_react.default.createElement("button", {
+      type: "button",
+      className: "ant-modal-close",
+      style: {
+        right: 42
+      },
+      onClick: function onClick(e) {
+        e.stopPropagation();
+        toggleFullScreen();
+      },
+      title: fullScreen ? '退出全屏' : '全屏'
+    }, /*#__PURE__*/_react.default.createElement("span", {
+      className: "ant-modal-close-x"
+    }, fullScreen ? /*#__PURE__*/_react.default.createElement(_icons.ShrinkOutlined, null) : /*#__PURE__*/_react.default.createElement(_icons.ArrowsAltOutlined, null)))),
     modalRender: function modalRender(modal) {
       return /*#__PURE__*/_react.default.createElement(_reactDraggable.default, {
-        disabled: disabled,
+        disabled: disabled || fullScreen,
         bounds: bounds,
         nodeRef: draggleRef,
         onStart: function onStart(event, uiData) {
           return _onStart(event, uiData);
-        }
+        },
+        cancel: ".resize-handle"
       }, /*#__PURE__*/_react.default.createElement("div", {
-        ref: draggleRef
-      }, modal));
+        ref: draggleRef,
+        style: isResizing && modalSize.width > 0 ? {
+          position: 'relative',
+          height: '100%',
+          '--modal-width': "".concat(modalSize.width, "px"),
+          '--modal-height': "".concat(modalSize.height, "px")
+        } : {
+          position: 'relative',
+          height: '100%'
+        }
+      }, modal, !fullScreen && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
+        className: "resize-handle resize-handle-e",
+        onMouseDown: function onMouseDown(e) {
+          return handleResizeMouseDown(e, 'e');
+        }
+      }), /*#__PURE__*/_react.default.createElement("div", {
+        className: "resize-handle resize-handle-s",
+        onMouseDown: function onMouseDown(e) {
+          return handleResizeMouseDown(e, 's');
+        }
+      }), /*#__PURE__*/_react.default.createElement("div", {
+        className: "resize-handle resize-handle-w",
+        onMouseDown: function onMouseDown(e) {
+          return handleResizeMouseDown(e, 'w');
+        }
+      }), /*#__PURE__*/_react.default.createElement("div", {
+        className: "resize-handle resize-handle-n",
+        onMouseDown: function onMouseDown(e) {
+          return handleResizeMouseDown(e, 'n');
+        }
+      }), /*#__PURE__*/_react.default.createElement("div", {
+        className: "resize-handle resize-handle-se",
+        onMouseDown: function onMouseDown(e) {
+          return handleResizeMouseDown(e, 'se');
+        }
+      }), /*#__PURE__*/_react.default.createElement("div", {
+        className: "resize-handle resize-handle-sw",
+        onMouseDown: function onMouseDown(e) {
+          return handleResizeMouseDown(e, 'sw');
+        }
+      }), /*#__PURE__*/_react.default.createElement("div", {
+        className: "resize-handle resize-handle-ne",
+        onMouseDown: function onMouseDown(e) {
+          return handleResizeMouseDown(e, 'ne');
+        }
+      }), /*#__PURE__*/_react.default.createElement("div", {
+        className: "resize-handle resize-handle-nw",
+        onMouseDown: function onMouseDown(e) {
+          return handleResizeMouseDown(e, 'nw');
+        }
+      }))));
     }
   }));
 };

package/dist/cjs/draggableModal/style.less

@@ -1,16 +1,189 @@
-.modal-wrap-fullscreen {
-  top: 0;
-  margin: 0;
-  width: 100%;
-  max-width: 100%;
-  height: 100vh;
-  max-height: 100vh;
-  padding: 0;
-
-  :global {
-    .acud-modal-content {
-      height: 100%;
+:global {
+  .modal-wrap-fullscreen {
+    .ant-modal {
+      top: 0 !important;
+      margin: 0 !important;
+      width: 100vw !important;
+      max-width: 100vw !important;
+      height: 100vh !important;
+      max-height: 100vh !important;
+      padding: 0 !important;
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    }
+
+    .ant-modal-content {
+      height: 100vh;
       border-radius: 0;
+      display: flex;
+      flex-direction: column;
+    }
+
+    .ant-modal-body {
+      flex: 1;
+      overflow-y: auto;
+      padding: 24px;
+    }
+
+    .ant-modal-header {
+      flex-shrink: 0;
+    }
+
+    .ant-modal-footer {
+      flex-shrink: 0;
+    }
+  }
+
+  .modal-wrap-zoom-large {
+    .ant-modal {
+      width: 90vw !important;
+      max-width: 90vw !important;
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    }
+
+    .ant-modal-content {
+      max-height: 85vh;
+      transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    }
+
+    .ant-modal-body {
+      max-height: calc(85vh - 110px);
+      overflow-y: auto;
+      transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    }
+  }
+
+  .modal-wrap-zoom-small {
+    .ant-modal {
+      width: 50vw !important;
+      max-width: 50vw !important;
+      min-width: 400px !important;
+      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    }
+
+    .ant-modal-content {
+      max-height: 50vh;
+      transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    }
+
+    .ant-modal-body {
+      max-height: calc(50vh - 110px);
+      overflow-y: auto;
+      transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    }
+  }
+
+  .modal-wrap-resizing {
+    .ant-modal {
+      width: var(--modal-width) !important;
+      transition: none;
+    }
+
+    .ant-modal-content {
+      height: var(--modal-height);
+      transition: none;
+      display: flex;
+      flex-direction: column;
+    }
+
+    .ant-modal-body {
+      flex: 1;
+      overflow-y: auto;
+    }
+
+    .ant-modal-header {
+      flex-shrink: 0;
+    }
+
+    .ant-modal-footer {
+      flex-shrink: 0;
     }
   }
 }
+
+// 拖动调整大小的手柄样式
+.resize-handle {
+  position: absolute;
+  z-index: 10;
+  background: transparent;
+  transition: all 0.2s ease;
+  pointer-events: auto;
+  opacity: 0;
+
+  &:hover {
+    opacity: 1;
+    background-color: rgba(24, 144, 255, 0.5);
+  }
+}
+
+// 当鼠标悬停在 modal 上时显示手柄
+.ant-modal:hover .resize-handle {
+  opacity: 1;
+  background: rgba(24, 144, 255, 0.15);
+}
+
+
+// 边缘手柄
+.resize-handle-e {
+  right: 0;
+  top: 0;
+  bottom: 0;
+  width: 8px;
+  cursor: e-resize;
+}
+
+.resize-handle-w {
+  left: 0;
+  top: 0;
+  bottom: 0;
+  width: 8px;
+  cursor: w-resize;
+}
+
+.resize-handle-s {
+  bottom: 0;
+  left: 0;
+  right: 0;
+  height: 8px;
+  cursor: s-resize;
+}
+
+.resize-handle-n {
+  top: 0;
+  left: 0;
+  right: 0;
+  height: 8px;
+  cursor: n-resize;
+}
+
+// 角落手柄
+.resize-handle-se {
+  right: 0;
+  bottom: 0;
+  width: 12px;
+  height: 12px;
+  cursor: se-resize;
+}
+
+.resize-handle-sw {
+  left: 0;
+  bottom: 0;
+  width: 12px;
+  height: 12px;
+  cursor: sw-resize;
+}
+
+.resize-handle-ne {
+  right: 0;
+  top: 0;
+  width: 12px;
+  height: 12px;
+  cursor: ne-resize;
+}
+
+.resize-handle-nw {
+  left: 0;
+  top: 0;
+  width: 12px;
+  height: 12px;
+  cursor: nw-resize;
+}

package/dist/esm/ag-grid-plus/_utils/processColumnGroups.d.ts

@@ -1,2 +1,11 @@
+/**
+ * 处理列分组配置
+ * 兼容新旧两种数据格式：
+ * 1. 新格式：FlatColumnItem[] (带有 type, parentId, level)
+ * 2. 旧格式：{ groupName: string } (简单的分组名称)
+ *
+ * @param columns 列配置数组
+ * @returns AG-Grid 列定义
+ */
 declare const processColumnGroups: (columns: any[]) => any;
 export default processColumnGroups;

package/dist/esm/ag-grid-plus/_utils/processColumnGroups.js

@@ -10,7 +10,51 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 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(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { flatConfigToGridState, isOldSchemeData, migrateOldScheme } from "../setting/columnGroupUtils";
+
+/**
+ * 处理列分组配置
+ * 兼容新旧两种数据格式：
+ * 1. 新格式：FlatColumnItem[] (带有 type, parentId, level)
+ * 2. 旧格式：{ groupName: string } (简单的分组名称)
+ *
+ * @param columns 列配置数组
+ * @returns AG-Grid 列定义
+ */
 var processColumnGroups = function processColumnGroups(columns) {
+  // 如果是空数组，直接返回
+  if (!columns || columns.length === 0) {
+    return [];
+  }
+
+  // 检查是否已经是标准 AG-Grid 格式（带 children 的分组）
+  // 如果列定义中有 children 属性，说明已经是 AG-Grid 标准格式，直接返回
+  var hasStandardGroups = columns.some(function (col) {
+    return col.children && Array.isArray(col.children);
+  });
+  if (hasStandardGroups) {
+    // 标准格式：直接返回，不做任何处理
+    return columns;
+  }
+
+  // 检查是否是新格式（FlatColumnItem）
+  var isNewFormat = columns.some(function (col) {
+    return col.type !== undefined;
+  });
+  if (isNewFormat) {
+    // 新格式：使用 flatConfigToGridState 转换
+    return flatConfigToGridState(columns);
+  }
+
+  // 旧格式：使用旧的处理逻辑
+  // 检查是否需要迁移
+  if (isOldSchemeData(columns)) {
+    // 先迁移到新格式，再转换
+    var migrated = migrateOldScheme(columns);
+    return flatConfigToGridState(migrated);
+  }
+
+  // 兼容最原始的格式（groupName）
   var groupMap = new Map();
   var result = [];
   var ungrouped = [];