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

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

import { defineComponent as w, ref as s, computed as r, toRaw as B, watch as N, createElementBlock as y, openBlock as m, Fragment as E, createVNode as v, unref as f, withCtx as g, renderList as R, createBlock as U, createElementVNode as b } from "vue";
/* empty css                                 */
import j from "../../../../base-ui/src/collapse/collapse.vue.js";
import F from "../../../../base-ui/src/collapse/collapsePanel.vue.js";
import { pluginManager as I } from "../../../../../manager/src/pluginManager.js";
import "../../../../../git/epic/epic-designer/node_modules/.pnpm/jsep@1.4.0/node_modules/jsep/dist/jsep.js";
import "@vueuse/core";
import "../../../../../hooks/src/store/index.js";
/* empty css                                           */
import "vue-draggable-plus";
import P from "./src/EActionEditorItem.vue.js";
const T = { class: "p-2 pt-0" }, X = /* @__PURE__ */ w({
  __name: "index",
  props: {
    eventList: {
      default: () => [],
      type: Array
    },
    modelValue: {
      default: () => ({}),
      type: Object
    }
  },
  emits: ["update:modelValue"],
  setup(_, { emit: A }) {
    const d = _, M = A, k = I.component.get("epActionModal"), p = s(null);
    let c = 0;
    const n = r({
      get() {
        return d.modelValue;
      },
      set(e) {
        M("update:modelValue", e);
      }
    }), i = s([]), V = r(() => d.eventList.filter(
      (e) => e.events.length
    )), h = r(() => d.eventList.flatMap((e) => e.events)), o = s({});
    h.value.forEach((e) => {
      o.value[e.type] = r({
        get() {
          var t;
          return ((t = n.value) == null ? void 0 : t[e.type]) ?? [];
        },
        set(t) {
          t && t.length > 0 ? n.value[e.type] = t.map((l) => B(l)) : delete n.value[e.type];
        }
      });
    }), N(
      () => V.value,
      (e) => {
        e.length > 0 && (i.value = e.filter((t) => {
          for (let l = 0; l < t.events.length; l++) {
            const u = t.events[l].type;
            if (o.value[u].length > 0)
              return !0;
          }
          return !1;
        }).map((t) => t.title));
      },
      {
        // 配置选项
        immediate: !0
        // 立即执行一次回调函数
      }
    );
    let a = "";
    function x(e) {
      var t;
      (t = p.value) == null || t.handleOpen(), a = e;
    }
    function C(e, t, l) {
      var u;
      (u = p.value) == null || u.handleOpenEdit(l), c = e, a = t;
    }
    function L(e) {
      o.value[a][c] = e, n.value[a] = [
        ...o.value[a] ?? []
      ];
    }
    function O(e) {
      n.value = {
        ...n.value,
        [a]: [...o.value[a] || [], e]
      };
    }
    return (e, t) => (m(), y(E, null, [
      v(f(j), {
        modelValue: i.value,
        "onUpdate:modelValue": t[1] || (t[1] = (l) => i.value = l)
      }, {
        default: g(() => [
          (m(!0), y(E, null, R(V.value, (l) => (m(), U(f(F), {
            key: l.title,
            title: l.title,
            name: l.title
          }, {
            default: g(() => [
              b("div", T, [
                v(P, {
                  modelValue: n.value,
                  "onUpdate:modelValue": t[0] || (t[0] = (u) => n.value = u),
                  "item-events": l.events,
                  "all-events": h.value,
                  events: o.value,
                  onAdd: x,
                  onEdit: C
                }, null, 8, ["modelValue", "item-events", "all-events", "events"])
              ])
            ]),
            _: 2
          }, 1032, ["title", "name"]))), 128))
        ]),
        _: 1
      }, 8, ["modelValue"]),
      v(f(k), {
        ref_key: "epActionModalRef",
        ref: p,
        onAdd: O,
        onEdit: L
      }, null, 512)
    ], 64));
  }
});
export {
  X as default
};