epic-designer
Version:
基于vue3的设计器,可视化开发页面表单
82 lines (81 loc) • 2.67 kB
JavaScript
import { defineComponent as c, ref as n, watch as p, nextTick as g, createBlock as w, openBlock as N, unref as r, withCtx as U, createVNode as y } from "vue";
/* empty css */
/* empty css */
/* empty css */
/* empty css */
import "vue-draggable-plus";
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";
import { pluginManager as m } from "../../../../../manager/src/pluginManager.js";
const $ = /* @__PURE__ */ c({
__name: "index",
props: {
modelValue: {}
},
emits: ["update:modelValue"],
setup(i, { emit: v }) {
const d = i, s = v, f = m.component.get("input"), x = m.component.get("select"), e = n(null), u = n("px"), b = [
{ 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" }
];
p(
() => d.modelValue,
(a) => {
if (!a) return;
if (typeof a == "number") {
e.value = String(a), u.value = "px";
return;
}
const l = Number.parseFloat(a);
if (Number.isNaN(l))
return e.value = null, !1;
const t = /^(\d+(\.\d+)?)(px|%|vw|vh|rem|em|pt)$/, o = a.trim().match(t);
e.value = (o == null ? void 0 : o[1]) ?? null, u.value = (o == null ? void 0 : o[3]) ?? "";
},
{
immediate: !0
}
), p(
() => u.value + e.value,
() => {
V();
}
);
function V() {
g(
() => s("update:modelValue", e.value ? e.value + u.value : void 0)
);
}
return (a, l) => (N(), w(r(f), {
modelValue: e.value,
"onUpdate:modelValue": l[2] || (l[2] = (t) => e.value = t),
value: e.value,
"onUpdate:value": l[3] || (l[3] = (t) => e.value = t),
class: "ep-input-size",
type: "number",
min: "0",
placeholder: "请输入"
}, {
suffix: U(() => [
y(r(x), {
value: u.value,
"onUpdate:value": l[0] || (l[0] = (t) => u.value = t),
modelValue: u.value,
"onUpdate:modelValue": l[1] || (l[1] = (t) => u.value = t),
style: { width: "60px" },
options: b
}, null, 8, ["value", "modelValue"])
]),
_: 1
}, 8, ["modelValue", "value"]));
}
});
export {
$ as default
};