fix(VxeTable): 更新vxe-table以及相关依赖,修改废弃API至最新 (#3939)

2025-12-30 05:12:24 +00:00 · 2024-07-04 08:49:47 +08:00
parent cae5538aba
commit 64a4992a84
28 changed files with 235 additions and 186 deletions
--- a/package.json
+++ b/package.json
@@ -107,9 +107,10 @@
    "vue-router": "^4.3.2",
    "vue-types": "^5.1.1",
    "vuedraggable": "^4.1.0",
-    "vxe-table": "^4.7.31",
-    "vxe-table-plugin-export-xlsx": "^4.0.2",
-    "xe-utils": "^3.5.25",
+    "vxe-pc-ui": "^4.0.44",
+    "vxe-table": "^4.7.40",
+    "vxe-table-plugin-export-xlsx": "^4.0.4",
+    "xe-utils": "^3.5.28",
    "xlsx": "^0.18.5"
  },
  "devDependencies": {
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -122,15 +122,18 @@ importers:
      vuedraggable:
        specifier: ^4.1.0
        version: 4.1.0(vue@3.4.25(typescript@5.4.5))
+      vxe-pc-ui:
+        specifier: ^4.0.44
+        version: 4.0.44
      vxe-table:
-        specifier: ^4.6.3
-        version: 4.6.3(vue@3.4.25(typescript@5.4.5))
+        specifier: ^4.7.40
+        version: 4.7.40
      vxe-table-plugin-export-xlsx:
-        specifier: ^4.0.1
-        version: 4.0.1(vxe-table@4.6.3(vue@3.4.25(typescript@5.4.5)))
+        specifier: ^4.0.4
+        version: 4.0.4(vxe-table@4.7.40)
      xe-utils:
-        specifier: ^3.5.25
-        version: 3.5.25
+        specifier: ^3.5.28
+        version: 3.5.28
      xlsx:
        specifier: ^0.18.5
        version: 0.18.5
@@ -2005,6 +2008,9 @@ packages:
  '@vueuse/shared@10.9.0':
    resolution: {integrity: sha512-Uud2IWncmAfJvRaFYzv5OHDli+FbOzxiVEQdLCKQKLyhz94PIyFC3CHcH7EDMwIn8NPtD06+PNbC/PiO0LGLtw==}

+  '@vxe-ui/core@1.0.12':
+    resolution: {integrity: sha512-s79mQw6uYSbTVGBWbxrisHwJV1b770vZMT9XpY3khcFQhXNo25+PS3FLrNCSsBBJR0ZkBLOXDER/ft9DIqgFTw==}
+
  '@zxcvbn-ts/core@3.0.4':
    resolution: {integrity: sha512-aQeiT0F09FuJaAqNrxynlAwZ2mW/1MdXakKWNmGM1Qp/VaY6CnB/GfnMS2T8gB2231Esp1/maCWd8vTG4OuShw==}

@@ -3096,8 +3102,8 @@ packages:
  dom-serializer@2.0.0:
    resolution: {integrity: sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==}

-  dom-zindex@1.0.2:
-    resolution: {integrity: sha512-QceDZxPlvzhpg6e8szxNiKPUt5Y9SfFTe3nZy8og3JoPQPlAlzBzHa/lhDkhgeG3cjbKyQcuoic+wymF0o0d1Q==}
+  dom-zindex@1.0.4:
+    resolution: {integrity: sha512-PNk7u71TJ1C9Lwjjp5nNuQcVWuECFMmr9kZAwi2UbgWUM7jXdTCe4O4x5bhLUa07jpcZUVA5Du3ho7/FXzS9Ng==}

  domelementtype@1.3.1:
    resolution: {integrity: sha512-BSKB+TSpMpFI/HOxCNr1O8aMOTZ8hT3pM3GQ0w/mWRmkhEDSFJkkyzz4XQsBV44BChwGkrDfMyjVD0eA2aFV3w==}
@@ -7060,15 +7066,16 @@ packages:
    peerDependencies:
      vue: ^3.0.1

-  vxe-table-plugin-export-xlsx@4.0.1:
-    resolution: {integrity: sha512-puUOUfptu5ciEiFqTlVni3twLICSbkl87uXOsjZzrEyXJHJS9dYu7ZTD7/DRMqyuWyU3Idg7AekfcdcslP4Y/A==}
+  vxe-pc-ui@4.0.44:
+    resolution: {integrity: sha512-wiauFMmSvEkVKa/AsKGb5CMi91Ojts+Ydcn+iespgl3xMBD01BR/CGzeCI478P3XAFBsiN4gWlgxHmGP5TR8UA==}
+
+  vxe-table-plugin-export-xlsx@4.0.4:
+    resolution: {integrity: sha512-Og2ZcIWTV7msT1ddPT/spxJaP1T8wxs3Uuu1LO/3HL5Ugt9tShEY3FJ7YGic3j1Nk6ZZT+VsU+afgT5EzpcUJw==}
    peerDependencies:
      vxe-table: ^4.5.0

-  vxe-table@4.6.3:
-    resolution: {integrity: sha512-71FOi0lFQbvs1dUIZPTDCLaSJkRjLHlBuNzWIR9RofBe4EvhX4OowrhaCCsCXXKCCGSlJRp6+/O2c71lEZY9PQ==}
-    peerDependencies:
-      vue: ^3.2.28
+  vxe-table@4.7.40:
+    resolution: {integrity: sha512-y9VC3oLJgusxFj3xZ28G4gU+YClBuDIV8oM75Dx3doYJ7vanXZnSf70XJ+W5xEKflamUmjGre66XZ2b4XuqtMw==}

  w3c-hr-time@1.0.2:
    resolution: {integrity: sha512-z8P5DvDNjKDoFIHK7q8r8lackT6l+jo/Ye3HOle7l9nICP9lf1Ci25fy9vHd0JOWewkIFzXIEig3TdKT7JQ5fQ==}
@@ -7206,8 +7213,8 @@ packages:
      utf-8-validate:
        optional: true

-  xe-utils@3.5.25:
-    resolution: {integrity: sha512-d/ty5eo4hXtho/3195XAvqereIoSYJ+XfC52f3ZEPxTaCeyLFivDZTyX6gTdsR65ISH1Irvn85H0bSL60dUhSQ==}
+  xe-utils@3.5.28:
+    resolution: {integrity: sha512-oeLLJ0b54QdOSSgYQ9TiKW/xAGrc9r0weCA/5UfyGdm3n3js4cNOuuf9Tml7UwgBQpl4uWMbMwUZKLh2yqPF3A==}

  xlsx@0.18.5:
    resolution: {integrity: sha512-dmg3LCjBPHZnQp5/F/+nnTa+miPJxUXB6vtk42YjBBKayDNagxGEeIdWApkYPOf3Z3pm3k62Knjzp7lMeTEtFQ==}
@@ -9228,6 +9235,11 @@ snapshots:
      - '@vue/composition-api'
      - vue

+  '@vxe-ui/core@1.0.12':
+    dependencies:
+      dom-zindex: 1.0.4
+      xe-utils: 3.5.28
+
  '@zxcvbn-ts/core@3.0.4':
    dependencies:
      fastest-levenshtein: 1.0.16
@@ -10389,7 +10401,7 @@ snapshots:
      domhandler: 5.0.3
      entities: 4.5.0

-  dom-zindex@1.0.2: {}
+  dom-zindex@1.0.4: {}

  domelementtype@1.3.1: {}

@@ -15005,15 +15017,17 @@ snapshots:
      sortablejs: 1.14.0
      vue: 3.4.25(typescript@5.4.5)

-  vxe-table-plugin-export-xlsx@4.0.1(vxe-table@4.6.3(vue@3.4.25(typescript@5.4.5))):
+  vxe-pc-ui@4.0.44:
    dependencies:
-      vxe-table: 4.6.3(vue@3.4.25(typescript@5.4.5))
+      '@vxe-ui/core': 1.0.12

-  vxe-table@4.6.3(vue@3.4.25(typescript@5.4.5)):
+  vxe-table-plugin-export-xlsx@4.0.4(vxe-table@4.7.40):
    dependencies:
-      dom-zindex: 1.0.2
-      vue: 3.4.25(typescript@5.4.5)
-      xe-utils: 3.5.25
+      vxe-table: 4.7.40
+
+  vxe-table@4.7.40:
+    dependencies:
+      vxe-pc-ui: 4.0.44

  w3c-hr-time@1.0.2:
    dependencies:
@@ -15138,7 +15152,7 @@ snapshots:

  ws@8.16.0: {}

-  xe-utils@3.5.25: {}
+  xe-utils@3.5.28: {}

  xlsx@0.18.5:
    dependencies:
--- a/src/components/VxeTable/src/components/AApiSelect.tsx
+++ b/src/components/VxeTable/src/components/AApiSelect.tsx
@@ -1,20 +1,21 @@
 import XEUtils from 'xe-utils';
 import { createDefaultRender, createEditRender, createFormItemRender } from './common';
+import { VxeGlobalRendererOptions } from 'vxe-table';

 export default {
-  renderDefault: createDefaultRender({}, (_, params) => {
+  renderTableDefault: createDefaultRender({}, (_, params) => {
    return {
      params: XEUtils.get(params, 'row'),
    };
  }),
-  renderEdit: createEditRender({}, (_, params) => {
+  renderTableEdit: createEditRender({}, (_, params) => {
    return {
      params: XEUtils.get(params, 'row'),
    };
  }),
-  renderItemContent: createFormItemRender({}, (_, params) => {
+  renderFormItemContent: createFormItemRender({}, (_, params) => {
    return {
      params: XEUtils.get(params, 'row'),
    };
  }),
-};
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/AApiTreeSelect.tsx
+++ b/src/components/VxeTable/src/components/AApiTreeSelect.tsx
@@ -1,20 +1,21 @@
 import XEUtils from 'xe-utils';
 import { createDefaultRender, createEditRender, createFormItemRender } from './common';
+import { VxeGlobalRendererOptions } from 'vxe-table';

 export default {
-  renderDefault: createDefaultRender({}, (_, params) => {
+  renderTableDefault: createDefaultRender({}, (_, params) => {
    return {
      params: XEUtils.get(params, 'row'),
    };
  }),
-  renderEdit: createEditRender({}, (_, params) => {
+  renderTableEdit: createEditRender({}, (_, params) => {
    return {
      params: XEUtils.get(params, 'row'),
    };
  }),
-  renderItemContent: createFormItemRender({}, (_, params) => {
+  renderFormItemContent: createFormItemRender({}, (_, params) => {
    return {
      params: XEUtils.get(params, 'row'),
    };
  }),
-};
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/AAutoComplete.tsx
+++ b/src/components/VxeTable/src/components/AAutoComplete.tsx
@@ -1,3 +1,4 @@
+import { VxeGlobalRendererOptions } from 'vxe-table';
 import {
  createEditRender,
  createDefaultRender,
@@ -7,10 +8,10 @@ import {
 } from './common';

 export default {
-  autofocus: 'input.ant-input',
-  renderDefault: createDefaultRender(),
-  renderEdit: createEditRender(),
-  renderFilter: createFilterRender(),
-  defaultFilterMethod: createDefaultFilterRender(),
-  renderItemContent: createFormItemRender(),
-};
+  tableAutoFocus: 'input.ant-input',
+  renderTableDefault: createDefaultRender(),
+  renderTableEdit: createEditRender(),
+  renderTableFilter: createFilterRender(),
+  tableFilterDefaultMethod: createDefaultFilterRender(),
+  renderFormItemContent: createFormItemRender(),
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/AButton.tsx
+++ b/src/components/VxeTable/src/components/AButton.tsx
@@ -1,8 +1,9 @@
 import { h } from 'vue';
 import {
  FormItemContentRenderParams,
-  FormItemRenderOptions,
+  VxeFormItemPropTypes,
  VxeGlobalRendererHandles,
+  VxeGlobalRendererOptions,
 } from 'vxe-table';
 import XEUtils from 'xe-utils';
 import { cellText, createEvents, createProps, getComponent } from './common';
@@ -11,8 +12,8 @@ const COMPONENT_NAME = 'AButton';

 export function createEditRender() {
  return function (
-    renderOpts: VxeGlobalRendererHandles.RenderEditOptions,
-    params: VxeGlobalRendererHandles.RenderEditParams,
+    renderOpts: VxeGlobalRendererHandles.RenderTableEditOptions,
+    params: VxeGlobalRendererHandles.RenderTableEditParams,
  ) {
    const { attrs } = renderOpts;
    const Component = getComponent(COMPONENT_NAME);
@@ -29,8 +30,8 @@ export function createEditRender() {

 export function createDefaultRender() {
  return function (
-    renderOpts: VxeGlobalRendererHandles.RenderEditOptions,
-    params: VxeGlobalRendererHandles.RenderEditParams,
+    renderOpts: VxeGlobalRendererHandles.RenderTableEditOptions,
+    params: VxeGlobalRendererHandles.RenderTableEditParams,
  ) {
    const { attrs } = renderOpts;
    const Component = getComponent(COMPONENT_NAME);
@@ -50,7 +51,10 @@ export function createDefaultRender() {
 }

 export function createFormItemRender() {
-  return function (renderOpts: FormItemRenderOptions, params: FormItemContentRenderParams) {
+  return function (
+    renderOpts: VxeFormItemPropTypes.ItemRender,
+    params: FormItemContentRenderParams,
+  ) {
    const { attrs, content } = renderOpts;
    const { property, $form, data } = params;
    const props = createProps(renderOpts, null);
@@ -113,8 +117,8 @@ function createToolbarButtonRender() {
 }

 export default {
-  renderEdit: createEditRender(),
-  renderDefault: createDefaultRender(),
-  renderItemContent: createFormItemRender(),
+  renderTableEdit: createEditRender(),
+  renderTableDefault: createDefaultRender(),
+  renderFormItemContent: createFormItemRender(),
  renderToolbarButton: createToolbarButtonRender(),
-};
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/AButtonGroup.tsx
+++ b/src/components/VxeTable/src/components/AButtonGroup.tsx
@@ -1,20 +1,21 @@
 import {
  FormItemContentRenderParams,
-  FormItemRenderOptions,
+  VxeFormItemPropTypes,
  VxeGlobalRendererHandles,
+  VxeGlobalRendererOptions,
 } from 'vxe-table';
 import { createDefaultRender, createEditRender, createFormItemRender } from './AButton';

 function createEditButtonRender() {
  return function (
-    renderOpts: VxeGlobalRendererHandles.RenderEditOptions,
-    params: VxeGlobalRendererHandles.RenderEditParams,
+    renderOpts: VxeGlobalRendererHandles.RenderTableEditOptions,
+    params: VxeGlobalRendererHandles.RenderTableEditParams,
  ) {
    const buttonEditRender = createEditRender();
    const { children } = renderOpts;
    if (children) {
      return children.map(
-        (childRenderOpts: VxeGlobalRendererHandles.RenderEditOptions) =>
+        (childRenderOpts: VxeGlobalRendererHandles.RenderTableEditOptions) =>
          buttonEditRender(childRenderOpts, params)[0],
      );
    }
@@ -25,7 +26,7 @@ function createEditButtonRender() {
 function createDefaultButtonRender() {
  return function (
    renderOpts: VxeGlobalRendererHandles.RenderDefaultOptions,
-    params: VxeGlobalRendererHandles.RenderDefaultParams,
+    params: VxeGlobalRendererHandles.RenderTableDefaultParams,
  ) {
    const buttonDefaultRender = createDefaultRender();
    const { children } = renderOpts;
@@ -40,12 +41,16 @@ function createDefaultButtonRender() {
 }

 function createButtonItemRender() {
-  return function (renderOpts: FormItemRenderOptions, params: FormItemContentRenderParams) {
+  return function (
+    renderOpts: VxeFormItemPropTypes.ItemRender,
+    params: FormItemContentRenderParams,
+  ) {
    const buttonItemRender = createFormItemRender();
    const { children } = renderOpts;
    if (children) {
      return children.map(
-        (childRenderOpts: FormItemRenderOptions) => buttonItemRender(childRenderOpts, params)[0],
+        (childRenderOpts: VxeFormItemPropTypes.ItemRender) =>
+          buttonItemRender(childRenderOpts, params)[0],
      );
    }
    return [];
@@ -53,7 +58,7 @@ function createButtonItemRender() {
 }

 export default {
-  renderEdit: createEditButtonRender(),
-  renderDefault: createDefaultButtonRender(),
-  renderItemContent: createButtonItemRender(),
-};
+  renderTableEdit: createEditButtonRender(),
+  renderTableDefault: createDefaultButtonRender(),
+  renderFormItemContent: createButtonItemRender(),
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/ACascader.tsx
+++ b/src/components/VxeTable/src/components/ACascader.tsx
@@ -1,4 +1,4 @@
-import { VxeGlobalRendererHandles } from 'vxe-table';
+import { VxeGlobalRendererHandles, VxeGlobalRendererOptions } from 'vxe-table';
 import XEUtils from 'xe-utils';
 import {
  createEditRender,
@@ -21,7 +21,7 @@ function matchCascaderData(index: number, list: any[], values: any[], labels: an

 function getCascaderCellValue(
  renderOpts: VxeGlobalRendererHandles.RenderOptions,
-  params: VxeGlobalRendererHandles.RenderCellParams,
+  params: VxeGlobalRendererHandles.RenderTableCellParams,
 ) {
  const { props = {} } = renderOpts;
  const { row, column } = params;
@@ -35,8 +35,8 @@ function getCascaderCellValue(
 }

 export default {
-  renderEdit: createEditRender(),
-  renderCell: createCellRender(getCascaderCellValue),
-  renderItemContent: createFormItemRender(),
-  exportMethod: createExportMethod(getCascaderCellValue),
-};
+  renderTableEdit: createEditRender(),
+  renderTableCell: createCellRender(getCascaderCellValue),
+  renderFormItemContent: createFormItemRender(),
+  tableExportMethod: createExportMethod(getCascaderCellValue),
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/ACheckboxGroup.tsx
+++ b/src/components/VxeTable/src/components/ACheckboxGroup.tsx
@@ -1,5 +1,6 @@
+import { VxeGlobalRendererOptions } from 'vxe-table';
 import { createFormItemRender } from './common';

 export default {
-  renderItemContent: createFormItemRender(),
-};
+  renderFormItemContent: createFormItemRender(),
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/ADatePicker.tsx
+++ b/src/components/VxeTable/src/components/ADatePicker.tsx
@@ -1,4 +1,4 @@
-import { VxeGlobalRendererHandles } from 'vxe-table';
+import { VxeGlobalRendererHandles, VxeGlobalRendererOptions } from 'vxe-table';
 import XEUtils from 'xe-utils';
 import {
  createCellRender,
@@ -9,7 +9,9 @@ import {

 export function getDatePickerCellValue(
  renderOpts: VxeGlobalRendererHandles.RenderOptions,
-  params: VxeGlobalRendererHandles.RenderCellParams | VxeGlobalRendererHandles.ExportMethodParams,
+  params:
+    | VxeGlobalRendererHandles.RenderTableCellParams
+    | VxeGlobalRendererHandles.ExportMethodParams,
  defaultFormat: string,
 ) {
  const { props = {} } = renderOpts;
@@ -22,12 +24,12 @@ export function getDatePickerCellValue(
 }

 export default {
-  renderEdit: createEditRender(),
-  renderCell: createCellRender(getDatePickerCellValue, () => {
+  renderTableEdit: createEditRender(),
+  renderTableCell: createCellRender(getDatePickerCellValue, () => {
    return ['YYYY-MM-DD'];
  }),
-  renderItemContent: createFormItemRender(),
-  exportMethod: createExportMethod(getDatePickerCellValue, () => {
+  renderFormItemContent: createFormItemRender(),
+  tableExportMethod: createExportMethod(getDatePickerCellValue, () => {
    return ['YYYY-MM-DD'];
  }),
-};
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/AEmpty.tsx
+++ b/src/components/VxeTable/src/components/AEmpty.tsx
@@ -1,9 +1,9 @@
 import { h } from 'vue';
-import { VxeGlobalRendererHandles } from 'vxe-table';
+import { VxeGlobalRendererHandles, VxeGlobalRendererOptions } from 'vxe-table';
 import { getComponent } from './common';

 function createEmptyRender() {
-  return function (renderOpts: VxeGlobalRendererHandles.RenderEmptyOptions) {
+  return function (renderOpts: VxeGlobalRendererHandles.RenderTableEmptyOptions) {
    const { name, attrs, props } = renderOpts;

    const Component = getComponent(name);
@@ -23,5 +23,5 @@ function createEmptyRender() {
 }

 export default {
-  renderEmpty: createEmptyRender(),
-};
+  renderTableEmptyView: createEmptyRender(),
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/AInput.tsx
+++ b/src/components/VxeTable/src/components/AInput.tsx
@@ -1,3 +1,4 @@
+import { VxeGlobalRendererOptions } from 'vxe-table';
 import {
  createEditRender,
  createDefaultRender,
@@ -7,10 +8,10 @@ import {
 } from './common';

 export default {
-  autofocus: 'input.ant-input',
-  renderDefault: createDefaultRender(),
-  renderEdit: createEditRender(),
-  renderFilter: createFilterRender(),
-  defaultFilterMethod: createDefaultFilterRender(),
-  renderItemContent: createFormItemRender(),
-};
+  tableAutoFocus: 'input.ant-input',
+  renderTableDefault: createDefaultRender(),
+  renderTableEdit: createEditRender(),
+  renderTableFilter: createFilterRender(),
+  tableFilterDefaultMethod: createDefaultFilterRender(),
+  renderFormItemContent: createFormItemRender(),
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/AInputNumber.tsx
+++ b/src/components/VxeTable/src/components/AInputNumber.tsx
@@ -1,3 +1,4 @@
+import { VxeGlobalRendererOptions } from 'vxe-table';
 import {
  createEditRender,
  createFilterRender,
@@ -7,10 +8,10 @@ import {
 } from './common';

 export default {
-  autofocus: 'input.ant-input-number-input',
-  renderDefault: createDefaultRender(),
-  renderEdit: createEditRender(),
-  renderFilter: createFilterRender(),
-  defaultFilterMethod: createDefaultFilterRender(),
-  renderItemContent: createFormItemRender(),
-};
+  tableAutoFocus: 'input.ant-input-number-input',
+  renderTableDefault: createDefaultRender(),
+  renderTableEdit: createEditRender(),
+  renderTableFilter: createFilterRender(),
+  tableFilterDefaultMethod: createDefaultFilterRender(),
+  renderFormItemContent: createFormItemRender(),
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/AInputSearch.tsx
+++ b/src/components/VxeTable/src/components/AInputSearch.tsx
@@ -1,3 +1,4 @@
+import { VxeGlobalRendererOptions } from 'vxe-table';
 import {
  createEditRender,
  createDefaultRender,
@@ -8,10 +9,10 @@ import {
 } from './common';

 export default {
-  renderDefault: createDefaultRender(),
-  renderEdit: createEditRender(),
-  renderFilter: createFilterRender(),
-  defaultFilterMethod: createDefaultFilterRender(),
-  renderItemContent: createFormItemRender(),
+  renderTableDefault: createDefaultRender(),
+  renderTableEdit: createEditRender(),
+  renderTableFilter: createFilterRender(),
+  tableFilterDefaultMethod: createDefaultFilterRender(),
+  renderFormItemContent: createFormItemRender(),
  renderToolbarTool: createToolbarToolRender(),
-};
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/AMonthPicker.tsx
+++ b/src/components/VxeTable/src/components/AMonthPicker.tsx
@@ -1,3 +1,4 @@
+import { VxeGlobalRendererOptions } from 'vxe-table';
 import { getDatePickerCellValue } from './ADatePicker';
 import {
  createCellRender,
@@ -7,12 +8,12 @@ import {
 } from './common';

 export default {
-  renderEdit: createEditRender(),
-  renderCell: createCellRender(getDatePickerCellValue, () => {
+  renderTableEdit: createEditRender(),
+  renderTableCell: createCellRender(getDatePickerCellValue, () => {
    return ['YYYY-MM'];
  }),
-  renderItemContent: createFormItemRender(),
-  exportMethod: createExportMethod(getDatePickerCellValue, () => {
+  renderFormItemContent: createFormItemRender(),
+  tableExportMethod: createExportMethod(getDatePickerCellValue, () => {
    return ['YYYY-MM'];
  }),
-};
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/ARadioGroup.tsx
+++ b/src/components/VxeTable/src/components/ARadioGroup.tsx
@@ -1,5 +1,6 @@
+import { VxeGlobalRendererOptions } from 'vxe-table';
 import { createFormItemRender } from './common';

 export default {
-  renderItemContent: createFormItemRender(),
-};
+  renderFormItemContent: createFormItemRender(),
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/ARangePicker.tsx
+++ b/src/components/VxeTable/src/components/ARangePicker.tsx
@@ -1,4 +1,4 @@
-import { VxeColumnPropTypes, VxeGlobalRendererHandles } from 'vxe-table';
+import { VxeColumnPropTypes, VxeGlobalRendererHandles, VxeGlobalRendererOptions } from 'vxe-table';
 import XEUtils from 'xe-utils';
 import {
  createCellRender,
@@ -9,7 +9,9 @@ import {

 function getRangePickerCellValue(
  renderOpts: VxeColumnPropTypes.EditRender,
-  params: VxeGlobalRendererHandles.RenderCellParams | VxeGlobalRendererHandles.ExportMethodParams,
+  params:
+    | VxeGlobalRendererHandles.RenderTableCellParams
+    | VxeGlobalRendererHandles.ExportMethodParams,
 ) {
  const { props = {} } = renderOpts;
  const { row, column } = params;
@@ -23,8 +25,8 @@ function getRangePickerCellValue(
 }

 export default {
-  renderEdit: createEditRender(),
-  renderCell: createCellRender(getRangePickerCellValue),
-  renderItemContent: createFormItemRender(),
-  exportMethod: createExportMethod(getRangePickerCellValue),
-};
+  renderTableEdit: createEditRender(),
+  renderTableCell: createCellRender(getRangePickerCellValue),
+  renderFormItemContent: createFormItemRender(),
+  tableExportMethod: createExportMethod(getRangePickerCellValue),
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/ARate.tsx
+++ b/src/components/VxeTable/src/components/ARate.tsx
@@ -1,3 +1,4 @@
+import { VxeGlobalRendererOptions } from 'vxe-table';
 import {
  createEditRender,
  createDefaultRender,
@@ -7,9 +8,9 @@ import {
 } from './common';

 export default {
-  renderDefault: createDefaultRender(),
-  renderEdit: createEditRender(),
-  renderFilter: createFilterRender(),
-  defaultFilterMethod: createDefaultFilterRender(),
-  renderItemContent: createFormItemRender(),
-};
+  renderTableDefault: createDefaultRender(),
+  renderTableEdit: createEditRender(),
+  renderTableFilter: createFilterRender(),
+  tableFilterDefaultMethod: createDefaultFilterRender(),
+  renderFormItemContent: createFormItemRender(),
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/ASelect.tsx
+++ b/src/components/VxeTable/src/components/ASelect.tsx
@@ -1,5 +1,5 @@
 import { ComponentOptions, h, resolveComponent } from 'vue';
-import { VxeColumnPropTypes, VxeGlobalRendererHandles } from 'vxe-table';
+import { VxeColumnPropTypes, VxeGlobalRendererHandles, VxeGlobalRendererOptions } from 'vxe-table';
 import XEUtils from 'xe-utils';
 import {
  cellText,
@@ -32,7 +32,7 @@ function renderOptions(options: any[], optionProps: VxeGlobalRendererHandles.Ren
 function createEditRender() {
  return function (
    renderOpts: VxeColumnPropTypes.EditRender,
-    params: VxeGlobalRendererHandles.RenderEditParams,
+    params: VxeGlobalRendererHandles.RenderTableEditParams,
  ) {
    const { options = [], optionGroups, optionProps = {}, optionGroupProps = {} } = renderOpts;
    const { row, column, $table } = params;
@@ -100,8 +100,8 @@ function createEditRender() {
 }

 function getSelectCellValue(
-  renderOpts: VxeGlobalRendererHandles.RenderCellOptions,
-  params: VxeGlobalRendererHandles.RenderCellParams,
+  renderOpts: VxeGlobalRendererHandles.RenderTableCellOptions,
+  params: VxeGlobalRendererHandles.RenderTableCellParams,
 ) {
  const {
    options = [],
@@ -144,7 +144,7 @@ function getSelectCellValue(
 function createFilterRender() {
  return function (
    renderOpts: VxeColumnPropTypes.FilterRender,
-    params: VxeGlobalRendererHandles.RenderFilterParams,
+    params: VxeGlobalRendererHandles.RenderTableFilterParams,
  ) {
    const { options = [], optionGroups, optionProps = {}, optionGroupProps = {} } = renderOpts;
    const groupOptions = optionGroupProps.options || 'options';
@@ -249,10 +249,10 @@ function createFilterRender() {
 }

 export default {
-  renderEdit: createEditRender(),
-  renderCell: createCellRender(getSelectCellValue),
-  renderFilter: createFilterRender(),
-  defaultFilterMethod(params) {
+  renderTableEdit: createEditRender(),
+  renderTableCell: createCellRender(getSelectCellValue),
+  renderTableFilter: createFilterRender(),
+  tableFilterDefaultMethod(params) {
    const { option, row, column } = params;
    const { data } = option;
    const { field, filterRender: renderOpts } = column;
@@ -266,6 +266,6 @@ export default {
    }
    return cellValue == data;
  },
-  renderItemContent: createFormItemRender(),
-  exportMethod: createExportMethod(getSelectCellValue),
-};
+  renderFormItemContent: createFormItemRender(),
+  tableExportMethod: createExportMethod(getSelectCellValue),
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/ASwitch.tsx
+++ b/src/components/VxeTable/src/components/ASwitch.tsx
@@ -9,11 +9,12 @@ import {
  createFormItemRender,
  getComponent,
 } from './common';
+import { VxeGlobalRendererOptions } from 'vxe-table';

 export default {
-  renderDefault: createDefaultRender(),
-  renderEdit: createEditRender(),
-  renderFilter(renderOpts, params) {
+  renderTableDefault: createDefaultRender(),
+  renderTableEdit: createEditRender(),
+  renderTableFilter(renderOpts, params) {
    const { column } = params;
    const { name, attrs } = renderOpts;
    const Component = getComponent(name);
@@ -48,6 +49,6 @@ export default {
      ),
    ];
  },
-  defaultFilterMethod: createDefaultFilterRender(),
-  renderItemContent: createFormItemRender(),
-};
+  tableFilterDefaultMethod: createDefaultFilterRender(),
+  renderFormItemContent: createFormItemRender(),
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/ATimePicker.tsx
+++ b/src/components/VxeTable/src/components/ATimePicker.tsx
@@ -1,3 +1,4 @@
+import { VxeGlobalRendererOptions } from 'vxe-table';
 import { getDatePickerCellValue } from './ADatePicker';
 import {
  createEditRender,
@@ -7,12 +8,12 @@ import {
 } from './common';

 export default {
-  renderEdit: createEditRender(),
-  renderCell: createCellRender(getDatePickerCellValue, () => {
+  renderTableEdit: createEditRender(),
+  renderTableCell: createCellRender(getDatePickerCellValue, () => {
    return ['HH:mm:ss'];
  }),
-  renderItemContent: createFormItemRender(),
-  exportMethod: createExportMethod(getDatePickerCellValue, () => {
+  renderFormItemContent: createFormItemRender(),
+  tableExportMethod: createExportMethod(getDatePickerCellValue, () => {
    return ['HH:mm:ss'];
  }),
-};
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/ATreeSelect.tsx
+++ b/src/components/VxeTable/src/components/ATreeSelect.tsx
@@ -1,4 +1,4 @@
-import { VxeGlobalRendererHandles } from 'vxe-table';
+import { VxeGlobalRendererHandles, VxeGlobalRendererOptions } from 'vxe-table';
 import XEUtils from 'xe-utils';
 import {
  createEditRender,
@@ -10,7 +10,9 @@ import {

 function getTreeSelectCellValue(
  renderOpts: VxeGlobalRendererHandles.RenderOptions,
-  params: VxeGlobalRendererHandles.RenderCellParams | VxeGlobalRendererHandles.ExportMethodParams,
+  params:
+    | VxeGlobalRendererHandles.RenderTableCellParams
+    | VxeGlobalRendererHandles.ExportMethodParams,
 ) {
  const { props = {} } = renderOpts;
  const { treeData, treeCheckable } = props;
@@ -28,8 +30,8 @@ function getTreeSelectCellValue(
 }

 export default {
-  renderEdit: createEditRender(),
-  renderCell: createCellRender(getTreeSelectCellValue),
-  renderItemContent: createFormItemRender(),
-  exportMethod: createExportMethod(getTreeSelectCellValue),
-};
+  renderTableEdit: createEditRender(),
+  renderTableCell: createCellRender(getTreeSelectCellValue),
+  renderFormItemContent: createFormItemRender(),
+  tableExportMethod: createExportMethod(getTreeSelectCellValue),
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/AWeekPicker.tsx
+++ b/src/components/VxeTable/src/components/AWeekPicker.tsx
@@ -1,3 +1,4 @@
+import { VxeGlobalRendererOptions } from 'vxe-table';
 import { getDatePickerCellValue } from './ADatePicker';
 import {
  createEditRender,
@@ -7,12 +8,12 @@ import {
 } from './common';

 export default {
-  renderEdit: createEditRender(),
-  renderCell: createCellRender(getDatePickerCellValue, () => {
+  renderTableEdit: createEditRender(),
+  renderTableCell: createCellRender(getDatePickerCellValue, () => {
    return ['YYYY-WW周'];
  }),
-  renderItemContent: createFormItemRender(),
-  exportMethod: createExportMethod(getDatePickerCellValue, () => {
+  renderFormItemContent: createFormItemRender(),
+  tableExportMethod: createExportMethod(getDatePickerCellValue, () => {
    return ['YYYY-WW周'];
  }),
-};
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/AYearPicker.tsx
+++ b/src/components/VxeTable/src/components/AYearPicker.tsx
@@ -1,3 +1,4 @@
+import { VxeGlobalRendererOptions } from 'vxe-table';
 import { getDatePickerCellValue } from './ADatePicker';
 import {
  createEditRender,
@@ -7,12 +8,12 @@ import {
 } from './common';

 export default {
-  renderEdit: createEditRender(),
-  renderCell: createCellRender(getDatePickerCellValue, () => {
+  renderTableEdit: createEditRender(),
+  renderTableCell: createCellRender(getDatePickerCellValue, () => {
    return ['YYYY'];
  }),
-  renderItemContent: createFormItemRender(),
-  exportMethod: createExportMethod(getDatePickerCellValue, () => {
+  renderFormItemContent: createFormItemRender(),
+  tableExportMethod: createExportMethod(getDatePickerCellValue, () => {
    return ['YYYY'];
  }),
-};
+} as VxeGlobalRendererOptions;
--- a/src/components/VxeTable/src/components/common.tsx
+++ b/src/components/VxeTable/src/components/common.tsx
@@ -1,7 +1,7 @@
 import { ComponentOptions, h } from 'vue';
 import {
  FormItemContentRenderParams,
-  FormItemRenderOptions,
+  VxeFormItemPropTypes,
  VxeGlobalRendererHandles,
 } from 'vxe-table';
 import XEUtils from 'xe-utils';
@@ -160,12 +160,12 @@ export function createDefaultRender(
  defaultProps?: { [key: string]: any },
  callBack?: (
    renderOpts: VxeGlobalRendererHandles.RenderDefaultOptions,
-    params: VxeGlobalRendererHandles.RenderDefaultParams,
+    params: VxeGlobalRendererHandles.RenderTableDefaultParams,
  ) => Record<string, any>,
 ) {
  return function (
    renderOpts: VxeGlobalRendererHandles.RenderDefaultOptions,
-    params: VxeGlobalRendererHandles.RenderDefaultParams,
+    params: VxeGlobalRendererHandles.RenderTableDefaultParams,
  ) {
    const { row, column, $table } = params;
    const { name, attrs } = renderOpts;
@@ -195,13 +195,13 @@ export function createDefaultRender(
 export function createEditRender(
  defaultProps?: { [key: string]: any },
  callBack?: (
-    renderOpts: VxeGlobalRendererHandles.RenderEditOptions,
-    params: VxeGlobalRendererHandles.RenderEditParams,
+    renderOpts: VxeGlobalRendererHandles.RenderTableEditOptions,
+    params: VxeGlobalRendererHandles.RenderTableEditParams,
  ) => Record<string, any>,
 ) {
  return function (
-    renderOpts: VxeGlobalRendererHandles.RenderEditOptions,
-    params: VxeGlobalRendererHandles.RenderEditParams,
+    renderOpts: VxeGlobalRendererHandles.RenderTableEditOptions,
+    params: VxeGlobalRendererHandles.RenderTableEditParams,
  ) {
    const { row, column, $table } = params;
    const { name, attrs } = renderOpts;
@@ -232,12 +232,12 @@ export function createFilterRender(
  defaultProps?: { [key: string]: any },
  callBack?: (
    renderOpts: VxeGlobalRendererHandles.RenderFilterOptions,
-    params: VxeGlobalRendererHandles.RenderFilterParams,
+    params: VxeGlobalRendererHandles.RenderTableFilterParams,
  ) => Record<string, any>,
 ) {
  return function (
    renderOpts: VxeGlobalRendererHandles.RenderFilterOptions,
-    params: VxeGlobalRendererHandles.RenderFilterParams,
+    params: VxeGlobalRendererHandles.RenderTableFilterParams,
  ) {
    const { column } = params;
    const { name, attrs } = renderOpts;
@@ -287,7 +287,7 @@ export function createFilterRender(
 */

 export function createDefaultFilterRender() {
-  return function (params: VxeGlobalRendererHandles.FilterMethodParams) {
+  return function (params: VxeGlobalRendererHandles.TableFilterMethodParams) {
    const { option, row, column } = params;
    const { data } = option;
    const cellValue = XEUtils.get(row, column.field as string);
@@ -301,11 +301,14 @@ export function createDefaultFilterRender() {
 export function createFormItemRender(
  defaultProps?: { [key: string]: any },
  callBack?: (
-    renderOpts: FormItemRenderOptions,
+    renderOpts: VxeFormItemPropTypes.ItemRender,
    params: FormItemContentRenderParams,
  ) => Record<string, any>,
 ) {
-  return function (renderOpts: FormItemRenderOptions, params: FormItemContentRenderParams) {
+  return function (
+    renderOpts: VxeFormItemPropTypes.ItemRender,
+    params: FormItemContentRenderParams,
+  ) {
    const args = (callBack && callBack(renderOpts, params)) ?? {};
    const { data, property, $form } = params;
    const { name } = renderOpts;
@@ -344,13 +347,13 @@ export function createFormItemRender(
 export function createCellRender(
  getSelectCellValue: Function,
  callBack?: (
-    renderOpts: VxeGlobalRendererHandles.RenderCellOptions,
-    params: VxeGlobalRendererHandles.RenderCellParams,
+    renderOpts: VxeGlobalRendererHandles.RenderTableCellOptions,
+    params: VxeGlobalRendererHandles.RenderTableCellParams,
  ) => Array<any>,
 ) {
  return function (
-    renderOpts: VxeGlobalRendererHandles.RenderCellOptions,
-    params: VxeGlobalRendererHandles.RenderCellParams,
+    renderOpts: VxeGlobalRendererHandles.RenderTableCellOptions,
+    params: VxeGlobalRendererHandles.RenderTableCellParams,
  ) {
    const args = (callBack && callBack(renderOpts, params)) ?? [];
    const cellLabel = getSelectCellValue && getSelectCellValue(renderOpts, params, ...args);
--- a/src/components/VxeTable/src/components/index.tsx
+++ b/src/components/VxeTable/src/components/index.tsx
@@ -1,4 +1,4 @@
-import { VXETableCore, VxeGlobalInterceptorHandles } from 'vxe-table';
+import { VxeUIExport, VxeGlobalInterceptorHandles } from 'vxe-table';
 import AAutoComplete from './AAutoComplete';
 import AInput from './AInput';
 import AInputNumber from './AInputNumber';
@@ -50,7 +50,7 @@ function getEventTargetNode(evnt: any, container: HTMLElement, className: string
 function handleClearEvent(
  params:
    | VxeGlobalInterceptorHandles.InterceptorClearFilterParams
-    | VxeGlobalInterceptorHandles.InterceptorClearActivedParams
+    | VxeGlobalInterceptorHandles.InterceptorClearEditParams
    | VxeGlobalInterceptorHandles.InterceptorClearAreasParams,
 ) {
  const { $event } = params;
@@ -73,7 +73,7 @@ function handleClearEvent(
 * 基于 vxe-table 表格的适配插件，用于兼容 ant-design-vue 组件库
 */
 export const VXETablePluginAntd = {
-  install(vxetablecore: VXETableCore) {
+  install(vxetablecore: VxeUIExport) {
    const { interceptor, renderer } = vxetablecore;

    renderer.mixin({
@@ -102,13 +102,13 @@ export const VXETablePluginAntd = {
    });

    interceptor.add('event.clearFilter', handleClearEvent);
-    interceptor.add('event.clearActived', handleClearEvent);
+    interceptor.add('event.clearEdit', handleClearEvent);
    interceptor.add('event.clearAreas', handleClearEvent);
  },
 };

-if (typeof window !== 'undefined' && window.VXETable && window.VXETable.use) {
-  window.VXETable.use(VXETablePluginAntd);
+if (typeof window !== 'undefined' && window.VxeUI && window.VxeUI.use) {
+  window.VxeUI.use(VXETablePluginAntd);
 }

 export default VXETablePluginAntd;
--- a/src/components/VxeTable/src/css/index.scss
+++ b/src/components/VxeTable/src/css/index.scss
@@ -3,3 +3,4 @@
@import './toolbar';
@import './component';
@import 'vxe-table/styles/all';
+@import 'vxe-pc-ui/styles/all';
--- a/src/components/registerGlobComp.ts
+++ b/src/components/registerGlobComp.ts
@@ -2,7 +2,8 @@ import type { App } from 'vue';
 import { Button } from './Button';
 import { Input, Layout } from 'ant-design-vue';
 import VXETable from 'vxe-table';
+import VXEUI from 'vxe-pc-ui';

 export function registerGlobComp(app: App) {
-  app.use(Input).use(Button).use(Layout).use(VXETable);
+  app.use(Input).use(Button).use(Layout).use(VXETable).use(VXEUI);
 }