@aplus-frontend/ui
Version:
241 lines (240 loc) • 7.88 kB
JavaScript
import { defineComponent as ue, shallowRef as V, computed as m, toRef as ce, unref as t, watch as L, createElementBlock as s, openBlock as o, normalizeStyle as D, normalizeClass as l, renderSlot as u, createElementVNode as fe, createCommentVNode as N, createVNode as h, Fragment as O, createBlock as A, withCtx as B, renderList as de, mergeProps as me } from "vue";
import { Empty as $, Spin as pe, Pagination as ge } from "@aplus-frontend/antdv";
import { throttle as Se, isUndefined as M, isNumber as ye, omit as ve } from "lodash-unified";
import { RecycleScroller as he, DynamicScroller as be, DynamicScrollerItem as ke } from "vue-virtual-scroller";
import "vue-virtual-scroller/dist/vue-virtual-scroller.css";
import { useTablePaging as Ie } from "../ap-table/hooks/use-table-paging-ng.mjs";
import "../config-provider/index.mjs";
import { useOfflineList as Pe } from "./hooks/use-offline-list.mjs";
import we from "./style/index.mjs";
import { useNamespace as De } from "../config-provider/hooks/use-namespace.mjs";
const Oe = /* @__PURE__ */ ue({
name: "ApList",
__name: "index",
props: {
dataSource: {},
loading: { type: Boolean, default: void 0 },
onItem: {},
params: {},
request: {},
defaultData: {},
onLoadingChange: {},
beforeSearchSubmit: {},
pagination: { type: [Boolean, Object], default: void 0 },
manual: { type: Boolean },
containerStyle: { type: [Boolean, null, String, Object, Array] },
contentStyle: { type: [Boolean, null, String, Object, Array] },
footerWarpperStyle: { type: [Boolean, null, String, Object, Array] },
virtual: { default: void 0 },
rowKey: {},
adaptive: { type: Boolean, default: !1 },
fetchMode: { default: "paging" }
},
setup(j, { expose: q }) {
const K = $.PRESENTED_IMAGE_SIMPLE, a = j, { b: p, e: b, bm: H, m: W } = De("ap-list"), G = we("ap-list"), c = V(), g = V(), S = m(() => a.fetchMode === "paging"), {
formRef: k,
submit: U,
reset: J,
handleTableChange: Q,
fetchNextPageAndCache: C,
data: I,
refresh: X,
refreshByDelete: Y,
tableProps: P,
getPaging: Z,
setPaging: _
} = Ie({
async request(e) {
const n = await a.request?.(e);
return {
data: n?.data || [],
total: n?.total || 0
};
},
params: ce(a, "params"),
defaultData: a.defaultData,
manual: a.manual,
pagination: a.pagination,
formatParams: a.beforeSearchSubmit
});
let y = 0;
function x() {
const e = c.value;
if (S.value || !e)
return;
const n = e.scrollTop, r = e.scrollHeight - e.clientHeight;
y >= r && (y = 0), !(y > n) && r - n <= 1 && (y = n, C());
}
function E() {
!S.value && C();
}
const z = Se(x, 300), ee = { form: k }, {
pagination: T,
dataSource: te,
onChange: ae
} = Pe(a);
function ne(e, n) {
if (t(v)) {
ae(e, n);
return;
}
Q(
{ current: e, pageSize: n },
{},
{},
{ currentDataSource: [], action: "paginate" }
);
}
const f = m(() => t(v) ? t(te) : [...t(I).records || []]), d = m(() => M(a.loading) ? t(I).loading : a.loading), re = m(() => a.pagination === !1 || a.virtual ? !1 : a.pagination?.hideOnSinglePage !== !0 ? !0 : t(v) ? (a.dataSource?.length || 0) > t(T).pageSize : t(I).total > t(P).pagination.pageSize), v = m(() => !M(a.dataSource));
L(
() => t(d),
(e) => {
a.onLoadingChange?.(e);
}
), L(
() => a.params,
() => {
w();
},
{
deep: !0
}
);
function oe(e) {
c.value?.querySelector(e || ":first-child")?.scrollIntoView({ behavior: "smooth", block: "center" });
}
function le(e = !1) {
const n = k.value?.apForm;
return (e ? n?.getFieldsValueTransformed : n?.getFieldsValue)?.() || {};
}
function ie(e) {
k.value?.apForm?.setFieldsValue?.(e);
}
function w() {
S.value || (c.value && (c.value.scrollTop = 0), g.value && g.value.scrollToPosition?.(0));
}
function F() {
w(), U();
}
function R() {
w(), J();
}
return q({
submit: F,
reset: R,
refresh: () => X(),
refreshByDelete: (e) => Y(e),
scrollToFirstRow: oe,
getSearchFormValuesIfSetted: le,
setPaging: _,
getPaging: Z,
setSearchFormValuesIfSetted: ie
}), (e, n) => (o(), s("div", {
class: l([t(p)(), { [t(W)("adaptive")]: e.adaptive }, t(G)]),
style: D(e.containerStyle)
}, [
u(e.$slots, "header", {
formIns: ee,
submit: F,
reset: R,
loading: t(P).loading
}),
fe("div", {
class: l([
t(p)("content-container"),
{ [t(H)("content-container", "spinning")]: d.value }
])
}, [
d.value ? (o(), s("div", {
key: 0,
class: l(t(b)("spin-wrapper"))
}, [
h(t(pe), { spinning: d.value }, null, 8, ["spinning"])
], 2)) : N("", !0),
f.value.length === 0 ? u(e.$slots, "empty", {
key: 1,
loading: d.value
}, () => [
h(t($), { image: t(K) }, null, 8, ["image"])
]) : (o(), s("div", {
key: 2,
ref_key: "contentRef",
ref: c,
style: D(e.contentStyle),
class: l(t(b)("content")),
onScroll: n[0] || (n[0] = //@ts-ignore
(...r) => t(z) && t(z)(...r))
}, [
e.virtual ? (o(), s(O, { key: 0 }, [
t(ye)(e.virtual) ? (o(), A(t(he), {
key: 0,
ref_key: "scroller",
ref: g,
class: l(t(p)("scroll-wrapper")),
items: f.value,
"item-size": e.virtual,
"key-field": a.rowKey || "id",
onScrollEnd: E
}, {
default: B(({ item: r, index: i }) => [
u(e.$slots, "renderItem", {
item: r,
index: i
})
]),
_: 3
}, 8, ["class", "items", "item-size", "key-field"])) : (o(), A(t(be), {
key: 1,
ref_key: "scroller",
ref: g,
items: f.value,
"min-item-size": e.virtual.minItemSize,
class: l(t(p)("scroll-wrapper")),
"key-field": a.rowKey || "id",
onScrollEnd: E
}, {
default: B(({ item: r, index: i, active: se }) => [
h(t(ke), {
item: r,
active: se,
"data-index": i,
"size-dependencies": e.virtual.sizeDependencies?.(r)
}, {
default: B(() => [
u(e.$slots, "renderItem", {
item: r,
index: i
})
]),
_: 2
}, 1032, ["item", "active", "data-index", "size-dependencies"])
]),
_: 3
}, 8, ["items", "min-item-size", "class", "key-field"]))
], 64)) : u(e.$slots, "renderContent", {
key: 1,
dataSource: f.value
}, () => [
(o(!0), s(O, null, de(f.value, (r, i) => u(e.$slots, "renderItem", {
item: r,
index: i
})), 256))
])
], 38))
], 2),
S.value && re.value ? (o(), s("div", {
key: 0,
class: l(t(b)("footer")),
style: D(e.footerWarpperStyle)
}, [
h(t(ge), me(
v.value ? t(T) : t(ve)(t(P).pagination, ["showTotal"]),
{ onChange: ne }
), null, 16)
], 6)) : N("", !0)
], 6));
}
});
export {
Oe as default
};