vxe-table 4.6.17 → 4.6.19

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vxe-table",
-  "version": "4.6.17",
+  "version": "4.6.19",
   "description": "一个基于 vue 的 PC 端表格组件，支持增删改查、虚拟树、列拖拽，懒加载、快捷菜单、数据校验、树形结构、打印导出、自定义模板、渲染器、JSON 配置式...",
   "scripts": {
     "update": "npm install --legacy-peer-deps",
@@ -28,8 +28,8 @@
   "style": "lib/style.css",
   "typings": "types/index.d.ts",
   "dependencies": {
-    "dom-zindex": "^1.0.4",
-    "xe-utils": "^3.5.26"
+    "dom-zindex": "^1.0.6",
+    "xe-utils": "^3.5.30"
   },
   "devDependencies": {
     "@types/resize-observer-browser": "^0.1.11",
@@ -62,7 +62,7 @@
     "gulp-typescript": "^5.0.1",
     "gulp-uglify": "^3.0.2",
     "postcss": "^8.4.38",
-    "sass": "^1.75.0",
+    "sass": "~1.77.8",
     "sass-loader": "^14.2.0",
     "typescript": "~4.5.5",
     "vue": "3.4.27",

package/packages/form/src/form-gather.ts

@@ -12,7 +12,6 @@ export default defineComponent({
     const refElem = ref() as Ref<HTMLDivElement>
     const $xeform = inject('$xeform', {} as VxeFormConstructor & VxeFormPrivateMethods)
     const formGather = inject('$xeformgather', null as XEFormItemProvide | null)
-    const defaultSlot = slots.default
     const formItem = reactive(createItem($xeform, props))
     const xeformitem: XEFormItemProvide = { formItem }
     const xeformiteminfo = { itemConfig: formItem }
@@ -35,6 +34,7 @@ export default defineComponent({
     const renderVN = () => {
       const { className, field } = props
       const span = props.span || ($xeform ? $xeform.props.span : null)
+      const defaultSlot = slots.default
       return h('div', {
         ref: refElem,
         class: ['vxe-form--gather vxe-form--item-row', formItem.id, span ? `vxe-form--item-col_${span} is--span` : '', className ? (XEUtils.isFunction(className) ? className({ $form: $xeform, data: $xeform ? $xeform.props.data : {}, item: formItem as any, field: field as string, property: field as string }) : className) : '']

package/packages/grid/src/grid.ts

@@ -187,9 +187,9 @@ export default defineComponent({
       const tableProps = Object.assign({}, tableExtendProps)
       if (isZMax) {
         if (tableExtendProps.maxHeight) {
-          tableProps.maxHeight = 'auto'
+          tableProps.maxHeight = '100%'
         } else {
-          tableProps.height = 'auto'
+          tableProps.height = '100%'
         }
       }
       if (proxyConfig && isEnableConf(proxyOpts)) {
@@ -1133,7 +1133,7 @@ export default defineComponent({
         const topWrapper = refTopWrapper.value
         const bottomWrapper = refBottomWrapper.value
         const pagerWrapper = refPagerWrapper.value
-        const parentPaddingSize = isZMax || height !== 'auto' ? 0 : getPaddingTopBottomSize(el.parentNode as HTMLElement)
+        const parentPaddingSize = isZMax || !(height === 'auto' || height === '100%') ? 0 : getPaddingTopBottomSize(el.parentNode as HTMLElement)
         return parentPaddingSize + getPaddingTopBottomSize(el) + getOffsetHeight(formWrapper) + getOffsetHeight(toolbarWrapper) + getOffsetHeight(topWrapper) + getOffsetHeight(bottomWrapper) + getOffsetHeight(pagerWrapper)
       },
       getParentHeight () {

package/packages/menu/src/hooks.ts

@@ -282,8 +282,9 @@ const tableMenuHook: VxeGlobalHooksHandles.HookOptions = {
         if (!menu.disabled && (menu.code || !menu.children || !menu.children.length)) {
           const gMenuOpts = VXETable.menus.get(menu.code)
           const params = Object.assign({}, internalData._currMenuParams, { menu, $table: $xetable, $grid: $xetable.xegrid, $event: evnt })
-          if (gMenuOpts && gMenuOpts.menuMethod) {
-            gMenuOpts.menuMethod(params, evnt)
+          const tmMethod = gMenuOpts ? (gMenuOpts.tableMenuMethod || gMenuOpts.menuMethod) : null
+          if (tmMethod) {
+            tmMethod(params, evnt)
           }
           $xetable.dispatchEvent('menu-click', params, evnt)
           menuMethods.closeMenu()

package/packages/table/src/table.ts

@@ -870,7 +870,7 @@ export default defineComponent({
       const val = props[key]
       let num = 0
       if (val) {
-        if (val === 'auto') {
+        if (val === '100%' || val === 'auto') {
           num = parentHeight
         } else {
           const excludeHeight = $xetable.getExcludeHeight()
@@ -2816,6 +2816,19 @@ export default defineComponent({
             return tableMethods.recalculate()
           })
       },
+      /**
+       * 修改行数据
+       */
+      setRow (rows, record) {
+        if (record) {
+          let rest: any[] = rows
+          if (!XEUtils.isArray(rows)) {
+            rest = [rows]
+          }
+          rest.forEach(item => Object.assign(item, record))
+        }
+        return nextTick()
+      },
       /**
        * 局部加载行数据并恢复到初始状态
        * 对于行数据需要局部更改的场景中可能会用到
@@ -5109,7 +5122,7 @@ export default defineComponent({
         const el = refElem.value
         if (el) {
           const parentElem = el.parentNode as HTMLElement
-          const parentPaddingSize = height === 'auto' ? getPaddingTopBottomSize(parentElem) : 0
+          const parentPaddingSize = height === '100%' || height === 'auto' ? getPaddingTopBottomSize(parentElem) : 0
           return Math.floor($xegrid ? $xegrid.getParentHeight() : XEUtils.toNumber(getComputedStyle(parentElem).height) - parentPaddingSize)
         }
         return 0

package/packages/v-x-e-table/index.ts

@@ -8,7 +8,7 @@ import { menus } from './src/menus'
 import { formats } from './src/formats'
 import { validators } from './src/validators'
 import { hooks } from './src/hooks'
-import { setTheme } from './src/theme'
+import { setTheme, getTheme } from './src/theme'
 import { getLastZIndex, nextZIndex } from '../tools/utils'
 import { warnLog } from '../tools/log'
 
@@ -129,9 +129,25 @@ export function setIcon (options?: any) {
 
 export const globalStore = {}
 
+const components: any = {}
+
+export function getComponent (name: any) {
+  return components[name] || null
+}
+
+export function component (comp: any) {
+  if (comp && comp.name) {
+    components[comp.name] = comp
+  }
+}
+
+export const version = process.env.VUE_APP_VXE_TABLE_VERSION as string
+export const tableVersion = version
+
 export const VXETable = {
   v,
-  version: process.env.VUE_APP_VXE_TABLE_VERSION,
+  version,
+  tableVersion,
   setConfig,
   setIcon,
   globalStore,
@@ -145,6 +161,9 @@ export const VXETable = {
   use,
   t,
   _t,
+  setTheme,
+  getTheme,
+  getComponent,
 
   // 已废弃
   config,

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

@@ -5,6 +5,7 @@ export function setTheme (name: any) {
   if (!theme || theme === 'default') {
     theme = 'light'
   }
+  GlobalConfig.theme = theme
   if (typeof document !== 'undefined') {
     const documentElement = document.documentElement
     if (documentElement) {
@@ -12,3 +13,7 @@ export function setTheme (name: any) {
     }
   }
 }
+
+export function getTheme () {
+  return GlobalConfig.theme
+}

package/styles/checkbox.scss

@@ -11,11 +11,11 @@
 
 /*checkbox*/
 .vxe-checkbox {
-  @include createCheckboxIcon();
   display: inline-block;
   vertical-align: middle;
   white-space: nowrap;
   line-height: 1;
+  @include createCheckboxIcon();
   &+.vxe-checkbox {
     margin-left: 10px;
   }

package/styles/custom.scss

@@ -84,11 +84,11 @@
 }
 
 .vxe-table-custom--checkbox-option {
-  @include createCheckboxIcon();
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   flex-grow: 1;
+  @include createCheckboxIcon();
 }
 
 .vxe-table-custom--fixed-option {

package/styles/export.scss

@@ -91,10 +91,10 @@
       cursor: pointer;
     }
     &:hover {
+      color: var(--vxe-primary-color);
       & > i {
         display: block;
       }
-      color: var(--vxe-primary-color);
     }
   }
   .vxe-import-select--file {

package/styles/radio.scss

@@ -15,11 +15,11 @@
 
 /*radio*/
 .vxe-radio {
-  @include createRadioIcon();
   display: inline-block;
   vertical-align: middle;
   white-space: nowrap;
   line-height: 1;
+  @include createRadioIcon();
   > input {
     &[type="radio"] {
       position: absolute;

package/styles/table.scss

@@ -210,7 +210,10 @@
 }
 
 .vxe-table--cell-active-area {
-  border: var(--vxe-table-cell-active-area-border-width) solid var(--vxe-table-cell-active-area-border-color);
+  border-color: var(--vxe-table-cell-active-area-border-color);
+  border-style: solid;
+  border-width: var(--vxe-table-cell-active-area-border-width);
+  background-color: var(--vxe-table-cell-active-area-background-color);
 }
 
 .vxe-table--cell-multi-area {

package/styles/theme/dark.scss

@@ -111,6 +111,7 @@
   --vxe-table-cell-extend-area-border-width: #{$vxe-table-cell-extend-area-border-width};
   --vxe-table-cell-copy-area-border-width: #{$vxe-table-cell-copy-area-border-width};
   --vxe-table-cell-active-area-border-width: #{$vxe-table-cell-active-area-border-width};
+  --vxe-table-cell-active-area-background-color: #{$vxe-table-cell-active-area-background-color};
   --vxe-table-cell-copy-area-border-color: #{$vxe-table-cell-copy-area-border-color};
   --vxe-table-cell-extend-area-border-color: #{$vxe-table-cell-extend-area-border-color};
   --vxe-table-cell-active-area-border-color: #{$vxe-table-cell-active-area-border-color};

package/styles/theme/default.scss

@@ -104,6 +104,7 @@
   --vxe-table-cell-dirty-insert-color: #{$vxe-table-cell-dirty-insert-color};
   --vxe-table-cell-area-border-color: #{$vxe-table-cell-area-border-color};
   --vxe-table-cell-area-border-width: #{$vxe-table-cell-area-border-width};
+  --vxe-table-cell-active-area-background-color: #{$vxe-table-cell-active-area-background-color};
   --vxe-table-cell-main-area-extension-border-color: #{$vxe-table-cell-main-area-extension-border-color};
   --vxe-table-cell-main-area-extension-background-color: #{$vxe-table-cell-main-area-extension-background-color};
   --vxe-table-cell-extend-area-border-width: #{$vxe-table-cell-extend-area-border-width};

package/styles/variable.scss

@@ -106,6 +106,7 @@ $vxe-table-cell-main-area-extension-background-color: $vxe-primary-color !defaul
 $vxe-table-cell-extend-area-border-width: 2px !default;
 $vxe-table-cell-copy-area-border-width: 3px !default;
 $vxe-table-cell-active-area-border-width: 2px !default;
+$vxe-table-cell-active-area-background-color: transparent !default;
 $vxe-table-cell-copy-area-border-color: $vxe-table-cell-area-border-color !default;
 $vxe-table-cell-extend-area-border-color: $vxe-table-cell-area-border-color !default;
 $vxe-table-cell-active-area-border-color: $vxe-table-cell-area-border-color !default;

package/types/table.d.ts

@@ -132,6 +132,12 @@ export interface TablePublicMethods<DT = VxeTableDataRow> {
    * @param data 数据
    */
   reloadData(data: any[]): Promise<void>
+  /**
+   * 修改行数据
+   * @param rows 行对象
+   * @param record 新数据
+   */
+  setRow(rows: any | any[], record?: any): Promise<void>
   /**
    * 局部加载行数据并恢复到初始状态
    * @param rows 行对象
@@ -1620,7 +1626,7 @@ export namespace VxeTablePropTypes {
     visibleMethod?(params: {
       row: D
     }): boolean
-    trigger?: 'default' | 'cell' | 'row' | '' | null
+    trigger?: 'default' | 'cell' | 'row' | '' | 'manual' | null
     highlight?: boolean
     range?: boolean
 

package/types/v-x-e-table/index.d.ts

@@ -36,7 +36,7 @@ export interface VXETableConfigOptions {
    * 扩展插件授权码
    */
   authId?: string
-  onauth?(event: {
+  onAuth?(event: {
     status: boolean
     code: number
     msg: string
@@ -89,12 +89,15 @@ export interface VXETableConfigOptions {
   [key: string]: any
 }
 
+export type VxeGlobalConfig = VXETableConfigOptions
+
 export interface VxeGlobalIcon {
   [ket: string]: string
 }
 
 export type VxeGlobalConfigMethod = (options?: VXETableConfigOptions) => VXETableCore
 export type VxeGlobalThemeMethod = (name?: '' | 'light' | 'dark') => VXETableCore
+export type VxeGlobalGetThemeMethod = () => 'light' | 'dark'
 
 /**
  * 请使用 setConfig
@@ -135,6 +138,8 @@ export type VxeGlobalUse = (plugin: VXETablePluginObject, ...options: any[]) =>
 
 export const setConfig: VxeGlobalConfigMethod
 export const setTheme: VxeGlobalThemeMethod
+export const getTheme: VxeGlobalGetThemeMethod
+
 export const interceptor: VxeGlobalInterceptor
 export const renderer: VxeGlobalRenderer
 export const commands: VxeGlobalCommands
@@ -166,6 +171,9 @@ export const setup: VXETableSetupOptions
  */
 export const globalConfs: VXETableConfig
 
+export function getComponent (name: string): any
+export function component (comp: any): any
+
 export function setIcon(options?: VxeGlobalIcon): VXETableCore
 
 export interface VXETablePluginObject {
@@ -192,11 +200,13 @@ export interface VXETableCore {
    * 版本号
    */
   version: string
+  tableVersion?: string;
   /**
    * 设置全局参数/获取所有参数
    */
   setConfig: VxeGlobalConfigMethod
   setTheme: VxeGlobalThemeMethod
+  getTheme: VxeGlobalGetThemeMethod
   setIcon: typeof setIcon
   /**
    * 读取内部数据
@@ -259,6 +269,9 @@ export interface VXETableCore {
   t: VxeGlobalI18n
   _t: VxeGlobalTranslate
 
+  getComponent: typeof getComponent,
+  component: typeof component,
+
   /**
    * 请使用 setConfig
    * @deprecated

package/types/v-x-e-table/menus.d.ts

@@ -6,7 +6,15 @@ import { VxeGlobalRendererHandles } from './renderer'
 
 export namespace VxeGlobalMenusHandles {
   export type MenusOption<D = VxeTableDataRow> = {
+    /**
+       * 已废弃，请使用 tableMenuMethod
+       * @deprecated
+       */
     menuMethod?: (params: MenuMethodParams<D>, event: Event) => any
+    /**
+       * 表格 - 自定义菜单方法
+       */
+    tableMenuMethod?: (params: MenuMethodParams<D>, event: Event) => any
   }
   export interface MenuMethodParams<D = VxeTableDataRow> extends VxeGlobalRendererHandles.RenderCellParams<D> {
     $grid: VxeGridConstructor<D> | null