@coderlt/form-designer/dist/index-ce119ede.js

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

import { defineComponent as x, ref as n, watch as o, nextTick as b, openBlock as c, createBlock as g, unref as p, withCtx as w, createVNode as U } from "vue";
import { p as v } from "./index-74b7090f.js";
const k = /* @__PURE__ */ x({
  __name: "index",
  props: {
    modelValue: {
      type: String,
      default: null
    }
  },
  emits: ["update:modelValue"],
  setup(m, { emit: r }) {
    const i = m, d = v.getComponent("input"), s = v.getComponent("select"), l = n(null), a = n("px"), f = [
      { label: "px", value: "px" },
      { label: "%", value: "%" },
      { label: "vw", value: "vw" },
      { label: "vh", value: "vh" },
      { label: "rem", value: "rem" },
      { label: "em", value: "em" },
      { label: "pt", value: "pt" }
    ];
    o(() => i.modelValue, (t) => {
      const e = parseFloat(t);
      if (!e)
        return l.value = null, !1;
      l.value = String(e), a.value = t.substring(l.value.length);
    }, {
      immediate: !0
    }), o(() => a.value + l.value, () => {
      V();
    });
    function V() {
      b(() => r("update:modelValue", l.value ? l.value + a.value : void 0));
    }
    return (t, e) => (c(), g(p(d), {
      class: "epic-input-size",
      modelValue: l.value,
      "onUpdate:modelValue": e[2] || (e[2] = (u) => l.value = u),
      value: l.value,
      "onUpdate:value": e[3] || (e[3] = (u) => l.value = u),
      type: "number",
      min: "0",
      placeholder: "请输入"
    }, {
      suffix: w(() => [
        U(p(s), {
          value: a.value,
          "onUpdate:value": e[0] || (e[0] = (u) => a.value = u),
          modelValue: a.value,
          "onUpdate:modelValue": e[1] || (e[1] = (u) => a.value = u),
          style: { width: "68px" },
          options: f
        }, null, 8, ["value", "modelValue"])
      ]),
      _: 1
    }, 8, ["modelValue", "value"]));
  }
});
export {
  k as default
};