@farris/ui-vue
Version:
Farris Vue, a Farris Design based Vue3 component library.
1,873 lines • 86 kB
JavaScript
import { ref as y, computed as H, createVNode as d, Fragment as U, watch as j, withModifiers as Ge, withDirectives as De, vModelText as qe, defineComponent as D, onMounted as ie, reactive as K, inject as le } from "vue";
import { resolveAppearance as ae, createPropsResolver as oe, getPropsResolverGenerator as ze } from "../dynamic-resolver/index.esm.js";
import { getCustomStyle as fe, getCustomClass as X, useTouchMomentum as Ue, useTouch as We, useCommonUtils as Z, useBem as pe, useFarrisConfig as Ye, FormSchemaEntityFieldType$Type as Y, EVENT_PROPERTY_TAB_IDS as Ke, withInstall as Xe } from "../common/index.esm.js";
import { useFilter as Je, useIdentify as Qe, useHierarchy as Ze, useGroupData as et, useDataView as tt, useSelection as nt, usePagination as lt, useRow as it, useEdit as at, useVisualDataBound as ot, useVisualDataCell as st, useVisualDataRow as ut, useVisualGroupRow as rt, useVisualSummaryRow as ct, useVisualData as dt, useSidebar as ft, useColumn as mt, useVirtualScroll as vt } from "../data-view/index.esm.js";
import { LocaleService as se } from "../locale/index.esm.js";
import { FCheckbox as ue } from "../checkbox/index.esm.js";
import gt from "../button-edit/index.esm.js";
import ht from "../list-view/index.esm.js";
import { isUndefined as yt } from "lodash-es";
import "bignumber.js";
import bt from "../../designer/button-edit/index.esm.js";
import { InputBaseProperty as pt } from "../property-panel/index.esm.js";
import { useDesignerComponent as Ce } from "../designer-canvas/index.esm.js";
const Ct = /* @__PURE__ */ new Map([
["appearance", ae]
]), St = "https://json-schema.org/draft/2020-12/schema", wt = "https://farris-design.gitee.io/order.schema.json", Ft = "order", It = "A Farris Component", xt = "object", Tt = {
id: {
description: "The unique identifier for a order",
type: "string"
},
type: {
description: "The type string of order component",
type: "string",
default: "order"
},
appearance: {
description: "",
type: "object",
properties: {
class: {
type: "string"
},
style: {
type: "string"
}
},
default: {}
},
binding: {
description: "",
type: "object",
default: {}
},
editable: {
description: "",
type: "boolean",
default: !0
},
enableLinkLabel: {
description: "",
type: "boolean",
default: !1
},
label: {
description: "",
type: "string",
default: ""
},
lableWidth: {
description: "",
type: "number"
},
placeholder: {
description: "",
type: "string",
default: ""
},
readonly: {
description: "",
type: "boolean",
default: !1
},
required: {
description: "",
type: "boolean",
default: !1
},
tabindex: {
description: "",
type: "number",
default: -1
},
textAlign: {
description: "",
type: "string",
enum: [
"left",
"middle",
"right"
],
default: "left"
},
visible: {
description: "",
type: "boolean",
default: !0
},
onBlur: {
description: "",
type: "string",
default: ""
},
onClickLinkLabel: {
description: "",
type: "string",
default: ""
}
}, Vt = [
"id",
"type"
], kt = {
$schema: St,
$id: wt,
title: Ft,
description: It,
type: xt,
properties: Tt,
required: Vt
};
function Mt(e, t, o) {
return t;
}
const Bt = "order", Pt = "A Farris Component", Ot = "object", Ht = {
basic: {
description: "Basic Infomation",
title: "基本信息",
properties: {
id: {
description: "组件标识",
title: "标识",
type: "string",
readonly: !0
},
type: {
description: "组件类型",
title: "控件类型",
type: "select",
editor: {
type: "waiting for modification",
enum: []
}
}
}
},
behavior: {
description: "Basic Infomation",
title: "行为",
properties: {
editable: {
description: "",
title: "允许编辑",
type: "boolean"
},
readonly: {
description: "",
title: "只读",
type: "string"
},
required: {
description: "",
title: "必填",
type: "boolean"
},
visible: {
description: "",
title: "可见",
type: "boolean"
},
placeholder: {
description: "",
title: "提示文本",
type: "string"
},
tabindex: {
description: "",
title: "tab索引",
type: "number"
},
textAlign: {
description: "",
title: "对齐方式",
type: "enum",
editor: {
type: "combo-list",
textField: "name",
valueField: "value",
data: [
{
value: "left",
name: "左对齐"
},
{
value: "center",
name: "居中"
},
{
value: "right",
name: "右对齐"
}
]
}
}
}
}
}, Rt = {
title: Bt,
description: Pt,
type: Ot,
categories: Ht
}, re = {
/** 排序列数据源 */
dataSource: { type: Array, default: [] },
/** 当前排序数组 */
items: { type: Array, default: [] }
}, me = oe(re, kt, Ct, Mt, Rt), At = {
/** 列集合 */
columns: {
type: Array,
default: [
{ field: "name", title: "", dataType: "string" }
]
},
customClass: { type: String, default: "" },
data: { type: Array, default: [] },
draggable: { type: Boolean, default: !1 },
multiSelect: { type: Boolean, default: !1 },
// multiSelectMode: { type: String as PropType<MultiSelectMode>, default: 'OnCheck' },
idField: { type: String, default: "id" },
valueField: { type: String, default: "id" },
textField: { type: String, default: "name" },
titleField: { type: String, default: "name" },
view: { type: String, default: "ContentView" },
size: { type: String, default: "default" },
placeholder: { type: String, default: "" },
header: { type: String, default: "ContentHeader" },
headerClass: { type: String, default: "" },
/** 可能根据数据每各项的样式不同 */
itemClass: {
type: [String, Function],
default: "",
validator: (e) => typeof e == "string" || typeof e == "function"
},
itemStyle: {
type: [String, Function],
default: "",
validator: (e) => typeof e == "string" || typeof e == "function"
},
itemContentClass: { type: String, default: "" },
selectionValues: { type: Array, default: [] },
/** 分组配置 */
group: { type: Object },
/** 选择配置 */
selection: {
type: Object,
default: {
enableSelectRow: !0,
multiSelect: !1,
multiSelectMode: "DependOnCheck",
showCheckbox: !1,
showSelectAll: !1,
showSelection: !0
}
},
keepOrder: { type: Boolean, default: !1 },
disableField: { type: String, default: "disabled" },
// 搜索启用高亮
enableHighlightSearch: { type: Boolean, default: !0 },
/** 虚拟化渲染数据 */
virtualized: { type: Boolean, default: !0 },
/** 删除数据前的检查方法，返回值为true时可以删除当前数据 */
checkBeforeRemoveItem: { type: Function, default: null },
/** 头部模板 */
headerTemplate: { type: Object },
/** 内容模板 */
contentTemplate: { type: Object },
/** 底部模板 */
footerTemplate: { type: Object },
/** 空数据模板 */
emptyTemplate: { type: Object },
/** 分页 */
pagination: { type: Object, default: { enable: !1, size: 20 } },
/** 定义属性，开启时，当多选开启时，展示选中项的背景色等样式；不开启时，不展示选中项的背景色等样式 */
showActiveWhenMultiSelect: { type: Boolean, default: !0 },
/** 允许删除 */
allowDelete: { type: Boolean, default: !0 }
};
function Lt(e, t) {
function o(f) {
const i = [];
let h = f.nextNode();
for (; h; )
i.push(h), h = f.nextNode();
return i;
}
function a(f, i) {
const h = document.createTreeWalker(f, NodeFilter.SHOW_TEXT);
return o(h).map((g) => ({ textNode: g, text: (g.textContent || "").toLocaleLowerCase() })).map(({ textNode: g, text: I }) => {
const k = [];
let b = 0;
for (; b < I.length; ) {
const P = I.indexOf(i, b);
if (P === -1)
break;
k.push(P), b = P + i.length;
}
return k.map((P) => {
const B = new Range();
return B.setStart(g, P), B.setEnd(g, P + i.length), B;
});
}).flat();
}
function c(f) {
if (!CSS.highlights || (CSS.highlights.clear(), !f || !t))
return;
const i = a(t.value, f.toLocaleLowerCase()), h = new Highlight(...i);
CSS.highlights.set("search-result", h);
}
return { search: c };
}
function ve(e, t, o, a, c, f, i, h, F, V) {
const C = y(e.size), g = y(e.textField), I = y(e.titleField), k = y(e.disableField), b = H(() => {
var S, O;
return ((S = e.selection) == null ? void 0 : S.multiSelect) && ((O = e.selection) == null ? void 0 : O.showCheckbox);
}), {
onMouseenterItem: P,
onMouseoverItem: B,
onMouseoutItem: n
} = f, {
getKey: l,
listViewItemClass: u,
listViewItemStyle: r,
onCheckItem: s,
onClickItem: m
} = i, T = H(() => {
const S = {
"text-overflow": "ellipsis",
overflow: "hidden",
"white-space": "nowrap"
};
return e.itemClass ? S : {
margin: C.value === "small" ? "0.25rem 0" : "8px 0",
...S
};
});
function M(S, O, R) {
return S.checked = h.findIndexInSelectedItems(S) > -1, d("li", {
class: u(S, O),
id: l(S, O),
key: l(S, O),
style: r(S, O),
onClick: (E) => m(S, O, E),
onMouseenter: (E) => P(E, S, O),
onMouseover: (E) => B(E, S, O),
onMouseout: (E) => n(E, S, O)
}, [b.value && d("div", {
class: "f-list-select",
onClick: (E) => E.stopPropagation()
}, [d(ue, {
id: "list-" + l(S, O),
customClass: "listview-checkbox float-left",
disabled: S[k.value],
checked: S.checked,
"onUpdate:checked": (E) => S.checked = E,
onChange: (E) => {
s(S, O, !E.checked);
}
}, null)]), d("div", {
class: "f-list-content"
}, [d("div", {
class: e.itemContentClass,
style: T.value,
title: S.raw[I.value] || S.raw[g.value]
}, [S.raw[g.value]])])]);
}
return {
renderItem: M
};
}
function Et(e, t, o, a, c, f, i, h, F, V) {
const C = y(e.multiSelect), g = y(e.disableField), I = y(e.textField), {
onMouseenterItem: k,
onMouseoverItem: b,
onMouseoutItem: P
} = f, {
getKey: B,
listViewItemClass: n,
listViewItemStyle: l,
onCheckItem: u,
onClickItem: r,
updateSelectedItems: s
} = i;
function m(M, S, O) {
return e.contentTemplate ? d(U, null, [e.contentTemplate({
item: M.raw,
index: S,
selectedItem: O
})]) : t.slots.content ? d(U, null, [t.slots.content && t.slots.content({
item: M.raw,
index: S,
selectedItem: O
})]) : d("div", {
style: "margin: 10px 0;"
}, [M.raw[I.value || "name"]]);
}
function T(M, S, O) {
return d("li", {
class: n(M, S),
id: B(M, S),
key: B(M, S),
style: l(M, S),
onClick: (R) => r(M, S, R),
onMouseenter: (R) => k(R, M, S),
onMouseover: (R) => b(R, M, S),
onMouseout: (R) => P(R, M, S)
}, [C.value && d("div", {
class: "f-list-select",
onClick: (R) => R.stopPropagation()
}, [d(ue, {
id: "list-" + B(M, S),
customClass: "listview-checkbox",
disabled: M[g.value],
checked: M.checked,
"onUpdate:checked": (R) => M.checked = R,
onChange: (R) => {
u(M, S, !R.checked), s();
}
}, null)]), d("div", {
class: "f-list-content"
}, [m(M, S, O)])]);
}
return {
renderItem: T
};
}
function $t(e, t, o, a, c, f, i, h, F, V) {
const C = y(e.multiSelect), g = y(e.disableField), I = y(e.textField), {
onMouseenterItem: k,
onMouseoverItem: b,
onMouseoutItem: P
} = f, {
getKey: B,
listViewItemClass: n,
onCheckItem: l,
onClickItem: u
} = i, {
dragstart: r,
dragenter: s,
dragover: m,
dragend: T
} = a, {
removeItem: M
} = F, S = H(() => ({
margin: C.value ? "10px 0" : "10px 0px 10px 14px"
}));
function O(x, p = "") {
const w = x.target;
w.title = w.scrollWidth > w.clientWidth ? p : "";
}
function R(x) {
return d("div", {
style: S.value,
onMouseenter: (p) => O(p, x.raw[I.value || "name"])
}, [x.raw[I.value || "name"]]);
}
function E() {
return t.slots.itemContent ? t.slots.itemContent : R;
}
const G = E();
function N(x, p, w) {
return d("li", {
class: n(x, p),
id: B(x, p),
key: B(x, p),
onClick: (v) => u(x, p, v),
onMouseenter: (v) => k(v, x, p),
onMouseover: (v) => b(v, x, p),
onMouseout: (v) => P(v, x, p),
draggable: "true",
onDragstart: (v) => r(v, x, p),
onDragenter: (v) => s(v, p),
onDragend: (v) => T(v, x),
onDragover: (v) => m(v)
}, [C.value && d("div", {
class: "f-list-select",
onClick: (v) => v.stopPropagation()
}, [d(ue, {
id: "list-" + B(x, p),
customClass: "listview-checkbox",
disabled: x[g.value],
checked: x.checked,
"onUpdate:checked": (v) => x.checked = v,
onChange: (v) => l(x, p, !v.checked)
}, null)]), d("div", {
class: "f-list-content"
}, [G(x)]), e.allowDelete && d("div", {
class: "f-list-remove",
onClick: (v) => {
v.stopPropagation(), M(p);
}
}, [d("div", {
class: "f-list-remove-icon"
}, [d("i", {
class: "f-icon f-icon-remove_face"
}, null)])]), d("div", {
class: "f-list-handle"
}, [d("div", null, [d("i", {
class: "f-icon f-icon-drag-vertical"
}, null)])])]);
}
return {
renderItem: N
};
}
function jt(e, t, o, a, c, f, i, h, F, V) {
var B;
const C = y(((B = e.group) == null ? void 0 : B.groupFields) || []), {
collpaseGroupIconClass: g
} = c, {
toggleGroupRow: I
} = V;
function k(n, l) {
n.stopPropagation(), l.collapse = !l.collapse, o.value = I(l.collapse ? "collapse" : "expand", l, o.value);
}
function b(n, l, u) {
return t.slots.group ? d(U, null, [t.slots.content && t.slots.group({
item: n.raw,
index: l,
selectedItem: u
})]) : d("div", {
class: "f-navlookup-recentHeader",
onClick: (r) => k(r, n)
}, [d("div", {
class: "fv-grid-group-row-icon"
}, [d("span", {
class: g(n)
}, null)]), d("div", {
class: "f-navlookup-recommandLabel"
}, [n.raw[C.value[n.layer]]])]);
}
function P(n, l, u) {
return n.layer > -1 && b(n, l, u);
}
return {
renderItem: P
};
}
function Nt(e, t, o, a) {
const { dataView: c } = o, { updateSelectedItems: f } = a;
function i(h) {
if (h > -1 && h < c.value.length) {
if (e != null && e.checkBeforeRemoveItem && !e.checkBeforeRemoveItem(c.value[h]))
return;
const F = c.value.splice(h, 1);
f(), t.emit("removeItem", F[0]);
}
}
return { removeItem: i };
}
function _t(e, t, o, a, c, f, i, h, F, V) {
const C = y(e.view), g = y(e.view === "CardView"), I = y({}), k = Nt(e, t, a, F), b = H(() => ({
"f-list-view-group": !0,
"f-list-view-group-multiselect": e.multiSelect,
"d-flex": g.value,
"flex-wrap": g.value
})), P = H(() => !!o.value && o.value.length > 0), B = H(() => o.value.length === 0);
H(() => B.value && !t.slots.empty);
function n() {
return C.value === "SingleView" ? ve : C.value === "DraggableView" ? $t : (C.value === "ContentView" || C.value === "CardView") && (e.contentTemplate || t.slots.content) ? Et : ve;
}
const l = n(), {
renderItem: u
} = l(e, t, o, V, c, f, F, i, k, h), {
renderItem: r
} = jt(e, t, o, V, c, f, F, i, k, h), s = [u, r];
function m() {
return o.value.filter((S) => S.visible !== !1).map((S, O) => s[S.type](S, O, I));
}
function T() {
return d("div", {
class: "f-list-view-emptydata",
style: "margin: 0 auto;"
}, [d("p", {
class: "f-empty-title"
}, [e.emptyTemplate ? e.emptyTemplate() : t.slots.empty ? t.slots.empty() : se.getLocaleValue("listView.emptyMessage")])]);
}
function M() {
return d("ul", {
class: b.value,
style: "list-style: none;"
}, [P.value && m(), B.value && T()]);
}
return {
renderListArea: M
};
}
function Gt(e, t, o) {
function a() {
return t.slots.header && d("div", {
class: "f-list-view-header"
}, [t.slots.header()]);
}
return {
renderHeader: a
};
}
function ge(e, t, o) {
const a = y(e.headerClass), c = y(e.placeholder), f = y(""), i = H(() => !f.value), h = H(() => !!f.value);
function F(I) {
f.value = "";
}
j(f, (I) => {
e.enableHighlightSearch && o.search(I), t.emit("afterSearch", I);
});
const V = H(() => {
const I = {
"form-group": !0,
"farris-form-group": !0
};
return a.value && a.value.split(" ").reduce((b, P) => (b[P] = !0, b), I), I;
});
function C(I) {
}
function g() {
return d("div", {
class: "f-list-view-header",
onClick: Ge(() => C, ["prevent", "stop"])
}, [d("div", {
class: V.value
}, [d("div", {
class: "farris-input-wrap"
}, [d("div", {
class: "f-cmp-inputgroup"
}, [d("div", {
class: "input-group f-state-editable"
}, [De(d("input", {
class: "form-control f-utils-fill text-left",
"onUpdate:modelValue": (I) => f.value = I,
name: "input-group-value",
type: "text",
placeholder: c.value,
autocomplete: "off"
}, null), [[qe, f.value]]), d("div", {
class: "input-group-append"
}, [h.value && d("span", {
class: "input-group-text input-group-clear",
onClick: (I) => F()
}, [d("i", {
class: "f-icon f-icon-close-circle"
}, null)]), i.value && d("span", {
class: "input-group-text"
}, [d("span", {
class: "f-icon f-icon-search"
}, null)])])])])])])]);
}
return {
renderHeader: g
};
}
function Dt() {
const e = y(""), t = y(-1), o = y(""), a = y(-1), c = y(!1);
function f(g, I, k) {
a.value = k;
}
function i(g, I, k) {
c.value || (a.value = k);
}
function h(g, I, k) {
a.value = -1;
}
function F() {
c.value = !0;
}
function V() {
c.value = !1;
}
function C() {
t.value = -1, e.value = "";
}
return {
activeIndex: t,
focusedItemId: o,
hoverIndex: a,
clearActiveItem: C,
onMouseenterItem: f,
onMouseoverItem: i,
onMouseoutItem: h,
resumeHover: V,
suspendHover: F
};
}
function qt(e, t, o, a, c) {
const f = y(e.idField), { dataView: i } = o, h = y(-1), F = y(!1), { activeIndex: V, focusedItemId: C, hoverIndex: g, resumeHover: I, suspendHover: k } = a;
let b, P = 0, B = 0, n = null, l = null;
const u = 10, r = 50;
function s(x) {
if (!x)
return null;
const { overflowY: p } = getComputedStyle(x);
return p === "auto" || p === "scroll" ? x : s(x.parentElement);
}
function m(x, p) {
l && clearInterval(l), l = window.setInterval(() => {
p === "up" ? x.scrollTop -= u : x.scrollTop += u;
}, 16);
}
function T() {
l && (clearInterval(l), l = null);
}
function M(x) {
const p = x.target;
if (n || (n = s(p)), !n) {
T();
return;
}
const w = n.getBoundingClientRect(), v = x.clientY, A = v - w.top, $ = w.bottom - v;
A < r && n.scrollTop > 0 ? m(n, "up") : $ < r && n.scrollTop < n.scrollHeight - n.clientHeight ? m(n, "down") : T();
}
function S(x, p) {
const w = x - P, v = p - B;
b.style.left = parseInt(b.style.left) + w + "px", b.style.top = parseInt(b.style.top) + v + "px", P = x, B = p;
}
function O(x) {
const { left: p, top: w } = x.getBoundingClientRect(), v = x.cloneNode(!0);
return v.className = v.className + " f-listview-drag-moving", v.style.cssText = `
position:absolute;
left:${p}px;
top:${document.documentElement.scrollTop ? w + document.documentElement.scrollTop : w}px;
z-index: 999999;
pointer-events: none;
border-radius: 10px;
margin: 4px 2px;
display: flex;
align-items: center;
float: none;
text-align: initial;
width:${getComputedStyle(x).width};
height:${getComputedStyle(x).height};
`, v.children[0].style.cssText = "padding: 0 0 0 14px", v.children[0].children[0].style.cssText = `
margin: 10px 0px 10px 14px;
overflow: hidden;text-overflow: ellipsis;white-space: nowrap;
`, v.children[1].style.cssText = "flex:1 1 auto; width:100%", v.children[2].style.cssText = "padding: 0 14px 0 0", v.children[2].children[0].style.cssText = "display: initial", document.body.appendChild(v), v;
}
function R(x, p, w) {
if (x.stopPropagation(), k(), p) {
if (b = O(x.target), x.dataTransfer) {
const v = new Image();
v.src = "", x.dataTransfer.setDragImage(v, 0, 0);
}
P = x.pageX, B = x.pageY, setTimeout(() => {
h.value = w, F.value = !0, p.moving = !0;
});
}
}
function E(x, p) {
if (x.preventDefault(), h.value !== p && h.value !== -1) {
const w = i.value[h.value], v = c.value[h.value];
w && v && (i.value.splice(h.value, 1), i.value.splice(p, 0, w), c.value.splice(h.value, 1), c.value.splice(p, 0, v), c.value.forEach((A, $) => {
A.index = $, A.raw.__fv_index__ = $;
}), h.value = p, S(x.pageX, x.pageY));
}
}
function G(x) {
x.preventDefault(), x.dataTransfer && (x.dataTransfer.dropEffect = "move"), S(x.pageX, x.pageY), M(x);
}
function N(x, p) {
var v, A;
T(), n = null, p && (p.moving = !1, b && (document.body.removeChild(b), b = null)), i.value.forEach(($, _) => {
$.__fv_index__ = _;
}), c.value.forEach(($, _) => {
$.index = _, $.raw && ($.raw.__fv_index__ = _);
}), F.value = !1, I();
const w = ((v = p.raw) == null ? void 0 : v.__fv_index__) ?? 0;
g.value = w, V.value = w, C.value = (A = p.raw) == null ? void 0 : A[f.value], t.emit("change", i.value), t.emit("activeChange", [p.raw]);
}
return {
dragstart: R,
dragenter: E,
dragover: G,
dragend: N,
isDragging: F
};
}
function zt(e, t, o, a, c, f) {
var N, x;
const i = y(e.idField), h = y(e.disableField), F = y(e.draggable);
y(e.itemClass);
const V = y(((N = e.selection) == null ? void 0 : N.multiSelect) ?? !1), C = y(((x = e.selection) == null ? void 0 : x.multiSelectMode) || "DependOnCheck"), { isDragging: g } = a, { activeIndex: I, focusedItemId: k, hoverIndex: b } = c, { clearSelection: P, getSelectedItems: B, toggleSelectItem: n, currentSelectedDataId: l, multiSelectOnlyOnCheck: u } = f, r = y(B()), s = (p) => r.value.length === 0 ? !1 : r.value.some((w) => {
let v = "";
return w.data ? v = w.data[i.value] : v = w[i.value], v === p;
});
function m() {
r.value = B();
}
function T(p, w) {
return p.raw[i.value] != null ? p.raw[i.value] + "_" + w : "";
}
function M(p, w) {
const v = {
"f-list-view-group-item": !0,
"f-list-view-draggable-item": F.value,
"f-un-click": !p.checked,
"f-un-select": !!p.raw[h.value],
"f-listview-active": (
// 多选
V.value && s(T(p, w)) && e.showActiveWhenMultiSelect || // 单选
!V.value && p.raw[i.value] === l.value || V.value && !e.showActiveWhenMultiSelect && p.raw[i.value] === l.value
),
"f-listview-hover": !g.value && w === b.value,
moving: !!p.moving
};
if (typeof e.itemClass == "string")
return X(v, e.itemClass);
if (typeof e.itemClass == "function") {
const A = e.itemClass(p);
return X(v, A);
}
return v;
}
function S(p, w) {
const v = {};
if (typeof e.itemStyle == "string")
return fe(v, e.itemStyle);
if (typeof e.itemStyle == "function") {
const A = e.itemStyle(p);
return fe(v, A);
}
return v;
}
const O = H(() => !V.value);
function R(p, w, v) {
p.checked = v, !p.raw[h.value] && (O.value && (k.value = p.raw[i.value]), n(p));
}
const E = H(() => !V.value || V.value && C.value === "OnCheckAndClick");
function G(p, w, v) {
if (p.raw[h.value]) {
v == null || v.preventDefault(), v == null || v.stopPropagation();
return;
}
l.value = p.raw[i.value], k.value = p.raw[i.value], I.value = w, E.value && (n(p), m()), t.emit("clickItem", { data: r.value, index: w, dataItem: p.raw }), t.emit("activeChange", r.value);
}
return {
getKey: T,
selectedItems: r,
listViewItemClass: M,
listViewItemStyle: S,
updateSelectedItems: m,
onCheckItem: R,
onClickItem: G
};
}
const Se = /* @__PURE__ */ D({
name: "FListView",
props: At,
emits: ["afterSearch", "checkValuesChange", "clickItem", "selectItem", "unSelectItem", "selectionChange", "removeItem", "change", "activeChange", "pageIndexChanged", "pageSizeChanged", "changed", "selectionUpdate"],
setup(e, t) {
var de;
const o = y(!1), a = y(), c = y(!0), f = y(((de = e.rowOption) == null ? void 0 : de.rowHeight) || 28), i = y(!1), h = y([]), F = 0, V = y(e.columns), C = Je(e, t), g = Qe(e), I = Ze(e), k = et(e, g), b = tt(e, /* @__PURE__ */ new Map(), C, I, g), P = nt(e, b, g, h, t), B = Lt(e, a), n = lt(e, b), l = H(() => b.dataView.value.length), u = it(e, t, P, g), r = at(e, t, g, u, h), s = ot(e, b, f), m = st(e, {}, s), T = ut(e, b, r, I, g, s, m, f), M = rt(e, g, m, T), S = ct(e, g, m, T), O = dt(e, V, b, l, F, T, M, S), {
getVisualData: R
} = O;
h.value = R(0, l.value + F - 1);
const E = H(() => {
const L = {
"f-list-view": !0,
"f-list-view-multiple": e.multiSelect
};
return e.size !== "default" && (L[`${e.size}-item`] = !0), X(L, e.customClass);
}), G = H(() => !!t.slots.footer || c.value);
function N() {
return e.header === "SearchBar" ? ge : e.header === "ContentHeader" ? Gt : ge;
}
const x = N(), {
renderHeader: p
} = x(e, t, B), w = Dt(), v = qt(e, t, b, w, h), A = zt(e, t, h, v, w, P), {
renderListArea: $
} = _t(e, t, h, b, k, w, P, O, A, v);
function _(L) {
B.search(L);
}
function ke(L) {
L && (b.load(L), h.value = R(0, l.value + F - 1));
}
function Me() {
P.clearSelection(), w.clearActiveItem();
}
function Be() {
return A.selectedItems.value;
}
function Pe() {
return A.selectedItems.value.map((L) => L[g.idField.value]);
}
function ce(L) {
P.selectedValues.value = L, A.updateSelectedItems();
}
function Oe() {
return P.currentSelectedDataId.value;
}
function He(L) {
u.activeRowById(L);
}
function Re(L) {
const q = g.idField.value, z = h.value.find((te) => te.raw[q] === L), W = h.value.findIndex((te) => te.raw[q] === L);
z && W > -1 && A.onClickItem(z, W);
}
function Ae(L) {
const q = g.idField.value, z = h.value.find((W) => W.raw[q] === L);
z && u.changeRow(z);
}
function Le(L) {
n.updatePagination(L);
}
function Ee(L) {
return h.value.filter((q) => L.includes(q.raw[e.idField]));
}
t.expose({
search: _,
updateDataSource: ke,
clearSelection: Me,
getSelections: Be,
updateSelectionByIds: ce,
getSelectionIds: Pe,
activeRowById: He,
getCurrentRowId: Oe,
clickRowItemById: Re,
updatePagination: Le,
getVisibleDataByIds: Ee,
selectRowById: Ae
}), j(() => e.selectionValues, (L, q) => {
L !== q && ce(L);
});
const $e = ft(e, P), {
sidebarWidth: je,
showSidebarCheckBox: An
} = $e, Ne = mt(e, t), {
applyColumnSorter: Ln,
columnContext: _e,
updateColumnRenderContext: En
} = Ne;
return vt(e, b, h, _e, O, l, F, je, f, o, r), () => d("div", {
class: E.value
}, [p(), d("div", {
ref: a,
class: "f-list-view-content",
onMouseover: () => {
i.value || (i.value = !0);
},
onMouseleave: () => {
i.value && (i.value = !1);
}
}, [$()]), G.value && d("div", {
class: "f-list-view-footer"
}, [e.footerTemplate ? e.footerTemplate() : t.slots.footer && t.slots.footer()])]);
}
}), Ut = "https://json-schema.org/draft/2020-12/schema", Wt = "https://farris-design.gitee.io/component.schema.json", Yt = "button", Kt = "A Farris Visual Button", Xt = "object", Jt = {
id: {
description: "The unique identifier for a component",
type: "string"
},
type: {
description: "The type string of component",
type: "string",
default: "button"
},
text: {
description: "The text string of component",
type: "string"
},
disabled: {
description: "",
type: "boolean",
default: !1
},
appearance: {
description: "",
type: "object",
properties: {
class: {
type: "string"
},
style: {
type: "string"
}
},
default: {}
},
visible: {
description: "",
type: "boolean",
default: !0
},
size: {
description: "大小",
type: "string",
default: "middle"
},
icon: {
description: "图标",
type: "string",
default: ""
},
onClick: {
description: "点击事件",
type: "string",
default: ""
}
}, Qt = [
"id",
"type",
"text"
], Zt = {
onClick: "点击事件"
}, en = {
$schema: Ut,
$id: Wt,
title: Yt,
description: Kt,
type: Xt,
properties: Jt,
required: Qt,
events: Zt
}, tn = /* @__PURE__ */ new Map([
["appearance", ae]
]);
function nn(e, t, o) {
return Object.assign(t, {
text: "按钮",
appearance: {
class: "btn btn-secondary"
}
}), t;
}
const we = {
/**
* 组件标识
*/
id: String,
/**
* 设置按钮类型
*/
type: { type: String, default: "primary" },
/**
* 是否禁用
*/
disabled: { type: Boolean, default: !1 },
/**
* 按钮尺寸
*/
size: { type: String, default: "middle" },
/**
* 按钮图标
*/
icon: { type: String, default: "" },
/**
* 按钮文本
*/
text: { type: String, default: "" },
/**
* 自定义class
*/
customClass: { type: String, default: "" },
customStyle: { type: String, default: "" },
/** 控制是否可见 */
visible: { type: Boolean, default: !0 }
};
oe(we, en, tn, nn);
function ln(e, t) {
function o(a) {
a.stopPropagation(), e.disabled || t.emit("click", a);
}
return {
onClickButton: o
};
}
function an(e) {
const t = H(() => {
const a = {
"f-icon": !0
};
if (e.icon) {
const c = e.icon.trim().split(" ");
c && c.length && c.reduce((f, i) => (f[i] = !0, f), a);
}
return a;
}), o = H(() => !!(e.icon && e.icon.trim()));
return { iconClass: t, shouldShowIcon: o };
}
const Fe = /* @__PURE__ */ D({
name: "FButton",
props: we,
emits: ["click"],
setup(e, t) {
const {
onClickButton: o
} = ln(e, t), {
iconClass: a,
shouldShowIcon: c
} = an(e), f = H(() => {
const i = {
btn: !0,
"btn-lg": e.size === "large",
"btn-md": e.size !== "large" && e.size !== "small",
"btn-sm": e.size === "small",
"btn-icontext": c.value
};
return i[`btn-${e.type}`] = !0, e.customClass && (typeof e.customClass == "string" ? X(i, e.customClass) : Object.keys(e.customClass).reduce((h, F) => (h[F] = e.customClass[F], h), i)), i;
});
return () => e.visible ? d("button", {
class: f.value,
disabled: e.disabled,
style: e.customStyle,
onClick: (i) => o(i)
}, [c.value && d("i", {
class: a.value
}, null), e.text ? e.text : "", t.slots.default && t.slots.default()]) : null;
}
}), Ie = /* @__PURE__ */ new Map([
["appearance", ae]
]), on = "https://json-schema.org/draft/2020-12/schema", sn = "https://farris-design.gitee.io/combo-list.schema.json", un = "combo-list", rn = "A Farris Input Component", cn = "object", dn = {
id: {
description: "The unique identifier for a combo list",
type: "string"
},
type: {
description: "The type string of number combo list component",
type: "string",
default: "combo-list"
},
appearance: {
description: "",
type: "object",
properties: {
class: {
type: "string"
},
style: {
type: "string"
}
},
default: {}
},
binding: {
description: "",
type: "object",
default: {}
},
disabled: {
description: "",
type: "boolean",
default: !1
},
enableClear: {
description: "",
type: "boolean",
default: !1
},
editable: {
description: "",
type: "boolean",
default: !1
},
enableLinkLabel: {
description: "",
type: "boolean",
default: !1
},
label: {
description: "",
type: "string",
default: ""
},
lableWidth: {
description: "",
type: "number"
},
placeholder: {
description: "",
type: "string",
default: "请选择"
},
idField: {
description: "",
type: "string",
default: "id"
},
valueField: {
description: "",
type: "string",
default: "id"
},
titleField: {
description: "",
type: "string",
default: "name"
},
textField: {
description: "",
type: "string",
default: "name"
},
dataSourceType: {
description: "",
type: "string",
default: "static"
},
data: {
description: "",
type: "array"
},
dataSource: {
description: "",
type: "string"
},
remote: {
description: "",
type: "string"
},
readonly: {
description: "",
type: "boolean",
default: !1
},
required: {
description: "",
type: "boolean",
default: !1
},
tabindex: {
description: "",
type: "number",
default: -1
},
textAlign: {
description: "",
type: "string",
enum: [
"left",
"middle",
"right"
],
default: "left"
},
multiSelect: {
description: "",
type: "boolean",
default: !1
},
maxLength: {
description: "",
type: "number",
default: null
},
visible: {
description: "",
type: "boolean",
default: !0
},
onBlur: {
description: "",
type: "string",
default: ""
},
onClickLinkLabel: {
description: "",
type: "string",
default: ""
},
maxHeight: {
description: "",
type: "number",
default: 350
},
minPanelWidth: {
description: "",
type: "number",
default: 160
},
popupOnClick: {
description: "",
type: "boolean",
default: !0
},
separator: {
description: "",
type: "string",
default: ","
},
viewType: {
description: "",
type: "string",
default: "tag"
},
enableSearch: {
description: "启用搜索",
type: "boolean",
default: !0
},
enableHighlightSearch: {
description: "启用高亮搜索",
type: "boolean",
default: !1
},
beforeOpen: {
description: "打开下拉面板前回调",
type: "string"
},
beforeHide: {
description: "关闭下拉面板前回调",
type: "string"
},
onShown: {
description: "面板打开事件",
type: "string"
},
onHidden: {
description: "面板关闭事件",
type: "string"
},
onChange: {
description: "值变化事件",
type: "string",
default: ""
},
onInput: {
description: "输入事件",
type: "string",
default: ""
},
onClear: {
description: "清空事件",
type: "string",
default: ""
},
onDataChanged: {
description: "清空事件",
type: "string",
default: ""
},
hideDisabledItems: {
description: "隐藏禁用项",
type: "boolean",
default: !1
},
expandable: {
description: "",
type: "boolean",
default: !1
},
expandMode: {
description: "",
type: "string",
default: "text"
},
expandContent: {
description: "",
type: "string",
default: ""
},
expandDisabled: {
description: "",
type: "boolean",
default: !1
},
onExpandClick: {
description: "",
type: "string",
default: ""
}
}, fn = [
"type"
], mn = [
"id",
"appearance",
"binding",
"visible"
], vn = {
onClear: "清空事件",
onShown: "面板打开事件",
onHidden: "面板关闭事件",
onChange: "值变化事件",
beforeOpen: "打开面板前事件",
beforeHide: "关闭面板前事件"
}, xe = {
$schema: on,
$id: sn,
title: un,
description: rn,
type: cn,
properties: dn,
required: fn,
ignore: mn,
events: vn
};
function Te(e, t, o) {
return t;
}
function gn() {
function e(t, o, a) {
const c = {};
return c.beforeOpen = (f) => o.call("beforeOpen", t, [f, t], a), c;
}
return {
resolve: e
};
}
const ee = {
/**
* 组件标识
*/
id: { type: String },
/**
* 下拉数据源
*/
data: { type: Array, default: [] },
/**
* 可选，展示文本
* 默认为空字符串 -----内部需要根据value重新生成展示文本，此属性不生效
* displayText: { type: String, default: '' },
*/
/**
* 可选，是否禁用
* 默认为`false`
*/
disabled: { default: !1, type: Boolean },
/**
* 可选，下拉图标
* 默认为'<span class="f-icon f-icon-arrow-60-down"></span>'
*/
dropDownIcon: { type: String, default: '<span class="f-icon f-icon-arrow-chevron-down"></span>' },
/**
* 可选，是否可编辑
* 默认`false`
*/
editable: { default: !1, type: Boolean },
/**
* 可选，是否启用清空
* 默认启用
*/
enableClear: { default: !0, type: Boolean },
/**
* 可选，启用搜索
* 默认为`false`
*/
enableSearch: { type: Boolean, default: !1 },
/**
* 可选，鼠标悬停时是否显示控件值
* 默认显示
*/
enableTitle: { default: !0, type: Boolean },
fitEditor: { default: !1, type: Boolean },
/**
* 可选，强制显示占位符
* 默认`false`
*/
forcePlaceholder: { default: !1, type: Boolean },
/**
* 可选，清空值时隐藏面板
* 默认`true`
*/
hidePanelOnClear: { default: !0, type: Boolean },
/**
* 可选，数据源id字段
* 默认为`id`
*/
idField: { default: "id", type: String },
/**
* 可选，字段映射
*/
mapFields: { type: Object },
/**
* 可选，最大高度
* 默认`350`
*/
maxHeight: { default: 350, type: Number },
/**
* 最大输入长度
*/
maxLength: { type: Number },
/**
* 可选，是否支持多选
* 默认`false`
*/
multiSelect: { type: Boolean, default: !1 },
/**
* 绑定值
*/
modelValue: { type: String, default: "" },
/**
* 占位符
*/
placeholder: { type: String, default: "请选择" },
/**
* 可选，下拉面板展示位置
* 默认为`auto`
*/
placement: {
type: String,
default: "auto"
/* auto */
},
/**
* 可选，是否只读
* 默认为`false`
*/
readonly: { default: !1, type: Boolean },
/**
* 远端数据源信息
*/
remote: { default: null, type: Object },
/**
* 可选，是否支持远端过滤
* 默认`false`
*/
remoteSearch: { default: !1, type: Boolean },
/**
* 可选，分隔符
* 默认`,`
*/
separator: { default: ",", type: String },
/**
* tabIndex
*/
tabIndex: { type: Number, default: -1 },
/**
* 可选，数据源显示字段
* 默认为`name`
*/
textField: { default: "name", type: String },
/**
* 可选，数据源的title
* 默认为`name`
*/
titleField: { default: "name", type: String },
/**
* 可选，数据源值字段
* 默认为`id`
*/
valueField: { default: "id", type: String },
/**
* 可选，启用多选下，下拉列表值在输入框中的展示方式
* 支持text | tag
* 因为ButtonEdit内部处理类型只有在批量的情况下才会有展示类型区分
*/
viewType: { default: "tag", type: String },
/**
* 值变化事件
*/
change: { type: Function, default: () => {
} },
/**
* 作为内嵌编辑器被创建后默认获得焦点
*/
focusOnCreated: { type: Boolean, default: !1 },
/**
* 作为内嵌编辑器被创建后默认选中文本
*/
selectOnCreated: { type: Boolean, default: !1 },
/**
* 此属性废弃
*/
autoHeight: { type: Boolean, default: !0 },
/**
* 打开前
*/
beforeOpen: { type: Function, default: null },
load: { type: Function },
searchOption: {
type: [Boolean, Function],
default: !1
},
// 搜索启用高亮
enableHighlightSearch: { type: Boolean, default: !0 },
minPanelWidth: { type: Number, default: 160 },
popupOnClick: { type: Boolean, default: !0 },
/** 是否可扩展 */
expandable: { type: Boolean, default: !1 },
/** 扩展模式 text | button */
expandMode: { type: String, default: "text" },
/** 扩展文本内容 */
expandContent: { type: String, default: "" },
/** 扩展按钮是否禁用 */
expandDisabled: { type: Boolean, default: !1 },
popupClass: { type: String, default: "" },
/**
* 可选，是否隐藏禁用的数据项
* 默认`false`（禁用项显示为置灰状态）
* 设置为`true`时，禁用的数据项将不会在下拉列表中显示
*/
hideDisabledItems: { type: Boolean, default: !1 }
}, hn = Object.assign({}, ee, {
readonly: {}
});
oe(ee, xe, Ie, Te);
const Ve = ze(
ee,
xe,
Ie,
Te
), yn = gn(), bn = {
dataSource: { type: Array, default: [] },
enableSearch: { type: Boolean, default: !1 },
idField: { type: String, default: "id" },
multiSelect: { type: Boolean, default: !1 },
selectedValues: { type: String, default: "" },
separator: { type: String, default: "," },
textField: { type: String, default: "name" },
titleField: { type: String, default: "name" },
width: { type: Number },
maxHeight: { type: Number },
valueField: { type: String, default: "id" },
/** 值变化事件 */
onSelectionChange: { type: Function, default: () => {
} },
searchOption: {
type: [Boolean, Function],
default: !1
},
// 搜索启用高亮
enableHighlightSearch: { type: Boolean, default: !0 }
}, pn = /* @__PURE__ */ D({
name: "FComboListContainer",
props: bn,
emits: ["selectionChange"],
setup(e, t) {
const o = y(), a = y(e.dataSource), c = y(e.dataSource), f = y([]), i = y(e.separator), h = y(e.width), F = y(e.maxHeight), V = H(() => e.multiSelect), C = y(e.multiSelect ? String(e.selectedValues).split(i.value) : [e.selectedValues]), g = H(() => ({
enableSelectRow: !0,
multiSelect: e.multiSelect,
multiSelectMode: "OnCheckAndClick",
showCheckbox: V.value,
showSelectAll: !1,
showSelection: !0
}));
j(e.dataSource, () => {
a.value = e.dataSource, c.value = e.dataSource;
}), H(() => e.enableSearch ? "SearchBar" : "ContentHeader");
const I = H(() => {
const n = {};
return h.value !== void 0 && (n.width = `${h.value}px`), F.value !== void 0 && F.value > 0 && (n.maxHeight = `${F.value}px`), n;
});
function k(n) {
o.value.search(n);
}
function b(n) {
f.value = n.map((l) => Object.assign({}, l)), C.value = n.map((l) => l[e.idField]), t.emit("selectionChange", f.value);
}
function P(n) {
if (e.enableHighlightSearch)
return;
let l = [];
const {
searchOption: u
} = e;
typeof u == "function" ? l = a.value.filter((r) => u(n, r)) : l = a.value.filter((r) => r[e.valueField].indexOf(n) > -1 || r[e.textField].indexOf(n) > -1), o.value.updateDataSource(l);
}
j([() => e.selectedValues], ([n]) => {
e.multiSelect ? C.value = n.split(i.value) : C.value = [n];
});
function B(n) {
o.value.activeRowById(n);
}
return ie(() => {
var n, l;
if (!e.multiSelect) {
const u = (n = C.value) == null ? void 0 : n[0];
let r = u;
const s = a.value.map((m) => m[e.valueField || e.idField]);
if (!yt(u) && s.includes(u)) {
const m = typeof u, T = typeof ((l = a.value[0]) == null ? void 0 : l[e.valueField || e.idField]);
T === "number" && m !== T && (r = Number(u)), T === "boolean" && m !== T && (r = u === "true" ? !0 : u === "false" ? !1 : u), B(r);
}
}
}), t.expose({
search: k,
activeRowById: B
}), () => d("div", {
class: "f-combo-list-container",
style: I.value
}, [d(ht, {
ref: o,
size: "small",
itemClass: "f-combo-list-item",
itemContentClass: "text-truncate",
header: "ContentHeader",
headerClass: "f-combo-list-search-box",
data: a.value,
idField: e.idField,
textField: e.textField,
titleField: e.titleField,
multiSelect: e.multiSelect,
selection: g.value,
enableHighlightSearch: e.enableHighlightSearch,
selectionValues: C.value,
onSelectionUpdate: b,
onAfterSearch: P
}, null)]);
}
}), he = {
property: "all",
duration: 0.3,
timingFunction: "cubic-bezier(0.17, 0.89, 0.45, 1)",
delay: 0
}, Cn = (e, t) => {
const o = e.lineHeight / 2, a = Ue({ maxOverflowY: 44 }), c = K({ ...he }), f = (r) => {
t.emit("change", r);
}, i = K({
value: 0,
max: 0,
min: 0,
start: 0,
index: 0,
currentItem: void 0,
active: !1
}), h = () => {
i.max = e.visiableOptionCount / 2 * e.lineHeight;
const r = e.column.length * e.lineHeight;
i.min = i.max - r + e.lineHeight;
}, F = (r = 0) => {
h(), i.index = r, i.value = i.max - r * e.lineHeight, i.currentItem = e.column[r];
}, V = (r) => {
const s = e.column.length - 1, m = Math.min(i.index, s), T = e.column.findIndex((M) => M[e.valueField] === r);
return T >= 0 ? T : m;
}, C = (r) => {
const s = e.column.length - 1;
return i.index > s ? e.column[s] : e.column[r];
}, g = (r) => {
r && (i.currentItem = r, c.duration = 0);
const s = i.currentItem[e.valueField], m = V(s), T = C(i.index)[e.valueField];
F(m), s !== T && setTimeout(() => {
f(i.currentItem);
}, c.duration * 1e3);
}, I = () => {
const r = Array.isArray(e.value) ? e.value[0] : e.value;
F(V(r));
};
I(), j(() => e.value, () => {
e.multiSelect || I();
}), j(() => e.column, () => g());
const k = (r, s = i.max, m = i.min) => {
const T = i.start + r;
i.value = T > o ? Math.min(T, s) : Math.max(T, m), i.index = Math.round((i.max - i.value) / e.lineHeight), i.currentItem = C(i.index);
}, b = We(), P = (r) => {
b.start(r), i.active = !0, i.start = i.value, a.start(i.start), c.duration = 0;
}, B = (r) => {
r.preventDefault(), b.move(r), k(
b.deltaY.value,
i.max + e.lineHeight,
i.min - e.lineHeight
), a.move(b.deltaY.value), c.duration = he.duration;
}, n = (r) => {
const s = r < 0, m = r % e.lineHeight > o ? 1 : 0, T = Math.floor(r / e.lineHeight);
return (s ? T - m : T + m) * e.lineHeight + o;
};
return {
translateY: i,
transition: c,
onTouchStart: P,
onTouchMove: B,
onTouchEnd: () => {
i.start = 0;
const r = a.end();
let s = 0;
if (r) {
const { destination: m, duration: T } = a.get(i.value, i.min, i.max);
s = m, c.duration = T / 1e3;
} else
s = i.value;
k(n(s)), f(i.currentItem);
},
onTransitionend: () => {
i.active = !1;
},
updateTranslate: g
};
}, Sn = {
column: { type: Array, default: () => [] },
valueField: { type: String, default: "value" },
textField: { type: String, default: "text" },
value: { type: [Array, String, Number], default: () => [] },
multiSelect: { type: Boolean, default: !1 },
showIcon: { type: Boolean, default: !1 },
lineHeight: { type: Number, default: 0 },
visiableOptionCount: { type: Number, default: 5 }
}, wn = /* @__PURE__ */ D({
props: Sn,
emits: ["change", "click"],
setup(e, t) {
const {
addUnit: o
} = Z(), {
bem: a
} = pe("FComboTouchList"), {
translateY: c,
transition: f,
onTouchStart: i,
onTouchMove: h,
onTouchEnd: F,
onTransitionend: V
} = Cn(e, t), C = (k) => {
t.emit("click", k);
}, g = H(() => ({
transform: `translateY(${o(c.value)})`,
transition: `all ${c.active ? f.duration : 0}s ${f.timingFunction} 0s`
})), I = (k) => e.showIcon ? Array.isArray(e.value) && e.value.includes(k[e.valueField]) : !1;
return () => d("div", {
class: a("column"),
style: g.value,
onTouchstart: i,
onTouchmove: h,
onTouchend: F,
onTransitionend: V
}, [e.column.map((k) => d("div", {
class: a("column-item"),
onClick: () => C(k)
}, [d("span", null, [k[e.textField]]), I(k) && d("span", {
class: `f-icon f-icon-check ${a("column-item-icon")}`
}, null)]))]);
}
}), Fn = {
modelValue: { type: [String, Array], default: "" },
columns: { type: Array, default: () => [] },
title: { type: String, default: "" },
valueField: { type: String, default: "value" },
textField: { type: String, default: "text" },
childrenField: { type: String, default: "children" },
multiSelect: { type: Boolean, default: !1 },
lineHeight: { type: Number, default: 44 },
cancelText: { type: String, default: "取消" },
confirmText: { type: String, default: "确定" },
optionFormatter: { type: Function, default: void 0 },
visiableOptionCount: { type: Number, default: 5 },
showToolbar: { type: Boolean, default: !0 },
separator: { type: String, default: "," }
}, In = (e, t) => {
const { finalValue: o, initValue: a, setSelectedByIndex: c, getSelectedValueByIndex: f } = t, { isArray: i, isFunction: h, isObject: F } = Z(), V = (s) => s && s[0], C = H(() => {
var s;
return ((s = e.columns) == null ? void 0 : s.length) > 0 && i(e.columns[0]);
}), g = (s) => {
if ((s == null ? void 0 : s.length) === 0)
return !1;
const m = V(s);
return m && i(m[e.childrenField]);
}, I = (s, m) => {
const T = V(s), M = f(m);
let S = s.find((R) => R[e.valueField] === M);
S = S || T;
const O = S[e.childrenField] || [];
if (g(O)) {
const R = I(O, m + 1);
return [O, ...R];
}
return [O];
}, k = () => {
const s = e.columns, m = I(s, 0);
return [s, ...m];
}, b = (s, m) => {
const T = s[e.textField];
return h(e.optionFormatter) ? e.optionFormatter(m, s) : T;
}, P = (s, m) => s.map((T) => {
const M = F(T) ? T : { [e.valueField]: T, [e.textField]: T };
return M[e.textField] = b(M, m), M;
}), B = H(() => {
let s = [];
return C.value ? s = e.columns : g(e.columns) ? s = k() : s = [e.columns], s.map(P);
}), n = () => B.value.map((s, m) => {
const T = o.value[m];
return s.find((S) => S[e.valueField] === T);
}).filter((s) => s), l = () => n().map((s) => s[e.valueField]), u = () => n().map((s) => s[e.textField]).join("-"), r = () => {
B.value.forEach((s, m) => {
if (e.multiSelect)
o.value[m].forEach((M) => {
const S = s.find((O) => O[e.valueField] === M);
S && c(m, S);
});
else {
const T = o.value[m], M = s.find((S) => S[e.valueF