amis 2.0.0-rc.9 → 2.0.2

package/esm/renderers/Table-v2/index.js

@@ -0,0 +1,833 @@
+/**
+ * amis v2.0.2
+ * Copyright 2018-2022 baidu
+ */
+
+import { __extends, __spreadArray, __rest, __assign, __awaiter, __generator, __decorate, __metadata } from 'tslib';
+import React from 'react';
+import { findDOMNode } from 'react-dom';
+import { isAlive } from 'mobx-state-tree';
+import cloneDeep from 'lodash/cloneDeep';
+import isEqual from 'lodash/isEqual';
+import { resolveVariableAndFilter, evalExpression, anyChanged, isPureVariable, isObject, resolveVariable, filter, isEffectiveApi, createObject, difference, ScopedContext, autobind, Renderer, TableStoreV2 } from 'amis-core';
+import { Table, Icon, Spinner } from 'amis-ui';
+import { HeadCellSearchDropDown } from './HeadCellSearchDropdown.js';
+import './TableCell.js';
+import './ColumnToggler.js';
+
+var TableV2 = /** @class */ (function (_super) {
+    __extends(TableV2, _super);
+    function TableV2(props, context) {
+        var _this = _super.call(this, props) || this;
+        _this.renderedToolbars = [];
+        var scoped = context;
+        scoped.registerComponent(_this);
+        var store = props.store, columnsTogglable = props.columnsTogglable, columns = props.columns;
+        store.update({ columnsTogglable: columnsTogglable, columns: columns });
+        TableV2.syncRows(store, props, undefined) && _this.syncSelected();
+        return _this;
+    }
+    TableV2.prototype.componentWillUnmount = function () {
+        var scoped = this.context;
+        scoped.unRegisterComponent(this);
+    };
+    TableV2.prototype.controlRef = function (control) {
+        // 因为 control 有可能被 n 层 hoc 包裹。
+        while (control && control.getWrappedInstance) {
+            control = control.getWrappedInstance();
+        }
+        this.control = control;
+    };
+    TableV2.prototype.syncSelected = function () {
+        var _a = this.props, store = _a.store, onSelect = _a.onSelect;
+        onSelect &&
+            onSelect(store.selectedRows.map(function (item) { return item.data; }), store.unSelectedRows.map(function (item) { return item.data; }));
+    };
+    TableV2.syncRows = function (store, props, prevProps) {
+        var source = props.source;
+        var value = props.value || props.items;
+        var rows = [];
+        var updateRows = false;
+        if (Array.isArray(value) &&
+            (!prevProps || (prevProps.value || prevProps.items) !== value)) {
+            updateRows = true;
+            rows = value;
+        }
+        else if (typeof source === 'string') {
+            var resolved = resolveVariableAndFilter(source, props.data, '| raw');
+            var prev = prevProps
+                ? resolveVariableAndFilter(source, prevProps.data, '| raw')
+                : null;
+            if (prev && prev === resolved) {
+                updateRows = false;
+            }
+            else if (Array.isArray(resolved)) {
+                updateRows = true;
+                rows = resolved;
+            }
+        }
+        updateRows &&
+            store.initRows(rows, props.getEntryId, props.reUseRow, props.childrenColumnName);
+        var selectedRowKeys = [];
+        // selectedRowKeysExpr比selectedRowKeys优先级高
+        if (props.rowSelection && props.rowSelection.selectedRowKeysExpr) {
+            rows.forEach(function (row, index) {
+                var _a;
+                var flag = evalExpression(props.rowSelection.selectedRowKeysExpr, {
+                    record: row,
+                    rowIndex: index
+                });
+                if (flag) {
+                    selectedRowKeys.push(row[((_a = props === null || props === void 0 ? void 0 : props.rowSelection) === null || _a === void 0 ? void 0 : _a.keyField) || 'key']);
+                }
+            });
+        }
+        else if (props.rowSelection && props.rowSelection.selectedRowKeys) {
+            selectedRowKeys = __spreadArray([], props.rowSelection.selectedRowKeys, true);
+        }
+        if (updateRows && selectedRowKeys.length > 0) {
+            store.updateSelected(selectedRowKeys, props.rowSelection.keyField);
+        }
+        var expandedRowKeys = [];
+        if (props.expandable && props.expandable.expandedRowKeysExpr) {
+            rows.forEach(function (row, index) {
+                var _a;
+                var flag = evalExpression(props.expandable.expandedRowKeysExpr, {
+                    record: row,
+                    rowIndex: index
+                });
+                if (flag) {
+                    expandedRowKeys.push(row[((_a = props === null || props === void 0 ? void 0 : props.expandable) === null || _a === void 0 ? void 0 : _a.keyField) || 'key']);
+                }
+            });
+        }
+        else if (props.expandable && props.expandable.expandedRowKeys) {
+            expandedRowKeys = __spreadArray([], props.expandable.expandedRowKeys, true);
+        }
+        if (updateRows && expandedRowKeys.length > 0) {
+            store.updateExpanded(expandedRowKeys, props.expandable.keyField);
+        }
+        return updateRows;
+    };
+    TableV2.prototype.componentDidUpdate = function (prevProps) {
+        var props = this.props;
+        var store = props.store;
+        if (anyChanged(['columnsTogglable'], prevProps, props)) {
+            store.update({
+                columnsTogglable: props.columnsTogglable
+            });
+        }
+        if (anyChanged(['source', 'value', 'items'], prevProps, props) ||
+            (!props.value &&
+                !props.items &&
+                (props.data !== prevProps.data ||
+                    (typeof props.source === 'string' && isPureVariable(props.source))))) {
+            TableV2.syncRows(store, props, prevProps) && this.syncSelected();
+        }
+        if (!isEqual(prevProps.columns, props.columns)) {
+            store.update({
+                columns: props.columns
+            });
+        }
+    };
+    TableV2.prototype.getPopOverContainer = function () {
+        return findDOMNode(this);
+    };
+    TableV2.prototype.renderCellSchema = function (schema, props) {
+        var render = this.props.render;
+        // Table Cell SchemaObject转化成ReactNode
+        if (schema && isObject(schema)) {
+            // 在TableCell里会根据width设置div的width
+            // 原来的table td/th是最外层标签 设置width没问题
+            // v2的拆开了 就不需要再设置div的width了
+            // 否则加上padding 就超出单元格的区域了
+            // children属性在schema里是一个关键字 在渲染器schema中 自定义的children没有用 去掉
+            schema.width; schema.children; var rest = __rest(schema, ["width", "children"]);
+            return render('cell-field', __assign(__assign({}, rest), { type: 'cell-field', column: rest, data: props.data, name: schema.key }), props);
+        }
+        return schema;
+    };
+    TableV2.prototype.renderSchema = function (key, schema, props) {
+        var render = this.props.render;
+        // Header、Footer等SchemaObject转化成ReactNode
+        if (schema && isObject(schema)) {
+            return render(key || 'field', __assign(__assign({}, schema), { data: props.data }), props);
+        }
+        else if (Array.isArray(schema)) {
+            var renderers_1 = [];
+            schema.forEach(function (s, i) {
+                return renderers_1.push(render(key || 'field', __assign(__assign({}, s), { data: props.data }), __assign(__assign({}, props), { key: i })));
+            });
+            return renderers_1;
+        }
+        return schema;
+    };
+    // editor传来的处理过的column 还可能包含其他字段
+    TableV2.prototype.buildColumns = function (columns) {
+        var _this = this;
+        var _a = this.props, env = _a.env, render = _a.render, store = _a.store, popOverContainer = _a.popOverContainer, canAccessSuperData = _a.canAccessSuperData, showBadge = _a.showBadge, itemBadge = _a.itemBadge, cx = _a.classnames;
+        var cols = [];
+        var rowSpans = [];
+        var colSpans = [];
+        Array.isArray(columns) &&
+            columns.forEach(function (column, col) {
+                var clone = __assign({}, column);
+                var titleSchema = null;
+                var titleProps = {
+                    popOverContainer: popOverContainer || _this.getPopOverContainer,
+                    value: column.title
+                };
+                if (isObject(column.title)) {
+                    titleSchema = cloneDeep(column.title);
+                }
+                else if (typeof column.title === 'string') {
+                    titleSchema = { type: 'plain' };
+                }
+                var titleRender = function (children) {
+                    var _a;
+                    var content = _this.renderCellSchema(titleSchema, titleProps);
+                    var remark = null;
+                    if (column.remark) {
+                        remark = render('remark', {
+                            type: 'remark',
+                            tooltip: column.remark,
+                            container: env && env.getModalContainer ? env.getModalContainer : undefined
+                        });
+                    }
+                    return (React.createElement("div", { key: col, className: cx('Table-head-cell-wrapper', (_a = {},
+                            _a["".concat(column.className)] = !!column.className,
+                            _a["".concat(column.titleClassName)] = !!column.titleClassName,
+                            _a)) },
+                        content,
+                        remark,
+                        children));
+                };
+                Object.assign(clone, {
+                    title: titleRender
+                });
+                // 设置了type值 就完全按渲染器处理了
+                if (column.type) {
+                    Object.assign(clone, {
+                        render: function (text, record, rowIndex, colIndex) {
+                            var props = {};
+                            var item = store.getRowByIndex(rowIndex) || {};
+                            var obj = {
+                                children: _this.renderCellSchema(column, {
+                                    data: item.locals,
+                                    value: column.key
+                                        ? resolveVariable(column.key, canAccessSuperData ? item.locals : item.data)
+                                        : column.key,
+                                    popOverContainer: popOverContainer || _this.getPopOverContainer,
+                                    onQuickChange: function (values, saveImmediately, savePristine, resetOnFailed) {
+                                        _this.handleQuickChange(item, values, saveImmediately, savePristine, resetOnFailed);
+                                    },
+                                    row: item,
+                                    showBadge: showBadge,
+                                    itemBadge: itemBadge
+                                }),
+                                props: props
+                            };
+                            if (column.rowSpanExpr) {
+                                var rowSpan = +filter(column.rowSpanExpr, {
+                                    record: record,
+                                    rowIndex: rowIndex,
+                                    colIndex: colIndex
+                                });
+                                if (rowSpan) {
+                                    obj.props.rowSpan = rowSpan;
+                                    rowSpans.push({ colIndex: colIndex, rowIndex: rowIndex, rowSpan: rowSpan });
+                                }
+                            }
+                            if (column.colSpanExpr) {
+                                var colSpan = +filter(column.colSpanExpr, {
+                                    record: record,
+                                    rowIndex: rowIndex,
+                                    colIndex: colIndex
+                                });
+                                if (colSpan) {
+                                    obj.props.colSpan = colSpan;
+                                    colSpans.push({ colIndex: colIndex, rowIndex: rowIndex, colSpan: colSpan });
+                                }
+                            }
+                            rowSpans.forEach(function (item) {
+                                if (colIndex === item.colIndex &&
+                                    rowIndex > item.rowIndex &&
+                                    rowIndex < item.rowIndex + (item.rowSpan || 0)) {
+                                    obj.props.rowSpan = 0;
+                                }
+                            });
+                            colSpans.forEach(function (item) {
+                                if (rowIndex === item.rowIndex &&
+                                    colIndex > item.colIndex &&
+                                    colIndex < item.colIndex + (item.colSpan || 0)) {
+                                    obj.props.colSpan = 0;
+                                }
+                            });
+                            return obj;
+                        }
+                    });
+                }
+                // 设置了单元格样式
+                if (column.classNameExpr) {
+                    clone.className = function (record, rowIndex) {
+                        var className = filter(column.classNameExpr, { record: record, rowIndex: rowIndex });
+                        return "".concat(className).concat(column.className ? " ".concat(column.className) : '');
+                    };
+                }
+                // 设置了列搜索
+                if (column.searchable) {
+                    clone.filterDropdown = (React.createElement(HeadCellSearchDropDown, __assign({}, _this.props, { popOverContainer: _this.getPopOverContainer, name: column.key, searchable: column.searchable, orderBy: store.orderBy, orderDir: store.order, data: store.query, key: 'th-search-' + col, store: store })));
+                }
+                if (column.children) {
+                    clone.children = _this.buildColumns(column.children);
+                }
+                cols.push(clone);
+            });
+        return cols;
+    };
+    TableV2.prototype.buildSummary = function (key, summary) {
+        var _this = this;
+        var result = [];
+        if (Array.isArray(summary)) {
+            summary.forEach(function (s, index) {
+                if (isObject(s)) {
+                    result.push({
+                        colSpan: s.colSpan,
+                        fixed: s.fixed,
+                        render: function (dataSouce) {
+                            return _this.renderSchema(key, s, {
+                                data: dataSouce
+                            });
+                        }
+                    });
+                }
+                else if (Array.isArray(s)) {
+                    if (!result[index]) {
+                        result.push([]);
+                    }
+                    s.forEach(function (d) {
+                        result[index].push({
+                            colSpan: d.colSpan,
+                            fixed: d.fixed,
+                            render: function (dataSouce) {
+                                return _this.renderSchema(key, d, {
+                                    data: dataSouce
+                                });
+                            }
+                        });
+                    });
+                }
+            });
+        }
+        return result.length ? result : null;
+    };
+    TableV2.prototype.reloadTarget = function (target, data) {
+        var scoped = this.context;
+        scoped.reload(target, data);
+    };
+    TableV2.prototype.handleSave = function (rows, diff, indexes, unModifiedItems, rowsOrigin, resetOnFailed) {
+        var _this = this;
+        var _a = this.props, store = _a.store, quickSaveApi = _a.quickSaveApi, quickSaveItemApi = _a.quickSaveItemApi, primaryField = _a.primaryField, env = _a.env, messages = _a.messages, reload = _a.reload;
+        if (Array.isArray(rows)) {
+            if (!isEffectiveApi(quickSaveApi)) {
+                env && env.alert('TableV2 quickSaveApi is required');
+                return;
+            }
+            var data_1 = createObject(store.data, {
+                rows: rows,
+                rowsDiff: diff,
+                indexes: indexes,
+                rowsOrigin: rowsOrigin
+            });
+            if (rows.length && rows[0].hasOwnProperty(primaryField || 'id')) {
+                data_1.ids = rows
+                    .map(function (item) { return item[primaryField || 'id']; })
+                    .join(',');
+            }
+            if (unModifiedItems) {
+                data_1.unModifiedItems = unModifiedItems;
+            }
+            store
+                .saveRemote(quickSaveApi, data_1, {
+                successMessage: messages && messages.saveFailed,
+                errorMessage: messages && messages.saveSuccess
+            })
+                .then(function () {
+                reload && _this.reloadTarget(reload, data_1);
+            })
+                .catch(function () { });
+        }
+        else {
+            if (!isEffectiveApi(quickSaveItemApi)) {
+                env && env.alert('TableV2 quickSaveItemApi is required!');
+                return;
+            }
+            var data_2 = createObject(store.data, {
+                item: rows,
+                modified: diff,
+                origin: rowsOrigin
+            });
+            var sendData = createObject(data_2, rows);
+            store
+                .saveRemote(quickSaveItemApi, sendData)
+                .then(function () {
+                reload && _this.reloadTarget(reload, data_2);
+            })
+                .catch(function () {
+                resetOnFailed && _this.control.reset();
+            });
+        }
+    };
+    TableV2.prototype.handleQuickChange = function (item, values, saveImmediately, savePristine, resetOnFailed) {
+        if (!isAlive(item)) {
+            return;
+        }
+        var _a = this.props, onSave = _a.onSave, onPristineChange = _a.onPristineChange, primaryField = _a.primaryField, quickSaveItemApi = _a.quickSaveItemApi;
+        item.change(values, savePristine);
+        // 值发生变化了，需要通过 onSelect 通知到外面，否则会出现数据不同步的问题
+        item.modified && this.syncSelected();
+        if (savePristine) {
+            onPristineChange === null || onPristineChange === void 0 ? void 0 : onPristineChange(item.data, item.path);
+            return;
+        }
+        if (saveImmediately && saveImmediately.api) {
+            this.props.onAction(null, {
+                actionType: 'ajax',
+                api: saveImmediately.api
+            }, values);
+            return;
+        }
+        onSave
+            ? onSave(item.data, difference(item.data, item.pristine, ['id', primaryField]), item.path, undefined, item.pristine, resetOnFailed)
+            : this.handleSave(quickSaveItemApi ? item.data : [item.data], difference(item.data, item.pristine, ['id', primaryField]), [item.path], undefined, item.pristine, resetOnFailed);
+    };
+    TableV2.prototype.handleAction = function (e, action, ctx) {
+        var onAction = this.props.onAction;
+        // todo
+        onAction(e, action, ctx);
+    };
+    TableV2.prototype.renderActions = function (region) {
+        var _this = this;
+        var _a = this.props, actions = _a.actions, render = _a.render, store = _a.store, cx = _a.classnames, data = _a.data, columnsTogglable = _a.columnsTogglable, $path = _a.$path;
+        // 如果table是在crud里面，自定义显示列配置在grid里，这里就不需要渲染了
+        var isInCrud = /(?:\/|^)crud2\//.test($path);
+        actions = Array.isArray(actions) ? actions.concat() : [];
+        // 现在默认从crud里传进来的columnsTogglable是boolean类型
+        // table单独配置的是SchemaNode类型
+        if (!isInCrud &&
+            store.toggable &&
+            region === 'header' &&
+            !~this.renderedToolbars.indexOf('columns-toggler')) {
+            actions.push({
+                type: 'button',
+                children: render('column-toggler', __assign(__assign({}, (isObject(columnsTogglable) ? columnsTogglable : {})), { type: 'column-toggler' }), {
+                    cols: store.columnsData.map(function (item) { return item.pristine; }),
+                    toggleAllColumns: function () { return store.toggleAllColumns(); },
+                    toggleToggle: function (toggled, index) {
+                        var column = store.columnsData[index];
+                        column.toggleToggle();
+                    }
+                })
+            });
+        }
+        return Array.isArray(actions) && actions.length ? (React.createElement("div", { className: cx('Table-toolbar') }, actions.map(function (action, key) {
+            return render("action/".concat(key), __assign({ type: 'button' }, action), {
+                onAction: _this.handleAction,
+                key: key,
+                btnDisabled: store.dragging,
+                data: store.getData(data)
+            });
+        }))) : null;
+    };
+    TableV2.prototype.handleSelected = function (selectedRows, selectedRowKeys, unSelectedRows) {
+        return __awaiter(this, void 0, void 0, function () {
+            var _a, dispatchEvent, data, rowSelection, onSelect, store, rendererEvent;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        _a = this.props, dispatchEvent = _a.dispatchEvent, data = _a.data, rowSelection = _a.rowSelection, onSelect = _a.onSelect, store = _a.store;
+                        return [4 /*yield*/, dispatchEvent('selectedChange', createObject(data, {
+                                selectedItems: selectedRows,
+                                unSelectedItems: unSelectedRows
+                            }))];
+                    case 1:
+                        rendererEvent = _b.sent();
+                        if (rendererEvent === null || rendererEvent === void 0 ? void 0 : rendererEvent.prevented) {
+                            return [2 /*return*/, rendererEvent === null || rendererEvent === void 0 ? void 0 : rendererEvent.prevented];
+                        }
+                        store.updateSelected(selectedRowKeys, rowSelection.keyField);
+                        onSelect && onSelect(selectedRows, unSelectedRows);
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    TableV2.prototype.handleSort = function (payload) {
+        return __awaiter(this, void 0, void 0, function () {
+            var _a, dispatchEvent, data, onSort, rendererEvent;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        _a = this.props, dispatchEvent = _a.dispatchEvent, data = _a.data, onSort = _a.onSort;
+                        return [4 /*yield*/, dispatchEvent('columnSort', createObject(data, {
+                                orderBy: payload.orderBy,
+                                orderDir: payload.order
+                            }))];
+                    case 1:
+                        rendererEvent = _b.sent();
+                        if (rendererEvent === null || rendererEvent === void 0 ? void 0 : rendererEvent.prevented) {
+                            return [2 /*return*/, rendererEvent === null || rendererEvent === void 0 ? void 0 : rendererEvent.prevented];
+                        }
+                        onSort && onSort(payload);
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    TableV2.prototype.handleFilter = function (payload) {
+        return __awaiter(this, void 0, void 0, function () {
+            var _a, dispatchEvent, data, onFilter, rendererEvent;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        _a = this.props, dispatchEvent = _a.dispatchEvent, data = _a.data, onFilter = _a.onFilter;
+                        return [4 /*yield*/, dispatchEvent('columnFilter', createObject(data, payload))];
+                    case 1:
+                        rendererEvent = _b.sent();
+                        if (rendererEvent === null || rendererEvent === void 0 ? void 0 : rendererEvent.prevented) {
+                            return [2 /*return*/, rendererEvent === null || rendererEvent === void 0 ? void 0 : rendererEvent.prevented];
+                        }
+                        onFilter && onFilter(payload);
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    TableV2.prototype.handleRowClick = function (event, rowItem, rowIndex) {
+        return __awaiter(this, void 0, void 0, function () {
+            var _a, dispatchEvent, data, onRow, rendererEvent;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        _a = this.props, dispatchEvent = _a.dispatchEvent, data = _a.data, onRow = _a.onRow;
+                        return [4 /*yield*/, dispatchEvent('rowClick', createObject(data, { rowItem: rowItem }))];
+                    case 1:
+                        rendererEvent = _b.sent();
+                        if (rendererEvent === null || rendererEvent === void 0 ? void 0 : rendererEvent.prevented) {
+                            return [2 /*return*/, rendererEvent === null || rendererEvent === void 0 ? void 0 : rendererEvent.prevented];
+                        }
+                        if (rowItem && onRow) {
+                            onRow.onRowClick && onRow.onRowClick(event, rowItem, rowIndex);
+                        }
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    TableV2.prototype.handleOrderChange = function (oldIndex, newIndex, levels) {
+        return __awaiter(this, void 0, void 0, function () {
+            var store, rowItem;
+            return __generator(this, function (_a) {
+                store = this.props.store;
+                rowItem = store.getRowByIndex(oldIndex, levels);
+                store.exchange(oldIndex, newIndex, rowItem);
+                return [2 /*return*/];
+            });
+        });
+    };
+    TableV2.prototype.handleSaveOrder = function () {
+        return __awaiter(this, void 0, void 0, function () {
+            var _a, store, onSaveOrder, data, dispatchEvent, movedItems, items, rendererEvent;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        _a = this.props, store = _a.store, onSaveOrder = _a.onSaveOrder, data = _a.data, dispatchEvent = _a.dispatchEvent;
+                        movedItems = store.movedRows.map(function (item) { return item.data; });
+                        items = store.rows.map(function (item) { return item.getDataWithModifiedChilden(); });
+                        return [4 /*yield*/, dispatchEvent('orderChange', createObject(data, { movedItems: movedItems }))];
+                    case 1:
+                        rendererEvent = _b.sent();
+                        if (rendererEvent === null || rendererEvent === void 0 ? void 0 : rendererEvent.prevented) {
+                            return [2 /*return*/];
+                        }
+                        if (!onSaveOrder || !store.movedRows.length) {
+                            return [2 /*return*/];
+                        }
+                        onSaveOrder(movedItems, items);
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    TableV2.prototype.reset = function () {
+        var store = this.props.store;
+        store.reset();
+    };
+    TableV2.prototype.doAction = function (action, args, throwErrors) {
+        var _a = this.props, store = _a.store, rowSelection = _a.rowSelection, data = _a.data;
+        var actionType = action === null || action === void 0 ? void 0 : action.actionType;
+        var keyField = rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.keyField;
+        switch (actionType) {
+            case 'selectAll':
+                store.updateSelectedAll(keyField);
+                break;
+            case 'clearAll':
+                store.updateSelected([], keyField);
+                break;
+            case 'select':
+                var dataSource = store.getData(data);
+                var selected_1 = [];
+                dataSource.items.forEach(function (item, rowIndex) {
+                    var flag = evalExpression(args === null || args === void 0 ? void 0 : args.selectedRowKeysExpr, {
+                        record: item,
+                        rowIndex: rowIndex
+                    });
+                    if (flag) {
+                        selected_1.push(item[keyField]);
+                    }
+                });
+                store.updateSelected(selected_1, keyField);
+                break;
+        }
+    };
+    TableV2.prototype.renderTable = function () {
+        var _this = this;
+        var _a = this.props, render = _a.render, title = _a.title, footer = _a.footer, rowSelection = _a.rowSelection; _a.columns; var expandable = _a.expandable; _a.expandableBody; var footSummary = _a.footSummary, headSummary = _a.headSummary, loading = _a.loading, cx = _a.classnames, placeholder = _a.placeholder, rowClassNameExpr = _a.rowClassNameExpr, itemActions = _a.itemActions, onRow = _a.onRow, store = _a.store, rest = __rest(_a, ["render", "title", "footer", "rowSelection", "columns", "expandable", "expandableBody", "footSummary", "headSummary", "loading", "classnames", "placeholder", "rowClassNameExpr", "itemActions", "onRow", "store"]);
+        var expandableConfig = null;
+        if (expandable) {
+            expandable.expandedRowKeys; var rest_1 = __rest(expandable, ["expandedRowKeys"]);
+            expandableConfig = __assign({ expandedRowKeys: store.currentExpandedKeys }, rest_1);
+            if (expandable.expandableOn) {
+                expandableConfig.rowExpandable = function (record, rowIndex) {
+                    return evalExpression(expandable.expandableOn, { record: record, rowIndex: rowIndex });
+                };
+                delete expandableConfig.expandableOn;
+            }
+            if (expandable && expandable.type) {
+                expandableConfig.expandedRowRender = function (record, rowIndex) {
+                    return _this.renderSchema('expandableBody', __assign({}, expandable), { data: record });
+                };
+            }
+            if (expandable.expandedRowClassNameExpr) {
+                expandableConfig.expandedRowClassName = function (record, rowIndex) { return filter(expandable.expandedRowClassNameExpr, { record: record, rowIndex: rowIndex }); };
+                delete expandableConfig.expandedRowClassNameExpr;
+            }
+        }
+        var rowSelectionConfig = null;
+        if (rowSelection) {
+            rowSelection.selectedRowKeys; var selections = rowSelection.selections, rest_2 = __rest(rowSelection, ["selectedRowKeys", "selections"]);
+            rowSelectionConfig = __assign({ selectedRowKeys: store.currentSelectedRowKeys }, rest_2);
+            if (rowSelection.disableOn) {
+                var disableOn_1 = rowSelection.disableOn;
+                rowSelectionConfig.getCheckboxProps = function (record, rowIndex) { return ({
+                    disabled: evalExpression(disableOn_1, { record: record, rowIndex: rowIndex })
+                }); };
+                delete rowSelectionConfig.disableOn;
+            }
+            if (selections && Array.isArray(selections)) {
+                rowSelectionConfig.selections = [];
+                selections.forEach(function (item) {
+                    rowSelectionConfig.selections.push({
+                        key: item.key,
+                        text: item.text,
+                        onSelect: function (changableRowKeys) {
+                            var newSelectedRowKeys = [];
+                            newSelectedRowKeys = changableRowKeys.filter(function (key, index) {
+                                if (item.key === 'all') {
+                                    return true;
+                                }
+                                if (item.key === 'none') {
+                                    return false;
+                                }
+                                if (item.key === 'invert') {
+                                    return !store.currentSelectedRowKeys.includes(key);
+                                }
+                                // 奇数行
+                                if (item.key === 'odd') {
+                                    if (index % 2 !== 0) {
+                                        return false;
+                                    }
+                                    return true;
+                                }
+                                // 偶数行
+                                if (item.key === 'even') {
+                                    if (index % 2 !== 0) {
+                                        return true;
+                                    }
+                                    return false;
+                                }
+                                return true;
+                            });
+                            store.updateSelected(newSelectedRowKeys, rowSelection.keyField);
+                        }
+                    });
+                });
+            }
+        }
+        var rowClassName = undefined;
+        // 设置了行样式
+        if (rowClassNameExpr) {
+            rowClassName = function (record, rowIndex) {
+                return filter(rowClassNameExpr, { record: record, rowIndex: rowIndex });
+            };
+        }
+        var itemActionsConfig = undefined;
+        if (itemActions) {
+            var finalActions_1 = Array.isArray(itemActions)
+                ? itemActions.filter(function (action) { return !action.hiddenOnHover; })
+                : [];
+            if (!finalActions_1.length) {
+                return null;
+            }
+            itemActionsConfig = function (record, rowIndex) {
+                return (React.createElement("div", { className: cx('Table-itemActions') }, finalActions_1.map(function (action, index) {
+                    return render("itemAction/".concat(index), __assign(__assign({}, action), { isMenuItem: true }), {
+                        key: index,
+                        item: record,
+                        data: record,
+                        rowIndex: rowIndex
+                    });
+                })));
+            };
+        }
+        return (React.createElement(Table, __assign({}, rest, { title: this.renderSchema('title', title, { data: this.props.data }), footer: this.renderSchema('footer', footer, { data: this.props.data }), columns: this.buildColumns(store.filteredColumns), dataSource: store.dataSource, rowSelection: rowSelectionConfig, rowClassName: rowClassName, expandable: expandableConfig, footSummary: this.buildSummary('footSummary', footSummary), headSummary: this.buildSummary('headSummary', headSummary), loading: this.renderSchema('loading', loading), placeholder: this.renderSchema('placeholder', placeholder), onSelect: this.handleSelected, onSelectAll: this.handleSelected, onSort: this.handleSort, onFilter: this.handleFilter, onDrag: this.handleOrderChange, itemActions: itemActionsConfig, onRow: __assign(__assign({}, onRow), { onRowClick: this.handleRowClick }) })));
+    };
+    TableV2.prototype.renderHeading = function () {
+        var _a = this.props, store = _a.store, cx = _a.classnames, headingClassName = _a.headingClassName, __ = _a.translate;
+        if (store.moved) {
+            return (React.createElement("div", { className: cx('Table-heading', headingClassName), key: "heading" }, store.moved ? (React.createElement("span", null,
+                __('Table.moved', {
+                    moved: store.moved
+                }),
+                React.createElement("button", { type: "button", className: cx('Button Button--xs Button--success m-l-sm'), onClick: this.handleSaveOrder },
+                    React.createElement(Icon, { icon: "check", className: "icon m-r-xs" }),
+                    __('Form.submit')),
+                React.createElement("button", { type: "button", className: cx('Button Button--xs Button--danger m-l-sm'), onClick: this.reset },
+                    React.createElement(Icon, { icon: "close", className: "icon m-r-xs" }),
+                    __('Table.discard')))) : null));
+        }
+        return null;
+    };
+    TableV2.prototype.render = function () {
+        var _a = this.props, cx = _a.classnames, _b = _a.loading, loading = _b === void 0 ? false : _b;
+        this.renderedToolbars = []; // 用来记录哪些 toolbar 已经渲染了
+        var heading = this.renderHeading();
+        return (React.createElement("div", { className: cx('Table-render-wrapper') },
+            this.renderActions('header'),
+            heading,
+            this.renderTable(),
+            React.createElement(Spinner, { overlay: true, show: loading })));
+    };
+    TableV2.contextType = ScopedContext;
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Object]),
+        __metadata("design:returntype", void 0)
+    ], TableV2.prototype, "controlRef", null);
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", []),
+        __metadata("design:returntype", void 0)
+    ], TableV2.prototype, "getPopOverContainer", null);
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Object, Object, Array,
+            Array, Object, Boolean]),
+        __metadata("design:returntype", void 0)
+    ], TableV2.prototype, "handleSave", null);
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Object, Object, Object, Boolean, Boolean]),
+        __metadata("design:returntype", void 0)
+    ], TableV2.prototype, "handleQuickChange", null);
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Object, Object, Object]),
+        __metadata("design:returntype", void 0)
+    ], TableV2.prototype, "handleAction", null);
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Array,
+            Array,
+            Array]),
+        __metadata("design:returntype", Promise)
+    ], TableV2.prototype, "handleSelected", null);
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Object]),
+        __metadata("design:returntype", Promise)
+    ], TableV2.prototype, "handleSort", null);
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Object]),
+        __metadata("design:returntype", Promise)
+    ], TableV2.prototype, "handleFilter", null);
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Object, Object, Number]),
+        __metadata("design:returntype", Promise)
+    ], TableV2.prototype, "handleRowClick", null);
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Number, Number, Array]),
+        __metadata("design:returntype", Promise)
+    ], TableV2.prototype, "handleOrderChange", null);
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", []),
+        __metadata("design:returntype", Promise)
+    ], TableV2.prototype, "handleSaveOrder", null);
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", []),
+        __metadata("design:returntype", void 0)
+    ], TableV2.prototype, "reset", null);
+    return TableV2;
+}(React.Component));
+/** @class */ ((function (_super) {
+    __extends(TableRenderer, _super);
+    function TableRenderer() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    TableRenderer.prototype.receive = function (values, subPath) {
+        var _this = this;
+        var _a, _b;
+        var scoped = this.context;
+        var parents = (_a = scoped === null || scoped === void 0 ? void 0 : scoped.parent) === null || _a === void 0 ? void 0 : _a.getComponents();
+        /**
+         * 因为Table在scope上注册，导致getComponentByName查询组件时会优先找到Table，和CRUD联动的动作都会失效
+         * 这里先做兼容处理，把动作交给上层的CRUD处理
+         */
+        if (Array.isArray(parents) && parents.length) {
+            // CRUD的name会透传给Table，这样可以保证找到CRUD
+            var crud = parents.find(function (cmpt) { var _a, _b; return ((_a = cmpt === null || cmpt === void 0 ? void 0 : cmpt.props) === null || _a === void 0 ? void 0 : _a.name) === ((_b = _this.props) === null || _b === void 0 ? void 0 : _b.name); });
+            return (_b = crud === null || crud === void 0 ? void 0 : crud.receive) === null || _b === void 0 ? void 0 : _b.call(crud, values, subPath);
+        }
+        if (subPath) {
+            return scoped.send(subPath, values);
+        }
+    };
+    TableRenderer = __decorate([
+        Renderer({
+            type: 'table-v2',
+            storeType: TableStoreV2.name,
+            name: 'table-v2',
+            isolateScope: true
+        })
+    ], TableRenderer);
+    return TableRenderer;
+})(TableV2));
+
+export { TableV2 as default };