vxe-table
Version:
A PC-end table component based on Vxe UI, supporting copy-paste, data pivot table, and high-performance virtual list table solution.
33,808 lines • 1.61 MB
JavaScript
import { VxeUI } from '@vxe-ui/core';
export { VxeUI } from '@vxe-ui/core';
import XEUtils from 'xe-utils';
import DomZIndex from 'dom-zindex';
import { defineComponent, watch, reactive, h, ref, inject, createCommentVNode, onMounted, onUnmounted, provide, nextTick, TransitionGroup, computed, Teleport, resolveComponent, onActivated, onDeactivated, onBeforeUnmount } from 'vue';
const { getConfig: getConfig$9 } = VxeUI;
function isEnableConf(conf) {
return conf && conf.enabled !== false;
}
function isEmptyValue(cellValue) {
return cellValue === null || cellValue === undefined || cellValue === '';
}
function parseFile(file) {
const name = file.name;
const tIndex = XEUtils.lastIndexOf(name, '.');
const type = name.substring(tIndex + 1, name.length).toLowerCase();
const filename = name.substring(0, tIndex);
return { filename, type };
}
function nextZIndex() {
return DomZIndex.getNext();
}
function getLastZIndex() {
return DomZIndex.getCurrent();
}
function hasChildrenList(item) {
return item && item.children && item.children.length > 0;
}
function getFuncText(content, args) {
if (XEUtils.eqNull(content)) {
return '';
}
const translate = getConfig$9().translate;
return `${translate ? translate('' + content, args) : content}`;
}
function formatText(value, placeholder) {
return '' + (isEmptyValue(value) ? (placeholder ? getConfig$9().emptyCell : '') : value);
}
/**
* 判断值为:'' | null | undefined 时都属于空值
*/
function eqEmptyValue(cellValue) {
return cellValue === '' || XEUtils.eqNull(cellValue);
}
function getDefaultConfig(val1, def1) {
return XEUtils.eqNull(val1) ? def1 : val1;
}
const version = "4.21.2";
VxeUI.version = version;
VxeUI.tableVersion = version;
VxeUI.setConfig({
emptyCell: ' ',
table: {
fit: true,
showHeader: true,
animat: true,
delayHover: 250,
autoResize: true,
// minHeight: null,
// keepSource: false,
// showOverflow: null,
// showHeaderOverflow: null,
// showFooterOverflow: null,
// resizeInterval: 500,
// size: null,
// zIndex: null,
// stripe: false,
// border: false,
// round: false,
// emptyText: '暂无数据',
// emptyRender: {
// name: ''
// },
// rowConfig: {
// keyField: '_X_ROW_KEY' // 行数据的唯一主键字段名
// },
resizeConfig: {
// refreshDelay: 20
},
resizableConfig: {
dragMode: 'auto',
showDragTip: true,
isSyncAutoHeight: true,
isSyncAutoWidth: true,
minHeight: 18
},
currentRowConfig: {
strict: true
},
currentColumnConfig: {
strict: true
},
radioConfig: {
// trigger: 'default'
strict: true
},
rowDragConfig: {
showIcon: true,
animation: true,
showGuidesStatus: true,
showDragTip: true
},
columnDragConfig: {
showIcon: true,
animation: true,
showGuidesStatus: true,
showDragTip: true
},
checkboxConfig: {
// trigger: 'default',
strict: true
},
tooltipConfig: {
mode: 'tooltip',
enterable: true,
defaultPlacement: 'top'
},
headerTooltipConfig: {
mode: 'tooltip',
enterable: true
},
footerTooltipConfig: {
mode: 'tooltip',
enterable: true
},
validConfig: {
showErrorMessage: true,
autoClear: true,
autoPos: true,
message: 'inline',
msgMode: 'single',
theme: 'beautify'
},
columnConfig: {
autoOptions: {
isCalcHeader: true,
isCalcBody: true,
isCalcFooter: true
},
maxFixedSize: 4
},
cellConfig: {
padding: true
},
headerCellConfig: {
height: 'unset'
},
footerCellConfig: {
height: 'unset'
},
menuConfig: {
// visibleMethod () {},
// transfer: false,
destroyOnClose: true
},
customConfig: {
// enabled: false,
allowVisible: true,
allowResizable: true,
allowFixed: true,
allowSort: true,
allowAlign: true,
showSortDragButton: true,
showFooter: true,
placement: 'top-right',
// storage: false,
storeOptions: {
visible: true,
resizable: true,
sort: true,
fixed: true,
align: true,
headerAlign: true,
footerAlign: true,
aggFunc: true
},
// autoAggGroupValues: false,
// checkMethod () {},
modalOptions: {
showMaximize: true,
mask: true,
lockView: true,
resize: true,
escClosable: true
},
drawerOptions: {
mask: true,
lockView: true,
escClosable: true,
resize: true
}
},
sortConfig: {
// remote: false,
// trigger: 'default',
// orders: ['asc', 'desc', null],
// sortMethod: null,
showIcon: true,
allowClear: true,
allowBtn: true,
iconLayout: 'vertical'
},
filterConfig: {
// remote: false,
// filterMethod: null,
// isEvery: false,
// transfer: false,
destroyOnClose: true,
multiple: true,
showIcon: true,
maxHeight: 280
},
floatingFilterConfig: {
// enabled: false
},
aggregateConfig: {
padding: true,
placement: 'left',
rowField: 'id',
parentField: '_X_ROW_PARENT_KEY',
childrenField: '_X_ROW_CHILDREN',
mapChildrenField: '_X_ROW_CHILD_LIST',
indent: 20,
showIcon: true,
maxGroupSize: 4,
showAggFuncTitle: true
},
treeConfig: {
padding: true,
rowField: 'id',
parentField: 'parentId',
childrenField: 'children',
hasChildField: 'hasChild',
mapChildrenField: '_X_ROW_CHILD',
indent: 20,
showIcon: true,
showRootLine: true
},
expandConfig: {
// trigger: 'default',
showIcon: true,
mode: 'fixed'
},
editConfig: {
// mode: 'cell',
// cache: true,
showIcon: true,
showAsterisk: true,
autoFocus: true,
isReuseKeep: true
},
importConfig: {
_typeMaps: {
csv: 1,
html: 1,
xml: 1,
txt: 1
}
},
exportConfig: {
_typeMaps: {
csv: 1,
html: 1,
xml: 1,
txt: 1
}
},
printConfig: {},
mouseConfig: {
extension: true
},
keyboardConfig: {
isAll: true,
isEsc: true
},
areaConfig: {
autoClear: true,
selectCellByHeader: true,
selectCellByBody: true,
extendDirection: {
top: true,
left: true,
bottom: true,
right: true
}
},
clipConfig: {
isCopy: true,
isCut: true,
isPaste: true
},
fnrConfig: {
isFind: true,
isReplace: true
},
virtualXConfig: {
// enabled: false,
gt: 24,
preSize: 1,
oSize: 0
},
virtualYConfig: {
// enabled: false,
// mode: 'wheel',
gt: 100,
preSize: 1,
oSize: 0
},
scrollbarConfig: {
// width: 14,
// height: 14,
x: {
// position: 'bottom',
visible: true
},
y: {
// position: 'right',
visible: true
}
},
undoRedoHistoryConfig: {
stackSize: 50
}
},
grid: {
// size: null,
// zoomConfig: {
// escRestore: true
// },
formConfig: {
enabled: true
},
pagerConfig: {
enabled: true
// perfect: false
},
toolbarConfig: {
enabled: true
// perfect: false
},
proxyConfig: {
enabled: true,
autoLoad: true,
showLoading: true,
showResponseMsg: true,
showActionMsg: true,
response: {
list: 'list',
result: 'result',
total: 'page.total',
footerData: 'footerData',
message: 'message'
}
// beforeItem: null,
// beforeColumn: null,
// beforeQuery: null,
// afterQuery: null,
// beforeDelete: null,
// afterDelete: null,
// beforeSave: null,
// afterSave: null
}
},
toolbar: {
// size: null,
// import: {
// mode: 'covering'
// },
// export: {
// types: ['csv', 'html', 'xml', 'txt']
// },
// buttons: []
},
gantt: {}
});
const iconPrefix = 'vxe-table-icon-';
VxeUI.setIcon({
// table
TABLE_SORT_ASC: iconPrefix + 'caret-up',
TABLE_SORT_DESC: iconPrefix + 'caret-down',
TABLE_FILTER_NONE: iconPrefix + 'funnel',
TABLE_FILTER_MATCH: iconPrefix + 'funnel',
TABLE_EDIT: iconPrefix + 'edit',
TABLE_TITLE_PREFIX: iconPrefix + 'question-circle-fill',
TABLE_TITLE_SUFFIX: iconPrefix + 'question-circle-fill',
TABLE_TREE_LOADED: iconPrefix + 'spinner roll',
TABLE_TREE_OPEN: iconPrefix + 'caret-right rotate90',
TABLE_TREE_CLOSE: iconPrefix + 'caret-right',
TABLE_EXPAND_LOADED: iconPrefix + 'spinner roll',
TABLE_EXPAND_OPEN: iconPrefix + 'arrow-right rotate90',
TABLE_EXPAND_CLOSE: iconPrefix + 'arrow-right',
TABLE_CHECKBOX_CHECKED: iconPrefix + 'checkbox-checked-fill',
TABLE_CHECKBOX_UNCHECKED: iconPrefix + 'checkbox-unchecked',
TABLE_CHECKBOX_INDETERMINATE: iconPrefix + 'checkbox-indeterminate-fill',
TABLE_CHECKBOX_DISABLED_UNCHECKED: iconPrefix + 'checkbox-unchecked-fill',
TABLE_RADIO_CHECKED: iconPrefix + 'radio-checked-fill',
TABLE_RADIO_UNCHECKED: iconPrefix + 'radio-unchecked',
TABLE_RADIO_DISABLED_UNCHECKED: iconPrefix + 'radio-unchecked-fill',
TABLE_CUSTOM_SORT: iconPrefix + 'drag-handle',
TABLE_CUSTOM_FIXED_LEFT: iconPrefix + 'fixed-left',
TABLE_CUSTOM_FIXED_RIGHT: iconPrefix + 'fixed-right',
TABLE_CUSTOM_ALIGN_LEFT: iconPrefix + 'align-left',
TABLE_CUSTOM_ALIGN_CENTER: iconPrefix + 'align-center',
TABLE_CUSTOM_ALIGN_RIGHT: iconPrefix + 'align-right',
TABLE_CUSTOM_MOVE_UP: iconPrefix + 'arrows-up',
TABLE_CUSTOM_MOVE_DN: iconPrefix + 'arrows-down',
TABLE_CUSTOM_PUT_TOP: iconPrefix + 'top',
TABLE_CUSTOM_PUT_BOTTOM: iconPrefix + 'bottom',
TABLE_MENU_OPTIONS: iconPrefix + 'arrow-right',
TABLE_MENU_OPTION_LOADING: iconPrefix + 'repeat roll',
TABLE_DRAG_ROW: iconPrefix + 'drag-handle',
TABLE_DRAG_COLUMN: iconPrefix + 'drag-handle',
TABLE_DRAG_STATUS_ROW: iconPrefix + 'sort',
TABLE_DRAG_STATUS_SUB_ROW: iconPrefix + 'add-sub',
TABLE_DRAG_STATUS_AGG_GROUP: iconPrefix + 'grouping',
TABLE_DRAG_STATUS_AGG_VALUES: iconPrefix + 'values',
TABLE_DRAG_STATUS_COLUMN: iconPrefix + 'swap',
TABLE_DRAG_DISABLED: iconPrefix + 'no-drop',
TABLE_ROW_GROUP_OPEN: iconPrefix + 'arrow-right rotate90',
TABLE_ROW_GROUP_CLOSE: iconPrefix + 'arrow-right',
TABLE_AGGREGATE_GROUPING: iconPrefix + 'grouping',
TABLE_AGGREGATE_VALUES: iconPrefix + 'values',
TABLE_AGGREGATE_SORT: iconPrefix + 'drag-handle',
TABLE_AGGREGATE_DELETE: iconPrefix + 'close',
// toolbar
TOOLBAR_TOOLS_REFRESH: iconPrefix + 'repeat',
TOOLBAR_TOOLS_REFRESH_LOADING: iconPrefix + 'repeat roll',
TOOLBAR_TOOLS_IMPORT: iconPrefix + 'upload',
TOOLBAR_TOOLS_EXPORT: iconPrefix + 'download',
TOOLBAR_TOOLS_PRINT: iconPrefix + 'print',
TOOLBAR_TOOLS_FULLSCREEN: iconPrefix + 'fullscreen',
TOOLBAR_TOOLS_MINIMIZE: iconPrefix + 'minimize',
TOOLBAR_TOOLS_CUSTOM: iconPrefix + 'setting',
TOOLBAR_TOOLS_FIXED_LEFT: iconPrefix + 'fixed-left',
TOOLBAR_TOOLS_FIXED_LEFT_ACTIVE: iconPrefix + 'fixed-left-fill',
TOOLBAR_TOOLS_FIXED_RIGHT: iconPrefix + 'fixed-right',
TOOLBAR_TOOLS_FIXED_RIGHT_ACTIVE: iconPrefix + 'fixed-right-fill'
});
const setTheme = VxeUI.setTheme;
const getTheme = VxeUI.getTheme;
const setConfig = VxeUI.setConfig;
const getConfig$8 = VxeUI.getConfig;
const setIcon = VxeUI.setIcon;
const getIcon$8 = VxeUI.getIcon;
const setLanguage = VxeUI.setLanguage;
const setI18n = VxeUI.setI18n;
const getI18n$e = VxeUI.getI18n;
const globalEvents$3 = VxeUI.globalEvents;
const globalResize$1 = VxeUI.globalResize;
const renderer$c = VxeUI.renderer;
const validators$1 = VxeUI.validators;
const menus$1 = VxeUI.menus;
const formats$2 = VxeUI.formats;
const commands$2 = VxeUI.commands;
const interceptor$1 = VxeUI.interceptor;
const clipboard = VxeUI.clipboard;
const log$1 = VxeUI.log;
const hooks$8 = VxeUI.hooks;
const use = VxeUI.use;
/**
* 已废弃
* @deprecated
*/
const setup = (options) => {
return VxeUI.setConfig(options);
};
VxeUI.setup = setup;
/**
* 已废弃
* @deprecated
*/
const config = (options) => {
return VxeUI.setConfig(options);
};
VxeUI.config = config;
/**
* 已废弃
* @deprecated
*/
const t = (key, args) => {
return VxeUI.getI18n(key, args);
};
VxeUI.t = t;
/**
* 已废弃
* @deprecated
*/
const _t = (content, args) => {
return getFuncText(content, args);
};
VxeUI._t = _t;
/**
* 已废弃,兼容老版本
* @deprecated
*/
const VXETable = VxeUI;
/**
* 已废弃,兼容老版本
* @deprecated
*/
const saveFile = (options) => {
return VxeUI.saveFile(options);
};
/**
* 已废弃,兼容老版本
* @deprecated
*/
const readFile = (options) => {
return VxeUI.readFile(options);
};
/**
* 已废弃,兼容老版本
* @deprecated
*/
const print = (options) => {
return VxeUI.print(options);
};
/**
* 已废弃,兼容老版本
* @deprecated
*/
const modal = {
/**
* 已废弃,兼容老版本
* @deprecated
*/
get(id) {
return VxeUI.modal.get(id);
},
/**
* 已废弃,兼容老版本
* @deprecated
*/
close(id) {
return VxeUI.modal.close(id);
},
/**
* 已废弃,兼容老版本
* @deprecated
*/
open(options) {
return VxeUI.modal.open(options);
},
/**
* 已废弃,兼容老版本
* @deprecated
*/
alert(content, title, options) {
return VxeUI.modal.alert(content, title, options);
},
/**
* 已废弃,兼容老版本
* @deprecated
*/
confirm(content, title, options) {
return VxeUI.modal.confirm(content, title, options);
},
/**
* 已废弃,兼容老版本
* @deprecated
*/
message(content, options) {
return VxeUI.modal.message(content, options);
},
/**
* 已废弃,兼容老版本
* @deprecated
*/
notification(content, title, options) {
return VxeUI.modal.notification(content, title, options);
}
};
const defineVxeComponent = defineComponent;
const reClsMap = {};
let tpImgEl;
function initTpImg() {
if (!tpImgEl) {
tpImgEl = new Image();
tpImgEl.src = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=';
}
return tpImgEl;
}
function getTpImg() {
if (!tpImgEl) {
return initTpImg();
}
return tpImgEl;
}
function getPropClass(property, params) {
return property ? XEUtils.isFunction(property) ? property(params) : property : '';
}
function getClsRE(cls) {
if (!reClsMap[cls]) {
reClsMap[cls] = new RegExp(`(?:^|\\s)${cls}(?!\\S)`, 'g');
}
return reClsMap[cls];
}
function isPx(val) {
return val && /^\d+(\.\d+)?(px)?$/.test(val);
}
function isScale(val) {
return val && /^\d+(\.\d+)?%$/.test(val);
}
function hasClass(elem, cls) {
if (elem) {
if (elem.classList) {
return elem.classList.contains(cls);
}
return !!(elem.className && elem.className.match && elem.className.match(getClsRE(cls)));
}
return false;
}
function removeClass(elem, cls) {
if (elem && hasClass(elem, cls)) {
elem.className = elem.className.replace(getClsRE(cls), '');
}
}
function addClass(elem, cls) {
if (elem && !hasClass(elem, cls)) {
removeClass(elem, cls);
elem.className = `${elem.className} ${cls}`;
}
}
function hasControlKey(evnt) {
return evnt.ctrlKey || evnt.metaKey;
}
function toCssUnit(val, unit = 'px') {
if (XEUtils.isNumber(val) || /^\d+$/.test(`${val}`)) {
return `${val}${unit}`;
}
return `${val || ''}`;
}
function queryElement(elem, selector) {
if (elem) {
return elem.querySelector(selector);
}
return null;
}
function getDomNode() {
const documentElement = document.documentElement;
const bodyElem = document.body;
return {
scrollTop: documentElement.scrollTop || bodyElem.scrollTop,
scrollLeft: documentElement.scrollLeft || bodyElem.scrollLeft,
visibleHeight: documentElement.clientHeight || bodyElem.clientHeight,
visibleWidth: documentElement.clientWidth || bodyElem.clientWidth
};
}
function getOffsetHeight(elem) {
return elem ? elem.offsetHeight : 0;
}
function getPaddingTopBottomSize(elem) {
if (elem) {
const computedStyle = getComputedStyle(elem);
const paddingTop = XEUtils.toNumber(computedStyle.paddingTop);
const paddingBottom = XEUtils.toNumber(computedStyle.paddingBottom);
return paddingTop + paddingBottom;
}
return 0;
}
function setScrollTop(elem, scrollTop) {
if (elem) {
elem.scrollTop = scrollTop;
}
}
function setScrollLeft(elem, scrollLeft) {
if (elem) {
elem.scrollLeft = scrollLeft;
}
}
// export function setScrollLeftAndTop (elem: HTMLElement | null, scrollLeft: number, scrollTop: number) {
// if (elem) {
// elem.scrollLeft = scrollLeft
// elem.scrollTop = scrollTop
// }
// }
function updateCellTitle(overflowElem, column) {
const content = column.type === 'html' ? overflowElem.innerText : overflowElem.textContent;
if (overflowElem.getAttribute('title') !== content) {
overflowElem.setAttribute('title', content);
}
}
function checkTargetElement(target, exEls, endEl) {
let targetEl = target;
if (!exEls || !exEls.length) {
return false;
}
const [exEl1, exEl2, exEl3] = exEls;
while (targetEl) {
if (exEl1 === targetEl || (exEl2 && targetEl === exEl2) || (exEl3 && targetEl === exEl3)) {
return true;
}
if (endEl && targetEl === endEl) {
return false;
}
targetEl = targetEl.parentElement;
}
return false;
}
/**
* 检查触发源是否属于目标节点
*/
function getEventTargetNode(evnt, container, queryCls, queryMethod) {
let targetElem;
let target = (evnt.target.shadowRoot && evnt.composed) ? (evnt.composedPath()[0] || evnt.target) : evnt.target;
while (target && target.nodeType && target !== document) {
if (queryCls && hasClass(target, queryCls) && (!queryMethod || queryMethod(target))) {
targetElem = target;
}
else if (target === container) {
return { flag: queryCls ? !!targetElem : true, container, targetElem: targetElem };
}
target = target.parentNode;
}
return { flag: false };
}
function getAbsolutePos(elem) {
const bounding = elem.getBoundingClientRect();
const boundingTop = bounding.top;
const boundingLeft = bounding.left;
const { scrollTop, scrollLeft, visibleHeight, visibleWidth } = getDomNode();
return { boundingTop, top: scrollTop + boundingTop, boundingLeft, left: scrollLeft + boundingLeft, visibleHeight, visibleWidth };
}
function hasEventInputTarget(target) {
const tagName = target ? target.tagName : '';
return tagName && ['input', 'textarea'].includes((tagName.toLowerCase()));
}
const scrollIntoViewIfNeeded = 'scrollIntoViewIfNeeded';
const scrollIntoView = 'scrollIntoView';
function scrollToView(elem) {
if (elem) {
if (elem[scrollIntoViewIfNeeded]) {
elem[scrollIntoViewIfNeeded]();
}
else if (elem[scrollIntoView]) {
elem[scrollIntoView]();
}
}
}
function triggerEvent(targetElem, type) {
if (targetElem) {
targetElem.dispatchEvent(new Event(type));
}
}
let wtlFrame;
function wheelScrollLeftTo(scrollLeft, cb) {
if (wtlFrame) {
cancelAnimationFrame(wtlFrame);
}
wtlFrame = requestAnimationFrame(() => {
cb(scrollLeft);
wtlFrame = null;
});
}
let wtaFrame;
function wheelScrollTopTo(diffNum, cb) {
if (wtaFrame) {
cancelAnimationFrame(wtaFrame);
}
wtaFrame = requestAnimationFrame(() => {
const offsetTop = diffNum;
cb(offsetTop);
wtaFrame = null;
});
}
const { log } = VxeUI;
const tableVersion = `table v${"4.21.2"}`;
function createComponentLog(name) {
const uiVersion = VxeUI.uiVersion ? `ui v${VxeUI.uiVersion}` : '';
const ganttVersion = VxeUI.ganttVersion ? `gantt v${VxeUI.ganttVersion}` : '';
const designVersion = VxeUI.designVersion ? `design v${VxeUI.designVersion}` : '';
const versionInfo = [uiVersion, tableVersion, ganttVersion, designVersion].filter(v => v).join(' ');
return {
warnLog: log.create('warn', versionInfo + '] [' + name),
errLog: log.create('error', versionInfo + '] [' + name)
};
}
log.create('warn', tableVersion);
log.create('error', tableVersion);
const { warnLog: warnLog$7, errLog: errLog$a } = createComponentLog('table');
const { getI18n: getI18n$d, formats: formats$1, renderer: renderer$b } = VxeUI;
class ColumnInfo {
/* eslint-disable @typescript-eslint/no-use-before-define */
constructor($xeTable, colConfs, { renderHeader, renderCell, renderFooter, renderData } = {}) {
const tableProps = $xeTable.props;
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const $xeGGWrapper = $xeGrid || $xeGantt;
const { type, field, width, visible, fixed, align, headerAlign, footerAlign, aggFunc, formatter, filterMultiple, cellRender, editRender, filterRender } = colConfs;
const colId = colConfs.colId || XEUtils.uniqueId('col_');
const defaultVisible = XEUtils.isBoolean(visible) ? visible : true;
const defaultRenderWidth = width && isPx(width) && width !== 'auto' ? Math.max(0, XEUtils.toInteger(width)) : 0;
const flCompConf = filterRender && isEnableConf(filterRender) ? renderer$b.get(filterRender.name) : null;
const ctFilterOptions = flCompConf ? flCompConf.createTableFilterOptions : null;
const filters = toFilters(colConfs.filters, colId);
const types = ['seq', 'checkbox', 'radio', 'expand', 'html'];
if (type && types.indexOf(type) === -1) {
warnLog$7('vxe.error.errProp', [`type=${type}`, types.join(', ')]);
}
if (XEUtils.isBoolean(cellRender) || (cellRender && !XEUtils.isObject(cellRender))) {
warnLog$7('vxe.error.errProp', [`column.cell-render=${cellRender}`, 'column.cell-render={}']);
}
if (XEUtils.isBoolean(editRender) || (editRender && !XEUtils.isObject(editRender))) {
warnLog$7('vxe.error.errProp', [`column.edit-render=${editRender}`, 'column.edit-render={}']);
}
if (type === 'expand') {
const { treeConfig } = tableProps;
const { computeTreeOpts } = $xeTable.getComputeMaps();
const treeOpts = computeTreeOpts.value;
if (treeConfig && (treeOpts.showLine || treeOpts.line)) {
errLog$a('vxe.error.errConflicts', ['tree-config.showLine', 'column.type=expand']);
}
}
if (formatter) {
if (XEUtils.isString(formatter)) {
const gFormatOpts = formats$1.get(formatter) || XEUtils[formatter];
if (!gFormatOpts || !XEUtils.isFunction(gFormatOpts.tableCellFormatMethod || gFormatOpts.cellFormatMethod)) {
errLog$a('vxe.error.notFormats', [formatter]);
}
}
else if (XEUtils.isArray(formatter)) {
const gFormatOpts = formats$1.get(formatter[0]) || XEUtils[formatter[0]];
if (!gFormatOpts || !XEUtils.isFunction(gFormatOpts.tableCellFormatMethod || gFormatOpts.cellFormatMethod)) {
errLog$a('vxe.error.notFormats', [formatter[0]]);
}
}
}
if (aggFunc) {
if (!$xeTable.handlePivotTableAggData && aggFunc !== true) {
errLog$a('vxe.error.errProp', [`column.agg-func=${aggFunc}`, 'column.agg-func=true']);
}
}
if (field && editRender) {
if (editRender.startField && `${editRender.startField}`.indexOf(field) >= 0) {
errLog$a('vxe.error.modelConflicts', [`field=${field}`, `edit-render.startField=${editRender.startField}`]);
}
if (editRender.endField && `${editRender.endField}`.indexOf(field) >= 0) {
errLog$a('vxe.error.modelConflicts', [`field=${field}`, `edit-render.endField=${editRender.endField}`]);
}
}
Object.assign(this, {
// 基本属性
type: colConfs.type,
property: colConfs.field,
field: field,
title: colConfs.title,
width: colConfs.width,
minWidth: colConfs.minWidth,
maxWidth: colConfs.maxWidth,
resizable: colConfs.resizable,
fixed,
align,
headerAlign,
footerAlign,
showOverflow: colConfs.showOverflow,
showHeaderOverflow: colConfs.showHeaderOverflow,
showFooterOverflow: colConfs.showFooterOverflow,
className: colConfs.className,
headerClassName: colConfs.headerClassName,
footerClassName: colConfs.footerClassName,
formatter: formatter,
headerFormatter: colConfs.headerFormatter,
footerFormatter: colConfs.footerFormatter,
padding: colConfs.padding,
verticalAlign: colConfs.verticalAlign,
sortable: colConfs.sortable,
sortBy: colConfs.sortBy,
sortType: colConfs.sortType,
filters: filters,
filterMultiple: XEUtils.isBoolean(filterMultiple) ? filterMultiple : true,
filterMethod: colConfs.filterMethod,
filterResetMethod: colConfs.filterResetMethod,
filterRecoverMethod: colConfs.filterRecoverMethod,
filterRender: filterRender,
floatingFilters: colConfs.floatingFilters,
rules: colConfs.rules,
rowGroupNode: colConfs.rowGroupNode,
treeNode: colConfs.treeNode,
dragSort: colConfs.dragSort,
rowResize: colConfs.rowResize,
cellType: colConfs.cellType,
cellRender: cellRender,
editRender: editRender,
contentRender: colConfs.contentRender,
headerExportMethod: colConfs.headerExportMethod,
exportMethod: colConfs.exportMethod,
footerExportMethod: colConfs.footerExportMethod,
titleHelp: colConfs.titleHelp,
titlePrefix: colConfs.titlePrefix,
titleSuffix: colConfs.titleSuffix,
aggFunc,
copyMethod: colConfs.copyMethod,
cutMethod: colConfs.cutMethod,
pasteMethod: colConfs.pasteMethod,
// 自定义参数
params: colConfs.params,
// 渲染属性
id: colId,
parentId: null,
visible: defaultVisible,
// 内部属性(一旦被使用,将导致不可升级版本)
defaultParentId: null,
halfVisible: false,
defaultVisible: defaultVisible,
defaultFixed: fixed,
defaultAlign: align,
defaultHeaderAlign: headerAlign,
defaultFooterAlign: footerAlign,
defaultAggFunc: aggFunc,
checked: false,
halfChecked: false,
disabled: false,
// 分组层级
level: 1,
// 跨行
rowSpan: 1,
// 跨列
colSpan: 1,
// 数据排序
order: null, // 用于记录排序类型,升序和倒序
sortTime: 0, // 用于多列的先后顺序
// 列排序
sortNumber: 0, // 用于记录自定义列顺序
renderSortNumber: 0, // 用于记录自定义列顺序
renderAggFn: '',
renderAggDigits: null,
renderAggFormat: null,
renderAlign: '',
renderHeaderAlign: '',
renderFooterAlign: '',
renderFixed: '',
renderVisible: false,
renderWidth: defaultRenderWidth,
renderHeight: 0,
renderResizeWidth: 0,
renderAutoWidth: 0,
resizeWidth: 0, // 手动调整
renderLeft: 0,
renderArgs: [], // 渲染参数可用于扩展
model: {},
renderHeader: renderHeader || colConfs.renderHeader,
renderCell: renderCell || colConfs.renderCell,
renderFooter: renderFooter || colConfs.renderFooter,
renderData: renderData,
// 单元格插槽,只对 grid 有效
slots: colConfs.slots
});
if (ctFilterOptions && (!filters || !filters.length)) {
this.filters = toFilters(ctFilterOptions({ $table: $xeTable, column: this }), colId);
}
if ($xeGGWrapper) {
const { computeProxyOpts } = $xeGGWrapper.getComputeMaps();
const proxyOpts = computeProxyOpts.value;
if (proxyOpts.beforeColumn) {
proxyOpts.beforeColumn({ $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt, column: this });
}
}
}
getTitle() {
return getFuncText(this.title || (this.type === 'seq' ? getI18n$d('vxe.table.seqTitle') : ''));
}
getKey() {
const { type, field } = this;
return field || (type ? `type=${type}` : null);
}
update(name, value) {
// 不支持直接修改的属性
if (name !== 'filters') {
if (name === 'field') {
// 兼容旧属性
this.property = value;
}
this[name] = value;
}
}
}
function createInternalData$3() {
return {
tZindex: 0,
currKeyField: '',
isCurrDeepKey: false,
elemStore: {},
// 存放横向 X 虚拟滚动相关的信息
scrollXStore: {
preloadSize: 0,
offsetSize: 0,
visibleSize: 0,
visibleStartIndex: 0,
visibleEndIndex: 0,
startIndex: 0,
endIndex: 0
},
// 存放纵向 Y 虚拟滚动相关信息
scrollYStore: {
preloadSize: 0,
offsetSize: 0,
visibleSize: 0,
visibleStartIndex: 0,
visibleEndIndex: 0,
startIndex: 0,
endIndex: 0
},
// 表格宽度
tableWidth: 0,
// 表格高度
tableHeight: 0,
customHeight: 0,
customMinHeight: 0,
customMaxHeight: 0,
// 当前 hover 行
hoverRow: null,
// 最后滚动位置
lastScrollLeft: 0,
lastScrollTop: 0,
// 单选框属性,已选中保留的行
radioReserveRow: null,
// 复选框属性,已选中保留的行集合
checkboxReserveRowMap: {},
// 行数据,已展开保留的行集合
rowExpandedReserveRowMap: {},
// 树结构数据,已展开保留的行集合
treeExpandedReserveRowMap: {},
// 树结构数据,不确定状态的集合
treeIndeterminateRowMaps: {},
// 列表完整数据、条件处理后
tableFullData: [],
afterFullData: [],
afterTreeFullData: [],
afterGroupFullData: [],
// 列表条件处理后数据集合
afterFullRowMaps: {},
// 树结构完整数据、条件处理后
tableFullTreeData: [],
// 行分组全量数据、条件处理后
tableFullGroupData: [],
tableSynchData: [],
tableSourceData: [],
// 收集的列配置(带分组)
collectColumn: [],
// 完整所有列(不带分组)
tableFullColumn: [],
// 渲染所有列
visibleColumn: [],
// 全量数据集(包括当前和已删除)
fullAllDataRowIdData: {},
// 数据集(仅当前)
fullDataRowIdData: {},
// 数据集(仅可视)
visibleDataRowIdData: {},
keepUpdateFieldMaps: {},
headerFullDataColData: {},
footerFullDataRowData: {},
// 渲染中缓存数据
sourceDataRowIdData: {},
fullColumnIdData: {},
fullColumnFieldData: {},
fullCellHeightMaps: {},
fullCellStoreMaps: {},
// 当前行
currentRow: null,
// 合并表头单元格的数据
mergeHeaderList: [],
mergeHeaderMaps: {},
// 已合并单元格数据集合
mergeHeaderCellMaps: {},
mergeHeaderRowMaps: {},
mergeHeaderColMaps: {},
// 合并单元格的数据
mergeBodyList: [],
mergeBodyMaps: {},
// 已合并单元格数据集合
mergeBodyCellMaps: {},
mergeBodyRowMaps: {},
mergeBodyColMaps: {},
// 合并表尾的数据
mergeFooterList: [],
mergeFooterMaps: {},
// 已合并表尾数据集合
mergeFooterCellMaps: {},
mergeFooterRowMaps: {},
mergeFooterColMaps: {},
// 已展开的行集合
rowExpandedMaps: {},
// 懒加载中的展开行的集合
rowExpandLazyLoadedMaps: {},
// 已展开的分组行
rowGroupExpandedMaps: {},
// 已展开树节点集合
treeExpandedMaps: {},
// 懒加载中的树节点的集合
treeExpandLazyLoadedMaps: {},
// 复选框属性,已选中的行集合
selectCheckboxMaps: {},
// 已标记的对象集
pendingRowMaps: {},
// 已新增的临时行
insertRowMaps: {},
// 已删除行
removeRowMaps: {},
cvCacheMaps: {},
// 表头高度
tHeaderHeight: 0,
// 表体高度
tBodyHeight: 0,
// 表尾高度
tFooterHeight: 0,
stackHistoryStore: {
undoStacks: [],
redoStacks: []
},
teleportToWrapperElem: null,
popupToWrapperElem: null,
customPopupToElem: null,
lastSTime: 0,
// isCustomDragStatus: false,
inited: false,
tooltipTimeout: null,
initStatus: false,
isActivated: false,
// rceTimeout: undefined,
// rceRunTime: undefined,
rceDelay: 0
// _sToTime: null
};
}
function createReactData$2() {
return {
updateColFlag: 0,
// 低性能的静态列
staticColumns: [],
// 渲染的列分组
tableGroupColumn: [],
// 可视区渲染的列
tableColumn: [],
// 渲染中的数据
tableData: [],
// 是否启用了横向 X 可视渲染方式加载
scrollXLoad: false,
// 是否启用了纵向 Y 可视渲染方式加载
scrollYLoad: false,
// 是否存在纵向滚动条
overflowY: true,
// 是否存在横向滚动条
overflowX: false,
// 纵向滚动条的宽度
scrollbarWidth: 0,
// 横向滚动条的高度
scrollbarHeight: 0,
// 行高
rowHeight: 0,
// 表格父容器的高度
parentHeight: 0,
// 是否使用分组表头
isGroup: false,
isAllOverflow: false,
// 复选框属性,是否全选
isAllSelected: false,
// 复选框属性,有选中且非全选状态
isIndeterminate: false,
// 单选框属性,选中列
currentColumn: null,
// 单选框属性,选中行
selectRadioRow: null,
// 表尾合计数据
footerTableData: [],
// 行分组列信息
rowGroupColumn: null,
// 展开列信息
expandColumn: null,
checkboxColumn: null,
radioColumn: null,
// 树节点列信息
treeNodeColumn: null,
hasFixedColumn: false,
// 刷新列标识,当列筛选被改变时,触发表格刷新数据
upDataFlag: 0,
// 刷新列标识,当列的特定属性被改变时,触发表格刷新列
reColumnFlag: 0,
// 初始化标识
initStore: {
filter: false,
import: false,
export: false,
custom: false
},
// 自定义列相关的信息
customStore: {
btnEl: null,
isAll: false,
isIndeterminate: false,
activeBtn: false,
activeWrapper: false,
visible: false,
maxHeight: null,
defPopupStyle: {},
panePopupStyle: {},
oldSortMaps: {},
oldFixedMaps: {},
oldVisibleMaps: {}
},
customColumnList: [],
// 当前选中的筛选列
filterStore: {
isAllSelected: false,
isIndeterminate: false,
style: null,
column: null,
visible: false,
maxHeight: null
},
// 存放列相关的信息
columnStore: {
leftList: [],
centerList: [],
rightList: [],
resizeList: [],
pxList: [],
pxMinList: [],
autoMinList: [],
scaleList: [],
scaleMinList: [],
autoList: [],
remainList: []
},
// 存放快捷菜单的信息
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
},
// 当前被强制聚焦单元格,只会在鼠标点击后算聚焦
focused: {
row: null,
column: null
}
},
// 存放 tooltip 相关信息
tooltipStore: {
row: null,
column: null,
content: '',
visible: false,
type: null,
currOpts: {}
},
// 存放数据校验相关信息
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,
hasRowGroup: false,
hasColgroup: false,
visible: false
},
exportParams: {
filename: '',
sheetName: '',
mode: '',
type: '',
isColgroup: false,
isMerge: false,
isTreeAllExpanded: false,
isRowGroupAllExpanded: false,
useStyle: false,
original: false,
message: true,
isHeader: false,
isTitle: false,
isFooter: false
},
visiblwRowsFlag: 1,
isRowGroupStatus: false,
rowGroupList: [],
aggHandleFields: [],
aggHandleAggColumns: [],
rowGroupExpandedFlag: 1,
rowExpandedFlag: 1,
treeExpandedFlag: 1,
updateCheckboxFlag: 1,
pendingRowFlag: 1,
insertRowFlag: 1,
removeRowFlag: 1,
mergeHeadFlag: 1,
mergeBodyFlag: 1,
mergeFootFlag: 1,
rowHeightStore: {
xlarge: 54,
large: 52,
default: 48,
medium: 44,
small: 40,
mini: 36
},
scrollVMLoading: false,
scrollYHeight: 0,
scrollYTop: 0,
isScrollYBig: false,
scrollXLeft: 0,
scrollXWidth: 0,
isScrollXBig: false,
lazScrollLoading: false,
rowExpandHeightFlag: 1,
calcCellHeightFlag: 1,
resizeHeightFlag: 1,
resizeWidthFlag: 1,
isCustomStatus: false,
isCustomDragStatus: true,
ctPopupFlag: 1,
isCrossDragRow: false,
dragRow: null,
isCrossDragCol: false,
dragCol: null,
dragTipText: '',
isDragResize: false,
isRowLoading: false,
isColLoading: false
};
}
const maxKey = '__max';
function getRowMaxHeight(chRest, isForce) {
if (isForce || !chRest[maxKey]) {
let max = 0;
for (const key in chRest) {
const val = chRest[key];
if (key !== maxKey && XEUtils.isNumber(val) && val > max) {
max = val;
}
}
chRest[maxKey] = max;
return max;
}
return chRest[maxKey];
}
const getAllConvertColumns = (columns, parentColumn) => {
const result = [];
columns.forEach((column) => {
column.parentId = parentColumn ? parentColumn.id : null;
if (column.visible) {
if (column.children && column.children.length && column.children.some((column) => column.visible)) {
result.push(column);
result.push(...getAllConvertColumns(column.children, column));
}
else {
result.push(column);
}
}
});
return result;
};
const convertHeaderColumnToRows = (originColumns) => {
let maxLevel = 1;
const traverse = (column, parent) => {
if (parent) {
column.level = parent.level + 1;
if (maxLevel < column.level) {
maxLevel = column.level;
}
}
if (column.children && column.children.length && column.children.some((column) => column.visible)) {
let colSpan = 0;
column.children.forEach((subColumn) => {
if (subColumn.visible) {
traverse(subColumn, column);
colSpan += subColumn.colSpan;
}
});
column.colSpan = colSpan;
}
else {
column.colSpan = 1;
}
};
originColumns.forEach((column) => {
column.level = 1;
traverse(column);
});
const rows = [];
for (let i = 0; i < maxLevel; i++) {
rows.push([]);
}
const allColumns = getAllConvertColumns(originColumns);
allColumns.forEach((column) => {
if (column.children && column.children.length && column.children.some((column) => column.visible)) {
column.rowSpan = 1;
}
else {
column.rowSpan = maxLevel - column.level + 1;
}
rows[column.level - 1].push(column);
});
return rows;
};
function convertHeaderToGridRows(spanColumns) {
const rSize = spanColumns.length;
const cSize = spanColumns[0].reduce((sum, cell) => sum + cell.colSpan, 0);
const occupiedRows = [];
const fullRows = [];
for (let rIndex = 0; rIndex < rSize; rIndex++) {
const oCols = [];
const dCols = [];
for (let cIndex = 0; cIndex < cSize; cIndex++) {
oCols.push(false);
dCols.push('');
}
occupiedRows.push(oCols);
fullRows.push(dCols);
}
for (let rIndex = 0; rIndex < rSize; rIndex++) {
let currColIndex = 0;
for (const column of spanColumns[rIndex]) {
const { colSpan, rowSpan } = column;
let startColIndex = -1;
for (let ccIndex = currColIndex; ccIndex <= cSize - colSpan; ccIndex++) {
let oFlag = true;
for (let csIndex = 0; csIndex < colSpan; csIndex++) {
if (occupiedRows[rIndex][ccIndex + csIndex]) {
oFlag = false;
break;
}
}
if (oFlag) {
startColIndex = ccIndex;
break;
}
}
if (startColIndex === -1) {
for (let j = 0; j <= cSize - colSpan; j++) {
let oFlag = true;
for (let k = 0; k < colSpan; k++) {
if (occupiedRows[rIndex][j + k]) {
oFlag = false;
break;
}
}
if (oFlag) {
startColIndex = j;
break;
}
}
if (startColIndex === -1) {
// error
break;
}
}
for (let srIndex = rIndex; srIndex < rIndex + rowSpan; srIndex++) {
for (let scIndex = startColIndex; scIndex < startColIndex + colSpan; scIndex++) {
occupiedRows[srIndex][scIndex] = true;
fullRows[srIndex][scIndex] = column;
}
}
currColIndex = startColIndex + colSpan;
}
}
return fullRows;
}
function restoreScrollLocation($xeTable, scrollLeft, scrollTop) {
const internalData = $xeTable.internalData;
if (scrollLeft || scrollTop) {
internalData.intoRunScroll = false;
internalData.inVirtualScroll = false;
internalData.inWheelScroll = false;
internalData.inHeaderScroll = false;
internalData.inBodyScroll = false;
internalData.inFooterScroll = false;
internalData.scrollRenderType = '';
// 还原滚动状态
return $xeTable.scrollTo(scrollLeft, scrollTop);
}
return $xeTable.clearScroll();
}
function getRowUniqueId() {
return XEUtils.uniqueId('row_');
}
/**
* 生成行的唯一主键
*/
function createRowId(rowOpts, row, keyField) {
const { createKeyMethod } = rowOpts;
if (createKeyMethod) {
return createKeyMethod({ row, keyField });
}
return getRowUniqueId();
}
function hasDeepKey(rowKey) {
return rowKey.indexOf('.') > -1;
}
// 行主键 key
function getRowkey($xeTable) {
const { currKeyField } = $xeTable.internalData;
return currKeyField;
}
// 行主键 value
function getRowid($xeTable, row) {
const internalData = $xeTable.internalData;
const { isCurrDeepKey, currKeyField } = internalData;
return row ? encodeRowid((isCurrDeepKey ? getDeepRowIdByKey : getFastRowIdByKey)(row, currKeyField)) : '';
}
function createHandleUpdateRowId($xeTable) {
const internalData = $xeTable.internalData;
const { isCurrDeepKey, currKeyField } = internalData;
const { computeRowOpts } = $xeTable.getComputeMaps();
const rowOpts = computeRowOpts.value;
const updateRId = isCurrDeepKey ? updateDeepRowKey : updateFastRowKey;
return {
rowKey: currKeyField,
handleUpdateRowId(row) {
return row ? updateRId(rowOpts, row, currKeyField) : '';
}
};
}
function createHandleGetRowId($xeTable) {
const internalData = $xeTable.internalData;
const { isCurrDeepKey, currKeyField } = internalData;
const getRId = isCurrDeepKey ? getDeepRowIdByKey : getFastRowIdByKey;
return {
rowKey: currKeyField,
handleGetRowId(row) {
return row ? encodeRowid(getRId(row, currKeyField)) : '';
}
};
}
// 编码行主键
function encodeRowid(rowVal) {
return XEUtils.eqNull(rowVal) ? '' : encodeURIComponent(rowVal);
}
function getDeepRowIdByKey(row, rowKey) {
return XEUtils.get(row, rowKey);
}
function updateDeepRowKey(rowOpts, row, rowKey) {
let rowid = encodeRowid(getDeepRowIdByKey(row, rowKey));
if (eqEmptyValue(rowid)) {
const newRowid = createRowId(rowOpts, row, rowKey);
rowid = '' + newRowid;
XEUtils.set(row, rowKey, rowid);
}
return rowid;
}
function getFastRowIdByKey(row, rowKey) {
return row[rowKey];
}
function updateFastRowKey(rowOpts, row, rowKey) {
let rowid = encodeRowid(getFastRowIdByKey(row, rowKey));
if (eqEmptyValue(rowid)) {
const newRowid = createRowId(rowOpts, row, rowKey);
rowid = '' + newRowid;
row[rowKey] = newRowid;
}
return rowid;
}
function handleFieldOrColumn($xeTable, fieldOrColumn) {
if (fieldOrColumn) {
return XEUtils.isString(fieldOrColumn) || XEUtils.isNumber(fieldOrColumn) ? $xeTable.getColumnByField(`${fieldOrColumn}`) : fieldOrColumn;
}
return null;
}
function handleRowidOrRow($xeTable, rowidOrRow) {
if (rowidOrRow) {
const rowid = XEUtils.isString(rowidOrRow) || XEUtils.isNumber(rowidOrRow) ? rowidOrRow : getRowid($xeTable, rowidOrRow);
return $xeTable.getRowById(rowid);
}
return null;
}
function getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight) {
const { height, minHeight, maxHeight } = cellOpts;
let cellHeight = rowRest.resizeHeight || height || rowOpts.height || rowRest.height || defaultRowHeight;
if (maxHeight && maxHeight <= cellHeight) {
cellHeight = maxHeight;
}
if (minHeight && minHeight >= cellHeight) {
cellHeight = minHeight;
}
return cellHeight;
}
function getPaddingLeftRightSize(elem) {
if (elem) {
const computedStyle = getComputedStyle(elem);
const paddingLeft = XEUtils.toNumber(computedStyle.paddingLeft);
const paddingRight = XEUtils.toNumber(computedStyle.paddingRight);
return paddingLeft + paddingRight;
}
return 0;
}
function getElementMarginAndWidth(elem) {
if (elem) {
const computedStyle = getComputedStyle(elem);
const marginLeft = XEUtils.toNumber(computedStyle.marginLeft);
const marginRight = XEUtils.toNumber(computedStyle.marginRight);
return elem.offsetWidth + marginLeft + marginRight;
}
return 0;
}
function toFilters(filters, colid) {
if (filters) {
if (XEUtils.isArray(filters)) {
return filters.map(({ label, value, data, resetValue, checked }) => {
return { label, value, data, resetValue, checked: !!checked, _checked: !!checked, _colId: colid };
});
}
return [];
}
return filters;
}
function toTreePathSeq(path) {
return path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('');
}
function getCellValue(row, column) {
if (column) {
return XEUtils.get(row, column.field);
}
return null;
}
function setCellValue(row, column, value) {
if (column) {
XEUtils.set(row, column.field, value);
}
}
function getRefElem(refEl) {
if (refEl) {
const rest = refEl.value;
if (rest) {
return (rest.$el || rest);
}
}
return null;
}
function getCalcHeight(height) {
if (height === 'unset') {
return 0;
}
return height || 0;
}
/**
* 列宽拖动最大宽度
*/
function getColReMaxWidth(params) {
const { $table, column, cell } = params;
const internalData = $table.internalData;
const { elemStore } = internalData;
const { computeColumnOpts, computeResizableOpts } = $table.getComputeMaps();
const resizableOpts = computeResizableOpts.value;
const columnOpts = computeColumnOpts.value;
const { maxWidth: reMaxWidth } = resizableOpts;
const colMaxWidth = column.maxWidth || columnOpts.maxWidth;
// 如果自定义调整宽度逻辑
if (reMaxWidth) {
const customMaxWidth = XEUtils.isFunction(reMaxWidth) ? reMaxWidth(params) : reMaxWidth;
if (customMaxWidth !== 'auto') {
return Math.max(1, XEUtils.toNumber(customMaxWidth));
}
}
const minTitleWidth = XEUtils.floor((XEUtils.toNumber(getComputedStyle(cell).fontSize) || 14) * 1.8);
const paddingLeftRight = getPaddingLeftRightSize(cell) + getPaddingLeftRightSize(queryElement(cell, '.vxe-cell'));
const mWidth = minTitleWidth + paddingLeftRight;
// 如果设置最小宽
if (colMaxWidth) {
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
if (bodyScrollElem) {
if (isScale(colMaxWidth)) {
const bodyWidth = bodyScrollElem.clientWidth - 1;
const meanWidth = bodyWidth / 100;
return Math.max(mWidth, Math.floor(XEUtils.toInteger(colMaxWidth) * meanWidth));
}
else if (isPx(colMaxWidth)) {
return Math.max(mWidth, XEUtils.toInteger(colMaxWidth));
}
}
}
return -1;
}
/**
* 列宽拖动最小宽度
*/
function getColReMinWidth(params) {
const { $table, column, cell } = params;
const tableProps = $table.props;
const internalData = $table.internalData;
const { computeColumnOpts, computeResizableOpts } = $table.getComputeMaps();
const resizableOpts = computeResizableOpts.value;
const columnOpts = computeColumnOpts.value;
const { minWidth: reMinWidth } = resizableOpts;
// 如果自定义调整宽度逻辑
if (reMinWidth) {
const customMinWidth = XEUtils.isFunction(reMinWidth) ? reMinWidth(params) : reMinWidth;
if (customMinWidth !== 'auto') {
return Math.max(1, XEUtils.toNumber(customMinWidth));
}
}
const { elemStore } = internalData;
const { showHeaderOverflow: allColumnHeaderOverflow } = tableProps;
const { showHeaderOverflow } = column;
const colMinWidth = column.minWidth || columnOpts.minWidth;
const headOverflow = XEUtils.isUndefined(showHeaderOverflow) || XEUtils.isNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow;
const showEllipsis = headOverflow === 'ellipsis';
const showTitle = headOverflow === 'title';
const showTooltip = headOverflow === true || headOverflow === 'tooltip';
const hasEllipsis = showTitle || showTooltip || showEllipsis;
const minTitleWidth = XEUtils.floor((XEUtils.toNumber(getComputedStyle(cell).fontSize) || 14) * 1.8);
const paddingLeftRight = getPaddingLeftRightSize(cell) + getPaddingLeftRightSize(queryElement(cell, '.vxe-cell'));
let mWidth = minTitleWidth + paddingLeftRight;
// 默认最小宽处理
if (hasEllipsis) {
const dragIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--drag-handle'));
const checkboxIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--checkbox'));
const requiredIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--required-icon'));
const editIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--edit-icon'));
const prefixIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell-title-prefix-icon'));
const suffixIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell-title-suffix-icon'));
const sortIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--sort'));
const filterIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--filter'));
mWidth += dragIconWidth + checkboxIconWidth + requiredIconWidth + editIconWidth + prefixIconWidth + suffixIconWidth + filterIconWidth + sortIconWidth;
}
// 如果设置最小宽
if (colMinWidth) {
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
if (bodyScrollElem) {
if (isScale(colMinWidth)) {
const bodyWidth = bodyScrollElem.clientWidth - 1;
const meanWidth = bodyWidth / 100;
return Math.max(mWidth, Math.floor(XEUtils.toInteger(colMinWidth) * meanWidth));
}
else if (isPx(colMinWidth)) {
return Math.max(mWidth, XEUtils.toInteger(colMinWidth));
}
}
}
return mWidth;
}
function isColumnInfo(column) {
return column && (column.constructor === ColumnInfo || column instanceof ColumnInfo);
}
// 获取所有的列,排除分组
function getColumnList(columns) {
const result = [];
columns.forEach((column) => {
result.push(...(column.children && column.children.length ? getColumnList(column.children) : [column]));
});
return result;
}
function createColumn($xeTable, options, renderOptions) {
return isColumnInfo(options) ? options : reactive(new ColumnInfo($xeTable, options, renderOptions));
}
function watchColumn($xeTable, props, column) {
Object.keys(props).forEach(name => {
watch(() => props[name], (value) => {
column.update(name, value);
if ($xeTable) {
if (name === 'filters') {
$xeTable.setFilter(column, value);
$xeTable.handleUpdateDataQueue();
}
else if (['visible', 'fixed', 'width', 'minWidth', 'maxWidth'].includes(name)) {
$xeTable.handleRefreshColumnQueue();
}
}
});
});
}
function assembleColumn($xeTable, elem, column, colgroup) {
const { reactData } = $xeTable;
const { staticColumns } = reactData;
const parentElem = elem.parentNode;
const parentColumn = colgroup ? colgroup.columnConfig : null;
const parentCols = parentColumn ? parentColumn.children : staticColumns;
if (parentElem && parentCols) {
column.defaultParentId = parentColumn ? parentColumn.id : null;
parentCols.splice(XEUtils.arrayIndexOf(parentElem.children, elem), 0, column);
reactData.staticColumns = staticColumns.slice(0);
}
}
function destroyColumn($xeTable, column) {
const { reactData } = $xeTable;
const { staticColumns } = reactData;
const matchObj = XEUtils.findTree(staticColumns, item => item.id === column.id, { children: 'children' });
if (matchObj) {
matchObj.items.splice(matchObj.index, 1);
}
reactData.staticColumns = staticColumns.slice(0);
}
function getRootColumn($xeTable, column) {
const { internalData } = $xeTable;
const { fullColumnIdData } = internalData;
if (!column) {
return null;
}
let parentColId = column.parentId;
while (fullColumnIdData[parentColId]) {
const column = fullColumnIdData[parentColId].column;
parentColId = column.parentId;
if (!parentColId) {
return column;
}
}
return column;
}
function getFirstChildColumn(column) {
const { children } = column;
if (children && children.length) {
return getFirstChildColumn(XEUtils.first(children));
}
return column;
}
function getLastChildColumn(column) {
const { children } = column;
if (children && children.length) {
return getFirstChildColumn(XEUtils.last(children));
}
return column;
}
function clearTableDefaultStatus($xeTable) {
const { props, internalData } = $xeTable;
internalData.initStatus = false;
const actionList = [
$xeTable.clearSort(),
$xeTable.clearCurrentRow(),
$xeTable.clearCurrentColumn(),
$xeTable.clearRadioRow(),
$xeTable.clearRadioReserve(),
$xeTable.clearCheckboxRow(),
$xeTable.clearCheckboxReserve(),
$xeTable.clearRowExpand(),
$xeTable.clearTreeExpand(),
$xeTable.clearTreeExpandReserve(),
$xeTable.clearPendingRow()
];
if ($xeTable.clearFilter) {
actionList.push($xeTable.clearFilter());
}
if ($xeTable.clearSelected && (props.keyboardConfig || props.mouseConfig)) {
actionList.push($xeTable.clearSelected());
}
if ($xeTable.clearCellAreas && props.mouseConfig) {
actionList.push($xeTable.clearCellAreas(), $xeTable.clearCopyCellArea());
}
return Promise.all(actionList).then(() => {
return $xeTable.clearScroll();
});
}
function clearTableAllStatus($xeTable) {
if ($xeTable.clearFilter) {
$xeTable.clearFilter();
}
return clearTableDefaultStatus($xeTable);
}
function rowToVisible($xeTable, row) {
const reactData = $xeTable.reactData;
const internalData = $xeTable.internalData;
const { computeLeftFixedWidth, computeRightFixedWidth, computeRowOpts, computeCellOpts, computeDefaultRowHeight } = $xeTable.getComputeMaps();
const { scrollYLoad, scrollYTop, isAllOverflow } = reactData;
const { elemStore, afterFullData, fullAllDataRowIdData, isResizeCellHeight } = internalData;
const rowOpts = computeRowOpts.value;
const cellOpts = computeCellOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const leftFixedWidth = computeLeftFixedWidth.value;
const rightFixedWidth = computeRightFixedWidth.value;
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const rowid = getRowid($xeTable, row);
if (bodyScrollElem) {
const bodyHeight = bodyScrollElem.clientHeight;
const bodyScrollTop = bodyScrollElem.scrollTop;
const trElem = bodyScrollElem.querySelector(`[rowid="${rowid}"]`);
if (trElem) {
const trOffsetTop = trElem.offsetTop + (scrollYLoad ? scrollYTop : 0);
const trHeight = trElem.clientHeight;
// 检测行是否在可视区中
if (trOffsetTop < bodyScrollTop || trOffsetTop > bodyScrollTop + bodyHeight) {
return $xeTable.scrollTo(null, trOffsetTop);
}
else if (trOffsetTop + trHeight >= bodyHeight + bodyScrollTop) {
return $xeTable.scrollTo(null, bodyScrollTop + trHeight);
}
}
else {
// 如果是虚拟渲染滚动
if (scrollYLoad) {
const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height;
if (!isCustomCellHeight && isAllOverflow) {
return $xeTable.scrollTo(null, ($xeTable.findRowIndexOf(afterFullData, row) - 1) * defaultRowHeight);
}
const rowRest = fullAllDataRowIdData[rowid] || {};
const rHeight = rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight;
const scrollTop = rowRest.oTop;
if (scrollTop < bodyScrollTop) {
return $xeTable.scrollTo(null, scrollTop - leftFixedWidth - 1);
}
return $xeTable.scrollTo(null, (scrollTop + rHeight) - (bodyHeight - rightFixedWidth - 1));
}
}
}
return Promise.resolve();
}
function colToVisible($xeTable, isForce, column, row) {
const reactData = $xeTable.reactData;
const internalData = $xeTable.internalData;
const { computeLeftFixedWidth, computeRightFixedWidth } = $xeTable.getComputeMaps();
const { scrollXLoad, scrollXLeft } = reactData;
const { elemStore, visibleColumn } = internalData;
const leftFixedWidth = computeLeftFixedWidth.value;
const rightFixedWidth = computeRightFixedWidth.value;
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
if (column.fixed) {
return Promise.resolve();
}
if (bodyScrollElem) {
const bodyWidth = bodyScrollElem.clientWidth;
const bodyScrollLeft = bodyScrollElem.scrollLeft;
let tdElem = null;
if (row) {
const rowid = getRowid($xeTable, row);
tdElem = bodyScrollElem.querySelector(`[rowid="${rowid}"] .${column.id}`);
}
if (!tdElem) {
tdElem = bodyScrollElem.querySelector(`.${column.id}`);
}
if (tdElem) {
const tdOffsetLeft = tdElem.offsetLeft + (scrollXLoad ? scrollXLeft : 0);
const cellWidth = tdElem.clientWidth;
// 检测是否在可视区中
if (isForce || (!(tdOffsetLeft <= (bodyScrollLeft + leftFixedWidth) && (tdOffsetLeft + cellWidth) > (bodyScrollLeft + leftFixedWidth)) &&
!(tdOffsetLeft >= (bodyScrollLeft + leftFixedWidth) && tdOffsetLeft < (bodyScrollLeft + bodyWidth - rightFixedWidth)))) {
if (tdOffsetLeft < (bodyScrollLeft + leftFixedWidth)) {
return $xeTable.scrollTo(tdOffsetLeft - leftFixedWidth - 1);
}
else if ((tdOffsetLeft + cellWidth - bodyScrollLeft) > (bodyWidth - rightFixedWidth)) {
return $xeTable.scrollTo((tdOffsetLeft + cellWidth) - (bodyWidth - rightFixedWidth - 1));
}
}
}
else {
if (scrollXLoad) {
let tdOffsetLeft = 0;
const cellWidth = column.renderWidth;
for (let i = 0; i < visibleColumn.length; i++) {
const currCol = visibleColumn[i];
if (currCol === column || currCol.id === column.id) {
break;
}
tdOffsetLeft += currCol.renderWidth;
}
// 检测是否在可视区中
if (isForce || (!(tdOffsetLeft <= (bodyScrollLeft + leftFixedWidth) && (tdOffsetLeft + cellWidth) > (bodyScrollLeft + leftFixedWidth)) &&
!(tdOffsetLeft >= (bodyScrollLeft + leftFixedWidth) && tdOffsetLeft < (bodyScrollLeft + bodyWidth - rightFixedWidth)))) {
if (tdOffsetLeft < bodyScrollLeft) {
return $xeTable.scrollTo(tdOffsetLeft - leftFixedWidth - 1);
}
return $xeTable.scrollTo((tdOffsetLeft + cellWidth) - (bodyWidth - rightFixedWidth - 1));
}
}
}
}
return Promise.resolve();
}
function hangleBolleanDefaultValue(currVal, defVal) {
return XEUtils.isBoolean(currVal) ? currVal : defVal;
}
function handleCustomStoreConfig($xeTable) {
const { computeCustomOpts } = $xeTable.getComputeMaps();
const customOpts = computeCustomOpts.value;
const { storage, storeOptions } = customOpts;
const isAllCustom = storage === true;
const storageOpts = Object.assign({}, isAllCustom ? {} : storage || {}, storeOptions);
const isCustomAlign = hangleBolleanDefaultValue(storageOpts.align, isAllCustom);
const isCustomHeaderAlign = hangleBolleanDefaultValue(storageOpts.headerAlign, isAllCustom);
const isCustomFooterAlign = hangleBolleanDefaultValue(storageOpts.footerAlign, isAllCustom);
const isCustomResizable = hangleBolleanDefaultValue(storageOpts.resizable, isAllCustom);
const isCustomVisible = hangleBolleanDefaultValue(storageOpts.visible, isAllCustom);
const isCustomFixed = hangleBolleanDefaultValue(storageOpts.fixed, isAllCustom);
const isCustomSort = hangleBolleanDefaultValue(storageOpts.sort, isAllCustom);
const isCustomAggGroup = hangleBolleanDefaultValue(storageOpts.aggGroup, isAllCustom);
const isCustomAggFunc = hangleBolleanDefaultValue(storageOpts.aggFunc, isAllCustom);
const isCustomPager = hangleBolleanDefaultValue(storageOpts.pager, isAllCustom);
return {
isCustomAlign,
isCustomHeaderAlign,
isCustomFooterAlign,
isCustomResizable,
isCustomVisible,
isCustomFixed,
isCustomSort,
isCustomAggGroup,
isCustomAggFunc,
isCustomPager
};
}
function getOnName(type) {
return 'on' + type.substring(0, 1).toLocaleUpperCase() + type.substring(1);
}
function getModelEvent(renderOpts) {
switch (renderOpts.name) {
case 'input':
case 'textarea':
return 'input';
case 'select':
return 'change';
}
return 'update:modelValue';
}
function getChangeEvent(renderOpts) {
switch (renderOpts.name) {
case 'input':
case 'textarea':
case 'VxeInput':
case 'VxeNumberInput':
case 'VxeTextarea':
case '$input':
case '$textarea':
return 'input';
}
return 'change';
}
function hasInputType(renderOpts) {
switch (renderOpts.name) {
case 'VxeInput':
case 'VxeNumberInput':
case 'VxeTextarea':
case '$input':
case '$textarea':
return true;
}
return false;
}
function getSlotVNs(vns) {
if (vns === null || vns === undefined) {
return [];
}
if (XEUtils.isArray(vns)) {
return vns;
}
return [vns];
}
const { getI18n: getI18n$c, getIcon: getIcon$7, renderer: renderer$a, renderEmptyElement: renderEmptyElement$a } = VxeUI;
function renderTitlePrefixIcon(params) {
const { $table, column } = params;
const titlePrefix = column.titlePrefix || column.titleHelp;
if (titlePrefix) {
return h('span', {
class: ['vxe-cell-title-prefix-icon', titlePrefix.iconStatus ? `theme--${titlePrefix.iconStatus}` : ''],
onMouseenter(evnt) {
$table.triggerHeaderTitleEvent(evnt, titlePrefix, params);
},
onMouseleave(evnt) {
$table.handleTargetLeaveEvent(evnt);
}
}, [
h('i', {
class: titlePrefix.icon || getIcon$7().TABLE_TITLE_PREFIX
})
]);
}
return renderEmptyElement$a($table);
}
function renderTitleSuffixIcon(params) {
const { $table, column } = params;
const titleSuffix = column.titleSuffix;
if (titleSuffix) {
return h('span', {
class: ['vxe-cell-title-suffix-icon', titleSuffix.iconStatus ? `theme--${titleSuffix.iconStatus}` : ''],
onMouseenter(evnt) {
$table.triggerHeaderTitleEvent(evnt, titleSuffix, params);
},
onMouseleave(evnt) {
$table.handleTargetLeaveEvent(evnt);
}
}, [
h('i', {
class: titleSuffix.icon || getIcon$7().TABLE_TITLE_SUFFIX
})
]);
}
return renderEmptyElement$a($table);
}
function renderCellDragIcon(params) {
const { $table, column } = params;
const { context } = $table;
const tableSlots = context.slots;
const tableProps = $table.props;
const { slots } = column;
const { dragConfig } = tableProps;
const { computeRowDragOpts } = $table.getComputeMaps();
const rowDragOpts = computeRowDragOpts.value;
const { icon, trigger, disabledMethod } = rowDragOpts;
const rDisabledMethod = disabledMethod || (dragConfig ? dragConfig.rowDisabledMethod : null);
const isDisabled = rDisabledMethod && rDisabledMethod(params);
const rowDragIconSlot = (slots ? slots.rowDragIcon || slots['row-drag-icon'] : null) || tableSlots.rowDragIcon || tableSlots['row-drag-icon'];
const ons = {};
if (trigger !== 'cell') {
ons.onMousedown = (evnt) => {
if (!isDisabled) {
$table.handleCellDragMousedownEvent(evnt, params);
}
};
ons.onMouseup = $table.handleCellDragMouseupEvent;
}
return h('span', Object.assign({ key: 'dg', class: ['vxe-cell--drag-handle', {
'is--disabled': isDisabled
}] }, ons), rowDragIconSlot
? $table.callSlot(rowDragIconSlot, params)
: [
h('i', {
class: icon || (dragConfig ? dragConfig.rowIcon : '') || getIcon$7().TABLE_DRAG_ROW
})
]);
}
function renderCellBaseVNs(params, content) {
const { $table, column, level } = params;
const { dragSort } = column;
const tableProps = $table.props;
const { treeConfig, dragConfig } = tableProps;
const { computeRowOpts, computeRowDragOpts, computeTreeOpts } = $table.getComputeMaps();
const rowOpts = computeRowOpts.value;
const rowDragOpts = computeRowDragOpts.value;
const treeOpts = computeTreeOpts.value;
const { showIcon, isPeerDrag, isCrossDrag, visibleMethod } = rowDragOpts;
const rVisibleMethod = visibleMethod || (dragConfig ? dragConfig.rowVisibleMethod : null);
const vns = [];
if (dragSort && rowOpts.drag && ((showIcon || (dragConfig ? dragConfig.showRowIcon : false)) && (!rVisibleMethod || rVisibleMethod(params)))) {
if (treeConfig) {
if (treeOpts.transform && (isPeerDrag || isCrossDrag || !level)) {
vns.push(renderCellDragIcon(params));
}
}
else {
vns.push(renderCellDragIcon(params));
}
}
return vns.concat(XEUtils.isArray(content) ? content : [content]);
}
function renderHeaderCellDragIcon(params) {
const { $table, column } = params;
const { context } = $table;
const tableSlots = context.slots;
const { slots } = column;
const { computeColumnOpts, computeColumnDragOpts } = $table.getComputeMaps();
const columnOpts = computeColumnOpts.value;
const columnDragOpts = computeColumnDragOpts.value;
const { showIcon, icon, trigger, isPeerDrag, isCrossDrag, visibleMethod, disabledMethod } = columnDragOpts;
if (columnOpts.drag && showIcon && (!visibleMethod || visibleMethod(params))) {
if (!column.fixed && (isPeerDrag || isCrossDrag || !column.parentId)) {
const isDisabled = disabledMethod && disabledMethod(params);
const columnDragIconSlot = (slots ? slots.columnDragIcon || slots['column-drag-icon'] : null) || tableSlots.columnDragIcon || tableSlots['column-drag-icon'];
const ons = {};
if (trigger !== 'cell') {
ons.onMousedown = (evnt) => {
if (!isDisabled) {
$table.handleHeaderCellDragMousedownEvent(evnt, params);
}
};
ons.onMouseup = $table.handleHeaderCellDragMouseupEvent;
}
return h('span', Object.assign({ key: 'dg', class: ['vxe-cell--drag-handle', {
'is--disabled': isDisabled
}] }, ons), columnDragIconSlot
? $table.callSlot(columnDragIconSlot, params)
: [
h('i', {
class: icon || getIcon$7().TABLE_DRAG_COLUMN
})
]);
}
}
return renderEmptyElement$a($table);
}
function renderHeaderCellBaseVNs(params, content) {
const vns = [
renderTitlePrefixIcon(params),
renderHeaderCellDragIcon(params),
...(XEUtils.isArray(content) ? content : [content]),
renderTitleSuffixIcon(params)
];
return vns;
}
function getRenderDefaultColumnTitle(column, content) {
if (column.type === 'html' && XEUtils.isString(content)) {
return h('span', {
key: 'ch',
innerHTML: content
});
}
return h('span', {
key: 'ct'
}, getSlotVNs(content));
}
function renderTitleContent(params, content) {
const { $table, column } = params;
const tableProps = $table.props;
const tableReactData = $table.reactData;
const { computeHeaderTooltipOpts } = $table.getComputeMaps();
const { showHeaderOverflow: allColumnHeaderOverflow } = tableProps;
const { isRowGroupStatus } = tableReactData;
const { showHeaderOverflow, slots } = column;
const titleSlot = slots ? slots.title : null;
const headerTooltipOpts = computeHeaderTooltipOpts.value;
const showAllTip = headerTooltipOpts.showAll;
const headOverflow = XEUtils.eqNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow;
const showTitle = (headOverflow === true ? headerTooltipOpts.mode : headOverflow) === 'title';
const showTooltip = (headOverflow === true ? headerTooltipOpts.mode : headOverflow) === 'tooltip';
const ons = {};
if (showTitle || showTooltip || showAllTip) {
ons.onMouseenter = (evnt) => {
if (tableReactData.isDragResize) {
return;
}
if (showTitle) {
updateCellTitle(evnt.currentTarget, column);
}
else if (showTooltip || showAllTip) {
$table.triggerHeaderTooltipEvent(evnt, params);
}
};
}
if (showTooltip || showAllTip) {
ons.onMouseleave = (evnt) => {
if (tableReactData.isDragResize) {
return;
}
if (showTooltip || showAllTip) {
$table.handleTargetLeaveEvent(evnt);
}
};
}
const titleVN = getRenderDefaultColumnTitle(column, content);
return [
h('span', Object.assign({ class: 'vxe-cell--title' }, ons), isRowGroupStatus && column.aggFunc && $table.getPivotTableAggregateRenderColTitles
? $table.getPivotTableAggregateRenderColTitles(column, titleVN)
: titleSlot
? $table.callSlot(titleSlot, params)
: [
titleVN
])
];
}
function getFooterContent(params) {
const { $table, column, row } = params;
const tableProps = $table.props;
const { editConfig } = tableProps;
const { slots, editRender, cellRender } = column;
const footerSlot = slots ? slots.footer : null;
if (footerSlot) {
return $table.callSlot(footerSlot, params);
}
const isEnableEdit = editConfig && isEnableConf(editConfig);
const editRenderOpts = isEnableEdit && isEnableConf(editRender) ? editRender : null;
const cellRenderOpts = isEnableConf(cellRender) ? cellRender : null;
const renderOpts = editRenderOpts || cellRenderOpts;
const itemValue = $table.getFooterCellLabel(row, column);
if (renderOpts) {
const compConf = renderer$a.get(renderOpts.name);
if (compConf) {
const rtFooter = compConf.renderTableFooter || compConf.renderFooter;
if (rtFooter) {
const footParams = Object.assign(params, {
cellValue: itemValue,
itemValue
});
return getSlotVNs(rtFooter(renderOpts, footParams));
}
}
}
return [
h('span', {
class: 'vxe-cell--label'
}, formatText(itemValue, 1))
];
}
function getDefaultCellLabel(params) {
const { $table, row, column } = params;
return formatText($table.getCellLabel(row, column), 1);
}
function renderCellHandle(params) {
const { column, row, $table } = params;
const tableProps = $table.props;
const tableReactData = $table.reactData;
const { isRowGroupStatus } = tableReactData;
const { editConfig } = tableProps;
const { type, treeNode, rowGroupNode, editRender } = column;
const { computeEditOpts, computeCheckboxOpts, computeAggregateOpts } = $table.getComputeMaps();
const aggregateOpts = computeAggregateOpts.value;
const { mode } = aggregateOpts;
const checkboxOpts = computeCheckboxOpts.value;
const editOpts = computeEditOpts.value;
const isDeepCell = treeNode || (isRowGroupStatus && (mode === 'column' ? column.field === row.groupField : rowGroupNode));
switch (type) {
case 'seq':
return isDeepCell ? Cell.renderDeepIndexCell(params) : Cell.renderSeqCell(params);
case 'radio':
return isDeepCell ? Cell.renderDeepRadioCell(params) : Cell.renderRadioCell(params);
case 'checkbox':
return checkboxOpts.checkField ? (isDeepCell ? Cell.renderDeepSelectionCellByProp(params) : Cell.renderCheckboxCellByProp(params)) : (isDeepCell ? Cell.renderDeepSelectionCell(params) : Cell.renderCheckboxCell(params));
case 'expand':
return Cell.renderExpandCell(params);
case 'html':
return isDeepCell ? Cell.renderDeepHTMLCell(params) : Cell.renderHTMLCell(params);
}
const isEnableEdit = editConfig && isEnableConf(editConfig);
const editRenderOpts = isEnableEdit && isEnableConf(editRender) ? editRender : null;
if (editRenderOpts) {
return editOpts.mode === 'cell' ? (isDeepCell ? Cell.renderDeepCellEdit(params) : Cell.renderCellEdit(params)) : (isDeepCell ? Cell.renderDeepRowEdit(params) : Cell.renderRowEdit(params));
}
return isDeepCell ? Cell.renderDeepCell(params) : Cell.renderDefaultCell(params);
}
function renderHeaderHandle(params) {
const { column, $table } = params;
const tableProps = $table.props;
const { editConfig } = tableProps;
const { type, filters, sortable, editRender, slots } = column;
const headerSlot = slots ? slots.header : null;
if (headerSlot) {
return renderTitleContent(params, $table.callSlot(headerSlot, params));
}
switch (type) {
case 'seq':
return Cell.renderSeqHeader(params);
case 'radio':
return Cell.renderRadioHeader(params);
case 'checkbox':
return Cell.renderCheckboxHeader(params);
case 'html':
if (filters && sortable) {
return Cell.renderSortAndFilterHeader(params);
}
else if (sortable) {
return Cell.renderSortHeader(params);
}
else if (filters) {
return Cell.renderFilterHeader(params);
}
break;
}
const isEnableEdit = editConfig && isEnableConf(editConfig);
const editRenderOpts = isEnableEdit && isEnableConf(editRender) ? editRender : null;
if (editRenderOpts) {
return Cell.renderEditHeader(params);
}
else if (filters && sortable) {
return Cell.renderSortAndFilterHeader(params);
}
else if (sortable) {
return Cell.renderSortHeader(params);
}
else if (filters) {
return Cell.renderFilterHeader(params);
}
return Cell.renderDefaultHeader(params);
}
function renderFooterHandle(params) {
return Cell.renderDefaultFooter(params);
}
const Cell = {
createColumn($xeTable, columnOpts) {
const { type } = columnOpts;
const renConfs = {
renderHeader: renderHeaderHandle,
renderCell: renderCellHandle,
renderFooter: renderFooterHandle
};
if (type === 'expand') {
renConfs.renderData = Cell.renderExpandData;
}
return createColumn($xeTable, columnOpts, renConfs);
},
/**
* 列头标题
*/
renderHeaderTitle(params) {
const { $table, column } = params;
const tableProps = $table.props;
const { editConfig } = tableProps;
const { editRender, cellRender } = column;
const isEnableEdit = editConfig && isEnableConf(editConfig);
const editRenderOpts = isEnableEdit && isEnableConf(editRender) ? editRender : null;
const cellRenderOpts = isEnableConf(cellRender) ? cellRender : null;
const renderOpts = editRenderOpts || cellRenderOpts;
if (renderOpts) {
const compConf = renderer$a.get(renderOpts.name);
if (compConf) {
const rtHeader = compConf.renderTableHeader || compConf.renderHeader;
if (rtHeader) {
return renderTitleContent(params, getSlotVNs(rtHeader(renderOpts, params)));
}
}
}
return renderTitleContent(params, $table.getHeaderCellLabel(column));
},
renderDefaultHeader(params) {
return renderHeaderCellBaseVNs(params, Cell.renderHeaderTitle(params));
},
renderDefaultCell(params) {
const { $table, row, column } = params;
const tableProps = $table.props;
const tableReactData = $table.reactData;
const tableInternalData = $table.internalData;
const { isRowGroupStatus } = tableReactData;
const { editConfig } = tableProps;
const { field, slots, editRender, cellRender, rowGroupNode, aggFunc } = column;
const isEnableEdit = editConfig && isEnableConf(editConfig);
const editRenderOpts = isEnableEdit && isEnableConf(editRender) ? editRender : null;
const cellRenderOpts = isEnableConf(cellRender) ? cellRender : null;
const defaultSlot = slots ? slots.default : null;
const gcSlot = slots ? (slots.groupContent || slots['group-content']) : null;
const gvSlot = slots ? (slots.groupValues || slots['group-values']) : null;
let cellValue = '';
if (isRowGroupStatus && field && row.isAggregate) {
const aggRow = row;
const { fullColumnFieldData } = tableInternalData;
const { computeAggregateOpts } = $table.getComputeMaps();
const aggregateOpts = computeAggregateOpts.value;
const { mode, showTotal, totalMethod, countFields, contentMethod, formatValuesMethod, mapChildrenField } = aggregateOpts;
const aggData = aggRow.aggData;
const currAggData = aggData ? aggData[field] : null;
const groupField = aggRow.groupField;
const groupContent = aggRow.groupContent;
const childList = mapChildrenField ? (aggRow[mapChildrenField] || []) : [];
const childCount = aggRow.childCount;
const colRest = fullColumnFieldData[groupField] || {};
const ctParams = {
$table,
groupField,
groupColumn: (colRest ? colRest.column : null),
column,
groupValue: groupContent,
childList,
childCount,
aggValue: null,
/**
* 已废弃
* @deprecated
*/
children: childList,
/**
* 已废弃
* @deprecated
*/
totalValue: childCount
};
if (mode === 'column' ? field === aggRow.groupField : rowGroupNode) {
cellValue = groupContent;
if (contentMethod) {
cellValue = `${contentMethod(ctParams)}`;
}
if (showTotal) {
cellValue = getI18n$c('vxe.table.rowGroupContentTotal', [cellValue, totalMethod ? totalMethod(ctParams) : childCount, childCount]);
}
if (gcSlot) {
return renderCellBaseVNs(params, $table.callSlot(gcSlot, Object.assign({ groupField, groupContent, childList, childCount }, params)));
}
}
else if ($table.getPivotTableAggregateCellAggValue) {
cellValue = $table.getPivotTableAggregateCellAggValue(params);
ctParams.aggValue = cellValue;
if (gvSlot) {
return renderCellBaseVNs(params, $table.callSlot(gvSlot, Object.assign({ groupField, groupContent, childList, childCount }, params, ctParams)));
}
}
else if (aggFunc === true || (countFields && countFields.includes(field))) {
cellValue = currAggData ? currAggData.value : childCount;
ctParams.aggValue = cellValue;
if (formatValuesMethod) {
cellValue = formatValuesMethod(ctParams);
}
if (gvSlot) {
return renderCellBaseVNs(params, $table.callSlot(gvSlot, Object.assign({ groupField, groupContent, childList, childCount }, params, ctParams)));
}
}
}
else {
if (defaultSlot) {
return renderCellBaseVNs(params, $table.callSlot(defaultSlot, params));
}
const renderOpts = editRenderOpts || cellRenderOpts;
// 如果是编辑表格:renderTableCell > formatter
// 如果是查看表格:renderTableDefault > formatter
if (renderOpts) {
const compConf = renderer$a.get(renderOpts.name);
if (compConf) {
const renderFn = editRenderOpts ? (compConf.renderTableCell || compConf.renderCell) : (compConf.renderTableDefault || compConf.renderDefault);
if (renderFn) {
return renderCellBaseVNs(params, getSlotVNs(renderFn(renderOpts, Object.assign({ $type: editRenderOpts ? 'edit' : 'cell' }, params))));
}
}
}
cellValue = $table.getCellLabel(row, column);
}
const cellPlaceholder = editRenderOpts ? editRenderOpts.placeholder : '';
return renderCellBaseVNs(params, [
h('span', {
class: 'vxe-cell--label'
}, [
// 如果设置占位符
editRenderOpts && eqEmptyValue(cellValue)
? h('span', {
class: 'vxe-cell--placeholder'
}, formatText(getFuncText(cellPlaceholder), 1))
: h('span', formatText(cellValue, 1))
])
]);
},
renderDeepCell(params) {
return Cell.renderDeepNodeBtn(params, Cell.renderDefaultCell(params));
},
renderDefaultFooter(params) {
return getFooterContent(params);
},
/**
* 行分组
*/
renderRowGroupBtn(params, cellVNodes) {
const { $table } = params;
const tableReactData = $table.reactData;
const tableInternalData = $table.internalData;
const { row, level } = params;
const { computeAggregateOpts } = $table.getComputeMaps();
const { rowGroupExpandedFlag } = tableReactData;
const { rowGroupExpandedMaps } = tableInternalData;
const aggregateOpts = computeAggregateOpts.value;
const { mode, padding, indent, showIcon, iconOpen, iconClose } = aggregateOpts;
const rowid = getRowid($table, row);
const isExpand = !!rowGroupExpandedFlag && !!rowGroupExpandedMaps[rowid];
return h('div', {
class: ['vxe-row-group--tree-node', {
'is--expanded': isExpand
}],
style: mode !== 'column' && padding && indent
? {
paddingLeft: `${level * indent}px`
}
: undefined
}, [
showIcon && row.isAggregate
? h('span', {
class: 'vxe-row-group--node-btn',
onClick(evnt) {
$table.triggerRowGroupExpandEvent(evnt, params);
}
}, [
h('i', {
class: isExpand ? (iconOpen || getIcon$7().TABLE_ROW_GROUP_OPEN) : (iconClose || getIcon$7().TABLE_ROW_GROUP_CLOSE)
})
])
: renderEmptyElement$a($table),
h('div', {
class: 'vxe-row-group-cell'
}, cellVNodes)
]);
},
/**
* 树
*/
renderTreeNodeBtn(params, cellVNodes) {
const { $table, isHidden } = params;
const tableReactData = $table.reactData;
const tableInternalData = $table.internalData;
const { row, column, level } = params;
const { slots } = column;
const iconSlot = slots ? slots.icon : null;
if (iconSlot) {
return $table.callSlot(iconSlot, params);
}
const { computeTreeOpts } = $table.getComputeMaps();
const { treeExpandedFlag } = tableReactData;
const { fullAllDataRowIdData, treeExpandedMaps, treeExpandLazyLoadedMaps } = tableInternalData;
const treeOpts = computeTreeOpts.value;
const { padding, indent, lazy, trigger, visibleMethod, iconLoaded, showIcon, iconOpen, iconClose } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
const hasChildField = treeOpts.hasChild || treeOpts.hasChildField;
const rowChilds = row[childrenField];
const hasChild = rowChilds && rowChilds.length;
let hasLazyChilds = false;
let isActive = false;
let isLazyLoading = false;
let isLazyLoaded = false;
const ons = {};
if (!isHidden) {
const rowid = getRowid($table, row);
isActive = !!treeExpandedFlag && !!treeExpandedMaps[rowid];
if (lazy) {
const rest = fullAllDataRowIdData[rowid];
isLazyLoading = !!treeExpandLazyLoadedMaps[rowid];
hasLazyChilds = row[hasChildField];
isLazyLoaded = !!rest.treeLoaded;
}
}
if (!trigger || trigger === 'default') {
ons.onClick = (evnt) => {
$table.triggerTreeExpandEvent(evnt, params);
};
}
return h('div', {
class: ['vxe-cell--tree-node', {
'is--active': isActive
}],
style: padding && indent
? {
paddingLeft: `${level * indent}px`
}
: undefined
}, [
showIcon && (lazy ? (isLazyLoaded ? hasChild : (hasChild || hasLazyChilds)) : hasChild) && (!visibleMethod || visibleMethod(params))
? [
h('div', Object.assign({ class: 'vxe-cell--tree-btn' }, ons), [
h('i', {
class: isLazyLoading ? (iconLoaded || getIcon$7().TABLE_TREE_LOADED) : (isActive ? (iconOpen || getIcon$7().TABLE_TREE_OPEN) : (iconClose || getIcon$7().TABLE_TREE_CLOSE))
})
])
]
: null,
h('div', {
class: 'vxe-tree-cell'
}, cellVNodes)
]);
},
/**
* 层级节点。
* 行分组、树结构
*/
renderDeepNodeBtn(params, cellVNodes) {
const { $table, row, column } = params;
const { rowGroupNode } = column;
const tableReactData = $table.reactData;
const { rowGroupList } = tableReactData;
if (rowGroupList.length) {
const { computeAggregateOpts } = $table.getComputeMaps();
const aggregateOpts = computeAggregateOpts.value;
const { mode } = aggregateOpts;
if (mode === 'column') {
if (row.groupField && column.field === row.groupField) {
return [Cell.renderRowGroupBtn(params, cellVNodes)];
}
return cellVNodes;
}
else if (rowGroupNode) {
return [Cell.renderRowGroupBtn(params, cellVNodes)];
}
}
return [Cell.renderTreeNodeBtn(params, cellVNodes)];
},
/**
* 序号
*/
renderSeqHeader(params) {
const { $table, column } = params;
return renderHeaderCellBaseVNs(params, renderTitleContent(params, $table.getHeaderCellLabel(column)));
},
renderSeqCell(params) {
const { $table, column } = params;
const tableProps = $table.props;
const { treeConfig } = tableProps;
const { computeSeqOpts } = $table.getComputeMaps();
const seqOpts = computeSeqOpts.value;
const { slots } = column;
const defaultSlot = slots ? slots.default : null;
if (defaultSlot) {
return renderCellBaseVNs(params, $table.callSlot(defaultSlot, params));
}
const { seq } = params;
const seqMd = seqOpts.seqMethod;
return renderCellBaseVNs(params, [
h('span', `${formatText(seqMd ? seqMd(params) : treeConfig ? seq : (seqOpts.startIndex || 0) + seq, 1)}`)
]);
},
renderDeepIndexCell(params) {
return Cell.renderDeepNodeBtn(params, Cell.renderSeqCell(params));
},
/**
* 单选
*/
renderRadioHeader(params) {
const { $table, column } = params;
const { slots } = column;
const titleSlot = slots ? slots.title : null;
return renderHeaderCellBaseVNs(params, renderTitleContent(params, [
h('span', {
class: 'vxe-radio--label'
}, titleSlot ? $table.callSlot(titleSlot, params) : $table.getHeaderCellLabel(column))
]));
},
renderRadioCell(params) {
const { $table, column, isHidden } = params;
const tableReactData = $table.reactData;
const { computeRadioOpts } = $table.getComputeMaps();
const { selectRadioRow } = tableReactData;
const radioOpts = computeRadioOpts.value;
const { slots } = column;
const { labelField, checkMethod, visibleMethod } = radioOpts;
const { row } = params;
const defaultSlot = slots ? slots.default : null;
const radioSlot = slots ? slots.radio : null;
const isChecked = $table.eqRow(row, selectRadioRow);
const isVisible = !visibleMethod || visibleMethod({ $table, row });
let isDisabled = !!checkMethod;
let ons;
if (!isHidden) {
ons = {
onClick(evnt) {
if (!isDisabled && isVisible) {
$table.triggerRadioRowEvent(evnt, params);
}
}
};
if (checkMethod) {
isDisabled = !checkMethod({ $table, row });
}
}
const radioParams = Object.assign(Object.assign({}, params), { checked: isChecked, disabled: isDisabled, visible: isVisible });
if (radioSlot) {
return renderCellBaseVNs(params, $table.callSlot(radioSlot, radioParams));
}
const radioVNs = [];
if (isVisible) {
radioVNs.push(h('span', {
class: ['vxe-radio--icon', isChecked ? getIcon$7().TABLE_RADIO_CHECKED : (isDisabled ? getIcon$7().TABLE_RADIO_DISABLED_UNCHECKED : getIcon$7().TABLE_RADIO_UNCHECKED)]
}));
}
if (defaultSlot || labelField) {
radioVNs.push(h('span', {
class: 'vxe-radio--label'
}, defaultSlot ? $table.callSlot(defaultSlot, radioParams) : XEUtils.get(row, labelField)));
}
return renderCellBaseVNs(params, [
h('span', Object.assign({ class: ['vxe-cell--radio', {
'is--checked': isChecked,
'is--disabled': isDisabled
}] }, ons), radioVNs)
]);
},
renderDeepRadioCell(params) {
return Cell.renderDeepNodeBtn(params, Cell.renderRadioCell(params));
},
/**
* 多选
*/
renderCheckboxHeader(params) {
const { $table, column, isHidden } = params;
const tableReactData = $table.reactData;
const { computeIsAllCheckboxDisabled, computeCheckboxOpts } = $table.getComputeMaps();
const { isAllSelected: isAllCheckboxSelected, isIndeterminate: isAllCheckboxIndeterminate } = tableReactData;
const isAllCheckboxDisabled = computeIsAllCheckboxDisabled.value;
const { slots } = column;
const titleSlot = slots ? slots.title : null;
const checkboxOpts = computeCheckboxOpts.value;
const { checkStrictly, showHeader, headerTitle } = checkboxOpts;
const colTitle = $table.getHeaderCellLabel(column);
const ons = {};
if (!isHidden) {
ons.onClick = (evnt) => {
if (!isAllCheckboxDisabled) {
$table.triggerCheckAllEvent(evnt, !isAllCheckboxSelected);
}
};
}
const checkboxParams = Object.assign(Object.assign({}, params), { checked: isAllCheckboxSelected, disabled: isAllCheckboxDisabled, indeterminate: isAllCheckboxIndeterminate });
if (checkStrictly ? !showHeader : showHeader === false) {
return renderHeaderCellBaseVNs(params, renderTitleContent(checkboxParams, [
h('span', {
class: 'vxe-checkbox--label'
}, titleSlot ? $table.callSlot(titleSlot, checkboxParams) : colTitle)
]));
}
return renderHeaderCellBaseVNs(params, renderTitleContent(checkboxParams, [
h('span', Object.assign({ class: ['vxe-cell--checkbox', {
'is--checked': isAllCheckboxSelected,
'is--disabled': isAllCheckboxDisabled,
'is--indeterminate': isAllCheckboxIndeterminate
}], title: XEUtils.eqNull(headerTitle) ? getI18n$c('vxe.table.allTitle') : `${headerTitle || ''}` }, ons), [
h('span', {
class: ['vxe-checkbox--icon', isAllCheckboxIndeterminate ? getIcon$7().TABLE_CHECKBOX_INDETERMINATE : (isAllCheckboxSelected ? getIcon$7().TABLE_CHECKBOX_CHECKED : (isAllCheckboxDisabled ? getIcon$7().TABLE_CHECKBOX_DISABLED_UNCHECKED : getIcon$7().TABLE_CHECKBOX_UNCHECKED))]
})
].concat(titleSlot || colTitle
? [
h('span', {
class: 'vxe-checkbox--label'
}, titleSlot ? $table.callSlot(titleSlot, checkboxParams) : colTitle)
]
: []))
]));
},
renderCheckboxCell(params) {
const { $table, row, column, isHidden } = params;
const tableProps = $table.props;
const tableReactData = $table.reactData;
const tableInternalData = $table.internalData;
const { treeConfig } = tableProps;
const { updateCheckboxFlag, isRowGroupStatus } = tableReactData;
const { selectCheckboxMaps, treeIndeterminateRowMaps } = tableInternalData;
const { computeCheckboxOpts, computeAggregateOpts } = $table.getComputeMaps();
const aggregateOpts = computeAggregateOpts.value;
const { mapChildrenField } = aggregateOpts;
const checkboxOpts = computeCheckboxOpts.value;
const { labelField, checkMethod, visibleMethod } = checkboxOpts;
const { slots } = column;
const defaultSlot = slots ? slots.default : null;
const checkboxSlot = slots ? slots.checkbox : null;
let indeterminate = false;
let isChecked = false;
let isVisible = true;
let isDisabled = false;
const ons = {};
if (!isHidden) {
const rowid = getRowid($table, row);
isChecked = !!updateCheckboxFlag && !!selectCheckboxMaps[rowid];
if (checkMethod && isRowGroupStatus && $table.isAggregateRecord(row)) {
const childList = row[mapChildrenField || ''];
if (!childList || !childList.length || childList.every(item => !checkMethod({ $table, row: item }))) {
isDisabled = true;
}
}
else {
isVisible = !visibleMethod || visibleMethod({ $table, row });
isDisabled = checkMethod ? !checkMethod({ $table, row }) : !!checkMethod;
}
if (treeConfig || isRowGroupStatus) {
indeterminate = !!treeIndeterminateRowMaps[rowid];
}
ons.onClick = (evnt) => {
if (!isDisabled && isVisible) {
$table.triggerCheckRowEvent(evnt, params, !isChecked);
}
};
}
const checkboxParams = Object.assign(Object.assign({}, params), { checked: isChecked, disabled: isDisabled, visible: isVisible, indeterminate });
if (checkboxSlot) {
return renderCellBaseVNs(params, $table.callSlot(checkboxSlot, checkboxParams));
}
const checkVNs = [];
if (isVisible) {
checkVNs.push(h('span', {
class: ['vxe-checkbox--icon', indeterminate ? getIcon$7().TABLE_CHECKBOX_INDETERMINATE : (isChecked ? getIcon$7().TABLE_CHECKBOX_CHECKED : (isDisabled ? getIcon$7().TABLE_CHECKBOX_DISABLED_UNCHECKED : getIcon$7().TABLE_CHECKBOX_UNCHECKED))]
}));
}
if (defaultSlot || labelField) {
checkVNs.push(h('span', {
class: 'vxe-checkbox--label'
}, defaultSlot ? $table.callSlot(defaultSlot, checkboxParams) : XEUtils.get(row, labelField)));
}
return renderCellBaseVNs(params, [
h('span', Object.assign({ class: ['vxe-cell--checkbox', {
'is--checked': isChecked,
'is--disabled': isDisabled,
'is--indeterminate': indeterminate,
'is--hidden': !isVisible
}] }, ons), checkVNs)
]);
},
renderDeepSelectionCell(params) {
return Cell.renderDeepNodeBtn(params, Cell.renderCheckboxCell(params));
},
renderCheckboxCellByProp(params) {
const { $table, row, column, isHidden } = params;
const tableProps = $table.props;
const tableReactData = $table.reactData;
const tableInternalData = $table.internalData;
const { treeConfig } = tableProps;
const { updateCheckboxFlag, isRowGroupStatus } = tableReactData;
const { treeIndeterminateRowMaps } = tableInternalData;
const { computeCheckboxOpts, computeAggregateOpts } = $table.getComputeMaps();
const aggregateOpts = computeAggregateOpts.value;
const { mapChildrenField } = aggregateOpts;
const checkboxOpts = computeCheckboxOpts.value;
const { labelField, checkField, checkMethod, visibleMethod } = checkboxOpts;
const indeterminateField = checkboxOpts.indeterminateField || checkboxOpts.halfField;
const { slots } = column;
const defaultSlot = slots ? slots.default : null;
const checkboxSlot = slots ? slots.checkbox : null;
let indeterminate = false;
let isChecked = false;
let isVisible = true;
let isDisabled = false;
const ons = {};
if (!isHidden) {
const rowid = getRowid($table, row);
isChecked = !!updateCheckboxFlag && XEUtils.get(row, checkField);
if (checkMethod && isRowGroupStatus && $table.isAggregateRecord(row)) {
const childList = row[mapChildrenField || ''];
if (!childList || !childList.length || childList.every(item => !checkMethod({ $table, row: item }))) {
isDisabled = true;
}
}
else {
isVisible = !visibleMethod || visibleMethod({ $table, row });
isDisabled = checkMethod ? !checkMethod({ $table, row }) : !!checkMethod;
}
if (treeConfig || isRowGroupStatus) {
indeterminate = !!treeIndeterminateRowMaps[rowid];
}
ons.onClick = (evnt) => {
if (!isDisabled && isVisible) {
$table.triggerCheckRowEvent(evnt, params, !isChecked);
}
};
}
const checkboxParams = Object.assign(Object.assign({}, params), { checked: isChecked, disabled: isDisabled, visible: isVisible, indeterminate });
if (checkboxSlot) {
return renderCellBaseVNs(params, $table.callSlot(checkboxSlot, checkboxParams));
}
const checkVNs = [];
if (isVisible) {
checkVNs.push(h('span', {
class: ['vxe-checkbox--icon', indeterminate ? getIcon$7().TABLE_CHECKBOX_INDETERMINATE : (isChecked ? getIcon$7().TABLE_CHECKBOX_CHECKED : (isDisabled ? getIcon$7().TABLE_CHECKBOX_DISABLED_UNCHECKED : getIcon$7().TABLE_CHECKBOX_UNCHECKED))]
}));
if (defaultSlot || labelField) {
checkVNs.push(h('span', {
class: 'vxe-checkbox--label'
}, defaultSlot ? $table.callSlot(defaultSlot, checkboxParams) : XEUtils.get(row, labelField)));
}
}
return renderCellBaseVNs(params, [
h('span', Object.assign({ class: ['vxe-cell--checkbox', {
'is--checked': isChecked,
'is--disabled': isDisabled,
'is--indeterminate': indeterminateField && !isChecked ? row[indeterminateField] : indeterminate,
'is--hidden': !isVisible
}] }, ons), checkVNs)
]);
},
renderDeepSelectionCellByProp(params) {
return Cell.renderDeepNodeBtn(params, Cell.renderCheckboxCellByProp(params));
},
/**
* 展开行
*/
renderExpandCell(params) {
const { $table, isHidden, row, column } = params;
const tableReactData = $table.reactData;
const tableInternalData = $table.internalData;
const { isRowGroupStatus } = tableReactData;
const { rowExpandedMaps, rowExpandLazyLoadedMaps } = tableInternalData;
const { computeExpandOpts } = $table.getComputeMaps();
const expandOpts = computeExpandOpts.value;
const { lazy, labelField, iconLoaded, showIcon, iconOpen, iconClose, visibleMethod } = expandOpts;
const { slots } = column;
const defaultSlot = slots ? slots.default : null;
const iconSlot = slots ? slots.icon : null;
let isActive = false;
let isLazyLoading = false;
if (isRowGroupStatus && row.isAggregate) {
return renderCellBaseVNs(params, []);
}
if (iconSlot) {
return renderCellBaseVNs(params, $table.callSlot(iconSlot, params));
}
if (!isHidden) {
const rowid = getRowid($table, row);
isActive = !!rowExpandedMaps[rowid];
if (lazy) {
isLazyLoading = !!rowExpandLazyLoadedMaps[rowid];
}
}
return renderCellBaseVNs(params, [
showIcon && (!visibleMethod || visibleMethod(params))
? h('div', {
class: ['vxe-table--expanded', {
'is--active': isActive
}]
}, [
h('span', {
class: 'vxe-table--expand-btn',
onMousedown(evnt) {
evnt.stopPropagation();
},
onClick(evnt) {
$table.triggerRowExpandEvent(evnt, params);
}
}, [
h('i', {
class: isLazyLoading ? (iconLoaded || getIcon$7().TABLE_EXPAND_LOADED) : (isActive ? (iconOpen || getIcon$7().TABLE_EXPAND_OPEN) : (iconClose || getIcon$7().TABLE_EXPAND_CLOSE))
})
])
])
: renderEmptyElement$a($table),
defaultSlot || labelField
? h('div', {
class: 'vxe-table--expand-label'
}, defaultSlot ? $table.callSlot(defaultSlot, params) : XEUtils.get(row, labelField))
: renderEmptyElement$a($table)
]);
},
renderExpandData(params) {
const { $table, column } = params;
const { slots, contentRender } = column;
const contentSlot = slots ? slots.content : null;
if (contentSlot) {
return $table.callSlot(contentSlot, params);
}
if (contentRender) {
const compConf = renderer$a.get(contentRender.name);
if (compConf) {
const rtExpand = compConf.renderTableExpand || compConf.renderExpand;
if (rtExpand) {
return getSlotVNs(rtExpand(contentRender, params));
}
}
}
return [];
},
/**
* HTML 标签
*/
renderHTMLCell(params) {
const { $table, column } = params;
const { slots } = column;
const defaultSlot = slots ? slots.default : null;
if (defaultSlot) {
return renderCellBaseVNs(params, $table.callSlot(defaultSlot, params));
}
return renderCellBaseVNs(params, [
h('span', {
class: 'vxe-cell--html',
innerHTML: getDefaultCellLabel(params)
})
]);
},
renderDeepHTMLCell(params) {
return Cell.renderDeepNodeBtn(params, Cell.renderHTMLCell(params));
},
/**
* 排序和筛选
*/
renderSortAndFilterHeader(params) {
return renderHeaderCellBaseVNs(params, Cell.renderHeaderTitle(params).concat(Cell.renderSortIcon(params).concat(Cell.renderFilterIcon(params))));
},
/**
* 排序
*/
renderSortHeader(params) {
return renderHeaderCellBaseVNs(params, Cell.renderHeaderTitle(params).concat(Cell.renderSortIcon(params)));
},
renderSortIcon(params) {
const { $table, column } = params;
const { computeSortOpts } = $table.getComputeMaps();
const sortOpts = computeSortOpts.value;
const { showIcon, allowBtn, ascTitle, descTitle, iconLayout, iconAsc, iconDesc, iconVisibleMethod } = sortOpts;
const { order, slots } = column;
if (showIcon && (!iconVisibleMethod || iconVisibleMethod(params))) {
const sortSlot = slots ? slots.sort : null;
return sortSlot
? getSlotVNs($table.callSlot(sortSlot, params))
: [
h('span', {
class: ['vxe-cell--sort', `vxe-cell--sort-${iconLayout}-layout`]
}, [
h('i', {
class: ['vxe-sort--asc-btn', iconAsc || getIcon$7().TABLE_SORT_ASC, {
'sort--active': order === 'asc'
}],
title: XEUtils.eqNull(ascTitle) ? getI18n$c('vxe.table.sortAsc') : `${ascTitle || ''}`,
onClick: allowBtn
? (evnt) => {
evnt.stopPropagation();
$table.triggerSortEvent(evnt, column, 'asc');
}
: undefined
}),
h('i', {
class: ['vxe-sort--desc-btn', iconDesc || getIcon$7().TABLE_SORT_DESC, {
'sort--active': order === 'desc'
}],
title: XEUtils.eqNull(descTitle) ? getI18n$c('vxe.table.sortDesc') : `${descTitle || ''}`,
onClick: allowBtn
? (evnt) => {
evnt.stopPropagation();
$table.triggerSortEvent(evnt, column, 'desc');
}
: undefined
})
])
];
}
return [];
},
/**
* 筛选
*/
renderFilterHeader(params) {
return renderHeaderCellBaseVNs(params, Cell.renderHeaderTitle(params).concat(Cell.renderFilterIcon(params)));
},
renderFilterIcon(params) {
const { $table, column, hasFilter } = params;
const tableReactData = $table.reactData;
const { filterStore } = tableReactData;
const { computeFilterOpts } = $table.getComputeMaps();
const filterOpts = computeFilterOpts.value;
const { showIcon, iconNone, iconMatch, iconVisibleMethod } = filterOpts;
if (showIcon && (!iconVisibleMethod || iconVisibleMethod(params))) {
return [
h('span', {
class: ['vxe-cell--filter', {
'is--active': filterStore.visible && filterStore.column === column
}],
onClick(evnt) {
if ($table.triggerFilterEvent) {
$table.triggerFilterEvent(evnt, params.column, params);
}
}
}, [
h('i', {
class: ['vxe-filter--btn', hasFilter ? (iconMatch || getIcon$7().TABLE_FILTER_MATCH) : (iconNone || getIcon$7().TABLE_FILTER_NONE)],
title: getI18n$c('vxe.table.filter')
})
])
];
}
return [];
},
/**
* 可编辑
*/
renderEditHeader(params) {
const { $table, column } = params;
const tableProps = $table.props;
const { computeEditOpts } = $table.getComputeMaps();
const { editConfig, editRules } = tableProps;
const editOpts = computeEditOpts.value;
const { sortable, filters, editRender } = column;
const isEnableEdit = editConfig && isEnableConf(editConfig);
const editRenderOpts = isEnableEdit && isEnableConf(editRender) ? editRender : null;
let isRequired = false;
if (editRules) {
const columnRules = column.rules ? column.rules : XEUtils.get(editRules, column.field);
if (columnRules) {
isRequired = columnRules.some((rule) => rule.required);
}
}
let editIconVNs = [];
if (isEnableEdit) {
const { showAsterisk, showIcon, icon } = editOpts;
editIconVNs = [
isRequired && showAsterisk
? h('span', {
class: 'vxe-cell--required-icon'
}, [
h('i')
])
: renderEmptyElement$a($table),
editRenderOpts && showIcon
? h('span', {
class: 'vxe-cell--edit-icon'
}, XEUtils.isFunction(icon)
? getSlotVNs(icon({}))
: [
h('i', {
class: icon || getIcon$7().TABLE_EDIT
})
])
: renderEmptyElement$a($table)
];
}
return renderHeaderCellBaseVNs(params, editIconVNs.concat(Cell.renderHeaderTitle(params))
.concat(sortable ? Cell.renderSortIcon(params) : [])
.concat(filters ? Cell.renderFilterIcon(params) : []));
},
// 行格编辑模式
renderRowEdit(params) {
const { $table, column } = params;
const tableProps = $table.props;
const { editConfig } = tableProps;
const tableReactData = $table.reactData;
const { editStore } = tableReactData;
const { actived } = editStore;
const { editRender } = column;
const isEnableEdit = editConfig && isEnableConf(editConfig);
const editRenderOpts = isEnableEdit && isEnableConf(editRender) ? editRender : null;
return Cell.runRenderer(params, !!(editRenderOpts && actived && actived.row === params.row));
},
renderDeepRowEdit(params) {
return Cell.renderDeepNodeBtn(params, Cell.renderRowEdit(params));
},
// 单元格编辑模式
renderCellEdit(params) {
const { $table, column } = params;
const tableProps = $table.props;
const { editConfig } = tableProps;
const tableReactData = $table.reactData;
const { editStore } = tableReactData;
const { actived } = editStore;
const { editRender } = column;
const isEnableEdit = editConfig && isEnableConf(editConfig);
const editRenderOpts = isEnableEdit && isEnableConf(editRender) ? editRender : null;
return Cell.runRenderer(params, !!(editRenderOpts && actived && actived.row === params.row && actived.column === params.column));
},
renderDeepCellEdit(params) {
return Cell.renderDeepNodeBtn(params, Cell.renderCellEdit(params));
},
runRenderer(params, isEdit) {
const { $table, row, column } = params;
const tableProps = $table.props;
const { editConfig } = tableProps;
const tableReactData = $table.reactData;
const { isRowGroupStatus } = tableReactData;
const { slots, field, editRender, formatter } = column;
const isEnableEdit = editConfig && isEnableConf(editConfig);
const editRenderOpts = isEnableEdit && isEnableConf(editRender) ? editRender : null;
const defaultSlot = slots ? slots.default : null;
const gcSlot = slots ? (slots.groupContent || slots['group-content']) : null;
const editSlot = slots ? slots.edit : null;
const cellParams = Object.assign({ $type: '', isEdit }, params);
if (isEdit && editRenderOpts) {
cellParams.$type = 'edit';
if (editSlot) {
return $table.callSlot(editSlot, cellParams);
}
const compConf = renderer$a.get(editRenderOpts.name);
const rtEdit = compConf ? (compConf.renderTableEdit || compConf.renderEdit) : null;
if (rtEdit) {
return getSlotVNs(rtEdit(editRenderOpts, cellParams));
}
return [];
}
if (isRowGroupStatus && field && row.isAggregate) {
const aggRow = row;
const { computeAggregateOpts } = $table.getComputeMaps();
const aggregateOpts = computeAggregateOpts.value;
const { mapChildrenField } = aggregateOpts;
const groupField = aggRow.groupField;
const groupContent = aggRow.groupContent;
const childList = mapChildrenField ? (aggRow[mapChildrenField] || []) : [];
const childCount = aggRow.childCount;
if (gcSlot) {
return renderCellBaseVNs(params, $table.callSlot(gcSlot, Object.assign({ groupField, groupContent, childList, childCount }, params)));
}
}
else {
if (defaultSlot) {
return renderCellBaseVNs(params, $table.callSlot(defaultSlot, cellParams));
}
}
if (formatter) {
return renderCellBaseVNs(params, [
h('span', {
class: 'vxe-cell--label'
}, getDefaultCellLabel(cellParams))
]);
}
return Cell.renderDefaultCell(cellParams);
}
};
const columnProps = {
// 列唯一主键
colId: [String, Number],
// 渲染类型 index,radio,checkbox,expand,html
type: String,
// 列字段名
field: String,
// 列标题
title: String,
// 列宽度
width: [Number, String],
// 列最小宽度,把剩余宽度按比例分配
minWidth: [Number, String],
// 列最大宽度
maxWidth: [Number, String],
// 是否允许拖动列宽调整大小
resizable: {
type: Boolean,
default: null
},
// 将列固定在左侧或者右侧
fixed: String,
// 列对其方式
align: String,
// 表头对齐方式
headerAlign: String,
// 表尾列的对齐方式
footerAlign: String,
// 当内容过长时显示为省略号
showOverflow: {
type: [Boolean, String],
default: null
},
// 当表头内容过长时显示为省略号
showHeaderOverflow: {
type: [Boolean, String],
default: null
},
// 当表尾内容过长时显示为省略号
showFooterOverflow: {
type: [Boolean, String],
default: null
},
// 给单元格附加 className
className: [String, Function],
// 给表头单元格附加 className
headerClassName: [String, Function],
// 给表尾单元格附加 className
footerClassName: [String, Function],
// 格式化显示内容
formatter: [Function, Array, String],
// 格式化表头显示内容
headerFormatter: [Function, Array, String],
// 格式化表尾显示内容
footerFormatter: [Function, Array, String],
// 是否显示间距
padding: {
type: Boolean,
default: null
},
// 垂直对齐方式
verticalAlign: {
type: String,
default: null
},
// 是否允许排序
sortable: Boolean,
// 自定义排序的属性
sortBy: [String, Function],
// 排序的字段类型,比如字符串转数值等
sortType: String,
// 配置筛选条件数组
filters: {
type: Array,
default: null
},
// 筛选是否允许多选
filterMultiple: {
type: Boolean,
default: true
},
// 自定义筛选方法
filterMethod: Function,
// 筛选重置方法
filterResetMethod: Function,
// 筛选复原方法
filterRecoverMethod: Function,
// 筛选模板配置项
filterRender: Object,
// 是否显示浮动筛选
floatingFilters: Object,
// 列的校验规则
rules: Array,
// 设置为分组节点
rowGroupNode: Boolean,
// 设置为树节点
treeNode: Boolean,
// 设置为拖拽排序
dragSort: Boolean,
// 设置为行高拖拽
rowResize: Boolean,
// 是否可视
visible: {
type: Boolean,
default: null
},
// 表头单元格数据导出方法
headerExportMethod: Function,
// 单元格数据导出方法
exportMethod: Function,
// 表尾单元格数据导出方法
footerExportMethod: Function,
// 已废弃,被 titlePrefix 替换
titleHelp: Object,
// 标题前缀图标配置项
titlePrefix: Object,
// 标题后缀图标配置项
titleSuffix: Object,
// 单元格值类型
cellType: String,
// 单元格渲染配置项
cellRender: Object,
// 单元格编辑渲染配置项
editRender: Object,
// 内容渲染配置项
contentRender: Object,
// 聚合函数
aggFunc: [Boolean, String],
// 将单元格复制到剪贴板
copyMethod: Function,
// 将剪贴单元格的值清除
cutMethod: Function,
// 从剪贴板赋值到单元格
pasteMethod: Function,
// 额外的参数
params: Object
};
var VxeColumnComponent = defineVxeComponent({
name: 'VxeColumn',
props: columnProps,
setup(props, { slots }) {
const refElem = ref();
const $xeTable = inject('$xeTable', null);
const $xeColgroup = inject('$xeColgroup', null);
if (!$xeTable) {
return () => createCommentVNode();
}
const columnConfig = Cell.createColumn($xeTable, props);
columnConfig.slots = slots;
const renderVN = () => {
return h('div', {
ref: refElem
});
};
const $xeColumn = {
columnConfig,
renderVN
};
watchColumn($xeTable, props, columnConfig);
onMounted(() => {
const elem = refElem.value;
if (elem) {
assembleColumn($xeTable, elem, columnConfig, $xeColgroup);
}
});
onUnmounted(() => {
destroyColumn($xeTable, columnConfig);
});
provide('$xeColumn', $xeColumn);
provide('$xeGrid', null);
provide('$xeGantt', null);
return renderVN;
}
});
const VxeColumn = Object.assign({}, VxeColumnComponent, {
install(app) {
app.component(VxeColumnComponent.name, VxeColumnComponent);
// 兼容旧用法
app.component('VxeTableColumn', VxeColumnComponent);
}
});
if (VxeUI.dynamicApp) {
VxeUI.dynamicApp.component(VxeColumnComponent.name, VxeColumnComponent);
// 兼容旧用法
VxeUI.dynamicApp.component('VxeTableColumn', VxeColumnComponent);
}
VxeUI.component(VxeColumnComponent);
const Column = VxeColumn;
var VxeColgroupComponent = defineVxeComponent({
name: 'VxeColgroup',
props: columnProps,
setup(props, { slots }) {
const refElem = ref();
const $xeTable = inject('$xeTable', null);
const $xeParentColgroup = inject('$xeColgroup', null);
if (!$xeTable) {
return () => createCommentVNode();
}
const columnConfig = Cell.createColumn($xeTable, props);
const columnSlots = {};
if (slots.header) {
columnSlots.header = slots.header;
}
if (slots.title) {
columnSlots.title = slots.title;
}
columnConfig.slots = columnSlots;
columnConfig.children = [];
watchColumn($xeTable, props, columnConfig);
onMounted(() => {
const elem = refElem.value;
if (elem) {
assembleColumn($xeTable, elem, columnConfig, $xeParentColgroup);
}
});
onUnmounted(() => {
destroyColumn($xeTable, columnConfig);
});
const renderVN = () => {
const defaultSlot = slots.default;
return h('div', {
ref: refElem
}, defaultSlot ? defaultSlot() : []);
};
const $xeColgroup = { columnConfig };
provide('$xeColgroup', $xeColgroup);
provide('$xeGrid', null);
provide('$xeGantt', null);
return renderVN;
}
});
const VxeColgroup = Object.assign({}, VxeColgroupComponent, {
install(app) {
app.component(VxeColgroupComponent.name, VxeColgroupComponent);
// 兼容旧用法
app.component('VxeTableColgroup', VxeColgroupComponent);
}
});
if (VxeUI.dynamicApp) {
VxeUI.dynamicApp.component(VxeColgroupComponent.name, VxeColgroupComponent);
// 兼容旧用法
VxeUI.dynamicApp.component('VxeTableColgroup', VxeColgroupComponent);
}
VxeUI.component(VxeColgroupComponent);
const Colgroup = VxeColgroup;
const { getConfig: getConfig$7 } = VxeUI;
const tableProps = {
/** 基本属性 */
id: [String, Function],
// 数据
data: Array,
// 表格的高度
height: [Number, String],
// 表格的最小高度
minHeight: {
type: [Number, String],
default: () => null
},
// 表格的最大高度
maxHeight: [Number, String],
// 已废弃,被 column-config.resizable 替换
resizable: {
type: Boolean,
default: () => getConfig$7().table.resizable
},
// 是否带有斑马纹
stripe: {
type: Boolean,
default: () => getConfig$7().table.stripe
},
// 是否带有边框
border: {
type: [Boolean, String],
default: () => getConfig$7().table.border
},
// 已废弃,被 cell-config.padding 替换
padding: {
type: Boolean,
default: null
},
// 是否圆角边框
round: {
type: Boolean,
default: () => getConfig$7().table.round
},
// 表格的尺寸
size: {
type: String,
default: () => getConfig$7().table.size || getConfig$7().size
},
// 列的宽度是否自撑开(可能会被废弃的参数,不要使用)
fit: {
type: Boolean,
default: () => getConfig$7().table.fit
},
// 表格是否加载中
loading: Boolean,
// 所有的列对其方式
align: {
type: String,
default: () => getConfig$7().table.align
},
// 所有的表头列的对齐方式
headerAlign: {
type: String,
default: () => getConfig$7().table.headerAlign
},
// 所有的表尾列的对齐方式
footerAlign: {
type: String,
default: () => getConfig$7().table.footerAlign
},
// 是否显示表头
showHeader: {
type: Boolean,
default: () => getConfig$7().table.showHeader
},
// (即将废弃)是否要高亮当前选中行
highlightCurrentRow: {
type: Boolean,
default: () => getConfig$7().table.highlightCurrentRow
},
// (即将废弃)鼠标移到行是否要高亮显示
highlightHoverRow: {
type: Boolean,
default: () => getConfig$7().table.highlightHoverRow
},
/**
* (即将废弃)是否要高亮当前选中列
* @deprecated
*/
highlightCurrentColumn: {
type: Boolean,
default: () => getConfig$7().table.highlightCurrentColumn
},
/**
* (即将废弃)鼠标移到列是否要高亮显示
* @deprecated
*/
highlightHoverColumn: {
type: Boolean,
default: () => getConfig$7().table.highlightHoverColumn
},
// (即将废弃)激活单元格编辑时是否高亮显示
highlightCell: Boolean,
// 是否显示表尾合计
showFooter: Boolean,
// 表尾数据
footerData: Array,
// 表尾合计的计算方法
footerMethod: Function,
// 给行附加 className
rowClassName: [String, Function],
// 给单元格附加 className
cellClassName: [String, Function],
// 给表头的行附加 className
headerRowClassName: [String, Function],
// 给表头的单元格附加 className
headerCellClassName: [String, Function],
// 给表尾的行附加 className
footerRowClassName: [String, Function],
// 给表尾的单元格附加 className
footerCellClassName: [String, Function],
// 给单元格附加样式
cellStyle: [Object, Function],
// 给表头单元格附加样式
headerCellStyle: [Object, Function],
// 给表尾单元格附加样式
footerCellStyle: [Object, Function],
// 给行附加样式
rowStyle: [Object, Function],
// 给表头行附加样式
headerRowStyle: [Object, Function],
// 给表尾行附加样式
footerRowStyle: [Object, Function],
// 用于分组表头,显示为自定义列头,配合 mergeHeaderCells 灵活实现自定义合并
showCustomHeader: {
type: Boolean,
default: () => getConfig$7().table.showCustomHeader
},
// 临时合并指定的表头单元格
mergeHeaderCells: Array,
// 临时合并指定的单元格
mergeCells: Array,
// 临时合并指定的表尾单元格
mergeFooterCells: Array,
mergeFooterItems: Array,
// 自定义合并行或列的方法
spanMethod: Function,
// 表尾合并行或列
footerSpanMethod: Function,
// 设置所有内容过长时显示为省略号
showOverflow: {
type: [Boolean, String],
default: () => getConfig$7().table.showOverflow
},
// 设置表头所有内容过长时显示为省略号
showHeaderOverflow: {
type: [Boolean, String],
default: () => getConfig$7().table.showHeaderOverflow
},
// 设置表尾所有内容过长时显示为省略号
showFooterOverflow: {
type: [Boolean, String],
default: () => getConfig$7().table.showFooterOverflow
},
/** 高级属性 */
/**
* (即将废弃)columnKey 已废弃,被 column-config.useKey 替换
* @deprecated
*/
columnKey: Boolean,
/**
* (即将废弃)rowKey 已废弃,被 row-config.useKey 替换
* @deprecated
*/
rowKey: Boolean,
/**
* (即将废弃)rowId 已废弃,被 row-config.keyField 替换
* @deprecated
*/
rowId: {
type: String,
default: () => getConfig$7().table.rowId
},
zIndex: Number,
emptyText: {
type: String,
default: () => getConfig$7().table.emptyText
},
keepSource: {
type: Boolean,
default: () => getConfig$7().table.keepSource
},
// 是否自动监听父容器变化去更新响应式表格宽高
autoResize: {
type: Boolean,
default: () => getConfig$7().table.autoResize
},
// 是否自动根据状态属性去更新响应式表格宽高
syncResize: [Boolean, String, Number],
// 响应式布局配置项
resizeConfig: Object,
// 列配置项
columnConfig: Object,
// 当前列配置项
currentColumnConfig: Object,
// 单元格配置项
cellConfig: Object,
// 表头单元格配置项
headerCellConfig: Object,
// 表尾单元格配置项
footerCellConfig: Object,
// 行配置项
rowConfig: Object,
// 数据聚合配置项
aggregateConfig: Object,
// 聚合函数计算精度配置项
aggregateAccuracyConfig: Object,
/**
* 已废弃,被 aggregateConfig 替换
* @deprecated
*/
rowGroupConfig: Object,
// 当前行配置项
currentRowConfig: Object,
/**
* 已废弃,被 rowDragConfig 替换
* @deprecated
*/
dragConfig: Object,
// 行拖拽排序配置项
rowDragConfig: Object,
// 列拖拽排序配置项
columnDragConfig: Object,
// 列调整配置项
resizableConfig: Object,
// 序号配置项
seqConfig: Object,
// 排序配置项
sortConfig: Object,
// 筛选配置项
filterConfig: Object,
// 浮动筛选配置项
floatingFilterConfig: Object,
// 单选框配置
radioConfig: Object,
// 复选框配置项
checkboxConfig: Object,
// tooltip 配置项
tooltipConfig: Object,
// 表头 tooltip 配置项
headerTooltipConfig: Object,
// 表尾 tooltip 配置项
footerTooltipConfig: Object,
// 导出配置项
exportConfig: Object,
// 导入配置项
importConfig: Object,
// 打印配置项
printConfig: Object,
// 展开行配置项
expandConfig: Object,
// 树形结构配置项
treeConfig: Object,
// 快捷菜单配置项
menuConfig: Object,
// 鼠标配置项
mouseConfig: Object,
// 区域配置项
areaConfig: Object,
// 按键配置项
keyboardConfig: Object,
// 复制粘/贴配置项
clipConfig: Object,
// 查找/替换配置项
fnrConfig: Object,
// 编辑配置项
editConfig: Object,
// 数据状态监听配置项
editDirtyConfig: Object,
// 校验配置项
validConfig: Object,
// 校验规则配置项
editRules: Object,
// 加载中配置项
loadingConfig: Object,
// 空内容渲染配置项
emptyRender: Object,
// 自定义列配置项
customConfig: Object,
/**
* (即将废弃)横向虚拟滚动配置项
* @deprecated
*/
scrollX: Object,
/**
* (即将废弃)纵向虚拟滚动配置项
* @deprecated
*/
scrollY: Object,
// 横向虚拟滚动配置项
virtualXConfig: Object,
// 纵向虚拟滚动配置项
virtualYConfig: Object,
// 滚动条配置项
scrollbarConfig: Object,
// 撤销/恢复历史配置项
undoRedoHistoryConfig: Object,
// (即将废弃)优化相关
animat: {
type: Boolean,
default: () => getConfig$7().table.animat
},
// (可能会被废弃的参数,不要使用)
delayHover: {
type: Number,
default: () => getConfig$7().table.delayHover
},
// 额外的参数
params: Object
};
const { getConfig: getConfig$6 } = VxeUI;
const gridProps = Object.assign(Object.assign({}, tableProps), { layouts: Array, columns: Array, pagerConfig: Object, proxyConfig: Object, toolbarConfig: Object, formConfig: Object, zoomConfig: Object, size: {
type: String,
default: () => getConfig$6().grid.size || getConfig$6().size
} });
const tableEmits = [
'ready',
'init-rendered',
'data-rendered',
'update:data',
'keydown-start',
'keydown',
'keydown-end',
'paste',
'copy',
'cut',
'undo',
'redo',
'context-menu',
'columns-change',
'data-change',
'footer-data-change',
'current-change', // 已废弃
'current-row-change',
'current-row-disabled',
'current-column-change',
'current-column-disabled',
'radio-change',
'checkbox-change',
'checkbox-all',
'checkbox-range-start',
'checkbox-range-change',
'checkbox-range-end',
'checkbox-range-select',
'cell-click',
'cell-dblclick',
'cell-menu',
'cell-mouseenter',
'cell-mouseleave',
'cell-selected',
'cell-delete-value',
'cell-backspace-value',
'header-cell-click',
'header-cell-dblclick',
'header-cell-menu',
'footer-cell-click',
'footer-cell-dblclick',
'footer-cell-menu',
'clear-merge',
'sort-change',
'clear-sort',
'clear-all-sort',
'filter-change',
'filter-visible',
'clear-filter',
'clear-all-filter',
'resizable-change', // 废弃
'column-resizable-change',
'row-resizable-change',
'toggle-row-group-expand',
'toggle-row-expand',
'toggle-tree-expand',
'menu-click',
'edit-closed',
'row-dragstart',
'row-dragover',
'row-dragend',
'row-remove-dragend',
'row-insert-dragend',
'column-dragstart',
'column-dragover',
'column-dragend',
'enter-append-row',
'tab-append-row',
'edit-actived', // 废弃
'edit-activated',
'edit-disabled',
'valid-error',
'scroll',
'scroll-boundary',
'custom',
'custom-open',
'custom-close',
'custom-cancel',
'custom-reset',
'custom-confirm',
'custom-visible-change',
'custom-visible-all',
'custom-fixed-change',
'custom-sort-change',
'custom-align-change',
'custom-header-align-change',
'custom-footer-align-change',
'change-fnr', // 废弃
'open-fnr',
'show-fnr',
'hide-fnr',
'fnr-change',
'fnr-find',
'fnr-find-all',
'fnr-replace',
'fnr-replace-all',
'cell-area-copy',
'cell-area-cut',
'cell-area-paste',
'cell-area-merge',
'clear-cell-area-selection',
'clear-cell-area-merge',
'header-cell-area-selection',
'cell-area-selection-invalid',
'cell-area-selection-start',
'cell-area-selection-drag',
'cell-area-selection-end',
'cell-area-extension-start',
'cell-area-extension-drag',
'cell-area-extension-end',
'cell-area-extension-fill',
'cell-area-selection-all-start',
'cell-area-selection-all-end',
'cell-area-arrows-start',
'cell-area-arrows-end',
'cell-area-fill-copy',
'active-cell-change-start',
'active-cell-change-end'
];
const gridEmits = [
...tableEmits,
'page-change',
'form-submit',
'form-submit-invalid',
'form-reset',
'form-collapse',
'form-toggle-collapse',
'proxy-query',
'proxy-delete',
'proxy-save',
'toolbar-button-click',
'toolbar-tool-click',
'zoom'
];
const rowMoveCls = 'row--drag-move';
const colMoveClass = 'col--drag-move';
/**
* 上下拖拽
*/
function moveRowAnimateToTb(elemList, offsetTop) {
XEUtils.arrayEach(elemList, trEl => {
trEl.style.transform = `translateY(${offsetTop}px)`;
});
requestAnimationFrame(() => {
XEUtils.arrayEach(elemList, trEl => {
addClass(trEl, rowMoveCls);
trEl.style.transform = '';
});
});
}
function clearRowAnimate(elem, clss) {
setTimeout(() => {
if (elem) {
XEUtils.arrayEach(elem.querySelectorAll(clss.map(cls => `${cls}.${rowMoveCls}`).join(',')), elem => removeClass(elem, rowMoveCls));
}
}, 500);
}
/**
* 左右拖拽
*/
function moveColAnimateToLr(elemList, offsetLeft) {
XEUtils.arrayEach(elemList, trEl => {
trEl.style.transform = `translateX(${offsetLeft}px)`;
});
requestAnimationFrame(() => {
XEUtils.arrayEach(elemList, trEl => {
addClass(trEl, colMoveClass);
trEl.style.transform = '';
});
});
}
function clearColAnimate(elem, clss) {
setTimeout(() => {
if (elem) {
XEUtils.arrayEach(elem.querySelectorAll(clss.map(cls => `${cls}.${rowMoveCls}`).join(',')), elem => removeClass(elem, colMoveClass));
}
}, 500);
}
// 跨表拖拽
const crossTableDragRowInfo = reactive({
row: null
});
function getCrossTableDragRowInfo() {
return crossTableDragRowInfo;
}
const { getI18n: getI18n$b, renderer: renderer$9, renderEmptyElement: renderEmptyElement$9 } = VxeUI;
const sourceType$4 = 'table';
const renderType$2 = 'body';
var TableBodyComponent = defineVxeComponent({
name: 'VxeTableBody',
props: {
tableData: Array,
tableColumn: Array,
fixedColumn: Array,
fixedType: {
type: String,
default: ''
}
},
setup(props) {
const $xeTable = inject('$xeTable', {});
const { xID, props: tableProps, context: tableContext, reactData: tableReactData, internalData: tableInternalData } = $xeTable;
const { computeEditOpts, computeMouseOpts, computeCellOffsetWidth, computeAreaOpts, computeDefaultRowHeight, computeEmptyOpts, computeTooltipOpts, computeRadioOpts, computeExpandOpts, computeTreeOpts, computeCheckboxOpts, computeCellOpts, computeValidOpts, computeRowOpts, computeColumnOpts, computeRowDragOpts, computeResizableOpts, computeVirtualXOpts, computeVirtualYOpts, computeIsBodyRenderOptimize } = $xeTable.getComputeMaps();
const refElem = ref();
const refBodyScroll = ref();
const refBodyTable = ref();
const refBodyColgroup = ref();
const refBodyTBody = ref();
const refBodyXSpace = ref();
const refBodyYSpace = ref();
const refBodyEmptyBlock = ref();
// 滚动、拖动过程中不需要触发
const isVMScrollProcess = () => {
const { delayHover } = tableProps;
const { isDragResize } = tableReactData;
const { lastSTime } = tableInternalData;
return !!(isDragResize || (lastSTime && Date.now() < lastSTime + delayHover));
};
const renderLine = (rowid, params, cellHeight) => {
const { column } = params;
const { treeConfig } = tableProps;
const cellOpts = computeCellOpts.value;
const rowOpts = computeRowOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const treeOpts = computeTreeOpts.value;
const { slots, treeNode } = column;
const { fullAllDataRowIdData } = tableInternalData;
if (treeConfig && treeNode && (treeOpts.showLine || treeOpts.line)) {
if (slots && slots.line) {
return $xeTable.callSlot(slots.line, params);
}
const rowRest = fullAllDataRowIdData[rowid];
let rLevel = 0;
let prevRow = null;
let parentRow = null;
let lineHeight = '';
if (rowRest) {
rLevel = rowRest.level;
prevRow = rowRest.items[rowRest.treeIndex - 1];
parentRow = rowRest.parent;
}
if (!rLevel && !treeOpts.showRootLine) {
return [];
}
if (prevRow) {
const prevRowRest = fullAllDataRowIdData[getRowid($xeTable, prevRow)] || {};
lineHeight = `${prevRowRest.lineHeight || 0}px`;
}
else if (rLevel && parentRow) {
const parentRowRest = fullAllDataRowIdData[getRowid($xeTable, parentRow)] || {};
lineHeight = `calc(-1em + ${Math.floor(cellHeight / 2 + getCellRestHeight(parentRowRest, cellOpts, rowOpts, defaultRowHeight) / 2)}px)`;
}
return [
h('div', {
key: 'tl',
class: 'vxe-tree--line-wrapper'
}, [
h('div', {
class: 'vxe-tree--line',
style: {
height: lineHeight,
bottom: `-${Math.floor(cellHeight / 2)}px`,
left: `calc(${(rLevel * treeOpts.indent)}px + 1em)`
}
})
])
];
}
return [];
};
/**
* 渲染列
*/
const renderTdColumn = (seq, rowid, fixedType, isOptimizeMode, rowLevel, row, rowIndex, $rowIndex, _rowIndex, column, $columnIndex, columns, items) => {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const { columnKey, resizable: allResizable, showOverflow: allShowOverflow, border, height, treeConfig, cellClassName: allCellClassName, cellStyle, align: allAlign, spanMethod, mouseConfig, editConfig, editRules, tooltipConfig, padding: allPadding } = tableProps;
const { tableData, tableColumn, dragRow, overflowX, overflowY, currentColumn, scrollXLoad, scrollYLoad, mergeBodyFlag, calcCellHeightFlag, resizeHeightFlag, resizeWidthFlag, editStore, isAllOverflow, validErrorMaps } = tableReactData;
const { fullAllDataRowIdData, fullColumnIdData, mergeBodyCellMaps, visibleColumn, afterFullData, mergeBodyList, scrollXStore, scrollYStore, keepUpdateFieldMaps } = tableInternalData;
const cellOpts = computeCellOpts.value;
const validOpts = computeValidOpts.value;
const checkboxOpts = computeCheckboxOpts.value;
const editOpts = computeEditOpts.value;
const tooltipOpts = computeTooltipOpts.value;
const resizableOpts = computeResizableOpts.value;
const virtualXOpts = computeVirtualXOpts.value;
const virtualYOpts = computeVirtualYOpts.value;
const { isAllColumnDrag, isAllRowDrag } = resizableOpts;
const rowOpts = computeRowOpts.value;
const rowDragOpts = computeRowDragOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const customCellHeight = calcCellHeightFlag ? (cellOpts.height || rowOpts.height) : 0;
const { disabledMethod: dragDisabledMethod, isCrossDrag, isPeerDrag } = rowDragOpts;
const columnOpts = computeColumnOpts.value;
const mouseOpts = computeMouseOpts.value;
const areaOpts = computeAreaOpts.value;
const cellOffsetWidth = computeCellOffsetWidth.value;
const { selectCellToRow } = areaOpts;
const { field, type, cellRender, editRender, align, showOverflow, className, treeNode, rowResize, padding, verticalAlign, slots } = column;
const { verticalAlign: allVerticalAlign, minHeight, maxHeight } = cellOpts;
const { actived } = editStore;
const rowRest = fullAllDataRowIdData[rowid] || {};
const colid = column.id;
const colRest = fullColumnIdData[colid] || {};
const renderOpts = editRender || cellRender;
const compConf = renderOpts ? renderer$9.get(renderOpts.name) : null;
const compCellClassName = compConf ? (compConf.tableCellClassName || compConf.cellClassName) : null;
const compCellStyle = compConf ? (compConf.tableCellStyle || compConf.cellStyle) : '';
const showAllTip = tooltipOpts.showAll;
const columnIndex = colRest.index;
const _columnIndex = colRest._index;
const isEdit = isEnableConf(editRender);
const resizeHeight = resizeHeightFlag ? rowRest.resizeHeight : 0;
let fixedHiddenColumn = overflowX && (fixedType ? column.fixed !== fixedType : !!column.fixed);
const cellPadding = getDefaultConfig(padding, (allPadding === null ? cellOpts.padding : allPadding));
const isAllCellPadding = cellPadding === true;
const isCellPaddingTop = cellPadding ? (isAllCellPadding || cellPadding.top !== false) : false;
const isCellPaddingBottom = cellPadding ? (isAllCellPadding || cellPadding.bottom !== false) : false;
const isCellPaddingLeft = cellPadding ? (isAllCellPadding || cellPadding.left !== false) : false;
const isCellPaddingRight = cellPadding ? (isAllCellPadding || cellPadding.right !== false) : false;
const cellOverflow = getDefaultConfig(showOverflow, allShowOverflow);
const showEllipsis = (cellOverflow === true ? tooltipOpts.mode : cellOverflow) === 'ellipsis';
const showTitle = (cellOverflow === true ? tooltipOpts.mode : cellOverflow) === 'title';
const showTooltip = (cellOverflow === true ? tooltipOpts.mode : cellOverflow) === 'tooltip';
const hasEllipsis = isAllOverflow || showTitle || showTooltip || showEllipsis;
const showResizable = (XEUtils.isBoolean(column.resizable) ? column.resizable : (columnOpts.resizable || allResizable));
const isCsHeight = !!customCellHeight;
const isRsHeight = resizeHeight > 0;
let isDirty;
const tdOns = {};
const cellAlign = align || (compConf ? compConf.tableCellAlign : '') || allAlign;
const cellVerticalAlign = XEUtils.eqNull(verticalAlign) ? allVerticalAlign : verticalAlign;
const errorValidItem = validErrorMaps[`${rowid}:${colid}`];
const showValidTip = editRules && validOpts.showErrorMessage && (validOpts.message === 'default' ? (height || tableData.length > 1) : validOpts.message === 'inline');
const tdAttrs = { colid };
const cellParams = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt,
isEdit: false,
seq,
rowid,
row,
rowIndex,
$rowIndex,
_rowIndex,
column,
columnIndex,
$columnIndex,
_columnIndex,
fixed: fixedType,
source: sourceType$4,
type: renderType$2,
isHidden: !!fixedHiddenColumn,
level: rowLevel,
visibleData: afterFullData,
data: tableData,
items
};
let isRowDragCell = false;
let isDisabledDrag = false;
if (rowOpts.drag) {
isRowDragCell = rowDragOpts.trigger === 'row' || (column.dragSort && rowDragOpts.trigger === 'cell');
}
if (isRowDragCell) {
isDisabledDrag = !!(dragDisabledMethod && dragDisabledMethod(cellParams));
}
// hover 进入事件
if (showTitle || showTooltip || showAllTip || tooltipConfig) {
tdOns.onMouseover = (evnt) => {
if (!isVMScrollProcess()) {
if (showTitle) {
updateCellTitle(evnt.currentTarget, column);
}
else if (showTooltip || showAllTip) {
// 如果配置了显示 tooltip
$xeTable.triggerBodyTooltipEvent(evnt, cellParams);
}
}
$xeTable.dispatchEvent('cell-mouseenter', Object.assign({ cell: evnt.currentTarget }, cellParams), evnt);
};
}
// hover 退出事件
if (showTooltip || showAllTip || tooltipConfig) {
tdOns.onMouseleave = (evnt) => {
if (!isVMScrollProcess()) {
if (showTooltip || showAllTip) {
$xeTable.handleTargetLeaveEvent(evnt);
}
}
$xeTable.dispatchEvent('cell-mouseleave', Object.assign({ cell: evnt.currentTarget }, cellParams), evnt);
};
}
// 按下事件处理
if (isRowDragCell || checkboxOpts.range || mouseConfig) {
tdOns.onMousedown = (evnt) => {
$xeTable.triggerCellMousedownEvent(evnt, cellParams);
};
}
// 拖拽列事件
if (isRowDragCell) {
tdOns.onMouseup = $xeTable.triggerCellMouseupEvent;
}
// 点击事件处理
tdOns.onClick = (evnt) => {
$xeTable.triggerCellClickEvent(evnt, cellParams);
};
// 双击事件处理
tdOns.onDblclick = (evnt) => {
$xeTable.triggerCellDblclickEvent(evnt, cellParams);
};
let isMergeCell = false;
let mergeColspan = 1;
let mergeRowspan = 1;
// 合并行或列
if (mergeBodyFlag && mergeBodyList.length) {
const spanRest = mergeBodyCellMaps[`${_rowIndex}:${_columnIndex}`];
if (spanRest) {
const { rowspan, colspan } = spanRest;
if (!rowspan || !colspan) {
return renderEmptyElement$9($xeTable);
}
if (rowspan > 1) {
isMergeCell = true;
mergeRowspan = rowspan;
tdAttrs.rowspan = rowspan;
}
if (colspan > 1) {
isMergeCell = true;
mergeColspan = colspan;
tdAttrs.colspan = colspan;
}
}
}
else if (spanMethod) {
// 自定义合并行或列的方法
const { rowspan = 1, colspan = 1 } = spanMethod(cellParams) || {};
if (!rowspan || !colspan) {
return renderEmptyElement$9($xeTable);
}
if (rowspan > 1) {
isMergeCell = true;
mergeRowspan = rowspan;
tdAttrs.rowspan = rowspan;
}
if (colspan > 1) {
isMergeCell = true;
mergeColspan = colspan;
tdAttrs.colspan = colspan;
}
}
// 如果被合并不可隐藏
if (fixedHiddenColumn && isMergeCell) {
if (tdAttrs.colspan > 1 || tdAttrs.rowspan > 1) {
fixedHiddenColumn = false;
}
}
// 如果编辑列开启显示状态
if (!fixedHiddenColumn && editConfig && (editOpts.showStatus || editOpts.showUpdateStatus) && keepUpdateFieldMaps[field]) {
isDirty = $xeTable.isUpdateByRow(row, field);
}
const isVNAutoHeight = !hasEllipsis && (scrollYLoad || scrollXLoad);
let cellHeight = getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight);
const isLastColumn = $columnIndex === columns.length - 1;
const isAutoCellWidth = !column.resizeWidth && (column.minWidth === 'auto' || column.width === 'auto');
let isVNPreEmptyStatus = false;
if (!isMergeCell) {
if (!dragRow || getRowid($xeTable, dragRow) !== rowid) {
if (overflowY && scrollYLoad && tableData.length > 16 && !treeConfig && !virtualYOpts.immediate && (_rowIndex < scrollYStore.visibleStartIndex - scrollYStore.preloadSize || _rowIndex > scrollYStore.visibleEndIndex + scrollYStore.preloadSize)) {
isVNPreEmptyStatus = true;
}
else if (overflowX && scrollXLoad && tableColumn.length > 10 && !virtualXOpts.immediate && !column.fixed && (_columnIndex < scrollXStore.visibleStartIndex - scrollXStore.preloadSize || _columnIndex > scrollXStore.visibleEndIndex + scrollXStore.preloadSize)) {
isVNPreEmptyStatus = true;
}
}
}
if (mergeRowspan > 1) {
const mEndRow = afterFullData[_rowIndex + mergeRowspan - 1];
if (mEndRow) {
const meRowRest = fullAllDataRowIdData[getRowid($xeTable, mEndRow)];
if (meRowRest) {
cellHeight += meRowRest.oTop + getCellRestHeight(meRowRest, cellOpts, rowOpts, defaultRowHeight) - rowRest.oTop - getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight);
}
}
}
const tcStyle = {};
if (maxHeight) {
tcStyle.maxHeight = maxHeight + 'px';
}
if (hasEllipsis && resizeWidthFlag) {
let mergeColWidth = 0;
if (mergeColspan > 1) {
for (let index = 1; index < mergeColspan; index++) {
const nextColumn = visibleColumn[columnIndex + index];
if (nextColumn) {
mergeColWidth += nextColumn.renderWidth;
}
}
}
tcStyle.width = (column.renderWidth + mergeColWidth - cellOffsetWidth) + 'px';
}
if (scrollYLoad || scrollXLoad || hasEllipsis || isCsHeight || isRsHeight) {
tcStyle.height = cellHeight + 'px';
}
else {
tcStyle.minHeight = cellHeight + 'px';
}
if (minHeight) {
tcStyle.minHeight = minHeight + 'px';
}
const tdVNs = [];
if (fixedHiddenColumn && isAllOverflow) {
tdVNs.push(h('div', {
key: 'tc',
class: ['vxe-cell', {
'c--title': showTitle,
'c--tooltip': showTooltip,
'c--ellipsis': showEllipsis
}],
style: tcStyle
}));
}
else {
// 渲染单元格
if (treeConfig) {
tdVNs.push(...renderLine(rowid, cellParams, cellHeight));
}
const clVNs = [];
if (!isVNPreEmptyStatus) {
clVNs.push(h('div', {
colid,
rowid,
class: 'vxe-cell--wrapper vxe-body-cell--wrapper'
}, column.renderCell(cellParams)));
}
tdVNs.push(h('div', {
key: 'tc',
class: ['vxe-cell', {
'c--title': showTitle,
'c--tooltip': showTooltip,
'c--ellipsis': showEllipsis
}],
style: tcStyle,
title: showTitle ? $xeTable.getCellLabel(row, column) : null
}, clVNs));
if (showValidTip && errorValidItem) {
const errRule = errorValidItem.rule;
const validSlot = slots ? slots.valid : null;
const validParams = Object.assign(Object.assign(Object.assign({}, cellParams), errorValidItem), { rule: errorValidItem });
tdVNs.push(h('div', {
key: 'tcv',
class: ['vxe-cell--valid-error-tip', getPropClass(validOpts.className, validParams)],
style: errRule && errRule.maxWidth
? {
width: errRule.maxWidth + 'px'
}
: null
}, [
h('div', {
class: `vxe-cell--valid-error-wrapper vxe-cell--valid-error-theme-${validOpts.theme || 'normal'}`
}, [
validSlot
? $xeTable.callSlot(validSlot, validParams)
: [
h('span', {
class: 'vxe-cell--valid-error-msg'
}, errorValidItem.content)
]
])
]));
}
}
let showAreaRowStatus = false;
if (mouseConfig && mouseOpts.area && !_columnIndex && selectCellToRow) {
showAreaRowStatus = true;
}
if (!fixedHiddenColumn && showResizable && isAllColumnDrag) {
tdVNs.push(h('div', {
key: 'tcc',
class: ['vxe-cell--col-resizable', {
'is--line': !border || border === 'none'
}],
onMousedown: (evnt) => $xeTable.handleColResizeMousedownEvent(evnt, fixedType, cellParams),
onDblclick: (evnt) => $xeTable.handleColResizeDblclickEvent(evnt, cellParams)
}));
}
if ((rowResize || isAllRowDrag) && rowOpts.resizable) {
tdVNs.push(h('div', {
key: 'tcr',
class: 'vxe-cell--row-resizable',
onMousedown: (evnt) => $xeTable.handleRowResizeMousedownEvent(evnt, cellParams),
onDblclick: (evnt) => $xeTable.handleRowResizeDblclickEvent(evnt, cellParams)
}));
}
return h('td', Object.assign(Object.assign(Object.assign({ class: [
'vxe-table--column vxe-body--column',
colid,
cellVerticalAlign ? `col--vertical-${cellVerticalAlign}` : '',
cellAlign ? `col--${cellAlign}` : '',
type ? `col--${type}` : '',
{
'col--last': isLastColumn,
'col--tree-node': treeNode,
'col--edit': isEdit,
'col--ellipsis': hasEllipsis,
'col--cs-height': isCsHeight,
'col--rs-height': isRsHeight,
'col--to-row': showAreaRowStatus,
'col--auto-height': isVNAutoHeight,
'col--max-height': maxHeight,
'fixed--width': !isAutoCellWidth,
'fixed--hidden': fixedHiddenColumn,
'is--pg-top': isCellPaddingTop,
'is--pg-bottom': isCellPaddingBottom,
'is--pg-left': isCellPaddingLeft,
'is--pg-right': isCellPaddingRight,
'is--progress': (fixedHiddenColumn && isAllOverflow) || isVNPreEmptyStatus,
'is--drag-cell': isRowDragCell && (isCrossDrag || isPeerDrag || !rowLevel),
'is--drag-disabled': isDisabledDrag,
'col--dirty': isDirty,
'col--active': editConfig && isEdit && (actived.row === row && (actived.column === column || editOpts.mode === 'row')),
'col--valid-error': !!errorValidItem,
'show--valid-bg': errorValidItem && validOpts.showErrorBackground,
'col--current': currentColumn === column
},
getPropClass(compCellClassName, cellParams),
getPropClass(className, cellParams),
getPropClass(allCellClassName, cellParams)
], key: columnKey || scrollXLoad || scrollYLoad || columnOpts.useKey || rowOpts.useKey || columnOpts.drag ? colid : $columnIndex }, tdAttrs), { style: Object.assign({}, XEUtils.isFunction(compCellStyle) ? compCellStyle(cellParams) : compCellStyle, XEUtils.isFunction(cellStyle) ? cellStyle(cellParams) : cellStyle) }), tdOns), isOptimizeMode && fixedHiddenColumn ? [] : tdVNs);
};
const renderRows = (fixedType, isOptimizeMode, tableData, tableColumn) => {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const { stripe, rowKey, highlightHoverRow, rowClassName, rowStyle, editConfig, treeConfig } = tableProps;
const { hasFixedColumn, treeExpandedFlag, scrollYLoad, isAllOverflow, rowExpandedFlag, expandColumn, selectRadioRow, pendingRowFlag, rowExpandHeightFlag, isRowGroupStatus } = tableReactData;
const { fullAllDataRowIdData, fullColumnIdData, treeExpandedMaps, pendingRowMaps, rowExpandedMaps, currentRow } = tableInternalData;
const checkboxOpts = computeCheckboxOpts.value;
const radioOpts = computeRadioOpts.value;
const treeOpts = computeTreeOpts.value;
const editOpts = computeEditOpts.value;
const rowOpts = computeRowOpts.value;
const columnOpts = computeColumnOpts.value;
const { transform, seqMode } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
const rows = [];
const { handleGetRowId } = createHandleGetRowId($xeTable);
const isDeepRow = treeConfig || isRowGroupStatus;
tableData.forEach((row, $rowIndex) => {
const rowid = handleGetRowId(row);
const rowRest = fullAllDataRowIdData[rowid] || {};
let rowIndex = $rowIndex;
let rowLevel = 0;
let seq = -1;
let _rowIndex = -1;
const hasRowGroupAggregate = isRowGroupStatus && row.isAggregate;
const trOn = {};
// 当前行事件
if (rowOpts.isHover || highlightHoverRow) {
trOn.onMouseover = (evnt) => {
if (isVMScrollProcess()) {
return;
}
$xeTable.triggerHoverEvent(evnt, { row, rowIndex });
};
trOn.onMouseleave = () => {
if (isVMScrollProcess()) {
return;
}
$xeTable.clearHoverRow();
};
}
if (rowRest) {
rowIndex = rowRest.index;
_rowIndex = rowRest._index;
rowLevel = rowRest.level;
seq = rowRest.seq;
if (hasRowGroupAggregate || (treeConfig && transform && seqMode === 'increasing')) {
seq = rowRest._index + 1;
}
else if ((treeConfig && seqMode === 'fixed')) {
seq = rowRest._tIndex + 1;
}
}
const params = {
$table: $xeTable,
seq,
rowid,
fixed: fixedType,
type: renderType$2,
level: rowLevel,
row,
rowIndex,
$rowIndex,
_rowIndex
};
// 行是否被展开
const isExpandRow = expandColumn && !!rowExpandedFlag && !!rowExpandedMaps[rowid];
// 树节点是否被展开
let isExpandTree = false;
let rowChildren = [];
let isNewRow = false;
if (editConfig) {
isNewRow = $xeTable.isInsertByRow(row);
}
if (treeConfig && !scrollYLoad && !transform) {
rowChildren = row[childrenField];
isExpandTree = !!treeExpandedFlag && rowChildren && rowChildren.length > 0 && !!treeExpandedMaps[rowid];
}
// 拖拽行事件
if (rowOpts.drag && !isRowGroupStatus && (!treeConfig || transform)) {
trOn.onDragstart = $xeTable.handleRowDragDragstartEvent;
trOn.onDragend = $xeTable.handleRowDragDragendEvent;
trOn.onDragover = $xeTable.handleRowDragDragoverEvent;
}
const trClass = [
'vxe-body--row',
isDeepRow ? `row--level-${rowLevel}` : '',
{
'row--stripe': stripe && (_rowIndex + 1) % 2 === 0,
'is--new': isNewRow,
'is--expand-row': isExpandRow,
'is--expand-tree': isExpandTree,
'row--new': isNewRow && (editOpts.showStatus || editOpts.showInsertStatus),
'row--radio': radioOpts.highlight && $xeTable.eqRow(selectRadioRow, row),
'row--checked': checkboxOpts.highlight && $xeTable.isCheckedByCheckboxRow(row),
'row--pending': !!pendingRowFlag && !!pendingRowMaps[rowid],
'row--group': hasRowGroupAggregate,
'row--current': currentRow && rowid === getRowid($xeTable, currentRow)
},
getPropClass(rowClassName, params)
];
const tdVNs = tableColumn.map((column, $columnIndex) => {
return renderTdColumn(seq, rowid, fixedType, isOptimizeMode, rowLevel, row, rowIndex, $rowIndex, _rowIndex, column, $columnIndex, tableColumn, tableData);
});
rows.push(h('tr', Object.assign({ class: trClass, rowid: rowid, style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(params) : rowStyle) : null, key: rowKey || rowOpts.useKey || rowOpts.drag || columnOpts.drag || isRowGroupStatus || treeConfig ? rowid : $rowIndex }, trOn), tdVNs));
// 如果行被展开了
if (isExpandRow) {
const expandOpts = computeExpandOpts.value;
const { height: expandHeight, padding, mode: expandMode } = expandOpts;
if (expandMode === 'fixed') {
const currExpHeight = rowRest.expandHeight;
let expHeight = 0;
if (rowExpandHeightFlag) {
if (currExpHeight || expandHeight) {
expHeight = (currExpHeight || expandHeight || 0) + 1;
}
}
rows.push(h('tr', {
class: 'vxe-body--row-expanded-place',
key: `expand_${rowid}`,
rowid
}, [
h('td', {
class: 'vxe-body--row-expanded-place-column',
colspan: tableColumn.length,
style: {
height: `${expHeight}px`
}
})
]));
}
else {
const cellStyle = {};
if (expandHeight) {
cellStyle.height = `${expandHeight}px`;
}
if (treeConfig) {
cellStyle.paddingLeft = `${(rowLevel * treeOpts.indent) + 30}px`;
}
const { showOverflow } = expandColumn || {};
const colid = expandColumn.id;
const colRest = fullColumnIdData[colid] || {};
const hasEllipsis = XEUtils.eqNull(showOverflow) ? isAllOverflow : showOverflow;
let columnIndex = -1;
let $columnIndex = -1;
let _columnIndex = -1;
if (colRest) {
columnIndex = colRest.index;
$columnIndex = colRest.$index;
_columnIndex = colRest._index;
}
const expandParams = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt,
seq,
column: expandColumn,
columnIndex,
$columnIndex,
_columnIndex,
fixed: fixedType,
source: sourceType$4,
type: renderType$2,
level: rowLevel,
row,
rowid,
rowIndex,
$rowIndex,
_rowIndex,
isHidden: false,
isEdit: false,
visibleData: [],
data: [],
items: []
};
rows.push(h('tr', {
class: ['vxe-body--expanded-row', {
'is--padding': padding
}],
key: `expand_${rowid}`
}, [
h('td', {
class: ['vxe-body--expanded-column', {
'fixed--hidden': fixedType && !hasFixedColumn,
'col--ellipsis': hasEllipsis
}],
colspan: tableColumn.length
}, [
h('div', {
class: ['vxe-body--expanded-cell', {
'is--ellipsis': expandHeight
}],
style: cellStyle
}, [
expandColumn.renderData(expandParams)
])
])
]));
}
}
// 如果是树形表格
if (isExpandTree) {
rows.push(...renderRows(fixedType, isOptimizeMode, rowChildren, tableColumn));
}
});
return rows;
};
onMounted(() => {
nextTick(() => {
const { fixedType } = props;
const { elemStore } = tableInternalData;
const prefix = `${fixedType || 'main'}-body-`;
elemStore[`${prefix}wrapper`] = refElem;
elemStore[`${prefix}scroll`] = refBodyScroll;
elemStore[`${prefix}table`] = refBodyTable;
elemStore[`${prefix}colgroup`] = refBodyColgroup;
elemStore[`${prefix}list`] = refBodyTBody;
elemStore[`${prefix}xSpace`] = refBodyXSpace;
elemStore[`${prefix}ySpace`] = refBodyYSpace;
elemStore[`${prefix}emptyBlock`] = refBodyEmptyBlock;
});
});
onUnmounted(() => {
const { fixedType } = props;
const { elemStore } = tableInternalData;
const prefix = `${fixedType || 'main'}-body-`;
elemStore[`${prefix}wrapper`] = null;
elemStore[`${prefix}scroll`] = null;
elemStore[`${prefix}table`] = null;
elemStore[`${prefix}colgroup`] = null;
elemStore[`${prefix}list`] = null;
elemStore[`${prefix}xSpace`] = null;
elemStore[`${prefix}ySpace`] = null;
elemStore[`${prefix}emptyBlock`] = null;
});
const renderVN = () => {
const { slots } = tableContext;
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const { fixedColumn, fixedType, tableColumn } = props;
const { mouseConfig } = tableProps;
const { isGroup, tableData, isColLoading, overflowX, scrollXLoad, scrollYLoad, dragRow, dragCol } = tableReactData;
const { visibleColumn, fullAllDataRowIdData, fullColumnIdData } = tableInternalData;
const emptyOpts = computeEmptyOpts.value;
const mouseOpts = computeMouseOpts.value;
const isBodyRenderOptimize = computeIsBodyRenderOptimize.value;
let renderDataList = tableData;
let renderColumnList = tableColumn;
const isOptimizeMode = isBodyRenderOptimize;
if (!isColLoading && (fixedType || !overflowX)) {
renderColumnList = visibleColumn;
}
if (fixedType) {
if (isOptimizeMode) {
renderColumnList = fixedColumn || [];
}
}
// 行拖拽
if (scrollYLoad && dragRow) {
if (renderDataList.length > 2) {
const dRowRest = fullAllDataRowIdData[getRowid($xeTable, dragRow)];
if (dRowRest) {
const drIndex = dRowRest._index;
const firstRow = renderDataList[0];
const lastRow = renderDataList[renderDataList.length - 1];
const firstRowRest = fullAllDataRowIdData[getRowid($xeTable, firstRow)];
const lastRowRest = fullAllDataRowIdData[getRowid($xeTable, lastRow)];
if (firstRowRest && lastRowRest) {
const frIndex = firstRowRest._index;
const lrIndex = lastRowRest._index;
if (drIndex < frIndex) {
renderDataList = [dragRow].concat(renderDataList);
}
else if (drIndex > lrIndex) {
renderDataList = renderDataList.concat([dragRow]);
}
}
}
}
}
if (!fixedType && !isGroup) {
// 列拖拽
if (scrollXLoad && dragCol) {
if (renderColumnList.length > 2) {
const dCowRest = fullColumnIdData[dragCol.id];
if (dCowRest) {
const dcIndex = dCowRest._index;
const firstCol = renderColumnList[0];
const lastCol = renderColumnList[renderColumnList.length - 1];
const firstColRest = fullColumnIdData[firstCol.id];
const lastColRest = fullColumnIdData[lastCol.id];
if (firstColRest && lastColRest) {
const fcIndex = firstColRest._index;
const lcIndex = lastColRest._index;
if (dcIndex < fcIndex) {
renderColumnList = [dragCol].concat(renderColumnList);
}
else if (dcIndex > lcIndex) {
renderColumnList = renderColumnList.concat([dragCol]);
}
}
}
}
}
}
let emptyContent;
const emptySlot = slots ? slots.empty : null;
const emptyParams = { $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt };
if (emptySlot) {
emptyContent = $xeTable.callSlot(emptySlot, emptyParams);
}
else {
const compConf = emptyOpts.name ? renderer$9.get(emptyOpts.name) : null;
const rtEmptyView = compConf ? (compConf.renderTableEmpty || compConf.renderTableEmptyView || compConf.renderEmpty) : null;
if (rtEmptyView) {
emptyContent = getSlotVNs(rtEmptyView(emptyOpts, emptyParams));
}
else {
emptyContent = tableProps.emptyText || getI18n$b('vxe.table.emptyText');
}
}
return h('div', {
ref: refElem,
class: ['vxe-table--body-wrapper', fixedType ? `fixed-${fixedType}--wrapper` : 'body--wrapper'],
xid: xID
}, [
h('div', {
ref: refBodyScroll,
class: 'vxe-table--body-inner-wrapper',
onScroll(evnt) {
$xeTable.triggerBodyScrollEvent(evnt, fixedType);
}
}, [
fixedType
? renderEmptyElement$9($xeTable)
: h('div', {
ref: refBodyXSpace,
class: 'vxe-body--x-space'
}),
h('div', {
ref: refBodyYSpace,
class: 'vxe-body--y-space'
}),
h('table', {
ref: refBodyTable,
class: 'vxe-table--body',
xid: xID,
cellspacing: 0,
cellpadding: 0,
border: 0,
xvm: isOptimizeMode ? '1' : null
}, [
/**
* 列宽
*/
h('colgroup', {
ref: refBodyColgroup
}, renderColumnList.map((column, $columnIndex) => {
return h('col', {
name: column.id,
key: $columnIndex,
style: {
width: `${column.renderWidth}px`
}
});
})),
/**
* 内容
*/
h('tbody', {
ref: refBodyTBody
}, renderRows(fixedType, isOptimizeMode, renderDataList, renderColumnList))
]),
h('div', {
class: 'vxe-table--checkbox-range'
}),
mouseConfig && mouseOpts.area
? h('div', {
class: 'vxe-table--cell-area',
xid: xID
}, [
h('span', {
class: 'vxe-table--cell-main-area'
}, mouseOpts.extension
? [
h('span', {
class: 'vxe-table--cell-main-area-btn',
onMousedown(evnt) {
if ($xeTable.triggerCellAreaExtendMousedownEvent) {
$xeTable.triggerCellAreaExtendMousedownEvent(evnt, { $table: $xeTable, fixed: fixedType, type: renderType$2 });
}
}
})
]
: []),
h('span', {
class: 'vxe-table--cell-clip-area'
}),
h('span', {
class: 'vxe-table--cell-extend-area'
}),
h('span', {
class: 'vxe-table--cell-multi-area'
}),
h('span', {
class: 'vxe-table--cell-active-area'
}),
h('span', {
class: 'vxe-table--cell-row-status-area'
})
])
: renderEmptyElement$9($xeTable),
!fixedType
? h('div', {
class: 'vxe-table--empty-block',
ref: refBodyEmptyBlock
}, [
h('div', {
class: 'vxe-table--empty-content'
}, emptyContent)
])
: renderEmptyElement$9($xeTable)
])
]);
};
return renderVN;
}
});
const { renderer: renderer$8, renderEmptyElement: renderEmptyElement$8 } = VxeUI;
const sourceType$3 = 'table';
const renderType$1 = 'header';
var TableHeaderComponent = defineVxeComponent({
name: 'VxeTableHeader',
props: {
tableData: Array,
tableColumn: Array,
tableGroupColumn: Array,
fixedColumn: Array,
fixedType: {
type: String,
default: null
}
},
setup(props) {
const $xeTable = inject('$xeTable', {});
const { xID, props: tableProps, reactData: tableReactData, internalData: tableInternalData } = $xeTable;
const { computeColumnOpts, computeColumnDragOpts, computeCellOpts, computeMouseOpts, computeHeaderCellOpts, computeDefaultRowHeight, computeVirtualXOpts, computeFloatingFilterOpts, computeIsHeaderRenderOptimize, computeHeaderTooltipOpts } = $xeTable.getComputeMaps();
const headerColumn = ref([]);
const refElem = ref();
const refHeaderScroll = ref();
const refHeaderTable = ref();
const refHeaderColgroup = ref();
const refHeaderTHead = ref();
const refHeaderXSpace = ref();
const refHeaderBorderRepair = ref();
const uploadColumn = () => {
const { showCustomHeader } = tableProps;
const { collectColumn, visibleColumn } = tableInternalData;
const { tableGroupColumn } = props;
const { isGroup } = tableReactData;
let spanColumns = isGroup ? convertHeaderColumnToRows(tableGroupColumn) : [];
let visibleColgroups = [];
if (showCustomHeader && spanColumns.length > 1) {
visibleColgroups = convertHeaderToGridRows(spanColumns);
spanColumns = visibleColgroups;
}
headerColumn.value = spanColumns;
nextTick(() => {
$xeTable.dispatchEvent('columns-change', { visibleColgroups, collectColumn, visibleColumn }, null);
});
};
const renderRows = (isGroup, isOptimizeMode, headerGroups, _rowIndex, cols) => {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const { fixedType } = props;
const { resizable: allResizable, columnKey, showCustomHeader, headerCellClassName, headerCellStyle, showHeaderOverflow: allColumnHeaderOverflow, headerAlign: allHeaderAlign, align: allAlign, mouseConfig } = tableProps;
const { currentColumn, dragCol, scrollXLoad, scrollYLoad, overflowX, mergeHeadFlag, tableColumn } = tableReactData;
const { fullColumnIdData, scrollXStore, mergeHeaderList, mergeHeaderCellMaps } = tableInternalData;
const virtualXOpts = computeVirtualXOpts.value;
const columnOpts = computeColumnOpts.value;
const columnDragOpts = computeColumnDragOpts.value;
const headerTooltipOpts = computeHeaderTooltipOpts.value;
const cellOpts = computeCellOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const headerCellOpts = computeHeaderCellOpts.value;
const currCellHeight = getCalcHeight(headerCellOpts.height) || defaultRowHeight;
const { disabledMethod: dragDisabledMethod, isCrossDrag, isPeerDrag } = columnDragOpts;
const isLastRow = _rowIndex === headerGroups.length - 1;
return cols.map((column, $columnIndex) => {
const { type, showHeaderOverflow, headerAlign, align, filters, headerClassName, editRender, cellRender } = column;
const colid = column.id;
const colRest = fullColumnIdData[colid] || {};
const renderOpts = editRender || cellRender;
const compConf = renderOpts ? renderer$8.get(renderOpts.name) : null;
const isColGroup = column.children && column.children.length;
const fixedHiddenColumn = overflowX && !isColGroup && (fixedType ? column.fixed !== fixedType : !!column.fixed);
const cellPadding = getDefaultConfig(headerCellOpts.padding, cellOpts.padding);
const isAllCellPadding = cellPadding === true;
const isCellPaddingTop = cellPadding ? (isAllCellPadding || cellPadding.top !== false) : false;
const isCellPaddingBottom = cellPadding ? (isAllCellPadding || cellPadding.bottom !== false) : false;
const isCellPaddingLeft = cellPadding ? (isAllCellPadding || cellPadding.left !== false) : false;
const isCellPaddingRight = cellPadding ? (isAllCellPadding || cellPadding.right !== false) : false;
const headOverflow = getDefaultConfig(showHeaderOverflow, allColumnHeaderOverflow);
const headAlign = headerAlign || (compConf ? compConf.tableHeaderCellAlign : '') || allHeaderAlign || align || (compConf ? compConf.tableCellAlign : '') || allAlign;
const showEllipsis = (headOverflow === true ? headerTooltipOpts.mode : headOverflow) === 'ellipsis';
const showTitle = (headOverflow === true ? headerTooltipOpts.mode : headOverflow) === 'title';
const showTooltip = (headOverflow === true ? headerTooltipOpts.mode : headOverflow) === 'tooltip';
const hasEllipsis = showTitle || showTooltip || showEllipsis;
let hasFilter = false;
let firstFilterOption = null;
if (filters) {
firstFilterOption = filters[0];
hasFilter = filters.some((item) => item.checked);
}
const columnIndex = colRest.index;
const _columnIndex = colRest._index;
const cellParams = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt,
rowIndex: _rowIndex,
_rowIndex,
$rowIndex: _rowIndex,
column,
columnIndex,
$columnIndex,
_columnIndex,
firstFilterOption: firstFilterOption,
fixed: fixedType,
source: sourceType$3,
type: renderType$1,
isHidden: fixedHiddenColumn,
hasFilter
};
const thAttrs = {
colid
};
let isMergeCell = false;
// 合并行或列
if (!showCustomHeader) {
thAttrs.colspan = column.colSpan > 1 ? column.colSpan : null;
thAttrs.rowspan = column.rowSpan > 1 ? column.rowSpan : null;
}
if (mergeHeadFlag && mergeHeaderList.length && (showCustomHeader || isLastRow)) {
const spanRest = mergeHeaderCellMaps[`${_rowIndex}:${showCustomHeader ? $columnIndex : _columnIndex}`];
if (spanRest) {
const { rowspan, colspan } = spanRest;
if (!rowspan || !colspan) {
return null;
}
if (rowspan > 1) {
isMergeCell = true;
thAttrs.rowspan = rowspan;
}
if (colspan > 1) {
isMergeCell = true;
thAttrs.colspan = colspan;
}
}
}
const thOns = {
onClick: (evnt) => $xeTable.triggerHeaderCellClickEvent(evnt, cellParams),
onDblclick: (evnt) => $xeTable.triggerHeaderCellDblclickEvent(evnt, cellParams)
};
const isColDragCell = columnOpts.drag && columnDragOpts.trigger === 'cell';
let isDisabledDrag = false;
if (isColDragCell) {
isDisabledDrag = !!(dragDisabledMethod && dragDisabledMethod(cellParams));
}
// 按下事件处理
if (mouseConfig || isColDragCell) {
thOns.onMousedown = (evnt) => $xeTable.triggerHeaderCellMousedownEvent(evnt, cellParams);
}
// 拖拽列事件
if (columnOpts.drag) {
thOns.onDragstart = $xeTable.handleHeaderCellDragDragstartEvent;
thOns.onDragend = $xeTable.handleHeaderCellDragDragendEvent;
thOns.onDragover = $xeTable.handleHeaderCellDragDragoverEvent;
if (isColDragCell) {
thOns.onMouseup = $xeTable.handleHeaderCellDragMouseupEvent;
}
}
const isLastColumn = $columnIndex === cols.length - 1;
const showResizable = (XEUtils.isBoolean(column.resizable) ? column.resizable : (columnOpts.resizable || allResizable));
const isAutoCellWidth = !column.resizeWidth && (column.minWidth === 'auto' || column.width === 'auto');
let isVNPreEmptyStatus = false;
if (isOptimizeMode && overflowX && !isGroup && !isMergeCell) {
if (!dragCol || dragCol.id !== colid) {
if (scrollXLoad && tableColumn.length > 10 && !column.fixed && !virtualXOpts.immediate && (_columnIndex < scrollXStore.visibleStartIndex - scrollXStore.preloadSize || _columnIndex > scrollXStore.visibleEndIndex + scrollXStore.preloadSize)) {
isVNPreEmptyStatus = true;
}
}
}
const tcStyle = {};
if (hasEllipsis) {
tcStyle.height = `${currCellHeight}px`;
}
else {
tcStyle.minHeight = `${currCellHeight}px`;
}
if (showCustomHeader) ;
else if (isColGroup && !isLastRow) {
let childWidth = 0;
XEUtils.eachTree(column.children, (childRow) => {
if (childRow.visible && (!childRow.children || !childRow.children.length)) {
childWidth += childRow.renderWidth;
}
});
tcStyle.width = `${childWidth}px`;
}
return h('th', Object.assign(Object.assign(Object.assign({ class: ['vxe-table--column vxe-header--column', colid, fixedHiddenColumn ? 'fixed--hidden' : 'fixed--visible', {
[`col--${headAlign}`]: headAlign,
[`col--${type}`]: type,
'col--last': isLastColumn,
'col--fixed': column.fixed,
'col--group': isColGroup,
'col--ellipsis': hasEllipsis,
'fixed--width': !isAutoCellWidth,
'is--pg-top': isCellPaddingTop,
'is--pg-bottom': isCellPaddingBottom,
'is--pg-left': isCellPaddingLeft,
'is--pg-right': isCellPaddingRight,
'is--sortable': column.sortable,
'col--filter': !!filters,
'is--filter-active': hasFilter,
'is--drag-active': columnOpts.drag && !column.fixed && !isDisabledDrag && (isCrossDrag || isPeerDrag || !column.parentId),
'is--drag-disabled': columnOpts.drag && isDisabledDrag,
'col--current': currentColumn === column
},
headerClassName ? (XEUtils.isFunction(headerClassName) ? headerClassName(cellParams) : headerClassName) : '',
headerCellClassName ? (XEUtils.isFunction(headerCellClassName) ? headerCellClassName(cellParams) : headerCellClassName) : ''
], style: headerCellStyle ? (XEUtils.isFunction(headerCellStyle) ? headerCellStyle(cellParams) : headerCellStyle) : null }, thAttrs), thOns), { key: showCustomHeader ? `${colid}${$columnIndex}` : (columnKey || scrollXLoad || scrollYLoad || columnOpts.useKey || columnOpts.drag || isColGroup ? colid : $columnIndex) }), [
h('div', {
class: ['vxe-cell', {
'c--title': showTitle,
'c--tooltip': showTooltip,
'c--ellipsis': showEllipsis
}],
style: tcStyle
}, isVNPreEmptyStatus || (isOptimizeMode && fixedHiddenColumn)
? []
: [
h('div', {
colid,
class: 'vxe-cell--wrapper vxe-header-cell--wrapper'
}, column.renderHeader(cellParams))
]),
/**
* 列宽拖动
*/
!fixedHiddenColumn && showResizable && (!showCustomHeader || isLastRow)
? h('div', {
class: 'vxe-cell--col-resizable',
onMousedown: (evnt) => $xeTable.handleColResizeMousedownEvent(evnt, fixedType, cellParams),
onDblclick: (evnt) => $xeTable.handleColResizeDblclickEvent(evnt, cellParams)
})
: renderEmptyElement$8($xeTable)
]);
});
};
const renderFilterRows = (isOptimizeMode, cols) => {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const { fixedType } = props;
const { showHeaderOverflow: allColumnHeaderOverflow, headerAlign: allHeaderAlign, align: allAlign } = tableProps;
const { currentColumn, overflowX } = tableReactData;
const { fullColumnIdData } = tableInternalData;
const headerTooltipOpts = computeHeaderTooltipOpts.value;
const cellOpts = computeCellOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const headerCellOpts = computeHeaderCellOpts.value;
const floatingFilterOpts = computeFloatingFilterOpts.value;
const { cellClassName } = floatingFilterOpts;
const currCellHeight = getCalcHeight(headerCellOpts.height) || defaultRowHeight;
return cols.map((column, $columnIndex) => {
const { type, showHeaderOverflow, headerAlign, align, filters, editRender, cellRender, floatingFilters, filterRender, slots } = column;
const colid = column.id;
const colRest = fullColumnIdData[colid] || {};
const renderOpts = editRender || cellRender;
const flSlot = slots ? (slots.floatingFilter || slots['floating-filter']) : null;
const compConf = renderOpts ? renderer$8.get(renderOpts.name) : null;
const flCompConf = isEnableConf(filterRender) ? renderer$8.get(filterRender.name) : null;
const rtFloatingFilter = flCompConf ? flCompConf.renderTableFloatingFilter : null;
const fixedHiddenColumn = overflowX && (fixedType ? column.fixed !== fixedType : !!column.fixed);
const isPadding = XEUtils.isBoolean(headerCellOpts.padding) ? headerCellOpts.padding : cellOpts.padding;
const headOverflow = XEUtils.eqNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow;
const headAlign = headerAlign || (compConf ? compConf.tableHeaderCellAlign : '') || allHeaderAlign || align || (compConf ? compConf.tableCellAlign : '') || allAlign;
const showEllipsis = headOverflow === 'ellipsis';
const showTitle = headOverflow === 'title';
const showTooltip = headOverflow === true ? headerTooltipOpts.mode === 'tooltip' : headOverflow === 'tooltip';
const hasEllipsis = showTitle || showTooltip || showEllipsis;
let hasFilter = false;
let firstFilterOption = null;
if (filters) {
firstFilterOption = filters[0];
hasFilter = filters.some((item) => item.checked);
}
const columnIndex = colRest.index;
const _columnIndex = colRest._index;
const cellParams = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt,
column,
columnIndex,
$columnIndex,
_columnIndex,
option: firstFilterOption,
fixed: fixedType,
source: sourceType$3,
type: renderType$1,
isHidden: fixedHiddenColumn,
hasFilter
};
const thAttrs = {
colid
};
const isLastColumn = $columnIndex === cols.length - 1;
const isAutoCellWidth = !column.resizeWidth && (column.minWidth === 'auto' || column.width === 'auto');
const tcStyle = {};
if (hasEllipsis) {
tcStyle.height = `${currCellHeight}px`;
}
else {
tcStyle.minHeight = `${currCellHeight}px`;
}
return h('th', Object.assign({ class: ['vxe-table--column vxe-header--column is--floating-filters', colid, fixedHiddenColumn ? 'fixed--hidden' : 'fixed--visible', {
[`col--${headAlign}`]: headAlign,
[`col--${type}`]: type,
'col--last': isLastColumn,
'col--fixed': column.fixed,
'col--ellipsis': hasEllipsis,
'fixed--width': !isAutoCellWidth,
'is--padding': isPadding,
'is--sortable': column.sortable,
'col--current': currentColumn === column
}
], key: colid }, thAttrs), [
h('div', {
class: ['vxe-cell', '' + (cellClassName || ''), {
'c--title': showTitle,
'c--tooltip': showTooltip,
'c--ellipsis': showEllipsis
}],
style: tcStyle
}, isOptimizeMode && fixedHiddenColumn && !floatingFilters
? []
: [
h('div', {
colid,
class: 'vxe-cell--wrapper vxe-header-cell--wrapper'
}, flSlot
? $xeTable.callSlot(flSlot, cellParams)
: (rtFloatingFilter && firstFilterOption
? getSlotVNs(rtFloatingFilter(filterRender, cellParams))
: []))
])
]);
});
};
const renderHeads = (isGroup, isOptimizeMode, headerGroups, renderColumnList) => {
const { fixedType } = props;
const { headerRowClassName, headerRowStyle } = tableProps;
const floatingFilterOpts = computeFloatingFilterOpts.value;
const rowVNs = headerGroups.map((cols, _rowIndex) => {
const params = { $table: $xeTable, rowIndex: _rowIndex, _rowIndex, $rowIndex: _rowIndex, fixed: fixedType, type: renderType$1 };
return h('tr', {
key: _rowIndex,
class: [
'vxe-header--row',
headerRowClassName ? (XEUtils.isFunction(headerRowClassName) ? headerRowClassName(params) : headerRowClassName) : ''
],
style: headerRowStyle ? (XEUtils.isFunction(headerRowStyle) ? headerRowStyle(params) : headerRowStyle) : null
}, renderRows(isGroup, isOptimizeMode, headerGroups, _rowIndex, cols));
});
if (floatingFilterOpts.enabled) {
rowVNs.push(h('tr', {
key: 'ff',
class: [
'vxe-header--row is--floating-filters',
'' + (floatingFilterOpts.rowClassName || '')
]
}, renderFilterRows(isOptimizeMode, renderColumnList)));
}
return rowVNs;
};
const renderVN = () => {
const { fixedType, fixedColumn, tableColumn } = props;
const { mouseConfig } = tableProps;
const { isGroup, isColLoading, overflowX, scrollXLoad, dragCol } = tableReactData;
const { visibleColumn, fullColumnIdData } = tableInternalData;
const mouseOpts = computeMouseOpts.value;
const isHeaderRenderOptimize = computeIsHeaderRenderOptimize.value;
let renderHeaderList = headerColumn.value || [];
let renderColumnList = tableColumn;
const isOptimizeMode = isHeaderRenderOptimize;
if (isGroup) {
renderColumnList = visibleColumn;
}
else {
if (!isOptimizeMode || (!isColLoading && (fixedType || !overflowX))) {
renderColumnList = visibleColumn;
}
if (fixedType) {
// 如果是使用优化模式
if (isOptimizeMode) {
renderColumnList = fixedColumn || [];
}
}
renderHeaderList = [renderColumnList];
}
if (!fixedType && !isGroup) {
// 列拖拽
if (scrollXLoad && dragCol) {
if (renderColumnList.length > 2) {
const dCowRest = fullColumnIdData[dragCol.id];
if (dCowRest) {
const dcIndex = dCowRest._index;
const firstCol = renderColumnList[0];
const lastCol = renderColumnList[renderColumnList.length - 1];
const firstColRest = fullColumnIdData[firstCol.id];
const lastColRest = fullColumnIdData[lastCol.id];
if (firstColRest && lastColRest) {
const fcIndex = firstColRest._index;
const lcIndex = lastColRest._index;
if (dcIndex < fcIndex) {
renderColumnList = [dragCol].concat(renderColumnList);
renderHeaderList = [[dragCol].concat(renderHeaderList[0])].concat(renderHeaderList.slice(1));
}
else if (dcIndex > lcIndex) {
renderColumnList = renderColumnList.concat([dragCol]);
renderHeaderList = [renderHeaderList[0].concat([dragCol])].concat(renderHeaderList.slice(1));
}
}
}
}
}
}
return h('div', {
ref: refElem,
class: ['vxe-table--header-wrapper', fixedType ? `fixed-${fixedType}--wrapper` : 'body--wrapper'],
xid: xID
}, [
h('div', {
ref: refHeaderScroll,
class: 'vxe-table--header-inner-wrapper',
onScroll(evnt) {
$xeTable.triggerHeaderScrollEvent(evnt, fixedType);
}
}, [
fixedType
? renderEmptyElement$8($xeTable)
: h('div', {
ref: refHeaderXSpace,
class: 'vxe-body--x-space'
}),
h('table', {
ref: refHeaderTable,
class: 'vxe-table--header',
xid: xID,
cellspacing: 0,
cellpadding: 0,
border: 0,
xvm: isOptimizeMode ? '1' : null
}, [
/**
* 列宽
*/
h('colgroup', {
ref: refHeaderColgroup
}, renderColumnList.map((column, $columnIndex) => {
return h('col', {
name: column.id,
key: $columnIndex,
style: {
width: `${column.renderWidth}px`
}
});
})),
/**
* 头部
*/
h('thead', {
ref: refHeaderTHead
}, renderHeads(isGroup, isOptimizeMode, renderHeaderList, renderColumnList))
]),
mouseConfig && mouseOpts.area
? h('div', {
class: 'vxe-table--cell-area',
xid: xID
}, [
h('span', {
class: 'vxe-table--cell-main-area'
}),
h('span', {
class: 'vxe-table--cell-clip-area'
}),
h('span', {
class: 'vxe-table--cell-extend-area'
}),
h('span', {
class: 'vxe-table--cell-multi-area'
}),
h('span', {
class: 'vxe-table--cell-active-area'
}),
h('span', {
class: 'vxe-table--cell-col-status-area'
})
])
: renderEmptyElement$8($xeTable)
])
]);
};
watch(() => props.tableColumn, uploadColumn);
onMounted(() => {
nextTick(() => {
const { fixedType } = props;
const { internalData } = $xeTable;
const { elemStore } = internalData;
const prefix = `${fixedType || 'main'}-header-`;
elemStore[`${prefix}wrapper`] = refElem;
elemStore[`${prefix}scroll`] = refHeaderScroll;
elemStore[`${prefix}table`] = refHeaderTable;
elemStore[`${prefix}colgroup`] = refHeaderColgroup;
elemStore[`${prefix}list`] = refHeaderTHead;
elemStore[`${prefix}xSpace`] = refHeaderXSpace;
elemStore[`${prefix}repair`] = refHeaderBorderRepair;
uploadColumn();
});
});
onUnmounted(() => {
const { fixedType } = props;
const { internalData } = $xeTable;
const { elemStore } = internalData;
const prefix = `${fixedType || 'main'}-header-`;
elemStore[`${prefix}wrapper`] = null;
elemStore[`${prefix}scroll`] = null;
elemStore[`${prefix}table`] = null;
elemStore[`${prefix}colgroup`] = null;
elemStore[`${prefix}list`] = null;
elemStore[`${prefix}xSpace`] = null;
elemStore[`${prefix}repair`] = null;
});
return renderVN;
}
});
const { renderer: renderer$7, renderEmptyElement: renderEmptyElement$7 } = VxeUI;
const sourceType$2 = 'table';
const renderType = 'footer';
var TableFooterComponent = defineVxeComponent({
name: 'VxeTableFooter',
props: {
footerTableData: {
type: Array,
default: () => []
},
tableColumn: {
type: Array,
default: () => []
},
fixedColumn: {
type: Array,
default: () => []
},
fixedType: {
type: String,
default: null
}
},
setup(props) {
const $xeTable = inject('$xeTable', {});
const { xID, props: tableProps, reactData: tableReactData, internalData: tableInternalData } = $xeTable;
const { computeFooterTooltipOpts, computeColumnOpts, computeCellOpts, computeFooterCellOpts, computeDefaultRowHeight, computeResizableOpts, computeVirtualXOpts, computeIsFooterRenderOptimize } = $xeTable.getComputeMaps();
const refElem = ref();
const refFooterScroll = ref();
const refFooterTable = ref();
const refFooterColgroup = ref();
const refFooterTFoot = ref();
const refFooterXSpace = ref();
const renderRows = (isOptimizeMode, tableColumn, footerTableData, row, $rowIndex, _rowIndex) => {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const { fixedType } = props;
const { resizable: allResizable, border, footerCellClassName, footerCellStyle, footerAlign: allFooterAlign, footerSpanMethod, align: allAlign, columnKey, showFooterOverflow: allColumnFooterOverflow } = tableProps;
const { scrollXLoad, scrollYLoad, overflowX, currentColumn, mergeFootFlag } = tableReactData;
const { fullColumnIdData, mergeFooterList, mergeFooterCellMaps, scrollXStore } = tableInternalData;
const virtualXOpts = computeVirtualXOpts.value;
const footerTooltipOpts = computeFooterTooltipOpts.value;
const resizableOpts = computeResizableOpts.value;
const { isAllColumnDrag } = resizableOpts;
const columnOpts = computeColumnOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const cellOpts = computeCellOpts.value;
const footerCellOpts = computeFooterCellOpts.value;
const currCellHeight = getCalcHeight(footerCellOpts.height) || defaultRowHeight;
return tableColumn.map((column, $columnIndex) => {
const { type, showFooterOverflow, footerAlign, align, footerClassName, editRender, cellRender } = column;
const colid = column.id;
const colRest = fullColumnIdData[colid] || {};
const renderOpts = editRender || cellRender;
const compConf = renderOpts ? renderer$7.get(renderOpts.name) : null;
const showAllTip = footerTooltipOpts.showAll;
const fixedHiddenColumn = overflowX && (fixedType ? column.fixed !== fixedType : !!column.fixed);
const cellPadding = getDefaultConfig(footerCellOpts.padding, cellOpts.padding);
const isAllCellPadding = cellPadding === true;
const isCellPaddingTop = cellPadding ? (isAllCellPadding || cellPadding.top !== false) : false;
const isCellPaddingBottom = cellPadding ? (isAllCellPadding || cellPadding.bottom !== false) : false;
const isCellPaddingLeft = cellPadding ? (isAllCellPadding || cellPadding.left !== false) : false;
const isCellPaddingRight = cellPadding ? (isAllCellPadding || cellPadding.right !== false) : false;
const footOverflow = getDefaultConfig(showFooterOverflow, allColumnFooterOverflow);
const footAlign = footerAlign || (compConf ? compConf.tableFooterCellAlign : '') || allFooterAlign || align || (compConf ? compConf.tableCellAlign : '') || allAlign;
const showEllipsis = (footOverflow === true ? footerTooltipOpts.mode : footOverflow) === 'ellipsis';
const showTitle = (footOverflow === true ? footerTooltipOpts.mode : footOverflow) === 'title';
const showTooltip = (footOverflow === true ? footerTooltipOpts.mode : footOverflow) === 'tooltip';
const hasEllipsis = showTitle || showTooltip || showEllipsis;
const showResizable = (XEUtils.isBoolean(column.resizable) ? column.resizable : (columnOpts.resizable || allResizable));
const attrs = { colid };
const tfOns = {};
const columnIndex = colRest.index;
const _columnIndex = colRest._index;
const itemIndex = _columnIndex;
const cellParams = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt,
row,
rowIndex: _rowIndex,
_rowIndex,
$rowIndex,
column,
columnIndex,
$columnIndex,
_columnIndex,
itemIndex,
items: row,
fixed: fixedType,
source: sourceType$2,
type: renderType,
data: footerTableData
};
if (showTitle || showTooltip || showAllTip) {
tfOns.onMouseenter = (evnt) => {
if (showTitle) {
updateCellTitle(evnt.currentTarget, column);
}
else if (showTooltip || showAllTip) {
$xeTable.triggerFooterTooltipEvent(evnt, cellParams);
}
};
}
if (showTooltip || showAllTip) {
tfOns.onMouseleave = (evnt) => {
if (showTooltip || showAllTip) {
$xeTable.handleTargetLeaveEvent(evnt);
}
};
}
tfOns.onClick = (evnt) => {
$xeTable.triggerFooterCellClickEvent(evnt, cellParams);
};
tfOns.onDblclick = (evnt) => {
$xeTable.triggerFooterCellDblclickEvent(evnt, cellParams);
};
let isMergeCell = false;
// 合并行或列
if (mergeFootFlag && mergeFooterList.length) {
const spanRest = mergeFooterCellMaps[`${_rowIndex}:${_columnIndex}`];
if (spanRest) {
const { rowspan, colspan } = spanRest;
if (!rowspan || !colspan) {
return null;
}
if (rowspan > 1) {
isMergeCell = true;
attrs.rowspan = rowspan;
}
if (colspan > 1) {
isMergeCell = true;
attrs.colspan = colspan;
}
}
}
else if (footerSpanMethod) {
// 自定义合并方法
const { rowspan = 1, colspan = 1 } = footerSpanMethod(cellParams) || {};
if (!rowspan || !colspan) {
return null;
}
if (rowspan > 1) {
attrs.rowspan = rowspan;
}
if (colspan > 1) {
attrs.colspan = colspan;
}
}
const isLastColumn = $columnIndex === tableColumn.length - 1;
const isAutoCellWidth = !column.resizeWidth && (column.minWidth === 'auto' || column.width === 'auto');
let isVNPreEmptyStatus = false;
if (isOptimizeMode && overflowX && !isMergeCell) {
if (scrollXLoad && tableColumn.length > 10 && !column.fixed && !virtualXOpts.immediate && (_columnIndex < scrollXStore.visibleStartIndex - scrollXStore.preloadSize || _columnIndex > scrollXStore.visibleEndIndex + scrollXStore.preloadSize)) {
isVNPreEmptyStatus = true;
}
}
const tcStyle = {};
if (hasEllipsis) {
tcStyle.height = `${currCellHeight}px`;
}
else {
tcStyle.minHeight = `${currCellHeight}px`;
}
return h('td', Object.assign(Object.assign(Object.assign(Object.assign({ class: ['vxe-table--column vxe-footer--column', column.id, {
[`col--${footAlign}`]: footAlign,
[`col--${type}`]: type,
'col--last': isLastColumn,
'fixed--width': !isAutoCellWidth,
'fixed--hidden': fixedHiddenColumn,
'is--pg-top': isCellPaddingTop,
'is--pg-bottom': isCellPaddingBottom,
'is--pg-left': isCellPaddingLeft,
'is--pg-right': isCellPaddingRight,
'col--ellipsis': hasEllipsis,
'col--current': currentColumn === column
}, getPropClass(footerClassName, cellParams), getPropClass(footerCellClassName, cellParams)] }, attrs), { style: footerCellStyle ? (XEUtils.isFunction(footerCellStyle) ? footerCellStyle(cellParams) : footerCellStyle) : null }), tfOns), { key: columnKey || scrollXLoad || scrollYLoad || columnOpts.useKey || columnOpts.drag ? column.id : $columnIndex }), [
h('div', {
class: ['vxe-cell', {
'c--title': showTitle,
'c--tooltip': showTooltip,
'c--ellipsis': showEllipsis
}],
style: tcStyle
}, isVNPreEmptyStatus
? []
: [
h('div', {
colid,
class: 'vxe-cell--wrapper vxe-footer-cell--wrapper'
}, column.renderFooter(cellParams))
]),
/**
* 列宽拖动
*/
!fixedHiddenColumn && showResizable && isAllColumnDrag
? h('div', {
class: ['vxe-cell--col-resizable', {
'is--line': !border || border === 'none'
}],
onMousedown: (evnt) => $xeTable.handleColResizeMousedownEvent(evnt, fixedType, cellParams),
onDblclick: (evnt) => $xeTable.handleColResizeDblclickEvent(evnt, cellParams)
})
: renderEmptyElement$7($xeTable)
]);
});
};
const renderHeads = (isOptimizeMode, renderColumnList) => {
const { fixedType, footerTableData } = props;
const { footerRowClassName, footerRowStyle } = tableProps;
return footerTableData.map((row, _rowIndex) => {
const $rowIndex = _rowIndex;
const rowParams = { $table: $xeTable, row, rowIndex: _rowIndex, _rowIndex, $rowIndex, fixed: fixedType, type: renderType };
return h('tr', {
key: _rowIndex,
class: [
'vxe-footer--row',
footerRowClassName ? XEUtils.isFunction(footerRowClassName) ? footerRowClassName(rowParams) : footerRowClassName : ''
],
style: footerRowStyle ? (XEUtils.isFunction(footerRowStyle) ? footerRowStyle(rowParams) : footerRowStyle) : null
}, renderRows(isOptimizeMode, renderColumnList, footerTableData, row, _rowIndex, _rowIndex));
});
};
const renderVN = () => {
const { fixedType, fixedColumn, tableColumn } = props;
const { visibleColumn, fullColumnIdData } = tableInternalData;
const { isGroup, isColLoading, overflowX, scrollXLoad, dragCol } = tableReactData;
const isFooterRenderOptimize = computeIsFooterRenderOptimize.value;
let renderColumnList = tableColumn;
const isOptimizeMode = isFooterRenderOptimize;
if (!isOptimizeMode || (!isColLoading && (fixedType || !overflowX))) {
renderColumnList = visibleColumn;
}
if (fixedType) {
if (isOptimizeMode) {
renderColumnList = fixedColumn || [];
}
}
if (!fixedType && !isGroup) {
// 列拖拽
if (scrollXLoad && dragCol) {
if (renderColumnList.length > 2) {
const dCowRest = fullColumnIdData[dragCol.id];
if (dCowRest) {
const dcIndex = dCowRest._index;
const firstCol = renderColumnList[0];
const lastCol = renderColumnList[renderColumnList.length - 1];
const firstColRest = fullColumnIdData[firstCol.id];
const lastColRest = fullColumnIdData[lastCol.id];
if (firstColRest && lastColRest) {
const fcIndex = firstColRest._index;
const lcIndex = lastColRest._index;
if (dcIndex < fcIndex) {
renderColumnList = [dragCol].concat(renderColumnList);
}
else if (dcIndex > lcIndex) {
renderColumnList = renderColumnList.concat([dragCol]);
}
}
}
}
}
}
return h('div', {
ref: refElem,
class: ['vxe-table--footer-wrapper', fixedType ? `fixed-${fixedType}--wrapper` : 'body--wrapper'],
xid: xID
}, [
h('div', {
ref: refFooterScroll,
class: 'vxe-table--footer-inner-wrapper',
onScroll(evnt) {
$xeTable.triggerFooterScrollEvent(evnt, fixedType);
}
}, [
fixedType
? renderEmptyElement$7($xeTable)
: h('div', {
ref: refFooterXSpace,
class: 'vxe-body--x-space'
}),
h('table', {
ref: refFooterTable,
class: 'vxe-table--footer',
xid: xID,
cellspacing: 0,
cellpadding: 0,
border: 0,
xvm: isOptimizeMode ? '1' : null
}, [
/**
* 列宽
*/
h('colgroup', {
ref: refFooterColgroup
}, renderColumnList.map((column, $columnIndex) => {
return h('col', {
name: column.id,
key: $columnIndex,
style: {
width: `${column.renderWidth}px`
}
});
})),
/**
* 底部
*/
h('tfoot', {
ref: refFooterTFoot
}, renderHeads(isOptimizeMode, renderColumnList))
])
])
]);
};
onMounted(() => {
nextTick(() => {
const { fixedType } = props;
const { elemStore } = tableInternalData;
const prefix = `${fixedType || 'main'}-footer-`;
elemStore[`${prefix}wrapper`] = refElem;
elemStore[`${prefix}scroll`] = refFooterScroll;
elemStore[`${prefix}table`] = refFooterTable;
elemStore[`${prefix}colgroup`] = refFooterColgroup;
elemStore[`${prefix}list`] = refFooterTFoot;
elemStore[`${prefix}xSpace`] = refFooterXSpace;
});
});
onUnmounted(() => {
const { fixedType } = props;
const { elemStore } = tableInternalData;
const prefix = `${fixedType || 'main'}-footer-`;
elemStore[`${prefix}wrapper`] = null;
elemStore[`${prefix}scroll`] = null;
elemStore[`${prefix}table`] = null;
elemStore[`${prefix}colgroup`] = null;
elemStore[`${prefix}list`] = null;
elemStore[`${prefix}xSpace`] = null;
});
return renderVN;
}
});
const { errLog: errLog$9 } = createComponentLog('table');
const { getI18n: getI18n$a, getIcon: getIcon$6, renderEmptyElement: renderEmptyElement$6 } = VxeUI;
function createInternalData$2() {
return {
// teleportTo: undefined,
// prevDragCol: undefined,
// prevDragGroupField: undefined,
// prevDragAggFnColid: undefined,
// prevDragToChild: false,
// prevDragPos: null,
// customDragTime: null
};
}
var TableCustomPanelComponent = defineVxeComponent({
name: 'TableCustomPanel',
props: {
customStore: {
type: Object,
default: () => ({})
}
},
setup(props, context) {
const xID = XEUtils.uniqueId();
const VxeUIModalComponent = VxeUI.getComponent('VxeModal');
const VxeUIDrawerComponent = VxeUI.getComponent('VxeDrawer');
const VxeUIButtonComponent = VxeUI.getComponent('VxeButton');
const VxeUINumberInputComponent = VxeUI.getComponent('VxeNumberInput');
const VxeUIRadioGroupComponent = VxeUI.getComponent('VxeRadioGroup');
const $xeTable = inject('$xeTable', {});
const { props: tableProps, reactData: tableReactData, internalData: tableInternalData } = $xeTable;
const { computeSize, computeCustomOpts, computeColumnDragOpts, computeColumnOpts, computeIsMaxFixedColumn, computeResizableOpts, computeAggregateOpts } = $xeTable.getComputeMaps();
const refElem = ref();
const refBodyWrapperElem = ref();
const refCustomBodyElem = ref();
const refDragLineElem = ref();
const refDragTipElem = ref();
const customPanelReactData = reactive({
dragCol: null,
dragGroupField: null,
dragAggFnCol: null,
dragTipText: ''
});
let customPanelInternalData = createInternalData$2();
const refMaps = {
refElem,
refBodyWrapperElem,
refCustomBodyElem,
refDragLineElem,
refDragTipElem
};
const computeMaps = {};
const handleWrapperMouseenterEvent = (evnt) => {
const { customStore } = props;
customStore.activeWrapper = true;
$xeTable.customOpenEvent(evnt);
};
const handleWrapperMouseleaveEvent = (evnt) => {
const { customStore } = props;
customStore.activeWrapper = false;
setTimeout(() => {
if (!customStore.activeBtn && !customStore.activeWrapper) {
$xeTable.customCloseEvent(evnt);
}
}, 300);
};
const confirmCustomEvent = ({ $event }) => {
tableReactData.isCustomStatus = true;
$xeTable.saveCustom();
$xeTable.closeCustom();
$xeTable.emitCustomEvent('confirm', $event);
$xeTable.dispatchEvent('custom-confirm', {}, $event);
$xeTable.emitCustomEvent('close', $event);
$xeTable.dispatchEvent('custom-close', {}, $event);
};
const cancelCloseEvent = ({ $event }) => {
$xeTable.closeCustom();
$xeTable.emitCustomEvent('close', $event);
$xeTable.dispatchEvent('custom-close', {}, $event);
};
const cancelCustomEvent = ({ $event }) => {
$xeTable.cancelCustom();
$xeTable.closeCustom();
$xeTable.emitCustomEvent('cancel', $event);
$xeTable.dispatchEvent('custom-cancel', {}, $event);
$xeTable.emitCustomEvent('close', $event);
$xeTable.dispatchEvent('custom-close', {}, $event);
};
const handleResetCustomEvent = (evnt) => {
$xeTable.resetCustom(true);
$xeTable.closeCustom();
$xeTable.emitCustomEvent('reset', evnt);
$xeTable.dispatchEvent('custom-reset', {}, evnt);
$xeTable.emitCustomEvent('close', evnt);
$xeTable.dispatchEvent('custom-close', {}, evnt);
};
const resetCustomEvent = ({ $event }) => {
if (VxeUI.modal) {
VxeUI.modal.confirm({
content: getI18n$a('vxe.custom.cstmConfirmRestore'),
className: 'vxe-table--ignore-clear',
escClosable: true
}).then(type => {
if (type === 'confirm') {
handleResetCustomEvent($event);
}
});
}
else {
handleResetCustomEvent($event);
}
};
const handleOptionCheck = (column) => {
const { customColumnList } = tableReactData;
const matchObj = XEUtils.findTree(customColumnList, item => item === column);
if (matchObj && matchObj.parent) {
const { parent: parentItem } = matchObj;
if (parentItem.children && parentItem.children.length) {
parentItem.renderVisible = parentItem.children.every((column) => column.renderVisible);
parentItem.halfVisible = !parentItem.renderVisible && parentItem.children.some((column) => column.renderVisible || column.halfVisible);
handleOptionCheck(parentItem);
}
}
};
const changeCheckboxOption = (column, evnt) => {
const isChecked = !column.renderVisible;
const customOpts = computeCustomOpts.value;
if (customOpts.immediate) {
XEUtils.eachTree([column], (item) => {
item.visible = isChecked;
item.renderVisible = isChecked;
item.halfVisible = false;
});
tableReactData.isCustomStatus = true;
$xeTable.handleCustom();
$xeTable.saveCustomStore('update:visible');
}
else {
XEUtils.eachTree([column], (item) => {
item.renderVisible = isChecked;
item.halfVisible = false;
});
}
handleOptionCheck(column);
$xeTable.checkCustomStatus();
$xeTable.dispatchEvent('custom-visible-change', { column, checked: isChecked }, evnt);
};
const changeColumnWidth = (column) => {
const customOpts = computeCustomOpts.value;
if (customOpts.immediate) {
if (column.renderResizeWidth !== column.renderWidth) {
column.resizeWidth = column.renderResizeWidth;
column.renderWidth = column.renderResizeWidth;
tableReactData.isCustomStatus = true;
$xeTable.handleCustom();
$xeTable.saveCustomStore('update:width');
}
}
};
const changeFixedOption = (column, colFixed, evnt) => {
const isMaxFixedColumn = computeIsMaxFixedColumn.value;
const customOpts = computeCustomOpts.value;
let targetFixed = null;
if (customOpts.immediate) {
if (column.renderFixed === colFixed) {
targetFixed = '';
XEUtils.eachTree([column], col => {
col.fixed = '';
col.renderFixed = '';
});
}
else {
if (!isMaxFixedColumn || column.renderFixed) {
targetFixed = colFixed;
XEUtils.eachTree([column], col => {
col.fixed = colFixed;
col.renderFixed = colFixed;
});
}
}
tableReactData.isCustomStatus = true;
$xeTable.handleCustom();
$xeTable.saveCustomStore('update:fixed');
}
else {
if (column.renderFixed === colFixed) {
targetFixed = '';
XEUtils.eachTree([column], col => {
col.renderFixed = '';
});
}
else {
if (!isMaxFixedColumn || column.renderFixed) {
targetFixed = colFixed;
XEUtils.eachTree([column], col => {
col.renderFixed = colFixed;
});
}
}
}
if (targetFixed !== null) {
$xeTable.dispatchEvent('custom-fixed-change', { column, fixed: targetFixed }, evnt);
}
};
const changeAlignOption = (column, targetAlign, colProperty, renderProperty, eName, evnt) => {
const customOpts = computeCustomOpts.value;
if (customOpts.immediate) {
column[colProperty] = targetAlign;
column[renderProperty] = targetAlign;
tableReactData.isCustomStatus = true;
$xeTable.handleCustom();
$xeTable.saveCustomStore(`update:${colProperty}`);
}
else {
column[renderProperty] = targetAlign;
}
$xeTable.dispatchEvent(eName, { column, [colProperty]: targetAlign }, evnt);
};
const allOptionEvent = (evnt) => {
const { customStore } = tableReactData;
const isAll = !customStore.isAll;
$xeTable.toggleCustomAllCheckbox();
$xeTable.dispatchEvent('custom-visible-all', { checked: isAll }, evnt);
};
const showDropTip = (evnt, optEl, showLine, dragPos) => {
const bodyWrapperElem = refBodyWrapperElem.value;
if (!bodyWrapperElem) {
return;
}
const customBodyElem = refCustomBodyElem.value;
if (!customBodyElem) {
return;
}
const { prevDragToChild } = customPanelInternalData;
const bodyWrapperRect = bodyWrapperElem.getBoundingClientRect();
const customBodyRect = customBodyElem.getBoundingClientRect();
const dragLineEl = refDragLineElem.value;
if (optEl) {
if (dragLineEl) {
if (showLine) {
const optRect = optEl.getBoundingClientRect();
dragLineEl.style.display = 'block';
dragLineEl.style.left = `${Math.max(0, customBodyRect.x - bodyWrapperRect.x)}px`;
dragLineEl.style.top = `${Math.max(1, optRect.y + bodyWrapperElem.scrollTop - bodyWrapperRect.y)}px`;
dragLineEl.style.height = `${optRect.height}px`;
dragLineEl.style.width = `${optRect.width}px`;
dragLineEl.setAttribute('drag-pos', dragPos);
dragLineEl.setAttribute('drag-to-child', prevDragToChild ? 'y' : 'n');
}
else {
dragLineEl.style.display = '';
}
}
}
else {
if (dragLineEl) {
dragLineEl.style.display = 'node';
}
}
const dragTipEl = refDragTipElem.value;
if (dragTipEl) {
dragTipEl.style.display = 'block';
dragTipEl.style.top = `${Math.min(bodyWrapperElem.clientHeight + bodyWrapperElem.scrollTop - dragTipEl.clientHeight, evnt.clientY + bodyWrapperElem.scrollTop - bodyWrapperRect.y)}px`;
dragTipEl.style.left = `${Math.min(bodyWrapperElem.clientWidth + bodyWrapperElem.scrollLeft - dragTipEl.clientWidth, evnt.clientX + bodyWrapperElem.scrollLeft - bodyWrapperRect.x)}px`;
dragTipEl.setAttribute('drag-status', showLine ? (prevDragToChild ? 'sub' : 'normal') : 'disabled');
}
};
const updateColDropTipContent = () => {
const { dragCol } = customPanelReactData;
const columnDragOpts = computeColumnDragOpts.value;
const { tooltipMethod } = columnDragOpts;
let tipContent = '';
if (tooltipMethod) {
const dtParams = {
$table: $xeTable,
column: dragCol
};
tipContent = `${tooltipMethod(dtParams) || ''}`;
}
else {
tipContent = getI18n$a('vxe.custom.cstmDragTarget', [dragCol && dragCol.type !== 'html' ? dragCol.getTitle() : '']);
}
customPanelReactData.dragTipText = tipContent;
};
const hideDropTip = () => {
const dragTipEl = refDragTipElem.value;
const dragLineEl = refDragLineElem.value;
if (dragTipEl) {
dragTipEl.style.display = '';
}
if (dragLineEl) {
dragLineEl.style.display = '';
}
};
const sortMousedownEvent = (evnt) => {
const btnEl = evnt.currentTarget;
const cellEl = btnEl.parentElement;
const tdEl = cellEl.parentElement;
const trEl = tdEl.parentElement;
const colid = trEl.getAttribute('colid');
const column = $xeTable.getColumnById(colid);
trEl.draggable = true;
customPanelReactData.dragCol = column;
customPanelReactData.dragGroupField = null;
customPanelReactData.dragAggFnCol = null;
updateColDropTipContent();
addClass(trEl, 'active--drag-origin');
};
const sortMouseupEvent = (evnt) => {
const btnEl = evnt.currentTarget;
const cellEl = btnEl.parentElement;
const tdEl = cellEl.parentElement;
const trEl = tdEl.parentElement;
hideDropTip();
trEl.draggable = false;
customPanelReactData.dragCol = null;
customPanelReactData.dragGroupField = null;
customPanelReactData.dragAggFnCol = null;
removeClass(trEl, 'active--drag-origin');
};
const sortDragstartEvent = (evnt) => {
const { customDragTime } = customPanelInternalData;
if (evnt.dataTransfer) {
evnt.dataTransfer.setDragImage(getTpImg(), 0, 0);
}
if (customDragTime) {
clearTimeout(customDragTime);
}
tableReactData.isCustomDragStatus = true;
customPanelInternalData.prevDragGroupField = null;
customPanelInternalData.prevDragAggFnColid = null;
};
const sortDragendEvent = (evnt) => {
const { mouseConfig } = tableProps;
const { customColumnList } = tableReactData;
const { collectColumn } = tableInternalData;
const customOpts = computeCustomOpts.value;
const { immediate } = customOpts;
const trEl = evnt.currentTarget;
const columnDragOpts = computeColumnDragOpts.value;
const { isCrossDrag, isPeerDrag, isSelfToChildDrag, isToChildDrag, dragEndMethod } = columnDragOpts;
const { dragCol } = customPanelReactData;
const { prevDragCol, prevDragGroupField, prevDragAggFnColid, prevDragPos, prevDragToChild } = customPanelInternalData;
const dragOffsetIndex = prevDragPos === 'bottom' ? 1 : 0;
if (prevDragGroupField || prevDragAggFnColid) {
if ($xeTable.handlePivotTableAggregatePanelDragendEvent) {
$xeTable.handlePivotTableAggregatePanelDragendEvent(evnt);
}
}
else if (prevDragCol && dragCol) {
// 判断是否有拖动
if (prevDragCol !== dragCol) {
const dragColumn = dragCol;
const newColumn = prevDragCol;
Promise.resolve(dragEndMethod
? dragEndMethod({
oldColumn: dragColumn,
newColumn,
dragColumn,
dragPos: prevDragPos,
dragToChild: !!prevDragToChild,
offsetIndex: dragOffsetIndex
})
: true).then((status) => {
if (!status) {
return;
}
let oafIndex = -1;
let nafIndex = -1;
const oldAllMaps = {};
XEUtils.eachTree([dragColumn], column => {
oldAllMaps[column.id] = column;
});
let isSelfToChildStatus = false;
// 只有实时拖拽支持跨层级
if (immediate) {
if (dragColumn.parentId && newColumn.parentId) {
// 子到子
if (isPeerDrag && !isCrossDrag) {
if (dragColumn.parentId !== newColumn.parentId) {
// 非同级
return;
}
}
else {
if (!isCrossDrag) {
return;
}
if (oldAllMaps[newColumn.id]) {
isSelfToChildStatus = true;
if (!(isCrossDrag && isSelfToChildDrag)) {
if (VxeUI.modal) {
VxeUI.modal.message({
status: 'error',
content: getI18n$a('vxe.error.treeDragChild')
});
}
return;
}
}
}
}
else if (dragColumn.parentId) {
// 子到根
if (!isCrossDrag) {
return;
}
}
else if (newColumn.parentId) {
// 根到子
if (!isCrossDrag) {
return;
}
if (oldAllMaps[newColumn.id]) {
isSelfToChildStatus = true;
if (!(isCrossDrag && isSelfToChildDrag)) {
if (VxeUI.modal) {
VxeUI.modal.message({
status: 'error',
content: getI18n$a('vxe.error.treeDragChild')
});
}
return;
}
}
}
else ;
const oldewMatchRest = XEUtils.findTree(collectColumn, item => item.id === dragColumn.id);
// 改变层级
if (isSelfToChildStatus && (isCrossDrag && isSelfToChildDrag)) {
if (oldewMatchRest) {
const { items: oCols, index: oIndex } = oldewMatchRest;
const childList = dragColumn.children || [];
childList.forEach(column => {
column.parentId = dragColumn.parentId;
});
oCols.splice(oIndex, 1, ...childList);
dragColumn.children = [];
}
}
else {
if (oldewMatchRest) {
const { items: oCols, index: oIndex, parent: oParent } = oldewMatchRest;
oCols.splice(oIndex, 1);
if (!oParent) {
oafIndex = oIndex;
}
}
}
const newMatchRest = XEUtils.findTree(collectColumn, item => item.id === newColumn.id);
if (newMatchRest) {
const { items: nCols, index: nIndex, parent: nParent } = newMatchRest;
// 转子级
if ((isCrossDrag && isToChildDrag) && prevDragToChild) {
dragColumn.parentId = newColumn.id;
newColumn.children = (newColumn.children || []).concat([dragColumn]);
}
else {
dragColumn.parentId = newColumn.parentId;
nCols.splice(nIndex + dragOffsetIndex, 0, dragColumn);
}
if (!nParent) {
nafIndex = nIndex;
}
}
XEUtils.eachTree(collectColumn, (column, index, items, path, parentItem) => {
if (!parentItem) {
const sortIndex = index + 1;
column.renderSortNumber = sortIndex;
}
});
}
else {
oafIndex = XEUtils.findIndexOf(customColumnList, item => item.id === dragColumn.id);
customColumnList.splice(oafIndex, 1);
nafIndex = XEUtils.findIndexOf(customColumnList, item => item.id === newColumn.id);
customColumnList.splice(nafIndex + dragOffsetIndex, 0, dragColumn);
}
if (mouseConfig) {
if ($xeTable.clearSelected) {
$xeTable.clearSelected();
}
if ($xeTable.clearCellAreas) {
$xeTable.clearCellAreas();
$xeTable.clearCopyCellArea();
}
}
const csParams = {
oldColumn: dragColumn,
newColumn,
dragColumn,
dragPos: prevDragPos,
offsetIndex: dragOffsetIndex,
_index: {
newIndex: nafIndex,
oldIndex: oafIndex
}
};
$xeTable.dispatchEvent('custom-sort-change', csParams, evnt);
$xeTable.dispatchEvent('column-dragend', csParams, evnt);
if (immediate) {
tableReactData.customColumnList = collectColumn.slice(0);
$xeTable.handleColDragSwapColumn();
}
clearDragAnimateStatus();
}).catch(() => {
});
}
}
hideDropTip();
customPanelReactData.dragCol = null;
customPanelReactData.dragGroupField = null;
customPanelReactData.dragAggFnCol = null;
customPanelInternalData.prevDragGroupField = null;
customPanelInternalData.prevDragAggFnColid = null;
trEl.draggable = false;
trEl.removeAttribute('drag-pos');
removeClass(trEl, 'active--drag-target');
removeClass(trEl, 'active--drag-origin');
};
const sortDragoverEvent = (evnt) => {
const customOpts = computeCustomOpts.value;
const { showSortDragButton, allowSort, immediate } = customOpts;
const columnDragOpts = computeColumnDragOpts.value;
const { isCrossDrag, isPeerDrag, isToChildDrag } = columnDragOpts;
const optEl = evnt.currentTarget;
const isControlKey = hasControlKey(evnt);
const colid = optEl.getAttribute('colid');
const column = $xeTable.getColumnById(colid);
const { dragCol } = customPanelReactData;
customPanelInternalData.prevDragGroupField = null;
customPanelInternalData.prevDragAggFnColid = null;
// 是否移入有效列
if (column && (isCrossDrag || isPeerDrag || column.level === 1)) {
evnt.preventDefault();
const offsetY = evnt.clientY - optEl.getBoundingClientRect().y;
const dragPos = offsetY < optEl.clientHeight / 2 ? 'top' : 'bottom';
if (!dragCol ||
!(showSortDragButton && allowSort) ||
(dragCol && dragCol.id === column.id) ||
(!isCrossDrag && (isPeerDrag ? dragCol.parentId !== column.parentId : column.level > 1)) ||
(!immediate && column.level > 1) ||
(!isCrossDrag && (isPeerDrag ? dragCol.parentId !== column.parentId : dragCol.level > 1)) ||
(!immediate && dragCol.level > 1)) {
showDropTip(evnt, optEl, false, dragPos);
return;
}
customPanelInternalData.prevDragToChild = !!((isCrossDrag && isToChildDrag) && isControlKey && immediate);
customPanelInternalData.prevDragCol = column;
customPanelInternalData.prevDragPos = dragPos;
showDropTip(evnt, optEl, true, dragPos);
}
};
const clearDragAnimateStatus = () => {
customPanelInternalData.customDragTime = setTimeout(() => {
tableReactData.isCustomDragStatus = false;
customPanelInternalData.customDragTime = undefined;
}, 350);
};
const sortMoveUpEvent = (evntParame, column) => {
const { customColumnList } = tableReactData;
const matchObj = XEUtils.findTree(customColumnList, item => item === column);
if (matchObj) {
const { item, items, index } = matchObj;
if (index > 0) {
tableReactData.isCustomDragStatus = true;
nextTick(() => {
items.splice(index, 1);
items.splice(index - 1, 0, item);
clearDragAnimateStatus();
});
}
}
};
const sortMoveDnEvent = (evntParame, column) => {
const { customColumnList } = tableReactData;
const matchObj = XEUtils.findTree(customColumnList, item => item === column);
if (matchObj) {
const { item, items, index } = matchObj;
if (index < items.length - 1) {
tableReactData.isCustomDragStatus = true;
nextTick(() => {
items.splice(index, 1);
items.splice(index + 1, 0, item);
clearDragAnimateStatus();
});
}
}
};
const sortMoveTopEvent = (evntParame, column) => {
const { customColumnList } = tableReactData;
const matchObj = XEUtils.findTree(customColumnList, item => item === column);
if (matchObj) {
const { item, items, index, parent: parentItem } = matchObj;
if (parentItem || index > 0) {
tableReactData.isCustomDragStatus = true;
nextTick(() => {
item.parentId = null;
items.splice(index, 1);
customColumnList.unshift(item);
clearDragAnimateStatus();
});
}
}
};
const sortMoveBottomEvent = (evntParame, column) => {
const { customColumnList } = tableReactData;
const matchObj = XEUtils.findTree(customColumnList, item => item === column);
if (matchObj) {
const { item, items, index, parent: parentItem } = matchObj;
if (parentItem || index < items.length - 1) {
tableReactData.isCustomDragStatus = true;
nextTick(() => {
item.parentId = null;
items.splice(index, 1);
customColumnList.push(item);
clearDragAnimateStatus();
});
}
}
};
const renderDragTip = () => {
const { dragTipText } = customPanelReactData;
const columnDragOpts = computeColumnDragOpts.value;
return h('div', {}, [
h('div', {
ref: refDragLineElem,
class: ['vxe-table-custom-popup--drag-line', {
'is--guides': columnDragOpts.showGuidesStatus
}]
}),
h('div', {
ref: refDragTipElem,
class: 'vxe-table-custom-popup--drag-tip'
}, [
h('div', {
class: 'vxe-table-custom-popup--drag-tip-wrapper'
}, [
h('div', {
class: 'vxe-table-custom-popup--drag-tip-status'
}, [
h('span', {
class: ['vxe-table-custom-popup--drag-tip-normal-status', getIcon$6().TABLE_DRAG_STATUS_ROW]
}),
h('span', {
class: ['vxe-table-custom-popup--drag-tip-sub-status', getIcon$6().TABLE_DRAG_STATUS_SUB_ROW]
}),
h('span', {
class: ['vxe-table-custom-popup--drag-tip-group-status', getIcon$6().TABLE_DRAG_STATUS_AGG_GROUP]
}),
h('span', {
class: ['vxe-table-custom-popup--drag-tip-values-status', getIcon$6().TABLE_DRAG_STATUS_AGG_VALUES]
}),
h('span', {
class: ['vxe-table-custom-popup--drag-tip-disabled-status', getIcon$6().TABLE_DRAG_DISABLED]
})
]),
h('div', {
class: 'vxe-table-custom-popup--drag-tip-content'
}, `${dragTipText || ''}`)
])
])
]);
};
const renderSimplePanel = () => {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const tableProps = $xeTable.props;
const { customStore } = props;
const { treeConfig, rowGroupConfig, aggregateConfig } = tableProps;
const { isCustomStatus, customColumnList, isCustomDragStatus } = tableReactData;
const customOpts = computeCustomOpts.value;
const columnDragOpts = computeColumnDragOpts.value;
const { defPopupStyle } = customStore;
const { immediate, checkMethod, visibleMethod, allowVisible, allowSort, allowFixed, allowGroup, allowValues, trigger, placement, showSortDragButton, showSortMoveButton, showSortPutButton } = customOpts;
const isMaxFixedColumn = computeIsMaxFixedColumn.value;
const vSize = computeSize.value;
const { isCrossDrag, isPeerDrag } = columnDragOpts;
const slots = customOpts.slots || {};
const headerSlot = slots.header;
const topSlot = slots.top;
const bottomSlot = slots.bottom;
const defaultSlot = slots.default;
const footerSlot = slots.footer;
const colVNs = [];
const customWrapperOns = {};
const isAllChecked = customStore.isAll;
const isAllIndeterminate = customStore.isIndeterminate;
// hover 触发
if (trigger === 'hover') {
customWrapperOns.onMouseenter = handleWrapperMouseenterEvent;
customWrapperOns.onMouseleave = handleWrapperMouseleaveEvent;
}
const params = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt,
columns: customColumnList,
isAllChecked,
isAllIndeterminate,
isCustomStatus
};
XEUtils.eachTree(customColumnList, (column, index, items, path, parentItem) => {
const isVisible = visibleMethod ? visibleMethod({ $table: $xeTable, column }) : true;
if (isVisible) {
const isChecked = column.renderVisible;
const isIndeterminate = column.halfVisible;
const isColGroup = column.children && column.children.length;
const colTitle = formatText(column.getTitle(), 1);
const isDisabled = checkMethod ? !checkMethod({ $table: $xeTable, column }) : false;
const isHidden = !isChecked;
const showSortBtn = (isCrossDrag || isPeerDrag ? immediate : false) || column.level === 1;
colVNs.push(h('li', {
key: column.id,
colid: column.id,
class: ['vxe-table-custom--option', `level--${column.level}`, {
'is--hidden': isDisabled || isHidden,
'is--group': isColGroup
}],
onDragstart: sortDragstartEvent,
onDragend: sortDragendEvent,
onDragover: sortDragoverEvent
}, [
allowVisible
? h('div', {
class: ['vxe-table-custom--checkbox-option', {
'is--checked': isChecked,
'is--indeterminate': isIndeterminate,
'is--disabled': isDisabled
}],
title: getI18n$a('vxe.custom.setting.colVisible'),
onClick: (evnt) => {
if (!isDisabled) {
changeCheckboxOption(column, evnt);
}
}
}, [
h('span', {
class: ['vxe-checkbox--icon', isIndeterminate ? getIcon$6().TABLE_CHECKBOX_INDETERMINATE : (isChecked ? getIcon$6().TABLE_CHECKBOX_CHECKED : getIcon$6().TABLE_CHECKBOX_UNCHECKED)]
})
])
: renderEmptyElement$6($xeTable),
h('div', {
class: 'vxe-table-custom--name-option'
}, [
(allowSort && showSortDragButton) || (allowGroup || allowValues)
? (showSortBtn || ((allowGroup || allowValues) && !isColGroup)
? h('div', {
class: 'vxe-table-custom--sort-option'
}, [
h('span', Object.assign({ class: ['vxe-table-custom--sort-btn', {
'is--disabled': isHidden
}], title: getI18n$a('vxe.custom.setting.sortHelpTip') }, (isHidden
? {}
: {
onMousedown: sortMousedownEvent,
onMouseup: sortMouseupEvent
})), [
h('i', {
class: getIcon$6().TABLE_CUSTOM_SORT
})
])
])
: renderEmptyElement$6($xeTable))
: renderEmptyElement$6($xeTable),
column.type === 'html'
? h('div', {
key: '1',
class: 'vxe-table-custom--checkbox-label',
innerHTML: colTitle
})
: h('div', {
key: '0',
class: 'vxe-table-custom--checkbox-label'
}, colTitle)
]),
showSortBtn && (showSortMoveButton || showSortPutButton)
? h('div', {
class: 'vxe-table-custom--move-btn-option'
}, VxeUIButtonComponent
? [
showSortMoveButton
? h(VxeUIButtonComponent, {
mode: 'text',
icon: 'vxe-icon-arrows-up',
title: getI18n$a('vxe.custom.setting.moveUpTitle'),
disabled: index <= 0,
onClick(evntParame) {
sortMoveUpEvent(evntParame, column);
}
})
: renderEmptyElement$6($xeTable),
showSortMoveButton
? h(VxeUIButtonComponent, {
mode: 'text',
icon: 'vxe-icon-arrows-down',
title: getI18n$a('vxe.custom.setting.moveDnTitle'),
disabled: index >= items.length - 1,
onClick(evntParame) {
sortMoveDnEvent(evntParame, column);
}
})
: renderEmptyElement$6($xeTable),
showSortPutButton && !parentItem
? h(VxeUIButtonComponent, {
mode: 'text',
icon: 'vxe-icon-top',
title: getI18n$a('vxe.custom.setting.putTopTitle'),
disabled: index <= 0,
onClick(evntParame) {
sortMoveTopEvent(evntParame, column);
}
})
: renderEmptyElement$6($xeTable),
showSortPutButton && !parentItem
? h(VxeUIButtonComponent, {
mode: 'text',
icon: 'vxe-icon-bottom',
title: getI18n$a('vxe.custom.setting.putBottomTitle'),
disabled: index >= items.length - 1,
onClick(evntParame) {
sortMoveBottomEvent(evntParame, column);
}
})
: renderEmptyElement$6($xeTable)
]
: [])
: renderEmptyElement$6($xeTable),
!parentItem && allowFixed
? h('div', {
class: 'vxe-table-custom--fixed-option'
}, VxeUIButtonComponent
? [
h(VxeUIButtonComponent, {
mode: 'text',
icon: column.renderFixed === 'left' ? getIcon$6().TOOLBAR_TOOLS_FIXED_LEFT_ACTIVE : getIcon$6().TOOLBAR_TOOLS_FIXED_LEFT,
status: column.renderFixed === 'left' ? 'primary' : '',
disabled: isHidden || (isMaxFixedColumn && !column.renderFixed),
title: getI18n$a(column.renderFixed === 'left' ? 'vxe.toolbar.cancelFixed' : 'vxe.toolbar.fixedLeft'),
onClick: ({ $event }) => {
changeFixedOption(column, 'left', $event);
}
}),
h(VxeUIButtonComponent, {
mode: 'text',
icon: column.renderFixed === 'right' ? getIcon$6().TOOLBAR_TOOLS_FIXED_RIGHT_ACTIVE : getIcon$6().TOOLBAR_TOOLS_FIXED_RIGHT,
status: column.renderFixed === 'right' ? 'primary' : '',
disabled: isHidden || (isMaxFixedColumn && !column.renderFixed),
title: getI18n$a(column.renderFixed === 'right' ? 'vxe.toolbar.cancelFixed' : 'vxe.toolbar.fixedRight'),
onClick: ({ $event }) => {
changeFixedOption(column, 'right', $event);
}
})
]
: [])
: renderEmptyElement$6($xeTable)
]));
}
});
return h('div', {
ref: refElem,
key: 'simple',
class: ['vxe-table-custom-wrapper', `placement--${placement}`, {
[`size--${vSize}`]: vSize,
'is--active': customStore.visible
}],
style: defPopupStyle
}, customStore.visible
? [
h('div', {
ref: refBodyWrapperElem,
class: 'vxe-table-custom-simple--body-wrapper'
}, [
!treeConfig && (aggregateConfig || rowGroupConfig) && $xeTable.getPivotTableAggregateSimplePanel
? h($xeTable.getPivotTableAggregateSimplePanel(), {
customStore
})
: renderEmptyElement$6($xeTable),
h('div', {
ref: refCustomBodyElem,
class: 'vxe-table-custom--handle-wrapper'
}, [
h('div', {
class: 'vxe-table-custom--header'
}, headerSlot
? $xeTable.callSlot(headerSlot, params)
: [
h('ul', {
class: 'vxe-table-custom--panel-list'
}, [
h('li', {
class: 'vxe-table-custom--option'
}, [
allowVisible
? h('div', {
class: ['vxe-table-custom--checkbox-option', {
'is--checked': isAllChecked,
'is--indeterminate': isAllIndeterminate
}],
title: getI18n$a('vxe.table.allTitle'),
onClick: allOptionEvent
}, [
h('span', {
class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon$6().TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? getIcon$6().TABLE_CHECKBOX_CHECKED : getIcon$6().TABLE_CHECKBOX_UNCHECKED)]
}),
h('span', {
class: 'vxe-checkbox--label'
}, getI18n$a('vxe.toolbar.customAll'))
])
: h('span', {
class: 'vxe-checkbox--label'
}, getI18n$a('vxe.table.customTitle'))
])
])
]),
h('div', {
class: 'vxe-table-custom--body'
}, [
topSlot
? h('div', {
class: 'vxe-table-custom--panel-top'
}, $xeTable.callSlot(topSlot, params))
: renderEmptyElement$6($xeTable),
defaultSlot
? h('div', {
class: 'vxe-table-custom--panel-body'
}, $xeTable.callSlot(defaultSlot, params))
: h(TransitionGroup, Object.assign({ class: 'vxe-table-custom--panel-list', name: isCustomDragStatus ? 'vxe-table-custom--list' : '', tag: 'ul' }, customWrapperOns), {
default: () => colVNs
}),
bottomSlot
? h('div', {
class: 'vxe-table-custom--panel-bottom'
}, $xeTable.callSlot(bottomSlot, params))
: renderEmptyElement$6($xeTable)
]),
customOpts.showFooter
? h('div', {
class: 'vxe-table-custom--footer'
}, footerSlot
? $xeTable.callSlot(footerSlot, params)
: [
h('div', {
class: 'vxe-table-custom--footer-buttons'
}, [
VxeUIButtonComponent
? h(VxeUIButtonComponent, {
mode: 'text',
content: customOpts.resetButtonText || getI18n$a('vxe.table.customRestore'),
disabled: !isCustomStatus,
onClick: resetCustomEvent
})
: renderEmptyElement$6($xeTable),
immediate
? (VxeUIButtonComponent
? h(VxeUIButtonComponent, {
mode: 'text',
content: customOpts.closeButtonText || getI18n$a('vxe.table.customClose'),
onClick: cancelCloseEvent
})
: renderEmptyElement$6($xeTable))
: (VxeUIButtonComponent
? h(VxeUIButtonComponent, {
mode: 'text',
content: customOpts.cancelButtonText || getI18n$a('vxe.table.customCancel'),
onClick: cancelCustomEvent
})
: renderEmptyElement$6($xeTable)),
immediate
? renderEmptyElement$6($xeTable)
: (VxeUIButtonComponent
? h(VxeUIButtonComponent, {
mode: 'text',
status: 'primary',
content: customOpts.confirmButtonText || getI18n$a('vxe.table.customConfirm'),
onClick: confirmCustomEvent
})
: renderEmptyElement$6($xeTable))
])
])
: null
]),
renderDragTip()
])
]
: []);
};
const renderPopupBodys = () => {
const { resizable: allResizable } = tableProps;
const { customColumnList } = tableReactData;
const customOpts = computeCustomOpts.value;
const columnDragOpts = computeColumnDragOpts.value;
const { immediate, showSortDragButton, showSortMoveButton, showSortPutButton, allowVisible, allowSort, allowFixed, allowAlign, allowHeaderAlign, allowFooterAlign, allowResizable, allowGroup, allowValues, checkMethod, visibleMethod } = customOpts;
const columnOpts = computeColumnOpts.value;
const resizableOpts = computeResizableOpts.value;
const { minWidth: reMinWidth, maxWidth: reMaxWidth } = resizableOpts;
const isMaxFixedColumn = computeIsMaxFixedColumn.value;
const { isCrossDrag, isPeerDrag } = columnDragOpts;
const trVNs = [];
XEUtils.eachTree(customColumnList, (column, index, items, path, parentItem) => {
const isVisible = visibleMethod ? visibleMethod({ $table: $xeTable, column }) : true;
if (isVisible) {
// 默认继承调整宽度
let customMinWidth = 0;
let customMaxWidth = 0;
if (allowResizable) {
const resizeParams = {
$table: $xeTable,
column,
columnIndex: $xeTable.getColumnIndex(column),
$columnIndex: $xeTable.getVMColumnIndex(column),
_columnIndex: $xeTable.getVTColumnIndex(column),
rowIndex: -1,
_rowIndex: -1,
$rowIndex: -1
};
if (reMinWidth) {
customMinWidth = XEUtils.toNumber(XEUtils.isFunction(reMinWidth) ? reMinWidth(resizeParams) : reMinWidth);
}
if (reMaxWidth) {
customMaxWidth = XEUtils.toNumber(XEUtils.isFunction(reMaxWidth) ? reMaxWidth(resizeParams) : reMaxWidth);
}
}
const isChecked = column.renderVisible;
const isIndeterminate = column.halfVisible;
const colTitle = formatText(column.getTitle(), 1);
const isColGroup = column.children && column.children.length;
const isDisabled = checkMethod ? !checkMethod({ $table: $xeTable, column }) : false;
const isHidden = !isChecked;
const showSortBtn = (isCrossDrag || isPeerDrag ? immediate : false) || column.level === 1;
const alignList = [
{ icon: getIcon$6().TABLE_CUSTOM_ALIGN_LEFT, value: 'left', title: getI18n$a('vxe.custom.setting.anLeftTitle'), disabled: isHidden },
{ icon: getIcon$6().TABLE_CUSTOM_ALIGN_CENTER, value: 'center', title: getI18n$a('vxe.custom.setting.anCenterTitle'), disabled: isHidden },
{ icon: getIcon$6().TABLE_CUSTOM_ALIGN_RIGHT, value: 'right', title: getI18n$a('vxe.custom.setting.anRightTitle'), disabled: isHidden }
];
const tdVNs = [];
if (allowVisible) {
tdVNs.push(h('td', {
key: 'av',
class: 'vxe-table-custom-popup--column-td col--visible'
}, [
h('div', {
class: ['vxe-table-custom--checkbox-option', {
'is--checked': isChecked,
'is--indeterminate': isIndeterminate,
'is--disabled': isDisabled
}],
title: getI18n$a('vxe.custom.setting.colVisible'),
onClick: (evnt) => {
if (!isDisabled) {
changeCheckboxOption(column, evnt);
}
}
}, [
h('span', {
class: ['vxe-checkbox--icon', isIndeterminate ? getIcon$6().TABLE_CHECKBOX_INDETERMINATE : (isChecked ? getIcon$6().TABLE_CHECKBOX_CHECKED : getIcon$6().TABLE_CHECKBOX_UNCHECKED)]
})
])
]));
}
tdVNs.push(h('td', {
key: 'at',
class: 'vxe-table-custom-popup--column-td col--name'
}, [
h('div', {
class: 'vxe-table-custom-popup--name'
}, [
(allowSort && showSortDragButton) || (allowGroup || allowValues)
? (showSortBtn || ((allowGroup || allowValues) && !isColGroup)
? h('div', Object.assign({ class: ['vxe-table-custom-popup--column-sort-btn', {
'is--disabled': isHidden
}], title: getI18n$a('vxe.custom.setting.sortHelpTip') }, (isHidden
? {}
: {
onMousedown: sortMousedownEvent,
onMouseup: sortMouseupEvent
})), [
h('i', {
class: getIcon$6().TABLE_CUSTOM_SORT
})
])
: h('div', {
class: 'vxe-table-custom-popup--column-sort-placeholder'
}))
: renderEmptyElement$6($xeTable),
column.type === 'html'
? h('div', {
key: '1',
class: 'vxe-table-custom-popup--title',
innerHTML: colTitle
})
: h('div', {
key: '0',
class: 'vxe-table-custom-popup--title',
title: colTitle
}, colTitle),
showSortBtn && (showSortMoveButton || showSortPutButton)
? h('div', {
class: 'vxe-table-custom-popup--move-btn'
}, VxeUIButtonComponent
? [
showSortMoveButton
? h(VxeUIButtonComponent, {
mode: 'text',
icon: 'vxe-icon-arrows-up',
title: getI18n$a('vxe.custom.setting.moveUpTitle'),
disabled: index <= 0,
onClick(evntParame) {
sortMoveUpEvent(evntParame, column);
}
})
: renderEmptyElement$6($xeTable),
showSortMoveButton
? h(VxeUIButtonComponent, {
mode: 'text',
icon: 'vxe-icon-arrows-down',
title: getI18n$a('vxe.custom.setting.moveDnTitle'),
disabled: index >= items.length - 1,
onClick(evntParame) {
sortMoveDnEvent(evntParame, column);
}
})
: renderEmptyElement$6($xeTable),
showSortPutButton && !parentItem
? h(VxeUIButtonComponent, {
mode: 'text',
icon: 'vxe-icon-top',
title: getI18n$a('vxe.custom.setting.putTopTitle'),
disabled: index <= 0,
onClick(evntParame) {
sortMoveTopEvent(evntParame, column);
}
})
: renderEmptyElement$6($xeTable),
showSortPutButton && !parentItem
? h(VxeUIButtonComponent, {
mode: 'text',
icon: 'vxe-icon-bottom',
title: getI18n$a('vxe.custom.setting.putBottomTitle'),
disabled: index >= items.length - 1,
onClick(evntParame) {
sortMoveBottomEvent(evntParame, column);
}
})
: renderEmptyElement$6($xeTable)
]
: [])
: renderEmptyElement$6($xeTable)
])
]));
if (allowResizable) {
tdVNs.push(h('td', {
key: 'aw',
class: 'vxe-table-custom-popup--column-td col--resizable'
}, [
((column.children && column.children.length) ||
!(XEUtils.isBoolean(column.resizable) ? column.resizable : (columnOpts.resizable || allResizable)))
? h('span', '-')
: (VxeUINumberInputComponent
? h(VxeUINumberInputComponent, {
type: 'integer',
immediate: false,
disabled: isHidden,
modelValue: column.renderResizeWidth,
min: customMinWidth || 0,
max: customMaxWidth || 9999,
'onUpdate:modelValue'(value) {
const width = Math.max(0, Number(value));
column.renderResizeWidth = width;
},
onChange() {
changeColumnWidth(column);
}
})
: renderEmptyElement$6($xeTable))
]));
}
if (allowFixed) {
tdVNs.push(h('td', {
key: 'af',
class: 'vxe-table-custom-popup--column-td col--fixed'
}, parentItem
? [h('span', '-')]
: (VxeUIRadioGroupComponent
? [
h(VxeUIButtonComponent, {
icon: column.renderFixed === 'left' ? getIcon$6().TOOLBAR_TOOLS_FIXED_LEFT_ACTIVE : getIcon$6().TOOLBAR_TOOLS_FIXED_LEFT,
status: column.renderFixed === 'left' ? 'primary' : '',
disabled: isHidden || (isMaxFixedColumn && !column.renderFixed),
title: getI18n$a(column.renderFixed === 'left' ? 'vxe.toolbar.cancelFixed' : 'vxe.toolbar.fixedLeft'),
onClick: ({ $event }) => {
changeFixedOption(column, 'left', $event);
}
}),
h(VxeUIButtonComponent, {
icon: column.renderFixed === 'right' ? getIcon$6().TOOLBAR_TOOLS_FIXED_RIGHT_ACTIVE : getIcon$6().TOOLBAR_TOOLS_FIXED_RIGHT,
status: column.renderFixed === 'right' ? 'primary' : '',
disabled: isHidden || (isMaxFixedColumn && !column.renderFixed),
title: getI18n$a(column.renderFixed === 'right' ? 'vxe.toolbar.cancelFixed' : 'vxe.toolbar.fixedRight'),
onClick: ({ $event }) => {
changeFixedOption(column, 'right', $event);
}
})
]
: [])));
}
if (allowAlign) {
tdVNs.push(h('td', {
key: 'aa',
class: 'vxe-table-custom-popup--column-td col--align'
}, VxeUIRadioGroupComponent
? [
h(VxeUIRadioGroupComponent, {
modelValue: column.renderAlign || 'left',
type: 'button',
strict: false,
disabled: isHidden,
options: alignList,
onChange({ value, $event }) {
changeAlignOption(column, value, 'align', 'renderAlign', 'custom-align-change', $event);
}
})
]
: []));
}
if (allowHeaderAlign) {
tdVNs.push(h('td', {
key: 'aha',
class: 'vxe-table-custom-popup--column-td col--header-align'
}, isColGroup
? [h('span', '-')]
: (VxeUIRadioGroupComponent
? [
h(VxeUIRadioGroupComponent, {
modelValue: column.renderHeaderAlign || 'left',
type: 'button',
strict: false,
disabled: isHidden,
options: alignList,
onChange({ value, $event }) {
changeAlignOption(column, value, 'headerAlign', 'renderHeaderAlign', 'custom-header-align-change', $event);
}
})
]
: [])));
}
if (allowFooterAlign) {
tdVNs.push(h('td', {
key: 'afa',
class: 'vxe-table-custom-popup--column-td col--footer-align'
}, isColGroup
? [h('span', '-')]
: (VxeUIRadioGroupComponent
? [
h(VxeUIRadioGroupComponent, {
modelValue: column.renderFooterAlign || 'left',
type: 'button',
strict: false,
disabled: isHidden,
options: alignList,
onChange({ value, $event }) {
changeAlignOption(column, value, 'footerAlign', 'renderFooterAlign', 'custom-footer-align-change', $event);
}
})
]
: [])));
}
trVNs.push(h('tr', {
key: column.id,
colid: column.id,
class: [`vxe-table-custom-popup--row level--${column.level}`, {
'is--group': isColGroup
}],
onDragstart: sortDragstartEvent,
onDragend: sortDragendEvent,
onDragover: sortDragoverEvent
}, tdVNs));
}
});
return trVNs;
};
const renderPopupPanel = () => {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const { customStore } = props;
const { treeConfig, rowGroupConfig, aggregateConfig } = tableProps;
const { isCustomStatus, customColumnList } = tableReactData;
const vSize = computeSize.value;
const customOpts = computeCustomOpts.value;
const aggregateOpts = computeAggregateOpts.value;
const { panePopupStyle } = customStore;
const { placement: aggPlacement } = aggregateOpts;
const { mode, immediate, modalOptions, drawerOptions, allowVisible, allowFixed, allowAlign, allowHeaderAlign, allowFooterAlign, allowResizable } = customOpts;
const columnOpts = computeColumnOpts.value;
const { maxFixedSize } = columnOpts;
const modalOpts = Object.assign({}, modalOptions);
const drawerOpts = Object.assign({}, drawerOptions);
const slots = customOpts.slots || {};
const headerSlot = slots.header;
const topSlot = slots.top;
const bottomSlot = slots.bottom;
const defaultSlot = slots.default;
const footerSlot = slots.footer;
const isAllChecked = customStore.isAll;
const isAllIndeterminate = customStore.isIndeterminate;
const isAggRtBmLayout = aggPlacement === 'right' || aggPlacement === 'bottom';
const params = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt,
columns: customColumnList,
isAllChecked,
isAllIndeterminate,
isCustomStatus
};
const colVNs = [];
const headVNs = [];
if (allowVisible) {
colVNs.push(h('col', {
key: 'av',
class: 'vxe-table-custom-popup--column-col col--checkbox'
}));
headVNs.push(h('th', {
key: 'av',
class: 'vxe-table-custom-popup--column-th col--checkbox'
}, [
h('div', {
class: ['vxe-table-custom--checkbox-option', {
'is--checked': isAllChecked,
'is--indeterminate': isAllIndeterminate
}],
title: getI18n$a('vxe.table.allTitle'),
onClick: allOptionEvent
}, [
h('span', {
class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon$6().TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? getIcon$6().TABLE_CHECKBOX_CHECKED : getIcon$6().TABLE_CHECKBOX_UNCHECKED)]
})
// h('span', {
// class: 'vxe-checkbox--label'
// }, getI18n('vxe.toolbar.customAll'))
])
]));
}
colVNs.push(h('col', {
key: 'at',
class: 'vxe-table-custom-popup--column-col col--title'
}));
headVNs.push(h('th', {
key: 'at',
class: 'vxe-table-custom-popup--column-th col--title'
}, getI18n$a('vxe.custom.setting.colTitle')));
if (allowResizable) {
colVNs.push(h('col', {
key: 'aw',
class: 'vxe-table-custom-popup--column-col col--width'
}));
headVNs.push(h('th', {
key: 'aw',
class: 'vxe-table-custom-popup--column-th col--width'
}, getI18n$a('vxe.custom.setting.colResizable')));
}
if (allowFixed) {
colVNs.push(h('col', {
key: 'af',
class: 'vxe-table-custom-popup--column-col col--fixed'
}));
headVNs.push(h('th', {
key: 'af',
class: 'vxe-table-custom-popup--column-th col--fixed'
}, getI18n$a(`vxe.custom.setting.${maxFixedSize ? 'colFixedMax' : 'colFixed'}`, [maxFixedSize])));
}
if (allowAlign) {
colVNs.push(h('col', {
key: 'aa',
class: 'vxe-table-custom-popup--column-col col--align'
}));
headVNs.push(h('th', {
key: 'aa',
class: 'vxe-table-custom-popup--column-th col--align'
}, getI18n$a('vxe.custom.setting.colAlign')));
}
if (allowHeaderAlign) {
colVNs.push(h('col', {
key: 'aha',
class: 'vxe-table-custom-popup--column-col col--header-align'
}));
headVNs.push(h('th', {
key: 'aha',
class: 'vxe-table-custom-popup--column-th col--header-align'
}, getI18n$a('vxe.custom.setting.colHeadAlign')));
}
if (allowFooterAlign) {
colVNs.push(h('col', {
key: 'afa',
class: 'vxe-table-custom-popup--column-col col--footer-align'
}));
headVNs.push(h('th', {
key: 'afa',
class: 'vxe-table-custom-popup--column-th col--footer-align'
}, getI18n$a('vxe.custom.setting.colFootAlign')));
}
const scopedSlots = {
default: () => {
return h('div', {
ref: refBodyWrapperElem,
class: ['vxe-table-custom-popup--body-wrapper', `agg-layout--${aggPlacement}`, {
[`size--${vSize}`]: vSize
}],
style: panePopupStyle
}, defaultSlot
? $xeTable.callSlot(defaultSlot, params)
: [
!isAggRtBmLayout && !treeConfig && (aggregateConfig || rowGroupConfig) && $xeTable.getPivotTableAggregatePopupPanel
? h($xeTable.getPivotTableAggregatePopupPanel(), {
customStore
})
: renderEmptyElement$6($xeTable),
h('div', {
ref: refCustomBodyElem,
class: 'vxe-table-custom-popup--handle-wrapper'
}, [
topSlot
? h('div', {
class: 'vxe-table-custom-popup--table-top'
}, $xeTable.callSlot(topSlot, params))
: renderEmptyElement$6($xeTable),
h('div', {
class: 'vxe-table-custom-popup--table-wrapper'
}, [
h('table', {}, [
h('colgroup', {}, colVNs),
h('thead', {}, [
h('tr', {}, headVNs)
]),
h(TransitionGroup, {
class: 'vxe-table-custom--panel-list',
tag: 'tbody',
name: 'vxe-table-custom--list'
}, {
default: () => renderPopupBodys()
})
])
]),
bottomSlot
? h('div', {
class: 'vxe-table-custom-popup--table-bottom'
}, $xeTable.callSlot(bottomSlot, params))
: renderEmptyElement$6($xeTable),
renderDragTip()
]),
isAggRtBmLayout && !treeConfig && (aggregateConfig || rowGroupConfig) && $xeTable.getPivotTableAggregatePopupPanel
? h($xeTable.getPivotTableAggregatePopupPanel(), {
customStore
})
: renderEmptyElement$6($xeTable)
]);
},
footer: () => {
if (footerSlot) {
return $xeTable.callSlot(footerSlot, params);
}
return h('div', {
class: 'vxe-table-custom-popup--footer'
}, [
VxeUIButtonComponent
? h(VxeUIButtonComponent, {
content: customOpts.resetButtonText || getI18n$a('vxe.custom.cstmRestore'),
disabled: !isCustomStatus,
onClick: resetCustomEvent
})
: renderEmptyElement$6($xeTable),
immediate
? (VxeUIButtonComponent
? h(VxeUIButtonComponent, {
status: 'primary',
content: customOpts.closeButtonText || getI18n$a('vxe.table.customClose'),
onClick: cancelCloseEvent
})
: renderEmptyElement$6($xeTable))
: (VxeUIButtonComponent
? h(VxeUIButtonComponent, {
content: customOpts.cancelButtonText || getI18n$a('vxe.table.customCancel'),
onClick: cancelCustomEvent
})
: renderEmptyElement$6($xeTable)),
immediate
? renderEmptyElement$6($xeTable)
: (VxeUIButtonComponent
? h(VxeUIButtonComponent, {
status: 'primary',
content: customOpts.confirmButtonText || getI18n$a('vxe.custom.cstmConfirm'),
onClick: confirmCustomEvent
})
: renderEmptyElement$6($xeTable))
]);
}
};
if (headerSlot) {
scopedSlots.header = () => $xeTable.callSlot(headerSlot, params);
}
if (mode === 'drawer') {
return VxeUIDrawerComponent
? h(VxeUIDrawerComponent, {
key: 'drawer',
className: ['vxe-table-custom-drawer-wrapper', 'vxe-table--ignore-clear', drawerOpts.className || ''].join(' '),
modelValue: customStore.visible,
title: drawerOpts.title || getI18n$a('vxe.custom.cstmTitle'),
width: drawerOpts.width || Math.min(880, Math.floor(document.documentElement.clientWidth * 0.6)),
position: drawerOpts.position,
resize: !!drawerOpts.resize,
escClosable: !!drawerOpts.escClosable,
maskClosable: !!drawerOpts.maskClosable,
destroyOnClose: true,
showFooter: true,
'onUpdate:modelValue'(value) {
customStore.visible = value;
}
}, scopedSlots)
: renderEmptyElement$6($xeTable);
}
return VxeUIModalComponent
? h(VxeUIModalComponent, {
key: 'modal',
className: ['vxe-table-custom-modal-wrapper', 'vxe-table--ignore-clear', modalOpts.className || ''].join(' '),
modelValue: customStore.visible,
title: modalOpts.title || getI18n$a('vxe.custom.cstmTitle'),
width: modalOpts.width || Math.min(1000, document.documentElement.clientWidth),
minWidth: modalOpts.minWidth || 800,
height: modalOpts.height || Math.min(680, document.documentElement.clientHeight),
minHeight: modalOpts.minHeight || 400,
showZoom: modalOpts.showZoom,
showMaximize: modalOpts.showMaximize,
showMinimize: modalOpts.showMinimize,
mask: modalOpts.mask,
lockView: modalOpts.lockView,
resize: modalOpts.resize,
transfer: modalOpts.transfer,
escClosable: !!modalOpts.escClosable,
maskClosable: !!modalOpts.maskClosable,
destroyOnClose: true,
showFooter: true,
'onUpdate:modelValue'(value) {
customStore.visible = value;
}
}, scopedSlots)
: renderEmptyElement$6($xeTable);
};
const renderVN = () => {
const customOpts = computeCustomOpts.value;
if (['modal', 'drawer', 'popup'].includes(`${customOpts.mode}`)) {
return renderPopupPanel();
}
return renderSimplePanel();
};
nextTick(() => {
const customOpts = computeCustomOpts.value;
const { mode } = customOpts;
if (!VxeUIModalComponent && (mode === 'modal')) {
errLog$9('vxe.error.reqComp', ['vxe-modal']);
}
if (!VxeUIDrawerComponent && (mode === 'drawer')) {
errLog$9('vxe.error.reqComp', ['vxe-drawer']);
}
if (!VxeUIButtonComponent) {
errLog$9('vxe.error.reqComp', ['vxe-button']);
}
if (!VxeUINumberInputComponent) {
errLog$9('vxe.error.reqComp', ['vxe-number-input']);
}
if (!VxeUIRadioGroupComponent) {
errLog$9('vxe.error.reqComp', ['vxe-radio-group']);
}
});
const $xeTableCustomPanel = {
xID,
props,
context,
reactData: customPanelReactData,
internalData: customPanelInternalData,
xeTable: $xeTable,
getRefMaps: () => refMaps,
getComputeMaps: () => computeMaps,
renderVN
};
onUnmounted(() => {
customPanelInternalData = createInternalData$2();
});
provide('$xeTableCustomPanel', $xeTableCustomPanel);
return $xeTableCustomPanel;
},
render() {
return this.renderVN();
}
});
const { warnLog: warnLog$6 } = createComponentLog('table');
const { getI18n: getI18n$9, getIcon: getIcon$5, renderer: renderer$6, renderEmptyElement: renderEmptyElement$5 } = VxeUI;
var TableFilterPanelComponent = defineVxeComponent({
name: 'VxeTableFilterPanel',
props: {
filterStore: {
type: Object,
default: () => ({})
}
},
setup(props, context) {
const xID = XEUtils.uniqueId();
const $xeTable = inject('$xeTable', {});
const { reactData: tableReactData, internalData: tableInternalData, getComputeMaps } = $xeTable;
const { computeFilterOpts } = getComputeMaps();
const refElem = ref();
const refMaps = {
refElem
};
const $xeFilterPanel = {
xID,
props,
context,
getRefMaps: () => refMaps
};
const computeHasCheckOption = computed(() => {
const { filterStore } = props;
const { column } = filterStore;
return column && column.filters && column.filters.some((option) => option.checked);
});
// 全部筛选事件
const filterCheckAllEvent = (evnt, value) => {
const { filterStore } = props;
const { column } = filterStore;
if (column && column.filters) {
column.filters.forEach((option) => {
option._checked = value;
option.checked = value;
});
}
filterStore.isAllSelected = value;
filterStore.isIndeterminate = false;
};
/*************************
* Publish methods
*************************/
// 确认筛选
const confirmFilter = (evnt) => {
const { filterStore } = props;
if (!evnt) {
warnLog$6('vxe.error.delFunc', ['confirmFilter', 'saveFilterPanelByEvent']);
}
$xeTable.handleFilterConfirmFilter(evnt || new Event('click'), filterStore.column || null);
};
// (单选)筛选发生改变
const changeRadioOption = (evnt, checked, item) => {
$xeTable.handleFilterChangeRadioOption(evnt, checked, item);
};
/**
* 重置筛选
* 当筛选面板中的重置按钮被按下时触发
* @param {Event} evnt 事件
*/
const resetFilter = (evnt) => {
const { filterStore } = props;
$xeTable.handleFilterResetFilter(evnt, filterStore.column || null);
};
// (多选)筛选发生改变
const changeMultipleOption = (evnt, checked, item) => {
$xeTable.handleFilterChangeMultipleOption(evnt, checked, item);
};
// 筛选发生改变
const changeOption = (evnt, checked, item) => {
$xeTable.handleFilterChangeOption(evnt, checked, item);
};
const changeAllOption = (evnt, checked) => {
const { filterStore } = props;
const { column } = filterStore;
if (column && column.filterMultiple) {
filterCheckAllEvent(evnt, checked);
}
else {
resetFilter(evnt);
}
};
/*************************
* Publish methods
*************************/
const filterPanelMethods = {
changeRadioOption,
changeMultipleOption,
changeAllOption,
changeOption,
confirmFilter,
resetFilter
};
Object.assign($xeFilterPanel, filterPanelMethods);
const renderOptions = (filterRender, compConf) => {
const { filterStore } = props;
const { column, maxHeight } = filterStore;
if (!column) {
return [];
}
const { filterMultiple, filters, slots } = column;
const filterOptions = (filters || []);
const filterSlot = slots ? slots.filter : null;
const params = Object.assign({}, tableInternalData._currFilterParams, { option: filterOptions[0], $panel: $xeFilterPanel, $table: $xeTable });
const rtFilter = compConf ? (compConf.renderTableFilter || compConf.renderFilter) : null;
if (filterSlot) {
return [
h('div', {
class: 'vxe-table--filter-template',
style: maxHeight
? {
maxHeight: toCssUnit(maxHeight)
}
: {}
}, $xeTable.callSlot(filterSlot, params))
];
}
else if (filterRender && rtFilter) {
return [
h('div', {
class: 'vxe-table--filter-template',
style: maxHeight
? {
maxHeight: toCssUnit(maxHeight)
}
: {}
}, getSlotVNs(rtFilter(filterRender, params)))
];
}
const isAllChecked = filterMultiple ? filterStore.isAllSelected : !filterOptions.some((item) => item._checked);
const isAllIndeterminate = filterMultiple && filterStore.isIndeterminate;
return [
h('ul', {
class: 'vxe-table--filter-header'
}, [
h('li', {
class: ['vxe-table--filter-option', {
'is--checked': isAllChecked,
'is--indeterminate': isAllIndeterminate
}],
title: getI18n$9(filterMultiple ? 'vxe.table.allTitle' : 'vxe.table.allFilter'),
onClick: (evnt) => {
changeAllOption(evnt, !filterStore.isAllSelected);
}
}, (filterMultiple
? [
h('span', {
class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon$5().TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? getIcon$5().TABLE_CHECKBOX_CHECKED : getIcon$5().TABLE_CHECKBOX_UNCHECKED)]
})
]
: []).concat([
h('span', {
class: 'vxe-checkbox--label'
}, getI18n$9('vxe.table.allFilter'))
]))
]),
h('ul', {
class: 'vxe-table--filter-body',
style: maxHeight
? {
maxHeight: toCssUnit(maxHeight)
}
: {}
}, filterOptions.map((item) => {
const isChecked = item._checked;
return h('li', {
class: ['vxe-table--filter-option', {
'is--checked': item._checked
}],
title: item.label,
onClick: (evnt) => {
changeOption(evnt, !item._checked, item);
}
}, (filterMultiple
? [
h('span', {
class: ['vxe-checkbox--icon', (isChecked ? getIcon$5().TABLE_CHECKBOX_CHECKED : getIcon$5().TABLE_CHECKBOX_UNCHECKED)]
})
]
: []).concat([
h('span', {
class: 'vxe-checkbox--label'
}, formatText(item.label, 1))
]));
}))
];
};
const renderFooters = () => {
const { filterStore } = props;
const { column } = filterStore;
if (!column) {
return [];
}
const filterOpts = computeFilterOpts.value;
const hasCheckOption = computeHasCheckOption.value;
const { filterRender, filterMultiple } = column;
const { confirmButtonText, resetButtonText, showFooter } = filterOpts;
const compConf = isEnableConf(filterRender) ? renderer$6.get(filterRender.name) : null;
const isDisabled = !hasCheckOption && !filterStore.isAllSelected && !filterStore.isIndeterminate;
let showFlFoot = !!filterMultiple;
if (XEUtils.isBoolean(showFooter)) {
showFlFoot = showFooter;
}
else if (compConf) {
showFlFoot = !(compConf.showTableFilterFooter === false || compConf.showFilterFooter === false || compConf.isFooter === false);
}
return showFlFoot
? [
h('div', {
class: 'vxe-table--filter-footer'
}, [
h('button', {
class: {
'is--disabled': isDisabled
},
disabled: isDisabled,
onClick: confirmFilter
}, confirmButtonText || getI18n$9('vxe.table.confirmFilter')),
h('button', {
onClick: resetFilter
}, resetButtonText || getI18n$9('vxe.table.resetFilter'))
])
]
: [];
};
const renderVN = () => {
const { filterStore } = props;
const { initStore } = tableReactData;
const { visible, column } = filterStore;
if (!column) {
return renderEmptyElement$5($xeFilterPanel);
}
const filterRender = column ? column.filterRender : null;
const compConf = filterRender && isEnableConf(filterRender) ? renderer$6.get(filterRender.name) : null;
const filterClassName = compConf ? (compConf.tableFilterClassName || compConf.filterClassName) : '';
const params = Object.assign({}, tableInternalData._currFilterParams, { $panel: $xeFilterPanel, $table: $xeTable });
const tableProps = $xeTable.props;
const { computeSize } = $xeTable.getComputeMaps();
const vSize = computeSize.value;
const filterOpts = computeFilterOpts.value;
const { transfer, destroyOnClose, className } = filterOpts;
return h(Teleport, {
to: 'body',
disabled: !transfer
}, [
h('div', {
ref: refElem,
class: [
'vxe-table--filter-wrapper',
'filter--prevent-default',
className,
getPropClass(filterClassName, params),
{
[`size--${vSize}`]: vSize,
'is--animat': tableProps.animat,
'is--multiple': column.filterMultiple,
'is--active': visible
}
],
style: filterStore.style
}, initStore.filter && (destroyOnClose ? visible : true) && column ? renderOptions(filterRender, compConf).concat(renderFooters()) : [])
]);
};
$xeFilterPanel.renderVN = renderVN;
return $xeFilterPanel;
},
render() {
return this.renderVN();
}
});
const { errLog: errLog$8 } = createComponentLog('table');
const { getI18n: getI18n$8, getIcon: getIcon$4, renderEmptyElement: renderEmptyElement$4 } = VxeUI;
var TableImportPanelComponent = defineVxeComponent({
name: 'VxeTableImportPanel',
props: {
defaultOptions: {
type: Object,
default: () => ({})
},
storeData: {
type: Object,
default: () => ({})
}
},
setup(props) {
const VxeUIModalComponent = VxeUI.getComponent('VxeModal');
const VxeUIButtonComponent = VxeUI.getComponent('VxeButton');
const VxeUISelectComponent = VxeUI.getComponent('VxeSelect');
const $xeTable = inject('$xeTable', {});
const { computeImportOpts } = $xeTable.getComputeMaps();
const reactData = reactive({
loading: false
});
const refFileBtn = ref();
const computeSelectName = computed(() => {
const { storeData } = props;
return `${storeData.filename}.${storeData.type}`;
});
const computeHasFile = computed(() => {
const { storeData } = props;
return storeData.file && storeData.type;
});
const computeParseTypeLabel = computed(() => {
const { storeData } = props;
const { type, typeList } = storeData;
if (type) {
const selectItem = XEUtils.find(typeList, item => type === item.value);
return `${selectItem ? selectItem.label : '*.*'}`;
}
return `*.${typeList.map((item) => item.value).join(', *.')}`;
});
const clearFileEvent = () => {
const { storeData } = props;
Object.assign(storeData, {
filename: '',
sheetName: '',
type: ''
});
};
const selectFileEvent = () => {
const { storeData, defaultOptions } = props;
$xeTable.readFile(defaultOptions).then((params) => {
const { file } = params;
Object.assign(storeData, parseFile(file), { file });
}).catch(() => { });
};
const showEvent = () => {
nextTick(() => {
const targetElem = refFileBtn.value;
if (targetElem) {
targetElem.focus();
}
});
};
const cancelEvent = () => {
const { storeData } = props;
storeData.visible = false;
};
const importEvent = () => {
const { storeData, defaultOptions } = props;
const importOpts = computeImportOpts.value;
reactData.loading = true;
$xeTable.importByFile(storeData.file, Object.assign({}, importOpts, defaultOptions)).then(() => {
reactData.loading = false;
storeData.visible = false;
}).catch(() => {
reactData.loading = false;
});
};
const renderVN = () => {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const { defaultOptions, storeData } = props;
const selectName = computeSelectName.value;
const hasFile = computeHasFile.value;
const importOpts = computeImportOpts.value;
const parseTypeLabel = computeParseTypeLabel.value;
const modelOptions = importOpts.modelOptions || {};
const settingOptions = importOpts.settingOptions || {};
const slots = defaultOptions.slots || {};
const topSlot = slots.top;
const bottomSlot = slots.bottom;
const defaultSlot = slots.default;
const footerSlot = slots.footer;
return VxeUIModalComponent
? h(VxeUIModalComponent, {
id: 'VXE_IMPORT_MODAL',
modelValue: storeData.visible,
title: modelOptions.title || getI18n$8('vxe.import.impTitle'),
className: 'vxe-table-export-popup-wrapper',
width: modelOptions.width || 540,
height: modelOptions.height,
minWidth: modelOptions.minWidth || 360,
minHeight: modelOptions.minHeight || 240,
mask: getDefaultConfig(modelOptions.mask, true),
lockView: getDefaultConfig(modelOptions.lockView, true),
showFooter: true,
escClosable: true,
maskClosable: true,
position: modelOptions.position,
fullscreen: modelOptions.fullscreen,
remember: modelOptions.remember,
showMinimize: modelOptions.showMinimize,
showMaximize: getDefaultConfig(modelOptions.showMaximize, true),
resize: getDefaultConfig(modelOptions.resize, true),
loading: reactData.loading,
'onUpdate:modelValue'(value) {
storeData.visible = value;
},
onShow: showEvent
}, {
default: () => {
const params = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt,
options: defaultOptions,
params: defaultOptions.params
};
return h('div', {
class: 'vxe-table-export--panel'
}, [
topSlot
? h('div', {
class: 'vxe-table-export--panel-top'
}, $xeTable.callSlot(topSlot, params))
: renderEmptyElement$4($xeTable),
h('div', {
class: 'vxe-table-export--panel-body'
}, defaultSlot
? $xeTable.callSlot(defaultSlot, params)
: [
h('table', {
class: 'vxe-table-export--panel-table',
cellspacing: 0,
cellpadding: 0,
border: 0
}, [
h('tbody', [
h('tr', [
h('td', getI18n$8('vxe.import.impFile')),
h('td', [
hasFile
? h('div', {
class: 'vxe-table-export--selected--file',
title: selectName
}, [
h('span', selectName),
h('i', {
class: getIcon$4().INPUT_CLEAR,
onClick: clearFileEvent
})
])
: h('button', {
ref: refFileBtn,
class: 'vxe-table-export--select--file',
onClick: selectFileEvent
}, getI18n$8('vxe.import.impSelect'))
])
]),
h('tr', [
h('td', getI18n$8('vxe.import.impType')),
h('td', parseTypeLabel)
]),
settingOptions.showMode === false
? renderEmptyElement$4($xeTable)
: h('tr', [
h('td', getI18n$8('vxe.import.impMode')),
h('td', [
VxeUISelectComponent
? h(VxeUISelectComponent, {
modelValue: defaultOptions.mode,
options: storeData.modeList,
'onUpdate:modelValue'(value) {
defaultOptions.mode = value;
}
})
: renderEmptyElement$4($xeTable)
])
])
])
])
]),
bottomSlot
? h('div', {
class: 'vxe-table-export--panel-bottom'
}, $xeTable.callSlot(bottomSlot, params))
: renderEmptyElement$4($xeTable)
]);
},
footer() {
const params = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt,
options: defaultOptions,
params: defaultOptions.params
};
return h('div', {
class: 'vxe-table-export--panel-footer'
}, footerSlot
? $xeTable.callSlot(footerSlot, params)
: [
h('div', {
class: 'vxe-table-export--panel-btns'
}, [
VxeUIButtonComponent
? h(VxeUIButtonComponent, {
content: getI18n$8('vxe.import.impCancel'),
onClick: cancelEvent
})
: renderEmptyElement$4($xeTable),
VxeUIButtonComponent
? h(VxeUIButtonComponent, {
status: 'primary',
disabled: !hasFile || reactData.loading,
content: getI18n$8('vxe.import.impConfirm'),
onClick: importEvent
})
: renderEmptyElement$4($xeTable)
])
]);
}
})
: renderEmptyElement$4($xeTable);
};
nextTick(() => {
if (!VxeUIModalComponent) {
errLog$8('vxe.error.reqComp', ['vxe-modal']);
}
if (!VxeUIButtonComponent) {
errLog$8('vxe.error.reqComp', ['vxe-button']);
}
if (!VxeUISelectComponent) {
errLog$8('vxe.error.reqComp', ['vxe-select']);
}
});
return renderVN;
}
});
const { errLog: errLog$7 } = createComponentLog('table');
const { getI18n: getI18n$7, getIcon: getIcon$3, renderEmptyElement: renderEmptyElement$3 } = VxeUI;
var TableExportPanelComponent = defineVxeComponent({
name: 'VxeTableExportPanel',
props: {
defaultOptions: {
type: Object,
default: () => ({})
},
storeData: {
type: Object,
default: () => ({})
}
},
setup(props) {
const VxeUIModalComponent = VxeUI.getComponent('VxeModal');
const VxeUIButtonComponent = VxeUI.getComponent('VxeButton');
const VxeUISelectComponent = VxeUI.getComponent('VxeSelect');
const VxeUIInputComponent = VxeUI.getComponent('VxeInput');
const VxeUICheckboxComponent = VxeUI.getComponent('VxeCheckbox');
const $xeTable = inject('$xeTable', {});
const { computeExportOpts, computePrintOpts } = $xeTable.getComputeMaps();
const reactData = reactive({
isAll: false,
isIndeterminate: false,
loading: false
});
const xButtonConfirm = ref();
const xInputFilename = ref();
const xInputSheetname = ref();
const computeColWidthModeOptions = computed(() => {
return [
{ value: '', label: getI18n$7('vxe.export.wdModes.default') },
{ value: 'auto', label: getI18n$7('vxe.export.wdModes.auto') },
{ value: 'scale', label: getI18n$7('vxe.export.wdModes.scale') }
];
});
const computeCheckedAll = computed(() => {
const { storeData } = props;
return storeData.columns.every((column) => column.checked);
});
const computeShowSheet = computed(() => {
const { defaultOptions } = props;
return ['html', 'xml', 'xlsx', 'pdf'].indexOf(defaultOptions.type) > -1;
});
const computeSupportMerge = computed(() => {
const { storeData, defaultOptions } = props;
return !defaultOptions.original && defaultOptions.mode === 'current' && (storeData.isPrint || ['html', 'xlsx'].indexOf(defaultOptions.type) > -1);
});
// const computeSupportGroup = computed(() => {
// const { defaultOptions } = props
// return ['html', 'xlsx', 'csv', 'txt'].indexOf(defaultOptions.type) > -1
// })
const computeSupportStyle = computed(() => {
const { defaultOptions } = props;
return !defaultOptions.original && ['xlsx'].indexOf(defaultOptions.type) > -1;
});
const handleOptionCheck = (column) => {
const { storeData } = props;
const matchObj = XEUtils.findTree(storeData.columns, item => item === column);
if (matchObj && matchObj.parent) {
const { parent } = matchObj;
if (parent.children && parent.children.length) {
parent.checked = parent.children.every((column) => column.checked);
parent.halfChecked = !parent.checked && parent.children.some((column) => column.checked || column.halfChecked);
handleOptionCheck(parent);
}
}
};
const checkStatus = () => {
const { storeData } = props;
const columns = storeData.columns;
reactData.isAll = columns.every((column) => column.disabled || column.checked);
reactData.isIndeterminate = !reactData.isAll && columns.some((column) => !column.disabled && (column.checked || column.halfChecked));
};
const changeOption = (column) => {
const isChecked = !column.checked;
XEUtils.eachTree([column], (item) => {
item.checked = isChecked;
item.halfChecked = false;
});
handleOptionCheck(column);
checkStatus();
};
const allColumnEvent = () => {
const { storeData } = props;
const isAll = !reactData.isAll;
XEUtils.eachTree(storeData.columns, (column) => {
if (!column.disabled) {
column.checked = isAll;
column.halfChecked = false;
}
});
reactData.isAll = isAll;
checkStatus();
};
const showEvent = () => {
nextTick(() => {
const filenameInp = xInputFilename.value;
const sheetnameInp = xInputSheetname.value;
const confirmBtn = xButtonConfirm.value;
const targetElem = filenameInp || sheetnameInp || confirmBtn;
if (targetElem) {
targetElem.focus();
}
});
checkStatus();
};
const getExportOption = () => {
const { storeData, defaultOptions } = props;
const { hasMerge, columns } = storeData;
const checkedAll = computeCheckedAll.value;
const supportMerge = computeSupportMerge.value;
const expColumns = XEUtils.searchTree(columns, (column) => column.checked, { children: 'children', mapChildren: 'childNodes', original: true });
return Object.assign({}, defaultOptions, {
columns: expColumns,
isMerge: hasMerge && supportMerge && checkedAll ? defaultOptions.isMerge : false
});
};
const printEvent = () => {
const { storeData } = props;
const printOpts = computePrintOpts.value;
storeData.visible = false;
$xeTable.print(Object.assign({}, printOpts, getExportOption()));
};
const exportEvent = () => {
const { storeData } = props;
const exportOpts = computeExportOpts.value;
reactData.loading = true;
$xeTable.exportData(Object.assign({}, exportOpts, getExportOption())).then(() => {
reactData.loading = false;
storeData.visible = false;
}).catch(() => {
reactData.loading = false;
});
};
const cancelEvent = () => {
const { storeData } = props;
storeData.visible = false;
};
const confirmEvent = () => {
const { storeData } = props;
if (storeData.isPrint) {
printEvent();
}
else {
exportEvent();
}
};
const renderVN = () => {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const { defaultOptions, storeData } = props;
const { isAll: isAllChecked, isIndeterminate: isAllIndeterminate } = reactData;
const { hasTree, hasRowGroup, hasMerge, isPrint, hasColgroup, columns } = storeData;
const { isHeader } = defaultOptions;
const colVNs = [];
const exportOpts = computeExportOpts.value;
const printOpts = computePrintOpts.value;
const modelOptions = (isPrint ? printOpts : exportOpts).modelOptions || {};
const settingOptions = (isPrint ? printOpts : exportOpts).settingOptions || {};
const checkedAll = computeCheckedAll.value;
const showSheet = computeShowSheet.value;
const supportMerge = computeSupportMerge.value;
const supportStyle = computeSupportStyle.value;
const colWidthModeOptions = computeColWidthModeOptions.value;
// const supportGroup = computeSupportGroup.value
const slots = defaultOptions.slots || {};
const topSlot = slots.top;
const bottomSlot = slots.bottom;
const defaultSlot = slots.default;
const footerSlot = slots.footer;
const parameterSlot = slots.parameter;
XEUtils.eachTree(columns, (column) => {
const colTitle = formatText(column.getTitle(), 1);
const isColGroup = column.children && column.children.length;
const isChecked = column.checked;
const indeterminate = column.halfChecked;
const isHtml = column.type === 'html';
colVNs.push(h('li', {
key: column.id,
class: ['vxe-table-export--panel-column-option', `level--${column.level}`, {
'is--group': isColGroup,
'is--checked': isChecked,
'is--indeterminate': indeterminate,
'is--disabled': column.disabled
}],
title: isHtml ? '' : colTitle,
onClick: () => {
if (!column.disabled) {
changeOption(column);
}
}
}, [
h('span', {
class: ['vxe-checkbox--icon', indeterminate ? getIcon$3().TABLE_CHECKBOX_INDETERMINATE : (isChecked ? getIcon$3().TABLE_CHECKBOX_CHECKED : getIcon$3().TABLE_CHECKBOX_UNCHECKED)]
}),
isHtml
? h('span', {
key: '1',
class: 'vxe-checkbox--label',
innerHTML: colTitle
})
: h('span', {
key: '0',
class: 'vxe-checkbox--label'
}, colTitle)
]));
});
return VxeUIModalComponent
? h(VxeUIModalComponent, {
id: 'VXE_EXPORT_MODAL',
modelValue: storeData.visible,
title: modelOptions.title || getI18n$7(isPrint ? 'vxe.export.printTitle' : 'vxe.export.expTitle'),
className: 'vxe-table-export-popup-wrapper',
width: modelOptions.width || 660,
height: modelOptions.height,
minWidth: modelOptions.minWidth || 500,
minHeight: modelOptions.minHeight || 400,
mask: getDefaultConfig(modelOptions.mask, true),
lockView: getDefaultConfig(modelOptions.lockView, true),
showFooter: true,
escClosable: true,
maskClosable: true,
position: modelOptions.position,
fullscreen: modelOptions.fullscreen,
remember: modelOptions.remember,
showMinimize: modelOptions.showMinimize,
showMaximize: getDefaultConfig(modelOptions.showMaximize, true),
resize: getDefaultConfig(modelOptions.resize, true),
loading: reactData.loading,
'onUpdate:modelValue'(value) {
storeData.visible = value;
},
onShow: showEvent
}, {
default: () => {
const params = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt,
options: defaultOptions,
columns,
params: defaultOptions.params
};
const hasEmptyData = defaultOptions.mode === 'empty';
return h('div', {
class: 'vxe-table-export--panel'
}, [
topSlot
? h('div', {
class: 'vxe-table-export--panel-top'
}, $xeTable.callSlot(topSlot, params))
: renderEmptyElement$3($xeTable),
h('div', {
class: 'vxe-table-export--panel-body'
}, defaultSlot
? $xeTable.callSlot(defaultSlot, params)
: [
h('table', {
class: 'vxe-table-export--panel-table',
cellspacing: 0,
cellpadding: 0,
border: 0
}, [
h('tbody', [
[
isPrint || settingOptions.showFileName === false
? renderEmptyElement$3($xeTable)
: h('tr', [
h('td', getI18n$7('vxe.export.expName')),
h('td', [
VxeUIInputComponent
? h(VxeUIInputComponent, {
ref: xInputFilename,
modelValue: defaultOptions.filename,
type: 'text',
clearable: true,
placeholder: getI18n$7('vxe.export.expNamePlaceholder'),
'onUpdate:modelValue'(value) {
defaultOptions.filename = value;
}
})
: renderEmptyElement$3($xeTable)
])
]),
isPrint || settingOptions.showType === false
? renderEmptyElement$3($xeTable)
: h('tr', [
h('td', getI18n$7('vxe.export.expType')),
h('td', [
VxeUISelectComponent
? h(VxeUISelectComponent, {
modelValue: defaultOptions.type,
options: storeData.typeList,
'onUpdate:modelValue'(value) {
defaultOptions.type = value;
}
})
: renderEmptyElement$3($xeTable)
])
]),
(isPrint || showSheet) && settingOptions.showSheet !== false
? h('tr', [
h('td', getI18n$7('vxe.export.expSheetName')),
h('td', [
VxeUIInputComponent
? h(VxeUIInputComponent, {
ref: xInputSheetname,
modelValue: defaultOptions.sheetName,
type: 'text',
clearable: true,
placeholder: getI18n$7('vxe.export.expSheetNamePlaceholder'),
'onUpdate:modelValue'(value) {
defaultOptions.sheetName = value;
}
})
: renderEmptyElement$3($xeTable)
])
])
: renderEmptyElement$3($xeTable),
settingOptions.showMode === false
? renderEmptyElement$3($xeTable)
: h('tr', [
h('td', getI18n$7('vxe.export.expMode')),
h('td', [
VxeUISelectComponent
? h(VxeUISelectComponent, {
modelValue: defaultOptions.mode,
options: storeData.modeList.map((item) => {
return {
value: item.value,
label: getI18n$7(item.label)
};
}),
'onUpdate:modelValue'(value) {
defaultOptions.mode = value;
}
})
: renderEmptyElement$3($xeTable)
])
]),
settingOptions.showColumn === false
? renderEmptyElement$3($xeTable)
: h('tr', [
h('td', [getI18n$7('vxe.export.expColumn')]),
h('td', [
h('div', {
class: 'vxe-table-export--panel-column'
}, [
h('ul', {
class: 'vxe-table-export--panel-column-header'
}, [
h('li', {
class: ['vxe-table-export--panel-column-option', {
'is--checked': isAllChecked,
'is--indeterminate': isAllIndeterminate
}],
title: getI18n$7('vxe.table.allTitle'),
onClick: allColumnEvent
}, [
h('span', {
class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon$3().TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? getIcon$3().TABLE_CHECKBOX_CHECKED : getIcon$3().TABLE_CHECKBOX_UNCHECKED)]
}),
h('span', {
class: 'vxe-checkbox--label'
}, getI18n$7('vxe.export.expCurrentColumn'))
])
]),
h('ul', {
class: 'vxe-table-export--panel-column-body'
}, colVNs)
])
])
]),
isPrint && (settingOptions.showWidthMode !== false)
? h('tr', [
h('td', getI18n$7('vxe.export.widthMode')),
h('td', [
VxeUISelectComponent
? h(VxeUISelectComponent, {
modelValue: defaultOptions.widthMode,
options: colWidthModeOptions,
'onUpdate:modelValue'(value) {
defaultOptions.widthMode = value;
}
})
: renderEmptyElement$3($xeTable)
])
])
: renderEmptyElement$3($xeTable),
settingOptions.showParameter === false
? renderEmptyElement$3($xeTable)
: h('tr', [
h('td', getI18n$7('vxe.export.expOpts')),
parameterSlot
? h('td', [
h('div', {
class: 'vxe-table-export--panel-option-row'
}, $xeTable.callSlot(parameterSlot, params))
])
: h('td', [
h('div', {
class: 'vxe-table-export--panel-option-row'
}, VxeUICheckboxComponent
? [
h(VxeUICheckboxComponent, {
modelValue: hasEmptyData || isHeader,
disabled: hasEmptyData,
title: getI18n$7('vxe.export.expHeaderTitle'),
content: getI18n$7('vxe.export.expOptHeader'),
'onUpdate:modelValue'(value) {
defaultOptions.isHeader = value;
}
}),
h(VxeUICheckboxComponent, {
modelValue: defaultOptions.isFooter,
disabled: !storeData.hasFooter,
title: getI18n$7('vxe.export.expFooterTitle'),
content: getI18n$7('vxe.export.expOptFooter'),
'onUpdate:modelValue'(value) {
defaultOptions.isFooter = value;
}
}),
h(VxeUICheckboxComponent, {
modelValue: isHeader ? defaultOptions.isTitle : false,
disabled: !isHeader,
title: getI18n$7('vxe.export.expTitleTitle'),
content: getI18n$7('vxe.export.expOptTitle'),
'onUpdate:modelValue'(value) {
defaultOptions.isTitle = value;
}
}),
h(VxeUICheckboxComponent, {
modelValue: isHeader && hasColgroup && supportMerge ? defaultOptions.isColgroup : false,
title: getI18n$7('vxe.export.expColgroupTitle'),
disabled: !isHeader || !hasColgroup || !supportMerge,
content: getI18n$7('vxe.export.expOptColgroup'),
'onUpdate:modelValue'(value) {
defaultOptions.isColgroup = value;
}
})
]
: []),
h('div', {
class: 'vxe-table-export--panel-option-row'
}, VxeUICheckboxComponent
? [
h(VxeUICheckboxComponent, {
modelValue: hasEmptyData ? false : defaultOptions.original,
disabled: hasEmptyData,
title: getI18n$7('vxe.export.expOriginalTitle'),
content: getI18n$7('vxe.export.expOptOriginal'),
'onUpdate:modelValue'(value) {
defaultOptions.original = value;
}
}),
h(VxeUICheckboxComponent, {
modelValue: hasMerge && supportMerge && checkedAll ? defaultOptions.isMerge : false,
title: getI18n$7('vxe.export.expMergeTitle'),
disabled: hasEmptyData || !hasMerge || !supportMerge || !checkedAll,
content: getI18n$7('vxe.export.expOptMerge'),
'onUpdate:modelValue'(value) {
defaultOptions.isMerge = value;
}
}),
isPrint
? renderEmptyElement$3($xeTable)
: h(VxeUICheckboxComponent, {
modelValue: supportStyle ? defaultOptions.useStyle : false,
disabled: !supportStyle,
title: getI18n$7('vxe.export.expUseStyleTitle'),
content: getI18n$7('vxe.export.expOptUseStyle'),
'onUpdate:modelValue'(value) {
defaultOptions.useStyle = value;
}
})
]
: []),
h('div', {
class: 'vxe-table-export--panel-option-row'
}, VxeUICheckboxComponent
? [
h(VxeUICheckboxComponent, {
modelValue: hasTree ? defaultOptions.isTreeAllExpanded : false,
disabled: hasEmptyData || !hasTree,
title: getI18n$7('vxe.export.expTreeAllExpandTitle'),
content: getI18n$7('vxe.export.expOptTreeAllExpand'),
'onUpdate:modelValue'(value) {
defaultOptions.isTreeAllExpanded = value;
}
}),
h(VxeUICheckboxComponent, {
modelValue: hasRowGroup ? defaultOptions.isRowGroupAllExpanded : false,
disabled: hasEmptyData || !hasRowGroup,
title: getI18n$7('vxe.export.expRowGroupAllExpandTitle'),
content: getI18n$7('vxe.export.expOptRowGroupAllExpand'),
'onUpdate:modelValue'(value) {
defaultOptions.isRowGroupAllExpanded = value;
}
})
]
: [])
])
])
]
])
])
]),
bottomSlot
? h('div', {
class: 'vxe-table-export--panel-bottom'
}, $xeTable.callSlot(bottomSlot, params))
: renderEmptyElement$3($xeTable)
]);
},
footer() {
const params = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt,
options: defaultOptions,
columns,
params: defaultOptions.params
};
return h('div', {
class: 'vxe-table-export--panel-footer'
}, footerSlot
? $xeTable.callSlot(footerSlot, params)
: [
h('div', {
class: 'vxe-table-export--panel-btns'
}, [
VxeUIButtonComponent
? h(VxeUIButtonComponent, {
content: getI18n$7('vxe.export.expCancel'),
onClick: cancelEvent
})
: renderEmptyElement$3($xeTable),
VxeUIButtonComponent
? h(VxeUIButtonComponent, {
ref: xButtonConfirm,
status: 'primary',
content: getI18n$7(isPrint ? 'vxe.export.expPrint' : 'vxe.export.expConfirm'),
onClick: confirmEvent
})
: renderEmptyElement$3($xeTable)
])
]);
}
})
: renderEmptyElement$3($xeTable);
};
nextTick(() => {
if (!VxeUIModalComponent) {
errLog$7('vxe.error.reqComp', ['vxe-modal']);
}
if (!VxeUIButtonComponent) {
errLog$7('vxe.error.reqComp', ['vxe-button']);
}
if (!VxeUISelectComponent) {
errLog$7('vxe.error.reqComp', ['vxe-select']);
}
if (!VxeUIInputComponent) {
errLog$7('vxe.error.reqComp', ['vxe-input']);
}
if (!VxeUICheckboxComponent) {
errLog$7('vxe.error.reqComp', ['vxe-checkbox']);
}
});
return renderVN;
}
});
const { getIcon: getIcon$2, getI18n: getI18n$6, renderEmptyElement: renderEmptyElement$2 } = VxeUI;
var TableMenuPanelComponent = defineVxeComponent({
name: 'VxeTableMenuPanel',
setup(props, context) {
const xID = XEUtils.uniqueId();
const $xeTable = inject('$xeTable', {});
const { reactData: tableReactData } = $xeTable;
const refElem = ref();
const refMaps = {
refElem
};
const $xeMenuPanel = {
xID,
props,
context,
getRefMaps: () => refMaps
};
const renderVN = () => {
const { ctxMenuStore } = tableReactData;
const { computeMenuOpts } = $xeTable.getComputeMaps();
const menuOpts = computeMenuOpts.value;
const { transfer, destroyOnClose, className } = menuOpts;
const { visible, list } = ctxMenuStore;
return h(Teleport, {
to: 'body',
disabled: !transfer
}, [
h('div', {
ref: refElem,
class: ['vxe-table--context-menu-wrapper', className, {
'is--visible': visible
}],
style: ctxMenuStore.style
}, (destroyOnClose ? visible : true)
? list.map((options, gIndex) => {
return options.every(item => item.visible === false)
? renderEmptyElement$2($xeTable)
: h('ul', {
class: 'vxe-table--context-menu-group-wrapper',
key: gIndex
}, options.map((item, index) => {
const { children, loading } = item;
const hasChildMenus = children && children.some((child) => child.visible !== false);
const prefixOpts = Object.assign({}, item.prefixConfig);
const prefixIcon = prefixOpts.icon || item.prefixIcon;
const suffixOpts = Object.assign({}, item.suffixConfig);
const suffixIcon = suffixOpts.icon || item.suffixIcon;
const menuContent = getFuncText(item.name);
return item.visible === false
? renderEmptyElement$2($xeTable)
: h('li', {
class: ['vxe-table--context-menu--option', item.className, {
'link--loading': loading,
'link--disabled': item.disabled,
'link--active': item === ctxMenuStore.selected
}],
key: `${gIndex}_${index}`
}, [
h('a', {
class: 'vxe-context-menu--link',
onClick(evnt) {
$xeTable.ctxMenuLinkEvent(evnt, item);
},
onMouseover(evnt) {
$xeTable.ctxMenuMouseoverEvent(evnt, item);
},
onMouseout(evnt) {
$xeTable.ctxMenuMouseoutEvent(evnt, item);
}
}, [
h('div', {
class: ['vxe-context-menu--link-prefix', prefixOpts.className || '']
}, [
loading
? h('span', {
class: getIcon$2('TABLE_MENU_OPTION_LOADING')
})
: (prefixIcon && XEUtils.isFunction(prefixIcon)
? h('span', {}, getSlotVNs(prefixIcon({})))
: h('span', {}, [
h('i', {
class: prefixIcon
})
])),
prefixOpts.content ? h('span', {}, `${prefixOpts.content}`) : renderEmptyElement$2($xeTable)
]),
h('div', {
class: 'vxe-context-menu--link-content',
title: menuContent
}, loading ? getI18n$6('vxe.table.menuLoading') : menuContent),
h('div', {
class: ['vxe-context-menu--link-suffix', suffixOpts.className || '']
}, [
suffixIcon && XEUtils.isFunction(suffixIcon)
? h('span', {}, getSlotVNs(suffixIcon({})))
: h('i', {
class: suffixIcon || (hasChildMenus ? getIcon$2().TABLE_MENU_OPTIONS : '')
}),
suffixOpts.content ? h('span', `${suffixOpts.content}`) : renderEmptyElement$2($xeTable)
])
]),
hasChildMenus && children
? h('ul', {
class: ['vxe-table--context-menu-clild-wrapper', {
'is--show': item === ctxMenuStore.selected && ctxMenuStore.showChild
}]
}, children.map((child, cIndex) => {
const { loading: childLoading } = child;
const childPrefixOpts = Object.assign({}, child.prefixConfig);
const childPrefixIcon = childPrefixOpts.icon || child.prefixIcon;
const childSuffixOpts = Object.assign({}, child.suffixConfig);
const childSuffixIcon = childSuffixOpts.icon || child.suffixIcon;
const childMenuContent = getFuncText(child.name);
return child.visible === false
? null
: h('li', {
class: ['vxe-table--context-menu--option', child.className, {
'link--loading': childLoading,
'link--disabled': child.disabled,
'link--active': child === ctxMenuStore.selectChild
}],
key: `${gIndex}_${index}_${cIndex}`
}, [
h('a', {
class: 'vxe-context-menu--link',
onClick(evnt) {
$xeTable.ctxMenuLinkEvent(evnt, child);
},
onMouseover(evnt) {
$xeTable.ctxMenuMouseoverEvent(evnt, item, child);
},
onMouseout(evnt) {
$xeTable.ctxMenuMouseoutEvent(evnt, item);
}
}, [
h('div', {
class: ['vxe-context-menu--link-prefix', childPrefixOpts.className || '']
}, [
child.loading
? h('span', {
class: getIcon$2('TABLE_MENU_OPTION_LOADING')
})
: (childPrefixIcon && XEUtils.isFunction(childPrefixIcon)
? h('span', {}, getSlotVNs(childPrefixIcon({})))
: h('span', {}, [
h('i', {
class: childPrefixIcon
})
])),
childPrefixOpts.content ? h('span', `${childPrefixOpts.content}`) : renderEmptyElement$2($xeTable)
]),
h('div', {
class: 'vxe-context-menu--link-content',
title: childMenuContent
}, childLoading ? getI18n$6('vxe.table.menuLoading') : childMenuContent),
h('div', {
class: ['vxe-context-menu--link-suffix', childSuffixOpts.className || '']
}, [
childSuffixIcon && XEUtils.isFunction(childSuffixIcon)
? h('span', {}, getSlotVNs(childSuffixIcon({})))
: h('i', {
class: childSuffixIcon
}),
childSuffixOpts.content ? h('span', `${childSuffixOpts.content}`) : renderEmptyElement$2($xeTable)
])
])
]);
}))
: null
]);
}));
})
: [])
]);
};
$xeMenuPanel.renderVN = renderVN;
return $xeMenuPanel;
},
render() {
return this.renderVN();
}
});
const { renderer: renderer$5, hooks: hooks$7 } = VxeUI;
const tableFilterMethodKeys = ['openFilter', 'setFilter', 'clearFilter', 'saveFilter', 'saveFilterByEvent', 'saveFilterPanel', 'saveFilterPanelByEvent', 'resetFilter', 'resetFilterByEvent', 'resetFilterPanel', 'resetFilterPanelByEvent', 'getCheckedFilters', 'updateFilterOptionStatus'];
const sourceType$1 = 'table';
hooks$7.add('tableFilterModule', {
setupTable($xeTable) {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const $xeGGWrapper = $xeGrid || $xeGantt;
const { props, reactData, internalData } = $xeTable;
const { refElem, refTableFilter } = $xeTable.getRefMaps();
const { computeFilterOpts, computeMouseOpts } = $xeTable.getComputeMaps();
const filterPrivateMethods = {
checkFilterOptions() {
const { filterStore } = reactData;
const { column } = filterStore;
if (column) {
const filterOptions = (column.filters || []);
filterStore.isAllSelected = filterOptions.every((item) => item._checked);
filterStore.isIndeterminate = !filterStore.isAllSelected && filterOptions.some((item) => item._checked);
}
},
handleOpenFilterColumn(evnt, btnEl, colEl, column, params) {
const { initStore, filterStore } = reactData;
const { elemStore } = internalData;
if (filterStore.column === column && filterStore.visible) {
filterStore.visible = false;
}
else {
const tableEl = refElem.value;
const { scrollTop, scrollLeft, visibleHeight, visibleWidth } = getDomNode();
const filterOpts = computeFilterOpts.value;
const { maxHeight: customMaxHeight, transfer, zIndex } = filterOpts;
const currEl = btnEl || colEl;
const tableRect = tableEl.getBoundingClientRect();
const filterRender = column ? column.filterRender : null;
const compConf = filterRender && isEnableConf(filterRender) ? renderer$5.get(filterRender.name) : null;
$xeTable.handleFilterOptions(column);
internalData._currFilterParams = params;
filterStore.style = null;
filterStore.visible = true;
initStore.filter = true;
nextTick(() => {
const headerScrollElem = getRefElem(elemStore['main-header-scroll']);
if (!headerScrollElem) {
return;
}
const tableFilter = refTableFilter.value;
const filterWrapperElem = tableFilter ? tableFilter.getRefMaps().refElem.value : null;
if (!filterWrapperElem) {
return;
}
const btnRect = currEl.getBoundingClientRect();
const filterHeadElem = filterWrapperElem.querySelector('.vxe-table--filter-header');
const filterFootElem = filterWrapperElem.querySelector('.vxe-table--filter-footer');
const filterWidth = filterWrapperElem.offsetWidth;
const centerWidth = btnEl ? filterWidth / 2 : ((filterWidth - column.renderWidth) / 2);
let left = 0;
let top = 0;
let maxHeight = 0;
/**
* 是否显示筛选按钮图标
* 如果不存在图标,则相对单元格居中显示
*/
if (transfer) {
left = btnRect.left - centerWidth + scrollLeft;
top = btnRect.top + currEl.clientHeight + scrollTop;
maxHeight = Math.min(Math.max(tableRect.height, Math.floor(visibleHeight / 2)), Math.max(80, visibleHeight - top - (filterHeadElem ? filterHeadElem.clientHeight : 0) - (filterFootElem ? filterFootElem.clientHeight : 0) - 28));
if (left < 16) {
left = 16;
}
else if (left > (visibleWidth - filterWidth - 16)) {
left = visibleWidth - filterWidth - 16;
}
}
else {
left = btnRect.left - tableRect.left - centerWidth;
top = btnRect.top - tableRect.top + currEl.clientHeight;
maxHeight = Math.max(40, tableEl.clientHeight - top - (filterHeadElem ? filterHeadElem.clientHeight : 0) - (filterFootElem ? filterFootElem.clientHeight : 0) - 14);
if (left < 1) {
left = 1;
}
else if (left > (tableEl.clientWidth - filterWidth - 1)) {
left = tableEl.clientWidth - filterWidth - 1;
}
if ($xeGGWrapper) {
const wrapperEl = $xeGGWrapper.getRefMaps().refElem.value;
if (wrapperEl) {
const wrapperRect = wrapperEl.getBoundingClientRect();
top += tableRect.top - wrapperRect.top;
}
}
}
const fStys = {
top: toCssUnit(top),
left: toCssUnit(left)
};
if (zIndex) {
fStys.zIndex = zIndex;
}
filterStore.style = fStys;
// 筛选面板是自适应表格高度
if (compConf ? !compConf.tableFilterAutoHeight : false) {
maxHeight = 0;
}
else {
if (customMaxHeight) {
maxHeight = customMaxHeight > maxHeight ? maxHeight : customMaxHeight;
}
}
// 判断面板不能大于表格高度
filterStore.maxHeight = maxHeight;
});
}
$xeTable.dispatchEvent('filter-visible', { column, field: column.field, property: column.field, filterList: $xeTable.getCheckedFilters(), visible: filterStore.visible }, evnt);
},
/**
* 点击筛选事件
* 当筛选图标被点击时触发
* 更新选项是否全部状态
* 打开筛选面板
* @param {Event} evnt 事件
* @param {ColumnInfo} column 列配置
* @param {Object} params 参数
*/
triggerFilterEvent(evnt, column, params) {
const { elemStore } = internalData;
const { fixed } = column;
const headerWrapperElem = getRefElem(elemStore[`${fixed || 'main'}-header-wrapper`] || elemStore['main-header-wrapper']);
const btnElem = evnt.currentTarget;
const colEl = headerWrapperElem ? headerWrapperElem.querySelector(`.vxe-header--column.${column.id}`) : null;
$xeTable.handleOpenFilterColumn(evnt, btnElem, colEl || btnElem, column, params);
},
handleClearFilter(column) {
if (column) {
const { filters, filterRender } = column;
if (filters) {
const compConf = isEnableConf(filterRender) ? renderer$5.get(filterRender.name) : null;
const frMethod = column.filterResetMethod || (compConf ? (compConf.tableFilterResetMethod || compConf.filterResetMethod) : null);
filters.forEach((item) => {
item._checked = false;
item.checked = false;
if (!frMethod) {
item.data = XEUtils.clone(item.resetValue, true);
}
});
if (frMethod) {
frMethod({ options: filters, column, $table: $xeTable });
}
}
}
},
handleColumnConfirmFilter(column, evnt) {
const { mouseConfig } = props;
const { scrollXLoad: oldScrollXLoad, scrollYLoad: oldScrollYLoad } = reactData;
const filterOpts = computeFilterOpts.value;
const mouseOpts = computeMouseOpts.value;
const { field, filters } = column;
const filterOptions = filters || [];
const values = [];
const datas = [];
filterOptions.forEach((item) => {
if (item.checked) {
values.push(item.value);
datas.push(item.data);
}
});
const filterList = $xeTable.getCheckedFilters();
const params = { $table: $xeTable, $event: evnt, column, field, property: field, values, datas, filters: filterList, filterList };
// 如果是服务端筛选,则跳过本地筛选处理
if (!filterOpts.remote) {
$xeTable.handleTableData(true);
$xeTable.checkSelectionStatus();
}
if (mouseConfig && mouseOpts.area && $xeTable.handleFilterEvent) {
$xeTable.handleFilterEvent(evnt, params);
}
if (evnt) {
$xeTable.dispatchEvent('filter-change', params, evnt);
}
$xeTable.closeFilter();
return $xeTable.updateFooter().then(() => {
const { scrollXLoad, scrollYLoad } = reactData;
if ((oldScrollXLoad || scrollXLoad) || (oldScrollYLoad || scrollYLoad)) {
if (oldScrollXLoad || scrollXLoad) {
$xeTable.updateScrollXSpace();
}
if (oldScrollYLoad || scrollYLoad) {
$xeTable.updateScrollYSpace();
}
return $xeTable.refreshScroll();
}
}).then(() => {
$xeTable.updateCellAreas();
return $xeTable.recalculate(true);
}).then(() => {
// 存在滚动行为未结束情况
setTimeout(() => $xeTable.recalculate(), 50);
});
},
/**
* 确认筛选
* 当筛选面板中的确定按钮被按下时触发
*/
confirmFilterEvent(evnt, column) {
if (column) {
$xeTable.handleColumnConfirmFilter(column, evnt);
}
},
// (单选)筛选发生改变
handleFilterChangeRadioOption(evnt, checked, item) {
const { filterStore } = reactData;
const { column } = filterStore;
if (column) {
const filterOptions = (column.filters || []);
filterOptions.forEach((option) => {
option._checked = false;
});
item._checked = checked;
$xeTable.checkFilterOptions();
$xeTable.handleFilterConfirmFilter(evnt, column);
}
},
// (多选)筛选发生改变
handleFilterChangeMultipleOption(evnt, checked, item) {
item._checked = checked;
$xeTable.checkFilterOptions();
},
// 筛选发生改变
handleFilterChangeOption(evnt, checked, item) {
const { filterStore } = reactData;
const { fullColumnIdData } = internalData;
let column = filterStore.column;
if (!column) {
const colRest = fullColumnIdData[item._colId];
if (colRest) {
column = colRest.column;
filterStore.column = column;
}
}
if (column) {
if (column.filterMultiple) {
$xeTable.handleFilterChangeMultipleOption(evnt, checked, item);
}
else {
$xeTable.handleFilterChangeRadioOption(evnt, checked, item);
}
}
},
// 确认筛选
handleFilterConfirmFilter(evnt, column) {
if (column) {
const filterOptions = (column.filters || []);
filterOptions.forEach((option) => {
option.checked = option._checked;
});
$xeTable.confirmFilterEvent(evnt, column);
}
},
/**
* 重置筛选
* 当筛选面板中的重置按钮被按下时触发
*/
handleFilterResetFilter(evnt, column) {
if (column) {
$xeTable.handleClearFilter(column);
$xeTable.confirmFilterEvent(evnt, column);
if (evnt) {
$xeTable.dispatchEvent('clear-filter', { filterList: [] }, evnt);
}
}
}
};
const filterMethods = {
/**
* 手动弹出筛选面板
* @param column
*/
openFilter(fieldOrColumn) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (column && column.filters) {
const { elemStore } = internalData;
const { fixed, filters } = column;
return $xeTable.scrollToColumn(column).then(() => {
const headerWrapperElem = getRefElem(elemStore[`${fixed || 'main'}-header-wrapper`] || elemStore['main-header-wrapper']);
if (headerWrapperElem) {
const filterBtnElem = headerWrapperElem.querySelector(`.vxe-header--column.${column.id} .vxe-cell--filter`);
if (filterBtnElem) {
triggerEvent(filterBtnElem, 'click');
}
else {
const colEl = headerWrapperElem.querySelector(`.vxe-header--column.${column.id}`);
if (colEl) {
let firstFilterOption = null;
if (filters) {
firstFilterOption = filters[0];
}
const params = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt,
$rowIndex: -1,
column,
columnIndex: $xeTable.getColumnIndex(column),
$columnIndex: $xeTable.getVMColumnIndex(column),
_columnIndex: $xeTable.getVTColumnIndex(column),
firstFilterOption: firstFilterOption,
fixed,
source: sourceType$1,
type: 'header'
// isHidden
// hasFilter
};
$xeTable.handleOpenFilterColumn(new Event('click'), null, colEl, column, params);
}
}
}
});
}
return nextTick();
},
/**
* 修改筛选条件列表
* @param {ColumnInfo} fieldOrColumn 列或字段名
* @param {Array} options 选项
*/
setFilter(fieldOrColumn, options, isUpdate) {
const { filterStore } = reactData;
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (column && column.filters) {
column.filters = toFilters(options || [], column.id);
if (isUpdate) {
return $xeTable.handleColumnConfirmFilter(column, null);
}
else {
if (filterStore.visible) {
$xeTable.handleFilterOptions(column);
}
}
}
return nextTick();
},
/**
* 清空指定列的筛选条件
* 如果为空则清空所有列的筛选条件
* @param {String} fieldOrColumn 列或字段名
*/
clearFilter(fieldOrColumn) {
const { filterStore } = reactData;
const { tableFullColumn } = internalData;
const filterOpts = computeFilterOpts.value;
let column;
if (fieldOrColumn) {
column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (column) {
$xeTable.handleClearFilter(column);
}
}
else {
tableFullColumn.forEach($xeTable.handleClearFilter);
}
if (!fieldOrColumn || column !== filterStore.column) {
Object.assign(filterStore, {
isAllSelected: false,
isIndeterminate: false,
style: null,
options: [],
column: null,
multiple: false,
visible: false
});
}
if (!filterOpts.remote) {
return $xeTable.updateData();
}
return nextTick();
},
saveFilter(fieldOrColumn) {
if (fieldOrColumn) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
$xeTable.handleFilterConfirmFilter(null, column);
}
return nextTick();
},
saveFilterByEvent(evnt, fieldOrColumn) {
if (fieldOrColumn) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
$xeTable.handleFilterConfirmFilter(evnt, column);
}
return nextTick();
},
resetFilter(fieldOrColumn) {
if (fieldOrColumn) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
$xeTable.handleFilterResetFilter(null, column);
}
return nextTick();
},
resetFilterByEvent(evnt, fieldOrColumn) {
if (fieldOrColumn) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
$xeTable.handleFilterResetFilter(evnt, column);
}
return nextTick();
},
saveFilterPanel() {
const { filterStore } = reactData;
$xeTable.handleFilterConfirmFilter(null, filterStore.column || null);
return nextTick();
},
saveFilterPanelByEvent(evnt) {
const { filterStore } = reactData;
$xeTable.handleFilterConfirmFilter(evnt, filterStore.column || null);
return nextTick();
},
resetFilterPanel() {
const { filterStore } = reactData;
$xeTable.handleFilterResetFilter(null, filterStore.column || null);
return nextTick();
},
resetFilterPanelByEvent(evnt) {
const { filterStore } = reactData;
$xeTable.handleFilterResetFilter(evnt, filterStore.column || null);
return nextTick();
},
getCheckedFilters() {
const { tableFullColumn } = internalData;
const filterList = [];
tableFullColumn.forEach((column) => {
const { field, filters } = column;
const filterOptions = filters || [];
const valueList = [];
const dataList = [];
if (filterOptions) {
filterOptions.forEach((item) => {
if (item.checked) {
valueList.push(item.value);
dataList.push(item.data);
}
});
if (valueList.length) {
filterList.push({ column, field, property: field, values: valueList, datas: dataList });
}
}
});
return filterList;
},
updateFilterOptionStatus(item, checked) {
item._checked = checked;
item.checked = checked;
return nextTick();
}
};
return Object.assign(Object.assign({}, filterMethods), filterPrivateMethods);
},
setupGrid($xeGrid) {
return $xeGrid.extendTableMethods(tableFilterMethodKeys);
},
setupGantt($xeGantt) {
return $xeGantt.extendTableMethods(tableFilterMethodKeys);
}
});
const { menus, hooks: hooks$6, globalEvents: globalEvents$2, GLOBAL_EVENT_KEYS: GLOBAL_EVENT_KEYS$2 } = VxeUI;
const tableMenuMethodKeys = ['closeMenu'];
hooks$6.add('tableMenuModule', {
setupTable($xeTable) {
const { xID, props, reactData, internalData } = $xeTable;
const { refElem, refTableFilter, refTableMenu } = $xeTable.getRefMaps();
const { computeMouseOpts, computeIsContentMenu, computeMenuOpts } = $xeTable.getComputeMaps();
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const $xeGGWrapper = $xeGrid || $xeGantt;
let menuMethods = {};
let menuPrivateMethods = {};
/**
* 显示快捷菜单
*/
const handleOpenMenuEvent = (evnt, type, params) => {
const { ctxMenuStore } = reactData;
const isContentMenu = computeIsContentMenu.value;
const menuOpts = computeMenuOpts.value;
const config = menuOpts[type];
const { zIndex, transfer, width, visibleMethod } = menuOpts;
if (config) {
const { options, disabled } = config;
if (disabled) {
evnt.preventDefault();
}
else if (isContentMenu && options && options.length) {
params.options = options;
$xeTable.preventEvent(evnt, 'event.showMenu', params, () => {
if (!visibleMethod || visibleMethod(params)) {
evnt.preventDefault();
$xeTable.updateZindex();
const el = $xeGGWrapper ? $xeGGWrapper.getRefMaps().refElem.value : refElem.value;
if (!el) {
return;
}
const tableRect = el.getBoundingClientRect();
const { scrollTop, scrollLeft, visibleHeight, visibleWidth } = getDomNode();
let top = evnt.clientY - tableRect.y;
let left = evnt.clientX - tableRect.x;
if (transfer) {
top = evnt.clientY + scrollTop;
left = evnt.clientX + scrollLeft;
}
const handleVisible = () => {
internalData._currMenuParams = params;
const ctxStyle = {
zIndex: zIndex || internalData.tZindex,
top: `${top}px`,
left: `${left}px`
};
if (width) {
ctxStyle['--vxe-ui-table-menu-item-width'] = toCssUnit(width);
}
Object.assign(ctxMenuStore, {
visible: true,
list: options,
selected: null,
selectChild: null,
showChild: false,
style: ctxStyle
});
nextTick(() => {
const tableMenu = refTableMenu.value;
const ctxElem = tableMenu.getRefMaps().refElem.value;
const clientHeight = ctxElem.clientHeight;
const clientWidth = ctxElem.clientWidth;
const { boundingTop, boundingLeft } = getAbsolutePos(ctxElem);
const offsetTop = boundingTop + clientHeight - visibleHeight;
const offsetLeft = boundingLeft + clientWidth - visibleWidth;
if (offsetTop > -10) {
ctxMenuStore.style.top = `${Math.max(scrollTop + 2, top - clientHeight - 2)}px`;
}
if (offsetLeft > -10) {
ctxMenuStore.style.left = `${Math.max(scrollLeft + 2, left - clientWidth - 2)}px`;
}
});
};
const { keyboard, row, column } = params;
if (keyboard && row && column) {
$xeTable.scrollToRow(row, column).then(() => {
const cell = $xeTable.getCellElement(row, column);
if (cell) {
const { boundingTop, boundingLeft } = getAbsolutePos(cell);
top = boundingTop + scrollTop + Math.floor(cell.offsetHeight / 2);
left = boundingLeft + scrollLeft + Math.floor(cell.offsetWidth / 2);
}
handleVisible();
});
}
else {
handleVisible();
}
}
else {
menuMethods.closeMenu();
}
});
}
}
$xeTable.closeFilter();
};
menuMethods = {
/**
* 关闭快捷菜单
*/
closeMenu() {
Object.assign(reactData.ctxMenuStore, {
visible: false,
selected: null,
selectChild: null,
showChild: false
});
return nextTick();
}
};
menuPrivateMethods = {
/**
* 处理菜单的移动
*/
moveCtxMenu(evnt, ctxMenuStore, property, hasOper, operRest, menuList) {
let selectItem;
const selectIndex = XEUtils.findIndexOf(menuList, item => ctxMenuStore[property] === item);
if (hasOper) {
if (operRest && hasChildrenList(ctxMenuStore.selected)) {
ctxMenuStore.showChild = true;
}
else {
ctxMenuStore.showChild = false;
ctxMenuStore.selectChild = null;
}
}
else if (globalEvents$2.hasKey(evnt, GLOBAL_EVENT_KEYS$2.ARROW_UP)) {
for (let len = selectIndex - 1; len >= 0; len--) {
if (menuList[len].visible !== false) {
selectItem = menuList[len];
break;
}
}
ctxMenuStore[property] = selectItem || menuList[menuList.length - 1];
}
else if (globalEvents$2.hasKey(evnt, GLOBAL_EVENT_KEYS$2.ARROW_DOWN)) {
for (let index = selectIndex + 1; index < menuList.length; index++) {
if (menuList[index].visible !== false) {
selectItem = menuList[index];
break;
}
}
ctxMenuStore[property] = selectItem || menuList[0];
}
else if (ctxMenuStore[property] && (globalEvents$2.hasKey(evnt, GLOBAL_EVENT_KEYS$2.ENTER) || globalEvents$2.hasKey(evnt, GLOBAL_EVENT_KEYS$2.SPACEBAR))) {
$xeTable.ctxMenuLinkEvent(evnt, ctxMenuStore[property]);
}
},
handleOpenMenuEvent,
/**
* 快捷菜单事件处理
*/
handleGlobalContextmenuEvent(evnt) {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const { mouseConfig, menuConfig } = props;
const { editStore, ctxMenuStore } = reactData;
const { visibleColumn } = internalData;
const tableFilter = refTableFilter.value;
const tableMenu = refTableMenu.value;
const mouseOpts = computeMouseOpts.value;
const menuOpts = computeMenuOpts.value;
const el = refElem.value;
const { selected } = editStore;
const layoutList = ['header', 'body', 'footer'];
if (isEnableConf(menuConfig)) {
if (ctxMenuStore.visible && tableMenu && getEventTargetNode(evnt, tableMenu.getRefMaps().refElem.value).flag) {
evnt.preventDefault();
return;
}
if (internalData._keyCtx) {
const type = 'body';
const params = { source: 'table', type, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt, keyboard: true, columns: visibleColumn.slice(0), $event: evnt };
// 如果开启单元格区域
if (mouseConfig && mouseOpts.area) {
const activeArea = $xeTable.getActiveCellArea();
if (activeArea && activeArea.row && activeArea.column) {
params.row = activeArea.row;
params.column = activeArea.column;
handleOpenMenuEvent(evnt, type, params);
return;
}
}
else if (mouseConfig && mouseOpts.selected) {
// 如果启用键盘导航且已选中单元格
if (selected.row && selected.column) {
params.row = selected.row;
params.column = selected.column;
handleOpenMenuEvent(evnt, type, params);
return;
}
}
}
// 分别匹配表尾、内容、表尾的快捷菜单
for (let index = 0; index < layoutList.length; index++) {
const layout = layoutList[index];
const columnTargetNode = getEventTargetNode(evnt, el, `vxe-${layout}--column`, (target) => {
// target=td|th,直接向上找 table 去匹配即可
return target.parentNode.parentNode.parentNode.getAttribute('xid') === xID;
});
const params = { source: 'table', type: layout, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt, columns: visibleColumn.slice(0), $event: evnt };
if (columnTargetNode.flag) {
const cell = columnTargetNode.targetElem;
const columnNodeRest = $xeTable.getColumnNode(cell);
const column = columnNodeRest ? columnNodeRest.item : null;
let typePrefix = `${layout}-`;
if (column) {
Object.assign(params, { column, columnIndex: $xeTable.getColumnIndex(column), cell });
}
if (layout === 'body') {
const rowNodeRest = $xeTable.getRowNode(cell.parentNode);
const row = rowNodeRest ? rowNodeRest.item : null;
typePrefix = '';
if (row) {
params.row = row;
params.rowIndex = $xeTable.getRowIndex(row);
}
}
const eventType = `${typePrefix}cell-menu`;
handleOpenMenuEvent(evnt, layout, params);
$xeTable.dispatchEvent(eventType, params, evnt);
return;
}
else if (getEventTargetNode(evnt, el, `vxe-table--${layout}-wrapper`, target => target.getAttribute('xid') === xID).flag || (layout === 'body' && getEventTargetNode(evnt, el, 'vxe-table--empty-place-wrapper', target => target.getAttribute('xid') === xID).flag)) {
if (menuOpts.trigger === 'cell') {
evnt.preventDefault();
}
else {
handleOpenMenuEvent(evnt, layout, params);
}
return;
}
}
}
if (tableFilter && !getEventTargetNode(evnt, tableFilter.getRefMaps().refElem.value).flag) {
$xeTable.closeFilter();
}
menuMethods.closeMenu();
},
ctxMenuMouseoverEvent(evnt, item, child) {
const menuElem = evnt.currentTarget;
const { ctxMenuStore } = reactData;
evnt.preventDefault();
evnt.stopPropagation();
ctxMenuStore.selected = item;
ctxMenuStore.selectChild = child;
if (!child) {
ctxMenuStore.showChild = hasChildrenList(item);
if (ctxMenuStore.showChild) {
nextTick(() => {
const childWrapperElem = menuElem.nextElementSibling;
if (childWrapperElem) {
const { boundingTop, boundingLeft, visibleHeight, visibleWidth } = getAbsolutePos(menuElem);
const posTop = boundingTop + menuElem.offsetHeight;
const posLeft = boundingLeft + menuElem.offsetWidth;
let left = '';
let right = '';
// 是否超出右侧
if (posLeft + childWrapperElem.offsetWidth > visibleWidth - 10) {
left = 'auto';
right = `${menuElem.offsetWidth}px`;
}
// 是否超出底部
let top = '';
let bottom = '';
if (posTop + childWrapperElem.offsetHeight > visibleHeight - 10) {
top = 'auto';
bottom = '0';
}
childWrapperElem.style.left = left;
childWrapperElem.style.right = right;
childWrapperElem.style.top = top;
childWrapperElem.style.bottom = bottom;
}
});
}
}
},
ctxMenuMouseoutEvent(evnt, item) {
const { ctxMenuStore } = reactData;
if (!item.children) {
ctxMenuStore.selected = null;
}
ctxMenuStore.selectChild = null;
},
/**
* 快捷菜单点击事件
*/
ctxMenuLinkEvent(evnt, menu) {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
// 如果一级菜单有配置 code 则允许点击,否则不能点击
if (!menu.loading && !menu.disabled && (menu.code || !menu.children || !menu.children.length)) {
const gMenuOpts = menus.get(menu.code);
const params = Object.assign({}, internalData._currMenuParams, { menu, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt, $event: evnt });
const tmMethod = gMenuOpts ? (gMenuOpts.tableMenuMethod || gMenuOpts.menuMethod) : null;
if (tmMethod) {
tmMethod(params, evnt);
}
$xeTable.dispatchEvent('menu-click', params, evnt);
menuMethods.closeMenu();
}
}
};
return Object.assign(Object.assign({}, menuMethods), menuPrivateMethods);
},
setupGrid($xeGrid) {
return $xeGrid.extendTableMethods(tableMenuMethodKeys);
},
setupGantt($xeGantt) {
return $xeGantt.extendTableMethods(tableMenuMethodKeys);
}
});
const { warnLog: warnLog$5, errLog: errLog$6 } = createComponentLog('table');
const { getConfig: getConfig$5, renderer: renderer$4, hooks: hooks$5, getI18n: getI18n$5 } = VxeUI;
const tableEditMethodKeys = ['insert', 'insertAt', 'insertNextAt', 'insertChild', 'insertChildAt', 'insertChildNextAt', 'remove', 'removeCheckboxRow', 'removeRadioRow', 'removeCurrentRow', 'getRecordset', 'getInsertRecords', 'getRemoveRecords', 'getUpdateRecords', 'getEditRecord', 'getActiveRecord', 'getEditCell', 'getSelectedCell', 'clearEdit', 'clearActived', 'clearSelected', 'isEditByRow', 'isActiveByRow', 'setEditRow', 'setActiveRow', 'setEditCell', 'setActiveCell', 'setSelectCell'];
hooks$5.add('tableEditModule', {
setupTable($xeTable) {
const { props, reactData, internalData } = $xeTable;
const { refElem } = $xeTable.getRefMaps();
const { computeMouseOpts, computeEditOpts, computeCheckboxOpts, computeTreeOpts, computeValidOpts } = $xeTable.getComputeMaps();
const browseObj = XEUtils.browse();
let editMethods = {};
let editPrivateMethods = {};
const getEditColumnModel = (row, column) => {
const { model, editRender } = column;
if (editRender) {
model.value = getCellValue(row, column);
model.update = false;
}
};
const setEditColumnModel = (row, column) => {
const { model, editRender } = column;
if (editRender && model.update) {
setCellValue(row, column, model.value);
model.update = false;
model.value = null;
}
};
const removeCellSelectedClass = () => {
const el = refElem.value;
if (el) {
const cell = el.querySelector('.col--selected');
if (cell) {
removeClass(cell, 'col--selected');
}
}
};
const syncActivedCell = () => {
const { editStore, tableColumn } = reactData;
const editOpts = computeEditOpts.value;
const { actived } = editStore;
const { row, column } = actived;
if (row && column) {
if (editOpts.mode === 'row') {
tableColumn.forEach((column) => setEditColumnModel(row, column));
}
else {
setEditColumnModel(row, column);
}
}
};
const insertTreeRow = (newRecords, isAppend) => {
const { tableFullTreeData, afterFullData, fullDataRowIdData, fullAllDataRowIdData } = internalData;
const treeOpts = computeTreeOpts.value;
const { rowField, parentField, mapChildrenField } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
const funcName = isAppend ? 'push' : 'unshift';
newRecords.forEach(item => {
const parentRowId = item[parentField];
const rowid = getRowid($xeTable, item);
const matchObj = parentRowId ? XEUtils.findTree(tableFullTreeData, item => parentRowId === item[rowField], { children: mapChildrenField }) : null;
if (matchObj) {
const { item: parentRow } = matchObj;
const parentRest = fullAllDataRowIdData[getRowid($xeTable, parentRow)];
const parentLevel = parentRest ? parentRest.level : 0;
let pChilds = parentRow[childrenField];
let pMapChilds = parentRow[mapChildrenField];
if (!XEUtils.isArray(pChilds)) {
pChilds = parentRow[childrenField] = [];
}
if (!XEUtils.isArray(pMapChilds)) {
pMapChilds = parentRow[mapChildrenField] = [];
}
pChilds[funcName](item);
pMapChilds[funcName](item);
const rest = { row: item, rowid, _seq: -1, seq: -1, index: -1, _index: -1, $index: -1, treeIndex: -1, _tIndex: -1, items: pChilds, parent: parentRow, level: parentLevel + 1, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 };
fullDataRowIdData[rowid] = rest;
fullAllDataRowIdData[rowid] = rest;
}
else {
if (parentRowId) {
warnLog$5('vxe.error.unableInsert');
}
afterFullData[funcName](item);
tableFullTreeData[funcName](item);
const rest = { row: item, rowid, _seq: -1, seq: -1, index: -1, _index: -1, $index: -1, treeIndex: -1, _tIndex: -1, items: tableFullTreeData, parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 };
fullDataRowIdData[rowid] = rest;
fullAllDataRowIdData[rowid] = rest;
}
});
};
// const insertGroupRow = (newRecords: any[], isAppend: boolean) => {
// }
const handleInsertRowAt = (records, targetRowOrRowid, isInsertNextRow) => {
const { treeConfig } = props;
const { isRowGroupStatus } = reactData;
const { tableFullTreeData, afterFullData, mergeBodyList, tableFullData, fullDataRowIdData, fullAllDataRowIdData, insertRowMaps, removeRowMaps } = internalData;
const treeOpts = computeTreeOpts.value;
const { transform, parentField, rowField, mapChildrenField } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
if (!XEUtils.isArray(records)) {
records = [records];
}
let targetRow = targetRowOrRowid;
if (XEUtils.isString(targetRowOrRowid) || XEUtils.isNumber(targetRowOrRowid)) {
const rowRest = fullAllDataRowIdData[targetRowOrRowid];
if (rowRest) {
targetRow = rowRest.row;
}
}
if (!records.length) {
return Promise.resolve({ row: null, rows: [] });
}
$xeTable.handlePushStack();
const newRecords = reactive($xeTable.defineField(records.map((record) => Object.assign(treeConfig && transform ? { [mapChildrenField]: [], [childrenField]: [] } : {}, record))));
let treeRecords = [];
if (treeConfig && transform) {
treeRecords = XEUtils.toArrayTree(newRecords, { key: rowField, parentKey: parentField, children: childrenField });
}
if (XEUtils.eqNull(targetRow)) {
// 如果为虚拟树
if (treeConfig && transform) {
insertTreeRow(newRecords, false);
}
else if (isRowGroupStatus) {
// 如果分组
if (treeConfig) {
throw new Error(getI18n$5('vxe.error.noTree', ['insert']));
}
errLog$6(getI18n$5('vxe.error.noGroup', ['insert']));
// insertGroupRow(newRecords, false)
}
else {
newRecords.forEach(item => {
const rowid = getRowid($xeTable, item);
const rest = { row: item, rowid, _seq: -1, seq: -1, index: -1, _index: -1, $index: -1, treeIndex: -1, _tIndex: -1, items: afterFullData, parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 };
fullDataRowIdData[rowid] = rest;
fullAllDataRowIdData[rowid] = rest;
afterFullData.unshift(item);
tableFullData.unshift(item);
});
// 刷新单元格合并
mergeBodyList.forEach((mergeItem) => {
const { row: mergeRowIndex } = mergeItem;
if (mergeRowIndex >= 0) {
mergeItem.row = mergeRowIndex + newRecords.length;
}
});
}
}
else {
if (targetRow === -1) {
// 如果为虚拟树
if (treeConfig && transform) {
insertTreeRow(newRecords, true);
}
else if (isRowGroupStatus) {
// 如果分组
if (treeConfig) {
throw new Error(getI18n$5('vxe.error.noTree', ['insert']));
}
errLog$6(getI18n$5('vxe.error.noGroup', ['insert']));
// insertGroupRow(newRecords, true)
}
else {
newRecords.forEach(item => {
const rowid = getRowid($xeTable, item);
const rest = { row: item, rowid, _seq: -1, seq: -1, index: -1, _index: -1, treeIndex: -1, _tIndex: -1, $index: -1, items: afterFullData, parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 };
fullDataRowIdData[rowid] = rest;
fullAllDataRowIdData[rowid] = rest;
afterFullData.push(item);
tableFullData.push(item);
});
}
}
else {
// 如果为虚拟树
if (treeConfig && transform) {
const matchMapObj = XEUtils.findTree(tableFullTreeData, item => targetRow[rowField] === item[rowField], { children: mapChildrenField });
if (matchMapObj) {
const { parent: parentRow } = matchMapObj;
const parentMapChilds = parentRow ? parentRow[mapChildrenField] : tableFullTreeData;
const parentRest = fullAllDataRowIdData[getRowid($xeTable, parentRow)];
const parentLevel = parentRest ? parentRest.level : 0;
treeRecords.forEach((row, i) => {
if (parentRow) {
if (row[parentField] !== parentRow[rowField]) {
errLog$6('vxe.error.errProp', [`${parentField}=${row[parentField]}`, `${parentField}=${parentRow[rowField]}`]);
row[parentField] = parentRow[rowField];
}
}
else {
if (row[parentField] !== null) {
if (!XEUtils.eqNull(row[parentField])) {
errLog$6('vxe.error.errProp', [`${parentField}=${row[parentField]}`, 'null']);
}
row[parentField] = null;
}
}
let targetIndex = matchMapObj.index + i;
if (isInsertNextRow) {
targetIndex = targetIndex + 1;
}
parentMapChilds.splice(targetIndex, 0, row);
});
XEUtils.eachTree(treeRecords, (item) => {
const rowid = getRowid($xeTable, item);
const rest = { row: item, rowid, _seq: -1, seq: -1, index: -1, _index: -1, $index: -1, treeIndex: -1, _tIndex: -1, items: parentMapChilds, parent: parentRow, level: parentLevel + 1, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 };
if (item[childrenField]) {
item[mapChildrenField] = item[childrenField];
}
fullDataRowIdData[rowid] = rest;
fullAllDataRowIdData[rowid] = rest;
}, { children: childrenField });
// 源
if (parentRow) {
const matchObj = XEUtils.findTree(tableFullTreeData, item => targetRow[rowField] === item[rowField], { children: childrenField });
if (matchObj) {
const parentChilds = matchObj.items;
let targetIndex = matchObj.index;
if (isInsertNextRow) {
targetIndex = targetIndex + 1;
}
parentChilds.splice(targetIndex, 0, ...treeRecords);
}
}
}
else {
warnLog$5('vxe.error.unableInsert');
insertTreeRow(newRecords, true);
}
}
else if (isRowGroupStatus) {
// 如果分组
if (treeConfig) {
throw new Error(getI18n$5('vxe.error.noTree', ['insert']));
}
errLog$6(getI18n$5('vxe.error.noGroup', ['insert']));
}
else {
if (treeConfig) {
throw new Error(getI18n$5('vxe.error.noTree', ['insert']));
}
let afIndex = -1;
// 如果是可视索引
if (XEUtils.isNumber(targetRow)) {
if (targetRow < afterFullData.length) {
afIndex = targetRow;
}
}
else {
afIndex = $xeTable.findRowIndexOf(afterFullData, targetRow);
}
// 如果是插入指定行的下一行
if (isInsertNextRow) {
afIndex = Math.min(afterFullData.length, afIndex + 1);
}
if (afIndex === -1) {
throw new Error(getI18n$5('vxe.error.unableInsert'));
}
afterFullData.splice(afIndex, 0, ...newRecords);
const tfIndex = $xeTable.findRowIndexOf(tableFullData, targetRow);
if (tfIndex > -1) {
tableFullData.splice(tfIndex + (isInsertNextRow ? 1 : 0), 0, ...newRecords);
}
else {
tableFullData.push(...newRecords);
}
// 刷新单元格合并
mergeBodyList.forEach((mergeItem) => {
const { row: mergeRowIndex, rowspan: mergeRowspan } = mergeItem;
if (mergeRowIndex >= afIndex) {
mergeItem.row = mergeRowIndex + newRecords.length;
}
else if (isInsertNextRow ? (mergeRowIndex + mergeRowspan >= afIndex) : (mergeRowIndex + mergeRowspan > afIndex)) {
mergeItem.rowspan = mergeRowspan + newRecords.length;
}
});
}
}
}
const handleStatus = (newRow) => {
const rowid = getRowid($xeTable, newRow);
// 如果是被删除的数据,则还原状态
if (removeRowMaps[rowid]) {
delete removeRowMaps[rowid];
if (insertRowMaps[rowid]) {
delete insertRowMaps[rowid];
}
}
else {
insertRowMaps[rowid] = newRow;
}
};
// 如果为虚拟树
if (treeConfig && transform) {
XEUtils.eachTree(treeRecords, handleStatus, { children: mapChildrenField });
}
else {
newRecords.forEach(handleStatus);
}
reactData.removeRowFlag++;
reactData.insertRowFlag++;
$xeTable.cacheRowMap(false);
$xeTable.updateScrollYStatus();
$xeTable.handleTableData(treeConfig && transform);
if (!(treeConfig && transform)) {
$xeTable.updateAfterDataIndex();
}
$xeTable.updateFooter();
$xeTable.handleUpdateBodyMerge();
$xeTable.checkSelectionStatus();
if (reactData.scrollYLoad) {
$xeTable.updateScrollYSpace();
}
return nextTick().then(() => {
$xeTable.updateCellAreas();
return $xeTable.recalculate(true);
}).then(() => {
return {
row: newRecords.length ? newRecords[newRecords.length - 1] : null,
rows: newRecords
};
});
};
const handleInsertChildRowAt = (records, parentRowOrParentId, targetRow, isInsertNextRow) => {
const { treeConfig } = props;
const { fullAllDataRowIdData } = internalData;
const treeOpts = computeTreeOpts.value;
const { transform, rowField, parentField } = treeOpts;
if (treeConfig && transform) {
if (!XEUtils.isArray(records)) {
records = [records];
}
let parentRow = parentRowOrParentId;
if (XEUtils.isString(parentRowOrParentId) || XEUtils.isNumber(parentRowOrParentId)) {
const rowRest = fullAllDataRowIdData[parentRowOrParentId];
if (rowRest) {
parentRow = rowRest.row;
}
}
return handleInsertRowAt(records.map((item) => Object.assign({}, item, { [parentField]: parentRow[rowField] })), targetRow, isInsertNextRow);
}
else {
errLog$6('vxe.error.errProp', ['tree-config.transform=false', 'tree-config.transform=true']);
}
return Promise.resolve({ row: null, rows: [] });
};
const handleClearEdit = (evnt, targetRow) => {
const { editStore } = reactData;
const { actived, focused } = editStore;
const { row, column } = actived;
const validOpts = computeValidOpts.value;
if (row || column) {
if (targetRow && getRowid($xeTable, targetRow) !== getRowid($xeTable, row)) {
return nextTick();
}
syncActivedCell();
$xeTable.updateFooter();
actived.args = null;
actived.row = null;
actived.column = null;
$xeTable.dispatchEvent('edit-closed', {
row,
rowIndex: $xeTable.getRowIndex(row),
$rowIndex: $xeTable.getVMRowIndex(row),
column,
columnIndex: $xeTable.getColumnIndex(column),
$columnIndex: $xeTable.getVMColumnIndex(column)
}, evnt || null);
}
focused.row = null;
focused.column = null;
if (validOpts.autoClear) {
if (validOpts.msgMode !== 'full' || getConfig$5().cellVaildMode === 'obsolete') {
if ($xeTable.clearValidate) {
return $xeTable.clearValidate();
}
}
}
return nextTick().then(() => $xeTable.updateCellAreas());
};
const handleEditActive = (params, evnt, options) => {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const { editConfig, mouseConfig } = props;
const { editStore, tableColumn } = reactData;
const editOpts = computeEditOpts.value;
const { mode } = editOpts;
const { actived, focused } = editStore;
const { row, column } = params;
const { editRender } = column;
const { isFocus, isPos, isClear } = options;
const cell = (params.cell || $xeTable.getCellElement(row, column));
const beforeEditMethod = editOpts.beforeEditMethod || editOpts.activeMethod;
const editParams = Object.assign(Object.assign({}, params), { cell });
if (cell && isEnableConf(editConfig) && isEnableConf(editRender)) {
// 激活编辑
if (!$xeTable.isPendingByRow(row) && !$xeTable.isAggregateRecord(row)) {
if (actived.row !== row || (mode === 'cell' ? actived.column !== column : false)) {
// 判断是否禁用编辑
let type = 'edit-disabled';
if (!beforeEditMethod || beforeEditMethod(Object.assign(Object.assign({}, editParams), { $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt }))) {
if (mouseConfig) {
$xeTable.clearSelected();
if ($xeTable.clearCellAreas) {
$xeTable.clearCellAreas();
$xeTable.clearCopyCellArea();
}
}
$xeTable.closeTooltip();
if (actived.column) {
handleClearEdit(evnt);
}
type = 'edit-activated';
column.renderHeight = cell.offsetHeight;
actived.args = editParams;
actived.row = row;
actived.column = column;
$xeTable.handlePushStack();
if (isClear) {
setCellValue(row, column, null);
}
if (mode === 'row') {
tableColumn.forEach((column) => getEditColumnModel(row, column));
}
else {
getEditColumnModel(row, column);
}
const afterEditMethod = editOpts.afterEditMethod;
nextTick(() => {
if (isFocus) {
$xeTable.handleFocus(editParams, evnt);
}
if (afterEditMethod) {
afterEditMethod(Object.assign(Object.assign({}, editParams), { $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt }));
}
});
}
$xeTable.dispatchEvent(type, {
row,
rowIndex: $xeTable.getRowIndex(row),
$rowIndex: $xeTable.getVMRowIndex(row),
column,
columnIndex: $xeTable.getColumnIndex(column),
$columnIndex: $xeTable.getVMColumnIndex(column)
}, evnt);
// v4已废弃
if (type === 'edit-activated') {
$xeTable.dispatchEvent('edit-actived', {
row,
rowIndex: $xeTable.getRowIndex(row),
$rowIndex: $xeTable.getVMRowIndex(row),
column,
columnIndex: $xeTable.getColumnIndex(column),
$columnIndex: $xeTable.getVMColumnIndex(column)
}, evnt);
}
}
else {
const { column: oldColumn } = actived;
if (mouseConfig) {
$xeTable.clearSelected();
if ($xeTable.clearCellAreas) {
$xeTable.clearCellAreas();
$xeTable.clearCopyCellArea();
}
}
if (oldColumn && oldColumn !== column) {
const { model: oldModel } = oldColumn;
if (oldModel.update) {
setCellValue(row, oldColumn, oldModel.value);
}
if ($xeTable.clearValidate) {
$xeTable.clearValidate(row, column);
}
}
column.renderHeight = cell.offsetHeight;
actived.args = editParams;
actived.column = column;
if (isPos) {
setTimeout(() => {
$xeTable.handleFocus(editParams, evnt);
});
}
}
focused.column = null;
focused.row = null;
$xeTable.focus();
}
}
return nextTick();
};
const handleEditCell = (row, fieldOrColumn, options) => {
const { editConfig } = props;
const { isPos } = options;
const column = XEUtils.isString(fieldOrColumn) ? $xeTable.getColumnByField(fieldOrColumn) : fieldOrColumn;
if (row && column && isEnableConf(editConfig) && isEnableConf(column.editRender) && !$xeTable.isAggregateRecord(row)) {
return Promise.resolve(isPos ? $xeTable.scrollToRow(row, column) : null).then(() => {
const cell = $xeTable.getCellElement(row, column);
if (cell) {
handleEditActive({
row,
rowIndex: $xeTable.getRowIndex(row),
$rowIndex: $xeTable.getVMRowIndex(row),
_rowIndex: $xeTable.getVTRowIndex(row),
column,
columnIndex: $xeTable.getColumnIndex(column),
$columnIndex: $xeTable.getVMColumnIndex(column),
_columnIndex: $xeTable.getVTColumnIndex(column),
cell,
$table: $xeTable
}, null, {
isFocus: isPos,
isPos
});
internalData._lastCallTime = Date.now();
}
return nextTick();
});
}
return nextTick();
};
editMethods = {
/**
* 往表格中插入临时数据
*
* @param {*} records
*/
insert(records) {
return handleInsertRowAt(records, null);
},
/**
* 往表格指定行中插入临时数据
* 如果 row 为空则从插入到顶部,如果为树结构,则插入到目标节点顶部
* 如果 row 为 -1 则从插入到底部,如果为树结构,则插入到目标节点底部
* 如果 row 为有效行则插入到该行的位置,如果为树结构,则有插入到效的目标节点该行的位置
*/
insertAt(records, targetRowOrRowid) {
return handleInsertRowAt(records, targetRowOrRowid);
},
insertNextAt(records, targetRowOrRowid) {
return handleInsertRowAt(records, targetRowOrRowid, true);
},
insertChild(records, parentRowOrParentId) {
return handleInsertChildRowAt(records, parentRowOrParentId, null);
},
insertChildAt(records, parentRowOrParentId, targetRow) {
return handleInsertChildRowAt(records, parentRowOrParentId, targetRow);
},
insertChildNextAt(records, parentRowOrParentId, targetRow) {
return handleInsertChildRowAt(records, parentRowOrParentId, targetRow, true);
},
/**
* 删除指定行数据
* 如果传 row 则删除一行
* 如果传 rows 则删除多行
* 如果为空则删除所有
*/
remove(rows) {
const { treeConfig } = props;
const { editStore, isRowGroupStatus } = reactData;
const { tableFullTreeData, selectCheckboxMaps, afterFullData, mergeBodyList, tableFullData, pendingRowMaps, insertRowMaps, removeRowMaps } = internalData;
const checkboxOpts = computeCheckboxOpts.value;
const treeOpts = computeTreeOpts.value;
const { transform, mapChildrenField } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
const { actived } = editStore;
const { checkField } = checkboxOpts;
let delList = [];
if (!rows) {
rows = tableFullData;
}
else if (!XEUtils.isArray(rows)) {
rows = [rows];
}
if (!rows.length) {
return Promise.resolve({ row: null, rows: [] });
}
$xeTable.handlePushStack();
// 如果是新增,则保存记录
rows.forEach((row) => {
if (!$xeTable.isInsertByRow(row)) {
const rowid = getRowid($xeTable, row);
removeRowMaps[rowid] = row;
}
});
// 如果绑定了多选属性,则更新状态
if (!checkField) {
rows.forEach((row) => {
const rowid = getRowid($xeTable, row);
if (selectCheckboxMaps[rowid]) {
delete selectCheckboxMaps[rowid];
}
});
reactData.updateCheckboxFlag++;
}
// 从数据源中移除
if (tableFullData === rows) {
rows = delList = tableFullData.slice(0);
internalData.tableFullData = [];
internalData.afterFullData = [];
$xeTable.clearMergeCells();
}
else {
// 如果为虚拟树
if (treeConfig && transform) {
rows.forEach((row) => {
const rowid = getRowid($xeTable, row);
const matchMapObj = XEUtils.findTree(tableFullTreeData, item => rowid === getRowid($xeTable, item), { children: mapChildrenField });
if (matchMapObj) {
const rItems = matchMapObj.items.splice(matchMapObj.index, 1);
delList.push(rItems[0]);
}
const matchObj = XEUtils.findTree(tableFullTreeData, item => rowid === getRowid($xeTable, item), { children: childrenField });
if (matchObj) {
matchObj.items.splice(matchObj.index, 1);
}
const afIndex = $xeTable.findRowIndexOf(afterFullData, row);
if (afIndex > -1) {
afterFullData.splice(afIndex, 1);
}
});
}
else if (isRowGroupStatus) {
// 如果分组
warnLog$5(getI18n$5('vxe.error.noGroup', ['remove']));
}
else {
rows.forEach((row) => {
const tfIndex = $xeTable.findRowIndexOf(tableFullData, row);
if (tfIndex > -1) {
const rItems = tableFullData.splice(tfIndex, 1);
delList.push(rItems[0]);
}
const afIndex = $xeTable.findRowIndexOf(afterFullData, row);
if (afIndex > -1) {
// 刷新单元格合并
mergeBodyList.forEach((mergeItem) => {
const { row: mergeRowIndex, rowspan: mergeRowspan } = mergeItem;
if (mergeRowIndex > afIndex) {
mergeItem.row = mergeRowIndex - 1;
}
else if (mergeRowIndex + mergeRowspan > afIndex) {
mergeItem.rowspan = mergeRowspan - 1;
}
});
afterFullData.splice(afIndex, 1);
}
});
}
}
// 如果当前行被激活编辑,则清除激活状态
if (actived.row && $xeTable.findRowIndexOf(rows, actived.row) > -1) {
editMethods.clearEdit();
}
// 从新增中移除已删除的数据
rows.forEach((row) => {
const rowid = getRowid($xeTable, row);
if (insertRowMaps[rowid]) {
delete insertRowMaps[rowid];
}
if (pendingRowMaps[rowid]) {
delete pendingRowMaps[rowid];
}
});
reactData.removeRowFlag++;
reactData.insertRowFlag++;
reactData.pendingRowFlag++;
$xeTable.cacheRowMap(false);
$xeTable.handleTableData(treeConfig && transform);
$xeTable.updateFooter();
$xeTable.handleUpdateBodyMerge();
if (!(treeConfig && transform)) {
$xeTable.updateAfterDataIndex();
}
$xeTable.checkSelectionStatus();
if (reactData.scrollYLoad) {
$xeTable.updateScrollYSpace();
}
return nextTick().then(() => {
$xeTable.updateCellAreas();
return $xeTable.recalculate(true);
}).then(() => {
return { row: delList.length ? delList[delList.length - 1] : null, rows: delList };
});
},
/**
* 删除复选框选中的数据
*/
removeCheckboxRow() {
return editMethods.remove($xeTable.getCheckboxRecords()).then((params) => {
$xeTable.clearCheckboxRow();
return params;
});
},
/**
* 删除单选框选中的数据
*/
removeRadioRow() {
const radioRecord = $xeTable.getRadioRecord();
return editMethods.remove(radioRecord || []).then((params) => {
$xeTable.clearRadioRow();
return params;
});
},
/**
* 删除当前行选中的数据
*/
removeCurrentRow() {
const currentRecord = $xeTable.getCurrentRecord();
return editMethods.remove(currentRecord || []).then((params) => {
$xeTable.clearCurrentRow();
return params;
});
},
/**
* 获取表格数据集,包含新增、删除、修改、标记
*/
getRecordset() {
const removeRecords = editMethods.getRemoveRecords();
const pendingRecords = $xeTable.getPendingRecords();
const delRecords = removeRecords.concat(pendingRecords);
// 如果已经被删除,则无需放到更新数组
const updateRecords = editMethods.getUpdateRecords().filter(row => {
return !delRecords.some(item => $xeTable.eqRow(item, row));
});
return {
insertRecords: editMethods.getInsertRecords(),
removeRecords,
updateRecords,
pendingRecords
};
},
/**
* 获取新增的临时数据
*/
getInsertRecords() {
const { fullAllDataRowIdData, insertRowMaps } = internalData;
const insertRecords = [];
XEUtils.each(insertRowMaps, (row, rowid) => {
if (fullAllDataRowIdData[rowid]) {
insertRecords.push(row);
}
});
return insertRecords;
},
/**
* 获取已删除的数据
*/
getRemoveRecords() {
const { removeRowMaps } = internalData;
const removeRecords = [];
XEUtils.each(removeRowMaps, (row) => {
removeRecords.push(row);
});
return removeRecords;
},
/**
* 获取更新数据
* 只精准匹配 row 的更改
* 如果是树表格,子节点更改状态不会影响父节点的更新状态
*/
getUpdateRecords() {
const { keepSource, treeConfig } = props;
const { tableFullData, tableFullTreeData } = internalData;
const treeOpts = computeTreeOpts.value;
const updateRecords = [];
if (keepSource) {
syncActivedCell();
if (treeConfig) {
const childrenField = treeOpts.children || treeOpts.childrenField;
XEUtils.eachTree(tableFullTreeData, row => {
if ($xeTable.isUpdateByRow(row)) {
updateRecords.push(row);
}
}, { children: childrenField });
}
else {
tableFullData.forEach((row) => {
if ($xeTable.isUpdateByRow(row)) {
updateRecords.push(row);
}
});
}
}
return updateRecords;
},
getActiveRecord() {
warnLog$5('vxe.error.delFunc', ['getActiveRecord', 'getEditCell']);
const { editStore } = reactData;
const { fullAllDataRowIdData } = internalData;
const { args, row } = editStore.actived;
if (args && row && fullAllDataRowIdData[getRowid($xeTable, row)]) {
return Object.assign({}, args, { row });
}
return null;
},
getEditRecord() {
warnLog$5('vxe.error.delFunc', ['getEditRecord', 'getEditCell']);
const { editStore } = reactData;
const { fullAllDataRowIdData } = internalData;
const { args, row } = editStore.actived;
if (args && row && fullAllDataRowIdData[getRowid($xeTable, row)]) {
return Object.assign({}, args, { row });
}
return null;
},
getEditCell() {
const { editStore } = reactData;
const { row, column } = editStore.actived;
if (column && row) {
return {
row,
rowIndex: $xeTable.getRowIndex(row),
column,
columnIndex: $xeTable.getColumnIndex(column)
};
}
return null;
},
/**
* 获取选中的单元格
*/
getSelectedCell() {
const { editStore } = reactData;
const { row, column } = editStore.selected;
if (row && column) {
return {
row,
column
};
}
return null;
},
clearActived(row) {
// 即将废弃
warnLog$5('vxe.error.delFunc', ['clearActived', 'clearEdit']);
return $xeTable.clearEdit(row);
},
/**
* 清除激活的编辑
*/
clearEdit(row) {
return handleClearEdit(null, row);
},
/**
* 清除所选中源状态
*/
clearSelected() {
const { editStore } = reactData;
const { selected } = editStore;
selected.row = null;
selected.column = null;
removeCellSelectedClass();
return nextTick();
},
isActiveByRow(row) {
warnLog$5('vxe.error.delFunc', ['isActiveByRow', 'isEditByRow']);
// 即将废弃
return $xeTable.isEditByRow(row);
},
/**
* 判断行是否为激活编辑状态
* @param {Row} row 行对象
*/
isEditByRow(row) {
const { editStore } = reactData;
return editStore.actived.row === row;
},
setActiveRow(row) {
warnLog$5('vxe.error.delFunc', ['setActiveRow', 'setEditRow']);
// 即将废弃
return editMethods.setEditRow(row);
},
/**
* 激活行编辑
*/
setEditRow(row, fieldOrColumn, options) {
const { visibleColumn } = internalData;
let column = XEUtils.find(visibleColumn, column => isEnableConf(column.editRender));
let isPos = false;
if (fieldOrColumn) {
isPos = true;
if (fieldOrColumn !== true) {
column = XEUtils.isString(fieldOrColumn) ? $xeTable.getColumnByField(fieldOrColumn) : fieldOrColumn;
}
}
return handleEditCell(row, column, Object.assign({
isPos,
isFocus: isPos
}, options));
},
setActiveCell(row, fieldOrColumn) {
warnLog$5('vxe.error.delFunc', ['setActiveCell', 'setEditCell']);
// 即将废弃
return editMethods.setEditCell(row, fieldOrColumn);
},
/**
* 激活单元格编辑
*/
setEditCell(row, fieldOrColumn, options) {
return handleEditCell(row, fieldOrColumn, Object.assign({
isFocus: true,
isPos: true
}, options));
},
/**
* 只对 trigger=dblclick 有效,选中单元格
*/
setSelectCell(row, fieldOrColumn) {
const { tableData } = reactData;
const editOpts = computeEditOpts.value;
const column = XEUtils.isString(fieldOrColumn) ? $xeTable.getColumnByField(fieldOrColumn) : fieldOrColumn;
if (row && column && editOpts.trigger !== 'manual') {
const rowIndex = $xeTable.findRowIndexOf(tableData, row);
if (rowIndex > -1 && column) {
const cell = $xeTable.getCellElement(row, column);
const params = {
$table: $xeTable,
row,
rowIndex,
$rowIndex: $xeTable.getVMRowIndex(row),
_rowIndex: $xeTable.getVTRowIndex(row),
column,
columnIndex: $xeTable.getColumnIndex(column),
$columnIndex: $xeTable.getVMColumnIndex(column),
_columnIndex: $xeTable.getVTColumnIndex(column),
cell
};
$xeTable.handleSelected(params, null);
}
}
return nextTick();
}
};
const handleCellFocus = (cell, params) => {
const { editConfig } = props;
const { column } = params;
const { editRender } = column;
const editOpts = computeEditOpts.value;
if (editConfig && isEnableConf(editRender)) {
const compRender = renderer$4.get(editRender.name);
let autoFocus = editRender.autofocus || editRender.autoFocus;
let autoSelect = editRender.autoSelect || editRender.autoselect;
let inputElem = null;
// 是否启用聚焦
if (editOpts.autoFocus) {
if (!autoFocus && compRender) {
autoFocus = compRender.tableAutoFocus || compRender.tableAutofocus || compRender.autofocus;
}
if (!autoSelect && compRender) {
autoSelect = compRender.tableAutoSelect || compRender.autoselect;
}
// 如果指定了聚焦 class
if (XEUtils.isFunction(autoFocus)) {
inputElem = autoFocus(params);
}
else if (autoFocus) {
if (autoFocus === true) {
// 自动匹配模式,会自动匹配第一个可输入元素
inputElem = cell.querySelector('input,textarea');
}
else {
inputElem = cell.querySelector(autoFocus);
}
if (inputElem) {
inputElem.focus();
}
}
}
return inputElem;
}
return null;
};
editPrivateMethods = {
/**
* 处理激活编辑
*/
handleEdit(params, evnt, options) {
return handleEditActive(params, evnt, Object.assign({
isFocus: true,
isPos: true
}, options));
},
/**
* @deprecated
*/
handleActived(params, evnt) {
return editPrivateMethods.handleEdit(params, evnt);
},
/**
* 处理取消编辑
* @param evnt
* @returns
*/
handleClearEdit,
handleCellFocus,
/**
* 处理聚焦
*/
handleFocus(params) {
const { row, column, cell } = params;
const { editRender } = column;
const editOpts = computeEditOpts.value;
if (isEnableConf(editRender)) {
const autoSelect = editRender.autoSelect || editRender.autoselect;
const inputElem = handleCellFocus(cell, params);
if (inputElem) {
if (autoSelect) {
inputElem.select();
}
else {
// 保持一致行为,光标移到末端
if (browseObj.msie) {
const textRange = inputElem.createTextRange();
textRange.collapse(false);
textRange.select();
}
}
}
else {
// 是否自动定位
if (editOpts.autoPos) {
if (!column.fixed) {
// 显示到可视区中
$xeTable.scrollToRow(row, column);
}
}
}
}
},
/**
* 处理选中源
*/
handleSelected(params, evnt) {
const { mouseConfig, editConfig } = props;
const { editStore } = reactData;
const mouseOpts = computeMouseOpts.value;
const editOpts = computeEditOpts.value;
const { actived, selected } = editStore;
const { row, column } = params;
const isMouseSelected = mouseConfig && mouseOpts.selected;
const selectMethod = () => {
if (isMouseSelected && (selected.row !== row || selected.column !== column)) {
if (actived.row !== row || (editOpts.mode === 'cell' ? actived.column !== column : false)) {
handleClearEdit(evnt);
$xeTable.clearSelected();
if ($xeTable.clearCellAreas) {
$xeTable.clearCellAreas();
$xeTable.clearCopyCellArea();
}
selected.args = params;
selected.row = row;
selected.column = column;
if (isMouseSelected) {
editPrivateMethods.addCellSelectedClass();
}
$xeTable.focus();
// 如果是支持可复用控件
if (editConfig && editOpts.isReuseKeep && isEnableConf(editOpts) && isEnableConf(column.editRender)) {
setTimeout(() => {
const cell = $xeTable.getCellElement(row, column);
if (cell) {
const hasReusekeep = cell.querySelector('.vxe-reusekeep-control');
if (hasReusekeep) {
handleCellFocus(cell, params);
}
}
}, 0);
}
if (evnt) {
$xeTable.dispatchEvent('cell-selected', params, evnt);
}
}
}
return nextTick();
};
return selectMethod();
},
addCellSelectedClass() {
const { editStore } = reactData;
const { selected } = editStore;
const { row, column } = selected;
removeCellSelectedClass();
if (row && column) {
const cell = $xeTable.getCellElement(row, column);
if (cell) {
addClass(cell, 'col--selected');
}
}
}
};
return Object.assign(Object.assign({}, editMethods), editPrivateMethods);
},
setupGrid($xeGrid) {
return $xeGrid.extendTableMethods(tableEditMethodKeys);
},
setupGantt($xeGantt) {
return $xeGantt.extendTableMethods(tableEditMethodKeys);
}
});
// 默认导出或打印的 HTML 样式
const defaultHtmlStyle = 'body{padding:0;color:rgba(0,0,0,0.7);font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,STHeiti,MingLiu}body *{-webkit-box-sizing:border-box;box-sizing:border-box}.vxe-table{border-collapse:collapse;text-align:left;border-spacing:0}.vxe-table.is--default-width,.vxe-table.is--auto-width{width:100%}.vxe-table.is--scale-width{table-layout:fixed}.vxe-table,.vxe-table th,.vxe-table td,.vxe-table td{white-space:pre-line;word-break:break-all;border-color:#D0D0D0;border-style:solid;border-width:0}.border--default,.border--full,.border--outer{border-top-width:1px}.border--default,.border--full,.border--outer{border-left-width:1px}.border--outer,.border--default th,.border--default td,.border--full th,.border--full td,.border--outer th,.border--inner th,.border--inner td{border-bottom-width:1px}.border--default,.border--outer,.border--full th,.border--full td{border-right-width:1px}.border--default th,.border--full th,.border--outer th{background-color:#f8f8f9}.vxe-table td>div,.vxe-table th>div{padding:0.5em 0.4em}.col--center{text-align:center}.col--right{text-align:right}.vxe-table .col--ellipsis>div{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break:break-all}.vxe-table--tree-node{text-align:left}.vxe-table--tree-node-wrapper{position:relative}.vxe-table--tree-icon-wrapper{position:absolute;top:50%;width:1em;height:1em;text-align:center;-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}.vxe-table--tree-unfold-icon,.vxe-table--tree-fold-icon{position:absolute;width:0;height:0;border-style:solid;border-width:0.5em;border-right-color:transparent;border-bottom-color:transparent}.vxe-table--tree-unfold-icon{left:.3em;top:0;border-left-color:#939599;border-top-color:transparent}.vxe-table--tree-fold-icon{left:0;top:.3em;border-left-color:transparent;border-top-color:#939599}.vxe-table--tree-cell{display:block;padding-left:1.5em}.vxe-table input[type="checkbox"]{margin:0}.vxe-table input[type="checkbox"],.vxe-table input[type="radio"],.vxe-table input[type="checkbox"]+span,.vxe-table input[type="radio"]+span{vertical-align:middle;padding-left:0.4em}';
function getExportBlobByContent(content, options) {
return new Blob([content], { type: `text/${options.type};charset=utf-8;` });
}
function createHtmlPage(opts, content) {
const { style } = opts;
return [
'<!DOCTYPE html><html>',
'<head>',
'<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,minimal-ui">',
`<title>${opts.sheetName}</title>`,
'<style media="print">.vxe-page-break-before{page-break-before:always;}.vxe-page-break-after{page-break-after:always;}</style>',
`<style>${defaultHtmlStyle}</style>`,
style ? `<style>${style}</style>` : '',
'</head>',
`<body>${content}</body>`,
'</html>'
].join('');
}
const { warnLog: warnLog$4, errLog: errLog$5 } = createComponentLog('table');
const { getI18n: getI18n$4, hooks: hooks$4, renderer: renderer$3 } = VxeUI;
let htmlCellElem;
const csvBOM = '\ufeff';
const enterSymbol = '\r\n';
function defaultFilterExportColumn(column) {
return !!column.field || ['seq', 'checkbox', 'radio'].indexOf(column.type || '') === -1;
}
const getConvertColumns = (columns) => {
const result = [];
columns.forEach((column) => {
if (column.childNodes && column.childNodes.length) {
result.push(column);
result.push(...getConvertColumns(column.childNodes));
}
else {
result.push(column);
}
});
return result;
};
const convertToRows = (originColumns) => {
let maxLevel = 1;
const traverse = (column, parent) => {
if (parent) {
column._level = parent._level + 1;
if (maxLevel < column._level) {
maxLevel = column._level;
}
}
if (column.childNodes && column.childNodes.length) {
let colSpan = 0;
column.childNodes.forEach((subColumn) => {
traverse(subColumn, column);
colSpan += subColumn._colSpan;
});
column._colSpan = colSpan;
}
else {
column._colSpan = 1;
}
};
originColumns.forEach((column) => {
column._level = 1;
traverse(column);
});
const rows = [];
for (let i = 0; i < maxLevel; i++) {
rows.push([]);
}
const allColumns = getConvertColumns(originColumns);
allColumns.forEach((column) => {
if (column.childNodes && column.childNodes.length) {
column._rowSpan = 1;
}
else {
column._rowSpan = maxLevel - column._level + 1;
}
rows[column._level - 1].push(column);
});
return rows;
};
function toTableBorder(border) {
if (border === true) {
return 'full';
}
if (border) {
return border;
}
return 'default';
}
function getBooleanValue(cellValue) {
return cellValue === 'TRUE' || cellValue === 'true' || cellValue === true;
}
function getFooterData($xeTable, opts, footerTableData) {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const { footerFilterMethod } = opts;
return footerFilterMethod ? footerTableData.filter((items, index) => footerFilterMethod({ $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt, items, $rowIndex: index })) : footerTableData;
}
function getCsvCellTypeLabel(column, cellValue) {
if (cellValue) {
if (column.type === 'seq') {
return `\t${cellValue}`;
}
switch (column.cellType) {
case 'string':
if (!isNaN(cellValue)) {
return `\t${cellValue}`;
}
break;
case 'number':
break;
default:
if (cellValue.length >= 12 && !isNaN(cellValue)) {
return `\t${cellValue}`;
}
break;
}
}
return cellValue;
}
function toTxtCellLabel(val) {
if (/[",\s\n]/.test(val)) {
return `"${val.replace(/"/g, '""')}"`;
}
return XEUtils.eqNull(val) ? '' : val;
}
function getElementsByTagName(elem, qualifiedName) {
return elem.getElementsByTagName(qualifiedName);
}
function getTxtCellKey(now) {
return `#${now}@${XEUtils.uniqueId()}`;
}
function replaceTxtCell(cell, vMaps) {
return cell.replace(/#\d+@\d+/g, (key) => XEUtils.hasOwnProp(vMaps, key) ? vMaps[key] : key);
}
function getTxtCellValue(val, vMaps) {
const rest = replaceTxtCell(val, vMaps);
return rest.replace(/^"+$/g, (qVal) => '"'.repeat(Math.ceil(qVal.length / 2)));
}
function toExportField(tableConf, field) {
const { fieldMaps, titleMaps } = tableConf;
// title 转 field
if (!fieldMaps[field]) {
const teCol = titleMaps[field];
if (teCol && teCol.field) {
field = teCol.field;
}
}
return field;
}
function parseCsvAndTxt(tableConf, content, cellSeparator) {
const list = content.split(enterSymbol);
const rows = [];
let fields = [];
if (list.length) {
const vMaps = {};
const now = Date.now();
list.forEach((rVal) => {
if (rVal) {
const item = {};
rVal = rVal.replace(/("")|(\n)/g, (text, dVal) => {
const key = getTxtCellKey(now);
vMaps[key] = dVal ? '"' : '\n';
return key;
}).replace(/"(.*?)"/g, (text, cVal) => {
const key = getTxtCellKey(now);
vMaps[key] = replaceTxtCell(cVal, vMaps);
return key;
});
const cells = rVal.split(cellSeparator);
if (!fields.length) {
fields = cells.map((val) => toExportField(tableConf, getTxtCellValue(val.trim(), vMaps)));
}
else {
cells.forEach((val, colIndex) => {
if (colIndex < fields.length) {
item[fields[colIndex]] = getTxtCellValue(val.trim(), vMaps);
}
});
rows.push(item);
}
}
});
}
return { fields, rows };
}
function parseCsv(tableConf, content) {
return parseCsvAndTxt(tableConf, content, ',');
}
function parseTxt(tableConf, content) {
return parseCsvAndTxt(tableConf, content, '\t');
}
function parseHTML(tableConf, content) {
const domParser = new DOMParser();
const xmlDoc = domParser.parseFromString(content, 'text/html');
const bodyNodes = getElementsByTagName(xmlDoc, 'body');
const rows = [];
const fields = [];
if (bodyNodes.length) {
const tableNodes = getElementsByTagName(bodyNodes[0], 'table');
if (tableNodes.length) {
const theadNodes = getElementsByTagName(tableNodes[0], 'thead');
if (theadNodes.length) {
XEUtils.arrayEach(getElementsByTagName(theadNodes[0], 'tr'), rowNode => {
XEUtils.arrayEach(getElementsByTagName(rowNode, 'th'), cellNode => {
fields.push(toExportField(tableConf, cellNode.textContent || ''));
});
});
const tbodyNodes = getElementsByTagName(tableNodes[0], 'tbody');
if (tbodyNodes.length) {
XEUtils.arrayEach(getElementsByTagName(tbodyNodes[0], 'tr'), rowNode => {
const item = {};
XEUtils.arrayEach(getElementsByTagName(rowNode, 'td'), (cellNode, colIndex) => {
if (fields[colIndex]) {
item[fields[colIndex]] = cellNode.textContent || '';
}
});
rows.push(item);
});
}
}
}
}
return { fields, rows };
}
function parseXML(tableConf, content) {
const domParser = new DOMParser();
const xmlDoc = domParser.parseFromString(content, 'application/xml');
const sheetNodes = getElementsByTagName(xmlDoc, 'Worksheet');
const rows = [];
const fields = [];
if (sheetNodes.length) {
const tableNodes = getElementsByTagName(sheetNodes[0], 'Table');
if (tableNodes.length) {
const rowNodes = getElementsByTagName(tableNodes[0], 'Row');
if (rowNodes.length) {
XEUtils.arrayEach(getElementsByTagName(rowNodes[0], 'Cell'), cellNode => {
fields.push(toExportField(tableConf, cellNode.textContent || ''));
});
XEUtils.arrayEach(rowNodes, (rowNode, index) => {
if (index) {
const item = {};
const cellNodes = getElementsByTagName(rowNode, 'Cell');
XEUtils.arrayEach(cellNodes, (cellNode, colIndex) => {
if (fields[colIndex]) {
item[fields[colIndex]] = cellNode.textContent;
}
});
rows.push(item);
}
});
}
}
}
return { fields, rows };
}
function clearColumnConvert(columns) {
XEUtils.eachTree(columns, (column) => {
delete column._level;
delete column._colSpan;
delete column._rowSpan;
delete column._children;
delete column.childNodes;
}, { children: 'children' });
}
const tableExportMethodKeys = ['exportData', 'importByFile', 'importData', 'saveFile', 'readFile', 'print', 'getPrintHtml', 'openImport', 'closeImport', 'openExport', 'closeExport', 'openPrint', 'closePrint'];
hooks$4.add('tableExportModule', {
setupTable($xeTable) {
const { props, reactData, internalData } = $xeTable;
const { computeTreeOpts, computePrintOpts, computeExportOpts, computeImportOpts, computeCustomOpts, computeSeqOpts, computeRadioOpts, computeCheckboxOpts, computeColumnOpts, computeAggregateOpts } = $xeTable.getComputeMaps();
const getSeq = (cellValue, row, $rowIndex, column, $columnIndex) => {
const seqOpts = computeSeqOpts.value;
const seqMd = seqOpts.seqMethod || column.seqMethod;
if (seqMd) {
return seqMd({
$table: $xeTable,
row,
rowIndex: $xeTable.getRowIndex(row),
_rowIndex: $xeTable.getVTRowIndex(row),
$rowIndex,
column,
columnIndex: $xeTable.getColumnIndex(column),
_columnIndex: $xeTable.getVTColumnIndex(column),
$columnIndex
});
}
return cellValue;
};
function getHeaderTitle(opts, column) {
const columnOpts = computeColumnOpts.value;
const headExportMethod = column.headerExportMethod || columnOpts.headerExportMethod;
return headExportMethod ? headExportMethod({ column, options: opts, $table: $xeTable }) : ((opts.isTitle ? $xeTable.getHeaderCellLabel(column) : column.field) || '');
}
const toBooleanValue = (cellValue) => {
return XEUtils.isBoolean(cellValue) ? (cellValue ? 'TRUE' : 'FALSE') : cellValue;
};
const toStringValue = (cellValue) => {
return eqEmptyValue(cellValue) ? '' : `${cellValue}`;
};
const getBodyLabelData = (opts, columns, datas) => {
const { isTreeAllExpanded, isRowGroupAllExpanded, mode: expMode } = opts;
const { treeConfig } = props;
const { isRowGroupStatus } = reactData;
const { fullColumnFieldData } = internalData;
const radioOpts = computeRadioOpts.value;
const checkboxOpts = computeCheckboxOpts.value;
const treeOpts = computeTreeOpts.value;
const columnOpts = computeColumnOpts.value;
const aggregateOpts = computeAggregateOpts.value;
if (!htmlCellElem) {
htmlCellElem = document.createElement('div');
}
const { handleGetRowId } = createHandleGetRowId($xeTable);
if (isRowGroupStatus) {
// 如果是数据分组
const { mode: aggMode, showTotal, totalMethod, countFields, contentMethod, formatValuesMethod, mapChildrenField } = aggregateOpts;
const rest = [];
const expandMaps = {};
const useMaps = {};
XEUtils.eachTree(datas, (item, $rowIndex, items, path, parentItem, nodes) => {
const row = item._row || item;
const rowid = handleGetRowId(row);
if (useMaps[rowid]) {
return;
}
const parentRow = parentItem && parentItem._row ? parentItem._row : parentItem;
const pRowid = parentRow ? handleGetRowId(parentRow) : '';
if ((isRowGroupAllExpanded || !parentRow || (expandMaps[pRowid] && $xeTable.isRowExpandByRow(parentRow)))) {
const hasRowChild = mapChildrenField && row[mapChildrenField] && row[mapChildrenField].length;
const item = {
_row: row,
_level: nodes.length - 1,
_hasChild: hasRowChild,
_expand: hasRowChild && $xeTable.isRowExpandByRow(row)
};
columns.forEach((column, $columnIndex) => {
const { field, editRender, cellRender, aggFunc, rowGroupNode } = column;
let cellValue = '';
const renderOpts = editRender || cellRender;
let bodyExportMethod = column.exportMethod || columnOpts.exportMethod;
if (!bodyExportMethod && renderOpts && renderOpts.name) {
const compConf = renderer$3.get(renderOpts.name);
if (compConf) {
bodyExportMethod = compConf.tableExportMethod || compConf.exportMethod;
}
}
if (!bodyExportMethod) {
bodyExportMethod = columnOpts.exportMethod;
}
if (bodyExportMethod) {
cellValue = bodyExportMethod({ $table: $xeTable, row, column, options: opts });
}
else {
switch (column.type) {
case 'seq': {
const seqVal = path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('');
cellValue = expMode === 'all' ? seqVal : getSeq(seqVal, row, $rowIndex, column, $columnIndex);
break;
}
case 'checkbox': {
cellValue = toBooleanValue($xeTable.isCheckedByCheckboxRow(row));
item._checkboxLabel = checkboxOpts.labelField ? XEUtils.get(row, checkboxOpts.labelField) : '';
item._checkboxDisabled = checkboxOpts.checkMethod && !checkboxOpts.checkMethod({ $table: $xeTable, row });
break;
}
case 'radio': {
cellValue = toBooleanValue($xeTable.isCheckedByRadioRow(row));
item._radioLabel = radioOpts.labelField ? XEUtils.get(row, radioOpts.labelField) : '';
item._radioDisabled = radioOpts.checkMethod && !radioOpts.checkMethod({ $table: $xeTable, row });
break;
}
default: {
if (field && row.isAggregate) {
const aggRow = row;
const aggData = aggRow.aggData;
const currAggData = aggData ? aggData[field] : null;
const groupField = aggRow.groupField;
const groupContent = aggRow.groupContent;
const childList = mapChildrenField ? (aggRow[mapChildrenField] || []) : [];
const childCount = aggRow.childCount;
const colRest = fullColumnFieldData[groupField] || {};
const ctParams = {
$table: $xeTable,
groupField,
groupColumn: (colRest ? colRest.column : null),
column,
groupValue: groupContent,
childList,
childCount,
aggValue: null,
/**
* 已废弃
* @deprecated
*/
children: childList,
/**
* 已废弃
* @deprecated
*/
totalValue: childCount
};
if (aggMode === 'column' ? field === aggRow.groupField : rowGroupNode) {
cellValue = groupContent;
if (contentMethod) {
cellValue = `${contentMethod(ctParams)}`;
}
if (showTotal) {
cellValue = getI18n$4('vxe.table.rowGroupContentTotal', [cellValue, totalMethod ? totalMethod(ctParams) : childCount, childCount]);
}
}
else if ($xeTable.getPivotTableAggregateCellAggValue) {
const aggParams = {
$table: $xeTable,
row,
column
};
cellValue = $xeTable.getPivotTableAggregateCellAggValue(aggParams);
}
else if (aggFunc === true || (countFields && countFields.includes(field))) {
cellValue = currAggData ? currAggData.value : childCount;
ctParams.aggValue = cellValue;
if (formatValuesMethod) {
cellValue = formatValuesMethod(ctParams);
}
}
}
else if (opts.original) {
cellValue = getCellValue(row, column);
}
else {
cellValue = $xeTable.getCellLabel(row, column);
if (column.type === 'html') {
htmlCellElem.innerHTML = cellValue;
cellValue = htmlCellElem.innerText.trim();
}
else {
const cell = $xeTable.getCellElement(row, column);
if (cell && !hasClass(cell, 'is--progress')) {
cellValue = cell.innerText.trim();
}
}
}
break;
}
}
}
item[column.id] = toStringValue(cellValue);
});
useMaps[rowid] = true;
if (pRowid) {
expandMaps[pRowid] = true;
}
rest.push(Object.assign(item, row));
}
}, { children: mapChildrenField });
return rest;
}
if (treeConfig) {
// 如果是树结构
const childrenField = treeOpts.children || treeOpts.childrenField;
const rest = [];
const expandMaps = {};
const useMaps = {};
XEUtils.eachTree(datas, (item, $rowIndex, items, path, parentItem, nodes) => {
const row = item._row || item;
const rowid = handleGetRowId(row);
if (useMaps[rowid]) {
return;
}
const parentRow = parentItem && parentItem._row ? parentItem._row : parentItem;
const pRowid = parentRow ? handleGetRowId(parentRow) : '';
if ((isTreeAllExpanded || !parentRow || (expandMaps[pRowid] && $xeTable.isTreeExpandByRow(parentRow)))) {
const hasRowChild = row[childrenField] && row[childrenField].length;
const item = {
_row: row,
_level: nodes.length - 1,
_hasChild: hasRowChild,
_expand: hasRowChild && $xeTable.isTreeExpandByRow(row)
};
columns.forEach((column, $columnIndex) => {
let cellValue = '';
const renderOpts = column.editRender || column.cellRender;
let bodyExportMethod = column.exportMethod || columnOpts.exportMethod;
if (!bodyExportMethod && renderOpts && renderOpts.name) {
const compConf = renderer$3.get(renderOpts.name);
if (compConf) {
bodyExportMethod = compConf.tableExportMethod || compConf.exportMethod;
}
}
if (!bodyExportMethod) {
bodyExportMethod = columnOpts.exportMethod;
}
if (bodyExportMethod) {
cellValue = bodyExportMethod({ $table: $xeTable, row, column, options: opts });
}
else {
switch (column.type) {
case 'seq': {
const seqVal = path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('');
cellValue = expMode === 'all' ? seqVal : getSeq(seqVal, row, $rowIndex, column, $columnIndex);
break;
}
case 'checkbox':
cellValue = toBooleanValue($xeTable.isCheckedByCheckboxRow(row));
item._checkboxLabel = checkboxOpts.labelField ? XEUtils.get(row, checkboxOpts.labelField) : '';
item._checkboxDisabled = checkboxOpts.checkMethod && !checkboxOpts.checkMethod({ $table: $xeTable, row });
break;
case 'radio':
cellValue = toBooleanValue($xeTable.isCheckedByRadioRow(row));
item._radioLabel = radioOpts.labelField ? XEUtils.get(row, radioOpts.labelField) : '';
item._radioDisabled = radioOpts.checkMethod && !radioOpts.checkMethod({ $table: $xeTable, row });
break;
default:
if (opts.original) {
cellValue = getCellValue(row, column);
}
else {
cellValue = $xeTable.getCellLabel(row, column);
if (column.type === 'html') {
htmlCellElem.innerHTML = cellValue;
cellValue = htmlCellElem.innerText.trim();
}
else {
const cell = $xeTable.getCellElement(row, column);
if (cell && !hasClass(cell, 'is--progress')) {
cellValue = cell.innerText.trim();
}
}
}
}
}
item[column.id] = toStringValue(cellValue);
});
useMaps[rowid] = true;
if (pRowid) {
expandMaps[pRowid] = true;
}
rest.push(Object.assign(item, row));
}
}, { children: childrenField });
return rest;
}
return datas.map((row, $rowIndex) => {
const item = {
_row: row
};
columns.forEach((column, $columnIndex) => {
let cellValue = '';
const renderOpts = column.editRender || column.cellRender;
let bodyExportMethod = column.exportMethod || columnOpts.exportMethod;
if (!bodyExportMethod && renderOpts && renderOpts.name) {
const compConf = renderer$3.get(renderOpts.name);
if (compConf) {
bodyExportMethod = compConf.tableExportMethod || compConf.exportMethod;
}
}
if (bodyExportMethod) {
cellValue = bodyExportMethod({ $table: $xeTable, row, column, options: opts });
}
else {
switch (column.type) {
case 'seq': {
const seqValue = $rowIndex + 1;
cellValue = expMode === 'all' ? seqValue : getSeq(seqValue, row, $rowIndex, column, $columnIndex);
break;
}
case 'checkbox':
cellValue = toBooleanValue($xeTable.isCheckedByCheckboxRow(row));
item._checkboxLabel = checkboxOpts.labelField ? XEUtils.get(row, checkboxOpts.labelField) : '';
item._checkboxDisabled = checkboxOpts.checkMethod && !checkboxOpts.checkMethod({ $table: $xeTable, row });
break;
case 'radio':
cellValue = toBooleanValue($xeTable.isCheckedByRadioRow(row));
item._radioLabel = radioOpts.labelField ? XEUtils.get(row, radioOpts.labelField) : '';
item._radioDisabled = radioOpts.checkMethod && !radioOpts.checkMethod({ $table: $xeTable, row });
break;
default:
if (opts.original) {
cellValue = getCellValue(row, column);
}
else {
cellValue = $xeTable.getCellLabel(row, column);
if (column.type === 'html') {
htmlCellElem.innerHTML = cellValue;
cellValue = htmlCellElem.innerText.trim();
}
else {
const cell = $xeTable.getCellElement(row, column);
if (cell && !hasClass(cell, 'is--progress')) {
cellValue = cell.innerText.trim();
}
}
}
}
}
item[column.id] = toStringValue(cellValue);
});
return item;
});
};
const getExportData = (opts) => {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const { columns, dataFilterMethod } = opts;
let datas = opts.data;
if (dataFilterMethod) {
datas = datas.filter((row, index) => dataFilterMethod({ $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt, row, $rowIndex: index }));
}
return getBodyLabelData(opts, columns, datas);
};
const getFooterCellValue = (opts, row, column) => {
const columnOpts = computeColumnOpts.value;
const renderOpts = column.editRender || column.cellRender;
let footLabelMethod = column.footerExportMethod;
if (!footLabelMethod && renderOpts && renderOpts.name) {
const compConf = renderer$3.get(renderOpts.name);
if (compConf) {
footLabelMethod = compConf.tableFooterExportMethod || compConf.footerExportMethod;
}
}
if (!footLabelMethod) {
footLabelMethod = columnOpts.footerExportMethod;
}
if (footLabelMethod) {
const _columnIndex = $xeTable.getVTColumnIndex(column);
return footLabelMethod({ $table: $xeTable, items: row, itemIndex: _columnIndex, row, _columnIndex, column, options: opts });
}
const cellValue = $xeTable.getFooterCellLabel(row, column);
return cellValue;
};
const toCsv = ($xeTable, opts, columns, datas) => {
let content = csvBOM;
if (opts.isHeader) {
content += columns.map((column) => toTxtCellLabel(getHeaderTitle(opts, column))).join(',') + enterSymbol;
}
datas.forEach((row) => {
content += columns.map((column) => toTxtCellLabel(getCsvCellTypeLabel(column, row[column.id]))).join(',') + enterSymbol;
});
if (opts.isFooter) {
const { footerTableData } = reactData;
const footers = getFooterData($xeTable, opts, footerTableData);
footers.forEach((row) => {
content += columns.map((column) => toTxtCellLabel(getFooterCellValue(opts, row, column))).join(',') + enterSymbol;
});
}
return content;
};
const toTxt = ($xeTable, opts, columns, datas) => {
let content = '';
if (opts.isHeader) {
content += columns.map((column) => toTxtCellLabel(getHeaderTitle(opts, column))).join('\t') + enterSymbol;
}
datas.forEach((row) => {
content += columns.map((column) => toTxtCellLabel(row[column.id])).join('\t') + enterSymbol;
});
if (opts.isFooter) {
const { footerTableData } = reactData;
const footers = getFooterData($xeTable, opts, footerTableData);
footers.forEach((row) => {
content += columns.map((column) => toTxtCellLabel(getFooterCellValue(opts, row, column))).join('\t') + enterSymbol;
});
}
return content;
};
const hasEllipsis = (column, property, allColumnOverflow) => {
const columnOverflow = column[property];
const headOverflow = XEUtils.isUndefined(columnOverflow) || XEUtils.isNull(columnOverflow) ? allColumnOverflow : columnOverflow;
const showEllipsis = headOverflow === 'ellipsis';
const showTitle = headOverflow === 'title';
const showTooltip = headOverflow === true || headOverflow === 'tooltip';
let isEllipsis = showTitle || showTooltip || showEllipsis;
// 虚拟滚动不支持动态高度
const { scrollXLoad, scrollYLoad } = reactData;
if ((scrollXLoad || scrollYLoad) && !isEllipsis) {
isEllipsis = true;
}
return isEllipsis;
};
const getCustomColKey = (conf) => {
return `${conf.field || ''}:${conf.type || ''}`;
};
const toHtml = (opts, columns, datas) => {
const { id, border, treeConfig, headerAlign: allHeaderAlign, align: allAlign, footerAlign: allFooterAlign, showOverflow: allColumnOverflow, showHeaderOverflow: allColumnHeaderOverflow } = props;
const { isAllSelected, isIndeterminate } = reactData;
const { mergeBodyCellMaps, mergeFooterCellMaps } = internalData;
const treeOpts = computeTreeOpts.value;
const { print: isPrint, widthMode, isHeader, isFooter, isColgroup, isMerge, colgroups, _columnConfs, original } = opts;
const isAutoWidth = widthMode === 'auto';
const isScaleWidth = widthMode === 'scale';
const isDefaultWidth = !isAutoWidth && !isScaleWidth;
const customWidthMaps = {};
if (_columnConfs) {
_columnConfs.forEach(conf => {
if (!isColumnInfo(conf)) {
if ((conf.field || conf.type) && conf.width) {
customWidthMaps[getCustomColKey(conf)] = conf.width;
}
}
});
}
// 计算宽度
const colWidthMaps = {};
const printWidthMaps = {};
if (isPrint) {
let tableWidth = 0;
columns.forEach(column => {
tableWidth += column.renderWidth;
});
if (colgroups) {
colgroups.forEach((cols) => {
cols.forEach((column) => {
if (!column.childNodes || !column.childNodes.length) {
return;
}
let childWidth = 0;
let countChild = 0;
XEUtils.eachTree([column], item => {
if (!item.childNodes || !column.childNodes.length) {
countChild++;
}
const ptWidth = printWidthMaps[item.id];
childWidth += ptWidth || 0;
}, { children: 'childNodes' });
const colWidth = childWidth - countChild;
colWidthMaps[column.id] = colWidth;
printWidthMaps[column.id] = XEUtils.floor(colWidth / tableWidth * 180, 2);
});
});
}
columns.forEach(column => {
const colWidth = column.renderWidth;
if (column.width) {
colWidthMaps[column.id] = colWidth;
}
printWidthMaps[column.id] = XEUtils.floor(colWidth / tableWidth * 180, 2);
});
}
const getHeaderWidthStyle = (column) => {
const cmColKey = getCustomColKey(column);
const cmWidthMaps = customWidthMaps[cmColKey];
if (cmWidthMaps) {
return 'width:' + toCssUnit(cmWidthMaps);
}
if (isAutoWidth) {
return '';
}
if (isScaleWidth) {
return printWidthMaps[column.id] ? ('width:' + printWidthMaps[column.id] + 'mm') : '';
}
return colWidthMaps[column.id] ? ('width:' + toCssUnit(colWidthMaps[column.id])) : '';
};
const getCellWidthStyle = (column) => {
const cmColKey = getCustomColKey(column);
const cmWidthMaps = customWidthMaps[cmColKey];
if (cmWidthMaps) {
return 'width:' + toCssUnit(cmWidthMaps);
}
if (isAutoWidth || isDefaultWidth) {
return '';
}
if (isScaleWidth) {
return printWidthMaps[column.id] ? ('width:' + printWidthMaps[column.id] + 'mm') : '';
}
return colWidthMaps[column.id] ? ('width:' + toCssUnit(colWidthMaps[column.id])) : '';
};
const allCls = 'check-all';
const clss = [
'vxe-table',
`border--${toTableBorder(border)}`,
isPrint ? 'is--print' : '',
isAutoWidth ? 'is--auto-width' : '',
isScaleWidth ? 'is--scale-width' : '',
isDefaultWidth ? 'is--default-width' : '',
isHeader ? 'is--header' : ''
].filter(cls => cls);
const tables = [
`<table class="${clss.join(' ')}" border="0" cellspacing="0" cellpadding="0">`,
`<colgroup>${columns.map((column) => `<col style="${getHeaderWidthStyle(column)}">`).join('')}</colgroup>`
];
if (isHeader) {
tables.push('<thead>');
if (isColgroup && !original) {
colgroups.forEach((cols) => {
tables.push(`<tr>${cols.map((column) => {
const headAlign = column.headerAlign || column.align || allHeaderAlign || allAlign;
const classNames = hasEllipsis(column, 'showHeaderOverflow', allColumnHeaderOverflow) ? ['col--ellipsis'] : [];
const cellTitle = getHeaderTitle(opts, column);
if (headAlign) {
classNames.push(`col--${headAlign}`);
}
if (column.type === 'checkbox') {
return `<th class="${classNames.join(' ')}" colspan="${column._colSpan}" rowspan="${column._rowSpan}"><div style="${getCellWidthStyle(column)}"><input type="checkbox" class="${allCls}" ${isAllSelected ? 'checked' : ''}><span>${cellTitle}</span></div></th>`;
}
return `<th class="${classNames.join(' ')}" colspan="${column._colSpan}" rowspan="${column._rowSpan}" title="${cellTitle}"><div style="${getCellWidthStyle(column)}"><span>${formatText(cellTitle, true)}</span></div></th>`;
}).join('')}</tr>`);
});
}
else {
tables.push(`<tr>${columns.map((column) => {
const headAlign = column.headerAlign || column.align || allHeaderAlign || allAlign;
const classNames = hasEllipsis(column, 'showHeaderOverflow', allColumnHeaderOverflow) ? ['col--ellipsis'] : [];
const cellTitle = getHeaderTitle(opts, column);
if (headAlign) {
classNames.push(`col--${headAlign}`);
}
if (column.type === 'checkbox') {
return `<th class="${classNames.join(' ')}"><div style="${getCellWidthStyle(column)}"><input type="checkbox" class="${allCls}" ${isAllSelected ? 'checked' : ''}><span>${cellTitle}</span></div></th>`;
}
return `<th class="${classNames.join(' ')}" title="${cellTitle}"><div style="${getCellWidthStyle(column)}"><span>${formatText(cellTitle, true)}</span></div></th>`;
}).join('')}</tr>`);
}
tables.push('</thead>');
}
if (datas.length) {
tables.push('<tbody>');
if (treeConfig) {
datas.forEach((item) => {
tables.push('<tr>' + columns.map((column) => {
const colid = column.id;
const cellAlign = column.align || allAlign;
const classNames = hasEllipsis(column, 'showOverflow', allColumnOverflow) ? ['col--ellipsis'] : [];
const cellValue = item[colid];
if (cellAlign) {
classNames.push(`col--${cellAlign}`);
}
if (column.treeNode) {
let treeIcon = '';
if (item._hasChild) {
treeIcon = `<i class="${item._expand ? 'vxe-table--tree-fold-icon' : 'vxe-table--tree-unfold-icon'}"></i>`;
}
classNames.push('vxe-table--tree-node');
if (column.type === 'radio') {
return `<td class="${classNames.join(' ')}" title="${cellValue}"><div style="${getCellWidthStyle(column)}"><div class="vxe-table--tree-node-wrapper" style="padding-left: ${item._level * treeOpts.indent}px"><div class="vxe-table--tree-icon-wrapper">${treeIcon}</div><div class="vxe-table--tree-cell"><input type="radio" name="radio_${id}" ${item._radioDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._radioLabel}</span></div></div></div></td>`;
}
else if (column.type === 'checkbox') {
return `<td class="${classNames.join(' ')}" title="${cellValue}"><div style="${getCellWidthStyle(column)}"><div class="vxe-table--tree-node-wrapper" style="padding-left: ${item._level * treeOpts.indent}px"><div class="vxe-table--tree-icon-wrapper">${treeIcon}</div><div class="vxe-table--tree-cell"><input type="checkbox" ${item._checkboxDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._checkboxLabel}</span></div></div></div></td>`;
}
return `<td class="${classNames.join(' ')}" title="${cellValue}"><div style="${getCellWidthStyle(column)}"><div class="vxe-table--tree-node-wrapper" style="padding-left: ${item._level * treeOpts.indent}px"><div class="vxe-table--tree-icon-wrapper">${treeIcon}</div><div class="vxe-table--tree-cell">${cellValue}</div></div></div></td>`;
}
if (column.type === 'radio') {
return `<td class="${classNames.join(' ')}"><div style="${getCellWidthStyle(column)}"><input type="radio" name="radio_${id}" ${item._radioDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._radioLabel}</span></div></td>`;
}
else if (column.type === 'checkbox') {
return `<td class="${classNames.join(' ')}"><div style="${getCellWidthStyle(column)}"><input type="checkbox" ${item._checkboxDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._checkboxLabel}</span></div></td>`;
}
return `<td class="${classNames.join(' ')}" title="${cellValue}"><div style="${getCellWidthStyle(column)}">${formatText(cellValue, true)}</div></td>`;
}).join('') + '</tr>');
});
}
else {
datas.forEach((item) => {
tables.push('<tr>' + columns.map((column) => {
const cellAlign = column.align || allAlign;
const classNames = hasEllipsis(column, 'showOverflow', allColumnOverflow) ? ['col--ellipsis'] : [];
const cellValue = item[column.id];
let rowSpan = 1;
let colSpan = 1;
if (isMerge) {
const _rowIndex = $xeTable.getVTRowIndex(item._row);
const _columnIndex = $xeTable.getVTColumnIndex(column);
const spanRest = mergeBodyCellMaps[`${_rowIndex}:${_columnIndex}`];
if (spanRest) {
const { rowspan, colspan } = spanRest;
if (!rowspan || !colspan) {
return '';
}
if (rowspan > 1) {
rowSpan = rowspan;
}
if (colspan > 1) {
colSpan = colspan;
}
}
}
if (cellAlign) {
classNames.push(`col--${cellAlign}`);
}
if (column.type === 'radio') {
return `<td class="${classNames.join(' ')}" rowspan="${rowSpan}" colspan="${colSpan}"><div style="${getCellWidthStyle(column)}"><input type="radio" name="radio_${id}" ${item._radioDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._radioLabel}</span></div></td>`;
}
else if (column.type === 'checkbox') {
return `<td class="${classNames.join(' ')}" rowspan="${rowSpan}" colspan="${colSpan}"><div style="${getCellWidthStyle(column)}"><input type="checkbox" ${item._checkboxDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._checkboxLabel}</span></div></td>`;
}
return `<td class="${classNames.join(' ')}" rowspan="${rowSpan}" colspan="${colSpan}" title="${cellValue}"><div style="${getCellWidthStyle(column)}">${formatText(cellValue, true)}</div></td>`;
}).join('') + '</tr>');
});
}
tables.push('</tbody>');
}
if (isFooter) {
const { footerTableData } = reactData;
const footers = getFooterData($xeTable, opts, footerTableData);
if (footers.length) {
tables.push('<tfoot>');
footers.forEach((row, rIndex) => {
tables.push(`<tr>${columns.map((column) => {
const footAlign = column.footerAlign || column.align || allFooterAlign || allAlign;
const classNames = hasEllipsis(column, 'showOverflow', allColumnOverflow) ? ['col--ellipsis'] : [];
const cellValue = getFooterCellValue(opts, row, column);
let rowSpan = 1;
let colSpan = 1;
if (isMerge) {
const _rowIndex = rIndex;
const _columnIndex = $xeTable.getVTColumnIndex(column);
const spanRest = mergeFooterCellMaps[`${_rowIndex}:${_columnIndex}`];
if (spanRest) {
const { rowspan, colspan } = spanRest;
if (!rowspan || !colspan) {
return '';
}
if (rowspan > 1) {
rowSpan = rowspan;
}
if (colspan > 1) {
colSpan = colspan;
}
}
}
if (footAlign) {
classNames.push(`col--${footAlign}`);
}
return `<td class="${classNames.join(' ')}" rowspan="${rowSpan}" colspan="${colSpan}" title="${cellValue}"><div style="${getCellWidthStyle(column)}">${formatText(cellValue, true)}</div></td>`;
}).join('')}</tr>`);
});
tables.push('</tfoot>');
}
}
// 是否半选状态
const script = !isAllSelected && isIndeterminate ? `<script>(function(){var a=document.querySelector(".${allCls}");if(a){a.indeterminate=true}})()</script>` : '';
tables.push('</table>', script);
return isPrint ? tables.join('') : createHtmlPage(opts, tables.join(''));
};
const toXML = (opts, columns, datas) => {
let xml = [
'<?xml version="1.0"?>',
'<?mso-application progid="Excel.Sheet"?>',
'<Workbook xmlns="urn:schemas-microsoft-com:office:spreadsheet" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns:ss="urn:schemas-microsoft-com:office:spreadsheet" xmlns:html="http://www.w3.org/TR/REC-html40">',
'<DocumentProperties xmlns="urn:schemas-microsoft-com:office:office">',
'<Version>16.00</Version>',
'</DocumentProperties>',
'<ExcelWorkbook xmlns="urn:schemas-microsoft-com:office:excel">',
'<WindowHeight>7920</WindowHeight>',
'<WindowWidth>21570</WindowWidth>',
'<WindowTopX>32767</WindowTopX>',
'<WindowTopY>32767</WindowTopY>',
'<ProtectStructure>False</ProtectStructure>',
'<ProtectWindows>False</ProtectWindows>',
'</ExcelWorkbook>',
`<Worksheet ss:Name="${opts.sheetName}">`,
'<Table>',
columns.map((column) => `<Column ss:Width="${column.renderWidth}"/>`).join('')
].join('');
if (opts.isHeader) {
xml += `<Row>${columns.map((column) => `<Cell><Data ss:Type="String">${getHeaderTitle(opts, column)}</Data></Cell>`).join('')}</Row>`;
}
datas.forEach((row) => {
xml += '<Row>' + columns.map((column) => `<Cell><Data ss:Type="String">${row[column.id]}</Data></Cell>`).join('') + '</Row>';
});
if (opts.isFooter) {
const { footerTableData } = reactData;
const footers = getFooterData($xeTable, opts, footerTableData);
footers.forEach((row) => {
xml += `<Row>${columns.map((column) => `<Cell><Data ss:Type="String">${getFooterCellValue(opts, row, column)}</Data></Cell>`).join('')}</Row>`;
});
}
return `${xml}</Table></Worksheet></Workbook>`;
};
const getContent = ($xeTable, opts, columns, datas) => {
if (columns.length) {
switch (opts.type) {
case 'csv':
return toCsv($xeTable, opts, columns, datas);
case 'txt':
return toTxt($xeTable, opts, columns, datas);
case 'html':
return toHtml(opts, columns, datas);
case 'xml':
return toXML(opts, columns, datas);
}
}
return '';
};
const downloadFile = (opts, content) => {
const { filename, type, download } = opts;
if (!download) {
const blob = getExportBlobByContent(content, opts);
return Promise.resolve({ type, content, blob });
}
if (VxeUI.saveFile) {
VxeUI.saveFile({ filename, type, content }).then(() => {
if (opts.message !== false) {
if (VxeUI.modal) {
VxeUI.modal.message({ content: getI18n$4('vxe.table.expSuccess'), status: 'success' });
}
}
});
}
};
const handleExport = (opts) => {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const { remote, columns, colgroups, exportMethod, afterExportMethod } = opts;
return new Promise(resolve => {
if (remote) {
const params = { options: opts, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt };
resolve(exportMethod ? exportMethod(params) : params);
}
else {
const datas = getExportData(opts);
resolve($xeTable.preventEvent(null, 'event.export', { options: opts, columns, colgroups, datas }, () => {
return downloadFile(opts, getContent($xeTable, opts, columns, datas));
}));
}
}).then((params) => {
clearColumnConvert(columns);
if (!opts.print) {
if (afterExportMethod) {
afterExportMethod({ status: true, options: opts, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt });
}
}
return Object.assign({ status: true }, params);
}).catch(() => {
clearColumnConvert(columns);
if (!opts.print) {
if (afterExportMethod) {
afterExportMethod({ status: false, options: opts, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt });
}
}
const params = { status: false };
return Promise.reject(params);
});
};
const handleImport = (content, opts) => {
const { tableFullColumn, _importResolve, _importReject } = internalData;
let rest = { fields: [], rows: [] };
const tableFieldMaps = {};
const tableTitleMaps = {};
tableFullColumn.forEach((column) => {
const field = column.field;
const title = $xeTable.getHeaderCellLabel(column);
if (field) {
tableFieldMaps[field] = column;
}
if (title) {
tableTitleMaps[title] = column;
}
});
const tableConf = {
fieldMaps: tableFieldMaps,
titleMaps: tableTitleMaps
};
switch (opts.type) {
case 'csv':
rest = parseCsv(tableConf, content);
break;
case 'txt':
rest = parseTxt(tableConf, content);
break;
case 'html':
rest = parseHTML(tableConf, content);
break;
case 'xml':
rest = parseXML(tableConf, content);
break;
}
const { fields, rows } = rest;
const status = fields.some(field => tableFieldMaps[field] || tableTitleMaps[field]);
if (status) {
$xeTable.createData(rows)
.then((data) => {
let loadRest;
if (opts.mode === 'insert' || opts.mode === 'insertBottom') {
loadRest = $xeTable.insertAt(data, -1);
}
else if (opts.mode === 'insertTop') {
loadRest = $xeTable.insert(data);
}
else {
loadRest = $xeTable.reloadData(data);
}
if (opts.message !== false) {
if (VxeUI.modal) {
VxeUI.modal.message({ content: getI18n$4('vxe.table.impSuccess', [rows.length]), status: 'success' });
}
}
return loadRest.then(() => {
if (_importResolve) {
_importResolve({ status: true });
}
});
});
}
else if (opts.message !== false) {
if (VxeUI.modal) {
VxeUI.modal.message({ content: getI18n$4('vxe.error.impFields'), status: 'error' });
}
if (_importReject) {
_importReject({ status: false, msg: 'field mismatching' });
}
}
};
const handleFileImport = (file, opts) => {
const { importMethod, afterImportMethod } = opts;
const { type, filename } = parseFile(file);
const importOpts = computeImportOpts.value;
// 检查类型,如果为自定义导出,则不需要校验类型
if (!importMethod && !XEUtils.includes(XEUtils.keys(importOpts._typeMaps), type)) {
if (opts.message !== false) {
if (VxeUI.modal) {
VxeUI.modal.message({ content: getI18n$4('vxe.error.notType', [type]), status: 'error' });
}
}
const params = { status: false, msg: 'type error' };
return Promise.reject(params);
}
const rest = new Promise((resolve, reject) => {
const _importResolve = (params) => {
resolve(params);
internalData._importResolve = null;
internalData._importReject = null;
};
const _importReject = (params) => {
reject(params);
internalData._importResolve = null;
internalData._importReject = null;
};
internalData._importResolve = _importResolve;
internalData._importReject = _importReject;
if (window.FileReader) {
const options = Object.assign({ mode: 'insertTop' }, opts, { type, filename });
if (options.remote) {
if (importMethod) {
Promise.resolve(importMethod({ file, options, $table: $xeTable })).then(() => {
_importResolve({ status: true });
}).catch(() => {
_importResolve({ status: true });
});
}
else {
_importResolve({ status: true });
}
}
else {
const { tableFullColumn } = internalData;
$xeTable.preventEvent(null, 'event.import', { file, options, columns: tableFullColumn }, () => {
const reader = new FileReader();
reader.onerror = () => {
errLog$5('vxe.error.notType', [type]);
_importReject({ status: false, msg: 'reading file error' });
};
reader.onload = (e) => {
handleImport(e.target.result, options);
};
reader.readAsText(file, options.encoding || 'UTF-8');
});
}
}
else {
// 不支持的浏览器
errLog$5('vxe.error.notExp');
_importResolve({ status: false, msg: 'unsupported browser' });
}
});
return rest.then(() => {
if (afterImportMethod) {
afterImportMethod({ status: true, options: opts, $table: $xeTable });
}
}).catch((e) => {
if (afterImportMethod) {
afterImportMethod({ status: false, options: opts, $table: $xeTable });
}
return Promise.reject(e);
});
};
const handleFilterColumns = (exportOpts, column, columns) => {
return columns.some((item) => {
if (isColumnInfo(item)) {
return column.id === item.id;
}
else if (XEUtils.isString(item)) {
return column.field === item;
}
else {
const colid = item.id || item.colId;
const type = item.type;
const field = item.field;
if (colid) {
return column.id === colid;
}
else if (field && type) {
return column.field === field && column.type === type;
}
else if (field) {
return column.field === field;
}
else if (type) {
return column.type === type;
}
}
return false;
});
};
const handleFilterFields = (exportOpts, column, includeFields, includeFdMaps, excludeFdMaps, extraFdMaps) => {
const { field } = column;
if (excludeFdMaps[field]) {
return false;
}
if (includeFields) {
if (includeFdMaps[field]) {
return true;
}
return false;
}
if (extraFdMaps[field]) {
return true;
}
return exportOpts.original ? !!field : defaultFilterExportColumn(column);
};
const handleExportAndPrint = (options, isPrint) => {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const $xeGGWrapper = $xeGrid || $xeGantt;
const { treeConfig, showHeader, showFooter } = props;
const { initStore, isGroup, rowGroupList, footerTableData, exportStore, exportParams } = reactData;
const { collectColumn, mergeBodyList, mergeFooterList } = internalData;
const exportOpts = computeExportOpts.value;
const hasTree = !!treeConfig;
const hasRowGroup = rowGroupList.length > 0;
const customOpts = computeCustomOpts.value;
const selectRecords = $xeTable.getCheckboxRecords();
const proxyOpts = $xeGGWrapper ? $xeGGWrapper.getComputeMaps().computeProxyOpts.value : {};
const hasFooter = !!footerTableData.length;
const hasMerge = !!(mergeBodyList.length || mergeFooterList.length);
const defOpts = Object.assign({
message: true,
isHeader: showHeader,
isTitle: showHeader,
isFooter: showFooter,
isColgroup: isGroup,
isMerge: hasMerge,
useStyle: true,
current: 'current',
modes: (proxyOpts.ajax && proxyOpts.ajax.queryAll ? ['all'] : []).concat(['current', 'selected', 'empty'])
}, options);
// 已废弃,参数 isAllExpand
if (XEUtils.isBoolean(defOpts.isAllExpand)) {
warnLog$4('vxe.error.delProp', ['isAllExpand', 'isTreeAllExpanded']);
defOpts.isTreeAllExpanded = defOpts.isAllExpand;
}
const types = defOpts.types || XEUtils.keys(exportOpts._typeMaps);
const modes = defOpts.modes || [];
const checkMethod = customOpts.checkMethod;
const exportColumns = collectColumn.slice(0);
const { columns, excludeFields, includeFields, extraFields } = defOpts;
// 处理类型
const typeList = types.map((value) => {
return {
value,
label: getI18n$4(`vxe.export.types.${value}`)
};
});
const modeList = modes.map((item) => {
if (item && item.value) {
return {
value: item.value,
label: item.label || item.value
};
}
return {
value: item,
label: getI18n$4(`vxe.export.modes.${item}`)
};
});
const excludeFdMaps = {};
if (excludeFields && excludeFields.length) {
excludeFields.forEach(field => {
excludeFdMaps[field] = 1;
});
}
const includeFdMaps = {};
if (includeFields && includeFields.length) {
includeFields.forEach(field => {
includeFdMaps[field] = 1;
});
}
const extraFdMaps = {};
if (extraFields) {
extraFields.forEach(field => {
extraFdMaps[field] = 1;
});
}
// 默认选中
// 优先级 columns > excludeFields > (includeFields || extraFields)
XEUtils.eachTree(exportColumns, (column, index, items, path, parentColumn) => {
const isColGroup = column.children && column.children.length > 0;
let isChecked = false;
const isExtraChecked = extraFdMaps[column.field];
if (columns) {
isChecked = handleFilterColumns(defOpts, column, columns);
}
else if (excludeFields || includeFields) {
isChecked = handleFilterFields(defOpts, column, includeFields, includeFdMaps, excludeFdMaps, extraFdMaps);
}
else {
if (isExtraChecked) {
isChecked = true;
}
else {
isChecked = column.visible && (isColGroup || defaultFilterExportColumn(column));
}
}
column.checked = isChecked;
column.halfChecked = false;
column.disabled = (parentColumn && parentColumn.disabled) || (checkMethod ? !checkMethod({ $table: $xeTable, column }) : false);
});
// 更新条件
exportStore.columns = exportColumns;
exportStore.typeList = typeList;
exportStore.modeList = modeList;
exportStore.hasFooter = hasFooter;
exportStore.hasMerge = hasMerge;
exportStore.hasTree = hasTree;
exportStore.hasRowGroup = hasRowGroup;
exportStore.isPrint = !!isPrint;
exportStore.hasColgroup = isGroup;
exportStore.visible = true;
// 默认参数
Object.assign(exportParams, {
mode: selectRecords.length ? 'selected' : 'current'
}, defOpts);
const { filename, sheetName, mode, type } = exportParams;
if (filename) {
if (XEUtils.isFunction(filename)) {
exportParams.filename = filename({
options: defOpts,
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt
});
}
else {
exportParams.filename = `${filename}`;
}
}
if (sheetName) {
if (XEUtils.isFunction(sheetName)) {
exportParams.sheetName = sheetName({
options: defOpts,
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt
});
}
else {
exportParams.sheetName = `${sheetName}`;
}
}
if (!modeList.some(item => item.value === mode)) {
exportParams.mode = modeList[0].value;
}
if (!typeList.some(item => item.value === type)) {
exportParams.type = typeList[0].value;
}
if (!exportParams.widthMode) {
exportParams.widthMode = '';
}
initStore.export = true;
return nextTick();
};
const handleCloseExport = () => {
if (VxeUI.modal) {
return VxeUI.modal.close('VXE_EXPORT_MODAL');
}
return Promise.resolve();
};
const exportMethods = {
/**
* 导出文件,支持 csv/html/xml/txt
* 如果是树表格,则默认是导出所有节点
* 如果是启用了虚拟滚动,则只能导出数据源,可以配合 dataFilterMethod 函数转换数据
* @param {Object} options 参数
*/
exportData(options) {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const $xeGGWrapper = $xeGrid || $xeGantt;
const { treeConfig, showHeader, showFooter } = props;
const { isGroup } = reactData;
const { tableFullColumn, afterFullData, afterTreeFullData, collectColumn, mergeBodyList, mergeFooterList } = internalData;
const exportOpts = computeExportOpts.value;
const treeOpts = computeTreeOpts.value;
const proxyOpts = $xeGGWrapper ? $xeGGWrapper.getComputeMaps().computeProxyOpts.value : {};
const hasMerge = !!(mergeBodyList.length || mergeFooterList.length);
const opts = Object.assign({
message: true,
isHeader: showHeader,
isTitle: showHeader,
isFooter: showFooter,
isColgroup: isGroup,
isMerge: hasMerge,
useStyle: true,
current: 'current',
modes: (proxyOpts.ajax && proxyOpts.ajax.queryAll ? ['all'] : []).concat(['current', 'selected', 'empty']),
download: true,
type: 'csv'
// filename: '',
// sheetName: '',
// original: false,
// isTreeAllExpanded: false,
// isRowGroupAllExpanded: false,
// data: null,
// remote: false,
// dataFilterMethod: null,
// footerFilterMethod: null,
// exportMethod: null,
// columnFilterMethod: null,
// beforeExportMethod: null,
// afterExportMethod: null
}, exportOpts, options);
// 已废弃,参数 isAllExpand
if (XEUtils.isBoolean(opts.isAllExpand)) {
warnLog$4('vxe.error.delProp', ['isAllExpand', 'isTreeAllExpanded']);
opts.isTreeAllExpanded = opts.isAllExpand;
}
let { filename, sheetName, type, mode, columns, columnFilterMethod, beforeExportMethod, includeFields, excludeFields, extraFields } = opts;
let groups = [];
const selectRecords = $xeTable.getCheckboxRecords();
if (!mode) {
mode = selectRecords.length ? 'selected' : 'current';
}
const excludeFdMaps = {};
if (excludeFields && excludeFields.length) {
excludeFields.forEach(field => {
excludeFdMaps[field] = 1;
});
}
const includeFdMaps = {};
if (includeFields && includeFields.length) {
includeFields.forEach(field => {
includeFdMaps[field] = 1;
});
}
const extraFdMaps = {};
if (extraFields) {
extraFields.forEach(field => {
extraFdMaps[field] = 1;
});
}
let isCustomCol = false;
let customCols = [];
if (columns) {
isCustomCol = true;
customCols = XEUtils.searchTree(columns, () => true, { children: 'children', mapChildren: 'childNodes', original: true });
}
else {
customCols = XEUtils.searchTree(collectColumn, column => {
const isColGroup = column.children && column.children.length > 0;
let isChecked = false;
const isExtraChecked = extraFdMaps[column.field];
if (columns) {
isChecked = handleFilterColumns(opts, column, columns);
}
else if (excludeFields || includeFields) {
isChecked = handleFilterFields(opts, column, includeFields, includeFdMaps, excludeFdMaps, extraFdMaps);
}
else {
if (isExtraChecked) {
isChecked = true;
}
else {
isChecked = column.visible && (isColGroup || defaultFilterExportColumn(column));
}
}
return isChecked;
}, { children: 'children', mapChildren: 'childNodes', original: true });
}
const handleOptions = Object.assign({}, opts, { filename: '', sheetName: '', _columnConfs: columns });
// 如果设置源数据,则默认导出设置了字段的列
if (!isCustomCol && !columnFilterMethod) {
columnFilterMethod = ({ column }) => handleFilterFields(handleOptions, column, includeFields, includeFdMaps, excludeFdMaps, extraFdMaps);
handleOptions.columnFilterMethod = columnFilterMethod;
}
if (customCols) {
handleOptions._isCustomColumn = true;
groups = XEUtils.searchTree(XEUtils.mapTree(customCols, (item) => {
let targetColumn;
if (item) {
if (isColumnInfo(item)) {
targetColumn = item;
}
else if (XEUtils.isString(item)) {
targetColumn = $xeTable.getColumnByField(item);
}
else {
const colid = item.id || item.colId;
const type = item.type;
const field = item.field;
if (colid) {
targetColumn = $xeTable.getColumnById(colid);
}
else if (field && type) {
targetColumn = tableFullColumn.find((column) => column.field === field && column.type === type);
}
else if (field) {
targetColumn = $xeTable.getColumnByField(field);
}
else if (type) {
targetColumn = tableFullColumn.find((column) => column.type === type);
}
}
return targetColumn || {};
}
}, {
children: 'childNodes',
mapChildren: '_children'
}), (column, index) => isColumnInfo(column) && (!columnFilterMethod || columnFilterMethod({ $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt, column: column, $columnIndex: index })), {
children: '_children',
mapChildren: 'childNodes',
original: true
});
}
else {
groups = XEUtils.searchTree(isGroup ? collectColumn : tableFullColumn, (column, index) => column.visible && (!columnFilterMethod || columnFilterMethod({ $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt, column, $columnIndex: index })), { children: 'children', mapChildren: 'childNodes', original: true });
}
// 获取所有列
const cols = [];
XEUtils.eachTree(groups, column => {
const isColGroup = column.children && column.children.length;
if (!isColGroup) {
cols.push(column);
}
}, { children: 'childNodes' });
// 构建分组层级
handleOptions.columns = cols;
handleOptions.colgroups = convertToRows(groups);
if (filename) {
if (XEUtils.isFunction(filename)) {
handleOptions.filename = filename({
options: opts,
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt
});
}
else {
handleOptions.filename = `${filename}`;
}
}
if (!handleOptions.filename) {
handleOptions.filename = getI18n$4(handleOptions.original ? 'vxe.table.expOriginFilename' : 'vxe.table.expFilename', [XEUtils.toDateString(Date.now(), 'yyyyMMddHHmmss')]);
}
if (sheetName) {
if (XEUtils.isFunction(sheetName)) {
handleOptions.sheetName = sheetName({
options: opts,
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt
});
}
else {
handleOptions.sheetName = `${sheetName}`;
}
}
if (!handleOptions.sheetName) {
handleOptions.sheetName = document.title || '';
}
// 检查类型,如果为自定义导出,则不需要校验类型
if (!handleOptions.exportMethod && !XEUtils.includes(XEUtils.keys(exportOpts._typeMaps), type)) {
errLog$5('vxe.error.notType', [type]);
if (['xlsx', 'pdf'].includes(type)) {
warnLog$4('vxe.error.reqPlugin', [4, 'plugin-export-xlsx']);
}
const params = { status: false, msg: 'type error' };
return Promise.reject(params);
}
if (!handleOptions.print) {
if (beforeExportMethod) {
const beRest = beforeExportMethod({ options: handleOptions, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt });
if (XEUtils.isBoolean(beRest)) {
if (!beRest) {
const params = { status: false, msg: 'before prevent' };
return Promise.reject(params);
}
}
else {
warnLog$4('vxe.error.returnErr', ['beforeExportMethod', 'boolean', beRest]);
}
}
}
if (!handleOptions.data) {
handleOptions.data = [];
if (mode === 'selected') {
if (['html', 'pdf'].indexOf(type) > -1 && treeConfig) {
handleOptions.data = XEUtils.searchTree($xeTable.getTableData().fullData, item => $xeTable.findRowIndexOf(selectRecords, item) > -1, Object.assign({}, treeOpts, { data: '_row' }));
}
else {
handleOptions.data = selectRecords;
}
}
else if (mode === 'all') {
if (!$xeGGWrapper) {
errLog$5('vxe.error.errProp', ['all', 'mode=current,selected']);
}
if ($xeGGWrapper && !handleOptions.remote) {
const gridReactData = $xeGGWrapper.reactData;
const { computeProxyOpts } = $xeGGWrapper.getComputeMaps();
const proxyOpts = computeProxyOpts.value;
const { sortData } = gridReactData;
const { beforeQueryAll: oldBeforeQueryAll, afterQueryAll: oldAfterQueryAll, ajax = {} } = proxyOpts;
const resConfigs = proxyOpts.response || proxyOpts.props || {};
const beforeQueryAllMethod = ajax.beforeQueryAll;
const queryAllMethod = ajax.queryAll;
const afterQueryAllMethod = ajax.afterQueryAll;
const queryAllSuccessMethod = ajax.queryAllSuccess;
const queryAllErrorMethod = ajax.queryAllError;
if (!queryAllMethod) {
errLog$5('vxe.error.notFunc', ['proxy-config.ajax.queryAll']);
}
if (queryAllMethod) {
const params = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt,
sort: sortData.length ? sortData[0] : {},
sorts: sortData,
filters: gridReactData.filterData,
form: gridReactData.formData,
options: handleOptions
};
const handleQueryAll = () => {
return Promise.resolve((oldBeforeQueryAll || queryAllMethod)(params))
.then((rest) => {
if (afterQueryAllMethod) {
afterQueryAllMethod(Object.assign(Object.assign({}, params), { response: rest, status: 'success' }));
}
else {
const listProp = resConfigs.list;
let tdData = [];
if (listProp) {
if (XEUtils.isFunction(listProp)) {
tdData = listProp({ data: rest, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt });
}
else {
tdData = XEUtils.isArray(rest) ? rest : XEUtils.get(rest, listProp);
}
}
else {
if (XEUtils.isArray(rest)) {
tdData = rest;
}
}
handleOptions.data = tdData;
if (oldAfterQueryAll) {
oldAfterQueryAll(Object.assign(Object.assign({}, params), { response: rest }));
}
}
if (queryAllSuccessMethod) {
queryAllSuccessMethod(Object.assign(Object.assign({}, params), { response: rest }));
}
return handleExport(handleOptions);
})
.catch((rest) => {
if (afterQueryAllMethod) {
afterQueryAllMethod(Object.assign(Object.assign({}, params), { response: rest, status: 'error' }));
}
if (queryAllErrorMethod) {
queryAllErrorMethod(Object.assign(Object.assign({}, params), { response: rest }));
}
});
};
if (beforeQueryAllMethod) {
return Promise.resolve(beforeQueryAllMethod(params)).then(status => {
if (status !== false) {
return handleQueryAll();
}
});
}
return handleQueryAll();
}
}
}
if (mode === 'current') {
handleOptions.data = treeConfig ? afterTreeFullData : afterFullData;
}
}
else {
handleOptions._isCustomData = true;
}
return handleExport(handleOptions);
},
importByFile(file, options) {
const opts = Object.assign({}, options);
const { beforeImportMethod } = opts;
if (beforeImportMethod) {
const biRest = beforeImportMethod({ options: opts, $table: $xeTable });
if (XEUtils.isBoolean(biRest)) {
if (!biRest) {
const params = { status: false, mas: 'before prevent' };
return Promise.reject(params);
}
}
else {
warnLog$4('vxe.error.returnErr', ['beforeImportMethod', 'boolean', biRest]);
}
}
return handleFileImport(file, opts);
},
importData(options) {
const importOpts = computeImportOpts.value;
const opts = Object.assign({
types: XEUtils.keys(importOpts._typeMaps)
// beforeImportMethod: null,
// afterImportMethod: null
}, importOpts, options);
const { beforeImportMethod, afterImportMethod } = opts;
if (beforeImportMethod) {
const biRest = beforeImportMethod({ options: opts, $table: $xeTable });
if (XEUtils.isBoolean(biRest)) {
if (!biRest) {
const params = { status: false, mas: 'before prevent' };
return Promise.reject(params);
}
}
else {
warnLog$4('vxe.error.returnErr', ['beforeImportMethod', 'boolean', biRest]);
}
}
return VxeUI.readFile(opts).catch(e => {
if (afterImportMethod) {
afterImportMethod({ status: false, options: opts, $table: $xeTable });
}
return Promise.reject(e);
}).then((params) => {
const { file } = params;
return handleFileImport(file, opts);
});
},
saveFile(options) {
return VxeUI.saveFile(options);
},
readFile(options) {
return VxeUI.readFile(options);
},
print(options) {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const printOpts = computePrintOpts.value;
const opts = Object.assign({
original: false
// beforePrintMethod
}, printOpts, options, {
type: 'html',
download: false,
remote: false,
print: true
});
const { sheetName } = opts;
let printTitle = '';
if (sheetName) {
if (XEUtils.isFunction(sheetName)) {
printTitle = sheetName({
options: opts,
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt
});
}
else {
printTitle = `${sheetName}`;
}
}
if (!printTitle) {
printTitle = document.title || '';
}
const beforePrintMethod = opts.beforePrintMethod;
const printMethod = opts.printMethod;
const tableHtml = opts.html || opts.content;
return new Promise((resolve, reject) => {
if (VxeUI.print) {
if (tableHtml) {
resolve(VxeUI.print({
title: printTitle,
html: tableHtml,
customStyle: opts.style,
beforeMethod: beforePrintMethod
? ({ html }) => {
return beforePrintMethod({
html,
content: html,
options: opts,
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt
});
}
: undefined,
beforePrintMethod: beforePrintMethod
? ({ html }) => {
return beforePrintMethod({
html,
content: html,
options: opts,
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt
});
}
: undefined,
printMethod: printMethod
? ({ html }) => {
return printMethod({
html,
content: html,
options: opts,
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt
});
}
: undefined
}));
}
else {
resolve(exportMethods.exportData(opts).then(({ content }) => {
return VxeUI.print({
title: printTitle,
html: content,
customStyle: opts.style,
beforeMethod: beforePrintMethod
? ({ html }) => {
return beforePrintMethod({
html,
content: html,
options: opts,
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt
});
}
: undefined,
beforePrintMethod: beforePrintMethod
? ({ html }) => {
return beforePrintMethod({
html,
content: html,
options: opts,
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt
});
}
: undefined,
printMethod: printMethod
? ({ html }) => {
return printMethod({
html,
content: html,
options: opts,
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt
});
}
: undefined
});
}));
}
}
else {
errLog$5('vxe.error.reqComp', ['vxe-print']);
const e = { status: false, msg: 'print not exist' };
reject(e);
}
});
},
getPrintHtml(options) {
const printOpts = computePrintOpts.value;
const opts = Object.assign({
original: false
// beforePrintMethod
}, printOpts, options, {
type: 'html',
download: false,
remote: false,
print: true
});
return $xeTable.exportData(opts).then(({ content }) => {
return {
html: content
};
});
},
closeImport() {
if (VxeUI.modal) {
return VxeUI.modal.close('VXE_IMPORT_MODAL');
}
return Promise.resolve();
},
openImport(options) {
const { treeConfig, importConfig } = props;
const { initStore, importStore, importParams } = reactData;
const importOpts = computeImportOpts.value;
const defOpts = Object.assign({
mode: 'insertTop',
message: true,
types: XEUtils.keys(importOpts._typeMaps),
modes: ['insertTop', 'covering']
}, importOpts, options);
const types = defOpts.types || [];
const modes = defOpts.modes || [];
const isTree = !!treeConfig;
if (isTree) {
if (defOpts.message) {
if (VxeUI.modal) {
VxeUI.modal.message({ content: getI18n$4('vxe.error.treeNotImp'), status: 'error' });
}
}
return;
}
if (!importConfig) {
errLog$5('vxe.error.reqProp', ['import-config']);
}
// 处理类型
const typeList = types.map((value) => {
return {
value,
label: getI18n$4(`vxe.export.types.${value}`)
};
});
const modeList = modes.map((item) => {
if (item && item.value) {
return {
value: item.value,
label: item.label || item.value
};
}
return {
value: item,
label: getI18n$4(`vxe.import.modes.${item}`)
};
});
Object.assign(importStore, {
file: null,
type: '',
filename: '',
modeList,
typeList,
visible: true
});
Object.assign(importParams, defOpts);
if (!modeList.some(item => item.value === importParams.mode)) {
importParams.mode = modeList[0].value;
}
initStore.import = true;
},
closeExport: handleCloseExport,
openExport(options) {
const exportOpts = computeExportOpts.value;
const defOpts = Object.assign({
message: true,
types: XEUtils.keys(exportOpts._typeMaps)
}, exportOpts, options);
if (!props.exportConfig) {
errLog$5('vxe.error.reqProp', ['export-config']);
}
return handleExportAndPrint(defOpts);
},
closePrint: handleCloseExport,
openPrint(options) {
const printOpts = computePrintOpts.value;
const defOpts = Object.assign({
message: true
}, printOpts, options);
if (!props.printConfig) {
errLog$5('vxe.error.reqProp', ['print-config']);
}
return handleExportAndPrint(defOpts, true);
}
};
return exportMethods;
},
setupGrid($xeGrid) {
return $xeGrid.extendTableMethods(tableExportMethodKeys);
},
setupGantt($xeGantt) {
return $xeGantt.extendTableMethods(tableExportMethodKeys);
}
});
const { hooks: hooks$3 } = VxeUI;
hooks$3.add('tableKeyboardModule', {
setupTable($xeTable) {
const { props, reactData, internalData } = $xeTable;
const { refElem, refTableBody } = $xeTable.getRefMaps();
const { computeEditOpts, computeCheckboxOpts, computeMouseOpts, computeTreeOpts, computeRowOpts, computeColumnOpts, computeCellOpts, computeDefaultRowHeight, computeCurrentRowOpts, computeCurrentColumnOpts } = $xeTable.getComputeMaps();
function getCheckboxRangeRows(evnt, params, targetTrElem, trRect, offsetClientTop, moveRange) {
const { showOverflow } = props;
const { fullAllDataRowIdData, isResizeCellHeight } = internalData;
const rowOpts = computeRowOpts.value;
const cellOpts = computeCellOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const { row } = params;
let countHeight = 0;
let rangeRows = [];
let moveSize = 0;
const isDown = moveRange > 0;
const { scrollYLoad } = reactData;
const { afterFullData } = internalData;
if (isDown) {
moveSize = offsetClientTop + moveRange;
}
else {
moveSize = (trRect.height - offsetClientTop) + Math.abs(moveRange);
}
if (scrollYLoad) {
const _rowIndex = $xeTable.getVTRowIndex(row);
const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height;
if (!isCustomCellHeight && showOverflow) {
if (isDown) {
rangeRows = afterFullData.slice(_rowIndex, _rowIndex + Math.ceil(moveSize / defaultRowHeight));
}
else {
rangeRows = afterFullData.slice(_rowIndex - Math.floor(moveSize / defaultRowHeight), _rowIndex + 1);
}
}
else {
if (isDown) {
for (let i = _rowIndex; i < afterFullData.length; i++) {
const item = afterFullData[i];
const rowid = $xeTable.getRowid(item);
const rowRest = fullAllDataRowIdData[rowid] || {};
countHeight += rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight;
rangeRows.push(item);
if (countHeight > moveSize) {
return rangeRows;
}
}
}
else {
for (let len = _rowIndex; len >= 0; len--) {
const item = afterFullData[len];
const rowid = $xeTable.getRowid(item);
const rowRest = fullAllDataRowIdData[rowid] || {};
countHeight += rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight;
rangeRows.push(item);
if (countHeight > moveSize) {
return rangeRows;
}
}
}
}
}
else {
const siblingProp = isDown ? 'next' : 'previous';
while (targetTrElem && countHeight < moveSize) {
const rowNodeRest = $xeTable.getRowNode(targetTrElem);
if (rowNodeRest) {
rangeRows.push(rowNodeRest.item);
countHeight += targetTrElem.offsetHeight;
targetTrElem = targetTrElem[`${siblingProp}ElementSibling`];
}
}
}
return rangeRows;
}
const handleCheckboxRangeEvent = (evnt, params) => {
const { elemStore } = internalData;
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const leftScrollElem = getRefElem(elemStore['left-body-scroll']);
const rightScrollElem = getRefElem(elemStore['right-body-scroll']);
const { column, cell } = params;
if (column.type === 'checkbox') {
let bodyWrapperElem = bodyScrollElem;
if (leftScrollElem && column.fixed === 'left') {
bodyWrapperElem = leftScrollElem;
}
else if (rightScrollElem && column.fixed === 'right') {
bodyWrapperElem = rightScrollElem;
}
if (!bodyWrapperElem) {
return;
}
const bodyRect = bodyWrapperElem.getBoundingClientRect();
const el = refElem.value;
const disX = evnt.clientX;
const disY = evnt.clientY;
const checkboxRangeElem = bodyWrapperElem.querySelector('.vxe-table--checkbox-range');
const trElem = cell.parentElement;
const selectRecords = $xeTable.getCheckboxRecords();
let lastRangeRows = [];
const marginSize = 1;
const startTop = evnt.clientY - bodyRect.y + bodyWrapperElem.scrollTop;
const startLeft = evnt.clientX - bodyRect.x + bodyWrapperElem.scrollLeft;
const startScrollTop = bodyWrapperElem.scrollTop;
const rowHeight = trElem.offsetHeight;
const trRect = trElem.getBoundingClientRect();
const offsetClientTop = disY - trRect.y;
let mouseScrollTimeout = null;
let isMouseScrollDown = false;
let mouseScrollSpaceSize = 1;
const triggerEvent = (type, evnt) => {
$xeTable.dispatchEvent(`checkbox-range-${type}`, {
records: () => $xeTable.getCheckboxRecords(),
reserves: () => $xeTable.getCheckboxReserveRecords()
}, evnt);
};
const handleChecked = (evnt) => {
const { clientX, clientY } = evnt;
const offsetLeft = clientX - disX;
const offsetTop = clientY - disY + (bodyWrapperElem.scrollTop - startScrollTop);
let rangeHeight = Math.abs(offsetTop);
let rangeWidth = Math.abs(offsetLeft);
let rangeTop = startTop;
let rangeLeft = startLeft;
if (offsetTop < marginSize) {
// 向上
rangeTop += offsetTop;
if (rangeTop < marginSize) {
rangeTop = marginSize;
rangeHeight = startTop;
}
}
else {
// 向下
rangeHeight = Math.min(rangeHeight, bodyWrapperElem.scrollHeight - startTop - marginSize);
}
if (offsetLeft < marginSize) {
// 向左
rangeLeft += offsetLeft;
if (rangeWidth > startLeft) {
rangeLeft = marginSize;
rangeWidth = startLeft;
}
}
else {
// 向右
rangeWidth = Math.min(rangeWidth, bodyWrapperElem.clientWidth - startLeft - marginSize);
}
checkboxRangeElem.style.height = `${rangeHeight}px`;
checkboxRangeElem.style.width = `${rangeWidth}px`;
checkboxRangeElem.style.left = `${rangeLeft}px`;
checkboxRangeElem.style.top = `${rangeTop}px`;
checkboxRangeElem.style.display = 'block';
const rangeRows = getCheckboxRangeRows(evnt, params, trElem, trRect, offsetClientTop, offsetTop < marginSize ? -rangeHeight : rangeHeight);
// 至少滑动 10px 才能有效匹配
if (rangeHeight > 10 && rangeRows.length !== lastRangeRows.length) {
const isControlKey = hasControlKey(evnt);
lastRangeRows = rangeRows;
if (isControlKey) {
rangeRows.forEach((row) => {
$xeTable.handleBatchSelectRows([row], selectRecords.indexOf(row) === -1);
});
}
else {
$xeTable.setAllCheckboxRow(false);
$xeTable.handleCheckedCheckboxRow(rangeRows, true, false);
}
triggerEvent('change', evnt);
}
};
// 停止鼠标滚动
const stopMouseScroll = () => {
clearTimeout(mouseScrollTimeout);
mouseScrollTimeout = null;
};
// 开始鼠标滚动
const startMouseScroll = (evnt) => {
stopMouseScroll();
mouseScrollTimeout = setTimeout(() => {
if (mouseScrollTimeout) {
const { scrollLeft, scrollTop, clientHeight, scrollHeight } = bodyWrapperElem;
const topSize = Math.ceil(mouseScrollSpaceSize * 50 / rowHeight);
if (isMouseScrollDown) {
if (scrollTop + clientHeight < scrollHeight) {
$xeTable.scrollTo(scrollLeft, scrollTop + topSize);
startMouseScroll(evnt);
handleChecked(evnt);
}
else {
stopMouseScroll();
}
}
else {
if (scrollTop) {
$xeTable.scrollTo(scrollLeft, scrollTop - topSize);
startMouseScroll(evnt);
handleChecked(evnt);
}
else {
stopMouseScroll();
}
}
}
}, 50);
};
addClass(el, 'drag--range');
document.onmousemove = evnt => {
evnt.preventDefault();
evnt.stopPropagation();
const { clientY } = evnt;
const { boundingTop } = getAbsolutePos(bodyWrapperElem);
// 如果超过可视区,触发滚动
if (clientY < boundingTop) {
isMouseScrollDown = false;
mouseScrollSpaceSize = boundingTop - clientY;
if (!mouseScrollTimeout) {
startMouseScroll(evnt);
}
}
else if (clientY > boundingTop + bodyWrapperElem.clientHeight) {
isMouseScrollDown = true;
mouseScrollSpaceSize = clientY - boundingTop - bodyWrapperElem.clientHeight;
if (!mouseScrollTimeout) {
startMouseScroll(evnt);
}
}
else if (mouseScrollTimeout) {
stopMouseScroll();
}
handleChecked(evnt);
};
document.onmouseup = (evnt) => {
stopMouseScroll();
removeClass(el, 'drag--range');
checkboxRangeElem.removeAttribute('style');
document.onmousemove = null;
document.onmouseup = null;
triggerEvent('end', evnt);
};
triggerEvent('start', evnt);
}
};
const handleCellMousedownEvent = (evnt, params) => {
const { editConfig, checkboxConfig, mouseConfig } = props;
const checkboxOpts = computeCheckboxOpts.value;
const mouseOpts = computeMouseOpts.value;
const editOpts = computeEditOpts.value;
if (mouseConfig && mouseOpts.area && $xeTable.triggerClAreaMnEvent) {
return $xeTable.triggerClAreaMnEvent(evnt, params);
}
else {
if (checkboxConfig && checkboxOpts.range) {
handleCheckboxRangeEvent(evnt, params);
}
if (mouseConfig && mouseOpts.selected) {
if (!editConfig || editOpts.mode === 'cell') {
$xeTable.handleSelected(params, evnt);
}
}
}
};
const handleMoveSelected = (evnt, args, isLeftArrow, isUpArrow, isRightArrow, isDwArrow) => {
const { afterFullData, visibleColumn } = internalData;
const params = Object.assign({}, args);
const { row, column } = params;
const _rowIndex = $xeTable.getVTRowIndex(row);
const _columnIndex = $xeTable.getVTColumnIndex(column);
const tableBody = refTableBody.value;
const tableBodyElem = tableBody ? tableBody.$el : null;
const tableWidth = tableBodyElem ? tableBodyElem.clientWidth : 0;
let colAlign = isLeftArrow || isRightArrow || (column.renderWidth < tableWidth);
if ((isLeftArrow && _columnIndex >= 0) || (isRightArrow && _columnIndex <= visibleColumn.length - 1)) {
colAlign = false;
}
else {
evnt.preventDefault();
}
if (isUpArrow && _rowIndex > 0) {
// 移动到上一行
params.rowIndex = _rowIndex - 1;
params.row = afterFullData[params.rowIndex];
}
else if (isDwArrow && _rowIndex < afterFullData.length - 1) {
// 移动到下一行
params.rowIndex = _rowIndex + 1;
params.row = afterFullData[params.rowIndex];
}
else if (isLeftArrow && _columnIndex) {
// 移动到左侧单元格
params.columnIndex = _columnIndex - 1;
params.column = visibleColumn[params.columnIndex];
}
else if (isRightArrow && _columnIndex < visibleColumn.length - 1) {
// 移动到右侧单元格
params.columnIndex = _columnIndex + 1;
params.column = visibleColumn[params.columnIndex];
}
$xeTable.scrollToRow(params.row, params.column, {
colAlign
}).then(() => {
params.cell = $xeTable.getCellElement(params.row, params.column);
$xeTable.handleSelected(params, evnt);
});
return params;
};
const keyboardMethods = {
// 处理 Tab 键移动
moveTabSelected(args, isLeft, evnt) {
const { editConfig } = props;
const { afterFullData, visibleColumn } = internalData;
const editOpts = computeEditOpts.value;
const rowOpts = computeRowOpts.value;
const currentRowOpts = computeCurrentRowOpts.value;
const columnOpts = computeColumnOpts.value;
const currentColumnOpts = computeCurrentColumnOpts.value;
let targetRow;
let targetRowIndex;
let targetColumnIndex;
const params = Object.assign({}, args);
const _rowIndex = $xeTable.getVTRowIndex(params.row);
const _columnIndex = $xeTable.getVTColumnIndex(params.column);
evnt.preventDefault();
if (isLeft) {
// 向左
if (_columnIndex <= 0) {
// 如果已经是第一列,则移动到上一行
if (_rowIndex > 0) {
targetRowIndex = _rowIndex - 1;
targetRow = afterFullData[targetRowIndex];
targetColumnIndex = visibleColumn.length - 1;
}
}
else {
targetColumnIndex = _columnIndex - 1;
}
}
else {
if (_columnIndex >= visibleColumn.length - 1) {
// 如果已经是第一列,则移动到上一行
if (_rowIndex < afterFullData.length - 1) {
targetRowIndex = _rowIndex + 1;
targetRow = afterFullData[targetRowIndex];
targetColumnIndex = 0;
}
}
else {
targetColumnIndex = _columnIndex + 1;
}
}
const targetColumn = visibleColumn[targetColumnIndex];
if (targetColumn) {
if (targetRow) {
params.rowIndex = targetRowIndex;
params.row = targetRow;
}
else {
params.rowIndex = _rowIndex;
}
params.columnIndex = targetColumnIndex;
params.column = targetColumn;
params.cell = $xeTable.getCellElement(params.row, params.column);
if (rowOpts.isCurrent && currentRowOpts.isFollowSelected) {
$xeTable.triggerCurrentRowEvent(evnt, params);
}
if (columnOpts.isCurrent && currentColumnOpts.isFollowSelected) {
$xeTable.triggerCurrentColumnEvent(evnt, params);
}
if (editConfig) {
if (editOpts.trigger === 'click' || editOpts.trigger === 'dblclick') {
if (editOpts.mode === 'row') {
$xeTable.handleEdit(params, evnt);
}
else {
$xeTable.scrollToRow(params.row, params.column).then(() => {
$xeTable.handleSelected(params, evnt);
});
}
}
}
else {
$xeTable.scrollToRow(params.row, params.column).then(() => {
$xeTable.handleSelected(params, evnt);
});
}
}
},
// 处理当前行方向键移动
moveCurrentRow(isUpArrow, isDwArrow, evnt) {
const { treeConfig } = props;
const { afterFullData, currentRow } = internalData;
const treeOpts = computeTreeOpts.value;
const childrenField = treeOpts.children || treeOpts.childrenField;
let targetRow;
if (currentRow) {
if (treeConfig) {
const { index, items } = XEUtils.findTree(afterFullData, item => item === currentRow, { children: childrenField });
if (isUpArrow && index > 0) {
targetRow = items[index - 1];
}
else if (isDwArrow && index < items.length - 1) {
targetRow = items[index + 1];
}
}
else {
const _rowIndex = $xeTable.getVTRowIndex(currentRow);
if (isUpArrow && _rowIndex > 0) {
targetRow = afterFullData[_rowIndex - 1];
}
else if (isDwArrow && _rowIndex < afterFullData.length - 1) {
targetRow = afterFullData[_rowIndex + 1];
}
}
}
else {
targetRow = afterFullData[0];
}
if (targetRow) {
evnt.preventDefault();
const params = {
$table: $xeTable,
row: targetRow,
rowIndex: $xeTable.getRowIndex(targetRow),
$rowIndex: $xeTable.getVMRowIndex(targetRow)
};
$xeTable.scrollToRow(targetRow)
.then(() => $xeTable.triggerCurrentRowEvent(evnt, params));
}
},
// 处理当前列方向键移动
moveCurrentColumn(isLeftArrow, isRightArrow, evnt) {
const { currentColumn } = reactData;
const { visibleColumn } = internalData;
let targetCol = null;
if (currentColumn) {
const _columnIndex = $xeTable.getVTColumnIndex(currentColumn);
if (isLeftArrow && _columnIndex > 0) {
targetCol = visibleColumn[_columnIndex - 1];
}
else if (isRightArrow && _columnIndex < visibleColumn.length - 1) {
targetCol = visibleColumn[_columnIndex + 1];
}
}
else {
targetCol = visibleColumn[0];
}
if (targetCol) {
evnt.preventDefault();
const params = {
$table: $xeTable,
column: targetCol,
columnIndex: $xeTable.getColumnIndex(targetCol),
$columnIndex: $xeTable.getVMColumnIndex(targetCol)
};
$xeTable.scrollToColumn(targetCol)
.then(() => $xeTable.triggerCurrentColumnEvent(evnt, params));
}
},
// 处理可编辑方向键移动
moveArrowSelected(args, isLeftArrow, isUpArrow, isRightArrow, isDwArrow, evnt) {
const { highlightCurrentRow, highlightCurrentColumn } = props;
const rowOpts = computeRowOpts.value;
const currentRowOpts = computeCurrentRowOpts.value;
const columnOpts = computeColumnOpts.value;
const currentColumnOpts = computeCurrentColumnOpts.value;
const params = handleMoveSelected(evnt, args, isLeftArrow, isUpArrow, isRightArrow, isDwArrow);
if (rowOpts.isCurrent || highlightCurrentRow) {
if (currentRowOpts.isFollowSelected) {
$xeTable.triggerCurrentRowEvent(evnt, params);
}
else {
// 当前行按键上下移动
if ((isUpArrow || isDwArrow) && (rowOpts.isCurrent || highlightCurrentRow)) {
$xeTable.moveCurrentRow(isUpArrow, isDwArrow, evnt);
}
}
}
if (columnOpts.isCurrent || highlightCurrentColumn) {
if (currentColumnOpts.isFollowSelected) {
$xeTable.triggerCurrentColumnEvent(evnt, params);
}
else {
// 当前行按键左右移动
if ((isLeftArrow || isRightArrow) && (columnOpts.isCurrent || highlightCurrentColumn)) {
$xeTable.moveCurrentColumn(isLeftArrow, isRightArrow, evnt);
}
}
}
},
moveEnterSelected(args, isLeftArrow, isUpArrow, isRightArrow, isDwArrow, evnt) {
const { highlightCurrentRow, highlightCurrentColumn } = props;
const rowOpts = computeRowOpts.value;
const currentRowOpts = computeCurrentRowOpts.value;
const columnOpts = computeColumnOpts.value;
const currentColumnOpts = computeCurrentColumnOpts.value;
const params = handleMoveSelected(evnt, args, isLeftArrow, isUpArrow, isRightArrow, isDwArrow);
if (((rowOpts.isCurrent || highlightCurrentRow) && currentRowOpts.isFollowSelected)) {
$xeTable.triggerCurrentRowEvent(evnt, params);
}
if ((columnOpts.isCurrent || highlightCurrentColumn) && currentColumnOpts.isFollowSelected) {
$xeTable.triggerCurrentColumnEvent(evnt, params);
}
},
// 已废弃,待删除
moveSelected(args, isLeftArrow, isUpArrow, isRightArrow, isDwArrow, evnt) {
handleMoveSelected(evnt, args, isLeftArrow, isUpArrow, isRightArrow, isDwArrow);
},
handleCellMousedownEvent
};
return keyboardMethods;
}
});
const { warnLog: warnLog$3, errLog: errLog$4 } = createComponentLog('table');
const { getConfig: getConfig$4, validators, hooks: hooks$2 } = VxeUI;
/**
* 校验规则
*/
class Rule {
constructor(rule) {
Object.assign(this, {
$options: rule,
required: rule.required,
min: rule.min,
max: rule.max,
type: rule.type,
pattern: rule.pattern,
validator: rule.validator,
trigger: rule.trigger,
maxWidth: rule.maxWidth
});
}
/**
* 获取校验不通过的消息
* 支持国际化翻译
*/
get content() {
return getFuncText(this.$options.content || this.$options.message);
}
get message() {
return this.content;
}
}
// 如果存在 pattern,判断正则
function validREValue(pattern, val) {
if (pattern && !(XEUtils.isRegExp(pattern) ? pattern : new RegExp(pattern)).test(val)) {
return false;
}
return true;
}
// 如果存在 max,判断最大值
function validMaxValue(max, num) {
if (!XEUtils.eqNull(max) && num > XEUtils.toNumber(max)) {
return false;
}
return true;
}
// 如果存在 min,判断最小值
function validMinValue(min, num) {
if (!XEUtils.eqNull(min) && num < XEUtils.toNumber(min)) {
return false;
}
return true;
}
function validRuleValue(rule, val, required) {
const { type, min, max, pattern } = rule;
const isArrType = type === 'array';
const isNumType = type === 'number';
const isStrType = type === 'string';
const strVal = `${val}`;
if (!validREValue(pattern, strVal)) {
return false;
}
if (isArrType) {
if (!XEUtils.isArray(val)) {
return false;
}
if (required) {
if (!val.length) {
return false;
}
}
if (!validMinValue(min, val.length)) {
return false;
}
if (!validMaxValue(max, val.length)) {
return false;
}
}
else if (isNumType) {
const numVal = Number(val);
if (isNaN(numVal)) {
return false;
}
if (!validMinValue(min, numVal)) {
return false;
}
if (!validMaxValue(max, numVal)) {
return false;
}
}
else {
if (isStrType) {
if (!XEUtils.isString(val)) {
return false;
}
}
if (required) {
if (!strVal) {
return false;
}
}
if (!validMinValue(min, strVal.length)) {
return false;
}
if (!validMaxValue(max, strVal.length)) {
return false;
}
}
return true;
}
function checkRuleStatus(rule, row, val) {
const { required, field } = rule;
const currVal = field ? XEUtils.get(row, field) : val;
const isEmptyVal = XEUtils.isArray(currVal) ? !currVal.length : eqEmptyValue(currVal);
if (required) {
if (isEmptyVal) {
return false;
}
if (!validRuleValue(rule, currVal, required)) {
return false;
}
}
else {
if (!isEmptyVal) {
if (!validRuleValue(rule, currVal, required)) {
return false;
}
}
}
return true;
}
const tableValidatorMethodKeys = ['fullValidate', 'validate', 'fullValidateField', 'validateField', 'clearValidate'];
hooks$2.add('tableValidatorModule', {
setupTable($xeTable) {
const { props, reactData, internalData } = $xeTable;
const { refValidTooltip } = $xeTable.getRefMaps();
const { computeValidOpts, computeTreeOpts, computeEditOpts, computeAggregateOpts } = $xeTable.getComputeMaps();
let validatorMethods = {};
let validatorPrivateMethods = {};
/**
* 聚焦到校验通过的单元格并弹出校验错误提示
*/
const handleValidError = (params) => {
return new Promise(resolve => {
const validOpts = computeValidOpts.value;
if (validOpts.autoPos === false) {
$xeTable.dispatchEvent('valid-error', params, null);
resolve();
}
else {
$xeTable.handleEdit(params, { type: 'valid-error', trigger: 'call' }).then(() => {
resolve($xeTable.showValidTooltip(params));
});
}
});
};
const handleErrMsgMode = (validErrMaps) => {
const validOpts = computeValidOpts.value;
if (validOpts.msgMode === 'single') {
const keys = Object.keys(validErrMaps);
const resMaps = {};
if (keys.length) {
const firstKey = keys[0];
resMaps[firstKey] = validErrMaps[firstKey];
}
return resMaps;
}
return validErrMaps;
};
/**
* 对表格数据进行校验
* 如果不指定数据,则默认只校验临时变动的数据,例如新增或修改
* 如果传 true 则校验当前表格数据
* 如果传 row 指定行记录,则只验证传入的行
* 如果传 rows 为多行记录,则只验证传入的行
* 如果只传 callback 否则默认验证整个表格数据
* 返回 Promise 对象,或者使用回调方式
*/
const beginValidate = (rows, cols, cb, isFull) => {
const validRest = {};
const { editRules, treeConfig } = props;
const { isRowGroupStatus } = reactData;
const { afterFullData, pendingRowMaps, removeRowMaps } = internalData;
const treeOpts = computeTreeOpts.value;
const aggregateOpts = computeAggregateOpts.value;
const validOpts = computeValidOpts.value;
let validList;
if (rows === true) {
validList = afterFullData;
}
else if (rows) {
if (XEUtils.isFunction(rows)) {
cb = rows;
}
else {
validList = XEUtils.isArray(rows) ? rows : [rows];
}
}
if (!validList) {
if ($xeTable.getInsertRecords) {
validList = $xeTable.getInsertRecords().concat($xeTable.getUpdateRecords());
}
else {
validList = [];
}
}
const rowValidErrs = [];
internalData._lastCallTime = Date.now();
internalData.validRuleErr = false; // 如果为快速校验,当存在某列校验不通过时将终止执行
$xeTable.clearValidate();
const validErrMaps = {};
if (editRules) {
const columns = cols && cols.length ? cols : $xeTable.getColumns();
const handleVaild = (row) => {
const rowid = getRowid($xeTable, row);
// 是否删除
if (removeRowMaps[rowid]) {
return;
}
// 是否标记删除
if (pendingRowMaps[rowid]) {
return;
}
if ($xeTable.isAggregateRecord(row)) {
return;
}
if (isFull || !internalData.validRuleErr) {
const colVailds = [];
columns.forEach((column) => {
const field = XEUtils.isString(column) ? column : column.field;
if ((isFull || !internalData.validRuleErr) && XEUtils.has(editRules, field)) {
colVailds.push(validatorPrivateMethods.validCellRules('all', row, column)
.catch(({ rule, rules }) => {
const rest = {
rule,
rules,
rowIndex: $xeTable.getRowIndex(row),
row,
columnIndex: $xeTable.getColumnIndex(column),
column,
field,
$table: $xeTable
};
if (!validRest[field]) {
validRest[field] = [];
}
validErrMaps[`${getRowid($xeTable, row)}:${column.id}`] = {
column,
row,
rule,
content: rule.content
};
validRest[field].push(rest);
if (!isFull) {
internalData.validRuleErr = true;
return Promise.reject(rest);
}
}));
}
});
rowValidErrs.push(Promise.all(colVailds));
}
};
if (isRowGroupStatus) {
XEUtils.eachTree(validList, handleVaild, { children: aggregateOpts.mapChildrenField });
}
else if (treeConfig) {
const childrenField = treeOpts.children || treeOpts.childrenField;
XEUtils.eachTree(validList, handleVaild, { children: childrenField });
}
else {
validList.forEach(handleVaild);
}
return Promise.all(rowValidErrs).then(() => {
const ruleProps = Object.keys(validRest);
reactData.validErrorMaps = handleErrMsgMode(validErrMaps);
return nextTick().then(() => {
if (ruleProps.length) {
return Promise.reject(validRest[ruleProps[0]][0]);
}
if (cb) {
cb();
}
});
}).catch(firstErrParams => {
return new Promise((resolve, reject) => {
const finish = () => {
nextTick(() => {
if (cb) {
cb(validRest);
resolve();
}
else {
if (getConfig$4().validToReject === 'obsolete') {
// 已废弃,校验失败将不会执行catch
reject(validRest);
}
else {
resolve(validRest);
}
}
});
};
const posAndFinish = () => {
firstErrParams.cell = $xeTable.getCellElement(firstErrParams.row, firstErrParams.column);
scrollToView(firstErrParams.cell);
handleValidError(firstErrParams).then(finish);
};
/**
* 当校验不通过时
* 将表格滚动到可视区
* 由于提示信息至少需要占一行,定位向上偏移一行
*/
if (validOpts.autoPos === false) {
finish();
}
else {
const row = firstErrParams.row;
const column = firstErrParams.column;
$xeTable.scrollToRow(row, column).then(posAndFinish);
}
});
});
}
else {
reactData.validErrorMaps = {};
}
return nextTick().then(() => {
if (cb) {
cb();
}
});
};
validatorMethods = {
/**
* 完整校验行,和 validate 的区别就是会给有效数据中的每一行进行校验
*/
fullValidate(rows, cb) {
if (XEUtils.isFunction(cb)) {
warnLog$3('vxe.error.notValidators', ['fullValidate(rows, callback)', 'fullValidate(rows)']);
}
return beginValidate(rows, null, cb, true);
},
/**
* 快速校验行,如果存在记录不通过的记录,则返回不再继续校验(异步校验除外)
*/
validate(rows, cb) {
return beginValidate(rows, null, cb);
},
/**
* 完整校验单元格,和 validateField 的区别就是会给有效数据中的每一行进行校验
*/
fullValidateField(rows, fieldOrColumn) {
const colList = (XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : (fieldOrColumn ? [fieldOrColumn] : [])).map(column => handleFieldOrColumn($xeTable, column));
if (colList.length) {
return beginValidate(rows, colList, null, true);
}
return nextTick();
},
/**
* 快速校验单元格,如果存在记录不通过的记录,则返回不再继续校验(异步校验除外)
*/
validateField(rows, fieldOrColumn) {
const colList = (XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : (fieldOrColumn ? [fieldOrColumn] : [])).map(column => handleFieldOrColumn($xeTable, column));
if (colList.length) {
return beginValidate(rows, colList, null);
}
return nextTick();
},
clearValidate(rows, fieldOrColumn) {
const { validErrorMaps } = reactData;
const validTip = refValidTooltip.value;
const validOpts = computeValidOpts.value;
const rowList = XEUtils.isArray(rows) ? rows : (rows ? [rows] : []);
const colList = (XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : (fieldOrColumn ? [fieldOrColumn] : [])).map(column => handleFieldOrColumn($xeTable, column));
let validErrMaps = {};
if (validTip && validTip.reactData.visible) {
validTip.close();
}
// 如果是单个提示模式
if (validOpts.msgMode === 'single') {
reactData.validErrorMaps = {};
return nextTick();
}
if (rowList.length && colList.length) {
validErrMaps = Object.assign({}, validErrorMaps);
rowList.forEach(row => {
colList.forEach((column) => {
const validKey = `${getRowid($xeTable, row)}:${column.id}`;
if (validErrMaps[validKey]) {
delete validErrMaps[validKey];
}
});
});
}
else if (rowList.length) {
const rowIdList = rowList.map(row => `${getRowid($xeTable, row)}`);
XEUtils.each(validErrorMaps, (item, key) => {
if (rowIdList.indexOf(key.split(':')[0]) > -1) {
validErrMaps[key] = item;
}
});
}
else if (colList.length) {
const colidList = colList.map(column => `${column.id}`);
XEUtils.each(validErrorMaps, (item, key) => {
if (colidList.indexOf(key.split(':')[1]) > -1) {
validErrMaps[key] = item;
}
});
}
reactData.validErrorMaps = validErrMaps;
return nextTick();
}
};
validatorPrivateMethods = {
/**
* 校验数据
* 按表格行、列顺序依次校验(同步或异步)
* 校验规则根据索引顺序依次校验,如果是异步则会等待校验完成才会继续校验下一列
* 如果校验失败则,触发回调或者Promise<不通过列的错误消息>
* 如果是传回调方式这返回一个校验不通过列的错误消息
*
* rule 配置:
* required=Boolean 是否必填
* min=Number 最小长度
* max=Number 最大长度
* validator=Function({ cellValue, rule, rules, row, column, rowIndex, columnIndex }) 自定义校验,接收一个 Promise
* trigger=blur|change 触发方式(除非特殊场景,否则默认为空就行)
*/
validCellRules(validType, row, column, val) {
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const { editRules } = props;
const { field } = column;
const errorRules = [];
const syncValidList = [];
if (field && editRules) {
const rules = column.rules ? column.rules : XEUtils.get(editRules, field);
if (rules) {
const cellValue = XEUtils.isUndefined(val) ? XEUtils.get(row, field) : val;
rules.forEach((rule) => {
const { trigger, validator } = rule;
if (validType === 'all' || !trigger || validType === trigger) {
if (validator) {
const validParams = {
cellValue,
rule,
rules,
row,
rowIndex: $xeTable.getRowIndex(row),
column,
columnIndex: $xeTable.getColumnIndex(column),
field: column.field,
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt
};
let customValid;
if (XEUtils.isString(validator)) {
const gvItem = validators.get(validator);
if (gvItem) {
const tcvMethod = gvItem.tableCellValidatorMethod || gvItem.cellValidatorMethod;
if (tcvMethod) {
customValid = tcvMethod(validParams);
}
else {
errLog$4('vxe.error.notValidators', [validator]);
}
}
else {
errLog$4('vxe.error.notValidators', [validator]);
}
}
else {
customValid = validator(validParams);
}
if (customValid) {
if (XEUtils.isError(customValid)) {
internalData.validRuleErr = true;
errorRules.push(new Rule({ type: 'custom', trigger, content: customValid.message, rule: new Rule(rule) }));
}
else if (customValid.catch) {
// 如果为异步校验(注:异步校验是并发无序的)
syncValidList.push(customValid.catch((e) => {
internalData.validRuleErr = true;
errorRules.push(new Rule({ type: 'custom', trigger, content: e && e.message ? e.message : (rule.content || rule.message), rule: new Rule(rule) }));
}));
}
}
}
else {
if (!checkRuleStatus(rule, row, cellValue)) {
internalData.validRuleErr = true;
errorRules.push(new Rule(rule));
}
}
}
});
}
}
return Promise.all(syncValidList).then(() => {
if (errorRules.length) {
const rest = { rules: errorRules, rule: errorRules[0] };
return Promise.reject(rest);
}
});
},
hasCellRules(type, row, column) {
const { editRules } = props;
const { field } = column;
if (field && editRules) {
const rules = column.rules ? column.rules : XEUtils.get(editRules, field);
return rules && !!XEUtils.find(rules, rule => type === 'all' || !rule.trigger || type === rule.trigger);
}
return false;
},
/**
* 触发校验
*/
triggerValidate(type) {
const { editConfig, editRules } = props;
const { editStore } = reactData;
const { actived } = editStore;
const editOpts = computeEditOpts.value;
const validOpts = computeValidOpts.value;
// 检查清除校验消息
if (editRules && validOpts.msgMode === 'single') {
reactData.validErrorMaps = {};
}
// 校验单元格
if (editConfig && editRules && actived.row) {
const { row, column, cell } = actived.args;
if ($xeTable.hasCellRules(type, row, column)) {
return $xeTable.validCellRules(type, row, column).then(() => {
if (editOpts.mode === 'row') {
validatorMethods.clearValidate(row, column);
}
}).catch(({ rule }) => {
// 如果校验不通过与触发方式一致,则聚焦提示错误,否则跳过并不作任何处理
if (!rule.trigger || type === rule.trigger) {
const rest = { rule, row, column, cell };
$xeTable.showValidTooltip(rest);
return Promise.reject(rest);
}
return Promise.resolve();
});
}
}
return Promise.resolve();
},
/**
* 弹出校验错误提示
*/
showValidTooltip(params) {
const { height } = props;
const { tableData, validStore, validErrorMaps } = reactData;
const { rule, row, column, cell } = params;
const validOpts = computeValidOpts.value;
const validTip = refValidTooltip.value;
const content = rule.content;
validStore.visible = true;
if (validOpts.msgMode === 'single') {
reactData.validErrorMaps = {
[`${getRowid($xeTable, row)}:${column.id}`]: {
column,
row,
rule,
content
}
};
}
else {
reactData.validErrorMaps = Object.assign({}, validErrorMaps, {
[`${getRowid($xeTable, row)}:${column.id}`]: {
column,
row,
rule,
content
}
});
}
$xeTable.dispatchEvent('valid-error', params, null);
if (validTip) {
if (validTip && (validOpts.message === 'tooltip' || (validOpts.message === 'default' && !height && tableData.length < 2))) {
return validTip.open(cell, content);
}
}
return nextTick();
}
};
return Object.assign(Object.assign({}, validatorMethods), validatorPrivateMethods);
},
setupGrid($xeGrid) {
return $xeGrid.extendTableMethods(tableValidatorMethodKeys);
},
setupGantt($xeGantt) {
return $xeGantt.extendTableMethods(tableValidatorMethodKeys);
}
});
const tableCustomMethodKeys = ['openCustom', 'closeCustom', 'getCustomVisible', 'toggleCustom', 'saveCustom', 'cancelCustom', 'resetCustom', 'toggleCustomAllCheckbox', 'setCustomAllCheckbox'];
const customColumnCssKeys = ['checkbox', 'sort', 'title', 'width', 'fixed', 'align', 'header-align', 'footer-align'];
VxeUI.hooks.add('tableCustomModule', {
setupTable($xeTable) {
const { reactData, internalData } = $xeTable;
const { computeCustomOpts, computeRowGroupFields, computeCustomSimpleMode } = $xeTable.getComputeMaps();
const { refElem } = $xeTable.getRefMaps();
const $xeGrid = $xeTable.xeGrid;
const $xeGantt = $xeTable.xeGantt;
const $xeGGWrapper = $xeGrid || $xeGantt;
const updatePopupStyle = () => {
const { customStore } = reactData;
const customOpts = computeCustomOpts.value;
const { mode, placement, popupOptions } = customOpts;
const showSimple = !(mode === 'modal' || mode === 'drawer');
const { transfer, minWidth, maxWidth, maxHeight } = popupOptions || {};
const customSimpleMode = computeCustomSimpleMode.value;
const showCustomSimpleOutside = customSimpleMode === 'outside';
const bodyEl = document.documentElement;
let wrapperEl = refElem.value;
let popupTop = 0;
let popupMaxHeight = 0;
const defPupStys = {};
const panePupStys = {};
if ($xeGantt) {
const { refGanttContainerElem } = $xeGantt.getRefMaps();
const ganttContainerElem = refGanttContainerElem.value;
if (ganttContainerElem) {
wrapperEl = ganttContainerElem;
}
}
const tableRect = wrapperEl.getBoundingClientRect();
// 多种模式,指定元素插入
if (showSimple && transfer) {
popupTop = tableRect.top + bodyEl.scrollTop;
popupMaxHeight = XEUtils.eqNull(maxHeight) ? 360 : maxHeight;
}
else if (showCustomSimpleOutside) {
if ($xeGGWrapper && wrapperEl) {
popupTop = wrapperEl.offsetTop;
}
popupMaxHeight = XEUtils.eqNull(maxHeight) ? 360 : maxHeight;
}
else {
// 判断面板不能大于表格高度
if (wrapperEl) {
popupMaxHeight = wrapperEl.clientHeight - 22;
}
popupMaxHeight = Math.max(88, popupMaxHeight);
}
let popupMxHeight = 0;
if (!(placement === 'left' || placement === 'right')) {
popupMxHeight = XEUtils.eqNull(maxHeight) ? popupMaxHeight : maxHeight;
}
if (!placement || !(['left', 'right', 'bottom-left', 'bottom-right'].includes(placement))) {
if (popupTop) {
defPupStys.top = toCssUnit(popupTop);
}
}
if (showSimple && transfer) {
if (placement === 'bottom-left' || placement === 'bottom-right') {
defPupStys.bottom = toCssUnit(bodyEl.scrollHeight - tableRect.top - tableRect.height + 1);
}
if (placement === 'top-left' || placement === 'bottom-left') {
defPupStys.left = toCssUnit(tableRect.left);
}
else if (!placement || placement === 'top-right' || placement === 'bottom-right') {
defPupStys.right = toCssUnit(bodyEl.scrollWidth - tableRect.left - tableRect.width + 1);
}
}
// 同步表格的css变量到弹窗中
const bodyComputeStyle = getComputedStyle(bodyEl);
const tableComputeStyle = getComputedStyle(wrapperEl);
customColumnCssKeys.forEach(key => {
const currCssKey = `--vxe-ui-vxe-table-custom-column-${key}-${key === 'title' ? 'min-' : ''}width`;
const currCssVal = tableComputeStyle.getPropertyValue(currCssKey);
if (currCssVal && currCssVal !== bodyComputeStyle.getPropertyValue(currCssKey)) {
panePupStys[currCssKey] = currCssVal;
}
});
if (minWidth) {
defPupStys['--vxe-ui-vxe-table-custom-default-min-width'] = toCssUnit(minWidth);
}
if (maxWidth) {
defPupStys['--vxe-ui-vxe-table-custom-default-max-width'] = toCssUnit(maxWidth);
}
if (popupMxHeight) {
defPupStys.maxHeight = toCssUnit(popupMxHeight);
}
customStore.defPopupStyle = defPupStys;
customStore.panePopupStyle = panePupStys;
customStore.maxHeight = popupMxHeight;
return nextTick();
};
const openCustom = () => {
const { initStore, customStore } = reactData;
const customOpts = computeCustomOpts.value;
const { mode, popupOptions } = customOpts;
const showSimple = !(mode === 'modal' || mode === 'drawer');
const { transfer } = popupOptions || {};
const customSimpleMode = computeCustomSimpleMode.value;
const showCustomSimpleOutside = customSimpleMode === 'outside';
let cpToElem = null;
// 多种模式,指定元素插入
if (showSimple && transfer) {
cpToElem = document.body;
}
else {
if (showCustomSimpleOutside && $xeGGWrapper) {
const { refPopupContainerElem } = $xeGGWrapper.getRefMaps();
const popupContainerElem = refPopupContainerElem.value;
if (popupContainerElem) {
cpToElem = popupContainerElem;
}
}
}
if (internalData.customPopupToElem !== cpToElem) {
reactData.ctPopupFlag++;
}
internalData.customPopupToElem = cpToElem;
customStore.visible = true;
initStore.custom = true;
handleUpdateCustomColumn();
checkCustomStatus();
updatePopupStyle();
return nextTick().then(() => updatePopupStyle());
};
const handleUpdateCustomColumn = () => {
const { customStore } = reactData;
const { collectColumn } = internalData;
if (customStore.visible) {
const sortMaps = {};
const fixedMaps = {};
const visibleMaps = {};
XEUtils.eachTree(collectColumn, column => {
const colid = column.getKey();
column.renderFixed = column.fixed;
column.renderVisible = column.visible;
column.renderResizeWidth = column.renderWidth;
column.renderAlign = column.align;
column.renderHeaderAlign = column.headerAlign;
column.renderFooterAlign = column.footerAlign;
sortMaps[colid] = column.renderSortNumber;
fixedMaps[colid] = column.fixed;
visibleMaps[colid] = column.visible;
});
customStore.oldSortMaps = sortMaps;
customStore.oldFixedMaps = fixedMaps;
customStore.oldVisibleMaps = visibleMaps;
reactData.customColumnList = collectColumn.slice(0);
}
};
const closeCustom = () => {
const { customStore } = reactData;
const customOpts = computeCustomOpts.value;
if (customStore.visible) {
customStore.visible = false;
if (!customOpts.immediate) {
$xeTable.handleCustom();
}
}
return nextTick();
};
const toggleCustom = () => {
const { customStore } = reactData;
if (customStore.visible) {
return closeCustom();
}
return openCustom();
};
const saveCustom = (isDirectly) => {
const { customColumnList, aggHandleFields, rowGroupList } = reactData;
const customOpts = computeCustomOpts.value;
const { allowVisible, allowSort, allowFixed, allowResizable, allowAlign, allowHeaderAlign, allowFooterAlign, allowGroup, allowValues } = customOpts;
if (isDirectly) {
XEUtils.eachTree(customColumnList, (column) => {
if (allowResizable) {
if (column.renderVisible && (!column.children || !column.children.length)) {
column.resizeWidth = Math.max(0, XEUtils.toNumber(column.renderWidth));
}
}
});
}
else {
XEUtils.eachTree(customColumnList, (column, index, items, path, parentColumn) => {
if (parentColumn) {
// 更新子列信息
column.fixed = parentColumn.fixed;
}
else {
if (allowSort) {
const sortIndex = index + 1;
column.renderSortNumber = sortIndex;
}
if (allowFixed) {
column.fixed = column.renderFixed;
}
}
if (allowResizable) {
if (column.renderVisible && (!column.children || !column.children.length)) {
if (column.renderResizeWidth !== column.renderWidth) {
column.resizeWidth = column.renderResizeWidth;
column.renderWidth = column.renderResizeWidth;
}
}
}
if (allowVisible) {
column.visible = column.renderVisible;
}
if (allowAlign) {
column.align = column.renderAlign;
}
if (allowHeaderAlign) {
column.headerAlign = column.renderHeaderAlign;
}
if (allowFooterAlign) {
column.footerAlign = column.renderFooterAlign;
}
if (allowGroup && allowValues) {
column.aggFunc = column.renderAggFn;
}
});
}
reactData.isCustomStatus = true;
if (allowGroup && !!$xeTable.handlePivotTableAggData) {
if (rowGroupList.length !== aggHandleFields.length || rowGroupList.some((conf, i) => conf.field !== aggHandleFields[i])) {
// 更新数据分组
if (aggHandleFields.length) {
$xeTable.setRowGroups(aggHandleFields);
}
else {
$xeTable.clearRowGroups();
}
}
else if (allowValues) {
// 更新聚合函数
$xeTable.handleUpdateAggData();
}
}
if (allowSort) {
internalData.collectColumn = customColumnList;
}
return $xeTable.saveCustomStore('confirm');
};
const cancelCustom = () => {
const { customColumnList, customStore } = reactData;
const { oldSortMaps, oldFixedMaps, oldVisibleMaps } = customStore;
const customOpts = computeCustomOpts.value;
const { allowVisible, allowSort, allowFixed, allowAlign, allowHeaderAlign, allowFooterAlign, allowResizable, allowGroup, allowValues } = customOpts;
XEUtils.eachTree(customColumnList, column => {
const colid = column.getKey();
const visible = !!oldVisibleMaps[colid];
const fixed = oldFixedMaps[colid] || '';
if (allowVisible) {
column.renderVisible = visible;
column.visible = visible;
}
if (allowFixed) {
column.renderFixed = fixed;
column.fixed = fixed;
}
if (allowSort) {
column.renderSortNumber = oldSortMaps[colid] || 0;
}
if (allowResizable) {
column.renderResizeWidth = column.renderWidth;
}
if (allowAlign) {
column.align = column.renderAlign;
}
if (allowHeaderAlign) {
column.headerAlign = column.renderHeaderAlign;
}
if (allowFooterAlign) {
column.footerAlign = column.renderFooterAlign;
}
}, { children: 'children' });
return nextTick();
};
const setCustomAllCheckbox = (checked) => {
const { customStore } = reactData;
const { customColumnList } = reactData;
const customOpts = computeCustomOpts.value;
const { checkMethod, visibleMethod } = customOpts;
const isAll = !!checked;
if (customOpts.immediate) {
XEUtils.eachTree(customColumnList, (column) => {
if (visibleMethod && !visibleMethod({ $table: $xeTable, column })) {
return;
}
if (checkMethod && !checkMethod({ $table: $xeTable, column })) {
return;
}
column.visible = isAll;
column.renderVisible = isAll;
column.halfVisible = false;
});
customStore.isAll = isAll;
reactData.isCustomStatus = true;
$xeTable.handleCustom();
$xeTable.saveCustomStore('update:visible');
}
else {
XEUtils.eachTree(customColumnList, (column) => {
if (visibleMethod && !visibleMethod({ $table: $xeTable, column })) {
return;
}
if (checkMethod && !checkMethod({ $table: $xeTable, column })) {
return;
}
column.renderVisible = isAll;
column.halfVisible = false;
});
customStore.isAll = isAll;
}
$xeTable.checkCustomStatus();
return nextTick();
};
const customMethods = {
getCustomVisible() {
const { customStore } = reactData;
return customStore.visible;
},
openCustom,
closeCustom,
toggleCustom,
saveCustom,
cancelCustom,
resetCustom(options) {
const { rowGroupList } = reactData;
const { collectColumn } = internalData;
const customOpts = computeCustomOpts.value;
const { checkMethod } = customOpts;
const opts = Object.assign({
visible: true,
resizable: options === true,
fixed: options === true,
sort: options === true,
aggFunc: options === true,
align: options === true,
headerAlign: options === true,
footerAlign: options === true
}, options);
const allCols = [];
XEUtils.eachTree(collectColumn, (column) => {
if (opts.resizable) {
column.resizeWidth = 0;
}
if (opts.fixed) {
column.fixed = column.defaultFixed;
column.renderFixed = column.defaultFixed;
}
if (opts.sort) {
column.renderSortNumber = column.sortNumber;
column.parentId = column.defaultParentId;
}
if (!checkMethod || checkMethod({ $table: $xeTable, column })) {
column.visible = column.defaultVisible;
}
if (opts.align) {
column.align = column.defaultAlign;
column.renderAlign = column.defaultAlign;
}
if (opts.headerAlign) {
column.headerAlign = column.defaultHeaderAlign;
column.renderHeaderAlign = column.defaultHeaderAlign;
}
if (opts.footerAlign) {
column.footerAlign = column.defaultFooterAlign;
column.renderFooterAlign = column.defaultFooterAlign;
}
if (opts.aggFunc) {
column.aggFunc = column.defaultAggFunc;
column.renderAggFn = column.defaultAggFunc;
}
column.renderResizeWidth = column.renderWidth;
allCols.push(column);
});
if (opts.sort) {
const newCollectCols = XEUtils.toArrayTree(XEUtils.orderBy(allCols, 'renderSortNumber'), { key: 'id', parentKey: 'parentId', children: 'children' });
internalData.collectColumn = newCollectCols;
internalData.tableFullColumn = getColumnList(newCollectCols);
}
reactData.isCustomStatus = false;
return $xeTable.handleCustom().then(() => {
if (opts.aggFunc && !!$xeTable.handlePivotTableAggData) {
const rowGroupFields = computeRowGroupFields.value;
if (rowGroupFields ? rowGroupFields.length : rowGroupList.length) {
if (rowGroupFields && rowGroupFields.length) {
$xeTable.setRowGroups(rowGroupFields);
}
else {
$xeTable.clearRowGroups();
}
}
else {
$xeTable.handleUpdateAggData();
}
}
$xeTable.saveCustomStore('reset');
});
},
toggleCustomAllCheckbox() {
const { customStore } = reactData;
const isAll = !customStore.isAll;
return setCustomAllCheckbox(isAll);
},
setCustomAllCheckbox
};
const checkCustomStatus = () => {
const { customStore } = reactData;
const { collectColumn } = internalData;
const customOpts = computeCustomOpts.value;
const { checkMethod } = customOpts;
customStore.isAll = collectColumn.every((column) => (checkMethod ? !checkMethod({ $table: $xeTable, column }) : false) || column.renderVisible);
customStore.isIndeterminate = !customStore.isAll && collectColumn.some((column) => (!checkMethod || checkMethod({ $table: $xeTable, column })) && (column.renderVisible || column.halfVisible));
};
const emitCustomEvent = (type, evnt) => {
$xeTable.dispatchEvent('custom', { type }, evnt);
};
const customPrivateMethods = {
checkCustomStatus,
emitCustomEvent,
triggerCustomEvent(evnt) {
const reactData = $xeTable.reactData;
const { customStore } = reactData;
if (customStore.visible) {
closeCustom();
emitCustomEvent('close', evnt);
$xeTable.dispatchEvent('custom-close', {}, evnt);
}
else {
customStore.btnEl = evnt.target;
openCustom();
emitCustomEvent('open', evnt);
$xeTable.dispatchEvent('custom-open', {}, evnt);
}
},
customOpenEvent(evnt) {
const reactData = $xeTable.reactData;
const { customStore } = reactData;
if (!customStore.visible) {
customStore.activeBtn = true;
customStore.btnEl = evnt.target;
$xeTable.openCustom();
$xeTable.emitCustomEvent('open', evnt);
$xeTable.dispatchEvent('custom-open', {}, evnt);
}
},
customCloseEvent(evnt) {
const reactData = $xeTable.reactData;
const { customStore } = reactData;
if (customStore.visible) {
customStore.activeBtn = false;
$xeTable.closeCustom();
$xeTable.emitCustomEvent('close', evnt);
$xeTable.dispatchEvent('custom-close', {}, evnt);
}
},
handleUpdateCustomColumn,
handleCustomStyle() {
const reactData = $xeTable.reactData;
reactData.isCustomDragStatus = false;
return updatePopupStyle();
}
};
return Object.assign(Object.assign({}, customMethods), customPrivateMethods);
},
setupGrid($xeGrid) {
return $xeGrid.extendTableMethods(tableCustomMethodKeys);
},
setupGantt($xeGantt) {
return $xeGantt.extendTableMethods(tableCustomMethodKeys);
}
});
const { errLog: errLog$3 } = createComponentLog('table');
const { getConfig: getConfig$3, renderer: renderer$2, getI18n: getI18n$3, getComponent } = VxeUI;
const componentDefaultModelProp = 'modelValue';
const defaultCompProps = {};
function handleDefaultValue(value, defaultVal, initVal) {
return XEUtils.eqNull(value) ? (XEUtils.eqNull(defaultVal) ? initVal : defaultVal) : value;
}
function parseDate(value, props) {
return value && props.valueFormat ? XEUtils.toStringDate(value, props.valueFormat) : value;
}
function getFormatDate(value, props, defaultFormat) {
const { dateConfig = {} } = props;
return XEUtils.toDateString(parseDate(value, props), dateConfig.labelFormat || defaultFormat);
}
function getLabelFormatDate(value, props) {
return getFormatDate(value, props, getI18n$3(`vxe.input.date.labelFormat.${props.type || 'date'}`));
}
/**
* 已废弃
* @deprecated
*/
function getOldComponentName(name) {
return `vxe-${name.replace('$', '')}`;
}
function getDefaultComponent({ name }) {
return getComponent(name);
}
/**
* 已废弃
* @deprecated
*/
function getOldComponent({ name }) {
return resolveComponent(getOldComponentName(name));
}
function updateFilterChangeOption(params, checked, option) {
const { $table } = params;
$table.updateFilterOptionStatus(option, checked);
}
function saveFilterEvent(params) {
const { $table, column } = params;
$table.saveFilterByEvent(new Event('change'), column);
}
function getNativeAttrs(renderOpts) {
let { name, attrs } = renderOpts;
if (name === 'input') {
attrs = Object.assign({ type: 'text' }, attrs);
}
return attrs;
}
function getInputImmediateModel(renderOpts) {
const { name, immediate, props } = renderOpts;
if (!immediate) {
if (name === 'VxeInput' || name === '$input') {
const { type } = props || {};
return !(!type || type === 'text' || type === 'number' || type === 'integer' || type === 'float');
}
if (name === 'input' || name === 'textarea' || name === '$textarea') {
return false;
}
return true;
}
return immediate;
}
function getCellEditProps(renderOpts, params, value, defaultProps) {
return XEUtils.assign({ immediate: getInputImmediateModel(renderOpts) }, defaultCompProps, defaultProps, renderOpts.props, { [componentDefaultModelProp]: value });
}
function getCellEditFilterProps(renderOpts, params, value, defaultProps) {
return XEUtils.assign({}, defaultCompProps, defaultProps, renderOpts.props, { [componentDefaultModelProp]: value });
}
function isImmediateCell(renderOpts, params) {
return params.$type === 'cell' || getInputImmediateModel(renderOpts);
}
function getCellLabelVNs(renderOpts, params, cellLabel, opts) {
const { placeholder } = renderOpts;
return [
h('span', {
key: 1,
class: ['vxe-cell--label', opts ? opts.class : '']
}, placeholder && isEmptyValue(cellLabel)
? [
h('span', {
class: 'vxe-cell--placeholder'
}, formatText(getFuncText(placeholder), 1))
]
: formatText(cellLabel, 1))
];
}
/**
* 原生事件处理
* @param renderOpts
* @param params
* @param modelFunc
* @param changeFunc
*/
function getNativeElementOns(renderOpts, params, eFns) {
const { events } = renderOpts;
const modelEvent = getModelEvent(renderOpts);
const changeEvent = getChangeEvent(renderOpts);
const { model: modelFunc, change: changeFunc, blur: blurFunc } = eFns || {};
const isSameEvent = changeEvent === modelEvent;
const ons = {};
if (events) {
XEUtils.objectEach(events, (func, key) => {
ons[getOnName(key)] = function (...args) {
func(params, ...args);
};
});
}
if (modelFunc) {
ons[getOnName(modelEvent)] = function (targetEvnt) {
modelFunc(targetEvnt);
if (isSameEvent && changeFunc) {
changeFunc(targetEvnt);
}
if (events && events[modelEvent]) {
events[modelEvent](params, targetEvnt);
}
};
}
if (!isSameEvent && changeFunc) {
ons[getOnName(changeEvent)] = function (evnt) {
changeFunc(evnt);
if (events && events[changeEvent]) {
events[changeEvent](params, evnt);
}
};
}
if (blurFunc) {
ons[getOnName(blurEvent)] = function (evnt) {
blurFunc(evnt);
if (events && events[blurEvent]) {
events[blurEvent](params, evnt);
}
};
}
return ons;
}
const blurEvent = 'blur';
const clearEvent = 'clear';
/**
* 组件事件处理
* @param renderOpts
* @param params
* @param modelFunc
* @param changeFunc
*/
function getComponentOns(renderOpts, params, eFns, eventOns) {
const { events } = renderOpts;
const modelEvent = getModelEvent(renderOpts);
const changeEvent = getChangeEvent(renderOpts);
const { model: modelFunc, change: changeFunc, blur: blurFunc, clear: clearFunc } = eFns || {};
const ons = {};
XEUtils.objectEach(events, (func, key) => {
ons[getOnName(key)] = function (...args) {
if (!XEUtils.isFunction(func)) {
errLog$3('vxe.error.errFunc', [func]);
}
func(params, ...args);
};
});
if (modelFunc) {
ons[getOnName(modelEvent)] = function (targetEvnt) {
modelFunc(targetEvnt);
if (events && events[modelEvent]) {
events[modelEvent](params, targetEvnt);
}
};
}
if (changeFunc) {
ons[getOnName(changeEvent)] = function (...args) {
changeFunc(...args);
if (events && events[changeEvent]) {
events[changeEvent](params, ...args);
}
};
}
if (blurFunc) {
ons[getOnName(blurEvent)] = function (...args) {
blurFunc(...args);
if (events && events[blurEvent]) {
events[blurEvent](params, ...args);
}
};
}
if (clearFunc) {
ons[getOnName(clearEvent)] = function (...args) {
clearFunc(...args);
if (events && events[clearEvent]) {
events[clearEvent](params, ...args);
}
};
}
return eventOns ? Object.assign(ons, eventOns) : ons;
}
function getEditOns(renderOpts, params) {
const { $table, row, column } = params;
const { name } = renderOpts;
const { model } = column;
const isImmediate = isImmediateCell(renderOpts, params);
return getComponentOns(renderOpts, params, {
model(cellValue) {
// 处理 model 值双向绑定
model.update = true;
model.value = cellValue;
if (isImmediate) {
setCellValue(row, column, cellValue);
}
},
change(eventParams) {
// 处理 change 事件相关逻辑
if (!isImmediate && name && (['VxeInput', 'VxeNumberInput', 'VxeTextarea', '$input', '$textarea'].includes(name))) {
const cellValue = eventParams.value;
model.update = true;
model.value = cellValue;
$table.updateStatus(params, cellValue);
}
else {
$table.updateStatus(params);
}
},
blur() {
if (isImmediate) {
$table.handleCellRuleUpdateStatus('blur', params);
}
else {
$table.handleCellRuleUpdateStatus('blur', params, model.value);
}
}
});
}
function getFilterOns(renderOpts, params, option) {
return getComponentOns(renderOpts, params, {
model(value) {
// 处理 model 值双向绑定
option.data = value;
},
change() {
updateFilterChangeOption(params, !isEmptyValue(option.data), option);
},
blur() {
updateFilterChangeOption(params, !isEmptyValue(option.data), option);
}
});
}
function getFloatingFilterOns(renderOpts, params, option) {
const { $table, column } = params;
if (hasInputType(renderOpts)) {
return getComponentOns(renderOpts, params, {
model(value) {
// 处理 model 值双向绑定
option.data = value;
},
change() {
updateFilterChangeOption(params, !isEmptyValue(option.data), option);
},
clear() {
updateFilterChangeOption(params, !isEmptyValue(option.data), option);
saveFilterEvent(params);
},
blur() {
$table.saveFilterByEvent(new Event('change'), column);
}
}, renderOpts.name === 'VxeNumberInput'
? {
[getOnName('plus-number')]() {
updateFilterChangeOption(params, !isEmptyValue(option.data), option);
saveFilterEvent(params);
},
[getOnName('minus-number')]() {
updateFilterChangeOption(params, !isEmptyValue(option.data), option);
saveFilterEvent(params);
}
}
: {});
}
return getComponentOns(renderOpts, params, {
model(value) {
// 处理 model 值双向绑定
option.data = value;
},
clear() {
updateFilterChangeOption(params, !isEmptyValue(option.data), option);
$table.saveFilterByEvent(new Event('change'), column);
},
change() {
updateFilterChangeOption(params, !isEmptyValue(option.data), option);
$table.saveFilterByEvent(new Event('change'), column);
}
});
}
function getNativeEditOns(renderOpts, params) {
const { $table, row, column } = params;
const { model } = column;
return getNativeElementOns(renderOpts, params, {
model(evnt) {
// 处理 model 值双向绑定
const targetEl = evnt.target;
if (targetEl) {
const cellValue = targetEl.value;
if (isImmediateCell(renderOpts, params)) {
setCellValue(row, column, cellValue);
}
else {
model.update = true;
model.value = cellValue;
}
}
},
change(evnt) {
// 处理 change 事件相关逻辑
const targetEl = evnt.target;
if (targetEl) {
const cellValue = targetEl.value;
$table.updateStatus(params, cellValue);
}
},
blur(evnt) {
const targetEl = evnt.target;
if (targetEl) {
const cellValue = targetEl.value;
$table.updateStatus(params, cellValue);
}
}
});
}
function getNativeFilterOns(renderOpts, params, option) {
return getNativeElementOns(renderOpts, params, {
model(evnt) {
// 处理 model 值双向绑定
const targetEl = evnt.target;
if (targetEl) {
option.data = targetEl.value;
}
},
change() {
updateFilterChangeOption(params, !XEUtils.eqNull(option.data), option);
},
blur() {
updateFilterChangeOption(params, !XEUtils.eqNull(option.data), option);
}
});
}
function nativeInputCellRender(renderOpts, renderParams) {
const { row, column } = renderParams;
const cellValue = XEUtils.get(row, column.field);
const cellVNs = [
h('span', {
key: 1
}, cellValue)
];
return getNativeInputRenderCellVNs(cellValue, cellVNs, renderOpts, renderParams);
}
/**
* 单元格可编辑渲染-原生的标签
* input、textarea
*/
function nativeInputEditRender(renderOpts, renderParams) {
const { row, column } = renderParams;
const { name } = renderOpts;
const cellValue = isImmediateCell(renderOpts, renderParams) ? getCellValue(row, column) : column.model.value;
return [
h('' + name, Object.assign(Object.assign(Object.assign({ key: 2, class: `vxe-default-${name}` }, getNativeAttrs(renderOpts)), { value: cellValue }), getNativeEditOns(renderOpts, renderParams)))
];
}
function buttonCellRender(renderOpts, params) {
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, null)), getComponentOns(renderOpts, params)))
];
}
function defaultInputEditRender(renderOpts, params) {
const { row, column } = params;
const cellValue = getCellValue(row, column);
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign({ key: 2 }, getCellEditProps(renderOpts, params, cellValue)), getEditOns(renderOpts, params)))
];
}
function defaultEditRender(renderOpts, params) {
const { row, column } = params;
const cellValue = getCellValue(row, column);
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue)), getEditOns(renderOpts, params)))
];
}
function checkboxEditRender(renderOpts, params) {
const { row, column } = params;
const cellValue = getCellValue(row, column);
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue)), getEditOns(renderOpts, params)))
];
}
function radioAndCheckboxGroupEditRender(renderOpts, params) {
const { options } = renderOpts;
const { row, column } = params;
const cellValue = getCellValue(row, column);
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign({ options }, getCellEditProps(renderOpts, params, cellValue)), getEditOns(renderOpts, params)))
];
}
/**
* 已废弃
* @deprecated
*/
function oldEditRender(renderOpts, params) {
const { row, column } = params;
const cellValue = getCellValue(row, column);
return [
h(getOldComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue)), getEditOns(renderOpts, params)))
];
}
/**
* 已废弃
* @deprecated
*/
function oldButtonEditRender(renderOpts, params) {
return [
h(getComponent('vxe-button'), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, null)), getComponentOns(renderOpts, params)))
];
}
/**
* 已废弃
* @deprecated
*/
function oldButtonsEditRender(renderOpts, params) {
const { children } = renderOpts;
return children ? children.map((childRenderOpts) => oldButtonEditRender(childRenderOpts, params)[0]) : [];
}
function renderNativeOptgroups(renderOpts, params, renderOptionsMethods) {
const { optionGroups, optionGroupProps = {} } = renderOpts;
const groupOptions = optionGroupProps.options || 'options';
const groupLabel = optionGroupProps.label || 'label';
if (optionGroups) {
return optionGroups.map((group, gIndex) => {
return h('optgroup', {
key: gIndex,
label: group[groupLabel]
}, renderOptionsMethods(group[groupOptions], renderOpts, params));
});
}
return [];
}
/**
* 渲染原生的 option 标签
*/
function renderNativeOptions(options, renderOpts, params) {
const { optionProps = {} } = renderOpts;
const { row, column } = params;
const labelProp = optionProps.label || 'label';
const valueProp = optionProps.value || 'value';
const disabledProp = optionProps.disabled || 'disabled';
const cellValue = isImmediateCell(renderOpts, params) ? getCellValue(row, column) : column.model.value;
if (options) {
return options.map((option, oIndex) => {
return h('option', {
key: oIndex,
value: option[valueProp],
disabled: option[disabledProp],
/* eslint-disable eqeqeq */
selected: option[valueProp] == cellValue
}, option[labelProp]);
});
}
return [];
}
function nativeFilterRender(renderOpts, params) {
const { column } = params;
const { name } = renderOpts;
const attrs = getNativeAttrs(renderOpts);
return column.filters.map((option, oIndex) => {
return h(`${name}`, Object.assign(Object.assign(Object.assign({ key: oIndex, class: `vxe-default-${name}` }, attrs), { value: option.data }), getNativeFilterOns(renderOpts, params, option)));
});
}
function defaultFilterRender(renderOpts, params) {
const { column } = params;
return column.filters.map((option, oIndex) => {
const optionValue = option.data;
return h(getDefaultComponent(renderOpts), Object.assign(Object.assign({ key: oIndex }, getCellEditFilterProps(renderOpts, renderOpts, optionValue)), getFilterOns(renderOpts, params, option)));
});
}
function defaultFloatingFilterRender(renderOpts, params) {
const { option } = params;
const optionValue = option.data;
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditFilterProps(renderOpts, renderOpts, optionValue)), getFloatingFilterOns(renderOpts, params, option)))
];
}
function defaultFilterOptions() {
return [
{ data: null }
];
}
/**
* 已废弃
* @deprecated
*/
function oldFilterRender(renderOpts, params) {
const { column } = params;
return column.filters.map((option, oIndex) => {
const optionValue = option.data;
return h(getOldComponent(renderOpts), Object.assign(Object.assign({ key: oIndex }, getCellEditFilterProps(renderOpts, renderOpts, optionValue)), getFilterOns(renderOpts, params, option)));
});
}
function handleFilterMethod({ option, row, column }) {
const { data } = option;
const cellValue = XEUtils.get(row, column.field);
/* eslint-disable eqeqeq */
return cellValue == data;
}
function handleInputFilterMethod({ option, row, column }) {
const { data } = option;
const cellValue = XEUtils.get(row, column.field);
/* eslint-disable eqeqeq */
return XEUtils.toValueString(cellValue).indexOf(data) > -1;
}
function nativeSelectEditRender(renderOpts, params) {
return [
h('select', Object.assign(Object.assign({ class: 'vxe-default-select' }, getNativeAttrs(renderOpts)), getNativeEditOns(renderOpts, params)), renderOpts.optionGroups ? renderNativeOptgroups(renderOpts, params, renderNativeOptions) : renderNativeOptions(renderOpts.options, renderOpts, params))
];
}
function defaultSelectEditRender(renderOpts, params) {
const { row, column } = params;
const { options, optionProps, optionGroups, optionGroupProps } = renderOpts;
const cellValue = getCellValue(row, column);
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue, { options, optionProps, optionGroups, optionGroupProps })), getEditOns(renderOpts, params)))
];
}
function defaultTableOrTreeSelectEditRender(renderOpts, params) {
const { row, column } = params;
const { options, optionProps } = renderOpts;
const cellValue = getCellValue(row, column);
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue, { options, optionProps })), getEditOns(renderOpts, params)))
];
}
/**
* 已废弃
* @deprecated
*/
function oldSelectEditRender(renderOpts, params) {
const { row, column } = params;
const { options, optionProps, optionGroups, optionGroupProps } = renderOpts;
const cellValue = getCellValue(row, column);
return [
h(getOldComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue, { options, optionProps, optionGroups, optionGroupProps })), getEditOns(renderOpts, params)))
];
}
function handleSelectCellValue(cellValue, renderOpts) {
const { options, optionGroups, optionProps = {}, optionGroupProps = {}, props = {} } = renderOpts;
let selectItem;
const labelProp = optionProps.label || 'label';
const valueProp = optionProps.value || 'value';
if (!(cellValue === null || cellValue === undefined)) {
let vals = [];
if (XEUtils.isArray(cellValue)) {
vals = cellValue;
}
else {
if (props.multiple && `${cellValue}`.indexOf(',') > -1) {
vals = `${cellValue}`.split(',');
}
else {
vals = [cellValue];
}
}
return XEUtils.map(vals, optionGroups
? (value) => {
const groupOptions = optionGroupProps.options || 'options';
for (let index = 0; index < optionGroups.length; index++) {
/* eslint-disable eqeqeq */
selectItem = XEUtils.find(optionGroups[index][groupOptions], item => item[valueProp] == value);
if (selectItem) {
break;
}
}
return selectItem ? selectItem[labelProp] : value;
}
: (value) => {
/* eslint-disable eqeqeq */
selectItem = XEUtils.find(options, item => item[valueProp] == value);
return selectItem ? selectItem[labelProp] : value;
}).join(', ');
}
return '';
}
function getSelectCellValue(renderOpts, { row, column }) {
const cellValue = XEUtils.get(row, column.field);
return handleSelectCellValue(cellValue, renderOpts);
}
function handleExportSelectMethod(params) {
const { row, column, options } = params;
return options.original ? getCellValue(row, column) : getSelectCellValue(column.editRender || column.cellRender, params);
}
function handleTreeSelectCellValue(cellValue, renderOpts) {
const { options, optionProps = {} } = renderOpts;
const labelProp = optionProps.label || 'label';
const valueProp = optionProps.value || 'value';
const childrenProp = optionProps.children || 'children';
if (!(cellValue === null || cellValue === undefined)) {
const keyMaps = {};
XEUtils.eachTree(options, item => {
keyMaps[XEUtils.get(item, valueProp)] = item;
}, { children: childrenProp });
return XEUtils.map(XEUtils.isArray(cellValue) ? cellValue : [cellValue], (value) => {
const item = keyMaps[value];
return item ? XEUtils.get(item, labelProp) : item;
}).join(', ');
}
return '';
}
function getTreeSelectCellValue(renderOpts, { row, column }) {
const cellValue = XEUtils.get(row, column.field);
return handleTreeSelectCellValue(cellValue, renderOpts);
}
function handleExportTreeSelectMethod(params) {
const { row, column, options } = params;
return options.original ? getCellValue(row, column) : getTreeSelectCellValue(column.editRender || column.cellRender, params);
}
function handleNumberCell(cellValue, renderOpts, params) {
const { props = {}, showNegativeStatus } = renderOpts;
const { type } = props;
let isNegative = false;
if (!isEmptyValue(cellValue)) {
const numberInputConfig = getConfig$3().numberInput || {};
if (type === 'float') {
const autoFill = handleDefaultValue(props.autoFill, numberInputConfig.autoFill, true);
const digits = handleDefaultValue(props.digits, numberInputConfig.digits, 1);
cellValue = XEUtils.toFixed(XEUtils.floor(cellValue, digits), digits);
if (!autoFill) {
cellValue = XEUtils.toNumber(cellValue);
}
if (showNegativeStatus) {
if (cellValue < 0) {
isNegative = true;
}
}
}
else if (type === 'amount') {
const autoFill = handleDefaultValue(props.autoFill, numberInputConfig.autoFill, true);
const digits = handleDefaultValue(props.digits, numberInputConfig.digits, 2);
const showCurrency = handleDefaultValue(props.showCurrency, numberInputConfig.showCurrency, false);
cellValue = XEUtils.toNumber(cellValue);
if (showNegativeStatus) {
if (cellValue < 0) {
isNegative = true;
}
}
cellValue = XEUtils.commafy(cellValue, { digits });
if (!autoFill) {
const [iStr, dStr] = cellValue.split('.');
if (dStr) {
const dRest = dStr.replace(/0+$/, '');
cellValue = dRest ? [iStr, '.', dRest].join('') : iStr;
}
}
if (showCurrency) {
cellValue = `${props.currencySymbol || numberInputConfig.currencySymbol || getI18n$3('vxe.numberInput.currencySymbol') || ''}${cellValue}`;
}
}
else {
if (type === 'integer') {
cellValue = XEUtils.toInteger(cellValue);
}
if (showNegativeStatus) {
if (XEUtils.toNumber(cellValue) < 0) {
isNegative = true;
}
}
}
}
return getCellLabelVNs(renderOpts, params, cellValue, isNegative
? {
class: 'is--negative'
}
: {});
}
function handleFormatDatePicker(renderOpts, renderParams) {
const { props = {} } = renderOpts;
const { cellValue } = renderParams;
if (cellValue) {
if (props.type !== 'time') {
return getLabelFormatDate(cellValue, props);
}
}
return cellValue;
}
function handleFormatSelect(renderOpts, renderParams) {
const { cellValue } = renderParams;
return handleSelectCellValue(cellValue, renderOpts);
}
function handleSetSelectValue(renderOpts, renderParams) {
const { row, column, cellValue } = renderParams;
const { field } = column;
if (field) {
const { options, optionGroups, optionProps = {}, optionGroupProps = {}, props } = renderOpts;
if (isEmptyValue(cellValue)) {
XEUtils.set(row, field, props && props.multiple ? [] : null);
return;
}
const isMultiVal = XEUtils.indexOf(`${cellValue}`, ',') > -1;
const labelProp = optionProps.label || 'label';
const valueProp = optionProps.value || 'value';
const labelMpas = {};
if (optionGroups && optionGroups.length) {
const groupOptions = optionGroupProps.options || 'options';
for (let i = 0; i < optionGroups.length; i++) {
const opts = optionGroups[i][groupOptions] || {};
for (let j = 0; j < opts.length; j++) {
const item = opts[j];
if (isMultiVal) {
labelMpas[item[labelProp]] = item;
/* eslint-disable eqeqeq */
}
else if (item[labelProp] == cellValue) {
XEUtils.set(row, field, item[valueProp]);
return;
}
}
}
}
else {
if (options) {
for (let i = 0; i < options.length; i++) {
const item = options[i];
if (isMultiVal) {
labelMpas[item[labelProp]] = item;
/* eslint-disable eqeqeq */
}
else if (item[labelProp] == cellValue) {
XEUtils.set(row, field, item[valueProp]);
return;
}
}
}
}
if (isMultiVal) {
XEUtils.set(row, field, (isMultiVal
? cellValue.split(',')
: [cellValue]).map((label) => {
const item = labelMpas[label];
return item ? item[valueProp] : label;
}));
}
else {
XEUtils.set(row, field, cellValue);
}
}
}
function handleFormatTreeSelect(renderOpts, params) {
const { cellValue } = params;
return handleTreeSelectCellValue(cellValue, renderOpts);
}
function handleSetTreeSelectValue(renderOpts, params) {
const { row, column, cellValue } = params;
const { field } = column;
if (field) {
const { options, optionProps = {} } = renderOpts;
const labelProp = optionProps.label || 'label';
const valueProp = optionProps.value || 'value';
const childrenProp = optionProps.children || 'children';
const matchRest = XEUtils.findTree(options || [], item => XEUtils.get(item, labelProp) === cellValue, { children: childrenProp });
if (matchRest) {
const selectItem = matchRest.item;
if (selectItem) {
XEUtils.set(row, field, selectItem[valueProp]);
return;
}
}
XEUtils.set(row, field, cellValue);
}
}
function getNativeInputRenderCellVNs(cellValue, labelVNs, renderOpts, renderParams) {
const { $table, row, column } = renderParams;
const { name } = renderOpts;
const tableProps = $table.props;
const { editConfig, mouseConfig } = tableProps;
let isColSelected = false;
let isActiveCellArea = false;
if (editConfig && mouseConfig) {
const tableReactData = $table.reactData;
const { editStore } = tableReactData;
const { selected } = editStore;
isColSelected = row === selected.row && column === selected.column;
if ($table.getActiveCellArea) {
const activeCellArea = $table.getActiveCellArea();
if (activeCellArea) {
isActiveCellArea = row === activeCellArea.row && column === activeCellArea.column;
}
}
}
const cellVNs = labelVNs;
if (isActiveCellArea || isColSelected) {
cellVNs.push(h('' + name, Object.assign(Object.assign({ key: 2, class: `vxe-default-${name} vxe-reusekeep-control`, value: cellValue }, getNativeAttrs(renderOpts)), getNativeEditOns(renderOpts, renderParams))));
}
return cellVNs;
}
function getInputRenderCellVNs(cellValue, labelVNs, renderOpts, renderParams) {
const { $table, row, column } = renderParams;
const tableProps = $table.props;
const { editConfig, mouseConfig } = tableProps;
let isColSelected = false;
let isActiveCellArea = false;
if (editConfig && mouseConfig) {
const tableReactData = $table.reactData;
const { editStore } = tableReactData;
const { computeEditOpts } = $table.getComputeMaps();
const editOpts = computeEditOpts.value;
if (editOpts.isReuseKeep) {
const { selected } = editStore;
isColSelected = row === selected.row && column === selected.column;
if ($table.getActiveCellArea) {
const activeCellArea = $table.getActiveCellArea();
if (activeCellArea) {
isActiveCellArea = row === activeCellArea.row && column === activeCellArea.column;
}
}
}
}
const cellVNs = labelVNs;
if (isActiveCellArea || isColSelected) {
const compProps = getCellEditProps(renderOpts, renderParams, cellValue);
const { className, inputClassName } = compProps;
cellVNs.push(h(getDefaultComponent(renderOpts), Object.assign(Object.assign(Object.assign({ key: 2 }, compProps), { className: 'vxe-reusekeep-control' + (className ? (' ' + className) : ''), inputClassName: 'vxe-reusekeep-control' + (inputClassName ? (' ' + inputClassName) : '') }), getEditOns(renderOpts, renderParams))));
}
return cellVNs;
}
/**
* 表格 - 渲染器
*/
renderer$2.mixin({
input: {
tableAutoFocus: true,
renderTableEdit: nativeInputEditRender,
renderTableCell: nativeInputCellRender,
renderTableDefault: nativeInputEditRender,
createTableFilterOptions: defaultFilterOptions,
renderTableFilter: nativeFilterRender,
tableFilterDefaultMethod: handleInputFilterMethod
},
textarea: {
tableAutoFocus: true,
renderTableEdit: nativeInputEditRender,
renderTableCell: nativeInputCellRender,
renderTableDefault: nativeInputEditRender
},
select: {
renderTableEdit: nativeSelectEditRender,
renderTableDefault: nativeSelectEditRender,
renderTableCell(renderOpts, params) {
const { options, optionGroups } = renderOpts;
const { $table, row, column } = params;
const opSize = options ? options.length : null;
const ogSize = optionGroups ? optionGroups.length : null;
const { cellResult } = $table.effectCellData(row, column, {
key: 'render_table_cell',
isChanged({ oldValue, cellValue }) {
return oldValue && oldValue[0] === cellValue && oldValue[1] === opSize && oldValue[2] === ogSize;
},
setValue({ cellValue }) {
return [cellValue, opSize, ogSize];
},
getResult({ cellValue }) {
return handleSelectCellValue(cellValue, renderOpts);
}
});
// const cellResult = getSelectCellValue(renderOpts, params)
return getCellLabelVNs(renderOpts, params, cellResult);
},
createTableFilterOptions: defaultFilterOptions,
renderTableFilter(renderOpts, params) {
const { column } = params;
return column.filters.map((option, oIndex) => {
return h('select', Object.assign(Object.assign({ key: oIndex, class: 'vxe-default-select' }, getNativeAttrs(renderOpts)), getNativeFilterOns(renderOpts, params, option)), renderOpts.optionGroups ? renderNativeOptgroups(renderOpts, params, renderNativeOptions) : renderNativeOptions(renderOpts.options, renderOpts, params));
});
},
tableCellFormatter: handleFormatSelect,
tableCellCopyMethod: handleFormatSelect,
tableCellPasteMethod: handleSetSelectValue,
tableFilterDefaultMethod: handleFilterMethod,
tableExportMethod: handleExportSelectMethod
},
VxeInput: {
tableAutoFocus: true,
renderTableEdit: defaultInputEditRender,
renderTableCell(renderOpts, renderParams) {
const { props = {} } = renderOpts;
const { row, column } = renderParams;
const inputConfig = getConfig$3().input || {};
const digits = props.digits || inputConfig.digits || 2;
let cellValue = XEUtils.get(row, column.field);
if (cellValue) {
switch (props.type) {
case 'date':
case 'week':
case 'month':
case 'quarter':
case 'year':
cellValue = getLabelFormatDate(cellValue, props);
break;
case 'float':
cellValue = XEUtils.toFixed(XEUtils.floor(cellValue, digits), digits);
break;
}
}
const cellVNs = getCellLabelVNs(renderOpts, renderParams, cellValue);
return getInputRenderCellVNs(cellValue, cellVNs, renderOpts, renderParams);
},
renderTableDefault: defaultInputEditRender,
createTableFilterOptions: defaultFilterOptions,
renderTableFilter: defaultFilterRender,
renderTableFloatingFilter: defaultFloatingFilterRender,
tableFilterDefaultMethod: handleInputFilterMethod
},
FormatNumberInput: {
renderTableDefault(renderOpts, renderParams) {
const { row, column } = renderParams;
const cellValue = XEUtils.get(row, column.field);
return handleNumberCell(cellValue, renderOpts, renderParams);
},
tableFilterDefaultMethod({ option, row, column }) {
const { data } = option;
const cellValue = XEUtils.get(row, column.field);
/* eslint-disable eqeqeq */
return cellValue == data;
},
tableExportMethod(params) {
const { row, column } = params;
const cellValue = XEUtils.get(row, column.field);
return cellValue;
}
},
VxeNumberInput: {
tableAutoFocus: true,
renderTableEdit: defaultInputEditRender,
renderTableCell(renderOpts, renderParams) {
const { row, column } = renderParams;
const cellValue = XEUtils.get(row, column.field);
const cellVNs = handleNumberCell(cellValue, renderOpts, renderParams);
return getInputRenderCellVNs(cellValue, cellVNs, renderOpts, renderParams);
},
renderTableFooter(renderOpts, params) {
const { props = {} } = renderOpts;
const { row, column, _columnIndex } = params;
const { type } = props;
// 兼容老模式
const itemValue = XEUtils.isArray(row) ? row[_columnIndex] : XEUtils.get(row, column.field);
if (XEUtils.isNumber(itemValue)) {
const numberInputConfig = getConfig$3().numberInput || {};
if (type === 'float') {
const autoFill = handleDefaultValue(props.autoFill, numberInputConfig.autoFill, true);
const digits = handleDefaultValue(props.digits, numberInputConfig.digits, 1);
let amountLabel = XEUtils.toFixed(XEUtils.floor(itemValue, digits), digits);
if (!autoFill) {
amountLabel = '' + XEUtils.toNumber(amountLabel);
}
return amountLabel;
}
else if (type === 'amount') {
const autoFill = handleDefaultValue(props.autoFill, numberInputConfig.autoFill, true);
const digits = handleDefaultValue(props.digits, numberInputConfig.digits, 2);
const showCurrency = handleDefaultValue(props.showCurrency, numberInputConfig.showCurrency, false);
let amountLabel = XEUtils.commafy(XEUtils.toNumber(itemValue), { digits });
if (!autoFill) {
const [iStr, dStr] = amountLabel.split('.');
if (dStr) {
const dRest = dStr.replace(/0+$/, '');
amountLabel = dRest ? [iStr, '.', dRest].join('') : iStr;
}
}
if (showCurrency) {
amountLabel = `${props.currencySymbol || numberInputConfig.currencySymbol || getI18n$3('vxe.numberInput.currencySymbol') || ''}${amountLabel}`;
}
return amountLabel;
}
}
return getFuncText(itemValue, 1);
},
renderTableDefault: defaultInputEditRender,
createTableFilterOptions: defaultFilterOptions,
renderTableFilter: defaultFilterRender,
renderTableFloatingFilter: defaultFloatingFilterRender,
tableFilterDefaultMethod({ option, row, column }) {
const { data } = option;
const cellValue = XEUtils.get(row, column.field);
/* eslint-disable eqeqeq */
return cellValue == data;
},
tableExportMethod(params) {
const { row, column } = params;
const cellValue = XEUtils.get(row, column.field);
return cellValue;
}
},
VxeDatePicker: {
tableAutoFocus: true,
renderTableEdit: defaultEditRender,
renderTableCell(renderOpts, params) {
const props = renderOpts.props || {};
const { $table, row, column } = params;
const { cellResult } = $table.effectCellData(row, column, {
key: 'render_table_cell',
getResult({ cellValue }) {
if (cellValue) {
if (props.type !== 'time') {
return getLabelFormatDate(cellValue, props);
}
}
return cellValue;
}
});
return getCellLabelVNs(renderOpts, params, cellResult);
},
tableCellFormatter: handleFormatDatePicker,
renderTableDefault: defaultEditRender,
createTableFilterOptions: defaultFilterOptions,
renderTableFilter: defaultFilterRender,
renderTableFloatingFilter: defaultFloatingFilterRender,
tableFilterDefaultMethod: handleFilterMethod
},
VxeDateRangePicker: {
tableAutoFocus: true,
renderTableEdit(renderOpts, params) {
const { startField, endField } = renderOpts;
const { $table, row, column } = params;
const { model } = column;
const cellValue = getCellValue(row, column);
const seProps = {};
const seOs = {};
if (startField && endField) {
seProps.startValue = XEUtils.get(row, startField);
seProps.endValue = XEUtils.get(row, endField);
seOs['onUpdate:startValue'] = (value) => {
if (startField) {
XEUtils.set(row, startField, value);
}
};
seOs['onUpdate:endValue'] = (value) => {
if (endField) {
XEUtils.set(row, endField, value);
}
};
}
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue, seProps)), getComponentOns(renderOpts, params, {
model(cellValue) {
model.update = true;
model.value = cellValue;
setCellValue(row, column, cellValue);
},
change() {
$table.updateStatus(params);
},
blur() {
$table.handleCellRuleUpdateStatus('blur', params);
}
}, seOs)))
];
},
renderTableDefault(renderOpts, params) {
const { startField, endField } = renderOpts;
const { row, column } = params;
const { model } = column;
const cellValue = getCellValue(row, column);
const seProps = {};
const seOs = {};
if (startField && endField) {
seProps.startValue = XEUtils.get(row, startField);
seProps.endValue = XEUtils.get(row, endField);
seOs['onUpdate:startValue'] = (value) => {
if (startField) {
XEUtils.set(row, startField, value);
}
};
seOs['onUpdate:endValue'] = (value) => {
if (endField) {
XEUtils.set(row, endField, value);
}
};
}
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue, seProps)), getComponentOns(renderOpts, params, {
model(cellValue) {
model.update = true;
model.value = cellValue;
setCellValue(row, column, cellValue);
}
}, seOs)))
];
},
renderTableCell(renderOpts, params) {
const { startField, endField } = renderOpts;
const { row, column } = params;
let startValue = '';
let endValue = '';
if (startField && endField) {
startValue = XEUtils.get(row, startField);
endValue = XEUtils.get(row, endField);
}
else {
const cellValue = XEUtils.get(row, column.field);
if (cellValue) {
if (XEUtils.isArray(cellValue)) {
startValue = cellValue[0];
endValue = cellValue[1];
}
else {
const strs = `${cellValue}`.split(',');
startValue = strs[0];
endValue = strs[1];
}
}
}
let cellLabel = '';
if (startValue && endValue) {
cellLabel = `${startValue} ~ ${endValue}`;
}
return getCellLabelVNs(renderOpts, params, cellLabel);
}
},
VxeTextarea: {
tableAutoFocus: true,
renderTableDefault: defaultInputEditRender,
renderTableCell(renderOpts, renderParams) {
const { row, column } = renderParams;
const cellValue = XEUtils.get(row, column.field);
const cellVNs = getCellLabelVNs(renderOpts, renderParams, cellValue);
return getInputRenderCellVNs(cellValue, cellVNs, renderOpts, renderParams);
},
renderTableEdit: defaultInputEditRender
},
VxeButton: {
renderTableDefault: buttonCellRender
},
VxeButtonGroup: {
renderTableDefault(renderOpts, params) {
const { options } = renderOpts;
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign({ options }, getCellEditProps(renderOpts, params, null)), getComponentOns(renderOpts, params)))
];
}
},
VxeSelect: {
tableAutoFocus: true,
renderTableEdit: defaultSelectEditRender,
renderTableDefault: defaultSelectEditRender,
renderTableCell(renderOpts, params) {
const { options, optionGroups } = renderOpts;
const { $table, row, column } = params;
const opSize = options ? options.length : null;
const ogSize = optionGroups ? optionGroups.length : null;
const { cellResult } = $table.effectCellData(row, column, {
key: 'render_table_cell',
isChanged({ oldValue, cellValue }) {
return oldValue && oldValue[0] === cellValue && oldValue[1] === opSize && oldValue[2] === ogSize;
},
setValue({ cellValue }) {
return [cellValue, opSize, ogSize];
},
getResult({ cellValue }) {
return handleSelectCellValue(cellValue, renderOpts);
}
});
// const cellResult = getSelectCellValue(renderOpts, params)
return getCellLabelVNs(renderOpts, params, cellResult);
},
createTableFilterOptions: defaultFilterOptions,
renderTableFilter(renderOpts, params) {
const { column } = params;
const { options, optionProps, optionGroups, optionGroupProps } = renderOpts;
return column.filters.map((option, oIndex) => {
const optionValue = option.data;
return h(getDefaultComponent(renderOpts), Object.assign(Object.assign({ key: oIndex }, getCellEditFilterProps(renderOpts, params, optionValue, { options, optionProps, optionGroups, optionGroupProps })), getFilterOns(renderOpts, params, option)));
});
},
renderTableFloatingFilter(renderOpts, params) {
const { option } = params;
const { options, optionProps, optionGroups, optionGroupProps } = renderOpts;
const optionValue = option.data;
return h(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditFilterProps(renderOpts, params, optionValue, { options, optionProps, optionGroups, optionGroupProps })), getFloatingFilterOns(renderOpts, params, option)));
},
tableCellFormatter: handleFormatSelect,
tableCellCopyMethod: handleFormatSelect,
tableCellPasteMethod: handleSetSelectValue,
tableFilterDefaultMethod: handleFilterMethod,
tableExportMethod: handleExportSelectMethod
},
VxeText: {
renderTableDefault(renderOpts, params) {
const { $table, row, column } = params;
const { props } = renderOpts;
const cellLabel = $table.getCellLabel(row, column);
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign(Object.assign({}, (props || {})), { content: cellLabel }), getComponentOns(renderOpts, params)))
];
}
},
VxeLink: {
renderTableDefault(renderOpts, params) {
const { $table, row, column } = params;
const { props } = renderOpts;
const { href } = props || {};
const cellLabel = $table.getCellLabel(row, column);
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign(Object.assign({}, (props || {})), { content: cellLabel, href: XEUtils.toFormatString(href, params) }), getComponentOns(renderOpts, params)))
];
}
},
/**
* 已废弃,被 FormatSelect 替换
* @deprecated
*/
formatOption: {
renderTableDefault(renderOpts, params) {
return getCellLabelVNs(renderOpts, params, getSelectCellValue(renderOpts, params));
}
},
FormatSelect: {
renderTableDefault(renderOpts, params) {
const { options, optionGroups } = renderOpts;
const { $table, row, column } = params;
const opSize = options ? options.length : null;
const ogSize = optionGroups ? optionGroups.length : null;
const { cellResult } = $table.effectCellData(row, column, {
key: 'render_table_cell',
isChanged({ oldValue, cellValue }) {
return oldValue && oldValue[0] === cellValue && oldValue[1] === opSize && oldValue[2] === ogSize;
},
setValue({ cellValue }) {
return [cellValue, opSize, ogSize];
},
getResult({ cellValue }) {
return handleSelectCellValue(cellValue, renderOpts);
}
});
// const cellResult = getSelectCellValue(renderOpts, params)
return getCellLabelVNs(renderOpts, params, cellResult);
},
tableCellFormatter: handleFormatSelect,
tableCellCopyMethod: handleFormatSelect,
tableCellPasteMethod: handleSetSelectValue,
tableFilterDefaultMethod: handleFilterMethod,
tableExportMethod: handleExportSelectMethod
},
VxeTreeSelect: {
tableAutoFocus: true,
renderTableEdit: defaultTableOrTreeSelectEditRender,
renderTableCell(renderOpts, params) {
const { options, optionGroups } = renderOpts;
const { $table, row, column } = params;
const opSize = options ? options.length : null;
const ogSize = optionGroups ? optionGroups.length : null;
const { cellResult } = $table.effectCellData(row, column, {
key: 'render_table_cell',
isChanged({ oldValue, cellValue }) {
return oldValue && oldValue[0] === cellValue && oldValue[1] === opSize && oldValue[2] === ogSize;
},
setValue({ cellValue }) {
return [cellValue, opSize, ogSize];
},
getResult({ cellValue }) {
return handleTreeSelectCellValue(cellValue, renderOpts);
}
});
// const cellResult = getTreeSelectCellValue(renderOpts, params)
return getCellLabelVNs(renderOpts, params, cellResult);
},
tableCellFormatter: handleFormatTreeSelect,
tableCellCopyMethod: handleFormatTreeSelect,
tableCellPasteMethod: handleSetTreeSelectValue,
tableExportMethod: handleExportTreeSelectMethod
},
/**
* 已废弃,被 FormatTreeSelect 替换
* @deprecated
*/
formatTree: {
renderTableDefault(renderOpts, params) {
return getCellLabelVNs(renderOpts, params, getTreeSelectCellValue(renderOpts, params));
}
},
FormatTreeSelect: {
renderTableDefault(renderOpts, params) {
const { options, optionGroups } = renderOpts;
const { $table, row, column } = params;
const opSize = options ? options.length : null;
const ogSize = optionGroups ? optionGroups.length : null;
const { cellResult } = $table.effectCellData(row, column, {
key: 'render_table_cell',
isChanged({ oldValue, cellValue }) {
return oldValue && oldValue[0] === cellValue && oldValue[1] === opSize && oldValue[2] === ogSize;
},
setValue({ cellValue }) {
return [cellValue, opSize, ogSize];
},
getResult({ cellValue }) {
return handleTreeSelectCellValue(cellValue, renderOpts);
}
});
// const cellResult = getTreeSelectCellValue(renderOpts, params)
return getCellLabelVNs(renderOpts, params, cellResult);
},
tableCellFormatter: handleFormatTreeSelect,
tableCellCopyMethod: handleFormatTreeSelect,
tableCellPasteMethod: handleSetTreeSelectValue,
tableExportMethod: handleExportTreeSelectMethod
},
VxeCascader: {
tableAutoFocus: true,
renderTableEdit: defaultTableOrTreeSelectEditRender,
renderTableCell(renderOpts, params) {
const { options, optionGroups } = renderOpts;
const { $table, row, column } = params;
const opSize = options ? options.length : null;
const ogSize = optionGroups ? optionGroups.length : null;
const { cellResult } = $table.effectCellData(row, column, {
key: 'render_table_cell',
isChanged({ oldValue, cellValue }) {
return oldValue && oldValue[0] === cellValue && oldValue[1] === opSize && oldValue[2] === ogSize;
},
setValue({ cellValue }) {
return [cellValue, opSize, ogSize];
},
getResult({ cellValue }) {
return handleTreeSelectCellValue(cellValue, renderOpts);
}
});
// const cellResult = getTreeSelectCellValue(renderOpts, params)
return getCellLabelVNs(renderOpts, params, cellResult);
},
tableCellFormatter: handleFormatTreeSelect,
tableCellCopyMethod: handleFormatTreeSelect,
tableCellPasteMethod: handleSetTreeSelectValue,
tableExportMethod: handleExportTreeSelectMethod
},
VxeTableSelect: {
tableAutoFocus: true,
renderTableEdit: defaultTableOrTreeSelectEditRender,
renderTableCell(renderOpts, params) {
const { options, optionGroups } = renderOpts;
const { $table, row, column } = params;
const opSize = options ? options.length : null;
const ogSize = optionGroups ? optionGroups.length : null;
const { cellResult } = $table.effectCellData(row, column, {
key: 'render_table_cell',
isChanged({ oldValue, cellValue }) {
return oldValue && oldValue[0] === cellValue && oldValue[1] === opSize && oldValue[2] === ogSize;
},
setValue({ cellValue }) {
return [cellValue, opSize, ogSize];
},
getResult({ cellValue }) {
return handleTreeSelectCellValue(cellValue, renderOpts);
}
});
// const cellResult = getTreeSelectCellValue(renderOpts, params)
return getCellLabelVNs(renderOpts, params, cellResult);
},
tableCellFormatter: handleFormatTreeSelect,
tableCellCopyMethod: handleFormatTreeSelect,
tableCellPasteMethod: handleSetTreeSelectValue,
tableExportMethod: handleExportTreeSelectMethod
},
VxeColorPicker: {
tableAutoFocus: true,
renderTableEdit(renderOpts, params) {
const { row, column } = params;
const { options } = renderOpts;
const cellValue = getCellValue(row, column);
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue, { colors: options })), getEditOns(renderOpts, params)))
];
},
renderTableCell(renderOpts, params) {
const { row, column } = params;
const cellValue = XEUtils.get(row, column.field);
return h('span', {
class: 'vxe-color-picker--readonly'
}, [
h('div', {
class: 'vxe-color-picker--readonly-color',
style: {
backgroundColor: cellValue
}
})
]);
}
},
VxeIconPicker: {
tableAutoFocus: true,
renderTableEdit(renderOpts, params) {
const { row, column } = params;
const { options } = renderOpts;
const cellValue = getCellValue(row, column);
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue, { icons: options })), getEditOns(renderOpts, params)))
];
},
renderTableCell(renderOpts, params) {
const { row, column } = params;
const cellValue = XEUtils.get(row, column.field);
return h('i', {
class: cellValue
});
}
},
VxeRadioGroup: {
renderTableDefault: radioAndCheckboxGroupEditRender
},
VxeCheckbox: {
renderTableDefault: checkboxEditRender
},
VxeCheckboxGroup: {
renderTableDefault: radioAndCheckboxGroupEditRender
},
VxeSwitch: {
tableAutoFocus: 'button',
renderTableEdit: defaultEditRender,
renderTableDefault: defaultEditRender
},
VxeUpload: {
renderTableEdit: defaultEditRender,
renderTableCell: defaultEditRender,
renderTableDefault: defaultEditRender
},
VxeImage: {
renderTableDefault(renderOpts, params) {
const { row, column } = params;
const { props } = renderOpts;
const cellValue = getCellValue(row, column);
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign(Object.assign({}, props), { src: cellValue }), getEditOns(renderOpts, params)))
];
}
},
VxeImageGroup: {
renderTableDefault(renderOpts, params) {
const { row, column } = params;
const { props } = renderOpts;
const cellValue = getCellValue(row, column);
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign(Object.assign({}, props), { urlList: cellValue }), getEditOns(renderOpts, params)))
];
}
},
VxeTextEllipsis: {
renderTableDefault(renderOpts, params) {
const { row, column } = params;
const { props } = renderOpts;
const cellValue = getCellValue(row, column);
return [
h(getDefaultComponent(renderOpts), Object.assign(Object.assign(Object.assign({}, props), { content: cellValue }), getEditOns(renderOpts, params)))
];
}
},
VxeRate: {
renderTableDefault: defaultEditRender
},
VxeSlider: {
renderTableDefault: defaultEditRender
},
// 以下已废弃
$input: {
tableAutoFocus: 'input',
renderTableEdit: oldEditRender,
renderTableCell(renderOpts, params) {
var _a;
const { props = {} } = renderOpts;
const { row, column } = params;
const digits = props.digits || ((_a = getConfig$3().input) === null || _a === void 0 ? void 0 : _a.digits) || 2;
let cellValue = XEUtils.get(row, column.field);
if (cellValue) {
switch (props.type) {
case 'date':
case 'week':
case 'month':
case 'year':
cellValue = getLabelFormatDate(cellValue, props);
break;
case 'float':
cellValue = XEUtils.toFixed(XEUtils.floor(cellValue, digits), digits);
break;
}
}
return getCellLabelVNs(renderOpts, params, cellValue);
},
renderTableDefault: oldEditRender,
renderTableFilter: oldFilterRender,
tableFilterDefaultMethod: handleInputFilterMethod
},
$textarea: {
tableAutoFocus: 'textarea'
},
$button: {
renderTableDefault: oldButtonEditRender
},
$buttons: {
renderTableDefault: oldButtonsEditRender
},
$select: {
tableAutoFocus: 'input',
renderTableEdit: oldSelectEditRender,
renderTableDefault: oldSelectEditRender,
renderTableCell(renderOpts, params) {
return getCellLabelVNs(renderOpts, params, getSelectCellValue(renderOpts, params));
},
renderTableFilter(renderOpts, params) {
const { column } = params;
const { options, optionProps, optionGroups, optionGroupProps } = renderOpts;
return column.filters.map((option, oIndex) => {
const optionValue = option.data;
return h(getOldComponent(renderOpts), Object.assign(Object.assign({ key: oIndex }, getCellEditFilterProps(renderOpts, params, optionValue, { options, optionProps, optionGroups, optionGroupProps })), getFilterOns(renderOpts, params, option)));
});
},
tableFilterDefaultMethod: handleFilterMethod,
tableExportMethod: handleExportSelectMethod
},
$radio: {
tableAutoFocus: 'input'
},
$checkbox: {
tableAutoFocus: 'input'
},
$switch: {
tableAutoFocus: 'button',
renderTableEdit: oldEditRender,
renderTableDefault: oldEditRender
}
// 以上已废弃
});
const { warnLog: warnLog$2, errLog: errLog$2 } = createComponentLog('table');
const { getConfig: getConfig$2, getIcon: getIcon$1, getI18n: getI18n$2, renderer: renderer$1, formats, createEvent: createEvent$2, globalResize, interceptor, hooks: hooks$1, globalEvents: globalEvents$1, GLOBAL_EVENT_KEYS: GLOBAL_EVENT_KEYS$1, useFns: useFns$2, renderEmptyElement: renderEmptyElement$1 } = VxeUI;
const supportMaxRow = 5e6;
const customStorageKey = 'VXE_CUSTOM_STORE';
const maxYHeight = 5e6;
const maxXWidth = 5e6;
const sourceType = 'table';
let crossTableDragRowObj = null;
var VxeTableComponent = defineVxeComponent({
name: 'VxeTable',
props: tableProps,
emits: tableEmits,
setup(props, context) {
const { slots, emit } = context;
const xID = XEUtils.uniqueId();
const browseObj = XEUtils.browse();
// 使用已安装的组件,如果未安装则不渲染
const VxeUILoadingComponent = VxeUI.getComponent('VxeLoading');
const VxeUITooltipComponent = VxeUI.getComponent('VxeTooltip');
const $xeModal = inject('$xeModal', null);
const $xeTabs = inject('$xeTabs', null);
const $xeParentTable = inject('$xeTable', null);
const $xeSplitter = inject('$xeSplitter', null);
const $xeGrid = inject('$xeGrid', null);
const $xeGantt = inject('$xeGantt', null);
const $xeGGWrapper = $xeGrid || $xeGantt;
const { computeSize } = useFns$2.useSize(props);
const crossTableDragRowInfo = getCrossTableDragRowInfo();
const reactData = reactive(createReactData$2());
const internalData = createInternalData$3();
let tableMethods = {};
let tablePrivateMethods = {};
const refElem = ref();
const refVarElem = ref();
const refTooltip = ref();
const refCommTooltip = ref();
const refValidTooltip = ref();
const refTableMenu = ref();
const refTableFilter = ref();
const refTableCustom = ref();
const refTableViewportElem = ref();
const refTableHeader = ref();
const refTableBody = ref();
const refTableFooter = ref();
const refTableLeftHeader = ref();
const refTableLeftBody = ref();
const refTableLeftFooter = ref();
const refTableRightHeader = ref();
const refTableRightBody = ref();
const refTableRightFooter = ref();
const refTeleportWrapper = ref();
const refPopupWrapperElem = ref();
const refCustomContainerElem = ref();
const refLeftContainer = ref();
const refRightContainer = ref();
const refColResizeBar = ref();
const refRowResizeBar = ref();
const refEmptyPlaceholder = ref();
const refDragTipElem = ref();
const refDragRowLineElem = ref();
const refDragColLineElem = ref();
const refRowExpandElem = ref();
const refRowExpandYSpaceElem = ref();
const refScrollXVirtualElem = ref();
const refScrollYVirtualElem = ref();
const refScrollXHandleElem = ref();
const refScrollXLeftCornerElem = ref();
const refScrollXRightCornerElem = ref();
const refScrollYHandleElem = ref();
const refScrollYTopCornerElem = ref();
const refScrollXWrapperElem = ref();
const refScrollYWrapperElem = ref();
const refScrollYBottomCornerElem = ref();
const refScrollXSpaceElem = ref();
const refScrollYSpaceElem = ref();
let $xeToolbar;
const computeTableId = computed(() => {
const { id } = props;
if (id) {
if (XEUtils.isFunction(id)) {
return `${id({ $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt }) || ''}`;
}
return `${id}`;
}
return '';
});
const computeRowField = computed(() => {
const rowOpts = computeRowOpts.value;
return `${props.rowId || rowOpts.keyField || '_X_ROW_KEY'}`;
});
const computeValidOpts = computed(() => {
const opts = Object.assign({}, getConfig$2().table.validConfig, props.validConfig);
// 兼容老版本
if (XEUtils.isBoolean(opts.showMessage)) {
opts.showErrorMessage = opts.showMessage;
}
return opts;
});
/**
* @deprecated
*/
const computeSXOpts = computed(() => {
const virtualXOpts = computeVirtualXOpts.value;
return virtualXOpts;
});
const computeScrollXThreshold = computed(() => {
const virtualXOpts = computeVirtualXOpts.value;
const { threshold } = virtualXOpts;
if (threshold) {
return XEUtils.toNumber(threshold);
}
return 0;
});
/**
* @deprecated
*/
const computeSYOpts = computed(() => {
const virtualYOpts = computeVirtualYOpts.value;
return virtualYOpts;
});
const computeVirtualXOpts = computed(() => {
const { virtualXConfig, scrollX } = props;
const globalVirtualXConfig = getConfig$2().table.virtualXConfig;
const globalScrollX = getConfig$2().table.scrollX;
if (virtualXConfig) {
return Object.assign({}, globalVirtualXConfig, virtualXConfig);
}
if (scrollX) {
// 已废弃,保留兼容
return Object.assign({}, globalScrollX, scrollX);
}
if (globalVirtualXConfig) {
return Object.assign({}, globalVirtualXConfig, virtualXConfig);
}
// 已废弃,保留兼容
return Object.assign({}, globalScrollX, scrollX);
});
const computeVirtualYOpts = computed(() => {
const { virtualYConfig, scrollY } = props;
const globalVirtualYConfig = getConfig$2().table.virtualYConfig;
const globalScrollY = getConfig$2().table.scrollY;
if (virtualYConfig) {
return Object.assign({}, globalVirtualYConfig, virtualYConfig);
}
if (scrollY) {
// 已废弃,保留兼容
return Object.assign({}, globalScrollY, scrollY);
}
if (globalVirtualYConfig) {
return Object.assign({}, globalVirtualYConfig, virtualYConfig);
}
// 已废弃,保留兼容
return Object.assign({}, globalScrollY, scrollY);
});
const computeScrollbarOpts = computed(() => {
return Object.assign({}, getConfig$2().table.scrollbarConfig, props.scrollbarConfig);
});
const computeScrollbarXOpts = computed(() => {
var _a;
const scrollbarOpts = computeScrollbarOpts.value;
return Object.assign({}, scrollbarOpts.x, ((_a = props.scrollbarConfig) === null || _a === void 0 ? void 0 : _a.x) || {});
});
const computeScrollbarYOpts = computed(() => {
var _a;
const scrollbarOpts = computeScrollbarOpts.value;
return Object.assign({}, scrollbarOpts.y, ((_a = props.scrollbarConfig) === null || _a === void 0 ? void 0 : _a.y) || {});
});
const computeScrollbarXToTop = computed(() => {
const scrollbarXOpts = computeScrollbarXOpts.value;
return scrollbarXOpts.position === 'top';
});
const computeScrollbarYToLeft = computed(() => {
const scrollbarYOpts = computeScrollbarYOpts.value;
return scrollbarYOpts.position === 'left';
});
const computeScrollYThreshold = computed(() => {
const virtualYOpts = computeVirtualYOpts.value;
const { threshold } = virtualYOpts;
if (threshold) {
return XEUtils.toNumber(threshold);
}
return 0;
});
const computeRowHeightMaps = computed(() => {
return reactData.rowHeightStore;
});
const computeDefaultRowHeight = computed(() => {
const vSize = computeSize.value;
const rowHeightMaps = computeRowHeightMaps.value;
return rowHeightMaps[vSize || 'default'] || 18;
});
const computeColumnOpts = computed(() => {
return Object.assign({}, getConfig$2().table.columnConfig, props.columnConfig);
});
const computeCurrentColumnOpts = computed(() => {
return Object.assign({}, getConfig$2().table.currentColumnConfig, props.currentColumnConfig);
});
const computeCellOpts = computed(() => {
const cellOpts = Object.assign({}, getConfig$2().table.cellConfig, props.cellConfig);
if (cellOpts.height) {
cellOpts.height = XEUtils.toNumber(cellOpts.height);
}
return cellOpts;
});
const computeHeaderCellOpts = computed(() => {
const headerCellOpts = Object.assign({}, getConfig$2().table.headerCellConfig, props.headerCellConfig);
const defaultRowHeight = computeDefaultRowHeight.value;
const cellOpts = computeCellOpts.value;
let headCellHeight = XEUtils.toNumber(getCalcHeight(headerCellOpts.height || cellOpts.height));
if ($xeGantt) {
const { computeTaskViewScales } = $xeGantt.getComputeMaps();
const taskViewScales = computeTaskViewScales.value;
if (taskViewScales && taskViewScales.length > 2) {
const ganttMinHeadCellHeight = defaultRowHeight / 2 * taskViewScales.length;
headCellHeight = Math.max(ganttMinHeadCellHeight, headCellHeight);
}
}
headerCellOpts.height = headCellHeight;
return headerCellOpts;
});
const computeFooterCellOpts = computed(() => {
const footerCellOpts = Object.assign({}, getConfig$2().table.footerCellConfig, props.footerCellConfig);
const cellOpts = computeCellOpts.value;
footerCellOpts.height = XEUtils.toNumber(getCalcHeight(footerCellOpts.height || cellOpts.height));
return footerCellOpts;
});
const computeRowOpts = computed(() => {
return Object.assign({}, getConfig$2().table.rowConfig, props.rowConfig);
});
const computeAggregateOpts = computed(() => {
return Object.assign({}, getConfig$2().table.aggregateConfig || getConfig$2().table.rowGroupConfig, props.aggregateConfig || props.rowGroupConfig);
});
const computeRowGroupOpts = computed(() => {
return computeAggregateOpts.value;
});
const computeAggregateMode = computed(() => {
const aggregateOpts = computeAggregateOpts.value;
return aggregateOpts.mode;
});
const computeAggregateAccuracyOpts = computed(() => {
return Object.assign({}, getConfig$2().table.aggregateAccuracyConfig, props.aggregateAccuracyConfig);
});
const computeCurrentRowOpts = computed(() => {
return Object.assign({}, getConfig$2().table.currentRowConfig, props.currentRowConfig);
});
const computeRowDragOpts = computed(() => {
return Object.assign({}, getConfig$2().table.rowDragConfig, props.rowDragConfig);
});
const computeColumnDragOpts = computed(() => {
return Object.assign({}, getConfig$2().table.columnDragConfig, props.columnDragConfig);
});
const computeResizeOpts = computed(() => {
return Object.assign({}, getConfig$2().table.resizeConfig, props.resizeConfig);
});
const computeResizableOpts = computed(() => {
return Object.assign({}, getConfig$2().table.resizableConfig, props.resizableConfig);
});
const computeSeqOpts = computed(() => {
return Object.assign({ startIndex: 0 }, getConfig$2().table.seqConfig, props.seqConfig);
});
const computeRadioOpts = computed(() => {
return Object.assign({}, getConfig$2().table.radioConfig, props.radioConfig);
});
const computeCheckboxOpts = computed(() => {
return Object.assign({}, getConfig$2().table.checkboxConfig, props.checkboxConfig);
});
const computeTooltipOpts = computed(() => {
return Object.assign({}, getConfig$2().tooltip, getConfig$2().table.tooltipConfig, props.tooltipConfig);
});
const computeHeaderTooltipOpts = computed(() => {
return Object.assign({}, getConfig$2().tooltip, getConfig$2().table.headerTooltipConfig, props.headerTooltipConfig);
});
const computeFooterTooltipOpts = computed(() => {
return Object.assign({}, getConfig$2().tooltip, getConfig$2().table.footerTooltipConfig, props.footerTooltipConfig);
});
const computeTableTipConfig = computed(() => {
const { tooltipStore } = reactData;
const tooltipOpts = computeTooltipOpts.value;
return Object.assign({}, tooltipOpts, tooltipStore.currOpts);
});
const computeValidTipConfig = computed(() => {
const tooltipOpts = computeTooltipOpts.value;
return Object.assign({}, tooltipOpts);
});
const computeEditOpts = computed(() => {
return Object.assign({}, getConfig$2().table.editConfig, props.editConfig);
});
const computeEditDirtyOpts = computed(() => {
return Object.assign({}, getConfig$2().table.editDirtyConfig, props.editDirtyConfig);
});
const computeSortOpts = computed(() => {
return Object.assign({ orders: ['asc', 'desc', null] }, getConfig$2().table.sortConfig, props.sortConfig);
});
const computeFilterOpts = computed(() => {
return Object.assign({}, getConfig$2().table.filterConfig, props.filterConfig);
});
const computeFloatingFilterOpts = computed(() => {
return Object.assign({}, getConfig$2().table.floatingFilterConfig, props.floatingFilterConfig);
});
const computeMouseOpts = computed(() => {
return Object.assign({}, getConfig$2().table.mouseConfig, props.mouseConfig);
});
const computeAreaOpts = computed(() => {
return Object.assign({}, getConfig$2().table.areaConfig, props.areaConfig);
});
const computeKeyboardOpts = computed(() => {
return Object.assign({}, getConfig$2().table.keyboardConfig, props.keyboardConfig);
});
const computeClipOpts = computed(() => {
return Object.assign({}, getConfig$2().table.clipConfig, props.clipConfig);
});
const computeUndoRedoHistoryOpts = computed(() => {
return Object.assign({}, getConfig$2().table.undoRedoHistoryConfig, props.undoRedoHistoryConfig);
});
const computeFNROpts = computed(() => {
const fnrOpts = computeFnrOpts.value;
return fnrOpts;
});
const computeFnrOpts = computed(() => {
return Object.assign({}, getConfig$2().table.fnrConfig, props.fnrConfig);
});
const computeMenuOpts = computed(() => {
return Object.assign({}, getConfig$2().table.menuConfig, props.menuConfig);
});
const computeLeftFixedWidth = computed(() => {
const { columnStore } = reactData;
const { leftList } = columnStore;
let leftWidth = 0;
for (let i = 0; i < leftList.length; i++) {
const column = leftList[i];
leftWidth += column.renderWidth;
}
return leftWidth;
});
const computeRightFixedWidth = computed(() => {
const { columnStore } = reactData;
const { rightList } = columnStore;
let leftWidth = 0;
for (let i = 0; i < rightList.length; i++) {
const column = rightList[i];
leftWidth += column.renderWidth;
}
return leftWidth;
});
// 合并列是否超越冻结列
const computeBodyMergeCoverFixed = computed(() => {
const { columnStore, mergeBodyFlag } = reactData;
const { mergeBodyList, visibleColumn } = internalData;
const { leftList, rightList } = columnStore;
const rscIndex = visibleColumn.length - rightList.length;
if (mergeBodyFlag && (leftList.length || rightList.length)) {
const lecIndex = leftList.length;
for (let i = 0; i < mergeBodyList.length; i++) {
const { col, colspan } = mergeBodyList[i];
if (col < lecIndex && col + colspan > lecIndex) {
return true;
}
else if (col < rscIndex && col + colspan > rscIndex) {
return true;
}
}
}
return false;
});
const computeIsHeaderRenderOptimize = computed(() => {
const { spanMethod, footerSpanMethod, showHeaderOverflow: allColumnHeaderOverflow } = props;
const { isGroup, scrollXLoad } = reactData;
let isOptimizeMode = false;
if (isGroup) ;
else {
// 如果是使用优化模式
if (scrollXLoad && allColumnHeaderOverflow) {
if (spanMethod || footerSpanMethod) ;
else {
isOptimizeMode = true;
}
}
}
return isOptimizeMode;
});
const computeIsBodyRenderOptimize = computed(() => {
const { spanMethod, footerSpanMethod } = props;
const { scrollXLoad, scrollYLoad, isAllOverflow, expandColumn } = reactData;
const bodyMergeCoverFixed = computeBodyMergeCoverFixed.value;
const expandOpts = computeExpandOpts.value;
let isOptimizeMode = false;
// 如果是使用优化模式
if (scrollXLoad || scrollYLoad || isAllOverflow) {
// 如果是展开行,内联模式,不支持优化
// 如果是方法合并,不支持优化
// 如果固定列且配置式合并,不支持优化
if ((expandColumn && expandOpts.mode !== 'fixed') || bodyMergeCoverFixed || spanMethod || footerSpanMethod) ;
else {
isOptimizeMode = true;
}
}
return isOptimizeMode;
});
const computeIsFooterRenderOptimize = computed(() => {
const { spanMethod, footerSpanMethod, showFooterOverflow: allColumnFooterOverflow } = props;
const { scrollXLoad } = reactData;
let isOptimizeMode = false;
// 如果是使用优化模式
if (scrollXLoad && allColumnFooterOverflow) {
if (spanMethod || footerSpanMethod) ;
else {
isOptimizeMode = true;
}
}
return isOptimizeMode;
});
const computeHeaderMenu = computed(() => {
const menuOpts = computeMenuOpts.value;
const headerOpts = menuOpts.header;
return headerOpts && headerOpts.options ? headerOpts.options : [];
});
const computeBodyMenu = computed(() => {
const menuOpts = computeMenuOpts.value;
const bodyOpts = menuOpts.body;
return bodyOpts && bodyOpts.options ? bodyOpts.options : [];
});
const computeFooterMenu = computed(() => {
const menuOpts = computeMenuOpts.value;
const footerOpts = menuOpts.footer;
return footerOpts && footerOpts.options ? footerOpts.options : [];
});
const computeIsMenu = computed(() => {
const isContentMenu = computeIsContentMenu.value;
return isContentMenu;
});
const computeIsContentMenu = computed(() => {
const menuOpts = computeMenuOpts.value;
const headerMenu = computeHeaderMenu.value;
const bodyMenu = computeBodyMenu.value;
const footerMenu = computeFooterMenu.value;
return !!(props.menuConfig && isEnableConf(menuOpts) && (headerMenu.length || bodyMenu.length || footerMenu.length));
});
const computeMenuList = computed(() => {
const { ctxMenuStore } = reactData;
const rest = [];
ctxMenuStore.list.forEach((list) => {
list.forEach((item) => {
rest.push(item);
});
});
return rest;
});
const computeExportOpts = computed(() => {
return Object.assign({}, getConfig$2().table.exportConfig, props.exportConfig);
});
const computeImportOpts = computed(() => {
return Object.assign({}, getConfig$2().table.importConfig, props.importConfig);
});
const computePrintOpts = computed(() => {
return Object.assign({}, getConfig$2().table.printConfig, props.printConfig);
});
const computeExpandOpts = computed(() => {
return Object.assign({}, getConfig$2().table.expandConfig, props.expandConfig);
});
const computeTreeOpts = computed(() => {
return Object.assign({}, getConfig$2().table.treeConfig, props.treeConfig);
});
const computeEmptyOpts = computed(() => {
return Object.assign({}, getConfig$2().table.emptyRender, props.emptyRender);
});
const computeLoadingOpts = computed(() => {
return Object.assign({}, getConfig$2().table.loadingConfig, props.loadingConfig);
});
const computeCellOffsetWidth = computed(() => {
return props.border ? Math.max(2, Math.ceil(reactData.scrollbarWidth / reactData.tableColumn.length)) : 1;
});
const computeCustomOpts = computed(() => {
return Object.assign({}, getConfig$2().table.customConfig, props.customConfig);
});
const computeCustomSimpleMode = computed(() => {
const { minHeight, height } = props;
const customOpts = computeCustomOpts.value;
const { mode, popupOptions, placement } = customOpts;
if (!placement || placement === 'top-left' || placement === 'top-right') {
if (!(mode === 'modal' || mode === 'drawer')) {
const { mode } = popupOptions || {};
if (!mode || mode === 'auto') {
if (height || minHeight) {
return 'inside';
}
return 'outside';
}
if (mode) {
return mode;
}
}
}
return '';
});
const computeTableStyle = computed(() => {
const scrollbarOpts = computeScrollbarOpts.value;
const { width, height } = scrollbarOpts;
const tStys = {};
if (width) {
tStys['--vxe-ui-table-view-scrollbar-width'] = toCssUnit(width);
}
if (height) {
tStys['--vxe-ui-table-view-scrollbar-height'] = toCssUnit(height);
}
return tStys;
});
const computeTableRowExpandedList = computed(() => {
const { tableData, rowExpandedFlag, expandColumn, rowGroupExpandedFlag, treeExpandedFlag } = reactData;
const { visibleDataRowIdData, rowExpandedMaps } = internalData;
const expandList = [];
if (tableData.length && expandColumn && rowExpandedFlag && rowGroupExpandedFlag && treeExpandedFlag) {
XEUtils.each(rowExpandedMaps, (row, rowid) => {
if (visibleDataRowIdData[rowid]) {
expandList.push(row);
}
});
}
return expandList;
});
const computeAutoWidthColumnList = computed(() => {
const { visibleColumn } = internalData;
const { tableColumn } = reactData;
return tableColumn.length || visibleColumn.length ? visibleColumn.filter(column => column.width === 'auto' || column.minWidth === 'auto') : [];
});
const computeFixedColumnSize = computed(() => {
const { tableColumn } = reactData;
const { collectColumn } = internalData;
let fixedSize = 0;
// 只判断第一层
if (tableColumn.length && collectColumn.length) {
collectColumn.forEach((column) => {
if (column.renderFixed) {
fixedSize++;
}
});
}
return fixedSize;
});
const computeIsMaxFixedColumn = computed(() => {
const fixedColumnSize = computeFixedColumnSize.value;
const columnOpts = computeColumnOpts.value;
const { maxFixedSize } = columnOpts;
if (maxFixedSize) {
return fixedColumnSize >= maxFixedSize;
}
return false;
});
const computeKeepFields = computed(() => {
const { tableFullColumn } = internalData;
const { updateColFlag } = reactData;
const editDirtyOpts = computeEditDirtyOpts.value;
const { extraFields, includeFields, excludeFields } = editDirtyOpts;
const kpFields = [];
if (updateColFlag) {
// 优先级 excludeFields > (includeFields || extraFields)
const excludeFdMaps = {};
if (excludeFields && excludeFields.length) {
excludeFields.forEach(field => {
excludeFdMaps[field] = 1;
});
}
if (includeFields && includeFields.length) {
return excludeFields && excludeFields.length ? includeFields.filter(field => !excludeFdMaps[field]) : includeFields;
}
const addFdMaps = {};
if (extraFields && extraFields.length) {
extraFields.forEach(field => {
if (!addFdMaps[field]) {
addFdMaps[field] = 1;
kpFields.push(field);
}
});
}
for (let i = 0; i < tableFullColumn.length; i++) {
const column = tableFullColumn[i];
const { field, type, editRender, cellRender } = column;
if (field && !type && (editRender || cellRender) && !addFdMaps[field] && !excludeFdMaps[field]) {
addFdMaps[field] = 1;
kpFields.push(field);
}
}
}
return kpFields;
});
const computeTableBorder = computed(() => {
const { border } = props;
if (border === true) {
return 'full';
}
if (border) {
return border;
}
return 'default';
});
const computeIsAllCheckboxDisabled = computed(() => {
const { treeConfig } = props;
const { tableData } = reactData;
const { tableFullData } = internalData;
const checkboxOpts = computeCheckboxOpts.value;
const { strict, checkMethod } = checkboxOpts;
if (strict) {
if (tableData.length || tableFullData.length) {
if (checkMethod) {
// 如果所有行都被禁用
return tableFullData.every((row) => !checkMethod({ $table: $xeTable, row }));
}
return false;
}
return true;
}
return false;
});
const computeVirtualScrollBars = computed(() => {
const { overflowX, scrollXLoad, overflowY, scrollYLoad } = reactData;
return {
x: overflowX && scrollXLoad,
y: overflowY && scrollYLoad
};
});
const computeRowGroupFields = computed(() => {
const rowGroupOpts = computeRowGroupOpts.value;
return rowGroupOpts.groupFields;
});
const computeRowGroupColumns = computed(() => {
const { rowGroupList } = reactData;
const { fullColumnFieldData } = internalData;
const rgColumns = [];
rowGroupList.forEach(aggConf => {
const colRest = fullColumnFieldData[aggConf.field];
if (colRest) {
rgColumns.push(colRest.column);
}
});
return rgColumns;
});
const computeAggFuncColumns = computed(() => {
const { rowGroupList, tableColumn } = reactData;
if (rowGroupList.length) {
return tableColumn.filter(column => column.aggFunc);
}
return [];
});
const combineTabsResizeFlag = computed(() => {
return $xeTabs ? $xeTabs.reactData.resizeFlag : null;
});
const combineModalResizeFlag = computed(() => {
return $xeModal ? $xeModal.reactData.resizeFlag : null;
});
const combineSplitterResizeFlag = computed(() => {
return $xeSplitter ? $xeSplitter.reactData.resizeFlag : null;
});
const refMaps = {
refElem,
refTooltip,
refValidTooltip,
refTableFilter,
refTableCustom,
refTableMenu,
refTableHeader,
refTableBody,
refTableFooter,
refTableLeftHeader,
refTableLeftBody,
refTableLeftFooter,
refTableRightHeader,
refTableRightBody,
refTableRightFooter,
refLeftContainer,
refRightContainer,
refColResizeBar,
refRowResizeBar,
refCustomContainerElem,
refScrollXVirtualElem,
refScrollYVirtualElem,
refScrollXHandleElem,
refScrollYHandleElem,
refScrollXSpaceElem,
refScrollYSpaceElem
};
const computeMaps = {
computeSize,
computeTableId,
computeValidOpts,
computeRowField,
computeVirtualXOpts,
computeVirtualYOpts,
computeScrollbarOpts,
computeScrollbarXOpts,
computeScrollbarYOpts,
computeScrollbarXToTop,
computeScrollbarYToLeft,
computeColumnOpts,
computeCurrentColumnOpts,
computeScrollXThreshold,
computeScrollYThreshold,
computeRowHeightMaps,
computeDefaultRowHeight,
computeCellOpts,
computeHeaderCellOpts,
computeFooterCellOpts,
computeRowOpts,
computeAggregateOpts,
computeAggregateAccuracyOpts,
computeRowGroupOpts,
computeCurrentRowOpts,
computeRowDragOpts,
computeColumnDragOpts,
computeResizeOpts,
computeResizableOpts,
computeSeqOpts,
computeRadioOpts,
computeCheckboxOpts,
computeTooltipOpts,
computeHeaderTooltipOpts,
computeFooterTooltipOpts,
computeEditOpts,
computeEditDirtyOpts,
computeSortOpts,
computeFilterOpts,
computeFloatingFilterOpts,
computeMouseOpts,
computeAreaOpts,
computeKeyboardOpts,
computeClipOpts,
computeFnrOpts,
computeHeaderMenu,
computeBodyMenu,
computeFooterMenu,
computeIsMenu,
computeIsContentMenu,
computeMenuList,
computeMenuOpts,
computeExportOpts,
computeImportOpts,
computePrintOpts,
computeExpandOpts,
computeTreeOpts,
computeEmptyOpts,
computeLoadingOpts,
computeCellOffsetWidth,
computeCustomOpts,
computeCustomSimpleMode,
computeLeftFixedWidth,
computeRightFixedWidth,
computeBodyMergeCoverFixed,
computeFixedColumnSize,
computeIsMaxFixedColumn,
computeKeepFields,
computeIsAllCheckboxDisabled,
computeIsHeaderRenderOptimize,
computeIsBodyRenderOptimize,
computeIsFooterRenderOptimize,
computeVirtualScrollBars,
computeRowGroupFields,
computeRowGroupColumns,
computeAggFuncColumns,
computeUndoRedoHistoryOpts,
computeFNROpts,
computeSXOpts,
computeSYOpts
};
const $xeTable = {
xID,
props: props,
context,
reactData,
internalData,
getRefMaps: () => refMaps,
getComputeMaps: () => computeMaps,
xeGrid: $xeGrid,
xeGantt: $xeGantt,
// 已废弃
xegrid: $xeGrid
};
const eqCellValue = (newRow, oldRow, field) => {
const val1 = XEUtils.get(newRow, field);
const val2 = XEUtils.get(oldRow, field);
let result = false;
if (eqEmptyValue(val1) && eqEmptyValue(val2)) {
result = true;
}
else if (XEUtils.isString(val1) || XEUtils.isNumber(val1)) {
result = ('' + val1) === ('' + val2);
}
else {
result = XEUtils.isEqual(val1, val2);
}
return { newValue: val1, oldValue: val2, result };
};
const handleKeyField = () => {
const keyField = computeRowField.value;
internalData.currKeyField = keyField;
internalData.isCurrDeepKey = hasDeepKey(keyField);
};
const getNextSortOrder = (column) => {
const sortOpts = computeSortOpts.value;
const { orders = [] } = sortOpts;
const currOrder = column.order || null;
const oIndex = orders.indexOf(currOrder) + 1;
return orders[oIndex < orders.length ? oIndex : 0];
};
const getCustomStorageMap = (id) => {
const version = getConfig$2().version;
const rest = XEUtils.toStringJSON(localStorage.getItem(customStorageKey) || '');
const maps = rest && rest._v === version ? rest : { _v: version };
return (id ? maps[id] : maps) || {};
};
const setCustomStorageMap = (id, data) => {
const version = getConfig$2().version;
const maps = getCustomStorageMap();
maps[id] = data || undefined;
maps._v = version;
localStorage.setItem(customStorageKey, XEUtils.toJSONString(maps));
};
const getRecoverRowMaps = (keyMaps) => {
const { fullAllDataRowIdData } = internalData;
const restKeys = {};
XEUtils.each(keyMaps, (row, rowid) => {
if (fullAllDataRowIdData[rowid]) {
restKeys[rowid] = row;
}
});
return restKeys;
};
const handleReserveRow = (reserveRowMap) => {
const { fullDataRowIdData } = internalData;
const reserveList = [];
XEUtils.each(reserveRowMap, (item, rowid) => {
if (fullDataRowIdData[rowid] && $xeTable.findRowIndexOf(reserveList, fullDataRowIdData[rowid].row) === -1) {
reserveList.push(fullDataRowIdData[rowid].row);
}
});
return reserveList;
};
const handleVirtualXVisible = () => {
const { isScrollXBig, scrollXWidth } = reactData;
const { elemStore, visibleColumn, fullColumnIdData } = internalData;
const leftFixedWidth = computeLeftFixedWidth.value;
const rightFixedWidth = computeRightFixedWidth.value;
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
if (bodyScrollElem) {
const clientWidth = bodyScrollElem.clientWidth;
let scrollLeft = bodyScrollElem.scrollLeft;
if (isScrollXBig) {
scrollLeft = Math.ceil((scrollXWidth - clientWidth) * Math.min(1, (scrollLeft / (maxXWidth - clientWidth))));
}
const startLeft = scrollLeft + leftFixedWidth;
const endLeft = scrollLeft + clientWidth - rightFixedWidth;
let leftIndex = 0;
let rightIndex = visibleColumn.length;
while (leftIndex < rightIndex) {
const cIndex = Math.floor((leftIndex + rightIndex) / 2);
const column = visibleColumn[cIndex];
const colid = column.id;
const colRest = fullColumnIdData[colid] || {};
if (colRest.oLeft <= startLeft) {
leftIndex = cIndex + 1;
}
else {
rightIndex = cIndex;
}
}
let visibleSize = 0;
const toVisibleIndex = leftIndex === visibleColumn.length ? leftIndex : Math.max(0, leftIndex < visibleColumn.length ? leftIndex - 2 : 0);
for (let cIndex = toVisibleIndex, cLen = visibleColumn.length; cIndex < cLen; cIndex++) {
const column = visibleColumn[cIndex];
const colid = column.id;
const colRest = fullColumnIdData[colid] || {};
visibleSize++;
if (colRest.oLeft > endLeft || visibleSize >= 60) {
break;
}
}
return { toVisibleIndex: Math.max(0, toVisibleIndex), visibleSize: Math.max(1, visibleSize) };
}
return { toVisibleIndex: 0, visibleSize: 6 };
};
const calcVarRowHeightConfig = (sizeKey, sizeEl) => {
const { rowHeightStore } = reactData;
if (sizeEl && sizeEl.clientHeight) {
rowHeightStore[sizeKey] = sizeEl.clientHeight;
}
};
const computeRowHeight = () => {
const { isAllOverflow } = reactData;
const tableHeader = refTableHeader.value;
const tableBody = refTableBody.value;
const tableBodyElem = tableBody ? tableBody.$el : null;
const defaultRowHeight = computeDefaultRowHeight.value;
let rowHeight = 0;
if (isAllOverflow) {
if (tableBodyElem) {
const tableHeaderElem = tableHeader ? tableHeader.$el : null;
let firstTrElem;
firstTrElem = tableBodyElem.querySelector('tr');
if (!firstTrElem && tableHeaderElem) {
firstTrElem = tableHeaderElem.querySelector('tr');
}
if (firstTrElem) {
rowHeight = firstTrElem.clientHeight;
}
}
if (!rowHeight) {
rowHeight = defaultRowHeight;
}
}
else {
rowHeight = defaultRowHeight;
}
// 最低支持 18px 行高
return Math.max(18, rowHeight);
};
const handleVirtualYVisible = () => {
const { isAllOverflow, expandColumn, isScrollYBig, scrollYHeight } = reactData;
const { elemStore, isResizeCellHeight, afterFullData, fullAllDataRowIdData } = internalData;
const rowOpts = computeRowOpts.value;
const cellOpts = computeCellOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
if (bodyScrollElem) {
const clientHeight = bodyScrollElem.clientHeight;
let scrollTop = bodyScrollElem.scrollTop;
if (isScrollYBig) {
scrollTop = Math.ceil((scrollYHeight - clientHeight) * Math.min(1, (scrollTop / (maxYHeight - clientHeight))));
}
const startTop = scrollTop;
const endTop = scrollTop + clientHeight;
let toVisibleIndex = -1;
let visibleSize = 0;
const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height;
if (!isCustomCellHeight && !expandColumn && isAllOverflow) {
toVisibleIndex = Math.floor(startTop / defaultRowHeight) - 1;
visibleSize = Math.ceil(clientHeight / defaultRowHeight) + 1;
}
else {
const { handleGetRowId } = createHandleGetRowId($xeTable);
let leftIndex = 0;
let rightIndex = afterFullData.length;
while (leftIndex < rightIndex) {
const rIndex = Math.floor((leftIndex + rightIndex) / 2);
const row = afterFullData[rIndex];
const rowid = handleGetRowId(row);
const rowRest = fullAllDataRowIdData[rowid] || {};
if (rowRest.oTop <= startTop) {
leftIndex = rIndex + 1;
}
else {
rightIndex = rIndex;
}
}
toVisibleIndex = leftIndex === afterFullData.length ? leftIndex : Math.max(0, leftIndex < afterFullData.length ? leftIndex - 2 : 0);
for (let rIndex = toVisibleIndex, rLen = afterFullData.length; rIndex < rLen; rIndex++) {
const row = afterFullData[rIndex];
const rowid = handleGetRowId(row);
const rowRest = fullAllDataRowIdData[rowid] || {};
visibleSize++;
if (rowRest.oTop > endTop || visibleSize >= 100) {
break;
}
}
}
return { toVisibleIndex: Math.max(0, toVisibleIndex), visibleSize: Math.max(6, visibleSize) };
}
return { toVisibleIndex: 0, visibleSize: 6 };
};
const calculateMergerOffsetIndex = (list, mergeMaps, offsetItem, type) => {
const mKey = `${offsetItem.startIndex}:${offsetItem.endIndex}`;
const mObj = mergeMaps[mKey];
// 缓存
if (mObj) {
offsetItem.startIndex = mObj.startIndex;
offsetItem.endIndex = mObj.endIndex;
}
else {
for (let mcIndex = 0, len = list.length; mcIndex < len; mcIndex++) {
const mergeItem = list[mcIndex];
const { startIndex, endIndex } = offsetItem;
const mergeStartIndex = mergeItem[type];
const mergeSpanNumber = mergeItem[type + 'span'];
const 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;
}
}
mergeMaps[mKey] = offsetItem;
}
};
function buildMergeData(mergeConfigs) {
const mergeMaps = {};
const mergeRowMaps = {};
const mergeColMaps = {};
if (mergeConfigs && mergeConfigs.length) {
for (let mIndex = 0; mIndex < mergeConfigs.length; mIndex++) {
const { row: _rowIndex, col: _columnIndex, rowspan: mergeRowspan, colspan: mergeColspan } = mergeConfigs[mIndex];
for (let i = 0; i < mergeRowspan; i++) {
const currRIndex = _rowIndex + i;
for (let j = 0; j < mergeColspan; j++) {
const currCIndex = _columnIndex + j;
mergeMaps[`${currRIndex}:${currCIndex}`] = !i && !j
? {
rowspan: mergeRowspan,
colspan: mergeColspan
}
: {
rowspan: 0,
colspan: 0
};
}
}
}
}
return { mergeMaps, mergeRowMaps, mergeColMaps };
}
const handleUpdateMergeBodyCells = (merges) => {
internalData.mergeBodyList = [];
internalData.mergeBodyMaps = {};
internalData.mergeBodyCellMaps = {};
internalData.mergeBodyRowMaps = {};
internalData.mergeBodyColMaps = {};
$xeTable.setMergeCells(merges);
};
const handleBodyMerge = (merges) => {
const { fullAllDataRowIdData, fullColumnIdData, visibleColumn, afterFullData, mergeBodyList, mergeBodyMaps } = internalData;
if (merges) {
const { handleGetRowId } = createHandleGetRowId($xeTable);
if (!XEUtils.isArray(merges)) {
merges = [merges];
}
merges.forEach((item) => {
let { row: margeRow, col: margeCol, rowspan, colspan } = item;
let mergeRowIndex = -1;
let mergeColumnIndex = -1;
if (XEUtils.isNumber(margeRow)) {
mergeRowIndex = margeRow;
}
else {
const rowid = margeRow ? handleGetRowId(margeRow) : null;
const rowRest = rowid ? fullAllDataRowIdData[rowid] : null;
if (rowRest) {
mergeRowIndex = rowRest._index;
}
}
if (XEUtils.isNumber(margeCol)) {
mergeColumnIndex = margeCol;
}
else {
const colid = margeCol ? margeCol.id : null;
const colRest = colid ? fullColumnIdData[colid] : null;
if (colRest) {
mergeColumnIndex = colRest._index;
}
}
if (mergeRowIndex > -1 && mergeColumnIndex > -1 && (rowspan || colspan)) {
rowspan = XEUtils.toNumber(rowspan) || 1;
colspan = XEUtils.toNumber(colspan) || 1;
if (rowspan > 1 || colspan > 1) {
const row = afterFullData[mergeRowIndex];
const column = visibleColumn[mergeColumnIndex];
let mergeItem = mergeBodyMaps[`${mergeRowIndex}:${mergeColumnIndex}`];
if (mergeItem) {
mergeItem.rowspan = rowspan;
mergeItem.colspan = colspan;
mergeItem._rowspan = rowspan;
mergeItem._colspan = colspan;
}
else {
mergeItem = {
row: mergeRowIndex,
col: mergeColumnIndex,
rowspan,
colspan,
_row: row,
_col: column,
_rowspan: rowspan,
_colspan: colspan
};
mergeBodyMaps[`${mergeRowIndex}:${mergeColumnIndex}`] = mergeItem;
mergeBodyList.push(mergeItem);
}
}
}
});
}
};
const removeBodyMerges = (merges) => {
const { mergeBodyList, fullColumnIdData, fullAllDataRowIdData, mergeBodyMaps } = internalData;
const rest = [];
if (merges) {
const { handleGetRowId } = createHandleGetRowId($xeTable);
if (!XEUtils.isArray(merges)) {
merges = [merges];
}
merges.forEach((item) => {
const { row: margeRow, col: margeCol } = item;
let mergeRowIndex = -1;
let mergeColumnIndex = -1;
if (XEUtils.isNumber(margeRow)) {
mergeRowIndex = margeRow;
}
else {
const rowid = margeRow ? handleGetRowId(margeRow) : null;
const rowRest = rowid ? fullAllDataRowIdData[rowid] : null;
if (rowRest) {
mergeRowIndex = rowRest._index;
}
}
if (XEUtils.isNumber(margeCol)) {
mergeColumnIndex = margeCol;
}
else {
const colid = margeCol ? margeCol.id : null;
const colRest = colid ? fullColumnIdData[colid] : null;
if (colRest) {
mergeColumnIndex = colRest._index;
}
}
const mcIndex = XEUtils.findIndexOf(mergeBodyList, item => item.row === mergeRowIndex && item.col === mergeColumnIndex);
if (mcIndex > -1) {
const rItems = mergeBodyList.splice(mcIndex, 1);
const item = rItems[0];
if (item) {
rest.push(rItems[0]);
if (mergeBodyMaps[`${mergeRowIndex}:${mergeColumnIndex}`]) {
delete mergeBodyMaps[`${mergeRowIndex}:${mergeColumnIndex}`];
}
}
}
});
}
return rest;
};
const handleUpdateMergeHeaderCells = (merges) => {
internalData.mergeHeaderList = [];
internalData.mergeHeaderMaps = {};
internalData.mergeHeaderCellMaps = {};
internalData.mergeHeaderRowMaps = {};
internalData.mergeBodyColMaps = {};
$xeTable.setMergeHeaderCells(merges);
};
const handleHeaderMerge = (merges) => {
const { showCustomHeader } = props;
const { footerTableData } = reactData;
const { mergeHeaderList, mergeHeaderMaps, fullColumnIdData } = internalData;
if (merges) {
const { visibleColumn } = internalData;
if (!XEUtils.isArray(merges)) {
merges = [merges];
}
merges.forEach((item) => {
let { row: margeRow, col: margeCol, rowspan, colspan } = item;
const mergeRowIndex = XEUtils.isNumber(margeRow) ? margeRow : -1;
let mergeColumnIndex = -1;
if (XEUtils.isNumber(margeCol)) {
mergeColumnIndex = margeCol;
}
else {
const colid = margeCol ? margeCol.id : null;
const colRest = colid ? fullColumnIdData[colid] : null;
if (colRest) {
mergeColumnIndex = colRest._index;
}
}
if (mergeRowIndex > -1 && mergeColumnIndex > -1 && (rowspan || colspan)) {
rowspan = XEUtils.toNumber(rowspan) || 1;
colspan = XEUtils.toNumber(colspan) || 1;
if (!showCustomHeader && rowspan > 1) {
errLog$2('vxe.error.notSupportProp', ['[table] show-custom-header=false', `rowspan=${rowspan}`, 'rowspan=1']);
return;
}
if (rowspan > 1 || colspan > 1) {
const row = footerTableData[mergeRowIndex];
const column = visibleColumn[mergeColumnIndex];
let mergeItem = mergeHeaderMaps[`${mergeRowIndex}:${mergeColumnIndex}`];
if (mergeItem) {
mergeItem.rowspan = rowspan;
mergeItem.colspan = colspan;
mergeItem._rowspan = rowspan;
mergeItem._colspan = colspan;
}
else {
mergeItem = {
row: mergeRowIndex,
col: mergeColumnIndex,
rowspan,
colspan,
_row: row,
_col: column,
_rowspan: rowspan,
_colspan: colspan
};
mergeHeaderMaps[`${mergeRowIndex}:${mergeColumnIndex}`] = mergeItem;
mergeHeaderList.push(mergeItem);
}
}
}
});
}
};
const removeHeaderMerges = (merges) => {
const { mergeHeaderList, fullColumnIdData, mergeHeaderMaps } = internalData;
const rest = [];
if (merges) {
if (!XEUtils.isArray(merges)) {
merges = [merges];
}
merges.forEach((item) => {
const { row: margeRow, col: margeCol } = item;
const mergeRowIndex = XEUtils.isNumber(margeRow) ? margeRow : -1;
let mergeColumnIndex = -1;
if (XEUtils.isNumber(margeCol)) {
mergeColumnIndex = margeCol;
}
else {
const colid = margeCol ? margeCol.id : null;
const colRest = colid ? fullColumnIdData[colid] : null;
if (colRest) {
mergeColumnIndex = colRest._index;
}
}
const mcIndex = XEUtils.findIndexOf(mergeHeaderList, item => item.row === mergeRowIndex && item.col === mergeColumnIndex);
if (mcIndex > -1) {
const rItems = mergeHeaderList.splice(mcIndex, 1);
const item = rItems[0];
if (item) {
rest.push(item);
if (mergeHeaderMaps[`${mergeRowIndex}:${mergeColumnIndex}`]) {
delete mergeHeaderMaps[`${mergeRowIndex}:${mergeColumnIndex}`];
}
}
}
});
}
return rest;
};
const handleUpdateMergeFooterCells = (merges) => {
internalData.mergeFooterList = [];
internalData.mergeFooterMaps = {};
internalData.mergeFooterCellMaps = {};
internalData.mergeFooterRowMaps = {};
internalData.mergeFooterColMaps = {};
$xeTable.setMergeFooterCells(merges);
};
const handleFooterMerge = (merges) => {
const { footerTableData } = reactData;
const { mergeFooterList, mergeFooterMaps, fullColumnIdData } = internalData;
if (merges) {
const { visibleColumn } = internalData;
if (!XEUtils.isArray(merges)) {
merges = [merges];
}
merges.forEach((item) => {
let { row: margeRow, col: margeCol, rowspan, colspan } = item;
const mergeRowIndex = XEUtils.isNumber(margeRow) ? margeRow : -1;
let mergeColumnIndex = -1;
if (XEUtils.isNumber(margeCol)) {
mergeColumnIndex = margeCol;
}
else {
const colid = margeCol ? margeCol.id : null;
const colRest = colid ? fullColumnIdData[colid] : null;
if (colRest) {
mergeColumnIndex = colRest._index;
}
}
if (mergeRowIndex > -1 && mergeColumnIndex > -1 && (rowspan || colspan)) {
rowspan = XEUtils.toNumber(rowspan) || 1;
colspan = XEUtils.toNumber(colspan) || 1;
if (rowspan > 1 || colspan > 1) {
const row = footerTableData[mergeRowIndex];
const column = visibleColumn[mergeColumnIndex];
let mergeItem = mergeFooterMaps[`${mergeRowIndex}:${mergeColumnIndex}`];
if (mergeItem) {
mergeItem.rowspan = rowspan;
mergeItem.colspan = colspan;
mergeItem._rowspan = rowspan;
mergeItem._colspan = colspan;
}
else {
mergeItem = {
row: mergeRowIndex,
col: mergeColumnIndex,
rowspan,
colspan,
_row: row,
_col: column,
_rowspan: rowspan,
_colspan: colspan
};
mergeFooterMaps[`${mergeRowIndex}:${mergeColumnIndex}`] = mergeItem;
mergeFooterList.push(mergeItem);
}
}
}
});
}
};
const removeFooterMerges = (merges) => {
const { mergeFooterList, fullColumnIdData, mergeFooterMaps } = internalData;
const rest = [];
if (merges) {
if (!XEUtils.isArray(merges)) {
merges = [merges];
}
merges.forEach((item) => {
const { row: margeRow, col: margeCol } = item;
const mergeRowIndex = XEUtils.isNumber(margeRow) ? margeRow : -1;
let mergeColumnIndex = -1;
if (XEUtils.isNumber(margeCol)) {
mergeColumnIndex = margeCol;
}
else {
const colid = margeCol ? margeCol.id : null;
const colRest = colid ? fullColumnIdData[colid] : null;
if (colRest) {
mergeColumnIndex = colRest._index;
}
}
const mcIndex = XEUtils.findIndexOf(mergeFooterList, item => item.row === mergeRowIndex && item.col === mergeColumnIndex);
if (mcIndex > -1) {
const rItems = mergeFooterList.splice(mcIndex, 1);
const item = rItems[0];
if (item) {
rest.push(item);
if (mergeFooterMaps[`${mergeRowIndex}:${mergeColumnIndex}`]) {
delete mergeFooterMaps[`${mergeRowIndex}:${mergeColumnIndex}`];
}
}
}
});
}
return rest;
};
const handleSortEvent = (evnt, sortConfs, isUpdate) => {
const { tableFullColumn } = internalData;
const sortOpts = computeSortOpts.value;
const { multiple, remote, orders } = sortOpts;
if (!XEUtils.isArray(sortConfs)) {
sortConfs = [sortConfs];
}
if (sortConfs && sortConfs.length) {
const orderActiveMaps = {};
if (!multiple) {
sortConfs = [sortConfs[0]];
tableFullColumn.forEach((column) => {
if (column.order) {
orderActiveMaps[column.id] = column;
}
});
}
const sortColMpps = {};
let firstColumn = null;
sortConfs.forEach((confs, index) => {
let { field, order } = confs;
let column = field;
if (XEUtils.isString(field)) {
column = $xeTable.getColumnByField(field);
}
if (!firstColumn) {
firstColumn = column;
}
if (column && column.sortable) {
if (orders && orders.indexOf(order) === -1) {
order = getNextSortOrder(column);
}
if (column.order !== order) {
column.order = order;
}
column.sortTime = Date.now() + index;
sortColMpps[column.id] = column;
}
});
if (!multiple) {
XEUtils.each(orderActiveMaps, (oaCol, oaId) => {
if (!sortColMpps[oaId]) {
oaCol.order = null;
}
});
}
if (isUpdate) {
if (!remote) {
$xeTable.handleTableData(true);
}
}
if (evnt) {
$xeTable.handleColumnSortEvent(evnt, firstColumn);
}
return nextTick().then(() => {
updateRowOffsetTop();
$xeTable.updateCellAreas();
return updateStyle();
});
}
return nextTick();
};
const clearAllSort = () => {
const { tableFullColumn } = internalData;
tableFullColumn.forEach((column) => {
column.order = null;
});
};
const calcTableHeight = (key) => {
const { editConfig, editRules } = props;
const { parentHeight, tableColumn } = reactData;
let val = props[key];
if (key === 'minHeight') {
const defMinHeight = getConfig$2().table.minHeight;
if (XEUtils.eqNull(val)) {
if (eqEmptyValue(defMinHeight)) {
if (!tableColumn.length) {
// 如果全部列被隐藏
val = 40;
}
else if (editRules && isEnableConf(editConfig)) {
// 编辑模式默认最小高度
val = 144;
}
}
else {
val = defMinHeight;
}
}
}
let num = 0;
if (val) {
if (val === '100%' || val === 'auto') {
num = parentHeight;
}
else {
const 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;
};
const handleCustomRestore = (storeData) => {
const { aggregateConfig, rowGroupConfig } = props;
const { collectColumn } = internalData;
const { isCustomAlign, isCustomHeaderAlign, isCustomFooterAlign, isCustomResizable, isCustomVisible, isCustomFixed, isCustomSort, isCustomAggGroup, isCustomAggFunc, isCustomPager } = handleCustomStoreConfig($xeTable);
let { alignData, headerAlignData, footerAlignData, resizableData, sortData, visibleData, fixedData, aggGroupData, aggFuncData, pagerData } = storeData;
// 处理还原
if ((isCustomAlign && alignData) ||
(isCustomHeaderAlign && headerAlignData) ||
(isCustomFooterAlign && footerAlignData) ||
(isCustomResizable && resizableData) ||
(isCustomSort && sortData) ||
(isCustomVisible && visibleData) ||
(isCustomFixed && fixedData) ||
(isCustomAggGroup && aggGroupData) ||
(isCustomAggFunc && aggFuncData) ||
(isCustomPager && pagerData && $xeGGWrapper)) {
const sortColMaps = {};
if (isCustomSort && sortData) {
// 转换兼容老版本数据,即将废弃兼容
if (!XEUtils.isArray(sortData)) {
const sortRests = [];
XEUtils.each(sortData, (index, colKey) => {
sortRests.push({ key: colKey, index });
});
sortData = XEUtils.orderBy(sortRests, { field: 'index', order: 'asc' }).map(item => ({ k: item.key }));
}
let colNum = 1;
XEUtils.eachTree(sortData, (sObj, index, sOjs, path, pSObj) => {
sortColMaps[sObj.k] = {
key: sObj.k,
sNum: colNum++,
pKey: pSObj ? pSObj.k : null
};
}, { children: 'c' });
}
const colKeyMaps = {};
const allCols = [];
const aggGroupConfs = [];
XEUtils.eachTree(collectColumn, (column, index, items, path, parentColumn) => {
const colKey = column.getKey();
// 支持一级
if (!parentColumn) {
if (isCustomFixed && fixedData && fixedData[colKey] !== undefined) {
column.fixed = fixedData[colKey];
}
}
if (isCustomResizable && resizableData && XEUtils.isNumber(resizableData[colKey])) {
column.resizeWidth = resizableData[colKey];
}
if (isCustomVisible && visibleData && XEUtils.isBoolean(visibleData[colKey])) {
column.visible = visibleData[colKey];
}
if (isCustomAggFunc && aggFuncData && (aggregateConfig || rowGroupConfig) && aggFuncData[colKey]) {
column.aggFunc = aggFuncData[colKey];
}
if (isCustomAggGroup && aggGroupData && aggGroupData[colKey]) {
aggGroupConfs.push({ field: column.field });
}
colKeyMaps[colKey] = column;
allCols.push(column);
});
if ((aggregateConfig || rowGroupConfig) && aggGroupConfs.length) {
const groupRest = handleGroupData(internalData.tableFullData, aggGroupConfs);
internalData.tableFullTreeData = [];
internalData.tableFullGroupData = groupRest.treeData;
reactData.isRowGroupStatus = true;
reactData.rowGroupList = aggGroupConfs;
$xeTable.cacheRowMap(false);
}
// 如果自定义了顺序
if (isCustomSort && sortData) {
allCols.forEach(column => {
const colKey = column.getKey();
const scItem = sortColMaps[colKey];
if (scItem) {
const parentColumn = scItem.pKey ? colKeyMaps[scItem.pKey] : null;
column.parentId = parentColumn ? parentColumn.id : null;
column.renderSortNumber = scItem.sNum;
}
});
const newCollectCols = XEUtils.toArrayTree(XEUtils.orderBy(allCols, 'renderSortNumber'), { key: 'id', parentKey: 'parentId', children: 'children' });
internalData.collectColumn = newCollectCols;
internalData.tableFullColumn = getColumnList(newCollectCols);
reactData.updateColFlag++;
}
reactData.isCustomStatus = true;
}
else {
reactData.isCustomStatus = false;
}
};
/**
* 还原自定义列操作状态
*/
const restoreCustomStorage = () => {
const { customConfig } = props;
const tableId = computeTableId.value;
const customOpts = computeCustomOpts.value;
const { storage, restoreStore } = customOpts;
const { isCustomAlign, isCustomHeaderAlign, isCustomFooterAlign, isCustomResizable, isCustomVisible, isCustomFixed, isCustomSort, isCustomAggGroup, isCustomAggFunc } = handleCustomStoreConfig($xeTable);
if (storage &&
(customConfig ? isEnableConf(customOpts) : customOpts.enabled) &&
(isCustomAlign ||
isCustomHeaderAlign ||
isCustomFooterAlign ||
isCustomResizable ||
isCustomVisible ||
isCustomFixed ||
isCustomSort ||
isCustomAggGroup ||
isCustomAggFunc)) {
if (!tableId) {
errLog$2('vxe.error.reqProp', ['id']);
return;
}
const storeData = getCustomStorageMap(tableId);
if (restoreStore) {
return Promise.resolve(restoreStore({ $table: $xeTable, id: tableId, type: 'restore', storeData })).then(storeData => {
if (!storeData) {
return;
}
return handleCustomRestore(storeData);
}).catch(e => e);
}
else {
return handleCustomRestore(storeData);
}
}
};
const updateColumnAllOverflow = () => {
const { showOverflow } = props;
const { isGroup } = reactData;
const { fullAllDataRowIdData, tableFullColumn, collectColumn } = internalData;
let isAllOverflow = !!showOverflow;
const handleFunc = (column) => {
if (isAllOverflow && column.showOverflow === false) {
isAllOverflow = false;
}
};
if (isGroup) {
XEUtils.eachTree(collectColumn, handleFunc);
}
else {
tableFullColumn.forEach(handleFunc);
}
XEUtils.each(fullAllDataRowIdData, (rowRest) => {
rowRest.height = 0;
});
reactData.isAllOverflow = isAllOverflow;
};
/**
* 更新数据列的 Map
* 牺牲数据组装的耗时,用来换取使用过程中的流畅
*/
const cacheColumnMap = () => {
const { treeConfig, showOverflow } = props;
const { tableFullColumn, collectColumn } = internalData;
const fullColIdData = internalData.fullColumnIdData = {};
const fullColFieldData = internalData.fullColumnFieldData = {};
const mouseOpts = computeMouseOpts.value;
const expandOpts = computeExpandOpts.value;
const columnOpts = computeColumnOpts.value;
const columnDragOpts = computeColumnDragOpts.value;
const virtualYOpts = computeVirtualYOpts.value;
const { isCrossDrag, isSelfToChildDrag } = columnDragOpts;
const customOpts = computeCustomOpts.value;
const treeOpts = computeTreeOpts.value;
const { storage } = customOpts;
const rowOpts = computeRowOpts.value;
const isGroup = collectColumn.some(hasChildrenList);
let isAllOverflow = !!showOverflow;
let rowGroupColumn;
let expandColumn;
let treeNodeColumn;
let checkboxColumn;
let radioColumn;
let htmlColumn;
const handleFunc = (column, index, items, path, parentColumn) => {
const { id: colid, field, fixed, type, treeNode, rowGroupNode } = column;
const rest = { $index: -1, _index: -1, column, colid, index, items, parent: parentColumn || null, width: 0, oLeft: 0 };
if (field) {
if (fullColFieldData[field]) {
errLog$2('vxe.error.colRepet', ['field', field]);
}
fullColFieldData[field] = rest;
}
else {
if (storage && !type) {
errLog$2('vxe.error.reqSupportProp', ['storage', `[${type ? `type=${type}` : `title=${column.getTitle()}`}]field=?`]);
}
if (columnOpts.drag && (isCrossDrag || isSelfToChildDrag)) {
errLog$2('vxe.error.reqSupportProp', ['column-drag-config.isCrossDrag | column-drag-config.isSelfToChildDrag', `${column.getTitle() || type || ''} -> field=?`]);
}
}
if (!htmlColumn && type === 'html') {
htmlColumn = column;
}
if (treeNode) {
if (treeNodeColumn) {
warnLog$2('vxe.error.colRepet', ['tree-node', treeNode]);
}
if (!treeNodeColumn) {
treeNodeColumn = column;
}
}
if (rowGroupNode) {
if (treeNodeColumn) {
warnLog$2('vxe.error.colRepet', ['row-group-node', rowGroupNode]);
}
if (!rowGroupColumn) {
rowGroupColumn = column;
}
}
if (type === 'expand') {
if (expandColumn) {
warnLog$2('vxe.error.colRepet', ['type', type]);
}
if (!expandColumn) {
expandColumn = column;
}
}
if (type === 'checkbox') {
if (checkboxColumn) {
warnLog$2('vxe.error.colRepet', ['type', type]);
}
if (!checkboxColumn) {
checkboxColumn = column;
}
}
else if (type === 'radio') {
if (radioColumn) {
warnLog$2('vxe.error.colRepet', ['type', type]);
}
if (!radioColumn) {
radioColumn = column;
}
}
if (isAllOverflow && column.showOverflow === false) {
isAllOverflow = false;
}
if (fullColIdData[colid]) {
errLog$2('vxe.error.colRepet', ['colId', colid]);
}
fullColIdData[colid] = rest;
};
if (isGroup) {
XEUtils.eachTree(collectColumn, (column, index, items, path, parentColumn, nodes) => {
column.level = nodes.length;
handleFunc(column, index, items, path, parentColumn);
});
}
else {
tableFullColumn.forEach(handleFunc);
}
if (expandColumn) {
if (expandOpts.mode !== 'fixed' && virtualYOpts.enabled) {
warnLog$2('vxe.error.notConflictProp', ['column.type="expand', 'virtual-y-config.enabled=false']);
}
if ((expandOpts.mode !== 'fixed') && mouseOpts.area) {
errLog$2('vxe.error.errConflicts', ['mouse-config.area', 'column.type=expand']);
}
if (expandOpts.mode !== 'inside' && (treeConfig && !treeOpts.transform)) {
errLog$2('vxe.error.notConflictProp', ['tree-config.transform=false', 'expand-config.mode=inside']);
}
// if (props.spanMethod) {
// warnLog('vxe.error.notSupportProp', ['column.type=expand', 'span-method', 'span-method=null'])
// }
}
if (htmlColumn) {
if (!columnOpts.useKey) {
errLog$2('vxe.error.notSupportProp', ['column.type=html', 'column-config.useKey=false', 'column-config.useKey=true']);
}
if (!rowOpts.useKey) {
errLog$2('vxe.error.notSupportProp', ['column.type=html', 'row-config.useKey=false', 'row-config.useKey=true']);
}
}
reactData.isGroup = isGroup;
reactData.rowGroupColumn = rowGroupColumn;
reactData.treeNodeColumn = treeNodeColumn;
reactData.expandColumn = expandColumn;
reactData.checkboxColumn = checkboxColumn;
reactData.radioColumn = radioColumn;
reactData.isAllOverflow = isAllOverflow;
};
const updateHeight = () => {
internalData.customHeight = calcTableHeight('height');
internalData.customMinHeight = calcTableHeight('minHeight');
internalData.customMaxHeight = calcTableHeight('maxHeight');
// 如果启用虚拟滚动,纠正高度
if (reactData.scrollYLoad && !(internalData.customHeight || internalData.customMinHeight || internalData.customMaxHeight)) {
internalData.customHeight = 300;
}
};
/**
* 计算自适应列宽
*/
const calcColumnAutoWidth = (column, wrapperEl) => {
const { scrollYLoad } = reactData;
const columnOpts = computeColumnOpts.value;
const { autoOptions } = columnOpts;
const { isCalcHeader, isCalcBody, isCalcFooter } = autoOptions || {};
const querySelections = [];
if (isCalcHeader) {
querySelections.push(`.vxe-header-cell--wrapper[colid="${column.id}"]`);
}
if (isCalcBody) {
querySelections.push(`.vxe-body-cell--wrapper[colid="${column.id}"]`);
}
if (isCalcFooter) {
querySelections.push(`.vxe-footer-cell--wrapper[colid="${column.id}"]`);
}
const cellElemList = querySelections.length ? wrapperEl.querySelectorAll(querySelections.join(',')) : [];
let leftRightPadding = 0;
const firstCellEl = cellElemList[0];
if (firstCellEl && firstCellEl.parentElement) {
const cellStyle = getComputedStyle(firstCellEl.parentElement);
leftRightPadding = Math.ceil(XEUtils.toNumber(cellStyle.paddingLeft) + XEUtils.toNumber(cellStyle.paddingRight));
}
let colWidth = (scrollYLoad ? column.renderAutoWidth : 0) - leftRightPadding;
for (let i = 0; i < cellElemList.length; i++) {
const celEl = cellElemList[i];
colWidth = Math.max(colWidth, celEl ? Math.ceil(celEl.scrollWidth) + 4 : 0);
}
return colWidth + leftRightPadding;
};
/**
* 自适应列宽
*/
const calcCellWidth = () => {
const autoWidthColumnList = computeAutoWidthColumnList.value;
const { fullColumnIdData } = internalData;
const el = refElem.value;
if (el && autoWidthColumnList.length) {
el.setAttribute('data-calc-col', 'Y');
autoWidthColumnList.forEach(column => {
const colid = column.id;
const colRest = fullColumnIdData[colid];
const colWidth = calcColumnAutoWidth(column, el);
if (colRest) {
colRest.width = Math.max(colWidth, colRest.width);
}
column.renderAutoWidth = colWidth;
});
$xeTable.analyColumnWidth();
el.removeAttribute('data-calc-col');
}
};
/**
* 列宽算法,计算单元格列宽,动态分配可用剩余空间
* 支持 px、%、固定 混合分配
* 支持动态列表调整分配
* 支持自动分配偏移量
* 支持 width=60 width=60px width=10% min-width=60 min-width=60px min-width=10%
*/
const autoCellWidth = () => {
const { elemStore } = internalData;
const bodyWrapperElem = getRefElem(elemStore['main-body-wrapper']);
if (!bodyWrapperElem) {
return;
}
const yHandleEl = refScrollYHandleElem.value;
if (!yHandleEl) {
return;
}
const xHandleEl = refScrollXHandleElem.value;
if (!xHandleEl) {
return;
}
const columnOpts = computeColumnOpts.value;
let tWidth = 0;
const minCellWidth = 40; // 列宽最少限制 40px
const bodyWidth = bodyWrapperElem.clientWidth;
let remainWidth = bodyWidth;
let meanWidth = remainWidth / 100;
const { fit } = props;
const { columnStore } = reactData;
const { resizeList, pxMinList, autoMinList, pxList, scaleList, scaleMinList, autoList, remainList } = columnStore;
const parseColumnMaxWidth = (column) => {
const maxWidth = column.maxWidth || columnOpts.maxWidth;
if (maxWidth && maxWidth !== 'auto') {
if (isScale(maxWidth)) {
return Math.floor(XEUtils.toInteger(maxWidth) * meanWidth);
}
return XEUtils.toInteger(maxWidth);
}
return 0;
};
// 最小宽
pxMinList.forEach((column) => {
let miWidth = XEUtils.toInteger(column.minWidth);
const mxWidth = parseColumnMaxWidth(column);
if (mxWidth) {
miWidth = Math.min(miWidth, mxWidth);
}
tWidth += miWidth;
column.renderWidth = miWidth;
});
// 最小自适应
autoMinList.forEach((column) => {
let caWidth = Math.max(60, XEUtils.toInteger(column.renderAutoWidth));
const mxWidth = parseColumnMaxWidth(column);
if (mxWidth) {
caWidth = Math.min(caWidth, mxWidth);
}
tWidth += caWidth;
column.renderWidth = caWidth;
});
// 最小百分比
scaleMinList.forEach((column) => {
let smWidth = Math.floor(XEUtils.toInteger(column.minWidth) * meanWidth);
const mxWidth = parseColumnMaxWidth(column);
if (mxWidth) {
smWidth = Math.min(smWidth, mxWidth);
}
tWidth += smWidth;
column.renderWidth = smWidth;
});
// 固定百分比
scaleList.forEach((column) => {
let sfWidth = Math.floor(XEUtils.toInteger(column.width) * meanWidth);
const mxWidth = parseColumnMaxWidth(column);
if (mxWidth) {
sfWidth = Math.min(sfWidth, mxWidth);
}
tWidth += sfWidth;
column.renderWidth = sfWidth;
});
// 固定宽
pxList.forEach((column) => {
let pWidth = XEUtils.toInteger(column.width);
const mxWidth = parseColumnMaxWidth(column);
if (mxWidth) {
pWidth = Math.min(pWidth, mxWidth);
}
tWidth += pWidth;
column.renderWidth = pWidth;
});
// 自适应宽
autoList.forEach((column) => {
let aWidth = Math.max(60, XEUtils.toInteger(column.renderAutoWidth));
const mxWidth = parseColumnMaxWidth(column);
if (mxWidth) {
aWidth = Math.min(aWidth, mxWidth);
}
tWidth += aWidth;
column.renderWidth = aWidth;
});
// 调整了列宽
resizeList.forEach((column) => {
const reWidth = XEUtils.toInteger(column.resizeWidth);
tWidth += reWidth;
column.renderWidth = reWidth;
});
const zoomColumnList = scaleMinList.concat(pxMinList).concat(autoMinList).filter(column => !parseColumnMaxWidth(column));
remainWidth -= tWidth;
meanWidth = remainWidth > 0 ? Math.floor(remainWidth / (zoomColumnList.length + remainList.length)) : 0;
if (fit) {
if (remainWidth > 0) {
zoomColumnList.forEach((column) => {
tWidth += meanWidth;
column.renderWidth += meanWidth;
});
}
}
else {
meanWidth = minCellWidth;
}
// 剩余均分
remainList.forEach((column) => {
const width = Math.max(meanWidth, minCellWidth);
column.renderWidth = width;
tWidth += width;
});
if (fit) {
/**
* 偏移量算法
* 如果所有列足够放的情况下,从最后动态列开始分配
* 排除已设置 max-width
*/
const dynamicList = scaleList.concat(scaleMinList).concat(pxMinList).concat(autoMinList).concat(remainList).filter(column => !parseColumnMaxWidth(column));
let dynamicSize = dynamicList.length - 1;
if (dynamicSize > 0) {
let i = bodyWidth - tWidth;
if (i > 0) {
while (i > 0 && dynamicSize >= 0) {
i--;
dynamicList[dynamicSize--].renderWidth++;
}
tWidth = bodyWidth;
}
}
}
reactData.scrollXWidth = tWidth;
reactData.resizeWidthFlag++;
updateColumnOffsetLeft();
updateHeight();
};
/**
* 计算自适应行高
*/
const calcCellAutoHeight = (rowid, rowRest, wrapperEl) => {
const { fullCellHeightMaps } = internalData;
let chRest = fullCellHeightMaps[rowid];
if (!chRest) {
chRest = {};
fullCellHeightMaps[rowid] = chRest;
}
const wrapperElemList = wrapperEl.querySelectorAll(`.vxe-cell--wrapper[rowid="${rowRest.rowid}"]`);
let firstCellStyle = null;
let topBottomPadding = 0;
let changeCH = false;
for (let i = 0; i < wrapperElemList.length; i++) {
const wrapperElem = wrapperElemList[i];
const cellElem = wrapperElem.parentElement;
const cellStyle = cellElem.style;
const orHeight = cellStyle.height;
const colid = wrapperElem.getAttribute('colid') || '';
cellStyle.height = '';
if (!firstCellStyle) {
firstCellStyle = getComputedStyle(cellElem);
topBottomPadding = firstCellStyle ? Math.ceil(XEUtils.toNumber(firstCellStyle.paddingTop) + XEUtils.toNumber(firstCellStyle.paddingBottom)) : 0;
}
const cellHeight = wrapperElem ? wrapperElem.clientHeight : 0;
const colHeight = Math.ceil(cellHeight + topBottomPadding);
if (chRest[colid] !== colHeight) {
changeCH = true;
chRest[colid] = colHeight;
}
cellStyle.height = orHeight;
}
const cellMaxHeight = getRowMaxHeight(chRest, changeCH);
return cellMaxHeight;
};
/**
* 自适应行高
*/
const calcCellHeight = () => {
const { treeConfig } = props;
const { tableData, isAllOverflow, scrollYLoad, scrollXLoad } = reactData;
const { fullAllDataRowIdData } = internalData;
const el = refElem.value;
if (!el || !el.clientWidth) {
return;
}
const treeOpts = computeTreeOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
if (!isAllOverflow && (scrollYLoad || scrollXLoad || (treeConfig && treeOpts.showLine))) {
const { handleGetRowId } = createHandleGetRowId($xeTable);
el.setAttribute('data-calc-row', 'Y');
tableData.forEach(row => {
const rowid = handleGetRowId(row);
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
const reHeight = calcCellAutoHeight(rowid, rowRest, el);
rowRest.height = Math.max(defaultRowHeight, reHeight);
}
el.removeAttribute('data-calc-row');
});
reactData.calcCellHeightFlag++;
}
};
const getOrderField = (column) => {
const { isRowGroupStatus } = reactData;
const { sortBy, sortType, aggFunc } = column;
return isRowGroupStatus && aggFunc
? (row) => {
if (row.isAggregate) {
const aggData = row.aggData;
const currAggData = aggData ? aggData[column.field] : null;
return currAggData ? currAggData.value : null;
}
let cellValue;
if (sortBy) {
cellValue = XEUtils.isFunction(sortBy) ? sortBy({ row, column }) : XEUtils.get(row, sortBy);
}
else {
cellValue = $xeTable.getCellLabel(row, column);
}
if (!sortType || sortType === 'auto') {
return eqEmptyValue(cellValue) || isNaN(cellValue) ? cellValue : XEUtils.toNumber(cellValue);
}
else if (sortType === 'number') {
return XEUtils.toNumber(cellValue);
}
else if (sortType === 'string') {
return XEUtils.toValueString(cellValue);
}
return cellValue;
}
: (row) => {
let cellValue;
if (sortBy) {
cellValue = XEUtils.isFunction(sortBy) ? sortBy({ row, column }) : XEUtils.get(row, sortBy);
}
else {
cellValue = $xeTable.getCellLabel(row, column);
}
if (!sortType || sortType === 'auto') {
return eqEmptyValue(cellValue) || isNaN(cellValue) ? cellValue : XEUtils.toNumber(cellValue);
}
else if (sortType === 'number') {
return XEUtils.toNumber(cellValue);
}
else if (sortType === 'string') {
return XEUtils.toValueString(cellValue);
}
return cellValue;
};
};
const updateAfterTreeIndex = () => {
const { fullDataRowIdData, fullAllDataRowIdData, afterFullData, afterTreeFullData } = internalData;
const treeOpts = computeTreeOpts.value;
const { transform, mapChildrenField } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
const fullMaps = {};
let rowNum = 0;
const { handleGetRowId } = createHandleGetRowId($xeTable);
XEUtils.eachTree(afterTreeFullData, (row, index, items, path, parentRow) => {
const rowid = handleGetRowId(row);
const rowRest = fullAllDataRowIdData[rowid];
const seq = path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('');
if (rowRest) {
rowRest.seq = seq;
rowRest._seq = rowNum;
rowRest.treeIndex = index;
rowRest._index = rowNum;
rowRest._tIndex = rowNum;
}
else {
const rest = { row, rowid, _seq: rowNum, seq, index, $index: -1, _index: rowNum, treeIndex: index, _tIndex: rowNum, items, parent: parentRow, level: 0, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 };
fullAllDataRowIdData[rowid] = rest;
fullDataRowIdData[rowid] = rest;
}
rowNum++;
fullMaps[rowid] = row;
}, { children: transform ? mapChildrenField : childrenField });
if (transform) {
afterFullData.forEach((row, index) => {
const rowid = handleGetRowId(row);
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
rowRest._index = index;
}
});
}
internalData.afterFullRowMaps = fullMaps;
};
const updateAfterListIndex = () => {
const { afterFullData, fullDataRowIdData, fullAllDataRowIdData } = internalData;
const { handleGetRowId } = createHandleGetRowId($xeTable);
const fullMaps = {};
let rowNum = 0;
afterFullData.forEach((row, index) => {
const rowid = handleGetRowId(row);
const rowRest = fullAllDataRowIdData[rowid];
const seq = index + 1;
if (rowRest) {
rowRest.seq = seq;
rowRest._seq = rowNum;
rowRest._index = index;
}
else {
const rest = { row, rowid, _seq: rowNum, seq, index: -1, $index: -1, _index: index, treeIndex: -1, _tIndex: -1, items: [], parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 };
fullAllDataRowIdData[rowid] = rest;
fullDataRowIdData[rowid] = rest;
}
rowNum++;
fullMaps[rowid] = row;
});
internalData.afterFullRowMaps = fullMaps;
};
/**
* 预编译
* 对渲染中的数据提前解析序号及索引。牺牲提前编译耗时换取渲染中额外损耗,使运行时更加流畅
*/
const updateAfterDataIndex = () => {
const { treeConfig } = props;
if (treeConfig) {
updateAfterTreeIndex();
}
else {
updateAfterListIndex();
}
};
/**
* 如果为虚拟树、行分组、则将树结构拍平
* @returns
*/
const handleVirtualTreeToList = () => {
const { treeConfig } = props;
const { isRowGroupStatus } = reactData;
const { fullAllDataRowIdData, treeExpandedMaps, rowGroupExpandedMaps } = internalData;
const aggregateOpts = computeAggregateOpts.value;
const treeOpts = computeTreeOpts.value;
const { handleGetRowId } = createHandleGetRowId($xeTable);
const fullData = [];
const expandMaps = {};
if (treeConfig && treeOpts.transform) {
const childrenField = treeOpts.children || treeOpts.childrenField;
XEUtils.eachTree(internalData.afterTreeFullData, (row, index, items, path, parentRow) => {
const rowid = handleGetRowId(row);
const parentRowid = handleGetRowId(parentRow);
if (!parentRow || (expandMaps[parentRowid] && treeExpandedMaps[parentRowid])) {
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
rowRest._index = fullData.length;
}
expandMaps[rowid] = 1;
fullData.push(row);
}
}, { children: childrenField });
internalData.afterFullData = fullData;
updateScrollYStatus(fullData);
return fullData;
}
else if (isRowGroupStatus) {
const { childrenField } = aggregateOpts;
XEUtils.eachTree(internalData.afterGroupFullData, (row, index, items, path, parentRow) => {
const rowid = handleGetRowId(row);
const parentRowid = handleGetRowId(parentRow);
if (!parentRow || (expandMaps[parentRowid] && rowGroupExpandedMaps[parentRowid])) {
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
rowRest._index = fullData.length;
}
expandMaps[rowid] = 1;
fullData.push(row);
}
}, { children: childrenField });
internalData.afterFullData = fullData;
updateScrollYStatus(fullData);
return fullData;
}
return internalData.afterFullData;
};
/**
* 编译处理后全量的表格数据
* 如果存在筛选条件,继续处理
*/
const updateAfterFullData = () => {
const { treeConfig } = props;
const { isRowGroupStatus } = reactData;
const { tableFullColumn, tableFullData, tableFullTreeData, tableFullGroupData } = internalData;
const filterOpts = computeFilterOpts.value;
const sortOpts = computeSortOpts.value;
const aggregateOpts = computeAggregateOpts.value;
const treeOpts = computeTreeOpts.value;
const childrenField = treeOpts.children || treeOpts.childrenField;
const { transform, rowField, parentField, mapChildrenField } = treeOpts;
const { isEvery, remote: allRemoteFilter, filterMethod: allFilterMethod, isDeep: isFilterDeep } = filterOpts;
const { remote: allRemoteSort, sortMethod: allSortMethod, multiple: sortMultiple, chronological, isDeep: isSortDeep } = sortOpts;
let tableData = [];
let tableTree = [];
// 处理数据
if (!allRemoteFilter || !allRemoteSort) {
const filterColumns = [];
let orderColumns = [];
tableFullColumn.forEach((column) => {
const { field, sortable, order, filters } = column;
if (!allRemoteFilter && filters && filters.length) {
const valueList = [];
const itemList = [];
filters.forEach((item) => {
if (item.checked) {
itemList.push(item);
valueList.push(item.value);
}
});
if (itemList.length) {
filterColumns.push({ column, valueList, itemList });
}
}
if (!allRemoteSort && sortable && order) {
orderColumns.push({ column, field, property: field, order: order, sortTime: column.sortTime });
}
});
if (sortMultiple && chronological && orderColumns.length > 1) {
orderColumns = XEUtils.orderBy(orderColumns, 'sortTime');
}
// 处理筛选
// 支持单列、多列、组合筛选
if (!allRemoteFilter && filterColumns.length) {
const handleFilter = (row) => {
return filterColumns.every(({ column, valueList, itemList }) => {
const { filterMethod, filterRender } = column;
const compConf = isEnableConf(filterRender) ? renderer$1.get(filterRender.name) : null;
const compFilterMethod = compConf ? (compConf.tableFilterMethod || compConf.filterMethod) : null;
const tdFilterMethod = compConf ? (compConf.tableFilterDefaultMethod || compConf.defaultTableFilterMethod || compConf.defaultFilterMethod) : null;
const cellValue = getCellValue(row, column);
if (filterMethod) {
return itemList.some((item) => filterMethod({ value: item.value, option: item, cellValue, row, column, $table: $xeTable }));
}
else if (compFilterMethod) {
return itemList.some((item) => compFilterMethod({ value: item.value, option: item, cellValue, row, column, $table: $xeTable }));
}
else if (allFilterMethod) {
return allFilterMethod({ $table: $xeTable, options: itemList, values: valueList, cellValue, row, column });
}
else if (tdFilterMethod) {
return itemList.some((item) => tdFilterMethod({ value: item.value, option: item, cellValue, row, column, $table: $xeTable }));
}
return valueList.indexOf(XEUtils.get(row, column.field)) > -1;
});
};
if (isRowGroupStatus) {
// 行分组
tableTree = XEUtils.searchTree(tableFullGroupData, handleFilter, {
original: true,
isEvery: true,
children: aggregateOpts.mapChildrenField,
mapChildren: aggregateOpts.childrenField
});
tableData = tableTree;
}
else if (treeConfig && transform && isFilterDeep !== false) {
// 筛选虚拟树
tableTree = XEUtils.searchTree(tableFullTreeData, handleFilter, {
original: true,
isEvery,
children: mapChildrenField,
mapChildren: childrenField
});
tableData = tableTree;
}
else {
tableData = treeConfig ? tableFullTreeData.filter(handleFilter) : tableFullData.filter(handleFilter);
tableTree = tableData;
}
}
else {
if (isRowGroupStatus) {
// 还原行分组
tableTree = XEUtils.searchTree(tableFullGroupData, () => true, {
original: true,
isEvery: true,
children: aggregateOpts.mapChildrenField,
mapChildren: aggregateOpts.childrenField
});
tableData = tableTree;
}
else if (treeConfig && transform && isFilterDeep !== false) {
// 还原虚拟树
tableTree = XEUtils.searchTree(tableFullTreeData, () => true, {
original: true,
isEvery,
children: mapChildrenField,
mapChildren: childrenField
});
tableData = tableTree;
}
else {
tableData = treeConfig ? tableFullTreeData.slice(0) : tableFullData.slice(0);
tableTree = tableData;
}
}
// 处理排序
// 支持单列、多列、组合排序
if (!allRemoteSort && orderColumns.length) {
if (isRowGroupStatus) {
// 行分组的排序
if (allSortMethod) {
const sortRests = allSortMethod({ data: tableTree, sortList: orderColumns, $table: $xeTable });
tableTree = XEUtils.isArray(sortRests) ? sortRests : tableTree;
}
else {
const treeList = XEUtils.toTreeArray(tableTree, {
key: aggregateOpts.rowField,
parentKey: aggregateOpts.parentField,
children: aggregateOpts.mapChildrenField
});
tableTree = XEUtils.toArrayTree(XEUtils.orderBy(treeList, orderColumns.map(({ column, order }) => [getOrderField(column), order])), {
key: aggregateOpts.rowField,
parentKey: aggregateOpts.parentField,
children: aggregateOpts.childrenField,
mapChildren: aggregateOpts.mapChildrenField
});
}
tableData = tableTree;
}
else if (treeConfig && transform && isSortDeep !== false) {
// 虚拟树的排序
if (allSortMethod) {
const sortRests = allSortMethod({ data: tableTree, sortList: orderColumns, $table: $xeTable });
tableTree = XEUtils.isArray(sortRests) ? sortRests : tableTree;
}
else {
const treeList = XEUtils.toTreeArray(tableTree, {
children: mapChildrenField
});
tableTree = XEUtils.toArrayTree(XEUtils.orderBy(treeList, orderColumns.map(({ column, order }) => [getOrderField(column), order])), {
key: rowField,
parentKey: parentField,
children: childrenField,
mapChildren: mapChildrenField
});
}
tableData = tableTree;
}
else {
if (allSortMethod) {
const sortRests = allSortMethod({ data: tableData, sortList: orderColumns, $table: $xeTable });
tableData = XEUtils.isArray(sortRests) ? sortRests : tableData;
}
else {
tableData = XEUtils.orderBy(tableData, orderColumns.map(({ column, order }) => [getOrderField(column), order]));
}
tableTree = tableData;
}
}
}
else {
if (isRowGroupStatus) {
// 还原行分组
// 还原虚拟树
tableTree = XEUtils.searchTree(tableFullGroupData, () => true, {
original: true,
isEvery: true,
children: aggregateOpts.mapChildrenField,
mapChildren: aggregateOpts.childrenField
});
tableData = tableTree;
}
else if (treeConfig && transform && isSortDeep !== false) {
// 还原虚拟树
tableTree = XEUtils.searchTree(tableFullTreeData, () => true, {
original: true,
isEvery,
children: mapChildrenField,
mapChildren: childrenField
});
tableData = tableTree;
}
else {
tableData = treeConfig ? tableFullTreeData.slice(0) : tableFullData.slice(0);
tableTree = tableData;
}
}
internalData.afterFullData = tableData;
internalData.afterTreeFullData = tableTree;
internalData.afterGroupFullData = tableTree;
updateAfterDataIndex();
};
const updateStyle = () => {
const { mouseConfig } = props;
const { isGroup, tableColumn, overflowX, scrollbarWidth, overflowY, scrollbarHeight, scrollXWidth, columnStore, editStore, isColLoading } = reactData;
const { visibleColumn, tableHeight, elemStore, currentRow, customHeight, customMinHeight, customMaxHeight, tHeaderHeight, tFooterHeight } = internalData;
const $xeGanttView = internalData.xeGanttView;
const el = refElem.value;
if (!el || (internalData.tBodyHeight && !el.clientHeight)) {
return;
}
const containerList = ['main', 'left', 'right'];
const { leftList, rightList } = columnStore;
let osbWidth = overflowY ? scrollbarWidth : 0;
let osbHeight = overflowX ? scrollbarHeight : 0;
const emptyPlaceholderElem = refEmptyPlaceholder.value;
const isHeaderRenderOptimize = computeIsHeaderRenderOptimize.value;
const isBodyRenderOptimize = computeIsBodyRenderOptimize.value;
const isFooterRenderOptimize = computeIsFooterRenderOptimize.value;
const scrollbarOpts = computeScrollbarOpts.value;
const mouseOpts = computeMouseOpts.value;
const bodyWrapperElem = getRefElem(elemStore['main-body-wrapper']);
const bodyTableElem = getRefElem(elemStore['main-body-table']);
if (emptyPlaceholderElem) {
emptyPlaceholderElem.style.top = `${tHeaderHeight}px`;
emptyPlaceholderElem.style.height = bodyWrapperElem ? `${bodyWrapperElem.offsetHeight - osbHeight}px` : '';
}
const scrollbarXConf = scrollbarOpts.x || {};
const scrollbarYConf = scrollbarOpts.y || {};
const scrollbarYToLeft = computeScrollbarYToLeft.value;
let xScrollbarVisible = overflowX ? 'visible' : 'hidden';
if (scrollbarXConf.visible === 'visible' || $xeGanttView) {
osbHeight = scrollbarHeight;
xScrollbarVisible = 'visible';
}
else if (scrollbarXConf.visible === 'hidden' || scrollbarXConf.visible === false) {
osbHeight = 0;
xScrollbarVisible = 'hidden';
}
let yScrollbarVisible = overflowY ? 'visible' : 'hidden';
if ((scrollbarYConf.visible === 'hidden' || scrollbarYConf.visible === false) || (($xeGantt && $xeGanttView && $xeGantt.reactData.showRightView) && !scrollbarYToLeft)) {
osbWidth = 0;
yScrollbarVisible = 'hidden';
}
else if (scrollbarYConf.visible === 'visible') {
osbWidth = scrollbarWidth;
yScrollbarVisible = 'visible';
}
let tbHeight = 0;
let bodyMaxHeight = 0;
const bodyMinHeight = customMinHeight - tHeaderHeight - tFooterHeight - osbHeight;
if (customMaxHeight) {
bodyMaxHeight = Math.max(bodyMinHeight, customMaxHeight - tHeaderHeight - tFooterHeight - osbHeight);
}
if (customHeight) {
tbHeight = customHeight - tHeaderHeight - tFooterHeight - osbHeight;
}
if (!tbHeight) {
if (bodyTableElem) {
tbHeight = bodyTableElem.clientHeight;
}
}
if (tbHeight) {
if (bodyMaxHeight) {
tbHeight = Math.min(bodyMaxHeight, tbHeight);
}
tbHeight = Math.max(bodyMinHeight, tbHeight);
}
const xLeftCornerEl = refScrollXLeftCornerElem.value;
const xRightCornerEl = refScrollXRightCornerElem.value;
const scrollXVirtualEl = refScrollXVirtualElem.value;
if (scrollXVirtualEl) {
scrollXVirtualEl.style.height = `${osbHeight}px`;
scrollXVirtualEl.style.visibility = xScrollbarVisible;
}
const xWrapperEl = refScrollXWrapperElem.value;
if (xWrapperEl) {
xWrapperEl.style.width = `${el.clientWidth - osbWidth}px`;
if (scrollbarYToLeft) {
xWrapperEl.style.left = `${osbWidth}px`;
}
else {
xWrapperEl.style.left = '';
}
}
if (xLeftCornerEl) {
if (scrollbarYToLeft) {
xLeftCornerEl.style.width = `${osbWidth}px`;
xLeftCornerEl.style.display = overflowY && osbWidth ? 'block' : '';
}
else {
xLeftCornerEl.style.display = '';
}
}
if (xRightCornerEl) {
if (scrollbarYToLeft) {
xRightCornerEl.style.display = '';
}
else {
xRightCornerEl.style.width = `${osbWidth}px`;
xRightCornerEl.style.display = xScrollbarVisible === 'visible' ? 'block' : '';
}
}
const scrollYVirtualEl = refScrollYVirtualElem.value;
if (scrollYVirtualEl) {
scrollYVirtualEl.style.width = `${osbWidth}px`;
scrollYVirtualEl.style.height = `${tbHeight + tHeaderHeight + tFooterHeight}px`;
scrollYVirtualEl.style.visibility = yScrollbarVisible;
}
const yTopCornerEl = refScrollYTopCornerElem.value;
if (yTopCornerEl) {
yTopCornerEl.style.height = `${tHeaderHeight}px`;
yTopCornerEl.style.display = tHeaderHeight && yScrollbarVisible === 'visible' ? 'block' : '';
}
const yWrapperEl = refScrollYWrapperElem.value;
if (yWrapperEl) {
yWrapperEl.style.height = `${tbHeight}px`;
yWrapperEl.style.top = `${tHeaderHeight}px`;
}
const yBottomCornerEl = refScrollYBottomCornerElem.value;
if (yBottomCornerEl) {
yBottomCornerEl.style.height = `${tFooterHeight}px`;
yBottomCornerEl.style.top = `${tHeaderHeight + tbHeight}px`;
yBottomCornerEl.style.display = tFooterHeight && yScrollbarVisible === 'visible' ? 'block' : '';
}
const rowExpandEl = refRowExpandElem.value;
if (rowExpandEl) {
rowExpandEl.style.height = `${tbHeight}px`;
rowExpandEl.style.top = `${tHeaderHeight}px`;
}
internalData.tBodyHeight = tbHeight;
containerList.forEach((name, index) => {
const fixedType = index > 0 ? name : '';
const layoutList = ['header', 'body', 'footer'];
const isFixedLeft = fixedType === 'left';
let fixedColumn = [];
let fixedWrapperElem;
if (fixedType) {
fixedColumn = isFixedLeft ? leftList : rightList;
fixedWrapperElem = isFixedLeft ? refLeftContainer.value : refRightContainer.value;
}
layoutList.forEach(layout => {
const wrapperElem = getRefElem(elemStore[`${name}-${layout}-wrapper`]);
const currScrollElem = getRefElem(elemStore[`${name}-${layout}-scroll`]);
const tableElem = getRefElem(elemStore[`${name}-${layout}-table`]);
if (layout === 'header') {
// 表头体样式处理
// 横向滚动渲染
let renderColumnList = tableColumn;
const isOptimizeMode = isHeaderRenderOptimize;
if (isGroup) {
renderColumnList = visibleColumn;
}
else {
if (!isOptimizeMode || (!isColLoading && (fixedType || !overflowX))) {
renderColumnList = visibleColumn;
}
if (fixedType) {
// 如果是使用优化模式
if (isOptimizeMode) {
renderColumnList = fixedColumn || [];
}
}
}
const tWidth = renderColumnList.reduce((previous, column) => previous + column.renderWidth, 0);
if (fixedType) {
if (isGroup) {
if (wrapperElem) {
wrapperElem.style.width = scrollXWidth ? `${scrollXWidth}px` : '';
}
}
else {
if (isOptimizeMode) {
if (wrapperElem) {
wrapperElem.style.width = tWidth ? `${tWidth}px` : '';
}
}
else {
if (wrapperElem) {
wrapperElem.style.width = scrollXWidth ? `${scrollXWidth}px` : '';
}
}
}
}
if (currScrollElem) {
currScrollElem.style.height = `${tHeaderHeight}px`;
}
if (tableElem) {
tableElem.style.width = tWidth ? `${tWidth}px` : '';
}
}
else if (layout === 'body') {
if (currScrollElem) {
currScrollElem.style.maxHeight = customMaxHeight ? `${bodyMaxHeight}px` : '';
currScrollElem.style.height = customHeight ? `${tbHeight}px` : '';
currScrollElem.style.minHeight = `${bodyMinHeight}px`;
}
// 如果是固定列
if (fixedWrapperElem) {
if (wrapperElem) {
wrapperElem.style.top = `${tHeaderHeight}px`;
}
fixedWrapperElem.style.height = `${customHeight > 0 ? customHeight : (tableHeight + tHeaderHeight + tFooterHeight + osbHeight)}px`;
fixedWrapperElem.style.width = `${fixedColumn.reduce((previous, column) => previous + column.renderWidth, 0)}px`;
}
let renderColumnList = tableColumn;
const isOptimizeMode = isBodyRenderOptimize;
if (fixedType) {
renderColumnList = visibleColumn;
if (isOptimizeMode) {
renderColumnList = fixedColumn || [];
}
}
const tWidth = renderColumnList.reduce((previous, column) => previous + column.renderWidth, 0);
if (fixedType) {
if (isOptimizeMode) {
if (wrapperElem) {
wrapperElem.style.width = tWidth ? `${tWidth}px` : '';
}
}
else {
if (wrapperElem) {
wrapperElem.style.width = scrollXWidth ? `${scrollXWidth}px` : '';
}
}
}
if (tableElem) {
tableElem.style.width = tWidth ? `${tWidth}px` : '';
// 兼容性处理
tableElem.style.paddingRight = osbWidth && fixedType && (browseObj.firefox || browseObj.safari) ? `${osbWidth}px` : '';
}
const emptyBlockElem = getRefElem(elemStore[`${name}-${layout}-emptyBlock`]);
if (emptyBlockElem) {
emptyBlockElem.style.width = tWidth ? `${tWidth}px` : '';
}
}
else if (layout === 'footer') {
let renderColumnList = tableColumn;
const isOptimizeMode = isFooterRenderOptimize;
if (!isOptimizeMode || (!isColLoading && (fixedType || !overflowX))) {
renderColumnList = visibleColumn;
}
if (fixedType) {
if (isOptimizeMode) {
renderColumnList = fixedColumn || [];
}
}
const tWidth = renderColumnList.reduce((previous, column) => previous + column.renderWidth, 0);
if (fixedType) {
if (isOptimizeMode) {
if (wrapperElem) {
wrapperElem.style.width = tWidth ? `${tWidth}px` : '';
}
}
else {
if (wrapperElem) {
wrapperElem.style.width = scrollXWidth ? `${scrollXWidth}px` : '';
}
}
}
if (currScrollElem) {
currScrollElem.style.height = `${tFooterHeight}px`;
// 如果是固定列
if (fixedWrapperElem) {
if (wrapperElem) {
wrapperElem.style.top = `${customHeight > 0 ? customHeight - tFooterHeight - osbHeight : tableHeight + tHeaderHeight}px`;
}
}
}
if (tableElem) {
tableElem.style.width = tWidth ? `${tWidth}px` : '';
}
}
});
});
if (currentRow) {
$xeTable.setCurrentRow(currentRow);
}
if (mouseConfig && mouseOpts.selected && editStore.selected.row && editStore.selected.column) {
$xeTable.addCellSelectedClass();
}
if ($xeGanttView && $xeGanttView.handleUpdateStyle) {
$xeGanttView.handleUpdateStyle();
}
return nextTick();
};
const checkValidate = (type) => {
if ($xeTable.triggerValidate) {
return $xeTable.triggerValidate(type);
}
return nextTick();
};
/**
* 当单元格发生改变时
* 如果存在规则,则校验
*/
const handleChangeCell = (evnt, params) => {
checkValidate('blur')
.catch((e) => e)
.then(() => {
$xeTable.handleEdit(params, evnt)
.then(() => checkValidate('change'))
.catch((e) => e);
});
};
const handleDefaultSort = () => {
const { sortConfig } = props;
if (sortConfig) {
const sortOpts = computeSortOpts.value;
let { defaultSort } = sortOpts;
if (defaultSort) {
if (!XEUtils.isArray(defaultSort)) {
defaultSort = [defaultSort];
}
if (defaultSort.length) {
(sortConfig.multiple ? defaultSort : defaultSort.slice(0, 1)).forEach((item, index) => {
const { field, order } = item;
if (field && order) {
const column = $xeTable.getColumnByField(field);
if (column && column.sortable) {
column.order = order;
column.sortTime = Date.now() + index;
}
}
});
if (!sortOpts.remote) {
$xeTable.handleTableData(true).then(updateStyle);
}
}
}
}
};
/**
* 处理默认勾选
*/
const handleDefaultSelectionChecked = () => {
const { checkboxConfig } = props;
if (checkboxConfig) {
const { fullDataRowIdData } = internalData;
const checkboxOpts = computeCheckboxOpts.value;
const { checkAll, checkRowKeys } = checkboxOpts;
if (checkAll) {
handleCheckedAllCheckboxRow(true, true);
}
else if (checkRowKeys) {
const defSelection = [];
checkRowKeys.forEach((rowKey) => {
const rowid = encodeRowid(rowKey);
if (fullDataRowIdData[rowid]) {
defSelection.push(fullDataRowIdData[rowid].row);
}
});
handleCheckedCheckboxRow(defSelection, true, true);
}
}
};
/**
* 处理单选框默认勾选
*/
const handleDefaultRadioChecked = () => {
const { radioConfig } = props;
if (radioConfig) {
const { fullDataRowIdData } = internalData;
const radioOpts = computeRadioOpts.value;
const { checkRowKey: rowKey, reserve } = radioOpts;
const rowid = rowKey ? encodeRowid(rowKey) : null;
if (rowid) {
if (fullDataRowIdData[rowid]) {
handleCheckedRadioRow(fullDataRowIdData[rowid].row, true);
}
if (reserve) {
const rowkey = getRowkey($xeTable);
internalData.radioReserveRow = { [rowkey]: rowid };
}
}
}
};
/**
* 处理默认展开行
*/
const handleDefaultRowExpand = () => {
const { expandConfig } = props;
if (expandConfig) {
const { fullDataRowIdData } = internalData;
const expandOpts = computeExpandOpts.value;
const { expandAll, expandRowKeys } = expandOpts;
if (expandAll) {
$xeTable.setAllRowExpand(true);
}
else if (expandRowKeys) {
const defExpandeds = [];
expandRowKeys.forEach((rowKey) => {
const rowid = encodeRowid(rowKey);
if (fullDataRowIdData[rowid]) {
defExpandeds.push(fullDataRowIdData[rowid].row);
}
});
$xeTable.setRowExpand(defExpandeds, true);
}
}
};
const handleRadioReserveRow = (row) => {
const radioOpts = computeRadioOpts.value;
if (radioOpts.reserve) {
internalData.radioReserveRow = row;
}
};
const handleCheckboxReserveRow = (row, checked) => {
const { checkboxReserveRowMap } = internalData;
const checkboxOpts = computeCheckboxOpts.value;
if (checkboxOpts.reserve) {
const rowid = getRowid($xeTable, row);
if (checked) {
checkboxReserveRowMap[rowid] = row;
}
else if (checkboxReserveRowMap[rowid]) {
delete checkboxReserveRowMap[rowid];
}
}
};
const handleCheckedRadioRow = (row, isForce) => {
const radioOpts = computeRadioOpts.value;
const { checkMethod } = radioOpts;
if (row && (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row })))) {
reactData.selectRadioRow = row;
handleRadioReserveRow(row);
}
return nextTick();
};
const handleCheckedCheckboxRow = (rows, value, isForce) => {
if (rows && !XEUtils.isArray(rows)) {
rows = [rows];
}
$xeTable.handleBatchSelectRows(rows, !!value, isForce);
$xeTable.checkSelectionStatus();
return nextTick();
};
const handleCheckedAllCheckboxRow = (checked, isForce) => {
const { treeConfig } = props;
const { isRowGroupStatus } = reactData;
const { afterFullData, afterTreeFullData, afterGroupFullData, checkboxReserveRowMap, selectCheckboxMaps } = internalData;
const treeOpts = computeTreeOpts.value;
const aggregateOpts = computeAggregateOpts.value;
const childrenField = treeOpts.children || treeOpts.childrenField;
const checkboxOpts = computeCheckboxOpts.value;
const { checkField, reserve, checkMethod } = checkboxOpts;
const { handleGetRowId } = createHandleGetRowId($xeTable);
// indeterminateField 仅支持读取
const indeterminateField = checkboxOpts.indeterminateField || checkboxOpts.halfField;
const selectRowMaps = {};
/**
* 绑定属性方式(有污染)
* 必须在行数据存在对应的属性,否则将不响应
*/
if (checkField) {
const checkValFn = (row) => {
if (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row }))) {
if (checked) {
selectRowMaps[handleGetRowId(row)] = row;
}
XEUtils.set(row, checkField, checked);
}
if ((treeConfig || isRowGroupStatus) && indeterminateField) {
XEUtils.set(row, indeterminateField, false);
}
};
// 如果存在选中方法
// 如果方法成立,则更新值,否则忽略该数据
if ((treeConfig || isRowGroupStatus)) {
XEUtils.eachTree(afterFullData, checkValFn, { children: childrenField });
}
else {
afterFullData.forEach(checkValFn);
}
}
else {
/**
* 默认方式(无污染)
* 无需任何属性,直接绑定
*/
if (isRowGroupStatus) {
if (checked) {
/**
* 如果是行分组勾选
* 如果方法成立,则添加到临时集合中
*/
XEUtils.eachTree(afterGroupFullData, (row) => {
if (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row }))) {
const rowid = handleGetRowId(row);
selectRowMaps[rowid] = row;
}
}, { children: aggregateOpts.mapChildrenField });
}
else {
/**
* 如果是树取消
* 如果方法成立,则不添加到临时集合中
*/
if (!isForce && checkMethod) {
XEUtils.eachTree(afterGroupFullData, (row) => {
const rowid = handleGetRowId(row);
if (checkMethod({ $table: $xeTable, row }) ? false : selectCheckboxMaps[rowid]) {
selectRowMaps[rowid] = row;
}
}, { children: aggregateOpts.mapChildrenField });
}
}
}
else if (treeConfig) {
if (checked) {
/**
* 如果是树勾选
* 如果方法成立,则添加到临时集合中
*/
XEUtils.eachTree(afterTreeFullData, (row) => {
if (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row }))) {
const rowid = handleGetRowId(row);
selectRowMaps[rowid] = row;
}
}, { children: childrenField });
}
else {
/**
* 如果是树取消
* 如果方法成立,则不添加到临时集合中
*/
if (!isForce && checkMethod) {
XEUtils.eachTree(afterTreeFullData, (row) => {
const rowid = handleGetRowId(row);
if (checkMethod({ $table: $xeTable, row }) ? false : selectCheckboxMaps[rowid]) {
selectRowMaps[rowid] = row;
}
}, { children: childrenField });
}
}
}
else {
if (checked) {
/**
* 如果是行勾选
* 如果存在选中方法且成立或者本身已勾选,则添加到临时集合中
* 如果不存在选中方法,则添加所有数据到临时集合中
*/
if (!isForce && checkMethod) {
afterFullData.forEach((row) => {
const rowid = handleGetRowId(row);
if (selectCheckboxMaps[rowid] || checkMethod({ $table: $xeTable, row })) {
selectRowMaps[rowid] = row;
}
});
}
else {
afterFullData.forEach(row => {
const rowid = handleGetRowId(row);
selectRowMaps[rowid] = row;
});
}
}
else {
/**
* 如果是行取消
* 如果方法成立,则不添加到临时集合中;如果方法不成立则判断当前是否已勾选,如果已被勾选则添加到新集合中
* 如果不存在选中方法,无需处理,临时集合默认为空
*/
if (!isForce && checkMethod) {
afterFullData.forEach((row) => {
const rowid = handleGetRowId(row);
if (checkMethod({ $table: $xeTable, row }) ? false : selectCheckboxMaps[rowid]) {
selectRowMaps[rowid] = row;
}
});
}
}
}
}
if (reserve) {
if (checked) {
XEUtils.each(selectRowMaps, (row, rowid) => {
checkboxReserveRowMap[rowid] = row;
});
}
else {
afterFullData.forEach((row) => handleCheckboxReserveRow(row, false));
}
}
reactData.updateCheckboxFlag++;
internalData.selectCheckboxMaps = checkField ? {} : selectRowMaps;
reactData.isAllSelected = checked;
reactData.isIndeterminate = false;
internalData.treeIndeterminateRowMaps = {};
$xeTable.checkSelectionStatus();
return nextTick();
};
// 还原展开、选中等相关状态
const handleReserveStatus = () => {
const { treeConfig } = props;
const { expandColumn, selectRadioRow } = reactData;
const { fullDataRowIdData, fullAllDataRowIdData, radioReserveRow, selectCheckboxMaps, treeExpandedMaps, rowExpandedMaps, currentRow } = internalData;
const expandOpts = computeExpandOpts.value;
const treeOpts = computeTreeOpts.value;
const radioOpts = computeRadioOpts.value;
const checkboxOpts = computeCheckboxOpts.value;
// 单选框
if (selectRadioRow && !fullAllDataRowIdData[getRowid($xeTable, selectRadioRow)]) {
reactData.selectRadioRow = null; // 刷新单选行状态
}
// 还原保留选中状态
if (radioOpts.reserve && radioReserveRow) {
const rowid = getRowid($xeTable, radioReserveRow);
if (fullDataRowIdData[rowid]) {
handleCheckedRadioRow(fullDataRowIdData[rowid].row, true);
}
}
// 复选框
internalData.selectCheckboxMaps = getRecoverRowMaps(selectCheckboxMaps); // 刷新多选行状态
reactData.updateCheckboxFlag++;
// 还原保留选中状态
if (checkboxOpts.reserve) {
handleCheckedCheckboxRow(handleReserveRow(internalData.checkboxReserveRowMap), true, true);
}
if (currentRow && !fullAllDataRowIdData[getRowid($xeTable, currentRow)]) {
internalData.currentRow = null; // 刷新当前行状态
}
// 行展开
internalData.rowExpandedMaps = expandColumn ? getRecoverRowMaps(rowExpandedMaps) : {}; // 刷新行展开状态
reactData.rowExpandedFlag++;
// 还原保留状态
if (expandColumn && expandOpts.reserve) {
$xeTable.setRowExpand(handleReserveRow(internalData.rowExpandedReserveRowMap), true);
}
// 树展开
internalData.treeExpandedMaps = treeConfig ? getRecoverRowMaps(treeExpandedMaps) : {}; // 刷新树展开状态
reactData.treeExpandedFlag++;
if (treeConfig && treeOpts.reserve) {
$xeTable.setTreeExpand(handleReserveRow(internalData.treeExpandedReserveRowMap), true);
}
};
/**
* 处理默认展开树节点
*/
const handleDefaultTreeExpand = () => {
const { treeConfig } = props;
if (treeConfig) {
const { fullAllDataRowIdData } = internalData;
const treeOpts = computeTreeOpts.value;
const { expandAll, expandRowKeys } = treeOpts;
if (expandAll) {
$xeTable.setAllTreeExpand(true);
}
else if (expandRowKeys) {
const defExpandeds = [];
expandRowKeys.forEach((rowKey) => {
const rowid = encodeRowid(rowKey);
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
defExpandeds.push(rowRest.row);
}
});
$xeTable.setTreeExpand(defExpandeds, true);
}
}
};
const handleAsyncTreeExpandChilds = (row) => {
const treeOpts = computeTreeOpts.value;
const checkboxOpts = computeCheckboxOpts.value;
const { transform, loadMethod } = treeOpts;
const { checkStrictly } = checkboxOpts;
return new Promise(resolve => {
if (loadMethod) {
const { fullAllDataRowIdData, treeExpandLazyLoadedMaps } = internalData;
const rowid = getRowid($xeTable, row);
const rowRest = fullAllDataRowIdData[rowid];
treeExpandLazyLoadedMaps[rowid] = row;
Promise.resolve(loadMethod({ $table: $xeTable, row })).then((childRecords) => {
if (rowRest) {
rowRest.treeLoaded = true;
}
if (treeExpandLazyLoadedMaps[rowid]) {
delete treeExpandLazyLoadedMaps[rowid];
}
if (!XEUtils.isArray(childRecords)) {
childRecords = [];
}
if (childRecords) {
return $xeTable.loadTreeChildren(row, childRecords).then(childRows => {
const { treeExpandedMaps } = internalData;
if (childRows.length && !treeExpandedMaps[rowid]) {
treeExpandedMaps[rowid] = row;
}
reactData.treeExpandedFlag++;
// 如果当前节点已选中,则展开后子节点也被选中
if (!checkStrictly && $xeTable.isCheckedByCheckboxRow(row)) {
handleCheckedCheckboxRow(childRows, true);
}
return nextTick().then(() => {
if (transform) {
$xeTable.handleTableData();
updateAfterDataIndex();
return nextTick();
}
});
});
}
}).catch(() => {
const { treeExpandLazyLoadedMaps } = internalData;
if (rowRest) {
rowRest.treeLoaded = false;
}
if (treeExpandLazyLoadedMaps[rowid]) {
delete treeExpandLazyLoadedMaps[rowid];
}
}).finally(() => {
reactData.treeExpandedFlag++;
nextTick().then(() => $xeTable.recalculate()).then(() => resolve());
});
}
else {
resolve();
}
});
};
const handleTreeExpandReserve = (row, expanded) => {
const { treeExpandedReserveRowMap } = internalData;
const treeOpts = computeTreeOpts.value;
if (treeOpts.reserve) {
const rowid = getRowid($xeTable, row);
if (expanded) {
treeExpandedReserveRowMap[rowid] = row;
}
else if (treeExpandedReserveRowMap[rowid]) {
delete treeExpandedReserveRowMap[rowid];
}
}
};
const handleAsyncRowExpand = (row) => {
return new Promise(resolve => {
const expandOpts = computeExpandOpts.value;
const { loadMethod } = expandOpts;
if (loadMethod) {
const { fullAllDataRowIdData, rowExpandLazyLoadedMaps } = internalData;
const rowid = getRowid($xeTable, row);
const rowRest = fullAllDataRowIdData[rowid];
rowExpandLazyLoadedMaps[rowid] = row;
loadMethod({ $table: $xeTable, row, rowIndex: $xeTable.getRowIndex(row), $rowIndex: $xeTable.getVMRowIndex(row) }).then(() => {
const { rowExpandedMaps } = internalData;
if (rowRest) {
rowRest.expandLoaded = true;
}
rowExpandedMaps[rowid] = row;
reactData.rowExpandedFlag++;
}).catch(() => {
if (rowRest) {
rowRest.expandLoaded = false;
}
}).finally(() => {
const { rowExpandLazyLoadedMaps } = internalData;
if (rowExpandLazyLoadedMaps[rowid]) {
delete rowExpandLazyLoadedMaps[rowid];
}
reactData.rowExpandedFlag++;
nextTick()
.then(() => $xeTable.recalculate())
.then(() => $xeTable.updateCellAreas())
.then(() => resolve());
});
}
else {
resolve();
}
});
};
const handleRowExpandReserve = (row, expanded) => {
const { rowExpandedReserveRowMap } = internalData;
const expandOpts = computeExpandOpts.value;
if (expandOpts.reserve) {
const rowid = getRowid($xeTable, row);
if (expanded) {
rowExpandedReserveRowMap[rowid] = row;
}
else if (rowExpandedReserveRowMap[rowid]) {
delete rowExpandedReserveRowMap[rowid];
}
}
};
const handleDefaultMergeCells = () => {
const { mergeCells } = props;
if (mergeCells) {
$xeTable.setMergeCells(mergeCells);
}
};
const handleDefaultMergeHeaderItems = () => {
const { mergeHeaderCells } = props;
if (mergeHeaderCells) {
$xeTable.setMergeHeaderCells(mergeHeaderCells);
}
};
const handleDefaultMergeFooterItems = () => {
const { mergeFooterCells, mergeFooterItems } = props;
const mFooterCells = mergeFooterCells || mergeFooterItems;
if (mFooterCells) {
$xeTable.setMergeFooterCells(mFooterCells);
}
};
// 计算可视渲染相关数据
const computeScrollLoad = () => {
return nextTick().then(() => {
const { scrollXLoad, scrollYLoad } = reactData;
const { scrollXStore, scrollYStore } = internalData;
const virtualYOpts = computeVirtualYOpts.value;
const virtualXOpts = computeVirtualXOpts.value;
// 计算 X 逻辑
if (scrollXLoad) {
const { toVisibleIndex: toXVisibleIndex, visibleSize: visibleXSize } = handleVirtualXVisible();
const offsetXSize = Math.max(0, virtualXOpts.oSize ? XEUtils.toNumber(virtualXOpts.oSize) : 0);
scrollXStore.preloadSize = XEUtils.toNumber(virtualXOpts.preSize);
scrollXStore.offsetSize = offsetXSize;
scrollXStore.visibleSize = visibleXSize;
scrollXStore.endIndex = Math.max(scrollXStore.startIndex + scrollXStore.visibleSize + offsetXSize, scrollXStore.endIndex);
scrollXStore.visibleStartIndex = Math.max(scrollXStore.startIndex, toXVisibleIndex);
scrollXStore.visibleEndIndex = Math.min(scrollXStore.endIndex, toXVisibleIndex + visibleXSize);
$xeTable.updateScrollXData().then(() => {
loadScrollXData();
});
}
else {
$xeTable.updateScrollXSpace();
}
// 计算 Y 逻辑
const rowHeight = computeRowHeight();
scrollYStore.rowHeight = rowHeight; // 已废弃
reactData.rowHeight = rowHeight;
const { toVisibleIndex: toYVisibleIndex, visibleSize: visibleYSize } = handleVirtualYVisible();
if (scrollYLoad) {
const offsetYSize = Math.max(0, virtualYOpts.oSize ? XEUtils.toNumber(virtualYOpts.oSize) : 0);
scrollYStore.preloadSize = XEUtils.toNumber(virtualYOpts.preSize);
scrollYStore.offsetSize = offsetYSize;
scrollYStore.visibleSize = visibleYSize;
scrollYStore.endIndex = Math.max(scrollYStore.startIndex + visibleYSize + offsetYSize, scrollYStore.endIndex);
scrollYStore.visibleStartIndex = Math.max(scrollYStore.startIndex, toYVisibleIndex);
scrollYStore.visibleEndIndex = Math.min(scrollYStore.endIndex, toYVisibleIndex + visibleYSize);
$xeTable.updateScrollYData().then(() => {
loadScrollYData();
});
}
else {
$xeTable.updateScrollYSpace();
}
});
};
const calcScrollbar = () => {
const { scrollXWidth, scrollYHeight } = reactData;
const { elemStore } = internalData;
const scrollbarOpts = computeScrollbarOpts.value;
const el = refElem.value;
if (!el || !el.clientWidth) {
return;
}
const bodyWrapperElem = getRefElem(elemStore['main-body-wrapper']);
const headerTableElem = getRefElem(elemStore['main-header-table']);
const footerTableElem = getRefElem(elemStore['main-footer-table']);
const xHandleEl = refScrollXHandleElem.value;
const yHandleEl = refScrollYHandleElem.value;
let overflowY = false;
let overflowX = false;
if (bodyWrapperElem) {
overflowY = scrollYHeight > bodyWrapperElem.clientHeight;
if (yHandleEl) {
reactData.scrollbarWidth = scrollbarOpts.width || (yHandleEl.offsetWidth - yHandleEl.clientWidth) || 14;
}
reactData.overflowY = overflowY;
overflowX = scrollXWidth > bodyWrapperElem.clientWidth;
if (xHandleEl) {
reactData.scrollbarHeight = scrollbarOpts.height || (xHandleEl.offsetHeight - xHandleEl.clientHeight) || 14;
}
const hHeight = headerTableElem ? headerTableElem.clientHeight : 0;
const fHeight = footerTableElem ? footerTableElem.clientHeight : 0;
internalData.tableHeight = bodyWrapperElem.offsetHeight;
internalData.tHeaderHeight = hHeight;
internalData.tFooterHeight = fHeight;
reactData.overflowX = overflowX;
reactData.parentHeight = Math.max(hHeight + fHeight + 20, $xeTable.getParentHeight());
}
if (overflowX) {
$xeTable.checkScrolling();
}
};
const handleRecalculateStyle = (reFull, reWidth, reHeight) => {
const el = refElem.value;
if (!el || !el.clientWidth) {
return nextTick();
}
const varEl = refVarElem.value;
if (varEl) {
const [defEl, mediumEl, smallEl, miniEl] = varEl.children;
calcVarRowHeightConfig('default', defEl);
calcVarRowHeightConfig('medium', mediumEl);
calcVarRowHeightConfig('small', smallEl);
calcVarRowHeightConfig('mini', miniEl);
}
if (reWidth) {
calcCellWidth();
}
if (reWidth || reFull) {
autoCellWidth();
}
calcScrollbar();
updateStyle();
updateRowExpandStyle();
if (reFull) {
updateTreeLineStyle();
}
internalData.rceRunTime = Date.now();
return computeScrollLoad().then(() => {
// 初始化时需要在列计算之后再执行优化运算,达到最优显示效果
if (reWidth) {
calcCellWidth();
}
if (reWidth || reFull) {
autoCellWidth();
}
if (reHeight) {
calcCellHeight();
}
updateStyle();
calcScrollbar();
if (reFull) {
updateRowOffsetTop();
}
updateRowExpandStyle();
if (reFull) {
updateTreeLineStyle();
}
internalData.rceRunTime = Date.now();
if (reFull) {
return computeScrollLoad();
}
});
};
const defaultMinRunDelay = 50;
const handleLazyRecalculate = (reFull, reWidth, reHeight, options) => {
const minRunDelay = (options ? options.minRunDelay : defaultMinRunDelay) || defaultMinRunDelay;
return new Promise(resolve => {
const $xeGanttView = internalData.xeGanttView;
const { customStore, tableData, tableColumn } = reactData;
const { rceTimeout, rceRunTime } = internalData;
const resizeOpts = computeResizeOpts.value;
let rceDelay = internalData.rceDelay;
// 如果在500毫秒内频繁执行,则执行次数减缓
if (rceRunTime && rceRunTime > Date.now() - 500) {
rceDelay = Math.min(Math.max(60, Math.min(800, tableData.length / 8)), rceDelay + 50);
}
else {
rceDelay = 0;
}
internalData.rceDelay = rceDelay;
const refreshDelay = resizeOpts.refreshDelay || 30;
const reDelay = rceDelay + refreshDelay;
const el = refElem.value;
if (el && el.clientWidth) {
autoCellWidth();
updateRowExpandStyle();
}
if (customStore.visible && $xeTable.handleCustomStyle) {
$xeTable.handleCustomStyle();
}
const renderCellSize = tableData.length * tableColumn.length;
// 渲染量低的场景
if (renderCellSize < 400) {
rceDelay = 20;
}
else if (renderCellSize < 600) {
rceDelay = 40;
}
else if (renderCellSize < 800) {
rceDelay = 80;
}
if (rceTimeout) {
clearTimeout(rceTimeout);
// 多少毫秒内至少执行一次
if (rceRunTime && rceRunTime + minRunDelay < Date.now()) {
resolve(handleRecalculateStyle(reFull, reWidth, reHeight));
}
else {
nextTick(() => {
resolve();
});
}
}
else {
resolve(handleRecalculateStyle(reFull, reWidth, reHeight));
}
if ($xeGanttView && $xeGanttView.handleLazyRecalculate) {
$xeGanttView.handleLazyRecalculate();
}
internalData.rceTimeout = setTimeout(() => {
internalData.rceDelay = 0;
internalData.rceTimeout = undefined;
handleRecalculateStyle(reFull, reWidth, reHeight);
if ($xeGanttView && $xeGanttView.handleLazyRecalculate) {
$xeGanttView.handleLazyRecalculate();
}
}, reDelay);
});
};
const handleResizeEvent = () => {
if (internalData.rsePending) {
return;
}
internalData.rsePending = true;
handleLazyRecalculate(true, true, true, {
minRunDelay: 200
}).then(() => {
internalData.rsePending = false;
}).catch(() => {
internalData.rsePending = false;
});
};
const handleUpdateAggValues = () => {
const { visibleColumn } = internalData;
const aggCols = [];
visibleColumn.forEach(column => {
if (column.aggFunc) {
aggCols.push(column);
}
});
reactData.aggHandleAggColumns = aggCols;
};
const handleUpdateRowGroup = (groupFields) => {
const aggGroupFields = [];
const aggGroupConfs = [];
if (groupFields) {
(XEUtils.isArray(groupFields) ? groupFields : [groupFields]).forEach(field => {
aggGroupFields.push(field);
aggGroupConfs.push({
field
});
});
}
reactData.rowGroupList = aggGroupConfs;
reactData.aggHandleFields = aggGroupFields;
handleUpdateAggValues();
};
const handleeGroupSummary = (aggList) => {
const { fullColumnFieldData } = internalData;
const aggregateOpts = computeAggregateOpts.value;
const aggFuncColumns = computeAggFuncColumns.value;
const { mapChildrenField } = aggregateOpts;
const aggCalcMethod = aggregateOpts.calcValuesMethod || aggregateOpts.countMethod || aggregateOpts.aggregateMethod;
if (mapChildrenField) {
XEUtils.lastEach(aggList, aggRow => {
let count = 0;
XEUtils.each(aggRow[mapChildrenField], (row) => {
if (row.isAggregate) {
count += row.childCount || 0;
}
else {
count++;
}
});
aggRow.childCount = count;
});
if ($xeTable.handlePivotTableAggData) {
$xeTable.handlePivotTableAggData(aggList);
}
else {
if (aggFuncColumns.length) {
XEUtils.lastEach(aggList, aggRow => {
const aggDtObj = {};
const aggData = aggRow.aggData;
const groupField = aggRow.groupField;
const groupContent = aggRow.groupContent;
const childList = mapChildrenField ? (aggRow[mapChildrenField] || []) : [];
const childCount = aggRow.childCount;
const colRest = fullColumnFieldData[groupField] || {};
aggFuncColumns.forEach(column => {
const { field } = column;
const currAggData = aggData ? aggData[field] : null;
const ctParams = {
$table: $xeTable,
groupField,
groupColumn: (colRest ? colRest.column : null),
column,
groupValue: groupContent,
childList,
childCount,
aggValue: currAggData ? currAggData.value : 0,
/**
* 已废弃
* @deprecated
*/
children: childList,
/**
* 已废弃
* @deprecated
*/
totalValue: childCount
};
let aggVal = 0;
// 如果下层同时也是分组
if (childList.length && childList[0].isAggregate) {
XEUtils.each(childList, (row) => {
if (row.isAggregate) {
const currAggData = row.aggData[field];
if (currAggData) {
aggVal += currAggData.value;
}
}
});
}
else {
aggVal = aggCalcMethod ? aggCalcMethod(ctParams) : aggRow.childCount;
}
aggDtObj[field] = {
type: 'count',
value: aggVal,
label: aggVal
};
});
aggRow.aggData = aggDtObj;
});
}
}
}
};
const updateGroupData = () => {
const { aggregateConfig, rowGroupConfig } = props;
const { isRowGroupStatus } = reactData;
const { tableFullGroupData } = internalData;
const aggregateOpts = computeAggregateOpts.value;
const { mapChildrenField } = aggregateOpts;
if ((aggregateConfig || rowGroupConfig) && isRowGroupStatus) {
const aggList = [];
XEUtils.eachTree(tableFullGroupData, row => {
if (row.isAggregate) {
aggList.push(row);
}
}, { children: mapChildrenField });
handleeGroupSummary(aggList);
}
};
const handleGroupData = (list, rowGroups, isCombinedField) => {
let fullData = list;
let treeData = list;
if (rowGroups) {
const aggregateOpts = computeAggregateOpts.value;
const { rowField, parentField, separator, childrenField, mapChildrenField } = aggregateOpts;
const rowOpts = computeRowOpts.value;
const checkboxOpts = computeCheckboxOpts.value;
const { checkField } = checkboxOpts;
const indeterminateField = checkboxOpts.indeterminateField || checkboxOpts.halfField;
const rgItem = rowGroups[0];
if (rgItem && rowField && parentField && childrenField && mapChildrenField) {
fullData = [];
treeData = [];
const groupField = rgItem.field;
const groupColumn = $xeTable.getColumnByField(groupField);
const groupMaps = {};
const groupCombinedMaps = {};
const aggList = [];
const rowkey = getRowkey($xeTable);
list.forEach((row) => {
const cellValue = groupColumn ? $xeTable.getCellLabel(row, groupColumn) : XEUtils.get(row, groupField);
let groupValue = XEUtils.eqNull(cellValue) ? '' : cellValue;
if (isCombinedField) {
const groupVals = [groupValue];
rowGroups.slice(1).forEach(ogItem => {
const ogField = ogItem.field;
const ogColumn = $xeTable.getColumnByField(ogField);
const ocValue = ogColumn ? $xeTable.getCellLabel(row, ogColumn) : XEUtils.get(row, ogField);
const ogValue = XEUtils.eqNull(ocValue) ? '' : ocValue;
groupValue += (separator || ' / ') + ogValue;
groupVals.push(ogValue);
});
if (!groupCombinedMaps[groupValue]) {
groupCombinedMaps[groupValue] = groupVals;
}
}
let childList = groupMaps[groupValue];
if (!childList) {
childList = [];
groupMaps[groupValue] = childList;
}
if (row.isAggregate) {
row.isAggregate = undefined;
}
childList.push(row);
});
if (isCombinedField) {
XEUtils.objectEach(groupMaps, (childList, groupValue) => {
const aggRow = {
isAggregate: true,
aggData: {},
groupContent: groupValue,
groupCombineds: groupCombinedMaps[groupValue],
groupField,
childCount: 0,
[rowField]: getRowUniqueId(),
[parentField]: null,
[childrenField]: childList,
[mapChildrenField]: childList
};
aggRow[rowkey] = createRowId(rowOpts, aggRow, rowkey);
if (checkField) {
aggRow[checkField] = false;
}
if (indeterminateField) {
aggRow[indeterminateField] = false;
}
aggList.push(aggRow);
treeData.push(aggRow);
fullData.push(aggRow);
});
}
else {
XEUtils.objectEach(groupMaps, (childList, groupValue) => {
const { fullData: childFullData, treeData: childTreeData } = handleGroupData(childList, rowGroups.slice(1));
const aggRow = {
isAggregate: true,
aggData: {},
groupContent: groupValue,
groupCombineds: [],
groupField,
childCount: 0,
[rowField]: getRowUniqueId(),
[parentField]: null,
[childrenField]: childTreeData,
[mapChildrenField]: childTreeData
};
aggRow[rowkey] = createRowId(rowOpts, aggRow, rowkey);
if (checkField) {
aggRow[checkField] = false;
}
if (indeterminateField) {
aggRow[indeterminateField] = false;
}
aggList.push(aggRow);
treeData.push(aggRow);
fullData.push(aggRow);
if (childFullData.length) {
fullData.push(...childFullData);
}
});
}
handleeGroupSummary(aggList);
}
}
return {
treeData,
fullData
};
};
const initGroupData = (list, rowGroups) => {
const aggregateOpts = computeAggregateOpts.value;
const { mode } = aggregateOpts;
const isCombinedField = mode === 'combined';
const groupRest = handleGroupData(list, rowGroups, isCombinedField);
return groupRest;
};
const initData = () => {
const { data } = props;
loadTableData(data || [], true, true).then(() => {
if (data && data.length) {
internalData.inited = true;
internalData.initStatus = true;
handleLoadDefaults();
}
handleInitDefaults();
updateStyle();
if (!reactData.isAllOverflow) {
calcCellHeight();
updateRowOffsetTop();
}
});
nextTick(() => {
dispatchEvent('ready', {}, null);
});
};
/**
* 加载表格数据
* @param {Array} datas 数据
*/
const loadTableData = (datas, isReload, isReset) => {
const { keepSource, treeConfig, rowGroupConfig, aggregateConfig } = props;
const { rowGroupList, scrollYLoad: oldScrollYLoad } = reactData;
const { initStatus, scrollYStore, scrollXStore, lastScrollLeft, lastScrollTop } = internalData;
const rowOpts = computeRowOpts.value;
const treeOpts = computeTreeOpts.value;
const expandOpts = computeExpandOpts.value;
const { transform } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
let treeData = [];
let fullData = reactive(datas ? datas.slice(0) : []); // 转为响应式数据
if (fullData.length > supportMaxRow) {
errLog$2('vxe.error.errMaxRow', [supportMaxRow]);
}
if (treeConfig && rowGroupList.length) {
errLog$2('vxe.error.noTree', ['aggregate-config']);
return nextTick();
}
if (rowOpts.drag && rowGroupList.length) {
errLog$2('vxe.error.errConflicts', ['row-config.drag', 'aggregate-config']);
return nextTick();
}
let isRGroup = false;
if (treeConfig) {
if (transform) {
// 树结构自动转换
if (!treeOpts.rowField) {
errLog$2('vxe.error.reqProp', ['tree-config.rowField']);
}
if (!treeOpts.parentField) {
errLog$2('vxe.error.reqProp', ['tree-config.parentField']);
}
if (!childrenField) {
errLog$2('vxe.error.reqProp', ['tree-config.childrenField']);
}
if (!treeOpts.mapChildrenField) {
errLog$2('vxe.error.reqProp', ['tree-config.mapChildrenField']);
}
if (childrenField === treeOpts.mapChildrenField) {
errLog$2('vxe.error.errConflicts', ['tree-config.childrenField', 'tree-config.mapChildrenField']);
}
// fullData.forEach(row => {
// if (row[treeOpts.children] && row[treeOpts.children].length) {
// warnLog('vxe.error.errConflicts', ['tree-config.transform', `row.${treeOpts.children}`])
// }
// })
treeData = XEUtils.toArrayTree(fullData, {
key: treeOpts.rowField,
parentKey: treeOpts.parentField,
children: childrenField,
mapChildren: treeOpts.mapChildrenField
});
fullData = treeData.slice(0);
}
else {
treeData = fullData.slice(0);
}
}
else if ((aggregateConfig || rowGroupConfig) && rowGroupList.length) {
const groupRest = initGroupData(fullData, rowGroupList);
treeData = groupRest.treeData;
fullData = groupRest.fullData;
isRGroup = true;
}
reactData.isRowGroupStatus = isRGroup;
scrollYStore.startIndex = 0;
scrollYStore.endIndex = 1;
scrollXStore.startIndex = 0;
scrollXStore.endIndex = 1;
internalData.cvCacheMaps = {};
reactData.isRowLoading = true;
reactData.scrollVMLoading = false;
reactData.treeExpandedFlag++;
reactData.rowExpandedFlag++;
internalData.insertRowMaps = {};
reactData.insertRowFlag++;
internalData.removeRowMaps = {};
reactData.removeRowFlag++;
internalData.fullCellHeightMaps = {};
internalData.fullCellStoreMaps = {};
const sYLoad = updateScrollYStatus(fullData);
// 全量数据
internalData.tableFullData = fullData;
internalData.tableFullTreeData = isRGroup ? [] : treeData;
internalData.tableFullGroupData = isRGroup ? treeData : [];
// 缓存数据
$xeTable.cacheRowMap(isReset);
// 原始数据
internalData.tableSynchData = datas;
if (isReset) {
internalData.isResizeCellHeight = false;
}
// 克隆原数据,用于显示编辑状态,与编辑值做对比
if (keepSource) {
$xeTable.cacheSourceMap(fullData);
}
if ($xeTable.clearCellAreas && props.mouseConfig) {
$xeTable.clearCellAreas();
$xeTable.clearCopyCellArea();
}
$xeTable.clearMergeCells();
$xeTable.clearMergeFooterItems();
$xeTable.clearHistory();
$xeTable.handleTableData(true);
$xeTable.updateFooter();
$xeTable.handleUpdateBodyMerge();
return nextTick().then(() => {
updateHeight();
updateStyle();
}).then(() => {
computeScrollLoad();
syncGanttScrollYStatus();
}).then(() => {
const virtualYOpts = computeVirtualYOpts.value;
// 是否启用了虚拟滚动
if (sYLoad) {
scrollYStore.endIndex = scrollYStore.visibleSize;
}
if (sYLoad) {
if (reactData.expandColumn && expandOpts.mode !== 'fixed') {
errLog$2('vxe.error.notConflictProp', ['column.type="expand', 'expand-config.mode="fixed"']);
}
if (virtualYOpts.mode === 'scroll' && reactData.expandColumn && expandOpts.mode === 'fixed') {
warnLog$2('vxe.error.notConflictProp', ['virtual-y-config.mode=scroll', 'expand-config.mode=inside']);
}
// if (showOverflow) {
// if (!rowOpts.height) {
// const errColumn = internalData.tableFullColumn.find(column => column.showOverflow === false)
// if (errColumn) {
// errLog('vxe.error.errProp', [`column[field="${errColumn.field}"].show-overflow=false`, 'show-overflow=true'])
// }
// }
// }
if (!(props.height || props.maxHeight)) {
errLog$2('vxe.error.reqSupportProp', ['virtual-y-config.enabled = true', 'height | max-height']);
}
// if (!props.showOverflow) {
// warnLog('vxe.error.reqProp', ['table.show-overflow'])
// }
// if (props.spanMethod) {
// warnLog('vxe.error.scrollErrProp', ['span-method'])
// }
}
handleReserveStatus();
$xeTable.checkSelectionStatus();
$xeTable.dispatchEvent('data-change', {
visibleColumn: internalData.visibleColumn,
visibleData: internalData.afterFullData
}, null);
return new Promise(resolve => {
nextTick()
.then(() => handleRecalculateStyle(false, false, false))
.then(() => {
handleRecalculateStyle(false, true, true);
updateRowOffsetTop();
})
.then(() => {
let targetScrollLeft = lastScrollLeft;
let targetScrollTop = lastScrollTop;
const virtualXOpts = computeVirtualXOpts.value;
const virtualYOpts = computeVirtualYOpts.value;
// 是否在更新数据之后自动滚动重置滚动条
if (virtualXOpts.scrollToLeftOnChange) {
targetScrollLeft = 0;
}
if (virtualYOpts.scrollToTopOnChange) {
targetScrollTop = 0;
}
reactData.isRowLoading = false;
handleRecalculateStyle(false, false, false);
updateTreeLineStyle();
syncGanttScrollYStatus();
// 如果是自动行高,特殊情况需调用 recalculate 手动刷新
if (!props.showOverflow) {
setTimeout(() => {
handleLazyRecalculate(false, true, true);
setTimeout(() => handleLazyRecalculate(false, true, true), 3000);
}, 2000);
}
// 是否变更虚拟滚动
if (oldScrollYLoad === sYLoad) {
restoreScrollLocation($xeTable, targetScrollLeft, targetScrollTop)
.then(() => {
handleRecalculateStyle(false, true, true);
updateRowOffsetTop();
updateTreeLineStyle();
nextTick(() => resolve());
});
}
else {
setTimeout(() => {
restoreScrollLocation($xeTable, targetScrollLeft, targetScrollTop)
.then(() => {
handleRecalculateStyle(false, true, true);
updateRowOffsetTop();
updateTreeLineStyle();
nextTick(() => resolve());
});
});
}
});
}).then(() => {
if (initStatus) {
dispatchEvent('data-rendered', {
isReload,
visibleColumn: internalData.visibleColumn,
visibleData: internalData.afterFullData
}, null);
}
else {
dispatchEvent('init-rendered', {
visibleColumn: internalData.visibleColumn,
visibleData: internalData.afterFullData
}, null);
}
});
});
};
/**
* 处理数据加载默认行为
* 默认执行一次,除非被重置
*/
const handleLoadDefaults = () => {
handleDefaultSelectionChecked();
handleDefaultRadioChecked();
handleDefaultRowExpand();
handleDefaultTreeExpand();
handleDefaultRowGroupExpand();
handleDefaultMergeCells();
handleDefaultMergeHeaderItems();
handleDefaultMergeFooterItems();
nextTick(() => {
setTimeout(() => $xeTable.recalculate());
});
};
/**
* 处理初始化的默认行为
* 只会执行一次
*/
const handleInitDefaults = () => {
handleDefaultSort();
};
const handleTableColumn = () => {
const { scrollXLoad } = reactData;
const { visibleColumn, scrollXStore, fullColumnIdData } = internalData;
const tableColumn = scrollXLoad ? visibleColumn.slice(scrollXStore.startIndex, scrollXStore.endIndex) : visibleColumn.slice(0);
tableColumn.forEach((column, $index) => {
const colid = column.id;
const colRest = fullColumnIdData[colid];
if (colRest) {
colRest.$index = $index;
}
});
reactData.tableColumn = tableColumn;
};
const handleUpdateColumn = () => {
const columnList = XEUtils.orderBy(internalData.collectColumn, 'renderSortNumber');
internalData.collectColumn = columnList;
const tFullColumn = getColumnList(columnList);
internalData.tableFullColumn = tFullColumn;
reactData.updateColFlag++;
cacheColumnMap();
};
const loadScrollXData = () => {
const { isScrollXBig } = reactData;
const { mergeBodyList, mergeFooterList, mergeBodyRowMaps, scrollXStore } = internalData;
const { preloadSize, startIndex, endIndex, offsetSize } = scrollXStore;
const { toVisibleIndex, visibleSize } = handleVirtualXVisible();
const offsetItem = {
startIndex: Math.max(0, isScrollXBig ? toVisibleIndex - 1 : toVisibleIndex - 1 - offsetSize - preloadSize),
endIndex: isScrollXBig ? toVisibleIndex + visibleSize : toVisibleIndex + visibleSize + offsetSize + preloadSize
};
scrollXStore.visibleStartIndex = toVisibleIndex - 1;
scrollXStore.visibleEndIndex = toVisibleIndex + visibleSize + 1;
calculateMergerOffsetIndex(mergeBodyList.concat(mergeFooterList), mergeBodyRowMaps, offsetItem, 'col');
const { startIndex: offsetStartIndex, endIndex: offsetEndIndex } = offsetItem;
if (toVisibleIndex <= startIndex || toVisibleIndex >= endIndex - visibleSize - 1) {
if (startIndex !== offsetStartIndex || endIndex !== offsetEndIndex) {
scrollXStore.startIndex = offsetStartIndex;
scrollXStore.endIndex = offsetEndIndex;
$xeTable.updateScrollXData();
}
}
$xeTable.closeTooltip();
};
const parseColumns = (isReset) => {
// const { showOverflow } = props
// const rowOpts = computeRowOpts.value
const leftList = [];
const centerList = [];
const rightList = [];
const { isGroup, columnStore } = reactData;
const { collectColumn, tableFullColumn, scrollXStore, fullColumnIdData } = internalData;
// 如果是分组表头,如果子列全部被隐藏,则根列也隐藏
if (isGroup) {
const leftGroupList = [];
const centerGroupList = [];
const rightGroupList = [];
XEUtils.eachTree(collectColumn, (column, index, items, path, parentColumn) => {
const isColGroup = hasChildrenList(column);
// 如果是分组,必须按组设置固定列,不允许给子列设置固定
if (parentColumn && parentColumn.fixed) {
column.fixed = parentColumn.fixed;
}
if (parentColumn && (column.fixed || '') !== (parentColumn.fixed || '')) {
errLog$2('vxe.error.groupFixed');
}
if (isColGroup) {
column.visible = !!XEUtils.findTree(column.children, (subColumn) => hasChildrenList(subColumn) ? false : subColumn.visible);
}
else if (column.visible) {
if (column.fixed === 'left') {
leftList.push(column);
}
else if (column.fixed === 'right') {
rightList.push(column);
}
else {
centerList.push(column);
}
}
});
collectColumn.forEach((column) => {
if (column.visible) {
if (column.fixed === 'left') {
leftGroupList.push(column);
}
else if (column.fixed === 'right') {
rightGroupList.push(column);
}
else {
centerGroupList.push(column);
}
}
});
reactData.tableGroupColumn = leftGroupList.concat(centerGroupList).concat(rightGroupList);
}
else {
// 重新分配列
tableFullColumn.forEach((column) => {
if (column.visible) {
if (column.fixed === 'left') {
leftList.push(column);
}
else if (column.fixed === 'right') {
rightList.push(column);
}
else {
centerList.push(column);
}
}
});
}
const visibleColumn = leftList.concat(centerList).concat(rightList);
internalData.visibleColumn = visibleColumn;
updateColumnOffsetLeft();
const sXLoad = updateScrollXStatus();
reactData.hasFixedColumn = leftList.length > 0 || rightList.length > 0;
Object.assign(columnStore, { leftList, centerList, rightList });
if (sXLoad) {
// if (showOverflow) {
// if (!rowOpts.height) {
// const errColumn = internalData.tableFullColumn.find(column => column.showOverflow === false)
// if (errColumn) {
// errLog('vxe.error.errProp', [`column[field="${errColumn.field}"].show-overflow=false`, 'show-overflow=true'])
// }
// }
// }
// if (props.showHeader && !props.showHeaderOverflow) {
// warnLog('vxe.error.reqProp', ['show-header-overflow'])
// }
// if (props.showFooter && !props.showFooterOverflow) {
// warnLog('vxe.error.reqProp', ['show-footer-overflow'])
// }
if (props.spanMethod) {
warnLog$2('vxe.error.scrollErrProp', ['span-method']);
}
if (props.footerSpanMethod) {
warnLog$2('vxe.error.scrollErrProp', ['footer-span-method']);
}
if (isReset) {
const { visibleSize } = handleVirtualXVisible();
scrollXStore.startIndex = 0;
scrollXStore.endIndex = visibleSize;
scrollXStore.visibleSize = visibleSize;
scrollXStore.visibleStartIndex = 0;
scrollXStore.visibleEndIndex = visibleSize;
}
}
// 如果列被显示/隐藏,则清除合并状态
// 如果列被设置为固定,则清除合并状态
if (visibleColumn.length !== internalData.visibleColumn.length || !internalData.visibleColumn.every((column, index) => column === visibleColumn[index])) {
$xeTable.clearMergeCells();
$xeTable.clearMergeFooterItems();
}
visibleColumn.forEach((column, index) => {
const colid = column.id;
const colRest = fullColumnIdData[colid];
if (colRest) {
colRest._index = index;
}
});
handleTableColumn();
handleUpdateAggValues();
if (isReset) {
updateColumnOffsetLeft();
return $xeTable.updateFooter().then(() => {
return $xeTable.recalculate();
}).then(() => {
$xeTable.updateCellAreas();
return $xeTable.recalculate();
});
}
return $xeTable.updateFooter();
};
const initColumnHierarchy = () => {
const { collectColumn } = internalData;
const fullColIdData = {};
const fullColFieldData = {};
let sortIndex = 1;
XEUtils.eachTree(collectColumn, (column, index, items, path, parentColumn) => {
const { id: colid, field } = column;
const parentId = parentColumn ? parentColumn.id : null;
const rest = { $index: -1, _index: -1, column, colid, index, items, parent: parentColumn || null, width: 0, oLeft: 0 };
column.parentId = parentId;
column.defaultParentId = parentId;
column.sortNumber = sortIndex;
column.renderSortNumber = sortIndex;
sortIndex++;
if (field) {
if (fullColFieldData[field]) {
errLog$2('vxe.error.colRepet', ['field', field]);
}
fullColFieldData[field] = rest;
}
fullColIdData[colid] = rest;
});
internalData.fullColumnIdData = fullColIdData;
internalData.fullColumnFieldData = fullColFieldData;
};
const buildColumnInfo = () => {
const { scrollXLoad, scrollYLoad, expandColumn } = reactData;
const expandOpts = computeExpandOpts.value;
cacheColumnMap();
parseColumns(true).then(() => {
if (reactData.scrollXLoad) {
loadScrollXData();
}
});
$xeTable.clearHeaderFormatterCache();
$xeTable.clearMergeCells();
$xeTable.clearMergeFooterItems();
$xeTable.handleTableData(true);
$xeTable.handleAggregateSummaryData();
if ((scrollXLoad || scrollYLoad) && (expandColumn && expandOpts.mode !== 'fixed')) {
warnLog$2('vxe.error.scrollErrProp', ['column.type=expand']);
}
return nextTick().then(() => {
if ($xeToolbar) {
$xeToolbar.syncUpdate({
collectColumn: internalData.collectColumn,
$table: $xeTable
});
}
if ($xeTable.handleUpdateCustomColumn) {
$xeTable.handleUpdateCustomColumn();
}
const columnOpts = computeColumnOpts.value;
if (props.showCustomHeader && reactData.isGroup && (columnOpts.resizable || props.resizable)) {
warnLog$2('vxe.error.notConflictProp', ['show-custom-header & colgroup', 'column-config.resizable=false']);
}
reactData.isColLoading = false;
return handleLazyRecalculate(false, true, true);
});
};
const handleInitColumn = (collectColumn) => {
internalData.collectColumn = collectColumn;
const tFullColumn = getColumnList(collectColumn);
internalData.tableFullColumn = tFullColumn;
reactData.updateColFlag++;
reactData.isColLoading = true;
initColumnHierarchy();
return Promise.resolve(restoreCustomStorage()).then(() => {
return buildColumnInfo();
});
};
const updateScrollXStatus = (fullColumn) => {
const virtualXOpts = computeVirtualXOpts.value;
const allCols = internalData.tableFullColumn;
// 如果gt为0,则总是启用
const scrollXLoad = !!virtualXOpts.enabled && virtualXOpts.gt > -1 && (virtualXOpts.gt === 0 || virtualXOpts.gt < allCols.length);
reactData.scrollXLoad = scrollXLoad;
return scrollXLoad;
};
const syncGanttScrollYStatus = () => {
const $xeGanttView = internalData.xeGanttView;
if ($xeGanttView && $xeGanttView.handleUpdateSYStatus) {
$xeGanttView.handleUpdateSYStatus(reactData.scrollYLoad);
}
};
const updateScrollYStatus = (fullData) => {
const { treeConfig } = props;
const virtualYOpts = computeVirtualYOpts.value;
const treeOpts = computeTreeOpts.value;
const { transform } = treeOpts;
const allList = fullData || internalData.tableFullData;
// 如果gt为0,则总是启用
let scrollYLoad = !!virtualYOpts.enabled && virtualYOpts.gt > -1 && (virtualYOpts.gt === 0 || virtualYOpts.gt < allList.length);
if (scrollYLoad && (treeConfig && !transform)) {
errLog$2('vxe.error.notSupportProp', ['[table] virtual-y-config.enabled=true', 'tree-config.transform=false', 'tree-config.transform=true']);
scrollYLoad = false;
}
reactData.scrollYLoad = scrollYLoad;
syncGanttScrollYStatus();
return scrollYLoad;
};
/**
* 展开与收起树节点
* @param rows
* @param expanded
* @returns
*/
const handleBaseTreeExpand = (rows, expanded) => {
const { treeNodeColumn } = reactData;
const { fullAllDataRowIdData, tableFullTreeData, treeExpandedMaps, treeExpandLazyLoadedMaps } = internalData;
const treeOpts = computeTreeOpts.value;
const { reserve, lazy, accordion, toggleMethod } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
const hasChildField = treeOpts.hasChild || treeOpts.hasChildField;
const result = [];
const columnIndex = $xeTable.getColumnIndex(treeNodeColumn);
const $columnIndex = $xeTable.getVMColumnIndex(treeNodeColumn);
const _columnIndex = $xeTable.getVTColumnIndex(treeNodeColumn);
const { handleGetRowId } = createHandleGetRowId($xeTable);
let validRows = toggleMethod ? rows.filter((row) => toggleMethod({ $table: $xeTable, expanded, column: treeNodeColumn, columnIndex, $columnIndex, _columnIndex, row })) : rows;
if (accordion) {
validRows = validRows.length ? [validRows[validRows.length - 1]] : [];
// 同一级只能展开一个
const matchObj = XEUtils.findTree(tableFullTreeData, item => item === validRows[0], { children: childrenField });
if (matchObj) {
matchObj.items.forEach(item => {
const rowid = handleGetRowId(item);
if (treeExpandedMaps[rowid]) {
delete treeExpandedMaps[rowid];
}
});
}
}
if (expanded) {
validRows.forEach((row) => {
const rowid = handleGetRowId(row);
if (!treeExpandedMaps[rowid]) {
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
const isLoad = lazy && row[hasChildField] && !rowRest.treeLoaded && !treeExpandLazyLoadedMaps[rowid];
// 是否使用懒加载
if (isLoad) {
result.push(handleAsyncTreeExpandChilds(row));
}
else {
if (row[childrenField] && row[childrenField].length) {
treeExpandedMaps[rowid] = row;
}
}
}
}
});
}
else {
validRows.forEach(item => {
const rowid = handleGetRowId(item);
if (treeExpandedMaps[rowid]) {
delete treeExpandedMaps[rowid];
}
});
}
if (reserve) {
validRows.forEach((row) => handleTreeExpandReserve(row, expanded));
}
reactData.treeExpandedFlag++;
return Promise.all(result).then(() => {
updateTreeLineStyle();
return $xeTable.recalculate();
});
};
/**
* 虚拟树的展开与收起
* @param rows
* @param expanded
* @returns
*/
const handleVirtualTreeExpand = (rows, expanded) => {
const { lastScrollLeft, lastScrollTop } = internalData;
return handleBaseTreeExpand(rows, expanded).then(() => {
handleVirtualTreeToList();
$xeTable.handleTableData();
reactData.treeExpandedFlag++;
updateAfterDataIndex();
return nextTick();
}).then(() => {
return handleRecalculateStyle(true, true, true);
}).then(() => {
restoreScrollLocation($xeTable, lastScrollLeft, lastScrollTop);
updateTreeLineStyle();
setTimeout(() => {
$xeTable.updateCellAreas();
}, 30);
});
};
/**
* 展开与收起行分组节点
* @param rows
* @param expanded
* @returns
*/
const handleRowGroupBaseExpand = (rows, expanded) => {
const { fullAllDataRowIdData, tableFullGroupData, rowGroupExpandedMaps } = internalData;
const aggregateOpts = computeAggregateOpts.value;
const { mapChildrenField, accordion } = aggregateOpts;
const { handleGetRowId } = createHandleGetRowId($xeTable);
let validRows = rows;
if (mapChildrenField) {
if (accordion) {
validRows = validRows.length ? [validRows[validRows.length - 1]] : [];
// 同一级只能展开一个
const matchObj = XEUtils.findTree(tableFullGroupData, item => getRowid($xeTable, item) === getRowid($xeTable, validRows[0]), { children: mapChildrenField });
if (matchObj) {
matchObj.items.forEach(item => {
const rowid = handleGetRowId(item);
if (rowGroupExpandedMaps[rowid]) {
delete rowGroupExpandedMaps[rowid];
}
});
}
}
if (expanded) {
validRows.forEach((row) => {
const rowid = handleGetRowId(row);
if (!rowGroupExpandedMaps[rowid]) {
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
if (row[mapChildrenField] && row[mapChildrenField].length) {
rowGroupExpandedMaps[rowid] = row;
}
}
}
});
}
else {
validRows.forEach(item => {
const rowid = handleGetRowId(item);
if (rowGroupExpandedMaps[rowid]) {
delete rowGroupExpandedMaps[rowid];
}
});
}
}
reactData.rowGroupExpandedFlag++;
return $xeTable.recalculate();
};
/**
* 行分组的展开与收起
* @param rows
* @param expanded
* @returns
*/
const handleRowGroupVirtualExpand = (rows, expanded) => {
return handleRowGroupBaseExpand(rows, expanded).then(() => {
handleVirtualTreeToList();
$xeTable.handleTableData();
reactData.rowGroupExpandedFlag++;
updateAfterDataIndex();
return nextTick();
}).then(() => {
return handleLazyRecalculate(true, true, true);
}).then(() => {
setTimeout(() => {
$xeTable.updateCellAreas();
}, 30);
});
};
/**
* 处理默认展开分组行
*/
const handleDefaultRowGroupExpand = () => {
const { isRowGroupStatus } = reactData;
if (isRowGroupStatus) {
const aggregateOpts = computeAggregateOpts.value;
const { expandAll, expandGroupFields } = aggregateOpts;
if (expandAll) {
$xeTable.setAllRowGroupExpand(true);
}
else if (expandGroupFields && expandGroupFields.length) {
$xeTable.setRowGroupExpandByField(expandGroupFields, true);
}
}
};
const handleCheckAllEvent = (evnt, value) => {
handleCheckedAllCheckboxRow(value);
if (evnt) {
dispatchEvent('checkbox-all', {
records: () => $xeTable.getCheckboxRecords(),
reserves: () => $xeTable.getCheckboxReserveRecords(),
indeterminates: () => $xeTable.getCheckboxIndeterminateRecords(),
checked: value
}, evnt);
}
};
/**
* 纵向 Y 可视渲染处理
*/
const loadScrollYData = () => {
const { isAllOverflow, isScrollYBig } = reactData;
const { mergeBodyList, mergeBodyColMaps, scrollYStore } = internalData;
const { preloadSize, startIndex, endIndex, offsetSize } = scrollYStore;
const autoOffsetYSize = isAllOverflow ? offsetSize : offsetSize + 1;
const { toVisibleIndex, visibleSize } = handleVirtualYVisible();
const offsetItem = {
startIndex: Math.max(0, isScrollYBig ? toVisibleIndex - 1 : toVisibleIndex - 1 - offsetSize - preloadSize),
endIndex: isScrollYBig ? (toVisibleIndex + visibleSize) : (toVisibleIndex + visibleSize + autoOffsetYSize + preloadSize)
};
scrollYStore.visibleStartIndex = toVisibleIndex - 1;
scrollYStore.visibleEndIndex = toVisibleIndex + visibleSize + 1;
calculateMergerOffsetIndex(mergeBodyList, mergeBodyColMaps, offsetItem, 'row');
const { startIndex: offsetStartIndex, endIndex: offsetEndIndex } = offsetItem;
if (toVisibleIndex <= startIndex || toVisibleIndex >= endIndex - visibleSize - 1) {
if (startIndex !== offsetStartIndex || endIndex !== offsetEndIndex) {
scrollYStore.startIndex = offsetStartIndex;
scrollYStore.endIndex = offsetEndIndex;
$xeTable.updateScrollYData();
}
}
};
const createGetRowCacheProp = (prop) => {
return function (row) {
const { fullAllDataRowIdData } = internalData;
if (row) {
const rowid = getRowid($xeTable, row);
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
return rowRest[prop];
}
}
return -1;
};
};
const createGetColumnCacheProp = (prop) => {
return function (column) {
const { fullColumnIdData } = internalData;
if (column) {
const colRest = fullColumnIdData[column.id];
if (colRest) {
return colRest[prop];
}
}
return -1;
};
};
const lazyScrollXData = () => {
const { lxTimeout, lxRunTime, scrollXStore } = internalData;
const { visibleSize } = scrollXStore;
const fpsTime = visibleSize > 26 ? 26 : (visibleSize > 16 ? 14 : 6);
if (lxTimeout) {
clearTimeout(lxTimeout);
}
if (!lxRunTime || lxRunTime + fpsTime < Date.now()) {
internalData.lxRunTime = Date.now();
loadScrollXData();
}
internalData.lxTimeout = setTimeout(() => {
internalData.lxTimeout = undefined;
internalData.lxRunTime = undefined;
loadScrollXData();
}, fpsTime);
};
const lazyScrollYData = () => {
const { lyTimeout, lyRunTime, scrollYStore } = internalData;
const { visibleSize } = scrollYStore;
const fpsTime = visibleSize > 30 ? 32 : (visibleSize > 20 ? 18 : 8);
if (lyTimeout) {
clearTimeout(lyTimeout);
}
if (!lyRunTime || lyRunTime + fpsTime < Date.now()) {
internalData.lyRunTime = Date.now();
loadScrollYData();
}
internalData.lyTimeout = setTimeout(() => {
internalData.lyTimeout = undefined;
internalData.lyRunTime = undefined;
loadScrollYData();
}, fpsTime);
};
const handleSyncScroll = (isRollX, isRollY) => {
const { scrollXLoad, scrollYLoad, isAllOverflow } = reactData;
const autoWidthColumnList = computeAutoWidthColumnList.value;
internalData.lcsRunTime = Date.now();
internalData.lcsTimeout = undefined;
internalData.intoRunScroll = false;
internalData.inVirtualScroll = false;
internalData.inWheelScroll = false;
internalData.inHeaderScroll = false;
internalData.inBodyScroll = false;
internalData.inFooterScroll = false;
reactData.lazScrollLoading = false;
internalData.scrollRenderType = '';
let xRest = null;
let yRest = null;
if (!isAllOverflow) {
calcCellHeight();
updateRowOffsetTop();
}
if (isRollX && scrollXLoad) {
xRest = $xeTable.updateScrollXData();
}
if (isRollY && scrollYLoad) {
if (autoWidthColumnList.length) {
calcCellWidth();
}
yRest = $xeTable.updateScrollYData().then(() => {
if (autoWidthColumnList.length) {
calcCellWidth();
autoCellWidth();
}
if (!isAllOverflow) {
calcCellHeight();
updateRowOffsetTop();
}
return $xeTable.updateScrollYSpace();
});
}
updateRowExpandStyle();
return Promise.all([
xRest,
yRest,
scrollXLoad || scrollYLoad ? $xeTable.updateCellAreas() : null
]);
};
const checkLastSyncScroll = (isRollX, isRollY) => {
const { lcsTimeout } = internalData;
reactData.lazScrollLoading = true;
if (lcsTimeout) {
clearTimeout(lcsTimeout);
}
internalData.lcsTimeout = setTimeout(() => {
handleSyncScroll(isRollX, isRollY).then(() => {
if (reactData.scrollXLoad || reactData.scrollYLoad) {
nextTick(() => {
updateRowExpandStyle();
if (!internalData.lcsTimeout) {
handleSyncScroll(isRollX, isRollY);
}
});
}
});
}, 240);
};
const getWheelSpeed = (lastScrollTime) => {
let multiple = 1;
const currTime = Date.now();
if (lastScrollTime + 25 > currTime) {
multiple = 1.18;
}
else if (lastScrollTime + 30 > currTime) {
multiple = 1.15;
}
else if (lastScrollTime + 40 > currTime) {
multiple = 1.12;
}
else if (lastScrollTime + 55 > currTime) {
multiple = 1.09;
}
else if (lastScrollTime + 75 > currTime) {
multiple = 1.06;
}
else if (lastScrollTime + 100 > currTime) {
multiple = 1.03;
}
return multiple;
};
const syncGanttScrollTop = (scrollTop) => {
const $xeGanttView = internalData.xeGanttView;
if ($xeGanttView) {
const ganttInternalData = $xeGanttView.internalData;
const { elemStore: ganttElemStore } = ganttInternalData;
const ganttBodyScrollElem = getRefElem(ganttElemStore['main-body-scroll']);
if (ganttBodyScrollElem) {
ganttBodyScrollElem.scrollTop = scrollTop;
}
}
};
const dispatchEvent = (type, params, evnt) => {
emit(type, createEvent$2(evnt, { $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt }, params));
};
const handleScrollToRowColumn = (fieldOrColumn, row, options) => {
const { fullColumnIdData } = internalData;
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (column && fullColumnIdData[column.id]) {
return colToVisible($xeTable, options ? options.colAlign !== false : true, column, row);
}
return nextTick();
};
const handleUpdateResize = () => {
const el = refElem.value;
if (el && el.clientWidth && el.clientHeight) {
$xeTable.recalculate();
}
};
const handleUpdateColResize = (evnt, params) => {
$xeTable.analyColumnWidth();
$xeTable.recalculate().then(() => {
$xeTable.saveCustomStore('update:width');
$xeTable.refreshScroll().then(() => {
$xeTable.updateCellAreas();
});
$xeTable.dispatchEvent('column-resizable-change', params, evnt);
// 已废弃 resizable-change
$xeTable.dispatchEvent('resizable-change', params, evnt);
setTimeout(() => {
$xeTable.recalculate(true);
}, 300);
});
};
const handleUpdateRowResize = (evnt, params) => {
reactData.resizeHeightFlag++;
$xeTable.recalculate().then(() => {
$xeTable.refreshScroll().then(() => {
$xeTable.updateCellAreas();
});
$xeTable.dispatchEvent('row-resizable-change', params, evnt);
setTimeout(() => {
$xeTable.recalculate(true);
}, 300);
});
};
const updateColumnOffsetLeft = () => {
const { visibleColumn, fullColumnIdData } = internalData;
const el = refElem.value;
if (!el || !el.clientWidth) {
return;
}
let offsetLeft = 0;
for (let cIndex = 0, rLen = visibleColumn.length; cIndex < rLen; cIndex++) {
const column = visibleColumn[cIndex];
const colid = column.id;
const colRest = fullColumnIdData[colid];
if (colRest) {
colRest.oLeft = offsetLeft;
}
offsetLeft += column.renderWidth;
}
};
const updateRowOffsetTop = () => {
const { expandColumn } = reactData;
const { afterFullData, fullAllDataRowIdData, rowExpandedMaps } = internalData;
const el = refElem.value;
if (!el || !el.clientWidth) {
return;
}
const expandOpts = computeExpandOpts.value;
const rowOpts = computeRowOpts.value;
const cellOpts = computeCellOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const { handleGetRowId } = createHandleGetRowId($xeTable);
let offsetTop = 0;
for (let rIndex = 0, rLen = afterFullData.length; rIndex < rLen; rIndex++) {
const row = afterFullData[rIndex];
const rowid = handleGetRowId(row);
const rowRest = fullAllDataRowIdData[rowid] || {};
rowRest.oTop = offsetTop;
offsetTop += getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight);
// 是否展开行
if (expandColumn && rowExpandedMaps[rowid]) {
offsetTop += rowRest.expandHeight || expandOpts.height || 0;
}
}
};
/**
* 更新展开行样式
*/
const updateRowExpandStyle = () => {
const { expandColumn, scrollYLoad, scrollYTop, isScrollYBig } = reactData;
const el = refElem.value;
if (!el || !el.clientWidth) {
return;
}
const expandOpts = computeExpandOpts.value;
const { mode } = expandOpts;
if (expandColumn && mode === 'fixed') {
const { elemStore, fullAllDataRowIdData } = internalData;
const rowOpts = computeRowOpts.value;
const cellOpts = computeCellOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const rowExpandEl = refRowExpandElem.value;
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
if (rowExpandEl && bodyScrollElem) {
let isUpdateHeight = false;
XEUtils.arrayEach(rowExpandEl.children, reEl => {
const expandEl = reEl;
const rowid = expandEl.getAttribute('rowid') || '';
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
const expandHeight = expandEl.offsetHeight;
const trEl = bodyScrollElem.querySelector(`.vxe-body--row[rowid="${rowid}"]`);
let offsetTop = 0;
if (scrollYLoad) {
if (isScrollYBig && trEl) {
offsetTop = trEl.offsetTop + trEl.offsetHeight;
}
else {
offsetTop = rowRest.oTop + getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight);
}
}
else {
if (trEl) {
offsetTop = trEl.offsetTop + trEl.offsetHeight;
}
}
if (isScrollYBig) {
offsetTop += scrollYTop;
}
expandEl.style.top = toCssUnit(offsetTop);
if (!isUpdateHeight) {
if (rowRest.expandHeight !== expandHeight) {
isUpdateHeight = true;
}
}
rowRest.expandHeight = expandHeight;
}
});
if (isUpdateHeight) {
reactData.rowExpandHeightFlag++;
nextTick(() => {
updateRowOffsetTop();
});
}
}
}
};
/**
* 更新树连接线样式
*/
const updateTreeLineStyle = () => {
const { treeConfig } = props;
if (!treeConfig) {
return;
}
const { tableData } = reactData;
const { fullAllDataRowIdData, treeExpandedMaps } = internalData;
const el = refElem.value;
if (!el || !el.clientWidth) {
return;
}
const cellOpts = computeCellOpts.value;
const rowOpts = computeRowOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const treeOpts = computeTreeOpts.value;
const { transform, mapChildrenField } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
const { handleGetRowId } = createHandleGetRowId($xeTable);
const expParentList = [];
const handleNodeRow = (row, rIndex, rows) => {
const rowid = handleGetRowId(row);
const rowRest = fullAllDataRowIdData[rowid] || {};
const childList = row[transform ? mapChildrenField : childrenField];
const prevRow = rows[rIndex - 1] || null;
const nextRow = rows[rIndex + 1] || null;
if (childList && childList.length && treeExpandedMaps[rowid]) {
expParentList.push({ row, prevRow, nextRow });
childList.forEach((childRow, crIndex) => {
const childRowid = handleGetRowId(childRow);
if (treeExpandedMaps[childRowid]) {
handleNodeRow(childRow, crIndex, childList);
}
});
}
else {
if (nextRow) {
const nextRowid = handleGetRowId(nextRow);
const nextRowRest = fullAllDataRowIdData[nextRowid] || {};
const currCellHeight = getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight);
const nextCellHeight = getCellRestHeight(nextRowRest, cellOpts, rowOpts, defaultRowHeight);
rowRest.oHeight = currCellHeight;
rowRest.lineHeight = Math.floor(currCellHeight / 2 + nextCellHeight / 2);
}
else {
rowRest.oHeight = 0;
rowRest.lineHeight = 0;
}
}
};
tableData.forEach((row, rIndex) => {
handleNodeRow(row, rIndex, tableData);
});
XEUtils.lastArrayEach(expParentList, ({ row, nextRow }) => {
const rowid = handleGetRowId(row);
const childList = row[transform ? mapChildrenField : childrenField];
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
const currCellHeight = getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight);
let countOffsetHeight = currCellHeight;
let countLineHeight = 0;
childList.forEach((childRow) => {
const childRowid = handleGetRowId(childRow);
const childRowRest = fullAllDataRowIdData[childRowid] || {};
const childList = childRow[transform ? mapChildrenField : childrenField];
if (treeExpandedMaps[childRowid] && childList && childList.length) {
countOffsetHeight += (childRowRest.oHeight || 0);
countLineHeight += (childRowRest.oHeight || 0);
}
else {
const cellHeight = getCellRestHeight(childRowRest, cellOpts, rowOpts, defaultRowHeight);
childRowRest.oHeight = cellHeight;
childRowRest.lineHeight = cellHeight;
countOffsetHeight += cellHeight;
countLineHeight += cellHeight;
}
});
if (nextRow) {
const nextRowid = handleGetRowId(nextRow);
const nextRowRest = fullAllDataRowIdData[nextRowid] || {};
const currCellHeight = getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight);
const nextCellHeight = getCellRestHeight(nextRowRest, cellOpts, rowOpts, defaultRowHeight);
countOffsetHeight += currCellHeight;
countLineHeight += Math.floor(currCellHeight / 2 + nextCellHeight / 2);
}
rowRest.lineHeight = countLineHeight;
rowRest.oHeight = countOffsetHeight;
}
});
};
const handleRowExpandScroll = () => {
const { elemStore } = internalData;
const rowExpandEl = refRowExpandElem.value;
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
if (rowExpandEl && bodyScrollElem) {
rowExpandEl.scrollTop = bodyScrollElem.scrollTop;
}
};
const handleColumnVisible = (visible) => {
return function (fieldOrColumn) {
let status = false;
const cols = XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : [fieldOrColumn];
cols.forEach(item => {
const column = handleFieldOrColumn($xeTable, item);
if (column) {
if (column.children && column.children.length) {
XEUtils.eachTree([column], (item) => {
item.visible = visible;
item.renderVisible = visible;
});
}
else {
column.visible = visible;
column.renderVisible = visible;
}
if (!status) {
status = true;
}
}
});
if (status) {
return $xeTable.handleCustom();
}
return nextTick();
};
};
tableMethods = {
dispatchEvent,
getEl() {
return refElem.value;
},
/**
* 重置表格的一切数据状态
*/
clearAll() {
return clearTableAllStatus($xeTable);
},
/**
* 同步 data 数据(即将废弃)
* 如果用了该方法,那么组件将不再记录增删改的状态,只能自行实现对应逻辑
* 对于某些特殊的场景,比如深层树节点元素发生变动时可能会用到
*/
syncData() {
errLog$2('vxe.error.delFunc', ['syncData', 'getData']);
return nextTick().then(() => {
reactData.tableData = [];
emit('update:data', internalData.tableFullData);
return nextTick();
});
},
/**
* 手动处理数据,用于手动排序与筛选
* 对于手动更改了排序、筛选...等条件后需要重新处理数据时可能会用到
*/
updateData() {
const { scrollXLoad, scrollYLoad } = reactData;
return $xeTable.handleTableData(true).then(() => {
$xeTable.updateFooter();
if (scrollXLoad || scrollYLoad) {
if (scrollXLoad) {
$xeTable.updateScrollXSpace();
}
if (scrollYLoad) {
$xeTable.updateScrollYSpace();
}
return $xeTable.refreshScroll();
}
}).then(() => {
$xeTable.updateCellAreas();
return handleLazyRecalculate(true, true, true);
}).then(() => {
// 存在滚动行为未结束情况
setTimeout(() => handleLazyRecalculate(false, true, true), 50);
});
},
/**
* 重新加载数据,不会清空表格状态
* @param {Array} datas 数据
*/
loadData(datas) {
const { initStatus } = internalData;
return loadTableData(datas, false, false).then(() => {
internalData.inited = true;
internalData.initStatus = true;
if (!initStatus) {
handleLoadDefaults();
}
return handleLazyRecalculate(false, true, true);
});
},
/**
* 重新加载数据,会清空表格状态
* @param {Array} datas 数据
*/
reloadData(datas) {
return $xeTable.clearAll()
.then(() => {
internalData.inited = true;
internalData.initStatus = true;
return loadTableData(datas, true, true);
}).then(() => {
handleLoadDefaults();
return handleLazyRecalculate(false, true, true);
});
},
/**
* 修改行数据
*/
setRow(rows, record) {
if (rows && record) {
let rest = rows;
if (!XEUtils.isArray(rows)) {
rest = [rows];
}
const rowkey = getRowkey($xeTable);
rest.forEach(row => {
const rowid = getRowid($xeTable, row);
const newRecord = XEUtils.clone(Object.assign({}, record), true);
XEUtils.set(newRecord, rowkey, rowid);
Object.assign(row, newRecord);
});
}
return nextTick();
},
/**
* 局部加载行数据并恢复到初始状态
* 对于行数据需要局部更改的场景中可能会用到
* @param {Row} row 行对象
* @param {Object} record 新数据
* @param {String} field 字段名
*/
reloadRow(row, record, field) {
const { keepSource } = props;
const { tableData } = reactData;
const { sourceDataRowIdData } = internalData;
if (keepSource) {
if ($xeTable.isAggregateRecord(row)) {
return nextTick();
}
const rowkey = getRowkey($xeTable);
const rowid = XEUtils.get(row, rowkey);
const oRow = sourceDataRowIdData[rowid];
if (oRow && row) {
if (field) {
const newValue = XEUtils.clone(XEUtils.get(record || row, field), true);
XEUtils.set(row, field, newValue);
XEUtils.set(oRow, field, newValue);
}
else {
const newRecord = XEUtils.clone(Object.assign({}, record), true);
XEUtils.set(newRecord, rowkey, rowid);
XEUtils.destructuring(oRow, Object.assign(row, newRecord));
}
}
reactData.tableData = tableData.slice(0);
}
else {
errLog$2('vxe.error.reqProp', ['keep-source']);
}
return nextTick();
},
getParams() {
return props.params;
},
/**
* 用于树结构,给行数据加载子节点
*/
loadTreeChildren(row, childRecords) {
const { keepSource } = props;
const { tableSourceData, fullDataRowIdData, fullAllDataRowIdData, sourceDataRowIdData } = internalData;
const treeOpts = computeTreeOpts.value;
const { transform, mapChildrenField } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
const parentRest = fullAllDataRowIdData[getRowid($xeTable, row)];
const parentLevel = parentRest ? parentRest.level : 0;
return $xeTable.createData(childRecords).then((rows) => {
if (keepSource) {
const rowid = getRowid($xeTable, row);
const matchObj = XEUtils.findTree(tableSourceData, (item) => rowid === getRowid($xeTable, item), { children: childrenField });
if (matchObj) {
matchObj.item[childrenField] = XEUtils.clone(rows, true);
}
rows.forEach(childRow => {
const rowid = getRowid($xeTable, childRow);
sourceDataRowIdData[rowid] = XEUtils.clone(childRow, true);
});
}
XEUtils.eachTree(rows, (childRow, index, items, path, parentItem, nodes) => {
const rowid = getRowid($xeTable, childRow);
const parentRow = parentItem || parentRest.row;
const rest = { row: childRow, rowid, _seq: -1, seq: -1, index, _index: -1, $index: -1, treeIndex: -1, _tIndex: -1, items, parent: parentRow, level: parentLevel + nodes.length, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 };
fullDataRowIdData[rowid] = rest;
fullAllDataRowIdData[rowid] = rest;
}, { children: childrenField });
row[childrenField] = rows;
if (transform) {
row[mapChildrenField] = XEUtils.clone(rows, false);
}
updateAfterDataIndex();
return rows;
});
},
/**
* 加载列配置
* 对于表格列需要重载、局部递增场景下可能会用到
* @param {ColumnInfo} columns 列配置
*/
loadColumn(columns) {
const { lastScrollLeft, lastScrollTop } = internalData;
const collectColumn = XEUtils.mapTree(columns, column => reactive(Cell.createColumn($xeTable, column)));
return handleInitColumn(collectColumn).then(() => {
let targetScrollLeft = lastScrollLeft;
let targetScrollTop = lastScrollTop;
const virtualXOpts = computeVirtualXOpts.value;
const virtualYOpts = computeVirtualYOpts.value;
// 是否在更新数据之后自动滚动重置滚动条
if (virtualXOpts.scrollToLeftOnChange) {
targetScrollLeft = 0;
}
if (virtualYOpts.scrollToTopOnChange) {
targetScrollTop = 0;
}
restoreScrollLocation($xeTable, targetScrollLeft, targetScrollTop);
});
},
/**
* 加载列配置并恢复到初始状态
* 对于表格列需要重载、局部递增场景下可能会用到
* @param {ColumnInfo} columns 列配置
*/
reloadColumn(columns) {
return $xeTable.clearAll().then(() => {
return $xeTable.loadColumn(columns);
});
},
/**
* 根据 tr 元素获取对应的 row 信息
* @param {Element} tr 元素
*/
getRowNode(tr) {
if (tr) {
const { fullAllDataRowIdData } = internalData;
const rowid = tr.getAttribute('rowid');
if (rowid) {
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
return {
rowid: rowRest.rowid,
item: rowRest.row,
index: rowRest.index,
items: rowRest.items,
parent: rowRest.parent
};
}
}
}
return null;
},
/**
* 根据 th/td 元素获取对应的 column 信息
* @param {Element} cell 元素
*/
getColumnNode(cell) {
if (cell) {
const { fullColumnIdData } = internalData;
const colid = cell.getAttribute('colid');
if (colid) {
const colRest = fullColumnIdData[colid];
if (colRest) {
return {
colid: colRest.colid,
item: colRest.column,
index: colRest.index,
items: colRest.items,
parent: colRest.parent
};
}
}
}
return null;
},
/**
* 根据 row 获取序号
* @param {Row} row 行对象
*/
getRowSeq: createGetRowCacheProp('seq'),
/**
* 根据 row 获取相对于 data 中的索引
* @param {Row} row 行对象
*/
getRowIndex: createGetRowCacheProp('index'),
/**
* 根据 row 获取相对于当前数据中的索引
* @param {Row} row 行对象
*/
getVTRowIndex: createGetRowCacheProp('_index'),
/**
* 根据 row 获取渲染中的虚拟索引
* @param {Row} row 行对象
*/
getVMRowIndex: createGetRowCacheProp('$index'),
/**
* 根据 column 获取相对于 columns 中的索引
* @param {ColumnInfo} column 列配置
*/
getColumnIndex: createGetColumnCacheProp('index'),
/**
* 根据 column 获取相对于当前表格列中的索引
* @param {ColumnInfo} column 列配置
*/
getVTColumnIndex: createGetColumnCacheProp('_index'),
/**
* 根据 column 获取渲染中的虚拟索引
* @param {ColumnInfo} column 列配置
*/
getVMColumnIndex: createGetColumnCacheProp('$index'),
/**
* 创建 data 对象
* 对于某些特殊场景可能会用到,会自动对数据的字段名进行检测,如果不存在就自动定义
* @param {Array} records 新数据
*/
createData(records) {
return nextTick().then(() => {
return reactive($xeTable.defineField(records));
});
},
/**
* 创建 Row|Rows 对象
* 对于某些特殊场景需要对数据进行手动插入时可能会用到
* @param {Array/Object} records 新数据
*/
createRow(records) {
const isArr = XEUtils.isArray(records);
if (!isArr) {
records = [records || {}];
}
return $xeTable.createData(records).then((rows) => isArr ? rows : rows[0]);
},
/**
* 还原数据
* 如果不传任何参数,则还原整个表格
* 如果传 row 则还原一行
* 如果传 rows 则还原多行
* 如果还额外传了 field 则还原指定的单元格数据
*/
revertData(rows, field) {
const { keepSource, treeConfig } = props;
const { fullAllDataRowIdData, fullDataRowIdData, tableSourceData, sourceDataRowIdData, tableFullData, afterFullData, removeRowMaps } = internalData;
const treeOpts = computeTreeOpts.value;
const { transform } = treeOpts;
const { handleGetRowId } = createHandleGetRowId($xeTable);
if (!keepSource) {
errLog$2('vxe.error.reqProp', ['keep-source']);
return nextTick();
}
let targetRows = rows;
if (rows) {
if (!XEUtils.isArray(rows)) {
targetRows = [rows];
}
}
else {
targetRows = XEUtils.toArray($xeTable.getUpdateRecords());
}
let reDelFlag = false;
if (targetRows.length) {
targetRows.forEach((item) => {
const rowid = handleGetRowId(item);
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
const row = rowRest.row;
if (!$xeTable.isInsertByRow(row)) {
const oRow = sourceDataRowIdData[rowid];
if (oRow && row) {
if (field) {
XEUtils.set(row, field, XEUtils.clone(XEUtils.get(oRow, field), true));
}
else {
XEUtils.destructuring(row, XEUtils.clone(oRow, true));
}
if (!fullDataRowIdData[rowid] && $xeTable.isRemoveByRow(row)) {
if (removeRowMaps[rowid]) {
delete removeRowMaps[rowid];
}
tableFullData.unshift(row);
afterFullData.unshift(row);
reDelFlag = true;
}
}
}
}
});
}
if (rows) {
if (reDelFlag) {
reactData.removeRowFlag++;
$xeTable.updateFooter();
$xeTable.cacheRowMap(false);
$xeTable.handleTableData(treeConfig && transform);
if (!(treeConfig && transform)) {
$xeTable.updateAfterDataIndex();
}
$xeTable.checkSelectionStatus();
if (reactData.scrollYLoad) {
$xeTable.updateScrollYSpace();
}
}
return nextTick().then(() => {
$xeTable.updateCellAreas();
return handleLazyRecalculate(false, true, true);
});
}
return $xeTable.reloadData(tableSourceData);
},
/**
* 清空单元格内容
* 如果不创参数,则清空整个表格内容
* 如果传 row 则清空一行内容
* 如果传 rows 则清空多行内容
* 如果还额外传了 field 则清空指定单元格内容
* @param {Array/Row} rows 行数据
* @param {String} field 字段名
*/
clearData(rows, field) {
const { tableFullData, visibleColumn } = internalData;
if (!arguments.length) {
rows = tableFullData;
}
else if (rows && !XEUtils.isArray(rows)) {
rows = [rows];
}
if (field) {
rows.forEach((row) => XEUtils.set(row, field, null));
}
else {
rows.forEach((row) => {
visibleColumn.forEach((column) => {
if (column.field) {
setCellValue(row, column, null);
}
});
});
}
return nextTick();
},
effectCellData(row, column, options) {
const { fullCellStoreMaps } = internalData;
const editOpts = computeEditOpts.value;
const { key, isChanged, setValue, getResult } = options;
const rowid = getRowid($xeTable, row);
const colid = column.id;
let rowStore = fullCellStoreMaps[rowid];
const cellValue = XEUtils.get(row, column.field);
const restParams = {
$table: $xeTable,
row,
rowid,
column,
colid,
cellValue,
oldValue: null
};
if (editOpts.cache === false && key === 'render_table_cell') {
const rest = restParams;
rest.cellResult = getResult ? getResult(restParams) : cellValue;
return rest;
}
if (!rowStore) {
rowStore = {};
fullCellStoreMaps[rowid] = rowStore;
}
let cellStore = rowStore[colid];
if (!cellStore) {
cellStore = {
value: undefined,
result: {}
};
rowStore[colid] = cellStore;
}
const restData = rowStore[colid];
const oldValue = restData.value;
restParams.oldValue = oldValue;
if (isChanged ? !isChanged(restParams) : oldValue !== cellValue) {
restData.value = setValue ? setValue(restParams) : cellValue;
restData.result = {};
}
const storeData = restData.result;
if (XEUtils.isUndefined(storeData[key])) {
storeData[key] = getResult ? getResult(restParams) : cellValue;
}
const cellResult = storeData[key];
const rest = restParams;
rest.cellResult = cellResult;
return rest;
},
getCellElement(row, fieldOrColumn) {
const { elemStore } = internalData;
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (!column) {
return null;
}
const rowid = getRowid($xeTable, row);
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const leftScrollElem = getRefElem(elemStore['left-body-scroll']);
const rightScrollElem = getRefElem(elemStore['right-body-scroll']);
let bodyElem;
if (column) {
if (column.fixed) {
if (column.fixed === 'left') {
if (leftScrollElem) {
bodyElem = leftScrollElem;
}
}
else {
if (rightScrollElem) {
bodyElem = rightScrollElem;
}
}
}
if (!bodyElem) {
bodyElem = bodyScrollElem;
}
if (bodyElem) {
return bodyElem.querySelector(`.vxe-body--row[rowid="${rowid}"] .${column.id}`);
}
}
return null;
},
getCellLabel(row, fieldOrColumn) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (!column) {
return null;
}
const { editConfig } = props;
const { formatter, editRender, cellRender } = column;
let etOpSize = null;
let etOgSize = null;
let clOpSize = null;
let clOgSize = null;
if (editRender) {
etOpSize = editRender.options ? editRender.options.length : 0;
etOgSize = editRender.optionGroups ? editRender.optionGroups.length : 0;
}
if (cellRender) {
clOpSize = cellRender.options ? cellRender.options.length : 0;
clOgSize = cellRender.optionGroups ? cellRender.optionGroups.length : 0;
}
// formatter > tableCellFormatter
const renderOpts = formatter ? null : (editConfig && isEnableConf(editRender) ? editRender : (isEnableConf(cellRender) ? cellRender : null));
const compConf = renderOpts ? renderer$1.get(renderOpts.name) : null;
const tcFormatter = compConf ? compConf.tableCellFormatter : null;
const cellValue = getCellValue(row, column);
let cellLabel = cellValue;
if (formatter || tcFormatter) {
let formatData;
const { fullAllDataRowIdData } = internalData;
const rowid = getRowid($xeTable, row);
const colid = column.id;
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
formatData = rowRest.formatData;
if (!formatData) {
formatData = fullAllDataRowIdData[rowid].formatData = {};
}
if (rowRest && formatData[colid]) {
const ftValue = formatData[colid].value;
if (ftValue && ftValue[0] === cellValue && ftValue[1] === etOpSize && ftValue[2] === etOgSize && ftValue[3] === clOpSize && ftValue[4] === clOgSize) {
return formatData[colid].label;
}
}
}
const formatParams = {
$table: $xeTable,
cellValue,
row,
rowIndex: $xeTable.getRowIndex(row),
column,
columnIndex: $xeTable.getColumnIndex(column)
};
if (formatter) {
if (XEUtils.isString(formatter)) {
const gFormatOpts = formats.get(formatter);
const tcFormatMethod = gFormatOpts ? (gFormatOpts.tableCellFormatMethod || gFormatOpts.cellFormatMethod) : null;
cellLabel = tcFormatMethod ? tcFormatMethod(formatParams) : '';
}
else if (XEUtils.isArray(formatter)) {
const gFormatOpts = formats.get(formatter[0]);
const tcFormatMethod = gFormatOpts ? (gFormatOpts.tableCellFormatMethod || gFormatOpts.cellFormatMethod) : null;
cellLabel = tcFormatMethod ? tcFormatMethod(formatParams, ...formatter.slice(1)) : '';
}
else {
cellLabel = formatter(formatParams);
}
}
else if (renderOpts && tcFormatter) {
cellLabel = tcFormatter(renderOpts, formatParams);
}
if (formatData) {
const ftValue = [cellValue, etOpSize, etOgSize, clOpSize, clOgSize];
formatData[colid] = { value: ftValue, label: cellLabel };
}
}
return cellLabel;
},
updateCellLabel(row, fieldOrColumn) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (!column) {
return null;
}
const { fullAllDataRowIdData } = internalData;
const rowid = getRowid($xeTable, row);
if (rowid) {
const colid = column.id;
const rowid = getRowid($xeTable, row);
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
const formatData = rowRest.formatData;
if (formatData) {
delete formatData[colid];
}
}
}
return $xeTable.getFooterCellLabel(row, column);
},
clearFormatterCache(isUpdate) {
const { tableData, tableColumn } = reactData;
const { fullAllDataRowIdData } = internalData;
XEUtils.each(fullAllDataRowIdData, (rowRest) => {
if (rowRest.formatData) {
rowRest.formatData = undefined;
}
});
if (isUpdate) {
tableData.forEach(row => {
tableColumn.forEach(column => {
$xeTable.getCellLabel(row, column);
});
});
}
return nextTick();
},
getHeaderCellLabel(fieldOrColumn) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (!column) {
return null;
}
const { headerFormatter } = column;
const _columnIndex = $xeTable.getVTColumnIndex(column);
let cellLabel = column.getTitle();
if (headerFormatter) {
const { headerFullDataColData } = internalData;
const colid = column.id;
let colRest = headerFullDataColData[colid];
if (!colRest) {
colRest = headerFullDataColData[colid] = {};
}
const formatObj = colRest.formatObj;
if (formatObj && formatObj.value === cellLabel) {
return formatObj.label;
}
const headFormatParams = {
$table: $xeTable,
cellTitle: cellLabel,
cellValue: cellLabel,
column,
_columnIndex,
columnIndex: $xeTable.getColumnIndex(column)
};
if (XEUtils.isString(headerFormatter)) {
const gFormatOpts = formats.get(headerFormatter);
const fcFormatMethod = gFormatOpts ? gFormatOpts.tableHeaderCellFormatMethod : null;
cellLabel = XEUtils.toValueString(fcFormatMethod ? fcFormatMethod(headFormatParams) : '');
}
else if (XEUtils.isArray(headerFormatter)) {
const gFormatOpts = formats.get(headerFormatter[0]);
const fcFormatMethod = gFormatOpts ? gFormatOpts.tableHeaderCellFormatMethod : null;
cellLabel = XEUtils.toValueString(fcFormatMethod ? fcFormatMethod(headFormatParams, ...headerFormatter.slice(1)) : '');
}
else {
cellLabel = XEUtils.toValueString(headerFormatter(headFormatParams));
}
}
return cellLabel;
},
updateHeaderCellLabel(fieldOrColumn) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (!column) {
return '';
}
const { headerFullDataColData } = internalData;
const colid = column.id;
const colRest = headerFullDataColData[colid];
if (colRest) {
colRest.formatObj = undefined;
}
return $xeTable.getHeaderCellLabel(column);
},
clearHeaderFormatterCache(isUpdate) {
const { tableColumn } = reactData;
const { headerFullDataColData } = internalData;
XEUtils.each(headerFullDataColData, (colRest) => {
if (colRest.formatObj) {
colRest.formatObj = undefined;
}
});
if (isUpdate) {
tableColumn.forEach(column => {
$xeTable.getHeaderCellLabel(column);
});
}
return nextTick();
},
getFooterCellLabel(row, fieldOrColumn) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (!column) {
return null;
}
const { footerFormatter } = column;
const _columnIndex = $xeTable.getVTColumnIndex(column);
let itemValue = '';
// 兼容老模式
if (XEUtils.isArray(row)) {
itemValue = row[_columnIndex];
}
else {
itemValue = XEUtils.get(row, column.field);
}
let cellLabel = itemValue;
if (footerFormatter) {
let formatData;
const { footerTableData } = reactData;
const { footerFullDataRowData } = internalData;
const colid = column.id;
const $rowIndex = footerTableData.indexOf(row);
let rowRest = null;
if ($rowIndex > -1) {
rowRest = footerFullDataRowData[$rowIndex];
if (!rowRest) {
rowRest = footerFullDataRowData[$rowIndex] = {};
}
formatData = rowRest.formatData;
if (!formatData) {
formatData = footerFullDataRowData[$rowIndex].formatData = {};
}
if (rowRest && formatData[colid]) {
if (formatData[colid].value === itemValue) {
return formatData[colid].label;
}
}
}
const footerFormatParams = {
$table: $xeTable,
cellValue: itemValue,
itemValue,
row,
items: row,
$rowIndex,
column,
_columnIndex,
columnIndex: $xeTable.getColumnIndex(column)
};
if (XEUtils.isString(footerFormatter)) {
const gFormatOpts = formats.get(footerFormatter);
const fcFormatMethod = gFormatOpts ? gFormatOpts.tableFooterCellFormatMethod : null;
cellLabel = fcFormatMethod ? fcFormatMethod(footerFormatParams) : '';
}
else if (XEUtils.isArray(footerFormatter)) {
const gFormatOpts = formats.get(footerFormatter[0]);
const fcFormatMethod = gFormatOpts ? gFormatOpts.tableFooterCellFormatMethod : null;
cellLabel = fcFormatMethod ? fcFormatMethod(footerFormatParams, ...footerFormatter.slice(1)) : '';
}
else {
cellLabel = footerFormatter(footerFormatParams);
}
if (formatData) {
formatData[colid] = { value: itemValue, label: cellLabel };
}
}
return cellLabel;
},
updateFooterCellLabel(row, fieldOrColumn) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (!column) {
return null;
}
const { footerTableData } = reactData;
const { footerFullDataRowData } = internalData;
const colid = column.id;
const $rowIndex = footerTableData.indexOf(row);
const rowRest = footerFullDataRowData[$rowIndex];
if (rowRest) {
const formatData = rowRest.formatData;
if (formatData) {
delete formatData[colid];
}
}
return $xeTable.getFooterCellLabel(row, column);
},
clearFooterFormatterCache(isUpdate) {
const { tableData, tableColumn } = reactData;
const { footerFullDataRowData } = internalData;
XEUtils.each(footerFullDataRowData, (rowRest) => {
if (rowRest.formatData) {
rowRest.formatData = undefined;
}
});
if (isUpdate) {
tableData.forEach(row => {
tableColumn.forEach(column => {
$xeTable.getFooterCellLabel(row, column);
});
});
}
return nextTick();
},
/**
* 检查是否为临时行数据
*/
isInsertByRow(row) {
const rowid = getRowid($xeTable, row);
return !!reactData.insertRowFlag && !!internalData.insertRowMaps[rowid];
},
isRemoveByRow(row) {
const rowid = getRowid($xeTable, row);
return !!reactData.removeRowFlag && !!internalData.removeRowMaps[rowid];
},
/**
* 删除所有新增的临时数据
*/
removeInsertRow() {
const { insertRowMaps } = internalData;
return $xeTable.remove(XEUtils.values(insertRowMaps));
},
/**
* 检查行或列数据是否发生改变
*/
isUpdateByRow(rowidOrRow, field) {
const { keepSource } = props;
const { fullDataRowIdData, sourceDataRowIdData } = internalData;
const keepFields = computeKeepFields.value;
if (keepSource) {
const rowid = XEUtils.isString(rowidOrRow) || XEUtils.isNumber(rowidOrRow) ? rowidOrRow : getRowid($xeTable, rowidOrRow);
const rowRest = fullDataRowIdData[rowid];
// 新增的数据不需要检测
if (!rowRest) {
return false;
}
const row = rowRest.row;
const oRow = sourceDataRowIdData[rowid];
if (!oRow) {
return false;
}
if (arguments.length > 1) {
return !eqCellValue(row, oRow, field).result;
}
for (let i = 0; i < keepFields.length; i++) {
if (!eqCellValue(row, oRow, keepFields[i]).result) {
return true;
}
}
}
return false;
},
getUpdateCells() {
const { keepSource, treeConfig } = props;
const { tableFullData, tableFullTreeData, fullDataRowIdData, sourceDataRowIdData, fullColumnFieldData } = internalData;
const treeOpts = computeTreeOpts.value;
const keepFields = computeKeepFields.value;
const cellList = [];
if (keepSource) {
const { handleGetRowId } = createHandleGetRowId($xeTable);
const handleCell = (item) => {
const rowid = handleGetRowId(item);
const rowRest = fullDataRowIdData[rowid];
// 新增的数据不需要检测
if (!rowRest) {
return;
}
const row = rowRest.row;
const oRow = sourceDataRowIdData[rowid];
if (!oRow) {
return;
}
for (let i = 0; i < keepFields.length; i++) {
const field = keepFields[i];
const { result, newValue, oldValue } = eqCellValue(row, oRow, field);
if (!result) {
const column = fullColumnFieldData[field] ? fullColumnFieldData[field].column : null;
cellList.push({ row, rowid, column, field, newValue, oldValue });
}
}
};
if (treeConfig) {
XEUtils.eachTree(tableFullTreeData, handleCell, treeOpts);
}
else {
tableFullData.forEach(handleCell);
}
}
return cellList;
},
/**
* 获取表格的可视列,也可以指定索引获取列
* @param {Number} columnIndex 索引
*/
getColumns(columnIndex) {
const { visibleColumn } = internalData;
return XEUtils.isUndefined(columnIndex) ? visibleColumn.slice(0) : visibleColumn[columnIndex];
},
/**
* 根据列获取列的唯一主键
*/
getColid(fieldOrColumn) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
return column ? column.id : null;
},
/**
* 根据列的唯一主键获取列
* @param {String} colid 列主键
*/
getColumnById(colid) {
const { fullColumnIdData } = internalData;
return colid && fullColumnIdData[colid] ? fullColumnIdData[colid].column : null;
},
/**
* 根据列的字段名获取列
* @param {String} field 字段名
*/
getColumnByField(field) {
const fullColumnFieldData = internalData.fullColumnFieldData;
return field && fullColumnFieldData[field] ? fullColumnFieldData[field].column : null;
},
getParentColumn(fieldOrColumn) {
const { fullColumnIdData } = internalData;
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
return column && column.parentId && fullColumnIdData[column.parentId] ? fullColumnIdData[column.parentId].column : null;
},
/**
* 获取当前表格的列
* 收集到的全量列、全量表头列、处理条件之后的全量表头列、当前渲染中的表头列
*/
getTableColumn() {
return {
collectColumn: internalData.collectColumn.slice(0),
fullColumn: internalData.tableFullColumn.slice(0),
visibleColumn: internalData.visibleColumn.slice(0),
tableColumn: reactData.tableColumn.slice(0)
};
},
/**
* 移动列到指定列的位置
* @param fieldOrColumn
* @param targetFieldOrColumn
* @param options
*/
moveColumnTo(fieldOrColumn, targetFieldOrColumn, options) {
const { fullColumnIdData, visibleColumn } = internalData;
const { dragToChild, dragPos, isCrossDrag } = Object.assign({}, options);
const dragCol = handleFieldOrColumn($xeTable, fieldOrColumn);
let prevDragCol = null;
const colRest = dragCol ? fullColumnIdData[dragCol.id] : null;
let defPos = 'left';
if (XEUtils.isNumber(targetFieldOrColumn)) {
if (colRest && targetFieldOrColumn) {
let currList = colRest.items;
let offsetIndex = colRest._index + targetFieldOrColumn;
if (isCrossDrag) {
currList = visibleColumn;
offsetIndex = colRest._index + targetFieldOrColumn;
}
if (offsetIndex > 0 && offsetIndex < currList.length - 1) {
prevDragCol = currList[offsetIndex];
}
if (targetFieldOrColumn > 0) {
defPos = 'right';
}
}
}
else {
prevDragCol = handleFieldOrColumn($xeTable, targetFieldOrColumn);
const targetColRest = prevDragCol ? fullColumnIdData[prevDragCol.id] : null;
if (colRest && targetColRest) {
if (targetColRest._index > colRest._index) {
defPos = 'right';
}
}
}
return $xeTable.handleColDragSwapEvent(null, true, dragCol, prevDragCol, dragPos || defPos, dragToChild === true);
},
/**
* 移动行到指定行的位置
* @param rowidOrRow
* @param targetRowidOrRow
* @param options
*/
moveRowTo(rowidOrRow, targetRowidOrRow, options) {
const { treeConfig } = props;
const { fullAllDataRowIdData, afterFullData } = internalData;
const { dragToChild, dragPos, isCrossDrag } = Object.assign({}, options);
const treeOpts = computeTreeOpts.value;
const dragRow = handleRowidOrRow($xeTable, rowidOrRow);
let prevDragRow = null;
let defPos = 'top';
const rowRest = dragRow ? fullAllDataRowIdData[getRowid($xeTable, dragRow)] : null;
if (XEUtils.isNumber(targetRowidOrRow)) {
if (rowRest && targetRowidOrRow) {
let currList = afterFullData;
let offsetIndex = rowRest._index + targetRowidOrRow;
if (treeConfig) {
currList = rowRest.items;
if (treeOpts.transform) {
offsetIndex = rowRest.treeIndex + targetRowidOrRow;
if (isCrossDrag) {
currList = afterFullData;
offsetIndex = rowRest._index + targetRowidOrRow;
}
}
}
if (offsetIndex >= 0 && offsetIndex <= currList.length - 1) {
prevDragRow = currList[offsetIndex];
}
if (targetRowidOrRow > 0) {
defPos = 'bottom';
}
}
}
else {
prevDragRow = handleRowidOrRow($xeTable, targetRowidOrRow);
const targetRowRest = prevDragRow ? fullAllDataRowIdData[getRowid($xeTable, prevDragRow)] : null;
if (rowRest && targetRowRest) {
if (targetRowRest._index > rowRest._index) {
defPos = 'bottom';
}
}
}
const rest = $xeTable.handleRowDragSwapEvent(null, true, dragRow, prevDragRow, dragPos || defPos, dragToChild === true);
return rest;
},
/**
* 获取表格的全量列
*/
getFullColumns() {
const { collectColumn } = internalData;
return collectColumn.slice(0);
},
/**
* 获取数据,和 data 的行为一致,也可以指定索引获取数据
*/
getData(rowIndex) {
const tableSynchData = props.data || internalData.tableSynchData;
return XEUtils.isUndefined(rowIndex) ? tableSynchData.slice(0) : tableSynchData[rowIndex];
},
/**
* 用于多选行,获取已选中的数据
*/
getCheckboxRecords(isFull) {
const { treeConfig } = props;
const { updateCheckboxFlag } = reactData;
const { tableFullData, afterFullData, tableFullTreeData, fullDataRowIdData, afterFullRowMaps, selectCheckboxMaps } = internalData;
const treeOpts = computeTreeOpts.value;
const checkboxOpts = computeCheckboxOpts.value;
const { transform, mapChildrenField } = treeOpts;
const { checkField } = checkboxOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
let rowList = [];
if (updateCheckboxFlag) {
if (checkField) {
if (treeConfig) {
// 如果开启 transform 默认就是完整数据
const currTableData = isFull ? (transform ? tableFullTreeData : tableFullData) : (transform ? tableFullTreeData : afterFullData);
rowList = XEUtils.filterTree(currTableData, row => XEUtils.get(row, checkField), { children: transform ? mapChildrenField : childrenField });
}
else {
const currTableData = isFull ? tableFullData : afterFullData;
rowList = currTableData.filter((row) => XEUtils.get(row, checkField));
}
}
else {
const currMaps = isFull || (treeConfig && !transform) ? fullDataRowIdData : afterFullRowMaps;
XEUtils.each(selectCheckboxMaps, (row, rowid) => {
if (currMaps[rowid]) {
rowList.push(fullDataRowIdData[rowid].row);
}
});
}
}
return rowList;
},
/**
* 只对 tree-config 有效,获取行的子级
*/
getTreeRowChildren(rowOrRowid) {
const { treeConfig } = props;
const { fullAllDataRowIdData } = internalData;
const treeOpts = computeTreeOpts.value;
const { transform, mapChildrenField } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
if (rowOrRowid && treeConfig) {
let rowid;
if (XEUtils.isString(rowOrRowid)) {
rowid = rowOrRowid;
}
else {
rowid = getRowid($xeTable, rowOrRowid);
}
if (rowid) {
const rest = fullAllDataRowIdData[rowid];
const row = rest ? rest.row : null;
if (row) {
return row[transform ? mapChildrenField : childrenField] || [];
}
}
}
return [];
},
/**
* 只对 tree-config 有效,用于树形结构,获取指定行的层级
*/
getTreeRowLevel(rowOrRowid) {
const { treeConfig } = props;
const { fullAllDataRowIdData } = internalData;
if (rowOrRowid && treeConfig) {
let rowid;
if (XEUtils.isString(rowOrRowid)) {
rowid = rowOrRowid;
}
else {
rowid = getRowid($xeTable, rowOrRowid);
}
if (rowid) {
const rest = fullAllDataRowIdData[rowid];
if (rest) {
return rest.level;
}
}
}
return -1;
},
/**
* 只对 tree-config 有效,获取行的父级
*/
getTreeParentRow(rowOrRowid) {
const { treeConfig } = props;
const { fullAllDataRowIdData } = internalData;
if (rowOrRowid && treeConfig) {
let rowid;
if (XEUtils.isString(rowOrRowid)) {
rowid = rowOrRowid;
}
else {
rowid = getRowid($xeTable, rowOrRowid);
}
if (rowid) {
const rest = fullAllDataRowIdData[rowid];
if (rest) {
return rest.parent;
}
}
}
return null;
},
getParentRow(rowOrRowid) {
warnLog$2('vxe.error.delFunc', ['getParentRow', 'getTreeParentRow']);
return $xeTable.getTreeParentRow(rowOrRowid);
},
/**
* 根据行的唯一主键获取行
* @param {String/Number} rowid 行主键
*/
getRowById(cellValue) {
const { fullAllDataRowIdData } = internalData;
const rowid = XEUtils.eqNull(cellValue) ? '' : encodeURIComponent(cellValue || '');
return fullAllDataRowIdData[rowid] ? fullAllDataRowIdData[rowid].row : null;
},
/**
* 根据行获取行的唯一主键
* @param {Row} row 行对象
*/
getRowid(row) {
return getRowid($xeTable, row);
},
/**
* 获取处理后的表格数据
* 如果存在筛选条件,继续处理
* 如果存在排序,继续处理
*/
getTableData() {
const { tableData, footerTableData } = reactData;
const { tableFullData, afterFullData, tableFullTreeData } = internalData;
return {
fullData: props.treeConfig ? tableFullTreeData.slice(0) : tableFullData.slice(0),
visibleData: afterFullData.slice(0),
tableData: tableData.slice(0),
footerData: footerTableData.slice(0)
};
},
/**
* 获取表格的全量数据,如果是 tree-config 则返回带层级的树结构
*/
getFullData() {
const { treeConfig } = props;
const { tableFullData, tableFullTreeData } = internalData;
if (treeConfig) {
return tableFullTreeData.slice(0);
}
return tableFullData.slice(0);
},
/**
* 设置为固定列
*/
setColumnFixed(fieldOrColumn, fixed) {
let status = false;
const cols = XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : [fieldOrColumn];
const columnOpts = computeColumnOpts.value;
const isMaxFixedColumn = computeIsMaxFixedColumn.value;
for (let i = 0; i < cols.length; i++) {
const item = cols[i];
const column = handleFieldOrColumn($xeTable, item);
const targetColumn = getRootColumn($xeTable, column);
if (targetColumn && targetColumn.fixed !== fixed) {
// 是否超过最大固定列数量
if (!targetColumn.fixed && isMaxFixedColumn) {
if (VxeUI.modal) {
VxeUI.modal.message({
status: 'error',
content: getI18n$2('vxe.table.maxFixedCol', [columnOpts.maxFixedSize])
});
}
return nextTick();
}
XEUtils.eachTree([targetColumn], (column) => {
column.fixed = fixed;
column.renderFixed = fixed;
});
$xeTable.saveCustomStore('update:fixed');
if (!status) {
status = true;
}
}
}
if (status) {
return $xeTable.refreshColumn();
}
return nextTick();
},
/**
* 取消指定固定列
*/
clearColumnFixed(fieldOrColumn) {
let status = false;
const cols = XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : [fieldOrColumn];
cols.forEach(item => {
const column = handleFieldOrColumn($xeTable, item);
const targetColumn = getRootColumn($xeTable, column);
if (targetColumn && targetColumn.fixed) {
XEUtils.eachTree([targetColumn], (column) => {
column.fixed = null;
column.renderFixed = null;
});
$xeTable.saveCustomStore('update:fixed');
if (!status) {
status = true;
}
}
});
if (status) {
return $xeTable.refreshColumn();
}
return nextTick();
},
/**
* 隐藏指定列
*/
hideColumn: handleColumnVisible(false),
/**
* 显示指定列
*/
showColumn: handleColumnVisible(true),
setColumnWidth(fieldOrColumn, width) {
const { elemStore } = internalData;
let status = false;
const cols = XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : [fieldOrColumn];
let cWidth = XEUtils.toInteger(width);
if (isScale(width)) {
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const bodyWidth = bodyScrollElem ? bodyScrollElem.clientWidth - 1 : 0;
cWidth = Math.floor(cWidth * bodyWidth);
}
if (cWidth) {
cols.forEach(item => {
const column = handleFieldOrColumn($xeTable, item);
if (column) {
column.resizeWidth = cWidth;
if (!status) {
status = true;
}
}
});
if (status) {
return $xeTable.refreshColumn().then(() => {
return { status };
});
}
}
return nextTick().then(() => {
return { status };
});
},
getColumnWidth(fieldOrColumn) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (column) {
return column.renderWidth;
}
return 0;
},
/**
* 手动重置列的显示隐藏、列宽拖动的状态、固定列、排序列;
* 如果为 true 则重置所有状态
* 如果已关联工具栏,则会同步更新
*/
resetColumn(options) {
warnLog$2('vxe.error.delFunc', ['resetColumn', 'resetCustom']);
return $xeTable.resetCustom(options);
},
/**
* 刷新列信息
* 将固定的列左边、右边分别靠边
* 如果传 true 则会检查列顺序并排序
*/
refreshColumn(initSort) {
if (initSort) {
handleUpdateColumn();
}
return parseColumns(true).then(() => {
return $xeTable.refreshScroll();
}).then(() => {
return handleLazyRecalculate(false, true, true);
});
},
setRowHeightConf(heightConf) {
const { fullAllDataRowIdData } = internalData;
let status = false;
if (heightConf) {
XEUtils.each(heightConf, (height, rowid) => {
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
const rHeight = XEUtils.toInteger(height);
if (rHeight) {
rowRest.resizeHeight = rHeight;
if (!status) {
status = true;
}
}
}
});
if (status) {
internalData.isResizeCellHeight = true;
reactData.resizeHeightFlag++;
}
}
return nextTick().then(() => {
updateRowOffsetTop();
return { status };
});
},
getRowHeightConf(isFull) {
const { fullAllDataRowIdData, afterFullData } = internalData;
const { handleGetRowId } = createHandleGetRowId($xeTable);
const rowOpts = computeRowOpts.value;
const cellOpts = computeCellOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const rest = {};
afterFullData.forEach(row => {
const rowid = handleGetRowId(row);
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
const resizeHeight = rowRest.resizeHeight;
if (resizeHeight || isFull) {
const currCellHeight = getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight);
rest[rowid] = currCellHeight;
}
}
});
return rest;
},
recalcRowHeight(rowOrId) {
const { fullAllDataRowIdData } = internalData;
const rows = XEUtils.isArray(rowOrId) ? rowOrId : [rowOrId];
const el = refElem.value;
if (el) {
const { handleGetRowId } = createHandleGetRowId($xeTable);
el.setAttribute('data-calc-row', 'Y');
rows.forEach(row => {
const rowid = XEUtils.isString(row) || XEUtils.isNumber(row) ? row : handleGetRowId(row);
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
rowRest.resizeHeight = calcCellAutoHeight(rowid, rowRest, el);
}
el.removeAttribute('data-calc-row');
});
reactData.calcCellHeightFlag++;
}
return nextTick();
},
setRowHeight(rowOrId, height) {
const { fullAllDataRowIdData } = internalData;
let status = false;
const rows = XEUtils.isArray(rowOrId) ? rowOrId : [rowOrId];
let rHeight = XEUtils.toInteger(height);
if (isScale(height)) {
const tableBody = refTableBody.value;
const bodyElem = tableBody ? tableBody.$el : null;
const bodyHeight = bodyElem ? bodyElem.clientHeight - 1 : 0;
rHeight = Math.floor(rHeight * bodyHeight);
}
if (rHeight) {
const { handleGetRowId } = createHandleGetRowId($xeTable);
rows.forEach(row => {
const rowid = XEUtils.isString(row) || XEUtils.isNumber(row) ? row : handleGetRowId(row);
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
rowRest.resizeHeight = rHeight;
if (!status) {
status = true;
}
}
});
if (status) {
internalData.isResizeCellHeight = true;
reactData.resizeHeightFlag++;
}
}
return nextTick().then(() => {
return { status };
});
},
getRowHeight(rowOrId) {
const { fullAllDataRowIdData } = internalData;
const rowOpts = computeRowOpts.value;
const cellOpts = computeCellOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const rowid = XEUtils.isString(rowOrId) || XEUtils.isNumber(rowOrId) ? rowOrId : getRowid($xeTable, rowOrId);
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
return getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight);
}
return 0;
},
/**
* 刷新滚动操作,手动同步滚动相关位置(对于某些特殊的操作,比如滚动条错位、固定列不同步)
*/
refreshScroll() {
const { elemStore, lastScrollLeft, lastScrollTop } = internalData;
const headerScrollElem = getRefElem(elemStore['main-header-scroll']);
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const footerScrollElem = getRefElem(elemStore['main-footer-scroll']);
const leftScrollElem = getRefElem(elemStore['left-body-scroll']);
const rightScrollElem = getRefElem(elemStore['right-body-scroll']);
const xHandleEl = refScrollXHandleElem.value;
const yHandleEl = refScrollYHandleElem.value;
return new Promise(resolve => {
// 还原滚动条位置
if (lastScrollLeft || lastScrollTop) {
return restoreScrollLocation($xeTable, lastScrollLeft, lastScrollTop).then(() => {
// 存在滚动行为未结束情况
setTimeout(resolve, 10);
});
}
internalData.intoRunScroll = true;
// 重置
setScrollTop(yHandleEl, lastScrollTop);
setScrollTop(bodyScrollElem, lastScrollTop);
setScrollTop(leftScrollElem, lastScrollTop);
setScrollTop(rightScrollElem, lastScrollTop);
setScrollLeft(xHandleEl, lastScrollLeft);
setScrollLeft(bodyScrollElem, lastScrollLeft);
setScrollLeft(headerScrollElem, lastScrollLeft);
setScrollLeft(footerScrollElem, lastScrollLeft);
// 存在滚动行为未结束情况
setTimeout(() => {
internalData.intoRunScroll = false;
resolve();
}, 10);
});
},
/**
* 重新渲染布局
* 刷新布局
*/
recalculate(reFull) {
const isForce = !!reFull;
return handleLazyRecalculate(isForce, isForce, isForce);
},
openTooltip(target, content) {
const $commTip = refCommTooltip.value;
if ($commTip && $commTip.open) {
return $commTip.open(target, content);
}
return nextTick();
},
/**
* 关闭 tooltip
*/
closeTooltip() {
const { tooltipStore } = reactData;
const $tooltip = refTooltip.value;
const $commTip = refCommTooltip.value;
if (tooltipStore.visible) {
Object.assign(tooltipStore, {
row: null,
column: null,
content: null,
visible: false,
type: null,
currOpts: {}
});
if ($tooltip && $tooltip.close) {
$tooltip.close();
}
}
if ($commTip && $commTip.close) {
$commTip.close();
}
return nextTick();
},
/**
* 判断列头复选框是否被选中
*/
isAllCheckboxChecked() {
return reactData.isAllSelected;
},
/**
* 判断列头复选框是否被半选
*/
isAllCheckboxIndeterminate() {
return !reactData.isAllSelected && reactData.isIndeterminate;
},
/**
* 获取复选框半选状态的行数据
*/
getCheckboxIndeterminateRecords(isFull) {
const { treeConfig } = props;
const { fullDataRowIdData, treeIndeterminateRowMaps } = internalData;
if (treeConfig) {
const fullRest = [];
const defRest = [];
XEUtils.each(treeIndeterminateRowMaps, (item, rowid) => {
if (item) {
fullRest.push(item);
if (fullDataRowIdData[rowid]) {
defRest.push(item);
}
}
});
if (isFull) {
return fullRest;
}
return defRest;
}
return [];
},
/**
* 用于多选行,设置行为选中状态,第二个参数为选中与否
* @param {Array/Row} rows 行数据
* @param {Boolean} value 是否选中
*/
setCheckboxRow(rows, checked) {
if (rows && !XEUtils.isArray(rows)) {
rows = [rows];
}
return handleCheckedCheckboxRow(rows, checked, true);
},
setCheckboxRowByKey(keys, checked) {
const { fullAllDataRowIdData } = internalData;
if (!XEUtils.isArray(keys)) {
keys = [keys];
}
const rows = [];
keys.forEach((rowKey) => {
const rowid = encodeRowid(rowKey);
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
rows.push(rowRest.row);
}
});
return handleCheckedCheckboxRow(rows, checked, true);
},
setCheckboxRowKey(keys, checked) {
return $xeTable.setCheckboxRowByKey(keys, checked);
},
isCheckedByCheckboxRow(row) {
const { updateCheckboxFlag } = reactData;
const { selectCheckboxMaps } = internalData;
const checkboxOpts = computeCheckboxOpts.value;
const { checkField } = checkboxOpts;
if (checkField) {
return XEUtils.get(row, checkField);
}
return !!updateCheckboxFlag && !!selectCheckboxMaps[getRowid($xeTable, row)];
},
isCheckedByCheckboxRowKey(rowKey) {
const { updateCheckboxFlag } = reactData;
const { fullAllDataRowIdData, selectCheckboxMaps } = internalData;
const checkboxOpts = computeCheckboxOpts.value;
const { checkField } = checkboxOpts;
const rowid = encodeRowid(rowKey);
if (checkField) {
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
return XEUtils.get(rowRest.row, checkField);
}
return false;
}
return !!updateCheckboxFlag && !!selectCheckboxMaps[rowid];
},
isIndeterminateByCheckboxRow(row) {
const { treeIndeterminateRowMaps } = internalData;
return !!treeIndeterminateRowMaps[getRowid($xeTable, row)] && !$xeTable.isCheckedByCheckboxRow(row);
},
isIndeterminateByCheckboxRowKey(rowKey) {
const { treeIndeterminateRowMaps } = internalData;
const rowid = encodeRowid(rowKey);
return !!treeIndeterminateRowMaps[rowid] && !$xeTable.isCheckedByCheckboxRowKey(rowid);
},
/**
* 多选,切换某一行的选中状态
*/
toggleCheckboxRow(row) {
const { selectCheckboxMaps } = internalData;
const checkboxOpts = computeCheckboxOpts.value;
const { checkField } = checkboxOpts;
const checked = checkField ? !XEUtils.get(row, checkField) : !selectCheckboxMaps[getRowid($xeTable, row)];
$xeTable.handleBatchSelectRows([row], checked, true);
$xeTable.checkSelectionStatus();
return nextTick();
},
/**
* 用于多选行,设置所有行的选中状态
* @param {Boolean} value 是否选中
*/
setAllCheckboxRow(value) {
return handleCheckedAllCheckboxRow(value, true);
},
/**
* 获取单选框保留选中的行
*/
getRadioReserveRecord(isFull) {
const { treeConfig } = props;
const { fullDataRowIdData, radioReserveRow, afterFullData } = internalData;
const radioOpts = computeRadioOpts.value;
const treeOpts = computeTreeOpts.value;
const childrenField = treeOpts.children || treeOpts.childrenField;
if (radioOpts.reserve && radioReserveRow) {
const rowid = getRowid($xeTable, radioReserveRow);
if (isFull) {
if (!fullDataRowIdData[rowid]) {
return radioReserveRow;
}
}
else {
const rowkey = getRowkey($xeTable);
if (treeConfig) {
const matchObj = XEUtils.findTree(afterFullData, row => rowid === XEUtils.get(row, rowkey), { children: childrenField });
if (matchObj) {
return radioReserveRow;
}
}
else {
if (!afterFullData.some(row => rowid === XEUtils.get(row, rowkey))) {
return radioReserveRow;
}
}
}
}
return null;
},
clearRadioReserve() {
internalData.radioReserveRow = null;
return nextTick();
},
/**
* 获取复选框保留选中的行
*/
getCheckboxReserveRecords(isFull) {
const { treeConfig } = props;
const { afterFullData, fullDataRowIdData, checkboxReserveRowMap } = internalData;
const checkboxOpts = computeCheckboxOpts.value;
const treeOpts = computeTreeOpts.value;
const childrenField = treeOpts.children || treeOpts.childrenField;
const reserveSelection = [];
if (checkboxOpts.reserve) {
const { handleGetRowId } = createHandleGetRowId($xeTable);
const afterFullIdMaps = {};
if (treeConfig) {
XEUtils.eachTree(afterFullData, row => {
afterFullIdMaps[handleGetRowId(row)] = 1;
}, { children: childrenField });
}
else {
afterFullData.forEach(row => {
afterFullIdMaps[handleGetRowId(row)] = 1;
});
}
XEUtils.each(checkboxReserveRowMap, (oldRow, oldRowid) => {
if (oldRow) {
if (isFull) {
if (!fullDataRowIdData[oldRowid]) {
reserveSelection.push(oldRow);
}
}
else {
if (!afterFullIdMaps[oldRowid]) {
reserveSelection.push(oldRow);
}
}
}
});
}
return reserveSelection;
},
clearCheckboxReserve() {
internalData.checkboxReserveRowMap = {};
return nextTick();
},
/**
* 多选,切换所有行的选中状态
*/
toggleAllCheckboxRow() {
handleCheckAllEvent(null, !reactData.isAllSelected);
return nextTick();
},
/**
* 用于多选行,手动清空用户的选择
* 清空行为不管是否被禁用还是保留记录,都将彻底清空选中状态
*/
clearCheckboxRow() {
const { treeConfig } = props;
const { tableFullData } = internalData;
const treeOpts = computeTreeOpts.value;
const childrenField = treeOpts.children || treeOpts.childrenField;
const checkboxOpts = computeCheckboxOpts.value;
const { checkField, reserve } = checkboxOpts;
// indeterminateField 仅支持读取
const indeterminateField = checkboxOpts.indeterminateField || checkboxOpts.halfField;
if (checkField) {
const handleClearChecked = (item) => {
if (treeConfig && indeterminateField) {
XEUtils.set(item, indeterminateField, false);
}
XEUtils.set(item, checkField, false);
};
if (treeConfig) {
XEUtils.eachTree(tableFullData, handleClearChecked, { children: childrenField });
}
else {
tableFullData.forEach(handleClearChecked);
}
}
if (reserve) {
tableFullData.forEach((row) => handleCheckboxReserveRow(row, false));
}
reactData.isAllSelected = false;
reactData.isIndeterminate = false;
internalData.selectCheckboxMaps = {};
internalData.treeIndeterminateRowMaps = {};
reactData.updateCheckboxFlag++;
return nextTick();
},
/**
* 用于当前行,设置某一行为高亮状态
* @param {Row} row 行对象
*/
setCurrentRow(row) {
const $xeGanttView = internalData.xeGanttView;
const rowOpts = computeRowOpts.value;
const el = refElem.value;
$xeTable.clearCurrentRow();
// $xeTable.clearCurrentColumn()
internalData.currentRow = row;
if (rowOpts.isCurrent || props.highlightCurrentRow) {
if (el) {
XEUtils.arrayEach(el.querySelectorAll(`[rowid="${getRowid($xeTable, row)}"]`), elem => addClass(elem, 'row--current'));
}
}
if ($xeGanttView && $xeGanttView.handleUpdateCurrentRow) {
$xeGanttView.handleUpdateCurrentRow(row);
}
return nextTick();
},
isCheckedByRadioRow(row) {
const { selectRadioRow } = reactData;
if (row && selectRadioRow) {
return $xeTable.eqRow(selectRadioRow, row);
}
return false;
},
isCheckedByRadioRowKey(key) {
const { selectRadioRow } = reactData;
if (selectRadioRow) {
return key === getRowid($xeTable, selectRadioRow);
}
return false;
},
/**
* 用于单选行,设置某一行为选中状态
* @param {Row} row 行对象
*/
setRadioRow(row) {
return handleCheckedRadioRow(row, true);
},
/**
* 用于单选行,设置某一行为选中状态
* @param key 行主键
*/
setRadioByRowKey(rowKey) {
const { fullAllDataRowIdData } = internalData;
const rowid = encodeRowid(rowKey);
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
return handleCheckedRadioRow(rowRest.row, true);
}
return nextTick();
},
setRadioRowKey(rowKey) {
return $xeTable.setRadioByRowKey(rowKey);
},
/**
* 用于当前行,手动清空当前高亮的状态
*/
clearCurrentRow() {
const $xeGanttView = internalData.xeGanttView;
const el = refElem.value;
internalData.currentRow = null;
internalData.hoverRow = null;
if (el) {
XEUtils.arrayEach(el.querySelectorAll('.row--current'), elem => removeClass(elem, 'row--current'));
}
if ($xeGanttView && $xeGanttView.handleUpdateCurrentRow) {
$xeGanttView.handleUpdateCurrentRow();
}
return nextTick();
},
/**
* 用于单选行,手动清空用户的选择
*/
clearRadioRow() {
reactData.selectRadioRow = null;
return nextTick();
},
/**
* 用于当前行,获取当前行的数据
*/
getCurrentRecord(isFull) {
const { fullDataRowIdData, afterFullRowMaps, currentRow } = internalData;
const rowOpts = computeRowOpts.value;
if (rowOpts.isCurrent || props.highlightCurrentRow) {
const rowid = getRowid($xeTable, currentRow);
if (isFull) {
if (fullDataRowIdData[rowid]) {
return currentRow;
}
}
else {
if (afterFullRowMaps[rowid]) {
return currentRow;
}
}
}
return null;
},
/**
* 用于单选行,获取当已选中的数据
*/
getRadioRecord(isFull) {
const { fullDataRowIdData, afterFullRowMaps } = internalData;
const { selectRadioRow } = reactData;
if (selectRadioRow) {
const rowid = getRowid($xeTable, selectRadioRow);
if (isFull) {
if (fullDataRowIdData[rowid]) {
return selectRadioRow;
}
}
else {
if (afterFullRowMaps[rowid]) {
return selectRadioRow;
}
}
}
return null;
},
getCurrentColumn() {
const columnOpts = computeColumnOpts.value;
return columnOpts.isCurrent || props.highlightCurrentColumn ? reactData.currentColumn : null;
},
/**
* 用于当前列,设置某列行为高亮状态
*/
setCurrentColumn(fieldOrColumn) {
const { mouseConfig } = props;
const mouseOpts = computeMouseOpts.value;
const isMouseSelected = mouseConfig && mouseOpts.selected;
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (column) {
$xeTable.clearCurrentColumn();
reactData.currentColumn = column;
}
return nextTick().then(() => {
// 更新状选中态
if (isMouseSelected) {
$xeTable.addCellSelectedClass();
}
});
},
/**
* 用于当前列,手动清空当前高亮的状态
*/
clearCurrentColumn() {
reactData.currentColumn = null;
return nextTick();
},
setPendingRow(rows, status) {
const { handleGetRowId } = createHandleGetRowId($xeTable);
const { pendingRowMaps } = internalData;
if (rows && !XEUtils.isArray(rows)) {
rows = [rows];
}
if (status) {
rows.forEach((row) => {
const rowid = handleGetRowId(row);
if (rowid && !pendingRowMaps[rowid]) {
pendingRowMaps[rowid] = row;
}
});
}
else {
rows.forEach((row) => {
const rowid = handleGetRowId(row);
if (rowid && pendingRowMaps[rowid]) {
delete pendingRowMaps[rowid];
}
});
}
reactData.pendingRowFlag++;
return nextTick();
},
togglePendingRow(rows) {
const { handleGetRowId } = createHandleGetRowId($xeTable);
const { pendingRowMaps } = internalData;
if (rows && !XEUtils.isArray(rows)) {
rows = [rows];
}
rows.forEach((row) => {
const rowid = handleGetRowId(row);
if (rowid) {
if (pendingRowMaps[rowid]) {
delete pendingRowMaps[rowid];
}
else {
pendingRowMaps[rowid] = row;
}
}
});
reactData.pendingRowFlag++;
return nextTick();
},
hasPendingByRow(row) {
return $xeTable.isPendingByRow(row);
},
isPendingByRow(row) {
const { pendingRowMaps } = internalData;
const rowid = getRowid($xeTable, row);
return !!pendingRowMaps[rowid];
},
getPendingRecords() {
const { fullAllDataRowIdData, pendingRowMaps } = internalData;
const insertRecords = [];
XEUtils.each(pendingRowMaps, (row, rowid) => {
if (fullAllDataRowIdData[rowid]) {
insertRecords.push(row);
}
});
return insertRecords;
},
clearPendingRow() {
internalData.pendingRowMaps = {};
reactData.pendingRowFlag++;
return nextTick();
},
sort(sortConfs, sortOrder) {
const sortOpts = computeSortOpts.value;
const { multiple, remote, orders } = sortOpts;
if (sortConfs) {
if (XEUtils.isString(sortConfs)) {
sortConfs = [
{ field: sortConfs, order: sortOrder }
];
}
}
if (!XEUtils.isArray(sortConfs)) {
sortConfs = [sortConfs];
}
if (sortConfs.length) {
if (!multiple) {
clearAllSort();
}
(multiple ? sortConfs : [sortConfs[0]]).forEach((confs, index) => {
let { field, order } = confs;
let column = field;
if (XEUtils.isString(field)) {
column = $xeTable.getColumnByField(field);
}
if (column && column.sortable) {
if (orders && orders.indexOf(order) === -1) {
order = getNextSortOrder(column);
}
if (column.order !== order) {
column.order = order;
}
column.sortTime = Date.now() + index;
}
});
// 如果是服务端排序,则跳过本地排序处理
if (!remote) {
$xeTable.handleTableData(true);
}
return nextTick().then(() => {
updateRowOffsetTop();
$xeTable.updateCellAreas();
return updateStyle();
});
}
return nextTick();
},
setSort(sortConfs, isUpdate) {
return handleSortEvent(null, sortConfs, isUpdate);
},
setSortByEvent(evnt, sortConfs) {
return handleSortEvent(evnt, sortConfs, true);
},
/**
* 清空指定列的排序条件
* 如果为空则清空所有列的排序条件
* @param {String} fieldOrColumn 列或字段名
*/
clearSort(fieldOrColumn) {
const sortOpts = computeSortOpts.value;
if (fieldOrColumn) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (column) {
column.order = null;
}
}
else {
clearAllSort();
}
if (!sortOpts.remote) {
$xeTable.handleTableData(true);
}
return nextTick().then(() => {
updateRowOffsetTop();
return updateStyle();
});
},
clearSortByEvent(evnt, fieldOrColumn) {
const { tableFullColumn } = internalData;
const sortOpts = computeSortOpts.value;
const { multiple } = sortOpts;
const sortCols = [];
let column = null;
if (evnt) {
if (fieldOrColumn) {
column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (column) {
column.order = null;
}
}
else {
tableFullColumn.forEach((column) => {
if (column.order) {
column.order = null;
sortCols.push(column);
}
});
}
if (!sortOpts.remote) {
$xeTable.handleTableData(true);
}
if (!multiple) {
column = sortCols[0];
}
if (column) {
$xeTable.handleColumnSortEvent(evnt, column);
}
if (multiple && sortCols.length) {
const params = { $table: $xeTable, $event: evnt, cols: sortCols, sortList: [] };
dispatchEvent('clear-all-sort', params, evnt);
}
}
return nextTick().then(() => {
updateRowOffsetTop();
return updateStyle();
});
},
isSort(fieldOrColumn) {
if (fieldOrColumn) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
return column ? column.sortable && !!column.order : false;
}
return $xeTable.getSortColumns().length > 0;
},
getSortColumns() {
const sortOpts = computeSortOpts.value;
const { multiple, chronological } = sortOpts;
const sortList = [];
const { tableFullColumn } = internalData;
tableFullColumn.forEach((column) => {
const { field, order } = column;
if (column.sortable && order) {
sortList.push({ column, field, property: field, order: order, sortTime: column.sortTime });
}
});
if (multiple && chronological && sortList.length > 1) {
return XEUtils.orderBy(sortList, 'sortTime');
}
return sortList;
},
setFilterByEvent(evnt, fieldOrColumn, options) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (column && column.filters) {
column.filters = toFilters(options || [], column.id);
return $xeTable.handleColumnConfirmFilter(column, evnt);
}
return nextTick();
},
/**
* 关闭筛选
* @param {Event} evnt 事件
*/
closeFilter() {
const { filterStore } = reactData;
const { column, visible } = filterStore;
filterStore.isAllSelected = false;
filterStore.isIndeterminate = false;
filterStore.visible = false;
if (visible) {
const field = column ? column.field : null;
dispatchEvent('filter-visible', {
column,
property: field,
field,
filterList: () => $xeTable.getCheckedFilters(),
visible: false
}, null);
}
return nextTick();
},
/**
* 判断指定列是否为筛选状态,如果为空则判断所有列
* @param {String} fieldOrColumn 字段名
*/
isActiveFilterByColumn(fieldOrColumn) {
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (column) {
return column.filters && column.filters.some((option) => option.checked);
}
return $xeTable.getCheckedFilters().length > 0;
},
isFilter(fieldOrColumn) {
return $xeTable.isActiveFilterByColumn(fieldOrColumn);
},
clearFilterByEvent(evnt, fieldOrColumn) {
const { filterStore } = reactData;
const { tableFullColumn } = internalData;
const filterOpts = computeFilterOpts.value;
const { multiple } = filterOpts;
const filterCols = [];
let column = null;
if (fieldOrColumn) {
column = handleFieldOrColumn($xeTable, fieldOrColumn);
if (column) {
$xeTable.handleClearFilter(column);
}
}
else {
tableFullColumn.forEach(column => {
if (column.filters) {
filterCols.push(column);
$xeTable.handleClearFilter(column);
}
});
}
if (!fieldOrColumn || column !== filterStore.column) {
Object.assign(filterStore, {
isAllSelected: false,
isIndeterminate: false,
style: null,
options: [],
column: null,
multiple: false, // 选项是覅多选
visible: false
});
}
if (!filterOpts.remote) {
$xeTable.updateData();
}
if (!multiple) {
column = filterCols[0];
}
if (column) {
const filterList = () => $xeTable.getCheckedFilters();
const values = [];
const datas = [];
column.filters.forEach((item) => {
if (item.checked) {
values.push(item.value);
datas.push(item.data);
}
});
const params = {
$table: $xeTable,
$event: evnt,
column,
field: column.field,
property: column.field,
values,
datas,
filters: filterList,
filterList
};
$xeTable.dispatchEvent('filter-change', params, evnt);
$xeTable.dispatchEvent('clear-filter', params, evnt);
}
if (multiple && filterCols.length) {
const params = { $table: $xeTable, $event: evnt, cols: filterCols, filterList: [] };
dispatchEvent('clear-all-filter', params, evnt);
}
return nextTick();
},
/**
* 判断展开行是否懒加载完成
* @param {Row} row 行对象
*/
isRowExpandLoaded(row) {
const { fullAllDataRowIdData } = internalData;
const rowRest = fullAllDataRowIdData[getRowid($xeTable, row)];
return rowRest && !!rowRest.expandLoaded;
},
clearRowExpandLoaded(row) {
const { fullAllDataRowIdData, rowExpandLazyLoadedMaps } = internalData;
const expandOpts = computeExpandOpts.value;
const { lazy } = expandOpts;
const rowid = getRowid($xeTable, row);
const rowRest = fullAllDataRowIdData[rowid];
if (lazy && rowRest) {
rowRest.expandLoaded = false;
delete rowExpandLazyLoadedMaps[rowid];
}
reactData.rowExpandedFlag++;
return nextTick();
},
/**
* 重新懒加载展开行,并展开内容
* @param {Row} row 行对象
*/
reloadRowExpand(row) {
const { rowExpandLazyLoadedMaps } = internalData;
const expandOpts = computeExpandOpts.value;
const { lazy } = expandOpts;
const rowid = getRowid($xeTable, row);
if (lazy && !rowExpandLazyLoadedMaps[rowid]) {
$xeTable.clearRowExpandLoaded(row)
.then(() => handleAsyncRowExpand(row));
}
return nextTick();
},
reloadExpandContent(row) {
warnLog$2('vxe.error.delFunc', ['reloadExpandContent', 'reloadRowExpand']);
// 即将废弃
return $xeTable.reloadRowExpand(row);
},
/**
* 切换展开行
*/
toggleRowExpand(row) {
return $xeTable.setRowExpand(row, !$xeTable.isRowExpandByRow(row));
},
/**
* 设置所有行的展开与否
* @param {Boolean} expanded 是否展开
*/
setAllRowExpand(expanded) {
const treeOpts = computeTreeOpts.value;
const { tableFullData, tableFullTreeData } = internalData;
const childrenField = treeOpts.children || treeOpts.childrenField;
let expandedRows = [];
if (props.treeConfig) {
XEUtils.eachTree(tableFullTreeData, (row) => {
expandedRows.push(row);
}, { children: childrenField });
}
else {
expandedRows = tableFullData;
}
return $xeTable.setRowExpand(expandedRows, expanded);
},
/**
* 设置展开行,二个参数设置这一行展开与否
* 支持单行
* 支持多行
* @param {Array/Row} rows 行数据
* @param {Boolean} expanded 是否展开
*/
setRowExpand(rows, expanded) {
const { expandColumn } = reactData;
let { fullAllDataRowIdData, rowExpandedMaps, rowExpandLazyLoadedMaps } = internalData;
const { handleGetRowId } = createHandleGetRowId($xeTable);
const expandOpts = computeExpandOpts.value;
const { reserve, lazy, accordion, toggleMethod } = expandOpts;
const lazyRests = [];
const columnIndex = expandColumn ? $xeTable.getColumnIndex(expandColumn) : -1;
const $columnIndex = expandColumn ? $xeTable.getVMColumnIndex(expandColumn) : -1;
if (rows) {
if (!XEUtils.isArray(rows)) {
rows = [rows];
}
if (accordion) {
// 只能同时展开一个
rowExpandedMaps = {};
internalData.rowExpandedMaps = rowExpandedMaps;
rows = rows.slice(rows.length - 1, rows.length);
}
const validRows = toggleMethod ? rows.filter((row) => toggleMethod({ $table: $xeTable, expanded, column: expandColumn, columnIndex, $columnIndex, row, rowIndex: $xeTable.getRowIndex(row), $rowIndex: $xeTable.getVMRowIndex(row) })) : rows;
if (expanded) {
validRows.forEach((row) => {
const rowid = handleGetRowId(row);
if (!rowExpandedMaps[rowid]) {
const rowRest = fullAllDataRowIdData[rowid];
const isLoad = lazy && !rowRest.expandLoaded && !rowExpandLazyLoadedMaps[rowid];
if (isLoad) {
lazyRests.push(handleAsyncRowExpand(row));
}
else {
rowExpandedMaps[rowid] = row;
}
}
});
}
else {
validRows.forEach(item => {
const rowid = handleGetRowId(item);
if (rowExpandedMaps[rowid]) {
delete rowExpandedMaps[rowid];
}
});
}
if (reserve) {
validRows.forEach((row) => handleRowExpandReserve(row, expanded));
}
}
reactData.rowExpandedFlag++;
return Promise.all(lazyRests)
.then(() => nextTick())
.then(() => handleLazyRecalculate(true, true, true))
.then(() => {
updateRowOffsetTop();
updateRowExpandStyle();
handleRowExpandScroll();
return $xeTable.updateCellAreas();
});
},
/**
* 判断行是否为展开状态
* @param {Row} row 行对象
*/
isRowExpandByRow(row) {
const { rowExpandedFlag } = reactData;
const { rowExpandedMaps } = internalData;
const rowid = getRowid($xeTable, row);
return !!rowExpandedFlag && !!rowExpandedMaps[rowid];
},
isExpandByRow(row) {
// 已废弃
warnLog$2('vxe.error.delFunc', ['isExpandByRow', 'isRowExpandByRow']);
return $xeTable.isRowExpandByRow(row);
},
/**
* 手动清空展开行状态,数据会恢复成未展开的状态
*/
clearRowExpand() {
const { tableFullData, scrollYStore } = internalData;
const expandOpts = computeExpandOpts.value;
const { reserve } = expandOpts;
const expList = $xeTable.getRowExpandRecords();
internalData.rowExpandedMaps = {};
if (reserve) {
tableFullData.forEach((row) => handleRowExpandReserve(row, false));
}
reactData.rowExpandedFlag++;
scrollYStore.startIndex = 0;
scrollYStore.endIndex = 1;
return nextTick().then(() => {
if (expList.length) {
return handleLazyRecalculate(true, true, true);
}
}).then(() => {
updateRowOffsetTop();
updateRowExpandStyle();
handleRowExpandScroll();
return $xeTable.updateCellAreas();
});
},
clearRowExpandReserve() {
internalData.rowExpandedReserveRowMap = {};
return nextTick();
},
getRowExpandRecords() {
const rest = [];
XEUtils.each(internalData.rowExpandedMaps, item => {
if (item) {
rest.push(item);
}
});
return rest;
},
setRowGroups(fieldOrColumns) {
const { aggregateConfig, rowGroupConfig } = props;
const aggregateOpts = computeAggregateOpts.value;
const { maxGroupSize } = aggregateOpts;
if (!(aggregateConfig || rowGroupConfig)) {
errLog$2('vxe.error.reqProp', ['aggregate-config']);
return nextTick();
}
const confList = fieldOrColumns ? (XEUtils.isArray(fieldOrColumns) ? fieldOrColumns : [fieldOrColumns]) : [];
if (maxGroupSize && confList.length > maxGroupSize) {
if (VxeUI.modal) {
VxeUI.modal.message({
status: 'error',
content: getI18n$2('vxe.table.maxGroupCol', [maxGroupSize])
});
}
return nextTick();
}
if (confList.length) {
handleUpdateRowGroup(confList.map(fieldOrColumn => {
return XEUtils.isString(fieldOrColumn) ? fieldOrColumn : fieldOrColumn.field;
}));
return loadTableData(internalData.tableSynchData, false, true);
}
return nextTick();
},
getRowGroups() {
const { aggregateConfig, rowGroupConfig } = props;
const { fullColumnFieldData } = internalData;
if (aggregateConfig || rowGroupConfig) {
const { rowGroupList } = reactData;
return rowGroupList.map(({ field }) => {
const colRet = fullColumnFieldData[field];
if (colRet) {
return colRet.column;
}
return { field };
});
}
return [];
},
getRowGroupFields() {
return $xeTable.getRowGroups().map(item => item.field);
},
clearRowGroups() {
const { aggregateConfig, rowGroupConfig } = props;
if (!(aggregateConfig || rowGroupConfig)) {
errLog$2('vxe.error.reqProp', ['aggregate-config']);
return nextTick();
}
handleUpdateRowGroup([]);
return loadTableData(internalData.tableSynchData, false, true);
},
isRowGroupRecord(row) {
warnLog$2('vxe.error.delFunc', ['isRowGroupRecord', 'isAggregateRecord']);
return $xeTable.isAggregateRecord(row);
},
isRowGroupExpandByRow(row) {
warnLog$2('vxe.error.delFunc', ['isRowGroupExpandByRow', 'isAggregateExpandByRow']);
return $xeTable.isAggregateExpandByRow(row);
},
isAggregateRecord(row) {
const { isRowGroupStatus } = reactData;
return isRowGroupStatus && row.isAggregate;
},
getAggregateContentByRow(row) {
const { isRowGroupStatus } = reactData;
return isRowGroupStatus && row && row.isAggregate ? row.groupContent : '';
},
getAggregateRowChildren(row) {
const aggregateOpts = computeAggregateOpts.value;
const { childrenField, mapChildrenField } = aggregateOpts;
const { isRowGroupStatus } = reactData;
return isRowGroupStatus && row && row.isAggregate && childrenField && mapChildrenField ? (row[mapChildrenField] || []) : [];
},
refreshAggregateCalcValues() {
updateGroupData();
return nextTick();
},
isAggregateExpandByRow(row) {
const { rowGroupExpandedFlag } = reactData;
const { rowGroupExpandedMaps } = internalData;
return !!rowGroupExpandedFlag && !!rowGroupExpandedMaps[getRowid($xeTable, row)];
},
setRowGroupExpand(rows, expanded) {
if (rows) {
if (!XEUtils.isArray(rows)) {
rows = [rows];
}
return handleRowGroupVirtualExpand(rows, expanded);
}
return nextTick();
},
setRowGroupExpandByField(groupFields, expanded) {
const { isRowGroupStatus } = reactData;
const aggregateOpts = computeAggregateOpts.value;
const { childrenField } = aggregateOpts;
if (groupFields) {
if (!XEUtils.isArray(groupFields)) {
groupFields = [groupFields];
}
if (isRowGroupStatus) {
const rows = [];
const gfKeys = {};
groupFields.forEach(groupField => {
gfKeys[groupField] = true;
});
XEUtils.eachTree(internalData.afterGroupFullData, (row) => {
if (row.isAggregate && gfKeys[row.groupField]) {
rows.push(row);
}
}, { children: childrenField });
if (rows.length) {
return handleRowGroupVirtualExpand(rows, expanded);
}
}
}
return nextTick();
},
setAllRowGroupExpand(expanded) {
const { tableFullGroupData } = internalData;
const aggregateOpts = computeAggregateOpts.value;
const { mapChildrenField } = aggregateOpts;
const rgExpandedMaps = {};
if (expanded && mapChildrenField) {
XEUtils.eachTree(tableFullGroupData, (row) => {
if (row[mapChildrenField] && row[mapChildrenField].length) {
rgExpandedMaps[getRowid($xeTable, row)] = row;
}
}, { children: mapChildrenField });
}
internalData.rowGroupExpandedMaps = rgExpandedMaps;
handleVirtualTreeToList();
$xeTable.handleTableData();
updateAfterDataIndex();
reactData.rowGroupExpandedFlag++;
return handleLazyRecalculate(true, true, true);
},
clearRowGroupExpand() {
internalData.rowGroupExpandedMaps = {};
handleVirtualTreeToList();
$xeTable.handleTableData();
updateAfterDataIndex();
reactData.rowGroupExpandedFlag++;
return handleLazyRecalculate(true, true, true);
},
getTreeExpandRecords() {
const rest = [];
XEUtils.each(internalData.treeExpandedMaps, item => {
if (item) {
rest.push(item);
}
});
return rest;
},
/**
* 判断树节点是否懒加载完成
* @param {Row} row 行对象
*/
isTreeExpandLoaded(row) {
const { fullAllDataRowIdData } = internalData;
const rowRest = fullAllDataRowIdData[getRowid($xeTable, row)];
return rowRest && !!rowRest.treeLoaded;
},
clearTreeExpandLoaded(rows) {
const { fullAllDataRowIdData, treeExpandedMaps } = internalData;
const treeOpts = computeTreeOpts.value;
const { transform } = treeOpts;
if (rows) {
if (!XEUtils.isArray(rows)) {
rows = [rows];
}
rows.forEach((row) => {
const rowid = getRowid($xeTable, row);
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
rowRest.treeLoaded = false;
if (treeExpandedMaps[rowid]) {
delete treeExpandedMaps[rowid];
}
}
});
}
else {
XEUtils.each(fullAllDataRowIdData, (rowRest) => {
rowRest.treeLoaded = false;
});
internalData.treeExpandedMaps = {};
}
if (transform) {
handleVirtualTreeToList();
$xeTable.handleTableData();
}
reactData.treeExpandedFlag++;
return nextTick();
},
/**
* 重新懒加载树节点,并展开该节点
* @param {Row} row 行对象
*/
reloadTreeExpand(row) {
const { treeExpandLazyLoadedMaps } = internalData;
const treeOpts = computeTreeOpts.value;
const hasChildField = treeOpts.hasChild || treeOpts.hasChildField;
const { transform, lazy } = treeOpts;
const rowid = getRowid($xeTable, row);
if (lazy && row[hasChildField] && !treeExpandLazyLoadedMaps[rowid]) {
return $xeTable.clearTreeExpandLoaded(row).then(() => {
return handleAsyncTreeExpandChilds(row);
}).then(() => {
if (transform) {
handleVirtualTreeToList();
$xeTable.handleTableData();
}
reactData.treeExpandedFlag++;
}).then(() => {
return $xeTable.recalculate();
});
}
return nextTick();
},
reloadTreeChilds(row) {
warnLog$2('vxe.error.delFunc', ['reloadTreeChilds', 'reloadTreeExpand']);
// 即将废弃
return $xeTable.reloadTreeExpand(row);
},
/**
* 切换/展开树节点
*/
toggleTreeExpand(row) {
return $xeTable.setTreeExpand(row, !$xeTable.isTreeExpandByRow(row));
},
/**
* 设置所有树节点的展开与否
* @param {Boolean} expanded 是否展开
*/
setAllTreeExpand(expanded) {
const { tableFullTreeData } = internalData;
const treeOpts = computeTreeOpts.value;
const { transform, lazy } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
const expandeds = [];
XEUtils.eachTree(tableFullTreeData, (row) => {
const rowChildren = row[childrenField];
if (lazy || (rowChildren && rowChildren.length)) {
expandeds.push(row);
}
}, { children: childrenField });
return $xeTable.setTreeExpand(expandeds, expanded).then(() => {
if (transform) {
handleVirtualTreeToList();
reactData.treeExpandedFlag++;
return $xeTable.recalculate();
}
});
},
/**
* 设置展开树形节点,二个参数设置这一行展开与否
* 支持单行
* 支持多行
* @param {Array/Row} rows 行数据
* @param {Boolean} expanded 是否展开
*/
setTreeExpand(rows, expanded) {
const treeOpts = computeTreeOpts.value;
const { transform } = treeOpts;
if (rows) {
if (!XEUtils.isArray(rows)) {
rows = [rows];
}
if (rows.length) {
// 如果为虚拟树
if (transform) {
return handleVirtualTreeExpand(rows, expanded);
}
else {
return handleBaseTreeExpand(rows, expanded);
}
}
}
return nextTick();
},
/**
* 判断行是否为树形节点展开状态
* @param {Row} row 行对象
*/
isTreeExpandByRow(row) {
const { treeExpandedFlag } = reactData;
const { treeExpandedMaps } = internalData;
return !!treeExpandedFlag && !!treeExpandedMaps[getRowid($xeTable, row)];
},
/**
* 手动清空树形节点的展开状态,数据会恢复成未展开的状态
*/
clearTreeExpand() {
const { tableFullTreeData } = internalData;
const treeOpts = computeTreeOpts.value;
const childrenField = treeOpts.children || treeOpts.childrenField;
const { transform, reserve } = treeOpts;
const expList = $xeTable.getTreeExpandRecords();
internalData.treeExpandedMaps = {};
if (reserve) {
XEUtils.eachTree(tableFullTreeData, row => handleTreeExpandReserve(row, false), { children: childrenField });
}
return $xeTable.handleTableData().then(() => {
if (transform) {
handleVirtualTreeToList();
$xeTable.handleTableData();
}
reactData.treeExpandedFlag++;
}).then(() => {
updateTreeLineStyle();
if (expList.length) {
return $xeTable.recalculate();
}
});
},
clearTreeExpandReserve() {
internalData.treeExpandedReserveRowMap = {};
return nextTick();
},
/**
* 获取表格的滚动状态
*/
getScroll() {
return $xeTable.getScrollData();
},
/**
* 获取表格的滚动数据
*/
getScrollData() {
const { scrollXLoad, scrollYLoad, scrollbarHeight, scrollbarWidth } = reactData;
const { elemStore } = internalData;
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const scrollTop = bodyScrollElem ? bodyScrollElem.scrollTop : 0;
const scrollLeft = bodyScrollElem ? bodyScrollElem.scrollLeft : 0;
const clientHeight = bodyScrollElem ? bodyScrollElem.clientHeight : 0;
const clientWidth = bodyScrollElem ? bodyScrollElem.clientWidth : 0;
const scrollHeight = bodyScrollElem ? bodyScrollElem.scrollHeight : 0;
const scrollWidth = bodyScrollElem ? bodyScrollElem.scrollWidth : 0;
const isTop = scrollTop <= 0;
const isBottom = scrollTop + clientHeight >= scrollHeight;
const isLeft = scrollLeft <= 0;
const isRight = scrollLeft + clientWidth >= scrollWidth;
return {
virtualX: scrollXLoad,
virtualY: scrollYLoad,
isTop,
isBottom,
isLeft,
isRight,
scrollbarHeight,
scrollbarWidth,
scrollTop,
scrollLeft,
scrollHeight,
scrollWidth,
clientHeight,
clientWidth
};
},
/**
* 如果有滚动条,则滚动到对应的位置
*/
scrollTo(scrollLeft, scrollTop) {
const { elemStore } = internalData;
const headerScrollElem = getRefElem(elemStore['main-header-scroll']);
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const footerScrollElem = getRefElem(elemStore['main-footer-scroll']);
const leftScrollElem = getRefElem(elemStore['left-body-scroll']);
const rightScrollElem = getRefElem(elemStore['right-body-scroll']);
const xHandleEl = refScrollXHandleElem.value;
const yHandleEl = refScrollYHandleElem.value;
internalData.intoRunScroll = true;
if (scrollLeft) {
if (!XEUtils.isNumber(scrollLeft)) {
scrollTop = scrollLeft.top;
scrollLeft = scrollLeft.left;
}
}
if (XEUtils.isNumber(scrollLeft)) {
setScrollLeft(xHandleEl, scrollLeft);
setScrollLeft(bodyScrollElem, scrollLeft);
setScrollLeft(headerScrollElem, scrollLeft);
setScrollLeft(footerScrollElem, scrollLeft);
if (reactData.scrollXLoad) {
loadScrollXData();
}
}
if (XEUtils.isNumber(scrollTop)) {
setScrollTop(yHandleEl, scrollTop);
setScrollTop(bodyScrollElem, scrollTop);
setScrollTop(leftScrollElem, scrollTop);
setScrollTop(rightScrollElem, scrollTop);
if (reactData.scrollYLoad) {
loadScrollYData();
}
}
return new Promise(resolve => {
setTimeout(() => {
nextTick(() => {
internalData.intoRunScroll = false;
resolve();
});
}, (reactData.scrollXLoad || reactData.scrollYLoad) ? 30 : 0);
});
},
/**
* 如果有滚动条,则滚动到对应的行
*/
scrollToRow(rowOrRowid, fieldOrColumn, options) {
const { isAllOverflow, scrollYLoad, scrollXLoad } = reactData;
const { fullAllDataRowIdData, _sToTime } = internalData;
const rest = [];
let row;
if (XEUtils.isString(rowOrRowid) || XEUtils.isNumber(rowOrRowid)) {
const rowid = rowOrRowid;
const rowRest = rowid ? fullAllDataRowIdData[rowid] : null;
if (rowRest) {
row = rowRest.row;
}
}
else {
row = rowOrRowid;
}
if (row) {
if (props.treeConfig) {
rest.push($xeTable.scrollToTreeRow(row));
}
else {
rest.push(rowToVisible($xeTable, row));
}
}
if (fieldOrColumn) {
rest.push(handleScrollToRowColumn(fieldOrColumn, row, options));
}
if (_sToTime) {
clearTimeout(_sToTime);
}
return Promise.all(rest).then(() => {
if (row) {
if (!isAllOverflow && (scrollYLoad || scrollXLoad)) {
calcCellHeight();
calcCellWidth();
// 可视区被渲染后位置被偏移
internalData._sToTime = setTimeout(() => {
internalData._sToTime = undefined;
if (scrollYLoad) {
if (props.treeConfig) {
$xeTable.scrollToTreeRow(row);
}
else {
rowToVisible($xeTable, row);
}
}
if (scrollXLoad && fieldOrColumn) {
handleScrollToRowColumn(fieldOrColumn, row, options);
}
}, 350);
}
return nextTick();
}
});
},
/**
* 如果有滚动条,则滚动到第一行
*/
scrollToStartRow(fieldOrColumn, options) {
const { afterFullData } = internalData;
return $xeTable.scrollToRow(afterFullData[0], fieldOrColumn, options);
},
/**
* 如果有滚动条,则滚动到最后一行
*/
scrollToEndRow(fieldOrColumn, options) {
const { afterFullData } = internalData;
return $xeTable.scrollToRow(afterFullData[afterFullData.length - 1], fieldOrColumn, options);
},
/**
* 如果有滚动条,则滚动到对应的列
*/
scrollToColumn(fieldOrColumn, options) {
return handleScrollToRowColumn(fieldOrColumn, null, options);
},
/**
* 如果有滚动条,则滚动到第一列
*/
scrollToStartColumn(options) {
const { visibleColumn } = internalData;
return $xeTable.scrollToColumn(visibleColumn[0], options);
},
/**
* 如果有滚动条,则滚动到最后一列
*/
scrollToEndColumn(options) {
const { visibleColumn } = internalData;
return $xeTable.scrollToColumn(visibleColumn[visibleColumn.length - 1], options);
},
/**
* 手动清除滚动相关信息,还原到初始状态
*/
clearScroll() {
const { elemStore, scrollXStore, scrollYStore } = internalData;
const headerScrollElem = getRefElem(elemStore['main-header-scroll']);
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const footerScrollElem = getRefElem(elemStore['main-footer-scroll']);
const leftScrollElem = getRefElem(elemStore['left-body-scroll']);
const rightScrollElem = getRefElem(elemStore['right-body-scroll']);
const xHandleEl = refScrollXHandleElem.value;
const yHandleEl = refScrollYHandleElem.value;
internalData.intoRunScroll = true;
setScrollLeft(xHandleEl, 0);
setScrollLeft(bodyScrollElem, 0);
setScrollLeft(headerScrollElem, 0);
setScrollLeft(footerScrollElem, 0);
setScrollTop(yHandleEl, 0);
setScrollTop(bodyScrollElem, 0);
setScrollTop(leftScrollElem, 0);
setScrollTop(rightScrollElem, 0);
scrollXStore.startIndex = 0;
scrollXStore.visibleStartIndex = 0;
scrollXStore.endIndex = scrollXStore.visibleSize;
scrollXStore.visibleEndIndex = scrollXStore.visibleSize;
scrollYStore.startIndex = 0;
scrollYStore.visibleStartIndex = 0;
scrollYStore.endIndex = scrollYStore.visibleSize;
scrollYStore.visibleEndIndex = scrollYStore.visibleSize;
return nextTick().then(() => {
internalData.lastScrollLeft = 0;
internalData.lastScrollTop = 0;
internalData.intoRunScroll = false;
});
},
/**
* 更新表尾合计
*/
updateFooter() {
const { showFooter, footerData, footerMethod } = props;
const { visibleColumn, afterFullData } = internalData;
let footData = [];
if (showFooter && footerData && footerData.length) {
footData = footerData.slice(0);
}
else if (showFooter && footerMethod) {
footData = visibleColumn.length ? footerMethod({ columns: visibleColumn, data: afterFullData, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt }) : [];
}
reactData.footerTableData = footData;
$xeTable.clearFooterFormatterCache();
$xeTable.handleUpdateFooterMerge();
$xeTable.dispatchEvent('footer-data-change', {
visibleColumn: internalData.visibleColumn,
footData
}, null);
return nextTick();
},
/**
* 更新列状态 updateStatus({ row, column }, cellValue)
* 如果组件值 v-model 发生 change 时,调用改函数用于更新某一列编辑状态
* 如果单元格配置了校验规则,则会进行校验
*/
updateStatus(slotParams, cellValue) {
return nextTick().then(() => {
const { editRules } = props;
const { isActivated } = internalData;
if (isActivated && slotParams && editRules) {
return $xeTable.handleCellRuleUpdateStatus('change', slotParams, cellValue);
}
});
},
/**
* 设置合并单元格 [{ row: Row|number, column: ColumnInfo|number, rowspan: number, colspan: number }]
*/
setMergeCells(merges) {
if (props.spanMethod) {
errLog$2('vxe.error.errConflicts', ['merge-cells', 'span-method']);
}
handleBodyMerge(merges);
$xeTable.handleUpdateBodyMerge();
return nextTick().then(() => {
const { expandColumn } = reactData;
const { mergeBodyList } = internalData;
if (expandColumn && mergeBodyList.length) {
warnLog$2('vxe.error.errConflicts', ['type=expand', 'merge-cells | span-method']);
}
$xeTable.updateCellAreas();
return updateStyle();
});
},
/**
* 移除单元格合并 [{row:Row|number, col:ColumnInfo|number}]
*/
removeMergeCells(merges) {
if (props.spanMethod) {
errLog$2('vxe.error.errConflicts', ['merge-cells', 'span-method']);
}
const rest = removeBodyMerges(merges);
$xeTable.handleUpdateBodyMerge();
return nextTick().then(() => {
$xeTable.updateCellAreas();
updateStyle();
return rest;
});
},
/**
* 获取所有被合并的单元格
*/
getMergeCells() {
return internalData.mergeBodyList.slice(0);
},
/**
* 清除所有单元格合并
*/
clearMergeCells() {
internalData.mergeBodyList = [];
internalData.mergeBodyMaps = {};
internalData.mergeBodyCellMaps = {};
internalData.mergeBodyRowMaps = {};
internalData.mergeBodyColMaps = {};
reactData.mergeBodyFlag++;
return nextTick().then(() => {
return updateStyle();
});
},
setMergeHeaderCells(merges) {
handleHeaderMerge(merges);
$xeTable.handleUpdateHeaderMerge();
return nextTick().then(() => {
return updateStyle();
});
},
/**
* 移除表头单元格合并 [{row:Row|number, col:ColumnInfo|number}]
*/
removeMergeHeaderCells(merges) {
const rest = removeHeaderMerges(merges);
$xeTable.handleUpdateHeaderMerge();
return nextTick().then(() => {
updateStyle();
return rest;
});
},
/**
* 获取所有被合并的表头单元格
*/
getMergeHeaderCells() {
return internalData.mergeHeaderList.slice(0);
},
/**
* 清除所有表头单元格合并
*/
clearMergeHeaderCells() {
internalData.mergeHeaderList = [];
internalData.mergeHeaderMaps = {};
internalData.mergeHeaderCellMaps = {};
internalData.mergeHeaderRowMaps = {};
internalData.mergeBodyColMaps = {};
reactData.mergeHeadFlag++;
return nextTick().then(() => {
return updateStyle();
});
},
setMergeFooterCells(merges) {
if (props.footerSpanMethod) {
errLog$2('vxe.error.errConflicts', ['merge-footer-cells | merge-footer-items', 'footer-span-method']);
}
handleFooterMerge(merges);
$xeTable.handleUpdateFooterMerge();
return nextTick().then(() => {
return updateStyle();
});
},
setMergeFooterItems(merges) {
// errLog('vxe.error.delFunc', ['setMergeFooterItems', 'setMergeFooterCells'])
return $xeTable.setMergeFooterCells(merges);
},
removeMergeFooterCells(merges) {
if (props.footerSpanMethod) {
errLog$2('vxe.error.errConflicts', ['merge-footer-cells | merge-footer-items', 'footer-span-method']);
}
const rest = removeFooterMerges(merges);
$xeTable.handleUpdateFooterMerge();
return nextTick().then(() => {
updateStyle();
return rest;
});
},
removeMergeFooterItems(merges) {
// errLog('vxe.error.delFunc', ['removeMergeFooterItems', 'removeMergeFooterCells'])
return $xeTable.removeMergeFooterCells(merges);
},
/**
* 获取所有被合并的表尾
*/
getMergeFooterCells() {
return internalData.mergeFooterList.slice(0);
},
getMergeFooterItems() {
// errLog('vxe.error.delFunc', ['getMergeFooterItems', 'getMergeFooterCells'])
return $xeTable.getMergeFooterCells();
},
/**
* 清除所有表尾合并
*/
clearMergeFooterCells() {
internalData.mergeFooterList = [];
internalData.mergeFooterMaps = {};
internalData.mergeFooterCellMaps = {};
internalData.mergeFooterRowMaps = {};
internalData.mergeFooterColMaps = {};
reactData.mergeFootFlag++;
return nextTick().then(() => {
return updateStyle();
});
},
clearMergeFooterItems() {
// errLog('vxe.error.delFunc', ['clearMergeFooterItems', 'clearMergeFooterCells'])
return $xeTable.clearMergeFooterCells();
},
updateCellAreas() {
const { mouseConfig } = props;
const mouseOpts = computeMouseOpts.value;
if (mouseConfig && mouseOpts.area && $xeTable.handleRecalculateCellAreaEvent) {
return $xeTable.handleRecalculateCellAreaEvent();
}
return nextTick();
},
undo() {
return $xeTable.handleUndoStackEvent(null);
},
redo() {
return $xeTable.handleRedoStackEvent(null);
},
clearHistory() {
return $xeTable.handleClearStack();
},
/**
* 用于 custom-config,用于手动恢复自定义列设置信息,恢复表格重置为初始状态
* @param storeData
* @returns
*/
setCustomStoreData(storeData) {
if (!storeData) {
return nextTick();
}
const customOpts = computeCustomOpts.value;
const { checkMethod } = customOpts;
// 重置状态
clearTableAllStatus($xeTable);
// 恢复列
const allCols = [];
XEUtils.eachTree(internalData.collectColumn, (column) => {
column.resizeWidth = 0;
column.fixed = column.defaultFixed;
column.renderSortNumber = column.sortNumber;
column.parentId = column.defaultParentId;
if (!checkMethod || checkMethod({ $table: $xeTable, column })) {
column.visible = column.defaultVisible;
}
column.align = column.defaultAlign;
column.headerAlign = column.defaultHeaderAlign;
column.footerAlign = column.defaultFooterAlign;
column.aggFunc = column.defaultAggFunc;
column.renderAggFn = column.defaultAggFunc;
column.renderResizeWidth = column.renderWidth;
allCols.push(column);
});
const newCollectCols = XEUtils.toArrayTree(XEUtils.orderBy(allCols, 'renderSortNumber'), { key: 'id', parentKey: 'parentId', children: 'children' });
internalData.collectColumn = newCollectCols;
internalData.tableFullColumn = getColumnList(newCollectCols);
reactData.updateColFlag++;
reactData.isColLoading = true;
initColumnHierarchy();
return Promise.resolve(handleCustomRestore(storeData)).then(() => {
return buildColumnInfo();
}).then(() => {
// 恢复数据聚合分组
const { isRowGroupStatus, rowGroupList } = reactData;
if (isRowGroupStatus && !!$xeTable.handlePivotTableAggData) {
const rowGroupFields = computeRowGroupFields.value;
if (rowGroupFields ? rowGroupFields.length : rowGroupList.length) {
if (rowGroupFields && rowGroupFields.length) {
$xeTable.setRowGroups(rowGroupFields);
}
else {
$xeTable.clearRowGroups();
}
}
else {
$xeTable.handleUpdateAggData();
}
}
});
},
/**
* 用于 custom-config,用于获取自定义列设置信息,用于自定义保持
* @returns
*/
getCustomStoreData() {
const { id } = props;
const customOpts = computeCustomOpts.value;
const { isRowGroupStatus, rowGroupList } = reactData;
const { fullColumnFieldData, collectColumn } = internalData;
const { storage, checkMethod } = customOpts;
const { isCustomAlign, isCustomHeaderAlign, isCustomFooterAlign, isCustomResizable, isCustomVisible, isCustomFixed, isCustomSort, isCustomAggGroup, isCustomAggFunc, isCustomPager } = handleCustomStoreConfig($xeTable);
const alignData = {};
const headerAlignData = {};
const footerAlignData = {};
const resizableData = {};
const sortData = [];
const visibleData = {};
const fixedData = {};
const aggGroupData = {};
const aggFuncData = {};
const storeData = {
pagerData: isCustomPager && $xeGGWrapper && $xeGGWrapper.getCustomPagerData ? $xeGGWrapper.getCustomPagerData() : undefined,
alignData: undefined,
headerAlignData: undefined,
footerAlignData: undefined,
resizableData: undefined,
sortData: undefined,
visibleData: undefined,
fixedData: undefined,
aggGroupData: undefined,
aggFuncData: undefined
};
if (!id) {
if (storage) {
errLog$2('vxe.error.reqProp', ['id']);
}
return storeData;
}
let hasAlign = 0;
let hasHeaderAlign = 0;
let hasFooterAlign = 0;
let hasResizable = 0;
let hasSort = 0;
let hasFixed = 0;
let hasVisible = 0;
let hasAggFunc = 0;
const sortMaps = {};
XEUtils.eachTree(collectColumn, (column, index, items, path, parentColumn) => {
const colKey = column.getKey();
if (!colKey) {
errLog$2('vxe.error.reqProp', [`${column.getTitle() || column.type || ''} -> column.field=?`]);
return;
}
if (parentColumn) {
if (isCustomSort) {
const pColKey = parentColumn.getKey();
const psObj = sortMaps[pColKey];
hasSort = 1;
if (psObj) {
const sObj = { k: colKey };
sortMaps[colKey] = sObj;
if (!psObj.c) {
psObj.c = [];
}
psObj.c.push(sObj);
}
}
}
else {
if (isCustomSort) {
hasSort = 1;
const sObj = { k: colKey };
sortMaps[colKey] = sObj;
sortData.push(sObj);
}
// 只支持一级
if (isCustomFixed && (column.fixed || '') !== (column.defaultFixed || '')) {
hasFixed = 1;
fixedData[colKey] = column.fixed;
}
}
if (isCustomAlign && column.align) {
hasAlign = 1;
alignData[colKey] = column.align;
}
if (isCustomHeaderAlign && column.headerAlign) {
hasHeaderAlign = 1;
headerAlignData[colKey] = column.headerAlign;
}
if (isCustomFooterAlign && column.footerAlign) {
hasFooterAlign = 1;
footerAlignData[colKey] = column.footerAlign;
}
if (isCustomResizable && column.resizeWidth) {
hasResizable = 1;
resizableData[colKey] = column.renderWidth;
}
if (isCustomVisible && (!checkMethod || checkMethod({ $table: $xeTable, column }))) {
if (!column.visible && column.defaultVisible) {
hasVisible = 1;
visibleData[colKey] = false;
}
else if (column.visible && !column.defaultVisible) {
hasVisible = 1;
visibleData[colKey] = true;
}
}
if (isCustomAggFunc && (column.aggFunc || '') !== (column.defaultAggFunc || '')) {
hasAggFunc = 1;
aggFuncData[colKey] = column.aggFunc;
}
});
if (hasAlign) {
storeData.alignData = alignData;
}
if (hasHeaderAlign) {
storeData.headerAlignData = headerAlignData;
}
if (hasFooterAlign) {
storeData.footerAlignData = footerAlignData;
}
if (hasResizable) {
storeData.resizableData = resizableData;
}
if (hasSort) {
storeData.sortData = sortData;
}
if (hasFixed) {
storeData.fixedData = fixedData;
}
if (hasVisible) {
storeData.visibleData = visibleData;
}
if (isCustomAggGroup && isRowGroupStatus) {
rowGroupList.forEach(aggConf => {
const colRest = fullColumnFieldData[aggConf.field];
if (colRest) {
aggGroupData[colRest.column.getKey()] = true;
}
});
storeData.aggGroupData = aggGroupData;
}
if (hasAggFunc) {
storeData.aggFuncData = aggFuncData;
}
return storeData;
},
focus() {
internalData.isActivated = true;
return nextTick();
},
blur() {
internalData.isActivated = false;
return nextTick();
},
/**
* 已废弃,被 connectToolbar 替换
* @deprecated
*/
connect($toolbar) {
return $xeTable.connectToolbar($toolbar);
},
/**
* 连接工具栏
* @param $toolbar
*/
connectToolbar($toolbar) {
if ($toolbar) {
$xeToolbar = $toolbar;
$xeToolbar.syncUpdate({ collectColumn: internalData.collectColumn, $table: $xeTable });
}
else {
errLog$2('vxe.error.barUnableLink');
}
return nextTick();
}
};
/**
* 全局按下事件处理
*/
const handleGlobalMousedownEvent = (evnt) => {
const { editStore, ctxMenuStore, customStore } = reactData;
const { mouseConfig, editRules } = props;
const el = refElem.value;
const editOpts = computeEditOpts.value;
const validOpts = computeValidOpts.value;
const areaOpts = computeAreaOpts.value;
const { actived } = editStore;
const $validTooltip = refValidTooltip.value;
const tableFilter = refTableFilter.value;
const tableCustom = refTableCustom.value;
const tableMenu = refTableMenu.value;
// 筛选
if (tableFilter) {
if (getEventTargetNode(evnt, el, 'vxe-cell--filter').flag) ;
else if (getEventTargetNode(evnt, tableFilter.getRefMaps().refElem.value).flag) ;
else {
if (!getEventTargetNode(evnt, document.body, 'vxe-table--ignore-clear').flag) {
$xeTable.preventEvent(evnt, 'event.clearFilter', internalData._currFilterParams, $xeTable.closeFilter);
}
}
}
// 自定义列
if (tableCustom) {
if (customStore.btnEl === evnt.target || getEventTargetNode(evnt, document.body, 'vxe-toolbar-custom-target').flag) ;
else if (getEventTargetNode(evnt, tableCustom.getRefMaps().refElem.value).flag) ;
else {
if (!getEventTargetNode(evnt, document.body, 'vxe-table--ignore-clear').flag) {
if (customStore.visible && $xeTable.closeCustom) {
$xeTable.preventEvent(evnt, 'event.clearCustom', {}, () => {
$xeTable.closeCustom();
$xeTable.dispatchEvent('custom', { type: 'close' }, evnt);
});
}
}
}
}
// 如果已激活了编辑状态
if (actived.row) {
if (!(editOpts.autoClear === false)) {
// 如果是激活状态,点击了单元格之外
const cell = actived.args.cell;
if ((!cell || !getEventTargetNode(evnt, cell).flag)) {
if ($validTooltip && getEventTargetNode(evnt, $validTooltip.$el).flag) ;
else if (!internalData._lastCallTime || internalData._lastCallTime + 50 < Date.now()) {
// 如果是激活状态,点击了单元格之外
if (!getEventTargetNode(evnt, document.body, 'vxe-table--ignore-clear').flag) {
// 如果手动调用了激活单元格,避免触发源被移除后导致重复关闭
$xeTable.preventEvent(evnt, 'event.clearEdit', actived.args, () => {
let isClear;
if (editOpts.mode === 'row') {
const rowTargetNode = getEventTargetNode(evnt, el, 'vxe-body--row');
const rowNodeRest = rowTargetNode.flag ? $xeTable.getRowNode(rowTargetNode.targetElem) : null;
// row 方式,如果点击了不同行
isClear = rowNodeRest ? !$xeTable.eqRow(rowNodeRest.item, actived.args.row) : false;
}
else {
// cell 方式,如果是非编辑列
isClear = !getEventTargetNode(evnt, el, 'col--edit').flag;
}
// 如果点击表头行,则清除激活状态
if (!isClear) {
isClear = getEventTargetNode(evnt, el, 'vxe-header--row').flag;
}
// 如果点击表尾行,则清除激活状态
if (!isClear) {
isClear = getEventTargetNode(evnt, el, 'vxe-footer--row').flag;
}
// 如果固定了高度且点击了行之外的空白处,则清除激活状态
if (!isClear && props.height && !reactData.overflowY) {
const bodyWrapperElem = evnt.target;
if (hasClass(bodyWrapperElem, 'vxe-table--body-wrapper')) {
isClear = evnt.offsetY < bodyWrapperElem.clientHeight;
}
}
if (isClear ||
// 如果点击了当前表格之外
!getEventTargetNode(evnt, el).flag) {
setTimeout(() => {
$xeTable.handleClearEdit(evnt).then(() => {
// 如果存在校验,点击了表格之外则清除
if (!internalData.isActivated && editRules && validOpts.autoClear) {
reactData.validErrorMaps = {};
}
});
});
}
});
}
}
}
}
}
else if (mouseConfig) {
if (!getEventTargetNode(evnt, el).flag && !($xeGGWrapper && getEventTargetNode(evnt, $xeGGWrapper.getRefMaps().refElem.value).flag) && !(tableMenu && getEventTargetNode(evnt, tableMenu.getRefMaps().refElem.value).flag) && !($xeToolbar && getEventTargetNode(evnt, $xeToolbar.getRefMaps().refElem.value).flag)) {
if ($xeTable.clearSelected) {
$xeTable.clearSelected();
}
if (areaOpts.autoClear) {
if ($xeTable.getCellAreas) {
const cellAreas = $xeTable.getCellAreas();
if (cellAreas && cellAreas.length && !getEventTargetNode(evnt, document.body, 'vxe-table--ignore-areas-clear').flag) {
$xeTable.preventEvent(evnt, 'event.clearAreas', {}, () => {
$xeTable.clearCellAreas();
$xeTable.clearCopyCellArea();
dispatchEvent('clear-cell-area-selection', { cellAreas }, evnt);
});
}
}
}
}
}
// 如果配置了快捷菜单且,点击了其他地方则关闭
if ($xeTable.closeMenu) {
if (ctxMenuStore.visible && tableMenu && !getEventTargetNode(evnt, tableMenu.getRefMaps().refElem.value).flag) {
$xeTable.closeMenu();
}
}
if (!(actived.row && getEventTargetNode(evnt, document.body, 'vxe-table--ignore-clear').flag)) {
const isActivated = getEventTargetNode(evnt, $xeGGWrapper ? $xeGGWrapper.getRefMaps().refElem.value : el).flag;
// 如果存在校验,点击了表格之外则清除
if (!isActivated && editRules && validOpts.autoClear) {
reactData.validErrorMaps = {};
}
// 最后激活的表格
internalData.isActivated = isActivated;
}
};
/**
* 窗口失焦事件处理
*/
const handleGlobalBlurEvent = () => {
$xeTable.closeFilter();
if ($xeTable.closeMenu) {
$xeTable.closeMenu();
}
};
const reUpdateCustomStyleEvent = (evnt) => {
const { customStore } = reactData;
const customOpts = computeCustomOpts.value;
const { popupOptions } = customOpts;
const { transfer } = popupOptions || {};
if (transfer && customStore.visible) {
const tableCustom = refTableCustom.value;
if (tableCustom && $xeTable.handleCustomStyle && !checkTargetElement(evnt.target, [tableCustom.getRefMaps().refElem.value], evnt.currentTarget)) {
$xeTable.handleCustomStyle().then(() => {
$xeTable.handleCustomStyle();
});
}
}
};
const handleGlobalScrollEvent = (evnt) => {
reUpdateCustomStyleEvent(evnt);
};
/**
* 全局滚动事件
*/
const handleGlobalMousewheelEvent = () => {
$xeTable.closeTooltip();
if ($xeTable.closeMenu) {
$xeTable.closeMenu();
}
};
/**
* 表格键盘事件
*/
const keydownEvent = (evnt) => {
const { mouseConfig, keyboardConfig } = props;
const { filterStore, ctxMenuStore, editStore } = reactData;
const mouseOpts = computeMouseOpts.value;
const keyboardOpts = computeKeyboardOpts.value;
const { actived } = editStore;
const isEsc = globalEvents$1.hasKey(evnt, GLOBAL_EVENT_KEYS$1.ESCAPE);
if (isEsc) {
$xeTable.preventEvent(evnt, 'event.keydown', null, () => {
dispatchEvent('keydown-start', {}, evnt);
if (keyboardConfig && mouseConfig && mouseOpts.area && $xeTable.handleKdClAreaEvent) {
$xeTable.handleKdClAreaEvent(evnt);
}
else if (actived.row || filterStore.visible || ctxMenuStore.visible) {
evnt.stopPropagation();
// 如果按下了 Esc 键,关闭快捷菜单、筛选
if ($xeTable.closeMenu) {
$xeTable.closeMenu();
}
$xeTable.closeFilter();
if (keyboardConfig && keyboardOpts.isEsc) {
// 如果是激活编辑状态,则取消编辑
if (actived.row) {
const params = actived.args;
$xeTable.handleClearEdit(evnt);
// 如果配置了选中功能,则为选中状态
if (mouseOpts.selected) {
nextTick(() => $xeTable.handleSelected(params, evnt));
}
}
}
}
dispatchEvent('keydown', {}, evnt);
dispatchEvent('keydown-end', {}, evnt);
});
}
};
const contextMenuEvent = (evnt) => {
dispatchEvent('context-menu', {}, evnt);
};
/**
* 全局键盘事件
*/
const handleGlobalKeydownEvent = (evnt) => {
// 该行为只对当前激活的表格有效
if (internalData.isActivated) {
$xeTable.preventEvent(evnt, 'event.keydown', null, () => {
const { mouseConfig, keyboardConfig, treeConfig, editConfig, highlightCurrentRow, highlightCurrentColumn } = props;
const { ctxMenuStore, editStore } = reactData;
const { afterFullData, visibleColumn, currentRow } = internalData;
const isContentMenu = computeIsContentMenu.value;
const bodyMenu = computeBodyMenu.value;
const keyboardOpts = computeKeyboardOpts.value;
const mouseOpts = computeMouseOpts.value;
const editOpts = computeEditOpts.value;
const treeOpts = computeTreeOpts.value;
const menuList = computeMenuList.value;
const rowOpts = computeRowOpts.value;
const columnOpts = computeColumnOpts.value;
const { isLastEnterAppendRow, beforeEnterMethod, enterMethod, isLastTabAppendRow, beforeTabMethod, tabMethod } = keyboardOpts;
const { selected, actived } = editStore;
const childrenField = treeOpts.children || treeOpts.childrenField;
const keyCode = evnt.keyCode;
const isProcess = globalEvents$1.hasKey(evnt, GLOBAL_EVENT_KEYS$1.PROCESS);
const isEsc = globalEvents$1.hasKey(evnt, GLOBAL_EVENT_KEYS$1.ESCAPE);
const hasBackspaceKey = globalEvents$1.hasKey(evnt, GLOBAL_EVENT_KEYS$1.BACKSPACE);
const isTab = globalEvents$1.hasKey(evnt, GLOBAL_EVENT_KEYS$1.TAB);
const isEnter = globalEvents$1.hasKey(evnt, GLOBAL_EVENT_KEYS$1.ENTER);
const isSpacebar = globalEvents$1.hasKey(evnt, GLOBAL_EVENT_KEYS$1.SPACEBAR);
const isLeftArrow = globalEvents$1.hasKey(evnt, GLOBAL_EVENT_KEYS$1.ARROW_LEFT);
const isUpArrow = globalEvents$1.hasKey(evnt, GLOBAL_EVENT_KEYS$1.ARROW_UP);
const isRightArrow = globalEvents$1.hasKey(evnt, GLOBAL_EVENT_KEYS$1.ARROW_RIGHT);
const isDwArrow = globalEvents$1.hasKey(evnt, GLOBAL_EVENT_KEYS$1.ARROW_DOWN);
const hasDeleteKey = globalEvents$1.hasKey(evnt, GLOBAL_EVENT_KEYS$1.DELETE);
const isY = globalEvents$1.hasKey(evnt, GLOBAL_EVENT_KEYS$1.Y);
const isZ = globalEvents$1.hasKey(evnt, GLOBAL_EVENT_KEYS$1.Z);
const isF2 = globalEvents$1.hasKey(evnt, GLOBAL_EVENT_KEYS$1.F2);
const isContextMenu = globalEvents$1.hasKey(evnt, GLOBAL_EVENT_KEYS$1.CONTEXT_MENU);
const isControlKey = hasControlKey(evnt);
const hasShiftKey = evnt.shiftKey;
const isAltKey = evnt.altKey;
const operArrow = isLeftArrow || isUpArrow || isRightArrow || isDwArrow;
const operCtxMenu = isContentMenu && ctxMenuStore.visible && (isEnter || isSpacebar || operArrow);
const isEditStatus = isEnableConf(editConfig) && actived.column && actived.row;
const beforeEditMethod = editOpts.beforeEditMethod || editOpts.activeMethod;
const selectRow = selected.row;
const selectColumn = selected.column;
if (operCtxMenu) {
// 如果配置了右键菜单; 支持方向键操作、回车
evnt.preventDefault();
if (ctxMenuStore.showChild && hasChildrenList(ctxMenuStore.selected)) {
$xeTable.moveCtxMenu(evnt, ctxMenuStore, 'selectChild', isLeftArrow, false, ctxMenuStore.selected.children);
}
else {
$xeTable.moveCtxMenu(evnt, ctxMenuStore, 'selected', isRightArrow, true, menuList);
}
}
else if (keyboardConfig && mouseConfig && mouseOpts.area && $xeTable.handleKdClAreaEvent) {
$xeTable.handleKdClAreaEvent(evnt);
}
else if (isEsc) {
// 如果按下了 Esc 键,关闭快捷菜单、筛选
if ($xeTable.closeMenu) {
$xeTable.closeMenu();
}
$xeTable.closeFilter();
if (keyboardConfig && keyboardOpts.isEsc) {
// 如果是激活编辑状态,则取消编辑
if (actived.row) {
const params = actived.args;
$xeTable.handleClearEdit(evnt);
// 如果配置了选中功能,则为选中状态
if (mouseOpts.selected) {
nextTick(() => $xeTable.handleSelected(params, evnt));
}
}
}
}
else if (isSpacebar && keyboardConfig && keyboardOpts.isChecked && selectRow && selectColumn && (selectColumn.type === 'checkbox' || selectColumn.type === 'radio')) {
// 空格键支持选中复选框
evnt.preventDefault();
if (selectColumn.type === 'checkbox') {
$xeTable.handleToggleCheckRowEvent(evnt, selected.args);
}
else {
$xeTable.triggerRadioRowEvent(evnt, selected.args);
}
}
else if (isF2 && isEnableConf(editConfig)) {
if (!isEditStatus) {
// 如果按下了 F2 键
if (selectRow && selectColumn) {
evnt.preventDefault();
$xeTable.handleEdit(selected.args, evnt);
}
}
}
else if (isContextMenu) {
// 如果按下上下文键
internalData._keyCtx = selectRow && selectColumn && bodyMenu.length;
clearTimeout(internalData.keyCtxTimeout);
internalData.keyCtxTimeout = setTimeout(() => {
internalData._keyCtx = false;
}, 1000);
}
else if (isEnter && !isAltKey && keyboardConfig && keyboardOpts.isEnter && (selectRow || actived.row || (treeConfig && (rowOpts.isCurrent || highlightCurrentRow) && currentRow))) {
// 退出选中
if (isControlKey) {
// 如果是激活编辑状态,则取消编辑
if (actived.row) {
const params = actived.args;
$xeTable.handleClearEdit(evnt);
// 如果配置了选中功能,则为选中状态
if (mouseOpts.selected) {
nextTick(() => {
$xeTable.handleSelected(params, evnt);
});
}
}
}
else {
// 如果是激活状态,退则出到上一行/下一行
if (selectRow || actived.row) {
const activeRow = selectRow || actived.row;
const activeColumn = selectColumn || actived.column;
if (activeColumn) {
const activeParams = selectRow ? selected.args : actived.args;
if (hasShiftKey) {
if (keyboardOpts.enterToTab) {
$xeTable.moveTabSelected(activeParams, hasShiftKey, evnt);
}
else {
$xeTable.moveEnterSelected(activeParams, isLeftArrow, true, isRightArrow, false, evnt);
}
}
else {
const _rowIndex = $xeTable.getVTRowIndex(activeRow);
const _columnIndex = $xeTable.getVTColumnIndex(activeColumn);
if (keyboardOpts.enterToTab) {
const ttrParams = {
row: activeRow,
rowIndex: $xeTable.getRowIndex(activeRow),
$rowIndex: $xeTable.getVMRowIndex(activeRow),
_rowIndex,
column: activeColumn,
columnIndex: $xeTable.getColumnIndex(activeColumn),
$columnIndex: $xeTable.getVMColumnIndex(activeColumn),
_columnIndex,
$table: $xeTable
};
if (!beforeTabMethod || beforeTabMethod(ttrParams) !== false) {
evnt.preventDefault();
// 最后一行按下Tab键,自动追加一行
if (isLastTabAppendRow) {
const newColumn = visibleColumn[0];
if (_rowIndex >= afterFullData.length - 1 && _columnIndex >= visibleColumn.length - 1) {
if (actived.row) {
$xeTable.handleClearEdit(evnt);
}
$xeTable.insertAt({}, -1).then(({ row: newRow }) => {
$xeTable.scrollToRow(newRow, newColumn);
$xeTable.handleSelected(Object.assign(Object.assign({}, activeParams), { row: newRow, column: newColumn }), evnt);
});
$xeTable.dispatchEvent('tab-append-row', ttrParams, evnt);
return;
}
}
if (tabMethod) {
tabMethod(ttrParams);
}
else {
$xeTable.moveTabSelected(activeParams, hasShiftKey, evnt);
}
}
}
else {
const etrParams = {
row: activeRow,
rowIndex: $xeTable.getRowIndex(activeRow),
$rowIndex: $xeTable.getVMRowIndex(activeRow),
_rowIndex,
column: activeColumn,
columnIndex: $xeTable.getColumnIndex(activeColumn),
$columnIndex: $xeTable.getVMColumnIndex(activeColumn),
_columnIndex,
$table: $xeTable
};
if (!beforeEnterMethod || beforeEnterMethod(etrParams) !== false) {
evnt.preventDefault();
// 最后一行按下回车键,自动追加一行
if (isLastEnterAppendRow) {
if (_rowIndex >= afterFullData.length - 1) {
$xeTable.insertAt({}, -1).then(({ row: newRow }) => {
$xeTable.scrollToRow(newRow, activeColumn);
$xeTable.handleSelected(Object.assign(Object.assign({}, activeParams), { row: newRow }), evnt);
});
$xeTable.dispatchEvent('enter-append-row', etrParams, evnt);
return;
}
}
if (enterMethod) {
enterMethod(etrParams);
}
else {
if (actived.row) {
$xeTable.handleClearEdit(evnt);
}
$xeTable.moveEnterSelected(activeParams, isLeftArrow, false, isRightArrow, true, evnt);
}
}
}
}
}
}
else if (treeConfig && (rowOpts.isCurrent || highlightCurrentRow) && currentRow) {
// 如果是树形表格当前行回车移动到子节点
const childrens = currentRow[childrenField];
if (childrens && childrens.length) {
evnt.preventDefault();
const targetRow = childrens[0];
const params = {
$table: $xeTable,
row: targetRow,
rowIndex: $xeTable.getRowIndex(targetRow),
$rowIndex: $xeTable.getVMRowIndex(targetRow)
};
$xeTable.setTreeExpand(currentRow, true)
.then(() => $xeTable.scrollToRow(targetRow))
.then(() => $xeTable.triggerCurrentRowEvent(evnt, params));
}
}
}
}
else if (operArrow && keyboardConfig && keyboardOpts.isArrow) {
if (!isEditStatus) {
// 如果按下了方向键
if (mouseOpts.selected && selectRow && selectColumn) {
$xeTable.moveArrowSelected(selected.args, isLeftArrow, isUpArrow, isRightArrow, isDwArrow, evnt);
}
else {
// 当前行按键上下移动
if ((isUpArrow || isDwArrow) && (rowOpts.isCurrent || highlightCurrentRow)) {
$xeTable.moveCurrentRow(isUpArrow, isDwArrow, evnt);
}
// 当前行按键左右移动
if ((isLeftArrow || isRightArrow) && (columnOpts.isCurrent || highlightCurrentColumn)) {
$xeTable.moveCurrentColumn(isLeftArrow, isRightArrow, evnt);
}
}
}
}
else if (isTab && keyboardConfig && keyboardOpts.isTab) {
// 如果按下了 Tab 键切换
if (selectRow || actived.row) {
const activeRow = selectRow || actived.row;
const activeColumn = selectColumn || actived.column;
if (activeColumn) {
const activeParams = selectRow ? selected.args : actived.args;
const _rowIndex = $xeTable.getVTRowIndex(activeRow);
const _columnIndex = $xeTable.getVTColumnIndex(activeColumn);
const ttrParams = {
row: activeRow,
rowIndex: $xeTable.getRowIndex(activeRow),
$rowIndex: $xeTable.getVMRowIndex(activeRow),
_rowIndex,
column: activeColumn,
columnIndex: $xeTable.getColumnIndex(activeColumn),
$columnIndex: $xeTable.getVMColumnIndex(activeColumn),
_columnIndex,
$table: $xeTable
};
if (!beforeTabMethod || beforeTabMethod(ttrParams) !== false) {
evnt.preventDefault();
// 最后一行按下Tab键,自动追加一行
if (isLastTabAppendRow) {
const newColumn = visibleColumn[0];
if (_rowIndex >= afterFullData.length - 1 && _columnIndex >= visibleColumn.length - 1) {
if (actived.row) {
$xeTable.handleClearEdit(evnt);
}
$xeTable.insertAt({}, -1).then(({ row: newRow }) => {
$xeTable.scrollToRow(newRow, newColumn);
$xeTable.handleSelected(Object.assign(Object.assign({}, activeParams), { row: newRow, column: newColumn }), evnt);
});
$xeTable.dispatchEvent('tab-append-row', ttrParams, evnt);
return;
}
}
if (tabMethod) {
tabMethod(ttrParams);
}
else {
if (actived.row) {
$xeTable.handleClearEdit(evnt);
}
$xeTable.moveTabSelected(activeParams, hasShiftKey, evnt);
}
}
}
}
}
else if (keyboardConfig && keyboardOpts.isDel && hasDeleteKey && isEnableConf(editConfig) && (selectRow || selectColumn)) {
// 如果是删除键
if (!isEditStatus) {
const { delMethod } = keyboardOpts;
const params = {
row: selectRow,
rowIndex: $xeTable.getRowIndex(selectRow),
column: selectColumn,
columnIndex: $xeTable.getColumnIndex(selectColumn),
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt
};
// 是否被禁用
if (!beforeEditMethod || beforeEditMethod(params)) {
if (delMethod) {
delMethod(params);
}
else {
const selectCellValue = getCellValue(selectRow, selectColumn);
if (selectCellValue !== null) {
$xeTable.handlePushStack();
setCellValue(selectRow, selectColumn, null);
}
}
// 如果按下 del 键,更新表尾数据
$xeTable.updateFooter();
dispatchEvent('cell-delete-value', params, evnt);
}
}
}
else if (hasBackspaceKey && keyboardConfig && keyboardOpts.isBack && isEnableConf(editConfig) && (selectRow || selectColumn)) {
if (!isEditStatus) {
const { backMethod } = keyboardOpts;
// 如果是删除键
if (keyboardOpts.isDel && isEnableConf(editConfig) && (selectRow || selectColumn)) {
const params = {
row: selectRow,
rowIndex: $xeTable.getRowIndex(selectRow),
$rowIndex: $xeTable.getVMRowIndex(selectRow),
_rowIndex: $xeTable.getVTRowIndex(selectRow),
column: selectColumn,
columnIndex: $xeTable.getColumnIndex(selectColumn),
$columnIndex: $xeTable.getVMColumnIndex(selectColumn),
_columnIndex: $xeTable.getVTColumnIndex(selectColumn),
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt
};
// 是否被禁用
if (!beforeEditMethod || beforeEditMethod(params)) {
if (backMethod) {
backMethod(params);
}
else {
$xeTable.handleEdit(params, evnt, {
isClear: true
});
}
dispatchEvent('cell-backspace-value', params, evnt);
}
}
}
}
else if (hasBackspaceKey && keyboardConfig && treeConfig && keyboardOpts.isBack && (rowOpts.isCurrent || highlightCurrentRow) && currentRow) {
// 如果树形表格回退键关闭当前行返回父节点
const { parent: parentRow } = XEUtils.findTree(internalData.afterTreeFullData, item => item === currentRow, { children: childrenField });
if (parentRow) {
evnt.preventDefault();
const params = {
row: parentRow,
rowIndex: $xeTable.getRowIndex(parentRow),
$rowIndex: $xeTable.getVMRowIndex(parentRow),
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt
};
$xeTable.setTreeExpand(parentRow, false)
.then(() => $xeTable.scrollToRow(parentRow))
.then(() => $xeTable.triggerCurrentRowEvent(evnt, params));
}
}
else if (keyboardConfig && keyboardOpts.isUndoRedo && isControlKey && (isZ || isY) && !hasEventInputTarget(evnt.target)) {
if (evnt.target) {
if (isY || (hasShiftKey && isZ)) {
// 恢复被撤销的操作:Ctrl + Y 或 Ctrl + Shift + Z
evnt.preventDefault();
$xeTable.handleRedoStackEvent(evnt);
}
else if (isZ) {
// 撤销上一步操作:Ctrl + Z
evnt.preventDefault();
$xeTable.handleUndoStackEvent(evnt);
}
}
}
else if (keyboardConfig && isEnableConf(editConfig) && keyboardOpts.isEdit && !isControlKey && (isSpacebar || isProcess || evnt.key === 'Process' || (keyCode >= 48 && keyCode <= 57) || (keyCode >= 65 && keyCode <= 90) || (keyCode >= 96 && keyCode <= 111) || (keyCode >= 186 && keyCode <= 192) || (keyCode >= 219 && keyCode <= 222))) {
const { editMode, editMethod } = keyboardOpts;
// 启用编辑后,空格键功能将失效
// if (isSpacebar) {
// evnt.preventDefault()
// }
// 如果是按下非功能键之外允许直接编辑
if (selectColumn && selectRow && isEnableConf(selectColumn.editRender)) {
const beforeEditMethod = editOpts.beforeEditMethod || editOpts.activeMethod;
const params = {
row: selectRow,
rowIndex: $xeTable.getRowIndex(selectRow),
$rowIndex: $xeTable.getVMRowIndex(selectRow),
_rowIndex: $xeTable.getVTRowIndex(selectRow),
column: selectColumn,
columnIndex: $xeTable.getColumnIndex(selectColumn),
$columnIndex: $xeTable.getVMColumnIndex(selectColumn),
_columnIndex: $xeTable.getVTColumnIndex(selectColumn),
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt
};
if (!beforeEditMethod || beforeEditMethod(params)) {
if (editMethod) {
editMethod(params);
}
else {
let isClearValue = false;
// 追加方式与覆盖式
if (editMode !== 'insert') {
isClearValue = true;
}
$xeTable.handleEdit(params, evnt, {
isClear: isClearValue
});
}
}
}
}
dispatchEvent('keydown', {}, evnt);
});
}
};
const handleGlobalPasteEvent = (evnt) => {
const { keyboardConfig, mouseConfig } = props;
const { editStore, filterStore } = reactData;
const { isActivated } = internalData;
const mouseOpts = computeMouseOpts.value;
const keyboardOpts = computeKeyboardOpts.value;
const { actived } = editStore;
if (isActivated && !filterStore.visible) {
if (!(actived.row || actived.column)) {
if (keyboardConfig && keyboardOpts.isClip && mouseConfig && mouseOpts.area && $xeTable.handlePeClAreaEvent) {
$xeTable.handlePeClAreaEvent(evnt);
}
}
dispatchEvent('paste', {}, evnt);
}
};
const handleGlobalCopyEvent = (evnt) => {
const { keyboardConfig, mouseConfig } = props;
const { editStore, filterStore } = reactData;
const { isActivated } = internalData;
const mouseOpts = computeMouseOpts.value;
const keyboardOpts = computeKeyboardOpts.value;
const { actived } = editStore;
if (isActivated && !filterStore.visible) {
if (!(actived.row || actived.column)) {
if (keyboardConfig && keyboardOpts.isClip && mouseConfig && mouseOpts.area && $xeTable.handleCyClAreaEvent) {
$xeTable.handleCyClAreaEvent(evnt);
}
}
dispatchEvent('copy', {}, evnt);
}
};
const handleGlobalCutEvent = (evnt) => {
const { keyboardConfig, mouseConfig } = props;
const { editStore, filterStore } = reactData;
const { isActivated } = internalData;
const mouseOpts = computeMouseOpts.value;
const keyboardOpts = computeKeyboardOpts.value;
const { actived } = editStore;
if (isActivated && !filterStore.visible) {
if (!(actived.row || actived.column)) {
if (keyboardConfig && keyboardOpts.isClip && mouseConfig && mouseOpts.area && $xeTable.handleCutCellAreaEvent) {
$xeTable.handleCutCellAreaEvent(evnt);
}
}
dispatchEvent('cut', {}, evnt);
}
};
const handleGlobalResizeEvent = () => {
if ($xeTable.closeMenu) {
$xeTable.closeMenu();
}
const el = refElem.value;
if (!el || !el.clientWidth) {
return;
}
if (internalData.rsePending) {
return;
}
handleResizeEvent();
};
const handleTargetEnterEvent = (isClear) => {
const $tooltip = refTooltip.value;
clearTimeout(internalData.tooltipTimeout);
if (isClear) {
$xeTable.closeTooltip();
}
else {
if ($tooltip && $tooltip.setActived) {
$tooltip.setActived(true);
}
}
};
const clearCrossTableDragStatus = () => {
crossTableDragRowObj = null;
crossTableDragRowInfo.row = null;
};
const clearDragStatus = () => {
const { dragRow, dragCol } = reactData;
if (dragRow || dragCol) {
clearColDropOrigin();
clearRowDropOrigin();
hideDropTip();
clearCrossTableDragStatus();
reactData.dragRow = null;
reactData.dragCol = null;
}
};
const handleRowDragEndClearStatus = () => {
clearRowDragData();
clearCrossTableDragStatus();
handleRecalculateStyle(false, true, true);
};
const handleColDragEndClearStatus = () => {
clearColDragData();
clearCrossTableDragStatus();
handleRecalculateStyle(true, true, true);
};
const clearRowDropOrigin = () => {
const el = refElem.value;
if (el) {
const clss = 'row--drag-origin';
XEUtils.arrayEach(el.querySelectorAll(`.${clss}`), (elem) => {
elem.draggable = false;
removeClass(elem, clss);
});
}
};
const updateRowDropOrigin = (row) => {
const el = refElem.value;
if (el) {
const clss = 'row--drag-origin';
const rowid = getRowid($xeTable, row);
XEUtils.arrayEach(el.querySelectorAll(`[rowid="${rowid}"]`), (elem) => {
addClass(elem, clss);
});
}
};
const updateRowDropTipContent = (tdEl) => {
const { dragConfig } = props;
const { dragRow } = reactData;
const rowDragOpts = computeRowDragOpts.value;
const { tooltipMethod } = rowDragOpts;
const rTooltipMethod = tooltipMethod || (dragConfig ? dragConfig.rowTooltipMethod : null);
let tipContent = '';
if (rTooltipMethod) {
const rtParams = {
$table: $xeTable,
row: dragRow
};
tipContent = `${rTooltipMethod(rtParams) || ''}`;
}
else {
tipContent = getI18n$2('vxe.table.dragTip', [tdEl.textContent || '']);
}
reactData.dragTipText = tipContent;
};
const updateColDropOrigin = (column) => {
const el = refElem.value;
if (el) {
const colQuerys = [];
XEUtils.eachTree([column], item => {
colQuerys.push(`[colid="${item.id}"]`);
});
const clss = 'col--drag-origin';
XEUtils.arrayEach(el.querySelectorAll(colQuerys.join(',')), (elem) => {
addClass(elem, clss);
});
}
};
const clearColDropOrigin = () => {
const el = refElem.value;
if (el) {
const clss = 'col--drag-origin';
XEUtils.arrayEach(el.querySelectorAll(`.${clss}`), (elem) => {
elem.draggable = false;
removeClass(elem, clss);
});
}
};
const updateColDropTipContent = (tdEl) => {
const { dragCol } = reactData;
const columnDragOpts = computeColumnDragOpts.value;
const { tooltipMethod } = columnDragOpts;
let tipContent = '';
if (tooltipMethod) {
const dtParams = {
$table: $xeTable,
column: dragCol
};
tipContent = `${tooltipMethod(dtParams) || ''}`;
}
else {
tipContent = getI18n$2('vxe.table.dragTip', [tdEl.textContent || '']);
}
reactData.dragTipText = tipContent;
};
const showDropTip = (evnt, trEl, thEl, showLine, dragPos) => {
let wrapperEl = refElem.value;
if ($xeGantt && trEl) {
const { refGanttContainerElem } = $xeGantt.getRefMaps();
const ganttContainerElem = refGanttContainerElem.value;
if (ganttContainerElem) {
wrapperEl = ganttContainerElem;
}
}
if (!wrapperEl) {
return;
}
const { overflowX, scrollbarWidth, overflowY, scrollbarHeight } = reactData;
const { prevDragToChild } = internalData;
const wrapperRect = wrapperEl.getBoundingClientRect();
const osbWidth = overflowY ? scrollbarWidth : 0;
const osbHeight = overflowX ? scrollbarHeight : 0;
const tableWrapperWidth = wrapperEl.clientWidth;
const tableWrapperHeight = wrapperEl.clientHeight;
if (trEl) {
const rdLineEl = refDragRowLineElem.value;
if (rdLineEl) {
if (showLine) {
const scrollbarYToLeft = computeScrollbarYToLeft.value;
const trRect = trEl.getBoundingClientRect();
let trHeight = trEl.clientHeight;
const offsetTop = Math.max(1, trRect.y - wrapperRect.y);
if (offsetTop + trHeight > tableWrapperHeight - osbHeight) {
trHeight = tableWrapperHeight - offsetTop - osbHeight;
}
rdLineEl.style.display = 'block';
rdLineEl.style.left = `${scrollbarYToLeft ? osbWidth : 0}px`;
rdLineEl.style.top = `${offsetTop}px`;
rdLineEl.style.height = `${trHeight}px`;
rdLineEl.style.width = `${tableWrapperWidth - osbWidth}px`;
rdLineEl.setAttribute('drag-pos', dragPos);
rdLineEl.setAttribute('drag-to-child', prevDragToChild ? 'y' : 'n');
}
else {
rdLineEl.style.display = '';
}
}
}
else if (thEl) {
const cdLineEl = refDragColLineElem.value;
if (cdLineEl) {
if (showLine) {
const scrollbarXToTop = computeScrollbarXToTop.value;
const leftContainerElem = refLeftContainer.value;
const leftContainerWidth = leftContainerElem ? leftContainerElem.clientWidth : 0;
const rightContainerElem = refRightContainer.value;
const rightContainerWidth = rightContainerElem ? rightContainerElem.clientWidth : 0;
const thRect = thEl.getBoundingClientRect();
let thWidth = thEl.clientWidth;
const offsetTop = Math.max(0, thRect.y - wrapperRect.y);
const startX = leftContainerWidth;
let offsetLeft = thRect.x - wrapperRect.x;
if (offsetLeft < startX) {
thWidth -= startX - offsetLeft;
offsetLeft = startX;
}
const endX = tableWrapperWidth - rightContainerWidth - (rightContainerWidth ? 0 : osbWidth);
if (offsetLeft + thWidth > endX) {
thWidth = endX - offsetLeft;
}
cdLineEl.style.display = 'block';
cdLineEl.style.top = `${offsetTop}px`;
cdLineEl.style.left = `${offsetLeft}px`;
cdLineEl.style.width = `${thWidth}px`;
if (prevDragToChild) {
cdLineEl.style.height = `${thRect.height}px`;
}
else {
cdLineEl.style.height = `${tableWrapperHeight - offsetTop - (scrollbarXToTop ? 0 : osbHeight)}px`;
}
cdLineEl.setAttribute('drag-pos', dragPos);
cdLineEl.setAttribute('drag-to-child', prevDragToChild ? 'y' : 'n');
}
else {
cdLineEl.style.display = '';
}
}
}
const rdTipEl = refDragTipElem.value;
if (rdTipEl) {
rdTipEl.style.display = 'block';
rdTipEl.style.top = `${Math.min(wrapperEl.clientHeight - wrapperEl.scrollTop - rdTipEl.clientHeight, evnt.clientY - wrapperRect.y)}px`;
rdTipEl.style.left = `${Math.min(wrapperEl.clientWidth - wrapperEl.scrollLeft - rdTipEl.clientWidth - 16, evnt.clientX - wrapperRect.x)}px`;
rdTipEl.setAttribute('drag-status', showLine ? (prevDragToChild ? 'sub' : 'normal') : 'disabled');
}
};
const hideDropTip = () => {
const rdTipEl = refDragTipElem.value;
const rdLineEl = refDragRowLineElem.value;
const cdLineEl = refDragColLineElem.value;
if (rdTipEl) {
rdTipEl.style.display = '';
}
if (rdLineEl) {
rdLineEl.style.display = '';
}
if (cdLineEl) {
cdLineEl.style.display = '';
}
};
const clearRowDragData = () => {
let wrapperEl = refElem.value;
const dtClss = ['.vxe-body--row'];
if ($xeGantt) {
const { refGanttContainerElem } = $xeGantt.getRefMaps();
const ganttContainerElem = refGanttContainerElem.value;
if (ganttContainerElem) {
wrapperEl = ganttContainerElem;
}
dtClss.push('.vxe-gantt-view--body-row', '.vxe-gantt-view--chart-row');
}
hideDropTip();
clearRowDropOrigin();
clearRowAnimate(wrapperEl, dtClss);
internalData.prevDragToChild = false;
reactData.dragRow = null;
reactData.dragCol = null;
};
const clearColDragData = () => {
const el = refElem.value;
hideDropTip();
clearColDropOrigin();
clearColAnimate(el, ['.vxe-table--column']);
internalData.prevDragToChild = false;
reactData.dragRow = null;
reactData.dragCol = null;
};
/**
* 处理显示 tooltip
* @param {Event} evnt 事件
* @param {Row} row 行对象
*/
const handleTooltip = (evnt, tipOpts, type, tdEl, overflowElem, tipElem, params) => {
const tipOverEl = overflowElem || tdEl;
if (!tipOverEl) {
return nextTick();
}
params.cell = tdEl;
const { tooltipStore } = reactData;
const { column, row } = params;
const { showAll, contentMethod } = tipOpts;
const cellText = XEUtils.toString(column.type === 'html' ? tipOverEl.innerText : tipOverEl.textContent).trim();
const isOver = tipOverEl.scrollWidth > tipOverEl.clientWidth;
let isShow = false;
let customContent = null;
let content = '';
if (contentMethod) {
customContent = contentMethod(params);
}
// 是否全部展示
if (showAll) {
// 如果为 null 默认显示
if (XEUtils.eqNull(customContent)) {
isShow = true;
content = cellText;
}
else if (customContent !== '' && customContent !== false) {
// 如果为 '' | false 则不显示
isShow = true;
content = '' + customContent;
}
}
else {
// 如果为 null 使用默认逻辑
if (XEUtils.eqNull(customContent)) {
isShow = isOver;
content = cellText;
}
else if (customContent !== '' && customContent !== false) {
// 如果为 '' | false 则不显示
isShow = true;
content = customContent;
}
else {
content = cellText;
}
}
if (isShow && content) {
const tipContent = formatText(content);
Object.assign(tooltipStore, {
row,
column,
visible: true,
content: tipContent,
type,
currOpts: tipOpts
});
nextTick(() => {
const $tooltip = refTooltip.value;
if ($tooltip && $tooltip.open) {
$tooltip.open(isOver ? tipOverEl : tipElem, tipContent);
}
});
}
return nextTick();
};
const truncateStackHistory = () => {
const { stackHistoryStore } = internalData;
const { undoStacks } = stackHistoryStore;
const undoRedoHistoryOpts = computeUndoRedoHistoryOpts.value;
const { stackSize } = undoRedoHistoryOpts;
if (undoStacks.length > XEUtils.toNumber(stackSize)) {
undoStacks.shift();
}
};
/**
* 生成快照数据
*/
const getSnapshotStackData = () => {
const { editStore } = reactData;
const { afterFullData, elemStore, insertRowMaps, removeRowMaps } = internalData;
const { selected, actived } = editStore;
const { row: selectRow, column: selectColumn } = selected;
const { row: editRow, column: editColumn } = actived;
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const stackObj = {
selectActiveInfo: selectRow && selectColumn
? {
rowid: getRowid($xeTable, selectRow),
colid: selectColumn.id
}
: undefined,
editActiveInfo: editRow && editColumn
? {
rowid: getRowid($xeTable, editRow),
colid: editColumn.id
}
: undefined,
scrollInfo: {
top: bodyScrollElem ? bodyScrollElem.scrollTop : 0,
left: bodyScrollElem ? bodyScrollElem.scrollLeft : 0
},
insertData: XEUtils.clone(XEUtils.values(insertRowMaps), true),
removeData: XEUtils.clone(XEUtils.values(removeRowMaps), true),
visibleData: XEUtils.clone(afterFullData, true),
visibleTreeData: [],
visibleColumn: []
};
return $xeTable.getCellAreaPushStackObj ? $xeTable.getCellAreaPushStackObj(stackObj) : stackObj;
};
/**
* 刷新栈视图
*/
const handleUpdateSnapshotStackData = (stackObj) => {
const { treeConfig } = props;
const { editStore } = reactData;
const { fullAllDataRowIdData, fullColumnIdData } = internalData;
if (!stackObj) {
return;
}
const treeOpts = computeTreeOpts.value;
const { transform } = treeOpts;
const { visibleData, editActiveInfo, selectActiveInfo, scrollInfo, insertData, removeData } = stackObj;
const iRowMaps = {};
insertData.forEach(item => {
const rowid = getRowid($xeTable, item);
const rest = fullAllDataRowIdData[rowid];
let row = item;
if (rest) {
row = rest.row;
Object.assign(row, item);
}
iRowMaps[rowid] = row;
});
const rRowMaps = {};
removeData.forEach(item => {
const rowid = getRowid($xeTable, item);
const rest = fullAllDataRowIdData[rowid];
let row = item;
if (rest) {
row = rest.row;
Object.assign(row, item);
}
rRowMaps[rowid] = row;
});
const afterFullList = visibleData.map(item => {
const rowid = getRowid($xeTable, item);
const rest = fullAllDataRowIdData[rowid];
let row = item;
if (rest) {
row = rest.row;
Object.assign(row, item);
}
return row;
});
internalData.insertRowMaps = iRowMaps;
internalData.removeRowMaps = rRowMaps;
internalData.afterFullData = afterFullList;
$xeTable.cacheRowMap(false);
$xeTable.handleTableData(treeConfig && transform);
$xeTable.updateFooter();
$xeTable.handleUpdateBodyMerge();
if (!(treeConfig && transform)) {
$xeTable.updateAfterDataIndex();
}
$xeTable.checkSelectionStatus();
if (reactData.scrollYLoad) {
$xeTable.updateScrollYSpace();
}
if ($xeTable.handleCellAreaSnapshotStackData) {
$xeTable.handleCellAreaSnapshotStackData(stackObj);
}
else {
const { selected } = editStore;
const mouseOpts = computeMouseOpts.value;
let selectRowid = '';
let selectColid = '';
if (editActiveInfo) {
selectRowid = editActiveInfo.rowid;
selectColid = editActiveInfo.colid;
}
else if (selectActiveInfo) {
selectRowid = selectActiveInfo.rowid;
selectColid = selectActiveInfo.colid;
}
if (selectRowid && selectColid && mouseOpts.selected) {
const editRow = fullAllDataRowIdData[selectRowid] ? fullAllDataRowIdData[selectRowid].row : null;
const editColumn = fullColumnIdData[selectColid] ? fullColumnIdData[selectColid].column : null;
if (editRow && editColumn) {
const params = {
row: editRow,
column: editColumn
};
selected.row = editRow;
selected.column = editColumn;
selected.args = params;
nextTick(() => {
$xeTable.addCellSelectedClass();
$xeTable.scrollTo(scrollInfo);
});
}
}
}
};
const callSlot = (slotFunc, params) => {
if (slotFunc) {
if ($xeGGWrapper) {
return $xeGGWrapper.callSlot(slotFunc, params);
}
// if (XEUtils.isString(slotFunc)) {
// slotFunc = slots[slotFunc] || null
// }
if (XEUtils.isFunction(slotFunc)) {
return getSlotVNs(slotFunc(params));
}
}
return [];
};
/**
* 内部方法
*/
tablePrivateMethods = {
getSetupOptions() {
return getConfig$2();
},
updateAfterDataIndex,
callSlot,
/**
* 获取父容器元素
*/
getParentElem() {
const el = refElem.value;
if ($xeGGWrapper) {
const gridEl = $xeGGWrapper.getRefMaps().refElem.value;
return gridEl ? gridEl.parentNode : null;
}
return el ? el.parentNode : null;
},
/**
* 获取父容器的高度
*/
getParentHeight() {
const { height } = props;
const el = refElem.value;
if (el) {
const parentElem = el.parentNode;
let parentPaddingSize = 0;
let parentWrapperHeight = 0;
if (parentElem) {
if ($xeGantt && hasClass(parentElem, 'vxe-gantt--table-wrapper')) {
parentWrapperHeight = $xeGantt.getParentHeight();
}
else if ($xeGrid && hasClass(parentElem, 'vxe-grid--table-wrapper')) {
parentWrapperHeight = $xeGrid.getParentHeight();
}
else {
parentWrapperHeight = parentElem.clientHeight;
parentPaddingSize = height === '100%' || height === 'auto' ? getPaddingTopBottomSize(parentElem) : 0;
}
}
return Math.floor(parentWrapperHeight - parentPaddingSize);
}
return 0;
},
/**
* 获取需要排除的高度
* 但渲染表格高度时,需要排除工具栏或分页等相关组件的高度
* 如果存在表尾合计滚动条,则需要排除滚动条高度
*/
getExcludeHeight() {
return $xeGGWrapper ? $xeGGWrapper.getExcludeHeight() : 0;
},
/**
* 定义行数据中的列属性,如果不存在则定义
* @param {Row} records 行数据
*/
defineField(records) {
const { treeConfig } = props;
const expandOpts = computeExpandOpts.value;
const treeOpts = computeTreeOpts.value;
const radioOpts = computeRadioOpts.value;
const rowOpts = computeRowOpts.value;
const checkboxOpts = computeCheckboxOpts.value;
const childrenField = treeOpts.children || treeOpts.childrenField;
const rowkey = getRowkey($xeTable);
if (!XEUtils.isArray(records)) {
records = [records];
}
return records.map(record => {
internalData.tableFullColumn.forEach(column => {
const { field, editRender } = column;
if (field && !XEUtils.has(record, field) && !record[field]) {
let cellValue = null;
if (editRender) {
const { defaultValue } = editRender;
if (XEUtils.isFunction(defaultValue)) {
cellValue = defaultValue({ column });
}
else if (!XEUtils.isUndefined(defaultValue)) {
cellValue = defaultValue;
}
}
XEUtils.set(record, field, cellValue);
}
});
const otherFields = [radioOpts.labelField, checkboxOpts.checkField, checkboxOpts.labelField, expandOpts.labelField];
otherFields.forEach((key) => {
if (key && eqEmptyValue(XEUtils.get(record, key))) {
XEUtils.set(record, key, null);
}
});
if (treeConfig && treeOpts.lazy && XEUtils.isUndefined(record[childrenField])) {
record[childrenField] = null;
}
// 必须有行数据的唯一主键,可以自行设置;也可以默认生成一个随机数
if (eqEmptyValue(XEUtils.get(record, rowkey))) {
XEUtils.set(record, rowkey, createRowId(rowOpts, record, rowkey));
}
return record;
});
},
handleTableData(force) {
const { scrollYLoad } = reactData;
const { scrollYStore, fullDataRowIdData } = internalData;
const $xeGanttView = internalData.xeGanttView;
let fullList = internalData.afterFullData;
// 是否进行数据处理
if (force) {
// 更新数据,处理筛选和排序
updateAfterFullData();
// 如果为虚拟树,将树结构拍平
fullList = handleVirtualTreeToList();
// 更新数据后清除合并缓存,涉及分组、筛选、排序等
internalData.mergeHeaderRowMaps = {};
internalData.mergeHeaderColMaps = {};
internalData.mergeBodyRowMaps = {};
internalData.mergeBodyColMaps = {};
internalData.mergeFooterRowMaps = {};
internalData.mergeFooterColMaps = {};
}
const tableData = scrollYLoad ? fullList.slice(scrollYStore.startIndex, scrollYStore.endIndex) : fullList.slice(0);
const visibleDataRowIdMaps = {};
tableData.forEach((row, $index) => {
const rowid = getRowid($xeTable, row);
const rest = fullDataRowIdData[rowid];
if (rest) {
rest.$index = $index;
}
visibleDataRowIdMaps[rowid] = row;
});
reactData.tableData = tableData;
internalData.visibleDataRowIdData = visibleDataRowIdMaps;
if ($xeGanttView && $xeGanttView.updateViewData) {
$xeGanttView.updateViewData(force);
}
return nextTick();
},
/**
* 更新数据行的 Map
*/
cacheRowMap(isReset) {
const { treeConfig } = props;
const { isRowGroupStatus } = reactData;
const { currKeyField, fullAllDataRowIdData, tableFullData, tableFullTreeData, tableFullGroupData, treeExpandedMaps, rowExpandedMaps, selectCheckboxMaps } = internalData;
const fullAllDataRowIdMaps = isReset ? {} : Object.assign({}, fullAllDataRowIdData); // 存在已删除数据
const fullDataRowIdMaps = {};
const idMaps = {};
const { handleUpdateRowId } = createHandleUpdateRowId($xeTable);
let rowNum = 0;
const handleRowCache = (row, index, items, currIndex, parentRow, rowid, level, seq) => {
let rowRest = fullAllDataRowIdMaps[rowid];
if (idMaps[rowid]) {
errLog$2('vxe.error.repeatKey', [currKeyField, rowid]);
}
if (!rowRest) {
rowRest = { row, rowid, _seq: -1, seq, index: -1, _index: -1, $index: -1, treeIndex: index, _tIndex: -1, items, parent: parentRow, level, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 };
fullDataRowIdMaps[rowid] = rowRest;
fullAllDataRowIdMaps[rowid] = rowRest;
}
rowRest.treeLoaded = false;
rowRest.expandLoaded = false;
rowRest._seq = rowNum++;
rowRest.row = row;
rowRest.items = items;
rowRest.parent = parentRow;
rowRest.level = level;
rowRest.index = currIndex;
rowRest.treeIndex = index;
// 更新缓存
if (selectCheckboxMaps[rowid]) {
selectCheckboxMaps[rowid] = row;
}
if (rowExpandedMaps[rowid]) {
rowExpandedMaps[rowid] = row;
}
rowNum++;
idMaps[rowid] = true;
fullDataRowIdMaps[rowid] = rowRest;
fullAllDataRowIdMaps[rowid] = rowRest;
};
if (treeConfig) {
const treeOpts = computeTreeOpts.value;
const { lazy } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
const hasChildField = treeOpts.hasChild || treeOpts.hasChildField;
XEUtils.eachTree(tableFullTreeData, (row, index, items, path, parentRow, nodes) => {
const rowid = handleUpdateRowId(row);
if (lazy) {
if (row[hasChildField] && row[childrenField] === undefined) {
row[childrenField] = null;
}
if (treeExpandedMaps[rowid]) {
if (!row[childrenField] || !row[childrenField].length) {
delete treeExpandedMaps[rowid];
}
}
}
handleRowCache(row, index, items, parentRow ? -1 : index, parentRow, rowid, nodes.length - 1, toTreePathSeq(path));
}, { children: childrenField });
}
else if (isRowGroupStatus) {
const aggregateOpts = computeAggregateOpts.value;
const { mapChildrenField } = aggregateOpts;
XEUtils.eachTree(tableFullGroupData, (row, index, items, path, parentRow, nodes) => {
const rowid = handleUpdateRowId(row);
handleRowCache(row, index, items, parentRow ? -1 : index, parentRow, rowid, nodes.length - 1, toTreePathSeq(path));
}, { children: mapChildrenField });
}
else {
tableFullData.forEach((row, index, items) => {
handleRowCache(row, index, items, index, null, handleUpdateRowId(row), 0, index + 1);
});
}
internalData.fullDataRowIdData = fullDataRowIdMaps;
internalData.fullAllDataRowIdData = fullAllDataRowIdMaps;
reactData.treeExpandedFlag++;
},
cacheSourceMap(fullData) {
const { treeConfig } = props;
const treeOpts = computeTreeOpts.value;
const sourceData = XEUtils.clone(fullData, true);
const { handleUpdateRowId } = createHandleUpdateRowId($xeTable);
const sourceRowIdData = {};
const handleSourceRow = (row) => {
const rowid = handleUpdateRowId(row);
sourceRowIdData[rowid] = row;
};
// 源数据缓存
if (treeConfig) {
const childrenField = treeOpts.children || treeOpts.childrenField;
XEUtils.eachTree(sourceData, handleSourceRow, { children: treeOpts.transform ? treeOpts.mapChildrenField : childrenField });
}
else {
sourceData.forEach(handleSourceRow);
}
internalData.sourceDataRowIdData = sourceRowIdData;
internalData.tableSourceData = sourceData;
},
/**
* 指定列宽的列进行拆分
*/
analyColumnWidth() {
const { tableFullColumn } = internalData;
const columnOpts = computeColumnOpts.value;
const { width: defaultWidth, minWidth: defaultMinWidth } = columnOpts;
const resizeList = [];
const pxList = [];
const pxMinList = [];
const autoMinList = [];
const scaleList = [];
const scaleMinList = [];
const autoList = [];
const remainList = [];
tableFullColumn.forEach((column) => {
if (defaultWidth && !column.width) {
column.width = defaultWidth;
}
if (defaultMinWidth && !column.minWidth) {
column.minWidth = defaultMinWidth;
}
if (column.visible) {
if (column.resizeWidth) {
resizeList.push(column);
}
else if (column.width === 'auto') {
autoList.push(column);
}
else if (isPx(column.width)) {
pxList.push(column);
}
else if (isScale(column.width)) {
scaleList.push(column);
}
else if (isPx(column.minWidth)) {
pxMinList.push(column);
}
else if (column.minWidth === 'auto') {
autoMinList.push(column);
}
else if (isScale(column.minWidth)) {
scaleMinList.push(column);
}
else {
remainList.push(column);
}
}
});
Object.assign(reactData.columnStore, { resizeList, pxList, pxMinList, autoMinList, scaleList, scaleMinList, autoList, remainList });
},
handleColResizeMousedownEvent(evnt, fixedType, params) {
const isLeftBtn = evnt.button === 0;
if (!isLeftBtn) {
return;
}
evnt.stopPropagation();
evnt.preventDefault();
const { column } = params;
const { columnStore, overflowX, scrollbarHeight } = reactData;
const { visibleColumn } = internalData;
const { leftList, rightList } = columnStore;
const resizableOpts = computeResizableOpts.value;
const osbHeight = overflowX ? scrollbarHeight : 0;
const tableEl = refElem.value;
const leftContainerElem = refLeftContainer.value;
const rightContainerElem = refRightContainer.value;
const resizeBarElem = refColResizeBar.value;
if (!resizeBarElem) {
return;
}
const isLeftFixed = fixedType === 'left';
const isRightFixed = fixedType === 'right';
const resizeTipElem = resizeBarElem.firstElementChild;
const scrollbarXToTop = computeScrollbarXToTop.value;
const { clientX: dragClientX } = evnt;
const dragBtnElem = evnt.target;
let cell = dragBtnElem.parentElement;
let resizeColumn = column;
const isDragGroupCol = column.children && column.children.length;
if (isDragGroupCol) {
resizeColumn = getLastChildColumn(column);
if (isDragGroupCol) {
const trEl = cell ? cell.parentElement : null;
const theadEl = trEl ? trEl.parentElement : null;
cell = theadEl ? theadEl.querySelector(`.vxe-header--column[colid="${resizeColumn.id}"]`) : null;
}
}
if (!cell) {
return;
}
const cellParams = XEUtils.assign(params, { cell, $table: $xeTable });
let dragLeft = 0;
const tableRect = tableEl.getBoundingClientRect();
const rightContainerRect = rightContainerElem ? rightContainerElem.getBoundingClientRect() : null;
const cellRect = cell.getBoundingClientRect();
const dragBtnRect = dragBtnElem.getBoundingClientRect();
const dragBtnWidth = dragBtnElem.clientWidth;
const dragBtnOffsetWidth = XEUtils.floor(dragBtnWidth / 2);
const dragPosLeft = dragBtnRect.x - tableRect.x + dragBtnOffsetWidth;
const minInterval = getColReMinWidth(cellParams) - dragBtnOffsetWidth; // 列之间的最小间距
const maxInterval = getColReMaxWidth(cellParams); // 列之间的最大间距
const dragMinLeft = isRightFixed ? 0 : (cellRect.x - tableRect.x + dragBtnWidth + minInterval);
const dragMaxLeft = cellRect.x - tableRect.x + cell.clientWidth - minInterval;
let fixedLeftRemainWidth = 0;
let fixedRightRemainWidth = 0;
if (isLeftFixed || isRightFixed) {
let isMach = false;
const fixedColumn = isLeftFixed ? leftList : rightList;
for (let i = 0; i < fixedColumn.length; i++) {
const item = fixedColumn[i];
if (isMach) {
fixedLeftRemainWidth += item.renderWidth;
}
else {
isMach = item.id === resizeColumn.id;
if (!isMach) {
fixedRightRemainWidth += item.renderWidth;
}
}
}
}
// 处理拖动事件
const updateEvent = (evnt) => {
evnt.stopPropagation();
evnt.preventDefault();
const tableHeight = tableEl.clientHeight;
const offsetX = evnt.clientX - dragClientX;
let left = dragPosLeft + offsetX;
if (isLeftFixed) {
if (rightContainerRect) {
left = Math.min(left, rightContainerRect.x - tableRect.x - fixedLeftRemainWidth - minInterval);
}
}
else if (isRightFixed) {
if (leftContainerElem) {
left = Math.max(left, leftContainerElem.clientWidth + fixedRightRemainWidth + minInterval);
}
left = Math.min(left, dragMaxLeft);
}
dragLeft = Math.max(left, dragMinLeft);
// 最大宽
if (maxInterval > 1) {
dragLeft = Math.min(dragLeft, maxInterval + dragMinLeft - minInterval);
}
const resizeBarLeft = Math.max(1, dragLeft);
resizeBarElem.style.left = `${resizeBarLeft}px`;
resizeBarElem.style.top = `${scrollbarXToTop ? osbHeight : 0}px`;
resizeBarElem.style.height = `${scrollbarXToTop ? tableHeight - osbHeight : tableHeight}px`;
if (resizableOpts.showDragTip && resizeTipElem) {
resizeTipElem.textContent = getI18n$2('vxe.table.resizeColTip', [Math.floor(resizeColumn.renderWidth + (isRightFixed ? dragPosLeft - dragLeft : dragLeft - dragPosLeft))]);
const tableWrapperWidth = tableEl.clientWidth;
const resizeBarWidth = resizeBarElem.clientWidth;
const resizeTipWidth = resizeTipElem.clientWidth;
const resizeTipHeight = resizeTipElem.clientHeight;
let resizeTipLeft = -resizeTipWidth;
if (resizeBarLeft < resizeTipWidth + resizeBarWidth) {
resizeTipLeft = 0;
}
else if (resizeBarLeft > tableWrapperWidth) {
resizeTipLeft += tableWrapperWidth - resizeBarLeft;
}
resizeTipElem.style.left = `${resizeTipLeft}px`;
resizeTipElem.style.top = `${Math.min(tableHeight - resizeTipHeight, Math.max(0, evnt.clientY - tableRect.y - resizeTipHeight / 2))}px`;
}
reactData.isDragResize = true;
};
reactData.isDragResize = true;
addClass(tableEl, 'col-drag--resize');
resizeBarElem.style.display = 'block';
document.onmousemove = updateEvent;
document.onmouseup = function (evnt) {
document.onmousemove = null;
document.onmouseup = null;
resizeBarElem.style.display = 'none';
internalData._lastResizeTime = Date.now();
setTimeout(() => {
reactData.isDragResize = false;
}, 50);
const resizeWidth = resizeColumn.renderWidth + (isRightFixed ? dragPosLeft - dragLeft : dragLeft - dragPosLeft);
const resizeParams = Object.assign(Object.assign({}, params), { resizeWidth, resizeColumn });
if (resizableOpts.dragMode === 'fixed') {
visibleColumn.forEach(item => {
if (item.id !== resizeColumn.id) {
if (!item.resizeWidth) {
item.resizeWidth = item.renderWidth;
}
}
});
}
if ($xeTable.handleColResizeCellAreaEvent) {
$xeTable.handleColResizeCellAreaEvent(evnt, resizeParams);
}
else {
resizeColumn.resizeWidth = resizeWidth;
handleUpdateColResize(evnt, resizeParams);
}
removeClass(tableEl, 'col-drag--resize');
};
updateEvent(evnt);
if ($xeTable.closeMenu) {
$xeTable.closeMenu();
}
},
handleColResizeDblclickEvent(evnt, params) {
const resizableOpts = computeResizableOpts.value;
const { isDblclickAutoWidth } = resizableOpts;
const el = refElem.value;
if (isDblclickAutoWidth && el) {
evnt.stopPropagation();
evnt.preventDefault();
const { fullColumnIdData } = internalData;
const { column } = params;
let resizeColumn = column;
if (column.children && column.children.length) {
XEUtils.eachTree(column.children, childColumn => {
resizeColumn = childColumn;
});
}
const colid = resizeColumn.id;
const colRest = fullColumnIdData[colid];
const dragBtnElem = evnt.target;
const cell = dragBtnElem.parentNode;
const cellParams = Object.assign(params, { cell, $table: $xeTable });
const colMinWidth = getColReMinWidth(cellParams);
const colMaxWidth = getColReMaxWidth(cellParams);
el.setAttribute('data-calc-col', 'Y');
let resizeWidth = calcColumnAutoWidth(resizeColumn, el);
el.removeAttribute('data-calc-col');
if (colRest) {
resizeWidth = Math.max(resizeWidth, colRest.width);
}
resizeWidth = Math.max(colMinWidth, resizeWidth);
if (colMaxWidth > 1) {
resizeWidth = Math.min(colMaxWidth, resizeWidth);
}
const resizeParams = Object.assign(Object.assign({}, params), { resizeWidth, resizeColumn });
reactData.isDragResize = false;
internalData._lastResizeTime = Date.now();
if ($xeTable.handleColResizeDblclickCellAreaEvent) {
$xeTable.handleColResizeDblclickCellAreaEvent(evnt, resizeParams);
}
else {
resizeColumn.resizeWidth = resizeWidth;
handleUpdateColResize(evnt, resizeParams);
}
}
},
/**
* @private
*/
handleRowResizeMousedownEvent(evnt, params) {
evnt.stopPropagation();
evnt.preventDefault();
const { row } = params;
const { showOverflow } = props;
const { overflowX, scrollbarWidth, overflowY, scrollbarHeight } = reactData;
const { elemStore, fullAllDataRowIdData } = internalData;
const osbWidth = overflowY ? scrollbarWidth : 0;
const osbHeight = overflowX ? scrollbarHeight : 0;
const scrollbarYToLeft = computeScrollbarYToLeft.value;
const resizableOpts = computeResizableOpts.value;
const rowOpts = computeRowOpts.value;
const cellOpts = computeCellOpts.value;
let tableEl = refElem.value;
if ($xeGantt) {
const { refGanttContainerElem } = $xeGantt.getRefMaps();
const ganttContainerElem = refGanttContainerElem.value;
if (ganttContainerElem) {
tableEl = ganttContainerElem;
}
}
const resizeBarElem = refRowResizeBar.value;
if (!resizeBarElem) {
return;
}
const { clientY: dragClientY } = evnt;
const resizeTipElem = resizeBarElem.firstElementChild;
const dragBtnElem = evnt.currentTarget;
const tdEl = dragBtnElem.parentNode;
const trEl = tdEl.parentNode;
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
if (!bodyScrollElem) {
return;
}
const rowid = getRowid($xeTable, row);
const rowRest = fullAllDataRowIdData[rowid];
if (!rowRest) {
return;
}
const defaultRowHeight = computeDefaultRowHeight.value;
let currCellHeight = getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight);
if (!showOverflow) {
currCellHeight = tdEl.clientHeight;
}
const tableRect = tableEl.getBoundingClientRect();
const trRect = trEl.getBoundingClientRect();
const targetOffsetY = dragClientY - trRect.y - trEl.clientHeight;
let resizeHeight = currCellHeight;
const cellEl = tdEl.querySelector('.vxe-cell');
let cellMinHeight = 0;
if (cellEl) {
const cellStyle = getComputedStyle(cellEl);
cellMinHeight = Math.max(1, Math.ceil(XEUtils.toNumber(cellStyle.paddingTop) + XEUtils.toNumber(cellStyle.paddingBottom)));
}
const minTop = trRect.y - tableRect.y + cellMinHeight;
// 处理拖动事件
const updateEvent = (evnt) => {
evnt.stopPropagation();
evnt.preventDefault();
const rtWidth = tableEl.clientWidth - osbWidth;
const tableHeight = tableEl.clientHeight - osbHeight;
let dragTop = evnt.clientY - tableRect.y - targetOffsetY;
if (dragTop < minTop) {
dragTop = minTop;
}
else {
resizeHeight = Math.max(cellMinHeight, currCellHeight + evnt.clientY - dragClientY);
}
resizeBarElem.style.left = `${scrollbarYToLeft ? osbWidth : 0}px`;
resizeBarElem.style.top = `${dragTop}px`;
resizeBarElem.style.width = `${rtWidth}px`;
if (resizableOpts.showDragTip && resizeTipElem) {
resizeTipElem.textContent = getI18n$2('vxe.table.resizeRowTip', [resizeHeight]);
const resizeTipWidth = resizeTipElem.clientWidth;
const resizeTipHeight = resizeTipElem.clientHeight;
let resizeBarLeft = Math.max(2, evnt.clientX - tableRect.x);
let resizeBarTop = 0;
if (resizeBarLeft + resizeTipWidth >= rtWidth - 2) {
resizeBarLeft = rtWidth - resizeTipWidth - 2;
}
if (dragTop + resizeTipHeight >= tableHeight) {
resizeBarTop = tableHeight - (dragTop + resizeTipHeight);
}
resizeTipElem.style.left = `${resizeBarLeft}px`;
resizeTipElem.style.top = `${resizeBarTop}px`;
}
reactData.isDragResize = true;
};
reactData.isDragResize = true;
addClass(tableEl, 'row-drag--resize');
resizeBarElem.style.display = 'block';
document.onmousemove = updateEvent;
document.onmouseup = function (evnt) {
document.onmousemove = null;
document.onmouseup = null;
resizeBarElem.style.display = 'none';
internalData._lastResizeTime = Date.now();
setTimeout(() => {
reactData.isDragResize = false;
}, 50);
if (resizeHeight !== currCellHeight) {
const resizeParams = Object.assign(Object.assign({}, params), { resizeHeight, resizeRow: row });
internalData.isResizeCellHeight = true;
if ($xeTable.handleRowResizeCellAreaEvent) {
$xeTable.handleRowResizeCellAreaEvent(evnt, resizeParams);
}
else {
rowRest.resizeHeight = resizeHeight;
handleUpdateRowResize(evnt, resizeParams);
updateRowOffsetTop();
}
}
removeClass(tableEl, 'row-drag--resize');
};
updateEvent(evnt);
},
/**
* @private
*/
handleRowResizeDblclickEvent(evnt, params) {
const resizableOpts = computeResizableOpts.value;
const { isDblclickAutoHeight } = resizableOpts;
const el = refElem.value;
if (isDblclickAutoHeight && el) {
evnt.stopPropagation();
evnt.preventDefault();
const { editStore } = reactData;
const { fullAllDataRowIdData } = internalData;
const { actived } = editStore;
const { row } = params;
const rowid = getRowid($xeTable, row);
const rowRest = fullAllDataRowIdData[rowid];
if (!rowRest) {
return;
}
const handleRsHeight = () => {
el.setAttribute('data-calc-row', 'Y');
const resizeHeight = calcCellAutoHeight(rowid, rowRest, el);
el.removeAttribute('data-calc-row');
const resizeParams = Object.assign(Object.assign({}, params), { resizeHeight, resizeRow: row });
reactData.isDragResize = false;
internalData._lastResizeTime = Date.now();
if ($xeTable.handleRowResizeDblclickCellAreaEvent) {
$xeTable.handleRowResizeDblclickCellAreaEvent(evnt, resizeParams);
}
else {
rowRest.resizeHeight = resizeHeight;
handleUpdateRowResize(evnt, resizeParams);
}
};
if (actived.row || actived.column) {
$xeTable.clearEdit().then(handleRsHeight);
}
else {
handleRsHeight();
}
}
},
/**
* @private
*/
saveCustomStore(type) {
const { customConfig } = props;
const tableId = computeTableId.value;
const customOpts = computeCustomOpts.value;
const { updateStore, storage } = customOpts;
const { isCustomAlign, isCustomHeaderAlign, isCustomFooterAlign, isCustomResizable, isCustomVisible, isCustomFixed, isCustomSort, isCustomAggGroup, isCustomAggFunc, isCustomPager } = handleCustomStoreConfig($xeTable);
if (type !== 'reset') {
// fix:修复拖动列宽,重置按钮无法点击的问题
reactData.isCustomStatus = true;
}
if (storage &&
(customConfig ? isEnableConf(customOpts) : customOpts.enabled) &&
(isCustomAlign ||
isCustomHeaderAlign ||
isCustomFooterAlign ||
isCustomResizable ||
isCustomVisible ||
isCustomFixed ||
isCustomSort ||
isCustomAggGroup ||
isCustomAggFunc ||
isCustomPager)) {
if (!tableId) {
errLog$2('vxe.error.reqProp', ['id']);
return nextTick();
}
const storeData = type === 'reset'
? {
pagerData: {},
alignData: {},
headerAlignData: {},
footerAlignData: {},
resizableData: {},
sortData: [],
visibleData: {},
fixedData: {},
aggGroupData: {},
aggFuncData: {}
}
: $xeTable.getCustomStoreData();
if (updateStore) {
return updateStore({
$table: $xeTable,
id: tableId,
type,
storeData
});
}
else {
setCustomStorageMap(tableId, type === 'reset' ? null : storeData);
}
}
return nextTick();
},
/**
* @private
*/
handleCustom() {
const { mouseConfig } = props;
if (mouseConfig) {
if ($xeTable.clearSelected) {
$xeTable.clearSelected();
}
if ($xeTable.clearCellAreas) {
$xeTable.clearCellAreas();
$xeTable.clearCopyCellArea();
}
}
$xeTable.analyColumnWidth();
return $xeTable.refreshColumn(true);
},
handleUpdateDataQueue() {
reactData.upDataFlag++;
},
handleRefreshColumnQueue() {
reactData.reColumnFlag++;
},
handleFilterOptions(column) {
if (column) {
const { filterStore } = reactData;
const { filterRender, filters } = column;
const filterOptions = filters || [];
const compConf = isEnableConf(filterRender) ? renderer$1.get(filterRender.name) : null;
const frMethod = column.filterRecoverMethod || (compConf ? (compConf.tableFilterRecoverMethod || compConf.filterRecoverMethod) : null);
filterStore.column = column;
// 复原状态
filterOptions.forEach((option) => {
const { _checked, checked } = option;
option._checked = checked;
if (!checked && _checked !== checked) {
if (frMethod) {
frMethod({ option, column, $table: $xeTable });
}
}
});
$xeTable.checkFilterOptions();
}
},
preventEvent(evnt, type, args, next, end) {
let evntList = interceptor.get(type);
// 兼容老版本
if (!evntList.length && type === 'event.clearEdit') {
evntList = interceptor.get('event.clearActived');
if (evntList.length) {
warnLog$2('vxe.error.delEvent', ['event.clearActived', 'event.clearEdit']);
}
}
// 兼容老版本
let rest = null;
let isStop = false;
for (let i = 0; i < evntList.length; i++) {
const func = evntList[i];
const fnRest = func(Object.assign({ $table: $xeTable, $grid: $xeGrid, gantt: $xeGantt, $event: evnt }, args));
if (fnRest === false) {
isStop = true;
break;
}
else if (fnRest && fnRest.status === false) {
rest = fnRest.result;
isStop = true;
break;
}
}
if (!isStop) {
if (next) {
rest = next();
}
}
if (end) {
end();
}
return rest;
},
updateCheckboxStatus() {
const { treeConfig } = props;
const { isRowGroupStatus } = reactData;
const { afterTreeFullData, afterGroupFullData, selectCheckboxMaps, treeIndeterminateRowMaps } = internalData;
const aggregateOpts = computeAggregateOpts.value;
const treeOpts = computeTreeOpts.value;
const childrenField = treeOpts.children || treeOpts.childrenField;
const checkboxOpts = computeCheckboxOpts.value;
const { checkField, indeterminateField, checkStrictly, checkMethod } = checkboxOpts;
if (checkStrictly) {
return;
}
if (isRowGroupStatus || treeConfig) {
const { handleGetRowId } = createHandleGetRowId($xeTable);
const childRowMaps = {};
const childRowList = [];
if (isRowGroupStatus) {
// 行分组
const mapChildrenField = aggregateOpts.mapChildrenField;
if (mapChildrenField) {
XEUtils.eachTree(afterGroupFullData, (row) => {
const rowid = handleGetRowId(row);
const childList = row[mapChildrenField];
if (childList && childList.length && !childRowMaps[rowid]) {
childRowMaps[rowid] = 1;
childRowList.unshift([row, rowid, childList]);
}
}, { children: mapChildrenField });
}
}
else if (treeConfig) {
// 树结构
const { transform, mapChildrenField } = treeOpts;
XEUtils.eachTree(afterTreeFullData, (row) => {
const rowid = handleGetRowId(row);
const childList = row[transform ? mapChildrenField : childrenField];
if (childList && childList.length && !childRowMaps[rowid]) {
childRowMaps[rowid] = 1;
childRowList.unshift([row, rowid, childList]);
}
else {
if (indeterminateField) {
XEUtils.set(row, indeterminateField, false);
}
}
}, { children: transform ? mapChildrenField : childrenField });
}
childRowList.forEach(vals => {
const row = vals[0];
const rowid = vals[1];
const childList = vals[2];
let sLen = 0; // 已选
let hLen = 0; // 半选
let vLen = 0; // 有效子行
const cLen = childList.length; // 子行
childList.forEach(checkMethod
? (item) => {
const childRowid = handleGetRowId(item);
const isSelect = checkField ? XEUtils.get(item, checkField) : selectCheckboxMaps[childRowid];
if (checkMethod({ $table: $xeTable, row: item })) {
if (isSelect) {
sLen++;
}
else if (treeIndeterminateRowMaps[childRowid]) {
hLen++;
}
vLen++;
}
else {
if (isSelect) {
sLen++;
}
else if (treeIndeterminateRowMaps[childRowid]) {
hLen++;
}
}
}
: item => {
const childRowid = handleGetRowId(item);
const isSelect = checkField ? XEUtils.get(item, checkField) : selectCheckboxMaps[childRowid];
if (isSelect) {
sLen++;
}
else if (treeIndeterminateRowMaps[childRowid]) {
hLen++;
}
vLen++;
});
let isSelected = false;
if (cLen > 0) {
if (vLen > 0) {
isSelected = (sLen > 0 || hLen > 0) && sLen >= vLen;
}
else {
// 如果存在子项禁用
if ((sLen > 0 && sLen >= vLen)) {
isSelected = true;
}
else if (selectCheckboxMaps[rowid]) {
isSelected = true;
}
else {
isSelected = false;
}
}
}
else {
// 如果无子项
isSelected = selectCheckboxMaps[rowid];
}
const halfSelect = !isSelected && (sLen > 0 || hLen > 0);
if (checkField) {
XEUtils.set(row, checkField, isSelected);
}
if (indeterminateField) {
XEUtils.set(row, indeterminateField, halfSelect);
}
if (isSelected) {
if (!checkField) {
selectCheckboxMaps[rowid] = row;
}
if (treeIndeterminateRowMaps[rowid]) {
delete treeIndeterminateRowMaps[rowid];
}
}
else {
if (!checkField) {
if (selectCheckboxMaps[rowid]) {
delete selectCheckboxMaps[rowid];
}
}
if (halfSelect) {
treeIndeterminateRowMaps[rowid] = row;
}
else {
if (treeIndeterminateRowMaps[rowid]) {
delete treeIndeterminateRowMaps[rowid];
}
}
}
});
}
reactData.updateCheckboxFlag++;
},
updateAllCheckboxStatus() {
const { treeConfig } = props;
const { isRowGroupStatus } = reactData;
const { afterFullData, afterTreeFullData, afterGroupFullData, checkboxReserveRowMap, selectCheckboxMaps, treeIndeterminateRowMaps } = internalData;
const aggregateOpts = computeAggregateOpts.value;
const { mapChildrenField } = aggregateOpts;
const checkboxOpts = computeCheckboxOpts.value;
const { checkField, checkMethod, showReserveStatus } = checkboxOpts;
const { handleGetRowId } = createHandleGetRowId($xeTable);
let sLen = 0; // 已选
let dsLen = 0; // 禁用的已选
let hLen = 0; // 半选
let dhLen = 0; // 禁用的半选
let vLen = 0; // 有效行
const rootList = (treeConfig ? afterTreeFullData : (isRowGroupStatus ? afterGroupFullData : afterFullData));
rootList.forEach(checkMethod
? row => {
const childRowid = handleGetRowId(row);
const selected = checkField ? XEUtils.get(row, checkField) : selectCheckboxMaps[childRowid];
if (isRowGroupStatus && $xeTable.isAggregateRecord(row)) {
const childList = row[mapChildrenField || ''];
if (selected) {
vLen++;
sLen++;
}
else if (treeIndeterminateRowMaps[childRowid]) {
vLen++;
hLen++;
}
else if (childList && childList.length && childList.some(item => checkMethod({ $table: $xeTable, row: item }))) {
vLen++;
}
}
else if (checkMethod({ $table: $xeTable, row })) {
if (selected) {
sLen++;
}
else if (treeIndeterminateRowMaps[childRowid]) {
hLen++;
}
vLen++;
}
else {
if (selected) {
dsLen++;
}
else if (treeIndeterminateRowMaps[childRowid]) {
dhLen++;
}
}
}
: row => {
const childRowid = handleGetRowId(row);
const selected = checkField ? XEUtils.get(row, checkField) : selectCheckboxMaps[childRowid];
if (selected) {
sLen++;
}
else if (treeIndeterminateRowMaps[childRowid]) {
hLen++;
}
vLen++;
});
const isSelected = rootList.length > 0 ? (vLen > 0 ? (sLen >= vLen) : (sLen >= rootList.length)) : false;
let halfSelect = !isSelected && (sLen > 0 || hLen > 0 || dsLen > 0 || dhLen > 0);
// 如果复选框启用保留记录,当保留数据存在时显示半选
if (!isSelected && !halfSelect && showReserveStatus) {
halfSelect = !XEUtils.isEmpty(checkboxReserveRowMap);
}
reactData.isAllSelected = isSelected;
reactData.isIndeterminate = halfSelect;
},
checkSelectionStatus() {
$xeTable.updateCheckboxStatus();
$xeTable.updateAllCheckboxStatus();
},
/**
* 切换选中
* 多选,行选中事件
*/
handleBatchSelectRows(rows, checked, isForce) {
const { treeConfig } = props;
const { isRowGroupStatus } = reactData;
const { selectCheckboxMaps } = internalData;
const aggregateOpts = computeAggregateOpts.value;
const treeOpts = computeTreeOpts.value;
const { transform, mapChildrenField } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
const checkboxOpts = computeCheckboxOpts.value;
const { checkField, checkStrictly, checkMethod } = checkboxOpts;
const { handleGetRowId } = createHandleGetRowId($xeTable);
// indeterminateField 仅支持读取
const indeterminateField = checkboxOpts.indeterminateField || checkboxOpts.halfField;
if (checkField) {
// 树结构
if ((treeConfig || isRowGroupStatus) && !checkStrictly) {
// 更新子节点状态
XEUtils.eachTree(rows, (row) => {
if (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row }))) {
XEUtils.set(row, checkField, checked);
if (indeterminateField) {
XEUtils.set(row, indeterminateField, false);
}
handleCheckboxReserveRow(row, checked);
}
}, { children: transform ? mapChildrenField : childrenField });
reactData.updateCheckboxFlag++;
return;
}
// 列表
rows.forEach(row => {
if (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row }))) {
XEUtils.set(row, checkField, checked);
handleCheckboxReserveRow(row, checked);
}
});
reactData.updateCheckboxFlag++;
return;
}
// 树结构
if (!checkStrictly) {
if (isRowGroupStatus) {
// 更新行分组节点状态
XEUtils.eachTree(rows, (row) => {
const rowid = handleGetRowId(row);
if (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row }))) {
if (checked) {
selectCheckboxMaps[rowid] = row;
}
else {
if (selectCheckboxMaps[rowid]) {
delete selectCheckboxMaps[rowid];
}
}
handleCheckboxReserveRow(row, checked);
}
}, { children: aggregateOpts.mapChildrenField });
reactData.updateCheckboxFlag++;
return;
}
else if (treeConfig) {
// 更新子节点状态
XEUtils.eachTree(rows, (row) => {
const rowid = handleGetRowId(row);
if (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row }))) {
if (checked) {
selectCheckboxMaps[rowid] = row;
}
else {
if (selectCheckboxMaps[rowid]) {
delete selectCheckboxMaps[rowid];
}
}
handleCheckboxReserveRow(row, checked);
}
}, { children: transform ? mapChildrenField : childrenField });
reactData.updateCheckboxFlag++;
return;
}
}
// 列表
rows.forEach(row => {
const rowid = handleGetRowId(row);
if (isForce || (!checkMethod || checkMethod({ $table: $xeTable, row }))) {
if (checked) {
if (!selectCheckboxMaps[rowid]) {
selectCheckboxMaps[rowid] = row;
}
}
else {
if (selectCheckboxMaps[rowid]) {
delete selectCheckboxMaps[rowid];
}
}
handleCheckboxReserveRow(row, checked);
reactData.updateCheckboxFlag++;
}
});
},
/**
* 即将移除
* @deprecated
*/
handleSelectRow({ row }, checked, isForce) {
$xeTable.handleBatchSelectRows([row], checked, isForce);
},
handleUpdateHeaderMerge() {
const { mergeHeaderList } = internalData;
const { mergeMaps, mergeRowMaps, mergeColMaps } = buildMergeData(mergeHeaderList);
internalData.mergeHeaderCellMaps = mergeMaps;
internalData.mergeHeaderRowMaps = mergeRowMaps;
internalData.mergeHeaderColMaps = mergeColMaps;
reactData.mergeHeadFlag++;
},
/**
* 处理合并
*/
handleUpdateBodyMerge() {
const { mergeBodyList } = internalData;
const { mergeMaps, mergeRowMaps, mergeColMaps } = buildMergeData(mergeBodyList);
internalData.mergeBodyCellMaps = mergeMaps;
internalData.mergeBodyRowMaps = mergeRowMaps;
internalData.mergeBodyColMaps = mergeColMaps;
reactData.mergeBodyFlag++;
},
handleUpdateFooterMerge() {
const { mergeFooterList } = internalData;
const { mergeMaps, mergeRowMaps, mergeColMaps } = buildMergeData(mergeFooterList);
internalData.mergeFooterCellMaps = mergeMaps;
internalData.mergeFooterRowMaps = mergeRowMaps;
internalData.mergeFooterColMaps = mergeColMaps;
reactData.mergeFootFlag++;
},
handleAggregateSummaryData() {
return $xeTable.refreshAggregateCalcValues();
},
triggerHeaderTitleEvent(evnt, iconParams, params) {
const tipContent = iconParams.content || iconParams.message;
if (tipContent) {
const { tooltipStore } = reactData;
const { column } = params;
const content = getFuncText(tipContent);
handleTargetEnterEvent(true);
tooltipStore.row = null;
tooltipStore.column = column;
tooltipStore.visible = true;
tooltipStore.currOpts = iconParams;
nextTick(() => {
const $tooltip = refTooltip.value;
if ($tooltip && $tooltip.open) {
$tooltip.open(evnt.currentTarget, content);
}
});
}
},
/**
* 触发表头 tooltip 事件
*/
triggerHeaderTooltipEvent(evnt, params) {
const { tooltipStore } = reactData;
const headerTooltipOpts = computeHeaderTooltipOpts.value;
const { column } = params;
handleTargetEnterEvent(true);
const titleElem = evnt.currentTarget;
if (!titleElem) {
return;
}
const cWrapperEl = titleElem.parentElement;
if (!cWrapperEl) {
return;
}
const cellEl = cWrapperEl.parentElement;
if (!cellEl) {
return;
}
const thEl = cellEl.parentElement;
if (!thEl) {
return;
}
if (tooltipStore.column !== column || !tooltipStore.visible) {
const ctEl = thEl.querySelector('.vxe-cell--title');
handleTooltip(evnt, headerTooltipOpts, 'header', thEl, (hasClass(thEl, 'col--ellipsis') ? ctEl : cWrapperEl) || cWrapperEl, ctEl || cellEl, params);
}
},
/**
* 触发单元格 tooltip 事件
*/
triggerBodyTooltipEvent(evnt, params) {
const { editConfig } = props;
const { editStore } = reactData;
const { tooltipStore } = reactData;
const tooltipOpts = computeTooltipOpts.value;
const editOpts = computeEditOpts.value;
const { actived } = editStore;
const { row, column } = params;
const tdEl = evnt.currentTarget;
handleTargetEnterEvent(tooltipStore.column !== column || tooltipStore.row !== row);
// 单元格处于编辑状态时不触发提示框
if (column.editRender && isEnableConf(editConfig)) {
// 如果是行编辑模式
if (editOpts.mode === 'row' && actived.row === row) {
return;
}
// 如果是单元格编辑模式
if (actived.row === row && actived.column === column) {
return;
}
}
if (tooltipStore.column !== column || tooltipStore.row !== row || !tooltipStore.visible) {
const ctEl = tdEl.querySelector('.vxe-cell--wrapper');
let ovEl = null;
let tipEl = tdEl.querySelector(column.type === 'html' ? '.vxe-cell--html' : '.vxe-cell--label');
if (column.treeNode) {
ovEl = tdEl.querySelector('.vxe-tree-cell');
}
if (!tipEl) {
tipEl = ctEl;
}
handleTooltip(evnt, tooltipOpts, 'body', tdEl, ovEl || ctEl, tipEl, params);
}
},
/**
* 触发表尾 tooltip 事件
*/
triggerFooterTooltipEvent(evnt, params) {
const { column } = params;
const { tooltipStore } = reactData;
const footerTooltipOpts = computeFooterTooltipOpts.value;
const tdEl = evnt.currentTarget;
handleTargetEnterEvent(tooltipStore.column !== column || !!tooltipStore.row);
if (tooltipStore.column !== column || !tooltipStore.visible) {
const ctEl = tdEl.querySelector('.vxe-cell--wrapper');
let ovEl = null;
let tipEl = tdEl.querySelector(column.type === 'html' ? '.vxe-cell--html' : '.vxe-cell--label');
if (column.type === 'html') {
ovEl = tdEl.querySelector('.vxe-cell--html');
}
if (!tipEl) {
tipEl = ctEl;
}
handleTooltip(evnt, footerTooltipOpts, 'footer', tdEl, ovEl || ctEl, tipEl, params);
}
},
handleTargetLeaveEvent() {
const tooltipOpts = computeTooltipOpts.value;
let $tooltip = refTooltip.value;
if ($tooltip && $tooltip.setActived) {
$tooltip.setActived(false);
}
if (tooltipOpts.enterable) {
internalData.tooltipTimeout = setTimeout(() => {
$tooltip = refTooltip.value;
if ($tooltip && $tooltip.isActived && !$tooltip.isActived()) {
$xeTable.closeTooltip();
}
}, tooltipOpts.leaveDelay);
}
else {
$xeTable.closeTooltip();
}
},
triggerHeaderCellClickEvent(evnt, params) {
const { _lastResizeTime } = internalData;
const sortOpts = computeSortOpts.value;
const columnOpts = computeColumnOpts.value;
const currentColumnOpts = computeCurrentColumnOpts.value;
const { column } = params;
const cell = evnt.currentTarget;
const triggerResizable = _lastResizeTime && _lastResizeTime > Date.now() - 300;
const triggerSort = getEventTargetNode(evnt, cell, 'vxe-cell--sort').flag;
const triggerFilter = getEventTargetNode(evnt, cell, 'vxe-cell--filter').flag;
if (sortOpts.trigger === 'cell' && !(triggerResizable || triggerSort || triggerFilter)) {
$xeTable.triggerSortEvent(evnt, column, getNextSortOrder(column));
}
if ($xeGantt) {
const ganttReactData = $xeGantt.reactData;
ganttReactData.activeBarRowid = null;
}
dispatchEvent('header-cell-click', Object.assign({ triggerResizable, triggerSort, triggerFilter, cell }, params), evnt);
if ((columnOpts.isCurrent || props.highlightCurrentColumn) && (!currentColumnOpts.trigger || ['header', 'default'].includes(currentColumnOpts.trigger))) {
$xeTable.triggerCurrentColumnEvent(evnt, params);
}
},
triggerHeaderCellDblclickEvent(evnt, params) {
dispatchEvent('header-cell-dblclick', Object.assign({ cell: evnt.currentTarget }, params), evnt);
},
/**
* 列点击事件
* 如果是单击模式,则激活为编辑状态
* 如果是双击模式,则单击后选中状态
*/
triggerCellClickEvent(evnt, params) {
const { treeConfig, highlightCurrentRow, highlightCurrentColumn, editConfig, aggregateConfig, rowGroupConfig } = props;
const { editStore, isDragResize, expandColumn, checkboxColumn, radioColumn } = reactData;
if (isDragResize) {
return;
}
const expandOpts = computeExpandOpts.value;
const editOpts = computeEditOpts.value;
const treeOpts = computeTreeOpts.value;
const radioOpts = computeRadioOpts.value;
const checkboxOpts = computeCheckboxOpts.value;
const keyboardOpts = computeKeyboardOpts.value;
const aggregateOpts = computeAggregateOpts.value;
const rowOpts = computeRowOpts.value;
const columnOpts = computeColumnOpts.value;
const currentColumnOpts = computeCurrentColumnOpts.value;
const { actived, focused } = editStore;
const { row, column } = params;
const { type, treeNode, rowGroupNode } = column;
const isRadioType = type === 'radio';
const isCheckboxType = type === 'checkbox';
const isExpandType = type === 'expand';
const cell = evnt.currentTarget;
const triggerRadio = isRadioType && getEventTargetNode(evnt, cell, 'vxe-cell--radio').flag;
const triggerCheckbox = isCheckboxType && getEventTargetNode(evnt, cell, 'vxe-cell--checkbox').flag;
const triggerTreeNode = treeNode && getEventTargetNode(evnt, cell, 'vxe-cell--tree-btn').flag;
const triggerExpandNode = isExpandType && getEventTargetNode(evnt, cell, 'vxe-table--expanded').flag;
const triggerRowGroupNode = isExpandType && getEventTargetNode(evnt, cell, 'vxe-row-group--node-btn').flag;
params = Object.assign({ cell, triggerRadio, triggerCheckbox, triggerTreeNode, triggerExpandNode }, params);
if (!triggerCheckbox && !triggerRadio) {
// 如果是展开行
if (!triggerExpandNode && ((expandColumn && expandOpts.trigger === 'row') || (isExpandType && expandOpts.trigger === 'cell'))) {
$xeTable.triggerRowExpandEvent(evnt, params);
}
// 如果是树形表格
if (treeConfig && (treeOpts.trigger === 'row' || (treeNode && treeOpts.trigger === 'cell'))) {
$xeTable.triggerTreeExpandEvent(evnt, params);
}
// 如果是行分组
if ((aggregateConfig || rowGroupConfig) && (aggregateOpts.trigger === 'row' || (rowGroupNode && aggregateOpts.trigger === 'cell'))) {
$xeTable.triggerRowGroupExpandEvent(evnt, params);
}
}
// 如果点击了树节点
if (!triggerTreeNode) {
if (!triggerExpandNode && !triggerRowGroupNode) {
// 如果是当前行
if (rowOpts.isCurrent || highlightCurrentRow) {
if (!triggerCheckbox && !triggerRadio) {
$xeTable.triggerCurrentRowEvent(evnt, params);
}
}
// 如果是当前列
if ((columnOpts.isCurrent || highlightCurrentColumn) && (!currentColumnOpts.trigger || ['cell', 'default'].includes(currentColumnOpts.trigger))) {
if (!triggerCheckbox && !triggerRadio) {
$xeTable.triggerCurrentColumnEvent(evnt, params);
}
}
// 如果是单选框
if (!triggerRadio && ((radioColumn && radioOpts.trigger === 'row') || (isRadioType && radioOpts.trigger === 'cell'))) {
$xeTable.triggerRadioRowEvent(evnt, params);
}
// 如果是复选框
if (!triggerCheckbox && ((checkboxColumn && checkboxOpts.trigger === 'row') || (isCheckboxType && checkboxOpts.trigger === 'cell'))) {
$xeTable.handleToggleCheckRowEvent(evnt, params);
}
}
// 如果设置了单元格选中功能,则不会使用点击事件去处理(只能支持双击模式)
if (isEnableConf(editConfig)) {
// 记录点击输入框聚焦状态
if (keyboardOpts.arrowCursorLock && evnt && editOpts.mode === 'cell' && evnt.target && /^input|textarea$/i.test(evnt.target.tagName)) {
focused.column = column;
focused.row = row;
}
if (editOpts.trigger === 'manual') {
if (actived.args && actived.row === row && column !== actived.column) {
if (editOpts.mode === 'row') {
handleChangeCell(evnt, params);
}
else {
checkValidate('blur')
.catch((e) => e);
}
}
}
else if (!actived.args || row !== actived.row || column !== actived.column) {
if (editOpts.trigger === 'click') {
handleChangeCell(evnt, params);
}
else if (editOpts.trigger === 'dblclick') {
if (editOpts.mode === 'row' && actived.row === row) {
handleChangeCell(evnt, params);
}
}
}
}
}
// 如果是双击编辑模式
if (isEnableConf(editConfig) && editOpts.trigger === 'dblclick') {
if (actived.row && actived.column) {
if (editOpts.mode === 'row') {
if (!$xeTable.eqRow(actived.row, row)) {
$xeTable.handleClearEdit(evnt);
}
}
else if (editOpts.mode === 'cell') {
if (!$xeTable.eqRow(actived.row, row) || actived.column.id !== column.id) {
$xeTable.handleClearEdit(evnt);
}
}
}
}
if ($xeGantt) {
const ganttReactData = $xeGantt.reactData;
ganttReactData.activeBarRowid = null;
}
dispatchEvent('cell-click', params, evnt);
},
/**
* 列双击点击事件
* 如果是双击模式,则激活为编辑状态
*/
triggerCellDblclickEvent(evnt, params) {
const { editConfig } = props;
const { editStore, isDragResize } = reactData;
if (isDragResize) {
return;
}
const editOpts = computeEditOpts.value;
const { actived } = editStore;
const cell = evnt.currentTarget;
params = Object.assign({ cell }, params);
if (isEnableConf(editConfig) && editOpts.trigger === 'dblclick') {
if (!actived.args || evnt.currentTarget !== actived.args.cell) {
if (editOpts.mode === 'row') {
checkValidate('blur')
.catch((e) => e)
.then(() => {
$xeTable.handleEdit(params, evnt)
.then(() => checkValidate('change'))
.catch((e) => e);
});
}
else if (editOpts.mode === 'cell') {
$xeTable.handleEdit(params, evnt)
.then(() => checkValidate('change'))
.catch((e) => e);
}
}
}
dispatchEvent('cell-dblclick', params, evnt);
},
triggerFooterCellClickEvent(evnt, params) {
const cell = evnt.currentTarget;
params = Object.assign({ cell }, params);
if ($xeGantt) {
const ganttReactData = $xeGantt.reactData;
ganttReactData.activeBarRowid = null;
}
$xeTable.dispatchEvent('footer-cell-click', params, evnt);
},
triggerFooterCellDblclickEvent(evnt, params) {
const cell = evnt.currentTarget;
params = Object.assign({ cell }, params);
$xeTable.dispatchEvent('footer-cell-dblclick', params, evnt);
},
handleToggleCheckRowEvent(evnt, params) {
const { selectCheckboxMaps } = internalData;
const checkboxOpts = computeCheckboxOpts.value;
const { checkField, trigger } = checkboxOpts;
const { row } = params;
if (trigger === 'manual') {
return;
}
let checked = false;
if (checkField) {
checked = !XEUtils.get(row, checkField);
}
else {
checked = !selectCheckboxMaps[getRowid($xeTable, row)];
}
if (evnt) {
$xeTable.triggerCheckRowEvent(evnt, params, checked);
}
else {
$xeTable.handleBatchSelectRows([row], checked);
$xeTable.checkSelectionStatus();
}
},
triggerCheckRowEvent(evnt, params, checked) {
const { treeConfig } = props;
const { row } = params;
const { isRowGroupStatus } = reactData;
const { fullAllDataRowIdData, afterFullData, afterTreeFullData, afterGroupFullData } = internalData;
const checkboxOpts = computeCheckboxOpts.value;
const aggregateOpts = computeAggregateOpts.value;
const treeOpts = computeTreeOpts.value;
const { checkMethod, trigger, checkStrictly } = checkboxOpts;
if (trigger === 'manual') {
return;
}
evnt.stopPropagation();
if (checkboxOpts.isShiftKey && evnt.shiftKey) {
const { handleGetRowId } = createHandleGetRowId($xeTable);
const checkboxRecords = $xeTable.getCheckboxRecords();
let currSeq = -1;
let currRow = null;
const currRowid = handleGetRowId(row);
const rowRest = fullAllDataRowIdData[currRowid];
if (rowRest) {
currRow = rowRest.row;
currSeq = rowRest._seq;
}
if (currRow && checkboxRecords.length) {
let rangeRows = [];
let firstSeq = -1;
let firstRow = null;
let firstRowid = '';
let lastSeq = -1;
let lastRow = null;
let lastRowid = '';
// 根据序号取出范围最小/最大的行
const selectMaps = {};
checkboxRecords.forEach(item => {
const rowid = handleGetRowId(item);
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
if (!firstRow || firstSeq > rowRest._seq) {
firstRowid = rowRest.rowid;
firstRow = rowRest.row;
firstSeq = rowRest._seq;
}
if (!lastRow || lastSeq < rowRest._seq) {
lastRowid = rowRest.rowid;
lastRow = rowRest.row;
lastSeq = rowRest._seq;
}
}
selectMaps[rowid] = item;
});
// 如果已选只有一条并选择当前则跳过
if (firstRow && lastRow && (checkboxRecords.length > 1 || currRowid !== firstRowid) && (Math.abs(firstSeq - lastSeq) > 1 || Math.abs(currSeq - firstSeq) > 1 || Math.abs(currSeq - lastSeq) > 1)) {
// 树与分组
if (treeConfig || isRowGroupStatus) {
const { transform } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
const iteratorChildField = treeConfig ? (transform ? treeOpts.mapChildrenField : childrenField) : aggregateOpts.mapChildrenField;
let isMatchFirst = false;
let matchStartRowid = '';
let matchEndRowid = '';
const handleGetChildRowid = (rowid, isLast) => {
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
const item = rowRest.row;
const childList = item[iteratorChildField];
if (childList && childList.length) {
const targetRow = isLast ? XEUtils.last(childList) : XEUtils.first(childList);
return handleGetChildRowid(handleGetRowId(targetRow), isLast);
}
}
return rowid;
};
const handleGetSelectParentRowid = (rowid) => {
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
const parentItem = rowRest.parent;
if (parentItem) {
const parentRowid = handleGetRowId(parentItem);
if (selectMaps[parentRowid]) {
return handleGetSelectParentRowid(parentRowid);
}
}
}
return rowid;
};
const handleGetRootRow = (row) => {
const rowid = handleGetRowId(row);
if (rowid) {
const rest = fullAllDataRowIdData[rowid];
if (rest) {
return rest.parent ? handleGetRootRow(rest.parent) : rest;
}
}
return null;
};
if (currSeq < firstSeq) {
matchStartRowid = handleGetChildRowid(currRowid, 0);
matchEndRowid = handleGetChildRowid(firstRowid, 1);
}
else {
if (currSeq > lastSeq) {
matchStartRowid = handleGetSelectParentRowid(lastRowid);
}
else {
matchStartRowid = handleGetChildRowid(firstRowid, 0);
}
matchEndRowid = handleGetChildRowid(currRowid, 1);
}
const handleRangeRow = (item) => {
const rowid = handleGetRowId(item);
const childList = item[iteratorChildField];
if (!isMatchFirst && rowid === matchStartRowid) {
isMatchFirst = true;
}
// 如果是父子关联,则排除父节点
if (isMatchFirst && (checkStrictly || !childList || !childList.length)) {
rangeRows.push(item);
}
// break
return rowid === matchEndRowid;
};
if (treeConfig) {
const matchStartRowRest = fullAllDataRowIdData[matchStartRowid];
const firstRootRowRest = matchStartRowRest ? handleGetRootRow(matchStartRowRest.row) : null;
if (firstRootRowRest) {
// 优化查找复杂度
XEUtils.findTree(afterTreeFullData.slice(firstRootRowRest.treeIndex), handleRangeRow, { children: iteratorChildField });
}
else {
XEUtils.findTree(afterTreeFullData, handleRangeRow, { children: iteratorChildField });
}
}
else {
XEUtils.findTree(afterGroupFullData, handleRangeRow, { children: iteratorChildField });
}
}
else {
const _currRowIndex = $xeTable.getVTRowIndex(currRow);
const _firstRowIndex = $xeTable.getVTRowIndex(firstRow);
const _lastRowIndex = $xeTable.getVTRowIndex(lastRow);
if (_currRowIndex < _firstRowIndex) {
rangeRows = afterFullData.slice(_currRowIndex, _firstRowIndex + 1);
}
else if (_currRowIndex > _lastRowIndex) {
rangeRows = afterFullData.slice(_lastRowIndex, _currRowIndex + 1);
}
else {
rangeRows = afterFullData.slice(_firstRowIndex, _currRowIndex + 1);
}
}
$xeTable.setAllCheckboxRow(false);
nextTick(() => {
handleCheckedCheckboxRow(rangeRows, true, false);
});
dispatchEvent('checkbox-range-select', Object.assign({ rangeRecords: rangeRows }, params), evnt);
}
}
}
if (!checkMethod || checkMethod({ $table: $xeTable, row })) {
$xeTable.handleBatchSelectRows([row], checked);
$xeTable.checkSelectionStatus();
dispatchEvent('checkbox-change', Object.assign({
records: () => $xeTable.getCheckboxRecords(),
reserves: () => $xeTable.getCheckboxReserveRecords(),
indeterminates: () => $xeTable.getCheckboxIndeterminateRecords(),
checked
}, params), evnt);
}
},
/**
* 多选,选中所有事件
*/
triggerCheckAllEvent(evnt, value) {
const checkboxOpts = computeCheckboxOpts.value;
const { trigger } = checkboxOpts;
if (trigger === 'manual') {
return;
}
if (evnt) {
evnt.stopPropagation();
}
handleCheckAllEvent(evnt, value);
},
/**
* 单选,行选中事件
*/
triggerRadioRowEvent(evnt, params) {
const { selectRadioRow: oldValue } = reactData;
const { row } = params;
const radioOpts = computeRadioOpts.value;
const { trigger, strict, checkMethod } = radioOpts;
if (trigger === 'manual') {
return;
}
evnt.stopPropagation();
if (!checkMethod || checkMethod({ $table: $xeTable, row })) {
let newValue = row;
let isChange = oldValue !== newValue;
if (strict) {
handleCheckedRadioRow(newValue, false);
}
else {
if (oldValue === newValue) {
newValue = null;
}
isChange = oldValue !== newValue;
if (isChange && newValue) {
handleCheckedRadioRow(newValue, false);
}
else {
newValue = null;
$xeTable.clearRadioRow();
}
}
if (isChange) {
dispatchEvent('radio-change', Object.assign({ oldValue, newValue, selected: !!newValue }, params), evnt);
}
}
},
triggerCurrentColumnEvent(evnt, params) {
const { currentColumn: oldValue } = reactData;
const columnOpts = computeColumnOpts.value;
const currentColumnOpts = computeCurrentColumnOpts.value;
const beforeRowMethod = currentColumnOpts.beforeSelectMethod || columnOpts.currentMethod;
let newValue = params.column;
const { trigger, strict } = currentColumnOpts;
if (trigger === 'manual') {
return;
}
let isChange = oldValue !== newValue;
if (!beforeRowMethod || beforeRowMethod({ column: newValue, $table: $xeTable })) {
if (strict) {
$xeTable.setCurrentColumn(newValue);
}
else {
if (oldValue === newValue) {
newValue = null;
}
isChange = oldValue !== newValue;
if (isChange && newValue) {
$xeTable.setCurrentColumn(newValue);
}
else {
newValue = null;
$xeTable.clearCurrentColumn();
}
}
if (isChange) {
dispatchEvent('current-column-change', Object.assign({ oldValue, newValue, selected: !!newValue }, params), evnt);
}
}
else {
dispatchEvent('current-column-disabled', params, evnt);
}
},
triggerCurrentRowEvent(evnt, params) {
const { currentRow: oldValue } = internalData;
const rowOpts = computeRowOpts.value;
const currentRowOpts = computeCurrentRowOpts.value;
const beforeRowMethod = currentRowOpts.beforeSelectMethod || rowOpts.currentMethod;
let { row: newValue } = params;
const { trigger, strict } = currentRowOpts;
if (trigger === 'manual') {
return;
}
let isChange = oldValue !== newValue;
if (!beforeRowMethod || beforeRowMethod({ row: newValue, $table: $xeTable })) {
if (strict) {
$xeTable.setCurrentRow(newValue);
}
else {
if (oldValue === newValue) {
newValue = null;
}
isChange = oldValue !== newValue;
if (isChange && newValue) {
$xeTable.setCurrentRow(newValue);
}
else {
newValue = null;
$xeTable.clearCurrentRow();
}
}
if (isChange) {
dispatchEvent('current-row-change', Object.assign({ oldValue, newValue, selected: !!newValue }, params), evnt);
// 已废弃
dispatchEvent('current-change', Object.assign({ oldValue, newValue }, params), evnt);
}
}
else {
dispatchEvent('current-row-disabled', params, evnt);
}
},
/**
* 展开行事件
*/
triggerRowExpandEvent(evnt, params) {
const { expandColumn } = reactData;
const { rowExpandLazyLoadedMaps } = internalData;
const expandOpts = computeExpandOpts.value;
const { row } = params;
const { lazy, trigger } = expandOpts;
if (trigger === 'manual') {
return;
}
evnt.stopPropagation();
const rowid = getRowid($xeTable, row);
if (!lazy || !rowExpandLazyLoadedMaps[rowid]) {
const expanded = !$xeTable.isRowExpandByRow(row);
const columnIndex = expandColumn ? $xeTable.getColumnIndex(expandColumn) : -1;
const $columnIndex = expandColumn ? $xeTable.getVMColumnIndex(expandColumn) : -1;
$xeTable.setRowExpand(row, expanded);
dispatchEvent('toggle-row-expand', {
expanded,
column: expandColumn,
columnIndex,
$columnIndex,
row,
rowIndex: $xeTable.getRowIndex(row),
$rowIndex: $xeTable.getVMRowIndex(row)
}, evnt);
}
},
/**
* 行分组事件
*/
triggerRowGroupExpandEvent(evnt, params) {
const { rowGroupExpandedMaps } = internalData;
const aggregateOpts = computeAggregateOpts.value;
const { row, column } = params;
const { trigger } = aggregateOpts;
if (trigger === 'manual') {
return;
}
evnt.stopPropagation();
const rowid = getRowid($xeTable, row);
const expanded = !rowGroupExpandedMaps[rowid];
const columnIndex = $xeTable.getColumnIndex(column);
const $columnIndex = $xeTable.getVMColumnIndex(column);
$xeTable.setRowGroupExpand(row, expanded);
dispatchEvent('toggle-row-group-expand', { expanded, column, columnIndex, $columnIndex, row }, evnt);
},
/**
* 展开树节点事件
*/
triggerTreeExpandEvent(evnt, params) {
const { treeExpandLazyLoadedMaps, treeEATime } = internalData;
const treeOpts = computeTreeOpts.value;
const { row, column } = params;
const { lazy, trigger, accordion } = treeOpts;
if (trigger === 'manual') {
return;
}
evnt.stopPropagation();
const rowid = getRowid($xeTable, row);
if (!lazy || !treeExpandLazyLoadedMaps[rowid]) {
const expanded = !$xeTable.isTreeExpandByRow(row);
const columnIndex = $xeTable.getColumnIndex(column);
const $columnIndex = $xeTable.getVMColumnIndex(column);
if (treeEATime) {
clearTimeout(treeEATime);
}
$xeTable.setTreeExpand(row, expanded).then(() => {
if (accordion) {
internalData.treeEATime = setTimeout(() => {
internalData.treeEATime = undefined;
$xeTable.scrollToRow(row);
}, 30);
}
});
dispatchEvent('toggle-tree-expand', { expanded, column, columnIndex, $columnIndex, row }, evnt);
}
},
handleColumnSortEvent(evnt, column) {
const { mouseConfig } = props;
const mouseOpts = computeMouseOpts.value;
const { field, sortable, order } = column;
if (sortable) {
const params = { $table: $xeTable, $event: evnt, column, field, property: field, order, sortList: $xeTable.getSortColumns(), sortTime: column.sortTime };
if (mouseConfig && mouseOpts.area && $xeTable.handleSortEvent) {
$xeTable.handleSortEvent(evnt, params);
}
if (!order) {
dispatchEvent('clear-sort', params, evnt);
}
dispatchEvent('sort-change', params, evnt);
}
},
/**
* 点击排序事件
*/
triggerSortEvent(evnt, column, order) {
const sortOpts = computeSortOpts.value;
const { multiple, allowClear } = sortOpts;
const { field, sortable } = column;
if (sortable) {
if (!order || column.order === order) {
if (allowClear) {
$xeTable.clearSort(multiple ? column : null);
}
}
else {
$xeTable.sort({ field, order });
}
$xeTable.handleColumnSortEvent(evnt, column);
}
},
handleCellRuleUpdateStatus(type, cellParams, cellValue) {
const { validStore } = reactData;
const { row, column } = cellParams;
if ($xeTable.hasCellRules) {
if ($xeTable.hasCellRules(type, row, column)) {
const cell = $xeTable.getCellElement(row, column);
if (cell) {
const customVal = !XEUtils.isUndefined(cellValue);
return $xeTable.validCellRules(type, row, column, cellValue)
.then(() => {
if (customVal && validStore.visible) {
setCellValue(row, column, cellValue);
}
$xeTable.clearValidate(row, column);
})
.catch(({ rule }) => {
if (customVal) {
setCellValue(row, column, cellValue);
}
$xeTable.showValidTooltip({ rule, row, column, cell });
});
}
}
}
return nextTick();
},
/**
* 表头单元格按下事件
*/
triggerHeaderCellMousedownEvent(evnt, params) {
const { mouseConfig } = props;
const mouseOpts = computeMouseOpts.value;
const columnOpts = computeColumnOpts.value;
const columnDragOpts = computeColumnDragOpts.value;
const { trigger, isCrossDrag, isPeerDrag, disabledMethod } = columnDragOpts;
const cell = evnt.currentTarget;
const triggerInput = cell && cell.tagName && cell.tagName.toLowerCase() === 'input';
const triggerCheckbox = getEventTargetNode(evnt, cell, 'vxe-cell--checkbox').flag;
const triggerSort = getEventTargetNode(evnt, cell, 'vxe-cell--sort').flag;
const triggerFilter = getEventTargetNode(evnt, cell, 'vxe-cell--filter').flag;
let triggerDrag = false;
const isColDragCell = columnOpts.drag && trigger === 'cell';
if (!(triggerInput || triggerCheckbox || triggerSort || triggerFilter)) {
const { column } = params;
if (isColDragCell && !column.fixed && (isCrossDrag || isPeerDrag || !column.parentId) && !(disabledMethod && disabledMethod(params))) {
triggerDrag = true;
$xeTable.handleHeaderCellDragMousedownEvent(evnt, params);
}
}
if (!triggerDrag && mouseConfig && mouseOpts.area && $xeTable.handleHeaderCellAreaMouseDnEvent) {
$xeTable.handleHeaderCellAreaMouseDnEvent(evnt, Object.assign({ cell, triggerSort, triggerFilter }, params));
}
$xeTable.focus();
if ($xeTable.closeMenu) {
$xeTable.closeMenu();
}
},
/**
* 单元格按下事件
*/
triggerCellMousedownEvent(evnt, params) {
const { column } = params;
const { type, treeNode } = column;
const isRadioType = type === 'radio';
const isCheckboxType = type === 'checkbox';
const isExpandType = type === 'expand';
const rowOpts = computeRowOpts.value;
const rowDragOpts = computeRowDragOpts.value;
const { trigger, isCrossDrag, isPeerDrag, disabledMethod } = rowDragOpts;
const cell = evnt.currentTarget;
params.cell = cell;
const triggerInput = cell && cell.tagName && cell.tagName.toLowerCase() === 'input';
const triggerRadio = isRadioType && getEventTargetNode(evnt, cell, 'vxe-cell--radio').flag;
const triggerCheckbox = isCheckboxType && getEventTargetNode(evnt, cell, 'vxe-cell--checkbox').flag;
const triggerTreeNode = treeNode && getEventTargetNode(evnt, cell, 'vxe-cell--tree-btn').flag;
const triggerExpandNode = isExpandType && getEventTargetNode(evnt, cell, 'vxe-table--expanded').flag;
let isColDragCell = false;
if (rowOpts.drag) {
isColDragCell = trigger === 'row' || (column.dragSort && trigger === 'cell');
}
let triggerDrag = false;
if (!(triggerInput || triggerRadio || triggerCheckbox || triggerTreeNode || triggerExpandNode)) {
if (isColDragCell && (isCrossDrag || isPeerDrag || !params.level) && !(disabledMethod && disabledMethod(params))) {
triggerDrag = true;
$xeTable.handleCellDragMousedownEvent(evnt, params);
}
}
if (!triggerDrag && $xeTable.handleCellMousedownEvent) {
$xeTable.handleCellMousedownEvent(evnt, params);
}
$xeTable.focus();
$xeTable.closeFilter();
if ($xeTable.closeMenu) {
$xeTable.closeMenu();
}
},
triggerCellMouseupEvent() {
clearDragStatus();
},
/**
* 行拖拽
*/
handleRowDragDragstartEvent(evnt) {
if (evnt.dataTransfer) {
evnt.dataTransfer.setDragImage(getTpImg(), 0, 0);
}
$xeTable.closeTooltip();
},
handleRowDragSwapEvent(evnt, isSyncRow, dragRow, prevDragRow, prevDragPos, prevDragToChild) {
const { treeConfig, dragConfig } = props;
const rowDragOpts = computeRowDragOpts.value;
const { afterFullData, tableFullData, fullAllDataRowIdData } = internalData;
const $xeGanttView = internalData.xeGanttView;
const { animation, isPeerDrag, isCrossDrag, isSelfToChildDrag, dragEndMethod, dragToChildMethod } = rowDragOpts;
const treeOpts = computeTreeOpts.value;
const cellOpts = computeCellOpts.value;
const rowOpts = computeRowOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const { transform, rowField, mapChildrenField, parentField } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
const dEndMethod = dragEndMethod || (dragConfig ? dragConfig.dragEndMethod : null);
const dragOffsetIndex = prevDragPos === 'bottom' ? 1 : 0;
const el = refElem.value;
const errRest = {
status: false
};
if (!(el && prevDragRow && dragRow)) {
handleRowDragEndClearStatus();
return Promise.resolve(errRest);
}
// 判断是否有拖动
if (prevDragRow !== dragRow) {
const dragParams = {
oldRow: dragRow,
newRow: prevDragRow,
dragRow,
dragPos: prevDragPos,
dragToChild: !!prevDragToChild,
offsetIndex: dragOffsetIndex
};
const dragRowid = getRowid($xeTable, dragRow);
const dragRowRest = fullAllDataRowIdData[dragRowid] || {};
const _dragRowIndex = dragRowRest._index;
let dragRowHeight = 0;
let dragOffsetTop = -1;
if (animation) {
dragRowHeight = getCellRestHeight(dragRowRest, cellOpts, rowOpts, defaultRowHeight);
const oldTrEl = el.querySelector(`.vxe-body--row[rowid="${dragRowid}"]`);
if (oldTrEl) {
dragOffsetTop = oldTrEl.offsetTop;
}
}
let oafIndex = -1;
let nafIndex = -1;
const oldRest = dragRowRest;
const newRowid = getRowid($xeTable, prevDragRow);
const newRest = fullAllDataRowIdData[newRowid];
const oldAllMaps = {};
let isSelfToChildStatus = false;
// 如果为树结构
if (treeConfig) {
if (transform) {
if (oldRest && newRest) {
const { level: oldLevel } = oldRest;
const { level: newLevel } = newRest;
XEUtils.eachTree([dragRow], item => {
oldAllMaps[getRowid($xeTable, item)] = item;
}, { children: mapChildrenField });
if (oldLevel && newLevel) {
// 子到子
if (isPeerDrag && !isCrossDrag) {
if (oldRest.row[parentField] !== newRest.row[parentField]) {
// 非同级
handleRowDragEndClearStatus();
return Promise.resolve(errRest);
}
}
else {
if (!isCrossDrag) {
handleRowDragEndClearStatus();
return Promise.resolve(errRest);
}
if (oldAllMaps[newRowid]) {
isSelfToChildStatus = true;
if (!(isCrossDrag && isSelfToChildDrag)) {
if (VxeUI.modal) {
VxeUI.modal.message({
status: 'error',
content: getI18n$2('vxe.error.treeDragChild')
});
}
handleRowDragEndClearStatus();
return Promise.resolve(errRest);
}
}
}
}
else if (oldLevel) {
// 子到根
if (!isCrossDrag) {
handleRowDragEndClearStatus();
return Promise.resolve(errRest);
}
}
else if (newLevel) {
// 根到子
if (!isCrossDrag) {
handleRowDragEndClearStatus();
return Promise.resolve(errRest);
}
if (oldAllMaps[newRowid]) {
isSelfToChildStatus = true;
if (!(isCrossDrag && isSelfToChildDrag)) {
if (VxeUI.modal) {
VxeUI.modal.message({
status: 'error',
content: getI18n$2('vxe.error.treeDragChild')
});
}
handleRowDragEndClearStatus();
return Promise.resolve(errRest);
}
}
}
else ;
}
}
}
const isDragToChildFlag = isSelfToChildDrag && dragToChildMethod ? dragToChildMethod(dragParams) : prevDragToChild;
if (dEndMethod) {
handleRowDragEndClearStatus();
}
return Promise.resolve(dEndMethod ? dEndMethod(dragParams) : true).then((status) => {
if (!status) {
return errRest;
}
// 如果为树结构
if (treeConfig) {
if (transform) {
// 移出源位置
if (oldRest && newRest) {
const fullList = XEUtils.toTreeArray(internalData.afterTreeFullData, {
updated: false,
key: rowField,
parentKey: parentField,
children: mapChildrenField
});
// 移出
const otfIndex = $xeTable.findRowIndexOf(fullList, dragRow);
fullList.splice(otfIndex, 1);
// 插入
const ptfIndex = $xeTable.findRowIndexOf(fullList, prevDragRow);
const ntfIndex = ptfIndex + dragOffsetIndex;
fullList.splice(ntfIndex, 0, dragRow);
// 改变层级
if (isSelfToChildStatus && (isCrossDrag && isSelfToChildDrag)) {
XEUtils.each(dragRow[childrenField], childRow => {
childRow[parentField] = dragRow[parentField];
});
}
dragRow[parentField] = isDragToChildFlag ? prevDragRow[rowField] : prevDragRow[parentField];
internalData.tableFullTreeData = XEUtils.toArrayTree(fullList, {
key: rowField,
parentKey: parentField,
children: childrenField,
mapChildren: mapChildrenField
});
}
}
}
else {
// 移出
oafIndex = $xeTable.findRowIndexOf(afterFullData, dragRow);
const otfIndex = $xeTable.findRowIndexOf(tableFullData, dragRow);
afterFullData.splice(oafIndex, 1);
tableFullData.splice(otfIndex, 1);
// 插入
const pafIndex = $xeTable.findRowIndexOf(afterFullData, prevDragRow);
const ptfIndex = $xeTable.findRowIndexOf(tableFullData, prevDragRow);
nafIndex = pafIndex + dragOffsetIndex;
const ntfIndex = ptfIndex + dragOffsetIndex;
afterFullData.splice(nafIndex, 0, dragRow);
tableFullData.splice(ntfIndex, 0, dragRow);
}
$xeTable.handleClearStack();
$xeTable.handleTableData(treeConfig && transform);
$xeTable.cacheRowMap(false);
updateScrollYStatus();
if (!(treeConfig && transform)) {
$xeTable.updateAfterDataIndex();
}
$xeTable.checkSelectionStatus();
if (reactData.scrollYLoad) {
$xeTable.updateScrollYSpace();
}
if (evnt) {
dispatchEvent('row-dragend', {
oldRow: dragRow,
newRow: prevDragRow,
dragRow,
dragPos: prevDragPos,
dragToChild: isDragToChildFlag,
offsetIndex: dragOffsetIndex,
_index: {
newIndex: nafIndex,
oldIndex: oafIndex
}
}, evnt);
}
return nextTick().then(() => {
if (animation) {
const { tableData } = reactData;
const { fullAllDataRowIdData } = internalData;
const dragRowRest = fullAllDataRowIdData[dragRowid];
const _newRowIndex = dragRowRest._index;
const firstRow = tableData[0];
const firstRowRest = fullAllDataRowIdData[getRowid($xeTable, firstRow)];
let wrapperEl = el;
if ($xeGantt && $xeGanttView) {
const { refGanttContainerElem } = $xeGantt.getRefMaps();
const ganttContainerElem = refGanttContainerElem.value;
if (ganttContainerElem) {
wrapperEl = ganttContainerElem;
}
}
if (firstRowRest) {
const _firstRowIndex = firstRowRest._index;
const _lastRowIndex = _firstRowIndex + tableData.length;
let rsIndex = -1;
let reIndex = -1;
let offsetRate = 1;
if (_dragRowIndex < _firstRowIndex) {
// 从上往下虚拟拖拽
rsIndex = 0;
reIndex = _newRowIndex - _firstRowIndex;
}
else if (_dragRowIndex > _lastRowIndex) {
// 从下往上虚拟拖拽
const $newRowIndex = dragRowRest.$index;
rsIndex = $newRowIndex + 1;
reIndex = tableData.length;
offsetRate = -1;
}
else {
if (_newRowIndex > _dragRowIndex) {
// 从上往下拖拽
rsIndex = _dragRowIndex - _firstRowIndex;
reIndex = rsIndex + _newRowIndex - _dragRowIndex;
}
else {
// 从下往上拖拽
rsIndex = _newRowIndex - _firstRowIndex;
reIndex = rsIndex + _dragRowIndex - _newRowIndex + 1;
offsetRate = -1;
}
}
const dragRangeList = tableData.slice(rsIndex, reIndex);
if (dragRangeList.length) {
const dtClss = [];
dragRangeList.forEach(row => {
const rowid = getRowid($xeTable, row);
dtClss.push(`.vxe-body--row[rowid="${rowid}"]`);
if ($xeGantt) {
dtClss.push(`.vxe-gantt-view--body-row[rowid="${rowid}"]`, `.vxe-gantt-view--chart-row[rowid="${rowid}"]`);
}
});
const dtTrList = wrapperEl.querySelectorAll(dtClss.join(','));
moveRowAnimateToTb(dtTrList, offsetRate * dragRowHeight);
}
}
const drClss = [`.vxe-body--row[rowid="${dragRowid}"]`];
if ($xeGantt) {
drClss.push(`.vxe-gantt-view--body-row[rowid="${dragRowid}"]`, `.vxe-gantt-view--chart-row[rowid="${dragRowid}"]`);
}
const newDtTrList = wrapperEl.querySelectorAll(drClss.join(','));
const newTrEl = newDtTrList[0];
if (dragOffsetTop > -1 && newTrEl) {
moveRowAnimateToTb(newDtTrList, dragOffsetTop - newTrEl.offsetTop);
}
}
updateRowOffsetTop();
updateRowExpandStyle();
$xeTable.updateCellAreas();
$xeTable.recalculate();
}).then(() => {
return {
status: true
};
});
}).catch(() => {
return errRest;
}).then((rest) => {
handleRowDragEndClearStatus();
return rest;
});
}
handleRowDragEndClearStatus();
return Promise.resolve(errRest);
},
handleCrossTableRowDragCancelEvent() {
handleRowDragEndClearStatus();
},
/**
* 处理跨表拖拽完成
*/
handleCrossTableRowDragFinishEvent(evnt) {
const { tableData } = reactData;
const { fullAllDataRowIdData } = internalData;
const rowOpts = computeRowOpts.value;
const cellOpts = computeCellOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const rowDragOpts = computeRowDragOpts.value;
const { animation, isCrossTableDrag } = rowDragOpts;
const treeOpts = computeTreeOpts.value;
const { mapChildrenField } = treeOpts;
const el = refElem.value;
if (isCrossTableDrag && crossTableDragRowObj && crossTableDragRowInfo) {
const { row: dragRow } = crossTableDragRowInfo;
if (dragRow) {
const dragRowid = getRowid($xeTable, dragRow);
const dragRowRest = fullAllDataRowIdData[dragRowid];
let dragRowHeight = 0;
let rsIndex = -1;
if (dragRowRest) {
if (animation) {
dragRowHeight = getCellRestHeight(dragRowRest, cellOpts, rowOpts, defaultRowHeight);
}
rsIndex = dragRowRest.$index;
}
const dragRangeList = rsIndex > -1 && rsIndex < tableData.length - 1 ? tableData.slice(rsIndex + 1) : [];
const dragList = XEUtils.toTreeArray([dragRow], {
updated: true,
children: mapChildrenField
});
$xeTable.remove(dragList).then(() => {
if (animation && dragRowHeight && dragRangeList.length) {
const $xeGanttView = internalData.xeGanttView;
let wrapperEl = el;
if ($xeGantt && $xeGanttView) {
const { refGanttContainerElem } = $xeGantt.getRefMaps();
const ganttContainerElem = refGanttContainerElem.value;
if (ganttContainerElem) {
wrapperEl = ganttContainerElem;
}
}
const dtClss = [];
dragRangeList.forEach(row => {
const rowid = getRowid($xeTable, row);
dtClss.push(`.vxe-body--row[rowid="${rowid}"]`);
if ($xeGantt) {
dtClss.push(`.vxe-gantt-view--body-row[rowid="${rowid}"]`, `.vxe-gantt-view--chart-row[rowid="${rowid}"]`);
}
});
const dtTrList = wrapperEl.querySelectorAll(dtClss.join(','));
moveRowAnimateToTb(dtTrList, dragRowHeight);
}
});
dispatchEvent('row-remove-dragend', {
row: dragRow
}, evnt);
handleRowDragEndClearStatus();
}
}
},
/**
* 处理跨表拖至新的空表
*/
handleCrossTableRowDragoverEmptyEvent(evnt) {
const { tableData } = reactData;
const rowDragOpts = computeRowDragOpts.value;
const { isCrossTableDrag } = rowDragOpts;
if (isCrossTableDrag && crossTableDragRowObj && !tableData.length) {
const { $oldTable, $newTable } = crossTableDragRowObj;
if ($oldTable) {
const oldTableReactData = $oldTable.reactData;
if ($oldTable.xID !== $xeTable.xID) {
if ($newTable && $newTable.xID !== $xeTable.xID) {
$newTable.hideCrossTableRowDropClearStatus();
}
evnt.preventDefault();
$oldTable.hideCrossTableRowDropClearStatus();
crossTableDragRowObj.$newTable = $xeTable;
internalData.prevDragRow = null;
reactData.dragTipText = oldTableReactData.dragTipText;
showDropTip(evnt, evnt.currentTarget, null, true, '');
}
}
}
},
/**
* 处理跨表拖插入
*/
handleCrossTableRowDragInsertEvent(evnt) {
const { treeConfig } = props;
const { prevDragRow, prevDragPos, prevDragToChild } = internalData;
const rowDragOpts = computeRowDragOpts.value;
const { animation, isSelfToChildDrag, isCrossTableDrag, dragEndMethod, dragToChildMethod } = rowDragOpts;
const rowOpts = computeRowOpts.value;
const cellOpts = computeCellOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const treeOpts = computeTreeOpts.value;
const { parentField, mapChildrenField } = treeOpts;
const childrenField = treeOpts.children || treeOpts.childrenField;
// 跨表拖拽
if (isCrossTableDrag && crossTableDragRowObj && crossTableDragRowInfo) {
const { row: oldRow } = crossTableDragRowInfo;
const { $oldTable } = crossTableDragRowObj;
const el = refElem.value;
if ($oldTable && oldRow) {
const dragRow = oldRow;
let dragOffsetIndex = -1;
if (prevDragRow) {
dragOffsetIndex = prevDragPos === 'bottom' ? 1 : 0;
}
const dragParams = {
oldRow: dragRow,
newRow: prevDragRow,
dragRow,
dragPos: prevDragPos,
dragToChild: !!prevDragToChild,
offsetIndex: dragOffsetIndex
};
const isDragToChildFlag = isSelfToChildDrag && dragToChildMethod ? dragToChildMethod(dragParams) : prevDragToChild;
const errRest = {
status: false
};
if (dragEndMethod) {
handleRowDragEndClearStatus();
}
Promise.resolve(dragEndMethod ? dragEndMethod(dragParams) : true).then((status) => {
if (!status) {
if ($oldTable) {
if ($oldTable.xID !== $xeTable.xID) {
$oldTable.handleCrossTableRowDragCancelEvent(evnt);
}
}
handleRowDragEndClearStatus();
return errRest;
}
let insertRest = Promise.resolve();
if (treeConfig) {
const dragList = XEUtils.toTreeArray([dragRow], {
updated: true,
children: mapChildrenField
});
$oldTable.handleCrossTableRowDragFinishEvent(evnt);
if (prevDragRow) {
dragRow[parentField] = prevDragRow[parentField];
}
else {
dragRow[parentField] = null;
}
dragList.forEach(row => {
row[childrenField] = undefined;
row[mapChildrenField] = undefined;
});
if (prevDragRow) {
if (prevDragPos === 'bottom') {
insertRest = $xeTable.insertNextAt(dragList, prevDragRow);
}
else {
insertRest = $xeTable.insertAt(dragList, prevDragRow);
}
}
else {
insertRest = $xeTable.insert(dragList);
}
}
else {
$oldTable.handleCrossTableRowDragFinishEvent(evnt);
if (prevDragRow) {
if (prevDragPos === 'bottom') {
insertRest = $xeTable.insertNextAt(dragRow, prevDragRow);
}
else {
insertRest = $xeTable.insertAt(dragRow, prevDragRow);
}
}
else {
insertRest = $xeTable.insert(dragRow);
}
}
dispatchEvent('row-insert-dragend', {
oldRow,
newRow: prevDragRow,
dragRow,
dragPos: prevDragPos,
dragToChild: isDragToChildFlag,
offsetIndex: dragOffsetIndex
}, evnt);
clearRowDragData();
insertRest.then(() => {
const { tableData } = reactData;
const { fullAllDataRowIdData } = internalData;
const oldRowid = getRowid($xeTable, dragRow);
const oldRowRest = fullAllDataRowIdData[oldRowid];
let dragRowHeight = 0;
let rsIndex = -1;
if (oldRowRest) {
if (animation) {
dragRowHeight = getCellRestHeight(oldRowRest, cellOpts, rowOpts, defaultRowHeight);
}
rsIndex = oldRowRest.$index;
}
const dragRangeList = rsIndex > -1 ? tableData.slice(rsIndex) : [];
if (animation && dragRowHeight && dragRangeList.length) {
const $xeGanttView = internalData.xeGanttView;
let wrapperEl = el;
if ($xeGantt && $xeGanttView) {
const { refGanttContainerElem } = $xeGantt.getRefMaps();
const ganttContainerElem = refGanttContainerElem.value;
if (ganttContainerElem) {
wrapperEl = ganttContainerElem;
}
}
const dtClss = [];
dragRangeList.forEach(row => {
const rowid = getRowid($xeTable, row);
dtClss.push(`.vxe-body--row[rowid="${rowid}"]`);
if ($xeGantt) {
dtClss.push(`.vxe-gantt-view--body-row[rowid="${rowid}"]`, `.vxe-gantt-view--chart-row[rowid="${rowid}"]`);
}
});
const dtTrList = wrapperEl.querySelectorAll(dtClss.join(','));
moveRowAnimateToTb(dtTrList, -dragRowHeight);
}
});
});
}
}
},
hideCrossTableRowDropClearStatus() {
hideDropTip();
},
handleRowDragDragendEvent(evnt) {
const { treeConfig } = props;
const { fullAllDataRowIdData, prevDragToChild } = internalData;
const { dragRow } = reactData;
const treeOpts = computeTreeOpts.value;
const { lazy } = treeOpts;
const hasChildField = treeOpts.hasChild || treeOpts.hasChildField;
const { prevDragRow, prevDragPos } = internalData;
const rowDragOpts = computeRowDragOpts.value;
const { isCrossTableDrag } = rowDragOpts;
// 跨表拖拽
if (isCrossTableDrag && crossTableDragRowObj) {
const { $newTable } = crossTableDragRowObj;
if ($newTable && $newTable.xID !== $xeTable.xID) {
$newTable.handleCrossTableRowDragInsertEvent(evnt);
return;
}
}
if (treeConfig && lazy && prevDragToChild) {
// 懒加载
const newRowid = getRowid($xeTable, prevDragRow);
const rowRest = fullAllDataRowIdData[newRowid];
if (prevDragRow[hasChildField]) {
if (rowRest && rowRest.treeLoaded) {
$xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild);
}
}
else {
$xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild);
}
}
else {
$xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild);
}
},
handleRowDragDragoverEvent(evnt) {
const { treeConfig } = props;
const { fullAllDataRowIdData } = internalData;
const { dragRow } = reactData;
const treeOpts = computeTreeOpts.value;
const { lazy, transform, parentField } = treeOpts;
const hasChildField = treeOpts.hasChild || treeOpts.hasChildField;
const rowDragOpts = computeRowDragOpts.value;
const { isPeerDrag, isCrossDrag, isToChildDrag, isCrossTableDrag } = rowDragOpts;
if (!dragRow && !(isCrossTableDrag && (!treeConfig || isCrossDrag) && crossTableDragRowObj)) {
evnt.preventDefault();
return;
}
const isControlKey = hasControlKey(evnt);
const trEl = evnt.currentTarget;
const rowid = trEl.getAttribute('rowid') || '';
const rowRest = fullAllDataRowIdData[rowid];
if (rowRest) {
evnt.preventDefault();
const row = rowRest.row;
const offsetY = evnt.clientY - trEl.getBoundingClientRect().y;
const dragPos = offsetY < trEl.clientHeight / 2 ? 'top' : 'bottom';
internalData.prevDragToChild = !!(treeConfig && transform && (isCrossDrag && isToChildDrag) && isControlKey);
internalData.prevDragRow = row;
internalData.prevDragPos = dragPos;
// 跨表拖拽
if (isCrossTableDrag && (!treeConfig || isCrossDrag) && crossTableDragRowObj) {
const { $oldTable, $newTable } = crossTableDragRowObj;
if ($oldTable) {
const oldTableReactData = $oldTable.reactData;
if ($oldTable.xID === $xeTable.xID) {
if ($newTable) {
$newTable.hideCrossTableRowDropClearStatus();
}
reactData.isCrossDragRow = false;
oldTableReactData.isCrossDragRow = false;
crossTableDragRowObj.$newTable = null;
}
else {
if ($newTable && $newTable.xID !== $xeTable.xID) {
$newTable.hideCrossTableRowDropClearStatus();
}
$oldTable.hideCrossTableRowDropClearStatus();
oldTableReactData.isCrossDragRow = true;
reactData.dragTipText = oldTableReactData.dragTipText;
crossTableDragRowObj.$newTable = $xeTable;
showDropTip(evnt, trEl, null, true, dragPos);
return;
}
}
}
if ($xeTable.eqRow(dragRow, row) ||
(isControlKey && treeConfig && lazy && row[hasChildField] && rowRest && !rowRest.treeLoaded) ||
(!isCrossDrag && treeConfig && transform && (isPeerDrag ? dragRow[parentField] !== row[parentField] : rowRest.level))) {
showDropTip(evnt, trEl, null, false, dragPos);
return;
}
showDropTip(evnt, trEl, null, true, dragPos);
dispatchEvent('row-dragover', {
oldRow: dragRow,
targetRow: row,
dragPos
}, evnt);
}
},
handleCellDragMousedownEvent(evnt, params) {
var _a;
evnt.stopPropagation();
const { dragConfig } = props;
const rowDragOpts = computeRowDragOpts.value;
const { isCrossTableDrag, trigger, dragStartMethod } = rowDragOpts;
const { row } = params;
const dragEl = evnt.currentTarget;
const tdEl = trigger === 'cell' || trigger === 'row' ? dragEl : (_a = dragEl.parentElement) === null || _a === void 0 ? void 0 : _a.parentElement;
const trEl = tdEl.parentElement;
const dStartMethod = dragStartMethod || (dragConfig ? dragConfig.dragStartMethod : null);
clearRowDropOrigin();
if (dStartMethod && !dStartMethod(params)) {
trEl.draggable = false;
reactData.dragRow = null;
reactData.dragCol = null;
clearCrossTableDragStatus();
hideDropTip();
return;
}
if (isCrossTableDrag) {
crossTableDragRowInfo.row = row;
crossTableDragRowObj = { $oldTable: $xeTable, $newTable: null };
}
reactData.dragRow = row;
reactData.isCrossDragRow = false;
reactData.dragCol = null;
trEl.draggable = true;
updateRowDropOrigin(row);
updateRowDropTipContent(tdEl);
dispatchEvent('row-dragstart', params, evnt);
},
handleCellDragMouseupEvent() {
clearDragStatus();
},
/**
* 列拖拽
*/
handleHeaderCellDragDragstartEvent(evnt) {
if (evnt.dataTransfer) {
evnt.dataTransfer.setDragImage(getTpImg(), 0, 0);
}
$xeTable.closeTooltip();
},
handleColDragSwapColumn() {
handleUpdateColumn();
return parseColumns(false).then(() => {
$xeTable.updateCellAreas();
$xeTable.saveCustomStore('update:sort');
});
},
handleColDragSwapEvent(evnt, isSyncColumn, dragCol, prevDragCol, prevDragPos, prevDragToChild) {
const { mouseConfig } = props;
const columnDragOpts = computeColumnDragOpts.value;
const { animation, isPeerDrag, isCrossDrag, isSelfToChildDrag, isToChildDrag, dragEndMethod, dragToChildMethod } = columnDragOpts;
const { collectColumn, fullColumnIdData } = internalData;
const el = refElem.value;
const dragOffsetIndex = prevDragPos === 'right' ? 1 : 0;
const errRest = {
status: false
};
if (!(el && prevDragCol && dragCol)) {
return Promise.resolve(errRest);
}
// 判断是否有拖动
if (prevDragCol !== dragCol) {
const dragColumn = dragCol;
const newColumn = prevDragCol;
const dragParams = {
oldColumn: dragColumn,
newColumn,
dragColumn,
dragPos: prevDragPos,
dragToChild: !!prevDragToChild,
offsetIndex: dragOffsetIndex
};
let dragTargetColumn = null;
const dragAllTargetCols = [];
let dragColWidth = 0;
if (animation) {
XEUtils.eachTree([dragColumn], column => {
if (!dragTargetColumn && (!column.children || !column.children.length)) {
dragTargetColumn = column;
dragColWidth += column.renderWidth;
}
dragAllTargetCols.push(column);
});
}
if (!dragTargetColumn) {
dragTargetColumn = dragColumn;
}
const dragColRest = fullColumnIdData[dragTargetColumn.id] || {};
const _dragColIndex = dragColRest._index;
let dragOffsetLeft = -1;
if (animation) {
const oldTrEl = el.querySelector(`.vxe-table--column[colid="${dragTargetColumn.id}"]`);
if (oldTrEl) {
dragOffsetLeft = oldTrEl.offsetLeft;
}
}
let oafIndex = -1;
let nafIndex = -1;
const oldAllMaps = {};
XEUtils.eachTree([dragColumn], column => {
oldAllMaps[column.id] = column;
});
let isSelfToChildStatus = false;
if (dragColumn.parentId && newColumn.parentId) {
// 子到子
if (isPeerDrag && !isCrossDrag) {
if (dragColumn.parentId !== newColumn.parentId) {
// 非同级
handleColDragEndClearStatus();
return Promise.resolve(errRest);
}
}
else {
if (!isCrossDrag) {
handleColDragEndClearStatus();
return Promise.resolve(errRest);
}
if (oldAllMaps[newColumn.id]) {
isSelfToChildStatus = true;
if (!(isCrossDrag && isSelfToChildDrag)) {
if (VxeUI.modal) {
VxeUI.modal.message({
status: 'error',
content: getI18n$2('vxe.error.treeDragChild')
});
}
handleColDragEndClearStatus();
return Promise.resolve(errRest);
}
}
}
}
else if (dragColumn.parentId) {
// 子到根
if (!isCrossDrag) {
handleColDragEndClearStatus();
return Promise.resolve(errRest);
}
}
else if (newColumn.parentId) {
// 根到子
if (!isCrossDrag) {
handleColDragEndClearStatus();
return Promise.resolve(errRest);
}
if (oldAllMaps[newColumn.id]) {
isSelfToChildStatus = true;
if (!(isCrossDrag && isSelfToChildDrag)) {
if (VxeUI.modal) {
VxeUI.modal.message({
status: 'error',
content: getI18n$2('vxe.error.treeDragChild')
});
}
handleColDragEndClearStatus();
return Promise.resolve(errRest);
}
}
}
else ;
const isDragToChildFlag = isSelfToChildDrag && dragToChildMethod ? dragToChildMethod(dragParams) : prevDragToChild;
return Promise.resolve(dragEndMethod ? dragEndMethod(dragParams) : true).then((status) => {
if (!status) {
return errRest;
}
const oldewMatchRest = XEUtils.findTree(collectColumn, item => item.id === dragColumn.id);
// 改变层级
if (isSelfToChildStatus && (isCrossDrag && isSelfToChildDrag)) {
if (oldewMatchRest) {
const { items: oCols, index: oIndex } = oldewMatchRest;
const childList = dragColumn.children || [];
childList.forEach(column => {
column.parentId = dragColumn.parentId;
});
oCols.splice(oIndex, 1, ...childList);
dragColumn.children = [];
}
}
else {
if (oldewMatchRest) {
const { items: oCols, index: oIndex, parent: oParent } = oldewMatchRest;
oCols.splice(oIndex, 1);
if (!oParent) {
oafIndex = oIndex;
}
}
}
const newMatchRest = XEUtils.findTree(collectColumn, item => item.id === newColumn.id);
if (newMatchRest) {
const { items: nCols, index: nIndex, parent: nParent } = newMatchRest;
// 转子级
if ((isCrossDrag && isToChildDrag) && isDragToChildFlag) {
dragColumn.parentId = newColumn.id;
newColumn.children = (newColumn.children || []).concat([dragColumn]);
}
else {
dragColumn.parentId = newColumn.parentId;
nCols.splice(nIndex + dragOffsetIndex, 0, dragColumn);
}
if (!nParent) {
nafIndex = nIndex;
}
}
XEUtils.eachTree(collectColumn, (column, index, items, path, parentColumn) => {
if (!parentColumn) {
const sortIndex = index + 1;
column.renderSortNumber = sortIndex;
}
});
$xeTable.handleClearStack();
if (mouseConfig) {
if ($xeTable.clearSelected) {
$xeTable.clearSelected();
}
if ($xeTable.clearCellAreas) {
$xeTable.clearCellAreas();
$xeTable.clearCopyCellArea();
}
}
if (evnt) {
dispatchEvent('column-dragend', {
oldColumn: dragColumn,
newColumn,
dragColumn,
dragPos: prevDragPos,
dragToChild: isDragToChildFlag,
offsetIndex: dragOffsetIndex,
_index: {
newIndex: nafIndex,
oldIndex: oafIndex
}
}, evnt);
}
return nextTick().then(() => {
if (isSyncColumn) {
return $xeTable.handleColDragSwapColumn();
}
}).then(() => {
if (animation) {
const { tableColumn } = reactData;
const { visibleColumn, fullColumnIdData } = internalData;
let dragNewColumn = null;
const dragNewColMaps = {};
XEUtils.eachTree([dragColumn], column => {
if (!dragNewColumn && (!column.children || !column.children.length)) {
dragNewColumn = column;
}
dragNewColMaps[column.id] = column;
});
if (!dragNewColumn) {
dragNewColumn = dragColumn;
}
if (dragColWidth && dragAllTargetCols.length) {
const _newColIndex = XEUtils.findIndexOf(visibleColumn, column => !!dragNewColumn && column.id === dragNewColumn.id);
const firstCol = tableColumn[0];
const firstColRest = fullColumnIdData[firstCol.id];
if (firstColRest) {
const _firstColIndex = firstColRest._index;
const _lastColIndex = _firstColIndex + tableColumn.length;
let csIndex = -1;
let ceIndex = -1;
let offsetRate = 1;
if (_dragColIndex < _firstColIndex) {
// 从左往右虚拟拖拽
csIndex = 0;
ceIndex = _newColIndex - _firstColIndex;
}
else if (_dragColIndex > _lastColIndex) {
// 从右往左虚拟拖拽
const $newRowIndex = dragColRest.$index;
csIndex = $newRowIndex + 1;
ceIndex = tableColumn.length;
offsetRate = -1;
}
else {
if (_newColIndex > _dragColIndex) {
// 从左往右拖拽
csIndex = _dragColIndex - _firstColIndex;
ceIndex = csIndex + _newColIndex - _dragColIndex;
}
else {
// 从右往左拖拽
csIndex = _newColIndex - _firstColIndex + 1;
ceIndex = csIndex + _dragColIndex - _newColIndex;
offsetRate = -1;
}
}
const dragRangeList = [];
const dragRangeMaps = {};
for (let i = csIndex; i < ceIndex; i++) {
const column = tableColumn[i];
if (!dragRangeMaps[column.id] && !dragNewColMaps[column.id]) {
dragRangeMaps[column.id] = column;
dragRangeList.push(column);
}
}
XEUtils.eachTree([newColumn], column => {
if (!dragRangeMaps[column.id]) {
dragRangeMaps[column.id] = column;
dragRangeList.push(column);
}
});
if (dragRangeList.length) {
const dtTrList = el.querySelectorAll(dragRangeList.map(column => `.vxe-table--column[colid="${column.id}"]`).join(','));
moveColAnimateToLr(dtTrList, offsetRate * dragColWidth);
}
}
const newTrList = el.querySelectorAll(dragAllTargetCols.map(column => `.vxe-table--column[colid="${column.id}"]`).join(','));
const newTdEl = newTrList[0];
if (dragOffsetLeft > -1 && newTdEl) {
moveColAnimateToLr(newTrList, dragOffsetLeft - newTdEl.offsetLeft);
}
}
}
updateColumnOffsetLeft();
loadScrollXData();
$xeTable.updateCellAreas();
return {
status: true
};
});
}).catch(() => {
return errRest;
}).then((rest) => {
handleColDragEndClearStatus();
return rest;
});
}
handleColDragEndClearStatus();
return Promise.resolve(errRest);
},
handleHeaderCellDragDragendEvent(evnt) {
const { dragCol } = reactData;
const { prevDragCol, prevDragPos, prevDragToChild } = internalData;
$xeTable.handleColDragSwapEvent(evnt, true, dragCol, prevDragCol, prevDragPos, prevDragToChild);
},
handleHeaderCellDragDragoverEvent(evnt) {
const { dragCol } = reactData;
const columnDragOpts = computeColumnDragOpts.value;
const { isToChildDrag, isPeerDrag, isCrossDrag } = columnDragOpts;
if (!dragCol) {
evnt.preventDefault();
return;
}
const isControlKey = hasControlKey(evnt);
const thEl = evnt.currentTarget;
const colid = thEl.getAttribute('colid');
const column = $xeTable.getColumnById(colid);
if (column) {
evnt.preventDefault();
const { clientX } = evnt;
const offsetX = clientX - thEl.getBoundingClientRect().x;
const dragPos = offsetX < thEl.clientWidth / 2 ? 'left' : 'right';
internalData.prevDragToChild = !!((isCrossDrag && isToChildDrag) && isControlKey);
internalData.prevDragCol = column;
internalData.prevDragPos = dragPos;
if (column.fixed ||
(dragCol && dragCol.id === column.id) ||
(!isCrossDrag && (isPeerDrag ? dragCol.parentId !== column.parentId : column.parentId))) {
showDropTip(evnt, null, thEl, false, dragPos);
return;
}
showDropTip(evnt, null, thEl, true, dragPos);
dispatchEvent('column-dragover', {
oldColumn: dragCol,
targetColumn: column,
dragPos
}, evnt);
// 边缘滚动
const el = refElem.value;
if (!el) {
return;
}
const xHandleEl = refScrollXHandleElem.value;
const tableBody = refTableBody.value;
const tableBodyElem = tableBody ? tableBody.$el : null;
const scrollTargetEl = xHandleEl || tableBodyElem;
if (scrollTargetEl) {
const wrapperRect = el.getBoundingClientRect();
const tableWrapperWidth = el.clientWidth;
const leftContainerElem = refLeftContainer.value;
const leftContainerWidth = leftContainerElem ? leftContainerElem.clientWidth : 0;
const rightContainerElem = refRightContainer.value;
const rightContainerWidth = rightContainerElem ? rightContainerElem.clientWidth : 0;
const srartX = wrapperRect.x + leftContainerWidth;
const endX = wrapperRect.x + tableWrapperWidth - rightContainerWidth;
const distSize = 28;
const startDistSize = clientX - srartX;
const endDistSize = endX - clientX;
if (startDistSize > 0 && startDistSize <= distSize) {
const scrollRatio = Math.floor(tableWrapperWidth / (startDistSize > distSize / 2 ? 240 : 120));
scrollTargetEl.scrollLeft -= scrollRatio * (distSize - startDistSize);
}
else if (endDistSize > 0 && endDistSize <= distSize) {
const scrollRatio = Math.floor(tableWrapperWidth / (endDistSize > distSize / 2 ? 240 : 120));
scrollTargetEl.scrollLeft += scrollRatio * (distSize - endDistSize);
}
}
}
},
handleHeaderCellDragMousedownEvent(evnt, params) {
var _a;
evnt.stopPropagation();
const columnDragOpts = computeColumnDragOpts.value;
const { trigger, dragStartMethod } = columnDragOpts;
const { column } = params;
const dragEl = evnt.currentTarget;
const thEl = trigger === 'cell' ? dragEl : (_a = dragEl.parentElement) === null || _a === void 0 ? void 0 : _a.parentElement;
clearColDropOrigin();
if (dragStartMethod && !dragStartMethod(params)) {
thEl.draggable = false;
reactData.dragRow = null;
reactData.dragCol = null;
clearCrossTableDragStatus();
hideDropTip();
return;
}
reactData.dragCol = column;
reactData.dragRow = null;
thEl.draggable = true;
clearCrossTableDragStatus();
updateColDropOrigin(column);
updateColDropTipContent(thEl);
dispatchEvent('column-dragstart', params, evnt);
},
handleHeaderCellDragMouseupEvent() {
clearColDropOrigin();
hideDropTip();
clearCrossTableDragStatus();
reactData.dragRow = null;
reactData.dragCol = null;
},
handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, params) {
const { highlightHoverRow } = props;
const { lastScrollLeft, lastScrollTop } = internalData;
const xHandleEl = refScrollXHandleElem.value;
const yHandleEl = refScrollYHandleElem.value;
if (!xHandleEl || !yHandleEl) {
return;
}
const rowOpts = computeRowOpts.value;
const validTip = refValidTooltip.value;
const tooltip = refTooltip.value;
const bodyHeight = yHandleEl.clientHeight;
const bodyWidth = xHandleEl.clientWidth;
const scrollHeight = yHandleEl.scrollHeight;
const scrollWidth = xHandleEl.scrollWidth;
let isTop = false;
let isBottom = false;
let isLeft = false;
let isRight = false;
let direction = '';
let isTopBoundary = false;
let isBottomBoundary = false;
let isLeftBoundary = false;
let isRightBoundary = false;
if (isRollX) {
const xThreshold = computeScrollXThreshold.value;
isLeft = scrollLeft <= 0;
if (!isLeft) {
isRight = scrollLeft + bodyWidth >= scrollWidth;
}
if (scrollLeft > lastScrollLeft) {
direction = 'right';
if (scrollLeft + bodyWidth >= scrollWidth - xThreshold) {
isRightBoundary = true;
}
}
else {
direction = 'left';
if (scrollLeft <= xThreshold) {
isLeftBoundary = true;
}
}
$xeTable.checkScrolling();
internalData.lastScrollLeft = scrollLeft;
}
if (isRollY) {
const yThreshold = computeScrollYThreshold.value;
isTop = scrollTop <= 1;
if (!isTop) {
isBottom = scrollTop + bodyHeight >= scrollHeight - 1;
}
if (scrollTop > lastScrollTop) {
direction = 'bottom';
if (scrollTop + bodyHeight >= scrollHeight - yThreshold) {
isBottomBoundary = true;
}
}
else {
direction = 'top';
if (scrollTop <= yThreshold) {
isTopBoundary = true;
}
}
internalData.lastScrollTop = scrollTop;
}
internalData.lastSTime = Date.now();
const evntParams = Object.assign({ source: sourceType, scrollTop,
scrollLeft,
bodyHeight,
bodyWidth,
scrollHeight,
scrollWidth, isX: isRollX, isY: isRollY, isTop,
isBottom,
isLeft,
isRight,
direction }, params);
updateRowExpandStyle();
checkLastSyncScroll(isRollX, isRollY);
if (isRollX) {
$xeTable.closeFilter();
}
if (rowOpts.isHover || highlightHoverRow) {
$xeTable.clearHoverRow();
}
if (validTip && validTip.reactData.visible) {
validTip.close();
}
if (tooltip && tooltip.reactData.visible) {
tooltip.close();
}
if (isBottomBoundary || isTopBoundary || isRightBoundary || isLeftBoundary) {
dispatchEvent('scroll-boundary', evntParams, evnt);
}
dispatchEvent('scroll', evntParams, evnt);
},
/**
* 横向 X 可视渲染事件处理
*/
triggerScrollXEvent() {
const virtualXOpts = computeVirtualXOpts.value;
if (virtualXOpts.immediate) {
loadScrollXData();
}
else {
lazyScrollXData();
}
},
/**
* 纵向 Y 可视渲染事件处理
*/
triggerScrollYEvent() {
const virtualYOpts = computeVirtualYOpts.value;
if (virtualYOpts.immediate) {
loadScrollYData();
}
else {
lazyScrollYData();
}
},
triggerBodyScrollEvent(evnt, fixedType) {
const { scrollYLoad, scrollXLoad } = reactData;
const { elemStore, intoRunScroll, lastScrollTop, lastScrollLeft, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll, scrollRenderType, inFooterScroll } = internalData;
if (inWheelScroll || inVirtualScroll || inHeaderScroll || inFooterScroll) {
return;
}
const xHandleEl = refScrollXHandleElem.value;
const yHandleEl = refScrollYHandleElem.value;
const leftScrollElem = getRefElem(elemStore['left-body-scroll']);
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const rightScrollElem = getRefElem(elemStore['right-body-scroll']);
const headerScrollElem = getRefElem(elemStore['main-header-scroll']);
const footerScrollElem = getRefElem(elemStore['main-footer-scroll']);
const rowExpandEl = refRowExpandElem.value;
if (intoRunScroll) {
return;
}
if (!bodyScrollElem) {
return;
}
if (!xHandleEl) {
return;
}
if (!yHandleEl) {
return;
}
if (inBodyScroll) {
if (scrollRenderType !== fixedType) {
return;
}
}
let scrollTop = yHandleEl.scrollTop;
let scrollLeft = xHandleEl.scrollLeft;
if (leftScrollElem && fixedType === 'left') {
scrollTop = leftScrollElem.scrollTop;
}
else if (rightScrollElem && fixedType === 'right') {
scrollTop = rightScrollElem.scrollTop;
}
else {
scrollTop = bodyScrollElem.scrollTop;
scrollLeft = bodyScrollElem.scrollLeft;
}
const isRollX = scrollLeft !== lastScrollLeft;
const isRollY = scrollTop !== lastScrollTop;
internalData.inBodyScroll = true;
internalData.scrollRenderType = fixedType;
if (isRollY) {
if (fixedType === 'left') {
setScrollTop(bodyScrollElem, scrollTop);
setScrollTop(rightScrollElem, scrollTop);
}
else if (fixedType === 'right') {
setScrollTop(bodyScrollElem, scrollTop);
setScrollTop(leftScrollElem, scrollTop);
}
else {
setScrollTop(leftScrollElem, scrollTop);
setScrollTop(rightScrollElem, scrollTop);
}
setScrollTop(yHandleEl, scrollTop);
setScrollTop(rowExpandEl, scrollTop);
syncGanttScrollTop(scrollTop);
if (scrollYLoad) {
$xeTable.triggerScrollYEvent(evnt);
}
}
if (isRollX) {
setScrollLeft(xHandleEl, scrollLeft);
setScrollLeft(headerScrollElem, scrollLeft);
setScrollLeft(footerScrollElem, scrollLeft);
if (scrollXLoad) {
$xeTable.triggerScrollXEvent(evnt);
}
}
$xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
type: 'body',
fixed: fixedType
});
},
triggerHeaderScrollEvent(evnt, fixedType) {
const { scrollXLoad } = reactData;
const { elemStore, intoRunScroll, inWheelScroll, inVirtualScroll, inBodyScroll, inFooterScroll } = internalData;
if (inWheelScroll || inVirtualScroll || inBodyScroll || inFooterScroll) {
return;
}
const yHandleEl = refScrollYHandleElem.value;
const xHandleEl = refScrollXHandleElem.value;
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const headerScrollElem = getRefElem(elemStore['main-header-scroll']);
const footerScrollElem = getRefElem(elemStore['main-footer-scroll']);
if (intoRunScroll) {
return;
}
if (!headerScrollElem) {
return;
}
if (!xHandleEl) {
return;
}
if (!yHandleEl) {
return;
}
const scrollTop = yHandleEl.scrollTop;
const scrollLeft = headerScrollElem.scrollLeft;
const isRollX = true;
const isRollY = false;
internalData.inHeaderScroll = true;
setScrollLeft(xHandleEl, scrollLeft);
setScrollLeft(footerScrollElem, scrollLeft);
setScrollLeft(bodyScrollElem, scrollLeft);
if (scrollXLoad) {
$xeTable.triggerScrollXEvent(evnt);
}
$xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
type: 'header',
fixed: fixedType
});
},
triggerFooterScrollEvent(evnt, fixedType) {
const { scrollXLoad } = reactData;
const { elemStore, intoRunScroll, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll } = internalData;
if (inWheelScroll || inVirtualScroll || inHeaderScroll || inBodyScroll) {
return;
}
const yHandleEl = refScrollYHandleElem.value;
const xHandleEl = refScrollXHandleElem.value;
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const headerScrollElem = getRefElem(elemStore['main-header-scroll']);
const footerScrollElem = getRefElem(elemStore['main-footer-scroll']);
if (intoRunScroll) {
return;
}
if (!footerScrollElem) {
return;
}
if (!xHandleEl) {
return;
}
if (!yHandleEl) {
return;
}
const scrollTop = yHandleEl.scrollTop;
const scrollLeft = footerScrollElem.scrollLeft;
const isRollX = true;
const isRollY = false;
internalData.inFooterScroll = true;
setScrollLeft(xHandleEl, scrollLeft);
setScrollLeft(headerScrollElem, scrollLeft);
setScrollLeft(bodyScrollElem, scrollLeft);
if (scrollXLoad) {
$xeTable.triggerScrollXEvent(evnt);
}
$xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
type: 'footer',
fixed: fixedType
});
},
triggerBodyWheelEvent(evnt) {
const { target, deltaY, deltaX, shiftKey } = evnt;
if (target && /^textarea$/i.test(target.tagName)) {
return;
}
// 如果滚轮未移动或者触摸板未变化位置
if (!deltaY && !deltaX) {
return;
}
const { highlightHoverRow } = tableProps;
const { scrollXLoad, scrollYLoad, overflowX, overflowY, expandColumn } = reactData;
const leftFixedWidth = computeLeftFixedWidth.value;
const rightFixedWidth = computeRightFixedWidth.value;
const { elemStore, lastScrollTop, lastScrollLeft } = internalData;
const rowOpts = computeRowOpts.value;
const scrollbarXOpts = computeScrollbarXOpts.value;
const scrollbarYOpts = computeScrollbarYOpts.value;
const xHandleEl = refScrollXHandleElem.value;
const yHandleEl = refScrollYHandleElem.value;
const leftScrollElem = getRefElem(elemStore['left-body-scroll']);
const headerScrollElem = getRefElem(elemStore['main-header-scroll']);
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const footerScrollElem = getRefElem(elemStore['main-footer-scroll']);
const rightScrollElem = getRefElem(elemStore['right-body-scroll']);
const rowExpandEl = refRowExpandElem.value;
if (!bodyScrollElem) {
return;
}
const wheelSpeed = getWheelSpeed(internalData.lastSTime);
const deltaTop = shiftKey ? 0 : (deltaY * wheelSpeed);
const deltaLeft = (shiftKey ? (deltaX || deltaY) : deltaX) * wheelSpeed;
const currScrollTop = bodyScrollElem.scrollTop;
const currScrollLeft = bodyScrollElem.scrollLeft;
const scrollTop = Math.max(0, currScrollTop + deltaTop);
const scrollLeft = Math.max(0, currScrollLeft + deltaLeft);
const isRollX = overflowX && scrollLeft !== lastScrollLeft;
const isRollY = overflowY && scrollTop !== lastScrollTop;
if (isRollX) {
// 如果禁用滚动
if (scrollbarXOpts.visible === 'hidden') {
evnt.preventDefault();
return;
}
}
if (isRollY) {
// 如果禁用滚动
if (scrollbarYOpts.visible === 'hidden') {
evnt.preventDefault();
return;
}
const isTopWheel = deltaTop < 0;
// 如果滚动位置已经是顶部或底部,则不需要触发
if (isTopWheel ? currScrollTop <= 0 : currScrollTop >= bodyScrollElem.scrollHeight - bodyScrollElem.clientHeight) {
return;
}
}
// 展开行处理,如果展开行嵌入表格中
if ($xeParentTable) {
if (isRollY) {
if (checkTargetElement(evnt.target, [leftScrollElem, bodyScrollElem, rightScrollElem], evnt.currentTarget)) {
evnt.stopPropagation();
return;
}
}
if (isRollX) {
if (checkTargetElement(evnt.target, [headerScrollElem, bodyScrollElem, footerScrollElem], evnt.currentTarget)) {
evnt.stopPropagation();
return;
}
}
}
if (!(isRollX || leftFixedWidth || rightFixedWidth || expandColumn)) {
return;
}
if (rowOpts.isHover || highlightHoverRow) {
$xeTable.clearHoverRow();
}
// 用于鼠标纵向滚轮处理
if (isRollX) {
evnt.preventDefault();
internalData.inWheelScroll = true;
wheelScrollLeftTo(scrollLeft, (offsetLeft) => {
internalData.inWheelScroll = true;
const currLeftNum = offsetLeft;
setScrollLeft(xHandleEl, currLeftNum);
setScrollLeft(bodyScrollElem, currLeftNum);
setScrollLeft(headerScrollElem, currLeftNum);
setScrollLeft(footerScrollElem, currLeftNum);
if (scrollXLoad) {
$xeTable.triggerScrollXEvent(evnt);
}
$xeTable.handleScrollEvent(evnt, isRollY, isRollX, bodyScrollElem.scrollTop, currLeftNum, {
type: 'table',
fixed: ''
});
});
}
if (isRollY) {
evnt.preventDefault();
internalData.inWheelScroll = true;
wheelScrollTopTo(scrollTop, (offsetTop) => {
internalData.inWheelScroll = true;
const currTopNum = offsetTop;
setScrollTop(yHandleEl, currTopNum);
setScrollTop(bodyScrollElem, currTopNum);
setScrollTop(leftScrollElem, currTopNum);
setScrollTop(rightScrollElem, currTopNum);
setScrollTop(rowExpandEl, currTopNum);
syncGanttScrollTop(currTopNum);
if (scrollYLoad) {
$xeTable.triggerScrollYEvent(evnt);
}
$xeTable.handleScrollEvent(evnt, isRollY, isRollX, offsetTop, bodyScrollElem.scrollLeft, {
type: 'table',
fixed: ''
});
});
}
},
triggerVirtualScrollXEvent(evnt) {
const { scrollXLoad } = reactData;
const { elemStore, inWheelScroll, lastScrollTop, inHeaderScroll, inBodyScroll, inFooterScroll } = internalData;
if (inHeaderScroll || inBodyScroll || inFooterScroll) {
return;
}
if (inWheelScroll) {
return;
}
const headerScrollElem = getRefElem(elemStore['main-header-scroll']);
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const footerScrollElem = getRefElem(elemStore['main-footer-scroll']);
const yHandleEl = refScrollYHandleElem.value;
const wrapperEl = evnt.currentTarget;
const { scrollLeft } = wrapperEl;
const yBodyEl = yHandleEl || bodyScrollElem;
let scrollTop = 0;
if (yBodyEl) {
scrollTop = yBodyEl.scrollTop;
}
const isRollX = true;
const isRollY = scrollTop !== lastScrollTop;
internalData.inVirtualScroll = true;
setScrollLeft(bodyScrollElem, scrollLeft);
setScrollLeft(headerScrollElem, scrollLeft);
setScrollLeft(footerScrollElem, scrollLeft);
if (scrollXLoad) {
$xeTable.triggerScrollXEvent(evnt);
}
$xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
type: 'table',
fixed: ''
});
},
triggerVirtualScrollYEvent(evnt) {
const { scrollYLoad } = reactData;
const { elemStore, inWheelScroll, lastScrollLeft, inHeaderScroll, inBodyScroll, inFooterScroll } = internalData;
if (inHeaderScroll || inBodyScroll || inFooterScroll) {
return;
}
if (inWheelScroll) {
return;
}
const leftScrollElem = getRefElem(elemStore['left-body-scroll']);
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const rightScrollElem = getRefElem(elemStore['right-body-scroll']);
const rowExpandEl = refRowExpandElem.value;
const xHandleEl = refScrollXHandleElem.value;
const wrapperEl = evnt.currentTarget;
const { scrollTop } = wrapperEl;
const xBodyEl = xHandleEl || bodyScrollElem;
let scrollLeft = 0;
if (xBodyEl) {
scrollLeft = xBodyEl.scrollLeft;
}
const isRollX = scrollLeft !== lastScrollLeft;
const isRollY = true;
internalData.inVirtualScroll = true;
setScrollTop(bodyScrollElem, scrollTop);
setScrollTop(leftScrollElem, scrollTop);
setScrollTop(rightScrollElem, scrollTop);
setScrollTop(rowExpandEl, scrollTop);
syncGanttScrollTop(scrollTop);
if (scrollYLoad) {
$xeTable.triggerScrollYEvent(evnt);
}
$xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
type: 'table',
fixed: ''
});
},
/**
* 对于树形结构中,可以直接滚动到指定深层节点中
* 对于某些特定的场景可能会用到,比如定位到某一节点
* @param {Row} row 行对象
*/
scrollToTreeRow(row) {
const { treeConfig } = props;
const { isRowGroupStatus } = reactData;
const { tableFullData } = internalData;
const rests = [];
if (treeConfig || isRowGroupStatus) {
const aggregateOpts = computeAggregateOpts.value;
const treeOpts = computeTreeOpts.value;
const childrenField = treeOpts.children || treeOpts.childrenField;
const matchObj = XEUtils.findTree(tableFullData, item => $xeTable.eqRow(item, row), { children: isRowGroupStatus ? aggregateOpts.mapChildrenField : childrenField });
if (matchObj) {
const nodes = matchObj.nodes;
nodes.forEach((row, index) => {
if (index < nodes.length - 1 && !$xeTable.isTreeExpandByRow(row)) {
rests.push($xeTable.setTreeExpand(row, true));
}
});
}
}
return Promise.all(rests).then(() => rowToVisible($xeTable, row));
},
updateScrollYStatus,
// 更新横向 X 可视渲染上下剩余空间大小
updateScrollXSpace() {
const { scrollXLoad, overflowX, scrollXWidth } = reactData;
const { visibleColumn, scrollXStore, elemStore, fullColumnIdData } = internalData;
const $xeGanttView = internalData.xeGanttView;
const mouseOpts = computeMouseOpts.value;
const tableBody = refTableBody.value;
const tableBodyElem = tableBody ? tableBody.$el : null;
if (tableBodyElem) {
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const bodyTableElem = getRefElem(elemStore['main-body-table']);
const headerTableElem = getRefElem(elemStore['main-header-table']);
const footerTableElem = getRefElem(elemStore['main-footer-table']);
let xSpaceLeft = 0;
const firstColumn = visibleColumn[scrollXStore.startIndex];
if (firstColumn) {
const colRest = fullColumnIdData[firstColumn.id] || {};
xSpaceLeft = colRest.oLeft;
}
let clientWidth = 0;
if (bodyScrollElem) {
clientWidth = bodyScrollElem.clientWidth;
}
// 虚拟渲染
let isScrollXBig = false;
let ySpaceWidth = scrollXWidth;
if (scrollXWidth > maxXWidth) {
// 触右
if (bodyScrollElem && bodyTableElem && bodyScrollElem.scrollLeft + clientWidth >= maxXWidth) {
xSpaceLeft = maxXWidth - bodyTableElem.clientWidth;
}
else {
xSpaceLeft = (maxXWidth - clientWidth) * (xSpaceLeft / (scrollXWidth - clientWidth));
}
ySpaceWidth = maxXWidth;
isScrollXBig = true;
}
if (!(scrollXLoad && overflowX)) {
xSpaceLeft = 0;
}
if (getConfig$2().scrollMarginStyle) {
// 已废弃方式
if (headerTableElem) {
headerTableElem.style.marginLeft = headerTableElem.getAttribute('xvm') ? `${xSpaceLeft}px` : '';
}
if (bodyTableElem) {
bodyTableElem.style.marginLeft = `${xSpaceLeft}px`;
}
if (footerTableElem) {
footerTableElem.style.marginLeft = footerTableElem.getAttribute('xvm') ? `${xSpaceLeft}px` : '';
}
}
else {
if (headerTableElem) {
headerTableElem.style.transform = headerTableElem.getAttribute('xvm') ? `translate(${xSpaceLeft}px, 0px)` : '';
}
if (bodyTableElem) {
bodyTableElem.style.transform = `translate(${xSpaceLeft}px, ${reactData.scrollYTop || 0}px)`;
}
if (footerTableElem) {
footerTableElem.style.transform = footerTableElem.getAttribute('xvm') ? `translate(${xSpaceLeft}px, 0px)` : '';
}
}
const containerList = ['main'];
containerList.forEach(name => {
const layoutList = ['header', 'body', 'footer'];
layoutList.forEach(layout => {
const xSpaceElem = getRefElem(elemStore[`${name}-${layout}-xSpace`]);
if (xSpaceElem) {
xSpaceElem.style.width = scrollXLoad ? `${ySpaceWidth}px` : '';
}
});
});
reactData.scrollXLeft = xSpaceLeft;
reactData.scrollXWidth = ySpaceWidth;
reactData.isScrollXBig = isScrollXBig;
const scrollXSpaceEl = refScrollXSpaceElem.value;
if (scrollXSpaceEl) {
scrollXSpaceEl.style.width = `${ySpaceWidth}px`;
}
calcScrollbar();
if (isScrollXBig && mouseOpts.area) {
errLog$2('vxe.error.notProp', ['mouse-config.area']);
}
if ($xeGanttView && $xeGanttView.handleUpdateSXSpace) {
$xeGanttView.handleUpdateSXSpace();
}
return nextTick().then(() => {
updateStyle();
});
}
},
// 更新纵向 Y 可视渲染上下剩余空间大小
updateScrollYSpace() {
const { isAllOverflow, overflowY, scrollYLoad, scrollYHeight, expandColumn } = reactData;
const { scrollYStore, elemStore, isResizeCellHeight, afterFullData, fullAllDataRowIdData, rowExpandedMaps } = internalData;
const $xeGanttView = internalData.xeGanttView;
const { startIndex } = scrollYStore;
const mouseOpts = computeMouseOpts.value;
const expandOpts = computeExpandOpts.value;
const rowOpts = computeRowOpts.value;
const cellOpts = computeCellOpts.value;
const defaultRowHeight = computeDefaultRowHeight.value;
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const bodyTableElem = getRefElem(elemStore['main-body-table']);
const leftBodyTableElem = getRefElem(elemStore['left-body-table']);
const rightbodyTableElem = getRefElem(elemStore['right-body-table']);
const containerList = ['main', 'left', 'right'];
let ySpaceTop = 0;
let sYHeight = scrollYHeight;
let isScrollYBig = false;
if (scrollYLoad) {
const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height;
if (!isCustomCellHeight && !expandColumn && isAllOverflow) {
sYHeight = afterFullData.length * defaultRowHeight;
if (sYHeight > maxYHeight) {
isScrollYBig = true;
}
ySpaceTop = Math.max(0, startIndex * defaultRowHeight);
}
else {
const firstRow = afterFullData[startIndex];
if (firstRow) {
let rowid = getRowid($xeTable, firstRow);
let rowRest = fullAllDataRowIdData[rowid] || {};
ySpaceTop = (rowRest.oTop || 0);
const lastRow = afterFullData[afterFullData.length - 1];
rowid = getRowid($xeTable, lastRow);
rowRest = fullAllDataRowIdData[rowid] || {};
if (rowRest) {
const rHeight = getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight);
// 如果为空时还没计算完数据,保持原高度不变
if (rHeight) {
sYHeight = (rowRest.oTop || 0) + rHeight;
// 是否展开行
if (expandColumn && rowExpandedMaps[rowid]) {
sYHeight += rowRest.expandHeight || expandOpts.height || 0;
}
}
}
if (sYHeight > maxYHeight) {
isScrollYBig = true;
}
}
else {
sYHeight = bodyTableElem ? bodyTableElem.clientHeight : 0;
}
}
}
else {
if (bodyTableElem) {
sYHeight = bodyTableElem.clientHeight;
}
}
let clientHeight = 0;
if (bodyScrollElem) {
clientHeight = bodyScrollElem.clientHeight;
}
// 虚拟渲染
let ySpaceHeight = sYHeight;
let scrollYTop = ySpaceTop;
if (isScrollYBig) {
// 触底
if (bodyScrollElem && bodyTableElem && bodyScrollElem.scrollTop + clientHeight >= maxYHeight) {
scrollYTop = maxYHeight - bodyTableElem.clientHeight;
}
else {
scrollYTop = (maxYHeight - clientHeight) * (ySpaceTop / (scrollYHeight - clientHeight));
}
ySpaceHeight = maxYHeight;
}
if (!(scrollYLoad && overflowY)) {
scrollYTop = 0;
}
if (getConfig$2().scrollMarginStyle) {
if (leftBodyTableElem) {
leftBodyTableElem.style.marginTop = `${scrollYTop}px`;
}
if (bodyTableElem) {
bodyTableElem.style.marginTop = `${scrollYTop}px`;
}
if (rightbodyTableElem) {
rightbodyTableElem.style.marginTop = `${scrollYTop}px`;
}
}
else {
if (leftBodyTableElem) {
leftBodyTableElem.style.transform = `translate(0px, ${scrollYTop}px)`;
}
if (bodyTableElem) {
bodyTableElem.style.transform = `translate(${reactData.scrollXLeft || 0}px, ${scrollYTop}px)`;
}
if (rightbodyTableElem) {
rightbodyTableElem.style.transform = `translate(0px, ${scrollYTop}px)`;
}
}
containerList.forEach(name => {
const layoutList = ['header', 'body', 'footer'];
layoutList.forEach(layout => {
const ySpaceElem = getRefElem(elemStore[`${name}-${layout}-ySpace`]);
if (ySpaceElem) {
ySpaceElem.style.height = ySpaceHeight ? `${ySpaceHeight}px` : '';
}
});
});
const scrollYSpaceEl = refScrollYSpaceElem.value;
if (scrollYSpaceEl) {
scrollYSpaceEl.style.height = ySpaceHeight ? `${ySpaceHeight}px` : '';
}
const rowExpandYSpaceEl = refRowExpandYSpaceElem.value;
if (rowExpandYSpaceEl) {
rowExpandYSpaceEl.style.height = ySpaceHeight ? `${ySpaceHeight}px` : '';
}
reactData.scrollYTop = scrollYTop;
reactData.scrollYHeight = isScrollYBig ? sYHeight : ySpaceHeight;
reactData.isScrollYBig = isScrollYBig;
calcScrollbar();
if (isScrollYBig && mouseOpts.area) {
errLog$2('vxe.error.notProp', ['mouse-config.area']);
}
if ($xeGanttView && $xeGanttView.handleUpdateSYSpace) {
$xeGanttView.handleUpdateSYSpace();
}
return nextTick().then(() => {
return updateStyle();
});
},
updateScrollXData() {
const { isAllOverflow } = reactData;
handleTableColumn();
$xeTable.updateScrollXSpace();
return nextTick().then(() => {
handleTableColumn();
$xeTable.updateScrollXSpace();
if (!isAllOverflow) {
$xeTable.updateScrollYSpace();
}
});
},
updateScrollYData() {
$xeTable.handleTableData();
$xeTable.updateScrollYSpace();
return nextTick().then(() => {
$xeTable.handleTableData();
$xeTable.updateScrollYSpace();
});
},
/**
* 处理固定列的显示状态
*/
checkScrolling() {
const { elemStore } = internalData;
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
const leftContainerElem = refLeftContainer.value;
const rightContainerElem = refRightContainer.value;
const xHandleEl = refScrollXHandleElem.value;
const bodtTargetEl = xHandleEl || bodyScrollElem;
if (bodtTargetEl) {
if (leftContainerElem) {
if (bodtTargetEl.scrollLeft > 0) {
addClass(leftContainerElem, 'scrolling--middle');
}
else {
removeClass(leftContainerElem, 'scrolling--middle');
}
}
if (rightContainerElem) {
if (bodtTargetEl.clientWidth < bodtTargetEl.scrollWidth - Math.ceil(bodtTargetEl.scrollLeft)) {
addClass(rightContainerElem, 'scrolling--middle');
}
else {
removeClass(rightContainerElem, 'scrolling--middle');
}
}
}
},
handleUpdateAggData() {
return loadTableData(internalData.tableSynchData, false, true);
},
handlePushStack() {
const keyboardOpts = computeKeyboardOpts.value;
if (!keyboardOpts.isUndoRedo) {
return;
}
const { stackHistoryStore } = internalData;
const stackObj = getSnapshotStackData();
stackHistoryStore.undoStacks.push(stackObj);
stackHistoryStore.redoStacks = [];
truncateStackHistory();
},
handleUndoStackEvent(evnt) {
const { stackHistoryStore } = internalData;
const { undoStacks, redoStacks } = stackHistoryStore;
if (undoStacks.length) {
const stackObj = getSnapshotStackData();
redoStacks.push(stackObj);
handleUpdateSnapshotStackData(undoStacks.pop());
if (evnt) {
dispatchEvent('undo', {}, evnt);
}
return nextTick(() => {
return { status: true };
});
}
return Promise.resolve({ status: false });
},
handleRedoStackEvent(evnt) {
const { stackHistoryStore } = internalData;
const { undoStacks, redoStacks } = stackHistoryStore;
if (redoStacks.length) {
const stackObj = getSnapshotStackData();
undoStacks.push(stackObj);
handleUpdateSnapshotStackData(redoStacks.pop());
if (evnt) {
dispatchEvent('redo', {}, evnt);
}
return nextTick(() => {
return { status: true };
});
}
return Promise.resolve({ status: false });
},
handleClearStack() {
const { stackHistoryStore } = internalData;
stackHistoryStore.undoStacks = [];
stackHistoryStore.redoStacks = [];
return nextTick();
},
updateZindex() {
if (props.zIndex) {
internalData.tZindex = props.zIndex;
}
else if (internalData.tZindex < getLastZIndex()) {
internalData.tZindex = nextZIndex();
}
},
handleCheckedCheckboxRow,
/**
* 行 hover 事件
*/
triggerHoverEvent(evnt, { row }) {
$xeTable.setHoverRow(row);
},
setHoverRow(row) {
const $xeGanttView = internalData.xeGanttView;
const rowid = getRowid($xeTable, row);
const el = refElem.value;
$xeTable.clearHoverRow();
if (el) {
XEUtils.arrayEach(el.querySelectorAll(`.vxe-body--row[rowid="${rowid}"]`), elem => addClass(elem, 'row--hover'));
}
internalData.hoverRow = row;
if ($xeGanttView && $xeGanttView.handleUpdateHoverRow) {
$xeGanttView.handleUpdateHoverRow(row);
}
},
clearHoverRow() {
const $xeGanttView = internalData.xeGanttView;
const el = refElem.value;
if (el) {
XEUtils.arrayEach(el.querySelectorAll('.vxe-body--row.row--hover'), elem => removeClass(elem, 'row--hover'));
}
internalData.hoverRow = null;
if ($xeGanttView && $xeGanttView.handleUpdateHoverRow) {
$xeGanttView.handleUpdateHoverRow();
}
},
/**
* 已废弃,被 getCellElement 替换
* @deprecated
*/
getCell(row, column) {
return $xeTable.getCellElement(row, column);
},
findRowIndexOf(list, row) {
return row ? XEUtils.findIndexOf(list, item => $xeTable.eqRow(item, row)) : -1;
},
eqRow(row1, row2) {
if (row1 && row2) {
if (row1 === row2) {
return true;
}
return getRowid($xeTable, row1) === getRowid($xeTable, row2);
}
return false;
},
handleConnectGanttView($ganttView) {
if ($ganttView && $ganttView.connectUpdate) {
$ganttView.connectUpdate({ $table: $xeTable });
internalData.xeGanttView = $ganttView;
}
return nextTick();
}
};
// 检测对应模块是否安装
// 'openExport,openPrint,exportData,openImport,importData,saveFile,readFile,importByFile,print'.split(',').forEach(name => {
// ($xeTable as any)[name] = function () {
// errLog('vxe.error.reqModule', ['Export'])
// }
// })
// 'clearValidate,fullValidate,validate'.split(',').forEach(name => {
// ($xeTable as any)[name] = function () {
// errLog('vxe.error.reqModule', ['Validator'])
// }
// })
Object.assign($xeTable, tableMethods, tablePrivateMethods);
/**
* 渲染浮固定列
* 分别渲染左边固定列和右边固定列
* 如果宽度足够情况下,则不需要渲染固定列
* @param {String} fixedType 固定列类型
*/
const renderViewFixed = (fixedType) => {
const { showHeader, showFooter } = props;
const { tableData, tableColumn, tableGroupColumn, columnStore, footerTableData } = reactData;
const scrollbarOpts = computeScrollbarOpts.value;
const scrollbarXOpts = computeScrollbarXOpts.value;
const scrollbarYOpts = computeScrollbarYOpts.value;
const { overscrollBehavior: overscrollXBehavior } = scrollbarXOpts;
const { overscrollBehavior: overscrollYBehavior } = scrollbarYOpts;
const isFixedLeft = fixedType === 'left';
const fixedColumn = isFixedLeft ? columnStore.leftList : columnStore.rightList;
const osXBehavior = XEUtils.eqNull(overscrollXBehavior) ? scrollbarOpts.overscrollBehavior : overscrollXBehavior;
const osYBehavior = XEUtils.eqNull(overscrollYBehavior) ? scrollbarOpts.overscrollBehavior : overscrollYBehavior;
return h('div', {
ref: isFixedLeft ? refLeftContainer : refRightContainer,
class: [`vxe-table--fixed-${fixedType}-wrapper`, `sx--${scrollbarXOpts.visible}`, `sy--${scrollbarYOpts.visible}`, {
[`x-ob--${osXBehavior}`]: osXBehavior,
[`y-ob--${osYBehavior}`]: osYBehavior
}]
}, [
showHeader
? h(TableHeaderComponent, {
ref: isFixedLeft ? refTableLeftHeader : refTableRightHeader,
fixedType,
tableData,
tableColumn,
tableGroupColumn,
fixedColumn
})
: renderEmptyElement$1($xeTable),
h(TableBodyComponent, {
ref: isFixedLeft ? refTableLeftBody : refTableRightBody,
fixedType,
tableData,
tableColumn,
fixedColumn
}),
showFooter
? h(TableFooterComponent, {
ref: isFixedLeft ? refTableLeftFooter : refTableRightFooter,
footerTableData,
tableColumn,
fixedColumn,
fixedType
})
: renderEmptyElement$1($xeTable)
]);
};
const renderEmptyBody = () => {
const emptyOpts = computeEmptyOpts.value;
const emptySlot = slots.empty;
const emptyParams = { $table: $xeTable, $grid: $xeGrid, gantt: $xeGantt };
if (emptySlot) {
return emptySlot(emptyParams);
}
else {
const compConf = emptyOpts.name ? renderer$1.get(emptyOpts.name) : null;
const rtEmptyView = compConf ? (compConf.renderTableEmpty || compConf.renderTableEmptyView || compConf.renderEmpty) : null;
if (rtEmptyView) {
return getSlotVNs(rtEmptyView(emptyOpts, emptyParams));
}
}
return getFuncText(props.emptyText) || getI18n$2('vxe.table.emptyText');
};
const renderDragTipContents = () => {
const { dragConfig } = props;
const { dragRow, dragCol, dragTipText } = reactData;
const columnDragOpts = computeColumnDragOpts.value;
const rowDragOpts = computeRowDragOpts.value;
const rowDragSlots = rowDragOpts.slots || {};
const rTipSlot = rowDragSlots.tip || (dragConfig && dragConfig.slots ? dragConfig.slots.rowTip : null);
const columnDragSlots = columnDragOpts.slots || {};
const cTipSlot = columnDragSlots.tip;
const dRow = dragRow || (rowDragOpts.isCrossTableDrag ? crossTableDragRowInfo.row : null);
if (dRow && rTipSlot) {
return callSlot(rTipSlot, { row: dRow });
}
if (dragCol && cTipSlot) {
return callSlot(cTipSlot, { column: dragCol });
}
return [h('span', dragTipText)];
};
const renderDragTip = () => {
const { dragRow, dragCol } = reactData;
const rowOpts = computeRowOpts.value;
const columnOpts = computeColumnOpts.value;
const rowDragOpts = computeRowDragOpts.value;
const columnDragOpts = computeColumnDragOpts.value;
const dRow = dragRow || (rowDragOpts.isCrossTableDrag ? crossTableDragRowInfo.row : null);
if (rowOpts.drag || columnOpts.drag) {
return h('div', {
class: 'vxe-table--drag-wrapper'
}, [
h('div', {
ref: refDragRowLineElem,
class: ['vxe-table--drag-row-line', {
'is--guides': rowDragOpts.showGuidesStatus
}]
}),
h('div', {
ref: refDragColLineElem,
class: ['vxe-table--drag-col-line', {
'is--guides': columnDragOpts.showGuidesStatus
}]
}),
(dRow && rowDragOpts.showDragTip) || (dragCol && columnDragOpts.showDragTip)
? h('div', {
ref: refDragTipElem,
class: 'vxe-table--drag-sort-tip'
}, [
h('div', {
class: 'vxe-table--drag-sort-tip-wrapper'
}, [
h('div', {
class: 'vxe-table--drag-sort-tip-status'
}, [
h('span', {
class: ['vxe-table--drag-sort-tip-normal-status', dRow ? getIcon$1().TABLE_DRAG_STATUS_ROW : getIcon$1().TABLE_DRAG_STATUS_COLUMN]
}),
h('span', {
class: ['vxe-table--drag-sort-tip-sub-status', getIcon$1().TABLE_DRAG_STATUS_SUB_ROW]
}),
h('span', {
class: ['vxe-table--drag-sort-tip-disabled-status', getIcon$1().TABLE_DRAG_DISABLED]
})
]),
h('div', {
class: 'vxe-table--drag-sort-tip-content'
}, renderDragTipContents())
])
])
: renderEmptyElement$1($xeTable)
]);
}
return renderEmptyElement$1($xeTable);
};
const renderRowExpandedVNs = () => {
const { treeConfig } = props;
const { expandColumn, isRowGroupStatus } = reactData;
const tableRowExpandedList = computeTableRowExpandedList.value;
const expandOpts = computeExpandOpts.value;
const { mode } = expandOpts;
if (mode !== 'fixed') {
return renderEmptyElement$1($xeTable);
}
const expandVNs = [
h('div', {
key: 'repY',
ref: refRowExpandYSpaceElem
})
];
if (expandColumn) {
const { handleGetRowId } = createHandleGetRowId($xeTable);
tableRowExpandedList.forEach((row) => {
const expandOpts = computeExpandOpts.value;
const { height: expandHeight, padding, indent } = expandOpts;
const { fullAllDataRowIdData, fullColumnIdData } = internalData;
const treeOpts = computeTreeOpts.value;
const { transform, seqMode } = treeOpts;
const cellStyle = {};
const rowid = handleGetRowId(row);
const rowRest = fullAllDataRowIdData[rowid];
const colid = expandColumn.id;
const colRest = fullColumnIdData[colid] || {};
let rowLevel = 0;
let seq = -1;
let _rowIndex = -1;
let rowIndex = -1;
let $rowIndex = -1;
if (rowRest) {
rowIndex = rowRest.index;
$rowIndex = rowRest.$index;
_rowIndex = rowRest._index;
rowLevel = rowRest.level;
seq = rowRest.seq;
if (isRowGroupStatus || (treeConfig && transform && seqMode === 'increasing')) {
seq = rowRest._index + 1;
}
else if ((treeConfig && seqMode === 'fixed')) {
seq = rowRest._tIndex + 1;
}
}
if (expandHeight) {
cellStyle.height = `${expandHeight}px`;
}
if (isRowGroupStatus || treeConfig) {
cellStyle.paddingLeft = `${(rowLevel * (XEUtils.isNumber(indent) ? indent : treeOpts.indent)) + 30}px`;
}
let columnIndex = -1;
let $columnIndex = -1;
let _columnIndex = -1;
if (colRest) {
columnIndex = colRest.index;
$columnIndex = colRest.$index;
_columnIndex = colRest._index;
}
const expandParams = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: $xeGantt,
seq,
column: expandColumn,
columnIndex,
$columnIndex,
_columnIndex,
fixed: '',
source: 'table',
type: 'body',
level: rowLevel,
rowid,
row,
rowIndex,
$rowIndex,
_rowIndex,
isHidden: false,
isEdit: false,
visibleData: [],
data: [],
items: []
};
expandVNs.push(h('div', {
key: rowid,
class: ['vxe-body--row-expanded-cell', {
'is--padding': padding,
'is--ellipsis': expandHeight
}],
rowid,
style: cellStyle
}, [
h('div', {
class: 'vxe-body--row-expanded-content'
}, expandColumn.renderData(expandParams))
]));
});
}
return h('div', {
ref: refRowExpandElem,
class: 'vxe-table--row-expanded-wrapper'
}, expandVNs);
};
const renderScrollX = () => {
return h('div', {
key: 'vsx',
ref: refScrollXVirtualElem,
class: 'vxe-table--scroll-x-virtual'
}, [
h('div', {
ref: refScrollXLeftCornerElem,
class: 'vxe-table--scroll-x-left-corner'
}),
h('div', {
ref: refScrollXWrapperElem,
class: 'vxe-table--scroll-x-wrapper'
}, [
h('div', {
ref: refScrollXHandleElem,
class: 'vxe-table--scroll-x-handle',
onScroll: $xeTable.triggerVirtualScrollXEvent
}, [
h('div', {
ref: refScrollXSpaceElem,
class: 'vxe-table--scroll-x-space'
})
]),
h('div', {
class: 'vxe-table--scroll-x-handle-appearance'
})
]),
h('div', {
ref: refScrollXRightCornerElem,
class: 'vxe-table--scroll-x-right-corner'
})
]);
};
const renderScrollY = () => {
return h('div', {
ref: refScrollYVirtualElem,
class: 'vxe-table--scroll-y-virtual'
}, [
h('div', {
ref: refScrollYTopCornerElem,
class: 'vxe-table--scroll-y-top-corner'
}),
h('div', {
ref: refScrollYWrapperElem,
class: 'vxe-table--scroll-y-wrapper'
}, [
h('div', {
ref: refScrollYHandleElem,
class: 'vxe-table--scroll-y-handle',
onScroll: $xeTable.triggerVirtualScrollYEvent
}, [
h('div', {
ref: refScrollYSpaceElem,
class: 'vxe-table--scroll-y-space'
})
]),
h('div', {
class: 'vxe-table--scroll-y-handle-appearance'
})
]),
h('div', {
ref: refScrollYBottomCornerElem,
class: 'vxe-table--scroll-y-bottom-corner'
})
]);
};
const renderViewport = () => {
const { showHeader, showFooter } = props;
const { overflowX, tableData, tableColumn, tableGroupColumn, footerTableData, columnStore } = reactData;
const scrollbarOpts = computeScrollbarOpts.value;
const scrollbarXOpts = computeScrollbarXOpts.value;
const scrollbarYOpts = computeScrollbarYOpts.value;
const { overscrollBehavior: overscrollXBehavior } = scrollbarXOpts;
const { overscrollBehavior: overscrollYBehavior } = scrollbarYOpts;
const { leftList, rightList } = columnStore;
const osXBehavior = XEUtils.eqNull(overscrollXBehavior) ? scrollbarOpts.overscrollBehavior : overscrollXBehavior;
const osYBehavior = XEUtils.eqNull(overscrollYBehavior) ? scrollbarOpts.overscrollBehavior : overscrollYBehavior;
return h('div', {
ref: refTableViewportElem,
class: ['vxe-table--viewport-wrapper', {
[`x-ob--${osXBehavior}`]: osXBehavior,
[`y-ob--${osYBehavior}`]: osYBehavior
}]
}, [
h('div', {
class: ['vxe-table--main-wrapper', `sx--${scrollbarXOpts.visible}`, `sy--${scrollbarYOpts.visible}`]
}, [
/**
* 表头
*/
showHeader
? h(TableHeaderComponent, {
ref: refTableHeader,
tableData,
tableColumn,
tableGroupColumn
})
: renderEmptyElement$1($xeTable),
/**
* 表体
*/
h(TableBodyComponent, {
ref: refTableBody,
tableData,
tableColumn
}),
/**
* 表尾
*/
showFooter
? h(TableFooterComponent, {
ref: refTableFooter,
footerTableData,
tableColumn
})
: renderEmptyElement$1($xeTable)
]),
h('div', {
class: 'vxe-table--fixed-wrapper'
}, [
leftList && leftList.length && overflowX ? renderViewFixed('left') : renderEmptyElement$1($xeTable),
rightList && rightList.length && overflowX ? renderViewFixed('right') : renderEmptyElement$1($xeTable)
]),
renderRowExpandedVNs()
]);
};
const renderBody = () => {
const scrollbarYToLeft = computeScrollbarYToLeft.value;
return h('div', {
class: 'vxe-table--layout-wrapper'
}, scrollbarYToLeft
? [
renderScrollY(),
renderViewport()
]
: [
renderViewport(),
renderScrollY()
]);
};
const renderVN = () => {
const { loading, stripe, showHeader, height, treeConfig, mouseConfig, showFooter, highlightCell, highlightHoverRow, highlightHoverColumn, editConfig, editRules } = props;
const { isGroup, overflowX, overflowY, scrollXLoad, scrollYLoad, tableData, initStore, isRowGroupStatus, columnStore, filterStore, customStore, tooltipStore } = reactData;
const { teleportToWrapperElem, popupToWrapperElem, customPopupToElem } = internalData;
const { leftList, rightList } = columnStore;
const loadingSlot = slots.loading;
const tipSlots = {
header: slots.headerTooltip || slots['header-tooltip'],
body: slots.tooltip,
footer: slots.footerTooltip || slots['footer-tooltip']
};
const currTooltipSlot = tooltipStore.visible && tooltipStore.type ? tipSlots[tooltipStore.type] : null;
const tableStyle = computeTableStyle.value;
const rowDragOpts = computeRowDragOpts.value;
const tableTipConfig = computeTableTipConfig.value;
const validTipConfig = computeValidTipConfig.value;
const validOpts = computeValidOpts.value;
const checkboxOpts = computeCheckboxOpts.value;
const treeOpts = computeTreeOpts.value;
const rowOpts = computeRowOpts.value;
const columnOpts = computeColumnOpts.value;
const vSize = computeSize.value;
const tableBorder = computeTableBorder.value;
const mouseOpts = computeMouseOpts.value;
const areaOpts = computeAreaOpts.value;
const loadingOpts = computeLoadingOpts.value;
const isContentMenu = computeIsContentMenu.value;
const currLoading = reactData.isColLoading || reactData.isRowLoading || loading;
const resizableOpts = computeResizableOpts.value;
const isArea = mouseConfig && mouseOpts.area;
const columnDragOpts = computeColumnDragOpts.value;
const scrollbarXToTop = computeScrollbarXToTop.value;
const scrollbarYToLeft = computeScrollbarYToLeft.value;
const { isCrossTableDrag } = rowDragOpts;
const tbOns = {
onKeydown: keydownEvent,
onContextmenu: contextMenuEvent
};
if (isCrossTableDrag && !tableData.length) {
tbOns.onDragover = $xeTable.handleCrossTableRowDragoverEmptyEvent;
}
return h('div', Object.assign({ ref: refElem, class: ['vxe-table', 'vxe-table--render-default', `tid_${xID}`, `border--${tableBorder}`, `sx-pos--${scrollbarXToTop ? 'top' : 'bottom'}`, `sy-pos--${scrollbarYToLeft ? 'left' : 'right'}`, {
[`size--${vSize}`]: vSize,
[`valid-msg--${validOpts.msgMode}`]: !!editRules,
'vxe-editable': !!editConfig,
'old-cell-valid': editRules && getConfig$2().cellVaildMode === 'obsolete',
'cell--highlight': highlightCell,
'cell--selected': mouseConfig && mouseOpts.selected,
'cell--area': isArea,
'header-cell--area': isArea && areaOpts.selectCellByHeader,
'body-cell--area': isArea && areaOpts.selectCellByBody,
'row--highlight': rowOpts.isHover || highlightHoverRow,
'column--highlight': columnOpts.isHover || highlightHoverColumn,
'checkbox--range': checkboxOpts.range,
'col--drag-cell': columnOpts.drag && columnDragOpts.trigger === 'cell',
'is--header': showHeader,
'not--header': !showHeader,
'is--footer': showFooter,
'not--footer': !showFooter,
'is--group': isGroup,
'is-row-group': isRowGroupStatus,
'is--tree-line': treeConfig && (treeOpts.showLine || treeOpts.line),
'is--fixed-left': leftList.length,
'is--fixed-right': rightList.length,
'is--animat': !!props.animat,
'is--round': props.round,
'is--stripe': !treeConfig && stripe,
'is--loading': currLoading,
'is--empty': !currLoading && !tableData.length,
'is--scroll-y': overflowY,
'not--scroll-y': !overflowY,
'is--scroll-x': overflowX,
'not--scroll-x': !overflowX,
'is--virtual-x': scrollXLoad,
'is--virtual-y': scrollYLoad
}], style: tableStyle, spellcheck: false }, tbOns), [
/**
* 隐藏列
*/
h('div', {
class: 'vxe-table-slots'
}, slots.default ? slots.default({}) : []),
h('div', {
ref: refVarElem,
class: 'vxe-table-vars'
}, [
h('div', {
class: 'vxe-table-var-default'
}),
h('div', {
class: 'vxe-table-var-medium'
}),
h('div', {
class: 'vxe-table-var-small'
}),
h('div', {
class: 'vxe-table-var-mini'
})
]),
h('div', {
key: 'tw',
class: 'vxe-table--render-wrapper'
}, scrollbarXToTop
? [
renderScrollX(),
renderBody()
]
: [
renderBody(),
renderScrollX()
]),
/**
* 空数据
*/
h('div', {
key: 'tn',
ref: refEmptyPlaceholder,
class: 'vxe-table--empty-place-wrapper',
xid: xID
}, [
h('div', {
class: 'vxe-table--empty-placeholder'
}, [
h('div', {
class: 'vxe-table--empty-content'
}, renderEmptyBody())
])
]),
/**
* 边框线
*/
h('div', {
key: 'tl',
class: 'vxe-table--border-line'
}),
/**
* 列宽线
*/
h('div', {
key: 'tcl',
ref: refColResizeBar,
class: 'vxe-table--resizable-col-bar'
}, resizableOpts.showDragTip
? [
h('div', {
class: 'vxe-table--resizable-number-tip'
})
]
: []),
h('div', {
key: 'ttw'
}, [
h(Teleport, {
to: teleportToWrapperElem,
disabled: !($xeGantt && teleportToWrapperElem)
}, [
h('div', {
ref: refTeleportWrapper
}, [
/**
* 行高线
*/
h('div', {
key: 'trl',
ref: refRowResizeBar,
class: 'vxe-table--resizable-row-bar'
}, resizableOpts.showDragTip
? [
h('div', {
class: 'vxe-table--resizable-number-tip'
})
]
: []),
/**
* 加载中
*/
VxeUILoadingComponent
? h(VxeUILoadingComponent, {
key: 'lg',
class: 'vxe-table--loading',
modelValue: currLoading,
icon: loadingOpts.icon,
text: loadingOpts.text
}, loadingSlot
? {
default: () => callSlot(loadingSlot, { $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt, loading: currLoading })
}
: {})
: loadingSlot
? h('div', {
class: ['vxe-loading--custom-wrapper', {
'is--visible': currLoading
}]
}, callSlot(loadingSlot, { $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt, loading: currLoading }))
: renderEmptyElement$1($xeTable),
/**
* 拖拽排序提示
*/
renderDragTip()
])
])
]),
h('div', {
key: 'fpw',
ref: refCustomContainerElem
}, [
h(Teleport, {
to: customPopupToElem,
disabled: !!reactData.ctPopupFlag && !customPopupToElem
}, [
/**
* 自定义列
*/
initStore.custom
? h(TableCustomPanelComponent, {
key: 'cs',
ref: refTableCustom,
customStore
})
: renderEmptyElement$1($xeTable)
])
]),
h('div', {
key: 'tpw'
}, [
h(Teleport, {
to: popupToWrapperElem,
disabled: !($xeGGWrapper && popupToWrapperElem)
}, [
h('div', {
ref: refPopupWrapperElem
}, [
/**
* 筛选
*/
initStore.filter
? h(TableFilterPanelComponent, {
key: 'tf',
ref: refTableFilter,
filterStore
})
: renderEmptyElement$1($xeTable),
/**
* 快捷菜单
*/
isContentMenu
? h(TableMenuPanelComponent, {
key: 'tm',
ref: refTableMenu
})
: renderEmptyElement$1($xeTable)
])
])
]),
/**
* 导入
*/
initStore.import && props.importConfig
? h(TableImportPanelComponent, {
key: 'it',
defaultOptions: reactData.importParams,
storeData: reactData.importStore
})
: renderEmptyElement$1($xeTable),
/**
* 导出
*/
initStore.export && (props.exportConfig || props.printConfig)
? h(TableExportPanelComponent, {
key: 'et',
defaultOptions: reactData.exportParams,
storeData: reactData.exportStore
})
: renderEmptyElement$1($xeTable),
/**
* 提示相关
*/
VxeUITooltipComponent
? h('div', {}, [
/**
* 通用提示
*/
h(VxeUITooltipComponent, {
key: 'ctp',
ref: refCommTooltip,
isArrow: false,
enterable: false
}),
/**
* 工具提示
*/
h(VxeUITooltipComponent, {
key: 'btp',
ref: refTooltip,
theme: tableTipConfig.theme,
enterable: tableTipConfig.enterable,
enterDelay: tableTipConfig.enterDelay,
leaveDelay: tableTipConfig.leaveDelay,
useHtml: XEUtils.isBoolean(tableTipConfig.useHtml) ? tableTipConfig.useHtml : undefined,
// 已废弃
useHTML: XEUtils.isBoolean(tableTipConfig.useHTML) ? tableTipConfig.useHTML : undefined,
width: tableTipConfig.width,
height: tableTipConfig.height,
minWidth: tableTipConfig.minWidth,
minHeight: tableTipConfig.minHeight,
maxWidth: tableTipConfig.maxWidth,
maxHeight: tableTipConfig.maxHeight,
placement: tableTipConfig.placement,
defaultPlacement: tableTipConfig.defaultPlacement,
popupClassName: tableTipConfig.popupClassName
}, currTooltipSlot
? {
content: () => {
const { type, row, column, content: tooltipContent } = tooltipStore;
if (currTooltipSlot) {
if (column && type === 'header') {
return h('div', {
key: type
}, currTooltipSlot({ column, tooltipContent, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt }));
}
if (row && column && type === 'body') {
return h('div', {
key: type
}, currTooltipSlot({ row, column, tooltipContent, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt }));
}
if (row && column && type === 'footer') {
return h('div', {
key: type
}, currTooltipSlot({ row, column, tooltipContent, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt }));
}
}
return renderEmptyElement$1($xeTable);
}
}
: {}),
/**
* 校验提示
*/
props.editRules && validOpts.showErrorMessage && (validOpts.message === 'default' ? !height : validOpts.message === 'tooltip')
? h(VxeUITooltipComponent, {
key: 'vtp',
ref: refValidTooltip,
class: [{
'old-cell-valid': editRules && getConfig$2().cellVaildMode === 'obsolete'
}, 'vxe-table--valid-error'],
theme: validTipConfig.theme,
enterable: validTipConfig.enterable,
enterDelay: validTipConfig.enterDelay,
leaveDelay: validTipConfig.leaveDelay
})
: renderEmptyElement$1($xeTable)
])
: renderEmptyElement$1($xeTable)
]);
};
const dataFlag = ref(0);
watch(() => props.data ? props.data.length : -1, () => {
dataFlag.value++;
});
watch(() => props.data, () => {
dataFlag.value++;
});
watch(dataFlag, () => {
const { initStatus } = internalData;
const value = props.data || [];
if (value && value.length >= 20000) {
warnLog$2('vxe.error.errLargeData', ['loadData(data), reloadData(data)']);
}
loadTableData(value, false, true).then(() => {
const { scrollXLoad, scrollYLoad, expandColumn } = reactData;
const expandOpts = computeExpandOpts.value;
internalData.inited = true;
internalData.initStatus = true;
if (!initStatus) {
handleLoadDefaults();
}
// const checkboxOpts = computeCheckboxOpts.value
// const checkboxColumn = internalData.tableFullColumn.find(column => column.type === 'checkbox')
// if (checkboxColumn && internalData.tableFullData.length > 300 && !checkboxOpts.checkField) {
// warnLog('vxe.error.checkProp', ['checkbox-config.checkField'])
// }
if ((scrollXLoad || scrollYLoad) && (expandColumn && expandOpts.mode !== 'fixed')) {
warnLog$2('vxe.error.scrollErrProp', ['column.type=expand']);
}
return $xeTable.recalculate();
});
});
const staticColumnFlag = ref(0);
watch(() => reactData.staticColumns.length, () => {
staticColumnFlag.value++;
});
watch(() => reactData.staticColumns, () => {
staticColumnFlag.value++;
});
watch(staticColumnFlag, () => {
nextTick(() => handleInitColumn(XEUtils.clone(reactData.staticColumns)));
});
const tableColumnFlag = ref(0);
watch(() => reactData.tableColumn.length, () => {
tableColumnFlag.value++;
});
watch(() => reactData.tableColumn, () => {
tableColumnFlag.value++;
});
watch(tableColumnFlag, () => {
$xeTable.analyColumnWidth();
});
watch(() => reactData.upDataFlag, () => {
nextTick(() => {
$xeTable.updateData();
});
});
watch(() => reactData.reColumnFlag, () => {
nextTick(() => {
$xeTable.refreshColumn();
});
});
const reLayoutFlag = ref(0);
watch(computeSize, () => {
reLayoutFlag.value++;
});
watch(() => props.showHeader, () => {
reLayoutFlag.value++;
});
watch(() => props.showFooter, () => {
reLayoutFlag.value++;
});
watch(() => props.showHeaderOverflow, () => {
reLayoutFlag.value++;
});
watch(() => props.showOverflow, () => {
updateColumnAllOverflow();
reLayoutFlag.value++;
});
watch(() => props.showFooterOverflow, () => {
reLayoutFlag.value++;
});
watch(() => reactData.overflowX, () => {
reLayoutFlag.value++;
});
watch(() => reactData.overflowY, () => {
reLayoutFlag.value++;
});
watch(() => props.height, () => {
reLayoutFlag.value++;
});
watch(() => props.maxHeight, () => {
reLayoutFlag.value++;
});
watch(computeScrollbarXToTop, () => {
reLayoutFlag.value++;
});
watch(computeScrollbarYToLeft, () => {
reLayoutFlag.value++;
});
watch(() => VxeUI.getLanguage(), () => {
reLayoutFlag.value++;
});
watch(() => {
const scrollbarXOpts = computeScrollbarXOpts.value;
return scrollbarXOpts.visible;
}, () => {
reLayoutFlag.value++;
});
watch(() => {
const scrollbarYOpts = computeScrollbarYOpts.value;
return scrollbarYOpts.visible;
}, () => {
reLayoutFlag.value++;
});
watch(() => {
const cellOpts = computeCellOpts.value;
return cellOpts.height;
}, () => {
reLayoutFlag.value++;
});
watch(reLayoutFlag, () => {
$xeTable.recalculate(true);
});
const footFlag = ref(0);
watch(() => props.footerData ? props.footerData.length : -1, () => {
footFlag.value++;
});
watch(() => props.footerData, () => {
footFlag.value++;
});
watch(footFlag, () => {
internalData.footerFullDataRowData = {};
$xeTable.updateFooter();
});
watch(() => props.syncResize, (value) => {
if (value) {
handleUpdateResize();
nextTick(() => {
handleUpdateResize();
setTimeout(() => handleUpdateResize());
});
}
});
const mergeCellFlag = ref(0);
watch(() => props.mergeCells ? props.mergeCells.length : -1, () => {
mergeCellFlag.value++;
});
watch(() => props.mergeCells, () => {
mergeCellFlag.value++;
});
watch(mergeCellFlag, () => {
handleUpdateMergeBodyCells(props.mergeCells || []);
});
const mergeHeaderItemFlag = ref(0);
watch(() => props.mergeHeaderCells ? props.mergeHeaderCells.length : -1, () => {
mergeHeaderItemFlag.value++;
});
watch(() => props.mergeHeaderCells, () => {
mergeHeaderItemFlag.value++;
});
watch(mergeHeaderItemFlag, () => {
handleUpdateMergeHeaderCells(props.mergeHeaderCells || []);
});
const mergeFooteCellFlag = ref(0);
watch(() => props.mergeFooterCells ? props.mergeFooterCells.length : -1, () => {
mergeFooteCellFlag.value++;
});
watch(() => props.mergeFooterCells, () => {
mergeFooteCellFlag.value++;
});
watch(() => props.mergeFooterItems ? props.mergeFooterItems.length : -1, () => {
mergeFooteCellFlag.value++;
});
watch(() => props.mergeFooterItems, () => {
mergeFooteCellFlag.value++;
});
watch(mergeFooteCellFlag, () => {
const mFooterCells = props.mergeFooterCells || props.mergeFooterItems;
handleUpdateMergeFooterCells(mFooterCells || []);
});
watch(computeRowGroupFields, (val) => {
handleUpdateRowGroup(val);
});
watch(computeRowField, () => {
const { inited, tableFullData } = internalData;
// 行主键被改变,重载表格
if (inited) {
handleKeyField();
reactData.tableData = [];
nextTick(() => {
$xeTable.reloadData(tableFullData);
});
}
});
const kfFlag = ref(0);
watch(() => reactData.updateColFlag, () => {
kfFlag.value++;
});
watch(computeKeepFields, () => {
kfFlag.value++;
});
watch(kfFlag, () => {
const keepFields = computeKeepFields.value;
const kpfMaps = {};
keepFields.forEach(field => {
kpfMaps[field] = 1;
});
internalData.keepUpdateFieldMaps = kpfMaps;
});
watch(computeAggregateMode, () => {
if (reactData.isRowGroupStatus) {
loadTableData(internalData.tableSynchData, false, true);
}
});
const layoutReFlag = ref(0);
watch(combineTabsResizeFlag, () => {
layoutReFlag.value++;
});
watch(combineModalResizeFlag, () => {
layoutReFlag.value++;
});
watch(combineSplitterResizeFlag, () => {
layoutReFlag.value++;
});
watch(layoutReFlag, () => {
handleGlobalResizeEvent();
});
handleKeyField();
hooks$1.forEach((options) => {
const { setupTable } = options;
if (setupTable) {
const hookRest = setupTable($xeTable);
if (hookRest && XEUtils.isObject(hookRest)) {
Object.assign($xeTable, hookRest);
}
}
});
$xeTable.preventEvent(null, 'created', { $table: $xeTable });
let resizeObserver;
onActivated(() => {
$xeTable.recalculate().then(() => $xeTable.refreshScroll());
$xeTable.preventEvent(null, 'activated', { $table: $xeTable });
});
onDeactivated(() => {
const { filterStore } = reactData;
if (filterStore.visible) {
$xeTable.clearFilter();
}
$xeTable.closeTooltip();
internalData.isActivated = false;
$xeTable.preventEvent(null, 'deactivated', { $table: $xeTable });
});
onMounted(() => {
const { editConfig, exportConfig, importConfig, treeConfig, minHeight, keepSource } = props;
const { scrollXStore, scrollYStore } = internalData;
const columnOpts = computeColumnOpts.value;
const columnDragOpts = computeColumnDragOpts.value;
const aggregateOpts = computeAggregateOpts.value;
const virtualYOpts = computeVirtualYOpts.value;
const editOpts = computeEditOpts.value;
const treeOpts = computeTreeOpts.value;
const radioOpts = computeRadioOpts.value;
const checkboxOpts = computeCheckboxOpts.value;
const expandOpts = computeExpandOpts.value;
const rowOpts = computeRowOpts.value;
const customOpts = computeCustomOpts.value;
const mouseOpts = computeMouseOpts.value;
const exportOpts = computeExportOpts.value;
const importOpts = computeImportOpts.value;
// const currentRowOpts = computeCurrentRowOpts.value
// const currentColumnOpts = computeCurrentColumnOpts.value
// const keyboardOpts = computeKeyboardOpts.value
const rowDragOpts = computeRowDragOpts.value;
const areaOpts = computeAreaOpts.value;
const sortOpts = computeSortOpts.value;
const filterOpts = computeFilterOpts.value;
const { groupFields } = aggregateOpts;
if ($xeGantt) {
const { refClassifyWrapperElem } = $xeGantt.getRefMaps();
const classifyWrapperEl = refClassifyWrapperElem.value;
if (classifyWrapperEl) {
internalData.teleportToWrapperElem = classifyWrapperEl;
}
}
if ($xeGGWrapper) {
const { refPopupContainerElem } = $xeGGWrapper.getRefMaps();
const popupContainerEl = refPopupContainerElem.value;
if (popupContainerEl) {
internalData.popupToWrapperElem = popupContainerEl;
}
}
if (columnOpts.drag || rowOpts.drag || customOpts.allowSort) {
initTpImg();
}
if (props.rowId) {
warnLog$2('vxe.error.delProp', ['row-id', 'row-config.keyField']);
}
if (props.rowKey) {
warnLog$2('vxe.error.delProp', ['row-key', 'row-config.useKey']);
}
if (props.columnKey) {
warnLog$2('vxe.error.delProp', ['column-id', 'column-config.useKey']);
}
if (!(props.rowId || rowOpts.keyField) && (checkboxOpts.reserve || checkboxOpts.checkRowKeys || radioOpts.reserve || radioOpts.checkRowKey || expandOpts.expandRowKeys || treeOpts.expandRowKeys)) {
warnLog$2('vxe.error.reqProp', ['row-config.keyField']);
}
if (editConfig) {
if (!keepSource) {
if (editOpts.showStatus || editOpts.showUpdateStatus || editOpts.showInsertStatus) {
warnLog$2('vxe.error.reqSupportProp', ['edit-config.showStatus | showUpdateStatus | showInsertStatus', 'keep-source']);
}
// if (keyboardOpts.isUndoRedo) {
// warnLog('vxe.error.reqSupportProp', ['keyboard-config.isUndoRedo', 'keep-source'])
// }
}
}
// if (treeConfig && (treeOpts.showLine || treeOpts.line) && !showOverflow) {
// warnLog('vxe.error.reqProp', ['show-overflow'])
// }
// if (treeConfig && !treeOpts.transform && props.stripe) {
// warnLog('vxe.error.noTree', ['stripe'])
// }
if (treeConfig && !treeOpts.transform) {
if (sortOpts.isDeep) {
warnLog$2('vxe.error.reqSupportProp', ['transform=false', 'sort-config.isDeep=false']);
}
if (filterOpts.isDeep) {
warnLog$2('vxe.error.reqSupportProp', ['transform=false', 'filter-config.isDeep=false']);
}
}
if (props.showFooter && !(props.footerMethod || props.footerData)) {
warnLog$2('vxe.error.reqProp', ['footer-data | footer-method']);
}
if (rowOpts.height) {
warnLog$2('vxe.error.delProp', ['row-config.height', 'cell-config.height']);
}
if (props.highlightCurrentRow) {
warnLog$2('vxe.error.delProp', ['highlight-current-row', 'row-config.isCurrent']);
}
if (props.highlightHoverRow) {
warnLog$2('vxe.error.delProp', ['highlight-hover-row', 'row-config.isHover']);
}
if (props.highlightCurrentColumn) {
warnLog$2('vxe.error.delProp', ['highlight-current-column', 'column-config.isCurrent']);
}
if (props.highlightHoverColumn) {
warnLog$2('vxe.error.delProp', ['highlight-hover-column', 'column-config.isHover']);
}
if (props.resizable) {
warnLog$2('vxe.error.delProp', ['resizable', 'column-config.resizable']);
}
// if (props.virtualXConfig && props.scrollX) {
// warnLog('vxe.error.notSupportProp', ['virtual-x-config', 'scroll-x', 'scroll-x=null'])
// }
// if (props.virtualYConfig && props.scrollY) {
// warnLog('vxe.error.notSupportProp', ['virtual-y-config', 'scroll-y', 'scroll-y=null'])
// }
if (props.aggregateConfig && props.rowGroupConfig) {
warnLog$2('vxe.error.notSupportProp', ['aggregate-config', 'row-group-config', 'row-group-config=null']);
}
// if (props.scrollY) {
// warnLog('vxe.error.delProp', ['scroll-y', 'virtual-y-config'])
// }
// if (props.scrollX) {
// warnLog('vxe.error.delProp', ['scroll-x', 'virtual-x-config'])
// }
// 检查导入导出类型,如果自定义导入导出方法,则不校验类型
if (importConfig && importOpts.types && !importOpts.importMethod && !XEUtils.includeArrays(XEUtils.keys(importOpts._typeMaps), importOpts.types)) {
warnLog$2('vxe.error.errProp', [`export-config.types=${importOpts.types.join(',')}`, importOpts.types.filter((type) => XEUtils.includes(XEUtils.keys(importOpts._typeMaps), type)).join(',') || XEUtils.keys(importOpts._typeMaps).join(',')]);
}
if (exportConfig && exportOpts.types && !exportOpts.exportMethod && !XEUtils.includeArrays(XEUtils.keys(exportOpts._typeMaps), exportOpts.types)) {
warnLog$2('vxe.error.errProp', [`export-config.types=${exportOpts.types.join(',')}`, exportOpts.types.filter((type) => XEUtils.includes(XEUtils.keys(exportOpts._typeMaps), type)).join(',') || XEUtils.keys(exportOpts._typeMaps).join(',')]);
}
if (exportConfig && XEUtils.isBoolean(exportOpts.isAllExpand)) {
warnLog$2('vxe.error.delProp', ['isAllExpand', 'isTreeAllExpanded']);
}
if (!props.id) {
if ((props.customConfig ? isEnableConf(customOpts) : customOpts.enabled) && customOpts.storage) {
errLog$2('vxe.error.reqProp', ['id']);
}
}
if (props.treeConfig && checkboxOpts.range) {
errLog$2('vxe.error.noTree', ['checkbox-config.range']);
}
if (rowOpts.height && !props.showOverflow) {
warnLog$2('vxe.error.notProp', ['table.show-overflow']);
}
if (!$xeTable.triggerClAreaMnEvent) {
if (props.areaConfig) {
warnLog$2('vxe.error.notProp', ['area-config']);
}
if (props.clipConfig) {
warnLog$2('vxe.error.notProp', ['clip-config']);
}
if (props.fnrConfig) {
warnLog$2('vxe.error.notProp', ['fnr-config']);
}
if (mouseOpts.area) {
errLog$2('vxe.error.notProp', ['mouse-config.area']);
return;
}
if (mouseOpts.area && areaOpts.selectCellByHeader && columnOpts.drag && columnDragOpts.trigger === 'cell') {
errLog$2('vxe.error.notSupportProp', ['area-config.selectCellByHeader & column-config.drag', 'column-drag-config.trigger=cell', 'column-drag-config.trigger=default | area-config.selectCellByHeader=false']);
}
}
if (!$xeTable.handlePivotTableAggData) {
if (customOpts.allowGroup) {
errLog$2('vxe.error.notProp', ['custom-config.allowGroup']);
return;
}
if (customOpts.allowValues) {
errLog$2('vxe.error.notProp', ['custom-config.allowValues']);
return;
}
}
if (treeConfig && rowOpts.drag && !treeOpts.transform) {
errLog$2('vxe.error.notSupportProp', ['row-config.drag', 'tree-config.transform=false', 'tree-config.transform=true']);
}
if (treeConfig && rowDragOpts.isCrossTableDrag && !rowDragOpts.isCrossDrag) {
errLog$2('vxe.error.reqSupportProp', ['tree-config & row-drag-config.isCrossTableDrag', 'row-drag-config.isCrossDrag']);
}
if (props.dragConfig) {
warnLog$2('vxe.error.delProp', ['drag-config', 'row-drag-config']);
}
if (props.rowGroupConfig) {
warnLog$2('vxe.error.delProp', ['row-group-config', 'aggregate-config']);
}
if (aggregateOpts.countFields) {
warnLog$2('vxe.error.delProp', ['row-group-config.countFields', 'column.agg-func']);
}
if (aggregateOpts.aggregateMethod) {
warnLog$2('vxe.error.delProp', ['row-group-config.aggregateMethod', 'aggregate-config.calcValuesMethod']);
}
if (aggregateOpts.countMethod) {
warnLog$2('vxe.error.delProp', ['aggregate-config.countMethod', 'aggregate-config.calcValuesMethod']);
}
if (props.treeConfig && treeOpts.children) {
warnLog$2('vxe.error.delProp', ['tree-config.children', 'tree-config.childrenField']);
}
if (props.treeConfig && treeOpts.line) {
warnLog$2('vxe.error.delProp', ['tree-config.line', 'tree-config.showLine']);
}
if (mouseOpts.area && mouseOpts.selected) {
warnLog$2('vxe.error.errConflicts', ['mouse-config.area', 'mouse-config.selected']);
}
if (mouseOpts.area && (props.treeConfig && !treeOpts.transform)) {
errLog$2('vxe.error.notSupportProp', ['mouse-config.area', 'tree-config.transform=false', 'tree-config.transform=true']);
}
if (props.editConfig && editOpts.activeMethod) {
warnLog$2('vxe.error.delProp', ['edit-config.activeMethod', 'edit-config.beforeEditMethod']);
}
if (checkboxOpts.halfField) {
warnLog$2('vxe.error.delProp', ['checkbox-config.halfField', 'checkbox-config.indeterminateField']);
}
if (props.editConfig && isEnableConf(editOpts) && props.editRules && (minHeight === 0 || minHeight === '0')) {
warnLog$2('vxe.error.reqSupportProp', ['edit-config & edit-rules', 'min-height']);
}
if (treeConfig) {
XEUtils.arrayEach(['rowField', 'parentField', 'childrenField', 'hasChildField', 'mapChildrenField'], key => {
const val = treeOpts[key];
if (val && val.indexOf('.') > -1) {
errLog$2('vxe.error.errProp', [`${key}=${val}`, `${key}=${val.split('.')[0]}`]);
}
});
}
if (rowOpts.currentMethod) {
warnLog$2('vxe.error.delProp', ['row-config.currentMethod', 'current-row-config.beforeSelectMethod']);
}
if (columnOpts.currentMethod) {
warnLog$2('vxe.error.delProp', ['row-config.currentMethod', 'current-column-config.beforeSelectMethod']);
}
// if ((rowOpts.isCurrent || highlightCurrentRow) && props.keyboardConfig && keyboardOpts.isArrow && !XEUtils.isBoolean(currentRowOpts.isFollowSelected)) {
// warnLog('vxe.error.notConflictProp', ['row-config.isCurrent & keyboard-config.isArrow', 'current-row-config.isFollowSelected'])
// }
// if ((columnOpts.isCurrent || highlightCurrentColumn) && props.keyboardConfig && keyboardOpts.isArrow && !XEUtils.isBoolean(currentColumnOpts.isFollowSelected)) {
// warnLog('vxe.error.notConflictProp', ['column-config.isCurrent & keyboard-config.isArrow', 'current-column-config.isFollowSelected'])
// }
// 如果不支持虚拟滚动
// if (props.spanMethod) {
// if (virtualXOpts.enabled) {
// warnLog('vxe.error.notConflictProp', ['span-method', 'virtual-x-config.enabled=false'])
// }
// if (virtualYOpts.enabled) {
// warnLog('vxe.error.notConflictProp', ['span-method', 'virtual-y-config.enabled=false'])
// }
// }
// if (props.footerSpanMethod) {
// if (virtualXOpts.enabled) {
// warnLog('vxe.error.notConflictProp', ['footer-span-method', 'virtual-x-config.enabled=false'])
// }
// }
// 检查是否有安装需要的模块
// if (props.editConfig && !$xeTable.insert) {
// errLog('vxe.error.reqModule', ['Edit'])
// }
// if (props.editRules && !$xeTable.validate) {
// errLog('vxe.error.reqModule', ['Validator'])
// }
// if ((checkboxOpts.range || props.keyboardConfig || props.mouseConfig) && !$xeTable.handleCellMousedownEvent) {
// errLog('vxe.error.reqModule', ['Keyboard'])
// }
// if ((props.printConfig || props.importConfig || props.exportConfig) && !$xeTable.exportData) {
// errLog('vxe.error.reqModule', ['Export'])
// }
Object.assign(scrollYStore, {
startIndex: 0,
endIndex: 0,
visibleSize: 0
});
Object.assign(scrollXStore, {
startIndex: 0,
endIndex: 0,
visibleSize: 0
});
handleUpdateRowGroup(groupFields);
initData();
nextTick(() => {
if (props.autoResize) {
const el = refElem.value;
const parentEl = $xeTable.getParentElem();
resizeObserver = globalResize.create(() => {
if (props.autoResize) {
handleResizeEvent();
}
});
if (el) {
resizeObserver.observe(el);
}
if (parentEl) {
resizeObserver.observe(parentEl);
}
}
});
if (virtualYOpts.mode !== 'scroll') {
const tableViewportEl = refTableViewportElem.value;
if (tableViewportEl) {
tableViewportEl.addEventListener('wheel', $xeTable.triggerBodyWheelEvent, { passive: false });
}
}
globalEvents$1.on($xeTable, 'paste', handleGlobalPasteEvent);
globalEvents$1.on($xeTable, 'copy', handleGlobalCopyEvent);
globalEvents$1.on($xeTable, 'cut', handleGlobalCutEvent);
globalEvents$1.on($xeTable, 'mousedown', handleGlobalMousedownEvent);
globalEvents$1.on($xeTable, 'blur', handleGlobalBlurEvent);
globalEvents$1.on($xeTable, 'mousewheel', handleGlobalMousewheelEvent);
globalEvents$1.on($xeTable, 'keydown', handleGlobalKeydownEvent);
globalEvents$1.on($xeTable, 'resize', handleGlobalResizeEvent);
globalEvents$1.on($xeTable, 'scroll', handleGlobalScrollEvent);
globalEvents$1.on($xeTable, 'contextmenu', $xeTable.handleGlobalContextmenuEvent);
$xeTable.preventEvent(null, 'mounted', { $table: $xeTable });
});
onBeforeUnmount(() => {
const { _sToTime } = internalData;
if (_sToTime) {
clearTimeout(_sToTime);
}
const tableViewportEl = refTableViewportElem.value;
if (tableViewportEl) {
tableViewportEl.removeEventListener('wheel', $xeTable.triggerBodyWheelEvent);
}
internalData.cvCacheMaps = {};
internalData.prevDragRow = null;
internalData.prevDragCol = null;
if (resizeObserver) {
resizeObserver.disconnect();
}
$xeTable.closeTooltip();
$xeTable.closeFilter();
if ($xeTable.closeMenu) {
$xeTable.closeMenu();
}
globalEvents$1.off($xeTable, 'paste');
globalEvents$1.off($xeTable, 'copy');
globalEvents$1.off($xeTable, 'cut');
globalEvents$1.off($xeTable, 'mousedown');
globalEvents$1.off($xeTable, 'blur');
globalEvents$1.off($xeTable, 'mousewheel');
globalEvents$1.off($xeTable, 'keydown');
globalEvents$1.off($xeTable, 'resize');
globalEvents$1.off($xeTable, 'scroll');
globalEvents$1.off($xeTable, 'contextmenu');
$xeTable.preventEvent(null, 'beforeUnmount', { $table: $xeTable });
XEUtils.assign(reactData, createReactData$2());
XEUtils.assign(internalData, createInternalData$3());
});
onUnmounted(() => {
$xeTable.preventEvent(null, 'unmounted', { $table: $xeTable });
});
nextTick(() => {
const { showOverflow, showHeaderOverflow, showFooterOverflow } = props;
const tooltipOpts = computeTooltipOpts.value;
const headerTooltipOpts = computeHeaderTooltipOpts.value;
const footerTooltipOpts = computeFooterTooltipOpts.value;
if (props.loading) {
if (!VxeUILoadingComponent && !slots.loading) {
errLog$2('vxe.error.reqComp', ['vxe-loading']);
errLog$2('vxe.error.errProp', ['loading=true', 'loading=false | <template #loading>...</template>']);
}
}
if (!VxeUITooltipComponent) {
let useOvTip = false;
if (showOverflow === 'tooltip') {
useOvTip = true;
errLog$2('vxe.error.errProp', ['show-overflow=' + showOverflow, 'show-overflow=false,title,ellipsis']);
}
if (showOverflow === true && tooltipOpts.mode === 'tooltip') {
useOvTip = true;
errLog$2('vxe.error.notSupportProp', ['show-overflow=' + showOverflow, 'tooltip-config.mode=tooltip', 'tooltip-config.mode=title,ellipsis']);
}
if (showHeaderOverflow === 'tooltip') {
useOvTip = true;
errLog$2('vxe.error.errProp', ['show-header-overflow=' + showHeaderOverflow, 'show-header-overflow=false,title,ellipsis']);
}
if (showHeaderOverflow === true && headerTooltipOpts.mode === 'tooltip') {
useOvTip = true;
errLog$2('vxe.error.notSupportProp', ['show-header-overflow=' + showHeaderOverflow, 'header-tooltip-config.mode=tooltip', 'header-tooltip-config.mode=title,ellipsis']);
}
if (showFooterOverflow === 'tooltip') {
useOvTip = true;
errLog$2('vxe.error.errProp', ['show-footer-overflow=' + showFooterOverflow, 'show-footer-overflow=false,title,ellipsis']);
}
if (showFooterOverflow === true && footerTooltipOpts.mode === 'tooltip') {
useOvTip = true;
errLog$2('vxe.error.notSupportProp', ['show-footer-overflow=' + showFooterOverflow, 'footer-tooltip-config.mode=tooltip', 'footer-tooltip-config.mode=title,ellipsis']);
}
if (useOvTip) {
errLog$2('vxe.error.reqComp', ['vxe-tooltip']);
}
}
});
provide('$xeColgroup', null);
provide('$xeTable', $xeTable);
$xeTable.renderVN = renderVN;
return $xeTable;
},
render() {
return this.renderVN();
}
});
const { warnLog: warnLog$1, errLog: errLog$1 } = createComponentLog('toolbar');
const { getConfig: getConfig$1, getIcon, getI18n: getI18n$1, renderer, commands: commands$1, createEvent: createEvent$1, useFns: useFns$1 } = VxeUI;
function createReactData$1() {
return {
isRefresh: false,
connectFlag: 0,
columns: []
};
}
function createInternalData$1() {
return {
connectTable: null
};
}
var VxeToolbarComponent = defineVxeComponent({
name: 'VxeToolbar',
props: {
loading: Boolean,
refresh: [Boolean, Object],
refreshOptions: Object,
import: [Boolean, Object],
importOptions: Object,
export: [Boolean, Object],
exportOptions: Object,
print: [Boolean, Object],
printOptions: Object,
zoom: [Boolean, Object],
zoomOptions: Object,
custom: [Boolean, Object],
customOptions: Object,
buttons: {
type: Array,
default: () => getConfig$1().toolbar.buttons
},
tools: {
type: Array,
default: () => getConfig$1().toolbar.tools
},
perfect: {
type: Boolean,
default: () => getConfig$1().toolbar.perfect
},
size: {
type: String,
default: () => getConfig$1().toolbar.size || getConfig$1().size
},
className: [String, Function]
},
emits: [
'button-click',
'tool-click'
],
setup(props, context) {
const { slots, emit } = context;
const xID = XEUtils.uniqueId();
// 使用已安装的组件,如果未安装则不渲染
const VxeUIButtonComponent = VxeUI.getComponent('VxeButton');
const $xeGrid = inject('$xeGrid', null);
const $xeGantt = inject('$xeGantt', null);
const $xeGGWrapper = $xeGrid || $xeGantt;
const { computeSize } = useFns$1.useSize(props);
const reactData = reactive(createReactData$1());
const internalData = createInternalData$1();
const refElem = ref();
const refMaps = {
refElem
};
const $xeToolbar = {
xID,
props,
context,
reactData,
internalData,
getRefMaps: () => refMaps
};
let toolbarMethods = {};
const computeRefreshOpts = computed(() => {
return Object.assign({}, XEUtils.clone(getConfig$1().toolbar.refresh, true), props.refreshOptions, props.refresh);
});
const computeImportOpts = computed(() => {
return Object.assign({}, XEUtils.clone(getConfig$1().toolbar.import, true), props.importOptions, props.import);
});
const computeExportOpts = computed(() => {
return Object.assign({}, XEUtils.clone(getConfig$1().toolbar.export, true), props.exportOptions, props.export);
});
const computePrintOpts = computed(() => {
return Object.assign({}, XEUtils.clone(getConfig$1().toolbar.print, true), props.printOptions, props.print);
});
const computeZoomOpts = computed(() => {
return Object.assign({}, XEUtils.clone(getConfig$1().toolbar.zoom, true), props.zoomOptions, props.zoom);
});
const computeCustomOpts = computed(() => {
return Object.assign({}, XEUtils.clone(getConfig$1().toolbar.custom, true), props.customOptions, props.custom);
});
const computeTableCustomOpts = computed(() => {
const { connectTable } = internalData;
const $table = connectTable;
if (reactData.connectFlag || $table) {
if ($table) {
const { computeCustomOpts } = $table.getComputeMaps();
return computeCustomOpts.value;
}
}
return { trigger: '' };
});
const computeTrigger = computed(() => {
const tableCustomOpts = computeTableCustomOpts.value;
return tableCustomOpts.trigger;
});
const checkTable = () => {
const { connectTable } = internalData;
const $table = connectTable;
if ($table) {
return true;
}
errLog$1('vxe.error.barUnableLink');
};
const handleClickSettingEvent = ({ $event }) => {
const { connectTable } = internalData;
const $table = connectTable;
if ($table) {
if ($table.triggerCustomEvent) {
$table.triggerCustomEvent($event);
}
}
};
const handleMouseenterSettingEvent = ({ $event }) => {
const { connectTable } = internalData;
const $table = connectTable;
if ($table) {
$table.customOpenEvent($event);
}
};
const handleMouseleaveSettingEvent = ({ $event }) => {
const { connectTable } = internalData;
const $table = connectTable;
if ($table) {
const { customStore } = $table.reactData;
customStore.activeBtn = false;
setTimeout(() => {
if (!customStore.activeBtn && !customStore.activeWrapper) {
$table.customCloseEvent($event);
}
}, 350);
}
};
const refreshEvent = ({ $event }) => {
const { isRefresh } = reactData;
const refreshOpts = computeRefreshOpts.value;
if (!isRefresh) {
const queryMethod = refreshOpts.queryMethod || refreshOpts.query;
if (queryMethod) {
reactData.isRefresh = true;
try {
Promise.resolve(queryMethod({})).catch((e) => e).then(() => {
reactData.isRefresh = false;
});
}
catch (e) {
reactData.isRefresh = false;
}
}
else if ($xeGGWrapper) {
reactData.isRefresh = true;
$xeGGWrapper.triggerToolbarCommitEvent({ code: refreshOpts.code || 'reload' }, $event).catch(() => { }).then(() => {
reactData.isRefresh = false;
});
}
}
};
const zoomEvent = ({ $event }) => {
if ($xeGGWrapper) {
$xeGGWrapper.triggerZoomEvent($event);
}
else {
warnLog$1('vxe.error.notProp', ['zoom']);
}
};
const importEvent = () => {
if (checkTable()) {
const { connectTable } = internalData;
const $table = connectTable;
if ($table) {
$table.importData();
}
}
};
const openImportEvent = () => {
if (checkTable()) {
const { connectTable } = internalData;
const $table = connectTable;
if ($table) {
$table.openImport();
}
}
};
const exportEvent = () => {
if (checkTable()) {
const { connectTable } = internalData;
const $table = connectTable;
if ($table) {
$table.exportData();
}
}
};
const openExportEvent = () => {
if (checkTable()) {
const { connectTable } = internalData;
const $table = connectTable;
if ($table) {
$table.openExport();
}
}
};
const printEvent = () => {
if (checkTable()) {
const { connectTable } = internalData;
const $table = connectTable;
if ($table) {
$table.print();
}
}
};
const openPrintEvent = () => {
if (checkTable()) {
const { connectTable } = internalData;
const $table = connectTable;
if ($table) {
$table.openPrint();
}
}
};
const handleDefaultCodeEvent = (eventParams, item, cb) => {
switch (item.code) {
case 'print':
printEvent();
break;
case 'open_print':
openPrintEvent();
break;
case 'custom':
handleClickSettingEvent(eventParams);
break;
case 'export':
exportEvent();
break;
case 'open_export':
openExportEvent();
break;
case 'import':
importEvent();
break;
case 'open_import':
openImportEvent();
break;
case 'zoom':
zoomEvent(eventParams);
break;
case 'refresh':
refreshEvent(eventParams);
break;
default:
cb();
break;
}
};
const btnEvent = (eventParams, item) => {
const { $event } = eventParams;
const { connectTable } = internalData;
const $table = connectTable;
const { code } = item;
if (code) {
handleDefaultCodeEvent(eventParams, item, () => {
if ($xeGGWrapper) {
$xeGGWrapper.triggerToolbarBtnEvent(item, $event);
}
else {
const gCommandOpts = commands$1.get(code);
const params = { code, button: item, $table: $table, $grid: $xeGrid, $gantt: $xeGantt, $event };
if (gCommandOpts) {
const tCommandMethod = gCommandOpts.tableCommandMethod || gCommandOpts.commandMethod;
if (tCommandMethod) {
tCommandMethod(params);
}
else {
errLog$1('vxe.error.notCommands', [code]);
}
}
$xeToolbar.dispatchEvent('button-click', params, $event);
}
});
}
};
const tolEvent = (eventParams, item) => {
const { $event } = eventParams;
const { connectTable } = internalData;
const $table = connectTable;
const { code } = item;
if (code) {
handleDefaultCodeEvent(eventParams, item, () => {
if ($xeGGWrapper) {
$xeGGWrapper.triggerToolbarTolEvent(item, $event);
}
else {
const gCommandOpts = commands$1.get(code);
const params = { code, button: null, tool: item, $table: $table, $grid: $xeGrid, $gantt: $xeGantt, $event };
if (gCommandOpts) {
const tCommandMethod = gCommandOpts.tableCommandMethod || gCommandOpts.commandMethod;
if (tCommandMethod) {
tCommandMethod(params);
}
else {
errLog$1('vxe.error.notCommands', [code]);
}
}
$xeToolbar.dispatchEvent('tool-click', params, $event);
}
});
}
};
const dispatchEvent = (type, params, evnt) => {
emit(type, createEvent$1(evnt, { $toolbar: $xeToolbar }, params));
};
toolbarMethods = {
dispatchEvent,
syncUpdate(params) {
internalData.connectTable = params.$table;
reactData.columns = params.collectColumn;
reactData.connectFlag++;
}
};
Object.assign($xeToolbar, toolbarMethods);
const renderDropdowns = (item, isBtn) => {
const { dropdowns } = item;
const downVNs = [];
if (dropdowns) {
return dropdowns.map((child, index) => {
if (child.visible === false) {
return createCommentVNode();
}
return VxeUIButtonComponent
? h(VxeUIButtonComponent, Object.assign(Object.assign({ key: index }, Object.assign({}, child, {
content: child.content || child.name,
options: undefined
})), { onClick: (eventParams) => isBtn ? btnEvent(eventParams, child) : tolEvent(eventParams, child) }))
: createCommentVNode();
});
}
return downVNs;
};
/**
* 渲染按钮
*/
const renderLeftBtns = () => {
const { buttons } = props;
const { connectTable } = internalData;
const $table = connectTable;
const buttonsSlot = slots.buttons;
const buttonPrefixSlot = slots.buttonPrefix || slots['button-prefix'];
const buttonSuffixSlot = slots.buttonSuffix || slots['button-suffix'];
const btnVNs = [];
if (buttons) {
buttons.forEach((item, index) => {
const { dropdowns, buttonRender } = item;
if (item.visible !== false) {
const compConf = buttonRender ? renderer.get(buttonRender.name) : null;
if (buttonRender && compConf && compConf.renderToolbarButton) {
const toolbarButtonClassName = compConf.toolbarButtonClassName;
const params = { $grid: $xeGrid, $gantt: $xeGantt, $table: $table, button: item };
btnVNs.push(h('span', {
key: `br${item.code || index}`,
class: ['vxe-button--item', toolbarButtonClassName ? (XEUtils.isFunction(toolbarButtonClassName) ? toolbarButtonClassName(params) : toolbarButtonClassName) : '']
}, getSlotVNs(compConf.renderToolbarButton(buttonRender, params))));
}
else {
if (VxeUIButtonComponent) {
btnVNs.push(h(VxeUIButtonComponent, Object.assign(Object.assign({ key: `bd${item.code || index}` }, Object.assign({}, item, {
content: item.content || item.name,
options: undefined
})), { onClick: (eventParams) => btnEvent(eventParams, item) }), dropdowns && dropdowns.length
? {
dropdowns: () => renderDropdowns(item, true)
}
: {}));
}
}
}
});
}
return [
h('div', {
class: 'vxe-button--prefix-wrapper'
}, buttonPrefixSlot ? getSlotVNs(buttonPrefixSlot({ buttons: buttons || [], $grid: $xeGrid, $gantt: $xeGantt, $table: $table })) : []),
h('div', {
class: 'vxe-button--item-wrapper'
}, buttonsSlot ? getSlotVNs(buttonsSlot({ buttons: buttons || [], $grid: $xeGrid, $gantt: $xeGantt, $table: $table })) : btnVNs),
h('div', {
class: 'vxe-button--suffix-wrapper'
}, buttonSuffixSlot ? getSlotVNs(buttonSuffixSlot({ buttons: buttons || [], $grid: $xeGrid, $gantt: $xeGantt, $table: $table })) : [])
];
};
/**
* 渲染右侧工具
*/
const renderRightTools = () => {
const { tools } = props;
const { connectTable } = internalData;
const $table = connectTable;
const toolsSlot = slots.tools;
const toolPrefixSlot = slots.toolPrefix || slots['tool-prefix'];
const toolSuffixSlot = slots.toolSuffix || slots['tool-suffix'];
const btnVNs = [];
if (tools) {
tools.forEach((item, tIndex) => {
const { dropdowns, toolRender } = item;
if (item.visible !== false) {
const rdName = toolRender ? toolRender.name : null;
const compConf = toolRender ? renderer.get(rdName) : null;
if (toolRender && compConf && compConf.renderToolbarTool) {
const toolbarToolClassName = compConf.toolbarToolClassName;
const params = { $grid: $xeGrid, $gantt: $xeGantt, $table: $table, tool: item };
btnVNs.push(h('span', {
key: rdName,
class: ['vxe-tool--item', toolbarToolClassName ? (XEUtils.isFunction(toolbarToolClassName) ? toolbarToolClassName(params) : toolbarToolClassName) : '']
}, getSlotVNs(compConf.renderToolbarTool(toolRender, params))));
}
else {
if (VxeUIButtonComponent) {
btnVNs.push(h(VxeUIButtonComponent, Object.assign(Object.assign({ key: tIndex }, Object.assign({}, item, {
content: item.content || item.name,
options: undefined
})), { onClick: (eventParams) => tolEvent(eventParams, item) }), dropdowns && dropdowns.length
? {
dropdowns: () => renderDropdowns(item, false)
}
: {}));
}
}
}
});
}
return [
h('div', {
class: 'vxe-tool--prefix-wrapper'
}, toolPrefixSlot ? getSlotVNs(toolPrefixSlot({ tools: tools || [], $grid: $xeGrid, $gantt: $xeGantt, $table: $table })) : []),
h('div', {
class: 'vxe-tool--item-wrapper'
}, toolsSlot ? getSlotVNs(toolsSlot({ tools: tools || [], $grid: $xeGrid, $gantt: $xeGantt, $table: $table })) : btnVNs),
h('div', {
class: 'vxe-tool--suffix-wrapper'
}, toolSuffixSlot ? getSlotVNs(toolSuffixSlot({ tools: tools || [], $grid: $xeGrid, $gantt: $xeGantt, $table: $table })) : [])
];
};
const renderToolImport = () => {
const importOpts = computeImportOpts.value;
return VxeUIButtonComponent
? h(VxeUIButtonComponent, {
key: 'import',
circle: true,
icon: importOpts.icon || getIcon().TOOLBAR_TOOLS_IMPORT,
title: getI18n$1('vxe.toolbar.import'),
onClick: openImportEvent
})
: createCommentVNode();
};
const renderToolExport = () => {
const exportOpts = computeExportOpts.value;
return VxeUIButtonComponent
? h(VxeUIButtonComponent, {
key: 'export',
circle: true,
icon: exportOpts.icon || getIcon().TOOLBAR_TOOLS_EXPORT,
title: getI18n$1('vxe.toolbar.export'),
onClick: openExportEvent
})
: createCommentVNode();
};
const renderToolPrint = () => {
const printOpts = computePrintOpts.value;
return VxeUIButtonComponent
? h(VxeUIButtonComponent, {
key: 'print',
circle: true,
icon: printOpts.icon || getIcon().TOOLBAR_TOOLS_PRINT,
title: getI18n$1('vxe.toolbar.print'),
onClick: openPrintEvent
})
: createCommentVNode();
};
const renderToolRefresh = () => {
const refreshOpts = computeRefreshOpts.value;
return VxeUIButtonComponent
? h(VxeUIButtonComponent, {
key: 'refresh',
circle: true,
icon: reactData.isRefresh ? (refreshOpts.iconLoading || getIcon().TOOLBAR_TOOLS_REFRESH_LOADING) : (refreshOpts.icon || getIcon().TOOLBAR_TOOLS_REFRESH),
title: getI18n$1('vxe.toolbar.refresh'),
onClick: refreshEvent
})
: createCommentVNode();
};
const renderToolZoom = () => {
const zoomOpts = computeZoomOpts.value;
return $xeGGWrapper && VxeUIButtonComponent
? h(VxeUIButtonComponent, {
key: 'zoom',
circle: true,
icon: $xeGGWrapper.isMaximized() ? (zoomOpts.iconOut || getIcon().TOOLBAR_TOOLS_MINIMIZE) : (zoomOpts.iconIn || getIcon().TOOLBAR_TOOLS_FULLSCREEN),
title: getI18n$1(`vxe.toolbar.zoom${$xeGGWrapper.isMaximized() ? 'Out' : 'In'}`),
onClick: zoomEvent
})
: createCommentVNode();
};
const renderToolCustom = () => {
const customOpts = computeCustomOpts.value;
const btnTrigger = computeTrigger.value;
const customBtnOns = {};
if (btnTrigger === 'manual') ;
else if (btnTrigger === 'hover') {
// hover 触发
customBtnOns.onMouseenter = handleMouseenterSettingEvent;
customBtnOns.onMouseleave = handleMouseleaveSettingEvent;
}
else {
// 点击触发
customBtnOns.onClick = handleClickSettingEvent;
}
return VxeUIButtonComponent
? h(VxeUIButtonComponent, Object.assign({ key: 'custom', circle: true, icon: customOpts.icon || getIcon().TOOLBAR_TOOLS_CUSTOM, title: getI18n$1('vxe.toolbar.custom'), className: 'vxe-toolbar-custom-target' }, customBtnOns))
: createCommentVNode();
};
const renderVN = () => {
const { perfect, loading, refresh, zoom, custom, className } = props;
const vSize = computeSize.value;
return h('div', {
ref: refElem,
class: ['vxe-toolbar', className ? (XEUtils.isFunction(className) ? className({ $toolbar: $xeToolbar }) : className) : '', {
[`size--${vSize}`]: vSize,
'is--perfect': perfect,
'is--loading': loading
}]
}, [
h('div', {
class: 'vxe-buttons--wrapper'
}, renderLeftBtns()),
h('div', {
class: 'vxe-tools--wrapper'
}, renderRightTools()),
h('div', {
class: 'vxe-tools--operate'
}, [
props.import ? renderToolImport() : createCommentVNode(),
props.export ? renderToolExport() : createCommentVNode(),
props.print ? renderToolPrint() : createCommentVNode(),
refresh ? renderToolRefresh() : createCommentVNode(),
zoom && $xeGGWrapper ? renderToolZoom() : createCommentVNode(),
custom ? renderToolCustom() : createCommentVNode()
])
]);
};
$xeToolbar.renderVN = renderVN;
nextTick(() => {
const refreshOpts = computeRefreshOpts.value;
const queryMethod = refreshOpts.queryMethod || refreshOpts.query;
if (props.refresh && !$xeGGWrapper && !queryMethod) {
warnLog$1('vxe.error.notFunc', ['queryMethod']);
}
if (XEUtils.isPlainObject(props.custom)) {
warnLog$1('vxe.error.delProp', ['custom={...}', 'custom=boolean & custom-options={...}']);
}
if (XEUtils.isPlainObject(props.print)) {
warnLog$1('vxe.error.delProp', ['print={...}', 'print=boolean & print-options={...}']);
}
if (XEUtils.isPlainObject(props.export)) {
warnLog$1('vxe.error.delProp', ['export={...}', 'export=boolean & export-options={...}']);
}
if (XEUtils.isPlainObject(props.import)) {
warnLog$1('vxe.error.delProp', ['import={...}', 'import=boolean & import-options={...}']);
}
if (XEUtils.isPlainObject(props.refresh)) {
warnLog$1('vxe.error.delProp', ['refresh={...}', 'refresh=boolean & refresh-options={...}']);
}
if (XEUtils.isPlainObject(props.refresh)) {
warnLog$1('vxe.error.delProp', ['zoom={...}', 'zoom=boolean & zoom-options={...}']);
}
const customOpts = computeCustomOpts.value;
if (customOpts.isFooter) {
warnLog$1('vxe.error.delProp', ['toolbar.custom.isFooter', 'table.custom-config.showFooter']);
}
if (customOpts.showFooter) {
warnLog$1('vxe.error.delProp', ['toolbar.custom.showFooter', 'table.custom-config.showFooter']);
}
if (customOpts.immediate) {
warnLog$1('vxe.error.delProp', ['toolbar.custom.immediate', 'table.custom-config.immediate']);
}
if (customOpts.trigger) {
warnLog$1('vxe.error.delProp', ['toolbar.custom.trigger', 'table.custom-config.trigger']);
}
if (props.refresh || props.import || props.export || props.print || props.zoom) {
if (!VxeUIButtonComponent) {
errLog$1('vxe.error.reqComp', ['vxe-button']);
}
}
});
onBeforeUnmount(() => {
XEUtils.assign(reactData, createReactData$1());
XEUtils.assign(internalData, createInternalData$1());
});
return $xeToolbar;
},
render() {
return this.renderVN();
}
});
const { warnLog, errLog } = createComponentLog('grid');
const { getConfig, getI18n, commands, hooks, useFns, createEvent, globalEvents, GLOBAL_EVENT_KEYS, renderEmptyElement } = VxeUI;
const tableComponentPropKeys = Object.keys(tableProps);
const tableComponentMethodKeys = ['clearAll', 'syncData', 'updateData', 'loadData', 'reloadData', 'reloadRow', 'loadColumn', 'reloadColumn', 'getRowNode', 'getColumnNode', 'getRowIndex', 'getVTRowIndex', 'getVMRowIndex', 'getColumnIndex', 'getVTColumnIndex', 'getVMColumnIndex', 'setRow', 'createData', 'createRow', 'revertData', 'clearData', 'isRemoveByRow', 'isInsertByRow', 'isUpdateByRow', 'getColumns', 'getColumnById', 'getColumnByField', 'getTableColumn', 'getFullColumns', 'getData', 'getCheckboxRecords', 'getParentRow', 'getTreeRowChildren', 'getTreeRowLevel', 'getTreeParentRow', 'getRowSeq', 'getRowById', 'getRowid', 'getTableData', 'getFullData', 'setColumnFixed', 'clearColumnFixed', 'setColumnWidth', 'getColumnWidth', 'recalcRowHeight', 'setRowHeightConf', 'getRowHeightConf', 'setRowHeight', 'getRowHeight', 'hideColumn', 'showColumn', 'resetColumn', 'refreshColumn', 'refreshScroll', 'recalculate', 'closeTooltip', 'isAllCheckboxChecked', 'isAllCheckboxIndeterminate', 'getCheckboxIndeterminateRecords', 'setCheckboxRow', 'setCheckboxRowKey', 'isCheckedByCheckboxRow', 'isCheckedByCheckboxRowKey', 'isIndeterminateByCheckboxRow', 'isIndeterminateByCheckboxRowKey', 'toggleCheckboxRow', 'setAllCheckboxRow', 'getRadioReserveRecord', 'clearRadioReserve', 'getCheckboxReserveRecords', 'clearCheckboxReserve', 'toggleAllCheckboxRow', 'clearCheckboxRow', 'setCurrentRow', 'isCheckedByRadioRow', 'isCheckedByRadioRowKey', 'setRadioRow', 'setRadioRowKey', 'clearCurrentRow', 'clearRadioRow', 'getCurrentRecord', 'getRadioRecord', 'getCurrentColumn', 'setCurrentColumn', 'clearCurrentColumn', 'setPendingRow', 'togglePendingRow', 'hasPendingByRow', 'isPendingByRow', 'getPendingRecords', 'clearPendingRow', 'setFilterByEvent', 'sort', 'setSort', 'setSortByEvent', 'clearSort', 'clearSortByEvent', 'isSort', 'getSortColumns', 'closeFilter', 'isFilter', 'clearFilterByEvent', 'isActiveFilterByColumn', 'isRowExpandLoaded', 'clearRowExpandLoaded', 'reloadRowExpand', 'reloadRowExpand', 'toggleRowExpand', 'setAllRowExpand', 'setRowExpand', 'isExpandByRow', 'isRowExpandByRow', 'clearRowExpand', 'clearRowExpandReserve', 'getRowExpandRecords', 'getTreeExpandRecords', 'isTreeExpandLoaded', 'clearTreeExpandLoaded', 'reloadTreeExpand', 'reloadTreeChilds', 'toggleTreeExpand', 'setAllTreeExpand', 'setTreeExpand', 'isTreeExpandByRow', 'clearTreeExpand', 'clearTreeExpandReserve', 'getScroll', 'getScrollData', 'scrollTo', 'scrollToStartRow', 'scrollToEndRow', 'scrollToRow', 'scrollToStartColumn', 'scrollToEndColumn', 'scrollToColumn', 'clearScroll', 'updateFooter', 'updateStatus', 'setMergeCells', 'removeInsertRow', 'removeMergeCells', 'getMergeCells', 'setMergeHeaderCells', 'removeMergeHeaderCells', 'getMergeHeaderCells', 'clearMergeHeaderCells', 'clearMergeCells', 'setMergeFooterItems', 'removeMergeFooterItems', 'getMergeFooterItems', 'clearMergeFooterItems', 'setCustomStoreData', 'getCustomStoreData', 'setRowGroupExpand', 'setRowGroupExpandByField', 'setAllRowGroupExpand', 'clearRowGroupExpand', 'isRowGroupExpandByRow', 'isRowGroupRecord', 'isAggregateRecord', 'isAggregateExpandByRow', 'getAggregateContentByRow', 'getAggregateRowChildren', 'setRowGroups', 'clearRowGroups', 'openTooltip', 'moveColumnTo', 'moveRowTo', 'getCellLabel', 'updateCellLabel', 'clearFormatterCache', 'getFooterCellLabel', 'updateFooterCellLabel', 'clearFooterFormatterCache', 'getUpdateCells', 'undo', 'redo', 'effectCellData', 'getCellElement', 'focus', 'blur', 'connect', 'connectToolbar'];
function createReactData() {
var _a;
return {
tableLoading: false,
proxyInited: false,
isZMax: false,
tableData: [],
filterData: [],
formData: {},
sortData: [],
footerData: [],
tZindex: 0,
tablePage: {
total: 0,
pageSize: ((_a = getConfig().pager) === null || _a === void 0 ? void 0 : _a.pageSize) || 10,
currentPage: 1
}
};
}
function createInternalData() {
return {
uFoot: false
};
}
var VxeGridComponent = defineVxeComponent({
name: 'VxeGrid',
props: gridProps,
emits: gridEmits,
setup(props, context) {
const { slots, emit } = context;
const xID = XEUtils.uniqueId();
// 使用已安装的组件,如果未安装则不渲染
const VxeUIFormComponent = VxeUI.getComponent('VxeForm');
const VxeUIPagerComponent = VxeUI.getComponent('VxePager');
const defaultLayouts = [['Form'], ['Toolbar', 'Top', 'Table', 'Bottom', 'Pager']];
const { computeSize } = useFns.useSize(props);
const reactData = reactive(createReactData());
const internalData = createInternalData();
const refElem = ref();
const refTable = ref();
const refForm = ref();
const refToolbar = ref();
const refPager = ref();
const refPopupContainerElem = ref();
const refFormWrapper = ref();
const refToolbarWrapper = ref();
const refTopWrapper = ref();
const refBottomWrapper = ref();
const refPagerWrapper = ref();
const extendTableMethods = (methodKeys) => {
const funcs = {};
methodKeys.forEach(name => {
funcs[name] = (...args) => {
const $xeTable = refTable.value;
if ($xeTable && $xeTable[name]) {
return $xeTable[name](...args);
}
};
});
return funcs;
};
const gridExtendTableMethods = extendTableMethods(tableComponentMethodKeys);
tableComponentMethodKeys.forEach(name => {
gridExtendTableMethods[name] = (...args) => {
const $xeTable = refTable.value;
if ($xeTable && $xeTable[name]) {
return $xeTable && $xeTable[name](...args);
}
};
});
const computeProxyOpts = computed(() => {
return XEUtils.merge({}, XEUtils.clone(getConfig().grid.proxyConfig, true), props.proxyConfig);
});
const computeIsRespMsg = computed(() => {
const proxyOpts = computeProxyOpts.value;
return !!(XEUtils.isBoolean(proxyOpts.message) ? proxyOpts.message : proxyOpts.showResponseMsg);
});
const computeIsActiveMsg = computed(() => {
const proxyOpts = computeProxyOpts.value;
return XEUtils.isBoolean(proxyOpts.showActionMsg) ? proxyOpts.showActionMsg : !!proxyOpts.showActiveMsg;
});
const computePagerOpts = computed(() => {
return Object.assign({}, getConfig().grid.pagerConfig, props.pagerConfig);
});
const computeFormOpts = computed(() => {
return Object.assign({}, getConfig().grid.formConfig, props.formConfig);
});
const computeToolbarOpts = computed(() => {
return Object.assign({}, getConfig().grid.toolbarConfig, props.toolbarConfig);
});
const computeZoomOpts = computed(() => {
return Object.assign({}, getConfig().grid.zoomConfig, props.zoomConfig);
});
const computeStyles = computed(() => {
const { height, maxHeight } = props;
const { isZMax, tZindex } = reactData;
const stys = {};
if (isZMax) {
stys.zIndex = tZindex;
}
else {
if (height) {
stys.height = height === 'auto' || height === '100%' ? '100%' : toCssUnit(height);
}
if (maxHeight) {
stys.maxHeight = maxHeight === 'auto' || maxHeight === '100%' ? '100%' : toCssUnit(maxHeight);
}
}
return stys;
});
const computeTableExtendProps = computed(() => {
const rest = {};
tableComponentPropKeys.forEach((key) => {
if (props[key] !== undefined) {
rest[key] = props[key];
}
});
return rest;
});
const computeTableProps = computed(() => {
const { showFooter, seqConfig, pagerConfig, editConfig, proxyConfig } = props;
const { isZMax, tablePage, footerData } = reactData;
const tableExtendProps = computeTableExtendProps.value;
const proxyOpts = computeProxyOpts.value;
const pagerOpts = computePagerOpts.value;
const isLoading = computeIsLoading.value;
const tProps = Object.assign({}, tableExtendProps);
if (showFooter && !tProps.footerData) {
// 如果未设置自己的标位数据,则使用代理的
tProps.footerData = footerData;
}
else if (proxyOpts.footer && footerData.length) {
// 如果代理标为数据,且未请求到数据,则用自己的
tProps.footerData = footerData;
}
if (isZMax) {
if (tProps.maxHeight) {
tProps.maxHeight = '100%';
}
else {
tProps.height = '100%';
}
}
if (proxyConfig && isEnableConf(proxyOpts)) {
tProps.loading = isLoading;
if (pagerConfig && proxyOpts.seq && isEnableConf(pagerOpts)) {
tProps.seqConfig = Object.assign({}, seqConfig, { startIndex: (tablePage.currentPage - 1) * tablePage.pageSize });
}
}
if (editConfig) {
tProps.editConfig = Object.assign({}, editConfig);
}
return tProps;
});
const computeCurrLayoutConf = computed(() => {
const { layouts } = props;
let confs = [];
if (layouts && layouts.length) {
confs = layouts;
}
else {
confs = getConfig().grid.layouts || defaultLayouts;
}
let headKeys = [];
let bodyKeys = [];
let footKeys = [];
if (confs.length) {
if (XEUtils.isArray(confs[0])) {
headKeys = confs[0];
bodyKeys = (confs[1] || []);
footKeys = (confs[2] || []);
}
else {
bodyKeys = confs;
}
}
return {
headKeys,
bodyKeys,
footKeys
};
});
const computeCustomCurrentPageFlag = computed(() => {
const pagerOpts = computePagerOpts.value;
return pagerOpts.currentPage;
});
const computeCustomPageSizeFlag = computed(() => {
const pagerOpts = computePagerOpts.value;
return pagerOpts.pageSize;
});
const computeCustomTotalFlag = computed(() => {
const pagerOpts = computePagerOpts.value;
return pagerOpts.total;
});
const computePageCount = computed(() => {
const { tablePage } = reactData;
return Math.max(Math.ceil(tablePage.total / tablePage.pageSize), 1);
});
const computeIsLoading = computed(() => {
const { loading, proxyConfig } = props;
const { tableLoading } = reactData;
const proxyOpts = computeProxyOpts.value;
const { showLoading } = proxyOpts;
return loading || (tableLoading && showLoading && proxyConfig && isEnableConf(proxyOpts));
});
const refMaps = {
refElem,
refTable,
refForm,
refToolbar,
refPager,
refPopupContainerElem
};
const computeMaps = {
computeProxyOpts,
computePagerOpts,
computeFormOpts,
computeToolbarOpts,
computeZoomOpts
};
const $xeGrid = {
xID,
props: props,
context,
reactData,
internalData,
getRefMaps: () => refMaps,
getComputeMaps: () => computeMaps
};
const initToolbar = () => {
const toolbarOpts = computeToolbarOpts.value;
if (props.toolbarConfig && isEnableConf(toolbarOpts)) {
nextTick(() => {
const $xeTable = refTable.value;
const $xeToolbar = refToolbar.value;
if ($xeTable && $xeToolbar) {
$xeTable.connectToolbar($xeToolbar);
}
});
}
};
const getFormData = () => {
const { proxyConfig } = props;
const { formData } = reactData;
const proxyOpts = computeProxyOpts.value;
const formOpts = computeFormOpts.value;
return proxyConfig && isEnableConf(proxyOpts) && proxyOpts.form ? formData : formOpts.data;
};
const initPages = (propKey) => {
const { tablePage } = reactData;
const { pagerConfig } = props;
const pagerOpts = computePagerOpts.value;
if (pagerConfig && isEnableConf(pagerOpts)) {
if (propKey) {
if (pagerOpts[propKey]) {
tablePage[propKey] = XEUtils.toNumber(pagerOpts[propKey]);
}
}
else {
const { currentPage, pageSize, total } = pagerOpts;
if (currentPage) {
tablePage.currentPage = currentPage;
}
if (pageSize) {
tablePage.pageSize = pageSize;
}
if (total) {
tablePage.total = total;
}
}
}
};
const triggerPendingEvent = (code) => {
const isActiveMsg = computeIsActiveMsg.value;
const $xeTable = refTable.value;
const selectRecords = $xeTable ? $xeTable.getCheckboxRecords() : [];
if (selectRecords.length) {
if ($xeTable) {
$xeTable.togglePendingRow(selectRecords);
}
$xeGrid.clearCheckboxRow();
}
else {
if (isActiveMsg) {
if (VxeUI.modal) {
VxeUI.modal.message({ id: code, content: getI18n('vxe.grid.selectOneRecord'), status: 'warning' });
}
}
}
};
const getRespMsg = (rest, defaultMsg) => {
const proxyOpts = computeProxyOpts.value;
const resConfigs = proxyOpts.response || proxyOpts.props || {};
const messageProp = resConfigs.message;
const $xeTable = refTable.value;
let msg;
if (rest && messageProp) {
msg = XEUtils.isFunction(messageProp) ? messageProp({ data: rest, $table: $xeTable, $grid: $xeGrid, $gantt: null }) : XEUtils.get(rest, messageProp);
}
return msg || getI18n(defaultMsg);
};
const handleDeleteRow = (code, alertKey, callback) => {
const isActiveMsg = computeIsActiveMsg.value;
const selectRecords = $xeGrid.getCheckboxRecords();
if (isActiveMsg) {
if (selectRecords.length) {
if (VxeUI.modal) {
return VxeUI.modal.confirm({ id: `cfm_${code}`, content: getI18n(alertKey), escClosable: true }).then((type) => {
if (type === 'confirm') {
return callback();
}
});
}
}
else {
if (VxeUI.modal) {
VxeUI.modal.message({ id: `msg_${code}`, content: getI18n('vxe.grid.selectOneRecord'), status: 'warning' });
}
}
}
else {
if (selectRecords.length) {
callback();
}
}
return Promise.resolve();
};
const pageChangeEvent = (params) => {
const { proxyConfig } = props;
const { tablePage } = reactData;
const { $event, currentPage, pageSize } = params;
const proxyOpts = computeProxyOpts.value;
tablePage.currentPage = currentPage;
tablePage.pageSize = pageSize;
$xeGrid.dispatchEvent('page-change', params, $event);
if (proxyConfig && isEnableConf(proxyOpts)) {
$xeGrid.commitProxy('query').then((rest) => {
$xeGrid.dispatchEvent('proxy-query', rest, $event);
});
}
};
const handleSortEvent = (params) => {
const $xeTable = refTable.value;
const { proxyConfig } = props;
if (!$xeTable) {
return;
}
const { computeSortOpts } = $xeTable.getComputeMaps();
const proxyOpts = computeProxyOpts.value;
const sortOpts = computeSortOpts.value;
// 如果是服务端排序
if (sortOpts.remote) {
reactData.sortData = params.sortList;
if (proxyConfig && isEnableConf(proxyOpts)) {
reactData.tablePage.currentPage = 1;
$xeGrid.commitProxy('query').then((rest) => {
$xeGrid.dispatchEvent('proxy-query', rest, params.$event);
});
}
}
};
const sortChangeEvent = (params) => {
handleSortEvent(params);
$xeGrid.dispatchEvent('sort-change', params, params.$event);
};
const clearAllSortEvent = (params) => {
handleSortEvent(params);
$xeGrid.dispatchEvent('clear-all-sort', params, params.$event);
};
const handleFilterEvent = (params) => {
const $xeTable = refTable.value;
const { proxyConfig } = props;
if (!$xeTable) {
return;
}
const { computeFilterOpts } = $xeTable.getComputeMaps();
const proxyOpts = computeProxyOpts.value;
const filterOpts = computeFilterOpts.value;
// 如果是服务端过滤
if (filterOpts.remote) {
reactData.filterData = params.filterList;
if (proxyConfig && isEnableConf(proxyOpts)) {
reactData.tablePage.currentPage = 1;
internalData.uFoot = true;
$xeGrid.commitProxy('query').then((rest) => {
$xeGrid.dispatchEvent('proxy-query', rest, params.$event);
});
internalData.uFoot = false;
updateQueryFooter();
}
}
};
const filterChangeEvent = (params) => {
handleFilterEvent(params);
$xeGrid.dispatchEvent('filter-change', params, params.$event);
};
const clearAllFilterEvent = (params) => {
handleFilterEvent(params);
$xeGrid.dispatchEvent('clear-all-filter', params, params.$event);
};
const submitFormEvent = (params) => {
const { proxyConfig } = props;
const proxyOpts = computeProxyOpts.value;
if (reactData.tableLoading) {
return;
}
if (proxyConfig && isEnableConf(proxyOpts)) {
$xeGrid.dispatchEvent('form-submit', params, params.$event);
internalData.uFoot = true;
$xeGrid.commitProxy('reload').then((rest) => {
$xeGrid.dispatchEvent('proxy-query', Object.assign(Object.assign({}, rest), { isReload: true }), params.$event);
});
internalData.uFoot = false;
updateQueryFooter();
}
else {
$xeGrid.dispatchEvent('form-submit', params, params.$event);
}
};
const resetFormEvent = (params) => {
const $xeTable = refTable.value;
const { proxyConfig } = props;
const { $event } = params;
const proxyOpts = computeProxyOpts.value;
if (proxyConfig && isEnableConf(proxyOpts)) {
$xeGrid.dispatchEvent('form-reset', params, $event);
if ($xeTable) {
$xeTable.clearScroll();
}
internalData.uFoot = true;
$xeGrid.commitProxy('reload').then((rest) => {
$xeGrid.dispatchEvent('proxy-query', Object.assign(Object.assign({}, rest), { isReload: true }), $event);
});
internalData.uFoot = false;
updateQueryFooter();
}
else {
$xeGrid.dispatchEvent('form-reset', params, $event);
}
};
const submitInvalidEvent = (params) => {
$xeGrid.dispatchEvent('form-submit-invalid', params, params.$event);
};
const collapseEvent = (params) => {
const { $event } = params;
$xeGrid.dispatchEvent('form-toggle-collapse', params, $event);
$xeGrid.dispatchEvent('form-collapse', params, $event);
};
const handleZoom = (isMax) => {
const { isZMax } = reactData;
if (isMax ? !isZMax : isZMax) {
reactData.isZMax = !isZMax;
if (reactData.tZindex < getLastZIndex()) {
reactData.tZindex = nextZIndex();
}
}
return nextTick()
.then(() => $xeGrid.recalculate(true))
.then(() => {
setTimeout(() => $xeGrid.recalculate(true), 15);
return reactData.isZMax;
});
};
const getFuncSlot = (optSlots, slotKey) => {
const funcSlot = optSlots[slotKey];
if (funcSlot) {
if (XEUtils.isString(funcSlot)) {
if (slots[funcSlot]) {
return slots[funcSlot];
}
else {
errLog('vxe.error.notSlot', [funcSlot]);
}
}
else {
return funcSlot;
}
}
return null;
};
const getConfigSlot = (slotConfigs) => {
const slotConf = {};
XEUtils.objectMap(slotConfigs, (slotFunc, slotKey) => {
if (slotFunc) {
if (XEUtils.isString(slotFunc)) {
if (slots[slotFunc]) {
slotConf[slotKey] = slots[slotFunc];
}
else {
errLog('vxe.error.notSlot', [slotFunc]);
}
}
else {
slotConf[slotKey] = slotFunc;
}
}
});
return slotConf;
};
/**
* 渲染表单
*/
const renderForm = () => {
const { formConfig, proxyConfig } = props;
const { formData } = reactData;
const proxyOpts = computeProxyOpts.value;
const formOpts = computeFormOpts.value;
if ((formConfig && isEnableConf(formOpts)) || slots.form) {
let slotVNs = [];
if (slots.form) {
slotVNs = slots.form({ $grid: $xeGrid, $gantt: null });
}
else {
if (formOpts.items) {
const formSlots = {};
if (!formOpts.inited) {
formOpts.inited = true;
const beforeItem = proxyOpts.beforeItem;
if (proxyOpts && beforeItem) {
formOpts.items.forEach((item) => {
beforeItem({ $grid: $xeGrid, $gantt: null, item });
});
}
}
// 处理插槽
formOpts.items.forEach((item) => {
XEUtils.each(item.slots, (func) => {
if (!XEUtils.isFunction(func)) {
if (slots[func]) {
formSlots[func] = slots[func];
}
}
});
});
if (VxeUIFormComponent) {
slotVNs.push(h(VxeUIFormComponent, Object.assign(Object.assign({ ref: refForm }, Object.assign({}, formOpts, {
data: proxyConfig && isEnableConf(proxyOpts) && proxyOpts.form ? formData : formOpts.data
})), { onSubmit: submitFormEvent, onReset: resetFormEvent, onSubmitInvalid: submitInvalidEvent, onCollapse: collapseEvent }), formSlots));
}
}
}
return h('div', {
ref: refFormWrapper,
key: 'form',
class: 'vxe-grid--form-wrapper'
}, slotVNs);
}
return renderEmptyElement($xeGrid);
};
/**
* 渲染工具栏
*/
const renderToolbar = () => {
const { toolbarConfig } = props;
const toolbarOpts = computeToolbarOpts.value;
const toolbarSlot = slots.toolbar;
if ((toolbarConfig && isEnableConf(toolbarOpts)) || toolbarSlot) {
let slotVNs = [];
if (toolbarSlot) {
slotVNs = toolbarSlot({ $grid: $xeGrid, $gantt: null });
}
else {
const toolbarOptSlots = toolbarOpts.slots;
const toolbarSlots = {};
if (toolbarOptSlots) {
const buttonsSlot = getFuncSlot(toolbarOptSlots, 'buttons');
const buttonPrefixSlot = getFuncSlot(toolbarOptSlots, 'buttonPrefix');
const buttonSuffixSlot = getFuncSlot(toolbarOptSlots, 'buttonSuffix');
const toolsSlot = getFuncSlot(toolbarOptSlots, 'tools');
const toolPrefixSlot = getFuncSlot(toolbarOptSlots, 'toolPrefix');
const toolSuffixSlot = getFuncSlot(toolbarOptSlots, 'toolSuffix');
if (buttonsSlot) {
toolbarSlots.buttons = buttonsSlot;
}
if (buttonPrefixSlot) {
toolbarSlots.buttonPrefix = buttonPrefixSlot;
}
if (buttonSuffixSlot) {
toolbarSlots.buttonSuffix = buttonSuffixSlot;
}
if (toolsSlot) {
toolbarSlots.tools = toolsSlot;
}
if (toolPrefixSlot) {
toolbarSlots.toolPrefix = toolPrefixSlot;
}
if (toolSuffixSlot) {
toolbarSlots.toolSuffix = toolSuffixSlot;
}
}
slotVNs.push(h(VxeToolbarComponent, Object.assign(Object.assign({ ref: refToolbar }, toolbarOpts), { slots: undefined }), toolbarSlots));
}
return h('div', {
ref: refToolbarWrapper,
key: 'toolbar',
class: 'vxe-grid--toolbar-wrapper'
}, slotVNs);
}
return renderEmptyElement($xeGrid);
};
/**
* 渲染表格顶部区域
*/
const renderTop = () => {
const topSlot = slots.top;
if (topSlot) {
return h('div', {
ref: refTopWrapper,
key: 'top',
class: 'vxe-grid--top-wrapper'
}, topSlot({ $grid: $xeGrid, $gantt: null }));
}
return renderEmptyElement($xeGrid);
};
const renderTableLeft = () => {
const leftSlot = slots.left;
if (leftSlot) {
return h('div', {
class: 'vxe-grid--left-wrapper'
}, leftSlot({ $grid: $xeGrid, $gantt: null }));
}
return renderEmptyElement($xeGrid);
};
const renderTableRight = () => {
const rightSlot = slots.right;
if (rightSlot) {
return h('div', {
class: 'vxe-grid--right-wrapper'
}, rightSlot({ $grid: $xeGrid, $gantt: null }));
}
return renderEmptyElement($xeGrid);
};
/**
* 渲染表格
*/
const renderTable = () => {
const { proxyConfig } = props;
const tableProps = computeTableProps.value;
const proxyOpts = computeProxyOpts.value;
const tableOns = Object.assign({}, tableCompEvents);
const emptySlot = slots.empty;
const loadingSlot = slots.loading;
const rowDragIconSlot = slots.rowDragIcon || slots['row-drag-icon'];
const columnDragIconSlot = slots.columnDragIcon || slots['column-drag-icon'];
const headerTooltipSlot = slots.headerTooltip || slots['header-tooltip'];
const tooltipSlot = slots.tooltip;
const footerTooltipSlot = slots.footerTooltip || slots['footer-tooltip'];
if (proxyConfig && isEnableConf(proxyOpts)) {
if (proxyOpts.sort) {
tableOns.onSortChange = sortChangeEvent;
tableOns.onClearAllSort = clearAllSortEvent;
}
if (proxyOpts.filter) {
tableOns.onFilterChange = filterChangeEvent;
tableOns.onClearAllFilter = clearAllFilterEvent;
}
}
const slotObj = {};
if (emptySlot) {
slotObj.empty = emptySlot;
}
if (loadingSlot) {
slotObj.loading = loadingSlot;
}
if (rowDragIconSlot) {
slotObj.rowDragIcon = rowDragIconSlot;
}
if (columnDragIconSlot) {
slotObj.columnDragIcon = columnDragIconSlot;
}
if (headerTooltipSlot) {
slotObj.headerTooltip = headerTooltipSlot;
}
if (tooltipSlot) {
slotObj.tooltip = tooltipSlot;
}
if (footerTooltipSlot) {
slotObj.footerTooltip = footerTooltipSlot;
}
return h('div', {
class: 'vxe-grid--table-wrapper'
}, [
h(VxeTableComponent, Object.assign(Object.assign({ ref: refTable }, tableProps), tableOns), slotObj)
]);
};
/**
* 渲染表格底部区域
*/
const renderBottom = () => {
if (slots.bottom) {
return h('div', {
ref: refBottomWrapper,
key: 'bottom',
class: 'vxe-grid--bottom-wrapper'
}, slots.bottom({ $grid: $xeGrid, $gantt: null }));
}
return renderEmptyElement($xeGrid);
};
/**
* 渲染分页
*/
const renderPager = () => {
const { proxyConfig, pagerConfig } = props;
const proxyOpts = computeProxyOpts.value;
const pagerOpts = computePagerOpts.value;
const pagerSlot = slots.pager;
if ((pagerConfig && isEnableConf(pagerOpts)) || slots.pager) {
return h('div', {
ref: refPagerWrapper,
key: 'pager',
class: 'vxe-grid--pager-wrapper'
}, pagerSlot
? pagerSlot({ $grid: $xeGrid, $gantt: null })
: [
VxeUIPagerComponent
? h(VxeUIPagerComponent, Object.assign(Object.assign(Object.assign({ ref: refPager }, pagerOpts), (proxyConfig && isEnableConf(proxyOpts) ? reactData.tablePage : {})), { onPageChange: pageChangeEvent }), getConfigSlot(pagerOpts.slots))
: renderEmptyElement($xeGrid)
]);
}
return renderEmptyElement($xeGrid);
};
const renderChildLayout = (layoutKeys) => {
const childVNs = [];
layoutKeys.forEach(key => {
switch (key) {
case 'Form':
childVNs.push(renderForm());
break;
case 'Toolbar':
childVNs.push(renderToolbar());
break;
case 'Top':
childVNs.push(renderTop());
break;
case 'Table':
childVNs.push(h('div', {
key: 'table',
class: 'vxe-grid--table-container'
}, [
renderTableLeft(),
renderTable(),
renderTableRight()
]));
break;
case 'Bottom':
childVNs.push(renderBottom());
break;
case 'Pager':
childVNs.push(renderPager());
break;
default:
errLog('vxe.error.notProp', [`layouts -> ${key}`]);
break;
}
});
return childVNs;
};
const renderLayout = () => {
const currLayoutConf = computeCurrLayoutConf.value;
const { headKeys, bodyKeys, footKeys } = currLayoutConf;
const asideLeftSlot = slots.asideLeft || slots['aside-left'];
const asideRightSlot = slots.asideRight || slots['aside-right'];
return [
h('div', {
class: 'vxe-grid--layout-header-wrapper'
}, renderChildLayout(headKeys)),
h('div', {
class: 'vxe-grid--layout-body-wrapper'
}, [
asideLeftSlot
? h('div', {
class: 'vxe-grid--layout-aside-left-wrapper'
}, asideLeftSlot({}))
: renderEmptyElement($xeGrid),
h('div', {
class: 'vxe-grid--layout-body-content-wrapper'
}, renderChildLayout(bodyKeys)),
asideRightSlot
? h('div', {
class: 'vxe-grid--layout-aside-right-wrapper'
}, asideRightSlot({}))
: renderEmptyElement($xeGrid)
]),
h('div', {
class: 'vxe-grid--layout-footer-wrapper'
}, renderChildLayout(footKeys)),
h('div', {
ref: refPopupContainerElem
})
];
};
const tableCompEvents = {};
tableEmits.forEach(name => {
const type = XEUtils.camelCase(`on-${name}`);
tableCompEvents[type] = (...args) => emit(name, ...args);
});
const getDefaultFormData = () => {
const formOpts = computeFormOpts.value;
if (formOpts.items) {
const fData = {};
formOpts.items.forEach(item => {
const { field, itemRender } = item;
if (field) {
let itemValue = null;
if (itemRender) {
const { startField, endField, defaultValue } = itemRender;
if (XEUtils.isFunction(defaultValue)) {
itemValue = defaultValue({ item });
}
else if (!XEUtils.isUndefined(defaultValue)) {
itemValue = defaultValue;
}
if (startField && endField) {
XEUtils.set(fData, startField, null);
XEUtils.set(fData, endField, null);
}
}
fData[field] = itemValue;
}
});
return fData;
}
return {};
};
const initProxy = () => {
const { proxyConfig, formConfig } = props;
const { proxyInited } = reactData;
const proxyOpts = computeProxyOpts.value;
const formOpts = computeFormOpts.value;
if (proxyConfig && isEnableConf(proxyOpts)) {
if (formConfig && isEnableConf(formOpts) && proxyOpts.form && formOpts.items) {
reactData.formData = getDefaultFormData();
}
if (!proxyInited) {
reactData.proxyInited = true;
if (proxyOpts.autoLoad !== false) {
nextTick().then(() => {
internalData.uFoot = true;
const rest = $xeGrid.commitProxy('initial');
internalData.uFoot = false;
updateQueryFooter();
return rest;
}).then((rest) => {
dispatchEvent('proxy-query', Object.assign(Object.assign({}, rest), { isInited: true }), new Event('initial'));
});
}
}
}
};
const updateQueryFooter = () => {
const proxyOpts = computeProxyOpts.value;
const { ajax } = proxyOpts;
if (ajax && ajax.queryFooter) {
return $xeGrid.commitProxy('queryFooter');
}
};
const handleGlobalKeydownEvent = (evnt) => {
const zoomOpts = computeZoomOpts.value;
const isEsc = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ESCAPE);
if (isEsc && reactData.isZMax && zoomOpts.escRestore !== false) {
$xeGrid.triggerZoomEvent(evnt);
}
};
const dispatchEvent = (type, params, evnt) => {
emit(type, createEvent(evnt, { $grid: $xeGrid, $gantt: null }, params));
};
const gridMethods = {
dispatchEvent,
getEl() {
return refElem.value;
},
/**
* 提交指令,支持 code 或 button
* @param {String/Object} code 字符串或对象
*/
commitProxy(proxyTarget, ...args) {
const { showFooter, proxyConfig, toolbarConfig, pagerConfig, editRules, validConfig } = props;
const { tablePage } = reactData;
const isActiveMsg = computeIsActiveMsg.value;
const isRespMsg = computeIsRespMsg.value;
const proxyOpts = computeProxyOpts.value;
const pagerOpts = computePagerOpts.value;
const toolbarOpts = computeToolbarOpts.value;
const { beforeQuery: oldBeforeQuery, afterQuery: oldAfterQuery, beforeQueryFooter: oldBeforeQueryFooter, afterQueryFooter: oldAfterQueryFooter, beforeDelete: oldBeforeDelete, afterDelete: oldAfterDelete, beforeSave: oldBeforeSave, afterSave: oldAfterSave, ajax = {} } = proxyOpts;
const resConfigs = (proxyOpts.response || proxyOpts.props || {});
const $xeTable = refTable.value;
if (!$xeTable) {
return nextTick();
}
let formData = getFormData();
let button = null;
let code = null;
if (XEUtils.isString(proxyTarget)) {
const { buttons } = toolbarOpts;
const matchObj = toolbarConfig && isEnableConf(toolbarOpts) && buttons ? XEUtils.findTree(buttons, (item) => item.code === proxyTarget, { children: 'dropdowns' }) : null;
button = matchObj ? matchObj.item : null;
code = proxyTarget;
}
else {
button = proxyTarget;
code = button.code;
}
const btnParams = button ? button.params : null;
switch (code) {
case 'insert':
return $xeTable.insert({});
case 'insert_edit':
return $xeTable.insert({}).then(({ row }) => $xeTable.setEditRow(row, true));
// 已废弃
case 'insert_actived':
return $xeTable.insert({}).then(({ row }) => $xeTable.setEditRow(row, true));
// 已废弃
case 'mark_cancel':
triggerPendingEvent(code);
break;
case 'remove':
return handleDeleteRow(code, 'vxe.grid.removeSelectRecord', () => $xeTable.removeCheckboxRow());
case 'import':
$xeTable.importData(btnParams);
break;
case 'open_import':
$xeTable.openImport(btnParams);
break;
case 'export':
$xeTable.exportData(btnParams);
break;
case 'open_export':
$xeTable.openExport(btnParams);
break;
case 'reset_custom':
return $xeTable.resetCustom(true);
case 'initial':
case 'reload':
case 'query': {
const bqMethod = ajax.beforeQuery;
const qMethod = ajax.query;
const aqMethod = ajax.afterQuery;
const qsMethod = ajax.querySuccess;
const qeMethod = ajax.queryError;
if (qMethod) {
const isInited = code === 'initial';
const isReload = code === 'reload';
if (!isInited && reactData.tableLoading) {
return nextTick();
}
let operPromise = null;
let sortList = [];
let filterList = [];
let pageParams = {};
if (pagerConfig) {
if (isInited || isReload) {
// 重置分页
tablePage.currentPage = 1;
}
if (isEnableConf(pagerOpts)) {
pageParams = Object.assign({}, tablePage);
}
}
if (isInited) {
// 重置代理表单数据
if (proxyConfig && isEnableConf(proxyOpts) && proxyOpts.form) {
formData = getDefaultFormData();
reactData.formData = formData;
}
if ($xeTable) {
const tableInternalData = $xeTable.internalData;
const { tableFullColumn, fullColumnFieldData } = tableInternalData;
const { computeSortOpts } = $xeTable.getComputeMaps();
const sortOpts = computeSortOpts.value;
let defaultSort = sortOpts.defaultSort;
tableFullColumn.forEach((column) => {
column.order = null;
});
// 如果使用默认排序
if (defaultSort) {
if (!XEUtils.isArray(defaultSort)) {
defaultSort = [defaultSort];
}
sortList = defaultSort.map((item) => {
const { field, order } = item;
const colRest = fullColumnFieldData[field];
if (colRest) {
const column = colRest.column;
if (column) {
column.order = order;
}
}
return {
field,
property: field,
order
};
});
}
filterList = $xeTable.getCheckedFilters();
}
}
else {
if ($xeTable) {
if (isReload) {
operPromise = $xeTable.clearAll();
}
else {
sortList = $xeTable.getSortColumns();
filterList = $xeTable.getCheckedFilters();
}
}
}
const commitParams = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: null,
code,
button,
isInited,
isReload,
page: pageParams,
sort: sortList.length ? sortList[0] : {},
sorts: sortList,
filters: filterList,
form: formData,
options: qMethod
};
const handleQuery = () => {
reactData.sortData = sortList;
reactData.filterData = filterList;
reactData.tableLoading = true;
return Promise.all([
Promise.resolve((oldBeforeQuery || qMethod)(commitParams, ...args)),
operPromise
]).then(([rest]) => {
reactData.tableLoading = false;
if (aqMethod) {
aqMethod(Object.assign(Object.assign({}, commitParams), { response: rest, status: 'success' }), ...args);
}
else {
let tableData = [];
if (rest) {
const listProp = resConfigs.list;
const resultProp = resConfigs.result;
const reParams = { data: rest, $table: $xeTable, $grid: $xeGrid, $gantt: null };
if (pagerConfig && isEnableConf(pagerOpts)) {
const totalProp = resConfigs.total;
const total = (XEUtils.isFunction(totalProp) ? totalProp(reParams) : XEUtils.get(rest, totalProp || 'page.total')) || 0;
tablePage.total = XEUtils.toNumber(total);
tableData = (XEUtils.isFunction(resultProp) ? resultProp(reParams) : XEUtils.get(rest, resultProp || 'result')) || [];
// 检验当前页码,不能超出当前最大页数
const pageCount = Math.max(Math.ceil(total / tablePage.pageSize), 1);
if (tablePage.currentPage > pageCount) {
tablePage.currentPage = pageCount;
}
}
else {
if (XEUtils.isArray(rest)) {
tableData = rest;
}
else if (listProp) {
tableData = (XEUtils.isFunction(listProp) ? listProp(reParams) : XEUtils.get(rest, listProp)) || [];
}
}
if (showFooter) {
const fdProp = resConfigs.footerData;
const footerList = fdProp ? (XEUtils.isFunction(fdProp) ? fdProp(reParams) : XEUtils.get(rest, fdProp)) : [];
if (XEUtils.isArray(footerList)) {
reactData.footerData = footerList;
}
}
}
if ($xeTable) {
$xeTable.loadData(tableData);
}
else {
nextTick(() => {
const $xeTable = refTable.value;
if ($xeTable) {
$xeTable.loadData(tableData);
}
});
}
if (oldAfterQuery) {
oldAfterQuery(Object.assign(Object.assign({}, commitParams), { response: rest }), ...args);
}
}
if (qsMethod) {
qsMethod(Object.assign(Object.assign({}, commitParams), { response: rest }));
}
return { status: true };
}).catch((rest) => {
reactData.tableLoading = false;
if (aqMethod) {
aqMethod(Object.assign(Object.assign({}, commitParams), { response: rest, status: 'error' }), ...args);
}
if (qeMethod) {
qeMethod(Object.assign(Object.assign({}, commitParams), { response: rest }));
}
return { status: false };
});
};
if (bqMethod) {
return Promise.resolve(bqMethod(commitParams, ...args)).then(status => {
if (status !== false) {
return handleQuery();
}
});
}
return handleQuery();
}
else {
errLog('vxe.error.notFunc', ['proxy-config.ajax.query']);
}
break;
}
case 'queryFooter': {
const bqfMethod = ajax.beforeQueryFooter;
const qfMethod = ajax.queryFooter;
const aqfMethod = ajax.afterQueryFooter;
const qfSuccessMethod = ajax.queryFooterSuccess;
const qfErrorMethod = ajax.queryFooterError;
if (qfMethod) {
let filterList = [];
if ($xeTable) {
filterList = $xeTable.getCheckedFilters();
}
let pageParams = {};
if (pagerConfig) {
if (isEnableConf(pagerOpts)) {
pageParams = Object.assign({}, tablePage);
}
}
const commitParams = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: null,
code,
button,
page: pageParams,
filters: filterList,
form: formData,
options: qfMethod
};
const handleQueryFooter = () => {
return Promise.resolve((oldBeforeQueryFooter || qfMethod)(commitParams, ...args)).then(rest => {
if (aqfMethod) {
aqfMethod(Object.assign(Object.assign({}, commitParams), { response: rest, status: 'success' }), ...args);
}
else {
reactData.footerData = XEUtils.isArray(rest) ? rest : [];
if (oldAfterQueryFooter) {
oldAfterQueryFooter(Object.assign(Object.assign({}, commitParams), { response: rest }), ...args);
}
}
if (qfSuccessMethod) {
qfSuccessMethod(Object.assign(Object.assign({}, commitParams), { response: rest }));
}
return { status: true };
}).catch((rest) => {
if (aqfMethod) {
aqfMethod(Object.assign(Object.assign({}, commitParams), { response: rest, status: 'error' }), ...args);
}
if (qfErrorMethod) {
qfErrorMethod(Object.assign(Object.assign({}, commitParams), { response: rest }));
}
return { status: false };
});
};
if (bqfMethod) {
return Promise.resolve(bqfMethod(commitParams, ...args)).then(status => {
if (status !== false) {
return handleQueryFooter();
}
});
}
return handleQueryFooter();
}
else {
errLog('vxe.error.notFunc', ['proxy-config.ajax.queryFooter']);
}
break;
}
case 'delete': {
const bdMethod = ajax.beforeDelete;
const dMethod = ajax.delete;
const adMethod = ajax.afterDelete;
const deleteSuccessMethods = ajax.deleteSuccess;
const deleteErrorMethods = ajax.deleteError;
if (dMethod) {
const selectRecords = $xeGrid.getCheckboxRecords();
const removeRecords = selectRecords.filter(row => !$xeTable.isInsertByRow(row));
const body = { removeRecords };
const commitParams = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: null,
code,
button,
body,
form: formData,
options: dMethod
};
if (selectRecords.length) {
return handleDeleteRow(code, 'vxe.grid.deleteSelectRecord', () => {
if (!removeRecords.length) {
return $xeTable.remove(selectRecords);
}
const handleDelete = () => {
reactData.tableLoading = true;
return Promise.resolve((oldBeforeDelete || dMethod)(commitParams, ...args))
.then(rest => {
reactData.tableLoading = false;
if (adMethod) {
adMethod(Object.assign(Object.assign({}, commitParams), { response: rest, status: 'success' }), ...args);
}
else {
$xeTable.setPendingRow(removeRecords, false);
if (isRespMsg) {
if (VxeUI.modal) {
VxeUI.modal.message({ content: getRespMsg(rest, 'vxe.grid.delSuccess'), status: 'success' });
}
}
if (oldAfterDelete) {
oldAfterDelete(Object.assign(Object.assign({}, commitParams), { response: rest }), ...args);
}
else {
internalData.uFoot = true;
$xeGrid.commitProxy('query');
internalData.uFoot = false;
updateQueryFooter();
}
}
if (deleteSuccessMethods) {
deleteSuccessMethods(Object.assign(Object.assign({}, commitParams), { response: rest }));
}
return { status: true };
})
.catch(rest => {
reactData.tableLoading = false;
if (adMethod) {
adMethod(Object.assign(Object.assign({}, commitParams), { response: rest, status: 'error' }), ...args);
}
else {
if (isRespMsg) {
if (VxeUI.modal) {
VxeUI.modal.message({ id: code, content: getRespMsg(rest, 'vxe.grid.operError'), status: 'error' });
}
}
}
if (deleteErrorMethods) {
deleteErrorMethods(Object.assign(Object.assign({}, commitParams), { response: rest }));
}
return { status: false };
});
};
if (bdMethod) {
return Promise.resolve(bdMethod(commitParams, ...args)).then(status => {
if (status !== false) {
return handleDelete();
}
});
}
return handleDelete();
});
}
else {
if (isActiveMsg) {
if (VxeUI.modal) {
VxeUI.modal.message({ id: code, content: getI18n('vxe.grid.selectOneRecord'), status: 'warning' });
}
}
}
}
else {
errLog('vxe.error.notFunc', ['proxy-config.ajax.delete']);
}
break;
}
case 'save': {
const bSaveMethod = ajax.beforeSave;
const sMethod = ajax.save;
const aSaveMethod = ajax.afterSave;
const sSuccessMethod = ajax.saveSuccess;
const sErrorMethod = ajax.saveError;
if (sMethod) {
const body = $xeTable.getRecordset();
const { insertRecords, removeRecords, updateRecords, pendingRecords } = body;
const commitParams = {
$table: $xeTable,
$grid: $xeGrid,
$gantt: null,
code,
button,
body,
form: formData,
options: sMethod
};
// 排除掉新增且标记为删除的数据
if (insertRecords.length) {
body.pendingRecords = pendingRecords.filter((row) => $xeTable.findRowIndexOf(insertRecords, row) === -1);
}
// 排除已标记为删除的数据
if (pendingRecords.length) {
body.insertRecords = insertRecords.filter((row) => $xeTable.findRowIndexOf(pendingRecords, row) === -1);
}
let restPromise = Promise.resolve();
if (editRules) {
// 只校验新增和修改的数据
restPromise = $xeTable[validConfig && validConfig.msgMode === 'full' ? 'fullValidate' : 'validate'](body.insertRecords.concat(updateRecords));
}
return restPromise.then((errMap) => {
if (errMap) {
// 如果校验不通过
return;
}
if (body.insertRecords.length || removeRecords.length || updateRecords.length || body.pendingRecords.length) {
const handleSave = () => {
reactData.tableLoading = true;
return Promise.resolve((oldBeforeSave || sMethod)(commitParams, ...args))
.then(rest => {
reactData.tableLoading = false;
if (aSaveMethod) {
aSaveMethod(Object.assign(Object.assign({}, commitParams), { response: rest, status: 'success' }), ...args);
}
else {
$xeTable.clearPendingRow();
if (isRespMsg) {
if (VxeUI.modal) {
VxeUI.modal.message({ content: getRespMsg(rest, 'vxe.grid.saveSuccess'), status: 'success' });
}
}
if (oldAfterSave) {
oldAfterSave(Object.assign(Object.assign({}, commitParams), { response: rest }), ...args);
}
else {
internalData.uFoot = true;
$xeGrid.commitProxy('query');
internalData.uFoot = false;
updateQueryFooter();
}
}
if (sSuccessMethod) {
sSuccessMethod(Object.assign(Object.assign({}, commitParams), { response: rest }));
}
return { status: true };
})
.catch(rest => {
reactData.tableLoading = false;
if (aSaveMethod) {
aSaveMethod(Object.assign(Object.assign({}, commitParams), { response: rest, status: 'error' }), ...args);
}
else {
if (isRespMsg) {
if (VxeUI.modal) {
VxeUI.modal.message({ id: code, content: getRespMsg(rest, 'vxe.grid.operError'), status: 'error' });
}
}
}
if (sErrorMethod) {
sErrorMethod(Object.assign(Object.assign({}, commitParams), { response: rest }));
}
return { status: false };
});
};
if (bSaveMethod) {
return Promise.resolve(bSaveMethod(commitParams, ...args)).then(status => {
if (status !== false) {
return handleSave();
}
});
}
return handleSave();
}
else {
if (isActiveMsg) {
if (VxeUI.modal) {
VxeUI.modal.message({ id: code, content: getI18n('vxe.grid.dataUnchanged'), status: 'info' });
}
}
}
});
}
else {
errLog('vxe.error.notFunc', ['proxy-config.ajax.save']);
}
break;
}
default: {
const gCommandOpts = commands.get(code);
if (gCommandOpts) {
const tCommandMethod = gCommandOpts.tableCommandMethod || gCommandOpts.commandMethod;
if (tCommandMethod) {
tCommandMethod({ code, button, $grid: $xeGrid, $table: $xeTable, $gantt: null }, ...args);
}
else {
errLog('vxe.error.notCommands', [code]);
}
}
}
}
return nextTick();
},
getParams() {
return props.params;
},
zoom() {
if (reactData.isZMax) {
return $xeGrid.revert();
}
return $xeGrid.maximize();
},
isMaximized() {
return reactData.isZMax;
},
maximize() {
return handleZoom(true);
},
revert() {
return handleZoom();
},
getFormData,
getFormItems(itemIndex) {
const formOpts = computeFormOpts.value;
const { formConfig } = props;
const { items } = formOpts;
const itemList = [];
XEUtils.eachTree(formConfig && isEnableConf(formOpts) && items ? items : [], item => {
itemList.push(item);
}, { children: 'children' });
return XEUtils.isUndefined(itemIndex) ? itemList : itemList[itemIndex];
},
resetForm() {
const $form = refForm.value;
if ($form) {
return $form.reset();
}
return nextTick();
},
validateForm() {
const $form = refForm.value;
if ($form) {
return $form.validate();
}
return nextTick();
},
validateFormField(field) {
const $form = refForm.value;
if ($form) {
return $form.validateField(field);
}
return nextTick();
},
clearFormValidate(field) {
const $form = refForm.value;
if ($form) {
return $form.clearValidate(field);
}
return nextTick();
},
homePage() {
const { tablePage } = reactData;
tablePage.currentPage = 1;
return nextTick();
},
homePageByEvent(evnt) {
const $pager = refPager.value;
if ($pager) {
$pager.homePageByEvent(evnt);
}
},
endPage() {
const { tablePage } = reactData;
const pageCount = computePageCount.value;
tablePage.currentPage = pageCount;
return nextTick();
},
endPageByEvent(evnt) {
const $pager = refPager.value;
if ($pager) {
$pager.endPageByEvent(evnt);
}
},
getCurrentPage() {
const { tablePage } = reactData;
return tablePage.currentPage;
},
setCurrentPage(currentPage) {
const { tablePage } = reactData;
const pageCount = computePageCount.value;
tablePage.currentPage = Math.min(pageCount, Math.max(1, XEUtils.toNumber(currentPage)));
return nextTick();
},
setCurrentPageByEvent(evnt, currentPage) {
const $pager = refPager.value;
if ($pager) {
$pager.setCurrentPageByEvent(evnt, currentPage);
}
},
getPageSize() {
const { tablePage } = reactData;
return tablePage.pageSize;
},
setPageSize(pageSize) {
const { tablePage } = reactData;
tablePage.pageSize = Math.max(1, XEUtils.toNumber(pageSize));
return nextTick();
},
setPageSizeByEvent(evnt, pageSize) {
const $pager = refPager.value;
if ($pager) {
$pager.setPageSizeByEvent(evnt, pageSize);
}
},
getProxyInfo() {
const $xeTable = refTable.value;
if (props.proxyConfig) {
const { sortData } = reactData;
return {
data: $xeTable ? $xeTable.getFullData() : [],
filter: reactData.filterData,
form: getFormData(),
sort: sortData.length ? sortData[0] : {},
sorts: sortData,
pager: reactData.tablePage,
pendingRecords: $xeTable ? $xeTable.getPendingRecords() : []
};
}
return null;
},
getCustomPagerData() {
const { pagerConfig } = props;
const { tablePage } = reactData;
const pagerOpts = computePagerOpts.value;
if (pagerConfig && isEnableConf(pagerOpts)) {
return {
pSize: tablePage.pageSize
};
}
return {};
}
// setProxyInfo (options) {
// if (props.proxyConfig && options) {
// const { pager, form } = options
// const proxyOpts = computeProxyOpts.value
// if (pager) {
// if (pager.currentPage) {
// reactData.tablePage.currentPage = Number(pager.currentPage)
// }
// if (pager.pageSize) {
// reactData.tablePage.pageSize = Number(pager.pageSize)
// }
// }
// if (proxyOpts.form && form) {
// Object.assign(reactData.formData, form)
// }
// }
// return nextTick()
// }
};
const gridPrivateMethods = {
extendTableMethods,
callSlot(slotFunc, params) {
if (slotFunc) {
if (XEUtils.isString(slotFunc)) {
slotFunc = slots[slotFunc] || null;
}
if (XEUtils.isFunction(slotFunc)) {
return getSlotVNs(slotFunc(params));
}
}
return [];
},
/**
* 获取需要排除的高度
*/
getExcludeHeight() {
const { height } = props;
const { isZMax } = reactData;
const el = refElem.value;
if (el) {
const formWrapper = refFormWrapper.value;
const toolbarWrapper = refToolbarWrapper.value;
const topWrapper = refTopWrapper.value;
const bottomWrapper = refBottomWrapper.value;
const pagerWrapper = refPagerWrapper.value;
const parentEl = el.parentElement;
let parentPaddingSize = 0;
if (parentEl && (height === '100%' || height === 'auto')) {
parentPaddingSize = isZMax ? 0 : getPaddingTopBottomSize(parentEl);
}
return parentPaddingSize + getPaddingTopBottomSize(el) + getOffsetHeight(formWrapper) + getOffsetHeight(toolbarWrapper) + getOffsetHeight(topWrapper) + getOffsetHeight(bottomWrapper) + getOffsetHeight(pagerWrapper);
}
return 0;
},
getParentHeight() {
const el = refElem.value;
if (el) {
const parentEl = el.parentElement;
return (reactData.isZMax ? getDomNode().visibleHeight : (parentEl ? XEUtils.toNumber(getComputedStyle(parentEl).height) : 0)) - gridPrivateMethods.getExcludeHeight();
}
return 0;
},
triggerToolbarCommitEvent(params, evnt) {
const { code } = params;
if (code) {
const isUf = ['reload', 'delete', 'save'].includes(code);
if (isUf) {
internalData.uFoot = true;
}
const rest = $xeGrid.commitProxy(params, evnt).then((rest) => {
if (rest && rest.status && ['query', 'reload', 'delete', 'save'].includes(code)) {
$xeGrid.dispatchEvent(code === 'delete' || code === 'save' ? `proxy-${code}` : 'proxy-query', Object.assign(Object.assign({}, rest), { isReload: code === 'reload' }), evnt);
}
});
internalData.uFoot = false;
if (isUf) {
updateQueryFooter();
}
return rest;
}
return nextTick();
},
triggerToolbarBtnEvent(button, evnt) {
$xeGrid.triggerToolbarCommitEvent(button, evnt);
$xeGrid.dispatchEvent('toolbar-button-click', { code: button.code, button }, evnt);
},
triggerToolbarTolEvent(tool, evnt) {
$xeGrid.triggerToolbarCommitEvent(tool, evnt);
$xeGrid.dispatchEvent('toolbar-tool-click', { code: tool.code, tool }, evnt);
},
triggerZoomEvent(evnt) {
$xeGrid.zoom();
$xeGrid.dispatchEvent('zoom', { type: reactData.isZMax ? 'max' : 'revert' }, evnt);
}
};
Object.assign($xeGrid, gridExtendTableMethods, gridMethods, gridPrivateMethods, {
// 检查插槽
loadColumn(columns) {
const $xeTable = refTable.value;
XEUtils.eachTree(columns, (column) => {
if (column.slots) {
XEUtils.each(column.slots, (func) => {
if (!XEUtils.isFunction(func)) {
if (!slots[func]) {
errLog('vxe.error.notSlot', [func]);
}
}
});
}
});
if ($xeTable) {
return $xeTable.loadColumn(columns);
}
return nextTick();
},
reloadColumn(columns) {
$xeGrid.clearAll();
return $xeGrid.loadColumn(columns);
}
});
const renderVN = () => {
const vSize = computeSize.value;
const styles = computeStyles.value;
const isLoading = computeIsLoading.value;
return h('div', {
ref: refElem,
class: ['vxe-grid', {
[`size--${vSize}`]: vSize,
'is--animat': !!props.animat,
'is--round': props.round,
'is--maximize': reactData.isZMax,
'is--loading': isLoading
}],
style: styles
}, renderLayout());
};
const columnFlag = ref(0);
watch(() => props.columns ? props.columns.length : -1, () => {
columnFlag.value++;
});
watch(() => props.columns, () => {
columnFlag.value++;
});
watch(columnFlag, () => {
nextTick(() => $xeGrid.loadColumn(props.columns || []));
});
watch(() => props.toolbarConfig, () => {
initToolbar();
});
watch(computeCustomCurrentPageFlag, () => {
initPages('currentPage');
});
watch(computeCustomPageSizeFlag, () => {
initPages('pageSize');
});
watch(computeCustomTotalFlag, () => {
initPages('total');
});
watch(() => props.proxyConfig, () => {
initProxy();
});
hooks.forEach((options) => {
const { setupGrid } = options;
if (setupGrid) {
const hookRest = setupGrid($xeGrid);
if (hookRest && XEUtils.isObject(hookRest)) {
Object.assign($xeGrid, hookRest);
}
}
});
initPages();
onMounted(() => {
nextTick(() => {
const { columns } = props;
const proxyOpts = computeProxyOpts.value;
if (props.formConfig) {
if (!VxeUIFormComponent) {
errLog('vxe.error.reqComp', ['vxe-form']);
}
}
if (props.pagerConfig) {
if (!VxeUIPagerComponent) {
errLog('vxe.error.reqComp', ['vxe-pager']);
}
}
// const { data, columns, proxyConfig } = props
// const formOpts = computeFormOpts.value
// if (isEnableConf(proxyConfig) && (data || (proxyOpts.form && formOpts.data))) {
// errLog('vxe.error.errConflicts', ['[grid] data', 'proxy-config'])
// }
if (proxyOpts.props) {
warnLog('vxe.error.delProp', ['proxy-config.props', 'proxy-config.response']);
}
if (columns && columns.length) {
$xeGrid.loadColumn(columns);
}
initToolbar();
initProxy();
});
globalEvents.on($xeGrid, 'keydown', handleGlobalKeydownEvent);
});
onBeforeUnmount(() => {
globalEvents.off($xeGrid, 'keydown');
XEUtils.assign(reactData, createReactData());
XEUtils.assign(internalData, createInternalData());
});
$xeGrid.renderVN = renderVN;
provide('$xeGrid', $xeGrid);
provide('$xeGantt', null);
return $xeGrid;
},
render() {
return this.renderVN();
}
});
const VxeGrid = Object.assign({}, VxeGridComponent, {
install(app) {
app.component(VxeGridComponent.name, VxeGridComponent);
}
});
if (VxeUI.dynamicApp) {
VxeUI.dynamicApp.component(VxeGridComponent.name, VxeGridComponent);
}
VxeUI.component(VxeGridComponent);
const Grid = VxeGrid;
function useCellView(props) {
const currColumn = computed(() => {
const { renderParams } = props;
return renderParams.column;
});
const currRow = computed(() => {
const { renderParams } = props;
return renderParams.row;
});
const cellOptions = computed(() => {
const { renderOpts } = props;
return renderOpts.props || {};
});
const cellModel = computed({
get() {
const { renderParams } = props;
const { row, column } = renderParams;
return XEUtils.get(row, column.field);
},
set(value) {
const { renderParams } = props;
const { row, column } = renderParams;
return XEUtils.set(row, column.field, value);
}
});
return {
currColumn,
currRow,
cellModel,
cellOptions
};
}
const VxeTable = Object.assign({}, VxeTableComponent, {
install(app) {
app.component(VxeTableComponent.name, VxeTableComponent);
}
});
const tableHandle = {
useCellView
};
if (VxeUI.dynamicApp) {
VxeUI.dynamicApp.component(VxeTableComponent.name, VxeTableComponent);
}
VxeUI.component(VxeTableComponent);
VxeUI.tableHandle = tableHandle;
const Table = VxeTable;
const VxeToolbar = Object.assign({}, VxeToolbarComponent, {
install(app) {
app.component(VxeToolbarComponent.name, VxeToolbarComponent);
}
});
if (VxeUI.dynamicApp) {
VxeUI.dynamicApp.component(VxeToolbarComponent.name, VxeToolbarComponent);
}
VxeUI.component(VxeToolbarComponent);
const Toolbar = VxeToolbar;
var zhCN = {
vxe: {
base: {
pleaseInput: '请输入',
pleaseSelect: '请选择',
comma: ',',
fullStop: '。'
},
loading: {
text: '加载中...'
},
error: {
downErr: '下载失败',
errLargeData: '当绑定的数据量过大时,应该请使用 {0},否则可能会出现卡顿',
groupFixed: '如果使用分组表头,冻结列必须按组设置',
groupMouseRange: '分组表头与 "{0}" 不能同时使用,这可能会出现错误',
groupTag: '分组列头应该使用 "{0}" 而不是 "{1}",这可能会出现错误',
scrollErrProp: '启用虚拟滚动后不支持该参数 "{0}"',
errConflicts: '参数 "{0}" 与 "{1}" 有冲突',
modelConflicts: '绑定的字段值 "{0}" 与 "{1}" 存在冲突,将会出现错误',
notSupportProp: '当启用参数 "{0}" 时不支持 "{1}",应该为 "{2}",否则将会出现错误',
reqSupportProp: '当使用 "{0}" 时,应该设置 "{1}",否则可能会出现错误',
notConflictProp: '当使用 "{0}" 时,应该设置 "{1}",否则可能会存在功能冲突',
unableInsert: '无法插入到指定位置,请检查参数是否正确',
useErr: '安装 "{0}" 模块时发生错误,可能顺序不正确,依赖的模块需要在 Table 之前安装',
barUnableLink: '工具栏无法关联表格',
expandContent: '展开行的插槽应该是 "content",请检查是否正确',
reqComp: '缺少 "{0}" 组件,请检查是否正确安装。 https://vxeui.com/#/start/useUI/useGlobal',
reqModule: '缺少 "{0}" 模块',
reqProp: '缺少必要的 "{0}" 参数,这可能会导致出现错误',
emptyProp: '参数 "{0}" 不允许为空',
errProp: '不支持的参数 "{0}",可能为 "{1}"',
colRepet: 'column.{0}="{1}" 重复了,这可能会导致某些功能无法使用',
notFunc: '方法 "{0}" 不存在',
errFunc: '参数 "{0}" 不是一个方法',
notValidators: '全局校验 "{0}" 不存在',
notFormats: '全局格式化 "{0}" 不存在',
notCommands: '全局指令 "{0}" 不存在',
notSlot: '插槽 "{0}" 不存在',
noTree: '树结构不支持 "{0}"',
noGroup: '数据分组后不支持 "{0}"',
notProp: '不支持的参数 "{0}"',
returnErr: '参数 "{0}" 的返回值期望是 "{1}" 实际是 "{2}"',
notSupportReturn: '当返回值为 "{0}" 时的参数应该使用用 "{1}" 而不是 "{2}"',
checkProp: '当数据量过大时可能会导致复选框卡顿,建议设置参数 "{0}" 提升渲染速度',
coverProp: '"{0}" 的参数 "{1}" 重复定义,这可能会出现错误',
uniField: '字段名 "{0}" 重复定义,这可能会出现错误',
repeatKey: '主键重复 {0}="{1}",这可能会出现错误',
repeatProp: '参数重复 {0}="{1}",这可能会出现错误',
delFunc: '方法 "{0}" 已废弃,请使用 "{1}"',
delProp: '参数 "{0}" 已废弃,请使用 "{1}"',
delEvent: '事件 "{0}" 已废弃,请使用 "{1}"',
removeProp: '参数 "{0}" 已废弃,不建议使用,这可能会导致出现错误',
errFormat: '全局的格式化内容应该使用 "VXETable.formats" 定义,挂载 "formatter={0}" 的方式已不建议使用',
notType: '不支持的文件类型 "{0}"',
notExp: '该浏览器不支持导入/导出功能',
impFields: '导入失败,请检查字段名和数据格式是否正确',
treeNotImp: '树表格不支持导入',
treeCrossDrag: '只能拖拽第一层级',
treeDragChild: '父级不能拖拽到自己的子级中',
reqPlugin: '扩展插件未安装 "{1}" https://vxeui.com/other{0}/#/{1}/start/npmInstall',
errMaxRow: '超过支持的最大数据量 {0} 行,这可能会导致出现错误',
useNew: '不建议使用 {0},请使用 {1}',
errorVersion: '版本不匹配,当前版本 {0},最低支持版本为 {1}'
},
table: {
emptyText: '暂无数据',
allTitle: '全选/取消',
seqTitle: '序号',
actionTitle: '操作',
confirmFilter: '筛选',
resetFilter: '重置',
allFilter: '全部',
sortAsc: '升序:最低到最高',
sortDesc: '降序:最高到最低',
filter: '对所选的列启用筛选',
impSuccess: '成功导入 {0} 条记录',
expLoading: '正在导出中',
expSuccess: '导出成功',
expError: '导出失败',
expFilename: '导出_{0}',
expOriginFilename: '导出_源_{0}',
customTitle: '个性化设置',
customAll: '全部',
customConfirm: '确认',
customClose: '关闭',
customCancel: '取消',
customRestore: '恢复默认',
maxFixedCol: '最大冻结列的数量不能超过 {0} 个',
maxGroupCol: '最大分组字段的数量不能超过 {0} 个',
dragTip: '移动:{0}',
resizeColTip: '宽:{0} 像素',
resizeRowTip: '高:{0} 像素',
rowGroupContentTotal: '{0}({1})',
menuLoading: '加载中...'
},
grid: {
selectOneRecord: '请至少选择一条记录!',
deleteSelectRecord: '您确定要删除所选记录吗?',
removeSelectRecord: '您确定要移除所选记录吗?',
dataUnchanged: '数据未改动!',
delSuccess: '成功删除所选记录!',
saveSuccess: '保存成功!',
operError: '发生错误,操作失败!'
},
select: {
clear: '清除',
allChecked: '全选',
total: '已选 {0} 项',
close: '关闭',
search: '搜索',
loadingText: '加载中...',
emptyText: '暂无数据',
maxSize: '最大可选择的数量不能超过 {0} 个',
overSizeErr: '已超出最大可选数量 {0} 个,超出部分将被忽略!',
searchEmpty: '未匹配到数据!'
},
list: {
allChecked: '全选',
dragTip: '移动:{0}'
},
tree: {
searchEmpty: '未匹配到数据!',
dragTip: '移动:{0}'
},
treeSelect: {
clearChecked: '清除',
allChecked: '全选',
allExpand: '全部展开',
clearExpand: '全部收起',
total: '已选 {0} 项',
close: '关闭',
search: '搜索',
emptyText: '暂无数据'
},
pager: {
goto: '前往',
gotoTitle: '页数',
pagesize: '{0}条/页',
total: '共 {0} 条记录',
pageClassifier: '页',
homePage: '首页',
homePageTitle: '首页',
prevPage: '上一页',
prevPageTitle: '上一页',
nextPage: '下一页',
nextPageTitle: '下一页',
prevJump: '向上跳页',
prevJumpTitle: '向上跳页',
nextJump: '向下跳页',
nextJumpTitle: '向下跳页',
endPage: '末页',
endPageTitle: '末页'
},
alert: {
title: '系统提示'
},
button: {
confirm: '确认',
cancel: '取消',
clear: '清除'
},
filter: {
search: '搜索'
},
custom: {
cstmTitle: '个性化设置',
cstmRestore: '恢复默认',
cstmCancel: '取消',
cstmConfirm: '确定',
cstmConfirmRestore: '请确认是否恢复成默认列配置?',
cstmDragTarget: '移动:{0}',
setting: {
colSort: '排序',
sortHelpTip: '点击图标开始拖动',
colTitle: '列标题',
colResizable: '列宽(像素)',
colVisible: '是否显示',
colFixed: '冻结列',
colFixedMax: '冻结列({0})',
colAlign: '对齐方式',
colHeadAlign: '表头对齐方式',
colFootAlign: '表尾对齐方式',
fixedLeft: '左',
fixedUnset: '无',
fixedRight: '右',
alignLeft: '左',
alignCenter: '中',
alignRight: '右',
moveUp: '上移',
moveDn: '下移',
putTop: '置顶',
putBottom: '置尾',
moveUpTitle: '点击向上移动',
moveDnTitle: '点击向下移动',
putTopTitle: '点击置顶',
putBottomTitle: '点击置尾',
anLeftTitle: '左对齐',
anCenterTitle: '居中',
anRightTitle: '右对齐'
}
},
import: {
modes: {
covering: '覆盖方式(直接覆盖表格数据)',
insert: '底部追加(在表格的底部追加新数据)',
insertTop: '顶部追加(在表格的顶部追加新数据)',
insertBottom: '底部追加(在表格的底部追加新数据)'
},
impTitle: '导入数据',
impFile: '文件名',
impSelect: '选择文件',
impType: '文件类型',
impOpts: '参数设置',
impMode: '导入模式',
impConfirm: '导入',
impCancel: '取消'
},
export: {
types: {
csv: 'CSV (逗号分隔)(*.csv)',
html: '网页(*.html)',
xml: 'XML 数据(*.xml)',
txt: '文本文件(制表符分隔)(*.txt)',
xls: 'Excel 97-2003 工作簿(*.xls)',
xlsx: 'Excel 工作簿(*.xlsx)',
pdf: 'PDF (*.pdf)'
},
modes: {
empty: '空数据',
current: '当前数据(当前页的数据)',
selected: '选中数据(当前页选中的数据)',
all: '全量数据(包括所有分页的数据)'
},
printTitle: '打印数据',
expTitle: '导出数据',
expName: '文件名',
expNamePlaceholder: '请输入文件名',
expSheetName: '标题',
expSheetNamePlaceholder: '请输入标题',
expType: '保存类型',
expMode: '选择数据',
expCurrentColumn: '全部字段',
expColumn: '选择字段',
widthMode: '列宽设置',
wModeTitle: '设置打印时列宽的渲染方式',
wdModes: {
default: '默认',
auto: '自适应(根据内容自适应列宽)',
scale: '等比例(根据页面比例渲染列宽)'
},
expOpts: '参数设置',
expOptHeader: '表头',
expHeaderTitle: '是否需要表头',
expOptFooter: '表尾',
expFooterTitle: '是否需要表尾',
expOptColgroup: '分组表头',
expOptTitle: '列标题',
expTitleTitle: '是否为列标题,否则显示为列的字段名',
expColgroupTitle: '如果存在,则支持带有分组结构的表头',
expOptMerge: '合并',
expMergeTitle: '如果存在,则支持带有合并结构的单元格',
expOptAllExpand: '展开树',
expAllExpandTitle: '如果存在,则支持将带有层级结构的数据全部展开',
expOptTreeAllExpand: '展开树',
expTreeAllExpandTitle: '如果存在,则自动展开所有树层级',
expOptRowGroupAllExpand: '展开分组',
expRowGroupAllExpandTitle: '如果存在,则自动展开所有分组层级',
expOptUseStyle: '样式',
expUseStyleTitle: '如果存在,则支持带样式的单元格',
expOptOriginal: '源数据',
expOriginalTitle: '如果为源数据,则支持导入到表格中',
expPrint: '打印',
expConfirm: '导出',
expCancel: '取消'
},
modal: {
errTitle: '错误提示',
zoomMin: '最小化',
zoomIn: '最大化',
zoomOut: '还原',
close: '关闭',
miniMaxSize: '最小化窗口的数量不能超过 {0} 个',
footPropErr: 'show-footer 仅用于启用表尾,需配合 show-confirm-button | show-cancel-button | 插槽使用'
},
drawer: {
close: '关闭'
},
form: {
folding: '收起',
unfolding: '展开'
},
toolbar: {
import: '导入',
export: '导出',
print: '打印',
refresh: '刷新',
zoomIn: '全屏',
zoomOut: '还原',
custom: '个性化设置',
customAll: '全部',
customConfirm: '确认',
customRestore: '重置',
fixedLeft: '冻结在左侧',
fixedRight: '冻结在右侧',
cancelFixed: '取消冻结列'
},
iconPicker: {
search: '搜索',
emptyText: '暂无数据'
},
datePicker: {
yearTitle: '{0} 年'
},
dateRangePicker: {
pleaseRange: '请选择开始日期与结束日期'
},
input: {
date: {
m1: '01 月',
m2: '02 月',
m3: '03 月',
m4: '04 月',
m5: '05 月',
m6: '06 月',
m7: '07 月',
m8: '08 月',
m9: '09 月',
m10: '10 月',
m11: '11 月',
m12: '12 月',
quarterLabel: '{0} 年',
monthLabel: '{0} 年',
dayLabel: '{0} 年 {1}',
labelFormat: {
date: 'yyyy-MM-dd',
time: 'HH:mm:ss',
datetime: 'yyyy-MM-dd HH:mm:ss',
week: 'yyyy 年第 WW 周',
month: 'yyyy-MM',
quarter: 'yyyy 年第 q 季度',
year: 'yyyy'
},
weeks: {
w: '',
w0: '周日',
w1: '周一',
w2: '周二',
w3: '周三',
w4: '周四',
w5: '周五',
w6: '周六'
},
months: {
m0: '一月',
m1: '二月',
m2: '三月',
m3: '四月',
m4: '五月',
m5: '六月',
m6: '七月',
m7: '八月',
m8: '九月',
m9: '十月',
m10: '十一月',
m11: '十二月'
},
quarters: {
q1: '第一季度',
q2: '第二季度',
q3: '第三季度',
q4: '第四季度'
}
}
},
calendar: {
yearLabel: '{0} 年',
monthLabel: '{0} 月'
},
cascader: {
clearChecked: '清除',
allChecked: '全选',
total: '已选 {0} 项',
close: '关闭',
search: '搜索'
},
numberInput: {
currencySymbol: '¥'
},
imagePreview: {
popupTitle: '预览',
operBtn: {
zoomOut: '缩小',
zoomIn: '放大',
pctFull: '等比例缩放',
pct11: '显示原始尺寸',
rotateLeft: '向左旋转',
rotateRight: '向右旋转',
print: '点击打印图片',
download: '点击下载图片'
}
},
upload: {
fileBtnText: '点击或拖拽上传',
imgBtnText: '点击或拖拽上传',
dragPlaceholder: '请把文件拖放到这个区域即可上传',
imgSizeHint: '单张{0}',
imgCountHint: '最多{0}张',
fileTypeHint: '支持 {0} 文件类型',
fileSizeHint: '单个文件大小不超过{0}',
fileCountHint: '最多可上传{0}个文件',
uploadTypeErr: '文件类型不匹配!',
overCountErr: '最多只能选择{0}个文件!',
overCountExtraErr: '已超出最大数量{0}个,超出的{1}个文件将被忽略!',
overSizeErr: '文件大小最大不能超过{0}!',
manualUpload: '点击上传',
reUpload: '重新上传',
uploadProgress: '上传中 {0}%',
uploadErr: '上传失败',
uploadSuccess: '上传成功',
moreBtnText: '更多({0})',
moreImgBtnText: '图片({0})',
moreFileBtnText: '文件({0})',
viewItemTitle: '点击查看',
morePopup: {
readTitle: '查看列表',
imageTitle: '上传图片',
fileTitle: '上传文件'
}
},
empty: {
defText: '暂无数据'
},
colorPicker: {
clear: '清除',
confirm: '确认',
copySuccess: '已复制到剪贴板:{0}',
hex: '十六进制'
},
formDesign: {
formName: '表单名称',
defFormTitle: '未命名的表单',
widgetPropTab: '控件属性',
widgetFormTab: '表单属性',
error: {
wdFormUni: '该类型的控件在表单中只允许添加一个',
wdSubUni: '该类型的控件在子表中只允许添加一个'
},
styleSetting: {
btn: '样式设置',
title: '表单的样式设置',
layoutTitle: '控件布局',
verticalLayout: '上下布局',
horizontalLayout: '横向布局',
styleTitle: '标题样式',
boldTitle: '标题加粗',
fontBold: '加粗',
fontNormal: '常规',
colonTitle: '显示冒号',
colonVisible: '显示',
colonHidden: '隐藏',
alignTitle: '对齐方式',
widthTitle: '标题宽度',
alignLeft: '居左',
alignRight: '居右',
unitPx: '像素',
unitPct: '百分比'
},
widget: {
group: {
base: '基础控件',
layout: '布局控件',
system: '系统控件',
module: '模块控件',
chart: '图表控件',
advanced: '高级控件'
},
copyTitle: '副本_{0}',
component: {
input: '输入框',
textarea: '文本域',
select: '下拉选择',
row: '一行多列',
title: '标题',
text: '文本',
subtable: '子表',
VxeSwitch: '是/否',
VxeInput: '输入框',
VxeNumberInput: '数字',
VxeDatePicker: '日期',
VxeTextarea: '文本域',
VxeSelect: '下拉选择',
VxeTreeSelect: '树形选择',
VxeRadioGroup: '单选框',
VxeCheckboxGroup: '复选框',
VxeUploadFile: '文件',
VxeUploadImage: '图片',
VxeRate: '评分',
VxeSlider: '滑块'
}
},
widgetProp: {
name: '控件名称',
placeholder: '提示语',
required: '必填校验',
multiple: '允许多选',
displaySetting: {
name: '显示设置',
pc: '电脑端',
mobile: '手机端',
visible: '显示',
hidden: '隐藏'
},
dataSource: {
name: '数据源',
defValue: '选项{0}',
addOption: '添加选项',
batchEditOption: '批量编辑',
batchEditTip: '每行对应一个选项,支持从表格、Excel、WPS 中直接复制粘贴。',
batchEditSubTip: '每行对应一个选项,如果是分组,子项可以是空格或制表键开头,支持从表格、Excel、WPS 中直接复制粘贴。',
buildOption: '生成选项'
},
rowProp: {
colSize: '列数',
col2: '两列',
col3: '三列',
col4: '四列',
col6: '六列',
layout: '布局'
},
textProp: {
name: '内容',
alignTitle: '对齐方式',
alignLeft: '居左',
alignCenter: '居中',
alignRight: '居右',
colorTitle: '字体颜色',
sizeTitle: '字体大小',
boldTitle: '字体加粗',
fontNormal: '常规',
fontBold: '加粗'
},
subtableProp: {
seqTitle: '序号',
showSeq: '显示序号',
showCheckbox: '允许多选',
errSubDrag: '子表不支持该控件,请使用其他控件',
colPlace: '将控件拖拽进来'
},
uploadProp: {
limitFileCount: '文件数量限制',
limitFileSize: '文件大小限制',
multiFile: '允许上传多个文件',
limitImgCount: '图片数量限制',
limitImgSize: '图片大小限制',
multiImg: '允许上传多张图片'
}
}
},
listDesign: {
fieldSettingTab: '字段设置',
listSettingTab: '参数设置',
searchTitle: '查询条件',
listTitle: '列表字段',
searchField: '查询字段',
listField: '列表字段',
activeBtn: {
ActionButtonUpdate: '编辑',
ActionButtonDelete: '删除'
},
search: {
addBtn: '编辑',
emptyText: '未配置查询条件',
editPopupTitle: '编辑查询字段'
},
searchPopup: {
colTitle: '标题',
saveBtn: '保存'
}
},
text: {
copySuccess: '已复制到剪贴板',
copyError: '当前环境不支持该操作'
},
countdown: {
formats: {
yyyy: '年',
MM: '月',
dd: '天',
HH: '时',
mm: '分',
ss: '秒'
}
},
contextMenu: {
loadingText: '加载中...'
},
switch: {
onText: '打开',
offText: '关闭'
},
gantt: {
tFullFormat: {
year: '{yyyy}年',
quarter: '{yyyy}年第{q}季度',
month: '{yyyy}年{MM}月',
week: '{yyyy}年第{W}周',
day: '{yyyy}年{MM}月 {eLabel}',
date: '{yyyy}年{MM}月{dd}日',
hour: '{yyyy}年{MM}月{dd}日{HH}时',
minute: '{yyyy}年{MM}月{dd}日{HH}时{mm}分',
second: '{yyyy}年{MM}月{dd}日{HH}时{mm}分{ss}秒'
},
tSimpleFormat: {
year: '{yyyy}年',
quarter: '{q}季度',
month: '{M}月',
week: '{W}周',
day: '{eLabel}',
date: '{d}',
hour: '{HH}',
minute: '{mm}',
second: '{ss}'
},
stepFormat: {
year: '{start.yyyy}~{end.yyyy}年',
quarter: '{start.q}~{end.q}季度',
month: '{start.M}~{end.M}月',
week: '{start.W}~{end.W}周',
day: '{eStartLabel}~{eEndLabel}',
date: '{start.d}~{end.d}',
hour: '{start.HH}~{end.HH}',
minute: '{start.mm}~{end.mm}',
second: '{start.ss}~{end.ss}'
},
dayss: {
w0: '日',
w1: '一',
w2: '二',
w3: '三',
w4: '四',
w5: '五',
w6: '六'
},
days: {
w0: '日',
w1: '一',
w2: '二',
w3: '三',
w4: '四',
w5: '五',
w6: '六'
}
},
plugins: {
extendCellArea: {
area: {
mergeErr: '无法对合并单元格进行该操作',
multiErr: '无法对多重选择区域进行该操作',
selectErr: '无法操作指定区域的单元格',
extendErr: '如果延伸的区域包含被合并的单元格,所有合并的单元格需大小相同',
pasteMultiErr: '无法粘贴,需要相同大小的复制的区域和粘贴的区域才能执行此操作',
cpInvalidErr: '该操作无法进行,您选择的区域中存在被禁止的列({0})'
},
fnr: {
title: '查找和替换',
titleFd: '查找',
titleRe: '替换',
findLabel: '查找',
replaceLabel: '替换',
findTitle: '查找内容:',
replaceTitle: '替换为:',
tabs: {
find: '查找',
replace: '替换'
},
filter: {
re: '正则表达式',
whole: '全词匹配',
sensitive: '区分大小写'
},
btns: {
findNext: '查找下一个',
findAll: '查找全部',
replace: '替换',
replaceAll: '替换全部',
cancel: '取消'
},
header: {
seq: '#',
cell: '单元格',
value: '值'
},
body: {
row: '行:{0}',
col: '列:{0}'
},
empty: '(空值)',
reError: '无效的正则表达式',
recordCount: '已找到 {0} 个单元格',
notCell: '找不到匹配的单元格',
replaceSuccess: '成功替换 {0} 个单元格'
}
},
extendPivotTable: {
aggregation: {
grouping: '分组',
values: '值',
groupPlaceholder: '拖至此处进行分组',
valuesPlaceholder: '拖至此处进行聚合',
dragExistCol: '该列已存在',
sortHelpTip: '点击图标开始拖动'
},
aggFuncs: {
sum: '求和',
count: '计数',
avg: '平均值',
min: '最小值',
max: '最大值',
first: '首个值',
last: '末尾值'
}
},
filterComplexInput: {
menus: {
fixedColumn: '冻结列',
fixedGroup: '冻结分组',
cancelFixed: '取消冻结',
fixedLeft: '冻结左侧',
fixedRight: '冻结右侧'
},
cases: {
equal: '等于',
gt: '大于',
lt: '小于',
begin: '开头是',
endin: '结尾是',
include: '包含',
isSensitive: '区分大小写'
}
},
filterCombination: {
menus: {
sort: '排序',
clearSort: '清除排序',
sortAsc: '升序',
sortDesc: '降序',
fixedColumn: '冻结列',
fixedGroup: '冻结分组',
cancelFixed: '取消冻结',
fixedLeft: '冻结左侧',
fixedRight: '冻结右侧',
clearFilter: '清除筛选',
textOption: '文本筛选',
numberOption: '数值筛选',
dateOption: '日期筛选'
},
popup: {
title: '自定义筛选的方式',
currColumnTitle: '显示行:',
and: '与',
or: '或',
describeHtml: '可用 ? 代表单个字符<br/>用 * 代表任意多个字符'
},
cases: {
equal: '等于',
unequal: '不等于',
gt: '大于',
ge: '大于或等于',
lt: '小于',
le: '小于或等于',
begin: '开头是',
notbegin: '开头不是',
endin: '结尾是',
notendin: '结尾不是',
include: '包含',
exclude: '不包含',
between: '介于',
isAfter: '在以下日期之后',
eqAfter: '在以下日期之后或与之相同',
isBefore: '在以下日期之前',
eqBefore: '在以下日期之前或与之相同',
top10: '前10项',
aboveAverage: '高于平均值',
belowAverage: '低于平均值',
before: '之前',
after: '之后',
tomorrow: '明天',
today: '今天',
yesterday: '昨天',
nextWeek: '下周',
thisWeek: '本周',
lastWeek: '上周',
nextMonth: '下月',
thisMonth: '本月',
lastMonth: '上月',
nextYear: '明年',
thisYear: '今年',
lastYear: '去年',
yearToDate: '本年度截止到现在',
custom: '自定义筛选',
insensitive: '不区分大小写',
isSensitive: '区分大小写'
},
empty: '(空白)',
notData: '无匹配项'
}
},
pro: {
area: {
mergeErr: '无法对合并单元格进行该操作',
multiErr: '无法对多重选择区域进行该操作',
extendErr: '如果延伸的区域包含被合并的单元格,所有合并的单元格需大小相同',
pasteMultiErr: '无法粘贴,需要相同大小的复制的区域和粘贴的区域才能执行此操作'
},
fnr: {
title: '查找和替换',
titleFd: '查找',
titleRe: '替换',
findLabel: '查找',
replaceLabel: '替换',
findTitle: '查找内容:',
replaceTitle: '替换为:',
tabs: {
find: '查找',
replace: '替换'
},
filter: {
re: '正则表达式',
whole: '全词匹配',
sensitive: '区分大小写'
},
btns: {
findNext: '查找下一个',
findAll: '查找全部',
replace: '替换',
replaceAll: '替换全部',
cancel: '取消'
},
header: {
seq: '#',
cell: '单元格',
value: '值'
},
empty: '(空值)',
reError: '无效的正则表达式',
recordCount: '已找到 {0} 个单元格',
notCell: '找不到匹配的单元格',
replaceSuccess: '成功替换 {0} 个单元格'
}
},
renderer: {
search: '搜索',
cases: {
equal: '等于',
unequal: '不等于',
gt: '大于',
ge: '大于或等于',
lt: '小于',
le: '小于或等于',
begin: '开头是',
notbegin: '开头不是',
endin: '结尾是',
notendin: '结尾不是',
include: '包含',
exclude: '不包含',
between: '介于',
top10: '前10项',
aboveAverage: '高于平均值',
belowAverage: '低于平均值',
custom: '自定义筛选',
insensitive: '不区分大小写',
isSensitive: '区分大小写'
},
combination: {
menus: {
sort: '排序',
clearSort: '清除排序',
sortAsc: '升序',
sortDesc: '降序',
fixedColumn: '冻结列',
fixedGroup: '冻结分组',
cancelFixed: '取消冻结',
fixedLeft: '冻结到左侧',
fixedRight: '冻结到右侧',
clearFilter: '清除筛选',
textOption: '文本筛选',
numberOption: '数值筛选',
dateOption: '日期筛选'
},
popup: {
title: '自定义筛选的方式',
currColumnTitle: '显示行:',
and: '与',
or: '或',
describeHtml: '可用 ? 代表单个字符<br/>用 * 代表任意多个字符'
},
empty: '(空白)',
notData: '无匹配项'
}
}
}
};
const components = [
VxeColumn,
VxeColgroup,
VxeGrid,
VxeTable,
VxeToolbar
];
// 默认安装
function install(app, options) {
VxeUI.setConfig(options);
components.forEach(component => component.install(app));
}
// 保留兼容老版本
if (!VxeUI.hasLanguage('zh-CN')) {
const defaultLanguage = 'zh-CN';
VxeUI.setI18n(defaultLanguage, zhCN);
VxeUI.setLanguage(defaultLanguage);
}
VxeUI.setTheme('light');
var VxeUITableExport = /*#__PURE__*/Object.freeze({
__proto__: null,
Colgroup: Colgroup,
Column: Column,
Grid: Grid,
Table: Table,
Toolbar: Toolbar,
VXETable: VXETable,
VxeColgroup: VxeColgroup,
VxeColumn: VxeColumn,
VxeGrid: VxeGrid,
VxeTable: VxeTable,
VxeToolbar: VxeToolbar,
VxeUI: VxeUI,
_t: _t,
clipboard: clipboard,
commands: commands$2,
config: config,
formats: formats$2,
getConfig: getConfig$8,
getI18n: getI18n$e,
getIcon: getIcon$8,
getTheme: getTheme,
globalEvents: globalEvents$3,
globalResize: globalResize$1,
hooks: hooks$8,
install: install,
interceptor: interceptor$1,
log: log$1,
menus: menus$1,
modal: modal,
print: print,
readFile: readFile,
renderer: renderer$c,
saveFile: saveFile,
setConfig: setConfig,
setI18n: setI18n,
setIcon: setIcon,
setLanguage: setLanguage,
setTheme: setTheme,
setup: setup,
t: t,
use: use,
validators: validators$1,
version: version
});
export { Colgroup, Column, Grid, Table, Toolbar, VXETable, VxeColgroup, VxeColumn, VxeGrid, VxeTable, VxeToolbar, _t, clipboard, commands$2 as commands, config, VxeUITableExport as default, formats$2 as formats, getConfig$8 as getConfig, getI18n$e as getI18n, getIcon$8 as getIcon, getTheme, globalEvents$3 as globalEvents, globalResize$1 as globalResize, hooks$8 as hooks, install, interceptor$1 as interceptor, log$1 as log, menus$1 as menus, modal, print, readFile, renderer$c as renderer, saveFile, setConfig, setI18n, setIcon, setLanguage, setTheme, setup, t, use, validators$1 as validators, version };