vxe-table 4.1.2 → 4.1.5

package/packages/table/src/table.ts

@@ -1812,11 +1812,11 @@ export default defineComponent({
         if (transform) {
           // 树结构自动转换
           if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') {
-            if (!treeOpts.rowtKey) {
-              errLog('vxe.error.reqProp', ['tree-config.rowtKey'])
+            if (!treeOpts.rowField) {
+              errLog('vxe.error.reqProp', ['tree-config.rowField'])
             }
-            if (!treeOpts.parentKey) {
-              errLog('vxe.error.reqProp', ['tree-config.parentKey'])
+            if (!treeOpts.parentField) {
+              errLog('vxe.error.reqProp', ['tree-config.parentField'])
             }
             if (!treeOpts.children) {
               errLog('vxe.error.reqProp', ['tree-config.children'])
@@ -1827,7 +1827,7 @@ export default defineComponent({
               }
             })
           }
-          treeData = XEUtils.toArrayTree(fullData, { key: treeOpts.rowtKey, parentKey: treeOpts.parentKey, children: treeOpts.children })
+          treeData = XEUtils.toArrayTree(fullData, { key: treeOpts.rowField, parentKey: treeOpts.parentField, children: treeOpts.children })
           fullData = treeData.slice(0)
         } else {
           treeData = fullData.slice(0)
@@ -2121,8 +2121,10 @@ export default defineComponent({
       const { treeFullData } = internalData
       const treeOpts = computeTreeOpts.value
       const fullData: any[] = []
+      const expandMaps: Map<any, number> = new Map()
       XEUtils.eachTree(treeFullData, (row, index, items, path, parent) => {
-        if (!parent || $xetable.findRowIndexOf(treeExpandeds, parent) > -1) {
+        if (!parent || (expandMaps.has(parent) && $xetable.findRowIndexOf(treeExpandeds, parent) > -1)) {
+          expandMaps.set(row, 1)
           fullData.push(row)
         }
       }, treeOpts)
@@ -2311,16 +2313,12 @@ export default defineComponent({
           const oRow = tableSourceData[rowIndex]
           if (oRow && row) {
             if (field) {
-              XEUtils.set(oRow, field, XEUtils.get(record || row, field))
+              const newValue = XEUtils.get(record || row, field)
+              XEUtils.set(row, field, newValue)
+              XEUtils.set(oRow, field, newValue)
             } else {
-              if (record) {
-                tableSourceData[rowIndex] = record
-                XEUtils.clear(row, undefined)
-                Object.assign(row, tablePrivateMethods.defineField(Object.assign({}, record)))
-                tablePrivateMethods.cacheRowMap(true)
-              } else {
-                XEUtils.destructuring(oRow, XEUtils.clone(row, true))
-              }
+              const newRecord = XEUtils.clone({ ...record }, true)
+              XEUtils.destructuring(oRow, Object.assign(row, newRecord))
             }
           }
           reactData.tableData = tableData.slice(0)
@@ -2339,8 +2337,8 @@ export default defineComponent({
         const { tableSourceData, fullDataRowIdData, fullAllDataRowIdData } = internalData
         const treeOpts = computeTreeOpts.value
         const { children } = treeOpts
-        const rest = fullAllDataRowIdData[getRowid($xetable, row)]
-        const parentLevel = rest ? rest.level : 0
+        const parentRest = fullAllDataRowIdData[getRowid($xetable, row)]
+        const parentLevel = parentRest ? parentRest.level : 0
         return tableMethods.createData(childRecords).then((rows) => {
           if (keepSource) {
             const rowid = getRowid($xetable, row)
@@ -3152,11 +3150,12 @@ export default defineComponent({
        * @param {Row} row 行对象
        */
       setCurrentRow (row) {
+        const rowOpts = computeRowOpts.value
         const el = refElem.value
         tableMethods.clearCurrentRow()
         tableMethods.clearCurrentColumn()
         reactData.currentRow = row
-        if (props.highlightCurrentRow) {
+        if (rowOpts.isCurrent || props.highlightCurrentRow) {
           if (el) {
             XEUtils.arrayEach(el.querySelectorAll(`[rowid="${getRowid($xetable, row)}"]`), elem => addClass(elem, 'row--current'))
           }
@@ -3202,7 +3201,8 @@ export default defineComponent({
        * 用于当前行，获取当前行的数据
        */
       getCurrentRecord () {
-        return props.highlightCurrentRow ? reactData.currentRow : null
+        const rowOpts = computeRowOpts.value
+        return rowOpts.isCurrent || props.highlightCurrentRow ? reactData.currentRow : null
       },
       /**
        * 用于单选行，获取当已选中的数据
@@ -3235,7 +3235,8 @@ export default defineComponent({
         return null
       },
       getCurrentColumn () {
-        return props.highlightCurrentColumn ? reactData.currentColumn : null
+        const columnOpts = computeColumnOpts.value
+        return columnOpts.isCurrent || props.highlightCurrentColumn ? reactData.currentColumn : null
       },
       /**
        * 用于当前列，设置某列行为高亮状态
@@ -4032,6 +4033,7 @@ export default defineComponent({
           const editOpts = computeEditOpts.value
           const treeOpts = computeTreeOpts.value
           const menuList = computeMenuList.value
+          const rowOpts = computeRowOpts.value
           const { selected, actived } = editStore
           const keyCode = evnt.keyCode
           const isEsc = hasEventKey(evnt, EVENT_KEYS.ESCAPE)
@@ -4104,7 +4106,7 @@ export default defineComponent({
             keyCtxTimeout = setTimeout(() => {
               internalData._keyCtx = false
             }, 1000)
-          } else if (isEnter && !isAltKey && keyboardConfig && keyboardOpts.isEnter && (selected.row || actived.row || (treeConfig && highlightCurrentRow && currentRow))) {
+          } else if (isEnter && !isAltKey && keyboardConfig && keyboardOpts.isEnter && (selected.row || actived.row || (treeConfig && (rowOpts.isCurrent || highlightCurrentRow) && currentRow))) {
             // 退出选中
             if (hasCtrlKey) {
               // 如果是激活编辑状态，则取消编辑
@@ -4133,7 +4135,7 @@ export default defineComponent({
                     $xetable.moveSelected(targetArgs, isLeftArrow, false, isRightArrow, true, evnt)
                   }
                 }
-              } else if (treeConfig && highlightCurrentRow && currentRow) {
+              } else if (treeConfig && (rowOpts.isCurrent || highlightCurrentRow) && currentRow) {
                 // 如果是树形表格当前行回车移动到子节点
                 const childrens = currentRow[treeOpts.children]
                 if (childrens && childrens.length) {
@@ -4156,7 +4158,7 @@ export default defineComponent({
               // 如果按下了方向键
               if (selected.row && selected.column) {
                 $xetable.moveSelected(selected.args, isLeftArrow, isUpArrow, isRightArrow, isDwArrow, evnt)
-              } else if ((isUpArrow || isDwArrow) && highlightCurrentRow) {
+              } else if ((isUpArrow || isDwArrow) && (rowOpts.isCurrent || highlightCurrentRow)) {
                 // 当前行按键上下移动
                 $xetable.moveCurrentRow(isUpArrow, isDwArrow, evnt)
               }
@@ -4168,7 +4170,7 @@ export default defineComponent({
             } else if (actived.row || actived.column) {
               $xetable.moveTabSelected(actived.args, hasShiftKey, evnt)
             }
-          } else if (keyboardConfig && isEnableConf(editConfig) && (isDel || (treeConfig && highlightCurrentRow && currentRow ? isBack && keyboardOpts.isArrow : isBack))) {
+          } else if (keyboardConfig && isEnableConf(editConfig) && (isDel || (treeConfig && (rowOpts.isCurrent || highlightCurrentRow) && currentRow ? isBack && keyboardOpts.isArrow : isBack))) {
             if (!isEditStatus) {
               const { delMethod, backMethod } = keyboardOpts
               // 如果是删除键
@@ -4200,7 +4202,7 @@ export default defineComponent({
                   // 如果按下 del 键，更新表尾数据
                   tableMethods.updateFooter()
                 }
-              } else if (isBack && keyboardOpts.isArrow && treeConfig && highlightCurrentRow && currentRow) {
+              } else if (isBack && keyboardOpts.isArrow && treeConfig && (rowOpts.isCurrent || highlightCurrentRow) && currentRow) {
                 // 如果树形表格回退键关闭当前行返回父节点
                 const { parent: parentRow } = XEUtils.findTree(internalData.afterFullData, item => item === currentRow, treeOpts)
                 if (parentRow) {
@@ -4825,6 +4827,7 @@ export default defineComponent({
       triggerHeaderCellClickEvent (evnt, params) {
         const { _lastResizeTime } = internalData
         const sortOpts = computeSortOpts.value
+        const columnOpts = computeColumnOpts.value
         const { column } = params
         const cell = evnt.currentTarget
         const triggerResizable = _lastResizeTime && _lastResizeTime > Date.now() - 300
@@ -4834,7 +4837,7 @@ export default defineComponent({
           tablePrivateMethods.triggerSortEvent(evnt, column, getNextSortOrder(column))
         }
         tableMethods.dispatchEvent('header-cell-click', Object.assign({ triggerResizable, triggerSort, triggerFilter, cell }, params), evnt)
-        if (props.highlightCurrentColumn) {
+        if (columnOpts.isCurrent || props.highlightCurrentColumn) {
           tableMethods.setCurrentColumn(column)
         }
       },
@@ -4854,6 +4857,7 @@ export default defineComponent({
         const treeOpts = computeTreeOpts.value
         const radioOpts = computeRadioOpts.value
         const checkboxOpts = computeCheckboxOpts.value
+        const rowOpts = computeRowOpts.value
         const { actived } = editStore
         const { row, column } = params
         const { type, treeNode } = column
@@ -4880,7 +4884,7 @@ export default defineComponent({
         if (!triggerTreeNode) {
           if (!triggerExpandNode) {
             // 如果是高亮行
-            if (highlightCurrentRow) {
+            if (rowOpts.isCurrent || highlightCurrentRow) {
               if (!triggerCheckbox && !triggerRadio) {
                 tablePrivateMethods.triggerCurrentRowEvent(evnt, params)
               }
@@ -5187,6 +5191,7 @@ export default defineComponent({
         tablePrivateMethods.handleTableData()
         tablePrivateMethods.updateScrollYSpace()
       },
+      updateVirtualTreeData,
       /**
        * 处理固定列的显示状态
        */
@@ -5675,6 +5680,8 @@ export default defineComponent({
       const { leftList, rightList } = columnStore
       const tooltipOpts = computeTooltipOpts.value
       const treeOpts = computeTreeOpts.value
+      const rowOpts = computeRowOpts.value
+      const columnOpts = computeColumnOpts.value
       const vSize = computeSize.value
       const tableBorder = computeTableBorder.value
       const mouseOpts = computeMouseOpts.value
@@ -5689,8 +5696,8 @@ export default defineComponent({
           'cell--highlight': highlightCell,
           'cell--selected': mouseConfig && mouseOpts.selected,
           'cell--area': mouseConfig && mouseOpts.area,
-          'row--highlight': highlightHoverRow,
-          'column--highlight': highlightHoverColumn,
+          'row--highlight': rowOpts.isHover || highlightHoverRow,
+          'column--highlight': columnOpts.isHover || highlightHoverColumn,
           'is--header': showHeader,
           'is--footer': showFooter,
           'is--group': isGroup,

package/packages/v-x-e-table/src/conf.ts

@@ -65,8 +65,8 @@ const GlobalConfig: VXETableGlobalConfig = {
       showIcon: true
     },
     treeConfig: {
-      rowtKey: 'id',
-      parentKey: 'parentId',
+      rowField: 'id',
+      parentField: 'parentId',
       children: 'children',
       hasChild: 'hasChild',
       indent: 20,

package/types/edit.d.ts

@@ -13,9 +13,12 @@ export interface TableEditMethods {
    */
   insert(records: RecordInfo | RecordInfo[]): Promise<{ row: any, rows: any[] }>;
   /**
-   * 往表格插入临时数据，从指定位置插入一行或多行；第二个参数：row 指定位置、null从第一行插入、-1 从最后插入
-   * @param records 新数据
-   * @param row 指定行
+   * 往表格指定行中插入临时数据
+   * 如果 row 为空则从插入到顶部，如果为树结构，则插入到目标节点顶部
+   * 如果 row 为 -1 则从插入到底部，如果为树结构，则插入到目标节点底部
+   * 如果 row 为有效行则插入到该行的位置，如果为树结构，则有插入到效的目标节点该行的位置
+   * @param {Object/Array} records 新的数据
+   * @param {Row} row 指定行
    */
   insertAt(records: RecordInfo | RecordInfo[], row: any | -1 | null): Promise<{ row: any, rows: any[] }>;
   /**

package/types/index.d.ts

@@ -1,7 +1,7 @@
 import * as VXETableExport from './all'
 
 /**
- * 一个基于 vue 的 PC 端表格组件，支持增删改查、虚拟滚动、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、虚拟列表、弹窗、自定义模板、渲染器、贼灵活的配置项、扩展接口等...  
+ * 一个基于 vue 的 PC 端表格组件，支持增删改查、虚拟列表、虚拟树、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、弹窗、自定义模板、渲染器、贼灵活的配置项、扩展接口等...  
  */
 declare const VXETable: typeof VXETableExport
 

package/types/plugins/pro.d.ts

@@ -28,9 +28,9 @@ export interface VxeTableProMethods {
    */
   pasteCellArea(): Promise<any>;
   /**
-   * 用于 mouse-config.area，用于清除鼠标选择的区域
+   * 用于 mouse-config.area，用于清除鼠标选择的区域，可以指定清除的区域
    */
-  clearCellAreas(): Promise<any>;
+  clearCellAreas(area?: number | VxeTableProDefines.MouseCellArea): Promise<any>;
   /**
    * 用于 mouse-config.area，手动清除标记为复制粘贴的区域
    */
@@ -40,9 +40,9 @@ export interface VxeTableProMethods {
    * @param areaConfigs 指定区域
    */
   setCellAreas(areaConfigs: VxeTableProDefines.CellAreaConfig[], activeArea?: {
-    area?: VxeTableProDefines.CellAreaConfig;
-    column: VxeTableDefines.ColumnInfo;
-    row: any;
+    area?: number | VxeTableProDefines.CellAreaConfig;
+    column?: number | VxeTableDefines.ColumnInfo;
+    row?: any;
   }): Promise<any>;
   /**
    * 用于 mouse-config.area，设置活动的区域的单元格
@@ -148,7 +148,7 @@ export namespace VxeTableProDefines {
   }
 
   export interface ActiveCellAreaConfig {
-    area: VxeTableProDefines.MouseCellArea;
+    area: VxeTableProDefines.MouseCellArea | number;
     column: VxeTableDefines.ColumnInfo | number;
     row: any;
   }

package/types/table.d.ts

@@ -707,6 +707,7 @@ export interface TablePrivateMethods {
   updateScrollYSpace(): void;
   updateScrollXData(): void;
   updateScrollYData(): void;
+  updateVirtualTreeData(): Promise<any>;
   checkScrolling(): void;
   updateZindex(): void;
   updateCellAreas(): void;
@@ -1208,6 +1209,8 @@ export namespace VxeTablePropTypes {
    * 列配置信息
    */
   export interface ColumnConfig {
+    isCurrent?: boolean;
+    isHover?: boolean;
     resizable?: VxeColumnPropTypes.Resizable;
     width?: VxeColumnPropTypes.Width;
     minWidth?: VxeColumnPropTypes.MinWidth;
@@ -1218,6 +1221,8 @@ export namespace VxeTablePropTypes {
    * 行配置信息
    */
   export interface RowConfig {
+    isCurrent?: boolean;
+    isHover?: boolean;
     height?: number;
   }
   export interface RowOpts extends RowConfig { }
@@ -1321,6 +1326,9 @@ export namespace VxeTablePropTypes {
     checkMethod?(params: {
       row: any;
     }): boolean;
+    visibleMethod?(params: {
+      row: any;
+    }): boolean;
     trigger?: 'default' | 'cell' | 'row';
     highlight?: boolean;
     strict?: boolean;
@@ -1343,6 +1351,9 @@ export namespace VxeTablePropTypes {
     checkMethod?(params: {
       row: any;
     }): boolean;
+    visibleMethod?(params: {
+      row: any;
+    }): boolean;
     trigger?: 'default' | 'cell' | 'row';
     highlight?: boolean;
     range?: boolean;
@@ -1415,8 +1426,8 @@ export namespace VxeTablePropTypes {
    */
   export interface TreeConfig {
     transform?: boolean;
-    rowtKey?: string;
-    parentKey?: string;
+    rowField?: string;
+    parentField?: string;
     children?: string;
     indent?: number;
     line?: boolean;
@@ -1445,8 +1456,8 @@ export namespace VxeTablePropTypes {
     iconLoaded?: string;
   }
   export interface TreeOpts extends TreeConfig {
-    rowtKey: string;
-    parentKey: string;
+    rowField: string;
+    parentField: string;
     children: string;
     indent: number;
     hasChild: string;
@@ -1877,6 +1888,9 @@ export namespace VxeTablePropTypes {
     gt?: number;
     oSize?: number;
     enabled?: boolean;
+    /**
+     * @deprecated 请使用 row-config.height
+     */
     rHeight?: number;
     adaptive?: boolean;
   }