snowy-designer
Version:
基于Epic-Designer-Pro版本的设计器,可视化开发页面表单
143 lines (142 loc) • 4.94 kB
JavaScript
import { defineComponent as S, ref as g, inject as V, reactive as O, provide as R, watch as z, createElementBlock as p, openBlock as c, createElementVNode as n, withDirectives as D, createVNode as l, toDisplayString as d, unref as r, withCtx as F, createTextVNode as v, Fragment as T, renderList as U, normalizeClass as q, createCommentVNode as G, withModifiers as w, vShow as H } from "vue";
/* empty css */
import h 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 "@vueuse/core";
import "../../../../base-ui/src/shadch-ui/toast/index.js";
import J from "../../../../base-ui/src/components/empty/empty.vue.js";
import { deepCompareAndModify as A } from "../../../../../utils/src/common/data.js";
import "../../../../../hooks/src/store/index.js";
import "lodash";
import { pluginManager as K } from "../../../../../utils/src/manager/pluginManager.js";
import "monaco-editor";
import "../../../../../utils/src/request/index.js";
import "vuedraggable";
import P from "./apiEditModal.vue.js";
const Q = { class: "epic-data-source-main p-2" }, W = { class: "pb-2" }, X = ["onClick"], Y = { class: "w-0px flex-1 pr-1" }, Z = { class: "truncate" }, ee = { class: "truncate" }, oe = { class: "bg-green-4 color-white rounded px-2" }, te = ["onClick"], ie = ["onClick"], ye = /* @__PURE__ */ S({
__name: "index",
props: {
selectable: { type: Boolean }
},
emits: ["clickItem"],
setup($, { expose: L, emit: E }) {
var x;
const _ = $, I = E, M = (x = K) == null ? void 0 : x.getComponent("button"), C = g(), s = V("pageSchema"), u = g(null), b = g(null), t = O({
apis: [],
autoLoad: !0
});
R("globalApiConfig", t), z(
() => s.globalApiConfig,
(e) => {
e && A(t, e);
},
{
deep: !0,
immediate: !0
}
);
function m(e, o = null) {
var i;
u.value = o, (i = C.value) == null || i.handleOpen(e);
}
function k(e, o = null) {
if (_.selectable) {
b.value = e.id, I("clickItem", e, o);
return;
}
m(e, o);
}
function j(e) {
u.value === null ? t.apis.push(e) : t.apis[u.value] = e, f();
}
function B(e) {
t.apis = t.apis.filter(
(o, i) => e !== i
), f();
}
function f() {
if (!s.globalApiConfig) {
s.globalApiConfig = t;
return;
}
A(s.globalApiConfig, t);
}
const N = () => {
t.autoLoad = !t.autoLoad, f();
};
return L({
handleClickItem: k
}), (e, o) => (c(), p("div", Q, [
n("div", { onClick: N }, d(t.autoLoad ? "自动" : "不加载"), 1),
n("div", W, [
l(r(M), {
type: "primary",
class: "w-full",
onClick: o[0] || (o[0] = (i) => m())
}, {
default: F(() => [
l(r(h), {
class: "mr-2 cursor-pointer",
name: "icon-tianjia"
}),
o[1] || (o[1] = v(" 新增 "))
]),
_: 1
})
]),
(c(!0), p(T, null, U(t.apis, (i, a) => (c(), p("div", {
key: a,
class: q(["epic-data-source-item group mb-2 flex cursor-pointer items-center rounded p-2 transition-all", { active: b.value === i.id }]),
onClick: (y) => k(i, a)
}, [
n("div", Y, [
n("div", Z, [
o[2] || (o[2] = v(" 名称：")),
n("span", null, d(i.id), 1)
]),
n("div", ee, [
o[3] || (o[3] = v(" 地址：")),
n("span", null, d(i.url), 1)
]),
n("div", null, [
n("span", oe, d(i.method), 1)
])
]),
_.selectable ? (c(), p("div", {
key: 0,
class: "color-white group-hover:bg-#9f7 w-28px h-28px mr-1 flex items-center justify-center rounded-full opacity-0 transition-all group-hover:opacity-100",
onClick: w((y) => m(i, a), ["stop"])
}, [
l(r(h), {
class: "cursor-pointer text-lg",
name: "icon--epic--border-color-outline-rounded"
})
], 8, te)) : G("", !0),
n("div", {
class: "color-white group-hover:bg-#f89 w-28px h-28px flex items-center justify-center rounded-full opacity-0 transition-all group-hover:opacity-100",
onClick: w((y) => B(a), ["stop"])
}, [
l(r(h), {
class: "cursor-pointer text-lg",
name: "icon--epic--delete-outline-rounded"
})
], 8, ie)
], 10, X))), 128)),
D(l(r(J), { description: "暂无数据源" }, null, 512), [
[H, !t.apis.length]
]),
l(P, {
ref_key: "apiEditModalRef",
ref: C,
onAdd: j
}, null, 512)
]));
}
});
export {
ye as default
};