vxe-table 3.8.23 → 3.9.0-rc.0

package/packages/export/index.d.ts

@@ -1,4 +0,0 @@
-import { VxeTableExportModule } from '../../types/module/export'
-
-export * from '../../types/module/export'
-export default VxeTableExportModule

package/packages/export/index.js

@@ -1,42 +0,0 @@
-import Table from '../table'
-import VXETable from '../v-x-e-table'
-import ExportPanel from './src/export-panel'
-import ImportPanel from './src/import-panel'
-import mixin, { saveLocalFile as saveFile, readLocalFile as readFile, handlePrint } from './src/mixin'
-
-export { saveFile, readFile }
-
-export function print (options) {
-  const opts = Object.assign({}, options, {
-    type: 'html'
-  })
-  handlePrint(null, opts, opts.content)
-}
-
-export const VxeTableExportModule = {
-  ExportPanel,
-  ImportPanel,
-  install (Vue) {
-    VXETable.reg('export')
-    VXETable.saveFile = saveFile
-    VXETable.readFile = readFile
-    VXETable.print = print
-    VXETable.setConfig({
-      export: {
-        types: {
-          csv: 0,
-          html: 0,
-          xml: 0,
-          txt: 0
-        }
-      }
-    })
-    Table.mixins.push(mixin)
-    Vue.component(ExportPanel.name, ExportPanel)
-    Vue.component(ImportPanel.name, ImportPanel)
-  }
-}
-
-export const Export = VxeTableExportModule
-
-export default VxeTableExportModule

package/packages/export/src/export-panel.js

@@ -1,444 +0,0 @@
-import XEUtils from 'xe-utils'
-import GlobalConfig from '../../v-x-e-table/src/conf'
-import VxeModal from '../../modal/src/modal'
-import VxeInput from '../../input/src/input'
-import VxeCheckbox from '../../checkbox/src/checkbox'
-import VxeSelect from '../../select/src/select'
-import VxeOption from '../../select/src/option'
-import UtilTools from '../../tools/utils'
-
-export default {
-  name: 'VxeTableExportPanel',
-  props: {
-    defaultOptions: Object,
-    storeData: Object
-  },
-  components: {
-    VxeModal,
-    VxeInput,
-    VxeCheckbox,
-    VxeSelect,
-    VxeOption
-  },
-  data () {
-    return {
-      isAll: false,
-      isIndeterminate: false,
-      loading: false
-    }
-  },
-  computed: {
-    vSize () {
-      return this.size || this.$parent.size || this.$parent.vSize
-    },
-    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)
-    },
-    supportStyle () {
-      const { defaultOptions } = this
-      return !defaultOptions.original && ['xlsx'].indexOf(defaultOptions.type) > -1
-    }
-  },
-  render (h) {
-    const { _e, checkedAll, isAll: isAllChecked, isIndeterminate: isAllIndeterminate, showSheet, supportMerge, supportStyle, defaultOptions, storeData } = this
-    const { hasTree, hasMerge, isPrint, hasColgroup } = storeData
-    const { isHeader } = defaultOptions
-    const cols = []
-    XEUtils.eachTree(storeData.columns, column => {
-      const colTitle = UtilTools.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-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 ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isChecked ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)]
-          }),
-          isHtml
-            ? h('span', {
-              key: '1',
-              class: 'vxe-checkbox--label',
-              innerHTML: colTitle
-            })
-            : h('span', {
-              key: '0',
-              class: 'vxe-checkbox--label'
-            }, colTitle)
-        ])
-      )
-    })
-    return h('vxe-modal', {
-      res: 'modal',
-      props: {
-        value: storeData.visible,
-        title: GlobalConfig.i18n(isPrint ? 'vxe.export.printTitle' : 'vxe.export.expTitle'),
-        width: 660,
-        mask: true,
-        lockView: true,
-        showFooter: false,
-        escClosable: true,
-        maskClosable: true,
-        loading: this.loading
-      },
-      on: {
-        input (value) {
-          storeData.visible = value
-        },
-        show: this.showEvent
-      }
-    }, [
-      h('div', {
-        class: 'vxe-export--panel'
-      }, [
-        h('table', {
-          attrs: {
-            cellspacing: 0,
-            cellpadding: 0,
-            border: 0
-          }
-        }, [
-          h('tbody', [
-            [
-              isPrint ? _e() : h('tr', [
-                h('td', GlobalConfig.i18n('vxe.export.expName')),
-                h('td', [
-                  h('vxe-input', {
-                    ref: 'filename',
-                    props: {
-                      value: defaultOptions.filename,
-                      type: 'text',
-                      clearable: true,
-                      placeholder: GlobalConfig.i18n('vxe.export.expNamePlaceholder')
-                    },
-                    on: {
-                      modelValue (value) {
-                        defaultOptions.filename = value
-                      }
-                    }
-                  })
-                ])
-              ]),
-              isPrint ? _e() : h('tr', [
-                h('td', GlobalConfig.i18n('vxe.export.expType')),
-                h('td', [
-                  h('vxe-select', {
-                    props: {
-                      value: defaultOptions.type,
-                      options: storeData.typeList
-                    },
-                    on: {
-                      input (value) {
-                        defaultOptions.type = value
-                      }
-                    }
-                  })
-                ])
-              ]),
-              isPrint || showSheet ? h('tr', [
-                h('td', GlobalConfig.i18n('vxe.export.expSheetName')),
-                h('td', [
-                  h('vxe-input', {
-                    ref: 'sheetname',
-                    props: {
-                      value: defaultOptions.sheetName,
-                      type: 'text',
-                      clearable: true,
-                      placeholder: GlobalConfig.i18n('vxe.export.expSheetNamePlaceholder')
-                    },
-                    on: {
-                      modelValue (value) {
-                        defaultOptions.sheetName = value
-                      }
-                    }
-                  })
-                ])
-              ]) : _e(),
-              h('tr', [
-                h('td', GlobalConfig.i18n('vxe.export.expMode')),
-                h('td', [
-                  h('vxe-select', {
-                    props: {
-                      value: defaultOptions.mode,
-                      options: storeData.modeList
-                    },
-                    on: {
-                      input (value) {
-                        defaultOptions.mode = value
-                      }
-                    }
-                  })
-                ])
-              ]),
-              h('tr', [
-                h('td', [GlobalConfig.i18n('vxe.export.expColumn')]),
-                h('td', [
-                  h('div', {
-                    class: 'vxe-export--panel-column'
-                  }, [
-                    h('ul', {
-                      class: 'vxe-export--panel-column-header'
-                    }, [
-                      h('li', {
-                        class: ['vxe-export--panel-column-option', {
-                          'is--checked': isAllChecked,
-                          'is--indeterminate': isAllIndeterminate
-                        }],
-                        attrs: {
-                          title: GlobalConfig.i18n('vxe.table.allTitle')
-                        },
-                        on: {
-                          click: this.allColumnEvent
-                        }
-                      }, [
-                        h('span', {
-                          class: ['vxe-checkbox--icon', isAllIndeterminate ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)]
-                        }),
-                        h('span', {
-                          class: 'vxe-checkbox--label'
-                        }, GlobalConfig.i18n('vxe.export.expCurrentColumn'))
-                      ])
-                    ]),
-                    h('ul', {
-                      class: 'vxe-export--panel-column-body'
-                    }, cols)
-                  ])
-                ])
-              ]),
-              h('tr', [
-                h('td', GlobalConfig.i18n('vxe.export.expOpts')),
-                h('td', [
-                  h('div', {
-                    class: 'vxe-export--panel-option-row'
-                  }, [
-                    h('vxe-checkbox', {
-                      props: {
-                        value: isHeader,
-                        title: GlobalConfig.i18n('vxe.export.expHeaderTitle'),
-                        content: GlobalConfig.i18n('vxe.export.expOptHeader')
-                      },
-                      on: {
-                        input (value) {
-                          defaultOptions.isHeader = value
-                        }
-                      }
-                    }),
-                    h('vxe-checkbox', {
-                      props: {
-                        value: defaultOptions.isFooter,
-                        disabled: !storeData.hasFooter,
-                        title: GlobalConfig.i18n('vxe.export.expFooterTitle'),
-                        content: GlobalConfig.i18n('vxe.export.expOptFooter')
-                      },
-                      on: {
-                        input (value) {
-                          defaultOptions.isFooter = value
-                        }
-                      }
-                    }),
-                    h('vxe-checkbox', {
-                      props: {
-                        value: defaultOptions.original,
-                        title: GlobalConfig.i18n('vxe.export.expOriginalTitle'),
-                        content: GlobalConfig.i18n('vxe.export.expOptOriginal')
-                      },
-                      on: {
-                        input (value) {
-                          defaultOptions.original = value
-                        }
-                      }
-                    })
-                  ]),
-                  h('div', {
-                    class: 'vxe-export--panel-option-row'
-                  }, [
-                    h('vxe-checkbox', {
-                      props: {
-                        value: isHeader && hasColgroup && supportMerge ? defaultOptions.isColgroup : false,
-                        disabled: !isHeader || !hasColgroup || !supportMerge,
-                        title: GlobalConfig.i18n('vxe.export.expColgroupTitle'),
-                        content: GlobalConfig.i18n('vxe.export.expOptColgroup')
-                      },
-                      on: {
-                        input (value) {
-                          defaultOptions.isColgroup = value
-                        }
-                      }
-                    }),
-                    h('vxe-checkbox', {
-                      props: {
-                        value: hasMerge && supportMerge && checkedAll ? defaultOptions.isMerge : false,
-                        disabled: !hasMerge || !supportMerge || !checkedAll,
-                        title: GlobalConfig.i18n('vxe.export.expMergeTitle'),
-                        content: GlobalConfig.i18n('vxe.export.expOptMerge')
-                      },
-                      on: {
-                        input (value) {
-                          defaultOptions.isMerge = value
-                        }
-                      }
-                    }),
-                    isPrint ? _e() : h('vxe-checkbox', {
-                      props: {
-                        value: supportStyle ? defaultOptions.useStyle : false,
-                        disabled: !supportStyle,
-                        title: GlobalConfig.i18n('vxe.export.expUseStyleTitle'),
-                        content: GlobalConfig.i18n('vxe.export.expOptUseStyle')
-                      },
-                      on: {
-                        input (value) {
-                          defaultOptions.useStyle = value
-                        }
-                      }
-                    }),
-                    h('vxe-checkbox', {
-                      props: {
-                        value: hasTree ? defaultOptions.isAllExpand : false,
-                        disabled: !hasTree,
-                        title: GlobalConfig.i18n('vxe.export.expAllExpandTitle'),
-                        content: GlobalConfig.i18n('vxe.export.expOptAllExpand')
-                      },
-                      on: {
-                        input (value) {
-                          defaultOptions.isAllExpand = value
-                        }
-                      }
-                    })
-                  ])
-                ])
-              ])
-            ]
-          ])
-        ]),
-        h('div', {
-          class: 'vxe-export--panel-btns'
-        }, [
-          h('vxe-button', {
-            props: {
-              content: GlobalConfig.i18n('vxe.export.expCancel')
-            },
-            on: {
-              click: this.cancelEvent
-            }
-          }),
-          h('vxe-button', {
-            ref: 'confirmBtn',
-            props: {
-              status: 'primary',
-              content: GlobalConfig.i18n(isPrint ? 'vxe.export.expPrint' : 'vxe.export.expConfirm')
-            },
-            on: {
-              click: this.confirmEvent
-            }
-          })
-        ])
-      ])
-    ])
-  },
-  methods: {
-    changeOption (column) {
-      const isChecked = !column.checked
-      XEUtils.eachTree([column], (item) => {
-        item.checked = isChecked
-        item.halfChecked = false
-      })
-      this.handleOptionCheck(column)
-      this.checkStatus()
-    },
-    handleOptionCheck (column) {
-      const matchObj = XEUtils.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.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.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.$parent
-      this.loading = true
-      $xetable.exportData(Object.assign({}, $xetable.exportOpts, this.getExportOption())).then(() => {
-        this.loading = false
-        this.storeData.visible = false
-      }).catch(() => {
-        this.loading = false
-      })
-    }
-  }
-}

package/packages/export/src/import-panel.js

@@ -1,184 +0,0 @@
-import XEUtils from 'xe-utils'
-import GlobalConfig from '../../v-x-e-table/src/conf'
-import VxeModal from '../../modal/src/modal'
-import VxeRadio from '../../radio/src/radio'
-import UtilTools from '../../tools/utils'
-
-export default {
-  name: 'VxeTableImportPanel',
-  props: {
-    defaultOptions: Object,
-    storeData: Object
-  },
-  components: {
-    VxeModal,
-    VxeRadio
-  },
-  data () {
-    return {
-      loading: false
-    }
-  },
-  computed: {
-    vSize () {
-      return this.size || this.$parent.size || this.$parent.vSize
-    },
-    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.find(typeList, item => type === item.value)
-        return selectItem ? selectItem.label : '*.*'
-      }
-      return `*.${typeList.map(item => item.value).join(', *.')}`
-    }
-  },
-  render (h) {
-    const { hasFile, parseTypeLabel, defaultOptions, storeData, selectName } = this
-    return h('vxe-modal', {
-      res: 'modal',
-      props: {
-        value: storeData.visible,
-        title: GlobalConfig.i18n('vxe.import.impTitle'),
-        width: 520,
-        mask: true,
-        lockView: true,
-        showFooter: false,
-        escClosable: true,
-        maskClosable: true,
-        loading: this.loading
-      },
-      on: {
-        input (value) {
-          storeData.visible = value
-        },
-        show: this.showEvent
-      }
-    }, [
-      h('div', {
-        class: 'vxe-export--panel'
-      }, [
-        h('table', {
-          attrs: {
-            cellspacing: 0,
-            cellpadding: 0,
-            border: 0
-          }
-        }, [
-          h('tbody', [
-            h('tr', [
-              h('td', GlobalConfig.i18n('vxe.import.impFile')),
-              h('td', [
-                hasFile ? h('div', {
-                  class: 'vxe-import-selected--file',
-                  attrs: {
-                    title: selectName
-                  }
-                }, [
-                  h('span', selectName),
-                  h('i', {
-                    class: GlobalConfig.icon.INPUT_CLEAR,
-                    on: {
-                      click: this.clearFileEvent
-                    }
-                  })
-                ]) : h('button', {
-                  ref: 'fileBtn',
-                  class: 'vxe-import-select--file',
-                  attrs: {
-                    type: 'button'
-                  },
-                  on: {
-                    click: this.selectFileEvent
-                  }
-                }, GlobalConfig.i18n('vxe.import.impSelect'))
-              ])
-            ]),
-            h('tr', [
-              h('td', GlobalConfig.i18n('vxe.import.impType')),
-              h('td', parseTypeLabel)
-            ]),
-            h('tr', [
-              h('td', GlobalConfig.i18n('vxe.import.impMode')),
-              h('td', [
-                h('vxe-select', {
-                  props: {
-                    value: defaultOptions.mode,
-                    options: storeData.modeList
-                  },
-                  on: {
-                    input (value) {
-                      defaultOptions.mode = value
-                    }
-                  }
-                })
-              ])
-            ])
-          ])
-        ]),
-        h('div', {
-          class: 'vxe-export--panel-btns'
-        }, [
-          h('vxe-button', {
-            on: {
-              click: this.cancelEvent
-            }
-          }, GlobalConfig.i18n('vxe.import.impCancel')),
-          h('vxe-button', {
-            props: {
-              status: 'primary',
-              disabled: !hasFile
-            },
-            on: {
-              click: this.importEvent
-            }
-          }, GlobalConfig.i18n('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, UtilTools.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
-      })
-    }
-  }
-}