@nokecy/qc-ui 1.0.67 → 1.0.69

package/dist/cjs/index.d.ts

@@ -1,6 +1,7 @@
-import { AgGridColumn, AgGridPlus, flattenTreeDeep, GridPlusContext } from "./ag-grid-plus";
+import { AgGridColumn, AgGridPlus, flattenTreeDeep, GridPlusContext, useGridPlusColumnState } from "./ag-grid-plus";
 import ArrayTable from "./array-table";
 import ArrayTableIndex from "./array-table-index";
+import { ColumnPresets } from "./array-table/columnHelper";
 import Card from "./card";
 import Dashboard from "./dashboard";
 import DialogSelect from "./dialogSelect";
@@ -20,11 +21,12 @@ import { StandardFormDialog, withStandardForm, FieldCreators, createSelectField,
 import DeleteConfirm from "./deleteConfirm";
 import { RuleBuilder } from "./RuleBuilder";
 import { RegexEditor, useRegexValidation, useTemplateManager, TemplateSelector, TemplateCategory, RegexTester, FlagsSelector, MatchItem, RegexRailroadDiagram } from "./components/RegexEditor";
-export { AgGridColumn, AgGridPlus, ArrayTable, ArrayTableIndex, Card, Dashboard, DialogSelect, DraggableModal, Editable, ExtensibleGrid, flattenTreeDeep, FormDesigner, FormProContext, FormProLayout, GridPlusContext, ImportModal, QueryBuilder, ToolBar, FullScreenAlert, ConfirmPro, GeneratedListPage, StandardFormDialog, withStandardForm, FieldCreators, createSelectField, createCascaderField, DeleteConfirm, RuleBuilder, RegexEditor, useRegexValidation, useTemplateManager, TemplateSelector, TemplateCategory, RegexTester, FlagsSelector, MatchItem, RegexRailroadDiagram, };
+export { AgGridColumn, AgGridPlus, ArrayTable, ArrayTableIndex, ColumnPresets, Card, Dashboard, DialogSelect, DraggableModal, Editable, ExtensibleGrid, flattenTreeDeep, FormDesigner, FormProContext, FormProLayout, GridPlusContext, useGridPlusColumnState, ImportModal, QueryBuilder, ToolBar, FullScreenAlert, ConfirmPro, GeneratedListPage, StandardFormDialog, withStandardForm, FieldCreators, createSelectField, createCascaderField, DeleteConfirm, RuleBuilder, RegexEditor, useRegexValidation, useTemplateManager, TemplateSelector, TemplateCategory, RegexTester, FlagsSelector, MatchItem, RegexRailroadDiagram, };
 export type * from "./generatedListPage";
 export type * from "./standardFormDialog";
 export type * from "./deleteConfirm";
 export type * from "./importModal";
 export type * from "./fullScreenAlert";
 export type * from "./RuleBuilder";
+export type { ColumnConfig } from "./array-table/columnHelper";
 export type { ParseResult as RegexParseResult, ValidationResult as RegexValidationResult, RegexError, ComplexityMetrics, ASTNode, AstRegExp, RegexTemplate, TestResult as RegexTestResult, CodeMirrorWrapperProps, RegexEditorProps, RegexFlags, MatchResult, RegexTesterProps, FlagsSelectorProps, MatchItemProps, RegexRailroadDiagramProps, } from "./components/RegexEditor";

package/dist/cjs/index.js

@@ -33,6 +33,12 @@ Object.defineProperty(exports, "Card", {
     return _card.default;
   }
 });
+Object.defineProperty(exports, "ColumnPresets", {
+  enumerable: true,
+  get: function get() {
+    return _columnHelper.ColumnPresets;
+  }
+});
 Object.defineProperty(exports, "ConfirmPro", {
   enumerable: true,
   get: function get() {
@@ -207,6 +213,12 @@ Object.defineProperty(exports, "flattenTreeDeep", {
     return _agGridPlus.flattenTreeDeep;
   }
 });
+Object.defineProperty(exports, "useGridPlusColumnState", {
+  enumerable: true,
+  get: function get() {
+    return _agGridPlus.useGridPlusColumnState;
+  }
+});
 Object.defineProperty(exports, "useRegexValidation", {
   enumerable: true,
   get: function get() {
@@ -228,6 +240,7 @@ Object.defineProperty(exports, "withStandardForm", {
 var _agGridPlus = require("./ag-grid-plus");
 var _arrayTable = _interopRequireDefault(require("./array-table"));
 var _arrayTableIndex = _interopRequireDefault(require("./array-table-index"));
+var _columnHelper = require("./array-table/columnHelper");
 var _card = _interopRequireDefault(require("./card"));
 var _dashboard = _interopRequireDefault(require("./dashboard"));
 var _dialogSelect = _interopRequireDefault(require("./dialogSelect"));

package/dist/esm/ag-grid-plus/hooks/useGridPlusColumnState.d.ts

@@ -0,0 +1,12 @@
+/**
+ * 使用 GridPlusContext 的 Hook
+ * 用于访问列状态管理相关的方法和数据
+ */
+export declare const useGridPlusColumnState: () => {
+    extensibleColumns: any;
+    columnState: any;
+    onSaveColumnState: (gridKey: string, columnState: any[]) => void;
+    applyToGlobal: (gridKey: string) => void;
+    resetCurrent: (gridKey: string) => void;
+    resetAll: (gridKey: string) => void;
+};

package/dist/esm/ag-grid-plus/hooks/useGridPlusColumnState.js

@@ -0,0 +1,10 @@
+import { useContext } from 'react';
+import { GridPlusContext } from "../context/gridContext";
+
+/**
+ * 使用 GridPlusContext 的 Hook
+ * 用于访问列状态管理相关的方法和数据
+ */
+export var useGridPlusColumnState = function useGridPlusColumnState() {
+  return useContext(GridPlusContext);
+};

package/dist/esm/ag-grid-plus/index.d.ts

@@ -1,14 +1,7 @@
 import AgGridPlus from "./ag-gridPlus";
 import { AgGridColumn } from "./interface";
 import { GridPlusContext } from "./context/gridContext";
+import { useGridPlusColumnState } from "./hooks/useGridPlusColumnState";
 import "./ag-grid-theme-builder.css";
-export declare const useGridPlusColumnState: () => {
-    extensibleColumns: any;
-    columnState: any;
-    onSaveColumnState: (gridKey: string, columnState: any[]) => void;
-    applyToGlobal: (gridKey: string) => void;
-    resetCurrent: (gridKey: string) => void;
-    resetAll: (gridKey: string) => void;
-};
-export { AgGridPlus, AgGridColumn, GridPlusContext };
+export { AgGridPlus, AgGridColumn, GridPlusContext, useGridPlusColumnState };
 export { dateValueFormatter, dateTimeValueFormatter, convertFilterModel, convertSortModel, flattenTreeDeep, toTree, flatten } from "./utils";

package/dist/esm/ag-grid-plus/index.js

@@ -1,10 +1,7 @@
-import React from "react";
 import AgGridPlus from "./ag-gridPlus";
 import { AgGridColumn } from "./interface";
 import { GridPlusContext } from "./context/gridContext";
+import { useGridPlusColumnState } from "./hooks/useGridPlusColumnState";
 import "./ag-grid-theme-builder.css";
-export var useGridPlusColumnState = function useGridPlusColumnState() {
-  return React.useContext(GridPlusContext);
-};
-export { AgGridPlus, AgGridColumn, GridPlusContext };
+export { AgGridPlus, AgGridColumn, GridPlusContext, useGridPlusColumnState };
 export { dateValueFormatter, dateTimeValueFormatter, convertFilterModel, convertSortModel, flattenTreeDeep, toTree, flatten } from "./utils";

package/dist/esm/ag-grid-plus/queryForm/index.js

@@ -140,6 +140,23 @@ var FormRender = function FormRender(props) {
       var component = getComponent(colDef);
       if (colDef.filter != false) {
         var _colDef$searchCompone, _colDef$searchCompone2, _colDef$searchCompone3;
+        // 为多选下拉框添加maxTagCount配置
+        var componentProps = _objectSpread({
+          placeholder: "\u8BF7\u8F93\u5165".concat(headerName),
+          allowClear: true,
+          style: {
+            maxWidth: 200
+          }
+        }, colDef === null || colDef === void 0 ? void 0 : colDef.searchComponentProps);
+
+        // 如果是Select组件且为多选模式，添加标签数量限制
+        if (component === 'Select' && (componentProps.mode === 'multiple' || componentProps.mode === 'tags')) {
+          var _componentProps$maxTa, _componentProps$maxTa2;
+          componentProps.maxTagCount = (_componentProps$maxTa = componentProps.maxTagCount) !== null && _componentProps$maxTa !== void 0 ? _componentProps$maxTa : 2;
+          componentProps.maxTagPlaceholder = (_componentProps$maxTa2 = componentProps.maxTagPlaceholder) !== null && _componentProps$maxTa2 !== void 0 ? _componentProps$maxTa2 : function (omittedValues) {
+            return "+".concat(omittedValues.length, "...");
+          };
+        }
         var filedSchema = {
           type: 'string',
           title: headerName,
@@ -147,13 +164,7 @@ var FormRender = function FormRender(props) {
           default: (colDef === null || colDef === void 0 || (_colDef$searchCompone2 = colDef.searchComponentProps) === null || _colDef$searchCompone2 === void 0 ? void 0 : _colDef$searchCompone2.default) || (colDef === null || colDef === void 0 || (_colDef$searchCompone3 = colDef.searchComponentProps) === null || _colDef$searchCompone3 === void 0 ? void 0 : _colDef$searchCompone3.defaultValue),
           enum: colDef === null || colDef === void 0 ? void 0 : colDef.enum,
           "x-component": component,
-          "x-component-props": _objectSpread({
-            placeholder: "\u8BF7\u8F93\u5165".concat(headerName),
-            allowClear: true,
-            style: {
-              maxWidth: 200
-            }
-          }, colDef === null || colDef === void 0 ? void 0 : colDef.searchComponentProps),
+          "x-component-props": componentProps,
           "x-decorator": 'FormItem',
           "x-decorator-props": {
             wrapperWrap: true

package/dist/esm/ag-grid-plus/queryForm/index.less

@@ -33,6 +33,25 @@
             justify-content: flex-start;
         }
     }
+
+    // 多选下拉框标签省略样式
+    .ant-select-multiple {
+        .ant-select-selector {
+            max-width: 100%;
+
+            .ant-select-selection-overflow {
+                max-width: 100%;
+                flex-wrap: nowrap;
+            }
+
+            .ant-select-selection-item {
+                max-width: 100px;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+            }
+        }
+    }
 }
 
 @media (max-width: 575px) {

package/dist/esm/ag-grid-plus/setting/index.js

@@ -16,7 +16,7 @@ import { SettingOutlined } from '@ant-design/icons';
 import ArrayTable from "../../array-table";
 import { Dropdown } from 'antd';
 import DiySetting from "./diySetting";
-import { useGridPlusColumnState } from '..';
+import { useGridPlusColumnState } from "../hooks/useGridPlusColumnState";
 var Setting = function Setting(props) {
   var gridKey = props.gridKey,
     gridApi = props.gridApi,

package/dist/esm/array-table/columnHelper.d.ts

@@ -0,0 +1,126 @@
+import { ColDef } from 'ag-grid-community';
+/**
+ * 列配置类型定义
+ */
+export interface ColumnConfig {
+    /** 列标题 */
+    headerName: string;
+    /** 数据字段 */
+    dataIndex: string;
+    /** 列宽度 */
+    width?: number;
+    /** 最小宽度 */
+    minWidth?: number;
+    /** 最大宽度 */
+    maxWidth?: number;
+    /** 是否可调整大小 */
+    resizable?: boolean;
+    /** 是否可排序 */
+    sortable?: boolean;
+    /** 是否可筛选 */
+    filter?: boolean | string;
+    /** 对齐方式 */
+    align?: 'left' | 'center' | 'right';
+    /** 是否固定列 */
+    pinned?: 'left' | 'right' | null;
+    /** 是否隐藏 */
+    hide?: boolean;
+    /** 是否省略显示 */
+    ellipsis?: boolean;
+    /** 是否可编辑 */
+    editable?: boolean;
+    /** 自定义 AG-Grid 配置 */
+    agGridProps?: Partial<ColDef>;
+}
+/**
+ * 文本列配置
+ * 用于显示和编辑文本内容
+ */
+export declare const createTextColumn: (config: ColumnConfig) => ColumnConfig;
+/**
+ * 数字列配置
+ * 用于显示和编辑数字内容
+ */
+export declare const createNumberColumn: (config: ColumnConfig) => ColumnConfig;
+/**
+ * 日期列配置
+ * 用于显示和编辑日期内容
+ */
+export declare const createDateColumn: (config: ColumnConfig) => ColumnConfig;
+/**
+ * 选择列配置
+ * 用于下拉选择类型的列
+ */
+export declare const createSelectColumn: (config: ColumnConfig) => ColumnConfig;
+/**
+ * 操作列配置
+ * 用于行操作按钮列
+ */
+export declare const createOperationColumn: (config: Omit<ColumnConfig, 'dataIndex'>) => ColumnConfig;
+/**
+ * 序号列配置
+ * 用于显示行序号
+ */
+export declare const createIndexColumn: (config?: Partial<ColumnConfig>) => ColumnConfig;
+/**
+ * 只读列配置
+ * 用于显示不可编辑的内容
+ */
+export declare const createReadOnlyColumn: (config: ColumnConfig) => ColumnConfig;
+/**
+ * 固定左侧列配置
+ */
+export declare const createPinnedLeftColumn: (config: ColumnConfig) => ColumnConfig;
+/**
+ * 固定右侧列配置
+ */
+export declare const createPinnedRightColumn: (config: ColumnConfig) => ColumnConfig;
+/**
+ * 百分比列配置
+ * 用于显示百分比数值
+ */
+export declare const createPercentColumn: (config: ColumnConfig) => ColumnConfig;
+/**
+ * 货币列配置
+ * 用于显示货币金额
+ */
+export declare const createCurrencyColumn: (config: ColumnConfig) => ColumnConfig;
+/**
+ * 批量创建列配置
+ * @param columns 列配置数组
+ * @returns 标准化的列配置数组
+ */
+export declare const createColumns: (columns: ColumnConfig[]) => ColumnConfig[];
+/**
+ * 列配置预设
+ */
+export declare const ColumnPresets: {
+    /** 文本列 */
+    text: (config: ColumnConfig) => ColumnConfig;
+    /** 数字列 */
+    number: (config: ColumnConfig) => ColumnConfig;
+    /** 日期列 */
+    date: (config: ColumnConfig) => ColumnConfig;
+    /** 选择列 */
+    select: (config: ColumnConfig) => ColumnConfig;
+    /** 操作列 */
+    operation: (config: Omit<ColumnConfig, 'dataIndex'>) => ColumnConfig;
+    /** 序号列 */
+    index: (config?: Partial<ColumnConfig>) => ColumnConfig;
+    /** 只读列 */
+    readOnly: (config: ColumnConfig) => ColumnConfig;
+    /** 固定左侧列 */
+    pinnedLeft: (config: ColumnConfig) => ColumnConfig;
+    /** 固定右侧列 */
+    pinnedRightColumn: (config: ColumnConfig) => ColumnConfig;
+    /** 百分比列 */
+    percent: (config: ColumnConfig) => ColumnConfig;
+    /** 货币列 */
+    currency: (config: ColumnConfig) => ColumnConfig;
+};
+/**
+ * 转换为 AG-Grid 列定义
+ * @param config 列配置
+ * @returns AG-Grid ColDef
+ */
+export declare const toAgGridColDef: (config: ColumnConfig) => Partial<ColDef>;

package/dist/esm/array-table/columnHelper.js

@@ -0,0 +1,235 @@
+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(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); }
+/**
+ * 列配置类型定义
+ */
+
+/**
+ * 文本列配置
+ * 用于显示和编辑文本内容
+ */
+export var createTextColumn = function createTextColumn(config) {
+  return _objectSpread({
+    resizable: true,
+    sortable: true,
+    filter: 'agTextColumnFilter',
+    align: 'left',
+    editable: true,
+    ellipsis: true
+  }, config);
+};
+
+/**
+ * 数字列配置
+ * 用于显示和编辑数字内容
+ */
+export var createNumberColumn = function createNumberColumn(config) {
+  return _objectSpread({
+    resizable: true,
+    sortable: true,
+    filter: 'agNumberColumnFilter',
+    align: 'right',
+    editable: true
+  }, config);
+};
+
+/**
+ * 日期列配置
+ * 用于显示和编辑日期内容
+ */
+export var createDateColumn = function createDateColumn(config) {
+  return _objectSpread({
+    resizable: true,
+    sortable: true,
+    filter: 'agDateColumnFilter',
+    align: 'center',
+    editable: true
+  }, config);
+};
+
+/**
+ * 选择列配置
+ * 用于下拉选择类型的列
+ */
+export var createSelectColumn = function createSelectColumn(config) {
+  return _objectSpread({
+    resizable: true,
+    sortable: true,
+    filter: 'agSetColumnFilter',
+    align: 'left',
+    editable: true
+  }, config);
+};
+
+/**
+ * 操作列配置
+ * 用于行操作按钮列
+ */
+export var createOperationColumn = function createOperationColumn(config) {
+  return _objectSpread({
+    dataIndex: 'operations',
+    resizable: false,
+    sortable: false,
+    filter: false,
+    pinned: 'right',
+    width: 120,
+    align: 'center'
+  }, config);
+};
+
+/**
+ * 序号列配置
+ * 用于显示行序号
+ */
+export var createIndexColumn = function createIndexColumn(config) {
+  return _objectSpread({
+    headerName: '序号',
+    dataIndex: 'index',
+    width: 80,
+    resizable: false,
+    sortable: false,
+    filter: false,
+    align: 'center',
+    pinned: 'left'
+  }, config);
+};
+
+/**
+ * 只读列配置
+ * 用于显示不可编辑的内容
+ */
+export var createReadOnlyColumn = function createReadOnlyColumn(config) {
+  return _objectSpread({
+    resizable: true,
+    sortable: true,
+    editable: false
+  }, config);
+};
+
+/**
+ * 固定左侧列配置
+ */
+export var createPinnedLeftColumn = function createPinnedLeftColumn(config) {
+  return _objectSpread(_objectSpread({}, config), {}, {
+    pinned: 'left'
+  });
+};
+
+/**
+ * 固定右侧列配置
+ */
+export var createPinnedRightColumn = function createPinnedRightColumn(config) {
+  return _objectSpread(_objectSpread({}, config), {}, {
+    pinned: 'right'
+  });
+};
+
+/**
+ * 百分比列配置
+ * 用于显示百分比数值
+ */
+export var createPercentColumn = function createPercentColumn(config) {
+  return _objectSpread({
+    resizable: true,
+    sortable: true,
+    filter: 'agNumberColumnFilter',
+    align: 'right',
+    editable: true
+  }, config);
+};
+
+/**
+ * 货币列配置
+ * 用于显示货币金额
+ */
+export var createCurrencyColumn = function createCurrencyColumn(config) {
+  return _objectSpread({
+    resizable: true,
+    sortable: true,
+    filter: 'agNumberColumnFilter',
+    align: 'right',
+    editable: true
+  }, config);
+};
+
+/**
+ * 批量创建列配置
+ * @param columns 列配置数组
+ * @returns 标准化的列配置数组
+ */
+export var createColumns = function createColumns(columns) {
+  return columns.map(function (col) {
+    return _objectSpread({
+      resizable: true,
+      sortable: false,
+      align: 'left'
+    }, col);
+  });
+};
+
+/**
+ * 列配置预设
+ */
+export var ColumnPresets = {
+  /** 文本列 */
+  text: createTextColumn,
+  /** 数字列 */
+  number: createNumberColumn,
+  /** 日期列 */
+  date: createDateColumn,
+  /** 选择列 */
+  select: createSelectColumn,
+  /** 操作列 */
+  operation: createOperationColumn,
+  /** 序号列 */
+  index: createIndexColumn,
+  /** 只读列 */
+  readOnly: createReadOnlyColumn,
+  /** 固定左侧列 */
+  pinnedLeft: createPinnedLeftColumn,
+  /** 固定右侧列 */
+  pinnedRightColumn: createPinnedRightColumn,
+  /** 百分比列 */
+  percent: createPercentColumn,
+  /** 货币列 */
+  currency: createCurrencyColumn
+};
+
+/**
+ * 转换为 AG-Grid 列定义
+ * @param config 列配置
+ * @returns AG-Grid ColDef
+ */
+export var toAgGridColDef = function toAgGridColDef(config) {
+  var headerName = config.headerName,
+    dataIndex = config.dataIndex,
+    width = config.width,
+    minWidth = config.minWidth,
+    maxWidth = config.maxWidth,
+    resizable = config.resizable,
+    sortable = config.sortable,
+    filter = config.filter,
+    align = config.align,
+    pinned = config.pinned,
+    hide = config.hide,
+    editable = config.editable,
+    agGridProps = config.agGridProps;
+  return _objectSpread({
+    headerName: headerName,
+    field: dataIndex,
+    width: width,
+    minWidth: minWidth,
+    maxWidth: maxWidth,
+    resizable: resizable,
+    sortable: sortable,
+    filter: filter,
+    cellClass: align ? "ag-cell-".concat(align) : undefined,
+    pinned: pinned || undefined,
+    hide: hide,
+    editable: editable
+  }, agGridProps);
+};

package/dist/esm/array-table/hooks.d.ts

@@ -0,0 +1,23 @@
+import { RefObject } from 'react';
+import { ArrayField } from '@formily/core';
+/**
+ * 单元格聚焦 Hook
+ * 处理 Editable 包装和普通输入框的聚焦逻辑
+ */
+export declare const useCellFocus: () => {
+    focusInputInCell: (cell: Element) => void;
+};
+/**
+ * 键盘导航 Hook
+ * 处理方向键在表格单元格间的导航
+ */
+export declare const useKeyboardNavigation: (ref: RefObject<any>, dataSource: any[], focusInputInCell: (cell: Element) => void) => {
+    handleCellKeyDown: (event: any) => void;
+};
+/**
+ * 行拖拽 Hook
+ * 处理行拖拽排序逻辑
+ */
+export declare const useRowDrag: (field: ArrayField) => {
+    handleRowDragMove: (event: any) => void;
+};