vxe-table 4.7.67 → 4.7.69

package/packages/table/src/body.ts

@@ -141,6 +141,7 @@ export default defineComponent({
       const { actived } = editStore
       const { rHeight: scrollYRHeight } = sYOpts
       const { height: rowHeight } = rowOpts
+      const colid = column.id
       const renderOpts = editRender || cellRender
       const compConf = renderOpts ? renderer.get(renderOpts.name) : null
       const compCellClassName = compConf ? (compConf.tableCellClassName || compConf.cellClassName) : null
@@ -158,9 +159,9 @@ export default defineComponent({
       let isDirty
       const tdOns: any = {}
       const cellAlign = align || allAlign
-      const errorValidItem = validErrorMaps[`${rowid}:${column.id}`]
+      const errorValidItem = validErrorMaps[`${rowid}:${colid}`]
       const showValidTip = editRules && validOpts.showMessage && (validOpts.message === 'default' ? (height || tableData.length > 1) : validOpts.message === 'inline')
-      const attrs: any = { colid: column.id }
+      const attrs: any = { colid }
       const params: VxeTableDefines.CellRenderBodyParams = { $table: $xeTable, $grid: $xeTable.xegrid, seq, rowid, row, rowIndex, $rowIndex, _rowIndex, column, columnIndex, $columnIndex, _columnIndex, fixed: fixedType, type: renderType, isHidden: fixedHiddenColumn, level: rowLevel, visibleData: afterFullData, data: tableData, items }
       // 虚拟滚动不支持动态高度
       if (scrollYLoad && !hasEllipsis) {
@@ -301,7 +302,7 @@ export default defineComponent({
       return h('td', {
         class: [
           'vxe-body--column',
-          column.id,
+          colid,
           {
             [`col--${cellAlign}`]: cellAlign,
             [`col--${type}`]: type,
@@ -319,7 +320,7 @@ export default defineComponent({
           getPropClass(className, params),
           getPropClass(allCellClassName, params)
         ],
-        key: columnKey || columnOpts.useKey ? column.id : $columnIndex,
+        key: columnKey || columnOpts.useKey ? colid : $columnIndex,
         ...attrs,
         style: Object.assign({
           height: hasEllipsis && (scrollYRHeight || rowHeight) ? `${scrollYRHeight || rowHeight}px` : ''

package/packages/table/src/header.ts

@@ -226,6 +226,7 @@ export default defineComponent({
               style: headerRowStyle ? (XEUtils.isFunction(headerRowStyle) ? headerRowStyle({ $table: $xeTable, $rowIndex, fixed: fixedType, type: renderType }) : headerRowStyle) : null
             }, cols.map((column, $columnIndex) => {
               const { type, showHeaderOverflow, headerAlign, align, headerClassName } = column
+              const colid = column.id
               const isColGroup = column.children && column.children.length
               const fixedHiddenColumn = fixedType ? (column.fixed !== fixedType && !isColGroup) : !!column.fixed && overflowX
               const headOverflow = XEUtils.eqNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow
@@ -251,7 +252,7 @@ export default defineComponent({
                 thOns.onMousedown = (evnt: MouseEvent) => $xeTable.triggerHeaderCellMousedownEvent(evnt, params)
               }
               return h('th', {
-                class: ['vxe-header--column', column.id, {
+                class: ['vxe-header--column', colid, {
                   [`col--${headAlign}`]: headAlign,
                   [`col--${type}`]: type,
                   'col--last': $columnIndex === cols.length - 1,
@@ -267,12 +268,12 @@ export default defineComponent({
                 headerClassName ? (XEUtils.isFunction(headerClassName) ? headerClassName(params) : headerClassName) : '',
                 headerCellClassName ? (XEUtils.isFunction(headerCellClassName) ? headerCellClassName(params) : headerCellClassName) : ''
                 ],
-                colid: column.id,
+                colid,
                 colspan: column.colSpan > 1 ? column.colSpan : null,
                 rowspan: column.rowSpan > 1 ? column.rowSpan : null,
                 style: headerCellStyle ? (XEUtils.isFunction(headerCellStyle) ? headerCellStyle(params) : headerCellStyle) : null,
                 ...thOns,
-                key: columnKey || columnOpts.useKey || isColGroup ? column.id : $columnIndex
+                key: columnKey || columnOpts.useKey || isColGroup ? colid : $columnIndex
               }, [
                 h('div', {
                   class: ['vxe-cell', {

package/packages/table/src/table.ts

@@ -331,6 +331,10 @@ export default defineComponent({
       fullDataRowIdData: {},
       fullColumnIdData: {},
       fullColumnFieldData: {},
+      // 列选取状态
+      columnStatusMaps: {},
+      // 行选取状态
+      rowStatusMaps: {},
       inited: false,
       tooltipTimeout: null,
       initStatus: false,
@@ -4983,7 +4987,6 @@ export default defineComponent({
           const operCtxMenu = isMenu && ctxMenuStore.visible && (isEnter || isSpacebar || operArrow)
           const isEditStatus = isEnableConf(editConfig) && actived.column && actived.row
           const beforeEditMethod = editOpts.beforeEditMethod || editOpts.activeMethod
-          let params: any
           if (operCtxMenu) {
             // 如果配置了右键菜单; 支持方向键操作、回车
             evnt.preventDefault()
@@ -5039,7 +5042,7 @@ export default defineComponent({
             if (hasCtrlKey) {
               // 如果是激活编辑状态，则取消编辑
               if (actived.row) {
-                params = actived.args
+                const params = actived.args
                 $xeTable.clearEdit(evnt)
                 // 如果配置了选中功能，则为选中状态
                 if (mouseOpts.selected) {
@@ -5069,7 +5072,7 @@ export default defineComponent({
                 if (childrens && childrens.length) {
                   evnt.preventDefault()
                   const targetRow = childrens[0]
-                  params = {
+                  const params = {
                     $table: $xeTable,
                     row: targetRow,
                     rowIndex: tableMethods.getRowIndex(targetRow),
@@ -5102,23 +5105,24 @@ export default defineComponent({
             // 如果是删除键
             if (!isEditStatus) {
               const { delMethod } = keyboardOpts
-              const delPaqrams = {
+              const params = {
                 row: selected.row,
                 rowIndex: tableMethods.getRowIndex(selected.row),
                 column: selected.column,
                 columnIndex: tableMethods.getColumnIndex(selected.column),
-                $table: $xeTable
+                $table: $xeTable,
+                $grid: $xeGrid
               }
               // 是否被禁用
               if (!beforeEditMethod || beforeEditMethod(params)) {
                 if (delMethod) {
-                  delMethod(delPaqrams)
+                  delMethod(params)
                 } else {
                   setCellValue(selected.row, selected.column, null)
                 }
                 // 如果按下 del 键，更新表尾数据
                 tableMethods.updateFooter()
-                $xeTable.dispatchEvent('cell-delete-value', delPaqrams, evnt)
+                $xeTable.dispatchEvent('cell-delete-value', params, evnt)
               }
             }
           } else if (hasBackspaceKey && keyboardConfig && keyboardOpts.isBack && isEnableConf(editConfig) && (selected.row || selected.column)) {
@@ -5126,28 +5130,23 @@ export default defineComponent({
               const { backMethod } = keyboardOpts
               // 如果是删除键
               if (keyboardOpts.isDel && isEnableConf(editConfig) && (selected.row || selected.column)) {
-                const delPaqrams = {
+                const params = {
                   row: selected.row,
                   rowIndex: tableMethods.getRowIndex(selected.row),
                   column: selected.column,
                   columnIndex: tableMethods.getColumnIndex(selected.column),
-                  $table: $xeTable
+                  $table: $xeTable,
+                  $grid: $xeGrid
                 }
                 // 是否被禁用
                 if (!beforeEditMethod || beforeEditMethod(params)) {
                   if (backMethod) {
-                    backMethod({
-                      row: selected.row,
-                      rowIndex: tableMethods.getRowIndex(selected.row),
-                      column: selected.column,
-                      columnIndex: tableMethods.getColumnIndex(selected.column),
-                      $table: $xeTable
-                    })
+                    backMethod(params)
                   } else {
                     setCellValue(selected.row, selected.column, null)
                     $xeTable.handleActived(selected.args, evnt)
                   }
-                  $xeTable.dispatchEvent('cell-backspace-value', delPaqrams, evnt)
+                  $xeTable.dispatchEvent('cell-backspace-value', params, evnt)
                 }
               }
             }
@@ -5156,11 +5155,12 @@ export default defineComponent({
             const { parent: parentRow } = XEUtils.findTree(internalData.afterTreeFullData, item => item === currentRow, { children: childrenField })
             if (parentRow) {
               evnt.preventDefault()
-              params = {
-                $table: $xeTable,
+              const params = {
                 row: parentRow,
                 rowIndex: tableMethods.getRowIndex(parentRow),
-                $rowIndex: tableMethods.getVMRowIndex(parentRow)
+                $rowIndex: tableMethods.getVMRowIndex(parentRow),
+                $table: $xeTable,
+                $grid: $xeGrid
               }
               tableMethods.setTreeExpand(parentRow, false)
                 .then(() => tableMethods.scrollToRow(parentRow))
@@ -5175,16 +5175,17 @@ export default defineComponent({
             // 如果是按下非功能键之外允许直接编辑
             if (selected.column && selected.row && isEnableConf(selected.column.editRender)) {
               const beforeEditMethod = editOpts.beforeEditMethod || editOpts.activeMethod
+              const params = {
+                row: selected.row,
+                rowIndex: tableMethods.getRowIndex(selected.row),
+                column: selected.column,
+                columnIndex: tableMethods.getColumnIndex(selected.column),
+                $table: $xeTable,
+                $grid: $xeGrid
+              }
               if (!beforeEditMethod || beforeEditMethod({ ...selected.args, $table: $xeTable, $grid: $xeGrid })) {
                 if (editMethod) {
-                  editMethod({
-                    row: selected.row,
-                    rowIndex: tableMethods.getRowIndex(selected.row),
-                    column: selected.column,
-                    columnIndex: tableMethods.getColumnIndex(selected.column),
-                    $table: $xeTable,
-                    $grid: $xeGrid
-                  })
+                  editMethod(params)
                 } else {
                   setCellValue(selected.row, selected.column, null)
                   $xeTable.handleActived(selected.args, evnt)
@@ -5192,14 +5193,7 @@ export default defineComponent({
                 const afterEditMethod = editOpts.afterEditMethod
                 if (afterEditMethod) {
                   nextTick(() => {
-                    afterEditMethod({
-                      row: selected.row as any,
-                      rowIndex: tableMethods.getRowIndex(selected.row),
-                      column: selected.column,
-                      columnIndex: tableMethods.getColumnIndex(selected.column),
-                      $table: $xeTable,
-                      $grid: $xeGrid
-                    })
+                    afterEditMethod(params)
                   })
                 }
               }

package/styles/components/grid.scss

@@ -40,6 +40,7 @@
   .vxe-grid--right-wrapper {
     flex-shrink: 0;
     overflow: auto;
+    outline: 0;
   }
   .vxe-grid--table-wrapper {
     flex-grow: 1;

package/styles/components/table-module/custom.scss

@@ -220,6 +220,7 @@
 .vxe-table-custom-popup--body {
   overflow: auto;
   height: 100%;
+  outline: 0;
 }
 
 .vxe-table-custom-popup--table-wrapper {

package/styles/components/table-module/export.scss

@@ -5,6 +5,7 @@
   overflow: auto;
   margin: 0;
   padding: 0;
+  outline: 0;
   user-select: none;
   & > li {
     overflow: hidden;

package/styles/components/table-module/filter.scss

@@ -72,6 +72,7 @@
     list-style-type: none;
     padding: 0;
     margin: 0;
+    outline: 0;
     overflow: auto;
     user-select: none;
   }

package/styles/components/table.scss

@@ -42,6 +42,7 @@
 .vxe-table--fixed-right-body-wrapper {
   overflow-y: auto;
   overflow-x: auto;
+  outline: 0;
 }
 
 /*默认的渲染*/
@@ -529,12 +530,14 @@
   .vxe-table--footer-wrapper {
     overflow-x: hidden;
     overflow-y: hidden;
+    outline: 0;
   }
   &:not(.is--empty) {
     &.is--footer {
       &.is--scroll-x {
         .vxe-table--body-wrapper {
           overflow-x: scroll;
+          outline: 0;
         }
       }
     }
@@ -909,8 +912,10 @@
     overflow: hidden;
     background-color: inherit;
     transition: 0.3s box-shadow;
+    outline: 0;
     .vxe-table--body-wrapper {
       overflow-x: hidden;
+      outline: 0;
     }
   }
   .vxe-table--fixed-left-wrapper {
@@ -949,6 +954,7 @@
     &.fixed-right--wrapper {
       position: absolute;
       top: 0;
+      outline: 0;
     }
     &.fixed-left--wrapper {
       left: 0;
@@ -1111,6 +1117,7 @@
     z-index: 1;
     &.is--ellipsis {
       overflow: auto;
+      outline: 0;
     }
   }
 
@@ -1219,6 +1226,7 @@
     overflow: hidden;
     width: 100%;
     pointer-events: none;
+    outline: 0;
   }
   .vxe-table--empty-block {
     display: none;
@@ -1470,6 +1478,7 @@ div.vxe-table--tooltip-wrapper {
   margin-top: -1px;
   &.body--wrapper{
     overflow-x: auto;
+    outline: 0;
   }
 }
 

package/styles/theme/base.scss

@@ -57,6 +57,7 @@
   --vxe-ui-table-cell-dirty-insert-color: #19A15F;
   --vxe-ui-table-cell-area-border-color: var(--vxe-ui-font-primary-color);
   --vxe-ui-table-cell-area-border-width: 1px;
+  --vxe-ui-table-cell-area-status-border-width: var(--vxe-ui-table-cell-area-border-width);
   --vxe-ui-table-cell-main-area-extension-border-color: #fff;
   --vxe-ui-table-cell-main-area-extension-background-color: var(--vxe-ui-font-primary-color);
   --vxe-ui-table-cell-extend-area-border-width: 2px;