| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338 |
- import XEUtils from 'xe-utils';
- import { getColumnList } from '../../src/util';
- function calcMaxHeight($xeTable) {
- const $xeGantt = $xeTable.$xeGantt;
- const reactData = $xeTable;
- const { customStore } = reactData;
- let wrapperEl = $xeTable.$refs.refElem;
- // 判断面板不能大于表格高度
- let tableHeight = 0;
- if ($xeGantt) {
- const ganttContainerElem = $xeGantt.$refs.refGanttContainerElem;
- if (ganttContainerElem) {
- wrapperEl = ganttContainerElem;
- }
- }
- if (wrapperEl) {
- tableHeight = wrapperEl.clientHeight - 28;
- }
- customStore.maxHeight = Math.max(88, tableHeight);
- }
- function emitCustomEvent($xeTable, type, evnt) {
- const $xeGrid = $xeTable.$xeGrid;
- const $xeGantt = $xeTable.$xeGantt;
- const comp = $xeGrid || $xeGantt || $xeTable;
- comp.dispatchEvent('custom', { type }, evnt);
- }
- export default {
- methods: {
- _getCustomVisible() {
- const $xeTable = this;
- const reactData = $xeTable;
- const { customStore } = reactData;
- return customStore.visible;
- },
- _openCustom() {
- const $xeTable = this;
- const reactData = $xeTable;
- const { initStore, customStore } = reactData;
- customStore.visible = true;
- initStore.custom = true;
- $xeTable.handleUpdateCustomColumn();
- $xeTable.checkCustomStatus();
- calcMaxHeight($xeTable);
- return $xeTable.$nextTick().then(() => calcMaxHeight($xeTable));
- },
- _closeCustom() {
- const $xeTable = this;
- const reactData = $xeTable;
- const { customStore } = reactData;
- const customOpts = $xeTable.computeCustomOpts;
- if (customStore.visible) {
- customStore.visible = false;
- if (!customOpts.immediate) {
- $xeTable.handleCustom();
- }
- }
- return $xeTable.$nextTick();
- },
- _toggleCustom() {
- const $xeTable = this;
- const reactData = $xeTable;
- const { customStore } = reactData;
- if (customStore.visible) {
- return $xeTable.closeCustom();
- }
- return $xeTable.openCustom();
- },
- _saveCustom() {
- const $xeTable = this;
- const reactData = $xeTable;
- const internalData = $xeTable;
- const { customColumnList, aggHandleFields, rowGroupList } = reactData;
- const customOpts = $xeTable.computeCustomOpts;
- const { allowVisible, allowSort, allowFixed, allowResizable, allowGroup, allowValues } = customOpts;
- 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 (allowGroup && allowValues) {
- column.aggFunc = column.renderAggFn;
- }
- });
- reactData.isCustomStatus = true;
- if (allowGroup && allowValues && !!$xeTable.handlePivotTableAggregateData) {
- 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');
- },
- _cancelCustom() {
- const $xeTable = this;
- const reactData = $xeTable;
- const { customColumnList, customStore } = reactData;
- const { oldSortMaps, oldFixedMaps, oldVisibleMaps } = customStore;
- const customOpts = $xeTable.computeCustomOpts;
- const { allowVisible, allowSort, allowFixed, allowResizable } = 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;
- }
- }, { children: 'children' });
- return $xeTable.$nextTick();
- },
- _resetCustom(options) {
- const $xeTable = this;
- const reactData = $xeTable;
- const internalData = $xeTable;
- const { rowGroupList } = reactData;
- const { collectColumn } = internalData;
- const customOpts = $xeTable.computeCustomOpts;
- const { checkMethod } = customOpts;
- const opts = Object.assign({
- visible: true,
- resizable: options === true,
- fixed: options === true,
- sort: options === true,
- aggFunc: options === true
- }, options);
- const allCols = [];
- XEUtils.eachTree(collectColumn, (column) => {
- if (opts.resizable) {
- column.resizeWidth = 0;
- }
- if (opts.fixed) {
- column.fixed = 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.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.handlePivotTableAggregateData) {
- const rowGroupFields = $xeTable.computeRowGroupFields;
- 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 } = this;
- const isAll = !customStore.isAll;
- return this.setCustomAllCheckbox(isAll);
- },
- _setCustomAllCheckbox(checked) {
- const $xeTable = this;
- const reactData = $xeTable;
- const { customStore } = reactData;
- const { customColumnList } = reactData;
- const customOpts = $xeTable.computeCustomOpts;
- 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();
- },
- checkCustomStatus() {
- const $xeTable = this;
- const reactData = $xeTable;
- const internalData = $xeTable;
- const { customStore } = reactData;
- const { collectColumn } = internalData;
- const customOpts = $xeTable.computeCustomOpts;
- 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));
- },
- emitCustomEvent(type, evnt) {
- const $xeTable = this;
- const $xeGrid = $xeTable.$xeGrid;
- const $xeGantt = $xeTable.$xeGantt;
- const comp = $xeGrid || $xeGantt || $xeTable;
- comp.dispatchEvent('custom', { type }, evnt);
- },
- triggerCustomEvent(evnt) {
- const $xeTable = this;
- const reactData = $xeTable;
- const { customStore } = reactData;
- if (customStore.visible) {
- this.closeCustom();
- emitCustomEvent($xeTable, 'close', evnt);
- }
- else {
- customStore.btnEl = evnt.target;
- this.openCustom();
- emitCustomEvent($xeTable, 'open', evnt);
- }
- },
- customOpenEvent(evnt) {
- const $xeTable = this;
- const reactData = $xeTable;
- const { customStore } = reactData;
- if (customStore.visible) {
- customStore.activeBtn = true;
- customStore.btnEl = evnt.target;
- $xeTable.openCustom();
- emitCustomEvent($xeTable, 'open', evnt);
- }
- },
- customCloseEvent(evnt) {
- const $xeTable = this;
- const reactData = $xeTable;
- const { customStore } = reactData;
- if (customStore.visible) {
- customStore.activeBtn = false;
- $xeTable.closeCustom();
- emitCustomEvent($xeTable, 'close', evnt);
- }
- },
- handleUpdateCustomColumn() {
- const $xeTable = this;
- const reactData = $xeTable;
- const internalData = $xeTable;
- 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;
- 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);
- }
- }
- }
- };
|