| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247 |
- "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: 'VxeTableImportPanel',
- mixins: [globalMixins.sizeMixin],
- props: {
- defaultOptions: Object,
- storeData: Object
- },
- components: {
- // VxeModal,
- // VxeRadio
- },
- inject: {
- $xeTable: {
- default: null
- }
- },
- data() {
- return {
- loading: false
- };
- },
- computed: {
- selectName() {
- return `${this.storeData.filename}.${this.storeData.type}`;
- },
- hasFile() {
- return this.storeData.file && this.storeData.type;
- },
- parseTypeLabel() {
- const {
- storeData
- } = this;
- const {
- type,
- typeList
- } = storeData;
- if (type) {
- const selectItem = _xeUtils.default.find(typeList, item => type === item.value);
- return selectItem ? selectItem.label : '*.*';
- }
- return `*.${typeList.map(item => item.value).join(', *.')}`;
- }
- },
- created() {
- const $xeTableImportPanel = this;
- const VxeUIModalComponent = _ui.VxeUI.getComponent('VxeModal');
- const VxeUIButtonComponent = _ui.VxeUI.getComponent('VxeButton');
- const VxeUISelectComponent = _ui.VxeUI.getComponent('VxeSelect');
- $xeTableImportPanel.$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']);
- }
- });
- },
- render(h) {
- const $xeTable = this.$parent;
- const $xeGrid = $xeTable.$xeGrid;
- const $xeGantt = $xeTable.$xeGantt;
- const {
- hasFile,
- loading,
- parseTypeLabel,
- defaultOptions,
- storeData,
- selectName
- } = this;
- const slots = defaultOptions.slots || {};
- const topSlot = slots.top;
- const bottomSlot = slots.bottom;
- const defaultSlot = slots.default;
- const footerSlot = slots.footer;
- return h('vxe-modal', {
- ref: 'modal',
- props: {
- id: 'VXE_IMPORT_MODAL',
- value: storeData.visible,
- title: getI18n('vxe.import.impTitle'),
- width: 540,
- minWidth: 360,
- minHeight: 240,
- mask: true,
- lockView: true,
- showFooter: true,
- escClosable: true,
- maskClosable: true,
- showMaximize: true,
- resize: true,
- loading
- },
- on: {
- input(value) {
- storeData.visible = value;
- },
- show: this.showEvent
- },
- scopedSlots: {
- 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, h)) : renderEmptyElement(this), h('div', {
- class: 'vxe-table-export--panel-body'
- }, defaultSlot ? $xeTable.callSlot(defaultSlot, params, h) : [h('table', {
- class: 'vxe-table-export--panel-table',
- attrs: {
- cellspacing: 0,
- cellpadding: 0,
- border: 0
- }
- }, [h('tbody', [h('tr', [h('td', getI18n('vxe.import.impFile')), h('td', [hasFile ? h('div', {
- class: 'vxe-table-export--selected--file',
- attrs: {
- title: selectName
- }
- }, [h('span', selectName), h('i', {
- class: getIcon().INPUT_CLEAR,
- on: {
- click: this.clearFileEvent
- }
- })]) : h('button', {
- ref: 'fileBtn',
- class: 'vxe-table-export--select--file',
- attrs: {
- type: 'button'
- },
- on: {
- click: this.selectFileEvent
- }
- }, getI18n('vxe.import.impSelect'))])]), h('tr', [h('td', getI18n('vxe.import.impType')), h('td', parseTypeLabel)]), h('tr', [h('td', getI18n('vxe.import.impMode')), h('td', [h('vxe-select', {
- props: {
- value: defaultOptions.mode,
- options: storeData.modeList
- },
- on: {
- modelValue(value) {
- defaultOptions.mode = 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,
- 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', {
- on: {
- click: this.cancelEvent
- }
- }, getI18n('vxe.import.impCancel')), h('vxe-button', {
- props: {
- status: 'primary',
- disabled: !hasFile || loading
- },
- on: {
- click: this.importEvent
- }
- }, getI18n('vxe.import.impConfirm'))])]);
- }
- }
- });
- },
- methods: {
- clearFileEvent() {
- Object.assign(this.storeData, {
- filename: '',
- sheetName: '',
- type: ''
- });
- },
- selectFileEvent() {
- const $xeTable = this.$parent;
- $xeTable.readFile(this.defaultOptions).then(params => {
- const {
- file
- } = params;
- Object.assign(this.storeData, (0, _utils.parseFile)(file), {
- file
- });
- }).catch(e => e);
- },
- showEvent() {
- this.$nextTick(() => {
- const {
- $refs
- } = this;
- const targetElem = $refs.fileBtn;
- if (targetElem) {
- targetElem.focus();
- }
- });
- },
- cancelEvent() {
- this.storeData.visible = false;
- },
- importEvent() {
- const $xeTable = this.$parent;
- this.loading = true;
- $xeTable.importByFile(this.storeData.file, Object.assign({}, $xeTable.importOpts, this.defaultOptions)).then(() => {
- this.loading = false;
- this.storeData.visible = false;
- }).catch(() => {
- this.loading = false;
- });
- }
- }
- };
|