@farris/ui-vue
Version:
Farris Vue, a Farris Design based Vue3 component library.
792 lines (791 loc) • 24.5 kB
JavaScript
import { ref as v, computed as P, createVNode as t, Fragment as G, watch as Z, withModifiers as pe, withDirectives as ye, vModelText as we, defineComponent as ee, createTextVNode as Y } from "vue";
import { getCustomClass as N, getCustomStyle as $ } from "../common/index.esm.js";
import { useFilter as Ie, useIdentify as Se, useHierarchy as ke, useGroupData as be, useDataView as Ve, useSelection as Fe, usePagination as De, useRow as Me, useEdit as Oe, useVisualDataBound as Te, useVisualDataCell as Re, useVisualDataRow as Be, useVisualGroupRow as He, useVisualSummaryRow as xe, useVisualData as Pe, useSidebar as je, useColumn as Le, useVirtualScroll as _e, getPagination as Ae } from "../data-view/index.esm.js";
import { useI18n as Ge } from "vue-i18n";
import { FCheckbox as W } from "../checkbox/index.esm.js";
const te = {
/** 列集合 */
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, 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 } }
};
function Ee(e, l) {
function p(a) {
const i = [];
let m = a.nextNode();
for (; m; )
i.push(m), m = a.nextNode();
return i;
}
function I(a, i) {
const m = document.createTreeWalker(a, NodeFilter.SHOW_TEXT);
return p(m).map((C) => ({ textNode: C, text: (C.textContent || "").toLocaleLowerCase() })).map(({ textNode: C, text: u }) => {
const c = [];
let F = 0;
for (; F < u.length; ) {
const S = u.indexOf(i, F);
if (S === -1)
break;
c.push(S), F = S + i.length;
}
return c.map((S) => {
const y = new Range();
return y.setStart(C, S), y.setEnd(C, S + i.length), y;
});
}).flat();
}
function h(a) {
if (!CSS.highlights || (CSS.highlights.clear(), !a || !l))
return;
const i = I(l.value, a.toLocaleLowerCase()), m = new Highlight(...i);
CSS.highlights.set("search-result", m);
}
return { search: h };
}
function q(e, l, p, I, h, a, i, m, B, g) {
const O = v(e.size), C = v(e.textField), u = v(e.titleField), c = v(e.disableField), F = P(() => {
var n, s;
return ((n = e.selection) == null ? void 0 : n.multiSelect) && ((s = e.selection) == null ? void 0 : s.showCheckbox);
}), {
onMouseenterItem: S,
onMouseoverItem: y,
onMouseoutItem: D
} = a, {
getKey: k,
listViewItemClass: T,
onCheckItem: H,
onClickItem: j
} = i, r = P(() => {
const n = {
"text-overflow": "ellipsis",
overflow: "hidden",
"white-space": "nowrap"
};
return e.itemClass ? n : {
margin: O.value === "small" ? "0.25rem 0" : "8px 0",
...n
};
});
function o(n, s, R) {
return n.checked = m.findIndexInSelectedItems(n) > -1, t("li", {
class: T(n, s),
id: k(n, s),
key: k(n, s),
onClick: (M) => j(n, s, M),
onMouseenter: (M) => S(M, n, s),
onMouseover: (M) => y(M, n, s),
onMouseout: (M) => D(M, n, s)
}, [F.value && t("div", {
class: "f-list-select",
onClick: (M) => M.stopPropagation()
}, [t(W, {
id: "list-" + k(n, s),
customClass: "listview-checkbox float-left",
disabled: n[c.value],
checked: n.checked,
"onUpdate:checked": (M) => n.checked = M,
onChange: (M) => {
H(n, s, !M.checked);
}
}, null)]), t("div", {
class: "f-list-content"
}, [t("div", {
class: e.itemContentClass,
style: r.value,
title: n.raw[u.value] || n.raw[C.value]
}, [n.raw[C.value]])])]);
}
return {
renderItem: o
};
}
function ze(e, l, p, I, h, a, i, m, B, g) {
const O = v(e.multiSelect), C = v(e.disableField), u = v(e.textField), {
onMouseenterItem: c,
onMouseoverItem: F,
onMouseoutItem: S
} = a, {
getKey: y,
listViewItemClass: D,
listViewItemStyle: k,
onCheckItem: T,
onClickItem: H
} = i;
function j(o, n, s) {
return e.contentTemplate ? t(G, null, [e.contentTemplate({
item: o.raw,
index: n,
selectedItem: s
})]) : l.slots.content ? t(G, null, [l.slots.content && l.slots.content({
item: o.raw,
index: n,
selectedItem: s
})]) : t("div", {
style: "margin: 10px 0;"
}, [o.raw[u.value || "name"]]);
}
function r(o, n, s) {
return t("li", {
class: D(o, n),
id: y(o, n),
key: y(o, n),
style: k(o, n),
onClick: (R) => H(o, n, R),
onMouseenter: (R) => c(R, o, n),
onMouseover: (R) => F(R, o, n),
onMouseout: (R) => S(R, o, n)
}, [O.value && t("div", {
class: "f-list-select",
onClick: (R) => R.stopPropagation()
}, [t(W, {
id: "list-" + y(o, n),
customClass: "listview-checkbox",
disabled: o[C.value] || !o.checked,
checked: o.checked,
"onUpdate:checked": (R) => o.checked = R,
onChange: (R) => T(o, n, !R.checked)
}, null)]), t("div", {
class: "f-list-content"
}, [j(o, n, s)])]);
}
return {
renderItem: r
};
}
function Ne(e, l, p, I, h, a, i, m, B, g) {
const O = v(e.multiSelect), C = v(e.disableField), u = v(e.textField), {
onMouseenterItem: c,
onMouseoverItem: F,
onMouseoutItem: S
} = a, {
getKey: y,
listViewItemClass: D,
onCheckItem: k,
onClickItem: T
} = i, {
dragstart: H,
dragenter: j,
dragover: r,
dragend: o
} = I, {
removeItem: n
} = B, s = P(() => ({
margin: O.value ? "10px 0" : "10px 0px 10px 14px"
}));
function R(d, f = "") {
const x = d.target;
x.title = x.scrollWidth > x.clientWidth ? f : "";
}
function M(d) {
return t("div", {
style: s.value,
onMouseenter: (f) => R(f, d.raw[u.value || "name"])
}, [d.raw[u.value || "name"]]);
}
function L() {
return l.slots.itemContent ? l.slots.itemContent : M;
}
const A = L();
function w(d, f, x) {
return t("li", {
class: D(d, f),
id: y(d, f),
key: y(d, f),
onClick: (b) => T(d, f, b),
onMouseenter: (b) => c(b, d, f),
onMouseover: (b) => F(b, d, f),
onMouseout: (b) => S(b, d, f),
draggable: "true",
onDragstart: (b) => H(b, d, f),
onDragenter: (b) => j(b, f),
onDragend: (b) => o(b, d),
onDragover: (b) => r(b)
}, [O.value && t("div", {
class: "f-list-select",
onClick: (b) => b.stopPropagation()
}, [t(W, {
id: "list-" + y(d, f),
customClass: "listview-checkbox",
disabled: d[C.value] || !d.checked,
checked: d.checked,
"onUpdate:checked": (b) => d.checked = b,
onChange: (b) => k(d, f, !b.checked)
}, null)]), t("div", {
class: "f-list-content"
}, [A(d)]), t("div", {
class: "f-list-remove",
onClick: (b) => n(f)
}, [t("div", {
class: "f-list-remove-icon"
}, [t("i", {
class: "f-icon f-icon-remove_face"
}, null)])]), t("div", {
class: "f-list-handle"
}, [t("div", null, [t("i", {
class: "f-icon f-icon-drag-vertical"
}, null)])])]);
}
return {
renderItem: w
};
}
function We(e, l, p, I, h, a, i, m, B, g) {
var y;
const O = v(((y = e.group) == null ? void 0 : y.groupFields) || []), {
collpaseGroupIconClass: C
} = h, {
toggleGroupRow: u
} = g;
function c(D, k) {
k.collapse = !k.collapse, p.value = u(k.collapse ? "collapse" : "expand", k, p.value);
}
function F(D, k, T) {
return l.slots.group ? t(G, null, [l.slots.content && l.slots.group({
item: D.raw,
index: k,
selectedItem: T
})]) : t("div", {
class: "f-navlookup-recentHeader",
onClick: (H) => c(H, D)
}, [t("div", {
class: "fv-grid-group-row-icon"
}, [t("span", {
class: C(D)
}, null)]), t("div", {
class: "f-navlookup-recommandLabel"
}, [D.raw[O.value[D.layer]]])]);
}
function S(D, k, T) {
return D.layer > -1 && F(D, k, T);
}
return {
renderItem: S
};
}
function Ke(e, l, p, I) {
const { dataView: h } = p, { updateSelectedItems: a } = I;
function i(m) {
if (m > -1 && m < h.value.length) {
if (e != null && e.checkBeforeRemoveItem && !e.checkBeforeRemoveItem(h.value[m]))
return;
const B = h.value.splice(m, 1);
a(), l.emit("removeItem", B[0]);
}
}
return { removeItem: i };
}
function Ue(e, l, p, I, h, a, i, m, B, g) {
const {
t: O
} = Ge(), C = v(e.view), u = v(e.view === "CardView"), c = v({}), F = v(O("listView.emptyMessage")), S = Ke(e, l, I, B), y = P(() => ({
"f-list-view-group": !0,
"f-list-view-group-multiselect": e.multiSelect,
"d-flex": u.value,
"flex-wrap": u.value
})), D = P(() => !!p.value && p.value.length > 0), k = P(() => p.value.length === 0);
P(() => k.value && !l.slots.empty);
function T() {
return C.value === "SingleView" ? q : C.value === "DraggableView" ? Ne : (C.value === "ContentView" || C.value === "CardView") && (e.contentTemplate || l.slots.content) ? ze : q;
}
const H = T(), {
renderItem: j
} = H(e, l, p, g, h, a, B, i, S, m), {
renderItem: r
} = We(e, l, p, g, h, a, B, i, S, m), o = [j, r];
function n() {
return p.value.filter((M) => M.visible !== !1).map((M, L) => o[M.type](M, L, c));
}
function s() {
return t("div", {
class: "f-list-view-emptydata",
style: "margin: 0 auto;"
}, [t("p", {
class: "f-empty-title"
}, [e.emptyTemplate ? e.emptyTemplate() : l.slots.empty ? l.slots.empty() : F.value])]);
}
function R() {
return t("ul", {
class: y.value,
style: "list-style: none;"
}, [D.value && n(), k.value && s()]);
}
return {
renderListArea: R
};
}
function Xe(e, l, p) {
function I() {
return l.slots.header && t("div", {
class: "f-list-view-header"
}, [l.slots.header()]);
}
return {
renderHeader: I
};
}
function J(e, l, p) {
const I = v(e.headerClass), h = v(e.placeholder), a = v(""), i = P(() => !a.value), m = P(() => !!a.value);
function B(u) {
a.value = "";
}
Z(a, (u) => {
e.enableHighlightSearch && p.search(u), l.emit("afterSearch", u);
});
const g = P(() => {
const u = {
"form-group": !0,
"farris-form-group": !0
};
return I.value && I.value.split(" ").reduce((F, S) => (F[S] = !0, F), u), u;
});
function O(u) {
}
function C() {
return t("div", {
class: "f-list-view-header",
onClick: pe(() => O, ["prevent", "stop"])
}, [t("div", {
class: g.value
}, [t("div", {
class: "farris-input-wrap"
}, [t("div", {
class: "f-cmp-inputgroup"
}, [t("div", {
class: "input-group f-state-editable"
}, [ye(t("input", {
class: "form-control f-utils-fill text-left",
"onUpdate:modelValue": (u) => a.value = u,
name: "input-group-value",
type: "text",
placeholder: h.value,
autocomplete: "off"
}, null), [[we, a.value]]), t("div", {
class: "input-group-append"
}, [m.value && t("span", {
class: "input-group-text input-group-clear",
onClick: (u) => B()
}, [t("i", {
class: "f-icon f-icon-close-circle"
}, null)]), i.value && t("span", {
class: "input-group-text"
}, [t("span", {
class: "f-icon f-icon-search"
}, null)])])])])])])]);
}
return {
renderHeader: C
};
}
function Ye() {
const e = v(""), l = v(-1), p = v(""), I = v(-1), h = v(!1);
function a(C, u, c) {
I.value = c;
}
function i(C, u, c) {
h.value || (I.value = c);
}
function m(C, u, c) {
I.value = -1;
}
function B() {
h.value = !0;
}
function g() {
h.value = !1;
}
function O() {
l.value = -1, e.value = "";
}
return {
activeIndex: l,
focusedItemId: p,
hoverIndex: I,
clearActiveItem: O,
onMouseenterItem: a,
onMouseoverItem: i,
onMouseoutItem: m,
resumeHover: g,
suspendHover: B
};
}
function $e(e, l, p, I) {
const h = v(e.idField), { dataView: a } = p, i = v(-1), m = v(!1), { activeIndex: B, focusedItemId: g, hoverIndex: O, resumeHover: C, suspendHover: u } = I;
let c, F = 0, S = 0;
function y(r, o) {
const n = r - F, s = o - S;
c.style.left = parseInt(c.style.left) + n + "px", c.style.top = parseInt(c.style.top) + s + "px", F = r, S = o;
}
function D(r) {
const { left: o, top: n } = r.getBoundingClientRect(), s = r.cloneNode(!0);
return s.style.cssText = `
position:absolute;
left:${o}px;
top:${document.documentElement.scrollTop ? n + document.documentElement.scrollTop : n}px;
z-index: 999999;
border: 1px solid #e2e3e5;
pointer-events: none;
background-color: #edf5ff;
border-radius: 10px;
margin: 4px 2px;
display: flex;
align-items: center;
float: none;
text-align: initial;
width:${getComputedStyle(r).width};
height:${getComputedStyle(r).height};
`, s.children[0].style.cssText = "overflow: hidden;flex: 1 1 auto;width: 100%;", s.children[0].children[0].style.cssText = `
margin: 10px 0px 10px 14px;
overflow: hidden;text-overflow: ellipsis;white-space: nowrap;
`, s.children[1].style.cssText = "width: 30px;color: #f4625f;padding: 0 14px 0 0", s.children[2].style.cssText = "padding: 0 14px 0 0;", document.body.appendChild(s), s;
}
function k(r, o, n) {
if (r.stopPropagation(), u(), o) {
if (c = D(r.target), r.dataTransfer) {
const s = new Image();
s.src = "", r.dataTransfer.setDragImage(s, 0, 0);
}
F = r.pageX, S = r.pageY, setTimeout(() => {
i.value = n, m.value = !0, o.moving = !0;
});
}
}
function T(r, o) {
if (r.preventDefault(), i.value !== o) {
const n = a.value[i.value], s = a.value;
s.splice(i.value, 1), s.splice(o, 0, n), i.value = o, y(r.pageX, r.pageY);
}
}
function H(r) {
r.preventDefault(), r.dataTransfer && (r.dataTransfer.dropEffect = "move"), y(r.pageX, r.pageY);
}
function j(r, o) {
o && (o.moving = !1, c && (document.body.removeChild(c), c = null)), a.value.forEach((n, s) => {
n.__fv_index__ = s;
}), m.value = !1, C(), O.value = o.raw.__fv_index__, B.value = o.raw.__fv_index__, g.value = o.raw[h.value], l.emit("change", a.value), l.emit("activeChange", [o.raw]);
}
return {
dragstart: k,
dragenter: T,
dragover: H,
dragend: j,
isDragging: m
};
}
function qe(e, l, p, I, h, a) {
const i = v(e.idField), m = v(e.disableField), B = v(e.draggable);
v(e.itemClass);
const g = v(e.selection.multiSelect ?? !1), O = v(e.selection.multiSelectMode), { isDragging: C } = I, { activeIndex: u, focusedItemId: c, hoverIndex: F } = h, { clearSelection: S, getSelectedItems: y, toggleSelectItem: D, currentSelectedDataId: k } = a, T = v(y()), H = (w) => T.value.length === 0 ? !1 : T.value.some((d) => {
let f = "";
return d.data ? f = d.data[i.value] : f = d[i.value], f === w;
});
function j() {
T.value = y();
}
function r(w, d) {
return w.raw[i.value] != null ? w.raw[i.value] : "";
}
function o(w, d) {
const f = {
"f-list-view-group-item": !0,
"f-list-view-draggable-item": B.value,
"f-un-click": !w.checked,
"f-un-select": !!w.raw[m.value],
"f-listview-active": (
// 多选
g.value && H(r(w)) || // 单选
!g.value && w.raw[i.value] === k.value
),
"f-listview-hover": !C.value && d === F.value,
moving: !!w.moving
};
if (typeof e.itemClass == "string")
return N(f, e.itemClass);
if (typeof e.itemClass == "function") {
const x = e.itemClass(w);
return N(f, x);
}
return f;
}
function n(w, d) {
const f = (
// 多选
g.value && H(r(w)) || // 单选
!g.value && w.raw[i.value] === k.value
), x = {};
if (f && (x.backgroundColor = "#dae9ff"), typeof e.itemStyle == "string")
return $(x, e.itemStyle);
if (typeof e.itemStyle == "function") {
const b = e.itemStyle(w);
return $(x, b);
}
return x;
}
const s = P(() => !g.value);
function R(w, d, f) {
w.checked = f, !w.raw[m.value] && (s.value && (c.value = w.raw[i.value]), D(w));
}
const M = P(() => g.value && O.value === "OnCheckClearByClick"), L = P(() => !g.value || g.value && (O.value === "OnCheckAndClick" || O.value === "OnClick"));
function A(w, d, f) {
if (w.raw[m.value]) {
f == null || f.preventDefault(), f == null || f.stopPropagation();
return;
}
c.value = w.raw[i.value], u.value = d, M.value && S(), L.value && (D(w), j()), l.emit("clickItem", { data: T.value, index: d, dataItem: w.raw }), l.emit("activeChange", T.value);
}
return {
getKey: r,
selectedItems: T,
listViewItemClass: o,
listViewItemStyle: n,
updateSelectedItems: j,
onCheckItem: R,
onClickItem: A
};
}
const z = /* @__PURE__ */ ee({
name: "FListView",
props: te,
emits: ["afterSearch", "checkValuesChange", "clickItem", "selectItem", "unSelectItem", "selectionChange", "removeItem", "change", "activeChange", "pageIndexChanged", "pageSizeChanged", "changed"],
setup(e, l) {
const p = v(), I = v(!0), h = v(!1), a = v([]), i = 0, m = v(e.columns), B = Ie(e, l), g = Se(e), O = ke(e), C = be(e, g), u = Ve(e, /* @__PURE__ */ new Map(), B, O, g), c = Fe(e, u, g, a, l), F = Ee(e, p), S = De(e, u), y = P(() => u.dataView.value.length), D = Me(e, l, c, g), k = Oe(e, l, g, D, a), T = Te(e), H = Re(e, {}, T), j = Be(e, u, k, O, g, T, H), r = He(e, g, H, j), o = xe(e, g, H, j), n = Pe(e, m, u, y, i, j, r, o), {
getVisualData: s
} = n;
a.value = s(0, y.value + i - 1);
const R = P(() => {
const V = {
"f-list-view": !0,
"f-list-view-multiple": e.multiSelect
};
return e.size !== "default" && (V[`${e.size}-item`] = !0), N(V, e.customClass);
}), M = P(() => !!l.slots.footer || I.value);
function L() {
return e.header === "SearchBar" ? J : e.header === "ContentHeader" ? Xe : J;
}
const A = L(), {
renderHeader: w
} = A(e, l, F), d = Ye(), f = $e(e, l, u, d), x = qe(e, l, a, f, d, c), {
renderListArea: b
} = Ue(e, l, a, u, C, d, c, n, x, f);
function ne(V) {
F.search(V);
}
function le(V) {
V && (u.load(V), a.value = s(0, y.value + i - 1));
}
function ae() {
c.clearSelection(), d.clearActiveItem();
}
function oe() {
return x.selectedItems.value;
}
function se() {
return x.selectedItems.value.map((V) => V[g.idField.value]);
}
function K(V) {
c.selectedValues.value = V, x.updateSelectedItems();
}
function ie() {
return c.currentSelectedDataId.value;
}
function ue(V) {
D.activeRowById(V);
}
function ce(V) {
const _ = g.idField.value, U = a.value.find((E) => E.raw[_] === V), X = a.value.findIndex((E) => E.raw[_] === V);
U && X > -1 && x.onClickItem(U, X);
}
function re(V) {
S.updatePagination(V);
}
function de(V) {
return a.value.filter((_) => V.includes(_.raw[e.idField]));
}
l.expose({
search: ne,
updateDataSource: le,
clearSelection: ae,
getSelections: oe,
updateSelectionByIds: K,
getSelectionIds: se,
activeRowById: ue,
getCurrentRowId: ie,
clickRowItemById: ce,
updatePagination: re,
getVisibleDataByIds: de
});
function fe(V) {
e.multiSelect && (V.preventDefault(), V.stopPropagation());
}
Z(() => e.selectionValues, (V, _) => {
V !== _ && K(V);
});
const ve = je(e, c), {
sidebarWidth: me,
showSidebarCheckBox: Je
} = ve, ge = Le(e, l), {
applyColumnSorter: Qe,
columnContext: he,
updateColumnRenderContext: Ze
} = ge, Ce = _e(e, u, a, he, n, y, i, me, k);
return Ae(e, l, u, Ce, S, c), () => t("div", {
class: R.value,
onClick: fe
}, [w(), t("div", {
ref: p,
class: "f-list-view-content",
onMouseover: () => {
h.value = !0;
},
onMouseleave: () => {
h.value = !1;
}
}, [b()]), M.value && t("div", {
class: "f-list-view-footer"
}, [e.footerTemplate ? e.footerTemplate() : l.slots.footer && l.slots.footer()])]);
}
}), Q = /* @__PURE__ */ ee({
name: "FListViewTable",
props: te,
emits: ["outputValue", "currentEvent", "selectionChanged"],
setup(e, l) {
const p = [{
name: "任芳",
code: "1.PO20198989001",
date: "2024-02-19",
desc: "导游1",
amount: 63.85,
avatar: "./assets/avatar1.png"
}, {
name: "戴秀兰",
code: "2.PO20198989002",
date: "2024-03-17",
desc: "导游2",
amount: 60.13,
avatar: "./assets/avatar2.png"
}, {
name: "尹磊",
code: "3.PO20198989003",
date: "2024-04-09",
desc: "导游3",
amount: 36.54,
avatar: "./assets/avatar3.png"
}, {
name: "赵明",
code: "4.PO20198989004",
date: "2024-03-27",
desc: "导游4",
amount: 52.76,
avatar: "./assets/avatar4.png"
}, {
name: "吕洋",
code: "5.PO20198989005",
date: "2024-11-17",
desc: "导游5",
amount: 84.13,
avatar: "./assets/avatar5.png"
}], I = P(() => e.data.length > 0 ? e.data : p);
return () => {
var h;
return t(G, null, [(h = I.value) == null ? void 0 : h.map((a) => t("div", {
class: "f-template-listview-row"
}, [t("div", {
class: "list-view-item-title"
}, [t("div", {
class: "item-title-img"
}, [t("img", {
src: a.avatar,
alt: "",
style: "width: 44px;"
}, null)]), t("div", {
class: "item-title"
}, [t("p", {
class: "item-title-heading"
}, [a.code]), t("p", {
class: "item-title-text"
}, [a.desc])])]), t("div", {
class: "list-view-item-content"
}, [t("div", {
class: "content-message"
}, [t("div", {
class: "ower"
}, [t("p", null, [Y("创建人")]), t("p", {
class: "con"
}, [a.name])]), t("div", {
class: "date"
}, [t("p", null, [Y("创建时间")]), t("p", {
class: "con"
}, [a.date])])])])]))]);
};
}
});
z.install = (e) => {
e.component(z.name, z), e.component(Q.name, Q);
};
export {
z as FListView,
Q as FListViewTable,
z as default,
te as listViewProps
};