@mx-sose-front/mx-sose-graph 1.1.7 → 1.1.9

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 (52) hide show
  1. package/dist/assets/edgeWorker-b57ca007.js +2 -0
  2. package/dist/assets/edgeWorker-b57ca007.js.map +1 -0
  3. package/dist/index.d.ts +633 -30
  4. package/dist/index.esm.js +8728 -4734
  5. package/dist/index.esm.js.map +1 -1
  6. package/dist/index.umd.js +1 -1
  7. package/dist/index.umd.js.map +1 -1
  8. package/dist/style.css +1 -1
  9. package/package.json +1 -1
  10. package/src/components/Common/Tree.vue +451 -0
  11. package/src/components/Common/index.ts +2 -0
  12. package/src/components/DiagramListTooltip/DiagramListTooltip.vue +1 -2
  13. package/src/components/Edge/Edge.vue +172 -169
  14. package/src/components/Gantt/Gantt.vue +1544 -0
  15. package/src/components/GanttContextMenu/GanttContextMenu.vue +304 -0
  16. package/src/components/InteractionLayer.vue +343 -147
  17. package/src/components/Matrix/Matrix.vue +828 -0
  18. package/src/components/Matrix/index.ts +168 -0
  19. package/src/components/Shape/ConceptualRole.vue +2 -34
  20. package/src/components/Table/Table.vue +970 -0
  21. package/src/constants/edgeShapeKeys.ts +8 -5
  22. package/src/constants/index.ts +259 -45
  23. package/src/hooks/index.ts +2 -0
  24. package/src/hooks/useChartRowSelection.ts +456 -0
  25. package/src/hooks/useResize.ts +2 -2
  26. package/src/hooks/useVirtualScroll.ts +258 -0
  27. package/src/index.ts +1 -1
  28. package/src/render/shape-renderer.ts +62 -2
  29. package/src/statics/icons/childIcons//345/221/275/344/273/244@3x.png +0 -0
  30. package/src/statics/icons/childIcons//346/210/230/347/225/245/346/246/202/345/277/265/350/241/250@3x.png +0 -0
  31. package/src/statics/icons/childIcons//346/216/247/345/210/266@3x.png +0 -0
  32. package/src/statics/icons/createMenu/down.png +0 -0
  33. package/src/statics/icons/createMenu/remove.png +0 -0
  34. package/src/statics/icons/createMenu/up.png +0 -0
  35. package/src/store/graphStore.ts +217 -44
  36. package/src/types/index.ts +86 -4
  37. package/src/utils/batchAutoExpand.ts +9 -10
  38. package/src/utils/containers.ts +72 -17
  39. package/src/utils/contextMenuUtils.ts +7 -7
  40. package/src/utils/dateUtils.ts +160 -0
  41. package/src/utils/diagram.ts +10 -8
  42. package/src/utils/drag.ts +6 -5
  43. package/src/utils/edgeUtils.ts +344 -427
  44. package/src/utils/edgeWorker.ts +471 -0
  45. package/src/utils/hittest.ts +37 -38
  46. package/src/utils/index.ts +3 -0
  47. package/src/utils/keyboardUtils.ts +5 -5
  48. package/src/utils/packageOutline.ts +96 -0
  49. package/src/utils/rafThrottle.ts +162 -0
  50. package/src/utils/workerManager.ts +335 -0
  51. package/src/view/graph.vue +47 -33
  52. /package/src/statics/icons/childIcons//346/210/230/347/225/{245@3x.png" → 245/345/261/202@3x.png"} +0 -0
package/dist/style.css CHANGED
@@ -1 +1 @@
1
- @charset "UTF-8";.selection-box[data-v-98567c09]{pointer-events:none;background:transparent}.resize-handles[data-v-98567c09]{position:relative;width:100%;height:100%}.resize-handle[data-v-98567c09]{position:absolute;width:10px;height:10px;background-color:#007bff;border:2px solid #fff;border-radius:50%;pointer-events:all;transition:all .2s ease;box-shadow:0 2px 4px #0000004d;z-index:999}.resize-handle.is-disabled[data-v-98567c09]{cursor:default!important}.resize-handle[data-v-98567c09]:hover{background-color:#0056b3;transform:scale(1.2)}.action-buttons[data-v-98567c09]{display:flex;flex-direction:column;gap:4px;pointer-events:all;background:rgba(255,255,255,.95);padding:6px;border-radius:4px;box-shadow:0 2px 8px #00000026;border:1px solid #e0e0e0;backdrop-filter:blur(2px)}.action-btn[data-v-98567c09]{width:28px;height:28px;border:1px solid #d0d0d0;border-radius:3px;background:linear-gradient(to bottom,#f8f9fa,#e9ecef);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;font-family:Arial,sans-serif;color:#495057;transition:all .2s ease;box-shadow:0 1px 2px #0000000d}.action-btn[data-v-98567c09]:hover{background:linear-gradient(to bottom,#e3f2fd,#bbdefb);border-color:#90caf9;transform:translateY(-1px);box-shadow:0 2px 4px #2196f34d;color:#1976d2}.edit-btn[data-v-98567c09]:hover{background:#e3f2fd}.border-btn[data-v-98567c09]{padding-bottom:4px;border-bottom:1px solid #e0e0e0}.name-text-box-container[data-v-f0d3e2ba]{position:absolute;z-index:1001;pointer-events:all}.name-text-box[data-v-f0d3e2ba]{border:1px dashed #007bff;background:rgba(255,255,255,.2);cursor:pointer;pointer-events:all;transition:all .2s ease;border-radius:4px;box-shadow:0 0 0 1px #007bff1a;height:100%;display:flex;align-items:center;justify-content:center}.name-text-box[data-v-f0d3e2ba]:hover{border-color:#0056b3;background:rgba(0,123,255,.05);box-shadow:0 0 0 2px #007bff33;transform:scale(1.02)}.name-editor-container[data-v-f0d3e2ba]{position:absolute;z-index:1002;display:flex;justify-content:center;align-items:center;pointer-events:all}.name-input[data-v-f0d3e2ba]{width:calc(100% - 20px);padding:2px 4px;border:2px solid #007bff;border-radius:6px;font-size:12px;font-weight:600;background:#fff;box-shadow:0 4px 12px #00000026;outline:none;text-align:center;font-family:inherit;resize:none;overflow:hidden}.name-input[data-v-f0d3e2ba]:focus{border-color:#0056b3;box-shadow:0 0 0 3px #007bff40}.context-menu[data-v-0f7f66ba]{background-color:#fff;border:1px solid #ebeef5;border-radius:6px;box-shadow:0 2px 12px #0000001a;padding:6px 0;overflow-y:auto;box-sizing:border-box;transition:opacity .2s ease,transform .2s ease;transform-origin:top left}.context-menu[style*="display: block"][data-v-0f7f66ba]{animation:fadeIn-0f7f66ba .2s ease forwards}@keyframes fadeIn-0f7f66ba{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.context-menu[data-v-0f7f66ba]::-webkit-scrollbar{width:6px}.context-menu[data-v-0f7f66ba]::-webkit-scrollbar-thumb{background-color:#ddd;border-radius:3px}.context-menu[data-v-0f7f66ba]::-webkit-scrollbar-track{background-color:#f5f5f5}.menu-item[data-v-0f7f66ba]{padding:0 15px;cursor:pointer;font-size:14px;color:#606266;border-radius:4px;height:36px;line-height:36px;box-sizing:border-box}.menu-item[data-v-0f7f66ba]:hover{background-color:#f5f7fa;color:#303133}.menu-disabled[data-v-0f7f66ba]{color:#c0c4cc!important;cursor:not-allowed!important;pointer-events:none}.menu-disabled[data-v-0f7f66ba]:hover{background-color:transparent!important}.menu-disabled img[data-v-0f7f66ba]{opacity:.5}.context-menu[style*="--edge-hint: left"][data-v-0f7f66ba]{border-top-left-radius:0}.context-menu[style*="--edge-hint: right"][data-v-0f7f66ba]{border-top-right-radius:0}.context-menu[style*="--edge-hint: top"][data-v-0f7f66ba]{border-top-left-radius:0;border-top-right-radius:0}.context-menu[style*="--edge-hint: bottom"][data-v-0f7f66ba]{border-bottom-left-radius:0;border-bottom-right-radius:0}.display-tooltip[data-v-0f7f66ba]{background-color:#fff;border:1px solid #ebeef5;border-radius:6px;box-shadow:0 2px 12px #0000001a;padding:6px 0;min-width:120px;animation:tooltipFadeIn-0f7f66ba .2s ease forwards}.tooltip-content[data-v-0f7f66ba]{overflow:hidden}.tooltip-item[data-v-0f7f66ba]{padding:8px 16px;cursor:pointer;font-size:14px;color:#606266;border-radius:4px;transition:background-color .2s ease;display:flex;align-items:center}.tooltip-item[data-v-0f7f66ba]:hover{background-color:#f5f7fa;color:#303133}.tooltip-item span[data-v-0f7f66ba]{display:block}@keyframes tooltipFadeIn-0f7f66ba{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.connection-line[data-v-c4c3e8c0]{position:absolute;pointer-events:none;z-index:10}.interaction-layer[data-v-24a22c8c]{position:absolute;top:0;left:0;width:100%;height:100%;transform-origin:0 0;transform:scale(var(--65f24407));pointer-events:all;z-index:999}.hover-container-outline[data-v-24a22c8c]{position:absolute;pointer-events:none;padding:6px;top:6px}.hover-container-outline.is-valid[data-v-24a22c8c]{border:2px solid #0000ff}.hover-container-outline.is-invalid[data-v-24a22c8c]{border:2px solid #f1eded;background:rgba(240,237,237,.842)}.resize-ghost[data-v-24a22c8c]{position:absolute;border:2px solid #8a6d3b;background:transparent;box-shadow:0 0 0 2px #8a6d3b26 inset;pointer-events:none;z-index:9999}.connect-layer[data-v-24a22c8c]{position:absolute;pointer-events:none;z-index:1000}.connect-dot-direct[data-v-24a22c8c],.connect-dot-target[data-v-24a22c8c]{width:8px;height:8px;background-color:#000;border-radius:50%;border:1px solid #fff;box-shadow:0 0 4px #0000004d}.connection-line[data-v-24a22c8c]{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1000}.highlight-overlay[data-v-24a22c8c]{position:absolute;pointer-events:none;box-sizing:border-box;z-index:1001;border-radius:2px}.highlight-overlay.blue[data-v-24a22c8c]{border:3px solid #1890ff}.highlight-overlay.red[data-v-24a22c8c]{border:3px solid #f56c6c}.diagram-shape[data-v-1f4cb409]{background:#e5ecf0;border-radius:10px;box-shadow:0 2px 8px #0000001a;display:flex;flex-direction:column;overflow:hidden;box-sizing:border-box;margin:0;padding:0;border:var(--bw) var(--bs) var(--bc)}.hit-edge[data-v-1f4cb409]{position:absolute;background:transparent;z-index:999;pointer-events:auto}.hit-top[data-v-1f4cb409]{left:0;right:0;top:0;height:var(--bw)}.hit-right[data-v-1f4cb409]{top:0;right:0;bottom:0;width:var(--bw)}.hit-bottom[data-v-1f4cb409]{left:0;right:0;bottom:0;height:var(--bw)}.hit-left[data-v-1f4cb409]{top:0;left:0;bottom:0;width:var(--bw)}.diagram-header[data-v-1f4cb409]{background:rgba(255,255,255,.5);padding:3px 16px 3px 5px;display:inline-flex;align-items:center;position:relative;white-space:nowrap;align-self:flex-start}.diagram-header[data-v-1f4cb409]:after{content:"";position:absolute;bottom:-12px;right:-12px;width:20px;height:20px;background-color:var(--5113555a);transform:rotate(45deg);z-index:0}.diagram-title[data-v-1f4cb409]{font-family:var(--name-ff);font-size:var(--name-fs);font-weight:400;line-height:normal;letter-spacing:0em;font-variation-settings:"opsz" auto;font-feature-settings:"kern" on;color:var(--name-color);position:relative;z-index:2}.diagram-shape[data-v-05edf0d1]{user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;pointer-events:auto;touch-action:none;-webkit-touch-action:none;-ms-touch-action:none;zoom:1;transform:none!important;-webkit-transform:none!important;-moz-transform:none!important;-ms-transform:none!important}.diagram-svg[data-v-05edf0d1]{width:100%;height:100%;transform:none!important;-webkit-transform:none!important}.capability-shape[data-v-5ba17051]{display:flex;align-items:center;justify-content:center;overflow:hidden}.capability-svg[data-v-5ba17051]{display:block}.capability-shape[data-v-8e8054b6]{display:flex;align-items:center;justify-content:center;overflow:hidden}.capability-svg[data-v-8e8054b6]{display:block}.capability-shape[data-v-27d34586]{display:flex;align-items:center;justify-content:center;overflow:hidden}.capability-svg[data-v-27d34586]{display:block}.capability-shape[data-v-5f0b14f5]{display:flex;align-items:center;justify-content:center;overflow:hidden}.capability-svg[data-v-5f0b14f5]{display:block}.capability-shape[data-v-4f0bb734]{display:inline-block;position:relative;overflow:visible;box-sizing:content-box}[data-v-4f0bb734] .name-text-svg{text-align:left}[data-v-4f0bb734] .shape-name-svg{text-align:center}[data-v-4f0bb734] .content-text-svg{font-size:13px;line-height:1.4;color:#000;font-family:Arial,sans-serif;min-height:20px;overflow:visible;width:100%;box-sizing:border-box}[data-v-4f0bb734] .content-item{margin-bottom:4px;word-break:break-word;white-space:normal;overflow:visible;width:100%;box-sizing:border-box}[data-v-4f0bb734] .content-item:last-child{margin-bottom:0}.edge-component[data-v-8ed11c37]{position:absolute;pointer-events:all;cursor:pointer}.edge-svg[data-v-8ed11c37]{width:100%;height:100%;overflow:visible}.edge-svg polyline[data-v-8ed11c37]{pointer-events:all;stroke-linecap:round;stroke-linejoin:round}.edge-svg circle[data-v-8ed11c37]{pointer-events:none}.diagram-shape[data-v-daf180ad]{-webkit-user-select:none;-moz-user-select:none;user-select:none}.diagram-svg[data-v-daf180ad]{width:100%;height:100%}.capability-shape[data-v-ec8f07ea]{display:flex;align-items:center;justify-content:center;overflow:hidden}.capability-svg[data-v-ec8f07ea]{display:block}.output-pin-shape[data-v-2081b7c7]{display:flex;align-items:center;justify-content:center;overflow:visible}.output-pin-svg[data-v-2081b7c7]{display:block;overflow:visible}.port-shape[data-v-4aa98dd6]{display:flex;align-items:center;justify-content:center;overflow:visible}.port-svg[data-v-4aa98dd6]{display:block;overflow:visible}.diagram-list-tooltip[data-v-4e4791fa]{position:fixed;background:#ffffff;border:1px solid #e5e7eb;border-radius:6px;padding:10px 6px;box-shadow:0 4px 12px #00000026;z-index:9999;width:180px;max-width:300px}.tooltip-title[data-v-4e4791fa]{padding:0 12px}.diagram-item{&[data-v-4e4791fa]{display:flex;align-items:center;padding:0 12px;cursor:pointer;border-radius:4px;height:36px;line-height:36px;transition:background-color .2s}.diagram-name[data-v-4e4791fa]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}}.diagram-item[data-v-4e4791fa]:hover{background-color:#f0f3f6}.diagram-icon[data-v-4e4791fa]{width:24px;height:24px;margin-right:6px}.graph-view[data-v-d4982c78]{width:100%;height:100%;background-color:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;position:relative;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;user-select:none}.diagram-content[data-v-d4982c78]{position:absolute;inset:10px 0 10px 10px;overflow:auto;touch-action:none}.shapes-container[data-v-d4982c78]{position:relative;width:100%;height:100%;min-height:600px;transform-origin:0 0;transform:scale(var(--18ea7fc8))}.shapes-container[data-v-d4982c78]>*{position:absolute;will-change:transform}.zoom-level[data-v-d4982c78]{position:absolute;bottom:30px;right:15px;font-size:10px;font-weight:500;min-width:35px;text-align:center;color:#333;background:rgba(255,255,255,.9);padding:2px 6px;border-radius:3px;box-shadow:0 1px 3px #0000001a}.cut-overlay-svg[data-v-d4982c78]{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:998}
1
+ @charset "UTF-8";.selection-box[data-v-98567c09]{pointer-events:none;background:transparent}.resize-handles[data-v-98567c09]{position:relative;width:100%;height:100%}.resize-handle[data-v-98567c09]{position:absolute;width:10px;height:10px;background-color:#007bff;border:2px solid #fff;border-radius:50%;pointer-events:all;transition:all .2s ease;box-shadow:0 2px 4px #0000004d;z-index:999}.resize-handle.is-disabled[data-v-98567c09]{cursor:default!important}.resize-handle[data-v-98567c09]:hover{background-color:#0056b3;transform:scale(1.2)}.action-buttons[data-v-98567c09]{display:flex;flex-direction:column;gap:4px;pointer-events:all;background:rgba(255,255,255,.95);padding:6px;border-radius:4px;box-shadow:0 2px 8px #00000026;border:1px solid #e0e0e0;backdrop-filter:blur(2px)}.action-btn[data-v-98567c09]{width:28px;height:28px;border:1px solid #d0d0d0;border-radius:3px;background:linear-gradient(to bottom,#f8f9fa,#e9ecef);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;font-family:Arial,sans-serif;color:#495057;transition:all .2s ease;box-shadow:0 1px 2px #0000000d}.action-btn[data-v-98567c09]:hover{background:linear-gradient(to bottom,#e3f2fd,#bbdefb);border-color:#90caf9;transform:translateY(-1px);box-shadow:0 2px 4px #2196f34d;color:#1976d2}.edit-btn[data-v-98567c09]:hover{background:#e3f2fd}.border-btn[data-v-98567c09]{padding-bottom:4px;border-bottom:1px solid #e0e0e0}.name-text-box-container[data-v-f0d3e2ba]{position:absolute;z-index:1001;pointer-events:all}.name-text-box[data-v-f0d3e2ba]{border:1px dashed #007bff;background:rgba(255,255,255,.2);cursor:pointer;pointer-events:all;transition:all .2s ease;border-radius:4px;box-shadow:0 0 0 1px #007bff1a;height:100%;display:flex;align-items:center;justify-content:center}.name-text-box[data-v-f0d3e2ba]:hover{border-color:#0056b3;background:rgba(0,123,255,.05);box-shadow:0 0 0 2px #007bff33;transform:scale(1.02)}.name-editor-container[data-v-f0d3e2ba]{position:absolute;z-index:1002;display:flex;justify-content:center;align-items:center;pointer-events:all}.name-input[data-v-f0d3e2ba]{width:calc(100% - 20px);padding:2px 4px;border:2px solid #007bff;border-radius:6px;font-size:12px;font-weight:600;background:#fff;box-shadow:0 4px 12px #00000026;outline:none;text-align:center;font-family:inherit;resize:none;overflow:hidden}.name-input[data-v-f0d3e2ba]:focus{border-color:#0056b3;box-shadow:0 0 0 3px #007bff40}.context-menu[data-v-0f7f66ba]{background-color:#fff;border:1px solid #ebeef5;border-radius:6px;box-shadow:0 2px 12px #0000001a;padding:6px 0;overflow-y:auto;box-sizing:border-box;transition:opacity .2s ease,transform .2s ease;transform-origin:top left}.context-menu[style*="display: block"][data-v-0f7f66ba]{animation:fadeIn-0f7f66ba .2s ease forwards}@keyframes fadeIn-0f7f66ba{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.context-menu[data-v-0f7f66ba]::-webkit-scrollbar{width:6px}.context-menu[data-v-0f7f66ba]::-webkit-scrollbar-thumb{background-color:#ddd;border-radius:3px}.context-menu[data-v-0f7f66ba]::-webkit-scrollbar-track{background-color:#f5f5f5}.menu-item[data-v-0f7f66ba]{padding:0 15px;cursor:pointer;font-size:14px;color:#606266;border-radius:4px;height:36px;line-height:36px;box-sizing:border-box}.menu-item[data-v-0f7f66ba]:hover{background-color:#f5f7fa;color:#303133}.menu-disabled[data-v-0f7f66ba]{color:#c0c4cc!important;cursor:not-allowed!important;pointer-events:none}.menu-disabled[data-v-0f7f66ba]:hover{background-color:transparent!important}.menu-disabled img[data-v-0f7f66ba]{opacity:.5}.context-menu[style*="--edge-hint: left"][data-v-0f7f66ba]{border-top-left-radius:0}.context-menu[style*="--edge-hint: right"][data-v-0f7f66ba]{border-top-right-radius:0}.context-menu[style*="--edge-hint: top"][data-v-0f7f66ba]{border-top-left-radius:0;border-top-right-radius:0}.context-menu[style*="--edge-hint: bottom"][data-v-0f7f66ba]{border-bottom-left-radius:0;border-bottom-right-radius:0}.display-tooltip[data-v-0f7f66ba]{background-color:#fff;border:1px solid #ebeef5;border-radius:6px;box-shadow:0 2px 12px #0000001a;padding:6px 0;min-width:120px;animation:tooltipFadeIn-0f7f66ba .2s ease forwards}.tooltip-content[data-v-0f7f66ba]{overflow:hidden}.tooltip-item[data-v-0f7f66ba]{padding:8px 16px;cursor:pointer;font-size:14px;color:#606266;border-radius:4px;transition:background-color .2s ease;display:flex;align-items:center}.tooltip-item[data-v-0f7f66ba]:hover{background-color:#f5f7fa;color:#303133}.tooltip-item span[data-v-0f7f66ba]{display:block}@keyframes tooltipFadeIn-0f7f66ba{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.connection-line[data-v-c4c3e8c0]{position:absolute;pointer-events:none;z-index:10}.interaction-layer[data-v-07df083a]{position:absolute;top:0;left:0;width:100%;height:100%;transform-origin:0 0;transform:scale(var(--55742cb7));pointer-events:all;z-index:999}.hover-container-outline[data-v-07df083a]{position:absolute;pointer-events:none;padding:6px;top:6px}.hover-container-outline-svg[data-v-07df083a]{position:absolute;pointer-events:none}.hover-container-outline-svg .outline-path[data-v-07df083a]{fill:transparent;stroke-width:2px;stroke-linejoin:round}.hover-container-outline.is-valid[data-v-07df083a]{border:2px solid #0000ff}.hover-container-outline-svg.is-valid .outline-path[data-v-07df083a]{stroke:#00f}.hover-container-outline.is-invalid[data-v-07df083a]{border:2px solid #f1eded;background:rgba(240,237,237,.842)}.hover-container-outline-svg.is-invalid .outline-path[data-v-07df083a]{stroke:#f1eded;fill:#f0eded59}.resize-ghost[data-v-07df083a]{position:absolute;border:2px solid #8a6d3b;background:transparent;box-shadow:0 0 0 2px #8a6d3b26 inset;pointer-events:none;z-index:9999}.connect-layer[data-v-07df083a]{position:absolute;pointer-events:none;z-index:1000}.connect-dot-direct[data-v-07df083a],.connect-dot-target[data-v-07df083a]{width:8px;height:8px;background-color:#000;border-radius:50%;border:1px solid #fff;box-shadow:0 0 4px #0000004d}.connection-line[data-v-07df083a]{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1000}.highlight-overlay[data-v-07df083a]{position:absolute;pointer-events:none;box-sizing:border-box;z-index:1001;border-radius:2px}.highlight-overlay-svg[data-v-07df083a]{position:absolute;pointer-events:none}.highlight-overlay-svg .outline-path[data-v-07df083a]{fill:transparent;stroke-width:3px;stroke-linejoin:round}.highlight-overlay.blue[data-v-07df083a]{border:3px solid #1890ff}.highlight-overlay-svg.blue .outline-path[data-v-07df083a]{stroke:#1890ff}.highlight-overlay.red[data-v-07df083a]{border:3px solid #f56c6c}.highlight-overlay-svg.red .outline-path[data-v-07df083a]{stroke:#f56c6c}.diagram-shape[data-v-1f4cb409]{background:#e5ecf0;border-radius:10px;box-shadow:0 2px 8px #0000001a;display:flex;flex-direction:column;overflow:hidden;box-sizing:border-box;margin:0;padding:0;border:var(--bw) var(--bs) var(--bc)}.hit-edge[data-v-1f4cb409]{position:absolute;background:transparent;z-index:999;pointer-events:auto}.hit-top[data-v-1f4cb409]{left:0;right:0;top:0;height:var(--bw)}.hit-right[data-v-1f4cb409]{top:0;right:0;bottom:0;width:var(--bw)}.hit-bottom[data-v-1f4cb409]{left:0;right:0;bottom:0;height:var(--bw)}.hit-left[data-v-1f4cb409]{top:0;left:0;bottom:0;width:var(--bw)}.diagram-header[data-v-1f4cb409]{background:rgba(255,255,255,.5);padding:3px 16px 3px 5px;display:inline-flex;align-items:center;position:relative;white-space:nowrap;align-self:flex-start}.diagram-header[data-v-1f4cb409]:after{content:"";position:absolute;bottom:-12px;right:-12px;width:20px;height:20px;background-color:var(--5113555a);transform:rotate(45deg);z-index:0}.diagram-title[data-v-1f4cb409]{font-family:var(--name-ff);font-size:var(--name-fs);font-weight:400;line-height:normal;letter-spacing:0em;font-variation-settings:"opsz" auto;font-feature-settings:"kern" on;color:var(--name-color);position:relative;z-index:2}.diagram-shape[data-v-d0030e67]{user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;pointer-events:auto;touch-action:none;-webkit-touch-action:none;-ms-touch-action:none;zoom:1;transform:none!important;-webkit-transform:none!important;-moz-transform:none!important;-ms-transform:none!important}.diagram-svg[data-v-d0030e67]{width:100%;height:100%;transform:none!important;-webkit-transform:none!important}.capability-shape[data-v-5ba17051]{display:flex;align-items:center;justify-content:center;overflow:hidden}.capability-svg[data-v-5ba17051]{display:block}.capability-shape[data-v-8e8054b6]{display:flex;align-items:center;justify-content:center;overflow:hidden}.capability-svg[data-v-8e8054b6]{display:block}.capability-shape[data-v-27d34586]{display:flex;align-items:center;justify-content:center;overflow:hidden}.capability-svg[data-v-27d34586]{display:block}.capability-shape[data-v-5f0b14f5]{display:flex;align-items:center;justify-content:center;overflow:hidden}.capability-svg[data-v-5f0b14f5]{display:block}.capability-shape[data-v-4f0bb734]{display:inline-block;position:relative;overflow:visible;box-sizing:content-box}[data-v-4f0bb734] .name-text-svg{text-align:left}[data-v-4f0bb734] .shape-name-svg{text-align:center}[data-v-4f0bb734] .content-text-svg{font-size:13px;line-height:1.4;color:#000;font-family:Arial,sans-serif;min-height:20px;overflow:visible;width:100%;box-sizing:border-box}[data-v-4f0bb734] .content-item{margin-bottom:4px;word-break:break-word;white-space:normal;overflow:visible;width:100%;box-sizing:border-box}[data-v-4f0bb734] .content-item:last-child{margin-bottom:0}.edge-component[data-v-c885b93d]{position:absolute;pointer-events:all;cursor:pointer}.edge-svg[data-v-c885b93d]{width:100%;height:100%;overflow:visible}.edge-svg polyline[data-v-c885b93d]{pointer-events:all;stroke-linecap:round;stroke-linejoin:round}.edge-svg circle[data-v-c885b93d]{pointer-events:none}.diagram-shape[data-v-daf180ad]{-webkit-user-select:none;-moz-user-select:none;user-select:none}.diagram-svg[data-v-daf180ad]{width:100%;height:100%}.capability-shape[data-v-ec8f07ea]{display:flex;align-items:center;justify-content:center;overflow:hidden}.capability-svg[data-v-ec8f07ea]{display:block}.output-pin-shape[data-v-2081b7c7]{display:flex;align-items:center;justify-content:center;overflow:visible}.output-pin-svg[data-v-2081b7c7]{display:block;overflow:visible}.port-shape[data-v-4aa98dd6]{display:flex;align-items:center;justify-content:center;overflow:visible}.port-svg[data-v-4aa98dd6]{display:block;overflow:visible}.gantt-context-menu[data-v-4efbe149]{background-color:#fff;border:1px solid #ebeef5;border-radius:6px;box-shadow:0 2px 12px #0000001a;padding:6px 0;overflow-y:auto;box-sizing:border-box;transition:opacity .2s ease,transform .2s ease;transform-origin:top left}.gantt-context-menu[style*="display: block"][data-v-4efbe149]{animation:fadeIn-4efbe149 .2s ease forwards}@keyframes fadeIn-4efbe149{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.gantt-context-menu[data-v-4efbe149]::-webkit-scrollbar{width:6px}.gantt-context-menu[data-v-4efbe149]::-webkit-scrollbar-thumb{background-color:#ddd;border-radius:3px}.gantt-context-menu[data-v-4efbe149]::-webkit-scrollbar-track{background-color:#f5f5f5}.menu-item[data-v-4efbe149]{padding:0 15px;cursor:pointer;font-size:14px;color:#606266;border-radius:4px;height:36px;line-height:36px;box-sizing:border-box}.menu-item[data-v-4efbe149]:hover:not(.menu-disabled){background-color:#f5f7fa;color:#303133}.menu-disabled[data-v-4efbe149]{color:#c0c4cc!important;cursor:not-allowed!important;pointer-events:none}.menu-disabled[data-v-4efbe149]:hover{background-color:transparent!important}.menu-disabled img[data-v-4efbe149]{opacity:.5}.gantt-container[data-v-5539a506]{--header-row-h: 28px;--data-row-h: 32px;display:flex;box-sizing:border-box;border:1px solid #dcdfe6;background:#fff;overflow:hidden;font-size:12px;font-family:Source Han Sans SC,Microsoft YaHei,PingFang SC,Arial,sans-serif}.gantt-search-bar[data-v-5539a506]{position:absolute;top:0;left:0;right:0;height:36px;background:#f5f7fa;border-bottom:1px solid #dcdfe6;display:flex;align-items:center;padding:0 12px;gap:8px;z-index:10;box-sizing:border-box}.search-input[data-v-5539a506]{flex:1;height:24px;padding:0 8px;border:1px solid #dcdfe6;border-radius:3px;font-size:12px;outline:none;transition:border-color .2s}.search-input[data-v-5539a506]:focus{border-color:#409eff}.search-result-info[data-v-5539a506]{font-size:12px;color:#606266;white-space:nowrap;min-width:60px;text-align:center}.search-nav-btn[data-v-5539a506]{width:24px;height:24px;border:1px solid #dcdfe6;border-radius:3px;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#606266;transition:all .2s}.search-nav-btn[data-v-5539a506]:hover:not(:disabled){border-color:#409eff;color:#409eff}.search-nav-btn[data-v-5539a506]:disabled{cursor:not-allowed;opacity:.4}.search-close-btn[data-v-5539a506]{width:24px;height:24px;border:1px solid #dcdfe6;border-radius:3px;background:#fff;cursor:pointer;font-size:18px;line-height:1;color:#909399;transition:all .2s;display:flex;align-items:center;justify-content:center}.search-close-btn[data-v-5539a506]:hover{border-color:#f56c6c;color:#f56c6c}.gantt-left[data-v-5539a506]{width:var(--e3ddce82);min-width:180px;flex-shrink:0;border-right:1px solid #dcdfe6;overflow-x:auto;overflow-y:auto;margin-top:var(--b45c7114)}.gantt-left[data-v-5539a506]::-webkit-scrollbar{width:0;height:8px}.gantt-left[data-v-5539a506]::-webkit-scrollbar-track{background:#f1f1f1}.gantt-left[data-v-5539a506]::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:4px}.gantt-left[data-v-5539a506]::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.gantt-table[data-v-5539a506]{width:-moz-max-content;width:max-content;min-width:100%;border-collapse:separate;border-spacing:0}.gantt-table th[data-v-5539a506],.gantt-table td[data-v-5539a506]{box-sizing:border-box;border:none;border-bottom:1px solid #ebeef5;border-right:1px solid #ebeef5;padding:0 8px;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}.gantt-table th[data-v-5539a506]:first-child,.gantt-table td[data-v-5539a506]:first-child{border-left:1px solid #ebeef5}.header-row-1 th[data-v-5539a506]{height:var(--header-row-h);background:#f5f7fa;position:sticky;top:0;z-index:1;border-top:1px solid #ebeef5;border-bottom-color:#dcdfe6}.header-row-2 th[data-v-5539a506]{height:var(--header-row-h);background:#f5f7fa;font-weight:500;color:#606266;position:sticky;top:var(--header-row-h);z-index:1;border-bottom-color:#dcdfe6;padding:0}.th-content[data-v-5539a506]{position:relative;width:100%;height:100%;display:flex;align-items:center;padding:0 8px}.th-label[data-v-5539a506]{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.col-resizer[data-v-5539a506]{position:absolute;right:0;top:0;bottom:0;width:5px;cursor:col-resize;-webkit-user-select:none;-moz-user-select:none;user-select:none}.col-resizer[data-v-5539a506]:hover{background-color:#409eff1a}.gantt-table td[data-v-5539a506]{height:var(--data-row-h)}.gantt-spacer-row td[data-v-5539a506]{height:0;padding:0;border:none!important}.gantt-spacer[data-v-5539a506]{width:1px}.gantt-row[data-v-5539a506]:has(.col-date>div){position:relative;z-index:10}.col-name[data-v-5539a506]{max-width:none}.col-date[data-v-5539a506]{width:auto;font-size:11px;color:#909399;text-align:center;position:relative;cursor:default}.col-date[data-v-5539a506]:has(div){overflow:visible!important}.col-date>div[data-v-5539a506]{position:relative;z-index:100}.col-date[data-v-5539a506] .el-date-editor{width:100%!important}.col-date[data-v-5539a506] .el-input__wrapper{padding:0 4px;height:26px;font-size:11px}.col-date[data-v-5539a506] .el-picker__popper{z-index:1000!important}.expand-icon[data-v-5539a506]{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.item-name[data-v-5539a506]{overflow:hidden;text-overflow:ellipsis}.cell-input[data-v-5539a506]{width:100%;height:24px;padding:0 4px;border:1px solid #409eff;border-radius:2px;font-size:12px;outline:none;box-sizing:border-box;background:#fff}.cell-input[data-v-5539a506]:focus{border-color:#409eff;box-shadow:0 0 0 2px #409eff33}.gantt-divider[data-v-5539a506]{width:4px;cursor:col-resize;background:#dcdfe6;flex-shrink:0}.gantt-divider[data-v-5539a506]:hover{background:#409eff}.gantt-timeline[data-v-5539a506]{flex:1;overflow:auto;position:relative;margin-top:var(--b45c7114)}.gantt-left[data-v-5539a506],.gantt-timeline[data-v-5539a506]{padding-bottom:var(--gantt-bottom-compensation, 0px)}.gantt-timeline[data-v-5539a506]::-webkit-scrollbar{width:8px;height:8px}.gantt-timeline[data-v-5539a506]::-webkit-scrollbar-track{background:#f1f1f1}.gantt-timeline[data-v-5539a506]::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:4px}.gantt-timeline[data-v-5539a506]::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.timeline-header[data-v-5539a506]{position:sticky;top:0;z-index:2;background:#f5f7fa}.year-row[data-v-5539a506]{display:flex;height:var(--header-row-h);border-bottom:1px solid #dcdfe6;box-sizing:border-box}.year-cell[data-v-5539a506]{text-align:center;font-weight:500;line-height:calc(var(--header-row-h) - 1px);color:#303133;border-right:1px solid #ebeef5;flex-shrink:0;box-sizing:border-box}.month-row[data-v-5539a506]{display:flex;height:var(--header-row-h);border-bottom:1px solid #dcdfe6;box-sizing:border-box}.month-cell[data-v-5539a506]{text-align:center;line-height:calc(var(--header-row-h) - 1px);color:#606266;border-right:1px solid #ebeef5;flex-shrink:0;box-sizing:border-box}.timeline-body[data-v-5539a506]{position:relative}.timeline-spacer[data-v-5539a506]{width:100%;pointer-events:none}.grid-lines[data-v-5539a506]{position:absolute;inset:0;pointer-events:none}.grid-line[data-v-5539a506]{position:absolute;top:0;bottom:0;width:1px;border-left:1px dashed #e4e7ed}.bar-row[data-v-5539a506]{height:var(--data-row-h);position:relative;border-bottom:1px solid #ebeef5;box-sizing:border-box}.gantt-bar[data-v-5539a506]{position:absolute;top:6px;height:20px;border-radius:3px;background:#409eff;opacity:.85}.row-selected[data-v-5539a506]{background-color:#ecf5ff!important}.gantt-row.row-selected td[data-v-5539a506]{background-color:#ecf5ff}.gantt-milestone[data-v-5539a506]{position:absolute;top:8px;width:14px;height:14px;background:#e6a23c;transform:rotate(45deg);margin-left:-7px}.diagram-list-tooltip[data-v-25147cf1]{position:fixed;background:#ffffff;border:1px solid #e5e7eb;border-radius:6px;padding:10px 6px;box-shadow:0 4px 12px #00000026;z-index:9999;width:180px;max-width:300px}.tooltip-title[data-v-25147cf1]{padding:0 12px}.diagram-item{&[data-v-25147cf1]{display:flex;align-items:center;padding:0 12px;cursor:pointer;border-radius:4px;height:36px;line-height:36px;transition:background-color .2s}.diagram-name[data-v-25147cf1]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}}.diagram-item[data-v-25147cf1]:hover{background-color:#f0f3f6}.diagram-icon[data-v-25147cf1]{width:24px;height:24px;margin-right:6px}.gantt-container[data-v-a49a3381]{--header-row-h: 28px;--data-row-h: 32px;position:relative;display:flex;width:100%;height:100%;border:1px solid #dcdfe6;background:#fff;overflow:hidden;font-size:12px;font-family:Source Han Sans SC,Microsoft YaHei,PingFang SC,Arial,sans-serif}.gantt-left[data-v-a49a3381]{width:100%;overflow:auto}.gantt-left.with-search-bar[data-v-a49a3381]{margin-top:36px}.table-spacer-row td[data-v-a49a3381]{height:0;padding:0;border:none!important}.table-spacer[data-v-a49a3381]{width:1px}.gantt-table[data-v-a49a3381]{border-collapse:separate;border-spacing:0;table-layout:fixed}.th-content[data-v-a49a3381]{position:relative;display:flex;align-items:center;width:100%;height:100%;min-width:0;padding:0 8px;box-sizing:border-box}.gantt-table th[data-v-a49a3381],.gantt-table td[data-v-a49a3381]{box-sizing:border-box;padding:0 8px;border:none;border-bottom:1px solid #ebeef5;border-right:1px solid #ebeef5;text-align:left;vertical-align:middle;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gantt-table th[data-v-a49a3381]:first-child,.gantt-table td[data-v-a49a3381]:first-child{border-left:1px solid #ebeef5;width:50px;min-width:50px;max-width:50px}.header-row-2 th[data-v-a49a3381]{position:sticky;z-index:1;height:var(--header-row-h);background:#f5f7fa;border-bottom-color:#dcdfe6;font-weight:500;color:#606266}.gantt-table td[data-v-a49a3381]{height:var(--data-row-h)}.col-name[data-v-a49a3381]{text-align:left}.col-td[data-v-a49a3381]{text-align:center}.col-index[data-v-a49a3381]{width:60px!important}.th-label[data-v-a49a3381]{font-weight:600}.cell-text[data-v-a49a3381]{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.expand-icon[data-v-a49a3381]{display:inline-block;margin-right:4px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.item-name[data-v-a49a3381]{display:inline-block;width:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:middle;display:flex;align-items:center;min-width:0}.expand-icon[data-v-a49a3381]{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;margin-right:5px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.item-index[data-v-a49a3381]{text-align:center}.cell-input[data-v-a49a3381]{width:100%}.cell-input[data-v-a49a3381] .el-input__wrapper{padding:0 6px;height:24px;box-shadow:0 0 0 1px #409eff inset;border-radius:3px}.cell-select[data-v-a49a3381]{width:100%}.cell-select[data-v-a49a3381] .el-input__wrapper{min-height:24px;height:24px;padding:0 6px;border-radius:3px}.cell-switch[data-v-a49a3381]{display:inline-flex;align-items:center;height:24px}.cell-date[data-v-a49a3381]{width:100%}.cell-date[data-v-a49a3381] .el-input__wrapper{min-height:24px;height:24px;padding:0 6px;border-radius:3px}.cell-textarea[data-v-a49a3381]{width:100%}.cell-textarea[data-v-a49a3381] .el-textarea__inner{font-size:12px;line-height:18px;padding:4px 6px}.col-resizer[data-v-a49a3381]{position:absolute;right:-8px;top:0;bottom:0;width:5px;cursor:col-resize;-webkit-user-select:none;-moz-user-select:none;user-select:none}.col-resizer[data-v-a49a3381]:hover{background-color:#409eff1a}.row-selected[data-v-a49a3381]{background-color:#ecf5ff!important}.gantt-row.row-selected td[data-v-a49a3381]{background-color:#ecf5ff}.matrix[data-v-0f900ea6]{width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden;background:#fff}.matrix-header[data-v-0f900ea6]{padding:8px 12px;border-bottom:1px solid #e8e8e8;display:flex;align-items:center;gap:8px}.matrix-header .matrix-header-left[data-v-0f900ea6]{display:flex;align-items:center;gap:6px}.matrix-header .matrix-header-title[data-v-0f900ea6]{font-weight:600;font-size:14px}.matrix-header .matrix-header-icon[data-v-0f900ea6]{display:inline-flex;align-items:center;cursor:pointer;color:#606266;font-size:14px;padding:2px 4px;border:1px solid #dcdfe6;border-radius:4px}.matrix-header .matrix-header-icon .icon-grids[data-v-0f900ea6]{margin-right:2px}.matrix-header .matrix-header-icon .icon-arrow[data-v-0f900ea6]{font-size:10px;opacity:.8}.matrix-toolbar[data-v-0f900ea6]{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-bottom:1px solid #e8e8e8;flex-shrink:0}.matrix-criteria[data-v-0f900ea6]{display:flex;align-items:center;gap:8px}.matrix-criteria .criteria-label[data-v-0f900ea6]{font-size:12px;color:#666}.matrix-criteria .criteria-select[data-v-0f900ea6]{width:120px}.matrix-criteria .find-input[data-v-0f900ea6]{width:160px}.matrix-criteria .criteria-checkbox[data-v-0f900ea6]{font-size:12px;color:#606266}.matrix-table-wrap[data-v-0f900ea6]{flex:1;overflow:auto;padding:12px}.matrix-table[data-v-0f900ea6]{border-collapse:collapse;min-width:100%;font-size:12px}.matrix-table th[data-v-0f900ea6],.matrix-table td[data-v-0f900ea6]{border:none;padding:6px 8px;vertical-align:middle}.matrix-table .matrix-corner[data-v-0f900ea6]{min-width:140px;width:140px;background:#fff;border-right:1px solid #d0d0d0;border-bottom:1px solid #d0d0d0;vertical-align:middle}.matrix-table .matrix-corner .matrix-corner__header[data-v-0f900ea6]{display:inline-flex;align-items:center;gap:6px;padding:4px 0}.matrix-table .matrix-corner .matrix-corner__icon-img[data-v-0f900ea6]{width:16px;height:16px;display:block;flex-shrink:0}.matrix-table .matrix-corner .matrix-corner__icon[data-v-0f900ea6]{width:18px;height:18px;border-radius:50%;background:#f0c000;color:#333;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0}.matrix-table .matrix-corner .matrix-corner__name[data-v-0f900ea6]{font-size:12px;color:#303133;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.matrix-table .matrix-col-header[data-v-0f900ea6]{min-width:48px;text-align:left;background:#fff;font-weight:500;font-size:12px;color:#303133;vertical-align:middle;cursor:pointer}.matrix-table .matrix-col-header .matrix-col-header__inner[data-v-0f900ea6]{display:inline-flex;align-items:center;gap:6px;min-height:28px}.matrix-table .matrix-col-header.matrix-col-header--parent[data-v-0f900ea6]{border-bottom:1px dashed #999}.matrix-table .matrix-col-header.matrix-col-header--parent .col-expand--square[data-v-0f900ea6]{width:16px;height:16px;border:1px solid #c0c4cc;border-radius:2px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:12px;color:#606266;flex-shrink:0}.matrix-table .matrix-col-header.matrix-col-header--parent .col-node-icon--folder[data-v-0f900ea6]{flex-shrink:0;font-size:14px}.matrix-table .matrix-col-header .col-node-icon--img[data-v-0f900ea6]{width:16px;height:16px;display:block;flex-shrink:0}.matrix-table .matrix-col-header .col-node-icon--circle[data-v-0f900ea6]{width:18px;height:18px;border-radius:50%;background:#f0c000;color:#333;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0}.matrix-table .matrix-col-header.matrix-col-header--leaf[data-v-0f900ea6]{text-align:center;position:relative;padding-top:14px;border-bottom:1px solid #d0d0d0}.matrix-table .matrix-col-header.matrix-col-header--leaf .matrix-col-header__inner[data-v-0f900ea6]{justify-content:center;margin:0 auto}.matrix-table .matrix-col-header.matrix-col-header--leaf[data-v-0f900ea6]:before{content:"";position:absolute;left:50%;top:0;height:14px;width:0;border-left:1px dashed #333}.matrix-table .matrix-col-header.matrix-col-header--spanning[data-v-0f900ea6]{vertical-align:bottom;text-align:center;position:relative;padding-top:14px;border-bottom:1px solid #d0d0d0}.matrix-table .matrix-col-header.matrix-col-header--spanning[data-v-0f900ea6]:before{content:"";position:absolute;left:50%;top:0;height:calc(100% - 30px);width:0;border-left:1px dashed #333}.matrix-table .matrix-col-header .col-node-label[data-v-0f900ea6]{color:#303133}.matrix-table .matrix-row-header[data-v-0f900ea6]{min-width:200px;background:#fff;padding:0 10px;vertical-align:middle;border-right:1px solid #d0d0d0;cursor:pointer}.matrix-table .matrix-row-header.matrix-row-header--selected[data-v-0f900ea6],.matrix-table tr.matrix-row--selected .matrix-cell[data-v-0f900ea6],.matrix-table .matrix-col-header.matrix-col-header--selected[data-v-0f900ea6]{background:#e6f7ff}.matrix-table .matrix-cell.matrix-cell--selected[data-v-0f900ea6]{background:#bae7ff}.matrix-table .matrix-row-header .row-tree-cell[data-v-0f900ea6]{position:relative;display:flex;align-items:center;min-height:28px;font-size:12px;gap:6px}.matrix-table .row-conn-vline[data-v-0f900ea6]{position:absolute;top:0;bottom:0;width:0;border-left:1px dashed #999;pointer-events:none}.matrix-table .row-conn-branch[data-v-0f900ea6]{position:absolute;top:0;bottom:0;pointer-events:none}.matrix-table .row-conn-branch[data-v-0f900ea6]:before{content:"";position:absolute;left:0;top:0;bottom:0;border-left:1px dashed #999}.matrix-table .row-conn-branch[data-v-0f900ea6]:after{content:"";position:absolute;left:0;top:50%;right:0;border-top:1px dashed #999}.matrix-table .row-conn-branch.row-conn-branch--last[data-v-0f900ea6]:before{bottom:50%}.matrix-table .row-expand[data-v-0f900ea6]{width:16px;height:16px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;line-height:1}.matrix-table .row-expand.row-expand--square[data-v-0f900ea6]{border:1px solid #c0c4cc;border-radius:2px;font-size:12px;color:#606266;background:#fff}.matrix-table .row-expand-placeholder[data-v-0f900ea6]{width:16px;flex-shrink:0}.matrix-table .row-node-icon--folder[data-v-0f900ea6]{flex-shrink:0;font-size:14px}.matrix-table .row-node-icon--img[data-v-0f900ea6]{width:16px;height:16px;display:block;flex-shrink:0}.matrix-table .row-node-icon--circle[data-v-0f900ea6]{width:18px;height:18px;border-radius:50%;background:#e6a23c;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0}.matrix-table .row-node-label[data-v-0f900ea6]{color:#303133}.matrix-table .matrix-cell[data-v-0f900ea6]{min-width:48px;text-align:center;color:#303133;background:#fff;border:1px solid #d0d0d0;cursor:pointer}.matrix-table .matrix-cell.matrix-cell--has-value[data-v-0f900ea6]{background:#e6f7ff}.matrix-table .matrix-cell.matrix-cell--disabled[data-v-0f900ea6]{background:#f5f5f5;color:#c0c4cc;cursor:not-allowed}.matrix-table .matrix-cell .cell-dependency[data-v-0f900ea6]{color:#1890ff;font-weight:700;font-size:14px}.matrix-table .matrix-cell .cell-dependency.cell-arrow--up[data-v-0f900ea6],.matrix-table .matrix-cell .cell-dependency.cell-arrow--down[data-v-0f900ea6]{font-size:16px;font-weight:700}.matrix-table .matrix-cell .cell-value[data-v-0f900ea6]{font-weight:500}.graph-view[data-v-c87a4c75]{width:100%;height:100%;background-color:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;position:relative;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;user-select:none}.diagram-content[data-v-c87a4c75]{position:absolute;inset:10px 0 10px 10px;overflow:auto;touch-action:none}.shapes-container[data-v-c87a4c75]{position:relative;width:100%;height:100%;min-height:600px;transform-origin:0 0;transform:scale(var(--7cc4bada))}.shapes-container[data-v-c87a4c75]>*{position:absolute;will-change:transform}.zoom-level[data-v-c87a4c75]{position:absolute;bottom:30px;right:15px;font-size:10px;font-weight:500;min-width:35px;text-align:center;color:#333;background:rgba(255,255,255,.9);padding:2px 6px;border-radius:3px;box-shadow:0 1px 3px #0000001a}.cut-overlay-svg[data-v-c87a4c75]{position:absolute;top:0;left:0;pointer-events:none;z-index:998}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mx-sose-front/mx-sose-graph",
3
- "version": "1.1.7",
3
+ "version": "1.1.9",
4
4
  "description": "A Vue3 graph visualization plugin library",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.esm.js",
@@ -0,0 +1,451 @@
1
+ <template>
2
+ <!-- ===== Standard tree mode ===== -->
3
+ <div v-if="!alignLeaves" class="common-tree" :class="{ 'common-tree--horizontal': direction === 'horizontal' }">
4
+ <template v-for="(node, index) in data" :key="getNodeKey(node)">
5
+ <div
6
+ class="common-tree-node"
7
+ :class="{
8
+ 'common-tree-node--with-connector': connectorLines && hasChildren(node) && expandedSet.has(getNodeKey(node)),
9
+ 'common-tree-node--horizontal': direction === 'horizontal',
10
+ }"
11
+ :style="nodeStyle(node)"
12
+ >
13
+ <div class="common-tree-node__content">
14
+ <span
15
+ v-if="hasChildren(node)"
16
+ :class="['common-tree-node__expand', 'common-tree-node__expand--' + expandStyleFor(node)]"
17
+ @click.stop="toggle(node)"
18
+ >
19
+ <template v-if="expandStyleFor(node) === 'square'">
20
+ {{ expandedSet.has(getNodeKey(node)) ? '−' : '+' }}
21
+ </template>
22
+ <template v-else>
23
+ {{ expandedSet.has(getNodeKey(node)) ? '▾' : '▸' }}
24
+ </template>
25
+ </span>
26
+ <span v-else class="common-tree-node__expand-placeholder" />
27
+ <slot name="default" :node="node" :data="node" :expanded="expandedSet.has(getNodeKey(node))">
28
+ <span class="common-tree-node__label">{{ getNodeLabel(node) }}</span>
29
+ </slot>
30
+ </div>
31
+ <template v-if="hasChildren(node) && expandedSet.has(getNodeKey(node))">
32
+ <div
33
+ v-if="connectorLines"
34
+ class="common-tree-node__children-connector"
35
+ :class="{ 'common-tree-node__children-connector--horizontal': direction === 'horizontal' }"
36
+ >
37
+ <Tree
38
+ :data="getChildren(node)"
39
+ :depth="depth + 1"
40
+ :node-key="nodeKey"
41
+ :label="label"
42
+ :children-key="childrenKey"
43
+ :expanded-keys="expandedKeys"
44
+ :indent="indent"
45
+ :connector-lines="connectorLines"
46
+ :expand-style="expandStyle"
47
+ :direction="direction"
48
+ @toggle="onChildToggle"
49
+ >
50
+ <template #default="childScope">
51
+ <slot name="default" :node="(childScope as SlotScope).node" :data="(childScope as SlotScope).data" :expanded="(childScope as SlotScope).expanded" />
52
+ </template>
53
+ </Tree>
54
+ </div>
55
+ <Tree
56
+ v-else
57
+ :data="getChildren(node)"
58
+ :depth="depth + 1"
59
+ :node-key="nodeKey"
60
+ :label="label"
61
+ :children-key="childrenKey"
62
+ :expanded-keys="expandedKeys"
63
+ :indent="indent"
64
+ :expand-style="expandStyle"
65
+ :direction="direction"
66
+ @toggle="onChildToggle"
67
+ >
68
+ <template #default="childScope">
69
+ <slot name="default" :node="(childScope as SlotScope).node" :data="(childScope as SlotScope).data" :expanded="(childScope as SlotScope).expanded" />
70
+ </template>
71
+ </Tree>
72
+ </template>
73
+ </div>
74
+ </template>
75
+ </div>
76
+
77
+ <!-- ===== Aligned-leaves (top-down) mode: all leaves on the same bottom row ===== -->
78
+ <div v-else class="common-tree td" :class="{ 'td--nested': depth > 0 }">
79
+ <div
80
+ v-for="node in data"
81
+ :key="getNodeKey(node)"
82
+ class="td-col"
83
+ :class="{
84
+ 'td-col--expanded': hasChildren(node) && expandedSet.has(getNodeKey(node)),
85
+ 'td-col--leaf': !hasChildren(node) || !expandedSet.has(getNodeKey(node)),
86
+ }"
87
+ >
88
+ <!-- Leaf / collapsed: spacer with dashed line pushes node to bottom -->
89
+ <template v-if="!hasChildren(node) || !expandedSet.has(getNodeKey(node))">
90
+ <div class="td-spacer"><div class="td-vline" /></div>
91
+ <div class="td-node">
92
+ <span
93
+ v-if="hasChildren(node)"
94
+ :class="['td-expand', 'td-expand--' + expandStyleFor(node)]"
95
+ @click.stop="toggle(node)"
96
+ >
97
+ <template v-if="expandStyleFor(node) === 'square'">+</template>
98
+ <template v-else>▸</template>
99
+ </span>
100
+ <span v-else class="td-expand-ph" />
101
+ <slot name="default" :node="node" :data="node" :expanded="false">
102
+ <span class="td-label">{{ getNodeLabel(node) }}</span>
103
+ </slot>
104
+ </div>
105
+ </template>
106
+
107
+ <!-- Expanded parent: top connector + node + down connector + children -->
108
+ <template v-else>
109
+ <div v-if="depth > 0" class="td-top-conn" />
110
+ <div class="td-node">
111
+ <span
112
+ :class="['td-expand', 'td-expand--' + expandStyleFor(node)]"
113
+ @click.stop="toggle(node)"
114
+ >
115
+ <template v-if="expandStyleFor(node) === 'square'">−</template>
116
+ <template v-else>▾</template>
117
+ </span>
118
+ <slot name="default" :node="node" :data="node" :expanded="true">
119
+ <span class="td-label">{{ getNodeLabel(node) }}</span>
120
+ </slot>
121
+ </div>
122
+ <div class="td-down-line" />
123
+ <div class="td-kids">
124
+ <Tree
125
+ :data="getChildren(node)"
126
+ :depth="depth + 1"
127
+ :node-key="nodeKey"
128
+ :label="label"
129
+ :children-key="childrenKey"
130
+ :expanded-keys="expandedKeys"
131
+ :indent="indent"
132
+ :connector-lines="connectorLines"
133
+ :expand-style="expandStyle"
134
+ align-leaves
135
+ :direction="direction"
136
+ @toggle="onChildToggle"
137
+ >
138
+ <template #default="childScope">
139
+ <slot name="default" :node="(childScope as SlotScope).node" :data="(childScope as SlotScope).data" :expanded="(childScope as SlotScope).expanded" />
140
+ </template>
141
+ </Tree>
142
+ </div>
143
+ </template>
144
+ </div>
145
+ </div>
146
+ </template>
147
+
148
+ <script setup lang="ts">
149
+ import { computed, defineAsyncComponent } from 'vue'
150
+
151
+ const Tree = defineAsyncComponent(() => import('./Tree.vue'))
152
+
153
+ export interface TreeProps {
154
+ /** 树数据 */
155
+ data: unknown[]
156
+ /** 当前层级(内部递归用) */
157
+ depth?: number
158
+ /** 节点唯一标识字段名 */
159
+ nodeKey?: string
160
+ /** 节点标签字段名 */
161
+ label?: string
162
+ /** 子节点字段名 */
163
+ childrenKey?: string
164
+ /** 展开的节点 key 列表(受控) */
165
+ expandedKeys?: string[]
166
+ /** 子级缩进像素 */
167
+ indent?: number
168
+ /** 是否显示父子层级虚线连接 */
169
+ connectorLines?: boolean
170
+ /** 展开按钮样式:'square' 方框 −/+,'triangle' 三角 ▾/▸;可传函数按节点返回 */
171
+ expandStyle?: 'square' | 'triangle' | ((node: unknown) => 'square' | 'triangle')
172
+ /** 展开方向:垂直(子节点在下)或横向(子节点在右) */
173
+ direction?: 'vertical' | 'horizontal'
174
+ /** 对齐叶子节点到同一行底部(top-down 树形布局) */
175
+ alignLeaves?: boolean
176
+ }
177
+
178
+ const props = withDefaults(defineProps<TreeProps>(), {
179
+ depth: 0,
180
+ nodeKey: 'id',
181
+ label: 'label',
182
+ childrenKey: 'children',
183
+ expandedKeys: () => [],
184
+ indent: 18,
185
+ connectorLines: false,
186
+ expandStyle: 'square',
187
+ direction: 'vertical',
188
+ alignLeaves: false,
189
+ })
190
+
191
+ const emit = defineEmits<{
192
+ (e: 'toggle', key: string): void
193
+ (e: 'node-expand', data: unknown): void
194
+ (e: 'node-collapse', data: unknown): void
195
+ }>()
196
+
197
+ interface SlotScope {
198
+ node: unknown
199
+ data: unknown
200
+ expanded: boolean
201
+ }
202
+ defineSlots<{ default(props: SlotScope): unknown }>()
203
+
204
+
205
+ const expandedSet = computed(() => new Set<string>(props.expandedKeys))
206
+
207
+ function getNodeKey(node: unknown): string {
208
+ const key = (node as Record<string, unknown>)[props.nodeKey]
209
+ return key != null ? String(key) : ''
210
+ }
211
+
212
+ function getNodeLabel(node: unknown): string {
213
+ const val = (node as Record<string, unknown>)[props.label]
214
+ return val != null ? String(val) : ''
215
+ }
216
+
217
+ function getChildren(node: unknown): unknown[] {
218
+ const list = (node as Record<string, unknown>)[props.childrenKey]
219
+ return Array.isArray(list) ? list : []
220
+ }
221
+
222
+ function hasChildren(node: unknown): boolean {
223
+ const list = getChildren(node)
224
+ return list.length > 0
225
+ }
226
+
227
+ function expandStyleFor(node: unknown): 'square' | 'triangle' {
228
+ const style = props.expandStyle
229
+ if (typeof style === 'function') return style(node)
230
+ return style
231
+ }
232
+
233
+ function nodeStyle(_node: unknown): Record<string, string> {
234
+ if (props.direction === 'horizontal') {
235
+ return { marginLeft: props.depth === 0 ? '0' : `${props.indent}px` }
236
+ }
237
+ return { paddingLeft: `${props.indent * (props.depth + 1)}px` }
238
+ }
239
+
240
+ function toggle(node: unknown): void {
241
+ const key = getNodeKey(node)
242
+ if (expandedSet.value.has(key)) {
243
+ emit('node-collapse', node)
244
+ } else {
245
+ emit('node-expand', node)
246
+ }
247
+ emit('toggle', key)
248
+ }
249
+
250
+ function onChildToggle(key: string): void {
251
+ emit('toggle', key)
252
+ }
253
+ </script>
254
+
255
+ <style scoped lang="scss">
256
+ /* ===== Standard tree mode ===== */
257
+ .common-tree {
258
+ font-size: 12px;
259
+
260
+ &.common-tree--horizontal {
261
+ display: flex;
262
+ flex-direction: row;
263
+ flex-wrap: wrap;
264
+ align-items: center;
265
+ gap: 0;
266
+ }
267
+ }
268
+
269
+ .common-tree-node {
270
+ line-height: 1.5;
271
+
272
+ &.common-tree-node--horizontal {
273
+ display: inline-flex;
274
+ flex-direction: row;
275
+ align-items: center;
276
+ flex-wrap: nowrap;
277
+ }
278
+ }
279
+
280
+ .common-tree-node__content {
281
+ display: flex;
282
+ align-items: center;
283
+ gap: 6px;
284
+ min-height: 28px;
285
+ }
286
+
287
+ .common-tree-node__expand {
288
+ width: 18px;
289
+ height: 18px;
290
+ display: inline-flex;
291
+ align-items: center;
292
+ justify-content: center;
293
+ flex-shrink: 0;
294
+ color: #606266;
295
+ cursor: pointer;
296
+ line-height: 1;
297
+ &.common-tree-node__expand--square {
298
+ border: 1px solid #c0c4cc;
299
+ border-radius: 2px;
300
+ font-size: 14px;
301
+ }
302
+ &.common-tree-node__expand--triangle {
303
+ border: none;
304
+ font-size: 12px;
305
+ }
306
+ }
307
+
308
+ .common-tree-node__expand-placeholder {
309
+ width: 18px;
310
+ flex-shrink: 0;
311
+ }
312
+
313
+ .common-tree-node__label {
314
+ color: #303133;
315
+ }
316
+
317
+ .common-tree-node__children-connector {
318
+ border-left: 1px dashed #333;
319
+ margin-left: 9px;
320
+ padding-left: 10px;
321
+
322
+ &.common-tree-node__children-connector--horizontal {
323
+ border-left: none;
324
+ border-top: 1px dashed #333;
325
+ margin-left: 4px;
326
+ margin-top: 0;
327
+ padding-left: 0;
328
+ padding-top: 6px;
329
+ margin-top: 2px;
330
+ display: inline-flex;
331
+ flex-direction: row;
332
+ align-items: center;
333
+ flex-wrap: wrap;
334
+ }
335
+ }
336
+
337
+ /* ===== Aligned-leaves (top-down) tree mode ===== */
338
+ .td {
339
+ display: inline-flex;
340
+ flex-direction: row;
341
+ align-items: stretch;
342
+ font-size: 12px;
343
+ }
344
+
345
+ .td-col {
346
+ display: flex;
347
+ flex-direction: column;
348
+ align-items: center;
349
+ position: relative;
350
+ }
351
+
352
+ /* --- Horizontal connector line between sibling columns (depth > 0) --- */
353
+ .td--nested > .td-col::before {
354
+ content: '';
355
+ position: absolute;
356
+ top: 0;
357
+ left: 0;
358
+ right: 0;
359
+ border-top: 1px dashed #333;
360
+ pointer-events: none;
361
+ }
362
+ .td--nested > .td-col:first-child::before {
363
+ left: 50%;
364
+ }
365
+ .td--nested > .td-col:last-child::before {
366
+ right: 50%;
367
+ }
368
+ .td--nested > .td-col:only-child::before {
369
+ display: none;
370
+ }
371
+
372
+ /* --- Top vertical connector: from horizontal line down to expanded parent node --- */
373
+ .td-top-conn {
374
+ width: 0;
375
+ height: 14px;
376
+ border-left: 1px dashed #333;
377
+ }
378
+
379
+ /* --- Spacer: pushes leaf/collapsed nodes to the bottom with a vertical dashed line --- */
380
+ .td-spacer {
381
+ flex: 1;
382
+ display: flex;
383
+ justify-content: center;
384
+ min-height: 4px;
385
+ }
386
+ .td-vline {
387
+ width: 0;
388
+ height: 100%;
389
+ border-left: 1px dashed #333;
390
+ }
391
+ /* Hide spacer line for root-level leaves (no parent to connect to) */
392
+ .td:not(.td--nested) > .td-col--leaf .td-vline {
393
+ display: none;
394
+ }
395
+
396
+ /* --- Short vertical connector from parent node down to children area --- */
397
+ .td-down-line {
398
+ width: 0;
399
+ height: 12px;
400
+ border-left: 1px dashed #333;
401
+ }
402
+
403
+ /* --- Node content --- */
404
+ .td-node {
405
+ display: flex;
406
+ align-items: center;
407
+ gap: 4px;
408
+ padding: 2px 8px;
409
+ white-space: nowrap;
410
+ position: relative;
411
+ z-index: 1;
412
+ }
413
+
414
+ /* --- Expand / collapse button --- */
415
+ .td-expand {
416
+ width: 16px;
417
+ height: 16px;
418
+ display: inline-flex;
419
+ align-items: center;
420
+ justify-content: center;
421
+ flex-shrink: 0;
422
+ color: #606266;
423
+ cursor: pointer;
424
+ line-height: 1;
425
+ &.td-expand--square {
426
+ border: 1px solid #c0c4cc;
427
+ border-radius: 2px;
428
+ font-size: 12px;
429
+ background: #fff;
430
+ }
431
+ &.td-expand--triangle {
432
+ border: none;
433
+ font-size: 10px;
434
+ }
435
+ }
436
+
437
+ .td-expand-ph {
438
+ width: 16px;
439
+ flex-shrink: 0;
440
+ }
441
+
442
+ .td-label {
443
+ color: #303133;
444
+ }
445
+
446
+ /* --- Children container --- */
447
+ .td-kids {
448
+ flex: 1;
449
+ display: flex;
450
+ }
451
+ </style>
@@ -0,0 +1,2 @@
1
+ export { default as CommonTree } from './Tree.vue'
2
+ export type { TreeProps } from './Tree.vue'
@@ -19,7 +19,7 @@
19
19
  </template>
20
20
 
21
21
  <script setup lang="ts">
22
- import { defineProps, defineEmits, ref, onMounted, onUnmounted, watch } from 'vue'
22
+ import { ref, onMounted, onUnmounted, watch } from 'vue'
23
23
  import { eventBus } from "../../store";
24
24
  import { getIcon } from "../../utils/iconLoader";
25
25
  import type { Diagram, locationChart } from '../../types'
@@ -102,7 +102,6 @@ onUnmounted(() => {
102
102
  .tooltip-title{
103
103
  padding: 0 12px;
104
104
  }
105
- .tooltip-content {}
106
105
 
107
106
  .diagram-item {
108
107
  display: flex;