vxe-table 4.10.6-beta.3 → 4.10.6-beta.30

package/packages/locale/lang/vi-VN.ts

@@ -77,7 +77,8 @@ export default {
       customRestore: '恢复默认',
       maxFixedCol: '最大冻结列的数量不能超过 {0} 个',
       dragTip: '移动：{0}',
-      resizeColTip: '{0} 像素'
+      resizeColTip: '宽：{0} 像素',
+      resizeRowTip: '高：{0} 像素'
     },
     grid: {
       selectOneRecord: '请至少选择一条记录！',

package/packages/locale/lang/zh-CHT.ts

@@ -77,7 +77,8 @@ export default {
       customRestore: '恢復預設',
       maxFixedCol: '最大凍結列的數量不能超過 {0} 個',
       dragTip: '移動：{0}',
-      resizeColTip: '{0} 像素'
+      resizeColTip: '宽：{0} 像素',
+      resizeRowTip: '高：{0} 像素'
     },
     grid: {
       selectOneRecord: '請至少選擇一筆記錄！',

package/packages/locale/lang/zh-CN.ts

@@ -77,7 +77,8 @@ export default {
       customRestore: '恢复默认',
       maxFixedCol: '最大冻结列的数量不能超过 {0} 个',
       dragTip: '移动：{0}',
-      resizeColTip: '{0} 像素'
+      resizeColTip: '宽：{0} 像素',
+      resizeRowTip: '高：{0} 像素'
     },
     grid: {
       selectOneRecord: '请至少选择一条记录！',

package/packages/table/module/edit/hook.ts

@@ -86,7 +86,7 @@ hooks.add('tableEditModule', {
           }
           parentChilds[funcName](item)
           mapChilds[funcName](item)
-          const rest = { row: item, rowid, seq: -1, index: -1, _index: -1, $index: -1, items: parentChilds, parent: parentRow, level: parentLevel + 1, height: 0, oTop: 0 }
+          const rest = { row: item, rowid, seq: -1, index: -1, _index: -1, $index: -1, treeIndex: -1, items: parentChilds, parent: parentRow, level: parentLevel + 1, height: 0, resizeHeight: 0, oTop: 0 }
           fullDataRowIdData[rowid] = rest
           fullAllDataRowIdData[rowid] = rest
         } else {
@@ -97,7 +97,7 @@ hooks.add('tableEditModule', {
           }
           afterFullData[funcName](item)
           tableFullTreeData[funcName](item)
-          const rest = { row: item, rowid, seq: -1, index: -1, _index: -1, $index: -1, items: tableFullTreeData, parent: null, level: 0, height: 0, oTop: 0 }
+          const rest = { row: item, rowid, seq: -1, index: -1, _index: -1, $index: -1, treeIndex: -1, items: tableFullTreeData, parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0 }
           fullDataRowIdData[rowid] = rest
           fullAllDataRowIdData[rowid] = rest
         }
@@ -122,7 +122,7 @@ hooks.add('tableEditModule', {
         } else {
           newRecords.forEach(item => {
             const rowid = getRowid($xeTable, item)
-            const rest = { row: item, rowid, seq: -1, index: -1, _index: -1, $index: -1, items: afterFullData, parent: null, level: 0, height: 0, oTop: 0 }
+            const rest = { row: item, rowid, seq: -1, index: -1, _index: -1, $index: -1, treeIndex: -1, items: afterFullData, parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0 }
             fullDataRowIdData[rowid] = rest
             fullAllDataRowIdData[rowid] = rest
             afterFullData.unshift(item)
@@ -144,7 +144,7 @@ hooks.add('tableEditModule', {
           } else {
             newRecords.forEach(item => {
               const rowid = getRowid($xeTable, item)
-              const rest = { row: item, rowid, seq: -1, index: -1, _index: -1, $index: -1, items: afterFullData, parent: null, level: 0, height: 0, oTop: 0 }
+              const rest = { row: item, rowid, seq: -1, index: -1, _index: -1, treeIndex: -1, $index: -1, items: afterFullData, parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0 }
               fullDataRowIdData[rowid] = rest
               fullAllDataRowIdData[rowid] = rest
               afterFullData.push(item)
@@ -184,7 +184,7 @@ hooks.add('tableEditModule', {
                   targetIndex = targetIndex + 1
                 }
                 parentMapChilds.splice(targetIndex, 0, item)
-                const rest = { row: item, rowid, seq: -1, index: -1, _index: -1, $index: -1, items: parentMapChilds, parent: parentRow, level: parentLevel + 1, height: 0, oTop: 0 }
+                const rest = { row: item, rowid, seq: -1, index: -1, _index: -1, $index: -1, treeIndex: -1, items: parentMapChilds, parent: parentRow, level: parentLevel + 1, height: 0, resizeHeight: 0, oTop: 0 }
                 fullDataRowIdData[rowid] = rest
                 fullAllDataRowIdData[rowid] = rest
               })
@@ -251,7 +251,7 @@ hooks.add('tableEditModule', {
         const rowid = getRowid($xeTable, newRow)
         insertMaps[rowid] = newRow
       })
-      $xeTable.cacheRowMap()
+      $xeTable.cacheRowMap(false)
       $xeTable.updateScrollYStatus()
       $xeTable.handleTableData(treeConfig && transform)
       if (!(treeConfig && transform)) {
@@ -469,7 +469,7 @@ hooks.add('tableEditModule', {
         editStore.insertMaps = insertDataRowMaps
         reactData.pendingRowMaps = pendingDataRowMaps
         $xeTable.updateFooter()
-        $xeTable.cacheRowMap()
+        $xeTable.cacheRowMap(false)
         $xeTable.handleTableData(treeConfig && transform)
         if (!(treeConfig && transform)) {
           $xeTable.updateAfterDataIndex()

package/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,20 +197,29 @@ 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) {
@@ -200,7 +227,7 @@ function parseHTML (columns: any, content: any) {
       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) => {
@@ -944,6 +974,45 @@ hooks.add('tableExportModule', {
       })
     }
 
+    const handleFilterColumns = (exportOpts: VxeTablePropTypes.ExportConfig, column: VxeTableDefines.ColumnInfo, columns: VxeTableDefines.ColumnInfo[] | VxeTablePropTypes.ExportOrPrintColumnOption[]) => {
+      return columns.some((item: any) => {
+        if (isColumnInfo(item)) {
+          return column.id === (item as any).id
+        } else if (XEUtils.isString(item)) {
+          return column.field === item
+        } else {
+          const colid = item.id || item.colId
+          const type = item.type
+          const field = item.field
+          if (colid) {
+            return column.id === colid
+          } else if (field && type) {
+            return column.field === field && column.type === type
+          } else if (field) {
+            return column.field === field
+          } else if (type) {
+            return column.type === type
+          }
+        }
+        return false
+      })
+    }
+
+    const handleFilterFields = (exportOpts: VxeTablePropTypes.ExportConfig, column: VxeTableDefines.ColumnInfo, includeFields: string[] | undefined, excludeFields: string[] | undefined) => {
+      if (excludeFields) {
+        if (XEUtils.includes(excludeFields, column.field)) {
+          return false
+        }
+      }
+      if (includeFields) {
+        if (XEUtils.includes(includeFields, column.field)) {
+          return true
+        }
+        return false
+      }
+      return exportOpts.original ? column.field : defaultFilterExportColumn(column)
+    }
+
     const handleExportAndPrint = (options: VxeTablePropTypes.ExportOpts | VxeTablePropTypes.ExportConfig, isPrint?: boolean) => {
       const { treeConfig, showHeader, showFooter } = props
       const { initStore, mergeList, mergeFooterList, isGroup, footerTableData, exportStore, exportParams } = reactData
@@ -969,7 +1038,7 @@ hooks.add('tableExportModule', {
       const modes: string[] = defOpts.modes || []
       const checkMethod = customOpts.checkMethod
       const exportColumns = collectColumn.slice(0)
-      const { columns } = defOpts
+      const { columns, excludeFields, includeFields } = defOpts
       // 处理类型
       const typeList = types.map((value) => {
         return {
@@ -992,33 +1061,17 @@ hooks.add('tableExportModule', {
       // 默认选中
       XEUtils.eachTree(exportColumns, (column, index, items, path, parent) => {
         const isColGroup = column.children && column.children.length
-        if (isColGroup || defaultFilterExportColumn(column)) {
-          column.checked = columns
-            ? columns.some((item: any) => {
-              if (isColumnInfo(item)) {
-                return column.id === item.id
-              } else if (XEUtils.isString(item)) {
-                return column.field === item
-              } else {
-                const colid = item.id || item.colId
-                const type = item.type
-                const field = item.field
-                if (colid) {
-                  return column.id === colid
-                } else if (field && type) {
-                  return column.field === field && column.type === type
-                } else if (field) {
-                  return column.field === field
-                } else if (type) {
-                  return column.type === type
-                }
-              }
-              return false
-            })
-            : column.visible
-          column.halfChecked = false
-          column.disabled = (parent && parent.disabled) || (checkMethod ? !checkMethod({ column }) : false)
+        let isChecked = false
+        if (columns && columns.length) {
+          isChecked = handleFilterColumns(defOpts, column, columns)
+        } else if (excludeFields || includeFields) {
+          isChecked = handleFilterFields(defOpts, column, includeFields, excludeFields)
+        } else {
+          isChecked = column.visible && (isColGroup || defaultFilterExportColumn(column))
         }
+        column.checked = isChecked
+        column.halfChecked = false
+        column.disabled = (parent && parent.disabled) || (checkMethod ? !checkMethod({ column }) : false)
       })
       // 更新条件
       Object.assign(exportStore, {

package/packages/table/module/keyboard/hook.ts

@@ -33,33 +33,61 @@ hooks.add('tableKeyboardModule', {
   setupTable ($xeTable) {
     const { props, reactData, internalData } = $xeTable
     const { refElem } = $xeTable.getRefMaps()
-    const { computeEditOpts, computeCheckboxOpts, computeMouseOpts, computeTreeOpts } = $xeTable.getComputeMaps()
+    const { computeEditOpts, computeCheckboxOpts, computeMouseOpts, computeTreeOpts, computeRowOpts, computeCellOpts, computeDefaultRowHeight } = $xeTable.getComputeMaps()
 
     function getCheckboxRangeRows (evnt: MouseEvent, params: any, targetTrElem: HTMLElement, trRect: DOMRect, offsetClientTop: number, moveRange: number) {
+      const { showOverflow } = props
+      const { fullAllDataRowIdData, isResizeCellHeight } = internalData
+      const rowOpts = computeRowOpts.value
+      const cellOpts = computeCellOpts.value
+      const defaultRowHeight = computeDefaultRowHeight.value
+      const { row } = params
       let countHeight = 0
       let rangeRows: any[] = []
       let moveSize = 0
       const isDown = moveRange > 0
-      const { scrollYLoad, rowHeight } = reactData
+      const { scrollYLoad } = reactData
       const { afterFullData } = internalData
+      if (isDown) {
+        moveSize = offsetClientTop + moveRange
+      } else {
+        moveSize = (trRect.height - offsetClientTop) + Math.abs(moveRange)
+      }
       if (scrollYLoad) {
-        if (isDown) {
-          moveSize = offsetClientTop + moveRange
-        } else {
-          moveSize = (trRect.height - offsetClientTop) + Math.abs(moveRange)
-        }
-        const _rowIndex = $xeTable.getVTRowIndex(params.row)
-        if (isDown) {
-          rangeRows = afterFullData.slice(_rowIndex, _rowIndex + Math.ceil(moveSize / rowHeight))
+        const _rowIndex = $xeTable.getVTRowIndex(row)
+        const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height
+        if (!isCustomCellHeight && showOverflow) {
+          if (isDown) {
+            rangeRows = afterFullData.slice(_rowIndex, _rowIndex + Math.ceil(moveSize / defaultRowHeight))
+          } else {
+            rangeRows = afterFullData.slice(_rowIndex - Math.floor(moveSize / defaultRowHeight), _rowIndex + 1)
+          }
         } else {
-          rangeRows = afterFullData.slice(_rowIndex - Math.floor(moveSize / rowHeight), _rowIndex + 1)
+          if (isDown) {
+            for (let i = _rowIndex; i < afterFullData.length; i++) {
+              const item = afterFullData[i]
+              const rowid = $xeTable.getRowid(item)
+              const rowRest = fullAllDataRowIdData[rowid] || {}
+              countHeight += rowRest.resizeHeight || cellOpts.height || rowOpts.height || defaultRowHeight
+              rangeRows.push(item)
+              if (countHeight > moveSize) {
+                return rangeRows
+              }
+            }
+          } else {
+            for (let len = _rowIndex; len >= 0; len--) {
+              const item = afterFullData[len]
+              const rowid = $xeTable.getRowid(item)
+              const rowRest = fullAllDataRowIdData[rowid] || {}
+              countHeight += rowRest.resizeHeight || cellOpts.height || rowOpts.height || defaultRowHeight
+              rangeRows.push(item)
+              if (countHeight > moveSize) {
+                return rangeRows
+              }
+            }
+          }
         }
       } else {
-        if (isDown) {
-          moveSize = evnt.clientY - trRect.y
-        } else {
-          moveSize = trRect.y - evnt.clientY + trRect.height
-        }
         const siblingProp = isDown ? 'next' : 'previous'
         while (targetTrElem && countHeight < moveSize) {
           const rowNodeRest = $xeTable.getRowNode(targetTrElem)
@@ -74,19 +102,25 @@ hooks.add('tableKeyboardModule', {
     }
 
     const handleCheckboxRangeEvent = (evnt: any, params: any) => {
+      const { elemStore } = internalData
+      const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
+      const leftScrollElem = getRefElem(elemStore['left-body-scroll'])
+      const rightScrollElem = getRefElem(elemStore['right-body-scroll'])
       const { column, cell } = params
       if (column.type === 'checkbox') {
-        const el = refElem.value
-        const { elemStore } = internalData
-        const disX = evnt.clientX
-        const disY = evnt.clientY
-        const bodyWrapperElem = getRefElem(elemStore[`${column.fixed || 'main'}-body-wrapper`] || elemStore['main-body-wrapper'])
+        let bodyWrapperElem = bodyScrollElem as HTMLElement
+        if (leftScrollElem && column.fixed === 'left') {
+          bodyWrapperElem = leftScrollElem
+        } else if (rightScrollElem && column.fixed === 'right') {
+          bodyWrapperElem = rightScrollElem
+        }
         if (!bodyWrapperElem) {
           return
         }
+        const el = refElem.value
+        const disX = evnt.clientX
+        const disY = evnt.clientY
         const checkboxRangeElem = bodyWrapperElem.querySelector('.vxe-table--checkbox-range') as HTMLElement
-        const domMousemove = document.onmousemove
-        const domMouseup = document.onmouseup
         const trElem = cell.parentElement as HTMLElement
         const selectRecords = $xeTable.getCheckboxRecords()
         let lastRangeRows: any[] = []
@@ -215,8 +249,8 @@ hooks.add('tableKeyboardModule', {
           stopMouseScroll()
           removeClass(el, 'drag--range')
           checkboxRangeElem.removeAttribute('style')
-          document.onmousemove = domMousemove
-          document.onmouseup = domMouseup
+          document.onmousemove = null
+          document.onmouseup = null
           triggerEvent('end', evnt)
         }
         triggerEvent('start', evnt)