releases 4.10.6

examples/views/table/TableTest8.vue

@@ -12,6 +12,7 @@
       :scroll-x="{enabled: true, gt: 0}"
       :scroll-y="{enabled: true, gt: 0}"
       :checkbox-config="{ highlight: true, range: true}"
+      :resizable-config="resizableConfig"
       :data="tableData"
       :footer-data="footerData">
       <vxe-column field="checkbox" type="checkbox" width="80" fixed="left" drag-sort row-resize></vxe-column>
@@ -116,7 +117,7 @@
 
 <script lang="ts" setup>
 import { ref, reactive, nextTick } from 'vue'
-import { VxeColumnPropTypes } from '../../../types'
+import { VxeColumnPropTypes, VxeTablePropTypes } from '../../../types'
 
 interface RowVO {
   id: number
@@ -129,6 +130,11 @@ const footerData = ref([
 ])
 const loading = ref(false)
 
+const resizableConfig = reactive<VxeTablePropTypes.ResizableConfig>({
+  isDblclickAutoHeight: true,
+  isDblclickAutoWidth: true
+})
+
 const flag1CellRender = reactive<VxeColumnPropTypes.CellRender>({
   name: 'VxeSwitch'
 })

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vxe-table",
-  "version": "4.10.6-beta.21",
+  "version": "4.10.6-beta.27",
   "description": "一个基于 vue 的 PC 端表格组件，支持增删改查、虚拟树、拖拽排序，懒加载、快捷菜单、数据校验、树形结构、打印、导入导出、自定义模板、渲染器、JSON 配置式...",
   "scripts": {
     "update": "npm install --legacy-peer-deps",
@@ -28,7 +28,7 @@
   "style": "lib/style.css",
   "typings": "types/index.d.ts",
   "dependencies": {
-    "vxe-pc-ui": "^4.3.75"
+    "vxe-pc-ui": "^4.3.77"
   },
   "devDependencies": {
     "@types/resize-observer-browser": "^0.1.11",

packages/locale/lang/en-US.ts

@@ -445,7 +445,7 @@ export default {
           fontBold: 'Bold'
         },
         subtableProp: {
-          seqTitle: 'serial number',
+          seqTitle: 'Serial number',
           showSeq: 'Display serial number',
           showCheckbox: 'Allow multiple selections',
           errSubDrag: 'The subtable does not support this control, please use other controls',

packages/table/module/export/hook.ts

@@ -126,8 +126,8 @@ function toTxtCellLabel (val: any) {
   return val
 }
 
-function getElementsByTagName (elem: any, qualifiedName: any): any[] {
-  return elem.getElementsByTagName(qualifiedName)
+function getElementsByTagName (elem: any, qualifiedName: any) {
+  return elem.getElementsByTagName(qualifiedName) as HTMLElement[]
 }
 
 function getTxtCellKey (now: number) {
@@ -143,7 +143,25 @@ function getTxtCellValue (val: any, vMaps: any) {
   return rest.replace(/^"+$/g, (qVal: any) => '"'.repeat(Math.ceil(qVal.length / 2)))
 }
 
-function parseCsvAndTxt (columns: any[], content: string, cellSeparator: string) {
+function toExportField (tableConf: {
+  fieldMaps: Record<string, VxeTableDefines.ColumnInfo>
+  titleMaps: Record<string, VxeTableDefines.ColumnInfo>
+}, field: string) {
+  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: {
+  fieldMaps: Record<string, VxeTableDefines.ColumnInfo>
+  titleMaps: Record<string, VxeTableDefines.ColumnInfo>
+}, content: string, cellSeparator: string) {
   const list = content.split(enterSymbol)
   const rows: any[] = []
   let fields: string[] = []
@@ -162,9 +180,9 @@ function parseCsvAndTxt (columns: any[], content: string, cellSeparator: string)
           vMaps[key] = replaceTxtCell(cVal, vMaps)
           return key
         })
-        const cells = rVal.split(cellSeparator)
+        const cells: string[] = rVal.split(cellSeparator)
         if (!fields.length) {
-          fields = cells.map((val) => getTxtCellValue(val.trim(), vMaps))
+          fields = cells.map((val: string) => toExportField(tableConf, getTxtCellValue(val.trim(), vMaps)))
         } else {
           cells.forEach((val, colIndex) => {
             if (colIndex < fields.length) {
@@ -179,28 +197,37 @@ function parseCsvAndTxt (columns: any[], content: string, cellSeparator: string)
   return { fields, rows }
 }
 
-function parseCsv (columns: any, content: any) {
-  return parseCsvAndTxt(columns, content, ',')
+function parseCsv (tableConf: {
+  fieldMaps: Record<string, VxeTableDefines.ColumnInfo>
+  titleMaps: Record<string, VxeTableDefines.ColumnInfo>
+}, content: string) {
+  return parseCsvAndTxt(tableConf, content, ',')
 }
 
-function parseTxt (columns: any, content: any) {
-  return parseCsvAndTxt(columns, content, '\t')
+function parseTxt (tableConf: {
+  fieldMaps: Record<string, VxeTableDefines.ColumnInfo>
+  titleMaps: Record<string, VxeTableDefines.ColumnInfo>
+}, content: string) {
+  return parseCsvAndTxt(tableConf, content, '\t')
 }
 
-function parseHTML (columns: any, content: any) {
+function parseHTML (tableConf: {
+  fieldMaps: Record<string, VxeTableDefines.ColumnInfo>
+  titleMaps: Record<string, VxeTableDefines.ColumnInfo>
+}, content: string) {
   const domParser = new DOMParser()
   const xmlDoc = domParser.parseFromString(content, 'text/html')
   const bodyNodes = getElementsByTagName(xmlDoc, 'body')
-  const rows: any = []
-  const fields: any = []
+  const rows: any[] = []
+  const fields: string[] = []
   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(cellNode.textContent)
+            fields.push(toExportField(tableConf, cellNode.textContent || ''))
           })
         })
         const tbodyNodes = getElementsByTagName(tableNodes[0], 'tbody')
@@ -221,19 +248,22 @@ function parseHTML (columns: any, content: any) {
   return { fields, rows }
 }
 
-function parseXML (columns: any, content: any) {
+function parseXML (tableConf: {
+  fieldMaps: Record<string, VxeTableDefines.ColumnInfo>
+  titleMaps: Record<string, VxeTableDefines.ColumnInfo>
+}, content: string) {
   const domParser = new DOMParser()
   const xmlDoc = domParser.parseFromString(content, 'application/xml')
   const sheetNodes = getElementsByTagName(xmlDoc, 'Worksheet')
-  const rows: any = []
-  const fields: any = []
+  const rows: any[] = []
+  const fields: string[] = []
   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(cellNode.textContent)
+          fields.push(toExportField(tableConf, cellNode.textContent || ''))
         })
         XEUtils.arrayEach(rowNodes, (rowNode, index) => {
           if (index) {
@@ -263,22 +293,6 @@ function clearColumnConvert (columns: any) {
   }, { children: 'children' })
 }
 
-/**
- * 检查导入的列是否完整
- * @param {Array} fields 字段名列表
- * @param {Array} rows 数据列表
- */
-function checkImportData (columns: any[], fields: string[]) {
-  const tableFields: string[] = []
-  columns.forEach((column) => {
-    const field = column.field
-    if (field) {
-      tableFields.push(field)
-    }
-  })
-  return fields.some(field => tableFields.indexOf(field) > -1)
-}
-
 const tableExportMethodKeys: (keyof TableExportMethods)[] = ['exportData', 'importByFile', 'importData', 'saveFile', 'readFile', 'print', 'getPrintHtml', 'openImport', 'closeImport', 'openExport', 'closeExport', 'openPrint', 'closePrint']
 
 hooks.add('tableExportModule', {
@@ -820,22 +834,38 @@ hooks.add('tableExportModule', {
         fields: string[];
         rows: any[];
       } = { fields: [], rows: [] }
+      const tableFieldMaps: Record<string, VxeTableDefines.ColumnInfo> = {}
+      const tableTitleMaps: Record<string, VxeTableDefines.ColumnInfo> = {}
+      tableFullColumn.forEach((column) => {
+        const field = column.field
+        const title = column.getTitle()
+        if (field) {
+          tableFieldMaps[field] = column
+        }
+        if (title) {
+          tableTitleMaps[column.getTitle()] = column
+        }
+      })
+      const tableConf = {
+        fieldMaps: tableFieldMaps,
+        titleMaps: tableTitleMaps
+      }
       switch (opts.type) {
         case 'csv':
-          rest = parseCsv(tableFullColumn, content)
+          rest = parseCsv(tableConf, content)
           break
         case 'txt':
-          rest = parseTxt(tableFullColumn, content)
+          rest = parseTxt(tableConf, content)
           break
         case 'html':
-          rest = parseHTML(tableFullColumn, content)
+          rest = parseHTML(tableConf, content)
           break
         case 'xml':
-          rest = parseXML(tableFullColumn, content)
+          rest = parseXML(tableConf, content)
           break
       }
       const { fields, rows } = rest
-      const status = checkImportData(tableFullColumn, fields)
+      const status = fields.some(field => tableFieldMaps[field] || tableTitleMaps[field])
       if (status) {
         $xeTable.createData(rows)
           .then((data: any) => {