@aplus-frontend/ui
Version:
255 lines (254 loc) • 6.76 kB
JavaScript
import { defineComponent as W, useSlots as H, ref as b, watch as v, unref as s, createBlock as $, openBlock as q, withCtx as p, createVNode as w, mergeProps as J, createSlots as Q, renderList as X, renderSlot as Y, normalizeProps as Z, guardReactiveProps as M } from "vue";
import { Table as ee } from "@aplus-frontend/antdv";
import { ApForm as m } from "../ap-form/index.mjs";
import { isEqual as te, isArray as c, isUndefined as ae, isNumber as g, cloneDeep as ne, omit as x } from "lodash-unified";
import "../config-provider/index.mjs";
import "../hooks/index.mjs";
import { isDef as y } from "../utils/index.mjs";
import { scrollToRowIndex as oe } from "./utils.mjs";
import le from "./hooks/use-get-columns.mjs";
import { useDevWarning as se } from "../utils/warning.mjs";
import { useNamespace as re } from "../config-provider/hooks/use-namespace.mjs";
import { useControllableValue as ue } from "../hooks/useControllableValue.mjs";
import { useGlobalConfig as ie } from "../config-provider/hooks/use-global-config.mjs";
const Fe = /* @__PURE__ */ W({
name: "EditableTable",
__name: "index",
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: {},
name: {
default: "ap-editable-table-inner-name"
},
onFieldChange: {}
},
emits: ["update:value"],
setup(C, {
expose: R,
emit: F
}) {
const t = C;
se("EditableTable")(!1, "breaking", "EditableTable has been EOL, Please use EditableAgGrid(https://aplus.aplnk.com/aplus-ui/components/ag-grid/editable/) instead.");
const {
b: B
} = re("editable-table"), T = H(), E = F, h = b(), {
value: i,
updateValue: V
} = ue(t, E), r = b(), D = ie("valueTypeMap"), f = m.useWatch(t.name, r);
v(() => f.value, (e) => {
V(e), t.onChange?.(e);
}, {
deep: !0,
flush: "post"
}), v(i, (e) => {
e !== s(f) && (te(e, s(f)) || r.value?.setFieldValue(t.name, e));
}, {
deep: !0
});
const L = le(t, D);
function S() {
r.value?.resetFields();
}
function _(e) {
return e ? (c(e) ? e : [e]).map((n) => c(n) ? [t.name, ...n] : [t.name, n]) : void 0;
}
async function k(e, l) {
return (await r.value?.validateFields(_(e), l))?.[t.name];
}
function N(e, l) {
const n = s(i)?.length || 0;
if (y(t.maxLength) && n >= t.maxLength)
return;
const a = {
...e || {}
};
r.value?.setFieldValue?.(t.name, a, !0, (o, u) => {
if (!o[u]) {
o[u] = [a];
return;
}
ae(l) ? o[u].push(a) : o[u].splice(l, 0, a);
});
}
function A(e, l = "suffix") {
const n = s(i)?.length || 0, a = g(e) ? e : e.length;
if (y(t.maxLength) && n + a > t.maxLength)
return;
const o = g(e) ? new Array(e).fill(0).map(() => ({})) : ne(e);
r.value?.setFieldValue?.(t.name, o, !0, (u, d) => {
if (!u[d]) {
u[d] = [...o];
return;
}
l === "suffix" ? u[d].push(...o) : u[d].unshift(...o);
});
}
function P(e) {
const l = new Set(g(e) ? [e] : e);
r.value?.setFieldValue?.(t.name, void 0, !0, (n, a) => {
n[a] = n[a].filter((o, u) => !l.has(u));
});
}
function z(e) {
const l = new Set(c(e) ? e : [e]);
l.size !== 0 && r.value?.setFieldValue?.(t.name, void 0, !0, (n, a) => {
n[a] = n[a].filter((o) => !l.has(o[t.rowKey]));
});
}
function I() {
return s(i);
}
function K(e) {
r.value?.setFieldValue(t.name, e);
}
function O(e) {
return s(i)?.[e];
}
function j(e, l, n = !0) {
r.value?.setFieldValue?.(t.name, void 0, !0, (a, o) => {
!a[o] || !a[o][e] || (a[o][e] = {
...n ? a[o][e] : {},
...l
});
});
}
function G(e, l) {
const n = e === "end" ? i.value.length - 1 : e;
oe(n, h.value?.$el, l);
}
function U() {
r.value?.setFieldValue?.(t.name, []);
}
return R({
resetFields: S,
validateFields: k,
add: N,
remove: P,
getRowData: O,
getRowsData: I,
setRowData: j,
addMultiple: A,
scrollTo: G,
clear: U,
setTableData: K,
removeByKey: z
}), (e, l) => (q(), $(s(m), {
ref_key: "formRef",
ref: r,
"initial-values": {
[t.name]: s(i)
}
}, {
default: p(() => [w(s(m).FormItem, {
name: e.name,
"no-style": ""
}, {
default: p(() => [w(s(ee), J(s(x)(t, ["name", "value", "onUpdate:value", "maxLength", "onChange"]), {
ref_key: "tableRef",
ref: h,
class: s(B)(),
columns: s(L),
"data-source": s(i)
}), Q({
_: 2
}, [X(s(x)(T, ["headerCell"]), (n, a) => ({
name: a,
fn: p((o) => [Y(e.$slots, a, Z(M(o || {})))])
}))]), 1040, ["class", "columns", "data-source"])]),
_: 3
}, 8, ["name"])]),
_: 3
}, 8, ["initial-values"]));
}
});
export {
Fe as default
};