snowy-designer/dist/ui-kit/panel-ui/src/activitybars/outline/index.vue2.js

基于Epic-Designer-Pro版本的设计器,可视化开发页面表单

import { defineComponent as T, inject as f, computed as q, createElementBlock as M, openBlock as s, createVNode as B, unref as o, withCtx as A, createElementVNode as m, createCommentVNode as d, withModifiers as V, createTextVNode as F, toDisplayString as I, normalizeClass as v, createBlock as k } from "vue";
/* empty css                                 */
import p from "../../../../base-ui/src/components/icon/icon.vue.js";
import "radix-vue";
import "clsx";
import "tailwind-merge";
import "lucide-vue-next";
import "../../../../base-ui/src/shadch-ui/button/index.js";
import "@vueuse/core";
import "../../../../base-ui/src/shadch-ui/toast/index.js";
import { findSchemaInfoById as L, generateNewSchema as G } from "../../../../../utils/src/common/data.js";
import "../../../../../hooks/src/store/index.js";
import "lodash";
import { pluginManager as y } from "../../../../../utils/src/manager/pluginManager.js";
import "monaco-editor";
import "../../../../../utils/src/request/index.js";
import J from "../../../../base-ui/src/components/tree/tree.vue2.js";
const O = { class: "epic-outline" }, Q = { class: "epic-outline-item epic-item-wrapper flex items-center justify-center" }, R = ["onMouseenter"], U = { class: "max-w-full truncate" }, W = { class: "epic-node-type-text w-0 flex-1 truncate" }, fe = /* @__PURE__ */ T({
  __name: "index",
  setup(X) {
    const l = f("designer"), a = f("pageSchema"), _ = f("revoke"), j = q(() => {
      var n;
      const t = (n = l.state.selectedNode) == null ? void 0 : n.id;
      return t ? [t] : [];
    });
    function D(t) {
      l.setSelectedNode(t.componentSchema);
    }
    function E(t) {
      t.componentProps || (t.componentProps = {}), t.componentProps.hidden = !t.componentProps.hidden;
    }
    function H(t) {
      t.status || (t.status = { lock: !1 }), t.status.lock = !t.status.lock;
    }
    function z(t) {
      if (!t) return;
      const n = L(a.schemas, t.id);
      if (!n)
        return !1;
      const { index: i, schema: e, list: u } = n, c = G(e, a.schemas);
      u.splice(i + 1, 0, c), l.setSelectedNode(c), _.push("复制组件");
    }
    function K(t) {
      if (!t) return;
      const n = L(a.schemas, t.id);
      if (!n)
        return !1;
      let { index: i, list: e } = n;
      e.splice(i, 1), i === e.length && i--, l.setSelectedNode(e[i]), _.push("删除组件");
    }
    return (t, n) => {
      var i;
      return s(), M("div", O, [
        B(o(J), {
          options: o(a).schemas,
          draggable: "",
          "selected-keys": j.value,
          "hover-key": (i = o(l).state.hoverNode) == null ? void 0 : i.id,
          onNodeClick: D
        }, {
          "tree-node": A(({ schema: e }) => {
            var u, c, g, x, C, N, S, P, w, $, h, b;
            return [
              m("div", Q, [
                m("div", {
                  class: "epic-text-padding flex w-0 flex-1",
                  onMouseenter: V((r) => o(l).setHoverNode(e), ["stop"]),
                  onMouseleave: n[0] || (n[0] = V((r) => o(l).setHoverNode(null), ["stop"]))
                }, [
                  m("span", U, [
                    B(o(p), {
                      class: "epic-component-icon translate-y-2px",
                      name: o(y).getIcon(e.type)
                    }, null, 8, ["name"]),
                    F(" " + I(e.label ?? o(y).getLabel(e.type)), 1)
                  ]),
                  m("span", W, I(e.type === "epic-slot" ? "slot" : e.id), 1)
                ], 40, R),
                o(y).getLocked(e) ? d("", !0) : (s(), M("div", {
                  key: 0,
                  class: v(["epic-tree-action", {
                    active: ((u = e.componentProps) == null ? void 0 : u.hidden) || ((c = e.status) == null ? void 0 : c.lock)
                  }])
                }, [
                  (g = e.componentProps) != null && g.hidden ? d("", !0) : (s(), k(o(p), {
                    key: 0,
                    class: v(["mr-2", { active: (x = e.status) == null ? void 0 : x.lock }]),
                    name: (C = e.status) != null && C.lock ? "icon--epic--lock-outline" : "icon--epic--lock-open-outline",
                    onClick: (r) => H(e)
                  }, null, 8, ["class", "name", "onClick"])),
                  (N = e.status) != null && N.lock ? d("", !0) : (s(), k(o(p), {
                    key: 1,
                    class: v(["mr-2", { active: (S = e.componentProps) == null ? void 0 : S.hidden }]),
                    name: (P = e.componentProps) != null && P.hidden ? "icon--epic--visibility-off-outline-rounded" : "icon--epic--visibility-outline-rounded",
                    onClick: (r) => E(e)
                  }, null, 8, ["class", "name", "onClick"])),
                  !((w = e.status) != null && w.lock) && !(($ = e.componentProps) != null && $.hidden) ? (s(), k(o(p), {
                    key: 2,
                    class: "mr-2",
                    name: "icon--epic--copy-all-outline-rounded",
                    onClick: (r) => z(e)
                  }, null, 8, ["onClick"])) : d("", !0),
                  !((h = e.status) != null && h.lock) && !((b = e.componentProps) != null && b.hidden) ? (s(), k(o(p), {
                    key: 3,
                    class: "mr-2",
                    name: "icon--epic--delete-outline-rounded",
                    onClick: (r) => K(e)
                  }, null, 8, ["onClick"])) : d("", !0)
                ], 2))
              ])
            ];
          }),
          _: 1
        }, 8, ["options", "selected-keys", "hover-key"])
      ]);
    };
  }
});
export {
  fe as default
};