vxe-table-demonic
Version:
一个基于 vue 的 PC 端表单/表格组件，支持增删改查、虚拟列表、虚拟树、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、弹窗、自定义模板、渲染器、JSON 配置式...
1,187 lines • 342 kB
JavaScript
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
if (ar || !(i in from)) {
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
ar[i] = from[i];
}
}
return to.concat(ar || Array.prototype.slice.call(from));
};
import { computed, createCommentVNode, defineComponent, getCurrentInstance, h, inject, nextTick, onActivated, onBeforeUnmount, onDeactivated, onMounted, onUnmounted, provide, reactive, ref, resolveComponent, watch } from 'vue';
import XEUtils, { isFunction } from 'xe-utils';
import { addClass, browse, getEventTargetNode, getPaddingTopBottomSize, hasClass, isNodeElement, isPx, isScale, removeClass, setScrollLeft, setScrollTop } from '../../tools/dom';
import { eqEmptyValue, formatText, getFuncText, getLastZIndex, hasChildrenList, isEnableConf, nextZIndex } from '../../tools/utils';
import { errLog, warnLog } from '../../tools/log';
import { createResizeEvent } from '../../tools/resize';
import { EVENT_KEYS, GlobalEvent, hasEventKey } from '../../tools/event';
import { useSize } from '../../hooks/size';
import { VXETable } from '../../v-x-e-table';
import GlobalConfig from '../../v-x-e-table/src/conf';
import Cell from './cell';
import TableBodyComponent from './body';
import TableHeaderComponent from '../../header';
import TableFooterComponent from '../../footer';
import tableProps from './props';
import tableEmits from './emits';
import VxeLoading from '../../loading/index';
import { clearTableAllStatus, colToVisible, getCellValue, getRootColumn, getRowid, getRowkey, getRowUniqueId, handleFieldOrColumn, restoreScrollListener, restoreScrollLocation, rowToVisible, setCellValue, toTreePathSeq } from './util';
import { getSlotVNs } from '../../tools/vn';
var isWebkit = browse['-webkit'] && !browse.edge;
var resizableStorageKey = 'VXE_TABLE_CUSTOM_COLUMN_WIDTH';
var visibleStorageKey = 'VXE_TABLE_CUSTOM_COLUMN_VISIBLE';
var fixedStorageKey = 'VXE_TABLE_CUSTOM_COLUMN_FIXED';
var orderStorageKey = 'VXE_TABLE_CUSTOM_COLUMN_ORDER';
export default defineComponent({
name: 'VxeTable',
props: tableProps,
emits: tableEmits,
setup: function (props, context) {
var slots = context.slots, emit = context.emit;
var hasUseTooltip = VXETable.tooltip;
var xID = XEUtils.uniqueId();
var computeSize = useSize(props);
var instance = getCurrentInstance();
var reactData = reactive({
// 低性能的静态列
staticColumns: [],
// 渲染的列分组
tableGroupColumn: [],
// 可视区渲染的列
tableColumn: [],
// 渲染中的数据
tableData: [],
// 是否启用了横向 X 可视渲染方式加载
scrollXLoad: false,
// 是否启用了纵向 Y 可视渲染方式加载
scrollYLoad: false,
// 是否存在纵向滚动条
overflowY: true,
// 是否存在横向滚动条
overflowX: false,
// 纵向滚动条的宽度
scrollbarWidth: 0,
// 横向滚动条的高度
scrollbarHeight: 0,
// 最后滚动时间戳
lastScrollTime: 0,
// 行高
rowHeight: 0,
// 表格父容器的高度
parentHeight: 0,
// 是否使用分组表头
isGroup: false,
isAllOverflow: false,
// 复选框属性，是否全选
isAllSelected: false,
// 复选框属性，有选中且非全选状态
isIndeterminate: false,
// 复选框属性，已选中的行集合
selectCheckboxMaps: {},
// 当前行
currentRow: null,
// 单选框属性，选中列
currentColumn: null,
// 单选框属性，选中行
selectRadioRow: null,
// 表尾合计数据
footerTableData: [],
// 展开列信息
expandColumn: null,
// 树节点列信息
treeNodeColumn: null,
hasFixedColumn: false,
// 已展开的行集合
rowExpandedMaps: {},
// 懒加载中的展开行的集合
rowExpandLazyLoadedMaps: {},
// 已展开树节点集合
treeExpandedMaps: {},
// 懒加载中的树节点的集合
treeExpandLazyLoadedMaps: {},
// 树节点不确定状态的集合
treeIndeterminateMaps: {},
// 合并单元格的对象集
mergeList: [],
// 合并表尾数据的对象集
mergeFooterList: [],
// 刷新列标识，当列筛选被改变时，触发表格刷新数据
upDataFlag: 0,
// 刷新列标识，当列的特定属性被改变时，触发表格刷新列
reColumnFlag: 0,
// 已标记的对象集
pendingRowMaps: {},
// 已标记的行
pendingRowList: [],
// 初始化标识
initStore: {
filter: false,
import: false,
export: false
},
// 当前选中的筛选列
filterStore: {
isAllSelected: false,
isIndeterminate: false,
style: null,
options: [],
column: null,
multiple: false,
visible: false,
maxHeight: null
},
// 存放列相关的信息
columnStore: {
leftList: [],
centerList: [],
rightList: [],
resizeList: [],
pxList: [],
pxMinList: [],
scaleList: [],
scaleMinList: [],
autoList: []
},
// 存放快捷菜单的信息
ctxMenuStore: {
selected: null,
visible: false,
showChild: false,
selectChild: null,
list: [],
style: null
},
// 存放可编辑相关信息
editStore: {
indexs: {
columns: []
},
titles: {
columns: []
},
// 选中源
selected: {
row: null,
column: null
},
// 已复制源
copyed: {
cut: false,
rows: [],
columns: []
},
// 激活
actived: {
row: null,
column: null
},
insertMaps: {},
removeMaps: {}
},
// 存放 tooltip 相关信息
tooltipStore: {
row: null,
column: null,
content: null,
visible: false,
currOpts: null
},
// 存放数据校验相关信息
validStore: {
visible: false
},
validErrorMaps: {},
// 导入相关信息
importStore: {
inited: false,
file: null,
type: '',
modeList: [],
typeList: [],
filename: '',
visible: false
},
importParams: {
mode: '',
types: null,
message: true
},
// 导出相关信息
exportStore: {
inited: false,
name: '',
modeList: [],
typeList: [],
columns: [],
isPrint: false,
hasFooter: false,
hasMerge: false,
hasTree: false,
hasColgroup: false,
visible: false
},
exportParams: {
filename: '',
sheetName: '',
mode: '',
type: '',
isColgroup: false,
isMerge: false,
isAllExpand: false,
useStyle: false,
original: false,
message: true,
isHeader: false,
isFooter: false
},
scrollVMLoading: false,
_isResize: false
});
var internalData = {
tZindex: 0,
elemStore: {},
// 存放横向 X 虚拟滚动相关的信息
scrollXStore: {
offsetSize: 0,
visibleSize: 0,
startIndex: 0,
endIndex: 0
},
// 存放纵向 Y 虚拟滚动相关信息
scrollYStore: {
rowHeight: 0,
offsetSize: 0,
visibleSize: 0,
startIndex: 0,
endIndex: 0
},
// 表格宽度
tableWidth: 0,
// 表格高度
tableHeight: 0,
// 表头高度
headerHeight: 0,
// 表尾高度
footerHeight: 0,
customHeight: 0,
customMinHeight: 0,
customMaxHeight: 0,
// 当前 hover 行
hoverRow: null,
// 最后滚动位置
lastScrollLeft: 0,
lastScrollTop: 0,
// 单选框属性，已选中保留的行
radioReserveRow: null,
// 复选框属性，已选中保留的行集合
checkboxReserveRowMap: {},
// 行数据，已展开保留的行集合
rowExpandedReserveRowMap: {},
// 树结构数据，已展开保留的行集合
treeExpandedReserveRowMap: {},
// 树结构数据，不确定状态的集合
treeIndeterminateRowMaps: {},
// 列表完整数据、条件处理后
tableFullData: [],
afterFullData: [],
afterTreeFullData: [],
// 列表条件处理后数据集合
afterFullRowMaps: {},
// 树结构完整数据、条件处理后
tableFullTreeData: [],
tableSynchData: [],
tableSourceData: [],
// 收集的列配置（带分组）
collectColumn: [],
// 完整所有列（不带分组）
tableFullColumn: [],
// 渲染所有列
visibleColumn: [],
// 总的缓存数据集
fullAllDataRowIdData: {},
// 渲染中缓存数据
sourceDataRowIdData: {},
fullDataRowIdData: {},
fullColumnIdData: {},
fullColumnFieldData: {},
inited: false,
tooltipTimeout: null,
initStatus: false,
isActivated: false
};
var tableMethods = {};
var tablePrivateMethods = {};
var refElem = ref();
var refTooltip = ref();
var refCommTooltip = ref();
var refValidTooltip = ref();
var refTableFilter = ref();
var refTableMenu = ref();
var refTableHeader = ref();
var refTableBody = ref();
var refTableFooter = ref();
var refTableLeftHeader = ref();
var refTableLeftBody = ref();
var refTableLeftFooter = ref();
var refTableRightHeader = ref();
var refTableRightBody = ref();
var refTableRightFooter = ref();
var refLeftContainer = ref();
var refRightContainer = ref();
var refCellResizeBar = ref();
var refEmptyPlaceholder = ref();
var $xegrid = inject('$xegrid', null);
var $xetoolbar;
var computeValidOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.validConfig, props.validConfig);
});
var computeSXOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.scrollX, props.scrollX);
});
var computeSYOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.scrollY, props.scrollY);
});
var computeRowHeightMaps = computed(function () {
return {
default: 48,
medium: 44,
small: 40,
mini: 36
};
});
var computeColumnOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.columnConfig, props.columnConfig);
});
var computeRowOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.rowConfig, props.rowConfig);
});
var computeResizeleOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.resizeConfig, props.resizeConfig);
});
var computeResizableOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.resizableConfig, props.resizableConfig);
});
var computeSeqOpts = computed(function () {
return Object.assign({ startIndex: 0 }, GlobalConfig.table.seqConfig, props.seqConfig);
});
var computeRadioOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.radioConfig, props.radioConfig);
});
var computeCheckboxOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.checkboxConfig, props.checkboxConfig);
});
var computeTooltipOpts = ref();
computeTooltipOpts = computed(function () {
return Object.assign({}, GlobalConfig.tooltip, GlobalConfig.table.tooltipConfig, props.tooltipConfig);
});
var computeTipConfig = computed(function () {
var tooltipStore = reactData.tooltipStore;
var tooltipOpts = computeTooltipOpts.value;
return __assign(__assign({}, tooltipOpts), tooltipStore.currOpts);
});
var computeValidTipOpts = computed(function () {
var tooltipOpts = computeTooltipOpts.value;
return Object.assign({ isArrow: false }, tooltipOpts);
});
var computeEditOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.editConfig, props.editConfig);
});
var computeSortOpts = computed(function () {
return Object.assign({ orders: ['asc', 'desc', null] }, GlobalConfig.table.sortConfig, props.sortConfig);
});
var computeFilterOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.filterConfig, props.filterConfig);
});
var computeMouseOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.mouseConfig, props.mouseConfig);
});
var computeAreaOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.areaConfig, props.areaConfig);
});
var computeKeyboardOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.keyboardConfig, props.keyboardConfig);
});
var computeClipOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.clipConfig, props.clipConfig);
});
var computeFNROpts = computed(function () {
return Object.assign({}, GlobalConfig.table.fnrConfig, props.fnrConfig);
});
var computeMenuOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.menuConfig, props.menuConfig);
});
var computeHeaderMenu = computed(function () {
var menuOpts = computeMenuOpts.value;
var headerOpts = menuOpts.header;
return headerOpts && headerOpts.options ? headerOpts.options : [];
});
var computeBodyMenu = computed(function () {
var menuOpts = computeMenuOpts.value;
var bodyOpts = menuOpts.body;
return bodyOpts && bodyOpts.options ? bodyOpts.options : [];
});
var computeFooterMenu = computed(function () {
var menuOpts = computeMenuOpts.value;
var footerOpts = menuOpts.footer;
return footerOpts && footerOpts.options ? footerOpts.options : [];
});
var computeIsMenu = computed(function () {
var menuOpts = computeMenuOpts.value;
var headerMenu = computeHeaderMenu.value;
var bodyMenu = computeBodyMenu.value;
var footerMenu = computeFooterMenu.value;
return !!(props.menuConfig && isEnableConf(menuOpts) && (headerMenu.length || bodyMenu.length || footerMenu.length));
});
var computeMenuList = computed(function () {
var ctxMenuStore = reactData.ctxMenuStore;
var rest = [];
ctxMenuStore.list.forEach(function (list) {
list.forEach(function (item) {
rest.push(item);
});
});
return rest;
});
var computeExportOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.exportConfig, props.exportConfig);
});
var computeImportOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.importConfig, props.importConfig);
});
var computePrintOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.printConfig, props.printConfig);
});
var computeExpandOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.expandConfig, props.expandConfig);
});
var computeTreeOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.treeConfig, props.treeConfig);
});
var computeEmptyOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.emptyRender, props.emptyRender);
});
var computeLoadingOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.loadingConfig, props.loadingConfig);
});
var computeCellOffsetWidth = computed(function () {
return props.border ? Math.max(2, Math.ceil(reactData.scrollbarWidth / reactData.tableColumn.length)) : 1;
});
var computeCustomOpts = computed(function () {
return Object.assign({}, GlobalConfig.table.customConfig, props.customConfig);
});
var computeFixedColumnSize = computed(function () {
var tableFullColumn = internalData.tableFullColumn;
var fixedSize = 0;
tableFullColumn.forEach(function (column) {
if (column.fixed) {
fixedSize++;
}
});
return fixedSize;
});
var computeIsMaxFixedColumn = computed(function () {
var fixedColumnSize = computeFixedColumnSize.value;
var columnOpts = computeColumnOpts.value;
var maxFixedSize = columnOpts.maxFixedSize;
if (maxFixedSize) {
return fixedColumnSize >= maxFixedSize;
}
return false;
});
var computeTableBorder = computed(function () {
var border = props.border;
if (border === true) {
return 'full';
}
if (border) {
return border;
}
return 'default';
});
var computeIsAllCheckboxDisabled = computed(function () {
var treeConfig = props.treeConfig;
var tableData = reactData.tableData;
var tableFullData = internalData.tableFullData;
var checkboxOpts = computeCheckboxOpts.value;
var strict = checkboxOpts.strict, checkMethod = checkboxOpts.checkMethod;
if (strict) {
if (tableData.length || tableFullData.length) {
if (checkMethod) {
if (treeConfig) {
// 暂时不支持树形结构
}
// 如果所有行都被禁用
return tableFullData.every(function (row) { return !checkMethod({ row: row }); });
}
return false;
}
return true;
}
return false;
});
var refMaps = {
refElem: refElem,
refTooltip: refTooltip,
refValidTooltip: refValidTooltip,
refTableFilter: refTableFilter,
refTableMenu: refTableMenu,
refTableHeader: refTableHeader,
refTableBody: refTableBody,
refTableFooter: refTableFooter,
refTableLeftHeader: refTableLeftHeader,
refTableLeftBody: refTableLeftBody,
refTableLeftFooter: refTableLeftFooter,
refTableRightHeader: refTableRightHeader,
refTableRightBody: refTableRightBody,
refTableRightFooter: refTableRightFooter,
refLeftContainer: refLeftContainer,
refRightContainer: refRightContainer,
refCellResizeBar: refCellResizeBar
};
var computeMaps = {
computeSize: computeSize,
computeValidOpts: computeValidOpts,
computeSXOpts: computeSXOpts,
computeSYOpts: computeSYOpts,
computeColumnOpts: computeColumnOpts,
computeRowOpts: computeRowOpts,
computeResizeleOpts: computeResizeleOpts,
computeResizableOpts: computeResizableOpts,
computeSeqOpts: computeSeqOpts,
computeRadioOpts: computeRadioOpts,
computeCheckboxOpts: computeCheckboxOpts,
computeTooltipOpts: computeTooltipOpts,
computeEditOpts: computeEditOpts,
computeSortOpts: computeSortOpts,
computeFilterOpts: computeFilterOpts,
computeMouseOpts: computeMouseOpts,
computeAreaOpts: computeAreaOpts,
computeKeyboardOpts: computeKeyboardOpts,
computeClipOpts: computeClipOpts,
computeFNROpts: computeFNROpts,
computeHeaderMenu: computeHeaderMenu,
computeBodyMenu: computeBodyMenu,
computeFooterMenu: computeFooterMenu,
computeIsMenu: computeIsMenu,
computeMenuOpts: computeMenuOpts,
computeExportOpts: computeExportOpts,
computeImportOpts: computeImportOpts,
computePrintOpts: computePrintOpts,
computeExpandOpts: computeExpandOpts,
computeTreeOpts: computeTreeOpts,
computeEmptyOpts: computeEmptyOpts,
computeLoadingOpts: computeLoadingOpts,
computeCustomOpts: computeCustomOpts,
computeFixedColumnSize: computeFixedColumnSize,
computeIsMaxFixedColumn: computeIsMaxFixedColumn,
computeIsAllCheckboxDisabled: computeIsAllCheckboxDisabled
};
var $xetable = {
xID: xID,
props: props,
context: context,
instance: instance,
reactData: reactData,
internalData: internalData,
getRefMaps: function () { return refMaps; },
getComputeMaps: function () { return computeMaps; },
xegrid: $xegrid
};
var eqCellValue = function (row1, row2, field) {
var val1 = XEUtils.get(row1, field);
var val2 = XEUtils.get(row2, field);
if (eqEmptyValue(val1) && eqEmptyValue(val2)) {
return true;
}
if (XEUtils.isString(val1) || XEUtils.isNumber(val1)) {
return ('' + val1) === ('' + val2);
}
return XEUtils.isEqual(val1, val2);
};
var getNextSortOrder = function (column) {
var sortOpts = computeSortOpts.value;
var orders = sortOpts.orders;
var currOrder = column.order || null;
var oIndex = orders.indexOf(currOrder) + 1;
return orders[oIndex < orders.length ? oIndex : 0];
};
var getCustomStorageMap = function (key) {
var version = GlobalConfig.version;
var rest = XEUtils.toStringJSON(localStorage.getItem(key) || '');
return rest && rest._v === version ? rest : { _v: version };
};
var getRecoverRowMaps = function (keyMaps) {
var fullAllDataRowIdData = internalData.fullAllDataRowIdData;
var restKeys = {};
XEUtils.each(keyMaps, function (row, rowid) {
if (fullAllDataRowIdData[rowid]) {
restKeys[rowid] = row;
}
});
return restKeys;
};
var handleReserveRow = function (reserveRowMap) {
var fullDataRowIdData = internalData.fullDataRowIdData;
var reserveList = [];
XEUtils.each(reserveRowMap, function (item, rowid) {
if (fullDataRowIdData[rowid] && $xetable.findRowIndexOf(reserveList, fullDataRowIdData[rowid].row) === -1) {
reserveList.push(fullDataRowIdData[rowid].row);
}
});
return reserveList;
};
var computeVirtualX = function () {
var visibleColumn = internalData.visibleColumn;
var tableBody = refTableBody.value;
var tableBodyElem = tableBody ? tableBody.$el : null;
if (tableBodyElem) {
var scrollLeft = tableBodyElem.scrollLeft, clientWidth = tableBodyElem.clientWidth;
var endWidth = scrollLeft + clientWidth;
var toVisibleIndex = -1;
var cWidth = 0;
var visibleSize = 0;
for (var colIndex = 0, colLen = visibleColumn.length; colIndex < colLen; colIndex++) {
cWidth += visibleColumn[colIndex].renderWidth;
if (toVisibleIndex === -1 && scrollLeft < cWidth) {
toVisibleIndex = colIndex;
}
if (toVisibleIndex >= 0) {
visibleSize++;
if (cWidth > endWidth) {
break;
}
}
}
return { toVisibleIndex: Math.max(0, toVisibleIndex), visibleSize: Math.max(8, visibleSize) };
}
return { toVisibleIndex: 0, visibleSize: 8 };
};
var computeVirtualY = function () {
var tableHeader = refTableHeader.value;
var tableBody = refTableBody.value;
var tableBodyElem = tableBody ? tableBody.$el : null;
var vSize = computeSize.value;
var rowHeightMaps = computeRowHeightMaps.value;
if (tableBodyElem) {
var tableHeaderElem = tableHeader ? tableHeader.$el : null;
var rowHeight = 0;
var firstTrElem = void 0;
firstTrElem = tableBodyElem.querySelector('tr');
if (!firstTrElem && tableHeaderElem) {
firstTrElem = tableHeaderElem.querySelector('tr');
}
if (firstTrElem) {
rowHeight = firstTrElem.clientHeight;
}
if (!rowHeight) {
rowHeight = rowHeightMaps[vSize || 'default'];
}
var visibleSize = Math.max(8, Math.ceil(tableBodyElem.clientHeight / rowHeight) + 2);
return { rowHeight: rowHeight, visibleSize: visibleSize };
}
return { rowHeight: 0, visibleSize: 8 };
};
var calculateMergerOffserIndex = function (list, offsetItem, type) {
for (var mcIndex = 0, len = list.length; mcIndex < len; mcIndex++) {
var mergeItem = list[mcIndex];
var startIndex = offsetItem.startIndex, endIndex = offsetItem.endIndex;
var mergeStartIndex = mergeItem[type];
var mergeSpanNumber = mergeItem[type + 'span'];
var mergeEndIndex = mergeStartIndex + mergeSpanNumber;
if (mergeStartIndex < startIndex && startIndex < mergeEndIndex) {
offsetItem.startIndex = mergeStartIndex;
}
if (mergeStartIndex < endIndex && endIndex < mergeEndIndex) {
offsetItem.endIndex = mergeEndIndex;
}
if (offsetItem.startIndex !== startIndex || offsetItem.endIndex !== endIndex) {
mcIndex = -1;
}
}
};
var setMerges = function (merges, mList, rowList) {
if (merges) {
var treeConfig = props.treeConfig;
var visibleColumn_1 = internalData.visibleColumn;
if (!XEUtils.isArray(merges)) {
merges = [merges];
}
if (treeConfig && merges.length) {
errLog('vxe.error.noTree', ['merge-cells | merge-footer-items']);
}
merges.forEach(function (item) {
var row = item.row, col = item.col, rowspan = item.rowspan, colspan = item.colspan;
if (rowList && XEUtils.isNumber(row)) {
row = rowList[row];
}
if (XEUtils.isNumber(col)) {
col = visibleColumn_1[col];
}
if ((rowList ? row : XEUtils.isNumber(row)) && col && (rowspan || colspan)) {
rowspan = XEUtils.toNumber(rowspan) || 1;
colspan = XEUtils.toNumber(colspan) || 1;
if (rowspan > 1 || colspan > 1) {
var mcIndex = XEUtils.findIndexOf(mList, function (item) { return (item._row === row || getRowid($xetable, item._row) === getRowid($xetable, row)) && (item._col.id === col || item._col.id === col.id); });
var mergeItem = mList[mcIndex];
if (mergeItem) {
mergeItem.rowspan = rowspan;
mergeItem.colspan = colspan;
mergeItem._rowspan = rowspan;
mergeItem._colspan = colspan;
}
else {
var mergeRowIndex = rowList ? $xetable.findRowIndexOf(rowList, row) : row;
var mergeColIndex = tableMethods.getVTColumnIndex(col);
mList.push({
row: mergeRowIndex,
col: mergeColIndex,
rowspan: rowspan,
colspan: colspan,
_row: row,
_col: col,
_rowspan: rowspan,
_colspan: colspan
});
}
}
}
});
}
};
var removeMerges = function (merges, mList, rowList) {
var rest = [];
if (merges) {
var treeConfig = props.treeConfig;
var visibleColumn_2 = internalData.visibleColumn;
if (!XEUtils.isArray(merges)) {
merges = [merges];
}
if (treeConfig && merges.length) {
errLog('vxe.error.noTree', ['merge-cells | merge-footer-items']);
}
merges.forEach(function (item) {
var row = item.row, col = item.col;
if (rowList && XEUtils.isNumber(row)) {
row = rowList[row];
}
if (XEUtils.isNumber(col)) {
col = visibleColumn_2[col];
}
var mcIndex = XEUtils.findIndexOf(mList, function (item) { return (item._row === row || getRowid($xetable, item._row) === getRowid($xetable, row)) && (item._col.id === col || item._col.id === col.id); });
if (mcIndex > -1) {
var rItems = mList.splice(mcIndex, 1);
rest.push(rItems[0]);
}
});
}
return rest;
};
var clearAllSort = function () {
var tableFullColumn = internalData.tableFullColumn;
tableFullColumn.forEach(function (column) {
column.order = null;
});
};
var calcHeight = function (key) {
var parentHeight = reactData.parentHeight;
var val = props[key];
var num = 0;
if (val) {
if (val === 'auto') {
num = parentHeight;
}
else {
var excludeHeight = $xetable.getExcludeHeight();
if (isScale(val)) {
num = Math.floor((XEUtils.toInteger(val) || 1) / 100 * parentHeight);
}
else {
num = XEUtils.toNumber(val);
}
num = Math.max(40, num - excludeHeight);
}
}
return num;
};
/**
* 还原自定义列操作状态
*/
var restoreCustomStorage = function () {
var id = props.id, customConfig = props.customConfig;
var collectColumn = internalData.collectColumn;
var customOpts = computeCustomOpts.value;
var storage = customOpts.storage;
var isCustomResizable = storage === true || (storage && storage.resizable);
var isCustomVisible = storage === true || (storage && storage.visible);
var isCustomFixed = storage === true || (storage && storage.fixed);
var isCustomOrder = storage === true || (storage && storage.order);
if (customConfig && (isCustomResizable || isCustomVisible || isCustomFixed || isCustomOrder)) {
var customMap_1 = {};
if (!id) {
errLog('vxe.error.reqProp', ['id']);
return;
}
// 自定义列宽
if (isCustomResizable) {
var columnWidthStorage = getCustomStorageMap(resizableStorageKey)[id];
if (columnWidthStorage) {
XEUtils.each(columnWidthStorage, function (resizeWidth, colKey) {
customMap_1[colKey] = { resizeWidth: resizeWidth };
});
}
}
// 自定义固定列
if (isCustomFixed) {
var columnFixedStorage = getCustomStorageMap(fixedStorageKey)[id];
if (columnFixedStorage) {
var colFixeds = columnFixedStorage.split(',');
colFixeds.forEach(function (fixConf) {
var _a = fixConf.split('|'), colKey = _a[0], fixed = _a[1];
if (customMap_1[colKey]) {
customMap_1[colKey].fixed = fixed;
}
else {
customMap_1[colKey] = { fixed: fixed };
}
});
}
}
// 自定义顺序
if (isCustomOrder) {
var columnOrderStorage = getCustomStorageMap(orderStorageKey)[id];
if (columnOrderStorage) {
// const colOrderSeqs = columnOrderStorage.split(',')
// colOrderSeqs.forEach((orderConf: any) => {
// const [colKey, order] = orderConf.split('|')
// if (customMap[colKey]) {
// customMap[colKey].order = order
// } else {
// customMap[colKey] = { order }
// }
// })
}
}
// 自定义隐藏列
if (isCustomVisible) {
var columnVisibleStorage = getCustomStorageMap(visibleStorageKey)[id];
if (columnVisibleStorage) {
var colVisibles = columnVisibleStorage.split('|');
var colHides = colVisibles[0] ? colVisibles[0].split(',') : [];
var colShows = colVisibles[1] ? colVisibles[1].split(',') : [];
colHides.forEach(function (colKey) {
if (customMap_1[colKey]) {
customMap_1[colKey].visible = false;
}
else {
customMap_1[colKey] = { visible: false };
}
});
colShows.forEach(function (colKey) {
if (customMap_1[colKey]) {
customMap_1[colKey].visible = true;
}
else {
customMap_1[colKey] = { visible: true };
}
});
}
}
var keyMap_1 = {};
XEUtils.eachTree(collectColumn, function (column) {
var colKey = column.getKey();
if (colKey) {
keyMap_1[colKey] = column;
}
});
XEUtils.each(customMap_1, function (_a, colKey) {
var visible = _a.visible, resizeWidth = _a.resizeWidth, fixed = _a.fixed, order = _a.order;
var column = keyMap_1[colKey];
if (column) {
if (XEUtils.isNumber(resizeWidth)) {
column.resizeWidth = resizeWidth;
}
if (XEUtils.isBoolean(visible)) {
column.visible = visible;
}
if (fixed) {
column.fixed = fixed;
}
if (order) {
column.customOrder = order;
}
}
});
}
};
/**
* 更新数据列的 Map
* 牺牲数据组装的耗时，用来换取使用过程中的流畅
*/
var cacheColumnMap = function () {
var tableFullColumn = internalData.tableFullColumn, collectColumn = internalData.collectColumn;
var fullColumnIdData = internalData.fullColumnIdData = {};
var fullColumnFieldData = internalData.fullColumnFieldData = {};
var mouseOpts = computeMouseOpts.value;
var columnOpts = computeColumnOpts.value;
var rowOpts = computeRowOpts.value;
var isGroup = collectColumn.some(hasChildrenList);
var isAllOverflow = !!props.showOverflow;
var expandColumn;
var treeNodeColumn;
var checkboxColumn;
var radioColumn;
var htmlColumn;
var hasFixed;
var handleFunc = function (column, index, items, path, parent) {
var colid = column.id, field = column.field, fixed = column.fixed, type = column.type, treeNode = column.treeNode;
var rest = { column: column, colid: colid, index: index, items: items, parent: parent };
if (field) {
if (process.env.NODE_ENV === 'development') {
if (fullColumnFieldData[field]) {
warnLog('vxe.error.colRepet', ['field', field]);
}
}
fullColumnFieldData[field] = rest;
}
if (!hasFixed && fixed) {
hasFixed = fixed;
}
if (!htmlColumn && type === 'html') {
htmlColumn = column;
}
if (treeNode) {
if (process.env.NODE_ENV === 'development') {
if (treeNodeColumn) {
warnLog('vxe.error.colRepet', ['tree-node', treeNode]);
}
}
if (!treeNodeColumn) {
treeNodeColumn = column;
}
}
else if (type === 'expand') {
if (process.env.NODE_ENV === 'development') {
if (expandColumn) {
warnLog('vxe.error.colRepet', ['type', type]);
}
}
if (!expandColumn) {
expandColumn = column;
}
}
if (process.env.NODE_ENV === 'development') {
if (type === 'checkbox') {
if (checkboxColumn) {
warnLog('vxe.error.colRepet', ['type', type]);
}
if (!checkboxColumn) {
checkboxColumn = column;
}
}
else if (type === 'radio') {
if (radioColumn) {
warnLog('vxe.error.colRepet', ['type', type]);
}
if (!radioColumn) {
radioColumn = column;
}
}
}
if (isAllOverflow && column.showOverflow === false) {
isAllOverflow = false;
}
if (fullColumnIdData[colid]) {
errLog('vxe.error.colRepet', ['colId', colid]);
}
fullColumnIdData[colid] = rest;
};
if (isGroup) {
XEUtils.eachTree(collectColumn, function (column, index, items, path, parent, nodes) {
column.level = nodes.length;
handleFunc(column, index, items, path, parent);
});
}
else {
tableFullColumn.forEach(handleFunc);
}
if (process.env.NODE_ENV === 'development') {
if (expandColumn && mouseOpts.area) {
errLog('vxe.error.errConflicts', ['mouse-config.area', 'column.type=expand']);
}
}
if (process.env.NODE_ENV === 'development') {
if (htmlColumn) {
if (!columnOpts.useKey) {
errLog('vxe.error.reqProp', ['column-config.useKey', 'column.type=html']);
}
if (!rowOpts.useKey) {
errLog('vxe.error.reqProp', ['row-config.useKey', 'column.type=html']);
}
}
}
reactData.isGroup = isGroup;
reactData.treeNodeColumn = treeNodeColumn;
reactData.expandColumn = expandColumn;
reactData.isAllOverflow = isAllOverflow;
};
var updateHeight = function () {
internalData.customHeight = calcHeight('height');
internalData.customMinHeight = calcHeight('minHeight');
internalData.customMaxHeight = calcHeight('maxHeight');
};
/**
* 列宽算法
* 支持 px、%、固定 混合分配
* 支持动态列表调整分配
* 支持自动分配偏移量
*/
var autoCellWidth = function () {
var tableHeader = refTableHeader.value;
var tableBody = refTableBody.value;
var tableFooter = refTableFooter.value;
var bodyElem = tableBody ? tableBody.$el : null;
var headerElem = tableHeader ? tableHeader.$el : null;
var footerElem = tableFooter ? tableFooter.$el : null;
if (!bodyElem) {
return;
}
var tableWidth = 0;
var minCellWidth = 40; // 列宽最少限制 40px
var bodyWidth = bodyElem.clientWidth - 1;
var remainWidth = bodyWidth;
var meanWidth = remainWidth / 100;
var fit = props.fit;
var columnStore = reactData.columnStore;
var resizeList = columnStore.resizeList, pxMinList = columnStore.pxMinList, pxList = columnStore.pxList, scaleList = columnStore.scaleList, scaleMinList = columnStore.scaleMinList, autoList = columnStore.autoList;
// 最小宽
pxMinList.forEach(function (column) {
var minWidth = XEUtils.toInteger(column.minWidth);
tableWidth += minWidth;
column.renderWidth = minWidth;
});
// 最小百分比
scaleMinList.forEach(function (column) {
var scaleWidth = Math.floor(XEUtils.toInteger(column.minWidth) * meanWidth);
tableWidth += scaleWidth;
column.renderWidth = scaleWidth;
});
// 固定百分比
scaleList.forEach(function (column) {
var scaleWidth = Math.floor(XEUtils.toInteger(column.width) * meanWidth);
tableWidth += scaleWidth;
column.renderWidth = scaleWidth;
});
// 固定宽
pxList.forEach(function (column) {
var width = XEUtils.toInteger(column.width);
tableWidth += width;
column.renderWidth = width;
});
// 调整了列宽
resizeList.forEach(function (column) {
var width = XEUtils.toInteger(column.resizeWidth);
tableWidth += width;
column.renderWidth = width;
});
remainWidth -= tableWidth;
meanWidth = remainWidth > 0 ? Math.floor(remainWidth / (scaleMinList.length + pxMinList.length + autoList.length)) : 0;
if (fit) {
if (remainWidth > 0) {
scaleMinList.concat(pxMinList).forEach(function (column) {
tableWidth += meanWidth;
column.renderWidth += meanWidth;
});
}
}
else {
meanWidth = minCellWidth;
}
// 自适应
autoList.forEach(function (column) {
var width = Math.max(meanWidth, minCellWidth);
column.renderWidth = width;
tableWidth += width;
});
if (fit) {
/**
* 偏移量算法
* 如果所有列足够放的情况下，从最后动态列开始分配
*/
var dynamicList = scaleList.concat(scaleMinList).concat(pxMinList).concat(autoList);
var dynamicSize = dynamicList.length - 1;
if (dynamicSize > 0) {
var odiffer = bodyWidth - tableWidth;
if (odiffer > 0) {
while (odiffer > 0 && dynamicSize >= 0) {
odiffer--;
dynamicList[dynamicSize--].renderWidth++;
}
tableWidth = bodyWidth;
}
}
}
var tableHeight = bodyElem.offsetHeight;
var overflowY = bodyElem.scrollHeight > bodyElem.clientHeight;
var scrollbarWidth = 0;
if (overflowY) {
scrollbarWidth = Math.max(bodyElem.offsetWidth - bodyElem.clientWidth, 0);
}
reactData.scrollbarWidth = scrollbarWidth;
reactData.overflowY = overflowY;
internalData.tableWidth = tableWidth;
internalData.tableHeight = tableHeight;
var headerHeight = 0;
if (headerElem) {
headerHeight = headerElem.clientHeight;
nextTick(function () {
// 检测是否同步滚动
if (headerElem && bodyElem && headerElem.scrollLeft !== bodyElem.scrollLeft) {
headerElem.scrollLeft = bodyElem.scrollLeft;
}
});
}
internalData.headerHeight = headerHeight;
var overflowX = false;
var footerHeight = 0;
var scrollbarHeight = 0;
if (footerElem) {
footerHeight = footerElem.offsetHeight;
overflowX = tableWidth > footerElem.clientWidth;
if (overflowX) {
scrollbarHeight = Math.max(footerHeight - footerElem.clientHeight, 0);
}
}
else {
overflowX = tableWidth > bodyWidth;
if (overflowX) {
scrollbarHeight = Math.max(tableHeight - bodyElem.clientHeight, 0);
}
}
internalData.footerHeight = footerHeight;
reactData.overflowX = overflowX;
reactData.scrollbarHeight = scrollbarHeight;
updateHeight();
reactData.parentHeight = Math.max(internalData.headerHeight + footerHeight + 20, tablePrivateMethods.getParentHeight());
if (overflowX) {
tablePrivateMethods.checkScrolling();
}
};
var getOrderField = function (column) {
var sortBy = column.sortBy, sortType = column.sortType;
return function (row) {
var cellValue;
if (sortBy) {
cellValue = XEUtils.isFunction(sortBy) ? sortBy({ row: row, column: column }) : XEUtils.get(row, sortBy);
}
else {
cellValue = tablePriva