vxe-table 3.11.36 → 3.11.38-beta.0

package/packages/table/render/index.ts

@@ -459,7 +459,7 @@ function defaultSelectEditRender (h: CreateElement, renderOpts: any, params: any
   ]
 }
 
-function defaultTreeSelectEditRender (h: CreateElement, renderOpts: any, params: any) {
+function defaultTableOrTreeSelectEditRender (h: CreateElement, renderOpts: any, params: any) {
   const { row, column } = params
   const { options, optionProps } = renderOpts
   const cellValue = getCellValue(row, column)
@@ -724,7 +724,7 @@ renderer.mixin({
   },
   VxeTreeSelect: {
     tableAutoFocus: 'input',
-    renderTableEdit: defaultTreeSelectEditRender,
+    renderTableEdit: defaultTableOrTreeSelectEditRender,
     renderTableCell (h, renderOpts, params) {
       return getCellLabelVNs(h, renderOpts, params, getTreeSelectCellValue(renderOpts, params))
     },
@@ -732,15 +732,53 @@ renderer.mixin({
   },
   VxeTableSelect: {
     tableAutoFocus: 'input',
-    renderTableEdit: defaultTreeSelectEditRender,
+    renderTableEdit: defaultTableOrTreeSelectEditRender,
     renderTableCell (h, renderOpts, params) {
       return getCellLabelVNs(h, renderOpts, params, getTreeSelectCellValue(renderOpts, params))
     },
     tableExportMethod: handleExportTreeSelectMethod
   },
+  VxeColorPicker: {
+    tableAutoFocus: 'input',
+    renderTableEdit (h, renderOpts, params) {
+      const { row, column } = params
+      const { options } = renderOpts
+      const cellValue = getCellValue(row, column)
+      return [
+        h(getDefaultComponent(renderOpts), {
+          props: getCellEditProps(renderOpts, params, cellValue, { colors: options }),
+          on: getEditOns(renderOpts, params)
+        })
+      ]
+    },
+    renderTableCell (h, renderOpts, params) {
+      const { row, column } = params
+      const cellValue = XEUtils.get(row, column.field)
+      return h('span', {
+        class: 'vxe-color-picker--readonly'
+      }, [
+        h('div', {
+          class: 'vxe-color-picker--readonly-color',
+          style: {
+            backgroundColor: cellValue
+          }
+        })
+      ])
+    }
+  },
   VxeIconPicker: {
     tableAutoFocus: 'input',
-    renderTableEdit: defaultEditRender,
+    renderTableEdit (h, renderOpts, params) {
+      const { row, column } = params
+      const { options } = renderOpts
+      const cellValue = getCellValue(row, column)
+      return [
+        h(getDefaultComponent(renderOpts), {
+          props: getCellEditProps(renderOpts, params, cellValue, { icons: options }),
+          on: getEditOns(renderOpts, params)
+        })
+      ]
+    },
     renderTableCell (h, renderOpts, params) {
       const { row, column } = params
       const cellValue = XEUtils.get(row, column.field)

package/packages/table/src/body.ts

@@ -337,7 +337,7 @@ function renderColumn (h: any, _vm: any, $xetable: any, seq: any, rowid: any, fi
       getClass(className, params),
       getClass(allCellClassName, params)
     ],
-    key: columnKey || columnOpts.useKey || rowOpts.useKey || columnOpts.drag ? column.id : $columnIndex,
+    key: columnKey || scrollXLoad || scrollYLoad || columnOpts.useKey || rowOpts.useKey || columnOpts.drag ? column.id : $columnIndex,
     attrs,
     style: Object.assign({
       height: cellHeight
@@ -362,6 +362,7 @@ function renderRows (h: CreateElement, _vm: any, $xeTable: any, fixedType: any,
     expandOpts,
     editOpts,
     treeExpandedMaps,
+    scrollXLoad,
     scrollYLoad,
     rowExpandedMaps,
     radioOpts,
@@ -467,7 +468,7 @@ function renderRows (h: CreateElement, _vm: any, $xeTable: any, fixedType: any,
             rowid
           },
           style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(params) : rowStyle) : null,
-          key: rowKey || rowOpts.useKey || rowOpts.drag || columnOpts.drag || treeConfig ? rowid : $rowIndex,
+          key: rowKey || scrollXLoad || scrollYLoad || rowOpts.useKey || rowOpts.drag || columnOpts.drag || treeConfig ? rowid : $rowIndex,
           nativeOn: trOn
         }, tdVNs)
         : h('tr', {
@@ -476,7 +477,7 @@ function renderRows (h: CreateElement, _vm: any, $xeTable: any, fixedType: any,
             rowid
           },
           style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(params) : rowStyle) : null,
-          key: rowKey || rowOpts.useKey || rowOpts.drag || columnOpts.drag || treeConfig ? rowid : $rowIndex,
+          key: rowKey || scrollXLoad || scrollYLoad || rowOpts.useKey || rowOpts.drag || columnOpts.drag || treeConfig ? rowid : $rowIndex,
           on: trOn
         }, tdVNs)
     )

package/packages/table/src/footer.ts

@@ -26,7 +26,7 @@ function mergeFooterMethod (mergeFooterList: any, _rowIndex: any, _columnIndex:
 
 function renderRows (h: CreateElement, _vm: any, tableColumn: VxeTableDefines.ColumnInfo[], footerTableData: any[], row: any, $rowIndex: number, _rowIndex: number) {
   const { $parent: $xetable, fixedType } = _vm
-  const { $listeners: tableListeners, footerCellClassName, footerCellStyle, footerAlign: allFooterAlign, mergeFooterList, footerSpanMethod, align: allAlign, scrollXLoad, columnKey, columnOpts, showFooterOverflow: allColumnFooterOverflow, currentColumn, overflowX, scrollbarWidth, tooltipOpts } = $xetable
+  const { $listeners: tableListeners, footerCellClassName, footerCellStyle, footerAlign: allFooterAlign, mergeFooterList, footerSpanMethod, align: allAlign, scrollXLoad, columnKey, columnOpts, showFooterOverflow: allColumnFooterOverflow, currentColumn, overflowX, scrollYLoad, scrollbarWidth, tooltipOpts } = $xetable
 
   return tableColumn.map((column: any, $columnIndex: any) => {
     const { type, showFooterOverflow, footerAlign, align, footerClassName, editRender, cellRender } = column
@@ -135,7 +135,7 @@ function renderRows (h: CreateElement, _vm: any, tableColumn: VxeTableDefines.Co
       attrs,
       style: footerCellStyle ? (XEUtils.isFunction(footerCellStyle) ? footerCellStyle(cellParams) : footerCellStyle) : null,
       on: tfOns,
-      key: columnKey || columnOpts.useKey || columnOpts.drag ? column.id : $columnIndex
+      key: columnKey || scrollXLoad || scrollYLoad || columnOpts.useKey || columnOpts.drag ? column.id : $columnIndex
     }, [
       h('div', {
         class: ['vxe-cell', {
@@ -170,6 +170,7 @@ function renderHeads (h: CreateElement, _vm: any, footerTableData: any[]) {
 
     if (columnOpts.drag && columnDragOpts.animation) {
       return h('transition-group', {
+        key: $rowIndex,
         props: {
           tag: 'tr',
           name: `vxe-header--col-list${isDragColMove ? '' : '-disabled'}`,
@@ -182,6 +183,7 @@ function renderHeads (h: CreateElement, _vm: any, footerTableData: any[]) {
       }, renderRows(h, _vm, tableColumn, footerTableData, row, $rowIndex, _rowIndex))
     }
     return h('tr', {
+      key: $rowIndex,
       class: [
         'vxe-footer--row',
         footerRowClassName ? XEUtils.isFunction(footerRowClassName) ? footerRowClassName(rowParams) : footerRowClassName : ''

package/packages/table/src/header.ts

@@ -17,7 +17,7 @@ const renderRows = (h: CreateElement, _vm: any, cols: VxeTableDefines.ColumnInfo
 
   const { fixedType } = _vm
 
-  const { resizable: allResizable, border, columnKey, headerCellClassName, headerCellStyle, showHeaderOverflow: allColumnHeaderOverflow, headerAlign: allHeaderAlign, align: allAlign, currentColumn, scrollXLoad, overflowX, scrollbarWidth, mouseConfig, columnOpts } = $xeTable
+  const { resizable: allResizable, border, columnKey, headerCellClassName, headerCellStyle, showHeaderOverflow: allColumnHeaderOverflow, headerAlign: allHeaderAlign, align: allAlign, currentColumn, scrollXLoad, scrollYLoad, overflowX, scrollbarWidth, mouseConfig, columnOpts } = $xeTable
   const columnDragOpts = $xeTable.computeColumnDragOpts
   const { disabledMethod: dragDisabledMethod } = columnDragOpts
   return cols.map((column: any, $columnIndex: any) => {
@@ -90,7 +90,7 @@ const renderRows = (h: CreateElement, _vm: any, cols: VxeTableDefines.ColumnInfo
       attrs: thAttrs,
       style: headerCellStyle ? (XEUtils.isFunction(headerCellStyle) ? headerCellStyle(params) : headerCellStyle) : null,
       on: thOns,
-      key: columnKey || columnOpts.useKey || columnOpts.drag || isColGroup ? colid : $columnIndex
+      key: columnKey || scrollXLoad || scrollYLoad || columnOpts.useKey || columnOpts.drag || isColGroup ? colid : $columnIndex
     }, [
       h('div', {
         class: ['vxe-cell', {
@@ -140,6 +140,7 @@ function renderHeads (h: CreateElement, _vm: any, headerGroups: any[]) {
 
     if (columnOpts.drag && columnDragOpts.animation) {
       return h('transition-group', {
+        key: $rowIndex,
         props: {
           tag: 'tr',
           name: `vxe-header--col-list${isDragColMove ? '' : '-disabled'}`,
@@ -152,6 +153,7 @@ function renderHeads (h: CreateElement, _vm: any, headerGroups: any[]) {
       }, renderRows(h, _vm, cols, $rowIndex))
     }
     return h('tr', {
+      key: $rowIndex,
       class: [
         'vxe-header--row',
         headerRowClassName ? XEUtils.isFunction(headerRowClassName) ? headerRowClassName(params) : headerRowClassName : ''

package/packages/table/src/methods.ts

@@ -6785,7 +6785,7 @@ const Methods = {
 
     const { lyTimeout, lyRunTime, scrollYStore } = internalData
     const { visibleSize } = scrollYStore
-    const fpsTime = Math.min(80, Math.floor(visibleSize * 2))
+    const fpsTime = Math.min(80, Math.floor(visibleSize))
     if (lyTimeout) {
       clearTimeout(lyTimeout)
     }

package/packages/table/src/table.ts

@@ -734,8 +734,11 @@ export default {
       }
       return false
     },
-    tableBorder () {
-      const { border } = this
+    computeTableBorder () {
+      const $xeTable = this
+      const props = $xeTable
+
+      const { border } = props
       if (border === true) {
         return 'full'
       }
@@ -1213,7 +1216,6 @@ export default {
       stripe,
       showHeader,
       height,
-      tableBorder,
       treeOpts,
       treeConfig,
       mouseConfig,
@@ -1250,6 +1252,7 @@ export default {
     const loadingSlot = $scopedSlots.loading
     const currLoading = this._isLoading || loading
     const vSize = computeSize
+    const tableBorder = $xeTable.computeTableBorder
     const virtualScrollBars = $xeTable.computeVirtualScrollBars
     const isArea = mouseConfig && mouseOpts.area
     const tableStyle = $xeTable.computeTableStyle