@riil-frontend/component-topology 3.1.8 → 3.1.11
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/CHANGELOG.md +5 -0
- package/build/index.css +1 -1
- package/build/index.js +40 -40
- package/demo/1/345/237/272/346/234/254//345/210/207/346/215/242/345/233/276/346/240/207.md +11 -0
- package/demo/2/347/274/226/350/276/221/346/250/241/345/274/217//345/261/236/346/200/247/351/235/242/346/235/277.md +11 -0
- package/es/core/components/DisplaySettingDrawer/hooks/useDisplaySetting.js +1 -3
- package/es/core/editor/components/settings/propertyViews/group/DataTab/RelateData.js +19 -6
- package/es/core/editor/components/settings/propertyViews/node/NodePropertyView.js +25 -160
- package/es/core/editor/components/settings/propertyViews/node/Setting/Setting.js +76 -0
- package/es/core/editor/components/settings/propertyViews/node/Setting/index.js +2 -0
- package/es/core/editor/components/settings/propertyViews/node/data/Data.js +125 -0
- package/es/core/models/TopoApp.js +1 -1
- package/es/core/viewer/components/plugins/ResourceDetail/ResourceDetailPlugin.js +6 -0
- package/es/models/customIcon.js +16 -11
- package/lib/core/components/DisplaySettingDrawer/hooks/useDisplaySetting.js +1 -3
- package/lib/core/editor/components/settings/propertyViews/group/DataTab/RelateData.js +20 -7
- package/lib/core/editor/components/settings/propertyViews/node/NodePropertyView.js +25 -171
- package/lib/core/editor/components/settings/propertyViews/node/Setting/Setting.js +95 -0
- package/lib/core/editor/components/settings/propertyViews/node/Setting/index.js +11 -0
- package/lib/core/editor/components/settings/propertyViews/node/data/Data.js +145 -0
- package/lib/core/models/TopoApp.js +1 -1
- package/lib/core/viewer/components/plugins/ResourceDetail/ResourceDetailPlugin.js +6 -0
- package/lib/models/customIcon.js +16 -11
- package/package.json +2 -2
|
@@ -49,8 +49,6 @@ export default (function (props) {
|
|
|
49
49
|
|
|
50
50
|
var save = /*#__PURE__*/function () {
|
|
51
51
|
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
|
|
52
|
-
var _displaySettingProps$;
|
|
53
|
-
|
|
54
52
|
var values, prevDisplayConfig, displayConfig, displayConfigDispatchers, extraOnOk;
|
|
55
53
|
return _regeneratorRuntime.wrap(function _callee2$(_context2) {
|
|
56
54
|
while (1) {
|
|
@@ -73,7 +71,7 @@ export default (function (props) {
|
|
|
73
71
|
displayConfigDispatchers.update(displayConfig); // 按配置执行
|
|
74
72
|
|
|
75
73
|
executeByConfig(displayConfig);
|
|
76
|
-
extraOnOk = (displaySettingProps === null || displaySettingProps === void 0 ? void 0 :
|
|
74
|
+
extraOnOk = (displaySettingProps === null || displaySettingProps === void 0 ? void 0 : displaySettingProps.onOk) || (displaySettingProps === null || displaySettingProps === void 0 ? void 0 : displaySettingProps.onDisplaySettingDrawerOk);
|
|
77
75
|
|
|
78
76
|
if (extraOnOk) {
|
|
79
77
|
extraOnOk();
|
|
@@ -2,8 +2,8 @@ import _Collapse from "@alifd/next/es/collapse";
|
|
|
2
2
|
import React, { useEffect } from 'react';
|
|
3
3
|
import GroupNodeList from "./GroupNodeList";
|
|
4
4
|
import GroupAddResourceButton from "./GroupAddResourceButton";
|
|
5
|
-
import CollapseFullheightStyles from "../../../common/GroupNodeList/CollapseFullheight.module.scss";
|
|
6
5
|
import CollapsePanel from "../../../../../../../components/collapse/Panel";
|
|
6
|
+
import CollapseFullheightStyles from "../../../common/GroupNodeList/CollapseFullheight.module.scss";
|
|
7
7
|
export default function GroupRelateData(props) {
|
|
8
8
|
var topo = props.topo,
|
|
9
9
|
topoEditApi = props.topoEditApi,
|
|
@@ -12,15 +12,28 @@ export default function GroupRelateData(props) {
|
|
|
12
12
|
editorProps = props.editorProps;
|
|
13
13
|
|
|
14
14
|
var createResourcePanel = function createResourcePanel() {
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
15
|
+
var _groupDataViewProps$r;
|
|
16
|
+
|
|
17
|
+
var groupDataViewProps = editorProps.groupDataViewProps;
|
|
18
|
+
var headerExtra;
|
|
19
|
+
|
|
20
|
+
if ((groupDataViewProps === null || groupDataViewProps === void 0 ? void 0 : (_groupDataViewProps$r = groupDataViewProps.relateDataProps) === null || _groupDataViewProps$r === void 0 ? void 0 : _groupDataViewProps$r.headerExtra) !== undefined) {
|
|
21
|
+
var _groupDataViewProps$r2;
|
|
22
|
+
|
|
23
|
+
headerExtra = groupDataViewProps === null || groupDataViewProps === void 0 ? void 0 : (_groupDataViewProps$r2 = groupDataViewProps.relateDataProps) === null || _groupDataViewProps$r2 === void 0 ? void 0 : _groupDataViewProps$r2.headerExtra;
|
|
24
|
+
} else {
|
|
25
|
+
headerExtra = /*#__PURE__*/React.createElement(GroupAddResourceButton, {
|
|
19
26
|
topo: topo,
|
|
20
27
|
topoEdit: topoEditApi,
|
|
21
28
|
group: group,
|
|
22
29
|
groupData: values
|
|
23
|
-
})
|
|
30
|
+
});
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
return /*#__PURE__*/React.createElement(CollapsePanel, {
|
|
34
|
+
key: "\u5173\u8054\u8D44\u6E90",
|
|
35
|
+
title: "\u5173\u8054\u8D44\u6E90",
|
|
36
|
+
extra: headerExtra,
|
|
24
37
|
className: CollapseFullheightStyles.panelFullHeight
|
|
25
38
|
}, /*#__PURE__*/React.createElement(GroupNodeList, {
|
|
26
39
|
topo: topo,
|
|
@@ -1,186 +1,51 @@
|
|
|
1
1
|
import _Tab from "@alifd/next/es/tab";
|
|
2
|
-
import _Input from "@alifd/next/es/input";
|
|
3
|
-
import _Form from "@alifd/next/es/form";
|
|
4
|
-
import _Field from "@alifd/next/es/field";
|
|
5
2
|
import _extends from "@babel/runtime/helpers/extends";
|
|
6
|
-
import
|
|
7
|
-
import _Select from "@alifd/next/es/select";
|
|
8
|
-
import React, { useEffect } from 'react';
|
|
9
|
-
import NodeSizeInput from "../../common/NodeSizeInput/NodeSizeInput";
|
|
10
|
-
import textStyles from "../../../../../common/text.module.scss";
|
|
11
|
-
import NodeIconSelect from "./NodeIconSelect";
|
|
12
|
-
import NodeRelateResourceButton from "./data/NodeRelateResourceButton";
|
|
13
|
-
import styles from "./NodePropertyView.module.scss";
|
|
14
|
-
import TabView from "../../common/tab/TabView";
|
|
3
|
+
import React from 'react';
|
|
15
4
|
import useHtElement from "../../../../../common/hooks/useHtElement";
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
return _extends({}, values, {
|
|
21
|
-
'attrObject.customName': values['attrObject.customName'] || values['attrObject.name'],
|
|
22
|
-
'attrObject.bindTopo': values['attrObject.bindTopo'] || '' // 解决切换节点时关联拓扑选项未重置
|
|
23
|
-
|
|
24
|
-
});
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
function getBindType(values) {
|
|
28
|
-
if (values.tag) {
|
|
29
|
-
return 'resource';
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
if (values.attrObject.bindType) {
|
|
33
|
-
return values.attrObject.bindType;
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
return 'none';
|
|
37
|
-
}
|
|
38
|
-
|
|
5
|
+
import TabView from "../../common/tab/TabView";
|
|
6
|
+
import Data from "./data/Data";
|
|
7
|
+
import styles from "./NodePropertyView.module.scss";
|
|
8
|
+
import Setting from "./Setting";
|
|
39
9
|
export default function NodePropertyView(props) {
|
|
40
10
|
var _topo$options$editor;
|
|
41
11
|
|
|
42
12
|
var topo = props.topo,
|
|
43
13
|
topoEditApi = props.topoEditApi,
|
|
44
14
|
values = props.values,
|
|
45
|
-
|
|
15
|
+
onChange = props.onChange,
|
|
46
16
|
editorProps = props.editorProps,
|
|
47
17
|
settingRuntimeState = props.settingRuntimeState;
|
|
48
|
-
var bindType = getBindType(values);
|
|
49
18
|
var node = useHtElement({
|
|
50
19
|
topo: topo,
|
|
51
20
|
id: values.id
|
|
52
21
|
});
|
|
53
22
|
|
|
54
|
-
var field = _Field.useField({
|
|
55
|
-
autoUnmount: false,
|
|
56
|
-
values: parseValues(values),
|
|
57
|
-
onChange: function onChange(name, value) {
|
|
58
|
-
var newValues = field.getValues();
|
|
59
|
-
|
|
60
|
-
_onChange(name, value, newValues);
|
|
61
|
-
}
|
|
62
|
-
});
|
|
63
|
-
|
|
64
|
-
useEffect(function () {
|
|
65
|
-
field.setValues(parseValues(values));
|
|
66
|
-
}, [values]);
|
|
67
|
-
|
|
68
|
-
var setBindType = function setBindType(newBindType) {
|
|
69
|
-
_onChange('attrObject.bindType', newBindType);
|
|
70
|
-
|
|
71
|
-
if (newBindType === 'topo') {//
|
|
72
|
-
}
|
|
73
|
-
};
|
|
74
|
-
|
|
75
|
-
var handleBindTopoChange = function handleBindTopoChange(value, data) {
|
|
76
|
-
// 设置名称为拓扑名称,清空自定义名称
|
|
77
|
-
node.a('name', data.label);
|
|
78
|
-
node.a('customName', null);
|
|
79
|
-
};
|
|
80
|
-
|
|
81
23
|
var renderData = function renderData() {
|
|
82
|
-
|
|
83
|
-
return /*#__PURE__*/React.createElement(_Collapse, {
|
|
84
|
-
defaultExpandedKeys: ['相关资源'],
|
|
85
|
-
style: {
|
|
86
|
-
border: 'none'
|
|
87
|
-
}
|
|
88
|
-
}, /*#__PURE__*/React.createElement(CollapsePanel, {
|
|
89
|
-
key: "\u76F8\u5173\u8D44\u6E90",
|
|
90
|
-
title: "\u76F8\u5173\u8D44\u6E90"
|
|
91
|
-
}, /*#__PURE__*/React.createElement(_Form, {
|
|
92
|
-
field: field,
|
|
93
|
-
labelAlign: "top"
|
|
94
|
-
}, !values.tag && /*#__PURE__*/React.createElement(_Form.Item, {
|
|
95
|
-
label: "\u5173\u8054\u7C7B\u578B"
|
|
96
|
-
}, /*#__PURE__*/React.createElement(_Select, {
|
|
97
|
-
name: "bindType",
|
|
98
|
-
value: bindType,
|
|
99
|
-
style: {
|
|
100
|
-
width: '100%',
|
|
101
|
-
marginRight: 8
|
|
102
|
-
},
|
|
103
|
-
onChange: setBindType
|
|
104
|
-
}, /*#__PURE__*/React.createElement(Option, {
|
|
105
|
-
value: "none"
|
|
106
|
-
}, "\u672A\u5173\u8054"), /*#__PURE__*/React.createElement(Option, {
|
|
107
|
-
value: "resource"
|
|
108
|
-
}, "\u5173\u8054\u8D44\u6E90"), RelateTopoTree && /*#__PURE__*/React.createElement(Option, {
|
|
109
|
-
value: "topo"
|
|
110
|
-
}, "\u5173\u8054\u62D3\u6251"))), bindType === 'resource' && /*#__PURE__*/React.createElement(_Form.Item, {
|
|
111
|
-
label: "\u5173\u8054\u8D44\u6E90"
|
|
112
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
113
|
-
style: {
|
|
114
|
-
display: 'flex'
|
|
115
|
-
}
|
|
116
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
117
|
-
className: textStyles.textEllipsis,
|
|
118
|
-
style: {
|
|
119
|
-
flex: 1,
|
|
120
|
-
paddingRight: 16,
|
|
121
|
-
color: '#4D6277'
|
|
122
|
-
},
|
|
123
|
-
title: values.tag ? values.name : null
|
|
124
|
-
}, values.tag ? values.name : '—'), /*#__PURE__*/React.createElement(NodeRelateResourceButton, {
|
|
125
|
-
node: values,
|
|
126
|
-
topo: topo,
|
|
127
|
-
topoEditApi: topoEditApi
|
|
128
|
-
}))), bindType === 'topo' && RelateTopoTree && /*#__PURE__*/React.createElement(_Form.Item, {
|
|
129
|
-
label: "\u5173\u8054\u62D3\u6251"
|
|
130
|
-
}, /*#__PURE__*/React.createElement(RelateTopoTree, {
|
|
131
|
-
name: "attrObject.bindTopo",
|
|
132
|
-
topo: topo,
|
|
133
|
-
onChange: handleBindTopoChange
|
|
134
|
-
})))));
|
|
24
|
+
return /*#__PURE__*/React.createElement(Data, props);
|
|
135
25
|
};
|
|
136
26
|
|
|
137
|
-
var
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
labelAlign: "top"
|
|
141
|
-
}, /*#__PURE__*/React.createElement(_Form.Item, null, /*#__PURE__*/React.createElement(_Collapse, {
|
|
142
|
-
defaultExpandedKeys: ['显示设置'],
|
|
143
|
-
style: {
|
|
144
|
-
border: 'none'
|
|
145
|
-
}
|
|
146
|
-
}, /*#__PURE__*/React.createElement(CollapsePanel, {
|
|
147
|
-
key: "\u663E\u793A\u8BBE\u7F6E",
|
|
148
|
-
title: "\u663E\u793A\u8BBE\u7F6E"
|
|
149
|
-
}, /*#__PURE__*/React.createElement(_Form.Item, {
|
|
150
|
-
label: "\u56FE\u7247\u540D\u79F0"
|
|
151
|
-
}, /*#__PURE__*/React.createElement(_Input, {
|
|
152
|
-
name: "attrObject.customName"
|
|
153
|
-
})), /*#__PURE__*/React.createElement(_Form.Item, {
|
|
154
|
-
label: "\u663E\u793A\u56FE\u7247"
|
|
155
|
-
}, /*#__PURE__*/React.createElement(NodeIconSelect, {
|
|
156
|
-
name: "image",
|
|
157
|
-
topo: topo
|
|
158
|
-
})), /*#__PURE__*/React.createElement(_Form.Item, {
|
|
159
|
-
label: "\u56FE\u7247\u5C3A\u5BF8"
|
|
160
|
-
}, /*#__PURE__*/React.createElement(NodeSizeInput, {
|
|
161
|
-
node: values.id,
|
|
162
|
-
value: {
|
|
163
|
-
width: values.width,
|
|
164
|
-
height: values.height
|
|
165
|
-
},
|
|
166
|
-
onChange: function onChange(size) {
|
|
167
|
-
_onChange('width', size.width);
|
|
168
|
-
|
|
169
|
-
_onChange('height', size.height);
|
|
170
|
-
},
|
|
171
|
-
settingRuntimeState: settingRuntimeState
|
|
172
|
-
}))))));
|
|
27
|
+
var renderSetting = function renderSetting() {
|
|
28
|
+
var nodeSettingViewProps = editorProps.nodeSettingViewProps;
|
|
29
|
+
return /*#__PURE__*/React.createElement(Setting, _extends({}, props, nodeSettingViewProps));
|
|
173
30
|
}; // 未绑定资源的节点,根据参数控制是否可关联资源
|
|
174
31
|
|
|
175
32
|
|
|
176
33
|
var showRelateResource = !!values.tag || !values.tag && ((_topo$options$editor = topo.options.editor) === null || _topo$options$editor === void 0 ? void 0 : _topo$options$editor.enableRelateResource) !== false;
|
|
34
|
+
var content;
|
|
35
|
+
|
|
36
|
+
if (showRelateResource) {
|
|
37
|
+
content = /*#__PURE__*/React.createElement(TabView, null, /*#__PURE__*/React.createElement(_Tab.Item, {
|
|
38
|
+
title: "\u6570\u636E",
|
|
39
|
+
key: "1"
|
|
40
|
+
}, renderData()), /*#__PURE__*/React.createElement(_Tab.Item, {
|
|
41
|
+
title: "\u8BBE\u7F6E",
|
|
42
|
+
key: "2"
|
|
43
|
+
}, renderSetting()));
|
|
44
|
+
} else {
|
|
45
|
+
content = renderSetting();
|
|
46
|
+
}
|
|
47
|
+
|
|
177
48
|
return /*#__PURE__*/React.createElement("div", {
|
|
178
49
|
className: styles.NodePropertyView
|
|
179
|
-
},
|
|
180
|
-
title: "\u6570\u636E",
|
|
181
|
-
key: "1"
|
|
182
|
-
}, renderData()), /*#__PURE__*/React.createElement(_Tab.Item, {
|
|
183
|
-
title: "\u8BBE\u7F6E",
|
|
184
|
-
key: "2"
|
|
185
|
-
}, renderViewSetting())) : renderViewSetting());
|
|
50
|
+
}, content);
|
|
186
51
|
}
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
import _Form from "@alifd/next/es/form";
|
|
2
|
+
import _Input from "@alifd/next/es/input";
|
|
3
|
+
import _Field from "@alifd/next/es/field";
|
|
4
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
5
|
+
import _Collapse from "@alifd/next/es/collapse";
|
|
6
|
+
import React, { useEffect } from 'react';
|
|
7
|
+
import NodeSizeInput from "../../../common/NodeSizeInput/NodeSizeInput";
|
|
8
|
+
import NodeIconSelect from "../NodeIconSelect";
|
|
9
|
+
var CollapsePanel = _Collapse.Panel;
|
|
10
|
+
|
|
11
|
+
function parseValues(values) {
|
|
12
|
+
return _extends({}, values, {
|
|
13
|
+
'attrObject.customName': values['attrObject.customName'] || values['attrObject.name'],
|
|
14
|
+
'attrObject.bindTopo': values['attrObject.bindTopo'] || '' // 解决切换节点时关联拓扑选项未重置
|
|
15
|
+
|
|
16
|
+
});
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
export default function Setting(props) {
|
|
20
|
+
var topo = props.topo,
|
|
21
|
+
values = props.values,
|
|
22
|
+
_onChange = props.onChange,
|
|
23
|
+
editorProps = props.editorProps,
|
|
24
|
+
settingRuntimeState = props.settingRuntimeState,
|
|
25
|
+
_props$showImageSetti = props.showImageSetting,
|
|
26
|
+
showImageSetting = _props$showImageSetti === void 0 ? true : _props$showImageSetti;
|
|
27
|
+
|
|
28
|
+
var field = _Field.useField({
|
|
29
|
+
autoUnmount: false,
|
|
30
|
+
values: parseValues(values),
|
|
31
|
+
onChange: function onChange(name, value) {
|
|
32
|
+
var newValues = field.getValues();
|
|
33
|
+
|
|
34
|
+
_onChange(name, value, newValues);
|
|
35
|
+
}
|
|
36
|
+
});
|
|
37
|
+
|
|
38
|
+
useEffect(function () {
|
|
39
|
+
field.setValues(parseValues(values));
|
|
40
|
+
}, [values]);
|
|
41
|
+
return /*#__PURE__*/React.createElement(_Form, {
|
|
42
|
+
field: field,
|
|
43
|
+
labelAlign: "top"
|
|
44
|
+
}, /*#__PURE__*/React.createElement(_Form.Item, null, /*#__PURE__*/React.createElement(_Collapse, {
|
|
45
|
+
defaultExpandedKeys: ['显示设置'],
|
|
46
|
+
style: {
|
|
47
|
+
border: 'none'
|
|
48
|
+
}
|
|
49
|
+
}, /*#__PURE__*/React.createElement(CollapsePanel, {
|
|
50
|
+
key: "\u663E\u793A\u8BBE\u7F6E",
|
|
51
|
+
title: "\u663E\u793A\u8BBE\u7F6E"
|
|
52
|
+
}, /*#__PURE__*/React.createElement(_Form.Item, {
|
|
53
|
+
label: "\u56FE\u7247\u540D\u79F01"
|
|
54
|
+
}, /*#__PURE__*/React.createElement(_Input, {
|
|
55
|
+
name: "attrObject.customName"
|
|
56
|
+
})), showImageSetting && /*#__PURE__*/React.createElement(_Form.Item, {
|
|
57
|
+
label: "\u663E\u793A\u56FE\u7247"
|
|
58
|
+
}, /*#__PURE__*/React.createElement(NodeIconSelect, {
|
|
59
|
+
name: "image",
|
|
60
|
+
topo: topo
|
|
61
|
+
})), /*#__PURE__*/React.createElement(_Form.Item, {
|
|
62
|
+
label: "\u56FE\u7247\u5C3A\u5BF8"
|
|
63
|
+
}, /*#__PURE__*/React.createElement(NodeSizeInput, {
|
|
64
|
+
node: values.id,
|
|
65
|
+
value: {
|
|
66
|
+
width: values.width,
|
|
67
|
+
height: values.height
|
|
68
|
+
},
|
|
69
|
+
onChange: function onChange(size) {
|
|
70
|
+
_onChange('width', size.width);
|
|
71
|
+
|
|
72
|
+
_onChange('height', size.height);
|
|
73
|
+
},
|
|
74
|
+
settingRuntimeState: settingRuntimeState
|
|
75
|
+
}))))));
|
|
76
|
+
}
|
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
import _Form from "@alifd/next/es/form";
|
|
2
|
+
import _Field from "@alifd/next/es/field";
|
|
3
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
4
|
+
import _Collapse from "@alifd/next/es/collapse";
|
|
5
|
+
import _Select from "@alifd/next/es/select";
|
|
6
|
+
import React, { useEffect } from 'react';
|
|
7
|
+
import useHtElement from "../../../../../../common/hooks/useHtElement";
|
|
8
|
+
import textStyles from "../../../../../../common/text.module.scss";
|
|
9
|
+
import NodeRelateResourceButton from "./NodeRelateResourceButton";
|
|
10
|
+
var Option = _Select.Option;
|
|
11
|
+
var CollapsePanel = _Collapse.Panel;
|
|
12
|
+
|
|
13
|
+
function parseValues(values) {
|
|
14
|
+
return _extends({}, values, {
|
|
15
|
+
'attrObject.customName': values['attrObject.customName'] || values['attrObject.name'],
|
|
16
|
+
'attrObject.bindTopo': values['attrObject.bindTopo'] || '' // 解决切换节点时关联拓扑选项未重置
|
|
17
|
+
|
|
18
|
+
});
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
function getBindType(values) {
|
|
22
|
+
if (values.tag) {
|
|
23
|
+
return 'resource';
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
if (values.attrObject.bindType) {
|
|
27
|
+
return values.attrObject.bindType;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
return 'none';
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
export default function Data(props) {
|
|
34
|
+
var topo = props.topo,
|
|
35
|
+
topoEditApi = props.topoEditApi,
|
|
36
|
+
values = props.values,
|
|
37
|
+
_onChange = props.onChange,
|
|
38
|
+
editorProps = props.editorProps;
|
|
39
|
+
var bindType = getBindType(values);
|
|
40
|
+
var node = useHtElement({
|
|
41
|
+
topo: topo,
|
|
42
|
+
id: values.id
|
|
43
|
+
});
|
|
44
|
+
|
|
45
|
+
var field = _Field.useField({
|
|
46
|
+
autoUnmount: false,
|
|
47
|
+
values: parseValues(values),
|
|
48
|
+
onChange: function onChange(name, value) {
|
|
49
|
+
var newValues = field.getValues();
|
|
50
|
+
|
|
51
|
+
_onChange(name, value, newValues);
|
|
52
|
+
}
|
|
53
|
+
});
|
|
54
|
+
|
|
55
|
+
useEffect(function () {
|
|
56
|
+
field.setValues(parseValues(values));
|
|
57
|
+
}, [values]);
|
|
58
|
+
|
|
59
|
+
var setBindType = function setBindType(newBindType) {
|
|
60
|
+
_onChange('attrObject.bindType', newBindType);
|
|
61
|
+
|
|
62
|
+
if (newBindType === 'topo') {//
|
|
63
|
+
}
|
|
64
|
+
};
|
|
65
|
+
|
|
66
|
+
var handleBindTopoChange = function handleBindTopoChange(value, data) {
|
|
67
|
+
// 设置名称为拓扑名称,清空自定义名称
|
|
68
|
+
node.a('name', data.label);
|
|
69
|
+
node.a('customName', null);
|
|
70
|
+
};
|
|
71
|
+
|
|
72
|
+
var RelateTopoTree = editorProps === null || editorProps === void 0 ? void 0 : editorProps.relateTopoTree;
|
|
73
|
+
return /*#__PURE__*/React.createElement(_Collapse, {
|
|
74
|
+
defaultExpandedKeys: ['相关资源'],
|
|
75
|
+
style: {
|
|
76
|
+
border: 'none'
|
|
77
|
+
}
|
|
78
|
+
}, /*#__PURE__*/React.createElement(CollapsePanel, {
|
|
79
|
+
key: "\u76F8\u5173\u8D44\u6E90",
|
|
80
|
+
title: "\u76F8\u5173\u8D44\u6E90"
|
|
81
|
+
}, /*#__PURE__*/React.createElement(_Form, {
|
|
82
|
+
field: field,
|
|
83
|
+
labelAlign: "top"
|
|
84
|
+
}, !values.tag && /*#__PURE__*/React.createElement(_Form.Item, {
|
|
85
|
+
label: "\u5173\u8054\u7C7B\u578B"
|
|
86
|
+
}, /*#__PURE__*/React.createElement(_Select, {
|
|
87
|
+
name: "bindType",
|
|
88
|
+
value: bindType,
|
|
89
|
+
style: {
|
|
90
|
+
width: '100%',
|
|
91
|
+
marginRight: 8
|
|
92
|
+
},
|
|
93
|
+
onChange: setBindType
|
|
94
|
+
}, /*#__PURE__*/React.createElement(Option, {
|
|
95
|
+
value: "none"
|
|
96
|
+
}, "\u672A\u5173\u8054"), /*#__PURE__*/React.createElement(Option, {
|
|
97
|
+
value: "resource"
|
|
98
|
+
}, "\u5173\u8054\u8D44\u6E90"), RelateTopoTree && /*#__PURE__*/React.createElement(Option, {
|
|
99
|
+
value: "topo"
|
|
100
|
+
}, "\u5173\u8054\u62D3\u6251"))), bindType === 'resource' && /*#__PURE__*/React.createElement(_Form.Item, {
|
|
101
|
+
label: "\u5173\u8054\u8D44\u6E90"
|
|
102
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
103
|
+
style: {
|
|
104
|
+
display: 'flex'
|
|
105
|
+
}
|
|
106
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
107
|
+
className: textStyles.textEllipsis,
|
|
108
|
+
style: {
|
|
109
|
+
flex: 1,
|
|
110
|
+
paddingRight: 16,
|
|
111
|
+
color: '#4D6277'
|
|
112
|
+
},
|
|
113
|
+
title: values.tag ? values.name : null
|
|
114
|
+
}, values.tag ? values.name : '—'), /*#__PURE__*/React.createElement(NodeRelateResourceButton, {
|
|
115
|
+
node: values,
|
|
116
|
+
topo: topo,
|
|
117
|
+
topoEditApi: topoEditApi
|
|
118
|
+
}))), bindType === 'topo' && RelateTopoTree && /*#__PURE__*/React.createElement(_Form.Item, {
|
|
119
|
+
label: "\u5173\u8054\u62D3\u6251"
|
|
120
|
+
}, /*#__PURE__*/React.createElement(RelateTopoTree, {
|
|
121
|
+
name: "attrObject.bindTopo",
|
|
122
|
+
topo: topo,
|
|
123
|
+
onChange: handleBindTopoChange
|
|
124
|
+
})))));
|
|
125
|
+
}
|
|
@@ -20,7 +20,7 @@ import { updateEdgeExpanded } from "../utils/edgeUtil";
|
|
|
20
20
|
import PluginManager from "./PluginManager";
|
|
21
21
|
import topoFactory from "./topoFactory"; // eslint-disable-next-line no-undef
|
|
22
22
|
|
|
23
|
-
var version = typeof "3.1.
|
|
23
|
+
var version = typeof "3.1.11" === 'string' ? "3.1.11" : null;
|
|
24
24
|
console.info("\u62D3\u6251\u7248\u672C: " + version);
|
|
25
25
|
/**
|
|
26
26
|
* 拓扑显示和编辑
|
|
@@ -5,6 +5,12 @@ import ResourceDetail from "./ResourceDetail";
|
|
|
5
5
|
function ResourceDetailPlugin(props) {
|
|
6
6
|
var viewerProps = props.viewerProps;
|
|
7
7
|
var resourceDetailProps = viewerProps === null || viewerProps === void 0 ? void 0 : viewerProps.resourceDetailProps;
|
|
8
|
+
var hideResourceDetailDrawer = (viewerProps === null || viewerProps === void 0 ? void 0 : viewerProps.hideResourceDetailDrawer) === true;
|
|
9
|
+
|
|
10
|
+
if (hideResourceDetailDrawer) {
|
|
11
|
+
return null;
|
|
12
|
+
}
|
|
13
|
+
|
|
8
14
|
return /*#__PURE__*/React.createElement(ResourceDetail, _extends({}, props, resourceDetailProps));
|
|
9
15
|
}
|
|
10
16
|
|
package/es/models/customIcon.js
CHANGED
|
@@ -153,7 +153,7 @@ export default function (engine) {
|
|
|
153
153
|
var _this3 = this;
|
|
154
154
|
|
|
155
155
|
return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
|
|
156
|
-
var data;
|
|
156
|
+
var data, allIcons, newIcons;
|
|
157
157
|
return _regeneratorRuntime.wrap(function _callee4$(_context4) {
|
|
158
158
|
while (1) {
|
|
159
159
|
switch (_context4.prev = _context4.next) {
|
|
@@ -161,25 +161,30 @@ export default function (engine) {
|
|
|
161
161
|
data = payload.data;
|
|
162
162
|
|
|
163
163
|
_this3.update({
|
|
164
|
-
visible: false
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
container: []
|
|
168
|
-
}
|
|
169
|
-
});
|
|
164
|
+
visible: false
|
|
165
|
+
}); // 注册
|
|
166
|
+
|
|
170
167
|
|
|
171
168
|
data.forEach(function (icon) {
|
|
172
169
|
var iconUrl = topoService.icon.getIconImageUrl(icon.id);
|
|
173
170
|
window.ht.Default.setImage(getCustomIconHtId(icon.id), iconUrl);
|
|
171
|
+
});
|
|
172
|
+
_context4.next = 5;
|
|
173
|
+
return _this3.loadCustomIcons();
|
|
174
|
+
|
|
175
|
+
case 5:
|
|
176
|
+
allIcons = _context4.sent;
|
|
177
|
+
newIcons = allIcons.node.filter(function (icon) {
|
|
178
|
+
return !!data.find(function (item) {
|
|
179
|
+
return item.id === icon.id;
|
|
180
|
+
});
|
|
174
181
|
}); // 通知ht
|
|
175
182
|
|
|
176
183
|
engine.view.topoClient.emitEvent('topo_shape_upload_finish', _extends({}, payload, {
|
|
177
|
-
data: transformCustomIcons2HtIcons(
|
|
184
|
+
data: transformCustomIcons2HtIcons(newIcons)
|
|
178
185
|
}));
|
|
179
|
-
_context4.next = 6;
|
|
180
|
-
return _this3.loadCustomIcons();
|
|
181
186
|
|
|
182
|
-
case
|
|
187
|
+
case 8:
|
|
183
188
|
case "end":
|
|
184
189
|
return _context4.stop();
|
|
185
190
|
}
|
|
@@ -60,8 +60,6 @@ var _default = function _default(props) {
|
|
|
60
60
|
|
|
61
61
|
var save = /*#__PURE__*/function () {
|
|
62
62
|
var _ref2 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
|
|
63
|
-
var _displaySettingProps$;
|
|
64
|
-
|
|
65
63
|
var values, prevDisplayConfig, displayConfig, displayConfigDispatchers, extraOnOk;
|
|
66
64
|
return _regenerator["default"].wrap(function _callee2$(_context2) {
|
|
67
65
|
while (1) {
|
|
@@ -84,7 +82,7 @@ var _default = function _default(props) {
|
|
|
84
82
|
displayConfigDispatchers.update(displayConfig); // 按配置执行
|
|
85
83
|
|
|
86
84
|
executeByConfig(displayConfig);
|
|
87
|
-
extraOnOk = (displaySettingProps === null || displaySettingProps === void 0 ? void 0 :
|
|
85
|
+
extraOnOk = (displaySettingProps === null || displaySettingProps === void 0 ? void 0 : displaySettingProps.onOk) || (displaySettingProps === null || displaySettingProps === void 0 ? void 0 : displaySettingProps.onDisplaySettingDrawerOk);
|
|
88
86
|
|
|
89
87
|
if (extraOnOk) {
|
|
90
88
|
extraOnOk();
|
|
@@ -13,10 +13,10 @@ var _GroupNodeList = _interopRequireDefault(require("./GroupNodeList"));
|
|
|
13
13
|
|
|
14
14
|
var _GroupAddResourceButton = _interopRequireDefault(require("./GroupAddResourceButton"));
|
|
15
15
|
|
|
16
|
-
var _CollapseFullheightModule = _interopRequireDefault(require("../../../common/GroupNodeList/CollapseFullheight.module.scss"));
|
|
17
|
-
|
|
18
16
|
var _Panel = _interopRequireDefault(require("../../../../../../../components/collapse/Panel"));
|
|
19
17
|
|
|
18
|
+
var _CollapseFullheightModule = _interopRequireDefault(require("../../../common/GroupNodeList/CollapseFullheight.module.scss"));
|
|
19
|
+
|
|
20
20
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
21
21
|
|
|
22
22
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
@@ -29,15 +29,28 @@ function GroupRelateData(props) {
|
|
|
29
29
|
editorProps = props.editorProps;
|
|
30
30
|
|
|
31
31
|
var createResourcePanel = function createResourcePanel() {
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
32
|
+
var _groupDataViewProps$r;
|
|
33
|
+
|
|
34
|
+
var groupDataViewProps = editorProps.groupDataViewProps;
|
|
35
|
+
var headerExtra;
|
|
36
|
+
|
|
37
|
+
if ((groupDataViewProps === null || groupDataViewProps === void 0 ? void 0 : (_groupDataViewProps$r = groupDataViewProps.relateDataProps) === null || _groupDataViewProps$r === void 0 ? void 0 : _groupDataViewProps$r.headerExtra) !== undefined) {
|
|
38
|
+
var _groupDataViewProps$r2;
|
|
39
|
+
|
|
40
|
+
headerExtra = groupDataViewProps === null || groupDataViewProps === void 0 ? void 0 : (_groupDataViewProps$r2 = groupDataViewProps.relateDataProps) === null || _groupDataViewProps$r2 === void 0 ? void 0 : _groupDataViewProps$r2.headerExtra;
|
|
41
|
+
} else {
|
|
42
|
+
headerExtra = /*#__PURE__*/_react["default"].createElement(_GroupAddResourceButton["default"], {
|
|
36
43
|
topo: topo,
|
|
37
44
|
topoEdit: topoEditApi,
|
|
38
45
|
group: group,
|
|
39
46
|
groupData: values
|
|
40
|
-
})
|
|
47
|
+
});
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
return /*#__PURE__*/_react["default"].createElement(_Panel["default"], {
|
|
51
|
+
key: "\u5173\u8054\u8D44\u6E90",
|
|
52
|
+
title: "\u5173\u8054\u8D44\u6E90",
|
|
53
|
+
extra: headerExtra,
|
|
41
54
|
className: _CollapseFullheightModule["default"].panelFullHeight
|
|
42
55
|
}, /*#__PURE__*/_react["default"].createElement(_GroupNodeList["default"], {
|
|
43
56
|
topo: topo,
|