form-designer-xinyi/dist/index-CNiyH6iN.js

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

import { defineComponent as V, openBlock as f, createBlock as k, unref as n, isRef as v, withCtx as b, createElementVNode as a, createElementBlock as g, Fragment as w, renderList as C, toDisplayString as $, createVNode as d, inject as I, computed as O, withDirectives as S, vShow as B, createTextVNode as P, reactive as U } from "vue";
import { d as j } from "./vuedraggable.umd-BDlqjyNA.js";
import { _ as F } from "./icon.vue_vue_type_script_setup_true_lang-BKjDMfHm.js";
import { e as y, _ as N } from "./index-DWpaTBDO.js";
import { j as T, p as A } from "./revoke-iScTU0eW.js";
const D = { class: "rule-item-main bg-white m-t-2 p-2 rounded border border-solid border-gray-200 hover:border-primary transition-all relative" }, E = ["title"], M = { class: "epic-attr-input w-0" }, R = ["onClick"], L = /* @__PURE__ */ V({
  name: "SetAddValueOptionItem",
  __name: "optionItem",
  props: {
    modelValue: {},
    fieldOptions: {}
  },
  emits: ["update:modelValue"],
  setup(m, { emit: p }) {
    const i = m, o = y(i, "modelValue", p), u = [
      {
        type: "input",
        label: "当值等于",
        model: "curValue",
        componentProps: { placeholder: "当值等于" }
      },
      {
        type: "select",
        label: "赋值组件",
        model: "influenceCompId",
        componentProps: { options: i.fieldOptions, placeholder: "赋值组件" }
      },
      {
        type: "textarea",
        label: "追加赋值",
        model: "setValue",
        componentProps: { placeholder: "追加赋值" }
      },
      {
        type: "input",
        label: "排序序号",
        model: "sort",
        componentProps: {
          placeholder: "排序序号",
          type: "number"
        }
      }
    ];
    function h(t) {
      o.value = o.value.filter((r, e) => e !== t);
    }
    return (t, r) => (f(), k(n(j), {
      modelValue: n(o),
      "onUpdate:modelValue": r[0] || (r[0] = (e) => v(o) ? o.value = e : null),
      "item-key": "id",
      "component-data": {
        type: "transition-group"
      },
      group: "option-list",
      handle: ".handle",
      animation: 200
    }, {
      item: b(({ element: e, index: s }) => [
        a("div", D, [
          (f(), g(w, null, C(u, (l, c) => a("div", {
            key: c,
            class: "flex m-t-2 first:m-0"
          }, [
            a("div", {
              class: "epic-attr-label flex-shrink-0",
              title: l.label
            }, $(l.label), 9, E),
            a("div", M, [
              d(n(N), {
                modelValue: e[l.model],
                "onUpdate:modelValue": (x) => e[l.model] = x,
                componentSchema: { ...l, noFormItem: !0 }
              }, null, 8, ["modelValue", "onUpdate:modelValue", "componentSchema"])
            ])
          ])), 64)),
          a("div", {
            class: "rule-btn-delete absolute top-0 right-0 transition-all w-24px h-24px cursor-pointer rounded-bl-2 flex justify-center items-center color-white",
            onClick: (l) => h(s)
          }, [
            d(n(F), { name: "icon-shanchu1" })
          ], 8, R)
        ])
      ]),
      _: 1
    }, 8, ["modelValue"]));
  }
}), q = { class: "" }, z = { class: "py-4 my-2 text-center text-gray-400 bg-white" }, W = /* @__PURE__ */ V({
  __name: "index",
  props: {
    modelValue: { default: () => [] },
    textType: { default: () => ["input", "textarea"] }
  },
  emits: ["update:modelValue"],
  setup(m, { emit: p }) {
    const i = m, _ = I("pageSchema"), o = O(() => T(_.schemas).filter((e) => i.textType.includes(e.type)).map((e) => ({ label: `${e.label}(${e.field})`, value: e.id })).reverse()), u = A.getComponent("button"), t = y(i, "modelValue", p);
    function r() {
      const e = U({
        curValue: "",
        influenceCompId: "",
        setValue: ""
      });
      t.value = [...t.value, e];
    }
    return (e, s) => {
      var l;
      return f(), g("div", q, [
        S(a("div", z, "暂无选项", 512), [
          [B, !((l = n(t)) != null && l.length)]
        ]),
        d(L, {
          modelValue: n(t),
          "onUpdate:modelValue": s[0] || (s[0] = (c) => v(t) ? t.value = c : null),
          fieldOptions: o.value
        }, null, 8, ["modelValue", "fieldOptions"]),
        d(n(u), {
          class: "m-t-2",
          onClick: r
        }, {
          default: b(() => [
            P("添加追加值")
          ]),
          _: 1
        })
      ]);
    };
  }
});
export {
  W as default
};