@aplus-frontend/ui
Version:
261 lines (260 loc) • 6.65 kB
JavaScript
import { defineComponent as M, useSlots as $, ref as b, watch as q, unref as l, createBlock as J, openBlock as Q, withCtx as m, createVNode as v, mergeProps as X, createSlots as Y, renderList as Z, renderSlot as ee, normalizeProps as oe, guardReactiveProps as ae } from "vue";
import { isEqual as te, isArray as R, omit as ne } from "lodash-unified";
import { ApForm as c } from "../../ap-form/index.mjs";
import "../../config-provider/index.mjs";
import "../../hooks/index.mjs";
import { useEditableApi as le } from "../hooks/use-editable-api.mjs";
import { useGetEditableColumns as re } from "../hooks/use-editable-columns.mjs";
import "../index.vue2.mjs";
import se from "../style/editable.mjs";
import { arrayToObject as f, getRowKey as ie } from "./utils.mjs";
import { useNamespace as de } from "../../config-provider/hooks/use-namespace.mjs";
import { useControllableValue as ue } from "../../hooks/useControllableValue.mjs";
import { useGlobalConfig as pe } from "../../config-provider/hooks/use-global-config.mjs";
import me from "../index.vue.mjs";
const Fe = /* @__PURE__ */ M({
name: "EditableGrid",
__name: "index",
props: {
dropdownPrefixCls: {},
bordered: {
type: Boolean
},
locale: {},
onResizeColumn: {},
getPopupContainer: {},
scroll: {},
sortDirections: {},
showSorterTooltip: {
type: [Boolean, Object]
},
prefixCls: {},
rowKey: {
type: [String, Function],
default: "key"
},
tableLayout: {},
title: {},
id: {},
showHeader: {
type: Boolean
},
components: {},
customHeaderRow: {},
direction: {},
expandFixed: {
type: [String, Boolean]
},
expandColumnWidth: {},
expandedRowKeys: {},
defaultExpandedRowKeys: {},
expandedRowRender: {},
expandRowByClick: {
type: Boolean
},
expandIcon: {},
onExpand: {},
onExpandedRowsChange: {},
defaultExpandAllRows: {
type: Boolean
},
indentSize: {},
expandIconColumnIndex: {},
showExpandColumn: {
type: Boolean
},
expandedRowClassName: {},
childrenColumnName: {},
rowExpandable: {},
transformCellText: {},
rowHoverable: {
type: Boolean
},
rowSelection: {
type: [Boolean, Object]
},
onLoadingChange: {},
onShownColumnsChange: {},
pagination: {
type: [Boolean, Object],
default: !1
},
searchFormWrapperStyle: {},
tableWrapperStyle: {},
wrapperStyle: {},
tableStyle: {},
adaptive: {
type: Boolean
},
columnResizable: {
type: Boolean,
default: !1
},
loading: {
type: Boolean,
default: void 0
},
summary: {},
rowHeight: {
default: 66
},
getRowHeight: {},
advanceRenderer: {
type: Boolean
},
browserTooltips: {
type: Boolean
},
virtual: {
type: [Boolean, Object],
default: void 0
},
onRowClicked: {},
onScrollEnd: {},
rowClassName: {},
rowClassRules: {},
autoHeight: {
type: Boolean
},
onUpdate: {},
customRow: {},
theme: {},
emptyComponent: {},
columns: {},
value: {},
defaultValue: {},
"onUpdate:value": {},
onChange: {},
maxLength: {},
name: {
default: "ap-editable-table-inner-name"
},
onFieldChange: {}
},
emits: ["update:value"],
setup(C, {
expose: x,
emit: B
}) {
const S = $(), a = C, {
b: T
} = de("editable-aggrid"), F = se("editable-aggrid"), _ = B, i = b(), {
value: s,
updateValue: y
} = ue(a, _), r = b(), E = c.useWatch(a.name, r);
q(s, (e) => {
const o = f(e, a.rowKey);
te(o, l(E)) || r.value?.setFieldValue(a.name, o);
}, {
deep: !0
});
const K = pe("valueTypeMap"), k = re(a, K), {
add: A,
addMultiple: N,
remove: j,
removeByKey: I,
getRowData: V,
getRowsData: D,
setRowData: H,
clear: O,
refreshRowIds: d
} = le(a, r, s, y);
function z() {
const e = i.value?._internalGridApi;
if (!d.value?.length || !e)
return;
const o = d.value.map((t) => e.getRowNode(t)).filter((t) => !!t);
e.refreshCells({
rowNodes: o,
force: !0
}), d.value = [];
}
function L() {
r.value?.resetFields();
}
function w(e) {
return e ? (R(e) ? e : [e]).map((t) => R(t) ? [a.name, ...t] : [a.name, t]) : void 0;
}
function g(e) {
try {
const o = Object.keys(e), t = s.value.map((n) => ie(n, void 0, a.rowKey));
return o.sort((n, u) => t.findIndex((p) => String(p) === n) - t.findIndex((p) => String(p) === u)), o.map((n) => e[n]);
} catch {
return e;
}
}
async function P(e, o) {
const n = (await r.value?.validateFields(w(e), o))?.[a.name];
return g(n);
}
async function G(e, o) {
const n = (await r.value?.validateFieldsReturnTransformed(w(e), o))?.[a.name];
return g(n);
}
function U(e) {
y(e);
const o = f(e, a.rowKey);
r.value?.setFieldValue(a.name, o);
}
function h(e, o) {
const t = e === "end" ? s.value.length - 1 : e;
i.value?.scrollToRow(t, o);
}
function W(e, o) {
i.value?.scrollToColumn(e, o);
}
return x({
resetFields: L,
validateFields: P,
validateFieldsReturnTransformed: G,
add: A,
addMultiple: N,
remove: j,
removeByKey: I,
getRowData: V,
getRowsData: D,
setRowData: H,
clear: O,
setTableData: U,
scrollTo: h,
scrollToRow: h,
scrollToColumn: W,
table: i
}), (e, o) => (Q(), J(l(c), {
ref_key: "formRef",
ref: r,
"initial-values": {
[a.name]: l(f)(l(s), a.rowKey)
},
style: {
height: "100%"
}
}, {
default: m(() => [v(l(c).FormItem, {
name: e.name,
"no-style": ""
}, {
default: m(() => [v(me, X(l(ne)(a, ["name", "value", "onUpdate:value", "maxLength", "onChange", "defaultValue"]), {
ref_key: "tableRef",
ref: i,
class: [l(T)(), l(F)],
size: "mini",
columns: l(k),
"data-source": l(s),
"search-form": !1,
onUpdate: z
}), Y({
_: 2
}, [Z(S, (t, n) => ({
name: n,
fn: m((u) => [ee(e.$slots, n, oe(ae(u || {})))])
}))]), 1040, ["class", "columns", "data-source"])]),
_: 3
}, 8, ["name"])]),
_: 3
}, 8, ["initial-values"]));
}
});
export {
Fe as default
};