@blueking/bkflow-canvas-editor 1.1.0-beta.13 → 1.1.0-beta.14

package/dist/index-Ck8QaRqx.js

@@ -0,0 +1,544 @@
+import { defineComponent as I, ref as T, computed as c, watch as Y, nextTick as X, resolveComponent as P, openBlock as f, createElementBlock as k, createVNode as m, Fragment as Z, renderList as ee, withKeys as te, withModifiers as se, normalizeClass as N, createElementVNode as n, createCommentVNode as H, toDisplayString as B, createSlots as K, withCtx as y, createTextVNode as D, onBeforeUnmount as oe, resolveDirective as ae, normalizeStyle as ne, withDirectives as le, createBlock as q } from "vue";
+import { L as ie, S as ue, E as re, _ as j, b as de, c as ce, t as pe, n as me, D as J, C as ve, d as be, s as fe } from "./index-DBNQiAYu.js";
+import { a as U } from "./composable-C5enWl9b.js";
+const ge = { class: "debug-result-node-list" }, _e = ["data-node-id", "aria-selected", "onClick", "onKeydown"], ye = ["title"], ke = {
+  key: 0,
+  class: "debug-result-node-list__mock",
+  "data-test": "node-mock-flag"
+}, we = {
+  key: 1,
+  class: "debug-result-node-list__empty"
+}, xe = /* @__PURE__ */ I({
+  __name: "node-list",
+  props: {
+    nodes: {},
+    modelValue: { default: "" }
+  },
+  emits: ["update:modelValue"],
+  setup(t, { emit: d }) {
+    const e = t, l = d, s = T(""), i = T("all"), g = T(null), _ = [
+      { value: "all", label: "全部" },
+      { value: "finished", icon: "bkflow-canvas-dark-circle-checkbox", iconColor: "#5fb8ac" },
+      { value: "failed", icon: "bkflow-canvas-dark-circle-close", iconColor: "#fa4e41" },
+      { value: "running", iconComponent: ie, iconColor: "#3a84ff" },
+      { value: "not_run", icon: "bkflow-canvas-weizhixing2", iconColor: "#b8bbc4" },
+      { value: "suspended", icon: "bkflow-canvas-zanting", iconColor: "#f59500" },
+      { value: "skipped", icon: "bkflow-canvas-tiaoguo2", iconColor: "#6e89af" }
+    ], E = c(
+      () => _.map((u) => ({
+        ...u,
+        count: u.value === "all" ? e.nodes.length : e.nodes.filter((r) => r.status === u.value).length
+      }))
+    ), C = c(() => {
+      const u = s.value.trim().toLowerCase();
+      return e.nodes.filter((r) => i.value !== "all" && r.status !== i.value ? !1 : u ? r.name.toLowerCase().includes(u) || r.type.toLowerCase().includes(u) || (r.typeName ?? "").toLowerCase().includes(u) : !0);
+    }), S = {
+      not_run: "未执行",
+      finished: "成功",
+      failed: "失败",
+      running: "正在调试",
+      suspended: "挂起",
+      skipped: "跳过"
+    }, L = c(() => s.value.trim() ? "搜索结果为空" : i.value !== "all" ? `暂无${S[i.value]}状态节点` : "暂无节点"), $ = () => {
+      s.value = "", i.value = "all";
+    }, h = (u) => {
+      const r = g.value, b = r?.querySelector(`[data-node-id="${CSS.escape(u)}"]`);
+      if (!r || !b) return;
+      const a = r.getBoundingClientRect(), w = b.getBoundingClientRect();
+      w.top < a.top ? r.scrollTop -= a.top - w.top : w.bottom > a.bottom && (r.scrollTop += w.bottom - a.bottom);
+    };
+    return Y(
+      () => e.modelValue,
+      async (u) => {
+        if (!u) return;
+        !C.value.some((b) => b.id === u) && e.nodes.some((b) => b.id === u) && (s.value = "", i.value = "all"), await X(), h(u);
+      },
+      { flush: "post" }
+    ), (u, r) => {
+      const b = P("bk-input");
+      return f(), k("aside", ge, [
+        m(b, {
+          modelValue: s.value,
+          "onUpdate:modelValue": r[0] || (r[0] = (a) => s.value = a),
+          class: "debug-result-node-list__search",
+          placeholder: "搜索节点名称 / 类型",
+          type: "search",
+          clearable: "",
+          "data-test": "node-search"
+        }, null, 8, ["modelValue"]),
+        m(ue, {
+          modelValue: i.value,
+          "onUpdate:modelValue": r[1] || (r[1] = (a) => i.value = a),
+          class: "debug-result-node-list__filters",
+          "data-test": "status-filters",
+          items: E.value
+        }, null, 8, ["modelValue", "items"]),
+        C.value.length > 0 ? (f(), k("div", {
+          key: 0,
+          ref_key: "itemsRef",
+          ref: g,
+          class: "debug-result-node-list__items",
+          role: "listbox"
+        }, [
+          (f(!0), k(Z, null, ee(C.value, (a) => (f(), k("div", {
+            key: a.id,
+            class: N([
+              "debug-result-node-list__item",
+              `is-${a.status}`,
+              {
+                "is-active": a.id === e.modelValue,
+                "is-unconfigured": !a.isConfigured
+              }
+            ]),
+            role: "option",
+            "data-test": "node-item",
+            "data-node-id": a.id,
+            "aria-selected": a.id === e.modelValue,
+            tabindex: "0",
+            onClick: (w) => l("update:modelValue", a.id),
+            onKeydown: te(se((w) => l("update:modelValue", a.id), ["prevent"]), ["enter", "space"])
+          }, [
+            n("span", {
+              class: N([
+                "debug-result-node-list__status",
+                `is-${a.status}`,
+                { "is-placeholder": !a.isConfigured }
+              ])
+            }, [
+              a.icon ? (f(), k("i", {
+                key: 0,
+                class: N(a.icon),
+                "data-test": "node-icon"
+              }, null, 2)) : H("", !0)
+            ], 2),
+            n("span", {
+              class: "debug-result-node-list__name",
+              title: a.isConfigured ? `${a.name} ${a.typeName || a.type}` : a.name
+            }, B(a.name), 9, ye),
+            a.isMock ? (f(), k("span", ke, "MOCK")) : H("", !0)
+          ], 42, _e))), 128))
+        ], 512)) : (f(), k("div", we, [
+          m(re, {
+            "is-search": !1,
+            title: L.value,
+            onClear: $
+          }, null, 8, ["title"])
+        ]))
+      ]);
+    };
+  }
+}), Ce = /* @__PURE__ */ j(xe, [["__scopeId", "data-v-30d37bc1"]]);
+function Ee(t) {
+  if (t == null) return "";
+  if (typeof t == "string") return t;
+  if (typeof t == "object") {
+    const d = t, e = d.message;
+    if (typeof e == "string" && e) {
+      const l = d.type;
+      return typeof l == "string" && l ? `${l}: ${e}` : e;
+    }
+    try {
+      return JSON.stringify(t);
+    } catch {
+      return String(t);
+    }
+  }
+  return String(t);
+}
+const he = { class: "debug-result-tabs" }, Ve = {
+  class: "debug-result-tabs__failed-actions",
+  "data-test": "output-error-actions"
+}, Me = {
+  class: "debug-result-tabs__execution",
+  "data-test": "tab-execution"
+}, Re = { class: "debug-result-tabs__row" }, Te = { class: "value" }, Ne = { class: "debug-result-tabs__row" }, Se = { class: "value" }, Le = {
+  key: 0,
+  class: "debug-result-tabs__row is-error"
+}, $e = { class: "value" }, Ae = {
+  class: "debug-result-tabs__mock-hint",
+  "data-test": "mock-banner"
+}, Pe = {
+  class: "debug-result-tabs__logs",
+  "data-test": "tab-logs"
+}, Be = /* @__PURE__ */ I({
+  __name: "result-tabs",
+  props: {
+    result: {},
+    component: {},
+    isMock: { type: Boolean, default: !1 },
+    canRunNodeDebug: { type: Boolean, default: !1 }
+  },
+  emits: ["reEditMock", "runReal", "runMock", "logsTabActive"],
+  setup(t, { emit: d }) {
+    const e = t, l = d, s = T("execution");
+    Y(
+      s,
+      (x) => l("logsTabActive", x === "logs"),
+      { immediate: !0 }
+    );
+    const i = {
+      not_run: "未调试",
+      running: "正在调试",
+      finished: "成功",
+      failed: "失败",
+      suspended: "挂起",
+      skipped: "跳过"
+    }, g = c(() => i[e.result.execution.status] ?? e.result.execution.status), _ = c(() => de(e.result.execution.durationMs)), E = c(() => Ee(e.result.error || e.result.execution.errorDetail)), C = c(() => e.result.execution.status === "failed"), {
+      loading: S,
+      error: L,
+      visibleInputs: $,
+      outputNameMap: h
+    } = ce({ component: () => e.component }), u = c(() => e.result.loading || S.value), r = c(() => e.result.detailError || L.value), b = c(
+      () => $.value.filter(({ key: x }) => Object.prototype.hasOwnProperty.call(e.result.inputs, x)).map(({ key: x, name: o }) => ({ key: x, name: o, value: e.result.inputs[x] }))
+    ), a = c(
+      () => pe(e.result.outputs, h.value)
+    ), w = c(() => e.result.logs == null ? "" : me(e.result.logs));
+    return (x, o) => {
+      const A = P("bk-button"), V = P("bk-tab-panel"), G = P("bk-tab");
+      return f(), k("div", he, [
+        m(G, {
+          active: s.value,
+          "onUpdate:active": o[3] || (o[3] = (M) => s.value = M),
+          type: "card-grid"
+        }, K({
+          default: y(() => [
+            m(V, {
+              name: "execution",
+              label: "执行信息"
+            }, {
+              default: y(() => [
+                n("div", Me, [
+                  n("div", Re, [
+                    o[9] || (o[9] = n("span", { class: "label" }, "执行状态", -1)),
+                    n("span", Te, B(g.value), 1)
+                  ]),
+                  n("div", Ne, [
+                    o[10] || (o[10] = n("span", { class: "label" }, "调试用时", -1)),
+                    n("span", Se, B(_.value), 1)
+                  ]),
+                  E.value ? (f(), k("div", Le, [
+                    o[11] || (o[11] = n("span", { class: "label" }, "错误信息", -1)),
+                    n("span", $e, B(E.value), 1)
+                  ])) : H("", !0)
+                ])
+              ]),
+              _: 1
+            }),
+            m(V, {
+              name: "inputs",
+              label: "输入参数"
+            }, {
+              default: y(() => [
+                m(J, {
+                  rows: b.value,
+                  loading: u.value,
+                  error: r.value,
+                  "empty-text": "暂无输入参数"
+                }, null, 8, ["rows", "loading", "error"])
+              ]),
+              _: 1
+            }),
+            m(V, {
+              name: "outputs",
+              label: "输出结果"
+            }, {
+              default: y(() => [
+                m(J, {
+                  rows: a.value,
+                  loading: u.value,
+                  error: r.value,
+                  "empty-text": "暂无输出结果"
+                }, K({ _: 2 }, [
+                  e.isMock ? {
+                    name: "toolbar",
+                    fn: y(() => [
+                      n("div", Ae, [
+                        o[13] || (o[13] = n("i", {
+                          class: "bkflow-canvas-icon bkflow-canvas-info debug-result-tabs__mock-info",
+                          "aria-hidden": "true"
+                        }, null, -1)),
+                        o[14] || (o[14] = n("span", null, "当前为 Mock 数据", -1)),
+                        m(A, {
+                          text: "",
+                          theme: "primary",
+                          size: "small",
+                          "data-test": "re-edit-mock",
+                          onClick: o[2] || (o[2] = (M) => l("reEditMock"))
+                        }, {
+                          default: y(() => [...o[12] || (o[12] = [
+                            D(" 重新编辑 ", -1)
+                          ])]),
+                          _: 1
+                        })
+                      ])
+                    ]),
+                    key: "0"
+                  } : void 0
+                ]), 1032, ["rows", "loading", "error"])
+              ]),
+              _: 1
+            }),
+            m(V, {
+              name: "logs",
+              label: "调用日志"
+            }, {
+              default: y(() => [
+                n("div", Pe, [
+                  m(ve, {
+                    "log-text": w.value,
+                    loading: e.result.logLoading,
+                    error: e.result.logError
+                  }, null, 8, ["log-text", "loading", "error"])
+                ])
+              ]),
+              _: 1
+            })
+          ]),
+          _: 2
+        }, [
+          C.value && e.canRunNodeDebug ? {
+            name: "setting",
+            fn: y(() => [
+              n("div", Ve, [
+                o[6] || (o[6] = n("i", { class: "bkflow-canvas-icon bkflow-canvas-alert" }, null, -1)),
+                o[7] || (o[7] = n("span", null, "该节点执行失败，可", -1)),
+                m(A, {
+                  text: "",
+                  theme: "primary",
+                  "data-test": "rerun-real",
+                  onClick: o[0] || (o[0] = (M) => l("runReal"))
+                }, {
+                  default: y(() => [...o[4] || (o[4] = [
+                    D("重新调试", -1)
+                  ])]),
+                  _: 1
+                }),
+                o[8] || (o[8] = n("span", null, "或直接", -1)),
+                m(A, {
+                  text: "",
+                  theme: "primary",
+                  "data-test": "run-mock",
+                  onClick: o[1] || (o[1] = (M) => l("runMock"))
+                }, {
+                  default: y(() => [...o[5] || (o[5] = [
+                    D("Mock 输出", -1)
+                  ])]),
+                  _: 1
+                })
+              ])
+            ]),
+            key: "0"
+          } : void 0
+        ]), 1032, ["active"])
+      ]);
+    };
+  }
+}), De = /* @__PURE__ */ j(Be, [["__scopeId", "data-v-08f04010"]]), Ge = {
+  ExclusiveGateway: "bkflow-canvas-icon bkflow-canvas-fenzhiwangguan",
+  ParallelGateway: "bkflow-canvas-icon bkflow-canvas-bingxingwangguan",
+  ConditionalParallelGateway: "bkflow-canvas-icon bkflow-canvas-tiaojianbingxingwangguan",
+  ConvergeGateway: "bkflow-canvas-icon bkflow-canvas-huijuwangguan"
+}, O = {
+  ServiceActivity: "任务节点",
+  EmptyStartEvent: "开始节点",
+  EmptyEndEvent: "结束节点",
+  ExclusiveGateway: "分支网关",
+  ParallelGateway: "并行网关",
+  ConditionalParallelGateway: "条件并行网关",
+  ConvergeGateway: "汇聚网关"
+}, ze = (t) => !t || t.includes("bkflow-canvas-icon") ? t : `bkflow-canvas-icon ${t}`;
+function Ue(t) {
+  if (!t.component?.code) return "";
+  if (t.component.code === "uniform_api") {
+    const d = t.component.api_meta?.category?.name ?? "";
+    return U[d] ?? U.bkflow;
+  }
+  return U.bkflow;
+}
+function Oe(t, d) {
+  const e = t?.location?.find((g) => g.id === d), l = ze(e?.icon ?? ""), s = t?.activities?.[d];
+  if (s)
+    return {
+      name: !!s.component?.code ? s.name || e?.name || d : "节点未配置",
+      type: s.type || "ServiceActivity",
+      typeName: O[s.type] ?? "任务节点",
+      icon: Ue(s)
+    };
+  const i = t?.gateways?.[d];
+  return i ? {
+    name: i.name || e?.name || O[i.type] || d,
+    type: i.type,
+    typeName: O[i.type] ?? "网关",
+    icon: l || Ge[i.type] || ""
+  } : t?.start_event?.id === d ? {
+    name: t.start_event.name || "开始",
+    type: "EmptyStartEvent",
+    typeName: "开始节点",
+    icon: l || "bkflow-canvas-icon bkflow-canvas-kaishi"
+  } : t?.end_event?.id === d ? {
+    name: t.end_event.name || "结束",
+    type: "EmptyEndEvent",
+    typeName: "结束节点",
+    icon: l || "bkflow-canvas-icon bkflow-canvas-stop"
+  } : e ? {
+    name: e.name || d,
+    type: e.type || "",
+    typeName: "",
+    icon: l
+  } : { name: d, type: "", typeName: "", icon: "" };
+}
+function Fe(t, d, e = /* @__PURE__ */ new Set()) {
+  if (!t) return [];
+  const l = new Map(
+    (d ?? []).map((s) => [s.node_id, be(s.status)])
+  );
+  return fe(t).map((s) => {
+    const i = t.activities?.[s], g = i ? !!i.component?.code : !0, _ = Oe(t, s);
+    return {
+      id: s,
+      name: _.name,
+      type: _.type || i?.type || "",
+      typeName: _.typeName,
+      icon: _.icon,
+      status: l.get(s) ?? "not_run",
+      isMock: !!(i && e.has(s)),
+      isConfigured: g
+    };
+  });
+}
+const He = { class: "debug-result-drawer__header" }, Ie = { class: "debug-result-drawer__header-left" }, Ye = { class: "debug-result-drawer__body" }, je = { class: "debug-result-drawer__content" }, Ke = { class: "debug-result-drawer__result" }, qe = {
+  key: 1,
+  class: "debug-result-drawer__unselected",
+  "data-test": "node-unselected"
+}, R = 44, F = 420, Je = /* @__PURE__ */ I({
+  __name: "index",
+  props: {
+    open: { type: Boolean },
+    context: {},
+    pipelineTree: {},
+    mockNodeIds: {},
+    modelValue: { default: "" },
+    result: {},
+    hasGlobalRun: { type: Boolean, default: !1 },
+    viewParamsPending: { type: Boolean, default: !1 },
+    offsetLeft: { default: 0 }
+  },
+  emits: ["update:open", "update:modelValue", "reEditMock", "runReal", "runMock", "viewParams", "logsTabActive"],
+  setup(t, { emit: d }) {
+    const e = t, l = d, s = T(F), i = T(!1);
+    let g = 0, _ = 0, E = "", C = "";
+    const S = c(() => ({
+      left: `${e.offsetLeft}px`,
+      height: `${e.open ? s.value : R}px`
+    })), L = () => {
+      e.open || (s.value = F), l("update:open", !e.open);
+    }, $ = (v) => {
+      const p = v > R;
+      p !== e.open && l("update:open", p);
+    }, h = (v) => {
+      const p = _ - (v.clientY - g);
+      s.value = Math.max(R, Math.min(window.innerHeight * 0.8, p)), $(s.value);
+    }, u = () => {
+      document.removeEventListener("mousemove", h), document.removeEventListener("mouseup", u), document.body.style.cursor = E, document.body.style.userSelect = C, i.value = !1, s.value <= R && (s.value = F, l("update:open", !1));
+    }, r = (v) => {
+      v.preventDefault(), i.value = !0, g = v.clientY, e.open ? _ = s.value : (l("update:open", !0), s.value = R, _ = R), E = document.body.style.cursor, C = document.body.style.userSelect, document.body.style.cursor = "ns-resize", document.body.style.userSelect = "none", document.addEventListener("mousemove", h), document.addEventListener("mouseup", u);
+    };
+    oe(u);
+    const b = c({
+      get: () => e.modelValue,
+      set: (v) => l("update:modelValue", v)
+    });
+    Y(
+      () => e.modelValue,
+      (v) => {
+        v || l("logsTabActive", !1);
+      },
+      { immediate: !0 }
+    );
+    const a = c(
+      () => Fe(e.pipelineTree, e.context?.nodes, e.mockNodeIds)
+    ), w = c(() => e.mockNodeIds.has(e.modelValue)), x = c(() => e.pipelineTree?.activities?.[e.modelValue]?.component), o = c(() => {
+      const v = a.value.find((p) => p.id === e.modelValue);
+      return v?.type === "ServiceActivity" && v.isConfigured;
+    }), A = () => {
+      !e.hasGlobalRun || e.viewParamsPending || l("viewParams");
+    }, V = () => {
+      e.modelValue && l("reEditMock", e.modelValue);
+    }, G = () => {
+      e.modelValue && l("runReal", e.modelValue);
+    }, M = () => {
+      e.modelValue && l("runMock", e.modelValue);
+    };
+    return (v, p) => {
+      const W = P("bk-button"), Q = ae("bk-tooltips");
+      return f(), k("div", {
+        class: N(["debug-result-drawer-wrapper", { "is-resizing": i.value }]),
+        style: ne(S.value)
+      }, [
+        n("div", {
+          class: "debug-result-drawer__resize",
+          onMousedown: r
+        }, null, 32),
+        n("section", {
+          class: N(["debug-result-drawer", { "is-collapsed": !e.open }])
+        }, [
+          n("header", He, [
+            n("div", Ie, [
+              p[3] || (p[3] = n("span", { class: "debug-result-drawer__title" }, "调试结果", -1)),
+              p[4] || (p[4] = n("span", { class: "debug-result-drawer__divider" }, null, -1)),
+              le((f(), q(W, {
+                text: "",
+                theme: "primary",
+                disabled: !e.hasGlobalRun,
+                loading: e.viewParamsPending,
+                onClick: A
+              }, {
+                default: y(() => [...p[2] || (p[2] = [
+                  n("i", { class: "bkflow-canvas-icon bkflow-canvas-audit view-params-icon" }, null, -1),
+                  D(" 查看参数 ", -1)
+                ])]),
+                _: 1
+              }, 8, ["disabled", "loading"])), [
+                [Q, { content: "请先进行调试", disabled: e.hasGlobalRun }]
+              ])
+            ]),
+            n("span", {
+              class: "debug-result-drawer__collapse",
+              onClick: L
+            }, [
+              n("span", null, B(e.open ? "收起" : "展开"), 1),
+              n("i", {
+                class: N(["bkflow-canvas-icon bkflow-canvas-arrows-down debug-result-drawer__collapse-icon", { "is-expanded": e.open }])
+              }, null, 2)
+            ])
+          ]),
+          n("div", Ye, [
+            n("div", je, [
+              m(Ce, {
+                modelValue: b.value,
+                "onUpdate:modelValue": p[0] || (p[0] = (z) => b.value = z),
+                nodes: a.value
+              }, null, 8, ["modelValue", "nodes"]),
+              n("div", Ke, [
+                e.modelValue ? (f(), q(De, {
+                  key: 0,
+                  result: e.result,
+                  component: x.value,
+                  "is-mock": w.value,
+                  "can-run-node-debug": o.value,
+                  onReEditMock: V,
+                  onRunReal: G,
+                  onRunMock: M,
+                  onLogsTabActive: p[1] || (p[1] = (z) => l("logsTabActive", z))
+                }, null, 8, ["result", "component", "is-mock", "can-run-node-debug"])) : (f(), k("div", qe, " 请先选择节点查看调试详情 "))
+              ])
+            ])
+          ])
+        ], 2)
+      ], 6);
+    };
+  }
+}), Ze = /* @__PURE__ */ j(Je, [["__scopeId", "data-v-ea7fa807"]]);
+export {
+  Ze as default
+};