epic-designer
Version:
基于vue3的设计器,可视化开发页面表单
82 lines (81 loc) • 2.46 kB
JavaScript
import { defineComponent as y, computed as s, createElementBlock as p, openBlock as l, Fragment as d, renderList as u, createVNode as f } from "vue";
/* empty css */
/* empty css */
/* empty css */
import { pluginManager as g } from "../../../../../manager/src/pluginManager.js";
/* 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 { useDesignerContext as _ } from "../../../../../hooks/src/designer/useDesignerContext.js";
import v from "../attribute/modules/attributeItem.vue.js";
const F = /* @__PURE__ */ y({
__name: "style",
setup(b) {
const i = _(), c = g.component.getComponentConfigs(), t = s(() => i.state.selectedNode), a = [
{
field: "props.style.width",
label: "宽度",
type: "EInputSize"
},
{
field: "props.style.height",
label: "高度",
type: "EInputSize"
},
{
field: "props.style.padding",
label: "内边距",
type: "EInputSize"
},
{
field: "props.style.margin",
label: "外边距",
type: "EInputSize"
},
{
field: "props.style.backgroundColor",
label: "背景色",
props: {
style: {
// width: '60px'
},
type: "color"
},
type: "color-picker"
},
{
field: "props.style.color",
label: "字体颜色",
props: {
style: {},
type: "color"
},
type: "color-picker"
}
], m = s(() => {
var o, e;
if (!t.value || !t.value.type)
return [];
const r = ((e = (o = c[t.value.type]) == null ? void 0 : o.config) == null ? void 0 : e.style) ?? [];
return [...a, ...r];
});
return (r, o) => {
var e;
return l(), p("div", {
key: (e = t.value) == null ? void 0 : e.id,
class: "epic-style-view"
}, [
(l(!0), p(d, null, u(m.value, (n) => (l(), p("div", {
key: n.field
}, [
f(v, { schema: n }, null, 8, ["schema"])
]))), 128))
]);
};
}
});
export {
F as default
};