@aplus-frontend/ui
Version:
230 lines (229 loc) • 6.12 kB
JavaScript
import { defineComponent as z, ref as p, unref as r, useSlots as A, toRef as K, watch as O, nextTick as G, createBlock as W, openBlock as H, mergeProps as c, withCtx as g, createVNode as U, createSlots as $, renderList as q, renderSlot as J, normalizeProps as Q, guardReactiveProps as X } from "vue";
import { Table as Y } from "@aplus-frontend/antdv";
import { ApForm as h } from "../ap-form/index.mjs";
import { isUndefined as Z, isNumber as d, cloneDeep as M, isArray as ee, omit as b } from "lodash-unified";
import "../config-provider/index.mjs";
import { useInjectForm as te } from "../ap-form/context.mjs";
import { isDef as w } from "../utils/index.mjs";
import ae from "./hooks/use-get-columns.mjs";
import { scrollToRowIndex as oe } from "./utils.mjs";
import { getModelValue as ne } from "../ap-form/utils/get.mjs";
import { useDevWarning as le } from "../utils/warning.mjs";
import { useNamespace as se } from "../config-provider/hooks/use-namespace.mjs";
import { useGlobalConfig as re } from "../config-provider/hooks/use-global-config.mjs";
const Re = /* @__PURE__ */ z({
name: "EditableTableFormItem",
__name: "form-item",
props: {
dropdownPrefixCls: {},
pagination: {
type: [Boolean, Object],
default: !1
},
loading: {
type: [Boolean, Object],
default: void 0
},
size: {
default: "small"
},
bordered: {
type: Boolean,
default: !1
},
locale: {},
onResizeColumn: {},
rowSelection: {},
getPopupContainer: {},
scroll: {},
sortDirections: {
default: () => ["ascend", "descend"]
},
showSorterTooltip: {
type: [Boolean, Object],
default: !0
},
prefixCls: {},
rowKey: {
type: [String, Function],
default: "key"
},
tableLayout: {
default: "fixed"
},
rowClassName: {},
title: {},
footer: {},
id: {},
showHeader: {
type: Boolean,
default: !0
},
components: {},
customRow: {},
customHeaderRow: {},
direction: {},
expandFixed: {
type: [String, Boolean],
default: !1
},
expandColumnWidth: {},
expandedRowKeys: {},
defaultExpandedRowKeys: {},
expandedRowRender: {},
expandRowByClick: {
type: Boolean,
default: !1
},
expandIcon: {},
onExpand: {},
onExpandedRowsChange: {},
defaultExpandAllRows: {
type: Boolean,
default: !1
},
indentSize: {
default: 15
},
expandIconColumnIndex: {},
showExpandColumn: {
type: Boolean,
default: !0
},
expandedRowClassName: {},
childrenColumnName: {
default: "children"
},
rowExpandable: {},
sticky: {
type: [Boolean, Object]
},
transformCellText: {},
columns: {},
value: {},
defaultValue: {},
"onUpdate:value": {},
onChange: {},
maxLength: {},
onFieldChange: {},
label: {},
name: {},
formItem: {
default: () => ({})
}
},
setup(x, {
expose: y
}) {
const o = x;
le("EditableTableFormItem")(!1, "breaking", "EditableTableFormItem has been EOL, Please use EditableAgGridFormItem(https://aplus.aplnk.com/aplus-ui/components/ag-grid/editable/) instead.");
const {
internalInstance: i,
model: C
} = te(), u = p(ne(r(C), o.name) || []), R = A(), F = K(o, "name"), B = h.useWatch(F);
O(() => B.value, async (e) => {
await G(), u.value = e, o.onChange?.(e);
}, {
deep: !0
});
const {
b: T
} = se("editable-table"), m = p(), v = re("valueTypeMap"), I = ae(o, v);
function D(e, n) {
const l = r(u)?.length || 0;
if (w(o.maxLength) && l >= o.maxLength)
return;
const t = {
...e || {}
};
i?.setFieldValue(o.name, t, !0, (a, s) => {
if (!a[s]) {
a[s] = [t];
return;
}
Z(n) ? a[s].push(t) : a[s].splice(n, 0, t);
});
}
function E(e, n = "suffix") {
const l = r(u)?.length || 0, t = d(e) ? e : e.length;
if (w(o.maxLength) && l + t > o.maxLength)
return;
const a = d(e) ? new Array(e).fill(0).map(() => ({})) : M(e);
i?.setFieldValue(o.name, a, !0, (s, f) => {
if (!s[f]) {
s[f] = [...a];
return;
}
n === "suffix" ? s[f].push(...a) : s[f].unshift(...a);
});
}
function L(e) {
const n = new Set(d(e) ? [e] : e);
i?.setFieldValue(o.name, void 0, !0, (l, t) => {
l[t] = l[t].filter((a, s) => !n.has(s));
});
}
function S(e) {
const n = new Set(ee(e) ? e : [e]);
n.size !== 0 && i?.setFieldValue?.(o.name, void 0, !0, (l, t) => {
l[t] = l[t].filter((a) => !n.has(a[o.rowKey]));
});
}
function V() {
return r(u);
}
function k(e) {
return r(u)?.[e];
}
function N(e, n, l = !0) {
i?.setFieldValue(o.name, void 0, !0, (t, a) => {
!t[a] || !t[a][e] || (t[a][e] = {
...l ? t[a][e] : {},
...n
});
});
}
function _(e) {
i?.setFieldValue(o.name, e);
}
function P(e, n) {
const l = e === "end" ? u.value.length - 1 : e;
oe(l, m.value?.$el, n);
}
function j() {
i?.setFieldValue?.(o.name, []);
}
return y({
add: D,
remove: L,
getRowData: k,
getRowsData: V,
setRowData: N,
addMultiple: E,
scrollTo: P,
setTableData: _,
clear: j,
removeByKey: S
}), (e, n) => (H(), W(r(h).FormItem, c(e.formItem, {
name: e.name,
label: e.label
}), {
default: g(() => [U(r(Y), c(r(b)(o, ["name", "maxLength", "onChange"]), {
ref_key: "tableRef",
ref: m,
class: r(T)(),
columns: r(I),
"data-source": u.value
}), $({
_: 2
}, [q(r(b)(R, ["headerCell"]), (l, t) => ({
name: t,
fn: g((a) => [J(e.$slots, t, Q(X(a || {})))])
}))]), 1040, ["class", "columns", "data-source"])]),
_: 3
}, 16, ["name", "label"]));
}
});
export {
Re as default
};