@mx-sose-front/mx-sose-graph 1.2.1 → 1.2.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.
Files changed (49) hide show
  1. package/dist/index.esm.js +1525 -1157
  2. package/dist/index.esm.js.map +1 -1
  3. package/dist/index.umd.js +1 -1
  4. package/dist/index.umd.js.map +1 -1
  5. package/dist/style.css +1 -1
  6. package/package.json +1 -1
  7. package/src/components/Gantt/Gantt.vue +2 -0
  8. package/src/components/Matrix/Matrix.vue +87 -12
  9. package/src/components/MatrixContextMenu/MatrixContextMenu.vue +235 -0
  10. package/src/components/Shape/DividingLine.vue +80 -64
  11. package/src/components/Table/Table.vue +2 -0
  12. package/src/constants/edgeShapeKeys.ts +4 -2
  13. package/src/constants/index.ts +18 -10
  14. package/src/hooks/useChartRowSelection.ts +37 -6
  15. package/src/statics/icons/childIcons/DIV-3/347/211/251/347/220/206/346/225/260/346/215/256/346/250/241/345/236/213/345/233/276@3x.png +0 -0
  16. package/src/statics/icons/childIcons/SV-3/347/263/273/347/273/237/342/200/224/347/263/273/347/273/237/347/237/251/351/230/265/345/214/205@3x.png +0 -0
  17. package/src/statics/icons/childIcons/SvcV-10c/346/234/215/345/212/241/344/272/213/344/273/266/342/200/224/350/277/275/350/270/252/346/217/217/350/277/260/345/214/205@3x.png +0 -0
  18. package/src/statics/icons/childIcons/SvcV-2 /346/234/215/345/212/241/350/265/204/346/272/220/346/265/201/345/206/205/351/203/250/346/217/217/350/277/260/345/233/276@3x.png +0 -0
  19. package/src/statics/icons/childIcons/SvcV-3a/347/263/273/347/273/237/342/200/224/346/234/215/345/212/241/347/237/251/351/230/265/345/214/205@3x.png +0 -0
  20. package/src/statics/icons/childIcons/SvcV-3b /346/234/215/345/212/241 -/346/234/215/345/212/241/347/237/251/351/230/265@3x.png +0 -0
  21. package/src/statics/icons/childIcons/SvcV-3b/346/234/215/345/212/241/342/200/224/346/234/215/345/212/241/347/237/251/351/230/265/345/214/205@3x.png +0 -0
  22. package/src/statics/icons/childIcons/SvcV-5 /346/234/215/345/212/241/345/210/260/344/270/232/345/212/241/346/264/273/345/212/250/345/217/257/350/277/275/346/272/257/346/200/247/347/237/251/351/230/265@3x.png +0 -0
  23. package/src/statics/icons/childIcons/set@3x.png +0 -0
  24. package/src/statics/icons/childIcons//344/270/232/345/212/241/345/261/202@3x.png +0 -0
  25. package/src/statics/icons/childIcons//344/270/232/345/212/241/346/211/247/350/241/214/350/200/205/344/270/216/350/203/275/345/212/233/346/230/240/345/260/204/347/237/251/351/230/265@3x.png +0 -0
  26. package/src/statics/icons/childIcons//344/270/232/345/212/241/347/273/223/346/236/204/345/233/276@3x.png +0 -0
  27. package/src/statics/icons/childIcons//344/270/232/345/212/241/347/274/223/350/247/243/346/216/252/346/226/275@3x.png +0 -0
  28. package/src/statics/icons/childIcons//344/272/272/345/221/230/345/261/202@3x.png +0 -0
  29. package/src/statics/icons/childIcons//344/272/272/345/221/230/347/272/246/346/235/237/345/256/232/344/271/211/345/233/276@3x.png +0 -0
  30. package/src/statics/icons/childIcons//345/256/211/345/205/250/345/261/202@3x.png +0 -0
  31. package/src/statics/icons/childIcons//345/256/236/351/231/205/346/210/230/347/225/245/351/230/266/346/256/265/344/270/216/350/203/275/345/212/233/346/230/240/345/260/204/347/237/251/351/230/265@3x.png +0 -0
  32. package/src/statics/icons/childIcons//345/256/236/351/231/205/350/265/204/346/272/220/345/205/263/347/263/273@3x.png +0 -0
  33. package/src/statics/icons/childIcons//345/256/236/351/231/205/350/265/204/346/272/220/345/261/202@3x.png +0 -0
  34. package/src/statics/icons/childIcons//346/210/230/347/225/245/345/261/202@3x.png +0 -0
  35. package/src/statics/icons/childIcons//346/234/215/345/212/241/345/261/202@3x.png +0 -0
  36. package/src/statics/icons/childIcons//346/234/215/345/212/241/350/277/236/351/200/232/347/237/251/351/230/265@3x.png +0 -0
  37. package/src/statics/icons/childIcons//346/234/215/345/212/241/350/277/236/351/200/232/350/241/250@3x.png +0 -0
  38. package/src/statics/icons/childIcons//346/240/207/345/207/206/345/261/202@3x.png +0 -0
  39. package/src/statics/icons/childIcons//346/240/207/345/207/206/350/267/257/347/272/277/350/241/250@3x.png +0 -0
  40. package/src/statics/icons/childIcons//346/240/207/345/207/206/350/277/275/346/272/257/350/241/250@3x.png +0 -0
  41. package/src/statics/icons/childIcons//347/212/266/346/200/201/346/214/207/346/240/207@3x.png +0 -0
  42. package/src/statics/icons/childIcons//350/265/204/346/272/220/345/261/202@3x.png +0 -0
  43. package/src/statics/icons/childIcons//351/200/202/347/224/250/350/203/275/345/212/233@3x.png +0 -0
  44. package/src/statics/icons/childIcons//351/241/271/347/233/256/345/261/202@3x.png +0 -0
  45. package/src/utils/keyboardUtils.ts +13 -0
  46. /package/src/statics/icons/childIcons/{role@3x.png → Role@3x.png} +0 -0
  47. /package/src/statics/icons/childIcons/SV-10c/347/263/273/347/273/237/344/272/213/344/273/{266- → 266/342/200/224}/350/277/275/350/270/252/346/217/217/350/277/260/345/214/205@3x.png" +0 -0
  48. /package/src/statics/icons/childIcons/{SV-3/347/263/273/347/273/237-/347/263/273/347/273/237/347/237/251/351/230/265 → SV-10c/347/263/273/347/273/237/344/272/213/344/273/266/344/270/200/350/277/275/350/270/252/346/217/217/350/277/260}/345/214/205@3x.png" +0 -0
  49. /package/src/statics/icons/childIcons//347/233/270/346/257/{224@3x (1).png" → 224@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-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-9d05820b]{--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-9d05820b]{width:100%;overflow:auto}.gantt-left.with-search-bar[data-v-9d05820b]{margin-top:36px}.table-spacer-row td[data-v-9d05820b]{height:0;padding:0;border:none!important}.table-spacer[data-v-9d05820b]{width:1px}.gantt-table[data-v-9d05820b]{border-collapse:separate;border-spacing:0;table-layout:fixed}.th-content[data-v-9d05820b]{position:relative;display:flex;align-items:center;width:100%;height:100%;min-width:0;box-sizing:border-box}.th-content[data-v-9d05820b]>:nth-child(1){margin-left:4px}.gantt-table th[data-v-9d05820b],.gantt-table td[data-v-9d05820b]{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-9d05820b]:first-child,.gantt-table td[data-v-9d05820b]:first-child{border-left:1px solid #ebeef5;width:50px;min-width:50px;max-width:50px}.header-row-2 th[data-v-9d05820b]{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-9d05820b]{height:var(--data-row-h)}.col-name[data-v-9d05820b]{text-align:left}.col-td[data-v-9d05820b]{text-align:center}.col-index[data-v-9d05820b]{width:60px!important}.th-label[data-v-9d05820b]{font-weight:600}.cell-text[data-v-9d05820b]{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.expand-icon[data-v-9d05820b]{display:inline-block;margin-right:4px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.item-name[data-v-9d05820b]{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-9d05820b]{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-9d05820b]{text-align:center}.cell-input[data-v-9d05820b]{width:100%}.cell-input[data-v-9d05820b] .el-input__wrapper{padding:0 6px;height:24px;box-shadow:0 0 0 1px #409eff inset;border-radius:3px}.cell-select[data-v-9d05820b]{width:100%}.cell-select[data-v-9d05820b] .el-input__wrapper{min-height:24px;height:24px;padding:0 6px;border-radius:3px}.cell-boolean-display[data-v-9d05820b]{overflow:visible}.cell-boolean-group[data-v-9d05820b]{display:inline-flex;align-items:center;height:24px}.cell-boolean-group[data-v-9d05820b] .el-radio{align-items:center;margin-right:10px;margin-bottom:0}.cell-boolean-group[data-v-9d05820b] .el-radio:last-child{margin-right:0}.cell-boolean-group[data-v-9d05820b] .el-radio__label{padding-left:4px}.cell-date[data-v-9d05820b]{width:100%}.cell-date[data-v-9d05820b] .el-input__wrapper{min-height:24px;height:24px;padding:0 6px;border-radius:3px}.cell-textarea[data-v-9d05820b]{width:100%}.cell-textarea[data-v-9d05820b] .el-textarea__inner{font-size:12px;line-height:18px;padding:4px 6px}.col-resizer[data-v-9d05820b]{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-9d05820b]:hover{background-color:#409eff1a}.row-selected[data-v-9d05820b]{background-color:#ecf5ff!important}.gantt-row.row-selected td[data-v-9d05820b]{background-color:#ecf5ff}.matrix[data-v-b00223b7]{width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden;background:#fff}.matrix-header[data-v-b00223b7]{padding:8px 12px;border-bottom:1px solid #e8e8e8;display:flex;align-items:center;gap:8px}.matrix-header .matrix-header-left[data-v-b00223b7]{display:flex;align-items:center;gap:6px}.matrix-header .matrix-header-title[data-v-b00223b7]{font-weight:600;font-size:14px}.matrix-header .matrix-header-icon[data-v-b00223b7]{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-b00223b7]{margin-right:2px}.matrix-header .matrix-header-icon .icon-arrow[data-v-b00223b7]{font-size:10px;opacity:.8}.matrix-toolbar[data-v-b00223b7]{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-bottom:1px solid #e8e8e8;flex-shrink:0}.matrix-criteria[data-v-b00223b7]{display:flex;align-items:center;gap:8px}.matrix-criteria .criteria-label[data-v-b00223b7]{font-size:12px;color:#666}.matrix-criteria .criteria-select[data-v-b00223b7]{width:120px}.matrix-criteria .find-input[data-v-b00223b7]{width:160px}.matrix-criteria .criteria-checkbox[data-v-b00223b7]{font-size:12px;color:#606266}.matrix-table-wrap[data-v-b00223b7]{flex:1;overflow:auto;padding:12px}.matrix-table[data-v-b00223b7]{border-collapse:collapse;min-width:100%;font-size:12px}.matrix-table th[data-v-b00223b7],.matrix-table td[data-v-b00223b7]{border:none;padding:6px 8px;vertical-align:middle}.matrix-table .matrix-corner[data-v-b00223b7]{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-b00223b7]{display:inline-flex;align-items:center;gap:6px;padding:4px 0}.matrix-table .matrix-corner .matrix-corner__icon-img[data-v-b00223b7]{width:16px;height:16px;display:block;flex-shrink:0}.matrix-table .matrix-corner .matrix-corner__icon[data-v-b00223b7]{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-b00223b7]{font-size:12px;color:#303133;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.matrix-table .matrix-col-header[data-v-b00223b7]{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-b00223b7]{display:inline-flex;align-items:center;gap:6px;min-height:28px}.matrix-table .matrix-col-header.matrix-col-header--parent[data-v-b00223b7]{border-bottom:1px dashed #999}.matrix-table .matrix-col-header.matrix-col-header--parent .col-expand--square[data-v-b00223b7]{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-b00223b7]{flex-shrink:0;font-size:14px}.matrix-table .matrix-col-header .col-node-icon--img[data-v-b00223b7]{width:16px;height:16px;display:block;flex-shrink:0}.matrix-table .matrix-col-header .col-node-icon--circle[data-v-b00223b7]{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-b00223b7]{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-b00223b7]{justify-content:center;margin:0 auto}.matrix-table .matrix-col-header.matrix-col-header--leaf[data-v-b00223b7]: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-b00223b7]{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-b00223b7]:before{content:"";position:absolute;left:50%;top:0;height:calc(100% - 30px);width:0;border-left:1px dashed #333}.matrix-table .matrix-col-header.matrix-col-header--root-vline[data-v-b00223b7]{padding:0;border-bottom:1px solid #d0d0d0;position:relative}.matrix-table .matrix-col-header.matrix-col-header--root-vline[data-v-b00223b7]:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:0;border-left:1px dashed #333}.matrix-table .matrix-col-header .col-node-label[data-v-b00223b7]{color:#303133}.matrix-table .matrix-row-header[data-v-b00223b7]{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-b00223b7],.matrix-table tr.matrix-row--selected .matrix-cell[data-v-b00223b7],.matrix-table .matrix-col-header.matrix-col-header--selected[data-v-b00223b7]{background:#e6f7ff}.matrix-table .matrix-cell.matrix-cell--selected[data-v-b00223b7]{background:#bae7ff}.matrix-table .matrix-row-header .row-tree-cell[data-v-b00223b7]{position:relative;display:flex;align-items:center;min-height:28px;font-size:12px;gap:6px}.matrix-table .row-conn-vline[data-v-b00223b7]{position:absolute;top:0;bottom:0;width:0;border-left:1px dashed #999;pointer-events:none}.matrix-table .row-conn-branch[data-v-b00223b7]{position:absolute;top:0;bottom:0;pointer-events:none}.matrix-table .row-conn-branch[data-v-b00223b7]:before{content:"";position:absolute;left:0;top:0;bottom:0;border-left:1px dashed #999}.matrix-table .row-conn-branch[data-v-b00223b7]: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-b00223b7]:before{bottom:50%}.matrix-table .row-expand[data-v-b00223b7]{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-b00223b7]{border:1px solid #c0c4cc;border-radius:2px;font-size:12px;color:#606266;background:#fff}.matrix-table .row-expand-placeholder[data-v-b00223b7]{width:16px;flex-shrink:0}.matrix-table .row-node-icon--folder[data-v-b00223b7]{flex-shrink:0;font-size:14px}.matrix-table .row-node-icon--img[data-v-b00223b7]{width:16px;height:16px;display:block;flex-shrink:0}.matrix-table .row-node-icon--circle[data-v-b00223b7]{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-b00223b7]{color:#303133}.matrix-table .matrix-cell[data-v-b00223b7]{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-b00223b7]{background:#e6f7ff}.matrix-table .matrix-cell.matrix-cell--disabled[data-v-b00223b7]{background:#f5f5f5;color:#c0c4cc;cursor:not-allowed}.matrix-table .matrix-cell .cell-dependency[data-v-b00223b7]{color:#1890ff;font-weight:700;font-size:14px}.matrix-table .matrix-cell .cell-dependency.cell-arrow--up[data-v-b00223b7],.matrix-table .matrix-cell .cell-dependency.cell-arrow--down[data-v-b00223b7]{font-size:16px;font-weight:700}.matrix-table .matrix-cell .cell-value[data-v-b00223b7]{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}
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-49b887dd]{display:inline-block;position:relative;overflow:visible;box-sizing:content-box}[data-v-49b887dd] .name-text-svg{text-align:left}[data-v-49b887dd] .shape-name-svg{text-align:center}[data-v-49b887dd] .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-49b887dd] .content-item{margin-bottom:4px;word-break:break-word;white-space:normal;overflow:visible;width:100%;box-sizing:border-box}[data-v-49b887dd] .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-365c49d0]{--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-365c49d0]{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-365c49d0]{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-365c49d0]:focus{border-color:#409eff}.search-result-info[data-v-365c49d0]{font-size:12px;color:#606266;white-space:nowrap;min-width:60px;text-align:center}.search-nav-btn[data-v-365c49d0]{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-365c49d0]:hover:not(:disabled){border-color:#409eff;color:#409eff}.search-nav-btn[data-v-365c49d0]:disabled{cursor:not-allowed;opacity:.4}.search-close-btn[data-v-365c49d0]{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-365c49d0]:hover{border-color:#f56c6c;color:#f56c6c}.gantt-left[data-v-365c49d0]{width:var(--8a4ac306);min-width:180px;flex-shrink:0;border-right:1px solid #dcdfe6;overflow-x:auto;overflow-y:auto;margin-top:var(--5ba84210)}.gantt-left[data-v-365c49d0]::-webkit-scrollbar{width:0;height:8px}.gantt-left[data-v-365c49d0]::-webkit-scrollbar-track{background:#f1f1f1}.gantt-left[data-v-365c49d0]::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:4px}.gantt-left[data-v-365c49d0]::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.gantt-table[data-v-365c49d0]{width:-moz-max-content;width:max-content;min-width:100%;border-collapse:separate;border-spacing:0}.gantt-table th[data-v-365c49d0],.gantt-table td[data-v-365c49d0]{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-365c49d0]:first-child,.gantt-table td[data-v-365c49d0]:first-child{border-left:1px solid #ebeef5}.header-row-1 th[data-v-365c49d0]{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-365c49d0]{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-365c49d0]{position:relative;width:100%;height:100%;display:flex;align-items:center;padding:0 8px}.th-label[data-v-365c49d0]{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.col-resizer[data-v-365c49d0]{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-365c49d0]:hover{background-color:#409eff1a}.gantt-table td[data-v-365c49d0]{height:var(--data-row-h)}.gantt-spacer-row td[data-v-365c49d0]{height:0;padding:0;border:none!important}.gantt-spacer[data-v-365c49d0]{width:1px}.gantt-row[data-v-365c49d0]:has(.col-date>div){position:relative;z-index:10}.col-name[data-v-365c49d0]{max-width:none}.col-date[data-v-365c49d0]{width:auto;font-size:11px;color:#909399;text-align:center;position:relative;cursor:default}.col-date[data-v-365c49d0]:has(div){overflow:visible!important}.col-date>div[data-v-365c49d0]{position:relative;z-index:100}.col-date[data-v-365c49d0] .el-date-editor{width:100%!important}.col-date[data-v-365c49d0] .el-input__wrapper{padding:0 4px;height:26px;font-size:11px}.col-date[data-v-365c49d0] .el-picker__popper{z-index:1000!important}.expand-icon[data-v-365c49d0]{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.item-name[data-v-365c49d0]{overflow:hidden;text-overflow:ellipsis}.cell-input[data-v-365c49d0]{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-365c49d0]:focus{border-color:#409eff;box-shadow:0 0 0 2px #409eff33}.gantt-divider[data-v-365c49d0]{width:4px;cursor:col-resize;background:#dcdfe6;flex-shrink:0}.gantt-divider[data-v-365c49d0]:hover{background:#409eff}.gantt-timeline[data-v-365c49d0]{flex:1;overflow:auto;position:relative;margin-top:var(--5ba84210)}.gantt-left[data-v-365c49d0],.gantt-timeline[data-v-365c49d0]{padding-bottom:var(--gantt-bottom-compensation, 0px)}.gantt-timeline[data-v-365c49d0]::-webkit-scrollbar{width:8px;height:8px}.gantt-timeline[data-v-365c49d0]::-webkit-scrollbar-track{background:#f1f1f1}.gantt-timeline[data-v-365c49d0]::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:4px}.gantt-timeline[data-v-365c49d0]::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.timeline-header[data-v-365c49d0]{position:sticky;top:0;z-index:2;background:#f5f7fa}.year-row[data-v-365c49d0]{display:flex;height:var(--header-row-h);border-bottom:1px solid #dcdfe6;box-sizing:border-box}.year-cell[data-v-365c49d0]{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-365c49d0]{display:flex;height:var(--header-row-h);border-bottom:1px solid #dcdfe6;box-sizing:border-box}.month-cell[data-v-365c49d0]{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-365c49d0]{position:relative}.timeline-spacer[data-v-365c49d0]{width:100%;pointer-events:none}.grid-lines[data-v-365c49d0]{position:absolute;inset:0;pointer-events:none}.grid-line[data-v-365c49d0]{position:absolute;top:0;bottom:0;width:1px;border-left:1px dashed #e4e7ed}.bar-row[data-v-365c49d0]{height:var(--data-row-h);position:relative;border-bottom:1px solid #ebeef5;box-sizing:border-box}.gantt-bar[data-v-365c49d0]{position:absolute;top:6px;height:20px;border-radius:3px;background:#409eff;opacity:.85}.row-selected[data-v-365c49d0]{background-color:#ecf5ff!important}.gantt-row.row-selected td[data-v-365c49d0]{background-color:#ecf5ff}.gantt-milestone[data-v-365c49d0]{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-1186ebb0]{--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-1186ebb0]{width:100%;overflow:auto}.gantt-left.with-search-bar[data-v-1186ebb0]{margin-top:36px}.table-spacer-row td[data-v-1186ebb0]{height:0;padding:0;border:none!important}.table-spacer[data-v-1186ebb0]{width:1px}.gantt-table[data-v-1186ebb0]{border-collapse:separate;border-spacing:0;table-layout:fixed}.th-content[data-v-1186ebb0]{position:relative;display:flex;align-items:center;width:100%;height:100%;min-width:0;box-sizing:border-box}.th-content[data-v-1186ebb0]>:nth-child(1){margin-left:4px}.gantt-table th[data-v-1186ebb0],.gantt-table td[data-v-1186ebb0]{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-1186ebb0]:first-child,.gantt-table td[data-v-1186ebb0]:first-child{border-left:1px solid #ebeef5;width:50px;min-width:50px;max-width:50px}.header-row-2 th[data-v-1186ebb0]{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-1186ebb0]{height:var(--data-row-h)}.col-name[data-v-1186ebb0]{text-align:left}.col-td[data-v-1186ebb0]{text-align:center}.col-index[data-v-1186ebb0]{width:60px!important}.th-label[data-v-1186ebb0]{font-weight:600}.cell-text[data-v-1186ebb0]{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.expand-icon[data-v-1186ebb0]{display:inline-block;margin-right:4px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.item-name[data-v-1186ebb0]{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-1186ebb0]{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-1186ebb0]{text-align:center}.cell-input[data-v-1186ebb0]{width:100%}.cell-input[data-v-1186ebb0] .el-input__wrapper{padding:0 6px;height:24px;box-shadow:0 0 0 1px #409eff inset;border-radius:3px}.cell-select[data-v-1186ebb0]{width:100%}.cell-select[data-v-1186ebb0] .el-input__wrapper{min-height:24px;height:24px;padding:0 6px;border-radius:3px}.cell-boolean-display[data-v-1186ebb0]{overflow:visible}.cell-boolean-group[data-v-1186ebb0]{display:inline-flex;align-items:center;height:24px}.cell-boolean-group[data-v-1186ebb0] .el-radio{align-items:center;margin-right:10px;margin-bottom:0}.cell-boolean-group[data-v-1186ebb0] .el-radio:last-child{margin-right:0}.cell-boolean-group[data-v-1186ebb0] .el-radio__label{padding-left:4px}.cell-date[data-v-1186ebb0]{width:100%}.cell-date[data-v-1186ebb0] .el-input__wrapper{min-height:24px;height:24px;padding:0 6px;border-radius:3px}.cell-textarea[data-v-1186ebb0]{width:100%}.cell-textarea[data-v-1186ebb0] .el-textarea__inner{font-size:12px;line-height:18px;padding:4px 6px}.col-resizer[data-v-1186ebb0]{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-1186ebb0]:hover{background-color:#409eff1a}.row-selected[data-v-1186ebb0]{background-color:#ecf5ff!important}.gantt-row.row-selected td[data-v-1186ebb0]{background-color:#ecf5ff}.matrix-context-menu[data-v-e51e812e]{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}.matrix-context-menu[style*="display: block"][data-v-e51e812e]{animation:fadeIn-e51e812e .2s ease forwards}@keyframes fadeIn-e51e812e{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.matrix-context-menu[data-v-e51e812e]::-webkit-scrollbar{width:6px}.matrix-context-menu[data-v-e51e812e]::-webkit-scrollbar-thumb{background-color:#ddd;border-radius:3px}.matrix-context-menu[data-v-e51e812e]::-webkit-scrollbar-track{background-color:#f5f5f5}.menu-item[data-v-e51e812e]{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-e51e812e]:hover{background-color:#f5f7fa;color:#303133}.matrix[data-v-3961ece7]{width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden;background:#fff}.matrix-header[data-v-3961ece7]{padding:8px 12px;border-bottom:1px solid #e8e8e8;display:flex;align-items:center;gap:8px}.matrix-header .matrix-header-left[data-v-3961ece7]{display:flex;align-items:center;gap:6px}.matrix-header .matrix-header-title[data-v-3961ece7]{font-weight:600;font-size:14px}.matrix-header .matrix-header-icon[data-v-3961ece7]{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-3961ece7]{margin-right:2px}.matrix-header .matrix-header-icon .icon-arrow[data-v-3961ece7]{font-size:10px;opacity:.8}.matrix-toolbar[data-v-3961ece7]{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-bottom:1px solid #e8e8e8;flex-shrink:0}.matrix-criteria[data-v-3961ece7]{display:flex;align-items:center;gap:8px}.matrix-criteria .criteria-label[data-v-3961ece7]{font-size:12px;color:#666}.matrix-criteria .criteria-select[data-v-3961ece7]{width:120px}.matrix-criteria .find-input[data-v-3961ece7]{width:160px}.matrix-criteria .criteria-checkbox[data-v-3961ece7]{font-size:12px;color:#606266}.matrix-table-wrap[data-v-3961ece7]{flex:1;overflow:auto;padding:12px}.matrix-table[data-v-3961ece7]{border-collapse:collapse;min-width:100%;font-size:12px}.matrix-table th[data-v-3961ece7],.matrix-table td[data-v-3961ece7]{border:none;padding:6px 8px;vertical-align:middle}.matrix-table .matrix-corner[data-v-3961ece7]{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-3961ece7]{display:inline-flex;align-items:center;gap:6px;padding:4px 0}.matrix-table .matrix-corner .matrix-corner__icon-img[data-v-3961ece7]{width:16px;height:16px;display:block;flex-shrink:0}.matrix-table .matrix-corner .matrix-corner__icon[data-v-3961ece7]{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-3961ece7]{font-size:12px;color:#303133;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.matrix-table .matrix-col-header[data-v-3961ece7]{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-3961ece7]{display:inline-flex;align-items:center;gap:6px;min-height:28px}.matrix-table .matrix-col-header.matrix-col-header--parent[data-v-3961ece7]{border-bottom:1px dashed #999}.matrix-table .matrix-col-header.matrix-col-header--parent .col-expand--square[data-v-3961ece7]{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-3961ece7]{flex-shrink:0;font-size:14px}.matrix-table .matrix-col-header .col-node-icon--img[data-v-3961ece7]{width:16px;height:16px;display:block;flex-shrink:0}.matrix-table .matrix-col-header .col-node-icon--circle[data-v-3961ece7]{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-3961ece7]{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-3961ece7]{justify-content:center;margin:0 auto}.matrix-table .matrix-col-header.matrix-col-header--leaf[data-v-3961ece7]: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-3961ece7]{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-3961ece7]:before{content:"";position:absolute;left:50%;top:0;height:calc(100% - 30px);width:0;border-left:1px dashed #333}.matrix-table .matrix-col-header.matrix-col-header--root-vline[data-v-3961ece7]{padding:0;border-bottom:1px solid #d0d0d0;position:relative}.matrix-table .matrix-col-header.matrix-col-header--root-vline[data-v-3961ece7]:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:0;border-left:1px dashed #333}.matrix-table .matrix-col-header .col-node-label[data-v-3961ece7]{color:#303133}.matrix-table .matrix-row-header[data-v-3961ece7]{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-3961ece7],.matrix-table tr.matrix-row--selected .matrix-cell[data-v-3961ece7],.matrix-table .matrix-col-header.matrix-col-header--selected[data-v-3961ece7]{background:#e6f7ff}.matrix-table .matrix-cell.matrix-cell--selected[data-v-3961ece7]{background:#bae7ff}.matrix-table .matrix-row-header .row-tree-cell[data-v-3961ece7]{position:relative;display:flex;align-items:center;min-height:28px;font-size:12px;gap:6px}.matrix-table .row-conn-vline[data-v-3961ece7]{position:absolute;top:0;bottom:0;width:0;border-left:1px dashed #999;pointer-events:none}.matrix-table .row-conn-branch[data-v-3961ece7]{position:absolute;top:0;bottom:0;pointer-events:none}.matrix-table .row-conn-branch[data-v-3961ece7]:before{content:"";position:absolute;left:0;top:0;bottom:0;border-left:1px dashed #999}.matrix-table .row-conn-branch[data-v-3961ece7]: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-3961ece7]:before{bottom:50%}.matrix-table .row-expand[data-v-3961ece7]{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-3961ece7]{border:1px solid #c0c4cc;border-radius:2px;font-size:12px;color:#606266;background:#fff}.matrix-table .row-expand-placeholder[data-v-3961ece7]{width:16px;flex-shrink:0}.matrix-table .row-node-icon--folder[data-v-3961ece7]{flex-shrink:0;font-size:14px}.matrix-table .row-node-icon--img[data-v-3961ece7]{width:16px;height:16px;display:block;flex-shrink:0}.matrix-table .row-node-icon--circle[data-v-3961ece7]{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-3961ece7]{color:#303133}.matrix-table .matrix-cell[data-v-3961ece7]{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-3961ece7]{background:#e6f7ff}.matrix-table .matrix-cell.matrix-cell--disabled[data-v-3961ece7]{background:#f5f5f5;color:#c0c4cc;cursor:not-allowed}.matrix-table .matrix-cell .cell-dependency[data-v-3961ece7]{color:#1890ff;font-weight:700;font-size:14px}.matrix-table .matrix-cell .cell-dependency.cell-arrow--up[data-v-3961ece7],.matrix-table .matrix-cell .cell-dependency.cell-arrow--down[data-v-3961ece7]{font-size:16px;font-weight:700}.matrix-table .matrix-cell .cell-value[data-v-3961ece7]{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.2.1",
3
+ "version": "1.2.2",
4
4
  "description": "A Vue3 graph visualization plugin library",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.esm.js",
@@ -471,6 +471,8 @@ function onGanttToolbarAction(action: string) {
471
471
  function handleCanvasDataChange(data: any[]) {
472
472
  if (data && data.length > 0) {
473
473
  ganttItems.value = data.map(d => ({ ...d, hasChildren: false }))
474
+ }else{
475
+ ganttItems.value = [];
474
476
  }
475
477
  }
476
478
 
@@ -39,6 +39,7 @@
39
39
  'matrix-col-header--selected': selectedColumnId === cell.node.id,
40
40
  }"
41
41
  @click="onColumnHeaderClick(cell.node)"
42
+ @contextmenu.prevent="onColumnHeaderContextMenu($event, cell.node)"
42
43
  >
43
44
  <div v-if="!isRootSpanningCell(cell)" class="matrix-col-header__inner">
44
45
  <!-- 有子节点:绿色文件夹 + 方框 −/+,可点击折叠 -->
@@ -79,6 +80,7 @@
79
80
  class="matrix-row-header"
80
81
  :class="{ 'matrix-row-header--selected': selectedRowId === item.node.id }"
81
82
  @click="onRowHeaderClick(item.node)"
83
+ @contextmenu.prevent="onRowHeaderContextMenu($event, item.node)"
82
84
  >
83
85
  <div
84
86
  class="row-tree-cell"
@@ -138,14 +140,24 @@
138
140
  @dblclick="onCellDblClick(item.node, col, getCell(item.node.id, col.id))"
139
141
  >
140
142
  <template v-if="isLeafRow(item.node) && getCell(item.node.id, col.id)">
141
- <span v-if="hasDependencyRelation(getCell(item.node.id, col.id)!) && showDependency" class="cell-dependency" :class="{ 'cell-arrow--up': getCellArrowType(getCell(item.node.id, col.id)!) === 'ARROW_UP', 'cell-arrow--down': getCellArrowType(getCell(item.node.id, col.id)!) === 'ARROW_DOWN' }">{{ getCellDependencySymbol(getCell(item.node.id, col.id)!) }}</span>
142
- <span v-else-if="!hasDependencyRelation(getCell(item.node.id, col.id)!) && getCell(item.node.id, col.id)?.value" class="cell-value">{{ getCell(item.node.id, col.id)?.value }}</span>
143
+ <span v-if="hasCellRelations(getCell(item.node.id, col.id)!) && showDependency" class="cell-dependency" :class="{ 'cell-arrow--up': getCellArrowType(getCell(item.node.id, col.id)!) === 'ARROW_UP', 'cell-arrow--down': getCellArrowType(getCell(item.node.id, col.id)!) === 'ARROW_DOWN' }">{{ getCellDependencySymbol(getCell(item.node.id, col.id)!) }}</span>
144
+ <span v-else-if="!hasCellRelations(getCell(item.node.id, col.id)!) && getCell(item.node.id, col.id)?.value" class="cell-value">{{ getCell(item.node.id, col.id)?.value }}</span>
143
145
  </template>
144
146
  </td>
145
147
  </tr>
146
148
  </tbody>
147
149
  </table>
148
150
  </div>
151
+ <!-- 矩阵右键菜单 -->
152
+ <MatrixContextMenu
153
+ :visible="contextMenuVisible"
154
+ :position="contextMenuPosition"
155
+ @update:visible="contextMenuVisible = $event"
156
+ @property-config="handleContextMenuPropertyConfig"
157
+ @tree-highlight="handleContextMenuTreeHighlight"
158
+ @delete="handleContextMenuDelete"
159
+ @remove="handleContextMenuRemove"
160
+ />
149
161
  </div>
150
162
  </template>
151
163
 
@@ -163,6 +175,7 @@ import type { ColHeaderCell } from './index'
163
175
  import { eventBus } from '../../store/eventBus'
164
176
  import { useGraphStore } from '../../store/graphStore'
165
177
  import { getIcon } from '../../utils/iconLoader'
178
+ import MatrixContextMenu from '../MatrixContextMenu/MatrixContextMenu.vue'
166
179
 
167
180
  /** 当前选中的行 id、列 id(点击行头/列头/单元格时更新并通过 eventBus 发出) */
168
181
  const selectedRowId = ref<string | null>(null)
@@ -190,10 +203,28 @@ function applyDataAndExpand(payload: Matrix): void {
190
203
 
191
204
  /** 主项目通过 eventBus "matrix-data-change" 下发数据,payload 为 Matrix 类型 */
192
205
  function onMatrixDataChange(payload: Matrix): void {
193
- if (payload && Array.isArray(payload.rowTree) && Array.isArray(payload.columnTree) && Array.isArray(payload.crossData)) {
194
- graphStore.setMatrixData(payload)
195
- applyDataAndExpand(payload)
206
+ if (!payload) return
207
+ const rowTree = Array.isArray(payload.rowTree) ? payload.rowTree : []
208
+ const columnTree = Array.isArray(payload.columnTree) ? payload.columnTree : []
209
+ const crossData = Array.isArray(payload.crossData) ? payload.crossData : []
210
+
211
+ if (rowTree.length === 0 && columnTree.length === 0 && crossData.length === 0) {
212
+ graphStore.setMatrixData(emptyMatrix)
213
+ applyDataAndExpand({ ...emptyMatrix })
214
+ return
196
215
  }
216
+
217
+ const hasRows = rowTree.length > 0
218
+ const hasCols = columnTree.length > 0
219
+ const normalized: Matrix = {
220
+ rowTree: hasRows ? rowTree : [],
221
+ columnTree: hasCols ? columnTree : [],
222
+ crossData: hasRows && hasCols ? crossData : [],
223
+ relationModelIcon: payload.relationModelIcon ?? '',
224
+ relationModelName: payload.relationModelName ?? '',
225
+ }
226
+ graphStore.setMatrixData(normalized)
227
+ applyDataAndExpand(normalized)
197
228
  }
198
229
 
199
230
  const handleMatrixDataChange = (payload: Matrix) => onMatrixDataChange(payload)
@@ -293,8 +324,8 @@ function getCell(rowId: string, colId: string): ColumnHeaderCell | undefined {
293
324
  return cellMap.value[rowId]?.[colId]
294
325
  }
295
326
 
296
- function hasDependencyRelation(cell: ColumnHeaderCell): boolean {
297
- return cell.relations?.some((r) => r.type === 'Dependency' || r.relationType === 'Dependency') ?? false
327
+ function hasCellRelations(cell: ColumnHeaderCell): boolean {
328
+ return (cell.relations?.length ?? 0) > 0
298
329
  }
299
330
 
300
331
  /** 取单元格依赖关系的箭头类型:ARROW_UP → 斜向上 ↗,ARROW_DOWN → 斜向下 ↘ */
@@ -315,7 +346,7 @@ function getCellDependencySymbol(cell: ColumnHeaderCell): string {
315
346
  function shouldShowCell(rowId: string, colId: string): boolean {
316
347
  const cell = getCell(rowId, colId)
317
348
  if (!cell) return false
318
- if (hasDependencyRelation(cell)) return showDependency.value
349
+ if (hasCellRelations(cell)) return showDependency.value
319
350
  return !!cell.value
320
351
  }
321
352
 
@@ -376,6 +407,7 @@ function onCellClick(rowNode: TreeNode, colNode: TreeNode): void {
376
407
 
377
408
  function onCellDblClick(rowNode: TreeNode, colNode: TreeNode, cell: ColumnHeaderCell | undefined): void {
378
409
  if (!cell || cell.operable === false) return
410
+ if (!relationModelName.value.trim()) return
379
411
  const hasRelations = cell.relations && cell.relations.length > 0
380
412
  eventBus.emit('cell-db-click', {
381
413
  columnNodeId: getColumnId(cell),
@@ -385,11 +417,54 @@ function onCellDblClick(rowNode: TreeNode, colNode: TreeNode, cell: ColumnHeader
385
417
  })
386
418
  }
387
419
 
388
- /** 供主项目通过 ref 调用:直接设置矩阵数据 */
420
+ /** ========== 右键菜单 ========== */
421
+ const contextMenuVisible = ref(false)
422
+ const contextMenuPosition = ref({ x: 0, y: 0 })
423
+ const contextMenuTarget = ref<{ type: 'row' | 'column'; node: TreeNode } | null>(null)
424
+
425
+ function onRowHeaderContextMenu(event: MouseEvent, node: TreeNode): void {
426
+ selectedRowId.value = node.id
427
+ selectedColumnId.value = null
428
+ contextMenuTarget.value = { type: 'row', node }
429
+ contextMenuPosition.value = { x: event.clientX, y: event.clientY }
430
+ contextMenuVisible.value = true
431
+ }
432
+
433
+ function onColumnHeaderContextMenu(event: MouseEvent, node: TreeNode): void {
434
+ selectedRowId.value = null
435
+ selectedColumnId.value = node.id
436
+ contextMenuTarget.value = { type: 'column', node }
437
+ contextMenuPosition.value = { x: event.clientX, y: event.clientY }
438
+ contextMenuVisible.value = true
439
+ }
440
+
441
+ function handleContextMenuPropertyConfig(): void {
442
+ if (!contextMenuTarget.value) return
443
+ const { type, node } = contextMenuTarget.value
444
+ eventBus.emit('matrix-property-config', { type, nodeId: node.id, node })
445
+ }
446
+
447
+ function handleContextMenuTreeHighlight(): void {
448
+ if (!contextMenuTarget.value) return
449
+ const { type, node } = contextMenuTarget.value
450
+ eventBus.emit('matrix-tree-highlight', { type, nodeId: node.id, node })
451
+ }
452
+
453
+ function handleContextMenuDelete(): void {
454
+ if (!contextMenuTarget.value) return
455
+ const { type, node } = contextMenuTarget.value
456
+ eventBus.emit('matrix-delete', { type, nodeId: node.id, node })
457
+ }
458
+
459
+ function handleContextMenuRemove(): void {
460
+ if (!contextMenuTarget.value) return
461
+ const { type, node } = contextMenuTarget.value
462
+ eventBus.emit('matrix-remove', { type, nodeId: node.id, node })
463
+ }
464
+
465
+ /** 供主项目通过 ref 调用:直接设置矩阵数据(与 matrix-data-change 语义一致) */
389
466
  function setMatrixData(data: Matrix): void {
390
- if (data?.rowTree && data?.columnTree && data?.crossData) {
391
- applyDataAndExpand(data)
392
- }
467
+ onMatrixDataChange(data)
393
468
  }
394
469
 
395
470
  defineExpose({ setMatrixData })
@@ -0,0 +1,235 @@
1
+ <template>
2
+ <teleport to="body">
3
+ <div
4
+ v-if="visible"
5
+ class="matrix-context-menu px-[6px]"
6
+ :style="dynamicMenuStyle"
7
+ @contextmenu.prevent
8
+ @click.stop
9
+ ref="menuRef"
10
+ >
11
+ <!-- 属性配置 -->
12
+ <div class="menu-item" @click="handlePropertyConfig">
13
+ <div class="flex items-center box-border border-b-[1px] border-solid border-[#DCDFE6]">
14
+ <img :src="getIcon('createMenu', 'config')" class="w-[18px] h-[18px] mr-[10px] ml-[2px]" alt="属性配置" />
15
+ <span>属性配置</span>
16
+ </div>
17
+ </div>
18
+
19
+ <!-- 树上高亮 -->
20
+ <div class="menu-item" @click="handleTreeHighlight">
21
+ <div class="flex items-center box-border border-b-[1px] border-solid border-[#DCDFE6]">
22
+ <img :src="getIcon('createMenu', 'tree')" class="w-[18px] h-[18px] mr-[10px] ml-[2px]" alt="树上高亮" />
23
+ <span>树上高亮</span>
24
+ </div>
25
+ </div>
26
+
27
+ <!-- 删除 -->
28
+ <div class="menu-item" @click="handleDelete">
29
+ <div class="flex items-center box-border border-b-[1px] border-solid border-[#DCDFE6]">
30
+ <img :src="getIcon('createMenu', 'delete')" class="w-[18px] h-[18px] mr-[10px] ml-[2px]" alt="删除" />
31
+ <span>删除</span>
32
+ </div>
33
+ </div>
34
+
35
+ <!-- 移除 -->
36
+ <div class="menu-item" @click="handleRemove">
37
+ <div class="flex items-center">
38
+ <img :src="getIcon('createMenu', 'remove')" class="w-[18px] h-[18px] mr-[10px] ml-[2px]" alt="移除" />
39
+ <span>移除</span>
40
+ </div>
41
+ </div>
42
+ </div>
43
+ </teleport>
44
+ </template>
45
+
46
+ <script setup lang="ts">
47
+ import { ref, watch, onMounted, onUnmounted, type CSSProperties } from 'vue'
48
+ import { getIcon } from '../../utils/iconLoader'
49
+
50
+ interface Props {
51
+ visible: boolean
52
+ position: {
53
+ x: number
54
+ y: number
55
+ }
56
+ }
57
+
58
+ const props = defineProps<Props>()
59
+
60
+ const emit = defineEmits<{
61
+ (e: 'update:visible', value: boolean): void
62
+ (e: 'property-config'): void
63
+ (e: 'tree-highlight'): void
64
+ (e: 'delete'): void
65
+ (e: 'remove'): void
66
+ }>()
67
+
68
+ const menuRef = ref<HTMLElement | null>(null)
69
+
70
+ const MENU_WIDTH = 180
71
+ const MENU_HEIGHT = 160
72
+ const SAFE_MARGIN = 10
73
+
74
+ const dynamicMenuStyle = ref<CSSProperties>({
75
+ left: '0px',
76
+ top: '0px',
77
+ display: 'none',
78
+ position: 'fixed',
79
+ zIndex: '9999',
80
+ minWidth: `${MENU_WIDTH}px`,
81
+ })
82
+
83
+ const updateMenuPosition = () => {
84
+ if (!props.visible) {
85
+ dynamicMenuStyle.value = { ...dynamicMenuStyle.value, display: 'none' }
86
+ return
87
+ }
88
+
89
+ const viewportWidth = window.innerWidth
90
+ const viewportHeight = window.innerHeight
91
+
92
+ let left = props.position.x
93
+ let top = props.position.y
94
+
95
+ if (left + MENU_WIDTH > viewportWidth) {
96
+ left = viewportWidth - MENU_WIDTH - SAFE_MARGIN
97
+ }
98
+ left = Math.max(SAFE_MARGIN, left)
99
+
100
+ if (top + MENU_HEIGHT > viewportHeight) {
101
+ top = viewportHeight - MENU_HEIGHT - SAFE_MARGIN
102
+ }
103
+ top = Math.max(SAFE_MARGIN, top)
104
+
105
+ dynamicMenuStyle.value = {
106
+ left: `${left}px`,
107
+ top: `${top}px`,
108
+ display: 'block',
109
+ position: 'fixed',
110
+ zIndex: '9999',
111
+ minWidth: `${MENU_WIDTH}px`,
112
+ }
113
+ }
114
+
115
+ const closeMenu = () => {
116
+ emit('update:visible', false)
117
+ }
118
+
119
+ const handleClickOutside = (event: MouseEvent) => {
120
+ if (!props.visible || !menuRef.value) return
121
+ if (!menuRef.value.contains(event.target as Node)) {
122
+ closeMenu()
123
+ }
124
+ }
125
+
126
+ watch(
127
+ () => [props.visible, props.position],
128
+ () => {
129
+ updateMenuPosition()
130
+
131
+ if (props.visible) {
132
+ setTimeout(() => {
133
+ document.addEventListener('click', handleClickOutside, { capture: true })
134
+ }, 0)
135
+ } else {
136
+ document.removeEventListener('click', handleClickOutside, { capture: true })
137
+ }
138
+ },
139
+ { immediate: true }
140
+ )
141
+
142
+ const handlePropertyConfig = () => {
143
+ emit('property-config')
144
+ closeMenu()
145
+ }
146
+
147
+ const handleTreeHighlight = () => {
148
+ emit('tree-highlight')
149
+ closeMenu()
150
+ }
151
+
152
+ const handleDelete = () => {
153
+ emit('delete')
154
+ closeMenu()
155
+ }
156
+
157
+ const handleRemove = () => {
158
+ emit('remove')
159
+ closeMenu()
160
+ }
161
+
162
+ const handleWindowResize = () => {
163
+ if (props.visible) {
164
+ updateMenuPosition()
165
+ }
166
+ }
167
+
168
+ onMounted(() => {
169
+ window.addEventListener('resize', handleWindowResize)
170
+ updateMenuPosition()
171
+ })
172
+
173
+ onUnmounted(() => {
174
+ document.removeEventListener('click', handleClickOutside, { capture: true })
175
+ window.removeEventListener('resize', handleWindowResize)
176
+ })
177
+ </script>
178
+
179
+ <style scoped lang="scss">
180
+ .matrix-context-menu {
181
+ background-color: #fff;
182
+ border: 1px solid #ebeef5;
183
+ border-radius: 6px;
184
+ box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
185
+ padding: 6px 0;
186
+ overflow-y: auto;
187
+ box-sizing: border-box;
188
+ transition: opacity 0.2s ease, transform 0.2s ease;
189
+ transform-origin: top left;
190
+ }
191
+
192
+ .matrix-context-menu[style*='display: block'] {
193
+ animation: fadeIn 0.2s ease forwards;
194
+ }
195
+
196
+ @keyframes fadeIn {
197
+ from {
198
+ opacity: 0;
199
+ transform: scale(0.95);
200
+ }
201
+ to {
202
+ opacity: 1;
203
+ transform: scale(1);
204
+ }
205
+ }
206
+
207
+ .matrix-context-menu::-webkit-scrollbar {
208
+ width: 6px;
209
+ }
210
+
211
+ .matrix-context-menu::-webkit-scrollbar-thumb {
212
+ background-color: #ddd;
213
+ border-radius: 3px;
214
+ }
215
+
216
+ .matrix-context-menu::-webkit-scrollbar-track {
217
+ background-color: #f5f5f5;
218
+ }
219
+
220
+ .menu-item {
221
+ padding: 0 15px;
222
+ cursor: pointer;
223
+ font-size: 14px;
224
+ color: #606266;
225
+ border-radius: 4px;
226
+ height: 36px;
227
+ line-height: 36px;
228
+ box-sizing: border-box;
229
+
230
+ &:hover {
231
+ background-color: #f5f7fa;
232
+ color: #303133;
233
+ }
234
+ }
235
+ </style>