epic-designer/dist/ui-kit/panel-ui/src/components/EActionEditor/index.vue2.js

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

import { defineComponent as B, ref as i, computed as r, toRaw as I, watch as N, createElementBlock as g, openBlock as v, Fragment as V, createVNode as m, unref as E, withCtx as h, renderList as R, createBlock as $ } from "vue";
/* empty css                                 */
import "vuedraggable";
import "@vueuse/core";
import "../../../../../hooks/src/store/index.js";
import { pluginManager as C } from "../../../../../utils/src/manager/pluginManager.js";
import b from "./src/EActionEditorItem.vue.js";
import j from "./src/EActionModal.vue.js";
const J = /* @__PURE__ */ B({
  __name: "index",
  props: {
    eventList: {
      default: () => [],
      type: Array
    },
    modelValue: {
      default: () => ({}),
      type: Object
    }
  },
  emits: ["update:modelValue"],
  setup(x, { emit: k }) {
    const p = x, A = k, L = C.getComponent("Collapse"), O = C.getComponent("CollapseItem"), s = i(null);
    let f = 0;
    const n = r({
      get() {
        return p.modelValue;
      },
      set(t) {
        A("update:modelValue", t);
      }
    }), a = i([]), c = r(() => p.eventList.filter(
      (t) => t.events.length
    )), y = r(() => p.eventList.flatMap((t) => t.events)), u = i({});
    y.value.forEach((t) => {
      u.value[t.type] = r({
        get() {
          var e;
          return ((e = n.value) == null ? void 0 : e[t.type]) ?? [];
        },
        set(e) {
          e && e.length > 0 ? n.value[t.type] = e.map((l) => I(l)) : delete n.value[t.type];
        }
      });
    }), N(
      () => c.value,
      (t) => {
        t.length > 0 && (a.value = t.filter((e) => {
          for (let l = 0; l < e.events.length; l++) {
            const d = e.events[l].type;
            if (u.value[d].length > 0)
              return !0;
          }
          return !1;
        }).map((e) => e.title));
      },
      {
        // 配置选项
        immediate: !0
        // 立即执行一次回调函数
      }
    );
    let o = "";
    function _(t) {
      var e;
      (e = s.value) == null || e.handleOpen(), o = t;
    }
    function M(t, e, l) {
      var d;
      (d = s.value) == null || d.handleOpenEdit(l), f = t, o = e;
    }
    function U(t) {
      u.value[o][f] = t, n.value[o] = [
        ...u.value[o] ?? []
      ];
    }
    function w(t) {
      var e;
      n.value = {
        ...n.value,
        [o]: [...((e = u.value[o]) == null ? void 0 : e.value) || [], t]
      };
    }
    return (t, e) => (v(), g(V, null, [
      m(E(L), {
        modelValue: a.value,
        "onUpdate:modelValue": e[1] || (e[1] = (l) => a.value = l),
        "active-key": a.value,
        "onUpdate:activeKey": e[2] || (e[2] = (l) => a.value = l),
        "expanded-names": a.value,
        "onUpdate:expandedNames": e[3] || (e[3] = (l) => a.value = l)
      }, {
        default: h(() => [
          (v(!0), g(V, null, R(c.value, (l) => (v(), $(E(O), {
            key: l.title,
            title: l.title,
            header: l.title,
            name: l.title
          }, {
            default: h(() => [
              m(b, {
                modelValue: n.value,
                "onUpdate:modelValue": e[0] || (e[0] = (d) => n.value = d),
                "item-events": l.events,
                "all-events": y.value,
                events: u.value,
                onAdd: _,
                onEdit: M
              }, null, 8, ["modelValue", "item-events", "all-events", "events"])
            ]),
            _: 2
          }, 1032, ["title", "header", "name"]))), 128))
        ]),
        _: 1
      }, 8, ["modelValue", "active-key", "expanded-names"]),
      m(j, {
        ref_key: "EActionModalRef",
        ref: s,
        onAdd: w,
        onEdit: U
      }, null, 512)
    ], 64));
  }
});
export {
  J as default
};