@mx-sose-front/mx-sose-graph 1.1.1 → 1.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +103 -10
- package/dist/index.esm.js +6618 -5593
- package/dist/index.esm.js.map +1 -1
- package/dist/index.umd.js +7 -7
- package/dist/index.umd.js.map +1 -1
- package/dist/style.css +1 -1
- package/package.json +1 -1
- package/src/components/{ContextMenu.vue → ContextMenu/ContextMenu.vue} +243 -70
- package/src/components/DiagramListTooltip/DiagramListTooltip.vue +138 -0
- package/src/components/Edge/Edge.vue +38 -49
- package/src/components/InteractionLayer.vue +432 -838
- package/src/components/Shape/Block.vue +8 -8
- package/src/components/ZoomSlider/ZoomSlider.vue +229 -0
- package/src/constants/index.ts +12 -0
- package/src/statics/icons/childIcons//351/241/271/347/233/256/351/241/272/345/272/217@3x.png +0 -0
- package/src/store/graphStore.ts +98 -21
- package/src/types/index.ts +14 -1
- package/src/types/interactionLayer.ts +35 -0
- package/src/utils/contextMenuUtils.ts +264 -0
- package/src/utils/diagram.ts +93 -4
- package/src/utils/edgeUtils.ts +228 -0
- package/src/utils/geom.ts +34 -0
- package/src/utils/graphDragService.ts +14 -17
- package/src/utils/keyboardUtils.ts +229 -0
- package/src/utils/license-guard.ts +50 -0
- package/src/utils/nameEditUtils.ts +132 -0
- package/src/utils/resizeUtils.ts +463 -0
- package/src/view/graph.vue +102 -134
- package/src/components/Label.vue +0 -0
package/dist/index.d.ts
CHANGED
|
@@ -64,9 +64,9 @@ export declare interface GraphEvents {
|
|
|
64
64
|
export declare const GraphView: DefineComponent<ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
|
|
65
65
|
addShapeData: Shape;
|
|
66
66
|
connectShapeData: Shape;
|
|
67
|
-
lines:
|
|
67
|
+
lines: string[];
|
|
68
68
|
packages: string[];
|
|
69
|
-
diagram:
|
|
69
|
+
diagram: string[];
|
|
70
70
|
taggedValueLabels: string[];
|
|
71
71
|
actionButtonShapeId?: string | undefined;
|
|
72
72
|
classMetaTypes: string[];
|
|
@@ -74,6 +74,8 @@ edgeCheck: boolean;
|
|
|
74
74
|
pins: string[];
|
|
75
75
|
referentialAttributeModel: string[];
|
|
76
76
|
ports: string[];
|
|
77
|
+
canOperate: boolean;
|
|
78
|
+
chartLocationData?: locationChart[] | null | undefined;
|
|
77
79
|
}>>, {
|
|
78
80
|
getBoundingClientRect: () => DOMRect | undefined;
|
|
79
81
|
updateShapes: (shapes: Shape[]) => void;
|
|
@@ -94,6 +96,7 @@ showPropertyPanel: boolean;
|
|
|
94
96
|
"shapes-edit-name": (value: {
|
|
95
97
|
shape: Shape;
|
|
96
98
|
newName: string;
|
|
99
|
+
oldName: string;
|
|
97
100
|
}) => void;
|
|
98
101
|
"connect-end": (value: {
|
|
99
102
|
sourceId: string;
|
|
@@ -111,6 +114,36 @@ x: number;
|
|
|
111
114
|
y: number;
|
|
112
115
|
}[];
|
|
113
116
|
}) => void;
|
|
117
|
+
"object-flow-connect-end": (value: {
|
|
118
|
+
connectionData: {
|
|
119
|
+
sourceId: string;
|
|
120
|
+
targetId: string;
|
|
121
|
+
sourcePoint: {
|
|
122
|
+
x: number;
|
|
123
|
+
y: number;
|
|
124
|
+
};
|
|
125
|
+
targetPoint: {
|
|
126
|
+
x: number;
|
|
127
|
+
y: number;
|
|
128
|
+
};
|
|
129
|
+
waypoints: {
|
|
130
|
+
x: number;
|
|
131
|
+
y: number;
|
|
132
|
+
}[];
|
|
133
|
+
};
|
|
134
|
+
outputPinBounds: {
|
|
135
|
+
x: number;
|
|
136
|
+
y: number;
|
|
137
|
+
width: number;
|
|
138
|
+
height: number;
|
|
139
|
+
};
|
|
140
|
+
inputPinBounds: {
|
|
141
|
+
x: number;
|
|
142
|
+
y: number;
|
|
143
|
+
width: number;
|
|
144
|
+
height: number;
|
|
145
|
+
};
|
|
146
|
+
}) => void;
|
|
114
147
|
"action-button-click": (value: string, shape: Shape) => void;
|
|
115
148
|
diagramDoubleClick: (data: any) => void;
|
|
116
149
|
"model-type-property-id-button-click": (value: string, shape: Shape) => void;
|
|
@@ -119,9 +152,9 @@ diagramDoubleClick: (data: any) => void;
|
|
|
119
152
|
}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
|
|
120
153
|
addShapeData: Shape;
|
|
121
154
|
connectShapeData: Shape;
|
|
122
|
-
lines:
|
|
155
|
+
lines: string[];
|
|
123
156
|
packages: string[];
|
|
124
|
-
diagram:
|
|
157
|
+
diagram: string[];
|
|
125
158
|
taggedValueLabels: string[];
|
|
126
159
|
actionButtonShapeId?: string | undefined;
|
|
127
160
|
classMetaTypes: string[];
|
|
@@ -129,9 +162,11 @@ edgeCheck: boolean;
|
|
|
129
162
|
pins: string[];
|
|
130
163
|
referentialAttributeModel: string[];
|
|
131
164
|
ports: string[];
|
|
165
|
+
canOperate: boolean;
|
|
166
|
+
chartLocationData?: locationChart[] | null | undefined;
|
|
132
167
|
}>>> & Readonly<{
|
|
133
|
-
"onScale-changed"?: ((scale: number) => any) | undefined;
|
|
134
168
|
onDiagramDoubleClick?: ((data: any) => any) | undefined;
|
|
169
|
+
"onScale-changed"?: ((scale: number) => any) | undefined;
|
|
135
170
|
"onShapes-property"?: ((value: {
|
|
136
171
|
selectedShape: Shape;
|
|
137
172
|
showPropertyPanel: boolean;
|
|
@@ -139,6 +174,7 @@ showPropertyPanel: boolean;
|
|
|
139
174
|
"onShapes-edit-name"?: ((value: {
|
|
140
175
|
shape: Shape;
|
|
141
176
|
newName: string;
|
|
177
|
+
oldName: string;
|
|
142
178
|
}) => any) | undefined;
|
|
143
179
|
"onConnect-end"?: ((value: {
|
|
144
180
|
sourceId: string;
|
|
@@ -156,11 +192,47 @@ x: number;
|
|
|
156
192
|
y: number;
|
|
157
193
|
}[];
|
|
158
194
|
}) => any) | undefined;
|
|
195
|
+
"onObject-flow-connect-end"?: ((value: {
|
|
196
|
+
connectionData: {
|
|
197
|
+
sourceId: string;
|
|
198
|
+
targetId: string;
|
|
199
|
+
sourcePoint: {
|
|
200
|
+
x: number;
|
|
201
|
+
y: number;
|
|
202
|
+
};
|
|
203
|
+
targetPoint: {
|
|
204
|
+
x: number;
|
|
205
|
+
y: number;
|
|
206
|
+
};
|
|
207
|
+
waypoints: {
|
|
208
|
+
x: number;
|
|
209
|
+
y: number;
|
|
210
|
+
}[];
|
|
211
|
+
};
|
|
212
|
+
outputPinBounds: {
|
|
213
|
+
x: number;
|
|
214
|
+
y: number;
|
|
215
|
+
width: number;
|
|
216
|
+
height: number;
|
|
217
|
+
};
|
|
218
|
+
inputPinBounds: {
|
|
219
|
+
x: number;
|
|
220
|
+
y: number;
|
|
221
|
+
width: number;
|
|
222
|
+
height: number;
|
|
223
|
+
};
|
|
224
|
+
}) => any) | undefined;
|
|
159
225
|
"onAction-button-click"?: ((value: string, shape: Shape) => any) | undefined;
|
|
160
226
|
"onModel-type-property-id-button-click"?: ((value: string, shape: Shape) => any) | undefined;
|
|
161
227
|
"onAction-button-add"?: ((shape: Shape) => any) | undefined;
|
|
162
228
|
}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
|
|
163
229
|
|
|
230
|
+
declare interface locationChart {
|
|
231
|
+
modelCode: string;
|
|
232
|
+
treeId: string;
|
|
233
|
+
modelName: string;
|
|
234
|
+
}
|
|
235
|
+
|
|
164
236
|
/**
|
|
165
237
|
* 可选的安装参数:允许使用方主动把 pinia 传进来
|
|
166
238
|
*/
|
|
@@ -1282,6 +1354,7 @@ hoverContainerId: Ref<string | null, string | null>;
|
|
|
1282
1354
|
hoverNestable: Ref<boolean | null, boolean | null>;
|
|
1283
1355
|
currentDiagramId: Ref<string | null, string | null>;
|
|
1284
1356
|
canDropOnCanvas: Ref<boolean, boolean>;
|
|
1357
|
+
canOperate: Ref<boolean, boolean>;
|
|
1285
1358
|
taggedValueLabels: Ref<string[], string[]>;
|
|
1286
1359
|
packagesTypes: Ref<string[], string[]>;
|
|
1287
1360
|
classMetaTypes: Ref<string[], string[]>;
|
|
@@ -1295,6 +1368,8 @@ ghostShadow: ComputedRef<Shape[]>;
|
|
|
1295
1368
|
scales: Ref<Record<string, number>, Record<string, number>>;
|
|
1296
1369
|
activeDiagramId: Ref<string | null, string | null>;
|
|
1297
1370
|
currentScale: ComputedRef<number>;
|
|
1371
|
+
museInGraphView: Ref<boolean, boolean>;
|
|
1372
|
+
connectMode: Ref<string, string>;
|
|
1298
1373
|
addShape: (shape: Shape) => void;
|
|
1299
1374
|
removeShape: (shapeId: string) => void;
|
|
1300
1375
|
updateShape: (shapeId: string, updates: Partial<Shape>, id?: 'id' | 'modelId') => void;
|
|
@@ -1313,7 +1388,7 @@ y: number;
|
|
|
1313
1388
|
moveDraggedShape: (pointer: {
|
|
1314
1389
|
x: number;
|
|
1315
1390
|
y: number;
|
|
1316
|
-
}) => void
|
|
1391
|
+
}) => Promise<void>;
|
|
1317
1392
|
endDragShape: (source?: string) => Promise<void>;
|
|
1318
1393
|
getShapes: () => {
|
|
1319
1394
|
id: string;
|
|
@@ -1484,6 +1559,7 @@ addDiagram: (diagram: Shape) => void;
|
|
|
1484
1559
|
setCurrentDiagramId: (id: string | null) => void;
|
|
1485
1560
|
selectMany: (ids: string[]) => void;
|
|
1486
1561
|
clearSelection: () => void;
|
|
1562
|
+
selectAll: () => void;
|
|
1487
1563
|
removeSelected: () => void;
|
|
1488
1564
|
finalCheckCanNest: (childId: string, parentId: string | null) => Promise<boolean>;
|
|
1489
1565
|
setHoverState: (id: string | null, nestable: boolean | null) => void;
|
|
@@ -1492,10 +1568,13 @@ endResizeShape: (id: string) => void;
|
|
|
1492
1568
|
getScale: (diagramId?: string | null) => number;
|
|
1493
1569
|
setScale: (newScale: number, diagramId?: string | null) => void;
|
|
1494
1570
|
setActiveDiagramId: (id: string | null) => void;
|
|
1571
|
+
setConnectMode: (mode: string) => void;
|
|
1572
|
+
getConnectMode: () => string;
|
|
1495
1573
|
visibleShapes: ComputedRef<Shape[]>;
|
|
1496
1574
|
externalCreatingId: Ref<string | null, string | null>;
|
|
1497
1575
|
expandParentAndEmitSizeUpdateByChild: (child: Shape) => void;
|
|
1498
|
-
|
|
1576
|
+
setIsMouseInGraphView: (isIn: boolean) => void;
|
|
1577
|
+
}, "taggedValueLabels" | "shapes" | "selectedShape" | "pendingNestedIds" | "diagramTitle" | "isDragging" | "draggingShapeId" | "dragOffset" | "diagrams" | "selectedIds" | "hoverContainerId" | "hoverNestable" | "currentDiagramId" | "canDropOnCanvas" | "canOperate" | "packagesTypes" | "classMetaTypes" | "ownerRequiredShapeKeys" | "pinsTypes" | "portsTypes" | "scales" | "activeDiagramId" | "museInGraphView" | "connectMode" | "externalCreatingId">, Pick<{
|
|
1499
1578
|
shapes: Ref<{
|
|
1500
1579
|
id: string;
|
|
1501
1580
|
diagramId: string;
|
|
@@ -2502,6 +2581,7 @@ hoverContainerId: Ref<string | null, string | null>;
|
|
|
2502
2581
|
hoverNestable: Ref<boolean | null, boolean | null>;
|
|
2503
2582
|
currentDiagramId: Ref<string | null, string | null>;
|
|
2504
2583
|
canDropOnCanvas: Ref<boolean, boolean>;
|
|
2584
|
+
canOperate: Ref<boolean, boolean>;
|
|
2505
2585
|
taggedValueLabels: Ref<string[], string[]>;
|
|
2506
2586
|
packagesTypes: Ref<string[], string[]>;
|
|
2507
2587
|
classMetaTypes: Ref<string[], string[]>;
|
|
@@ -2515,6 +2595,8 @@ ghostShadow: ComputedRef<Shape[]>;
|
|
|
2515
2595
|
scales: Ref<Record<string, number>, Record<string, number>>;
|
|
2516
2596
|
activeDiagramId: Ref<string | null, string | null>;
|
|
2517
2597
|
currentScale: ComputedRef<number>;
|
|
2598
|
+
museInGraphView: Ref<boolean, boolean>;
|
|
2599
|
+
connectMode: Ref<string, string>;
|
|
2518
2600
|
addShape: (shape: Shape) => void;
|
|
2519
2601
|
removeShape: (shapeId: string) => void;
|
|
2520
2602
|
updateShape: (shapeId: string, updates: Partial<Shape>, id?: 'id' | 'modelId') => void;
|
|
@@ -2533,7 +2615,7 @@ y: number;
|
|
|
2533
2615
|
moveDraggedShape: (pointer: {
|
|
2534
2616
|
x: number;
|
|
2535
2617
|
y: number;
|
|
2536
|
-
}) => void
|
|
2618
|
+
}) => Promise<void>;
|
|
2537
2619
|
endDragShape: (source?: string) => Promise<void>;
|
|
2538
2620
|
getShapes: () => {
|
|
2539
2621
|
id: string;
|
|
@@ -2704,6 +2786,7 @@ addDiagram: (diagram: Shape) => void;
|
|
|
2704
2786
|
setCurrentDiagramId: (id: string | null) => void;
|
|
2705
2787
|
selectMany: (ids: string[]) => void;
|
|
2706
2788
|
clearSelection: () => void;
|
|
2789
|
+
selectAll: () => void;
|
|
2707
2790
|
removeSelected: () => void;
|
|
2708
2791
|
finalCheckCanNest: (childId: string, parentId: string | null) => Promise<boolean>;
|
|
2709
2792
|
setHoverState: (id: string | null, nestable: boolean | null) => void;
|
|
@@ -2712,9 +2795,12 @@ endResizeShape: (id: string) => void;
|
|
|
2712
2795
|
getScale: (diagramId?: string | null) => number;
|
|
2713
2796
|
setScale: (newScale: number, diagramId?: string | null) => void;
|
|
2714
2797
|
setActiveDiagramId: (id: string | null) => void;
|
|
2798
|
+
setConnectMode: (mode: string) => void;
|
|
2799
|
+
getConnectMode: () => string;
|
|
2715
2800
|
visibleShapes: ComputedRef<Shape[]>;
|
|
2716
2801
|
externalCreatingId: Ref<string | null, string | null>;
|
|
2717
2802
|
expandParentAndEmitSizeUpdateByChild: (child: Shape) => void;
|
|
2803
|
+
setIsMouseInGraphView: (isIn: boolean) => void;
|
|
2718
2804
|
}, "shapeCount" | "hasSelectedShape" | "marqueeShapes" | "ghostShadow" | "currentScale" | "visibleShapes">, Pick<{
|
|
2719
2805
|
shapes: Ref<{
|
|
2720
2806
|
id: string;
|
|
@@ -3722,6 +3808,7 @@ hoverContainerId: Ref<string | null, string | null>;
|
|
|
3722
3808
|
hoverNestable: Ref<boolean | null, boolean | null>;
|
|
3723
3809
|
currentDiagramId: Ref<string | null, string | null>;
|
|
3724
3810
|
canDropOnCanvas: Ref<boolean, boolean>;
|
|
3811
|
+
canOperate: Ref<boolean, boolean>;
|
|
3725
3812
|
taggedValueLabels: Ref<string[], string[]>;
|
|
3726
3813
|
packagesTypes: Ref<string[], string[]>;
|
|
3727
3814
|
classMetaTypes: Ref<string[], string[]>;
|
|
@@ -3735,6 +3822,8 @@ ghostShadow: ComputedRef<Shape[]>;
|
|
|
3735
3822
|
scales: Ref<Record<string, number>, Record<string, number>>;
|
|
3736
3823
|
activeDiagramId: Ref<string | null, string | null>;
|
|
3737
3824
|
currentScale: ComputedRef<number>;
|
|
3825
|
+
museInGraphView: Ref<boolean, boolean>;
|
|
3826
|
+
connectMode: Ref<string, string>;
|
|
3738
3827
|
addShape: (shape: Shape) => void;
|
|
3739
3828
|
removeShape: (shapeId: string) => void;
|
|
3740
3829
|
updateShape: (shapeId: string, updates: Partial<Shape>, id?: 'id' | 'modelId') => void;
|
|
@@ -3753,7 +3842,7 @@ y: number;
|
|
|
3753
3842
|
moveDraggedShape: (pointer: {
|
|
3754
3843
|
x: number;
|
|
3755
3844
|
y: number;
|
|
3756
|
-
}) => void
|
|
3845
|
+
}) => Promise<void>;
|
|
3757
3846
|
endDragShape: (source?: string) => Promise<void>;
|
|
3758
3847
|
getShapes: () => {
|
|
3759
3848
|
id: string;
|
|
@@ -3924,6 +4013,7 @@ addDiagram: (diagram: Shape) => void;
|
|
|
3924
4013
|
setCurrentDiagramId: (id: string | null) => void;
|
|
3925
4014
|
selectMany: (ids: string[]) => void;
|
|
3926
4015
|
clearSelection: () => void;
|
|
4016
|
+
selectAll: () => void;
|
|
3927
4017
|
removeSelected: () => void;
|
|
3928
4018
|
finalCheckCanNest: (childId: string, parentId: string | null) => Promise<boolean>;
|
|
3929
4019
|
setHoverState: (id: string | null, nestable: boolean | null) => void;
|
|
@@ -3932,10 +4022,13 @@ endResizeShape: (id: string) => void;
|
|
|
3932
4022
|
getScale: (diagramId?: string | null) => number;
|
|
3933
4023
|
setScale: (newScale: number, diagramId?: string | null) => void;
|
|
3934
4024
|
setActiveDiagramId: (id: string | null) => void;
|
|
4025
|
+
setConnectMode: (mode: string) => void;
|
|
4026
|
+
getConnectMode: () => string;
|
|
3935
4027
|
visibleShapes: ComputedRef<Shape[]>;
|
|
3936
4028
|
externalCreatingId: Ref<string | null, string | null>;
|
|
3937
4029
|
expandParentAndEmitSizeUpdateByChild: (child: Shape) => void;
|
|
3938
|
-
|
|
4030
|
+
setIsMouseInGraphView: (isIn: boolean) => void;
|
|
4031
|
+
}, "addShape" | "removeShape" | "updateShape" | "selectShape" | "setTitle" | "updateShapes" | "clearAll" | "startDragShape" | "startDrag" | "moveDraggedShape" | "endDragShape" | "getShapes" | "addDiagram" | "setCurrentDiagramId" | "selectMany" | "clearSelection" | "selectAll" | "removeSelected" | "finalCheckCanNest" | "setHoverState" | "initializeAllEdgeEndpoints" | "endResizeShape" | "getScale" | "setScale" | "setActiveDiagramId" | "setConnectMode" | "getConnectMode" | "expandParentAndEmitSizeUpdateByChild" | "setIsMouseInGraphView">>;
|
|
3939
4032
|
|
|
3940
4033
|
declare interface Waypoint {
|
|
3941
4034
|
x: number;
|