"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _ui = require("../../../ui"); var _xeUtils = _interopRequireDefault(require("xe-utils")); var _utils = require("../../../ui/src/utils"); var _log = require("../../../ui/src/log"); function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } const { getI18n, getIcon, globalMixins, renderEmptyElement } = _ui.VxeUI; var _default = exports.default = { name: 'VxeTableExportPanel', mixins: [globalMixins.sizeMixin], props: { defaultOptions: Object, storeData: Object }, components: { // VxeModal, // VxeInput, // VxeCheckbox, // VxeSelect, // VxeOption }, inject: { $xeTable: { default: null } }, data() { return { isAll: false, isIndeterminate: false, loading: false }; }, computed: { checkedAll() { return this.storeData.columns.every(column => column.checked); }, showSheet() { return ['html', 'xml', 'xlsx', 'pdf'].indexOf(this.defaultOptions.type) > -1; }, supportMerge() { const { storeData, defaultOptions } = this; return !defaultOptions.original && defaultOptions.mode === 'current' && (storeData.isPrint || ['html', 'xlsx'].indexOf(defaultOptions.type) > -1); }, // computeSupportGroup () { // const { defaultOptions } = this // return ['html', 'xlsx', 'csv', 'txt'].indexOf(defaultOptions.type) > -1 // }, supportStyle() { const { defaultOptions } = this; return !defaultOptions.original && ['xlsx'].indexOf(defaultOptions.type) > -1; } }, created() { const $xeTableExportPanel = this; const VxeUIModalComponent = _ui.VxeUI.getComponent('VxeModal'); const VxeUIButtonComponent = _ui.VxeUI.getComponent('VxeButton'); const VxeUISelectComponent = _ui.VxeUI.getComponent('VxeSelect'); const VxeUIInputComponent = _ui.VxeUI.getComponent('VxeInput'); const VxeUICheckboxComponent = _ui.VxeUI.getComponent('VxeCheckbox'); $xeTableExportPanel.$nextTick(() => { if (!VxeUIModalComponent) { (0, _log.errLog)('vxe.error.reqComp', ['vxe-modal']); } if (!VxeUIButtonComponent) { (0, _log.errLog)('vxe.error.reqComp', ['vxe-button']); } if (!VxeUISelectComponent) { (0, _log.errLog)('vxe.error.reqComp', ['vxe-select']); } if (!VxeUIInputComponent) { (0, _log.errLog)('vxe.error.reqComp', ['vxe-input']); } if (!VxeUICheckboxComponent) { (0, _log.errLog)('vxe.error.reqComp', ['vxe-checkbox']); } }); }, render(h) { const $xeTable = this.$xeTable; const $xeGrid = $xeTable.$xeGrid; const $xeGantt = $xeTable.$xeGantt; const { _e, checkedAll, isAll: isAllChecked, isIndeterminate: isAllIndeterminate, showSheet, supportMerge, supportStyle, defaultOptions, storeData } = this; const { hasTree, hasMerge, isPrint, hasColgroup, columns } = storeData; const { isHeader } = defaultOptions; // const supportGroup = this.computeSupportGroup const slots = defaultOptions.slots || {}; const topSlot = slots.top; const bottomSlot = slots.bottom; const defaultSlot = slots.default; const footerSlot = slots.footer; const parameterSlot = slots.parameter; const cols = []; _xeUtils.default.eachTree(columns, column => { const colTitle = (0, _utils.formatText)(column.getTitle(), 1); const isColGroup = column.children && column.children.length; const isChecked = column.checked; const indeterminate = column.halfChecked; const isHtml = column.type === 'html'; cols.push(h('li', { class: ['vxe-table-export--panel-column-option', `level--${column.level}`, { 'is--group': isColGroup, 'is--checked': isChecked, 'is--indeterminate': indeterminate, 'is--disabled': column.disabled }], attrs: { title: colTitle }, on: { click: () => { if (!column.disabled) { this.changeOption(column); } } } }, [h('span', { class: ['vxe-checkbox--icon', indeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : isChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED] }), isHtml ? h('span', { key: '1', class: 'vxe-checkbox--label', domProps: { innerHTML: colTitle } }) : h('span', { key: '0', class: 'vxe-checkbox--label' }, colTitle)])); }); return h('vxe-modal', { ref: 'modal', props: { id: 'VXE_EXPORT_MODAL', value: storeData.visible, title: getI18n(isPrint ? 'vxe.export.printTitle' : 'vxe.export.expTitle'), width: 660, minWidth: 500, minHeight: 400, mask: true, lockView: true, showFooter: true, escClosable: true, maskClosable: true, showMaximize: true, resize: true, loading: this.loading }, on: { input(value) { storeData.visible = value; }, show: this.showEvent }, scopedSlots: { 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, h)) : renderEmptyElement(this), h('div', { class: 'vxe-table-export--panel-body' }, defaultSlot ? $xeTable.callSlot(defaultSlot, params, h) : [h('table', { attrs: { class: 'vxe-table-export--panel-table', cellspacing: 0, cellpadding: 0, border: 0 } }, [h('tbody', [[isPrint ? _e() : h('tr', [h('td', getI18n('vxe.export.expName')), h('td', [h('vxe-input', { ref: 'filename', props: { value: defaultOptions.filename, type: 'text', clearable: true, placeholder: getI18n('vxe.export.expNamePlaceholder') }, on: { modelValue(value) { defaultOptions.filename = value; } } })])]), isPrint ? _e() : h('tr', [h('td', getI18n('vxe.export.expType')), h('td', [h('vxe-select', { props: { value: defaultOptions.type, options: storeData.typeList }, on: { modelValue(value) { defaultOptions.type = value; } } })])]), isPrint || showSheet ? h('tr', [h('td', getI18n('vxe.export.expSheetName')), h('td', [h('vxe-input', { ref: 'sheetname', props: { value: defaultOptions.sheetName, type: 'text', clearable: true, placeholder: getI18n('vxe.export.expSheetNamePlaceholder') }, on: { modelValue(value) { defaultOptions.sheetName = value; } } })])]) : _e(), h('tr', [h('td', getI18n('vxe.export.expMode')), h('td', [h('vxe-select', { props: { value: defaultOptions.mode, options: storeData.modeList }, on: { modelValue(value) { defaultOptions.mode = value; } } })])]), h('tr', [h('td', [getI18n('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 }], attrs: { title: getI18n('vxe.table.allTitle') }, on: { click: this.allColumnEvent } }, [h('span', { class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : isAllChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED] }), h('span', { class: 'vxe-checkbox--label' }, getI18n('vxe.export.expCurrentColumn'))])]), h('ul', { class: 'vxe-table-export--panel-column-body' }, cols)])])]), h('tr', [h('td', getI18n('vxe.export.expOpts')), parameterSlot ? h('td', [h('div', { class: 'vxe-table-export--panel-option-row' }, $xeTable.callSlot(parameterSlot, params, h))]) : h('td', [h('div', { class: 'vxe-table-export--panel-option-row' }, [h('vxe-checkbox', { props: { value: hasEmptyData || isHeader, disabled: hasEmptyData, title: getI18n('vxe.export.expHeaderTitle'), content: getI18n('vxe.export.expOptHeader') }, on: { input(value) { defaultOptions.isHeader = value; } } }), h('vxe-checkbox', { props: { value: isHeader ? defaultOptions.isTitle : false, disabled: !isHeader, title: getI18n('vxe.export.expTitleTitle'), content: getI18n('vxe.export.expOptTitle') }, on: { input(value) { defaultOptions.isTitle = value; } } }), h('vxe-checkbox', { props: { value: isHeader && hasColgroup && supportMerge ? defaultOptions.isColgroup : false, disabled: !isHeader || !hasColgroup || !supportMerge, title: getI18n('vxe.export.expColgroupTitle'), content: getI18n('vxe.export.expOptColgroup') }, on: { input(value) { defaultOptions.isColgroup = value; } } })]), h('div', { class: 'vxe-table-export--panel-option-row' }, [h('vxe-checkbox', { props: { value: hasEmptyData ? false : defaultOptions.original, disabled: hasEmptyData, title: getI18n('vxe.export.expOriginalTitle'), content: getI18n('vxe.export.expOptOriginal') }, on: { input(value) { defaultOptions.original = value; } } }), h('vxe-checkbox', { props: { value: hasMerge && supportMerge && checkedAll ? defaultOptions.isMerge : false, disabled: hasEmptyData || !hasMerge || !supportMerge || !checkedAll, title: getI18n('vxe.export.expMergeTitle'), content: getI18n('vxe.export.expOptMerge') }, on: { input(value) { defaultOptions.isMerge = value; } } }), isPrint ? _e() : h('vxe-checkbox', { props: { value: supportStyle ? defaultOptions.useStyle : false, disabled: !supportStyle, title: getI18n('vxe.export.expUseStyleTitle'), content: getI18n('vxe.export.expOptUseStyle') }, on: { input(value) { defaultOptions.useStyle = value; } } }), h('vxe-checkbox', { props: { value: hasTree ? defaultOptions.isAllExpand : false, disabled: hasEmptyData || !hasTree, title: getI18n('vxe.export.expAllExpandTitle'), content: getI18n('vxe.export.expOptAllExpand') }, on: { input(value) { defaultOptions.isAllExpand = value; } } })]), h('div', { class: 'vxe-table-export--panel-option-row' }, [h('vxe-checkbox', { props: { value: defaultOptions.isFooter, disabled: !storeData.hasFooter, title: getI18n('vxe.export.expFooterTitle'), content: getI18n('vxe.export.expOptFooter') }, on: { input(value) { defaultOptions.isFooter = value; } } })])])])]])])]), bottomSlot ? h('div', { class: 'vxe-table-export--panel-bottom' }, $xeTable.callSlot(bottomSlot, params, h)) : renderEmptyElement(this)]); }, 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) : [h('div', { class: 'vxe-table-export--panel-btns' }, [h('vxe-button', { props: { content: getI18n('vxe.export.expCancel') }, on: { click: this.cancelEvent } }), h('vxe-button', { ref: 'confirmBtn', props: { status: 'primary', content: getI18n(isPrint ? 'vxe.export.expPrint' : 'vxe.export.expConfirm') }, on: { click: this.confirmEvent } })])]); } } }); }, methods: { changeOption(column) { const isChecked = !column.checked; _xeUtils.default.eachTree([column], item => { item.checked = isChecked; item.halfChecked = false; }); this.handleOptionCheck(column); this.checkStatus(); }, handleOptionCheck(column) { const matchObj = _xeUtils.default.findTree(this.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); this.handleOptionCheck(parent); } } }, checkStatus() { const columns = this.storeData.columns; this.isAll = columns.every(column => column.disabled || column.checked); this.isIndeterminate = !this.isAll && columns.some(column => !column.disabled && (column.checked || column.halfChecked)); }, allColumnEvent() { const isAll = !this.isAll; _xeUtils.default.eachTree(this.storeData.columns, column => { if (!column.disabled) { column.checked = isAll; column.halfChecked = false; } }); this.isAll = isAll; this.checkStatus(); }, showEvent() { this.$nextTick(() => { const { $refs } = this; const targetElem = $refs.filename || $refs.sheetname || $refs.confirmBtn; if (targetElem) { targetElem.focus(); } }); this.checkStatus(); }, getExportOption() { const { checkedAll, storeData, defaultOptions, supportMerge } = this; const { hasMerge, columns } = storeData; const expColumns = _xeUtils.default.searchTree(columns, column => column.checked, { children: 'children', mapChildren: 'childNodes', original: true }); return Object.assign({}, defaultOptions, { columns: expColumns, isMerge: hasMerge && supportMerge && checkedAll ? defaultOptions.isMerge : false }); }, cancelEvent() { this.storeData.visible = false; }, confirmEvent(evnt) { if (this.storeData.isPrint) { this.printEvent(evnt); } else { this.exportEvent(evnt); } }, printEvent() { const $xeTable = this.$parent; this.storeData.visible = false; $xeTable.print(Object.assign({}, $xeTable.printOpts, this.getExportOption())); }, exportEvent() { const $xeTable = this.$xeTable; const exportOpts = $xeTable.exportOpts; this.loading = true; $xeTable.exportData(Object.assign({}, exportOpts, this.getExportOption())).then(() => { this.loading = false; this.storeData.visible = false; }).catch(() => { this.loading = false; }); } } };