fastlion-amis
Version:
一种MIS页面生成工具
3,447 lines • 218 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.TableCell = exports.TableRenderer = exports.EDITWIDTHKEY = void 0;
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importDefault(require("react"));
var react_dom_1 = require("react-dom");
var factory_1 = require("../../factory");
var types_1 = require("../../types");
var forEach_1 = tslib_1.__importDefault(require("lodash/forEach"));
var tpl_1 = require("../../utils/tpl");
// import './ColumnToggler';
var Checkbox_1 = tslib_1.__importDefault(require("../../components/Checkbox"));
var Button_1 = tslib_1.__importDefault(require("../../components/Button"));
var table_1 = require("../../store/table");
var file_saver_1 = require("file-saver");
var index_1 = require("../../utils/shell/index");
var helper_1 = require("../../utils/helper");
var tpl_builtin_1 = require("../../utils/tpl-builtin");
var debounce_1 = tslib_1.__importDefault(require("lodash/debounce"));
var sortablejs_1 = tslib_1.__importDefault(require("sortablejs"));
var resize_sensor_1 = require("../../utils/resize-sensor");
var find_1 = tslib_1.__importDefault(require("lodash/find"));
var icons_1 = require("../../components/icons");
var TableCell_1 = require("./TableCell");
Object.defineProperty(exports, "TableCell", { enumerable: true, get: function () { return TableCell_1.TableCell; } });
var HeadCellFilterDropdown_1 = require("./HeadCellFilterDropdown");
var HeadCellBatchEditDropdown_1 = require("./HeadCellBatchEditDropdown");
var TableContent_1 = require("./TableContent");
var image_1 = require("../../utils/image");
var mobx_state_tree_1 = require("mobx-state-tree");
var ColumnToggler_1 = tslib_1.__importStar(require("./ColumnToggler"));
var offset_1 = tslib_1.__importDefault(require("../../utils/offset"));
var dom_1 = require("../../utils/dom");
var cloneDeep_1 = tslib_1.__importDefault(require("lodash/cloneDeep"));
var LionContextMenu_1 = require("../Lion/components/LionContextMenu");
var isEqual_1 = tslib_1.__importDefault(require("lodash/isEqual"));
var antd_1 = require("antd");
var popover_1 = tslib_1.__importDefault(require("antd/lib/popover"));
var tools_1 = require("../../utils/shell/tools");
var Bubble_1 = tslib_1.__importDefault(require("../../components/ScrollMB/Bubble"));
var sub_1 = require("../../utils/sub");
var crud_1 = require("../../store/crud");
var types_2 = require("../../components/table/SecondFilter/types");
var utils_1 = require("../../utils/utils");
// import TipsContanier from '../../components/TipsContanier';
var icons_2 = require("@ant-design/icons");
var storage_1 = require("../../utils/storage");
var lodash_1 = require("lodash");
var api_1 = require("../../utils/api");
var DataStatic_1 = tslib_1.__importDefault(require("./DataStatic"));
var DataCross_1 = tslib_1.__importDefault(require("./DataCross"));
var utils_2 = require("../Lion/utils/utils");
var ProcessToolsModal_1 = tslib_1.__importDefault(require("./ProcessToolsModal"));
var FindAndReplace_1 = tslib_1.__importDefault(require("./FindAndReplace"));
var cross_1 = require("./cross");
var tableCtxMenuStore_1 = tslib_1.__importDefault(require("./tableCtxMenuStore"));
var mobx_react_1 = require("mobx-react");
var AiTool_1 = tslib_1.__importDefault(require("./AiTool"));
var SqlOptimize_1 = tslib_1.__importDefault(require("./SqlOptimize"));
var DataCharts_1 = tslib_1.__importDefault(require("./DataCharts"));
var commonTableFunction_1 = require("../../store/utils/commonTableFunction");
var mobx_1 = require("mobx");
var AbcAnalysis_1 = tslib_1.__importDefault(require("./AbcAnalysis"));
// 本地编辑map
exports.EDITWIDTHKEY = 'localEditWidthMap';
/**
* 将 url 转成绝对地址
*/
var getAbsoluteUrl = (function () {
var link;
return function (url) {
if (!link)
link = document.createElement('a');
link.href = url;
return link.href;
};
})();
var Table = /** @class */ (function (_super) {
tslib_1.__extends(Table, _super);
function Table(props) {
var _this = this;
var _a, _b, _c, _d, _e, _f;
_this = _super.call(this, props) || this;
_this.tableId = (0, utils_2.uuid)();
_this.lastScrollLeft = -1;
_this.lastScrollTop = -1;
_this.totalWidth = 0;
_this.totalHeight = 0;
_this.outterWidth = 0;
_this.outterHeight = 0;
_this.widths = {};
_this.widths2 = {};
_this.heights = {};
_this.renderedToolbars = [];
_this.toDispose = [];
_this.subForms = {};
_this.setIndexCol = function (show) {
_this.setState({ indexColShow: show });
};
_this.loadDeferredRow = function (row) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
var env, deferApi, response, e_1;
var _a, _b;
return tslib_1.__generator(this, function (_c) {
switch (_c.label) {
case 0:
env = this.props.env;
deferApi = row.data.deferApi || this.props.deferApi;
if (!(0, api_1.isEffectiveApi)(deferApi)) {
throw new Error('deferApi is required');
}
_c.label = 1;
case 1:
_c.trys.push([1, 3, 4, 5]);
row.markLoading(true);
return [4 /*yield*/, env.fetcher(deferApi, row.locals)];
case 2:
response = _c.sent();
if (!response.ok) {
throw new Error(response.msg);
}
row.updateData(tslib_1.__assign(tslib_1.__assign({}, row.data), { children: response.data.items }));
row.markLoaded(true);
row.setError('');
(_b = (_a = this.props).afterSearchFn) === null || _b === void 0 ? void 0 : _b.call(_a);
return [3 /*break*/, 5];
case 3:
e_1 = _c.sent();
row.setError(e_1.message);
env.notify('error', e_1.message);
return [3 /*break*/, 5];
case 4:
row.markLoading(false);
return [7 /*endfinally*/];
case 5: return [2 /*return*/];
}
});
}); };
_this.scrollPingBox = function (e) {
if (!_this.table)
return;
var ns = _this.props.classPrefix;
var table = (0, react_dom_1.findDOMNode)(_this);
// 如果没有不重新获取drag
var container = _this.scrollPingBoxContainer || table.querySelector(".".concat(ns, "Table-contentWrap"));
_this.scrollPingBoxContainer = container;
var scrollLeft = container.scrollLeft;
var scrollWidth = container.scrollWidth;
var clientWidth = container.clientWidth;
// 判断是否滚动到最左侧
if (scrollLeft === 0) {
container.classList.remove('table-ping-left');
}
else {
container.classList.add('table-ping-left');
}
// 判断是否滚动到最右侧
if (Math.abs(scrollLeft + clientWidth - scrollWidth) <= 1) {
container.classList.remove('table-ping-right');
}
else {
container.classList.add('table-ping-right');
}
};
_this.subFormRef = function (form, x, y) {
var quickEditFormRef = _this.props.quickEditFormRef;
quickEditFormRef && quickEditFormRef(form, x, y);
_this.subForms["".concat(x, "-").concat(y)] = form;
form && _this.props.store.addForm(form.props.store, y);
};
//统计数据记录, 141-交叉制表，142-统计，143-图表，145-abc分析
_this.staticRecords = function (port) {
var _a = _this.props, name = _a.name, env = _a.env;
env.fetcher({
url: "/api/v1/opt/".concat(name, "/record/").concat(port),
method: 'get'
});
};
_this.handleDragStart = function (e) {
var store = _this.props.store;
var target = e.currentTarget;
var tr = (_this.draggingTr = target.closest('tr'));
var id = tr.getAttribute('data-id');
var tbody = tr.parentNode;
_this.originIndex = Array.prototype.indexOf.call(tbody.childNodes, tr);
tr.classList.add('is-dragging');
e.dataTransfer.effectAllowed = 'move';
e.dataTransfer.setData('text/plain', id);
e.dataTransfer.setDragImage(tr, 0, 0);
var item = store.getRowById(id);
store.collapseAllAtDepth(item.depth);
var siblings = store.rows;
if (item.parentId) {
var parent = store.getRowById(item.parentId);
siblings = parent.children;
}
siblings = siblings.filter(function (sibling) { return sibling !== item; });
tbody.addEventListener('dragover', _this.handleDragOver);
tbody.addEventListener('drop', _this.handleDrop);
_this.draggingSibling = siblings.map(function (item) {
var tr = tbody.querySelector("tr[data-id=\"".concat(item.id, "\"]"));
tr.classList.add('is-drop-allowed');
return tr;
});
tr.addEventListener('dragend', _this.handleDragEnd);
};
_this.handleDragOver = function (e) {
if (!e.target) {
return;
}
e.preventDefault();
e.dataTransfer.dropEffect = 'move';
var overTr = e.target.closest('tr');
if (!overTr ||
!~overTr.className.indexOf('is-drop-allowed') ||
overTr === _this.draggingTr) {
return;
}
var tbody = overTr.parentElement;
var dRect = _this.draggingTr.getBoundingClientRect();
var tRect = overTr.getBoundingClientRect();
var ratio = dRect.top < tRect.top ? 0.1 : 0.9;
var next = (e.clientY - tRect.top) / (tRect.bottom - tRect.top) > ratio;
tbody.insertBefore(_this.draggingTr, (next && overTr.nextSibling) || overTr);
};
_this.handleDrop = function () {
var store = _this.props.store;
var tr = _this.draggingTr;
var tbody = tr.parentElement;
var index = Array.prototype.indexOf.call(tbody.childNodes, tr);
var item = store.getRowById(tr.getAttribute('data-id'));
// destroy
_this.handleDragEnd();
store.exchange(_this.originIndex, index, item);
};
_this.handleDragEnd = function () {
var tr = _this.draggingTr;
var tbody = tr.parentElement;
var index = Array.prototype.indexOf.call(tbody.childNodes, tr);
tbody.insertBefore(tr, tbody.childNodes[index < _this.originIndex ? _this.originIndex + 1 : _this.originIndex]);
tr.classList.remove('is-dragging');
tr.removeEventListener('dragend', _this.handleDragEnd);
tbody.removeEventListener('dragover', _this.handleDragOver);
tbody.removeEventListener('drop', _this.handleDrop);
_this.draggingSibling.forEach(function (item) {
return item.classList.remove('is-drop-allowed');
});
};
_this.handleImageEnlarge = function (info, target) {
var onImageEnlarge = _this.props.onImageEnlarge;
// 如果已经是多张了，直接跳过
if (Array.isArray(info.list)) {
return onImageEnlarge && onImageEnlarge(info, target);
}
// 从列表中收集所有图片，然后作为一个图片集合派送出去。
var store = _this.props.store;
var column = store.columns[target.colIndex].pristine;
var index = target.rowIndex;
var list = [];
store.rows.forEach(function (row, i) {
var src = (0, tpl_builtin_1.resolveVariable)(column.name, row.data);
if (!src) {
if (i < target.rowIndex) {
index--;
}
return;
}
list.push({
src: src,
originalSrc: column.originalSrc
? (0, tpl_1.filter)(column.originalSrc, row.data)
: src,
title: column.enlargeTitle
? (0, tpl_1.filter)(column.enlargeTitle, row.data)
: column.title
? (0, tpl_1.filter)(column.title, row.data)
: undefined,
caption: column.enlargeCaption
? (0, tpl_1.filter)(column.enlargeCaption, row.data)
: column.caption
? (0, tpl_1.filter)(column.caption, row.data)
: undefined
});
});
if (list.length > 1) {
onImageEnlarge &&
onImageEnlarge(tslib_1.__assign(tslib_1.__assign({}, info), { list: list, index: index }), target);
}
else {
onImageEnlarge && onImageEnlarge(info, target);
}
};
// 开始设置拖拽线
_this.setDragLine = function (targetTh) {
var dragLine = _this.dragLineShadowRef.current;
dragLine.style.height = _this.table.querySelector('tbody').clientHeight + 'px';
dragLine.style.top = (targetTh || _this.targetTh).clientHeight + 1 + 'px';
dragLine.style.display = 'unset';
};
// 开始设置拖拽线
_this.hideDragLine = function () {
var dragLine = _this.dragLineShadowRef.current;
dragLine.style.display = 'none';
};
// 开始列宽度调整
_this.handleColResizeMouseDown = function (e, col) {
_this.onDraging = true;
_this.lineStartX = e.clientX;
var currentTarget = e.currentTarget;
_this.resizeColumn = col;
_this.resizeLine = currentTarget;
// this.resizeLineLeft = parseInt(
// getComputedStyle(this.resizeLine).getPropertyValue('left'),
// 10
// );
_this.targetTh = _this.resizeLine.parentElement;
_this.targetThWidth = _this.targetTh.getBoundingClientRect().width;
_this.setDragLine();
document.addEventListener('mousemove', _this.handleColResizeMouseMove);
document.addEventListener('mouseup', _this.handleColResizeMouseUp);
};
// 垂直线拖拽移动
_this.handleColResizeMouseMove = function (e) {
var _a, _b;
var targetThRect = _this.targetTh.getBoundingClientRect();
var moveX = e.clientX - _this.lineStartX;
_this.dragLineShadowRef.current.style.left = targetThRect.left - ((_b = (_a = _this.table) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect) === null || _b === void 0 ? void 0 : _b.call(_a).left) + _this.targetThWidth + moveX + 'px';
_this.targetTh.style.width = _this.targetThWidth + moveX + 'px';
};
// 垂直线拖拽结束
_this.handleColResizeMouseUp = function (e) {
requestAnimationFrame(function () {
_this.onDraging = false;
_this.hideDragLine();
});
if ((0, helper_1.isMobile)())
return;
var store = _this.props.store;
var editWidthMap = (0, storage_1.getLocalStorage)(exports.EDITWIDTHKEY) || {};
var newCols = store.columnsData.map(function (item) {
var _a;
if (item.name === _this.resizeColumn.name) {
editWidthMap[_this.props.crudName || ''] = tslib_1.__assign(tslib_1.__assign({}, editWidthMap[_this.props.crudName || '']), (_a = {}, _a[_this.resizeColumn.name || ''] = _this.targetTh.style.width, _a));
(0, storage_1.setLocalStorage)(exports.EDITWIDTHKEY, editWidthMap);
return tslib_1.__assign(tslib_1.__assign({}, item), { pristine: tslib_1.__assign(tslib_1.__assign({}, item.pristine), { editWidth: _this.targetTh.style.width }) });
}
return item;
});
_this.handleColumnToggle(newCols, {}, false);
document.removeEventListener('mousemove', _this.handleColResizeMouseMove);
document.removeEventListener('mouseup', _this.handleColResizeMouseUp);
};
//获取设置列模板
_this.getColumnSettingList = function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
var _a, saveColApi, env, api, data, list;
return tslib_1.__generator(this, function (_b) {
switch (_b.label) {
case 0:
_a = this.props, saveColApi = _a.saveColApi, env = _a.env;
if (!saveColApi) return [3 /*break*/, 2];
api = (0, api_1.normalizeApi)((saveColApi === null || saveColApi === void 0 ? void 0 : saveColApi.url) || '', 'get');
return [4 /*yield*/, env.fetcher(api)];
case 1:
data = (_b.sent()).data;
list = (data === null || data === void 0 ? void 0 : data.filter(function (item) { return item.tempKey; })) || [];
this.setState({ columnSettingTemps: list });
_b.label = 2;
case 2: return [2 /*return*/];
}
});
}); };
//设置列保存到远程
_this.sendColumns = function (saveCols, targetTemp, isDraggled) {
if (isDraggled === void 0) { isDraggled = false; }
var saveColApi = _this.props.saveColApi;
_this.props.env
.fetcher({ url: saveColApi.url, method: saveColApi.method }, tslib_1.__assign(tslib_1.__assign({}, targetTemp), { columnInfo: saveCols }))
.then(function (res) {
if (res.ok) {
!isDraggled && antd_1.message.success(res.msg);
_this.getColumnSettingList();
}
else {
!isDraggled && antd_1.message.error(res.msg);
}
});
};
//拖拽设置列时防抖
_this.debounceSendColumns = (0, debounce_1.default)(_this.sendColumns.bind(_this), 1000 * 60);
// onDraging: boolean // 拖动中标识
_this.dragShadowRef = react_1.default.createRef();
_this.dragLineShadowRef = react_1.default.createRef();
_this.onHeaderDragStart = function (e) {
if (!_this.dragShadowRef.current)
return;
var store = _this.props.store;
var target = e.currentTarget;
var th = (_this.draggingTh = target.closest('th'));
var name = th.getAttribute('column-name');
var tr = th.parentNode;
_this.dragShadowRef.current.style.width = th.clientWidth + 'px';
_this.dragShadowRef.current.style.height = _this.table.querySelector('tbody').clientHeight + 'px';
_this.dragShadowRef.current.style.top = th.clientHeight + 'px';
var offsetx = e.clientX - (e.clientX - (_this.table.getBoundingClientRect().left)) - _this.table.getBoundingClientRect().left;
_this.draggingThStartX = e.clientX;
_this.draggingThOffsetX = offsetx;
_this.draggingThStartLeft = (th.getBoundingClientRect().left - (_this.table.getBoundingClientRect().left)) - offsetx;
_this.dragShadowRef.current.style.left = _this.draggingThStartLeft + 'px';
_this.originColumnName = name;
e.dataTransfer.effectAllowed = 'move';
e.dataTransfer.setData('text/plain', name);
e.dataTransfer.setDragImage(document.createElement('div'), 0, 0);
var siblings = (0, cloneDeep_1.default)(store.filteredColumns);
tr.addEventListener('dragover', _this.onHeaderDragOver);
tr.addEventListener('drop', _this.onHeaderDrop);
tr.addEventListener('dragend', _this.onHeaderDragEnd);
// (tr as HTMLDivElement).classList.add('is-headerdrop-allowed');
_this.draggingSiblingTh = siblings.map(function (item) {
if (item.name) {
var th_1 = tr.querySelector("th[column-name=\"".concat(item.name, "\"]"));
// th.classList.add('is-headerdrop-allowed');
return th_1;
}
else {
var th_2 = tr.querySelector("th[data-index=\"".concat(item.index, "\"]"));
// th.classList.add('is-headerdrop-not-allowed')
return th_2;
}
});
};
_this.onHeaderDragOver = function (e) {
var _a, _b, _c, _d, _e, _f, _g;
e.preventDefault();
if (_this.dragShadowRef.current) {
var tableBound_1 = (_b = (_a = _this.table) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect) === null || _b === void 0 ? void 0 : _b.call(_a);
var thArray = Array.from(((_c = _this.table) === null || _c === void 0 ? void 0 : _c.querySelectorAll('table>thead>tr>th')) || []);
_this.dragShadowRef.current.style.left = _this.draggingThStartLeft + (e.clientX - _this.draggingThStartX) + 'px';
var targetThIndex = _this.leftDistances.findIndex(function (_) { return _ > e.clientX - tableBound_1.left; }) - 1;
var startThIndex = _this.leftDistances.findIndex(function (_) { return _ > _this.draggingThStartX - tableBound_1.left; }) - 1;
var targetTh = thArray[targetThIndex];
// console.log(startThIndex, targetThIndex)
if (_this.dragLineShadowRef.current) {
var dragLine = _this.dragLineShadowRef.current;
_this.setDragLine(targetTh);
var targetThBound = targetTh.getBoundingClientRect();
// 如果是刚开始的列不展示拖拽线
if (targetThIndex !== startThIndex) {
if (targetThBound.x > _this.draggingThStartX)
dragLine.style.left = targetThBound.x - ((_e = (_d = _this.table) === null || _d === void 0 ? void 0 : _d.getBoundingClientRect) === null || _e === void 0 ? void 0 : _e.call(_d).left) + targetThBound.width - 1 + 'px';
else
dragLine.style.left = targetThBound.x - ((_g = (_f = _this.table) === null || _f === void 0 ? void 0 : _f.getBoundingClientRect) === null || _g === void 0 ? void 0 : _g.call(_f).left) + 1 + 'px';
}
else {
_this.hideDragLine();
}
}
}
else {
if (_this.dragShadowRef.current) {
var dragLine = _this.dragLineShadowRef.current;
_this.hideDragLine();
}
}
};
_this.onHeaderDrop = function (e) {
var _a;
var thArray = Array.from(((_a = _this.table) === null || _a === void 0 ? void 0 : _a.querySelectorAll('table>thead>tr>th')) || []);
var targetTh = thArray[_this.leftDistances.findIndex(function (_) { var _a, _b; return _ > e.clientX - ((_b = (_a = _this.table) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect) === null || _b === void 0 ? void 0 : _b.call(_a).left); }) - 1];
if (_this.dragLineShadowRef.current)
_this.dragLineShadowRef.current.style.display = 'none';
var name = targetTh === null || targetTh === void 0 ? void 0 : targetTh.getAttribute('column-name');
// console.log(targetTh, this.leftDistances.findIndex(_ => _ > e.clientX - (this.table as HTMLElement)?.getBoundingClientRect?.().left) - 1)
if (_this.originColumnName && name) {
_this.swapColumnPosition(_this.originColumnName, name);
}
_this.onHeaderDragEnd();
};
_this.onHeaderDragEnd = function () {
if (!_this.dragShadowRef.current)
return;
_this.dragShadowRef.current.style.width = '0px';
_this.dragShadowRef.current.style.height = '0px';
_this.dragShadowRef.current.style.top = '0px';
_this.dragShadowRef.current.style.left = '0px';
requestAnimationFrame(function () {
_this.caculateLeft(true);
});
// this.draggingTh.classList.remove('is-header-dragging');
// this.draggingSiblingTh.forEach(item =>
// item.classList.remove('is-drop-allowed')
// );
var tr = _this.draggingTh.parentNode;
if (tr) {
tr.removeEventListener('dragover', _this.onHeaderDragOver);
tr.removeEventListener('drop', _this.onHeaderDrop);
tr.removeEventListener('dragend', _this.onHeaderDragEnd);
}
};
/** 渲染sql优化dom */
_this.renderSqlOptimize = function (action) {
var _a, _b, _c;
var _d = _this.props, store = _d.store, columns = _d.columns, data = _d.data, env = _d.env;
var columnsArr = (_a = columns === null || columns === void 0 ? void 0 : columns.map(function (item) { return item.name; })) !== null && _a !== void 0 ? _a : [];
var selectedList = (_c = (_b = store.selectedRows) === null || _b === void 0 ? void 0 : _b.map(function (item) { return item.data; }).filter(Boolean)) !== null && _c !== void 0 ? _c : [];
return (react_1.default.createElement(SqlOptimize_1.default, { env: env, selectedList: selectedList, action: action, columns: columnsArr, sqlStr: data === null || data === void 0 ? void 0 : data.sql, store: store }));
};
_this.renderDataCharts = function (action) {
var _a, _b, _c, _d;
var _e = _this.props, store = _e.store, selected = _e.selected, aliasTitle = _e.aliasTitle, tabTitle = _e.tabTitle, name = _e.name, primaryField = _e.primaryField, loadDataOnce = _e.loadDataOnce, getAllData = _e.getAllData, env = _e.env;
var selectedItems = (_b = (_a = selected === null || selected === void 0 ? void 0 : selected.concat()) !== null && _a !== void 0 ? _a : store.selectedRows.map(function (item) { return item.data; })) !== null && _b !== void 0 ? _b : [];
var items = store.rows.map(function (item) { return item.data; });
var colList = store.columnsData.filter(function (col) { return !col.pristine.hidden && col.type !== 'operation'; })
.map(function (item) { return item.toJSON ? item.toJSON() : item; });
var itemRaws = (_c = store.data) === null || _c === void 0 ? void 0 : _c.itemsRaw;
return react_1.default.createElement(DataCharts_1.default, { crudTitle: aliasTitle || tabTitle || '', container: (_d = env.getTopModalContainer) !== null && _d !== void 0 ? _d : _this.tableContainer.current, data: { items: items, selectedItems: selectedItems, itemRaws: itemRaws }, columns: colList, action: action, name: name, handleDealData: _this.handleDealData, primaryField: primaryField, loadDataOnce: loadDataOnce, getAllData: getAllData, staticRecords: _this.staticRecords });
};
_this.renderFieldTranslate = function (action) {
var fieldTranslate = _this.state.fieldTranslate;
return react_1.default.createElement("div", { className: 'show-field-translate-container' },
react_1.default.createElement(antd_1.Checkbox, { checked: fieldTranslate, onChange: function (e) { return _this.setState({ fieldTranslate: e.target.checked }); } }, action.label || '显示字段翻译'));
};
_this.updateActiveCell = function (row, col) {
_this.setState({ activeRow: row, activeCol: col });
};
//替换
_this.onBulkReplace = function (rowDataList) {
var store = _this.props.store;
var rows = store.rows.filter(function (item) {
return (0, find_1.default)(rowDataList, function (rowItem) { return rowItem.rowData[crud_1.DATAKEYID] == item.data[crud_1.DATAKEYID]; });
});
store.bulkQuickChange(rows, rowDataList);
var modefiedMap = (0, cloneDeep_1.default)(store.modefiedMap);
rowDataList.forEach(function (item) {
var rowItem = store.rows[item.index];
var values = item.rowData;
// rowItem.change(values);
modefiedMap.modifiedDataSet[rowItem.data[crud_1.DATAKEYID]] = values;
});
store.bulkRecordEditValues(modefiedMap);
};
_this.renderFindReplace = function (action) {
var _a;
var _b = _this.props, store = _b.store, currentSelectedRow = _b.currentSelectedRow, translate = _b.translate, crudRef = _b.crudRef;
var selectedList = (_a = store.selectedRows.map(function (item) { return item.index; })) !== null && _a !== void 0 ? _a : [];
var items = store.rows.map(function (item) { return item.data; });
var colList = store.columnsData.filter(function (col) { return !col.pristine.hidden && col.type !== 'operation'; })
.map(function (item) { return item.toJSON ? item.toJSON() : item; }).filter(function (item) { return !item.type || ['plain', 'input-text', 'number', 'input-number', 'static-number', 'html', 'static-html', 'input-rich-text', 'date', 'input-date', 'datetime', 'input-datetime', 'time', 'input-time', 'input-date-range', 'input-time-range', 'input-datetime-range', 'input-month', 'input-quarter', 'input-year', 'textarea'].includes(item.type); });
var canReplace = colList.some(function (item) { var _a; return !!((_a = item.pristine) === null || _a === void 0 ? void 0 : _a.quickEdit); });
// const itemRaws = store.data?.itemsRaw
return react_1.default.createElement(FindAndReplace_1.default, { selectedList: selectedList, data: items, columns: colList, action: action, onBulkReplace: _this.onBulkReplace, canReplace: canReplace, currentCheckIndex: currentSelectedRow, updateActiveCell: _this.updateActiveCell, container: _this.tableContainer.current, translate: translate, crudRef: crudRef });
};
_this.renderDataStatic = function (action) {
var _a, _b, _c, _d;
var _e = _this.props, store = _e.store, selected = _e.selected, loadDataOnce = _e.loadDataOnce, getAllData = _e.getAllData, aliasTitle = _e.aliasTitle, tabTitle = _e.tabTitle, name = _e.name, isStatic = _e.isStatic;
var selectedItems = (_b = (_a = selected === null || selected === void 0 ? void 0 : selected.concat()) !== null && _a !== void 0 ? _a : store.selectedRows.map(function (item) { return item.data; })) !== null && _b !== void 0 ? _b : [];
var items = store.rows.map(function (item) { return item.data; });
var colList = store.columnsData.filter(function (col) { return !col.pristine.hidden && col.type !== 'operation'; })
.map(function (item) { return item.toJSON ? item.toJSON() : item; });
var itemRaws = (_c = store.data) === null || _c === void 0 ? void 0 : _c.itemsRaw;
return react_1.default.createElement(DataStatic_1.default, { originHeaderToolbar: _this.props.headerToolbar, crudTitle: aliasTitle || tabTitle || '', container: ((_d = _this.props.env) === null || _d === void 0 ? void 0 : _d.getTopModalContainer) || _this.tableContainer.current, staticRecords: _this.staticRecords, getAllData: getAllData, data: { items: items, selectedItems: selectedItems, itemRaws: itemRaws }, loadDataOnce: loadDataOnce, columns: colList, action: action, name: name, isStatic: isStatic, handleDealData: _this.handleDealData });
};
_this.renderDataABC = function (action) {
var _a, _b, _c, _d;
var _e = _this.props, store = _e.store, selected = _e.selected, loadDataOnce = _e.loadDataOnce, getAllData = _e.getAllData, aliasTitle = _e.aliasTitle, tabTitle = _e.tabTitle, name = _e.name, isStatic = _e.isStatic;
var selectedItems = (_b = (_a = selected === null || selected === void 0 ? void 0 : selected.concat()) !== null && _a !== void 0 ? _a : store.selectedRows.map(function (item) { return item.data; })) !== null && _b !== void 0 ? _b : [];
var items = store.rows.map(function (item) { return item.data; });
var colList = store.columnsData.filter(function (col) { return !col.pristine.hidden && col.type !== 'operation'; })
.map(function (item) { return item.toJSON ? item.toJSON() : item; });
var itemRaws = (_c = store.data) === null || _c === void 0 ? void 0 : _c.itemsRaw;
return react_1.default.createElement(AbcAnalysis_1.default, { originHeaderToolbar: _this.props.headerToolbar, crudTitle: aliasTitle || tabTitle || '', container: ((_d = _this.props.env) === null || _d === void 0 ? void 0 : _d.getTopModalContainer) || _this.tableContainer.current, staticRecords: _this.staticRecords, getAllData: getAllData, data: { items: items, selectedItems: selectedItems, itemRaws: itemRaws }, loadDataOnce: loadDataOnce, columns: colList, action: action, name: name, isStatic: isStatic, handleDealData: _this.handleDealData });
};
_this.renderDataCross = function (action) {
var _a;
if ((0, helper_1.isMobile)())
return null;
return (react_1.default.createElement(DataCross_1.default, { tableName: _this.props.name, action: action, columns: _this.props.store.filteredColumns, data: { items: _this.props.store.rows.map(function (row) { return row.data; }), selectedItems: _this.props.store.selectedRows.map(function (row) { return row.data; }) }, modalContainer: ((_a = _this.props.env) === null || _a === void 0 ? void 0 : _a.getTopModalContainer) || _this.tableContainer.current, getAllData: _this.props.getAllData, staticRecords: _this.staticRecords, onOK: function (cross, crossColumns, datas, countColumns, extraProps) {
var _a, _b;
var linkTitle = "".concat((_b = (_a = _this.props.aliasTitle) === null || _a === void 0 ? void 0 : _a.trim) === null || _b === void 0 ? void 0 : _b.call(_a), "-\u4EA4\u53C9\u5236\u8868");
var schema = {
aliasTitle: linkTitle,
type: "crud",
mode: 'cross',
name: "".concat(_this.props.name || (0, utils_2.uuid)(), "_cross"),
cross: cross,
crossColumns: crossColumns,
isCross: true,
combineNum: cross.positionType == 1 ? cross.rowFields.length : undefined,
"affixHeader": true,
"columns": _this.props.columns,
"defaultData": datas,
'affixRow': countColumns,
"perPage": 10000,
"autoFillHeight": true,
"multiple": true,
"setBorder": true,
"keepItemSelectionOnPageChange": false,
"syncLocation": false,
"headerToolbar": [{
"redDot": false,
"actionType": "export",
"type": "action",
"name": "default_export",
"label": "导出",
"icon": "#icon-tooltool_download",
"tooltip": "默认导出",
"align": "right",
"close": true,
"tooltipPlacement": "top"
},
{
"type": "data-statics",
"label": "统计",
"icon": "#icon-tooltotal",
"align": "right"
},
{
"type": "data-cross",
"label": "交叉制表",
"icon": "#icon-toolcross",
"align": "right"
}],
"footerToolbar": [{
"type": "statistics",
"align": "right"
}],
"checkOnItemClick": false,
"header": [],
"footer": []
};
_this.handleDealData('data-cross', linkTitle, schema, extraProps);
} }));
};
_this.destroyDragTable = function () {
_this.dragTable && _this.dragTable.destroy();
};
//列拖拽
_this.initDragTable = function () {
var ns = _this.props.classPrefix;
var el = (0, react_dom_1.findDOMNode)(_this).querySelector(".table-head-drag");
if (el) {
_this.dragTable = new sortablejs_1.default(el, {
group: ".".concat(ns, "Table-table"),
animation: 150,
removeCloneOnHide: true,
// 提供class可拖动
handle: ".header-cell",
ghostClass: 'tableCell-dragglable-dragging',
dragClass: 'tableCell-dragglable-dragging',
filter: function (e, target) {
return target.className.includes('__') || target.className.includes('operation');
},
scroll: false,
fallbackOnBody: false,
removeOnSpill: true,
draggable: ".".concat(ns, "TableCell-dragglable"),
onEnd: function (e) {
if (e.newIndex === e.oldIndex || _this.onDraging) {
return;
}
_this.swapColumnPosition(e.oldIndex, e.newIndex);
},
});
}
};
_this.swapColumnPosition = function (oldName, targetName) {
var _a;
var store = _this.props.store;
var finalColumns = (0, cloneDeep_1.default)(store.columnsData);
var newColumns = (0, cloneDeep_1.default)(store.filteredColumns);
var oldColumn = newColumns.find(function (item) { return item.name === oldName; });
var newColumn = newColumns.find(function (item) { return item.name === targetName; });
if (oldColumn && newColumn) {
var originOldIndex = finalColumns.findIndex(function (item) { return item.name === oldColumn.name; });
var originNewIndex = finalColumns.findIndex(function (item) { return item.name === newColumn.name; });
finalColumns.splice(originNewIndex > originOldIndex ? originNewIndex + 1 : originNewIndex, 0, oldColumn);
originOldIndex > originNewIndex
? finalColumns.splice(originOldIndex + 1, 1)
: finalColumns.splice(originOldIndex, 1);
var saveColInfo = (0, ColumnToggler_1.productColumnInfo)(finalColumns);
var targetTemp = ((_a = _this.state.columnSettingTemps) === null || _a === void 0 ? void 0 : _a.length) > 0 ? tslib_1.__assign(tslib_1.__assign({}, _this.state.columnSettingTemps[0]), { columnInfo: saveColInfo }) : undefined;
_this.handleColumnToggle(finalColumns, saveColInfo, true, targetTemp, true);
}
};
_this.renderDetailModelToggler = function (config) {
// const switchModelRender = {
// label: __(this.state.tableMode === 'vertical' ? 'Table.switchToHorizontal' : 'Table.switchToVertical'),
// type: 'detail-model', icon: this.state.tableMode === 'vertical' ? <FileSyncOutlined /> : <ProjectOutlined />
// }
var __ = _this.props.translate;
var label = __(_this.state.tableMode === 'vertical' ? 'Table.switchToHorizontal' : 'Table.switchToVertical');
var icon = _this.state.tableMode === 'vertical' ? react_1.default.createElement(icons_2.FileSyncOutlined, null) : react_1.default.createElement(icons_2.ProjectOutlined, null);
return (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement("div", { className: 'toolbar-item', onClick: function () { return _this.handleToolsClick(config.type); } },
react_1.default.createElement("div", { className: 'toolbar-item-icon' }, icon),
react_1.default.createElement("div", { className: 'toolbar-item-name' }, label))));
};
_this.handleToolsClick = function (type) {
var _a;
var _b = _this.props, store = _b.store, handleResetData = _b.handleResetData;
switch (type) {
case 'columns-toggler':
_this.setState({ columnsTogglerShow: true });
(_a = _this.debounceSendColumns) === null || _a === void 0 ? void 0 : _a.cancel();
break;
case 'detail-model':
case 'switch-layout':
_this.setState({ tableMode: _this.state.tableMode == 'vertical' ? 'horizontal' : 'vertical' }, function () {
store.update({
footable: _this.state.tableMode === 'vertical' ? true : false
});
});
break;
default:
break;
}
};
/** 移动端 - 渲染工具 */
_this.renderTools = function () {
var _a = _this.props, headerToolbar = _a.headerToolbar, __ = _a.translate, cx = _a.classnames, env = _a.env, store = _a.store, data = _a.data, filterRender = _a.filterRender, isPick = _a.isPick, clearSelectedItems = _a.clearSelectedItems, crudRenderToolbarFunc = _a.crudRenderToolbarFunc, multiple = _a.multiple;
/** 折叠在工具里的tools */
var foldedHeaderTools = [];
/** 在筛选/多选右侧的tools */
var unfoldedHeaderTools = [];
/** 将移动端需要显示的功能过滤出来： 目前工具栏仅保留 ai工具，设置，详情模式 */
// const switchModelRender = {
// label: __(this.state.tableMode === 'vertical' ? 'Table.switchToHorizontal' : 'Table.switchToVertical'),
// type: 'detail-model', icon: this.state.tableMode === 'vertical' ? <FileSyncOutlined /> : <ProjectOutlined />
// }
headerToolbar.forEach(function (item) {
var type = item.type, isToolBar = item.isToolBar, foldable = item.foldable;
/** 是否是移动端的工具 */
if (isToolBar) {
/** foldable: 是否归到折叠菜单中 */
/** 配置非折叠的工具 */
if (!foldable) {
unfoldedHeaderTools.push(item);
}
else {
foldedHeaderTools.push(item);
}
}
});
// const tools = headerToolbar.filter((item: any) => (['columns-toggler'].includes(item.type) && store.columnsTogglable) || ['help', 'ai-tool', 'reload'].includes(item.type));
/** 再添加一个 列表模式切换 */
// foldedHeaderTools.push({
// label: __(this.state.tableMode === 'vertical' ? 'Table.switchToHorizontal' : 'Table.switchToVertical'),
// type: 'switch-layout', icon: this.state.tableMode === 'vertical' ? <FileSyncOutlined /> : <ProjectOutlined />
// });
/** 筛选 */
var isFilter = !!Object.keys(data.filterParam || {}).length;
var filterNode = filterRender && filterRender(isFilter);
return (react_1.default.createElement(react_1.default.Fragment, null,
(foldedHeaderTools === null || foldedHeaderTools === void 0 ? void 0 : foldedHeaderTools.length) ? (react_1.default.createElement("div", { className: "header-btns" },
react_1.default.createElement(popover_1.default, { showArrow: false, placement: "bottom", getPopupContainer: env.getModalContainer, trigger: "click", overlayClassName: "table-toolbar-pop", autoAdjustOverflow: true, visible: _this.state.toolbarShow, onOpenChange: function (open) { return _this.setState({ toolbarShow: open }); }, content: react_1.default.createElement("div", { className: 'toolbar-container', onClick: function () { return _this.setState({ toolbarShow: false }); } }, foldedHeaderTools.map(function (item, index) {
var _a;
return (_a = _this.renderToolbar(item)) !== null && _a !== void 0 ? _a : crudRenderToolbarFunc(item);
})) },
react_1.default.createElement("div", { className: cx('Mobile-batch-manage'), onClick: function () { return _this.setState({ toolbarShow: true }); } },
react_1.default.createElement(icons_1.Icon, { icon: '#icon-toolbox', className: "icon" }),
react_1.default.createElement("span", { className: 'batch-text' }, __('Table.tools')))))) : null,
filterNode,
unfoldedHeaderTools.map(function (item) {
var _a;
return (react_1.default.createElement("div", { className: cx('Mobile-batch-manage') }, (_a = _this.renderToolbar(item)) !== null && _a !== void 0 ? _a : crudRenderToolbarFunc(item)));
})));
};
_this.renderPagenation = function () {
var _a, _b, _c, _d, _e, _f, _g;
var _h = _this.props, store = _h.store, selected = _h.selected, cx = _h.classnames, multiple = _h.multiple, popOverContainer = _h.popOverContainer, footerToolbarRender = _h.footerToolbarRender, footerToolbar = _h.footerToolbar;
var column = store.filteredColumns[0] && store.filteredColumns[0].type == "__checkme";
var selectedItems = (_b = (_a = selected === null || selected === void 0 ? void 0 : selected.concat()) !== null && _a !== void 0 ? _a : store.selectedRows.map(function (item) { return item.data; })) !== null && _b !== void 0 ? _b : [];
var _footer = footerToolbar || [];
// 居右的这里展示
var leftChild = footerToolbarRender ? footerToolbarRender(tslib_1.__assign(tslib_1.__assign({}, _this.props), { selectedItems: store.selectedRows.map(function (item) { return item.data; }), items: store.rows.map(function (item) { return item.data; }) }), _this.renderToolbar, (0, helper_1.isMobile)() ? _footer : _footer.filter(function (item) { return item.align !== 'right'; }) //Aug
) : null;
// 居左的在这边
var rightChild = footerToolbarRender ? footerToolbarRender(tslib_1.__assign(tslib_1.__assign({}, _this.props), { selectedItems: store.selectedRows.map(function (item) { return item.data; }), items: store.rows.map(function (item) { return item.data; }) }), _this.renderToolbar, _footer.filter(function (item) { return item.align == 'right'; }) //Aug
) : null;
var checkAllWidth = (((_e = (_d = (_c = _this.table) === null || _c === void 0 ? void 0 : _c.querySelector('thead')) === null || _d === void 0 ? void 0 : _d.querySelector('th')) === null || _e === void 0 ? void 0 : _e.clientWidth) || 25) + 'px';
// 2025-03 新增判断子选项是否为空，为空就不渲染父div
return (column && multiple && _this.state.selectedIndex != undefined || leftChild || rightChild) ? (react_1.default.createElement("div", { className: cx('Table-affix') },
column && multiple && _this.state.selectedIndex != undefined && (react_1.default.createElement("span", { className: cx('Table-affixs'), style: { marginRight: 0, alignItems: 'center' } },
column && multiple && react_1.default.createElement("span", { className: cx('Table-affix-Arr') }, _this.renderHeadCell(store.filteredColumns[0], { style: { width: checkAllWidth, paddingBottom: '2px', minWidth: '25px' } })),
react_1.default.createElement("div", { className: cx('Table-affix-text') },
((_f = store.filterColumns) === null || _f === void 0 ? void 0 : _f.size) > 0 && react_1.default.createElement("span", null,
"\u5DF2\u7B5B\u9009",
store.rows.length,
"\u6761\u6570\u636E"),
(selectedItems.length == 0 ? "" : "\u5DF2\u9009\uFF1A".concat(selectedItems.length, "\u884C") + " , "),
((_g = _this.props.store.filteredColumns) === null || _g === void 0 ? void 0 : _g.find(function (_) { return _.type === '__checkme'; })) ? (_this.state.selectedIndex != undefined && "\u7B2C".concat(_this.state.selectedIndex + 1, "\u884C")) : null))),
react_1.default.createElement(react_1.default.Fragment, null,
leftChild,
rightChild))) : null;
};
_this.onToolsChange = function (key) {
_this.setState({ currentKey: key });
};
_this.onToolsClose = function (key) {
_this.setState(function (prev) { return ({
processToolsModalList: prev.processToolsModalList.filter(function (item) { return item.key !== key; }),
currentKey: ''
}); });
};
//使用二次加工工具处理完数据后，新增一个弹窗
_this.handleDealData = function (toolType, label, schema, extraProps, subTitle) {
var processToolsModalList = _this.state.processToolsModalList;
var key = (schema.name || schema.tableSchema.name) + '' + processToolsModalList.length;
_this.setState({
currentKey: key,
processToolsModalList: tslib_1.__spreadArray(tslib_1.__spreadArray([], processToolsModalList, true), [{ toolType: toolType, key: key, label: label, schema: schema, subTitle: subTitle, extraProps: extraProps }], false)
});
};
//修改二次加工工具条件
_this.handleChangeData = function (itemKey, schema) {
_this.setState(function (prev) { return ({
processToolsModalList: prev.processToolsModalList.map(function (item) {
if (item.key === itemKey) {
return tslib_1.__assign(tslib_1.__assign({}, item), { schema: schema });
}
return item;
})
}); });
};
_this.affix = function (isAll) {
var _a, _b;
var _c = _this.props, store = _c.store, affixRow = _c.affixRow, selected = _c.selected;
var selectedItems = (_b = (_a = selected === null || selected === void 0 ? void 0 : selected.concat()) !== null && _a !== void 0 ? _a : store.selectedRows.map(function (item) { return item.data; })) !== null && _b !== void 0 ? _b : [];
var items = isAll ? store.rows.map(function (item) { return item.data; }) : selectedItems;
var calcValue = function (groupItem) {
var _a, _b, _c, _d, _e, _f, _g;
var rawName = (_a = groupItem.rawName) !== null && _a !== void 0 ? _a : groupItem.name;
var field = affixRow === null || affixRow === void 0 ? void 0 : affixRow.find(function (aitem) { return rawName === aitem.name; });
if (field) {
var formulaRule = (_b = field.formula) === null || _b === void 0 ? void 0 : _b.toLocaleLowerCase();
var showText = ((_c = field.label) !== null && _c !== void 0 ? _c : '') + '：';
var value = (0, utils_1.calcFn)(formulaRule, rawName !== null && rawName !== void 0 ? rawName : '', items);
if (formulaRule === 'count') {
value = showText + value;
return value;
}
if (groupItem === null || groupItem === void 0 ? void 0 : groupItem.showUppercase) {
value = showText + (0, utils_1.translateNumber)(value, groupItem === null || groupItem === void 0 ? void 0 : groupItem.showUppercase);
return value;
}
value = value.toFixed((_d = groupItem === null || groupItem === void 0 ? void 0 : groupItem.precision) !== null && _d !== void 0 ? _d : 2);
if ((groupItem === null || groupItem === void 0 ? void 0 : groupItem.kilobitSeparator) && (groupItem === null || groupItem === void 0 ? void 0 : groupItem.showUppercase) === 0) {
value = (0, helper_1.numberFormatter)(value, (_e = groupItem === null || groupItem === void 0 ? void 0 : groupItem.precision) !== null && _e !== void 0 ? _e : 2);
}
value = "".concat(showText).concat((_f = groupItem.prefix) !== null && _f !== void 0 ? _f : '').concat(value).concat(groupItem.type === 'progress' ? '%' : ((_g = groupItem.suffix) !== null && _g !== void 0 ? _g : ''));
return value;
}
return null;
};
if ((affixRow === null || affixRow === void 0 ? void 0 : affixRow.length) > 0 && items.length > 0) {
var columns = store.filteredColumns;
var affixRes = columns.map(function (item) {
var _a, _b;
if ((_b = (_a = item.pristine) === null || _a === void 0 ? void 0 : _a.group) === null || _b === void 0 ? void 0 : _b.length) {
var list = item.pristine.group.map(function (groupItem) { return calcValue(groupItem); });
list = list.filter(function (info) { return info != null; });
return list.length > 0 ? list.join(',') : null;
}
return calcValue(item.pristine);
});
return (isAll ? "本页小计：" : "已选：") + affixRes.filter(function (info) { return info != null; }).join(',');
}
return null;
};
_this.itemCheckHandle = function (item) {
_this.props.checkOnItemClick ? (0, helper_1.noop)() : _this.handleCheck.bind(_this, item)(item);
};
_this.changeSelectedRow = function (index) {
var _a, _b;
_this.setState({ selectedIndex: index });
(_b = (_a = _this.props).changeSelectedRow) === null || _b === void 0 ? void 0 : _b.call(_a, index);
};
_this.tableContainer = react_1.default.createRef();
//拖拽的按钮
_this.btnDragging = null;
//起始位置
_this.originX = 0;
_this.originY = 0;
//拖动过程中的临时位置
_this.movingX = 0;
_this.movingY = 0;
_this.btnTouchStart = function (e, btn) {
if (btn === void 0) { btn = 'rotate'; }
e.persist();
e.preventDefault();
e.stopPropagation();
if (e.touches.length > 0) {
var touch = e.touches[0];
_this.originX = _this.movingX = touch.clientX; // 记录触摸开始的横坐标
_this.originY = _this.movingY = touch.clientY; // 记录触摸开始的纵坐标
_this.btnDragging = btn;
}
};
_this.btnToucheMove = function (e, btn) {
var _a, _b, _c, _d, _e;
if (btn === void 0) { btn = 'rotate'; }
e.persist();
e.preventDefault();
e.stopPropagation();
var ns = _this.props.classPrefix;
var table = (0, react_dom_1.findDOMNode)(_this);
var tabsDom = table.closest(".".concat(ns, "Tabs--content-tiled"));
if (tabsDom) {
tabsDom.style.overflow = 'hidden';
}
if (e.changedTouches.length > 0) {
_this.btnDragging = btn;
var touch = e.changedTouches[0];
var endX = touch.clientX; // 触摸结束的横坐标
var endY = touch.clientY; // 触摸结束的纵坐标
var moveX = endX - _this.movingX; // 横向移动距离
var moveY = endY - _this.movingY; // 纵向移动距离
if (moveX == 0 && moveY == 0) {
}
else {
_this.movingX = touch.clientX;
_this.movingY = touch.clientY;
var ns_1 = _this.props.classPrefix;
var tableContent = (_a = _this.tableContainer.current) === null || _a === void 0 ? void 0 : _a.querySelector(".".concat(ns_1, "Table-content"));
if (_this.btnDragging === 'rotate') {
var nx = _this.props.tableRotate ? _this.state.rotateX - moveY : _this.state.rotateX - moveX;
var ny = _this.props.tableRotate ? _this.state.rotateY + moveX : _this.state.rotateY - moveY;
//边界处理
if (nx <= 2)
nx = 2;
if (nx >= (((_b = _this.tableContainer.current) === null || _b === void 0 ? void 0 : _b.clientWidth) || document.body.clientWidth) - 50)
nx = (((_c = _this.tableContainer.current) === null || _c === void 0 ? void 0 : _c.clientWidth) || document.body.clientWidth) - 50;
if (ny <= 2)
ny = 2;
if (ny >= (tableContent === null || tableContent === void 0 ? void 0 : tableContent.clientHeight) - 50)
ny = (tableContent === null || tableContent === void 0 ? void 0 : tableContent.clientHeight) - 50;
_this.setState({ rotateX: nx, rotateY: ny });
}
if (_this.btnDragging === 'offline') {
var nx = _this.state.offlineX - moveX;
var ny = _this.state.offlineY - moveY;
if (nx <= 2)
nx = 2;
if (nx >= (((_d = _this.tableContainer.current) === null || _d === void 0 ? void 0 : _d.clientWidth) || document.body.clientWidth) - 50)
nx = (((_e = _this.tableContainer.current) === null || _e === void 0 ? void 0 : _e.clientWidth) || document.body.clientWidth) - 50;
if (ny <= 2)
ny = 2;
if (ny >= (tableContent === null || tableContent === void 0 ? void 0 : tableContent.clientHeight) - 50)
ny = (tableContent === null || tableContent === void 0 ? void 0 : tableContent.clientHeight) - 50;
_this.setState({ offlineX: nx, offlineY: ny });
}
}
}
};
_this.btnTouchEnd = function (e) {
var _a, _b;
e.persist();
e.preventDefault();
e.stopPropagation();
var ns = _this.props.classPrefix;
var table = (0, react_dom_1.findDOMNode)(_this);
var tabsDom = table.closest(".".concat(ns, "Tabs--content-tiled"));
if (tabsDom) {
tabsDom.style.overflow = 'auto';
}
if (e.changedTouches.length > 0) {
var touch = e.changedTouches[0];
var endX = touch.clientX; // 触摸结束的横坐标
var endY = touch.clientY; // 触摸结束的纵坐标
// 如果拖动的距离很小，认为是一次单击事件
var distance = Math.sqrt(Math.pow((endX - _this.originX), 2) + Math.pow((endY - _this.originY), 2));
if (distance < 1) {
// 在这里处理单击事件
if (_this.btnDragging === 'rotate') {
(_a = _this.props) === null || _a === void 0 ? void 0 : _a.handleTableRotate();
}
if (_this.btnDragging === 'offline') {
(_b = _this.props) === null || _b === void 0 ? void 0 : _b.handleClickOffline();
}
}
}
_this.btnDragging = null;
};
_this.handleOutterScroll = _this.handleOutterScroll.bind(_this);
_this.affixDetect = _this.affixDetect.bind(_this);
_this.updateTableInfoLazy = (0, debounce_1.default)(_this.updateTableInfo.bind(_this), 250, {
trailing: true,
leading: true
});
_this.tableRef = _this.tableRef.bind(_this);
_this.affixedTableRef = _this.affixedTableRef.bind(_this);
_this.handleAction = _this.handleAction.bind(_this);
_this.handleCheck = _this.handleCheck.bind(_this);
_this.handleCheckAll = _this.handleCheckAll.bind(_this);
_this.handleQuickChange = _this.handleQuickChange.bind(_this);
_this.handleSave = _this.handleSave.bind(_this);
_this.handleSaveOrder = _this.handleSaveOrder.bind(_this);
_this.reset = _this.reset.bind(_this);
_this.dragTipRef = _this.dragTipRef.bind(_this);
_this.getPopOverContainer = _this.getPopOverContainer.bind(_this);
_this.renderCell = _this.renderCell.bind(_this);
_this.renderHeadCell = _this.renderHeadCell.bind(_this);
_this.renderToolbar = _this.renderToolbar.bind(_this);
_this.handleMouseMove = _this.handleMouseMove.bind(_this);
_this.handleMouseLeave = _this.handleMouseLeave.bind(_this);
_this.handleColumnToggle = _this.handleColumnToggle.bind(_this);
_this.renderAutoFilterForm = _this.renderAutoFilterForm.bind(_this);
_this.updateAutoFillHeight = _this.updateAutoFillHeight.bind(_this);
// Jay
_this.updateAutoFillHeightTimes = 0;
_this.handleColumns.bind(_this);
_this.handleMultiColumnSort = _this.handleMultiColumnSort.bind(_this);
(_b = (_a = _this.props).getTableStore) === null || _b === void 0 ? void 0 : _b.call(_a, _this.props.store);
(_d = (_c = _this.props).getTableInstance) === null || _d === void 0 ? void 0 : _d.call(_c, _this);
_this.handleModleColumn = _this.handleModleColumn.bind(_this);
// 暂时注释掉
// this.initToolbarObserver = this.initToolbarObserver.bind(this);
_this.handleToggleHeaderToolbar = _this.handleToggleHeaderToolbar.bind(_this);
// 父级容器注册方法
(_f = (_e = _this.props).dataCheckRegist) === null || _f === void 0 ? void 0 : _f.call(_e, _this.handleModleColumn);
_this.tableWindowRef = react_1.default.createRef();
_this.tableActionsRef = react_1.default.createRef();
_this.state = {
// position: [0, ''],
// contextMenuVisible: false,
pullY: 0,
rotateX: 24,
rotateY: 24,
offlineX: 24,
offlineY: props.tableLayout == 'horizontal' ? 84 : 24,
indexColShow: !!props.showIndex,
columnsTogglerShow: false,
toolbarShow: false,
tableMode: props.tableLayout,
columnSettingTemps: [],
processToolsModalList: [],
currentKey: '',
activeCol: undefined,
activeRow: undefined,
fieldTranslate: false,
showAiTool: false,
headerIsFolded: false,
showExpandMoreAction: false,
actionsExpanded: false
};
var type = props.type, store = props.store, columns = props.columns, selectable = props.selectable, columnsTogglable = props.columnsTogglable, draggable = props.draggable, orderBy = props.orderBy, orderDir = props.orderDir, multiple = props.multiple, footable = props.footable, primaryField = props.primaryField, itemCheckableOn = props.itemCheckableOn, itemDraggableOn = props.itemDraggableOn, hideCheckToggler = props.hideCheckToggler, combineFromIndex = props.combineFromIndex, expandConfig = props.expandConfig, formItem = props.formItem, keepItemSelectionOnPageChange = props.keepItemSelectionOnPageChange, maxKeepItemSelectionLength = props.maxKeepItemSelectionLength, isPick = props.isPick, showIndex = props.showIndex, tableLayout = props.tableLayout;
var combineNum = props.combineNum;
if (typeof combineNum === 'string') {
combineNum = parseInt((0, tpl_builtin_1.resolveVariableAndFilter)(combineNum, props.data, '| raw'), 10);
}
// Aug
var mobileUI = (0, helper_1.isMobile)();
// Aug 移动端默认只展示6项
var _columns = columns || [];
if (mobileUI &&
tableLayout === 'vertical' &&
footable &&
columns &&
columns.length > 6) {
_columns.map(function (item, index) {
if (index > 5) {
item.breakpoint = '*';
}
});
}
_this.sortCols = _this.handleColumns(_columns, { sort: type == 'cross' ? false : undefined });
store.update({
selectable: selectable,
draggable: draggable,
columns: _this.sortCols,
rawColumns: _this.handleColumns(_columns, {
sort: false
}),
columnsTogglable: columnsTogglable,
orderBy: orderBy,
orderDir: orderDir,
multiple: multiple,
showIndex: showIndex,
footable: footable,
expandConfig: expandConfig,
primaryField: primaryField,
itemCheckableOn: itemCheckableOn,
itemDraggableOn: itemDraggableOn,
hideCheckToggler: (0, helper_1.isMobile)() && isPick ? false : hideCheckToggler,
combineNum: combineNum,
combineFromIndex: combineFromIndex,
keepItemSelectionOnPageChange: keepItemSelectionOnPageChange,
maxKeepItemSelectionLength: maxKeepItemSelectionLength,
mobileUI: mobileUI,
orderColumns: new Map(),
filterColumns: new Map(),
tableLayout: tableLayout,
columnsInfo: _this.props.columnInfo,
deferApi: !!_this.props.deferApi
});
// debugger
formItem && (0, mobx_state_tree_1.isAlive)(formItem) && formItem.setSubStore(store);
Table.syncRows(store, _this.props, undefined).then(function (res) { res && _this.syncSelected(); });
_this.toDispose.push((0, mobx_1.reaction)(function () {
return store
.getExpandedRows()
.filter(function (row) { return row.defer && !row.loaded && !row.loading && !row.error; });
}, function (rows) { return rows.forEach(_this.loadDeferredRow); }));
return _this;
}
// Jay
Table.prototype.handleColumns = function (columns, options) {
var _a;
var _b = (options || {}).sort, sort = _b === void 0 ? true : _b;
var handleCols = (0, cloneDeep_1.default)(columns);
var store = this.props.store;
var columnInfo = store.columnsInfo && Object.keys(store.columnsInfo).length ? store.columnsInfo : this.props.columnInfo;
var foldColumns = this.props.foldColumns;
// columns的长度比columnInfo的长度大时，不进行排序
// const flag = columnInfo && (Object.keys(columnInfo).length <= handleCols.length)
if (columnInfo && Object.keys(columnInfo).length && sort) {
var tempArr_1 = [];
var tempArrNofixed_1 = [];
var tempArrFixedLeft_1 = [];
var tempArrFixedRight_1 = [];
handleCols.forEach(function (col) {
var _a, _b, _c, _d, _e;
// 如果column的hidden是true，则不允许被设置
if (col === null || col === void 0 ? void 0 : col.hidden)
col.canSet = false;
if (col.name && columnInfo[col.name]) {
if (((_a = columnInfo[col.name]) === null || _a === void 0 ? void 0 : _a.hidden) === 0) {
col.hidden = (_b = col === null || col === void 0 ? void 0 : col.hidden) !== null && _b !== void 0 ? _b : false;
}
else {
col.hidden = (_c = col === null || col === void 0 ? void 0 : col.hidden) !== null && _c !== void 0 ? _c : true;
}
if ((_d = columnInfo[col.name]) === null || _d === void 0 ? void 0 : _d.fixed) {
col.fixed = (_e = columnInfo[col.name]) === null || _e === void 0 ? void 0 : _e.fixed;
}
tempArr_1[columnInfo[col.name].index] = col;
}
else {
if (col.fixed === 'left') {
tempArrFixedLeft_1.push(col);
}
else if (col.fixed === 'right') {
tempArrFixedRight_1.push(col);
}
else {
tempArrNofixed_1.push(col);
}
}
});
tempArr_1 = tempArr_1.filter(Boolean);
var fixedRightBefore = tempArr_1.length;
for (var i = tempArr_1.length - 1; i >= 0; i--) {
if (tempArr_1[i].fixed !== 'right') {
fixedRightBefore = i + 1;
break;
}
}
tempArr_1.splice.apply(tempArr_1, tslib_1.__spreadArray([fixedRightBefore, 0], tempArrNofixed_1, false));
tempArr_1 = tempArrFixedLeft_1.concat(tempArr_1.concat(tempArrFixedRight_1));
handleCols = tempArr_1;
}
else {
handleCols.forEach(function (col) {
// 如果column的hidden是true，则不允许被设置
if (col === null || col === void 0 ? void 0 : col.hidden)
col.canSet = false;
});
}
// 列折叠
var mobileUI = (0, helper_1.isMobile)();
if (!mobileUI) {
for (var i = handleCols.length - 1; i >= 0; i--) {
var item = handleCols[i];
if ((item === null || item === void 0 ? void 0 : item.type) === 'operation') {
item.style = { overFlow: 'hidden' };
item.label = [
{
type: 'button',
label: '',
size: 'xs',
level: 'link',
icon: (foldColumns === null || foldColumns === void 0 ? void 0 : foldColumns.includes('scale' + item.name))
? 'fa fa-step-backward'
: 'fa fa-step-forward',
actionType: 'scale' + item.name
},
item.label
];
if (i < handleCols.length - 4)
break;
}
}
}
// 本地编辑列宽字段
var localEditWidthMap = (_a = (0, storage_1.getLocalStorage)(exports.EDITWIDTHKEY)) === null || _a === void 0 ? void 0 : _a[this.props.crudName];
return handleCols.map(function (_) {
if (localEditWidthMap === null || localEditWidthMap === void 0 ? void 0 : localEditWidthMap[_.name]) {
_.editWidth = localEditWidthMap === null || localEditWidthMap === void 0 ? void 0 : localEditWidthMap[_.name];
}
return _;
});
};
Table.syncRows = function (store, props, prevProps) {
var _a, _b, _c, _d, _e, _f, _g, _h;
return tslib_1.__awaiter(this, void 0, void 0, function () {
var source, value, rows, updateRows, resolved, prev, rawDatas, columns_1, rowFields, colFields, valueFields, crossColumns, crossDatas, _j;
return tslib_1.__generator(this, function (_k) {
switch (_k.label) {
case 0:
source = props.source;
value = props.value || props.items;
rows = [];
updateRows = false;
if (Array.isArray(value) &&
(!prevProps || (prevProps.value || prevProps.items) !== value)) {
updateRows = true;
rows = value;
}
else if (typeof source === 'string') {
resolved = (0, tpl_builtin_1.resolveVariableAndFilter)(source, props.data, '| raw');
prev = prevProps
? (0, tpl_builtin_1.resolveVariableAndFilter)(source, prevProps.data, '| raw')
: null;
if ((prevProps === null || prevProps === void 0 ? void 0 : prevProps.type) !== props.type) {
updateRows = true;
rows = resolved;
}
else if (prev && prev === resolved) {
updateRows = false;
}
else if (Array.isArray(resolved)) {
updateRows = true;
rows = resolved;
}
}
if (!updateRows) return [3 /*break*/, 9];
rawDatas = tslib_1.__spreadArray([], ((_a = props.items) !== null && _a !== void 0 ? _a : []), true);
if (!(props.cross && props.type == 'cross')) return [3 /*break*/, 7];
if (!(rawDatas.length > 0)) return [3 /*break*/, 5];
columns_1 = store.rawColumns.filter(function (column) { return column.name; });
rowFields = (0, lodash_1.flatMap)((_b = props.cross.rowFields) !== null && _b !== void 0 ? _b : [], function (field) {
var target = columns_1.find(function (column) { return column.name === field.name; });
return target ? Object.assign(field, target) : [];
});
colFields = (0, lodash_1.flatMap)((_c = props.cross.columnFields) !== null && _c !== void 0 ? _c : [], function (field) {
var target = columns_1.find(function (column) { return column.name === field.name; });
return target ? Object.assign(field, target) : [];
});
valueFields = (0, lodash_1.flatMap)((_d = props.cross.valueFields.split(',')) !== null && _d !== void 0 ? _d : [], function (field) {
var target = columns_1.find(function (column) { return column.name === field; });
return target ? Object.assign({ name: field }, target) : [];
});
(_e = props.setLoading) === null || _e === void 0 ? void 0 : _e.call(props, true);
crossColumns = (_f = props.crossColumns) !== null && _f !== void 0 ? _f : (props.cross.positionType == 0 ? (0, cross_1.buildCrossColumn)(rowFields, colFields, valueFields, rawDatas, false) : (0, cross_1.buildCrossColumn1)(rowFields, colFields, rawDatas));
crossColumns = (0, commonTableFunction_1.syncCrossColumnInfo)(crossColumns, props.columnInfo);
if (!(props.cross.positionType == 0)) return [3 /*break*/, 2];
return [4 /*yield*/, (0, cross_1.buildCrossData)(rowFields, colFields, crossColumns, rawDatas, props.isCross)];
case 1:
_j = _k.sent();
return [3 /*break*/, 4];
case 2: return [4 /*yield*/, (0, cross_1.buildCrossData1)(rowFields, colFields, valueFields, crossColumns, rawDatas, props.isCross)];
case 3:
_j = _k.sent();
_k.label = 4;
case 4:
crossDatas = _j;
(_g = props.setLoading) === null || _g === void 0 ? void 0 : _g.call(props, false);
rows = crossDatas.map(function (_) {
var _a;
return (tslib_1.__assign(tslib_1.__assign({}, _), (_a = {}, _a[crud_1.DATAKEYID] = _[crud_1.DATAKEYID] || (0, helper_1.uuidv4)(), _a)));
});
store.updateColumns(crossColumns);
store.reInitData(tslib_1.__assign({ page: 1, perPage: props.perPage || 10000, count: rows.length, total: rows.length, items: rows, itemsRaw: rows, dataSetId: (0, helper_1.uuidv4)() }, props.query));
return [3 /*break*/, 6];
case 5:
store.reInitData(tslib_1.__assign({ page: 1, perPage: props.perPage || 10000, count: 0, total: 0, items: [], itemsRaw: [], dataSetId: (0, helper_1.uuidv4)() }, props.query));
_k.label = 6;
case 6: return [3 /*break*/, 8];
case 7:
if (props.cross && props.type == 'table') {
store.updateColumns(props.columns);
rows = rawDatas;
store.reInitData({
count: rows.length,
total: rows.length,
items: rows,
itemsRaw: rows,
dataSetId: (0, helper_1.uuidv4)()
});
}
_k.label = 8;
case 8:
store.initRows(rows, props.getEntryId, props.reUseRow, { caculateWidth: props.autoWidth, autoUnfold: ((_h = props === null || props === void 0 ? void 0 : props.tree) === null || _h === void 0 ? void 0 : _h.unfoldedLevel) && (props.tree.initiallyOpen > 0 ? props.tree.initiallyOpen : Infinity) });
_k.label = 9;
case 9:
typeof props.selected !== 'undefined' &&
store.updateSelected(props.selected, props.valueField);
return [2 /*return*/, updateRows];
}
});
});
};
Table.prototype.caculateLeft = function (force) {
var _a, _b;
if (force === void 0) { force = false; }
var thArray = Array.from(((_a = this.table) === null || _a === void 0 ? void 0 : _a.querySelectorAll('table>thead>tr>th')) || []);
// 一样了就不重新计算了
if (thArray.length === ((_b = this.leftDistances) === null || _b === void 0 ? void 0 : _b.length) && !force)
return;
var leftDistances = [];
var offsetWidths = thArray.map(function (_) { return _.offsetWidth; });
offsetWidths.map(function (offsetWidth, index) {
return leftDistances.push((leftDistances[index - 1] || 0) + (offsetWidths[index - 1] || 0));
});
this.leftDistances = leftDistances;
};
Table.prototype.componentDidMount = function () {
var _a, _b, _c;
var parent = (0, helper_1.getScrollParent)((0, react_dom_1.findDOMNode)(this));
this.caculateLeft();
if (!parent || parent === document.body) {
parent = window;
}
this.parentNode = parent;
this.updateTableInfo();
var dom = (0, react_dom_1.findDOMNode)(this);
// 这个主要给外部store做引用用的,因为不是组件自身的功能，所以有可能会没有故增加容错
(_b = (_a = this.props).setChildStore) === null || _b === void 0 ? void 0 : _b.call(_a, this.props.store);
if (dom.closest('.modal-body')) {
return;
}
var ns = this.props.classPrefix;
var tableContentWrap = dom.querySelector(".".concat(ns, "Table-contentWrap"));
tableContentWrap === null || tableContentWrap === void 0 ? void 0 : tableContentWrap.addEventListener('scroll', this.scrollPingBox);
if (tableContentWrap) {
if (tableContentWrap.scrollWidth <= tableContentWrap.clientWidth) {
tableContentWrap.classList.remove('table-ping-right');
}
}
this.affixDetect();
parent === null || parent === void 0 ? void 0 : parent.addEventListener('scroll', this.affixDetect);
window.addEventListener('resize', this.affixDetect);
this.updateAutoFillHeight();
window.addEventListener('resize', this.updateAutoFillHeight);
document.body.addEventListener(types_1.ResizeEvent.DIALOGRESIZEENDEVENT, this.updateAutoFillHeight);
this.getColumnSettingList();
// 暂时注释
// this.initToolbarObserver();
if (((_c = this.tableActionsRef) === null || _c === void 0 ? void 0 : _c.current) && this.tableActionsRef.current.scrollWidth > this.tableActionsRef.current.clientWidth) {
this.setState({ showExpandMoreAction: true });
}
};
/**
* 自动设置表格高度占满界面剩余区域
* 用 css 实现有点麻烦，要改很多结构，所以先用 dom hack 了，避免对之前的功能有影响
*/
Table.prototype.updateAutoFillHeight = function () {
var _this = this;
var _a, _b;
var _c = this.props, autoFillHeight = _c.autoFillHeight, footerToolbar = _c.footerToolbar, ns = _c.classPrefix, isPick = _c.isPick, footer = _c.footer, isStatic = _c.isStatic, type = _c.type, tableLayout = _c.tableLayout;
var isCross = type === 'cross';
if (!this.table && !(0, helper_1.isMobile)())
return;
var table = (0, react_dom_1.findDOMNode)(this);
var tableContent = table.querySelector(".".concat(ns, "Table-content"));
var tableContentWrap = table.querySelector(".".concat(ns, "Table-contentWrap"));
var footToolbar = table.querySelector(".".concat(ns, "Table-footToolbar"));
var tableFooter = table.querySelector(".".concat(ns, "Table-footer"));
var tableHeading = table.querySelector(".".concat(ns, "Table-heading"));
var headerToolbar = table.querySelector(".".concat(ns, "Mobile-header-toolbar-wrapper"));
var tableDom = table.querySelector(".".concat(ns, "Table-table"));
if ((0, helper_1.isMobile)()) {
//tab页平铺模式样式处理
var tabsDom = table.closest(".".concat(ns, "Tabs--content-tiled"));
var toolbarDom = table.querySelector('.filter-wrapper');
if (tabsDom) {
// 如果是移动端的平铺模式，则限制最大高度，让一个tab的内容尽量铺满一屏
tableContent.style.maxHeight = '55vh';
if (tableLayout === 'vertical') {
tableContent.style.minHeight = '250px';
}
return;
}
//在picker中，使用的是modal，高度与普通的计算方式不同
if (isPick) {
var tableHeight = document.body.clientHeight - (0, offset_1.default)(table).top;
table.style.height = tableHeight - 49 - 44 - 28 - 16 + 'px';
return;
}
var distanceClass = table.closest(".".concat(ns, "Distance"));
if (distanceClass) {
//在grid中占满grid的高度
table.closest(".".concat(ns, "Crud")).style.height = '100%';
table.style.height = '100%';
}
else {
//如果是行按钮打开的抽屉，可能会有footer，要把footer高度减掉
var drawerFooter = (_a = table.closest(".".concat(ns, "Drawer-content"))) === null || _a === void 0 ? void 0 : _a.querySelector(".".concat(ns, "Drawer-footer"));
// 循环计算父级节点的 pddding，这里不考虑父级节点还可能会有其它兄弟节点的情况了
var allParentPaddingButtom = 0;
var parentNode = tableContent.parentElement;
while (parentNode) {
var paddingBottom = (0, dom_1.getStyleNumber)(parentNode, 'padding-bottom');
var borderBottom = (0, dom_1.getStyleNumber)(parentNode, 'border-bottom-width');
allParentPaddingButtom =
allParentPaddingButtom + paddingBottom + borderBottom;
parentNode = parentNode.parentElement;
}
var tableHeight = document.body.clientHeight -
(0, offset_1.default)(table).top -
(drawerFooter ? drawerFooter.clientHeight + 1 : 0) -
allParentPaddingButtom;
// tab情况下，后面的table由于display：none，所以offset(table).top为0，所以继承最小的那个
if ((0, offset_1.default)(table).top === 0) {
var tabsContent = table.closest(".".concat(ns, "Tabs-content"));
tableHeight =
document.body.clientHeight -
(0, offset_1.default)(tabsContent).top -
(drawerFooter ? drawerFooter.clientHeight + 1 : 0) -
allParentPaddingButtom - 24; //多出来的24是tabs-pane的padding
}
else if ((0, offset_1.default)(table).top < 0) {
tableHeight =
document.body.clientHeight -
(drawerFooter ? drawerFooter.clientHeight + 1 : 0) -
allParentPaddingButtom - 24; //多出来的24是tabs-pane的padding
}
// console.log('debug-autoFillHeight', autoFillHeight, `tableHeight:${tableHeight} | ${tableHeight / 10}， headerToolbar.offsetHeight：${headerToolbar.offsetHeight}, `);
// if (autoFillHeight && tableHeight >= 250) {
// // header-toolbar的高度
// // tableContent.style.maxHeight = `calc(${tableHeight - 40 - 40 - footToolbar?.clientHeight}px)`;
// if (headerToolbar.offsetHeight > tableHeight / 10) {
// // 整体容器高度 table + 操作栏
// // const finalHeight = (headerToolbar?.offsetHeight || 38) + tableHeight - 28 - (footToolbar?.offsetHeight || 38);
// const finalHeight = (headerToolbar?.offsetHeight) + tableHeight - (footToolbar?.offsetHeight ?? 0);
// table.style.height = `calc(${finalHeight}px)`;
// if (tableDom) {
// tableDom.style.height = (finalHeight - footToolbar?.offsetHeight - headerToolbar.offsetHeight + (footToolbar?.offsetHeight ? 20 : 0)) + 'px';
// }
// if (footToolbar) {
// footToolbar.style.position = 'sticky';
// footToolbar.style.bottom = '0px';
// footToolbar.style.zIndex = '6';
// }
// tableContent.style.overscrollBehavior = 'auto'
// } else {
// table.style.height = tableHeight + 'px';
// }
// //当表格可展示高度大于250的占满剩余空间
// // table.style.height = 'auto';
// table.style.maxHeight = 'unset';
// } else {
// // tableContent.style.maxHeight = 'initial';
// // tableContent.style.maxHeight = 'calc(70vh - 40px)';
// // tableContent.style.maxHeight = `calc(${tableHeight - 40 - 40 - footToolbar?.clientHeight}px)`;
// table.style.maxHeight = document.body.clientHeight - 38 + 'px';
// if (tableLayout === 'vertical') {
// tableContent.style.minHeight = '250px';
// }
// }
if (autoFillHeight && tableHeight >= 250) {
//当表格可展示高度大于250的占满剩余空间
table.style.height = tableHeight + 'px';
table.style.maxHeight = 'unset';
}
else {
table.style.maxHeight = document.body.clientHeight - 38 + 'px';
if (tableLayout === 'vertical') {
tableContent.style.minHeight = '250px';
}
}
}
}
else {
this.tabsDom = table.closest(".".concat(ns, "Tabs--content-tiled"));
//tab页平铺模式样式处理
if (!autoFillHeight || this.tabsDom) {
if (this.tabsDom)
tableContent.style.minHeight = '250px';
return;
}
var distanceClass = table.closest(".".concat(ns, "Distance"));
if (distanceClass) {
//在grid中占满grid的高度
table.closest(".".concat(ns, "Crud")).style.height = '100%';
table.style.height = '100%';
return;
}
if (!tableContent) {
return;
}
var viewportHeight_1 = window.innerHeight;
var tableContentHeading_1 = tableHeading ? (0, offset_1.default)(tableHeading).height : 0;
// 有时候会拿不到 footToolbar？
var footToolbarHeight_1 = footToolbar ? (0, offset_1.default)(footToolbar).height : 0;
var tableFooterHeight_1 = tableFooter ? (0, offset_1.default)(tableFooter).height : 0;
if (!footToolbarHeight_1 && footerToolbar && footerToolbar.length) {
footToolbarHeight_1 = 48;
}
if (!tableFooterHeight_1 && footer && (!Array.isArray(footer) || footer.length)) {
tableFooterHeight_1 = 25;
}
var hasfooter = this.renderFooter();
if (!hasfooter) {
footToolbarHeight_1 = 0;
tableFooterHeight_1 = 0;
}
var tableContentWrapMarginBottom_1 = (0, dom_1.getStyleNumber)(tableContentWrap, 'margin-bottom');
// 循环计算父级节点的 pddding，这里不考虑父级节点还可能会有其它兄弟节点的情况了
var allParentPaddingButtom_1 = 0;
var parentNode = tableContent.parentElement;
while (parentNode) {
var paddingBottom = (0, dom_1.getStyleNumber)(parentNode, 'padding-bottom');
var borderBottom = (0, dom_1.getStyleNumber)(parentNode, 'border-bottom-width');
allParentPaddingButtom_1 =
allParentPaddingButtom_1 + paddingBottom + borderBottom;
parentNode = parentNode.parentElement;
}
var getContentViewHeight_1 = function () {
// 计算 table-content 在 dom 中的位置
var tableContentTop = (0, offset_1.default)(tableContent).top;
// console.log('高度参数比较', {
// viewportHeight,
// tableContentTop,
// tableContentWrapMarginBottom,
// footToolbarHeight,
// tableContentHeading,
// allParentPaddingButtom,
// others: 12 - (this.props.inModal ? 48 : 0)
// })
var viewHigh = viewportHeight_1 -
(isPick ? 32 : 0) -
tableContentTop -
tableContentWrapMarginBottom_1 -
footToolbarHeight_1 -
tableFooterHeight_1 -
tableContentHeading_1 -
allParentPaddingButtom_1 -
20 - (_this.props.inModal ? 68 : 0);
return viewHigh;
};
tableContent.style.height = "".concat(getContentViewHeight_1(), "px");
tableContent.style.minHeight = '250px';
if (isStatic || isCross) {
var Content = table === null || table === void 0 ? void 0 : table.closest('[class*="modal-content"]');
var Head = Content === null || Content === void 0 ? void 0 : Content.querySelector('[class*="modal-header"]');
var Container = (((Content === null || Content === void 0 ? void 0 : Content.getBoundingClientRect().height) || 0) - ((Head === null || Head === void 0 ? void 0 : Head.getBoundingClientRect().height) || 0));
var footHeight = ((_b = table.querySelector('[class*="Table-toolbar"]')) === null || _b === void 0 ? void 0 : _b.clientHeight) || 0;
var staticHeight = Container - 48 - 48 - footHeight;
tableContent.style.height = staticHeight + 'px';
}
var MutationObserver = window.MutationObserver;
this.mutationObserver = new MutationObserver(function (e) {
var _a;
// 对高度更新进行节流-防止瞬间多次不同高度撑开容器导致高度混乱
clearTimeout(_this.contetnHighUpdateTimer);
var tableContentDom = (_a = _this.tableContainer.current) === null || _a === void 0 ? void 0 : _a.querySelector(".".concat(ns, "Table-content"));
_this.contetnHighUpdateTimer = setTimeout(function () {
if (tableContent && tableContentDom) {
tableContentDom.style.height = "".concat(getContentViewHeight_1(), "px");
tableContentDom.style.minHeight = '250px';
}
}, 10);
});
var formToolbar = table.previousElementSibling;
if (formToolbar && !isStatic && !isCross) {
this.mutationObserver.observe(formToolbar, {
attributes: true,
childList: true
});
}
var tableToolbar = table.querySelector('[class*="Table-toolbar"]');
if (tableToolbar && !isStatic && !isCross) {
this.mutationObserver.observe(tableToolbar, {
attributes: true,
childList: true,
subtree: true
});
}
if (table && !isStatic && !isCross) {
this.mutationObserver.observe(table, {
childList: true
});
}
var DistanceClass = table.closest(".".concat(ns, "Distance"));
var tableContents = DistanceClass === null || DistanceClass === void 0 ? void 0 : DistanceClass.querySelectorAll(".".concat(ns, "Table-content"));
if (tableContents && (tableContents === null || tableContents === void 0 ? void 0 : tableContents.length) > 1) {
var tablea = tableContents[1];
var tableb = tableContents[0];
tablea.style.height = tableb.style.height;
}
}
};
Table.prototype.componentDidUpdate = function (prevProps, prevState) {
var _this = this;
var props = this.props;
var store = props.store;
this.caculateLeft();
// 默认的更新属性
var defaultUpdateProps = {
selectable: props.selectable,
columnsTogglable: props.columnsTogglable,
draggable: props.draggable,
orderBy: props.orderBy,
orderDir: props.orderDir,
multiple: props.multiple,
showIndex: props.showIndex,
primaryField: props.primaryField,
footable: props.footable,
itemCheckableOn: props.itemCheckableOn,
itemDraggableOn: props.itemDraggableOn,
hideCheckToggler: props.hideCheckToggler,
combineNum: props.combineNum,
combineFromIndex: props.combineFromIndex,
expandConfig: props.expandConfig
};
if ((0, helper_1.anyChanged)([
'selectable',
'columnsTogglable',
'draggable',
'orderBy',
'orderDir',
'multiple',
'footable',
'primaryField',
'itemCheckableOn',
'itemDraggableOn',
'hideCheckToggler',
'combineNum',
'combineFromIndex',
'expandConfig'
], prevProps, props)) {
if (typeof props.combineNum === 'string') {
var combineNum = parseInt((0, tpl_builtin_1.resolveVariableAndFilter)(props.combineNum, props.data, '| raw'), 10);
defaultUpdateProps.combineNum = combineNum;
}
store.update(defaultUpdateProps);
}
if (prevProps.columns !== props.columns) {
this.sortCols = this.handleColumns(props.columns || [], {});
store.update(tslib_1.__assign(tslib_1.__assign({}, defaultUpdateProps), { columns: this.sortCols, rawColumns: this.handleColumns(props.columns || [], { sort: false }) }));
}
// 自动列宽更新
// if (prevProps.autoWidth !== props.autoWidth && props.autoWidth) {
// this.props.store.setTextWidth(this.props.store.rows.map(_ => _.data))
// }
if (prevProps.foldColumns !== props.foldColumns) {
store.updateOperation(props.foldColumns);
}
// 数据源id更新
if (prevProps.data.dataSetId !== props.data.dataSetId) {
store.updateDataSetId(props.data.dataSetId);
}
if ((0, helper_1.anyChanged)(['source', 'value', 'items', 'type'], prevProps, props) ||
(!props.value &&
!props.items &&
(props.data !== prevProps.data ||
(typeof props.source === 'string' && (0, tpl_builtin_1.isPureVariable)(props.source))))) {
if (this.props.isPick) {
this.updateAutoFillHeight();
}
Table.syncRows(store, props, prevProps).then(function (res) {
if (res) {
var selectedTimer_1 = setTimeout(function () {
_this.syncSelected();
clearTimeout(selectedTimer_1);
}, 0);
}
});
}
else if ((0, helper_1.isArrayChildrenModified)(prevProps.selected, props.selected)) {
var prevSelectedRows = store.selectedRows
.map(function (item) { return item.id; })
.join(',');
store.updateSelected(props.selected || [], props.valueField);
var selectedRows = store.selectedRows.map(function (item) { return item.id; }).join(',');
prevSelectedRows !== selectedRows && this.syncSelected();
}
//解决tabs一次性加载时，后面的table高度计算时获取不到在dom中的定位导致高度计算错误
if (props.tabsdefer !== prevProps.tabsdefer) {
this.updateAutoFillHeight();
}
if (this.state.processToolsModalList.length > 0 && prevState.processToolsModalList.length == 0) {
this.updateAutoFillHeight();
}
// 更新预存值得缓存-
this.updateTableInfoLazy();
};
Table.prototype.componentWillUnmount = function () {
var _a;
var _b = this.props, formItem = _b.formItem, store = _b.store, ns = _b.classPrefix;
this.toDispose.forEach(function (fn) { return fn(); });
this.toDispose = [];
var parent = this.parentNode;
// EventSub.off(EventEnum.ClearVistiMap) // 取消表格订阅
// EventSub.off(EventEnum.ShowVistiMap) // 取消表格订阅
var dom = (0, react_dom_1.findDOMNode)(this);
var tableContentWrap = dom.querySelector(".".concat(ns, "Table-contentWrap"));
tableContentWrap === null || tableContentWrap === void 0 ? void 0 : tableContentWrap.removeEventListener('scroll', this.scrollPingBox);
parent && (parent === null || parent === void 0 ? void 0 : parent.removeEventListener('scroll', this.affixDetect));
delete this.parentNode; // 解除引用
for (var key in this.subForms) {
delete this.subForms[key];
}
window.removeEventListener('resize', this.affixDetect);
window.removeEventListener('resize', this.updateAutoFillHeight);
document.body.removeEventListener(types_1.ResizeEvent.DIALOGRESIZEENDEVENT, this.updateAutoFillHeight);
(_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect(); // 移除监听
this.mutationObserver = null;
this.updateTableInfoLazy.cancel();
this.table = null;
this.unSensor && this.unSensor();
formItem && (0, mobx_state_tree_1.isAlive)(formItem) && formItem.setSubStore(null);
this.destroyDragTable();
// 移除toolbar监听
// const table = findDOMNode(this) as HTMLElement;
// if (table && isMobile()) {
// const headerToolbar = table.querySelector(
// `.${ns}Mobile-header-toolbar-wrapper`
// ) as HTMLElement;
// if (headerToolbar) {
// this.toolbarObserver?.unobserve(headerToolbar);
// }
// }
try {
store.orderColumns.clear();
store.filterColumns.clear();
}
catch (_c) { }
};
Table.prototype.handleAction = function (e, action, ctx, isItemAction) {
if (isItemAction === void 0) { isItemAction = false; }
var onAction = this.props.onAction;
// todo
onAction(e, action, ctx, undefined, undefined, isItemAction);
};
Table.prototype.handleCheck = function (item, value, shift) {
var store = this.props.store;
if (shift) {
store.toggleShift(item);
}
else {
item.toggle();
}
this.syncSelected();
};
// 0全选 1反选 2不选
Table.prototype.handleCheckAll = function (type) {
var store = this.props.store;
switch (type) {
case 0:
store.checkAll();
break;
case 1:
store.checkReverse();
break;
case 2:
store.clear();
break;
case 3:
store.toggleAll();
break;
default:
return;
}
this.syncSelected();
};
Table.prototype.handleQuickChange = function (item, values, saveImmediately, savePristine, resetOnFailed) {
if (!(0, mobx_state_tree_1.isAlive)(item)) {
return;
}
var _a = this.props, onSave = _a.onSave, onPristineChange = _a.onPristineChange, propsSaveImmediately = _a.saveImmediately, store = _a.store, primaryField = _a.primaryField;
item.change(values, savePristine);
store.recordEditValues(item, values);
// 值发生变化了，需要通过 onSelect 通知到外面，否则会出现数据不同步的问题
item.modified && this.syncSelected();
if (savePristine) {
onPristineChange === null || onPristineChange === void 0 ? void 0 : onPristineChange(item.data, item.path);
return;
}
else if (!saveImmediately && !propsSaveImmediately) {
return;
}
if (saveImmediately && saveImmediately.api) {
this.props.onAction(null, {
actionType: 'ajax',
api: saveImmediately.api
}, values);
return;
}
if (!onSave) {
return;
}
onSave(item.data, (0, helper_1.difference)(item.data, item.pristine, ['id', primaryField]), item.path, undefined, item.pristine, resetOnFailed);
};
Table.prototype.handleSave = function () {
var _a;
return tslib_1.__awaiter(this, void 0, void 0, function () {
var _b, store, onSave, primaryField, type, cross, items, submitCount, subForms, result, falseResltIdx, rowIndexes, diff, resultArray, orginArr, _loop_1, this_1, index, state_1, rows, unModifiedRows;
var _this = this;
return tslib_1.__generator(this, function (_c) {
switch (_c.label) {
case 0:
_b = this.props, store = _b.store, onSave = _b.onSave, primaryField = _b.primaryField, type = _b.type, cross = _b.cross, items = _b.items;
if (!onSave || !store.modifiedRows.length) {
return [2 /*return*/];
}
submitCount = localStorage.getItem('submitCount') || 0;
// 记录一下提交次数
localStorage.setItem('submitCount', +submitCount + 1 + '');
subForms = [];
Object.keys(this.subForms).forEach(function (key) {
return _this.subForms[key] &&
store.modifiedRows.find(function (item) { var _a; return ((_a = item.index) === null || _a === void 0 ? void 0 : _a.toString()) === key.split('-')[1]; }) &&
subForms.push(_this.subForms[key]);
});
if (!subForms.length) return [3 /*break*/, 2];
return [4 /*yield*/, Promise.all(subForms.map(function (item) {
return item.validate();
}))];
case 1:
result = _c.sent();
falseResltIdx = result.findIndex(function (bool, index) { return bool === false; });
// 如果发现第一个不符合结果的表格项目-滚动到屏幕正中央
// if (~falseResltIdx && subForms[falseResltIdx]?.contentRef?.current) {
// (subForms[falseResltIdx]?.contentRef?.current as HTMLElement).scrollIntoView({ behavior: 'smooth', block: 'center', inline: 'center' })
// return;
// }
if (~falseResltIdx)
return [2 /*return*/];
_c.label = 2;
case 2:
rowIndexes = [];
diff = [];
resultArray = [];
orginArr = [];
_loop_1 = function (index) {
var item = store.modifiedRows[index];
var newObj = void 0;
var originItemIndex = -1;
var originItem = (0, helper_1.findTree)(store.data.itemsRaw, function (_) {
// 每次遍历都+1 找到了就返回
originItemIndex++;
return _[crud_1.DATAKEYID] === item[crud_1.DATAKEYID];
});
if (!originItem)
return { value: void 0 };
newObj = this_1.compareObjects(item, originItem);
// 修改值数组
resultArray.push(newObj);
// 变化值 id 变化项 数组
diff.push({ changeItemKey: originItem === null || originItem === void 0 ? void 0 : originItem[crud_1.DATAKEYID], diff: (0, helper_1.difference)(item, originItem, ['id', primaryField].concat((_a = cross === null || cross === void 0 ? void 0 : cross.rowFields.map(function (field) { return field.name; })) !== null && _a !== void 0 ? _a : [])) });
// 修改的原始数组
orginArr.push(originItem);
// index值数组
rowIndexes.push(originItemIndex + '');
};
this_1 = this;
for (index in store.modifiedRows) {
state_1 = _loop_1(index);
if (typeof state_1 === "object")
return [2 /*return*/, state_1.value];
}
rows = type === 'cross' ? (0, cross_1.getChangeRows)(diff.map(function (item) { return item.diff; }), items, cross) : resultArray;
unModifiedRows = store.rows
.filter(function (item) { return !item.modified; })
.map(function (item) { return item.data; });
// 全部保存了在隐藏
sub_1.EventSub.emit(sub_1.EventEnum.ClearVistiMap);
onSave(rows, diff, rowIndexes, unModifiedRows, store.modifiedRows.map(function (item) { return item.pristine; }), false, true);
return [2 /*return*/];
}
});
});
};
Table.prototype.compareObjects = function (obj1, obj2) {
var newObj = {};
Object.entries(obj2).forEach(function (_a) {
var key = _a[0], value = _a[1];
if (typeof obj1[key] === "object" && typeof value === "object") {
if (!(0, isEqual_1.default)(obj1[key], value)) {
newObj[key] = obj1[key];
newObj["OLD_".concat(key)] = value;
}
else
newObj[key] = obj1[key];
}
else if (obj1[key] !== obj2[key]) {
newObj[key] = obj1[key];
newObj["OLD_".concat(key)] = value;
}
else {
newObj[key] = obj1[key];
}
});
if (typeof newObj === "object" && Object.keys(newObj).length === 0) {
return null;
}
return newObj;
};
Table.prototype.handleSaveOrder = function () {
var _a = this.props, store = _a.store, onSaveOrder = _a.onSaveOrder;
if (!onSaveOrder || !store.movedRows.length) {
return;
}
onSaveOrder(store.movedRows.map(function (item) { return item.data; }), store.rows.map(function (item) { return item.getDataWithModifiedChilden(); }));
};
Table.prototype.syncSelected = function () {
var _a = this.props, store = _a.store, onSelect = _a.onSelect;
if (onSelect) {
onSelect(store.selectedRows.map(function (item) { return item.data; }), store.unSelectedRows.map(function (item) { return item.data; }));
}
};
Table.prototype.reset = function () {
var _this = this;
var store = this.props.store;
store.reset();
sub_1.EventSub.emit(sub_1.EventEnum.ClearVistiMap);
var subForms = [];
Object.keys(this.subForms).forEach(function (key) { return _this.subForms[key] && subForms.push(_this.subForms[key]); });
subForms.forEach(function (item) { return item.clearErrors(); });
};
Table.prototype.bulkUpdate = function (value, items) {
var _a = this.props, store = _a.store, primaryField = _a.primaryField;
if (primaryField && value.ids) {
var ids_1 = value.ids.split(',');
var rows = store.rows.filter(function (item) {
return (0, find_1.default)(ids_1, function (id) { return id && id == item.data[primaryField]; });
});
var newValue_1 = tslib_1.__assign(tslib_1.__assign({}, value), { ids: undefined });
rows.forEach(function (row) { return row.change(newValue_1); });
}
else {
var rows = store.rows.filter(function (item) { return ~items.indexOf(item.pristine); });
rows.forEach(function (row) { return row.change(value); });
}
};
Table.prototype.getSelected = function () {
var store = this.props.store;
return store.selectedRows.map(function (item) { return item.data; });
};
Table.prototype.affixDetect = function () {
var _a, _b, _c, _d;
var _e = this.props.autoFillHeight, autoFillHeight = _e === void 0 ? true : _e;
if (!this.props.affixHeader || !this.table || autoFillHeight) {
return;
}
var ns = this.props.classPrefix;
var dom = (0, react_dom_1.findDOMNode)(this);
var clip = this.table.getBoundingClientRect();
var offsetY = (_b = (_a = this.props.affixOffsetTop) !== null && _a !== void 0 ? _a : this.props.env.affixOffsetTop) !== null && _b !== void 0 ? _b : 0;
var headingHeight = ((_c = dom.querySelector(".".concat(ns, "Table-heading"))) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect().height) || 0;
var headerHeight = ((_d = dom.querySelector(".".concat(ns, "Table-headToolbar"))) === null || _d === void 0 ? void 0 : _d.getBoundingClientRect().height) || 0;
var affixed = clip.top - headerHeight - headingHeight < offsetY &&
clip.top + clip.height - 40 > offsetY;
// const affixedDom = dom.querySelector(`.${ns}Table-fixedTop`) as HTMLElement;
// affixedDom.style.cssText += `top: ${offsetY}px;width: ${(this.table.parentNode as HTMLElement).offsetWidth
// }px`;
// affixed
// ? affixedDom.classList.add('in')
// : affixedDom.classList.remove('in');
// store.markHeaderAffix(clip.top < offsetY && (clip.top + clip.height - 40) > offsetY);
};
Table.prototype.updateTableInfo = function () {
var _a, _b;
if (!this.table) {
return;
}
var table = this.table;
var outter = table.parentNode;
//处理横屏后ios的样式兼容性问题
if (tools_1.tools.isIOS) {
var sensor = outter.querySelector('.resize-sensor');
if (this.props.tableRotate) {
sensor.style.width = table.clientWidth + 'px';
sensor.style.height = table.clientHeight + 'px';
}
else {
sensor.style.width = 'auto';
sensor.style.height = 'auto';
}
}
var ns = this.props.classPrefix;
// 完成宽高都没有变化就直接跳过了。
// if (this.totalWidth === table.scrollWidth && this.totalHeight === table.scrollHeight) {
// return;
// }
this.totalWidth = table.scrollWidth;
this.totalHeight = table.scrollHeight;
this.outterWidth = outter.offsetWidth;
this.outterHeight = outter.offsetHeight;
var widths = (this.widths = {});
var widths2 = (this.widths2 = {});
var heights = (this.heights = {});
// heights.header = table
// .querySelector('thead>tr:last-child')!
// .getBoundingClientRect().height;
// heights.header2 = table
// .querySelector('thead>tr:first-child')!
// .getBoundingClientRect().height;
// Aug
heights.header =
((_a = table.querySelector('thead>tr:last-child')) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().height) || 0;
heights.header2 =
((_b = table.querySelector('thead>tr:first-child')) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().height) || 0;
(0, forEach_1.default)(table.querySelectorAll('thead>tr:last-child>th'), function (item) {
widths[item.getAttribute('data-index')] =
item.getBoundingClientRect().width;
});
(0, forEach_1.default)(table.querySelectorAll('thead>tr:first-child>th'), function (item) {
widths2[item.getAttribute('data-index')] =
item.getBoundingClientRect().width;
});
(0, forEach_1.default)(table.querySelectorAll('tbody>tr>*:last-child'), function (item, index) {
return (heights[index] = item.getBoundingClientRect().height);
});
// 让 react 去更新非常慢，还是手动更新吧。
var dom = (0, react_dom_1.findDOMNode)(this);
(0, forEach_1.default)(
// 折叠 footTable 不需要改变
dom.querySelectorAll(".".concat(ns, "Table-fixedLeft>table, .").concat(ns, "Table-fixedRight>table")), function (table) {
var totalWidth = 0;
var totalWidth2 = 0;
(0, forEach_1.default)(table.querySelectorAll('thead>tr:last-child>th'), function (item) {
var width = widths[item.getAttribute('data-index')];
item.style.cssText += "width: ".concat(width, "px; height: ").concat(heights.header, "px");
totalWidth += width;
});
(0, forEach_1.default)(table.querySelectorAll('thead>tr:first-child>th'), function (item) {
var width = widths2[item.getAttribute('data-index')];
item.style.cssText += "width: ".concat(width, "px; height: ").concat(heights.header2, "px");
totalWidth2 += width;
});
(0, forEach_1.default)(table.querySelectorAll('colgroup>col'), function (item) {
var width = widths[item.getAttribute('data-index')];
item.setAttribute('width', "".concat(width));
});
(0, forEach_1.default)(table.querySelectorAll('tbody>tr'), function (item, index) {
item.style.cssText += "height: ".concat(heights[index], "px");
});
table.style.cssText += "width: ".concat(Math.max(totalWidth, totalWidth2), "px;table-layout: auto;");
});
this.lastScrollLeft = -1;
this.handleOutterScroll();
};
Table.prototype.handleOutterScroll = function () {
var _a, _b, _c, _d, _e;
var outter = this.table.parentNode;
//安卓机横屏后操作颠倒
if (this.props.tableRotate && tools_1.tools.isAndroid && index_1.Shell.hasShell()) {
var scrollTop = outter.scrollTop;
if (this.btnDragging)
return;
if (scrollTop === this.lastScrollTop)
return;
this.lastScrollLeft = scrollTop;
var table = this.affixedTable;
if (table) {
table.style.cssText += "transform: translateX(-".concat(scrollTop, "px)");
}
}
else {
var scrollLeft = outter.scrollLeft;
if (this.btnDragging)
return;
if (scrollLeft === this.lastScrollLeft)
return;
this.lastScrollLeft = scrollLeft;
var leading = scrollLeft === 0;
var trailing = Math.ceil(scrollLeft) + this.outterWidth >= this.totalWidth;
var ns = this.props.classPrefix;
var dom = (0, react_dom_1.findDOMNode)(this);
var fixedLeft = dom.querySelectorAll(".".concat(ns, "Table-fixedLeft"));
if (fixedLeft && fixedLeft.length) {
for (var i = 0, len = fixedLeft.length; i < len; i++) {
var node = fixedLeft[i];
leading ? node.classList.remove('in') : node.classList.add('in');
}
}
var fixedRight = dom.querySelectorAll(".".concat(ns, "Table-fixedRight"));
if (fixedRight && fixedRight.length) {
for (var i = 0, len = fixedRight.length; i < len; i++) {
var node = fixedRight[i];
trailing ? node.classList.remove('in') : node.classList.add('in');
}
}
var table = this.affixedTable;
if (table) {
table.style.cssText += "transform: translateX(-".concat(scrollLeft, "px)");
}
// Jay
var store = this.props.store;
var leftFixedColumns = store.leftFixedColumns;
var lastLeftFixedIndex = (_a = leftFixedColumns[leftFixedColumns.length - 1]) === null || _a === void 0 ? void 0 : _a.index;
// 给table添加类名
var fixedLeftLastEl = dom.querySelector('.fixed-left-last');
if (fixedLeftLastEl) {
var fixedLeftLastElRelativeLeft = fixedLeftLastEl.getBoundingClientRect().left -
dom.getBoundingClientRect().left;
if (leading ||
(fixedLeftLastElRelativeLeft > store.stickyWidths[lastLeftFixedIndex])) {
dom.classList.remove('fix-left');
}
else if (fixedLeftLastElRelativeLeft <= store.stickyWidths[lastLeftFixedIndex]) {
// 左边要固定的列相对于表格的水平距离小于等于其 sticky left
dom.classList.add('fix-left');
}
}
if (trailing) {
dom.classList.remove('fix-right');
}
else {
dom.classList.add('fix-right');
}
var isNaN_1 = false;
var rightFixedColumns = (0, cloneDeep_1.default)(store.rightFixedColumns);
var rightFixedColumnsReverse = rightFixedColumns === null || rightFixedColumns === void 0 ? void 0 : rightFixedColumns.reverse();
var columnWidths_1 = {};
(_b = this.table) === null || _b === void 0 ? void 0 : _b.querySelectorAll('thead>tr:nth-child(1)>th').forEach(function (item) {
columnWidths_1[item.getAttribute('data-index')] =
item.clientWidth;
});
(_c = this.table) === null || _c === void 0 ? void 0 : _c.querySelectorAll('thead>tr:nth-child(2)>th').forEach(function (item) {
columnWidths_1[item.getAttribute('data-index')] =
item.clientWidth;
});
var stickyWidths_1 = {};
if ((_d = leftFixedColumns[0]) === null || _d === void 0 ? void 0 : _d.index) {
stickyWidths_1["".concat(leftFixedColumns[0].index)] =
columnWidths_1["".concat(leftFixedColumns[0].index)];
}
if ((_e = rightFixedColumnsReverse === null || rightFixedColumnsReverse === void 0 ? void 0 : rightFixedColumnsReverse[0]) === null || _e === void 0 ? void 0 : _e.index) {
stickyWidths_1["".concat(rightFixedColumnsReverse[0].index)] =
columnWidths_1["".concat(rightFixedColumns[0].index)];
}
leftFixedColumns === null || leftFixedColumns === void 0 ? void 0 : leftFixedColumns.reduce(function (acc, cv, ci, arr) {
var a = acc;
if (ci !== 0) {
a = acc + columnWidths_1[arr[ci - 1].index];
}
a !== a && (isNaN_1 = true);
stickyWidths_1["".concat(cv.index)] = a;
return a;
}, 0);
rightFixedColumnsReverse === null || rightFixedColumnsReverse === void 0 ? void 0 : rightFixedColumnsReverse.reduce(function (acc, cv, ci, arr) {
var a = acc;
if (ci !== 0) {
a = acc + columnWidths_1[arr[ci - 1].index];
}
a !== a && (isNaN_1 = true);
stickyWidths_1["".concat(cv.index)] = a;
return a;
}, -2);
var equal = (0, isEqual_1.default)(stickyWidths_1, store.stickyWidths);
// 避免重复render组件，提高性能
if (!isNaN_1 && !equal) {
store.setStickyWidths(stickyWidths_1);
}
}
};
Table.prototype.tableRef = function (ref) {
this.table = ref;
if (ref) {
this.unSensor = (0, resize_sensor_1.resizeSensor)(ref.parentNode, this.updateTableInfoLazy);
}
else {
this.unSensor && this.unSensor();
delete this.unSensor;
}
};
Table.prototype.dragTipRef = function (ref) {
if (!this.dragTip && ref) {
this.initDragging();
}
else if (this.dragTip && !ref) {
this.destroyDragging();
}
this.dragTip = ref;
};
Table.prototype.affixedTableRef = function (ref) {
this.affixedTable = ref;
};
Table.prototype.initDragging = function () {
var store = this.props.store;
var ns = this.props.classPrefix;
this.sortable = new sortablejs_1.default(this.table.querySelector('tbody'), {
group: 'table',
animation: 150,
handle: ".".concat(ns, "Table-dragCell"),
filter: ".".concat(ns, "Table-dragCell.is-dragDisabled"),
ghostClass: 'is-dragging',
onEnd: function (e) {
// 没有移动
if (e.newIndex === e.oldIndex) {
return;
}
var parent = e.to;
if (e.oldIndex < parent.childNodes.length - 1) {
parent.insertBefore(e.item, parent.childNodes[e.oldIndex]);
}
else {
parent.appendChild(e.item);
}
store.exchange(e.oldIndex, e.newIndex);
}
});
};
Table.prototype.destroyDragging = function () {
this.sortable && this.sortable.destroy();
};
Table.prototype.getPopOverContainer = function () {
return (0, react_dom_1.findDOMNode)(this);
};
Table.prototype.handleMouseMove = function (e) {
var tr = e.target.closest('tr[data-id]');
if (!tr) {
return;
}
var _a = this.props, store = _a.store, affixColumns = _a.affixColumns, itemActions = _a.itemActions;
if ((affixColumns === false ||
(store.leftFixedColumns.length === 0 &&
store.rightFixedColumns.length === 0)) &&
(!itemActions || !itemActions.filter(function (item) { return !item.hiddenOnHover; }).length)) {
return;
}
var id = tr.getAttribute('data-id');
var row = store.hoverRow;
if ((row === null || row === void 0 ? void 0 : row.id) === id) {
return;
}
(0, helper_1.eachTree)(store.rows, function (item) { return item.setIsHover(item.id === id); });
};
Table.prototype.handleMouseLeave = function () {
var store = this.props.store;
var row = store.hoverRow;
row === null || row === void 0 ? void 0 : row.setIsHover(false);
};
// Jay
Table.prototype.handleColumnToggle = function (columns, saveCols, canFetch, targetTemp, needDebounce //开启防抖
) {
var _a = this.props, store = _a.store, saveColApi = _a.saveColApi, crudName = _a.crudName;
if (canFetch && saveColApi && crudName) {
needDebounce ? this.debounceSendColumns(saveCols, targetTemp, true) : this.sendColumns(saveCols, targetTemp);
}
if (columns) {
this.sortCols = columns.map(function (col) { return col.pristine; });
store.updateColumnsInfo((0, lodash_1.clone)(saveCols));
store.updateColumns(columns);
}
};
Table.prototype.renderAutoFilterForm = function () {
var _a = this.props, render = _a.render, store = _a.store, onSearchableFromReset = _a.onSearchableFromReset, onSearchableFromSubmit = _a.onSearchableFromSubmit, onSearchableFromInit = _a.onSearchableFromInit, cx = _a.classnames, __ = _a.translate;
var searchableColumns = store.searchableColumns;
var activedSearchableColumns = store.activedSearchableColumns;
if (!searchableColumns.length) {
return null;
}
var groupedSearchableColumns = [
{ body: [], md: 4 },
{ body: [], md: 4 },
{ body: [], md: 4 }
];
activedSearchableColumns.forEach(function (column, index) {
var _a, _b, _c, _d;
groupedSearchableColumns[index % 3].body.push(tslib_1.__assign(tslib_1.__assign({}, column.searchable), { name: (_b = (_a = column.searchable) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : column.name, label: (_d = (_c = column.searchable) === null || _c === void 0 ? void 0 : _c.label) !== null && _d !== void 0 ? _d : column.label, mode: 'horizontal' }));
});
return render('searchable-form', {
type: 'form',
api: null,
title: '',
mode: 'normal',
submitText: __('search'),
body: [
{
type: 'grid',
columns: groupedSearchableColumns
}
],
actions: [
{
type: 'dropdown-button',
label: __('Table.searchFields'),
className: cx('Table-searchableForm-dropdown', 'mr-2'),
level: 'link',
trigger: 'click',
size: 'sm',
align: 'right',
buttons: searchableColumns.map(function (column) {
var _a, _b, _c, _d;
return {
type: 'checkbox',
className: cx('Table-searchableForm-checkbox'),
name: "__search_".concat((_b = (_a = column.searchable) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : column.name),
option: (_d = (_c = column.searchable) === null || _c === void 0 ? void 0 : _c.label) !== null && _d !== void 0 ? _d : column.label,
value: column.enableSearch,
badge: {
offset: [-10, 5],
visibleOn: "".concat(column.toggable && !column.toggled && column.enableSearch)
},
onChange: function (value) {
column.setEnableSearch(value);
}
};
})
},
{
type: 'submit',
label: __('search'),
level: 'primary',
className: 'w-18'
},
{
type: 'reset',
label: __('reset'),
className: 'w-18'
}
]
}, {
key: 'searchable-form',
panelClassName: cx('Table-searchableForm'),
actionsClassName: cx('Table-searchableForm-footer'),
onReset: onSearchableFromReset,
onSubmit: onSearchableFromSubmit,
onInit: onSearchableFromInit,
formStore: undefined
});
};
Table.prototype.renderHeading = function () {
var _a = this.props, title = _a.title, store = _a.store, hideQuickSaveBtn = _a.hideQuickSaveBtn, data = _a.data, cx = _a.classnames, saveImmediately = _a.saveImmediately, headingClassName = _a.headingClassName, quickSaveApi = _a.quickSaveApi, __ = _a.translate;
if (title ||
(quickSaveApi &&
!saveImmediately &&
store.modified &&
!hideQuickSaveBtn) ||
store.moved) {
return (react_1.default.createElement("div", { className: cx('Table-heading', headingClassName), key: "heading" }, !saveImmediately && store.modified && !hideQuickSaveBtn ? (react_1.default.createElement("span", null,
__('Table.modified', {
modified: store.modified
}),
react_1.default.createElement("button", { type: "button", className: cx('Button Button--xs Button--success m-l-sm'), onClick: this.handleSave },
react_1.default.createElement(icons_1.Icon, { icon: "check", className: "icon m-r-xs" }),
__('Form.submit')),
react_1.default.createElement("button", { type: "button", className: cx('Button Button--xs Button--danger m-l-sm'), onClick: this.reset },
react_1.default.createElement(icons_1.Icon, { icon: "close", className: "icon m-r-xs" }),
__('Table.discard')))) : store.moved ? (react_1.default.createElement("span", null,
__('Table.moved', {
moved: store.moved
}),
react_1.default.createElement("button", { type: "button", className: cx('Button Button--xs Button--success m-l-sm'), onClick: this.handleSaveOrder },
react_1.default.createElement(icons_1.Icon, { icon: "check", className: "icon m-r-xs" }),
__('Form.submit')),
react_1.default.createElement("button", { type: "button", className: cx('Button Button--xs Button--danger m-l-sm'), onClick: this.reset },
react_1.default.createElement(icons_1.Icon, { icon: "close", className: "icon m-r-xs" }),
__('Table.discard')))) : title ? ((0, tpl_1.filter)(title, data)) : ('')));
}
return null;
};
Table.prototype.handleModleColumn = function () {
var _this = this;
var _a = this.props, store = _a.store, saveImmediately = _a.saveImmediately, hideQuickSaveBtn = _a.hideQuickSaveBtn, __ = _a.translate;
if (!saveImmediately && store.modified && !hideQuickSaveBtn) {
return new Promise(function (resolve) {
var modal = antd_1.Modal.confirm({
title: (react_1.default.createElement("div", null,
react_1.default.createElement("div", { style: { position: 'absolute', right: '10px', top: '14px', fontSize: '14px', cursor: "pointer", width: 14 }, onClick: function () { modal.destroy(); } },
react_1.default.createElement(icons_1.Icon, { icon: "close", className: "icon" })))),
content: __('Table.modified', {
modified: store.modified
}),
okText: '提交',
cancelText: "放弃",
maskClosable: false,
keyboard: false,
okButtonProps: { style: { borderRadius: 4 } },
cancelButtonProps: { style: { borderRadius: 4 } },
onOk: function () { return tslib_1.__awaiter(_this, void 0, void 0, function () { return tslib_1.__generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, this.handleSave()];
case 1:
_a.sent(), resolve(true);
return [2 /*return*/];
}
}); }); },
onCancel: function () { _this.reset, resolve(true); }
});
});
}
return Promise.resolve(true);
};
Table.prototype.handleMultiColumnSort = function (name, isMultiple, columnMapValue) {
var _a, _b, _c;
return tslib_1.__awaiter(this, void 0, void 0, function () {
var _d, store, markSort, loadDataOnce, orderColumns, current, value;
return tslib_1.__generator(this, function (_e) {
_d = this.props, store = _d.store, markSort = _d.markSort, loadDataOnce = _d.loadDataOnce;
markSort();
orderColumns = new Map();
if (isMultiple) {
// 复制排序
store.orderColumns.forEach(function (value, key) {
orderColumns.set(key, value);
});
if (orderColumns.has(name)) {
if (((_a = orderColumns.get(name)) === null || _a === void 0 ? void 0 : _a.order) === 'desc') {
orderColumns.delete(name);
}
else {
orderColumns.set(name, { order: 'desc', map: columnMapValue });
}
}
else {
orderColumns.set(name, { order: 'asc', map: columnMapValue });
}
//更新一个新的
}
else {
current = (_b = store.getOrderColumn(name)) === null || _b === void 0 ? void 0 : _b.order;
value = current ? (current === 'asc' ? 'desc' : null) : 'asc';
if (value) {
orderColumns.set(name, { order: value, map: columnMapValue });
}
}
store.update({ orderColumns: orderColumns });
(_c = store.handleMutilSort) === null || _c === void 0 ? void 0 : _c.call(store, loadDataOnce);
return [2 /*return*/];
});
});
};
Table.prototype.renderHeadCell = function (column, props) {
var _this = this;
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
var _0 = this.props, store = _0.store, query = _0.query, onQuery = _0.onQuery, multiple = _0.multiple, env = _0.env, render = _0.render, ns = _0.classPrefix, resizable = _0.resizable, cx = _0.classnames, autoGenerateFilter = _0.autoGenerateFilter, onBatchEdit = _0.onBatchEdit;
var style = props.style;
// const orderName = orders && Array.from(orders.keys()).pop() as string || undefined
// const orderColumn = orderName && orders.get(orderName)
// 获取文字计算长度-快速编辑的不用算
var textWidth = '';
textWidth = (_c = (_b = (_a = this.props.store) === null || _a === void 0 ? void 0 : _a.textWidhMap) === null || _b === void 0 ? void 0 : _b[column.pristine.name]) === null || _c === void 0 ? void 0 : _c.textWidth;
var leftFixedColumns = store.leftFixedColumns;
var lastLeftFixedIndex = (_d = leftFixedColumns[leftFixedColumns.length - 1]) === null || _d === void 0 ? void 0 : _d.index;
if (column.type === '__checkme') {
return (react_1.default.createElement(LionContextMenu_1.ContextMenu, { menuItems: [
{ id: 0, title: '全选' },
{ id: 1, title: '反选' },
{ id: 2, title: '不选' }
], onItemClick: function (index) { return multiple && _this.handleCheckAll(index); }, key: Date() },
react_1.default.createElement("th", tslib_1.__assign({}, props, { "column-name": '__checkme', style: tslib_1.__assign({ cursor: 'pointer', textAlign: 'center' }, style), className: cx(column.pristine.className, 'header-cell', {
'fixed-left-last': column.index === lastLeftFixedIndex,
}) + ' last-th', onClick: function () {
multiple && _this.handleCheckAll(3);
} }), store.rows.length && multiple ? (react_1.default.createElement(Checkbox_1.default, { classPrefix: ns, partial: !store.allChecked, checked: store.someChecked, disabled: store.disabledHeadCheckbox })) : (react_1.default.createElement("div", null, '\u00A0')))));
}
else if (column.type === '__dragme') {
return react_1.default.createElement("th", tslib_1.__assign({}, props, { className: cx(column.pristine.className, 'header-cell') + ' last-th' }));
}
else if (column.type === '__expandme') {
var expandRowsDepth = store.getExpandedRows().filter(function (row) { return row.expandable && row.expanded; }).map(function (row) { return row.depth; });
var maxDepth = expandRowsDepth.length > 0 ? Math.max.apply(Math, expandRowsDepth) + 1 : 1;
return (react_1.default.createElement("th", tslib_1.__assign({}, props, { style: tslib_1.__assign(tslib_1.__assign({}, props.style), { minWidth: maxDepth * 20 }), className: cx(column.pristine.className, 'header-cell') + ' last-th', colSpan: store.mobileUI ? 2 : undefined }), (store.footable &&
(store.footable.expandAll === false || store.footable.accordion)) ||
(store.expandConfig &&
(store.expandConfig.expandAll === false ||
store.expandConfig.accordion)) ? null : (react_1.default.createElement("a", { className: cx('Table-expandBtn', store.allExpanded ? 'is-active' : ''),
// data-tooltip="展开/收起全部"
// data-position="top"
onClick: store.toggleExpandAll },
react_1.default.createElement(icons_1.Icon, { icon: "right-arrow-bold", className: "icon" })))));
}
else if (column.type === '__pseudoColumn') {
return react_1.default.createElement("th", tslib_1.__assign({ "column-name": '__pseudoColumn' }, props, { style: tslib_1.__assign({ width: (this.props.store.rows.length + '').length * 8 }, props.style), className: cx(column.pristine.className, 'fixed-left-last', 'header-cell') + ' last-th' }));
}
var affix = [];
if (column.sortable && column.name) {
if (((_e = store.orderColumns) === null || _e === void 0 ? void 0 : _e.has(column.name)) && ['asc', 'desc'].includes(((_g = (_f = store.getOrderColumn) === null || _f === void 0 ? void 0 : _f.call(store, column.name)) === null || _g === void 0 ? void 0 : _g.order) || '')) {
affix.push(react_1.default.createElement("div", { className: cx('TableCell-sortBtn', ((_h = store.orderColumns) === null || _h === void 0 ? void 0 : _h.has(column.name)) && ['asc', 'desc'].includes(((_k = (_j = store.getOrderColumn) === null || _j === void 0 ? void 0 : _j.call(store, column.name)) === null || _k === void 0 ? void 0 : _k.order) || '') && 'show-sort') },
react_1.default.createElement(icons_2.CaretUpOutlined, { className: cx('TableCell-sortBtn--down', ((_l = store.orderColumns) === null || _l === void 0 ? void 0 : _l.has(column.name)) &&
((_o = (_m = store.getOrderColumn) === null || _m === void 0 ? void 0 : _m.call(store, column.name)) === null || _o === void 0 ? void 0 : _o.order) === 'asc' ? 'is-active' : '') }),
react_1.default.createElement(icons_2.CaretDownOutlined, { className: cx('TableCell-sortBtn--up', ((_p = store.orderColumns) === null || _p === void 0 ? void 0 : _p.has(column.name)) && ((_r = (_q = store.getOrderColumn) === null || _q === void 0 ? void 0 : _q.call(store, column.name)) === null || _r === void 0 ? void 0 : _r.order) === 'desc' ? 'is-active' : '') })));
}
}
var filterActive = false;
if (this.props.showColumnsFilter && column.sortable && column.name) {
var filterType_1 = (0, types_2.getColumnsFilterType)(column.type);
var columnName_1 = (_s = column.name) !== null && _s !== void 0 ? _s : column.label;
var isActive = store.filterColumns.has(columnName_1);
filterActive = isActive;
if (filterType_1) {
affix.push(react_1.default.createElement(HeadCellFilterDropdown_1.HeadCellFilterDropDown, tslib_1.__assign({}, this.props, { isActive: isActive, isShow: this.props.showColumnsFilter, filterType: filterType_1, defaultFilters: store.filterColumns.get(columnName_1), column: column, columnFileds: store.filteredColumns.filter(function (column) { return column.name && column.name != 'operation'; }).map(function (column) { return ({ label: (0, commonTableFunction_1.getColumnShowLabel)(column), name: column.name }); }), onConfirm: function (values, caseSensitive) {
var _a, _b;
var map = new Map(store.filterColumns.set(columnName_1, values.map(function (item) { return (tslib_1.__assign(tslib_1.__assign({}, item), { label: column.label, filterType: filterType_1, fieldName: columnName_1 })); })).entries());
store.update({ filterColumns: map });
var items = store.handleMutilSort(_this.props.loadDataOnce, caseSensitive);
if (_this.props.loadDataOnce)
_this.props.setTotal(items.length);
if (_this.props.itemAction) {
var ctx = (0, helper_1.createObject)(store.data, items[0] || {}, {}, true);
(_b = (_a = _this.props).onAction) === null || _b === void 0 ? void 0 : _b.call(_a, undefined, _this.props.itemAction, ctx);
}
}, onReset: function () {
var _a, _b;
store.filterColumns.delete(columnName_1);
var items = store.handleMutilSort(_this.props.loadDataOnce);
if (_this.props.loadDataOnce)
_this.props.setTotal(items.length);
if (_this.props.itemAction) {
var ctx = (0, helper_1.createObject)(store.data, items[0] || {}, {}, true);
(_b = (_a = _this.props).onAction) === null || _b === void 0 ? void 0 : _b.call(_a, undefined, _this.props.itemAction, ctx);
}
} })));
}
}
props.style = props.style || {};
// 快速编辑不处理
if (this.props.autoWidth) {
props.style.width = textWidth; // 直接使用width
}
if (column.pristine.width) {
props.style.width = column.pristine.width;
}
// 宽度顺序为 快速编辑宽度 编辑宽度 自动列宽宽度 原始宽度
if ((_u = (_t = column.pristine) === null || _t === void 0 ? void 0 : _t.quickEdit) === null || _u === void 0 ? void 0 : _u.width) {
props.style.width = (_v = column === null || column === void 0 ? void 0 : column.pristine.quickEdit) === null || _v === void 0 ? void 0 : _v.width;
}
if (column.pristine.editWidth) {
props.style.width = column.pristine.editWidth;
}
if (column.pristine.align) {
props.style = props.style || {};
props.style.textAlign = column.pristine.align;
}
var resizeLine = (react_1.default.createElement("div", { className: cx('Table-content-colDragLine'), key: "resize-".concat(column.index), onMouseDown: function (e) { return _this.handleColResizeMouseDown(e, column); } }));
var order = (_y = (_w = store.getOrderColumn) === null || _w === void 0 ? void 0 : _w.call(store, (_x = column.name) !== null && _x !== void 0 ? _x : '')) === null || _y === void 0 ? void 0 : _y.order;
var title = order === 'asc'
? '点击降序'
: order === 'desc'
? '点击取消排序'
: '点击升序';
var divStyle = tslib_1.__assign({}, props.style);
// 宽度处理
if (props.style.width && props.style.width > 4) {
divStyle.width = props.style.width - 4;
}
var headAlign = {
left: 'flex-start',
center: 'center',
right: 'flex-end',
};
var tableTh = (react_1.default.createElement("div", { className: cx("".concat(ns, "TableCell--title"), column.pristine.className, column.pristine.labelClassName, { ellipsis: column.pristine.ellipsis }), onDoubleClick: function () {
_this.props.store.rows.map(function (_) { return _.data; });
}, style: {
width: "calc( 100% - ".concat(affix.length * 16, "px)"), justifyContent: headAlign[(_z = column.pristine) === null || _z === void 0 ? void 0 : _z.align] || 'flex-start'
}, draggable: true, onDragStart: this.onHeaderDragStart, onContextMenu: function (e) { return e.preventDefault(); } },
column.label ? render('tpl', this.props.isSqlData ? (this.state.fieldTranslate ? column.label : column.name) : column.label) : null,
column.remark
? render('remark', {
type: 'remark',
tooltip: column.remark,
container: env === null || env === void 0 ? void 0 : env.getTopModalContainer
})
: null,
column.pristine.batchEdit ? (react_1.default.createElement(HeadCellBatchEditDropdown_1.HeadCellBatchEditDropdown, tslib_1.__assign({}, this.props, { onBatchEdit: onBatchEdit, name: column.name, batchEdit: column.pristine.batchEdit, popOverContainer: this.getPopOverContainer }))) : null));
return (react_1.default.createElement("th", tslib_1.__assign({}, props, { onClick: function (e) {
if (_this.onDraging)
return; // 拖动中直接返回
if (column.sortable && column.name) {
_this.handleMultiColumnSort(column.name, e.ctrlKey, column.map);
}
}, "table-name": this.props.name, "column-name": column.name, title: title, className: cx(props ? props.className : '', {
'TableCell--sortable': column.sortable,
'TableCell--searchable': column.searchable,
'TableCell--filterable': column.sortable && column.name,
'Table-operationCell': column.type === 'operation',
'TableCell-dragglable': column.type !== 'operation',
}, 'header-cell'), style: tslib_1.__assign(tslib_1.__assign({}, props.style), { cursor: 'pointer', padding: this.props.autoWidth ? '0px 2px' : undefined }) }),
react_1.default.createElement("div", { className: cx('Table-head-container', filterActive && 'show-filter'), style: divStyle },
tableTh,
affix.length > 0 && react_1.default.createElement("div", { className: cx('Table-head-affix'), style: { width: affix.length * 16 } }, affix)),
resizable === false ? null : resizeLine));
};
Table.prototype.renderCell = function (region, column, item, props, ignoreDrag) {
var _this = this;
var _a, _b, _c, _d, _e, _f, _g;
if (ignoreDrag === void 0) { ignoreDrag = false; }
var _h = this.props, render = _h.render, store = _h.store, multiple = _h.multiple, ns = _h.classPrefix, cx = _h.classnames, checkOnItemClick = _h.checkOnItemClick, popOverContainer = _h.popOverContainer, canAccessSuperData = _h.canAccessSuperData, itemBadge = _h.itemBadge, __ = _h.translate, tableRotate = _h.tableRotate, setBorder = _h.setBorder, cross = _h.cross;
if (column.name && props.itemRowSpans[column.name] === 0) {
return null;
}
// Jay
var _j = this.props, rowClassName = _j.rowClassName, rowClassNameExpr = _j.rowClassNameExpr;
var stickyWidths = store.stickyWidths;
var leftFixedColumns = store.leftFixedColumns;
var lastLeftFixedIndex = (_a = leftFixedColumns[leftFixedColumns.length - 1]) === null || _a === void 0 ? void 0 : _a.index;
var rightFixedColumns = store.rightFixedColumns;
var firstRightFixedIndex = (_b = rightFixedColumns[0]) === null || _b === void 0 ? void 0 : _b.index;
var style = {};
if (column.fixed) {
style.position = 'sticky';
column.fixed === 'left' && (style.left = stickyWidths === null || stickyWidths === void 0 ? void 0 : stickyWidths["".concat(column.index)]);
column.fixed === 'right' &&
(style.right = stickyWidths === null || stickyWidths === void 0 ? void 0 : stickyWidths["".concat(column.index)]);
style.zIndex = 1;
style.boxShadow = setBorder ? '1px 0px #f0f0f0' : '';
}
if (column.type === '__checkme') {
return (react_1.default.createElement("td", { key: props.key,
// onContextMenu={e => {
// e.preventDefault();
// this.setState({ position: [0, ''] });
// }}
onClick: checkOnItemClick ? helper_1.noop : this.handleCheck.bind(this, item), className: cx(column.pristine.className,
// Jay
rowClassNameExpr
? (0, tpl_1.filter)(rowClassNameExpr, item.data)
: rowClassName, setBorder ? 'td-border' : '', {
'fixed-left-last': column.index === lastLeftFixedIndex,
'fixed-right-first': column.index === firstRightFixedIndex
}), style: tslib_1.__assign(tslib_1.__assign({}, style), { cursor: 'pointer', width: '27px' }) },
react_1.default.createElement(Checkbox_1.default, { classPrefix: ns, type: multiple ? 'checkbox' : 'radio', checked: item.checked, disabled: !item.checkable })));
}
else if (column.type === '__dragme') {
return (react_1.default.createElement("td", { key: props.key, className: cx(column.pristine.className,
// Jay
rowClassNameExpr
? (0, tpl_1.filter)(rowClassNameExpr, item.data)
: rowClassName, {
'fixed-left-last': column.index === lastLeftFixedIndex
}), style: style }, item.draggable ? react_1.default.createElement(icons_1.Icon, { icon: "drag-bar", className: "icon" }) : null));
}
else if (column.type === '__expandme') {
return (react_1.default.createElement("td", { key: props.key, className: cx(column.pristine.className,
// Jay
rowClassNameExpr
? (0, tpl_1.filter)(rowClassNameExpr, item.data)
: rowClassName, {
'fixed-left-last': column.index === lastLeftFixedIndex
}), style: style,
//Aug
colSpan: store.mobileUI ? 2 : 1 },
item.depth > 2
? Array.from({ length: item.depth - 2 }).map(function (_, index) { return (react_1.default.createElement("i", { key: index, className: cx('Table-divider-' + (index + 1)) })); })
: null,
item.expandable ? (
// Aug 加入mobileUi
!store.mobileUI || this.state.tableMode == 'horizontal' ? (react_1.default.createElement("a", { className: cx('Table-expandBtn', item.expanded ? 'is-active' : ''),
// data-tooltip="展开/收起"
// data-position="top"
onClick: function () {
item.toggleExpanded();
_this.updateTableInfo();
} },
react_1.default.createElement(icons_1.Icon, { icon: "right-arrow-bold", className: "icon" }))) : (react_1.default.createElement("a", { className: cx(''), onClick: item.toggleExpanded }, item.expanded ? __('PutAway') : __('More')))) : react_1.default.createElement("a", { style: { color: '#756756', cursor: 'unset' }, className: cx('Table-expandBtn') },
react_1.default.createElement(icons_1.Icon, { icon: "right-arrow-bold", className: "icon" }))));
}
else if (column.type === '__pseudoColumn') {
return react_1.default.createElement("td", { key: props.key, style: tslib_1.__assign(tslib_1.__assign({}, props.style), { textAlign: 'center' }), className: cx(column.pristine.className, rowClassNameExpr
? (0, tpl_1.filter)(rowClassNameExpr, item.data)
: rowClassName, setBorder ? 'td-border' : '', 'fixed-left-last') },
react_1.default.createElement("div", { style: { display: 'flex', width: (this.props.store.rows.length + '').length * 8, alignItems: 'center', justifyContent: 'center' } }, props.rowIndex + 1));
}
var prefixContent = props.prefixContent;
if (!ignoreDrag &&
column.isPrimary &&
store.isNested &&
store.draggable &&
item.draggable) {
prefixContent = (react_1.default.createElement("a", { draggable: true, onDragStart: this.handleDragStart, className: cx('Table-dragBtn') },
react_1.default.createElement(icons_1.Icon, { icon: "drag-bar", className: "icon" })));
}
// Jay
// 对于input-table-dynamic组件的原始数据做判断
// 禁用
var $path = this.props.$path;
var isInputTableDynamic = /(input-table-dynamic)/.test($path);
var isOrigin = item.pristine.isOrigin && isInputTableDynamic;
//分组时由于value都是undefined，所以不会更新
var groupValue = {};
if ((_c = column.pristine.group) === null || _c === void 0 ? void 0 : _c.length) {
column.pristine.group.forEach(function (ele) {
var _a;
groupValue = tslib_1.__assign(tslib_1.__assign({}, groupValue), (_a = {}, _a[ele.name] = item.locals[ele.name], _a));
});
}
var subProps = tslib_1.__assign(tslib_1.__assign({}, props), { className: this.state.activeRow === props.rowIndex && this.state.activeCol === column.name ? (props.classNam || '') + ' active-cell' : (props.className || ''), btnDisabled: store.dragging, data: item.locals, value: ((_d = column.pristine.group) === null || _d === void 0 ? void 0 : _d.length) ? groupValue :
column.name
? (0, tpl_builtin_1.resolveVariable)(column.name, canAccessSuperData ? item.locals : item.data) : column.value, popOverContainer: popOverContainer || this.getPopOverContainer, rowSpan: props.itemRowSpans[column.name], quickEditFormRef: this.subFormRef, prefixContent: prefixContent, onImageEnlarge: this.handleImageEnlarge, canAccessSuperData: canAccessSuperData, row: item, inputFocusShowPicker: false, crudColumn: column.type == 'mapping' ? column : undefined, itemBadge: itemBadge, showBadge: !props.isHead &&
itemBadge &&
store.firstToggledColumnIndex === props.colIndex,
// Jay
disabled: isOrigin,
// showContextMenu: this.showContextMenu,
isTableContent: true, crossValueFields: cross === null || cross === void 0 ? void 0 : cross.valueFields });
delete subProps.label;
var foldColumns = this.props.foldColumns;
if (column.type === 'operation') {
var fold = foldColumns === null || foldColumns === void 0 ? void 0 : foldColumns.includes('scale' + column.name);
return render(region, tslib_1.__assign(tslib_1.__assign({}, column.pristine), { column: column.pristine, type: 'cell', fold: fold }), tslib_1.__assign(tslib_1.__assign({}, subProps), { fold: fold, tableRotate: tableRotate }));
}
var firstColumn = (_g = (_f = (_e = this.props) === null || _e === void 0 ? void 0 : _e.columns) === null || _f === void 0 ? void 0 : _f.filter(function (col) { return col.name && !col.name.includes('__'); })) === null || _g === void 0 ? void 0 : _g[0];
prefixContent == prefixContent || ((firstColumn === null || firstColumn === void 0 ? void 0 : firstColumn.name) === column.name && store.rows.some(function (rowItem) { var _a; return (_a = rowItem.children) === null || _a === void 0 ? void 0 : _a.length; }) ?
react_1.default.createElement("span", { className: 'expand-tag', onClick: function () {
item.toggleExpanded();
_this.updateTableInfo();
} }, item.expandable ? (item.expanded ? react_1.default.createElement(icons_2.MinusSquareOutlined, null) : react_1.default.createElement(icons_2.PlusSquareOutlined, null)) : react_1.default.createElement(icons_2.PlusSquareOutlined, { style: { opacity: 0 } })) : null);
if (column.type === 'mapping' && !column.pristine.quickEdit)
return render(region, tslib_1.__assign(tslib_1.__assign({}, column.pristine), { column: column.pristine, type: 'simple-table-cell' }), tslib_1.__assign(tslib_1.__assign({}, subProps), { prefixContent: prefixContent, classNames: subProps.className + (firstColumn === null || firstColumn === void 0 ? void 0 : firstColumn.name) === column.name ? ' expand-cell' : '' }));
return render(region, tslib_1.__assign(tslib_1.__assign({}, column.pristine), { column: column.pristine, type: 'cell' }), tslib_1.__assign(tslib_1.__assign({}, subProps), { prefixContent: prefixContent, classNames: subProps.className + (firstColumn === null || firstColumn === void 0 ? void 0 : firstColumn.name) === column.name ? ' expand-cell' : '' }));
};
// showContextMenu = (rowIndex: number, colName: string) => {
// const visible = (colName != undefined && colName != 'operation')
// tableCtxMenuStore.updatePosition([rowIndex, colName])
// tableCtxMenuStore.onContextMenuVisibleChange(visible);
// // this.setState({ position: [rowIndex, colName], contextMenuVisible: visible });
// }
Table.prototype.renderToolbar = function (toolbar) {
var type = (toolbar === null || toolbar === void 0 ? void 0 : toolbar.type) || toolbar;
if (type === 'find-replace') {
this.renderedToolbars.push(type);
return this.renderFindReplace(toolbar);
}
else if (type === 'data-statics') {
this.renderedToolbars.push(type);
return this.renderDataStatic(toolbar);
}
else if (type === 'data-analysis') {
this.renderedToolbars.push(type);
return this.renderDataABC(toolbar);
}
else if (type === 'data-cross') {
this.renderedToolbars.push(type);
return this.renderDataCross(toolbar);
}
else if (type === 'columns-toggler') {
this.renderedToolbars.push(type);
return this.renderColumnsToggler(toolbar);
}
else if (type === 'detail-model') {
this.renderedToolbars.push(type);
return this.renderDetailModelToggler(toolbar);
}
else if (type === 'drag-toggler') {
this.renderedToolbars.push(type);
return this.renderDragToggler();
}
else if (type === 'export-excel') {
this.renderedToolbars.push(type);
return this.renderExportExcel(toolbar);
}
else if (type === 'check-all') {
//Aug
this.renderedToolbars.push(type);
return this.renderCheckAll();
}
else if (type === 'field-translate') {
this.renderedToolbars.push(type);
return this.renderFieldTranslate(toolbar);
}
else if (type === "data-chart") {
this.renderedToolbars.push(type);
return this.renderDataCharts(toolbar);
}
else if (type === 'sql-optimize') {
this.renderedToolbars.push(type);
return this.renderSqlOptimize(toolbar);
}
return void 0;
};
// Aug
Table.prototype.renderCheckAll = function () {
var _this = this;
var _a = this.props, store = _a.store, multiple = _a.multiple, selectable = _a.selectable, cx = _a.classnames, ns = _a.classPrefix, __ = _a.translate;
if (!store.selectable ||
!multiple ||
!selectable ||
store.dragging ||
!store.rows.length) {
return null;
}
return (react_1.default.createElement("div", { key: "checkall", className: cx('Mobile-checkall') },
react_1.default.createElement(Checkbox_1.default, { classPrefix: ns, type: multiple ? 'checkbox' : 'radio', checked: store.allChecked, onChange: function () { return _this.handleCheckAll(3); }, inline: true }),
react_1.default.createElement("span", null, __('Select.checkAll'))));
};
Table.prototype.renderColumnsToggler = function (config) {
var _this = this;
var _a;
var _b = this.props, className = _b.className, store = _b.store, ns = _b.classPrefix, cx = _b.classnames, headerToolbar = _b.headerToolbar, rest = tslib_1.__rest(_b, ["className", "store", "classPrefix", "classnames", "headerToolbar"]);
var __ = rest.translate;
var env = rest.env;
if ((0, helper_1.isMobile)()) {
return (react_1.default.createElement("div", { className: 'toolbar-item', onClick: function () { return _this.handleToolsClick(config.type); } },
react_1.default.createElement("div", { className: 'toolbar-item-icon' },
react_1.default.createElement(icons_1.Icon, { icon: config.icon, className: "batch-manage-icon" })),
react_1.default.createElement("div", { className: 'toolbar-item-name' }, config === null || config === void 0 ? void 0 : config.label)));
}
return (react_1.default.createElement(ColumnToggler_1.default, tslib_1.__assign({}, rest, ((0, helper_1.isObject)(config) ? config : {}), { tooltip: (config === null || config === void 0 ? void 0 : config.tooltip) || __('Table.columnsVisibility'), tooltipContainer: (env === null || env === void 0 ? void 0 : env.getTopModalContainer) || undefined, modalContainer: (env === null || env === void 0 ? void 0 : env.getModalContainer) || undefined, align: (_a = config === null || config === void 0 ? void 0 : config.align) !== null && _a !== void 0 ? _a : 'left', isActived: store.hasColumnHidden(), classnames: cx, classPrefix: ns, key: "columns-toggable", size: (config === null || config === void 0 ? void 0 : config.size) || 'sm', label: (config === null || config === void 0 ? void 0 : config.label) || react_1.default.createElement(icons_1.Icon, { icon: "columns", className: "icon m-r-none" }), draggable: config === null || config === void 0 ? void 0 : config.draggable, columns: store.columnsData, onColumnToggle: this.handleColumnToggle, updateColumnSettingList: function (list) { return _this.setState({ columnSettingTemps: list }); }, indexColShow: this.state.indexColShow, setIndexCol: this.setIndexCol, flushDebounced: function () { var _a, _b; return (_b = (_a = _this.debounceSendColumns) === null || _a === void 0 ? void 0 : _a.flush) === null || _b === void 0 ? void 0 : _b.call(_a); },
// originColumns={rest.originColumns}
columnSettingTemps: this.state.columnSettingTemps })));
};
Table.prototype.renderDragToggler = function () {
var _a = this.props, store = _a.store, env = _a.env, draggable = _a.draggable, ns = _a.classPrefix, __ = _a.translate;
if (!draggable || store.isNested) {
return null;
}
return (react_1.default.createElement(Button_1.default, { disabled: !!store.modified, classPrefix: ns, key: "dragging-toggle", tooltip: __('Table.startSort'), tooltipContainer: (env === null || env === void 0 ? void 0 : env.getTopModalContainer) || undefined, size: "sm", active: store.dragging, onClick: function (e) {
e.preventDefault();
store.toggleDragging();
store.dragging && store.clear();
}, iconOnly: true },
react_1.default.createElement(icons_1.Icon, { icon: "exchange", className: "icon" })));
};
Table.prototype.renderExportExcel = function (toolbar) {
var _this = this;
var _a = this.props, store = _a.store, env = _a.env, ns = _a.classPrefix, cx = _a.classnames, __ = _a.translate, columns = _a.columns, data = _a.data;
if (!columns) {
return null;
}
return (react_1.default.createElement(Button_1.default, { classPrefix: ns, onClick: function () {
Promise.resolve().then(function () { return new Promise(function(resolve){require(['exceljs'], function(ret) {resolve(tslib_1.__importStar(ret));})}); }).then(function (ExcelJS) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
var rows, tmpStore, filename, res, workbook, worksheet, filteredColumns, firstRowLabels, firstRow, remoteMappingCache, rowIndex, _i, rows_1, row, sheetRow, columIndex, _a, filteredColumns_1, column, name, value, type, body, imageData, imageDimensions, imageWidth, imageHeight, imageMaxSize, imageMatch, imageExt, imageId, linkURL, e_2, linkURL, map, source, sourceValue, mapKey, res, viewValue, buffer, blob;
var _b, _c, _d, _e;
return tslib_1.__generator(this, function (_f) {
switch (_f.label) {
case 0:
rows = [];
filename = 'data';
if (!(typeof toolbar === 'object' && toolbar.api)) return [3 /*break*/, 2];
return [4 /*yield*/, env.fetcher(toolbar.api, data)];
case 1:
res = _f.sent();
if (!res.data) {
env.notify('warning', __('placeholder.noData'));
return [2 /*return*/];
}
if (Array.isArray(res.data)) {
rows = res.data;
}
else {
rows = res.data.rows || res.data.items;
}
// 因为很多方法是 store 里的，所以需要构建 store 来处理
tmpStore = table_1.TableStore.create((0, mobx_state_tree_1.getSnapshot)(store));
tmpStore.initRows(rows);
rows = tmpStore.rows;
return [3 /*break*/, 3];
case 2:
rows = store.rows;
_f.label = 3;
case 3:
if (typeof toolbar === 'object' && toolbar.filename) {
filename = (0, tpl_1.filter)(toolbar.filename, data, '| raw');
}
if (rows.length === 0) {
env.notify('warning', __('placeholder.noData'));
return [2 /*return*/];
}
workbook = new ExcelJS.Workbook();
worksheet = workbook.addWorksheet('sheet', {
properties: { defaultColWidth: 15 }
});
worksheet.views = [{ state: 'frozen', xSplit: 0, ySplit: 1 }];
filteredColumns = toolbar.columns
? columns.filter(function (column) {
var filterColumnsNames = toolbar.columns;
if (filterColumnsNames.indexOf(column.name) !== -1) {
return true;
}
return false;
})
: columns;
firstRowLabels = filteredColumns.map(function (column) {
return column.label;
});
firstRow = worksheet.getRow(1);
firstRow.values = firstRowLabels;
worksheet.autoFilter = {
from: {
row: 1,
column: 1
},
to: {
row: 1,
column: firstRowLabels.length
}
};
remoteMappingCache = {};
rowIndex = 1;
_i = 0, rows_1 = rows;
_f.label = 4;
case 4:
if (!(_i < rows_1.length)) return [3 /*break*/, 19];
row = rows_1[_i];
rowIndex += 1;
sheetRow = worksheet.getRow(rowIndex);
columIndex = 0;
_a = 0, filteredColumns_1 = filteredColumns;
_f.label = 5;
case 5:
if (!(_a < filteredColumns_1.length)) return [3 /*break*/, 18];
column = filteredColumns_1[_a];
columIndex += 1;
name = column.name;
value = (0, helper_1.getVariable)(row.data, name);
if (typeof value === 'undefined' &&
!column.tpl) {
return [3 /*break*/, 17];
}
// 处理合并单元格
if (name in row.rowSpans) {
if (row.rowSpans[name] === 0) {
return [3 /*break*/, 17];
}
else {
// start row, start column, end row, end column
worksheet.mergeCells(rowIndex, columIndex, rowIndex + row.rowSpans[name] - 1, columIndex);
}
}
type = column.type || 'plain';
body = column === null || column === void 0 ? void 0 : column.body;
if (!(type === 'image' && value)) return [3 /*break*/, 11];
_f.label = 6;
case 6:
_f.trys.push([6, 9, , 10]);
return [4 /*yield*/, (0, image_1.toDataURL)(value)];
case 7:
imageData = _f.sent();
return [4 /*yield*/, (0, image_1.getImageDimensions)(imageData)];
case 8:
imageDimensions = _f.sent();
imageWidth = imageDimensions.width;
imageHeight = imageDimensions.height;
imageMaxSize = 100;
if (imageWidth > imageHeight) {
if (imageWidth > imageMaxSize) {
imageHeight = (imageMaxSize * imageHeight) / imageWidth;
imageWidth = imageMaxSize;
}
}
else {
if (imageHeight > imageMaxSize) {
imageWidth = (imageMaxSize * imageWidth) / imageHeight;
imageHeight = imageMaxSize;
}
}
imageMatch = imageData.match(/data:image\/(.*);/);
imageExt = 'png';
if (imageMatch) {
imageExt = imageMatch[1];
}
// 目前 excel 只支持这些格式，所以其它格式直接输出 url
if (imageExt != 'png' &&
imageExt != 'jpeg' &&
imageExt != 'gif') {
sheetRow.getCell(columIndex).value = value;
return [3 /*break*/, 17];
}
imageId = workbook.addImage({
base64: imageData,
extension: imageExt
});
linkURL = getAbsoluteUrl(value);
worksheet.addImage(imageId, {
// 这里坐标位置是从 0 开始的，所以要减一
tl: { col: columIndex - 1, row: rowIndex - 1 },
ext: {
width: imageWidth,
height: imageHeight
},
hyperlinks: {
tooltip: linkURL
}
});
return [3 /*break*/, 10];
case 9:
e_2 = _f.sent();
console.warn(e_2.stack);
return [3 /*break*/, 10];
case 10: return [3 /*break*/, 17];
case 11:
if (!(type == 'link')) return [3 /*break*/, 12];
linkURL = getAbsoluteUrl(value);
sheetRow.getCell(columIndex).value = {
text: value,
hyperlink: linkURL
};
return [3 /*break*/, 17];
case 12:
if (!(type === 'mapping' ||
(type === 'container' && body.type === 'mapping'))) return [3 /*break*/, 16];
map = type === 'mapping'
? column.map
: (_b = column === null || column === void 0 ? void 0 : column.body) === null || _b === void 0 ? void 0 : _b.map;
source = type === 'mapping'
? column.source
: (_c = column === null || column === void 0 ? void 0 : column.body) === null || _c === void 0 ? void 0 : _c.source;
if (!source) return [3 /*break*/, 15];
sourceValue = source;
if ((0, tpl_builtin_1.isPureVariable)(source)) {
sourceValue = (0, tpl_builtin_1.resolveVariableAndFilter)(source, data, '| raw');
}
mapKey = JSON.stringify(source);
if (!(mapKey in remoteMappingCache)) return [3 /*break*/, 13];
map = remoteMappingCache[mapKey];
return [3 /*break*/, 15];
case 13: return [4 /*yield*/, env.fetcher(sourceValue, data)];
case 14:
res = _f.sent();
if (res.data) {
remoteMappingCache[mapKey] = res.data;
map = res.data;
}
_f.label = 15;
case 15:
if (typeof value !== 'undefined' &&
map &&
((_d = map[value]) !== null && _d !== void 0 ? _d : map['*'])) {
viewValue = (_e = map[value]) !== null && _e !== void 0 ? _e : (value === true && map['1']
? map['1']
: value === false && map['0']
? map['0']
: map['*']);
sheetRow.getCell(columIndex).value =
(0, helper_1.removeHTMLTag)(viewValue);
}
else {
sheetRow.getCell(columIndex).value = (0, helper_1.removeHTMLTag)(value);
}
return [3 /*break*/, 17];
case 16:
if (column.tpl) {
sheetRow.getCell(columIndex).value = (0, helper_1.removeHTMLTag)((0, tpl_1.filter)(column.tpl, (0, helper_1.createObject)(data, row.data)));
}
else {
sheetRow.getCell(columIndex).value = value;
}
_f.label = 17;
case 17:
_a++;
return [3 /*break*/, 5];
case 18:
_i++;
return [3 /*break*/, 4];
case 19: return [4 /*yield*/, workbook.xlsx.writeBuffer()];
case 20:
buffer = _f.sent();
if (buffer) {
blob = new Blob([buffer], {
type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
});
(0, file_saver_1.saveAs)(blob, filename + '.xlsx');
}
return [2 /*return*/];
}
});
}); });
}, size: "sm" }, toolbar.label || __('CRUD.exportExcel')));
};
Table.prototype.renderActions = function (region) {
var _this = this;
var _a = this.props, actions = _a.actions, render = _a.render, store = _a.store, cx = _a.classnames, isPick = _a.isPick, __ = _a.translate, data = _a.data, headerActions = _a.headerActions, headerBulkActions = _a.headerBulkActions, isStatic = _a.isStatic, isCross = _a.isCross;
actions = Array.isArray(actions) ? actions.concat() : [];
var _b = this.state, showExpandMoreAction = _b.showExpandMoreAction, actionsExpanded = _b.actionsExpanded;
if ((region === 'header' && !isStatic && !isCross) || ((0, helper_1.isMobile)() && isPick && !isStatic && !isCross)) {
actions = actions.concat(headerActions || [], (headerBulkActions || []).map(function (item) { return (tslib_1.__assign(tslib_1.__assign({}, item), { isBulk: true })); }));
}
// Aug
var btn;
if (!~this.renderedToolbars.indexOf('check-all') &&
!store.hideCheckToggler &&
store.mobileUI &&
(btn = this.renderCheckAll())) {
actions.unshift({
type: 'button',
children: btn
});
}
if (store.draggable &&
!store.isNested &&
region === 'header' &&
store.rows.length > 1 &&
!~this.renderedToolbars.indexOf('drag-toggler')) {
actions.push({
type: 'button',
children: this.renderDragToggler()
});
}
return Array.isArray(actions) && actions.length ? (react_1.default.createElement("div", { className: cx('Table-actions'), ref: this.tableActionsRef, style: { display: 'flex', flexWrap: actionsExpanded ? 'wrap' : undefined } },
showExpandMoreAction && (react_1.default.createElement("div", { className: cx('Table-actions-moreBtn'), onClick: function (e) {
e.stopPropagation();
_this.setState({ actionsExpanded: !actionsExpanded });
} },
react_1.default.createElement(icons_2.DownOutlined, { rotate: actionsExpanded ? 180 : 0 }),
actionsExpanded ? __('PutAway') : __('More'))),
actions.map(function (action, key) {
var _a, _b;
return action.isBulk ? (_b = (_a = _this.props).bulkActionRender) === null || _b === void 0 ? void 0 : _b.call(_a, action, key) : render("action/".concat(key), tslib_1.__assign({ type: 'button', isTableAction: true }, action), {
onAction: _this.handleAction,
key: key,
isTableAction: true,
btnDisabled: store.dragging,
data: store.getData(data)
});
}))) : null;
};
Table.prototype.renderHeader = function (editable) {
var _a, _b, _c, _d, _e;
var _f = this.props, header = _f.header, headerClassName = _f.headerClassName, toolbarClassName = _f.toolbarClassName, headerToolbarClassName = _f.headerToolbarClassName, headerToolbarRender = _f.headerToolbarRender, render = _f.render, showHeader = _f.showHeader, store = _f.store, cx = _f.classnames, data = _f.data, filterRender = _f.filterRender, //Aug
__ = _f.translate, isPick = _f.isPick, multiple = _f.multiple, clearSelectedItems = _f.clearSelectedItems, handleResetData = _f.handleResetData, headerToolbar = _f.headerToolbar;
if (showHeader === false) {
return null;
}
// Aug
if ((0, helper_1.isMobile)()) {
/** 选择 */
var checkAll = isPick && multiple ? (this.renderCheckAll()) : ((_a = this.props.headerBulkActions) === null || _a === void 0 ? void 0 : _a.length) || ((0, helper_1.isMobile)() && ((_b = this.props.headerActions) === null || _b === void 0 ? void 0 : _b.some(function (btn) {
var _a, _b;
return (0, helper_1.isObject)((_a = btn === null || btn === void 0 ? void 0 : btn.api) === null || _a === void 0 ? void 0 : _a.data) && Object.keys((_b = btn === null || btn === void 0 ? void 0 : btn.api) === null || _b === void 0 ? void 0 : _b.data).includes('SELECTION_IDS');
}))) ? (react_1.default.createElement("span", { className: cx('Mobile-batch-manage', {
'is-active': !store.hideCheckToggler
}), style: { marginRight: '12px' }, onClick: function (e) {
e.preventDefault();
clearSelectedItems === null || clearSelectedItems === void 0 ? void 0 : clearSelectedItems();
store.toggableHideCheck();
store.clear();
} }, store.hideCheckToggler ? (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(icons_1.Icon, { icon: "#icon-tooltool_list", className: "batch-manage-icon" }),
react_1.default.createElement("span", { className: "batch-text" }, __('CRUD.select')))) : (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(icons_1.Icon, { icon: "#icon-tooltool_list", className: "batch-manage-icon" }),
react_1.default.createElement("span", { className: "batch-text" }, __('Wizard.finish')))))) : null;
return react_1.default.createElement("div", { className: cx('Mobile-header-toolbar-wrapper') },
react_1.default.createElement("div", { className: 'fold-container' },
(this.props.tipsHeader || this.props.aggregate) ? (react_1.default.createElement("div", { className: "fold-all-btn", onClick: this.handleToggleHeaderToolbar },
react_1.default.createElement(icons_1.Icon, { icon: "#icon-tooltool_".concat(this.state.headerIsFolded ? 'downs' : 'ups'), className: "icon", symbol: true }))) : null,
react_1.default.createElement("div", { className: "fold-wrapper", style: { display: this.state.headerIsFolded ? 'none' : 'unset', width: '100%' } },
this.props.tipsHeader && (0, helper_1.isMobile)() ? render('alert', this.props.tipsHeader, { cx: cx, pageUniqueMark: this.props.name + 'header', data: store.data }) : null, (_d = (_c = this.props).renderAggregate) === null || _d === void 0 ? void 0 :
_d.call(_c))),
react_1.default.createElement("div", { className: 'filter-wrapper' },
checkAll,
react_1.default.createElement("div", { className: "filter-conditions", style: { marginTop: '4px' } },
typeof data.total == 'number' ? __('CRUD.total', { total: data.total }) : null,
((_e = data.selectedItems) === null || _e === void 0 ? void 0 : _e.length) ? (react_1.default.createElement("span", { style: { marginLeft: 10 } }, __('CRUD.checked', { count: data.selectedItems.length }))) : null),
this.renderTools()));
}
var otherProps = {};
// editable === false && (otherProps.$$editable = false);
var child = headerToolbarRender
? headerToolbarRender(tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({}, this.props), { selectedItems: store.selectedRows.map(function (item) { return item.data; }), items: store.rows.map(function (item) { return item.data; }), unSelectedItems: store.unSelectedRows.map(function (item) { return item.data; }) }), otherProps), this.renderToolbar, (0, helper_1.isMobile)() ? null : this.renderPagenation)
: null;
var actions = this.renderActions('header');
var toolbarNode = actions || child || store.dragging ? (react_1.default.createElement("div", { className: cx('Table-toolbar Table-headToolbar', toolbarClassName, headerToolbarClassName), key: "header-toolbar" },
actions,
child,
store.dragging ? (react_1.default.createElement("div", { className: cx('Table-dragTip'), ref: this.dragTipRef }, __('Table.dragTip'))) : null)) : null;
var headerNode = header && (!Array.isArray(header) || header.length) ? (react_1.default.createElement("div", { className: cx('Table-header', headerClassName), key: "header" }, render('header', header, tslib_1.__assign(tslib_1.__assign({}, (editable === false ? otherProps : null)), { data: store.getData(data) })))) : null;
return headerNode && toolbarNode
? [headerNode, toolbarNode]
: headerNode || toolbarNode || null;
};
Table.prototype.getTabContainer = function () {
return helper_1.domUtils.closest(this.tableContainer.current, 'div.amis-scope');
};
Table.prototype.renderFooter = function () {
var _a, _b, _c, _d;
var _e = this.props, footer = _e.footer, toolbarClassName = _e.toolbarClassName, footerToolbarClassName = _e.footerToolbarClassName, footerClassName = _e.footerClassName, footerToolbarRender = _e.footerToolbarRender, headerToolbar = _e.headerToolbar, //Aug
footerToolbar = _e.footerToolbar, //Aug
render = _e.render, showFooter = _e.showFooter, store = _e.store, data = _e.data, cx = _e.classnames, tableRotate = _e.tableRotate, translate = _e.translate, headerActions = _e.headerActions, env = _e.env, getAllData = _e.getAllData, loadDataOnce = _e.loadDataOnce, isStatic = _e.isStatic, selected = _e.selected, name = _e.name, aliasTitle = _e.aliasTitle, tabTitle = _e.tabTitle;
var _f = this.state, currentKey = _f.currentKey, processToolsModalList = _f.processToolsModalList;
var selectedItems = (_b = (_a = selected === null || selected === void 0 ? void 0 : selected.concat()) !== null && _a !== void 0 ? _a : store.selectedRows.map(function (item) { return item.data; })) !== null && _b !== void 0 ? _b : [];
var items = store.rows.map(function (item) { return item.data; });
var colList = store.columnsData.filter(function (col) { return !col.pristine.hidden && col.type !== 'operation'; })
.map(function (item) { return item.toJSON ? item.toJSON() : item; });
var itemRaws = (_c = store.data) === null || _c === void 0 ? void 0 : _c.itemsRaw;
if (showFooter === false) {
return null;
}
var _footer = footerToolbar || [];
if (store.mobileUI) {
// 勾选批量状态时
if (!store.hideCheckToggler) {
_footer = ['headerBulkActions', 'footerBulkActions'];
}
else {
if (headerToolbar) {
// 移动端将所有操作统一放在在底部
_footer = _footer.concat(headerActions || [], headerToolbar);
}
// 非勾选状态不渲染批量操作 分页也不渲染
_footer = _footer.filter(function (item) {
var type = item.type || item;
return ![
'bulk-actions',
'headerBulkActions',
'footerBulkActions',
'bulkActions',
'pagination',
'statistics',
'switch-per-page'
].includes(type);
});
}
}
// 居右的这里展示
var leftChild = footerToolbarRender
? footerToolbarRender(tslib_1.__assign(tslib_1.__assign({}, this.props), { selectedItems: store.selectedRows.map(function (item) { return item.data; }), items: store.rows.map(function (item) { return item.data; }) }), this.renderToolbar, (0, helper_1.isMobile)() ? _footer : _footer.filter(function (item) { return item.align !== 'right'; }) //Aug
)
: null;
var actions = this.renderActions('footer');
var footerNode = footer && (!Array.isArray(footer) || footer.length) ? (react_1.default.createElement("div", { className: cx('Table-footer', footerClassName), key: "footer" }, render('footer', footer, {
data: store.getData(data)
}))) : null;
var toolbarNode = actions || leftChild || processToolsModalList.length > 0 ? (react_1.default.createElement("div", { className: cx('Table-toolbar Table-footToolbar', toolbarClassName, (0, helper_1.isMobile)() ? 'mobile-toolbar' : '', footerToolbarClassName), style: { display: (0, helper_1.isMobile)() && tableRotate ? 'none' : undefined }, key: "footer-toolbar" },
actions,
(0, helper_1.isMobile)() ? leftChild : null,
tableRotate && footerNode,
processToolsModalList.length > 0 && react_1.default.createElement(ProcessToolsModal_1.default, { render: render, onChange: this.onToolsChange, translate: translate, onDelete: this.onToolsClose, currentKey: currentKey, primaryField: this.props.primaryField, env: env, crudTitle: aliasTitle || tabTitle || '', staticRecords: this.staticRecords, handleChangeData: this.handleChangeData, getAllData: getAllData, data: { items: items, selectedItems: selectedItems, itemRaws: itemRaws }, loadDataOnce: loadDataOnce, columns: colList, name: name, isStatic: isStatic, container: this.getTabContainer() || ((_d = env === null || env === void 0 ? void 0 : env.getModalContainer) === null || _d === void 0 ? void 0 : _d.call(env)) || this.tableContainer.current, modalGroup: processToolsModalList }))) : null;
return footerNode && toolbarNode
? [toolbarNode, tableRotate ? null : footerNode]
: (tableRotate ? null : footerNode) || toolbarNode || null;
};
// itemContenxtMenuHandle = (visible: boolean) => {
// if (!visible) {
// this.setState({ contextMenuVisible: false });
// }
// }
/** ai助手render */
Table.prototype.renderAiTool = function (action) {
var _this = this;
var _a, _b, _c, _d, _e, _f, _g, _h;
var newData = (0, helper_1.createObject)((_b = (_a = this.props.storeForAiTool) === null || _a === void 0 ? void 0 : _a.filterData) !== null && _b !== void 0 ? _b : {}, (_d = (_c = this.props.storeForAiTool) === null || _c === void 0 ? void 0 : _c.query) !== null && _d !== void 0 ? _d : {}, {}, true);
var _j = ((_f = (_e = this.props.storeForAiTool) === null || _e === void 0 ? void 0 : _e.getRawCacheData) === null || _f === void 0 ? void 0 : _f.call(_e)).curApiForCache, curApiForCache = _j === void 0 ? '' : _j;
return (react_1.default.createElement(AiTool_1.default, { pageId: (_g = this.props.name) !== null && _g !== void 0 ? _g : '', action: action, env: tslib_1.__assign(tslib_1.__assign({}, this.props.env), { container: (_h = this.tableContainer) === null || _h === void 0 ? void 0 : _h.current }), data: newData, paramData: curApiForCache, render: this.props.render, open: this.state.showAiTool, onClose: function () { return _this.setState({ showAiTool: false }); } }));
};
Table.prototype.renderTableContent = function () {
var _a, _b;
var _c = this.props, cx = _c.classnames, tableClassName = _c.tableClassName, store = _c.store, placeholder = _c.placeholder, render = _c.render, checkOnItemClick = _c.checkOnItemClick, buildItemProps = _c.buildItemProps, rowClassNameExpr = _c.rowClassNameExpr, rowClassName = _c.rowClassName, prefixRow = _c.prefixRow, locale = _c.locale, affixRow = _c.affixRow, tableContentClassName = _c.tableContentClassName, translate = _c.translate, itemAction = _c.itemAction, autoFillHeight = _c.autoFillHeight, itemActions = _c.itemActions, primaryField = _c.primaryField, infinteLoad = _c.infinteLoad, onLoadMore = _c.onLoadMore, loadHasMore = _c.loadHasMore, loading = _c.loading, tableType = _c.tableType, tableRotate = _c.tableRotate, handleJump = _c.handleJump, loadDataOnce = _c.loadDataOnce, classPrefix = _c.classPrefix, showIndex = _c.showIndex, footerToolbar = _c.footerToolbar, env = _c.env;
// 理论上来说 store.rows 应该也行啊
// 不过目前看来只有这样写它才会重新更新视图
store.rows.length;
var columns = store.filteredColumns;
return (react_1.default.createElement(TableContent_1.TableContent, { renderAffix: this.affix, tableId: this.tableId, tableName: this.props.name, autoWidth: this.props.autoWidth, isTabsDom: this.tabsDom, tableClassName: cx(store.combineNum > 0 ? 'Table-table--withCombine' : '', {
'Table-table--checkOnItemClick': checkOnItemClick,
// Aug 包含勾选框的情况
'has-checkbox': store.mobileUI && columns.some(function (item) { return item.type === '__checkme'; }),
'checkbox-show': !store.hideCheckToggler,
'hideCheckToggler': store.hideCheckToggler,
'hideIndexCol': !this.state.indexColShow
}, tableClassName), checkItem: this.itemCheckHandle,
// showContextMenu={this.showContextMenu}
setBorder: this.props.setBorder, multiple: this.props.multiple, canAccessSuperData: this.props.canAccessSuperData, tableWindowInstance: this.tableWindowRef, className: tableContentClassName, itemActions: itemActions, itemAction: itemAction, store: store, classnames: cx, columns: columns,
// columnsGroup={store.columnGroup}
rows: store.rows, placeholder: placeholder, render: render, handleResetData: this.props.handleResetData, onMouseMove: this.handleMouseMove, onScroll: this.handleOutterScroll, tableRef: this.tableRef, renderHeadCell: this.renderHeadCell, renderCell: this.renderCell, onCheck: this.handleCheck, onQuickChange: store.dragging ? undefined : this.handleQuickChange, footable: store.footable, footableColumns: store.footableColumns, checkOnItemClick: checkOnItemClick, buildItemProps: buildItemProps, onAction: this.handleAction, rowClassNameExpr: rowClassNameExpr, rowClassName: rowClassName, data: store.data, prefixRow: prefixRow, affixRow: affixRow, locale: locale, translate: translate,
// Jay
autoFillHeight: autoFillHeight, primaryField: primaryField,
// position={this.state.position}
// contextMenuVisible={this.state.contextMenuVisible}
// onContextMenuVisibleChange={this.itemContenxtMenuHandle}
infinteLoad: infinteLoad, onLoadMore: onLoadMore, loadHasMore: loadHasMore, tableType: tableType, tableLayout: this.state.tableMode, loading: loading, handleMultiColumnSort: this.handleMultiColumnSort, tableRotate: tableRotate, handleJump: handleJump, loadDataOnce: loadDataOnce, classPrefix: classPrefix, showPerPage: (_a = footerToolbar === null || footerToolbar === void 0 ? void 0 : footerToolbar.some(function (item) { return item.type == 'switch-per-page'; })) !== null && _a !== void 0 ? _a : false, changeSelectedRow: this.changeSelectedRow, type: this.props.type, countField: this.props.countField, affixRowPosition: this.props.affixRowPosition, activeRow: this.state.activeRow, activeCol: this.state.activeCol, hiddenRowHighlight: this.props.type == 'cross' && ((_b = this.props.cross) === null || _b === void 0 ? void 0 : _b.positionType) === 1, env: env }));
};
// 初始化toolbar监听器
Table.prototype.initToolbarObserver = function () {
var _this = this;
if (!this.table || !(0, helper_1.isMobile)())
return;
var ns = this.props.classPrefix;
var table = (0, react_dom_1.findDOMNode)(this);
var headerToolbar = table.querySelector(".".concat(ns, "Mobile-header-toolbar-wrapper"));
if (!headerToolbar)
return;
var toolbarObserver = new IntersectionObserver(function (entries, observer) {
entries.forEach(function (entry) {
var _a;
var isIntersecting = entry.isIntersecting, target = entry.target, boundingClientRect = entry.boundingClientRect;
var tableContentWrap = table.querySelector(".".concat(ns, "Table-contentWrap"));
var footToolbar = table.querySelector(".".concat(ns, "Table-footToolbar"));
var toolbarDom = target.querySelector('.filter-wrapper');
// if (isIntersecting) {
var height = boundingClientRect.height, top = boundingClientRect.top;
// top是负的 才表示已经往上滚动
if (top < 0) {
// const toolbarWrapperDom = target.querySelector(`.${ns}Mobile-header-toolbar-wrapper`) as HTMLElement;
// console.log('debug-`toolbarWrapperDom', `toolbarWrapperDom：${toolbarWrapperDom?.offsetHeight}`);
var toolbarHeight = ((_a = toolbarDom === null || toolbarDom === void 0 ? void 0 : toolbarDom.offsetHeight) !== null && _a !== void 0 ? _a : 0) + 16;
var finalHeight = height - toolbarHeight;
target.style.position = 'sticky';
target.style.top = (finalHeight) * -1 + 'px';
target.style.zIndex = '6';
// tableContentWrap.style.position = 'sticky';
// tableContentWrap.style.top = toolbarHeight + 'px';
if (footToolbar) {
footToolbar.style.position = 'sticky';
footToolbar.style.bottom = '0px';
footToolbar.style.zIndex = '6';
}
}
// this.updateAutoFillHeight();
// }
setTimeout(function () {
requestAnimationFrame(function () {
_this.updateAutoFillHeight();
});
}, 100);
});
}, {
root: null,
rootMargin: '10px 0px',
threshold: [0.1, 0.5, 0.8]
});
if (headerToolbar) {
toolbarObserver.observe(headerToolbar);
this.toolbarObserver = toolbarObserver;
}
};
// 切换顶部仅展示操作栏
Table.prototype.handleToggleHeaderToolbar = function () {
var headerIsFolded = this.state.headerIsFolded;
this.setState({ headerIsFolded: !headerIsFolded }, function () {
// this.updateAutoFillHeight();
});
};
Table.prototype.render = function () {
var _this = this;
var _a = this.props, className = _a.className, store = _a.store, cx = _a.classnames, _b = _a.autoFillHeight, autoFillHeight = _b === void 0 ? true : _b, autoGenerateFilter = _a.autoGenerateFilter, isPick = _a.isPick, multiple = _a.multiple, tableRotate = _a.tableRotate, offlineSchema = _a.offlineSchema, render = _a.render, renderAggregate = _a.renderAggregate;
this.renderedToolbars = []; // 用来记录哪些 toolbar 已经渲染了，已经渲染了就不重复渲染了。
var heading = this.renderHeading();
var header = this.renderHeader();
var footer = this.renderFooter();
return (react_1.default.createElement(mobx_react_1.Provider, { tableCtxMenuStore: tableCtxMenuStore_1.default },
react_1.default.createElement("div", { className: cx('Table', "Table-".concat(this.state.tableMode), className, {
'Table--unsaved': !!store.modified || !!store.moved,
'Table--autoFillHeight': autoFillHeight,
'is-mobile': store.mobileUI,
tableRotate: tableRotate
}), ref: this.tableContainer, "table-name": this.props.name },
autoGenerateFilter ? this.renderAutoFilterForm() : null,
!(0, helper_1.isMobile)() && (renderAggregate === null || renderAggregate === void 0 ? void 0 : renderAggregate()),
header,
heading,
react_1.default.createElement("div", { ref: this.tableWindowRef, className: cx('Table-contentWrap table-ping-right', {
hasHeader: header,
hasFooter: footer,
isIos: index_1.Shell.hasShell() && tools_1.tools.isIOS,
isXsIos: index_1.Shell.hasShell() && tools_1.tools.isIOS && document.body.clientHeight <= 680
}), onMouseLeave: this.handleMouseLeave, style: { position: 'relative', willChange: 'scroll-position' } },
react_1.default.createElement("div", { style: { height: this.state.pullY, textAlign: 'center' } }, this.state.pullY > 0 && react_1.default.createElement(Bubble_1.default, { y: 80 })),
react_1.default.createElement("div", { ref: this.dragShadowRef, onDrop: this.onHeaderDrop, onDragEnd: this.onHeaderDragEnd, onDragOver: this.onHeaderDragOver, draggable: "true", style: { position: 'absolute', zIndex: 10, background: 'rgba(0,0,0,.1)' }, className: 'drag-shadow' }),
react_1.default.createElement("div", { ref: this.dragLineShadowRef, style: { position: 'absolute', width: '1px', display: 'none', zIndex: 10, border: '1px dashed rgb(37 79 210 / 54%)' }, className: 'drag-shadow' }),
this.renderTableContent(),
(0, helper_1.isMobile)() && index_1.Shell.hasShell() && offlineSchema && offlineSchema.offlinePageType !== 'detail' && react_1.default.createElement("div", { className: 'offline-opt-in', onTouchStart: function (e) { return _this.btnTouchStart(e, 'offline'); }, onTouchMove: function (e) { return _this.btnToucheMove(e, 'offline'); }, onTouchEnd: this.btnTouchEnd, style: { bottom: this.state.offlineY, right: this.state.offlineX } },
react_1.default.createElement(icons_1.Icon, { icon: 'offline-icon', className: 'icon' })),
(0, helper_1.isMobile)() && index_1.Shell.hasShell() && this.state.tableMode === 'horizontal' && this.props.tableTranspose && react_1.default.createElement("div", { className: 'mobile-view-mode', onTouchStart: function (e) { return _this.btnTouchStart(e, 'rotate'); }, onTouchMove: function (e) { return _this.btnToucheMove(e, 'rotate'); }, onTouchEnd: this.btnTouchEnd, style: { bottom: this.state.rotateY, right: this.state.rotateX } },
react_1.default.createElement(icons_1.Icon, { icon: 'table-rotate', className: 'icon' }))),
this.props.tipsFooter && (0, helper_1.isMobile)() ? react_1.default.createElement("div", { style: { background: '#fff', padding: '6px 12px 0' } }, render('alert', this.props.tipsFooter, { cx: cx, pageUniqueMark: this.props.name + 'footer', data: store.data })) : null,
footer,
this.state.columnsTogglerShow && react_1.default.createElement(antd_1.Drawer, { placement: 'bottom', mask: true, zIndex: 1011, className: "columns-toggler-drawer ".concat(tools_1.tools.isIOS && !index_1.Shell.hasShell() ? 'ios-device' : ''), getContainer: this.props.env.getModalContainer, width: '100vw', height: '90vh', title: '设置列', visible: this.state.columnsTogglerShow, onClose: function () { return _this.setState({ columnsTogglerShow: false }); } },
react_1.default.createElement(ColumnToggler_1.default, tslib_1.__assign({}, this.props, { parentDom: this.props.env.getModalContainer, defaultIsOpened: true, isActived: store.hasColumnHidden(), key: "columns-toggable", draggable: true, updateColumnSettingList: function (list) { return _this.setState({ columnSettingTemps: list }); }, columns: store.columnsData, onColumnToggle: this.handleColumnToggle, indexColShow: this.state.indexColShow, setIndexCol: this.setIndexCol, closeDrawer: function () { return _this.setState({ columnsTogglerShow: false }); },
// originColumns={this.props.originColumns}
columnSettingTemps: this.state.columnSettingTemps }))))));
};
Table.propsList = [
'header',
'headerToolbarRender',
'footer',
'footerToolbarRender',
'footable',
'expandConfig',
'placeholder',
'tableClassName',
'headingClassName',
'source',
'selectable',
'columnsTogglable',
'affixHeader',
'affixColumns',
'headerClassName',
'footerClassName',
'selected',
'multiple',
'primaryField',
'hideQuickSaveBtn',
'itemCheckableOn',
'itemDraggableOn',
'checkOnItemClick',
'hideCheckToggler',
'itemAction',
'itemActions',
'combineNum',
'combineFromIndex',
'items',
'columns',
'valueField',
'saveImmediately',
'rowClassName',
'rowClassNameExpr',
'popOverContainer',
'headerToolbarClassName',
'toolbarClassName',
'footerToolbarClassName',
'itemBadge',
'autoFillHeight',
'showIndex',
'affixRowPosition',
'crudRenderToolbarFunc'
];
Table.defaultProps = {
className: '',
placeholder: 'placeholder.noData',
tableClassName: '',
source: '$items',
selectable: false,
// columnsTogglable: 'auto', //Aug
columnsTogglable: false,
affixHeader: true,
headerClassName: '',
footerClassName: '',
toolbarClassName: '',
headerToolbarClassName: '',
footerToolbarClassName: '',
primaryField: 'id',
itemCheckableOn: '',
itemDraggableOn: '',
// hideCheckToggler: false,
hideCheckToggler: (0, helper_1.isMobile)(),
footable: (0, helper_1.isMobile)(),
canAccessSuperData: false,
resizable: true,
tableLayout: (0, helper_1.isMobile)() ? 'vertical' : 'horizontal',
infinteLoad: (0, helper_1.isMobile)(),
showIndex: false,
affixRowPosition: 0
};
return Table;
}(react_1.default.Component));
exports.default = Table;
var TableRenderer = /** @class */ (function (_super) {
tslib_1.__extends(TableRenderer, _super);
function TableRenderer() {
return _super !== null && _super.apply(this, arguments) || this;
}
TableRenderer = tslib_1.__decorate([
(0, factory_1.Renderer)({
name: 'table',
storeType: table_1.TableStore.name,
test: function (_path, schema) { return (schema === null || schema === void 0 ? void 0 : schema.type) === 'table' || (schema === null || schema === void 0 ? void 0 : schema.type) === 'cross'; },
shouldSyncSuperStore: function (_, props) { return props.type === 'cross' ? false : undefined; }
})
], TableRenderer);
return TableRenderer;
}(Table));
exports.TableRenderer = TableRenderer;
//# sourceMappingURL=./renderers/Table/index.js.map