@nokecy/qc-ui 1.1.3 → 1.1.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/ag-grid-plus/ag-gridPlus.js +9 -6
- package/dist/cjs/ag-grid-plus/setting/ColumnConfigTable.d.ts +4 -12
- package/dist/cjs/ag-grid-plus/setting/ColumnConfigTable.js +607 -869
- package/dist/cjs/ag-grid-plus/setting/ColumnSetting.js +6 -1
- package/dist/cjs/ag-grid-plus/setting/DebounceInputs.d.ts +39 -0
- package/dist/cjs/ag-grid-plus/setting/DebounceInputs.js +144 -0
- package/dist/cjs/ag-grid-plus/setting/QuerySchemeManager.js +370 -302
- package/dist/cjs/ag-grid-plus/setting/columnGroupTypes.d.ts +4 -0
- package/dist/cjs/ag-grid-plus/setting/index.js +1 -1
- package/dist/cjs/ag-grid-plus/setting/performanceMonitor.d.ts +9 -0
- package/dist/cjs/ag-grid-plus/setting/performanceMonitor.js +48 -0
- package/dist/cjs/ag-grid-plus/shared/storage/backendApiAdapter.js +8 -24
- package/dist/cjs/ag-grid-plus/shared/storage/schemeStorageAdapter.d.ts +20 -6
- package/dist/cjs/ag-grid-plus/shared/utils/schemeDataMigration.d.ts +27 -0
- package/dist/cjs/ag-grid-plus/shared/utils/schemeDataMigration.js +63 -0
- package/dist/esm/ag-grid-plus/ag-gridPlus.js +9 -6
- package/dist/esm/ag-grid-plus/setting/ColumnConfigTable.d.ts +4 -12
- package/dist/esm/ag-grid-plus/setting/ColumnConfigTable.js +611 -872
- package/dist/esm/ag-grid-plus/setting/ColumnSetting.js +6 -1
- package/dist/esm/ag-grid-plus/setting/DebounceInputs.d.ts +39 -0
- package/dist/esm/ag-grid-plus/setting/DebounceInputs.js +136 -0
- package/dist/esm/ag-grid-plus/setting/QuerySchemeManager.js +374 -305
- package/dist/esm/ag-grid-plus/setting/columnGroupTypes.d.ts +4 -0
- package/dist/esm/ag-grid-plus/setting/index.js +1 -1
- package/dist/esm/ag-grid-plus/setting/performanceMonitor.d.ts +9 -0
- package/dist/esm/ag-grid-plus/setting/performanceMonitor.js +42 -0
- package/dist/esm/ag-grid-plus/shared/storage/backendApiAdapter.js +8 -24
- package/dist/esm/ag-grid-plus/shared/storage/schemeStorageAdapter.d.ts +20 -6
- package/dist/esm/ag-grid-plus/shared/utils/schemeDataMigration.d.ts +27 -0
- package/dist/esm/ag-grid-plus/shared/utils/schemeDataMigration.js +54 -0
- package/dist/umd/qc-ui.min.js +1 -1
- package/package.json +1 -1
|
@@ -35,6 +35,10 @@ export interface FlatColumnItem {
|
|
|
35
35
|
cellClass?: string;
|
|
36
36
|
/** 是否占满剩余空间 */
|
|
37
37
|
flex?: number;
|
|
38
|
+
/** 是否可排序 */
|
|
39
|
+
sortable?: boolean;
|
|
40
|
+
/** 是否可过滤 */
|
|
41
|
+
filter?: boolean | string;
|
|
38
42
|
/** 是否显示列过滤按钮 */
|
|
39
43
|
suppressHeaderFilterButton?: boolean;
|
|
40
44
|
/** 是否新添加的节点(用于高亮显示) */
|
|
@@ -71,7 +71,7 @@ var Setting = function Setting(props) {
|
|
|
71
71
|
onClick: function onClick(e) {
|
|
72
72
|
return e.preventDefault();
|
|
73
73
|
}
|
|
74
|
-
}, /*#__PURE__*/_react.default.createElement(_icons.SettingOutlined, null))), gridApi && /*#__PURE__*/_react.default.createElement(_ColumnSetting.default, {
|
|
74
|
+
}, /*#__PURE__*/_react.default.createElement(_icons.SettingOutlined, null))), gridApi && columnSettingVisible && /*#__PURE__*/_react.default.createElement(_ColumnSetting.default, {
|
|
75
75
|
gridKey: gridKey,
|
|
76
76
|
gridApi: gridApi,
|
|
77
77
|
visible: columnSettingVisible,
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useRenderCounter = exports.measureRenderTime = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
9
|
+
/**
|
|
10
|
+
* 性能监控工具
|
|
11
|
+
* 用于开发和生产环境的渲染性能监控
|
|
12
|
+
*/
|
|
13
|
+
|
|
14
|
+
var measureRenderTime = exports.measureRenderTime = function measureRenderTime(componentName) {
|
|
15
|
+
if (typeof performance === 'undefined') {
|
|
16
|
+
return function () {};
|
|
17
|
+
}
|
|
18
|
+
var startTime = performance.now();
|
|
19
|
+
return function () {
|
|
20
|
+
var duration = performance.now() - startTime;
|
|
21
|
+
|
|
22
|
+
// 开发环境输出警告
|
|
23
|
+
if (process.env.NODE_ENV === 'development' && duration > 100) {
|
|
24
|
+
console.warn("[Performance] ".concat(componentName, " render took ").concat(duration.toFixed(2), "ms"));
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
// 生产环境发送到监控系统 (可选)
|
|
28
|
+
if (process.env.NODE_ENV === 'production' && window.gtag) {
|
|
29
|
+
window.gtag('event', 'component_render', {
|
|
30
|
+
component: componentName,
|
|
31
|
+
duration: Math.round(duration),
|
|
32
|
+
timestamp: Date.now()
|
|
33
|
+
});
|
|
34
|
+
}
|
|
35
|
+
};
|
|
36
|
+
};
|
|
37
|
+
|
|
38
|
+
/**
|
|
39
|
+
* 计数组件渲染次数
|
|
40
|
+
*/
|
|
41
|
+
var useRenderCounter = exports.useRenderCounter = function useRenderCounter(componentName) {
|
|
42
|
+
var renderCount = _react.default.useRef(0);
|
|
43
|
+
_react.default.useEffect(function () {
|
|
44
|
+
renderCount.current += 1;
|
|
45
|
+
if (process.env.NODE_ENV === 'development') {}
|
|
46
|
+
});
|
|
47
|
+
return renderCount.current;
|
|
48
|
+
};
|
|
@@ -210,19 +210,13 @@ var BackendApiSchemeAdapter = exports.BackendApiSchemeAdapter = /*#__PURE__*/fun
|
|
|
210
210
|
});
|
|
211
211
|
}
|
|
212
212
|
|
|
213
|
-
//
|
|
213
|
+
// 将所有查询方案的 queryConfig 字段从字符串解析为对象
|
|
214
214
|
if (response.querySchemes) {
|
|
215
215
|
Object.keys(response.querySchemes).forEach(function (gridId) {
|
|
216
216
|
response.querySchemes[gridId] = response.querySchemes[gridId].map(function (scheme) {
|
|
217
217
|
var parsedScheme = _objectSpread({}, scheme);
|
|
218
|
-
if (typeof parsedScheme.
|
|
219
|
-
parsedScheme.
|
|
220
|
-
}
|
|
221
|
-
if (typeof parsedScheme.hiddenFields === 'string') {
|
|
222
|
-
parsedScheme.hiddenFields = JSON.parse(parsedScheme.hiddenFields);
|
|
223
|
-
}
|
|
224
|
-
if (typeof parsedScheme.formValues === 'string') {
|
|
225
|
-
parsedScheme.formValues = JSON.parse(parsedScheme.formValues);
|
|
218
|
+
if (typeof parsedScheme.queryConfig === 'string') {
|
|
219
|
+
parsedScheme.queryConfig = JSON.parse(parsedScheme.queryConfig);
|
|
226
220
|
}
|
|
227
221
|
return parsedScheme;
|
|
228
222
|
});
|
|
@@ -361,11 +355,9 @@ var BackendApiSchemeAdapter = exports.BackendApiSchemeAdapter = /*#__PURE__*/fun
|
|
|
361
355
|
_context5.prev = 0;
|
|
362
356
|
this.log("\u4FDD\u5B58\u67E5\u8BE2\u65B9\u6848: ".concat(gridId, " - ").concat(scheme.name));
|
|
363
357
|
|
|
364
|
-
//
|
|
358
|
+
// 将 queryConfig 对象字段转换为 JSON 字符串
|
|
365
359
|
schemeForBackend = _objectSpread(_objectSpread({}, scheme), {}, {
|
|
366
|
-
|
|
367
|
-
hiddenFields: scheme.hiddenFields ? JSON.stringify(scheme.hiddenFields) : undefined,
|
|
368
|
-
formValues: scheme.formValues ? JSON.stringify(scheme.formValues) : undefined
|
|
360
|
+
queryConfig: scheme.queryConfig ? JSON.stringify(scheme.queryConfig) : undefined
|
|
369
361
|
});
|
|
370
362
|
url = "".concat(this.config.apiBaseUrl, "/api/extra-object/table-scheme/save-query-scheme");
|
|
371
363
|
_context5.next = 6;
|
|
@@ -384,18 +376,10 @@ var BackendApiSchemeAdapter = exports.BackendApiSchemeAdapter = /*#__PURE__*/fun
|
|
|
384
376
|
}
|
|
385
377
|
throw new Error(response.message || '保存失败');
|
|
386
378
|
case 9:
|
|
387
|
-
//
|
|
379
|
+
// 将返回的 queryConfig 字符串字段解析为对象
|
|
388
380
|
savedScheme = response.scheme;
|
|
389
|
-
if (savedScheme) {
|
|
390
|
-
|
|
391
|
-
savedScheme.itemsOrder = JSON.parse(savedScheme.itemsOrder);
|
|
392
|
-
}
|
|
393
|
-
if (typeof savedScheme.hiddenFields === 'string') {
|
|
394
|
-
savedScheme.hiddenFields = JSON.parse(savedScheme.hiddenFields);
|
|
395
|
-
}
|
|
396
|
-
if (typeof savedScheme.formValues === 'string') {
|
|
397
|
-
savedScheme.formValues = JSON.parse(savedScheme.formValues);
|
|
398
|
-
}
|
|
381
|
+
if (savedScheme && typeof savedScheme.queryConfig === 'string') {
|
|
382
|
+
savedScheme.queryConfig = JSON.parse(savedScheme.queryConfig);
|
|
399
383
|
}
|
|
400
384
|
this.log('保存成功', savedScheme);
|
|
401
385
|
return _context5.abrupt("return", savedScheme);
|
|
@@ -1,4 +1,22 @@
|
|
|
1
1
|
import type { FlatColumnItem } from '../../setting/columnGroupTypes';
|
|
2
|
+
/**
|
|
3
|
+
* 查询项配置
|
|
4
|
+
*/
|
|
5
|
+
export interface QueryItem {
|
|
6
|
+
/** 字段名 */
|
|
7
|
+
field: string;
|
|
8
|
+
/** 是否隐藏 */
|
|
9
|
+
hidden?: boolean;
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* 查询配置结构
|
|
13
|
+
*/
|
|
14
|
+
export interface QueryConfig {
|
|
15
|
+
/** 查询项配置列表 (按顺序排列) */
|
|
16
|
+
items: QueryItem[];
|
|
17
|
+
/** 查询表单默认值 */
|
|
18
|
+
defaultValues?: Record<string, any>;
|
|
19
|
+
}
|
|
2
20
|
/**
|
|
3
21
|
* 查询方案
|
|
4
22
|
*/
|
|
@@ -9,12 +27,8 @@ export interface QueryScheme {
|
|
|
9
27
|
name: string;
|
|
10
28
|
/** 方案描述 */
|
|
11
29
|
description?: string;
|
|
12
|
-
/**
|
|
13
|
-
|
|
14
|
-
/** 隐藏的字段列表 */
|
|
15
|
-
hiddenFields?: string[];
|
|
16
|
-
/** 查询表单值 */
|
|
17
|
-
formValues?: Record<string, any>;
|
|
30
|
+
/** 查询配置 */
|
|
31
|
+
queryConfig: QueryConfig;
|
|
18
32
|
/** 是否为默认方案 */
|
|
19
33
|
isDefault: boolean;
|
|
20
34
|
/** 是否为系统方案(不可删除) */
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import type { QueryScheme, QueryConfig } from '../storage/schemeStorageAdapter';
|
|
2
|
+
/**
|
|
3
|
+
* 从查询方案提取字段顺序数组
|
|
4
|
+
* @param scheme 查询方案对象
|
|
5
|
+
* @returns 字段顺序数组
|
|
6
|
+
*/
|
|
7
|
+
export declare function extractItemsOrder(scheme: QueryScheme): string[];
|
|
8
|
+
/**
|
|
9
|
+
* 从查询方案提取隐藏字段数组
|
|
10
|
+
* @param scheme 查询方案对象
|
|
11
|
+
* @returns 隐藏字段数组
|
|
12
|
+
*/
|
|
13
|
+
export declare function extractHiddenFields(scheme: QueryScheme): string[];
|
|
14
|
+
/**
|
|
15
|
+
* 从查询方案提取表单默认值
|
|
16
|
+
* @param scheme 查询方案对象
|
|
17
|
+
* @returns 表单默认值对象
|
|
18
|
+
*/
|
|
19
|
+
export declare function extractFormValues(scheme: QueryScheme): Record<string, any>;
|
|
20
|
+
/**
|
|
21
|
+
* 构建 QueryConfig 对象
|
|
22
|
+
* @param itemsOrder 字段顺序数组
|
|
23
|
+
* @param hiddenFields 隐藏字段数组
|
|
24
|
+
* @param formValues 表单默认值
|
|
25
|
+
* @returns QueryConfig 对象
|
|
26
|
+
*/
|
|
27
|
+
export declare function buildQueryConfig(itemsOrder: string[], hiddenFields?: string[], formValues?: Record<string, any>): QueryConfig;
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.buildQueryConfig = buildQueryConfig;
|
|
7
|
+
exports.extractFormValues = extractFormValues;
|
|
8
|
+
exports.extractHiddenFields = extractHiddenFields;
|
|
9
|
+
exports.extractItemsOrder = extractItemsOrder;
|
|
10
|
+
/**
|
|
11
|
+
* 从查询方案提取字段顺序数组
|
|
12
|
+
* @param scheme 查询方案对象
|
|
13
|
+
* @returns 字段顺序数组
|
|
14
|
+
*/
|
|
15
|
+
function extractItemsOrder(scheme) {
|
|
16
|
+
return scheme.queryConfig.items.map(function (item) {
|
|
17
|
+
return item.field;
|
|
18
|
+
});
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
/**
|
|
22
|
+
* 从查询方案提取隐藏字段数组
|
|
23
|
+
* @param scheme 查询方案对象
|
|
24
|
+
* @returns 隐藏字段数组
|
|
25
|
+
*/
|
|
26
|
+
function extractHiddenFields(scheme) {
|
|
27
|
+
return scheme.queryConfig.items.filter(function (item) {
|
|
28
|
+
return item.hidden;
|
|
29
|
+
}).map(function (item) {
|
|
30
|
+
return item.field;
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
/**
|
|
35
|
+
* 从查询方案提取表单默认值
|
|
36
|
+
* @param scheme 查询方案对象
|
|
37
|
+
* @returns 表单默认值对象
|
|
38
|
+
*/
|
|
39
|
+
function extractFormValues(scheme) {
|
|
40
|
+
return scheme.queryConfig.defaultValues || {};
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
/**
|
|
44
|
+
* 构建 QueryConfig 对象
|
|
45
|
+
* @param itemsOrder 字段顺序数组
|
|
46
|
+
* @param hiddenFields 隐藏字段数组
|
|
47
|
+
* @param formValues 表单默认值
|
|
48
|
+
* @returns QueryConfig 对象
|
|
49
|
+
*/
|
|
50
|
+
function buildQueryConfig(itemsOrder) {
|
|
51
|
+
var hiddenFields = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
|
|
52
|
+
var formValues = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
|
|
53
|
+
var items = itemsOrder.map(function (field) {
|
|
54
|
+
return {
|
|
55
|
+
field: field,
|
|
56
|
+
hidden: hiddenFields.includes(field)
|
|
57
|
+
};
|
|
58
|
+
});
|
|
59
|
+
return {
|
|
60
|
+
items: items,
|
|
61
|
+
defaultValues: Object.keys(formValues).length > 0 ? formValues : undefined
|
|
62
|
+
};
|
|
63
|
+
}
|
|
@@ -48,6 +48,7 @@ import { localeText } from "./locale";
|
|
|
48
48
|
import { GridPlusContext } from "./context/gridContext";
|
|
49
49
|
import { useGridSchemes } from "./context/useSchemeManager";
|
|
50
50
|
import { useSchemeDataFlow } from "./context/useSchemeDataFlow";
|
|
51
|
+
import { extractItemsOrder, extractHiddenFields } from "./shared/utils/schemeDataMigration";
|
|
51
52
|
import { createSafeHtmlTemplate } from "./utils/sanitize";
|
|
52
53
|
import { GridPlusError, ErrorType, ErrorSeverity } from "./errors";
|
|
53
54
|
import { logger } from "./utils/logger";
|
|
@@ -1055,7 +1056,8 @@ function AgGridPlus(props) {
|
|
|
1055
1056
|
|
|
1056
1057
|
// 使用顺序管理器处理排序
|
|
1057
1058
|
var orderedFormItems = useMemo(function () {
|
|
1058
|
-
|
|
1059
|
+
// 从查询方案提取字段顺序
|
|
1060
|
+
var itemsOrder = currentQueryScheme ? extractItemsOrder(currentQueryScheme) : queryItemsOrder;
|
|
1059
1061
|
if (!itemsOrder || itemsOrder.length === 0) {
|
|
1060
1062
|
return queryFormItems;
|
|
1061
1063
|
}
|
|
@@ -1070,18 +1072,19 @@ function AgGridPlus(props) {
|
|
|
1070
1072
|
return indexA - indexB;
|
|
1071
1073
|
});
|
|
1072
1074
|
return ordered;
|
|
1073
|
-
}, [queryFormItems, currentQueryScheme
|
|
1075
|
+
}, [queryFormItems, currentQueryScheme, queryItemsOrder]);
|
|
1074
1076
|
|
|
1075
1077
|
// 根据方案的隐藏字段过滤表单项
|
|
1076
1078
|
var visibleFormItems = useMemo(function () {
|
|
1077
|
-
|
|
1079
|
+
// 从查询方案提取隐藏字段
|
|
1080
|
+
var hiddenFields = currentQueryScheme ? extractHiddenFields(currentQueryScheme) : [];
|
|
1078
1081
|
if (hiddenFields.length === 0) {
|
|
1079
1082
|
return orderedFormItems;
|
|
1080
1083
|
}
|
|
1081
1084
|
return orderedFormItems.filter(function (item) {
|
|
1082
1085
|
return !hiddenFields.includes(item.field);
|
|
1083
1086
|
});
|
|
1084
|
-
}, [orderedFormItems, currentQueryScheme
|
|
1087
|
+
}, [orderedFormItems, currentQueryScheme]);
|
|
1085
1088
|
useEffect(function () {
|
|
1086
1089
|
calculateSum();
|
|
1087
1090
|
}, [calculateSum]);
|
|
@@ -1111,7 +1114,7 @@ function AgGridPlus(props) {
|
|
|
1111
1114
|
applyToGlobal: applyToGlobal,
|
|
1112
1115
|
resetCurrent: resetCurrent,
|
|
1113
1116
|
resetAll: resetAll,
|
|
1114
|
-
currentQueryOrder:
|
|
1117
|
+
currentQueryOrder: currentQueryScheme ? extractItemsOrder(currentQueryScheme) : queryItemsOrder,
|
|
1115
1118
|
updateQueryOrder: setQueryItemsOrder,
|
|
1116
1119
|
queryFormItems: queryFormItems,
|
|
1117
1120
|
// ========== 方案管理 API(透传给子组件) ==========
|
|
@@ -1133,7 +1136,7 @@ function AgGridPlus(props) {
|
|
|
1133
1136
|
};
|
|
1134
1137
|
}, [extensibleColumns, gridPlusColumnState, allColDefsRef.current,
|
|
1135
1138
|
// 【修复】添加到依赖数组
|
|
1136
|
-
onSaveColumnState, applyToGlobal, resetCurrent, resetAll, currentQueryScheme
|
|
1139
|
+
onSaveColumnState, applyToGlobal, resetCurrent, resetAll, currentQueryScheme, queryItemsOrder, queryFormItems,
|
|
1137
1140
|
// 方案管理依赖
|
|
1138
1141
|
columnSchemes, querySchemes, currentSchemes, schemesLoading, lastSyncTime, saveColumnScheme, deleteColumnScheme, saveQueryScheme, deleteQueryScheme, setCurrentColumnScheme, setCurrentQueryScheme, refreshSchemes, getColumnSchemes, getQuerySchemes, getCurrentScheme]);
|
|
1139
1142
|
return /*#__PURE__*/React.createElement(GridPlusContext.Provider, {
|
|
@@ -1,22 +1,14 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* 列配置表格组件
|
|
3
|
-
*
|
|
4
|
-
* 通过 React useState 直接管理数据状态,确保 type 字段不会丢失
|
|
2
|
+
* 列配置表格组件 - AG-Grid 版本
|
|
3
|
+
* 使用 AG-Grid 替代 Ant Design Table,性能更优
|
|
5
4
|
*/
|
|
6
5
|
import React from 'react';
|
|
7
6
|
import type { FlatColumnItem } from './columnGroupTypes';
|
|
8
|
-
interface
|
|
9
|
-
/** 扁平化的列配置数据 */
|
|
7
|
+
interface ColumnConfigTableAGProps {
|
|
10
8
|
items: FlatColumnItem[];
|
|
11
|
-
/** 数据变更回调 */
|
|
12
9
|
onChange: (items: FlatColumnItem[]) => void;
|
|
13
|
-
/** 简化模式 - 隐藏分组相关功能 (用于 formArrayTable) */
|
|
14
10
|
simple?: boolean;
|
|
15
|
-
/** 表格滚动高度 */
|
|
16
11
|
scrollY?: number;
|
|
17
12
|
}
|
|
18
|
-
|
|
19
|
-
* 列配置表格组件
|
|
20
|
-
*/
|
|
21
|
-
declare const ColumnConfigTable: React.FC<ColumnConfigTableProps>;
|
|
13
|
+
declare const ColumnConfigTable: React.FC<ColumnConfigTableAGProps>;
|
|
22
14
|
export default ColumnConfigTable;
|