@logicflow/extension 1.2.0-alpha.4 → 1.2.0-alpha.7
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/cjs/NodeResize/Control/Control.js +8 -4
- package/cjs/NodeResize/Node/DiamondResize.js +10 -8
- package/cjs/NodeResize/Node/EllipseResize.js +10 -8
- package/cjs/NodeResize/Node/HtmlResize.js +10 -8
- package/cjs/NodeResize/Node/RectResize.js +10 -8
- package/cjs/bpmn-adapter/index.js +1 -1
- package/cjs/components/highlight/index.js +187 -0
- package/cjs/components/mini-map/index.js +5 -0
- package/cjs/components/selection-select/index.js +22 -2
- package/cjs/index.js +1 -0
- package/cjs/materials/group/GroupNode.js +22 -12
- package/es/NodeResize/Control/Control.js +8 -4
- package/es/NodeResize/Node/DiamondResize.d.ts +1 -1
- package/es/NodeResize/Node/DiamondResize.js +10 -8
- package/es/NodeResize/Node/EllipseResize.d.ts +1 -1
- package/es/NodeResize/Node/EllipseResize.js +10 -8
- package/es/NodeResize/Node/HtmlResize.d.ts +1 -1
- package/es/NodeResize/Node/HtmlResize.js +10 -8
- package/es/NodeResize/Node/RectResize.d.ts +1 -1
- package/es/NodeResize/Node/RectResize.js +10 -8
- package/es/bpmn-adapter/index.js +1 -1
- package/es/components/highlight/index.d.ts +21 -0
- package/es/components/highlight/index.js +184 -0
- package/es/components/mini-map/index.js +5 -0
- package/es/components/selection-select/index.d.ts +1 -0
- package/es/components/selection-select/index.js +22 -2
- package/es/index.d.ts +1 -0
- package/es/index.js +1 -0
- package/es/materials/group/GroupNode.js +22 -12
- package/lib/AutoLayout.js +1 -1
- package/lib/BpmnAdapter.js +1 -1
- package/lib/BpmnElement.js +1 -1
- package/lib/ContextMenu.js +1 -1
- package/lib/Control.js +1 -1
- package/lib/CurvedEdge.js +1 -1
- package/lib/DndPanel.js +1 -1
- package/lib/EnLocale.js +1 -1
- package/lib/FlowPath.js +1 -1
- package/lib/Group.js +1 -1
- package/lib/Highlight.js +1 -0
- package/lib/InsertNodeInPolyline.js +1 -1
- package/lib/Menu.js +1 -1
- package/lib/MiniMap.js +1 -1
- package/lib/NodeResize.js +1 -1
- package/lib/RectLabelNode.js +1 -1
- package/lib/SelectionSelect.js +1 -1
- package/lib/Snapshot.js +1 -1
- package/lib/TurboAdapter.js +1 -1
- package/lib/lfJson2Xml.js +1 -1
- package/lib/lfXml2Json.js +1 -1
- package/package.json +2 -2
- package/types/NodeResize/Node/DiamondResize.d.ts +1 -1
- package/types/NodeResize/Node/EllipseResize.d.ts +1 -1
- package/types/NodeResize/Node/HtmlResize.d.ts +1 -1
- package/types/NodeResize/Node/RectResize.d.ts +1 -1
- package/types/components/highlight/index.d.ts +21 -0
- package/types/components/selection-select/index.d.ts +1 -0
- package/types/index.d.ts +1 -0
|
@@ -37,9 +37,11 @@ var Control = /** @class */ (function (_super) {
|
|
|
37
37
|
_this.updatePosition = function (_a) {
|
|
38
38
|
var deltaX = _a.deltaX, deltaY = _a.deltaY;
|
|
39
39
|
var _b = _this.nodeModel, x = _b.x, y = _b.y;
|
|
40
|
-
_this.nodeModel.x = x + deltaX / 2;
|
|
41
|
-
_this.nodeModel.y = y + deltaY / 2;
|
|
42
40
|
_this.nodeModel.moveText(deltaX / 2, deltaY / 2);
|
|
41
|
+
_this.nodeModel.updateAttributes({
|
|
42
|
+
x: x + deltaX / 2,
|
|
43
|
+
y: y + deltaY / 2,
|
|
44
|
+
});
|
|
43
45
|
};
|
|
44
46
|
// 计算control拖动后,节点的宽高
|
|
45
47
|
_this.getResize = function (_a) {
|
|
@@ -93,14 +95,16 @@ var Control = /** @class */ (function (_super) {
|
|
|
93
95
|
}
|
|
94
96
|
_this.updatePosition({ deltaX: deltaX, deltaY: deltaY });
|
|
95
97
|
// 更新宽高
|
|
96
|
-
_this.nodeModel.width = size.width;
|
|
97
|
-
_this.nodeModel.height = size.height;
|
|
98
98
|
_this.nodeModel.setProperties({
|
|
99
99
|
nodeSize: {
|
|
100
100
|
width: size.width,
|
|
101
101
|
height: size.height,
|
|
102
102
|
},
|
|
103
103
|
});
|
|
104
|
+
_this.nodeModel.updateAttributes({
|
|
105
|
+
width: size.width,
|
|
106
|
+
height: size.height,
|
|
107
|
+
});
|
|
104
108
|
var edges = _this.getNodeEdges(id);
|
|
105
109
|
var beforeNode = {
|
|
106
110
|
x: x,
|
|
@@ -29,14 +29,8 @@ var ControlGroup_1 = require("../Control/ControlGroup");
|
|
|
29
29
|
var Polygon_1 = require("../BasicShape/Polygon");
|
|
30
30
|
var DiamondResizeModel = /** @class */ (function (_super) {
|
|
31
31
|
__extends(DiamondResizeModel, _super);
|
|
32
|
-
function DiamondResizeModel(
|
|
33
|
-
|
|
34
|
-
var nodeSize = _this.properties.nodeSize;
|
|
35
|
-
if (nodeSize) {
|
|
36
|
-
_this.rx = nodeSize.rx;
|
|
37
|
-
_this.ry = nodeSize.ry;
|
|
38
|
-
}
|
|
39
|
-
return _this;
|
|
32
|
+
function DiamondResizeModel() {
|
|
33
|
+
return _super !== null && _super.apply(this, arguments) || this;
|
|
40
34
|
}
|
|
41
35
|
DiamondResizeModel.prototype.initNodeData = function (data) {
|
|
42
36
|
_super.prototype.initNodeData.call(this, data);
|
|
@@ -46,6 +40,14 @@ var DiamondResizeModel = /** @class */ (function (_super) {
|
|
|
46
40
|
this.maxHeight = 2000;
|
|
47
41
|
this.gridSize = 1;
|
|
48
42
|
};
|
|
43
|
+
DiamondResizeModel.prototype.init = function () {
|
|
44
|
+
_super.prototype.init.call(this);
|
|
45
|
+
var nodeSize = this.properties.nodeSize;
|
|
46
|
+
if (nodeSize) {
|
|
47
|
+
this.rx = nodeSize.rx;
|
|
48
|
+
this.ry = nodeSize.ry;
|
|
49
|
+
}
|
|
50
|
+
};
|
|
49
51
|
DiamondResizeModel.prototype.getOutlineStyle = function () {
|
|
50
52
|
var style = _super.prototype.getOutlineStyle.call(this);
|
|
51
53
|
style.stroke = 'none';
|
|
@@ -17,14 +17,8 @@ var core_1 = require("@logicflow/core");
|
|
|
17
17
|
var ControlGroup_1 = require("../Control/ControlGroup");
|
|
18
18
|
var EllipseResizeModel = /** @class */ (function (_super) {
|
|
19
19
|
__extends(EllipseResizeModel, _super);
|
|
20
|
-
function EllipseResizeModel(
|
|
21
|
-
|
|
22
|
-
var nodeSize = _this.properties.nodeSize;
|
|
23
|
-
if (nodeSize) {
|
|
24
|
-
_this.rx = nodeSize.rx;
|
|
25
|
-
_this.ry = nodeSize.ry;
|
|
26
|
-
}
|
|
27
|
-
return _this;
|
|
20
|
+
function EllipseResizeModel() {
|
|
21
|
+
return _super !== null && _super.apply(this, arguments) || this;
|
|
28
22
|
}
|
|
29
23
|
EllipseResizeModel.prototype.initNodeData = function (data) {
|
|
30
24
|
_super.prototype.initNodeData.call(this, data);
|
|
@@ -33,6 +27,14 @@ var EllipseResizeModel = /** @class */ (function (_super) {
|
|
|
33
27
|
this.maxWidth = 2000;
|
|
34
28
|
this.maxHeight = 2000;
|
|
35
29
|
};
|
|
30
|
+
EllipseResizeModel.prototype.init = function () {
|
|
31
|
+
_super.prototype.init.call(this);
|
|
32
|
+
var nodeSize = this.properties.nodeSize;
|
|
33
|
+
if (nodeSize) {
|
|
34
|
+
this.rx = nodeSize.rx;
|
|
35
|
+
this.ry = nodeSize.ry;
|
|
36
|
+
}
|
|
37
|
+
};
|
|
36
38
|
EllipseResizeModel.prototype.getOutlineStyle = function () {
|
|
37
39
|
var style = _super.prototype.getOutlineStyle.call(this);
|
|
38
40
|
style.stroke = 'none';
|
|
@@ -17,14 +17,8 @@ var core_1 = require("@logicflow/core");
|
|
|
17
17
|
var ControlGroup_1 = require("../Control/ControlGroup");
|
|
18
18
|
var HtmlResizeModel = /** @class */ (function (_super) {
|
|
19
19
|
__extends(HtmlResizeModel, _super);
|
|
20
|
-
function HtmlResizeModel(
|
|
21
|
-
|
|
22
|
-
var nodeSize = _this.properties.nodeSize;
|
|
23
|
-
if (nodeSize) {
|
|
24
|
-
_this.width = nodeSize.width;
|
|
25
|
-
_this.height = nodeSize.height;
|
|
26
|
-
}
|
|
27
|
-
return _this;
|
|
20
|
+
function HtmlResizeModel() {
|
|
21
|
+
return _super !== null && _super.apply(this, arguments) || this;
|
|
28
22
|
}
|
|
29
23
|
HtmlResizeModel.prototype.initNodeData = function (data) {
|
|
30
24
|
_super.prototype.initNodeData.call(this, data);
|
|
@@ -33,6 +27,14 @@ var HtmlResizeModel = /** @class */ (function (_super) {
|
|
|
33
27
|
this.maxWidth = 2000;
|
|
34
28
|
this.maxHeight = 2000;
|
|
35
29
|
};
|
|
30
|
+
HtmlResizeModel.prototype.init = function () {
|
|
31
|
+
_super.prototype.init.call(this);
|
|
32
|
+
var nodeSize = this.properties.nodeSize;
|
|
33
|
+
if (nodeSize) {
|
|
34
|
+
this.width = nodeSize.width;
|
|
35
|
+
this.height = nodeSize.height;
|
|
36
|
+
}
|
|
37
|
+
};
|
|
36
38
|
HtmlResizeModel.prototype.getOutlineStyle = function () {
|
|
37
39
|
var style = _super.prototype.getOutlineStyle.call(this);
|
|
38
40
|
style.stroke = 'none';
|
|
@@ -17,14 +17,8 @@ var core_1 = require("@logicflow/core");
|
|
|
17
17
|
var ControlGroup_1 = require("../Control/ControlGroup");
|
|
18
18
|
var RectResizeModel = /** @class */ (function (_super) {
|
|
19
19
|
__extends(RectResizeModel, _super);
|
|
20
|
-
function RectResizeModel(
|
|
21
|
-
|
|
22
|
-
var nodeSize = _this.properties.nodeSize;
|
|
23
|
-
if (nodeSize) {
|
|
24
|
-
_this.width = nodeSize.width;
|
|
25
|
-
_this.height = nodeSize.height;
|
|
26
|
-
}
|
|
27
|
-
return _this;
|
|
20
|
+
function RectResizeModel() {
|
|
21
|
+
return _super !== null && _super.apply(this, arguments) || this;
|
|
28
22
|
}
|
|
29
23
|
RectResizeModel.prototype.initNodeData = function (data) {
|
|
30
24
|
_super.prototype.initNodeData.call(this, data);
|
|
@@ -33,6 +27,14 @@ var RectResizeModel = /** @class */ (function (_super) {
|
|
|
33
27
|
this.maxWidth = 2000;
|
|
34
28
|
this.maxHeight = 2000;
|
|
35
29
|
};
|
|
30
|
+
RectResizeModel.prototype.init = function () {
|
|
31
|
+
_super.prototype.init.call(this);
|
|
32
|
+
var nodeSize = this.properties.nodeSize;
|
|
33
|
+
if (nodeSize) {
|
|
34
|
+
this.width = nodeSize.width;
|
|
35
|
+
this.height = nodeSize.height;
|
|
36
|
+
}
|
|
37
|
+
};
|
|
36
38
|
RectResizeModel.prototype.getOutlineStyle = function () {
|
|
37
39
|
var style = _super.prototype.getOutlineStyle.call(this);
|
|
38
40
|
style.stroke = 'none';
|
|
@@ -179,7 +179,7 @@ function convertLf2ProcessData(bpmnProcessData, data) {
|
|
|
179
179
|
return edgeConfig;
|
|
180
180
|
});
|
|
181
181
|
// @see https://github.com/didi/LogicFlow/issues/325
|
|
182
|
-
// 需要保证
|
|
182
|
+
// 需要保证incoming在outgoing之前
|
|
183
183
|
data.edges.forEach(function (edge) {
|
|
184
184
|
var sourceNode = nodeMap.get(edge.sourceNodeId);
|
|
185
185
|
if (!sourceNode['bpmn:outgoing']) {
|
|
@@ -0,0 +1,187 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __read = (this && this.__read) || function (o, n) {
|
|
14
|
+
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
15
|
+
if (!m) return o;
|
|
16
|
+
var i = m.call(o), r, ar = [], e;
|
|
17
|
+
try {
|
|
18
|
+
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
19
|
+
}
|
|
20
|
+
catch (error) { e = { error: error }; }
|
|
21
|
+
finally {
|
|
22
|
+
try {
|
|
23
|
+
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
24
|
+
}
|
|
25
|
+
finally { if (e) throw e.error; }
|
|
26
|
+
}
|
|
27
|
+
return ar;
|
|
28
|
+
};
|
|
29
|
+
var __spread = (this && this.__spread) || function () {
|
|
30
|
+
for (var ar = [], i = 0; i < arguments.length; i++) ar = ar.concat(__read(arguments[i]));
|
|
31
|
+
return ar;
|
|
32
|
+
};
|
|
33
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
34
|
+
exports.Highlight = void 0;
|
|
35
|
+
// 后续并入FlowPath
|
|
36
|
+
var getPath = function (id, lf) {
|
|
37
|
+
var el = lf.getModelById(id);
|
|
38
|
+
return getNodePath(el.BaseType === 'node' ? el : el.targetNode, lf);
|
|
39
|
+
};
|
|
40
|
+
// dfs + 动态规划
|
|
41
|
+
// todo 算法优化
|
|
42
|
+
var getNodePath = function (node, lf) {
|
|
43
|
+
var incomingPaths = [];
|
|
44
|
+
var outgoingPaths = [];
|
|
45
|
+
var getIncomingPaths = function (curNode, path, prevNode) {
|
|
46
|
+
if (prevNode === void 0) { prevNode = null; }
|
|
47
|
+
if (prevNode) {
|
|
48
|
+
// * 上个节点和当前节点中间边
|
|
49
|
+
path.unshift.apply(path, __spread(lf
|
|
50
|
+
.getEdgeModels({
|
|
51
|
+
sourceNodeId: curNode.id,
|
|
52
|
+
targetNodeId: prevNode.id,
|
|
53
|
+
})
|
|
54
|
+
.map(function (item) { return item.id; })));
|
|
55
|
+
}
|
|
56
|
+
// * 路径中存在节点,则不再继续查找,说明出现环情况
|
|
57
|
+
if (path.includes(curNode.id)) {
|
|
58
|
+
incomingPaths.push(path);
|
|
59
|
+
return;
|
|
60
|
+
}
|
|
61
|
+
// * 路径中当前加入节点
|
|
62
|
+
path.unshift(curNode.id);
|
|
63
|
+
if (!curNode.incoming.nodes.length) {
|
|
64
|
+
incomingPaths.push(path);
|
|
65
|
+
return;
|
|
66
|
+
}
|
|
67
|
+
// * 往下找
|
|
68
|
+
curNode.incoming.nodes.forEach(function (nextNode) {
|
|
69
|
+
getIncomingPaths(nextNode, path.slice(), curNode);
|
|
70
|
+
});
|
|
71
|
+
};
|
|
72
|
+
// * 同上逻辑
|
|
73
|
+
var getOutgoingPaths = function (curNode, path, prevNode) {
|
|
74
|
+
if (prevNode === void 0) { prevNode = null; }
|
|
75
|
+
if (prevNode) {
|
|
76
|
+
path.push.apply(path, __spread(lf
|
|
77
|
+
.getEdgeModels({
|
|
78
|
+
sourceNodeId: prevNode.id,
|
|
79
|
+
targetNodeId: curNode.id,
|
|
80
|
+
})
|
|
81
|
+
.map(function (item) { return item.id; })));
|
|
82
|
+
}
|
|
83
|
+
if (path.includes(curNode.id)) {
|
|
84
|
+
outgoingPaths.push(path);
|
|
85
|
+
return;
|
|
86
|
+
}
|
|
87
|
+
path.push(curNode.id);
|
|
88
|
+
if (!curNode.outgoing.nodes.length) {
|
|
89
|
+
outgoingPaths.push(path);
|
|
90
|
+
return;
|
|
91
|
+
}
|
|
92
|
+
curNode.outgoing.nodes.forEach(function (nextNode) {
|
|
93
|
+
getOutgoingPaths(nextNode, path.slice(), curNode);
|
|
94
|
+
});
|
|
95
|
+
};
|
|
96
|
+
getIncomingPaths(node, []);
|
|
97
|
+
getOutgoingPaths(node, []);
|
|
98
|
+
return __spread(new Set(__spread(incomingPaths.flat(), outgoingPaths.flat())));
|
|
99
|
+
};
|
|
100
|
+
var Highlight = /** @class */ (function () {
|
|
101
|
+
function Highlight(_a) {
|
|
102
|
+
var lf = _a.lf;
|
|
103
|
+
this.mode = 'path';
|
|
104
|
+
this.manual = false;
|
|
105
|
+
this.tempStyles = {};
|
|
106
|
+
this.lf = lf;
|
|
107
|
+
}
|
|
108
|
+
Highlight.prototype.setMode = function (mode) {
|
|
109
|
+
this.mode = mode;
|
|
110
|
+
};
|
|
111
|
+
Highlight.prototype.setManual = function (manual) {
|
|
112
|
+
this.manual = manual;
|
|
113
|
+
};
|
|
114
|
+
Highlight.prototype.highlightSingle = function (id) {
|
|
115
|
+
var model = this.lf.getModelById(id);
|
|
116
|
+
if (model.BaseType === 'node') {
|
|
117
|
+
// 高亮节点
|
|
118
|
+
model.updateStyles(this.tempStyles[id]);
|
|
119
|
+
}
|
|
120
|
+
else if (model.BaseType === 'edge') {
|
|
121
|
+
// 高亮边及对应的节点
|
|
122
|
+
model.updateStyles(this.tempStyles[id]);
|
|
123
|
+
model.sourceNode.updateStyles(this.tempStyles[model.sourceNode.id]);
|
|
124
|
+
model.targetNode.updateStyles(this.tempStyles[model.targetNode.id]);
|
|
125
|
+
}
|
|
126
|
+
};
|
|
127
|
+
Highlight.prototype.highlightPath = function (id) {
|
|
128
|
+
var _this = this;
|
|
129
|
+
var path = getPath(id, this.lf);
|
|
130
|
+
path.forEach(function (_id) {
|
|
131
|
+
// 高亮路径上所有的边和节点
|
|
132
|
+
_this.lf.getModelById(_id).updateStyles(_this.tempStyles[_id]);
|
|
133
|
+
});
|
|
134
|
+
};
|
|
135
|
+
Highlight.prototype.highlight = function (id, mode) {
|
|
136
|
+
var _this = this;
|
|
137
|
+
if (mode === void 0) { mode = this.mode; }
|
|
138
|
+
if (this.manual)
|
|
139
|
+
return;
|
|
140
|
+
if (Object.keys(this.tempStyles).length) {
|
|
141
|
+
this.restoreHighlight();
|
|
142
|
+
}
|
|
143
|
+
Object.values(this.lf.graphModel.modelsMap).forEach(function (item) {
|
|
144
|
+
// 所有节点样式都进行备份
|
|
145
|
+
// eslint-disable-next-line operator-linebreak
|
|
146
|
+
var oStyle = item.BaseType === 'node' ? item.getNodeStyle() : item.getEdgeStyle();
|
|
147
|
+
_this.tempStyles[item.id] = __assign({}, oStyle);
|
|
148
|
+
// 所有节点都设置透明度为0.1
|
|
149
|
+
item.setStyles({ opacity: 0.1 });
|
|
150
|
+
});
|
|
151
|
+
var modeTrigger = {
|
|
152
|
+
single: this.highlightSingle.bind(this),
|
|
153
|
+
path: this.highlightPath.bind(this),
|
|
154
|
+
};
|
|
155
|
+
modeTrigger[mode](id);
|
|
156
|
+
};
|
|
157
|
+
Highlight.prototype.restoreHighlight = function () {
|
|
158
|
+
var _this = this;
|
|
159
|
+
// 恢复所有节点的样式
|
|
160
|
+
if (!Object.keys(this.tempStyles).length)
|
|
161
|
+
return;
|
|
162
|
+
Object.values(this.lf.graphModel.modelsMap).forEach(function (item) {
|
|
163
|
+
var _a;
|
|
164
|
+
var oStyle = (_a = _this.tempStyles[item.id]) !== null && _a !== void 0 ? _a : {};
|
|
165
|
+
item.updateStyles(__assign({}, oStyle));
|
|
166
|
+
});
|
|
167
|
+
this.tempStyles = {};
|
|
168
|
+
};
|
|
169
|
+
Highlight.prototype.render = function (lf, domContainer) {
|
|
170
|
+
var _this = this;
|
|
171
|
+
this.lf.on('node:mouseenter', function (_a) {
|
|
172
|
+
var data = _a.data;
|
|
173
|
+
return _this.highlight(data.id);
|
|
174
|
+
});
|
|
175
|
+
this.lf.on('edge:mouseenter', function (_a) {
|
|
176
|
+
var data = _a.data;
|
|
177
|
+
return _this.highlight(data.id);
|
|
178
|
+
});
|
|
179
|
+
this.lf.on('node:mouseleave', this.restoreHighlight.bind(this));
|
|
180
|
+
this.lf.on('edge:mouseleave', this.restoreHighlight.bind(this));
|
|
181
|
+
this.lf.on('history:change', this.restoreHighlight.bind(this));
|
|
182
|
+
};
|
|
183
|
+
Highlight.prototype.destroy = function () { };
|
|
184
|
+
Highlight.pluginName = 'highlight';
|
|
185
|
+
return Highlight;
|
|
186
|
+
}());
|
|
187
|
+
exports.Highlight = Highlight;
|
|
@@ -103,6 +103,11 @@ var MiniMap = /** @class */ (function () {
|
|
|
103
103
|
_this.__setView();
|
|
104
104
|
}
|
|
105
105
|
});
|
|
106
|
+
this.__lf.on('blank:drop', function () {
|
|
107
|
+
if (_this.__isShow) {
|
|
108
|
+
_this.__setView();
|
|
109
|
+
}
|
|
110
|
+
});
|
|
106
111
|
};
|
|
107
112
|
MiniMap.prototype.init = function (option) {
|
|
108
113
|
this.__disabledPlugins = this.__disabledPlugins.concat(option.disabledPlugins || []);
|
|
@@ -43,9 +43,11 @@ var SelectionSelect = /** @class */ (function () {
|
|
|
43
43
|
}
|
|
44
44
|
var lt = [Math.min(x, x1), Math.min(y, y1)];
|
|
45
45
|
var rt = [Math.max(x, x1), Math.max(y, y1)];
|
|
46
|
-
var elements = _this.lf.getAreaElement(lt, rt, _this.isWholeEdge, _this.isWholeNode);
|
|
46
|
+
var elements = _this.lf.graphModel.getAreaElement(lt, rt, _this.isWholeEdge, _this.isWholeNode);
|
|
47
47
|
elements.forEach(function (element) {
|
|
48
|
-
_this.
|
|
48
|
+
if (_this.isSelectElement(element)) {
|
|
49
|
+
_this.lf.selectElementById(element.id, true);
|
|
50
|
+
}
|
|
49
51
|
});
|
|
50
52
|
_this.lf.emit('selection:selected', elements);
|
|
51
53
|
};
|
|
@@ -118,6 +120,24 @@ var SelectionSelect = /** @class */ (function () {
|
|
|
118
120
|
}
|
|
119
121
|
this.close();
|
|
120
122
|
};
|
|
123
|
+
SelectionSelect.prototype.isSelectElement = function (elementModel) {
|
|
124
|
+
// 如果不可见,则不被选中
|
|
125
|
+
if (!elementModel.visible)
|
|
126
|
+
return false;
|
|
127
|
+
var group = this.lf.extension.group;
|
|
128
|
+
// 节点在group中,则不被选中
|
|
129
|
+
if (group) {
|
|
130
|
+
if (elementModel.BaseType === 'node' && group.getNodeGroup(elementModel.id))
|
|
131
|
+
return false;
|
|
132
|
+
if (elementModel.BaseType === 'edge') {
|
|
133
|
+
if (group.getNodeGroup(elementModel.sourceNodeId)
|
|
134
|
+
|| group.getNodeGroup(elementModel.targetNodeId)) {
|
|
135
|
+
return false;
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
}
|
|
139
|
+
return true;
|
|
140
|
+
};
|
|
121
141
|
SelectionSelect.prototype.open = function () {
|
|
122
142
|
this.__disabled = false;
|
|
123
143
|
};
|
package/cjs/index.js
CHANGED
|
@@ -30,3 +30,4 @@ __exportStar(require("./tools/auto-layout"), exports);
|
|
|
30
30
|
__exportStar(require("./bpmn-adapter/xml2json"), exports);
|
|
31
31
|
__exportStar(require("./bpmn-adapter/json2xml"), exports);
|
|
32
32
|
__exportStar(require("./locale/en-locale"), exports);
|
|
33
|
+
__exportStar(require("./components/highlight"), exports);
|
|
@@ -107,24 +107,30 @@ var GroupNodeModel = /** @class */ (function (_super) {
|
|
|
107
107
|
this.isFolded = isFolded;
|
|
108
108
|
// step 1
|
|
109
109
|
if (isFolded) {
|
|
110
|
-
this.x = this.x - this.width / 2 + this.foldedWidth / 2;
|
|
111
|
-
this.y = this.y - this.height / 2 + this.foldedHeight / 2;
|
|
112
110
|
this.unfoldedWidth = this.width;
|
|
113
111
|
this.unfoldedHight = this.height;
|
|
114
|
-
this.
|
|
115
|
-
|
|
112
|
+
this.updateAttributes({
|
|
113
|
+
x: this.x - this.width / 2 + this.foldedWidth / 2,
|
|
114
|
+
y: this.y - this.height / 2 + this.foldedHeight / 2,
|
|
115
|
+
width: this.foldedWidth,
|
|
116
|
+
height: this.foldedHeight,
|
|
117
|
+
});
|
|
116
118
|
}
|
|
117
119
|
else {
|
|
118
|
-
this.
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
120
|
+
this.updateAttributes({
|
|
121
|
+
width: this.unfoldedWidth,
|
|
122
|
+
height: this.unfoldedHight,
|
|
123
|
+
x: this.x + this.unfoldedWidth / 2 - this.foldedWidth / 2,
|
|
124
|
+
y: this.y + this.unfoldedHight / 2 - this.foldedHeight / 2,
|
|
125
|
+
});
|
|
122
126
|
}
|
|
123
127
|
// step 2
|
|
124
128
|
var allEdges = this.incoming.edges.concat(this.outgoing.edges);
|
|
125
129
|
this.children.forEach(function (elementId) {
|
|
126
130
|
var nodeModel = _this.graphModel.getElement(elementId);
|
|
127
|
-
nodeModel.
|
|
131
|
+
nodeModel.updateAttributes({
|
|
132
|
+
visible: !isFolded,
|
|
133
|
+
});
|
|
128
134
|
allEdges = allEdges.concat(nodeModel.incoming.edges.concat(nodeModel.outgoing.edges));
|
|
129
135
|
});
|
|
130
136
|
// step 3
|
|
@@ -196,7 +202,9 @@ var GroupNodeModel = /** @class */ (function (_super) {
|
|
|
196
202
|
if (targetNodeIdGroup.id !== _this.id || sourceNodeIdGroup.id !== _this.id) {
|
|
197
203
|
_this.createVirtualEdge(data);
|
|
198
204
|
}
|
|
199
|
-
edgeModel.
|
|
205
|
+
edgeModel.updateAttributes({
|
|
206
|
+
visible: false,
|
|
207
|
+
});
|
|
200
208
|
}
|
|
201
209
|
// 展开时,处理被隐藏的边的逻辑
|
|
202
210
|
if (!isFolded && edgeModel.visible === false) {
|
|
@@ -212,7 +220,9 @@ var GroupNodeModel = /** @class */ (function (_super) {
|
|
|
212
220
|
_this.createVirtualEdge(data);
|
|
213
221
|
}
|
|
214
222
|
else {
|
|
215
|
-
edgeModel.
|
|
223
|
+
edgeModel.updateAttributes({
|
|
224
|
+
visible: true,
|
|
225
|
+
});
|
|
216
226
|
}
|
|
217
227
|
}
|
|
218
228
|
});
|
|
@@ -222,7 +232,7 @@ var GroupNodeModel = /** @class */ (function (_super) {
|
|
|
222
232
|
var model = this.graphModel.addEdge(edgeData);
|
|
223
233
|
model.virtual = true;
|
|
224
234
|
// 强制不保存group连线数据
|
|
225
|
-
model.getData =
|
|
235
|
+
// model.getData = () => null;
|
|
226
236
|
model.text.editable = false;
|
|
227
237
|
model.isFoldedEdge = true;
|
|
228
238
|
};
|
|
@@ -35,9 +35,11 @@ var Control = /** @class */ (function (_super) {
|
|
|
35
35
|
_this.updatePosition = function (_a) {
|
|
36
36
|
var deltaX = _a.deltaX, deltaY = _a.deltaY;
|
|
37
37
|
var _b = _this.nodeModel, x = _b.x, y = _b.y;
|
|
38
|
-
_this.nodeModel.x = x + deltaX / 2;
|
|
39
|
-
_this.nodeModel.y = y + deltaY / 2;
|
|
40
38
|
_this.nodeModel.moveText(deltaX / 2, deltaY / 2);
|
|
39
|
+
_this.nodeModel.updateAttributes({
|
|
40
|
+
x: x + deltaX / 2,
|
|
41
|
+
y: y + deltaY / 2,
|
|
42
|
+
});
|
|
41
43
|
};
|
|
42
44
|
// 计算control拖动后,节点的宽高
|
|
43
45
|
_this.getResize = function (_a) {
|
|
@@ -91,14 +93,16 @@ var Control = /** @class */ (function (_super) {
|
|
|
91
93
|
}
|
|
92
94
|
_this.updatePosition({ deltaX: deltaX, deltaY: deltaY });
|
|
93
95
|
// 更新宽高
|
|
94
|
-
_this.nodeModel.width = size.width;
|
|
95
|
-
_this.nodeModel.height = size.height;
|
|
96
96
|
_this.nodeModel.setProperties({
|
|
97
97
|
nodeSize: {
|
|
98
98
|
width: size.width,
|
|
99
99
|
height: size.height,
|
|
100
100
|
},
|
|
101
101
|
});
|
|
102
|
+
_this.nodeModel.updateAttributes({
|
|
103
|
+
width: size.width,
|
|
104
|
+
height: size.height,
|
|
105
|
+
});
|
|
102
106
|
var edges = _this.getNodeEdges(id);
|
|
103
107
|
var beforeNode = {
|
|
104
108
|
x: x,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { h, DiamondNode, DiamondNodeModel } from '@logicflow/core';
|
|
2
2
|
declare class DiamondResizeModel extends DiamondNodeModel {
|
|
3
|
-
constructor(data: any, graphModel: any);
|
|
4
3
|
initNodeData(data: any): void;
|
|
4
|
+
init(): void;
|
|
5
5
|
getOutlineStyle(): import("@logicflow/core/types/constant/DefaultTheme").OutlineTheme;
|
|
6
6
|
getResizeOutlineStyle(): {
|
|
7
7
|
stroke: string;
|
|
@@ -27,14 +27,8 @@ import ControlGroup from '../Control/ControlGroup';
|
|
|
27
27
|
import Polygon from '../BasicShape/Polygon';
|
|
28
28
|
var DiamondResizeModel = /** @class */ (function (_super) {
|
|
29
29
|
__extends(DiamondResizeModel, _super);
|
|
30
|
-
function DiamondResizeModel(
|
|
31
|
-
|
|
32
|
-
var nodeSize = _this.properties.nodeSize;
|
|
33
|
-
if (nodeSize) {
|
|
34
|
-
_this.rx = nodeSize.rx;
|
|
35
|
-
_this.ry = nodeSize.ry;
|
|
36
|
-
}
|
|
37
|
-
return _this;
|
|
30
|
+
function DiamondResizeModel() {
|
|
31
|
+
return _super !== null && _super.apply(this, arguments) || this;
|
|
38
32
|
}
|
|
39
33
|
DiamondResizeModel.prototype.initNodeData = function (data) {
|
|
40
34
|
_super.prototype.initNodeData.call(this, data);
|
|
@@ -44,6 +38,14 @@ var DiamondResizeModel = /** @class */ (function (_super) {
|
|
|
44
38
|
this.maxHeight = 2000;
|
|
45
39
|
this.gridSize = 1;
|
|
46
40
|
};
|
|
41
|
+
DiamondResizeModel.prototype.init = function () {
|
|
42
|
+
_super.prototype.init.call(this);
|
|
43
|
+
var nodeSize = this.properties.nodeSize;
|
|
44
|
+
if (nodeSize) {
|
|
45
|
+
this.rx = nodeSize.rx;
|
|
46
|
+
this.ry = nodeSize.ry;
|
|
47
|
+
}
|
|
48
|
+
};
|
|
47
49
|
DiamondResizeModel.prototype.getOutlineStyle = function () {
|
|
48
50
|
var style = _super.prototype.getOutlineStyle.call(this);
|
|
49
51
|
style.stroke = 'none';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { h, EllipseNode, EllipseNodeModel } from '@logicflow/core';
|
|
2
2
|
declare class EllipseResizeModel extends EllipseNodeModel {
|
|
3
|
-
constructor(data: any, graphModel: any);
|
|
4
3
|
initNodeData(data: any): void;
|
|
4
|
+
init(): void;
|
|
5
5
|
getOutlineStyle(): import("@logicflow/core/types/constant/DefaultTheme").OutlineTheme;
|
|
6
6
|
getResizeOutlineStyle(): {
|
|
7
7
|
stroke: string;
|
|
@@ -15,14 +15,8 @@ import { h, EllipseNode, EllipseNodeModel } from '@logicflow/core';
|
|
|
15
15
|
import ControlGroup from '../Control/ControlGroup';
|
|
16
16
|
var EllipseResizeModel = /** @class */ (function (_super) {
|
|
17
17
|
__extends(EllipseResizeModel, _super);
|
|
18
|
-
function EllipseResizeModel(
|
|
19
|
-
|
|
20
|
-
var nodeSize = _this.properties.nodeSize;
|
|
21
|
-
if (nodeSize) {
|
|
22
|
-
_this.rx = nodeSize.rx;
|
|
23
|
-
_this.ry = nodeSize.ry;
|
|
24
|
-
}
|
|
25
|
-
return _this;
|
|
18
|
+
function EllipseResizeModel() {
|
|
19
|
+
return _super !== null && _super.apply(this, arguments) || this;
|
|
26
20
|
}
|
|
27
21
|
EllipseResizeModel.prototype.initNodeData = function (data) {
|
|
28
22
|
_super.prototype.initNodeData.call(this, data);
|
|
@@ -31,6 +25,14 @@ var EllipseResizeModel = /** @class */ (function (_super) {
|
|
|
31
25
|
this.maxWidth = 2000;
|
|
32
26
|
this.maxHeight = 2000;
|
|
33
27
|
};
|
|
28
|
+
EllipseResizeModel.prototype.init = function () {
|
|
29
|
+
_super.prototype.init.call(this);
|
|
30
|
+
var nodeSize = this.properties.nodeSize;
|
|
31
|
+
if (nodeSize) {
|
|
32
|
+
this.rx = nodeSize.rx;
|
|
33
|
+
this.ry = nodeSize.ry;
|
|
34
|
+
}
|
|
35
|
+
};
|
|
34
36
|
EllipseResizeModel.prototype.getOutlineStyle = function () {
|
|
35
37
|
var style = _super.prototype.getOutlineStyle.call(this);
|
|
36
38
|
style.stroke = 'none';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { h, HtmlNode, HtmlNodeModel } from '@logicflow/core';
|
|
2
2
|
declare class HtmlResizeModel extends HtmlNodeModel {
|
|
3
|
-
constructor(data: any, graphModel: any);
|
|
4
3
|
initNodeData(data: any): void;
|
|
4
|
+
init(): void;
|
|
5
5
|
getOutlineStyle(): import("@logicflow/core/types/constant/DefaultTheme").OutlineTheme;
|
|
6
6
|
getResizeOutlineStyle(): {
|
|
7
7
|
stroke: string;
|
|
@@ -15,14 +15,8 @@ import { h, HtmlNode, HtmlNodeModel } from '@logicflow/core';
|
|
|
15
15
|
import ControlGroup from '../Control/ControlGroup';
|
|
16
16
|
var HtmlResizeModel = /** @class */ (function (_super) {
|
|
17
17
|
__extends(HtmlResizeModel, _super);
|
|
18
|
-
function HtmlResizeModel(
|
|
19
|
-
|
|
20
|
-
var nodeSize = _this.properties.nodeSize;
|
|
21
|
-
if (nodeSize) {
|
|
22
|
-
_this.width = nodeSize.width;
|
|
23
|
-
_this.height = nodeSize.height;
|
|
24
|
-
}
|
|
25
|
-
return _this;
|
|
18
|
+
function HtmlResizeModel() {
|
|
19
|
+
return _super !== null && _super.apply(this, arguments) || this;
|
|
26
20
|
}
|
|
27
21
|
HtmlResizeModel.prototype.initNodeData = function (data) {
|
|
28
22
|
_super.prototype.initNodeData.call(this, data);
|
|
@@ -31,6 +25,14 @@ var HtmlResizeModel = /** @class */ (function (_super) {
|
|
|
31
25
|
this.maxWidth = 2000;
|
|
32
26
|
this.maxHeight = 2000;
|
|
33
27
|
};
|
|
28
|
+
HtmlResizeModel.prototype.init = function () {
|
|
29
|
+
_super.prototype.init.call(this);
|
|
30
|
+
var nodeSize = this.properties.nodeSize;
|
|
31
|
+
if (nodeSize) {
|
|
32
|
+
this.width = nodeSize.width;
|
|
33
|
+
this.height = nodeSize.height;
|
|
34
|
+
}
|
|
35
|
+
};
|
|
34
36
|
HtmlResizeModel.prototype.getOutlineStyle = function () {
|
|
35
37
|
var style = _super.prototype.getOutlineStyle.call(this);
|
|
36
38
|
style.stroke = 'none';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { h, RectNode, RectNodeModel } from '@logicflow/core';
|
|
2
2
|
declare class RectResizeModel extends RectNodeModel {
|
|
3
|
-
constructor(data: any, graphModel: any);
|
|
4
3
|
initNodeData(data: any): void;
|
|
4
|
+
init(): void;
|
|
5
5
|
getOutlineStyle(): import("@logicflow/core/types/constant/DefaultTheme").OutlineTheme;
|
|
6
6
|
getResizeOutlineStyle(): {
|
|
7
7
|
fill: string;
|