@farris/ui-vue
Version:
Farris Vue, a Farris Design based Vue3 component library.
817 lines (816 loc) • 27.5 kB
JavaScript
import { useCommonUtils as bt, getCustomClass as Bt, withInstall as Ft } from "../common/index.esm.js";
import { reactive as ze, watch as W, createVNode as i, isVNode as Ot, Comment as It, Fragment as Gt, defineComponent as Vt, ref as h, computed as w, onMounted as xt, nextTick as Dt, onUnmounted as kt, provide as Pt, createTextVNode as Et } from "vue";
import { useResizeObserver as Nt } from "@vueuse/core";
import { CellMode as Rt, useIdentify as Tt, useGroupData as jt, useFilter as Mt, useHierarchy as Ht, useLoading as At, useDataView as zt, usePagination as Lt, useSelection as Wt, useDataViewContainerStyle as Kt, useCommandColumn as Ut, useSettingColumn as qt, useColumn as Yt, useSort as $t, useGroupColumn as Jt, useRow as Qt, useEdit as Xt, useVisualDataBound as Zt, useVisualDataCell as _t, useVisualDataRow as en, useVisualGroupRow as tn, useVisualSummaryRow as nn, useVisualData as ln, useCellContentStyle as an, useCellPosition as on, useSidebar as un, useVirtualScroll as sn, useFitColumn as rn, useFilterHistory as dn, useColumnFilter as cn, useDragColumn as fn, getColumnHeader as yn, getPagination as mn, getSidebar as gn, getDisableMask as pn, getSummary as vn, getHorizontalScrollbar as Cn, getVerticalScrollbar as hn, getFilterPanel as Sn, getGroupPanel as wn, useNavigation as bn, getEmpty as Bn } from "../data-view/index.esm.js";
const kn = {
/** 启用分页 */
enable: { type: Boolean, default: !1 },
/** 当前页码 */
index: { type: Number, default: 1 },
/** 分页交互模式 */
mode: { type: String, default: "client" },
/** 显示页码输入框 */
showGoto: { type: Boolean, default: !1 },
/** 显示页码 */
showIndex: { type: Boolean, default: !0 },
/** 显示每页记录数 */
showLimits: { type: Boolean, default: !1 },
/** 显示分页汇总信息 */
showPageInfo: { type: Boolean, default: !0 },
/** 默认每页记录数 */
size: { type: Number, default: 20 },
/** 可选择的没有记录数据 */
sizeLimits: { type: Array, default: [10, 20, 30, 50, 100] },
/** 总记录数 */
total: { type: Number, default: 0 },
/** 禁用分页 */
disabled: { type: Boolean, default: !1 }
}, Pn = {
/** 启用排序 */
enable: { type: Boolean, default: !1 },
/** 排序字段集合 */
fields: { type: Array, default: [] },
/** 排序交互模式 */
mode: { type: String, default: "client" },
/** 多列排序 */
multiSort: { type: Boolean, default: !1 }
}, En = {
/** 自定义分组合计内容 */
customGroupRow: { type: Function, default: () => {
} },
/** 自定义分组行样式 */
customGroupRowStyle: { type: Function, default: () => {
} },
/** 自行分组合计行样式 */
customSummaryStyle: { type: Function, default: () => {
} },
/** 启用行数据分组 */
enable: { type: Boolean, default: !1 },
/** 分组行合并列数 */
groupColSpan: { type: Number, default: 1 },
/** 行数据分组字段；多字段分组以英文逗号分隔 */
groupFields: { type: Array, default: [] },
/** 在DataGrid中显示被分组的列 */
showGroupedColumn: { type: Boolean, default: !0 },
/** 显示分组面板 */
showGroupPanel: { type: Boolean, default: !1 },
/** 启用合计行 */
showSummary: { type: Boolean, default: !1 },
/** 显示合计行位置； */
summaryPosition: { type: String, default: "separate" }
}, Nn = {
/** 启用筛选 */
enable: { type: Boolean, default: !1 },
/** DataGrid筛选风格 */
filterStyle: { type: String, default: "filter-column" },
/** 筛选交互模式 */
mode: { type: String, default: "server" },
/** 显示过滤条件工具条 */
showSummary: { type: Boolean, default: !0 }
}, Rn = {
/** 允许折行显示列标题 */
wrapHeadings: { type: Boolean, default: !1 }
}, Tn = {
/** 显示行号 */
enable: { type: Boolean, default: !1 },
/** 行号列表头标题 */
heading: { type: String, default: "序号" },
/** 行号宽度，默认为 36px */
width: { type: Number, default: 36 },
/** 是否展示省略号 */
showEllipsis: { type: Boolean, default: !0 }
}, jn = {
/** 自定义行样式 */
customRowStyle: { type: Function, default: () => {
} },
/** 自定义行状态 */
customRowStatus: { type: Function, default: () => {
} },
/** 禁止行选中表达式 */
disable: { type: Function, default: () => {
} },
/** 默认行高度为 29px */
height: { type: Number, default: 28 },
/** 鼠标滑过行效果 */
showHovering: { type: Boolean, default: !0 },
/** 禁止数据折行 */
wrapContent: { type: Boolean, default: !1 }
}, Mn = {
/** 显示合计信息 */
enable: { type: Boolean, default: !1 },
/** 合计行自定义样式，对启用合计行模板无效 */
customSummaryStyle: { type: Function, default: () => {
} },
/** 分组合计字段 */
groupFields: { type: Array, default: [] },
/** 合计交互模式 */
mode: { type: String, default: "client" },
/** 合计行显示位置， top: 顶部 bottom: 底部， both: 顶部与底部同时显示 */
position: { type: String, default: "bottom" }
}, Hn = {
/** 自动列宽。设为true后，所有列将填满表格并不会出现横向滚动条。 */
fitColumns: { type: Boolean, default: !1 },
/** 自动适配列宽度模式 */
fitMode: { type: String, default: "average" },
groups: { type: Array, defaut: [] },
/** 允许拖动表头改变列显示顺序 */
reorderColumn: { type: Boolean, default: !1 },
/** 允许拖动改变列宽度 */
resizeColumn: { type: Boolean, default: !0 },
/** 双击表头列自适应内容宽度 */
resizeColumnOnDoubleClick: { type: Boolean, default: !0 }
}, An = {
/** 启用多选且显示checkbox, 选中行后勾选前面的checkbox */
checkOnSelect: { type: Boolean, default: !1 },
/** 当数据源为空时，清空已选记录 */
clearSelectionOnEmpty: { type: Boolean, default: !0 },
/** 自定义已选记录列表中的显示内容 */
customSelectionItem: { type: Function, default: () => {
} },
/** 允许选中行 */
enabelSelectRow: { type: Boolean, default: !0 },
/** 允许重复点击行是保留选中状态 */
keepSelectingOnClick: { type: Boolean, default: !0 },
/** 允许跨页多选 */
keepSelectingOnPaging: { type: Boolean, default: !0 },
/** 启用多选 */
multiSelect: { type: Boolean, default: !1 },
/** 启用多选时，点击行选中，只允许且只有一行被选中 */
focusSelection: { type: String, default: "current" },
/** 启用多选且显示checkbox, 勾选后并且选中行 */
selectOnCheck: { type: Boolean, default: !1 },
/** 每行前边显示 checkbox */
showCheckbox: { type: Boolean, default: !1 },
/** 显示全选checkbox */
showSelectAll: { type: Boolean, default: !1 },
/** 显示已选数据 */
showSelection: { type: Boolean, default: !1 }
}, zn = {
/** 编辑时选中文本 */
selectOnEditing: { type: Boolean, default: !1 },
/** 编辑模式； row：整行编辑，cell: 单元格编辑 */
editMode: { type: String, default: "cell" }
}, Ln = {
/** show loading */
show: { type: Boolean, default: !1 },
/** message on display when loading */
message: { type: String, default: "加载中..." }
}, Fn = {
/** 自定义样式 */
customClass: { type: String, default: "" },
/** 允许在最后一个单元回车新增一行 */
appendOnEnterAtLastCell: { type: Boolean, default: !1 },
/** 编辑单元格前事件 */
beforeEditCell: {
type: Function,
default: (t) => !0
},
/** 结束编辑前校验 */
beforeEndEditCell: { type: Function, default: () => !0 },
/** 变更策略 默认主动更新 */
changePolicy: { type: String, default: "push" },
/** 列集合 */
columns: { type: Array, default: [] },
/** 列配置 */
columnOption: { type: Object },
/** 列配置 */
commandOption: {
type: Object,
default: {
enable: !1,
commands: [],
halign: "center"
}
},
/** 被绑定数据 */
data: { type: Array, default: [] },
/** 禁用组件 */
disabled: { type: Boolean, default: !1 },
/** 行数据禁用属性 */
disabledField: { type: String, default: "disabled" },
/** 允许编辑 */
editable: { type: Boolean, default: !1 },
/** 编辑配置 */
editOption: { type: Object, default: { selectOnEditing: !1, editMode: "cell" } },
enableCommands: { type: Boolean, default: !1 },
/** 表格启用过滤 */
enableFilter: { type: Boolean, default: !1 },
/** 筛选配置 */
filter: { type: Object },
/** 适配父组件尺寸 ---此属性没有实际效用*/
fit: { type: Boolean, default: !1 },
/** 编辑单元格时默认获得焦点 */
focusOnEditingCell: { type: Boolean, default: !0 },
/** 分组配置 */
group: { type: Object },
/** 列标题配置 */
header: { type: Object },
/** 高度 */
height: { type: Number, default: -1 },
/** DataGrid组件唯一标识 */
id: { type: String, default: "" },
/** 被绑定数据的标识字段 */
idField: { type: String, default: "id", require: !0 },
/** 展示loading */
loading: { type: Boolean, default: !1 },
/** 纵向合并具有相同值的单元格 */
mergeCell: { type: Boolean, default: !1 },
/** 最小高度 */
minHeight: { type: Number, default: 300 },
/** 最小宽度 */
minWidth: { type: Number, default: 400 },
/** 新建数据 */
newDataItem: { type: Function, default: () => {
} },
/** 分页配置 */
pagination: { type: Object, default: { enable: !1, size: 20 } },
/** 行号配置 */
rowNumber: {
type: Object,
default: {
enable: !0,
width: 32,
showEllipsis: !0,
heading: "序号"
}
},
/** 行配置 */
rowOption: { type: Object, default: { wrapContent: !1 } },
/** 选择配置 */
selection: {
type: Object,
default: {
enableSelectRow: !0,
multiSelect: !1,
multiSelectMode: "DependOnCheck",
showCheckbox: !1,
showSelectAll: !1,
showSelection: !1,
keepSelectingOnClick: !0
}
},
/** 已选数据标识 */
selectionValues: { type: Array, default: [] },
/** 编辑单元格时默认选中单元格文本 */
selectOnEditingCell: { type: Boolean, default: !1 },
/** 显示边框 */
showBorder: { type: Boolean, default: !1 },
/** 显示底部面板 */
showFooter: { type: Boolean, default: !1 },
/** 显示顶部面板 */
showHeader: { type: Boolean, default: !0 },
/** 显示横向行分割线 */
showHorizontalLines: { type: Boolean, default: !0 },
/** 显示滚动条 */
showScrollBar: { type: String, default: "auto" },
/** 显示设置按钮 */
showSetting: { type: Boolean, default: !1 },
/** 显示条纹 */
showStripe: { type: Boolean, default: !0 },
/** 显示纵向列分割线 */
showVerticallLines: { type: Boolean, default: !1 },
/** 排序配置 */
sort: { type: Object },
/** 合计配置 */
summary: {
type: Object,
default: {
// 默认合计行开启后,后面不展示值,所以默认不开启
enable: !1,
groupFields: ["numericField1", "numericField2"]
}
},
/** 启用虚拟渲染 */
virtualized: { type: Boolean, default: !0 },
/** 宽度 */
width: { type: Number, default: -1 },
/** 空数据模板 */
emptyTemplate: { type: Object }
};
function On(t, m, E, ie, G, C, g, ue, s, V, se, K, d, U, N, q) {
const {
isNull: x,
isUndefined: Y
} = bt(), {
totalItems: Ce,
rawView: he
} = q, {
calculateCellPositionInRow: o,
cellKey: b,
cellPosition: D,
rowKey: y,
rowPosition: $,
rowSpanCellPosition: R,
groupCellPosition: re,
summaryCellPosition: Se
} = g, {
cellContentClass: we,
cellContentPosition: T,
cellContentClassWithEllipsis: j
} = C, {
collpaseGroupIconClass: be
} = V, {
gridCellClass: de,
gridRowClass: M,
onClickRow: ce,
onMouseoverRow: p,
onMouseoutRow: H
} = K, {
onClickCell: fe
} = s, {
toggleGroupRow: k
} = d, {
columnContext: B,
hasLeftFixedColumn: J,
hasRightFixedColumn: F
} = ue, {
navigateOnKeyUp: v,
navigateOnKeyDown: Be
} = se, O = (e) => (e || []).some((a) => Ot(a) ? !(a.type === It || a.type === Gt && !O(a.children)) : !0) ? e : null, Q = (e) => {
var a, u, n;
return ((u = (a = e.column) == null ? void 0 : a.editor) == null ? void 0 : u.type) === "switch" || ((n = e.column) == null ? void 0 : n.dataType) === "boolean" ? {
display: "flex",
flexGrow: "1",
overflow: "hidden"
} : {
flexGrow: "1"
};
}, X = ze({
"fv-grid-content-left-fixed": !0
}), Z = ze({
"fv-grid-content-right-fixed": !0
});
W([Ce, he], (e) => {
!e[0] && !e[1].length ? (X["fv-grid-content-left-fixed"] = !1, Z["fv-grid-content-right-fixed"] = !1) : (X["fv-grid-content-left-fixed"] = !0, Z["fv-grid-content-right-fixed"] = !0);
});
const {
gridDataStyle: _,
gridMergedDataStyle: ye,
leftFixedGridDataStyle: Fe,
leftFixedGridMergedDataStyle: Oe,
rightFixedGridDataStyle: ee,
rightFixedGridMergedDataStyle: Ie
} = U;
function Ge(e, a) {
a.collapse = !a.collapse, N.value = k(a.collapse ? "collapse" : "expand", a, N.value);
}
function c(e, a) {
const u = [];
if (e.groupField && a[e.groupField]) {
for (let f = 0; f <= e.layer; f++)
u.push(i("div", {
class: "fv-grid-group-row-icon",
onClick: (L) => Ge(L, e)
}, [i("span", {
class: be(e)
}, null)]));
const n = e.data[e.groupField];
u.push(i("div", {
ref: n.setRef,
key: b(e, e.layer + 1),
class: "fv-grid-cell",
style: re(n, a, e.layer)
}, [n.data])), Object.values(e.data).filter((f) => f.field !== e.groupField && f.colSpan !== 0).forEach((f) => {
u.push(i("div", {
ref: f.setRef,
key: b(e, f.index),
class: "fv-grid-cell",
style: D(f, a)
}, [f.data]));
});
}
return u;
}
function Ve(e, a, u) {
return e.layer > -1 && i("div", {
ref: e.setRef,
key: y(e),
class: M(e, u),
style: $(e),
onClick: (n) => ce(n, e),
onMouseover: (n) => p(n, e)
}, [c(e, a)]);
}
function me(e, a) {
const u = [];
if (e.groupField && a[e.groupField]) {
const n = e.data[e.groupField];
u.push(i("div", {
ref: n.setRef,
key: b(e, e.layer + 1),
class: "fv-grid-cell",
style: Se(n, a, e.layer)
}, [n.data]));
}
return u;
}
function ge(e, a, u) {
return e.layer > -1 && i("div", {
ref: e.setRef,
key: y(e),
class: M(e, u),
style: $(e),
onClick: (n) => ce(n, e),
onMouseover: (n) => p(n, e)
}, [me(e, a)]);
}
function A(e, a) {
var u, n, f;
return e.showTips && typeof ((u = e.column) == null ? void 0 : u.formatter) != "function" && ((n = e.column) == null ? void 0 : n.dataType) !== "commands" && ((f = e.column) == null ? void 0 : f.dataType) !== "setting" ? i("div", {
class: j(e),
title: e.formatter(e, a)
}, [e.formatter(e, a)]) : i("div", {
class: j(e)
}, [e.formatter(e, a)]);
}
function I(e) {
const a = !x(e.data) && !Y(e.data) ? e.data.toString() : e.data;
return e.showTips ? i("div", {
class: j(e),
title: a
}, [a]) : i("div", {
class: j(e)
}, [a]);
}
function xe(e, a) {
return !x(e.data) && !Y(e.data) ? e.data.toString() : e.data, e.mode === Rt.editing ? i("div", {
style: Q(e)
}, [e.getEditor(e)]) : e.column.columnTemplate ? e.column.columnTemplate(e, a) : e.formatter ? A(e, a) : I(e);
}
function te(e, a, u) {
return i("div", {
ref: e.setRef,
key: y(e),
class: M(e, u),
style: $(e),
onClick: (n) => ce(n, e),
onMouseover: (n) => p(n, e),
onMouseout: (n) => H(n, e)
}, [Object.values(e.data).filter((n) => a[n.field] && n.rowSpan === 1).map((n) => {
var L, ve;
const f = m.slots.cellTemplate && O(m.slots.cellTemplate({
cell: n,
row: e
}));
return i("div", {
ref: n.setRef,
key: b(e, n.index),
class: de(n),
style: D(n, a),
onClick: (ae) => fe(ae, n, e, n.column),
onKeydown: (ae) => v(ae, n)
}, [i("div", {
class: we(n),
style: T(n)
}, [f ? (ve = (L = m.slots).cellTemplate) == null ? void 0 : ve.call(L, {
cell: n,
row: e
}) : xe(n, e)])]);
})]);
}
const ne = [te, Ve, ge];
function z(e, a) {
const u = o(e);
return N.value.map((n, f) => ne[n.type](n, u, f));
}
function le(e) {
const a = o(e);
return N.value.map((u) => Object.values(u.data).filter((n) => a[n.field] && n.rowSpan > 1).map((n) => i("div", {
key: b(u, n.index),
class: "fv-grid-cell fv-grid-merged-cell",
style: R(u, n, a)
}, [n.data])));
}
function pe() {
return i("div", {
ref: ie,
class: X
}, [i("div", {
class: "fv-grid-data",
style: Fe.value
}, [z(B.value.leftColumns.filter((e) => e.visible))]), i("div", {
class: "fv-grid-merge-date",
style: Oe.value
}, [le(B.value.leftColumns.filter((e) => e.visible))])]);
}
function De() {
return i("div", {
ref: E,
class: "fv-grid-content-primary"
}, [i("div", {
class: "fv-grid-data",
style: _.value
}, [z(B.value.primaryColumns.filter((e) => e.visible))]), i("div", {
class: "fv-grid-merge-date",
style: ye.value
}, [le(B.value.primaryColumns.filter((e) => e.visible))])]);
}
function ke() {
return i("div", {
ref: G,
class: Z
}, [i("div", {
class: "fv-grid-data",
style: ee.value
}, [z(B.value.rightColumns.filter((e) => e.visible))]), i("div", {
class: "fv-grid-merge-date",
style: Ie.value
}, [le(B.value.rightColumns.filter((e) => e.visible))])]);
}
function Pe() {
const e = [];
return J.value && e.push(pe()), e.push(De()), F.value && e.push(ke()), e;
}
return {
renderDataArea: Pe
};
}
const In = /* @__PURE__ */ Vt({
name: "FDataGrid",
props: Fn,
emits: ["changed", "clickRow", "doubleClickRow", "selectionChange", "unSelectItem", "selectItem", "enterUpInLastCell", "selecAll", "unSelectAll", "pageIndexChanged", "pageSizeChanged", "beginEditCell", "endEditCell", "filterChanged", "sortChanged"],
setup(t, m) {
var Me, He;
h();
const E = 0, ie = ((Me = t.rowOption) == null ? void 0 : Me.height) || 28, G = h(20), C = h(t.columns), g = Tt(t), ue = h(), s = h(), V = h(), se = h(), K = h(), d = h([]), U = h(!1), N = h(((He = t.rowOption) == null ? void 0 : He.wrapContent) || !1), q = jt(t, g), x = Mt(t, m), Y = Ht(t), {
showLoading: Ce,
renderLoading: he
} = At(t, ue), o = zt(t, /* @__PURE__ */ new Map(), x, Y, g), b = Lt(t, o), {
shouldRenderPagination: D
} = b, y = Wt(t, o, g, d, m), {
showSelectAll: $,
showSelection: R,
selectedValues: re,
updateSelectAllStatus: Se
} = y, we = w(() => t.disabled), T = w(() => t.virtualized ? Math.min(o.dataView.value.length, G.value) : o.dataView.value.length);
w(() => t.loadingConfig.message);
const {
containerStyleObject: j
} = Kt(t), be = Ut(t), {
applyCommands: de
} = be;
de(C);
const {
applyColumnSetting: M,
removeColumnSetting: ce
} = qt(t);
t.showSetting && M(C);
const p = Yt(t, m), H = $t(t), {
applyColumnSorter: fe,
columnContext: k,
updateColumnRenderContext: B
} = p;
fe(o, H);
const J = Jt(t, k), F = Qt(t, m, y, g), v = Xt(t, m, g, F, d), Be = Zt(t), O = _t(t, v, Be), Q = en(t, o, v, Y, g, Be, O), X = tn(t, g, O, Q), Z = nn(t, g, O, Q), _ = ln(t, C, o, T, E, Q, X, Z), {
getVisualData: ye
} = _, Fe = an(k), Oe = on(t, k), ee = un(t, y), {
sidebarWidth: Ie,
showSidebarCheckBox: Ge
} = ee, c = sn(t, o, d, k, _, T, E, Ie, v), {
onWheel: Ve,
dataGridWidth: me,
viewPortHeight: ge,
viewPortWidth: A,
resetScroll: I,
updateVisibleRowsOnLatestVisibleScope: xe
} = c, te = rn(t, k, s, A, J), {
calculateColumnsSize: ne
} = te, z = dn(), le = cn(s, K, o, z, c), pe = fn(t, m, p, o, J, q, c), De = w(() => {
const l = {
"fv-grid": !0,
"fv-grid-bordered": t.showBorder,
"fv-grid-horizontal-bordered": t.showHorizontalLines,
"fv-datagrid-strip": t.showStripe
};
return Bt(l, t.customClass);
}), ke = w(() => ({
"fv-grid-content": !0,
"fv-grid-content-hover": U.value,
"fv-grid-wrap-content": N.value
})), Pe = w(() => {
const l = {};
return c.shouldShowHorizontalScrollbar.value && (l.paddingBottom = "10px"), c.shouldShowVirticalScrollbar.value && (l.paddingRight = "10px"), l;
}), {
renderGridHeader: e,
renderGridColumnResizeOverlay: a,
shouldShowHeader: u
} = yn(t, m, s, se, K, p, o, pe, le, x, z, te, J, y, ee, H, c, A, d), {
renderDataGridPagination: n
} = mn(t, m, o, c, b, y), {
renderDataGridSidebar: f
} = gn(t, F, y, ee, c), {
renderDisableMask: L
} = pn(), {
renderDataGridSummary: ve
} = vn(t, o, p), {
renderHorizontalScrollbar: ae
} = Cn(t, s, c), {
renderVerticalScrollbar: Le
} = hn(t, s, c), {
renderFilterPanel: We
} = Sn(t, p, o, x, c), {
renderGroupPanel: Ke
} = wn(t, o, pe, q, c);
function Ue() {
var r, S;
const l = Math.ceil(s.value.clientHeight / ie);
l > G.value && (G.value = l, xe()), ge.value = ((r = V.value) == null ? void 0 : r.clientHeight) || 0, me.value = ((S = s.value) == null ? void 0 : S.clientWidth) || 0, ne();
}
xt(() => {
s.value && (G.value = Math.max(Math.ceil(s.value.clientHeight / ie), G.value), d.value = ye(0, T.value + E - 1), Nt(s.value, Ue), ne(), Dt(() => {
s.value && (me.value = s.value.clientWidth), V.value && (A.value = V.value.clientWidth, ge.value = V.value.clientHeight);
})), Ce.value && he();
}), kt(() => {
}), W(A, () => {
});
function qe() {
o.insertNewDataItem(), I();
}
function Ye() {
o.insertNewDataItem(d.value.length), I();
}
function $e(l) {
v.onEditingRow(l);
}
function Je(l) {
o.removeDataItem(l), I();
}
function Qe(l) {
o.removeDataItemById(l), I();
}
function Xe(l) {
v.acceptEditingRow(l);
}
function Ze(l) {
v.cancelEditingRow(l);
}
function _e(l) {
d.value.forEach((r, S) => {
const oe = o.visibleDataItems.value.findIndex((P) => P === r.raw), Ae = d.value[S - 1];
l.forEach((P) => {
r.data[P.field] ? O.updateCellByColumn(r.data[P.field], P, Ae, r.raw) : r.data[P.field] = O.createCellByColumn(P, oe, r.raw, r, Ae);
});
});
}
function Ee(l) {
l && (C.value = l, _e(C.value), de(C), t.showSetting && M(C), B(C.value), fe(o, H), ne());
}
W(() => t.showSetting, (l, r) => {
l !== r && Ee(C.value);
});
function Ne(l, r) {
l && (o.load(l), d.value = ye(0, T.value + E - 1), r != null && r.keepScrollTop ? c.scrollTo(c.offsetY.value) : I(), d.value.length || (re.value = []), Ge.value && $.value && Se()), v.clear();
}
function Re(l) {
b.updatePagination(l);
}
W(o.shouldGroupingData, (l, r) => {
l !== r && (o.updateDataView(), I());
}), W(() => t.data, (l) => {
t.changePolicy === "default" && Ne(l);
}, {
deep: !0
}), W(() => t.columns, (l) => {
Ee(l);
});
function et(l) {
y.selectItemById(l);
}
function tt(l) {
const r = g.idField.value, S = d.value.find((oe) => oe.raw[r] === l);
S && F.clickRowItem(S);
}
function nt(l) {
F.activeRowById(l);
}
function lt(l) {
const r = g.idField.value, S = d.value.find((oe) => oe.raw[r] === l);
S && F.selectRow(S);
}
function at(l) {
y.selectItemByIds(l);
}
function ot() {
return d.value;
}
function it(l) {
return d.value.filter((r) => l.includes(r.raw[t.idField]));
}
function ut() {
return y.getSelectedItems();
}
function st() {
return y.getSelectionRow();
}
function rt() {
v.endEditCell();
}
function dt(l) {
y.unSelectItemByIds(l);
}
function Te() {
y.clearSelection();
}
function ct() {
return y.currentSelectedDataId.value;
}
function ft() {
c.scrollToBottom();
}
function yt(l) {
c.scrollToRowByIndex(l);
}
function mt() {
y.keepSelectingOnPaging.value || Te(), o.updateVisibleDataSummary(d.value), Re({
total: o.dataView.value.length,
index: 1
});
}
const je = {
activeRowById: nt,
selectRowById: lt,
addNewDataItem: qe,
addNewDataItemAtLast: Ye,
removeDataItem: Je,
removeDataItemById: Qe,
editDataItem: $e,
acceptDataItem: Xe,
cancelDataItem: Ze,
selectItemById: et,
selectItemByIds: at,
updateColumns: Ee,
updateDataSource: Ne,
updatePagination: Re,
getVisibleData: ot,
getVisibleDataByIds: it,
getSelectedItems: ut,
getSelectionRow: st,
getCurrentRowId: ct,
endEditCell: rt,
clickRowItemById: tt,
clearSelection: Te,
unSelectItemByIds: dt,
scrollToBottom: ft,
scrollToRowByIndex: yt,
updateDerivedData: mt
};
m.expose(je);
const gt = bn(t, m, je, p, v, d), {
renderDataArea: pt
} = On(t, m, V, se, K, Fe, Oe, p, v, q, gt, F, _, c, d, o), vt = w(() => !d.value || !d.value.length), {
renderEmpty: Ct
} = Bn(t, m), ht = w(() => ({
"d-flex": !0,
"justify-content-between": D.value && R.value,
"justify-content-end": D.value && !R.value,
"position-relative": !0,
"fv-datagrid-pagination": !0
})), St = w(() => ({
"flex-direction": "row"
})), wt = w(() => ({
"d-flex": !0,
"align-items-center": !0
}));
return Pt("dataGridContext", {
useColumnComposition: p,
dataView: o,
useFilterComposition: x,
useFitColumnComposition: te,
useSortComposition: H,
useVirtualScrollComposition: c
}), () => i("div", {
ref: ue,
class: De.value,
style: j.value,
onWheel: Ve
}, [s.value && t.enableFilter && We(), s.value && Ke(), s.value && u.value && e(), i("div", {
ref: s,
class: ke.value,
style: Pe.value,
onMouseover: () => U.value = !0,
onMouseleave: () => U.value = !1
}, [s.value && f(d), s.value && pt(), s.value && vt.value && Ct(), s.value && ae(), s.value && Le()]), s.value && ve(), (D.value || R.value) && i("div", {
class: ht.value,
style: St.value
}, [R.value && i("div", {
class: wt.value
}, [i("div", null, ["已选：" + re.value.length, Et(" 条")])]), D.value && n()]), a(), we.value && L()]);
}
}), Wn = Ft(In);
export {
In as FDataGrid,
Hn as columnOptions,
Fn as dataGridProps,
Wn as default,
zn as editOptions,
Nn as filterOptions,
En as groupOptions,
Rn as headerOptions,
Ln as loadingOptions,
kn as paginationOptions,
Tn as rowNumberOptions,
jn as rowOptions,
An as selectionOptions,
Pn as sortOptions,
Mn as summaryOptions
};