snowy-designer
Version:
基于Epic-Designer-Pro版本的设计器,可视化开发页面表单
111 lines (110 loc) • 3.95 kB
JavaScript
import { defineComponent as k, inject as b, resolveComponent as E, createBlock as v, openBlock as u, unref as t, isRef as I, withCtx as y, createElementVNode as V, createElementBlock as O, createCommentVNode as h, normalizeClass as $, createVNode as d } from "vue";
/* empty css */
import r from "../../../../base-ui/src/components/icon/icon.vue.js";
import "radix-vue";
import "clsx";
import "tailwind-merge";
import "lucide-vue-next";
import "../../../../base-ui/src/shadch-ui/button/index.js";
import { useVModel as B } from "@vueuse/core";
import "../../../../base-ui/src/shadch-ui/toast/index.js";
import "../../../../../hooks/src/store/index.js";
import "lodash";
import { pluginManager as N } from "../../../../../utils/src/manager/pluginManager.js";
import "monaco-editor";
import "../../../../../utils/src/request/index.js";
import M from "vuedraggable";
const R = {
key: 0,
class: "pl-4"
}, W = /* @__PURE__ */ k({
name: "EOptionItem",
__name: "optionItem",
props: {
modelValue: {}
},
emits: ["update:modelValue"],
setup(_, { emit: f }) {
const g = _, i = f, p = N.getComponent("input"), c = b("tree", !1), a = B(g, "modelValue", i);
function x(o) {
const n = {
label: null,
value: null
};
o.children ? o.children.push(n) : o.children = [n];
}
function s() {
i("update:modelValue", a.value);
}
function C(o) {
a.value = a.value.filter((n, m) => m !== o);
}
return (o, n) => {
const m = E("EOptionItem");
return u(), v(t(M), {
modelValue: t(a),
"onUpdate:modelValue": n[0] || (n[0] = (e) => I(a) ? a.value = e : null),
"item-key": "id",
"component-data": {
type: "transition-group"
},
group: "option-list",
handle: ".handle",
animation: 200
}, {
item: y(({ element: e, index: U }) => [
V("div", null, [
V("div", {
class: $([
t(c) ? "grid-cols-[16px_auto_auto_16px_16px]" : "grid-cols-[16px_auto_auto_16px]",
"option-item text-$epic-text-medium mb-2 grid items-center gap-2"
])
}, [
d(t(r), {
class: "handle mr-2 cursor-move text-lg",
name: "icon--epic--drag"
}),
d(t(p), {
modelValue: e.label,
"onUpdate:modelValue": (l) => e.label = l,
value: e.label,
"onUpdate:value": (l) => e.label = l,
placeholder: "label",
onChange: s
}, null, 8, ["modelValue", "onUpdate:modelValue", "value", "onUpdate:value"]),
d(t(p), {
modelValue: e.value,
"onUpdate:modelValue": (l) => e.value = l,
value: e.value,
"onUpdate:value": (l) => e.value = l,
placeholder: "value",
onChange: s
}, null, 8, ["modelValue", "onUpdate:modelValue", "value", "onUpdate:value"]),
t(c) ? (u(), v(t(r), {
key: 0,
class: "cursor-pointer text-lg",
name: "icon--epic--add-rounded",
onClick: (l) => x(e)
}, null, 8, ["onClick"])) : h("", !0),
d(t(r), {
class: "hover:text-red cursor-pointer text-lg",
name: "icon--epic--delete-outline-rounded",
onClick: (l) => C(U)
}, null, 8, ["onClick"])
], 2),
e.children ? (u(), O("div", R, [
d(m, {
modelValue: e.children,
"onUpdate:modelValue": (l) => e.children = l
}, null, 8, ["modelValue", "onUpdate:modelValue"])
])) : h("", !0)
])
]),
_: 1
}, 8, ["modelValue"]);
};
}
});
export {
W as default
};