aldehyde 0.2.479 → 0.2.480
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/lib/controls/2dEditor/components/card.js +2 -2
- package/lib/controls/2dEditor/components/card.js.map +1 -1
- package/lib/controls/entity-select/entity-select.js +3 -3
- package/lib/controls/entity-select/entity-select.js.map +1 -1
- package/lib/draw-canvas-edit/components/asset-bar/index.d.ts +1 -0
- package/lib/draw-canvas-edit/components/asset-bar/index.d.ts.map +1 -1
- package/lib/draw-canvas-edit/components/asset-bar/index.js +8 -6
- package/lib/draw-canvas-edit/components/asset-bar/index.js.map +1 -1
- package/lib/draw-canvas-edit/components/main-header/index.less +3 -0
- package/lib/draw-canvas-edit/components/render/draws/bg-draw.d.ts.map +1 -1
- package/lib/draw-canvas-edit/components/render/draws/bg-draw.js +14 -1
- package/lib/draw-canvas-edit/components/render/draws/bg-draw.js.map +1 -1
- package/lib/draw-canvas-edit/components/render/draws/contextmenu-draw.d.ts.map +1 -1
- package/lib/draw-canvas-edit/components/render/draws/contextmenu-draw.js +30 -6
- package/lib/draw-canvas-edit/components/render/draws/contextmenu-draw.js.map +1 -1
- package/lib/draw-canvas-edit/components/render/graphs/bezier.js +3 -3
- package/lib/draw-canvas-edit/components/render/graphs/bezier.js.map +1 -1
- package/lib/draw-canvas-edit/components/render/graphs/circle.js +2 -2
- package/lib/draw-canvas-edit/components/render/graphs/circle.js.map +1 -1
- package/lib/draw-canvas-edit/components/render/graphs/curve.js +3 -3
- package/lib/draw-canvas-edit/components/render/graphs/curve.js.map +1 -1
- package/lib/draw-canvas-edit/components/render/graphs/line.js +3 -3
- package/lib/draw-canvas-edit/components/render/graphs/line.js.map +1 -1
- package/lib/draw-canvas-edit/components/render/graphs/rect.js +2 -2
- package/lib/draw-canvas-edit/components/render/graphs/rect.js.map +1 -1
- package/lib/draw-canvas-edit/components/render/handlers/drag-outside-handlers.d.ts +1 -1
- package/lib/draw-canvas-edit/components/render/handlers/drag-outside-handlers.d.ts.map +1 -1
- package/lib/draw-canvas-edit/components/render/handlers/drag-outside-handlers.js +58 -122
- package/lib/draw-canvas-edit/components/render/handlers/drag-outside-handlers.js.map +1 -1
- package/lib/draw-canvas-edit/components/render/handlers/graph-handlers.d.ts.map +1 -1
- package/lib/draw-canvas-edit/components/render/handlers/graph-handlers.js +2 -1
- package/lib/draw-canvas-edit/components/render/handlers/graph-handlers.js.map +1 -1
- package/lib/draw-canvas-edit/components/render/handlers/selection-handlers.d.ts.map +1 -1
- package/lib/draw-canvas-edit/components/render/handlers/selection-handlers.js +11 -4
- package/lib/draw-canvas-edit/components/render/handlers/selection-handlers.js.map +1 -1
- package/lib/draw-canvas-edit/components/render/index.d.ts +3 -1
- package/lib/draw-canvas-edit/components/render/index.d.ts.map +1 -1
- package/lib/draw-canvas-edit/components/render/index.js +37 -26
- package/lib/draw-canvas-edit/components/render/index.js.map +1 -1
- package/lib/draw-canvas-edit/components/render/tools/attract-tool.d.ts +2 -1
- package/lib/draw-canvas-edit/components/render/tools/attract-tool.d.ts.map +1 -1
- package/lib/draw-canvas-edit/components/render/tools/attract-tool.js +33 -8
- package/lib/draw-canvas-edit/components/render/tools/attract-tool.js.map +1 -1
- package/lib/draw-canvas-edit/components/render/tools/component-factory.d.ts +62 -0
- package/lib/draw-canvas-edit/components/render/tools/component-factory.d.ts.map +1 -0
- package/lib/draw-canvas-edit/components/render/tools/component-factory.js +289 -0
- package/lib/draw-canvas-edit/components/render/tools/component-factory.js.map +1 -0
- package/lib/draw-canvas-edit/components/render/tools/copy-tool.d.ts +0 -2
- package/lib/draw-canvas-edit/components/render/tools/copy-tool.d.ts.map +1 -1
- package/lib/draw-canvas-edit/components/render/tools/copy-tool.js +23 -45
- package/lib/draw-canvas-edit/components/render/tools/copy-tool.js.map +1 -1
- package/lib/draw-canvas-edit/components/render/tools/import-export-tool.d.ts.map +1 -1
- package/lib/draw-canvas-edit/components/render/tools/import-export-tool.js +20 -41
- package/lib/draw-canvas-edit/components/render/tools/import-export-tool.js.map +1 -1
- package/lib/draw-canvas-edit/components/render/tools/index.d.ts +1 -0
- package/lib/draw-canvas-edit/components/render/tools/index.d.ts.map +1 -1
- package/lib/draw-canvas-edit/components/render/tools/index.js +1 -0
- package/lib/draw-canvas-edit/components/render/tools/index.js.map +1 -1
- package/lib/draw-canvas-edit/components/render/tools/selection-tool.d.ts.map +1 -1
- package/lib/draw-canvas-edit/components/render/tools/selection-tool.js +32 -19
- package/lib/draw-canvas-edit/components/render/tools/selection-tool.js.map +1 -1
- package/lib/draw-canvas-edit/components/render/types.d.ts +8 -6
- package/lib/draw-canvas-edit/components/render/types.d.ts.map +1 -1
- package/lib/draw-canvas-edit/components/render/types.js.map +1 -1
- package/lib/draw-canvas-edit/components/setting-form/imag-upload.d.ts.map +1 -1
- package/lib/draw-canvas-edit/components/setting-form/imag-upload.js +2 -2
- package/lib/draw-canvas-edit/components/setting-form/imag-upload.js.map +1 -1
- package/lib/draw-canvas-edit/components/setting-form/index.d.ts.map +1 -1
- package/lib/draw-canvas-edit/components/setting-form/index.js +3 -5
- package/lib/draw-canvas-edit/components/setting-form/index.js.map +1 -1
- package/lib/draw-canvas-edit/index.d.ts.map +1 -1
- package/lib/draw-canvas-edit/index.js +4 -1
- package/lib/draw-canvas-edit/index.js.map +1 -1
- package/lib/draw-canvas-view/index.d.ts.map +1 -1
- package/lib/draw-canvas-view/index.js +4 -2
- package/lib/draw-canvas-view/index.js.map +1 -1
- package/lib/draw-canvas-view/view.d.ts +2 -0
- package/lib/draw-canvas-view/view.d.ts.map +1 -1
- package/lib/draw-canvas-view/view.js +46 -35
- package/lib/draw-canvas-view/view.js.map +1 -1
- package/lib/form/criteria-form.js +17 -17
- package/lib/form/criteria-form.js.map +1 -1
- package/lib/form/dtmpl-form.d.ts.map +1 -1
- package/lib/form/dtmpl-form.js +9 -0
- package/lib/form/dtmpl-form.js.map +1 -1
- package/lib/form/form-Item-group.js +2 -2
- package/lib/form/form-Item-group.js.map +1 -1
- package/lib/module/dtmpl-edit-card.js +4 -4
- package/lib/module/dtmpl-edit-card.js.map +1 -1
- package/lib/module/dtmpl-edit-page.d.ts.map +1 -1
- package/lib/module/dtmpl-edit-page.js +7 -4
- package/lib/module/dtmpl-edit-page.js.map +1 -1
- package/lib/table/act-table.js +8 -8
- package/lib/table/act-table.js.map +1 -1
- package/lib/table/modal-select-table.d.ts +2 -2
- package/lib/table/modal-select-table.d.ts.map +1 -1
- package/lib/table/modal-select-table.js +10 -10
- package/lib/table/modal-select-table.js.map +1 -1
- package/lib/table/relation-table.d.ts +2 -2
- package/lib/table/relation-table.js +1 -1
- package/lib/table/relation-table.js.map +1 -1
- package/lib/table/select-table.js +2 -2
- package/lib/table/select-table.js.map +1 -1
- package/lib/tmpl/hc-data-source.js +2 -2
- package/lib/tmpl/hc-data-source.js.map +1 -1
- package/lib/tmpl/interface.d.ts +7 -7
- package/lib/tmpl/interface.d.ts.map +1 -1
- package/lib/tmpl/tmpl-config-analysis.d.ts.map +1 -1
- package/lib/tmpl/tmpl-config-analysis.js +23 -23
- package/lib/tmpl/tmpl-config-analysis.js.map +1 -1
- package/lib/units/index.js +3 -3
- package/lib/units/index.js.map +1 -1
- package/package.json +1 -1
- package/src/aldehyde/controls/2dEditor/components/card.tsx +2 -2
- package/src/aldehyde/controls/entity-select/entity-select.tsx +3 -3
- package/src/aldehyde/draw-canvas-edit/components/asset-bar/index.tsx +8 -6
- package/src/aldehyde/draw-canvas-edit/components/main-header/index.less +3 -0
- package/src/aldehyde/draw-canvas-edit/components/render/draws/bg-draw.ts +17 -1
- package/src/aldehyde/draw-canvas-edit/components/render/draws/contextmenu-draw.ts +30 -6
- package/src/aldehyde/draw-canvas-edit/components/render/graphs/bezier.ts +3 -3
- package/src/aldehyde/draw-canvas-edit/components/render/graphs/circle.ts +2 -2
- package/src/aldehyde/draw-canvas-edit/components/render/graphs/curve.ts +3 -3
- package/src/aldehyde/draw-canvas-edit/components/render/graphs/line.ts +3 -3
- package/src/aldehyde/draw-canvas-edit/components/render/graphs/rect.ts +2 -2
- package/src/aldehyde/draw-canvas-edit/components/render/handlers/drag-outside-handlers.ts +45 -130
- package/src/aldehyde/draw-canvas-edit/components/render/handlers/graph-handlers.ts +7 -1
- package/src/aldehyde/draw-canvas-edit/components/render/handlers/selection-handlers.ts +11 -5
- package/src/aldehyde/draw-canvas-edit/components/render/index.ts +38 -29
- package/src/aldehyde/draw-canvas-edit/components/render/tools/attract-tool.ts +30 -10
- package/src/aldehyde/draw-canvas-edit/components/render/tools/component-factory.ts +302 -0
- package/src/aldehyde/draw-canvas-edit/components/render/tools/copy-tool.ts +24 -46
- package/src/aldehyde/draw-canvas-edit/components/render/tools/import-export-tool.ts +22 -46
- package/src/aldehyde/draw-canvas-edit/components/render/tools/index.ts +1 -0
- package/src/aldehyde/draw-canvas-edit/components/render/tools/selection-tool.ts +34 -23
- package/src/aldehyde/draw-canvas-edit/components/render/types.ts +6 -6
- package/src/aldehyde/draw-canvas-edit/components/setting-form/imag-upload.tsx +2 -1
- package/src/aldehyde/draw-canvas-edit/components/setting-form/index.tsx +3 -5
- package/src/aldehyde/draw-canvas-edit/index.tsx +4 -1
- package/src/aldehyde/draw-canvas-view/index.tsx +3 -1
- package/src/aldehyde/draw-canvas-view/view.tsx +228 -212
- package/src/aldehyde/form/criteria-form.tsx +18 -18
- package/src/aldehyde/form/dtmpl-form.tsx +9 -0
- package/src/aldehyde/form/form-Item-group.tsx +2 -2
- package/src/aldehyde/module/dtmpl-edit-card.tsx +4 -4
- package/src/aldehyde/module/dtmpl-edit-page.tsx +7 -4
- package/src/aldehyde/table/act-table.tsx +8 -8
- package/src/aldehyde/table/modal-select-table.tsx +10 -10
- package/src/aldehyde/table/relation-table.tsx +1 -1
- package/src/aldehyde/table/select-table.tsx +2 -2
- package/src/aldehyde/tmpl/hc-data-source.tsx +2 -2
- package/src/aldehyde/tmpl/interface.tsx +7 -7
- package/src/aldehyde/tmpl/tmpl-config-analysis.tsx +23 -24
- package/src/aldehyde/units/index.tsx +3 -3
|
@@ -257,7 +257,9 @@ const Index = (props: Props) => {
|
|
|
257
257
|
// 表单数据实时回显更新
|
|
258
258
|
const formSetFieldsValue = () => {
|
|
259
259
|
const nodeId = assetCurrent?.getAttr("id");
|
|
260
|
-
|
|
260
|
+
// 表单回显,同类型组件默认清空值再赋值
|
|
261
|
+
const allKey = formConfigs.reduce((total, item) => ({ ...total, [item.id]: undefined }), {})
|
|
262
|
+
const temVal = _.cloneDeep({ ...allKey, ...formData });
|
|
261
263
|
Object.keys(temVal).forEach((key) => { // 使用公共表单组件,转换指定类型值
|
|
262
264
|
const extControlType = formConfigs.find((item: any) => item.id === key)?.extControlType;
|
|
263
265
|
if (["yes-no-switch"].includes(extControlType)) { // 处理是否转换boolean值
|
|
@@ -265,10 +267,6 @@ const Index = (props: Props) => {
|
|
|
265
267
|
return;
|
|
266
268
|
}
|
|
267
269
|
});
|
|
268
|
-
const dataSourceConfig = formConfigs.find((item: any) => item.id === "dataSource");
|
|
269
|
-
if (dataSourceConfig) { // 数据源-无配置设置默认值
|
|
270
|
-
temVal["dataSource"] = temVal["dataSource"] || dataSourceConfig.defValue;
|
|
271
|
-
}
|
|
272
270
|
form.setFieldsValue({ ...temVal, id: nodeId });
|
|
273
271
|
}
|
|
274
272
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { useEffect, useRef, useState, useCallback } from 'react';
|
|
2
2
|
import { gunzipSync, strFromU8 } from 'fflate';
|
|
3
|
-
import { Spin } from "antd";
|
|
3
|
+
import { Spin, theme } from "antd";
|
|
4
4
|
import { hexToUint8Array } from 'uint8array-extras';
|
|
5
5
|
import HcserviceV3 from "../tmpl/hcservice-v3";
|
|
6
6
|
import { Render } from './components/render';
|
|
@@ -32,6 +32,7 @@ const Index = (props: Props) => {
|
|
|
32
32
|
const [showAttract, setShowAttract] = useState<boolean>(true); // 是否显示磁吸
|
|
33
33
|
const assetCurrentRef = useRef<Konva.Node>(null); // 当前选中组件Ref
|
|
34
34
|
const [loading, setLoading] = useState<boolean>(false);
|
|
35
|
+
const { token: themeToken } = theme.useToken();
|
|
35
36
|
|
|
36
37
|
// 获取视图数据
|
|
37
38
|
const getViewData = async () => {
|
|
@@ -67,6 +68,7 @@ const Index = (props: Props) => {
|
|
|
67
68
|
showBg: true, showRuler: true, showRefLine: true,
|
|
68
69
|
showPreview: false, showContextmenu: true,
|
|
69
70
|
attractResize: true, attractBg: true, attractNode: true,
|
|
71
|
+
themeToken
|
|
70
72
|
});
|
|
71
73
|
renderRef.current = render;
|
|
72
74
|
// 初始化设置
|
|
@@ -107,6 +109,7 @@ const Index = (props: Props) => {
|
|
|
107
109
|
const { width, height } = boardRef.current.getBoundingClientRect();
|
|
108
110
|
if (renderRef.current) {
|
|
109
111
|
renderRef.current.resize(width, height);
|
|
112
|
+
renderRef.current.positionTool.positionFit();
|
|
110
113
|
} else {
|
|
111
114
|
initRender(width, height);
|
|
112
115
|
}
|
|
@@ -12,6 +12,7 @@ interface Props {
|
|
|
12
12
|
|
|
13
13
|
const Index = (props: Props) => {
|
|
14
14
|
const { recordCode } = props;
|
|
15
|
+
const [viewId, setViewId] = useState<string>();
|
|
15
16
|
const [jsonData, setJsonData] = useState("{}"); // 画面数据
|
|
16
17
|
const [loading, setLoading] = useState(false); // 加载状态
|
|
17
18
|
|
|
@@ -30,6 +31,7 @@ const Index = (props: Props) => {
|
|
|
30
31
|
const originalData = strFromU8(decompressedBuffer);
|
|
31
32
|
setLoading(false);
|
|
32
33
|
setJsonData(originalData);
|
|
34
|
+
setViewId(data?.[0]?.id);
|
|
33
35
|
}
|
|
34
36
|
|
|
35
37
|
useEffect(() => {
|
|
@@ -42,7 +44,7 @@ const Index = (props: Props) => {
|
|
|
42
44
|
return <div className="view-loading"><Spin /></div>;
|
|
43
45
|
}
|
|
44
46
|
|
|
45
|
-
return <Viewer data={jsonData} />;
|
|
47
|
+
return <Viewer data={jsonData} viewId={viewId} recordCode={recordCode} />;
|
|
46
48
|
};
|
|
47
49
|
|
|
48
50
|
export default Index;
|
|
@@ -1,212 +1,228 @@
|
|
|
1
|
-
import React, { useEffect, useRef, useCallback } from 'react';
|
|
2
|
-
import { Space, Button } from "antd";
|
|
3
|
-
import { ExpandOutlined } from '@ant-design/icons';
|
|
4
|
-
import chunk from "lodash/chunk";
|
|
5
|
-
import HcserviceV3 from "../tmpl/hcservice-v3";
|
|
6
|
-
import WebSocket from "../tmpl/web-socket";
|
|
7
|
-
import {
|
|
8
|
-
import
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
const
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
const
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
//
|
|
115
|
-
const
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
}
|
|
151
|
-
|
|
152
|
-
//
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
};
|
|
211
|
-
|
|
212
|
-
|
|
1
|
+
import React, { useEffect, useRef, useCallback } from 'react';
|
|
2
|
+
import { Space, Button } from "antd";
|
|
3
|
+
import { ExpandOutlined } from '@ant-design/icons';
|
|
4
|
+
import chunk from "lodash/chunk";
|
|
5
|
+
import HcserviceV3 from "../tmpl/hcservice-v3";
|
|
6
|
+
import WebSocket from "../tmpl/web-socket";
|
|
7
|
+
import { Render } from '../draw-canvas-edit/components/render';
|
|
8
|
+
import './index.less';
|
|
9
|
+
|
|
10
|
+
// 数据源请求结果
|
|
11
|
+
interface DataSource {
|
|
12
|
+
config: { [key: string]: any };
|
|
13
|
+
value: {
|
|
14
|
+
config: { [key: string]: any };
|
|
15
|
+
value: { [key: string]: any }[]
|
|
16
|
+
}[];
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
interface ViewerProps {
|
|
20
|
+
data?: string; // 画布 JSON 数据
|
|
21
|
+
viewId?: string; // 画面ID
|
|
22
|
+
recordCode: string; // 画面关联实例Code,用于数据源请求过滤
|
|
23
|
+
width?: number | string;
|
|
24
|
+
height?: number | string;
|
|
25
|
+
// 组件数据源初始化查询参数;公共参数、指定组件参数:例:{公共参数key:value,指定组件Id(编辑页获取):{参数key:value}}
|
|
26
|
+
initSearchParams?: { [key: string]: any },
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
const Index = (props: ViewerProps) => {
|
|
30
|
+
const { recordCode, viewId, data, width = '100%', height = '100%' } = props;
|
|
31
|
+
const boardRef = useRef<HTMLDivElement>(null);
|
|
32
|
+
const stageRef = useRef<HTMLDivElement>(null);
|
|
33
|
+
const renderRef = useRef<Render | null>(null);
|
|
34
|
+
const observerRef = useRef<ResizeObserver | null>(null);
|
|
35
|
+
const wsRef = useRef(undefined); // 实时数据websocket连接
|
|
36
|
+
const subscribeRef = useRef(undefined); // 实时数据订阅
|
|
37
|
+
|
|
38
|
+
// 初始化渲染器(只读模式)
|
|
39
|
+
const initRender = useCallback(
|
|
40
|
+
(width: number, height: number) => {
|
|
41
|
+
if (renderRef.current || !stageRef.current) return;
|
|
42
|
+
const render = new Render(stageRef.current, {
|
|
43
|
+
width,
|
|
44
|
+
height,
|
|
45
|
+
showRuler: false, // 不需要标尺
|
|
46
|
+
showRefLine: false, // 不需要参考线
|
|
47
|
+
showPreview: false, // 不需要预览框
|
|
48
|
+
showContextmenu: false, // 不需要右键菜单
|
|
49
|
+
showBg: true,
|
|
50
|
+
readonly: true // ★ 只读模式
|
|
51
|
+
});
|
|
52
|
+
renderRef.current = render;
|
|
53
|
+
// 如果有数据,恢复画布
|
|
54
|
+
if (data) {
|
|
55
|
+
loadData(render, data);
|
|
56
|
+
}
|
|
57
|
+
},
|
|
58
|
+
[data]
|
|
59
|
+
);
|
|
60
|
+
|
|
61
|
+
// 更新指定组件设置
|
|
62
|
+
const updateComponentSetting = (node: { [key: string]: any }, data: DataSource) => {
|
|
63
|
+
const { componentType, id, settings } = node;
|
|
64
|
+
let temSetting;
|
|
65
|
+
switch (componentType) {
|
|
66
|
+
case "workstation": // 工位(v1:工位状态枚举颜色,d1:工位编号)
|
|
67
|
+
const temVals = data.value?.[0]?.value;
|
|
68
|
+
const value = temVals.find(r => r.d1 === settings.workstationNumber)?.v1;
|
|
69
|
+
temSetting = value ? { fill: value } : undefined;
|
|
70
|
+
break;
|
|
71
|
+
default:
|
|
72
|
+
break;
|
|
73
|
+
}
|
|
74
|
+
temSetting && renderRef.current.updateAssetById(id, temSetting);
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
// 更新组件数据->更新画面
|
|
78
|
+
const updateAssetSettings = (nodes: { [key: string]: any }[], data: DataSource) => {
|
|
79
|
+
if (!renderRef.current || !nodes?.length || !data) return;
|
|
80
|
+
nodes.forEach(node => updateComponentSetting(node, data));
|
|
81
|
+
};
|
|
82
|
+
|
|
83
|
+
// 整理组件数据源
|
|
84
|
+
const handleDataSourceParams = (nodes: { [key: string]: any }[]) => {
|
|
85
|
+
const dataSourceConfigs = nodes.reduce((total, item) => {
|
|
86
|
+
const { dataSource } = item.settings || {};
|
|
87
|
+
if (dataSource && total[dataSource]) {
|
|
88
|
+
total[dataSource].nodes.push(item);
|
|
89
|
+
} else if (dataSource) {
|
|
90
|
+
total[dataSource] = { params: { sourceId: dataSource, chartCode: dataSource, secondCriterion: recordCode }, nodes: [item] };
|
|
91
|
+
}
|
|
92
|
+
return total;
|
|
93
|
+
}, {});
|
|
94
|
+
return dataSourceConfigs;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
// 获取初始化组件数据
|
|
98
|
+
const getInitComponentData = async (dataSourceConfigs: { [key: string]: any }) => {
|
|
99
|
+
const dataSources = Object.keys(dataSourceConfigs).map(r => dataSourceConfigs[r].params);
|
|
100
|
+
if (!dataSources.length) return;
|
|
101
|
+
const temSourceConfigs = chunk(dataSources, 10); // 每批处理10个组件数据
|
|
102
|
+
temSourceConfigs.forEach(i => {
|
|
103
|
+
HcserviceV3.requestCharMultitData(null, JSON.stringify(i)).then(rs => {
|
|
104
|
+
const { status, ...data } = rs || {};
|
|
105
|
+
if (status === "success") {
|
|
106
|
+
for (const item in data) { // 更新组件数据
|
|
107
|
+
updateAssetSettings(dataSourceConfigs[item].nodes, data[item]);
|
|
108
|
+
}
|
|
109
|
+
}
|
|
110
|
+
})
|
|
111
|
+
})
|
|
112
|
+
};
|
|
113
|
+
|
|
114
|
+
// 获取当前画面数据源配置
|
|
115
|
+
const getCharWSConfig = async (dataSourceConfigs: { [key: string]: any }) => {
|
|
116
|
+
const dataSourceIds = Object.keys(dataSourceConfigs).map(r => dataSourceConfigs[r].params.sourceId);
|
|
117
|
+
if (!dataSourceIds.length) return;
|
|
118
|
+
const res = await HcserviceV3.requestCharWSConfig(null, dataSourceIds);
|
|
119
|
+
const wsSourceIds = Object.keys(res?.config || {});
|
|
120
|
+
if (!wsSourceIds?.length) {
|
|
121
|
+
return;
|
|
122
|
+
}
|
|
123
|
+
return wsSourceIds.map(r => dataSourceConfigs[r].params);
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
// 实时订阅组件数据
|
|
127
|
+
const webSocketComponentData = async (dataSourceConfigs: { [key: string]: any }) => {
|
|
128
|
+
if (subscribeRef.current) { subscribeRef.current.unsubscribe(); }
|
|
129
|
+
const temArr = await getCharWSConfig(dataSourceConfigs);
|
|
130
|
+
if (!viewId || !temArr?.length) {
|
|
131
|
+
return;
|
|
132
|
+
}
|
|
133
|
+
wsRef.current = WebSocket.getInstance("v3/kk-ws");
|
|
134
|
+
// 订阅数据
|
|
135
|
+
subscribeRef.current = await wsRef.current.subscribe(`/user/queue/chart-data/${viewId}`, { dataSourceConfigs: JSON.stringify(temArr) }, (data) => {
|
|
136
|
+
for (const item in data) { // 更新组件数据
|
|
137
|
+
updateAssetSettings(dataSourceConfigs[item].nodes, data[item]);
|
|
138
|
+
}
|
|
139
|
+
});
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
// 获取所有组件-更新数据
|
|
143
|
+
const onAssetsLoaded = () => {
|
|
144
|
+
if (!renderRef.current) return;
|
|
145
|
+
const assets = renderRef.current.getAllAssets();
|
|
146
|
+
if (!assets?.length) return;
|
|
147
|
+
const allDataSource = handleDataSourceParams(assets);
|
|
148
|
+
getInitComponentData(allDataSource); // 初始化请求
|
|
149
|
+
webSocketComponentData(allDataSource); // ws订阅数据
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
// 加载画布数据
|
|
153
|
+
const loadData = useCallback(async (render: Render, jsonData: string) => {
|
|
154
|
+
try {
|
|
155
|
+
await render.importExportTool.restore(jsonData);
|
|
156
|
+
// 数据加载完成后自适应居中
|
|
157
|
+
render.positionTool.positionFit();
|
|
158
|
+
onAssetsLoaded();
|
|
159
|
+
} catch (e) {
|
|
160
|
+
console.error('Failed to load canvas data:', e);
|
|
161
|
+
}
|
|
162
|
+
}, []);
|
|
163
|
+
|
|
164
|
+
// 监听容器尺寸变化
|
|
165
|
+
useEffect(() => {
|
|
166
|
+
if (!boardRef.current) return;
|
|
167
|
+
const observer = new ResizeObserver(() => {
|
|
168
|
+
if (!boardRef.current) return;
|
|
169
|
+
const { width, height } = boardRef.current.getBoundingClientRect();
|
|
170
|
+
if (renderRef.current) {
|
|
171
|
+
renderRef.current.resize(width, height); // 更新尺寸
|
|
172
|
+
renderRef.current.positionTool.positionFit(); // 自适应居中
|
|
173
|
+
} else {
|
|
174
|
+
initRender(width, height);
|
|
175
|
+
}
|
|
176
|
+
});
|
|
177
|
+
observer.observe(boardRef.current);
|
|
178
|
+
observerRef.current = observer;
|
|
179
|
+
return () => {
|
|
180
|
+
observer.disconnect();
|
|
181
|
+
};
|
|
182
|
+
}, []);
|
|
183
|
+
|
|
184
|
+
// 当外部 data 更新时,重新加载
|
|
185
|
+
useEffect(() => {
|
|
186
|
+
if (renderRef.current && data) {
|
|
187
|
+
loadData(renderRef.current, data);
|
|
188
|
+
}
|
|
189
|
+
}, [data, loadData]);
|
|
190
|
+
|
|
191
|
+
const handleFit = useCallback(() => {
|
|
192
|
+
if (!renderRef.current) return;
|
|
193
|
+
renderRef.current.positionTool.positionFit();
|
|
194
|
+
}, []);
|
|
195
|
+
|
|
196
|
+
// 清理
|
|
197
|
+
useEffect(() => {
|
|
198
|
+
return () => {
|
|
199
|
+
if (renderRef.current) {
|
|
200
|
+
renderRef.current.stage.destroy();
|
|
201
|
+
renderRef.current = null;
|
|
202
|
+
}
|
|
203
|
+
if (observerRef.current) {
|
|
204
|
+
observerRef.current.disconnect();
|
|
205
|
+
observerRef.current = null;
|
|
206
|
+
}
|
|
207
|
+
if (subscribeRef.current) { // 清理订阅
|
|
208
|
+
subscribeRef.current.unsubscribe();
|
|
209
|
+
}
|
|
210
|
+
};
|
|
211
|
+
}, []);
|
|
212
|
+
|
|
213
|
+
return (
|
|
214
|
+
<div className="draw-viewer" style={{ width, height }}>
|
|
215
|
+
<div className="draw-viewer-toolbar">
|
|
216
|
+
<Space>
|
|
217
|
+
<Button type="text" className='fit' onClick={handleFit} icon={<ExpandOutlined />} />
|
|
218
|
+
</Space>
|
|
219
|
+
</div>
|
|
220
|
+
{/* 画布区域 */}
|
|
221
|
+
<div className="draw-viewer-content" ref={boardRef}>
|
|
222
|
+
<div ref={stageRef} />
|
|
223
|
+
</div>
|
|
224
|
+
</div>
|
|
225
|
+
);
|
|
226
|
+
};
|
|
227
|
+
|
|
228
|
+
export default Index;
|
|
@@ -90,8 +90,8 @@ const CriteriaForm: React.FC<CriteriaFormProps> = (props) => {
|
|
|
90
90
|
innerParams,
|
|
91
91
|
defShowCriteriaCount,
|
|
92
92
|
criteriaGroups,
|
|
93
|
-
|
|
94
|
-
|
|
93
|
+
commonCriteria,
|
|
94
|
+
split2TabCriteria
|
|
95
95
|
} = ltmplConfig;
|
|
96
96
|
const initialValues = {};
|
|
97
97
|
const searchSubmit = (data) => {
|
|
@@ -113,16 +113,16 @@ const CriteriaForm: React.FC<CriteriaFormProps> = (props) => {
|
|
|
113
113
|
const [criteriaGroupHeight, setCriteriaGroupHeight] = useState<number>(32); // 扩展条件组高度,用于展开/收起
|
|
114
114
|
const criteriaGroupRef = useRef(null);
|
|
115
115
|
|
|
116
|
-
const
|
|
117
|
-
const
|
|
116
|
+
const criteria = useMemo(() => {
|
|
117
|
+
const temCriteria = commonCriteria?.length ? commonCriteria : ltmplConfig.criteria;
|
|
118
118
|
if (tabCriteriaId) { // 处理标签页条件(存在标签页,多tab拆解条件时搜索栏加载其他tab条件)
|
|
119
|
-
const otherTabCriteria =
|
|
120
|
-
return [...
|
|
119
|
+
const otherTabCriteria = split2TabCriteria.filter(item => `c_${item.id}` !== tabCriteriaId);
|
|
120
|
+
return [...temCriteria, ...otherTabCriteria];
|
|
121
121
|
}
|
|
122
|
-
return
|
|
122
|
+
return temCriteria;
|
|
123
123
|
}, [ltmplConfig, tabCriteriaId]);
|
|
124
124
|
|
|
125
|
-
let collapseCriteria: CriteriaConfig[] = defShowCriteriaCount <= 0 ?
|
|
125
|
+
let collapseCriteria: CriteriaConfig[] = defShowCriteriaCount <= 0 ? criteria : criteria.slice(0, defShowCriteriaCount);
|
|
126
126
|
|
|
127
127
|
// 扩展条件组,监听扩展条件组高度变化,用于展开/收起
|
|
128
128
|
const handleCriteriaGroupResize = () => {
|
|
@@ -152,7 +152,7 @@ const CriteriaForm: React.FC<CriteriaFormProps> = (props) => {
|
|
|
152
152
|
|
|
153
153
|
useEffect(() => {
|
|
154
154
|
form.resetFields();
|
|
155
|
-
if (collapseCriteria &&
|
|
155
|
+
if (collapseCriteria && criteria && collapseCriteria.length < criteria.length) {
|
|
156
156
|
setCollapsible(true);
|
|
157
157
|
}
|
|
158
158
|
});
|
|
@@ -429,19 +429,19 @@ const CriteriaForm: React.FC<CriteriaFormProps> = (props) => {
|
|
|
429
429
|
};
|
|
430
430
|
|
|
431
431
|
// lagicalOpt扩展条件组条件
|
|
432
|
-
const renderCriteria = (
|
|
433
|
-
if (!
|
|
432
|
+
const renderCriteria = (criteria: CriteriaConfig[], lagicalOpt?: string) => {
|
|
433
|
+
if (!criteria) {
|
|
434
434
|
return;
|
|
435
435
|
}
|
|
436
436
|
const { hiddenCriteriaIds, serverKey } = props;
|
|
437
|
-
|
|
437
|
+
criteria.forEach((item) => {
|
|
438
438
|
let formItemName = "c_" + item.id;
|
|
439
439
|
let fieldValue = data ? data[formItemName] : undefined;
|
|
440
440
|
initialValues[formItemName] = fieldValue;
|
|
441
441
|
});
|
|
442
442
|
|
|
443
443
|
if (doSearch) {
|
|
444
|
-
return
|
|
444
|
+
return criteria.map((item, index) => {
|
|
445
445
|
let formItemName = "c_" + item.id;
|
|
446
446
|
let fieldValue = data ? data[formItemName] : undefined;
|
|
447
447
|
if (item?.extControlType == "ltree-entity-select" || item?.extControlType == "ltree-entity-select-value") {
|
|
@@ -478,7 +478,7 @@ const CriteriaForm: React.FC<CriteriaFormProps> = (props) => {
|
|
|
478
478
|
);
|
|
479
479
|
return lagicalOpt ? <>
|
|
480
480
|
{formItem}
|
|
481
|
-
{
|
|
481
|
+
{criteria.length !== index + 1 ? <FormItem style={{ margin: 0, color: colorWarning }}>{translate("${" + lagicalOpt + "}")}</FormItem> : ""}
|
|
482
482
|
</> : formItem;
|
|
483
483
|
}
|
|
484
484
|
});
|
|
@@ -492,16 +492,16 @@ const CriteriaForm: React.FC<CriteriaFormProps> = (props) => {
|
|
|
492
492
|
}
|
|
493
493
|
const isExpanded = criteriaGroupHeight > 32;
|
|
494
494
|
return criteriaGroup.map(r =>
|
|
495
|
-
r.
|
|
495
|
+
r.criteria?.length > 1 ?
|
|
496
496
|
< div style={{ borderRadius: "6px", border: `1px dashed ${colorBorder}`, padding: "2px 4px", marginRight: "16px", position: "relative", display: "flex", justifyContent: "space-between", alignItems: "flex-end" }}>
|
|
497
|
-
<Space style={{ height: criteriaGExpanded ? "auto" : "32px", overflow: "hidden", }} ref={criteriaGroupRef} size={"small"} wrap>{renderCriteria(r.
|
|
497
|
+
<Space style={{ height: criteriaGExpanded ? "auto" : "32px", overflow: "hidden", }} ref={criteriaGroupRef} size={"small"} wrap>{renderCriteria(r.criteria, r.lagicalOpt === "OR" ? "或" : "且")}</Space>
|
|
498
498
|
{isExpanded ?
|
|
499
499
|
<Button icon={criteriaGExpanded ? <LeftOutlined /> : <RightOutlined />} type={"link"} onClick={() => setCriteriaGExpanded(!criteriaGExpanded)}>
|
|
500
500
|
{translate(criteriaGExpanded ? "${收起}" : "${展开}")}
|
|
501
501
|
</Button>
|
|
502
502
|
: ""}
|
|
503
503
|
</div > :
|
|
504
|
-
<Space size={"small"} wrap>{renderCriteria(r.
|
|
504
|
+
<Space size={"small"} wrap>{renderCriteria(r.criteria)}</Space>
|
|
505
505
|
);
|
|
506
506
|
};
|
|
507
507
|
|
|
@@ -533,7 +533,7 @@ const CriteriaForm: React.FC<CriteriaFormProps> = (props) => {
|
|
|
533
533
|
{renderDrillDimension()}</>
|
|
534
534
|
: null}
|
|
535
535
|
{showQueryButton || (updrillButtonConfigs && updrillButtonConfigs.length > 0)
|
|
536
|
-
? renderCriteria(expanded ?
|
|
536
|
+
? renderCriteria(expanded ? criteria : collapseCriteria)
|
|
537
537
|
: null}
|
|
538
538
|
|
|
539
539
|
{renderCriteriaGroup(criteriaGroups)}
|
|
@@ -196,6 +196,15 @@ export default class DtmplForm extends React.PureComponent<
|
|
|
196
196
|
return;
|
|
197
197
|
}
|
|
198
198
|
|
|
199
|
+
const fields = appDtmplConfig.groups?.map(r => r.fields).flat();
|
|
200
|
+
if (fields?.length) {
|
|
201
|
+
fields.forEach(r => {
|
|
202
|
+
if (r.hidden) { // 隐藏字段,清空值
|
|
203
|
+
values[r.id] = "";
|
|
204
|
+
}
|
|
205
|
+
});
|
|
206
|
+
}
|
|
207
|
+
|
|
199
208
|
if (dtmplData) {
|
|
200
209
|
dtmplData.fieldMap = { ...values }
|
|
201
210
|
}
|