aldehyde 0.2.503 → 0.2.504

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.
Files changed (113) hide show
  1. package/lib/controls/action/index.d.ts +3 -1
  2. package/lib/controls/action/index.d.ts.map +1 -1
  3. package/lib/controls/action/index.js +17 -1
  4. package/lib/controls/action/index.js.map +1 -1
  5. package/lib/controls/icon-selector/icon/phonenode-menu-icon/iconfont.css +99 -99
  6. package/lib/draw-canvas-edit/components/asset-bar/index.less +35 -35
  7. package/lib/draw-canvas-edit/components/main-header/index.less +23 -23
  8. package/lib/lowcode-components/base-table/index.less +61 -61
  9. package/lib/lowcode-components/column-3d-chart/index.d.ts +1 -0
  10. package/lib/lowcode-components/column-3d-chart/index.d.ts.map +1 -1
  11. package/lib/lowcode-components/column-3d-chart/index.js +3 -1
  12. package/lib/lowcode-components/column-3d-chart/index.js.map +1 -1
  13. package/lib/lowcode-components/column-chart/index.d.ts +1 -0
  14. package/lib/lowcode-components/column-chart/index.d.ts.map +1 -1
  15. package/lib/lowcode-components/column-chart/index.js +3 -1
  16. package/lib/lowcode-components/column-chart/index.js.map +1 -1
  17. package/lib/lowcode-components/data-number/index.less +10 -10
  18. package/lib/lowcode-components/date-time/index.less +4 -4
  19. package/lib/lowcode-components/four-angle-glow-border/index.less +49 -49
  20. package/lib/lowcode-components/line-bar-chart/index.d.ts +1 -0
  21. package/lib/lowcode-components/line-bar-chart/index.d.ts.map +1 -1
  22. package/lib/lowcode-components/line-bar-chart/index.js +3 -1
  23. package/lib/lowcode-components/line-bar-chart/index.js.map +1 -1
  24. package/lib/lowcode-components/line-chart/index.d.ts +1 -0
  25. package/lib/lowcode-components/line-chart/index.d.ts.map +1 -1
  26. package/lib/lowcode-components/line-chart/index.js +3 -1
  27. package/lib/lowcode-components/line-chart/index.js.map +1 -1
  28. package/lib/lowcode-components/lowcode-view/component/font/FontGlobal.css +26 -26
  29. package/lib/lowcode-components/lowcode-view/component/screen-fit/index.less +13 -13
  30. package/lib/lowcode-components/lowcode-view/index.d.ts.map +1 -1
  31. package/lib/lowcode-components/lowcode-view/index.js +8 -0
  32. package/lib/lowcode-components/lowcode-view/index.js.map +1 -1
  33. package/lib/lowcode-components/text-scroller/index.less +28 -28
  34. package/lib/module/dtmpl-edit-page.d.ts.map +1 -1
  35. package/lib/module/dtmpl-edit-page.js +7 -7
  36. package/lib/module/dtmpl-edit-page.js.map +1 -1
  37. package/lib/table/act-table.d.ts.map +1 -1
  38. package/lib/table/act-table.js +6 -6
  39. package/lib/table/act-table.js.map +1 -1
  40. package/lib/table/column/column-builder.d.ts +1 -0
  41. package/lib/table/column/column-builder.d.ts.map +1 -1
  42. package/lib/table/column/column-builder.js +25 -16
  43. package/lib/table/column/column-builder.js.map +1 -1
  44. package/lib/table/column/index.less +8 -8
  45. package/lib/table/report-table.d.ts.map +1 -1
  46. package/lib/table/report-table.js +3 -3
  47. package/lib/table/report-table.js.map +1 -1
  48. package/lib/tmpl/interface.d.ts +7 -0
  49. package/lib/tmpl/interface.d.ts.map +1 -1
  50. package/lib/tmpl/interface.js.map +1 -1
  51. package/package.json +1 -1
  52. package/src/aldehyde/controls/action/index.tsx +33 -2
  53. package/src/aldehyde/controls/icon-selector/icon/phonenode-menu-icon/iconfont.css +99 -99
  54. package/src/aldehyde/controls/icon-selector/icon/phonenode-menu-icon/iconfont.json +156 -156
  55. package/src/aldehyde/draw-canvas-edit/components/asset-bar/index.less +35 -35
  56. package/src/aldehyde/draw-canvas-edit/components/asset-bar/index.tsx +110 -110
  57. package/src/aldehyde/draw-canvas-edit/components/main-header/index.less +23 -23
  58. package/src/aldehyde/draw-canvas-edit/components/main-header/index.tsx +263 -263
  59. package/src/aldehyde/draw-canvas-edit/components/render/draws/index.ts +7 -7
  60. package/src/aldehyde/draw-canvas-edit/components/render/graphs/base-graph.ts +241 -241
  61. package/src/aldehyde/draw-canvas-edit/components/render/graphs/circle.ts +699 -699
  62. package/src/aldehyde/draw-canvas-edit/components/render/graphs/curve.ts +500 -500
  63. package/src/aldehyde/draw-canvas-edit/components/render/graphs/index.ts +5 -5
  64. package/src/aldehyde/draw-canvas-edit/components/render/graphs/line.ts +493 -493
  65. package/src/aldehyde/draw-canvas-edit/components/render/graphs/rect.ts +680 -680
  66. package/src/aldehyde/draw-canvas-edit/components/render/handlers/drag-handlers.ts +68 -68
  67. package/src/aldehyde/draw-canvas-edit/components/render/handlers/graph-handlers.ts +113 -113
  68. package/src/aldehyde/draw-canvas-edit/components/render/handlers/index.ts +9 -9
  69. package/src/aldehyde/draw-canvas-edit/components/render/handlers/key-move-handlers.ts +49 -49
  70. package/src/aldehyde/draw-canvas-edit/components/render/handlers/link-handlers.ts +45 -45
  71. package/src/aldehyde/draw-canvas-edit/components/render/handlers/shutcut-handlers.ts +45 -45
  72. package/src/aldehyde/draw-canvas-edit/components/render/handlers/text-handlers.ts +81 -81
  73. package/src/aldehyde/draw-canvas-edit/components/render/handlers/zoom-handlers.ts +59 -59
  74. package/src/aldehyde/draw-canvas-edit/components/render/tools/align-tool.ts +89 -89
  75. package/src/aldehyde/draw-canvas-edit/components/render/tools/asset-tool.ts +154 -154
  76. package/src/aldehyde/draw-canvas-edit/components/render/tools/link-tool.ts +222 -222
  77. package/src/aldehyde/draw-canvas-edit/components/render/tools/z-index-tool.ts +224 -224
  78. package/src/aldehyde/draw-canvas-edit/components/render/utils/a-star.ts +116 -116
  79. package/src/aldehyde/draw-canvas-edit/components/render/utils/bezier-scene-func.ts +72 -72
  80. package/src/aldehyde/draw-canvas-edit/components/setting-form/imag-upload.tsx +119 -119
  81. package/src/aldehyde/layout4/imgs/user.svg +26 -26
  82. package/src/aldehyde/lowcode-components/base-color-block/index.tsx +31 -31
  83. package/src/aldehyde/lowcode-components/base-table/index.less +61 -61
  84. package/src/aldehyde/lowcode-components/column-3d-chart/index.tsx +3 -1
  85. package/src/aldehyde/lowcode-components/column-chart/index.tsx +3 -1
  86. package/src/aldehyde/lowcode-components/data-number/index.less +10 -10
  87. package/src/aldehyde/lowcode-components/date-time/index.less +4 -4
  88. package/src/aldehyde/lowcode-components/date-time/index.tsx +64 -64
  89. package/src/aldehyde/lowcode-components/four-angle-glow-border/index.less +49 -49
  90. package/src/aldehyde/lowcode-components/four-angle-glow-border/index.tsx +53 -53
  91. package/src/aldehyde/lowcode-components/line-bar-chart/index.tsx +3 -1
  92. package/src/aldehyde/lowcode-components/line-chart/index.tsx +3 -1
  93. package/src/aldehyde/lowcode-components/lowcode-view/component/abstract-controller.ts +64 -64
  94. package/src/aldehyde/lowcode-components/lowcode-view/component/abstract-definition.ts +77 -77
  95. package/src/aldehyde/lowcode-components/lowcode-view/component/abstract-designer-loader.ts +36 -36
  96. package/src/aldehyde/lowcode-components/lowcode-view/component/component-container.tsx +144 -144
  97. package/src/aldehyde/lowcode-components/lowcode-view/component/font/FontGlobal.css +26 -26
  98. package/src/aldehyde/lowcode-components/lowcode-view/component/group-layer/controller.ts +36 -36
  99. package/src/aldehyde/lowcode-components/lowcode-view/component/group-layer/definition.ts +53 -53
  100. package/src/aldehyde/lowcode-components/lowcode-view/component/group-layer/index.tsx +15 -15
  101. package/src/aldehyde/lowcode-components/lowcode-view/component/layer-builder.tsx +98 -98
  102. package/src/aldehyde/lowcode-components/lowcode-view/component/screen-fit/index.less +13 -13
  103. package/src/aldehyde/lowcode-components/lowcode-view/component/screen-fit/index.tsx +121 -121
  104. package/src/aldehyde/lowcode-components/lowcode-view/index.tsx +9 -0
  105. package/src/aldehyde/lowcode-components/placeholder-component/index.tsx +81 -81
  106. package/src/aldehyde/lowcode-components/text-scroller/index.less +28 -28
  107. package/src/aldehyde/lowcode-components/text-scroller/index.tsx +173 -173
  108. package/src/aldehyde/module/dtmpl-edit-page.tsx +10 -10
  109. package/src/aldehyde/table/act-table.tsx +6 -6
  110. package/src/aldehyde/table/column/column-builder.tsx +26 -36
  111. package/src/aldehyde/table/column/index.less +8 -8
  112. package/src/aldehyde/table/report-table.tsx +3 -2
  113. package/src/aldehyde/tmpl/interface.tsx +7 -0
@@ -1,82 +1,82 @@
1
-
2
- import React, { ForwardedRef, forwardRef, useMemo, useImperativeHandle, useState } from 'react';
3
- import Units from "../../units/index";
4
- import { useLocale } from "../../locale/useLocale";
5
-
6
- const defStyle = {
7
- color: '#9a9a9a',
8
- height: '100%',
9
- display: 'flex',
10
- justifyContent: 'center',
11
- alignItems: 'center',
12
- border: '1px solid #9a9a9a',
13
- };
14
-
15
- export interface ComponentProps {
16
- style: { key: string; compsIds?: string[]; },
17
- isDesignMode?: boolean; // 是否编辑模式
18
- initSearchParams?: { [key: string]: any }; // 全局初始化外部参数,例:传参包含设备id,则在查询时带上设备id
19
- setSearchParams: (data: any) => void;
20
- }
21
-
22
- export interface CompImageonentRef {
23
- updateConfig: (newConfig: ComponentProps) => void;
24
- }
25
-
26
- const PlaceholderComponent = forwardRef((props: ComponentProps, ref: ForwardedRef<CompImageonentRef>) => {
27
- const { isDesignMode, setSearchParams, style } = props;
28
- const { translate } = useLocale();
29
- const [key, setKey] = useState<string>(style?.key);
30
- const [initSearchParams, setInitSearchParams] = useState<{ [key: string]: any }>();
31
- const [compsIds, setCompsIds] = useState<string[]>(style?.compsIds || []);
32
-
33
- useImperativeHandle(ref, () => ({
34
- updateConfig: (newConfig) => {
35
- setKey(newConfig.style?.key);
36
- setInitSearchParams(newConfig.initSearchParams || {});
37
- setCompsIds(newConfig.style?.compsIds || []);
38
- },
39
- }));
40
-
41
-
42
- const handleParams = (params: { [key: string]: any }) => {
43
- if (!compsIds?.length) {
44
- return;
45
- }
46
- setSearchParams(val => {
47
- const temObj = {};
48
- for (const compId of compsIds) {
49
- if (val[compId]) { // 全局搜索参数中存在当前组件的搜索参数,则合并
50
- val[compId] = { ...val[compId], ...params }
51
- } else {
52
- temObj[compId] = params;
53
- }
54
- };
55
- return { ...val, ...temObj };
56
- });
57
- }
58
-
59
-
60
- const renderComponent = useMemo(() => {
61
- const temComponent = Units.getCustomComponent(key);
62
- if (temComponent) {
63
- return React.createElement(temComponent, { params: initSearchParams, handleParams });
64
- }
65
- return <div style={defStyle}>{translate("${没有找到自定义组件}")}</div>;
66
- }, [key, initSearchParams]);
67
-
68
- return (
69
- <div style={{ width: '100%', height: '100%' }}>
70
- {isDesignMode || !key ?
71
- <div style={defStyle}>
72
- <div>{translate("${占位组件}")}</div>
73
- </div> :
74
- <div style={{ width: '100%', height: '100%', overflow: "auto" }}>
75
- {renderComponent}
76
- </div>
77
- }
78
- </div>
79
- );
80
- });
81
-
1
+
2
+ import React, { ForwardedRef, forwardRef, useMemo, useImperativeHandle, useState } from 'react';
3
+ import Units from "../../units/index";
4
+ import { useLocale } from "../../locale/useLocale";
5
+
6
+ const defStyle = {
7
+ color: '#9a9a9a',
8
+ height: '100%',
9
+ display: 'flex',
10
+ justifyContent: 'center',
11
+ alignItems: 'center',
12
+ border: '1px solid #9a9a9a',
13
+ };
14
+
15
+ export interface ComponentProps {
16
+ style: { key: string; compsIds?: string[]; },
17
+ isDesignMode?: boolean; // 是否编辑模式
18
+ initSearchParams?: { [key: string]: any }; // 全局初始化外部参数,例:传参包含设备id,则在查询时带上设备id
19
+ setSearchParams: (data: any) => void;
20
+ }
21
+
22
+ export interface CompImageonentRef {
23
+ updateConfig: (newConfig: ComponentProps) => void;
24
+ }
25
+
26
+ const PlaceholderComponent = forwardRef((props: ComponentProps, ref: ForwardedRef<CompImageonentRef>) => {
27
+ const { isDesignMode, setSearchParams, style } = props;
28
+ const { translate } = useLocale();
29
+ const [key, setKey] = useState<string>(style?.key);
30
+ const [initSearchParams, setInitSearchParams] = useState<{ [key: string]: any }>();
31
+ const [compsIds, setCompsIds] = useState<string[]>(style?.compsIds || []);
32
+
33
+ useImperativeHandle(ref, () => ({
34
+ updateConfig: (newConfig) => {
35
+ setKey(newConfig.style?.key);
36
+ setInitSearchParams(newConfig.initSearchParams || {});
37
+ setCompsIds(newConfig.style?.compsIds || []);
38
+ },
39
+ }));
40
+
41
+
42
+ const handleParams = (params: { [key: string]: any }) => {
43
+ if (!compsIds?.length) {
44
+ return;
45
+ }
46
+ setSearchParams(val => {
47
+ const temObj = {};
48
+ for (const compId of compsIds) {
49
+ if (val[compId]) { // 全局搜索参数中存在当前组件的搜索参数,则合并
50
+ val[compId] = { ...val[compId], ...params }
51
+ } else {
52
+ temObj[compId] = params;
53
+ }
54
+ };
55
+ return { ...val, ...temObj };
56
+ });
57
+ }
58
+
59
+
60
+ const renderComponent = useMemo(() => {
61
+ const temComponent = Units.getCustomComponent(key);
62
+ if (temComponent) {
63
+ return React.createElement(temComponent, { params: initSearchParams, handleParams });
64
+ }
65
+ return <div style={defStyle}>{translate("${没有找到自定义组件}")}</div>;
66
+ }, [key, initSearchParams]);
67
+
68
+ return (
69
+ <div style={{ width: '100%', height: '100%' }}>
70
+ {isDesignMode || !key ?
71
+ <div style={defStyle}>
72
+ <div>{translate("${占位组件}")}</div>
73
+ </div> :
74
+ <div style={{ width: '100%', height: '100%', overflow: "auto" }}>
75
+ {renderComponent}
76
+ </div>
77
+ }
78
+ </div>
79
+ );
80
+ });
81
+
82
82
  export default PlaceholderComponent;
@@ -1,29 +1,29 @@
1
- .text-scroller-container {
2
- --speed: 10s;
3
- --container-width: 320px;
4
-
5
- width: 100%;
6
- height: 100%;
7
- overflow: hidden;
8
- white-space: nowrap;
9
- position: relative;
10
-
11
- .text-scroller {
12
- height: inherit;
13
- position: absolute;
14
- color: white;
15
- animation: scrollText var(--speed) linear infinite;
16
- display: flex;
17
- align-items: center;
18
- }
19
-
20
- @keyframes scrollText {
21
- 0% {
22
- transform: translateX(var(--container-width));
23
- }
24
-
25
- 100% {
26
- transform: translateX(-100%);
27
- }
28
- }
1
+ .text-scroller-container {
2
+ --speed: 10s;
3
+ --container-width: 320px;
4
+
5
+ width: 100%;
6
+ height: 100%;
7
+ overflow: hidden;
8
+ white-space: nowrap;
9
+ position: relative;
10
+
11
+ .text-scroller {
12
+ height: inherit;
13
+ position: absolute;
14
+ color: white;
15
+ animation: scrollText var(--speed) linear infinite;
16
+ display: flex;
17
+ align-items: center;
18
+ }
19
+
20
+ @keyframes scrollText {
21
+ 0% {
22
+ transform: translateX(var(--container-width));
23
+ }
24
+
25
+ 100% {
26
+ transform: translateX(-100%);
27
+ }
28
+ }
29
29
  }
@@ -1,174 +1,174 @@
1
- import React, { forwardRef, ForwardedRef, useEffect, useImperativeHandle, useRef, useState } from 'react';
2
- import './index.less';
3
- import _ from "lodash";
4
- import { useLocale } from "../../locale/useLocale";
5
- import HydrocarbonService from "../../tmpl/hcservice-v3";
6
- import { DataConfigProps } from "../data";
7
-
8
- // 处理数据格式
9
- const handleData = (data: { config: { [key: string]: string }, value: { [key: string]: any }[] }[]) => {
10
- const temData = data?.[0]?.value?.[0]?.v1;
11
- return temData;
12
- }
13
-
14
- export interface ComponentStyle {
15
- speed?: number;
16
- fontSize?: number;
17
- color?: string;
18
- fontFamily?: string;
19
- fontWeight?: number;
20
- defaultValue?: string;
21
- }
22
-
23
- export interface ComponentProps {
24
- style?: ComponentStyle;
25
- data?: DataConfigProps;
26
- isDesignMode?: boolean; // 是否编辑模式
27
- initSearchParams?: { [key: string]: any }; // 全局初始化外部参数,例:传参包含设备id,则在查询时带上设备id
28
- }
29
-
30
- export interface ComponentRef {
31
- updateConfig: (newConfig: ComponentProps) => void;
32
- destroy: () => void;
33
- }
34
-
35
- const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>) => {
36
- const { style, data: propsData, isDesignMode } = props;
37
- const [config, setConfig] = useState<ComponentStyle>(style || {});
38
- const [speed, setSpeed] = useState<number>(style?.speed || 5);
39
- const [dataConfig, setDataConfig] = useState<DataConfigProps>({ ...propsData }); // 数据源配置
40
- const [data, setData] = useState<string>('');
41
- const [searchParams, setSearchParams] = useState<{ [key: string]: any }>();
42
- const [initSearchParams, setInitSearchParams] = useState<{ [key: string]: any }>();
43
- const textScrollerRef = useRef<HTMLDivElement>(null);
44
- const textContainerRef = useRef<HTMLDivElement>(null);
45
- const resizeObserverRef = useRef<ResizeObserver | null>(null);
46
- const pollingIntervalRef = useRef<number | NodeJS.Timeout>(null);
47
- const { translate } = useLocale();
48
-
49
- const handleDestroy = () => {
50
- resizeObserverRef.current && resizeObserverRef.current.disconnect();
51
- pollingIntervalRef.current && clearInterval(pollingIntervalRef.current);
52
- };
53
-
54
- // 全局初始化请求数据处理
55
- const handleInitData = (val: DataConfigProps) => {
56
- if (val.sourceType === "sourceId" && val.isInit && val.initData) {
57
- const { config, value } = val.initData;
58
- const temData = handleData(value);
59
- setData(temData);
60
- if (config?.requestMode === "polling") {
61
- pollingIntervalRef.current = setInterval(() => { getData() }, config?.pollingInterval || 60000);
62
- }
63
- }
64
- }
65
-
66
- // ws订阅数据更新
67
- const handleWSData = (val: DataConfigProps) => {
68
- if (val.sourceType === "sourceId" && val.wsData) {
69
- const { value } = val.initData;
70
- const temData = handleData(value);
71
- setData(temData);
72
- }
73
- }
74
-
75
- useImperativeHandle(ref, () => ({
76
- updateConfig: (newConfig) => {
77
- const { style: newStyle, data: newDataConfig, initSearchParams: newISParams } = newConfig;
78
- setConfig({ ...(newStyle || {}) });
79
- setSpeed(newStyle?.speed || 5);
80
- setDataConfig({ ...newDataConfig });
81
- handleInitData(newDataConfig);
82
- setSearchParams(newDataConfig.searchParams);
83
- setInitSearchParams(newISParams);
84
- handleWSData(newDataConfig);
85
- },
86
- destroy: handleDestroy,
87
- }));
88
-
89
- useEffect(() => {
90
- if (textContainerRef.current) {
91
- resizeObserverRef.current = new ResizeObserver(_.debounce((entries) => {
92
- for (const entry of entries) {
93
- const { width } = entry.contentRect;
94
- textContainerRef.current.style.setProperty('--container-width', `${width}px`);
95
- }
96
- }, 100));
97
- // 开始观察
98
- resizeObserverRef.current.observe(textContainerRef.current);
99
- }
100
- return () => {
101
- handleDestroy();
102
- }
103
- }, []);
104
-
105
- useEffect(() => {
106
- if (textContainerRef.current) {
107
- textContainerRef.current.style.setProperty('--speed', `${speed || 5}s`);
108
- }
109
- }, [speed]);
110
-
111
- // 请求数据
112
- const getData = async (params?: object) => {
113
- const { data } = await HydrocarbonService.requestChartData(null, dataConfig?.sourceId, params) || {};
114
- const { config, value } = data || {};
115
- const temData = handleData(value);
116
- setData(temData);
117
- return config;
118
- };
119
-
120
- // 初始化请求数据
121
- const getInitData = async (params?: object) => {
122
- pollingIntervalRef.current && clearInterval(pollingIntervalRef.current);
123
- const config = await getData(params);
124
- if (config?.requestMode === "polling") {
125
- pollingIntervalRef.current = setInterval(() => getData(params), config?.pollingInterval || 60000);
126
- }
127
- };
128
-
129
- // 静态数据处理
130
- useEffect(() => {
131
- if (dataConfig?.sourceType === 'staticData') {
132
- const { value } = dataConfig.staticData || {};
133
- setData(value);
134
- }
135
- }, [dataConfig?.sourceType, dataConfig?.staticData]);
136
-
137
- /**
138
- * 数据源数据请求
139
- * 1、编辑态不请求数据
140
- */
141
- useEffect(() => {
142
- if (!isDesignMode && dataConfig?.sourceType === 'sourceId' && dataConfig?.sourceId && !dataConfig?.isInit && dataConfig?.isDefRequest !== false) {
143
- if (dataConfig?.isInitParams) { // 组件数据源接收外部参数
144
- initSearchParams && getInitData(initSearchParams);
145
- } else {
146
- getInitData();
147
- }
148
- } else if (dataConfig?.sourceType === 'sourceId') {
149
- setData("文本跑马灯");
150
- }
151
- }, [dataConfig?.sourceType, dataConfig?.sourceId, initSearchParams]);
152
-
153
- // 搜索参数变化时重新请求数据
154
- useEffect(() => {
155
- if (searchParams) {
156
- const params = { ...(initSearchParams || {}), ...searchParams };
157
- if (dataConfig?.isInitParams) { // 数据源接收外部参数,则参数存在再请求
158
- initSearchParams && getInitData(params);
159
- } else {
160
- getInitData(params);
161
- }
162
- }
163
- }, [searchParams, initSearchParams]);
164
-
165
- return (
166
- <div className="text-scroller-container" ref={textContainerRef}>
167
- <div className="text-scroller" style={{ ...config }} ref={textScrollerRef}>
168
- {translate("${" + data + "}")}
169
- </div>
170
- </div>
171
- );
172
- });
173
-
1
+ import React, { forwardRef, ForwardedRef, useEffect, useImperativeHandle, useRef, useState } from 'react';
2
+ import './index.less';
3
+ import _ from "lodash";
4
+ import { useLocale } from "../../locale/useLocale";
5
+ import HydrocarbonService from "../../tmpl/hcservice-v3";
6
+ import { DataConfigProps } from "../data";
7
+
8
+ // 处理数据格式
9
+ const handleData = (data: { config: { [key: string]: string }, value: { [key: string]: any }[] }[]) => {
10
+ const temData = data?.[0]?.value?.[0]?.v1;
11
+ return temData;
12
+ }
13
+
14
+ export interface ComponentStyle {
15
+ speed?: number;
16
+ fontSize?: number;
17
+ color?: string;
18
+ fontFamily?: string;
19
+ fontWeight?: number;
20
+ defaultValue?: string;
21
+ }
22
+
23
+ export interface ComponentProps {
24
+ style?: ComponentStyle;
25
+ data?: DataConfigProps;
26
+ isDesignMode?: boolean; // 是否编辑模式
27
+ initSearchParams?: { [key: string]: any }; // 全局初始化外部参数,例:传参包含设备id,则在查询时带上设备id
28
+ }
29
+
30
+ export interface ComponentRef {
31
+ updateConfig: (newConfig: ComponentProps) => void;
32
+ destroy: () => void;
33
+ }
34
+
35
+ const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>) => {
36
+ const { style, data: propsData, isDesignMode } = props;
37
+ const [config, setConfig] = useState<ComponentStyle>(style || {});
38
+ const [speed, setSpeed] = useState<number>(style?.speed || 5);
39
+ const [dataConfig, setDataConfig] = useState<DataConfigProps>({ ...propsData }); // 数据源配置
40
+ const [data, setData] = useState<string>('');
41
+ const [searchParams, setSearchParams] = useState<{ [key: string]: any }>();
42
+ const [initSearchParams, setInitSearchParams] = useState<{ [key: string]: any }>();
43
+ const textScrollerRef = useRef<HTMLDivElement>(null);
44
+ const textContainerRef = useRef<HTMLDivElement>(null);
45
+ const resizeObserverRef = useRef<ResizeObserver | null>(null);
46
+ const pollingIntervalRef = useRef<number | NodeJS.Timeout>(null);
47
+ const { translate } = useLocale();
48
+
49
+ const handleDestroy = () => {
50
+ resizeObserverRef.current && resizeObserverRef.current.disconnect();
51
+ pollingIntervalRef.current && clearInterval(pollingIntervalRef.current);
52
+ };
53
+
54
+ // 全局初始化请求数据处理
55
+ const handleInitData = (val: DataConfigProps) => {
56
+ if (val.sourceType === "sourceId" && val.isInit && val.initData) {
57
+ const { config, value } = val.initData;
58
+ const temData = handleData(value);
59
+ setData(temData);
60
+ if (config?.requestMode === "polling") {
61
+ pollingIntervalRef.current = setInterval(() => { getData() }, config?.pollingInterval || 60000);
62
+ }
63
+ }
64
+ }
65
+
66
+ // ws订阅数据更新
67
+ const handleWSData = (val: DataConfigProps) => {
68
+ if (val.sourceType === "sourceId" && val.wsData) {
69
+ const { value } = val.initData;
70
+ const temData = handleData(value);
71
+ setData(temData);
72
+ }
73
+ }
74
+
75
+ useImperativeHandle(ref, () => ({
76
+ updateConfig: (newConfig) => {
77
+ const { style: newStyle, data: newDataConfig, initSearchParams: newISParams } = newConfig;
78
+ setConfig({ ...(newStyle || {}) });
79
+ setSpeed(newStyle?.speed || 5);
80
+ setDataConfig({ ...newDataConfig });
81
+ handleInitData(newDataConfig);
82
+ setSearchParams(newDataConfig.searchParams);
83
+ setInitSearchParams(newISParams);
84
+ handleWSData(newDataConfig);
85
+ },
86
+ destroy: handleDestroy,
87
+ }));
88
+
89
+ useEffect(() => {
90
+ if (textContainerRef.current) {
91
+ resizeObserverRef.current = new ResizeObserver(_.debounce((entries) => {
92
+ for (const entry of entries) {
93
+ const { width } = entry.contentRect;
94
+ textContainerRef.current.style.setProperty('--container-width', `${width}px`);
95
+ }
96
+ }, 100));
97
+ // 开始观察
98
+ resizeObserverRef.current.observe(textContainerRef.current);
99
+ }
100
+ return () => {
101
+ handleDestroy();
102
+ }
103
+ }, []);
104
+
105
+ useEffect(() => {
106
+ if (textContainerRef.current) {
107
+ textContainerRef.current.style.setProperty('--speed', `${speed || 5}s`);
108
+ }
109
+ }, [speed]);
110
+
111
+ // 请求数据
112
+ const getData = async (params?: object) => {
113
+ const { data } = await HydrocarbonService.requestChartData(null, dataConfig?.sourceId, params) || {};
114
+ const { config, value } = data || {};
115
+ const temData = handleData(value);
116
+ setData(temData);
117
+ return config;
118
+ };
119
+
120
+ // 初始化请求数据
121
+ const getInitData = async (params?: object) => {
122
+ pollingIntervalRef.current && clearInterval(pollingIntervalRef.current);
123
+ const config = await getData(params);
124
+ if (config?.requestMode === "polling") {
125
+ pollingIntervalRef.current = setInterval(() => getData(params), config?.pollingInterval || 60000);
126
+ }
127
+ };
128
+
129
+ // 静态数据处理
130
+ useEffect(() => {
131
+ if (dataConfig?.sourceType === 'staticData') {
132
+ const { value } = dataConfig.staticData || {};
133
+ setData(value);
134
+ }
135
+ }, [dataConfig?.sourceType, dataConfig?.staticData]);
136
+
137
+ /**
138
+ * 数据源数据请求
139
+ * 1、编辑态不请求数据
140
+ */
141
+ useEffect(() => {
142
+ if (!isDesignMode && dataConfig?.sourceType === 'sourceId' && dataConfig?.sourceId && !dataConfig?.isInit && dataConfig?.isDefRequest !== false) {
143
+ if (dataConfig?.isInitParams) { // 组件数据源接收外部参数
144
+ initSearchParams && getInitData(initSearchParams);
145
+ } else {
146
+ getInitData();
147
+ }
148
+ } else if (dataConfig?.sourceType === 'sourceId') {
149
+ setData("文本跑马灯");
150
+ }
151
+ }, [dataConfig?.sourceType, dataConfig?.sourceId, initSearchParams]);
152
+
153
+ // 搜索参数变化时重新请求数据
154
+ useEffect(() => {
155
+ if (searchParams) {
156
+ const params = { ...(initSearchParams || {}), ...searchParams };
157
+ if (dataConfig?.isInitParams) { // 数据源接收外部参数,则参数存在再请求
158
+ initSearchParams && getInitData(params);
159
+ } else {
160
+ getInitData(params);
161
+ }
162
+ }
163
+ }, [searchParams, initSearchParams]);
164
+
165
+ return (
166
+ <div className="text-scroller-container" ref={textContainerRef}>
167
+ <div className="text-scroller" style={{ ...config }} ref={textScrollerRef}>
168
+ {translate("${" + data + "}")}
169
+ </div>
170
+ </div>
171
+ );
172
+ });
173
+
174
174
  export default Index;
@@ -412,14 +412,6 @@ export default class DtmplEditPage extends React.PureComponent<
412
412
  const { saveBtnTitle, continueSaveBtnTitle } = dtmplConfig || {};
413
413
  const { translate } = this.context;
414
414
  if (dtmplConfig?.buttons?.includes("dtmplSave")) {
415
- footerButtons.unshift(
416
- <Button type="primary" loading={loading || btnLoading === "saveLoading"} onClick={() => {
417
- this.setState({ btnLoading: "saveLoading" });
418
- this.doSubmit();
419
- }}>
420
- {translate("${" + (saveBtnTitle || "保存") + "}")}
421
- </Button>
422
- );
423
415
  if (continueSaveBtnTitle) {
424
416
  footerButtons.unshift(
425
417
  <Button type="primary" loading={loading || btnLoading === "continueSaveLoading"} onClick={() => {
@@ -429,6 +421,15 @@ export default class DtmplEditPage extends React.PureComponent<
429
421
  {translate("${" + continueSaveBtnTitle + "}")}
430
422
  </Button>
431
423
  );
424
+ } else {
425
+ footerButtons.unshift(
426
+ <Button type="primary" loading={loading || btnLoading === "saveLoading"} onClick={() => {
427
+ this.setState({ btnLoading: "saveLoading" });
428
+ this.doSubmit();
429
+ }}>
430
+ {translate("${" + (saveBtnTitle || "保存") + "}")}
431
+ </Button>
432
+ );
432
433
  }
433
434
  }
434
435
  //处理action
@@ -475,9 +476,8 @@ export default class DtmplEditPage extends React.PureComponent<
475
476
  if (code) {
476
477
  if (propsCode && isContinueSave) {
477
478
  this.loadConfigData();
478
- } else {
479
- this.props.onOk(code, isContinueSave);
480
479
  }
480
+ this.props.onOk(code, isContinueSave);
481
481
  }
482
482
  }
483
483
 
@@ -767,20 +767,19 @@ class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
767
767
  doJump = async (jump: JumpConfig, record_: DtmplData) => {
768
768
  let record = record_.fieldMap ? record_.fieldMap : record_;
769
769
  const version = localStorage.getItem("version") || "";
770
-
771
770
  let url = null;
772
771
  let path = jump.path;
773
772
  if (!path) {
774
773
  path = "/";
775
774
  }
776
775
  //是否以http开头
777
- if (path?.indexOf("#") == 0 || url?.indexOf("/#") == 0) {
776
+ if (path?.startsWith("#") || url?.startsWith("/#")) {
778
777
  url = "";
779
778
  } else if (
780
- path.indexOf("http://") == 0 ||
781
- path.indexOf("HTTP://") == 0 ||
782
- path.indexOf("https://") == 0 ||
783
- path.indexOf("HTTPS://") == 0
779
+ path.startsWith("http://") ||
780
+ path.startsWith("HTTP://") ||
781
+ path.startsWith("https://") ||
782
+ path.startsWith("HTTPS://")
784
783
  ) {
785
784
  url = path.split("//")[0] + "//";
786
785
  path = path.split("//")[1];
@@ -1634,6 +1633,7 @@ class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
1634
1633
  leftFixedCols={ltmplConfig.leftFixedCols}
1635
1634
  onChangeResize={this.onChangeResize}
1636
1635
  showEmpty={showEmpty}
1636
+ tableLayout={ltmplConfig.tableLayout}
1637
1637
  /> :
1638
1638
  <QueryTable key={"querytable" + sourceId} sourceId={sourceId}
1639
1639
  // queryTotal={this.queryTotal}