epic-designer-gold/dist/index-CraRg8wh.js

基于vue3的设计器,可视化开发页面表单

import { defineComponent as F, inject as r, ref as V, computed as h, openBlock as v, createElementBlock as f, createElementVNode as n, createVNode as p, unref as l, withCtx as N, Fragment as M, renderList as j, normalizeClass as L, toDisplayString as g, mergeProps as A, withDirectives as G, vShow as q } from "vue";
import { d as H } from "./vuedraggable.umd-D2S7Eo7p.js";
import { p as d, h as B, o as J } from "./pluginManager-BCnrHPYv.js";
import { _ as I } from "./icon.vue_vue_type_script_setup_true_lang-D3QdcReY.js";
import { u as K, a as O } from "./index-B1s67XDZ.js";
const Q = { class: "epic-component-view flex flex-col" }, R = { class: "epic-search-box px-10px py-6px" }, W = { class: "flex flex-1 overflow-auto" }, X = { class: "epic-tabs-box" }, Y = ["title", "onClick"], Z = { class: "h-full flex-1 overflow-auto py-2 box-border" }, ee = ["onClick"], te = ["title"], ie = /* @__PURE__ */ F({
  __name: "index",
  setup(oe) {
    const { t: c } = K(), $ = d.getComponent("input"), x = r("pageSchema"), C = r("designer"), z = r("revoke"), P = r("designerProps"), _ = d.getComponentSchemaGroups(), s = V(""), k = {
      title: c("all"),
      list: []
    }, T = h(() => (O.get("saas-locale") || "zh-CN") === "zh-CN"), i = V(k), U = h(() => [k, ..._.value]), u = h(() => {
      let o = i.value.list;
      if (i.value.title === c("all")) {
        const t = _.value.map((e) => e.list);
        o = [].concat(...t);
      }
      return o.filter(
        (t) => {
          var e;
          return ((e = t.label) == null ? void 0 : e.includes(s.value)) && (!P.value.formMode || t.type !== "form");
        }
      );
    });
    function D(o) {
      i.value = o;
    }
    function E(o) {
      var S, b, w;
      const t = J(x.schemas, ((S = C.state.checkedNode) == null ? void 0 : S.id) ?? "root");
      if (!t)
        return !1;
      let { list: e, schema: a, index: m } = t;
      a.children && !((w = (b = d.getComponentConfingByType(a.type)) == null ? void 0 : b.editConstraints) != null && w.childImmovable) && (e = a.children, m = a.children.length - 1);
      const y = B(o);
      e.splice(m + 1, 0, y), C.setCheckedNode(y), z.push(x.schemas, "插入组件");
    }
    return (o, t) => (v(), f("div", Q, [
      n("div", R, [
        p(l($), {
          placeholder: l(c)("searchComponent"),
          modelValue: s.value,
          "onUpdate:modelValue": t[0] || (t[0] = (e) => s.value = e),
          clearable: "",
          allowClear: "",
          value: s.value,
          "onUpdate:value": t[1] || (t[1] = (e) => s.value = e)
        }, {
          prefix: N(() => [
            p(l(I), {
              class: "text-$epic-text-helper",
              name: "icon--epic--search-rounded"
            })
          ]),
          _: 1
        }, 8, ["placeholder", "modelValue", "value"])
      ]),
      n("div", W, [
        n("div", X, [
          (v(!0), f(M, null, j(U.value, (e, a) => (v(), f("div", {
            class: L(["epic-tab cursor-pointer truncate", { checked: i.value.title === e.title }]),
            key: a,
            title: e.title,
            onClick: (m) => D(e)
          }, g(e.title), 11, Y))), 128))
        ]),
        n("div", Z, [
          p(l(H), A({
            modelValue: u.value,
            "onUpdate:modelValue": t[2] || (t[2] = (e) => u.value = e)
          }, {
            group: { name: "edit-draggable", pull: "clone", put: !1 },
            sort: !1,
            animation: 180,
            ghostClass: "moving"
          }, {
            clone: l(B),
            "item-key": "id",
            class: "grid grid-cols-[auto_auto] px-10px gap-2"
          }), {
            item: N(({ element: e }) => [
              n("div", {
                class: "epic-componet-item flex items-center truncate",
                onClick: (a) => E(e)
              }, [
                p(l(I), {
                  name: l(d).getComponentConfingByType(e.type).icon ?? ""
                }, null, 8, ["name"]),
                n("div", {
                  title: e.label,
                  class: L([[T.value ? "text-14px" : "text-12px"], "epic-componet-label flex-1 w-0 truncate"])
                }, g(e.label), 11, te)
              ], 8, ee)
            ]),
            _: 1
          }, 16, ["modelValue", "clone"]),
          G(n("div", { class: "text-center pt-42px text-gray-400" }, g(l(c)("noComponentFound")), 513), [
            [q, !u.value.length]
          ])
        ])
      ])
    ]));
  }
});
export {
  ie as default
};