@coderlt/form-designer/dist/index-3d640c3d.js

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

import { defineComponent as h, computed as V, openBlock as a, createElementBlock as l, Fragment as g, renderList as k, createVNode as p, unref as r, createElementVNode as u, createCommentVNode as C } from "vue";
import { p as y, g as U } from "./index-74b7090f.js";
import { _ as P } from "./icon.vue_vue_type_script_setup_true_lang-3f9e4127.js";
const b = {
  key: 0,
  class: "del-btn"
}, E = ["onClick"], B = /* @__PURE__ */ h({
  __name: "index",
  props: {
    modelValue: {
      type: Array,
      default: () => []
    }
  },
  emits: ["update:modelValue"],
  setup(d, { emit: c }) {
    const m = d, i = y.getComponent("number"), o = V({
      get() {
        return m.modelValue;
      },
      set(e) {
        c("update:modelValue", e);
      }
    });
    function v() {
      const e = {
        type: "col",
        children: [],
        componentProps: {
          span: 12
        },
        id: U()
      };
      o.value.push(e);
    }
    function _(e) {
      o.value = o.value.filter((f, n) => e !== n);
    }
    return (e, f) => (a(), l("div", null, [
      (a(!0), l(g, null, k(o.value, (n, s) => (a(), l("div", {
        key: s,
        class: "EColEditor-item"
      }, [
        p(r(i), {
          value: n.componentProps.span,
          "onUpdate:value": (t) => n.componentProps.span = t,
          modelValue: n.componentProps.span,
          "onUpdate:modelValue": (t) => n.componentProps.span = t,
          style: { width: "100%" },
          min: 1,
          max: 24
        }, null, 8, ["value", "onUpdate:value", "modelValue", "onUpdate:modelValue"]),
        o.value.length > 1 ? (a(), l("div", b, [
          u("span", {
            onClick: (t) => _(s)
          }, [
            p(r(P), { name: "icon-shanchu1" })
          ], 8, E)
        ])) : C("", !0)
      ]))), 128)),
      u("div", {
        class: "add-btn",
        onClick: v
      }, " 添加 ")
    ]));
  }
});
export {
  B as default
};