topo-engine 0.1.2 → 0.1.3

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.
@@ -1333,11 +1333,26 @@ function foldModel(model, plans, nodeMap) {
1333
1333
  const extNodes = model.nodes.filter((n) => !containAll.has(n.id)).map((n) => ({ ...n }));
1334
1334
  for (const p of plans) {
1335
1335
  const inner = stationInner(p, model, 50, nodeMap);
1336
+ let estH = inner.estH;
1337
+ const title = p.name || "";
1338
+ if (title && inner.estW > 24) {
1339
+ const tFs = 11, tLH = tFs * 1.35;
1340
+ let tW = 0, lines = 1;
1341
+ for (const ch of title) {
1342
+ const cw = /[\u4e00-\u9fff\u3000-\u303f\uff00-\uffef]/.test(ch) ? tFs : tFs * 0.6;
1343
+ if (tW && tW + cw > inner.estW - 12) {
1344
+ lines++;
1345
+ tW = 0;
1346
+ }
1347
+ tW += cw;
1348
+ }
1349
+ estH = Math.max(estH, 13 + lines * tLH + 6);
1350
+ }
1336
1351
  extNodes.push({
1337
1352
  id: p.sid,
1338
1353
  cat: "station",
1339
1354
  name: p.name,
1340
- _size: { w: inner.estW, h: inner.estH },
1355
+ _size: { w: inner.estW, h: estH },
1341
1356
  _fanW: inner.fanW
1342
1357
  });
1343
1358
  }
@@ -1832,7 +1847,23 @@ function expandStations(model, plans, pos, edgeCP, band, bandClear, vTrunkStatio
1832
1847
  const fx = xS + (bminX + bmaxX) / 2;
1833
1848
  const fy = yS + (bminY + bmaxY) / 2;
1834
1849
  const fw = bmaxX - bminX + 2 * HM;
1835
- const fh = bmaxY - bminY + 2 * VM;
1850
+ let fh = bmaxY - bminY + 2 * VM;
1851
+ const title = plan.name || "";
1852
+ if (title && fw > 24) {
1853
+ const tFs = 11;
1854
+ const tLH = tFs * 1.35;
1855
+ let tW = 0, lines = 1;
1856
+ for (const ch of title) {
1857
+ const cw = /[\u4e00-\u9fff\u3000-\u303f\uff00-\uffef]/.test(ch) ? tFs : tFs * 0.6;
1858
+ if (tW && tW + cw > fw - 12) {
1859
+ lines++;
1860
+ tW = 0;
1861
+ }
1862
+ tW += cw;
1863
+ }
1864
+ const titleH = 13 + lines * tLH + 6;
1865
+ fh = Math.max(fh, titleH);
1866
+ }
1836
1867
  pos.set(plan.sid, { x: fx, y: fy });
1837
1868
  frames.push({ id: plan.sid, x: fx, y: fy, w: fw, h: fh, name: plan.name });
1838
1869
  if (plan.busNode) busWidth.set(plan.busNode, bs.w);
@@ -2422,6 +2453,69 @@ function assertOrthogonal(model, edgeCP) {
2422
2453
  }
2423
2454
  return bad;
2424
2455
  }
2456
+ const THEMES = {
2457
+ // —— 深色主题(默认,与历史版本完全一致)——
2458
+ dark: {
2459
+ // 画布背景
2460
+ canvasBg: "#050505",
2461
+ // 导线(边)
2462
+ trunkEdge: "#FFFFFF",
2463
+ // 干线:白
2464
+ branchEdge: "#8B8B8B",
2465
+ // 支线:灰
2466
+ // 图元符号
2467
+ trunkLine: "#07A4F8",
2468
+ // 变压器连接线(蓝)
2469
+ red: "#F00",
2470
+ orange: "#FF6600",
2471
+ white: "#FFF",
2472
+ // 通用浅色元素(描边/文字/标签),light 下为深色
2473
+ cyan: "#00C8FF",
2474
+ gold: "#FFD700",
2475
+ gray: "#8B8B8B",
2476
+ // 计量箱(JX):深色主题黑底白字;浅色主题白底深框深字(随画布配套)
2477
+ meterFill: "#000000",
2478
+ meterText: "#FFFFFF",
2479
+ // 母线填充
2480
+ busFill: "rgba(255,255,255,0.15)",
2481
+ // 导线连接点填充
2482
+ dotFill: "rgba(0,200,255,0.18)",
2483
+ // 站房外框
2484
+ stationFill: "rgba(255,255,255,0.02)",
2485
+ stationText: "rgba(255,255,255,0.85)",
2486
+ // 未知图元
2487
+ unknownFill: "#333333",
2488
+ unknownStroke: "#AAAAAA"
2489
+ },
2490
+ // —— 浅色主题(白色画布 + 配套深色图元)——
2491
+ light: {
2492
+ canvasBg: "#FFFFFF",
2493
+ // 白底上干线用深灰、支线用浅灰
2494
+ trunkEdge: "#3F3F3F",
2495
+ branchEdge: "#9C9C9C",
2496
+ // 蓝/橙/红在白底上加深一档保证对比度
2497
+ trunkLine: "#0B78B5",
2498
+ red: "#C62828",
2499
+ orange: "#E05F00",
2500
+ white: "#333333",
2501
+ cyan: "#0087B8",
2502
+ gold: "#B8860B",
2503
+ gray: "#9C9C9C",
2504
+ meterFill: "#FFFFFF",
2505
+ // 浅色主题:白底 + 深框深字(随白画布配套)
2506
+ meterText: "#3A3A3A",
2507
+ busFill: "rgba(0,0,0,0.07)",
2508
+ dotFill: "rgba(0,135,184,0.14)",
2509
+ stationFill: "rgba(0,0,0,0.03)",
2510
+ stationText: "rgba(50,50,50,0.8)",
2511
+ unknownFill: "#EDEDED",
2512
+ unknownStroke: "#777777"
2513
+ }
2514
+ };
2515
+ let edgeTheme = THEMES.dark;
2516
+ function setEdgeTheme(themeName) {
2517
+ edgeTheme = THEMES[themeName] || THEMES.dark;
2518
+ }
2425
2519
  function buildGraphData(model, layout) {
2426
2520
  const nodes = model.nodes.map((n) => {
2427
2521
  const spec = getSymbolSpec(n.cat);
@@ -2437,7 +2531,7 @@ function buildGraphData(model, layout) {
2437
2531
  size: [w, spec.h],
2438
2532
  // 自定义字段(进 attributes,供 svg-symbol 节点绘制使用)
2439
2533
  cat: n.cat,
2440
- labelText: n.shortName || "",
2534
+ labelText: n.cat === "bus" || n.cat === "cableTerminal" ? "" : n.shortName || "",
2441
2535
  rotate: layout.stationRotate && layout.stationRotate.get(n.id) || 0,
2442
2536
  highlight: 0,
2443
2537
  cursor: "pointer",
@@ -2454,9 +2548,9 @@ function buildGraphData(model, layout) {
2454
2548
  y: f2.y,
2455
2549
  size: [f2.w, f2.h],
2456
2550
  cat: "station",
2457
- labelText: f2.name || "",
2458
2551
  highlight: 0,
2459
- zIndex: -1
2552
+ zIndex: -1,
2553
+ _stationTitle: f2.name || ""
2460
2554
  }
2461
2555
  });
2462
2556
  }
@@ -2496,7 +2590,7 @@ function edgeStyle(datum) {
2496
2590
  };
2497
2591
  }
2498
2592
  const base = {
2499
- stroke: s2 && s2.overrideStroke || d2 && d2.overrideStroke || (isBranch ? "#8B8B8B" : "#FFFFFF"),
2593
+ stroke: s2 && s2.overrideStroke || d2 && d2.overrideStroke || (isBranch ? edgeTheme.branchEdge : edgeTheme.trunkEdge),
2500
2594
  lineWidth: s2 && s2.overrideLineWidth || d2 && d2.overrideLineWidth || (isBranch ? 1.1 : 1.5),
2501
2595
  opacity: s2 && s2.overrideOpacity != null ? s2.overrideOpacity : d2 && d2.overrideOpacity != null ? d2.overrideOpacity : isBranch ? 0.85 : 1,
2502
2596
  controlPoints: d2 && d2.cp || [],
@@ -27557,14 +27651,13 @@ var Sector = /* @__PURE__ */ function(_Path) {
27557
27651
  }]);
27558
27652
  }(Path);
27559
27653
  Sector.PARSED_STYLE_LIST = new Set([].concat(_toConsumableArray(Path.PARSED_STYLE_LIST), ["x", "y", "sr", "sr0", "radius", "startAngle", "endAngle"]));
27560
- const C2 = {
27561
- trunkLine: "#07A4F8",
27562
- red: "#F00",
27563
- orange: "#FF6600",
27564
- white: "#FFF",
27565
- cyan: "#00C8FF",
27566
- gold: "#FFD700"
27567
- };
27654
+ const C2 = { ...THEMES.dark };
27655
+ function setNodePalette(themeName) {
27656
+ const t = THEMES[themeName] || THEMES.dark;
27657
+ for (const key of Object.keys(t)) {
27658
+ if (key in C2) C2[key] = t[key];
27659
+ }
27660
+ }
27568
27661
  function drawHighlight(attributes, group) {
27569
27662
  if (!attributes.highlight) return;
27570
27663
  const [w, h] = attributes.size;
@@ -27585,45 +27678,19 @@ function drawHighlight(attributes, group) {
27585
27678
  );
27586
27679
  }
27587
27680
  function drawAnnotation(attributes, group) {
27588
- const text2 = attributes.annotationText;
27589
- if (!text2) return;
27590
- const [, h] = attributes.size;
27681
+ const label = attributes.annotationText;
27682
+ if (!label) return;
27683
+ const [w, h] = attributes.size;
27591
27684
  const pos = attributes.annotationPos || "top";
27592
27685
  const offset = attributes.annotationOffset || 4;
27593
27686
  const y = pos === "top" ? -h / 2 - offset - 6 : h / 2 + offset + 6;
27594
- group.appendChild(
27595
- new Text({
27596
- style: {
27597
- text: text2,
27598
- x: 0,
27599
- y,
27600
- fontSize: attributes.annotationSize || 12,
27601
- fill: attributes.annotationColor || "#FFFFFF",
27602
- fontFamily: FONT,
27603
- textAlign: "center",
27604
- textBaseline: "middle"
27605
- }
27606
- })
27607
- );
27687
+ _drawWrappedText(group, label, 0, y, attributes.annotationSize || 12, attributes.annotationColor || C2.white, w + 10, 1.25);
27608
27688
  }
27609
27689
  function drawLabelUnder(attributes, group) {
27610
- const text2 = attributes.labelText || "";
27611
- if (!text2) return;
27690
+ const label = attributes.labelText || "";
27691
+ if (!label) return;
27612
27692
  const [w, h] = attributes.size;
27613
- group.appendChild(
27614
- new Text({
27615
- style: {
27616
- text: text2,
27617
- x: 0,
27618
- y: h / 2 + 8,
27619
- fontSize: 11,
27620
- fill: C2.white,
27621
- fontFamily: FONT,
27622
- textAlign: "center",
27623
- textBaseline: "middle"
27624
- }
27625
- })
27626
- );
27693
+ _drawWrappedText(group, label, 0, h / 2 + 8, 11, C2.white, w + 4, 1.3);
27627
27694
  }
27628
27695
  function text(attributes, group, str2, x, y, size, fill) {
27629
27696
  if (!str2) return;
@@ -27642,6 +27709,52 @@ function text(attributes, group, str2, x, y, size, fill) {
27642
27709
  })
27643
27710
  );
27644
27711
  }
27712
+ function _measureWidth(str2, fontSize2) {
27713
+ let w = 0;
27714
+ for (const ch of str2) {
27715
+ w += /[\u4e00-\u9fff\u3000-\u303f\uff00-\uffef]/.test(ch) ? fontSize2 : fontSize2 * 0.6;
27716
+ }
27717
+ return w;
27718
+ }
27719
+ function _wrapLines(str2, fontSize2, maxWidth) {
27720
+ if (!str2) return [];
27721
+ const lines = [];
27722
+ let line = "";
27723
+ for (const ch of str2) {
27724
+ const test = line + ch;
27725
+ if (line && _measureWidth(test, fontSize2) > maxWidth) {
27726
+ lines.push(line);
27727
+ line = ch;
27728
+ } else {
27729
+ line = test;
27730
+ }
27731
+ }
27732
+ if (line) lines.push(line);
27733
+ return lines;
27734
+ }
27735
+ function _drawWrappedText(group, str2, x, y, fontSize2, fill, maxWidth, lineGap = 1.3) {
27736
+ if (!str2) return;
27737
+ const lines = _wrapLines(str2, fontSize2, maxWidth);
27738
+ if (!lines.length) return;
27739
+ const lineHeight2 = fontSize2 * lineGap;
27740
+ const totalH = lines.length * lineHeight2;
27741
+ for (let i = 0; i < lines.length; i++) {
27742
+ group.appendChild(
27743
+ new Text({
27744
+ style: {
27745
+ text: lines[i],
27746
+ x,
27747
+ y: y - totalH / 2 + lineHeight2 * (i + 0.5),
27748
+ fontSize: fontSize2,
27749
+ fill,
27750
+ fontFamily: FONT,
27751
+ textAlign: "center",
27752
+ textBaseline: "middle"
27753
+ }
27754
+ })
27755
+ );
27756
+ }
27757
+ }
27645
27758
  function drawTransformer(attributes, group) {
27646
27759
  const lw = 1.4;
27647
27760
  group.appendChild(new Line({ style: { x1: -24, y1: 0, x2: -15, y2: 0, stroke: C2.trunkLine, lineWidth: lw } }));
@@ -27663,7 +27776,7 @@ function drawBreaker(attributes, group) {
27663
27776
  group.appendChild(new Line({ style: { x1: -28, y1: 0, x2: -21, y2: 0, stroke: C2.red, lineWidth: lw } }));
27664
27777
  group.appendChild(new Rect({ style: { x: -21, y: -9, width: 42, height: 18, radius: 2, fill: "none", stroke: C2.red, lineWidth: lw } }));
27665
27778
  group.appendChild(new Rect({ style: { x: -21, y: -9, width: 42, height: 7, fill: "rgba(255,0,0,0.25)" } }));
27666
- text(attributes, group, attributes.labelText, 0, 0.5, 10, C2.white);
27779
+ _drawWrappedText(group, attributes.labelText, 0, 0.5, 10, C2.white, 36, 1.2);
27667
27780
  group.appendChild(new Line({ style: { x1: 21, y1: 0, x2: 28, y2: 0, stroke: C2.red, lineWidth: lw } }));
27668
27781
  }
27669
27782
  function drawCableTerminal(attributes, group) {
@@ -27674,8 +27787,8 @@ function drawStationTerminal(attributes, group) {
27674
27787
  group.appendChild(new Polygon({ style: { points: [[0, -5], [0, 5], [9, 0]], fill: "none", stroke: C2.red, lineWidth: 1.4 } }));
27675
27788
  }
27676
27789
  function drawMeterBox(attributes, group) {
27677
- group.appendChild(new Rect({ style: { x: -9.5, y: -9.5, width: 19, height: 19, fill: "#000", stroke: C2.white, lineWidth: 0.9 } }));
27678
- text(attributes, group, "JX", 0, 0.5, 7.5, C2.white);
27790
+ group.appendChild(new Rect({ style: { x: -9.5, y: -9.5, width: 19, height: 19, fill: C2.meterFill, stroke: C2.meterText, lineWidth: 0.9 } }));
27791
+ text(attributes, group, "JX", 0, 0.5, 7.5, C2.meterText);
27679
27792
  }
27680
27793
  function drawConsumer(attributes, group) {
27681
27794
  group.appendChild(new Circle({ style: { cx: 0, cy: 0, r: 12.5, fill: "none", stroke: C2.white, lineWidth: 1.8 } }));
@@ -27683,10 +27796,10 @@ function drawConsumer(attributes, group) {
27683
27796
  }
27684
27797
  function drawBus(attributes, group) {
27685
27798
  const [w] = attributes.size;
27686
- group.appendChild(new Rect({ style: { x: -w / 2, y: -3, width: w, height: 6, radius: 2, fill: "rgba(255,255,255,0.15)", stroke: C2.white, lineWidth: 1.4 } }));
27799
+ group.appendChild(new Rect({ style: { x: -w / 2, y: -3, width: w, height: 6, radius: 2, fill: C2.busFill, stroke: C2.white, lineWidth: 1.4 } }));
27687
27800
  }
27688
27801
  function drawLineDot(attributes, group) {
27689
- group.appendChild(new Circle({ style: { cx: 0, cy: 0, r: 4, fill: "rgba(0,200,255,0.18)", stroke: C2.cyan, lineWidth: 1.4 } }));
27802
+ group.appendChild(new Circle({ style: { cx: 0, cy: 0, r: 4, fill: C2.dotFill, stroke: C2.cyan, lineWidth: 1.4 } }));
27690
27803
  }
27691
27804
  function drawJunction(attributes, group) {
27692
27805
  const lw = 1.4;
@@ -27696,7 +27809,7 @@ function drawJunction(attributes, group) {
27696
27809
  group.appendChild(new Line({ style: { x1: 3.5, y1: -3.5, x2: -3.5, y2: 3.5, stroke: C2.red, lineWidth: lw } }));
27697
27810
  }
27698
27811
  function drawUnknown(attributes, group) {
27699
- group.appendChild(new Circle({ style: { cx: 0, cy: 0, r: 8, fill: "#333", stroke: "#AAA", lineWidth: 1.2 } }));
27812
+ group.appendChild(new Circle({ style: { cx: 0, cy: 0, r: 8, fill: C2.unknownFill, stroke: C2.unknownStroke, lineWidth: 1.2 } }));
27700
27813
  }
27701
27814
  function drawStation(attributes, group) {
27702
27815
  const [w, h] = attributes.size;
@@ -27708,28 +27821,15 @@ function drawStation(attributes, group) {
27708
27821
  width: w,
27709
27822
  height: h,
27710
27823
  radius: 2,
27711
- fill: "rgba(255,255,255,0.02)",
27824
+ fill: C2.stationFill,
27712
27825
  stroke: C2.white,
27713
27826
  lineWidth: 1.2,
27714
27827
  opacity: 0.9
27715
27828
  }
27716
27829
  })
27717
27830
  );
27718
- if (attributes.labelText) {
27719
- group.appendChild(
27720
- new Text({
27721
- style: {
27722
- text: attributes.labelText,
27723
- x: 0,
27724
- y: -h / 2 + 13,
27725
- fontSize: 11,
27726
- fill: "rgba(255,255,255,0.85)",
27727
- fontFamily: FONT,
27728
- textAlign: "center",
27729
- textBaseline: "middle"
27730
- }
27731
- })
27732
- );
27831
+ if (attributes._stationTitle) {
27832
+ _drawWrappedText(group, attributes._stationTitle, 0, -h / 2 + 13, 11, C2.stationText, w - 12, 1.35);
27733
27833
  }
27734
27834
  }
27735
27835
  const DRAWERS = {
@@ -27746,7 +27846,7 @@ const DRAWERS = {
27746
27846
  station: drawStation,
27747
27847
  other: drawUnknown
27748
27848
  };
27749
- const LABEL_UNDER = /* @__PURE__ */ new Set(["transformer", "fuse", "bus"]);
27849
+ const LABEL_UNDER = /* @__PURE__ */ new Set(["transformer", "fuse"]);
27750
27850
  const _pulseState = /* @__PURE__ */ new Map();
27751
27851
  class SvgSymbolNode extends BaseNode {
27752
27852
  drawKeyShape(attributes, container) {
@@ -27796,15 +27896,16 @@ const _export_sfc = (sfc, props) => {
27796
27896
  }
27797
27897
  return target;
27798
27898
  };
27799
- const _hoisted_1$2 = { class: "topo-wrap" };
27899
+ const _hoisted_1$2 = ["data-theme"];
27800
27900
  const _hoisted_2$2 = { class: "topo-toolbar" };
27801
27901
  const _hoisted_3$2 = { class: "topo-title" };
27802
27902
  const _hoisted_4$2 = { class: "topo-meta" };
27803
- const _hoisted_5$2 = {
27903
+ const _hoisted_5$2 = ["title"];
27904
+ const _hoisted_6$2 = {
27804
27905
  key: 0,
27805
27906
  class: "topo-loading"
27806
27907
  };
27807
- const _hoisted_6$2 = {
27908
+ const _hoisted_7$2 = {
27808
27909
  key: 1,
27809
27910
  class: "topo-error"
27810
27911
  };
@@ -27812,9 +27913,11 @@ const _sfc_main$2 = {
27812
27913
  __name: "TopoGraph",
27813
27914
  props: {
27814
27915
  dataUrl: { type: String, default: "" },
27815
- data: { type: Object, default: null }
27916
+ data: { type: Object, default: null },
27917
+ /** 主题:'dark'(默认,黑底 SCADA 风)| 'light'(白底);支持 v-model:theme 双向绑定 */
27918
+ theme: { type: String, default: "dark" }
27816
27919
  },
27817
- emits: ["node-select", "loaded", "top-distances"],
27920
+ emits: ["node-select", "loaded", "top-distances", "update:theme"],
27818
27921
  setup(__props, { expose: __expose, emit: __emit }) {
27819
27922
  const props = __props;
27820
27923
  const emit = __emit;
@@ -27888,6 +27991,7 @@ const _sfc_main$2 = {
27888
27991
  console.error("导出 PNG 失败:", e2);
27889
27992
  }
27890
27993
  }
27994
+ const lastRaw = ref(null);
27891
27995
  async function loadAndRender() {
27892
27996
  loading.value = true;
27893
27997
  error.value = "";
@@ -27916,7 +28020,16 @@ const _sfc_main$2 = {
27916
28020
  rawText = text2;
27917
28021
  loadAndRender();
27918
28022
  }
28023
+ const themeName = () => props.theme === "light" ? "light" : "dark";
28024
+ function applyTheme() {
28025
+ const t = themeName();
28026
+ setNodePalette(t);
28027
+ setEdgeTheme(t);
28028
+ return t;
28029
+ }
27919
28030
  function render(raw) {
28031
+ lastRaw.value = raw;
28032
+ const theme = applyTheme();
27920
28033
  model = parseTopo(raw);
27921
28034
  nodeByIdMap = new Map(model.nodes.map((n) => [n.id, n]));
27922
28035
  title.value = String(model.title || "").replace(/\.+$/, "");
@@ -27943,7 +28056,7 @@ const _sfc_main$2 = {
27943
28056
  graph = new Graph({
27944
28057
  container: container.value,
27945
28058
  autoResize: true,
27946
- background: "#050505",
28059
+ background: THEMES[theme].canvasBg,
27947
28060
  data: data2,
27948
28061
  // 节点坐标与边路径均由正交布局引擎显式给定(存储在layoutData中)
27949
28062
  node: {
@@ -28043,6 +28156,12 @@ const _sfc_main$2 = {
28043
28156
  },
28044
28157
  { deep: true }
28045
28158
  );
28159
+ watch(
28160
+ () => props.theme,
28161
+ () => {
28162
+ if (lastRaw.value) render(lastRaw.value);
28163
+ }
28164
+ );
28046
28165
  onBeforeUnmount(() => {
28047
28166
  if (api) {
28048
28167
  api.destroy();
@@ -28071,7 +28190,10 @@ const _sfc_main$2 = {
28071
28190
  getTopDistances: () => topDistances.value
28072
28191
  });
28073
28192
  return (_ctx, _cache) => {
28074
- return openBlock(), createElementBlock("div", _hoisted_1$2, [
28193
+ return openBlock(), createElementBlock("div", {
28194
+ class: "topo-wrap",
28195
+ "data-theme": themeName()
28196
+ }, [
28075
28197
  createElementVNode("div", {
28076
28198
  ref_key: "container",
28077
28199
  ref: container,
@@ -28080,6 +28202,11 @@ const _sfc_main$2 = {
28080
28202
  createElementVNode("div", _hoisted_2$2, [
28081
28203
  createElementVNode("span", _hoisted_3$2, toDisplayString(title.value), 1),
28082
28204
  createElementVNode("span", _hoisted_4$2, " 节点 " + toDisplayString(stats.value.total) + " · 边 " + toDisplayString(edgeCount.value) + " · 深度 " + toDisplayString(stats.value.depth) + " · 叶子 " + toDisplayString(stats.value.leaves), 1),
28205
+ createElementVNode("button", {
28206
+ class: "btn",
28207
+ title: __props.theme === "light" ? "切换到深色主题" : "切换到浅色主题",
28208
+ onClick: _cache[0] || (_cache[0] = ($event) => emit("update:theme", __props.theme === "light" ? "dark" : "light"))
28209
+ }, toDisplayString(__props.theme === "light" ? "🌙 深色" : "☀️ 浅色"), 9, _hoisted_5$2),
28083
28210
  createElementVNode("button", {
28084
28211
  class: "btn",
28085
28212
  onClick: resetView
@@ -28089,13 +28216,13 @@ const _sfc_main$2 = {
28089
28216
  onClick: exportPng
28090
28217
  }, "导出 PNG")
28091
28218
  ]),
28092
- loading.value ? (openBlock(), createElementBlock("div", _hoisted_5$2, "正在解析台区拓扑…")) : error.value ? (openBlock(), createElementBlock("div", _hoisted_6$2, toDisplayString(error.value), 1)) : createCommentVNode("", true)
28093
- ]);
28219
+ loading.value ? (openBlock(), createElementBlock("div", _hoisted_6$2, "正在解析台区拓扑…")) : error.value ? (openBlock(), createElementBlock("div", _hoisted_7$2, toDisplayString(error.value), 1)) : createCommentVNode("", true)
28220
+ ], 8, _hoisted_1$2);
28094
28221
  };
28095
28222
  }
28096
28223
  };
28097
- const TopoGraph = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-1f2e13bc"]]);
28098
- const _hoisted_1$1 = { class: "panel" };
28224
+ const TopoGraph = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-562b2247"]]);
28225
+ const _hoisted_1$1 = ["data-theme"];
28099
28226
  const _hoisted_2$1 = { class: "panel-head" };
28100
28227
  const _hoisted_3$1 = {
28101
28228
  key: 0,
@@ -28147,7 +28274,9 @@ const _sfc_main$1 = {
28147
28274
  node: { type: Object, default: null },
28148
28275
  upstream: { type: Array, default: () => [] },
28149
28276
  downstream: { type: Array, default: () => [] },
28150
- stats: { type: Object, default: () => ({}) }
28277
+ stats: { type: Object, default: () => ({}) },
28278
+ /** 主题:'dark'(默认)| 'light' */
28279
+ theme: { type: String, default: "dark" }
28151
28280
  },
28152
28281
  emits: ["close", "jump"],
28153
28282
  setup(__props, { emit: __emit }) {
@@ -28187,7 +28316,10 @@ const _sfc_main$1 = {
28187
28316
  return Object.entries(byCat).map(([cat, count]) => ({ label: CAT_LABEL[cat] || cat, count })).sort((a2, b) => b.count - a2.count);
28188
28317
  });
28189
28318
  return (_ctx, _cache) => {
28190
- return openBlock(), createElementBlock("div", _hoisted_1$1, [
28319
+ return openBlock(), createElementBlock("div", {
28320
+ class: "panel",
28321
+ "data-theme": __props.theme
28322
+ }, [
28191
28323
  createElementVNode("div", _hoisted_2$1, [
28192
28324
  createElementVNode("span", null, toDisplayString(headTitle.value), 1),
28193
28325
  createElementVNode("button", {
@@ -28282,12 +28414,12 @@ const _sfc_main$1 = {
28282
28414
  createTextVNode(" 鼠标悬浮节点可高亮上下游与连线。 ")
28283
28415
  ], -1))
28284
28416
  ]))
28285
- ]);
28417
+ ], 8, _hoisted_1$1);
28286
28418
  };
28287
28419
  }
28288
28420
  };
28289
- const SidePanel = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-f9af862d"]]);
28290
- const _hoisted_1 = { class: "distance-top10" };
28421
+ const SidePanel = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-547b7d57"]]);
28422
+ const _hoisted_1 = ["data-theme"];
28291
28423
  const _hoisted_2 = { class: "panel-head" };
28292
28424
  const _hoisted_3 = { class: "panel-body" };
28293
28425
  const _hoisted_4 = {
@@ -28313,7 +28445,9 @@ const _sfc_main = {
28313
28445
  distances: {
28314
28446
  type: Array,
28315
28447
  default: () => []
28316
- }
28448
+ },
28449
+ /** 主题:'dark'(默认)| 'light' */
28450
+ theme: { type: String, default: "dark" }
28317
28451
  },
28318
28452
  emits: ["close", "jump"],
28319
28453
  setup(__props, { emit: __emit }) {
@@ -28332,7 +28466,10 @@ const _sfc_main = {
28332
28466
  return distance2 / maxDistance.value * 100;
28333
28467
  }
28334
28468
  return (_ctx, _cache) => {
28335
- return openBlock(), createElementBlock("div", _hoisted_1, [
28469
+ return openBlock(), createElementBlock("div", {
28470
+ class: "distance-top10",
28471
+ "data-theme": __props.theme
28472
+ }, [
28336
28473
  createElementVNode("div", _hoisted_2, [
28337
28474
  _cache[1] || (_cache[1] = createElementVNode("div", { class: "head-left" }, [
28338
28475
  createElementVNode("span", { class: "head-icon" }, "📏"),
@@ -28389,12 +28526,12 @@ const _sfc_main = {
28389
28526
  }), 128))
28390
28527
  ]))
28391
28528
  ])
28392
- ]);
28529
+ ], 8, _hoisted_1);
28393
28530
  };
28394
28531
  }
28395
28532
  };
28396
- const DistanceTop10 = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-936b875b"]]);
28397
- const VERSION = "0.1.2";
28533
+ const DistanceTop10 = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-438b6017"]]);
28534
+ const VERSION = "0.1.3";
28398
28535
  const DESCRIPTION = "配电台区单线图拓扑成图引擎";
28399
28536
  export {
28400
28537
  DESCRIPTION,