@farris/ui-vue
Version:
Farris Vue, a Farris Design based Vue3 component library.
1,569 lines (1,568 loc) • 48.1 kB
JavaScript
import { ref as y, defineComponent as U, createVNode as r, inject as z, Fragment as Fe, createTextVNode as W, computed as D, reactive as ee, withDirectives as fe, resolveDirective as me, provide as Y, onMounted as be } from "vue";
import { isPlainObject as ve, cloneDeep as N } from "lodash-es";
import { FNotifyService as oe } from "../notify/index.esm.js";
import { FSchemaSelector as Pe } from "../schema-selector/index.esm.js";
import { F_MODAL_SERVICE_TOKEN as ke } from "../modal/index.esm.js";
import { ControllerSchemaRepositorySymbol as Ae, useGuid as Te } from "../common/index.esm.js";
import Re from "../combo-list/index.esm.js";
import Oe from "../event-parameter/index.esm.js";
const ge = {}, we = {};
function te(e) {
const { properties: n, title: l, ignore: o } = e, c = o && Array.isArray(o), i = Object.keys(n).reduce((h, m) => ((!c || !o.find((E) => E === m)) && (h[m] = n[m].type === "object" && n[m].properties ? te(n[m]) : N(n[m].default)), h), {});
if (l && (!c || !o.find((h) => h === "id"))) {
const h = l.toLowerCase().replace(/-/g, "_");
i.id = `${h}_${Math.random().toString().slice(2, 6)}`;
}
return i;
}
function Ve(e) {
const { properties: n, title: l, required: o } = e;
if (o && Array.isArray(o)) {
const c = o.reduce((i, h) => (i[h] = n[h].type === "object" && n[h].properties ? te(n[h]) : N(n[h].default), i), {});
if (l && o.find((i) => i === "id")) {
const i = l.toLowerCase().replace(/-/g, "_");
c.id = `${i}_${Math.random().toString().slice(2, 6)}`;
}
return c;
}
return {
type: l
};
}
function Ce(e, n = {}, l) {
const o = ge[e];
if (o) {
let c = Ve(o);
const i = we[e];
return c = i ? i({ getSchemaByType: Ce }, c, n, l) : c, c;
}
return null;
}
function De(e, n) {
const l = te(n);
return Object.keys(l).reduce((o, c) => (Object.prototype.hasOwnProperty.call(e, c) && (o[c] && ve(o[c]) && ve(e[c] || !e[c]) ? Object.assign(o[c], e[c] || {}) : o[c] = e[c]), o), l), l;
}
function Se(e, n) {
return Object.keys(e).filter((o) => e[o] != null).reduce((o, c) => {
if (n.has(c)) {
const i = n.get(c);
if (typeof i == "string")
o[i] = e[c];
else {
const h = i(c, e[c], e);
Object.assign(o, h);
}
} else
o[c] = e[c];
return o;
}, {});
}
function je(e, n, l = /* @__PURE__ */ new Map()) {
const o = De(e, n);
return Se(o, l);
}
function $e(e = {}) {
function n(u, b, s, t) {
if (typeof s == "number")
return t[u].length === s;
if (typeof s == "object") {
const d = Object.keys(s)[0], p = s[d];
if (d === "not")
return Number(t[u].length) !== Number(p);
if (d === "moreThan")
return Number(t[u].length) >= Number(p);
if (d === "lessThan")
return Number(t[u].length) <= Number(p);
}
return !1;
}
function l(u, b, s, t) {
return t[u] && t[u].propertyValue && String(t[u].propertyValue.value) === String(s);
}
const o = /* @__PURE__ */ new Map([
["length", n],
["getProperty", l]
]);
Object.keys(e).reduce((u, b) => (u.set(b, e[b]), u), o);
function c(u, b) {
const s = u;
return typeof b == "number" ? [{ target: s, operator: "length", param: null, value: Number(b) }] : typeof b == "boolean" ? [{ target: s, operator: "getProperty", param: u, value: !!b }] : typeof b == "object" ? Object.keys(b).map((t) => {
if (t === "length")
return { target: s, operator: "length", param: null, value: b[t] };
const d = t, p = b[t];
return { target: s, operator: "getProperty", param: d, value: p };
}) : [];
}
function i(u) {
return Object.keys(u).reduce((s, t) => {
const d = c(t, u[t]);
return s.push(...d), s;
}, []);
}
function h(u, b) {
if (o.has(u.operator)) {
const s = o.get(u.operator);
return s && s(u.target, u.param, u.value, b) || !1;
}
return !1;
}
function m(u, b) {
return i(u).reduce((d, p) => d && h(p, b), !0);
}
function E(u, b) {
const s = Object.keys(u), t = s.includes("allOf"), d = s.includes("anyOf"), p = t || d, M = (p ? u[p ? t ? "allOf" : "anyOf" : "allOf"] : [u]).map((B) => m(B, b));
return t ? !M.includes(!1) : M.includes(!0);
}
return { parseValueSchema: E };
}
const _e = {}, He = {};
$e();
function qe(e, n, l = /* @__PURE__ */ new Map(), o = (h, m, E, u) => m, c = {}, i = (h) => h) {
return ge[n.title] = n, we[n.title] = o, _e[n.title] = c, He[n.title] = i, (h = {}, m = !0) => {
if (!m)
return Se(h, l);
const E = je(h, n, l), u = Object.keys(e).reduce((b, s) => (b[s] = e[s].default, b), {});
return Object.assign(u, E);
};
}
function ze(e, n) {
return { customClass: n.class, customStyle: n.style };
}
const Ue = /* @__PURE__ */ new Map([
["appearance", ze]
]);
function Ie(e, n, l) {
return n;
}
const Ge = "https://json-schema.org/draft/2020-12/schema", We = "https://farris-design.gitee.io/events-editor.schema.json", Ye = "events-editor", Je = "A Farris Component", Qe = "object", Xe = {
id: {
description: "The unique identifier for events-editor",
type: "string"
},
type: {
description: "The type events of events-editor",
type: "events",
default: "events-editor"
},
initialData: {
description: "",
type: "object",
default: {}
}
}, Ze = [
"id",
"type"
], xe = {
$schema: Ge,
$id: We,
title: Ye,
description: Je,
type: Qe,
properties: Xe,
required: Ze
}, Ke = "events-editor", en = "A Farris Component", nn = "object", on = {}, tn = {
title: Ke,
description: en,
type: nn,
categories: on
}, he = [
{
label: "pageChange",
name: "MockMock切换页码"
},
{
label: "pageSizeChanged",
name: "Mock分页条数变化事件"
},
{
label: "scrollYLoad",
name: "Mock滚动加载事件"
},
{
label: "onEditClicked",
name: "Mock操作列点击编辑"
},
{
label: "onDeleteClicked",
name: "Mock操作列点击删除"
}
], an = {
propertyID: "data-grid-component-viewmodel",
propertyType: "events",
/** 内置构件显示的命令列表 */
internalCommandList: [
{
controllerName: {
id: "70b4abd4-9f2c-4b7c-90e9-6ac6f4b74c72",
label: "ListController",
name: "列表控制器"
},
controllerList: [
{
id: "93ee1cd2-cf0b-40b3-b99f-958a3d1fad1c",
label: "Load",
name: "Mock加载数据",
handlerName: "Load"
},
{
id: "71ae8a4c-6202-4875-9246-2e2d959da37f",
label: "Search",
name: "Mock查询",
handlerName: "Search"
},
{
id: "77556491-41c0-4356-8ccf-25e39817060e",
label: "Add",
name: "Mock添加数据",
handlerName: "Add"
},
{
id: "52fdcac3-46c8-466e-aa5d-19920ece2076",
label: "View",
name: "Mock查看数据",
handlerName: "View"
},
{
id: "7ade9996-0531-4401-b1bc-fb9ec8ee3f8e",
label: "Edit",
name: "Mock编辑数据",
handlerName: "Edit"
},
{
id: "6d5a354f-871f-43e6-82bc-7837184380d3",
label: "RemoveRows",
name: "Mock删除选中行",
handlerName: "RemoveRows"
},
{
id: "1a1b7c33-38f0-469f-a017-223086ee6259",
label: "ChangePage",
name: "Mock切换页码",
handlerName: "ChangePage"
},
{
id: "debae2dd-3387-48cf-90ba-96e74ab5a8e5",
label: "Remove",
name: "Mock删除指定数据",
handlerName: "Remove"
}
]
}
],
/** (事件设定)可绑定事件默认列表; */
events: he,
/** 已绑定的事件（拼接已有的参数值，拼接当前事件->待集成-从dom结构中取值，事件及对应的字符串） */
boundEventsList: [],
/** 视图模型已有命令 */
viewModel: [],
/** 目标组件对应的所有可选的组件 */
componentLists: [
{ componentId: "root-component", viewModelId: "root-viewmodel" },
{ componentId: "data-grid-component", viewModelId: "data-grid-component-viewmodel" }
],
/** 所有组件列表 */
allComponentList: [
{ componentId: "root-component", viewModelId: "root-viewmodel" },
{ componentId: "data-grid-component", viewModelId: "data-grid-component-viewmodel" }
],
/** 初始为空，用于存储用户点击「导入新命令」的控制器值 */
newController: [],
isAddControllerMethod: !1,
getEventList: () => ({ events: he, boundEventsList: [] })
}, ae = {
initialData: { type: Object, default: an }
}, pe = qe(
ae,
xe,
Ue,
Ie,
tn
);
function Ee() {
function e(l, o) {
const c = [
{
controllerId: "45be24f9-c1f7-44f7-b447-fe2ada458a61",
controllerLabel: "AdvancedListCardController",
controllerName: "高级列卡控制器",
commands: [
{
name: "增加子表数据",
id: "250cd2a2-9995-4c01-64aa-5029afba08ca",
handlerName: "AddItem"
},
{
name: "删除子表数据",
id: "a2c06958-29b1-0582-5f3e-c3cfcc741f8f",
handlerName: "RemoveItem"
},
{
name: "插入数据",
id: "3208b00c-543d-c050-3c54-081715972dda",
handlerName: "Insert"
},
{
name: "查询从表数据（分页）",
id: "b60b7754-35cf-7eaa-0f1d-bc5e5d61c0bc",
handlerName: "queryChild"
},
{
name: "批量删除子表",
id: "378fcd7d-ce91-c052-5947-d60ecdb38df9",
handlerName: "batchDelete"
},
{
name: "移动数据",
id: "fcac5d5e-2367-2b61-a82a-f8e874e8efc0",
handlerName: "move"
},
{
name: "打开批量编辑界面",
id: "8d8b05d6-2d22-b0b7-7cb8-51bbb8cd8a18",
handlerName: "openBatchEditDialog"
}
]
},
{
controllerId: "d7ce1ba6-49c7-4a27-805f-f78f42e72725",
controllerLabel: "EditableListController",
controllerName: "可编辑列表控制器",
commands: [
{
name: "打开批量编辑界面",
id: "c3831e36-27d1-1c98-dd60-30e2d7ec04d2",
handlerName: "openBatchEditDialog"
}
]
},
{
controllerId: "8fe977a1-2b32-4f0f-a6b3-2657c4d03574",
controllerLabel: "TreeCardController",
controllerName: "树卡控制器",
commands: [
{
name: "新增子表数据",
id: "21b0c3af-3caf-b11d-2360-d9af20016501",
handlerName: "AddItem"
},
{
name: "删除子表数据",
id: "113f1d77-65a4-63bf-3973-80dd15f294d1",
handlerName: "RemoveItem"
},
{
name: "批量删除子表",
id: "bf13585c-a8f3-384b-356c-bd8bf06751c4",
handlerName: "batchDelete"
}
]
},
{
controllerId: "8d21e69c-70b3-44f6-88b5-fd6a8d3ce11b",
controllerLabel: "PopController",
controllerName: "弹出控制器",
commands: [
{
name: "新增子表数据",
id: "d6933772-8047-9bde-220b-449481883142",
handlerName: "AddItem"
},
{
name: "删除子表数据",
id: "03c233eb-e39e-8e34-6809-ee4ab3a0d97c",
handlerName: "RemoveItem"
},
{
name: "加载并新增",
id: "6882ab4a-9c23-8d59-6aac-de891eae20d2",
handlerName: "LoadAndAdd"
}
]
},
{
controllerId: "43f68561-eae4-4495-b318-d629615523f8",
controllerLabel: "BatchEditCommands",
controlleName: "批量编辑控制器",
commands: [
{
name: "打开批量编辑界面",
id: "a659aaba-daa4-3c07-8b26-164b01726022",
handlerName: "openBatchEditDialog"
},
{
name: "复制行",
id: "d5f67e0a-767d-a238-5ad4-b1285476c16f",
handlerName: "copyRow"
},
{
name: "复制行",
id: "229d2dd3-2fe7-f06a-b705-cfa0fc711614",
handlerName: "clone"
}
]
},
{
controllerId: "c121742e-6028-48bf-817c-1dda7fb098df",
controllerLabel: "AdvancedListCardWithSidebarController",
controllerName: "高级列卡控制器（侧边栏）",
commands: [
{
name: "增加子表数据（侧边栏）",
id: "250cd2a2-9995-4c01-64aa-5029afba08ca",
handlerName: "AddItem"
},
{
name: "删除子表数据（侧边栏）",
id: "a2c06958-29b1-0582-5f3e-c3cfcc741f8f",
handlerName: "RemoveItem"
}
]
},
{
controllerId: "8172a979-2c80-4637-ace7-b13074d3f393",
controllerLabel: "CardController",
controllerName: "卡片控制器",
commands: [
{
name: "新增子表数据",
id: "6f987222-ebe2-0f3c-1594-a12408b22801",
handlerName: "AddItem"
},
{
name: "删除子表数据",
id: "0cdeddcc-8332-f13f-be96-b5eeac84a334",
handlerName: "RemoveItem"
},
{
name: "插入数据",
id: "2666b526-a1b2-f268-1629-b1b95b71c8dd",
handlerName: "Insert"
},
{
name: "打开批量编辑界面",
id: "8104dd8e-bb27-a659-ff7c-a0321523f727",
handlerName: "openBatchEditDialog"
},
{
name: "新增子节点（子表树）",
id: "bbd11957-de2a-c727-11d6-64788c4b0fa8",
handlerName: "addSubChild"
},
{
name: "删除子表树节点",
id: "c8c9f652-ba52-3a9b-5eb9-dadd42c832cd",
handlerName: "RemoveTreeItem"
},
{
name: "批量删除子表",
id: "e96857fa-1617-fd92-8a05-5c684e0819a1",
handlerName: "batchDelete"
}
]
},
{
controllerId: "31c1022c-ab40-4e8d-bc31-85d539f1d36c",
controllerLabel: "FileController",
controllerName: "文件控制器",
commands: [
{
name: "批量删除文件数据",
id: "d5bf021b-1aa4-06fe-3236-188fd218f4f7",
handlerName: "removeFileRows"
}
]
},
{
controllerId: "2eb7bbd1-fabd-4d0f-991d-7242f53225b1",
controllerLabel: "AttachmentController",
controllerName: "附件控制器",
commands: [
{
name: "上传并更新行",
id: "2a84e28f-7202-d858-1466-748a8040c1f9",
handlerName: "UploadAndUpdateRow"
},
{
name: "通过属性名上传并更新行",
id: "0f98c9b8-a01b-55d4-3115-269a73f7ccff",
handlerName: "uploadAndUpdateRowWithPropertyName"
},
{
name: "移除版本附件行",
id: "b441b6a7-9e13-9f75-77a2-10b2c1f7ef26",
handlerName: "RemoveAttachmentItem"
}
]
}
];
let i = -1;
const h = c.findIndex((m) => l === m.controllerId);
return h !== -1 && (i = c[h].commands.findIndex((m) => o === m.handlerName)), i !== -1;
}
function n(l, o, c) {
const i = e(l.controllerName.id, o.handlerName);
return c.componentLists.length !== 0 && i && (o.hasPath = !0, o.targetComponent = o.targetComponent || c.componentLists[0].componentId, o.componentLists = N(c.componentLists)), o;
}
return { isContextDependent: e, setComponentLists: n };
}
function Ne(e, n) {
const l = y([]), { boundEvents: o, unBoundEvent: c } = n;
function i(s) {
return {
/** 当前事件名称及label */
event: {
label: s.boundEvents.label,
name: s.boundEvents.name
},
/** 控制组件的展示及顺序:
* 0：事件下拉框
* 1：事件名称
* 2：来源+方法列表
* 3：方法名
* 4：方法参数*/
showSwitch: [{
// 存储所有的展示设定
showSection: [[!1, !1, !1, !1, !1], [!1, !1, !0, !1, !1], [!1, !0, !1, !0, !1]],
// 展示哪个部分
showSwitchNumber: 2
}],
/** 方法列表 */
command: N(s.command),
/** 当前的控制器 */
controller: N(s.controller)
};
}
function h() {
var s;
l.value = (s = o.value) == null ? void 0 : s.map((t) => i(t));
}
function m(s) {
const d = i({
boundEvents: s,
command: null,
controller: { id: "", name: "", label: "" }
});
d.showSwitch[0].showSwitchNumber = 1, d.showSwitch[0].showSection[2][3] = !0, l.value.unshift(d);
}
function E() {
var s;
(s = l.value) == null || s.forEach((t) => {
t.showSwitch.forEach((d) => {
d.showSection[2][3] = !1;
});
});
}
function u(s) {
l.value[s].showSwitch.forEach((t) => {
t.showSection[2][3] = !t.showSection[2][3];
});
}
function b(s) {
if (s >= 0 && s <= l.value.length - 1) {
const t = l.value[s];
c(t.event), l.value.splice(s, 1);
}
}
return {
addNewInteraction: m,
collapseInteractions: E,
deleteInteracton: b,
toggleMethodInInteraction: u,
interactions: l,
loadInteractions: h
};
}
function Me(e) {
const n = y([]), l = y([]), o = y([]), { isContextDependent: c } = Ee();
function i() {
const { allComponentList: t } = e.value;
e.value.componentLists.length && e.value.viewModel && e.value.viewModel.forEach((d) => {
d.controllerList.forEach((p) => {
if (p.targetComponent) {
const w = t.find((M) => M.componentId === p.targetComponent);
if ((w ? w.viewModelId : void 0) === e.value.viewModelId)
p.hasPath = !1;
else {
const M = c(d.controllerName.id, p.handlerName);
p.hasPath = M ? !0 : p.hasPath, p.componentLists = M ? N(e.value.componentLists) : p.componentLists;
}
}
});
}), e.value.componentLists.length && e.value.boundEventsList && e.value.boundEventsList.forEach((d) => {
var p;
if ((p = d.command) != null && p.targetComponent) {
const w = t.find(
(M) => {
var T;
return M.componentId === (((T = d.command) == null ? void 0 : T.targetComponent) || "");
}
);
if ((w ? w.viewModelId : void 0) === e.value.viewModelId)
d.command.hasPath = !1;
else {
const M = c(
d.controller.id,
d.command.handlerName
);
d.command.hasPath = M ? !0 : d.command.hasPath, d.command.componentLists = M ? N(e.value.componentLists) : d.command.componentLists;
}
}
});
}
function h() {
const t = l.value.reduce(
(p, w) => (p.set(w.boundEvents.label, !0), p),
/* @__PURE__ */ new Map()
);
return n.value.filter((p) => !t.has(p.label));
}
function m() {
var d;
const t = ((d = l.value) == null ? void 0 : d.length) > 0;
o.value = t ? h() : n.value;
}
function E() {
i(), n.value = e.value.events, l.value = e.value.boundEventsList, m();
}
function u(t) {
o.value = o.value.filter((d) => d.label !== t.label);
}
function b(t) {
l.value = l.value.filter((d) => d.boundEvents.label !== t.label), m();
}
function s() {
var p;
const t = (p = e.value) == null ? void 0 : p.getEventList(), { events: d } = t;
t && (e.value.events = N(d), e.value.boundEventsList = t.boundEventsList), e.value.boundEventsList && (e.value.boundEventsList = e.value.boundEventsList.filter(function(w) {
return d.find((k) => k.label === w.boundEvents.label);
}));
}
return {
allEvents: n,
boundEvents: l,
candidateEvents: o,
excludeFromCandidates: u,
loadEvents: E,
resetBoundEvents: s,
unBoundEvent: b
};
}
const rn = {}, ln = {
events: { type: Array, default: [] }
}, cn = /* @__PURE__ */ U({
name: "FEventList",
props: ln,
emits: ["click"],
setup(e, n) {
const l = y(e.events);
function o(i) {
n.emit("click", i);
}
function c(i) {
return r("div", {
class: "f-page-events-editor-first-bound-event"
}, [r("div", {
onClick: () => o(i),
class: "f-page-events-editor-first-bound-event-name"
}, [i.name])]);
}
return () => r("div", {
class: "f-page-events-editor-events"
}, [l.value.map((i) => c(i))]);
}
}), Le = /* @__PURE__ */ U({
name: "FInteractionButton",
props: rn,
emits: ["click"],
setup(e, n) {
const l = new oe(), o = z("useEventsComposition"), c = z("useInteractionCompostion"), {
candidateEvents: i
} = o, {
collapseInteractions: h
} = c, m = y(!1);
function E(t) {
i.value = i.value.filter((d) => d.label !== t.label);
}
function u(t = !1) {
m.value = t;
}
function b(t) {
u(), E(t), n.emit("click", t);
}
function s() {
if (i.value.length === 0) {
l.info({
position: "top-center",
message: "事件已全部绑定"
});
return;
}
h(), u(!m.value);
}
return () => r(Fe, null, [r("div", {
class: "f-page-events-editor-top-button"
}, [r("button", {
class: "f-page-events-editor-button",
onClick: s
}, [r("span", {
class: "f-page-events-editor-text"
}, [W("新建交互事件")])])]), m.value && r(cn, {
events: i.value,
onClick: b
}, null)]);
}
}), sn = {
collapsed: { type: Boolean, default: !0 },
displayOrder: { type: Number, default: -1 },
interaction: { type: Object, default: {} },
controllers: { type: Array, default: [] }
}, dn = {
/** 判断是否为新引入的方法 */
newImport: { Type: Boolean, default: !1 },
/** 新增的内置构件列表 */
addInternalCommandList: { Type: Array, default: [] },
/** 外层传入数据 */
outerLayerValue: { Type: Number, default: 0 },
/** 判断是否为：点击“导入此方法”后，绑定了新增值 */
exit: { Type: Number, default: -1 },
/** 接收是否显示「可选择方法」功能 */
haveBoundcommand: { Type: Boolean, default: !1 },
controllers: { type: Array, default: [] }
}, un = {
controllers: { type: Array, default: [] }
}, fn = /* @__PURE__ */ U({
name: "FCommandList",
props: un,
emits: ["selectMethod"],
setup(e, n) {
function l(m) {
return m.controllerList.length !== 0;
}
function o(m) {
return l(m) && r("div", {
class: "f-page-internals-controller"
}, [r("div", {
class: "f-page-internals-controller-name",
title: m.controllerName.name
}, [m.controllerName.name])]);
}
function c(m, E) {
n.emit("selectMethod", {
method: m,
controller: E
});
}
function i(m) {
return m.controllerList.map((E) => r("div", {
class: "f-page-internals-command",
onClick: () => c(E, m)
}, [r("div", {
class: "f-page-internals-command-name",
title: E.label
}, [E.name])]));
}
function h(m) {
return r("div", null, [o(m), i(m)]);
}
return () => r("div", {
class: "f-page-internals"
}, [e.controllers.map((m) => h(m))]);
}
}), mn = /* @__PURE__ */ U({
name: "FCommandSource",
props: dn,
emits: ["addInternalCommandListChanged", "newImportChanged", "currentCommandChanged", "originalDataChanged", "click", "existChanged", "newFunctionChanged", "close", "selectMethod"],
setup(e, n) {
const l = z("useMethodsComposition"), o = z("useFormCommand"), c = new oe(), {
checkIfNewControllerExists: i,
addNewController: h
} = l, m = y(!1), E = y(e.canAddNewMethod), u = y(e.controllers), b = D(() => !E.value), s = D(() => m.value), t = D(() => ({
"font-size": "15px",
margin: "5px",
color: "#226eff",
flex: "1 1 0"
})), d = z("useFormSchema"), p = z(ke);
let w;
function k(R, a, S) {
if (h(R), R.Commands) {
const A = o.getInternalControllerFromControllerMetadata(R, a, S);
i(A) && c.info({
position: "top-center",
message: "该控制器已存在"
});
}
}
async function M(R) {
o.getSupportedControllerMetadata(R).then((a) => {
a && k(a.controller, a.code, a.nameSpace);
}).finally(() => {
w && w.destroy && w.destroy();
});
}
function T(R) {
w && w.destroy && w.destroy();
}
function B() {
const R = {
formBasicInfo: d == null ? void 0 : d.getFormMetadataBasicInfo()
};
return r(Pe, {
injectSymbolToken: Ae,
"view-type": "NavList",
editorParams: R,
showFooter: !0,
onCancel: T,
onSubmit: M
}, null);
}
function L() {
w = p.open({
title: "选择控制器",
width: 950,
render: B,
showButtons: !1
});
}
function P() {
n.emit("newFunctionChanged");
}
function v() {
}
function f() {
n.emit("close", null);
}
function g() {
return r("div", {
class: "f-command-breakline"
}, [W("------------------------------------------------------------")]);
}
function C() {
return r("div", {
class: "f-page-internals-new-command"
}, [r("div", {
class: "f-page-internals-new-command-func1"
}, [r("div", {
class: "f-icon f-icon-panel-retraction",
style: t.value
}, null), r("div", {
class: "f-function-class",
onClick: () => L()
}, [W("引入控制器")])]), b.value && r("div", {
class: "f-page-internals-new-command-func2"
}, [r("div", {
class: "f-icon f-icon-new-edit",
style: t.value
}, null), r("div", {
class: "f-function-class",
onClick: () => P()
}, [W("添加新方法")])]), s.value && void 0]);
}
function F(R) {
n.emit("selectMethod", R);
}
function O() {
return r("div", {
class: "f-page-command-source-choice"
}, [r(fn, {
controllers: u.value,
onSelectMethod: F
}, null)]);
}
return () => r("div", {
class: "f-page-events-editor-command-source"
}, [O(), g(), C(), g(), r("div", null, [r("div", {
class: "f-page-internals-close",
onClick: f
}, [W("取消")])])]);
}
}), vn = {
command: { type: Object, default: {} },
showParameter: { type: Boolean, default: !1 }
}, hn = /* @__PURE__ */ U({
name: "FParameterEditor",
props: vn,
emits: ["confirm", "change", "targetChange"],
setup(e, n) {
const l = new oe(), o = y(N(e.command)), c = y(0), i = D(() => o.value.id === "abandoned"), h = D(() => o.value.id === "deleted"), m = D(() => o.value !== null), E = D(() => o.value.id !== "abandoned" && o.value.id !== "deleted"), u = y(e.showParameter);
function b() {
const {
targetComponent: a
} = o.value;
let S = "";
return o.value.componentLists && o.value.componentLists.forEach((A) => {
if (A.componentId === a) {
S = A.viewModelId;
return;
}
}), S;
}
const s = y(b());
function t() {
l.info({
position: "top-center",
message: "方法已被移除，请重新绑定"
});
}
function d() {
return r("div", null, [r("div", {
title: "方法已被移除，请重新绑定",
class: "f-icon f-icon-flowline-warning text-danger text-center ",
style: "font-size: 13px;margin-right:10px;width: 30px;height: 20px;",
onClick: () => t()
}, null)]);
}
function p() {
l.info({
position: "top-center",
message: "方法已失效，请重新绑定"
});
}
function w() {
return r("div", null, [r("div", {
title: "'方法已被删除，请绑定其他方法'",
class: "f-icon f-icon-flowline-warning text-danger text-center ",
style: "font-size: 13px;margin-right:10px;width: 30px;height: 20px;",
onClick: () => p()
}, null)]);
}
function k(a) {
u.value = !u.value;
}
function M() {
return r("div", null, [r("div", {
class: "f-icon f-icon-edit-button",
style: "font-size: 13px;margin-right:10px;",
onClick: () => k(c.value)
}, null)]);
}
const T = D(() => o.value.componentLists && o.value.hasPath);
function B(a, S) {
o.value.targetComponent = a[0].componentId, n.emit("targetChange", o.value);
}
function L() {
const a = ee({
content: "将此方法添加到指定的组件",
placement: "top"
});
return r("div", null, [r("div", {
class: "f-page-parameter-editor-targetComponent"
}, [r("div", {
class: "f-page-parameter-editor-targetComponent-topic"
}, [W("挂载到目标组件"), fe(r("span", {
class: "farris-label-tips ml-2"
}, [r("i", {
class: "f-icon f-icon-description-tips"
}, null)]), [[me("tooltip"), a]])]), r("div", {
class: "f-page-parameter-editor-targetComponent-dropdown"
}, [r(Re, {
modelValue: s.value,
"onUpdate:modelValue": (S) => s.value = S,
enableClear: !1,
idField: "viewModelId",
valueField: "viewModelId",
textField: "componentId",
data: o.value.componentLists,
editable: !1,
onChange: B
}, null)])])]);
}
function P(a, S) {
S.value = a;
}
function v() {
n.emit("change", o.value);
}
function f(a) {
var I, j, _, H, Q, X, Z, G, x, K, q, re, le, ce, se, ie, de, ue;
a.context.generalData;
const S = ee(a.context.data), {
assembleSchemaFieldsByComponent: A,
assembleOutline: V,
assembleStateVariables: $
} = a.context.generalData;
return r(Oe, {
modelValue: a.value,
"onUpdate:modelValue": (J) => a.value = J,
data: S,
fieldData: A(),
formData: V(),
varData: $(),
editorType: ((j = (I = a == null ? void 0 : a.origin) == null ? void 0 : I.controlSource) == null ? void 0 : j.type) || "Default",
idField: ((X = (Q = (H = (_ = a == null ? void 0 : a.origin) == null ? void 0 : _.controlSource) == null ? void 0 : H.context) == null ? void 0 : Q.valueField) == null ? void 0 : X.value) || ((K = (x = (G = (Z = a == null ? void 0 : a.origin) == null ? void 0 : Z.controlSource) == null ? void 0 : G.context) == null ? void 0 : x.idField) == null ? void 0 : K.value) || "id",
textField: ((ce = (le = (re = (q = a == null ? void 0 : a.origin) == null ? void 0 : q.controlSource) == null ? void 0 : re.context) == null ? void 0 : le.textField) == null ? void 0 : ce.value) || "label",
editable: (ue = (de = (ie = (se = a == null ? void 0 : a.origin) == null ? void 0 : se.controlSource) == null ? void 0 : ie.context) == null ? void 0 : de.editable) == null ? void 0 : ue.value,
onConfirm: (J) => {
P(J, a), v();
},
onValueChange: (J) => {
P(J, a), v();
}
}, null);
}
function g() {
var a;
return (a = o.value.property) == null ? void 0 : a.map((S, A) => {
const V = ee({
content: S.description,
placement: "top"
});
return r("div", {
key: S.name + A
}, [r("div", {
class: "f-page-parameter-editor-row1"
}, [r("div", {
class: "f-page-parameter-editor-parameter-name"
}, [S.shownName, S.description && fe(r("div", {
class: "ml-2 farris-label-tips"
}, [r("i", {
class: "f-icon f-icon-description-tips"
}, null)]), [[me("tooltip"), V]])])]), r("div", {
class: "f-page-parameter-editor-row2"
}, [f(S)])]);
});
}
function C(a) {
u.value = !1, n.emit("confirm");
}
function F() {
return r("div", null, [r("div", {
class: "f-page-parameter-editor-btn"
}, [r("div", {
class: "btn-finish",
onClick: () => C(c.value)
}, [W("完成")])])]);
}
function O() {
return r("div", {
class: "f-page-parameter-editor-group"
}, [T.value && L(), g()]);
}
function R() {
return r("div", null, [r("div", {
class: "f-page-parameter-editor-first-row"
}, [r("span", {
class: "f-page-parameter-editor-command-name",
title: o.value.label
}, [o.value.name]), r("div", {
class: "f-page-parameter-editor-first-row-icon"
}, [i.value && d(), h.value && w(), E.value && M()])]), u.value && O(), u.value && F()]);
}
return () => r("div", {
class: "f-page-parameter-editor"
}, [m.value && R()]);
}
}), ye = /* @__PURE__ */ U({
name: "FInteractionItem",
props: sn,
emits: ["addAction", "delete", "toggle"],
setup(e, n) {
const {
guid: l
} = Te(), o = z("useMethodsComposition"), {
toggleSelectingMethod: c,
emitFinalState: i,
getViewModeId: h,
getMethodsOnViewModel: m,
getComponentList: E,
updateTarget: u,
updateCommandHasPath: b
} = o, s = y(e.controllers), t = y(e.interaction), d = y(!1), p = D(() => {
const a = t.value.showSwitch[0];
return a.showSection[a.showSwitchNumber][2];
}), w = D(() => {
const a = !!t.value.command, S = t.value.showSwitch[0], A = S.showSection[S.showSwitchNumber][3];
return a && A;
}), k = D(() => ({
"f-icon": !0,
"f-icon-arrow-chevron-down": w.value,
"f-icon-arrow-chevron-left": !w.value
}));
function M() {
n.emit("delete", e.displayOrder);
}
function T() {
const a = t.value.showSwitch[0];
a.showSection[a.showSwitchNumber][3] = !a.showSection[a.showSwitchNumber][3], n.emit("toggle", e.displayOrder);
}
function B() {
if (t.value.command !== null) {
const S = t.value.showSwitch[0];
c(S), n.emit("addAction", e.displayOrder);
}
}
function L(a) {
a === null && t.value.command === null && n.emit("delete", e.displayOrder);
const S = t.value.showSwitch[0];
c(S);
}
function P(a, S, A) {
let V = `${S}${A}${a}`, $ = -1;
const I = m();
for (; $ === -1; ) {
let j = !1;
for (let _ = 0; _ < I.length; _++)
I[_].controllerList.forEach((H) => {
H.label || H.label === "" ? j = H.label.toLowerCase() === V.toLowerCase() ? !0 : j : j = !1;
});
if (j)
a += 1, V = `${S}${A}${a}`;
else {
$ = 0;
break;
}
}
return {
newName: V,
suffix: a
};
}
function v(a) {
const {
method: S,
controller: A
} = a, {
label: V,
handlerName: $,
property: I,
componentLists: j,
hasPath: _
} = S, H = h().replace(/-/g, "").replace("component", "").replace("viewmodel", ""), Q = V.slice(0, 1).toUpperCase() + V.slice(1), {
newName: X,
suffix: Z
} = P(1, H, Q), {
controllerName: G
} = A, x = G.id, K = {
id: l(),
label: X,
name: `${S.name}${Z}`,
handlerName: $,
hasPath: _,
cmpId: x,
property: I,
componentLists: j
};
t.value.command = b(A, K), t.value.controller = {
id: G.id,
label: G.label,
name: G.name
};
const q = t.value.showSwitch[0];
q.showSwitchNumber = 2, q.showSection[q.showSwitchNumber][2] = !1, q.showSection[q.showSwitchNumber][3] = !0, d.value = !0, i(!1, null);
}
function f() {
t.value.command = {
id: "abandoned",
label: "未绑定方法",
name: "未绑定方法",
property: [],
hasPath: !1,
handlerName: "未绑定方法",
cmpId: "",
shortcut: {},
isRTCmd: void 0,
isNewGenerated: void 0,
extensions: [],
isInvalid: !1
}, t.value.controller = {
label: "",
name: "",
id: ""
}, i(!0, t.value.event);
const a = t.value.showSwitch[0];
c(a);
}
function g() {
return r(mn, {
controllers: s.value,
onClose: L,
onSelectMethod: v,
onNewFunctionChanged: () => f()
}, null);
}
function C() {
const a = t.value.showSwitch[0];
a.showSection[a.showSwitchNumber][3] = !1;
}
function F(a) {
t.value.command = N(a), i(!1, null);
}
function O(a) {
a.componentLists = E(), u(a), t.value.command = N(a), i(!1, null);
}
function R() {
return r(hn, {
command: t.value.command,
showParameter: d.value,
onConfirm: () => C(),
onChange: (a) => F(a),
onTargetChange: (a) => O(a)
}, null);
}
return () => r("div", {
class: "show-switch"
}, [r("div", {
class: "f-page-events-editor-bound-event"
}, [r("div", {
class: "f-page-events-editor-bound-event-name",
title: t.value.event.label
}, [t.value.event.name]), r("div", {
style: "float:right;margin:5px;"
}, [r("div", {
class: k.value,
style: "font-size: 10px;",
onClick: T
}, null)]), r("div", {
class: "f-icon f-icon-yxs_delete",
style: "font-size: 13px;float: right; margin:8px;",
onClick: M
}, null), r("div", {
class: "f-icon f-icon-home-add",
style: "float:right; font-size: 10px; margin:8px;",
onClick: B
}, null)]), p.value && g(), w.value && R()]);
}
});
function Be(e, n, l) {
const { interactions: o } = n, { setComponentLists: c } = Ee(), i = y(e.value.internalCommandList);
function h(v) {
o.value[v].showSwitch = [], o.value[v].showSwitch.push(N({
// 存储所有的展示设定
showSection: [[!1, !1, !1, !1, !1], [!1, !1, !0, !1, !1], [!1, !0, !1, !0, !1]],
// 展示哪个部分
showSwitchNumber: 2
})), o.value = N(o.value);
}
function m(v, f, g) {
}
function E(v) {
var g;
const f = [];
return (g = e.value.newController) == null || g.forEach((C) => {
v.forEach((F) => {
C.Code === F.controller.label && f.push(N(C));
});
}), f;
}
function u(v = !1, f = null) {
var R;
e.value.newFuncEvents = f ? N(f) : null, e.value.isAddControllerMethod = v;
const g = [], C = N(e.value.internalCommandList);
o.value.map((a) => {
const S = N(a.controller), A = N(a.command), V = N(a.event), $ = { controller: S, command: A, boundEvents: V };
g.push(N($));
});
const F = (R = e.value.newController) != null && R.length && g.length ? N(E(g)) : [], O = {
/** 拼接名称时的前缀 */
viewModelId: e.value.viewModelId,
/** 视图模型绑定的事件下的方法列表 */
savedCommand: N(e.value.viewModel),
/** 当前界面显示的绑定事件 */
boundEventsList: N(g),
/** 可选择的绑定事件列表 */
events: N(e.value.events),
/** 内置构件列表； */
internalCommandList: N(C),
/** 所有可选的组件 */
componentLists: [],
/** 接收formBasicService.formMetaBasicInfo.relativePath */
relativePath: e.value.relativePath,
/** 接收formBasicService.envType */
envType: e.value.envType,
/** 初始为空，用于存储用户点击「导入新方法」的控制器值 */
newController: N(F),
/** 切换到代码视图标识 */
isAddControllerMethod: e.value.isAddControllerMethod,
/** 用户选择「已有方法」 */
repititionCommand: e.value.repititionCommand,
/** 上一个绑定的方法 */
preCommand: e.value.preCommand,
/** 新增方法的对应事件 */
newFuncEvents: e.value.newFuncEvents
};
l.emit("savedCommandListChanged", O);
}
function b(v) {
v.showSection[v.showSwitchNumber][2] = !0;
}
function s(v) {
v.showSection[v.showSwitchNumber][2] = !1;
}
function t(v) {
v.showSection[v.showSwitchNumber][3] = !0;
}
function d(v) {
v.showSection[v.showSwitchNumber][3] = !1;
}
function p(v) {
v.showSection[v.showSwitchNumber][2] ? (s(v), t(v)) : (b(v), d(v));
}
function w() {
return e.value.componentLists;
}
function k(v) {
e.value.viewModel.forEach((f) => {
for (let g = 0; g < f.controllerList.length; g++)
f.controllerList[g].label === v.label && (f.controllerList[g] = N(v));
});
}
function M() {
return e.value.viewModelId;
}
function T() {
return e.value.getEventPath ? e.value.getEventPath().viewModelDisplay : [];
}
function B(v, f) {
return c(v, f, e.value);
}
function L(v) {
e.value.newController = e.value.newController || [], e.value.newController.push(N(v));
const f = e.value.newController;
for (let g = 0; g < f.length; g++)
for (let C = g + 1; C < f.length; C++)
f[g].Id === f[C].Id && (f.splice(C, 1), C--);
}
function P(v) {
let f = !1;
return e.value.internalCommandList.forEach((g) => {
if (g.controllerName.label === v.controllerName.label) {
f = !0;
return;
}
}), f || e.value.internalCommandList.push(v), f;
}
return {
controllers: i,
onClosed: h,
emitFinalState: u,
onCurrentCommandChanged: m,
toggleSelectingMethod: p,
getViewModeId: M,
getComponentList: w,
updateTarget: k,
updateCommandHasPath: B,
addNewController: L,
checkIfNewControllerExists: P,
getMethodsOnViewModel: T
};
}
const ne = /* @__PURE__ */ U({
name: "FEventsEditor",
props: ae,
emits: ["savedCommandListChanged"],
setup(e, n) {
const l = y(e.initialData), o = Me(l), {
loadEvents: c,
resetBoundEvents: i
} = o, h = Ne(l, o), {
addNewInteraction: m,
deleteInteracton: E,
interactions: u,
loadInteractions: b
} = h, s = Be(l, h, n), {
emitFinalState: t,
controllers: d
} = s;
Y("useEventsComposition", o), Y("useInteractionCompostion", h), Y("useMethodsComposition", s);
function p() {
l.value.isAddControllerMethod = !1;
}
be(() => {
p(), i(), c(), b();
});
function w(B) {
E(B), t(!1, null);
}
function k(B, L) {
const P = B.showSwitch[0], v = P.showSection[P.showSwitchNumber][3];
return r(ye, {
controllers: d.value,
interaction: B,
displayOrder: L,
collapsed: v,
onDelete: w
}, null);
}
function M() {
var B;
return (B = u.value) == null ? void 0 : B.map((L, P) => r("div", {
class: "events-display-order",
key: L.event.label
}, [k(L, P)]));
}
function T(B) {
m(B);
}
return () => r("div", {
class: "f-page-events-editor"
}, [r("div", {
class: "f-page-events-editor-content"
}, [r(Le, {
onClick: T
}, null), M()])]);
}
});
function pn(e, n, l) {
var v;
const o = "", c = "", i = y();
function h() {
return (n == null ? void 0 : n.schema.componentType) !== "frame";
}
function m() {
return !1;
}
function E() {
return (n == null ? void 0 : n.schema.componentType) !== "frame";
}
function u() {
return (n == null ? void 0 : n.schema.componentType) === "frame";
}
function b(f) {
if (!f || !f.value)
return null;
if (f.value.schema && f.value.schema.type === "component")
return f.value;
const g = y(f == null ? void 0 : f.value.parent), C = b(g);
return C || null;
}
function s(f = n) {
var O;
const { componentInstance: g, designerItemElementRef: C } = f;
if (!g || !g.value)
return null;
const { getCustomButtons: F } = g.value;
return g.value.canMove || F && ((O = F()) != null && O.length) ? C : s(f.parent);
}
function t(f) {
return !!l;
}
function d() {
return (n == null ? void 0 : n.schema.label) || (n == null ? void 0 : n.schema.title) || (n == null ? void 0 : n.schema.name);
}
function p() {
}
function w(f, g) {
var C;
!f || !g || (C = n == null ? void 0 : n.setupContext) == null || C.emit("dragEnd");
}
function k(f, g) {
const { componentType: C } = f;
let F = Ce(C, f, g);
const O = C.toLowerCase().replace(/-/g, "_");
return F && !F.id && F.type === C && (F.id = `${O}_${Math.random().toString().slice(2, 6)}`), F;
}
function M(f) {
}
function T(...f) {
}
function B() {
n != null && n.schema.contents && n.schema.contents.map((f) => {
let g = f.id;
f.type === "component-ref" && (g = f.component);
const C = e.value.querySelectorAll(`#${g}-design-item`);
C != null && C.length && Array.from(C).map((F) => {
var O;
(O = F == null ? void 0 : F.componentInstance) != null && O.value.onRemoveComponent && F.componentInstance.value.onRemoveComponent();
});
});
}
function L() {
}
function P(f) {
}
return i.value = {
canMove: h(),
canSelectParent: m(),
canDelete: E(),
canNested: !u(),
contents: n == null ? void 0 : n.schema.contents,
elementRef: e,
parent: (v = n == null ? void 0 : n.parent) == null ? void 0 : v.componentInstance,
schema: n == null ? void 0 : n.schema,
styles: o,
designerClass: c,
canAccepts: t,
getBelongedComponentInstance: b,
getDraggableDesignItemElement: s,
getDraggingDisplayText: d,
getPropConfig: T,
getDragScopeElement: p,
onAcceptMovedChildElement: w,
onChildElementMovedOut: M,
addNewChildComponentSchema: k,
triggerBelongedComponentToMoveWhenMoved: y(!1),
triggerBelongedComponentToDeleteWhenDeleted: y(!1),
onRemoveComponent: B,
getCustomButtons: L,
onPropertyChanged: P
}, i;
}
const bn = /* @__PURE__ */ U({
name: "FEventsEditorDesign",
props: ae,
emits: ["savedCommandListChanged"],
setup(e, n) {
const l = y(e.initialData), o = Me(l), {
loadEvents: c,
resetBoundEvents: i
} = o, h = Ne(l, o), {
addNewInteraction: m,
deleteInteracton: E,
interactions: u,
loadInteractions: b
} = h, s = Be(l, h, n);
Y("useEventsComposition", o), Y("useInteractionCompostion", h), Y("useMethodsComposition", s);
const t = y(), d = z("design-item-context"), p = pn(t, d);
be(() => {
t.value.componentInstance = p, w(), i(), c(), b();
}), n.expose(p.value);
function w() {
l.value.isAddControllerMethod = !1;
}
function k(L) {
E(L);
}
function M(L, P) {
const v = L.showSwitch[0], f = v.showSection[v.showSwitchNumber][3];
return r(ye, {
interaction: L,
displayOrder: P,
collapsed: f,
onDelete: k
}, null);
}
function T() {
var L;
return (L = u.value) == null ? void 0 : L.map((P, v) => r("div", {
class: "events-display-order",
key: P.event.label
}, [M(P, v)]));
}
function B(L) {
m(L);
}
return () => r("div", {
ref: t,
class: "f-page-events-editor"
}, [r("div", {
class: "f-page-events-editor-content"
}, [r(Le, {
onClick: B
}, null), T()])]);
}
}), yn = {
install(e) {
e.component(ne.name, ne);
},
register(e, n, l, o) {
e["events-editor"] = ne, n["events-editor"] = pe;
},
registerDesigner(e, n, l) {
e["events-editor"] = bn, n["events-editor"] = pe;
}
};
export {
ne as FEventsEditor,
yn as default,
ae as eventsEditorProps,
pe as propsResolver
};