linkmore-design
Version:
🌈 🚀lm组件库。🚀
1,110 lines (1,088 loc) • 88.5 kB
JavaScript
import _objectDestructuringEmpty from "@babel/runtime/helpers/esm/objectDestructuringEmpty";
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
import _extends from "@babel/runtime/helpers/esm/extends";
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
var _excluded = ["index", "virtual"],
_excluded2 = ["index"],
_excluded3 = ["value", "onChange", "record", "rowIndex", "colIndex", "validator"],
_excluded4 = ["record", "rowKey", "isEdit", "col", "rowIndex", "colIndex", "handleTableRowDelete", "handleTableRowAdd", "quickOpetateClearAll", "getLength", "isHoverEdit", "editEnum", "valueType", "children", "handleSave", "handleAdd", "handleDelete", "handleCopy", "handlePaste", "itemProps", "initialiZindex", "columnsValueDecimal"],
_excluded5 = ["onMouseEnter", "onMouseLeave"],
_excluded6 = ["value", "columns", "isEdit", "isAdd", "onChange", "onPaste", "rowKey", "rowHoverEdit", "isUseForm", "isHoverEdit", "useQuickOpetate", "quickOpetateClearAll", "rowSelection", "rowDisabled", "virtual", "sortOpen", "disabled", "colSortOpen", "indexCol", "filterChange", "size", "recordCreatorProps", "shouldUpdate", "loading", "autoSizer", "initialiZindex", "resizable", "emptyProps", "roleFiledKeys", "columnsValueDecimal"];
import _regeneratorRuntime from "@babel/runtime/regenerator";
/* tslint:disable */
/* eslint-disable no-unused-vars */
import { arrayMove } from '@dnd-kit/sortable';
import moment from 'moment';
import Checkbox from "../checkbox";
import DatePicker from "../date-picker";
import Form from "../form";
import IconFont from "../icon-font";
import Input from "../input";
import InputNumber from "../input-number";
import { toFixedNumber } from "../lm-table/toFixed";
import Radio from "../radio";
import Select from "../select";
import Switch from "../switch";
import Table from "../table";
import { useControllableValue } from 'ahooks';
import cls from 'classnames';
import { produce } from 'immer';
import { debounce, isBoolean, isEqual, isFunction, isObject, omit, pick } from 'lodash';
import React, { forwardRef, memo, useCallback, useContext, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
import ConfigProvider from "../config-provider";
import { ConfigContext } from "../config-provider/context";
import Empty from "../empty";
import defaultLocale from "../locale/en_US";
import UploadOss from "../upload-oss";
import { BottomOpetateComponent, DraggableContainer, QuickOpetate } from "./components";
import ResizableHeight from "./components/resizableHeader";
import DndContainer from "./DndContainer";
import DragHandle from "./DragHandle";
import SortableBoxCol from "./sortableBoxCol";
import SortableItem from "./sortableItem";
import ColSortableItem from "./sortableItemCol";
import { checkDataSourceIsEmpty, checkExpandIconColumnIndex, checkMemoShouldUploadSpecialFun, checkRowKeyByDataSource, checkTableRowIsDisable, computationSummaryValue, deepDataSourcePreKeys, getLeafNodes, isExpandRow, isObjEmpty, SCROLL_POSITION_CLASS_NAME } from "./util";
import { VirtualRow, VirtualTable, VirtualWrapper } from "./virtual";
var UploadBtn = UploadOss.UploadBtn;
var EditableContext = /*#__PURE__*/React.createContext(null);
// | 'Hide(隐藏)=0'
// | 'Read(只读)=1'
var decimalLists = ['amount', 'price', 'number'];
// 表格行
var EditableRow = function EditableRow(_ref) {
var index = _ref.index,
virtual = _ref.virtual,
props = _objectWithoutProperties(_ref, _excluded);
var _Form$useForm = Form.useForm(),
_Form$useForm2 = _slicedToArray(_Form$useForm, 1),
form = _Form$useForm2[0];
var dataKey = props.dataKey,
pushAllForm = props.pushAllForm;
pushAllForm === null || pushAllForm === void 0 ? void 0 : pushAllForm(form, dataKey, index);
return /*#__PURE__*/React.createElement(Form, {
form: form,
disabled: props.disabled || false,
component: false
}, /*#__PURE__*/React.createElement(EditableContext.Provider, {
value: form
}, virtual ? /*#__PURE__*/React.createElement(VirtualRow, props) : /*#__PURE__*/React.createElement("tr", props)));
};
var EditableSortRow = function EditableSortRow(_ref2) {
var index = _ref2.index,
props = _objectWithoutProperties(_ref2, _excluded2);
var _Form$useForm3 = Form.useForm(),
_Form$useForm4 = _slicedToArray(_Form$useForm3, 1),
form = _Form$useForm4[0];
var dataKey = props.dataKey,
pushAllForm = props.pushAllForm;
pushAllForm === null || pushAllForm === void 0 ? void 0 : pushAllForm(form, dataKey, index);
return /*#__PURE__*/React.createElement(Form, {
form: form,
disabled: props.disabled || false,
component: false
}, /*#__PURE__*/React.createElement(EditableContext.Provider, {
value: form
}, /*#__PURE__*/React.createElement(SortableItem, props)));
};
var UploadSingle = function UploadSingle(props) {
var value = props.value,
onChange = props.onChange,
editEnum = props.editEnum;
var handleDelete = function handleDelete() {
onChange === null || onChange === void 0 ? void 0 : onChange();
};
return /*#__PURE__*/React.createElement("div", {
className: "upload_single"
}, value ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconFont, {
type: "lmweb-link",
style: {
fontSize: 14,
color: '#1890ff'
}
}), /*#__PURE__*/React.createElement("a", {
href: "".concat(value === null || value === void 0 ? void 0 : value.externalUrl, "/").concat(value === null || value === void 0 ? void 0 : value.filePath).concat(value === null || value === void 0 ? void 0 : value.realFileName),
target: "_blank",
rel: "noreferrer"
}, value === null || value === void 0 ? void 0 : value.fileName), /*#__PURE__*/React.createElement(IconFont, {
type: "lmweb-delete",
style: {
fontSize: 14,
color: '#1890ff'
},
onClick: handleDelete
})) : /*#__PURE__*/React.createElement(UploadBtn, _extends({}, editEnum, {
value: value,
onChange: onChange
})));
};
var InputRange = function InputRange(_ref3) {
var _ref3$value = _ref3.value,
value = _ref3$value === void 0 ? ['', ''] : _ref3$value,
onChange = _ref3.onChange,
record = _ref3.record,
rowIndex = _ref3.rowIndex,
colIndex = _ref3.colIndex,
validator = _ref3.validator,
editEnum = _objectWithoutProperties(_ref3, _excluded3);
// 输入值改变
var history = useRef([]);
var _useState = useState([]),
_useState2 = _slicedToArray(_useState, 2),
nValue = _useState2[0],
setValue = _useState2[1];
var _React$useContext = React.useContext(ConfigContext),
_React$useContext$loc = _React$useContext.locale,
contextLocale = _React$useContext$loc === void 0 ? defaultLocale : _React$useContext$loc;
var tableLocale = _objectSpread({}, contextLocale.Table);
useEffect(function () {
setValue(value);
}, value);
var handleFocus = function handleFocus() {
history.current.push(nValue);
};
var handleInput = function handleInput(e, type) {
var v = type === 'prev' ? [e.target.value, nValue[1]] : [nValue[0], e.target.value];
setValue(v);
onChange(v);
history.current.push(v);
};
var handleBlur = function handleBlur(e, type) {
var isFun = isFunction(validator);
// 验证历史记录
var traverse = function traverse(arr) {
if (!arr || !arr.length) {
if (type === 'prev') {
setValue(['', nValue[1]]);
} else if (type === 'next') {
setValue([nValue[0], '']);
}
history.current = [];
return;
}
var value = arr.pop();
if (isFun && validator(record, value, rowIndex, colIndex)) {
setValue(value);
history.current = [];
} else {
traverse(arr);
}
};
traverse(history.current);
};
return /*#__PURE__*/React.createElement("div", {
className: "lm_editTable_wrapperRange"
}, /*#__PURE__*/React.createElement("div", {
className: "inputRange"
}, /*#__PURE__*/React.createElement(Input, _extends({
value: nValue === null || nValue === void 0 ? void 0 : nValue[0],
placeholder: tableLocale.placeholder || '请输入',
onFocus: function onFocus(e) {
return handleFocus();
},
onBlur: function onBlur(e) {
return handleBlur(e, 'prev');
},
onChange: function onChange(e) {
return handleInput(e, 'prev');
}
}, editEnum)), "~", /*#__PURE__*/React.createElement(Input, _extends({
value: nValue === null || nValue === void 0 ? void 0 : nValue[1],
placeholder: tableLocale.placeholder || '请输入',
onFocus: function onFocus(e) {
return handleFocus();
},
onBlur: function onBlur(e) {
return handleBlur(e, 'next');
},
onChange: function onChange(e) {
return handleInput(e, 'next');
}
}, editEnum))));
};
/*
表格单元格
editEnum： 下拉框时的数据数组（非数组时是配置设置）
valueType: 编辑框配置（多选）
*/
var EditableCell = function EditableCell(props) {
var _props$record = props.record,
record = _props$record === void 0 ? {} : _props$record,
rowKey = props.rowKey,
isEdit = props.isEdit,
_props$col = props.col,
col = _props$col === void 0 ? {} : _props$col,
rowIndex = props.rowIndex,
colIndex = props.colIndex,
handleTableRowDelete = props.handleTableRowDelete,
handleTableRowAdd = props.handleTableRowAdd,
quickOpetateClearAll = props.quickOpetateClearAll,
getLength = props.getLength,
isHoverEdit = props.isHoverEdit,
editEnum = props.editEnum,
valueType = props.valueType,
children = props.children,
handleSave = props.handleSave,
handleAdd = props.handleAdd,
handleDelete = props.handleDelete,
handleCopy = props.handleCopy,
handlePaste = props.handlePaste,
itemProps = props.itemProps,
initialiZindex = props.initialiZindex,
columnsValueDecimal = props.columnsValueDecimal,
restProps = _objectWithoutProperties(props, _excluded4);
/** 去除移入移出功能，保留最纯粹的功能，优化性能 */
var onMouseEnter = restProps.onMouseEnter,
onMouseLeave = restProps.onMouseLeave,
clearProps = _objectWithoutProperties(restProps, _excluded5);
var _ref4 = col,
_ref4$componentProps = _ref4.componentProps,
componentProps = _ref4$componentProps === void 0 ? {} : _ref4$componentProps,
dataIndex = _ref4.dataIndex,
decimalType = _ref4.decimalType;
/** 是否正在编辑中 */
var _useState3 = useState(false),
_useState4 = _slicedToArray(_useState3, 2),
editing = _useState4[0],
setEditing = _useState4[1];
var inputRef = useRef(null);
var form = useContext(EditableContext);
var _React$useContext2 = React.useContext(ConfigContext),
_React$useContext2$lo = _React$useContext2.locale,
contextLocale = _React$useContext2$lo === void 0 ? defaultLocale : _React$useContext2$lo;
var tableLocale = _objectSpread({}, contextLocale.Table);
var _useState5 = useState(false),
_useState6 = _slicedToArray(_useState5, 2),
hoverStatus = _useState6[0],
setHoverStatus = _useState6[1];
useEffect(function () {
if (editing) {
var _inputRef$current;
inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
}
}, [editing]);
var toggleEdit = function toggleEdit() {
setEditing(!editing);
// form.setFieldsValue({ [dataIndex]: record[dataIndex] });
};
// 校验保存
var save = /*#__PURE__*/function () {
var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(row) {
var values, resultComponentProps;
return _regeneratorRuntime.wrap(function _callee$(_context) {
while (1) switch (_context.prev = _context.next) {
case 0:
_context.prev = 0;
if (!row) {
_context.next = 5;
break;
}
_context.t0 = omit(row, 'onChange');
_context.next = 8;
break;
case 5:
_context.next = 7;
return form.getFieldsValue();
case 7:
_context.t0 = _context.sent;
case 8:
values = _context.t0;
resultComponentProps = isFunction(componentProps) ? componentProps === null || componentProps === void 0 ? void 0 : componentProps(record, col) : componentProps; // console.time('testForEach');
/** 如果属于中有唯一性，并且当前的值与唯一值不一致，则改变其他的 */
if (resultComponentProps.isOnlyValue !== undefined && values[dataIndex] !== record[dataIndex] && ![undefined, null].includes(values[dataIndex])) {
handleSave(_objectSpread(_objectSpread(_objectSpread({}, record), values), {}, _defineProperty({}, rowKey, record === null || record === void 0 ? void 0 : record[rowKey])), {
only: {
key: dataIndex,
value: resultComponentProps.isOnlyValue
}
});
} else {
handleSave(_objectSpread(_objectSpread(_objectSpread({}, record), values), {}, _defineProperty({}, rowKey, record === null || record === void 0 ? void 0 : record[rowKey])));
}
// console.timeEnd('testForEach');
_context.next = 13;
return form.validateFields([dataIndex]);
case 13:
if (col !== null && col !== void 0 && col.hoverEdit) {
toggleEdit();
}
_context.next = 18;
break;
case 16:
_context.prev = 16;
_context.t1 = _context["catch"](0);
case 18:
case "end":
return _context.stop();
}
}, _callee, null, [[0, 16]]);
}));
return function save(_x) {
return _ref5.apply(this, arguments);
};
}();
// 触发保存
var handleFormItemChange = function handleFormItemChange(e) {
save === null || save === void 0 ? void 0 : save();
};
/** 快捷刷子，把当前的所有列的值，刷成当前的选中的列 */
var copyKey = function copyKey(e, type) {
e === null || e === void 0 ? void 0 : e.stopPropagation();
var dataIndex = col.dataIndex;
handleCopy === null || handleCopy === void 0 ? void 0 : handleCopy(dataIndex, record[dataIndex], type, props.rowIndex);
};
var Control = function Control(con) {
var _col$newOptions;
var resultComponentProps = isFunction(componentProps) ? componentProps === null || componentProps === void 0 ? void 0 : componentProps(record, col) : componentProps;
if (isFunction(componentProps) && col !== null && col !== void 0 && (_col$newOptions = col.newOptions) !== null && _col$newOptions !== void 0 && _col$newOptions.length) {
resultComponentProps = _objectSpread(_objectSpread({}, resultComponentProps), {}, {
options: col === null || col === void 0 ? void 0 : col.newOptions
});
}
var clearAttrComponentProps = omit(resultComponentProps, ['optionOnly', 'isOnlyValue', 'quickcopy']);
var mergeColDecimal = _objectSpread({
number: null,
price: null,
amount: 2
}, columnsValueDecimal || {});
switch (con) {
case 'input':
return /*#__PURE__*/React.createElement(Input, _extends({
onPressEnter: handleFormItemChange,
onBlur: handleFormItemChange,
ref: inputRef,
placeholder: tableLocale.placeholder || '请输入'
}, clearAttrComponentProps, {
addonBefore: resultComponentProps.addonBefore ? /*#__PURE__*/React.createElement(Form.Item, {
name: [col.dataIndex, 'addonBeforeValue'],
noStyle: true
}, /*#__PURE__*/React.cloneElement(resultComponentProps.addonBefore, {
onChange: handleFormItemChange
})) : null,
addonAfter: resultComponentProps.addonAfter ? /*#__PURE__*/React.createElement(Form.Item, {
name: [col.dataIndex, 'addonAfterValue'],
noStyle: true
}, /*#__PURE__*/React.cloneElement(resultComponentProps.addonAfter, {
onChange: handleFormItemChange
})) : null
}));
case 'inputRange':
return /*#__PURE__*/React.createElement(InputRange, _extends({
onChange: handleFormItemChange
// ref={inputRef}
}, resultComponentProps, {
record: record,
rowIndex: rowIndex,
colIndex: colIndex
}));
case 'number':
return /*#__PURE__*/React.createElement(InputNumber, _extends({
onPressEnter: handleFormItemChange,
onBlur: handleFormItemChange,
style: {
width: (editEnum === null || editEnum === void 0 ? void 0 : editEnum.width) || '100%'
},
placeholder: tableLocale.placeholder || '请输入',
ref: inputRef,
precision: mergeColDecimal[col.decimalType] || 0
}, clearAttrComponentProps));
case 'date':
// @ts-ignore
return /*#__PURE__*/React.createElement(DatePicker, _extends({
onChange: handleFormItemChange
// getPopupContainer={(triggerNode: any) =>
// triggerNode.closest(SCROLL_POSITION_DOT_CLASS_NAME) || document.body
// }
}, clearAttrComponentProps));
case 'select':
return /*#__PURE__*/React.createElement(Select, _extends({
showSearch: true,
allowClear: true,
placeholder: tableLocale.placeholderSelect || '请选择',
ref: inputRef,
style: {
width: '100%'
},
filterOption: function filterOption(input, option) {
var _option$children, _option$children$toLo;
return ((_option$children = option.children) === null || _option$children === void 0 ? void 0 : (_option$children$toLo = _option$children.toLowerCase()) === null || _option$children$toLo === void 0 ? void 0 : _option$children$toLo.indexOf(input.toLowerCase())) >= 0;
}
// getPopupContainer={(triggerNode: any) =>
// triggerNode.closest(SCROLL_POSITION_DOT_CLASS_NAME) || document.body
// }
}, clearAttrComponentProps, {
onChange: handleFormItemChange
}));
case 'multiple':
return /*#__PURE__*/React.createElement(Select, _extends({
mode: "multiple",
showSearch: true,
allowClear: true,
placeholder: tableLocale.placeholderSelect || '请选择',
ref: inputRef,
filterOption: function filterOption(input, option) {
var _option$children2;
return ((_option$children2 = option.children) === null || _option$children2 === void 0 ? void 0 : _option$children2.toLowerCase().indexOf(input.toLowerCase())) >= 0;
},
onChange: handleFormItemChange,
onDeselect: handleFormItemChange
// getPopupContainer={(triggerNode: any) =>
// triggerNode.closest(SCROLL_POSITION_DOT_CLASS_NAME) || document.body
// }
}, clearAttrComponentProps));
case 'checkbox':
return /*#__PURE__*/React.createElement(Checkbox.Group, _extends({
onChange: handleFormItemChange,
ref: inputRef
}, clearAttrComponentProps));
case 'checkboxSingle':
return /*#__PURE__*/React.createElement(Checkbox, _extends({
onChange: handleFormItemChange,
ref: inputRef
}, clearAttrComponentProps));
case 'radio':
return /*#__PURE__*/React.createElement(Radio, _extends({
onChange: handleFormItemChange
}, clearAttrComponentProps));
case 'radioGroup':
return /*#__PURE__*/React.createElement(Radio.Group, _extends({
onChange: handleFormItemChange,
ref: inputRef
}, clearAttrComponentProps));
case 'switch':
return /*#__PURE__*/React.createElement(Switch, _extends({
size: "small"
}, clearAttrComponentProps, {
onChange: handleFormItemChange
}));
case 'upload':
return /*#__PURE__*/React.createElement(UploadSingle, {
editEnum: resultComponentProps,
ref: inputRef,
onChange: handleFormItemChange
});
case 'operate':
case 'lm_edit_opetate':
return /*#__PURE__*/React.createElement(QuickOpetate, _extends({
record: record,
rowKey: rowKey,
handleAdd: handleTableRowAdd,
handleDelete: handleTableRowDelete,
getLength: getLength,
quickOpetateClearAll: quickOpetateClearAll
}, resultComponentProps));
case 'render':
{
var _resultComponentProps = resultComponentProps,
render = _resultComponentProps.render;
var fromData = form === null || form === void 0 ? void 0 : form.getFieldsValue();
return render === null || render === void 0 ? void 0 : render(_objectSpread(_objectSpread({}, !isObjEmpty(fromData) ? _objectSpread(_objectSpread({}, record), {}, _defineProperty({}, dataIndex, fromData[dataIndex])) : record), {}, {
onChange: save
}), rowIndex);
}
default:
return /*#__PURE__*/React.createElement(Input, _extends({
onPressEnter: handleFormItemChange,
onBlur: handleFormItemChange,
ref: inputRef
}, resultComponentProps));
}
};
var getMemoChildNode = useMemo(function () {
var editable = col.editable,
dataIndex = col.dataIndex,
formProps = col.formProps,
componentProps = col.componentProps,
hoverEdit = col.hoverEdit;
var carryOutFormProps = isFunction(formProps) ? formProps === null || formProps === void 0 ? void 0 : formProps(record, col) : formProps;
var resultComponentProps = isFunction(componentProps) ? componentProps === null || componentProps === void 0 ? void 0 : componentProps(record, col) : componentProps;
var childNode = children;
if (hoverEdit && !editing) {
childNode = /*#__PURE__*/React.createElement("div", {
className: "editable-cell-value-wrap",
style: {
minHeight: '22px'
},
onClick: toggleEdit
}, childNode);
} else if (isEdit && editable) {
childNode = isExpandRow(childNode) ? /*#__PURE__*/React.createElement("div", {
style: {
display: 'flex',
flexDirection: 'row',
flexWrap: 'nowrap'
}
}, isExpandRow(childNode) && childNode[0], /*#__PURE__*/React.createElement(Form.Item, _extends({
errorPlacement: "right",
valuePropName: editable === 'switch' ? 'checked' : 'value',
style: {
margin: 0
},
noStyle: !!formProps ? false : true
}, carryOutFormProps, {
name: dataIndex
}), Control(editable))) : /*#__PURE__*/React.createElement(Form.Item, _extends({
errorPlacement: "right",
valuePropName: editable === 'switch' ? 'checked' : 'value',
style: {
margin: 0
},
noStyle: !!formProps ? false : true
}, carryOutFormProps, {
name: dataIndex
}), Control(editable));
if (editable === 'input' && (resultComponentProps !== null && resultComponentProps !== void 0 && resultComponentProps.addonBefore || resultComponentProps !== null && resultComponentProps !== void 0 && resultComponentProps.addonAfter)) {
childNode = isExpandRow(childNode) ? /*#__PURE__*/React.createElement("div", {
style: {
display: 'flex',
flexDirection: 'row',
flexWrap: 'nowrap'
}
}, isExpandRow(childNode) && childNode[0], /*#__PURE__*/React.createElement(Form.Item, _extends({
errorPlacement: "right",
style: {
margin: 0
}
}, carryOutFormProps, {
noStyle: !!formProps ? false : true,
name: [dataIndex, 'value']
}), Control(editable))) : /*#__PURE__*/React.createElement(Form.Item, _extends({
errorPlacement: "right",
style: {
margin: 0
}
}, carryOutFormProps, {
noStyle: !!formProps ? false : true,
name: [dataIndex, 'value']
}), Control(editable));
}
} else if (!isEdit && componentProps !== null && componentProps !== void 0 && componentProps.options) {
var _componentProps$optio, _componentProps$optio2;
return (componentProps === null || componentProps === void 0 ? void 0 : (_componentProps$optio = componentProps.options) === null || _componentProps$optio === void 0 ? void 0 : (_componentProps$optio2 = _componentProps$optio.find(function (item) {
return item.value === record[dataIndex];
})) === null || _componentProps$optio2 === void 0 ? void 0 : _componentProps$optio2.label) || childNode;
}
return childNode;
}, [col, isEdit, editing, getLength, record]);
// 出现死循环找我
useEffect(function () {
var editable = col.editable,
dataIndex = col.dataIndex;
if (isEdit && editable) {
form === null || form === void 0 ? void 0 : form.setFieldsValue(_defineProperty({}, dataIndex, editable === 'date' && record[dataIndex] ? moment(record[dataIndex]) : record[dataIndex]));
}
}, [record]);
var handleTdHover = function handleTdHover() {
setHoverStatus(true);
};
var handleTdMouseOut = function handleTdMouseOut() {
setHoverStatus(false);
};
var handleTdPaste = function handleTdPaste(e, type) {
handlePaste(e, type, {
rowIndex: rowIndex,
colIndex: colIndex,
dataIndex: dataIndex
});
};
return /*#__PURE__*/React.createElement("td", _extends({}, omit(clearProps, ['dataIndex']), {
className: cls(clearProps === null || clearProps === void 0 ? void 0 : clearProps.className, 'lm_custom_cell_td'),
onMouseEnter: componentProps.quickcopy ? handleTdHover : undefined,
onMouseLeave: componentProps.quickcopy ? handleTdMouseOut : undefined,
onPaste: handleTdPaste,
style: col !== null && col !== void 0 && col.fixed ? _objectSpread(_objectSpread({}, clearProps === null || clearProps === void 0 ? void 0 : clearProps.style), {}, {
zIndex: (initialiZindex || 0) - (Number(col === null || col === void 0 ? void 0 : col.order) || 0)
}) : _objectSpread({}, clearProps === null || clearProps === void 0 ? void 0 : clearProps.style),
key: "r".concat(rowIndex, "_c").concat(colIndex)
}), hoverStatus && props.rowIndex > 0 && /*#__PURE__*/React.createElement("span", {
className: "quick_copy_warp quick_copy_up",
onClick: function onClick(e) {
return copyKey(e, 'up');
}
}, /*#__PURE__*/React.createElement(IconFont, {
type: "lmweb-icon_up"
})), getMemoChildNode, hoverStatus && props.rowIndex < props.getLength - 1 && /*#__PURE__*/React.createElement("span", {
className: "quick_copy_warp quick_copy_down",
onClick: function onClick(e) {
return copyKey(e, 'down');
}
}, /*#__PURE__*/React.createElement(IconFont, {
type: "lmweb-icon_down"
})));
};
/** true 不刷新， false 刷新 */
var MemoEditableCell = /*#__PURE__*/memo(EditableCell, function (prev, next) {
var pickProps = ['record', 'colIndex'];
var p = pick(prev, pickProps);
var n = pick(next, pickProps);
if (next !== null && next !== void 0 && next.shouldUpdate) {
return false;
}
// console.log(!checkMemoShouldUploadSpecialFun(prev, next), isEqual(p, n), '22', prev.record, next.record)
// console.log('333', checkMemoShouldUploadSpecialFun(prev, next), isEqual(p, n))
/** TODO: 在record中带有children，子列表数据修改之后，会导致父级的record对比不一样 */
if (!checkMemoShouldUploadSpecialFun(prev, next)) {
return false;
}
return isEqual(p, n);
});
var EditTable = /*#__PURE__*/forwardRef(function (props, ref) {
var _localRowSelectList$s2;
var defaultData = props.value,
defaultColumns = props.columns,
isEdit = props.isEdit,
_props$isAdd = props.isAdd,
isAdd = _props$isAdd === void 0 ? false : _props$isAdd,
onChange = props.onChange,
onPaste = props.onPaste,
_props$rowKey = props.rowKey,
_rowKey = _props$rowKey === void 0 ? '_ID' : _props$rowKey,
rowHoverEdit = props.rowHoverEdit,
_props$isUseForm = props.isUseForm,
isUseForm = _props$isUseForm === void 0 ? true : _props$isUseForm,
isHoverEdit = props.isHoverEdit,
useQuickOpetate = props.useQuickOpetate,
_props$quickOpetateCl = props.quickOpetateClearAll,
quickOpetateClearAll = _props$quickOpetateCl === void 0 ? true : _props$quickOpetateCl,
rowSelection = props.rowSelection,
rowDisabled = props.rowDisabled,
virtual = props.virtual,
sortOpen = props.sortOpen,
disabled = props.disabled,
colSortOpen = props.colSortOpen,
_props$indexCol = props.indexCol,
indexCol = _props$indexCol === void 0 ? false : _props$indexCol,
filterChange = props.filterChange,
_props$size = props.size,
size = _props$size === void 0 ? 'middle' : _props$size,
recordCreatorProps = props.recordCreatorProps,
_props$shouldUpdate = props.shouldUpdate,
shouldUpdate = _props$shouldUpdate === void 0 ? false : _props$shouldUpdate,
_props$loading = props.loading,
loading = _props$loading === void 0 ? false : _props$loading,
_props$autoSizer = props.autoSizer,
autoSizer = _props$autoSizer === void 0 ? false : _props$autoSizer,
_props$initialiZindex = props.initialiZindex,
initialiZindex = _props$initialiZindex === void 0 ? 100 : _props$initialiZindex,
_props$resizable = props.resizable,
resizable = _props$resizable === void 0 ? false : _props$resizable,
emptyProps = props.emptyProps,
_props$roleFiledKeys = props.roleFiledKeys,
roleFiledKeys = _props$roleFiledKeys === void 0 ? [] : _props$roleFiledKeys,
_props$columnsValueDe = props.columnsValueDecimal,
columnsValueDecimal = _props$columnsValueDe === void 0 ? {
amount: 2
} : _props$columnsValueDe,
resetProps = _objectWithoutProperties(props, _excluded6);
var _useControllableValue = useControllableValue({
value: checkRowKeyByDataSource(props.value, _rowKey),
onChange: props.onChange
}),
_useControllableValue2 = _slicedToArray(_useControllableValue, 2),
dataSource = _useControllableValue2[0],
setDataSource = _useControllableValue2[1];
var _React$useContext3 = React.useContext(ConfigContext),
_React$useContext3$lo = _React$useContext3.locale,
contextLocale = _React$useContext3$lo === void 0 ? defaultLocale : _React$useContext3$lo;
var tableLocale = _objectSpread({}, contextLocale.Table);
var _useState7 = useState(defaultColumns),
_useState8 = _slicedToArray(_useState7, 2),
columns = _useState8[0],
setColumns = _useState8[1];
var transformRowSelect = function transformRowSelect(selectedRowKeys, selectedRows, info) {
var _rowSelection$onChang;
return rowSelection === null || rowSelection === void 0 ? void 0 : (_rowSelection$onChang = rowSelection.onChange) === null || _rowSelection$onChang === void 0 ? void 0 : _rowSelection$onChang.call(rowSelection, selectedRowKeys, selectedRows, info);
};
var _useControllableValue3 = useControllableValue({
value: {
selectedRows: (rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.selectedRows) || (rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.selectedRowKeys) || []
},
onChange: rowSelection !== null && rowSelection !== void 0 && rowSelection.onChange ? transformRowSelect : undefined
}),
_useControllableValue4 = _slicedToArray(_useControllableValue3, 2),
localRowSelectList = _useControllableValue4[0],
setLocalRowSelectList = _useControllableValue4[1];
var _useControllableValue5 = useControllableValue({
value: {
disabledRows: (rowDisabled === null || rowDisabled === void 0 ? void 0 : rowDisabled.disabledRows) || []
}
}),
_useControllableValue6 = _slicedToArray(_useControllableValue5, 1),
localDisabledRows = _useControllableValue6[0];
/** TODO: 当前展开的列 */
var _useState9 = useState([]),
_useState10 = _slicedToArray(_useState9, 2),
expandedRowKeys = _useState10[0],
setExpandedRowKeys = _useState10[1];
var dataSourceRef = useRef(dataSource);
var deepDataSourceRef = useRef(deepDataSourcePreKeys(dataSource, _rowKey));
dataSourceRef.current = dataSource;
deepDataSourceRef.current = deepDataSourcePreKeys(dataSource, _rowKey);
var disabledDataSourceRowKeys = useRef(checkTableRowIsDisable(deepDataSourceRef.current, localDisabledRows.disabledRows, _rowKey));
disabledDataSourceRowKeys.current = checkTableRowIsDisable(deepDataSourceRef.current, localDisabledRows.disabledRows, _rowKey);
var columnsRef = useRef(defaultColumns);
useEffect(function () {
setColumns(defaultColumns);
}, [defaultColumns]);
var tableWarpRef = useRef(null);
var autoSizerRef = useRef(null);
var allFormListRef = useRef({});
var scrollToIndexRef = useRef(null);
var _Form$useForm5 = Form.useForm(),
_Form$useForm6 = _slicedToArray(_Form$useForm5, 1),
checkForm = _Form$useForm6[0];
var onColSortEnd = function onColSortEnd(active, over) {
var _arrayMove;
var oldIndex = columns.findIndex(function (item) {
return item.dataIndex === active;
});
var newIndex = columns.findIndex(function (item) {
return item.dataIndex === over;
});
filterChange === null || filterChange === void 0 ? void 0 : filterChange((_arrayMove = arrayMove(columns, oldIndex, newIndex)) === null || _arrayMove === void 0 ? void 0 : _arrayMove.map(function (item, index) {
return _objectSpread(_objectSpread({}, item), {}, {
order: index
});
}));
};
// 删除
var handleDelete = function handleDelete(key) {
var nValue = dataSource.filter(function (item) {
return item[_rowKey] !== key;
});
setDataSource(nValue);
};
/** 点击底部添加按钮添加 */
var handleAdd = debounce(function (row) {
var _recordCreatorProps$i;
var addDataInfo = isFunction(recordCreatorProps === null || recordCreatorProps === void 0 ? void 0 : recordCreatorProps.initData) ? recordCreatorProps === null || recordCreatorProps === void 0 ? void 0 : (_recordCreatorProps$i = recordCreatorProps.initData) === null || _recordCreatorProps$i === void 0 ? void 0 : _recordCreatorProps$i.call(recordCreatorProps) : recordCreatorProps === null || recordCreatorProps === void 0 ? void 0 : recordCreatorProps.initData;
var res = produce(dataSourceRef.current, function (draft) {
draft.push(_objectSpread(_defineProperty({}, _rowKey, "".concat(Date.now())), addDataInfo || {}));
});
setDataSource(res);
}, 40);
// const reWriteOriginSource = (rowKey: string, rowValue, dataIndex: number, nextValue) => {
// setDataSource((prevDataSource) => {
// return prevDataSource?.map((item) => {
// if (get(item, rowKey) === rowValue) {
// set(item, dataIndex, nextValue)
// }
// return item
// })
// })
// }
// @ts-ignore
/** 删除当前行 */
var handleTableRowDelete = debounce(function (key) {
var _deepDataSourceRef$cu, _deepDataSourceRef$cu2;
var rkey = isObject(key) ? key[_rowKey] : key;
var preKeys = deepDataSourceRef === null || deepDataSourceRef === void 0 ? void 0 : (_deepDataSourceRef$cu = deepDataSourceRef.current) === null || _deepDataSourceRef$cu === void 0 ? void 0 : (_deepDataSourceRef$cu2 = _deepDataSourceRef$cu[rkey]) === null || _deepDataSourceRef$cu2 === void 0 ? void 0 : _deepDataSourceRef$cu2.preKeys;
if (preKeys.length > 1) {
/** 说明删除的是children中的数据 */
function filter(data, key) {
var newData = data === null || data === void 0 ? void 0 : data.filter(function (x) {
return x[_rowKey] !== key;
});
newData === null || newData === void 0 ? void 0 : newData.forEach(function (x) {
if (x.children) {
var c = filter(x.children, key);
x.children = c;
if (!c.length) {
delete x.children;
}
}
});
return newData;
}
var res = filter(dataSourceRef.current, key);
setDataSource(res);
} else {
var _dataSourceRef$curren;
if (((_dataSourceRef$curren = dataSourceRef.current) === null || _dataSourceRef$curren === void 0 ? void 0 : _dataSourceRef$curren.length) === 1 && !quickOpetateClearAll) {
return false;
}
var _res = produce(dataSourceRef.current, function (draft) {
var index = draft.findIndex(function (item) {
return key === item[_rowKey];
});
if (index !== -1) {
draft.splice(index, 1);
}
});
setDataSource(_res);
}
return null;
}, 40);
/** 替换当前行 */
var handleTableRowReplace = debounce(function (record, defaultRecord) {
var _deepDataSourceRef$cu3, _deepDataSourceRef$cu4;
var rkey = isObject(record) ? record[_rowKey] : record;
var preKeys = deepDataSourceRef === null || deepDataSourceRef === void 0 ? void 0 : (_deepDataSourceRef$cu3 = deepDataSourceRef.current) === null || _deepDataSourceRef$cu3 === void 0 ? void 0 : (_deepDataSourceRef$cu4 = _deepDataSourceRef$cu3[rkey]) === null || _deepDataSourceRef$cu4 === void 0 ? void 0 : _deepDataSourceRef$cu4.preKeys;
// const res = cloneDeep(dataSourceRef.current)
var deep = function deep(children) {
return children.map(function (item) {
if (item[_rowKey] === rkey) {
return defaultRecord;
} else if (preKeys.includes(item[_rowKey]) && item.children) {
var child = deep(item.children);
return _objectSpread(_objectSpread({}, item), {}, {
children: child
});
} else {
return item;
}
});
};
var res = deep(dataSourceRef.current);
setDataSource(res);
}, 20);
/** 快捷添加 */
var handleTableRowAdd = debounce(function (record, isAppendInChindren, defaultRecord) {
var _deepDataSourceRef$cu5, _deepDataSourceRef$cu6;
var rkey = isObject(record) ? record[_rowKey] : record;
var preKeys = deepDataSourceRef === null || deepDataSourceRef === void 0 ? void 0 : (_deepDataSourceRef$cu5 = deepDataSourceRef.current) === null || _deepDataSourceRef$cu5 === void 0 ? void 0 : (_deepDataSourceRef$cu6 = _deepDataSourceRef$cu5[rkey]) === null || _deepDataSourceRef$cu6 === void 0 ? void 0 : _deepDataSourceRef$cu6.preKeys;
var res = produce(dataSourceRef.current, function (draft) {
if ((preKeys === null || preKeys === void 0 ? void 0 : preKeys.length) > 1) {
function deeps(children) {
children === null || children === void 0 ? void 0 : children.forEach(function (item, index) {
if (preKeys !== null && preKeys !== void 0 && preKeys.includes(item[_rowKey])) {
if (item[_rowKey] === rkey) {
if (isAppendInChindren) {
if (item !== null && item !== void 0 && item.children) {
if (Array.isArray(defaultRecord)) {
var _item$children;
item === null || item === void 0 ? void 0 : (_item$children = item.children) === null || _item$children === void 0 ? void 0 : _item$children.push.apply(_item$children, _toConsumableArray(defaultRecord));
} else {
var _item$children2;
item === null || item === void 0 ? void 0 : (_item$children2 = item.children) === null || _item$children2 === void 0 ? void 0 : _item$children2.push(defaultRecord || _defineProperty({}, _rowKey, "".concat(Date.now())));
}
} else {
if (Array.isArray(defaultRecord)) {
item.children = _toConsumableArray(defaultRecord);
} else {
item.children = [defaultRecord || _defineProperty({}, _rowKey, "".concat(Date.now()))];
}
}
!expandedRowKeys.includes(item[_rowKey]) && setExpandedRowKeys([].concat(_toConsumableArray(expandedRowKeys), [item[_rowKey]]));
} else {
if (Array.isArray(defaultRecord)) {
children.splice.apply(children, [index + 1, 0].concat(_toConsumableArray(defaultRecord)));
} else {
children.splice(index + 1, 0, defaultRecord || _defineProperty({}, _rowKey, "".concat(Date.now())));
}
}
} else if (item.children) {
deeps(item.children);
}
}
});
}
deeps(draft);
} else {
var _index = draft.findIndex(function (item) {
return rkey === item[_rowKey];
});
if (_index !== -1) {
if (isAppendInChindren) {
var _draft$_index$childre, _draft$_index, _draft$_index2;
if ((_draft$_index$childre = draft[_index].children) !== null && _draft$_index$childre !== void 0 && _draft$_index$childre.length) {
if (Array.isArray(defaultRecord)) {
var _draft$_index$childre2;
(_draft$_index$childre2 = draft[_index].children) === null || _draft$_index$childre2 === void 0 ? void 0 : _draft$_index$childre2.push.apply(_draft$_index$childre2, _toConsumableArray(defaultRecord));
} else {
var _draft$_index$childre3;
(_draft$_index$childre3 = draft[_index].children) === null || _draft$_index$childre3 === void 0 ? void 0 : _draft$_index$childre3.push(defaultRecord || _defineProperty({}, _rowKey, "".concat(Date.now())));
}
} else {
draft[_index].children = Array.isArray(defaultRecord) ? _toConsumableArray(defaultRecord) : [defaultRecord || _defineProperty({}, _rowKey, "".concat(Date.now()))];
}
!expandedRowKeys.includes((_draft$_index = draft[_index]) === null || _draft$_index === void 0 ? void 0 : _draft$_index[_rowKey]) && setExpandedRowKeys([].concat(_toConsumableArray(expandedRowKeys), [(_draft$_index2 = draft[_index]) === null || _draft$_index2 === void 0 ? void 0 : _draft$_index2[_rowKey]]));
} else {
if (Array.isArray(defaultRecord)) {
draft.splice.apply(draft, [_index + 1, 0].concat(_toConsumableArray(defaultRecord)));
} else {
draft.splice(_index + 1, 0, defaultRecord || _defineProperty({}, _rowKey, "".concat(Date.now())));
}
}
}
}
});
setDataSource(res);
}, 50);
var handleSave = function handleSave(row, options) {
var _deepDataSourceRef$cu7, _deepDataSourceRef$cu8;
var preKeys = deepDataSourceRef === null || deepDataSourceRef === void 0 ? void 0 : (_deepDataSourceRef$cu7 = deepDataSourceRef.current) === null || _deepDataSourceRef$cu7 === void 0 ? void 0 : (_deepDataSourceRef$cu8 = _deepDataSourceRef$cu7[row[_rowKey]]) === null || _deepDataSourceRef$cu8 === void 0 ? void 0 : _deepDataSourceRef$cu8.preKeys;
if (options !== null && options !== void 0 && options.only) {
var res = produce(dataSourceRef.current, function (draft) {
if (options !== null && options !== void 0 && options.only) {
var _options$only = options === null || options === void 0 ? void 0 : options.only,
key = _options$only.key,
value = _options$only.value;
if ((preKeys === null || preKeys === void 0 ? void 0 : preKeys.length) > 1) {
function deeps(children) {
children === null || children === void 0 ? void 0 : children.forEach(function (item) {
if (preKeys.includes(item[_rowKey])) {
if (item[_rowKey] === row[_rowKey]) {
var _Object$keys;
children === null || children === void 0 ? void 0 : children.forEach(function (c) {
c[key] = value;
});
(_Object$keys = Object.keys(item)) === null || _Object$keys === void 0 ? void 0 : _Object$keys.forEach(function (v) {
item[v] = row[v] || item[v];
});
} else if (item.children) {
deeps(item.children);
}
}
});
}
deeps(draft);
} else {
draft === null || draft === void 0 ? void 0 : draft.forEach(function (item, index) {
if (row[_rowKey] === item[_rowKey]) {
draft[index] = row;
} else {
draft[index][key] = value;
}
});
}
} else {
if ((preKeys === null || preKeys === void 0 ? void 0 : preKeys.length) > 1) {
function deeps(children) {
children === null || children === void 0 ? void 0 : children.forEach(function (item) {
if (preKeys.includes(item[_rowKey])) {
if (item[_rowKey] === row[_rowKey]) {
var _Object$keys2;
(_Object$keys2 = Object.keys(row)) === null || _Object$keys2 === void 0 ? void 0 : _Object$keys2.forEach(function (v) {
item[v] = row[v] || item[v];
});
} else if (item.children) {
deeps(item.children);
}
}
});
}
deeps(draft);
} else {
var _index2 = draft.findIndex(function (item) {
return row[_rowKey] === item[_rowKey];
});
if (_index2 !== -1) {
draft[_index2] = row;
}
}
}
});
setDataSource(res);
} else {
handleTableRowReplace(row[_rowKey], row);
}
};
/** 快捷刷子功能 */
var handleCopy = /*#__PURE__*/function () {
var _ref12 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(key, value, type, rowIndex) {
var res, formatCopyDataSource;
return _regeneratorRuntime.wrap(function _callee2$(_context2) {
while (1) switch (_context2.prev = _context2.next) {
case 0:
res = produce(dataSourceRef.current, function (draft) {
draft === null || draft === void 0 ? void 0 : draft.forEach(function (item, index) {
if (type === 'up' && index < rowIndex || type === 'down' && index > rowIndex) {
item[key] = value;
}
});
});
if (!props.copyFormat) {
_context2.next = 7;
break;
}
_context2.next = 4;
return props.copyFormat(res, {
key: key,
value: value,
type: type,
rowIndex: rowIndex
});
case 4:
_context2.t0 = _context2.sent;
_context2.next = 8;
break;
case 7:
_context2.t0 = res;
case 8:
formatCopyDataSource = _context2.t0;
setDataSource(formatCopyDataSource);
case 10:
case "end":
return _context2.stop();
}
}, _callee2);
}));
return function handleCopy(_x2, _x3, _x4, _x5) {
return _ref12.apply(this, arguments);
};
}();
/* 快捷粘贴功能 */
var handlePaste = function handlePaste(event, type, _ref13) {
var rowIndex = _ref13.rowIndex,
colIndex = _ref13.colIndex,
dataIndex = _ref13.dataIndex;
// let curDataSource = dataSourceRef.current
// const curColIndex = columns.findIndex((v) => v.dataIndex === dataIndex) // 当前列Index
// const datas = curDataSource.concat(new Array(rowIndex + pasteValues.length - curDataSource.length).fill({}))
// const _ID = Date.now()
// const newData = datas.map((record = {}, index) => {
// // 若选中的行索引
// if (index >= rowIndex) {
// const newRowArr = pasteValues[index - rowIndex] // 获取插入的行数据
// newRowArr.forEach((val, valIndex) => {
// const curDataIndex = columns[curColIndex + valIndex].dataIndex
// record[curDataIndex] = val
// })
// }
// return { _ID: _ID + index, ...record }
// })
// data.map((record, index) => {
// console.log('record', record[colIndex])
// // const curPaste = pasteValues[index]; // 当前粘贴行数据
// // record[dataIndex] = record[dataIndex] + curPaste[colIndex]
// })
// 根据列的索引获取列
/* 打平列结构: 排除了group */
var flatColumns = function flatColumns(arr) {
return arr.reduce(function (pre, cur) {
var _cur$children;
var child = cur !== null && cur !== void 0 && (_cur$children = cur.children) !== null && _cur$children !== void 0 && _cur$children.length ? flatColumns(cur.children) : [cur];
return [].concat(_toConsumableArray(pre), _toConsumableArray(child));
}, []);
// const result = []
// for (let i = 0; i < arr.length; i++) {
// const item = arr[i]
// if (item?.children?.length) {
// const child = flatColumns(item.children)
// result.push(...child)
// continue
// }
// result.push(item)
// }
// return result
};
var getColumnsByIndex = function getColumnsByIndex(colIndex) {
var _flatColumns;
return (_flatColumns = flatColumns(columns)) === null || _flatColumns === void 0 ? void 0 : _flatColumns[colIndex];
};
onPaste === null || onPaste === void 0 ? void 0 : onPaste({
event: event,
type: type,
dataSource: dataSource,
getColumnsByIndex: getColumnsByIndex,
rowIndex: rowIndex,
colIndex: colIndex,
dataIndex: dataIndex
});
};
/** 判断columne中有没有带optionOnly参数 */
var has