snowy-designer
Version:
基于Epic-Designer-Pro版本的设计器,可视化开发页面表单
119 lines (118 loc) • 4.68 kB
JavaScript
import { defineComponent as R, inject as v, computed as g, provide as d, watchEffect as V, createElementBlock as h, openBlock as p, createElementVNode as m, createCommentVNode as w, createVNode as N, unref as l, createTextVNode as I, toDisplayString as k, Fragment as J, renderList as M, createBlock as z } from "vue";
/* empty css */
import A 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 { useClipboard as j } from "@vueuse/core";
import "../../../../base-ui/src/shadch-ui/toast/index.js";
import "../../../../../hooks/src/store/index.js";
import "lodash";
import { pluginManager as y } from "../../../../../utils/src/manager/pluginManager.js";
import "monaco-editor";
import "../../../../../utils/src/request/index.js";
import "vuedraggable";
import { useDataModal as F } from "../dataModal/index.js";
import L from "../dataModal/index.vue.js";
import q from "./modules/attributeItem.vue.js";
const G = { class: "epic-attr-item mb-2 flex h-8 cursor-pointer items-center px-4" }, H = {
key: 0,
class: "epic-attr-item mb-2 flex h-8 cursor-pointer items-center px-4"
}, K = { class: "bg-$epic-gray-3 rounded-1 h-full flex-1 px-2 leading-8" }, me = /* @__PURE__ */ R({
__name: "index",
setup(O) {
const s = v("designer"), u = v("pageSchema"), o = v("designerProps"), C = y.getComponentConfings(), c = g(() => s.state.selectedNode), f = g(() => {
var a, i, r;
let n = (a = o == null ? void 0 : o.value.tableJson) == null ? void 0 : a.find(
(t) => t.tableType === "parent"
);
const e = [...s.state.matched].slice(0, -1).reverse().find((t) => t.type === "subform");
return n = e ? (i = o == null ? void 0 : o.value.tableJson) == null ? void 0 : i.find(
(t) => (t == null ? void 0 : t.tableName) === e.field
) : (r = o == null ? void 0 : o.value.tableJson) == null ? void 0 : r.find(
(t) => t.tableType === "parent"
), n;
});
d("dataTable", f);
const _ = g(() => {
var a, i, r;
if (!c.value || !c.value.type)
return [];
const e = [
// {
// label: '组件ID',
// type: 'input',
// field: 'id',
// componentProps: {
// disabled: true
// }
// },
...((i = (a = C[c.value.type]) == null ? void 0 : a.config) == null ? void 0 : i.attribute) ?? []
];
return c.value.id === ((r = u.schemas[0]) == null ? void 0 : r.id) && e.push(
{
editData: u,
field: "canvas.width",
label: "画布宽度",
type: "EInputSize"
},
{
editData: u,
field: "canvas.height",
label: "画布高度",
type: "EInputSize"
}
), e;
});
d("componentAttributes", _), d("handleDataConfig", E), d("removeBind", B);
const { copied: S, copy: $ } = j();
V(() => {
S.value && y.global.$message.success("复制成功");
});
const { openModal: D, register: T } = F();
function B(n) {
const e = c.value;
!e || !e.dataSource || (e.dataSource = e.dataSource.filter((a) => a.field !== n.field));
}
function E(n) {
D(n);
}
return (n, e) => {
var a, i, r, t;
return p(), h("div", {
key: (a = c.value) == null ? void 0 : a.id,
class: "epic-attribute-view"
}, [
m("div", G, [
m("div", {
class: "bg-$epic-gray-3 rounded-1 h-full flex-1 px-2 leading-8",
onClick: e[0] || (e[0] = (b) => {
var x;
return l($)(((x = l(s).state.selectedNode) == null ? void 0 : x.id) ?? "");
})
}, [
N(l(A), {
class: "epic-component-icon translate-y-2px mr-1",
name: l(y).getIcon(l(s).state.selectedNode.type)
}, null, 8, ["name"]),
I(" " + k((i = l(s).state.selectedNode) == null ? void 0 : i.id), 1)
])
]),
(r = f.value) != null && r.tableRemark && ((t = l(s).state.selectedNode) != null && t.input) ? (p(), h("div", H, [
e[1] || (e[1] = m("div", { class: "epic-attr-label" }, "数据表", -1)),
m("div", K, k(f.value.tableRemark), 1)
])) : w("", !0),
(p(!0), h(J, null, M(_.value, (b) => (p(), z(q, {
key: b.field,
"node-schema": b
}, null, 8, ["node-schema"]))), 128)),
N(L, { onRegister: l(T) }, null, 8, ["onRegister"])
]);
};
}
});
export {
me as default
};