diff --git a/build/config/themeConfig.ts b/build/config/themeConfig.ts
index 8dbe118..5ab671a 100644
--- a/build/config/themeConfig.ts
+++ b/build/config/themeConfig.ts
@@ -30,12 +30,7 @@ export function getThemeColors(color?: string) {
   return [...lightColors, ...modeColors];
 }
 
-export function generateColors({
-  color = primaryColor,
-  mixLighten,
-  mixDarken,
-  tinycolor,
-}: GenerateColorsParams) {
+export function generateColors({ color = primaryColor, mixLighten, mixDarken, tinycolor }: GenerateColorsParams) {
   const arr = new Array(19).fill(0);
   const lightens = arr.map((_t, i) => {
     return mixLighten(color, i / 5);
@@ -68,12 +63,5 @@ export function generateColors({
         .toHexString();
     })
     .filter((item) => item !== '#000000');
-  return [
-    ...lightens,
-    ...darkens,
-    ...alphaColors,
-    ...shortAlphaColors,
-    ...tinycolorDarkens,
-    ...tinycolorLightens,
-  ].filter((item) => !item.includes('-'));
+  return [...lightens, ...darkens, ...alphaColors, ...shortAlphaColors, ...tinycolorDarkens, ...tinycolorLightens].filter((item) => !item.includes('-'));
 }
diff --git a/build/generate/icon/index.ts b/build/generate/icon/index.ts
index a9bac80..fb9819a 100644
--- a/build/generate/icon/index.ts
+++ b/build/generate/icon/index.ts
@@ -51,21 +51,14 @@ async function generateIcon() {
         if (data) {
           const { prefix } = data;
           const isLocal = useType === 'local';
-          const icons = Object.keys(data.icons).map(
-            (item) => `${isLocal ? prefix + ':' : ''}${item}`
-          );
+          const icons = Object.keys(data.icons).map((item) => `${isLocal ? prefix + ':' : ''}${item}`);
 
-          await fs.writeFileSync(
-            path.join(output, `icons.data.ts`),
-            `export default ${isLocal ? JSON.stringify(icons) : JSON.stringify({ prefix, icons })}`
-          );
+          await fs.writeFileSync(path.join(output, `icons.data.ts`), `export default ${isLocal ? JSON.stringify(icons) : JSON.stringify({ prefix, icons })}`);
           prefixSet.push(prefix);
         }
       }
       fs.emptyDir(path.join(process.cwd(), 'node_modules/.vite'));
-      console.log(
-        `✨ ${chalk.cyan(`[${pkg.name}]`)}` + ' - Icon generated successfully:' + `[${prefixSet}]`
-      );
+      console.log(`✨ ${chalk.cyan(`[${pkg.name}]`)}` + ' - Icon generated successfully:' + `[${prefixSet}]`);
     });
 }
 
diff --git a/build/getConfigFileName.ts b/build/getConfigFileName.ts
index d61cd41..46cb902 100644
--- a/build/getConfigFileName.ts
+++ b/build/getConfigFileName.ts
@@ -3,7 +3,5 @@
  * @param env
  */
 export const getConfigFileName = (env: Record<string, any>) => {
-  return `__PRODUCTION__${env.VITE_GLOB_APP_SHORT_NAME || '__APP'}__CONF__`
-    .toUpperCase()
-    .replace(/\s/g, '');
+  return `__PRODUCTION__${env.VITE_GLOB_APP_SHORT_NAME || '__APP'}__CONF__`.toUpperCase().replace(/\s/g, '');
 };
diff --git a/build/script/postBuild.ts b/build/script/postBuild.ts
index f2a9971..e1554bf 100644
--- a/build/script/postBuild.ts
+++ b/build/script/postBuild.ts
@@ -11,7 +11,7 @@ export const runBuild = async () => {
 
     // Generate configuration file
     if (!argvList.includes('disabled-config')) {
-       runBuildConfig();
+      runBuildConfig();
     }
 
     console.log(`✨ ${chalk.cyan(`[${pkg.name}]`)}` + ' - build successfully!');
diff --git a/build/utils.ts b/build/utils.ts
index 989d1b4..c201514 100644
--- a/build/utils.ts
+++ b/build/utils.ts
@@ -3,60 +3,60 @@ import path from 'path';
 import dotenv from 'dotenv';
 
 export function isDevFn(mode: string): boolean {
-    return mode === 'development';
+  return mode === 'development';
 }
 
 export function isProdFn(mode: string): boolean {
-    return mode === 'production';
+  return mode === 'production';
 }
 
 /**
  * Whether to generate package preview
  */
 export function isReportMode(): boolean {
-    return process.env.REPORT === 'true';
+  return process.env.REPORT === 'true';
 }
 
 // Read all environment variable configuration files to process.env
 export function wrapperEnv(envConf: Recordable): ViteEnv {
-    const ret: any = {};
+  const ret: any = {};
 
-    for (const envName of Object.keys(envConf)) {
-        let realName = envConf[envName].replace(/\\n/g, '\n');
-        realName = realName === 'true' ? true : realName === 'false' ? false : realName;
+  for (const envName of Object.keys(envConf)) {
+    let realName = envConf[envName].replace(/\\n/g, '\n');
+    realName = realName === 'true' ? true : realName === 'false' ? false : realName;
 
-        if (envName === 'VITE_PORT') {
-            realName = Number(realName);
-        }
-        if (envName === 'VITE_PROXY' && realName) {
-          try {
-            realName = JSON.parse(realName.replace(/'/g, '"'));
-          } catch (error) {
-            realName = '';
-          }
-        }
-        ret[envName] = realName;
-        if (typeof realName === 'string') {
-            process.env[envName] = realName;
-        } else if (typeof realName === 'object') {
-            process.env[envName] = JSON.stringify(realName);
-        }
+    if (envName === 'VITE_PORT') {
+      realName = Number(realName);
     }
-    return ret;
+    if (envName === 'VITE_PROXY' && realName) {
+      try {
+        realName = JSON.parse(realName.replace(/'/g, '"'));
+      } catch (error) {
+        realName = '';
+      }
+    }
+    ret[envName] = realName;
+    if (typeof realName === 'string') {
+      process.env[envName] = realName;
+    } else if (typeof realName === 'object') {
+      process.env[envName] = JSON.stringify(realName);
+    }
+  }
+  return ret;
 }
 
 /**
  * 获取当前环境下生效的配置文件名
  */
 function getConfFiles() {
-    const script = process.env.npm_lifecycle_script;
-    const reg = new RegExp('--mode ([a-z_\\d]+)');
-    const result = reg.exec(script as string) as any;
-    if (result) {
-        const mode = result[1] as string;
-        return ['.env', `.env.${mode}`];
-    }
-    return ['.env', '.env.production'];
+  const script = process.env.npm_lifecycle_script;
+  const reg = new RegExp('--mode ([a-z_\\d]+)');
+  const result = reg.exec(script as string) as any;
+  if (result) {
+    const mode = result[1] as string;
+    return ['.env', `.env.${mode}`];
+  }
+  return ['.env', '.env.production'];
 }
 
 /**
@@ -65,22 +65,22 @@ function getConfFiles() {
  * @param confFiles ext
  */
 export function getEnvConfig(match = 'VITE_GLOB_', confFiles = getConfFiles()) {
-    let envConfig = {};
-    confFiles.forEach((item) => {
-        try {
-            const env = dotenv.parse(fs.readFileSync(path.resolve(process.cwd(), item)));
-            envConfig = {...envConfig, ...env};
-        } catch (e) {
-            console.error(`Error in parsing ${item}`, e);
-        }
-    });
-    const reg = new RegExp(`^(${match})`);
-    Object.keys(envConfig).forEach((key) => {
-        if (!reg.test(key)) {
-            Reflect.deleteProperty(envConfig, key);
-        }
-    });
-    return envConfig;
+  let envConfig = {};
+  confFiles.forEach((item) => {
+    try {
+      const env = dotenv.parse(fs.readFileSync(path.resolve(process.cwd(), item)));
+      envConfig = { ...envConfig, ...env };
+    } catch (e) {
+      console.error(`Error in parsing ${item}`, e);
+    }
+  });
+  const reg = new RegExp(`^(${match})`);
+  Object.keys(envConfig).forEach((key) => {
+    if (!reg.test(key)) {
+      Reflect.deleteProperty(envConfig, key);
+    }
+  });
+  return envConfig;
 }
 
 /**
@@ -88,5 +88,5 @@ export function getEnvConfig(match = 'VITE_GLOB_', confFiles = getConfFiles()) {
  * @param dir file path
  */
 export function getRootPath(...dir: string[]) {
-    return path.resolve(process.cwd(), ...dir);
+  return path.resolve(process.cwd(), ...dir);
 }
diff --git a/build/vite/plugin/compress.ts b/build/vite/plugin/compress.ts
index 34787ca..92cb9f8 100644
--- a/build/vite/plugin/compress.ts
+++ b/build/vite/plugin/compress.ts
@@ -5,10 +5,7 @@
 import type { Plugin } from 'vite';
 import compressPlugin from 'vite-plugin-compression';
 
-export function configCompressPlugin(
-  compress: 'gzip' | 'brotli' | 'none',
-  deleteOriginFile = false
-): Plugin | Plugin[] {
+export function configCompressPlugin(compress: 'gzip' | 'brotli' | 'none', deleteOriginFile = false): Plugin | Plugin[] {
   const compressList = compress.split(',');
 
   const plugins: Plugin[] = [];
diff --git a/build/vite/plugin/html.ts b/build/vite/plugin/html.ts
index 15eee75..848190b 100644
--- a/build/vite/plugin/html.ts
+++ b/build/vite/plugin/html.ts
@@ -25,7 +25,7 @@ export function configHtmlPlugin(env: ViteEnv, isBuild: boolean) {
       },
       // Embed the generated app.config.js file
       tags: isBuild
-          ? [
+        ? [
             {
               tag: 'script',
               attrs: {
@@ -33,7 +33,7 @@ export function configHtmlPlugin(env: ViteEnv, isBuild: boolean) {
               },
             },
           ]
-          : [],
+        : [],
     },
   });
   return htmlPlugin;
diff --git a/build/vite/plugin/index.ts b/build/vite/plugin/index.ts
index 9ddbf23..8388ebc 100644
--- a/build/vite/plugin/index.ts
+++ b/build/vite/plugin/index.ts
@@ -15,74 +15,66 @@ import { configThemePlugin } from './theme';
 import { configImageminPlugin } from './imagemin';
 import { configSvgIconsPlugin } from './svgSprite';
 import { configHmrPlugin } from './hmr';
-import OptimizationPersist from 'vite-plugin-optimize-persist'
-import PkgConfig from 'vite-plugin-package-config'
+import OptimizationPersist from 'vite-plugin-optimize-persist';
+import PkgConfig from 'vite-plugin-package-config';
 
 export function createVitePlugins(viteEnv: ViteEnv, isBuild: boolean) {
-    const {
-        VITE_USE_IMAGEMIN,
-        VITE_USE_MOCK,
-        VITE_LEGACY,
-        VITE_BUILD_COMPRESS,
-        VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE,
-    } = viteEnv;
+  const { VITE_USE_IMAGEMIN, VITE_USE_MOCK, VITE_LEGACY, VITE_BUILD_COMPRESS, VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE } = viteEnv;
 
-    const vitePlugins: (Plugin | Plugin[])[] = [
-        // have to
-        vue(),
-        // have to
-        vueJsx(),
-        // support name
-        vueSetupExtend(),
-    ];
+  const vitePlugins: (Plugin | Plugin[])[] = [
+    // have to
+    vue(),
+    // have to
+    vueJsx(),
+    // support name
+    vueSetupExtend(),
+  ];
 
-    // vite-plugin-windicss
-    vitePlugins.push(windiCSS());
+  // vite-plugin-windicss
+  vitePlugins.push(windiCSS());
 
-    // TODO
-    !isBuild && vitePlugins.push(configHmrPlugin());
+  // TODO
+  !isBuild && vitePlugins.push(configHmrPlugin());
 
-    // @vitejs/plugin-legacy
-    VITE_LEGACY && isBuild && vitePlugins.push(legacy());
+  // @vitejs/plugin-legacy
+  VITE_LEGACY && isBuild && vitePlugins.push(legacy());
 
-    // vite-plugin-html
-    vitePlugins.push(configHtmlPlugin(viteEnv, isBuild));
+  // vite-plugin-html
+  vitePlugins.push(configHtmlPlugin(viteEnv, isBuild));
 
-    // vite-plugin-svg-icons
-    vitePlugins.push(configSvgIconsPlugin(isBuild));
+  // vite-plugin-svg-icons
+  vitePlugins.push(configSvgIconsPlugin(isBuild));
 
-    // vite-plugin-mock
-    VITE_USE_MOCK && vitePlugins.push(configMockPlugin(isBuild));
+  // vite-plugin-mock
+  VITE_USE_MOCK && vitePlugins.push(configMockPlugin(isBuild));
 
-    // vite-plugin-purge-icons
-    vitePlugins.push(purgeIcons());
+  // vite-plugin-purge-icons
+  vitePlugins.push(purgeIcons());
 
-    // vite-plugin-style-import
-    vitePlugins.push(configStyleImportPlugin(isBuild));
+  // vite-plugin-style-import
+  vitePlugins.push(configStyleImportPlugin(isBuild));
 
-    // rollup-plugin-visualizer
-    vitePlugins.push(configVisualizerConfig());
+  // rollup-plugin-visualizer
+  vitePlugins.push(configVisualizerConfig());
 
-    //vite-plugin-theme
-    vitePlugins.push(configThemePlugin(isBuild));
+  //vite-plugin-theme
+  vitePlugins.push(configThemePlugin(isBuild));
 
-    // The following plugins only work in the production environment
-    if (isBuild) {
-        //vite-plugin-imagemin
-        VITE_USE_IMAGEMIN && vitePlugins.push(configImageminPlugin());
+  // The following plugins only work in the production environment
+  if (isBuild) {
+    //vite-plugin-imagemin
+    VITE_USE_IMAGEMIN && vitePlugins.push(configImageminPlugin());
 
-        // rollup-plugin-gzip
-        vitePlugins.push(
-            configCompressPlugin(VITE_BUILD_COMPRESS, VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE),
-        );
+    // rollup-plugin-gzip
+    vitePlugins.push(configCompressPlugin(VITE_BUILD_COMPRESS, VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE));
 
-        // vite-plugin-pwa
-        vitePlugins.push(configPwaConfig(viteEnv));
-    }
+    // vite-plugin-pwa
+    vitePlugins.push(configPwaConfig(viteEnv));
+  }
 
-    //vite-plugin-theme【解决vite首次打开界面加载慢问题】
-    vitePlugins.push(PkgConfig());
-    vitePlugins.push(OptimizationPersist());
+  //vite-plugin-theme【解决vite首次打开界面加载慢问题】
+  vitePlugins.push(PkgConfig());
+  vitePlugins.push(OptimizationPersist());
 
-    return vitePlugins;
+  return vitePlugins;
 }
diff --git a/build/vite/plugin/theme.ts b/build/vite/plugin/theme.ts
index d198d77..772af3c 100644
--- a/build/vite/plugin/theme.ts
+++ b/build/vite/plugin/theme.ts
@@ -4,86 +4,80 @@
  */
 import type { Plugin } from 'vite';
 import path from 'path';
-import {
-    viteThemePlugin,
-    antdDarkThemePlugin,
-    mixLighten,
-    mixDarken,
-    tinycolor,
-} from 'vite-plugin-theme';
+import { viteThemePlugin, antdDarkThemePlugin, mixLighten, mixDarken, tinycolor } from 'vite-plugin-theme';
 import { getThemeColors, generateColors } from '../../config/themeConfig';
 import { generateModifyVars } from '../../generate/generateModifyVars';
 
 export function configThemePlugin(isBuild: boolean): Plugin[] {
-    const colors = generateColors({
-        mixDarken,
-        mixLighten,
-        tinycolor,
-    });
-    const plugin = [
-        viteThemePlugin({
-            resolveSelector: (s) => {
-                s = s.trim();
-                switch (s) {
-                    case '.ant-steps-item-process .ant-steps-item-icon > .ant-steps-icon':
-                        return '.ant-steps-item-icon > .ant-steps-icon';
-                    case '.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled)':
-                    case '.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):hover':
-                    case '.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):active':
-                        return s;
-                    case '.ant-steps-item-icon > .ant-steps-icon':
-                        return s;
-                    case '.ant-select-item-option-selected:not(.ant-select-item-option-disabled)':
-                        return s;
-                    default:
-                        if (s.indexOf('.ant-btn') >= -1) {
-                            // 按钮被重新定制过，需要过滤掉class防止覆盖
-                            return s;
-                        }
-                }
-                return s.startsWith('[data-theme') ? s : `[data-theme] ${s}`;
-            },
-            colorVariables: [...getThemeColors(), ...colors],
-        }),
-        antdDarkThemePlugin({
-            preloadFiles: [
-                path.resolve(process.cwd(), 'node_modules/ant-design-vue/dist/antd.less'),
-                //path.resolve(process.cwd(), 'node_modules/ant-design-vue/dist/antd.dark.less'),
-                path.resolve(process.cwd(), 'src/design/index.less'),
-            ],
-            filter: (id) => (isBuild ? !id.endsWith('antd.less') : true),
-            // extractCss: false,
-            darkModifyVars: {
-                ...generateModifyVars(true),
-                'text-color': '#c9d1d9',
-                'primary-1': 'rgb(255 255 255 / 8%)',
-                'text-color-base': '#c9d1d9',
-                'component-background': '#151515',
-                'heading-color': 'rgb(255 255 255 / 65%)',
-                // black: '#0e1117',
-                // #8b949e
-                'text-color-secondary': '#8b949e',
-                'border-color-base': '#303030',
-                // 'border-color-split': '#30363d',
-                'item-active-bg': '#111b26',
-                'app-content-background': '#1e1e1e',
-                'tree-node-selected-bg': '#11263c',
+  const colors = generateColors({
+    mixDarken,
+    mixLighten,
+    tinycolor,
+  });
+  const plugin = [
+    viteThemePlugin({
+      resolveSelector: (s) => {
+        s = s.trim();
+        switch (s) {
+          case '.ant-steps-item-process .ant-steps-item-icon > .ant-steps-icon':
+            return '.ant-steps-item-icon > .ant-steps-icon';
+          case '.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled)':
+          case '.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):hover':
+          case '.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):active':
+            return s;
+          case '.ant-steps-item-icon > .ant-steps-icon':
+            return s;
+          case '.ant-select-item-option-selected:not(.ant-select-item-option-disabled)':
+            return s;
+          default:
+            if (s.indexOf('.ant-btn') >= -1) {
+              // 按钮被重新定制过，需要过滤掉class防止覆盖
+              return s;
+            }
+        }
+        return s.startsWith('[data-theme') ? s : `[data-theme] ${s}`;
+      },
+      colorVariables: [...getThemeColors(), ...colors],
+    }),
+    antdDarkThemePlugin({
+      preloadFiles: [
+        path.resolve(process.cwd(), 'node_modules/ant-design-vue/dist/antd.less'),
+        //path.resolve(process.cwd(), 'node_modules/ant-design-vue/dist/antd.dark.less'),
+        path.resolve(process.cwd(), 'src/design/index.less'),
+      ],
+      filter: (id) => (isBuild ? !id.endsWith('antd.less') : true),
+      // extractCss: false,
+      darkModifyVars: {
+        ...generateModifyVars(true),
+        'text-color': '#c9d1d9',
+        'primary-1': 'rgb(255 255 255 / 8%)',
+        'text-color-base': '#c9d1d9',
+        'component-background': '#151515',
+        'heading-color': 'rgb(255 255 255 / 65%)',
+        // black: '#0e1117',
+        // #8b949e
+        'text-color-secondary': '#8b949e',
+        'border-color-base': '#303030',
+        // 'border-color-split': '#30363d',
+        'item-active-bg': '#111b26',
+        'app-content-background': '#1e1e1e',
+        'tree-node-selected-bg': '#11263c',
 
-                'alert-success-border-color': '#274916',
-                'alert-success-bg-color': '#162312',
-                'alert-success-icon-color': '#49aa19',
-                'alert-info-border-color': '#153450',
-                'alert-info-bg-color': '#111b26',
-                'alert-info-icon-color': '#177ddc',
-                'alert-warning-border-color': '#594214',
-                'alert-warning-bg-color': '#2b2111',
-                'alert-warning-icon-color': '#d89614',
-                'alert-error-border-color': '#58181c',
-                'alert-error-bg-color': '#2a1215',
-                'alert-error-icon-color': '#a61d24',
-            },
-        }),
-    ];
+        'alert-success-border-color': '#274916',
+        'alert-success-bg-color': '#162312',
+        'alert-success-icon-color': '#49aa19',
+        'alert-info-border-color': '#153450',
+        'alert-info-bg-color': '#111b26',
+        'alert-info-icon-color': '#177ddc',
+        'alert-warning-border-color': '#594214',
+        'alert-warning-bg-color': '#2b2111',
+        'alert-warning-icon-color': '#d89614',
+        'alert-error-border-color': '#58181c',
+        'alert-error-bg-color': '#2a1215',
+        'alert-error-icon-color': '#a61d24',
+      },
+    }),
+  ];
 
-    return plugin as unknown as Plugin[];
+  return plugin as unknown as Plugin[];
 }
diff --git a/mock/_util.ts b/mock/_util.ts
index 6a171d5..aae271d 100644
--- a/mock/_util.ts
+++ b/mock/_util.ts
@@ -9,12 +9,7 @@ export function resultSuccess<T = Recordable>(result: T, { message = 'ok' } = {}
   };
 }
 
-export function resultPageSuccess<T = any>(
-  pageNo: number,
-  pageSize: number,
-  list: T[],
-  { message = 'ok' } = {}
-) {
+export function resultPageSuccess<T = any>(pageNo: number, pageSize: number, list: T[], { message = 'ok' } = {}) {
   const pageData = pagination(pageNo, pageSize, list);
 
   return {
@@ -37,10 +32,7 @@ export function resultError(message = 'Request failed', { code = -1, result = nu
 
 export function pagination<T = any>(pageNo: number, pageSize: number, array: T[]): T[] {
   const offset = (pageNo - 1) * Number(pageSize);
-  const ret =
-    offset + Number(pageSize) >= array.length
-      ? array.slice(offset, array.length)
-      : array.slice(offset, offset + Number(pageSize));
+  const ret = offset + Number(pageSize) >= array.length ? array.slice(offset, array.length) : array.slice(offset, offset + Number(pageSize));
   return ret;
 }
 
diff --git a/mock/demo/select-demo.ts b/mock/demo/select-demo.ts
index ca2d949..7105769 100644
--- a/mock/demo/select-demo.ts
+++ b/mock/demo/select-demo.ts
@@ -20,9 +20,9 @@ export default [
     timeout: 1000,
     method: 'get',
     response: ({ query }) => {
-      const { keyword,count} = query;
+      const { keyword, count } = query;
       console.log(keyword);
-      return resultSuccess(demoList(keyword,count));
+      return resultSuccess(demoList(keyword, count));
     },
   },
 ] as MockMethod[];
diff --git a/mock/demo/system.ts b/mock/demo/system.ts
index 940c04e..e2ed4cc 100644
--- a/mock/demo/system.ts
+++ b/mock/demo/system.ts
@@ -2,196 +2,183 @@ import { MockMethod } from 'vite-plugin-mock';
 import { resultError, resultPageSuccess, resultSuccess, baseUrl } from '../_util';
 
 const accountList = (() => {
-    const result: any[] = [];
-    for (let index = 0; index < 20; index++) {
-        result.push({
-            id: `${index}`,
-            account: '@first',
-            email: '@email',
-            nickname: '@cname()',
-            role: '@first',
-            createTime: '@datetime',
-            remark: '@cword(10,20)',
-            'status|1': ['0', '1'],
-        });
-    }
-    return result;
+  const result: any[] = [];
+  for (let index = 0; index < 20; index++) {
+    result.push({
+      id: `${index}`,
+      account: '@first',
+      email: '@email',
+      nickname: '@cname()',
+      role: '@first',
+      createTime: '@datetime',
+      remark: '@cword(10,20)',
+      'status|1': ['0', '1'],
+    });
+  }
+  return result;
 })();
 
 const userList = (() => {
-    const result: any[] = [];
-    for (let index = 0; index < 20; index++) {
-        result.push({
-            id: `${index}`,
-            username: '@first',
-            email: '@email',
-            realname: '@cname()',
-            createTime: '@datetime',
-            remark: '@cword(10,20)',
-            avatar: 'https://q1.qlogo.cn/g?b=qq&nk=190848757&s=640'
-        });
-    }
-    return result;
+  const result: any[] = [];
+  for (let index = 0; index < 20; index++) {
+    result.push({
+      id: `${index}`,
+      username: '@first',
+      email: '@email',
+      realname: '@cname()',
+      createTime: '@datetime',
+      remark: '@cword(10,20)',
+      avatar: 'https://q1.qlogo.cn/g?b=qq&nk=190848757&s=640',
+    });
+  }
+  return result;
 })();
 
 const roleList = (() => {
-    const result: any[] = [];
-    for (let index = 0; index < 4; index++) {
-        result.push({
-            id: index + 1,
-            orderNo: `${index + 1}`,
-            roleName: ['超级管理员', '管理员', '文章管理员', '普通用户'][index],
-            roleValue: '@first',
-            createTime: '@datetime',
-            remark: '@cword(10,20)',
-            menu: [['0', '1', '2'], ['0', '1'], ['0', '2'], ['2']][index],
-            'status|1': ['0', '1'],
-        });
-    }
-    return result;
+  const result: any[] = [];
+  for (let index = 0; index < 4; index++) {
+    result.push({
+      id: index + 1,
+      orderNo: `${index + 1}`,
+      roleName: ['超级管理员', '管理员', '文章管理员', '普通用户'][index],
+      roleValue: '@first',
+      createTime: '@datetime',
+      remark: '@cword(10,20)',
+      menu: [['0', '1', '2'], ['0', '1'], ['0', '2'], ['2']][index],
+      'status|1': ['0', '1'],
+    });
+  }
+  return result;
 })();
 
 const newRoleList = (() => {
-    const result: any[] = [];
-    for (let index = 0; index < 4; index++) {
-        result.push({
-            id: index + 1,
-            orderNo: `${index + 1}`,
-            roleName: ['超级管理员', '管理员', '文章管理员', '普通用户'][index],
-            roleCode: '@first',
-            createTime: '@datetime',
-            remark: '@cword(10,20)'
-        });
-    }
-    return result;
+  const result: any[] = [];
+  for (let index = 0; index < 4; index++) {
+    result.push({
+      id: index + 1,
+      orderNo: `${index + 1}`,
+      roleName: ['超级管理员', '管理员', '文章管理员', '普通用户'][index],
+      roleCode: '@first',
+      createTime: '@datetime',
+      remark: '@cword(10,20)',
+    });
+  }
+  return result;
 })();
 
 const testList = (() => {
-    const result: any[] = [];
-    for (let index = 0; index < 4; index++) {
-        result.push({
-            id: index + 1,
-            orderNo: `${index + 1}`,
-            testName: ['数据1', '数据2', '数据3', '数据4'][index],
-            testValue: '@first',
-            createTime: '@datetime'
-        });
-    }
-    return result;
+  const result: any[] = [];
+  for (let index = 0; index < 4; index++) {
+    result.push({
+      id: index + 1,
+      orderNo: `${index + 1}`,
+      testName: ['数据1', '数据2', '数据3', '数据4'][index],
+      testValue: '@first',
+      createTime: '@datetime',
+    });
+  }
+  return result;
 })();
 
 const tableDemoList = (() => {
-    const result: any[] = [];
-    for (let index = 0; index < 4; index++) {
-        result.push({
-            id: index + 1,
-            orderCode: '2008200' + `${index + 1}`,
-            orderMoney: '@natural(1000,3000)',
-            ctype: '@natural(1,2)',
-            content: '@cword(10,20)',
-            orderDate: '@datetime'
-        });
-    }
-    return result;
+  const result: any[] = [];
+  for (let index = 0; index < 4; index++) {
+    result.push({
+      id: index + 1,
+      orderCode: '2008200' + `${index + 1}`,
+      orderMoney: '@natural(1000,3000)',
+      ctype: '@natural(1,2)',
+      content: '@cword(10,20)',
+      orderDate: '@datetime',
+    });
+  }
+  return result;
 })();
 
 const deptList = (() => {
-    const result: any[] = [];
-    for (let index = 0; index < 3; index++) {
-        result.push({
-            id: `${index}`,
-            deptName: ['华东分部', '华南分部', '西北分部'][index],
-            orderNo: index + 1,
+  const result: any[] = [];
+  for (let index = 0; index < 3; index++) {
+    result.push({
+      id: `${index}`,
+      deptName: ['华东分部', '华南分部', '西北分部'][index],
+      orderNo: index + 1,
+      createTime: '@datetime',
+      remark: '@cword(10,20)',
+      'status|1': ['0', '0', '1'],
+      children: (() => {
+        const children: any[] = [];
+        for (let j = 0; j < 4; j++) {
+          children.push({
+            id: `${index}-${j}`,
+            deptName: ['研发部', '市场部', '商务部', '财务部'][j],
+            orderNo: j + 1,
             createTime: '@datetime',
             remark: '@cword(10,20)',
-            'status|1': ['0', '0', '1'],
-            children: (() => {
-                const children: any[] = [];
-                for (let j = 0; j < 4; j++) {
-                    children.push({
-                        id: `${index}-${j}`,
-                        deptName: ['研发部', '市场部', '商务部', '财务部'][j],
-                        orderNo: j + 1,
-                        createTime: '@datetime',
-                        remark: '@cword(10,20)',
-                        'status|1': ['0', '1'],
-                        parentDept: `${index}`,
-                        children: undefined,
-                    });
-                }
-                return children;
-            })(),
-        });
-    }
-    return result;
+            'status|1': ['0', '1'],
+            parentDept: `${index}`,
+            children: undefined,
+          });
+        }
+        return children;
+      })(),
+    });
+  }
+  return result;
 })();
 
 const menuList = (() => {
-    const result: any[] = [];
-    for (let index = 0; index < 3; index++) {
-        result.push({
-            id: `${index}`,
-            icon: ['ion:layers-outline', 'ion:git-compare-outline', 'ion:tv-outline'][index],
-            component: 'LAYOUT',
-            type: '0',
-            menuName: ['Dashboard', '权限管理', '功能'][index],
-            permission: '',
-            orderNo: index + 1,
+  const result: any[] = [];
+  for (let index = 0; index < 3; index++) {
+    result.push({
+      id: `${index}`,
+      icon: ['ion:layers-outline', 'ion:git-compare-outline', 'ion:tv-outline'][index],
+      component: 'LAYOUT',
+      type: '0',
+      menuName: ['Dashboard', '权限管理', '功能'][index],
+      permission: '',
+      orderNo: index + 1,
+      createTime: '@datetime',
+      'status|1': ['0', '0', '1'],
+      children: (() => {
+        const children: any[] = [];
+        for (let j = 0; j < 4; j++) {
+          children.push({
+            id: `${index}-${j}`,
+            type: '1',
+            menuName: ['菜单1', '菜单2', '菜单3', '菜单4'][j],
+            icon: 'ion:document',
+            permission: ['menu1:view', 'menu2:add', 'menu3:update', 'menu4:del'][index],
+            component: ['/dashboard/welcome/index', '/dashboard/Analysis/index', '/dashboard/workbench/index', '/dashboard/test/index'][j],
+            orderNo: j + 1,
             createTime: '@datetime',
-            'status|1': ['0', '0', '1'],
+            'status|1': ['0', '1'],
+            parentMenu: `${index}`,
             children: (() => {
-                const children: any[] = [];
-                for (let j = 0; j < 4; j++) {
-                    children.push({
-                        id: `${index}-${j}`,
-                        type: '1',
-                        menuName: ['菜单1', '菜单2', '菜单3', '菜单4'][j],
-                        icon: 'ion:document',
-                        permission: ['menu1:view', 'menu2:add', 'menu3:update', 'menu4:del'][index],
-                        component: [
-                            '/dashboard/welcome/index',
-                            '/dashboard/Analysis/index',
-                            '/dashboard/workbench/index',
-                            '/dashboard/test/index',
-                        ][j],
-                        orderNo: j + 1,
-                        createTime: '@datetime',
-                        'status|1': ['0', '1'],
-                        parentMenu: `${index}`,
-                        children: (() => {
-                            const children: any[] = [];
-                            for (let k = 0; k < 4; k++) {
-                                children.push({
-                                    id: `${index}-${j}-${k}`,
-                                    type: '2',
-                                    menuName: '按钮' + (j + 1) + '-' + (k + 1),
-                                    icon: '',
-                                    permission:
-                                        ['menu1:view', 'menu2:add', 'menu3:update', 'menu4:del'][index] +
-                                        ':btn' +
-                                        (k + 1),
-                                    component: [
-                                        '/dashboard/welcome/index',
-                                        '/dashboard/Analysis/index',
-                                        '/dashboard/workbench/index',
-                                        '/dashboard/test/index',
-                                    ][j],
-                                    orderNo: j + 1,
-                                    createTime: '@datetime',
-                                    'status|1': ['0', '1'],
-                                    parentMenu: `${index}-${j}`,
-                                    children: undefined,
-                                });
-                            }
-                            return children;
-                        })(),
-                    });
-                }
-                return children;
+              const children: any[] = [];
+              for (let k = 0; k < 4; k++) {
+                children.push({
+                  id: `${index}-${j}-${k}`,
+                  type: '2',
+                  menuName: '按钮' + (j + 1) + '-' + (k + 1),
+                  icon: '',
+                  permission: ['menu1:view', 'menu2:add', 'menu3:update', 'menu4:del'][index] + ':btn' + (k + 1),
+                  component: ['/dashboard/welcome/index', '/dashboard/Analysis/index', '/dashboard/workbench/index', '/dashboard/test/index'][j],
+                  orderNo: j + 1,
+                  createTime: '@datetime',
+                  'status|1': ['0', '1'],
+                  parentMenu: `${index}-${j}`,
+                  children: undefined,
+                });
+              }
+              return children;
             })(),
-        });
-    }
-    return result;
+          });
+        }
+        return children;
+      })(),
+    });
+  }
+  return result;
 })();
 
 export default [
diff --git a/mock/sys/menu.ts b/mock/sys/menu.ts
index 73bda64..45d292b 100644
--- a/mock/sys/menu.ts
+++ b/mock/sys/menu.ts
@@ -1,4 +1,4 @@
-import { resultSuccess, resultError, getRequestToken, requestParams,baseUrl} from '../_util';
+import { resultSuccess, resultError, getRequestToken, requestParams, baseUrl } from '../_util';
 import { MockMethod } from 'vite-plugin-mock';
 import { createFakeUserList } from './user';
 
diff --git a/mock/sys/user.ts b/mock/sys/user.ts
index 34175e7..bcbe02b 100644
--- a/mock/sys/user.ts
+++ b/mock/sys/user.ts
@@ -51,9 +51,7 @@ export default [
     method: 'post',
     response: ({ body }) => {
       const { username, password } = body;
-      const checkUser = createFakeUserList().find(
-        (item) => item.username === username && password === item.password
-      );
+      const checkUser = createFakeUserList().find((item) => item.username === username && password === item.password);
       if (!checkUser) {
         return resultError('Incorrect account or password！');
       }
diff --git a/package.json b/package.json
index 972745a..3495ec6 100644
--- a/package.json
+++ b/package.json
@@ -291,7 +291,6 @@
         "vue-print-nb-jeecg/src/printarea",
         "vue-router",
         "vue-types",
-        "vuedraggable",
         "vxe-table",
         "vxe-table-plugin-antd",
         "xe-utils",
diff --git a/src/api/common/api.ts b/src/api/common/api.ts
index d3e5625..5dfebb1 100644
--- a/src/api/common/api.ts
+++ b/src/api/common/api.ts
@@ -18,7 +18,7 @@ enum Api {
 /**
  * 上传父路径
  */
-export const uploadUrl=`${baseUploadUrl}/sys/common/upload`;
+export const uploadUrl = `${baseUploadUrl}/sys/common/upload`;
 
 /**
  * 职务列表
@@ -47,52 +47,51 @@ export const getRoleList = (params) => {
 /**
  * 异步获取部门树列表
  */
-export const queryDepartTreeSync = (params?) =>{
+export const queryDepartTreeSync = (params?) => {
   return defHttp.get({ url: Api.queryDepartTreeSync, params });
-}
+};
 /**
  * 获取部门树列表
  */
-export const queryTreeList = (params?) =>{
+export const queryTreeList = (params?) => {
   return defHttp.get({ url: Api.queryTreeList, params });
-}
+};
 
 /**
  * 分类字典树控件 加载节点
  */
-export const loadTreeData = (params?) =>{
+export const loadTreeData = (params?) => {
   return defHttp.get({ url: Api.loadTreeData, params });
-}
-
+};
 
 /**
  * 根据字典code加载字典text
  */
-export const loadDictItem = (params?) =>{
+export const loadDictItem = (params?) => {
   return defHttp.get({ url: Api.loadDictItem, params });
-}
+};
 
 /**
  * 根据字典code加载字典text
  */
-export const getDictItems = (dictCode) =>{
-  return defHttp.get({ url: Api.getDictItems+dictCode},{joinTime:false});
-}
+export const getDictItems = (dictCode) => {
+  return defHttp.get({ url: Api.getDictItems + dictCode }, { joinTime: false });
+};
 /**
  * 部门用户modal选择列表加载list
  */
-export const getTableList = (params)=>{
-    return defHttp.get({url:Api.getTableList,params})
-}
+export const getTableList = (params) => {
+  return defHttp.get({ url: Api.getTableList, params });
+};
 /**
  * 加载全部分类字典数据
  */
-export const loadCategoryData = (params)=>{
-    return defHttp.get({url:Api.getCategoryData,params})
-}
+export const loadCategoryData = (params) => {
+  return defHttp.get({ url: Api.getCategoryData, params });
+};
 /**
  * 文件上传
  */
-export const uploadFile = (params,success)=>{
-    return defHttp.uploadFile({url:uploadUrl}, params,{success})
-}
+export const uploadFile = (params, success) => {
+  return defHttp.uploadFile({ url: uploadUrl }, params, { success });
+};
diff --git a/src/api/demo/select.ts b/src/api/demo/select.ts
index 9769f58..9fb5cae 100644
--- a/src/api/demo/select.ts
+++ b/src/api/demo/select.ts
@@ -7,5 +7,4 @@ enum Api {
 /**
  * @description: Get sample options value
  */
-export const optionsListApi = (params?: selectParams) =>
-  defHttp.get<DemoOptionsItem[]>({ url: Api.OPTIONS_LIST, params });
+export const optionsListApi = (params?: selectParams) => defHttp.get<DemoOptionsItem[]>({ url: Api.OPTIONS_LIST, params });
diff --git a/src/api/demo/system.ts b/src/api/demo/system.ts
index d1c5910..01c1fd5 100644
--- a/src/api/demo/system.ts
+++ b/src/api/demo/system.ts
@@ -1,54 +1,45 @@
 import {
-    AccountParams,
-    DeptListItem,
-    MenuParams,
-    RoleParams,
-    TestPageParams,
-    RolePageParams,
-    MenuListGetResultModel,
-    DeptListGetResultModel,
-    AccountListGetResultModel,
-    RolePageListGetResultModel,
-    RoleListGetResultModel,
-    TestListGetResultModel
+  AccountParams,
+  DeptListItem,
+  MenuParams,
+  RoleParams,
+  TestPageParams,
+  RolePageParams,
+  MenuListGetResultModel,
+  DeptListGetResultModel,
+  AccountListGetResultModel,
+  RolePageListGetResultModel,
+  RoleListGetResultModel,
+  TestListGetResultModel,
 } from './model/systemModel';
-import {defHttp} from '/@/utils/http/axios';
+import { defHttp } from '/@/utils/http/axios';
 
 enum Api {
-    AccountList = '/mock/system/getAccountList',
-    IsAccountExist = '/mock/system/accountExist',
-    DeptList = '/mock/system/getDeptList',
-    setRoleStatus = '/mock/system/setRoleStatus',
-    MenuList = '/mock/system/getMenuList',
-    RolePageList = '/mock/system/getRoleListByPage',
-    DemoTableList = '/mock/system/getDemoTableListByPage',
-    TestPageList = '/mock/system/getTestListByPage',
-    GetAllRoleList = '/mock/system/getAllRoleList',
+  AccountList = '/mock/system/getAccountList',
+  IsAccountExist = '/mock/system/accountExist',
+  DeptList = '/mock/system/getDeptList',
+  setRoleStatus = '/mock/system/setRoleStatus',
+  MenuList = '/mock/system/getMenuList',
+  RolePageList = '/mock/system/getRoleListByPage',
+  DemoTableList = '/mock/system/getDemoTableListByPage',
+  TestPageList = '/mock/system/getTestListByPage',
+  GetAllRoleList = '/mock/system/getAllRoleList',
 }
 
-export const getAccountList = (params: AccountParams) =>
-    defHttp.get<AccountListGetResultModel>({url: Api.AccountList, params});
+export const getAccountList = (params: AccountParams) => defHttp.get<AccountListGetResultModel>({ url: Api.AccountList, params });
 
-export const getDeptList = (params?: DeptListItem) =>
-    defHttp.get<DeptListGetResultModel>({url: Api.DeptList, params});
+export const getDeptList = (params?: DeptListItem) => defHttp.get<DeptListGetResultModel>({ url: Api.DeptList, params });
 
-export const getMenuList = (params?: MenuParams) =>
-    defHttp.get<MenuListGetResultModel>({url: Api.MenuList, params});
+export const getMenuList = (params?: MenuParams) => defHttp.get<MenuListGetResultModel>({ url: Api.MenuList, params });
 
-export const getRoleListByPage = (params?: RolePageParams) =>
-    defHttp.get<RolePageListGetResultModel>({url: Api.RolePageList, params});
+export const getRoleListByPage = (params?: RolePageParams) => defHttp.get<RolePageListGetResultModel>({ url: Api.RolePageList, params });
 
-export const getAllRoleList = (params?: RoleParams) =>
-    defHttp.get<RoleListGetResultModel>({url: Api.GetAllRoleList, params});
+export const getAllRoleList = (params?: RoleParams) => defHttp.get<RoleListGetResultModel>({ url: Api.GetAllRoleList, params });
 
-export const setRoleStatus = (id: number, status: string) =>
-    defHttp.post({url: Api.setRoleStatus, params: {id, status}});
+export const setRoleStatus = (id: number, status: string) => defHttp.post({ url: Api.setRoleStatus, params: { id, status } });
 
-export const getTestListByPage = (params?: TestPageParams) =>
-    defHttp.get<TestListGetResultModel>({url: Api.TestPageList, params});
+export const getTestListByPage = (params?: TestPageParams) => defHttp.get<TestListGetResultModel>({ url: Api.TestPageList, params });
 
-export const getDemoTableListByPage = (params) =>
-    defHttp.get({url: Api.DemoTableList, params});
+export const getDemoTableListByPage = (params) => defHttp.get({ url: Api.DemoTableList, params });
 
-export const isAccountExist = (account: string) =>
-    defHttp.post({url: Api.IsAccountExist, params: {account}}, {errorMessageMode: 'none'});
+export const isAccountExist = (account: string) => defHttp.post({ url: Api.IsAccountExist, params: { account } }, { errorMessageMode: 'none' });
diff --git a/src/api/demo/tree.ts b/src/api/demo/tree.ts
index b626945..8fe3acf 100644
--- a/src/api/demo/tree.ts
+++ b/src/api/demo/tree.ts
@@ -7,5 +7,4 @@ enum Api {
 /**
  * @description: Get sample options value
  */
-export const treeOptionsListApi = (params?: Recordable) =>
-  defHttp.get<Recordable[]>({ url: Api.TREE_OPTIONS_LIST, params });
+export const treeOptionsListApi = (params?: Recordable) => defHttp.get<Recordable[]>({ url: Api.TREE_OPTIONS_LIST, params });
diff --git a/src/api/sys/menu.ts b/src/api/sys/menu.ts
index f0787a8..a4a399c 100644
--- a/src/api/sys/menu.ts
+++ b/src/api/sys/menu.ts
@@ -12,12 +12,12 @@ enum Api {
 export const getMenuList = () => {
   return new Promise((resolve) => {
     //为了兼容mock和接口数据
-    defHttp.get<getMenuListResultModel>({ url: Api.GetMenuList }).then(res=>{
-      if(Array.isArray(res)){
-        resolve(res)
-      }else{
-        resolve(res['menu'])
+    defHttp.get<getMenuListResultModel>({ url: Api.GetMenuList }).then((res) => {
+      if (Array.isArray(res)) {
+        resolve(res);
+      } else {
+        resolve(res['menu']);
       }
     });
-  })
+  });
 };
diff --git a/src/api/sys/model/userModel.ts b/src/api/sys/model/userModel.ts
index b387c3b..add553a 100644
--- a/src/api/sys/model/userModel.ts
+++ b/src/api/sys/model/userModel.ts
@@ -52,6 +52,6 @@ export interface GetUserInfoModel {
 export interface GetResultModel {
   code: number;
   message: string;
-  result:object;
+  result: object;
   success: Boolean;
 }
diff --git a/src/api/sys/upload.ts b/src/api/sys/upload.ts
index b09982c..1a83e93 100644
--- a/src/api/sys/upload.ts
+++ b/src/api/sys/upload.ts
@@ -8,10 +8,7 @@ const { uploadUrl = '' } = useGlobSetting();
 /**
  * @description: Upload interface
  */
-export function uploadApi(
-  params: UploadFileParams,
-  onUploadProgress: (progressEvent: ProgressEvent) => void
-) {
+export function uploadApi(params: UploadFileParams, onUploadProgress: (progressEvent: ProgressEvent) => void) {
   return defHttp.uploadFile<UploadApiResult>(
     {
       url: uploadUrl,
@@ -23,15 +20,13 @@ export function uploadApi(
 /**
  * @description: Upload interface
  */
-export function uploadImg(
-  params: UploadFileParams,
-  onUploadProgress: (progressEvent: ProgressEvent) => void
-) {
+export function uploadImg(params: UploadFileParams, onUploadProgress: (progressEvent: ProgressEvent) => void) {
   return defHttp.uploadFile<UploadApiResult>(
     {
       url: `${uploadUrl}/sys/common/upload`,
       onUploadProgress,
     },
-    params, {isReturnResponse:true}
+    params,
+    { isReturnResponse: true }
   );
 }
diff --git a/src/api/sys/user.ts b/src/api/sys/user.ts
index 2e0e5e3..a152f8d 100644
--- a/src/api/sys/user.ts
+++ b/src/api/sys/user.ts
@@ -2,16 +2,15 @@ import { defHttp } from '/@/utils/http/axios';
 import { LoginParams, LoginResultModel, GetUserInfoModel } from './model/userModel';
 
 import { ErrorMessageMode } from '/#/axios';
-import {useMessage} from "/@/hooks/web/useMessage";
-import {useUserStoreWithOut} from "/@/store/modules/user";
-import {setAuthCache} from "/@/utils/auth";
-import {TOKEN_KEY} from "/@/enums/cacheEnum";
-import {router} from "/@/router";
-import {PageEnum} from "/@/enums/pageEnum";
+import { useMessage } from '/@/hooks/web/useMessage';
+import { useUserStoreWithOut } from '/@/store/modules/user';
+import { setAuthCache } from '/@/utils/auth';
+import { TOKEN_KEY } from '/@/enums/cacheEnum';
+import { router } from '/@/router';
+import { PageEnum } from '/@/enums/pageEnum';
 
 const { createErrorModal } = useMessage();
 enum Api {
-
   Login = '/sys/login',
   phoneLogin = '/sys/phoneLogin',
   Logout = '/sys/logout',
@@ -23,7 +22,7 @@ enum Api {
   GetPermCode = '/sys/permission/getPermCode',
   //新加的获取图形验证码的接口
   getInputCode = '/sys/randomImage',
- //获取短信验证码的接口
+  //获取短信验证码的接口
   getCaptcha = '/sys/sms',
   //注册接口
   registerApi = '/sys/user/register',
@@ -78,17 +77,17 @@ export function phoneLoginApi(params: LoginParams, mode: ErrorMessageMode = 'mod
 /**
  * @description: getUserInfo
  */
-export  function getUserInfo() {
-  return  defHttp.get<GetUserInfoModel>({ url: Api.GetUserInfo }, { errorMessageMode: 'none' }).catch((e)=>{
-      // update-begin--author:zyf---date:20220425---for:【VUEN-76】捕获接口超时异常,跳转到登录界面
-      if (e && e.message.includes('timeout')) {
-          //接口不通时跳转到登录界面
-          const userStore = useUserStoreWithOut();
-          userStore.setToken('');
-          setAuthCache(TOKEN_KEY, null);
-          router.push(PageEnum.BASE_LOGIN);
-      }
-      // update-end--author:zyf---date:20220425---for:【VUEN-76】捕获接口超时异常,跳转到登录界面
+export function getUserInfo() {
+  return defHttp.get<GetUserInfoModel>({ url: Api.GetUserInfo }, { errorMessageMode: 'none' }).catch((e) => {
+    // update-begin--author:zyf---date:20220425---for:【VUEN-76】捕获接口超时异常,跳转到登录界面
+    if (e && e.message.includes('timeout')) {
+      //接口不通时跳转到登录界面
+      const userStore = useUserStoreWithOut();
+      userStore.setToken('');
+      setAuthCache(TOKEN_KEY, null);
+      router.push(PageEnum.BASE_LOGIN);
+    }
+    // update-end--author:zyf---date:20220425---for:【VUEN-76】捕获接口超时异常,跳转到登录界面
   });
 }
 
@@ -101,7 +100,7 @@ export function doLogout() {
 }
 
 export function getCodeInfo(currdatetime) {
-  let url = Api.getInputCode+`/${currdatetime}`
+  let url = Api.getInputCode + `/${currdatetime}`;
   return defHttp.get({ url: url });
 }
 /**
@@ -109,78 +108,75 @@ export function getCodeInfo(currdatetime) {
  */
 export function getCaptcha(params) {
   return new Promise((resolve, reject) => {
-    defHttp.post({url:Api.getCaptcha,params},{isTransformResponse: false}).then(res=>{
-      console.log(res)
-      if(res.success){
-        resolve(true)
-      }else{
-        createErrorModal({ title: '错误提示', content: res.message||'未知问题' });
-        reject()
+    defHttp.post({ url: Api.getCaptcha, params }, { isTransformResponse: false }).then((res) => {
+      console.log(res);
+      if (res.success) {
+        resolve(true);
+      } else {
+        createErrorModal({ title: '错误提示', content: res.message || '未知问题' });
+        reject();
       }
     });
-  })
+  });
 }
 
 /**
  * @description: 注册接口
  */
 export function register(params) {
-  return defHttp.post({url: Api.registerApi,params},{isReturnNativeResponse: true})
+  return defHttp.post({ url: Api.registerApi, params }, { isReturnNativeResponse: true });
 }
 
 /**
  *校验用户是否存在
  * @param params
  */
-export const checkOnlyUser = (params) =>
-  defHttp.get({url: Api.checkOnlyUser, params},{isTransformResponse:false});
+export const checkOnlyUser = (params) => defHttp.get({ url: Api.checkOnlyUser, params }, { isTransformResponse: false });
 /**
  *校验手机号码
  * @param params
  */
-export const phoneVerify = (params) =>
-  defHttp.post({url: Api.phoneVerify, params},{isTransformResponse:false});
+export const phoneVerify = (params) => defHttp.post({ url: Api.phoneVerify, params }, { isTransformResponse: false });
 /**
  *密码修改
  * @param params
  */
-export const passwordChange = (params) =>
-  defHttp.get({url: Api.passwordChange, params},{isTransformResponse:false});
+export const passwordChange = (params) => defHttp.get({ url: Api.passwordChange, params }, { isTransformResponse: false });
 /**
  * @description: 第三方登录
  */
 export function thirdLogin(params, mode: ErrorMessageMode = 'modal') {
-    return defHttp.get<LoginResultModel>(
-        {
-            url: `${Api.thirdLogin}/${params.token}/${params.thirdType}`,
-        },
-        {
-            errorMessageMode: mode,
-        }
-    );
+  return defHttp.get<LoginResultModel>(
+    {
+      url: `${Api.thirdLogin}/${params.token}/${params.thirdType}`,
+    },
+    {
+      errorMessageMode: mode,
+    }
+  );
 }
 /**
  * @description: 获取第三方短信验证码
  */
 export function setThirdCaptcha(params) {
-    return new Promise((resolve, reject) => {
-        defHttp.post({url:Api.getThirdCaptcha,params},{isTransformResponse: false}).then(res=>{
-            console.log(res)
-            if(res.success){
-                resolve(true)
-            }else{
-                createErrorModal({ title: '错误提示', content: res.message||'未知问题' });
-                reject()
-            }
-        });
-    })
+  return new Promise((resolve, reject) => {
+    defHttp.post({ url: Api.getThirdCaptcha, params }, { isTransformResponse: false }).then((res) => {
+      console.log(res);
+      if (res.success) {
+        resolve(true);
+      } else {
+        createErrorModal({ title: '错误提示', content: res.message || '未知问题' });
+        reject();
+      }
+    });
+  });
 }
 
 /**
  * 获取登录二维码信息
  */
 export function getLoginQrcode() {
-  let url = Api.getLoginQrcode
+  let url = Api.getLoginQrcode;
   return defHttp.get({ url: url });
 }
 
@@ -188,14 +184,14 @@ export function getLoginQrcode() {
  * 监控扫码状态
  */
 export function getQrcodeToken(params) {
-  let url = Api.getQrcodeToken
-  return defHttp.get({ url: url,params});
+  let url = Api.getQrcodeToken;
+  return defHttp.get({ url: url, params });
 }
 
 /**
  * SSO登录校验
  */
 export async function validateCasLogin(params) {
-  let url = Api.validateCasLogin
-  return defHttp.get({ url: url,params});
+  let url = Api.validateCasLogin;
+  return defHttp.get({ url: url, params });
 }
diff --git a/src/assets/less/JAreaLinkage.less b/src/assets/less/JAreaLinkage.less
index d367073..4fea722 100644
--- a/src/assets/less/JAreaLinkage.less
+++ b/src/assets/less/JAreaLinkage.less
@@ -48,7 +48,6 @@
   outline: 0;
 }
 
-
 .area-select:active {
   box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
 }
@@ -96,12 +95,12 @@
   top: 50%;
   margin-top: -2px;
   right: 6px;
-  content: "";
+  content: '';
   width: 0;
   height: 0;
   border: 6px solid transparent;
   border-top-color: rgba(0, 0, 0, 0.25);
-  transition: all .3s linear;
+  transition: all 0.3s linear;
   transform-origin: center;
 }
 
@@ -223,7 +222,7 @@
   top: 50%;
   margin-top: -4px;
   right: 5px;
-  content: "";
+  content: '';
   width: 0;
   height: 0;
   border: 4px solid transparent;
@@ -256,4 +255,4 @@
 .cascader-menu-list::-webkit-scrollbar-thumb:vertical:hover,
 .area-selectable-list-wrap::-webkit-scrollbar-thumb:vertical:hover {
   background-color: #777;
-}
\ No newline at end of file
+}
diff --git a/src/components/Application/src/AppLocalePicker.vue b/src/components/Application/src/AppLocalePicker.vue
index 0ec7ad9..6fabc66 100644
--- a/src/components/Application/src/AppLocalePicker.vue
+++ b/src/components/Application/src/AppLocalePicker.vue
@@ -3,14 +3,7 @@
  * @Description: Multi-language switching component
 -->
 <template>
-  <Dropdown
-          placement="bottomCenter"
-          :trigger="['click']"
-          :dropMenuList="localeList"
-          :selectedKeys="selectedKeys"
-          @menuEvent="handleMenuEvent"
-          overlayClassName="app-locale-picker-overlay"
-  >
+  <Dropdown placement="bottomCenter" :trigger="['click']" :dropMenuList="localeList" :selectedKeys="selectedKeys" @menuEvent="handleMenuEvent" overlayClassName="app-locale-picker-overlay">
     <span class="cursor-pointer flex items-center">
       <Icon icon="ion:language" />
       <span v-if="showText" class="ml-1">{{ getLocaleText }}</span>
diff --git a/src/components/Application/src/AppLogo.vue b/src/components/Application/src/AppLogo.vue
index 0405e09..f7c1b51 100644
--- a/src/components/Application/src/AppLogo.vue
+++ b/src/components/Application/src/AppLogo.vue
@@ -40,11 +40,7 @@
   const { title } = useGlobSetting();
   const go = useGo();
 
-  const getAppLogoClass = computed(() => [
-    prefixCls,
-    props.theme,
-    { 'collapsed-show-title': unref(getCollapsedShowTitle) },
-  ]);
+  const getAppLogoClass = computed(() => [prefixCls, props.theme, { 'collapsed-show-title': unref(getCollapsedShowTitle) }]);
 
   const getTitleClass = computed(() => [
     `${prefixCls}__title`,
diff --git a/src/components/Application/src/AppProvider.vue b/src/components/Application/src/AppProvider.vue
index fe19a80..4c277bd 100644
--- a/src/components/Application/src/AppProvider.vue
+++ b/src/components/Application/src/AppProvider.vue
@@ -45,12 +45,7 @@
           if (!unref(isSetState)) {
             isSetState.value = true;
             const {
-              menuSetting: {
-                type: menuType,
-                mode: menuMode,
-                collapsed: menuCollapsed,
-                split: menuSplit,
-              },
+              menuSetting: { type: menuType, mode: menuMode, collapsed: menuCollapsed, split: menuSplit },
             } = appStore.getProjectConfig;
             appStore.setProjectConfig({
               menuSetting: {
diff --git a/src/components/Application/src/search/AppSearchFooter.vue b/src/components/Application/src/search/AppSearchFooter.vue
index a83aaf6..06e1372 100644
--- a/src/components/Application/src/search/AppSearchFooter.vue
+++ b/src/components/Application/src/search/AppSearchFooter.vue
@@ -41,8 +41,7 @@
       margin-right: 0.4em;
       background-color: linear-gradient(-225deg, #d5dbe4, #f8f8f8);
       border-radius: 2px;
-      box-shadow: inset 0 -2px 0 0 #cdcde6, inset 0 0 1px 1px #fff,
-      0 1px 2px 1px rgba(30, 35, 90, 0.4);
+      box-shadow: inset 0 -2px 0 0 #cdcde6, inset 0 0 1px 1px #fff, 0 1px 2px 1px rgba(30, 35, 90, 0.4);
       align-items: center;
       justify-content: center;
 
diff --git a/src/components/Application/src/search/AppSearchModal.vue b/src/components/Application/src/search/AppSearchModal.vue
index 4101b55..b1e7a63 100644
--- a/src/components/Application/src/search/AppSearchModal.vue
+++ b/src/components/Application/src/search/AppSearchModal.vue
@@ -4,13 +4,7 @@
       <div :class="getClass" @click.stop v-if="visible">
         <div :class="`${prefixCls}-content`" v-click-outside="handleClose">
           <div :class="`${prefixCls}-input__wrapper`">
-            <a-input
-                    :class="`${prefixCls}-input`"
-                    :placeholder="t('common.searchText')"
-                    ref="inputRef"
-                    allow-clear
-                    @change="handleSearch"
-            >
+            <a-input :class="`${prefixCls}-input`" :placeholder="t('common.searchText')" ref="inputRef" allow-clear @change="handleSearch">
               <template #prefix>
                 <SearchOutlined />
               </template>
@@ -26,13 +20,13 @@
 
           <ul :class="`${prefixCls}-list`" v-show="!getIsNotData" ref="scrollWrap">
             <li
-                    :ref="setRefs(index)"
-                    v-for="(item, index) in searchResult"
-                    :key="item.path"
-                    :data-index="index"
-                    @mouseenter="handleMouseenter"
-                    @click="handleEnter"
-                    :class="[
+              :ref="setRefs(index)"
+              v-for="(item, index) in searchResult"
+              :key="item.path"
+              :data-index="index"
+              @mouseenter="handleMouseenter"
+              @click="handleEnter"
+              :class="[
                 `${prefixCls}-list__item`,
                 {
                   [`${prefixCls}-list__item--active`]: activeIndex === index,
@@ -84,8 +78,7 @@
   const [refs, setRefs] = useRefs();
   const { getIsMobile } = useAppInject();
 
-  const { handleSearch, searchResult, keyword, activeIndex, handleEnter, handleMouseenter } =
-          useMenuSearch(refs, scrollWrap, emit);
+  const { handleSearch, searchResult, keyword, activeIndex, handleEnter, handleMouseenter } = useMenuSearch(refs, scrollWrap, emit);
 
   const getIsNotData = computed(() => !keyword || unref(searchResult).length === 0);
 
@@ -99,13 +92,13 @@
   });
 
   watch(
-          () => props.visible,
-          (visible: boolean) => {
-            visible &&
-            nextTick(() => {
-              unref(inputRef)?.focus();
-            });
-          }
+    () => props.visible,
+    (visible: boolean) => {
+      visible &&
+        nextTick(() => {
+          unref(inputRef)?.focus();
+        });
+    }
   );
 
   function handleClose() {
diff --git a/src/components/Application/src/search/useMenuSearch.ts b/src/components/Application/src/search/useMenuSearch.ts
index d26a2ae..d5c5282 100644
--- a/src/components/Application/src/search/useMenuSearch.ts
+++ b/src/components/Application/src/search/useMenuSearch.ts
@@ -57,7 +57,7 @@ export function useMenuSearch(refs: Ref<HTMLElement[]>, scrollWrap: Ref<ElRef>,
     const filterMenu = filter(menuList, (item) => {
       // 【issues/33】包含子菜单时，不添加到搜索队列
       if (Array.isArray(item.children)) {
-        return false
+        return false;
       }
       return reg.test(item.name) && !item.hideMenu;
     });
diff --git a/src/components/Basic/src/BasicHelp.vue b/src/components/Basic/src/BasicHelp.vue
index 0a3cc16..396bd75 100644
--- a/src/components/Basic/src/BasicHelp.vue
+++ b/src/components/Basic/src/BasicHelp.vue
@@ -46,9 +46,7 @@
     setup(props, { slots }) {
       const { prefixCls } = useDesign('basic-help');
 
-      const getTooltipStyle = computed(
-        (): CSSProperties => ({ color: props.color, fontSize: props.fontSize })
-      );
+      const getTooltipStyle = computed((): CSSProperties => ({ color: props.color, fontSize: props.fontSize }));
 
       const getOverlayStyle = computed((): CSSProperties => ({ maxWidth: props.maxWidth }));
 
diff --git a/src/components/Basic/src/BasicTitle.vue b/src/components/Basic/src/BasicTitle.vue
index 3b96328..adc77b7 100644
--- a/src/components/Basic/src/BasicTitle.vue
+++ b/src/components/Basic/src/BasicTitle.vue
@@ -33,11 +33,7 @@
 
   const { prefixCls } = useDesign('basic-title');
   const slots = useSlots();
-  const getClass = computed(() => [
-    prefixCls,
-    { [`${prefixCls}-show-span`]: props.span && slots.default },
-    { [`${prefixCls}-normal`]: props.normal },
-  ]);
+  const getClass = computed(() => [prefixCls, { [`${prefixCls}-show-span`]: props.span && slots.default }, { [`${prefixCls}-normal`]: props.normal }]);
 </script>
 <style lang="less" scoped>
   @prefix-cls: ~'@{namespace}-basic-title';
diff --git a/src/components/Button/src/BasicButton.vue b/src/components/Button/src/BasicButton.vue
index 7ac130e..3b54d33 100644
--- a/src/components/Button/src/BasicButton.vue
+++ b/src/components/Button/src/BasicButton.vue
@@ -1,39 +1,39 @@
 <template>
-    <Button v-bind="getBindValue" :class="getButtonClass" @click="onClick">
-        <template #default="data">
-            <Icon :icon="preIcon" v-if="preIcon" :size="iconSize" />
-            <slot v-bind="data || {}"></slot>
-            <Icon :icon="postIcon" v-if="postIcon" :size="iconSize" />
-        </template>
-    </Button>
+  <Button v-bind="getBindValue" :class="getButtonClass" @click="onClick">
+    <template #default="data">
+      <Icon :icon="preIcon" v-if="preIcon" :size="iconSize" />
+      <slot v-bind="data || {}"></slot>
+      <Icon :icon="postIcon" v-if="postIcon" :size="iconSize" />
+    </template>
+  </Button>
 </template>
 
 <script lang="ts">
-    import { defineComponent } from 'vue';
-    export default defineComponent({
-        name: 'AButton',
-        inheritAttrs: false,
-    });
+  import { defineComponent } from 'vue';
+  export default defineComponent({
+    name: 'AButton',
+    inheritAttrs: false,
+  });
 </script>
 <script lang="ts" setup>
-    import { computed, unref } from 'vue';
-    import { Button } from 'ant-design-vue';
-    import Icon from '/@/components/Icon/src/Icon.vue';
-    import { buttonProps } from './props';
-    import { useAttrs } from '/@/hooks/core/useAttrs';
-    const props = defineProps(buttonProps);
-    // get component class
-    const attrs = useAttrs({ excludeDefaultKeys: false });
-    const getButtonClass = computed(() => {
-        const { color, disabled } = props;
-        return [
-            {
-                [`ant-btn-${color}`]: !!color,
-                [`is-disabled`]: disabled,
-            },
-        ];
-    });
+  import { computed, unref } from 'vue';
+  import { Button } from 'ant-design-vue';
+  import Icon from '/@/components/Icon/src/Icon.vue';
+  import { buttonProps } from './props';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  const props = defineProps(buttonProps);
+  // get component class
+  const attrs = useAttrs({ excludeDefaultKeys: false });
+  const getButtonClass = computed(() => {
+    const { color, disabled } = props;
+    return [
+      {
+        [`ant-btn-${color}`]: !!color,
+        [`is-disabled`]: disabled,
+      },
+    ];
+  });
 
-    // get inherit binding value
-    const getBindValue = computed(() => ({ ...unref(attrs), ...props }));
+  // get inherit binding value
+  const getBindValue = computed(() => ({ ...unref(attrs), ...props }));
 </script>
diff --git a/src/components/Button/src/PopConfirmButton.vue b/src/components/Button/src/PopConfirmButton.vue
index 53d88c2..903d481 100644
--- a/src/components/Button/src/PopConfirmButton.vue
+++ b/src/components/Button/src/PopConfirmButton.vue
@@ -1,54 +1,54 @@
 <script lang="ts">
-    import { computed, defineComponent, h, unref } from 'vue';
-    import BasicButton from './BasicButton.vue';
-    import { Popconfirm } from 'ant-design-vue';
-    import { extendSlots } from '/@/utils/helper/tsxHelper';
-    import { omit } from 'lodash-es';
-    import { useAttrs } from '/@/hooks/core/useAttrs';
-    import { useI18n } from '/@/hooks/web/useI18n';
+  import { computed, defineComponent, h, unref } from 'vue';
+  import BasicButton from './BasicButton.vue';
+  import { Popconfirm } from 'ant-design-vue';
+  import { extendSlots } from '/@/utils/helper/tsxHelper';
+  import { omit } from 'lodash-es';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { useI18n } from '/@/hooks/web/useI18n';
 
-    const props = {
-        /**
-         * Whether to enable the drop-down menu
-         * @default: true
-         */
-        enable: {
-            type: Boolean,
-            default: true,
-        },
-    };
+  const props = {
+    /**
+     * Whether to enable the drop-down menu
+     * @default: true
+     */
+    enable: {
+      type: Boolean,
+      default: true,
+    },
+  };
 
-    export default defineComponent({
-        name: 'PopButton',
-        inheritAttrs: false,
-        props,
-        setup(props, { slots }) {
-            const { t } = useI18n();
-            const attrs = useAttrs();
+  export default defineComponent({
+    name: 'PopButton',
+    inheritAttrs: false,
+    props,
+    setup(props, { slots }) {
+      const { t } = useI18n();
+      const attrs = useAttrs();
 
-            // get inherit binding value
-            const getBindValues = computed(() => {
-                return Object.assign(
-                    {
-                        okText: t('common.okText'),
-                        cancelText: t('common.cancelText'),
-                    },
-                    { ...props, ...unref(attrs) }
-                );
-            });
+      // get inherit binding value
+      const getBindValues = computed(() => {
+        return Object.assign(
+          {
+            okText: t('common.okText'),
+            cancelText: t('common.cancelText'),
+          },
+          { ...props, ...unref(attrs) }
+        );
+      });
 
-            return () => {
-                const bindValues = omit(unref(getBindValues), 'icon');
-                const btnBind = omit(bindValues, 'title') as Recordable;
-                if (btnBind.disabled) btnBind.color = '';
-                const Button = h(BasicButton, btnBind, extendSlots(slots));
+      return () => {
+        const bindValues = omit(unref(getBindValues), 'icon');
+        const btnBind = omit(bindValues, 'title') as Recordable;
+        if (btnBind.disabled) btnBind.color = '';
+        const Button = h(BasicButton, btnBind, extendSlots(slots));
 
-                // If it is not enabled, it is a normal button
-                if (!props.enable) {
-                    return Button;
-                }
-                return h(Popconfirm, bindValues, { default: () => Button });
-            };
-        },
-    });
+        // If it is not enabled, it is a normal button
+        if (!props.enable) {
+          return Button;
+        }
+        return h(Popconfirm, bindValues, { default: () => Button });
+      };
+    },
+  });
 </script>
diff --git a/src/components/Button/src/UploadButton.vue b/src/components/Button/src/UploadButton.vue
index 19d337f..ec0df2c 100644
--- a/src/components/Button/src/UploadButton.vue
+++ b/src/components/Button/src/UploadButton.vue
@@ -1,41 +1,41 @@
 <template>
-    <a-upload name="file" :showUploadList="false"  :customRequest="(file)=>onClick(file)">
-      <Button :type="type" :class="getButtonClass" >
-        <template #default="data">
-          <Icon :icon="preIcon" v-if="preIcon" :size="iconSize" />
-          <slot v-bind="data || {}"></slot>
-          <Icon :icon="postIcon" v-if="postIcon" :size="iconSize" />
-        </template>
-      </Button>
-    </a-upload>
+  <a-upload name="file" :showUploadList="false" :customRequest="(file) => onClick(file)">
+    <Button :type="type" :class="getButtonClass">
+      <template #default="data">
+        <Icon :icon="preIcon" v-if="preIcon" :size="iconSize" />
+        <slot v-bind="data || {}"></slot>
+        <Icon :icon="postIcon" v-if="postIcon" :size="iconSize" />
+      </template>
+    </Button>
+  </a-upload>
 </template>
 
 <script lang="ts">
-    import { defineComponent } from 'vue';
-    export default defineComponent({
-        name: 'JUploadButton',
-        inheritAttrs: false,
-    });
+  import { defineComponent } from 'vue';
+  export default defineComponent({
+    name: 'JUploadButton',
+    inheritAttrs: false,
+  });
 </script>
 <script lang="ts" setup>
-    import { computed, unref } from 'vue';
-    import { Button } from 'ant-design-vue';
-    import Icon from '/@/components/Icon/src/Icon.vue';
-    import { buttonProps } from './props';
-    import { useAttrs } from '/@/hooks/core/useAttrs';
-    const props = defineProps(buttonProps);
-    // get component class
-    const attrs = useAttrs({ excludeDefaultKeys: false });
-    const getButtonClass = computed(() => {
-        const { color, disabled } = props;
-        return [
-            {
-                [`ant-btn-${color}`]: !!color,
-                [`is-disabled`]: disabled,
-            },
-        ];
-    });
+  import { computed, unref } from 'vue';
+  import { Button } from 'ant-design-vue';
+  import Icon from '/@/components/Icon/src/Icon.vue';
+  import { buttonProps } from './props';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  const props = defineProps(buttonProps);
+  // get component class
+  const attrs = useAttrs({ excludeDefaultKeys: false });
+  const getButtonClass = computed(() => {
+    const { color, disabled } = props;
+    return [
+      {
+        [`ant-btn-${color}`]: !!color,
+        [`is-disabled`]: disabled,
+      },
+    ];
+  });
 
-    // get inherit binding value
-    const getBindValue = computed(() => ({ ...unref(attrs), ...props }));
+  // get inherit binding value
+  const getBindValue = computed(() => ({ ...unref(attrs), ...props }));
 </script>
diff --git a/src/components/Button/src/props.ts b/src/components/Button/src/props.ts
index ef68cbb..8e1b254 100644
--- a/src/components/Button/src/props.ts
+++ b/src/components/Button/src/props.ts
@@ -16,6 +16,6 @@ export const buttonProps = {
    * @default: 14
    */
   iconSize: { type: Number, default: 14 },
-  isUpload:{type:Boolean,default:false},
+  isUpload: { type: Boolean, default: false },
   onClick: { type: Function as PropType<(...args) => any>, default: null },
 };
diff --git a/src/components/CardList/src/CardList.vue b/src/components/CardList/src/CardList.vue
index 5ca2e01..2ebf837 100644
--- a/src/components/CardList/src/CardList.vue
+++ b/src/components/CardList/src/CardList.vue
@@ -1,50 +1,39 @@
 <template>
-    <div class="p-2">
-        <div class="bg-white mb-2 p-4">
-            <BasicForm @register="registerForm" />
-        </div>
-        {{ sliderProp.width }}
-        <div class="bg-white p-2">
-            <List
-                    :grid="{ gutter: 5, xs: 1, sm: 2, md: 4, lg: 4, xl: 6, xxl: grid }"
-                    :data-source="data"
-                    :pagination="paginationProp"
-            >
-                <template #header>
-                    <div class="flex justify-end space-x-2"
-                    ><slot name="header"></slot>
-                        <Tooltip>
-                            <template #title>
-                                <div class="w-50">每行显示数量</div
-                                ><Slider
-                                    id="slider"
-                                    v-bind="sliderProp"
-                                    v-model:value="grid"
-                                    @change="sliderChange"
-                            /></template>
-                            <Button><TableOutlined /></Button>
-                        </Tooltip>
-                        <Tooltip @click="fetch">
-                            <template #title>刷新</template>
-                            <Button><RedoOutlined /></Button>
-                        </Tooltip>
-                    </div>
-                </template>
-                <template #renderItem="{ item }">
-                    <ListItem>
-                        <Card>
-                            <template #title></template>
-                            <template #cover>
-                                <div :class="height">
-                                    <Image :src="item.imgs[0]" />
-                                </div>
-                            </template>
-                            <template class="ant-card-actions" #actions>
-                                <!--              <SettingOutlined key="setting" />-->
-                                <EditOutlined key="edit" />
-                                <Dropdown
-                                        :trigger="['hover']"
-                                        :dropMenuList="[
+  <div class="p-2">
+    <div class="bg-white mb-2 p-4">
+      <BasicForm @register="registerForm" />
+    </div>
+    {{ sliderProp.width }}
+    <div class="bg-white p-2">
+      <List :grid="{ gutter: 5, xs: 1, sm: 2, md: 4, lg: 4, xl: 6, xxl: grid }" :data-source="data" :pagination="paginationProp">
+        <template #header>
+          <div class="flex justify-end space-x-2"
+            ><slot name="header"></slot>
+            <Tooltip>
+              <template #title> <div class="w-50">每行显示数量</div><Slider id="slider" v-bind="sliderProp" v-model:value="grid" @change="sliderChange" /></template>
+              <Button><TableOutlined /></Button>
+            </Tooltip>
+            <Tooltip @click="fetch">
+              <template #title>刷新</template>
+              <Button><RedoOutlined /></Button>
+            </Tooltip>
+          </div>
+        </template>
+        <template #renderItem="{ item }">
+          <ListItem>
+            <Card>
+              <template #title></template>
+              <template #cover>
+                <div :class="height">
+                  <Image :src="item.imgs[0]" />
+                </div>
+              </template>
+              <template class="ant-card-actions" #actions>
+                <!--              <SettingOutlined key="setting" />-->
+                <EditOutlined key="edit" />
+                <Dropdown
+                  :trigger="['hover']"
+                  :dropMenuList="[
                     {
                       text: '删除',
                       event: '1',
@@ -54,125 +43,120 @@
                       },
                     },
                   ]"
-                                        popconfirm
-                                >
-                                    <EllipsisOutlined key="ellipsis" />
-                                </Dropdown>
-                            </template>
+                  popconfirm
+                >
+                  <EllipsisOutlined key="ellipsis" />
+                </Dropdown>
+              </template>
 
-                            <CardMeta>
-                                <template #title>
-                                    <TypographyText :content="item.name" :ellipsis="{ tooltip: item.address }" />
-                                </template>
-                                <template #avatar>
-                                    <Avatar :src="item.avatar" />
-                                </template>
-                                <template #description>{{ item.time }}</template>
-                            </CardMeta>
-                        </Card>
-                    </ListItem>
+              <CardMeta>
+                <template #title>
+                  <TypographyText :content="item.name" :ellipsis="{ tooltip: item.address }" />
                 </template>
-            </List>
-        </div>
+                <template #avatar>
+                  <Avatar :src="item.avatar" />
+                </template>
+                <template #description>{{ item.time }}</template>
+              </CardMeta>
+            </Card>
+          </ListItem>
+        </template>
+      </List>
     </div>
+  </div>
 </template>
 <script lang="ts" setup>
-    import { computed, onMounted, ref } from 'vue';
-    import {
-        EditOutlined,
-        EllipsisOutlined,
-        RedoOutlined,
-        TableOutlined,
-    } from '@ant-design/icons-vue';
-    import { List, Card, Image, Typography, Tooltip, Slider, Avatar } from 'ant-design-vue';
-    import { Dropdown } from '/@/components/Dropdown';
-    import { BasicForm, useForm } from '/@/components/Form';
-    import { propTypes } from '/@/utils/propTypes';
-    import { Button } from '/@/components/Button';
-    import { isFunction } from '/@/utils/is';
-    import { useSlider, grid } from './data';
-    const ListItem = List.Item;
-    const CardMeta = Card.Meta;
-    const TypographyText = Typography.Text;
-    // 获取slider属性
-    const sliderProp = computed(() => useSlider(4));
-    // 组件接收参数
-    const props = defineProps({
-        // 请求API的参数
-        params: propTypes.object.def({}),
-        //api
-        api: propTypes.func,
-    });
-    //暴露内部方法
-    const emit = defineEmits(['getMethod', 'delete']);
-    //数据
-    const data = ref([]);
-    // 切换每行个数
-    // cover图片自适应高度
-    //修改pageSize并重新请求数据
+  import { computed, onMounted, ref } from 'vue';
+  import { EditOutlined, EllipsisOutlined, RedoOutlined, TableOutlined } from '@ant-design/icons-vue';
+  import { List, Card, Image, Typography, Tooltip, Slider, Avatar } from 'ant-design-vue';
+  import { Dropdown } from '/@/components/Dropdown';
+  import { BasicForm, useForm } from '/@/components/Form';
+  import { propTypes } from '/@/utils/propTypes';
+  import { Button } from '/@/components/Button';
+  import { isFunction } from '/@/utils/is';
+  import { useSlider, grid } from './data';
+  const ListItem = List.Item;
+  const CardMeta = Card.Meta;
+  const TypographyText = Typography.Text;
+  // 获取slider属性
+  const sliderProp = computed(() => useSlider(4));
+  // 组件接收参数
+  const props = defineProps({
+    // 请求API的参数
+    params: propTypes.object.def({}),
+    //api
+    api: propTypes.func,
+  });
+  //暴露内部方法
+  const emit = defineEmits(['getMethod', 'delete']);
+  //数据
+  const data = ref([]);
+  // 切换每行个数
+  // cover图片自适应高度
+  //修改pageSize并重新请求数据
 
-    const height = computed(() => {
-        return `h-${120 - grid.value * 6}`;
-    });
-    //表单
-    const [registerForm, { validate }] = useForm({
-        schemas: [{ field: 'type', component: 'Input', label: '类型' }],
-        labelWidth: 80,
-        baseColProps: { span: 6 },
-        actionColOptions: { span: 24 },
-        autoSubmitOnEnter: true,
-        submitFunc: handleSubmit,
-    });
-    //表单提交
-    async function handleSubmit() {
-        const data = await validate();
-        await fetch(data);
-    }
-    function sliderChange(n) {
-        pageSize.value = n * 4;
-        fetch();
-    }
+  const height = computed(() => {
+    return `h-${120 - grid.value * 6}`;
+  });
+  //表单
+  const [registerForm, { validate }] = useForm({
+    schemas: [{ field: 'type', component: 'Input', label: '类型' }],
+    labelWidth: 80,
+    baseColProps: { span: 6 },
+    actionColOptions: { span: 24 },
+    autoSubmitOnEnter: true,
+    submitFunc: handleSubmit,
+  });
+  //表单提交
+  async function handleSubmit() {
+    const data = await validate();
+    await fetch(data);
+  }
+  function sliderChange(n) {
+    pageSize.value = n * 4;
+    fetch();
+  }
 
-    // 自动请求并暴露内部方法
-    onMounted(() => {
-        fetch();
-        emit('getMethod', fetch);
-    });
+  // 自动请求并暴露内部方法
+  onMounted(() => {
+    fetch();
+    emit('getMethod', fetch);
+  });
 
-    async function fetch(p = {}) {
-        const { api, params } = props;
-        if (api && isFunction(api)) {
-            const res = await api({ ...params, page: page.value, pageSize: pageSize.value, ...p });
-            data.value = res.items;
-            total.value = res.total;
-        }
+  async function fetch(p = {}) {
+    const { api, params } = props;
+    if (api && isFunction(api)) {
+      const res = await api({ ...params, page: page.value, pageSize: pageSize.value, ...p });
+      data.value = res.items;
+      total.value = res.total;
     }
-    //分页相关
-    const page = ref(1);
-    const pageSize = ref(36);
-    const total = ref(0);
-    const paginationProp = ref({
-        showSizeChanger: false,
-        showQuickJumper: true,
-        pageSize,
-        current: page,
-        total,
-        showTotal: (total) => `总 ${total} 条`,
-        onChange: pageChange,
-        onShowSizeChange: pageSizeChange,
-    });
+  }
+  //分页相关
+  const page = ref(1);
+  const pageSize = ref(36);
+  const total = ref(0);
+  const paginationProp = ref({
+    showSizeChanger: false,
+    showQuickJumper: true,
+    pageSize,
+    current: page,
+    total,
+    showTotal: (total) => `总 ${total} 条`,
+    onChange: pageChange,
+    onShowSizeChange: pageSizeChange,
+  });
 
-    function pageChange(p, pz) {
-        page.value = p;
-        pageSize.value = pz;
-        fetch();
-    }
-    function pageSizeChange(current, size) {
-        pageSize.value = size;
-        fetch();
-    }
+  function pageChange(p, pz) {
+    page.value = p;
+    pageSize.value = pz;
+    fetch();
+  }
+  function pageSizeChange(current, size) {
+    pageSize.value = size;
+    fetch();
+  }
 
-    async function handleDelete(id) {
-        emit('delete', id);
-    }
+  async function handleDelete(id) {
+    emit('delete', id);
+  }
 </script>
diff --git a/src/components/CodeEditor/src/CodeEditor.vue b/src/components/CodeEditor/src/CodeEditor.vue
index 074b2ef..660ab63 100644
--- a/src/components/CodeEditor/src/CodeEditor.vue
+++ b/src/components/CodeEditor/src/CodeEditor.vue
@@ -1,11 +1,6 @@
 <template>
   <div class="h-full">
-    <CodeMirrorEditor
-            :value="getValue"
-            @change="handleValueChange"
-            :mode="mode"
-            :readonly="readonly"
-    />
+    <CodeMirrorEditor :value="getValue" @change="handleValueChange" :mode="mode" :readonly="readonly" />
   </div>
 </template>
 
diff --git a/src/components/CodeEditor/src/codemirror/CodeMirror.vue b/src/components/CodeEditor/src/codemirror/CodeMirror.vue
index 428f20c..2d3bca1 100644
--- a/src/components/CodeEditor/src/codemirror/CodeMirror.vue
+++ b/src/components/CodeEditor/src/codemirror/CodeMirror.vue
@@ -32,15 +32,15 @@
   const appStore = useAppStore();
 
   watch(
-          () => props.value,
-          async (value) => {
-            await nextTick();
-            const oldValue = editor?.getValue();
-            if (value !== oldValue) {
-              editor?.setValue(value ? value : '');
-            }
-          },
-          { flush: 'post' }
+    () => props.value,
+    async (value) => {
+      await nextTick();
+      const oldValue = editor?.getValue();
+      if (value !== oldValue) {
+        editor?.setValue(value ? value : '');
+      }
+    },
+    { flush: 'post' }
   );
 
   watchEffect(() => {
@@ -48,20 +48,17 @@
   });
 
   watch(
-          () => appStore.getDarkMode,
-          async () => {
-            setTheme();
-          },
-          {
-            immediate: true,
-          }
+    () => appStore.getDarkMode,
+    async () => {
+      setTheme();
+    },
+    {
+      immediate: true,
+    }
   );
 
   function setTheme() {
-    unref(editor)?.setOption(
-            'theme',
-            appStore.getDarkMode === 'light' ? 'idea' : 'material-palenight'
-    );
+    unref(editor)?.setOption('theme', appStore.getDarkMode === 'light' ? 'idea' : 'material-palenight');
   }
 
   function refresh() {
diff --git a/src/components/Container/src/LazyContainer.vue b/src/components/Container/src/LazyContainer.vue
index a7ad2b6..4e26242 100644
--- a/src/components/Container/src/LazyContainer.vue
+++ b/src/components/Container/src/LazyContainer.vue
@@ -1,12 +1,5 @@
 <template>
-  <transition-group
-    class="h-full w-full"
-    v-bind="$attrs"
-    ref="elRef"
-    :name="transitionName"
-    :tag="tag"
-    mode="out-in"
-  >
+  <transition-group class="h-full w-full" v-bind="$attrs" ref="elRef" :name="transitionName" :tag="tag" mode="out-in">
     <div key="component" v-if="isInit">
       <slot :loading="loading"></slot>
     </div>
diff --git a/src/components/ContextMenu/src/ContextMenu.vue b/src/components/ContextMenu/src/ContextMenu.vue
index bbe7fe4..8f400fb 100644
--- a/src/components/ContextMenu/src/ContextMenu.vue
+++ b/src/components/ContextMenu/src/ContextMenu.vue
@@ -1,207 +1,196 @@
 <script lang="tsx">
-    import type { ContextMenuItem, ItemContentProps, Axis } from './typing';
-    import type { FunctionalComponent, CSSProperties } from 'vue';
-    import { defineComponent, nextTick, onMounted, computed, ref, unref, onUnmounted } from 'vue';
-    import Icon from '/@/components/Icon';
-    import { Menu, Divider } from 'ant-design-vue';
+  import type { ContextMenuItem, ItemContentProps, Axis } from './typing';
+  import type { FunctionalComponent, CSSProperties } from 'vue';
+  import { defineComponent, nextTick, onMounted, computed, ref, unref, onUnmounted } from 'vue';
+  import Icon from '/@/components/Icon';
+  import { Menu, Divider } from 'ant-design-vue';
 
-    const prefixCls = 'context-menu';
+  const prefixCls = 'context-menu';
 
-    const props = {
-        width: { type: Number, default: 156 },
-        customEvent: { type: Object as PropType<Event>, default: null },
-        styles: { type: Object as PropType<CSSProperties> },
-        showIcon: { type: Boolean, default: true },
-        axis: {
-            // The position of the right mouse button click
-            type: Object as PropType<Axis>,
-            default() {
-                return { x: 0, y: 0 };
-            },
-        },
-        items: {
-            // The most important list, if not, will not be displayed
-            type: Array as PropType<ContextMenuItem[]>,
-            default() {
-                return [];
-            },
-        },
-    };
+  const props = {
+    width: { type: Number, default: 156 },
+    customEvent: { type: Object as PropType<Event>, default: null },
+    styles: { type: Object as PropType<CSSProperties> },
+    showIcon: { type: Boolean, default: true },
+    axis: {
+      // The position of the right mouse button click
+      type: Object as PropType<Axis>,
+      default() {
+        return { x: 0, y: 0 };
+      },
+    },
+    items: {
+      // The most important list, if not, will not be displayed
+      type: Array as PropType<ContextMenuItem[]>,
+      default() {
+        return [];
+      },
+    },
+  };
 
-    const ItemContent: FunctionalComponent<ItemContentProps> = (props) => {
-        const { item } = props;
-        return (
-            <span
-                style="display: inline-block; width: 100%; "
-                class="px-4"
-                onClick={props.handler.bind(null, item)}
-            >
+  const ItemContent: FunctionalComponent<ItemContentProps> = (props) => {
+    const { item } = props;
+    return (
+      <span style="display: inline-block; width: 100%; " class="px-4" onClick={props.handler.bind(null, item)}>
         {props.showIcon && item.icon && <Icon class="mr-2" icon={item.icon} />}
-                <span>{item.label}</span>
+        <span>{item.label}</span>
       </span>
+    );
+  };
+
+  export default defineComponent({
+    name: 'ContextMenu',
+    props,
+    setup(props) {
+      const wrapRef = ref(null);
+      const showRef = ref(false);
+
+      const getStyle = computed((): CSSProperties => {
+        const { axis, items, styles, width } = props;
+        const { x, y } = axis || { x: 0, y: 0 };
+        const menuHeight = (items || []).length * 40;
+        const menuWidth = width;
+        const body = document.body;
+
+        const left = body.clientWidth < x + menuWidth ? x - menuWidth : x;
+        const top = body.clientHeight < y + menuHeight ? y - menuHeight : y;
+        return {
+          ...styles,
+          width: `${width}px`,
+          left: `${left + 1}px`,
+          top: `${top + 1}px`,
+        };
+      });
+
+      onMounted(() => {
+        nextTick(() => (showRef.value = true));
+      });
+
+      onUnmounted(() => {
+        const el = unref(wrapRef);
+        el && document.body.removeChild(el);
+      });
+
+      function handleAction(item: ContextMenuItem, e: MouseEvent) {
+        const { handler, disabled } = item;
+        if (disabled) {
+          return;
+        }
+        showRef.value = false;
+        e?.stopPropagation();
+        e?.preventDefault();
+        handler?.();
+      }
+
+      function renderMenuItem(items: ContextMenuItem[]) {
+        return items.map((item) => {
+          const { disabled, label, children, divider = false } = item;
+
+          const contentProps = {
+            item,
+            handler: handleAction,
+            showIcon: props.showIcon,
+          };
+
+          if (!children || children.length === 0) {
+            return (
+              <>
+                <Menu.Item disabled={disabled} class={`${prefixCls}__item`} key={label}>
+                  <ItemContent {...contentProps} />
+                </Menu.Item>
+                {divider ? <Divider key={`d-${label}`} /> : null}
+              </>
+            );
+          }
+          if (!unref(showRef)) return null;
+
+          return (
+            <Menu.SubMenu key={label} disabled={disabled} popupClassName={`${prefixCls}__popup`}>
+              {{
+                title: () => <ItemContent {...contentProps} />,
+                default: () => renderMenuItem(children),
+              }}
+            </Menu.SubMenu>
+          );
+        });
+      }
+      return () => {
+        if (!unref(showRef)) {
+          return null;
+        }
+        const { items } = props;
+        return (
+          <Menu inlineIndent={12} mode="vertical" class={prefixCls} ref={wrapRef} style={unref(getStyle)}>
+            {renderMenuItem(items)}
+          </Menu>
         );
-    };
-
-    export default defineComponent({
-        name: 'ContextMenu',
-        props,
-        setup(props) {
-            const wrapRef = ref(null);
-            const showRef = ref(false);
-
-            const getStyle = computed((): CSSProperties => {
-                const { axis, items, styles, width } = props;
-                const { x, y } = axis || { x: 0, y: 0 };
-                const menuHeight = (items || []).length * 40;
-                const menuWidth = width;
-                const body = document.body;
-
-                const left = body.clientWidth < x + menuWidth ? x - menuWidth : x;
-                const top = body.clientHeight < y + menuHeight ? y - menuHeight : y;
-                return {
-                    ...styles,
-                    width: `${width}px`,
-                    left: `${left + 1}px`,
-                    top: `${top + 1}px`,
-                };
-            });
-
-            onMounted(() => {
-                nextTick(() => (showRef.value = true));
-            });
-
-            onUnmounted(() => {
-                const el = unref(wrapRef);
-                el && document.body.removeChild(el);
-            });
-
-            function handleAction(item: ContextMenuItem, e: MouseEvent) {
-                const { handler, disabled } = item;
-                if (disabled) {
-                    return;
-                }
-                showRef.value = false;
-                e?.stopPropagation();
-                e?.preventDefault();
-                handler?.();
-            }
-
-            function renderMenuItem(items: ContextMenuItem[]) {
-                return items.map((item) => {
-                    const { disabled, label, children, divider = false } = item;
-
-                    const contentProps = {
-                        item,
-                        handler: handleAction,
-                        showIcon: props.showIcon,
-                    };
-
-                    if (!children || children.length === 0) {
-                        return (
-                            <>
-                                <Menu.Item disabled={disabled} class={`${prefixCls}__item`} key={label}>
-                                    <ItemContent {...contentProps} />
-                                </Menu.Item>
-                                {divider ? <Divider key={`d-${label}`} /> : null}
-                            </>
-                        );
-                    }
-                    if (!unref(showRef)) return null;
-
-                    return (
-                        <Menu.SubMenu key={label} disabled={disabled} popupClassName={`${prefixCls}__popup`}>
-                            {{
-                                title: () => <ItemContent {...contentProps} />,
-                                default: () => renderMenuItem(children),
-                            }}
-                        </Menu.SubMenu>
-                    );
-                });
-            }
-            return () => {
-                if (!unref(showRef)) {
-                    return null;
-                }
-                const { items } = props;
-                return (
-                    <Menu
-                        inlineIndent={12}
-                        mode="vertical"
-                        class={prefixCls}
-                        ref={wrapRef}
-                        style={unref(getStyle)}
-                    >
-                        {renderMenuItem(items)}
-                    </Menu>
-                );
-            };
-        },
-    });
+      };
+    },
+  });
 </script>
 <style lang="less">
-    @default-height: 42px !important;
+  @default-height: 42px !important;
 
-    @small-height: 36px !important;
+  @small-height: 36px !important;
 
-    @large-height: 36px !important;
+  @large-height: 36px !important;
 
-    .item-style() {
-        li {
-            display: inline-block;
-            width: 100%;
-            height: @default-height;
-            margin: 0 !important;
-            line-height: @default-height;
+  .item-style() {
+    li {
+      display: inline-block;
+      width: 100%;
+      height: @default-height;
+      margin: 0 !important;
+      line-height: @default-height;
 
-            span {
-                line-height: @default-height;
-            }
+      span {
+        line-height: @default-height;
+      }
 
-            > div {
-                margin: 0 !important;
-            }
+      > div {
+        margin: 0 !important;
+      }
 
-            &:not(.ant-menu-item-disabled):hover {
-                color: @text-color-base;
-                background-color: @item-hover-bg;
-            }
-        }
+      &:not(.ant-menu-item-disabled):hover {
+        color: @text-color-base;
+        background-color: @item-hover-bg;
+      }
+    }
+  }
+
+  .context-menu {
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 200;
+    display: block;
+    width: 156px;
+    margin: 0;
+    list-style: none;
+    background-color: @component-background;
+    border: 1px solid rgba(0, 0, 0, 0.08);
+    border-radius: 0.25rem;
+    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.06);
+    background-clip: padding-box;
+    user-select: none;
+
+    .item-style();
+
+    .ant-divider {
+      margin: 0 0;
     }
 
-    .context-menu {
-        position: fixed;
-        top: 0;
-        left: 0;
-        z-index: 200;
-        display: block;
-        width: 156px;
-        margin: 0;
-        list-style: none;
-        background-color: @component-background;
-        border: 1px solid rgba(0, 0, 0, 0.08);
-        border-radius: 0.25rem;
-        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.1),
-        0 1px 5px 0 rgba(0, 0, 0, 0.06);
-        background-clip: padding-box;
-        user-select: none;
+    &__popup {
+      .ant-divider {
+        margin: 0 0;
+      }
 
-        .item-style();
-
-        .ant-divider {
-            margin: 0 0;
-        }
-
-        &__popup {
-            .ant-divider {
-                margin: 0 0;
-            }
-
-            .item-style();
-        }
-
-        .ant-menu-submenu-title,
-        .ant-menu-item {
-            padding: 0 !important;
-        }
+      .item-style();
     }
+
+    .ant-menu-submenu-title,
+    .ant-menu-item {
+      padding: 0 !important;
+    }
+  }
 </style>
diff --git a/src/components/CountDown/src/CountButton.vue b/src/components/CountDown/src/CountButton.vue
index 1ef520e..fd14900 100644
--- a/src/components/CountDown/src/CountButton.vue
+++ b/src/components/CountDown/src/CountButton.vue
@@ -30,9 +30,7 @@
       const { t } = useI18n();
 
       const getButtonText = computed(() => {
-        return !unref(isStart)
-          ? t('component.countdown.normalText')
-          : t('component.countdown.sendText', [unref(currentCount)]);
+        return !unref(isStart) ? t('component.countdown.normalText') : t('component.countdown.sendText', [unref(currentCount)]);
       });
 
       watchEffect(() => {
diff --git a/src/components/Cropper/src/CopperModal.vue b/src/components/Cropper/src/CopperModal.vue
index e73569e..46c34b6 100644
--- a/src/components/Cropper/src/CopperModal.vue
+++ b/src/components/Cropper/src/CopperModal.vue
@@ -1,283 +1,214 @@
 <template>
-    <BasicModal
-            v-bind="$attrs"
-            @register="register"
-            :title="t('component.cropper.modalTitle')"
-            width="800px"
-            :canFullscreen="false"
-            @ok="handleOk"
-            :okText="t('component.cropper.okText')"
-    >
-        <div :class="prefixCls">
-            <div :class="`${prefixCls}-left`">
-                <div :class="`${prefixCls}-cropper`">
-                    <CropperImage
-                            v-if="src"
-                            :src="src"
-                            height="300px"
-                            :circled="circled"
-                            @cropend="handleCropend"
-                            @ready="handleReady"
-                    />
-                </div>
-
-                <div :class="`${prefixCls}-toolbar`">
-                    <Upload :fileList="[]" accept="image/*" :beforeUpload="handleBeforeUpload">
-                        <Tooltip :title="t('component.cropper.selectImage')" placement="bottom">
-                            <a-button size="small" preIcon="ant-design:upload-outlined" type="primary" />
-                        </Tooltip>
-                    </Upload>
-                    <Space>
-                        <Tooltip :title="t('component.cropper.btn_reset')" placement="bottom">
-                            <a-button
-                                    type="primary"
-                                    preIcon="ant-design:reload-outlined"
-                                    size="small"
-                                    :disabled="!src"
-                                    @click="handlerToolbar('reset')"
-                            />
-                        </Tooltip>
-                        <Tooltip :title="t('component.cropper.btn_rotate_left')" placement="bottom">
-                            <a-button
-                                    type="primary"
-                                    preIcon="ant-design:rotate-left-outlined"
-                                    size="small"
-                                    :disabled="!src"
-                                    @click="handlerToolbar('rotate', -45)"
-                            />
-                        </Tooltip>
-                        <Tooltip :title="t('component.cropper.btn_rotate_right')" placement="bottom">
-                            <a-button
-                                    type="primary"
-                                    preIcon="ant-design:rotate-right-outlined"
-                                    size="small"
-                                    :disabled="!src"
-                                    @click="handlerToolbar('rotate', 45)"
-                            />
-                        </Tooltip>
-                        <Tooltip :title="t('component.cropper.btn_scale_x')" placement="bottom">
-                            <a-button
-                                    type="primary"
-                                    preIcon="vaadin:arrows-long-h"
-                                    size="small"
-                                    :disabled="!src"
-                                    @click="handlerToolbar('scaleX')"
-                            />
-                        </Tooltip>
-                        <Tooltip :title="t('component.cropper.btn_scale_y')" placement="bottom">
-                            <a-button
-                                    type="primary"
-                                    preIcon="vaadin:arrows-long-v"
-                                    size="small"
-                                    :disabled="!src"
-                                    @click="handlerToolbar('scaleY')"
-                            />
-                        </Tooltip>
-                        <Tooltip :title="t('component.cropper.btn_zoom_in')" placement="bottom">
-                            <a-button
-                                    type="primary"
-                                    preIcon="ant-design:zoom-in-outlined"
-                                    size="small"
-                                    :disabled="!src"
-                                    @click="handlerToolbar('zoom', 0.1)"
-                            />
-                        </Tooltip>
-                        <Tooltip :title="t('component.cropper.btn_zoom_out')" placement="bottom">
-                            <a-button
-                                    type="primary"
-                                    preIcon="ant-design:zoom-out-outlined"
-                                    size="small"
-                                    :disabled="!src"
-                                    @click="handlerToolbar('zoom', -0.1)"
-                            />
-                        </Tooltip>
-                    </Space>
-                </div>
-            </div>
-            <div :class="`${prefixCls}-right`">
-                <div :class="`${prefixCls}-preview`">
-                    <img :src="previewSource" v-if="previewSource" :alt="t('component.cropper.preview')" />
-                </div>
-                <template v-if="previewSource">
-                    <div :class="`${prefixCls}-group`">
-                        <Avatar :src="previewSource" size="large" />
-                        <Avatar :src="previewSource" :size="48" />
-                        <Avatar :src="previewSource" :size="64" />
-                        <Avatar :src="previewSource" :size="80" />
-                    </div>
-                </template>
-            </div>
+  <BasicModal v-bind="$attrs" @register="register" :title="t('component.cropper.modalTitle')" width="800px" :canFullscreen="false" @ok="handleOk" :okText="t('component.cropper.okText')">
+    <div :class="prefixCls">
+      <div :class="`${prefixCls}-left`">
+        <div :class="`${prefixCls}-cropper`">
+          <CropperImage v-if="src" :src="src" height="300px" :circled="circled" @cropend="handleCropend" @ready="handleReady" />
         </div>
-    </BasicModal>
+
+        <div :class="`${prefixCls}-toolbar`">
+          <Upload :fileList="[]" accept="image/*" :beforeUpload="handleBeforeUpload">
+            <Tooltip :title="t('component.cropper.selectImage')" placement="bottom">
+              <a-button size="small" preIcon="ant-design:upload-outlined" type="primary" />
+            </Tooltip>
+          </Upload>
+          <Space>
+            <Tooltip :title="t('component.cropper.btn_reset')" placement="bottom">
+              <a-button type="primary" preIcon="ant-design:reload-outlined" size="small" :disabled="!src" @click="handlerToolbar('reset')" />
+            </Tooltip>
+            <Tooltip :title="t('component.cropper.btn_rotate_left')" placement="bottom">
+              <a-button type="primary" preIcon="ant-design:rotate-left-outlined" size="small" :disabled="!src" @click="handlerToolbar('rotate', -45)" />
+            </Tooltip>
+            <Tooltip :title="t('component.cropper.btn_rotate_right')" placement="bottom">
+              <a-button type="primary" preIcon="ant-design:rotate-right-outlined" size="small" :disabled="!src" @click="handlerToolbar('rotate', 45)" />
+            </Tooltip>
+            <Tooltip :title="t('component.cropper.btn_scale_x')" placement="bottom">
+              <a-button type="primary" preIcon="vaadin:arrows-long-h" size="small" :disabled="!src" @click="handlerToolbar('scaleX')" />
+            </Tooltip>
+            <Tooltip :title="t('component.cropper.btn_scale_y')" placement="bottom">
+              <a-button type="primary" preIcon="vaadin:arrows-long-v" size="small" :disabled="!src" @click="handlerToolbar('scaleY')" />
+            </Tooltip>
+            <Tooltip :title="t('component.cropper.btn_zoom_in')" placement="bottom">
+              <a-button type="primary" preIcon="ant-design:zoom-in-outlined" size="small" :disabled="!src" @click="handlerToolbar('zoom', 0.1)" />
+            </Tooltip>
+            <Tooltip :title="t('component.cropper.btn_zoom_out')" placement="bottom">
+              <a-button type="primary" preIcon="ant-design:zoom-out-outlined" size="small" :disabled="!src" @click="handlerToolbar('zoom', -0.1)" />
+            </Tooltip>
+          </Space>
+        </div>
+      </div>
+      <div :class="`${prefixCls}-right`">
+        <div :class="`${prefixCls}-preview`">
+          <img :src="previewSource" v-if="previewSource" :alt="t('component.cropper.preview')" />
+        </div>
+        <template v-if="previewSource">
+          <div :class="`${prefixCls}-group`">
+            <Avatar :src="previewSource" size="large" />
+            <Avatar :src="previewSource" :size="48" />
+            <Avatar :src="previewSource" :size="64" />
+            <Avatar :src="previewSource" :size="80" />
+          </div>
+        </template>
+      </div>
+    </div>
+  </BasicModal>
 </template>
 <script lang="ts">
-    import type { CropendResult, Cropper } from './typing';
+  import type { CropendResult, Cropper } from './typing';
 
-    import { defineComponent, ref } from 'vue';
-    import CropperImage from './Cropper.vue';
-    import { Space, Upload, Avatar, Tooltip } from 'ant-design-vue';
-    import { useDesign } from '/@/hooks/web/useDesign';
-    import { BasicModal, useModalInner } from '/@/components/Modal';
-    import { dataURLtoBlob } from '/@/utils/file/base64Conver';
-    import { isFunction } from '/@/utils/is';
-    import { useI18n } from '/@/hooks/web/useI18n';
+  import { defineComponent, ref } from 'vue';
+  import CropperImage from './Cropper.vue';
+  import { Space, Upload, Avatar, Tooltip } from 'ant-design-vue';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { dataURLtoBlob } from '/@/utils/file/base64Conver';
+  import { isFunction } from '/@/utils/is';
+  import { useI18n } from '/@/hooks/web/useI18n';
 
-    type apiFunParams = { file: Blob; name: string; filename: string };
+  type apiFunParams = { file: Blob; name: string; filename: string };
 
-    const props = {
-        circled: { type: Boolean, default: true },
-        uploadApi: {
-            type: Function as PropType<(params: apiFunParams) => Promise<any>>,
-        },
-    };
+  const props = {
+    circled: { type: Boolean, default: true },
+    uploadApi: {
+      type: Function as PropType<(params: apiFunParams) => Promise<any>>,
+    },
+  };
 
-    export default defineComponent({
-        name: 'CropperModal',
-        components: { BasicModal, Space, CropperImage, Upload, Avatar, Tooltip },
-        props,
-        emits: ['uploadSuccess', 'register'],
-        setup(props, { emit }) {
-            let filename = '';
-            const src = ref('');
-            const previewSource = ref('');
-            const cropper = ref<Cropper>();
-            let scaleX = 1;
-            let scaleY = 1;
+  export default defineComponent({
+    name: 'CropperModal',
+    components: { BasicModal, Space, CropperImage, Upload, Avatar, Tooltip },
+    props,
+    emits: ['uploadSuccess', 'register'],
+    setup(props, { emit }) {
+      let filename = '';
+      const src = ref('');
+      const previewSource = ref('');
+      const cropper = ref<Cropper>();
+      let scaleX = 1;
+      let scaleY = 1;
 
-            const { prefixCls } = useDesign('cropper-am');
-            const [register, { closeModal, setModalProps }] = useModalInner();
-            const { t } = useI18n();
+      const { prefixCls } = useDesign('cropper-am');
+      const [register, { closeModal, setModalProps }] = useModalInner();
+      const { t } = useI18n();
 
-            // Block upload
-            function handleBeforeUpload(file: File) {
-                const reader = new FileReader();
-                reader.readAsDataURL(file);
-                src.value = '';
-                previewSource.value = '';
-                reader.onload = function (e) {
-                    src.value = (e.target?.result as string) ?? '';
-                    filename = file.name;
-                };
-                return false;
-            }
+      // Block upload
+      function handleBeforeUpload(file: File) {
+        const reader = new FileReader();
+        reader.readAsDataURL(file);
+        src.value = '';
+        previewSource.value = '';
+        reader.onload = function (e) {
+          src.value = (e.target?.result as string) ?? '';
+          filename = file.name;
+        };
+        return false;
+      }
 
-            function handleCropend({ imgBase64 }: CropendResult) {
-                previewSource.value = imgBase64;
-            }
+      function handleCropend({ imgBase64 }: CropendResult) {
+        previewSource.value = imgBase64;
+      }
 
-            function handleReady(cropperInstance: Cropper) {
-                cropper.value = cropperInstance;
-            }
+      function handleReady(cropperInstance: Cropper) {
+        cropper.value = cropperInstance;
+      }
 
-            function handlerToolbar(event: string, arg?: number) {
-                if (event === 'scaleX') {
-                    scaleX = arg = scaleX === -1 ? 1 : -1;
-                }
-                if (event === 'scaleY') {
-                    scaleY = arg = scaleY === -1 ? 1 : -1;
-                }
-                cropper?.value?.[event]?.(arg);
-            }
+      function handlerToolbar(event: string, arg?: number) {
+        if (event === 'scaleX') {
+          scaleX = arg = scaleX === -1 ? 1 : -1;
+        }
+        if (event === 'scaleY') {
+          scaleY = arg = scaleY === -1 ? 1 : -1;
+        }
+        cropper?.value?.[event]?.(arg);
+      }
 
-            async function handleOk() {
-                const uploadApi = props.uploadApi;
-                if (uploadApi && isFunction(uploadApi)) {
-                    const blob = dataURLtoBlob(previewSource.value);
-                    try {
-                        setModalProps({ confirmLoading: true });
-                        const result = await uploadApi({ name: 'file', file: blob, filename });
-                        emit('uploadSuccess', { source: previewSource.value, data: result.data || result.message });
-                        closeModal();
-                    } finally {
-                        setModalProps({ confirmLoading: false });
-                    }
-                }
-            }
+      async function handleOk() {
+        const uploadApi = props.uploadApi;
+        if (uploadApi && isFunction(uploadApi)) {
+          const blob = dataURLtoBlob(previewSource.value);
+          try {
+            setModalProps({ confirmLoading: true });
+            const result = await uploadApi({ name: 'file', file: blob, filename });
+            emit('uploadSuccess', { source: previewSource.value, data: result.data || result.message });
+            closeModal();
+          } finally {
+            setModalProps({ confirmLoading: false });
+          }
+        }
+      }
 
-            return {
-                t,
-                prefixCls,
-                src,
-                register,
-                previewSource,
-                handleBeforeUpload,
-                handleCropend,
-                handleReady,
-                handlerToolbar,
-                handleOk,
-            };
-        },
-    });
+      return {
+        t,
+        prefixCls,
+        src,
+        register,
+        previewSource,
+        handleBeforeUpload,
+        handleCropend,
+        handleReady,
+        handlerToolbar,
+        handleOk,
+      };
+    },
+  });
 </script>
 
 <style lang="less">
-    @prefix-cls: ~'@{namespace}-cropper-am';
+  @prefix-cls: ~'@{namespace}-cropper-am';
 
-    .@{prefix-cls} {
-        display: flex;
+  .@{prefix-cls} {
+    display: flex;
 
-        &-left,
-        &-right {
-            height: 340px;
-        }
-
-        &-left {
-            width: 55%;
-        }
-
-        &-right {
-            width: 45%;
-        }
-
-        &-cropper {
-            height: 300px;
-            background: #eee;
-            background-image: linear-gradient(
-                    45deg,
-                    rgba(0, 0, 0, 0.25) 25%,
-                    transparent 0,
-                    transparent 75%,
-                    rgba(0, 0, 0, 0.25) 0
-            ),
-            linear-gradient(
-                    45deg,
-                    rgba(0, 0, 0, 0.25) 25%,
-                    transparent 0,
-                    transparent 75%,
-                    rgba(0, 0, 0, 0.25) 0
-            );
-            background-position: 0 0, 12px 12px;
-            background-size: 24px 24px;
-        }
-
-        &-toolbar {
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-            margin-top: 10px;
-        }
-
-        &-preview {
-            width: 220px;
-            height: 220px;
-            margin: 0 auto;
-            overflow: hidden;
-            border: 1px solid @border-color-base;
-            border-radius: 50%;
-
-            img {
-                width: 100%;
-                height: 100%;
-            }
-        }
-
-        &-group {
-            display: flex;
-            padding-top: 8px;
-            margin-top: 8px;
-            border-top: 1px solid @border-color-base;
-            justify-content: space-around;
-            align-items: center;
-        }
+    &-left,
+    &-right {
+      height: 340px;
     }
+
+    &-left {
+      width: 55%;
+    }
+
+    &-right {
+      width: 45%;
+    }
+
+    &-cropper {
+      height: 300px;
+      background: #eee;
+      background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 0, transparent 75%, rgba(0, 0, 0, 0.25) 0),
+        linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 0, transparent 75%, rgba(0, 0, 0, 0.25) 0);
+      background-position: 0 0, 12px 12px;
+      background-size: 24px 24px;
+    }
+
+    &-toolbar {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      margin-top: 10px;
+    }
+
+    &-preview {
+      width: 220px;
+      height: 220px;
+      margin: 0 auto;
+      overflow: hidden;
+      border: 1px solid @border-color-base;
+      border-radius: 50%;
+
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+
+    &-group {
+      display: flex;
+      padding-top: 8px;
+      margin-top: 8px;
+      border-top: 1px solid @border-color-base;
+      justify-content: space-around;
+      align-items: center;
+    }
+  }
 </style>
diff --git a/src/components/Cropper/src/Cropper.vue b/src/components/Cropper/src/Cropper.vue
index 396b3ab..6146652 100644
--- a/src/components/Cropper/src/Cropper.vue
+++ b/src/components/Cropper/src/Cropper.vue
@@ -1,188 +1,181 @@
 <template>
-    <div :class="getClass" :style="getWrapperStyle">
-        <img
-                v-show="isReady"
-                ref="imgElRef"
-                :src="src"
-                :alt="alt"
-                :crossorigin="crossorigin"
-                :style="getImageStyle"
-        />
-    </div>
+  <div :class="getClass" :style="getWrapperStyle">
+    <img v-show="isReady" ref="imgElRef" :src="src" :alt="alt" :crossorigin="crossorigin" :style="getImageStyle" />
+  </div>
 </template>
 <script lang="ts">
-    import type {CSSProperties} from 'vue';
-    import {defineComponent, onMounted, ref, unref, computed, onUnmounted} from 'vue';
-    import Cropper from 'cropperjs';
-    import 'cropperjs/dist/cropper.css';
-    import {useDesign} from '/@/hooks/web/useDesign';
-    import {useDebounceFn} from '@vueuse/shared';
+  import type { CSSProperties } from 'vue';
+  import { defineComponent, onMounted, ref, unref, computed, onUnmounted } from 'vue';
+  import Cropper from 'cropperjs';
+  import 'cropperjs/dist/cropper.css';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useDebounceFn } from '@vueuse/shared';
 
-    type Options = Cropper.Options;
+  type Options = Cropper.Options;
 
-    const defaultOptions: Options = {
-        aspectRatio: 1,
-        zoomable: true,
-        zoomOnTouch: true,
-        zoomOnWheel: true,
-        cropBoxMovable: true,
-        cropBoxResizable: true,
-        toggleDragModeOnDblclick: true,
-        autoCrop: true,
-        background: true,
-        highlight: true,
-        center: true,
-        responsive: true,
-        restore: true,
-        checkCrossOrigin: true,
-        checkOrientation: true,
-        scalable: true,
-        modal: true,
-        guides: true,
-        movable: true,
-        rotatable: true,
-    };
+  const defaultOptions: Options = {
+    aspectRatio: 1,
+    zoomable: true,
+    zoomOnTouch: true,
+    zoomOnWheel: true,
+    cropBoxMovable: true,
+    cropBoxResizable: true,
+    toggleDragModeOnDblclick: true,
+    autoCrop: true,
+    background: true,
+    highlight: true,
+    center: true,
+    responsive: true,
+    restore: true,
+    checkCrossOrigin: true,
+    checkOrientation: true,
+    scalable: true,
+    modal: true,
+    guides: true,
+    movable: true,
+    rotatable: true,
+  };
 
-    const props = {
-        src: {type: String, required: true},
-        alt: {type: String},
-        circled: {type: Boolean, default: false},
-        realTimePreview: {type: Boolean, default: true},
-        height: {type: [String, Number], default: '360px'},
-        crossorigin: {
-            type: String as PropType<'' | 'anonymous' | 'use-credentials' | undefined>,
-            default: undefined,
-        },
-        imageStyle: {type: Object as PropType<CSSProperties>, default: () => ({})},
-        options: {type: Object as PropType<Options>, default: () => ({})},
-    };
+  const props = {
+    src: { type: String, required: true },
+    alt: { type: String },
+    circled: { type: Boolean, default: false },
+    realTimePreview: { type: Boolean, default: true },
+    height: { type: [String, Number], default: '360px' },
+    crossorigin: {
+      type: String as PropType<'' | 'anonymous' | 'use-credentials' | undefined>,
+      default: undefined,
+    },
+    imageStyle: { type: Object as PropType<CSSProperties>, default: () => ({}) },
+    options: { type: Object as PropType<Options>, default: () => ({}) },
+  };
 
-    export default defineComponent({
-        name: 'CropperImage',
-        props,
-        emits: ['cropend', 'ready', 'cropendError'],
-        setup(props, {attrs, emit}) {
-            const imgElRef = ref<ElRef<HTMLImageElement>>();
-            const cropper = ref<Nullable<Cropper>>();
-            const isReady = ref(false);
+  export default defineComponent({
+    name: 'CropperImage',
+    props,
+    emits: ['cropend', 'ready', 'cropendError'],
+    setup(props, { attrs, emit }) {
+      const imgElRef = ref<ElRef<HTMLImageElement>>();
+      const cropper = ref<Nullable<Cropper>>();
+      const isReady = ref(false);
 
-            const {prefixCls} = useDesign('cropper-image');
-            const debounceRealTimeCroppered = useDebounceFn(realTimeCroppered, 80);
+      const { prefixCls } = useDesign('cropper-image');
+      const debounceRealTimeCroppered = useDebounceFn(realTimeCroppered, 80);
 
-            const getImageStyle = computed((): CSSProperties => {
-                return {
-                    height: props.height,
-                    maxWidth: '100%',
-                    ...props.imageStyle,
-                };
+      const getImageStyle = computed((): CSSProperties => {
+        return {
+          height: props.height,
+          maxWidth: '100%',
+          ...props.imageStyle,
+        };
+      });
+
+      const getClass = computed(() => {
+        return [
+          prefixCls,
+          attrs.class,
+          {
+            [`${prefixCls}--circled`]: props.circled,
+          },
+        ];
+      });
+
+      const getWrapperStyle = computed((): CSSProperties => {
+        return { height: `${props.height}`.replace(/px/, '') + 'px' };
+      });
+
+      onMounted(init);
+
+      onUnmounted(() => {
+        cropper.value?.destroy();
+      });
+
+      async function init() {
+        const imgEl = unref(imgElRef);
+        if (!imgEl) {
+          return;
+        }
+        cropper.value = new Cropper(imgEl, {
+          ...defaultOptions,
+          ready: () => {
+            isReady.value = true;
+            realTimeCroppered();
+            emit('ready', cropper.value);
+          },
+          crop() {
+            debounceRealTimeCroppered();
+          },
+          zoom() {
+            debounceRealTimeCroppered();
+          },
+          cropmove() {
+            debounceRealTimeCroppered();
+          },
+          ...props.options,
+        });
+      }
+
+      // Real-time display preview
+      function realTimeCroppered() {
+        props.realTimePreview && croppered();
+      }
+
+      // event: return base64 and width and height information after cropping
+      function croppered() {
+        if (!cropper.value) {
+          return;
+        }
+        let imgInfo = cropper.value.getData();
+        const canvas = props.circled ? getRoundedCanvas() : cropper.value.getCroppedCanvas();
+        canvas.toBlob((blob) => {
+          if (!blob) {
+            return;
+          }
+          let fileReader: FileReader = new FileReader();
+          fileReader.readAsDataURL(blob);
+          fileReader.onloadend = (e) => {
+            emit('cropend', {
+              imgBase64: e.target?.result ?? '',
+              imgInfo,
             });
+          };
+          fileReader.onerror = () => {
+            emit('cropendError');
+          };
+        }, 'image/png');
+      }
 
-            const getClass = computed(() => {
-                return [
-                    prefixCls,
-                    attrs.class,
-                    {
-                        [`${prefixCls}--circled`]: props.circled,
-                    },
-                ];
-            });
+      // Get a circular picture canvas
+      function getRoundedCanvas() {
+        const sourceCanvas = cropper.value!.getCroppedCanvas();
+        const canvas = document.createElement('canvas');
+        const context = canvas.getContext('2d')!;
+        const width = sourceCanvas.width;
+        const height = sourceCanvas.height;
+        canvas.width = width;
+        canvas.height = height;
+        context.imageSmoothingEnabled = true;
+        context.drawImage(sourceCanvas, 0, 0, width, height);
+        context.globalCompositeOperation = 'destination-in';
+        context.beginPath();
+        context.arc(width / 2, height / 2, Math.min(width, height) / 2, 0, 2 * Math.PI, true);
+        context.fill();
+        return canvas;
+      }
 
-            const getWrapperStyle = computed((): CSSProperties => {
-                return {height: `${props.height}`.replace(/px/, '') + 'px'};
-            });
-
-            onMounted(init);
-
-            onUnmounted(() => {
-                cropper.value?.destroy();
-            });
-
-            async function init() {
-                const imgEl = unref(imgElRef);
-                if (!imgEl) {
-                    return;
-                }
-                cropper.value = new Cropper(imgEl, {
-                    ...defaultOptions,
-                    ready: () => {
-                        isReady.value = true;
-                        realTimeCroppered();
-                        emit('ready', cropper.value);
-                    },
-                    crop() {
-                        debounceRealTimeCroppered();
-                    },
-                    zoom() {
-                        debounceRealTimeCroppered();
-                    },
-                    cropmove() {
-                        debounceRealTimeCroppered();
-                    },
-                    ...props.options,
-                });
-            }
-
-            // Real-time display preview
-            function realTimeCroppered() {
-                props.realTimePreview && croppered();
-            }
-
-            // event: return base64 and width and height information after cropping
-            function croppered() {
-                if (!cropper.value) {
-                    return;
-                }
-                let imgInfo = cropper.value.getData();
-                const canvas = props.circled ? getRoundedCanvas() : cropper.value.getCroppedCanvas();
-                canvas.toBlob((blob) => {
-                    if (!blob) {
-                        return;
-                    }
-                    let fileReader: FileReader = new FileReader();
-                    fileReader.readAsDataURL(blob);
-                    fileReader.onloadend = (e) => {
-                        emit('cropend', {
-                            imgBase64: e.target?.result ?? '',
-                            imgInfo,
-                        });
-                    };
-                    fileReader.onerror = () => {
-                        emit('cropendError');
-                    };
-                }, 'image/png');
-            }
-
-            // Get a circular picture canvas
-            function getRoundedCanvas() {
-                const sourceCanvas = cropper.value!.getCroppedCanvas();
-                const canvas = document.createElement('canvas');
-                const context = canvas.getContext('2d')!;
-                const width = sourceCanvas.width;
-                const height = sourceCanvas.height;
-                canvas.width = width;
-                canvas.height = height;
-                context.imageSmoothingEnabled = true;
-                context.drawImage(sourceCanvas, 0, 0, width, height);
-                context.globalCompositeOperation = 'destination-in';
-                context.beginPath();
-                context.arc(width / 2, height / 2, Math.min(width, height) / 2, 0, 2 * Math.PI, true);
-                context.fill();
-                return canvas;
-            }
-
-            return {getClass, imgElRef, getWrapperStyle, getImageStyle, isReady, croppered};
-        },
-    });
+      return { getClass, imgElRef, getWrapperStyle, getImageStyle, isReady, croppered };
+    },
+  });
 </script>
 <style lang="less">
-    @prefix-cls: ~'@{namespace}-cropper-image';
+  @prefix-cls: ~'@{namespace}-cropper-image';
 
-    .@{prefix-cls} {
-        &--circled {
-            .cropper-view-box,
-            .cropper-face {
-                border-radius: 50%;
-            }
-        }
+  .@{prefix-cls} {
+    &--circled {
+      .cropper-view-box,
+      .cropper-face {
+        border-radius: 50%;
+      }
     }
+  }
 </style>
diff --git a/src/components/Cropper/src/CropperAvatar.vue b/src/components/Cropper/src/CropperAvatar.vue
index 047fc9b..e5d4116 100644
--- a/src/components/Cropper/src/CropperAvatar.vue
+++ b/src/components/Cropper/src/CropperAvatar.vue
@@ -2,43 +2,19 @@
   <div :class="getClass" :style="getStyle">
     <div :class="`${prefixCls}-image-wrapper`" :style="getImageWrapperStyle" @click="openModal">
       <div :class="`${prefixCls}-image-mask`" :style="getImageWrapperStyle">
-        <Icon
-                icon="ant-design:cloud-upload-outlined"
-                :size="getIconWidth"
-                :style="getImageWrapperStyle"
-                color="#d6d6d6"
-        />
+        <Icon icon="ant-design:cloud-upload-outlined" :size="getIconWidth" :style="getImageWrapperStyle" color="#d6d6d6" />
       </div>
       <img :src="sourceValue" v-if="sourceValue" alt="avatar" />
     </div>
-    <a-button
-            :class="`${prefixCls}-upload-btn`"
-            @click="openModal"
-            v-if="showBtn"
-            v-bind="btnProps"
-    >
+    <a-button :class="`${prefixCls}-upload-btn`" @click="openModal" v-if="showBtn" v-bind="btnProps">
       {{ btnText ? btnText : t('component.cropper.selectImage') }}
     </a-button>
 
-    <CopperModal
-            @register="register"
-            @uploadSuccess="handleUploadSuccess"
-            :uploadApi="uploadApi"
-            :src="sourceValue"
-    />
+    <CopperModal @register="register" @uploadSuccess="handleUploadSuccess" :uploadApi="uploadApi" :src="sourceValue" />
   </div>
 </template>
 <script lang="ts">
-  import {
-    defineComponent,
-    computed,
-    CSSProperties,
-    unref,
-    ref,
-    watchEffect,
-    watch,
-    PropType,
-  } from 'vue';
+  import { defineComponent, computed, CSSProperties, unref, ref, watchEffect, watch, PropType } from 'vue';
   import CopperModal from './CopperModal.vue';
   import { useDesign } from '/@/hooks/web/useDesign';
   import { useModal } from '/@/components/Modal';
@@ -76,22 +52,20 @@
 
       const getStyle = computed((): CSSProperties => ({ width: unref(getWidth) }));
 
-      const getImageWrapperStyle = computed(
-              (): CSSProperties => ({ width: unref(getWidth), height: unref(getWidth) })
-      );
+      const getImageWrapperStyle = computed((): CSSProperties => ({ width: unref(getWidth), height: unref(getWidth) }));
 
       watchEffect(() => {
         sourceValue.value = props.value || '';
       });
 
       watch(
-              () => sourceValue.value,
-              (v: string) => {
-                emit('update:value', v);
-              }
+        () => sourceValue.value,
+        (v: string) => {
+          emit('update:value', v);
+        }
       );
 
-      function handleUploadSuccess({ source,data }) {
+      function handleUploadSuccess({ source, data }) {
         sourceValue.value = source;
         emit('change', source, data);
         createMessage.success(t('component.cropper.uploadSuccess'));
diff --git a/src/components/Description/src/typing.ts b/src/components/Description/src/typing.ts
index d870152..897b7d2 100644
--- a/src/components/Description/src/typing.ts
+++ b/src/components/Description/src/typing.ts
@@ -12,10 +12,7 @@ export interface DescItem {
   span?: number;
   show?: (...arg: any) => boolean;
   // render
-  render?: (
-    val: any,
-    data: Recordable
-  ) => VNode | undefined | JSX.Element | Element | string | number;
+  render?: (val: any, data: Recordable) => VNode | undefined | JSX.Element | Element | string | number;
 }
 
 export interface DescriptionProps extends DescriptionsProps {
diff --git a/src/components/Drawer/src/BasicDrawer.vue b/src/components/Drawer/src/BasicDrawer.vue
index 9a057a5..155b589 100644
--- a/src/components/Drawer/src/BasicDrawer.vue
+++ b/src/components/Drawer/src/BasicDrawer.vue
@@ -1,12 +1,7 @@
 <template>
   <Drawer :class="prefixCls" @close="onClose" v-bind="getBindValues">
     <template #title v-if="!$slots.title">
-      <DrawerHeader
-              :title="getMergeProps.title"
-              :isDetail="isDetail"
-              :showDetailBack="showDetailBack"
-              @close="onClose"
-      >
+      <DrawerHeader :title="getMergeProps.title" :isDetail="isDetail" :showDetailBack="showDetailBack" @close="onClose">
         <template #titleToolbar>
           <slot name="titleToolbar"></slot>
         </template>
@@ -16,11 +11,7 @@
       <slot name="title"></slot>
     </template>
 
-    <ScrollContainer
-            :style="getScrollContentStyle"
-            v-loading="getLoading"
-            :loading-tip="loadingText || t('common.loadingText')"
-    >
+    <ScrollContainer :style="getScrollContentStyle" v-loading="getLoading" :loading-tip="loadingText || t('common.loadingText')">
       <slot></slot>
     </ScrollContainer>
     <DrawerFooter v-bind="getProps" @close="onClose" @ok="handleOk" :height="getFooterHeight">
@@ -33,16 +24,7 @@
 <script lang="ts">
   import type { DrawerInstance, DrawerProps } from './typing';
   import type { CSSProperties } from 'vue';
-  import {
-    defineComponent,
-    ref,
-    computed,
-    watch,
-    unref,
-    nextTick,
-    toRaw,
-    getCurrentInstance,
-  } from 'vue';
+  import { defineComponent, ref, computed, watch, unref, nextTick, toRaw, getCurrentInstance } from 'vue';
   import { Drawer } from 'ant-design-vue';
   import { useI18n } from '/@/hooks/web/useI18n';
   import { isFunction, isNumber } from '/@/utils/is';
@@ -115,9 +97,7 @@
       const getFooterHeight = computed(() => {
         const { footerHeight, showFooter } = unref(getProps);
         if (showFooter && footerHeight) {
-          return isNumber(footerHeight)
-                  ? `${footerHeight}px`
-                  : `${footerHeight.replace('px', '')}px`;
+          return isNumber(footerHeight) ? `${footerHeight}px` : `${footerHeight.replace('px', '')}px`;
         }
         return `0px`;
       });
@@ -135,21 +115,21 @@
       });
 
       watch(
-              () => props.visible,
-              (newVal, oldVal) => {
-                if (newVal !== oldVal) visibleRef.value = newVal;
-              },
-              { deep: true }
+        () => props.visible,
+        (newVal, oldVal) => {
+          if (newVal !== oldVal) visibleRef.value = newVal;
+        },
+        { deep: true }
       );
 
       watch(
-              () => visibleRef.value,
-              (visible) => {
-                nextTick(() => {
-                  emit('visible-change', visible);
-                  instance && drawerInstance.emitVisible?.(visible, instance.uid);
-                });
-              }
+        () => visibleRef.value,
+        (visible) => {
+          nextTick(() => {
+            emit('visible-change', visible);
+            instance && drawerInstance.emitVisible?.(visible, instance.uid);
+          });
+        }
       );
 
       // Cancel event
diff --git a/src/components/Drawer/src/components/DrawerFooter.vue b/src/components/Drawer/src/components/DrawerFooter.vue
index 903aa83..9e6d322 100644
--- a/src/components/Drawer/src/components/DrawerFooter.vue
+++ b/src/components/Drawer/src/components/DrawerFooter.vue
@@ -6,14 +6,7 @@
         {{ cancelText }}
       </a-button>
       <slot name="centerFooter"></slot>
-      <a-button
-        :type="okType"
-        @click="handleOk"
-        v-bind="okButtonProps"
-        class="mr-2"
-        :loading="confirmLoading"
-        v-if="showOkBtn"
-      >
+      <a-button :type="okType" @click="handleOk" v-bind="okButtonProps" class="mr-2" :loading="confirmLoading" v-if="showOkBtn">
         {{ okText }}
       </a-button>
       <slot name="appendFooter"></slot>
diff --git a/src/components/Drawer/src/useDrawer.ts b/src/components/Drawer/src/useDrawer.ts
index bcb9e76..2792463 100644
--- a/src/components/Drawer/src/useDrawer.ts
+++ b/src/components/Drawer/src/useDrawer.ts
@@ -1,20 +1,5 @@
-import type {
-  UseDrawerReturnType,
-  DrawerInstance,
-  ReturnMethods,
-  DrawerProps,
-  UseDrawerInnerReturnType,
-} from './typing';
-import {
-  ref,
-  getCurrentInstance,
-  unref,
-  reactive,
-  watchEffect,
-  nextTick,
-  toRaw,
-  computed,
-} from 'vue';
+import type { UseDrawerReturnType, DrawerInstance, ReturnMethods, DrawerProps, UseDrawerInnerReturnType } from './typing';
+import { ref, getCurrentInstance, unref, reactive, watchEffect, nextTick, toRaw, computed } from 'vue';
 import { isProdMode } from '/@/utils/env';
 import { isFunction } from '/@/utils/is';
 import { tryOnUnmounted } from '@vueuse/core';
diff --git a/src/components/Dropdown/src/Dropdown.vue b/src/components/Dropdown/src/Dropdown.vue
index f497080..cbf06a1 100644
--- a/src/components/Dropdown/src/Dropdown.vue
+++ b/src/components/Dropdown/src/Dropdown.vue
@@ -6,16 +6,8 @@
     <template #overlay>
       <a-menu :class="[`${prefixCls}-menu`]" :selectedKeys="selectedKeys">
         <template v-for="item in dropMenuList" :key="`${item.event}`">
-          <a-menu-item
-                  v-bind="getAttr(item.event)"
-                  @click="handleClickMenu(item)"
-                  :disabled="item.disabled"
-                  :class="[{'is-pop-confirm': item.popConfirm}]"
-          >
-            <a-popconfirm
-                    v-if="popconfirm && item.popConfirm"
-                    v-bind="getPopConfirmAttrs(item.popConfirm)"
-            >
+          <a-menu-item v-bind="getAttr(item.event)" @click="handleClickMenu(item)" :disabled="item.disabled" :class="[{ 'is-pop-confirm': item.popConfirm }]">
+            <a-popconfirm v-if="popconfirm && item.popConfirm" v-bind="getPopConfirmAttrs(item.popConfirm)">
               <template #icon v-if="item.popConfirm.icon">
                 <Icon :icon="item.popConfirm.icon" />
               </template>
@@ -43,7 +35,7 @@
   import { Icon } from '/@/components/Icon';
   import { omit } from 'lodash-es';
   import { isFunction } from '/@/utils/is';
-  import {useDesign} from '/@/hooks/web/useDesign'
+  import { useDesign } from '/@/hooks/web/useDesign';
 
   const ADropdown = Dropdown;
   const AMenu = Menu;
@@ -87,10 +79,8 @@
   const getPopConfirmAttrs = computed(() => {
     return (attrs) => {
       const originAttrs = omit(attrs, ['confirm', 'cancel', 'icon']);
-      if (!attrs.onConfirm && attrs.confirm && isFunction(attrs.confirm))
-        originAttrs['onConfirm'] = attrs.confirm;
-      if (!attrs.onCancel && attrs.cancel && isFunction(attrs.cancel))
-        originAttrs['onCancel'] = attrs.cancel;
+      if (!attrs.onConfirm && attrs.confirm && isFunction(attrs.confirm)) originAttrs['onConfirm'] = attrs.confirm;
+      if (!attrs.onCancel && attrs.cancel && isFunction(attrs.cancel)) originAttrs['onCancel'] = attrs.cancel;
       return originAttrs;
     };
   });
@@ -99,19 +89,17 @@
 </script>
 
 <style lang="less">
-@prefix-cls: ~'@{namespace}-basic-dropdown';
+  @prefix-cls: ~'@{namespace}-basic-dropdown';
 
-.@{prefix-cls} {
+  .@{prefix-cls} {
+    // update-begin--author:sunjianlei---date:20220322---for: 【VUEN-180】更多下拉菜单，只有点到字上才有效，点到空白处什么都不会发生，体验不好
+    &-menu .ant-dropdown-menu-item.is-pop-confirm {
+      padding: 0;
 
-  // update-begin--author:sunjianlei---date:20220322---for: 【VUEN-180】更多下拉菜单，只有点到字上才有效，点到空白处什么都不会发生，体验不好
-  &-menu .ant-dropdown-menu-item.is-pop-confirm {
-    padding: 0;
-
-    .dropdown-event-area {
-      padding: 5px 12px;
+      .dropdown-event-area {
+        padding: 5px 12px;
+      }
     }
+    // update-end--author:sunjianlei---date:20220322---for: 【VUEN-180】更多下拉菜单，只有点到字上才有效，点到空白处什么都不会发生，体验不好
   }
-  // update-end--author:sunjianlei---date:20220322---for: 【VUEN-180】更多下拉菜单，只有点到字上才有效，点到空白处什么都不会发生，体验不好
-
-}
-</style>
\ No newline at end of file
+</style>
diff --git a/src/components/Excel/src/Export2Excel.ts b/src/components/Excel/src/Export2Excel.ts
index 11efbe0..24acd96 100644
--- a/src/components/Excel/src/Export2Excel.ts
+++ b/src/components/Excel/src/Export2Excel.ts
@@ -6,13 +6,7 @@ const { utils, writeFile } = xlsx;
 
 const DEF_FILE_NAME = 'excel-list.xlsx';
 
-export function jsonToSheetXlsx<T = any>({
-  data,
-  header,
-  filename = DEF_FILE_NAME,
-  json2sheetOpts = {},
-  write2excelOpts = { bookType: 'xlsx' },
-}: JsonToSheet<T>) {
+export function jsonToSheetXlsx<T = any>({ data, header, filename = DEF_FILE_NAME, json2sheetOpts = {}, write2excelOpts = { bookType: 'xlsx' } }: JsonToSheet<T>) {
   const arrData = [...data];
   if (header) {
     arrData.unshift(header);
@@ -33,12 +27,7 @@ export function jsonToSheetXlsx<T = any>({
   /* at this point, out.xlsb will have been downloaded */
 }
 
-export function aoaToSheetXlsx<T = any>({
-  data,
-  header,
-  filename = DEF_FILE_NAME,
-  write2excelOpts = { bookType: 'xlsx' },
-}: AoAToSheet<T>) {
+export function aoaToSheetXlsx<T = any>({ data, header, filename = DEF_FILE_NAME, write2excelOpts = { bookType: 'xlsx' } }: AoAToSheet<T>) {
   const arrData = [...data];
   if (header) {
     arrData.unshift(header);
diff --git a/src/components/Excel/src/ExportExcelModal.vue b/src/components/Excel/src/ExportExcelModal.vue
index efa3292..d51f7c0 100644
--- a/src/components/Excel/src/ExportExcelModal.vue
+++ b/src/components/Excel/src/ExportExcelModal.vue
@@ -1,16 +1,6 @@
 <template>
-  <BasicModal
-    v-bind="$attrs"
-    :title="t('component.excel.exportModalTitle')"
-    @ok="handleOk"
-    @register="registerModal"
-  >
-    <BasicForm
-      :labelWidth="100"
-      :schemas="schemas"
-      :showActionButtonGroup="false"
-      @register="registerForm"
-    />
+  <BasicModal v-bind="$attrs" :title="t('component.excel.exportModalTitle')" @ok="handleOk" @register="registerModal">
+    <BasicForm :labelWidth="100" :schemas="schemas" :showActionButtonGroup="false" @register="registerForm" />
   </BasicModal>
 </template>
 <script lang="ts">
diff --git a/src/components/Excel/src/ImportExcel.vue b/src/components/Excel/src/ImportExcel.vue
index d89c11d..d72facd 100644
--- a/src/components/Excel/src/ImportExcel.vue
+++ b/src/components/Excel/src/ImportExcel.vue
@@ -1,12 +1,6 @@
 <template>
   <div>
-    <input
-            ref="inputRef"
-            type="file"
-            v-show="false"
-            accept=".xlsx, .xls"
-            @change="handleInputClick"
-    />
+    <input ref="inputRef" type="file" v-show="false" accept=".xlsx, .xls" @change="handleInputClick" />
     <div @click="handleUpload">
       <slot></slot>
     </div>
diff --git a/src/components/Form/index.ts b/src/components/Form/index.ts
index 315c63c..b18d36d 100644
--- a/src/components/Form/index.ts
+++ b/src/components/Form/index.ts
@@ -19,7 +19,7 @@ export { default as JCategorySelect } from './src/jeecg/components/JCategorySele
 export { default as JSelectMultiple } from './src/jeecg/components/JSelectMultiple.vue';
 export { default as JPopup } from './src/jeecg/components/JPopup.vue';
 export { default as JAreaSelect } from './src/jeecg/components/JAreaSelect.vue';
-export { JEasyCron, JEasyCronInner, JEasyCronModal } from '/@/components/Form/src/jeecg/components/JEasyCron'
+export { JEasyCron, JEasyCronInner, JEasyCronModal } from '/@/components/Form/src/jeecg/components/JEasyCron';
 export { default as JCheckbox } from './src/jeecg/components/JCheckbox.vue';
 export { default as JInput } from './src/jeecg/components/JInput.vue';
 export { default as JEllipsis } from './src/jeecg/components/JEllipsis.vue';
@@ -30,6 +30,6 @@ export { default as JSelectUserByDept } from './src/jeecg/components/JSelectUser
 export { default as JEditor } from './src/jeecg/components/JEditor.vue';
 export { default as JImageUpload } from './src/jeecg/components/JImageUpload.vue';
 // Jeecg自定义校验
-export { JCronValidator } from '/@/components/Form/src/jeecg/components/JEasyCron'
+export { JCronValidator } from '/@/components/Form/src/jeecg/components/JEasyCron';
 
 export { BasicForm };
diff --git a/src/components/Form/src/BasicForm.vue b/src/components/Form/src/BasicForm.vue
index 33c3b3c..94fc13f 100644
--- a/src/components/Form/src/BasicForm.vue
+++ b/src/components/Form/src/BasicForm.vue
@@ -1,324 +1,316 @@
 <template>
-    <Form v-bind="getBindValue" :class="getFormClass" ref="formElRef" :model="formModel" @keypress.enter="handleEnterPress">
-        <Row v-bind="getRow">
-            <slot name="formHeader"></slot>
-            <template v-for="schema in getSchema" :key="schema.field">
-                <FormItem :tableAction="tableAction" :formActionType="formActionType" :schema="schema" :formProps="getProps" :allDefaultValues="defaultValueRef" :formModel="formModel" :setFormModel="setFormModel">
-                    <template #[item]="data" v-for="item in Object.keys($slots)">
-                        <slot :name="item" v-bind="data || {}"></slot>
-                    </template>
-                </FormItem>
-            </template>
+  <Form v-bind="getBindValue" :class="getFormClass" ref="formElRef" :model="formModel" @keypress.enter="handleEnterPress">
+    <Row v-bind="getRow">
+      <slot name="formHeader"></slot>
+      <template v-for="schema in getSchema" :key="schema.field">
+        <FormItem
+          :tableAction="tableAction"
+          :formActionType="formActionType"
+          :schema="schema"
+          :formProps="getProps"
+          :allDefaultValues="defaultValueRef"
+          :formModel="formModel"
+          :setFormModel="setFormModel"
+        >
+          <template #[item]="data" v-for="item in Object.keys($slots)">
+            <slot :name="item" v-bind="data || {}"></slot>
+          </template>
+        </FormItem>
+      </template>
 
-            <FormAction v-bind="getFormActionBindProps" @toggle-advanced="handleToggleAdvanced">
-                <template #[item]="data" v-for="item in ['resetBefore', 'submitBefore', 'advanceBefore', 'advanceAfter']">
-                    <slot :name="item" v-bind="data || {}"></slot>
-                </template>
-            </FormAction>
-            <slot name="formFooter"></slot>
-        </Row>
-    </Form>
+      <FormAction v-bind="getFormActionBindProps" @toggle-advanced="handleToggleAdvanced">
+        <template #[item]="data" v-for="item in ['resetBefore', 'submitBefore', 'advanceBefore', 'advanceAfter']">
+          <slot :name="item" v-bind="data || {}"></slot>
+        </template>
+      </FormAction>
+      <slot name="formFooter"></slot>
+    </Row>
+  </Form>
 </template>
 <script lang="ts">
-    import type { FormActionType, FormProps, FormSchema } from './types/form';
-    import type { AdvanceState } from './types/hooks';
-    import type { Ref } from 'vue';
+  import type { FormActionType, FormProps, FormSchema } from './types/form';
+  import type { AdvanceState } from './types/hooks';
+  import type { Ref } from 'vue';
 
-    import { defineComponent, reactive, ref, computed, unref, onMounted, watch, nextTick } from 'vue';
-    import { Form, Row } from 'ant-design-vue';
-    import FormItem from './components/FormItem.vue';
-    import FormAction from './components/FormAction.vue';
+  import { defineComponent, reactive, ref, computed, unref, onMounted, watch, nextTick } from 'vue';
+  import { Form, Row } from 'ant-design-vue';
+  import FormItem from './components/FormItem.vue';
+  import FormAction from './components/FormAction.vue';
 
-    import { dateItemType } from './helper';
-    import { dateUtil } from '/@/utils/dateUtil';
+  import { dateItemType } from './helper';
+  import { dateUtil } from '/@/utils/dateUtil';
 
-    // import { cloneDeep } from 'lodash-es';
-    import { deepMerge } from '/@/utils';
+  // import { cloneDeep } from 'lodash-es';
+  import { deepMerge } from '/@/utils';
 
-    import { useFormValues } from './hooks/useFormValues';
-    import useAdvanced from './hooks/useAdvanced';
-    import { useFormEvents } from './hooks/useFormEvents';
-    import { createFormContext } from './hooks/useFormContext';
-    import { useAutoFocus } from './hooks/useAutoFocus';
-    import { useModalContext } from '/@/components/Modal';
+  import { useFormValues } from './hooks/useFormValues';
+  import useAdvanced from './hooks/useAdvanced';
+  import { useFormEvents } from './hooks/useFormEvents';
+  import { createFormContext } from './hooks/useFormContext';
+  import { useAutoFocus } from './hooks/useAutoFocus';
+  import { useModalContext } from '/@/components/Modal';
 
-    import { basicProps } from './props';
-    import { useDesign } from '/@/hooks/web/useDesign';
+  import { basicProps } from './props';
+  import { useDesign } from '/@/hooks/web/useDesign';
 
-    export default defineComponent({
-        name: 'BasicForm',
-        components: { FormItem, Form, Row, FormAction },
-        props: basicProps,
-        emits: ['advanced-change', 'reset', 'submit', 'register'],
-        setup(props, { emit, attrs }) {
-            const formModel = reactive<Recordable>({});
-            const modalFn = useModalContext();
+  export default defineComponent({
+    name: 'BasicForm',
+    components: { FormItem, Form, Row, FormAction },
+    props: basicProps,
+    emits: ['advanced-change', 'reset', 'submit', 'register'],
+    setup(props, { emit, attrs }) {
+      const formModel = reactive<Recordable>({});
+      const modalFn = useModalContext();
 
-            const advanceState = reactive<AdvanceState>({
-                // 默认是收起状态
-                isAdvanced: false,
-                hideAdvanceBtn: true,
-                isLoad: false,
-                actionSpan: 6,
-            });
+      const advanceState = reactive<AdvanceState>({
+        // 默认是收起状态
+        isAdvanced: false,
+        hideAdvanceBtn: true,
+        isLoad: false,
+        actionSpan: 6,
+      });
 
-            const defaultValueRef = ref<Recordable>({});
-            const isInitedDefaultRef = ref(false);
-            const propsRef = ref<Partial<FormProps>>({});
-            const schemaRef = ref<Nullable<FormSchema[]>>(null);
-            const formElRef = ref<Nullable<FormActionType>>(null);
+      const defaultValueRef = ref<Recordable>({});
+      const isInitedDefaultRef = ref(false);
+      const propsRef = ref<Partial<FormProps>>({});
+      const schemaRef = ref<Nullable<FormSchema[]>>(null);
+      const formElRef = ref<Nullable<FormActionType>>(null);
 
-            const { prefixCls } = useDesign('basic-form');
+      const { prefixCls } = useDesign('basic-form');
 
-            // Get the basic configuration of the form
-            const getProps = computed((): FormProps => {
-                return { ...props, ...unref(propsRef) } as FormProps;
-            });
+      // Get the basic configuration of the form
+      const getProps = computed((): FormProps => {
+        return { ...props, ...unref(propsRef) } as FormProps;
+      });
 
-            const getFormClass = computed(() => {
-                return [
-                    prefixCls,
-                    {
-                        [`${prefixCls}--compact`]: unref(getProps).compact,
-                    },
-                ];
-            });
+      const getFormClass = computed(() => {
+        return [
+          prefixCls,
+          {
+            [`${prefixCls}--compact`]: unref(getProps).compact,
+          },
+        ];
+      });
 
-            // Get uniform row style and Row configuration for the entire form
-            const getRow = computed((): Recordable => {
-                const { baseRowStyle = {}, rowProps } = unref(getProps);
-                return {
-                    style: baseRowStyle,
-                    ...rowProps,
-                };
-            });
+      // Get uniform row style and Row configuration for the entire form
+      const getRow = computed((): Recordable => {
+        const { baseRowStyle = {}, rowProps } = unref(getProps);
+        return {
+          style: baseRowStyle,
+          ...rowProps,
+        };
+      });
 
-            const getBindValue = computed(
-                () => ({ ...attrs, ...props, ...unref(getProps) } as Recordable)
-            );
+      const getBindValue = computed(() => ({ ...attrs, ...props, ...unref(getProps) } as Recordable));
 
-            const getSchema = computed((): FormSchema[] => {
-                const schemas: FormSchema[] = unref(schemaRef) || (unref(getProps).schemas as any);
-                for (const schema of schemas) {
-                    const { defaultValue, component } = schema;
-                    // handle date type
-                    if (defaultValue && dateItemType.includes(component)) {
-                        if (!Array.isArray(defaultValue)) {
-                            schema.defaultValue = dateUtil(defaultValue);
-                        } else {
-                            const def: moment.Moment[] = [];
-                            defaultValue.forEach((item) => {
-                                def.push(dateUtil(item));
-                            });
-                            schema.defaultValue = def;
-                        }
-                    }
-                }
-                if (unref(getProps).showAdvancedButton) {
-                    return schemas.filter((schema) => schema.component !== 'Divider') as FormSchema[];
-                } else {
-                    return schemas as FormSchema[];
-                }
-            });
-
-            const { handleToggleAdvanced } = useAdvanced({
-                advanceState,
-                emit,
-                getProps,
-                getSchema,
-                formModel,
-                defaultValueRef,
-            });
-
-            const { handleFormValues, initDefault } = useFormValues({
-                getProps,
-                defaultValueRef,
-                getSchema,
-                formModel,
-            });
-
-            useAutoFocus({
-                getSchema,
-                getProps,
-                isInitedDefault: isInitedDefaultRef,
-                formElRef: formElRef as Ref<FormActionType>,
-            });
-
-            const {
-                handleSubmit,
-                setFieldsValue,
-                clearValidate,
-                validate,
-                validateFields,
-                getFieldsValue,
-                updateSchema,
-                resetSchema,
-                appendSchemaByField,
-                removeSchemaByFiled,
-                resetFields,
-                scrollToField,
-            } = useFormEvents({
-                emit,
-                getProps,
-                formModel,
-                getSchema,
-                defaultValueRef,
-                formElRef: formElRef as Ref<FormActionType>,
-                schemaRef: schemaRef as Ref<FormSchema[]>,
-                handleFormValues,
-            });
-
-            createFormContext({
-                resetAction: resetFields,
-                submitAction: handleSubmit,
-            });
-
-            watch(
-                () => unref(getProps).model,
-                () => {
-                    const { model } = unref(getProps);
-                    if (!model) return;
-                    setFieldsValue(model);
-                },
-                {
-                    immediate: true,
-                }
-            );
-
-            watch(
-                () => unref(getProps).schemas,
-                (schemas) => {
-                    resetSchema(schemas ?? []);
-                }
-            );
-
-            watch(
-                () => getSchema.value,
-                (schema) => {
-                    nextTick(() => {
-                        //  Solve the problem of modal adaptive height calculation when the form is placed in the modal
-                        modalFn?.redoModalHeight?.();
-                    });
-                    if (unref(isInitedDefaultRef)) {
-                        return;
-                    }
-                    if (schema?.length) {
-                        initDefault();
-                        isInitedDefaultRef.value = true;
-                    }
-                }
-            );
-
-            async function setProps(formProps: Partial<FormProps>): Promise<void> {
-                propsRef.value = deepMerge(unref(propsRef) || {}, formProps);
+      const getSchema = computed((): FormSchema[] => {
+        const schemas: FormSchema[] = unref(schemaRef) || (unref(getProps).schemas as any);
+        for (const schema of schemas) {
+          const { defaultValue, component } = schema;
+          // handle date type
+          if (defaultValue && dateItemType.includes(component)) {
+            if (!Array.isArray(defaultValue)) {
+              schema.defaultValue = dateUtil(defaultValue);
+            } else {
+              const def: moment.Moment[] = [];
+              defaultValue.forEach((item) => {
+                def.push(dateUtil(item));
+              });
+              schema.defaultValue = def;
             }
+          }
+        }
+        if (unref(getProps).showAdvancedButton) {
+          return schemas.filter((schema) => schema.component !== 'Divider') as FormSchema[];
+        } else {
+          return schemas as FormSchema[];
+        }
+      });
 
-            function setFormModel(key: string, value: any) {
-                formModel[key] = value;
-                const { validateTrigger } = unref(getBindValue);
-                if (!validateTrigger || validateTrigger === 'change') {
-                    validateFields([key]).catch((_) => {});
-                }
-            }
+      const { handleToggleAdvanced } = useAdvanced({
+        advanceState,
+        emit,
+        getProps,
+        getSchema,
+        formModel,
+        defaultValueRef,
+      });
 
-            function handleEnterPress(e: KeyboardEvent) {
-                const { autoSubmitOnEnter } = unref(getProps);
-                if (!autoSubmitOnEnter) return;
-                if (e.key === 'Enter' && e.target && e.target instanceof HTMLElement) {
-                    const target: HTMLElement = e.target as HTMLElement;
-                    if (target && target.tagName && target.tagName.toUpperCase() == 'INPUT') {
-                        handleSubmit();
-                    }
-                }
-            }
+      const { handleFormValues, initDefault } = useFormValues({
+        getProps,
+        defaultValueRef,
+        getSchema,
+        formModel,
+      });
 
-            const formActionType: Partial<FormActionType> = {
-                getFieldsValue,
-                setFieldsValue,
-                resetFields,
-                updateSchema,
-                resetSchema,
-                setProps,
-                removeSchemaByFiled,
-                appendSchemaByField,
-                clearValidate,
-                validateFields,
-                validate,
-                submit: handleSubmit,
-                scrollToField: scrollToField,
-            };
+      useAutoFocus({
+        getSchema,
+        getProps,
+        isInitedDefault: isInitedDefaultRef,
+        formElRef: formElRef as Ref<FormActionType>,
+      });
 
-            onMounted(() => {
-                initDefault();
-                emit('register', formActionType);
-            });
+      const { handleSubmit, setFieldsValue, clearValidate, validate, validateFields, getFieldsValue, updateSchema, resetSchema, appendSchemaByField, removeSchemaByFiled, resetFields, scrollToField } =
+        useFormEvents({
+          emit,
+          getProps,
+          formModel,
+          getSchema,
+          defaultValueRef,
+          formElRef: formElRef as Ref<FormActionType>,
+          schemaRef: schemaRef as Ref<FormSchema[]>,
+          handleFormValues,
+        });
 
-            return {
-                getBindValue,
-                handleToggleAdvanced,
-                handleEnterPress,
-                formModel,
-                defaultValueRef,
-                advanceState,
-                getRow,
-                getProps,
-                formElRef,
-                getSchema,
-                formActionType: formActionType as any,
-                setFormModel,
-                getFormClass,
-                getFormActionBindProps: computed(
-                    (): Recordable => ({ ...getProps.value, ...advanceState })
-                ),
-                ...formActionType,
-            };
+      createFormContext({
+        resetAction: resetFields,
+        submitAction: handleSubmit,
+      });
+
+      watch(
+        () => unref(getProps).model,
+        () => {
+          const { model } = unref(getProps);
+          if (!model) return;
+          setFieldsValue(model);
         },
-    });
+        {
+          immediate: true,
+        }
+      );
+
+      watch(
+        () => unref(getProps).schemas,
+        (schemas) => {
+          resetSchema(schemas ?? []);
+        }
+      );
+
+      watch(
+        () => getSchema.value,
+        (schema) => {
+          nextTick(() => {
+            //  Solve the problem of modal adaptive height calculation when the form is placed in the modal
+            modalFn?.redoModalHeight?.();
+          });
+          if (unref(isInitedDefaultRef)) {
+            return;
+          }
+          if (schema?.length) {
+            initDefault();
+            isInitedDefaultRef.value = true;
+          }
+        }
+      );
+
+      async function setProps(formProps: Partial<FormProps>): Promise<void> {
+        propsRef.value = deepMerge(unref(propsRef) || {}, formProps);
+      }
+
+      function setFormModel(key: string, value: any) {
+        formModel[key] = value;
+        const { validateTrigger } = unref(getBindValue);
+        if (!validateTrigger || validateTrigger === 'change') {
+          validateFields([key]).catch((_) => {});
+        }
+      }
+
+      function handleEnterPress(e: KeyboardEvent) {
+        const { autoSubmitOnEnter } = unref(getProps);
+        if (!autoSubmitOnEnter) return;
+        if (e.key === 'Enter' && e.target && e.target instanceof HTMLElement) {
+          const target: HTMLElement = e.target as HTMLElement;
+          if (target && target.tagName && target.tagName.toUpperCase() == 'INPUT') {
+            handleSubmit();
+          }
+        }
+      }
+
+      const formActionType: Partial<FormActionType> = {
+        getFieldsValue,
+        setFieldsValue,
+        resetFields,
+        updateSchema,
+        resetSchema,
+        setProps,
+        removeSchemaByFiled,
+        appendSchemaByField,
+        clearValidate,
+        validateFields,
+        validate,
+        submit: handleSubmit,
+        scrollToField: scrollToField,
+      };
+
+      onMounted(() => {
+        initDefault();
+        emit('register', formActionType);
+      });
+
+      return {
+        getBindValue,
+        handleToggleAdvanced,
+        handleEnterPress,
+        formModel,
+        defaultValueRef,
+        advanceState,
+        getRow,
+        getProps,
+        formElRef,
+        getSchema,
+        formActionType: formActionType as any,
+        setFormModel,
+        getFormClass,
+        getFormActionBindProps: computed((): Recordable => ({ ...getProps.value, ...advanceState })),
+        ...formActionType,
+      };
+    },
+  });
 </script>
 <style lang="less">
-    @prefix-cls: ~'@{namespace}-basic-form';
+  @prefix-cls: ~'@{namespace}-basic-form';
 
-    .@{prefix-cls} {
-        .ant-form-item {
-            &-label label::after {
-                margin: 0 6px 0 2px;
-            }
+  .@{prefix-cls} {
+    .ant-form-item {
+      &-label label::after {
+        margin: 0 6px 0 2px;
+      }
 
-            &-with-help {
-                margin-bottom: 0;
-            }
+      &-with-help {
+        margin-bottom: 0;
+      }
 
-            &:not(.ant-form-item-with-help) {
-                margin-bottom: 20px;
-            }
+      &:not(.ant-form-item-with-help) {
+        margin-bottom: 20px;
+      }
 
-            &.suffix-item {
-                .ant-form-item-children {
-                    display: flex;
-                }
-
-                .ant-form-item-control {
-                    margin-top: 4px;
-                }
-
-                .suffix {
-                    display: inline-flex;
-                    padding-left: 6px;
-                    margin-top: 1px;
-                    line-height: 1;
-                    align-items: center;
-                }
-            }
+      &.suffix-item {
+        .ant-form-item-children {
+          display: flex;
         }
 
-        .ant-form-explain {
-            font-size: 14px;
+        .ant-form-item-control {
+          margin-top: 4px;
         }
 
-        &--compact {
-            .ant-form-item {
-                margin-bottom: 8px !important;
-            }
+        .suffix {
+          display: inline-flex;
+          padding-left: 6px;
+          margin-top: 1px;
+          line-height: 1;
+          align-items: center;
         }
+      }
     }
+
+    .ant-form-explain {
+      font-size: 14px;
+    }
+
+    &--compact {
+      .ant-form-item {
+        margin-bottom: 8px !important;
+      }
+    }
+  }
 </style>
diff --git a/src/components/Form/src/componentMap.ts b/src/components/Form/src/componentMap.ts
index a1b4294..2ee9616 100644
--- a/src/components/Form/src/componentMap.ts
+++ b/src/components/Form/src/componentMap.ts
@@ -4,22 +4,7 @@ import type { ComponentType } from './types/index';
 /**
  * Component list, register here to setting it in the form
  */
-import {
-  Input,
-  Select,
-  Radio,
-  Checkbox,
-  AutoComplete,
-  Cascader,
-  DatePicker,
-  InputNumber,
-  Switch,
-  TimePicker,
-  TreeSelect,
-  Slider,
-  Rate,
-  Divider,
-} from 'ant-design-vue';
+import { Input, Select, Radio, Checkbox, AutoComplete, Cascader, DatePicker, InputNumber, Switch, TimePicker, TreeSelect, Slider, Rate, Divider } from 'ant-design-vue';
 import ApiRadioGroup from './components/ApiRadioGroup.vue';
 import RadioButtonGroup from './components/RadioButtonGroup.vue';
 import ApiSelect from './components/ApiSelect.vue';
@@ -47,18 +32,18 @@ import JPopup from './jeecg/components/JPopup.vue';
 import JSwitch from './jeecg/components/JSwitch.vue';
 import JTreeDict from './jeecg/components/JTreeDict.vue';
 import JInputPop from './jeecg/components/JInputPop.vue';
-import { JEasyCron } from './jeecg/components/JEasyCron'
+import { JEasyCron } from './jeecg/components/JEasyCron';
 import JCheckbox from './jeecg/components/JCheckbox.vue';
 import JInput from './jeecg/components/JInput.vue';
 import JTreeSelect from './jeecg/components/JTreeSelect.vue';
 import JEllipsis from './jeecg/components/JEllipsis.vue';
 import JSelectUserByDept from './jeecg/components/JSelectUserByDept.vue';
-import JUpload from './jeecg/components/JUpload/JUpload.vue'
-import JSearchSelect from './jeecg/components/JSearchSelect.vue'
-import JAddInput from './jeecg/components/JAddInput.vue'
-import {Time} from '/@/components/Time';
-import JOnlineSelectCascade from './jeecg/components/JOnlineSelectCascade.vue'
-import JRangeNumber from './jeecg/components/JRangeNumber.vue'
+import JUpload from './jeecg/components/JUpload/JUpload.vue';
+import JSearchSelect from './jeecg/components/JSearchSelect.vue';
+import JAddInput from './jeecg/components/JAddInput.vue';
+import { Time } from '/@/components/Time';
+import JOnlineSelectCascade from './jeecg/components/JOnlineSelectCascade.vue';
+import JRangeNumber from './jeecg/components/JRangeNumber.vue';
 
 const componentMap = new Map<ComponentType, Component>();
 
@@ -125,8 +110,8 @@ componentMap.set('JSelectUserByDept', JSelectUserByDept);
 componentMap.set('JUpload', JUpload);
 componentMap.set('JSearchSelect', JSearchSelect);
 componentMap.set('JAddInput', JAddInput);
-componentMap.set('JOnlineSelectCascade', JOnlineSelectCascade)
-componentMap.set('JRangeNumber', JRangeNumber)
+componentMap.set('JOnlineSelectCascade', JOnlineSelectCascade);
+componentMap.set('JRangeNumber', JRangeNumber);
 
 export function add(compName: ComponentType, component: Component) {
   componentMap.set(compName, component);
diff --git a/src/components/Form/src/components/ApiRadioGroup.vue b/src/components/Form/src/components/ApiRadioGroup.vue
index 712cfba..b58b421 100644
--- a/src/components/Form/src/components/ApiRadioGroup.vue
+++ b/src/components/Form/src/components/ApiRadioGroup.vue
@@ -90,7 +90,7 @@
         () => {
           !unref(isFirstLoad) && fetch();
         },
-        { deep: true },
+        { deep: true }
       );
 
       async function fetch() {
diff --git a/src/components/Form/src/components/ApiSelect.vue b/src/components/Form/src/components/ApiSelect.vue
index 89f5723..fbfc0b5 100644
--- a/src/components/Form/src/components/ApiSelect.vue
+++ b/src/components/Form/src/components/ApiSelect.vue
@@ -1,144 +1,138 @@
 <template>
-    <Select
-            @dropdownVisibleChange="handleFetch"
-            v-bind="$attrs"
-            @change="handleChange"
-            :options="getOptions"
-            v-model:value="state"
-    >
-        <template #[item]="data" v-for="item in Object.keys($slots)">
-            <slot :name="item" v-bind="data || {}"></slot>
-        </template>
-        <template #suffixIcon v-if="loading">
-            <LoadingOutlined spin />
-        </template>
-        <template #notFoundContent v-if="loading">
+  <Select @dropdownVisibleChange="handleFetch" v-bind="$attrs" @change="handleChange" :options="getOptions" v-model:value="state">
+    <template #[item]="data" v-for="item in Object.keys($slots)">
+      <slot :name="item" v-bind="data || {}"></slot>
+    </template>
+    <template #suffixIcon v-if="loading">
+      <LoadingOutlined spin />
+    </template>
+    <template #notFoundContent v-if="loading">
       <span>
         <LoadingOutlined spin class="mr-1" />
         {{ t('component.form.apiSelectNotFound') }}
       </span>
-        </template>
-    </Select>
+    </template>
+  </Select>
 </template>
 <script lang="ts">
-    import { defineComponent, PropType, ref, watchEffect, computed, unref, watch } from 'vue';
-    import { Select } from 'ant-design-vue';
-    import { isFunction } from '/@/utils/is';
-    import { useRuleFormItem } from '/@/hooks/component/useFormItem';
-    import { useAttrs } from '/@/hooks/core/useAttrs';
-    import { get, omit } from 'lodash-es';
-    import { LoadingOutlined } from '@ant-design/icons-vue';
-    import { useI18n } from '/@/hooks/web/useI18n';
-    import { propTypes } from '/@/utils/propTypes';
+  import { defineComponent, PropType, ref, watchEffect, computed, unref, watch } from 'vue';
+  import { Select } from 'ant-design-vue';
+  import { isFunction } from '/@/utils/is';
+  import { useRuleFormItem } from '/@/hooks/component/useFormItem';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { get, omit } from 'lodash-es';
+  import { LoadingOutlined } from '@ant-design/icons-vue';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  import { propTypes } from '/@/utils/propTypes';
 
-    type OptionsItem = { label: string; value: string; disabled?: boolean };
+  type OptionsItem = { label: string; value: string; disabled?: boolean };
 
-    export default defineComponent({
-        name: 'ApiSelect',
-        components: {
-            Select,
-            LoadingOutlined,
-        },
-        inheritAttrs: false,
-        props: {
-            value: [Array, Object, String, Number],
-            numberToString: propTypes.bool,
-            api: {
-                type: Function as PropType<(arg?: Recordable) => Promise<OptionsItem[]>>,
-                default: null,
-            },
-            // api params
-            params: {
-                type: Object as PropType<Recordable>,
-                default: () => ({}),
-            },
-            // support xxx.xxx.xx
-            resultField: propTypes.string.def(''),
-            labelField: propTypes.string.def('label'),
-            valueField: propTypes.string.def('value'),
-            immediate: propTypes.bool.def(true),
-        },
-        emits: ['options-change', 'change'],
-        setup(props, { emit }) {
-            const options = ref<OptionsItem[]>([]);
-            const loading = ref(false);
-            const isFirstLoad = ref(true);
-            const emitData = ref<any[]>([]);
-            const attrs = useAttrs();
-            const { t } = useI18n();
+  export default defineComponent({
+    name: 'ApiSelect',
+    components: {
+      Select,
+      LoadingOutlined,
+    },
+    inheritAttrs: false,
+    props: {
+      value: [Array, Object, String, Number],
+      numberToString: propTypes.bool,
+      api: {
+        type: Function as PropType<(arg?: Recordable) => Promise<OptionsItem[]>>,
+        default: null,
+      },
+      // api params
+      params: {
+        type: Object as PropType<Recordable>,
+        default: () => ({}),
+      },
+      // support xxx.xxx.xx
+      resultField: propTypes.string.def(''),
+      labelField: propTypes.string.def('label'),
+      valueField: propTypes.string.def('value'),
+      immediate: propTypes.bool.def(true),
+    },
+    emits: ['options-change', 'change'],
+    setup(props, { emit }) {
+      const options = ref<OptionsItem[]>([]);
+      const loading = ref(false);
+      const isFirstLoad = ref(true);
+      const emitData = ref<any[]>([]);
+      const attrs = useAttrs();
+      const { t } = useI18n();
 
-            // Embedded in the form, just use the hook binding to perform form verification
-            const [state, setState] = useRuleFormItem(props, 'value', 'change', emitData);
+      // Embedded in the form, just use the hook binding to perform form verification
+      const [state, setState] = useRuleFormItem(props, 'value', 'change', emitData);
 
-            const getOptions = computed(() => {
-                const { labelField, valueField, numberToString } = props;
-                return unref(options).reduce((prev, next: Recordable) => {
-                    if (next) {
-                        const value = next[valueField];
-                        prev.push({
-                          ...omit(next, [labelField, valueField]),
-                          label: next[labelField],
-                          value: numberToString ? `${value}` : value,
-                        });
-                    }
-                    return prev;
-                }, [] as OptionsItem[]);
+      const getOptions = computed(() => {
+        const { labelField, valueField, numberToString } = props;
+        return unref(options).reduce((prev, next: Recordable) => {
+          if (next) {
+            const value = next[valueField];
+            prev.push({
+              ...omit(next, [labelField, valueField]),
+              label: next[labelField],
+              value: numberToString ? `${value}` : value,
             });
+          }
+          return prev;
+        }, [] as OptionsItem[]);
+      });
 
-            watchEffect(() => {
-                props.immediate && fetch();
-            });
+      watchEffect(() => {
+        props.immediate && fetch();
+      });
 
-            watch(
-                () => props.params,
-                () => {
-                    !unref(isFirstLoad) && fetch();
-                },
-                { deep: true }
-            );
-
-            async function fetch() {
-                const api = props.api;
-                if (!api || !isFunction(api)) return;
-                options.value = [];
-                try {
-                    loading.value = true;
-                    const res = await api(props.params);
-                    if (Array.isArray(res)) {
-                        options.value = res;
-                        emitChange();
-                        return;
-                    }
-                    if (props.resultField) {
-                        options.value = get(res, props.resultField) || [];
-                    }
-                    emitChange();
-                } catch (error) {
-                    console.warn(error);
-                } finally {
-                    loading.value = false;
-                    //--@updateBy-begin----author:liusq---date:20210914------for:判断选择模式，multiple多选情况下的value值空的情况下需要设置为数组------
-                    unref(attrs).mode == 'multiple' && !Array.isArray(unref(state)) && setState([])
-                    //--@updateBy-end----author:liusq---date:20210914------for:判断选择模式，multiple多选情况下的value值空的情况下需要设置为数组------
-                }
-            }
-
-            async function handleFetch() {
-                if (!props.immediate && unref(isFirstLoad)) {
-                    await fetch();
-                    isFirstLoad.value = false;
-                }
-            }
-
-            function emitChange() {
-                emit('options-change', unref(getOptions));
-            }
-
-            function handleChange(_, ...args) {
-                emitData.value = args;
-            }
-
-            return { state, attrs, getOptions, loading, t, handleFetch, handleChange };
+      watch(
+        () => props.params,
+        () => {
+          !unref(isFirstLoad) && fetch();
         },
-    });
+        { deep: true }
+      );
+
+      async function fetch() {
+        const api = props.api;
+        if (!api || !isFunction(api)) return;
+        options.value = [];
+        try {
+          loading.value = true;
+          const res = await api(props.params);
+          if (Array.isArray(res)) {
+            options.value = res;
+            emitChange();
+            return;
+          }
+          if (props.resultField) {
+            options.value = get(res, props.resultField) || [];
+          }
+          emitChange();
+        } catch (error) {
+          console.warn(error);
+        } finally {
+          loading.value = false;
+          //--@updateBy-begin----author:liusq---date:20210914------for:判断选择模式，multiple多选情况下的value值空的情况下需要设置为数组------
+          unref(attrs).mode == 'multiple' && !Array.isArray(unref(state)) && setState([]);
+          //--@updateBy-end----author:liusq---date:20210914------for:判断选择模式，multiple多选情况下的value值空的情况下需要设置为数组------
+        }
+      }
+
+      async function handleFetch() {
+        if (!props.immediate && unref(isFirstLoad)) {
+          await fetch();
+          isFirstLoad.value = false;
+        }
+      }
+
+      function emitChange() {
+        emit('options-change', unref(getOptions));
+      }
+
+      function handleChange(_, ...args) {
+        emitData.value = args;
+      }
+
+      return { state, attrs, getOptions, loading, t, handleFetch, handleChange };
+    },
+  });
 </script>
diff --git a/src/components/Form/src/components/ApiTreeSelect.vue b/src/components/Form/src/components/ApiTreeSelect.vue
index dc64e7d..31a1fbb 100644
--- a/src/components/Form/src/components/ApiTreeSelect.vue
+++ b/src/components/Form/src/components/ApiTreeSelect.vue
@@ -1,86 +1,86 @@
 <template>
-    <a-tree-select v-bind="getAttrs" @change="handleChange">
-        <template #[item]="data" v-for="item in Object.keys($slots)">
-            <slot :name="item" v-bind="data || {}"></slot>
-        </template>
-        <template #suffixIcon v-if="loading">
-            <LoadingOutlined spin />
-        </template>
-    </a-tree-select>
+  <a-tree-select v-bind="getAttrs" @change="handleChange">
+    <template #[item]="data" v-for="item in Object.keys($slots)">
+      <slot :name="item" v-bind="data || {}"></slot>
+    </template>
+    <template #suffixIcon v-if="loading">
+      <LoadingOutlined spin />
+    </template>
+  </a-tree-select>
 </template>
 
 <script lang="ts">
-    import { computed, defineComponent, watch, ref, onMounted, unref } from 'vue';
-    import { TreeSelect } from 'ant-design-vue';
-    import { isArray, isFunction } from '/@/utils/is';
-    import { get } from 'lodash-es';
-    import { propTypes } from '/@/utils/propTypes';
-    import { LoadingOutlined } from '@ant-design/icons-vue';
-    export default defineComponent({
-        name: 'ApiTreeSelect',
-        components: { ATreeSelect: TreeSelect, LoadingOutlined },
-        props: {
-            api: { type: Function as PropType<(arg?: Recordable) => Promise<Recordable>> },
-            params: { type: Object },
-            immediate: { type: Boolean, default: true },
-            resultField: propTypes.string.def(''),
+  import { computed, defineComponent, watch, ref, onMounted, unref } from 'vue';
+  import { TreeSelect } from 'ant-design-vue';
+  import { isArray, isFunction } from '/@/utils/is';
+  import { get } from 'lodash-es';
+  import { propTypes } from '/@/utils/propTypes';
+  import { LoadingOutlined } from '@ant-design/icons-vue';
+  export default defineComponent({
+    name: 'ApiTreeSelect',
+    components: { ATreeSelect: TreeSelect, LoadingOutlined },
+    props: {
+      api: { type: Function as PropType<(arg?: Recordable) => Promise<Recordable>> },
+      params: { type: Object },
+      immediate: { type: Boolean, default: true },
+      resultField: propTypes.string.def(''),
+    },
+    emits: ['options-change', 'change'],
+    setup(props, { attrs, emit }) {
+      const treeData = ref<Recordable[]>([]);
+      const isFirstLoaded = ref<Boolean>(false);
+      const loading = ref(false);
+      const getAttrs = computed(() => {
+        return {
+          ...(props.api ? { treeData: unref(treeData) } : {}),
+          ...attrs,
+        };
+      });
+
+      function handleChange(...args) {
+        emit('change', ...args);
+      }
+
+      watch(
+        () => props.params,
+        () => {
+          !unref(isFirstLoaded) && fetch();
         },
-        emits: ['options-change', 'change'],
-        setup(props, { attrs, emit }) {
-            const treeData = ref<Recordable[]>([]);
-            const isFirstLoaded = ref<Boolean>(false);
-            const loading = ref(false);
-            const getAttrs = computed(() => {
-                return {
-                    ...(props.api ? { treeData: unref(treeData) } : {}),
-                    ...attrs,
-                };
-            });
+        { deep: true }
+      );
 
-            function handleChange(...args) {
-                emit('change', ...args);
-            }
+      watch(
+        () => props.immediate,
+        (v) => {
+          v && !isFirstLoaded.value && fetch();
+        }
+      );
 
-            watch(
-                () => props.params,
-                () => {
-                   !unref(isFirstLoaded) && fetch();
-                },
-                { deep: true }
-            );
+      onMounted(() => {
+        props.immediate && fetch();
+      });
 
-            watch(
-                () => props.immediate,
-                (v) => {
-                    v && !isFirstLoaded.value && fetch();
-                }
-            );
-
-            onMounted(() => {
-                props.immediate && fetch();
-            });
-
-            async function fetch() {
-                const { api } = props;
-                if (!api || !isFunction(api)) return;
-                loading.value = true;
-                treeData.value = [];
-                let result;
-                try {
-                    result = await api(props.params);
-                } catch (e) {
-                    console.error(e);
-                }
-                loading.value = false;
-                if (!result) return;
-                if (!isArray(result)) {
-                    result = get(result, props.resultField);
-                }
-                treeData.value = (result as Recordable[]) || [];
-                isFirstLoaded.value = true;
-                emit('options-change', treeData.value);
-            }
-            return { getAttrs, loading, handleChange };
-        },
-    });
+      async function fetch() {
+        const { api } = props;
+        if (!api || !isFunction(api)) return;
+        loading.value = true;
+        treeData.value = [];
+        let result;
+        try {
+          result = await api(props.params);
+        } catch (e) {
+          console.error(e);
+        }
+        loading.value = false;
+        if (!result) return;
+        if (!isArray(result)) {
+          result = get(result, props.resultField);
+        }
+        treeData.value = (result as Recordable[]) || [];
+        isFirstLoaded.value = true;
+        emit('options-change', treeData.value);
+      }
+      return { getAttrs, loading, handleChange };
+    },
+  });
 </script>
diff --git a/src/components/Form/src/components/FormAction.vue b/src/components/Form/src/components/FormAction.vue
index 667a96c..20c7201 100644
--- a/src/components/Form/src/components/FormAction.vue
+++ b/src/components/Form/src/components/FormAction.vue
@@ -2,10 +2,10 @@
   <a-col v-bind="actionColOpt" v-if="showActionButtonGroup">
     <div style="width: 100%" :style="{ textAlign: actionColOpt.style.textAlign }">
       <FormItem>
-       <!-- update-begin-author:zyf   Date:20211213  for：调换按钮前后位置-->
-        <slot name="submitBefore"></slot>  
+        <!-- update-begin-author:zyf   Date:20211213  for：调换按钮前后位置-->
+        <slot name="submitBefore"></slot>
         <Button type="primary" class="mr-2" v-bind="getSubmitBtnOptions" @click="submitAction" v-if="showSubmitButton">
-            <Icon icon="ant-design:search-outlined"></Icon>
+          <Icon icon="ant-design:search-outlined"></Icon>
           {{ getSubmitBtnOptions.text }}
         </Button>
 
@@ -14,7 +14,7 @@
           <Icon icon="ic:baseline-restart-alt"></Icon>
           {{ getResetBtnOptions.text }}
         </Button>
-       <!-- update-end-author:zyf    Date:20211213  for：调换按钮前后位置-->
+        <!-- update-end-author:zyf    Date:20211213  for：调换按钮前后位置-->
 
         <slot name="advanceBefore"></slot>
         <Button type="link" size="small" @click="toggleAdvanced" v-if="showAdvancedButton && !hideAdvanceBtn">
@@ -75,9 +75,7 @@
       const actionColOpt = computed(() => {
         const { showAdvancedButton, actionSpan: span, actionColOptions } = props;
         const actionSpan = 24 - span;
-        const advancedSpanObj = showAdvancedButton
-          ? { span: actionSpan < 6 ? 24 : actionSpan }
-          : {};
+        const advancedSpanObj = showAdvancedButton ? { span: actionSpan < 6 ? 24 : actionSpan } : {};
         const actionColOpt: Partial<ColEx> = {
           style: { textAlign: 'right' },
           span: showAdvancedButton ? 6 : 4,
diff --git a/src/components/Form/src/components/FormItem.vue b/src/components/Form/src/components/FormItem.vue
index 0fecefd..b2d0307 100644
--- a/src/components/Form/src/components/FormItem.vue
+++ b/src/components/Form/src/components/FormItem.vue
@@ -1,387 +1,352 @@
 <script lang="tsx">
-    import type {PropType, Ref} from 'vue';
-    import type {FormActionType, FormProps} from '../types/form';
-    import type {FormSchema} from '../types/form';
-    import type {ValidationRule} from 'ant-design-vue/lib/form/Form';
-    import type {TableActionType} from '/@/components/Table';
-    import {defineComponent, computed, unref, toRefs} from 'vue';
-    import {Form, Col, Divider} from 'ant-design-vue';
-    import {componentMap} from '../componentMap';
-    import {BasicHelp} from '/@/components/Basic';
-    import {isBoolean, isFunction, isNull} from '/@/utils/is';
-    import {getSlot} from '/@/utils/helper/tsxHelper';
-    import {createPlaceholderMessage, setComponentRuleType} from '../helper';
-    import {upperFirst, cloneDeep} from 'lodash-es';
-    import {useItemLabelWidth} from '../hooks/useLabelWidth';
-    import {useI18n} from '/@/hooks/web/useI18n';
+  import type { PropType, Ref } from 'vue';
+  import type { FormActionType, FormProps } from '../types/form';
+  import type { FormSchema } from '../types/form';
+  import type { ValidationRule } from 'ant-design-vue/lib/form/Form';
+  import type { TableActionType } from '/@/components/Table';
+  import { defineComponent, computed, unref, toRefs } from 'vue';
+  import { Form, Col, Divider } from 'ant-design-vue';
+  import { componentMap } from '../componentMap';
+  import { BasicHelp } from '/@/components/Basic';
+  import { isBoolean, isFunction, isNull } from '/@/utils/is';
+  import { getSlot } from '/@/utils/helper/tsxHelper';
+  import { createPlaceholderMessage, setComponentRuleType } from '../helper';
+  import { upperFirst, cloneDeep } from 'lodash-es';
+  import { useItemLabelWidth } from '../hooks/useLabelWidth';
+  import { useI18n } from '/@/hooks/web/useI18n';
 
-    export default defineComponent({
-        name: 'BasicFormItem',
-        inheritAttrs: false,
-        props: {
-            schema: {
-                type: Object as PropType<FormSchema>,
-                default: () => ({}),
-            },
-            formProps: {
-                type: Object as PropType<FormProps>,
-                default: () => ({}),
-            },
-            allDefaultValues: {
-                type: Object as PropType<Recordable>,
-                default: () => ({}),
-            },
-            formModel: {
-                type: Object as PropType<Recordable>,
-                default: () => ({}),
-            },
-            setFormModel: {
-                type: Function as PropType<(key: string, value: any) => void>,
-                default: null,
-            },
-            tableAction: {
-                type: Object as PropType<TableActionType>,
-            },
-            formActionType: {
-                type: Object as PropType<FormActionType>,
-            },
-        },
-        setup(props, {slots}) {
-            const {t} = useI18n();
+  export default defineComponent({
+    name: 'BasicFormItem',
+    inheritAttrs: false,
+    props: {
+      schema: {
+        type: Object as PropType<FormSchema>,
+        default: () => ({}),
+      },
+      formProps: {
+        type: Object as PropType<FormProps>,
+        default: () => ({}),
+      },
+      allDefaultValues: {
+        type: Object as PropType<Recordable>,
+        default: () => ({}),
+      },
+      formModel: {
+        type: Object as PropType<Recordable>,
+        default: () => ({}),
+      },
+      setFormModel: {
+        type: Function as PropType<(key: string, value: any) => void>,
+        default: null,
+      },
+      tableAction: {
+        type: Object as PropType<TableActionType>,
+      },
+      formActionType: {
+        type: Object as PropType<FormActionType>,
+      },
+    },
+    setup(props, { slots }) {
+      const { t } = useI18n();
 
-            const {schema, formProps} = toRefs(props) as {
-                schema: Ref<FormSchema>;
-                formProps: Ref<FormProps>;
-            };
+      const { schema, formProps } = toRefs(props) as {
+        schema: Ref<FormSchema>;
+        formProps: Ref<FormProps>;
+      };
 
-            const itemLabelWidthProp = useItemLabelWidth(schema, formProps);
+      const itemLabelWidthProp = useItemLabelWidth(schema, formProps);
 
-            const getValues = computed(() => {
-                const {allDefaultValues, formModel, schema} = props;
-                const {mergeDynamicData} = props.formProps;
-                return {
-                    field: schema.field,
-                    model: formModel,
-                    values: {
-                        ...mergeDynamicData,
-                        ...allDefaultValues,
-                        ...formModel,
-                    } as Recordable,
-                    schema: schema,
-                };
-            });
+      const getValues = computed(() => {
+        const { allDefaultValues, formModel, schema } = props;
+        const { mergeDynamicData } = props.formProps;
+        return {
+          field: schema.field,
+          model: formModel,
+          values: {
+            ...mergeDynamicData,
+            ...allDefaultValues,
+            ...formModel,
+          } as Recordable,
+          schema: schema,
+        };
+      });
 
-            const getComponentsProps = computed(() => {
-                const {schema, tableAction, formModel, formActionType} = props;
-                let {componentProps = {}} = schema;
-                if (isFunction(componentProps)) {
-                    componentProps = componentProps({schema, tableAction, formModel, formActionType}) ?? {};
-                }
-                if (schema.component === 'Divider') {
-                    componentProps = Object.assign({type: 'horizontal'}, componentProps, {
-                        orientation: 'left',
-                        plain: true,
-                    });
-                }
-                return componentProps as Recordable;
-            });
+      const getComponentsProps = computed(() => {
+        const { schema, tableAction, formModel, formActionType } = props;
+        let { componentProps = {} } = schema;
+        if (isFunction(componentProps)) {
+          componentProps = componentProps({ schema, tableAction, formModel, formActionType }) ?? {};
+        }
+        if (schema.component === 'Divider') {
+          componentProps = Object.assign({ type: 'horizontal' }, componentProps, {
+            orientation: 'left',
+            plain: true,
+          });
+        }
+        return componentProps as Recordable;
+      });
 
-            const getDisable = computed(() => {
-                const {disabled: globDisabled} = props.formProps;
-                const {dynamicDisabled} = props.schema;
-                const {disabled: itemDisabled = false} = unref(getComponentsProps);
-                let disabled = !!globDisabled || itemDisabled;
-                if (isBoolean(dynamicDisabled)) {
-                    disabled = dynamicDisabled;
-                }
-                if (isFunction(dynamicDisabled)) {
-                    disabled = dynamicDisabled(unref(getValues));
-                }
-                return disabled;
-            });
+      const getDisable = computed(() => {
+        const { disabled: globDisabled } = props.formProps;
+        const { dynamicDisabled } = props.schema;
+        const { disabled: itemDisabled = false } = unref(getComponentsProps);
+        let disabled = !!globDisabled || itemDisabled;
+        if (isBoolean(dynamicDisabled)) {
+          disabled = dynamicDisabled;
+        }
+        if (isFunction(dynamicDisabled)) {
+          disabled = dynamicDisabled(unref(getValues));
+        }
+        return disabled;
+      });
 
-            function getShow(): { isShow: boolean; isIfShow: boolean } {
-                const {show, ifShow} = props.schema;
-                const {showAdvancedButton} = props.formProps;
-                const itemIsAdvanced = showAdvancedButton
-                    ? isBoolean(props.schema.isAdvanced)
-                        ? props.schema.isAdvanced
-                        : true
-                    : true;
+      function getShow(): { isShow: boolean; isIfShow: boolean } {
+        const { show, ifShow } = props.schema;
+        const { showAdvancedButton } = props.formProps;
+        const itemIsAdvanced = showAdvancedButton ? (isBoolean(props.schema.isAdvanced) ? props.schema.isAdvanced : true) : true;
 
-                let isShow = true;
-                let isIfShow = true;
+        let isShow = true;
+        let isIfShow = true;
 
-                if (isBoolean(show)) {
-                    isShow = show;
-                }
-                if (isBoolean(ifShow)) {
-                    isIfShow = ifShow;
-                }
-                if (isFunction(show)) {
-                    isShow = show(unref(getValues));
-                }
-                if (isFunction(ifShow)) {
-                    isIfShow = ifShow(unref(getValues));
-                }
-                isShow = isShow && itemIsAdvanced;
-                return {isShow, isIfShow};
+        if (isBoolean(show)) {
+          isShow = show;
+        }
+        if (isBoolean(ifShow)) {
+          isIfShow = ifShow;
+        }
+        if (isFunction(show)) {
+          isShow = show(unref(getValues));
+        }
+        if (isFunction(ifShow)) {
+          isIfShow = ifShow(unref(getValues));
+        }
+        isShow = isShow && itemIsAdvanced;
+        return { isShow, isIfShow };
+      }
+
+      function handleRules(): ValidationRule[] {
+        const { rules: defRules = [], component, rulesMessageJoinLabel, label, dynamicRules, required } = props.schema;
+
+        if (isFunction(dynamicRules)) {
+          return dynamicRules(unref(getValues)) as ValidationRule[];
+        }
+
+        let rules: ValidationRule[] = cloneDeep(defRules) as ValidationRule[];
+        const { rulesMessageJoinLabel: globalRulesMessageJoinLabel } = props.formProps;
+
+        const joinLabel = Reflect.has(props.schema, 'rulesMessageJoinLabel') ? rulesMessageJoinLabel : globalRulesMessageJoinLabel;
+        const defaultMsg = createPlaceholderMessage(component) + `${joinLabel ? label : ''}`;
+
+        function validator(rule: any, value: any) {
+          const msg = rule.message || defaultMsg;
+          if (value === undefined || isNull(value)) {
+            // 空值
+            return Promise.reject(msg);
+          } else if (Array.isArray(value) && value.length === 0) {
+            // 数组类型
+            return Promise.reject(msg);
+          } else if (typeof value === 'string' && value.trim() === '') {
+            // 空字符串
+            return Promise.reject(msg);
+          } else if (
+            typeof value === 'object' &&
+            Reflect.has(value, 'checked') &&
+            Reflect.has(value, 'halfChecked') &&
+            Array.isArray(value.checked) &&
+            Array.isArray(value.halfChecked) &&
+            value.checked.length === 0 &&
+            value.halfChecked.length === 0
+          ) {
+            // 非关联选择的tree组件
+            return Promise.reject(msg);
+          }
+          return Promise.resolve();
+        }
+
+        const getRequired = isFunction(required) ? required(unref(getValues)) : required;
+
+        if ((!rules || rules.length === 0) && getRequired) {
+          rules = [{ required: getRequired, validator }];
+        }
+
+        const requiredRuleIndex: number = rules.findIndex((rule) => Reflect.has(rule, 'required') && !Reflect.has(rule, 'validator'));
+
+        if (requiredRuleIndex !== -1) {
+          const rule = rules[requiredRuleIndex];
+          const { isShow } = getShow();
+          if (!isShow) {
+            rule.required = false;
+          }
+          if (component) {
+            if (!Reflect.has(rule, 'type')) {
+              rule.type = component === 'InputNumber' ? 'number' : 'string';
             }
 
-            function handleRules(): ValidationRule[] {
-                const {
-                    rules: defRules = [],
-                    component,
-                    rulesMessageJoinLabel,
-                    label,
-                    dynamicRules,
-                    required,
-                } = props.schema;
+            rule.message = rule.message || defaultMsg;
 
-                if (isFunction(dynamicRules)) {
-                    return dynamicRules(unref(getValues)) as ValidationRule[];
-                }
-
-                let rules: ValidationRule[] = cloneDeep(defRules) as ValidationRule[];
-                const {rulesMessageJoinLabel: globalRulesMessageJoinLabel} = props.formProps;
-
-                const joinLabel = Reflect.has(props.schema, 'rulesMessageJoinLabel')
-                    ? rulesMessageJoinLabel
-                    : globalRulesMessageJoinLabel;
-                const defaultMsg = createPlaceholderMessage(component) + `${joinLabel ? label : ''}`;
-
-                function validator(rule: any, value: any) {
-                    const msg = rule.message || defaultMsg;
-                    if (value === undefined || isNull(value)) {
-                        // 空值
-                        return Promise.reject(msg);
-                    } else if (Array.isArray(value) && value.length === 0) {
-                        // 数组类型
-                        return Promise.reject(msg);
-                    } else if (typeof value === 'string' && value.trim() === '') {
-                        // 空字符串
-                        return Promise.reject(msg);
-                    } else if (
-                        typeof value === 'object' &&
-                        Reflect.has(value, 'checked') &&
-                        Reflect.has(value, 'halfChecked') &&
-                        Array.isArray(value.checked) &&
-                        Array.isArray(value.halfChecked) &&
-                        value.checked.length === 0 &&
-                        value.halfChecked.length === 0
-                    ) {
-                        // 非关联选择的tree组件
-                        return Promise.reject(msg);
-                    }
-                    return Promise.resolve();
-                }
-
-                const getRequired = isFunction(required) ? required(unref(getValues)) : required;
-
-                if ((!rules || rules.length === 0) && getRequired) {
-                    rules = [{required: getRequired, validator}];
-                }
-
-                const requiredRuleIndex: number = rules.findIndex(
-                    (rule) => Reflect.has(rule, 'required') && !Reflect.has(rule, 'validator')
-                );
-
-                if (requiredRuleIndex !== -1) {
-                    const rule = rules[requiredRuleIndex];
-                    const {isShow} = getShow();
-                    if (!isShow) {
-                        rule.required = false;
-                    }
-                    if (component) {
-                        if (!Reflect.has(rule, 'type')) {
-                            rule.type = component === 'InputNumber' ? 'number' : 'string';
-                        }
-
-                        rule.message = rule.message || defaultMsg;
-
-                        if (component.includes('Input') || component.includes('Textarea')) {
-                            rule.whitespace = true;
-                        }
-                        const valueFormat = unref(getComponentsProps)?.valueFormat;
-                        setComponentRuleType(rule, component, valueFormat);
-                    }
-                }
-
-                // Maximum input length rule check
-                const characterInx = rules.findIndex((val) => val.max);
-                if (characterInx !== -1 && !rules[characterInx].validator) {
-                    rules[characterInx].message =
-                        rules[characterInx].message ||
-                        t('component.form.maxTip', [rules[characterInx].max] as Recordable);
-                }
-                return rules;
+            if (component.includes('Input') || component.includes('Textarea')) {
+              rule.whitespace = true;
             }
+            const valueFormat = unref(getComponentsProps)?.valueFormat;
+            setComponentRuleType(rule, component, valueFormat);
+          }
+        }
 
-            function renderComponent() {
-                const {
-                    renderComponentContent,
-                    component,
-                    field,
-                    changeEvent = 'change',
-                    valueField,
-                } = props.schema;
+        // Maximum input length rule check
+        const characterInx = rules.findIndex((val) => val.max);
+        if (characterInx !== -1 && !rules[characterInx].validator) {
+          rules[characterInx].message = rules[characterInx].message || t('component.form.maxTip', [rules[characterInx].max] as Recordable);
+        }
+        return rules;
+      }
 
-                const isCheck = component && ['Switch', 'Checkbox'].includes(component);
+      function renderComponent() {
+        const { renderComponentContent, component, field, changeEvent = 'change', valueField } = props.schema;
 
-                const eventKey = `on${upperFirst(changeEvent)}`;
+        const isCheck = component && ['Switch', 'Checkbox'].includes(component);
 
-                const on = {
-                    [eventKey]: (...args: Nullable<Recordable>[]) => {
-                        const [e] = args;
-                        if (propsData[eventKey]) {
-                            propsData[eventKey](...args);
-                        }
-                        const target = e ? e.target : null;
-                        const value = target ? (isCheck ? target.checked : target.value) : e;
-                        props.setFormModel(field, value);
-                    },
-                };
-                const Comp = componentMap.get(component) as ReturnType<typeof defineComponent>;
+        const eventKey = `on${upperFirst(changeEvent)}`;
 
-                const {autoSetPlaceHolder, size} = props.formProps;
-                const propsData: Recordable = {
-                    allowClear: true,
-                    getPopupContainer: (trigger: Element) => trigger.parentNode,
-                    size,
-                    ...unref(getComponentsProps),
-                    disabled: unref(getDisable),
-                };
+        const on = {
+          [eventKey]: (...args: Nullable<Recordable>[]) => {
+            const [e] = args;
+            if (propsData[eventKey]) {
+              propsData[eventKey](...args);
+            }
+            const target = e ? e.target : null;
+            const value = target ? (isCheck ? target.checked : target.value) : e;
+            props.setFormModel(field, value);
+          },
+        };
+        const Comp = componentMap.get(component) as ReturnType<typeof defineComponent>;
+
+        const { autoSetPlaceHolder, size } = props.formProps;
+        const propsData: Recordable = {
+          allowClear: true,
+          getPopupContainer: (trigger: Element) => trigger.parentNode,
+          size,
+          ...unref(getComponentsProps),
+          disabled: unref(getDisable),
+        };
 
         const isCreatePlaceholder = !propsData.disabled && autoSetPlaceHolder;
         // RangePicker place是一个数组
         if (isCreatePlaceholder && component !== 'RangePicker' && component) {
           //自动设置placeholder
-          propsData.placeholder =
-            unref(getComponentsProps)?.placeholder ||
-            createPlaceholderMessage(component) + props.schema.label;
+          propsData.placeholder = unref(getComponentsProps)?.placeholder || createPlaceholderMessage(component) + props.schema.label;
         }
         propsData.codeField = field;
         propsData.formValues = unref(getValues);
 
-                const bindValue: Recordable = {
-                    [valueField || (isCheck ? 'checked' : 'value')]: props.formModel[field],
-                };
+        const bindValue: Recordable = {
+          [valueField || (isCheck ? 'checked' : 'value')]: props.formModel[field],
+        };
 
-                const compAttr: Recordable = {
-                    ...propsData,
-                    ...on,
-                    ...bindValue,
-                };
+        const compAttr: Recordable = {
+          ...propsData,
+          ...on,
+          ...bindValue,
+        };
 
-                if (!renderComponentContent) {
-                    return <Comp {...compAttr} />;
-                }
-                const compSlot = isFunction(renderComponentContent)
-                    ? {...renderComponentContent(unref(getValues))}
-                    : {
-                        default: () => renderComponentContent,
-                    };
-                return <Comp {...compAttr}>{compSlot}</Comp>;
-            }
+        if (!renderComponentContent) {
+          return <Comp {...compAttr} />;
+        }
+        const compSlot = isFunction(renderComponentContent)
+          ? { ...renderComponentContent(unref(getValues)) }
+          : {
+              default: () => renderComponentContent,
+            };
+        return <Comp {...compAttr}>{compSlot}</Comp>;
+      }
 
-            /**
-             *渲染Label
-             * @updateBy:zyf
-             */
-            function renderLabelHelpMessage() {
-                const {label, helpMessage, helpComponentProps, subLabel} = props.schema;
-                const renderLabel = subLabel ? (
-                    <span>
+      /**
+       *渲染Label
+       * @updateBy:zyf
+       */
+      function renderLabelHelpMessage() {
+        const { label, helpMessage, helpComponentProps, subLabel } = props.schema;
+        const renderLabel = subLabel ? (
+          <span>
             {label} <span class="text-secondary">{subLabel}</span>
           </span>
-                ) : (
-                    label
-                );
-                const getHelpMessage = isFunction(helpMessage)
-                    ? helpMessage(unref(getValues))
-                    : helpMessage;
-                if (!getHelpMessage || (Array.isArray(getHelpMessage) && getHelpMessage.length === 0)) {
-                    return renderLabel;
-                }
-                return (
-                    <span>
+        ) : (
+          label
+        );
+        const getHelpMessage = isFunction(helpMessage) ? helpMessage(unref(getValues)) : helpMessage;
+        if (!getHelpMessage || (Array.isArray(getHelpMessage) && getHelpMessage.length === 0)) {
+          return renderLabel;
+        }
+        return (
+          <span>
             {renderLabel}
-                        <BasicHelp placement="top" class="mx-1" text={getHelpMessage} {...helpComponentProps} />
+            <BasicHelp placement="top" class="mx-1" text={getHelpMessage} {...helpComponentProps} />
           </span>
-                );
-            }
+        );
+      }
 
-            function renderItem() {
-                const {itemProps, slot, render, field, suffix, component} = props.schema;
-                const {labelCol, wrapperCol} = unref(itemLabelWidthProp);
-                const {colon} = props.formProps;
+      function renderItem() {
+        const { itemProps, slot, render, field, suffix, component } = props.schema;
+        const { labelCol, wrapperCol } = unref(itemLabelWidthProp);
+        const { colon } = props.formProps;
 
-                if (component === 'Divider') {
-                    return (
-                        <Col span={24}>
-                            <Divider {...unref(getComponentsProps)}>{renderLabelHelpMessage()}</Divider>
-                        </Col>
-                    );
-                } else {
-                    const getContent = () => {
-                        return slot
-                            ? getSlot(slots, slot, unref(getValues))
-                            : render
-                                ? render(unref(getValues))
-                                : renderComponent();
-                    };
+        if (component === 'Divider') {
+          return (
+            <Col span={24}>
+              <Divider {...unref(getComponentsProps)}>{renderLabelHelpMessage()}</Divider>
+            </Col>
+          );
+        } else {
+          const getContent = () => {
+            return slot ? getSlot(slots, slot, unref(getValues)) : render ? render(unref(getValues)) : renderComponent();
+          };
 
-                    const showSuffix = !!suffix;
-                    const getSuffix = isFunction(suffix) ? suffix(unref(getValues)) : suffix;
+          const showSuffix = !!suffix;
+          const getSuffix = isFunction(suffix) ? suffix(unref(getValues)) : suffix;
 
-                    return (
-                        <Form.Item
-                            name={field}
-                            colon={colon}
-                            class={{'suffix-item': showSuffix}}
-                            {...(itemProps as Recordable)}
-                            label={renderLabelHelpMessage()}
-                            rules={handleRules()}
-                            labelCol={labelCol}
-                            wrapperCol={wrapperCol}
-                        >
-                            <div style="display:flex">
-                                {/* author: sunjianlei for: 【VUEN-744】此处加上 width: 100%; 因为要防止组件宽度超出 FormItem */ }
-                                <div style="flex:1; width: 100%;">{getContent()}</div>
-                                {showSuffix && <span class="suffix">{getSuffix}</span>}
-                            </div>
-                        </Form.Item>
-                    );
-                }
-            }
+          return (
+            <Form.Item
+              name={field}
+              colon={colon}
+              class={{ 'suffix-item': showSuffix }}
+              {...(itemProps as Recordable)}
+              label={renderLabelHelpMessage()}
+              rules={handleRules()}
+              labelCol={labelCol}
+              wrapperCol={wrapperCol}
+            >
+              <div style="display:flex">
+                {/* author: sunjianlei for: 【VUEN-744】此处加上 width: 100%; 因为要防止组件宽度超出 FormItem */}
+                <div style="flex:1; width: 100%;">{getContent()}</div>
+                {showSuffix && <span class="suffix">{getSuffix}</span>}
+              </div>
+            </Form.Item>
+          );
+        }
+      }
 
-            return () => {
-                const {colProps = {}, colSlot, renderColContent, component} = props.schema;
-                if (!componentMap.has(component)) {
-                    return null;
-                }
+      return () => {
+        const { colProps = {}, colSlot, renderColContent, component } = props.schema;
+        if (!componentMap.has(component)) {
+          return null;
+        }
 
-                const {baseColProps = {}} = props.formProps;
-                const realColProps = {...baseColProps, ...colProps};
-                const {isIfShow, isShow} = getShow();
-                const values = unref(getValues);
+        const { baseColProps = {} } = props.formProps;
+        const realColProps = { ...baseColProps, ...colProps };
+        const { isIfShow, isShow } = getShow();
+        const values = unref(getValues);
 
-                const getContent = () => {
-                    return colSlot
-                        ? getSlot(slots, colSlot, values)
-                        : renderColContent
-                            ? renderColContent(values)
-                            : renderItem();
-                };
+        const getContent = () => {
+          return colSlot ? getSlot(slots, colSlot, values) : renderColContent ? renderColContent(values) : renderItem();
+        };
 
-                return (
-                    isIfShow && (
-                        <Col {...realColProps} v-show={isShow}>
-                            {getContent()}
-                        </Col>
-                    )
-                );
-            };
-        },
-    });
+        return (
+          isIfShow && (
+            <Col {...realColProps} v-show={isShow}>
+              {getContent()}
+            </Col>
+          )
+        );
+      };
+    },
+  });
 </script>
diff --git a/src/components/Form/src/helper.ts b/src/components/Form/src/helper.ts
index d56ed5c..bf4c3d0 100644
--- a/src/components/Form/src/helper.ts
+++ b/src/components/Form/src/helper.ts
@@ -16,13 +16,7 @@ export function createPlaceholderMessage(component: ComponentType) {
   if (component.includes('Picker')) {
     return t('common.chooseText');
   }
-  if (
-    component.includes('Select') ||
-    component.includes('Cascader') ||
-    component.includes('Checkbox') ||
-    component.includes('Radio') ||
-    component.includes('Switch')
-  ) {
+  if (component.includes('Select') || component.includes('Cascader') || component.includes('Checkbox') || component.includes('Radio') || component.includes('Switch')) {
     // return `请选择${label}`;
     return t('common.chooseText');
   }
@@ -35,11 +29,7 @@ function genType() {
   return [...DATE_TYPE, 'RangePicker'];
 }
 
-export function setComponentRuleType(
-  rule: ValidationRule,
-  component: ComponentType,
-  valueFormat: string
-) {
+export function setComponentRuleType(rule: ValidationRule, component: ComponentType, valueFormat: string) {
   if (['DatePicker', 'MonthPicker', 'WeekPicker', 'TimePicker'].includes(component)) {
     rule.type = valueFormat ? 'string' : 'object';
   } else if (['RangePicker', 'Upload', 'CheckboxGroup', 'TimePicker'].includes(component)) {
diff --git a/src/components/Form/src/hooks/useAdvanced.ts b/src/components/Form/src/hooks/useAdvanced.ts
index b371f57..aa565b3 100644
--- a/src/components/Form/src/hooks/useAdvanced.ts
+++ b/src/components/Form/src/hooks/useAdvanced.ts
@@ -18,14 +18,7 @@ interface UseAdvancedContext {
   defaultValueRef: Ref<Recordable>;
 }
 
-export default function ({
-                           advanceState,
-                           emit,
-                           getProps,
-                           getSchema,
-                           formModel,
-                           defaultValueRef,
-                         }: UseAdvancedContext) {
+export default function ({ advanceState, emit, getProps, getSchema, formModel, defaultValueRef }: UseAdvancedContext) {
   const { realWidthRef, screenEnum, screenRef } = useBreakpoint();
 
   const getEmptySpan = computed((): number => {
@@ -51,25 +44,20 @@ export default function ({
   const debounceUpdateAdvanced = useDebounceFn(updateAdvanced, 30);
 
   watch(
-      [() => unref(getSchema), () => advanceState.isAdvanced, () => unref(realWidthRef)],
-      () => {
-        const { showAdvancedButton } = unref(getProps);
-        if (showAdvancedButton) {
-          debounceUpdateAdvanced();
-        }
-      },
-      { immediate: true }
+    [() => unref(getSchema), () => advanceState.isAdvanced, () => unref(realWidthRef)],
+    () => {
+      const { showAdvancedButton } = unref(getProps);
+      if (showAdvancedButton) {
+        debounceUpdateAdvanced();
+      }
+    },
+    { immediate: true }
   );
 
   function getAdvanced(itemCol: Partial<ColEx>, itemColSum = 0, isLastAction = false, index = 0) {
     const width = unref(realWidthRef);
 
-    const mdWidth =
-        parseInt(itemCol.md as string) ||
-        parseInt(itemCol.xs as string) ||
-        parseInt(itemCol.sm as string) ||
-        (itemCol.span as number) ||
-        BASIC_COL_LEN;
+    const mdWidth = parseInt(itemCol.md as string) || parseInt(itemCol.xs as string) || parseInt(itemCol.sm as string) || (itemCol.span as number) || BASIC_COL_LEN;
 
     const lgWidth = parseInt(itemCol.lg as string) || mdWidth;
     const xlWidth = parseInt(itemCol.xl as string) || lgWidth;
@@ -84,7 +72,7 @@ export default function ({
       itemColSum += xxlWidth;
     }
 
-    let autoAdvancedCol = (unref(getProps).autoAdvancedCol ?? 3)
+    let autoAdvancedCol = unref(getProps).autoAdvancedCol ?? 3;
 
     if (isLastAction) {
       advanceState.hideAdvanceBtn = unref(getSchema).length <= autoAdvancedCol;
@@ -95,10 +83,7 @@ export default function ({
         advanceState.isAdvanced = true;
       } else */
       // update-end--author:sunjianlei---date:20211108---for: 注释掉该逻辑，使小于等于2行时，也显示展开收起按钮
-      if (
-          itemColSum > BASIC_COL_LEN * 2 &&
-          itemColSum <= BASIC_COL_LEN * (unref(getProps).autoAdvancedLine || 3)
-      ) {
+      if (itemColSum > BASIC_COL_LEN * 2 && itemColSum <= BASIC_COL_LEN * (unref(getProps).autoAdvancedLine || 3)) {
         advanceState.hideAdvanceBtn = false;
 
         // 默认超过 3 行折叠
@@ -107,8 +92,8 @@ export default function ({
         advanceState.isAdvanced = !advanceState.isAdvanced;
         // update-begin--author:sunjianlei---date:20211108---for: 如果总列数大于 autoAdvancedCol，就默认折叠
         if (unref(getSchema).length > autoAdvancedCol) {
-          advanceState.hideAdvanceBtn = false
-          advanceState.isAdvanced = false
+          advanceState.hideAdvanceBtn = false;
+          advanceState.isAdvanced = false;
         }
         // update-end--author:sunjianlei---date:20211108---for: 如果总列数大于 autoAdvancedCol，就默认折叠
       }
@@ -116,9 +101,9 @@ export default function ({
     }
     if (itemColSum > BASIC_COL_LEN * (unref(getProps).alwaysShowLines || 1)) {
       return { isAdvanced: advanceState.isAdvanced, itemColSum };
-    } else if (!advanceState.isAdvanced && (index + 1) > autoAdvancedCol) {
+    } else if (!advanceState.isAdvanced && index + 1 > autoAdvancedCol) {
       // 如果当前是收起状态，并且当前列下标 > autoAdvancedCol，就隐藏
-      return { isAdvanced: false, itemColSum }
+      return { isAdvanced: false, itemColSum };
     } else {
       // The first line is always displayed
       return { isAdvanced: true, itemColSum };
@@ -130,9 +115,9 @@ export default function ({
     let realItemColSum = 0;
     const { baseColProps = {} } = unref(getProps);
 
-    const schemas  = unref(getSchema)
+    const schemas = unref(getSchema);
     for (let i = 0; i < schemas.length; i++) {
-      const schema = schemas[i]
+      const schema = schemas[i];
       const { show, colProps } = schema;
       let isShow = true;
 
@@ -153,10 +138,7 @@ export default function ({
       }
 
       if (isShow && (colProps || baseColProps)) {
-        const { itemColSum: sum, isAdvanced } = getAdvanced(
-            { ...baseColProps, ...colProps },
-            itemColSum, false, i,
-        );
+        const { itemColSum: sum, isAdvanced } = getAdvanced({ ...baseColProps, ...colProps }, itemColSum, false, i);
 
         itemColSum = sum || 0;
         if (isAdvanced) {
diff --git a/src/components/Form/src/hooks/useAutoFocus.ts b/src/components/Form/src/hooks/useAutoFocus.ts
index e24dd6b..85dcc2f 100644
--- a/src/components/Form/src/hooks/useAutoFocus.ts
+++ b/src/components/Form/src/hooks/useAutoFocus.ts
@@ -9,12 +9,7 @@ interface UseAutoFocusContext {
   isInitedDefault: Ref<boolean>;
   formElRef: Ref<FormActionType>;
 }
-export async function useAutoFocus({
-  getSchema,
-  getProps,
-  formElRef,
-  isInitedDefault,
-}: UseAutoFocusContext) {
+export async function useAutoFocus({ getSchema, getProps, formElRef, isInitedDefault }: UseAutoFocusContext) {
   watchEffect(async () => {
     if (unref(isInitedDefault) || !unref(getProps).autoFocusFirstItem) {
       return;
diff --git a/src/components/Form/src/hooks/useForm.ts b/src/components/Form/src/hooks/useForm.ts
index 99db09b..e76eae3 100644
--- a/src/components/Form/src/hooks/useForm.ts
+++ b/src/components/Form/src/hooks/useForm.ts
@@ -12,101 +12,95 @@ export declare type ValidateFields = (nameList?: NamePath[]) => Promise<Recordab
 type Props = Partial<DynamicProps<FormProps>>;
 
 export function useForm(props?: Props): UseFormReturnType {
-    const formRef = ref<Nullable<FormActionType>>(null);
-    const loadedRef = ref<Nullable<boolean>>(false);
+  const formRef = ref<Nullable<FormActionType>>(null);
+  const loadedRef = ref<Nullable<boolean>>(false);
 
-    async function getForm() {
-        const form = unref(formRef);
-        if (!form) {
-            error(
-                'The form instance has not been obtained, please make sure that the form has been rendered when performing the form operation!'
-            );
-        }
-        await nextTick();
-        return form as FormActionType;
+  async function getForm() {
+    const form = unref(formRef);
+    if (!form) {
+      error('The form instance has not been obtained, please make sure that the form has been rendered when performing the form operation!');
     }
+    await nextTick();
+    return form as FormActionType;
+  }
 
-    function register(instance: FormActionType) {
-        isProdMode() &&
-        onUnmounted(() => {
-            formRef.value = null;
-            loadedRef.value = null;
-        });
-        if (unref(loadedRef) && isProdMode() && instance === unref(formRef)) return;
+  function register(instance: FormActionType) {
+    isProdMode() &&
+      onUnmounted(() => {
+        formRef.value = null;
+        loadedRef.value = null;
+      });
+    if (unref(loadedRef) && isProdMode() && instance === unref(formRef)) return;
 
-        formRef.value = instance;
-        loadedRef.value = true;
+    formRef.value = instance;
+    loadedRef.value = true;
 
-        watch(
-            () => props,
-            () => {
-                props && instance.setProps(getDynamicProps(props));
-            },
-            {
-                immediate: true,
-                deep: true,
-            }
-        );
-    }
+    watch(
+      () => props,
+      () => {
+        props && instance.setProps(getDynamicProps(props));
+      },
+      {
+        immediate: true,
+        deep: true,
+      }
+    );
+  }
 
-    const methods: FormActionType = {
-        scrollToField: async (name: NamePath, options?: ScrollOptions | undefined) => {
-            const form = await getForm();
-            form.scrollToField(name, options);
-        },
-        setProps: async (formProps: Partial<FormProps>) => {
-            const form = await getForm();
-            form.setProps(formProps);
-        },
+  const methods: FormActionType = {
+    scrollToField: async (name: NamePath, options?: ScrollOptions | undefined) => {
+      const form = await getForm();
+      form.scrollToField(name, options);
+    },
+    setProps: async (formProps: Partial<FormProps>) => {
+      const form = await getForm();
+      form.setProps(formProps);
+    },
 
-        updateSchema: async (data: Partial<FormSchema> | Partial<FormSchema>[]) => {
-            const form = await getForm();
-            form.updateSchema(data);
-        },
+    updateSchema: async (data: Partial<FormSchema> | Partial<FormSchema>[]) => {
+      const form = await getForm();
+      form.updateSchema(data);
+    },
 
-        resetSchema: async (data: Partial<FormSchema> | Partial<FormSchema>[]) => {
-            const form = await getForm();
-            form.resetSchema(data);
-        },
+    resetSchema: async (data: Partial<FormSchema> | Partial<FormSchema>[]) => {
+      const form = await getForm();
+      form.resetSchema(data);
+    },
 
-        clearValidate: async (name?: string | string[]) => {
-            const form = await getForm();
-            form.clearValidate(name);
-        },
+    clearValidate: async (name?: string | string[]) => {
+      const form = await getForm();
+      form.clearValidate(name);
+    },
 
-        resetFields: async () => {
-            getForm().then(async (form) => {
-                await form.resetFields();
-            });
-        },
+    resetFields: async () => {
+      getForm().then(async (form) => {
+        await form.resetFields();
+      });
+    },
 
-        removeSchemaByFiled: async (field: string | string[]) => {
-            unref(formRef)?.removeSchemaByFiled(field);
-        },
+    removeSchemaByFiled: async (field: string | string[]) => {
+      unref(formRef)?.removeSchemaByFiled(field);
+    },
 
-        // TODO promisify
-        getFieldsValue: <T>() => {
-            return unref(formRef)?.getFieldsValue() as T;
-        },
+    // TODO promisify
+    getFieldsValue: <T>() => {
+      return unref(formRef)?.getFieldsValue() as T;
+    },
 
-        setFieldsValue: async <T>(values: T) => {
-            const form = await getForm();
-            form.setFieldsValue<T>(values);
-        },
+    setFieldsValue: async <T>(values: T) => {
+      const form = await getForm();
+      form.setFieldsValue<T>(values);
+    },
 
-        appendSchemaByField: async (
-            schema: FormSchema,
-            prefixField: string | undefined,
-            first: boolean
-        ) => {
-            const form = await getForm();
-            form.appendSchemaByField(schema, prefixField, first);
-        },
+    appendSchemaByField: async (schema: FormSchema, prefixField: string | undefined, first: boolean) => {
+      const form = await getForm();
+      form.appendSchemaByField(schema, prefixField, first);
+    },
 
-        submit: async (): Promise<any> => {
-            const form = await getForm();
-            return form.submit();
-        },
+    submit: async (): Promise<any> => {
+      const form = await getForm();
+      return form.submit();
+    },
 
     /**
      * 表单验证并返回表单值
@@ -125,9 +119,9 @@ export function useForm(props?: Props): UseFormReturnType {
             }
           }
         }
-       //--@updateBy-begin----author:liusq---date:20210916------for:处理区域事件字典信息------
-        return handleRangeValue(props,values);
-       //--@updateBy-end----author:liusq---date:20210916------for:处理区域事件字典信息------
+        //--@updateBy-begin----author:liusq---date:20210916------for:处理区域事件字典信息------
+        return handleRangeValue(props, values);
+        //--@updateBy-end----author:liusq---date:20210916------for:处理区域事件字典信息------
       });
       return values;
     },
diff --git a/src/components/Form/src/hooks/useFormEvents.ts b/src/components/Form/src/hooks/useFormEvents.ts
index 61810c0..0b91ae9 100644
--- a/src/components/Form/src/hooks/useFormEvents.ts
+++ b/src/components/Form/src/hooks/useFormEvents.ts
@@ -10,266 +10,249 @@ import { cloneDeep, uniqBy } from 'lodash-es';
 import { error } from '/@/utils/log';
 
 interface UseFormActionContext {
-    emit: EmitType;
-    getProps: ComputedRef<FormProps>;
-    getSchema: ComputedRef<FormSchema[]>;
-    formModel: Recordable;
-    defaultValueRef: Ref<Recordable>;
-    formElRef: Ref<FormActionType>;
-    schemaRef: Ref<FormSchema[]>;
-    handleFormValues: Fn;
+  emit: EmitType;
+  getProps: ComputedRef<FormProps>;
+  getSchema: ComputedRef<FormSchema[]>;
+  formModel: Recordable;
+  defaultValueRef: Ref<Recordable>;
+  formElRef: Ref<FormActionType>;
+  schemaRef: Ref<FormSchema[]>;
+  handleFormValues: Fn;
 }
-export function useFormEvents({
-                                  emit,
-                                  getProps,
-                                  formModel,
-                                  getSchema,
-                                  defaultValueRef,
-                                  formElRef,
-                                  schemaRef,
-                                  handleFormValues,
-                              }: UseFormActionContext) {
-    async function resetFields(): Promise<void> {
-        const { resetFunc, submitOnReset } = unref(getProps);
-        resetFunc && isFunction(resetFunc) && (await resetFunc());
+export function useFormEvents({ emit, getProps, formModel, getSchema, defaultValueRef, formElRef, schemaRef, handleFormValues }: UseFormActionContext) {
+  async function resetFields(): Promise<void> {
+    const { resetFunc, submitOnReset } = unref(getProps);
+    resetFunc && isFunction(resetFunc) && (await resetFunc());
 
-        const formEl = unref(formElRef);
-        if (!formEl) return;
+    const formEl = unref(formElRef);
+    if (!formEl) return;
 
-        Object.keys(formModel).forEach((key) => {
-            formModel[key] = defaultValueRef.value[key];
-        });
-        clearValidate();
-        emit('reset', toRaw(formModel));
-        submitOnReset && handleSubmit();
-    }
+    Object.keys(formModel).forEach((key) => {
+      formModel[key] = defaultValueRef.value[key];
+    });
+    clearValidate();
+    emit('reset', toRaw(formModel));
+    submitOnReset && handleSubmit();
+  }
 
-    /**
-     * @description: Set form value
-     */
-    async function setFieldsValue(values: Recordable): Promise<void> {
-        const fields = unref(getSchema)
-            .map((item) => item.field)
-            .filter(Boolean);
+  /**
+   * @description: Set form value
+   */
+  async function setFieldsValue(values: Recordable): Promise<void> {
+    const fields = unref(getSchema)
+      .map((item) => item.field)
+      .filter(Boolean);
 
-        const validKeys: string[] = [];
-        Object.keys(values).forEach((key) => {
-            const schema = unref(getSchema).find((item) => item.field === key);
-            let value = values[key];
+    const validKeys: string[] = [];
+    Object.keys(values).forEach((key) => {
+      const schema = unref(getSchema).find((item) => item.field === key);
+      let value = values[key];
 
-            const hasKey = Reflect.has(values, key);
+      const hasKey = Reflect.has(values, key);
 
-            value = handleInputNumberValue(schema?.component, value);
-            // 0| '' is allow
-            if (hasKey && fields.includes(key)) {
-                // time type
-                if (itemIsDateType(key)) {
-                    if (Array.isArray(value)) {
-                        const arr: any[] = [];
-                        for (const ele of value) {
-                            arr.push(ele ? dateUtil(ele) : null);
-                        }
-                        formModel[key] = arr;
-                    } else {
-                        const { componentProps } = schema || {};
-                        let _props = componentProps as any;
-                        if (typeof componentProps === 'function') {
-                            _props = _props({ formModel });
-                        }
-                        formModel[key] = value ? (_props?.valueFormat ? value : dateUtil(value)) : null;
-                    }
-                } else {
-                    formModel[key] = value;
-                }
-                validKeys.push(key);
+      value = handleInputNumberValue(schema?.component, value);
+      // 0| '' is allow
+      if (hasKey && fields.includes(key)) {
+        // time type
+        if (itemIsDateType(key)) {
+          if (Array.isArray(value)) {
+            const arr: any[] = [];
+            for (const ele of value) {
+              arr.push(ele ? dateUtil(ele) : null);
             }
-        });
-        validateFields(validKeys).catch((_) => {});
-    }
-    /**
-     * @description: Delete based on field name
-     */
-    async function removeSchemaByFiled(fields: string | string[]): Promise<void> {
-        const schemaList: FormSchema[] = cloneDeep(unref(getSchema));
-        if (!fields) {
-            return;
-        }
-
-        let fieldList: string[] = isString(fields) ? [fields] : fields;
-        if (isString(fields)) {
-            fieldList = [fields];
-        }
-        for (const field of fieldList) {
-            _removeSchemaByFiled(field, schemaList);
-        }
-        schemaRef.value = schemaList;
-    }
-
-    /**
-     * @description: Delete based on field name
-     */
-    function _removeSchemaByFiled(field: string, schemaList: FormSchema[]): void {
-        if (isString(field)) {
-            const index = schemaList.findIndex((schema) => schema.field === field);
-            if (index !== -1) {
-                delete formModel[field];
-                schemaList.splice(index, 1);
+            formModel[key] = arr;
+          } else {
+            const { componentProps } = schema || {};
+            let _props = componentProps as any;
+            if (typeof componentProps === 'function') {
+              _props = _props({ formModel });
             }
+            formModel[key] = value ? (_props?.valueFormat ? value : dateUtil(value)) : null;
+          }
+        } else {
+          formModel[key] = value;
         }
+        validKeys.push(key);
+      }
+    });
+    validateFields(validKeys).catch((_) => {});
+  }
+  /**
+   * @description: Delete based on field name
+   */
+  async function removeSchemaByFiled(fields: string | string[]): Promise<void> {
+    const schemaList: FormSchema[] = cloneDeep(unref(getSchema));
+    if (!fields) {
+      return;
     }
 
-    /**
-     * @description: Insert after a certain field, if not insert the last
-     */
-    async function appendSchemaByField(schema: FormSchema, prefixField?: string, first = false) {
-        const schemaList: FormSchema[] = cloneDeep(unref(getSchema));
+    let fieldList: string[] = isString(fields) ? [fields] : fields;
+    if (isString(fields)) {
+      fieldList = [fields];
+    }
+    for (const field of fieldList) {
+      _removeSchemaByFiled(field, schemaList);
+    }
+    schemaRef.value = schemaList;
+  }
 
-        const index = schemaList.findIndex((schema) => schema.field === prefixField);
-        const hasInList = schemaList.some((item) => item.field === prefixField || schema.field);
+  /**
+   * @description: Delete based on field name
+   */
+  function _removeSchemaByFiled(field: string, schemaList: FormSchema[]): void {
+    if (isString(field)) {
+      const index = schemaList.findIndex((schema) => schema.field === field);
+      if (index !== -1) {
+        delete formModel[field];
+        schemaList.splice(index, 1);
+      }
+    }
+  }
 
-        if (!hasInList) return;
+  /**
+   * @description: Insert after a certain field, if not insert the last
+   */
+  async function appendSchemaByField(schema: FormSchema, prefixField?: string, first = false) {
+    const schemaList: FormSchema[] = cloneDeep(unref(getSchema));
 
-        if (!prefixField || index === -1 || first) {
-            first ? schemaList.unshift(schema) : schemaList.push(schema);
-            schemaRef.value = schemaList;
-            return;
-        }
-        if (index !== -1) {
-            schemaList.splice(index + 1, 0, schema);
-        }
-        schemaRef.value = schemaList;
+    const index = schemaList.findIndex((schema) => schema.field === prefixField);
+    const hasInList = schemaList.some((item) => item.field === prefixField || schema.field);
+
+    if (!hasInList) return;
+
+    if (!prefixField || index === -1 || first) {
+      first ? schemaList.unshift(schema) : schemaList.push(schema);
+      schemaRef.value = schemaList;
+      return;
+    }
+    if (index !== -1) {
+      schemaList.splice(index + 1, 0, schema);
+    }
+    schemaRef.value = schemaList;
+  }
+
+  async function resetSchema(data: Partial<FormSchema> | Partial<FormSchema>[]) {
+    let updateData: Partial<FormSchema>[] = [];
+    if (isObject(data)) {
+      updateData.push(data as FormSchema);
+    }
+    if (isArray(data)) {
+      updateData = [...data];
     }
 
-    async function resetSchema(data: Partial<FormSchema> | Partial<FormSchema>[]) {
-        let updateData: Partial<FormSchema>[] = [];
-        if (isObject(data)) {
-            updateData.push(data as FormSchema);
+    const hasField = updateData.every((item) => item.component === 'Divider' || (Reflect.has(item, 'field') && item.field));
+
+    if (!hasField) {
+      error('All children of the form Schema array that need to be updated must contain the `field` field');
+      return;
+    }
+    schemaRef.value = updateData as FormSchema[];
+  }
+
+  async function updateSchema(data: Partial<FormSchema> | Partial<FormSchema>[]) {
+    let updateData: Partial<FormSchema>[] = [];
+    if (isObject(data)) {
+      updateData.push(data as FormSchema);
+    }
+    if (isArray(data)) {
+      updateData = [...data];
+    }
+
+    const hasField = updateData.every((item) => item.component === 'Divider' || (Reflect.has(item, 'field') && item.field));
+
+    if (!hasField) {
+      error('All children of the form Schema array that need to be updated must contain the `field` field');
+      return;
+    }
+    const schema: FormSchema[] = [];
+    updateData.forEach((item) => {
+      unref(getSchema).forEach((val) => {
+        if (val.field === item.field) {
+          const newSchema = deepMerge(val, item);
+          schema.push(newSchema as FormSchema);
+        } else {
+          schema.push(val);
         }
-        if (isArray(data)) {
-            updateData = [...data];
+      });
+    });
+    schemaRef.value = uniqBy(schema, 'field');
+  }
+
+  function getFieldsValue(): Recordable {
+    const formEl = unref(formElRef);
+    if (!formEl) return {};
+    return handleFormValues(toRaw(unref(formModel)));
+  }
+
+  /**
+   * @description: Is it time
+   */
+  function itemIsDateType(key: string) {
+    return unref(getSchema).some((item) => {
+      return item.field === key ? dateItemType.includes(item.component) : false;
+    });
+  }
+
+  async function validateFields(nameList?: NamePath[] | undefined) {
+    return unref(formElRef)?.validateFields(nameList);
+  }
+
+  async function validate(nameList?: NamePath[] | undefined) {
+    return await unref(formElRef)?.validate(nameList);
+  }
+
+  async function clearValidate(name?: string | string[]) {
+    await unref(formElRef)?.clearValidate(name);
+  }
+
+  async function scrollToField(name: NamePath, options?: ScrollOptions | undefined) {
+    await unref(formElRef)?.scrollToField(name, options);
+  }
+
+  /**
+   * @description: Form submission
+   */
+  async function handleSubmit(e?: Event): Promise<void> {
+    e && e.preventDefault();
+    const { submitFunc } = unref(getProps);
+    if (submitFunc && isFunction(submitFunc)) {
+      await submitFunc();
+      return;
+    }
+    const formEl = unref(formElRef);
+    if (!formEl) return;
+    try {
+      const values = await validate();
+      //update-begin---author:zhangdaihao   Date:20140212  for：[bug号]树机构调整------------
+      //--updateBy-begin----author:zyf---date:20211206------for:对查询表单提交的数组处理成字符串------
+      for (let key in values) {
+        if (values[key] instanceof Array) {
+          let valueType = getValueType(getProps, key);
+          if (valueType === 'string') {
+            values[key] = values[key].join(',');
+          }
         }
-
-        const hasField = updateData.every(
-            (item) => item.component === 'Divider' || (Reflect.has(item, 'field') && item.field)
-        );
-
-        if (!hasField) {
-            error(
-                'All children of the form Schema array that need to be updated must contain the `field` field'
-            );
-            return;
-        }
-        schemaRef.value = updateData as FormSchema[];
+      }
+      //--updateBy-end----author:zyf---date:20211206------for:对查询表单提交的数组处理成字符串------
+      const res = handleFormValues(values);
+      emit('submit', res);
+    } catch (error) {
+      throw new Error(error);
     }
+  }
 
-    async function updateSchema(data: Partial<FormSchema> | Partial<FormSchema>[]) {
-        let updateData: Partial<FormSchema>[] = [];
-        if (isObject(data)) {
-            updateData.push(data as FormSchema);
-        }
-        if (isArray(data)) {
-            updateData = [...data];
-        }
-
-        const hasField = updateData.every(
-            (item) => item.component === 'Divider' || (Reflect.has(item, 'field') && item.field)
-        );
-
-        if (!hasField) {
-            error(
-                'All children of the form Schema array that need to be updated must contain the `field` field'
-            );
-            return;
-        }
-        const schema: FormSchema[] = [];
-        updateData.forEach((item) => {
-            unref(getSchema).forEach((val) => {
-                if (val.field === item.field) {
-                    const newSchema = deepMerge(val, item);
-                    schema.push(newSchema as FormSchema);
-                } else {
-                    schema.push(val);
-                }
-            });
-        });
-        schemaRef.value = uniqBy(schema, 'field');
-    }
-
-    function getFieldsValue(): Recordable {
-        const formEl = unref(formElRef);
-        if (!formEl) return {};
-        return handleFormValues(toRaw(unref(formModel)));
-    }
-
-    /**
-     * @description: Is it time
-     */
-    function itemIsDateType(key: string) {
-        return unref(getSchema).some((item) => {
-            return item.field === key ? dateItemType.includes(item.component) : false;
-        });
-    }
-
-    async function validateFields(nameList?: NamePath[] | undefined) {
-        return unref(formElRef)?.validateFields(nameList);
-    }
-
-    async function validate(nameList?: NamePath[] | undefined) {
-        return await unref(formElRef)?.validate(nameList);
-    }
-
-    async function clearValidate(name?: string | string[]) {
-        await unref(formElRef)?.clearValidate(name);
-    }
-
-    async function scrollToField(name: NamePath, options?: ScrollOptions | undefined) {
-        await unref(formElRef)?.scrollToField(name, options);
-    }
-
-    /**
-     * @description: Form submission
-     */
-    async function handleSubmit(e?: Event): Promise<void> {
-        e && e.preventDefault();
-        const { submitFunc } = unref(getProps);
-        if (submitFunc && isFunction(submitFunc)) {
-            await submitFunc();
-            return;
-        }
-        const formEl = unref(formElRef);
-        if (!formEl) return;
-        try {
-            const values = await validate();
-            //update-begin---author:zhangdaihao   Date:20140212  for：[bug号]树机构调整------------
-            //--updateBy-begin----author:zyf---date:20211206------for:对查询表单提交的数组处理成字符串------
-            for (let key in values) {
-              if (values[key] instanceof Array) {
-                let valueType = getValueType(getProps, key);
-                if (valueType === 'string') {
-                  values[key] = values[key].join(',');
-                }
-              }
-            }
-            //--updateBy-end----author:zyf---date:20211206------for:对查询表单提交的数组处理成字符串------
-            const res = handleFormValues(values);
-            emit('submit', res);
-        } catch (error) {
-            throw new Error(error);
-        }
-    }
-
-    return {
-        handleSubmit,
-        clearValidate,
-        validate,
-        validateFields,
-        getFieldsValue,
-        updateSchema,
-        resetSchema,
-        appendSchemaByField,
-        removeSchemaByFiled,
-        resetFields,
-        setFieldsValue,
-        scrollToField,
-    };
+  return {
+    handleSubmit,
+    clearValidate,
+    validate,
+    validateFields,
+    getFieldsValue,
+    updateSchema,
+    resetSchema,
+    appendSchemaByField,
+    removeSchemaByFiled,
+    resetFields,
+    setFieldsValue,
+    scrollToField,
+  };
 }
diff --git a/src/components/Form/src/hooks/useFormValues.ts b/src/components/Form/src/hooks/useFormValues.ts
index f16cc66..b78cbf5 100644
--- a/src/components/Form/src/hooks/useFormValues.ts
+++ b/src/components/Form/src/hooks/useFormValues.ts
@@ -12,12 +12,7 @@ interface UseFormValuesContext {
   getProps: ComputedRef<FormProps>;
   formModel: Recordable;
 }
-export function useFormValues({
-  defaultValueRef,
-  getSchema,
-  formModel,
-  getProps,
-}: UseFormValuesContext) {
+export function useFormValues({ defaultValueRef, getSchema, formModel, getProps }: UseFormValuesContext) {
   // Processing form values
   function handleFormValues(values: Recordable) {
     if (!isObject(values)) {
@@ -43,10 +38,9 @@ export function useFormValues({
       }
       set(res, key, value);
     }
-    return handleRangeValue(getProps,res);
+    return handleRangeValue(getProps, res);
   }
 
-
   function initDefault() {
     const schemas = unref(getSchema);
     const obj: Recordable = {};
diff --git a/src/components/Form/src/hooks/useLabelWidth.ts b/src/components/Form/src/hooks/useLabelWidth.ts
index 1b6af72..7fcc021 100644
--- a/src/components/Form/src/hooks/useLabelWidth.ts
+++ b/src/components/Form/src/hooks/useLabelWidth.ts
@@ -10,20 +10,16 @@ export function useItemLabelWidth(schemaItemRef: Ref<FormSchema>, propsRef: Ref<
     const { labelCol = {}, wrapperCol = {} } = schemaItem.itemProps || {};
     const { labelWidth, disabledLabelWidth } = schemaItem;
 
-    const {
-      labelWidth: globalLabelWidth,
-      labelCol: globalLabelCol,
-      wrapperCol: globWrapperCol,
-    } = unref(propsRef);
+    const { labelWidth: globalLabelWidth, labelCol: globalLabelCol, wrapperCol: globWrapperCol } = unref(propsRef);
 
     // update-begin--author:sunjianlei---date:20211104---for: 禁用全局 labelWidth，不自动设置 textAlign --------
     if (disabledLabelWidth) {
-      return { labelCol, wrapperCol }
+      return { labelCol, wrapperCol };
     }
     // update-begin--author:sunjianlei---date:20211104---for: 禁用全局 labelWidth，不自动设置 textAlign --------
 
     // If labelWidth is set globally, all items setting
-    if ((!globalLabelWidth && !labelWidth && !globalLabelCol)) {
+    if (!globalLabelWidth && !labelWidth && !globalLabelCol) {
       labelCol.style = {
         textAlign: 'left',
       };
diff --git a/src/components/Form/src/jeecg/components/JAddInput.vue b/src/components/Form/src/jeecg/components/JAddInput.vue
index 061eecb..5abb7ff 100644
--- a/src/components/Form/src/jeecg/components/JAddInput.vue
+++ b/src/components/Form/src/jeecg/components/JAddInput.vue
@@ -1,119 +1,114 @@
 <template>
-    <div v-for="(param, index) in dynamicInput.params" :key="index" style="display: flex">
-        <a-input placeholder="请输入参数key" v-model:value="param.label" style="width: 30%;margin-bottom: 5px" @input="emitChange"/>
-        <a-input placeholder="请输入参数value" v-model:value="param.value" style="width: 30%;margin: 0 0 5px 5px" @input="emitChange"/>
-        <MinusCircleOutlined
-                v-if="dynamicInput.params.length > 1"
-                class="dynamic-delete-button"
-                @click="remove(param)"
-                style="width: 50px"
-        ></MinusCircleOutlined>
-    </div>
-    <div>
-        <a-button type="dashed" style="width: 60%" @click="add">
-            <PlusOutlined/>
-            新增
-        </a-button>
-    </div>
+  <div v-for="(param, index) in dynamicInput.params" :key="index" style="display: flex">
+    <a-input placeholder="请输入参数key" v-model:value="param.label" style="width: 30%; margin-bottom: 5px" @input="emitChange" />
+    <a-input placeholder="请输入参数value" v-model:value="param.value" style="width: 30%; margin: 0 0 5px 5px" @input="emitChange" />
+    <MinusCircleOutlined v-if="dynamicInput.params.length > 1" class="dynamic-delete-button" @click="remove(param)" style="width: 50px"></MinusCircleOutlined>
+  </div>
+  <div>
+    <a-button type="dashed" style="width: 60%" @click="add">
+      <PlusOutlined />
+      新增
+    </a-button>
+  </div>
 </template>
 <script lang="ts">
-    import {MinusCircleOutlined, PlusOutlined} from '@ant-design/icons-vue';
-    import {defineComponent, reactive, ref, UnwrapRef, watchEffect} from 'vue';
-    import {propTypes} from '/@/utils/propTypes';
-    import { isEmpty } from '/@/utils/is'
-    import { tryOnMounted, tryOnUnmounted } from '@vueuse/core';
-    interface Params {
-        label: string;
-        value: string;
-    }
+  import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons-vue';
+  import { defineComponent, reactive, ref, UnwrapRef, watchEffect } from 'vue';
+  import { propTypes } from '/@/utils/propTypes';
+  import { isEmpty } from '/@/utils/is';
+  import { tryOnMounted, tryOnUnmounted } from '@vueuse/core';
+  interface Params {
+    label: string;
+    value: string;
+  }
 
-    export default defineComponent({
-        name: 'JAddInput',
-        props: {
-            value: propTypes.string.def('')
-        },
-        emits: ['change', 'update:value'],
-        setup(props, {emit}) {
-            //input动态数据
-            const dynamicInput: UnwrapRef<{ params: Params[] }> = reactive({params: []});
-            //删除Input
-            const remove = (item: Params) => {
-                let index = dynamicInput.params.indexOf(item);
-                if (index !== -1) {
-                    dynamicInput.params.splice(index, 1);
-                }
-                emitChange()
-            };
-            //新增Input
-            const add = () => {
-                dynamicInput.params.push({
-                    label: '',
-                    value: '',
-                });
-                emitChange()
-            };
+  export default defineComponent({
+    name: 'JAddInput',
+    props: {
+      value: propTypes.string.def(''),
+    },
+    emits: ['change', 'update:value'],
+    setup(props, { emit }) {
+      //input动态数据
+      const dynamicInput: UnwrapRef<{ params: Params[] }> = reactive({ params: [] });
+      //删除Input
+      const remove = (item: Params) => {
+        let index = dynamicInput.params.indexOf(item);
+        if (index !== -1) {
+          dynamicInput.params.splice(index, 1);
+        }
+        emitChange();
+      };
+      //新增Input
+      const add = () => {
+        dynamicInput.params.push({
+          label: '',
+          value: '',
+        });
+        emitChange();
+      };
 
-            //监听传入数据value
-            watchEffect(() => {
-                initVal();
-            });
+      //监听传入数据value
+      watchEffect(() => {
+        initVal();
+      });
 
-            /**
-             * 初始化数值
-             */
-            function initVal() {
-                console.log("props.value",props.value)
-                dynamicInput.params = [];
-                if(props.value && props.value.indexOf("{")==0){
-                    let jsonObj = JSON.parse(props.value);
-                    Object.keys(jsonObj).forEach((key) => {
-                        dynamicInput.params.push({label: key, value: jsonObj[key]});
-                    });
-                }
-            }
-            /**
-             * 数值改变
-             */
-            function emitChange() {
-                let obj = {};
-                if (dynamicInput.params.length > 0) {
-                    dynamicInput.params.forEach(item => {
-                       obj[item['label']] = item['value']
-                    })
-                }
-                emit("change", isEmpty(obj)?'': JSON.stringify(obj));
-                emit("update:value",isEmpty(obj)?'': JSON.stringify(obj))
-            }
-            
-            return {
-                dynamicInput,
-                emitChange,
-                remove,
-                add,
-            };
-        },
-        components: {
-            MinusCircleOutlined,
-            PlusOutlined,
-        },
-    });
+      /**
+       * 初始化数值
+       */
+      function initVal() {
+        console.log('props.value', props.value);
+        dynamicInput.params = [];
+        if (props.value && props.value.indexOf('{') == 0) {
+          let jsonObj = JSON.parse(props.value);
+          Object.keys(jsonObj).forEach((key) => {
+            dynamicInput.params.push({ label: key, value: jsonObj[key] });
+          });
+        }
+      }
+      /**
+       * 数值改变
+       */
+      function emitChange() {
+        let obj = {};
+        if (dynamicInput.params.length > 0) {
+          dynamicInput.params.forEach((item) => {
+            obj[item['label']] = item['value'];
+          });
+        }
+        emit('change', isEmpty(obj) ? '' : JSON.stringify(obj));
+        emit('update:value', isEmpty(obj) ? '' : JSON.stringify(obj));
+      }
+
+      return {
+        dynamicInput,
+        emitChange,
+        remove,
+        add,
+      };
+    },
+    components: {
+      MinusCircleOutlined,
+      PlusOutlined,
+    },
+  });
 </script>
 <style scoped>
-    .dynamic-delete-button {
-        cursor: pointer;
-        position: relative;
-        top: 4px;
-        font-size: 24px;
-        color: #999;
-        transition: all 0.3s;
-    }
+  .dynamic-delete-button {
+    cursor: pointer;
+    position: relative;
+    top: 4px;
+    font-size: 24px;
+    color: #999;
+    transition: all 0.3s;
+  }
 
-    .dynamic-delete-button:hover {
-        color: #777;
-    }
+  .dynamic-delete-button:hover {
+    color: #777;
+  }
 
-    .dynamic-delete-button[disabled] {
-        cursor: not-allowed;
-        opacity: 0.5;
-    }
+  .dynamic-delete-button[disabled] {
+    cursor: not-allowed;
+    opacity: 0.5;
+  }
 </style>
diff --git a/src/components/Form/src/jeecg/components/JAreaLinkage.vue b/src/components/Form/src/jeecg/components/JAreaLinkage.vue
index d17ef2d..48819f5 100644
--- a/src/components/Form/src/jeecg/components/JAreaLinkage.vue
+++ b/src/components/Form/src/jeecg/components/JAreaLinkage.vue
@@ -1,59 +1,56 @@
 <template>
-    <Cascader v-bind="attrs" v-model:value="state" :options="getOptions" @change="handleChange"/>
+  <Cascader v-bind="attrs" v-model:value="state" :options="getOptions" @change="handleChange" />
 </template>
 <script lang="ts">
-    import {defineComponent, PropType, ref,reactive, watchEffect, computed, unref, watch, onMounted} from 'vue';
-    import {Cascader} from 'ant-design-vue';
-    import {provinceAndCityData, regionData, provinceAndCityDataPlus, regionDataPlus} from "../../utils/areaDataUtil";
-    import {useRuleFormItem} from "/@/hooks/component/useFormItem";
-    import {propTypes} from "/@/utils/propTypes";
-    import {useAttrs} from "/@/hooks/core/useAttrs";
-    export default defineComponent({
-        name: 'JAreaLinkage',
-        components: {
-            Cascader
-        },
-        inheritAttrs: false,
-        props: {
-            value: propTypes.oneOfType([
-                propTypes.object,
-                propTypes.array
-            ]),
-            //是否显示区县
-            showArea:propTypes.bool.def(true),
-            //是否是全部
-            showAll:propTypes.bool.def(false)
-        },
-        emits: ['options-change', 'change'],
-        setup(props, {emit,refs}) {
-            const emitData = ref<any[]>([]);
-            const attrs = useAttrs();
-            const [state] = useRuleFormItem(props, 'value', 'change', emitData);
-            const getOptions = computed(() => {
-                if(props.showArea&&props.showAll){
-                    return regionDataPlus
-                }
-                if(props.showArea&&!props.showAll){
-                    return regionData
-                }
-                if(!props.showArea&&!props.showAll){
-                    return provinceAndCityData
-                }
-                if(!props.showArea&&props.showAll){
-                    return provinceAndCityDataPlus
-                }
-            });
-            function handleChange(_, ...args) {
-                emitData.value = args;
-                console.info(emitData)
-            }
-            return {
-                state,
-                attrs,
-                regionData,
-                getOptions,
-                handleChange
-            };
-        },
-    });
+  import { defineComponent, PropType, ref, reactive, watchEffect, computed, unref, watch, onMounted } from 'vue';
+  import { Cascader } from 'ant-design-vue';
+  import { provinceAndCityData, regionData, provinceAndCityDataPlus, regionDataPlus } from '../../utils/areaDataUtil';
+  import { useRuleFormItem } from '/@/hooks/component/useFormItem';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  export default defineComponent({
+    name: 'JAreaLinkage',
+    components: {
+      Cascader,
+    },
+    inheritAttrs: false,
+    props: {
+      value: propTypes.oneOfType([propTypes.object, propTypes.array]),
+      //是否显示区县
+      showArea: propTypes.bool.def(true),
+      //是否是全部
+      showAll: propTypes.bool.def(false),
+    },
+    emits: ['options-change', 'change'],
+    setup(props, { emit, refs }) {
+      const emitData = ref<any[]>([]);
+      const attrs = useAttrs();
+      const [state] = useRuleFormItem(props, 'value', 'change', emitData);
+      const getOptions = computed(() => {
+        if (props.showArea && props.showAll) {
+          return regionDataPlus;
+        }
+        if (props.showArea && !props.showAll) {
+          return regionData;
+        }
+        if (!props.showArea && !props.showAll) {
+          return provinceAndCityData;
+        }
+        if (!props.showArea && props.showAll) {
+          return provinceAndCityDataPlus;
+        }
+      });
+      function handleChange(_, ...args) {
+        emitData.value = args;
+        console.info(emitData);
+      }
+      return {
+        state,
+        attrs,
+        regionData,
+        getOptions,
+        handleChange,
+      };
+    },
+  });
 </script>
diff --git a/src/components/Form/src/jeecg/components/JAreaSelect.vue b/src/components/Form/src/jeecg/components/JAreaSelect.vue
index 500ba02..f854833 100644
--- a/src/components/Form/src/jeecg/components/JAreaSelect.vue
+++ b/src/components/Form/src/jeecg/components/JAreaSelect.vue
@@ -1,153 +1,153 @@
 <template>
-    <div class="area-select">
-        <!--省份-->
-        <a-select v-model:value="province" @change="proChange" allowClear>
-            <template v-for="item in provinceOptions" :key="`${item.value}`">
-                <a-select-option :value="item.value">{{ item.label }}</a-select-option>
-            </template>
-        </a-select>
-        <!--城市-->
-        <a-select v-if="level>=2" v-model:value="city" @change="cityChange">
-            <template v-for="item in cityOptions" :key="`${item.value}`">
-                <a-select-option :value="item.value">{{ item.label }}</a-select-option>
-            </template>
-        </a-select>
-        <!--地区-->
-        <a-select v-if="level>=3" v-model:value="area" @change="areaChange">
-            <template v-for="item in areaOptions" :key="`${item.value}`">
-                <a-select-option :value="item.value">{{ item.label }}</a-select-option>
-            </template>
-        </a-select>
-    </div>
+  <div class="area-select">
+    <!--省份-->
+    <a-select v-model:value="province" @change="proChange" allowClear>
+      <template v-for="item in provinceOptions" :key="`${item.value}`">
+        <a-select-option :value="item.value">{{ item.label }}</a-select-option>
+      </template>
+    </a-select>
+    <!--城市-->
+    <a-select v-if="level >= 2" v-model:value="city" @change="cityChange">
+      <template v-for="item in cityOptions" :key="`${item.value}`">
+        <a-select-option :value="item.value">{{ item.label }}</a-select-option>
+      </template>
+    </a-select>
+    <!--地区-->
+    <a-select v-if="level >= 3" v-model:value="area" @change="areaChange">
+      <template v-for="item in areaOptions" :key="`${item.value}`">
+        <a-select-option :value="item.value">{{ item.label }}</a-select-option>
+      </template>
+    </a-select>
+  </div>
 </template>
 <script lang="ts">
-    import {defineComponent, PropType, ref, reactive, watchEffect, computed, unref, watch, onMounted, onUnmounted, toRefs} from 'vue';
-    import {propTypes} from "/@/utils/propTypes";
-    import {useRuleFormItem} from '/@/hooks/component/useFormItem';
-    import {provinceOptions, getDataByCode, getRealCode} from "../../utils/areaDataUtil";
+  import { defineComponent, PropType, ref, reactive, watchEffect, computed, unref, watch, onMounted, onUnmounted, toRefs } from 'vue';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useRuleFormItem } from '/@/hooks/component/useFormItem';
+  import { provinceOptions, getDataByCode, getRealCode } from '../../utils/areaDataUtil';
 
-    export default defineComponent({
-        name: 'JAreaSelect',
-        props: {
-            value: [Array, String],
-            province: [String],
-            city: [String],
-            area: [String],
-            level: propTypes.number.def(3),
-        },
-        emits: ['change','update:value'],
-        setup(props, {emit, refs}) {
-            const emitData = ref<any[]>([]);
-            //下拉框的选择值
-            const pca = reactive({
-                province: '',
-                city: '',
-                area: '',
-            });
-            //表单值
-            const [state] = useRuleFormItem(props, 'value', 'change', emitData);
-            //城市下拉框的选项
-            const cityOptions = computed(() => {
-                return pca.province ? getDataByCode(pca.province) : [];
-            });
-            //地区下拉框的选项
-            const areaOptions = computed(() => {
-                return pca.city ? getDataByCode(pca.city) : [];
-            });
-            /**
-             * 监听props值
-             */
-            watchEffect(() => {
-                props && initValue();
-            });
+  export default defineComponent({
+    name: 'JAreaSelect',
+    props: {
+      value: [Array, String],
+      province: [String],
+      city: [String],
+      area: [String],
+      level: propTypes.number.def(3),
+    },
+    emits: ['change', 'update:value'],
+    setup(props, { emit, refs }) {
+      const emitData = ref<any[]>([]);
+      //下拉框的选择值
+      const pca = reactive({
+        province: '',
+        city: '',
+        area: '',
+      });
+      //表单值
+      const [state] = useRuleFormItem(props, 'value', 'change', emitData);
+      //城市下拉框的选项
+      const cityOptions = computed(() => {
+        return pca.province ? getDataByCode(pca.province) : [];
+      });
+      //地区下拉框的选项
+      const areaOptions = computed(() => {
+        return pca.city ? getDataByCode(pca.city) : [];
+      });
+      /**
+       * 监听props值
+       */
+      watchEffect(() => {
+        props && initValue();
+      });
 
-            /**
-             * 监听组件值变化
-             */
-            watch(pca, (newVal) => {
-                if(!props.value){
-                    emit("update:province",pca.province);
-                    emit("update:city",pca.city);
-                    emit("update:area",pca.area);
-                }
-            });
-            /**
-             * 数据初始化
-             */
-            function initValue() {
-                if (props.value) {
-                    //传参是数组的情况下的处理
-                    if (Array.isArray(props.value)) {
-                        pca.province = props.value[0];
-                        pca.city = props.value[1] ? props.value[1] : '';
-                        pca.area = props.value[2] ? props.value[2] : '';
-                    } else {
-                        //传参是数值
-                        let valueArr = getRealCode(props.value, props.level);
-                        if (valueArr) {
-                            pca.province = valueArr[0];
-                            pca.city = props.level >= 2 && valueArr[1] ? valueArr[1] : '';
-                            pca.area = props.level >= 3 && valueArr[2] ? valueArr[2] : '';
-                        }
-                    }
-                }else{
-                    //绑定三个数据的情况
-                    pca.province = props.province?props.province:'';
-                    pca.city = props.city?props.city:'';
-                    pca.area = props.area?props.area:'';
-                }
+      /**
+       * 监听组件值变化
+       */
+      watch(pca, (newVal) => {
+        if (!props.value) {
+          emit('update:province', pca.province);
+          emit('update:city', pca.city);
+          emit('update:area', pca.area);
+        }
+      });
+      /**
+       * 数据初始化
+       */
+      function initValue() {
+        if (props.value) {
+          //传参是数组的情况下的处理
+          if (Array.isArray(props.value)) {
+            pca.province = props.value[0];
+            pca.city = props.value[1] ? props.value[1] : '';
+            pca.area = props.value[2] ? props.value[2] : '';
+          } else {
+            //传参是数值
+            let valueArr = getRealCode(props.value, props.level);
+            if (valueArr) {
+              pca.province = valueArr[0];
+              pca.city = props.level >= 2 && valueArr[1] ? valueArr[1] : '';
+              pca.area = props.level >= 3 && valueArr[2] ? valueArr[2] : '';
             }
+          }
+        } else {
+          //绑定三个数据的情况
+          pca.province = props.province ? props.province : '';
+          pca.city = props.city ? props.city : '';
+          pca.area = props.area ? props.area : '';
+        }
+      }
 
-            /**
-             * 省份change事件
-             */
-            function proChange(val) {
-                pca.city = (val && getDataByCode(val)[0]?.value);
-                pca.area = (pca.city && getDataByCode(pca.city)[0]?.value);
-                state.value = props.level <= 1 ? val : (props.level <= 2 ? pca.city : pca.area);
-                emit("update:value",unref(state));
-            }
+      /**
+       * 省份change事件
+       */
+      function proChange(val) {
+        pca.city = val && getDataByCode(val)[0]?.value;
+        pca.area = pca.city && getDataByCode(pca.city)[0]?.value;
+        state.value = props.level <= 1 ? val : props.level <= 2 ? pca.city : pca.area;
+        emit('update:value', unref(state));
+      }
 
-            /**
-             * 城市change事件
-             */
-            function cityChange(val) {
-                pca.area = (val && getDataByCode(val)[0]?.value);
-                state.value = props.level <= 2 ? val : pca.area;
-                emit("update:value",unref(state));
-            }
+      /**
+       * 城市change事件
+       */
+      function cityChange(val) {
+        pca.area = val && getDataByCode(val)[0]?.value;
+        state.value = props.level <= 2 ? val : pca.area;
+        emit('update:value', unref(state));
+      }
 
-            /**
-             * 区域change事件
-             */
-            function areaChange(val) {
-                state.value = val;
-                emit("update:value",unref(state));
-            }
+      /**
+       * 区域change事件
+       */
+      function areaChange(val) {
+        state.value = val;
+        emit('update:value', unref(state));
+      }
 
-            return {
-                ...toRefs(pca),
-                provinceOptions,
-                cityOptions,
-                areaOptions,
-                proChange,
-                cityChange,
-                areaChange
-            };
-        },
-    });
+      return {
+        ...toRefs(pca),
+        provinceOptions,
+        cityOptions,
+        areaOptions,
+        proChange,
+        cityChange,
+        areaChange,
+      };
+    },
+  });
 </script>
 <style lang="less" scoped>
-    .area-select {
-        width: 100%;
-        display: flex;
+  .area-select {
+    width: 100%;
+    display: flex;
 
-        .ant-select{
-            width: 33.3%;
-        }
-        
-        .ant-select:not(:first-child) {
-            margin-left: 10px;
-        }
+    .ant-select {
+      width: 33.3%;
     }
+
+    .ant-select:not(:first-child) {
+      margin-left: 10px;
+    }
+  }
 </style>
diff --git a/src/components/Form/src/jeecg/components/JCategorySelect.vue b/src/components/Form/src/jeecg/components/JCategorySelect.vue
index ae1b365..7eb04ae 100644
--- a/src/components/Form/src/jeecg/components/JCategorySelect.vue
+++ b/src/components/Form/src/jeecg/components/JCategorySelect.vue
@@ -1,18 +1,19 @@
 <!--下拉树-->
 <template>
-    <a-tree-select
-            allowClear
-            labelInValue
-            style="width: 100%"
-            :disabled="disabled"
-            :dropdownStyle="{ maxHeight: '400px', overflow: 'auto' }"
-            :placeholder="placeholder"
-            :loadData="asyncLoadTreeData"
-            :value="treeValue"
-            :treeData="treeData"
-            :multiple="multiple"
-            @change="onChange">
-    </a-tree-select>
+  <a-tree-select
+    allowClear
+    labelInValue
+    style="width: 100%"
+    :disabled="disabled"
+    :dropdownStyle="{ maxHeight: '400px', overflow: 'auto' }"
+    :placeholder="placeholder"
+    :loadData="asyncLoadTreeData"
+    :value="treeValue"
+    :treeData="treeData"
+    :multiple="multiple"
+    @change="onChange"
+  >
+  </a-tree-select>
 </template>
 <script lang="ts">
   import { defineComponent, ref, unref, watch } from 'vue';
@@ -28,10 +29,7 @@
     components: {},
     inheritAttrs: false,
     props: {
-      value: propTypes.oneOfType([
-        propTypes.string,
-        propTypes.array,
-      ]),
+      value: propTypes.oneOfType([propTypes.string, propTypes.array]),
       placeholder: {
         type: String,
         default: '请选择',
@@ -49,7 +47,7 @@
       },
       // 是否支持多选
       multiple: {
-        type: [Boolean,String],
+        type: [Boolean, String],
         default: false,
       },
       loadTriggleChange: {
@@ -86,14 +84,14 @@
         () => {
           loadItemByCode();
         },
-        { deep: true },
+        { deep: true }
       );
       watch(
         () => props.pcode,
         () => {
           loadRoot();
         },
-        { deep: true, immediate: true },
+        { deep: true, immediate: true }
       );
 
       function loadRoot() {
@@ -103,7 +101,7 @@
           condition: props.condition,
         };
         console.info(param);
-        loadTreeData(param).then(res => {
+        loadTreeData(param).then((res) => {
           for (let i of res) {
             i.value = i.key;
             if (i.leaf == false) {
@@ -114,15 +112,13 @@
           }
           treeData.value = res;
         });
-
       }
 
-
       function loadItemByCode() {
         if (!props.value || props.value == '0') {
           treeValue.value = [];
         } else {
-          loadDictItem({ ids: props.value }).then(res => {
+          loadDictItem({ ids: props.value }).then((res) => {
             let values = props.value.split(',');
             treeValue.value = res.map((item, index) => ({
               key: values[index],
@@ -139,7 +135,6 @@
         if (!props.multiple && props.loadTriggleChange) {
           backValue(props.value, text);
         }
-
       }
 
       function backValue(value, label) {
@@ -163,7 +158,7 @@
             pid: pid,
             condition: props.condition,
           };
-          loadTreeData(param).then(res => {
+          loadTreeData(param).then((res) => {
             if (res) {
               for (let i of res) {
                 i.value = i.key;
@@ -204,7 +199,7 @@
           treeValue.value = '';
         } else if (Array.isArray(value)) {
           let labels = [];
-          let values = value.map(item => {
+          let values = value.map((item) => {
             labels.push(item.label);
             return item.value;
           });
@@ -251,6 +246,5 @@
         asyncLoadTreeData,
       };
     },
-  })
-  ;
+  });
 </script>
diff --git a/src/components/Form/src/jeecg/components/JCheckbox.vue b/src/components/Form/src/jeecg/components/JCheckbox.vue
index dfaffcc..bb34fc4 100644
--- a/src/components/Form/src/jeecg/components/JCheckbox.vue
+++ b/src/components/Form/src/jeecg/components/JCheckbox.vue
@@ -1,83 +1,83 @@
 <template>
-    <a-checkbox-group v-bind="attrs" v-model:value="checkboxArray" :options="checkOptions" @change="handleChange"></a-checkbox-group>
+  <a-checkbox-group v-bind="attrs" v-model:value="checkboxArray" :options="checkOptions" @change="handleChange"></a-checkbox-group>
 </template>
 
 <script lang="ts">
-    import {defineComponent, computed, watch, watchEffect, ref, unref} from 'vue';
-    import {propTypes} from "/@/utils/propTypes";
-    import {useAttrs} from '/@/hooks/core/useAttrs';
-    import {initDictOptions} from "/@/utils/dict/index"
+  import { defineComponent, computed, watch, watchEffect, ref, unref } from 'vue';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { initDictOptions } from '/@/utils/dict/index';
 
-    export default defineComponent({
-        name: 'JCheckbox',
-        props: {
-            value: propTypes.string,
-            dictCode: propTypes.string,
-            options: {
-                type: Array,
-                default: () => [],
-            },
-        },
-        emits: ['change', 'update:value'],
-        setup(props, {emit}) {
-            const attrs = useAttrs();
-            //checkbox选项
-            const checkOptions = ref<any[]>([]);
-            //checkbox数值
-            const checkboxArray = ref<any[]>([]);
-            /**
-             * 监听value
-             */
-            watchEffect(() => {
-                props.value && (checkboxArray.value = props.value ? props.value.split(",") : []);
-                //update-begin-author:taoyan date:20220401 for: 调用表单的 resetFields不会清空当前信息，界面显示上一次的数据
-                if(props.value === '' || props.value === undefined){
-                  checkboxArray.value = []
-                }
-                //update-end-author:taoyan date:20220401 for: 调用表单的 resetFields不会清空当前信息，界面显示上一次的数据
-            });
-            /**
-             * 监听字典code
-             */
-            watchEffect(() => {
-                props && initOptions();
-            });
+  export default defineComponent({
+    name: 'JCheckbox',
+    props: {
+      value: propTypes.string,
+      dictCode: propTypes.string,
+      options: {
+        type: Array,
+        default: () => [],
+      },
+    },
+    emits: ['change', 'update:value'],
+    setup(props, { emit }) {
+      const attrs = useAttrs();
+      //checkbox选项
+      const checkOptions = ref<any[]>([]);
+      //checkbox数值
+      const checkboxArray = ref<any[]>([]);
+      /**
+       * 监听value
+       */
+      watchEffect(() => {
+        props.value && (checkboxArray.value = props.value ? props.value.split(',') : []);
+        //update-begin-author:taoyan date:20220401 for: 调用表单的 resetFields不会清空当前信息，界面显示上一次的数据
+        if (props.value === '' || props.value === undefined) {
+          checkboxArray.value = [];
+        }
+        //update-end-author:taoyan date:20220401 for: 调用表单的 resetFields不会清空当前信息，界面显示上一次的数据
+      });
+      /**
+       * 监听字典code
+       */
+      watchEffect(() => {
+        props && initOptions();
+      });
 
-            /**
-             * 初始化选项
-             */
-            async function initOptions() {
-                //根据options, 初始化选项
-                if (props.options && props.options.length > 0) {
-                    checkOptions.value = props.options;
-                    return;
-                }
-                //根据字典Code, 初始化选项
-                if(props.dictCode){
-                    const dictData = await initDictOptions(props.dictCode);
-                    checkOptions.value = dictData.reduce((prev, next) => {
-                        if (next) {
-                            const value = next['value'];
-                            prev.push({
-                                label: next['text'],
-                                value: value,
-                            });
-                        }
-                        return prev;
-                    }, []);
-                }
+      /**
+       * 初始化选项
+       */
+      async function initOptions() {
+        //根据options, 初始化选项
+        if (props.options && props.options.length > 0) {
+          checkOptions.value = props.options;
+          return;
+        }
+        //根据字典Code, 初始化选项
+        if (props.dictCode) {
+          const dictData = await initDictOptions(props.dictCode);
+          checkOptions.value = dictData.reduce((prev, next) => {
+            if (next) {
+              const value = next['value'];
+              prev.push({
+                label: next['text'],
+                value: value,
+              });
             }
+            return prev;
+          }, []);
+        }
+      }
 
-            /**
-             * change事件
-             * @param $event
-             */
-            function handleChange($event) {
-                emit('update:value', $event.join(','));
-                emit('change', $event.join(','));
-            }
+      /**
+       * change事件
+       * @param $event
+       */
+      function handleChange($event) {
+        emit('update:value', $event.join(','));
+        emit('change', $event.join(','));
+      }
 
-            return {checkboxArray, checkOptions, attrs, handleChange};
-        },
-    });
+      return { checkboxArray, checkOptions, attrs, handleChange };
+    },
+  });
 </script>
diff --git a/src/components/Form/src/jeecg/components/JCodeEditor.vue b/src/components/Form/src/jeecg/components/JCodeEditor.vue
index 407be9e..342c8ff 100644
--- a/src/components/Form/src/jeecg/components/JCodeEditor.vue
+++ b/src/components/Form/src/jeecg/components/JCodeEditor.vue
@@ -1,17 +1,17 @@
 <template>
-    <div v-bind="boxBindProps">
-        <!-- 全屏按钮 -->
-        <a-icon v-if="fullScreen" class="full-screen-icon" :type="fullScreenIcon" @click="onToggleFullScreen"/>
-        <textarea ref="textarea" v-bind="getBindValue"></textarea>
-    </div>
+  <div v-bind="boxBindProps">
+    <!-- 全屏按钮 -->
+    <a-icon v-if="fullScreen" class="full-screen-icon" :type="fullScreenIcon" @click="onToggleFullScreen" />
+    <textarea ref="textarea" v-bind="getBindValue"></textarea>
+  </div>
 </template>
 
 <script lang="ts">
-  import {defineComponent, onMounted, reactive, ref, watch, unref, computed} from 'vue';
+  import { defineComponent, onMounted, reactive, ref, watch, unref, computed } from 'vue';
   import { propTypes } from '/@/utils/propTypes';
   import { useRuleFormItem } from '/@/hooks/component/useFormItem';
   // 引入全局实例
-  import _CodeMirror, { EditorFromTextArea } from 'codemirror'
+  import _CodeMirror, { EditorFromTextArea } from 'codemirror';
   // 核心样式
   import 'codemirror/lib/codemirror.css';
   // 引入主题后还需要在 options 中指定主题才会生效
@@ -29,22 +29,22 @@
   import 'codemirror/mode/swift/swift.js';
   import 'codemirror/mode/vue/vue.js';
   // 折叠资源引入:开始
-  import "codemirror/addon/fold/foldgutter.css";
-  import "codemirror/addon/fold/foldcode.js";
-  import "codemirror/addon/fold/brace-fold.js";
-  import "codemirror/addon/fold/comment-fold.js";
-  import "codemirror/addon/fold/indent-fold.js";
-  import "codemirror/addon/fold/foldgutter.js";
+  import 'codemirror/addon/fold/foldgutter.css';
+  import 'codemirror/addon/fold/foldcode.js';
+  import 'codemirror/addon/fold/brace-fold.js';
+  import 'codemirror/addon/fold/comment-fold.js';
+  import 'codemirror/addon/fold/indent-fold.js';
+  import 'codemirror/addon/fold/foldgutter.js';
   // 折叠资源引入:结束
   //光标行背景高亮，配置里面也需要styleActiveLine设置为true
-  import "codemirror/addon/selection/active-line.js";
+  import 'codemirror/addon/selection/active-line.js';
   // 支持代码自动补全
-  import "codemirror/addon/hint/show-hint.css";
-  import "codemirror/addon/hint/show-hint.js";
-  import "codemirror/addon/hint/anyword-hint.js";
+  import 'codemirror/addon/hint/show-hint.css';
+  import 'codemirror/addon/hint/show-hint.js';
+  import 'codemirror/addon/hint/anyword-hint.js';
   import { useAttrs } from '/@/hooks/core/useAttrs';
-  import {useDesign} from '/@/hooks/web/useDesign'
-  import {isJsonObjectString} from '/@/utils/is.ts'
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { isJsonObjectString } from '/@/utils/is.ts';
 
   export default defineComponent({
     name: 'JCodeEditor',
@@ -53,7 +53,7 @@
     components: {},
     props: {
       value: propTypes.string.def(''),
-      height:propTypes.string.def('auto'),
+      height: propTypes.string.def('auto'),
       disabled: propTypes.bool.def(false),
       // 是否显示全屏按钮
       fullScreen: propTypes.bool.def(false),
@@ -68,62 +68,67 @@
       //表单值
       const [state] = useRuleFormItem(props, 'value', 'change', emitData);
       const textarea = ref<HTMLTextAreaElement>();
-      let coder: Nullable<EditorFromTextArea> = null
+      let coder: Nullable<EditorFromTextArea> = null;
       const attrs = useAttrs();
-      const height =ref(props.height);
+      const height = ref(props.height);
       const options = reactive({
         // 缩进格式
         tabSize: 2,
         // 主题，对应主题库 JS 需要提前引入
         theme: 'cobalt',
-        smartIndent: true, // 是否智能缩进  
+        smartIndent: true, // 是否智能缩进
         // 显示行号
         lineNumbers: true,
         line: true,
         // 启用代码折叠相关功能:开始
         foldGutter: true,
         lineWrapping: true,
-        gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter", "CodeMirror-lint-markers"],
+        gutters: ['CodeMirror-linenumbers', 'CodeMirror-foldgutter', 'CodeMirror-lint-markers'],
         // 启用代码折叠相关功能:结束
-        // 光标行高亮  
+        // 光标行高亮
         styleActiveLine: true,
-          //代码格式化
-        extraKeys:{
-           Tab: function autoFormat(editor) {
-               //var totalLines = editor.lineCount();
-               //editor.autoFormatRange({line:0, ch:0}, {line:totalLines});
-              setValue(innerValue,false)
-           }
-        }
+        //代码格式化
+        extraKeys: {
+          Tab: function autoFormat(editor) {
+            //var totalLines = editor.lineCount();
+            //editor.autoFormatRange({line:0, ch:0}, {line:totalLines});
+            setValue(innerValue, false);
+          },
+        },
       });
-      let innerValue = ''
+      let innerValue = '';
       // 全屏状态
-      const isFullScreen = ref(false)
-      const fullScreenIcon = computed(() => isFullScreen.value ? 'fullscreen-exit' : 'fullscreen')
+      const isFullScreen = ref(false);
+      const fullScreenIcon = computed(() => (isFullScreen.value ? 'fullscreen-exit' : 'fullscreen'));
       // 外部盒子参数
       const boxBindProps = computed(() => {
         let _props = {
           class: [
-            prefixCls, 'full-screen-parent', 'auto-height',
+            prefixCls,
+            'full-screen-parent',
+            'auto-height',
             {
               'full-screen': isFullScreen.value,
             },
           ],
           style: {},
-        }
+        };
         if (isFullScreen.value) {
-          _props.style['z-index'] = props.zIndex
+          _props.style['z-index'] = props.zIndex;
         }
-        return _props
-      })
+        return _props;
+      });
       /**
        * 监听组件值
        */
-      watch(() => props.value, () => {
-        if (innerValue != props.value) {
-          setValue(props.value, false);
+      watch(
+        () => props.value,
+        () => {
+          if (innerValue != props.value) {
+            setValue(props.value, false);
+          }
         }
-      });
+      );
       onMounted(() => {
         initialize();
       });
@@ -134,12 +139,12 @@
        * @param trigger 是否触发 change 事件
        */
       function setValue(value: string, trigger = true) {
-        if(value && isJsonObjectString(value)){
-           value = JSON.stringify(JSON.parse(value),null,2);
+        if (value && isJsonObjectString(value)) {
+          value = JSON.stringify(JSON.parse(value), null, 2);
         }
-        coder?.setValue(value ?? '')
-        innerValue = value
-        trigger && emitChange(innerValue)
+        coder?.setValue(value ?? '');
+        innerValue = value;
+        trigger && emitChange(innerValue);
       }
 
       //编辑器值修改事件
@@ -147,7 +152,7 @@
         let value = obj.getValue();
         innerValue = value || '';
         if (props.value != innerValue) {
-          emitChange(innerValue)
+          emitChange(innerValue);
         }
       }
 
@@ -162,12 +167,12 @@
         //绑定值修改事件
         coder.on('change', onChange);
         // 初始化成功时赋值一次
-        setValue(innerValue, false)
+        setValue(innerValue, false);
       }
 
       // 切换全屏状态
       function onToggleFullScreen() {
-        isFullScreen.value = !isFullScreen.value
+        isFullScreen.value = !isFullScreen.value;
       }
 
       const getBindValue = Object.assign({}, unref(props), unref(attrs));
@@ -186,74 +191,72 @@
 </script>
 
 <style lang="less">
-//noinspection LessUnresolvedVariable
-@prefix-cls: ~'@{namespace}-code-editer';
-.@{prefix-cls} {
-
-  &.auto-height {
-    .CodeMirror {
-      height: v-bind(height) !important;
-      min-height: 100px;
-    }
-  }
-
-  /* 全屏样式 */
-
-  &.full-screen-parent {
-    position: relative;
-
-    .full-screen-icon {
-      opacity: 0;
-      color: black;
-      width: 20px;
-      height: 20px;
-      line-height: 24px;
-      background-color: white;
-      position: absolute;
-      top: 2px;
-      right: 2px;
-      z-index: 9;
-      cursor: pointer;
-      transition: opacity 0.3s;
-      padding: 2px 0 0 1.5px;
+  //noinspection LessUnresolvedVariable
+  @prefix-cls: ~'@{namespace}-code-editer';
+  .@{prefix-cls} {
+    &.auto-height {
+      .CodeMirror {
+        height: v-bind(height) !important;
+        min-height: 100px;
+      }
     }
 
-    &:hover {
+    /* 全屏样式 */
+
+    &.full-screen-parent {
+      position: relative;
+
       .full-screen-icon {
-        opacity: 1;
+        opacity: 0;
+        color: black;
+        width: 20px;
+        height: 20px;
+        line-height: 24px;
+        background-color: white;
+        position: absolute;
+        top: 2px;
+        right: 2px;
+        z-index: 9;
+        cursor: pointer;
+        transition: opacity 0.3s;
+        padding: 2px 0 0 1.5px;
+      }
 
-        &:hover {
-          background-color: rgba(255, 255, 255, 0.88);
+      &:hover {
+        .full-screen-icon {
+          opacity: 1;
+
+          &:hover {
+            background-color: rgba(255, 255, 255, 0.88);
+          }
         }
       }
-    }
 
-    &.full-screen {
-      position: fixed;
-      top: 0;
-      right: 0;
-      bottom: 0;
-      left: 0;
-      padding: 8px;
-      background-color: #f5f5f5;
+      &.full-screen {
+        position: fixed;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        padding: 8px;
+        background-color: #f5f5f5;
 
-      .full-screen-icon {
-        top: 12px;
-        right: 12px;
+        .full-screen-icon {
+          top: 12px;
+          right: 12px;
+        }
+
+        .full-screen-child,
+        .CodeMirror {
+          height: 100%;
+          max-height: 100%;
+          min-height: 100%;
+        }
       }
 
-      .full-screen-child,
-      .CodeMirror {
+      .full-screen-child {
         height: 100%;
-        max-height: 100%;
-        min-height: 100%;
       }
     }
-
-    .full-screen-child {
-      height: 100%;
-    }
-
   }
-}
 </style>
diff --git a/src/components/Form/src/jeecg/components/JDictSelectTag.vue b/src/components/Form/src/jeecg/components/JDictSelectTag.vue
index 1f95faa..741bf97 100644
--- a/src/components/Form/src/jeecg/components/JDictSelectTag.vue
+++ b/src/components/Form/src/jeecg/components/JDictSelectTag.vue
@@ -1,164 +1,161 @@
 <template>
-    <a-radio-group v-if="compType===CompTypeEnum.Radio" v-bind="attrs" v-model:value="state" @change="handleChange">
-        <template v-for="item in dictOptions" :key="`${item.value}`">
-            <a-radio :value="item.value">
-                {{ item.label }}
-            </a-radio>
-        </template>
-    </a-radio-group>
+  <a-radio-group v-if="compType === CompTypeEnum.Radio" v-bind="attrs" v-model:value="state" @change="handleChange">
+    <template v-for="item in dictOptions" :key="`${item.value}`">
+      <a-radio :value="item.value">
+        {{ item.label }}
+      </a-radio>
+    </template>
+  </a-radio-group>
 
-    <a-radio-group v-else-if="compType===CompTypeEnum.RadioButton" v-bind="attrs" v-model:value="state" buttonStyle="solid" @change="handleChange">
-        <template v-for="item in dictOptions" :key="`${item.value}`">
-            <a-radio-button :value="item.value">
-                {{ item.label }}
-            </a-radio-button>
-        </template>
-    </a-radio-group>
+  <a-radio-group v-else-if="compType === CompTypeEnum.RadioButton" v-bind="attrs" v-model:value="state" buttonStyle="solid" @change="handleChange">
+    <template v-for="item in dictOptions" :key="`${item.value}`">
+      <a-radio-button :value="item.value">
+        {{ item.label }}
+      </a-radio-button>
+    </template>
+  </a-radio-group>
 
-  <template v-else-if="compType===CompTypeEnum.Select">
+  <template v-else-if="compType === CompTypeEnum.Select">
     <!-- 显示加载效果 -->
     <a-input v-if="loadingEcho" readOnly placeholder="加载中…">
       <template #prefix>
-        <LoadingOutlined/>
+        <LoadingOutlined />
       </template>
     </a-input>
     <a-select v-else :placeholder="placeholder" v-bind="attrs" v-model:value="state" :filterOption="handleFilterOption" :getPopupContainer="getPopupContainer" @change="handleChange">
-        <a-select-option v-if="showChooseOption" :value="undefined">请选择</a-select-option>
-        <template v-for="item in dictOptions" :key="`${item.value}`">
-            <a-select-option :value="item.value">
-          <span style="display: inline-block;width: 100%" :title=" item.label ">
+      <a-select-option v-if="showChooseOption" :value="undefined">请选择</a-select-option>
+      <template v-for="item in dictOptions" :key="`${item.value}`">
+        <a-select-option :value="item.value">
+          <span style="display: inline-block; width: 100%" :title="item.label">
             {{ item.label }}
           </span>
-            </a-select-option>
-        </template>
+        </a-select-option>
+      </template>
     </a-select>
   </template>
 </template>
 <script lang="ts">
-    import {defineComponent, PropType, ref, reactive, watchEffect, computed, unref, watch, onMounted} from 'vue';
-    import {propTypes} from "/@/utils/propTypes";
-    import {useAttrs} from "/@/hooks/core/useAttrs";
-    import {initDictOptions} from "/@/utils/dict/index"
-    import {get, omit} from 'lodash-es';
-    import {useRuleFormItem} from '/@/hooks/component/useFormItem';
-    import {CompTypeEnum} from '/@/enums/CompTypeEnum.ts';
-    import {LoadingOutlined} from '@ant-design/icons-vue'
+  import { defineComponent, PropType, ref, reactive, watchEffect, computed, unref, watch, onMounted } from 'vue';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { initDictOptions } from '/@/utils/dict/index';
+  import { get, omit } from 'lodash-es';
+  import { useRuleFormItem } from '/@/hooks/component/useFormItem';
+  import { CompTypeEnum } from '/@/enums/CompTypeEnum.ts';
+  import { LoadingOutlined } from '@ant-design/icons-vue';
 
-    export default defineComponent({
-        name: 'JDictSelectTag',
-        inheritAttrs: false,
-        components: {LoadingOutlined},
-        props: {
-            value: propTypes.oneOfType([
-                propTypes.string,
-                propTypes.number,
-                propTypes.array,
-            ]),
-            dictCode: propTypes.string,
-            type: propTypes.string,
-            placeholder: propTypes.string,
-            stringToNumber: propTypes.bool,
-            getPopupContainer: {
-                type: Function,
-                default: (node) => node.parentNode
-            },
-            // 是否显示【请选择】选项
-            showChooseOption: propTypes.bool.def(true),
-            // 下拉项-online使用
-            options: {
-                type: Array,
-                default: [],
-                required: false
-            },
-        },
-        emits: ['options-change', 'change'],
-        setup(props, {emit, refs}) {
-            const emitData = ref<any[]>([]);
-            const dictOptions = ref<any[]>([]);
-            const attrs = useAttrs();
-            const [state] = useRuleFormItem(props, 'value', 'change', emitData);
-            const getBindValue = Object.assign({}, unref(props), unref(attrs));
-            // 是否正在加载回显数据
-            const loadingEcho = ref<boolean>(false)
-            // 是否是首次加载回显，只有首次加载，才会显示 loading
-            let isFirstLoadEcho = true
+  export default defineComponent({
+    name: 'JDictSelectTag',
+    inheritAttrs: false,
+    components: { LoadingOutlined },
+    props: {
+      value: propTypes.oneOfType([propTypes.string, propTypes.number, propTypes.array]),
+      dictCode: propTypes.string,
+      type: propTypes.string,
+      placeholder: propTypes.string,
+      stringToNumber: propTypes.bool,
+      getPopupContainer: {
+        type: Function,
+        default: (node) => node.parentNode,
+      },
+      // 是否显示【请选择】选项
+      showChooseOption: propTypes.bool.def(true),
+      // 下拉项-online使用
+      options: {
+        type: Array,
+        default: [],
+        required: false,
+      },
+    },
+    emits: ['options-change', 'change'],
+    setup(props, { emit, refs }) {
+      const emitData = ref<any[]>([]);
+      const dictOptions = ref<any[]>([]);
+      const attrs = useAttrs();
+      const [state] = useRuleFormItem(props, 'value', 'change', emitData);
+      const getBindValue = Object.assign({}, unref(props), unref(attrs));
+      // 是否正在加载回显数据
+      const loadingEcho = ref<boolean>(false);
+      // 是否是首次加载回显，只有首次加载，才会显示 loading
+      let isFirstLoadEcho = true;
 
-            //组件类型
-            const compType = computed(() => {
-                return (!props.type || props.type === "list") ? 'select' : props.type;
-            });
-            /**
-             * 监听字典code
-             */
-            watchEffect(() => {
-              if (props.dictCode) {
-                loadingEcho.value = isFirstLoadEcho
-                isFirstLoadEcho = false
-                initDictData().finally(() => {
-                  loadingEcho.value = isFirstLoadEcho
-                })
-              }
-                //update-begin-author:taoyan date: 如果没有提供dictCode 可以走options的配置--
-                if(!props.dictCode){
-                  dictOptions.value = props.options
-                }
-                //update-end-author:taoyan date: 如果没有提供dictCode 可以走options的配置--
-              
-            });
-            
-            //update-begin-author:taoyan date:20220404 for: 使用useRuleFormItem定义的value，会有一个问题，如果不是操作设置的值而是代码设置的控件值而不能触发change事件
-            // 此处添加空值的change事件,即当组件调用地代码设置value为''也能触发change事件
-            watch(()=>props.value, ()=>{
-              if(props.value===''){
-                emit('change', '')
-              }
-            });
-            //update-end-author:taoyan date:20220404 for: 使用useRuleFormItem定义的value，会有一个问题，如果不是操作设置的值而是代码设置的控件值而不能触发change事件
-    
+      //组件类型
+      const compType = computed(() => {
+        return !props.type || props.type === 'list' ? 'select' : props.type;
+      });
+      /**
+       * 监听字典code
+       */
+      watchEffect(() => {
+        if (props.dictCode) {
+          loadingEcho.value = isFirstLoadEcho;
+          isFirstLoadEcho = false;
+          initDictData().finally(() => {
+            loadingEcho.value = isFirstLoadEcho;
+          });
+        }
+        //update-begin-author:taoyan date: 如果没有提供dictCode 可以走options的配置--
+        if (!props.dictCode) {
+          dictOptions.value = props.options;
+        }
+        //update-end-author:taoyan date: 如果没有提供dictCode 可以走options的配置--
+      });
 
-            async function initDictData() {
-                let {dictCode, stringToNumber} = props;
-                //根据字典Code, 初始化字典数组
-                const dictData = await initDictOptions(dictCode);
-                dictOptions.value = dictData.reduce((prev, next) => {
-                    if (next) {
-                        const value = next['value'];
-                        prev.push({
-                            label: next['text'] || next['label'],
-                            value: stringToNumber ? +value : value,
-                            ...omit(next, ['text', 'value']),
-                        });
-                    }
-                    return prev;
-                }, []);
-            }
-
-          function handleChange(e) {
-            emitData.value = [e?.target?.value || e];
+      //update-begin-author:taoyan date:20220404 for: 使用useRuleFormItem定义的value，会有一个问题，如果不是操作设置的值而是代码设置的控件值而不能触发change事件
+      // 此处添加空值的change事件,即当组件调用地代码设置value为''也能触发change事件
+      watch(
+        () => props.value,
+        () => {
+          if (props.value === '') {
+            emit('change', '');
           }
+        }
+      );
+      //update-end-author:taoyan date:20220404 for: 使用useRuleFormItem定义的value，会有一个问题，如果不是操作设置的值而是代码设置的控件值而不能触发change事件
 
-          /** 用于搜索下拉框中的内容 */
-          function handleFilterOption(input, option) {
-            // 在 label 中搜索
-            let labelIf = option?.children[0]?.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
-            if (labelIf) {
-              return true
-            }
-            // 在 value 中搜索
-            return (option.value || '').toString().toLowerCase().indexOf(input.toLowerCase()) >= 0
+      async function initDictData() {
+        let { dictCode, stringToNumber } = props;
+        //根据字典Code, 初始化字典数组
+        const dictData = await initDictOptions(dictCode);
+        dictOptions.value = dictData.reduce((prev, next) => {
+          if (next) {
+            const value = next['value'];
+            prev.push({
+              label: next['text'] || next['label'],
+              value: stringToNumber ? +value : value,
+              ...omit(next, ['text', 'value']),
+            });
           }
+          return prev;
+        }, []);
+      }
 
-            return {
-                state,
-                compType,
-                attrs,
-                loadingEcho,
-                getBindValue,
-                dictOptions,
-                CompTypeEnum,
-                handleChange,
-                handleFilterOption,
-            };
-        },
-    });
+      function handleChange(e) {
+        emitData.value = [e?.target?.value || e];
+      }
+
+      /** 用于搜索下拉框中的内容 */
+      function handleFilterOption(input, option) {
+        // 在 label 中搜索
+        let labelIf = option?.children[0]?.children.toLowerCase().indexOf(input.toLowerCase()) >= 0;
+        if (labelIf) {
+          return true;
+        }
+        // 在 value 中搜索
+        return (option.value || '').toString().toLowerCase().indexOf(input.toLowerCase()) >= 0;
+      }
+
+      return {
+        state,
+        compType,
+        attrs,
+        loadingEcho,
+        getBindValue,
+        dictOptions,
+        CompTypeEnum,
+        handleChange,
+        handleFilterOption,
+      };
+    },
+  });
 </script>
diff --git a/src/components/Form/src/jeecg/components/JEasyCron/EasyCronInner.vue b/src/components/Form/src/jeecg/components/JEasyCron/EasyCronInner.vue
index 48c2f38..e263fca 100644
--- a/src/components/Form/src/jeecg/components/JEasyCron/EasyCronInner.vue
+++ b/src/components/Form/src/jeecg/components/JEasyCron/EasyCronInner.vue
@@ -3,78 +3,78 @@
     <div class="content">
       <a-tabs :size="`small`" v-model:activeKey="activeKey">
         <a-tab-pane tab="秒" key="second" v-if="!hideSecond">
-          <SecondUI v-model:value="second" :disabled="disabled"/>
+          <SecondUI v-model:value="second" :disabled="disabled" />
         </a-tab-pane>
         <a-tab-pane tab="分" key="minute">
-          <MinuteUI v-model:value="minute" :disabled="disabled"/>
+          <MinuteUI v-model:value="minute" :disabled="disabled" />
         </a-tab-pane>
         <a-tab-pane tab="时" key="hour">
-          <HourUI v-model:value="hour" :disabled="disabled"/>
+          <HourUI v-model:value="hour" :disabled="disabled" />
         </a-tab-pane>
         <a-tab-pane tab="日" key="day">
-          <DayUI v-model:value="day" :week="week" :disabled="disabled"/>
+          <DayUI v-model:value="day" :week="week" :disabled="disabled" />
         </a-tab-pane>
         <a-tab-pane tab="月" key="month">
-          <MonthUI v-model:value="month" :disabled="disabled"/>
+          <MonthUI v-model:value="month" :disabled="disabled" />
         </a-tab-pane>
         <a-tab-pane tab="周" key="week">
-          <WeekUI v-model:value="week" :day="day" :disabled="disabled"/>
+          <WeekUI v-model:value="week" :day="day" :disabled="disabled" />
         </a-tab-pane>
         <a-tab-pane tab="年" key="year" v-if="!hideYear && !hideSecond">
-          <YearUI v-model:value="year" :disabled="disabled"/>
+          <YearUI v-model:value="year" :disabled="disabled" />
         </a-tab-pane>
       </a-tabs>
-      <a-divider/>
+      <a-divider />
       <!-- 执行时间预览 -->
       <a-row :gutter="8">
-        <a-col :span="18" style="margin-top: 22px;">
+        <a-col :span="18" style="margin-top: 22px">
           <a-row :gutter="8">
-            <a-col :span="8" style="margin-bottom: 12px;">
+            <a-col :span="8" style="margin-bottom: 12px">
               <a-input v-model:value="inputValues.second" @blur="onInputBlur">
                 <template #addonBefore>
-                  <span class="allow-click" @click="activeKey='second'">秒</span>
+                  <span class="allow-click" @click="activeKey = 'second'">秒</span>
                 </template>
               </a-input>
             </a-col>
-            <a-col :span="8" style="margin-bottom: 12px;">
+            <a-col :span="8" style="margin-bottom: 12px">
               <a-input v-model:value="inputValues.minute" @blur="onInputBlur">
                 <template #addonBefore>
-                  <span class="allow-click" @click="activeKey='minute'">分</span>
+                  <span class="allow-click" @click="activeKey = 'minute'">分</span>
                 </template>
               </a-input>
             </a-col>
-            <a-col :span="8" style="margin-bottom: 12px;">
+            <a-col :span="8" style="margin-bottom: 12px">
               <a-input v-model:value="inputValues.hour" @blur="onInputBlur">
                 <template #addonBefore>
-                  <span class="allow-click" @click="activeKey='hour'">时</span>
+                  <span class="allow-click" @click="activeKey = 'hour'">时</span>
                 </template>
               </a-input>
             </a-col>
-            <a-col :span="8" style="margin-bottom: 12px;">
+            <a-col :span="8" style="margin-bottom: 12px">
               <a-input v-model:value="inputValues.day" @blur="onInputBlur">
                 <template #addonBefore>
-                  <span class="allow-click" @click="activeKey='day'">日</span>
+                  <span class="allow-click" @click="activeKey = 'day'">日</span>
                 </template>
               </a-input>
             </a-col>
-            <a-col :span="8" style="margin-bottom: 12px;">
+            <a-col :span="8" style="margin-bottom: 12px">
               <a-input v-model:value="inputValues.month" @blur="onInputBlur">
                 <template #addonBefore>
-                  <span class="allow-click" @click="activeKey='month'">月</span>
+                  <span class="allow-click" @click="activeKey = 'month'">月</span>
                 </template>
               </a-input>
             </a-col>
-            <a-col :span="8" style="margin-bottom: 12px;">
+            <a-col :span="8" style="margin-bottom: 12px">
               <a-input v-model:value="inputValues.week" @blur="onInputBlur">
                 <template #addonBefore>
-                  <span class="allow-click" @click="activeKey='week'">周</span>
+                  <span class="allow-click" @click="activeKey = 'week'">周</span>
                 </template>
               </a-input>
             </a-col>
             <a-col :span="8">
               <a-input v-model:value="inputValues.year" @blur="onInputBlur">
                 <template #addonBefore>
-                  <span class="allow-click" @click="activeKey='year'">年</span>
+                  <span class="allow-click" @click="activeKey = 'year'">年</span>
                 </template>
               </a-input>
             </a-col>
@@ -89,7 +89,7 @@
         </a-col>
         <a-col :span="6">
           <div>近十次执行时间（不含年）</div>
-          <a-textarea type="textarea" :value="preTimeList" :rows="5"/>
+          <a-textarea type="textarea" :value="preTimeList" :rows="5" />
         </a-col>
       </a-row>
     </div>
@@ -97,209 +97,214 @@
 </template>
 
 <script lang="ts" setup>
-import { computed, reactive, ref, watch, provide } from 'vue'
-import { useDesign } from '/@/hooks/web/useDesign'
-import CronParser from 'cron-parser'
-import SecondUI from './tabs/SecondUI.vue'
-import MinuteUI from './tabs/MinuteUI.vue'
-import HourUI from './tabs/HourUI.vue'
-import DayUI from './tabs/DayUI.vue'
-import MonthUI from './tabs/MonthUI.vue'
-import WeekUI from './tabs/WeekUI.vue'
-import YearUI from './tabs/YearUI.vue'
-import { cronEmits, cronProps } from './easy.cron.data'
-import { dateFormat, simpleDebounce } from '/@/utils/common/compUtils'
+  import { computed, reactive, ref, watch, provide } from 'vue';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import CronParser from 'cron-parser';
+  import SecondUI from './tabs/SecondUI.vue';
+  import MinuteUI from './tabs/MinuteUI.vue';
+  import HourUI from './tabs/HourUI.vue';
+  import DayUI from './tabs/DayUI.vue';
+  import MonthUI from './tabs/MonthUI.vue';
+  import WeekUI from './tabs/WeekUI.vue';
+  import YearUI from './tabs/YearUI.vue';
+  import { cronEmits, cronProps } from './easy.cron.data';
+  import { dateFormat, simpleDebounce } from '/@/utils/common/compUtils';
 
-const { prefixCls } = useDesign('easy-cron-inner')
-provide('prefixCls', prefixCls)
-const emit = defineEmits([...cronEmits])
-const props = defineProps({ ...cronProps })
-const activeKey = ref(props.hideSecond ? 'minute' : 'second')
-const second = ref('*')
-const minute = ref('*')
-const hour = ref('*')
-const day = ref('*')
-const month = ref('*')
-const week = ref('?')
-const year = ref('*')
-const inputValues = reactive({ second: '', minute: '', hour: '', day: '', month: '', week: '', year: '', cron: '' })
-const preTimeList = ref('执行预览，会忽略年份参数。')
+  const { prefixCls } = useDesign('easy-cron-inner');
+  provide('prefixCls', prefixCls);
+  const emit = defineEmits([...cronEmits]);
+  const props = defineProps({ ...cronProps });
+  const activeKey = ref(props.hideSecond ? 'minute' : 'second');
+  const second = ref('*');
+  const minute = ref('*');
+  const hour = ref('*');
+  const day = ref('*');
+  const month = ref('*');
+  const week = ref('?');
+  const year = ref('*');
+  const inputValues = reactive({ second: '', minute: '', hour: '', day: '', month: '', week: '', year: '', cron: '' });
+  const preTimeList = ref('执行预览，会忽略年份参数。');
 
-// cron表达式
-const cronValueInner = computed(() => {
-  let result: string[] = []
-  if (!props.hideSecond) {
-    result.push(second.value ? second.value : '*')
-  }
-  result.push(minute.value ? minute.value : '*')
-  result.push(hour.value ? hour.value : '*')
-  result.push(day.value ? day.value : '*')
-  result.push(month.value ? month.value : '*')
-  result.push(week.value ? week.value : '?')
-  if (!props.hideYear && !props.hideSecond) result.push(year.value ? year.value : '*')
-  return result.join(' ')
-})
-// 不含年
-const cronValueNoYear = computed(() => {
-  const v = cronValueInner.value
-  if (props.hideYear || props.hideSecond) return v
-  const vs = v.split(' ')
-  if (vs.length >= 6) {
-    // 转成 Quartz 的规则
-    vs[5] = convertWeekToQuartz(vs[5])
-  }
-  return vs.slice(0, vs.length - 1).join(' ')
-})
-const calTriggerList = simpleDebounce(calTriggerListInner, 500)
-
-watch(() => props.value, (newVal) => {
-  if (newVal === cronValueInner.value) {
-    return
-  }
-  formatValue()
-})
-
-
-watch(cronValueInner, (newValue) => {
-  calTriggerList()
-  emitValue(newValue)
-  assignInput()
-})
-
-// watch(minute, () => {
-//   if (second.value === '*') {
-//     second.value = '0'
-//   }
-// })
-// watch(hour, () => {
-//   if (minute.value === '*') {
-//     minute.value = '0'
-//   }
-// })
-// watch(day, () => {
-//   if (day.value !== '?' && hour.value === '*') {
-//     hour.value = '0'
-//   }
-// })
-// watch(week, () => {
-//   if (week.value !== '?' && hour.value === '*') {
-//     hour.value = '0'
-//   }
-// })
-// watch(month, () => {
-//   if (day.value === '?' && week.value === '*') {
-//     week.value = '1'
-//   } else if (week.value === '?' && day.value === '*') {
-//     day.value = '1'
-//   }
-// })
-// watch(year, () => {
-//   if (month.value === '*') {
-//     month.value = '1'
-//   }
-// })
-
-assignInput()
-formatValue()
-calTriggerListInner()
-
-function assignInput() {
-  inputValues.second = second.value
-  inputValues.minute = minute.value
-  inputValues.hour = hour.value
-  inputValues.day = day.value
-  inputValues.month = month.value
-  inputValues.week = week.value
-  inputValues.year = year.value
-  inputValues.cron = cronValueInner.value
-}
-
-function formatValue() {
-  if (!props.value) return
-  const values = props.value.split(' ').filter(item => !!item)
-  if (!values || values.length <= 0) return
-  let i = 0
-  if (!props.hideSecond) second.value = values[i++]
-  if (values.length > i) minute.value = values[i++]
-  if (values.length > i) hour.value = values[i++]
-  if (values.length > i) day.value = values[i++]
-  if (values.length > i) month.value = values[i++]
-  if (values.length > i) week.value = values[i++]
-  if (values.length > i) year.value = values[i]
-  assignInput()
-}
-
-// Quartz 的规则：
-// 1 = 周日，2 = 周一，3 = 周二，4 = 周三，5 = 周四，6 = 周五，7 = 周六
-function convertWeekToQuartz(week: string) {
-  let convert = (v: string) => {
-    if (v === '0') {
-      return '1'
+  // cron表达式
+  const cronValueInner = computed(() => {
+    let result: string[] = [];
+    if (!props.hideSecond) {
+      result.push(second.value ? second.value : '*');
     }
-    if (v === '1') {
-      return '0'
+    result.push(minute.value ? minute.value : '*');
+    result.push(hour.value ? hour.value : '*');
+    result.push(day.value ? day.value : '*');
+    result.push(month.value ? month.value : '*');
+    result.push(week.value ? week.value : '?');
+    if (!props.hideYear && !props.hideSecond) result.push(year.value ? year.value : '*');
+    return result.join(' ');
+  });
+  // 不含年
+  const cronValueNoYear = computed(() => {
+    const v = cronValueInner.value;
+    if (props.hideYear || props.hideSecond) return v;
+    const vs = v.split(' ');
+    if (vs.length >= 6) {
+      // 转成 Quartz 的规则
+      vs[5] = convertWeekToQuartz(vs[5]);
     }
-    return (Number.parseInt(v) - 1).toString()
-  }
-  // 匹配示例 1-7 or 1/7
-  let patten1 = /^([0-7])([-/])([0-7])$/
-  // 匹配示例 1,4,7
-  let patten2 = /^([0-7])(,[0-7])+$/
-  if (/^[0-7]$/.test(week)) {
-    return convert(week)
-  } else if (patten1.test(week)) {
-    return week.replace(patten1, ($0, before, separator, after) => {
-      if (separator === '/') {
-        return convert(before) + separator + after
-      } else {
-        return convert(before) + separator + convert(after)
+    return vs.slice(0, vs.length - 1).join(' ');
+  });
+  const calTriggerList = simpleDebounce(calTriggerListInner, 500);
+
+  watch(
+    () => props.value,
+    (newVal) => {
+      if (newVal === cronValueInner.value) {
+        return;
       }
-    })
-  } else if (patten2.test(week)) {
-    return week.split(',').map(v => convert(v)).join(',')
-  }
-  return week
-}
+      formatValue();
+    }
+  );
 
-function calTriggerListInner() {
-  // 设置了回调函数
-  if (props.remote) {
-    props.remote(cronValueInner.value, +new Date(), v => {
-      preTimeList.value = v
-    })
-    return
-  }
-  const format = 'yyyy-MM-dd hh:mm:ss'
-  const options = {
-    currentDate: dateFormat(new Date(), format),
-  }
-  const iter = CronParser.parseExpression(cronValueNoYear.value, options)
-  const result: string[] = []
-  for (let i = 1; i <= 10; i++) {
-    result.push(dateFormat(new Date(iter.next() as any), format))
-  }
-  preTimeList.value = result.length > 0 ? result.join('\n') : '无执行时间'
-}
+  watch(cronValueInner, (newValue) => {
+    calTriggerList();
+    emitValue(newValue);
+    assignInput();
+  });
 
-function onInputBlur() {
-  second.value = inputValues.second
-  minute.value = inputValues.minute
-  hour.value = inputValues.hour
-  day.value = inputValues.day
-  month.value = inputValues.month
-  week.value = inputValues.week
-  year.value = inputValues.year
-}
+  // watch(minute, () => {
+  //   if (second.value === '*') {
+  //     second.value = '0'
+  //   }
+  // })
+  // watch(hour, () => {
+  //   if (minute.value === '*') {
+  //     minute.value = '0'
+  //   }
+  // })
+  // watch(day, () => {
+  //   if (day.value !== '?' && hour.value === '*') {
+  //     hour.value = '0'
+  //   }
+  // })
+  // watch(week, () => {
+  //   if (week.value !== '?' && hour.value === '*') {
+  //     hour.value = '0'
+  //   }
+  // })
+  // watch(month, () => {
+  //   if (day.value === '?' && week.value === '*') {
+  //     week.value = '1'
+  //   } else if (week.value === '?' && day.value === '*') {
+  //     day.value = '1'
+  //   }
+  // })
+  // watch(year, () => {
+  //   if (month.value === '*') {
+  //     month.value = '1'
+  //   }
+  // })
 
-function onInputCronBlur(event) {
-  emitValue(event.target.value)
-}
+  assignInput();
+  formatValue();
+  calTriggerListInner();
 
-function emitValue(value) {
-  emit('change', value)
-  emit('update:value', value)
-}
+  function assignInput() {
+    inputValues.second = second.value;
+    inputValues.minute = minute.value;
+    inputValues.hour = hour.value;
+    inputValues.day = day.value;
+    inputValues.month = month.value;
+    inputValues.week = week.value;
+    inputValues.year = year.value;
+    inputValues.cron = cronValueInner.value;
+  }
+
+  function formatValue() {
+    if (!props.value) return;
+    const values = props.value.split(' ').filter((item) => !!item);
+    if (!values || values.length <= 0) return;
+    let i = 0;
+    if (!props.hideSecond) second.value = values[i++];
+    if (values.length > i) minute.value = values[i++];
+    if (values.length > i) hour.value = values[i++];
+    if (values.length > i) day.value = values[i++];
+    if (values.length > i) month.value = values[i++];
+    if (values.length > i) week.value = values[i++];
+    if (values.length > i) year.value = values[i];
+    assignInput();
+  }
+
+  // Quartz 的规则：
+  // 1 = 周日，2 = 周一，3 = 周二，4 = 周三，5 = 周四，6 = 周五，7 = 周六
+  function convertWeekToQuartz(week: string) {
+    let convert = (v: string) => {
+      if (v === '0') {
+        return '1';
+      }
+      if (v === '1') {
+        return '0';
+      }
+      return (Number.parseInt(v) - 1).toString();
+    };
+    // 匹配示例 1-7 or 1/7
+    let patten1 = /^([0-7])([-/])([0-7])$/;
+    // 匹配示例 1,4,7
+    let patten2 = /^([0-7])(,[0-7])+$/;
+    if (/^[0-7]$/.test(week)) {
+      return convert(week);
+    } else if (patten1.test(week)) {
+      return week.replace(patten1, ($0, before, separator, after) => {
+        if (separator === '/') {
+          return convert(before) + separator + after;
+        } else {
+          return convert(before) + separator + convert(after);
+        }
+      });
+    } else if (patten2.test(week)) {
+      return week
+        .split(',')
+        .map((v) => convert(v))
+        .join(',');
+    }
+    return week;
+  }
+
+  function calTriggerListInner() {
+    // 设置了回调函数
+    if (props.remote) {
+      props.remote(cronValueInner.value, +new Date(), (v) => {
+        preTimeList.value = v;
+      });
+      return;
+    }
+    const format = 'yyyy-MM-dd hh:mm:ss';
+    const options = {
+      currentDate: dateFormat(new Date(), format),
+    };
+    const iter = CronParser.parseExpression(cronValueNoYear.value, options);
+    const result: string[] = [];
+    for (let i = 1; i <= 10; i++) {
+      result.push(dateFormat(new Date(iter.next() as any), format));
+    }
+    preTimeList.value = result.length > 0 ? result.join('\n') : '无执行时间';
+  }
+
+  function onInputBlur() {
+    second.value = inputValues.second;
+    minute.value = inputValues.minute;
+    hour.value = inputValues.hour;
+    day.value = inputValues.day;
+    month.value = inputValues.month;
+    week.value = inputValues.week;
+    year.value = inputValues.year;
+  }
+
+  function onInputCronBlur(event) {
+    emitValue(event.target.value);
+  }
+
+  function emitValue(value) {
+    emit('change', value);
+    emit('update:value', value);
+  }
 </script>
 <style lang="less">
-@import "easy.cron.inner";
-</style>
\ No newline at end of file
+  @import 'easy.cron.inner';
+</style>
diff --git a/src/components/Form/src/jeecg/components/JEasyCron/EasyCronInput.vue b/src/components/Form/src/jeecg/components/JEasyCron/EasyCronInput.vue
index efecdc7..5b234fd 100644
--- a/src/components/Form/src/jeecg/components/JEasyCron/EasyCronInput.vue
+++ b/src/components/Form/src/jeecg/components/JEasyCron/EasyCronInput.vue
@@ -2,62 +2,55 @@
   <div :class="`${prefixCls}`">
     <a-input :placeholder="placeholder" v-model:value="editCronValue" :disabled="disabled">
       <template #addonAfter>
-        <a class="open-btn" :disabled="disabled?'disabled':null" @click="showConfigModal">
-          <Icon icon="ant-design:setting-outlined"/>
+        <a class="open-btn" :disabled="disabled ? 'disabled' : null" @click="showConfigModal">
+          <Icon icon="ant-design:setting-outlined" />
           <span>选择</span>
         </a>
       </template>
     </a-input>
-    <EasyCronModal
-        @register="registerModal"
-        v-model:value="editCronValue"
-        :exeStartTime="exeStartTime"
-        :hideYear="hideYear"
-        :remote="remote"
-        :hideSecond="hideSecond"/>
+    <EasyCronModal @register="registerModal" v-model:value="editCronValue" :exeStartTime="exeStartTime" :hideYear="hideYear" :remote="remote" :hideSecond="hideSecond" />
   </div>
 </template>
 
 <script lang="ts" setup>
-import { ref, watch } from 'vue'
-import { useDesign } from '/@/hooks/web/useDesign'
-import { useModal } from '/@/components/Modal'
-import { propTypes } from '/@/utils/propTypes'
-import Icon from '/@/components/Icon/src/Icon.vue'
-import EasyCronModal from './EasyCronModal.vue'
-import { cronEmits, cronProps } from './easy.cron.data'
+  import { ref, watch } from 'vue';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useModal } from '/@/components/Modal';
+  import { propTypes } from '/@/utils/propTypes';
+  import Icon from '/@/components/Icon/src/Icon.vue';
+  import EasyCronModal from './EasyCronModal.vue';
+  import { cronEmits, cronProps } from './easy.cron.data';
 
-const { prefixCls } = useDesign('easy-cron-input')
-const emit = defineEmits([...cronEmits])
-const props = defineProps({
-  ...cronProps,
-  placeholder: propTypes.string.def('请输入cron表达式'),
-  exeStartTime: propTypes.oneOfType([
-    propTypes.number,
-    propTypes.string,
-    propTypes.object,
-  ]).def(0),
-})
-const [registerModal, { openModal }] = useModal()
-const editCronValue = ref(props.value)
+  const { prefixCls } = useDesign('easy-cron-input');
+  const emit = defineEmits([...cronEmits]);
+  const props = defineProps({
+    ...cronProps,
+    placeholder: propTypes.string.def('请输入cron表达式'),
+    exeStartTime: propTypes.oneOfType([propTypes.number, propTypes.string, propTypes.object]).def(0),
+  });
+  const [registerModal, { openModal }] = useModal();
+  const editCronValue = ref(props.value);
 
-watch(() => props.value, (newVal) => {
-  if (newVal !== editCronValue.value) {
-    editCronValue.value = newVal
+  watch(
+    () => props.value,
+    (newVal) => {
+      if (newVal !== editCronValue.value) {
+        editCronValue.value = newVal;
+      }
+    }
+  );
+  watch(editCronValue, (newVal) => {
+    emit('change', newVal);
+    emit('update:value', newVal);
+  });
+
+  function showConfigModal() {
+    if (!props.disabled) {
+      openModal();
+    }
   }
-})
-watch(editCronValue, (newVal) => {
-  emit('change', newVal)
-  emit('update:value', newVal)
-})
-
-function showConfigModal() {
-  if (!props.disabled) {
-    openModal()
-  }
-}
 </script>
 
 <style lang="less">
-@import "easy.cron.input";
+  @import 'easy.cron.input';
 </style>
diff --git a/src/components/Form/src/jeecg/components/JEasyCron/EasyCronModal.vue b/src/components/Form/src/jeecg/components/JEasyCron/EasyCronModal.vue
index c81923d..b5fa5da 100644
--- a/src/components/Form/src/jeecg/components/JEasyCron/EasyCronModal.vue
+++ b/src/components/Form/src/jeecg/components/JEasyCron/EasyCronModal.vue
@@ -1,28 +1,28 @@
 <template>
   <BasicModal @register="registerModal" title="Cron表达式" width="800px" @ok="onOk">
-    <EasyCron v-bind="attrs"/>
+    <EasyCron v-bind="attrs" />
   </BasicModal>
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue'
-import { useAttrs } from '/@/hooks/core/useAttrs'
-import { BasicModal, useModalInner } from '/@/components/Modal'
-import EasyCron from './EasyCronInner.vue'
+  import { defineComponent } from 'vue';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import EasyCron from './EasyCronInner.vue';
 
-export default defineComponent({
-  name: 'EasyCronModal',
-  inheritAttrs: false,
-  components: { BasicModal, EasyCron },
-  setup() {
-    const attrs = useAttrs()
-    const [registerModal, { closeModal }] = useModalInner()
+  export default defineComponent({
+    name: 'EasyCronModal',
+    inheritAttrs: false,
+    components: { BasicModal, EasyCron },
+    setup() {
+      const attrs = useAttrs();
+      const [registerModal, { closeModal }] = useModalInner();
 
-    function onOk() {
-      closeModal()
-    }
+      function onOk() {
+        closeModal();
+      }
 
-    return { attrs, registerModal, onOk }
-  },
-})
-</script>
\ No newline at end of file
+      return { attrs, registerModal, onOk };
+    },
+  });
+</script>
diff --git a/src/components/Form/src/jeecg/components/JEasyCron/easy.cron.data.ts b/src/components/Form/src/jeecg/components/JEasyCron/easy.cron.data.ts
index c90c63b..335a8c0 100644
--- a/src/components/Form/src/jeecg/components/JEasyCron/easy.cron.data.ts
+++ b/src/components/Form/src/jeecg/components/JEasyCron/easy.cron.data.ts
@@ -1,10 +1,10 @@
-import { propTypes } from '/@/utils/propTypes'
+import { propTypes } from '/@/utils/propTypes';
 
-export const cronEmits = ['change', 'update:value']
+export const cronEmits = ['change', 'update:value'];
 export const cronProps = {
   value: propTypes.string.def(''),
   disabled: propTypes.bool.def(false),
   hideSecond: propTypes.bool.def(false),
   hideYear: propTypes.bool.def(false),
   remote: propTypes.func,
-}
\ No newline at end of file
+};
diff --git a/src/components/Form/src/jeecg/components/JEasyCron/easy.cron.inner.less b/src/components/Form/src/jeecg/components/JEasyCron/easy.cron.inner.less
index 112b5dc..a71c6ad 100644
--- a/src/components/Form/src/jeecg/components/JEasyCron/easy.cron.inner.less
+++ b/src/components/Form/src/jeecg/components/JEasyCron/easy.cron.inner.less
@@ -44,11 +44,11 @@
     }
 
     .tip-info {
-      color: #999
+      color: #999;
     }
   }
 
   .allow-click {
     cursor: pointer;
   }
-}
\ No newline at end of file
+}
diff --git a/src/components/Form/src/jeecg/components/JEasyCron/easy.cron.input.less b/src/components/Form/src/jeecg/components/JEasyCron/easy.cron.input.less
index 5363d94..d72aa15 100644
--- a/src/components/Form/src/jeecg/components/JEasyCron/easy.cron.input.less
+++ b/src/components/Form/src/jeecg/components/JEasyCron/easy.cron.input.less
@@ -11,4 +11,4 @@
       right: 2px;
     }
   }
-}
\ No newline at end of file
+}
diff --git a/src/components/Form/src/jeecg/components/JEasyCron/index.ts b/src/components/Form/src/jeecg/components/JEasyCron/index.ts
index b9454dc..1513f0d 100644
--- a/src/components/Form/src/jeecg/components/JEasyCron/index.ts
+++ b/src/components/Form/src/jeecg/components/JEasyCron/index.ts
@@ -1,6 +1,6 @@
 // 原开源项目地址：https://gitee.com/toktok/easy-cron
 
-export { default as JEasyCron } from './EasyCronInput.vue'
-export { default as JEasyCronInner } from './EasyCronInner.vue'
-export { default as JEasyCronModal } from './EasyCronModal.vue'
-export { default as JCronValidator } from './validator'
+export { default as JEasyCron } from './EasyCronInput.vue';
+export { default as JEasyCronInner } from './EasyCronInner.vue';
+export { default as JEasyCronModal } from './EasyCronModal.vue';
+export { default as JCronValidator } from './validator';
diff --git a/src/components/Form/src/jeecg/components/JEasyCron/tabs/DayUI.vue b/src/components/Form/src/jeecg/components/JEasyCron/tabs/DayUI.vue
index abf5eda..88cdc15 100644
--- a/src/components/Form/src/jeecg/components/JEasyCron/tabs/DayUI.vue
+++ b/src/components/Form/src/jeecg/components/JEasyCron/tabs/DayUI.vue
@@ -11,23 +11,23 @@
       <div class="item">
         <a-radio :value="TypeEnum.range" v-bind="beforeRadioAttrs">区间</a-radio>
         <span> 从 </span>
-        <InputNumber v-model:value="valueRange.start" v-bind="typeRangeAttrs"/>
+        <InputNumber v-model:value="valueRange.start" v-bind="typeRangeAttrs" />
         <span> 日 至 </span>
-        <InputNumber v-model:value="valueRange.end" v-bind="typeRangeAttrs"/>
+        <InputNumber v-model:value="valueRange.end" v-bind="typeRangeAttrs" />
         <span> 日 </span>
       </div>
       <div class="item">
         <a-radio :value="TypeEnum.loop" v-bind="beforeRadioAttrs">循环</a-radio>
         <span> 从 </span>
-        <InputNumber v-model:value="valueLoop.start" v-bind="typeLoopAttrs"/>
+        <InputNumber v-model:value="valueLoop.start" v-bind="typeLoopAttrs" />
         <span> 日开始，间隔 </span>
-        <InputNumber v-model:value="valueLoop.interval" v-bind="typeLoopAttrs"/>
+        <InputNumber v-model:value="valueLoop.interval" v-bind="typeLoopAttrs" />
         <span> 日 </span>
       </div>
       <div class="item">
         <a-radio :value="TypeEnum.work" v-bind="beforeRadioAttrs">工作日</a-radio>
         <span> 本月 </span>
-        <InputNumber v-model:value="valueWork" v-bind="typeWorkAttrs"/>
+        <InputNumber v-model:value="valueWork" v-bind="typeWorkAttrs" />
         <span> 日，最近的工作日 </span>
       </div>
       <div class="item">
@@ -48,43 +48,46 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, watch } from 'vue'
-import { InputNumber } from 'ant-design-vue'
-import { TypeEnum, useTabEmits, useTabProps, useTabSetup } from './useTabMixin'
+  import { computed, defineComponent, watch } from 'vue';
+  import { InputNumber } from 'ant-design-vue';
+  import { TypeEnum, useTabEmits, useTabProps, useTabSetup } from './useTabMixin';
 
-export default defineComponent({
-  name: 'DayUI',
-  components: { InputNumber },
-  props: useTabProps({
-    defaultValue: '*',
-    props: {
-      week: { type: String, default: '?' },
-    },
-  }),
-  emits: useTabEmits(),
-  setup(props, context) {
-    const disabledChoice = computed(() => {
-      return (props.week && props.week !== '?') || props.disabled
-    })
-    const setup = useTabSetup(props, context, {
+  export default defineComponent({
+    name: 'DayUI',
+    components: { InputNumber },
+    props: useTabProps({
       defaultValue: '*',
-      valueWork: 1,
-      minValue: 1,
-      maxValue: 31,
-      valueRange: { start: 1, end: 31 },
-      valueLoop: { start: 1, interval: 1 },
-      disabled: disabledChoice,
-    })
-    const typeWorkAttrs = computed(() => ({
-      disabled: setup.type.value !== TypeEnum.work || props.disabled || disabledChoice.value,
-      ...setup.inputNumberAttrs.value,
-    }))
+      props: {
+        week: { type: String, default: '?' },
+      },
+    }),
+    emits: useTabEmits(),
+    setup(props, context) {
+      const disabledChoice = computed(() => {
+        return (props.week && props.week !== '?') || props.disabled;
+      });
+      const setup = useTabSetup(props, context, {
+        defaultValue: '*',
+        valueWork: 1,
+        minValue: 1,
+        maxValue: 31,
+        valueRange: { start: 1, end: 31 },
+        valueLoop: { start: 1, interval: 1 },
+        disabled: disabledChoice,
+      });
+      const typeWorkAttrs = computed(() => ({
+        disabled: setup.type.value !== TypeEnum.work || props.disabled || disabledChoice.value,
+        ...setup.inputNumberAttrs.value,
+      }));
 
-    watch(() => props.week, () => {
-      setup.updateValue(disabledChoice.value ? '?' : setup.computeValue.value)
-    })
+      watch(
+        () => props.week,
+        () => {
+          setup.updateValue(disabledChoice.value ? '?' : setup.computeValue.value);
+        }
+      );
 
-    return { ...setup, typeWorkAttrs }
-  },
-})
-</script>
\ No newline at end of file
+      return { ...setup, typeWorkAttrs };
+    },
+  });
+</script>
diff --git a/src/components/Form/src/jeecg/components/JEasyCron/tabs/HourUI.vue b/src/components/Form/src/jeecg/components/JEasyCron/tabs/HourUI.vue
index 99d2324..c3c5224 100644
--- a/src/components/Form/src/jeecg/components/JEasyCron/tabs/HourUI.vue
+++ b/src/components/Form/src/jeecg/components/JEasyCron/tabs/HourUI.vue
@@ -7,17 +7,17 @@
       <div class="item">
         <a-radio :value="TypeEnum.range" v-bind="beforeRadioAttrs">区间</a-radio>
         <span> 从 </span>
-        <InputNumber v-model:value="valueRange.start" v-bind="typeRangeAttrs"/>
+        <InputNumber v-model:value="valueRange.start" v-bind="typeRangeAttrs" />
         <span> 时 至 </span>
-        <InputNumber v-model:value="valueRange.end" v-bind="typeRangeAttrs"/>
+        <InputNumber v-model:value="valueRange.end" v-bind="typeRangeAttrs" />
         <span> 时 </span>
       </div>
       <div class="item">
         <a-radio :value="TypeEnum.loop" v-bind="beforeRadioAttrs">循环</a-radio>
         <span> 从 </span>
-        <InputNumber v-model:value="valueLoop.start" v-bind="typeLoopAttrs"/>
+        <InputNumber v-model:value="valueLoop.start" v-bind="typeLoopAttrs" />
         <span> 时开始，间隔 </span>
-        <InputNumber v-model:value="valueLoop.interval" v-bind="typeLoopAttrs"/>
+        <InputNumber v-model:value="valueLoop.interval" v-bind="typeLoopAttrs" />
         <span> 时 </span>
       </div>
       <div class="item">
@@ -35,25 +35,25 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue'
-import { InputNumber } from 'ant-design-vue'
-import { useTabProps, useTabEmits, useTabSetup } from './useTabMixin'
+  import { defineComponent } from 'vue';
+  import { InputNumber } from 'ant-design-vue';
+  import { useTabProps, useTabEmits, useTabSetup } from './useTabMixin';
 
-export default defineComponent({
-  name: 'HourUI',
-  components: { InputNumber },
-  props: useTabProps({
-    defaultValue: '*',
-  }),
-  emits: useTabEmits(),
-  setup(props, context) {
-    return useTabSetup(props, context, {
+  export default defineComponent({
+    name: 'HourUI',
+    components: { InputNumber },
+    props: useTabProps({
       defaultValue: '*',
-      minValue: 0,
-      maxValue: 23,
-      valueRange: { start: 0, end: 23 },
-      valueLoop: { start: 0, interval: 1 },
-    })
-  },
-})
-</script>
\ No newline at end of file
+    }),
+    emits: useTabEmits(),
+    setup(props, context) {
+      return useTabSetup(props, context, {
+        defaultValue: '*',
+        minValue: 0,
+        maxValue: 23,
+        valueRange: { start: 0, end: 23 },
+        valueLoop: { start: 0, interval: 1 },
+      });
+    },
+  });
+</script>
diff --git a/src/components/Form/src/jeecg/components/JEasyCron/tabs/MinuteUI.vue b/src/components/Form/src/jeecg/components/JEasyCron/tabs/MinuteUI.vue
index 6ea3da7..34617bf 100644
--- a/src/components/Form/src/jeecg/components/JEasyCron/tabs/MinuteUI.vue
+++ b/src/components/Form/src/jeecg/components/JEasyCron/tabs/MinuteUI.vue
@@ -7,17 +7,17 @@
       <div class="item">
         <a-radio :value="TypeEnum.range" v-bind="beforeRadioAttrs">区间</a-radio>
         <span> 从 </span>
-        <InputNumber v-model:value="valueRange.start" v-bind="typeRangeAttrs"/>
+        <InputNumber v-model:value="valueRange.start" v-bind="typeRangeAttrs" />
         <span> 分 至 </span>
-        <InputNumber v-model:value="valueRange.end" v-bind="typeRangeAttrs"/>
+        <InputNumber v-model:value="valueRange.end" v-bind="typeRangeAttrs" />
         <span> 分 </span>
       </div>
       <div class="item">
         <a-radio :value="TypeEnum.loop" v-bind="beforeRadioAttrs">循环</a-radio>
         <span> 从 </span>
-        <InputNumber v-model:value="valueLoop.start" v-bind="typeLoopAttrs"/>
+        <InputNumber v-model:value="valueLoop.start" v-bind="typeLoopAttrs" />
         <span> 分开始，间隔 </span>
-        <InputNumber v-model:value="valueLoop.interval" v-bind="typeLoopAttrs"/>
+        <InputNumber v-model:value="valueLoop.interval" v-bind="typeLoopAttrs" />
         <span> 分 </span>
       </div>
       <div class="item">
@@ -35,25 +35,25 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue'
-import { InputNumber } from 'ant-design-vue'
-import { useTabProps, useTabEmits, useTabSetup } from './useTabMixin'
+  import { defineComponent } from 'vue';
+  import { InputNumber } from 'ant-design-vue';
+  import { useTabProps, useTabEmits, useTabSetup } from './useTabMixin';
 
-export default defineComponent({
-  name: 'MinuteUI',
-  components: { InputNumber },
-  props: useTabProps({
-    defaultValue: '*',
-  }),
-  emits: useTabEmits(),
-  setup(props, context) {
-    return useTabSetup(props, context, {
+  export default defineComponent({
+    name: 'MinuteUI',
+    components: { InputNumber },
+    props: useTabProps({
       defaultValue: '*',
-      minValue: 0,
-      maxValue: 59,
-      valueRange: { start: 0, end: 59 },
-      valueLoop: { start: 0, interval: 1 },
-    })
-  },
-})
-</script>
\ No newline at end of file
+    }),
+    emits: useTabEmits(),
+    setup(props, context) {
+      return useTabSetup(props, context, {
+        defaultValue: '*',
+        minValue: 0,
+        maxValue: 59,
+        valueRange: { start: 0, end: 59 },
+        valueLoop: { start: 0, interval: 1 },
+      });
+    },
+  });
+</script>
diff --git a/src/components/Form/src/jeecg/components/JEasyCron/tabs/MonthUI.vue b/src/components/Form/src/jeecg/components/JEasyCron/tabs/MonthUI.vue
index 0674e6f..78f7f4e 100644
--- a/src/components/Form/src/jeecg/components/JEasyCron/tabs/MonthUI.vue
+++ b/src/components/Form/src/jeecg/components/JEasyCron/tabs/MonthUI.vue
@@ -7,17 +7,17 @@
       <div class="item">
         <a-radio :value="TypeEnum.range" v-bind="beforeRadioAttrs">区间</a-radio>
         <span> 从 </span>
-        <InputNumber v-model:value="valueRange.start" v-bind="typeRangeAttrs"/>
+        <InputNumber v-model:value="valueRange.start" v-bind="typeRangeAttrs" />
         <span> 月 至 </span>
-        <InputNumber v-model:value="valueRange.end" v-bind="typeRangeAttrs"/>
+        <InputNumber v-model:value="valueRange.end" v-bind="typeRangeAttrs" />
         <span> 月 </span>
       </div>
       <div class="item">
         <a-radio :value="TypeEnum.loop" v-bind="beforeRadioAttrs">循环</a-radio>
         <span> 从 </span>
-        <InputNumber v-model:value="valueLoop.start" v-bind="typeLoopAttrs"/>
+        <InputNumber v-model:value="valueLoop.start" v-bind="typeLoopAttrs" />
         <span> 月开始，间隔 </span>
-        <InputNumber v-model:value="valueLoop.interval" v-bind="typeLoopAttrs"/>
+        <InputNumber v-model:value="valueLoop.interval" v-bind="typeLoopAttrs" />
         <span> 月 </span>
       </div>
       <div class="item">
@@ -35,25 +35,25 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue'
-import { InputNumber } from 'ant-design-vue'
-import { useTabProps, useTabEmits, useTabSetup } from './useTabMixin'
+  import { defineComponent } from 'vue';
+  import { InputNumber } from 'ant-design-vue';
+  import { useTabProps, useTabEmits, useTabSetup } from './useTabMixin';
 
-export default defineComponent({
-  name: 'MonthUI',
-  components: { InputNumber },
-  props: useTabProps({
-    defaultValue: '*',
-  }),
-  emits: useTabEmits(),
-  setup(props, context) {
-    return useTabSetup(props, context, {
+  export default defineComponent({
+    name: 'MonthUI',
+    components: { InputNumber },
+    props: useTabProps({
       defaultValue: '*',
-      minValue: 1,
-      maxValue: 12,
-      valueRange: { start: 1, end: 12 },
-      valueLoop: { start: 1, interval: 1 },
-    })
-  },
-})
-</script>
\ No newline at end of file
+    }),
+    emits: useTabEmits(),
+    setup(props, context) {
+      return useTabSetup(props, context, {
+        defaultValue: '*',
+        minValue: 1,
+        maxValue: 12,
+        valueRange: { start: 1, end: 12 },
+        valueLoop: { start: 1, interval: 1 },
+      });
+    },
+  });
+</script>
diff --git a/src/components/Form/src/jeecg/components/JEasyCron/tabs/SecondUI.vue b/src/components/Form/src/jeecg/components/JEasyCron/tabs/SecondUI.vue
index d74024c..6b65b85 100644
--- a/src/components/Form/src/jeecg/components/JEasyCron/tabs/SecondUI.vue
+++ b/src/components/Form/src/jeecg/components/JEasyCron/tabs/SecondUI.vue
@@ -7,17 +7,17 @@
       <div class="item">
         <a-radio :value="TypeEnum.range" v-bind="beforeRadioAttrs">区间</a-radio>
         <span> 从 </span>
-        <InputNumber v-model:value="valueRange.start" v-bind="typeRangeAttrs"/>
+        <InputNumber v-model:value="valueRange.start" v-bind="typeRangeAttrs" />
         <span> 秒 至 </span>
-        <InputNumber v-model:value="valueRange.end" v-bind="typeRangeAttrs"/>
+        <InputNumber v-model:value="valueRange.end" v-bind="typeRangeAttrs" />
         <span> 秒 </span>
       </div>
       <div class="item">
         <a-radio :value="TypeEnum.loop" v-bind="beforeRadioAttrs">循环</a-radio>
         <span> 从 </span>
-        <InputNumber v-model:value="valueLoop.start" v-bind="typeLoopAttrs"/>
+        <InputNumber v-model:value="valueLoop.start" v-bind="typeLoopAttrs" />
         <span> 秒开始，间隔 </span>
-        <InputNumber v-model:value="valueLoop.interval" v-bind="typeLoopAttrs"/>
+        <InputNumber v-model:value="valueLoop.interval" v-bind="typeLoopAttrs" />
         <span> 秒 </span>
       </div>
       <div class="item">
@@ -35,25 +35,25 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue'
-import { InputNumber } from 'ant-design-vue'
-import { useTabProps, useTabEmits, useTabSetup } from './useTabMixin'
+  import { defineComponent } from 'vue';
+  import { InputNumber } from 'ant-design-vue';
+  import { useTabProps, useTabEmits, useTabSetup } from './useTabMixin';
 
-export default defineComponent({
-  name: 'SecondUI',
-  components: { InputNumber },
-  props: useTabProps({
-    defaultValue: '*',
-  }),
-  emits: useTabEmits(),
-  setup(props, context) {
-    return useTabSetup(props, context, {
+  export default defineComponent({
+    name: 'SecondUI',
+    components: { InputNumber },
+    props: useTabProps({
       defaultValue: '*',
-      minValue: 0,
-      maxValue: 59,
-      valueRange: { start: 0, end: 59 },
-      valueLoop: { start: 0, interval: 1 },
-    })
-  },
-})
-</script>
\ No newline at end of file
+    }),
+    emits: useTabEmits(),
+    setup(props, context) {
+      return useTabSetup(props, context, {
+        defaultValue: '*',
+        minValue: 0,
+        maxValue: 59,
+        valueRange: { start: 0, end: 59 },
+        valueLoop: { start: 0, interval: 1 },
+      });
+    },
+  });
+</script>
diff --git a/src/components/Form/src/jeecg/components/JEasyCron/tabs/WeekUI.vue b/src/components/Form/src/jeecg/components/JEasyCron/tabs/WeekUI.vue
index 8b376e8..c3b15dc 100644
--- a/src/components/Form/src/jeecg/components/JEasyCron/tabs/WeekUI.vue
+++ b/src/components/Form/src/jeecg/components/JEasyCron/tabs/WeekUI.vue
@@ -8,16 +8,16 @@
       <div class="item">
         <a-radio :value="TypeEnum.range" v-bind="beforeRadioAttrs">区间</a-radio>
         <span> 从 </span>
-        <a-select v-model:value="valueRange.start" :options="weekOptions" v-bind="typeRangeSelectAttrs"/>
+        <a-select v-model:value="valueRange.start" :options="weekOptions" v-bind="typeRangeSelectAttrs" />
         <span> 至 </span>
-        <a-select v-model:value="valueRange.end" :options="weekOptions" v-bind="typeRangeSelectAttrs"/>
+        <a-select v-model:value="valueRange.end" :options="weekOptions" v-bind="typeRangeSelectAttrs" />
       </div>
       <div class="item">
         <a-radio :value="TypeEnum.loop" v-bind="beforeRadioAttrs">循环</a-radio>
         <span> 从 </span>
-        <a-select v-model:value="valueLoop.start" :options="weekOptions" v-bind="typeLoopSelectAttrs"/>
+        <a-select v-model:value="valueLoop.start" :options="weekOptions" v-bind="typeLoopSelectAttrs" />
         <span> 开始，间隔 </span>
-        <InputNumber v-model:value="valueLoop.interval" v-bind="typeLoopAttrs"/>
+        <InputNumber v-model:value="valueLoop.interval" v-bind="typeLoopAttrs" />
         <span> 天 </span>
       </div>
       <div class="item">
@@ -35,88 +35,91 @@
 </template>
 
 <script lang="ts">
-import { computed, watch, defineComponent } from 'vue'
-import { InputNumber } from 'ant-design-vue'
-import { useTabProps, useTabEmits, useTabSetup, TypeEnum } from './useTabMixin'
+  import { computed, watch, defineComponent } from 'vue';
+  import { InputNumber } from 'ant-design-vue';
+  import { useTabProps, useTabEmits, useTabSetup, TypeEnum } from './useTabMixin';
 
-const WEEK_MAP_EN = {
-  '1': 'SUN',
-  '2': 'MON',
-  '3': 'TUE',
-  '4': 'WED',
-  '5': 'THU',
-  '6': 'FRI',
-  '7': 'SAT',
-}
+  const WEEK_MAP_EN = {
+    '1': 'SUN',
+    '2': 'MON',
+    '3': 'TUE',
+    '4': 'WED',
+    '5': 'THU',
+    '6': 'FRI',
+    '7': 'SAT',
+  };
 
-const WEEK_MAP_CN = {
-  '1': '周日',
-  '2': '周一',
-  '3': '周二',
-  '4': '周三',
-  '5': '周四',
-  '6': '周五',
-  '7': '周六',
-}
+  const WEEK_MAP_CN = {
+    '1': '周日',
+    '2': '周一',
+    '3': '周二',
+    '4': '周三',
+    '5': '周四',
+    '6': '周五',
+    '7': '周六',
+  };
 
-export default defineComponent({
-  name: 'WeekUI',
-  components: { InputNumber },
-  props: useTabProps({
-    defaultValue: '?',
-    props: {
-      day: { type: String, default: '*' },
-    },
-  }),
-  emits: useTabEmits(),
-  setup(props, context) {
-    const disabledChoice = computed(() => {
-      return (props.day && props.day !== '?') || props.disabled
-    })
-    const setup = useTabSetup(props, context, {
-      defaultType: TypeEnum.unset,
+  export default defineComponent({
+    name: 'WeekUI',
+    components: { InputNumber },
+    props: useTabProps({
       defaultValue: '?',
-      minValue: 1,
-      maxValue: 7,
-      // 0,7表示周日 1表示周一
-      valueRange: { start: 1, end: 7 },
-      valueLoop: { start: 2, interval: 1 },
-      disabled: disabledChoice,
-    })
-    const weekOptions = computed(() => {
-      let options: { label: string, value: number }[] = []
-      for (let weekKey of Object.keys(WEEK_MAP_CN)) {
-        let weekName: string = WEEK_MAP_CN[weekKey]
-        options.push({
-          value: Number.parseInt(weekKey),
-          label: weekName,
-        })
-      }
-      return options
-    })
+      props: {
+        day: { type: String, default: '*' },
+      },
+    }),
+    emits: useTabEmits(),
+    setup(props, context) {
+      const disabledChoice = computed(() => {
+        return (props.day && props.day !== '?') || props.disabled;
+      });
+      const setup = useTabSetup(props, context, {
+        defaultType: TypeEnum.unset,
+        defaultValue: '?',
+        minValue: 1,
+        maxValue: 7,
+        // 0,7表示周日 1表示周一
+        valueRange: { start: 1, end: 7 },
+        valueLoop: { start: 2, interval: 1 },
+        disabled: disabledChoice,
+      });
+      const weekOptions = computed(() => {
+        let options: { label: string; value: number }[] = [];
+        for (let weekKey of Object.keys(WEEK_MAP_CN)) {
+          let weekName: string = WEEK_MAP_CN[weekKey];
+          options.push({
+            value: Number.parseInt(weekKey),
+            label: weekName,
+          });
+        }
+        return options;
+      });
 
-    const typeRangeSelectAttrs = computed(() => ({
-      class: ['w80'],
-      disabled: setup.typeRangeAttrs.value.disabled,
-    }))
+      const typeRangeSelectAttrs = computed(() => ({
+        class: ['w80'],
+        disabled: setup.typeRangeAttrs.value.disabled,
+      }));
 
-    const typeLoopSelectAttrs = computed(() => ({
-      class: ['w80'],
-      disabled: setup.typeLoopAttrs.value.disabled,
-    }))
+      const typeLoopSelectAttrs = computed(() => ({
+        class: ['w80'],
+        disabled: setup.typeLoopAttrs.value.disabled,
+      }));
 
-    watch(() => props.day, () => {
-      setup.updateValue(disabledChoice.value ? '?' : setup.computeValue.value)
-    })
+      watch(
+        () => props.day,
+        () => {
+          setup.updateValue(disabledChoice.value ? '?' : setup.computeValue.value);
+        }
+      );
 
-    return {
-      ...setup,
-      weekOptions,
-      typeLoopSelectAttrs,
-      typeRangeSelectAttrs,
-      WEEK_MAP_CN, WEEK_MAP_EN,
-    }
-  },
-
-})
-</script>
\ No newline at end of file
+      return {
+        ...setup,
+        weekOptions,
+        typeLoopSelectAttrs,
+        typeRangeSelectAttrs,
+        WEEK_MAP_CN,
+        WEEK_MAP_EN,
+      };
+    },
+  });
+</script>
diff --git a/src/components/Form/src/jeecg/components/JEasyCron/tabs/YearUI.vue b/src/components/Form/src/jeecg/components/JEasyCron/tabs/YearUI.vue
index 206bd80..2be7972 100644
--- a/src/components/Form/src/jeecg/components/JEasyCron/tabs/YearUI.vue
+++ b/src/components/Form/src/jeecg/components/JEasyCron/tabs/YearUI.vue
@@ -7,17 +7,17 @@
       <div class="item">
         <a-radio :value="TypeEnum.range" v-bind="beforeRadioAttrs">区间</a-radio>
         <span> 从 </span>
-        <InputNumber class="w80" v-model:value="valueRange.start" v-bind="typeRangeAttrs"/>
+        <InputNumber class="w80" v-model:value="valueRange.start" v-bind="typeRangeAttrs" />
         <span> 年 至 </span>
-        <InputNumber class="w80" v-model:value="valueRange.end" v-bind="typeRangeAttrs"/>
+        <InputNumber class="w80" v-model:value="valueRange.end" v-bind="typeRangeAttrs" />
         <span> 年 </span>
       </div>
       <div class="item">
         <a-radio :value="TypeEnum.loop" v-bind="beforeRadioAttrs">循环</a-radio>
         <span> 从 </span>
-        <InputNumber class="w80" v-model:value="valueLoop.start" v-bind="typeLoopAttrs"/>
+        <InputNumber class="w80" v-model:value="valueLoop.start" v-bind="typeLoopAttrs" />
         <span> 年开始，间隔 </span>
-        <InputNumber class="w80" v-model:value="valueLoop.interval" v-bind="typeLoopAttrs"/>
+        <InputNumber class="w80" v-model:value="valueLoop.interval" v-bind="typeLoopAttrs" />
         <span> 年 </span>
       </div>
     </a-radio-group>
@@ -25,25 +25,25 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue'
-import { InputNumber } from 'ant-design-vue'
-import { useTabProps, useTabEmits, useTabSetup } from './useTabMixin'
+  import { defineComponent } from 'vue';
+  import { InputNumber } from 'ant-design-vue';
+  import { useTabProps, useTabEmits, useTabSetup } from './useTabMixin';
 
-export default defineComponent({
-  name: 'YearUI',
-  components: { InputNumber },
-  props: useTabProps({
-    defaultValue: '*',
-  }),
-  emits: useTabEmits(),
-  setup(props, context) {
-    const nowYear = (new Date()).getFullYear()
-    return useTabSetup(props, context, {
+  export default defineComponent({
+    name: 'YearUI',
+    components: { InputNumber },
+    props: useTabProps({
       defaultValue: '*',
-      minValue: 0,
-      valueRange: { start: nowYear, end: nowYear + 100 },
-      valueLoop: { start: nowYear, interval: 1 },
-    })
-  },
-})
-</script>
\ No newline at end of file
+    }),
+    emits: useTabEmits(),
+    setup(props, context) {
+      const nowYear = new Date().getFullYear();
+      return useTabSetup(props, context, {
+        defaultValue: '*',
+        minValue: 0,
+        valueRange: { start: nowYear, end: nowYear + 100 },
+        valueLoop: { start: nowYear, interval: 1 },
+      });
+    },
+  });
+</script>
diff --git a/src/components/Form/src/jeecg/components/JEasyCron/tabs/useTabMixin.ts b/src/components/Form/src/jeecg/components/JEasyCron/tabs/useTabMixin.ts
index 63f53b5..291ca19 100644
--- a/src/components/Form/src/jeecg/components/JEasyCron/tabs/useTabMixin.ts
+++ b/src/components/Form/src/jeecg/components/JEasyCron/tabs/useTabMixin.ts
@@ -1,6 +1,6 @@
 // 主要用于日和星期的互斥使用
-import { computed, inject, reactive, ref, unref, watch } from 'vue'
-import { propTypes } from '/@/utils/propTypes'
+import { computed, inject, reactive, ref, unref, watch } from 'vue';
+import { propTypes } from '/@/utils/propTypes';
 
 export enum TypeEnum {
   unset = 'UNSET',
@@ -14,91 +14,95 @@ export enum TypeEnum {
 
 // use 公共 props
 export function useTabProps(options) {
-  const defaultValue = options?.defaultValue ?? '?'
+  const defaultValue = options?.defaultValue ?? '?';
   return {
     value: propTypes.string.def(defaultValue),
     disabled: propTypes.bool.def(false),
     ...options?.props,
-  }
+  };
 }
 
 // use 公共 emits
 export function useTabEmits() {
-  return ['change', 'update:value']
+  return ['change', 'update:value'];
 }
 
 // use 公共 setup
 export function useTabSetup(props, context, options) {
-  const { emit } = context
-  const prefixCls = inject('prefixCls')
-  const defaultValue = ref(options?.defaultValue ?? '?')
+  const { emit } = context;
+  const prefixCls = inject('prefixCls');
+  const defaultValue = ref(options?.defaultValue ?? '?');
   // 类型
-  const type = ref(options.defaultType ?? TypeEnum.every)
-  const valueList = ref<any[]>([])
+  const type = ref(options.defaultType ?? TypeEnum.every);
+  const valueList = ref<any[]>([]);
   // 对于不同的类型，所定义的值也有所不同
-  const valueRange = reactive(options.valueRange)
-  const valueLoop = reactive(options.valueLoop)
-  const valueWeek = reactive(options.valueWeek)
-  const valueWork = ref(options.valueWork)
-  const maxValue = ref(options.maxValue)
-  const minValue = ref(options.minValue)
+  const valueRange = reactive(options.valueRange);
+  const valueLoop = reactive(options.valueLoop);
+  const valueWeek = reactive(options.valueWeek);
+  const valueWork = ref(options.valueWork);
+  const maxValue = ref(options.maxValue);
+  const minValue = ref(options.minValue);
 
   // 根据不同的类型计算出的value
   const computeValue = computed(() => {
-    let valueArray: any[] = []
+    let valueArray: any[] = [];
     switch (type.value) {
       case TypeEnum.unset:
-        valueArray.push('?')
-        break
+        valueArray.push('?');
+        break;
       case TypeEnum.every:
-        valueArray.push('*')
-        break
+        valueArray.push('*');
+        break;
       case TypeEnum.range:
-        valueArray.push(`${valueRange.start}-${valueRange.end}`)
-        break
+        valueArray.push(`${valueRange.start}-${valueRange.end}`);
+        break;
       case TypeEnum.loop:
-        valueArray.push(`${valueLoop.start}/${valueLoop.interval}`)
-        break
+        valueArray.push(`${valueLoop.start}/${valueLoop.interval}`);
+        break;
       case TypeEnum.work:
-        valueArray.push(`${valueWork.value}W`)
-        break
+        valueArray.push(`${valueWork.value}W`);
+        break;
       case TypeEnum.last:
-        valueArray.push('L')
-        break
+        valueArray.push('L');
+        break;
       case TypeEnum.specify:
         if (valueList.value.length === 0) {
-          valueList.value.push(minValue.value)
+          valueList.value.push(minValue.value);
         }
-        valueArray.push(valueList.value.join(','))
-        break
+        valueArray.push(valueList.value.join(','));
+        break;
       default:
-        valueArray.push(defaultValue.value)
-        break
+        valueArray.push(defaultValue.value);
+        break;
     }
-    return valueArray.length > 0 ? valueArray.join('') : defaultValue.value
-  })
+    return valueArray.length > 0 ? valueArray.join('') : defaultValue.value;
+  });
   // 指定值范围区间，介于最小值和最大值之间
   const specifyRange = computed(() => {
-    let range: number[] = []
+    let range: number[] = [];
     if (maxValue.value != null) {
       for (let i = minValue.value; i <= maxValue.value; i++) {
-        range.push(i)
+        range.push(i);
       }
     }
-    return range
-  })
+    return range;
+  });
 
-  watch(() => props.value, (val) => {
-    if (val !== computeValue.value) {
-      parseValue(val)
-    }
-  }, { immediate: true })
+  watch(
+    () => props.value,
+    (val) => {
+      if (val !== computeValue.value) {
+        parseValue(val);
+      }
+    },
+    { immediate: true }
+  );
 
-  watch(computeValue, (v) => updateValue(v))
+  watch(computeValue, (v) => updateValue(v));
 
   function updateValue(value) {
-    emit('change', value)
-    emit('update:value', value)
+    emit('change', value);
+    emit('update:value', value);
   }
 
   /**
@@ -107,71 +111,72 @@ export function useTabSetup(props, context, options) {
    */
   function parseValue(value) {
     if (value === computeValue.value) {
-      return
+      return;
     }
     try {
       if (!value || value === defaultValue.value) {
-        type.value = TypeEnum.every
+        type.value = TypeEnum.every;
       } else if (value.indexOf('?') >= 0) {
-        type.value = TypeEnum.unset
+        type.value = TypeEnum.unset;
       } else if (value.indexOf('-') >= 0) {
-        type.value = TypeEnum.range
-        const values = value.split('-')
+        type.value = TypeEnum.range;
+        const values = value.split('-');
         if (values.length >= 2) {
-          valueRange.start = parseInt(values[0])
-          valueRange.end = parseInt(values[1])
+          valueRange.start = parseInt(values[0]);
+          valueRange.end = parseInt(values[1]);
         }
       } else if (value.indexOf('/') >= 0) {
-        type.value = TypeEnum.loop
-        const values = value.split('/')
+        type.value = TypeEnum.loop;
+        const values = value.split('/');
         if (values.length >= 2) {
-          valueLoop.start = value[0] === '*' ? 0 : parseInt(values[0])
-          valueLoop.interval = parseInt(values[1])
+          valueLoop.start = value[0] === '*' ? 0 : parseInt(values[0]);
+          valueLoop.interval = parseInt(values[1]);
         }
       } else if (value.indexOf('W') >= 0) {
-        type.value = TypeEnum.work
-        const values = value.split('W')
+        type.value = TypeEnum.work;
+        const values = value.split('W');
         if (!values[0] && !isNaN(values[0])) {
-          valueWork.value = parseInt(values[0])
+          valueWork.value = parseInt(values[0]);
         }
       } else if (value.indexOf('L') >= 0) {
-        type.value = TypeEnum.last
+        type.value = TypeEnum.last;
       } else if (value.indexOf(',') >= 0 || !isNaN(value)) {
-        type.value = TypeEnum.specify
-        valueList.value = value.split(',').map(item => parseInt(item))
+        type.value = TypeEnum.specify;
+        valueList.value = value.split(',').map((item) => parseInt(item));
       } else {
-        type.value = TypeEnum.every
+        type.value = TypeEnum.every;
       }
     } catch (e) {
-      type.value = TypeEnum.every
+      type.value = TypeEnum.every;
     }
   }
 
   const beforeRadioAttrs = computed(() => ({
     class: ['choice'],
     disabled: props.disabled || unref(options.disabled),
-  }))
+  }));
   const inputNumberAttrs = computed(() => ({
     class: ['w60'],
     max: maxValue.value,
     min: minValue.value,
     precision: 0,
-  }))
+  }));
   const typeRangeAttrs = computed(() => ({
     disabled: type.value !== TypeEnum.range || props.disabled || unref(options.disabled),
     ...inputNumberAttrs.value,
-  }))
+  }));
   const typeLoopAttrs = computed(() => ({
     disabled: type.value !== TypeEnum.loop || props.disabled || unref(options.disabled),
     ...inputNumberAttrs.value,
-  }))
+  }));
   const typeSpecifyAttrs = computed(() => ({
     disabled: type.value !== TypeEnum.specify || props.disabled || unref(options.disabled),
     class: ['list-check-item'],
-  }))
+  }));
 
   return {
-    type, TypeEnum,
+    type,
+    TypeEnum,
     prefixCls,
     defaultValue,
     valueRange,
@@ -190,5 +195,5 @@ export function useTabSetup(props, context, options) {
     typeRangeAttrs,
     typeLoopAttrs,
     typeSpecifyAttrs,
-  }
-}
\ No newline at end of file
+  };
+}
diff --git a/src/components/Form/src/jeecg/components/JEasyCron/validator.ts b/src/components/Form/src/jeecg/components/JEasyCron/validator.ts
index e72fc00..308f1e8 100644
--- a/src/components/Form/src/jeecg/components/JEasyCron/validator.ts
+++ b/src/components/Form/src/jeecg/components/JEasyCron/validator.ts
@@ -1,48 +1,48 @@
-import CronParser from 'cron-parser'
-import type { ValidatorRule } from 'ant-design-vue/lib/form/interface'
+import CronParser from 'cron-parser';
+import type { ValidatorRule } from 'ant-design-vue/lib/form/interface';
 
 const cronRule: ValidatorRule = {
   validator({}, value) {
     // 没填写就不校验
     if (!value) {
-      return Promise.resolve()
+      return Promise.resolve();
     }
-    const values: string[] = value.split(' ').filter(item => !!item)
+    const values: string[] = value.split(' ').filter((item) => !!item);
     if (values.length > 7) {
-      return Promise.reject('Cron表达式最多7项！')
+      return Promise.reject('Cron表达式最多7项！');
     }
     // 检查第7项
-    let val: string = value
+    let val: string = value;
     if (values.length === 7) {
-      const year = values[6]
+      const year = values[6];
       if (year !== '*' && year !== '?') {
-        let yearValues: string[] = []
+        let yearValues: string[] = [];
         if (year.indexOf('-') >= 0) {
-          yearValues = year.split('-')
+          yearValues = year.split('-');
         } else if (year.indexOf('/')) {
-          yearValues = year.split('/')
+          yearValues = year.split('/');
         } else {
-          yearValues = [year]
+          yearValues = [year];
         }
         // 判断是否都是数字
-        const checkYear = yearValues.some(item => isNaN(Number(item)))
+        const checkYear = yearValues.some((item) => isNaN(Number(item)));
         if (checkYear) {
-          return Promise.reject('Cron表达式参数[年]错误：' + year)
+          return Promise.reject('Cron表达式参数[年]错误：' + year);
         }
       }
       // 取其中的前六项
-      val = values.slice(0, 6).join(' ')
+      val = values.slice(0, 6).join(' ');
     }
     // 6位 没有年
     // 5位没有秒、年
     try {
-      const iter = CronParser.parseExpression(val)
-      iter.next()
-      return Promise.resolve()
+      const iter = CronParser.parseExpression(val);
+      iter.next();
+      return Promise.resolve();
     } catch (e) {
-      return Promise.reject('Cron表达式错误：' + e)
+      return Promise.reject('Cron表达式错误：' + e);
     }
   },
-}
+};
 
-export default cronRule.validator
\ No newline at end of file
+export default cronRule.validator;
diff --git a/src/components/Form/src/jeecg/components/JEditor.vue b/src/components/Form/src/jeecg/components/JEditor.vue
index 9b725c3..3928fc9 100644
--- a/src/components/Form/src/jeecg/components/JEditor.vue
+++ b/src/components/Form/src/jeecg/components/JEditor.vue
@@ -1,40 +1,39 @@
 <template>
-  <Tinymce v-bind="bindProps" @change="onChange"/>
+  <Tinymce v-bind="bindProps" @change="onChange" />
 </template>
 
 <script lang="ts">
-import { computed, defineComponent } from 'vue'
+  import { computed, defineComponent } from 'vue';
 
-import { Tinymce } from '/@/components/Tinymce'
-import { propTypes } from '/@/utils/propTypes'
+  import { Tinymce } from '/@/components/Tinymce';
+  import { propTypes } from '/@/utils/propTypes';
 
-export default defineComponent({
-  name: 'JEditor',
-  // 不将 attrs 的属性绑定到 html 标签上
-  inheritAttrs: false,
-  components: { Tinymce },
-  props: {
-    value: propTypes.string.def(''),
-    disabled: propTypes.bool.def(false),
-  },
-  emits: ['change', 'update:value'],
-  setup(props, { emit, attrs }) {
-    // 合并 props 和 attrs
-    const bindProps = computed(() => Object.assign({}, props, attrs))
+  export default defineComponent({
+    name: 'JEditor',
+    // 不将 attrs 的属性绑定到 html 标签上
+    inheritAttrs: false,
+    components: { Tinymce },
+    props: {
+      value: propTypes.string.def(''),
+      disabled: propTypes.bool.def(false),
+    },
+    emits: ['change', 'update:value'],
+    setup(props, { emit, attrs }) {
+      // 合并 props 和 attrs
+      const bindProps = computed(() => Object.assign({}, props, attrs));
 
-    // value change 事件
-    function onChange(value) {
-      emit('change', value)
-      emit('update:value', value)
-    }
+      // value change 事件
+      function onChange(value) {
+        emit('change', value);
+        emit('update:value', value);
+      }
 
-    return {
-      bindProps,
-      onChange,
-    }
-  },
-})
+      return {
+        bindProps,
+        onChange,
+      };
+    },
+  });
 </script>
 
-<style lang="less" scoped>
-</style>
\ No newline at end of file
+<style lang="less" scoped></style>
diff --git a/src/components/Form/src/jeecg/components/JEllipsis.vue b/src/components/Form/src/jeecg/components/JEllipsis.vue
index 18a4d45..f63def4 100644
--- a/src/components/Form/src/jeecg/components/JEllipsis.vue
+++ b/src/components/Form/src/jeecg/components/JEllipsis.vue
@@ -1,20 +1,19 @@
 <template>
-    <a-tooltip placement="topLeft">
-        <template #title>
-            <span>{{value}}</span>
-        </template>
-        {{ showText }}
-    </a-tooltip>
+  <a-tooltip placement="topLeft">
+    <template #title>
+      <span>{{ value }}</span>
+    </template>
+    {{ showText }}
+  </a-tooltip>
 </template>
 <script lang="ts" setup>
-    import {computed} from 'vue';
-    import {propTypes} from "/@/utils/propTypes";
-
-    const props = defineProps({
-        value: propTypes.string.def(''),
-        length: propTypes.number.def(25),
-    });
-    //显示的文本
-    const showText = computed(() => props.value ? (props.value.length > props.length ? props.value.slice(0, props.length) + '...' : props.value) : props.value);
+  import { computed } from 'vue';
+  import { propTypes } from '/@/utils/propTypes';
 
+  const props = defineProps({
+    value: propTypes.string.def(''),
+    length: propTypes.number.def(25),
+  });
+  //显示的文本
+  const showText = computed(() => (props.value ? (props.value.length > props.length ? props.value.slice(0, props.length) + '...' : props.value) : props.value));
 </script>
diff --git a/src/components/Form/src/jeecg/components/JImageUpload.vue b/src/components/Form/src/jeecg/components/JImageUpload.vue
index 3adc93f..c15121b 100644
--- a/src/components/Form/src/jeecg/components/JImageUpload.vue
+++ b/src/components/Form/src/jeecg/components/JImageUpload.vue
@@ -1,32 +1,33 @@
 <template>
-    <div class="clearfix">
-        <a-upload
-                :listType="listType"
-                :multiple="multiple"
-                :action="uploadUrl"
-                :headers="headers"
-                :data="{biz:bizPath}"
-                v-model:fileList="uploadFileList"
-                :beforeUpload="beforeUpload"
-                :disabled="disabled"
-                @change="handleChange"
-                @preview="handlePreview">
-            <div v-if="uploadVisible">
-                <div v-if="listType=='picture-card'">
-                    <LoadingOutlined v-if="loading"/>
-                    <UploadOutlined v-else/>
-                    <div class="ant-upload-text">{{ text }}</div>
-                </div>
-                <a-button v-if="listType=='picture'">
-                    <UploadOutlined></UploadOutlined>
-                    {{ text }}
-                </a-button>
-            </div>
-        </a-upload>
-        <a-modal :visible="previewVisible" :footer="null" @cancel="handleCancel()">
-            <img alt="example" style="width: 100%" :src="previewImage"/>
-        </a-modal>
-    </div>
+  <div class="clearfix">
+    <a-upload
+      :listType="listType"
+      :multiple="multiple"
+      :action="uploadUrl"
+      :headers="headers"
+      :data="{ biz: bizPath }"
+      v-model:fileList="uploadFileList"
+      :beforeUpload="beforeUpload"
+      :disabled="disabled"
+      @change="handleChange"
+      @preview="handlePreview"
+    >
+      <div v-if="uploadVisible">
+        <div v-if="listType == 'picture-card'">
+          <LoadingOutlined v-if="loading" />
+          <UploadOutlined v-else />
+          <div class="ant-upload-text">{{ text }}</div>
+        </div>
+        <a-button v-if="listType == 'picture'">
+          <UploadOutlined></UploadOutlined>
+          {{ text }}
+        </a-button>
+      </div>
+    </a-upload>
+    <a-modal :visible="previewVisible" :footer="null" @cancel="handleCancel()">
+      <img alt="example" style="width: 100%" :src="previewImage" />
+    </a-modal>
+  </div>
 </template>
 <script lang="ts">
   import { defineComponent, PropType, ref, reactive, watchEffect, computed, unref, watch, onMounted } from 'vue';
@@ -46,10 +47,7 @@
     inheritAttrs: false,
     props: {
       //绑定值
-      value: propTypes.oneOfType([
-        propTypes.string,
-        propTypes.array,
-      ]),
+      value: propTypes.oneOfType([propTypes.string, propTypes.array]),
       //按钮文本
       listType: {
         type: String,
@@ -81,7 +79,7 @@
         default: 1,
       },
     },
-    emits: ['options-change', 'change','update:value'],
+    emits: ['options-change', 'change', 'update:value'],
     setup(props, { emit, refs }) {
       const emitData = ref<any[]>([]);
       const attrs = useAttrs();
@@ -114,7 +112,6 @@
         return props['fileMax'] > 1;
       });
 
-
       //计算是否可以继续上传
       const uploadVisible = computed(() => {
         return uploadFileList.value.length < props['fileMax'];
@@ -132,7 +129,7 @@
           if (initTag.value == true) {
             initFileList(val);
           }
-        },
+        }
       );
 
       /**
@@ -194,7 +191,7 @@
         }
         emitData.value = fileUrls.join(',');
         state.value = fileUrls.join(',');
-        emit('update:value',fileUrls.join(','))
+        emit('update:value', fileUrls.join(','));
       }
 
       /**
@@ -244,13 +241,13 @@
   });
 </script>
 <style scoped>
-    .ant-upload-select-picture-card i {
-        font-size: 32px;
-        color: #999;
-    }
+  .ant-upload-select-picture-card i {
+    font-size: 32px;
+    color: #999;
+  }
 
-    .ant-upload-select-picture-card .ant-upload-text {
-        margin-top: 8px;
-        color: #666;
-    }
+  .ant-upload-select-picture-card .ant-upload-text {
+    margin-top: 8px;
+    color: #666;
+  }
 </style>
diff --git a/src/components/Form/src/jeecg/components/JImportModal.vue b/src/components/Form/src/jeecg/components/JImportModal.vue
index cd5278f..eeae0db 100644
--- a/src/components/Form/src/jeecg/components/JImportModal.vue
+++ b/src/components/Form/src/jeecg/components/JImportModal.vue
@@ -1,179 +1,179 @@
 <template>
-    <div>
-        <BasicModal v-bind="$attrs" @register="register" title="导入EXCEL" :width="600" @cancel="handleClose" :confirmLoading="uploading" destroyOnClose>
-            <!--是否校验-->
-            <div style="margin: 0 5px 1px" v-if="online">
-                <span style="display: inline-block;height: 32px;line-height: 32px;vertical-align: middle;">是否开启校验:</span>
-                <span style="margin-left: 6px">
-                   <a-switch :checked="validateStatus==1" @change="handleChangeValidateStatus" checked-children="是" un-checked-children="否" size="small"/>
-                </span>
-            </div>
-            <!--上传-->
-            <a-upload name="file" accept=".xls,.xlsx" :multiple="true" :fileList="fileList" :remove="handleRemove" :beforeUpload="beforeUpload">
-                <a-button preIcon="ant-design:upload-outlined">选择导入文件</a-button>
-            </a-upload>
-            <!--页脚-->
-            <template #footer>
-                <a-button @click="handleClose">关闭</a-button>
-                <a-button type="primary" @click="handleImport" :disabled="uploadDisabled" :loading="uploading">{{ uploading ? '上传中...' : '开始上传' }}</a-button>
-            </template>
-        </BasicModal>
-    </div>
+  <div>
+    <BasicModal v-bind="$attrs" @register="register" title="导入EXCEL" :width="600" @cancel="handleClose" :confirmLoading="uploading" destroyOnClose>
+      <!--是否校验-->
+      <div style="margin: 0 5px 1px" v-if="online">
+        <span style="display: inline-block; height: 32px; line-height: 32px; vertical-align: middle">是否开启校验:</span>
+        <span style="margin-left: 6px">
+          <a-switch :checked="validateStatus == 1" @change="handleChangeValidateStatus" checked-children="是" un-checked-children="否" size="small" />
+        </span>
+      </div>
+      <!--上传-->
+      <a-upload name="file" accept=".xls,.xlsx" :multiple="true" :fileList="fileList" :remove="handleRemove" :beforeUpload="beforeUpload">
+        <a-button preIcon="ant-design:upload-outlined">选择导入文件</a-button>
+      </a-upload>
+      <!--页脚-->
+      <template #footer>
+        <a-button @click="handleClose">关闭</a-button>
+        <a-button type="primary" @click="handleImport" :disabled="uploadDisabled" :loading="uploading">{{ uploading ? '上传中...' : '开始上传' }}</a-button>
+      </template>
+    </BasicModal>
+  </div>
 </template>
 
 <script lang="ts">
-    import {defineComponent, ref, unref, watchEffect, computed} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {useAttrs} from '/@/hooks/core/useAttrs';
-    import {defHttp} from '/@/utils/http/axios';
-    import {useGlobSetting} from '/@/hooks/setting';
-    import {useMessage} from '/@/hooks/web/useMessage';
+  import { defineComponent, ref, unref, watchEffect, computed } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { defHttp } from '/@/utils/http/axios';
+  import { useGlobSetting } from '/@/hooks/setting';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
-    export default defineComponent({
-        name: 'JImportModal',
-        components: {
-            BasicModal,
-        },
-        props: {
-            url: {
-                type: String,
-                default: '',
-                required: false
-            },
-            biz: {
-                type: String,
-                default: '',
-                required: false
-            },
-            //是否online导入
-            online: {
-                type: Boolean,
-                default: false,
-                required: false
+  export default defineComponent({
+    name: 'JImportModal',
+    components: {
+      BasicModal,
+    },
+    props: {
+      url: {
+        type: String,
+        default: '',
+        required: false,
+      },
+      biz: {
+        type: String,
+        default: '',
+        required: false,
+      },
+      //是否online导入
+      online: {
+        type: Boolean,
+        default: false,
+        required: false,
+      },
+    },
+    emits: ['ok', 'register'],
+    setup(props, { emit, refs }) {
+      const { createMessage, createWarningModal } = useMessage();
+      //注册弹框
+      const [register, { closeModal }] = useModalInner((data) => {
+        reset(data);
+      });
+      const glob = useGlobSetting();
+      const attrs = useAttrs();
+      const uploading = ref(false);
+      //文件集合
+      const fileList = ref([]);
+      //上传url
+      const uploadAction = ref('');
+      const foreignKeys = ref('');
+      //校验状态
+      const validateStatus = ref(0);
+      const getBindValue = Object.assign({}, unref(props), unref(attrs));
+      //监听url
+      watchEffect(() => {
+        props.url && (uploadAction.value = `${glob.uploadUrl}${props.url}`);
+      });
+      //按钮disabled状态
+      const uploadDisabled = computed(() => !(unref(fileList).length > 0));
+
+      //关闭方法
+      function handleClose() {
+        closeModal() && reset();
+      }
+
+      //校验状态切换
+      function handleChangeValidateStatus(checked) {
+        validateStatus.value = !!checked ? 1 : 0;
+      }
+
+      //移除上传文件
+      function handleRemove(file) {
+        const index = unref(fileList).indexOf(file);
+        const newFileList = unref(fileList).slice();
+        newFileList.splice(index, 1);
+        fileList.value = newFileList;
+      }
+
+      //上传前处理
+      function beforeUpload(file) {
+        fileList.value = [...unref(fileList), file];
+        return false;
+      }
+
+      //文件上传
+      function handleImport() {
+        let { biz, online } = props;
+        const formData = new FormData();
+        if (biz) {
+          formData.append('isSingleTableImport', biz);
+        }
+        if (unref(foreignKeys) && unref(foreignKeys).length > 0) {
+          formData.append('foreignKeys', unref(foreignKeys));
+        }
+        if (!!online) {
+          formData.append('validateStatus', unref(validateStatus));
+        }
+        unref(fileList).forEach((file) => {
+          formData.append('files[]', file);
+        });
+        uploading.value = true;
+
+        //TODO 请求怎样处理的问题
+        let headers = {
+          'Content-Type': 'multipart/form-data;boundary = ' + new Date().getTime(),
+        };
+        defHttp.post({ url: props.url, params: formData, headers }, { isTransformResponse: false }).then((res) => {
+          uploading.value = false;
+          if (res.success) {
+            if (res.code == 201) {
+              errorTip(res.message, res.result);
+            } else {
+              createMessage.success(res.message);
             }
-        },
-        emits: ['ok','register'],
-        setup(props, {emit, refs}) {
-            const {createMessage, createWarningModal} = useMessage();
-            //注册弹框
-            const [register, {closeModal}] = useModalInner((data) => {
-                reset(data);
-            });
-            const glob = useGlobSetting();
-            const attrs = useAttrs();
-            const uploading = ref(false);
-            //文件集合
-            const fileList = ref([]);
-            //上传url
-            const uploadAction = ref('');
-            const foreignKeys = ref('');
-            //校验状态
-            const validateStatus = ref(0);
-            const getBindValue = Object.assign({}, unref(props), unref(attrs));
-            //监听url
-            watchEffect(() => {
-                props.url && (uploadAction.value = `${glob.uploadUrl}${props.url}`);
-            });
-            //按钮disabled状态
-            const uploadDisabled = computed(() => !(unref(fileList).length > 0));
+            handleClose();
+            reset();
+            emit('ok');
+          } else {
+            createMessage.warning(res.message);
+          }
+        });
+      }
 
-            //关闭方法
-            function handleClose() {
-                closeModal() && reset()
-            }
-
-            //校验状态切换
-            function handleChangeValidateStatus(checked) {
-                validateStatus.value = !!checked ? 1 : 0;
-            }
-
-            //移除上传文件
-            function handleRemove(file) {
-                const index = unref(fileList).indexOf(file);
-                const newFileList = unref(fileList).slice();
-                newFileList.splice(index, 1);
-                fileList.value = newFileList
-            }
-
-            //上传前处理
-            function beforeUpload(file) {
-                fileList.value = [...unref(fileList), file];
-                return false;
-            }
-
-            //文件上传
-            function handleImport() {
-                let {biz, online} = props;
-                const formData = new FormData();
-                if (biz) {
-                    formData.append('isSingleTableImport', biz);
-                }
-                if (unref(foreignKeys) && unref(foreignKeys).length > 0) {
-                    formData.append('foreignKeys', unref(foreignKeys));
-                }
-                if (!!online) {
-                    formData.append('validateStatus', unref(validateStatus));
-                }
-                unref(fileList).forEach((file) => {
-                    formData.append('files[]', file);
-                });
-                uploading.value = true;
-
-                //TODO 请求怎样处理的问题
-                  let headers={
-                    'Content-Type': 'multipart/form-data;boundary = ' + new Date().getTime()
-                  }
-                defHttp.post({url: props.url,params:formData,headers},{isTransformResponse:false}).then((res) => {
-                    uploading.value = false;
-                    if (res.success) {
-                        if (res.code == 201) {
-                            errorTip(res.message, res.result)
-                        } else {
-                            createMessage.success(res.message)
-                        }
-                        handleClose();
-                        reset();
-                        emit('ok')
-                    } else {
-                        createMessage.warning(res.message)
-                    }
-                })
-            }
-
-            //错误信息提示
-            function errorTip(tipMessage, fileUrl) {
-                let href = glob.uploadUrl + fileUrl;
-                createWarningModal({
-                    title: '导入成功,但是有错误数据!',
-                    centered: false,
-                    content: `<div>
+      //错误信息提示
+      function errorTip(tipMessage, fileUrl) {
+        let href = glob.uploadUrl + fileUrl;
+        createWarningModal({
+          title: '导入成功,但是有错误数据!',
+          centered: false,
+          content: `<div>
                         <span>${tipMessage}</span><br/>
                         <span>具体详情请<a href = ${href} target="_blank"> 点击下载 </a> </span>
-                      </div>`
-                })
-            }
+                      </div>`,
+        });
+      }
 
-            //重置
-            function reset(arg?) {
-                fileList.value = [];
-                uploading.value = false;
-                foreignKeys.value = arg;
-                validateStatus.value = 0
-            }
+      //重置
+      function reset(arg?) {
+        fileList.value = [];
+        uploading.value = false;
+        foreignKeys.value = arg;
+        validateStatus.value = 0;
+      }
 
-            return {
-                register,
-                getBindValue,
-                uploadDisabled,
-                fileList,
-                uploading,
-                validateStatus,
-                handleClose,
-                handleChangeValidateStatus,
-                handleRemove,
-                beforeUpload,
-                handleImport,
-            };
-        },
-    });
+      return {
+        register,
+        getBindValue,
+        uploadDisabled,
+        fileList,
+        uploading,
+        validateStatus,
+        handleClose,
+        handleChangeValidateStatus,
+        handleRemove,
+        beforeUpload,
+        handleImport,
+      };
+    },
+  });
 </script>
diff --git a/src/components/Form/src/jeecg/components/JInput.vue b/src/components/Form/src/jeecg/components/JInput.vue
index 58bcede..a7e8077 100644
--- a/src/components/Form/src/jeecg/components/JInput.vue
+++ b/src/components/Form/src/jeecg/components/JInput.vue
@@ -1,107 +1,105 @@
 <template>
-    <a-input v-bind="getBindValue" v-model:value="showText" @input="backValue"></a-input>
+  <a-input v-bind="getBindValue" v-model:value="showText" @input="backValue"></a-input>
 </template>
 
 <script lang="ts">
-    import {defineComponent, PropType, ref, watchEffect, unref, watch} from 'vue';
-    import {useAttrs} from '/@/hooks/core/useAttrs';
-    import {propTypes} from '/@/utils/propTypes';
-    import {JInputTypeEnum} from '/@/enums/jeecgEnum.ts';
+  import { defineComponent, PropType, ref, watchEffect, unref, watch } from 'vue';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { propTypes } from '/@/utils/propTypes';
+  import { JInputTypeEnum } from '/@/enums/jeecgEnum.ts';
 
-    export default defineComponent({
-        name: 'JInput',
-        inheritAttrs: false,
-        props: {
-            value: propTypes.string.def(''),
-            type: propTypes.string.def(JInputTypeEnum.JINPUT_QUERY_LIKE),
-            placeholder: propTypes.string.def(''),
-            trim: propTypes.bool.def(false),
+  export default defineComponent({
+    name: 'JInput',
+    inheritAttrs: false,
+    props: {
+      value: propTypes.string.def(''),
+      type: propTypes.string.def(JInputTypeEnum.JINPUT_QUERY_LIKE),
+      placeholder: propTypes.string.def(''),
+      trim: propTypes.bool.def(false),
+    },
+    emits: ['change', 'update:value'],
+    setup(props, { emit }) {
+      const attrs = useAttrs();
+      //表单值
+      const showText = ref('');
+      //绑定属性
+      const getBindValue = Object.assign({}, unref(props), unref(attrs));
+      //监听类型变化
+      watch(
+        () => props.type,
+        (val) => {
+          val && backValue({ target: { value: unref(showText) } });
+        }
+      );
+      //监听value变化
+      watch(
+        () => props.value,
+        () => {
+          initVal();
         },
-        emits: ['change','update:value'],
-        setup(props, {emit}) {
-            const attrs = useAttrs();
-            //表单值
-            const showText = ref('');
-            //绑定属性
-            const getBindValue = Object.assign({}, unref(props), unref(attrs));
-            //监听类型变化
-            watch(
-                () => props.type,
-                (val) => {
-                    val && backValue({target: {value: unref(showText)}});
-                }
-            );
-            //监听value变化
-            watch(
-                () => props.value,
-                () => {
-                    initVal();
-                },
-                {immediate: true}
-            );
+        { immediate: true }
+      );
 
-            /**
-             * 初始化数值
-             */
-            function initVal() {
-                if (!props.value) {
-                    showText.value = ''
-                } else {
-                    let text = props.value;
-                    switch (props.type) {
-                        case JInputTypeEnum.JINPUT_QUERY_LIKE:
-                            //修复路由传参的值传送到jinput框被前后各截取了一位 #1336
-                            if (text.indexOf("*") != -1) {
-                                text = text.substring(1, text.length - 1);
-                            }
-                            break;
-                        case JInputTypeEnum.JINPUT_QUERY_NE:
-                            text = text.substring(1);
-                            break;
-                        case JInputTypeEnum.JINPUT_QUERY_GE:
-                            text = text.substring(2);
-                            break;
-                        case JInputTypeEnum.JINPUT_QUERY_LE:
-                            text = text.substring(2);
-                            break;
-                        default:
-                    }
-                    showText.value = text
-                }
-            }
+      /**
+       * 初始化数值
+       */
+      function initVal() {
+        if (!props.value) {
+          showText.value = '';
+        } else {
+          let text = props.value;
+          switch (props.type) {
+            case JInputTypeEnum.JINPUT_QUERY_LIKE:
+              //修复路由传参的值传送到jinput框被前后各截取了一位 #1336
+              if (text.indexOf('*') != -1) {
+                text = text.substring(1, text.length - 1);
+              }
+              break;
+            case JInputTypeEnum.JINPUT_QUERY_NE:
+              text = text.substring(1);
+              break;
+            case JInputTypeEnum.JINPUT_QUERY_GE:
+              text = text.substring(2);
+              break;
+            case JInputTypeEnum.JINPUT_QUERY_LE:
+              text = text.substring(2);
+              break;
+            default:
+          }
+          showText.value = text;
+        }
+      }
 
-            /**
-             * 返回值
-             */
-            function backValue(e) {
-                let text = e?.target?.value??'';
-                if (text && !!props.trim) {
-                    text = text.trim()
-                }
-                switch (props.type) {
-                    case JInputTypeEnum.JINPUT_QUERY_LIKE:
-                        text = "*" + text + "*";
-                        break;
-                    case JInputTypeEnum.JINPUT_QUERY_NE:
-                        text = "!" + text;
-                        break;
-                    case JInputTypeEnum.JINPUT_QUERY_GE:
-                        text = ">=" + text;
-                        break;
-                    case JInputTypeEnum.JINPUT_QUERY_LE:
-                        text = "<=" + text;
-                        break;
-                    default:
-                }
-                emit("change", text)
-                emit("update:value", text)
-            }
+      /**
+       * 返回值
+       */
+      function backValue(e) {
+        let text = e?.target?.value ?? '';
+        if (text && !!props.trim) {
+          text = text.trim();
+        }
+        switch (props.type) {
+          case JInputTypeEnum.JINPUT_QUERY_LIKE:
+            text = '*' + text + '*';
+            break;
+          case JInputTypeEnum.JINPUT_QUERY_NE:
+            text = '!' + text;
+            break;
+          case JInputTypeEnum.JINPUT_QUERY_GE:
+            text = '>=' + text;
+            break;
+          case JInputTypeEnum.JINPUT_QUERY_LE:
+            text = '<=' + text;
+            break;
+          default:
+        }
+        emit('change', text);
+        emit('update:value', text);
+      }
 
-            return {showText, attrs, getBindValue, backValue};
-        },
-    });
+      return { showText, attrs, getBindValue, backValue };
+    },
+  });
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/components/Form/src/jeecg/components/JInputPop.vue b/src/components/Form/src/jeecg/components/JInputPop.vue
index 4823e17..9b81b3c 100644
--- a/src/components/Form/src/jeecg/components/JInputPop.vue
+++ b/src/components/Form/src/jeecg/components/JInputPop.vue
@@ -1,122 +1,109 @@
 <template>
-  <a-popover
-      trigger="contextmenu"
-      v-model:visible="visible"
-      :overlayClassName="`${prefixCls}-popover`"
-      :getPopupContainer="getPopupContainer"
-      :placement="position">
+  <a-popover trigger="contextmenu" v-model:visible="visible" :overlayClassName="`${prefixCls}-popover`" :getPopupContainer="getPopupContainer" :placement="position">
     <template #title>
       <span>{{ title }}</span>
       <span style="float: right" title="关闭">
-        <Icon icon="ant-design:close-outlined" @click="visible = false"/>
+        <Icon icon="ant-design:close-outlined" @click="visible = false" />
       </span>
     </template>
     <template #content>
-      <a-textarea
-          ref="textareaRef"
-          :value="innerValue"
-          :disabled="disabled"
-          :style="textareaStyle"
-          v-bind="attrs"
-          @input="onInputChange"/>
+      <a-textarea ref="textareaRef" :value="innerValue" :disabled="disabled" :style="textareaStyle" v-bind="attrs" @input="onInputChange" />
     </template>
-    <a-input
-        :class="`${prefixCls}-input`"
-        :value="innerValue"
-        :disabled="disabled"
-        v-bind="attrs"
-        @change="onInputChange">
+    <a-input :class="`${prefixCls}-input`" :value="innerValue" :disabled="disabled" v-bind="attrs" @change="onInputChange">
       <template #suffix>
-        <Icon icon="ant-design:fullscreen-outlined" @click.stop="onShowPopup"/>
+        <Icon icon="ant-design:fullscreen-outlined" @click.stop="onShowPopup" />
       </template>
     </a-input>
   </a-popover>
 </template>
 
 <script lang="ts" setup>
-import { computed, nextTick, ref, watch } from 'vue'
-import Icon from '/@/components/Icon/src/Icon.vue'
-import { useAttrs } from '/@/hooks/core/useAttrs'
-import { propTypes } from '/@/utils/propTypes'
-import { useDesign } from '/@/hooks/web/useDesign'
+  import { computed, nextTick, ref, watch } from 'vue';
+  import Icon from '/@/components/Icon/src/Icon.vue';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useDesign } from '/@/hooks/web/useDesign';
 
-const { prefixCls } = useDesign('j-input-popup')
-const props = defineProps({
-  // v-model:value
-  value: propTypes.string.def(''),
-  title: propTypes.string.def(''),
-  // 弹出框显示位置
-  position: propTypes.string.def('right'),
-  width: propTypes.number.def(300),
-  height: propTypes.number.def(150),
-  disabled: propTypes.bool.def(false),
-  // 弹出框挂载的元素ID
-  popContainer: propTypes.string.def(''),
-})
-const attrs = useAttrs()
-const emit = defineEmits(['change', 'update:value'])
+  const { prefixCls } = useDesign('j-input-popup');
+  const props = defineProps({
+    // v-model:value
+    value: propTypes.string.def(''),
+    title: propTypes.string.def(''),
+    // 弹出框显示位置
+    position: propTypes.string.def('right'),
+    width: propTypes.number.def(300),
+    height: propTypes.number.def(150),
+    disabled: propTypes.bool.def(false),
+    // 弹出框挂载的元素ID
+    popContainer: propTypes.string.def(''),
+  });
+  const attrs = useAttrs();
+  const emit = defineEmits(['change', 'update:value']);
 
-const visible = ref<boolean>(false)
-const innerValue = ref<string>('')
-// textarea ref对象
-const textareaRef = ref()
-// textarea 样式
-const textareaStyle = computed(() => ({
-  height: `${props.height}px`,
-  width: `${props.width}px`,
-}))
+  const visible = ref<boolean>(false);
+  const innerValue = ref<string>('');
+  // textarea ref对象
+  const textareaRef = ref();
+  // textarea 样式
+  const textareaStyle = computed(() => ({
+    height: `${props.height}px`,
+    width: `${props.width}px`,
+  }));
 
-watch(() => props.value, (value) => {
-  if (value && value.length > 0) {
-    innerValue.value = value
+  watch(
+    () => props.value,
+    (value) => {
+      if (value && value.length > 0) {
+        innerValue.value = value;
+      }
+    },
+    { immediate: true }
+  );
+
+  function onInputChange(event) {
+    innerValue.value = event.target.value;
+    emitValue(innerValue.value);
   }
-}, { immediate: true })
 
-
-function onInputChange(event) {
-  innerValue.value = event.target.value
-  emitValue(innerValue.value)
-}
-
-async function onShowPopup() {
-  visible.value = true
-  await nextTick()
-  textareaRef.value?.focus()
-}
-
-// 获取弹出框挂载的元素
-function getPopupContainer(node) {
-  if (!props.popContainer) {
-    return node.parentNode
-  } else {
-    return document.getElementById(props.popContainer)
+  async function onShowPopup() {
+    visible.value = true;
+    await nextTick();
+    textareaRef.value?.focus();
   }
-}
 
-function emitValue(value) {
-  emit('change', value)
-  emit('update:value', value)
-}
+  // 获取弹出框挂载的元素
+  function getPopupContainer(node) {
+    if (!props.popContainer) {
+      return node.parentNode;
+    } else {
+      return document.getElementById(props.popContainer);
+    }
+  }
+
+  function emitValue(value) {
+    emit('change', value);
+    emit('update:value', value);
+  }
 </script>
 
 <style lang="less">
-//noinspection LessUnresolvedVariable
-@prefix-cls: ~'@{namespace}-j-input-popup';
+  //noinspection LessUnresolvedVariable
+  @prefix-cls: ~'@{namespace}-j-input-popup';
 
-.@{prefix-cls} {
-  &-popover {
-  }
+  .@{prefix-cls} {
+    &-popover {
+    }
 
-  &-input {
-    .app-iconify {
-      cursor: pointer;
-      color: #666666;
-      transition: color 0.3s;
+    &-input {
+      .app-iconify {
+        cursor: pointer;
+        color: #666666;
+        transition: color 0.3s;
 
-      &:hover {
-        color: black;
+        &:hover {
+          color: black;
+        }
       }
     }
   }
-}
-</style>
\ No newline at end of file
+</style>
diff --git a/src/components/Form/src/jeecg/components/JMarkdownEditor.vue b/src/components/Form/src/jeecg/components/JMarkdownEditor.vue
index d9ae41c..b9d2b5c 100644
--- a/src/components/Form/src/jeecg/components/JMarkdownEditor.vue
+++ b/src/components/Form/src/jeecg/components/JMarkdownEditor.vue
@@ -1,54 +1,57 @@
 <template>
-  <MarkDown v-bind="bindProps" @change="onChange" @get="onGetVditor"/>
+  <MarkDown v-bind="bindProps" @change="onChange" @get="onGetVditor" />
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, watch } from 'vue'
-import { MarkDown } from '/@/components/Markdown'
-import { propTypes } from '/@/utils/propTypes'
+  import { computed, defineComponent, watch } from 'vue';
+  import { MarkDown } from '/@/components/Markdown';
+  import { propTypes } from '/@/utils/propTypes';
 
-export default defineComponent({
-  name: 'JMarkdownEditor',
-  // 不将 attrs 的属性绑定到 html 标签上
-  inheritAttrs: false,
-  components: { MarkDown },
-  props: {
-    value: propTypes.string.def(''),
-    disabled: propTypes.bool.def(false),
-  },
-  emits: ['change', 'update:value'],
-  setup(props, { emit, attrs }) {
-    // markdown 组件实例
-    let mdRef: any = null
-    // vditor 组件实例
-    let vditorRef: any = null
-    // 合并 props 和 attrs
-    const bindProps = computed(() => Object.assign({}, props, attrs))
+  export default defineComponent({
+    name: 'JMarkdownEditor',
+    // 不将 attrs 的属性绑定到 html 标签上
+    inheritAttrs: false,
+    components: { MarkDown },
+    props: {
+      value: propTypes.string.def(''),
+      disabled: propTypes.bool.def(false),
+    },
+    emits: ['change', 'update:value'],
+    setup(props, { emit, attrs }) {
+      // markdown 组件实例
+      let mdRef: any = null;
+      // vditor 组件实例
+      let vditorRef: any = null;
+      // 合并 props 和 attrs
+      const bindProps = computed(() => Object.assign({}, props, attrs));
 
-    // 相当于 onMounted
-    function onGetVditor(instance) {
-      mdRef = instance
-      vditorRef = mdRef.getVditor()
+      // 相当于 onMounted
+      function onGetVditor(instance) {
+        mdRef = instance;
+        vditorRef = mdRef.getVditor();
 
-      // 监听禁用，切换编辑器禁用状态
-      watch(() => props.disabled, disabled => disabled ? vditorRef.disabled() : vditorRef.enable(), { immediate: true })
-    }
+        // 监听禁用，切换编辑器禁用状态
+        watch(
+          () => props.disabled,
+          (disabled) => (disabled ? vditorRef.disabled() : vditorRef.enable()),
+          { immediate: true }
+        );
+      }
 
-    // value change 事件
-    function onChange(value) {
-      emit('change', value)
-      emit('update:value', value)
-    }
+      // value change 事件
+      function onChange(value) {
+        emit('change', value);
+        emit('update:value', value);
+      }
 
-    return {
-      bindProps,
+      return {
+        bindProps,
 
-      onChange,
-      onGetVditor,
-    }
-  },
-})
+        onChange,
+        onGetVditor,
+      };
+    },
+  });
 </script>
 
-<style lang="less" scoped>
-</style>
\ No newline at end of file
+<style lang="less" scoped></style>
diff --git a/src/components/Form/src/jeecg/components/JOnlineSelectCascade.vue b/src/components/Form/src/jeecg/components/JOnlineSelectCascade.vue
index dddbe47..12f233b 100644
--- a/src/components/Form/src/jeecg/components/JOnlineSelectCascade.vue
+++ b/src/components/Form/src/jeecg/components/JOnlineSelectCascade.vue
@@ -1,24 +1,24 @@
 <template>
-    <!-- 级联下拉框 form组件 暂且只在online使用 不对外提供api -->
-    <a-select :placeholder="placeholder" :value="selectedValue" @change="handleChange" allowClear style="width:100%">
-        <a-select-option v-for="(item, index) in dictOptions" :key="index" :value="item.store">
-             <span style="display: inline-block;width: 100%" :title=" item.label ">{{ item.label }}</span>
-        </a-select-option>
-    </a-select>
+  <!-- 级联下拉框 form组件 暂且只在online使用 不对外提供api -->
+  <a-select :placeholder="placeholder" :value="selectedValue" @change="handleChange" allowClear style="width: 100%">
+    <a-select-option v-for="(item, index) in dictOptions" :key="index" :value="item.store">
+      <span style="display: inline-block; width: 100%" :title="item.label">{{ item.label }}</span>
+    </a-select-option>
+  </a-select>
 </template>
 
 <script lang="ts">
   import { defineComponent, watch, ref } from 'vue';
   import { defHttp } from '/@/utils/http/axios';
   import { useMessage } from '/@/hooks/web/useMessage';
-  
+
   /**获取下拉选项*/
   const SELECT_OPTIONS_URL = '/online/cgform/api/querySelectOptions';
-  
+
   export default defineComponent({
-    name: "JOnlineSelectCascade",
-    props:{
-      table:{ type: String, default: '' },
+    name: 'JOnlineSelectCascade',
+    props: {
+      table: { type: String, default: '' },
       txt: { type: String, default: '' },
       store: { type: String, default: '' },
       idField: { type: String, default: '' },
@@ -26,188 +26,195 @@
       pidValue: { type: String, default: '-1' },
       origin: { type: Boolean, default: false },
       condition: { type: String, default: '' },
-      value:{ type: String, default: '' },
-      isNumber:{ type: Boolean, default: false },
+      value: { type: String, default: '' },
+      isNumber: { type: Boolean, default: false },
       placeholder: { type: String, default: '请选择' },
     },
-    emits: [ 'change', 'next'],
-    setup(props, { emit }){
-      const { createMessage: $message } = useMessage()
+    emits: ['change', 'next'],
+    setup(props, { emit }) {
+      const { createMessage: $message } = useMessage();
       // 选中值
       const selectedValue = ref<any>('');
       // 选项数组
-      const dictOptions = ref<any[]>([])
-      const optionsLoad = ref(true)
+      const dictOptions = ref<any[]>([]);
+      const optionsLoad = ref(true);
       // 选项改变事件
       function handleChange(value) {
-        console.log('handleChange', value)
+        console.log('handleChange', value);
         // 这个value是 存储的值 实际还需要获取id值
-        let temp = value || ''
-        emit('change', temp)
-        valueChangeThenEmitNext(temp)
+        let temp = value || '';
+        emit('change', temp);
+        valueChangeThenEmitNext(temp);
       }
 
       // 第一个节点 选项加载走condition
-      watch(()=>props.condition, (val)=>{
-        optionsLoad.value = true;
-        if(val){
-          loadOptions();
-        }
-      }, {immediate:true});
+      watch(
+        () => props.condition,
+        (val) => {
+          optionsLoad.value = true;
+          if (val) {
+            loadOptions();
+          }
+        },
+        { immediate: true }
+      );
 
       // 被联动节点 选项加载走pidValue
-      watch(()=>props.pidValue, (val)=>{
-        if(val === '-1'){
-          dictOptions.value = []
-        }else{
-          loadOptions();
+      watch(
+        () => props.pidValue,
+        (val) => {
+          if (val === '-1') {
+            dictOptions.value = [];
+          } else {
+            loadOptions();
+          }
         }
-      });
+      );
 
       // 值回显
-      watch(()=>props.value, (newVal, oldVal)=>{
-        console.log('值改变事件', newVal, oldVal)
-        if(!newVal){
-          // value不存在的时候--
-          selectedValue.value = []
-          if(oldVal){
-            // 如果oldVal存在， 需要往上抛事件
-            emit('change', '')
-            emit('next', '-1')
+      watch(
+        () => props.value,
+        (newVal, oldVal) => {
+          console.log('值改变事件', newVal, oldVal);
+          if (!newVal) {
+            // value不存在的时候--
+            selectedValue.value = [];
+            if (oldVal) {
+              // 如果oldVal存在， 需要往上抛事件
+              emit('change', '');
+              emit('next', '-1');
+            }
+          } else {
+            // value存在的时候
+            selectedValue.value = newVal;
           }
-        }else{
-          // value存在的时候
-          selectedValue.value = newVal
-        }
-        if(newVal && !oldVal){
-          // 有新值没有旧值 表单第一次加载赋值 需要往外抛一个事件 触发下级options的加载
-          handleFirstValueSetting(newVal)
-        }
-      }, {immediate:true});
-
+          if (newVal && !oldVal) {
+            // 有新值没有旧值 表单第一次加载赋值 需要往外抛一个事件 触发下级options的加载
+            handleFirstValueSetting(newVal);
+          }
+        },
+        { immediate: true }
+      );
 
       /**
        * 第一次加载赋值
-       */ 
-      async function handleFirstValueSetting(value){
-        if(props.idField === props.store){
+       */
+      async function handleFirstValueSetting(value) {
+        if (props.idField === props.store) {
           // 如果id字段就是存储字段 那么可以不用调用请求
-          emit('next', value)
-        }else{
-          if(props.origin===true){
+          emit('next', value);
+        } else {
+          if (props.origin === true) {
             // 如果是联动组件的第一个组件，等待options加载完后从options中取值
-            await getSelfOptions()
-            valueChangeThenEmitNext(value)
-          }else{
+            await getSelfOptions();
+            valueChangeThenEmitNext(value);
+          } else {
             // 如果是联动组件的后续组件，根据选中的value加载一遍数据
             let arr = await loadValueText();
-            valueChangeThenEmitNext(value, arr)
+            valueChangeThenEmitNext(value, arr);
           }
         }
       }
-      
+
       function loadOptions() {
         let params = getQueryParams();
-        if(props.origin===true){
-          params['condition'] = props.condition
-        }else{
-          params['pidValue'] = props.pidValue
+        if (props.origin === true) {
+          params['condition'] = props.condition;
+        } else {
+          params['pidValue'] = props.pidValue;
         }
-        console.log("请求参数", params)
-        dictOptions.value = []
-        defHttp.get({ url: SELECT_OPTIONS_URL, params},{ isTransformResponse: false }).then(res=>{
-          if(res.success){
-            dictOptions.value = [...res.result]
-            console.log("请求结果", res.result, dictOptions)
-          }else{
-            $message.warning('联动组件数据加载失败,请检查配置!')
+        console.log('请求参数', params);
+        dictOptions.value = [];
+        defHttp.get({ url: SELECT_OPTIONS_URL, params }, { isTransformResponse: false }).then((res) => {
+          if (res.success) {
+            dictOptions.value = [...res.result];
+            console.log('请求结果', res.result, dictOptions);
+          } else {
+            $message.warning('联动组件数据加载失败,请检查配置!');
           }
-        })
+        });
       }
-      
-      function getQueryParams(){
+
+      function getQueryParams() {
         let params = {
-          table: props.table, 
+          table: props.table,
           txt: props.txt,
           key: props.store,
           idField: props.idField,
-          pidField: props.pidField
-        }
+          pidField: props.pidField,
+        };
         return params;
       }
 
-
       function loadValueText() {
-        return new Promise(resolve => {
-          if(!props.value){
-            selectedValue.value = []
-            resolve([])
-          }else{
+        return new Promise((resolve) => {
+          if (!props.value) {
+            selectedValue.value = [];
+            resolve([]);
+          } else {
             let params = getQueryParams();
-            if(props.isNumber === true){
-              params['condition'] = `${props.store} = ${props.value}`
-            }else{
-              params['condition'] = `${props.store} = '${props.value}'`
+            if (props.isNumber === true) {
+              params['condition'] = `${props.store} = ${props.value}`;
+            } else {
+              params['condition'] = `${props.store} = '${props.value}'`;
             }
-            defHttp.get({ url: SELECT_OPTIONS_URL, params},{ isTransformResponse: false }).then(res=>{
-              if(res.success){
-                resolve(res.result)
-              }else{
-                $message.warning('联动组件数据加载失败,请检查配置!')
-                resolve([])
+            defHttp.get({ url: SELECT_OPTIONS_URL, params }, { isTransformResponse: false }).then((res) => {
+              if (res.success) {
+                resolve(res.result);
+              } else {
+                $message.warning('联动组件数据加载失败,请检查配置!');
+                resolve([]);
               }
-            })
+            });
           }
-        })
+        });
       }
 
       /**
-       * 获取下拉选项 
+       * 获取下拉选项
        */
       function getSelfOptions() {
         return new Promise((resolve) => {
           let index = 0;
           (function next(index) {
-            if(index>10){
-              resolve([])
+            if (index > 10) {
+              resolve([]);
             }
-            let arr = dictOptions.value
-            if (arr && arr.length>0) {
-              resolve(arr)
+            let arr = dictOptions.value;
+            if (arr && arr.length > 0) {
+              resolve(arr);
             } else {
               setTimeout(() => {
-                next(index++)
-              }, 300)
+                next(index++);
+              }, 300);
             }
-          })(index)
-        })
+          })(index);
+        });
       }
 
       /**
        * 值改变后 需要往外抛事件 触发下级节点的选项改变
        */
-      function valueChangeThenEmitNext(value, arr:any=[]){
-        if(value && value.length>0){
-          if(!arr || arr.length==0){
-            arr = dictOptions.value
+      function valueChangeThenEmitNext(value, arr: any = []) {
+        if (value && value.length > 0) {
+          if (!arr || arr.length == 0) {
+            arr = dictOptions.value;
           }
-          let selected = arr.filter(item=>item.store===value)
-          if(selected && selected.length>0){
-            let id = selected[0].id
-            emit('next', id)
+          let selected = arr.filter((item) => item.store === value);
+          if (selected && selected.length > 0) {
+            let id = selected[0].id;
+            emit('next', id);
           }
         }
       }
-      
+
       return {
         selectedValue,
         dictOptions,
-        handleChange
-      }
-    }
-  })
+        handleChange,
+      };
+    },
+  });
 </script>
 
-<style scoped>
-
-</style>
\ No newline at end of file
+<style scoped></style>
diff --git a/src/components/Form/src/jeecg/components/JPopup.vue b/src/components/Form/src/jeecg/components/JPopup.vue
index 7569ee5..393275e 100644
--- a/src/components/Form/src/jeecg/components/JPopup.vue
+++ b/src/components/Form/src/jeecg/components/JPopup.vue
@@ -1,142 +1,142 @@
 <!--popup组件-->
 <template>
-    <div class="components-input-demo-presuffix" v-if="avalid">
-        <!--输入框-->
-        <a-input @click="handleOpen" v-model:value="showText" :placeholder="placeholder" readOnly v-bind="attrs">
-            <template #prefix>
-                <Icon icon="ant-design:cluster-outlined"></Icon>
-            </template>
-            <template #suffix>
-                <Icon icon="ant-design:close-circle-outlined" @click="handleEmpty" title="清空" v-if="showText"></Icon>
-            </template>
-        </a-input>
-        <!--popup弹窗-->
-        <JPopupOnlReportModal @register="regModal" :code="code" :multi="multi" :sorter="sorter" :groupId="uniqGroupId" :param="param" @ok="callBack"></JPopupOnlReportModal>
-    </div>
+  <div class="components-input-demo-presuffix" v-if="avalid">
+    <!--输入框-->
+    <a-input @click="handleOpen" v-model:value="showText" :placeholder="placeholder" readOnly v-bind="attrs">
+      <template #prefix>
+        <Icon icon="ant-design:cluster-outlined"></Icon>
+      </template>
+      <template #suffix>
+        <Icon icon="ant-design:close-circle-outlined" @click="handleEmpty" title="清空" v-if="showText"></Icon>
+      </template>
+    </a-input>
+    <!--popup弹窗-->
+    <JPopupOnlReportModal @register="regModal" :code="code" :multi="multi" :sorter="sorter" :groupId="uniqGroupId" :param="param" @ok="callBack"></JPopupOnlReportModal>
+  </div>
 </template>
 <script lang="ts">
-    import JPopupOnlReportModal from './modal/JPopupOnlReportModal.vue'
-    import {defineComponent, ref, reactive, onMounted, watchEffect, watch, computed, unref} from 'vue';
-    import {useModal} from '/@/components/Modal';
-    import {propTypes} from "/@/utils/propTypes";
-    import {useAttrs} from "/@/hooks/core/useAttrs";
-    import {useMessage} from '/@/hooks/web/useMessage';
+  import JPopupOnlReportModal from './modal/JPopupOnlReportModal.vue';
+  import { defineComponent, ref, reactive, onMounted, watchEffect, watch, computed, unref } from 'vue';
+  import { useModal } from '/@/components/Modal';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
-    export default defineComponent({
-        name: 'JPopup',
-        components: {
-          JPopupOnlReportModal
+  export default defineComponent({
+    name: 'JPopup',
+    components: {
+      JPopupOnlReportModal,
+    },
+    inheritAttrs: false,
+    props: {
+      code: propTypes.string.def(''),
+      value: propTypes.string.def(''),
+      sorter: propTypes.string.def(''),
+      width: propTypes.number.def(1200),
+      placeholder: propTypes.string.def('请选择'),
+      multi: propTypes.bool.def(false),
+      param: propTypes.object.def({}),
+      spliter: propTypes.string.def(','),
+      groupId: propTypes.string.def(''),
+      formElRef: propTypes.object,
+      setFieldsValue: propTypes.func,
+      fieldConfig: {
+        type: Array,
+        default: () => [],
+      },
+    },
+    emits: ['update:value', 'register'],
+    setup(props, { emit, refs }) {
+      const { createMessage } = useMessage();
+      const attrs = useAttrs();
+      //pop是否展示
+      const avalid = ref(true);
+      const showText = ref('');
+      //注册model
+      const [regModal, { openModal }] = useModal();
+      //表单值
+      let { groupId, code, fieldConfig } = props;
+      //唯一分组groupId
+      const uniqGroupId = computed(() => (groupId ? `${groupId}_${code}_${fieldConfig[0]['source']}_${fieldConfig[0]['target']}` : ''));
+      /**
+       * 判断popup配置项是否正确
+       */
+      onMounted(() => {
+        if (props.fieldConfig.length == 0) {
+          createMessage.error('popup参数未正确配置!');
+          avalid.value = false;
+        }
+      });
+      /**
+       * 监听value数值
+       */
+      watch(
+        () => props.value,
+        (val) => {
+          showText.value = val && val.length > 0 ? val.split(props.spliter).join(',') : '';
         },
-        inheritAttrs: false,
-        props: {
-            code: propTypes.string.def(''),
-            value: propTypes.string.def(''),
-            sorter: propTypes.string.def(''),
-            width: propTypes.number.def(1200),
-            placeholder: propTypes.string.def('请选择'),
-            multi: propTypes.bool.def(false),
-            param: propTypes.object.def({}),
-            spliter: propTypes.string.def(','),
-            groupId: propTypes.string.def(''),
-            formElRef: propTypes.object,
-            setFieldsValue: propTypes.func,
-            fieldConfig: {
-                type: Array,
-                default: () => []
-            },
-        },
-        emits: ['update:value','register'],
-        setup(props, {emit, refs}) {
-            const {createMessage} = useMessage();
-            const attrs = useAttrs();
-            //pop是否展示
-            const avalid = ref(true);
-            const showText = ref('');
-            //注册model
-            const [regModal, {openModal}] = useModal();
-            //表单值
-            let {groupId, code, fieldConfig} = props;
-            //唯一分组groupId
-            const uniqGroupId = computed(() => groupId ? `${groupId}_${code}_${fieldConfig[0]['source']}_${fieldConfig[0]['target']}` : '');
-            /**
-             * 判断popup配置项是否正确
-             */
-            onMounted(() => {
-                if (props.fieldConfig.length == 0) {
-                    createMessage.error('popup参数未正确配置!');
-                    avalid.value = false;
-                }
-            });
-            /**
-             * 监听value数值
-             */
-            watch(
-                () => props.value,
-                (val) => {
-                    showText.value = val && val.length>0 ? val.split(props.spliter).join(',') : '';
-                },
-                {immediate: true}
-            );
+        { immediate: true }
+      );
 
-            /**
-             * 打开pop弹出框
-             */
-            function handleOpen() {
-                !props.disabled && openModal(true);
-            }
+      /**
+       * 打开pop弹出框
+       */
+      function handleOpen() {
+        !props.disabled && openModal(true);
+      }
 
-            /**
-             * TODO 清空
-             */
-            function handleEmpty() {
-                showText.value = '';
-            }
+      /**
+       * TODO 清空
+       */
+      function handleEmpty() {
+        showText.value = '';
+      }
 
-            /**
-             * 传值回调
-             */
-            function callBack(rows) {
-                let {fieldConfig} = props;
-                //匹配popup设置的回调值
-                let values = {};
-                for (let item of fieldConfig) {
-                    let val = rows.map(row => row[item.source]).join(',');
-                    item.target.split(",").forEach(target => {
-                        values[target] = val;
-                    });
-                }
-                //传入表单示例方式赋值
-                props.formElRef && props.formElRef.setFieldsValue(values);
-                //传入赋值方法方式赋值
-                props.setFieldsValue && props.setFieldsValue(values);
-            }
+      /**
+       * 传值回调
+       */
+      function callBack(rows) {
+        let { fieldConfig } = props;
+        //匹配popup设置的回调值
+        let values = {};
+        for (let item of fieldConfig) {
+          let val = rows.map((row) => row[item.source]).join(',');
+          item.target.split(',').forEach((target) => {
+            values[target] = val;
+          });
+        }
+        //传入表单示例方式赋值
+        props.formElRef && props.formElRef.setFieldsValue(values);
+        //传入赋值方法方式赋值
+        props.setFieldsValue && props.setFieldsValue(values);
+      }
 
-            return {
-                showText,
-                avalid,
-                uniqGroupId,
-                attrs,
-                regModal,
-                handleOpen,
-                handleEmpty,
-                callBack,
-            };
-        },
-    });
+      return {
+        showText,
+        avalid,
+        uniqGroupId,
+        attrs,
+        regModal,
+        handleOpen,
+        handleEmpty,
+        callBack,
+      };
+    },
+  });
 </script>
 <style lang="less" scoped>
-    .components-input-demo-presuffix .anticon-close-circle {
-        cursor: pointer;
-        color: #ccc;
-        transition: color 0.3s;
-        font-size: 12px;
-    }
+  .components-input-demo-presuffix .anticon-close-circle {
+    cursor: pointer;
+    color: #ccc;
+    transition: color 0.3s;
+    font-size: 12px;
+  }
 
-    .components-input-demo-presuffix .anticon-close-circle:hover {
-        color: #f5222d;
-    }
+  .components-input-demo-presuffix .anticon-close-circle:hover {
+    color: #f5222d;
+  }
 
-    .components-input-demo-presuffix .anticon-close-circle:active {
-        color: #666;
-    }
+  .components-input-demo-presuffix .anticon-close-circle:active {
+    color: #666;
+  }
 </style>
diff --git a/src/components/Form/src/jeecg/components/JRangeNumber.vue b/src/components/Form/src/jeecg/components/JRangeNumber.vue
index daf7177..2e44892 100644
--- a/src/components/Form/src/jeecg/components/JRangeNumber.vue
+++ b/src/components/Form/src/jeecg/components/JRangeNumber.vue
@@ -1,69 +1,69 @@
 <template>
-    <a-input-group>
-        <a-input :value="beginValue" style="width: calc( 50% - 15px )" placeholder="请输入最小值" @change="handleChangeBegin"/>
-        <a-input style="width: 30px; border-left: 0; pointer-events: none; background-color: #fff" placeholder="~" disabled/>
-        <a-input :value="endValue" style="width: calc( 50% - 15px );border-left: 0" placeholder="请输入最大值" @change="handleChangeEnd"/>
-    </a-input-group>
+  <a-input-group>
+    <a-input :value="beginValue" style="width: calc(50% - 15px)" placeholder="请输入最小值" @change="handleChangeBegin" />
+    <a-input style="width: 30px; border-left: 0; pointer-events: none; background-color: #fff" placeholder="~" disabled />
+    <a-input :value="endValue" style="width: calc(50% - 15px); border-left: 0" placeholder="请输入最大值" @change="handleChangeEnd" />
+  </a-input-group>
 </template>
 
 <script>
-
   /**
    * 查询条件用-数值范围查询
    */
-  import {ref, watch} from 'vue'
+  import { ref, watch } from 'vue';
   export default {
-    name: "JRangeNumber",
-    props:{
+    name: 'JRangeNumber',
+    props: {
       value: {
         type: Array,
-        default: ['','']
-      }
+        default: ['', ''],
+      },
     },
     emits: ['change'],
-    setup(props, {emit}){
-      const beginValue = ref('')
-      const endValue = ref('')
-      
+    setup(props, { emit }) {
+      const beginValue = ref('');
+      const endValue = ref('');
+
       function handleChangeBegin(e) {
-        beginValue.value = e.target.value
-        emitArray()
+        beginValue.value = e.target.value;
+        emitArray();
       }
 
       function handleChangeEnd(e) {
-        endValue.value = e.target.value
-        emitArray()
+        endValue.value = e.target.value;
+        emitArray();
       }
-      
-      function emitArray(){
-        let arr = []
-        let begin = beginValue.value || ''
-        let end = endValue.value || ''
-        arr.push(begin)
-        arr.push(end)
-        emit('change', arr)
+
+      function emitArray() {
+        let arr = [];
+        let begin = beginValue.value || '';
+        let end = endValue.value || '';
+        arr.push(begin);
+        arr.push(end);
+        emit('change', arr);
       }
-      
-      watch(()=>props.value, (val)=>{
-        if(val.length==2){
-          beginValue.value = val[0]
-          endValue.value = val[1]
-        }else{
-          beginValue.value = ''
-          endValue.value = ''
+
+      watch(
+        () => props.value,
+        (val) => {
+          if (val.length == 2) {
+            beginValue.value = val[0];
+            endValue.value = val[1];
+          } else {
+            beginValue.value = '';
+            endValue.value = '';
+          }
         }
-      });
-      
+      );
+
       return {
         beginValue,
         endValue,
         handleChangeBegin,
-        handleChangeEnd
-      }
-    }
-  }
+        handleChangeEnd,
+      };
+    },
+  };
 </script>
 
-<style scoped>
-
-</style>
\ No newline at end of file
+<style scoped></style>
diff --git a/src/components/Form/src/jeecg/components/JSearchSelect.vue b/src/components/Form/src/jeecg/components/JSearchSelect.vue
index 115cf5e..83e0c2b 100644
--- a/src/components/Form/src/jeecg/components/JSearchSelect.vue
+++ b/src/components/Form/src/jeecg/components/JSearchSelect.vue
@@ -1,269 +1,264 @@
 <template>
-    <!--异步字典下拉搜素-->
-    <a-select
-            v-if="async"
-            v-bind="attrs"
-            v-model:value="selectedAsyncValue"
-            showSearch
-            labelInValue
-            allowClear
-            :getPopupContainer="getParentContainer"
-            :placeholder="placeholder"
-            :filterOption="false"
-            :notFoundContent="loading ? undefined : null"
-            @search="loadData"
-            @change="handleAsyncChange"
-    >
-        <template #notFoundContent>
-            <a-spin size="small"/>
-        </template>
-        <a-select-option v-for="d in options" :key="d.value" :value="d.value">{{ d.text }}</a-select-option>
-    </a-select>
-    <!--字典下拉搜素-->
-    <a-select
-            v-else
-            v-model:value="selectedValue"
-            v-bind="attrs"
-            showSearch
-            :getPopupContainer="getParentContainer"
-            :placeholder="placeholder"
-            :filterOption="filterOption"
-            :notFoundContent="loading ? undefined : null"
-            @change="handleChange">
-        <template #notFoundContent>
-            <a-spin v-if="loading" size="small"/>
-        </template>
-        <a-select-option v-for="d in options" :key="d.value" :value="d.value">{{ d.text }}</a-select-option>
-    </a-select>
-
+  <!--异步字典下拉搜素-->
+  <a-select
+    v-if="async"
+    v-bind="attrs"
+    v-model:value="selectedAsyncValue"
+    showSearch
+    labelInValue
+    allowClear
+    :getPopupContainer="getParentContainer"
+    :placeholder="placeholder"
+    :filterOption="false"
+    :notFoundContent="loading ? undefined : null"
+    @search="loadData"
+    @change="handleAsyncChange"
+  >
+    <template #notFoundContent>
+      <a-spin size="small" />
+    </template>
+    <a-select-option v-for="d in options" :key="d.value" :value="d.value">{{ d.text }}</a-select-option>
+  </a-select>
+  <!--字典下拉搜素-->
+  <a-select
+    v-else
+    v-model:value="selectedValue"
+    v-bind="attrs"
+    showSearch
+    :getPopupContainer="getParentContainer"
+    :placeholder="placeholder"
+    :filterOption="filterOption"
+    :notFoundContent="loading ? undefined : null"
+    @change="handleChange"
+  >
+    <template #notFoundContent>
+      <a-spin v-if="loading" size="small" />
+    </template>
+    <a-select-option v-for="d in options" :key="d.value" :value="d.value">{{ d.text }}</a-select-option>
+  </a-select>
 </template>
 
 <script lang="ts">
-    import {useDebounceFn} from '@vueuse/core';
-    import {defineComponent, PropType, ref, reactive, watchEffect, computed, unref, watch, onMounted} from 'vue';
-    import {propTypes} from "/@/utils/propTypes";
-    import {useAttrs} from "/@/hooks/core/useAttrs";
-    import {initDictOptions} from "/@/utils/dict/index"
-    import {defHttp} from '/@/utils/http/axios';
+  import { useDebounceFn } from '@vueuse/core';
+  import { defineComponent, PropType, ref, reactive, watchEffect, computed, unref, watch, onMounted } from 'vue';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { initDictOptions } from '/@/utils/dict/index';
+  import { defHttp } from '/@/utils/http/axios';
 
-    export default defineComponent({
-        name: 'JSearchSelect',
-        inheritAttrs: false,
-        props: {
-            value: propTypes.oneOfType([
-                propTypes.string,
-                propTypes.number
-            ]),
-            dict: propTypes.string,
-            dictOptions: {
-                type: Array,
-                default: () => []
-            },
-            async: propTypes.bool.def(false),
-            placeholder: propTypes.string,
-            popContainer: propTypes.string,
-            pageSize: propTypes.number.def(10),
-            getPopupContainer: {
-                type: Function,
-                default: (node) => node.parentNode
-            }
+  export default defineComponent({
+    name: 'JSearchSelect',
+    inheritAttrs: false,
+    props: {
+      value: propTypes.oneOfType([propTypes.string, propTypes.number]),
+      dict: propTypes.string,
+      dictOptions: {
+        type: Array,
+        default: () => [],
+      },
+      async: propTypes.bool.def(false),
+      placeholder: propTypes.string,
+      popContainer: propTypes.string,
+      pageSize: propTypes.number.def(10),
+      getPopupContainer: {
+        type: Function,
+        default: (node) => node.parentNode,
+      },
+    },
+    emits: ['change', 'update:value'],
+    setup(props, { emit, refs }) {
+      const options = ref<any[]>([]);
+      const loading = ref(false);
+      const attrs = useAttrs();
+      const selectedValue = ref([]);
+      const selectedAsyncValue = ref([]);
+      const lastLoad = ref(0);
+      // 是否根据value加载text
+      const loadSelectText = ref(true);
+      /**
+       * 监听字典code
+       */
+      watchEffect(() => {
+        props.dict && initDictData();
+      });
+      /**
+       * 监听value
+       */
+      watch(
+        () => props.value,
+        (val) => {
+          if (val || val === 0) {
+            initSelectValue();
+          } else {
+            selectedValue.value = [];
+            selectedAsyncValue.value = [];
+          }
         },
-        emits: ['change','update:value'],
-        setup(props, {emit, refs}) {
-            const options = ref<any[]>([]);
-            const loading = ref(false);
-            const attrs = useAttrs();
-            const selectedValue = ref([]);
-            const selectedAsyncValue = ref([]);
-            const lastLoad = ref(0);
-            // 是否根据value加载text
-            const loadSelectText = ref(true);
-            /**
-             * 监听字典code
-             */
-            watchEffect(() => {
-                props.dict && initDictData();
-            });
-            /**
-             * 监听value
-             */
-            watch(
-                () => props.value,
-                (val) => {
-                    if (val || val === 0) {
-                        initSelectValue()
-                    } else {
-                        selectedValue.value = []
-                        selectedAsyncValue.value = []
-                    }
-                },
-                {immediate: true}
-            );
-            /**
-             * 监听dictOptions
-             */
-            watch(
-                () => props.dictOptions,
-                (val) => {
-                    if (val && val.length > 0) {
-                        options.value = [...val]
-                    }
-                },
-                {immediate: true}
-            );
-            /**
-             * 异步查询数据
-             */ 
-            async function loadData(value) {
-                lastLoad.value += 1;
-                const currentLoad = unref(lastLoad)
-                options.value = [];
-                loading.value = true;
-                // 字典code格式：table,text,code
-                defHttp.get({url:`/sys/dict/loadDict/${props.dict}`,params:{keyword: value, pageSize: props.pageSize}}).then(res => {
-                    loading.value = false;
-                    if (res && res.length>0) {
-                        if (currentLoad != unref(lastLoad)) {
-                            return
-                        }
-                        options.value = res
-                    }
-                })
-            }
-            /**
-             * 初始化value
-             */
-            function initSelectValue() {
-                //update-begin-author:taoyan date:2022-4-24 for: 下拉搜索组件每次选中值会触发value的监听事件，触发此方法，但是实际不需要
-                if(loadSelectText.value===false){
-                    loadSelectText.value = true
-                    return
-                }
-                //update-end-author:taoyan date:2022-4-24 for: 下拉搜索组件每次选中值会触发value的监听事件，触发此方法，但是实际不需要
-                let {async, value, dict} = props;
-                if (async) {
-                    if (!selectedAsyncValue || !selectedAsyncValue.key || selectedAsyncValue.key !== value) {
-                        defHttp.get({url: `/sys/dict/loadDictItem/${dict}`, params: {key: value}}).then(res => {
-                            if (res && res.length>0) {
-                                let obj = {
-                                    key: value,
-                                    label: res
-                                };
-                                selectedAsyncValue.value = {...obj}
-                            }
-                        })
-                    }
-                } else {
-                    selectedValue.value = value.toString()
-                }
-            }
-
-            /**
-             * 初始化字典下拉数据
-             */
-            async function initDictData() {
-                let {dict, async, dictOptions, pageSize} = props;
-                if (!async) {
-                    //如果字典项集合有数据
-                    if (dictOptions && dictOptions.length > 0) {
-                        options.value = dictOptions
-                    } else {
-                        //根据字典Code, 初始化字典数组
-                        let dictStr = ''
-                        if (dict) {
-                            let arr = dict.split(',')
-                            if (arr[0].indexOf('where') > 0) {
-                                let tbInfo = arr[0].split('where')
-                                dictStr = tbInfo[0].trim() + ',' + arr[1] + ',' + arr[2] + ',' + encodeURIComponent(tbInfo[1])
-                            } else {
-                                dictStr = dict
-                            }
-                            //根据字典Code, 初始化字典数组
-                            const dictData = await initDictOptions(dictStr);
-                            options.value = dictData
-                        }
-                    }
-                } else {
-                    if (!dict) {
-                        console.error('搜索组件未配置字典项')
-                    } else {
-                        //异步一开始也加载一点数据
-                        loading.value = true;
-                        defHttp.get({url: `/sys/dict/loadDict/${dict}`, params: {pageSize: pageSize, keyword: ''}}).then(res => {
-                            loading.value = false;
-                            if (res && res.length>0) {
-                                options.value = res
-                            }
-                        })
-                    }
-                }
-            }
-            /**
-             * 同步改变事件
-             * */
-            function handleChange(value) {
-                selectedValue.value = value;
-                callback()
-            }
-            /**
-             * 异步改变事件
-             * */
-            function handleAsyncChange(selectedObj){
-                if(selectedObj){
-                    selectedAsyncValue.value = selectedObj;
-                    selectedValue.value = selectedObj.key
-                }else{
-                    selectedAsyncValue.value = null;
-                    selectedValue.value = null;
-                    options.value = null;
-                    loadData("")
-                }
-                callback()
-            }
-            /**
-             *回调方法
-             * */
-            function callback(){
-                loadSelectText.value = false;
-                emit('change', unref(selectedValue));
-                emit('update:value', unref(selectedValue));
-            }
-            /**
-            * 过滤选中option
-            */
-            function filterOption(input, option) {
-                return option?.children[0]?.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
-            }
-            
-            function getParentContainer(node){
-              // update-begin-author:taoyan date:20220407 for: getPopupContainer一直有值 导致popContainer的逻辑永远走不进去，把它挪到前面判断
-              if(props.popContainer){
-                return document.querySelector(props.popContainer)
-              }else{
-                if(typeof props.getPopupContainer === 'function'){
-                  return props.getPopupContainer(node)
-                } else {
-                  return node.parentNode
-                }
-              }
-              // update-end-author:taoyan date:20220407 for: getPopupContainer一直有值 导致popContainer的逻辑永远走不进去，把它挪到前面判断
-            }
-            return {
-                attrs,
-                options,
-                loading,
-                selectedValue,
-                selectedAsyncValue,
-                loadData:useDebounceFn(loadData,800),
-                getParentContainer,
-                filterOption,
-                handleChange,
-                handleAsyncChange
+        { immediate: true }
+      );
+      /**
+       * 监听dictOptions
+       */
+      watch(
+        () => props.dictOptions,
+        (val) => {
+          if (val && val.length > 0) {
+            options.value = [...val];
+          }
+        },
+        { immediate: true }
+      );
+      /**
+       * 异步查询数据
+       */
+      async function loadData(value) {
+        lastLoad.value += 1;
+        const currentLoad = unref(lastLoad);
+        options.value = [];
+        loading.value = true;
+        // 字典code格式：table,text,code
+        defHttp.get({ url: `/sys/dict/loadDict/${props.dict}`, params: { keyword: value, pageSize: props.pageSize } }).then((res) => {
+          loading.value = false;
+          if (res && res.length > 0) {
+            if (currentLoad != unref(lastLoad)) {
+              return;
             }
+            options.value = res;
+          }
+        });
+      }
+      /**
+       * 初始化value
+       */
+      function initSelectValue() {
+        //update-begin-author:taoyan date:2022-4-24 for: 下拉搜索组件每次选中值会触发value的监听事件，触发此方法，但是实际不需要
+        if (loadSelectText.value === false) {
+          loadSelectText.value = true;
+          return;
         }
-    })
+        //update-end-author:taoyan date:2022-4-24 for: 下拉搜索组件每次选中值会触发value的监听事件，触发此方法，但是实际不需要
+        let { async, value, dict } = props;
+        if (async) {
+          if (!selectedAsyncValue || !selectedAsyncValue.key || selectedAsyncValue.key !== value) {
+            defHttp.get({ url: `/sys/dict/loadDictItem/${dict}`, params: { key: value } }).then((res) => {
+              if (res && res.length > 0) {
+                let obj = {
+                  key: value,
+                  label: res,
+                };
+                selectedAsyncValue.value = { ...obj };
+              }
+            });
+          }
+        } else {
+          selectedValue.value = value.toString();
+        }
+      }
+
+      /**
+       * 初始化字典下拉数据
+       */
+      async function initDictData() {
+        let { dict, async, dictOptions, pageSize } = props;
+        if (!async) {
+          //如果字典项集合有数据
+          if (dictOptions && dictOptions.length > 0) {
+            options.value = dictOptions;
+          } else {
+            //根据字典Code, 初始化字典数组
+            let dictStr = '';
+            if (dict) {
+              let arr = dict.split(',');
+              if (arr[0].indexOf('where') > 0) {
+                let tbInfo = arr[0].split('where');
+                dictStr = tbInfo[0].trim() + ',' + arr[1] + ',' + arr[2] + ',' + encodeURIComponent(tbInfo[1]);
+              } else {
+                dictStr = dict;
+              }
+              //根据字典Code, 初始化字典数组
+              const dictData = await initDictOptions(dictStr);
+              options.value = dictData;
+            }
+          }
+        } else {
+          if (!dict) {
+            console.error('搜索组件未配置字典项');
+          } else {
+            //异步一开始也加载一点数据
+            loading.value = true;
+            defHttp.get({ url: `/sys/dict/loadDict/${dict}`, params: { pageSize: pageSize, keyword: '' } }).then((res) => {
+              loading.value = false;
+              if (res && res.length > 0) {
+                options.value = res;
+              }
+            });
+          }
+        }
+      }
+      /**
+       * 同步改变事件
+       * */
+      function handleChange(value) {
+        selectedValue.value = value;
+        callback();
+      }
+      /**
+       * 异步改变事件
+       * */
+      function handleAsyncChange(selectedObj) {
+        if (selectedObj) {
+          selectedAsyncValue.value = selectedObj;
+          selectedValue.value = selectedObj.key;
+        } else {
+          selectedAsyncValue.value = null;
+          selectedValue.value = null;
+          options.value = null;
+          loadData('');
+        }
+        callback();
+      }
+      /**
+       *回调方法
+       * */
+      function callback() {
+        loadSelectText.value = false;
+        emit('change', unref(selectedValue));
+        emit('update:value', unref(selectedValue));
+      }
+      /**
+       * 过滤选中option
+       */
+      function filterOption(input, option) {
+        return option?.children[0]?.children.toLowerCase().indexOf(input.toLowerCase()) >= 0;
+      }
+
+      function getParentContainer(node) {
+        // update-begin-author:taoyan date:20220407 for: getPopupContainer一直有值 导致popContainer的逻辑永远走不进去，把它挪到前面判断
+        if (props.popContainer) {
+          return document.querySelector(props.popContainer);
+        } else {
+          if (typeof props.getPopupContainer === 'function') {
+            return props.getPopupContainer(node);
+          } else {
+            return node.parentNode;
+          }
+        }
+        // update-end-author:taoyan date:20220407 for: getPopupContainer一直有值 导致popContainer的逻辑永远走不进去，把它挪到前面判断
+      }
+      return {
+        attrs,
+        options,
+        loading,
+        selectedValue,
+        selectedAsyncValue,
+        loadData: useDebounceFn(loadData, 800),
+        getParentContainer,
+        filterOption,
+        handleChange,
+        handleAsyncChange,
+      };
+    },
+  });
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/components/Form/src/jeecg/components/JSelectDept.vue b/src/components/Form/src/jeecg/components/JSelectDept.vue
index 926dd3a..15235a2 100644
--- a/src/components/Form/src/jeecg/components/JSelectDept.vue
+++ b/src/components/Form/src/jeecg/components/JSelectDept.vue
@@ -1,14 +1,14 @@
 <!--部门选择组件-->
 <template>
-    <div>
-        <JSelectBiz @handleOpen="handleOpen" :loading="loadingEcho" v-bind="attrs"/>
-        <DeptSelectModal @register="regModal" @getSelectResult="setValue" v-bind="getBindValue" />
-    </div>
+  <div>
+    <JSelectBiz @handleOpen="handleOpen" :loading="loadingEcho" v-bind="attrs" />
+    <DeptSelectModal @register="regModal" @getSelectResult="setValue" v-bind="getBindValue" />
+  </div>
 </template>
 <script lang="ts">
   import DeptSelectModal from './modal/DeptSelectModal.vue';
   import JSelectBiz from './base/JSelectBiz.vue';
-  import { defineComponent, ref, reactive, watchEffect, watch, provide, unref ,toRaw} from 'vue';
+  import { defineComponent, ref, reactive, watchEffect, watch, provide, unref, toRaw } from 'vue';
   import { useModal } from '/@/components/Modal';
   import { propTypes } from '/@/utils/propTypes';
   import { useRuleFormItem } from '/@/hooks/component/useFormItem';
@@ -27,7 +27,7 @@
       // 是否允许多选，默认 true
       multiple: propTypes.bool.def(true),
     },
-    emits: ['options-change', 'change','select','update:value'],
+    emits: ['options-change', 'change', 'select', 'update:value'],
     setup(props, { emit, refs }) {
       const emitData = ref<object>();
       //注册model
@@ -38,10 +38,10 @@
       const selectOptions = ref<SelectTypes['options']>([]);
       //下拉框选中值
       let selectValues = reactive<object>({
-        value: []
+        value: [],
       });
       // 是否正在加载回显数据
-      const loadingEcho = ref<boolean>(false)
+      const loadingEcho = ref<boolean>(false);
       //下发 selectOptions,xxxBiz组件接收
       provide('selectOptions', selectOptions);
       //下发 selectValues,xxxBiz组件接收
@@ -58,9 +58,9 @@
       watchEffect(() => {
         props.value && initValue();
         // update-begin-author:taoyan date:20220401 for:调用表单的 resetFields不会清空当前部门信息，界面显示上一次的数据
-        if(props.value==='' || props.value===undefined){
-          state.value = []
-          selectValues.value = []
+        if (props.value === '' || props.value === undefined) {
+          state.value = [];
+          selectValues.value = [];
         }
         // update-end-author:taoyan date:20220401 for:调用表单的 resetFields不会清空当前部门信息，界面显示上一次的数据
       });
@@ -78,7 +78,7 @@
        */
       watch(selectOptions, () => {
         if (selectOptions) {
-          emit('select',toRaw(unref(selectOptions)),toRaw(unref(selectValues)))
+          emit('select', toRaw(unref(selectOptions)), toRaw(unref(selectValues)));
         }
       });
 
@@ -101,7 +101,6 @@
           state.value = value.split(',');
           selectValues.value = value.split(',');
         }
-     
       }
 
       /**
@@ -112,7 +111,7 @@
         //emitData.value = values.join(",");
         state.value = values;
         selectValues.value = values;
-        emit('update:value', values.join(','))
+        emit('update:value', values.join(','));
       }
       const getBindValue = Object.assign({}, unref(props), unref(attrs));
       return {
@@ -131,23 +130,23 @@
   });
 </script>
 <style lang="less" scoped>
-    .j-select-row {
-        @width: 82px;
+  .j-select-row {
+    @width: 82px;
 
-        .left {
-            width: calc(100% - @width - 8px);
-        }
-
-        .right {
-            width: @width;
-        }
-
-        .full {
-            width: 100%;
-        }
-
-        ::v-deep(.ant-select-search__field) {
-            display: none !important;
-        }
+    .left {
+      width: calc(100% - @width - 8px);
     }
+
+    .right {
+      width: @width;
+    }
+
+    .full {
+      width: 100%;
+    }
+
+    ::v-deep(.ant-select-search__field) {
+      display: none !important;
+    }
+  }
 </style>
diff --git a/src/components/Form/src/jeecg/components/JSelectInput.vue b/src/components/Form/src/jeecg/components/JSelectInput.vue
index 3afad90..9fa1c65 100644
--- a/src/components/Form/src/jeecg/components/JSelectInput.vue
+++ b/src/components/Form/src/jeecg/components/JSelectInput.vue
@@ -1,79 +1,89 @@
 <template>
-  <a-select v-bind="bindProps" @change="onChange" @search="onSearch"/>
+  <a-select v-bind="bindProps" @change="onChange" @search="onSearch" />
 </template>
 
 <script lang="ts">
-import { propTypes } from '/@/utils/propTypes'
-import { defineComponent, ref, watch, computed } from 'vue'
+  import { propTypes } from '/@/utils/propTypes';
+  import { defineComponent, ref, watch, computed } from 'vue';
 
-// 可以输入的下拉框（此组件暂时没有人用）
-export default defineComponent({
-  name: 'JSelectInput',
-  props: {
-    options: propTypes.array.def(() => []),
-  },
-  emits: ['change', 'update:value'],
-  setup(props, { emit, attrs }) {
-    // 内部 options 选项
-    const options = ref<any[]>([])
-    // 监听外部 options 变化，并覆盖内部 options
-    watch(() => props.options, () => {
-      options.value = [...props.options]
-    }, { deep: true, immediate: true })
-    // 合并 props 和 attrs
-    const bindProps: any = computed(() => Object.assign({
-      showSearch: true,
-    }, props, attrs, {
-      options: options.value,
-    }))
-
-    function onChange(...args: any[]) {
-      deleteSearchAdd(args[0])
-      emit('change', ...args)
-      emit('update:value', args[0])
-    }
-
-    function onSearch(value) {
-      // 是否找到了对应的项，找不到则添加这一项
-      let foundIt = options.value.findIndex(option => {
-        return option.value.toString() === value.toString()
-      }) !== -1
-      // !!value ：不添加空值
-      if (!foundIt && !!value) {
-        deleteSearchAdd(value)
-        // searchAdd 是否是通过搜索添加的
-        options.value.push({ value: value, searchAdd: true })
-        //onChange(value,{ value })
-      } else if (foundIt) {
-        onChange(value)
-      }
-    }
-
-    // 删除无用的因搜索（用户输入）而创建的项
-    function deleteSearchAdd(value = '') {
-      let indexes: any[] = []
-      options.value.forEach((option, index) => {
-        if (option.searchAdd) {
-          if ((option.value ?? '').toString() !== value.toString()) {
-            indexes.push(index)
+  // 可以输入的下拉框（此组件暂时没有人用）
+  export default defineComponent({
+    name: 'JSelectInput',
+    props: {
+      options: propTypes.array.def(() => []),
+    },
+    emits: ['change', 'update:value'],
+    setup(props, { emit, attrs }) {
+      // 内部 options 选项
+      const options = ref<any[]>([]);
+      // 监听外部 options 变化，并覆盖内部 options
+      watch(
+        () => props.options,
+        () => {
+          options.value = [...props.options];
+        },
+        { deep: true, immediate: true }
+      );
+      // 合并 props 和 attrs
+      const bindProps: any = computed(() =>
+        Object.assign(
+          {
+            showSearch: true,
+          },
+          props,
+          attrs,
+          {
+            options: options.value,
           }
-        }
-      })
-      // 翻转删除数组中的项
-      for (let index of indexes.reverse()) {
-        options.value.splice(index, 1)
-      }
-    }
+        )
+      );
 
-    return {
-      bindProps,
-      onChange,
-      onSearch,
-    }
-  },
-})
+      function onChange(...args: any[]) {
+        deleteSearchAdd(args[0]);
+        emit('change', ...args);
+        emit('update:value', args[0]);
+      }
+
+      function onSearch(value) {
+        // 是否找到了对应的项，找不到则添加这一项
+        let foundIt =
+          options.value.findIndex((option) => {
+            return option.value.toString() === value.toString();
+          }) !== -1;
+        // !!value ：不添加空值
+        if (!foundIt && !!value) {
+          deleteSearchAdd(value);
+          // searchAdd 是否是通过搜索添加的
+          options.value.push({ value: value, searchAdd: true });
+          //onChange(value,{ value })
+        } else if (foundIt) {
+          onChange(value);
+        }
+      }
+
+      // 删除无用的因搜索（用户输入）而创建的项
+      function deleteSearchAdd(value = '') {
+        let indexes: any[] = [];
+        options.value.forEach((option, index) => {
+          if (option.searchAdd) {
+            if ((option.value ?? '').toString() !== value.toString()) {
+              indexes.push(index);
+            }
+          }
+        });
+        // 翻转删除数组中的项
+        for (let index of indexes.reverse()) {
+          options.value.splice(index, 1);
+        }
+      }
+
+      return {
+        bindProps,
+        onChange,
+        onSearch,
+      };
+    },
+  });
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/components/Form/src/jeecg/components/JSelectMultiple.vue b/src/components/Form/src/jeecg/components/JSelectMultiple.vue
index 26cc199..cbdcbc7 100644
--- a/src/components/Form/src/jeecg/components/JSelectMultiple.vue
+++ b/src/components/Form/src/jeecg/components/JSelectMultiple.vue
@@ -1,10 +1,10 @@
 <!--字典下拉多选-->
 <template>
-    <a-select :value="arrayValue" @change="onChange" mode="multiple" :placeholder="placeholder" allowClear :getPopupContainer="getParentContainer">
-        <a-select-option v-for="(item,index) in dictOptions" :key="index" :getPopupContainer="getParentContainer" :value="item.value">
-            {{ item.text || item.label }}
-        </a-select-option>
-    </a-select>
+  <a-select :value="arrayValue" @change="onChange" mode="multiple" :placeholder="placeholder" allowClear :getPopupContainer="getParentContainer">
+    <a-select-option v-for="(item, index) in dictOptions" :key="index" :getPopupContainer="getParentContainer" :value="item.value">
+      {{ item.text || item.label }}
+    </a-select-option>
+  </a-select>
 </template>
 <script lang="ts">
   import { computed, defineComponent, onMounted, ref, nextTick, watch } from 'vue';
@@ -20,10 +20,7 @@
     components: {},
     inheritAttrs: false,
     props: {
-      value: propTypes.oneOfType([
-        propTypes.string,
-        propTypes.array,
-      ]),
+      value: propTypes.oneOfType([propTypes.string, propTypes.array]),
       placeholder: {
         type: String,
         default: '请选择',
@@ -68,7 +65,6 @@
       const attrs = useAttrs();
       const [state] = useRuleFormItem(props, 'value', 'change', emitData);
 
-
       onMounted(() => {
         if (props.dictCode) {
           loadDictOptions();
@@ -77,15 +73,16 @@
         }
       });
 
-      watch(() => props.value,
+      watch(
+        () => props.value,
         (val) => {
           if (!val) {
             arrayValue.value = [];
           } else {
             arrayValue.value = props.value.split(props.spliter);
           }
-        });
-
+        }
+      );
 
       function onChange(selectedValue) {
         if (props.triggerChange) {
@@ -106,9 +103,9 @@
 
       // 根据字典code查询字典项
       function loadDictOptions() {
-        getDictItems(props.dictCode).then(res => {
+        getDictItems(props.dictCode).then((res) => {
           if (res) {
-            dictOptions.value = res.map(item => ({ value: item.value, label: item.text }));
+            dictOptions.value = res.map((item) => ({ value: item.value, label: item.text }));
             //console.info('res', dictOptions.value);
           } else {
             console.error('getDictItems error: : ', res);
@@ -126,6 +123,5 @@
         getParentContainer,
       };
     },
-  })
-  ;
+  });
 </script>
diff --git a/src/components/Form/src/jeecg/components/JSelectPosition.vue b/src/components/Form/src/jeecg/components/JSelectPosition.vue
index f4df620..1b54106 100644
--- a/src/components/Form/src/jeecg/components/JSelectPosition.vue
+++ b/src/components/Form/src/jeecg/components/JSelectPosition.vue
@@ -1,153 +1,149 @@
 <!--职务选择组件-->
 <template>
-    <div>
-        <JSelectBiz @handleOpen="handleOpen" :loading="loadingEcho" v-bind="attrs"></JSelectBiz>
-        <PositionSelectModal @register="regModal" @getSelectResult="setValue" v-bind="getBindValue"></PositionSelectModal>
-    </div>
+  <div>
+    <JSelectBiz @handleOpen="handleOpen" :loading="loadingEcho" v-bind="attrs"></JSelectBiz>
+    <PositionSelectModal @register="regModal" @getSelectResult="setValue" v-bind="getBindValue"></PositionSelectModal>
+  </div>
 </template>
 <script lang="ts">
-    import PositionSelectModal from './modal/PositionSelectModal.vue'
-    import JSelectBiz from './base/JSelectBiz.vue';
-    import { defineComponent, ref, reactive, watchEffect, watch, provide, computed, unref } from 'vue';
-    import {useModal} from '/@/components/Modal';
-    import {propTypes} from "/@/utils/propTypes";
-    import {useRuleFormItem} from "/@/hooks/component/useFormItem";
-    import {useAttrs} from "/@/hooks/core/useAttrs";
-    import {SelectTypes} from 'ant-design-vue/es/select';
+  import PositionSelectModal from './modal/PositionSelectModal.vue';
+  import JSelectBiz from './base/JSelectBiz.vue';
+  import { defineComponent, ref, reactive, watchEffect, watch, provide, computed, unref } from 'vue';
+  import { useModal } from '/@/components/Modal';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useRuleFormItem } from '/@/hooks/component/useFormItem';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { SelectTypes } from 'ant-design-vue/es/select';
 
-    export default defineComponent({
-        name: 'JSelectPosition',
-        components: {
-            PositionSelectModal, JSelectBiz
-        },
-        inheritAttrs: false,
-        props: {
-            value: propTypes.oneOfType([
-                propTypes.string,
-                propTypes.array
-            ]),
-            labelKey: {
-                type: String,
-                default: 'name',
-            },
-            rowKey: {
-                type: String,
-                default: 'code',
-            },
-            params:{
-              type:Object,
-              default: () => {
-              }
-            },
-        },
-        emits: ['options-change', 'change'],
-        setup(props, {emit, refs}) {
-            const emitData = ref<object>();
-            //注册model
-            const [regModal, {openModal}] = useModal();
-            //表单值
-            const [state] = useRuleFormItem(props, 'value', 'change', emitData);
-            //下拉框选项值
-            const selectOptions = ref<SelectTypes['options']>([]);
-            //下拉框选中值
-            let selectValues = reactive<object>({
-                value: [],
-                change: false
-            });
-            // 是否正在加载回显数据
-            const loadingEcho = ref<boolean>(false)
-            //下发 selectOptions,xxxBiz组件接收
-            provide('selectOptions', selectOptions);
-            //下发 selectValues,xxxBiz组件接收
-            provide('selectValues', selectValues);
-            //下发 loadingEcho,xxxBiz组件接收
-            provide('loadingEcho', loadingEcho);
+  export default defineComponent({
+    name: 'JSelectPosition',
+    components: {
+      PositionSelectModal,
+      JSelectBiz,
+    },
+    inheritAttrs: false,
+    props: {
+      value: propTypes.oneOfType([propTypes.string, propTypes.array]),
+      labelKey: {
+        type: String,
+        default: 'name',
+      },
+      rowKey: {
+        type: String,
+        default: 'code',
+      },
+      params: {
+        type: Object,
+        default: () => {},
+      },
+    },
+    emits: ['options-change', 'change'],
+    setup(props, { emit, refs }) {
+      const emitData = ref<object>();
+      //注册model
+      const [regModal, { openModal }] = useModal();
+      //表单值
+      const [state] = useRuleFormItem(props, 'value', 'change', emitData);
+      //下拉框选项值
+      const selectOptions = ref<SelectTypes['options']>([]);
+      //下拉框选中值
+      let selectValues = reactive<object>({
+        value: [],
+        change: false,
+      });
+      // 是否正在加载回显数据
+      const loadingEcho = ref<boolean>(false);
+      //下发 selectOptions,xxxBiz组件接收
+      provide('selectOptions', selectOptions);
+      //下发 selectValues,xxxBiz组件接收
+      provide('selectValues', selectValues);
+      //下发 loadingEcho,xxxBiz组件接收
+      provide('loadingEcho', loadingEcho);
 
-            const tag = ref(false);
-            const attrs = useAttrs();
+      const tag = ref(false);
+      const attrs = useAttrs();
 
+      /**
+       * 监听组件值
+       */
+      watchEffect(() => {
+        props.value && initValue();
+      });
 
-            /**
-             * 监听组件值
-             */
-            watchEffect(() => {
-                props.value && initValue();
-            });
+      /**
+       * 监听selectValues变化
+       */
+      watch(selectValues, () => {
+        if (selectValues) {
+          state.value = selectValues.value;
+        }
+      });
 
-            /**
-             * 监听selectValues变化
-             */
-            watch(selectValues, () => {
-                if (selectValues) {
-                    state.value = selectValues.value;
-                }
-            })
+      /**
+       * 打卡弹出框
+       */
+      function handleOpen() {
+        tag.value = true;
+        openModal(true, {
+          isUpdate: false,
+        });
+      }
 
-            /**
-             * 打卡弹出框
-             */
-            function handleOpen() {
-                tag.value = true;
-                openModal(true, {
-                    isUpdate: false,
-                });
-            }
+      /**
+       * 将字符串值转化为数组
+       */
+      function initValue() {
+        let value = props.value ? props.value : [];
+        if (value && typeof value === 'string' && value != 'null' && value != 'undefined') {
+          state.value = value.split(',');
+          selectValues.value = value.split(',');
+        }
+      }
 
-            /**
-             * 将字符串值转化为数组
-             */
-            function initValue() {
-                let value = props.value ? props.value : [];
-                if (value && typeof value === 'string' && value!='null' && value !='undefined') {
-                    state.value = value.split(",");
-                    selectValues.value = value.split(",");
-                }
-            }
+      /**
+       * 设置下拉框的值
+       */
+      function setValue(options, values) {
+        selectOptions.value = options;
+        //emitData.value = values.join(",");
+        state.value = values;
+        selectValues.value = values;
+      }
 
-            /**
-             * 设置下拉框的值
-             */
-            function setValue(options, values) {
-                selectOptions.value = options
-                //emitData.value = values.join(",");
-                state.value = values;
-                selectValues.value = values;
-            }
-
-            const getBindValue =Object.assign({},unref(props),unref(attrs));
-            return {
-                state,
-                getBindValue,
-                attrs,
-                selectOptions,
-                selectValues,
-                loadingEcho,
-                tag,
-                regModal,
-                setValue,
-                handleOpen
-            };
-        },
-    });
+      const getBindValue = Object.assign({}, unref(props), unref(attrs));
+      return {
+        state,
+        getBindValue,
+        attrs,
+        selectOptions,
+        selectValues,
+        loadingEcho,
+        tag,
+        regModal,
+        setValue,
+        handleOpen,
+      };
+    },
+  });
 </script>
 <style lang="less" scoped>
-    .j-select-row {
-        @width: 82px;
+  .j-select-row {
+    @width: 82px;
 
-        .left {
-            width: calc(100% - @width - 8px);
-        }
-
-        .right {
-            width: @width;
-        }
-
-        .full {
-            width: 100%;
-        }
-
-        ::v-deep(.ant-select-search__field) {
-            display: none !important;
-        }
+    .left {
+      width: calc(100% - @width - 8px);
     }
+
+    .right {
+      width: @width;
+    }
+
+    .full {
+      width: 100%;
+    }
+
+    ::v-deep(.ant-select-search__field) {
+      display: none !important;
+    }
+  }
 </style>
diff --git a/src/components/Form/src/jeecg/components/JSelectRole.vue b/src/components/Form/src/jeecg/components/JSelectRole.vue
index cba46a6..9cabefc 100644
--- a/src/components/Form/src/jeecg/components/JSelectRole.vue
+++ b/src/components/Form/src/jeecg/components/JSelectRole.vue
@@ -1,152 +1,148 @@
 <!--角色选择组件-->
 <template>
-    <div>
-        <JSelectBiz @handleOpen="handleOpen" :loading="loadingEcho" v-bind="attrs"></JSelectBiz>
-        <RoleSelectModal @register="regModal" @getSelectResult="setValue" v-bind="getBindValue"></RoleSelectModal>
-    </div>
+  <div>
+    <JSelectBiz @handleOpen="handleOpen" :loading="loadingEcho" v-bind="attrs"></JSelectBiz>
+    <RoleSelectModal @register="regModal" @getSelectResult="setValue" v-bind="getBindValue"></RoleSelectModal>
+  </div>
 </template>
 <script lang="ts">
-    import RoleSelectModal from './modal/RoleSelectModal.vue'
-    import JSelectBiz from './base/JSelectBiz.vue';
-    import {defineComponent, ref,unref, reactive, watchEffect, watch, provide} from 'vue';
-    import {useModal} from '/@/components/Modal';
-    import {propTypes} from "/@/utils/propTypes";
-    import {useRuleFormItem} from "/@/hooks/component/useFormItem";
-    import {useAttrs} from "/@/hooks/core/useAttrs";
-    import {SelectTypes} from 'ant-design-vue/es/select';
+  import RoleSelectModal from './modal/RoleSelectModal.vue';
+  import JSelectBiz from './base/JSelectBiz.vue';
+  import { defineComponent, ref, unref, reactive, watchEffect, watch, provide } from 'vue';
+  import { useModal } from '/@/components/Modal';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useRuleFormItem } from '/@/hooks/component/useFormItem';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { SelectTypes } from 'ant-design-vue/es/select';
 
-    export default defineComponent({
-        name: 'JSelectRole',
-        components: {
-          RoleSelectModal, JSelectBiz
-        },
-        inheritAttrs: false,
-        props: {
-            value: propTypes.oneOfType([
-                propTypes.string,
-                propTypes.array
-            ]),
-            labelKey: {
-                type: String,
-                default: 'roleName',
-            },
-            rowKey: {
-              type: String,
-              default: 'id',
-            },
-            params:{
-              type:Object,
-              default: () => {
-              }
-            },
-        },
-        emits: ['options-change', 'change'],
-        setup(props, {emit, refs}) {
-            const emitData = ref<object>();
-            //注册model
-            const [regModal, {openModal}] = useModal();
-            //表单值
-            const [state] = useRuleFormItem(props, 'value', 'change', emitData);
-            //下拉框选项值
-            const selectOptions = ref<SelectTypes['options']>([]);
-            //下拉框选中值
-            let selectValues = reactive<object>({
-                value: [],
-                change: false
-            });
-            // 是否正在加载回显数据
-            const loadingEcho = ref<boolean>(false)
-            //下发 selectOptions,xxxBiz组件接收
-            provide('selectOptions', selectOptions);
-            //下发 selectValues,xxxBiz组件接收
-            provide('selectValues', selectValues);
-            //下发 loadingEcho,xxxBiz组件接收
-            provide('loadingEcho', loadingEcho);
+  export default defineComponent({
+    name: 'JSelectRole',
+    components: {
+      RoleSelectModal,
+      JSelectBiz,
+    },
+    inheritAttrs: false,
+    props: {
+      value: propTypes.oneOfType([propTypes.string, propTypes.array]),
+      labelKey: {
+        type: String,
+        default: 'roleName',
+      },
+      rowKey: {
+        type: String,
+        default: 'id',
+      },
+      params: {
+        type: Object,
+        default: () => {},
+      },
+    },
+    emits: ['options-change', 'change'],
+    setup(props, { emit, refs }) {
+      const emitData = ref<object>();
+      //注册model
+      const [regModal, { openModal }] = useModal();
+      //表单值
+      const [state] = useRuleFormItem(props, 'value', 'change', emitData);
+      //下拉框选项值
+      const selectOptions = ref<SelectTypes['options']>([]);
+      //下拉框选中值
+      let selectValues = reactive<object>({
+        value: [],
+        change: false,
+      });
+      // 是否正在加载回显数据
+      const loadingEcho = ref<boolean>(false);
+      //下发 selectOptions,xxxBiz组件接收
+      provide('selectOptions', selectOptions);
+      //下发 selectValues,xxxBiz组件接收
+      provide('selectValues', selectValues);
+      //下发 loadingEcho,xxxBiz组件接收
+      provide('loadingEcho', loadingEcho);
 
-            const tag = ref(false);
-            const attrs = useAttrs();
+      const tag = ref(false);
+      const attrs = useAttrs();
 
+      /**
+       * 监听组件值
+       */
+      watchEffect(() => {
+        props.value && initValue();
+      });
 
-            /**
-             * 监听组件值
-             */
-            watchEffect(() => {
-                props.value && initValue();
-            });
+      /**
+       * 监听selectValues变化
+       */
+      watch(selectValues, () => {
+        if (selectValues) {
+          state.value = selectValues.value;
+        }
+      });
 
-            /**
-             * 监听selectValues变化
-             */
-            watch(selectValues, () => {
-                if (selectValues) {
-                    state.value = selectValues.value;
-                }
-            })
+      /**
+       * 打卡弹出框
+       */
+      function handleOpen() {
+        tag.value = true;
+        openModal(true, {
+          isUpdate: false,
+        });
+      }
 
-            /**
-             * 打卡弹出框
-             */
-            function handleOpen() {
-                tag.value = true;
-                openModal(true, {
-                    isUpdate: false,
-                });
-            }
+      /**
+       * 将字符串值转化为数组
+       */
+      function initValue() {
+        let value = props.value ? props.value : [];
+        if (value && typeof value === 'string' && value != 'null' && value != 'undefined') {
+          state.value = value.split(',');
+          selectValues.value = value.split(',');
+        }
+      }
 
-            /**
-             * 将字符串值转化为数组
-             */
-            function initValue() {
-                let value = props.value ? props.value : [];
-                if (value && typeof value === 'string' && value!='null' && value !='undefined') {
-                    state.value = value.split(",");
-                    selectValues.value = value.split(",");
-                }
-            }
-
-            /**
-             * 设置下拉框的值
-             */
-            function setValue(options, values) {
-                selectOptions.value = options
-                //emitData.value = values.join(",");
-                state.value = values;
-                selectValues.value = values;
-            }
-            const getBindValue = Object.assign({}, unref(props), unref(attrs));
-            return {
-                state,
-                attrs,
-                getBindValue,
-                selectOptions,
-                selectValues,
-                loadingEcho,
-                tag,
-                regModal,
-                setValue,
-                handleOpen
-            };
-        },
-    });
+      /**
+       * 设置下拉框的值
+       */
+      function setValue(options, values) {
+        selectOptions.value = options;
+        //emitData.value = values.join(",");
+        state.value = values;
+        selectValues.value = values;
+      }
+      const getBindValue = Object.assign({}, unref(props), unref(attrs));
+      return {
+        state,
+        attrs,
+        getBindValue,
+        selectOptions,
+        selectValues,
+        loadingEcho,
+        tag,
+        regModal,
+        setValue,
+        handleOpen,
+      };
+    },
+  });
 </script>
 <style lang="less" scoped>
-    .j-select-row {
-        @width: 82px;
+  .j-select-row {
+    @width: 82px;
 
-        .left {
-            width: calc(100% - @width - 8px);
-        }
-
-        .right {
-            width: @width;
-        }
-
-        .full {
-            width: 100%;
-        }
-
-        ::v-deep(.ant-select-search__field) {
-            display: none !important;
-        }
+    .left {
+      width: calc(100% - @width - 8px);
     }
+
+    .right {
+      width: @width;
+    }
+
+    .full {
+      width: 100%;
+    }
+
+    ::v-deep(.ant-select-search__field) {
+      display: none !important;
+    }
+  }
 </style>
diff --git a/src/components/Form/src/jeecg/components/JSelectUser.vue b/src/components/Form/src/jeecg/components/JSelectUser.vue
index 6dfe461..17435c3 100644
--- a/src/components/Form/src/jeecg/components/JSelectUser.vue
+++ b/src/components/Form/src/jeecg/components/JSelectUser.vue
@@ -1,158 +1,154 @@
 <!--用户选择组件-->
 <template>
-    <div>
-        <JSelectBiz @handleOpen="handleOpen" :loading="loadingEcho" v-bind="attrs"></JSelectBiz>
-        <UserSelectModal :rowKey="rowKey" @register="regModal" @getSelectResult="setValue"  v-bind="getBindValue"></UserSelectModal>
-    </div>
+  <div>
+    <JSelectBiz @handleOpen="handleOpen" :loading="loadingEcho" v-bind="attrs"></JSelectBiz>
+    <UserSelectModal :rowKey="rowKey" @register="regModal" @getSelectResult="setValue" v-bind="getBindValue"></UserSelectModal>
+  </div>
 </template>
 <script lang="ts">
-    import {unref} from 'vue';
-    import UserSelectModal from './modal/UserSelectModal.vue'
-    import JSelectBiz from './base/JSelectBiz.vue';
-    import {defineComponent, ref, reactive, watchEffect, watch, provide} from 'vue';
-    import {useModal} from '/@/components/Modal';
-    import {propTypes} from "/@/utils/propTypes";
-    import {useRuleFormItem} from "/@/hooks/component/useFormItem";
-    import {useAttrs} from "/@/hooks/core/useAttrs";
-    import {SelectTypes} from 'ant-design-vue/es/select';
+  import { unref } from 'vue';
+  import UserSelectModal from './modal/UserSelectModal.vue';
+  import JSelectBiz from './base/JSelectBiz.vue';
+  import { defineComponent, ref, reactive, watchEffect, watch, provide } from 'vue';
+  import { useModal } from '/@/components/Modal';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useRuleFormItem } from '/@/hooks/component/useFormItem';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { SelectTypes } from 'ant-design-vue/es/select';
 
-    export default defineComponent({
-        name: 'JSelectUser',
-        components: {
-          UserSelectModal, JSelectBiz
-        },
-        inheritAttrs: false,
-        props: {
-            value: propTypes.oneOfType([
-                propTypes.string,
-                propTypes.array
-            ]),
-            labelKey: {
-              type: String,
-              default: 'realname',
-            },
-            rowKey: {
-              type: String,
-              default: 'username',
-            },
-            params:{
-              type:Object,
-              default: () => {
-              }
-            },
-        },
-        emits: ['options-change', 'change','update:value'],
-        setup(props, {emit, refs}) {
-            const emitData = ref<object>();
-            //注册model
-            const [regModal, {openModal}] = useModal();
-            //表单值
-            const [state] = useRuleFormItem(props, 'value', 'change', emitData);
-            //下拉框选项值
-            const selectOptions = ref<SelectTypes['options']>([]);
-            //下拉框选中值
-            let selectValues = reactive<object>({
-                value: [],
-                change: false
-            });
-            // 是否正在加载回显数据
-            const loadingEcho = ref<boolean>(false)
-            //下发 selectOptions,xxxBiz组件接收
-            provide('selectOptions', selectOptions);
-            //下发 selectValues,xxxBiz组件接收
-            provide('selectValues', selectValues);
-            //下发 loadingEcho,xxxBiz组件接收
-            provide('loadingEcho', loadingEcho);
+  export default defineComponent({
+    name: 'JSelectUser',
+    components: {
+      UserSelectModal,
+      JSelectBiz,
+    },
+    inheritAttrs: false,
+    props: {
+      value: propTypes.oneOfType([propTypes.string, propTypes.array]),
+      labelKey: {
+        type: String,
+        default: 'realname',
+      },
+      rowKey: {
+        type: String,
+        default: 'username',
+      },
+      params: {
+        type: Object,
+        default: () => {},
+      },
+    },
+    emits: ['options-change', 'change', 'update:value'],
+    setup(props, { emit, refs }) {
+      const emitData = ref<object>();
+      //注册model
+      const [regModal, { openModal }] = useModal();
+      //表单值
+      const [state] = useRuleFormItem(props, 'value', 'change', emitData);
+      //下拉框选项值
+      const selectOptions = ref<SelectTypes['options']>([]);
+      //下拉框选中值
+      let selectValues = reactive<object>({
+        value: [],
+        change: false,
+      });
+      // 是否正在加载回显数据
+      const loadingEcho = ref<boolean>(false);
+      //下发 selectOptions,xxxBiz组件接收
+      provide('selectOptions', selectOptions);
+      //下发 selectValues,xxxBiz组件接收
+      provide('selectValues', selectValues);
+      //下发 loadingEcho,xxxBiz组件接收
+      provide('loadingEcho', loadingEcho);
 
-            const tag = ref(false);
-            const attrs = useAttrs();
+      const tag = ref(false);
+      const attrs = useAttrs();
 
+      /**
+       * 监听组件值
+       */
+      watchEffect(() => {
+        props.value && initValue();
+        // 查询条件重置的时候 界面显示未清空
+        if (!props.value) {
+          selectValues.value = [];
+        }
+      });
 
-            /**
-             * 监听组件值
-             */
-            watchEffect(() => {
-                props.value && initValue();
-                // 查询条件重置的时候 界面显示未清空
-                if(!props.value){
-                  selectValues.value = []
-                }
-            });
+      /**
+       * 监听selectValues变化
+       */
+      watch(selectValues, () => {
+        if (selectValues) {
+          state.value = selectValues.value;
+        }
+      });
 
-            /**
-             * 监听selectValues变化
-             */
-            watch(selectValues, () => {
-                if (selectValues) {
-                    state.value = selectValues.value;
-                }
-            })
+      /**
+       * 打卡弹出框
+       */
+      function handleOpen() {
+        tag.value = true;
+        openModal(true, {
+          isUpdate: false,
+        });
+      }
 
-            /**
-             * 打卡弹出框
-             */
-            function handleOpen() {
-                tag.value = true;
-                openModal(true, {
-                    isUpdate: false,
-                });
-            }
+      /**
+       * 将字符串值转化为数组
+       */
+      function initValue() {
+        let value = props.value ? props.value : [];
+        if (value && typeof value === 'string' && value != 'null' && value != 'undefined') {
+          state.value = value.split(',');
+          selectValues.value = value.split(',');
+        }
+      }
 
-            /**
-             * 将字符串值转化为数组
-             */
-            function initValue() {
-                let value = props.value ? props.value : [];
-                if (value && typeof value === 'string' && value!='null' && value !='undefined') {
-                    state.value = value.split(",");
-                    selectValues.value = value.split(",");
-                }
-            }
-
-            /**
-             * 设置下拉框的值
-             */
-            function setValue(options, values) {
-                selectOptions.value = options
-                //emitData.value = values.join(",");
-                state.value = values;
-                selectValues.value = values;
-                emit('update:value', values.join(','))
-            }
-            const getBindValue = Object.assign({}, unref(props), unref(attrs));
-            return {
-                state,
-                attrs,
-                selectOptions,
-                getBindValue,
-                selectValues,
-                loadingEcho,
-                tag,
-                regModal,
-                setValue,
-                handleOpen
-            };
-        },
-    });
+      /**
+       * 设置下拉框的值
+       */
+      function setValue(options, values) {
+        selectOptions.value = options;
+        //emitData.value = values.join(",");
+        state.value = values;
+        selectValues.value = values;
+        emit('update:value', values.join(','));
+      }
+      const getBindValue = Object.assign({}, unref(props), unref(attrs));
+      return {
+        state,
+        attrs,
+        selectOptions,
+        getBindValue,
+        selectValues,
+        loadingEcho,
+        tag,
+        regModal,
+        setValue,
+        handleOpen,
+      };
+    },
+  });
 </script>
 <style lang="less" scoped>
-    .j-select-row {
-        @width: 82px;
+  .j-select-row {
+    @width: 82px;
 
-        .left {
-            width: calc(100% - @width - 8px);
-        }
-
-        .right {
-            width: @width;
-        }
-
-        .full {
-            width: 100%;
-        }
-
-        ::v-deep(.ant-select-search__field) {
-            display: none !important;
-        }
+    .left {
+      width: calc(100% - @width - 8px);
     }
+
+    .right {
+      width: @width;
+    }
+
+    .full {
+      width: 100%;
+    }
+
+    ::v-deep(.ant-select-search__field) {
+      display: none !important;
+    }
+  }
 </style>
diff --git a/src/components/Form/src/jeecg/components/JSelectUserByDept.vue b/src/components/Form/src/jeecg/components/JSelectUserByDept.vue
index f5d0d6a..47e150a 100644
--- a/src/components/Form/src/jeecg/components/JSelectUserByDept.vue
+++ b/src/components/Form/src/jeecg/components/JSelectUserByDept.vue
@@ -1,155 +1,152 @@
 <!--用户选择组件-->
 <template>
-    <div>
-        <JSelectBiz @change="handleChange" @handleOpen="handleOpen" :loading="loadingEcho" v-bind="attrs"></JSelectBiz>
-        <UserSelectByDepModal :rowKey="rowKey" @register="regModal" @getSelectResult="setValue"  v-bind="getBindValue"></UserSelectByDepModal>
-    </div>
+  <div>
+    <JSelectBiz @change="handleChange" @handleOpen="handleOpen" :loading="loadingEcho" v-bind="attrs"></JSelectBiz>
+    <UserSelectByDepModal :rowKey="rowKey" @register="regModal" @getSelectResult="setValue" v-bind="getBindValue"></UserSelectByDepModal>
+  </div>
 </template>
 <script lang="ts">
-    import {unref} from 'vue';
-    import UserSelectByDepModal from './modal/UserSelectByDepModal.vue'
-    import JSelectBiz from './base/JSelectBiz.vue';
-    import {defineComponent, ref, reactive, watchEffect, watch, provide} from 'vue';
-    import {useModal} from '/@/components/Modal';
-    import {propTypes} from "/@/utils/propTypes";
-    import {useRuleFormItem} from "/@/hooks/component/useFormItem";
-    import {useAttrs} from "/@/hooks/core/useAttrs";
-    import {SelectTypes} from 'ant-design-vue/es/select';
-    export default defineComponent({
-        name: 'JSelectUserByDept',
-        components: {
-            UserSelectByDepModal, JSelectBiz
-        },
-        inheritAttrs: false,
-        props: {
-            value: propTypes.oneOfType([
-                propTypes.string,
-                propTypes.array
-            ]),
-            rowKey: {
-              type: String,
-              default: 'username',
-            },
-            labelKey: {
-              type: String,
-              default: 'realname',
-            },
-        },
-        emits: ['options-change', 'change','update:value'],
-        setup(props, {emit, refs}) {
-            const emitData = ref<object>();
-            //注册model
-            const [regModal, {openModal}] = useModal();
-            //表单值
-            const [state] = useRuleFormItem(props, 'value', 'change', emitData);
-            //下拉框选项值
-            const selectOptions = ref<SelectTypes['options']>([]);
-            //下拉框选中值
-            let selectValues = reactive<object>({
-                value: [],
-                change: false
-            });
-            // 是否正在加载回显数据
-            const loadingEcho = ref<boolean>(false)
-            //下发 selectOptions,xxxBiz组件接收
-            provide('selectOptions', selectOptions);
-            //下发 selectValues,xxxBiz组件接收
-            provide('selectValues', selectValues);
-            //下发 loadingEcho,xxxBiz组件接收
-            provide('loadingEcho', loadingEcho);
+  import { unref } from 'vue';
+  import UserSelectByDepModal from './modal/UserSelectByDepModal.vue';
+  import JSelectBiz from './base/JSelectBiz.vue';
+  import { defineComponent, ref, reactive, watchEffect, watch, provide } from 'vue';
+  import { useModal } from '/@/components/Modal';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useRuleFormItem } from '/@/hooks/component/useFormItem';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { SelectTypes } from 'ant-design-vue/es/select';
+  export default defineComponent({
+    name: 'JSelectUserByDept',
+    components: {
+      UserSelectByDepModal,
+      JSelectBiz,
+    },
+    inheritAttrs: false,
+    props: {
+      value: propTypes.oneOfType([propTypes.string, propTypes.array]),
+      rowKey: {
+        type: String,
+        default: 'username',
+      },
+      labelKey: {
+        type: String,
+        default: 'realname',
+      },
+    },
+    emits: ['options-change', 'change', 'update:value'],
+    setup(props, { emit, refs }) {
+      const emitData = ref<object>();
+      //注册model
+      const [regModal, { openModal }] = useModal();
+      //表单值
+      const [state] = useRuleFormItem(props, 'value', 'change', emitData);
+      //下拉框选项值
+      const selectOptions = ref<SelectTypes['options']>([]);
+      //下拉框选中值
+      let selectValues = reactive<object>({
+        value: [],
+        change: false,
+      });
+      // 是否正在加载回显数据
+      const loadingEcho = ref<boolean>(false);
+      //下发 selectOptions,xxxBiz组件接收
+      provide('selectOptions', selectOptions);
+      //下发 selectValues,xxxBiz组件接收
+      provide('selectValues', selectValues);
+      //下发 loadingEcho,xxxBiz组件接收
+      provide('loadingEcho', loadingEcho);
 
-            const tag = ref(false);
-            const attrs = useAttrs();
+      const tag = ref(false);
+      const attrs = useAttrs();
 
+      /**
+       * 监听组件值
+       */
+      watchEffect(() => {
+        initValue();
+      });
 
-            /**
-             * 监听组件值
-             */
-            watchEffect(() => {
-                initValue();
-            });
+      /**
+       * 监听selectValues变化
+       */
+      watch(selectValues, () => {
+        if (selectValues) {
+          state.value = selectValues.value;
+        }
+      });
 
-            /**
-             * 监听selectValues变化
-             */
-            watch(selectValues, () => {
-                if (selectValues) {
-                    state.value = selectValues.value;
-                }
-            });
+      /**
+       * 打卡弹出框
+       */
+      function handleOpen() {
+        tag.value = true;
+        openModal(true, {
+          isUpdate: false,
+        });
+      }
 
-            /**
-             * 打卡弹出框
-             */
-            function handleOpen() {
-                tag.value = true;
-                openModal(true, {
-                    isUpdate: false,
-                });
-            }
+      /**
+       * 将字符串值转化为数组
+       */
+      function initValue() {
+        let value = props.value ? props.value : [];
+        if (value && typeof value === 'string' && value != 'null' && value != 'undefined') {
+          state.value = value.split(',');
+          selectValues.value = value.split(',');
+        } else {
+          selectValues.value = value;
+        }
+      }
 
-            /**
-             * 将字符串值转化为数组
-             */
-            function initValue() {
-                let value = props.value ? props.value : [];
-                if (value && typeof value === 'string' && value!='null' && value !='undefined') {
-                    state.value = value.split(",");
-                    selectValues.value = value.split(",");
-                }else{
-                    selectValues.value = value;
-                }
-            }
+      /**
+       * 设置下拉框的值
+       */
+      function setValue(options, values) {
+        selectOptions.value = options;
+        //emitData.value = values.join(",");
+        state.value = values;
+        selectValues.value = values;
+        emit('update:value', values);
+      }
 
-            /**
-             * 设置下拉框的值
-             */
-            function setValue(options, values) {
-                selectOptions.value = options;
-                //emitData.value = values.join(",");
-                state.value = values;
-                selectValues.value = values;
-                emit('update:value', values)
-            }
-            
-            function handleChange(values) {
-                emit('update:value', values)
-            }
-            const getBindValue = Object.assign({}, unref(props), unref(attrs));
-            return {
-                state,
-                attrs,
-                selectOptions,
-                getBindValue,
-                selectValues,
-                loadingEcho,
-                tag,
-                regModal,
-                setValue,
-                handleOpen,
-                handleChange
-            };
-        },
-    });
+      function handleChange(values) {
+        emit('update:value', values);
+      }
+      const getBindValue = Object.assign({}, unref(props), unref(attrs));
+      return {
+        state,
+        attrs,
+        selectOptions,
+        getBindValue,
+        selectValues,
+        loadingEcho,
+        tag,
+        regModal,
+        setValue,
+        handleOpen,
+        handleChange,
+      };
+    },
+  });
 </script>
 <style lang="less" scoped>
-    .j-select-row {
-        @width: 82px;
+  .j-select-row {
+    @width: 82px;
 
-        .left {
-            width: calc(100% - @width - 8px);
-        }
-
-        .right {
-            width: @width;
-        }
-
-        .full {
-            width: 100%;
-        }
-
-        ::v-deep(.ant-select-search__field) {
-            display: none !important;
-        }
+    .left {
+      width: calc(100% - @width - 8px);
     }
+
+    .right {
+      width: @width;
+    }
+
+    .full {
+      width: 100%;
+    }
+
+    ::v-deep(.ant-select-search__field) {
+      display: none !important;
+    }
+  }
 </style>
diff --git a/src/components/Form/src/jeecg/components/JSwitch.vue b/src/components/Form/src/jeecg/components/JSwitch.vue
index a606fa1..baebadf 100644
--- a/src/components/Form/src/jeecg/components/JSwitch.vue
+++ b/src/components/Form/src/jeecg/components/JSwitch.vue
@@ -1,86 +1,75 @@
 <template>
   <div :class="prefixCls">
-    <a-select
-        v-if="query"
-        :options="selectOptions"
-        :disabled="disabled"
-        style="width: 100%"
-        v-bind="attrs"
-        @change="onSelectChange"/>
-    <a-switch
-        v-else
-        v-model:checked="checked"
-        :disabled="disabled"
-        v-bind="attrs"
-        @change="onSwitchChange"/>
+    <a-select v-if="query" :options="selectOptions" :disabled="disabled" style="width: 100%" v-bind="attrs" @change="onSelectChange" />
+    <a-switch v-else v-model:checked="checked" :disabled="disabled" v-bind="attrs" @change="onSwitchChange" />
   </div>
 </template>
 
 <script lang="ts" setup>
-import { computed, ref, watch } from 'vue'
-import { propTypes } from '/@/utils/propTypes'
-import { useAttrs } from '/@/hooks/core/useAttrs'
-import { useDesign } from '/@/hooks/web/useDesign'
+  import { computed, ref, watch } from 'vue';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { useDesign } from '/@/hooks/web/useDesign';
 
-const { prefixCls } = useDesign('j-switch')
-const props = defineProps({
-  // v-model:value
-  value: propTypes.oneOfType([
-    propTypes.string,
-    propTypes.number,
-  ]),
-  // 取值 options
-  options: propTypes.array.def(() => ['Y', 'N']),
-  // 文本 options
-  labelOptions: propTypes.array.def(() => ['是', '否']),
-  // 是否使用下拉
-  query: propTypes.bool.def(false),
-  // 是否禁用
-  disabled: propTypes.bool.def(false),
-})
-const attrs = useAttrs()
-const emit = defineEmits(['change', 'update:value'])
+  const { prefixCls } = useDesign('j-switch');
+  const props = defineProps({
+    // v-model:value
+    value: propTypes.oneOfType([propTypes.string, propTypes.number]),
+    // 取值 options
+    options: propTypes.array.def(() => ['Y', 'N']),
+    // 文本 options
+    labelOptions: propTypes.array.def(() => ['是', '否']),
+    // 是否使用下拉
+    query: propTypes.bool.def(false),
+    // 是否禁用
+    disabled: propTypes.bool.def(false),
+  });
+  const attrs = useAttrs();
+  const emit = defineEmits(['change', 'update:value']);
 
-const checked = ref<boolean>(false)
+  const checked = ref<boolean>(false);
 
-watch(() => props.value, (val) => {
-  if (!props.query) {
-    if (!val) {
-      checked.value = false
-      emitValue(props.options[1])
-    } else {
-      checked.value = props.options[0] == val
-    }
+  watch(
+    () => props.value,
+    (val) => {
+      if (!props.query) {
+        if (!val) {
+          checked.value = false;
+          emitValue(props.options[1]);
+        } else {
+          checked.value = props.options[0] == val;
+        }
+      }
+    },
+    { immediate: true }
+  );
+
+  const selectOptions = computed(() => {
+    let options: any[] = [];
+    options.push({ value: props.options[0], label: props.labelOptions[0] });
+    options.push({ value: props.options[1], label: props.labelOptions[1] });
+    return options;
+  });
+
+  function onSwitchChange(checked) {
+    let flag = checked === false ? props.options[1] : props.options[0];
+    emitValue(flag);
   }
-}, { immediate: true })
 
-const selectOptions = computed(() => {
-  let options: any[] = []
-  options.push({ value: props.options[0], label: props.labelOptions[0] })
-  options.push({ value: props.options[1], label: props.labelOptions[1] })
-  return options
-})
+  function onSelectChange(value) {
+    emitValue(value);
+  }
 
-function onSwitchChange(checked) {
-  let flag = checked === false ? props.options[1] : props.options[0]
-  emitValue(flag)
-}
-
-function onSelectChange(value) {
-  emitValue(value)
-}
-
-function emitValue(value) {
-  emit('change', value)
-  emit('update:value', value)
-}
+  function emitValue(value) {
+    emit('change', value);
+    emit('update:value', value);
+  }
 </script>
 
 <style lang="less">
-//noinspection LessUnresolvedVariable
-@prefix-cls: ~'@{namespace}-j-switch';
+  //noinspection LessUnresolvedVariable
+  @prefix-cls: ~'@{namespace}-j-switch';
 
-.@{prefix-cls} {
-}
-
-</style>
\ No newline at end of file
+  .@{prefix-cls} {
+  }
+</style>
diff --git a/src/components/Form/src/jeecg/components/JTreeDict.vue b/src/components/Form/src/jeecg/components/JTreeDict.vue
index ddc6128..6439290 100644
--- a/src/components/Form/src/jeecg/components/JTreeDict.vue
+++ b/src/components/Form/src/jeecg/components/JTreeDict.vue
@@ -1,134 +1,141 @@
 <template>
   <TreeSelect
-      :class="prefixCls"
-      :value="treeValue"
-      :treeData="treeData"
-      :loadData="asyncLoadTreeData"
-      allowClear
-      labelInValue
-      :dropdownStyle="{ maxHeight: '400px', overflow: 'auto' }"
-      style="width: 100%"
-      v-bind="attrs"
-      @change="onChange">
+    :class="prefixCls"
+    :value="treeValue"
+    :treeData="treeData"
+    :loadData="asyncLoadTreeData"
+    allowClear
+    labelInValue
+    :dropdownStyle="{ maxHeight: '400px', overflow: 'auto' }"
+    style="width: 100%"
+    v-bind="attrs"
+    @change="onChange"
+  >
   </TreeSelect>
 </template>
 
 <script lang="ts" setup>
-import { ref, watch } from 'vue'
-import { defHttp } from '/@/utils/http/axios'
-import { propTypes } from '/@/utils/propTypes'
-import { useAttrs } from '/@/hooks/core/useAttrs'
-import { useDesign } from '/@/hooks/web/useDesign'
-import { TreeSelect } from 'ant-design-vue'
+  import { ref, watch } from 'vue';
+  import { defHttp } from '/@/utils/http/axios';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { TreeSelect } from 'ant-design-vue';
 
-enum Api {
-  view = '/sys/category/loadOne',
-  root = '/sys/category/loadTreeRoot',
-  children = '/sys/category/loadTreeChildren',
-}
+  enum Api {
+    view = '/sys/category/loadOne',
+    root = '/sys/category/loadTreeRoot',
+    children = '/sys/category/loadTreeChildren',
+  }
 
-const { prefixCls } = useDesign('j-tree-dict')
-const props = defineProps({
-  // v-model:value
-  value: propTypes.string.def(''),
-  field: propTypes.string.def('id'),
-  parentCode: propTypes.string.def(''),
-  async: propTypes.bool.def(false),
-})
-const attrs = useAttrs()
-const emit = defineEmits(['change', 'update:value'])
+  const { prefixCls } = useDesign('j-tree-dict');
+  const props = defineProps({
+    // v-model:value
+    value: propTypes.string.def(''),
+    field: propTypes.string.def('id'),
+    parentCode: propTypes.string.def(''),
+    async: propTypes.bool.def(false),
+  });
+  const attrs = useAttrs();
+  const emit = defineEmits(['change', 'update:value']);
 
-const treeData = ref<any[]>([])
-const treeValue = ref<any>(null)
+  const treeData = ref<any[]>([]);
+  const treeValue = ref<any>(null);
 
-watch(() => props.value, () => loadViewInfo(), { deep: true, immediate: true })
-watch(() => props.parentCode, () => loadRoot(), { deep: true, immediate: true })
+  watch(
+    () => props.value,
+    () => loadViewInfo(),
+    { deep: true, immediate: true }
+  );
+  watch(
+    () => props.parentCode,
+    () => loadRoot(),
+    { deep: true, immediate: true }
+  );
 
-async function loadViewInfo() {
-  if (!props.value || props.value == '0') {
-    treeValue.value = null
-  } else {
-    let params = { field: props.field, val: props.value }
-    let result = await defHttp.get({ url: Api.view, params })
-    treeValue.value = {
-      value: props.value,
-      label: result.name,
+  async function loadViewInfo() {
+    if (!props.value || props.value == '0') {
+      treeValue.value = null;
+    } else {
+      let params = { field: props.field, val: props.value };
+      let result = await defHttp.get({ url: Api.view, params });
+      treeValue.value = {
+        value: props.value,
+        label: result.name,
+      };
     }
   }
-}
 
-async function loadRoot() {
-  let params = {
-    async: props.async,
-    pcode: props.parentCode,
+  async function loadRoot() {
+    let params = {
+      async: props.async,
+      pcode: props.parentCode,
+    };
+    let result = await defHttp.get({ url: Api.root, params });
+    treeData.value = [...result];
+    handleTreeNodeValue(result);
   }
-  let result = await defHttp.get({ url: Api.root, params })
-  treeData.value = [...result]
-  handleTreeNodeValue(result)
-}
 
-async function asyncLoadTreeData(treeNode) {
-  if (!props.async || treeNode.dataRef.children) {
-    return Promise.resolve()
+  async function asyncLoadTreeData(treeNode) {
+    if (!props.async || treeNode.dataRef.children) {
+      return Promise.resolve();
+    }
+    let pid = treeNode.dataRef.key;
+    let params = { pid: pid };
+    let result = await defHttp.get({ url: Api.children, params });
+    handleTreeNodeValue(result);
+    addChildren(pid, result, treeData.value);
+    treeData.value = [...treeData.value];
+    return Promise.resolve();
   }
-  let pid = treeNode.dataRef.key
-  let params = { pid: pid }
-  let result = await defHttp.get({ url: Api.children, params })
-  handleTreeNodeValue(result)
-  addChildren(pid, result, treeData.value)
-  treeData.value = [...treeData.value]
-  return Promise.resolve()
-}
 
-function addChildren(pid, children, treeArray) {
-  if (treeArray && treeArray.length > 0) {
-    for (let item of treeArray) {
-      if (item.key == pid) {
-        if (!children || children.length == 0) {
-          item.leaf = true
+  function addChildren(pid, children, treeArray) {
+    if (treeArray && treeArray.length > 0) {
+      for (let item of treeArray) {
+        if (item.key == pid) {
+          if (!children || children.length == 0) {
+            item.leaf = true;
+          } else {
+            item.children = children;
+          }
+          break;
         } else {
-          item.children = children
+          addChildren(pid, children, item.children);
         }
-        break
-      } else {
-        addChildren(pid, children, item.children)
       }
     }
   }
-}
 
-function handleTreeNodeValue(result) {
-  let storeField = props.field == 'code' ? 'code' : 'key'
-  for (let i of result) {
-    i.value = i[storeField]
-    i.isLeaf = (i.leaf)
-    if (i.children && i.children.length > 0) {
-      handleTreeNodeValue(i.children)
+  function handleTreeNodeValue(result) {
+    let storeField = props.field == 'code' ? 'code' : 'key';
+    for (let i of result) {
+      i.value = i[storeField];
+      i.isLeaf = i.leaf;
+      if (i.children && i.children.length > 0) {
+        handleTreeNodeValue(i.children);
+      }
     }
   }
-}
 
-function onChange(value) {
-  if (!value) {
-    emitValue('')
-  } else {
-    emitValue(value.value)
+  function onChange(value) {
+    if (!value) {
+      emitValue('');
+    } else {
+      emitValue(value.value);
+    }
+    treeValue.value = value;
   }
-  treeValue.value = value
-}
-
-function emitValue(value) {
-  emit('change', value)
-  emit('update:value', value)
-}
 
+  function emitValue(value) {
+    emit('change', value);
+    emit('update:value', value);
+  }
 </script>
 
 <style lang="less">
-//noinspection LessUnresolvedVariable
-@prefix-cls: ~'@{namespace}-j-tree-dict';
+  //noinspection LessUnresolvedVariable
+  @prefix-cls: ~'@{namespace}-j-tree-dict';
 
-.@{prefix-cls} {
-}
-
-</style>
\ No newline at end of file
+  .@{prefix-cls} {
+  }
+</style>
diff --git a/src/components/Form/src/jeecg/components/JTreeSelect.vue b/src/components/Form/src/jeecg/components/JTreeSelect.vue
index 3e991c6..358a3c7 100644
--- a/src/components/Form/src/jeecg/components/JTreeSelect.vue
+++ b/src/components/Form/src/jeecg/components/JTreeSelect.vue
@@ -1,245 +1,250 @@
 <template>
-    <a-tree-select
-            allowClear
-            labelInValue
-            style="width: 100%"
-            :getPopupContainer="(node) => node.parentNode"
-            :dropdownStyle="{ maxHeight: '400px', overflow: 'auto' }"
-            :placeholder="placeholder"
-            :loadData="asyncLoadTreeData"
-            :value="treeValue"
-            :treeData="treeData"
-            :multiple="multiple"
-            v-bind="attrs"
-            @change="onChange"
-            @search="onSearch">
-    </a-tree-select>
+  <a-tree-select
+    allowClear
+    labelInValue
+    style="width: 100%"
+    :getPopupContainer="(node) => node.parentNode"
+    :dropdownStyle="{ maxHeight: '400px', overflow: 'auto' }"
+    :placeholder="placeholder"
+    :loadData="asyncLoadTreeData"
+    :value="treeValue"
+    :treeData="treeData"
+    :multiple="multiple"
+    v-bind="attrs"
+    @change="onChange"
+    @search="onSearch"
+  >
+  </a-tree-select>
 </template>
 <script lang="ts" setup>
-    /*
-    * 异步树加载组件 通过传入表名 显示字段 存储字段 加载一个树控件
-    * <j-tree-select dict="aa_tree_test,aad,id" pid-field="pid" ></j-tree-select>
-    * */
-    import {ref, watch, unref} from 'vue'
-    import {defHttp} from '/@/utils/http/axios'
-    import {propTypes} from '/@/utils/propTypes'
-    import {useAttrs} from '/@/hooks/core/useAttrs'
-    import {TreeSelect} from 'ant-design-vue'
-    import {useMessage} from '/@/hooks/web/useMessage';
+  /*
+   * 异步树加载组件 通过传入表名 显示字段 存储字段 加载一个树控件
+   * <j-tree-select dict="aa_tree_test,aad,id" pid-field="pid" ></j-tree-select>
+   * */
+  import { ref, watch, unref } from 'vue';
+  import { defHttp } from '/@/utils/http/axios';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { TreeSelect } from 'ant-design-vue';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
-    enum Api {
-        url = '/sys/dict/loadTreeData',
-        view = '/sys/dict/loadDictItem/',
+  enum Api {
+    url = '/sys/dict/loadTreeData',
+    view = '/sys/dict/loadDictItem/',
+  }
+
+  const props = defineProps({
+    value: propTypes.string.def(''),
+    placeholder: propTypes.string.def('请选择'),
+    dict: propTypes.string.def('id'),
+    parentCode: propTypes.string.def(''),
+    pidField: propTypes.string.def('pid'),
+    pidValue: propTypes.string.def('0'),
+    hasChildField: propTypes.string.def(''),
+    condition: propTypes.string.def(''),
+    multiple: propTypes.bool.def(false),
+    loadTriggleChange: propTypes.bool.def(false),
+  });
+  const attrs = useAttrs();
+  const emit = defineEmits(['change', 'update:value']);
+  const { createMessage } = useMessage();
+  //树形下拉数据
+  const treeData = ref<any[]>([]);
+  //选择数据
+  const treeValue = ref<any>(null);
+  const tableName = ref<any>('');
+  const text = ref<any>('');
+  const code = ref<any>('');
+  /**
+   * 监听value数据并初始化
+   */
+  watch(
+    () => props.value,
+    () => loadItemByCode(),
+    { deep: true, immediate: true }
+  );
+  /**
+   * 监听dict变化
+   */
+  watch(
+    () => props.dict,
+    () => {
+      initDictInfo();
+      loadRoot();
+    },
+    { deep: true, immediate: true }
+  );
+
+  /**
+   * 根据code获取下拉数据并回显
+   */
+  async function loadItemByCode() {
+    if (!props.value || props.value == '0') {
+      treeValue.value = null;
+    } else {
+      let params = { key: props.value };
+      let result = await defHttp.get({ url: `${Api.view}${props.dict}`, params }, { isTransformResponse: false });
+      if (result.success) {
+        let values = props.value.split(',');
+        treeValue.value = result.result.map((item, index) => ({
+          key: values[index],
+          value: values[index],
+          label: item,
+        }));
+        onLoadTriggleChange(result.result[0]);
+      }
     }
+  }
 
-    const props = defineProps({
-        value: propTypes.string.def(''),
-        placeholder: propTypes.string.def('请选择'),
-        dict: propTypes.string.def('id'),
-        parentCode: propTypes.string.def(''),
-        pidField: propTypes.string.def('pid'),
-        pidValue: propTypes.string.def('0'),
-        hasChildField: propTypes.string.def(''),
-        condition: propTypes.string.def(''),
-        multiple: propTypes.bool.def(false),
-        loadTriggleChange: propTypes.bool.def(false),
+  function onLoadTriggleChange(text) {
+    //只有单选才会触发
+    if (!props.multiple && props.loadTriggleChange) {
+      emit('change', props.value, text);
+    }
+  }
+
+  /**
+   * 初始化数据
+   */
+  function initDictInfo() {
+    let arr = props.dict?.split(',');
+    tableName.value = arr[0];
+    text.value = arr[1];
+    code.value = arr[2];
+  }
+
+  /**
+   * 加载下拉树形数据
+   */
+  async function loadRoot() {
+    let params = {
+      pid: props.pidValue,
+      pidField: props.pidField,
+      hasChildField: props.hasChildField,
+      condition: props.condition,
+      tableName: unref(tableName),
+      text: unref(text),
+      code: unref(code),
+    };
+    let res = await defHttp.get({ url: Api.url, params }, { isTransformResponse: false });
+    if (res.success && res.result) {
+      for (let i of res.result) {
+        i.value = i.key;
+        i.isLeaf = !!i.leaf;
+      }
+      treeData.value = [...res.result];
+    } else {
+      console.log('数根节点查询结果异常', res);
+    }
+  }
+
+  /**
+   * 异步加载数据
+   */
+  async function asyncLoadTreeData(treeNode) {
+    if (treeNode.dataRef.children) {
+      return Promise.resolve();
+    }
+    let pid = treeNode.dataRef.key;
+    let params = {
+      pid: pid,
+      pidField: props.pidField,
+      hasChildField: props.hasChildField,
+      condition: props.condition,
+      tableName: unref(tableName),
+      text: unref(text),
+      code: unref(code),
+    };
+    let res = await defHttp.get({ url: Api.url, params }, { isTransformResponse: false });
+    if (res.success) {
+      for (let i of res.result) {
+        i.value = i.key;
+        i.isLeaf = !!i.leaf;
+      }
+      //添加子节点
+      addChildren(pid, res.result, treeData.value);
+      treeData.value = [...treeData.value];
+    }
+    return Promise.resolve();
+  }
+
+  /**
+   * 加载子节点
+   */
+  function addChildren(pid, children, treeArray) {
+    if (treeArray && treeArray.length > 0) {
+      for (let item of treeArray) {
+        if (item.key == pid) {
+          if (!children || children.length == 0) {
+            item.isLeaf = true;
+          } else {
+            item.children = children;
+          }
+          break;
+        } else {
+          addChildren(pid, children, item.children);
+        }
+      }
+    }
+  }
+
+  /**
+   * 选中树节点事件
+   */
+  function onChange(value) {
+    if (!value) {
+      emitValue('');
+    } else if (value instanceof Array) {
+      emitValue(value.map((item) => item.value).join(','));
+    } else {
+      emitValue(value.value);
+    }
+    treeValue.value = value;
+  }
+
+  function emitValue(value) {
+    emit('change', value);
+    emit('update:value', value);
+  }
+
+  /**
+   * 文本框值变化
+   */
+  function onSearch(value) {
+    console.log(value);
+  }
+
+  /**
+   * 校验条件配置是否有误
+   */
+  function validateProp() {
+    let mycondition = props.condition;
+    return new Promise((resolve, reject) => {
+      if (!mycondition) {
+        resolve();
+      } else {
+        try {
+          let test = JSON.parse(mycondition);
+          if (typeof test == 'object' && test) {
+            resolve();
+          } else {
+            createMessage.error('组件JTreeSelect-condition传值有误，需要一个json字符串!');
+            reject();
+          }
+        } catch (e) {
+          createMessage.error('组件JTreeSelect-condition传值有误，需要一个json字符串!');
+          reject();
+        }
+      }
     });
-    const attrs = useAttrs();
-    const emit = defineEmits(['change', 'update:value'])
-    const {createMessage} = useMessage();
-    //树形下拉数据
-    const treeData = ref<any[]>([]);
-    //选择数据
-    const treeValue = ref<any>(null);
-    const tableName = ref<any>('');
-    const text = ref<any>('');
-    const code = ref<any>('');
-    /**
-     * 监听value数据并初始化
-     */
-    watch(() => props.value, () => loadItemByCode(), {deep: true, immediate: true});
-    /**
-     * 监听dict变化
-     */
-    watch(() => props.dict,
-        () => {
-            initDictInfo();
-            loadRoot();
-        },
-        {deep: true, immediate: true}
-    );
+  }
 
-    /**
-     * 根据code获取下拉数据并回显
-     */
-    async function loadItemByCode() {
-        if (!props.value || props.value == "0") {
-            treeValue.value = null
-        } else {
-            let params = {key: props.value};
-            let result = await defHttp.get({url: `${Api.view}${props.dict}`, params}, {isTransformResponse: false});
-            if (result.success) {
-                let values = props.value.split(',');
-                treeValue.value = result.result.map((item, index) => ({
-                    key: values[index],
-                    value: values[index],
-                    label: item
-                }));
-                onLoadTriggleChange(result.result[0]);
-            }
-        }
-    }
-
-    function onLoadTriggleChange(text) {
-        //只有单选才会触发
-        if (!props.multiple && props.loadTriggleChange) {
-            emit('change', props.value, text)
-        }
-    }
-
-    /**
-     * 初始化数据
-     */
-    function initDictInfo() {
-        let arr = props.dict?.split(",");
-        tableName.value = arr[0];
-        text.value = arr[1];
-        code.value = arr[2]
-    }
-
-    /**
-     * 加载下拉树形数据
-     */
-    async function loadRoot() {
-        let params = {
-            pid: props.pidValue,
-            pidField: props.pidField,
-            hasChildField: props.hasChildField,
-            condition: props.condition,
-            tableName: unref(tableName),
-            text: unref(text),
-            code: unref(code)
-        };
-        let res = await defHttp.get({url: Api.url, params}, {isTransformResponse: false});
-        if (res.success && res.result) {
-            for (let i of res.result) {
-                i.value = i.key;
-                i.isLeaf = !!i.leaf;
-            }
-            treeData.value = [...res.result];
-        } else {
-            console.log("数根节点查询结果异常", res)
-        }
-    }
-
-    /**
-     * 异步加载数据
-     */
-    async function asyncLoadTreeData(treeNode) {
-        if (treeNode.dataRef.children) {
-            return Promise.resolve()
-        }
-        let pid = treeNode.dataRef.key;
-        let params = {
-            pid: pid,
-            pidField: props.pidField,
-            hasChildField: props.hasChildField,
-            condition: props.condition,
-            tableName: unref(tableName),
-            text: unref(text),
-            code: unref(code),
-        };
-        let res = await defHttp.get({url: Api.url, params}, {isTransformResponse: false});
-        if (res.success) {
-            for (let i of res.result) {
-                i.value = i.key;
-                i.isLeaf = !!i.leaf;
-            }
-            //添加子节点
-            addChildren(pid, res.result, treeData.value);
-            treeData.value = [...treeData.value];
-        }
-        return Promise.resolve()
-    }
-
-    /**
-     * 加载子节点
-     */
-    function addChildren(pid, children, treeArray) {
-        if (treeArray && treeArray.length > 0) {
-            for (let item of treeArray) {
-                if (item.key == pid) {
-                    if (!children || children.length == 0) {
-                        item.isLeaf = true;
-                    } else {
-                        item.children = children
-                    }
-                    break
-                } else {
-                    addChildren(pid, children, item.children)
-                }
-            }
-        }
-    }
-
-    /**
-     * 选中树节点事件
-     */
-    function onChange(value) {
-        if (!value) {
-            emitValue('')
-        } else if (value instanceof Array) {
-            emitValue(value.map(item => item.value).join(','))
-        } else {
-            emitValue(value.value)
-        }
-        treeValue.value = value
-    }
-
-    function emitValue(value) {
-        emit('change', value);
-        emit('update:value', value)
-    }
-
-    /**
-     * 文本框值变化
-     */
-    function onSearch(value) {
-        console.log(value)
-    }
-
-    /**
-     * 校验条件配置是否有误
-     */
-    function validateProp() {
-        let mycondition = props.condition;
-        return new Promise((resolve, reject) => {
-            if (!mycondition) {
-                resolve();
-            } else {
-                try {
-                    let test = JSON.parse(mycondition);
-                    if (typeof test == 'object' && test) {
-                        resolve()
-                    } else {
-                        createMessage.error("组件JTreeSelect-condition传值有误，需要一个json字符串!");
-                        reject()
-                    }
-                } catch (e) {
-                    createMessage.error("组件JTreeSelect-condition传值有误，需要一个json字符串!");
-                    reject()
-                }
-            }
-        })
-    }
-
-    // onCreated
-    validateProp().then(() => {
-        initDictInfo();
-        loadRoot();
-        loadItemByCode();
-    })
+  // onCreated
+  validateProp().then(() => {
+    initDictInfo();
+    loadRoot();
+    loadItemByCode();
+  });
 </script>
 
-<style lang="less">
-</style>
+<style lang="less"></style>
diff --git a/src/components/Form/src/jeecg/components/JUpload/JUpload.vue b/src/components/Form/src/jeecg/components/JUpload/JUpload.vue
index df7befe..4091065 100644
--- a/src/components/Form/src/jeecg/components/JUpload/JUpload.vue
+++ b/src/components/Form/src/jeecg/components/JUpload/JUpload.vue
@@ -1,23 +1,24 @@
 <template>
   <div ref="containerRef" :class="`${prefixCls}-container`">
     <a-upload
-        :headers="headers"
-        :multiple="multiple"
-        :action="uploadUrl"
-        :fileList="fileList"
-        :disabled="disabled"
-        :remove="onRemove"
-        v-bind="bindProps"
-        @change="onFileChange"
-        @preview="onFilePreview">
+      :headers="headers"
+      :multiple="multiple"
+      :action="uploadUrl"
+      :fileList="fileList"
+      :disabled="disabled"
+      :remove="onRemove"
+      v-bind="bindProps"
+      @change="onFileChange"
+      @preview="onFilePreview"
+    >
       <template v-if="isImageMode">
         <div v-if="!isMaxCount">
-          <Icon icon="ant-design:plus-outlined"/>
+          <Icon icon="ant-design:plus-outlined" />
           <div class="ant-upload-text">{{ text }}</div>
         </div>
       </template>
       <a-button v-else-if="buttonVisible" :disabled="isMaxCount || disabled">
-        <Icon icon="ant-design:upload-outlined"/>
+        <Icon icon="ant-design:upload-outlined" />
         <span>{{ text }}</span>
       </a-button>
     </a-upload>
@@ -25,390 +26,394 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, reactive, computed, watch, nextTick, createApp } from 'vue'
-import { Icon } from '/@/components/Icon'
-import { getToken } from '/@/utils/auth'
-import { uploadUrl } from '/@/api/common/api'
-import { propTypes } from '/@/utils/propTypes'
-import { useMessage } from '/@/hooks/web/useMessage'
-import { createImgPreview } from '/@/components/Preview/index'
-import { useAttrs } from '/@/hooks/core/useAttrs'
-import { useDesign } from '/@/hooks/web/useDesign'
-import { UploadTypeEnum } from './upload.data'
-import { getFileAccessHttpUrl } from '/@/utils/common/compUtils'
-import UploadItemActions from './components/UploadItemActions.vue'
+  import { ref, reactive, computed, watch, nextTick, createApp } from 'vue';
+  import { Icon } from '/@/components/Icon';
+  import { getToken } from '/@/utils/auth';
+  import { uploadUrl } from '/@/api/common/api';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { createImgPreview } from '/@/components/Preview/index';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { UploadTypeEnum } from './upload.data';
+  import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
+  import UploadItemActions from './components/UploadItemActions.vue';
 
-const { createMessage, createConfirm } = useMessage()
-const { prefixCls } = useDesign('j-upload')
-const attrs = useAttrs()
-const emit = defineEmits(['change', 'update:value'])
-const props = defineProps({
-  value: propTypes.oneOfType([propTypes.string, propTypes.array]),
-  text: propTypes.string.def('上传'),
-  fileType: propTypes.string.def(UploadTypeEnum.all),
-  /*这个属性用于控制文件上传的业务路径*/
-  bizPath: propTypes.string.def('temp'),
-  /**
-   * 是否返回url，
-   * true：仅返回url
-   * false：返回fileName filePath fileSize
-   */
-  returnUrl: propTypes.bool.def(true),
-  // 最大上传数量
-  maxCount: propTypes.number.def(0),
-  buttonVisible: propTypes.bool.def(true),
-  multiple: propTypes.bool.def(true),
-  // 是否显示左右移动按钮
-  mover: propTypes.bool.def(true),
-  // 是否显示下载按钮
-  download: propTypes.bool.def(true),
-  // 删除时是否显示确认框
-  removeConfirm: propTypes.bool.def(false),
-  beforeUpload: propTypes.func,
-  disabled: propTypes.bool.def(false),
-})
+  const { createMessage, createConfirm } = useMessage();
+  const { prefixCls } = useDesign('j-upload');
+  const attrs = useAttrs();
+  const emit = defineEmits(['change', 'update:value']);
+  const props = defineProps({
+    value: propTypes.oneOfType([propTypes.string, propTypes.array]),
+    text: propTypes.string.def('上传'),
+    fileType: propTypes.string.def(UploadTypeEnum.all),
+    /*这个属性用于控制文件上传的业务路径*/
+    bizPath: propTypes.string.def('temp'),
+    /**
+     * 是否返回url，
+     * true：仅返回url
+     * false：返回fileName filePath fileSize
+     */
+    returnUrl: propTypes.bool.def(true),
+    // 最大上传数量
+    maxCount: propTypes.number.def(0),
+    buttonVisible: propTypes.bool.def(true),
+    multiple: propTypes.bool.def(true),
+    // 是否显示左右移动按钮
+    mover: propTypes.bool.def(true),
+    // 是否显示下载按钮
+    download: propTypes.bool.def(true),
+    // 删除时是否显示确认框
+    removeConfirm: propTypes.bool.def(false),
+    beforeUpload: propTypes.func,
+    disabled: propTypes.bool.def(false),
+  });
 
-const headers = reactive({
-  'X-Access-Token': getToken(),
-})
-const fileList = ref<any[]>([])
-const uploadGoOn = ref<boolean>(true)
-// refs
-const containerRef = ref()
-// 是否达到了最大上传数量
-const isMaxCount = computed(() => props.maxCount > 0 && fileList.value.length >= props.maxCount)
-// 当前是否是上传图片模式
-const isImageMode = computed(() => props.fileType === UploadTypeEnum.image)
-// 合并 props 和 attrs
-const bindProps = computed(() => {
-  const bind: any = Object.assign({}, props, attrs)
-  bind.name = 'file'
-  bind.listType = isImageMode.value ? 'picture-card' : 'text'
-  bind.class = [bind.class, { 'upload-disabled': props.disabled }]
-  bind.data = { 'biz': props.bizPath, ...(bind.data) }
-  //update-begin-author:taoyan date:20220407 for: 自定义beforeUpload return false，并不能中断上传过程
-  if(!bind.beforeUpload){
-    bind.beforeUpload = onBeforeUpload
-  }
-  //update-end-author:taoyan date:20220407 for: 自定义beforeUpload return false，并不能中断上传过程
-  // 如果当前是图片上传模式，就只能上传图片
-  if (isImageMode.value && !bind.accept) {
-    bind.accept = 'image/*'
-  }
-  return bind
-})
-
-watch(() => props.value, (val) => {
-  if (Array.isArray(val)) {
-    if (props.returnUrl) {
-      parsePathsValue(val.join(','))
-    } else {
-      parseArrayValue(val)
+  const headers = reactive({
+    'X-Access-Token': getToken(),
+  });
+  const fileList = ref<any[]>([]);
+  const uploadGoOn = ref<boolean>(true);
+  // refs
+  const containerRef = ref();
+  // 是否达到了最大上传数量
+  const isMaxCount = computed(() => props.maxCount > 0 && fileList.value.length >= props.maxCount);
+  // 当前是否是上传图片模式
+  const isImageMode = computed(() => props.fileType === UploadTypeEnum.image);
+  // 合并 props 和 attrs
+  const bindProps = computed(() => {
+    const bind: any = Object.assign({}, props, attrs);
+    bind.name = 'file';
+    bind.listType = isImageMode.value ? 'picture-card' : 'text';
+    bind.class = [bind.class, { 'upload-disabled': props.disabled }];
+    bind.data = { biz: props.bizPath, ...bind.data };
+    //update-begin-author:taoyan date:20220407 for: 自定义beforeUpload return false，并不能中断上传过程
+    if (!bind.beforeUpload) {
+      bind.beforeUpload = onBeforeUpload;
     }
-  } else {
-    parsePathsValue(val)
-  }
-}, { immediate: true })
-
-watch(fileList, () => nextTick(() => addActionsListener()), { immediate: true })
-
-const antUploadItemCls = 'ant-upload-list-item'
-
-// Listener
-function addActionsListener() {
-  if (!isImageMode.value) {
-    return
-  }
-  const uploadItems = containerRef.value ? containerRef.value.getElementsByClassName(antUploadItemCls) : null
-  if (!uploadItems || uploadItems.length === 0) {
-    return
-  }
-  for (const uploadItem of uploadItems) {
-    let hasActions = uploadItem.getAttribute('data-has-actions') === 'true'
-    if (!hasActions) {
-      uploadItem.addEventListener('mouseover', onAddActionsButton)
+    //update-end-author:taoyan date:20220407 for: 自定义beforeUpload return false，并不能中断上传过程
+    // 如果当前是图片上传模式，就只能上传图片
+    if (isImageMode.value && !bind.accept) {
+      bind.accept = 'image/*';
     }
-  }
-}
+    return bind;
+  });
 
-// 添加可左右移动的按钮
-function onAddActionsButton(event) {
-  const getUploadItem = () => {
-    for (const path of event.path) {
-      if (path.classList.contains(antUploadItemCls)) {
-        return path
-      } else if (path.classList.contains(`${prefixCls}-container`)) {
-        return null
-      }
-    }
-    return null
-  }
-  const uploadItem = getUploadItem()
-  if (!uploadItem) {
-    return
-  }
-  const actions = uploadItem.getElementsByClassName('ant-upload-list-item-actions')
-  if (!actions || actions.length === 0) {
-    return
-  }
-  // 添加操作按钮
-  const div = document.createElement('div')
-  div.className = 'upload-actions-container'
-  createApp(UploadItemActions, {
-    element: uploadItem,
-    fileList: fileList,
-    mover: props.mover,
-    download: props.download,
-    emitValue: emitValue,
-  }).mount(div)
-  actions[0].appendChild(div)
-  uploadItem.setAttribute('data-has-actions', 'true')
-  uploadItem.removeEventListener('mouseover', onAddActionsButton)
-}
-
-// 解析数据库存储的逗号分割
-function parsePathsValue(paths) {
-  if (!paths || paths.length == 0) {
-    fileList.value = []
-    return
-  }
-  let list: any[] = []
-  for (const item of paths.split(',')) {
-    let url = getFileAccessHttpUrl(item)
-    list.push({
-      uid: uidGenerator(),
-      name: getFileName(item),
-      status: 'done',
-      url: url,
-      response: { status: 'history', message: item },
-    })
-  }
-  fileList.value = list
-}
-
-// 解析数组值
-function parseArrayValue(array) {
-  if (!array || array.length == 0) {
-    fileList.value = []
-    return
-  }
-  let list: any[] = []
-  for (const item of array) {
-    let url = getFileAccessHttpUrl(item.filePath)
-    list.push({
-      uid: uidGenerator(),
-      name: item.fileName,
-      url: url,
-      status: 'done',
-      response: { status: 'history', message: item.filePath },
-    })
-  }
-  fileList.value = list
-}
-
-// 文件上传之前的操作
-function onBeforeUpload(file) {
-  uploadGoOn.value = true
-  if (isImageMode.value) {
-    if (file.type.indexOf('image') < 0) {
-      createMessage.warning('请上传图片')
-      uploadGoOn.value = false
-      return false
-    }
-  }
-  // 扩展 beforeUpload 验证
-  if (typeof props.beforeUpload === 'function') {
-    return props.beforeUpload(file)
-  }
-  return true
-}
-
-// 删除处理事件
-function onRemove() {
-  if (props.removeConfirm) {
-    return new Promise(resolve => {
-      createConfirm({
-        title: '删除',
-        content: `确定要删除这${isImageMode.value ? '张图片' : '个文件'}吗？`,
-        iconType: 'warning',
-        onOk: () => resolve(true),
-        onCancel: () => resolve(false),
-      })
-    })
-  }
-  return true
-}
-
-// upload组件change事件
-function onFileChange(info) {
-  if (!info.file.status && uploadGoOn.value === false) {
-    info.fileList.pop()
-  }
-  let fileListTemp = info.fileList
-  // 限制最大上传数
-  if (props.maxCount > 0) {
-    let count = fileListTemp.length
-    if (count >= props.maxCount) {
-      let diffNum = props.maxCount - fileListTemp.length
-      if (diffNum >= 0) {
-        fileListTemp = fileListTemp.slice(-props.maxCount)
+  watch(
+    () => props.value,
+    (val) => {
+      if (Array.isArray(val)) {
+        if (props.returnUrl) {
+          parsePathsValue(val.join(','));
+        } else {
+          parseArrayValue(val);
+        }
       } else {
-        return
+        parsePathsValue(val);
+      }
+    },
+    { immediate: true }
+  );
+
+  watch(fileList, () => nextTick(() => addActionsListener()), { immediate: true });
+
+  const antUploadItemCls = 'ant-upload-list-item';
+
+  // Listener
+  function addActionsListener() {
+    if (!isImageMode.value) {
+      return;
+    }
+    const uploadItems = containerRef.value ? containerRef.value.getElementsByClassName(antUploadItemCls) : null;
+    if (!uploadItems || uploadItems.length === 0) {
+      return;
+    }
+    for (const uploadItem of uploadItems) {
+      let hasActions = uploadItem.getAttribute('data-has-actions') === 'true';
+      if (!hasActions) {
+        uploadItem.addEventListener('mouseover', onAddActionsButton);
       }
     }
   }
-  if (info.file.status === 'done') {
-    if (info.file.response.success) {
-      fileListTemp = fileListTemp.map((file) => {
-        if (file.response) {
-          let reUrl = file.response.message
-          file.url = getFileAccessHttpUrl(reUrl)
+
+  // 添加可左右移动的按钮
+  function onAddActionsButton(event) {
+    const getUploadItem = () => {
+      for (const path of event.path) {
+        if (path.classList.contains(antUploadItemCls)) {
+          return path;
+        } else if (path.classList.contains(`${prefixCls}-container`)) {
+          return null;
         }
-        return file
-      })
+      }
+      return null;
+    };
+    const uploadItem = getUploadItem();
+    if (!uploadItem) {
+      return;
     }
-  } else if (info.file.status === 'error') {
-    createMessage.error(`${info.file.name} 上传失败.`)
+    const actions = uploadItem.getElementsByClassName('ant-upload-list-item-actions');
+    if (!actions || actions.length === 0) {
+      return;
+    }
+    // 添加操作按钮
+    const div = document.createElement('div');
+    div.className = 'upload-actions-container';
+    createApp(UploadItemActions, {
+      element: uploadItem,
+      fileList: fileList,
+      mover: props.mover,
+      download: props.download,
+      emitValue: emitValue,
+    }).mount(div);
+    actions[0].appendChild(div);
+    uploadItem.setAttribute('data-has-actions', 'true');
+    uploadItem.removeEventListener('mouseover', onAddActionsButton);
   }
-  fileList.value = fileListTemp
-  if (info.file.status === 'done' || info.file.status === 'removed') {
-    //returnUrl为true时仅返回文件路径
-    if (props.returnUrl) {
-      handlePathChange()
-    } else {
-      //returnUrl为false时返回文件名称、文件路径及文件大小
-      let newFileList: any[] = []
-      for (const item of fileListTemp) {
-        if (item.status === 'done') {
-          let fileJson = {
-            fileName: item.name,
-            filePath: item.response.message,
-            fileSize: item.size,
+
+  // 解析数据库存储的逗号分割
+  function parsePathsValue(paths) {
+    if (!paths || paths.length == 0) {
+      fileList.value = [];
+      return;
+    }
+    let list: any[] = [];
+    for (const item of paths.split(',')) {
+      let url = getFileAccessHttpUrl(item);
+      list.push({
+        uid: uidGenerator(),
+        name: getFileName(item),
+        status: 'done',
+        url: url,
+        response: { status: 'history', message: item },
+      });
+    }
+    fileList.value = list;
+  }
+
+  // 解析数组值
+  function parseArrayValue(array) {
+    if (!array || array.length == 0) {
+      fileList.value = [];
+      return;
+    }
+    let list: any[] = [];
+    for (const item of array) {
+      let url = getFileAccessHttpUrl(item.filePath);
+      list.push({
+        uid: uidGenerator(),
+        name: item.fileName,
+        url: url,
+        status: 'done',
+        response: { status: 'history', message: item.filePath },
+      });
+    }
+    fileList.value = list;
+  }
+
+  // 文件上传之前的操作
+  function onBeforeUpload(file) {
+    uploadGoOn.value = true;
+    if (isImageMode.value) {
+      if (file.type.indexOf('image') < 0) {
+        createMessage.warning('请上传图片');
+        uploadGoOn.value = false;
+        return false;
+      }
+    }
+    // 扩展 beforeUpload 验证
+    if (typeof props.beforeUpload === 'function') {
+      return props.beforeUpload(file);
+    }
+    return true;
+  }
+
+  // 删除处理事件
+  function onRemove() {
+    if (props.removeConfirm) {
+      return new Promise((resolve) => {
+        createConfirm({
+          title: '删除',
+          content: `确定要删除这${isImageMode.value ? '张图片' : '个文件'}吗？`,
+          iconType: 'warning',
+          onOk: () => resolve(true),
+          onCancel: () => resolve(false),
+        });
+      });
+    }
+    return true;
+  }
+
+  // upload组件change事件
+  function onFileChange(info) {
+    if (!info.file.status && uploadGoOn.value === false) {
+      info.fileList.pop();
+    }
+    let fileListTemp = info.fileList;
+    // 限制最大上传数
+    if (props.maxCount > 0) {
+      let count = fileListTemp.length;
+      if (count >= props.maxCount) {
+        let diffNum = props.maxCount - fileListTemp.length;
+        if (diffNum >= 0) {
+          fileListTemp = fileListTemp.slice(-props.maxCount);
+        } else {
+          return;
+        }
+      }
+    }
+    if (info.file.status === 'done') {
+      if (info.file.response.success) {
+        fileListTemp = fileListTemp.map((file) => {
+          if (file.response) {
+            let reUrl = file.response.message;
+            file.url = getFileAccessHttpUrl(reUrl);
           }
-          newFileList.push(fileJson)
-        }
+          return file;
+        });
+      }
+    } else if (info.file.status === 'error') {
+      createMessage.error(`${info.file.name} 上传失败.`);
+    }
+    fileList.value = fileListTemp;
+    if (info.file.status === 'done' || info.file.status === 'removed') {
+      //returnUrl为true时仅返回文件路径
+      if (props.returnUrl) {
+        handlePathChange();
+      } else {
+        //returnUrl为false时返回文件名称、文件路径及文件大小
+        let newFileList: any[] = [];
+        for (const item of fileListTemp) {
+          if (item.status === 'done') {
+            let fileJson = {
+              fileName: item.name,
+              filePath: item.response.message,
+              fileSize: item.size,
+            };
+            newFileList.push(fileJson);
+          }
+        }
+        emitValue(newFileList);
       }
-      emitValue(newFileList)
     }
   }
-}
 
-function handlePathChange() {
-  let uploadFiles = fileList.value
-  let path = ''
-  if (!uploadFiles || uploadFiles.length == 0) {
-    path = ''
+  function handlePathChange() {
+    let uploadFiles = fileList.value;
+    let path = '';
+    if (!uploadFiles || uploadFiles.length == 0) {
+      path = '';
+    }
+    let pathList: string[] = [];
+    for (const item of uploadFiles) {
+      if (item.status === 'done') {
+        pathList.push(item.response.message);
+      } else {
+        return;
+      }
+    }
+    if (pathList.length > 0) {
+      path = pathList.join(',');
+    }
+    emitValue(path);
   }
-  let pathList: string[] = []
-  for (const item of uploadFiles) {
-    if (item.status === 'done') {
-      pathList.push(item.response.message)
+
+  // 预览文件、图片
+  function onFilePreview(file) {
+    if (isImageMode.value) {
+      createImgPreview({ imageList: [file.url], maskClosable: true });
     } else {
-      return
+      window.open(file.url);
     }
   }
-  if (pathList.length > 0) {
-    path = pathList.join(',')
+
+  function emitValue(value) {
+    emit('change', value);
+    emit('update:value', value);
   }
-  emitValue(path)
-}
 
-// 预览文件、图片
-function onFilePreview(file) {
-  if (isImageMode.value) {
-    createImgPreview({ imageList: [file.url], maskClosable: true })
-  } else {
-    window.open(file.url)
+  function uidGenerator() {
+    return '-' + parseInt(Math.random() * 10000 + 1, 10);
   }
-}
 
-function emitValue(value) {
-  emit('change', value)
-  emit('update:value', value)
-}
-
-function uidGenerator() {
-  return '-' + parseInt(Math.random() * 10000 + 1, 10)
-}
-
-function getFileName(path) {
-  if (path.lastIndexOf('\\') >= 0) {
-    let reg = new RegExp('\\\\', 'g')
-    path = path.replace(reg, '/')
+  function getFileName(path) {
+    if (path.lastIndexOf('\\') >= 0) {
+      let reg = new RegExp('\\\\', 'g');
+      path = path.replace(reg, '/');
+    }
+    return path.substring(path.lastIndexOf('/') + 1);
   }
-  return path.substring(path.lastIndexOf('/') + 1)
-}
 
-defineExpose({
-  addActionsListener,
-})
+  defineExpose({
+    addActionsListener,
+  });
 </script>
 
 <style lang="less">
-//noinspection LessUnresolvedVariable
-@prefix-cls: ~'@{namespace}-j-upload';
+  //noinspection LessUnresolvedVariable
+  @prefix-cls: ~'@{namespace}-j-upload';
 
-.@{prefix-cls} {
-  &-container {
-    position: relative;
+  .@{prefix-cls} {
+    &-container {
+      position: relative;
 
-    .upload-disabled {
-      .ant-upload-list-item {
-        .anticon-close {
-          display: none;
-        }
+      .upload-disabled {
+        .ant-upload-list-item {
+          .anticon-close {
+            display: none;
+          }
 
-        .anticon-delete {
-          display: none;
+          .anticon-delete {
+            display: none;
+          }
         }
       }
-    }
 
-    .ant-upload-list-item {
-      .upload-actions-container {
-        position: absolute;
-        top: -31px;
-        left: -18px;
-        z-index: 11;
-        width: 84px;
-        height: 84px;
-        line-height: 28px;
-        text-align: center;
-        pointer-events: none;
-
-        a {
-          opacity: 0.9;
-          margin: 0 5px;
-          cursor: pointer;
-          transition: opacity 0.3s;
-
-          .anticon {
-            color: #fff;
-            font-size: 16px;
-          }
-
-          &:hover {
-            opacity: 1;
-          }
-        }
-
-        .upload-mover-handler,
-        .upload-download-handler {
+      .ant-upload-list-item {
+        .upload-actions-container {
           position: absolute;
-          pointer-events: auto;
-        }
+          top: -31px;
+          left: -18px;
+          z-index: 11;
+          width: 84px;
+          height: 84px;
+          line-height: 28px;
+          text-align: center;
+          pointer-events: none;
 
-        .upload-mover-handler {
-          width: 100%;
-          bottom: 0;
-        }
+          a {
+            opacity: 0.9;
+            margin: 0 5px;
+            cursor: pointer;
+            transition: opacity 0.3s;
 
-        .upload-download-handler {
-          top: -4px;
-          right: -4px;
+            .anticon {
+              color: #fff;
+              font-size: 16px;
+            }
+
+            &:hover {
+              opacity: 1;
+            }
+          }
+
+          .upload-mover-handler,
+          .upload-download-handler {
+            position: absolute;
+            pointer-events: auto;
+          }
+
+          .upload-mover-handler {
+            width: 100%;
+            bottom: 0;
+          }
+
+          .upload-download-handler {
+            top: -4px;
+            right: -4px;
+          }
         }
       }
     }
   }
-}
 </style>
diff --git a/src/components/Form/src/jeecg/components/JUpload/JUploadModal.vue b/src/components/Form/src/jeecg/components/JUpload/JUploadModal.vue
index 9f7cad0..083e1ec 100644
--- a/src/components/Form/src/jeecg/components/JUpload/JUploadModal.vue
+++ b/src/components/Form/src/jeecg/components/JUpload/JUploadModal.vue
@@ -1,51 +1,45 @@
 <template>
-  <BasicModal
-      @register="registerModal"
-      :title="modalTitle"
-      :width="width"
-      @ok="handleOk"
-      v-bind="$attrs">
-    <JUpload ref="uploadRef" :value="value" v-bind="uploadBinds.props" @change="emitValue"/>
+  <BasicModal @register="registerModal" :title="modalTitle" :width="width" @ok="handleOk" v-bind="$attrs">
+    <JUpload ref="uploadRef" :value="value" v-bind="uploadBinds.props" @change="emitValue" />
   </BasicModal>
 </template>
 
 <script lang="ts" setup>
-import { ref, unref, reactive, computed, nextTick } from 'vue'
-import { BasicModal, useModalInner } from '/@/components/Modal'
-import { useMessage } from '/@/hooks/web/useMessage'
-import JUpload from './JUpload.vue'
-import { UploadTypeEnum } from './upload.data'
-import { propTypes } from '/@/utils/propTypes'
+  import { ref, unref, reactive, computed, nextTick } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import JUpload from './JUpload.vue';
+  import { UploadTypeEnum } from './upload.data';
+  import { propTypes } from '/@/utils/propTypes';
 
-const { createMessage } = useMessage()
-const emit = defineEmits(['change', 'update:value', 'register'])
-const props = defineProps({
-  value: propTypes.oneOfType([propTypes.string, propTypes.array]),
-  width: propTypes.number.def(520),
-})
+  const { createMessage } = useMessage();
+  const emit = defineEmits(['change', 'update:value', 'register']);
+  const props = defineProps({
+    value: propTypes.oneOfType([propTypes.string, propTypes.array]),
+    width: propTypes.number.def(520),
+  });
 
-const uploadRef = ref()
-const uploadBinds = reactive({ props: {} as any })
-const modalTitle = computed(() => uploadBinds.props?.fileType === UploadTypeEnum.image ? '图片上传' : '文件上传')
+  const uploadRef = ref();
+  const uploadBinds = reactive({ props: {} as any });
+  const modalTitle = computed(() => (uploadBinds.props?.fileType === UploadTypeEnum.image ? '图片上传' : '文件上传'));
 
-// 注册弹窗
-const [registerModal, { closeModal }] = useModalInner(async data => {
-  uploadBinds.props = unref(data) || {}
-  if ([UploadTypeEnum.image, 'img', 'picture'].includes(uploadBinds.props?.fileType)) {
-    uploadBinds.props.fileType = UploadTypeEnum.image
-  } else {
-    uploadBinds.props.fileType = UploadTypeEnum.file
+  // 注册弹窗
+  const [registerModal, { closeModal }] = useModalInner(async (data) => {
+    uploadBinds.props = unref(data) || {};
+    if ([UploadTypeEnum.image, 'img', 'picture'].includes(uploadBinds.props?.fileType)) {
+      uploadBinds.props.fileType = UploadTypeEnum.image;
+    } else {
+      uploadBinds.props.fileType = UploadTypeEnum.file;
+    }
+    nextTick(() => uploadRef.value.addActionsListener());
+  });
+
+  function handleOk() {
+    closeModal();
   }
-  nextTick(() => uploadRef.value.addActionsListener())
-})
-
-function handleOk() {
-  closeModal()
-}
-
-function emitValue(value) {
-  emit('change', value)
-  emit('update:value', value)
-}
 
+  function emitValue(value) {
+    emit('change', value);
+    emit('update:value', value);
+  }
 </script>
diff --git a/src/components/Form/src/jeecg/components/JUpload/components/UploadItemActions.vue b/src/components/Form/src/jeecg/components/JUpload/components/UploadItemActions.vue
index a1ec797..61586ab 100644
--- a/src/components/Form/src/jeecg/components/JUpload/components/UploadItemActions.vue
+++ b/src/components/Form/src/jeecg/components/JUpload/components/UploadItemActions.vue
@@ -1,91 +1,90 @@
 <template>
   <div v-show="download" class="upload-download-handler">
     <a class="download" title="下载" @click="onDownload">
-      <Icon icon="ant-design:download"/>
+      <Icon icon="ant-design:download" />
     </a>
   </div>
   <div v-show="mover && list.length > 1" class="upload-mover-handler">
-    <a title="向前移动" @click=" onMoveForward">
-      <Icon icon="ant-design:arrow-left"/>
+    <a title="向前移动" @click="onMoveForward">
+      <Icon icon="ant-design:arrow-left" />
     </a>
     <a title="向后移动" @click="onMoveBack">
-      <Icon icon="ant-design:arrow-right"/>
+      <Icon icon="ant-design:arrow-right" />
     </a>
   </div>
 </template>
 
 <script lang="ts" setup>
-import { unref, computed } from 'vue'
-import { Icon } from '/@/components/Icon'
-import { useMessage } from '/@/hooks/web/useMessage'
+  import { unref, computed } from 'vue';
+  import { Icon } from '/@/components/Icon';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
-const { createMessage } = useMessage()
+  const { createMessage } = useMessage();
 
-const props = defineProps({
-  element: { type: HTMLElement, required: true },
-  fileList: { type: Object, required: true },
-  mover: { type: Boolean, required: true },
-  download: { type: Boolean, required: true },
-  emitValue: { type: Function, required: true },
-})
-const list = computed(() => unref(props.fileList))
+  const props = defineProps({
+    element: { type: HTMLElement, required: true },
+    fileList: { type: Object, required: true },
+    mover: { type: Boolean, required: true },
+    download: { type: Boolean, required: true },
+    emitValue: { type: Function, required: true },
+  });
+  const list = computed(() => unref(props.fileList));
 
-// 向前移动图片
-function onMoveForward() {
-  let index = getIndexByUrl()
-  if (index === -1) {
-    createMessage.warn('移动失败：' + index)
-    return
+  // 向前移动图片
+  function onMoveForward() {
+    let index = getIndexByUrl();
+    if (index === -1) {
+      createMessage.warn('移动失败：' + index);
+      return;
+    }
+    if (index === 0) {
+      doSwap(index, unref(list).length - 1);
+      return;
+    }
+    doSwap(index, index - 1);
   }
-  if (index === 0) {
-    doSwap(index, unref(list).length - 1)
-    return
-  }
-  doSwap(index, index - 1)
-}
 
-// 向后移动图片
-function onMoveBack() {
-  let index = getIndexByUrl()
-  if (index === -1) {
-    createMessage.warn('移动失败：' + index)
-    return
+  // 向后移动图片
+  function onMoveBack() {
+    let index = getIndexByUrl();
+    if (index === -1) {
+      createMessage.warn('移动失败：' + index);
+      return;
+    }
+    if (index == unref(list).length - 1) {
+      doSwap(index, 0);
+      return;
+    }
+    doSwap(index, index + 1);
   }
-  if (index == unref(list).length - 1) {
-    doSwap(index, 0)
-    return
-  }
-  doSwap(index, index + 1)
-}
 
-function doSwap(oldIndex, newIndex) {
-  if (oldIndex !== newIndex) {
-    let array: any[] = [...unref(list) as Array<any>]
-    let temp = array[oldIndex]
-    array[oldIndex] = array[newIndex]
-    array[newIndex] = temp
-    props.emitValue(array.map(i => i.url).join(','))
-  }
-}
-
-function getIndexByUrl() {
-  const url = props.element?.getElementsByTagName('img')[0]?.src
-  if (url) {
-    const fileList: any = unref(list)
-    for (let i = 0; i < fileList.length; i++) {
-      let current = fileList[i].url
-      const replace = url.replace(window.location.origin, '')
-      if (current === replace || encodeURI(current) === replace) {
-        return i
-      }
+  function doSwap(oldIndex, newIndex) {
+    if (oldIndex !== newIndex) {
+      let array: any[] = [...(unref(list) as Array<any>)];
+      let temp = array[oldIndex];
+      array[oldIndex] = array[newIndex];
+      array[newIndex] = temp;
+      props.emitValue(array.map((i) => i.url).join(','));
     }
   }
-  return -1
-}
 
-function onDownload() {
-  const url = props.element?.getElementsByTagName('img')[0]?.src
-  window.open(url)
-}
+  function getIndexByUrl() {
+    const url = props.element?.getElementsByTagName('img')[0]?.src;
+    if (url) {
+      const fileList: any = unref(list);
+      for (let i = 0; i < fileList.length; i++) {
+        let current = fileList[i].url;
+        const replace = url.replace(window.location.origin, '');
+        if (current === replace || encodeURI(current) === replace) {
+          return i;
+        }
+      }
+    }
+    return -1;
+  }
 
-</script>
\ No newline at end of file
+  function onDownload() {
+    const url = props.element?.getElementsByTagName('img')[0]?.src;
+    window.open(url);
+  }
+</script>
diff --git a/src/components/Form/src/jeecg/components/JUpload/index.ts b/src/components/Form/src/jeecg/components/JUpload/index.ts
index 6408cbe..740bf2d 100644
--- a/src/components/Form/src/jeecg/components/JUpload/index.ts
+++ b/src/components/Form/src/jeecg/components/JUpload/index.ts
@@ -1,3 +1,3 @@
-export { UploadTypeEnum } from './upload.data'
-export { default as JUpload } from './JUpload.vue'
-export { default as JUploadModal } from './JUploadModal.vue'
+export { UploadTypeEnum } from './upload.data';
+export { default as JUpload } from './JUpload.vue';
+export { default as JUploadModal } from './JUploadModal.vue';
diff --git a/src/components/Form/src/jeecg/components/JUpload/upload.data.ts b/src/components/Form/src/jeecg/components/JUpload/upload.data.ts
index 3159988..820146d 100644
--- a/src/components/Form/src/jeecg/components/JUpload/upload.data.ts
+++ b/src/components/Form/src/jeecg/components/JUpload/upload.data.ts
@@ -2,4 +2,4 @@ export enum UploadTypeEnum {
   all = 'all',
   image = 'image',
   file = 'file',
-}
\ No newline at end of file
+}
diff --git a/src/components/Form/src/jeecg/components/base/JSelectBiz.vue b/src/components/Form/src/jeecg/components/base/JSelectBiz.vue
index a598385..fba8c66 100644
--- a/src/components/Form/src/jeecg/components/base/JSelectBiz.vue
+++ b/src/components/Form/src/jeecg/components/base/JSelectBiz.vue
@@ -1,105 +1,115 @@
 <template>
-    <div>
-        <a-row class="j-select-row" type="flex" :gutter="8">
-            <a-col class="left" :class="{'full': !showButton}">
-              <!-- 显示加载效果 -->
-              <a-input v-if="loading" readOnly placeholder="加载中…">
-                <template #prefix>
-                  <LoadingOutlined/>
-                </template>
-              </a-input>
-              <a-select v-else ref="select" v-model:value="selectValues.value" :placeholder="placeholder" :mode="multiple" :open="false" :disabled="disabled" :options="options" @change="handleChange" style="width: 100%;" @click="!disabled && openModal(false)"></a-select>
-            </a-col>
-            <a-col v-if="showButton" class="right">
-                <a-button type="primary" @click="openModal(true)" :disabled="disabled">选择</a-button>
-            </a-col>
-        </a-row>
-    </div>
+  <div>
+    <a-row class="j-select-row" type="flex" :gutter="8">
+      <a-col class="left" :class="{ full: !showButton }">
+        <!-- 显示加载效果 -->
+        <a-input v-if="loading" readOnly placeholder="加载中…">
+          <template #prefix>
+            <LoadingOutlined />
+          </template>
+        </a-input>
+        <a-select
+          v-else
+          ref="select"
+          v-model:value="selectValues.value"
+          :placeholder="placeholder"
+          :mode="multiple"
+          :open="false"
+          :disabled="disabled"
+          :options="options"
+          @change="handleChange"
+          style="width: 100%"
+          @click="!disabled && openModal(false)"
+        ></a-select>
+      </a-col>
+      <a-col v-if="showButton" class="right">
+        <a-button type="primary" @click="openModal(true)" :disabled="disabled">选择</a-button>
+      </a-col>
+    </a-row>
+  </div>
 </template>
 <script lang="ts">
-    import {defineComponent, ref, inject, reactive} from 'vue';
-    import {propTypes} from "/@/utils/propTypes";
-    import {useAttrs} from "/@/hooks/core/useAttrs";
-    import {LoadingOutlined} from '@ant-design/icons-vue'
+  import { defineComponent, ref, inject, reactive } from 'vue';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { LoadingOutlined } from '@ant-design/icons-vue';
 
-    export default defineComponent({
-        name: 'JSelectBiz',
-        components: {LoadingOutlined},
-        inheritAttrs: false,
-        props: {
-            showButton: propTypes.bool.def(true),
-            disabled: propTypes.bool.def(false),
-            placeholder:{
-              type: String,
-              default: '请选择',
-            },
-            // 是否支持多选，默认 true
-            multiple: {
-                type: String,
-                default: 'multiple',
-            },
-            // 是否正在加载
-            loading: propTypes.bool.def(false),
-        },
-        emits: ['handleOpen','change'],
-        setup(props, {emit, refs}) {
-            //接收下拉框选项
-            const options = inject('selectOptions') || ref([]);
-            //接收选择的值
-            const selectValues = inject('selectValues') || ref({});
-            const attrs = useAttrs();
+  export default defineComponent({
+    name: 'JSelectBiz',
+    components: { LoadingOutlined },
+    inheritAttrs: false,
+    props: {
+      showButton: propTypes.bool.def(true),
+      disabled: propTypes.bool.def(false),
+      placeholder: {
+        type: String,
+        default: '请选择',
+      },
+      // 是否支持多选，默认 true
+      multiple: {
+        type: String,
+        default: 'multiple',
+      },
+      // 是否正在加载
+      loading: propTypes.bool.def(false),
+    },
+    emits: ['handleOpen', 'change'],
+    setup(props, { emit, refs }) {
+      //接收下拉框选项
+      const options = inject('selectOptions') || ref([]);
+      //接收选择的值
+      const selectValues = inject('selectValues') || ref({});
+      const attrs = useAttrs();
 
-            /**
-             * 打开弹出框
-             */
-            function openModal(isButton) {
-               if(props.showButton&&isButton){
-                 emit('handleOpen')
-               }
-              if(!props.showButton&&!isButton){
-                emit('handleOpen')
-              }
-            }
+      /**
+       * 打开弹出框
+       */
+      function openModal(isButton) {
+        if (props.showButton && isButton) {
+          emit('handleOpen');
+        }
+        if (!props.showButton && !isButton) {
+          emit('handleOpen');
+        }
+      }
 
+      /**
+       * 下拉框值改变事件
+       */
+      function handleChange(value) {
+        selectValues.value = value;
+        selectValues.change = true;
+        emit('change', value);
+      }
 
-
-          /**
-             * 下拉框值改变事件
-             */
-            function handleChange(value) {
-                selectValues.value = value;
-                selectValues.change = true;
-                emit('change',value)
-            }
-
-            return {
-                attrs,
-                selectValues,
-                options,
-                handleChange,
-                openModal
-            };
-        },
-    });
+      return {
+        attrs,
+        selectValues,
+        options,
+        handleChange,
+        openModal,
+      };
+    },
+  });
 </script>
 <style lang="less" scoped>
-    .j-select-row {
-        @width: 82px;
+  .j-select-row {
+    @width: 82px;
 
-        .left {
-            width: calc(100% - @width - 8px);
-        }
-
-        .right {
-            width: @width;
-        }
-
-        .full {
-            width: 100%;
-        }
-
-        ::v-deep(.ant-select-search__field) {
-            display: none !important;
-        }
+    .left {
+      width: calc(100% - @width - 8px);
     }
+
+    .right {
+      width: @width;
+    }
+
+    .full {
+      width: 100%;
+    }
+
+    ::v-deep(.ant-select-search__field) {
+      display: none !important;
+    }
+  }
 </style>
diff --git a/src/components/Form/src/jeecg/components/base/JTreeBiz.vue b/src/components/Form/src/jeecg/components/base/JTreeBiz.vue
index 12284ea..c1119c3 100644
--- a/src/components/Form/src/jeecg/components/base/JTreeBiz.vue
+++ b/src/components/Form/src/jeecg/components/base/JTreeBiz.vue
@@ -2,7 +2,7 @@
   <div>
     <a-row class="j-select-row" type="flex" :gutter="8">
       <a-col class="left" :class="{ full: !showButton }">
-        <a-select ref="select" v-model:value="selectValues.value" :mode="multiple" :open="false" :options="options" @change="handleChange" style="width: 100%"/>
+        <a-select ref="select" v-model:value="selectValues.value" :mode="multiple" :open="false" :options="options" @change="handleChange" style="width: 100%" />
       </a-col>
       <a-col v-if="showButton" class="right">
         <a-button type="primary" @click="openModal">选择</a-button>
diff --git a/src/components/Form/src/jeecg/components/modal/DeptSelectModal.vue b/src/components/Form/src/jeecg/components/modal/DeptSelectModal.vue
index f1778f5..506c559 100644
--- a/src/components/Form/src/jeecg/components/modal/DeptSelectModal.vue
+++ b/src/components/Form/src/jeecg/components/modal/DeptSelectModal.vue
@@ -1,31 +1,39 @@
 <!--部门选择框-->
 <template>
-    <div>
-        <BasicModal v-bind="$attrs" @register="register" title="部门选择" width="500px"  @ok="handleOk" destroyOnClose @visible-change="visibleChange">
-            <BasicTree ref="treeRef" :treeData="treeData" :load-data="sync==false?null:onLoadData" v-bind="getBindValue" @select="onSelect" @check="onCheck" :replaceFields="replaceFields" :checkedKeys="checkedKeys" :checkStrictly="getCheckStrictly"/>
-            <!--树操作部分-->
-            <template #insertFooter>
-                <a-dropdown placement="topCenter">
-                    <template #overlay>
-                        <a-menu>
-                            <a-menu-item v-if="multiple" key="1" @click="checkALL(true)">全部勾选</a-menu-item>
-                            <a-menu-item v-if="multiple" key="2" @click="checkALL(false)">取消全选</a-menu-item>
-                            <a-menu-item key="3" @click="expandAll(true)">展开全部</a-menu-item>
-                            <a-menu-item key="4" @click="expandAll(false)">折叠全部</a-menu-item>
-                        </a-menu>
-                    </template>
-                    <a-button style="float: left;">
-                        树操作 <Icon icon="ant-design:up-outlined" />
-                    </a-button>
-                </a-dropdown>
-            </template>
-        </BasicModal>
-    </div>
+  <div>
+    <BasicModal v-bind="$attrs" @register="register" title="部门选择" width="500px" @ok="handleOk" destroyOnClose @visible-change="visibleChange">
+      <BasicTree
+        ref="treeRef"
+        :treeData="treeData"
+        :load-data="sync == false ? null : onLoadData"
+        v-bind="getBindValue"
+        @select="onSelect"
+        @check="onCheck"
+        :replaceFields="replaceFields"
+        :checkedKeys="checkedKeys"
+        :checkStrictly="getCheckStrictly"
+      />
+      <!--树操作部分-->
+      <template #insertFooter>
+        <a-dropdown placement="topCenter">
+          <template #overlay>
+            <a-menu>
+              <a-menu-item v-if="multiple" key="1" @click="checkALL(true)">全部勾选</a-menu-item>
+              <a-menu-item v-if="multiple" key="2" @click="checkALL(false)">取消全选</a-menu-item>
+              <a-menu-item key="3" @click="expandAll(true)">展开全部</a-menu-item>
+              <a-menu-item key="4" @click="expandAll(false)">折叠全部</a-menu-item>
+            </a-menu>
+          </template>
+          <a-button style="float: left"> 树操作 <Icon icon="ant-design:up-outlined" /> </a-button>
+        </a-dropdown>
+      </template>
+    </BasicModal>
+  </div>
 </template>
 <script lang="ts">
   import { defineComponent, ref, unref } from 'vue';
   import { BasicModal, useModalInner } from '/@/components/Modal';
-  import { queryDepartTreeSync,queryTreeList } from '/@/api/common/api';
+  import { queryDepartTreeSync, queryTreeList } from '/@/api/common/api';
   import { useAttrs } from '/@/hooks/core/useAttrs';
   import { treeProps } from '/@/components/Form/src/jeecg/props/props';
   import { BasicTree, TreeActionType } from '/@/components/Tree';
@@ -35,7 +43,7 @@
     name: 'DeptSelectModal',
     components: {
       BasicModal,
-      BasicTree
+      BasicTree,
     },
     props: {
       ...treeProps,
@@ -47,13 +55,13 @@
       const attrs = useAttrs();
       const treeRef = ref<Nullable<TreeActionType>>(null);
       const getBindValue = Object.assign({}, unref(props), unref(attrs));
-      const queryUrl=props.sync?queryDepartTreeSync:queryTreeList;
-      const [{ visibleChange,checkedKeys, getCheckStrictly, getSelectTreeData,onCheck,onLoadData,treeData,checkALL,expandAll,onSelect }] = useTreeBiz(treeRef,queryUrl, getBindValue);
+      const queryUrl = props.sync ? queryDepartTreeSync : queryTreeList;
+      const [{ visibleChange, checkedKeys, getCheckStrictly, getSelectTreeData, onCheck, onLoadData, treeData, checkALL, expandAll, onSelect }] = useTreeBiz(treeRef, queryUrl, getBindValue);
       const searchInfo = ref(props.params);
       const tree = ref([]);
       //替换treeNode中key字段为treeData中对应的字段
       const replaceFields = {
-        key: props.rowKey
+        key: props.rowKey,
       };
       /**
        * 确定选择
diff --git a/src/components/Form/src/jeecg/components/modal/JPopupOnlReportModal.vue b/src/components/Form/src/jeecg/components/modal/JPopupOnlReportModal.vue
index ecb1f90..aa89625 100644
--- a/src/components/Form/src/jeecg/components/modal/JPopupOnlReportModal.vue
+++ b/src/components/Form/src/jeecg/components/modal/JPopupOnlReportModal.vue
@@ -1,232 +1,242 @@
 <template>
-    <!--popup选择框-->
-    <div>
-        <BasicModal v-bind="$attrs" @register="register" :title="title" :width="1200" @ok="handleSubmit" @cancel="handleCancel" cancelText="关闭" wrapClassName="j-popup-modal" @visible-change="visibleChange">
-            <div class="jeecg-basic-table-form-container" v-if="showSearchFlag">
-                <a-form ref="formRef" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol" @keyup.enter.native="searchQuery">
-                    <a-row :gutter="24">
-                        <template v-for="(item,index) in queryInfo">
-                            <template v-if=" item.hidden==='1' ">
-                                <a-col :md="8" :sm="24" :key=" 'query'+index " v-show="toggleSearchStatus">
-                                    <SearchFormItem :formElRef="formRef" :queryParam="queryParam" :item="item" :dictOptions="dictOptions"></SearchFormItem>
-                                </a-col>
-                            </template>
-                            <template v-else>
-                                <a-col :md="8" :sm="24" :key=" 'query'+index ">
-                                    <SearchFormItem :formElRef="formRef" :queryParam="queryParam" :item="item" :dictOptions="dictOptions"></SearchFormItem>
-                                </a-col>
-                            </template>
-                        </template>
+  <!--popup选择框-->
+  <div>
+    <BasicModal
+      v-bind="$attrs"
+      @register="register"
+      :title="title"
+      :width="1200"
+      @ok="handleSubmit"
+      @cancel="handleCancel"
+      cancelText="关闭"
+      wrapClassName="j-popup-modal"
+      @visible-change="visibleChange"
+    >
+      <div class="jeecg-basic-table-form-container" v-if="showSearchFlag">
+        <a-form ref="formRef" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol" @keyup.enter.native="searchQuery">
+          <a-row :gutter="24">
+            <template v-for="(item, index) in queryInfo">
+              <template v-if="item.hidden === '1'">
+                <a-col :md="8" :sm="24" :key="'query' + index" v-show="toggleSearchStatus">
+                  <SearchFormItem :formElRef="formRef" :queryParam="queryParam" :item="item" :dictOptions="dictOptions"></SearchFormItem>
+                </a-col>
+              </template>
+              <template v-else>
+                <a-col :md="8" :sm="24" :key="'query' + index">
+                  <SearchFormItem :formElRef="formRef" :queryParam="queryParam" :item="item" :dictOptions="dictOptions"></SearchFormItem>
+                </a-col>
+              </template>
+            </template>
 
-                        <a-col :md="8" :sm="8">
-                           <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
-                                <a-col :lg="6">
-                                  <a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset">重置</a-button>
-                                  <a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery" style="margin-left: 8px">查询</a-button>
-                                  <a @click="handleToggleSearch" style="margin-left: 8px">
-                                    {{ toggleSearchStatus ? '收起' : '展开' }}
-                                    <Icon :icon="toggleSearchStatus ? 'ant-design:up-outlined' : 'ant-design:down-outlined'"/>
-                                  </a>
-                                </a-col>
-                           </span>
-                        </a-col>
+            <a-col :md="8" :sm="8">
+              <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
+                <a-col :lg="6">
+                  <a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset">重置</a-button>
+                  <a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery" style="margin-left: 8px">查询</a-button>
+                  <a @click="handleToggleSearch" style="margin-left: 8px">
+                    {{ toggleSearchStatus ? '收起' : '展开' }}
+                    <Icon :icon="toggleSearchStatus ? 'ant-design:up-outlined' : 'ant-design:down-outlined'" />
+                  </a>
+                </a-col>
+              </span>
+            </a-col>
+          </a-row>
+        </a-form>
+      </div>
 
-                    </a-row>
-                </a-form>
-            </div>
-
-            <BasicTable
-                    ref="tableRef"
-                    :canResize="false"
-                    :bordered="true"
-                    :loading="loading"
-                    :rowKey="combineRowKey"
-                    :columns="columns"
-                    :showIndexColumn="false"
-                    :dataSource="dataSource"
-                    :pagination="pagination"
-                    :rowSelection="rowSelection"
-                    @row-click="clickThenCheck"
-                    @change="handleChangeInTable"
-            >
-                <template #tableTitle></template>
-            </BasicTable>
-
-        </BasicModal>
-    </div>
+      <BasicTable
+        ref="tableRef"
+        :canResize="false"
+        :bordered="true"
+        :loading="loading"
+        :rowKey="combineRowKey"
+        :columns="columns"
+        :showIndexColumn="false"
+        :dataSource="dataSource"
+        :pagination="pagination"
+        :rowSelection="rowSelection"
+        @row-click="clickThenCheck"
+        @change="handleChangeInTable"
+      >
+        <template #tableTitle></template>
+      </BasicTable>
+    </BasicModal>
+  </div>
 </template>
 
 <script lang="ts">
-    import {defineComponent, unref, ref, watch,watchEffect, reactive,computed} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {createAsyncComponent} from '/@/utils/factory/createAsyncComponent';
-    import {useAttrs} from '/@/hooks/core/useAttrs';
-    import {usePopBiz} from '/@/components/jeecg/OnLine/hooks/usePopBiz';
-    import {useMessage} from '/@/hooks/web/useMessage';
+  import { defineComponent, unref, ref, watch, watchEffect, reactive, computed } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { usePopBiz } from '/@/components/jeecg/OnLine/hooks/usePopBiz';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
-    export default defineComponent({
-        name: 'JPopupOnlReportModal',
-        components: {
-            //此处需要异步加载BasicTable
-            BasicModal,
-            SearchFormItem: createAsyncComponent(() => import('/@/components/jeecg/OnLine/SearchFormItem.vue'), {loading: false}),
-            BasicTable: createAsyncComponent(() => import('/@/components/Table/src/BasicTable.vue'), {loading: true}),
-        },
-        props: ['multi', 'code', 'sorter', 'groupId', 'param'],
-        emits: ['ok','register'],
-        setup(props, {emit, refs}) {
-            const {createMessage} = useMessage();
-            const labelCol = reactive({
-                xs: {span: 24},
-                sm: {span: 6},
-            })
-            const wrapperCol = reactive({
-                xs: {span: 24},
-                sm: {span: 18},
-            })
-            //注册弹框
-            const [register, {closeModal}] = useModalInner();
-            const formRef = ref();
-            const tableRef = ref();
-            const toggleSearchStatus = ref(false);
-            const attrs = useAttrs();
-            const tableScroll = ref({x: true});
-            const getBindValue = Object.assign({}, unref(props), unref(attrs));
-            const [{visibleChange, loadColumnsInfo,dynamicParamHandler,loadData,handleChangeInTable,combineRowKey,clickThenCheck,filterUnuseSelect},
-                {visible, rowSelection, checkedKeys, selectRows, pagination, dataSource, columns, loading,title,iSorter,queryInfo,queryParam,dictOptions}] = usePopBiz(getBindValue);
+  export default defineComponent({
+    name: 'JPopupOnlReportModal',
+    components: {
+      //此处需要异步加载BasicTable
+      BasicModal,
+      SearchFormItem: createAsyncComponent(() => import('/@/components/jeecg/OnLine/SearchFormItem.vue'), { loading: false }),
+      BasicTable: createAsyncComponent(() => import('/@/components/Table/src/BasicTable.vue'), { loading: true }),
+    },
+    props: ['multi', 'code', 'sorter', 'groupId', 'param'],
+    emits: ['ok', 'register'],
+    setup(props, { emit, refs }) {
+      const { createMessage } = useMessage();
+      const labelCol = reactive({
+        xs: { span: 24 },
+        sm: { span: 6 },
+      });
+      const wrapperCol = reactive({
+        xs: { span: 24 },
+        sm: { span: 18 },
+      });
+      //注册弹框
+      const [register, { closeModal }] = useModalInner();
+      const formRef = ref();
+      const tableRef = ref();
+      const toggleSearchStatus = ref(false);
+      const attrs = useAttrs();
+      const tableScroll = ref({ x: true });
+      const getBindValue = Object.assign({}, unref(props), unref(attrs));
+      const [
+        { visibleChange, loadColumnsInfo, dynamicParamHandler, loadData, handleChangeInTable, combineRowKey, clickThenCheck, filterUnuseSelect },
+        { visible, rowSelection, checkedKeys, selectRows, pagination, dataSource, columns, loading, title, iSorter, queryInfo, queryParam, dictOptions },
+      ] = usePopBiz(getBindValue);
 
-            const showSearchFlag= computed(()=> unref(queryInfo) && unref(queryInfo).length>0)
-            /**
-             *监听code
-             */
-            watch(
-                () => props.code,
-                () => {
-                    loadColumnsInfo();
-                }
-            );
-            /**
-             *监听popup动态参数 支持系统变量语法
-             */
-            watch(
-                () => props.param,
-                () => {
-                    if(visible){
-                        dynamicParamHandler();
-                        loadData();
-                    }
-                }
-            );
-            /**
-             *监听sorter排序字段
-             */
-            watchEffect(() => {
-                if(props.sorter){
-                    let arr = props.sorter.split('=');
-                    if (arr.length === 2 && ['asc', 'desc'].includes(arr[1].toLowerCase())) {
-                        iSorter.value = {column: arr[0], order: arr[1].toLowerCase()}
-                        // 排序字段受控
-                        unref(columns).forEach(col => {
-                            if (col.dataIndex === unref(iSorter).column) {
-                                col['sortOrder'] = unref(iSorter).order === 'asc' ? 'ascend' : 'descend';
-                            } else {
-                                col['sortOrder'] = false;
-                            }
-                        })
-                    } else {
-                        console.warn('【JPopup】sorter参数不合法')
-                    }
-                }
+      const showSearchFlag = computed(() => unref(queryInfo) && unref(queryInfo).length > 0);
+      /**
+       *监听code
+       */
+      watch(
+        () => props.code,
+        () => {
+          loadColumnsInfo();
+        }
+      );
+      /**
+       *监听popup动态参数 支持系统变量语法
+       */
+      watch(
+        () => props.param,
+        () => {
+          if (visible) {
+            dynamicParamHandler();
+            loadData();
+          }
+        }
+      );
+      /**
+       *监听sorter排序字段
+       */
+      watchEffect(() => {
+        if (props.sorter) {
+          let arr = props.sorter.split('=');
+          if (arr.length === 2 && ['asc', 'desc'].includes(arr[1].toLowerCase())) {
+            iSorter.value = { column: arr[0], order: arr[1].toLowerCase() };
+            // 排序字段受控
+            unref(columns).forEach((col) => {
+              if (col.dataIndex === unref(iSorter).column) {
+                col['sortOrder'] = unref(iSorter).order === 'asc' ? 'ascend' : 'descend';
+              } else {
+                col['sortOrder'] = false;
+              }
             });
+          } else {
+            console.warn('【JPopup】sorter参数不合法');
+          }
+        }
+      });
 
-            function handleToggleSearch(){
-                toggleSearchStatus.value = !unref(toggleSearchStatus);
-            }
-            /**
-             * 取消/关闭
-             */
-            function handleCancel() {
-                closeModal();
-                checkedKeys.value = []
-                selectRows.value = []
-            }
+      function handleToggleSearch() {
+        toggleSearchStatus.value = !unref(toggleSearchStatus);
+      }
+      /**
+       * 取消/关闭
+       */
+      function handleCancel() {
+        closeModal();
+        checkedKeys.value = [];
+        selectRows.value = [];
+      }
 
-            /**
-             *确认提交
-             */
-            function handleSubmit() {
-                filterUnuseSelect();
-                if(!props.multi && unref(selectRows) && unref(selectRows).length>1){
-                    createMessage.warning("只能选择一条记录");
-                    return false
-                }
-                if(!unref(selectRows) || unref(selectRows).length==0){
-                    createMessage.warning("至少选择一条记录");
-                    return false
-                }
-                emit('ok', unref(selectRows));
-                handleCancel();
-            }
+      /**
+       *确认提交
+       */
+      function handleSubmit() {
+        filterUnuseSelect();
+        if (!props.multi && unref(selectRows) && unref(selectRows).length > 1) {
+          createMessage.warning('只能选择一条记录');
+          return false;
+        }
+        if (!unref(selectRows) || unref(selectRows).length == 0) {
+          createMessage.warning('至少选择一条记录');
+          return false;
+        }
+        emit('ok', unref(selectRows));
+        handleCancel();
+      }
 
-            /**
-             * 查询
-             */
-            function searchQuery(){
-                loadData(1);
-            }
-            /**
-             * 重置
-             */
-            function searchReset(){
-              queryParam.value = {};
-              loadData(1);
-            }
-            return {
-                attrs,
-                register,
-                tableScroll,
-                dataSource,
-                pagination,
-                columns,
-                rowSelection,
-                checkedKeys,
-                loading,
-                title,
-                handleCancel,
-                handleSubmit,
-                clickThenCheck,
-                loadData,
-                combineRowKey,
-                handleChangeInTable,
-                visibleChange,
-                queryInfo,
-                queryParam,
-                tableRef,
-                formRef,
-                labelCol,
-                wrapperCol,
-                dictOptions,
-                showSearchFlag,
-                toggleSearchStatus,
-                handleToggleSearch,
-                searchQuery,
-                searchReset,
-            };
-        },
-    });
+      /**
+       * 查询
+       */
+      function searchQuery() {
+        loadData(1);
+      }
+      /**
+       * 重置
+       */
+      function searchReset() {
+        queryParam.value = {};
+        loadData(1);
+      }
+      return {
+        attrs,
+        register,
+        tableScroll,
+        dataSource,
+        pagination,
+        columns,
+        rowSelection,
+        checkedKeys,
+        loading,
+        title,
+        handleCancel,
+        handleSubmit,
+        clickThenCheck,
+        loadData,
+        combineRowKey,
+        handleChangeInTable,
+        visibleChange,
+        queryInfo,
+        queryParam,
+        tableRef,
+        formRef,
+        labelCol,
+        wrapperCol,
+        dictOptions,
+        showSearchFlag,
+        toggleSearchStatus,
+        handleToggleSearch,
+        searchQuery,
+        searchReset,
+      };
+    },
+  });
 </script>
 
 <style lang="less" scoped>
-    .jeecg-basic-table-form-container {
-        padding: 5px;
+  .jeecg-basic-table-form-container {
+    padding: 5px;
 
-        .table-page-search-submitButtons {
-            display: block;
-            margin-bottom: 0;
-            white-space: nowrap;
-        }
-    }
-    :deep .jeecg-basic-table .ant-table-wrapper .ant-table-title {
-        min-height: 0;
+    .table-page-search-submitButtons {
+      display: block;
+      margin-bottom: 0;
+      white-space: nowrap;
     }
+  }
+  :deep .jeecg-basic-table .ant-table-wrapper .ant-table-title {
+    min-height: 0;
+  }
 </style>
diff --git a/src/components/Form/src/jeecg/components/modal/PositionSelectModal.vue b/src/components/Form/src/jeecg/components/modal/PositionSelectModal.vue
index 8824cd6..9260342 100644
--- a/src/components/Form/src/jeecg/components/modal/PositionSelectModal.vue
+++ b/src/components/Form/src/jeecg/components/modal/PositionSelectModal.vue
@@ -1,22 +1,32 @@
 <!--职务选择框-->
 <template>
-    <div>
-        <BasicModal v-bind="$attrs" @register="register" title="职务选择" width="900px" wrapClassName="j-user-select-modal" @ok="handleOk" destroyOnClose @visible-change="visibleChange">
-            <a-row>
-                <a-col :span="showSelected?18:24">
-                    <BasicTable :columns="columns"  :bordered="true" :useSearchForm="true" :formConfig="formConfig"  :api="getPositionList" :searchInfo="searchInfo" :rowSelection="rowSelection" :indexColumnProps="indexColumnProps" v-bind="getBindValue"></BasicTable>
-                </a-col>
-                <a-col :span="showSelected?6:0">
-                    <BasicTable v-bind="selectedTable"  :dataSource="selectRows" :useSearchForm="true" :formConfig="{showActionButtonGroup:false,baseRowStyle:{minHeight:'40px'}}">
-                        <!--操作栏-->
-                        <template #action="{ record }">
-                            <a href="javascript:void(0)" @click="handleDeleteSelected(record)"><Icon icon="ant-design:delete-outlined"></Icon></a>
-                        </template>
-                    </BasicTable>
-                </a-col>
-            </a-row>
-        </BasicModal>
-    </div>
+  <div>
+    <BasicModal v-bind="$attrs" @register="register" title="职务选择" width="900px" wrapClassName="j-user-select-modal" @ok="handleOk" destroyOnClose @visible-change="visibleChange">
+      <a-row>
+        <a-col :span="showSelected ? 18 : 24">
+          <BasicTable
+            :columns="columns"
+            :bordered="true"
+            :useSearchForm="true"
+            :formConfig="formConfig"
+            :api="getPositionList"
+            :searchInfo="searchInfo"
+            :rowSelection="rowSelection"
+            :indexColumnProps="indexColumnProps"
+            v-bind="getBindValue"
+          ></BasicTable>
+        </a-col>
+        <a-col :span="showSelected ? 6 : 0">
+          <BasicTable v-bind="selectedTable" :dataSource="selectRows" :useSearchForm="true" :formConfig="{ showActionButtonGroup: false, baseRowStyle: { minHeight: '40px' } }">
+            <!--操作栏-->
+            <template #action="{ record }">
+              <a href="javascript:void(0)" @click="handleDeleteSelected(record)"><Icon icon="ant-design:delete-outlined"></Icon></a>
+            </template>
+          </BasicTable>
+        </a-col>
+      </a-row>
+    </BasicModal>
+  </div>
 </template>
 <script lang="ts">
   import { defineComponent, ref, unref } from 'vue';
@@ -31,7 +41,8 @@
     name: 'PositionSelectModal',
     components: {
       //此处需要异步加载BasicTable
-      BasicModal, BasicTable: createAsyncComponent(() => import('/@/components/Table/src/BasicTable.vue'), { loading: true }),
+      BasicModal,
+      BasicTable: createAsyncComponent(() => import('/@/components/Table/src/BasicTable.vue'), { loading: true }),
     },
     props: {
       ...selectProps,
@@ -46,17 +57,17 @@
         canResize: false,
         bordered: true,
         size: 'small',
-        rowKey: 'code'
+        rowKey: 'code',
       };
-      const getBindValue = Object.assign({},unref(props),unref(attrs),config);
-      const [{ rowSelection,visibleChange, indexColumnProps, getSelectResult,handleDeleteSelected,selectRows }] = useSelectBiz(getPositionList,getBindValue);
+      const getBindValue = Object.assign({}, unref(props), unref(attrs), config);
+      const [{ rowSelection, visibleChange, indexColumnProps, getSelectResult, handleDeleteSelected, selectRows }] = useSelectBiz(getPositionList, getBindValue);
       const searchInfo = ref(props.params);
       //查询form
-      const formConfig={
+      const formConfig = {
         labelCol: {
-            span: 8,
+          span: 8,
         },
-        baseColProps:{
+        baseColProps: {
           xs: 24,
           sm: 10,
           md: 10,
@@ -64,15 +75,15 @@
           xl: 10,
           xxl: 10,
         },
-        schemas:[
+        schemas: [
           {
             label: '职务名称',
             field: 'name',
             component: 'JInput',
-            colProps: {span: 10}
-          }
-        ]
-      }
+            colProps: { span: 10 },
+          },
+        ],
+      };
       //定义表格列
       const columns = [
         {
@@ -94,21 +105,21 @@
       ];
       //已选择的table信息
       const selectedTable = {
-         pagination:false,
-         showIndexColumn:false,
-         scroll: { y: 390 },
-         size: 'small',
-         canResize: false,
-         bordered: true,
-         rowKey: 'id',
-         columns:[
-            {
-                title: '职务名称',
-                dataIndex: 'name',
-                width: 40,
-            },
-            { title: '操作', dataIndex: 'action', align: 'center', width: 40, slots: {customRender: 'action'} }
-         ],
+        pagination: false,
+        showIndexColumn: false,
+        scroll: { y: 390 },
+        size: 'small',
+        canResize: false,
+        bordered: true,
+        rowKey: 'id',
+        columns: [
+          {
+            title: '职务名称',
+            dataIndex: 'name',
+            width: 40,
+          },
+          { title: '操作', dataIndex: 'action', align: 'center', width: 40, slots: { customRender: 'action' } },
+        ],
       };
       /**
        * 确定选择
@@ -135,7 +146,6 @@
         selectedTable,
         selectRows,
         handleDeleteSelected,
-
       };
     },
   });
diff --git a/src/components/Form/src/jeecg/components/modal/RoleSelectModal.vue b/src/components/Form/src/jeecg/components/modal/RoleSelectModal.vue
index 7cffb70..9d8764c 100644
--- a/src/components/Form/src/jeecg/components/modal/RoleSelectModal.vue
+++ b/src/components/Form/src/jeecg/components/modal/RoleSelectModal.vue
@@ -1,10 +1,19 @@
 <!--角色选择框-->
 <template>
-    <div>
-        <BasicModal v-bind="$attrs" @register="register" title="角色选择" width="800px" @ok="handleOk" destroyOnClose @visible-change="visibleChange">
-            <BasicTable :columns="columns" v-bind="config" :useSearchForm="true" :formConfig="formConfig"  :api="getRoleList" :searchInfo="searchInfo" :rowSelection="rowSelection" :indexColumnProps="indexColumnProps"></BasicTable>
-        </BasicModal>
-    </div>
+  <div>
+    <BasicModal v-bind="$attrs" @register="register" title="角色选择" width="800px" @ok="handleOk" destroyOnClose @visible-change="visibleChange">
+      <BasicTable
+        :columns="columns"
+        v-bind="config"
+        :useSearchForm="true"
+        :formConfig="formConfig"
+        :api="getRoleList"
+        :searchInfo="searchInfo"
+        :rowSelection="rowSelection"
+        :indexColumnProps="indexColumnProps"
+      ></BasicTable>
+    </BasicModal>
+  </div>
 </template>
 <script lang="ts">
   import { defineComponent, ref, unref } from 'vue';
@@ -19,7 +28,8 @@
     name: 'UserSelectModal',
     components: {
       //此处需要异步加载BasicTable
-      BasicModal, BasicTable: createAsyncComponent(() => import('/@/components/Table/src/BasicTable.vue'), { loading: true }),
+      BasicModal,
+      BasicTable: createAsyncComponent(() => import('/@/components/Table/src/BasicTable.vue'), { loading: true }),
     },
     props: {
       ...selectProps,
@@ -34,15 +44,15 @@
         canResize: false,
         bordered: true,
         size: 'small',
-        rowKey: 'id'
+        rowKey: 'id',
       };
-      const getBindValue =Object.assign({},unref(props),unref(attrs),config);
-      const [{ rowSelection,indexColumnProps, visibleChange, getSelectResult }] = useSelectBiz(getRoleList,getBindValue);
+      const getBindValue = Object.assign({}, unref(props), unref(attrs), config);
+      const [{ rowSelection, indexColumnProps, visibleChange, getSelectResult }] = useSelectBiz(getRoleList, getBindValue);
       const searchInfo = ref(props.params);
       //查询form
-      const formConfig={
-        labelWidth:220,
-        baseColProps:{
+      const formConfig = {
+        labelWidth: 220,
+        baseColProps: {
           xs: 24,
           sm: 24,
           md: 24,
@@ -50,14 +60,14 @@
           xl: 14,
           xxl: 14,
         },
-        schemas:[
+        schemas: [
           {
             label: '角色名称',
             field: 'roleName',
             component: 'JInput',
-          }
+          },
         ],
-      }
+      };
       //定义表格列
       const columns = [
         {
@@ -70,7 +80,7 @@
           title: '角色编码',
           dataIndex: 'roleCode',
           width: 40,
-        }
+        },
       ];
 
       /**
diff --git a/src/components/Form/src/jeecg/components/modal/UserSelectByDepModal.vue b/src/components/Form/src/jeecg/components/modal/UserSelectByDepModal.vue
index e8f18ed..9b0b8a9 100644
--- a/src/components/Form/src/jeecg/components/modal/UserSelectByDepModal.vue
+++ b/src/components/Form/src/jeecg/components/modal/UserSelectByDepModal.vue
@@ -1,200 +1,207 @@
 <!--通过部门选择用户-->
 <template>
-    <BasicModal v-bind="$attrs" @register="register" title="用户选择" width="1200px" @ok="handleOk" destroyOnClose @visible-change="visibleChange">
-        <a-row :gutter="10">
-            <a-col :md="7" :sm="24">
-                <a-card :style="{minHeight:'613px',overflow:'auto'}">
-                    <!--组织机构-->
-                    <BasicTree ref="treeRef" :style="{minWidth:'250px'}" selectable @select="onDepSelect" :load-data="loadChildrenTreeData" :treeData="departTree" :selectedKeys="selectedDepIds" :expandedKeys="expandedKeys" :clickRowToExpand="false"></BasicTree>
-                 </a-card>
-            </a-col>
-            <a-col :md="17" :sm="24">
-                <a-card :style="{minHeight:'613px',overflow:'auto'}">
-                    <!--用户列表-->
-                    <BasicTable ref="tableRef"  v-bind="getBindValue" :searchInfo="searchInfo" :api="getTableList" :rowSelection="rowSelection"></BasicTable>
-                </a-card>
-            </a-col>
-        </a-row>
-    </BasicModal>
+  <BasicModal v-bind="$attrs" @register="register" title="用户选择" width="1200px" @ok="handleOk" destroyOnClose @visible-change="visibleChange">
+    <a-row :gutter="10">
+      <a-col :md="7" :sm="24">
+        <a-card :style="{ minHeight: '613px', overflow: 'auto' }">
+          <!--组织机构-->
+          <BasicTree
+            ref="treeRef"
+            :style="{ minWidth: '250px' }"
+            selectable
+            @select="onDepSelect"
+            :load-data="loadChildrenTreeData"
+            :treeData="departTree"
+            :selectedKeys="selectedDepIds"
+            :expandedKeys="expandedKeys"
+            :clickRowToExpand="false"
+          ></BasicTree>
+        </a-card>
+      </a-col>
+      <a-col :md="17" :sm="24">
+        <a-card :style="{ minHeight: '613px', overflow: 'auto' }">
+          <!--用户列表-->
+          <BasicTable ref="tableRef" v-bind="getBindValue" :searchInfo="searchInfo" :api="getTableList" :rowSelection="rowSelection"></BasicTable>
+        </a-card>
+      </a-col>
+    </a-row>
+  </BasicModal>
 </template>
 <script lang="ts">
-    import {defineComponent, unref, ref} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import { BasicTree } from '/@/components/Tree/index';
-    import {queryTreeList,getTableList} from '/@/api/common/api';
-    import {createAsyncComponent} from '/@/utils/factory/createAsyncComponent';
-    import {useSelectBiz} from '/@/components/Form/src/jeecg/hooks/useSelectBiz';
-    import {useAttrs} from '/@/hooks/core/useAttrs';
-    import { queryDepartTreeSync } from '/@/views/system/depart/depart.api'
-    import {selectProps} from '/@/components/Form/src/jeecg/props/props';
-    export default defineComponent({
-        name: 'UserSelectByDepModal',
-        components: {
-            //此处需要异步加载BasicTable
-            BasicModal,BasicTree, BasicTable: createAsyncComponent(() => import('/@/components/Table/src/BasicTable.vue'), {loading: true}),
+  import { defineComponent, unref, ref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicTree } from '/@/components/Tree/index';
+  import { queryTreeList, getTableList } from '/@/api/common/api';
+  import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent';
+  import { useSelectBiz } from '/@/components/Form/src/jeecg/hooks/useSelectBiz';
+  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { queryDepartTreeSync } from '/@/views/system/depart/depart.api';
+  import { selectProps } from '/@/components/Form/src/jeecg/props/props';
+  export default defineComponent({
+    name: 'UserSelectByDepModal',
+    components: {
+      //此处需要异步加载BasicTable
+      BasicModal,
+      BasicTree,
+      BasicTable: createAsyncComponent(() => import('/@/components/Table/src/BasicTable.vue'), { loading: true }),
+    },
+    props: {
+      ...selectProps,
+    },
+    emits: ['register', 'getSelectResult'],
+    setup(props, { emit, refs }) {
+      const tableRef = ref();
+      const treeRef = ref();
+      //注册弹框
+      const [register, { closeModal }] = useModalInner(async (data) => {
+        await queryDepartTree();
+      });
+      const attrs = useAttrs();
+      const departTree = ref([]);
+      const selectedDepIds = ref([]);
+      const expandedKeys = ref([]);
+      const searchInfo = {};
+      /**
+       *表格配置
+       */
+      const tableProps = {
+        columns: [
+          {
+            title: '用户账号',
+            dataIndex: 'username',
+            width: 50,
+          },
+          {
+            title: '用户姓名',
+            dataIndex: 'realname',
+            width: 50,
+          },
+          {
+            title: '性别',
+            dataIndex: 'sex_dictText',
+            width: 50,
+          },
+          {
+            title: '手机号码',
+            dataIndex: 'phone',
+            width: 50,
+          },
+        ],
+        useSearchForm: true,
+        canResize: false,
+        showIndexColumn: false,
+        striped: true,
+        bordered: true,
+        size: 'small',
+        formConfig: {
+          labelWidth: 200,
+          baseColProps: {
+            xs: 24,
+            sm: 8,
+            md: 6,
+            lg: 8,
+            xl: 6,
+            xxl: 10,
+          },
+          schemas: [
+            {
+              label: '账号',
+              field: 'username',
+              component: 'Input',
+            },
+          ],
+          resetFunc: customResetFunc,
         },
-        props: {
-            ...selectProps,
-        },
-        emits: ['register', 'getSelectResult'],
-        setup(props, {emit, refs}) {
-            const tableRef = ref();
-            const treeRef = ref();
-            //注册弹框
-            const [register, {closeModal}] = useModalInner(async (data) => {
-                await queryDepartTree()
-            });
-            const attrs = useAttrs();
-            const departTree = ref([]);
-            const selectedDepIds = ref([]);
-            const expandedKeys = ref([]);
-            const searchInfo = {};
-            /**
-             *表格配置
-             */
-            const tableProps = {
-                columns:  [
-                    {
-                        title: '用户账号',
-                        dataIndex: 'username',
-                        width:50
-                    },
-                    {
-                        title: '用户姓名',
-                        dataIndex: 'realname',
-                        width:50
-                    },
-                    {
-                        title: '性别',
-                        dataIndex: 'sex_dictText',
-                        width:50
-                    },
-                    {
-                        title: '手机号码',
-                        dataIndex: 'phone',
-                        width:50
-                    }
-                ],
-                useSearchForm:true,
-                canResize:false,
-                showIndexColumn:false,
-                striped:true,
-                bordered:true,
-                size: 'small',
-                formConfig: {
-                  labelWidth:200,
-                  baseColProps:{
-                    xs: 24,
-                    sm: 8,
-                    md: 6,
-                    lg: 8,
-                    xl: 6,
-                    xxl: 10,
-                  },
-                  schemas: [
-                    {
-                        label: '账号',
-                        field: 'username',
-                        component: 'Input'
-                    }
-                  ],
-                    resetFunc:customResetFunc
-                },
-            };
-            const getBindValue = Object.assign({}, unref(props), unref(attrs),tableProps);
-            const [{rowSelection, visibleChange, indexColumnProps, getSelectResult,reset}] = useSelectBiz(getTableList, getBindValue);
-            /**
-             * 加载树形数据
-             */
-            function queryDepartTree() {
-                queryDepartTreeSync().then((res) => {
-                    if (res) {
-                        departTree.value = res;
-                        // 默认展开父节点
-                        //expandedKeys.value = unref(departTree).map(item => item.id)
-                    }
-                })
-            }
-            /**
-             * 加载子级部门
-             */
-            async function loadChildrenTreeData(treeNode) {
-                try {
-                    const result = await queryDepartTreeSync({
-                        pid: treeNode.eventKey,
-                    })
-                    const asyncTreeAction  = unref(treeRef);
-                    if (asyncTreeAction) {
-                        asyncTreeAction.updateNodeByKey(treeNode.eventKey, {children: result});
-                        asyncTreeAction.setExpandedKeys([
-                            treeNode.eventKey,
-                            ...asyncTreeAction.getExpandedKeys(),
-                        ]);
-                    }
-                } catch (e) {
-                    console.error(e)
-                }
-                return Promise.resolve()
-            }
-            /**
-             * 点击树节点,筛选出对应的用户
-             */
-            function onDepSelect(keys) {
-                if (keys[0] != null) {
-                    if (unref(selectedDepIds)[0] !== keys[0]) {
-                        selectedDepIds.value = [keys[0]];
-                    }
-                    searchInfo['departId'] = unref(selectedDepIds).join(',');
-                    tableRef.value.reload()
-                }
-            }
-            /**
-             * 自定义重置方法
-             * */
-            async function customResetFunc(){
-                console.log("自定义查询")
-                //树节点清空
-                selectedDepIds.value = [];
-                //查询条件清空
-                searchInfo['departId'] = "";
-                //选择项清空
-                reset();
-            }
-            /**
-             * 确定选择
-             */
-            function handleOk() {
-                getSelectResult((options, values) => {
-                    //回传选项和已选择的值
-                    emit('getSelectResult', options, values);
-                    //关闭弹窗
-                    closeModal();
-                });
-            }
+      };
+      const getBindValue = Object.assign({}, unref(props), unref(attrs), tableProps);
+      const [{ rowSelection, visibleChange, indexColumnProps, getSelectResult, reset }] = useSelectBiz(getTableList, getBindValue);
+      /**
+       * 加载树形数据
+       */
+      function queryDepartTree() {
+        queryDepartTreeSync().then((res) => {
+          if (res) {
+            departTree.value = res;
+            // 默认展开父节点
+            //expandedKeys.value = unref(departTree).map(item => item.id)
+          }
+        });
+      }
+      /**
+       * 加载子级部门
+       */
+      async function loadChildrenTreeData(treeNode) {
+        try {
+          const result = await queryDepartTreeSync({
+            pid: treeNode.eventKey,
+          });
+          const asyncTreeAction = unref(treeRef);
+          if (asyncTreeAction) {
+            asyncTreeAction.updateNodeByKey(treeNode.eventKey, { children: result });
+            asyncTreeAction.setExpandedKeys([treeNode.eventKey, ...asyncTreeAction.getExpandedKeys()]);
+          }
+        } catch (e) {
+          console.error(e);
+        }
+        return Promise.resolve();
+      }
+      /**
+       * 点击树节点,筛选出对应的用户
+       */
+      function onDepSelect(keys) {
+        if (keys[0] != null) {
+          if (unref(selectedDepIds)[0] !== keys[0]) {
+            selectedDepIds.value = [keys[0]];
+          }
+          searchInfo['departId'] = unref(selectedDepIds).join(',');
+          tableRef.value.reload();
+        }
+      }
+      /**
+       * 自定义重置方法
+       * */
+      async function customResetFunc() {
+        console.log('自定义查询');
+        //树节点清空
+        selectedDepIds.value = [];
+        //查询条件清空
+        searchInfo['departId'] = '';
+        //选择项清空
+        reset();
+      }
+      /**
+       * 确定选择
+       */
+      function handleOk() {
+        getSelectResult((options, values) => {
+          //回传选项和已选择的值
+          emit('getSelectResult', options, values);
+          //关闭弹窗
+          closeModal();
+        });
+      }
 
-            return {
-                //config,
-                handleOk,
-                searchInfo,
-                register,
-                indexColumnProps,
-                visibleChange,
-                getBindValue,
-                rowSelection,
+      return {
+        //config,
+        handleOk,
+        searchInfo,
+        register,
+        indexColumnProps,
+        visibleChange,
+        getBindValue,
+        rowSelection,
 
-                departTree,
-                selectedDepIds,
-                expandedKeys,
-                treeRef,
-                tableRef,
-                getTableList,
-                onDepSelect,
-                loadChildrenTreeData,
-            };
-        },
-    });
+        departTree,
+        selectedDepIds,
+        expandedKeys,
+        treeRef,
+        tableRef,
+        getTableList,
+        onDepSelect,
+        loadChildrenTreeData,
+      };
+    },
+  });
 </script>
 
-<style scoped lang="less">
-
-</style>
+<style scoped lang="less"></style>
diff --git a/src/components/Form/src/jeecg/components/modal/UserSelectModal.vue b/src/components/Form/src/jeecg/components/modal/UserSelectModal.vue
index 7631f24..7fdc7c7 100644
--- a/src/components/Form/src/jeecg/components/modal/UserSelectModal.vue
+++ b/src/components/Form/src/jeecg/components/modal/UserSelectModal.vue
@@ -1,25 +1,34 @@
 <!--用户选择框-->
 <template>
-    <div>
-        <BasicModal v-bind="$attrs" @register="register" title="用户选择" width="900px" wrapClassName="j-user-select-modal" @ok="handleOk" destroyOnClose @visible-change="visibleChange">
-            <a-row>
-                <a-col :span="showSelected?18:24">
-                    <BasicTable :columns="columns" v-bind="getBindValue" :useSearchForm="true" :formConfig="formConfig" :api="getUserList" :searchInfo="searchInfo" :rowSelection="rowSelection" :indexColumnProps="indexColumnProps"></BasicTable>
-                </a-col>
-                <a-col :span="showSelected?6:0">
-                    <BasicTable v-bind="selectedTable" :dataSource="selectRows"  :useSearchForm="true" :formConfig="{showActionButtonGroup:false,baseRowStyle:{minHeight:'40px'}}">
-                        <!--操作栏-->
-                        <template #action="{ record }">
-                            <a href="javascript:void(0)" @click="handleDeleteSelected(record)"><Icon icon="ant-design:delete-outlined"></Icon></a>
-                        </template>
-                    </BasicTable>
-                </a-col>
-            </a-row>
-        </BasicModal>
-    </div>
+  <div>
+    <BasicModal v-bind="$attrs" @register="register" title="用户选择" width="900px" wrapClassName="j-user-select-modal" @ok="handleOk" destroyOnClose @visible-change="visibleChange">
+      <a-row>
+        <a-col :span="showSelected ? 18 : 24">
+          <BasicTable
+            :columns="columns"
+            v-bind="getBindValue"
+            :useSearchForm="true"
+            :formConfig="formConfig"
+            :api="getUserList"
+            :searchInfo="searchInfo"
+            :rowSelection="rowSelection"
+            :indexColumnProps="indexColumnProps"
+          ></BasicTable>
+        </a-col>
+        <a-col :span="showSelected ? 6 : 0">
+          <BasicTable v-bind="selectedTable" :dataSource="selectRows" :useSearchForm="true" :formConfig="{ showActionButtonGroup: false, baseRowStyle: { minHeight: '40px' } }">
+            <!--操作栏-->
+            <template #action="{ record }">
+              <a href="javascript:void(0)" @click="handleDeleteSelected(record)"><Icon icon="ant-design:delete-outlined"></Icon></a>
+            </template>
+          </BasicTable>
+        </a-col>
+      </a-row>
+    </BasicModal>
+  </div>
 </template>
 <script lang="ts">
-  import { defineComponent, unref,ref } from 'vue';
+  import { defineComponent, unref, ref } from 'vue';
   import { BasicModal, useModalInner } from '/@/components/Modal';
   import { getUserList } from '/@/api/common/api';
   import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent';
@@ -31,7 +40,8 @@
     name: 'UserSelectModal',
     components: {
       //此处需要异步加载BasicTable
-      BasicModal, BasicTable: createAsyncComponent(() => import('/@/components/Table/src/BasicTable.vue'), { loading: true }),
+      BasicModal,
+      BasicTable: createAsyncComponent(() => import('/@/components/Table/src/BasicTable.vue'), { loading: true }),
     },
     props: {
       ...selectProps,
@@ -47,13 +57,13 @@
         bordered: true,
         size: 'small',
       };
-      const getBindValue =Object.assign({},unref(props),unref(attrs),config);
-      const [{ rowSelection,  visibleChange, indexColumnProps, getSelectResult,handleDeleteSelected, selectRows }] = useSelectBiz(getUserList,getBindValue);
+      const getBindValue = Object.assign({}, unref(props), unref(attrs), config);
+      const [{ rowSelection, visibleChange, indexColumnProps, getSelectResult, handleDeleteSelected, selectRows }] = useSelectBiz(getUserList, getBindValue);
       const searchInfo = ref(props.params);
       //查询form
-      const formConfig={
-        labelWidth:200,
-        baseColProps:{
+      const formConfig = {
+        labelWidth: 200,
+        baseColProps: {
           xs: 24,
           sm: 8,
           md: 6,
@@ -61,19 +71,19 @@
           xl: 6,
           xxl: 6,
         },
-        schemas:[
+        schemas: [
           {
             label: '账号',
             field: 'username',
-            component: 'JInput'
+            component: 'JInput',
           },
           {
             label: '姓名',
             field: 'realname',
-            component: 'JInput'
-          }
+            component: 'JInput',
+          },
         ],
-      }
+      };
       //定义表格列
       const columns = [
         {
@@ -110,21 +120,21 @@
       ];
       //已选择的table信息
       const selectedTable = {
-          pagination:false,
-          showIndexColumn:false,
-          scroll: { y: 390 },
-          size: 'small',
-          canResize: false,
-          bordered: true,
-          rowKey: 'id',
-          columns:[
-              {
-                  title: '用户姓名',
-                  dataIndex: 'realname',
-                  width: 40,
-              },
-              { title: '操作', dataIndex: 'action', align: 'center', width: 40, slots: {customRender: 'action'} }
-          ],
+        pagination: false,
+        showIndexColumn: false,
+        scroll: { y: 390 },
+        size: 'small',
+        canResize: false,
+        bordered: true,
+        rowKey: 'id',
+        columns: [
+          {
+            title: '用户姓名',
+            dataIndex: 'realname',
+            width: 40,
+          },
+          { title: '操作', dataIndex: 'action', align: 'center', width: 40, slots: { customRender: 'action' } },
+        ],
       };
       /**
        * 确定选择
@@ -152,7 +162,7 @@
         rowSelection,
         selectRows,
         selectedTable,
-        handleDeleteSelected
+        handleDeleteSelected,
       };
     },
   });
diff --git a/src/components/Form/src/jeecg/hooks/useSelectBiz.ts b/src/components/Form/src/jeecg/hooks/useSelectBiz.ts
index 3fba983..029bebb 100644
--- a/src/components/Form/src/jeecg/hooks/useSelectBiz.ts
+++ b/src/components/Form/src/jeecg/hooks/useSelectBiz.ts
@@ -1,138 +1,146 @@
-import {inject, reactive, ref, watch, unref, Ref} from 'vue'
-import {useMessage} from "/@/hooks/web/useMessage";
+import { inject, reactive, ref, watch, unref, Ref } from 'vue';
+import { useMessage } from '/@/hooks/web/useMessage';
 
-export function useSelectBiz(getList,props) {
-    //接收下拉框选项
-    const selectOptions = inject('selectOptions', ref<Array<object>>([]));
-    //接收已选择的值
-    const selectValues = <object>inject('selectValues', reactive({}));
-    // 是否正在加载回显
-    const loadingEcho = inject<Ref<boolean>>('loadingEcho', ref(false))
-    //数据集
-    const dataSource = ref<Array<object>>([]);
-    //已选择的值
-    const checkedKeys = ref<Array<string | number>>([]);
-    //选则的行记录
-    const selectRows = ref<Array<object>>([]);
-    //提示弹窗
-    const $message = useMessage()
-    // 是否是首次加载回显，只有首次加载，才会显示 loading
-    let isFirstLoadEcho = true
+export function useSelectBiz(getList, props) {
+  //接收下拉框选项
+  const selectOptions = inject('selectOptions', ref<Array<object>>([]));
+  //接收已选择的值
+  const selectValues = <object>inject('selectValues', reactive({}));
+  // 是否正在加载回显
+  const loadingEcho = inject<Ref<boolean>>('loadingEcho', ref(false));
+  //数据集
+  const dataSource = ref<Array<object>>([]);
+  //已选择的值
+  const checkedKeys = ref<Array<string | number>>([]);
+  //选则的行记录
+  const selectRows = ref<Array<object>>([]);
+  //提示弹窗
+  const $message = useMessage();
+  // 是否是首次加载回显，只有首次加载，才会显示 loading
+  let isFirstLoadEcho = true;
 
-    /**
-     * 监听selectValues变化
-     */
-    watch(selectValues, () => {
-        if (selectValues["change"] == false) {
-            //update-begin---author:wangshuai ---date:20220412  for：[VUEN-672]发文草稿箱编辑时拟稿人显示用户名------------
-            let params={};
-            params[props.rowKey] = selectValues["value"].join(",")
-            //update-end---author:wangshuai ---date:20220412  for：[VUEN-672]发文草稿箱编辑时拟稿人显示用户名--------------
-            loadingEcho.value = isFirstLoadEcho
-            isFirstLoadEcho = false
-            getDataSource(params, true).then().finally(()=>{
-                loadingEcho.value = isFirstLoadEcho
-            });
-        }
-        //设置列表默认选中
-        checkedKeys["value"] = selectValues["value"]
-    }, {immediate: true})
+  /**
+   * 监听selectValues变化
+   */
+  watch(
+    selectValues,
+    () => {
+      if (selectValues['change'] == false) {
+        //update-begin---author:wangshuai ---date:20220412  for：[VUEN-672]发文草稿箱编辑时拟稿人显示用户名------------
+        let params = {};
+        params[props.rowKey] = selectValues['value'].join(',');
+        //update-end---author:wangshuai ---date:20220412  for：[VUEN-672]发文草稿箱编辑时拟稿人显示用户名--------------
+        loadingEcho.value = isFirstLoadEcho;
+        isFirstLoadEcho = false;
+        getDataSource(params, true)
+          .then()
+          .finally(() => {
+            loadingEcho.value = isFirstLoadEcho;
+          });
+      }
+      //设置列表默认选中
+      checkedKeys['value'] = selectValues['value'];
+    },
+    { immediate: true }
+  );
 
-    async function onSelectChange(selectedRowKeys: (string | number)[], selectRow) {
-        checkedKeys.value = selectedRowKeys;
-        //判断全选的问题checkedKeys和selectRows必须一致
-        if(props.showSelected && unref(checkedKeys).length!==unref(selectRow).length){
-            let {records} = await getList({
-                code: unref(checkedKeys).join(","),
-                pageSize :unref(checkedKeys).length
-            });
-            selectRows.value = records
-        }else{
-            selectRows.value = selectRow
-        }
+  async function onSelectChange(selectedRowKeys: (string | number)[], selectRow) {
+    checkedKeys.value = selectedRowKeys;
+    //判断全选的问题checkedKeys和selectRows必须一致
+    if (props.showSelected && unref(checkedKeys).length !== unref(selectRow).length) {
+      let { records } = await getList({
+        code: unref(checkedKeys).join(','),
+        pageSize: unref(checkedKeys).length,
+      });
+      selectRows.value = records;
+    } else {
+      selectRows.value = selectRow;
     }
+  }
 
-    /**
-     * 选择列配置
-     */
-    const rowSelection = {
-        type: 'checkbox',
-        columnWidth: 20,
-        selectedRowKeys: checkedKeys,
-        onChange: onSelectChange
-    }
+  /**
+   * 选择列配置
+   */
+  const rowSelection = {
+    type: 'checkbox',
+    columnWidth: 20,
+    selectedRowKeys: checkedKeys,
+    onChange: onSelectChange,
+  };
 
-    /**
-     * 序号列配置
-     */
-    const indexColumnProps = {
-        dataIndex: 'index',
-        width: 20,
-    }
+  /**
+   * 序号列配置
+   */
+  const indexColumnProps = {
+    dataIndex: 'index',
+    width: 20,
+  };
 
-    /**
-     * 加载列表数据集
-     * @param params
-     * @param flag 是否是默认回显模式加载
-     */
-    async function getDataSource(params, flag) {
-        let {records} = await getList(params);
-        dataSource.value = records;
-        if (flag) {
-            let options = <any[]>([]);
-            records.forEach(item => {
-                options.push({'label': item[props.labelKey], 'value': item[props.rowKey]})
-            })
-            selectOptions.value = options;
-        }
-    }
-    async function initSelectRows() {
-        let {records} = await getList({
-            code: selectValues["value"].join(","),
-            pageSize :selectValues["value"].length
-        });
-        checkedKeys["value"] = selectValues["value"]
-        selectRows["value"] = records
+  /**
+   * 加载列表数据集
+   * @param params
+   * @param flag 是否是默认回显模式加载
+   */
+  async function getDataSource(params, flag) {
+    let { records } = await getList(params);
+    dataSource.value = records;
+    if (flag) {
+      let options = <any[]>[];
+      records.forEach((item) => {
+        options.push({ label: item[props.labelKey], value: item[props.rowKey] });
+      });
+      selectOptions.value = options;
     }
+  }
+  async function initSelectRows() {
+    let { records } = await getList({
+      code: selectValues['value'].join(','),
+      pageSize: selectValues['value'].length,
+    });
+    checkedKeys['value'] = selectValues['value'];
+    selectRows['value'] = records;
+  }
 
-    /**
-     * 弹出框显示隐藏触发事件
-     */
-    async function visibleChange(visible) {
-        if (visible) {
-            //设置列表默认选中
-          props.showSelected && initSelectRows()
-        }
+  /**
+   * 弹出框显示隐藏触发事件
+   */
+  async function visibleChange(visible) {
+    if (visible) {
+      //设置列表默认选中
+      props.showSelected && initSelectRows();
     }
+  }
 
-    /**
-     * 确定选择
-     */
-    function getSelectResult(success) {
-        let options = <any[]>[];
-        let values = <any[]>[];
-        selectRows.value.forEach(item => {
-            options.push({label: item[props.labelKey], value: item[props.rowKey]})
-        })
-        checkedKeys.value.forEach(item => {
-            values.push(item)
-        })
-        selectOptions.value = options;
-        if(props.maxSelectCount && values.length > props.maxSelectCount){
-            $message.createMessage.warning(`最多只能选择${props.maxSelectCount}条数据`)
-            return false
-        }
-        success && success(options,values);
+  /**
+   * 确定选择
+   */
+  function getSelectResult(success) {
+    let options = <any[]>[];
+    let values = <any[]>[];
+    selectRows.value.forEach((item) => {
+      options.push({ label: item[props.labelKey], value: item[props.rowKey] });
+    });
+    checkedKeys.value.forEach((item) => {
+      values.push(item);
+    });
+    selectOptions.value = options;
+    if (props.maxSelectCount && values.length > props.maxSelectCount) {
+      $message.createMessage.warning(`最多只能选择${props.maxSelectCount}条数据`);
+      return false;
     }
-    //删除已选择的信息
-    function handleDeleteSelected(record){
-        checkedKeys.value = checkedKeys.value.splice(checkedKeys.value.indexOf(record['id']), 1);
-        selectRows.value = selectRows.value.filter(item=>item['id'] !== record['id'])
-    }
-    //清空选择项
-    function reset(){
-        checkedKeys.value = [];
-        selectRows.value = []
-    }
-    return [{onSelectChange, getDataSource, visibleChange, selectOptions, selectValues, rowSelection,indexColumnProps, checkedKeys, selectRows, dataSource, getSelectResult,handleDeleteSelected,reset}];
+    success && success(options, values);
+  }
+  //删除已选择的信息
+  function handleDeleteSelected(record) {
+    checkedKeys.value = checkedKeys.value.splice(checkedKeys.value.indexOf(record['id']), 1);
+    selectRows.value = selectRows.value.filter((item) => item['id'] !== record['id']);
+  }
+  //清空选择项
+  function reset() {
+    checkedKeys.value = [];
+    selectRows.value = [];
+  }
+  return [
+    { onSelectChange, getDataSource, visibleChange, selectOptions, selectValues, rowSelection, indexColumnProps, checkedKeys, selectRows, dataSource, getSelectResult, handleDeleteSelected, reset },
+  ];
 }
diff --git a/src/components/Form/src/jeecg/hooks/useTreeBiz.ts b/src/components/Form/src/jeecg/hooks/useTreeBiz.ts
index abe9644..44b1173 100644
--- a/src/components/Form/src/jeecg/hooks/useTreeBiz.ts
+++ b/src/components/Form/src/jeecg/hooks/useTreeBiz.ts
@@ -1,4 +1,4 @@
-import type {Ref} from 'vue'
+import type { Ref } from 'vue';
 import { inject, reactive, ref, computed, unref, watch, nextTick } from 'vue';
 import { TreeActionType } from '/@/components/Tree';
 import { listToTree } from '/@/utils/common/compUtils';
@@ -9,7 +9,7 @@ export function useTreeBiz(treeRef, getList, props) {
   //接收已选择的值
   const selectValues = <object>inject('selectValues', reactive({}));
   // 是否正在加载回显
-  const loadingEcho = inject<Ref<boolean>>('loadingEcho', ref(false))
+  const loadingEcho = inject<Ref<boolean>>('loadingEcho', ref(false));
   //数据集
   const treeData = ref<Array<object>>([]);
   //已选择的值
@@ -19,23 +19,26 @@ export function useTreeBiz(treeRef, getList, props) {
   //是否是打开弹框模式
   const openModal = ref(false);
   // 是否开启父子关联，如果不可以多选，就始终取消父子关联
-  const getCheckStrictly = computed(() => props.multiple ? props.checkStrictly : true)
+  const getCheckStrictly = computed(() => (props.multiple ? props.checkStrictly : true));
   // 是否是首次加载回显，只有首次加载，才会显示 loading
-  let isFirstLoadEcho = true
+  let isFirstLoadEcho = true;
 
   /**
    * 监听selectValues变化
    */
-  watch(selectValues, ({value: values}: Recordable) => {
-    if (openModal.value == false && values.length > 0) {
-      loadingEcho.value = isFirstLoadEcho
-      isFirstLoadEcho = false
-      onLoadData(null, values.join(',')).finally(() => {
-        loadingEcho.value = false
-      })
-    }
-  }, {immediate: true});
-
+  watch(
+    selectValues,
+    ({ value: values }: Recordable) => {
+      if (openModal.value == false && values.length > 0) {
+        loadingEcho.value = isFirstLoadEcho;
+        isFirstLoadEcho = false;
+        onLoadData(null, values.join(',')).finally(() => {
+          loadingEcho.value = false;
+        });
+      }
+    },
+    { immediate: true }
+  );
 
   /**
    * 获取树实例
@@ -65,9 +68,8 @@ export function useTreeBiz(treeRef, getList, props) {
    * 树节点选择
    */
   function onSelect(keys, info) {
-    if(props.checkable==false)
-    {
-      checkedKeys.value = props.checkStrictly?keys.checked:keys;
+    if (props.checkable == false) {
+      checkedKeys.value = props.checkStrictly ? keys.checked : keys;
       const { selectedNodes } = info;
       let rows = <any[]>[];
       selectedNodes.forEach((item) => {
@@ -77,27 +79,26 @@ export function useTreeBiz(treeRef, getList, props) {
     }
   }
 
-
   /**
    * 树节点选择
    */
   function onCheck(keys, info) {
-    if(props.checkable==true) {
+    if (props.checkable == true) {
       // 如果不能多选，就只保留最后一个选中的
       if (!props.multiple) {
         if (info.checked) {
           //update-begin-author:taoyan date:20220408 for: 单选模式下，设定rowKey，无法选中数据-
-          checkedKeys.value = [info.node.eventKey]
-          let temp = info.checkedNodes.find(n => n.key === info.node.eventKey)
-          selectRows.value = [temp.props.node]
+          checkedKeys.value = [info.node.eventKey];
+          let temp = info.checkedNodes.find((n) => n.key === info.node.eventKey);
+          selectRows.value = [temp.props.node];
           //update-end-author:taoyan date:20220408 for: 单选模式下，设定rowKey，无法选中数据-
         } else {
-          checkedKeys.value = []
-          selectRows.value = []
+          checkedKeys.value = [];
+          selectRows.value = [];
         }
-        return
+        return;
       }
-      checkedKeys.value = props.checkStrictly?keys.checked:keys;
+      checkedKeys.value = props.checkStrictly ? keys.checked : keys;
       const { checkedNodes } = info;
       let rows = <any[]>[];
       checkedNodes.forEach((item) => {
@@ -110,41 +111,40 @@ export function useTreeBiz(treeRef, getList, props) {
   /**
    * 勾选全部
    */
-  function checkALL(checkAll){
+  function checkALL(checkAll) {
     getTree().checkAll(checkAll);
   }
 
   /**
    * 展开全部
    */
-  function expandAll(expandAll){
+  function expandAll(expandAll) {
     getTree().expandAll(expandAll);
   }
 
-
   /**
    * 加载树数据
    */
   async function onLoadData(treeNode, ids) {
     let params = {};
-    let startPid=''
+    let startPid = '';
     if (treeNode) {
-      startPid=treeNode.eventKey;
+      startPid = treeNode.eventKey;
       //update-begin---author:wangshuai ---date:20220407  for：rowkey不设置成id，sync开启异步的时候，点击上级下级不显示------------
       params['pid'] = treeNode.value;
       //update-end---author:wangshuai ---date:20220407  for：rowkey不设置成id，sync开启异步的时候，点击上级下级不显示------------
     }
     if (ids) {
-      startPid='';
+      startPid = '';
       params['ids'] = ids;
     }
     let record = await getList(params);
-    let optionData=record;
+    let optionData = record;
     if (!props.serverTreeData) {
       //前端处理数据为tree结构
-      record = listToTree(record, props,startPid);
-      if(record.length==0&&treeNode){
-        checkHasChild(startPid,treeData.value);
+      record = listToTree(record, props, startPid);
+      if (record.length == 0 && treeNode) {
+        checkHasChild(startPid, treeData.value);
       }
     }
 
@@ -161,10 +161,7 @@ export function useTreeBiz(treeRef, getList, props) {
           const asyncTreeAction: TreeActionType | null = unref(treeRef);
           if (asyncTreeAction) {
             asyncTreeAction.updateNodeByKey(treeNode.eventKey, { children: record });
-            asyncTreeAction.setExpandedKeys([
-              treeNode.eventKey,
-              ...asyncTreeAction.getExpandedKeys(),
-            ]);
+            asyncTreeAction.setExpandedKeys([treeNode.eventKey, ...asyncTreeAction.getExpandedKeys()]);
           }
           resolve();
           return;
@@ -192,9 +189,9 @@ export function useTreeBiz(treeRef, getList, props) {
           if (!item.child) {
             item.isLeaf = true;
           }
-          break
+          break;
         } else {
-          checkHasChild(pid, item.children)
+          checkHasChild(pid, item.children);
         }
       }
     }
diff --git a/src/components/Form/src/jeecg/props/props.ts b/src/components/Form/src/jeecg/props/props.ts
index 6fb1de5..64c3830 100644
--- a/src/components/Form/src/jeecg/props/props.ts
+++ b/src/components/Form/src/jeecg/props/props.ts
@@ -13,10 +13,9 @@ export const selectProps = {
     default: 'name',
   },
   //查询参数
-  params:{
-    type:Object,
-    default: () => {
-    }
+  params: {
+    type: Object,
+    default: () => {},
   },
   //是否显示选择按钮
   showButton: propTypes.bool.def(true),
@@ -48,7 +47,7 @@ export const treeProps = {
   },
   //根pid值
   startPid: {
-    type: [Number,String],
+    type: [Number, String],
     default: '',
   },
   //主键字段
diff --git a/src/components/Form/src/props.ts b/src/components/Form/src/props.ts
index 327b10a..c9d8cf3 100644
--- a/src/components/Form/src/props.ts
+++ b/src/components/Form/src/props.ts
@@ -92,9 +92,9 @@ export const basicProps = {
   // 以下为默认props
   hideRequiredMark: propTypes.bool,
 
-  labelCol:{
+  labelCol: {
     type: Object as PropType<Partial<ColEx>>,
-    default:form.labelCol
+    default: form.labelCol,
   },
 
   layout: propTypes.oneOf(['horizontal', 'vertical', 'inline']).def('horizontal'),
@@ -103,8 +103,8 @@ export const basicProps = {
   },
 
   wrapperCol: {
-    type:Object as PropType<Partial<ColEx>>,
-    default:form.wrapperCol
+    type: Object as PropType<Partial<ColEx>>,
+    default: form.wrapperCol,
   },
 
   colon: propTypes.bool.def(form.colon),
diff --git a/src/components/Form/src/types/form.ts b/src/components/Form/src/types/form.ts
index e5aea1d..dd2f1c1 100644
--- a/src/components/Form/src/types/form.ts
+++ b/src/components/Form/src/types/form.ts
@@ -35,11 +35,7 @@ export interface FormActionType {
   resetSchema: (data: Partial<FormSchema> | Partial<FormSchema>[]) => Promise<void>;
   setProps: (formProps: Partial<FormProps>) => Promise<void>;
   removeSchemaByFiled: (field: string | string[]) => Promise<void>;
-  appendSchemaByField: (
-      schema: FormSchema,
-      prefixField: string | undefined,
-      first?: boolean | undefined
-  ) => Promise<void>;
+  appendSchemaByField: (schema: FormSchema, prefixField: string | undefined, first?: boolean | undefined) => Promise<void>;
   validateFields: (nameList?: NamePath[]) => Promise<any>;
   validate: (nameList?: NamePath[]) => Promise<any>;
   scrollToField: (name: NamePath, options?: ScrollOptions) => Promise<void>;
@@ -138,10 +134,7 @@ export interface FormSchema {
   // Auxiliary text
   subLabel?: string;
   // Help text on the right side of the text
-  helpMessage?:
-      | string
-      | string[]
-      | ((renderCallbackParams: RenderCallbackParams) => string | string[]);
+  helpMessage?: string | string[] | ((renderCallbackParams: RenderCallbackParams) => string | string[]);
   // BaseHelp component props
   helpComponentProps?: Partial<HelpComponentProps>;
   // Label width, if it is passed, the labelCol and WrapperCol configured by itemProps will be invalid
@@ -151,14 +144,7 @@ export interface FormSchema {
   // render component
   component: ComponentType;
   // Component parameters
-  componentProps?:
-      | ((opt: {
-    schema: FormSchema;
-    tableAction: TableActionType;
-    formActionType: FormActionType;
-    formModel: Recordable;
-  }) => Recordable)
-      | object;
+  componentProps?: ((opt: { schema: FormSchema; tableAction: TableActionType; formActionType: FormActionType; formModel: Recordable }) => Recordable) | object;
   // Required
   required?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean);
 
@@ -192,11 +178,7 @@ export interface FormSchema {
   // Rendering col content requires outer wrapper form-item
   renderColContent?: (renderCallbackParams: RenderCallbackParams) => VNode | VNode[] | string;
 
-  renderComponentContent?:
-      | ((renderCallbackParams: RenderCallbackParams) => any)
-      | VNode
-      | VNode[]
-      | string;
+  renderComponentContent?: ((renderCallbackParams: RenderCallbackParams) => any) | VNode | VNode[] | string;
 
   // Custom slot, in from-item
   slot?: string;
diff --git a/src/components/Form/src/types/index.ts b/src/components/Form/src/types/index.ts
index 8ba826d..ff7ce90 100644
--- a/src/components/Form/src/types/index.ts
+++ b/src/components/Form/src/types/index.ts
@@ -1,146 +1,145 @@
 type ColSpanType = number | string;
 
 export interface ColEx {
-    style?: any;
-    /**
-     * raster number of cells to occupy, 0 corresponds to display: none
-     * @default none (0)
-     * @type ColSpanType
-     */
-    span?: ColSpanType;
+  style?: any;
+  /**
+   * raster number of cells to occupy, 0 corresponds to display: none
+   * @default none (0)
+   * @type ColSpanType
+   */
+  span?: ColSpanType;
 
-    /**
-     * raster order, used in flex layout mode
-     * @default 0
-     * @type ColSpanType
-     */
-    order?: ColSpanType;
+  /**
+   * raster order, used in flex layout mode
+   * @default 0
+   * @type ColSpanType
+   */
+  order?: ColSpanType;
 
-    /**
-     * the layout fill of flex
-     * @default none
-     * @type ColSpanType
-     */
-    flex?: ColSpanType;
+  /**
+   * the layout fill of flex
+   * @default none
+   * @type ColSpanType
+   */
+  flex?: ColSpanType;
 
-    /**
-     * the number of cells to offset Col from the left
-     * @default 0
-     * @type ColSpanType
-     */
-    offset?: ColSpanType;
+  /**
+   * the number of cells to offset Col from the left
+   * @default 0
+   * @type ColSpanType
+   */
+  offset?: ColSpanType;
 
-    /**
-     * the number of cells that raster is moved to the right
-     * @default 0
-     * @type ColSpanType
-     */
-    push?: ColSpanType;
+  /**
+   * the number of cells that raster is moved to the right
+   * @default 0
+   * @type ColSpanType
+   */
+  push?: ColSpanType;
 
-    /**
-     * the number of cells that raster is moved to the left
-     * @default 0
-     * @type ColSpanType
-     */
-    pull?: ColSpanType;
+  /**
+   * the number of cells that raster is moved to the left
+   * @default 0
+   * @type ColSpanType
+   */
+  pull?: ColSpanType;
 
-    /**
-     * <576px and also default setting, could be a span value or an object containing above props
-     * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
-     */
-    xs?: { span: ColSpanType; offset?: ColSpanType } | ColSpanType;
+  /**
+   * <576px and also default setting, could be a span value or an object containing above props
+   * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
+   */
+  xs?: { span: ColSpanType; offset?: ColSpanType } | ColSpanType;
 
-    /**
-     * ≥576px, could be a span value or an object containing above props
-     * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
-     */
-    sm?: { span: ColSpanType; offset?: ColSpanType } | ColSpanType;
+  /**
+   * ≥576px, could be a span value or an object containing above props
+   * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
+   */
+  sm?: { span: ColSpanType; offset?: ColSpanType } | ColSpanType;
 
-    /**
-     * ≥768px, could be a span value or an object containing above props
-     * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
-     */
-    md?: { span: ColSpanType; offset?: ColSpanType } | ColSpanType;
+  /**
+   * ≥768px, could be a span value or an object containing above props
+   * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
+   */
+  md?: { span: ColSpanType; offset?: ColSpanType } | ColSpanType;
 
-    /**
-     * ≥992px, could be a span value or an object containing above props
-     * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
-     */
-    lg?: { span: ColSpanType; offset?: ColSpanType } | ColSpanType;
+  /**
+   * ≥992px, could be a span value or an object containing above props
+   * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
+   */
+  lg?: { span: ColSpanType; offset?: ColSpanType } | ColSpanType;
 
-    /**
-     * ≥1200px, could be a span value or an object containing above props
-     * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
-     */
-    xl?: { span: ColSpanType; offset?: ColSpanType } | ColSpanType;
+  /**
+   * ≥1200px, could be a span value or an object containing above props
+   * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
+   */
+  xl?: { span: ColSpanType; offset?: ColSpanType } | ColSpanType;
 
-    /**
-     * ≥1600px, could be a span value or an object containing above props
-     * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
-     */
-    xxl?: { span: ColSpanType; offset?: ColSpanType } | ColSpanType;
+  /**
+   * ≥1600px, could be a span value or an object containing above props
+   * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
+   */
+  xxl?: { span: ColSpanType; offset?: ColSpanType } | ColSpanType;
 }
 
 export type ComponentType =
-    | 'Input'
-    | 'InputGroup'
-    | 'InputPassword'
-    | 'InputSearch'
-    | 'InputTextArea'
-    | 'InputNumber'
-    | 'InputCountDown'
-    | 'Select'
-    | 'ApiSelect'
-    | 'TreeSelect'
-    | 'ApiTreeSelect'
-    | 'ApiRadioGroup'
-    | 'RadioButtonGroup'
-    | 'RadioGroup'
-    | 'Checkbox'
-    | 'CheckboxGroup'
-    | 'AutoComplete'
-    | 'Cascader'
-    | 'DatePicker'
-    | 'MonthPicker'
-    | 'RangePicker'
-    | 'WeekPicker'
-    | 'TimePicker'
-    | 'Switch'
-    | 'StrengthMeter'
-    | 'Upload'
-    | 'IconPicker'
-    | 'Render'
-    | 'Slider'
-    | 'Rate'
-    | 'Divider'
-    | 'JAreaLinkage'
-    | 'JSelectPosition'
-    | 'JSelectRole'
-    | 'JSelectUser'
-    | 'JImageUpload'
-    | 'JDictSelectTag'
-    | 'JSelectDept'
-    | 'JAreaSelect'
-    | 'JEditor'
-    | 'JMarkdownEditor'
-    | 'JSelectInput'
-    | 'JCodeEditor'
-    | 'JCategorySelect'
-    | 'JSelectMultiple'
-    | 'JPopup'
-    | 'JSwitch'
-    | 'JEasyCron'
-    | 'JTreeDict'
-    | 'JInputPop'
-    | 'JCheckbox'
-    | 'JInput'
-    | 'JTreeSelect'
-    | 'JEllipsis'
-    | 'JSelectUserByDept'
-    | 'JUpload'
-    | 'JSearchSelect'
-    | 'JAddInput'
-    | 'Time'
-    | 'JOnlineSelectCascade'
-    | 'JRangeNumber'
-  ;
+  | 'Input'
+  | 'InputGroup'
+  | 'InputPassword'
+  | 'InputSearch'
+  | 'InputTextArea'
+  | 'InputNumber'
+  | 'InputCountDown'
+  | 'Select'
+  | 'ApiSelect'
+  | 'TreeSelect'
+  | 'ApiTreeSelect'
+  | 'ApiRadioGroup'
+  | 'RadioButtonGroup'
+  | 'RadioGroup'
+  | 'Checkbox'
+  | 'CheckboxGroup'
+  | 'AutoComplete'
+  | 'Cascader'
+  | 'DatePicker'
+  | 'MonthPicker'
+  | 'RangePicker'
+  | 'WeekPicker'
+  | 'TimePicker'
+  | 'Switch'
+  | 'StrengthMeter'
+  | 'Upload'
+  | 'IconPicker'
+  | 'Render'
+  | 'Slider'
+  | 'Rate'
+  | 'Divider'
+  | 'JAreaLinkage'
+  | 'JSelectPosition'
+  | 'JSelectRole'
+  | 'JSelectUser'
+  | 'JImageUpload'
+  | 'JDictSelectTag'
+  | 'JSelectDept'
+  | 'JAreaSelect'
+  | 'JEditor'
+  | 'JMarkdownEditor'
+  | 'JSelectInput'
+  | 'JCodeEditor'
+  | 'JCategorySelect'
+  | 'JSelectMultiple'
+  | 'JPopup'
+  | 'JSwitch'
+  | 'JEasyCron'
+  | 'JTreeDict'
+  | 'JInputPop'
+  | 'JCheckbox'
+  | 'JInput'
+  | 'JTreeSelect'
+  | 'JEllipsis'
+  | 'JSelectUserByDept'
+  | 'JUpload'
+  | 'JSearchSelect'
+  | 'JAddInput'
+  | 'Time'
+  | 'JOnlineSelectCascade'
+  | 'JRangeNumber';
diff --git a/src/components/Form/src/utils/Area.ts b/src/components/Form/src/utils/Area.ts
index 109f38d..61de47e 100644
--- a/src/components/Form/src/utils/Area.ts
+++ b/src/components/Form/src/utils/Area.ts
@@ -1,97 +1,95 @@
-import REGION_DATA from 'china-area-data'
+import REGION_DATA from 'china-area-data';
 
 /**
  * Area 属性all的类型
  */
 interface PlainPca {
-  id:string,
-  text:string,
-  pid:string,
-  index:Number
+  id: string;
+  text: string;
+  pid: string;
+  index: Number;
 }
 
 /**
  * 省市区工具类 -解决列表省市区组件的翻译问题
  */
 class Area {
-  
   all: PlainPca[];
-  
+
   /**
    * 构造器
    * @param express
    */
   constructor(pcaa?) {
-    if(!pcaa){
+    if (!pcaa) {
       pcaa = REGION_DATA;
     }
-    let arr:PlainPca[] = []
-    const province = pcaa['86']
-    Object.keys(province).map(key=>{
-      arr.push({id:key, text:province[key], pid:'86', index:1});
+    let arr: PlainPca[] = [];
+    const province = pcaa['86'];
+    Object.keys(province).map((key) => {
+      arr.push({ id: key, text: province[key], pid: '86', index: 1 });
       const city = pcaa[key];
-      Object.keys(city).map(key2=>{
-        arr.push({id:key2, text:city[key2], pid:key, index:2});
+      Object.keys(city).map((key2) => {
+        arr.push({ id: key2, text: city[key2], pid: key, index: 2 });
         const qu = pcaa[key2];
-        if(qu){
-          Object.keys(qu).map(key3=>{
-            arr.push({id:key3, text:qu[key3], pid:key2, index:3});
-          })
+        if (qu) {
+          Object.keys(qu).map((key3) => {
+            arr.push({ id: key3, text: qu[key3], pid: key2, index: 3 });
+          });
         }
-      })
-    })
+      });
+    });
     this.all = arr;
   }
 
-  get pca(){
+  get pca() {
     return this.all;
   }
 
-  getCode(text){
-    if(!text || text.length==0){
-      return ''
+  getCode(text) {
+    if (!text || text.length == 0) {
+      return '';
     }
-    for(let item of this.all){
-      if(item.text === text){
+    for (let item of this.all) {
+      if (item.text === text) {
         return item.id;
       }
     }
   }
 
-  getText(code){
-    if(!code || code.length==0){
-      return ''
+  getText(code) {
+    if (!code || code.length == 0) {
+      return '';
     }
-    let arr = []
+    let arr = [];
     this.getAreaBycode(code, arr, 3);
-    return arr.join('/')
+    return arr.join('/');
   }
 
-  getRealCode(code){
-    let arr = []
-    this.getPcode(code, arr, 3)
+  getRealCode(code) {
+    let arr = [];
+    this.getPcode(code, arr, 3);
     return arr;
   }
 
-  getPcode(id, arr, index){
-    for(let item of this.all){
-      if(item.id === id && item.index == index){
-        arr.unshift(id)
-        if(item.pid != '86'){
-          this.getPcode(item.pid, arr, --index)
+  getPcode(id, arr, index) {
+    for (let item of this.all) {
+      if (item.id === id && item.index == index) {
+        arr.unshift(id);
+        if (item.pid != '86') {
+          this.getPcode(item.pid, arr, --index);
         }
       }
     }
   }
 
-  getAreaBycode(code, arr, index){
-    for(let item of this.all){
-      if(item.id === code && item.index == index){
+  getAreaBycode(code, arr, index) {
+    for (let item of this.all) {
+      if (item.id === code && item.index == index) {
         arr.unshift(item.text);
-        if(item.pid != '86'){
-          this.getAreaBycode(item.pid, arr, --index)
+        if (item.pid != '86') {
+          this.getAreaBycode(item.pid, arr, --index);
         }
-
       }
     }
   }
@@ -99,10 +97,8 @@ class Area {
 const jeecgAreaData = new Area();
 
 // 根据code找文本
-const getAreaTextByCode = function(code) {
-  return jeecgAreaData.getText(code)
-}
+const getAreaTextByCode = function (code) {
+  return jeecgAreaData.getText(code);
+};
 
-export {
-  getAreaTextByCode
-}
\ No newline at end of file
+export { getAreaTextByCode };
diff --git a/src/components/Form/src/utils/GroupRequest.ts b/src/components/Form/src/utils/GroupRequest.ts
index dbe382b..ce813df 100644
--- a/src/components/Form/src/utils/GroupRequest.ts
+++ b/src/components/Form/src/utils/GroupRequest.ts
@@ -8,22 +8,20 @@ import { getAuthCache, setAuthCache } from '/@/utils/auth';
  */
 export function httpGroupRequest(getPromise, groupId, expire = 1000 * 30) {
   if (groupId == null || groupId === '') {
-    console.log("--------popup----------getFrom  DB-------with---no--groupId ")
-    return getPromise()
+    console.log('--------popup----------getFrom  DB-------with---no--groupId ');
+    return getPromise();
   }
 
   if (getAuthCache(groupId)) {
-    console.log("---------popup--------getFrom  Cache--------groupId = " + groupId)
+    console.log('---------popup--------getFrom  Cache--------groupId = ' + groupId);
     return Promise.resolve(getAuthCache(groupId));
   } else {
-    console.log("--------popup----------getFrom  DB---------groupId = " + groupId)
+    console.log('--------popup----------getFrom  DB---------groupId = ' + groupId);
   }
 
   // 还没有发出请求，就发出第一次的请求
-  return getPromise().then(res => {
+  return getPromise().then((res) => {
     setAuthCache(groupId, res);
     return Promise.resolve(res);
-  })
+  });
 }
-
-
diff --git a/src/components/Form/src/utils/areaDataUtil.js b/src/components/Form/src/utils/areaDataUtil.js
index 9f73a58..14aa7ae 100644
--- a/src/components/Form/src/utils/areaDataUtil.js
+++ b/src/components/Form/src/utils/areaDataUtil.js
@@ -1,152 +1,152 @@
-import REGION_DATA from 'china-area-data'
-import {cloneDeep} from 'lodash-es'
+import REGION_DATA from 'china-area-data';
+import { cloneDeep } from 'lodash-es';
 
 // code转汉字大对象
-const CodeToText = {}
+const CodeToText = {};
 // 汉字转code大对象
-const TextToCode = {}
-const provinceObject = REGION_DATA['86'] // 省份对象
-const regionData = []
-let provinceAndCityData = []
+const TextToCode = {};
+const provinceObject = REGION_DATA['86']; // 省份对象
+const regionData = [];
+let provinceAndCityData = [];
 
-CodeToText[''] = '全部'
+CodeToText[''] = '全部';
 
 // 计算省
 for (const prop in provinceObject) {
-    regionData.push({
-        value: prop, // 省份code值
-        label: provinceObject[prop] // 省份汉字
-    })
-    CodeToText[prop] = provinceObject[prop]
-    TextToCode[provinceObject[prop]] = {
-        code: prop
-    }
-    TextToCode[provinceObject[prop]]['全部'] = {
-        code: ''
-    }
+  regionData.push({
+    value: prop, // 省份code值
+    label: provinceObject[prop], // 省份汉字
+  });
+  CodeToText[prop] = provinceObject[prop];
+  TextToCode[provinceObject[prop]] = {
+    code: prop,
+  };
+  TextToCode[provinceObject[prop]]['全部'] = {
+    code: '',
+  };
 }
 // 计算市
 for (let i = 0, len = regionData.length; i < len; i++) {
-    const provinceCode = regionData[i].value
-    const provinceText = regionData[i].label
-    const provinceChildren = []
-    for (const prop in REGION_DATA[provinceCode]) {
-        provinceChildren.push({
-            value: prop,
-            label: REGION_DATA[provinceCode][prop]
-        })
-        CodeToText[prop] = REGION_DATA[provinceCode][prop]
-        TextToCode[provinceText][REGION_DATA[provinceCode][prop]] = {
-            code: prop
-        }
-        TextToCode[provinceText][REGION_DATA[provinceCode][prop]]['全部'] = {
-            code: ''
-        }
-    }
-    if (provinceChildren.length) {
-        regionData[i].children = provinceChildren
-    }
+  const provinceCode = regionData[i].value;
+  const provinceText = regionData[i].label;
+  const provinceChildren = [];
+  for (const prop in REGION_DATA[provinceCode]) {
+    provinceChildren.push({
+      value: prop,
+      label: REGION_DATA[provinceCode][prop],
+    });
+    CodeToText[prop] = REGION_DATA[provinceCode][prop];
+    TextToCode[provinceText][REGION_DATA[provinceCode][prop]] = {
+      code: prop,
+    };
+    TextToCode[provinceText][REGION_DATA[provinceCode][prop]]['全部'] = {
+      code: '',
+    };
+  }
+  if (provinceChildren.length) {
+    regionData[i].children = provinceChildren;
+  }
 }
-provinceAndCityData = cloneDeep(regionData)
+provinceAndCityData = cloneDeep(regionData);
 
 // 计算区
 for (let i = 0, len = regionData.length; i < len; i++) {
-    const province = regionData[i].children
-    const provinceText = regionData[i].label
-    if (province) {
-        for (let j = 0, len = province.length; j < len; j++) {
-            const cityCode = province[j].value
-            const cityText = province[j].label
-            const cityChildren = []
-            for (const prop in REGION_DATA[cityCode]) {
-                cityChildren.push({
-                    value: prop,
-                    label: REGION_DATA[cityCode][prop]
-                })
-                CodeToText[prop] = REGION_DATA[cityCode][prop]
-                TextToCode[provinceText][cityText][REGION_DATA[cityCode][prop]] = {
-                    code: prop
-                }
-            }
-            if (cityChildren.length) {
-                province[j].children = cityChildren
-            }
-        }
+  const province = regionData[i].children;
+  const provinceText = regionData[i].label;
+  if (province) {
+    for (let j = 0, len = province.length; j < len; j++) {
+      const cityCode = province[j].value;
+      const cityText = province[j].label;
+      const cityChildren = [];
+      for (const prop in REGION_DATA[cityCode]) {
+        cityChildren.push({
+          value: prop,
+          label: REGION_DATA[cityCode][prop],
+        });
+        CodeToText[prop] = REGION_DATA[cityCode][prop];
+        TextToCode[provinceText][cityText][REGION_DATA[cityCode][prop]] = {
+          code: prop,
+        };
+      }
+      if (cityChildren.length) {
+        province[j].children = cityChildren;
+      }
     }
+  }
 }
 
 // 添加“全部”选项
-const provinceAndCityDataPlus = cloneDeep(provinceAndCityData)
+const provinceAndCityDataPlus = cloneDeep(provinceAndCityData);
 provinceAndCityDataPlus.unshift({
-    value: '',
-    label: '全部'
-})
+  value: '',
+  label: '全部',
+});
 for (let i = 0, len = provinceAndCityDataPlus.length; i < len; i++) {
-    const province = provinceAndCityDataPlus[i].children
-    if (province && province.length) {
-        province.unshift({
-            value: '',
-            label: '全部'
-        })
-        for (let j = 0, len = province.length; j < len; j++) {
-            const city = province[j].children
-            if (city && city.length) {
-                city.unshift({
-                    value: '',
-                    label: '全部'
-                })
-            }
-        }
+  const province = provinceAndCityDataPlus[i].children;
+  if (province && province.length) {
+    province.unshift({
+      value: '',
+      label: '全部',
+    });
+    for (let j = 0, len = province.length; j < len; j++) {
+      const city = province[j].children;
+      if (city && city.length) {
+        city.unshift({
+          value: '',
+          label: '全部',
+        });
+      }
     }
+  }
 }
 
-const regionDataPlus = cloneDeep(regionData)
+const regionDataPlus = cloneDeep(regionData);
 regionDataPlus.unshift({
-    value: '',
-    label: '全部'
-})
+  value: '',
+  label: '全部',
+});
 for (let i = 0, len = regionDataPlus.length; i < len; i++) {
-    const province = regionDataPlus[i].children
-    if (province && province.length) {
-        province.unshift({
-            value: '',
-            label: '全部'
-        })
+  const province = regionDataPlus[i].children;
+  if (province && province.length) {
+    province.unshift({
+      value: '',
+      label: '全部',
+    });
 
-        for (let j = 0, len = province.length; j < len; j++) {
-            const city = province[j].children
-            if (city && city.length) {
-                city.unshift({
-                    value: '',
-                    label: '全部'
-                })
-            }
-        }
+    for (let j = 0, len = province.length; j < len; j++) {
+      const city = province[j].children;
+      if (city && city.length) {
+        city.unshift({
+          value: '',
+          label: '全部',
+        });
+      }
     }
+  }
 }
 //--begin--@updateBy:liusq----date:20210922---for:省市区三级联动需求方法-----
 //省份数据
-const provinceOptions = []
+const provinceOptions = [];
 for (const prop in provinceObject) {
-    provinceOptions.push({
-        value: prop, // 省份code值
-        label: provinceObject[prop] // 省份汉字
-    })
+  provinceOptions.push({
+    value: prop, // 省份code值
+    label: provinceObject[prop], // 省份汉字
+  });
 }
 /**
  * 根据code获取下拉option的数据
  * @param code
  * @returns []
  */
-function getDataByCode(code){
-    let data=[];
-    for (const prop in REGION_DATA[code]) {
-        data.push({
-            value: prop, // 省份code值
-            label: REGION_DATA[code][prop] // 省份汉字
-        })
-    }
-    return data;
+function getDataByCode(code) {
+  let data = [];
+  for (const prop in REGION_DATA[code]) {
+    data.push({
+      value: prop, // 省份code值
+      label: REGION_DATA[code][prop], // 省份汉字
+    });
+  }
+  return data;
 }
 
 /**
@@ -154,18 +154,18 @@ function getDataByCode(code){
  * @type {Array}
  */
 const pca = [];
-Object.keys(provinceObject).map(province=>{
-    pca.push({id:province, text:provinceObject[province], pid:'86', index:1});
-    const cityObject = REGION_DATA[province];
-    Object.keys(cityObject).map(city=>{
-        pca.push({id:city, text:cityObject[city], pid:province, index:2});
-        const areaObject = REGION_DATA[city];
-        if(areaObject){
-            Object.keys(areaObject).map(area=>{
-                pca.push({id:area, text:areaObject[area], pid:city, index:3});
-            })
-        }
-    })
+Object.keys(provinceObject).map((province) => {
+  pca.push({ id: province, text: provinceObject[province], pid: '86', index: 1 });
+  const cityObject = REGION_DATA[province];
+  Object.keys(cityObject).map((city) => {
+    pca.push({ id: city, text: cityObject[city], pid: province, index: 2 });
+    const areaObject = REGION_DATA[city];
+    if (areaObject) {
+      Object.keys(areaObject).map((area) => {
+        pca.push({ id: area, text: areaObject[area], pid: city, index: 3 });
+      });
+    }
+  });
 });
 
 /**
@@ -174,20 +174,20 @@ Object.keys(provinceObject).map(province=>{
  * @param level
  * @returns {Array}
  */
-function getRealCode(code,level){
-    let arr = [];
-    getPcode(code, arr, level);
-    return arr;
+function getRealCode(code, level) {
+  let arr = [];
+  getPcode(code, arr, level);
+  return arr;
 }
-function getPcode(id, arr, index){
-    for(let item of pca){
-        if(item.id === id && item.index == index){
-            arr.unshift(id)
-            if(item.pid != '86'){
-                getPcode(item.pid, arr, --index)
-            }
-        }
+function getPcode(id, arr, index) {
+  for (let item of pca) {
+    if (item.id === id && item.index == index) {
+      arr.unshift(id);
+      if (item.pid != '86') {
+        getPcode(item.pid, arr, --index);
+      }
     }
+  }
 }
 //--end--@updateBy:liusq----date:20210922---for:省市区三级联动需求方法-----
-export {provinceAndCityData, regionData, provinceAndCityDataPlus, regionDataPlus,getDataByCode,provinceOptions,getRealCode}
+export { provinceAndCityData, regionData, provinceAndCityDataPlus, regionDataPlus, getDataByCode, provinceOptions, getRealCode };
diff --git a/src/components/Form/src/utils/formUtils.ts b/src/components/Form/src/utils/formUtils.ts
index 8b8f74c..9ad6f74 100644
--- a/src/components/Form/src/utils/formUtils.ts
+++ b/src/components/Form/src/utils/formUtils.ts
@@ -6,14 +6,14 @@ import { dateUtil } from '/@/utils/dateUtil';
  * @param props
  * @param values
  */
-export function handleRangeValue(props, values){
-    //判断是否配置并处理fieldMapToTime
-    const fieldMapToTime = unref(props)?.fieldMapToTime;
-    fieldMapToTime && (values = handleRangeTimeValue(props, values));
-    //判断是否配置并处理fieldMapToNumber
-    const fieldMapToNumber = unref(props)?.fieldMapToNumber;
-    fieldMapToNumber && (values =handleRangeNumberValue(props, values));
-    return values;
+export function handleRangeValue(props, values) {
+  //判断是否配置并处理fieldMapToTime
+  const fieldMapToTime = unref(props)?.fieldMapToTime;
+  fieldMapToTime && (values = handleRangeTimeValue(props, values));
+  //判断是否配置并处理fieldMapToNumber
+  const fieldMapToNumber = unref(props)?.fieldMapToNumber;
+  fieldMapToNumber && (values = handleRangeNumberValue(props, values));
+  return values;
 }
 /**
  * 处理时间转换成2个字段
@@ -31,9 +31,9 @@ export function handleRangeTimeValue(props, values) {
     }
 
     // 【issues/I53G9Y】 日期区间组件有可能是字符串
-    let timeValue = values[field]
+    let timeValue = values[field];
     if (!Array.isArray(timeValue)) {
-      timeValue = timeValue.split(',')
+      timeValue = timeValue.split(',');
     }
     const [startTime, endTime]: string[] = timeValue;
     values[startTimeKey] = dateUtil(startTime).format(format);
@@ -50,18 +50,18 @@ export function handleRangeTimeValue(props, values) {
  * @updateDate:2021-09-16
  */
 export function handleRangeNumberValue(props, values) {
-    const fieldMapToNumber = unref(props).fieldMapToNumber;
-    if (!fieldMapToNumber || !Array.isArray(fieldMapToNumber)) {
-        return values;
-    }
-    for (const [field, [startNumberKey, endNumberKey]] of fieldMapToNumber) {
-        if (!field || !startNumberKey || !endNumberKey || !values[field]) {
-            continue;
-        }
-        const [startNumber, endNumber]: number[] = values[field];
-        values[startNumberKey] = startNumber;
-        values[endNumberKey] = endNumber;
-        Reflect.deleteProperty(values, field);
-    }
+  const fieldMapToNumber = unref(props).fieldMapToNumber;
+  if (!fieldMapToNumber || !Array.isArray(fieldMapToNumber)) {
     return values;
+  }
+  for (const [field, [startNumberKey, endNumberKey]] of fieldMapToNumber) {
+    if (!field || !startNumberKey || !endNumberKey || !values[field]) {
+      continue;
+    }
+    const [startNumber, endNumber]: number[] = values[field];
+    values[startNumberKey] = startNumber;
+    values[endNumberKey] = endNumber;
+    Reflect.deleteProperty(values, field);
+  }
+  return values;
 }
diff --git a/src/components/Icon/src/Icon.vue b/src/components/Icon/src/Icon.vue
index 4956cf0..d6b1349 100644
--- a/src/components/Icon/src/Icon.vue
+++ b/src/components/Icon/src/Icon.vue
@@ -1,30 +1,10 @@
 <template>
-  <SvgIcon
-    :size="size"
-    :name="getSvgIcon"
-    v-if="isSvgIcon"
-    :class="[$attrs.class, 'anticon']"
-    :spin="spin"
-  />
-  <span
-    v-else
-    ref="elRef"
-    :class="[$attrs.class, 'app-iconify anticon', spin && 'app-iconify-spin']"
-    :style="getWrapStyle"
-  ></span>
+  <SvgIcon :size="size" :name="getSvgIcon" v-if="isSvgIcon" :class="[$attrs.class, 'anticon']" :spin="spin" />
+  <span v-else ref="elRef" :class="[$attrs.class, 'app-iconify anticon', spin && 'app-iconify-spin']" :style="getWrapStyle"></span>
 </template>
 <script lang="ts">
   import type { PropType } from 'vue';
-  import {
-    defineComponent,
-    ref,
-    watch,
-    onMounted,
-    nextTick,
-    unref,
-    computed,
-    CSSProperties,
-  } from 'vue';
+  import { defineComponent, ref, watch, onMounted, nextTick, unref, computed, CSSProperties } from 'vue';
   import SvgIcon from './SvgIcon.vue';
   import Iconify from '@purge-icons/generated';
   import { isString } from '/@/utils/is';
diff --git a/src/components/Icon/src/IconPicker.vue b/src/components/Icon/src/IconPicker.vue
index 4799b10..1afbaff 100644
--- a/src/components/Icon/src/IconPicker.vue
+++ b/src/components/Icon/src/IconPicker.vue
@@ -1,25 +1,10 @@
 <template>
-  <a-input
-          disabled
-          :style="{ width }"
-          :placeholder="t('component.icon.placeholder')"
-          :class="prefixCls"
-          v-model:value="currentSelect"
-  >
+  <a-input disabled :style="{ width }" :placeholder="t('component.icon.placeholder')" :class="prefixCls" v-model:value="currentSelect">
     <template #addonAfter>
-      <a-popover
-              placement="bottomLeft"
-              trigger="click"
-              v-model="visible"
-              :overlayClassName="`${prefixCls}-popover`"
-      >
+      <a-popover placement="bottomLeft" trigger="click" v-model="visible" :overlayClassName="`${prefixCls}-popover`">
         <template #title>
           <div class="flex justify-between">
-            <a-input
-                    :placeholder="t('component.icon.search')"
-                    @change="debounceHandleSearchChange"
-                    allowClear
-            />
+            <a-input :placeholder="t('component.icon.search')" @change="debounceHandleSearchChange" allowClear />
           </div>
         </template>
 
@@ -28,23 +13,12 @@
             <ScrollContainer class="border border-solid border-t-0">
               <ul class="flex flex-wrap px-2">
                 <li
-                        v-for="icon in getPaginationList"
-                        :key="icon"
-                        :class="currentSelect === icon ? 'border border-primary' : ''"
-                        class="
-                    p-2
-                    w-1/8
-                    cursor-pointer
-                    mr-1
-                    mt-1
-                    flex
-                    justify-center
-                    items-center
-                    border border-solid
-                    hover:border-primary
-                  "
-                        @click="handleClick(icon)"
-                        :title="icon"
+                  v-for="icon in getPaginationList"
+                  :key="icon"
+                  :class="currentSelect === icon ? 'border border-primary' : ''"
+                  class="p-2 w-1/8 cursor-pointer mr-1 mt-1 flex justify-center items-center border border-solid hover:border-primary"
+                  @click="handleClick(icon)"
+                  :title="icon"
                 >
                   <!-- <Icon :icon="icon" :prefix="prefix" /> -->
                   <SvgIcon v-if="isSvgMode" :name="icon" />
@@ -53,17 +27,11 @@
               </ul>
             </ScrollContainer>
             <div class="flex py-2 items-center justify-center" v-if="getTotal >= pageSize">
-              <a-pagination
-                      showLessItems
-                      size="small"
-                      :pageSize="pageSize"
-                      :total="getTotal"
-                      @change="handlePageChange"
-              />
+              <a-pagination showLessItems size="small" :pageSize="pageSize" :total="getTotal" @change="handlePageChange" />
             </div>
           </div>
           <template v-else
-          ><div class="p-5"><a-empty /></div>
+            ><div class="p-5"><a-empty /></div>
           </template>
         </template>
 
@@ -138,10 +106,7 @@
   const { clipboardRef, isSuccessRef } = useCopyToClipboard(props.value);
   const { createMessage } = useMessage();
 
-  const { getPaginationList, getTotal, setCurrentPage } = usePagination(
-    currentList,
-    props.pageSize,
-  );
+  const { getPaginationList, getTotal, setCurrentPage } = usePagination(currentList, props.pageSize);
 
   watchEffect(() => {
     currentSelect.value = props.value;
@@ -152,7 +117,7 @@
     (v) => {
       emit('update:value', v);
       return emit('change', v);
-    },
+    }
   );
 
   function handlePageChange(page: number) {
diff --git a/src/components/Icon/src/SvgIcon.vue b/src/components/Icon/src/SvgIcon.vue
index 2afa4de..20bfcca 100644
--- a/src/components/Icon/src/SvgIcon.vue
+++ b/src/components/Icon/src/SvgIcon.vue
@@ -1,9 +1,5 @@
 <template>
-  <svg
-    :class="[prefixCls, $attrs.class, spin && 'svg-icon-spin']"
-    :style="getStyle"
-    aria-hidden="true"
-  >
+  <svg :class="[prefixCls, $attrs.class, spin && 'svg-icon-spin']" :style="getStyle" aria-hidden="true">
     <use :xlink:href="symbolId" />
   </svg>
 </template>
diff --git a/src/components/JVxeCustom/index.ts b/src/components/JVxeCustom/index.ts
index b6439bd..d875d64 100644
--- a/src/components/JVxeCustom/index.ts
+++ b/src/components/JVxeCustom/index.ts
@@ -1,27 +1,25 @@
-import { registerComponent, registerAsyncComponent } from '/@/components/jeecg/JVxeTable'
-import { JVxeTypes } from '/@/components/jeecg/JVxeTable/types'
-import { DictSearchSpanCell, DictSearchInputCell } from './src/components/JVxeSelectDictSearchCell'
+import { registerComponent, registerAsyncComponent } from '/@/components/jeecg/JVxeTable';
+import { JVxeTypes } from '/@/components/jeecg/JVxeTable/types';
+import { DictSearchSpanCell, DictSearchInputCell } from './src/components/JVxeSelectDictSearchCell';
 
 export async function registerJVxeCustom() {
-
   // ----------------- ⚠ 注意事项 ⚠ -----------------
   //  当组件内包含 BasicModal 时，必须使用异步引入！
   //  否则将会导致 i18n 失效！
   // ----------------- ⚠ 注意事项 ⚠ -----------------
 
   // 注册【Popup】（普通封装方式）
-  await registerAsyncComponent(JVxeTypes.popup, import ('./src/components/JVxePopupCell.vue'))
+  await registerAsyncComponent(JVxeTypes.popup, import('./src/components/JVxePopupCell.vue'));
 
   // 注册【字典搜索下拉】组件（高级封装方式）
-  registerComponent(JVxeTypes.selectDictSearch, DictSearchInputCell, DictSearchSpanCell)
+  registerComponent(JVxeTypes.selectDictSearch, DictSearchInputCell, DictSearchSpanCell);
 
   // 注册【文件上传】组件
-  await registerAsyncComponent(JVxeTypes.file, import ('./src/components/JVxeFileCell.vue'))
+  await registerAsyncComponent(JVxeTypes.file, import('./src/components/JVxeFileCell.vue'));
   // 注册【图片上传】组件
-  await registerAsyncComponent(JVxeTypes.image, import ('./src/components/JVxeImageCell.vue'))
+  await registerAsyncComponent(JVxeTypes.image, import('./src/components/JVxeImageCell.vue'));
   // 注册【用户选择】组件
-  await registerAsyncComponent(JVxeTypes.userSelect, import ('./src/components/JVxeUserSelectCell.vue'))
+  await registerAsyncComponent(JVxeTypes.userSelect, import('./src/components/JVxeUserSelectCell.vue'));
   // 注册【部门选择】组件
-  await registerAsyncComponent(JVxeTypes.departSelect, import ('./src/components/JVxeDepartSelectCell.vue'))
-
+  await registerAsyncComponent(JVxeTypes.departSelect, import('./src/components/JVxeDepartSelectCell.vue'));
 }
diff --git a/src/components/JVxeCustom/src/components/JVxeDepartSelectCell.vue b/src/components/JVxeCustom/src/components/JVxeDepartSelectCell.vue
index 02bf5d5..b919b07 100644
--- a/src/components/JVxeCustom/src/components/JVxeDepartSelectCell.vue
+++ b/src/components/JVxeCustom/src/components/JVxeDepartSelectCell.vue
@@ -23,180 +23,172 @@
   <!--      <a-icon style="margin-left:5px;vertical-align: middle" type="close-circle" @click="handleEmpty" title="清空"/>-->
   <!--    </span>-->
   <!--  </div>-->
-  <JSelectDept
-      :value="selectedValue"
-      :showButton="false"
-      v-bind="cellProps"
-      @change="handleChange"
-  />
+  <JSelectDept :value="selectedValue" :showButton="false" v-bind="cellProps" @change="handleChange" />
 </template>
 
 <script lang="ts">
-import { computed, defineComponent } from 'vue'
-import { JSelectDept } from '/@/components/Form'
-import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types'
-import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
+  import { computed, defineComponent } from 'vue';
+  import { JSelectDept } from '/@/components/Form';
+  import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types';
+  import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
 
-// import { isArray, isEmpty, isString } from '/@/utils/is'
+  // import { isArray, isEmpty, isString } from '/@/utils/is'
 
-// import JSelectDepartModal from '@/components/jeecgbiz/modal/JSelectDepartModal'
-import { dispatchEvent } from '/@/components/jeecg/JVxeTable/utils'
-import { isArray, isEmpty, isString } from '/@/utils/is'
+  // import JSelectDepartModal from '@/components/jeecgbiz/modal/JSelectDepartModal'
+  import { dispatchEvent } from '/@/components/jeecg/JVxeTable/utils';
+  import { isArray, isEmpty, isString } from '/@/utils/is';
 
+  export default defineComponent({
+    name: 'JVxeDepartSelectCell',
+    components: { JSelectDept },
+    props: useJVxeCompProps(),
+    setup(props: JVxeComponent.Props) {
+      const { innerValue, cellProps, handleChangeCommon } = useJVxeComponent(props);
 
-export default defineComponent({
-  name: 'JVxeDepartSelectCell',
-  components: { JSelectDept },
-  props: useJVxeCompProps(),
-  setup(props: JVxeComponent.Props) {
-    const { innerValue, cellProps, handleChangeCommon } = useJVxeComponent(props)
+      // const selectedValue = computed(() => {
+      //   let val: any = innerValue.value
+      //   if (isEmpty(val)) {
+      //     return []
+      //   }
+      //   if (isArray(val)) {
+      //     return val
+      //   }
+      //   if (isString(val)) {
+      //     // @ts-ignore
+      //     return val.split(',')
+      //   }
+      //   return [val]
+      // })
 
-    // const selectedValue = computed(() => {
-    //   let val: any = innerValue.value
-    //   if (isEmpty(val)) {
-    //     return []
-    //   }
-    //   if (isArray(val)) {
-    //     return val
-    //   }
-    //   if (isString(val)) {
-    //     // @ts-ignore
-    //     return val.split(',')
-    //   }
-    //   return [val]
-    // })
+      const selectedValue = computed(() => {
+        let val = innerValue.value;
+        if (isEmpty(val)) {
+          return '';
+        }
+        if (isArray(val)) {
+          return (<any>val).join(',');
+        }
+        return val;
+      });
 
-    const selectedValue = computed(() => {
-      let val = innerValue.value
-      if (isEmpty(val)) {
-        return ''
+      const multiple = computed(() => cellProps.value['multi'] != false);
+
+      function handleChange(values) {
+        handleChangeCommon(values.join(','));
       }
-      if (isArray(val)) {
-        return (<any>val).join(',')
-      }
-      return val
-    })
 
-
-    const multiple = computed(() => cellProps.value['multi'] != false)
-
-    function handleChange(values) {
-      handleChangeCommon(values.join(','))
-    }
-
-    return {
-      selectedValue,
-      multiple,
-      cellProps,
-      handleChange,
-    }
-  },
-
-  data() {
-    return {
-      // departNames: '',
-      // departIds: '',
-      // selectedOptions: [],
-      // customReturnField: 'id',
-    }
-  },
-  computed: {
-    // custProps() {
-    //   const { departIds, originColumn: col, caseId, cellProps } = this
-    //   return {
-    //     ...cellProps,
-    //     value: departIds,
-    //     field: col.field || col.key,
-    //     groupId: caseId,
-    //     class: 'jvxe-select',
-    //   }
-    // },
-    // componentDisabled() {
-    //   if (this.cellProps.disabled == true) {
-    //     return true
-    //   }
-    //   return false
-    // },
-    // modalWidth() {
-    //   if (this.cellProps.modalWidth) {
-    //     return this.cellProps.modalWidth
-    //   } else {
-    //     return 500
-    //   }
-    // },
-    // multi() {
-    //   if (this.cellProps.multi == false) {
-    //     return false
-    //   } else {
-    //     return true
-    //   }
-    // },
-    // rootOpened() {
-    //   if (this.cellProps.open == false) {
-    //     return false
-    //   } else {
-    //     return true
-    //   }
-    // },
-  },
-  watch: {
-    // innerValue: {
-    //   immediate: true,
-    //   handler(val) {
-    //     if (val == null || val === '') {
-    //       this.departIds = ''
-    //     } else {
-    //       this.departIds = val
-    //     }
-    //   },
-    // },
-  },
-  methods: {
-    // openSelect() {
-    //   this.$refs.innerDepartSelectModal.show()
-    // },
-    // handleEmpty() {
-    //   this.handleOK('')
-    // },
-    // handleOK(rows, idstr) {
-    //   let value = ''
-    //   if (!rows && rows.length <= 0) {
-    //     this.departNames = ''
-    //     this.departIds = ''
-    //   } else {
-    //     value = rows.map(row => row[this.customReturnField]).join(',')
-    //     this.departNames = rows.map(row => row['departName']).join(',')
-    //     this.departIds = idstr
-    //   }
-    //   this.handleChangeCommon(this.departIds)
-    // },
-    // initComp(departNames) {
-    //   this.departNames = departNames
-    // },
-    // handleChange(value) {
-    //   this.handleChangeCommon(value)
-    // },
-  },
-  enhanced: {
-    switches: {
-      visible: true,
+      return {
+        selectedValue,
+        multiple,
+        cellProps,
+        handleChange,
+      };
     },
-    translate: {
-      enabled: false,
+
+    data() {
+      return {
+        // departNames: '',
+        // departIds: '',
+        // selectedOptions: [],
+        // customReturnField: 'id',
+      };
     },
-    aopEvents: {
-      editActived({ $event }) {
-        dispatchEvent({
-          $event,
-          props: this.props,
-          className: '.ant-select .ant-select-selection-search-input',
-          isClick: true,
-        })
+    computed: {
+      // custProps() {
+      //   const { departIds, originColumn: col, caseId, cellProps } = this
+      //   return {
+      //     ...cellProps,
+      //     value: departIds,
+      //     field: col.field || col.key,
+      //     groupId: caseId,
+      //     class: 'jvxe-select',
+      //   }
+      // },
+      // componentDisabled() {
+      //   if (this.cellProps.disabled == true) {
+      //     return true
+      //   }
+      //   return false
+      // },
+      // modalWidth() {
+      //   if (this.cellProps.modalWidth) {
+      //     return this.cellProps.modalWidth
+      //   } else {
+      //     return 500
+      //   }
+      // },
+      // multi() {
+      //   if (this.cellProps.multi == false) {
+      //     return false
+      //   } else {
+      //     return true
+      //   }
+      // },
+      // rootOpened() {
+      //   if (this.cellProps.open == false) {
+      //     return false
+      //   } else {
+      //     return true
+      //   }
+      // },
+    },
+    watch: {
+      // innerValue: {
+      //   immediate: true,
+      //   handler(val) {
+      //     if (val == null || val === '') {
+      //       this.departIds = ''
+      //     } else {
+      //       this.departIds = val
+      //     }
+      //   },
+      // },
+    },
+    methods: {
+      // openSelect() {
+      //   this.$refs.innerDepartSelectModal.show()
+      // },
+      // handleEmpty() {
+      //   this.handleOK('')
+      // },
+      // handleOK(rows, idstr) {
+      //   let value = ''
+      //   if (!rows && rows.length <= 0) {
+      //     this.departNames = ''
+      //     this.departIds = ''
+      //   } else {
+      //     value = rows.map(row => row[this.customReturnField]).join(',')
+      //     this.departNames = rows.map(row => row['departName']).join(',')
+      //     this.departIds = idstr
+      //   }
+      //   this.handleChangeCommon(this.departIds)
+      // },
+      // initComp(departNames) {
+      //   this.departNames = departNames
+      // },
+      // handleChange(value) {
+      //   this.handleChangeCommon(value)
+      // },
+    },
+    enhanced: {
+      switches: {
+        visible: true,
       },
-    },
-  } as JVxeComponent.EnhancedPartial,
-})
+      translate: {
+        enabled: false,
+      },
+      aopEvents: {
+        editActived({ $event }) {
+          dispatchEvent({
+            $event,
+            props: this.props,
+            className: '.ant-select .ant-select-selection-search-input',
+            isClick: true,
+          });
+        },
+      },
+    } as JVxeComponent.EnhancedPartial,
+  });
 </script>
 
-<style scoped>
-</style>
+<style scoped></style>
diff --git a/src/components/JVxeCustom/src/components/JVxeFileCell.vue b/src/components/JVxeCustom/src/components/JVxeFileCell.vue
index 87babbd..c27602e 100644
--- a/src/components/JVxeCustom/src/components/JVxeFileCell.vue
+++ b/src/components/JVxeCustom/src/components/JVxeFileCell.vue
@@ -1,39 +1,36 @@
 <template>
   <div>
     <template v-if="hasFile" v-for="(file, fileKey) of [innerFile || {}]" :key="fileKey">
-      <div style="position: relative;">
-        <a-tooltip v-if="file.status==='uploading'" :title="`上传中(${Math.floor(file.percent)}%)`">
-          <LoadingOutlined/>
-          <span style="margin-left:5px">上传中…</span>
+      <div style="position: relative">
+        <a-tooltip v-if="file.status === 'uploading'" :title="`上传中(${Math.floor(file.percent)}%)`">
+          <LoadingOutlined />
+          <span style="margin-left: 5px">上传中…</span>
         </a-tooltip>
 
-        <a-tooltip v-else-if="file.status==='done'" :title="file.name">
-          <Icon icon="ant-design:paper-clip"/>
-          <span style="margin-left:5px">{{ ellipsisFileName }}</span>
+        <a-tooltip v-else-if="file.status === 'done'" :title="file.name">
+          <Icon icon="ant-design:paper-clip" />
+          <span style="margin-left: 5px">{{ ellipsisFileName }}</span>
         </a-tooltip>
 
-        <a-tooltip v-else :title="file.message||'上传失败'">
-          <Icon icon="ant-design:exclamation-circle" style="color:red;"/>
-          <span style="margin-left:5px">{{ ellipsisFileName }}</span>
+        <a-tooltip v-else :title="file.message || '上传失败'">
+          <Icon icon="ant-design:exclamation-circle" style="color: red" />
+          <span style="margin-left: 5px">{{ ellipsisFileName }}</span>
         </a-tooltip>
 
-        <Dropdown :trigger="['click']" placement="bottomRight" style="margin-left: 10px;">
+        <Dropdown :trigger="['click']" placement="bottomRight" style="margin-left: 10px">
           <a-tooltip title="操作">
-            <Icon
-                v-if="file.status!=='uploading'"
-                icon="ant-design:setting"
-                style="cursor: pointer;"/>
+            <Icon v-if="file.status !== 'uploading'" icon="ant-design:setting" style="cursor: pointer" />
           </a-tooltip>
           <template #overlay>
             <a-menu>
               <a-menu-item v-if="originColumn.allowDownload !== false" @click="handleClickDownloadFile">
-                <span><Icon icon="ant-design:download"/>&nbsp;下载</span>
+                <span><Icon icon="ant-design:download" />&nbsp;下载</span>
               </a-menu-item>
               <a-menu-item v-if="originColumn.allowRemove !== false" @click="handleClickDeleteFile">
-                <span><Icon icon="ant-design:delete"/>&nbsp;删除</span>
+                <span><Icon icon="ant-design:delete" />&nbsp;删除</span>
               </a-menu-item>
               <a-menu-item @click="handleMoreOperation">
-                <span><Icon icon="ant-design:bars"/>&nbsp;更多</span>
+                <span><Icon icon="ant-design:bars" />&nbsp;更多</span>
               </a-menu-item>
             </a-menu>
           </template>
@@ -42,40 +39,39 @@
     </template>
 
     <a-upload
-        v-show="!hasFile"
-        name="file"
-        :data="{'isup': 1}"
-        :multiple="false"
-        :action="uploadAction"
-        :headers="uploadHeaders"
-        :showUploadList="false"
-        v-bind="cellProps"
-        @change="handleChangeUpload"
+      v-show="!hasFile"
+      name="file"
+      :data="{ isup: 1 }"
+      :multiple="false"
+      :action="uploadAction"
+      :headers="uploadHeaders"
+      :showUploadList="false"
+      v-bind="cellProps"
+      @change="handleChangeUpload"
     >
       <a-button preIcon="ant-design:upload">{{ originColumn.btnText || '点击上传' }}</a-button>
     </a-upload>
-    <JUploadModal :value="modalValue" @register="registerModel" @change="onModalChange"/>
+    <JUploadModal :value="modalValue" @register="registerModel" @change="onModalChange" />
   </div>
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue'
-import { UploadTypeEnum } from '/@/components/Form/src/jeecg/components/JUpload'
-import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types'
-import { useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
-import { useFileCell, enhanced, components } from '../hooks/useFileCell'
+  import { defineComponent } from 'vue';
+  import { UploadTypeEnum } from '/@/components/Form/src/jeecg/components/JUpload';
+  import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types';
+  import { useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
+  import { useFileCell, enhanced, components } from '../hooks/useFileCell';
 
-export default defineComponent({
-  name: 'JVxeFileCell',
-  components: components,
-  props: useJVxeCompProps(),
-  setup(props: JVxeComponent.Props) {
-    return useFileCell(props, UploadTypeEnum.file)
-  },
-  // 【组件增强】注释详见：JVxeComponent.Enhanced
-  enhanced: enhanced,
-})
+  export default defineComponent({
+    name: 'JVxeFileCell',
+    components: components,
+    props: useJVxeCompProps(),
+    setup(props: JVxeComponent.Props) {
+      return useFileCell(props, UploadTypeEnum.file);
+    },
+    // 【组件增强】注释详见：JVxeComponent.Enhanced
+    enhanced: enhanced,
+  });
 </script>
 
-<style scoped lang="less">
-</style>
+<style scoped lang="less"></style>
diff --git a/src/components/JVxeCustom/src/components/JVxeImageCell.vue b/src/components/JVxeCustom/src/components/JVxeImageCell.vue
index 96e0305..f026d84 100644
--- a/src/components/JVxeCustom/src/components/JVxeImageCell.vue
+++ b/src/components/JVxeCustom/src/components/JVxeImageCell.vue
@@ -3,126 +3,117 @@
     <template v-if="hasFile" v-for="(file, fileKey) of [innerFile || {}]" :key="fileKey">
       <div class="j-vxe-image-list">
         <template v-if="!file || !(file['url'] || file['path'] || file['message'])">
-          <a-tooltip :title="'请稍后: ' + JSON.stringify (file) + ((file['url'] || file['path'] || file['message']))">
-            <LoadingOutlined/>
+          <a-tooltip :title="'请稍后: ' + JSON.stringify(file) + (file['url'] || file['path'] || file['message'])">
+            <LoadingOutlined />
           </a-tooltip>
         </template>
         <template v-else-if="file['path']">
           <template v-for="src of imgList">
-            <img class="j-vxe-image" :src="src" alt="图片错误" @click="handleMoreOperation"/>
+            <img class="j-vxe-image" :src="src" alt="图片错误" @click="handleMoreOperation" />
           </template>
         </template>
-        <a-tooltip v-else :title="file.message||'上传失败'" @click="handleClickShowImageError">
-          <Icon icon="ant-design:exclamation-circle" style="color:red;"/>
+        <a-tooltip v-else :title="file.message || '上传失败'" @click="handleClickShowImageError">
+          <Icon icon="ant-design:exclamation-circle" style="color: red" />
         </a-tooltip>
       </div>
     </template>
     <div class="j-vxe-image-upload">
-      <a-upload
-          name="file"
-          :data="{'isup': 1}"
-          :multiple="false"
-          :action="uploadAction"
-          :headers="uploadHeaders"
-          :showUploadList="false"
-          v-bind="cellProps"
-          @change="handleChangeUpload"
-      >
+      <a-upload name="file" :data="{ isup: 1 }" :multiple="false" :action="uploadAction" :headers="uploadHeaders" :showUploadList="false" v-bind="cellProps" @change="handleChangeUpload">
         <a-button v-if="!hasFile" preIcon="ant-design:upload">{{ originColumn.btnText || '上传图片' }}</a-button>
         <div v-if="hasFile && imgList.length < maxCount" class="j-vxe-plus" @click="">
-          <Icon icon="ant-design:plus"/>
+          <Icon icon="ant-design:plus" />
         </div>
       </a-upload>
     </div>
-    <JUploadModal :value="modalValue" @register="registerModel" @change="onModalChange"/>
+    <JUploadModal :value="modalValue" @register="registerModel" @change="onModalChange" />
   </div>
 </template>
 <script lang="ts">
-import { computed, defineComponent } from 'vue'
-import { useMessage } from '/@/hooks/web/useMessage'
-import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types'
-import { useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
-import { UploadTypeEnum } from '/@/components/Form/src/jeecg/components/JUpload'
-import { getFileAccessHttpUrl } from '/@/utils/common/compUtils'
-import { components, enhanced, useFileCell } from '../hooks/useFileCell'
+  import { computed, defineComponent } from 'vue';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types';
+  import { useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
+  import { UploadTypeEnum } from '/@/components/Form/src/jeecg/components/JUpload';
+  import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
+  import { components, enhanced, useFileCell } from '../hooks/useFileCell';
 
-export default defineComponent({
-  name: 'JVxeImageCell',
-  components: components,
-  props: useJVxeCompProps(),
-  setup(props: JVxeComponent.Props) {
-    const { createErrorModal } = useMessage()
-    const setup = useFileCell(props, UploadTypeEnum.image, { multiple: true })
-    const { innerFile, maxCount } = setup
+  export default defineComponent({
+    name: 'JVxeImageCell',
+    components: components,
+    props: useJVxeCompProps(),
+    setup(props: JVxeComponent.Props) {
+      const { createErrorModal } = useMessage();
+      const setup = useFileCell(props, UploadTypeEnum.image, { multiple: true });
+      const { innerFile, maxCount } = setup;
 
-    const imgList = computed(() => {
-      if (innerFile.value) {
-        if (innerFile.value['url']) {
-          return [innerFile.value['url']]
-        } else if (innerFile.value['path']) {
-          let paths = innerFile.value['path'].split(',')
-          return paths.map(p => getFileAccessHttpUrl(p))
+      const imgList = computed(() => {
+        if (innerFile.value) {
+          if (innerFile.value['url']) {
+            return [innerFile.value['url']];
+          } else if (innerFile.value['path']) {
+            let paths = innerFile.value['path'].split(',');
+            return paths.map((p) => getFileAccessHttpUrl(p));
+          }
+        }
+        return [];
+      });
+
+      // 弹出上传出错详细信息
+      function handleClickShowImageError() {
+        let file = innerFile.value || null;
+        if (file && file['message']) {
+          createErrorModal({
+            title: '上传出错',
+            content: '错误信息：' + file['message'],
+            maskClosable: true,
+          });
         }
       }
-      return []
-    })
 
-    // 弹出上传出错详细信息
-    function handleClickShowImageError() {
-      let file = innerFile.value || null
-      if (file && file['message']) {
-        createErrorModal({
-          title: '上传出错',
-          content: '错误信息：' + file['message'],
-          maskClosable: true,
-        })
-      }
-    }
-
-    return {
-      ...setup,
-      imgList,
-      maxCount,
-      handleClickShowImageError,
-    }
-  },
-  // 【组件增强】注释详见：JVxeComponent.Enhanced
-  enhanced: enhanced,
-})
+      return {
+        ...setup,
+        imgList,
+        maxCount,
+        handleClickShowImageError,
+      };
+    },
+    // 【组件增强】注释详见：JVxeComponent.Enhanced
+    enhanced: enhanced,
+  });
 </script>
 
 <style scoped lang="less">
-.j-vxe-image {
-  height: 32px;
-  max-width: 100px !important;
-  cursor: pointer;
-  display: inline-block;
-  margin-right: 4px;
-  vertical-align: top;
+  .j-vxe-image {
+    height: 32px;
+    max-width: 100px !important;
+    cursor: pointer;
+    display: inline-block;
+    margin-right: 4px;
+    vertical-align: top;
 
-  &:hover {
-    opacity: 0.8;
+    &:hover {
+      opacity: 0.8;
+    }
+
+    &:active {
+      opacity: 0.6;
+    }
   }
 
-  &:active {
-    opacity: 0.6;
+  .j-vxe-plus {
+    width: 32px;
+    height: 32px;
+    line-height: 32px;
+    text-align: center;
+    background-color: #fafafa;
+    border: 1px dashed #d9d9d9;
+    border-radius: 2px;
+    cursor: pointer;
   }
-}
 
-.j-vxe-plus {
-  width: 32px;
-  height: 32px;
-  line-height: 32px;
-  text-align: center;
-  background-color: #fafafa;
-  border: 1px dashed #d9d9d9;
-  border-radius: 2px;
-  cursor: pointer;
-}
-
-.j-vxe-image-list,
-.j-vxe-image-upload {
-  display: inline-block;
-  vertical-align: top;
-}
+  .j-vxe-image-list,
+  .j-vxe-image-upload {
+    display: inline-block;
+    vertical-align: top;
+  }
 </style>
diff --git a/src/components/JVxeCustom/src/components/JVxePopupCell.vue b/src/components/JVxeCustom/src/components/JVxePopupCell.vue
index cbdc936..e3144fd 100644
--- a/src/components/JVxeCustom/src/components/JVxePopupCell.vue
+++ b/src/components/JVxeCustom/src/components/JVxePopupCell.vue
@@ -1,73 +1,67 @@
 <template>
-  <JPopup v-bind="popupProps"/>
+  <JPopup v-bind="popupProps" />
 </template>
 <script lang="ts">
-import { computed, defineComponent } from 'vue'
-import { JPopup } from '/@/components/Form'
-import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types'
-import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
-import { dispatchEvent, vModel } from '/@/components/jeecg/JVxeTable/utils'
-import { isEmpty } from '/@/utils/is'
+  import { computed, defineComponent } from 'vue';
+  import { JPopup } from '/@/components/Form';
+  import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types';
+  import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
+  import { dispatchEvent, vModel } from '/@/components/jeecg/JVxeTable/utils';
+  import { isEmpty } from '/@/utils/is';
 
-export default defineComponent({
-  name: 'JVxePopupCell',
-  components: { JPopup },
-  props: useJVxeCompProps(),
-  setup(props: JVxeComponent.Props) {
-    const {
-      innerValue,
-      row,
-      originColumn,
-      cellProps,
-      handleChangeCommon,
-    } = useJVxeComponent(props)
+  export default defineComponent({
+    name: 'JVxePopupCell',
+    components: { JPopup },
+    props: useJVxeCompProps(),
+    setup(props: JVxeComponent.Props) {
+      const { innerValue, row, originColumn, cellProps, handleChangeCommon } = useJVxeComponent(props);
+
+      const popupProps = computed(() => {
+        return {
+          ...cellProps,
+          value: innerValue.value,
+          field: originColumn.value.field || originColumn.value.key,
+          code: originColumn.value.popupCode,
+          fieldConfig: originColumn.value.fieldConfig,
+          // orgFields: originColumn.value.orgFields,
+          // destFields: originColumn.value.destFields,
+          groupId: 'j-vxe-popup',
+          param: originColumn.value.params,
+          sorter: originColumn.value.sorter,
+          setFieldsValue: (values) => {
+            if (!isEmpty(values)) {
+              let popupValue = '';
+              Object.keys(values).forEach((key) => {
+                let currentValue = values[key];
+                // 当前列直接赋值，其他列通过vModel赋值
+                if (key === originColumn.value.key) {
+                  popupValue = currentValue;
+                } else {
+                  vModel(currentValue, row, key);
+                }
+              });
+              handleChangeCommon(popupValue);
+            }
+          },
+        };
+      });
 
-    const popupProps = computed(() => {
       return {
-        ...cellProps,
-        value: innerValue.value,
-        field: originColumn.value.field || originColumn.value.key,
-        code: originColumn.value.popupCode,
-        fieldConfig: originColumn.value.fieldConfig,
-        // orgFields: originColumn.value.orgFields,
-        // destFields: originColumn.value.destFields,
-        groupId: 'j-vxe-popup',
-        param: originColumn.value.params,
-        sorter: originColumn.value.sorter,
-        setFieldsValue: (values) => {
-          if (!isEmpty(values)) {
-            let popupValue = ''
-            Object.keys(values).forEach(key => {
-              let currentValue = values[key]
-              // 当前列直接赋值，其他列通过vModel赋值
-              if (key === originColumn.value.key) {
-                popupValue = currentValue
-              } else {
-                vModel(currentValue, row, key)
-              }
-            })
-            handleChangeCommon(popupValue)
-          }
-        },
-      }
-    })
-
-    return {
-      popupProps,
-    }
-  },
-  // 【组件增强】注释详见：JVxeComponent.Enhanced
-  enhanced: {
-    aopEvents: {
-      editActived({ $event }) {
-        dispatchEvent({
-          $event,
-          props: this.props,
-          className: '.ant-input',
-          isClick: true,
-        })
-      },
+        popupProps,
+      };
     },
-  } as JVxeComponent.EnhancedPartial,
-})
-</script>
\ No newline at end of file
+    // 【组件增强】注释详见：JVxeComponent.Enhanced
+    enhanced: {
+      aopEvents: {
+        editActived({ $event }) {
+          dispatchEvent({
+            $event,
+            props: this.props,
+            className: '.ant-input',
+            isClick: true,
+          });
+        },
+      },
+    } as JVxeComponent.EnhancedPartial,
+  });
+</script>
diff --git a/src/components/JVxeCustom/src/components/JVxeSelectDictSearchCell.ts b/src/components/JVxeCustom/src/components/JVxeSelectDictSearchCell.ts
index 12a7576..a7b62ab 100644
--- a/src/components/JVxeCustom/src/components/JVxeSelectDictSearchCell.ts
+++ b/src/components/JVxeCustom/src/components/JVxeSelectDictSearchCell.ts
@@ -1,148 +1,148 @@
-import { computed, ref, watch, defineComponent, h } from 'vue'
-import { cloneDeep, debounce } from 'lodash-es'
-import { defHttp } from '/@/utils/http/axios'
-import { filterDictText } from '/@/utils/dict/JDictSelectUtil'
-import { ajaxGetDictItems, getDictItemsByCode } from '/@/utils/dict'
-import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types'
-import { dispatchEvent } from '/@/components/jeecg/JVxeTable/utils'
-import { useResolveComponent as rc } from '/@/components/jeecg/JVxeTable/hooks'
-import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
-import { useMessage } from '/@/hooks/web/useMessage'
+import { computed, ref, watch, defineComponent, h } from 'vue';
+import { cloneDeep, debounce } from 'lodash-es';
+import { defHttp } from '/@/utils/http/axios';
+import { filterDictText } from '/@/utils/dict/JDictSelectUtil';
+import { ajaxGetDictItems, getDictItemsByCode } from '/@/utils/dict';
+import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types';
+import { dispatchEvent } from '/@/components/jeecg/JVxeTable/utils';
+import { useResolveComponent as rc } from '/@/components/jeecg/JVxeTable/hooks';
+import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
+import { useMessage } from '/@/hooks/web/useMessage';
 
 /** value - label map，防止重复查询（刷新清空缓存） */
-const LabelMap = new Map<string, any>()
+const LabelMap = new Map<string, any>();
 // 请求id
-let requestId = 0
+let requestId = 0;
 
 /** 显示组件，自带翻译 */
 export const DictSearchSpanCell = defineComponent({
   name: 'JVxeSelectSearchSpanCell',
   props: useJVxeCompProps(),
   setup(props: JVxeComponent.Props) {
-    const { innerOptions, innerSelectValue, innerValue } = useSelectDictSearch(props)
+    const { innerOptions, innerSelectValue, innerValue } = useSelectDictSearch(props);
     return () => {
-      return h('span', {}, [
-        filterDictText(innerOptions.value, innerSelectValue.value || innerValue.value),
-      ])
-    }
+      return h('span', {}, [filterDictText(innerOptions.value, innerSelectValue.value || innerValue.value)]);
+    };
   },
-})
+});
 
 // 输入选择组件
 export const DictSearchInputCell = defineComponent({
   name: 'JVxeSelectSearchInputCell',
   props: useJVxeCompProps(),
   setup(props: JVxeComponent.Props) {
-    const { createMessage } = useMessage()
-    const {
-      dict,
-      loading,
-      isAsync,
-      options,
-      innerOptions,
-      originColumn,
-      cellProps,
-      innerSelectValue,
-      handleChangeCommon,
-    } = useSelectDictSearch(props)
-    const hasRequest = ref(false)
+    const { createMessage } = useMessage();
+    const { dict, loading, isAsync, options, innerOptions, originColumn, cellProps, innerSelectValue, handleChangeCommon } = useSelectDictSearch(props);
+    const hasRequest = ref(false);
     // 提示信息
     const tipsContent = computed(() => {
-      return originColumn.value.tipsContent || '请输入搜索内容'
-    })
+      return originColumn.value.tipsContent || '请输入搜索内容';
+    });
     // 筛选函数
     const filterOption = computed(() => {
       if (isAsync.value) {
-        return null
+        return null;
       }
-      return (input, option) => option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
-    })
+      return (input, option) => option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0;
+    });
 
     /** 加载数据 */
     const loadData = debounce((value) => {
-      const currentRequestId = ++requestId
-      loading.value = true
-      innerOptions.value = []
+      const currentRequestId = ++requestId;
+      loading.value = true;
+      innerOptions.value = [];
       if (value == null || value.trim() === '') {
-        loading.value = false
-        hasRequest.value = false
-        return
+        loading.value = false;
+        hasRequest.value = false;
+        return;
       }
       // 字典code格式：table,text,code
-      hasRequest.value = true
-      loadDictByKeyword(dict.value, value).then(res => {
-        if (currentRequestId !== requestId) {
-          return
-        }
-        let { success, result, message } = res
-        if (success) {
-          innerOptions.value = result
-          result.forEach((item) => {
-            LabelMap.set(item.value, [item])
-          })
-        } else {
-          createMessage.warning(message || '查询失败')
-        }
-      }).finally(() => {
-        loading.value = false
-      })
-    }, 300)
+      hasRequest.value = true;
+      loadDictByKeyword(dict.value, value)
+        .then((res) => {
+          if (currentRequestId !== requestId) {
+            return;
+          }
+          let { success, result, message } = res;
+          if (success) {
+            innerOptions.value = result;
+            result.forEach((item) => {
+              LabelMap.set(item.value, [item]);
+            });
+          } else {
+            createMessage.warning(message || '查询失败');
+          }
+        })
+        .finally(() => {
+          loading.value = false;
+        });
+    }, 300);
 
     function handleChange(selectedValue) {
-      innerSelectValue.value = selectedValue
-      handleChangeCommon(innerSelectValue.value)
+      innerSelectValue.value = selectedValue;
+      handleChangeCommon(innerSelectValue.value);
     }
 
     function handleSearch(value) {
       if (isAsync.value) {
         // 在输入时也应该开启加载，因为loadData加了消抖，所以会有800ms的用户主观上认为的卡顿时间
-        loading.value = true
+        loading.value = true;
         if (innerOptions.value.length > 0) {
-          innerOptions.value = []
+          innerOptions.value = [];
         }
-        loadData(value)
+        loadData(value);
       }
     }
 
     function renderOptionItem() {
-      let optionItems: any[] = []
+      let optionItems: any[] = [];
       options.value.forEach(({ value, text, label, title, disabled }) => {
-        optionItems.push(h(rc('a-select-option'), {
-          key: value,
-          value: value,
-          disabled: disabled,
-        }, {
-          default: () => (text || label || title),
-        }))
-      })
-      return optionItems
+        optionItems.push(
+          h(
+            rc('a-select-option'),
+            {
+              key: value,
+              value: value,
+              disabled: disabled,
+            },
+            {
+              default: () => text || label || title,
+            }
+          )
+        );
+      });
+      return optionItems;
     }
 
     return () => {
-      return h(rc('a-select'), {
-        ...cellProps.value,
-        value: innerSelectValue.value,
-        filterOption: filterOption.value,
-        showSearch: true,
-        allowClear: true,
-        autofocus: true,
-        defaultOpen: true,
-        style: 'width: 100%',
-        onSearch: handleSearch,
-        onChange: handleChange,
-      }, {
-        default: () => renderOptionItem(),
-        notFoundContent: () => {
-          if (loading.value) {
-            return h(rc('a-spin'), { size: 'small' })
-          } else if (hasRequest.value) {
-            return h('div', '没有查询到任何数据')
-          } else {
-            return h('div', [tipsContent.value])
-          }
+      return h(
+        rc('a-select'),
+        {
+          ...cellProps.value,
+          value: innerSelectValue.value,
+          filterOption: filterOption.value,
+          showSearch: true,
+          allowClear: true,
+          autofocus: true,
+          defaultOpen: true,
+          style: 'width: 100%',
+          onSearch: handleSearch,
+          onChange: handleChange,
         },
-      })
-    }
+        {
+          default: () => renderOptionItem(),
+          notFoundContent: () => {
+            if (loading.value) {
+              return h(rc('a-spin'), { size: 'small' });
+            } else if (hasRequest.value) {
+              return h('div', '没有查询到任何数据');
+            } else {
+              return h('div', [tipsContent.value]);
+            }
+          },
+        }
+      );
+    };
   },
   // 【组件增强】注释详见：JVxeComponent.Enhanced
   enhanced: {
@@ -154,63 +154,67 @@ export const DictSearchInputCell = defineComponent({
           className: '.ant-select .ant-select-selection-search-input',
           isClick: false,
           handler: (el) => el.focus(),
-        })
+        });
       },
     },
   } as JVxeComponent.EnhancedPartial,
-})
+});
 
 function useSelectDictSearch(props) {
-  const setup = useJVxeComponent(props)
-  const { innerValue, originColumn } = setup
+  const setup = useJVxeComponent(props);
+  const { innerValue, originColumn } = setup;
 
   // 加载状态
-  const loading = ref(false)
+  const loading = ref(false);
   // 内部选择值
-  const innerSelectValue = ref(null)
+  const innerSelectValue = ref(null);
   // 内部 options
-  const innerOptions = ref<any[]>([])
+  const innerOptions = ref<any[]>([]);
 
-  const dict = computed(() => originColumn.value.dict)
+  const dict = computed(() => originColumn.value.dict);
   // 是否是异步模式
   const isAsync = computed(() => {
-    let isAsync = originColumn.value.async
-    return (isAsync != null && isAsync !== '') ? !!isAsync : true
-  })
+    let isAsync = originColumn.value.async;
+    return isAsync != null && isAsync !== '' ? !!isAsync : true;
+  });
   const options = computed(() => {
     if (isAsync.value) {
-      return innerOptions.value
+      return innerOptions.value;
     } else {
-      return originColumn.value.options || []
+      return originColumn.value.options || [];
     }
-  })
+  });
 
   /** 公共属性监听 */
-  watch(innerValue, (value: string) => {
-    if (value == null || value === '') {
-      innerSelectValue.value = null
-    } else {
-      loadDataByValue(value)
-    }
-  }, { immediate: true })
-  watch(dict, () => loadDataByDict())
+  watch(
+    innerValue,
+    (value: string) => {
+      if (value == null || value === '') {
+        innerSelectValue.value = null;
+      } else {
+        loadDataByValue(value);
+      }
+    },
+    { immediate: true }
+  );
+  watch(dict, () => loadDataByDict());
 
   // 根据 value 查询数据，用于回显
   async function loadDataByValue(value) {
     if (isAsync.value) {
       if (innerSelectValue.value !== value) {
         if (LabelMap.has(value)) {
-          innerOptions.value = cloneDeep(LabelMap.get(value))
+          innerOptions.value = cloneDeep(LabelMap.get(value));
         } else {
-          let result = await loadDictItem(dict.value, value)
+          let result = await loadDictItem(dict.value, value);
           if (result && result.length > 0) {
-            innerOptions.value = [{ value: value, text: result[0] }]
-            LabelMap.set(value, cloneDeep(innerOptions.value))
+            innerOptions.value = [{ value: value, text: result[0] }];
+            LabelMap.set(value, cloneDeep(innerOptions.value));
           }
         }
       }
     }
-    innerSelectValue.value = (value || '').toString()
+    innerSelectValue.value = (value || '').toString();
   }
 
   // 初始化字典
@@ -219,26 +223,26 @@ function useSelectDictSearch(props) {
       // 如果字典项集合有数据
       if (!originColumn.value.options || originColumn.value.options.length === 0) {
         // 根据字典Code, 初始化字典数组
-        let dictStr = ''
+        let dictStr = '';
         if (dict.value) {
-          let arr = dict.value.split(',')
+          let arr = dict.value.split(',');
           if (arr[0].indexOf('where') > 0) {
-            let tbInfo = arr[0].split('where')
-            dictStr = tbInfo[0].trim() + ',' + arr[1] + ',' + arr[2] + ',' + encodeURIComponent(tbInfo[1])
+            let tbInfo = arr[0].split('where');
+            dictStr = tbInfo[0].trim() + ',' + arr[1] + ',' + arr[2] + ',' + encodeURIComponent(tbInfo[1]);
           } else {
-            dictStr = dict.value
+            dictStr = dict.value;
           }
           if (dict.value.indexOf(',') === -1) {
             //优先从缓存中读取字典配置
-            let cache = getDictItemsByCode(dict.value)
+            let cache = getDictItemsByCode(dict.value);
             if (cache) {
-              innerOptions.value = cache
-              return
+              innerOptions.value = cache;
+              return;
             }
           }
-          let { success, result } = await ajaxGetDictItems(dictStr, null)
+          let { success, result } = await ajaxGetDictItems(dictStr, null);
           if (success) {
-            innerOptions.value = result
+            innerOptions.value = result;
           }
         }
       }
@@ -247,9 +251,13 @@ function useSelectDictSearch(props) {
 
   return {
     ...setup,
-    loading, innerOptions, innerSelectValue,
-    dict, isAsync, options,
-  }
+    loading,
+    innerOptions,
+    innerSelectValue,
+    dict,
+    isAsync,
+    options,
+  };
 }
 
 /** 获取字典项 */
@@ -259,17 +267,20 @@ function loadDictItem(dict: string, key: string) {
     params: {
       key: key,
     },
-  })
+  });
 }
 
 /** 根据关键字获取字典项（搜索） */
 function loadDictByKeyword(dict: string, keyword: string) {
-  return defHttp.get({
-    url: `/sys/dict/loadDict/${dict}`,
-    params: {
-      keyword: keyword,
+  return defHttp.get(
+    {
+      url: `/sys/dict/loadDict/${dict}`,
+      params: {
+        keyword: keyword,
+      },
     },
-  }, {
-    isTransformResponse: false,
-  })
-}
\ No newline at end of file
+    {
+      isTransformResponse: false,
+    }
+  );
+}
diff --git a/src/components/JVxeCustom/src/components/JVxeUserSelectCell.vue b/src/components/JVxeCustom/src/components/JVxeUserSelectCell.vue
index bd5bfde..18092d4 100644
--- a/src/components/JVxeCustom/src/components/JVxeUserSelectCell.vue
+++ b/src/components/JVxeCustom/src/components/JVxeUserSelectCell.vue
@@ -1,76 +1,69 @@
 <template>
-  <JSelectUser
-      :value="selectedValue"
-      :showButton="false"
-      v-bind="cellProps"
-      @change="handleChange"
-  />
+  <JSelectUser :value="selectedValue" :showButton="false" v-bind="cellProps" @change="handleChange" />
 </template>
 
 <script lang="ts">
-import { computed, defineComponent } from 'vue'
-import { JSelectUser } from '/@/components/Form'
-import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types'
-import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
-import { dispatchEvent } from '/@/components/jeecg/JVxeTable/utils'
-import { isArray, isEmpty, isString } from '/@/utils/is'
+  import { computed, defineComponent } from 'vue';
+  import { JSelectUser } from '/@/components/Form';
+  import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types';
+  import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
+  import { dispatchEvent } from '/@/components/jeecg/JVxeTable/utils';
+  import { isArray, isEmpty, isString } from '/@/utils/is';
 
-export default defineComponent({
-  name: 'JVxeUserSelectCell',
-  components: { JSelectUser },
-  props: useJVxeCompProps(),
-  setup(props: JVxeComponent.Props) {
-    const { innerValue, cellProps, handleChangeCommon } = useJVxeComponent(props)
+  export default defineComponent({
+    name: 'JVxeUserSelectCell',
+    components: { JSelectUser },
+    props: useJVxeCompProps(),
+    setup(props: JVxeComponent.Props) {
+      const { innerValue, cellProps, handleChangeCommon } = useJVxeComponent(props);
 
-    const selectedValue = computed(() => {
-      let val: any = innerValue.value
-      if (isEmpty(val)) {
-        return []
+      const selectedValue = computed(() => {
+        let val: any = innerValue.value;
+        if (isEmpty(val)) {
+          return [];
+        }
+        if (isArray(val)) {
+          return val;
+        }
+        if (isString(val)) {
+          // @ts-ignore
+          return val.split(',');
+        }
+        return [val];
+      });
+      // @ts-ignore
+      const multiple = computed(() => cellProps.value.multi != false);
+
+      function handleChange(values) {
+        handleChangeCommon(values.join(','));
       }
-      if (isArray(val)) {
-        return val
-      }
-      if (isString(val)) {
-        // @ts-ignore
-        return val.split(',')
-      }
-      return [val]
-    })
-    // @ts-ignore
-    const multiple = computed(() => cellProps.value.multi != false)
 
-    function handleChange(values) {
-      handleChangeCommon(values.join(','))
-    }
-
-    return {
-      selectedValue,
-      multiple,
-      cellProps,
-      handleChange,
-    }
-  },
-  enhanced: {
-    switches: {
-      visible: true,
+      return {
+        selectedValue,
+        multiple,
+        cellProps,
+        handleChange,
+      };
     },
-    translate: {
-      enabled: false,
-    },
-    aopEvents: {
-      editActived({ $event }) {
-        dispatchEvent({
-          $event,
-          props: this.props,
-          className: '.ant-select .ant-select-selection-search-input',
-          isClick: true,
-        })
+    enhanced: {
+      switches: {
+        visible: true,
       },
-    },
-  } as JVxeComponent.EnhancedPartial,
-})
+      translate: {
+        enabled: false,
+      },
+      aopEvents: {
+        editActived({ $event }) {
+          dispatchEvent({
+            $event,
+            props: this.props,
+            className: '.ant-select .ant-select-selection-search-input',
+            isClick: true,
+          });
+        },
+      },
+    } as JVxeComponent.EnhancedPartial,
+  });
 </script>
 
-<style scoped>
-
-</style>
\ No newline at end of file
+<style scoped></style>
diff --git a/src/components/JVxeCustom/src/hooks/useFileCell.ts b/src/components/JVxeCustom/src/hooks/useFileCell.ts
index 9728452..216721a 100644
--- a/src/components/JVxeCustom/src/hooks/useFileCell.ts
+++ b/src/components/JVxeCustom/src/hooks/useFileCell.ts
@@ -1,52 +1,52 @@
-import { computed } from 'vue'
-import { fileGetValue, fileSetValue, useJVxeUploadCell } from '/@/components/jeecg/JVxeTable/src/hooks/cells/useJVxeUploadCell'
-import { uploadUrl } from '/@/api/common/api'
-import { JUploadModal, UploadTypeEnum } from '/@/components/Form/src/jeecg/components/JUpload'
-import { useModal } from '/@/components/Modal'
-import { JVxeComponent } from '/@/components/jeecg/JVxeTable/src/types/JVxeComponent'
-import { Icon } from '/@/components/Icon'
-import { Dropdown } from 'ant-design-vue'
-import { LoadingOutlined } from '@ant-design/icons-vue'
+import { computed } from 'vue';
+import { fileGetValue, fileSetValue, useJVxeUploadCell } from '/@/components/jeecg/JVxeTable/src/hooks/cells/useJVxeUploadCell';
+import { uploadUrl } from '/@/api/common/api';
+import { JUploadModal, UploadTypeEnum } from '/@/components/Form/src/jeecg/components/JUpload';
+import { useModal } from '/@/components/Modal';
+import { JVxeComponent } from '/@/components/jeecg/JVxeTable/src/types/JVxeComponent';
+import { Icon } from '/@/components/Icon';
+import { Dropdown } from 'ant-design-vue';
+import { LoadingOutlined } from '@ant-design/icons-vue';
 
 export function useFileCell(props, fileType: UploadTypeEnum, options?) {
-  const setup = useJVxeUploadCell(props, { token: true, action: uploadUrl, ...options })
+  const setup = useJVxeUploadCell(props, { token: true, action: uploadUrl, ...options });
 
-  const { innerFile, handleChangeCommon, originColumn } = setup
-  const [registerModel, { openModal }] = useModal()
+  const { innerFile, handleChangeCommon, originColumn } = setup;
+  const [registerModel, { openModal }] = useModal();
 
   // 截取文件名
   const ellipsisFileName = computed(() => {
-    let length = 5
-    let file = innerFile.value
+    let length = 5;
+    let file = innerFile.value;
     if (!file || !file.name) {
-      return ''
+      return '';
     }
     if (file.name.length > length) {
-      return file.name.substr(0, length) + '…'
+      return file.name.substr(0, length) + '…';
     }
-    return file.name
-  })
+    return file.name;
+  });
 
   const modalValue = computed(() => {
     if (innerFile.value) {
       if (innerFile.value['url']) {
-        return innerFile.value['url']
+        return innerFile.value['url'];
       } else if (innerFile.value['path']) {
-        return innerFile.value['path']
+        return innerFile.value['path'];
       }
     }
-    return ''
-  })
+    return '';
+  });
 
   const maxCount = computed(() => {
-    let maxCount = originColumn.value.maxCount
+    let maxCount = originColumn.value.maxCount;
     // online 扩展JSON
     if (originColumn.value && originColumn.value.fieldExtendJson) {
-      let json = JSON.parse(originColumn.value.fieldExtendJson)
-      maxCount = json.uploadnum ? json.uploadnum : 0
+      let json = JSON.parse(originColumn.value.fieldExtendJson);
+      maxCount = json.uploadnum ? json.uploadnum : 0;
     }
-    return maxCount ?? 0
-  })
+    return maxCount ?? 0;
+  });
 
   // 点击更多按钮
   function handleMoreOperation() {
@@ -57,18 +57,17 @@ export function useFileCell(props, fileType: UploadTypeEnum, options?) {
       ...originColumn.value.props,
       maxCount: maxCount.value,
       fileType: fileType,
-    })
+    });
   }
 
   // 更多上传回调
   function onModalChange(path) {
     if (path) {
-      innerFile.value.path = path
-      handleChangeCommon(innerFile.value)
+      innerFile.value.path = path;
+      handleChangeCommon(innerFile.value);
     }
   }
 
-
   return {
     ...setup,
     modalValue,
@@ -77,15 +76,18 @@ export function useFileCell(props, fileType: UploadTypeEnum, options?) {
     registerModel,
     onModalChange,
     handleMoreOperation,
-  }
+  };
 }
 
 export const components = {
-  Icon, Dropdown, LoadingOutlined, JUploadModal,
-}
+  Icon,
+  Dropdown,
+  LoadingOutlined,
+  JUploadModal,
+};
 
 export const enhanced = {
   switches: { visible: true },
-  getValue: value => fileGetValue(value),
-  setValue: value => fileSetValue(value),
-} as JVxeComponent.EnhancedPartial
\ No newline at end of file
+  getValue: (value) => fileGetValue(value),
+  setValue: (value) => fileSetValue(value),
+} as JVxeComponent.EnhancedPartial;
diff --git a/src/components/Loading/src/Loading.vue b/src/components/Loading/src/Loading.vue
index c729eb0..6f8dbc0 100644
--- a/src/components/Loading/src/Loading.vue
+++ b/src/components/Loading/src/Loading.vue
@@ -1,10 +1,5 @@
 <template>
-  <section
-          class="full-loading"
-          :class="{ absolute, [theme]: !!theme }"
-          :style="[background ? `background-color: ${background}` : '']"
-          v-show="loading"
-  >
+  <section class="full-loading" :class="{ absolute, [theme]: !!theme }" :style="[background ? `background-color: ${background}` : '']" v-show="loading">
     <Spin v-bind="$attrs" :tip="tip" :size="size" :spinning="loading" />
   </section>
 </template>
diff --git a/src/components/Loading/src/useLoading.ts b/src/components/Loading/src/useLoading.ts
index 0424717..b5f1215 100644
--- a/src/components/Loading/src/useLoading.ts
+++ b/src/components/Loading/src/useLoading.ts
@@ -4,46 +4,44 @@ import type { LoadingProps } from './typing';
 import type { Ref } from 'vue';
 
 export interface UseLoadingOptions {
-    target?: any;
-    props?: Partial<LoadingProps>;
+  target?: any;
+  props?: Partial<LoadingProps>;
 }
 
 interface Fn {
-    (): void;
+  (): void;
 }
 
 export function useLoading(props: Partial<LoadingProps>): [Fn, Fn, (string) => void];
 export function useLoading(opt: Partial<UseLoadingOptions>): [Fn, Fn, (string) => void];
 
-export function useLoading(
-    opt: Partial<LoadingProps> | Partial<UseLoadingOptions>
-): [Fn, Fn, (string) => void] {
-    let props: Partial<LoadingProps>;
-    let target: HTMLElement | Ref<ElRef> = document.body;
+export function useLoading(opt: Partial<LoadingProps> | Partial<UseLoadingOptions>): [Fn, Fn, (string) => void] {
+  let props: Partial<LoadingProps>;
+  let target: HTMLElement | Ref<ElRef> = document.body;
 
-    if (Reflect.has(opt, 'target') || Reflect.has(opt, 'props')) {
-        const options = opt as Partial<UseLoadingOptions>;
-        props = options.props || {};
-        target = options.target || document.body;
-    } else {
-        props = opt as Partial<LoadingProps>;
-    }
+  if (Reflect.has(opt, 'target') || Reflect.has(opt, 'props')) {
+    const options = opt as Partial<UseLoadingOptions>;
+    props = options.props || {};
+    target = options.target || document.body;
+  } else {
+    props = opt as Partial<LoadingProps>;
+  }
 
-    const instance = createLoading(props, undefined, true);
+  const instance = createLoading(props, undefined, true);
 
-    const open = (): void => {
-        const t = unref(target as Ref<ElRef>);
-        if (!t) return;
-        instance.open(t);
-    };
+  const open = (): void => {
+    const t = unref(target as Ref<ElRef>);
+    if (!t) return;
+    instance.open(t);
+  };
 
-    const close = (): void => {
-        instance.close();
-    };
+  const close = (): void => {
+    instance.close();
+  };
 
-    const setTip = (tip: string) => {
-        instance.setTip(tip);
-    };
+  const setTip = (tip: string) => {
+    instance.setTip(tip);
+  };
 
-    return [open, close, setTip];
+  return [open, close, setTip];
 }
diff --git a/src/components/Markdown/src/Markdown.vue b/src/components/Markdown/src/Markdown.vue
index cb37b86..4a22412 100644
--- a/src/components/Markdown/src/Markdown.vue
+++ b/src/components/Markdown/src/Markdown.vue
@@ -3,16 +3,7 @@
 </template>
 <script lang="ts">
   import type { Ref } from 'vue';
-  import {
-    defineComponent,
-    ref,
-    unref,
-    nextTick,
-    computed,
-    watch,
-    onBeforeUnmount,
-    onDeactivated,
-  } from 'vue';
+  import { defineComponent, ref, unref, nextTick, computed, watch, onBeforeUnmount, onDeactivated } from 'vue';
   import Vditor from 'vditor';
   import 'vditor/dist/index.css';
   import { useLocale } from '/@/locales/useLocale';
@@ -41,28 +32,28 @@
       const valueRef = ref(props.value || '');
 
       watch(
-              [() => getDarkMode.value, () => initedRef.value],
-              ([val, inited]) => {
-                if (!inited) {
-                  return;
-                }
-                const theme = val === 'dark' ? 'dark' : 'classic';
-                instance.getVditor()?.setTheme(theme);
-              },
-              {
-                immediate: true,
-                flush: 'post',
-              },
+        [() => getDarkMode.value, () => initedRef.value],
+        ([val, inited]) => {
+          if (!inited) {
+            return;
+          }
+          const theme = val === 'dark' ? 'dark' : 'classic';
+          instance.getVditor()?.setTheme(theme);
+        },
+        {
+          immediate: true,
+          flush: 'post',
+        }
       );
 
       watch(
-              () => props.value,
-              (v) => {
-                if (v !== valueRef.value) {
-                  instance.getVditor()?.setValue(v);
-                }
-                valueRef.value = v;
-              },
+        () => props.value,
+        (v) => {
+          if (v !== valueRef.value) {
+            instance.getVditor()?.setValue(v);
+          }
+          valueRef.value = v;
+        }
       );
 
       const getCurrentLang = computed((): 'zh_CN' | 'en_US' | 'ja_JP' | 'ko_KR' => {
diff --git a/src/components/Menu/src/BasicMenu.vue b/src/components/Menu/src/BasicMenu.vue
index 19c6546..4e6a06f 100644
--- a/src/components/Menu/src/BasicMenu.vue
+++ b/src/components/Menu/src/BasicMenu.vue
@@ -1,16 +1,16 @@
 <template>
   <Menu
-          :selectedKeys="selectedKeys"
-          :defaultSelectedKeys="defaultSelectedKeys"
-          :mode="mode"
-          :openKeys="getOpenKeys"
-          :inlineIndent="inlineIndent"
-          :theme="theme"
-          @openChange="handleOpenChange"
-          :class="getMenuClass"
-          @click="handleMenuClick"
-          :subMenuOpenDelay="0.2"
-          v-bind="getInlineCollapseOptions"
+    :selectedKeys="selectedKeys"
+    :defaultSelectedKeys="defaultSelectedKeys"
+    :mode="mode"
+    :openKeys="getOpenKeys"
+    :inlineIndent="inlineIndent"
+    :theme="theme"
+    @openChange="handleOpenChange"
+    :class="getMenuClass"
+    @click="handleMenuClick"
+    :subMenuOpenDelay="0.2"
+    v-bind="getInlineCollapseOptions"
   >
     <template v-for="item in items" :key="item.path">
       <BasicSubMenuItem :item="item" :theme="theme" :isHorizontal="isHorizontal" />
@@ -60,20 +60,12 @@
 
       const { currentRoute } = useRouter();
 
-      const { handleOpenChange, setOpenKeys, getOpenKeys } = useOpenKeys(
-              menuState,
-              items,
-              mode as any,
-              accordion
-      );
+      const { handleOpenChange, setOpenKeys, getOpenKeys } = useOpenKeys(menuState, items, mode as any, accordion);
 
       const getIsTopMenu = computed(() => {
         const { type, mode } = props;
 
-        return (
-                (type === MenuTypeEnum.TOP_MENU && mode === MenuModeEnum.HORIZONTAL) ||
-                (props.isHorizontal && unref(getSplit))
-        );
+        return (type === MenuTypeEnum.TOP_MENU && mode === MenuModeEnum.HORIZONTAL) || (props.isHorizontal && unref(getSplit));
       });
 
       const getMenuClass = computed(() => {
@@ -110,12 +102,12 @@
       });
 
       !props.mixSider &&
-      watch(
-              () => props.items,
-              () => {
-                handleMenuChange();
-              }
-      );
+        watch(
+          () => props.items,
+          () => {
+            handleMenuChange();
+          }
+        );
 
       async function handleMenuClick({ key }: { key: string; keyPath: string[] }) {
         const { beforeClickFn } = props;
@@ -137,9 +129,7 @@
           isClickGo.value = false;
           return;
         }
-        const path =
-          (route || unref(currentRoute)).meta?.currentActiveMenu ||
-          (route || unref(currentRoute)).path;
+        const path = (route || unref(currentRoute)).meta?.currentActiveMenu || (route || unref(currentRoute)).path;
         setOpenKeys(path);
         if (unref(currentActiveMenu)) return;
         if (props.isHorizontal && unref(getSplit)) {
diff --git a/src/components/Menu/src/components/BasicSubMenuItem.vue b/src/components/Menu/src/components/BasicSubMenuItem.vue
index d5139fc..d19591c 100644
--- a/src/components/Menu/src/components/BasicSubMenuItem.vue
+++ b/src/components/Menu/src/components/BasicSubMenuItem.vue
@@ -1,11 +1,6 @@
 <template>
   <BasicMenuItem v-if="!menuHasChildren(item) && getShowMenu" v-bind="$props" />
-  <SubMenu
-    v-if="menuHasChildren(item) && getShowMenu"
-    :class="[theme]"
-    :key="`submenu-${item.path}`"
-    popupClassName="app-top-menu-popup"
-  >
+  <SubMenu v-if="menuHasChildren(item) && getShowMenu" :class="[theme]" :key="`submenu-${item.path}`" popupClassName="app-top-menu-popup">
     <template #title>
       <MenuItemContent v-bind="$props" :item="item" />
     </template>
@@ -38,12 +33,7 @@
 
       const getShowMenu = computed(() => !props.item.meta?.hideMenu);
       function menuHasChildren(menuTreeItem: MenuType): boolean {
-        return (
-          !menuTreeItem.meta?.hideChildrenInMenu &&
-          Reflect.has(menuTreeItem, 'children') &&
-          !!menuTreeItem.children &&
-          menuTreeItem.children.length > 0
-        );
+        return !menuTreeItem.meta?.hideChildrenInMenu && Reflect.has(menuTreeItem, 'children') && !!menuTreeItem.children && menuTreeItem.children.length > 0;
       }
       return {
         prefixCls,
diff --git a/src/components/Menu/src/useOpenKeys.ts b/src/components/Menu/src/useOpenKeys.ts
index 14ea42f..3e35eac 100644
--- a/src/components/Menu/src/useOpenKeys.ts
+++ b/src/components/Menu/src/useOpenKeys.ts
@@ -10,12 +10,7 @@ import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
 import { getAllParentPath } from '/@/router/helper/menuHelper';
 import { useTimeoutFn } from '/@/hooks/core/useTimeout';
 
-export function useOpenKeys(
-  menuState: MenuState,
-  menus: Ref<MenuType[]>,
-  mode: Ref<MenuModeEnum>,
-  accordion: Ref<boolean>
-) {
+export function useOpenKeys(menuState: MenuState, menus: Ref<MenuType[]>, mode: Ref<MenuModeEnum>, accordion: Ref<boolean>) {
   const { getCollapsed, getIsMixSidebar } = useMenuSetting();
 
   async function setOpenKeys(path: string) {
diff --git a/src/components/Modal/src/BasicModal.vue b/src/components/Modal/src/BasicModal.vue
index 3f9d623..26884f8 100644
--- a/src/components/Modal/src/BasicModal.vue
+++ b/src/components/Modal/src/BasicModal.vue
@@ -1,20 +1,11 @@
 <template>
   <Modal v-bind="getBindValue" @cancel="handleCancel">
     <template #closeIcon v-if="!$slots.closeIcon">
-      <ModalClose
-              :canFullscreen="getProps.canFullscreen"
-              :fullScreen="fullScreenRef"
-              @cancel="handleCancel"
-              @fullscreen="handleFullScreen"
-      />
+      <ModalClose :canFullscreen="getProps.canFullscreen" :fullScreen="fullScreenRef" @cancel="handleCancel" @fullscreen="handleFullScreen" />
     </template>
 
     <template #title v-if="!$slots.title">
-      <ModalHeader
-              :helpMessage="getProps.helpMessage"
-              :title="getMergeProps.title"
-              @dblclick="handleTitleDbClick"
-      />
+      <ModalHeader :helpMessage="getProps.helpMessage" :title="getMergeProps.title" @dblclick="handleTitleDbClick" />
     </template>
 
     <template #footer v-if="!$slots.footer">
@@ -26,19 +17,19 @@
     </template>
 
     <ModalWrapper
-            :useWrapper="getProps.useWrapper"
-            :footerOffset="wrapperFooterOffset"
-            :fullScreen="fullScreenRef"
-            ref="modalWrapperRef"
-            :loading="getProps.loading"
-            :loading-tip="getProps.loadingTip"
-            :minHeight="getProps.minHeight"
-            :height="getWrapperHeight"
-            :visible="visibleRef"
-            :modalFooterHeight="footer !== undefined && !footer ? 0 : undefined"
-            v-bind="omit(getProps.wrapperProps, 'visible', 'height', 'modalFooterHeight')"
-            @ext-height="handleExtHeight"
-            @height-change="handleHeightChange"
+      :useWrapper="getProps.useWrapper"
+      :footerOffset="wrapperFooterOffset"
+      :fullScreen="fullScreenRef"
+      ref="modalWrapperRef"
+      :loading="getProps.loading"
+      :loading-tip="getProps.loadingTip"
+      :minHeight="getProps.minHeight"
+      :height="getWrapperHeight"
+      :visible="visibleRef"
+      :modalFooterHeight="footer !== undefined && !footer ? 0 : undefined"
+      v-bind="omit(getProps.wrapperProps, 'visible', 'height', 'modalFooterHeight')"
+      @ext-height="handleExtHeight"
+      @height-change="handleHeightChange"
     >
       <slot></slot>
     </ModalWrapper>
@@ -51,17 +42,7 @@
 <script lang="ts">
   import type { ModalProps, ModalMethods } from './typing';
 
-  import {
-    defineComponent,
-    computed,
-    ref,
-    watch,
-    unref,
-    watchEffect,
-    toRef,
-    getCurrentInstance,
-    nextTick,
-  } from 'vue';
+  import { defineComponent, computed, ref, watch, unref, watchEffect, toRef, getCurrentInstance, nextTick } from 'vue';
   import Modal from './components/Modal';
   import ModalWrapper from './components/ModalWrapper.vue';
   import ModalClose from './components/ModalClose.vue';
@@ -156,20 +137,20 @@
       });
 
       watch(
-              () => unref(visibleRef),
-              (v) => {
-                emit('visible-change', v);
-                emit('update:visible', v);
-                instance && modalMethods.emitVisible?.(v, instance.uid);
-                nextTick(() => {
-                  if (props.scrollTop && v && unref(modalWrapperRef)) {
-                    (unref(modalWrapperRef) as any).scrollTop();
-                  }
-                });
-              },
-              {
-                immediate: false,
-              }
+        () => unref(visibleRef),
+        (v) => {
+          emit('visible-change', v);
+          emit('update:visible', v);
+          instance && modalMethods.emitVisible?.(v, instance.uid);
+          nextTick(() => {
+            if (props.scrollTop && v && unref(modalWrapperRef)) {
+              (unref(modalWrapperRef) as any).scrollTop();
+            }
+          });
+        },
+        {
+          immediate: false,
+        }
       );
 
       // 取消事件
diff --git a/src/components/Modal/src/components/Modal.tsx b/src/components/Modal/src/components/Modal.tsx
index e650eb9..684e3bf 100644
--- a/src/components/Modal/src/components/Modal.tsx
+++ b/src/components/Modal/src/components/Modal.tsx
@@ -10,7 +10,7 @@ export default defineComponent({
   inheritAttrs: false,
   props: basicProps,
   emits: ['cancel'],
-  setup(props, { slots ,emit}) {
+  setup(props, { slots, emit }) {
     const { visible, draggable, destroyOnClose } = toRefs(props);
     const attrs = useAttrs();
     useModalDragMove({
@@ -23,7 +23,7 @@ export default defineComponent({
     };
 
     return () => {
-      const propsData = { ...unref(attrs), ...props,onCancel } as Recordable;
+      const propsData = { ...unref(attrs), ...props, onCancel } as Recordable;
       return <Modal {...propsData}>{extendSlots(slots)}</Modal>;
     };
   },
diff --git a/src/components/Modal/src/components/ModalFooter.vue b/src/components/Modal/src/components/ModalFooter.vue
index d8cefdb..7bc5786 100644
--- a/src/components/Modal/src/components/ModalFooter.vue
+++ b/src/components/Modal/src/components/ModalFooter.vue
@@ -5,13 +5,7 @@
       {{ cancelText }}
     </a-button>
     <slot name="centerFooter"></slot>
-    <a-button
-      :type="okType"
-      @click="handleOk"
-      :loading="confirmLoading"
-      v-bind="okButtonProps"
-      v-if="showOkBtn"
-    >
+    <a-button :type="okType" @click="handleOk" :loading="confirmLoading" v-bind="okButtonProps" v-if="showOkBtn">
       {{ okText }}
     </a-button>
     <slot name="appendFooter"></slot>
diff --git a/src/components/Modal/src/components/ModalWrapper.vue b/src/components/Modal/src/components/ModalWrapper.vue
index 553d978..3b5aa45 100644
--- a/src/components/Modal/src/components/ModalWrapper.vue
+++ b/src/components/Modal/src/components/ModalWrapper.vue
@@ -7,17 +7,7 @@
 </template>
 <script lang="ts">
   import type { CSSProperties } from 'vue';
-  import {
-    defineComponent,
-    computed,
-    ref,
-    watchEffect,
-    unref,
-    watch,
-    onMounted,
-    nextTick,
-    onUnmounted,
-  } from 'vue';
+  import { defineComponent, computed, ref, watchEffect, unref, watch, onMounted, nextTick, onUnmounted } from 'vue';
   import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn';
   import { ScrollContainer } from '/@/components/Container';
   import { createModalContext } from '../hooks/useModalContext';
@@ -55,14 +45,14 @@
       useWindowSizeFn(setModalHeight.bind(null, false));
 
       useMutationObserver(
-              spinRef,
-              () => {
-                setModalHeight();
-              },
-              {
-                attributes: true,
-                subtree: true,
-              }
+        spinRef,
+        () => {
+          setModalHeight();
+        },
+        {
+          attributes: true,
+          subtree: true,
+        }
       );
 
       createModalContext({
@@ -81,15 +71,15 @@
       });
 
       watch(
-              () => props.fullScreen,
-              (v) => {
-                setModalHeight();
-                if (!v) {
-                  realHeightRef.value = minRealHeightRef.value;
-                } else {
-                  minRealHeightRef.value = realHeightRef.value;
-                }
-              }
+        () => props.fullScreen,
+        (v) => {
+          setModalHeight();
+          if (!v) {
+            realHeightRef.value = minRealHeightRef.value;
+          } else {
+            minRealHeightRef.value = realHeightRef.value;
+          }
+        }
       );
 
       onMounted(() => {
@@ -127,12 +117,7 @@
 
           const modalRect = getComputedStyle(modalDom as Element).top;
           const modalTop = Number.parseInt(modalRect);
-          let maxHeight =
-                  window.innerHeight -
-                  modalTop * 2 +
-                  (props.footerOffset! || 0) -
-                  props.modalFooterHeight -
-                  props.modalHeaderHeight;
+          let maxHeight = window.innerHeight - modalTop * 2 + (props.footerOffset! || 0) - props.modalFooterHeight - props.modalHeaderHeight;
 
           // 距离顶部过进会出现滚动条
           if (modalTop < 40) {
@@ -148,14 +133,9 @@
           // }
 
           if (props.fullScreen) {
-            realHeightRef.value =
-                    window.innerHeight - props.modalFooterHeight - props.modalHeaderHeight - 28;
+            realHeightRef.value = window.innerHeight - props.modalFooterHeight - props.modalHeaderHeight - 28;
           } else {
-            realHeightRef.value = props.height
-                    ? props.height
-                    : realHeight > maxHeight
-                            ? maxHeight
-                            : realHeight;
+            realHeightRef.value = props.height ? props.height : realHeight > maxHeight ? maxHeight : realHeight;
           }
           emit('height-change', unref(realHeightRef));
         } catch (error) {
diff --git a/src/components/Modal/src/hooks/useModal.ts b/src/components/Modal/src/hooks/useModal.ts
index c239f94..1c88323 100644
--- a/src/components/Modal/src/hooks/useModal.ts
+++ b/src/components/Modal/src/hooks/useModal.ts
@@ -1,20 +1,5 @@
-import type {
-  UseModalReturnType,
-  ModalMethods,
-  ModalProps,
-  ReturnMethods,
-  UseModalInnerReturnType,
-} from '../typing';
-import {
-  ref,
-  onUnmounted,
-  unref,
-  getCurrentInstance,
-  reactive,
-  watchEffect,
-  nextTick,
-  toRaw,
-} from 'vue';
+import type { UseModalReturnType, ModalMethods, ModalProps, ReturnMethods, UseModalInnerReturnType } from '../typing';
+import { ref, onUnmounted, unref, getCurrentInstance, reactive, watchEffect, nextTick, toRaw } from 'vue';
 import { isProdMode } from '/@/utils/env';
 import { isFunction } from '/@/utils/is';
 import { isEqual } from 'lodash-es';
@@ -40,11 +25,11 @@ export function useModal(): UseModalReturnType {
     }
     uid.value = uuid;
     isProdMode() &&
-    onUnmounted(() => {
-      modal.value = null;
-      loaded.value = false;
-      dataTransfer[unref(uid)] = null;
-    });
+      onUnmounted(() => {
+        modal.value = null;
+        loaded.value = false;
+        dataTransfer[unref(uid)] = null;
+      });
     if (unref(loaded) && isProdMode() && modalMethod === unref(modal)) return;
 
     modal.value = modalMethod;
@@ -115,9 +100,9 @@ export const useModalInner = (callbackFn?: Fn): UseModalInnerReturnType => {
 
   const register = (modalInstance: ModalMethods, uuid: string) => {
     isProdMode() &&
-    tryOnUnmounted(() => {
-      modalInstanceRef.value = null;
-    });
+      tryOnUnmounted(() => {
+        modalInstanceRef.value = null;
+      });
     uidRef.value = uuid;
     modalInstanceRef.value = modalInstance;
     currentInstance?.emit('register', modalInstance, uuid);
diff --git a/src/components/Modal/src/index.less b/src/components/Modal/src/index.less
index 5715a5c..be64b20 100644
--- a/src/components/Modal/src/index.less
+++ b/src/components/Modal/src/index.less
@@ -23,7 +23,6 @@
     padding: 14px;
   }
 
-
   &-title {
     font-size: 16px;
     font-weight: bold;
diff --git a/src/components/Page/src/PageFooter.vue b/src/components/Page/src/PageFooter.vue
index 0db3f74..5440d2a 100644
--- a/src/components/Page/src/PageFooter.vue
+++ b/src/components/Page/src/PageFooter.vue
@@ -39,8 +39,7 @@
     line-height: 44px;
     background-color: @component-background;
     border-top: 1px solid @border-color-base;
-    box-shadow: 0 -6px 16px -8px rgba(0, 0, 0, 0.08), 0 -9px 28px 0 rgba(0, 0, 0, 0.05),
-      0 -12px 48px 16px rgba(0, 0, 0, 0.03);
+    box-shadow: 0 -6px 16px -8px rgba(0, 0, 0, 0.08), 0 -9px 28px 0 rgba(0, 0, 0, 0.05), 0 -12px 48px 16px rgba(0, 0, 0, 0.03);
     transition: width 0.2s;
 
     &__left {
diff --git a/src/components/Page/src/PageWrapper.vue b/src/components/Page/src/PageWrapper.vue
index fda025e..6eb5df1 100644
--- a/src/components/Page/src/PageWrapper.vue
+++ b/src/components/Page/src/PageWrapper.vue
@@ -1,12 +1,6 @@
 <template>
   <div :class="getClass" ref="wrapperRef">
-    <PageHeader
-            :ghost="ghost"
-            :title="title"
-            v-bind="omit($attrs, 'class')"
-            ref="headerRef"
-            v-if="content || $slots.headerContent || title || getHeaderSlots.length"
-    >
+    <PageHeader :ghost="ghost" :title="title" v-bind="omit($attrs, 'class')" ref="headerRef" v-if="content || $slots.headerContent || title || getHeaderSlots.length">
       <template #default>
         <template v-if="content">
           {{ content }}
@@ -71,8 +65,8 @@
       const { prefixCls } = useDesign('page-wrapper');
 
       provide(
-              PageWrapperFixedHeightKey,
-              computed(() => props.fixedHeight),
+        PageWrapperFixedHeightKey,
+        computed(() => props.fixedHeight)
       );
 
       const getIsContentFullHeight = computed(() => {
@@ -80,13 +74,7 @@
       });
 
       const getUpwardSpace = computed(() => props.upwardSpace);
-      const { redoHeight, setCompensation, contentHeight } = useContentHeight(
-              getIsContentFullHeight,
-              wrapperRef,
-              [headerRef, footerRef],
-              [contentRef],
-              getUpwardSpace,
-      );
+      const { redoHeight, setCompensation, contentHeight } = useContentHeight(getIsContentFullHeight, wrapperRef, [headerRef, footerRef], [contentRef], getUpwardSpace);
       setCompensation({ useLayoutFooter: true, elements: [footerRef] });
 
       const getClass = computed(() => {
@@ -131,14 +119,14 @@
       });
 
       watch(
-              () => [getShowFooter.value],
-              () => {
-                redoHeight();
-              },
-              {
-                flush: 'post',
-                immediate: true,
-              },
+        () => [getShowFooter.value],
+        () => {
+          redoHeight();
+        },
+        {
+          flush: 'post',
+          immediate: true,
+        }
       );
 
       return {
diff --git a/src/components/Preview/src/Functional.vue b/src/components/Preview/src/Functional.vue
index f40c975..7de37ec 100644
--- a/src/components/Preview/src/Functional.vue
+++ b/src/components/Preview/src/Functional.vue
@@ -1,546 +1,528 @@
 <script lang="tsx">
-    import { defineComponent, ref, unref, computed, reactive, watchEffect } from 'vue';
-    import { CloseOutlined, LeftOutlined, RightOutlined } from '@ant-design/icons-vue';
-    import resumeSvg from '/@/assets/svg/preview/resume.svg';
-    import rotateSvg from '/@/assets/svg/preview/p-rotate.svg';
-    import scaleSvg from '/@/assets/svg/preview/scale.svg';
-    import unScaleSvg from '/@/assets/svg/preview/unscale.svg';
-    import unRotateSvg from '/@/assets/svg/preview/unrotate.svg';
+  import { defineComponent, ref, unref, computed, reactive, watchEffect } from 'vue';
+  import { CloseOutlined, LeftOutlined, RightOutlined } from '@ant-design/icons-vue';
+  import resumeSvg from '/@/assets/svg/preview/resume.svg';
+  import rotateSvg from '/@/assets/svg/preview/p-rotate.svg';
+  import scaleSvg from '/@/assets/svg/preview/scale.svg';
+  import unScaleSvg from '/@/assets/svg/preview/unscale.svg';
+  import unRotateSvg from '/@/assets/svg/preview/unrotate.svg';
 
-    enum StatueEnum {
-        LOADING,
-        DONE,
-        FAIL,
-    }
-    interface ImgState {
-        currentUrl: string;
-        imgScale: number;
-        imgRotate: number;
-        imgTop: number;
-        imgLeft: number;
-        currentIndex: number;
-        status: StatueEnum;
-        moveX: number;
-        moveY: number;
-        show: boolean;
-    }
-    const props = {
-        show: {
-            type: Boolean as PropType<boolean>,
-            default: false,
-        },
-        imageList: {
-            type: [Array] as PropType<string[]>,
-            default: null,
-        },
-        index: {
-            type: Number as PropType<number>,
-            default: 0,
-        },
-        scaleStep: {
-            type: Number as PropType<number>,
-        },
-        defaultWidth: {
-            type: Number as PropType<number>,
-        },
-        maskClosable: {
-            type: Boolean as PropType<boolean>,
-        },
-        rememberState: {
-            type: Boolean as PropType<boolean>,
-        },
-    };
+  enum StatueEnum {
+    LOADING,
+    DONE,
+    FAIL,
+  }
+  interface ImgState {
+    currentUrl: string;
+    imgScale: number;
+    imgRotate: number;
+    imgTop: number;
+    imgLeft: number;
+    currentIndex: number;
+    status: StatueEnum;
+    moveX: number;
+    moveY: number;
+    show: boolean;
+  }
+  const props = {
+    show: {
+      type: Boolean as PropType<boolean>,
+      default: false,
+    },
+    imageList: {
+      type: [Array] as PropType<string[]>,
+      default: null,
+    },
+    index: {
+      type: Number as PropType<number>,
+      default: 0,
+    },
+    scaleStep: {
+      type: Number as PropType<number>,
+    },
+    defaultWidth: {
+      type: Number as PropType<number>,
+    },
+    maskClosable: {
+      type: Boolean as PropType<boolean>,
+    },
+    rememberState: {
+      type: Boolean as PropType<boolean>,
+    },
+  };
 
-    const prefixCls = 'img-preview';
-    export default defineComponent({
-        name: 'ImagePreview',
-        props,
-        emits: ['img-load', 'img-error'],
-        setup(props, { expose, emit }) {
-            interface stateInfo {
-                scale: number;
-                rotate: number;
-                top: number;
-                left: number;
-            }
-            const stateMap = new Map<string, stateInfo>();
-            const imgState = reactive<ImgState>({
-                currentUrl: '',
-                imgScale: 1,
-                imgRotate: 0,
-                imgTop: 0,
-                imgLeft: 0,
-                status: StatueEnum.LOADING,
-                currentIndex: 0,
-                moveX: 0,
-                moveY: 0,
-                show: props.show,
-            });
+  const prefixCls = 'img-preview';
+  export default defineComponent({
+    name: 'ImagePreview',
+    props,
+    emits: ['img-load', 'img-error'],
+    setup(props, { expose, emit }) {
+      interface stateInfo {
+        scale: number;
+        rotate: number;
+        top: number;
+        left: number;
+      }
+      const stateMap = new Map<string, stateInfo>();
+      const imgState = reactive<ImgState>({
+        currentUrl: '',
+        imgScale: 1,
+        imgRotate: 0,
+        imgTop: 0,
+        imgLeft: 0,
+        status: StatueEnum.LOADING,
+        currentIndex: 0,
+        moveX: 0,
+        moveY: 0,
+        show: props.show,
+      });
 
-            const wrapElRef = ref<HTMLDivElement | null>(null);
-            const imgElRef = ref<HTMLImageElement | null>(null);
+      const wrapElRef = ref<HTMLDivElement | null>(null);
+      const imgElRef = ref<HTMLImageElement | null>(null);
 
-            // 初始化
-            function init() {
-                initMouseWheel();
-                const { index, imageList } = props;
+      // 初始化
+      function init() {
+        initMouseWheel();
+        const { index, imageList } = props;
 
-                if (!imageList || !imageList.length) {
-                    throw new Error('imageList is undefined');
-                }
-                imgState.currentIndex = index;
-                handleIChangeImage(imageList[index]);
-            }
+        if (!imageList || !imageList.length) {
+          throw new Error('imageList is undefined');
+        }
+        imgState.currentIndex = index;
+        handleIChangeImage(imageList[index]);
+      }
 
-            // 重置
-            function initState() {
-                imgState.imgScale = 1;
-                imgState.imgRotate = 0;
-                imgState.imgTop = 0;
-                imgState.imgLeft = 0;
-            }
+      // 重置
+      function initState() {
+        imgState.imgScale = 1;
+        imgState.imgRotate = 0;
+        imgState.imgTop = 0;
+        imgState.imgLeft = 0;
+      }
 
-            // 初始化鼠标滚轮事件
-            function initMouseWheel() {
-                const wrapEl = unref(wrapElRef);
-                if (!wrapEl) {
-                    return;
-                }
-                (wrapEl as any).onmousewheel = scrollFunc;
-                // 火狐浏览器没有onmousewheel事件，用DOMMouseScroll代替
-                document.body.addEventListener('DOMMouseScroll', scrollFunc);
-                // 禁止火狐浏览器下拖拽图片的默认事件
-                document.ondragstart = function () {
-                    return false;
-                };
-            }
+      // 初始化鼠标滚轮事件
+      function initMouseWheel() {
+        const wrapEl = unref(wrapElRef);
+        if (!wrapEl) {
+          return;
+        }
+        (wrapEl as any).onmousewheel = scrollFunc;
+        // 火狐浏览器没有onmousewheel事件，用DOMMouseScroll代替
+        document.body.addEventListener('DOMMouseScroll', scrollFunc);
+        // 禁止火狐浏览器下拖拽图片的默认事件
+        document.ondragstart = function () {
+          return false;
+        };
+      }
 
-            const getScaleStep = computed(() => {
-                const scaleStep = props?.scaleStep ?? 0;
-                if (scaleStep ?? (0 > 0 && scaleStep < 100)) {
-                    return scaleStep / 100;
-                } else {
-                    return imgState.imgScale / 10;
-                }
-            });
+      const getScaleStep = computed(() => {
+        const scaleStep = props?.scaleStep ?? 0;
+        if (scaleStep ?? (0 > 0 && scaleStep < 100)) {
+          return scaleStep / 100;
+        } else {
+          return imgState.imgScale / 10;
+        }
+      });
 
-            // 监听鼠标滚轮
-            function scrollFunc(e: any) {
-                e = e || window.event;
-                e.delta = e.wheelDelta || -e.detail;
+      // 监听鼠标滚轮
+      function scrollFunc(e: any) {
+        e = e || window.event;
+        e.delta = e.wheelDelta || -e.detail;
 
-                e.preventDefault();
-                if (e.delta > 0) {
-                    // 滑轮向上滚动
-                    scaleFunc(getScaleStep.value);
-                }
-                if (e.delta < 0) {
-                    // 滑轮向下滚动
-                    scaleFunc(-getScaleStep.value);
-                }
-            }
-            // 缩放函数
-            function scaleFunc(num: number) {
-                if (imgState.imgScale <= 0.2 && num < 0) return;
-                imgState.imgScale += num;
-            }
+        e.preventDefault();
+        if (e.delta > 0) {
+          // 滑轮向上滚动
+          scaleFunc(getScaleStep.value);
+        }
+        if (e.delta < 0) {
+          // 滑轮向下滚动
+          scaleFunc(-getScaleStep.value);
+        }
+      }
+      // 缩放函数
+      function scaleFunc(num: number) {
+        if (imgState.imgScale <= 0.2 && num < 0) return;
+        imgState.imgScale += num;
+      }
 
-            // 旋转图片
-            function rotateFunc(deg: number) {
-                imgState.imgRotate += deg;
-            }
+      // 旋转图片
+      function rotateFunc(deg: number) {
+        imgState.imgRotate += deg;
+      }
 
-            // 鼠标事件
-            function handleMouseUp() {
-                const imgEl = unref(imgElRef);
-                if (!imgEl) return;
-                imgEl.onmousemove = null;
-            }
+      // 鼠标事件
+      function handleMouseUp() {
+        const imgEl = unref(imgElRef);
+        if (!imgEl) return;
+        imgEl.onmousemove = null;
+      }
 
-            // 更换图片
-            function handleIChangeImage(url: string) {
-                imgState.status = StatueEnum.LOADING;
-                const img = new Image();
-                img.src = url;
-                img.onload = (e: Event) => {
-                    if (imgState.currentUrl !== url) {
-                        const ele: any[] = e.composedPath();
-                        if (props.rememberState) {
-                            // 保存当前图片的缩放信息
-                            stateMap.set(imgState.currentUrl, {
-                                scale: imgState.imgScale,
-                                top: imgState.imgTop,
-                                left: imgState.imgLeft,
-                                rotate: imgState.imgRotate,
-                            });
-                            // 如果之前已存储缩放信息，就应用
-                            const stateInfo = stateMap.get(url);
-                            if (stateInfo) {
-                                imgState.imgScale = stateInfo.scale;
-                                imgState.imgTop = stateInfo.top;
-                                imgState.imgRotate = stateInfo.rotate;
-                                imgState.imgLeft = stateInfo.left;
-                            } else {
-                                initState();
-                                if (props.defaultWidth) {
-                                    imgState.imgScale = props.defaultWidth / ele[0].naturalWidth;
-                                }
-                            }
-                        } else {
-                            if (props.defaultWidth) {
-                                imgState.imgScale = props.defaultWidth / ele[0].naturalWidth;
-                            }
-                        }
-
-                        ele &&
-                        emit('img-load', {
-                            index: imgState.currentIndex,
-                            dom: ele[0] as HTMLImageElement,
-                            url,
-                        });
-                    }
-                    imgState.currentUrl = url;
-                    imgState.status = StatueEnum.DONE;
-                };
-                img.onerror = (e: Event) => {
-                    const ele: EventTarget[] = e.composedPath();
-                    ele &&
-                    emit('img-error', {
-                        index: imgState.currentIndex,
-                        dom: ele[0] as HTMLImageElement,
-                        url,
-                    });
-                    imgState.status = StatueEnum.FAIL;
-                };
-            }
-
-            // 关闭
-            function handleClose(e: MouseEvent) {
-                e && e.stopPropagation();
-                close();
-            }
-
-            function close() {
-                imgState.show = false;
-                // 移除火狐浏览器下的鼠标滚动事件
-                document.body.removeEventListener('DOMMouseScroll', scrollFunc);
-                // 恢复火狐及Safari浏览器下的图片拖拽
-                document.ondragstart = null;
-            }
-
-            // 图片复原
-            function resume() {
+      // 更换图片
+      function handleIChangeImage(url: string) {
+        imgState.status = StatueEnum.LOADING;
+        const img = new Image();
+        img.src = url;
+        img.onload = (e: Event) => {
+          if (imgState.currentUrl !== url) {
+            const ele: any[] = e.composedPath();
+            if (props.rememberState) {
+              // 保存当前图片的缩放信息
+              stateMap.set(imgState.currentUrl, {
+                scale: imgState.imgScale,
+                top: imgState.imgTop,
+                left: imgState.imgLeft,
+                rotate: imgState.imgRotate,
+              });
+              // 如果之前已存储缩放信息，就应用
+              const stateInfo = stateMap.get(url);
+              if (stateInfo) {
+                imgState.imgScale = stateInfo.scale;
+                imgState.imgTop = stateInfo.top;
+                imgState.imgRotate = stateInfo.rotate;
+                imgState.imgLeft = stateInfo.left;
+              } else {
                 initState();
+                if (props.defaultWidth) {
+                  imgState.imgScale = props.defaultWidth / ele[0].naturalWidth;
+                }
+              }
+            } else {
+              if (props.defaultWidth) {
+                imgState.imgScale = props.defaultWidth / ele[0].naturalWidth;
+              }
             }
 
-            expose({
-                resume,
-                close,
-                prev: handleChange.bind(null, 'left'),
-                next: handleChange.bind(null, 'right'),
-                setScale: (scale: number) => {
-                    if (scale > 0 && scale <= 10) imgState.imgScale = scale;
-                },
-                setRotate: (rotate: number) => {
-                    imgState.imgRotate = rotate;
-                },
+            ele &&
+              emit('img-load', {
+                index: imgState.currentIndex,
+                dom: ele[0] as HTMLImageElement,
+                url,
+              });
+          }
+          imgState.currentUrl = url;
+          imgState.status = StatueEnum.DONE;
+        };
+        img.onerror = (e: Event) => {
+          const ele: EventTarget[] = e.composedPath();
+          ele &&
+            emit('img-error', {
+              index: imgState.currentIndex,
+              dom: ele[0] as HTMLImageElement,
+              url,
             });
+          imgState.status = StatueEnum.FAIL;
+        };
+      }
 
-            // 上一页下一页
-            function handleChange(direction: 'left' | 'right') {
-                const { currentIndex } = imgState;
-                const { imageList } = props;
-                if (direction === 'left') {
-                    imgState.currentIndex--;
-                    if (currentIndex <= 0) {
-                        imgState.currentIndex = imageList.length - 1;
-                    }
-                }
-                if (direction === 'right') {
-                    imgState.currentIndex++;
-                    if (currentIndex >= imageList.length - 1) {
-                        imgState.currentIndex = 0;
-                    }
-                }
-                handleIChangeImage(imageList[imgState.currentIndex]);
-            }
+      // 关闭
+      function handleClose(e: MouseEvent) {
+        e && e.stopPropagation();
+        close();
+      }
 
-            function handleAddMoveListener(e: MouseEvent) {
-                e = e || window.event;
-                imgState.moveX = e.clientX;
-                imgState.moveY = e.clientY;
-                const imgEl = unref(imgElRef);
-                if (imgEl) {
-                    imgEl.onmousemove = moveFunc;
-                }
-            }
+      function close() {
+        imgState.show = false;
+        // 移除火狐浏览器下的鼠标滚动事件
+        document.body.removeEventListener('DOMMouseScroll', scrollFunc);
+        // 恢复火狐及Safari浏览器下的图片拖拽
+        document.ondragstart = null;
+      }
 
-            function moveFunc(e: MouseEvent) {
-                e = e || window.event;
-                e.preventDefault();
-                const movementX = e.clientX - imgState.moveX;
-                const movementY = e.clientY - imgState.moveY;
-                imgState.imgLeft += movementX;
-                imgState.imgTop += movementY;
-                imgState.moveX = e.clientX;
-                imgState.moveY = e.clientY;
-            }
+      // 图片复原
+      function resume() {
+        initState();
+      }
 
-            // 获取图片样式
-            const getImageStyle = computed(() => {
-                const { imgScale, imgRotate, imgTop, imgLeft } = imgState;
-                return {
-                    transform: `scale(${imgScale}) rotate(${imgRotate}deg)`,
-                    marginTop: `${imgTop}px`,
-                    marginLeft: `${imgLeft}px`,
-                    maxWidth: props.defaultWidth ? 'unset' : '100%',
-                };
-            });
-
-            const getIsMultipleImage = computed(() => {
-                const { imageList } = props;
-                return imageList.length > 1;
-            });
-
-            watchEffect(() => {
-                if (props.show) {
-                    init();
-                }
-                if (props.imageList) {
-                    initState();
-                }
-            });
-
-            const handleMaskClick = (e: MouseEvent) => {
-                if (
-                    props.maskClosable &&
-                    e.target &&
-                    (e.target as HTMLDivElement).classList.contains(`${prefixCls}-content`)
-                ) {
-                    handleClose(e);
-                }
-            };
-
-            const renderClose = () => {
-                return (
-                    <div class={`${prefixCls}__close`} onClick={handleClose}>
-                        <CloseOutlined class={`${prefixCls}__close-icon`} />
-                    </div>
-                );
-            };
-
-            const renderIndex = () => {
-                if (!unref(getIsMultipleImage)) {
-                    return null;
-                }
-                const { currentIndex } = imgState;
-                const { imageList } = props;
-                return (
-                    <div class={`${prefixCls}__index`}>
-                        {currentIndex + 1} / {imageList.length}
-                    </div>
-                );
-            };
-
-            const renderController = () => {
-                return (
-                    <div class={`${prefixCls}__controller`}>
-                        <div
-                            class={`${prefixCls}__controller-item`}
-                            onClick={() => scaleFunc(-getScaleStep.value)}
-                        >
-                            <img src={unScaleSvg} />
-                        </div>
-                        <div
-                            class={`${prefixCls}__controller-item`}
-                            onClick={() => scaleFunc(getScaleStep.value)}
-                        >
-                            <img src={scaleSvg} />
-                        </div>
-                        <div class={`${prefixCls}__controller-item`} onClick={resume}>
-                            <img src={resumeSvg} />
-                        </div>
-                        <div class={`${prefixCls}__controller-item`} onClick={() => rotateFunc(-90)}>
-                            <img src={unRotateSvg} />
-                        </div>
-                        <div class={`${prefixCls}__controller-item`} onClick={() => rotateFunc(90)}>
-                            <img src={rotateSvg} />
-                        </div>
-                    </div>
-                );
-            };
-
-            const renderArrow = (direction: 'left' | 'right') => {
-                if (!unref(getIsMultipleImage)) {
-                    return null;
-                }
-                return (
-                    <div class={[`${prefixCls}__arrow`, direction]} onClick={() => handleChange(direction)}>
-                        {direction === 'left' ? <LeftOutlined /> : <RightOutlined />}
-                    </div>
-                );
-            };
-
-            return () => {
-                return (
-                    imgState.show && (
-                        <div
-                            class={prefixCls}
-                            ref={wrapElRef}
-                            onMouseup={handleMouseUp}
-                            onClick={handleMaskClick}
-                        >
-                            <div class={`${prefixCls}-content`}>
-                                {/*<Spin*/}
-                                {/*  indicator={<LoadingOutlined style="font-size: 24px" spin />}*/}
-                                {/*  spinning={true}*/}
-                                {/*  class={[*/}
-                                {/*    `${prefixCls}-image`,*/}
-                                {/*    {*/}
-                                {/*      hidden: imgState.status !== StatueEnum.LOADING,*/}
-                                {/*    },*/}
-                                {/*  ]}*/}
-                                {/*/>*/}
-                                <img
-                                    style={unref(getImageStyle)}
-                                    class={[
-                                        `${prefixCls}-image`,
-                                        imgState.status === StatueEnum.DONE ? '' : 'hidden',
-                                    ]}
-                                    ref={imgElRef}
-                                    src={imgState.currentUrl}
-                                    onMousedown={handleAddMoveListener}
-                                />
-                                {renderClose()}
-                                {renderIndex()}
-                                {renderController()}
-                                {renderArrow('left')}
-                                {renderArrow('right')}
-                            </div>
-                        </div>
-                    )
-                );
-            };
+      expose({
+        resume,
+        close,
+        prev: handleChange.bind(null, 'left'),
+        next: handleChange.bind(null, 'right'),
+        setScale: (scale: number) => {
+          if (scale > 0 && scale <= 10) imgState.imgScale = scale;
         },
-    });
+        setRotate: (rotate: number) => {
+          imgState.imgRotate = rotate;
+        },
+      });
+
+      // 上一页下一页
+      function handleChange(direction: 'left' | 'right') {
+        const { currentIndex } = imgState;
+        const { imageList } = props;
+        if (direction === 'left') {
+          imgState.currentIndex--;
+          if (currentIndex <= 0) {
+            imgState.currentIndex = imageList.length - 1;
+          }
+        }
+        if (direction === 'right') {
+          imgState.currentIndex++;
+          if (currentIndex >= imageList.length - 1) {
+            imgState.currentIndex = 0;
+          }
+        }
+        handleIChangeImage(imageList[imgState.currentIndex]);
+      }
+
+      function handleAddMoveListener(e: MouseEvent) {
+        e = e || window.event;
+        imgState.moveX = e.clientX;
+        imgState.moveY = e.clientY;
+        const imgEl = unref(imgElRef);
+        if (imgEl) {
+          imgEl.onmousemove = moveFunc;
+        }
+      }
+
+      function moveFunc(e: MouseEvent) {
+        e = e || window.event;
+        e.preventDefault();
+        const movementX = e.clientX - imgState.moveX;
+        const movementY = e.clientY - imgState.moveY;
+        imgState.imgLeft += movementX;
+        imgState.imgTop += movementY;
+        imgState.moveX = e.clientX;
+        imgState.moveY = e.clientY;
+      }
+
+      // 获取图片样式
+      const getImageStyle = computed(() => {
+        const { imgScale, imgRotate, imgTop, imgLeft } = imgState;
+        return {
+          transform: `scale(${imgScale}) rotate(${imgRotate}deg)`,
+          marginTop: `${imgTop}px`,
+          marginLeft: `${imgLeft}px`,
+          maxWidth: props.defaultWidth ? 'unset' : '100%',
+        };
+      });
+
+      const getIsMultipleImage = computed(() => {
+        const { imageList } = props;
+        return imageList.length > 1;
+      });
+
+      watchEffect(() => {
+        if (props.show) {
+          init();
+        }
+        if (props.imageList) {
+          initState();
+        }
+      });
+
+      const handleMaskClick = (e: MouseEvent) => {
+        if (props.maskClosable && e.target && (e.target as HTMLDivElement).classList.contains(`${prefixCls}-content`)) {
+          handleClose(e);
+        }
+      };
+
+      const renderClose = () => {
+        return (
+          <div class={`${prefixCls}__close`} onClick={handleClose}>
+            <CloseOutlined class={`${prefixCls}__close-icon`} />
+          </div>
+        );
+      };
+
+      const renderIndex = () => {
+        if (!unref(getIsMultipleImage)) {
+          return null;
+        }
+        const { currentIndex } = imgState;
+        const { imageList } = props;
+        return (
+          <div class={`${prefixCls}__index`}>
+            {currentIndex + 1} / {imageList.length}
+          </div>
+        );
+      };
+
+      const renderController = () => {
+        return (
+          <div class={`${prefixCls}__controller`}>
+            <div class={`${prefixCls}__controller-item`} onClick={() => scaleFunc(-getScaleStep.value)}>
+              <img src={unScaleSvg} />
+            </div>
+            <div class={`${prefixCls}__controller-item`} onClick={() => scaleFunc(getScaleStep.value)}>
+              <img src={scaleSvg} />
+            </div>
+            <div class={`${prefixCls}__controller-item`} onClick={resume}>
+              <img src={resumeSvg} />
+            </div>
+            <div class={`${prefixCls}__controller-item`} onClick={() => rotateFunc(-90)}>
+              <img src={unRotateSvg} />
+            </div>
+            <div class={`${prefixCls}__controller-item`} onClick={() => rotateFunc(90)}>
+              <img src={rotateSvg} />
+            </div>
+          </div>
+        );
+      };
+
+      const renderArrow = (direction: 'left' | 'right') => {
+        if (!unref(getIsMultipleImage)) {
+          return null;
+        }
+        return (
+          <div class={[`${prefixCls}__arrow`, direction]} onClick={() => handleChange(direction)}>
+            {direction === 'left' ? <LeftOutlined /> : <RightOutlined />}
+          </div>
+        );
+      };
+
+      return () => {
+        return (
+          imgState.show && (
+            <div class={prefixCls} ref={wrapElRef} onMouseup={handleMouseUp} onClick={handleMaskClick}>
+              <div class={`${prefixCls}-content`}>
+                {/*<Spin*/}
+                {/*  indicator={<LoadingOutlined style="font-size: 24px" spin />}*/}
+                {/*  spinning={true}*/}
+                {/*  class={[*/}
+                {/*    `${prefixCls}-image`,*/}
+                {/*    {*/}
+                {/*      hidden: imgState.status !== StatueEnum.LOADING,*/}
+                {/*    },*/}
+                {/*  ]}*/}
+                {/*/>*/}
+                <img
+                  style={unref(getImageStyle)}
+                  class={[`${prefixCls}-image`, imgState.status === StatueEnum.DONE ? '' : 'hidden']}
+                  ref={imgElRef}
+                  src={imgState.currentUrl}
+                  onMousedown={handleAddMoveListener}
+                />
+                {renderClose()}
+                {renderIndex()}
+                {renderController()}
+                {renderArrow('left')}
+                {renderArrow('right')}
+              </div>
+            </div>
+          )
+        );
+      };
+    },
+  });
 </script>
 <style lang="less">
-    .img-preview {
-        position: fixed;
-        top: 0;
-        right: 0;
-        bottom: 0;
-        left: 0;
-        z-index: @preview-comp-z-index;
-        background: rgba(0, 0, 0, 0.5);
-        user-select: none;
+  .img-preview {
+    position: fixed;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: @preview-comp-z-index;
+    background: rgba(0, 0, 0, 0.5);
+    user-select: none;
 
-        &-content {
-            display: flex;
-            width: 100%;
-            height: 100%;
-            color: @white;
-            justify-content: center;
-            align-items: center;
-        }
-
-        &-image {
-            cursor: pointer;
-            transition: transform 0.3s;
-        }
-
-        &__close {
-            position: absolute;
-            top: -40px;
-            right: -40px;
-            width: 80px;
-            height: 80px;
-            overflow: hidden;
-            color: @white;
-            cursor: pointer;
-            background-color: rgba(0, 0, 0, 0.5);
-            border-radius: 50%;
-            transition: all 0.2s;
-
-            &-icon {
-                position: absolute;
-                top: 46px;
-                left: 16px;
-                font-size: 16px;
-            }
-
-            &:hover {
-                background-color: rgba(0, 0, 0, 0.8);
-            }
-        }
-
-        &__index {
-            position: absolute;
-            bottom: 5%;
-            left: 50%;
-            padding: 0 22px;
-            font-size: 16px;
-            background: rgba(109, 109, 109, 0.6);
-            border-radius: 15px;
-            transform: translateX(-50%);
-        }
-
-        &__controller {
-            position: absolute;
-            bottom: 10%;
-            left: 50%;
-            display: flex;
-            width: 260px;
-            height: 44px;
-            padding: 0 22px;
-            margin-left: -139px;
-            background: rgba(109, 109, 109, 0.6);
-            border-radius: 22px;
-            justify-content: center;
-
-            &-item {
-                display: flex;
-                height: 100%;
-                padding: 0 9px;
-                font-size: 24px;
-                cursor: pointer;
-                transition: all 0.2s;
-
-                &:hover {
-                    transform: scale(1.2);
-                }
-
-                img {
-                    width: 1em;
-                }
-            }
-        }
-
-        &__arrow {
-            position: absolute;
-            top: 50%;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            width: 50px;
-            height: 50px;
-            font-size: 28px;
-            cursor: pointer;
-            background-color: rgba(0, 0, 0, 0.5);
-            border-radius: 50%;
-            transition: all 0.2s;
-
-            &:hover {
-                background-color: rgba(0, 0, 0, 0.8);
-            }
-
-            &.left {
-                left: 50px;
-            }
-
-            &.right {
-                right: 50px;
-            }
-        }
+    &-content {
+      display: flex;
+      width: 100%;
+      height: 100%;
+      color: @white;
+      justify-content: center;
+      align-items: center;
     }
+
+    &-image {
+      cursor: pointer;
+      transition: transform 0.3s;
+    }
+
+    &__close {
+      position: absolute;
+      top: -40px;
+      right: -40px;
+      width: 80px;
+      height: 80px;
+      overflow: hidden;
+      color: @white;
+      cursor: pointer;
+      background-color: rgba(0, 0, 0, 0.5);
+      border-radius: 50%;
+      transition: all 0.2s;
+
+      &-icon {
+        position: absolute;
+        top: 46px;
+        left: 16px;
+        font-size: 16px;
+      }
+
+      &:hover {
+        background-color: rgba(0, 0, 0, 0.8);
+      }
+    }
+
+    &__index {
+      position: absolute;
+      bottom: 5%;
+      left: 50%;
+      padding: 0 22px;
+      font-size: 16px;
+      background: rgba(109, 109, 109, 0.6);
+      border-radius: 15px;
+      transform: translateX(-50%);
+    }
+
+    &__controller {
+      position: absolute;
+      bottom: 10%;
+      left: 50%;
+      display: flex;
+      width: 260px;
+      height: 44px;
+      padding: 0 22px;
+      margin-left: -139px;
+      background: rgba(109, 109, 109, 0.6);
+      border-radius: 22px;
+      justify-content: center;
+
+      &-item {
+        display: flex;
+        height: 100%;
+        padding: 0 9px;
+        font-size: 24px;
+        cursor: pointer;
+        transition: all 0.2s;
+
+        &:hover {
+          transform: scale(1.2);
+        }
+
+        img {
+          width: 1em;
+        }
+      }
+    }
+
+    &__arrow {
+      position: absolute;
+      top: 50%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 50px;
+      height: 50px;
+      font-size: 28px;
+      cursor: pointer;
+      background-color: rgba(0, 0, 0, 0.5);
+      border-radius: 50%;
+      transition: all 0.2s;
+
+      &:hover {
+        background-color: rgba(0, 0, 0, 0.8);
+      }
+
+      &.left {
+        left: 50px;
+      }
+
+      &.right {
+        right: 50px;
+      }
+    }
+  }
 </style>
diff --git a/src/components/Preview/src/Preview.vue b/src/components/Preview/src/Preview.vue
index f6f5d23..3bb0b14 100644
--- a/src/components/Preview/src/Preview.vue
+++ b/src/components/Preview/src/Preview.vue
@@ -31,12 +31,12 @@
     height?: string | number;
     placeholder?: string | boolean;
     preview?:
-            | boolean
-            | {
-      visible?: boolean;
-      onVisibleChange?: (visible: boolean, prevVisible: boolean) => void;
-      getContainer: string | HTMLElement | (() => HTMLElement);
-    };
+      | boolean
+      | {
+          visible?: boolean;
+          onVisibleChange?: (visible: boolean, prevVisible: boolean) => void;
+          getContainer: string | HTMLElement | (() => HTMLElement);
+        };
   }
 
   type ImageItem = string | ImageProps;
diff --git a/src/components/Preview/src/functional.ts b/src/components/Preview/src/functional.ts
index bd97cd1..e4b27d6 100644
--- a/src/components/Preview/src/functional.ts
+++ b/src/components/Preview/src/functional.ts
@@ -1,18 +1,18 @@
-import type {Options, Props} from './typing';
+import type { Options, Props } from './typing';
 import ImgPreview from './Functional.vue';
-import {isClient} from '/@/utils/is';
-import {createVNode, render} from 'vue';
+import { isClient } from '/@/utils/is';
+import { createVNode, render } from 'vue';
 
 let instance: ReturnType<typeof createVNode> | null = null;
 
 export function createImgPreview(options: Options) {
-    if (!isClient) return;
-    const propsData: Partial<Props> = {};
-    const container = document.createElement('div');
-    Object.assign(propsData, {show: true, index: 0, scaleStep: 100}, options);
+  if (!isClient) return;
+  const propsData: Partial<Props> = {};
+  const container = document.createElement('div');
+  Object.assign(propsData, { show: true, index: 0, scaleStep: 100 }, options);
 
-    instance = createVNode(ImgPreview, propsData);
-    render(instance, container);
-    document.body.appendChild(container);
-    return instance.component?.exposed;
+  instance = createVNode(ImgPreview, propsData);
+  render(instance, container);
+  document.body.appendChild(container);
+  return instance.component?.exposed;
 }
diff --git a/src/components/Preview/src/typing.ts b/src/components/Preview/src/typing.ts
index e0ffd80..bbb8a83 100644
--- a/src/components/Preview/src/typing.ts
+++ b/src/components/Preview/src/typing.ts
@@ -1,49 +1,49 @@
 export interface Options {
-    show?: boolean;
-    imageList: string[];
-    index?: number;
-    scaleStep?: number;
-    defaultWidth?: number;
-    maskClosable?: boolean;
-    rememberState?: boolean;
-    onImgLoad?: ({index: number, url: string, dom: HTMLImageElement}) => void;
-    onImgError?: ({index: number, url: string, dom: HTMLImageElement}) => void;
+  show?: boolean;
+  imageList: string[];
+  index?: number;
+  scaleStep?: number;
+  defaultWidth?: number;
+  maskClosable?: boolean;
+  rememberState?: boolean;
+  onImgLoad?: ({ index: number, url: string, dom: HTMLImageElement }) => void;
+  onImgError?: ({ index: number, url: string, dom: HTMLImageElement }) => void;
 }
 
 export interface Props {
-    show: boolean;
-    instance: Props;
-    imageList: string[];
-    index: number;
-    scaleStep: number;
-    defaultWidth: number;
-    maskClosable: boolean;
-    rememberState: boolean;
+  show: boolean;
+  instance: Props;
+  imageList: string[];
+  index: number;
+  scaleStep: number;
+  defaultWidth: number;
+  maskClosable: boolean;
+  rememberState: boolean;
 }
 
 export interface PreviewActions {
-    resume: () => void;
-    close: () => void;
-    prev: () => void;
-    next: () => void;
-    setScale: (scale: number) => void;
-    setRotate: (rotate: number) => void;
+  resume: () => void;
+  close: () => void;
+  prev: () => void;
+  next: () => void;
+  setScale: (scale: number) => void;
+  setRotate: (rotate: number) => void;
 }
 
 export interface ImageProps {
-    alt?: string;
-    fallback?: string;
-    src: string;
-    width: string | number;
-    height?: string | number;
-    placeholder?: string | boolean;
-    preview?:
-        | boolean
-        | {
+  alt?: string;
+  fallback?: string;
+  src: string;
+  width: string | number;
+  height?: string | number;
+  placeholder?: string | boolean;
+  preview?:
+    | boolean
+    | {
         visible?: boolean;
         onVisibleChange?: (visible: boolean, prevVisible: boolean) => void;
         getContainer: string | HTMLElement | (() => HTMLElement);
-    };
+      };
 }
 
 export type ImageItem = string | ImageProps;
diff --git a/src/components/Qrcode/src/Qrcode.vue b/src/components/Qrcode/src/Qrcode.vue
index 74eaa6f..a8df59f 100644
--- a/src/components/Qrcode/src/Qrcode.vue
+++ b/src/components/Qrcode/src/Qrcode.vue
@@ -97,13 +97,13 @@
 
       // 监听参数变化重新生成二维码
       watch(
-              props,
-              () => {
-                createQrcode();
-              },
-              {
-                deep: true,
-              }
+        props,
+        () => {
+          createQrcode();
+        },
+        {
+          deep: true,
+        }
       );
 
       return { wrapRef, download };
diff --git a/src/components/Qrcode/src/drawCanvas.ts b/src/components/Qrcode/src/drawCanvas.ts
index 143ec5a..82aee5f 100644
--- a/src/components/Qrcode/src/drawCanvas.ts
+++ b/src/components/Qrcode/src/drawCanvas.ts
@@ -1,32 +1,32 @@
-import {toCanvas} from 'qrcode';
-import type {QRCodeRenderersOptions} from 'qrcode';
-import {RenderQrCodeParams, ContentType} from './typing';
-import {cloneDeep} from 'lodash-es';
+import { toCanvas } from 'qrcode';
+import type { QRCodeRenderersOptions } from 'qrcode';
+import { RenderQrCodeParams, ContentType } from './typing';
+import { cloneDeep } from 'lodash-es';
 
-export const renderQrCode = ({canvas, content, width = 0, options: params = {}}: RenderQrCodeParams) => {
-    const options = cloneDeep(params)
-    // 容错率，默认对内容少的二维码采用高容错率，内容多的二维码采用低容错率
-    options.errorCorrectionLevel = options.errorCorrectionLevel || getErrorCorrectionLevel(content);
+export const renderQrCode = ({ canvas, content, width = 0, options: params = {} }: RenderQrCodeParams) => {
+  const options = cloneDeep(params);
+  // 容错率，默认对内容少的二维码采用高容错率，内容多的二维码采用低容错率
+  options.errorCorrectionLevel = options.errorCorrectionLevel || getErrorCorrectionLevel(content);
 
-    return getOriginWidth(content, options).then((_width: number) => {
-        options.scale = width === 0 ? undefined : (width / _width) * 4;
-        return toCanvas(canvas, content, options);
-    });
+  return getOriginWidth(content, options).then((_width: number) => {
+    options.scale = width === 0 ? undefined : (width / _width) * 4;
+    return toCanvas(canvas, content, options);
+  });
 };
 
 // 得到原QrCode的大小，以便缩放得到正确的QrCode大小
 function getOriginWidth(content: ContentType, options: QRCodeRenderersOptions) {
-    const _canvas = document.createElement('canvas');
-    return toCanvas(_canvas, content, options).then(() => _canvas.width);
+  const _canvas = document.createElement('canvas');
+  return toCanvas(_canvas, content, options).then(() => _canvas.width);
 }
 
 // 对于内容少的QrCode，增大容错率
 function getErrorCorrectionLevel(content: ContentType) {
-    if (content.length > 36) {
-        return 'M';
-    } else if (content.length > 16) {
-        return 'Q';
-    } else {
-        return 'H';
-    }
+  if (content.length > 36) {
+    return 'M';
+  } else if (content.length > 16) {
+    return 'Q';
+  } else {
+    return 'H';
+  }
 }
diff --git a/src/components/Qrcode/src/drawLogo.ts b/src/components/Qrcode/src/drawLogo.ts
index 85a160f..dbfe292 100644
--- a/src/components/Qrcode/src/drawLogo.ts
+++ b/src/components/Qrcode/src/drawLogo.ts
@@ -7,14 +7,7 @@ export const drawLogo = ({ canvas, logo }: RenderQrCodeParams) => {
     });
   }
   const canvasWidth = (canvas as HTMLCanvasElement).width;
-  const {
-    logoSize = 0.15,
-    bgColor = '#ffffff',
-    borderSize = 0.05,
-    crossOrigin,
-    borderRadius = 8,
-    logoRadius = 0,
-  } = logo as LogoType;
+  const { logoSize = 0.15, bgColor = '#ffffff', borderSize = 0.05, crossOrigin, borderRadius = 8, logoRadius = 0 } = logo as LogoType;
 
   const logoSrc: string = isString(logo) ? logo : logo.src;
   const logoWidth = canvasWidth * logoSize;
diff --git a/src/components/Scrollbar/src/Scrollbar.vue b/src/components/Scrollbar/src/Scrollbar.vue
index ec56780..3ea4a02 100644
--- a/src/components/Scrollbar/src/Scrollbar.vue
+++ b/src/components/Scrollbar/src/Scrollbar.vue
@@ -1,11 +1,6 @@
 <template>
   <div class="scrollbar">
-    <div
-      ref="wrap"
-      :class="[wrapClass, 'scrollbar__wrap', native ? '' : 'scrollbar__wrap--hidden-default']"
-      :style="style"
-      @scroll="handleScroll"
-    >
+    <div ref="wrap" :class="[wrapClass, 'scrollbar__wrap', native ? '' : 'scrollbar__wrap--hidden-default']" :style="style" @scroll="handleScroll">
       <component :is="tag" ref="resize" :class="['scrollbar__view', viewClass]" :style="viewStyle">
         <slot></slot>
       </component>
@@ -21,16 +16,7 @@
   import componentSetting from '/@/settings/componentSetting';
   const { scrollbar } = componentSetting;
   import { toObject } from './util';
-  import {
-    defineComponent,
-    ref,
-    onMounted,
-    onBeforeUnmount,
-    nextTick,
-    provide,
-    computed,
-    unref,
-  } from 'vue';
+  import { defineComponent, ref, onMounted, onBeforeUnmount, nextTick, provide, computed, unref } from 'vue';
   import Bar from './bar';
 
   export default defineComponent({
diff --git a/src/components/Scrollbar/src/bar.ts b/src/components/Scrollbar/src/bar.ts
index ddde740..0e944c7 100644
--- a/src/components/Scrollbar/src/bar.ts
+++ b/src/components/Scrollbar/src/bar.ts
@@ -1,13 +1,4 @@
-import {
-  defineComponent,
-  h,
-  computed,
-  ref,
-  getCurrentInstance,
-  onUnmounted,
-  inject,
-  Ref,
-} from 'vue';
+import { defineComponent, h, computed, ref, getCurrentInstance, onUnmounted, inject, Ref } from 'vue';
 import { on, off } from '/@/utils/domUtils';
 
 import { renderThumbStyle, BAR_MAP } from './util';
@@ -37,21 +28,15 @@ export default defineComponent({
       }
       window.getSelection()?.removeAllRanges();
       startDrag(e);
-      barStore.value[bar.value.axis] =
-        e.currentTarget[bar.value.offset] -
-        (e[bar.value.client] - e.currentTarget.getBoundingClientRect()[bar.value.direction]);
+      barStore.value[bar.value.axis] = e.currentTarget[bar.value.offset] - (e[bar.value.client] - e.currentTarget.getBoundingClientRect()[bar.value.direction]);
     };
 
     const clickTrackHandler = (e: any) => {
-      const offset = Math.abs(
-        e.target.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]
-      );
+      const offset = Math.abs(e.target.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]);
       const thumbHalf = thumb.value[bar.value.offset] / 2;
-      const thumbPositionPercentage =
-        ((offset - thumbHalf) * 100) / instance?.vnode.el?.[bar.value.offset];
+      const thumbPositionPercentage = ((offset - thumbHalf) * 100) / instance?.vnode.el?.[bar.value.offset];
 
-      wrap.value[bar.value.scroll] =
-        (thumbPositionPercentage * wrap.value[bar.value.scrollSize]) / 100;
+      wrap.value[bar.value.scroll] = (thumbPositionPercentage * wrap.value[bar.value.scrollSize]) / 100;
     };
     const startDrag = (e: any) => {
       e.stopImmediatePropagation();
@@ -67,14 +52,10 @@ export default defineComponent({
 
       if (!prevPage) return;
 
-      const offset =
-        (instance?.vnode.el?.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]) *
-        -1;
+      const offset = (instance?.vnode.el?.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]) * -1;
       const thumbClickPosition = thumb.value[bar.value.offset] - prevPage;
-      const thumbPositionPercentage =
-        ((offset - thumbClickPosition) * 100) / instance?.vnode.el?.[bar.value.offset];
-      wrap.value[bar.value.scroll] =
-        (thumbPositionPercentage * wrap.value[bar.value.scrollSize]) / 100;
+      const thumbPositionPercentage = ((offset - thumbClickPosition) * 100) / instance?.vnode.el?.[bar.value.offset];
+      wrap.value[bar.value.scroll] = (thumbPositionPercentage * wrap.value[bar.value.scrollSize]) / 100;
     };
 
     function mouseUpDocumentHandler() {
diff --git a/src/components/SimpleMenu/src/SimpleMenu.vue b/src/components/SimpleMenu/src/SimpleMenu.vue
index 5855290..d366544 100644
--- a/src/components/SimpleMenu/src/SimpleMenu.vue
+++ b/src/components/SimpleMenu/src/SimpleMenu.vue
@@ -1,19 +1,7 @@
 <template>
-  <Menu
-    v-bind="getBindValues"
-    :activeName="activeName"
-    :openNames="getOpenKeys"
-    :class="prefixCls"
-    :activeSubMenuNames="activeSubMenuNames"
-    @select="handleSelect"
-  >
+  <Menu v-bind="getBindValues" :activeName="activeName" :openNames="getOpenKeys" :class="prefixCls" :activeSubMenuNames="activeSubMenuNames" @select="handleSelect">
     <template v-for="item in items" :key="item.path">
-      <SimpleSubMenu
-        :item="item"
-        :parent="true"
-        :collapsedShowTitle="collapsedShowTitle"
-        :collapse="collapse"
-      />
+      <SimpleSubMenu :item="item" :parent="true" :collapsedShowTitle="collapsedShowTitle" :collapse="collapse" />
     </template>
   </Menu>
 </template>
@@ -33,7 +21,7 @@
   import { openWindow } from '/@/utils';
 
   import { useOpenKeys } from './useOpenKeys';
-  import {URL_HASH_TAB} from '/@/utils'
+  import { URL_HASH_TAB } from '/@/utils';
 
   export default defineComponent({
     name: 'SimpleMenu',
@@ -72,13 +60,7 @@
       const { prefixCls } = useDesign('simple-menu');
       const { items, accordion, mixSider, collapse } = toRefs(props);
 
-      const { setOpenKeys, getOpenKeys } = useOpenKeys(
-        menuState,
-        items,
-        accordion,
-        mixSider,
-        collapse
-      );
+      const { setOpenKeys, getOpenKeys } = useOpenKeys(menuState, items, accordion, mixSider, collapse);
 
       const getBindValues = computed(() => ({ ...attrs, ...props }));
 
@@ -132,8 +114,8 @@
       async function handleSelect(key: string) {
         if (isUrl(key)) {
           // update-begin--author:sunjianlei---date:20220408---for: 【VUEN-656】配置外部网址打不开，原因是带了#号，需要替换一下
-          let url = key.replace(URL_HASH_TAB, '#')
-          openWindow(url)
+          let url = key.replace(URL_HASH_TAB, '#');
+          openWindow(url);
           // openWindow(key);
           // update-begin--author:sunjianlei---date:20220408---for: 【VUEN-656】配置外部网址打不开，原因是带了#号，需要替换一下
           return;
diff --git a/src/components/SimpleMenu/src/SimpleSubMenu.vue b/src/components/SimpleMenu/src/SimpleSubMenu.vue
index bb4e778..b64b494 100644
--- a/src/components/SimpleMenu/src/SimpleSubMenu.vue
+++ b/src/components/SimpleMenu/src/SimpleSubMenu.vue
@@ -1,10 +1,5 @@
 <template>
-  <MenuItem
-    :name="item.path"
-    v-if="!menuHasChildren(item) && getShowMenu"
-    v-bind="$props"
-    :class="getLevelClass"
-  >
+  <MenuItem :name="item.path" v-if="!menuHasChildren(item) && getShowMenu" v-bind="$props" :class="getLevelClass">
     <Icon v-if="getIcon" :icon="getIcon" :size="16" />
     <div v-if="collapsedShowTitle && getIsCollapseParent" class="mt-1 collapse-title">
       {{ getI18nName }}
@@ -16,12 +11,7 @@
       <SimpleMenuTag :item="item" :collapseParent="getIsCollapseParent" />
     </template>
   </MenuItem>
-  <SubMenu
-    :name="item.path"
-    v-if="menuHasChildren(item) && getShowMenu"
-    :class="[getLevelClass, theme]"
-    :collapsedShowTitle="collapsedShowTitle"
-  >
+  <SubMenu :name="item.path" v-if="menuHasChildren(item) && getShowMenu" :class="[getLevelClass, theme]" :collapsedShowTitle="collapsedShowTitle">
     <template #title>
       <Icon v-if="getIcon" :icon="getIcon" :size="16" />
 
@@ -90,12 +80,7 @@
       });
 
       function menuHasChildren(menuTreeItem: Menu): boolean {
-        return (
-          !menuTreeItem.meta?.hideChildrenInMenu &&
-          Reflect.has(menuTreeItem, 'children') &&
-          !!menuTreeItem.children &&
-          menuTreeItem.children.length > 0
-        );
+        return !menuTreeItem.meta?.hideChildrenInMenu && Reflect.has(menuTreeItem, 'children') && !!menuTreeItem.children && menuTreeItem.children.length > 0;
       }
 
       return {
diff --git a/src/components/SimpleMenu/src/components/Menu.vue b/src/components/SimpleMenu/src/components/Menu.vue
index 2490118..80c0f65 100644
--- a/src/components/SimpleMenu/src/components/Menu.vue
+++ b/src/components/SimpleMenu/src/components/Menu.vue
@@ -7,17 +7,7 @@
 <script lang="ts">
   import type { PropType } from 'vue';
   import type { SubMenuProvider } from './types';
-  import {
-    defineComponent,
-    ref,
-    computed,
-    onMounted,
-    watchEffect,
-    watch,
-    nextTick,
-    getCurrentInstance,
-    provide,
-  } from 'vue';
+  import { defineComponent, ref, computed, onMounted, watchEffect, watch, nextTick, getCurrentInstance, provide } from 'vue';
 
   import { useDesign } from '/@/hooks/web/useDesign';
   import { propTypes } from '/@/utils/propTypes';
@@ -82,12 +72,12 @@
       });
 
       watch(
-              () => props.openNames,
-              () => {
-                nextTick(() => {
-                  updateOpened();
-                });
-              }
+        () => props.openNames,
+        () => {
+          nextTick(() => {
+            updateOpened();
+          });
+        }
       );
 
       function updateOpened() {
diff --git a/src/components/SimpleMenu/src/components/MenuItem.vue b/src/components/SimpleMenu/src/components/MenuItem.vue
index 222c7b6..fa52f3c 100644
--- a/src/components/SimpleMenu/src/components/MenuItem.vue
+++ b/src/components/SimpleMenu/src/components/MenuItem.vue
@@ -39,8 +39,7 @@
 
       const active = ref(false);
 
-      const { getItemStyle, getParentList, getParentMenu, getParentRootMenu } =
-        useMenuItem(instance);
+      const { getItemStyle, getParentList, getParentMenu, getParentRootMenu } = useMenuItem(instance);
 
       const { prefixCls } = useDesign('menu');
 
diff --git a/src/components/SimpleMenu/src/components/SubMenuItem.vue b/src/components/SimpleMenu/src/components/SubMenuItem.vue
index 0cc9122..c7a1283 100644
--- a/src/components/SimpleMenu/src/components/SubMenuItem.vue
+++ b/src/components/SimpleMenu/src/components/SubMenuItem.vue
@@ -3,11 +3,7 @@
     <template v-if="!getCollapse">
       <div :class="`${prefixCls}-submenu-title`" @click.stop="handleClick" :style="getItemStyle">
         <slot name="title"></slot>
-        <Icon
-          icon="eva:arrow-ios-downward-outline"
-          :size="14"
-          :class="`${prefixCls}-submenu-title-icon`"
-        />
+        <Icon icon="eva:arrow-ios-downward-outline" :size="14" :class="`${prefixCls}-submenu-title-icon`" />
       </div>
       <CollapseTransition>
         <ul :class="prefixCls" v-show="opened">
@@ -36,12 +32,7 @@
         >
           <slot name="title"></slot>
         </div>
-        <Icon
-          v-if="getParentSubMenu"
-          icon="eva:arrow-ios-downward-outline"
-          :size="14"
-          :class="`${prefixCls}-submenu-title-icon`"
-        />
+        <Icon v-if="getParentSubMenu" icon="eva:arrow-ios-downward-outline" :size="14" :class="`${prefixCls}-submenu-title-icon`" />
       </div>
       <!-- eslint-disable-next-line -->
       <template #content v-show="opened">
@@ -58,17 +49,7 @@
 <script lang="ts">
   import type { CSSProperties, PropType } from 'vue';
   import type { SubMenuProvider } from './types';
-  import {
-    defineComponent,
-    computed,
-    unref,
-    getCurrentInstance,
-    toRefs,
-    reactive,
-    provide,
-    onBeforeMount,
-    inject,
-  } from 'vue';
+  import { defineComponent, computed, unref, getCurrentInstance, toRefs, reactive, provide, onBeforeMount, inject } from 'vue';
   import { useDesign } from '/@/hooks/web/useDesign';
   import { propTypes } from '/@/utils/propTypes';
   import { useMenuItem } from './useMenu';
@@ -109,8 +90,7 @@
         isChild: false,
       });
 
-      const { getParentSubMenu, getItemStyle, getParentMenu, getParentList } =
-        useMenuItem(instance);
+      const { getParentSubMenu, getItemStyle, getParentMenu, getParentList } = useMenuItem(instance);
 
       const { prefixCls } = useDesign('menu');
 
@@ -265,29 +245,26 @@
           clearTimeout(data.timeout!);
         });
 
-        rootMenuEmitter.on(
-          'on-update-opened',
-          (data: boolean | (string | number)[] | Recordable) => {
-            if (unref(getCollapse)) return;
-            if (isBoolean(data)) {
-              state.opened = data;
-              return;
-            }
-            if (isObject(data) && rootProps.accordion) {
-              const { opend, parent, uidList } = data as Recordable;
-              if (parent === instance?.parent) {
-                state.opened = opend;
-              } else if (!uidList.includes(instance?.uid)) {
-                state.opened = false;
-              }
-              return;
-            }
-
-            if (props.name && Array.isArray(data)) {
-              state.opened = (data as (string | number)[]).includes(props.name);
-            }
+        rootMenuEmitter.on('on-update-opened', (data: boolean | (string | number)[] | Recordable) => {
+          if (unref(getCollapse)) return;
+          if (isBoolean(data)) {
+            state.opened = data;
+            return;
           }
-        );
+          if (isObject(data) && rootProps.accordion) {
+            const { opend, parent, uidList } = data as Recordable;
+            if (parent === instance?.parent) {
+              state.opened = opend;
+            } else if (!uidList.includes(instance?.uid)) {
+              state.opened = false;
+            }
+            return;
+          }
+
+          if (props.name && Array.isArray(data)) {
+            state.opened = (data as (string | number)[]).includes(props.name);
+          }
+        });
 
         rootMenuEmitter.on('on-update-active-name:submenu', (data: number[]) => {
           if (instance?.uid) {
diff --git a/src/components/SimpleMenu/src/useOpenKeys.ts b/src/components/SimpleMenu/src/useOpenKeys.ts
index d06df7d..c38b92c 100644
--- a/src/components/SimpleMenu/src/useOpenKeys.ts
+++ b/src/components/SimpleMenu/src/useOpenKeys.ts
@@ -10,13 +10,7 @@ import { getAllParentPath } from '/@/router/helper/menuHelper';
 import { useTimeoutFn } from '/@/hooks/core/useTimeout';
 import { useDebounceFn } from '@vueuse/core';
 
-export function useOpenKeys(
-  menuState: MenuState,
-  menus: Ref<MenuType[]>,
-  accordion: Ref<boolean>,
-  mixSider: Ref<boolean>,
-  collapse: Ref<boolean>
-) {
+export function useOpenKeys(menuState: MenuState, menus: Ref<MenuType[]>, accordion: Ref<boolean>, mixSider: Ref<boolean>, collapse: Ref<boolean>) {
   const debounceSetOpenKeys = useDebounceFn(setOpenKeys, 50);
   async function setOpenKeys(path: string) {
     const native = !mixSider.value;
diff --git a/src/components/StrengthMeter/src/StrengthMeter.vue b/src/components/StrengthMeter/src/StrengthMeter.vue
index f3f06f0..ffb6548 100644
--- a/src/components/StrengthMeter/src/StrengthMeter.vue
+++ b/src/components/StrengthMeter/src/StrengthMeter.vue
@@ -1,13 +1,6 @@
 <template>
   <div :class="prefixCls" class="relative">
-    <InputPassword
-            v-if="showInput"
-            v-bind="$attrs"
-            allowClear
-            :value="innerValueRef"
-            @change="handleChange"
-            :disabled="disabled"
-    >
+    <InputPassword v-if="showInput" v-bind="$attrs" allowClear :value="innerValueRef" @change="handleChange" :disabled="disabled">
       <template #[item]="data" v-for="item in Object.keys($slots)">
         <slot :name="item" v-bind="data || {}"></slot>
       </template>
@@ -56,10 +49,10 @@
       });
 
       watch(
-              () => unref(innerValueRef),
-              (val) => {
-                emit('change', val);
-              }
+        () => unref(innerValueRef),
+        (val) => {
+          emit('change', val);
+        }
       );
 
       return {
diff --git a/src/components/Table/src/BasicTable.vue b/src/components/Table/src/BasicTable.vue
index f024026..5967c81 100644
--- a/src/components/Table/src/BasicTable.vue
+++ b/src/components/Table/src/BasicTable.vue
@@ -1,439 +1,405 @@
 <template>
-    <div ref="wrapRef" :class="getWrapperClass">
-        <BasicForm submitOnReset v-bind="getFormProps" v-if="getBindValues.useSearchForm" :tableAction="tableAction" @register="registerForm" @submit="handleSearchInfoChange" @advanced-change="redoHeight">
-            <template #[replaceFormSlotKey(item)]="data" v-for="item in getFormSlotKeys">
-                <slot :name="item" v-bind="data || {}"></slot>
-            </template>
-        </BasicForm>
+  <div ref="wrapRef" :class="getWrapperClass">
+    <BasicForm
+      submitOnReset
+      v-bind="getFormProps"
+      v-if="getBindValues.useSearchForm"
+      :tableAction="tableAction"
+      @register="registerForm"
+      @submit="handleSearchInfoChange"
+      @advanced-change="redoHeight"
+    >
+      <template #[replaceFormSlotKey(item)]="data" v-for="item in getFormSlotKeys">
+        <slot :name="item" v-bind="data || {}"></slot>
+      </template>
+    </BasicForm>
 
-        <Table ref="tableElRef" v-bind="getBindValues" :rowClassName="getRowClassName" v-show="getEmptyDataIsShowTable" @change="handleTableChange">
-            <template #[item]="data" v-for="item in Object.keys($slots)" :key="item">
-                <slot :name="item" v-bind="data || {}"></slot>
-            </template>
+    <Table ref="tableElRef" v-bind="getBindValues" :rowClassName="getRowClassName" v-show="getEmptyDataIsShowTable" @change="handleTableChange">
+      <template #[item]="data" v-for="item in Object.keys($slots)" :key="item">
+        <slot :name="item" v-bind="data || {}"></slot>
+      </template>
 
-            <template #[`header-${column.dataIndex}`] v-for="column in columns" :key="column.dataIndex">
-                <HeaderCell :column="column" />
-            </template>
-        </Table>
-    </div>
+      <template #[`header-${column.dataIndex}`] v-for="column in columns" :key="column.dataIndex">
+        <HeaderCell :column="column" />
+      </template>
+    </Table>
+  </div>
 </template>
 <script lang="ts">
-    import type {
-        BasicTableProps,
-        TableActionType,
-        SizeType,
-        ColumnChangeParam,
-    } from './types/table';
+  import type { BasicTableProps, TableActionType, SizeType, ColumnChangeParam } from './types/table';
 
-    import { defineComponent, ref, computed, unref, toRaw, inject, watchEffect } from 'vue';
-    import { Table } from 'ant-design-vue';
-    import { BasicForm, useForm } from '/@/components/Form/index';
-    import { PageWrapperFixedHeightKey } from '/@/components/Page';
-    import expandIcon from './components/ExpandIcon';
-    import HeaderCell from './components/HeaderCell.vue';
-    import { InnerHandlers } from './types/table';
-    import { usePagination } from './hooks/usePagination';
-    import { useColumns } from './hooks/useColumns';
-    import { useDataSource } from './hooks/useDataSource';
-    import { useLoading } from './hooks/useLoading';
-    import { useRowSelection } from './hooks/useRowSelection';
-    import { useTableScroll } from './hooks/useTableScroll';
-    import { useCustomRow } from './hooks/useCustomRow';
-    import { useTableStyle } from './hooks/useTableStyle';
-    import { useTableHeader } from './hooks/useTableHeader';
-    import { useTableExpand } from './hooks/useTableExpand';
-    import { createTableContext } from './hooks/useTableContext';
-    import { useTableFooter } from './hooks/useTableFooter';
-    import { useTableForm } from './hooks/useTableForm';
-    import { useDesign } from '/@/hooks/web/useDesign';
+  import { defineComponent, ref, computed, unref, toRaw, inject, watchEffect } from 'vue';
+  import { Table } from 'ant-design-vue';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { PageWrapperFixedHeightKey } from '/@/components/Page';
+  import expandIcon from './components/ExpandIcon';
+  import HeaderCell from './components/HeaderCell.vue';
+  import { InnerHandlers } from './types/table';
+  import { usePagination } from './hooks/usePagination';
+  import { useColumns } from './hooks/useColumns';
+  import { useDataSource } from './hooks/useDataSource';
+  import { useLoading } from './hooks/useLoading';
+  import { useRowSelection } from './hooks/useRowSelection';
+  import { useTableScroll } from './hooks/useTableScroll';
+  import { useCustomRow } from './hooks/useCustomRow';
+  import { useTableStyle } from './hooks/useTableStyle';
+  import { useTableHeader } from './hooks/useTableHeader';
+  import { useTableExpand } from './hooks/useTableExpand';
+  import { createTableContext } from './hooks/useTableContext';
+  import { useTableFooter } from './hooks/useTableFooter';
+  import { useTableForm } from './hooks/useTableForm';
+  import { useDesign } from '/@/hooks/web/useDesign';
 
-    import { omit } from 'lodash-es';
-    import { basicProps } from './props';
-    import { isFunction } from '/@/utils/is';
-    import { warn } from '/@/utils/log';
+  import { omit } from 'lodash-es';
+  import { basicProps } from './props';
+  import { isFunction } from '/@/utils/is';
+  import { warn } from '/@/utils/log';
 
-    export default defineComponent({
-        components: {
-            Table,
-            BasicForm,
-            HeaderCell,
+  export default defineComponent({
+    components: {
+      Table,
+      BasicForm,
+      HeaderCell,
+    },
+    props: basicProps,
+    emits: [
+      'fetch-success',
+      'fetch-error',
+      'selection-change',
+      'register',
+      'row-click',
+      'row-dbClick',
+      'row-contextmenu',
+      'row-mouseenter',
+      'row-mouseleave',
+      'edit-end',
+      'edit-cancel',
+      'edit-row-end',
+      'edit-change',
+      'expanded-rows-change',
+      'change',
+      'columns-change',
+      'table-redo',
+    ],
+    setup(props, { attrs, emit, slots, expose }) {
+      const tableElRef = ref(null);
+      const tableData = ref<Recordable[]>([]);
+
+      const wrapRef = ref(null);
+      const innerPropsRef = ref<Partial<BasicTableProps>>();
+
+      const { prefixCls } = useDesign('basic-table');
+      const [registerForm, formActions] = useForm();
+
+      const getProps = computed(() => {
+        return { ...props, ...unref(innerPropsRef) } as BasicTableProps;
+      });
+
+      const isFixedHeightPage = inject(PageWrapperFixedHeightKey, false);
+      watchEffect(() => {
+        unref(isFixedHeightPage) && props.canResize && warn("'canResize' of BasicTable may not work in PageWrapper with 'fixedHeight' (especially in hot updates)");
+      });
+
+      const { getLoading, setLoading } = useLoading(getProps);
+      const { getPaginationInfo, getPagination, setPagination, setShowPagination, getShowPagination } = usePagination(getProps);
+
+      const { getRowSelection, getRowSelectionRef, getSelectRows, clearSelectedRowKeys, getSelectRowKeys, deleteSelectRowByKey, setSelectedRowKeys } = useRowSelection(getProps, tableData, emit);
+
+      const {
+        handleTableChange: onTableChange,
+        getDataSourceRef,
+        getDataSource,
+        getRawDataSource,
+        setTableData,
+        updateTableDataRecord,
+        deleteTableDataRecord,
+        insertTableDataRecord,
+        findTableDataRecord,
+        fetch,
+        getRowKey,
+        reload,
+        getAutoCreateKey,
+        updateTableData,
+      } = useDataSource(
+        getProps,
+        {
+          tableData,
+          getPaginationInfo,
+          setLoading,
+          setPagination,
+          validate: formActions.validate,
+          clearSelectedRowKeys,
         },
-        props: basicProps,
-        emits: [
-            'fetch-success',
-            'fetch-error',
-            'selection-change',
-            'register',
-            'row-click',
-            'row-dbClick',
-            'row-contextmenu',
-            'row-mouseenter',
-            'row-mouseleave',
-            'edit-end',
-            'edit-cancel',
-            'edit-row-end',
-            'edit-change',
-            'expanded-rows-change',
-            'change',
-            'columns-change',
-            'table-redo',
-        ],
-        setup(props, { attrs, emit, slots, expose }) {
-            const tableElRef = ref(null);
-            const tableData = ref<Recordable[]>([]);
+        emit
+      );
 
-            const wrapRef = ref(null);
-            const innerPropsRef = ref<Partial<BasicTableProps>>();
+      function handleTableChange(...args) {
+        onTableChange.call(undefined, ...args);
+        emit('change', ...args);
+        // 解决通过useTable注册onChange时不起作用的问题
+        const { onChange } = unref(getProps);
+        onChange && isFunction(onChange) && onChange.call(undefined, ...args);
+      }
 
-            const { prefixCls } = useDesign('basic-table');
-            const [registerForm, formActions] = useForm();
+      const { getViewColumns, getColumns, setCacheColumnsByField, setColumns, getColumnsRef, getCacheColumns } = useColumns(getProps, getPaginationInfo);
 
-            const getProps = computed(() => {
-                return { ...props, ...unref(innerPropsRef) } as BasicTableProps;
-            });
+      const { getScrollRef, redoHeight } = useTableScroll(getProps, tableElRef, getColumnsRef, getRowSelectionRef, getDataSourceRef);
 
-            const isFixedHeightPage = inject(PageWrapperFixedHeightKey, false);
-            watchEffect(() => {
-                unref(isFixedHeightPage) &&
-                props.canResize &&
-                warn(
-                    "'canResize' of BasicTable may not work in PageWrapper with 'fixedHeight' (especially in hot updates)"
-                );
-            });
+      const { customRow } = useCustomRow(getProps, {
+        setSelectedRowKeys,
+        getSelectRowKeys,
+        clearSelectedRowKeys,
+        getAutoCreateKey,
+        emit,
+      });
 
-            const { getLoading, setLoading } = useLoading(getProps);
-            const {
-                getPaginationInfo,
-                getPagination,
-                setPagination,
-                setShowPagination,
-                getShowPagination,
-            } = usePagination(getProps);
+      const { getRowClassName } = useTableStyle(getProps, prefixCls);
 
-            const {
-                getRowSelection,
-                getRowSelectionRef,
-                getSelectRows,
-                clearSelectedRowKeys,
-                getSelectRowKeys,
-                deleteSelectRowByKey,
-                setSelectedRowKeys,
-            } = useRowSelection(getProps, tableData, emit);
+      const { getExpandOption, expandAll, collapseAll } = useTableExpand(getProps, tableData, emit);
 
-            const {
-                handleTableChange: onTableChange,
-                getDataSourceRef,
-                getDataSource,
-                getRawDataSource,
-                setTableData,
-                updateTableDataRecord,
-                deleteTableDataRecord,
-                insertTableDataRecord,
-                findTableDataRecord,
-                fetch,
-                getRowKey,
-                reload,
-                getAutoCreateKey,
-                updateTableData,
-            } = useDataSource(
-                getProps,
-                {
-                    tableData,
-                    getPaginationInfo,
-                    setLoading,
-                    setPagination,
-                    validate: formActions.validate,
-                    clearSelectedRowKeys,
-                },
-                emit
-            );
-
-            function handleTableChange(...args) {
-                onTableChange.call(undefined, ...args);
-                emit('change', ...args);
-                // 解决通过useTable注册onChange时不起作用的问题
-                const { onChange } = unref(getProps);
-                onChange && isFunction(onChange) && onChange.call(undefined, ...args);
-            }
-
-            const {
-                getViewColumns,
-                getColumns,
-                setCacheColumnsByField,
-                setColumns,
-                getColumnsRef,
-                getCacheColumns,
-            } = useColumns(getProps, getPaginationInfo);
-
-            const { getScrollRef, redoHeight } = useTableScroll(
-                getProps,
-                tableElRef,
-                getColumnsRef,
-                getRowSelectionRef,
-                getDataSourceRef
-            );
-
-            const { customRow } = useCustomRow(getProps, {
-                setSelectedRowKeys,
-                getSelectRowKeys,
-                clearSelectedRowKeys,
-                getAutoCreateKey,
-                emit,
-            });
-
-            const { getRowClassName } = useTableStyle(getProps, prefixCls);
-
-            const { getExpandOption, expandAll, collapseAll } = useTableExpand(getProps, tableData, emit);
-
-            const handlers: InnerHandlers = {
-                onColumnsChange: (data: ColumnChangeParam[]) => {
-                    emit('columns-change', data);
-                    // support useTable
-                    unref(getProps).onColumnsChange?.(data);
-                },
-            };
-
-            const { getHeaderProps } = useTableHeader(getProps, slots, handlers);
-
-            const { getFooterProps } = useTableFooter(
-                getProps,
-                getScrollRef,
-                tableElRef,
-                getDataSourceRef
-            );
-
-            const { getFormProps, replaceFormSlotKey, getFormSlotKeys, handleSearchInfoChange } =
-                useTableForm(getProps, slots, fetch, getLoading);
-
-            const getBindValues = computed(() => {
-                const dataSource = unref(getDataSourceRef);
-                let propsData: Recordable = {
-                    // ...(dataSource.length === 0 ? { getPopupContainer: () => document.body } : {}),
-                    ...attrs,
-                    customRow,
-                    //树列表展开使用AntDesignVue默认的加减图标 author:scott date:20210914
-                    //expandIcon: slots.expandIcon ? null : expandIcon(),
-                    ...unref(getProps),
-                    ...unref(getHeaderProps),
-                    scroll: unref(getScrollRef),
-                    loading: unref(getLoading),
-                    tableLayout: 'fixed',
-                    rowSelection: unref(getRowSelectionRef),
-                    rowKey: unref(getRowKey),
-                    columns: toRaw(unref(getViewColumns)),
-                    pagination: toRaw(unref(getPaginationInfo)),
-                    dataSource,
-                    footer: unref(getFooterProps),
-                    ...unref(getExpandOption),
-                };
-                if (slots.expandedRowRender) {
-                    propsData = omit(propsData, 'scroll');
-                }
-
-                propsData = omit(propsData, ['class', 'onChange']);
-                return propsData;
-            });
-
-            const getWrapperClass = computed(() => {
-                const values = unref(getBindValues);
-                return [
-                    prefixCls,
-                    attrs.class,
-                    {
-                        [`${prefixCls}-form-container`]: values.useSearchForm,
-                        [`${prefixCls}--inset`]: values.inset,
-                    },
-                ];
-            });
-
-            const getEmptyDataIsShowTable = computed(() => {
-                const { emptyDataIsShowTable, useSearchForm } = unref(getProps);
-                if (emptyDataIsShowTable || !useSearchForm) {
-                    return true;
-                }
-                return !!unref(getDataSourceRef).length;
-            });
-
-            function setProps(props: Partial<BasicTableProps>) {
-                innerPropsRef.value = { ...unref(innerPropsRef), ...props };
-            }
-
-            const tableAction: TableActionType = {
-                reload,
-                getSelectRows,
-                clearSelectedRowKeys,
-                getSelectRowKeys,
-                deleteSelectRowByKey,
-                setPagination,
-                setTableData,
-                updateTableDataRecord,
-                deleteTableDataRecord,
-                insertTableDataRecord,
-                findTableDataRecord,
-                redoHeight,
-                setSelectedRowKeys,
-                setColumns,
-                setLoading,
-                getDataSource,
-                getRawDataSource,
-                setProps,
-                getRowSelection,
-                getPaginationRef: getPagination,
-                getColumns,
-                getCacheColumns,
-                emit,
-                updateTableData,
-                setShowPagination,
-                getShowPagination,
-                setCacheColumnsByField,
-                expandAll,
-                collapseAll,
-                getSize: () => {
-                    return unref(getBindValues).size as SizeType;
-                },
-            };
-            createTableContext({ ...tableAction, wrapRef, getBindValues });
-
-            expose(tableAction);
-
-            emit('register', tableAction, formActions);
-
-            return {
-                tableElRef,
-                getBindValues,
-                getLoading,
-                registerForm,
-                handleSearchInfoChange,
-                getEmptyDataIsShowTable,
-                handleTableChange,
-                getRowClassName,
-                wrapRef,
-                tableAction,
-                redoHeight,
-                getFormProps: getFormProps as any,
-                replaceFormSlotKey,
-                getFormSlotKeys,
-                getWrapperClass,
-                columns: getViewColumns,
-            };
+      const handlers: InnerHandlers = {
+        onColumnsChange: (data: ColumnChangeParam[]) => {
+          emit('columns-change', data);
+          // support useTable
+          unref(getProps).onColumnsChange?.(data);
         },
-    });
+      };
+
+      const { getHeaderProps } = useTableHeader(getProps, slots, handlers);
+
+      const { getFooterProps } = useTableFooter(getProps, getScrollRef, tableElRef, getDataSourceRef);
+
+      const { getFormProps, replaceFormSlotKey, getFormSlotKeys, handleSearchInfoChange } = useTableForm(getProps, slots, fetch, getLoading);
+
+      const getBindValues = computed(() => {
+        const dataSource = unref(getDataSourceRef);
+        let propsData: Recordable = {
+          // ...(dataSource.length === 0 ? { getPopupContainer: () => document.body } : {}),
+          ...attrs,
+          customRow,
+          //树列表展开使用AntDesignVue默认的加减图标 author:scott date:20210914
+          //expandIcon: slots.expandIcon ? null : expandIcon(),
+          ...unref(getProps),
+          ...unref(getHeaderProps),
+          scroll: unref(getScrollRef),
+          loading: unref(getLoading),
+          tableLayout: 'fixed',
+          rowSelection: unref(getRowSelectionRef),
+          rowKey: unref(getRowKey),
+          columns: toRaw(unref(getViewColumns)),
+          pagination: toRaw(unref(getPaginationInfo)),
+          dataSource,
+          footer: unref(getFooterProps),
+          ...unref(getExpandOption),
+        };
+        if (slots.expandedRowRender) {
+          propsData = omit(propsData, 'scroll');
+        }
+
+        propsData = omit(propsData, ['class', 'onChange']);
+        return propsData;
+      });
+
+      const getWrapperClass = computed(() => {
+        const values = unref(getBindValues);
+        return [
+          prefixCls,
+          attrs.class,
+          {
+            [`${prefixCls}-form-container`]: values.useSearchForm,
+            [`${prefixCls}--inset`]: values.inset,
+          },
+        ];
+      });
+
+      const getEmptyDataIsShowTable = computed(() => {
+        const { emptyDataIsShowTable, useSearchForm } = unref(getProps);
+        if (emptyDataIsShowTable || !useSearchForm) {
+          return true;
+        }
+        return !!unref(getDataSourceRef).length;
+      });
+
+      function setProps(props: Partial<BasicTableProps>) {
+        innerPropsRef.value = { ...unref(innerPropsRef), ...props };
+      }
+
+      const tableAction: TableActionType = {
+        reload,
+        getSelectRows,
+        clearSelectedRowKeys,
+        getSelectRowKeys,
+        deleteSelectRowByKey,
+        setPagination,
+        setTableData,
+        updateTableDataRecord,
+        deleteTableDataRecord,
+        insertTableDataRecord,
+        findTableDataRecord,
+        redoHeight,
+        setSelectedRowKeys,
+        setColumns,
+        setLoading,
+        getDataSource,
+        getRawDataSource,
+        setProps,
+        getRowSelection,
+        getPaginationRef: getPagination,
+        getColumns,
+        getCacheColumns,
+        emit,
+        updateTableData,
+        setShowPagination,
+        getShowPagination,
+        setCacheColumnsByField,
+        expandAll,
+        collapseAll,
+        getSize: () => {
+          return unref(getBindValues).size as SizeType;
+        },
+      };
+      createTableContext({ ...tableAction, wrapRef, getBindValues });
+
+      expose(tableAction);
+
+      emit('register', tableAction, formActions);
+
+      return {
+        tableElRef,
+        getBindValues,
+        getLoading,
+        registerForm,
+        handleSearchInfoChange,
+        getEmptyDataIsShowTable,
+        handleTableChange,
+        getRowClassName,
+        wrapRef,
+        tableAction,
+        redoHeight,
+        getFormProps: getFormProps as any,
+        replaceFormSlotKey,
+        getFormSlotKeys,
+        getWrapperClass,
+        columns: getViewColumns,
+      };
+    },
+  });
 </script>
 <style lang="less">
-    @border-color: #cecece4d;
+  @border-color: #cecece4d;
 
-    @prefix-cls: ~'@{namespace}-basic-table';
+  @prefix-cls: ~'@{namespace}-basic-table';
 
-    [data-theme='dark'] {
-        .ant-table-tbody > tr:hover.ant-table-row-selected > td,
-        .ant-table-tbody > tr.ant-table-row-selected td {
-            background-color: #262626;
-        }
-
-      .@{prefix-cls} {
-        //表格选择工具栏样式
-        .alert {
-          background-color: #323232;
-          border-color: #424242;
-        }
-      }
+  [data-theme='dark'] {
+    .ant-table-tbody > tr:hover.ant-table-row-selected > td,
+    .ant-table-tbody > tr.ant-table-row-selected td {
+      background-color: #262626;
     }
 
     .@{prefix-cls} {
-        max-width: 100%;
-
-        &-row__striped {
-            td {
-                background-color: @app-content-background;
-            }
-        }
-
-        &-form-container {
-            padding: 10px;
-
-            .ant-form {
-                padding: 12px 10px 6px 10px;
-                margin-bottom: 8px;
-                background-color: @component-background;
-                border-radius: 2px;
-            }
-        }
-
-        .ant-tag {
-            margin-right: 0;
-        }
-
-        .ant-table-wrapper {
-            padding: 6px;
-            background-color: @component-background;
-            border-radius: 2px;
-
-            .ant-table-title {
-                min-height: 40px;
-                padding: 0 0 8px 0 !important;
-            }
-
-            .ant-table.ant-table-bordered .ant-table-title {
-                border: none !important;
-            }
-        }
-
-        .ant-table {
-            width: 100%;
-            overflow-x: hidden;
-
-            &-title {
-                display: flex;
-                padding: 8px 6px;
-                border-bottom: none;
-                justify-content: space-between;
-                align-items: center;
-            }
-            //定义行颜色
-            .trcolor{
-              background-color: rgba(255, 192, 203, 0.31);
-              color:red;
-            }
-
-            //.ant-table-tbody > tr.ant-table-row-selected td {
-            //background-color: fade(@primary-color, 8%) !important;
-            //}
-        }
-
-        .ant-pagination {
-            margin: 10px 0 0 0;
-        }
-
-        .ant-table-footer {
-            padding: 0;
-
-            .ant-table-wrapper {
-                padding: 0;
-            }
-
-            table {
-                border: none !important;
-            }
-
-            .ant-table-body {
-                overflow-x: hidden !important;
-                //  overflow-y: scroll !important;
-            }
-
-            td {
-                padding: 12px 8px;
-            }
-        }
-        //表格选择工具栏样式
-        .alert {
-            height: 38px;
-            background-color: #f3f3f3;
-            border-color: #e3e3e3;
-        }
-        &--inset {
-          .ant-table-wrapper {
-            padding: 0;
-          }
-        }
+      //表格选择工具栏样式
+      .alert {
+        background-color: #323232;
+        border-color: #424242;
+      }
     }
+  }
+
+  .@{prefix-cls} {
+    max-width: 100%;
+
+    &-row__striped {
+      td {
+        background-color: @app-content-background;
+      }
+    }
+
+    &-form-container {
+      padding: 10px;
+
+      .ant-form {
+        padding: 12px 10px 6px 10px;
+        margin-bottom: 8px;
+        background-color: @component-background;
+        border-radius: 2px;
+      }
+    }
+
+    .ant-tag {
+      margin-right: 0;
+    }
+
+    .ant-table-wrapper {
+      padding: 6px;
+      background-color: @component-background;
+      border-radius: 2px;
+
+      .ant-table-title {
+        min-height: 40px;
+        padding: 0 0 8px 0 !important;
+      }
+
+      .ant-table.ant-table-bordered .ant-table-title {
+        border: none !important;
+      }
+    }
+
+    .ant-table {
+      width: 100%;
+      overflow-x: hidden;
+
+      &-title {
+        display: flex;
+        padding: 8px 6px;
+        border-bottom: none;
+        justify-content: space-between;
+        align-items: center;
+      }
+      //定义行颜色
+      .trcolor {
+        background-color: rgba(255, 192, 203, 0.31);
+        color: red;
+      }
+
+      //.ant-table-tbody > tr.ant-table-row-selected td {
+      //background-color: fade(@primary-color, 8%) !important;
+      //}
+    }
+
+    .ant-pagination {
+      margin: 10px 0 0 0;
+    }
+
+    .ant-table-footer {
+      padding: 0;
+
+      .ant-table-wrapper {
+        padding: 0;
+      }
+
+      table {
+        border: none !important;
+      }
+
+      .ant-table-body {
+        overflow-x: hidden !important;
+        //  overflow-y: scroll !important;
+      }
+
+      td {
+        padding: 12px 8px;
+      }
+    }
+    //表格选择工具栏样式
+    .alert {
+      height: 38px;
+      background-color: #f3f3f3;
+      border-color: #e3e3e3;
+    }
+    &--inset {
+      .ant-table-wrapper {
+        padding: 0;
+      }
+    }
+  }
 </style>
diff --git a/src/components/Table/src/componentMap.ts b/src/components/Table/src/componentMap.ts
index 265b7c7..0578a60 100644
--- a/src/components/Table/src/componentMap.ts
+++ b/src/components/Table/src/componentMap.ts
@@ -1,13 +1,5 @@
 import type { Component } from 'vue';
-import {
-  Input,
-  Select,
-  Checkbox,
-  InputNumber,
-  Switch,
-  DatePicker,
-  TimePicker,
-} from 'ant-design-vue';
+import { Input, Select, Checkbox, InputNumber, Switch, DatePicker, TimePicker } from 'ant-design-vue';
 import type { ComponentType } from './types/componentType';
 import { ApiSelect, ApiTreeSelect } from '/@/components/Form';
 
diff --git a/src/components/Table/src/components/ExpandIcon.tsx b/src/components/Table/src/components/ExpandIcon.tsx
index 43909fc..3d1d98d 100644
--- a/src/components/Table/src/components/ExpandIcon.tsx
+++ b/src/components/Table/src/components/ExpandIcon.tsx
@@ -1,18 +1,23 @@
-import {BasicArrow} from '/@/components/Basic';
+import { BasicArrow } from '/@/components/Basic';
 
 export default () => {
-    return (props: Recordable) => {
-        if (!props.expandable) {
-            if (props.needIndentSpaced) {
-                return <span class="ant-table-row-expand-icon ant-table-row-spaced"/>;
-            } else {
-                return <span/>;
-            }
-        }
-        return (
-            <BasicArrow style="margin-right: 8px" iconStyle="margin-top: -2px;" onClick={(e: Event) => {
-                props.onExpand(props.record, e);
-            }} expand={props.expanded}/>
-        );
-    };
+  return (props: Recordable) => {
+    if (!props.expandable) {
+      if (props.needIndentSpaced) {
+        return <span class="ant-table-row-expand-icon ant-table-row-spaced" />;
+      } else {
+        return <span />;
+      }
+    }
+    return (
+      <BasicArrow
+        style="margin-right: 8px"
+        iconStyle="margin-top: -2px;"
+        onClick={(e: Event) => {
+          props.onExpand(props.record, e);
+        }}
+        expand={props.expanded}
+      />
+    );
+  };
 };
diff --git a/src/components/Table/src/components/TableAction.vue b/src/components/Table/src/components/TableAction.vue
index 92c39b9..5574928 100644
--- a/src/components/Table/src/components/TableAction.vue
+++ b/src/components/Table/src/components/TableAction.vue
@@ -1,194 +1,192 @@
 <template>
-    <div :class="[prefixCls, getAlign]" @click="onCellClick">
-        <template v-for="(action, index) in getActions" :key="`${index}-${action.label}`">
-            <Tooltip v-if="action.tooltip" v-bind="getTooltip(action.tooltip)">
-                <PopConfirmButton v-bind="action">
-                    <Icon :icon="action.icon" :class="{ 'mr-1': !!action.label }" v-if="action.icon" />
-                    <template v-if="action.label">{{ action.label }}</template>
-                </PopConfirmButton>
-            </Tooltip>
-            <PopConfirmButton v-else v-bind="action">
-                <Icon :icon="action.icon" :class="{ 'mr-1': !!action.label }" v-if="action.icon" />
-                <template v-if="action.label">{{ action.label }}</template>
-            </PopConfirmButton>
-          <Divider type="vertical" class="action-divider" v-if="divider && index < getActions.length - 1"/>
-        </template>
-        <Dropdown :trigger="['hover']" :dropMenuList="getDropdownList" popconfirm v-if="dropDownActions && getDropdownList.length > 0">
-            <slot name="more"></slot>
-            <a-button type="link" size="small" v-if="!$slots.more">
-               更多 <Icon icon="mdi-light:chevron-down"></Icon>
-            </a-button>
-        </Dropdown>
-    </div>
+  <div :class="[prefixCls, getAlign]" @click="onCellClick">
+    <template v-for="(action, index) in getActions" :key="`${index}-${action.label}`">
+      <Tooltip v-if="action.tooltip" v-bind="getTooltip(action.tooltip)">
+        <PopConfirmButton v-bind="action">
+          <Icon :icon="action.icon" :class="{ 'mr-1': !!action.label }" v-if="action.icon" />
+          <template v-if="action.label">{{ action.label }}</template>
+        </PopConfirmButton>
+      </Tooltip>
+      <PopConfirmButton v-else v-bind="action">
+        <Icon :icon="action.icon" :class="{ 'mr-1': !!action.label }" v-if="action.icon" />
+        <template v-if="action.label">{{ action.label }}</template>
+      </PopConfirmButton>
+      <Divider type="vertical" class="action-divider" v-if="divider && index < getActions.length - 1" />
+    </template>
+    <Dropdown :trigger="['hover']" :dropMenuList="getDropdownList" popconfirm v-if="dropDownActions && getDropdownList.length > 0">
+      <slot name="more"></slot>
+      <a-button type="link" size="small" v-if="!$slots.more"> 更多 <Icon icon="mdi-light:chevron-down"></Icon> </a-button>
+    </Dropdown>
+  </div>
 </template>
 <script lang="ts">
-    import { defineComponent, PropType, computed, toRaw, unref } from 'vue';
-    import { MoreOutlined } from '@ant-design/icons-vue';
-    import { Divider, Tooltip, TooltipProps } from 'ant-design-vue';
-    import Icon from '/@/components/Icon/index';
-    import { ActionItem, TableActionType } from '/@/components/Table';
-    import { PopConfirmButton } from '/@/components/Button';
-    import { Dropdown } from '/@/components/Dropdown';
-    import { useDesign } from '/@/hooks/web/useDesign';
-    import { useTableContext } from '../hooks/useTableContext';
-    import { usePermission } from '/@/hooks/web/usePermission';
-    import { isBoolean, isFunction, isString } from '/@/utils/is';
-    import { propTypes } from '/@/utils/propTypes';
-    import { ACTION_COLUMN_FLAG } from '../const';
+  import { defineComponent, PropType, computed, toRaw, unref } from 'vue';
+  import { MoreOutlined } from '@ant-design/icons-vue';
+  import { Divider, Tooltip, TooltipProps } from 'ant-design-vue';
+  import Icon from '/@/components/Icon/index';
+  import { ActionItem, TableActionType } from '/@/components/Table';
+  import { PopConfirmButton } from '/@/components/Button';
+  import { Dropdown } from '/@/components/Dropdown';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useTableContext } from '../hooks/useTableContext';
+  import { usePermission } from '/@/hooks/web/usePermission';
+  import { isBoolean, isFunction, isString } from '/@/utils/is';
+  import { propTypes } from '/@/utils/propTypes';
+  import { ACTION_COLUMN_FLAG } from '../const';
 
-    export default defineComponent({
-        name: 'TableAction',
-        components: { Icon, PopConfirmButton, Divider, Dropdown, MoreOutlined, Tooltip },
-        props: {
-            actions: {
-                type: Array as PropType<ActionItem[]>,
-                default: null,
-            },
-            dropDownActions: {
-                type: Array as PropType<ActionItem[]>,
-                default: null,
-            },
-            divider: propTypes.bool.def(true),
-            outside: propTypes.bool,
-            stopButtonPropagation: propTypes.bool.def(false),
-        },
-        setup(props) {
-            const { prefixCls } = useDesign('basic-table-action');
-            let table: Partial<TableActionType> = {};
-            if (!props.outside) {
-                table = useTableContext();
-            }
+  export default defineComponent({
+    name: 'TableAction',
+    components: { Icon, PopConfirmButton, Divider, Dropdown, MoreOutlined, Tooltip },
+    props: {
+      actions: {
+        type: Array as PropType<ActionItem[]>,
+        default: null,
+      },
+      dropDownActions: {
+        type: Array as PropType<ActionItem[]>,
+        default: null,
+      },
+      divider: propTypes.bool.def(true),
+      outside: propTypes.bool,
+      stopButtonPropagation: propTypes.bool.def(false),
+    },
+    setup(props) {
+      const { prefixCls } = useDesign('basic-table-action');
+      let table: Partial<TableActionType> = {};
+      if (!props.outside) {
+        table = useTableContext();
+      }
 
-            const { hasPermission } = usePermission();
-            function isIfShow(action: ActionItem): boolean {
-                const ifShow = action.ifShow;
+      const { hasPermission } = usePermission();
+      function isIfShow(action: ActionItem): boolean {
+        const ifShow = action.ifShow;
 
-                let isIfShow = true;
+        let isIfShow = true;
 
-                if (isBoolean(ifShow)) {
-                    isIfShow = ifShow;
-                }
-                if (isFunction(ifShow)) {
-                    isIfShow = ifShow(action);
-                }
-                return isIfShow;
-            }
+        if (isBoolean(ifShow)) {
+          isIfShow = ifShow;
+        }
+        if (isFunction(ifShow)) {
+          isIfShow = ifShow(action);
+        }
+        return isIfShow;
+      }
 
-            const getActions = computed(() => {
-                return (toRaw(props.actions) || [])
-                    .filter((action) => {
-                        return hasPermission(action.auth) && isIfShow(action);
-                    })
-                    .map((action) => {
-                        const { popConfirm } = action;
-                        return {
-                            getPopupContainer: () => unref((table as any)?.wrapRef.value) ?? document.body,
-                            type: 'link',
-                            size: 'small',
-                            ...action,
-                            ...(popConfirm || {}),
-                            onConfirm: popConfirm?.confirm,
-                            onCancel: popConfirm?.cancel,
-                            enable: !!popConfirm,
-                        };
-                    });
-            });
+      const getActions = computed(() => {
+        return (toRaw(props.actions) || [])
+          .filter((action) => {
+            return hasPermission(action.auth) && isIfShow(action);
+          })
+          .map((action) => {
+            const { popConfirm } = action;
+            return {
+              getPopupContainer: () => unref((table as any)?.wrapRef.value) ?? document.body,
+              type: 'link',
+              size: 'small',
+              ...action,
+              ...(popConfirm || {}),
+              onConfirm: popConfirm?.confirm,
+              onCancel: popConfirm?.cancel,
+              enable: !!popConfirm,
+            };
+          });
+      });
 
-            const getDropdownList = computed((): any[] => {
-                return (toRaw(props.dropDownActions) || [])
-                    .filter((action) => {
-                        return hasPermission(action.auth) && isIfShow(action);
-                    })
-                    .map((action, index) => {
-                        const { label, popConfirm } = action;
-                        return {
-                            ...action,
-                            ...popConfirm,
-                            onConfirm: popConfirm?.confirm,
-                            onCancel: popConfirm?.cancel,
-                            text: label,
-                            divider: index < props.dropDownActions.length - 1 ? props.divider : false,
-                        };
-                    });
-            });
+      const getDropdownList = computed((): any[] => {
+        return (toRaw(props.dropDownActions) || [])
+          .filter((action) => {
+            return hasPermission(action.auth) && isIfShow(action);
+          })
+          .map((action, index) => {
+            const { label, popConfirm } = action;
+            return {
+              ...action,
+              ...popConfirm,
+              onConfirm: popConfirm?.confirm,
+              onCancel: popConfirm?.cancel,
+              text: label,
+              divider: index < props.dropDownActions.length - 1 ? props.divider : false,
+            };
+          });
+      });
 
-            const getAlign = computed(() => {
-                const columns = (table as TableActionType)?.getColumns?.() || [];
-                const actionColumn = columns.find((item) => item.flag === ACTION_COLUMN_FLAG);
-                return actionColumn?.align ?? 'left';
-            });
+      const getAlign = computed(() => {
+        const columns = (table as TableActionType)?.getColumns?.() || [];
+        const actionColumn = columns.find((item) => item.flag === ACTION_COLUMN_FLAG);
+        return actionColumn?.align ?? 'left';
+      });
 
-            function getTooltip(data: string | TooltipProps): TooltipProps {
-                return {
-                    getPopupContainer: () => unref((table as any)?.wrapRef.value) ?? document.body,
-                    placement: 'bottom',
-                    ...(isString(data) ? { title: data } : data),
-                };
-            }
+      function getTooltip(data: string | TooltipProps): TooltipProps {
+        return {
+          getPopupContainer: () => unref((table as any)?.wrapRef.value) ?? document.body,
+          placement: 'bottom',
+          ...(isString(data) ? { title: data } : data),
+        };
+      }
 
-            function onCellClick(e: MouseEvent) {
-                if (!props.stopButtonPropagation) return;
-                const path = e.composedPath() as HTMLElement[];
-                const isInButton = path.find((ele) => {
-                    return ele.tagName?.toUpperCase() === 'BUTTON';
-                });
-                isInButton && e.stopPropagation();
-            }
+      function onCellClick(e: MouseEvent) {
+        if (!props.stopButtonPropagation) return;
+        const path = e.composedPath() as HTMLElement[];
+        const isInButton = path.find((ele) => {
+          return ele.tagName?.toUpperCase() === 'BUTTON';
+        });
+        isInButton && e.stopPropagation();
+      }
 
-            return { prefixCls, getActions, getDropdownList, getAlign, onCellClick, getTooltip };
-        },
-    });
+      return { prefixCls, getActions, getDropdownList, getAlign, onCellClick, getTooltip };
+    },
+  });
 </script>
 <style lang="less">
-    @prefix-cls: ~'@{namespace}-basic-table-action';
+  @prefix-cls: ~'@{namespace}-basic-table-action';
 
-    .@{prefix-cls} {
-        display: flex;
-        align-items: center;
+  .@{prefix-cls} {
+    display: flex;
+    align-items: center;
 
-        .action-divider {
-            display: table;
-        }
-
-        &.left {
-            justify-content: flex-start;
-        }
-
-        &.center {
-            justify-content: center;
-        }
-
-        &.right {
-            justify-content: flex-end;
-        }
-
-        button {
-            display: flex;
-            align-items: center;
-
-            span {
-                margin-left: 0 !important;
-            }
-        }
-
-        button.ant-btn-circle {
-            span {
-                margin: auto !important;
-            }
-        }
-
-        .ant-divider,
-        .ant-divider-vertical {
-            margin: 0 2px;
-        }
-
-        .icon-more {
-            transform: rotate(90deg);
-
-            svg {
-                font-size: 1.1em;
-                font-weight: 700;
-            }
-        }
+    .action-divider {
+      display: table;
     }
+
+    &.left {
+      justify-content: flex-start;
+    }
+
+    &.center {
+      justify-content: center;
+    }
+
+    &.right {
+      justify-content: flex-end;
+    }
+
+    button {
+      display: flex;
+      align-items: center;
+
+      span {
+        margin-left: 0 !important;
+      }
+    }
+
+    button.ant-btn-circle {
+      span {
+        margin: auto !important;
+      }
+    }
+
+    .ant-divider,
+    .ant-divider-vertical {
+      margin: 0 2px;
+    }
+
+    .icon-more {
+      transform: rotate(90deg);
+
+      svg {
+        font-size: 1.1em;
+        font-weight: 700;
+      }
+    }
+  }
 </style>
diff --git a/src/components/Table/src/components/TableHeader.vue b/src/components/Table/src/components/TableHeader.vue
index 7e1d642..a9d5682 100644
--- a/src/components/Table/src/components/TableHeader.vue
+++ b/src/components/Table/src/components/TableHeader.vue
@@ -1,165 +1,160 @@
 <template>
-    <div style="width: 100%">
-        <div v-if="$slots.headerTop" style="margin: 5px">
-            <slot name="headerTop"></slot>
-        </div>
-        <div :class="`flex items-center ${prefixCls}__table-title-box`">
-            <div :class="`${prefixCls}__tableTitle`">
-              <slot name="tableTitle" v-if="$slots.tableTitle"></slot>
-              <!--修改标题插槽位置-->
-              <TableTitle :helpMessage="titleHelpMessage" :title="title" v-if="!$slots.tableTitle && title"/>
-            </div>
-
-            <div :class="`${prefixCls}__toolbar`">
-                <slot name="toolbar"></slot>
-                <Divider type="vertical" v-if="$slots.toolbar && showTableSetting"/>
-                <TableSetting :class="`${prefixCls}__toolbar-desktop`" :setting="tableSetting" v-if="showTableSetting" @columns-change="handleColumnChange"/>
-                <a-popover :overlayClassName="`${prefixCls}__toolbar-mobile`" trigger="click" placement="left" :getPopupContainer="n=>n.parentElement">
-                  <template #content>
-                    <TableSetting mode="mobile" :setting="tableSetting" v-if="showTableSetting" @columns-change="handleColumnChange"/>
-                  </template>
-                  <a-button :class="`${prefixCls}__toolbar-mobile`" type="text" preIcon="ant-design:menu" shape="circle"/>
-                </a-popover>
-
-            </div>
-        </div>
-        <!--添加tableTop插槽-->
-        <div style="margin:-4px 0 -2px;padding-top: 5px">
-            <slot name="tableTop">
-                <a-alert type="info" show-icon class="alert" v-if="openRowSelection!=null">
-                    <template #message>
-                        <template v-if="selectRowKeys.length > 0">
-                            <span>已选中 {{ selectRowKeys.length }} 条记录(可跨页)</span>
-                            <a-divider type="vertical"/>
-                            <a @click="setSelectedRowKeys([])">清空</a>
-                            <slot name="alertAfter"/>
-                        </template>
-                        <template v-else>
-                            <span>未选中任何数据</span>
-                        </template>
-                    </template>
-                </a-alert>
-            </slot>
-        </div>
-        <!--添加tableTop插槽-->
+  <div style="width: 100%">
+    <div v-if="$slots.headerTop" style="margin: 5px">
+      <slot name="headerTop"></slot>
     </div>
+    <div :class="`flex items-center ${prefixCls}__table-title-box`">
+      <div :class="`${prefixCls}__tableTitle`">
+        <slot name="tableTitle" v-if="$slots.tableTitle"></slot>
+        <!--修改标题插槽位置-->
+        <TableTitle :helpMessage="titleHelpMessage" :title="title" v-if="!$slots.tableTitle && title" />
+      </div>
+
+      <div :class="`${prefixCls}__toolbar`">
+        <slot name="toolbar"></slot>
+        <Divider type="vertical" v-if="$slots.toolbar && showTableSetting" />
+        <TableSetting :class="`${prefixCls}__toolbar-desktop`" :setting="tableSetting" v-if="showTableSetting" @columns-change="handleColumnChange" />
+        <a-popover :overlayClassName="`${prefixCls}__toolbar-mobile`" trigger="click" placement="left" :getPopupContainer="(n) => n.parentElement">
+          <template #content>
+            <TableSetting mode="mobile" :setting="tableSetting" v-if="showTableSetting" @columns-change="handleColumnChange" />
+          </template>
+          <a-button :class="`${prefixCls}__toolbar-mobile`" type="text" preIcon="ant-design:menu" shape="circle" />
+        </a-popover>
+      </div>
+    </div>
+    <!--添加tableTop插槽-->
+    <div style="margin: -4px 0 -2px; padding-top: 5px">
+      <slot name="tableTop">
+        <a-alert type="info" show-icon class="alert" v-if="openRowSelection != null">
+          <template #message>
+            <template v-if="selectRowKeys.length > 0">
+              <span>已选中 {{ selectRowKeys.length }} 条记录(可跨页)</span>
+              <a-divider type="vertical" />
+              <a @click="setSelectedRowKeys([])">清空</a>
+              <slot name="alertAfter" />
+            </template>
+            <template v-else>
+              <span>未选中任何数据</span>
+            </template>
+          </template>
+        </a-alert>
+      </slot>
+    </div>
+    <!--添加tableTop插槽-->
+  </div>
 </template>
 <script lang="ts">
-    import type {TableSetting, ColumnChangeParam} from '../types/table';
-    import type {PropType} from 'vue';
-    import {defineComponent, computed} from 'vue';
-    import {Divider} from 'ant-design-vue';
-    import TableSettingComponent from './settings/index.vue';
-    import TableTitle from './TableTitle.vue';
-    import {useDesign} from '/@/hooks/web/useDesign';
-    import { useTableContext } from '../hooks/useTableContext';
+  import type { TableSetting, ColumnChangeParam } from '../types/table';
+  import type { PropType } from 'vue';
+  import { defineComponent, computed } from 'vue';
+  import { Divider } from 'ant-design-vue';
+  import TableSettingComponent from './settings/index.vue';
+  import TableTitle from './TableTitle.vue';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useTableContext } from '../hooks/useTableContext';
 
-    export default defineComponent({
-        name: 'BasicTableHeader',
-        components: {
-            Divider,
-            TableTitle,
-            TableSetting: TableSettingComponent,
-        },
-        props: {
-            title: {
-                type: [Function, String] as PropType<string | ((data: Recordable) => string)>,
-            },
-            tableSetting: {
-                type: Object as PropType<TableSetting>,
-            },
-            showTableSetting: {
-                type: Boolean,
-            },
-            titleHelpMessage: {
-                type: [String, Array] as PropType<string | string[]>,
-                default: '',
-            },
-        },
-        emits: ['columns-change'],
-        setup(_, {emit}) {
-            const {prefixCls} = useDesign('basic-table-header');
+  export default defineComponent({
+    name: 'BasicTableHeader',
+    components: {
+      Divider,
+      TableTitle,
+      TableSetting: TableSettingComponent,
+    },
+    props: {
+      title: {
+        type: [Function, String] as PropType<string | ((data: Recordable) => string)>,
+      },
+      tableSetting: {
+        type: Object as PropType<TableSetting>,
+      },
+      showTableSetting: {
+        type: Boolean,
+      },
+      titleHelpMessage: {
+        type: [String, Array] as PropType<string | string[]>,
+        default: '',
+      },
+    },
+    emits: ['columns-change'],
+    setup(_, { emit }) {
+      const { prefixCls } = useDesign('basic-table-header');
 
-            function handleColumnChange(data: ColumnChangeParam[]) {
-                emit('columns-change', data);
-            }
+      function handleColumnChange(data: ColumnChangeParam[]) {
+        emit('columns-change', data);
+      }
 
-            const { getSelectRowKeys, setSelectedRowKeys,getRowSelection } = useTableContext();
-            const selectRowKeys = computed(() => getSelectRowKeys());
-            const openRowSelection = computed(() => getRowSelection());
+      const { getSelectRowKeys, setSelectedRowKeys, getRowSelection } = useTableContext();
+      const selectRowKeys = computed(() => getSelectRowKeys());
+      const openRowSelection = computed(() => getRowSelection());
 
-
-
-            return {prefixCls, handleColumnChange, selectRowKeys, setSelectedRowKeys,openRowSelection};
-        },
-    });
+      return { prefixCls, handleColumnChange, selectRowKeys, setSelectedRowKeys, openRowSelection };
+    },
+  });
 </script>
 <style lang="less">
-    @prefix-cls: ~'@{namespace}-basic-table-header';
+  @prefix-cls: ~'@{namespace}-basic-table-header';
 
-    .@{prefix-cls} {
-        &__toolbar {
-            //flex: 1;
-            width: 140px;
-            display: flex;
-            align-items: center;
-            justify-content: flex-end;
+  .@{prefix-cls} {
+    &__toolbar {
+      //flex: 1;
+      width: 140px;
+      display: flex;
+      align-items: center;
+      justify-content: flex-end;
 
-            > * {
-                margin-right: 8px;
-            }
+      > * {
+        margin-right: 8px;
+      }
 
-          &-desktop {
-            display: block;
-          }
+      &-desktop {
+        display: block;
+      }
 
-          &-mobile {
-            display: none;
-          }
-        }
-        &__tableTitle {
-          flex: 1;
-          display: flex;
-          flex-wrap: wrap;
-          align-content: flex-start;
+      &-mobile {
+        display: none;
+      }
+    }
+    &__tableTitle {
+      flex: 1;
+      display: flex;
+      flex-wrap: wrap;
+      align-content: flex-start;
 
-          > * {
-            margin-right: 4px;
-            margin-bottom: 4px;
-          }
+      > * {
+        margin-right: 4px;
+        margin-bottom: 4px;
+      }
+    }
+
+    @media (max-width: @screen-lg) {
+      &__table-title-box {
+        align-items: flex-end;
+      }
+
+      &__toolbar {
+        width: 30px;
+        text-align: center;
+
+        > * {
+          margin-right: 0;
         }
 
-      @media (max-width: @screen-lg) {
-        &__table-title-box {
-          align-items: flex-end;
+        .table-settings > * {
+          margin-right: 0;
+          margin-bottom: 6px;
+        }
+        &-desktop {
+          display: none;
         }
 
-        &__toolbar {
-          width: 30px;
-          text-align: center;
-
-          > * {
-            margin-right: 0;
-          }
-
+        &-mobile {
+          display: block;
           .table-settings > * {
-            margin-right: 0;
-            margin-bottom: 6px;
-          }
-          &-desktop {
-            display: none;
-          }
-
-          &-mobile {
-            display: block;
-            .table-settings > * {
-              margin-right: 6px;
-              margin-bottom: 0;
-            }
+            margin-right: 6px;
+            margin-bottom: 0;
           }
         }
       }
-
     }
-
+  }
 </style>
diff --git a/src/components/Table/src/components/TableImg.vue b/src/components/Table/src/components/TableImg.vue
index cda9ab7..29a0907 100644
--- a/src/components/Table/src/components/TableImg.vue
+++ b/src/components/Table/src/components/TableImg.vue
@@ -1,20 +1,15 @@
 <template>
-  <div
-          :class="prefixCls"
-          class="flex items-center mx-auto"
-          v-if="imgList && imgList.length"
-          :style="getWrapStyle"
-  >
+  <div :class="prefixCls" class="flex items-center mx-auto" v-if="imgList && imgList.length" :style="getWrapStyle">
     <Badge :count="!showBadge || imgList.length == 1 ? 0 : imgList.length" v-if="simpleShow">
       <div class="img-div">
         <PreviewGroup>
           <template v-for="(img, index) in imgList" :key="img">
             <Image
-                    :width="size"
-                    :style="{
+              :width="size"
+              :style="{
                 display: index === 0 ? '' : 'none !important',
               }"
-                    :src="srcPrefix + img"
+              :src="srcPrefix + img"
             />
           </template>
         </PreviewGroup>
@@ -22,11 +17,7 @@
     </Badge>
     <PreviewGroup v-else>
       <template v-for="(img, index) in imgList" :key="img">
-        <Image
-                :width="size"
-                :style="{ marginLeft: index === 0 ? 0 : margin }"
-                :src="srcPrefix + img"
-        />
+        <Image :width="size" :style="{ marginLeft: index === 0 ? 0 : margin }" :src="srcPrefix + img" />
       </template>
     </PreviewGroup>
   </div>
diff --git a/src/components/Table/src/components/editable/CellComponent.ts b/src/components/Table/src/components/editable/CellComponent.ts
index aeded58..291ec16 100644
--- a/src/components/Table/src/components/editable/CellComponent.ts
+++ b/src/components/Table/src/components/editable/CellComponent.ts
@@ -1,44 +1,35 @@
-import type {FunctionalComponent, defineComponent} from 'vue';
-import type {ComponentType} from '../../types/componentType';
-import {componentMap} from '/@/components/Table/src/componentMap';
+import type { FunctionalComponent, defineComponent } from 'vue';
+import type { ComponentType } from '../../types/componentType';
+import { componentMap } from '/@/components/Table/src/componentMap';
 
-import {Popover} from 'ant-design-vue';
-import {h} from 'vue';
+import { Popover } from 'ant-design-vue';
+import { h } from 'vue';
 
 export interface ComponentProps {
-    component: ComponentType;
-    rule: boolean;
-    popoverVisible: boolean;
-    ruleMessage: string;
-    getPopupContainer?: Fn;
+  component: ComponentType;
+  rule: boolean;
+  popoverVisible: boolean;
+  ruleMessage: string;
+  getPopupContainer?: Fn;
 }
 
-export const CellComponent: FunctionalComponent = (
-    {
-        component = 'Input',
-        rule = true,
-        ruleMessage,
-        popoverVisible,
-        getPopupContainer,
-    }: ComponentProps,
-    {attrs}
-) => {
-    const Comp = componentMap.get(component) as typeof defineComponent;
+export const CellComponent: FunctionalComponent = ({ component = 'Input', rule = true, ruleMessage, popoverVisible, getPopupContainer }: ComponentProps, { attrs }) => {
+  const Comp = componentMap.get(component) as typeof defineComponent;
 
-    const DefaultComp = h(Comp, attrs);
-    if (!rule) {
-        return DefaultComp;
+  const DefaultComp = h(Comp, attrs);
+  if (!rule) {
+    return DefaultComp;
+  }
+  return h(
+    Popover,
+    {
+      overlayClassName: 'edit-cell-rule-popover',
+      visible: !!popoverVisible,
+      ...(getPopupContainer ? { getPopupContainer } : {}),
+    },
+    {
+      default: () => DefaultComp,
+      content: () => ruleMessage,
     }
-    return h(
-        Popover,
-        {
-            overlayClassName: 'edit-cell-rule-popover',
-            visible: !!popoverVisible,
-            ...(getPopupContainer ? {getPopupContainer} : {}),
-        },
-        {
-            default: () => DefaultComp,
-            content: () => ruleMessage,
-        }
-    );
+  );
 };
diff --git a/src/components/Table/src/components/editable/EditableCell.vue b/src/components/Table/src/components/editable/EditableCell.vue
index 95f38fc..24e1456 100644
--- a/src/components/Table/src/components/editable/EditableCell.vue
+++ b/src/components/Table/src/components/editable/EditableCell.vue
@@ -1,488 +1,480 @@
 <template>
-    <div :class="prefixCls">
-        <div
-                v-show="!isEdit"
-                :class="{ [`${prefixCls}__normal`]: true, 'ellipsis-cell': column.ellipsis }"
-                @click="handleEdit"
-        >
-            <div class="cell-content" :title="column.ellipsis ? getValues ?? '' : ''">
-                {{ getValues ? getValues : '&nbsp;' }}
-            </div>
-            <FormOutlined :class="`${prefixCls}__normal-icon`" v-if="!column.editRow" />
-        </div>
-
-        <a-spin v-if="isEdit" :spinning="spinning">
-            <div :class="`${prefixCls}__wrapper`" v-click-outside="onClickOutside">
-                <CellComponent
-                        v-bind="getComponentProps"
-                        :component="getComponent"
-                        :style="getWrapperStyle"
-                        :popoverVisible="getRuleVisible"
-                        :rule="getRule"
-                        :ruleMessage="ruleMessage"
-                        :class="getWrapperClass"
-                        ref="elRef"
-                        @change="handleChange"
-                        @options-change="handleOptionsChange"
-                        @pressEnter="handleEnter"
-                />
-                <div :class="`${prefixCls}__action`" v-if="!getRowEditable">
-                    <CheckOutlined :class="[`${prefixCls}__icon`, 'mx-2']" @click="handleSubmitClick" />
-                    <CloseOutlined :class="`${prefixCls}__icon `" @click="handleCancel" />
-                </div>
-            </div>
-        </a-spin>
+  <div :class="prefixCls">
+    <div v-show="!isEdit" :class="{ [`${prefixCls}__normal`]: true, 'ellipsis-cell': column.ellipsis }" @click="handleEdit">
+      <div class="cell-content" :title="column.ellipsis ? getValues ?? '' : ''">
+        {{ getValues ? getValues : '&nbsp;' }}
+      </div>
+      <FormOutlined :class="`${prefixCls}__normal-icon`" v-if="!column.editRow" />
     </div>
+
+    <a-spin v-if="isEdit" :spinning="spinning">
+      <div :class="`${prefixCls}__wrapper`" v-click-outside="onClickOutside">
+        <CellComponent
+          v-bind="getComponentProps"
+          :component="getComponent"
+          :style="getWrapperStyle"
+          :popoverVisible="getRuleVisible"
+          :rule="getRule"
+          :ruleMessage="ruleMessage"
+          :class="getWrapperClass"
+          ref="elRef"
+          @change="handleChange"
+          @options-change="handleOptionsChange"
+          @pressEnter="handleEnter"
+        />
+        <div :class="`${prefixCls}__action`" v-if="!getRowEditable">
+          <CheckOutlined :class="[`${prefixCls}__icon`, 'mx-2']" @click="handleSubmitClick" />
+          <CloseOutlined :class="`${prefixCls}__icon `" @click="handleCancel" />
+        </div>
+      </div>
+    </a-spin>
+  </div>
 </template>
 <script lang="ts">
-    import type { CSSProperties, PropType } from 'vue';
-    import { computed, defineComponent, nextTick, ref, toRaw, unref, watchEffect } from 'vue';
-    import type { BasicColumn } from '../../types/table';
-    import type { EditRecordRow } from './index';
-    import { CheckOutlined, CloseOutlined, FormOutlined } from '@ant-design/icons-vue';
-    import { CellComponent } from './CellComponent';
+  import type { CSSProperties, PropType } from 'vue';
+  import { computed, defineComponent, nextTick, ref, toRaw, unref, watchEffect } from 'vue';
+  import type { BasicColumn } from '../../types/table';
+  import type { EditRecordRow } from './index';
+  import { CheckOutlined, CloseOutlined, FormOutlined } from '@ant-design/icons-vue';
+  import { CellComponent } from './CellComponent';
 
-    import { useDesign } from '/@/hooks/web/useDesign';
-    import { useTableContext } from '../../hooks/useTableContext';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useTableContext } from '../../hooks/useTableContext';
 
-    import clickOutside from '/@/directives/clickOutside';
+  import clickOutside from '/@/directives/clickOutside';
 
-    import { propTypes } from '/@/utils/propTypes';
-    import { isArray, isBoolean, isFunction, isNumber, isString } from '/@/utils/is';
-    import { createPlaceholderMessage } from './helper';
-    import { omit, pick, set } from 'lodash-es';
-    import { treeToList } from '/@/utils/helper/treeHelper';
-    import { Spin } from 'ant-design-vue';
+  import { propTypes } from '/@/utils/propTypes';
+  import { isArray, isBoolean, isFunction, isNumber, isString } from '/@/utils/is';
+  import { createPlaceholderMessage } from './helper';
+  import { omit, pick, set } from 'lodash-es';
+  import { treeToList } from '/@/utils/helper/treeHelper';
+  import { Spin } from 'ant-design-vue';
 
-    export default defineComponent({
-        name: 'EditableCell',
-        components: { FormOutlined, CloseOutlined, CheckOutlined, CellComponent, ASpin: Spin },
-        directives: {
-            clickOutside,
-        },
-        props: {
-            value: {
-                type: [String, Number, Boolean, Object] as PropType<string | number | boolean | Recordable>,
-                default: '',
-            },
-            record: {
-                type: Object as PropType<EditRecordRow>,
-            },
-            column: {
-                type: Object as PropType<BasicColumn>,
-                default: () => ({}),
-            },
-            index: propTypes.number,
-        },
-        setup(props) {
-            const table = useTableContext();
-            const isEdit = ref(false);
-            const elRef = ref();
-            const ruleVisible = ref(false);
-            const ruleMessage = ref('');
-            const optionsRef = ref<LabelValueOptions>([]);
-            const currentValueRef = ref<any>(props.value);
-            const defaultValueRef = ref<any>(props.value);
-            const spinning = ref<boolean>(false);
+  export default defineComponent({
+    name: 'EditableCell',
+    components: { FormOutlined, CloseOutlined, CheckOutlined, CellComponent, ASpin: Spin },
+    directives: {
+      clickOutside,
+    },
+    props: {
+      value: {
+        type: [String, Number, Boolean, Object] as PropType<string | number | boolean | Recordable>,
+        default: '',
+      },
+      record: {
+        type: Object as PropType<EditRecordRow>,
+      },
+      column: {
+        type: Object as PropType<BasicColumn>,
+        default: () => ({}),
+      },
+      index: propTypes.number,
+    },
+    setup(props) {
+      const table = useTableContext();
+      const isEdit = ref(false);
+      const elRef = ref();
+      const ruleVisible = ref(false);
+      const ruleMessage = ref('');
+      const optionsRef = ref<LabelValueOptions>([]);
+      const currentValueRef = ref<any>(props.value);
+      const defaultValueRef = ref<any>(props.value);
+      const spinning = ref<boolean>(false);
 
-            const { prefixCls } = useDesign('editable-cell');
+      const { prefixCls } = useDesign('editable-cell');
 
-            const getComponent = computed(() => props.column?.editComponent || 'Input');
-            const getRule = computed(() => props.column?.editRule);
+      const getComponent = computed(() => props.column?.editComponent || 'Input');
+      const getRule = computed(() => props.column?.editRule);
 
-            const getRuleVisible = computed(() => {
-                return unref(ruleMessage) && unref(ruleVisible);
-            });
+      const getRuleVisible = computed(() => {
+        return unref(ruleMessage) && unref(ruleVisible);
+      });
 
-            const getIsCheckComp = computed(() => {
-                const component = unref(getComponent);
-                return ['Checkbox', 'Switch'].includes(component);
-            });
+      const getIsCheckComp = computed(() => {
+        const component = unref(getComponent);
+        return ['Checkbox', 'Switch'].includes(component);
+      });
 
-            const getComponentProps = computed(() => {
-                const compProps = props.column?.editComponentProps ?? {};
-                const component = unref(getComponent);
-                const apiSelectProps: Recordable = {};
-                if (component === 'ApiSelect') {
-                    apiSelectProps.cache = true;
-                }
+      const getComponentProps = computed(() => {
+        const compProps = props.column?.editComponentProps ?? {};
+        const component = unref(getComponent);
+        const apiSelectProps: Recordable = {};
+        if (component === 'ApiSelect') {
+          apiSelectProps.cache = true;
+        }
 
-                const isCheckValue = unref(getIsCheckComp);
+        const isCheckValue = unref(getIsCheckComp);
 
-                const valueField = isCheckValue ? 'checked' : 'value';
-                const val = unref(currentValueRef);
+        const valueField = isCheckValue ? 'checked' : 'value';
+        const val = unref(currentValueRef);
 
-                const value = isCheckValue ? (isNumber(val) && isBoolean(val) ? val : !!val) : val;
+        const value = isCheckValue ? (isNumber(val) && isBoolean(val) ? val : !!val) : val;
 
-                return {
-                    size: 'small',
-                    getPopupContainer: () => unref(table?.wrapRef.value) ?? document.body,
-                    getCalendarContainer: () => unref(table?.wrapRef.value) ?? document.body,
-                    placeholder: createPlaceholderMessage(unref(getComponent)),
-                    ...apiSelectProps,
-                    ...omit(compProps, 'onChange'),
-                    [valueField]: value,
-                };
-            });
+        return {
+          size: 'small',
+          getPopupContainer: () => unref(table?.wrapRef.value) ?? document.body,
+          getCalendarContainer: () => unref(table?.wrapRef.value) ?? document.body,
+          placeholder: createPlaceholderMessage(unref(getComponent)),
+          ...apiSelectProps,
+          ...omit(compProps, 'onChange'),
+          [valueField]: value,
+        };
+      });
 
-            const getValues = computed(() => {
-                const { editComponentProps, editValueMap } = props.column;
+      const getValues = computed(() => {
+        const { editComponentProps, editValueMap } = props.column;
 
-                const value = unref(currentValueRef);
+        const value = unref(currentValueRef);
 
-                if (editValueMap && isFunction(editValueMap)) {
-                    return editValueMap(value);
-                }
+        if (editValueMap && isFunction(editValueMap)) {
+          return editValueMap(value);
+        }
 
-                const component = unref(getComponent);
-                if (!component.includes('Select')) {
-                    return value;
-                }
+        const component = unref(getComponent);
+        if (!component.includes('Select')) {
+          return value;
+        }
 
-                const options: LabelValueOptions = editComponentProps?.options ?? (unref(optionsRef) || []);
-                const option = options.find((item) => `${item.value}` === `${value}`);
+        const options: LabelValueOptions = editComponentProps?.options ?? (unref(optionsRef) || []);
+        const option = options.find((item) => `${item.value}` === `${value}`);
 
-                return option?.label ?? value;
-            });
+        return option?.label ?? value;
+      });
 
-            const getWrapperStyle = computed((): CSSProperties => {
-                if (unref(getIsCheckComp) || unref(getRowEditable)) {
-                    return {};
-                }
-                return {
-                    width: 'calc(100% - 48px)',
-                };
-            });
+      const getWrapperStyle = computed((): CSSProperties => {
+        if (unref(getIsCheckComp) || unref(getRowEditable)) {
+          return {};
+        }
+        return {
+          width: 'calc(100% - 48px)',
+        };
+      });
 
-            const getWrapperClass = computed(() => {
-                const { align = 'center' } = props.column;
-                return `edit-cell-align-${align}`;
-            });
+      const getWrapperClass = computed(() => {
+        const { align = 'center' } = props.column;
+        return `edit-cell-align-${align}`;
+      });
 
-            const getRowEditable = computed(() => {
-                const { editable } = props.record || {};
-                return !!editable;
-            });
+      const getRowEditable = computed(() => {
+        const { editable } = props.record || {};
+        return !!editable;
+      });
 
-            watchEffect(() => {
-                defaultValueRef.value = props.value;
-                currentValueRef.value = props.value;
-            });
+      watchEffect(() => {
+        defaultValueRef.value = props.value;
+        currentValueRef.value = props.value;
+      });
 
-            watchEffect(() => {
-                const { editable } = props.column;
-                if (isBoolean(editable) || isBoolean(unref(getRowEditable))) {
-                    isEdit.value = !!editable || unref(getRowEditable);
-                }
-            });
+      watchEffect(() => {
+        const { editable } = props.column;
+        if (isBoolean(editable) || isBoolean(unref(getRowEditable))) {
+          isEdit.value = !!editable || unref(getRowEditable);
+        }
+      });
 
-            function handleEdit() {
-                if (unref(getRowEditable) || unref(props.column?.editRow)) return;
-                ruleMessage.value = '';
-                isEdit.value = true;
-                nextTick(() => {
-                    const el = unref(elRef);
-                    el?.focus?.();
-                });
+      function handleEdit() {
+        if (unref(getRowEditable) || unref(props.column?.editRow)) return;
+        ruleMessage.value = '';
+        isEdit.value = true;
+        nextTick(() => {
+          const el = unref(elRef);
+          el?.focus?.();
+        });
+      }
+
+      async function handleChange(e: any) {
+        const component = unref(getComponent);
+        if (!e) {
+          currentValueRef.value = e;
+        } else if (e?.target && Reflect.has(e.target, 'value')) {
+          currentValueRef.value = (e as ChangeEvent).target.value;
+        } else if (component === 'Checkbox') {
+          currentValueRef.value = (e as ChangeEvent).target.checked;
+        } else if (isString(e) || isBoolean(e) || isNumber(e)) {
+          currentValueRef.value = e;
+        }
+        const onChange = props.column?.editComponentProps?.onChange;
+        if (onChange && isFunction(onChange)) onChange(...arguments);
+
+        table.emit?.('edit-change', {
+          column: props.column,
+          value: unref(currentValueRef),
+          record: toRaw(props.record),
+        });
+        handleSubmiRule();
+      }
+
+      async function handleSubmiRule() {
+        const { column, record } = props;
+        const { editRule } = column;
+        const currentValue = unref(currentValueRef);
+
+        if (editRule) {
+          if (isBoolean(editRule) && !currentValue && !isNumber(currentValue)) {
+            ruleVisible.value = true;
+            const component = unref(getComponent);
+            ruleMessage.value = createPlaceholderMessage(component);
+            return false;
+          }
+          if (isFunction(editRule)) {
+            const res = await editRule(currentValue, record as Recordable);
+            if (!!res) {
+              ruleMessage.value = res;
+              ruleVisible.value = true;
+              return false;
+            } else {
+              ruleMessage.value = '';
+              return true;
             }
+          }
+        }
+        ruleMessage.value = '';
+        return true;
+      }
 
-            async function handleChange(e: any) {
-                const component = unref(getComponent);
-                if (!e) {
-                    currentValueRef.value = e;
-                } else if (e?.target && Reflect.has(e.target, 'value')) {
-                    currentValueRef.value = (e as ChangeEvent).target.value;
-                } else if (component === 'Checkbox') {
-                    currentValueRef.value = (e as ChangeEvent).target.checked;
-                } else if (isString(e) || isBoolean(e) || isNumber(e)) {
-                    currentValueRef.value = e;
-                }
-                const onChange = props.column?.editComponentProps?.onChange;
-                if (onChange && isFunction(onChange)) onChange(...arguments);
+      async function handleSubmit(needEmit = true, valid = true) {
+        if (valid) {
+          const isPass = await handleSubmiRule();
+          if (!isPass) return false;
+        }
 
-                table.emit?.('edit-change', {
-                    column: props.column,
-                    value: unref(currentValueRef),
-                    record: toRaw(props.record),
-                });
-                handleSubmiRule();
+        const { column, index, record } = props;
+        if (!record) return false;
+        const { key, dataIndex } = column;
+        const value = unref(currentValueRef);
+        if (!key || !dataIndex) return;
+
+        const dataKey = (dataIndex || key) as string;
+
+        if (!record.editable) {
+          const { getBindValues } = table;
+
+          const { beforeEditSubmit, columns } = unref(getBindValues);
+
+          if (beforeEditSubmit && isFunction(beforeEditSubmit)) {
+            spinning.value = true;
+            const keys: string[] = columns.map((_column) => _column.dataIndex).filter((field) => !!field) as string[];
+            let result: any = true;
+            try {
+              result = await beforeEditSubmit({
+                record: pick(record, keys),
+                index,
+                key,
+                value,
+              });
+            } catch (e) {
+              result = false;
+            } finally {
+              spinning.value = false;
             }
-
-            async function handleSubmiRule() {
-                const { column, record } = props;
-                const { editRule } = column;
-                const currentValue = unref(currentValueRef);
-
-                if (editRule) {
-                    if (isBoolean(editRule) && !currentValue && !isNumber(currentValue)) {
-                        ruleVisible.value = true;
-                        const component = unref(getComponent);
-                        ruleMessage.value = createPlaceholderMessage(component);
-                        return false;
-                    }
-                    if (isFunction(editRule)) {
-                        const res = await editRule(currentValue, record as Recordable);
-                        if (!!res) {
-                            ruleMessage.value = res;
-                            ruleVisible.value = true;
-                            return false;
-                        } else {
-                            ruleMessage.value = '';
-                            return true;
-                        }
-                    }
-                }
-                ruleMessage.value = '';
-                return true;
+            if (result === false) {
+              return;
             }
+          }
+        }
 
-            async function handleSubmit(needEmit = true, valid = true) {
-                if (valid) {
-                    const isPass = await handleSubmiRule();
-                    if (!isPass) return false;
-                }
+        set(record, dataKey, value);
+        //const record = await table.updateTableData(index, dataKey, value);
+        needEmit && table.emit?.('edit-end', { record, index, key, value });
+        isEdit.value = false;
+      }
 
-                const { column, index, record } = props;
-                if (!record) return false;
-                const { key, dataIndex } = column;
-                const value = unref(currentValueRef);
-                if (!key || !dataIndex) return;
+      async function handleEnter() {
+        if (props.column?.editRow) {
+          return;
+        }
+        handleSubmit();
+      }
 
-                const dataKey = (dataIndex || key) as string;
+      function handleSubmitClick() {
+        handleSubmit();
+      }
 
-                if (!record.editable) {
-                    const { getBindValues } = table;
+      function handleCancel() {
+        isEdit.value = false;
+        currentValueRef.value = defaultValueRef.value;
+        const { column, index, record } = props;
+        const { key, dataIndex } = column;
+        table.emit?.('edit-cancel', {
+          record,
+          index,
+          key: dataIndex || key,
+          value: unref(currentValueRef),
+        });
+      }
 
-                    const { beforeEditSubmit, columns } = unref(getBindValues);
+      function onClickOutside() {
+        if (props.column?.editable || unref(getRowEditable)) {
+          return;
+        }
+        const component = unref(getComponent);
 
-                    if (beforeEditSubmit && isFunction(beforeEditSubmit)) {
-                        spinning.value = true;
-                        const keys: string[] = columns
-                            .map((_column) => _column.dataIndex)
-                            .filter((field) => !!field) as string[];
-                        let result: any = true;
-                        try {
-                            result = await beforeEditSubmit({
-                                record: pick(record, keys),
-                                index,
-                                key,
-                                value,
-                            });
-                        } catch (e) {
-                            result = false;
-                        } finally {
-                            spinning.value = false;
-                        }
-                        if (result === false) {
-                            return;
-                        }
-                    }
-                }
-
-                set(record, dataKey, value);
-                //const record = await table.updateTableData(index, dataKey, value);
-                needEmit && table.emit?.('edit-end', { record, index, key, value });
-                isEdit.value = false;
-            }
-
-            async function handleEnter() {
-                if (props.column?.editRow) {
-                    return;
-                }
-                handleSubmit();
-            }
-
-            function handleSubmitClick() {
-                handleSubmit();
-            }
-
-            function handleCancel() {
-                isEdit.value = false;
-                currentValueRef.value = defaultValueRef.value;
-                const { column, index, record } = props;
-                const { key, dataIndex } = column;
-                table.emit?.('edit-cancel', {
-                    record,
-                    index,
-                    key: dataIndex || key,
-                    value: unref(currentValueRef),
-                });
-            }
-
-            function onClickOutside() {
-                if (props.column?.editable || unref(getRowEditable)) {
-                    return;
-                }
-                const component = unref(getComponent);
-
-                if (component.includes('Input')) {
-                    handleCancel();
-                }
-            }
-
-            // only ApiSelect or TreeSelect
-            function handleOptionsChange(options: LabelValueOptions) {
-                const { replaceFields } = props.column?.editComponentProps ?? {};
-                const component = unref(getComponent);
-                if (component === 'ApiTreeSelect') {
-                    const { title = 'title', value = 'value', children = 'children' } = replaceFields || {};
-                    let listOptions: Recordable[] = treeToList(options, { children });
-                    listOptions = listOptions.map((item) => {
-                        return {
-                            label: item[title],
-                            value: item[value],
-                        };
-                    });
-                    optionsRef.value = listOptions as LabelValueOptions;
-                } else {
-                    optionsRef.value = options;
-                }
-            }
-
-            function initCbs(cbs: 'submitCbs' | 'validCbs' | 'cancelCbs', handle: Fn) {
-                if (props.record) {
-                    /* eslint-disable  */
-                    isArray(props.record[cbs])
-                        ? props.record[cbs]?.push(handle)
-                        : (props.record[cbs] = [handle]);
-                }
-            }
-
-            if (props.record) {
-                initCbs('submitCbs', handleSubmit);
-                initCbs('validCbs', handleSubmiRule);
-                initCbs('cancelCbs', handleCancel);
-
-                if (props.column.dataIndex) {
-                    if (!props.record.editValueRefs) props.record.editValueRefs = {};
-                    props.record.editValueRefs[props.column.dataIndex] = currentValueRef;
-                }
-                /* eslint-disable  */
-                props.record.onCancelEdit = () => {
-                    isArray(props.record?.cancelCbs) && props.record?.cancelCbs.forEach((fn) => fn());
-                };
-                /* eslint-disable */
-                props.record.onSubmitEdit = async () => {
-                    if (isArray(props.record?.submitCbs)) {
-                        if (!props.record?.onValid?.()) return;
-                        const submitFns = props.record?.submitCbs || [];
-                        submitFns.forEach((fn) => fn(false, false));
-                        table.emit?.('edit-row-end');
-                        return true;
-                    }
-                };
-            }
+        if (component.includes('Input')) {
+          handleCancel();
+        }
+      }
 
+      // only ApiSelect or TreeSelect
+      function handleOptionsChange(options: LabelValueOptions) {
+        const { replaceFields } = props.column?.editComponentProps ?? {};
+        const component = unref(getComponent);
+        if (component === 'ApiTreeSelect') {
+          const { title = 'title', value = 'value', children = 'children' } = replaceFields || {};
+          let listOptions: Recordable[] = treeToList(options, { children });
+          listOptions = listOptions.map((item) => {
             return {
-                isEdit,
-                prefixCls,
-                handleEdit,
-                currentValueRef,
-                handleSubmit,
-                handleChange,
-                handleCancel,
-                elRef,
-                getComponent,
-                getRule,
-                onClickOutside,
-                ruleMessage,
-                getRuleVisible,
-                getComponentProps,
-                handleOptionsChange,
-                getWrapperStyle,
-                getWrapperClass,
-                getRowEditable,
-                getValues,
-                handleEnter,
-                handleSubmitClick,
-                spinning,
+              label: item[title],
+              value: item[value],
             };
-        },
-    });
+          });
+          optionsRef.value = listOptions as LabelValueOptions;
+        } else {
+          optionsRef.value = options;
+        }
+      }
+
+      function initCbs(cbs: 'submitCbs' | 'validCbs' | 'cancelCbs', handle: Fn) {
+        if (props.record) {
+          /* eslint-disable  */
+          isArray(props.record[cbs]) ? props.record[cbs]?.push(handle) : (props.record[cbs] = [handle]);
+        }
+      }
+
+      if (props.record) {
+        initCbs('submitCbs', handleSubmit);
+        initCbs('validCbs', handleSubmiRule);
+        initCbs('cancelCbs', handleCancel);
+
+        if (props.column.dataIndex) {
+          if (!props.record.editValueRefs) props.record.editValueRefs = {};
+          props.record.editValueRefs[props.column.dataIndex] = currentValueRef;
+        }
+        /* eslint-disable  */
+        props.record.onCancelEdit = () => {
+          isArray(props.record?.cancelCbs) && props.record?.cancelCbs.forEach((fn) => fn());
+        };
+        /* eslint-disable */
+        props.record.onSubmitEdit = async () => {
+          if (isArray(props.record?.submitCbs)) {
+            if (!props.record?.onValid?.()) return;
+            const submitFns = props.record?.submitCbs || [];
+            submitFns.forEach((fn) => fn(false, false));
+            table.emit?.('edit-row-end');
+            return true;
+          }
+        };
+      }
+
+      return {
+        isEdit,
+        prefixCls,
+        handleEdit,
+        currentValueRef,
+        handleSubmit,
+        handleChange,
+        handleCancel,
+        elRef,
+        getComponent,
+        getRule,
+        onClickOutside,
+        ruleMessage,
+        getRuleVisible,
+        getComponentProps,
+        handleOptionsChange,
+        getWrapperStyle,
+        getWrapperClass,
+        getRowEditable,
+        getValues,
+        handleEnter,
+        handleSubmitClick,
+        spinning,
+      };
+    },
+  });
 </script>
 <style lang="less">
-    @prefix-cls: ~'@{namespace}-editable-cell';
+  @prefix-cls: ~'@{namespace}-editable-cell';
 
-    .edit-cell-align-left {
-        text-align: left;
+  .edit-cell-align-left {
+    text-align: left;
 
-        input:not(.ant-calendar-picker-input, .ant-time-picker-input) {
-            text-align: left;
-        }
+    input:not(.ant-calendar-picker-input, .ant-time-picker-input) {
+      text-align: left;
+    }
+  }
+
+  .edit-cell-align-center {
+    text-align: center;
+
+    input:not(.ant-calendar-picker-input, .ant-time-picker-input) {
+      text-align: center;
+    }
+  }
+
+  .edit-cell-align-right {
+    text-align: right;
+
+    input:not(.ant-calendar-picker-input, .ant-time-picker-input) {
+      text-align: right;
+    }
+  }
+
+  .edit-cell-rule-popover {
+    .ant-popover-inner-content {
+      padding: 4px 8px;
+      color: @error-color;
+      // border: 1px solid @error-color;
+      border-radius: 2px;
+    }
+  }
+  .@{prefix-cls} {
+    position: relative;
+
+    &__wrapper {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      > .ant-select {
+        min-width: calc(100% - 50px);
+      }
     }
 
-    .edit-cell-align-center {
-        text-align: center;
+    &__icon {
+      &:hover {
+        transform: scale(1.2);
 
-        input:not(.ant-calendar-picker-input, .ant-time-picker-input) {
-            text-align: center;
+        svg {
+          color: @primary-color;
         }
+      }
     }
 
-    .edit-cell-align-right {
-        text-align: right;
-
-        input:not(.ant-calendar-picker-input, .ant-time-picker-input) {
-            text-align: right;
-        }
+    .ellipsis-cell {
+      .cell-content {
+        overflow-wrap: break-word;
+        word-break: break-word;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+      }
     }
 
-    .edit-cell-rule-popover {
-        .ant-popover-inner-content {
-            padding: 4px 8px;
-            color: @error-color;
-            // border: 1px solid @error-color;
-            border-radius: 2px;
-        }
+    &__normal {
+      &-icon {
+        position: absolute;
+        top: 4px;
+        right: 0;
+        display: none;
+        width: 20px;
+        cursor: pointer;
+      }
     }
-    .@{prefix-cls} {
-        position: relative;
 
-        &__wrapper {
-            display: flex;
-            align-items: center;
-            justify-content: center;
-
-            > .ant-select {
-                min-width: calc(100% - 50px);
-            }
-        }
-
-        &__icon {
-            &:hover {
-                transform: scale(1.2);
-
-                svg {
-                    color: @primary-color;
-                }
-            }
-        }
-
-        .ellipsis-cell {
-            .cell-content {
-                overflow-wrap: break-word;
-                word-break: break-word;
-                overflow: hidden;
-                white-space: nowrap;
-                text-overflow: ellipsis;
-            }
-        }
-
-        &__normal {
-            &-icon {
-                position: absolute;
-                top: 4px;
-                right: 0;
-                display: none;
-                width: 20px;
-                cursor: pointer;
-            }
-        }
-
-        &:hover {
-            .@{prefix-cls}__normal-icon {
-                display: inline-block;
-            }
-        }
+    &:hover {
+      .@{prefix-cls}__normal-icon {
+        display: inline-block;
+      }
     }
+  }
 </style>
diff --git a/src/components/Table/src/components/editable/index.ts b/src/components/Table/src/components/editable/index.ts
index a3e85e1..4f7d4da 100644
--- a/src/components/Table/src/components/editable/index.ts
+++ b/src/components/Table/src/components/editable/index.ts
@@ -6,63 +6,63 @@ import EditableCell from './EditableCell.vue';
 import { isArray } from '/@/utils/is';
 
 interface Params {
-    text: string;
-    record: Recordable;
-    index: number;
+  text: string;
+  record: Recordable;
+  index: number;
 }
 
 export function renderEditCell(column: BasicColumn) {
-    return ({ text: value, record, index }: Params) => {
-        record.onValid = async () => {
-            if (isArray(record?.validCbs)) {
-                const validFns = (record?.validCbs || []).map((fn) => fn());
-                const res = await Promise.all(validFns);
-                return res.every((item) => !!item);
-            } else {
-                return false;
-            }
-        };
-
-        record.onEdit = async (edit: boolean, submit = false) => {
-            if (!submit) {
-                record.editable = edit;
-            }
-
-            if (!edit && submit) {
-                if (!(await record.onValid())) return false;
-                const res = await record.onSubmitEdit?.();
-                if (res) {
-                    record.editable = false;
-                    return true;
-                }
-                return false;
-            }
-            // cancel
-            if (!edit && !submit) {
-                record.onCancelEdit?.();
-            }
-            return true;
-        };
-
-        return h(EditableCell, {
-            value,
-            record,
-            column,
-            index,
-        });
+  return ({ text: value, record, index }: Params) => {
+    record.onValid = async () => {
+      if (isArray(record?.validCbs)) {
+        const validFns = (record?.validCbs || []).map((fn) => fn());
+        const res = await Promise.all(validFns);
+        return res.every((item) => !!item);
+      } else {
+        return false;
+      }
     };
+
+    record.onEdit = async (edit: boolean, submit = false) => {
+      if (!submit) {
+        record.editable = edit;
+      }
+
+      if (!edit && submit) {
+        if (!(await record.onValid())) return false;
+        const res = await record.onSubmitEdit?.();
+        if (res) {
+          record.editable = false;
+          return true;
+        }
+        return false;
+      }
+      // cancel
+      if (!edit && !submit) {
+        record.onCancelEdit?.();
+      }
+      return true;
+    };
+
+    return h(EditableCell, {
+      value,
+      record,
+      column,
+      index,
+    });
+  };
 }
 
 export type EditRecordRow<T = Recordable> = Partial<
-    {
-        onEdit: (editable: boolean, submit?: boolean) => Promise<boolean>;
-        onValid: () => Promise<boolean>;
-        editable: boolean;
-        onCancel: Fn;
-        onSubmit: Fn;
-        submitCbs: Fn[];
-        cancelCbs: Fn[];
-        validCbs: Fn[];
-        editValueRefs: Recordable<Ref>;
-    } & T
-    >;
+  {
+    onEdit: (editable: boolean, submit?: boolean) => Promise<boolean>;
+    onValid: () => Promise<boolean>;
+    editable: boolean;
+    onCancel: Fn;
+    onSubmit: Fn;
+    submitCbs: Fn[];
+    cancelCbs: Fn[];
+    validCbs: Fn[];
+    editValueRefs: Recordable<Ref>;
+  } & T
+>;
diff --git a/src/components/Table/src/components/settings/ColumnSetting.vue b/src/components/Table/src/components/settings/ColumnSetting.vue
index 8077f53..fff33b5 100644
--- a/src/components/Table/src/components/settings/ColumnSetting.vue
+++ b/src/components/Table/src/components/settings/ColumnSetting.vue
@@ -1,477 +1,444 @@
 <template>
-    <Tooltip placement="top" v-bind="getBindProps">
-        <template #title>
-            <span>{{ t('component.table.settingColumn') }}</span>
-        </template>
-        <Popover
-                placement="bottomLeft"
-                trigger="click"
-                @visibleChange="handleVisibleChange"
-                :overlayClassName="`${prefixCls}__cloumn-list`"
-                :getPopupContainer="getPopupContainer"
-        >
-            <template #title>
-                <div :class="`${prefixCls}__popover-title`">
-                    <Checkbox
-                            :indeterminate="indeterminate"
-                            v-model:checked="checkAll"
-                            @change="onCheckAllChange"
-                    >
-                        {{ t('component.table.settingColumnShow') }}
-                    </Checkbox>
+  <Tooltip placement="top" v-bind="getBindProps">
+    <template #title>
+      <span>{{ t('component.table.settingColumn') }}</span>
+    </template>
+    <Popover placement="bottomLeft" trigger="click" @visibleChange="handleVisibleChange" :overlayClassName="`${prefixCls}__cloumn-list`" :getPopupContainer="getPopupContainer">
+      <template #title>
+        <div :class="`${prefixCls}__popover-title`">
+          <Checkbox :indeterminate="indeterminate" v-model:checked="checkAll" @change="onCheckAllChange">
+            {{ t('component.table.settingColumnShow') }}
+          </Checkbox>
 
-                    <Checkbox v-model:checked="checkIndex" @change="handleIndexCheckChange">
-                        {{ t('component.table.settingIndexColumnShow') }}
-                    </Checkbox>
+          <Checkbox v-model:checked="checkIndex" @change="handleIndexCheckChange">
+            {{ t('component.table.settingIndexColumnShow') }}
+          </Checkbox>
 
-<!--                    <Checkbox-->
-<!--                            v-model:checked="checkSelect"-->
-<!--                            @change="handleSelectCheckChange"-->
-<!--                            :disabled="!defaultRowSelection"-->
-<!--                    >-->
-<!--                        {{ t('component.table.settingSelectColumnShow') }}-->
-<!--                    </Checkbox>-->
+          <!--                    <Checkbox-->
+          <!--                            v-model:checked="checkSelect"-->
+          <!--                            @change="handleSelectCheckChange"-->
+          <!--                            :disabled="!defaultRowSelection"-->
+          <!--                    >-->
+          <!--                        {{ t('component.table.settingSelectColumnShow') }}-->
+          <!--                    </Checkbox>-->
 
-                    <a-button size="small" type="link" @click="reset">
-                        {{ t('common.resetText') }}
-                    </a-button>
-                </div>
-            </template>
+          <a-button size="small" type="link" @click="reset">
+            {{ t('common.resetText') }}
+          </a-button>
+        </div>
+      </template>
 
-            <template #content>
-                <ScrollContainer>
-                    <CheckboxGroup v-model:value="checkedList" @change="onChange" ref="columnListRef">
-                        <template v-for="item in plainOptions" :key="item.value">
-                            <div :class="`${prefixCls}__check-item`" v-if="!('ifShow' in item && !item.ifShow)">
-                                <DragOutlined class="table-coulmn-drag-icon" />
-                                <Checkbox :value="item.value">
-                                    {{ item.label }}
-                                </Checkbox>
+      <template #content>
+        <ScrollContainer>
+          <CheckboxGroup v-model:value="checkedList" @change="onChange" ref="columnListRef">
+            <template v-for="item in plainOptions" :key="item.value">
+              <div :class="`${prefixCls}__check-item`" v-if="!('ifShow' in item && !item.ifShow)">
+                <DragOutlined class="table-coulmn-drag-icon" />
+                <Checkbox :value="item.value">
+                  {{ item.label }}
+                </Checkbox>
 
-                                <Tooltip
-                                        placement="bottomLeft"
-                                        :mouseLeaveDelay="0.4"
-                                        :getPopupContainer="getPopupContainer"
-                                >
-                                    <template #title>
-                                        {{ t('component.table.settingFixedLeft') }}
-                                    </template>
-                                    <Icon
-                                            icon="line-md:arrow-align-left"
-                                            :class="[
+                <Tooltip placement="bottomLeft" :mouseLeaveDelay="0.4" :getPopupContainer="getPopupContainer">
+                  <template #title>
+                    {{ t('component.table.settingFixedLeft') }}
+                  </template>
+                  <Icon
+                    icon="line-md:arrow-align-left"
+                    :class="[
                       `${prefixCls}__fixed-left`,
                       {
                         active: item.fixed === 'left',
                         disabled: !checkedList.includes(item.value),
                       },
                     ]"
-                                            @click="handleColumnFixed(item, 'left')"
-                                    />
-                                </Tooltip>
-                                <Divider type="vertical" />
-                                <Tooltip
-                                        placement="bottomLeft"
-                                        :mouseLeaveDelay="0.4"
-                                        :getPopupContainer="getPopupContainer"
-                                >
-                                    <template #title>
-                                        {{ t('component.table.settingFixedRight') }}
-                                    </template>
-                                    <Icon
-                                            icon="line-md:arrow-align-left"
-                                            :class="[
+                    @click="handleColumnFixed(item, 'left')"
+                  />
+                </Tooltip>
+                <Divider type="vertical" />
+                <Tooltip placement="bottomLeft" :mouseLeaveDelay="0.4" :getPopupContainer="getPopupContainer">
+                  <template #title>
+                    {{ t('component.table.settingFixedRight') }}
+                  </template>
+                  <Icon
+                    icon="line-md:arrow-align-left"
+                    :class="[
                       `${prefixCls}__fixed-right`,
                       {
                         active: item.fixed === 'right',
                         disabled: !checkedList.includes(item.value),
                       },
                     ]"
-                                            @click="handleColumnFixed(item, 'right')"
-                                    />
-                                </Tooltip>
-                            </div>
-                        </template>
-                    </CheckboxGroup>
-                </ScrollContainer>
+                    @click="handleColumnFixed(item, 'right')"
+                  />
+                </Tooltip>
+              </div>
             </template>
-            <SettingOutlined />
-        </Popover>
-    </Tooltip>
+          </CheckboxGroup>
+        </ScrollContainer>
+      </template>
+      <SettingOutlined />
+    </Popover>
+  </Tooltip>
 </template>
 <script lang="ts">
-    import type { BasicColumn, ColumnChangeParam } from '../../types/table';
-    import {
-        defineComponent,
-        ref,
-        reactive,
-        toRefs,
-        watchEffect,
-        nextTick,
-        unref,
-        computed,
-    } from 'vue';
-    import { Tooltip, Popover, Checkbox, Divider } from 'ant-design-vue';
-    import { SettingOutlined, DragOutlined } from '@ant-design/icons-vue';
-    import { Icon } from '/@/components/Icon';
-    import { ScrollContainer } from '/@/components/Container';
-    import { useI18n } from '/@/hooks/web/useI18n';
-    import { useTableContext } from '../../hooks/useTableContext';
-    import { useDesign } from '/@/hooks/web/useDesign';
-    import { useSortable } from '/@/hooks/web/useSortable';
-    import { isFunction, isNullAndUnDef } from '/@/utils/is';
-    import { getPopupContainer as getParentContainer } from '/@/utils';
-    import { omit } from 'lodash-es';
+  import type { BasicColumn, ColumnChangeParam } from '../../types/table';
+  import { defineComponent, ref, reactive, toRefs, watchEffect, nextTick, unref, computed } from 'vue';
+  import { Tooltip, Popover, Checkbox, Divider } from 'ant-design-vue';
+  import { SettingOutlined, DragOutlined } from '@ant-design/icons-vue';
+  import { Icon } from '/@/components/Icon';
+  import { ScrollContainer } from '/@/components/Container';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  import { useTableContext } from '../../hooks/useTableContext';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useSortable } from '/@/hooks/web/useSortable';
+  import { isFunction, isNullAndUnDef } from '/@/utils/is';
+  import { getPopupContainer as getParentContainer } from '/@/utils';
+  import { omit } from 'lodash-es';
 
-    interface State {
-        checkAll: boolean;
-        checkedList: string[];
-        defaultCheckList: string[];
-    }
+  interface State {
+    checkAll: boolean;
+    checkedList: string[];
+    defaultCheckList: string[];
+  }
 
-    interface Options {
-        label: string;
-        value: string;
-        fixed?: boolean | 'left' | 'right';
-    }
+  interface Options {
+    label: string;
+    value: string;
+    fixed?: boolean | 'left' | 'right';
+  }
 
-    export default defineComponent({
-        name: 'ColumnSetting',
-        props: {
-          isMobile: Boolean,
-        },
-        components: {
-            SettingOutlined,
-            Popover,
-            Tooltip,
-            Checkbox,
-            CheckboxGroup: Checkbox.Group,
-            DragOutlined,
-            ScrollContainer,
-            Divider,
-            Icon,
-        },
-        emits: ['columns-change'],
+  export default defineComponent({
+    name: 'ColumnSetting',
+    props: {
+      isMobile: Boolean,
+    },
+    components: {
+      SettingOutlined,
+      Popover,
+      Tooltip,
+      Checkbox,
+      CheckboxGroup: Checkbox.Group,
+      DragOutlined,
+      ScrollContainer,
+      Divider,
+      Icon,
+    },
+    emits: ['columns-change'],
 
-        setup(props, { emit, attrs }) {
-            const { t } = useI18n();
-            const table = useTableContext();
+    setup(props, { emit, attrs }) {
+      const { t } = useI18n();
+      const table = useTableContext();
 
-            const defaultRowSelection = omit(table.getRowSelection(), 'selectedRowKeys');
-            let inited = false;
+      const defaultRowSelection = omit(table.getRowSelection(), 'selectedRowKeys');
+      let inited = false;
 
-            const cachePlainOptions = ref<Options[]>([]);
-            const plainOptions = ref<Options[]>([]);
+      const cachePlainOptions = ref<Options[]>([]);
+      const plainOptions = ref<Options[]>([]);
 
-            const plainSortOptions = ref<Options[]>([]);
+      const plainSortOptions = ref<Options[]>([]);
 
-            const columnListRef = ref<ComponentRef>(null);
+      const columnListRef = ref<ComponentRef>(null);
 
-            const state = reactive<State>({
-                checkAll: true,
-                checkedList: [],
-                defaultCheckList: [],
-            });
+      const state = reactive<State>({
+        checkAll: true,
+        checkedList: [],
+        defaultCheckList: [],
+      });
 
-            const checkIndex = ref(false);
-            const checkSelect = ref(false);
+      const checkIndex = ref(false);
+      const checkSelect = ref(false);
 
-            const { prefixCls } = useDesign('basic-column-setting');
+      const { prefixCls } = useDesign('basic-column-setting');
 
-            const getValues = computed(() => {
-                return unref(table?.getBindValues) || {};
-            });
+      const getValues = computed(() => {
+        return unref(table?.getBindValues) || {};
+      });
 
-            const getBindProps = computed(() => {
-              let obj = {}
-              if (props.isMobile){
-                obj['visible'] = false
+      const getBindProps = computed(() => {
+        let obj = {};
+        if (props.isMobile) {
+          obj['visible'] = false;
+        }
+        return obj;
+      });
+
+      watchEffect(() => {
+        const columns = table.getColumns();
+        if (columns.length) {
+          init();
+        }
+      });
+
+      watchEffect(() => {
+        const values = unref(getValues);
+        checkIndex.value = !!values.showIndexColumn;
+        checkSelect.value = !!values.rowSelection;
+      });
+
+      function getColumns() {
+        const ret: Options[] = [];
+        table.getColumns({ ignoreIndex: true, ignoreAction: true }).forEach((item) => {
+          ret.push({
+            label: (item.title as string) || (item.customTitle as string),
+            value: (item.dataIndex || item.title) as string,
+            ...item,
+          });
+        });
+        return ret;
+      }
+
+      function init() {
+        const columns = getColumns();
+
+        const checkList = table
+          .getColumns({ ignoreAction: true })
+          .map((item) => {
+            if (item.defaultHidden) {
+              return '';
+            }
+            return item.dataIndex || item.title;
+          })
+          .filter(Boolean) as string[];
+
+        if (!plainOptions.value.length) {
+          plainOptions.value = columns;
+          plainSortOptions.value = columns;
+          cachePlainOptions.value = columns;
+          state.defaultCheckList = checkList;
+        } else {
+          // const fixedColumns = columns.filter((item) =>
+          //   Reflect.has(item, 'fixed')
+          // ) as BasicColumn[];
+
+          unref(plainOptions).forEach((item: BasicColumn) => {
+            const findItem = columns.find((col: BasicColumn) => col.dataIndex === item.dataIndex);
+            if (findItem) {
+              item.fixed = findItem.fixed;
+            }
+          });
+        }
+        state.checkedList = checkList;
+      }
+
+      // checkAll change
+      function onCheckAllChange(e: ChangeEvent) {
+        const checkList = plainOptions.value.map((item) => item.value);
+        if (e.target.checked) {
+          state.checkedList = checkList;
+          setColumns(checkList);
+        } else {
+          state.checkedList = [];
+          setColumns([]);
+        }
+      }
+
+      const indeterminate = computed(() => {
+        const len = plainOptions.value.length;
+        let checkdedLen = state.checkedList.length;
+        unref(checkIndex) && checkdedLen--;
+        return checkdedLen > 0 && checkdedLen < len;
+      });
+
+      // Trigger when check/uncheck a column
+      function onChange(checkedList: string[]) {
+        const len = plainOptions.value.length;
+        state.checkAll = checkedList.length === len;
+
+        const sortList = unref(plainSortOptions).map((item) => item.value);
+        checkedList.sort((prev, next) => {
+          return sortList.indexOf(prev) - sortList.indexOf(next);
+        });
+        setColumns(checkedList);
+      }
+
+      // reset columns
+      function reset() {
+        state.checkedList = [...state.defaultCheckList];
+        state.checkAll = true;
+        plainOptions.value = unref(cachePlainOptions);
+        plainSortOptions.value = unref(cachePlainOptions);
+        setColumns(table.getCacheColumns());
+      }
+
+      // Open the pop-up window for drag and drop initialization
+      function handleVisibleChange() {
+        if (inited) return;
+        nextTick(() => {
+          const columnListEl = unref(columnListRef);
+          if (!columnListEl) return;
+          const el = columnListEl.$el as any;
+          if (!el) return;
+          // Drag and drop sort
+          const { initSortable } = useSortable(el, {
+            handle: '.table-coulmn-drag-icon ',
+            onEnd: (evt) => {
+              const { oldIndex, newIndex } = evt;
+              if (isNullAndUnDef(oldIndex) || isNullAndUnDef(newIndex) || oldIndex === newIndex) {
+                return;
               }
-              return obj
-            })
+              // Sort column
+              const columns = getColumns();
 
-            watchEffect(() => {
-                const columns = table.getColumns();
-                if (columns.length) {
-                    init();
-                }
-            });
+              if (oldIndex > newIndex) {
+                columns.splice(newIndex, 0, columns[oldIndex]);
+                columns.splice(oldIndex + 1, 1);
+              } else {
+                columns.splice(newIndex + 1, 0, columns[oldIndex]);
+                columns.splice(oldIndex, 1);
+              }
 
-            watchEffect(() => {
-                const values = unref(getValues);
-                checkIndex.value = !!values.showIndexColumn;
-                checkSelect.value = !!values.rowSelection;
-            });
+              plainSortOptions.value = columns;
+              plainOptions.value = columns;
+              setColumns(columns);
+            },
+          });
+          initSortable();
+          inited = true;
+        });
+      }
 
-            function getColumns() {
-                const ret: Options[] = [];
-                table.getColumns({ ignoreIndex: true, ignoreAction: true }).forEach((item) => {
-                    ret.push({
-                        label: (item.title as string) || (item.customTitle as string),
-                        value: (item.dataIndex || item.title) as string,
-                        ...item,
-                    });
-                });
-                return ret;
-            }
+      // Control whether the serial number column is displayed
+      function handleIndexCheckChange(e: ChangeEvent) {
+        table.setProps({
+          showIndexColumn: e.target.checked,
+        });
+      }
 
-            function init() {
-                const columns = getColumns();
+      // Control whether the check box is displayed
+      function handleSelectCheckChange(e: ChangeEvent) {
+        table.setProps({
+          rowSelection: e.target.checked ? defaultRowSelection : undefined,
+        });
+      }
 
-                const checkList = table
-                    .getColumns({ ignoreAction: true })
-                    .map((item) => {
-                        if (item.defaultHidden) {
-                            return '';
-                        }
-                        return item.dataIndex || item.title;
-                    })
-                    .filter(Boolean) as string[];
+      function handleColumnFixed(item: BasicColumn, fixed?: 'left' | 'right') {
+        if (!state.checkedList.includes(item.dataIndex as string)) return;
 
-                if (!plainOptions.value.length) {
-                    plainOptions.value = columns;
-                    plainSortOptions.value = columns;
-                    cachePlainOptions.value = columns;
-                    state.defaultCheckList = checkList;
-                } else {
-                    // const fixedColumns = columns.filter((item) =>
-                    //   Reflect.has(item, 'fixed')
-                    // ) as BasicColumn[];
+        const columns = getColumns() as BasicColumn[];
+        const isFixed = item.fixed === fixed ? false : fixed;
+        const index = columns.findIndex((col) => col.dataIndex === item.dataIndex);
+        if (index !== -1) {
+          columns[index].fixed = isFixed;
+        }
+        item.fixed = isFixed;
 
-                    unref(plainOptions).forEach((item: BasicColumn) => {
-                        const findItem = columns.find((col: BasicColumn) => col.dataIndex === item.dataIndex);
-                        if (findItem) {
-                            item.fixed = findItem.fixed;
-                        }
-                    });
-                }
-                state.checkedList = checkList;
-            }
+        if (isFixed && !item.width) {
+          item.width = 100;
+        }
+        table.setCacheColumnsByField?.(item.dataIndex, { fixed: isFixed });
+        setColumns(columns);
+      }
 
-            // checkAll change
-            function onCheckAllChange(e: ChangeEvent) {
-                const checkList = plainOptions.value.map((item) => item.value);
-                if (e.target.checked) {
-                    state.checkedList = checkList;
-                    setColumns(checkList);
-                } else {
-                    state.checkedList = [];
-                    setColumns([]);
-                }
-            }
+      function setColumns(columns: BasicColumn[] | string[]) {
+        table.setColumns(columns);
+        const data: ColumnChangeParam[] = unref(plainOptions).map((col) => {
+          const visible = columns.findIndex((c: BasicColumn | string) => c === col.value || (typeof c !== 'string' && c.dataIndex === col.value)) !== -1;
+          return { dataIndex: col.value, fixed: col.fixed, visible };
+        });
 
-            const indeterminate = computed(() => {
-                const len = plainOptions.value.length;
-                let checkdedLen = state.checkedList.length;
-                unref(checkIndex) && checkdedLen--;
-                return checkdedLen > 0 && checkdedLen < len;
-            });
+        emit('columns-change', data);
+      }
 
-            // Trigger when check/uncheck a column
-            function onChange(checkedList: string[]) {
-                const len = plainOptions.value.length;
-                state.checkAll = checkedList.length === len;
+      function getPopupContainer() {
+        return isFunction(attrs.getPopupContainer) ? attrs.getPopupContainer() : getParentContainer();
+      }
 
-                const sortList = unref(plainSortOptions).map((item) => item.value);
-                checkedList.sort((prev, next) => {
-                    return sortList.indexOf(prev) - sortList.indexOf(next);
-                });
-                setColumns(checkedList);
-            }
-
-            // reset columns
-            function reset() {
-                state.checkedList = [...state.defaultCheckList];
-                state.checkAll = true;
-                plainOptions.value = unref(cachePlainOptions);
-                plainSortOptions.value = unref(cachePlainOptions);
-                setColumns(table.getCacheColumns());
-            }
-
-            // Open the pop-up window for drag and drop initialization
-            function handleVisibleChange() {
-                if (inited) return;
-                nextTick(() => {
-                    const columnListEl = unref(columnListRef);
-                    if (!columnListEl) return;
-                    const el = columnListEl.$el as any;
-                    if (!el) return;
-                    // Drag and drop sort
-                    const { initSortable } = useSortable(el, {
-                        handle: '.table-coulmn-drag-icon ',
-                        onEnd: (evt) => {
-                            const { oldIndex, newIndex } = evt;
-                            if (isNullAndUnDef(oldIndex) || isNullAndUnDef(newIndex) || oldIndex === newIndex) {
-                                return;
-                            }
-                            // Sort column
-                            const columns = getColumns();
-
-                            if (oldIndex > newIndex) {
-                                columns.splice(newIndex, 0, columns[oldIndex]);
-                                columns.splice(oldIndex + 1, 1);
-                            } else {
-                                columns.splice(newIndex + 1, 0, columns[oldIndex]);
-                                columns.splice(oldIndex, 1);
-                            }
-
-                            plainSortOptions.value = columns;
-                            plainOptions.value = columns;
-                            setColumns(columns);
-                        },
-                    });
-                    initSortable();
-                    inited = true;
-                });
-            }
-
-            // Control whether the serial number column is displayed
-            function handleIndexCheckChange(e: ChangeEvent) {
-                table.setProps({
-                    showIndexColumn: e.target.checked,
-                });
-            }
-
-            // Control whether the check box is displayed
-            function handleSelectCheckChange(e: ChangeEvent) {
-                table.setProps({
-                    rowSelection: e.target.checked ? defaultRowSelection : undefined,
-                });
-            }
-
-            function handleColumnFixed(item: BasicColumn, fixed?: 'left' | 'right') {
-                if (!state.checkedList.includes(item.dataIndex as string)) return;
-
-                const columns = getColumns() as BasicColumn[];
-                const isFixed = item.fixed === fixed ? false : fixed;
-                const index = columns.findIndex((col) => col.dataIndex === item.dataIndex);
-                if (index !== -1) {
-                    columns[index].fixed = isFixed;
-                }
-                item.fixed = isFixed;
-
-                if (isFixed && !item.width) {
-                    item.width = 100;
-                }
-                table.setCacheColumnsByField?.(item.dataIndex, { fixed: isFixed });
-                setColumns(columns);
-            }
-
-            function setColumns(columns: BasicColumn[] | string[]) {
-                table.setColumns(columns);
-                const data: ColumnChangeParam[] = unref(plainOptions).map((col) => {
-                    const visible =
-                        columns.findIndex(
-                            (c: BasicColumn | string) =>
-                                c === col.value || (typeof c !== 'string' && c.dataIndex === col.value)
-                        ) !== -1;
-                    return { dataIndex: col.value, fixed: col.fixed, visible };
-                });
-
-                emit('columns-change', data);
-            }
-
-            function getPopupContainer() {
-                return isFunction(attrs.getPopupContainer)
-                    ? attrs.getPopupContainer()
-                    : getParentContainer();
-            }
-
-            return {
-                getBindProps,
-                t,
-                ...toRefs(state),
-                indeterminate,
-                onCheckAllChange,
-                onChange,
-                plainOptions,
-                reset,
-                prefixCls,
-                columnListRef,
-                handleVisibleChange,
-                checkIndex,
-                checkSelect,
-                handleIndexCheckChange,
-                handleSelectCheckChange,
-                defaultRowSelection,
-                handleColumnFixed,
-                getPopupContainer,
-            };
-        },
-    });
+      return {
+        getBindProps,
+        t,
+        ...toRefs(state),
+        indeterminate,
+        onCheckAllChange,
+        onChange,
+        plainOptions,
+        reset,
+        prefixCls,
+        columnListRef,
+        handleVisibleChange,
+        checkIndex,
+        checkSelect,
+        handleIndexCheckChange,
+        handleSelectCheckChange,
+        defaultRowSelection,
+        handleColumnFixed,
+        getPopupContainer,
+      };
+    },
+  });
 </script>
 <style lang="less">
-    @prefix-cls: ~'@{namespace}-basic-column-setting';
+  @prefix-cls: ~'@{namespace}-basic-column-setting';
 
-    .table-coulmn-drag-icon {
-        margin: 0 5px;
-        cursor: move;
+  .table-coulmn-drag-icon {
+    margin: 0 5px;
+    cursor: move;
+  }
+
+  .@{prefix-cls} {
+    &__popover-title {
+      position: relative;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
     }
 
-    .@{prefix-cls} {
-        &__popover-title {
-            position: relative;
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-        }
-
-        &__check-item {
-            display: flex;
-            align-items: center;
-            min-width: 100%;
-            padding: 4px 16px 8px 0;
-
-            .ant-checkbox-wrapper {
-                width: 100%;
-
-                &:hover {
-                    color: @primary-color;
-                }
-            }
-        }
-
-        &__fixed-left,
-        &__fixed-right {
-            color: rgba(0, 0, 0, 0.45);
-            cursor: pointer;
-
-            &.active,
-            &:hover {
-                color: @primary-color;
-            }
-
-            &.disabled {
-                color: @disabled-color;
-                cursor: not-allowed;
-            }
-        }
-
-        &__fixed-right {
-            transform: rotate(180deg);
-        }
-
-        &__cloumn-list {
-            svg {
-                width: 1em !important;
-                height: 1em !important;
-            }
-
-            .ant-popover-inner-content {
-                // max-height: 360px;
-                padding-right: 0;
-                padding-left: 0;
-                // overflow: auto;
-            }
-
-            .ant-checkbox-group {
-                width: 100%;
-                min-width: 260px;
-                // flex-wrap: wrap;
-            }
-
-            .scrollbar {
-                height: 220px;
-            }
+    &__check-item {
+      display: flex;
+      align-items: center;
+      min-width: 100%;
+      padding: 4px 16px 8px 0;
+
+      .ant-checkbox-wrapper {
+        width: 100%;
+
+        &:hover {
+          color: @primary-color;
         }
+      }
     }
+
+    &__fixed-left,
+    &__fixed-right {
+      color: rgba(0, 0, 0, 0.45);
+      cursor: pointer;
+
+      &.active,
+      &:hover {
+        color: @primary-color;
+      }
+
+      &.disabled {
+        color: @disabled-color;
+        cursor: not-allowed;
+      }
+    }
+
+    &__fixed-right {
+      transform: rotate(180deg);
+    }
+
+    &__cloumn-list {
+      svg {
+        width: 1em !important;
+        height: 1em !important;
+      }
+
+      .ant-popover-inner-content {
+        // max-height: 360px;
+        padding-right: 0;
+        padding-left: 0;
+        // overflow: auto;
+      }
+
+      .ant-checkbox-group {
+        width: 100%;
+        min-width: 260px;
+        // flex-wrap: wrap;
+      }
+
+      .scrollbar {
+        height: 220px;
+      }
+    }
+  }
 </style>
diff --git a/src/components/Table/src/components/settings/FullScreenSetting.vue b/src/components/Table/src/components/settings/FullScreenSetting.vue
index 7cd6275..046d647 100644
--- a/src/components/Table/src/components/settings/FullScreenSetting.vue
+++ b/src/components/Table/src/components/settings/FullScreenSetting.vue
@@ -31,12 +31,12 @@
       const { t } = useI18n();
       const { toggle, isFullscreen } = useFullscreen(table.wrapRef);
       const getBindProps = computed(() => {
-        let obj = {}
-        if (props.isMobile){
-          obj['visible'] = false
+        let obj = {};
+        if (props.isMobile) {
+          obj['visible'] = false;
         }
-        return obj
-      })
+        return obj;
+      });
       return {
         getBindProps,
         toggle,
diff --git a/src/components/Table/src/components/settings/RedoSetting.vue b/src/components/Table/src/components/settings/RedoSetting.vue
index 87f028a..e584c13 100644
--- a/src/components/Table/src/components/settings/RedoSetting.vue
+++ b/src/components/Table/src/components/settings/RedoSetting.vue
@@ -27,16 +27,16 @@
       const { t } = useI18n();
 
       const getBindProps = computed(() => {
-        let obj = {}
-        if (props.isMobile){
-          obj['visible'] = false
+        let obj = {};
+        if (props.isMobile) {
+          obj['visible'] = false;
         }
-        return obj
-      })
+        return obj;
+      });
 
       function redo() {
         table.reload();
-        table.emit!('table-redo')
+        table.emit!('table-redo');
       }
 
       return { getBindProps, redo, t };
diff --git a/src/components/Table/src/components/settings/SizeSetting.vue b/src/components/Table/src/components/settings/SizeSetting.vue
index 365d8e5..14b24a3 100644
--- a/src/components/Table/src/components/settings/SizeSetting.vue
+++ b/src/components/Table/src/components/settings/SizeSetting.vue
@@ -49,12 +49,12 @@
 
       const selectedKeysRef = ref<SizeType[]>([table.getSize()]);
       const getBindProps = computed(() => {
-        let obj = {}
-        if (props.isMobile){
-          obj['visible'] = false
+        let obj = {};
+        if (props.isMobile) {
+          obj['visible'] = false;
         }
-        return obj
-      })
+        return obj;
+      });
       function handleTitleClick({ key }: { key: SizeType }) {
         selectedKeysRef.value = [key];
         table.setProps({
diff --git a/src/components/Table/src/components/settings/index.vue b/src/components/Table/src/components/settings/index.vue
index a0e78da..3a615ad 100644
--- a/src/components/Table/src/components/settings/index.vue
+++ b/src/components/Table/src/components/settings/index.vue
@@ -1,79 +1,74 @@
 <template>
-    <div class="table-settings">
-        <RedoSetting v-if="getSetting.redo" :isMobile="isMobile" :getPopupContainer="getTableContainer"/>
-        <SizeSetting v-if="getSetting.size" :isMobile="isMobile" :getPopupContainer="getTableContainer"/>
-        <ColumnSetting
-                v-if="getSetting.setting"
-                :isMobile="isMobile"
-                @columns-change="handleColumnChange"
-                :getPopupContainer="getTableContainer"
-        />
-        <FullScreenSetting v-if="getSetting.fullScreen" :isMobile="isMobile" :getPopupContainer="getTableContainer"/>
-    </div>
+  <div class="table-settings">
+    <RedoSetting v-if="getSetting.redo" :isMobile="isMobile" :getPopupContainer="getTableContainer" />
+    <SizeSetting v-if="getSetting.size" :isMobile="isMobile" :getPopupContainer="getTableContainer" />
+    <ColumnSetting v-if="getSetting.setting" :isMobile="isMobile" @columns-change="handleColumnChange" :getPopupContainer="getTableContainer" />
+    <FullScreenSetting v-if="getSetting.fullScreen" :isMobile="isMobile" :getPopupContainer="getTableContainer" />
+  </div>
 </template>
 <script lang="ts">
-    import type {PropType} from 'vue';
-    import type {TableSetting, ColumnChangeParam} from '../../types/table';
-    import {defineComponent, computed, unref} from 'vue';
-    import ColumnSetting from './ColumnSetting.vue';
-    import SizeSetting from './SizeSetting.vue';
-    import RedoSetting from './RedoSetting.vue';
-    import FullScreenSetting from './FullScreenSetting.vue';
-    import {useI18n} from '/@/hooks/web/useI18n';
-    import {useTableContext} from '../../hooks/useTableContext';
+  import type { PropType } from 'vue';
+  import type { TableSetting, ColumnChangeParam } from '../../types/table';
+  import { defineComponent, computed, unref } from 'vue';
+  import ColumnSetting from './ColumnSetting.vue';
+  import SizeSetting from './SizeSetting.vue';
+  import RedoSetting from './RedoSetting.vue';
+  import FullScreenSetting from './FullScreenSetting.vue';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  import { useTableContext } from '../../hooks/useTableContext';
 
-    export default defineComponent({
-        name: 'TableSetting',
-        components: {
-            ColumnSetting,
-            SizeSetting,
-            RedoSetting,
-            FullScreenSetting,
-        },
-        props: {
-            setting: {
-                type: Object as PropType<TableSetting>,
-                default: () => ({}),
-            },
-            mode: String,
-        },
-        emits: ['columns-change'],
-        setup(props, {emit}) {
-            const {t} = useI18n();
-            const table = useTableContext();
+  export default defineComponent({
+    name: 'TableSetting',
+    components: {
+      ColumnSetting,
+      SizeSetting,
+      RedoSetting,
+      FullScreenSetting,
+    },
+    props: {
+      setting: {
+        type: Object as PropType<TableSetting>,
+        default: () => ({}),
+      },
+      mode: String,
+    },
+    emits: ['columns-change'],
+    setup(props, { emit }) {
+      const { t } = useI18n();
+      const table = useTableContext();
 
-            const getSetting = computed((): TableSetting => {
-                return {
-                    redo: true,
-                    size: true,
-                    setting: true,
-                    fullScreen: false,
-                    ...props.setting,
-                };
-            });
-            const isMobile = computed(() => props.mode === 'mobile')
+      const getSetting = computed((): TableSetting => {
+        return {
+          redo: true,
+          size: true,
+          setting: true,
+          fullScreen: false,
+          ...props.setting,
+        };
+      });
+      const isMobile = computed(() => props.mode === 'mobile');
 
-            function handleColumnChange(data: ColumnChangeParam[]) {
-                emit('columns-change', data);
-            }
+      function handleColumnChange(data: ColumnChangeParam[]) {
+        emit('columns-change', data);
+      }
 
-            function getTableContainer() {
-                return table ? unref(table.wrapRef) : document.body;
-            }
+      function getTableContainer() {
+        return table ? unref(table.wrapRef) : document.body;
+      }
 
-            return {getSetting, t, handleColumnChange, getTableContainer, isMobile};
-        },
-    });
+      return { getSetting, t, handleColumnChange, getTableContainer, isMobile };
+    },
+  });
 </script>
 <style lang="less">
-    .table-settings {
-        & > * {
-            margin-right: 12px;
-        }
-
-        svg {
-            width: 1.3em;
-            height: 1.3em;
-        }
+  .table-settings {
+    & > * {
+      margin-right: 12px;
     }
+
+    svg {
+      width: 1.3em;
+      height: 1.3em;
+    }
+  }
 </style>
diff --git a/src/components/Table/src/const.ts b/src/components/Table/src/const.ts
index b04ff0f..9968ec5 100644
--- a/src/components/Table/src/const.ts
+++ b/src/components/Table/src/const.ts
@@ -2,7 +2,7 @@ import componentSetting from '/@/settings/componentSetting';
 
 const { table } = componentSetting;
 
-const { pageSizeOptions, defaultPageSize,  defaultSize, fetchSetting, defaultSortFn, defaultFilterFn } = table;
+const { pageSizeOptions, defaultPageSize, defaultSize, fetchSetting, defaultSortFn, defaultFilterFn } = table;
 
 export const ROW_KEY = 'key';
 
diff --git a/src/components/Table/src/hooks/useColumns.ts b/src/components/Table/src/hooks/useColumns.ts
index 9090306..fe312b3 100644
--- a/src/components/Table/src/hooks/useColumns.ts
+++ b/src/components/Table/src/hooks/useColumns.ts
@@ -37,11 +37,7 @@ function handleChildren(children: BasicColumn[] | undefined, ellipsis: boolean)
   });
 }
 
-function handleIndexColumn(
-    propsRef: ComputedRef<BasicTableProps>,
-    getPaginationRef: ComputedRef<boolean | PaginationProps>,
-    columns: BasicColumn[]
-) {
+function handleIndexColumn(propsRef: ComputedRef<BasicTableProps>, getPaginationRef: ComputedRef<boolean | PaginationProps>, columns: BasicColumn[]) {
   const { t } = useI18n();
 
   const { showIndexColumn, indexColumnProps, isTreeTable } = unref(propsRef);
@@ -77,10 +73,10 @@ function handleIndexColumn(
       return ((current < 1 ? 1 : current) - 1) * pageSize + index + 1;
     },
     ...(isFixedLeft
-        ? {
+      ? {
           fixed: 'left',
         }
-        : {}),
+      : {}),
     ...indexColumnProps,
   });
 }
@@ -99,10 +95,7 @@ function handleActionColumn(propsRef: ComputedRef<BasicTableProps>, columns: Bas
   }
 }
 
-export function useColumns(
-    propsRef: ComputedRef<BasicTableProps>,
-    getPaginationRef: ComputedRef<boolean | PaginationProps>
-) {
+export function useColumns(propsRef: ComputedRef<BasicTableProps>, getPaginationRef: ComputedRef<boolean | PaginationProps>) {
   const columnsRef = ref(unref(propsRef).columns) as unknown as Ref<BasicColumn[]>;
   let cacheColumns = unref(propsRef).columns;
 
@@ -119,10 +112,7 @@ export function useColumns(
     columns.forEach((item) => {
       const { customRender, slots } = item;
 
-      handleItem(
-          item,
-          Reflect.has(item, 'ellipsis') ? !!item.ellipsis : !!ellipsis && !customRender && !slots
-      );
+      handleItem(item, Reflect.has(item, 'ellipsis') ? !!item.ellipsis : !!ellipsis && !customRender && !slots);
     });
     return columns;
   });
@@ -147,44 +137,44 @@ export function useColumns(
 
     const columns = cloneDeep(viewColumns);
     return columns
-        .filter((column) => {
-          return hasPermission(column.auth) && isIfShow(column);
-        })
-        .map((column) => {
-          const { slots, dataIndex, customRender, format, edit, editRow, flag, title:metaTitle } = column;
+      .filter((column) => {
+        return hasPermission(column.auth) && isIfShow(column);
+      })
+      .map((column) => {
+        const { slots, dataIndex, customRender, format, edit, editRow, flag, title: metaTitle } = column;
 
-          if (!slots || !slots?.title) {
-            column.slots = { title: `header-${dataIndex}`, ...(slots || {}) };
-            column.customTitle = column.title;
-            Reflect.deleteProperty(column, 'title');
-          }
-          //update-begin-author:taoyan date:20211203 for:【online报表】分组标题显示错误，都显示成了联系信息 LOWCOD-2343
-          if(column.children){
-            column.title = metaTitle;
-          }
-          //update-end-author:taoyan date:20211203 for:【online报表】分组标题显示错误，都显示成了联系信息 LOWCOD-2343
+        if (!slots || !slots?.title) {
+          column.slots = { title: `header-${dataIndex}`, ...(slots || {}) };
+          column.customTitle = column.title;
+          Reflect.deleteProperty(column, 'title');
+        }
+        //update-begin-author:taoyan date:20211203 for:【online报表】分组标题显示错误，都显示成了联系信息 LOWCOD-2343
+        if (column.children) {
+          column.title = metaTitle;
+        }
+        //update-end-author:taoyan date:20211203 for:【online报表】分组标题显示错误，都显示成了联系信息 LOWCOD-2343
 
-          const isDefaultAction = [INDEX_COLUMN_FLAG, ACTION_COLUMN_FLAG].includes(flag!);
-          if (!customRender && format && !edit && !isDefaultAction) {
-            column.customRender = ({ text, record, index }) => {
-              return formatCell(text, format, record, index);
-            };
-          }
+        const isDefaultAction = [INDEX_COLUMN_FLAG, ACTION_COLUMN_FLAG].includes(flag!);
+        if (!customRender && format && !edit && !isDefaultAction) {
+          column.customRender = ({ text, record, index }) => {
+            return formatCell(text, format, record, index);
+          };
+        }
 
-          // edit table
-          if ((edit || editRow) && !isDefaultAction) {
-            column.customRender = renderEditCell(column);
-          }
-          return column;
-        });
+        // edit table
+        if ((edit || editRow) && !isDefaultAction) {
+          column.customRender = renderEditCell(column);
+        }
+        return column;
+      });
   });
 
   watch(
-      () => unref(propsRef).columns,
-      (columns) => {
-        columnsRef.value = columns;
-        cacheColumns = columns?.filter((item) => !item.flag) ?? [];
-      }
+    () => unref(propsRef).columns,
+    (columns) => {
+      columnsRef.value = columns;
+      cacheColumns = columns?.filter((item) => !item.flag) ?? [];
+    }
   );
 
   function setCacheColumnsByField(dataIndex: string | undefined, value: Partial<BasicColumn>) {
@@ -237,10 +227,7 @@ export function useColumns(
       // Sort according to another array
       if (!isEqual(cacheKeys, columns)) {
         newColumns.sort((prev, next) => {
-          return (
-              cacheKeys.indexOf(prev.dataIndex as string) -
-              cacheKeys.indexOf(next.dataIndex as string)
-          );
+          return cacheKeys.indexOf(prev.dataIndex as string) - cacheKeys.indexOf(next.dataIndex as string);
         });
       }
       columnsRef.value = newColumns;
@@ -292,9 +279,7 @@ function sortFixedColumn(columns: BasicColumn[]) {
     }
     defColumns.push(column);
   }
-  return [...fixedLeftColumns, ...defColumns, ...fixedRightColumns].filter(
-      (item) => !item.defaultHidden
-  );
+  return [...fixedLeftColumns, ...defColumns, ...fixedRightColumns].filter((item) => !item.defaultHidden);
 }
 
 // format cell
diff --git a/src/components/Table/src/hooks/useCustomRow.ts b/src/components/Table/src/hooks/useCustomRow.ts
index f9bc56c..4b32675 100644
--- a/src/components/Table/src/hooks/useCustomRow.ts
+++ b/src/components/Table/src/hooks/useCustomRow.ts
@@ -12,11 +12,7 @@ interface Options {
   getAutoCreateKey: ComputedRef<boolean | undefined>;
 }
 
-function getKey(
-  record: Recordable,
-  rowKey: string | ((record: Record<string, any>) => string) | undefined,
-  autoCreateKey?: boolean
-) {
+function getKey(record: Recordable, rowKey: string | ((record: Record<string, any>) => string) | undefined, autoCreateKey?: boolean) {
   if (!rowKey || autoCreateKey) {
     return record[ROW_KEY];
   }
@@ -29,10 +25,7 @@ function getKey(
   return null;
 }
 
-export function useCustomRow(
-  propsRef: ComputedRef<BasicTableProps>,
-  { setSelectedRowKeys, getSelectRowKeys, getAutoCreateKey, clearSelectedRowKeys, emit }: Options
-) {
+export function useCustomRow(propsRef: ComputedRef<BasicTableProps>, { setSelectedRowKeys, getSelectRowKeys, getAutoCreateKey, clearSelectedRowKeys, emit }: Options) {
   const customRow = (record: Recordable, index: number) => {
     return {
       onClick: (e: Event) => {
@@ -47,9 +40,7 @@ export function useCustomRow(
           const isCheckbox = rowSelection.type === 'checkbox';
           if (isCheckbox) {
             // 找到tr
-            const tr: HTMLElement = (e as MouseEvent)
-              .composedPath?.()
-              .find((dom: HTMLElement) => dom.tagName === 'TR') as HTMLElement;
+            const tr: HTMLElement = (e as MouseEvent).composedPath?.().find((dom: HTMLElement) => dom.tagName === 'TR') as HTMLElement;
             if (!tr) return;
             // 找到Checkbox，检查是否为disabled
             const checkBox = tr.querySelector('input[type=checkbox]');
diff --git a/src/components/Table/src/hooks/useDataSource.ts b/src/components/Table/src/hooks/useDataSource.ts
index 3d3a043..25047b1 100644
--- a/src/components/Table/src/hooks/useDataSource.ts
+++ b/src/components/Table/src/hooks/useDataSource.ts
@@ -1,16 +1,6 @@
 import type { BasicTableProps, FetchParams, SorterResult } from '../types/table';
 import type { PaginationProps } from '../types/pagination';
-import {
-    ref,
-    unref,
-    ComputedRef,
-    computed,
-    onMounted,
-    watch,
-    reactive,
-    Ref,
-    watchEffect,
-} from 'vue';
+import { ref, unref, ComputedRef, computed, onMounted, watch, reactive, Ref, watchEffect } from 'vue';
 import { useTimeoutFn } from '/@/hooks/core/useTimeout';
 import { buildUUID } from '/@/utils/uuid';
 import { isFunction, isBoolean } from '/@/utils/is';
@@ -18,149 +8,131 @@ import { get, cloneDeep } from 'lodash-es';
 import { FETCH_SETTING, ROW_KEY, PAGE_SIZE } from '../const';
 
 interface ActionType {
-    getPaginationInfo: ComputedRef<boolean | PaginationProps>;
-    setPagination: (info: Partial<PaginationProps>) => void;
-    setLoading: (loading: boolean) => void;
-    // update-begin--author:sunjianlei---date:220220419---for：由于 getFieldsValue 返回的不是逗号分割的数据，所以改用 validate
-    validate: () => Recordable;
-    // update-end--author:sunjianlei---date:220220419---for：由于 getFieldsValue 返回的不是逗号分割的数据，所以改用 validate
-    clearSelectedRowKeys: () => void;
-    tableData: Ref<Recordable[]>;
+  getPaginationInfo: ComputedRef<boolean | PaginationProps>;
+  setPagination: (info: Partial<PaginationProps>) => void;
+  setLoading: (loading: boolean) => void;
+  // update-begin--author:sunjianlei---date:220220419---for：由于 getFieldsValue 返回的不是逗号分割的数据，所以改用 validate
+  validate: () => Recordable;
+  // update-end--author:sunjianlei---date:220220419---for：由于 getFieldsValue 返回的不是逗号分割的数据，所以改用 validate
+  clearSelectedRowKeys: () => void;
+  tableData: Ref<Recordable[]>;
 }
 
 interface SearchState {
-    sortInfo: Recordable;
-    filterInfo: Record<string, string[]>;
+  sortInfo: Recordable;
+  filterInfo: Record<string, string[]>;
 }
-export function useDataSource(
-    propsRef: ComputedRef<BasicTableProps>,
+export function useDataSource(propsRef: ComputedRef<BasicTableProps>, { getPaginationInfo, setPagination, setLoading, validate, clearSelectedRowKeys, tableData }: ActionType, emit: EmitType) {
+  const searchState = reactive<SearchState>({
+    sortInfo: {},
+    filterInfo: {},
+  });
+  const dataSourceRef = ref<Recordable[]>([]);
+  const rawDataSourceRef = ref<Recordable>({});
+
+  watchEffect(() => {
+    tableData.value = unref(dataSourceRef);
+  });
+
+  watch(
+    () => unref(propsRef).dataSource,
+    () => {
+      const { dataSource, api } = unref(propsRef);
+      !api && dataSource && (dataSourceRef.value = dataSource);
+    },
     {
-        getPaginationInfo,
-        setPagination,
-        setLoading,
-        validate,
-        clearSelectedRowKeys,
-        tableData,
-    }: ActionType,
-    emit: EmitType
-) {
-    const searchState = reactive<SearchState>({
-        sortInfo: {},
-        filterInfo: {},
-    });
-    const dataSourceRef = ref<Recordable[]>([]);
-    const rawDataSourceRef = ref<Recordable>({});
+      immediate: true,
+    }
+  );
 
-    watchEffect(() => {
-        tableData.value = unref(dataSourceRef);
-    });
+  function handleTableChange(pagination: PaginationProps, filters: Partial<Recordable<string[]>>, sorter: SorterResult) {
+    const { clearSelectOnPageChange, sortFn, filterFn } = unref(propsRef);
+    if (clearSelectOnPageChange) {
+      clearSelectedRowKeys();
+    }
+    setPagination(pagination);
 
-    watch(
-        () => unref(propsRef).dataSource,
-        () => {
-            const { dataSource, api } = unref(propsRef);
-            !api && dataSource && (dataSourceRef.value = dataSource);
-        },
-        {
-            immediate: true,
-        }
-    );
-
-    function handleTableChange(
-        pagination: PaginationProps,
-        filters: Partial<Recordable<string[]>>,
-        sorter: SorterResult
-    ) {
-        const { clearSelectOnPageChange, sortFn, filterFn } = unref(propsRef);
-        if (clearSelectOnPageChange) {
-            clearSelectedRowKeys();
-        }
-        setPagination(pagination);
-
-        const params: Recordable = {};
-        if (sorter && isFunction(sortFn)) {
-            const sortInfo = sortFn(sorter);
-            searchState.sortInfo = sortInfo;
-            params.sortInfo = sortInfo;
-        }
-
-        if (filters && isFunction(filterFn)) {
-            const filterInfo = filterFn(filters);
-            searchState.filterInfo = filterInfo;
-            params.filterInfo = filterInfo;
-        }
-        fetch(params);
+    const params: Recordable = {};
+    if (sorter && isFunction(sortFn)) {
+      const sortInfo = sortFn(sorter);
+      searchState.sortInfo = sortInfo;
+      params.sortInfo = sortInfo;
     }
 
-    function setTableKey(items: any[]) {
-        if (!items || !Array.isArray(items)) return;
-        items.forEach((item) => {
+    if (filters && isFunction(filterFn)) {
+      const filterInfo = filterFn(filters);
+      searchState.filterInfo = filterInfo;
+      params.filterInfo = filterInfo;
+    }
+    fetch(params);
+  }
+
+  function setTableKey(items: any[]) {
+    if (!items || !Array.isArray(items)) return;
+    items.forEach((item) => {
+      if (!item[ROW_KEY]) {
+        item[ROW_KEY] = buildUUID();
+      }
+      if (item.children && item.children.length) {
+        setTableKey(item.children);
+      }
+    });
+  }
+
+  const getAutoCreateKey = computed(() => {
+    return unref(propsRef).autoCreateKey && !unref(propsRef).rowKey;
+  });
+
+  const getRowKey = computed(() => {
+    const { rowKey } = unref(propsRef);
+    return unref(getAutoCreateKey) ? ROW_KEY : rowKey;
+  });
+
+  const getDataSourceRef = computed(() => {
+    const dataSource = unref(dataSourceRef);
+    if (!dataSource || dataSource.length === 0) {
+      return unref(dataSourceRef);
+    }
+    if (unref(getAutoCreateKey)) {
+      const firstItem = dataSource[0];
+      const lastItem = dataSource[dataSource.length - 1];
+
+      if (firstItem && lastItem) {
+        if (!firstItem[ROW_KEY] || !lastItem[ROW_KEY]) {
+          const data = cloneDeep(unref(dataSourceRef));
+          data.forEach((item) => {
             if (!item[ROW_KEY]) {
-                item[ROW_KEY] = buildUUID();
+              item[ROW_KEY] = buildUUID();
             }
             if (item.children && item.children.length) {
-                setTableKey(item.children);
+              setTableKey(item.children);
             }
-        });
+          });
+          dataSourceRef.value = data;
+        }
+      }
     }
+    return unref(dataSourceRef);
+  });
 
-    const getAutoCreateKey = computed(() => {
-        return unref(propsRef).autoCreateKey && !unref(propsRef).rowKey;
-    });
-
-    const getRowKey = computed(() => {
-        const { rowKey } = unref(propsRef);
-        return unref(getAutoCreateKey) ? ROW_KEY : rowKey;
-    });
-
-    const getDataSourceRef = computed(() => {
-        const dataSource = unref(dataSourceRef);
-        if (!dataSource || dataSource.length === 0) {
-            return unref(dataSourceRef);
-        }
-        if (unref(getAutoCreateKey)) {
-            const firstItem = dataSource[0];
-            const lastItem = dataSource[dataSource.length - 1];
-
-            if (firstItem && lastItem) {
-                if (!firstItem[ROW_KEY] || !lastItem[ROW_KEY]) {
-                    const data = cloneDeep(unref(dataSourceRef));
-                    data.forEach((item) => {
-                        if (!item[ROW_KEY]) {
-                            item[ROW_KEY] = buildUUID();
-                        }
-                        if (item.children && item.children.length) {
-                            setTableKey(item.children);
-                        }
-                    });
-                    dataSourceRef.value = data;
-                }
-            }
-        }
-        return unref(dataSourceRef);
-    });
-
-    async function updateTableData(index: number, key: string, value: any) {
-        const record = dataSourceRef.value[index];
-        if (record) {
-            dataSourceRef.value[index][key] = value;
-        }
-        return dataSourceRef.value[index];
+  async function updateTableData(index: number, key: string, value: any) {
+    const record = dataSourceRef.value[index];
+    if (record) {
+      dataSourceRef.value[index][key] = value;
     }
+    return dataSourceRef.value[index];
+  }
 
-    function updateTableDataRecord(
-        rowKey: string | number,
-        record: Recordable
-    ): Recordable | undefined {
-        const row = findTableDataRecord(rowKey);
+  function updateTableDataRecord(rowKey: string | number, record: Recordable): Recordable | undefined {
+    const row = findTableDataRecord(rowKey);
 
-        if (row) {
-            for (const field in row) {
-                if (Reflect.has(record, field)) row[field] = record[field];
-            }
-            return row;
-        }
+    if (row) {
+      for (const field in row) {
+        if (Reflect.has(record, field)) row[field] = record[field];
+      }
+      return row;
     }
+  }
   function deleteTableDataRecord(rowKey: string | number | string[] | number[]) {
     if (!dataSourceRef.value || dataSourceRef.value.length == 0) return;
     const rowKeyName = unref(getRowKey);
@@ -188,181 +160,175 @@ export function useDataSource(
         }
         return row[targetKeyName] === key;
       });
-      if (typeof index !== 'undefined' && index !== -1)
-        unref(propsRef).dataSource?.splice(index, 1);
+      if (typeof index !== 'undefined' && index !== -1) unref(propsRef).dataSource?.splice(index, 1);
     }
     setPagination({
       total: unref(propsRef).dataSource?.length,
     });
   }
 
-    function insertTableDataRecord(record: Recordable, index: number): Recordable | undefined {
-      if (!dataSourceRef.value || dataSourceRef.value.length == 0) return;
-      index = index ?? dataSourceRef.value?.length;
-      unref(dataSourceRef).splice(index, 0, record);
-      unref(propsRef).dataSource?.splice(index, 0, record);
-      return unref(propsRef).dataSource;
-    }
-    function findTableDataRecord(rowKey: string | number) {
-        if (!dataSourceRef.value || dataSourceRef.value.length == 0) return;
+  function insertTableDataRecord(record: Recordable, index: number): Recordable | undefined {
+    if (!dataSourceRef.value || dataSourceRef.value.length == 0) return;
+    index = index ?? dataSourceRef.value?.length;
+    unref(dataSourceRef).splice(index, 0, record);
+    unref(propsRef).dataSource?.splice(index, 0, record);
+    return unref(propsRef).dataSource;
+  }
+  function findTableDataRecord(rowKey: string | number) {
+    if (!dataSourceRef.value || dataSourceRef.value.length == 0) return;
 
-        const rowKeyName = unref(getRowKey);
-        if (!rowKeyName) return;
+    const rowKeyName = unref(getRowKey);
+    if (!rowKeyName) return;
 
-        const { childrenColumnName = 'children' } = unref(propsRef);
+    const { childrenColumnName = 'children' } = unref(propsRef);
 
-        const findRow = (array: any[]) => {
-            let ret;
-            array.some(function iter(r) {
-                if (typeof rowKeyName === 'function') {
-                    if ((rowKeyName(r) as string) === rowKey) {
-                        ret = r;
-                        return true;
-                    }
-                } else {
-                    if (Reflect.has(r, rowKeyName) && r[rowKeyName] === rowKey) {
-                        ret = r;
-                        return true;
-                    }
-                }
-                return r[childrenColumnName] && r[childrenColumnName].some(iter);
-            });
-            return ret;
-        };
-
-        // const row = dataSourceRef.value.find(r => {
-        //   if (typeof rowKeyName === 'function') {
-        //     return (rowKeyName(r) as string) === rowKey
-        //   } else {
-        //     return Reflect.has(r, rowKeyName) && r[rowKeyName] === rowKey
-        //   }
-        // })
-        return findRow(dataSourceRef.value);
-    }
-
-    async function fetch(opt?: FetchParams) {
-        const { api, searchInfo, defSort, fetchSetting, beforeFetch, afterFetch, useSearchForm, pagination } =
-            unref(propsRef);
-        if (!api || !isFunction(api)) return;
-        try {
-            setLoading(true);
-            const { pageField, sizeField, listField, totalField } = Object.assign(
-                {},
-                FETCH_SETTING,
-                fetchSetting
-            );
-            let pageParams: Recordable = {};
-
-            const { current = 1, pageSize = PAGE_SIZE } = unref(getPaginationInfo) as PaginationProps;
-
-            if ((isBoolean(pagination) && !pagination) || isBoolean(getPaginationInfo)) {
-                pageParams = {};
-            } else {
-                pageParams[pageField] = (opt && opt.page) || current;
-                pageParams[sizeField] = pageSize;
-            }
-
-            const { sortInfo = {}, filterInfo } = searchState;
-
-            let params: Recordable = {
-                ...pageParams,
-                // 由于 getFieldsValue 返回的不是逗号分割的数据，所以改用 validate
-                ...(useSearchForm ? (await validate()) : {}),
-                ...searchInfo,
-                ...defSort,
-                ...(opt?.searchInfo ?? {}),
-                ...sortInfo,
-                ...filterInfo,
-                ...(opt?.sortInfo ?? {}),
-                ...(opt?.filterInfo ?? {}),
-            };
-            if (beforeFetch && isFunction(beforeFetch)) {
-                params = (await beforeFetch(params)) || params;
-            }
-
-            const res = await api(params);
-            rawDataSourceRef.value = res;
-
-            const isArrayResult = Array.isArray(res);
-
-            let resultItems: Recordable[] = isArrayResult ? res : get(res, listField);
-            const resultTotal: number = isArrayResult ? 0 : get(res, totalField);
-
-            // 假如数据变少，导致总页数变少并小于当前选中页码，通过getPaginationRef获取到的页码是不正确的，需获取正确的页码再次执行
-            if (resultTotal) {
-                const currentTotalPage = Math.ceil(Number(resultTotal) / pageSize);
-                if (current > currentTotalPage) {
-                    setPagination({
-                        current: currentTotalPage,
-                    });
-                    return await fetch(opt);
-                }
-            }
-
-            if (afterFetch && isFunction(afterFetch)) {
-                resultItems = (await afterFetch(resultItems)) || resultItems;
-            }
-            dataSourceRef.value = resultItems;
-            setPagination({
-                total: Number(resultTotal) || 0,
-            });
-            if (opt && opt.page) {
-                setPagination({
-                    current: opt.page || 1,
-                });
-            }
-            emit('fetch-success', {
-                items: unref(resultItems),
-                total: Number(resultTotal),
-            });
-            return resultItems;
-        } catch (error) {
-            emit('fetch-error', error);
-            dataSourceRef.value = [];
-            setPagination({
-                total: 0,
-            });
-        } finally {
-            setLoading(false);
+    const findRow = (array: any[]) => {
+      let ret;
+      array.some(function iter(r) {
+        if (typeof rowKeyName === 'function') {
+          if ((rowKeyName(r) as string) === rowKey) {
+            ret = r;
+            return true;
+          }
+        } else {
+          if (Reflect.has(r, rowKeyName) && r[rowKeyName] === rowKey) {
+            ret = r;
+            return true;
+          }
         }
-    }
-
-    function setTableData<T = Recordable>(values: T[]) {
-        dataSourceRef.value = values;
-    }
-
-    function getDataSource<T = Recordable>() {
-        return getDataSourceRef.value as T[];
-    }
-
-    function getRawDataSource<T = Recordable>() {
-        return rawDataSourceRef.value as T;
-    }
-
-    async function reload(opt?: FetchParams) {
-       return await fetch(opt);
-    }
-
-    onMounted(() => {
-        useTimeoutFn(() => {
-            unref(propsRef).immediate && fetch();
-        }, 16);
-    });
-
-    return {
-        getDataSourceRef,
-        getDataSource,
-        getRawDataSource,
-        getRowKey,
-        setTableData,
-        getAutoCreateKey,
-        fetch,
-        reload,
-        updateTableData,
-        updateTableDataRecord,
-        deleteTableDataRecord,
-        insertTableDataRecord,
-        findTableDataRecord,
-        handleTableChange,
+        return r[childrenColumnName] && r[childrenColumnName].some(iter);
+      });
+      return ret;
     };
+
+    // const row = dataSourceRef.value.find(r => {
+    //   if (typeof rowKeyName === 'function') {
+    //     return (rowKeyName(r) as string) === rowKey
+    //   } else {
+    //     return Reflect.has(r, rowKeyName) && r[rowKeyName] === rowKey
+    //   }
+    // })
+    return findRow(dataSourceRef.value);
+  }
+
+  async function fetch(opt?: FetchParams) {
+    const { api, searchInfo, defSort, fetchSetting, beforeFetch, afterFetch, useSearchForm, pagination } = unref(propsRef);
+    if (!api || !isFunction(api)) return;
+    try {
+      setLoading(true);
+      const { pageField, sizeField, listField, totalField } = Object.assign({}, FETCH_SETTING, fetchSetting);
+      let pageParams: Recordable = {};
+
+      const { current = 1, pageSize = PAGE_SIZE } = unref(getPaginationInfo) as PaginationProps;
+
+      if ((isBoolean(pagination) && !pagination) || isBoolean(getPaginationInfo)) {
+        pageParams = {};
+      } else {
+        pageParams[pageField] = (opt && opt.page) || current;
+        pageParams[sizeField] = pageSize;
+      }
+
+      const { sortInfo = {}, filterInfo } = searchState;
+
+      let params: Recordable = {
+        ...pageParams,
+        // 由于 getFieldsValue 返回的不是逗号分割的数据，所以改用 validate
+        ...(useSearchForm ? await validate() : {}),
+        ...searchInfo,
+        ...defSort,
+        ...(opt?.searchInfo ?? {}),
+        ...sortInfo,
+        ...filterInfo,
+        ...(opt?.sortInfo ?? {}),
+        ...(opt?.filterInfo ?? {}),
+      };
+      if (beforeFetch && isFunction(beforeFetch)) {
+        params = (await beforeFetch(params)) || params;
+      }
+
+      const res = await api(params);
+      rawDataSourceRef.value = res;
+
+      const isArrayResult = Array.isArray(res);
+
+      let resultItems: Recordable[] = isArrayResult ? res : get(res, listField);
+      const resultTotal: number = isArrayResult ? 0 : get(res, totalField);
+
+      // 假如数据变少，导致总页数变少并小于当前选中页码，通过getPaginationRef获取到的页码是不正确的，需获取正确的页码再次执行
+      if (resultTotal) {
+        const currentTotalPage = Math.ceil(Number(resultTotal) / pageSize);
+        if (current > currentTotalPage) {
+          setPagination({
+            current: currentTotalPage,
+          });
+          return await fetch(opt);
+        }
+      }
+
+      if (afterFetch && isFunction(afterFetch)) {
+        resultItems = (await afterFetch(resultItems)) || resultItems;
+      }
+      dataSourceRef.value = resultItems;
+      setPagination({
+        total: Number(resultTotal) || 0,
+      });
+      if (opt && opt.page) {
+        setPagination({
+          current: opt.page || 1,
+        });
+      }
+      emit('fetch-success', {
+        items: unref(resultItems),
+        total: Number(resultTotal),
+      });
+      return resultItems;
+    } catch (error) {
+      emit('fetch-error', error);
+      dataSourceRef.value = [];
+      setPagination({
+        total: 0,
+      });
+    } finally {
+      setLoading(false);
+    }
+  }
+
+  function setTableData<T = Recordable>(values: T[]) {
+    dataSourceRef.value = values;
+  }
+
+  function getDataSource<T = Recordable>() {
+    return getDataSourceRef.value as T[];
+  }
+
+  function getRawDataSource<T = Recordable>() {
+    return rawDataSourceRef.value as T;
+  }
+
+  async function reload(opt?: FetchParams) {
+    return await fetch(opt);
+  }
+
+  onMounted(() => {
+    useTimeoutFn(() => {
+      unref(propsRef).immediate && fetch();
+    }, 16);
+  });
+
+  return {
+    getDataSourceRef,
+    getDataSource,
+    getRawDataSource,
+    getRowKey,
+    setTableData,
+    getAutoCreateKey,
+    fetch,
+    reload,
+    updateTableData,
+    updateTableDataRecord,
+    deleteTableDataRecord,
+    insertTableDataRecord,
+    findTableDataRecord,
+    handleTableChange,
+  };
 }
diff --git a/src/components/Table/src/hooks/usePagination.tsx b/src/components/Table/src/hooks/usePagination.tsx
index ba310bd..d90eb29 100644
--- a/src/components/Table/src/hooks/usePagination.tsx
+++ b/src/components/Table/src/hooks/usePagination.tsx
@@ -36,7 +36,7 @@ export function usePagination(refProps: ComputedRef<BasicTableProps>) {
           ...(pagination ?? {}),
         };
       }
-    },
+    }
   );
 
   const getPaginationInfo = computed((): PaginationProps | boolean => {
diff --git a/src/components/Table/src/hooks/useRowSelection.ts b/src/components/Table/src/hooks/useRowSelection.ts
index 7384f19..b786fb1 100644
--- a/src/components/Table/src/hooks/useRowSelection.ts
+++ b/src/components/Table/src/hooks/useRowSelection.ts
@@ -5,121 +5,113 @@ import { ROW_KEY } from '../const';
 import { omit } from 'lodash-es';
 import { findNodeAll } from '/@/utils/helper/treeHelper';
 
-export function useRowSelection(
-    propsRef: ComputedRef<BasicTableProps>,
-    tableData: Ref<Recordable[]>,
-    emit: EmitType
-) {
-    const selectedRowKeysRef = ref<string[]>([]);
-    const selectedRowRef = ref<Recordable[]>([]);
+export function useRowSelection(propsRef: ComputedRef<BasicTableProps>, tableData: Ref<Recordable[]>, emit: EmitType) {
+  const selectedRowKeysRef = ref<string[]>([]);
+  const selectedRowRef = ref<Recordable[]>([]);
 
-    const getRowSelectionRef = computed((): TableRowSelection | null => {
-        const { rowSelection } = unref(propsRef);
-        if (!rowSelection) {
-            return null;
-        }
-
-        return {
-            selectedRowKeys: unref(selectedRowKeysRef),
-            hideDefaultSelections: false,
-            onChange: (selectedRowKeys: string[]) => {
-                setSelectedRowKeys(selectedRowKeys);
-                // selectedRowKeysRef.value = selectedRowKeys;
-                // selectedRowRef.value = selectedRows;
-            },
-            ...omit(rowSelection, ['onChange']),
-        };
-    });
-
-    watch(
-        () => unref(propsRef).rowSelection?.selectedRowKeys,
-        (v: string[]) => {
-            setSelectedRowKeys(v);
-        }
-    );
-
-    watch(
-        () => unref(selectedRowKeysRef),
-        () => {
-            nextTick(() => {
-                const { rowSelection } = unref(propsRef);
-                if (rowSelection) {
-                    const { onChange } = rowSelection;
-                    if (onChange && isFunction(onChange)) onChange(getSelectRowKeys(), getSelectRows());
-                }
-                emit('selection-change', {
-                    keys: getSelectRowKeys(),
-                    rows: getSelectRows(),
-                });
-            });
-        },
-        { deep: true }
-    );
-
-    const getAutoCreateKey = computed(() => {
-        return unref(propsRef).autoCreateKey && !unref(propsRef).rowKey;
-    });
-
-    const getRowKey = computed(() => {
-        const { rowKey } = unref(propsRef);
-        return unref(getAutoCreateKey) ? ROW_KEY : rowKey;
-    });
-
-    function setSelectedRowKeys(rowKeys: string[]) {
-        selectedRowKeysRef.value = rowKeys;
-        const allSelectedRows = findNodeAll(
-            toRaw(unref(tableData)).concat(toRaw(unref(selectedRowRef))),
-            (item) => rowKeys.includes(item[unref(getRowKey) as string]),
-            {
-                children: propsRef.value.childrenColumnName ?? 'children',
-            }
-        );
-        const trueSelectedRows: any[] = [];
-        rowKeys.forEach((key: string) => {
-            const found = allSelectedRows.find((item) => item[unref(getRowKey) as string] === key);
-            found && trueSelectedRows.push(found);
-        });
-        selectedRowRef.value = trueSelectedRows;
-    }
-
-    function setSelectedRows(rows: Recordable[]) {
-        selectedRowRef.value = rows;
-    }
-
-    function clearSelectedRowKeys() {
-        selectedRowRef.value = [];
-        selectedRowKeysRef.value = [];
-    }
-
-    function deleteSelectRowByKey(key: string) {
-        const selectedRowKeys = unref(selectedRowKeysRef);
-        const index = selectedRowKeys.findIndex((item) => item === key);
-        if (index !== -1) {
-            unref(selectedRowKeysRef).splice(index, 1);
-        }
-    }
-
-    function getSelectRowKeys() {
-        return unref(selectedRowKeysRef);
-    }
-
-    function getSelectRows<T = Recordable>() {
-        // const ret = toRaw(unref(selectedRowRef)).map((item) => toRaw(item));
-        return unref(selectedRowRef) as T[];
-    }
-
-    function getRowSelection() {
-        return unref(getRowSelectionRef)!;
+  const getRowSelectionRef = computed((): TableRowSelection | null => {
+    const { rowSelection } = unref(propsRef);
+    if (!rowSelection) {
+      return null;
     }
 
     return {
-        getRowSelection,
-        getRowSelectionRef,
-        getSelectRows,
-        getSelectRowKeys,
-        setSelectedRowKeys,
-        clearSelectedRowKeys,
-        deleteSelectRowByKey,
-        setSelectedRows,
+      selectedRowKeys: unref(selectedRowKeysRef),
+      hideDefaultSelections: false,
+      onChange: (selectedRowKeys: string[]) => {
+        setSelectedRowKeys(selectedRowKeys);
+        // selectedRowKeysRef.value = selectedRowKeys;
+        // selectedRowRef.value = selectedRows;
+      },
+      ...omit(rowSelection, ['onChange']),
     };
+  });
+
+  watch(
+    () => unref(propsRef).rowSelection?.selectedRowKeys,
+    (v: string[]) => {
+      setSelectedRowKeys(v);
+    }
+  );
+
+  watch(
+    () => unref(selectedRowKeysRef),
+    () => {
+      nextTick(() => {
+        const { rowSelection } = unref(propsRef);
+        if (rowSelection) {
+          const { onChange } = rowSelection;
+          if (onChange && isFunction(onChange)) onChange(getSelectRowKeys(), getSelectRows());
+        }
+        emit('selection-change', {
+          keys: getSelectRowKeys(),
+          rows: getSelectRows(),
+        });
+      });
+    },
+    { deep: true }
+  );
+
+  const getAutoCreateKey = computed(() => {
+    return unref(propsRef).autoCreateKey && !unref(propsRef).rowKey;
+  });
+
+  const getRowKey = computed(() => {
+    const { rowKey } = unref(propsRef);
+    return unref(getAutoCreateKey) ? ROW_KEY : rowKey;
+  });
+
+  function setSelectedRowKeys(rowKeys: string[]) {
+    selectedRowKeysRef.value = rowKeys;
+    const allSelectedRows = findNodeAll(toRaw(unref(tableData)).concat(toRaw(unref(selectedRowRef))), (item) => rowKeys.includes(item[unref(getRowKey) as string]), {
+      children: propsRef.value.childrenColumnName ?? 'children',
+    });
+    const trueSelectedRows: any[] = [];
+    rowKeys.forEach((key: string) => {
+      const found = allSelectedRows.find((item) => item[unref(getRowKey) as string] === key);
+      found && trueSelectedRows.push(found);
+    });
+    selectedRowRef.value = trueSelectedRows;
+  }
+
+  function setSelectedRows(rows: Recordable[]) {
+    selectedRowRef.value = rows;
+  }
+
+  function clearSelectedRowKeys() {
+    selectedRowRef.value = [];
+    selectedRowKeysRef.value = [];
+  }
+
+  function deleteSelectRowByKey(key: string) {
+    const selectedRowKeys = unref(selectedRowKeysRef);
+    const index = selectedRowKeys.findIndex((item) => item === key);
+    if (index !== -1) {
+      unref(selectedRowKeysRef).splice(index, 1);
+    }
+  }
+
+  function getSelectRowKeys() {
+    return unref(selectedRowKeysRef);
+  }
+
+  function getSelectRows<T = Recordable>() {
+    // const ret = toRaw(unref(selectedRowRef)).map((item) => toRaw(item));
+    return unref(selectedRowRef) as T[];
+  }
+
+  function getRowSelection() {
+    return unref(getRowSelectionRef)!;
+  }
+
+  return {
+    getRowSelection,
+    getRowSelectionRef,
+    getSelectRows,
+    getSelectRowKeys,
+    setSelectedRowKeys,
+    clearSelectedRowKeys,
+    deleteSelectRowByKey,
+    setSelectedRows,
+  };
 }
diff --git a/src/components/Table/src/hooks/useTable.ts b/src/components/Table/src/hooks/useTable.ts
index 5c5a1a7..7217538 100644
--- a/src/components/Table/src/hooks/useTable.ts
+++ b/src/components/Table/src/hooks/useTable.ts
@@ -1,161 +1,159 @@
-import type {BasicTableProps, TableActionType, FetchParams, BasicColumn} from '../types/table';
-import type {PaginationProps} from '../types/pagination';
-import type {DynamicProps} from '/#/utils';
-import type {FormActionType} from '/@/components/Form';
-import type {WatchStopHandle} from 'vue';
-import {getDynamicProps} from '/@/utils';
-import {ref, onUnmounted, unref, watch, toRaw} from 'vue';
-import {isProdMode} from '/@/utils/env';
-import {error} from '/@/utils/log';
+import type { BasicTableProps, TableActionType, FetchParams, BasicColumn } from '../types/table';
+import type { PaginationProps } from '../types/pagination';
+import type { DynamicProps } from '/#/utils';
+import type { FormActionType } from '/@/components/Form';
+import type { WatchStopHandle } from 'vue';
+import { getDynamicProps } from '/@/utils';
+import { ref, onUnmounted, unref, watch, toRaw } from 'vue';
+import { isProdMode } from '/@/utils/env';
+import { error } from '/@/utils/log';
 
 type Props = Partial<DynamicProps<BasicTableProps>>;
 
 type UseTableMethod = TableActionType & {
-    getForm: () => FormActionType;
+  getForm: () => FormActionType;
 };
 
 export function useTable(tableProps?: Props): [
-    (instance: TableActionType, formInstance: UseTableMethod) => void,
-    TableActionType & {
+  (instance: TableActionType, formInstance: UseTableMethod) => void,
+  TableActionType & {
     getForm: () => FormActionType;
-}
+  }
 ] {
-    const tableRef = ref<Nullable<TableActionType>>(null);
-    const loadedRef = ref<Nullable<boolean>>(false);
-    const formRef = ref<Nullable<UseTableMethod>>(null);
+  const tableRef = ref<Nullable<TableActionType>>(null);
+  const loadedRef = ref<Nullable<boolean>>(false);
+  const formRef = ref<Nullable<UseTableMethod>>(null);
 
-    let stopWatch: WatchStopHandle;
+  let stopWatch: WatchStopHandle;
 
-    function register(instance: TableActionType, formInstance: UseTableMethod) {
-        isProdMode() &&
-        onUnmounted(() => {
-            tableRef.value = null;
-            loadedRef.value = null;
-        });
+  function register(instance: TableActionType, formInstance: UseTableMethod) {
+    isProdMode() &&
+      onUnmounted(() => {
+        tableRef.value = null;
+        loadedRef.value = null;
+      });
 
-        if (unref(loadedRef) && isProdMode() && instance === unref(tableRef)) return;
+    if (unref(loadedRef) && isProdMode() && instance === unref(tableRef)) return;
 
-        tableRef.value = instance;
-        formRef.value = formInstance;
+    tableRef.value = instance;
+    formRef.value = formInstance;
+    tableProps && instance.setProps(getDynamicProps(tableProps));
+    loadedRef.value = true;
+
+    stopWatch?.();
+
+    stopWatch = watch(
+      () => tableProps,
+      () => {
         tableProps && instance.setProps(getDynamicProps(tableProps));
-        loadedRef.value = true;
+      },
+      {
+        immediate: true,
+        deep: true,
+      }
+    );
+  }
 
-        stopWatch?.();
-
-        stopWatch = watch(
-            () => tableProps,
-            () => {
-                tableProps && instance.setProps(getDynamicProps(tableProps));
-            },
-            {
-                immediate: true,
-                deep: true,
-            }
-        );
+  function getTableInstance(): TableActionType {
+    const table = unref(tableRef);
+    if (!table) {
+      error('The table instance has not been obtained yet, please make sure the table is presented when performing the table operation!');
     }
+    return table as TableActionType;
+  }
 
-    function getTableInstance(): TableActionType {
-        const table = unref(tableRef);
-        if (!table) {
-            error(
-                'The table instance has not been obtained yet, please make sure the table is presented when performing the table operation!'
-            );
-        }
-        return table as TableActionType;
-    }
+  const methods: TableActionType & {
+    getForm: () => FormActionType;
+  } = {
+    reload: async (opt?: FetchParams) => {
+      return await getTableInstance().reload(opt);
+    },
+    setProps: (props: Partial<BasicTableProps>) => {
+      getTableInstance().setProps(props);
+    },
+    redoHeight: () => {
+      getTableInstance().redoHeight();
+    },
+    setLoading: (loading: boolean) => {
+      getTableInstance().setLoading(loading);
+    },
+    getDataSource: () => {
+      return getTableInstance().getDataSource();
+    },
+    getRawDataSource: () => {
+      return getTableInstance().getRawDataSource();
+    },
+    getColumns: ({ ignoreIndex = false }: { ignoreIndex?: boolean } = {}) => {
+      const columns = getTableInstance().getColumns({ ignoreIndex }) || [];
+      return toRaw(columns);
+    },
+    setColumns: (columns: BasicColumn[]) => {
+      getTableInstance().setColumns(columns);
+    },
+    setTableData: (values: any[]) => {
+      return getTableInstance().setTableData(values);
+    },
+    setPagination: (info: Partial<PaginationProps>) => {
+      return getTableInstance().setPagination(info);
+    },
+    deleteSelectRowByKey: (key: string) => {
+      getTableInstance().deleteSelectRowByKey(key);
+    },
+    getSelectRowKeys: () => {
+      return toRaw(getTableInstance().getSelectRowKeys());
+    },
+    getSelectRows: () => {
+      return toRaw(getTableInstance().getSelectRows());
+    },
+    clearSelectedRowKeys: () => {
+      getTableInstance().clearSelectedRowKeys();
+    },
+    setSelectedRowKeys: (keys: string[] | number[]) => {
+      getTableInstance().setSelectedRowKeys(keys);
+    },
+    getPaginationRef: () => {
+      return getTableInstance().getPaginationRef();
+    },
+    getSize: () => {
+      return toRaw(getTableInstance().getSize());
+    },
+    updateTableData: (index: number, key: string, value: any) => {
+      return getTableInstance().updateTableData(index, key, value);
+    },
+    deleteTableDataRecord: (rowKey: string | number | string[] | number[]) => {
+      return getTableInstance().deleteTableDataRecord(rowKey);
+    },
+    insertTableDataRecord: (record: Recordable | Recordable[], index?: number) => {
+      return getTableInstance().insertTableDataRecord(record, index);
+    },
+    updateTableDataRecord: (rowKey: string | number, record: Recordable) => {
+      return getTableInstance().updateTableDataRecord(rowKey, record);
+    },
+    findTableDataRecord: (rowKey: string | number) => {
+      return getTableInstance().findTableDataRecord(rowKey);
+    },
+    getRowSelection: () => {
+      return toRaw(getTableInstance().getRowSelection());
+    },
+    getCacheColumns: () => {
+      return toRaw(getTableInstance().getCacheColumns());
+    },
+    getForm: () => {
+      return unref(formRef) as unknown as FormActionType;
+    },
+    setShowPagination: async (show: boolean) => {
+      getTableInstance().setShowPagination(show);
+    },
+    getShowPagination: () => {
+      return toRaw(getTableInstance().getShowPagination());
+    },
+    expandAll: () => {
+      getTableInstance().expandAll();
+    },
+    collapseAll: () => {
+      getTableInstance().collapseAll();
+    },
+  };
 
-    const methods: TableActionType & {
-        getForm: () => FormActionType;
-    } = {
-        reload: async (opt?: FetchParams) => {
-           return await getTableInstance().reload(opt);
-        },
-        setProps: (props: Partial<BasicTableProps>) => {
-            getTableInstance().setProps(props);
-        },
-        redoHeight: () => {
-            getTableInstance().redoHeight();
-        },
-        setLoading: (loading: boolean) => {
-            getTableInstance().setLoading(loading);
-        },
-        getDataSource: () => {
-            return getTableInstance().getDataSource();
-        },
-        getRawDataSource: () => {
-            return getTableInstance().getRawDataSource();
-        },
-        getColumns: ({ignoreIndex = false}: { ignoreIndex?: boolean } = {}) => {
-            const columns = getTableInstance().getColumns({ignoreIndex}) || [];
-            return toRaw(columns);
-        },
-        setColumns: (columns: BasicColumn[]) => {
-            getTableInstance().setColumns(columns);
-        },
-        setTableData: (values: any[]) => {
-            return getTableInstance().setTableData(values);
-        },
-        setPagination: (info: Partial<PaginationProps>) => {
-            return getTableInstance().setPagination(info);
-        },
-        deleteSelectRowByKey: (key: string) => {
-            getTableInstance().deleteSelectRowByKey(key);
-        },
-        getSelectRowKeys: () => {
-            return toRaw(getTableInstance().getSelectRowKeys());
-        },
-        getSelectRows: () => {
-            return toRaw(getTableInstance().getSelectRows());
-        },
-        clearSelectedRowKeys: () => {
-            getTableInstance().clearSelectedRowKeys();
-        },
-        setSelectedRowKeys: (keys: string[] | number[]) => {
-            getTableInstance().setSelectedRowKeys(keys);
-        },
-        getPaginationRef: () => {
-            return getTableInstance().getPaginationRef();
-        },
-        getSize: () => {
-            return toRaw(getTableInstance().getSize());
-        },
-        updateTableData: (index: number, key: string, value: any) => {
-            return getTableInstance().updateTableData(index, key, value);
-        },
-        deleteTableDataRecord: (rowKey: string | number | string[] | number[]) => {
-          return getTableInstance().deleteTableDataRecord(rowKey);
-        },
-        insertTableDataRecord: (record: Recordable | Recordable[], index?: number) => {
-          return getTableInstance().insertTableDataRecord(record, index);
-        },
-        updateTableDataRecord: (rowKey: string | number, record: Recordable) => {
-            return getTableInstance().updateTableDataRecord(rowKey, record);
-        },
-        findTableDataRecord: (rowKey: string | number) => {
-            return getTableInstance().findTableDataRecord(rowKey);
-        },
-        getRowSelection: () => {
-            return toRaw(getTableInstance().getRowSelection());
-        },
-        getCacheColumns: () => {
-            return toRaw(getTableInstance().getCacheColumns());
-        },
-        getForm: () => {
-            return unref(formRef) as unknown as FormActionType;
-        },
-        setShowPagination: async (show: boolean) => {
-            getTableInstance().setShowPagination(show);
-        },
-        getShowPagination: () => {
-            return toRaw(getTableInstance().getShowPagination());
-        },
-        expandAll: () => {
-            getTableInstance().expandAll();
-        },
-        collapseAll: () => {
-            getTableInstance().collapseAll();
-        },
-    };
-
-    return [register, methods];
+  return [register, methods];
 }
diff --git a/src/components/Table/src/hooks/useTableExpand.ts b/src/components/Table/src/hooks/useTableExpand.ts
index c4bedfd..8008690 100644
--- a/src/components/Table/src/hooks/useTableExpand.ts
+++ b/src/components/Table/src/hooks/useTableExpand.ts
@@ -3,11 +3,7 @@ import type { BasicTableProps } from '../types/table';
 import { computed, unref, ref, toRaw } from 'vue';
 import { ROW_KEY } from '../const';
 
-export function useTableExpand(
-  propsRef: ComputedRef<BasicTableProps>,
-  tableData: Ref<Recordable[]>,
-  emit: EmitType
-) {
+export function useTableExpand(propsRef: ComputedRef<BasicTableProps>, tableData: Ref<Recordable[]>, emit: EmitType) {
   const expandedRowKeys = ref<string[]>([]);
 
   const getAutoCreateKey = computed(() => {
diff --git a/src/components/Table/src/hooks/useTableFooter.ts b/src/components/Table/src/hooks/useTableFooter.ts
index fa46e36..bc5de76 100644
--- a/src/components/Table/src/hooks/useTableFooter.ts
+++ b/src/components/Table/src/hooks/useTableFooter.ts
@@ -20,9 +20,7 @@ export function useTableFooter(
 
   const getFooterProps = computed((): Recordable | undefined => {
     const { summaryFunc, showSummary, summaryData } = unref(propsRef);
-    return showSummary && !unref(getIsEmptyData)
-      ? () => h(TableFooter, { summaryFunc, summaryData, scroll: unref(scrollRef) })
-      : undefined;
+    return showSummary && !unref(getIsEmptyData) ? () => h(TableFooter, { summaryFunc, summaryData, scroll: unref(scrollRef) }) : undefined;
   });
 
   watchEffect(() => {
@@ -42,9 +40,7 @@ export function useTableFooter(
         el: bodyDom,
         name: 'scroll',
         listener: () => {
-          const footerBodyDom = tableEl.$el.querySelector(
-            '.ant-table-footer .ant-table-body'
-          ) as HTMLDivElement;
+          const footerBodyDom = tableEl.$el.querySelector('.ant-table-footer .ant-table-body') as HTMLDivElement;
           if (!footerBodyDom || !bodyDom) return;
           footerBodyDom.scrollLeft = bodyDom.scrollLeft;
         },
diff --git a/src/components/Table/src/hooks/useTableForm.ts b/src/components/Table/src/hooks/useTableForm.ts
index fd5ff1a..1e99e86 100644
--- a/src/components/Table/src/hooks/useTableForm.ts
+++ b/src/components/Table/src/hooks/useTableForm.ts
@@ -4,12 +4,7 @@ import { unref, computed } from 'vue';
 import type { FormProps } from '/@/components/Form';
 import { isFunction } from '/@/utils/is';
 
-export function useTableForm(
-    propsRef: ComputedRef<BasicTableProps>,
-    slots: Slots,
-    fetch: (opt?: FetchParams | undefined) => Promise<void>,
-    getLoading: ComputedRef<boolean | undefined>
-) {
+export function useTableForm(propsRef: ComputedRef<BasicTableProps>, slots: Slots, fetch: (opt?: FetchParams | undefined) => Promise<void>, getLoading: ComputedRef<boolean | undefined>) {
   const getFormProps = computed((): Partial<FormProps> => {
     const { formConfig } = unref(propsRef);
     const { submitButtonOptions } = formConfig || {};
@@ -23,9 +18,7 @@ export function useTableForm(
 
   const getFormSlotKeys: ComputedRef<string[]> = computed(() => {
     const keys = Object.keys(slots);
-    return keys
-        .map((item) => (item.startsWith('form-') ? item : null))
-        .filter((item) => !!item) as string[];
+    return keys.map((item) => (item.startsWith('form-') ? item : null)).filter((item) => !!item) as string[];
   });
 
   function replaceFormSlotKey(key: string) {
diff --git a/src/components/Table/src/hooks/useTableHeader.ts b/src/components/Table/src/hooks/useTableHeader.ts
index b84f4e4..3f29d4e 100644
--- a/src/components/Table/src/hooks/useTableHeader.ts
+++ b/src/components/Table/src/hooks/useTableHeader.ts
@@ -1,61 +1,57 @@
-import type {ComputedRef, Slots} from 'vue';
-import type {BasicTableProps, InnerHandlers} from '../types/table';
-import {unref, computed, h} from 'vue';
+import type { ComputedRef, Slots } from 'vue';
+import type { BasicTableProps, InnerHandlers } from '../types/table';
+import { unref, computed, h } from 'vue';
 import TableHeader from '../components/TableHeader.vue';
-import {isString} from '/@/utils/is';
-import {getSlot} from '/@/utils/helper/tsxHelper';
+import { isString } from '/@/utils/is';
+import { getSlot } from '/@/utils/helper/tsxHelper';
 
-export function useTableHeader(
-    propsRef: ComputedRef<BasicTableProps>,
-    slots: Slots,
-    handlers: InnerHandlers
-) {
-    const getHeaderProps = computed((): Recordable => {
-        const {title, showTableSetting, titleHelpMessage, tableSetting} = unref(propsRef);
-        const hideTitle = !slots.tableTitle && !title && !slots.toolbar && !showTableSetting;
-        if (hideTitle && !isString(title)) {
-            return {};
-        }
+export function useTableHeader(propsRef: ComputedRef<BasicTableProps>, slots: Slots, handlers: InnerHandlers) {
+  const getHeaderProps = computed((): Recordable => {
+    const { title, showTableSetting, titleHelpMessage, tableSetting } = unref(propsRef);
+    const hideTitle = !slots.tableTitle && !title && !slots.toolbar && !showTableSetting;
+    if (hideTitle && !isString(title)) {
+      return {};
+    }
 
-        return {
-            title: hideTitle
-                ? null
-                : () =>
-                    h(
-                        TableHeader,
-                        {
-                            title,
-                            titleHelpMessage,
-                            showTableSetting,
-                            tableSetting,
-                            onColumnsChange: handlers.onColumnsChange,
-                        } as Recordable,
-                        {
-                            ...(slots.toolbar
-                                ? {
-                                    toolbar: () => getSlot(slots, 'toolbar'),
-                                }
-                                : {}),
-                            ...(slots.tableTitle
-                                ? {
-                                    tableTitle: () => getSlot(slots, 'tableTitle'),
-                                }
-                                : {}),
-                            ...(slots.headerTop
-                                ? {
-                                    headerTop: () => getSlot(slots, 'headerTop'),
-                                }
-                                : {}),
-                            //添加tableTop插槽
-                            ...(slots.tableTop
-                                ? {
-                                    tableTop: () => getSlot(slots, 'tableTop'),
-                                }
-                                : {}),
-                            //添加tableTop插槽
-                        }
-                    ),
-        };
-    });
-    return {getHeaderProps};
+    return {
+      title: hideTitle
+        ? null
+        : () =>
+            h(
+              TableHeader,
+              {
+                title,
+                titleHelpMessage,
+                showTableSetting,
+                tableSetting,
+                onColumnsChange: handlers.onColumnsChange,
+              } as Recordable,
+              {
+                ...(slots.toolbar
+                  ? {
+                      toolbar: () => getSlot(slots, 'toolbar'),
+                    }
+                  : {}),
+                ...(slots.tableTitle
+                  ? {
+                      tableTitle: () => getSlot(slots, 'tableTitle'),
+                    }
+                  : {}),
+                ...(slots.headerTop
+                  ? {
+                      headerTop: () => getSlot(slots, 'headerTop'),
+                    }
+                  : {}),
+                //添加tableTop插槽
+                ...(slots.tableTop
+                  ? {
+                      tableTop: () => getSlot(slots, 'tableTop'),
+                    }
+                  : {}),
+                //添加tableTop插槽
+              }
+            ),
+    };
+  });
+  return { getHeaderProps };
 }
diff --git a/src/components/Table/src/hooks/useTableScroll.ts b/src/components/Table/src/hooks/useTableScroll.ts
index 6174aa7..2ff9f40 100644
--- a/src/components/Table/src/hooks/useTableScroll.ts
+++ b/src/components/Table/src/hooks/useTableScroll.ts
@@ -9,11 +9,11 @@ import { onMountedOrActivated } from '/@/hooks/core/onMountedOrActivated';
 import { useDebounceFn } from '@vueuse/core';
 
 export function useTableScroll(
-    propsRef: ComputedRef<BasicTableProps>,
-    tableElRef: Ref<ComponentRef>,
-    columnsRef: ComputedRef<BasicColumn[]>,
-    rowSelectionRef: ComputedRef<TableRowSelection<any> | null>,
-    getDataSourceRef: ComputedRef<Recordable[]>
+  propsRef: ComputedRef<BasicTableProps>,
+  tableElRef: Ref<ComponentRef>,
+  columnsRef: ComputedRef<BasicColumn[]>,
+  rowSelectionRef: ComputedRef<TableRowSelection<any> | null>,
+  getDataSourceRef: ComputedRef<Recordable[]>
 ) {
   const tableHeightRef: Ref<Nullable<number>> = ref(null);
 
@@ -28,13 +28,13 @@ export function useTableScroll(
   });
 
   watch(
-      () => [unref(getCanResize), unref(getDataSourceRef)?.length],
-      () => {
-        debounceRedoHeight();
-      },
-      {
-        flush: 'post',
-      }
+    () => [unref(getCanResize), unref(getDataSourceRef)?.length],
+    () => {
+      debounceRedoHeight();
+    },
+    {
+      flush: 'post',
+    }
   );
 
   function redoHeight() {
@@ -73,15 +73,13 @@ export function useTableScroll(
     const hasScrollBarX = bodyEl.scrollWidth > bodyEl.clientWidth;
 
     if (hasScrollBarY) {
-      tableEl.classList.contains('hide-scrollbar-y') &&
-      tableEl.classList.remove('hide-scrollbar-y');
+      tableEl.classList.contains('hide-scrollbar-y') && tableEl.classList.remove('hide-scrollbar-y');
     } else {
       !tableEl.classList.contains('hide-scrollbar-y') && tableEl.classList.add('hide-scrollbar-y');
     }
 
     if (hasScrollBarX) {
-      tableEl.classList.contains('hide-scrollbar-x') &&
-      tableEl.classList.remove('hide-scrollbar-x');
+      tableEl.classList.contains('hide-scrollbar-x') && tableEl.classList.remove('hide-scrollbar-x');
     } else {
       !tableEl.classList.contains('hide-scrollbar-x') && tableEl.classList.add('hide-scrollbar-x');
     }
@@ -132,13 +130,7 @@ export function useTableScroll(
       headerHeight = (headEl as HTMLElement).offsetHeight;
     }
 
-    let height =
-        bottomIncludeBody -
-        (resizeHeightOffset || 0) -
-        paddingHeight -
-        paginationHeight -
-        footerHeight -
-        headerHeight;
+    let height = bottomIncludeBody - (resizeHeightOffset || 0) - paddingHeight - paginationHeight - footerHeight - headerHeight;
 
     height = (height < minHeight! ? (minHeight as number) : height) ?? height;
     height = (height > maxHeight! ? (maxHeight as number) : height) ?? height;
diff --git a/src/components/Table/src/props.ts b/src/components/Table/src/props.ts
index c6bd40d..5089bb5 100644
--- a/src/components/Table/src/props.ts
+++ b/src/components/Table/src/props.ts
@@ -1,16 +1,8 @@
 import type { PropType } from 'vue';
 import type { PaginationProps } from './types/pagination';
-import type {
-  BasicColumn,
-  FetchSetting,
-  TableSetting,
-  SorterResult,
-  TableCustomRecord,
-  TableRowSelection,
-  SizeType
-} from './types/table';
+import type { BasicColumn, FetchSetting, TableSetting, SorterResult, TableCustomRecord, TableRowSelection, SizeType } from './types/table';
 import type { FormProps } from '/@/components/Form';
-import { DEFAULT_FILTER_FN, DEFAULT_SORT_FN, FETCH_SETTING,DEFAULT_SIZE} from './const';
+import { DEFAULT_FILTER_FN, DEFAULT_SORT_FN, FETCH_SETTING, DEFAULT_SIZE } from './const';
 import { propTypes } from '/@/utils/propTypes';
 
 export const basicProps = {
@@ -138,14 +130,7 @@ export const basicProps = {
     default: null,
   },
   beforeEditSubmit: {
-    type: Function as PropType<
-        (data: {
-          record: Recordable;
-          index: number;
-          key: string | number;
-          value: any;
-        }) => Promise<any>
-        >,
+    type: Function as PropType<(data: { record: Recordable; index: number; key: string | number; value: any }) => Promise<any>>,
   },
   size: {
     type: String as PropType<SizeType>,
diff --git a/src/components/Table/src/types/column.ts b/src/components/Table/src/types/column.ts
index 785e6df..437e4c2 100644
--- a/src/components/Table/src/types/column.ts
+++ b/src/components/Table/src/types/column.ts
@@ -71,10 +71,7 @@ export interface ColumnProps<T> {
    * Customized filter overlay
    * @type any (slot)
    */
-  filterDropdown?:
-    | VNodeChild
-    | JSX.Element
-    | ((props: FilterDropdownProps) => VNodeChild | JSX.Element);
+  filterDropdown?: VNodeChild | JSX.Element | ((props: FilterDropdownProps) => VNodeChild | JSX.Element);
 
   /**
    * Whether filterDropdown is visible
diff --git a/src/components/Table/src/types/componentType.ts b/src/components/Table/src/types/componentType.ts
index 48d5a7a..6e66af6 100644
--- a/src/components/Table/src/types/componentType.ts
+++ b/src/components/Table/src/types/componentType.ts
@@ -1,10 +1 @@
-export type ComponentType =
-  | 'Input'
-  | 'InputNumber'
-  | 'Select'
-  | 'ApiSelect'
-  | 'ApiTreeSelect'
-  | 'Checkbox'
-  | 'Switch'
-  | 'DatePicker'
-  | 'TimePicker';
+export type ComponentType = 'Input' | 'InputNumber' | 'Select' | 'ApiSelect' | 'ApiTreeSelect' | 'Checkbox' | 'Switch' | 'DatePicker' | 'TimePicker';
diff --git a/src/components/Table/src/types/table.ts b/src/components/Table/src/types/table.ts
index 8975b62..e69fe85 100644
--- a/src/components/Table/src/types/table.ts
+++ b/src/components/Table/src/types/table.ts
@@ -1,10 +1,7 @@
 import type { VNodeChild } from 'vue';
 import type { PaginationProps } from './pagination';
 import type { FormProps } from '/@/components/Form';
-import type {
-    ColumnProps,
-    TableRowSelection as ITableRowSelection,
-} from 'ant-design-vue/lib/table/interface';
+import type { ColumnProps, TableRowSelection as ITableRowSelection } from 'ant-design-vue/lib/table/interface';
 
 import { ComponentType } from './componentType';
 import { VueNode } from '/@/utils/propTypes';
@@ -13,455 +10,444 @@ import { RoleEnum } from '/@/enums/roleEnum';
 export declare type SortOrder = 'ascend' | 'descend';
 
 export interface TableCurrentDataSource<T = Recordable> {
-    currentDataSource: T[];
+  currentDataSource: T[];
 }
 
 export interface TableRowSelection<T = any> extends ITableRowSelection {
-    /**
-     * Callback executed when selected rows change
-     * @type Function
-     */
-    onChange?: (selectedRowKeys: string[] | number[], selectedRows: T[]) => any;
+  /**
+   * Callback executed when selected rows change
+   * @type Function
+   */
+  onChange?: (selectedRowKeys: string[] | number[], selectedRows: T[]) => any;
 
-    /**
-     * Callback executed when select/deselect one row
-     * @type Function
-     */
-    onSelect?: (record: T, selected: boolean, selectedRows: Object[], nativeEvent: Event) => any;
+  /**
+   * Callback executed when select/deselect one row
+   * @type Function
+   */
+  onSelect?: (record: T, selected: boolean, selectedRows: Object[], nativeEvent: Event) => any;
 
-    /**
-     * Callback executed when select/deselect all rows
-     * @type Function
-     */
-    onSelectAll?: (selected: boolean, selectedRows: T[], changeRows: T[]) => any;
+  /**
+   * Callback executed when select/deselect all rows
+   * @type Function
+   */
+  onSelectAll?: (selected: boolean, selectedRows: T[], changeRows: T[]) => any;
 
-    /**
-     * Callback executed when row selection is inverted
-     * @type Function
-     */
-    onSelectInvert?: (selectedRows: string[] | number[]) => any;
+  /**
+   * Callback executed when row selection is inverted
+   * @type Function
+   */
+  onSelectInvert?: (selectedRows: string[] | number[]) => any;
 }
 
 export interface TableCustomRecord<T> {
-    record?: T;
-    index?: number;
+  record?: T;
+  index?: number;
 }
 
 export interface ExpandedRowRenderRecord<T> extends TableCustomRecord<T> {
-    indent?: number;
-    expanded?: boolean;
+  indent?: number;
+  expanded?: boolean;
 }
 
 export interface ColumnFilterItem {
-    text?: string;
-    value?: string;
-    children?: any;
+  text?: string;
+  value?: string;
+  children?: any;
 }
 
 export interface TableCustomRecord<T = Recordable> {
-    record?: T;
-    index?: number;
+  record?: T;
+  index?: number;
 }
 
 export interface SorterResult {
-    column: ColumnProps;
-    order: SortOrder;
-    field: string;
-    columnKey: string;
+  column: ColumnProps;
+  order: SortOrder;
+  field: string;
+  columnKey: string;
 }
 
 export interface FetchParams {
-    searchInfo?: Recordable;
-    page?: number;
-    sortInfo?: Recordable;
-    filterInfo?: Recordable;
+  searchInfo?: Recordable;
+  page?: number;
+  sortInfo?: Recordable;
+  filterInfo?: Recordable;
 }
 
 export interface GetColumnsParams {
-    ignoreIndex?: boolean;
-    ignoreAction?: boolean;
-    sort?: boolean;
+  ignoreIndex?: boolean;
+  ignoreAction?: boolean;
+  sort?: boolean;
 }
 
 export type SizeType = 'default' | 'middle' | 'small' | 'large';
 
 export interface TableActionType {
-    reload: (opt?: FetchParams) => Promise<void>;
-    getSelectRows: <T = Recordable>() => T[];
-    clearSelectedRowKeys: () => void;
-    expandAll: () => void;
-    collapseAll: () => void;
-    getSelectRowKeys: () => string[];
-    deleteSelectRowByKey: (key: string) => void;
-    setPagination: (info: Partial<PaginationProps>) => void;
-    setTableData: <T = Recordable>(values: T[]) => void;
-    updateTableDataRecord: (rowKey: string | number, record: Recordable) => Recordable | void;
-    deleteTableDataRecord: (rowKey: string | number | string[] | number[]) => void;
-    insertTableDataRecord: (record: Recordable, index?: number) => Recordable | void;
-    findTableDataRecord: (rowKey: string | number) => Recordable | void;
-    getColumns: (opt?: GetColumnsParams) => BasicColumn[];
-    setColumns: (columns: BasicColumn[] | string[]) => void;
-    getDataSource: <T = Recordable>() => T[];
-    getRawDataSource: <T = Recordable>() => T;
-    setLoading: (loading: boolean) => void;
-    setProps: (props: Partial<BasicTableProps>) => void;
-    redoHeight: () => void;
-    setSelectedRowKeys: (rowKeys: string[] | number[]) => void;
-    getPaginationRef: () => PaginationProps | boolean;
-    getSize: () => SizeType;
-    getRowSelection: () => TableRowSelection<Recordable>;
-    getCacheColumns: () => BasicColumn[];
-    emit?: EmitType;
-    updateTableData: (index: number, key: string, value: any) => Recordable;
-    setShowPagination: (show: boolean) => Promise<void>;
-    getShowPagination: () => boolean;
-    setCacheColumnsByField?: (dataIndex: string | undefined, value: BasicColumn) => void;
+  reload: (opt?: FetchParams) => Promise<void>;
+  getSelectRows: <T = Recordable>() => T[];
+  clearSelectedRowKeys: () => void;
+  expandAll: () => void;
+  collapseAll: () => void;
+  getSelectRowKeys: () => string[];
+  deleteSelectRowByKey: (key: string) => void;
+  setPagination: (info: Partial<PaginationProps>) => void;
+  setTableData: <T = Recordable>(values: T[]) => void;
+  updateTableDataRecord: (rowKey: string | number, record: Recordable) => Recordable | void;
+  deleteTableDataRecord: (rowKey: string | number | string[] | number[]) => void;
+  insertTableDataRecord: (record: Recordable, index?: number) => Recordable | void;
+  findTableDataRecord: (rowKey: string | number) => Recordable | void;
+  getColumns: (opt?: GetColumnsParams) => BasicColumn[];
+  setColumns: (columns: BasicColumn[] | string[]) => void;
+  getDataSource: <T = Recordable>() => T[];
+  getRawDataSource: <T = Recordable>() => T;
+  setLoading: (loading: boolean) => void;
+  setProps: (props: Partial<BasicTableProps>) => void;
+  redoHeight: () => void;
+  setSelectedRowKeys: (rowKeys: string[] | number[]) => void;
+  getPaginationRef: () => PaginationProps | boolean;
+  getSize: () => SizeType;
+  getRowSelection: () => TableRowSelection<Recordable>;
+  getCacheColumns: () => BasicColumn[];
+  emit?: EmitType;
+  updateTableData: (index: number, key: string, value: any) => Recordable;
+  setShowPagination: (show: boolean) => Promise<void>;
+  getShowPagination: () => boolean;
+  setCacheColumnsByField?: (dataIndex: string | undefined, value: BasicColumn) => void;
 }
 
 export interface FetchSetting {
-    // 请求接口当前页数
-    pageField: string;
-    // 每页显示多少条
-    sizeField: string;
-    // 请求结果列表字段  支持 a.b.c
-    listField: string;
-    // 请求结果总数字段  支持 a.b.c
-    totalField: string;
+  // 请求接口当前页数
+  pageField: string;
+  // 每页显示多少条
+  sizeField: string;
+  // 请求结果列表字段  支持 a.b.c
+  listField: string;
+  // 请求结果总数字段  支持 a.b.c
+  totalField: string;
 }
 
 export interface TableSetting {
-    redo?: boolean;
-    size?: boolean;
-    setting?: boolean;
-    fullScreen?: boolean;
+  redo?: boolean;
+  size?: boolean;
+  setting?: boolean;
+  fullScreen?: boolean;
 }
 
 export interface BasicTableProps<T = any> {
-    // 点击行选中
-    clickToRowSelect?: boolean;
-    isTreeTable?: boolean;
-    // 自定义排序方法
-    sortFn?: (sortInfo: SorterResult) => any;
-    // 排序方法
-    filterFn?: (data: Partial<Recordable<string[]>>) => any;
-    // 取消表格的默认padding
-    inset?: boolean;
-    // 显示表格设置
-    showTableSetting?: boolean;
-    tableSetting?: TableSetting;
-    // 斑马纹
-    striped?: boolean;
-    // 是否自动生成key
-    autoCreateKey?: boolean;
-    // 计算合计行的方法
-    summaryFunc?: (...arg: any) => Recordable[];
-    // 自定义合计表格内容
-    summaryData?: Recordable[];
-    // 是否显示合计行
-    showSummary?: boolean;
-    // 是否可拖拽列
-    canColDrag?: boolean;
-    // 接口请求对象
-    api?: (...arg: any) => Promise<any>;
-    // 请求之前处理参数
-    beforeFetch?: Fn;
-    // 自定义处理接口返回参数
-    afterFetch?: Fn;
-    // 查询条件请求之前处理
-    handleSearchInfoFn?: Fn;
-    // 请求接口配置
-    fetchSetting?: Partial<FetchSetting>;
-    // 立即请求接口
-    immediate?: boolean;
-    // 在开起搜索表单的时候，如果没有数据是否显示表格
-    emptyDataIsShowTable?: boolean;
-    // 额外的请求参数
-    searchInfo?: Recordable;
-    // 默认的排序参数
-    defSort?: Recordable;
-    // 使用搜索表单
-    useSearchForm?: boolean;
-    // 表单配置
-    formConfig?: Partial<FormProps>;
-    // 列配置
-    columns: BasicColumn[];
-    // 是否显示序号列
-    showIndexColumn?: boolean;
-    // 序号列配置
-    indexColumnProps?: BasicColumn;
-    // 是否显示操作列
-    showActionColumn?: boolean,
-    // 操作列配置
-    actionColumn?: BasicColumn;
-    // 文本超过宽度是否显示。。。
-    ellipsis?: boolean;
-    // 是否可以自适应高度
-    canResize?: boolean;
-    // 自适应高度偏移， 计算结果-偏移量
-    resizeHeightOffset?: number;
+  // 点击行选中
+  clickToRowSelect?: boolean;
+  isTreeTable?: boolean;
+  // 自定义排序方法
+  sortFn?: (sortInfo: SorterResult) => any;
+  // 排序方法
+  filterFn?: (data: Partial<Recordable<string[]>>) => any;
+  // 取消表格的默认padding
+  inset?: boolean;
+  // 显示表格设置
+  showTableSetting?: boolean;
+  tableSetting?: TableSetting;
+  // 斑马纹
+  striped?: boolean;
+  // 是否自动生成key
+  autoCreateKey?: boolean;
+  // 计算合计行的方法
+  summaryFunc?: (...arg: any) => Recordable[];
+  // 自定义合计表格内容
+  summaryData?: Recordable[];
+  // 是否显示合计行
+  showSummary?: boolean;
+  // 是否可拖拽列
+  canColDrag?: boolean;
+  // 接口请求对象
+  api?: (...arg: any) => Promise<any>;
+  // 请求之前处理参数
+  beforeFetch?: Fn;
+  // 自定义处理接口返回参数
+  afterFetch?: Fn;
+  // 查询条件请求之前处理
+  handleSearchInfoFn?: Fn;
+  // 请求接口配置
+  fetchSetting?: Partial<FetchSetting>;
+  // 立即请求接口
+  immediate?: boolean;
+  // 在开起搜索表单的时候，如果没有数据是否显示表格
+  emptyDataIsShowTable?: boolean;
+  // 额外的请求参数
+  searchInfo?: Recordable;
+  // 默认的排序参数
+  defSort?: Recordable;
+  // 使用搜索表单
+  useSearchForm?: boolean;
+  // 表单配置
+  formConfig?: Partial<FormProps>;
+  // 列配置
+  columns: BasicColumn[];
+  // 是否显示序号列
+  showIndexColumn?: boolean;
+  // 序号列配置
+  indexColumnProps?: BasicColumn;
+  // 是否显示操作列
+  showActionColumn?: boolean;
+  // 操作列配置
+  actionColumn?: BasicColumn;
+  // 文本超过宽度是否显示。。。
+  ellipsis?: boolean;
+  // 是否可以自适应高度
+  canResize?: boolean;
+  // 自适应高度偏移， 计算结果-偏移量
+  resizeHeightOffset?: number;
 
-    // 在分页改变的时候清空选项
-    clearSelectOnPageChange?: boolean;
-    //
-    rowKey?: string | ((record: Recordable) => string);
-    // 数据
-    dataSource?: Recordable[];
-    // 标题右侧提示
-    titleHelpMessage?: string | string[];
-    // 表格最小高度
-    minHeight?: number;
-    // 表格滚动最大高度
-    maxHeight?: number;
-    // 是否显示边框
-    bordered?: boolean;
-    // 分页配置
-    pagination?: PaginationProps | boolean;
-    // loading加载
-    loading?: boolean;
+  // 在分页改变的时候清空选项
+  clearSelectOnPageChange?: boolean;
+  //
+  rowKey?: string | ((record: Recordable) => string);
+  // 数据
+  dataSource?: Recordable[];
+  // 标题右侧提示
+  titleHelpMessage?: string | string[];
+  // 表格最小高度
+  minHeight?: number;
+  // 表格滚动最大高度
+  maxHeight?: number;
+  // 是否显示边框
+  bordered?: boolean;
+  // 分页配置
+  pagination?: PaginationProps | boolean;
+  // loading加载
+  loading?: boolean;
 
-    /**
-     * The column contains children to display
-     * @default 'children'
-     * @type string | string[]
-     */
-    childrenColumnName?: string;
+  /**
+   * The column contains children to display
+   * @default 'children'
+   * @type string | string[]
+   */
+  childrenColumnName?: string;
 
-    /**
-     * Override default table elements
-     * @type object
-     */
-    components?: object;
+  /**
+   * Override default table elements
+   * @type object
+   */
+  components?: object;
 
-    /**
-     * Expand all rows initially
-     * @default false
-     * @type boolean
-     */
-    defaultExpandAllRows?: boolean;
+  /**
+   * Expand all rows initially
+   * @default false
+   * @type boolean
+   */
+  defaultExpandAllRows?: boolean;
 
-    /**
-     * Initial expanded row keys
-     * @type string[]
-     */
-    defaultExpandedRowKeys?: string[];
+  /**
+   * Initial expanded row keys
+   * @type string[]
+   */
+  defaultExpandedRowKeys?: string[];
 
-    /**
-     * Current expanded row keys
-     * @type string[]
-     */
-    expandedRowKeys?: string[];
+  /**
+   * Current expanded row keys
+   * @type string[]
+   */
+  expandedRowKeys?: string[];
 
-    /**
-     * Expanded container render for each row
-     * @type Function
-     */
-    expandedRowRender?: (record?: ExpandedRowRenderRecord<T>) => VNodeChild | JSX.Element;
+  /**
+   * Expanded container render for each row
+   * @type Function
+   */
+  expandedRowRender?: (record?: ExpandedRowRenderRecord<T>) => VNodeChild | JSX.Element;
 
-    /**
-     * Customize row expand Icon.
-     * @type Function | VNodeChild
-     */
-    expandIcon?: Function | VNodeChild | JSX.Element;
+  /**
+   * Customize row expand Icon.
+   * @type Function | VNodeChild
+   */
+  expandIcon?: Function | VNodeChild | JSX.Element;
 
-    /**
-     * Whether to expand row by clicking anywhere in the whole row
-     * @default false
-     * @type boolean
-     */
-    expandRowByClick?: boolean;
+  /**
+   * Whether to expand row by clicking anywhere in the whole row
+   * @default false
+   * @type boolean
+   */
+  expandRowByClick?: boolean;
 
-    /**
-     * The index of `expandIcon` which column will be inserted when `expandIconAsCell` is false. default 0
-     */
-    expandIconColumnIndex?: number;
+  /**
+   * The index of `expandIcon` which column will be inserted when `expandIconAsCell` is false. default 0
+   */
+  expandIconColumnIndex?: number;
 
-    /**
-     * Table footer renderer
-     * @type Function | VNodeChild
-     */
-    footer?: Function | VNodeChild | JSX.Element;
+  /**
+   * Table footer renderer
+   * @type Function | VNodeChild
+   */
+  footer?: Function | VNodeChild | JSX.Element;
 
-    /**
-     * Indent size in pixels of tree data
-     * @default 15
-     * @type number
-     */
-    indentSize?: number;
+  /**
+   * Indent size in pixels of tree data
+   * @default 15
+   * @type number
+   */
+  indentSize?: number;
 
-    /**
-     * i18n text including filter, sort, empty text, etc
-     * @default { filterConfirm: 'Ok', filterReset: 'Reset', emptyText: 'No Data' }
-     * @type object
-     */
-    locale?: object;
+  /**
+   * i18n text including filter, sort, empty text, etc
+   * @default { filterConfirm: 'Ok', filterReset: 'Reset', emptyText: 'No Data' }
+   * @type object
+   */
+  locale?: object;
 
-    /**
-     * Row's className
-     * @type Function
-     */
-    rowClassName?: (record: TableCustomRecord<T>, index: number) => string;
+  /**
+   * Row's className
+   * @type Function
+   */
+  rowClassName?: (record: TableCustomRecord<T>, index: number) => string;
 
-    /**
-     * Row selection config
-     * @type object
-     */
-    rowSelection?: TableRowSelection;
+  /**
+   * Row selection config
+   * @type object
+   */
+  rowSelection?: TableRowSelection;
 
-    /**
-     * Set horizontal or vertical scrolling, can also be used to specify the width and height of the scroll area.
-     * It is recommended to set a number for x, if you want to set it to true,
-     * you need to add style .ant-table td { white-space: nowrap; }.
-     * @type object
-     */
-    scroll?: { x?: number | true; y?: number };
+  /**
+   * Set horizontal or vertical scrolling, can also be used to specify the width and height of the scroll area.
+   * It is recommended to set a number for x, if you want to set it to true,
+   * you need to add style .ant-table td { white-space: nowrap; }.
+   * @type object
+   */
+  scroll?: { x?: number | true; y?: number };
 
-    /**
-     * Whether to show table header
-     * @default true
-     * @type boolean
-     */
-    showHeader?: boolean;
+  /**
+   * Whether to show table header
+   * @default true
+   * @type boolean
+   */
+  showHeader?: boolean;
 
-    /**
-     * Size of table
-     * @default 'default'
-     * @type string
-     */
-    size?: SizeType;
+  /**
+   * Size of table
+   * @default 'default'
+   * @type string
+   */
+  size?: SizeType;
 
-    /**
-     * Table title renderer
-     * @type Function | ScopedSlot
-     */
-    title?: VNodeChild | JSX.Element | string | ((data: Recordable) => string);
+  /**
+   * Table title renderer
+   * @type Function | ScopedSlot
+   */
+  title?: VNodeChild | JSX.Element | string | ((data: Recordable) => string);
 
-    /**
-     * Set props on per header row
-     * @type Function
-     */
-    customHeaderRow?: (column: ColumnProps, index: number) => object;
+  /**
+   * Set props on per header row
+   * @type Function
+   */
+  customHeaderRow?: (column: ColumnProps, index: number) => object;
 
-    /**
-     * Set props on per row
-     * @type Function
-     */
-    customRow?: (record: T, index: number) => object;
+  /**
+   * Set props on per row
+   * @type Function
+   */
+  customRow?: (record: T, index: number) => object;
 
-    /**
-     * `table-layout` attribute of table element
-     * `fixed` when header/columns are fixed, or using `column.ellipsis`
-     *
-     * @see https://developer.mozilla.org/en-US/docs/Web/CSS/table-layout
-     * @version 1.5.0
-     */
-    tableLayout?: 'auto' | 'fixed' | string;
+  /**
+   * `table-layout` attribute of table element
+   * `fixed` when header/columns are fixed, or using `column.ellipsis`
+   *
+   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/table-layout
+   * @version 1.5.0
+   */
+  tableLayout?: 'auto' | 'fixed' | string;
 
-    /**
-     * the render container of dropdowns in table
-     * @param triggerNode
-     * @version 1.5.0
-     */
-    getPopupContainer?: (triggerNode?: HTMLElement) => HTMLElement;
+  /**
+   * the render container of dropdowns in table
+   * @param triggerNode
+   * @version 1.5.0
+   */
+  getPopupContainer?: (triggerNode?: HTMLElement) => HTMLElement;
 
-    /**
-     * Data can be changed again before rendering.
-     * The default configuration of general user empty data.
-     * You can configured globally through [ConfigProvider](https://antdv.com/components/config-provider-cn/)
-     *
-     * @version 1.5.4
-     */
-    transformCellText?: Function;
+  /**
+   * Data can be changed again before rendering.
+   * The default configuration of general user empty data.
+   * You can configured globally through [ConfigProvider](https://antdv.com/components/config-provider-cn/)
+   *
+   * @version 1.5.4
+   */
+  transformCellText?: Function;
 
-    /**
-     * Callback executed before editable cell submit value, not for row-editor
-     *
-     * The cell will not submit data while callback return false
-     */
-    beforeEditSubmit?: (data: {
-        record: Recordable;
-        index: number;
-        key: string | number;
-        value: any;
-    }) => Promise<any>;
+  /**
+   * Callback executed before editable cell submit value, not for row-editor
+   *
+   * The cell will not submit data while callback return false
+   */
+  beforeEditSubmit?: (data: { record: Recordable; index: number; key: string | number; value: any }) => Promise<any>;
 
+  /**
+   * Callback executed when pagination, filters or sorter is changed
+   * @param pagination
+   * @param filters
+   * @param sorter
+   * @param currentDataSource
+   */
+  onChange?: (pagination: any, filters: any, sorter: any, extra: any) => void;
 
-    /**
-     * Callback executed when pagination, filters or sorter is changed
-     * @param pagination
-     * @param filters
-     * @param sorter
-     * @param currentDataSource
-     */
-    onChange?: (pagination: any, filters: any, sorter: any, extra: any) => void;
+  /**
+   * Callback executed when the row expand icon is clicked
+   *
+   * @param expanded
+   * @param record
+   */
+  onExpand?: (expande: boolean, record: T) => void;
 
-    /**
-     * Callback executed when the row expand icon is clicked
-     *
-     * @param expanded
-     * @param record
-     */
-    onExpand?: (expande: boolean, record: T) => void;
+  /**
+   * Callback executed when the expanded rows change
+   * @param expandedRows
+   */
+  onExpandedRowsChange?: (expandedRows: string[] | number[]) => void;
 
-    /**
-     * Callback executed when the expanded rows change
-     * @param expandedRows
-     */
-    onExpandedRowsChange?: (expandedRows: string[] | number[]) => void;
-
-    onColumnsChange?: (data: ColumnChangeParam[]) => void;
+  onColumnsChange?: (data: ColumnChangeParam[]) => void;
 }
 
-export type CellFormat =
-    | string
-    | ((text: string, record: Recordable, index: number) => string | number)
-    | Map<string | number, any>;
+export type CellFormat = string | ((text: string, record: Recordable, index: number) => string | number) | Map<string | number, any>;
 
 // @ts-ignore
 export interface BasicColumn extends ColumnProps {
-    children?: BasicColumn[];
-    filters?: {
-        text: string;
-        value: string;
-        children?:
-            | unknown[]
-            | (((props: Record<string, unknown>) => unknown[]) & (() => unknown[]) & (() => unknown[]));
-    }[];
+  children?: BasicColumn[];
+  filters?: {
+    text: string;
+    value: string;
+    children?: unknown[] | (((props: Record<string, unknown>) => unknown[]) & (() => unknown[]) & (() => unknown[]));
+  }[];
 
-    //
-    flag?: 'INDEX' | 'DEFAULT' | 'CHECKBOX' | 'RADIO' | 'ACTION';
-    customTitle?: VueNode;
+  //
+  flag?: 'INDEX' | 'DEFAULT' | 'CHECKBOX' | 'RADIO' | 'ACTION';
+  customTitle?: VueNode;
 
-    slots?: Recordable;
+  slots?: Recordable;
 
-    // Whether to hide the column by default, it can be displayed in the column configuration
-    defaultHidden?: boolean;
+  // Whether to hide the column by default, it can be displayed in the column configuration
+  defaultHidden?: boolean;
 
-    // Help text for table column header
-    helpMessage?: string | string[];
+  // Help text for table column header
+  helpMessage?: string | string[];
 
-    format?: CellFormat;
+  format?: CellFormat;
 
-    // Editable
-    edit?: boolean;
-    editRow?: boolean;
-    editable?: boolean;
-    editComponent?: ComponentType;
-    editComponentProps?: Recordable;
-    editRule?: boolean | ((text: string, record: Recordable) => Promise<string>);
-    editValueMap?: (value: any) => string;
-    onEditRow?: () => void;
-    // 权限编码控制是否显示
-    auth?: RoleEnum | RoleEnum[] | string | string[];
-    // 业务控制是否显示
-    ifShow?: boolean | ((column: BasicColumn) => boolean);
+  // Editable
+  edit?: boolean;
+  editRow?: boolean;
+  editable?: boolean;
+  editComponent?: ComponentType;
+  editComponentProps?: Recordable;
+  editRule?: boolean | ((text: string, record: Recordable) => Promise<string>);
+  editValueMap?: (value: any) => string;
+  onEditRow?: () => void;
+  // 权限编码控制是否显示
+  auth?: RoleEnum | RoleEnum[] | string | string[];
+  // 业务控制是否显示
+  ifShow?: boolean | ((column: BasicColumn) => boolean);
 }
 
 export type ColumnChangeParam = {
-    dataIndex: string;
-    fixed: boolean | 'left' | 'right' | undefined;
-    visible: boolean;
+  dataIndex: string;
+  fixed: boolean | 'left' | 'right' | undefined;
+  visible: boolean;
 };
 
 export interface InnerHandlers {
-    onColumnsChange: (data: ColumnChangeParam[]) => void;
+  onColumnsChange: (data: ColumnChangeParam[]) => void;
 }
diff --git a/src/components/Time/src/Time.vue b/src/components/Time/src/Time.vue
index a74d2c6..be49ba3 100644
--- a/src/components/Time/src/Time.vue
+++ b/src/components/Time/src/Time.vue
@@ -17,8 +17,7 @@
   export default defineComponent({
     name: 'Time',
     props: {
-      value: propTypes.oneOfType([propTypes.number, propTypes.instanceOf(Date), propTypes.string])
-        .isRequired,
+      value: propTypes.oneOfType([propTypes.number, propTypes.instanceOf(Date), propTypes.string]).isRequired,
       step: propTypes.number.def(60),
       mode: propTypes.oneOf(['date', 'datetime', 'relative']).def('relative'),
     },
diff --git a/src/components/Tinymce/src/Editor.vue b/src/components/Tinymce/src/Editor.vue
index c24441e..92f5b99 100644
--- a/src/components/Tinymce/src/Editor.vue
+++ b/src/components/Tinymce/src/Editor.vue
@@ -1,380 +1,353 @@
 <template>
-    <div :class="prefixCls" :style="{ width: containerWidth }">
-        <ImgUpload
-                :fullscreen="fullscreen"
-                @uploading="handleImageUploading"
-                @done="handleDone"
-                v-if="showImageUpload"
-                v-show="editorRef"
-                :disabled="disabled"
-        />
-        <textarea
-                :id="tinymceId"
-                ref="elRef"
-                :style="{ visibility: 'hidden' }"
-                v-if="!initOptions.inline"
-        ></textarea>
-        <slot v-else></slot>
-    </div>
+  <div :class="prefixCls" :style="{ width: containerWidth }">
+    <ImgUpload :fullscreen="fullscreen" @uploading="handleImageUploading" @done="handleDone" v-if="showImageUpload" v-show="editorRef" :disabled="disabled" />
+    <textarea :id="tinymceId" ref="elRef" :style="{ visibility: 'hidden' }" v-if="!initOptions.inline"></textarea>
+    <slot v-else></slot>
+  </div>
 </template>
 
 <script lang="ts">
-    import type { Editor, RawEditorSettings } from 'tinymce';
-    import tinymce from 'tinymce/tinymce';
-    import 'tinymce/themes/silver';
-    import 'tinymce/icons/default/icons';
-    import 'tinymce/plugins/advlist';
-    import 'tinymce/plugins/anchor';
-    import 'tinymce/plugins/autolink';
-    import 'tinymce/plugins/autosave';
-    import 'tinymce/plugins/code';
-    import 'tinymce/plugins/codesample';
-    import 'tinymce/plugins/directionality';
-    import 'tinymce/plugins/fullscreen';
-    import 'tinymce/plugins/hr';
-    import 'tinymce/plugins/insertdatetime';
-    import 'tinymce/plugins/link';
-    import 'tinymce/plugins/lists';
-    import 'tinymce/plugins/media';
-    import 'tinymce/plugins/nonbreaking';
-    import 'tinymce/plugins/noneditable';
-    import 'tinymce/plugins/pagebreak';
-    import 'tinymce/plugins/paste';
-    import 'tinymce/plugins/preview';
-    import 'tinymce/plugins/print';
-    import 'tinymce/plugins/save';
-    import 'tinymce/plugins/searchreplace';
-    import 'tinymce/plugins/spellchecker';
-    import 'tinymce/plugins/tabfocus';
-    // import 'tinymce/plugins/table';
-    import 'tinymce/plugins/template';
-    import 'tinymce/plugins/textpattern';
-    import 'tinymce/plugins/visualblocks';
-    import 'tinymce/plugins/visualchars';
-    import 'tinymce/plugins/wordcount';
-    import 'tinymce/plugins/image'
-    import 'tinymce/plugins/table'
-    import 'tinymce/plugins/textcolor'
-    import 'tinymce/plugins/contextmenu'
-    import {
-        defineComponent,
-        computed,
-        nextTick,
-        ref,
-        unref,
-        watch,
-        onDeactivated,
-        onBeforeUnmount,
-    } from 'vue';
-    import ImgUpload from './ImgUpload.vue';
-    import { toolbar, plugins,simplePlugins,simpleToolbar,menubar } from './tinymce';
-    import { buildShortUUID } from '/@/utils/uuid';
-    import { bindHandlers } from './helper';
-    import { onMountedOrActivated } from '/@/hooks/core/onMountedOrActivated';
-    import { useDesign } from '/@/hooks/web/useDesign';
-    import { isNumber } from '/@/utils/is';
-    import { useLocale } from '/@/locales/useLocale';
-    import { useAppStore } from '/@/store/modules/app';
-    import { uploadFile } from '/@/api/common/api';
-    import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
-    const tinymceProps = {
-        options: {
-            type: Object as PropType<Partial<RawEditorSettings>>,
-            default: {},
-        },
-        value: {
-            type: String,
-        },
+  import type { Editor, RawEditorSettings } from 'tinymce';
+  import tinymce from 'tinymce/tinymce';
+  import 'tinymce/themes/silver';
+  import 'tinymce/icons/default/icons';
+  import 'tinymce/plugins/advlist';
+  import 'tinymce/plugins/anchor';
+  import 'tinymce/plugins/autolink';
+  import 'tinymce/plugins/autosave';
+  import 'tinymce/plugins/code';
+  import 'tinymce/plugins/codesample';
+  import 'tinymce/plugins/directionality';
+  import 'tinymce/plugins/fullscreen';
+  import 'tinymce/plugins/hr';
+  import 'tinymce/plugins/insertdatetime';
+  import 'tinymce/plugins/link';
+  import 'tinymce/plugins/lists';
+  import 'tinymce/plugins/media';
+  import 'tinymce/plugins/nonbreaking';
+  import 'tinymce/plugins/noneditable';
+  import 'tinymce/plugins/pagebreak';
+  import 'tinymce/plugins/paste';
+  import 'tinymce/plugins/preview';
+  import 'tinymce/plugins/print';
+  import 'tinymce/plugins/save';
+  import 'tinymce/plugins/searchreplace';
+  import 'tinymce/plugins/spellchecker';
+  import 'tinymce/plugins/tabfocus';
+  // import 'tinymce/plugins/table';
+  import 'tinymce/plugins/template';
+  import 'tinymce/plugins/textpattern';
+  import 'tinymce/plugins/visualblocks';
+  import 'tinymce/plugins/visualchars';
+  import 'tinymce/plugins/wordcount';
+  import 'tinymce/plugins/image';
+  import 'tinymce/plugins/table';
+  import 'tinymce/plugins/textcolor';
+  import 'tinymce/plugins/contextmenu';
+  import { defineComponent, computed, nextTick, ref, unref, watch, onDeactivated, onBeforeUnmount } from 'vue';
+  import ImgUpload from './ImgUpload.vue';
+  import { toolbar, plugins, simplePlugins, simpleToolbar, menubar } from './tinymce';
+  import { buildShortUUID } from '/@/utils/uuid';
+  import { bindHandlers } from './helper';
+  import { onMountedOrActivated } from '/@/hooks/core/onMountedOrActivated';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { isNumber } from '/@/utils/is';
+  import { useLocale } from '/@/locales/useLocale';
+  import { useAppStore } from '/@/store/modules/app';
+  import { uploadFile } from '/@/api/common/api';
+  import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
+  const tinymceProps = {
+    options: {
+      type: Object as PropType<Partial<RawEditorSettings>>,
+      default: {},
+    },
+    value: {
+      type: String,
+    },
 
-        toolbar: {
-            type: Array as PropType<string[]>,
-            default: toolbar,
-        },
-        plugins: {
-            type: Array as PropType<string[]>,
-            default: plugins,
-        },
-        menubar: {
-            type: Object,
-            default: menubar,
-        },
-        modelValue: {
-            type: String,
-        },
-        height: {
-            type: [Number, String] as PropType<string | number>,
-            required: false,
-            default: 400,
-        },
-        width: {
-            type: [Number, String] as PropType<string | number>,
-            required: false,
-            default: 'auto',
-        },
-        showImageUpload: {
-            type: Boolean,
-            default: true,
-        },
-    };
+    toolbar: {
+      type: Array as PropType<string[]>,
+      default: toolbar,
+    },
+    plugins: {
+      type: Array as PropType<string[]>,
+      default: plugins,
+    },
+    menubar: {
+      type: Object,
+      default: menubar,
+    },
+    modelValue: {
+      type: String,
+    },
+    height: {
+      type: [Number, String] as PropType<string | number>,
+      required: false,
+      default: 400,
+    },
+    width: {
+      type: [Number, String] as PropType<string | number>,
+      required: false,
+      default: 'auto',
+    },
+    showImageUpload: {
+      type: Boolean,
+      default: true,
+    },
+  };
 
-    export default defineComponent({
-        name: 'Tinymce',
-        components: { ImgUpload },
-        inheritAttrs: false,
-        props: tinymceProps,
-        emits: ['change', 'update:modelValue', 'inited', 'init-error'],
-        setup(props, { emit, attrs }) {
-            const editorRef = ref<Nullable<Editor>>(null);
-            const fullscreen = ref(false);
-            const tinymceId = ref<string>(buildShortUUID('tiny-vue'));
-            const elRef = ref<Nullable<HTMLElement>>(null);
+  export default defineComponent({
+    name: 'Tinymce',
+    components: { ImgUpload },
+    inheritAttrs: false,
+    props: tinymceProps,
+    emits: ['change', 'update:modelValue', 'inited', 'init-error'],
+    setup(props, { emit, attrs }) {
+      const editorRef = ref<Nullable<Editor>>(null);
+      const fullscreen = ref(false);
+      const tinymceId = ref<string>(buildShortUUID('tiny-vue'));
+      const elRef = ref<Nullable<HTMLElement>>(null);
 
-            const { prefixCls } = useDesign('tinymce-container');
+      const { prefixCls } = useDesign('tinymce-container');
 
-            const appStore = useAppStore();
+      const appStore = useAppStore();
 
-            const tinymceContent = computed(() => props.modelValue);
+      const tinymceContent = computed(() => props.modelValue);
 
-            const containerWidth = computed(() => {
-                const width = props.width;
-                if (isNumber(width)) {
-                    return `${width}px`;
-                }
-                return width;
-            });
+      const containerWidth = computed(() => {
+        const width = props.width;
+        if (isNumber(width)) {
+          return `${width}px`;
+        }
+        return width;
+      });
 
-            const skinName = computed(() => {
-                return appStore.getDarkMode === 'light' ? 'jeecg' : 'oxide-dark';
-            });
+      const skinName = computed(() => {
+        return appStore.getDarkMode === 'light' ? 'jeecg' : 'oxide-dark';
+      });
 
-            const langName = computed(() => {
-                const lang = useLocale().getLocale.value;
-                return ['zh_CN', 'en'].includes(lang) ? lang : 'zh_CN';
-            });
+      const langName = computed(() => {
+        const lang = useLocale().getLocale.value;
+        return ['zh_CN', 'en'].includes(lang) ? lang : 'zh_CN';
+      });
 
-            const initOptions = computed((): RawEditorSettings => {
-                const { height, options, toolbar, plugins,menubar } = props;
-                const publicPath = import.meta.env.VITE_PUBLIC_PATH || '/';
-                return {
-                    selector: `#${unref(tinymceId)}`,
-                    height,
-                    toolbar,
-                    menubar: menubar,
-                    plugins,
-                    language_url: publicPath + 'resource/tinymce/langs/' + langName.value + '.js',
-                    language: langName.value,
-                    branding: false,
-                    default_link_target: '_blank',
-                    link_title: false,
-                    object_resizing: true,
-                    toolbar_mode:'sliding',
-                    auto_focus: true,
-                    toolbar_groups:true,
-                    skin: skinName.value,
-                    skin_url: publicPath + 'resource/tinymce/skins/ui/' + skinName.value,
-                    images_upload_handler: (blobInfo, success) => {
-                        let params = {
-                            'file':blobInfo.blob(),
-                            'filename':blobInfo.filename(),
-                            'data':{biz:"jeditor",jeditor:"1"}
-                        };
-                        const uploadSuccess = (res)=>{
-                            if (res.success) {
-                                if(res.message == 'local'){
-                                    const img = 'data:image/jpeg;base64,' + blobInfo.base64()
-                                    success(img)
-                                }else{
-                                    let img = getFileAccessHttpUrl(res.message)
-                                    success(img)
-                                }
-                            }
-                        }
-                        uploadFile(params,uploadSuccess);
-                    },
-                    content_css:
-                        publicPath + 'resource/tinymce/skins/ui/' + skinName.value + '/content.min.css',
-                    ...options,
-                    setup: (editor: Editor) => {
-                        editorRef.value = editor;
-                        editor.on('init', (e) => initSetup(e));
-                    },
-                };
-            });
-
-            const disabled = computed(() => {
-                const { options } = props;
-                const getdDisabled = options && Reflect.get(options, 'readonly');
-                const editor = unref(editorRef);
-                // update-begin-author:taoyan date:20220407 for: 设置disabled，图片上传没有被禁用
-                if (editor) {
-                    editor.setMode(getdDisabled||(attrs.disabled === true)  ? 'readonly' : 'design');
-                }
-                if(attrs.disabled === true){
-                  return true;
-                }
-                // update-end-author:taoyan date:20220407 for: 设置disabled，图片上传没有被禁用
-                return getdDisabled ?? false;
-            });
-
-            watch(
-                () => attrs.disabled,
-                () => {
-                    const editor = unref(editorRef);
-                    if (!editor) {
-                        return;
-                    }
-                    editor.setMode(attrs.disabled ? 'readonly' : 'design');
-                }
-            );
-
-            onMountedOrActivated(() => {
-                if (!initOptions.value.inline) {
-                    tinymceId.value = buildShortUUID('tiny-vue');
-                }
-                nextTick(() => {
-                    setTimeout(() => {
-                        initEditor();
-                    }, 30);
-                });
-            });
-
-            onBeforeUnmount(() => {
-                destory();
-            });
-
-            onDeactivated(() => {
-                destory();
-            });
-
-            function destory() {
-                if (tinymce !== null) {
-                    tinymce?.remove?.(unref(initOptions).selector!);
-                }
-            }
-
-            function initEditor() {
-                const el = unref(elRef);
-                if (el) {
-                    el.style.visibility = '';
-                }
-                tinymce
-                    .init(unref(initOptions))
-                    .then((editor) => {
-                        emit('inited', editor);
-                    })
-                    .catch((err) => {
-                        emit('init-error', err);
-                    });
-            }
-
-            function initSetup(e) {
-                const editor = unref(editorRef);
-                if (!editor) {
-                    return;
-                }
-                const value = props.modelValue || '';
-
-                editor.setContent(value);
-                bindModelHandlers(editor);
-                bindHandlers(e, attrs, unref(editorRef));
-            }
-
-            function setValue(editor: Recordable, val: string, prevVal?: string) {
-                if (
-                    editor &&
-                    typeof val === 'string' &&
-                    val !== prevVal &&
-                    val !== editor.getContent({ format: attrs.outputFormat })
-                ) {
-                    editor.setContent(val);
-                }
-            }
-
-            function bindModelHandlers(editor: any) {
-                const modelEvents = attrs.modelEvents ? attrs.modelEvents : null;
-                const normalizedEvents = Array.isArray(modelEvents) ? modelEvents.join(' ') : modelEvents;
-
-                watch(
-                    () => props.modelValue,
-                    (val: string, prevVal: string) => {
-                        setValue(editor, val, prevVal);
-                    }
-                );
-
-                watch(
-                    () => props.value,
-                    (val: string, prevVal: string) => {
-                        setValue(editor, val, prevVal);
-                    },
-                    {
-                        immediate: true,
-                    }
-                );
-
-                editor.on(normalizedEvents ? normalizedEvents : 'change keyup undo redo', () => {
-                    const content = editor.getContent({ format: attrs.outputFormat });
-                    emit('update:modelValue', content);
-                    emit('change', content);
-                });
-
-                editor.on('FullscreenStateChanged', (e) => {
-                    fullscreen.value = e.state;
-                });
-            }
-
-            function handleImageUploading(name: string) {
-                const editor = unref(editorRef);
-                if (!editor) {
-                    return;
-                }
-                editor.execCommand('mceInsertContent', false, getUploadingImgName(name));
-                const content = editor?.getContent() ?? '';
-                setValue(editor, content);
-            }
-
-            function handleDone(name: string, url: string) {
-                const editor = unref(editorRef);
-                if (!editor) {
-                    return;
-                }
-                const content = editor?.getContent() ?? '';
-                const val = content?.replace(getUploadingImgName(name), `<img src="${url}"/>`) ?? '';
-                setValue(editor, val);
-            }
-
-            function getUploadingImgName(name: string) {
-                return `[uploading:${name}]`;
-            }
-
-            return {
-                prefixCls,
-                containerWidth,
-                initOptions,
-                tinymceContent,
-                elRef,
-                tinymceId,
-                handleImageUploading,
-                handleDone,
-                editorRef,
-                fullscreen,
-                disabled,
+      const initOptions = computed((): RawEditorSettings => {
+        const { height, options, toolbar, plugins, menubar } = props;
+        const publicPath = import.meta.env.VITE_PUBLIC_PATH || '/';
+        return {
+          selector: `#${unref(tinymceId)}`,
+          height,
+          toolbar,
+          menubar: menubar,
+          plugins,
+          language_url: publicPath + 'resource/tinymce/langs/' + langName.value + '.js',
+          language: langName.value,
+          branding: false,
+          default_link_target: '_blank',
+          link_title: false,
+          object_resizing: true,
+          toolbar_mode: 'sliding',
+          auto_focus: true,
+          toolbar_groups: true,
+          skin: skinName.value,
+          skin_url: publicPath + 'resource/tinymce/skins/ui/' + skinName.value,
+          images_upload_handler: (blobInfo, success) => {
+            let params = {
+              file: blobInfo.blob(),
+              filename: blobInfo.filename(),
+              data: { biz: 'jeditor', jeditor: '1' },
             };
-        },
-    });
+            const uploadSuccess = (res) => {
+              if (res.success) {
+                if (res.message == 'local') {
+                  const img = 'data:image/jpeg;base64,' + blobInfo.base64();
+                  success(img);
+                } else {
+                  let img = getFileAccessHttpUrl(res.message);
+                  success(img);
+                }
+              }
+            };
+            uploadFile(params, uploadSuccess);
+          },
+          content_css: publicPath + 'resource/tinymce/skins/ui/' + skinName.value + '/content.min.css',
+          ...options,
+          setup: (editor: Editor) => {
+            editorRef.value = editor;
+            editor.on('init', (e) => initSetup(e));
+          },
+        };
+      });
+
+      const disabled = computed(() => {
+        const { options } = props;
+        const getdDisabled = options && Reflect.get(options, 'readonly');
+        const editor = unref(editorRef);
+        // update-begin-author:taoyan date:20220407 for: 设置disabled，图片上传没有被禁用
+        if (editor) {
+          editor.setMode(getdDisabled || attrs.disabled === true ? 'readonly' : 'design');
+        }
+        if (attrs.disabled === true) {
+          return true;
+        }
+        // update-end-author:taoyan date:20220407 for: 设置disabled，图片上传没有被禁用
+        return getdDisabled ?? false;
+      });
+
+      watch(
+        () => attrs.disabled,
+        () => {
+          const editor = unref(editorRef);
+          if (!editor) {
+            return;
+          }
+          editor.setMode(attrs.disabled ? 'readonly' : 'design');
+        }
+      );
+
+      onMountedOrActivated(() => {
+        if (!initOptions.value.inline) {
+          tinymceId.value = buildShortUUID('tiny-vue');
+        }
+        nextTick(() => {
+          setTimeout(() => {
+            initEditor();
+          }, 30);
+        });
+      });
+
+      onBeforeUnmount(() => {
+        destory();
+      });
+
+      onDeactivated(() => {
+        destory();
+      });
+
+      function destory() {
+        if (tinymce !== null) {
+          tinymce?.remove?.(unref(initOptions).selector!);
+        }
+      }
+
+      function initEditor() {
+        const el = unref(elRef);
+        if (el) {
+          el.style.visibility = '';
+        }
+        tinymce
+          .init(unref(initOptions))
+          .then((editor) => {
+            emit('inited', editor);
+          })
+          .catch((err) => {
+            emit('init-error', err);
+          });
+      }
+
+      function initSetup(e) {
+        const editor = unref(editorRef);
+        if (!editor) {
+          return;
+        }
+        const value = props.modelValue || '';
+
+        editor.setContent(value);
+        bindModelHandlers(editor);
+        bindHandlers(e, attrs, unref(editorRef));
+      }
+
+      function setValue(editor: Recordable, val: string, prevVal?: string) {
+        if (editor && typeof val === 'string' && val !== prevVal && val !== editor.getContent({ format: attrs.outputFormat })) {
+          editor.setContent(val);
+        }
+      }
+
+      function bindModelHandlers(editor: any) {
+        const modelEvents = attrs.modelEvents ? attrs.modelEvents : null;
+        const normalizedEvents = Array.isArray(modelEvents) ? modelEvents.join(' ') : modelEvents;
+
+        watch(
+          () => props.modelValue,
+          (val: string, prevVal: string) => {
+            setValue(editor, val, prevVal);
+          }
+        );
+
+        watch(
+          () => props.value,
+          (val: string, prevVal: string) => {
+            setValue(editor, val, prevVal);
+          },
+          {
+            immediate: true,
+          }
+        );
+
+        editor.on(normalizedEvents ? normalizedEvents : 'change keyup undo redo', () => {
+          const content = editor.getContent({ format: attrs.outputFormat });
+          emit('update:modelValue', content);
+          emit('change', content);
+        });
+
+        editor.on('FullscreenStateChanged', (e) => {
+          fullscreen.value = e.state;
+        });
+      }
+
+      function handleImageUploading(name: string) {
+        const editor = unref(editorRef);
+        if (!editor) {
+          return;
+        }
+        editor.execCommand('mceInsertContent', false, getUploadingImgName(name));
+        const content = editor?.getContent() ?? '';
+        setValue(editor, content);
+      }
+
+      function handleDone(name: string, url: string) {
+        const editor = unref(editorRef);
+        if (!editor) {
+          return;
+        }
+        const content = editor?.getContent() ?? '';
+        const val = content?.replace(getUploadingImgName(name), `<img src="${url}"/>`) ?? '';
+        setValue(editor, val);
+      }
+
+      function getUploadingImgName(name: string) {
+        return `[uploading:${name}]`;
+      }
+
+      return {
+        prefixCls,
+        containerWidth,
+        initOptions,
+        tinymceContent,
+        elRef,
+        tinymceId,
+        handleImageUploading,
+        handleDone,
+        editorRef,
+        fullscreen,
+        disabled,
+      };
+    },
+  });
 </script>
 
 <style lang="less" scoped></style>
 
 <style lang="less">
-    @prefix-cls: ~'@{namespace}-tinymce-container';
+  @prefix-cls: ~'@{namespace}-tinymce-container';
 
-    .@{prefix-cls} {
-        position: relative;
-        line-height: normal;
+  .@{prefix-cls} {
+    position: relative;
+    line-height: normal;
 
-        textarea {
-            z-index: -1;
-            visibility: hidden;
-        }
+    textarea {
+      z-index: -1;
+      visibility: hidden;
     }
+  }
 </style>
diff --git a/src/components/Tinymce/src/ImgUpload.vue b/src/components/Tinymce/src/ImgUpload.vue
index f878709..b83eb9f 100644
--- a/src/components/Tinymce/src/ImgUpload.vue
+++ b/src/components/Tinymce/src/ImgUpload.vue
@@ -1,13 +1,6 @@
 <template>
   <div :class="[prefixCls, { fullscreen }]">
-    <Upload
-      name="file"
-      multiple
-      @change="handleChange"
-      :action="uploadUrl"
-      :showUploadList="false"
-      accept=".jpg,.jpeg,.gif,.png,.webp"
-    >
+    <Upload name="file" multiple @change="handleChange" :action="uploadUrl" :showUploadList="false" accept=".jpg,.jpeg,.gif,.png,.webp">
       <a-button type="primary" v-bind="{ ...getButtonProps }">
         {{ t('component.upload.imgUpload') }}
       </a-button>
diff --git a/src/components/Tinymce/src/tinymce.ts b/src/components/Tinymce/src/tinymce.ts
index 76f2ee5..6a3d97a 100644
--- a/src/components/Tinymce/src/tinymce.ts
+++ b/src/components/Tinymce/src/tinymce.ts
@@ -8,16 +8,13 @@ export const plugins = [
 ];
 
 export const toolbar =
-    'fullscreen code preview | undo redo | bold italic underline strikethrough | fontselect fontsizeselect formatselect | alignleft aligncenter alignright alignjustify | outdent indent lineheight|subscript superscript blockquote| numlist bullist checklist | forecolor backcolor casechange permanentpen formatpainter removeformat | pagebreak | charmap emoticons   | insertfile image media pageembed  link anchor  codesample insertdatetime hr| a11ycheck ltr rtl'
-;
+  'fullscreen code preview | undo redo | bold italic underline strikethrough | fontselect fontsizeselect formatselect | alignleft aligncenter alignright alignjustify | outdent indent lineheight|subscript superscript blockquote| numlist bullist checklist | forecolor backcolor casechange permanentpen formatpainter removeformat | pagebreak | charmap emoticons   | insertfile image media pageembed  link anchor  codesample insertdatetime hr| a11ycheck ltr rtl';
 
-export const simplePlugins = [
-  'lists image link media table textcolor wordcount contextmenu fullscreen',
-];
+export const simplePlugins = ['lists image link media table textcolor wordcount contextmenu fullscreen'];
 
 export const simpleToolbar = [
   'undo redo  formatselect bold italic alignleft aligncenter alignright alignjustify bullist numlist outdent indent',
-  'lists link unlink image media table removeformat fullscreen'
+  'lists link unlink image media table removeformat fullscreen',
 ];
 
 export const menubar = 'file edit insert view format table';
diff --git a/src/components/Transition/index.ts b/src/components/Transition/index.ts
index a14255e..55cbe54 100644
--- a/src/components/Transition/index.ts
+++ b/src/components/Transition/index.ts
@@ -16,12 +16,6 @@ export const SlideXReverseTransition = createSimpleTransition('slide-x-reverse-t
 export const ScrollXReverseTransition = createSimpleTransition('scroll-x-reverse-transition');
 export const ScaleRotateTransition = createSimpleTransition('scale-rotate-transition');
 
-export const ExpandXTransition = createJavascriptTransition(
-  'expand-x-transition',
-  ExpandTransitionGenerator('', true)
-);
+export const ExpandXTransition = createJavascriptTransition('expand-x-transition', ExpandTransitionGenerator('', true));
 
-export const ExpandTransition = createJavascriptTransition(
-  'expand-transition',
-  ExpandTransitionGenerator('')
-);
+export const ExpandTransition = createJavascriptTransition('expand-transition', ExpandTransitionGenerator(''));
diff --git a/src/components/Transition/src/CreateTransition.tsx b/src/components/Transition/src/CreateTransition.tsx
index ba5ee13..bad23b5 100644
--- a/src/components/Transition/src/CreateTransition.tsx
+++ b/src/components/Transition/src/CreateTransition.tsx
@@ -38,11 +38,7 @@ export function createSimpleTransition(name: string, origin = 'top center 0', mo
     },
   });
 }
-export function createJavascriptTransition(
-  name: string,
-  functions: Recordable,
-  mode: Mode = 'in-out'
-) {
+export function createJavascriptTransition(name: string, functions: Recordable, mode: Mode = 'in-out') {
   return defineComponent({
     name,
     props: {
diff --git a/src/components/Tree/src/Tree.vue b/src/components/Tree/src/Tree.vue
index 13cd562..149cfd2 100644
--- a/src/components/Tree/src/Tree.vue
+++ b/src/components/Tree/src/Tree.vue
@@ -1,493 +1,448 @@
 <script lang="tsx">
-    import type {ReplaceFields, Keys, CheckKeys, TreeActionType, TreeItem} from './typing';
+  import type { ReplaceFields, Keys, CheckKeys, TreeActionType, TreeItem } from './typing';
 
-    import {
-        defineComponent,
-        reactive,
-        computed,
-        unref,
-        ref,
-        watchEffect,
-        toRaw,
-        watch,
-        CSSProperties,
-        onMounted,
-    } from 'vue';
-    import {Tree, Empty} from 'ant-design-vue';
-    import {TreeIcon} from './TreeIcon';
-    import TreeHeader from './TreeHeader.vue';
-    import {ScrollContainer} from '/@/components/Container';
+  import { defineComponent, reactive, computed, unref, ref, watchEffect, toRaw, watch, CSSProperties, onMounted } from 'vue';
+  import { Tree, Empty } from 'ant-design-vue';
+  import { TreeIcon } from './TreeIcon';
+  import TreeHeader from './TreeHeader.vue';
+  import { ScrollContainer } from '/@/components/Container';
 
-    import {omit, get, difference} from 'lodash-es';
-    import {isArray, isBoolean, isFunction} from '/@/utils/is';
-    import {extendSlots, getSlot} from '/@/utils/helper/tsxHelper';
-    import {filter} from '/@/utils/helper/treeHelper';
+  import { omit, get, difference } from 'lodash-es';
+  import { isArray, isBoolean, isFunction } from '/@/utils/is';
+  import { extendSlots, getSlot } from '/@/utils/helper/tsxHelper';
+  import { filter } from '/@/utils/helper/treeHelper';
 
-    import {useTree} from './useTree';
-    import {useContextMenu} from '/@/hooks/web/useContextMenu';
-    import {useDesign} from '/@/hooks/web/useDesign';
+  import { useTree } from './useTree';
+  import { useContextMenu } from '/@/hooks/web/useContextMenu';
+  import { useDesign } from '/@/hooks/web/useDesign';
 
-    import {basicProps} from './props';
-    import {CreateContextOptions} from '/@/components/ContextMenu';
+  import { basicProps } from './props';
+  import { CreateContextOptions } from '/@/components/ContextMenu';
 
-    import {CheckEvent} from './typing';
+  import { CheckEvent } from './typing';
 
-    interface State {
-        expandedKeys: Keys;
-        selectedKeys: Keys;
-        checkedKeys: CheckKeys;
-        checkStrictly: boolean;
-    }
+  interface State {
+    expandedKeys: Keys;
+    selectedKeys: Keys;
+    checkedKeys: CheckKeys;
+    checkStrictly: boolean;
+  }
 
-    export default defineComponent({
-        name: 'BasicTree',
-        inheritAttrs: false,
-        props: basicProps,
-        emits: [
-            'update:expandedKeys',
-            'update:selectedKeys',
-            'update:value',
-            'change',
-            'check',
-            'search',
-            'update:searchValue',
-        ],
-        setup(props, {attrs, slots, emit, expose}) {
-            const state = reactive<State>({
-                checkStrictly: props.checkStrictly,
-                expandedKeys: props.expandedKeys || [],
-                selectedKeys: props.selectedKeys || [],
-                checkedKeys: props.checkedKeys || [],
-            });
+  export default defineComponent({
+    name: 'BasicTree',
+    inheritAttrs: false,
+    props: basicProps,
+    emits: ['update:expandedKeys', 'update:selectedKeys', 'update:value', 'change', 'check', 'search', 'update:searchValue'],
+    setup(props, { attrs, slots, emit, expose }) {
+      const state = reactive<State>({
+        checkStrictly: props.checkStrictly,
+        expandedKeys: props.expandedKeys || [],
+        selectedKeys: props.selectedKeys || [],
+        checkedKeys: props.checkedKeys || [],
+      });
 
-            const searchState = reactive({
-                startSearch: false,
-                searchData: [] as TreeItem[],
-            });
+      const searchState = reactive({
+        startSearch: false,
+        searchData: [] as TreeItem[],
+      });
 
-            const treeDataRef = ref<TreeItem[]>([]);
+      const treeDataRef = ref<TreeItem[]>([]);
 
-            const [createContextMenu] = useContextMenu();
-            const {prefixCls} = useDesign('basic-tree');
+      const [createContextMenu] = useContextMenu();
+      const { prefixCls } = useDesign('basic-tree');
 
-            const getReplaceFields = computed((): Required<ReplaceFields> => {
-                const {replaceFields} = props;
-                return {
-                    children: 'children',
-                    title: 'title',
-                    key: 'key',
-                    ...replaceFields,
-                };
-            });
+      const getReplaceFields = computed((): Required<ReplaceFields> => {
+        const { replaceFields } = props;
+        return {
+          children: 'children',
+          title: 'title',
+          key: 'key',
+          ...replaceFields,
+        };
+      });
 
-            const getBindValues = computed(() => {
-                let propsData = {
-                    blockNode: true,
-                    ...attrs,
-                    ...props,
-                    expandedKeys: state.expandedKeys,
-                    selectedKeys: state.selectedKeys,
-                    checkedKeys: state.checkedKeys,
-                    checkStrictly: state.checkStrictly,
-                    replaceFields: unref(getReplaceFields),
-                    'onUpdate:expandedKeys': (v: Keys) => {
-                        state.expandedKeys = v;
-                        emit('update:expandedKeys', v);
-                    },
-                    'onUpdate:selectedKeys': (v: Keys) => {
-                        state.selectedKeys = v;
-                        emit('update:selectedKeys', v);
-                    },
-                    onCheck: (v: CheckKeys, e: CheckEvent) => {
-                        let currentValue = toRaw(state.checkedKeys) as Keys;
-                        if (isArray(currentValue) && searchState.startSearch) {
-                            const {key} = unref(getReplaceFields);
-                            currentValue = difference(currentValue, getChildrenKeys(e.node.$attrs.node[key]));
-                            if (e.checked) {
-                                currentValue.push(e.node.$attrs.node[key]);
-                            }
-                            state.checkedKeys = currentValue;
-                        } else {
-                            state.checkedKeys = v;
-                        }
-
-                        const rawVal = toRaw(state.checkedKeys);
-                        emit('update:value', rawVal);
-                        emit('check', rawVal, e);
-                    },
-                    onRightClick: handleRightClick,
-                };
-                return omit(propsData, 'treeData', 'class');
-            });
-
-            const getTreeData = computed((): TreeItem[] =>
-                searchState.startSearch ? searchState.searchData : unref(treeDataRef),
-            );
-
-            const getNotFound = computed((): boolean => {
-                return !getTreeData.value || getTreeData.value.length === 0;
-            });
-
-            const {
-                deleteNodeByKey,
-                insertNodeByKey,
-                insertNodesByKey,
-                filterByLevel,
-                updateNodeByKey,
-                getAllKeys,
-                getChildrenKeys,
-                getEnabledKeys,
-            } = useTree(treeDataRef, getReplaceFields);
-
-            function getIcon(params: Recordable, icon?: string) {
-                if (!icon) {
-                    if (props.renderIcon && isFunction(props.renderIcon)) {
-                        return props.renderIcon(params);
-                    }
-                }
-                return icon;
+      const getBindValues = computed(() => {
+        let propsData = {
+          blockNode: true,
+          ...attrs,
+          ...props,
+          expandedKeys: state.expandedKeys,
+          selectedKeys: state.selectedKeys,
+          checkedKeys: state.checkedKeys,
+          checkStrictly: state.checkStrictly,
+          replaceFields: unref(getReplaceFields),
+          'onUpdate:expandedKeys': (v: Keys) => {
+            state.expandedKeys = v;
+            emit('update:expandedKeys', v);
+          },
+          'onUpdate:selectedKeys': (v: Keys) => {
+            state.selectedKeys = v;
+            emit('update:selectedKeys', v);
+          },
+          onCheck: (v: CheckKeys, e: CheckEvent) => {
+            let currentValue = toRaw(state.checkedKeys) as Keys;
+            if (isArray(currentValue) && searchState.startSearch) {
+              const { key } = unref(getReplaceFields);
+              currentValue = difference(currentValue, getChildrenKeys(e.node.$attrs.node[key]));
+              if (e.checked) {
+                currentValue.push(e.node.$attrs.node[key]);
+              }
+              state.checkedKeys = currentValue;
+            } else {
+              state.checkedKeys = v;
             }
 
-            async function handleRightClick({event, node}: Recordable) {
-                const {rightMenuList: menuList = [], beforeRightClick} = props;
-                let contextMenuOptions: CreateContextOptions = {event, items: []};
+            const rawVal = toRaw(state.checkedKeys);
+            emit('update:value', rawVal);
+            emit('check', rawVal, e);
+          },
+          onRightClick: handleRightClick,
+        };
+        return omit(propsData, 'treeData', 'class');
+      });
 
-                if (beforeRightClick && isFunction(beforeRightClick)) {
-                    let result = await beforeRightClick(node, event);
-                    if (Array.isArray(result)) {
-                        contextMenuOptions.items = result;
-                    } else {
-                        Object.assign(contextMenuOptions, result);
-                    }
-                } else {
-                    contextMenuOptions.items = menuList;
-                }
-                if (!contextMenuOptions.items?.length) return;
-                createContextMenu(contextMenuOptions);
+      const getTreeData = computed((): TreeItem[] => (searchState.startSearch ? searchState.searchData : unref(treeDataRef)));
+
+      const getNotFound = computed((): boolean => {
+        return !getTreeData.value || getTreeData.value.length === 0;
+      });
+
+      const { deleteNodeByKey, insertNodeByKey, insertNodesByKey, filterByLevel, updateNodeByKey, getAllKeys, getChildrenKeys, getEnabledKeys } = useTree(treeDataRef, getReplaceFields);
+
+      function getIcon(params: Recordable, icon?: string) {
+        if (!icon) {
+          if (props.renderIcon && isFunction(props.renderIcon)) {
+            return props.renderIcon(params);
+          }
+        }
+        return icon;
+      }
+
+      async function handleRightClick({ event, node }: Recordable) {
+        const { rightMenuList: menuList = [], beforeRightClick } = props;
+        let contextMenuOptions: CreateContextOptions = { event, items: [] };
+
+        if (beforeRightClick && isFunction(beforeRightClick)) {
+          let result = await beforeRightClick(node, event);
+          if (Array.isArray(result)) {
+            contextMenuOptions.items = result;
+          } else {
+            Object.assign(contextMenuOptions, result);
+          }
+        } else {
+          contextMenuOptions.items = menuList;
+        }
+        if (!contextMenuOptions.items?.length) return;
+        createContextMenu(contextMenuOptions);
+      }
+
+      function setExpandedKeys(keys: Keys) {
+        state.expandedKeys = keys;
+      }
+
+      function getExpandedKeys() {
+        return state.expandedKeys;
+      }
+
+      function setSelectedKeys(keys: Keys) {
+        state.selectedKeys = keys;
+      }
+
+      function getSelectedKeys() {
+        return state.selectedKeys;
+      }
+
+      function setCheckedKeys(keys: CheckKeys) {
+        state.checkedKeys = keys;
+      }
+
+      function getCheckedKeys() {
+        return state.checkedKeys;
+      }
+
+      function checkAll(checkAll: boolean) {
+        state.checkedKeys = checkAll ? getEnabledKeys() : ([] as Keys);
+      }
+
+      function expandAll(expandAll: boolean) {
+        state.expandedKeys = expandAll ? getAllKeys() : ([] as Keys);
+      }
+
+      function onStrictlyChange(strictly: boolean) {
+        state.checkStrictly = strictly;
+      }
+
+      const searchText = ref('');
+      watchEffect(() => {
+        if (props.searchValue !== searchText.value) searchText.value = props.searchValue;
+      });
+
+      function handleSearch(searchValue: string) {
+        if (searchValue !== searchText.value) searchText.value = searchValue;
+        emit('update:searchValue', searchValue);
+        if (!searchValue) {
+          searchState.startSearch = false;
+          return;
+        }
+        const { filterFn, checkable, expandOnSearch, checkOnSearch } = unref(props);
+        searchState.startSearch = true;
+        const { title: titleField, key: keyField } = unref(getReplaceFields);
+
+        const searchKeys: string[] = [];
+        searchState.searchData = filter(
+          unref(treeDataRef),
+          (node) => {
+            const result = filterFn ? filterFn(searchValue, node, unref(getReplaceFields)) : node[titleField]?.includes(searchValue) ?? false;
+            if (result) {
+              searchKeys.push(node[keyField]);
             }
+            return result;
+          },
+          unref(getReplaceFields)
+        );
 
-            function setExpandedKeys(keys: Keys) {
-                state.expandedKeys = keys;
-            }
+        if (expandOnSearch && searchKeys.length > 0) {
+          setExpandedKeys(searchKeys);
+        }
 
-            function getExpandedKeys() {
-                return state.expandedKeys;
-            }
+        if (checkOnSearch && checkable && searchKeys.length > 0) {
+          setCheckedKeys(searchKeys);
+        }
+      }
 
-            function setSelectedKeys(keys: Keys) {
-                state.selectedKeys = keys;
-            }
+      function handleClickNode(key: string, children: TreeItem[]) {
+        if (!props.clickRowToExpand || !children || children.length === 0) return;
+        if (!state.expandedKeys.includes(key)) {
+          setExpandedKeys([...state.expandedKeys, key]);
+        } else {
+          const keys = [...state.expandedKeys];
+          const index = keys.findIndex((item) => item === key);
+          if (index !== -1) {
+            keys.splice(index, 1);
+          }
+          setExpandedKeys(keys);
+        }
+      }
 
-            function getSelectedKeys() {
-                return state.selectedKeys;
-            }
+      watchEffect(() => {
+        treeDataRef.value = props.treeData as TreeItem[];
+        handleSearch(unref(searchText));
+      });
 
-            function setCheckedKeys(keys: CheckKeys) {
-                state.checkedKeys = keys;
-            }
+      onMounted(() => {
+        const level = parseInt(props.defaultExpandLevel);
+        if (level > 0) {
+          state.expandedKeys = filterByLevel(level);
+        } else if (props.defaultExpandAll) {
+          expandAll(true);
+        }
+      });
 
-            function getCheckedKeys() {
-                return state.checkedKeys;
-            }
+      watchEffect(() => {
+        state.expandedKeys = props.expandedKeys;
+      });
 
-            function checkAll(checkAll: boolean) {
-                state.checkedKeys = checkAll ? getEnabledKeys() : ([] as Keys);
-            }
+      watchEffect(() => {
+        state.selectedKeys = props.selectedKeys;
+      });
 
-            function expandAll(expandAll: boolean) {
-                state.expandedKeys = expandAll ? getAllKeys() : ([] as Keys);
-            }
+      watchEffect(() => {
+        state.checkedKeys = props.checkedKeys;
+      });
 
-            function onStrictlyChange(strictly: boolean) {
-                state.checkStrictly = strictly;
-            }
+      watch(
+        () => props.value,
+        () => {
+          state.checkedKeys = toRaw(props.value || []);
+        }
+      );
 
-            const searchText = ref('');
-            watchEffect(() => {
-                if (props.searchValue !== searchText.value) searchText.value = props.searchValue;
-            });
+      watch(
+        () => state.checkedKeys,
+        () => {
+          const v = toRaw(state.checkedKeys);
+          emit('update:value', v);
+          emit('change', v);
+        }
+      );
 
-            function handleSearch(searchValue: string) {
-                if (searchValue !== searchText.value) searchText.value = searchValue;
-                emit('update:searchValue', searchValue);
-                if (!searchValue) {
-                    searchState.startSearch = false;
-                    return;
-                }
-                const {filterFn, checkable, expandOnSearch, checkOnSearch} = unref(props);
-                searchState.startSearch = true;
-                const {title: titleField, key: keyField} = unref(getReplaceFields);
+      // watchEffect(() => {
+      //   console.log('======================');
+      //   console.log(props.value);
+      //   console.log('======================');
+      //   if (props.value) {
+      //     state.checkedKeys = props.value;
+      //   }
+      // });
 
-                const searchKeys: string[] = [];
-                searchState.searchData = filter(
-                    unref(treeDataRef),
-                    (node) => {
-                        const result = filterFn
-                            ? filterFn(searchValue, node, unref(getReplaceFields))
-                            : node[titleField]?.includes(searchValue) ?? false;
-                        if (result) {
-                            searchKeys.push(node[keyField]);
-                        }
-                        return result;
-                    },
-                    unref(getReplaceFields),
-                );
+      watchEffect(() => {
+        state.checkStrictly = props.checkStrictly;
+      });
 
-                if (expandOnSearch && searchKeys.length > 0) {
-                    setExpandedKeys(searchKeys);
-                }
+      const instance: TreeActionType = {
+        setExpandedKeys,
+        getExpandedKeys,
+        setSelectedKeys,
+        getSelectedKeys,
+        setCheckedKeys,
+        getCheckedKeys,
+        insertNodeByKey,
+        insertNodesByKey,
+        deleteNodeByKey,
+        updateNodeByKey,
+        checkAll,
+        expandAll,
+        filterByLevel: (level: number) => {
+          state.expandedKeys = filterByLevel(level);
+        },
+        setSearchValue: (value: string) => {
+          handleSearch(value);
+        },
+        getSearchValue: () => {
+          return searchText.value;
+        },
+      };
 
-                if (checkOnSearch && checkable && searchKeys.length > 0) {
-                    setCheckedKeys(searchKeys);
-                }
-            }
+      expose(instance);
 
-            function handleClickNode(key: string, children: TreeItem[]) {
-                if (!props.clickRowToExpand || !children || children.length === 0) return;
-                if (!state.expandedKeys.includes(key)) {
-                    setExpandedKeys([...state.expandedKeys, key]);
-                } else {
-                    const keys = [...state.expandedKeys];
-                    const index = keys.findIndex((item) => item === key);
-                    if (index !== -1) {
-                        keys.splice(index, 1);
-                    }
-                    setExpandedKeys(keys);
-                }
-            }
+      function renderAction(node: TreeItem) {
+        const { actionList } = props;
+        if (!actionList || actionList.length === 0) return;
+        return actionList.map((item, index) => {
+          let nodeShow = true;
+          if (isFunction(item.show)) {
+            nodeShow = item.show?.(node);
+          } else if (isBoolean(item.show)) {
+            nodeShow = item.show;
+          }
 
-            watchEffect(() => {
-                treeDataRef.value = props.treeData as TreeItem[];
-                handleSearch(unref(searchText));
-            });
+          if (!nodeShow) return null;
 
-            onMounted(() => {
-                const level = parseInt(props.defaultExpandLevel);
-                if (level > 0) {
-                    state.expandedKeys = filterByLevel(level);
-                } else if (props.defaultExpandAll) {
-                    expandAll(true);
-                }
-            });
-
-            watchEffect(() => {
-                state.expandedKeys = props.expandedKeys;
-            });
-
-            watchEffect(() => {
-                state.selectedKeys = props.selectedKeys;
-            });
-
-            watchEffect(() => {
-                state.checkedKeys = props.checkedKeys;
-            });
-
-            watch(
-                () => props.value,
-                () => {
-                    state.checkedKeys = toRaw(props.value || []);
-                },
-            );
-
-            watch(
-                () => state.checkedKeys,
-                () => {
-                    const v = toRaw(state.checkedKeys);
-                    emit('update:value', v);
-                    emit('change', v);
-                },
-            );
-
-            // watchEffect(() => {
-            //   console.log('======================');
-            //   console.log(props.value);
-            //   console.log('======================');
-            //   if (props.value) {
-            //     state.checkedKeys = props.value;
-            //   }
-            // });
-
-            watchEffect(() => {
-                state.checkStrictly = props.checkStrictly;
-            });
-
-            const instance: TreeActionType = {
-                setExpandedKeys,
-                getExpandedKeys,
-                setSelectedKeys,
-                getSelectedKeys,
-                setCheckedKeys,
-                getCheckedKeys,
-                insertNodeByKey,
-                insertNodesByKey,
-                deleteNodeByKey,
-                updateNodeByKey,
-                checkAll,
-                expandAll,
-                filterByLevel: (level: number) => {
-                    state.expandedKeys = filterByLevel(level);
-                },
-                setSearchValue: (value: string) => {
-                    handleSearch(value);
-                },
-                getSearchValue: () => {
-                    return searchText.value;
-                },
-            };
-
-            expose(instance);
-
-            function renderAction(node: TreeItem) {
-                const {actionList} = props;
-                if (!actionList || actionList.length === 0) return;
-                return actionList.map((item, index) => {
-                    let nodeShow = true;
-                    if (isFunction(item.show)) {
-                        nodeShow = item.show?.(node);
-                    } else if (isBoolean(item.show)) {
-                        nodeShow = item.show;
-                    }
-
-                    if (!nodeShow) return null;
-
-                    return (
-                        <span key={index} class={`${prefixCls}__action`}>
+          return (
+            <span key={index} class={`${prefixCls}__action`}>
               {item.render(node)}
             </span>
-                    );
-                });
-            }
+          );
+        });
+      }
 
-            function renderTreeNode({data, level}: { data: TreeItem[] | undefined; level: number }) {
-                if (!data) {
-                    return null;
-                }
-                return data.map((item) => {
-                    const {
-                        title: titleField,
-                        key: keyField,
-                        children: childrenField,
-                    } = unref(getReplaceFields);
+      function renderTreeNode({ data, level }: { data: TreeItem[] | undefined; level: number }) {
+        if (!data) {
+          return null;
+        }
+        return data.map((item) => {
+          const { title: titleField, key: keyField, children: childrenField } = unref(getReplaceFields);
 
-                    const propsData = omit(item, 'title');
-                    const icon = getIcon({...item, level}, item.icon);
-                    const children = get(item, childrenField) || [];
-                    return (
-                        <Tree.TreeNode {...propsData} node={toRaw(item)} key={get(item, keyField)}>
-                            {{
-                                title: () => (
-                                    <span
-                                        class={`${prefixCls}-title pl-2`}
-                                        onclick={handleClickNode.bind(null, item[keyField], item[childrenField])}
-                                    >
+          const propsData = omit(item, 'title');
+          const icon = getIcon({ ...item, level }, item.icon);
+          const children = get(item, childrenField) || [];
+          return (
+            <Tree.TreeNode {...propsData} node={toRaw(item)} key={get(item, keyField)}>
+              {{
+                title: () => (
+                  <span class={`${prefixCls}-title pl-2`} onclick={handleClickNode.bind(null, item[keyField], item[childrenField])}>
                     {slots?.title ? (
-                        getSlot(slots, 'title', item)
+                      getSlot(slots, 'title', item)
                     ) : (
-                        <>
-                            {icon && <TreeIcon icon={icon}/>}
-                            <span
-                                class={unref(getBindValues)?.blockNode ? `${prefixCls}__content` : ''}
-                            >
-                          {get(item, titleField)}
-                        </span>
-                            <span class={`${prefixCls}__actions`}>
-                          {renderAction({...item, level})}
-                        </span>
-                        </>
+                      <>
+                        {icon && <TreeIcon icon={icon} />}
+                        <span class={unref(getBindValues)?.blockNode ? `${prefixCls}__content` : ''}>{get(item, titleField)}</span>
+                        <span class={`${prefixCls}__actions`}>{renderAction({ ...item, level })}</span>
+                      </>
                     )}
                   </span>
-                                ),
-                                default: () => renderTreeNode({data: children, level: level + 1}),
-                            }}
-                        </Tree.TreeNode>
-                    );
-                });
-            }
+                ),
+                default: () => renderTreeNode({ data: children, level: level + 1 }),
+              }}
+            </Tree.TreeNode>
+          );
+        });
+      }
 
-            return () => {
-                const {title, helpMessage, toolbar, search, checkable} = props;
-                const showTitle = title || toolbar || search || slots.headerTitle;
-                const scrollStyle: CSSProperties = {height: 'calc(100% - 38px)'};
-                return (
-                    <div class={[prefixCls, 'h-full', attrs.class]}>
-                        {showTitle && (
-                            <TreeHeader
-                                checkable={checkable}
-                                checkAll={checkAll}
-                                expandAll={expandAll}
-                                title={title}
-                                search={search}
-                                toolbar={toolbar}
-                                helpMessage={helpMessage}
-                                onStrictlyChange={onStrictlyChange}
-                                onSearch={handleSearch}
-                                onClickSearch={$event => emit('search', $event)}
-                                searchText={unref(searchText)}
-                            >
-                                {extendSlots(slots)}
-                            </TreeHeader>
-                        )}
-                        <ScrollContainer style={scrollStyle} v-show={!unref(getNotFound)}>
-                            <Tree {...unref(getBindValues)} showIcon={false}>
-                                {{
-                                    // switcherIcon: () => <DownOutlined />,
-                                    default: () => renderTreeNode({data: unref(getTreeData), level: 1}),
-                                    ...extendSlots(slots),
-                                }}
-                            </Tree>
-                        </ScrollContainer>
+      return () => {
+        const { title, helpMessage, toolbar, search, checkable } = props;
+        const showTitle = title || toolbar || search || slots.headerTitle;
+        const scrollStyle: CSSProperties = { height: 'calc(100% - 38px)' };
+        return (
+          <div class={[prefixCls, 'h-full', attrs.class]}>
+            {showTitle && (
+              <TreeHeader
+                checkable={checkable}
+                checkAll={checkAll}
+                expandAll={expandAll}
+                title={title}
+                search={search}
+                toolbar={toolbar}
+                helpMessage={helpMessage}
+                onStrictlyChange={onStrictlyChange}
+                onSearch={handleSearch}
+                onClickSearch={($event) => emit('search', $event)}
+                searchText={unref(searchText)}
+              >
+                {extendSlots(slots)}
+              </TreeHeader>
+            )}
+            <ScrollContainer style={scrollStyle} v-show={!unref(getNotFound)}>
+              <Tree {...unref(getBindValues)} showIcon={false}>
+                {{
+                  // switcherIcon: () => <DownOutlined />,
+                  default: () => renderTreeNode({ data: unref(getTreeData), level: 1 }),
+                  ...extendSlots(slots),
+                }}
+              </Tree>
+            </ScrollContainer>
 
-                        <Empty v-show={unref(getNotFound)} image={Empty.PRESENTED_IMAGE_SIMPLE} class="!mt-4"/>
-                    </div>
-                );
-            };
-        },
-    });
+            <Empty v-show={unref(getNotFound)} image={Empty.PRESENTED_IMAGE_SIMPLE} class="!mt-4" />
+          </div>
+        );
+      };
+    },
+  });
 </script>
 <style lang="less">
-    @prefix-cls: ~'@{namespace}-basic-tree';
+  @prefix-cls: ~'@{namespace}-basic-tree';
 
-    .@{prefix-cls} {
-        background-color: @component-background;
+  .@{prefix-cls} {
+    background-color: @component-background;
 
-        .ant-tree-node-content-wrapper {
-            position: relative;
+    .ant-tree-node-content-wrapper {
+      position: relative;
 
-            .ant-tree-title {
-                position: absolute;
-                left: 0;
-                width: 100%;
-            }
-        }
-
-        &-title {
-            position: relative;
-            display: flex;
-            align-items: center;
-            width: 100%;
-            padding-right: 10px;
-
-            &:hover {
-                .@{prefix-cls}__action {
-                    visibility: visible;
-                }
-            }
-        }
-
-        &__content {
-            overflow: hidden;
-        }
-
-        &__actions {
-            position: absolute;
-            top: 2px;
-            right: 3px;
-            display: flex;
-        }
-
-        &__action {
-            margin-left: 4px;
-            visibility: hidden;
-        }
+      .ant-tree-title {
+        position: absolute;
+        left: 0;
+        width: 100%;
+      }
     }
+
+    &-title {
+      position: relative;
+      display: flex;
+      align-items: center;
+      width: 100%;
+      padding-right: 10px;
+
+      &:hover {
+        .@{prefix-cls}__action {
+          visibility: visible;
+        }
+      }
+    }
+
+    &__content {
+      overflow: hidden;
+    }
+
+    &__actions {
+      position: absolute;
+      top: 2px;
+      right: 3px;
+      display: flex;
+    }
+
+    &__action {
+      margin-left: 4px;
+      visibility: hidden;
+    }
+  }
 </style>
diff --git a/src/components/Tree/src/TreeHeader.vue b/src/components/Tree/src/TreeHeader.vue
index 6929008..e6b1e02 100644
--- a/src/components/Tree/src/TreeHeader.vue
+++ b/src/components/Tree/src/TreeHeader.vue
@@ -7,23 +7,17 @@
 
     <div class="flex flex-1 justify-end items-center cursor-pointer" v-if="search || toolbar">
       <div :class="getInputSearchCls" v-if="search">
-        <InputSearch
-                :placeholder="t('common.searchText')"
-                size="small"
-                allowClear
-                v-model:value="searchValue"
-                @search="$emit('clickSearch',$event)"
-        />
+        <InputSearch :placeholder="t('common.searchText')" size="small" allowClear v-model:value="searchValue" @search="$emit('clickSearch', $event)" />
       </div>
       <Dropdown @click.prevent v-if="toolbar">
-        <Icon icon="ion:ellipsis-vertical"/>
+        <Icon icon="ion:ellipsis-vertical" />
         <template #overlay>
           <Menu @click="handleMenuClick">
             <template v-for="item in toolbarList" :key="item.value">
               <MenuItem v-bind="{ key: item.value }">
                 {{ item.label }}
               </MenuItem>
-              <MenuDivider v-if="item.divider"/>
+              <MenuDivider v-if="item.divider" />
             </template>
           </Menu>
         </template>
@@ -32,17 +26,17 @@
   </div>
 </template>
 <script lang="ts">
-  import  {PropType} from 'vue';
-  import {defineComponent, computed, ref, watch} from 'vue';
+  import { PropType } from 'vue';
+  import { defineComponent, computed, ref, watch } from 'vue';
 
-  import {Dropdown, Menu, Input} from 'ant-design-vue';
-  import {Icon} from '/@/components/Icon';
-  import {BasicTitle} from '/@/components/Basic';
+  import { Dropdown, Menu, Input } from 'ant-design-vue';
+  import { Icon } from '/@/components/Icon';
+  import { BasicTitle } from '/@/components/Basic';
 
-  import {propTypes} from '/@/utils/propTypes';
+  import { propTypes } from '/@/utils/propTypes';
 
-  import {useI18n} from '/@/hooks/web/useI18n';
-  import {useDebounceFn} from '@vueuse/core';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  import { useDebounceFn } from '@vueuse/core';
 
   enum ToolbarEnum {
     SELECT_ALL,
@@ -83,7 +77,7 @@
     },
     emits: ['strictly-change', 'search', 'clickSearch'],
     setup(props, { emit, slots }) {
-      const {t} = useI18n();
+      const { t } = useI18n();
       const searchValue = ref('');
       const getInputSearchCls = computed(() => {
         const titleExists = slots.headerTitle || props.title;
@@ -97,9 +91,9 @@
         ];
       });
       const toolbarList = computed(() => {
-        const {checkable} = props;
+        const { checkable } = props;
         const defaultToolbarList = [
-          {label: t('component.tree.expandAll'), value: ToolbarEnum.EXPAND_ALL},
+          { label: t('component.tree.expandAll'), value: ToolbarEnum.EXPAND_ALL },
           {
             label: t('component.tree.unExpandAll'),
             value: ToolbarEnum.UN_EXPAND_ALL,
@@ -109,21 +103,21 @@
 
         return checkable
           ? [
-            {label: t('component.tree.selectAll'), value: ToolbarEnum.SELECT_ALL},
-            {
-              label: t('component.tree.unSelectAll'),
-              value: ToolbarEnum.UN_SELECT_ALL,
-              divider: checkable,
-            },
-            ...defaultToolbarList,
-            {label: t('component.tree.checkStrictly'), value: ToolbarEnum.CHECK_STRICTLY},
-            {label: t('component.tree.checkUnStrictly'), value: ToolbarEnum.CHECK_UN_STRICTLY},
-          ]
+              { label: t('component.tree.selectAll'), value: ToolbarEnum.SELECT_ALL },
+              {
+                label: t('component.tree.unSelectAll'),
+                value: ToolbarEnum.UN_SELECT_ALL,
+                divider: checkable,
+              },
+              ...defaultToolbarList,
+              { label: t('component.tree.checkStrictly'), value: ToolbarEnum.CHECK_STRICTLY },
+              { label: t('component.tree.checkUnStrictly'), value: ToolbarEnum.CHECK_UN_STRICTLY },
+            ]
           : defaultToolbarList;
       });
 
       function handleMenuClick(e: MenuInfo) {
-        const {key} = e;
+        const { key } = e;
         switch (key) {
           case ToolbarEnum.SELECT_ALL:
             props.checkAll?.(true);
@@ -170,7 +164,7 @@
       //   debounceEmitChange(e.target.value);
       // }
 
-      return {t, toolbarList, handleMenuClick, searchValue,getInputSearchCls};
+      return { t, toolbarList, handleMenuClick, searchValue, getInputSearchCls };
     },
   });
 </script>
diff --git a/src/components/Tree/src/props.ts b/src/components/Tree/src/props.ts
index d8cfabd..e6f6d73 100644
--- a/src/components/Tree/src/props.ts
+++ b/src/components/Tree/src/props.ts
@@ -1,12 +1,5 @@
 import type { PropType } from 'vue';
-import type {
-  ReplaceFields,
-  ActionItem,
-  Keys,
-  CheckKeys,
-  ContextMenuOptions,
-  TreeItem,
-} from './typing';
+import type { ReplaceFields, ActionItem, Keys, CheckKeys, ContextMenuOptions, TreeItem } from './typing';
 import type { ContextMenuItem } from '/@/hooks/web/useContextMenu';
 import type { TreeDataItem } from 'ant-design-vue/es/tree/Tree';
 import { propTypes } from '/@/utils/propTypes';
@@ -80,9 +73,7 @@ export const basicProps = {
   },
   // 自定义数据过滤判断方法(注: 不是整个过滤方法，而是内置过滤的判断方法，用于增强原本仅能通过title进行过滤的方式)
   filterFn: {
-    type: Function as PropType<
-      (searchValue: any, node: TreeItem, replaceFields: ReplaceFields) => boolean
-      >,
+    type: Function as PropType<(searchValue: any, node: TreeItem, replaceFields: ReplaceFields) => boolean>,
     default: null,
   },
   // 搜索完成时自动展开结果
diff --git a/src/components/Tree/src/typing.ts b/src/components/Tree/src/typing.ts
index 315b067..c606d4d 100644
--- a/src/components/Tree/src/typing.ts
+++ b/src/components/Tree/src/typing.ts
@@ -1,55 +1,53 @@
-import type {TreeDataItem, CheckEvent as CheckEventOrigin} from 'ant-design-vue/es/tree/Tree';
-import {ContextMenuItem} from '/@/hooks/web/useContextMenu';
+import type { TreeDataItem, CheckEvent as CheckEventOrigin } from 'ant-design-vue/es/tree/Tree';
+import { ContextMenuItem } from '/@/hooks/web/useContextMenu';
 
 export interface ActionItem {
-    render: (record: Recordable) => any;
-    show?: boolean | ((record: Recordable) => boolean);
+  render: (record: Recordable) => any;
+  show?: boolean | ((record: Recordable) => boolean);
 }
 
 export interface TreeItem extends TreeDataItem {
-    icon?: any;
+  icon?: any;
 }
 
 export interface ReplaceFields {
-    children?: string;
-    title?: string;
-    key?: string;
+  children?: string;
+  title?: string;
+  key?: string;
 }
 
 export type Keys = (string | number)[];
-export type CheckKeys =
-    | (string | number)[]
-    | { checked: (string | number)[]; halfChecked: (string | number)[] };
+export type CheckKeys = (string | number)[] | { checked: (string | number)[]; halfChecked: (string | number)[] };
 
 export interface TreeActionType {
-    checkAll: (checkAll: boolean) => void;
-    expandAll: (expandAll: boolean) => void;
-    setExpandedKeys: (keys: Keys) => void;
-    getExpandedKeys: () => Keys;
-    setSelectedKeys: (keys: Keys) => void;
-    getSelectedKeys: () => Keys;
-    setCheckedKeys: (keys: CheckKeys) => void;
-    getCheckedKeys: () => CheckKeys;
-    filterByLevel: (level: number) => void;
-    insertNodeByKey: (opt: InsertNodeParams) => void;
-    insertNodesByKey: (opt: InsertNodeParams) => void;
-    deleteNodeByKey: (key: string) => void;
-    updateNodeByKey: (key: string, node: Omit<TreeDataItem, 'key'>) => void;
-    setSearchValue: (value: string) => void;
-    getSearchValue: () => string;
+  checkAll: (checkAll: boolean) => void;
+  expandAll: (expandAll: boolean) => void;
+  setExpandedKeys: (keys: Keys) => void;
+  getExpandedKeys: () => Keys;
+  setSelectedKeys: (keys: Keys) => void;
+  getSelectedKeys: () => Keys;
+  setCheckedKeys: (keys: CheckKeys) => void;
+  getCheckedKeys: () => CheckKeys;
+  filterByLevel: (level: number) => void;
+  insertNodeByKey: (opt: InsertNodeParams) => void;
+  insertNodesByKey: (opt: InsertNodeParams) => void;
+  deleteNodeByKey: (key: string) => void;
+  updateNodeByKey: (key: string, node: Omit<TreeDataItem, 'key'>) => void;
+  setSearchValue: (value: string) => void;
+  getSearchValue: () => string;
 }
 
 export interface InsertNodeParams {
-    parentKey: string | null;
-    node: TreeDataItem;
-    list?: TreeDataItem[];
-    push?: 'push' | 'unshift';
+  parentKey: string | null;
+  node: TreeDataItem;
+  list?: TreeDataItem[];
+  push?: 'push' | 'unshift';
 }
 
 export interface ContextMenuOptions {
-    icon?: string;
-    styles?: any;
-    items?: ContextMenuItem[];
+  icon?: string;
+  styles?: any;
+  items?: ContextMenuItem[];
 }
 
 export type CheckEvent = CheckEventOrigin;
diff --git a/src/components/Tree/src/useTree.ts b/src/components/Tree/src/useTree.ts
index f0bf2b5..1ba6f69 100644
--- a/src/components/Tree/src/useTree.ts
+++ b/src/components/Tree/src/useTree.ts
@@ -1,195 +1,192 @@
-import type {InsertNodeParams, Keys, ReplaceFields} from './typing';
-import type {Ref, ComputedRef} from 'vue';
-import type {TreeDataItem} from 'ant-design-vue/es/tree/Tree';
+import type { InsertNodeParams, Keys, ReplaceFields } from './typing';
+import type { Ref, ComputedRef } from 'vue';
+import type { TreeDataItem } from 'ant-design-vue/es/tree/Tree';
 
-import {cloneDeep} from 'lodash-es';
-import {unref} from 'vue';
-import {forEach} from '/@/utils/helper/treeHelper';
+import { cloneDeep } from 'lodash-es';
+import { unref } from 'vue';
+import { forEach } from '/@/utils/helper/treeHelper';
 
-export function useTree(
-    treeDataRef: Ref<TreeDataItem[]>,
-    getReplaceFields: ComputedRef<ReplaceFields>
-) {
-    function getAllKeys(list?: TreeDataItem[]) {
-        const keys: string[] = [];
-        const treeData = list || unref(treeDataRef);
-        const {key: keyField, children: childrenField} = unref(getReplaceFields);
-        if (!childrenField || !keyField) return keys;
+export function useTree(treeDataRef: Ref<TreeDataItem[]>, getReplaceFields: ComputedRef<ReplaceFields>) {
+  function getAllKeys(list?: TreeDataItem[]) {
+    const keys: string[] = [];
+    const treeData = list || unref(treeDataRef);
+    const { key: keyField, children: childrenField } = unref(getReplaceFields);
+    if (!childrenField || !keyField) return keys;
 
-        for (let index = 0; index < treeData.length; index++) {
-            const node = treeData[index];
-            keys.push(node[keyField]!);
-            const children = node[childrenField];
-            if (children && children.length) {
-                keys.push(...(getAllKeys(children) as string[]));
-            }
-        }
-        return keys as Keys;
+    for (let index = 0; index < treeData.length; index++) {
+      const node = treeData[index];
+      keys.push(node[keyField]!);
+      const children = node[childrenField];
+      if (children && children.length) {
+        keys.push(...(getAllKeys(children) as string[]));
+      }
     }
+    return keys as Keys;
+  }
 
-    // get keys that can be checked and selected
-    function getEnabledKeys(list?: TreeDataItem[]) {
-        const keys: string[] = [];
-        const treeData = list || unref(treeDataRef);
-        const {key: keyField, children: childrenField} = unref(getReplaceFields);
-        if (!childrenField || !keyField) return keys;
+  // get keys that can be checked and selected
+  function getEnabledKeys(list?: TreeDataItem[]) {
+    const keys: string[] = [];
+    const treeData = list || unref(treeDataRef);
+    const { key: keyField, children: childrenField } = unref(getReplaceFields);
+    if (!childrenField || !keyField) return keys;
 
-        for (let index = 0; index < treeData.length; index++) {
-            const node = treeData[index];
-            node.disabled !== true && node.selectable !== false && keys.push(node[keyField]!);
-            const children = node[childrenField];
-            if (children && children.length) {
-                keys.push(...(getEnabledKeys(children) as string[]));
-            }
-        }
-        return keys as Keys;
+    for (let index = 0; index < treeData.length; index++) {
+      const node = treeData[index];
+      node.disabled !== true && node.selectable !== false && keys.push(node[keyField]!);
+      const children = node[childrenField];
+      if (children && children.length) {
+        keys.push(...(getEnabledKeys(children) as string[]));
+      }
     }
+    return keys as Keys;
+  }
 
-    function getChildrenKeys(nodeKey: string | number, list?: TreeDataItem[]): Keys {
-        const keys: Keys = [];
-        const treeData = list || unref(treeDataRef);
-        const {key: keyField, children: childrenField} = unref(getReplaceFields);
-        if (!childrenField || !keyField) return keys;
-        for (let index = 0; index < treeData.length; index++) {
-            const node = treeData[index];
-            const children = node[childrenField];
-            if (nodeKey === node[keyField]) {
-                keys.push(node[keyField]!);
-                if (children && children.length) {
-                    keys.push(...(getAllKeys(children) as string[]));
-                }
-            } else {
-                if (children && children.length) {
-                    keys.push(...getChildrenKeys(nodeKey, children));
-                }
-            }
+  function getChildrenKeys(nodeKey: string | number, list?: TreeDataItem[]): Keys {
+    const keys: Keys = [];
+    const treeData = list || unref(treeDataRef);
+    const { key: keyField, children: childrenField } = unref(getReplaceFields);
+    if (!childrenField || !keyField) return keys;
+    for (let index = 0; index < treeData.length; index++) {
+      const node = treeData[index];
+      const children = node[childrenField];
+      if (nodeKey === node[keyField]) {
+        keys.push(node[keyField]!);
+        if (children && children.length) {
+          keys.push(...(getAllKeys(children) as string[]));
         }
-        return keys as Keys;
+      } else {
+        if (children && children.length) {
+          keys.push(...getChildrenKeys(nodeKey, children));
+        }
+      }
     }
+    return keys as Keys;
+  }
 
-    // Update node
-    function updateNodeByKey(key: string, node: TreeDataItem, list?: TreeDataItem[]) {
-        if (!key) return;
-        const treeData = list || unref(treeDataRef);
-        const {key: keyField, children: childrenField} = unref(getReplaceFields);
+  // Update node
+  function updateNodeByKey(key: string, node: TreeDataItem, list?: TreeDataItem[]) {
+    if (!key) return;
+    const treeData = list || unref(treeDataRef);
+    const { key: keyField, children: childrenField } = unref(getReplaceFields);
 
-        if (!childrenField || !keyField) return;
+    if (!childrenField || !keyField) return;
 
-        for (let index = 0; index < treeData.length; index++) {
-            const element: any = treeData[index];
-            const children = element[childrenField];
+    for (let index = 0; index < treeData.length; index++) {
+      const element: any = treeData[index];
+      const children = element[childrenField];
 
-            if (element[keyField] === key) {
-                treeData[index] = {...treeData[index], ...node};
-                break;
-            } else if (children && children.length) {
-                updateNodeByKey(key, node, element[childrenField]);
-            }
-        }
+      if (element[keyField] === key) {
+        treeData[index] = { ...treeData[index], ...node };
+        break;
+      } else if (children && children.length) {
+        updateNodeByKey(key, node, element[childrenField]);
+      }
     }
+  }
 
-    // Expand the specified level
-    function filterByLevel(level = 1, list?: TreeDataItem[], currentLevel = 1) {
-        if (!level) {
-            return [];
-        }
-        const res: (string | number)[] = [];
-        const data = list || unref(treeDataRef) || [];
-        for (let index = 0; index < data.length; index++) {
-            const item = data[index];
-
-            const {key: keyField, children: childrenField} = unref(getReplaceFields);
-            const key = keyField ? item[keyField] : '';
-            const children = childrenField ? item[childrenField] : [];
-            res.push(key);
-            if (children && children.length && currentLevel < level) {
-                currentLevel += 1;
-                res.push(...filterByLevel(level, children, currentLevel));
-            }
-        }
-        return res as string[] | number[];
+  // Expand the specified level
+  function filterByLevel(level = 1, list?: TreeDataItem[], currentLevel = 1) {
+    if (!level) {
+      return [];
     }
+    const res: (string | number)[] = [];
+    const data = list || unref(treeDataRef) || [];
+    for (let index = 0; index < data.length; index++) {
+      const item = data[index];
 
-    /**
-     * 添加节点
-     */
-    function insertNodeByKey({parentKey = null, node, push = 'push'}: InsertNodeParams) {
-        const treeData: any = cloneDeep(unref(treeDataRef));
-        if (!parentKey) {
-            treeData[push](node);
-            treeDataRef.value = treeData;
-            return;
-        }
-        const {key: keyField, children: childrenField} = unref(getReplaceFields);
-        if (!childrenField || !keyField) return;
-
-        forEach(treeData, (treeItem) => {
-            if (treeItem[keyField] === parentKey) {
-                treeItem[childrenField] = treeItem[childrenField] || [];
-                treeItem[childrenField][push](node);
-                return true;
-            }
-        });
-        treeDataRef.value = treeData;
+      const { key: keyField, children: childrenField } = unref(getReplaceFields);
+      const key = keyField ? item[keyField] : '';
+      const children = childrenField ? item[childrenField] : [];
+      res.push(key);
+      if (children && children.length && currentLevel < level) {
+        currentLevel += 1;
+        res.push(...filterByLevel(level, children, currentLevel));
+      }
     }
+    return res as string[] | number[];
+  }
 
-    /**
-     * 批量添加节点
-     */
-    function insertNodesByKey({parentKey = null, list, push = 'push'}: InsertNodeParams) {
-        const treeData: any = cloneDeep(unref(treeDataRef));
-        if (!list || list.length < 1) {
-            return;
-        }
-        if (!parentKey) {
-            for (let i = 0; i < list.length; i++) {
-                treeData[push](list[i]);
-            }
-        } else {
-            const {key: keyField, children: childrenField} = unref(getReplaceFields);
-            if (!childrenField || !keyField) return;
-
-            forEach(treeData, (treeItem) => {
-                if (treeItem[keyField] === parentKey) {
-                    treeItem[childrenField] = treeItem[childrenField] || [];
-                    for (let i = 0; i < list.length; i++) {
-                        treeItem[childrenField][push](list[i]);
-                    }
-                    treeDataRef.value = treeData;
-                    return true;
-                }
-            });
-        }
+  /**
+   * 添加节点
+   */
+  function insertNodeByKey({ parentKey = null, node, push = 'push' }: InsertNodeParams) {
+    const treeData: any = cloneDeep(unref(treeDataRef));
+    if (!parentKey) {
+      treeData[push](node);
+      treeDataRef.value = treeData;
+      return;
     }
+    const { key: keyField, children: childrenField } = unref(getReplaceFields);
+    if (!childrenField || !keyField) return;
 
-    // Delete node
-    function deleteNodeByKey(key: string, list?: TreeDataItem[]) {
-        if (!key) return;
-        const treeData = list || unref(treeDataRef);
-        const {key: keyField, children: childrenField} = unref(getReplaceFields);
-        if (!childrenField || !keyField) return;
+    forEach(treeData, (treeItem) => {
+      if (treeItem[keyField] === parentKey) {
+        treeItem[childrenField] = treeItem[childrenField] || [];
+        treeItem[childrenField][push](node);
+        return true;
+      }
+    });
+    treeDataRef.value = treeData;
+  }
 
-        for (let index = 0; index < treeData.length; index++) {
-            const element: any = treeData[index];
-            const children = element[childrenField];
-
-            if (element[keyField] === key) {
-                treeData.splice(index, 1);
-                break;
-            } else if (children && children.length) {
-                deleteNodeByKey(key, element[childrenField]);
-            }
-        }
+  /**
+   * 批量添加节点
+   */
+  function insertNodesByKey({ parentKey = null, list, push = 'push' }: InsertNodeParams) {
+    const treeData: any = cloneDeep(unref(treeDataRef));
+    if (!list || list.length < 1) {
+      return;
     }
+    if (!parentKey) {
+      for (let i = 0; i < list.length; i++) {
+        treeData[push](list[i]);
+      }
+    } else {
+      const { key: keyField, children: childrenField } = unref(getReplaceFields);
+      if (!childrenField || !keyField) return;
 
-    return {
-        deleteNodeByKey,
-        insertNodeByKey,
-        insertNodesByKey,
-        filterByLevel,
-        updateNodeByKey,
-        getAllKeys,
-        getChildrenKeys,
-        getEnabledKeys,
-    };
+      forEach(treeData, (treeItem) => {
+        if (treeItem[keyField] === parentKey) {
+          treeItem[childrenField] = treeItem[childrenField] || [];
+          for (let i = 0; i < list.length; i++) {
+            treeItem[childrenField][push](list[i]);
+          }
+          treeDataRef.value = treeData;
+          return true;
+        }
+      });
+    }
+  }
+
+  // Delete node
+  function deleteNodeByKey(key: string, list?: TreeDataItem[]) {
+    if (!key) return;
+    const treeData = list || unref(treeDataRef);
+    const { key: keyField, children: childrenField } = unref(getReplaceFields);
+    if (!childrenField || !keyField) return;
+
+    for (let index = 0; index < treeData.length; index++) {
+      const element: any = treeData[index];
+      const children = element[childrenField];
+
+      if (element[keyField] === key) {
+        treeData.splice(index, 1);
+        break;
+      } else if (children && children.length) {
+        deleteNodeByKey(key, element[childrenField]);
+      }
+    }
+  }
+
+  return {
+    deleteNodeByKey,
+    insertNodeByKey,
+    insertNodesByKey,
+    filterByLevel,
+    updateNodeByKey,
+    getAllKeys,
+    getChildrenKeys,
+    getEnabledKeys,
+  };
 }
diff --git a/src/components/Upload/src/BasicUpload.vue b/src/components/Upload/src/BasicUpload.vue
index 4d0407a..7e2f4c5 100644
--- a/src/components/Upload/src/BasicUpload.vue
+++ b/src/components/Upload/src/BasicUpload.vue
@@ -20,20 +20,9 @@
       </Tooltip>
     </a-button-group>
 
-    <UploadModal
-      v-bind="bindValue"
-      :previewFileList="fileList"
-      @register="registerUploadModal"
-      @change="handleChange"
-      @delete="handleDelete"
-    />
+    <UploadModal v-bind="bindValue" :previewFileList="fileList" @register="registerUploadModal" @change="handleChange" @delete="handleDelete" />
 
-    <UploadPreviewModal
-      :value="fileList"
-      @register="registerPreviewModal"
-      @list-change="handlePreviewChange"
-      @delete="handlePreviewDelete"
-    />
+    <UploadPreviewModal :value="fileList" @register="registerPreviewModal" @list-change="handlePreviewChange" @delete="handlePreviewDelete" />
   </div>
 </template>
 <script lang="ts">
diff --git a/src/components/Upload/src/FileList.vue b/src/components/Upload/src/FileList.vue
index 62b1870..19ffb57 100644
--- a/src/components/Upload/src/FileList.vue
+++ b/src/components/Upload/src/FileList.vue
@@ -53,9 +53,7 @@
                       const render = customRender && isFunction(customRender);
                       return (
                         <td class={['file-table-td', align]} key={dataIndex}>
-                          {render
-                            ? customRender?.({ text: record[dataIndex], record })
-                            : record[dataIndex]}
+                          {render ? customRender?.({ text: record[dataIndex], record }) : record[dataIndex]}
                         </td>
                       );
                     })}
diff --git a/src/components/Upload/src/UploadModal.vue b/src/components/Upload/src/UploadModal.vue
index 4721d96..777932e 100644
--- a/src/components/Upload/src/UploadModal.vue
+++ b/src/components/Upload/src/UploadModal.vue
@@ -1,25 +1,20 @@
 <template>
   <BasicModal
-          width="800px"
-          :title="t('component.upload.upload')"
-          :okText="t('component.upload.save')"
-          v-bind="$attrs"
-          @register="register"
-          @ok="handleOk"
-          :closeFunc="handleCloseFunc"
-          :maskClosable="false"
-          :keyboard="false"
-          wrapClassName="upload-modal"
-          :okButtonProps="getOkButtonProps"
-          :cancelButtonProps="{ disabled: isUploadingRef }"
+    width="800px"
+    :title="t('component.upload.upload')"
+    :okText="t('component.upload.save')"
+    v-bind="$attrs"
+    @register="register"
+    @ok="handleOk"
+    :closeFunc="handleCloseFunc"
+    :maskClosable="false"
+    :keyboard="false"
+    wrapClassName="upload-modal"
+    :okButtonProps="getOkButtonProps"
+    :cancelButtonProps="{ disabled: isUploadingRef }"
   >
     <template #centerFooter>
-      <a-button
-              @click="handleStartUpload"
-              color="success"
-              :disabled="!getIsSelectFile"
-              :loading="isUploadingRef"
-      >
+      <a-button @click="handleStartUpload" color="success" :disabled="!getIsSelectFile" :loading="isUploadingRef">
         {{ getUploadBtnText }}
       </a-button>
     </template>
@@ -27,12 +22,7 @@
     <div class="upload-modal-toolbar">
       <Alert :message="getHelpText" type="info" banner class="upload-modal-toolbar__text" />
 
-      <Upload
-              :accept="getStringAccept"
-              :multiple="multiple"
-              :before-upload="beforeUpload"
-              class="upload-modal-toolbar__btn"
-      >
+      <Upload :accept="getStringAccept" :multiple="multiple" :before-upload="beforeUpload" class="upload-modal-toolbar__btn">
         <a-button type="primary">
           {{ t('component.upload.choose') }}
         </a-button>
@@ -94,30 +84,19 @@
       const { createMessage } = useMessage();
 
       const getIsSelectFile = computed(() => {
-        return (
-                fileListRef.value.length > 0 &&
-                !fileListRef.value.every((item) => item.status === UploadResultStatus.SUCCESS)
-        );
+        return fileListRef.value.length > 0 && !fileListRef.value.every((item) => item.status === UploadResultStatus.SUCCESS);
       });
 
       const getOkButtonProps = computed(() => {
-        const someSuccess = fileListRef.value.some(
-                (item) => item.status === UploadResultStatus.SUCCESS
-        );
+        const someSuccess = fileListRef.value.some((item) => item.status === UploadResultStatus.SUCCESS);
         return {
           disabled: isUploadingRef.value || fileListRef.value.length === 0 || !someSuccess,
         };
       });
 
       const getUploadBtnText = computed(() => {
-        const someError = fileListRef.value.some(
-                (item) => item.status === UploadResultStatus.ERROR
-        );
-        return isUploadingRef.value
-                ? t('component.upload.uploading')
-                : someError
-                        ? t('component.upload.reUploadFailed')
-                        : t('component.upload.startUpload');
+        const someError = fileListRef.value.some((item) => item.status === UploadResultStatus.ERROR);
+        return isUploadingRef.value ? t('component.upload.uploading') : someError ? t('component.upload.reUploadFailed') : t('component.upload.startUpload');
       });
 
       // 上传前校验
@@ -186,18 +165,18 @@
         try {
           item.status = UploadResultStatus.UPLOADING;
           const { data } = await props.api?.(
-                  {
-                    data: {
-                      ...(props.uploadParams || {}),
-                    },
-                    file: item.file,
-                    name: props.name,
-                    filename: props.filename,
-                  },
-                  function onUploadProgress(progressEvent: ProgressEvent) {
-                    const complete = ((progressEvent.loaded / progressEvent.total) * 100) | 0;
-                    item.percent = complete;
-                  }
+            {
+              data: {
+                ...(props.uploadParams || {}),
+              },
+              file: item.file,
+              name: props.name,
+              filename: props.filename,
+            },
+            function onUploadProgress(progressEvent: ProgressEvent) {
+              const complete = ((progressEvent.loaded / progressEvent.total) * 100) | 0;
+              item.percent = complete;
+            }
           );
           item.status = UploadResultStatus.SUCCESS;
           item.responseData = data;
@@ -224,12 +203,11 @@
         try {
           isUploadingRef.value = true;
           // 只上传不是成功状态的
-          const uploadFileList =
-                  fileListRef.value.filter((item) => item.status !== UploadResultStatus.SUCCESS) || [];
+          const uploadFileList = fileListRef.value.filter((item) => item.status !== UploadResultStatus.SUCCESS) || [];
           const data = await Promise.all(
-                  uploadFileList.map((item) => {
-                    return uploadApiByItem(item);
-                  })
+            uploadFileList.map((item) => {
+              return uploadApiByItem(item);
+            })
           );
           isUploadingRef.value = false;
           // 生产环境:抛出错误
diff --git a/src/components/Upload/src/UploadPreviewModal.vue b/src/components/Upload/src/UploadPreviewModal.vue
index 8401672..4bebe54 100644
--- a/src/components/Upload/src/UploadPreviewModal.vue
+++ b/src/components/Upload/src/UploadPreviewModal.vue
@@ -1,12 +1,5 @@
 <template>
-  <BasicModal
-          width="800px"
-          :title="t('component.upload.preview')"
-          wrapClassName="upload-preview-modal"
-          v-bind="$attrs"
-          @register="register"
-          :showOkBtn="false"
-  >
+  <BasicModal width="800px" :title="t('component.upload.preview')" wrapClassName="upload-preview-modal" v-bind="$attrs" @register="register" :showOkBtn="false">
     <FileList :dataSource="fileListRef" :columns="columns" :actionColumn="actionColumn" />
   </BasicModal>
 </template>
@@ -32,20 +25,20 @@
 
       const fileListRef = ref<PreviewFileItem[]>([]);
       watch(
-              () => props.value,
-              (value) => {
-                if (!isArray(value)) value = [];
-                fileListRef.value = value
-                        .filter((item) => !!item)
-                        .map((item) => {
-                          return {
-                            url: item,
-                            type: item.split('.').pop() || '',
-                            name: item.split('/').pop() || '',
-                          };
-                        });
-              },
-              { immediate: true }
+        () => props.value,
+        (value) => {
+          if (!isArray(value)) value = [];
+          fileListRef.value = value
+            .filter((item) => !!item)
+            .map((item) => {
+              return {
+                url: item,
+                type: item.split('.').pop() || '',
+                name: item.split('/').pop() || '',
+              };
+            });
+        },
+        { immediate: true }
       );
 
       // 删除
@@ -55,8 +48,8 @@
           const removed = fileListRef.value.splice(index, 1);
           emit('delete', removed[0].url);
           emit(
-                  'list-change',
-                  fileListRef.value.map((item) => item.url)
+            'list-change',
+            fileListRef.value.map((item) => item.url)
           );
         }
       }
diff --git a/src/components/Upload/src/data.tsx b/src/components/Upload/src/data.tsx
index 8e08833..5480788 100644
--- a/src/components/Upload/src/data.tsx
+++ b/src/components/Upload/src/data.tsx
@@ -122,13 +122,7 @@ export function createPreviewColumns(): BasicColumn[] {
   ];
 }
 
-export function createPreviewActionColumn({
-  handleRemove,
-  handleDownload,
-}: {
-  handleRemove: Fn;
-  handleDownload: Fn;
-}): BasicColumn {
+export function createPreviewActionColumn({ handleRemove, handleDownload }: { handleRemove: Fn; handleDownload: Fn }): BasicColumn {
   return {
     width: 160,
     title: t('component.upload.operating'),
diff --git a/src/components/Upload/src/useUpload.ts b/src/components/Upload/src/useUpload.ts
index 694cc27..707b510 100644
--- a/src/components/Upload/src/useUpload.ts
+++ b/src/components/Upload/src/useUpload.ts
@@ -1,17 +1,7 @@
 import { Ref, unref, computed } from 'vue';
 import { useI18n } from '/@/hooks/web/useI18n';
 const { t } = useI18n();
-export function useUploadType({
-  acceptRef,
-  helpTextRef,
-  maxNumberRef,
-  maxSizeRef,
-}: {
-  acceptRef: Ref<string[]>;
-  helpTextRef: Ref<string>;
-  maxNumberRef: Ref<number>;
-  maxSizeRef: Ref<number>;
-}) {
+export function useUploadType({ acceptRef, helpTextRef, maxNumberRef, maxSizeRef }: { acceptRef: Ref<string[]>; helpTextRef: Ref<string>; maxNumberRef: Ref<number>; maxSizeRef: Ref<number> }) {
   // 文件类型限制
   const getAccept = computed(() => {
     const accept = unref(acceptRef);
diff --git a/src/components/Verify/src/DragVerify.vue b/src/components/Verify/src/DragVerify.vue
index 2d430f9..3cba2ef 100644
--- a/src/components/Verify/src/DragVerify.vue
+++ b/src/components/Verify/src/DragVerify.vue
@@ -1,371 +1,351 @@
 <script lang="tsx">
-    import type { Ref } from 'vue';
-    import { defineComponent, ref, computed, unref, reactive, watch, watchEffect } from 'vue';
-    import { useTimeoutFn } from '/@/hooks/core/useTimeout';
-    import { useEventListener } from '/@/hooks/event/useEventListener';
-    import { basicProps } from './props';
-    import { getSlot } from '/@/utils/helper/tsxHelper';
-    import { CheckOutlined, DoubleRightOutlined } from '@ant-design/icons-vue';
+  import type { Ref } from 'vue';
+  import { defineComponent, ref, computed, unref, reactive, watch, watchEffect } from 'vue';
+  import { useTimeoutFn } from '/@/hooks/core/useTimeout';
+  import { useEventListener } from '/@/hooks/event/useEventListener';
+  import { basicProps } from './props';
+  import { getSlot } from '/@/utils/helper/tsxHelper';
+  import { CheckOutlined, DoubleRightOutlined } from '@ant-design/icons-vue';
 
-    export default defineComponent({
-        name: 'BaseDargVerify',
-        props: basicProps,
-        emits: ['success', 'update:value', 'change', 'start', 'move', 'end'],
-        setup(props, { emit, slots, expose }) {
-            const state = reactive({
-                isMoving: false,
-                isPassing: false,
-                moveDistance: 0,
-                toLeft: false,
-                startTime: 0,
-                endTime: 0,
-            });
+  export default defineComponent({
+    name: 'BaseDargVerify',
+    props: basicProps,
+    emits: ['success', 'update:value', 'change', 'start', 'move', 'end'],
+    setup(props, { emit, slots, expose }) {
+      const state = reactive({
+        isMoving: false,
+        isPassing: false,
+        moveDistance: 0,
+        toLeft: false,
+        startTime: 0,
+        endTime: 0,
+      });
 
-            const wrapElRef = ref<HTMLDivElement | null>(null);
-            const barElRef = ref<HTMLDivElement | null>(null);
-            const contentElRef = ref<HTMLDivElement | null>(null);
-            const actionElRef = ref(null) as Ref<HTMLDivElement | null>;
+      const wrapElRef = ref<HTMLDivElement | null>(null);
+      const barElRef = ref<HTMLDivElement | null>(null);
+      const contentElRef = ref<HTMLDivElement | null>(null);
+      const actionElRef = ref(null) as Ref<HTMLDivElement | null>;
 
-            useEventListener({
-                el: document,
-                name: 'mouseup',
-                listener: () => {
-                    if (state.isMoving) {
-                        resume();
-                    }
-                },
-            });
-
-            const getActionStyleRef = computed(() => {
-                const { height, actionStyle } = props;
-                const h = `${parseInt(height as string)}px`;
-                return {
-                    left: 0,
-                    width: h,
-                    height: h,
-                    ...actionStyle,
-                };
-            });
-
-            const getWrapStyleRef = computed(() => {
-                const { height, width, circle, wrapStyle } = props;
-                const h = parseInt(height as string);
-                const w = `${parseInt(width as string)}px`;
-                return {
-                    width: w,
-                    height: `${h}px`,
-                    lineHeight: `${h}px`,
-                    borderRadius: circle ? h / 2 + 'px' : 0,
-                    ...wrapStyle,
-                };
-            });
-
-            const getBarStyleRef = computed(() => {
-                const { height, circle, barStyle } = props;
-                const h = parseInt(height as string);
-                return {
-                    height: `${h}px`,
-                    borderRadius: circle ? h / 2 + 'px 0 0 ' + h / 2 + 'px' : 0,
-                    ...barStyle,
-                };
-            });
-
-            const getContentStyleRef = computed(() => {
-                const { height, width, contentStyle } = props;
-                const h = `${parseInt(height as string)}px`;
-                const w = `${parseInt(width as string)}px`;
-
-                return {
-                    height: h,
-                    width: w,
-                    ...contentStyle,
-                };
-            });
-
-            watch(
-                () => state.isPassing,
-                (isPassing) => {
-                    if (isPassing) {
-                        const { startTime, endTime } = state;
-                        const time = (endTime - startTime) / 1000;
-                        emit('success', { isPassing, time: time.toFixed(1) });
-                        emit('update:value', isPassing);
-                        emit('change', isPassing);
-                    }
-                }
-            );
-
-            watchEffect(() => {
-                state.isPassing = !!props.value;
-            });
-
-            function getEventPageX(e: MouseEvent | TouchEvent) {
-                return (e as MouseEvent).pageX || (e as TouchEvent).touches[0].pageX;
-            }
-
-            function handleDragStart(e: MouseEvent | TouchEvent) {
-                if (state.isPassing) {
-                    return;
-                }
-                const actionEl = unref(actionElRef);
-                if (!actionEl) return;
-                emit('start', e);
-                state.moveDistance = getEventPageX(e) - parseInt(actionEl.style.left.replace('px', ''), 10);
-                state.startTime = new Date().getTime();
-                state.isMoving = true;
-            }
-
-            function getOffset(el: HTMLDivElement) {
-                const actionWidth = parseInt(el.style.width);
-                const { width } = props;
-                const widthNum = parseInt(width as string);
-                const offset = widthNum - actionWidth - 6;
-                return { offset, widthNum, actionWidth };
-            }
-
-            function handleDragMoving(e: MouseEvent | TouchEvent) {
-                const { isMoving, moveDistance } = state;
-                if (isMoving) {
-                    const actionEl = unref(actionElRef);
-                    const barEl = unref(barElRef);
-                    if (!actionEl || !barEl) return;
-                    const { offset, widthNum, actionWidth } = getOffset(actionEl);
-                    const moveX = getEventPageX(e) - moveDistance;
-
-                    emit('move', {
-                        event: e,
-                        moveDistance,
-                        moveX,
-                    });
-                    if (moveX > 0 && moveX <= offset) {
-                        actionEl.style.left = `${moveX}px`;
-                        barEl.style.width = `${moveX + actionWidth / 2}px`;
-                    } else if (moveX > offset) {
-                        actionEl.style.left = `${widthNum - actionWidth}px`;
-                        barEl.style.width = `${widthNum - actionWidth / 2}px`;
-                        if (!props.isSlot) {
-                            checkPass();
-                        }
-                    }
-                }
-            }
-
-            function handleDragOver(e: MouseEvent | TouchEvent) {
-                const { isMoving, isPassing, moveDistance } = state;
-                if (isMoving && !isPassing) {
-                    emit('end', e);
-                    const actionEl = unref(actionElRef);
-                    const barEl = unref(barElRef);
-                    if (!actionEl || !barEl) return;
-                    const moveX = getEventPageX(e) - moveDistance;
-                    const { offset, widthNum, actionWidth } = getOffset(actionEl);
-                    if (moveX < offset) {
-                        if (!props.isSlot) {
-                            resume();
-                        } else {
-                            setTimeout(() => {
-                                if (!props.value) {
-                                    resume();
-                                } else {
-                                    const contentEl = unref(contentElRef);
-                                    if (contentEl) {
-                                        contentEl.style.width = `${parseInt(barEl.style.width)}px`;
-                                    }
-                                }
-                            }, 0);
-                        }
-                    } else {
-                        actionEl.style.left = `${widthNum - actionWidth}px`;
-                        barEl.style.width = `${widthNum - actionWidth / 2}px`;
-                        checkPass();
-                    }
-                    state.isMoving = false;
-                }
-            }
-
-            function checkPass() {
-                if (props.isSlot) {
-                    resume();
-                    return;
-                }
-                state.endTime = new Date().getTime();
-                state.isPassing = true;
-                state.isMoving = false;
-            }
-
-            function resume() {
-                state.isMoving = false;
-                state.isPassing = false;
-                state.moveDistance = 0;
-                state.toLeft = false;
-                state.startTime = 0;
-                state.endTime = 0;
-                const actionEl = unref(actionElRef);
-                const barEl = unref(barElRef);
-                const contentEl = unref(contentElRef);
-                if (!actionEl || !barEl || !contentEl) return;
-                state.toLeft = true;
-                useTimeoutFn(() => {
-                    state.toLeft = false;
-                    actionEl.style.left = '0';
-                    barEl.style.width = '0';
-                    //  The time is consistent with the animation time
-                }, 300);
-                contentEl.style.width = unref(getContentStyleRef).width;
-            }
-
-            expose({
-                resume,
-            });
-
-            return () => {
-                const renderBar = () => {
-                    const cls = [`darg-verify-bar`];
-                    if (state.toLeft) {
-                        cls.push('to-left');
-                    }
-                    return <div class={cls} ref={barElRef} style={unref(getBarStyleRef)} />;
-                };
-
-                const renderContent = () => {
-                    const cls = [`darg-verify-content`];
-                    const { isPassing } = state;
-                    const { text, successText } = props;
-
-                    isPassing && cls.push('success');
-
-                    return (
-                        <div class={cls} ref={contentElRef} style={unref(getContentStyleRef)}>
-                            {getSlot(slots, 'text', isPassing) || (isPassing ? successText : text)}
-                        </div>
-                    );
-                };
-
-                const renderAction = () => {
-                    const cls = [`darg-verify-action`];
-                    const { toLeft, isPassing } = state;
-                    if (toLeft) {
-                        cls.push('to-left');
-                    }
-                    return (
-                        <div
-                            class={cls}
-                            onMousedown={handleDragStart}
-                            onTouchstart={handleDragStart}
-                            style={unref(getActionStyleRef)}
-                            ref={actionElRef}
-                        >
-                            {getSlot(slots, 'actionIcon', isPassing) ||
-                            (isPassing ? (
-                                <CheckOutlined class={`darg-verify-action__icon`} />
-                            ) : (
-                                <DoubleRightOutlined class={`darg-verify-action__icon`} />
-                            ))}
-                        </div>
-                    );
-                };
-
-                return (
-                    <div
-                        class="darg-verify"
-                        ref={wrapElRef}
-                        style={unref(getWrapStyleRef)}
-                        onMousemove={handleDragMoving}
-                        onTouchmove={handleDragMoving}
-                        onMouseleave={handleDragOver}
-                        onMouseup={handleDragOver}
-                        onTouchend={handleDragOver}
-                    >
-                        {renderBar()}
-                        {renderContent()}
-                        {renderAction()}
-                    </div>
-                );
-            };
+      useEventListener({
+        el: document,
+        name: 'mouseup',
+        listener: () => {
+          if (state.isMoving) {
+            resume();
+          }
         },
-    });
+      });
+
+      const getActionStyleRef = computed(() => {
+        const { height, actionStyle } = props;
+        const h = `${parseInt(height as string)}px`;
+        return {
+          left: 0,
+          width: h,
+          height: h,
+          ...actionStyle,
+        };
+      });
+
+      const getWrapStyleRef = computed(() => {
+        const { height, width, circle, wrapStyle } = props;
+        const h = parseInt(height as string);
+        const w = `${parseInt(width as string)}px`;
+        return {
+          width: w,
+          height: `${h}px`,
+          lineHeight: `${h}px`,
+          borderRadius: circle ? h / 2 + 'px' : 0,
+          ...wrapStyle,
+        };
+      });
+
+      const getBarStyleRef = computed(() => {
+        const { height, circle, barStyle } = props;
+        const h = parseInt(height as string);
+        return {
+          height: `${h}px`,
+          borderRadius: circle ? h / 2 + 'px 0 0 ' + h / 2 + 'px' : 0,
+          ...barStyle,
+        };
+      });
+
+      const getContentStyleRef = computed(() => {
+        const { height, width, contentStyle } = props;
+        const h = `${parseInt(height as string)}px`;
+        const w = `${parseInt(width as string)}px`;
+
+        return {
+          height: h,
+          width: w,
+          ...contentStyle,
+        };
+      });
+
+      watch(
+        () => state.isPassing,
+        (isPassing) => {
+          if (isPassing) {
+            const { startTime, endTime } = state;
+            const time = (endTime - startTime) / 1000;
+            emit('success', { isPassing, time: time.toFixed(1) });
+            emit('update:value', isPassing);
+            emit('change', isPassing);
+          }
+        }
+      );
+
+      watchEffect(() => {
+        state.isPassing = !!props.value;
+      });
+
+      function getEventPageX(e: MouseEvent | TouchEvent) {
+        return (e as MouseEvent).pageX || (e as TouchEvent).touches[0].pageX;
+      }
+
+      function handleDragStart(e: MouseEvent | TouchEvent) {
+        if (state.isPassing) {
+          return;
+        }
+        const actionEl = unref(actionElRef);
+        if (!actionEl) return;
+        emit('start', e);
+        state.moveDistance = getEventPageX(e) - parseInt(actionEl.style.left.replace('px', ''), 10);
+        state.startTime = new Date().getTime();
+        state.isMoving = true;
+      }
+
+      function getOffset(el: HTMLDivElement) {
+        const actionWidth = parseInt(el.style.width);
+        const { width } = props;
+        const widthNum = parseInt(width as string);
+        const offset = widthNum - actionWidth - 6;
+        return { offset, widthNum, actionWidth };
+      }
+
+      function handleDragMoving(e: MouseEvent | TouchEvent) {
+        const { isMoving, moveDistance } = state;
+        if (isMoving) {
+          const actionEl = unref(actionElRef);
+          const barEl = unref(barElRef);
+          if (!actionEl || !barEl) return;
+          const { offset, widthNum, actionWidth } = getOffset(actionEl);
+          const moveX = getEventPageX(e) - moveDistance;
+
+          emit('move', {
+            event: e,
+            moveDistance,
+            moveX,
+          });
+          if (moveX > 0 && moveX <= offset) {
+            actionEl.style.left = `${moveX}px`;
+            barEl.style.width = `${moveX + actionWidth / 2}px`;
+          } else if (moveX > offset) {
+            actionEl.style.left = `${widthNum - actionWidth}px`;
+            barEl.style.width = `${widthNum - actionWidth / 2}px`;
+            if (!props.isSlot) {
+              checkPass();
+            }
+          }
+        }
+      }
+
+      function handleDragOver(e: MouseEvent | TouchEvent) {
+        const { isMoving, isPassing, moveDistance } = state;
+        if (isMoving && !isPassing) {
+          emit('end', e);
+          const actionEl = unref(actionElRef);
+          const barEl = unref(barElRef);
+          if (!actionEl || !barEl) return;
+          const moveX = getEventPageX(e) - moveDistance;
+          const { offset, widthNum, actionWidth } = getOffset(actionEl);
+          if (moveX < offset) {
+            if (!props.isSlot) {
+              resume();
+            } else {
+              setTimeout(() => {
+                if (!props.value) {
+                  resume();
+                } else {
+                  const contentEl = unref(contentElRef);
+                  if (contentEl) {
+                    contentEl.style.width = `${parseInt(barEl.style.width)}px`;
+                  }
+                }
+              }, 0);
+            }
+          } else {
+            actionEl.style.left = `${widthNum - actionWidth}px`;
+            barEl.style.width = `${widthNum - actionWidth / 2}px`;
+            checkPass();
+          }
+          state.isMoving = false;
+        }
+      }
+
+      function checkPass() {
+        if (props.isSlot) {
+          resume();
+          return;
+        }
+        state.endTime = new Date().getTime();
+        state.isPassing = true;
+        state.isMoving = false;
+      }
+
+      function resume() {
+        state.isMoving = false;
+        state.isPassing = false;
+        state.moveDistance = 0;
+        state.toLeft = false;
+        state.startTime = 0;
+        state.endTime = 0;
+        const actionEl = unref(actionElRef);
+        const barEl = unref(barElRef);
+        const contentEl = unref(contentElRef);
+        if (!actionEl || !barEl || !contentEl) return;
+        state.toLeft = true;
+        useTimeoutFn(() => {
+          state.toLeft = false;
+          actionEl.style.left = '0';
+          barEl.style.width = '0';
+          //  The time is consistent with the animation time
+        }, 300);
+        contentEl.style.width = unref(getContentStyleRef).width;
+      }
+
+      expose({
+        resume,
+      });
+
+      return () => {
+        const renderBar = () => {
+          const cls = [`darg-verify-bar`];
+          if (state.toLeft) {
+            cls.push('to-left');
+          }
+          return <div class={cls} ref={barElRef} style={unref(getBarStyleRef)} />;
+        };
+
+        const renderContent = () => {
+          const cls = [`darg-verify-content`];
+          const { isPassing } = state;
+          const { text, successText } = props;
+
+          isPassing && cls.push('success');
+
+          return (
+            <div class={cls} ref={contentElRef} style={unref(getContentStyleRef)}>
+              {getSlot(slots, 'text', isPassing) || (isPassing ? successText : text)}
+            </div>
+          );
+        };
+
+        const renderAction = () => {
+          const cls = [`darg-verify-action`];
+          const { toLeft, isPassing } = state;
+          if (toLeft) {
+            cls.push('to-left');
+          }
+          return (
+            <div class={cls} onMousedown={handleDragStart} onTouchstart={handleDragStart} style={unref(getActionStyleRef)} ref={actionElRef}>
+              {getSlot(slots, 'actionIcon', isPassing) || (isPassing ? <CheckOutlined class={`darg-verify-action__icon`} /> : <DoubleRightOutlined class={`darg-verify-action__icon`} />)}
+            </div>
+          );
+        };
+
+        return (
+          <div
+            class="darg-verify"
+            ref={wrapElRef}
+            style={unref(getWrapStyleRef)}
+            onMousemove={handleDragMoving}
+            onTouchmove={handleDragMoving}
+            onMouseleave={handleDragOver}
+            onMouseup={handleDragOver}
+            onTouchend={handleDragOver}
+          >
+            {renderBar()}
+            {renderContent()}
+            {renderAction()}
+          </div>
+        );
+      };
+    },
+  });
 </script>
 <style lang="less">
-    @radius: 4px;
+  @radius: 4px;
 
-    .darg-verify {
-        position: relative;
-        overflow: hidden;
-        text-align: center;
-        background-color: rgb(238, 238, 238);
-        border: 1px solid #ddd;
-        border-radius: @radius;
+  .darg-verify {
+    position: relative;
+    overflow: hidden;
+    text-align: center;
+    background-color: rgb(238, 238, 238);
+    border: 1px solid #ddd;
+    border-radius: @radius;
 
-        &-bar {
-            position: absolute;
-            width: 0;
-            height: 36px;
-            background-color: @success-color;
-            border-radius: @radius;
+    &-bar {
+      position: absolute;
+      width: 0;
+      height: 36px;
+      background-color: @success-color;
+      border-radius: @radius;
 
-            &.to-left {
-                width: 0 !important;
-                transition: width 0.3s;
-            }
-        }
-
-        &-content {
-            position: absolute;
-            top: 0;
-            font-size: 12px;
-            -webkit-text-size-adjust: none;
-            background-color: -webkit-gradient(
-                    linear,
-                    left top,
-                    right top,
-                    color-stop(0, #333),
-                    color-stop(0.4, #333),
-                    color-stop(0.5, #fff),
-                    color-stop(0.6, #333),
-                    color-stop(1, #333)
-            );
-            animation: slidetounlock 3s infinite;
-            background-clip: text;
-            user-select: none;
-
-            &.success {
-                -webkit-text-fill-color: @white;
-            }
-
-            & > * {
-                -webkit-text-fill-color: #333;
-            }
-        }
-
-        &-action {
-            position: absolute;
-            top: 0;
-            left: 0;
-            display: flex;
-            cursor: move;
-            background-color: @white;
-            border-radius: @radius;
-            justify-content: center;
-            align-items: center;
-
-            &__icon {
-                cursor: inherit;
-            }
-
-            &.to-left {
-                left: 0 !important;
-                transition: left 0.3s;
-            }
-        }
+      &.to-left {
+        width: 0 !important;
+        transition: width 0.3s;
+      }
     }
 
-    @keyframes slidetounlock {
-        0% {
-            background-position: -120px 0;
-        }
+    &-content {
+      position: absolute;
+      top: 0;
+      font-size: 12px;
+      -webkit-text-size-adjust: none;
+      background-color: -webkit-gradient(linear, left top, right top, color-stop(0, #333), color-stop(0.4, #333), color-stop(0.5, #fff), color-stop(0.6, #333), color-stop(1, #333));
+      animation: slidetounlock 3s infinite;
+      background-clip: text;
+      user-select: none;
 
-        100% {
-            background-position: 120px 0;
-        }
+      &.success {
+        -webkit-text-fill-color: @white;
+      }
+
+      & > * {
+        -webkit-text-fill-color: #333;
+      }
     }
+
+    &-action {
+      position: absolute;
+      top: 0;
+      left: 0;
+      display: flex;
+      cursor: move;
+      background-color: @white;
+      border-radius: @radius;
+      justify-content: center;
+      align-items: center;
+
+      &__icon {
+        cursor: inherit;
+      }
+
+      &.to-left {
+        left: 0 !important;
+        transition: left 0.3s;
+      }
+    }
+  }
+
+  @keyframes slidetounlock {
+    0% {
+      background-position: -120px 0;
+    }
+
+    100% {
+      background-position: 120px 0;
+    }
+  }
 </style>
diff --git a/src/components/Verify/src/ImgRotate.vue b/src/components/Verify/src/ImgRotate.vue
index 67d46e1..28032fe 100644
--- a/src/components/Verify/src/ImgRotate.vue
+++ b/src/components/Verify/src/ImgRotate.vue
@@ -1,222 +1,214 @@
 <script lang="tsx">
-    import type {MoveData, DragVerifyActionType} from './typing';
-    import {defineComponent, computed, unref, reactive, watch, ref} from 'vue';
-    import {useTimeoutFn} from '/@/hooks/core/useTimeout';
-    import BasicDragVerify from './DragVerify.vue';
-    import {hackCss} from '/@/utils/domUtils';
-    import {rotateProps} from './props';
-    import {useI18n} from '/@/hooks/web/useI18n';
+  import type { MoveData, DragVerifyActionType } from './typing';
+  import { defineComponent, computed, unref, reactive, watch, ref } from 'vue';
+  import { useTimeoutFn } from '/@/hooks/core/useTimeout';
+  import BasicDragVerify from './DragVerify.vue';
+  import { hackCss } from '/@/utils/domUtils';
+  import { rotateProps } from './props';
+  import { useI18n } from '/@/hooks/web/useI18n';
 
-    export default defineComponent({
-        name: 'ImgRotateDragVerify',
-        inheritAttrs: false,
-        props: rotateProps,
-        emits: ['success', 'change', 'update:value'],
-        setup(props, {emit, attrs, expose}) {
-            const basicRef = ref<Nullable<DragVerifyActionType>>(null);
-            const state = reactive({
-                showTip: false,
-                isPassing: false,
-                imgStyle: {},
-                randomRotate: 0,
-                currentRotate: 0,
-                toOrigin: false,
-                startTime: 0,
-                endTime: 0,
-                draged: false,
-            });
-            const {t} = useI18n();
+  export default defineComponent({
+    name: 'ImgRotateDragVerify',
+    inheritAttrs: false,
+    props: rotateProps,
+    emits: ['success', 'change', 'update:value'],
+    setup(props, { emit, attrs, expose }) {
+      const basicRef = ref<Nullable<DragVerifyActionType>>(null);
+      const state = reactive({
+        showTip: false,
+        isPassing: false,
+        imgStyle: {},
+        randomRotate: 0,
+        currentRotate: 0,
+        toOrigin: false,
+        startTime: 0,
+        endTime: 0,
+        draged: false,
+      });
+      const { t } = useI18n();
 
-            watch(
-                () => state.isPassing,
-                (isPassing) => {
-                    if (isPassing) {
-                        const {startTime, endTime} = state;
-                        const time = (endTime - startTime) / 1000;
-                        emit('success', {isPassing, time: time.toFixed(1)});
-                        emit('change', isPassing);
-                        emit('update:value', isPassing);
-                    }
-                }
-            );
+      watch(
+        () => state.isPassing,
+        (isPassing) => {
+          if (isPassing) {
+            const { startTime, endTime } = state;
+            const time = (endTime - startTime) / 1000;
+            emit('success', { isPassing, time: time.toFixed(1) });
+            emit('change', isPassing);
+            emit('update:value', isPassing);
+          }
+        }
+      );
 
-            const getImgWrapStyleRef = computed(() => {
-                const {imgWrapStyle, imgWidth} = props;
-                return {
-                    width: `${imgWidth}px`,
-                    height: `${imgWidth}px`,
-                    ...imgWrapStyle,
-                };
-            });
+      const getImgWrapStyleRef = computed(() => {
+        const { imgWrapStyle, imgWidth } = props;
+        return {
+          width: `${imgWidth}px`,
+          height: `${imgWidth}px`,
+          ...imgWrapStyle,
+        };
+      });
 
-            const getFactorRef = computed(() => {
-                const {minDegree, maxDegree} = props;
-                if (minDegree === maxDegree) {
-                    return Math.floor(1 + Math.random() * 1) / 10 + 1;
-                }
-                return 1;
-            });
+      const getFactorRef = computed(() => {
+        const { minDegree, maxDegree } = props;
+        if (minDegree === maxDegree) {
+          return Math.floor(1 + Math.random() * 1) / 10 + 1;
+        }
+        return 1;
+      });
 
-            function handleStart() {
-                state.startTime = new Date().getTime();
-            }
+      function handleStart() {
+        state.startTime = new Date().getTime();
+      }
 
-            function handleDragBarMove(data: MoveData) {
-                state.draged = true;
-                const {imgWidth, height, maxDegree} = props;
-                const {moveX} = data;
-                const currentRotate = Math.ceil(
-                    (moveX / (imgWidth! - parseInt(height as string))) * maxDegree! * unref(getFactorRef)
-                );
-                state.currentRotate = currentRotate;
-                state.imgStyle = hackCss('transform', `rotateZ(${state.randomRotate - currentRotate}deg)`);
-            }
+      function handleDragBarMove(data: MoveData) {
+        state.draged = true;
+        const { imgWidth, height, maxDegree } = props;
+        const { moveX } = data;
+        const currentRotate = Math.ceil((moveX / (imgWidth! - parseInt(height as string))) * maxDegree! * unref(getFactorRef));
+        state.currentRotate = currentRotate;
+        state.imgStyle = hackCss('transform', `rotateZ(${state.randomRotate - currentRotate}deg)`);
+      }
 
-            function handleImgOnLoad() {
-                const {minDegree, maxDegree} = props;
-                const ranRotate = Math.floor(minDegree! + Math.random() * (maxDegree! - minDegree!)); // 生成随机角度
-                state.randomRotate = ranRotate;
-                state.imgStyle = hackCss('transform', `rotateZ(${ranRotate}deg)`);
-            }
+      function handleImgOnLoad() {
+        const { minDegree, maxDegree } = props;
+        const ranRotate = Math.floor(minDegree! + Math.random() * (maxDegree! - minDegree!)); // 生成随机角度
+        state.randomRotate = ranRotate;
+        state.imgStyle = hackCss('transform', `rotateZ(${ranRotate}deg)`);
+      }
 
-            function handleDragEnd() {
-                const {randomRotate, currentRotate} = state;
-                const {diffDegree} = props;
+      function handleDragEnd() {
+        const { randomRotate, currentRotate } = state;
+        const { diffDegree } = props;
 
-                if (Math.abs(randomRotate - currentRotate) >= (diffDegree || 20)) {
-                    state.imgStyle = hackCss('transform', `rotateZ(${randomRotate}deg)`);
-                    state.toOrigin = true;
-                    useTimeoutFn(() => {
-                        state.toOrigin = false;
-                        state.showTip = true;
-                        //  时间与动画时间保持一致
-                    }, 300);
-                } else {
-                    checkPass();
-                }
-                state.showTip = true;
-            }
+        if (Math.abs(randomRotate - currentRotate) >= (diffDegree || 20)) {
+          state.imgStyle = hackCss('transform', `rotateZ(${randomRotate}deg)`);
+          state.toOrigin = true;
+          useTimeoutFn(() => {
+            state.toOrigin = false;
+            state.showTip = true;
+            //  时间与动画时间保持一致
+          }, 300);
+        } else {
+          checkPass();
+        }
+        state.showTip = true;
+      }
 
-            function checkPass() {
-                state.isPassing = true;
-                state.endTime = new Date().getTime();
-            }
+      function checkPass() {
+        state.isPassing = true;
+        state.endTime = new Date().getTime();
+      }
 
-            function resume() {
-                state.showTip = false;
-                const basicEl = unref(basicRef);
-                if (!basicEl) {
-                    return;
-                }
-                state.isPassing = false;
+      function resume() {
+        state.showTip = false;
+        const basicEl = unref(basicRef);
+        if (!basicEl) {
+          return;
+        }
+        state.isPassing = false;
 
-                basicEl.resume();
-                handleImgOnLoad();
-            }
+        basicEl.resume();
+        handleImgOnLoad();
+      }
 
-            expose({resume});
+      expose({ resume });
 
-            // handleImgOnLoad();
-            return () => {
-                const {src} = props;
-                const {toOrigin, isPassing, startTime, endTime} = state;
-                const imgCls: string[] = [];
-                if (toOrigin) {
-                    imgCls.push('to-origin');
-                }
-                const time = (endTime - startTime) / 1000;
+      // handleImgOnLoad();
+      return () => {
+        const { src } = props;
+        const { toOrigin, isPassing, startTime, endTime } = state;
+        const imgCls: string[] = [];
+        if (toOrigin) {
+          imgCls.push('to-origin');
+        }
+        const time = (endTime - startTime) / 1000;
 
-                return (
-                    <div class="ir-dv">
-                        <div class={`ir-dv-img__wrap`} style={unref(getImgWrapStyleRef)}>
-                            <img
-                                src={src}
-                                onLoad={handleImgOnLoad}
-                                width={parseInt(props.width as string)}
-                                class={imgCls}
-                                style={state.imgStyle}
-                                onClick={() => {
-                                    resume();
-                                }}
-                                alt="verify"
-                            />
-                            {state.showTip && (
-                                <span class={[`ir-dv-img__tip`, state.isPassing ? 'success' : 'error']}>
-                  {state.isPassing
-                      ? t('component.verify.time', {time: time.toFixed(1)})
-                      : t('component.verify.error')}
-                </span>
-                            )}
-                            {!state.showTip && !state.draged && (
-                                <span class={[`ir-dv-img__tip`, 'normal']}>{t('component.verify.redoTip')}</span>
-                            )}
-                        </div>
-                        <BasicDragVerify
-                            class={`ir-dv-drag__bar`}
-                            onMove={handleDragBarMove}
-                            onEnd={handleDragEnd}
-                            onStart={handleStart}
-                            ref={basicRef}
-                            {...{...attrs, ...props}}
-                            value={isPassing}
-                            isSlot={true}
-                        />
-                    </div>
-                );
-            };
-        },
-    });
+        return (
+          <div class="ir-dv">
+            <div class={`ir-dv-img__wrap`} style={unref(getImgWrapStyleRef)}>
+              <img
+                src={src}
+                onLoad={handleImgOnLoad}
+                width={parseInt(props.width as string)}
+                class={imgCls}
+                style={state.imgStyle}
+                onClick={() => {
+                  resume();
+                }}
+                alt="verify"
+              />
+              {state.showTip && (
+                <span class={[`ir-dv-img__tip`, state.isPassing ? 'success' : 'error']}>{state.isPassing ? t('component.verify.time', { time: time.toFixed(1) }) : t('component.verify.error')}</span>
+              )}
+              {!state.showTip && !state.draged && <span class={[`ir-dv-img__tip`, 'normal']}>{t('component.verify.redoTip')}</span>}
+            </div>
+            <BasicDragVerify
+              class={`ir-dv-drag__bar`}
+              onMove={handleDragBarMove}
+              onEnd={handleDragEnd}
+              onStart={handleStart}
+              ref={basicRef}
+              {...{ ...attrs, ...props }}
+              value={isPassing}
+              isSlot={true}
+            />
+          </div>
+        );
+      };
+    },
+  });
 </script>
 <style lang="less">
-    .ir-dv {
-        position: relative;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
+  .ir-dv {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
 
-        &-img__wrap {
-            position: relative;
-            overflow: hidden;
-            border-radius: 50%;
+    &-img__wrap {
+      position: relative;
+      overflow: hidden;
+      border-radius: 50%;
 
-            img {
-                width: 100%;
-                border-radius: 50%;
+      img {
+        width: 100%;
+        border-radius: 50%;
 
-                &.to-origin {
-                    transition: transform 0.3s;
-                }
-            }
-        }
-
-        &-img__tip {
-            position: absolute;
-            bottom: 10px;
-            left: 0;
-            z-index: 1;
-            display: block;
-            width: 100%;
-            height: 30px;
-            font-size: 12px;
-            line-height: 30px;
-            color: @white;
-            text-align: center;
-
-            &.success {
-                background-color: fade(@success-color, 60%);
-            }
-
-            &.error {
-                background-color: fade(@error-color, 60%);
-            }
-
-            &.normal {
-                background-color: rgba(0, 0, 0, 0.3);
-            }
-        }
-
-        &-drag__bar {
-            margin-top: 20px;
+        &.to-origin {
+          transition: transform 0.3s;
         }
+      }
     }
+
+    &-img__tip {
+      position: absolute;
+      bottom: 10px;
+      left: 0;
+      z-index: 1;
+      display: block;
+      width: 100%;
+      height: 30px;
+      font-size: 12px;
+      line-height: 30px;
+      color: @white;
+      text-align: center;
+
+      &.success {
+        background-color: fade(@success-color, 60%);
+      }
+
+      &.error {
+        background-color: fade(@error-color, 60%);
+      }
+
+      &.normal {
+        background-color: rgba(0, 0, 0, 0.3);
+      }
+    }
+
+    &-drag__bar {
+      margin-top: 20px;
+    }
+  }
 </style>
diff --git a/src/components/VirtualScroll/src/VirtualScroll.vue b/src/components/VirtualScroll/src/VirtualScroll.vue
index b37a058..e010423 100644
--- a/src/components/VirtualScroll/src/VirtualScroll.vue
+++ b/src/components/VirtualScroll/src/VirtualScroll.vue
@@ -1,15 +1,5 @@
 <script lang="tsx">
-  import {
-    defineComponent,
-    computed,
-    ref,
-    unref,
-    reactive,
-    onMounted,
-    watch,
-    nextTick,
-    CSSProperties,
-  } from 'vue';
+  import { defineComponent, computed, ref, unref, reactive, onMounted, watch, nextTick, CSSProperties } from 'vue';
   import { useEventListener } from '/@/hooks/event/useEventListener';
   import { getSlot } from '/@/utils/helper/tsxHelper';
 
diff --git a/src/components/chart/Bar.vue b/src/components/chart/Bar.vue
index edcd993..3822eaa 100644
--- a/src/components/chart/Bar.vue
+++ b/src/components/chart/Bar.vue
@@ -1,77 +1,79 @@
 <template>
-    <div ref="chartRef" :style="{ height, width }"></div>
+  <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
-    import {defineComponent, PropType, ref, Ref,reactive,watchEffect} from 'vue';
-    import {useECharts} from '/@/hooks/web/useECharts';
-   
-    export default defineComponent({
-        name: "bar",
-        props: {
-            chartData:{
-                type: Array,
-                default: () => ([]),
-            },
-            option:{
-                type: Object,
-                default: () => ({}),
-            },
-            width: {
-                type: String as PropType<string>,
-                default: '100%',
-            },
-            height: {
-                type: String as PropType<string>,
-                default: 'calc(100vh - 78px)',
+  import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue';
+  import { useECharts } from '/@/hooks/web/useECharts';
+
+  export default defineComponent({
+    name: 'bar',
+    props: {
+      chartData: {
+        type: Array,
+        default: () => [],
+      },
+      option: {
+        type: Object,
+        default: () => ({}),
+      },
+      width: {
+        type: String as PropType<string>,
+        default: '100%',
+      },
+      height: {
+        type: String as PropType<string>,
+        default: 'calc(100vh - 78px)',
+      },
+    },
+    setup(props) {
+      const chartRef = ref<HTMLDivElement | null>(null);
+      const { setOptions, echarts } = useECharts(chartRef as Ref<HTMLDivElement>);
+      const option = reactive({
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'shadow',
+            label: {
+              show: true,
+              backgroundColor: '#333',
             },
+          },
         },
-        setup(props) {
-            const chartRef = ref<HTMLDivElement | null>(null);
-            const {setOptions, echarts} = useECharts(chartRef as Ref<HTMLDivElement>);
-            const option = reactive({
-                tooltip: {
-                    trigger: 'axis',
-                    axisPointer: {
-                        type: 'shadow',
-                        label: {
-                            show: true,
-                            backgroundColor: '#333',
-                        },
-                    },
-                },
-                xAxis: {
-                    type: 'category',
-                    data: [],
-                },
-                yAxis: {
-                    type: 'value',
-                },
-                series: [{
-                    name: 'bar',
-                    type: 'bar',
-                    data:[],
-                 }],
-            });
-            
-            watchEffect(() => {
-                props.chartData && initCharts();
-            });
-            
-            function initCharts(){
-                if(props.option){
-                    Object.assign(option,props.option);
-                }
-                let seriesData = props.chartData.map(item=>{
-                    return item.value
-                })
-                let xAxisData = props.chartData.map(item=>{
-                    return item.name
-                })
-                option.series[0].data = seriesData;
-                option.xAxis.data = xAxisData;
-                setOptions(option);
-            }
-            return {chartRef};
+        xAxis: {
+          type: 'category',
+          data: [],
+        },
+        yAxis: {
+          type: 'value',
+        },
+        series: [
+          {
+            name: 'bar',
+            type: 'bar',
+            data: [],
+          },
+        ],
+      });
+
+      watchEffect(() => {
+        props.chartData && initCharts();
+      });
+
+      function initCharts() {
+        if (props.option) {
+          Object.assign(option, props.option);
         }
-    });
+        let seriesData = props.chartData.map((item) => {
+          return item.value;
+        });
+        let xAxisData = props.chartData.map((item) => {
+          return item.name;
+        });
+        option.series[0].data = seriesData;
+        option.xAxis.data = xAxisData;
+        setOptions(option);
+      }
+      return { chartRef };
+    },
+  });
 </script>
diff --git a/src/components/chart/BarAndLine.vue b/src/components/chart/BarAndLine.vue
index 12cbf78..2c4cd34 100644
--- a/src/components/chart/BarAndLine.vue
+++ b/src/components/chart/BarAndLine.vue
@@ -1,84 +1,86 @@
 <template>
-    <div ref="chartRef" :style="{ height, width }"></div>
+  <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
-    import {defineComponent, PropType, ref, Ref,reactive,watchEffect} from 'vue';
-    import {useECharts} from '/@/hooks/web/useECharts';
-   
-    export default defineComponent({
-        name: "barAndLine",
-        props: {
-            chartData:{
-                type: Array,
-                default: () => ([]),
-            },
-            option:{
-                type: Object,
-                default: () => ({}),
-            },
-            width: {
-                type: String as PropType<string>,
-                default: '100%',
-            },
-            height: {
-                type: String as PropType<string>,
-                default: 'calc(100vh - 78px)',
+  import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue';
+  import { useECharts } from '/@/hooks/web/useECharts';
+
+  export default defineComponent({
+    name: 'barAndLine',
+    props: {
+      chartData: {
+        type: Array,
+        default: () => [],
+      },
+      option: {
+        type: Object,
+        default: () => ({}),
+      },
+      width: {
+        type: String as PropType<string>,
+        default: '100%',
+      },
+      height: {
+        type: String as PropType<string>,
+        default: 'calc(100vh - 78px)',
+      },
+    },
+    setup(props) {
+      const chartRef = ref<HTMLDivElement | null>(null);
+      const { setOptions, echarts } = useECharts(chartRef as Ref<HTMLDivElement>);
+      const option = reactive({
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'shadow',
+            label: {
+              show: true,
+              backgroundColor: '#333',
             },
+          },
         },
-        setup(props) {
-            const chartRef = ref<HTMLDivElement | null>(null);
-            const {setOptions, echarts} = useECharts(chartRef as Ref<HTMLDivElement>);
-            const option = reactive({
-                tooltip: {
-                    trigger: 'axis',
-                    axisPointer: {
-                        type: 'shadow',
-                        label: {
-                            show: true,
-                            backgroundColor: '#333',
-                        },
-                    },
-                },
-                xAxis: {
-                    type: 'category',
-                    data: [],
-                },
-                yAxis: {
-                    type: 'value',
-                },
-                series: [{
-                    name: 'bar',
-                    type: 'bar',
-                    data:[],
-                 }],
-            });
-            
-            watchEffect(() => {
-                props.chartData && initCharts();
-            });
-            
-            function initCharts(){
-                if (props.option) {
-                    Object.assign(option, props.option);
-                }
-                //图例类型
-                let typeArr = Array.from(new Set(props.chartData.map(item => (item.type))));
-                //轴数据
-                let xAxisData = Array.from(new Set(props.chartData.map(item => (item.name))));
-                let seriesData = [];
-                typeArr.forEach(type => {
-                    let obj = {name:type};
-                    let chartArr = props.chartData.filter(item => type === item.type);
-                    //data数据
-                    obj['data'] = chartArr.map(item => (item.value))
-                    obj['type'] = chartArr[0].seriesType
-                    seriesData.push(obj);
-                })
-                option.series = seriesData;
-                option.xAxis.data = xAxisData;
-                setOptions(option);
-            }
-            return {chartRef};
+        xAxis: {
+          type: 'category',
+          data: [],
+        },
+        yAxis: {
+          type: 'value',
+        },
+        series: [
+          {
+            name: 'bar',
+            type: 'bar',
+            data: [],
+          },
+        ],
+      });
+
+      watchEffect(() => {
+        props.chartData && initCharts();
+      });
+
+      function initCharts() {
+        if (props.option) {
+          Object.assign(option, props.option);
         }
-    });
+        //图例类型
+        let typeArr = Array.from(new Set(props.chartData.map((item) => item.type)));
+        //轴数据
+        let xAxisData = Array.from(new Set(props.chartData.map((item) => item.name)));
+        let seriesData = [];
+        typeArr.forEach((type) => {
+          let obj = { name: type };
+          let chartArr = props.chartData.filter((item) => type === item.type);
+          //data数据
+          obj['data'] = chartArr.map((item) => item.value);
+          obj['type'] = chartArr[0].seriesType;
+          seriesData.push(obj);
+        });
+        option.series = seriesData;
+        option.xAxis.data = xAxisData;
+        setOptions(option);
+      }
+      return { chartRef };
+    },
+  });
 </script>
diff --git a/src/components/chart/BarMulti.vue b/src/components/chart/BarMulti.vue
index e11ca1e..a094f3f 100644
--- a/src/components/chart/BarMulti.vue
+++ b/src/components/chart/BarMulti.vue
@@ -1,98 +1,98 @@
 <template>
-    <div ref="chartRef" :style="{ height, width }"></div>
+  <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
-    import {defineComponent, PropType, ref, Ref, reactive, watchEffect} from 'vue';
-    import {useECharts} from '/@/hooks/web/useECharts';
+  import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue';
+  import { useECharts } from '/@/hooks/web/useECharts';
 
-    export default defineComponent({
-        name: "barMulti",
-        props: {
-            chartData: {
-                type: Array,
-                default: () => ([]),
-                required: true
-            },
-            option: {
-                type: Object,
-                default: () => ({}),
-            },
-            type:{
-                type: String as PropType<string>,
-                default: 'bar', 
-            },
-            width: {
-                type: String as PropType<string>,
-                default: '100%',
-            },
-            height: {
-                type: String as PropType<string>,
-                default: 'calc(100vh - 78px)',
+  export default defineComponent({
+    name: 'barMulti',
+    props: {
+      chartData: {
+        type: Array,
+        default: () => [],
+        required: true,
+      },
+      option: {
+        type: Object,
+        default: () => ({}),
+      },
+      type: {
+        type: String as PropType<string>,
+        default: 'bar',
+      },
+      width: {
+        type: String as PropType<string>,
+        default: '100%',
+      },
+      height: {
+        type: String as PropType<string>,
+        default: 'calc(100vh - 78px)',
+      },
+    },
+    emits: ['click'],
+    setup(props, { emit }) {
+      const chartRef = ref<HTMLDivElement | null>(null);
+      const { setOptions, getInstance } = useECharts(chartRef as Ref<HTMLDivElement>);
+      const option = reactive({
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'shadow',
+            label: {
+              show: true,
+              backgroundColor: '#333',
             },
+          },
         },
-        emits: ['click'],
-        setup(props, {emit}) {
-            const chartRef = ref<HTMLDivElement | null>(null);
-            const {setOptions, getInstance} = useECharts(chartRef as Ref<HTMLDivElement>);
-            const option = reactive({
-                tooltip: {
-                    trigger: 'axis',
-                    axisPointer: {
-                        type: 'shadow',
-                        label: {
-                            show: true,
-                            backgroundColor: '#333',
-                        },
-                    },
-                },
-                legend: {
-                    top:30
-                },
-                grid: {
-                    top:60,
-                },
-                xAxis: {
-                    type: 'category',
-                    data: [],
-                },
-                yAxis: {
-                    type: 'value',
-                },
-                series: [],
-            });
+        legend: {
+          top: 30,
+        },
+        grid: {
+          top: 60,
+        },
+        xAxis: {
+          type: 'category',
+          data: [],
+        },
+        yAxis: {
+          type: 'value',
+        },
+        series: [],
+      });
 
-            watchEffect(() => {
-                props.chartData && initCharts();
-            });
+      watchEffect(() => {
+        props.chartData && initCharts();
+      });
 
-            function initCharts() {
-                if (props.option) {
-                    Object.assign(option, props.option);
-                }
-                //图例类型
-                let typeArr = Array.from(new Set(props.chartData.map(item => (item.type))));
-                //轴数据
-                let xAxisData = Array.from(new Set(props.chartData.map(item => (item.name))));
-                let seriesData = [];
-                typeArr.forEach(type => {
-                    let obj = {name:type,type:props.type};
-                    let chartArr = props.chartData.filter(item => type === item.type);
-                    //data数据
-                    obj['data'] = chartArr.map(item => (item.value))
-                    seriesData.push(obj);
-                })
-                option.series = seriesData;
-                option.xAxis.data = xAxisData;
-                setOptions(option);
-                getInstance()?.off('click', onClick)
-                getInstance()?.on('click', onClick)
-            }
-
-            function onClick(params) {
-              emit('click', params)
-            }
-
-            return {chartRef};
+      function initCharts() {
+        if (props.option) {
+          Object.assign(option, props.option);
         }
-    });
+        //图例类型
+        let typeArr = Array.from(new Set(props.chartData.map((item) => item.type)));
+        //轴数据
+        let xAxisData = Array.from(new Set(props.chartData.map((item) => item.name)));
+        let seriesData = [];
+        typeArr.forEach((type) => {
+          let obj = { name: type, type: props.type };
+          let chartArr = props.chartData.filter((item) => type === item.type);
+          //data数据
+          obj['data'] = chartArr.map((item) => item.value);
+          seriesData.push(obj);
+        });
+        option.series = seriesData;
+        option.xAxis.data = xAxisData;
+        setOptions(option);
+        getInstance()?.off('click', onClick);
+        getInstance()?.on('click', onClick);
+      }
+
+      function onClick(params) {
+        emit('click', params);
+      }
+
+      return { chartRef };
+    },
+  });
 </script>
diff --git a/src/components/chart/ChartCard.vue b/src/components/chart/ChartCard.vue
index 5452d3b..ea8ad19 100644
--- a/src/components/chart/ChartCard.vue
+++ b/src/components/chart/ChartCard.vue
@@ -7,7 +7,9 @@
           <slot name="action"></slot>
         </span>
       </div>
-      <div class="total"><span>{{ total }}</span></div>
+      <div class="total"
+        ><span>{{ total }}</span></div
+      >
     </div>
     <div class="chart-card-content">
       <div class="content-fix">
@@ -23,20 +25,20 @@
 </template>
 
 <script lang="ts" setup>
-    defineProps({
-        title: {
-            type: String,
-            default: ''
-        },
-        total: {
-            type: [Number, String],
-            default: ''
-        },
-        loading: {
-            type: Boolean,
-            default: false
-        }
-    });
+  defineProps({
+    title: {
+      type: String,
+      default: '',
+    },
+    total: {
+      type: [Number, String],
+      default: '',
+    },
+    loading: {
+      type: Boolean,
+      default: false,
+    },
+  });
 </script>
 
 <style lang="less" scoped>
@@ -49,7 +51,7 @@
       position: relative;
       overflow: hidden;
       width: 100%;
-      color: rgba(0, 0, 0, .45);
+      color: rgba(0, 0, 0, 0.45);
       font-size: 14px;
       line-height: 22px;
     }
diff --git a/src/components/chart/Gauge.vue b/src/components/chart/Gauge.vue
index 2dacb1b..2cf852e 100644
--- a/src/components/chart/Gauge.vue
+++ b/src/components/chart/Gauge.vue
@@ -1,100 +1,100 @@
 <template>
-    <div ref="chartRef" :style="{ height, width }"></div>
+  <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
-    import {defineComponent, PropType, ref, Ref,reactive,watchEffect} from 'vue';
-    import {useECharts} from '/@/hooks/web/useECharts';
-    import { GaugeChart } from 'echarts/charts';
-    export default defineComponent({
-        name: "Gauge",
-        props: {
-            chartData:{
-                type: Object as PropType<Object>,
-                default: () => ([]),
+  import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue';
+  import { useECharts } from '/@/hooks/web/useECharts';
+  import { GaugeChart } from 'echarts/charts';
+  export default defineComponent({
+    name: 'Gauge',
+    props: {
+      chartData: {
+        type: Object as PropType<Object>,
+        default: () => [],
+      },
+      option: {
+        type: Object,
+        default: () => ({}),
+      },
+      width: {
+        type: String as PropType<string>,
+        default: '100%',
+      },
+      height: {
+        type: String as PropType<string>,
+        default: 'calc(100vh - 78px)',
+      },
+    },
+    setup(props) {
+      const chartRef = ref<HTMLDivElement | null>(null);
+      const { setOptions, echarts } = useECharts(chartRef as Ref<HTMLDivElement>);
+      const option = reactive({
+        series: [
+          {
+            type: 'gauge',
+            progress: {
+              show: true,
+              width: 12,
             },
-            option:{
-                type: Object,
-                default: () => ({}),
+            axisLine: {
+              lineStyle: {
+                width: 12,
+              },
             },
-            width: {
-                type: String as PropType<string>,
-                default: '100%',
+            axisTick: {
+              show: false,
             },
-            height: {
-                type: String as PropType<string>,
-                default: 'calc(100vh - 78px)',
+            splitLine: {
+              length: 12,
+              lineStyle: {
+                width: 1,
+                color: '#999',
+              },
             },
-        },
-        setup(props) {
-            const chartRef = ref<HTMLDivElement | null>(null);
-            const {setOptions, echarts} = useECharts(chartRef as Ref<HTMLDivElement>);
-            const option = reactive({
-                series: [
-                    {
-                        type: 'gauge',
-                        progress: {
-                            show: true,
-                            width: 12,
-                        },
-                        axisLine: {
-                            lineStyle: {
-                                width: 12,
-                            },
-                        },
-                        axisTick: {
-                            show: false,
-                        },
-                        splitLine: {
-                            length: 12,
-                            lineStyle: {
-                                width: 1,
-                                color: '#999',
-                            },
-                        },
-                        axisLabel: {
-                            distance: 25,
-                            color: '#999',
-                            fontSize: 12,
-                        },
-                        anchor: {
-                            show: true,
-                            showAbove: true,
-                            size: 20,
-                            itemStyle: {
-                                borderWidth: 5,
-                            },
-                        },
-                        title: {},
-                        detail: {
-                            valueAnimation: true,
-                            fontSize: 25,
-                            formatter: '{value}%',
-                            offsetCenter: [0, '80%'],
-                        },
-                        data: [
-                            {
-                                value: 70,
-                                name: '本地磁盘',
-                            },
-                        ],
-                    },
-                ],
-            });
-            
-            watchEffect(() => {
-                props.chartData && initCharts();
-            });
-            
-            function initCharts(){
-                echarts.use(GaugeChart);
-                if(props.option){
-                    Object.assign(option,props.option);
-                }
-                option.series[0].data[0].name = props.chartData.name;
-                option.series[0].data[0].value = props.chartData.value;
-                setOptions(option);
-            }
-            return {chartRef};
+            axisLabel: {
+              distance: 25,
+              color: '#999',
+              fontSize: 12,
+            },
+            anchor: {
+              show: true,
+              showAbove: true,
+              size: 20,
+              itemStyle: {
+                borderWidth: 5,
+              },
+            },
+            title: {},
+            detail: {
+              valueAnimation: true,
+              fontSize: 25,
+              formatter: '{value}%',
+              offsetCenter: [0, '80%'],
+            },
+            data: [
+              {
+                value: 70,
+                name: '本地磁盘',
+              },
+            ],
+          },
+        ],
+      });
+
+      watchEffect(() => {
+        props.chartData && initCharts();
+      });
+
+      function initCharts() {
+        echarts.use(GaugeChart);
+        if (props.option) {
+          Object.assign(option, props.option);
         }
-    });
+        option.series[0].data[0].name = props.chartData.name;
+        option.series[0].data[0].value = props.chartData.value;
+        setOptions(option);
+      }
+      return { chartRef };
+    },
+  });
 </script>
diff --git a/src/components/chart/HeadInfo.vue b/src/components/chart/HeadInfo.vue
index 72a8716..741745c 100644
--- a/src/components/chart/HeadInfo.vue
+++ b/src/components/chart/HeadInfo.vue
@@ -1,75 +1,75 @@
 <template>
-    <div class="head-info" :class="center && 'center'">
-        <span>{{ title }}</span>
-         <p>{{ content }} <a-icon :type="icon" style="font-size: 24px; color: #2B99FF" /></p>
-        <em v-if="bordered"/>
-    </div>
+  <div class="head-info" :class="center && 'center'">
+    <span>{{ title }}</span>
+    <p>{{ content }} <a-icon :type="icon" style="font-size: 24px; color: #2b99ff" /></p>
+    <em v-if="bordered" />
+  </div>
 </template>
 
 <script lang="ts">
-    import {defineComponent} from 'vue';
+  import { defineComponent } from 'vue';
 
-    export default defineComponent({
-        name: "HeadInfo",
-        props: {
-            title: {
-                type: String,
-                default: ''
-            },
-            content: {
-                type: String,
-                default: ''
-            },
-            bordered: {
-                type: Boolean,
-                default: false
-            },
-            center: {
-                type: Boolean,
-                default: true
-            },
-            icon: {
-                type: String,
-                default: false
-            }
-        },
-    })
+  export default defineComponent({
+    name: 'HeadInfo',
+    props: {
+      title: {
+        type: String,
+        default: '',
+      },
+      content: {
+        type: String,
+        default: '',
+      },
+      bordered: {
+        type: Boolean,
+        default: false,
+      },
+      center: {
+        type: Boolean,
+        default: true,
+      },
+      icon: {
+        type: String,
+        default: false,
+      },
+    },
+  });
 </script>
 
 <style lang="less" scoped>
-    .head-info {
-        position: relative;
-        text-align: left;
-        padding: 0 32px 0 0;
-        min-width: 125px;
+  .head-info {
+    position: relative;
+    text-align: left;
+    padding: 0 32px 0 0;
+    min-width: 125px;
 
-        &.center {
-            text-align: center;
-            padding: 0 32px;
-        }
-
-        span {
-            color: rgba(0, 0, 0, .45);
-            display: inline-block;
-            font-size: 14px;
-            line-height: 22px;
-            margin-bottom: 4px;
-        }
-
-        p {
-            color: rgba(0, 0, 0, .85);
-            font-size: 24px;
-            line-height: 32px;
-            margin: 0;
-        }
-
-        em {
-            background-color: #e8e8e8;
-            position: absolute;
-            height: 56px;
-            width: 1px;
-            top: 0;
-            right: 0;
-        }
+    &.center {
+      text-align: center;
+      padding: 0 32px;
     }
+
+    span {
+      color: rgba(0, 0, 0, 0.45);
+      display: inline-block;
+      font-size: 14px;
+      line-height: 22px;
+      margin-bottom: 4px;
+    }
+
+    p {
+      color: rgba(0, 0, 0, 0.85);
+      font-size: 24px;
+      line-height: 32px;
+      margin: 0;
+    }
+
+    em {
+      background-color: #e8e8e8;
+      position: absolute;
+      height: 56px;
+      width: 1px;
+      top: 0;
+      right: 0;
+    }
+  }
 </style>
diff --git a/src/components/chart/Line.vue b/src/components/chart/Line.vue
index 537ba37..3a2443f 100644
--- a/src/components/chart/Line.vue
+++ b/src/components/chart/Line.vue
@@ -1,79 +1,81 @@
 <template>
-    <div ref="chartRef" :style="{ height, width }"></div>
+  <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
-    import {defineComponent, PropType, ref, Ref,reactive,watchEffect} from 'vue';
-    import {useECharts} from '/@/hooks/web/useECharts';
-    
-    export default defineComponent({
-        name: "line",
-        props: {
-            chartData:{
-                type: Array,
-                default: () => ([]),
-            },
-            option:{
-                type: Object,
-                default: () => ({}),
-            },
-            width: {
-                type: String as PropType<string>,
-                default: '100%',
-            },
-            height: {
-                type: String as PropType<string>,
-                default: 'calc(100vh - 78px)',
-            },
-        },
-        setup(props) {
-            const chartRef = ref<HTMLDivElement | null>(null);
-            const {setOptions, echarts} = useECharts(chartRef as Ref<HTMLDivElement>);
-            const option = reactive({
-                tooltip: {
-                    trigger: 'axis',
-                    axisPointer: {
-                        type: 'shadow',
-                        label: {
-                            show: true,
-                            backgroundColor: '#333',
-                        },
-                    },
-                },
-                xAxis: {
-                    type: 'category',
-                    data: [],
-                },
-                yAxis: {
-                    type: 'value',
-                },
-                series: [{
-                    type: 'line',
-                    showSymbol :false,
-                    smooth:true,
-                    areaStyle: {},
-                    data:[],
-                 }],
-            });
-            
-            watchEffect(() => {
-                props.chartData && initCharts();
-            });
+  import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue';
+  import { useECharts } from '/@/hooks/web/useECharts';
 
-            function initCharts(){
-                if(props.option){
-                    Object.assign(option,props.option);
-                }
-                let seriesData = props.chartData.map(item=>{
-                    return item.value
-                })
-                let xAxisData = props.chartData.map(item=>{
-                    return item.name
-                })
-                option.series[0].data = seriesData;
-                option.xAxis.data = xAxisData;
-                setOptions(option);
-            }
-            return {chartRef};
+  export default defineComponent({
+    name: 'line',
+    props: {
+      chartData: {
+        type: Array,
+        default: () => [],
+      },
+      option: {
+        type: Object,
+        default: () => ({}),
+      },
+      width: {
+        type: String as PropType<string>,
+        default: '100%',
+      },
+      height: {
+        type: String as PropType<string>,
+        default: 'calc(100vh - 78px)',
+      },
+    },
+    setup(props) {
+      const chartRef = ref<HTMLDivElement | null>(null);
+      const { setOptions, echarts } = useECharts(chartRef as Ref<HTMLDivElement>);
+      const option = reactive({
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'shadow',
+            label: {
+              show: true,
+              backgroundColor: '#333',
+            },
+          },
+        },
+        xAxis: {
+          type: 'category',
+          data: [],
+        },
+        yAxis: {
+          type: 'value',
+        },
+        series: [
+          {
+            type: 'line',
+            showSymbol: false,
+            smooth: true,
+            areaStyle: {},
+            data: [],
+          },
+        ],
+      });
+
+      watchEffect(() => {
+        props.chartData && initCharts();
+      });
+
+      function initCharts() {
+        if (props.option) {
+          Object.assign(option, props.option);
         }
-    });
+        let seriesData = props.chartData.map((item) => {
+          return item.value;
+        });
+        let xAxisData = props.chartData.map((item) => {
+          return item.name;
+        });
+        option.series[0].data = seriesData;
+        option.xAxis.data = xAxisData;
+        setOptions(option);
+      }
+      return { chartRef };
+    },
+  });
 </script>
diff --git a/src/components/chart/LineMulti.vue b/src/components/chart/LineMulti.vue
index c3bf7ca..73a9a28 100644
--- a/src/components/chart/LineMulti.vue
+++ b/src/components/chart/LineMulti.vue
@@ -1,98 +1,98 @@
 <template>
-    <div ref="chartRef" :style="{ height, width }"></div>
+  <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
-    import {defineComponent, PropType, ref, Ref, reactive, watchEffect} from 'vue';
-    import {useECharts} from '/@/hooks/web/useECharts';
+  import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue';
+  import { useECharts } from '/@/hooks/web/useECharts';
 
-    export default defineComponent({
-        name: "lineMulti",
-        props: {
-            chartData: {
-                type: Array,
-                default: () => ([]),
-                required: true
-            },
-            option: {
-                type: Object,
-                default: () => ({}),
-            },
-            type:{
-                type: String as PropType<string>,
-                default: 'bar',
-            },
-            width: {
-                type: String as PropType<string>,
-                default: '100%',
-            },
-            height: {
-                type: String as PropType<string>,
-                default: 'calc(100vh - 78px)',
+  export default defineComponent({
+    name: 'lineMulti',
+    props: {
+      chartData: {
+        type: Array,
+        default: () => [],
+        required: true,
+      },
+      option: {
+        type: Object,
+        default: () => ({}),
+      },
+      type: {
+        type: String as PropType<string>,
+        default: 'bar',
+      },
+      width: {
+        type: String as PropType<string>,
+        default: '100%',
+      },
+      height: {
+        type: String as PropType<string>,
+        default: 'calc(100vh - 78px)',
+      },
+    },
+    emits: ['click'],
+    setup(props, { emit }) {
+      const chartRef = ref<HTMLDivElement | null>(null);
+      const { setOptions, getInstance } = useECharts(chartRef as Ref<HTMLDivElement>);
+      const option = reactive({
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'shadow',
+            label: {
+              show: true,
+              backgroundColor: '#333',
             },
+          },
         },
-        emits: ['click'],
-        setup(props, {emit}) {
-            const chartRef = ref<HTMLDivElement | null>(null);
-            const {setOptions, getInstance} = useECharts(chartRef as Ref<HTMLDivElement>);
-            const option = reactive({
-                tooltip: {
-                    trigger: 'axis',
-                    axisPointer: {
-                        type: 'shadow',
-                        label: {
-                            show: true,
-                            backgroundColor: '#333',
-                        },
-                    },
-                },
-                legend: {
-                    top:30
-                },
-                grid: {
-                    top:60,
-                },
-                xAxis: {
-                    type: 'category',
-                    data: [],
-                },
-                yAxis: {
-                    type: 'value',
-                },
-                series: [],
-            });
+        legend: {
+          top: 30,
+        },
+        grid: {
+          top: 60,
+        },
+        xAxis: {
+          type: 'category',
+          data: [],
+        },
+        yAxis: {
+          type: 'value',
+        },
+        series: [],
+      });
 
-            watchEffect(() => {
-                props.chartData && initCharts();
-            });
+      watchEffect(() => {
+        props.chartData && initCharts();
+      });
 
-            function initCharts() {
-                if (props.option) {
-                    Object.assign(option, props.option);
-                }
-                //图例类型
-                let typeArr = Array.from(new Set(props.chartData.map(item => (item.type))));
-                //轴数据
-                let xAxisData = Array.from(new Set(props.chartData.map(item => (item.name))));
-                let seriesData = [];
-                typeArr.forEach(type => {
-                    let obj = {name:type,type:props.type};
-                    let chartArr = props.chartData.filter(item => type === item.type);
-                    //data数据
-                    obj['data'] = chartArr.map(item => (item.value))
-                    seriesData.push(obj);
-                })
-                option.series = seriesData;
-                option.xAxis.data = xAxisData;
-                setOptions(option);
-                getInstance()?.off('click', onClick)
-                getInstance()?.on('click', onClick)
-            }
-
-            function onClick(params) {
-              emit('click', params)
-            }
-
-            return {chartRef};
+      function initCharts() {
+        if (props.option) {
+          Object.assign(option, props.option);
         }
-    });
+        //图例类型
+        let typeArr = Array.from(new Set(props.chartData.map((item) => item.type)));
+        //轴数据
+        let xAxisData = Array.from(new Set(props.chartData.map((item) => item.name)));
+        let seriesData = [];
+        typeArr.forEach((type) => {
+          let obj = { name: type, type: props.type };
+          let chartArr = props.chartData.filter((item) => type === item.type);
+          //data数据
+          obj['data'] = chartArr.map((item) => item.value);
+          seriesData.push(obj);
+        });
+        option.series = seriesData;
+        option.xAxis.data = xAxisData;
+        setOptions(option);
+        getInstance()?.off('click', onClick);
+        getInstance()?.on('click', onClick);
+      }
+
+      function onClick(params) {
+        emit('click', params);
+      }
+
+      return { chartRef };
+    },
+  });
 </script>
diff --git a/src/components/chart/Pie.vue b/src/components/chart/Pie.vue
index 9fd26d7..6dafddc 100644
--- a/src/components/chart/Pie.vue
+++ b/src/components/chart/Pie.vue
@@ -2,21 +2,21 @@
   <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
-  import { defineComponent, PropType, ref, Ref,watchEffect,reactive,watch } from 'vue';
+  import { defineComponent, PropType, ref, Ref, watchEffect, reactive, watch } from 'vue';
   import { useECharts } from '/@/hooks/web/useECharts';
 
   export default defineComponent({
-    name:"Pie",
+    name: 'Pie',
     props: {
-      chartData:{
+      chartData: {
         type: Array,
-        default: () => ([]),
+        default: () => [],
       },
       size: {
         type: Object,
-        default: ()=>{}
+        default: () => {},
       },
-      option:{
+      option: {
         type: Object,
         default: () => ({}),
       },
@@ -29,61 +29,61 @@
         default: 'calc(100vh - 78px)',
       },
     },
-      emits: ['click'],
-      setup(props, {emit}) {
+    emits: ['click'],
+    setup(props, { emit }) {
       const chartRef = ref<HTMLDivElement | null>(null);
-      const { setOptions, getInstance,resize } = useECharts(chartRef as Ref<HTMLDivElement>);
-        const option = reactive({
-            tooltip: {
-                formatter: '{b} ({c})',
-            },
-            series: [
-                {
-                    type: 'pie',
-                    radius: '72%',
-                    center: ['50%', '55%'],
-                    data: [],
-                    labelLine: { show: true },
-                    label: {
-                        show: true,
-                        formatter: '{b} \n ({d}%)',
-                        color: '#B1B9D3',
-                    },
-                }
-            ],
-        });
-
-        watchEffect(() => {
-            props.chartData && initCharts();
-        });
-          /**
-           * 监听拖拽大小变化
-           */
-        watch(
-          () => props.size,
-          () => {
-              resize();
-          },
+      const { setOptions, getInstance, resize } = useECharts(chartRef as Ref<HTMLDivElement>);
+      const option = reactive({
+        tooltip: {
+          formatter: '{b} ({c})',
+        },
+        series: [
           {
-              immediate: true,
-          }
-        );
-        function initCharts(){
-            if(props.option){
-                Object.assign(option,props.option);
-            }
-            option.series[0].data = props.chartData;
-            setOptions(option);
-            resize();
-            getInstance()?.off('click', onClick)
-            getInstance()?.on('click', onClick)
-        }
+            type: 'pie',
+            radius: '72%',
+            center: ['50%', '55%'],
+            data: [],
+            labelLine: { show: true },
+            label: {
+              show: true,
+              formatter: '{b} \n ({d}%)',
+              color: '#B1B9D3',
+            },
+          },
+        ],
+      });
 
-        function onClick(params) {
-          emit('click', params)
+      watchEffect(() => {
+        props.chartData && initCharts();
+      });
+      /**
+       * 监听拖拽大小变化
+       */
+      watch(
+        () => props.size,
+        () => {
+          resize();
+        },
+        {
+          immediate: true,
         }
+      );
+      function initCharts() {
+        if (props.option) {
+          Object.assign(option, props.option);
+        }
+        option.series[0].data = props.chartData;
+        setOptions(option);
+        resize();
+        getInstance()?.off('click', onClick);
+        getInstance()?.on('click', onClick);
+      }
+
+      function onClick(params) {
+        emit('click', params);
+      }
 
       return { chartRef };
-    }
+    },
   });
 </script>
diff --git a/src/components/chart/README.md b/src/components/chart/README.md
index f41ad93..ee301ef 100644
--- a/src/components/chart/README.md
+++ b/src/components/chart/README.md
@@ -4,34 +4,34 @@
 
 ##### 引用方式
 
-```js 
+```js
 import Bar from '/@/components/chart/Bar.vue';
 ```
 
 ##### 参数列表
 
-| 参数名        | 类型     | 必填 | 说明         |
-|------------|--------|----|------------|
-| chartData | array  | ✔️ | 报表数据源      |
-| width     | number |    | 报表宽度 |
-| height     | number |    | 报表高度 |
+| 参数名    | 类型   | 必填 | 说明       |
+| --------- | ------ | ---- | ---------- |
+| chartData | array  | ✔️   | 报表数据源 |
+| width     | number |      | 报表宽度   |
+| height    | number |      | 报表高度   |
 
 ##### chartData 示例
 
 ```json
 [
-    {
-        "name": "1月",
-        "value": 320
-    },
-    {
-        "name": "2月",
-        "value": 457
-    },
-    {
-        "name": "3月",
-        "value": 182
-    }
+  {
+    "name": "1月",
+    "value": 320
+  },
+  {
+    "name": "2月",
+    "value": 457
+  },
+  {
+    "name": "3月",
+    "value": 182
+  }
 ]
 ```
 
@@ -39,25 +39,25 @@ import Bar from '/@/components/chart/Bar.vue';
 
 ```html
 <template>
-     <Bar :chartData="chartData"></Bar>
+  <Bar :chartData="chartData"></Bar>
 </template>
 
 <script lang="ts" setup>
-    import Bar from '/@/components/chart/Bar.vue';
-    const chartData = [
-         {
-             "name": "1月",
-             "value": 320
-         },
-         {
-             "name": "2月",
-             "value": 457
-         },
-         {
-             "name": "3月",
-             "value": 182
-         }
-     ]
+  import Bar from '/@/components/chart/Bar.vue';
+  const chartData = [
+    {
+      name: '1月',
+      value: 320,
+    },
+    {
+      name: '2月',
+      value: 457,
+    },
+    {
+      name: '3月',
+      value: 182,
+    },
+  ];
 </script>
 
 <style></style>
@@ -67,94 +67,92 @@ import Bar from '/@/components/chart/Bar.vue';
 
 ##### 引用方式
 
-```js 
+```js
 import BarMulti from '/@/components/chart/BarMulti.vue';
 ```
 
 ##### 参数列表
 
-| 参数名        | 类型     | 必填 | 说明         |
-|------------|--------|----|------------|
-| chartData | array  | ✔️ | 报表数据源      |
-| width     | number |    | 报表宽度 |
-| height     | number |    | 报表高度 |
-
-
+| 参数名    | 类型   | 必填 | 说明       |
+| --------- | ------ | ---- | ---------- |
+| chartData | array  | ✔️   | 报表数据源 |
+| width     | number |      | 报表宽度   |
+| height    | number |      | 报表高度   |
 
 ##### chartData 示例
 
 ```json
 [
-     {
-         "name": "1月",
-         "value": 320,
-         "type": "2021"
-     },
-     {
-         "name": "2月",
-         "value": 457,
-         "type": "2021"
-     },
-     {
-         "name": "3月",
-         "value": 182,
-         "type": "2021"
-     },
-     {
-          "name": "1月",
-          "value": 240,
-          "type": "2022"
-      },
-      {
-          "name": "2月",
-          "value": 357,
-          "type": "2022"
-      },
-      {
-          "name": "3月",
-          "value": 456,
-          "type": "2022"
-      }
- ]
+  {
+    "name": "1月",
+    "value": 320,
+    "type": "2021"
+  },
+  {
+    "name": "2月",
+    "value": 457,
+    "type": "2021"
+  },
+  {
+    "name": "3月",
+    "value": 182,
+    "type": "2021"
+  },
+  {
+    "name": "1月",
+    "value": 240,
+    "type": "2022"
+  },
+  {
+    "name": "2月",
+    "value": 357,
+    "type": "2022"
+  },
+  {
+    "name": "3月",
+    "value": 456,
+    "type": "2022"
+  }
+]
 ```
 
 ## 迷你柱状图
- 同柱形图，修改配置即可
 
+同柱形图，修改配置即可
 
 ## 面积图
 
 ##### 引用方式
 
-```js 
+```js
 import Line from '/@/components/chart/Line.vue';
 ```
 
 ##### 参数列表
 
-| 参数名        | 类型     | 必填 | 说明         |
-|------------|--------|----|------------|
-| chartData | array  | ✔️ | 报表数据源      |
-| width     | number |    | 报表宽度 |
-| height     | number |    | 报表高度 |
-| option     | object |    | 配置项 |
+| 参数名    | 类型   | 必填 | 说明       |
+| --------- | ------ | ---- | ---------- |
+| chartData | array  | ✔️   | 报表数据源 |
+| width     | number |      | 报表宽度   |
+| height    | number |      | 报表高度   |
+| option    | object |      | 配置项     |
 
 ##### chartData 示例
 
 ```json
 [
-    {
-     "name": "1月",
-     "value": 320
-     },
-    {
-     "name": "2月",
-     "value": 457
-    },
-    {
-     "name": "3月",
-     "value": 182
-    }
+  {
+    "name": "1月",
+    "value": 320
+  },
+  {
+    "name": "2月",
+    "value": 457
+  },
+  {
+    "name": "3月",
+    "value": 182
+  }
 ]
 ```
 
@@ -162,50 +160,49 @@ import Line from '/@/components/chart/Line.vue';
 
 ##### 引用方式
 
-```js 
+```js
 import LineMulti from '/@/components/chart/LineMulti.vue';
 ```
 
 ##### 参数列表
 
-| 参数名        | 类型     | 必填 | 说明         |
-|------------|--------|----|------------|
-| chartData | array  | ✔️ | 报表数据源      |
-| width     | number |    | 报表宽度 |
-| height     | number |    | 报表高度 |
-| option     | object |    | 配置项 |
-
+| 参数名    | 类型   | 必填 | 说明       |
+| --------- | ------ | ---- | ---------- |
+| chartData | array  | ✔️   | 报表数据源 |
+| width     | number |      | 报表宽度   |
+| height    | number |      | 报表高度   |
+| option    | object |      | 配置项     |
 
 ##### chartData 示例
-同柱形图
 
+同柱形图
 
 ## 饼状图
 
 ##### 引用方式
 
-```js 
-import Pie from '/@/components/chart/Pie'
+```js
+import Pie from '/@/components/chart/Pie';
 ```
 
 ##### 参数列表
 
-| 参数名        | 类型     | 必填 | 说明         |
-|------------|--------|----|------------|
-| chartData | array  | ✔️ | 报表数据源      |
-| width     | number |    | 报表宽度 |
-| height     | number |    | 报表高度 |
-| option     | object |    | 配置项 |
+| 参数名    | 类型   | 必填 | 说明       |
+| --------- | ------ | ---- | ---------- |
+| chartData | array  | ✔️   | 报表数据源 |
+| width     | number |      | 报表宽度   |
+| height    | number |      | 报表高度   |
+| option    | object |      | 配置项     |
 
 ##### chartData 示例
 
 ```json
 [
-    { "name": "一月", "value": 40 },
-    { "name": "二月", "value": 21 },
-    { "name": "三月", "value": 17 },
-    { "name": "四月", "value": 13 },
-    { "name": "五月", "value": 9 }
+  { "name": "一月", "value": 40 },
+  { "name": "二月", "value": 21 },
+  { "name": "三月", "value": 17 },
+  { "name": "四月", "value": 13 },
+  { "name": "五月", "value": 9 }
 ]
 ```
 
@@ -213,28 +210,28 @@ import Pie from '/@/components/chart/Pie'
 
 ##### 引用方式
 
-```js 
-import Radar from '/@/components/chart/Radar'
+```js
+import Radar from '/@/components/chart/Radar';
 ```
 
 ##### 参数列表
 
-| 参数名        | 类型     | 必填 | 说明         |
-|------------|--------|----|------------|
-| chartData | array  | ✔️ | 报表数据源      |
-| width     | number |    | 报表宽度 |
-| height     | number |    | 报表高度 |
-| option     | object |    | 配置项 |
+| 参数名    | 类型   | 必填 | 说明       |
+| --------- | ------ | ---- | ---------- |
+| chartData | array  | ✔️   | 报表数据源 |
+| width     | number |      | 报表宽度   |
+| height    | number |      | 报表高度   |
+| option    | object |      | 配置项     |
 
 ##### chartData 示例
 
 ```json
 [
-    { "item": "一月", "score": 40 },
-    { "item": "二月", "score": 20 },
-    { "item": "三月", "score": 67 },
-    { "item": "四月", "score": 43 },
-    { "item": "五月", "score": 90 }
+  { "item": "一月", "score": 40 },
+  { "item": "二月", "score": 20 },
+  { "item": "三月", "score": 67 },
+  { "item": "四月", "score": 43 },
+  { "item": "五月", "score": 90 }
 ]
 ```
 
@@ -242,44 +239,44 @@ import Radar from '/@/components/chart/Radar'
 
 ##### 引用方式
 
-```js 
-import Gauge from '/@/components/chart/Gauge'
+```js
+import Gauge from '/@/components/chart/Gauge';
 ```
 
 ##### 参数列表
 
-| 参数名        | 类型     | 必填 | 说明         |
-|------------|--------|----|------------|
-| chartData | array  | ✔️ | 报表数据源      |
-| width     | number |    | 报表宽度 |
-| height     | number |    | 报表高度 |
-| option     | object |    | 配置项 |
+| 参数名    | 类型   | 必填 | 说明       |
+| --------- | ------ | ---- | ---------- |
+| chartData | array  | ✔️   | 报表数据源 |
+| width     | number |      | 报表宽度   |
+| height    | number |      | 报表高度   |
+| option    | object |      | 配置项     |
 
 ## 排名列表
 
 ##### 引用方式
 
-```js 
-import RankList from '@/components/chart/RankList'
+```js
+import RankList from '@/components/chart/RankList';
 ```
 
 ##### 参数列表
 
-| 参数名    | 类型     | 必填 | 说明           |
-|--------|--------|----|--------------|
-| title  | string |    | 报表标题         |
-| list   | array  |    | 排名列表数据       |
-| height | number |    | 报表高度，默认自适应高度 |
+| 参数名 | 类型   | 必填 | 说明                     |
+| ------ | ------ | ---- | ------------------------ |
+| title  | string |      | 报表标题                 |
+| list   | array  |      | 排名列表数据             |
+| height | number |      | 报表高度，默认自适应高度 |
 
 ##### list 示例
 
 ```json
 [
-    { "name": "北京朝阳 1 号店", "total": 1981 },
-    { "name": "北京朝阳 2 号店", "total": 1359 },
-    { "name": "北京朝阳 3 号店", "total": 1354 },
-    { "name": "北京朝阳 4 号店", "total": 263 },
-    { "name": "北京朝阳 5 号店", "total": 446 },
-    { "name": "北京朝阳 6 号店", "total": 796 }
+  { "name": "北京朝阳 1 号店", "total": 1981 },
+  { "name": "北京朝阳 2 号店", "total": 1359 },
+  { "name": "北京朝阳 3 号店", "total": 1354 },
+  { "name": "北京朝阳 4 号店", "total": 263 },
+  { "name": "北京朝阳 5 号店", "total": 446 },
+  { "name": "北京朝阳 6 号店", "total": 796 }
 ]
 ```
diff --git a/src/components/chart/Radar.vue b/src/components/chart/Radar.vue
index b9a7ca4..e4ef64c 100644
--- a/src/components/chart/Radar.vue
+++ b/src/components/chart/Radar.vue
@@ -1,92 +1,96 @@
 <template>
-    <div ref="chartRef" :style="{ height, width }"></div>
+  <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
-    import {defineComponent, PropType, ref, Ref,reactive,watchEffect} from 'vue';
-    import {useECharts} from '/@/hooks/web/useECharts';
-    
-    export default defineComponent({
-        name: "Radar",
-        props: {
-            chartData:{
-                type: Array,
-                default: () => ([]),
-            },
-            option:{
-                type: Object,
-                default: () => ({}),
-            },
-            width: {
-                type: String as PropType<string>,
-                default: '100%',
-            },
-            height: {
-                type: String as PropType<string>,
-                default: 'calc(100vh - 78px)',
-            },
+  import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue';
+  import { useECharts } from '/@/hooks/web/useECharts';
+
+  export default defineComponent({
+    name: 'Radar',
+    props: {
+      chartData: {
+        type: Array,
+        default: () => [],
+      },
+      option: {
+        type: Object,
+        default: () => ({}),
+      },
+      width: {
+        type: String as PropType<string>,
+        default: '100%',
+      },
+      height: {
+        type: String as PropType<string>,
+        default: 'calc(100vh - 78px)',
+      },
+    },
+    setup(props) {
+      const chartRef = ref<HTMLDivElement | null>(null);
+      const { setOptions, echarts } = useECharts(chartRef as Ref<HTMLDivElement>);
+      const option = reactive({
+        title: {
+          text: '基础雷达图',
         },
-        setup(props) {
-            const chartRef = ref<HTMLDivElement | null>(null);
-            const {setOptions, echarts} = useECharts(chartRef as Ref<HTMLDivElement>);
-            const option = reactive({
-                title: {
-                    text: '基础雷达图'
-                },
-                legend: {
-                    data: ['文综', '理综']
-                },
-                radar: {
-                    indicator: [
-                        { name: '历史', max: 100 },
-                        { name: '地理', max: 110 },
-                        { name: '生物', max: 120 },
-                        { name: '化学', max: 130 },
-                        { name: '物理', max: 140 },
-                        { name: '政治', max: 150 }
-                    ]
-                },
-                series: [
-                    {
-                        type: 'radar',
-                        data: [
-                            {
-                                value: [82, 70, 60, 55, 90, 66],
-                                name: '文综'
-                            }
-                        ]
-                    }
-                ]
-            });
-            
-            watchEffect(() => {
-                props.chartData && initCharts();
-            });
-            
-            function initCharts(){
-                if(props.option){
-                    Object.assign(option,props.option);
-                }
-                //图例类型
-                let typeArr = Array.from(new Set(props.chartData.map(item => (item.type))));
-                //雷达数据
-                let indicator = Array.from(new Set(props.chartData.map(item => {
-                    let {name,max} = item
-                    return {name,max}
-                })));
-              
-                let data = [];
-                typeArr.forEach(type => {
-                    let obj={name:type};
-                    let chartArr = props.chartData.filter(item => type === item.type);
-                    obj['value'] = chartArr.map(item => (item.value));
-                    //data数据
-                    data.push(obj);
-                })
-                option.radar.indicator = indicator;
-                option.series[0]['data'] = data;
-                setOptions(option);
-            }
-            return {chartRef};
+        legend: {
+          data: ['文综', '理综'],
+        },
+        radar: {
+          indicator: [
+            { name: '历史', max: 100 },
+            { name: '地理', max: 110 },
+            { name: '生物', max: 120 },
+            { name: '化学', max: 130 },
+            { name: '物理', max: 140 },
+            { name: '政治', max: 150 },
+          ],
+        },
+        series: [
+          {
+            type: 'radar',
+            data: [
+              {
+                value: [82, 70, 60, 55, 90, 66],
+                name: '文综',
+              },
+            ],
+          },
+        ],
+      });
+
+      watchEffect(() => {
+        props.chartData && initCharts();
+      });
+
+      function initCharts() {
+        if (props.option) {
+          Object.assign(option, props.option);
         }
-    });
+        //图例类型
+        let typeArr = Array.from(new Set(props.chartData.map((item) => item.type)));
+        //雷达数据
+        let indicator = Array.from(
+          new Set(
+            props.chartData.map((item) => {
+              let { name, max } = item;
+              return { name, max };
+            })
+          )
+        );
+
+        let data = [];
+        typeArr.forEach((type) => {
+          let obj = { name: type };
+          let chartArr = props.chartData.filter((item) => type === item.type);
+          obj['value'] = chartArr.map((item) => item.value);
+          //data数据
+          data.push(obj);
+        });
+        option.radar.indicator = indicator;
+        option.series[0]['data'] = data;
+        setOptions(option);
+      }
+      return { chartRef };
+    },
+  });
 </script>
diff --git a/src/components/chart/RankList.vue b/src/components/chart/RankList.vue
index cb48f06..e2022a4 100644
--- a/src/components/chart/RankList.vue
+++ b/src/components/chart/RankList.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="rank">
     <h4 class="title">{{ title }}</h4>
-    <ul class="list" :style="{height:height?`${height}px`:'auto',overflow:'auto'}">
+    <ul class="list" :style="{ height: height ? `${height}px` : 'auto', overflow: 'auto' }">
       <li :key="index" v-for="(item, index) in list">
         <span :class="index < 3 ? 'active' : null">{{ index + 1 }}</span>
         <span>{{ item.name }}</span>
@@ -12,28 +12,27 @@
 </template>
 
 <script lang="ts">
-  import {defineComponent} from 'vue';  
+  import { defineComponent } from 'vue';
   export default defineComponent({
-      name: "RankList",
-      props: {
-          title: {
-              type: String,
-              default: ''
-          },
-          list: {
-              type: Array,
-              default: null
-          },
-          height: {
-              type: Number,
-              default: null
-          }
-      } 
-  })
+    name: 'RankList',
+    props: {
+      title: {
+        type: String,
+        default: '',
+      },
+      list: {
+        type: Array,
+        default: null,
+      },
+      height: {
+        type: Number,
+        default: null,
+      },
+    },
+  });
 </script>
 
 <style lang="less" scoped>
-
   .rank {
     padding: 0 32px 32px 72px;
 
@@ -46,7 +45,7 @@
         margin-top: 16px;
 
         span {
-          color: rgba(0, 0, 0, .65);
+          color: rgba(0, 0, 0, 0.65);
           font-size: 14px;
           line-height: 22px;
 
@@ -77,5 +76,4 @@
   .mobile .rank {
     padding: 0 32px 32px 32px;
   }
-
 </style>
diff --git a/src/components/chart/StackBar.vue b/src/components/chart/StackBar.vue
index 29c5d3a..30b2f3d 100644
--- a/src/components/chart/StackBar.vue
+++ b/src/components/chart/StackBar.vue
@@ -1,107 +1,107 @@
 <template>
-    <div ref="chartRef" :style="{ height, width }"></div>
+  <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
-    import {defineComponent, PropType, ref, Ref, reactive, watchEffect,watch} from 'vue';
-    import {useECharts} from '/@/hooks/web/useECharts';
+  import { defineComponent, PropType, ref, Ref, reactive, watchEffect, watch } from 'vue';
+  import { useECharts } from '/@/hooks/web/useECharts';
 
-    export default defineComponent({
-        name: "StackBar",
-        props: {
-            chartData: {
-                type: Array,
-                default: () => ([]),
-                required: true
-            },
-            size: {
-                type: Object,
-                default: ()=>{}
-            },
-            option: {
-                type: Object,
-                default: () => ({}),
-            },
-            type:{
-                type: String as PropType<string>,
-                default: 'bar', 
-            },
-            width: {
-                type: String as PropType<string>,
-                default: '100%',
-            },
-            height: {
-                type: String as PropType<string>,
-                default: 'calc(100vh - 78px)',
+  export default defineComponent({
+    name: 'StackBar',
+    props: {
+      chartData: {
+        type: Array,
+        default: () => [],
+        required: true,
+      },
+      size: {
+        type: Object,
+        default: () => {},
+      },
+      option: {
+        type: Object,
+        default: () => ({}),
+      },
+      type: {
+        type: String as PropType<string>,
+        default: 'bar',
+      },
+      width: {
+        type: String as PropType<string>,
+        default: '100%',
+      },
+      height: {
+        type: String as PropType<string>,
+        default: 'calc(100vh - 78px)',
+      },
+    },
+    setup(props) {
+      const chartRef = ref<HTMLDivElement | null>(null);
+      const { setOptions, echarts, resize } = useECharts(chartRef as Ref<HTMLDivElement>);
+      const option = reactive({
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'shadow',
+            label: {
+              show: true,
+              backgroundColor: '#333',
             },
+          },
         },
-        setup(props) {
-            const chartRef = ref<HTMLDivElement | null>(null);
-            const {setOptions, echarts,resize} = useECharts(chartRef as Ref<HTMLDivElement>);
-            const option = reactive({
-                tooltip: {
-                    trigger: 'axis',
-                    axisPointer: {
-                        type: 'shadow',
-                        label: {
-                            show: true,
-                            backgroundColor: '#333',
-                        },
-                    },
-                },
-                legend: {
-                    top:30
-                },
-                grid: {
-                    top:60,
-                },
-                xAxis: {
-                    type: 'value',
-                },
-                yAxis: {
-                    type: 'category',
-                    data:[]
-                },
-                series: [],
-            });
+        legend: {
+          top: 30,
+        },
+        grid: {
+          top: 60,
+        },
+        xAxis: {
+          type: 'value',
+        },
+        yAxis: {
+          type: 'category',
+          data: [],
+        },
+        series: [],
+      });
 
-            watchEffect(() => {
-                props.chartData && initCharts();
-            });
-            /**
-             * 监听拖拽大小变化
-             */
-            watch(
-                () => props.size,
-                () => {
-                    console.log("props.size",props.size)
-                    resize();
-                },
-                {
-                    immediate: true,
-                }
-            );
-            function initCharts() {
-                if (props.option) {
-                    Object.assign(option, props.option);
-                }
-                //图例类型
-                let typeArr = Array.from(new Set(props.chartData.map(item => (item.type))));
-                //轴数据
-                let yAxisData = Array.from(new Set(props.chartData.map(item => (item.name))));
-                let seriesData = [];
-                typeArr.forEach(type => {
-                    let obj = {name:type,type:props.type,stack: 'total'};
-                    let chartArr = props.chartData.filter(item => type === item.type);
-                    //data数据
-                    obj['data'] = chartArr.map(item => (item.value))
-                    seriesData.push(obj);
-                })
-                option.series = seriesData;
-                option.yAxis.data = yAxisData;
-                setOptions(option);
-            }
-
-            return {chartRef};
+      watchEffect(() => {
+        props.chartData && initCharts();
+      });
+      /**
+       * 监听拖拽大小变化
+       */
+      watch(
+        () => props.size,
+        () => {
+          console.log('props.size', props.size);
+          resize();
+        },
+        {
+          immediate: true,
         }
-    });
+      );
+      function initCharts() {
+        if (props.option) {
+          Object.assign(option, props.option);
+        }
+        //图例类型
+        let typeArr = Array.from(new Set(props.chartData.map((item) => item.type)));
+        //轴数据
+        let yAxisData = Array.from(new Set(props.chartData.map((item) => item.name)));
+        let seriesData = [];
+        typeArr.forEach((type) => {
+          let obj = { name: type, type: props.type, stack: 'total' };
+          let chartArr = props.chartData.filter((item) => type === item.type);
+          //data数据
+          obj['data'] = chartArr.map((item) => item.value);
+          seriesData.push(obj);
+        });
+        option.series = seriesData;
+        option.yAxis.data = yAxisData;
+        setOptions(option);
+      }
+
+      return { chartRef };
+    },
+  });
 </script>
diff --git a/src/components/chart/Trend.vue b/src/components/chart/Trend.vue
index 5ff291e..a0725aa 100644
--- a/src/components/chart/Trend.vue
+++ b/src/components/chart/Trend.vue
@@ -1,87 +1,88 @@
 <template>
-    <div class="chart-trend">
-        {{ term }}
-        <span>{{ rate }}%</span>
-        <span :class="['trend-icon', trend]"><Icon :icon="'ant-design:caret-' + trend + '-outlined'"/></span>
-    </div>
+  <div class="chart-trend">
+    {{ term }}
+    <span>{{ rate }}%</span>
+    <span :class="['trend-icon', trend]"><Icon :icon="'ant-design:caret-' + trend + '-outlined'" /></span>
+  </div>
 </template>
 
 <script lang="ts">
-    import {defineComponent, computed} from 'vue';
+  import { defineComponent, computed } from 'vue';
 
-    export default defineComponent({
-        name: "Trend",
-        props: {
-            // 同title
-            term: {
-                type: String,
-                default: '',
-                required: true
-            },
-            // 百分比
-            percentage: {
-                type: Number,
-                default: null
-            },
-            type: {
-                type: Boolean,
-                default: null
-            },
-            target: {
-                type: Number,
-                default: 0
-            },
-            value: {
-                type: Number,
-                default: 0
-            },
-            fixed: {
-                type: Number,
-                default: 2
-            }
-        },
-        setup(props) {
-            const trend = computed(() => {
-                let type=props.type === null ? props.value >= props.target : props.type;
-                return type ? 'up' : 'down'
-            });
-            const rate = computed(() => ((props.percentage === null ? Math.abs(props.value - props.target) * 100 / props.target : props.percentage).toFixed(props.fixed)));
-            return {
-                trend,
-                rate,
-            }
-        }
-    })
+  export default defineComponent({
+    name: 'Trend',
+    props: {
+      // 同title
+      term: {
+        type: String,
+        default: '',
+        required: true,
+      },
+      // 百分比
+      percentage: {
+        type: Number,
+        default: null,
+      },
+      type: {
+        type: Boolean,
+        default: null,
+      },
+      target: {
+        type: Number,
+        default: 0,
+      },
+      value: {
+        type: Number,
+        default: 0,
+      },
+      fixed: {
+        type: Number,
+        default: 2,
+      },
+    },
+    setup(props) {
+      const trend = computed(() => {
+        let type = props.type === null ? props.value >= props.target : props.type;
+        return type ? 'up' : 'down';
+      });
+      const rate = computed(() => (props.percentage === null ? (Math.abs(props.value - props.target) * 100) / props.target : props.percentage).toFixed(props.fixed));
+      return {
+        trend,
+        rate,
+      };
+    },
+  });
 </script>
 
 <style lang="less" scoped>
-    .chart-trend {
-        display: inline-block;
-        font-size: 14px;
-        line-height: 22px;
+  .chart-trend {
+    display: inline-block;
+    font-size: 14px;
+    line-height: 22px;
 
-        .trend-icon {
-            font-size: 12px;
+    .trend-icon {
+      font-size: 12px;
 
-            &.up, &.down {
-                margin-left: 4px;
-                position: relative;
-                top: 1px;
+      &.up,
+      &.down {
+        margin-left: 4px;
+        position: relative;
+        top: 1px;
 
-                i {
-                    font-size: 12px;
-                    transform: scale(.83);
-                }
-            }
-
-            &.up {
-                color: #f5222d;
-            }
-
-            &.down {
-                color: #52c41a;
-                top: -1px;
-            }
+        i {
+          font-size: 12px;
+          transform: scale(0.83);
         }
+      }
+
+      &.up {
+        color: #f5222d;
+      }
+
+      &.down {
+        color: #52c41a;
+        top: -1px;
+      }
     }
+  }
 </style>
diff --git a/src/components/jeecg/AIcon.vue b/src/components/jeecg/AIcon.vue
index f92282d..4a73a5b 100644
--- a/src/components/jeecg/AIcon.vue
+++ b/src/components/jeecg/AIcon.vue
@@ -3,32 +3,30 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent } from 'vue'
-import { Icon } from '/@/components/Icon'
-import { isEmpty } from '/@/utils/is'
+  import { computed, defineComponent } from 'vue';
+  import { Icon } from '/@/components/Icon';
+  import { isEmpty } from '/@/utils/is';
 
-export default defineComponent({
-  name: 'AIcon',
-  components: { Icon },
-  props: {
-    icon: String,
-    type: String,
-  },
-  setup(props) {
-    const icon = computed(() => {
-      if (props.icon && !isEmpty(props.icon)) {
-        return props.icon
-      }
-      return `ant-design:${props.type}`
-    })
+  export default defineComponent({
+    name: 'AIcon',
+    components: { Icon },
+    props: {
+      icon: String,
+      type: String,
+    },
+    setup(props) {
+      const icon = computed(() => {
+        if (props.icon && !isEmpty(props.icon)) {
+          return props.icon;
+        }
+        return `ant-design:${props.type}`;
+      });
 
-    return {
-      icon,
-    }
-  },
-})
+      return {
+        icon,
+      };
+    },
+  });
 </script>
 
-<style scoped>
-
-</style>
\ No newline at end of file
+<style scoped></style>
diff --git a/src/components/jeecg/ExcelButton.vue b/src/components/jeecg/ExcelButton.vue
index 352882f..98d5fec 100644
--- a/src/components/jeecg/ExcelButton.vue
+++ b/src/components/jeecg/ExcelButton.vue
@@ -1,87 +1,84 @@
 <template>
-    <a-button type="primary" v-if="hasExportAuth() && config.export" preIcon="ant-design:export-outlined" @click="onExportXls()"> 导出</a-button>
-    <a-upload name="file" :showUploadList="false" v-if="hasImportAuth() && config.import" :customRequest="(file)=>onImportXls(file)">
-        <a-button type="primary" preIcon="ant-design:import-outlined">导入</a-button>
-    </a-upload>
+  <a-button type="primary" v-if="hasExportAuth() && config.export" preIcon="ant-design:export-outlined" @click="onExportXls()"> 导出</a-button>
+  <a-upload name="file" :showUploadList="false" v-if="hasImportAuth() && config.import" :customRequest="(file) => onImportXls(file)">
+    <a-button type="primary" preIcon="ant-design:import-outlined">导入</a-button>
+  </a-upload>
 </template>
 
 <script lang="ts" setup name="ExcelButton">
-    import {PropType} from 'vue';
-    import {usePermission} from '/@/hooks/web/usePermission';
-    import {useMethods} from '/@/hooks/system/useMethods';
-    import {useMessage} from '/@/hooks/web/useMessage'
+  import { PropType } from 'vue';
+  import { usePermission } from '/@/hooks/web/usePermission';
+  import { useMethods } from '/@/hooks/system/useMethods';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
-    // 定义 excel 方法所需参数
-    interface ExcelConfig {
-        // 导出配置
-        exportConfig: {
-            url: string,
-            // 导出文件名
-            name?: string | (() => string),
-            //按钮权限
-            auth?: string | string[]
-        }
-        // 导入配置
-        importConfig: {
-            url: string,
-            // 导出成功后的回调
-            success?: (fileInfo?: any) => void
-            //按钮权限
-            auth?: string | string[]
-        }
+  // 定义 excel 方法所需参数
+  interface ExcelConfig {
+    // 导出配置
+    exportConfig: {
+      url: string;
+      // 导出文件名
+      name?: string | (() => string);
+      //按钮权限
+      auth?: string | string[];
+    };
+    // 导入配置
+    importConfig: {
+      url: string;
+      // 导出成功后的回调
+      success?: (fileInfo?: any) => void;
+      //按钮权限
+      auth?: string | string[];
+    };
+  }
+  /**
+   * 定义组件参数
+   */
+  const props = defineProps({
+    config: {
+      type: Object as PropType<ExcelConfig>,
+      default: null,
+    },
+  });
+  //按钮权限问题
+  const { hasPermission } = usePermission();
+  //导入导出方法
+  const { handleExportXls, handleImportXls } = useMethods();
+
+  const $message = useMessage();
+  // 导出 excel
+  function onExportXls() {
+    let { url, name } = props.config?.export ?? {};
+    if (url) {
+      let title = typeof name === 'function' ? name() : name;
+      return handleExportXls(title as string, url);
+    } else {
+      $message.createMessage.warn('没有传递 export.url 参数');
+      return Promise.reject();
     }
-    /**
-     * 定义组件参数
-     */
-    const props = defineProps({
-        config: {
-            type: Object as PropType<ExcelConfig>,
-            default: null,
-        }
-    });
-    //按钮权限问题
-    const {hasPermission} = usePermission();
-    //导入导出方法
-    const {handleExportXls, handleImportXls} = useMethods();
+  }
 
-    const $message = useMessage()
-    // 导出 excel
-    function onExportXls() {
-        let {url, name} = props.config?.export ?? {}
-        if (url) {
-            let title = typeof name === 'function' ? name() : name
-            return handleExportXls(title as string, url)
-        } else {
-            $message.createMessage.warn('没有传递 export.url 参数')
-            return Promise.reject()
-        }
+  // 导入 excel
+  function onImportXls(file) {
+    let { url, success } = props.config?.import ?? {};
+    if (url) {
+      return handleImportXls(file, url, success);
+    } else {
+      $message.createMessage.warn('没有传递 import.url 参数');
+      return Promise.reject();
     }
+  }
 
-    // 导入 excel
-    function onImportXls(file) {
-        let {url, success} = props.config?.import ?? {}
-        if (url) {
-            return handleImportXls(file, url, success)
-        } else {
-            $message.createMessage.warn('没有传递 import.url 参数')
-            return Promise.reject()
-        }
-    }
-
-    // 导入按钮权限
-    function hasImportAuth() {
-        let auth= props.config?.import?.auth;
-        return auth && auth.length > 0 ? hasPermission(auth) : true
-    }
-
-    // 导出按钮权限
-    function hasExportAuth() {
-        let auth = props.config?.export?.auth;
-        return auth && auth.length > 0 ? hasPermission(auth) : true
-    }
+  // 导入按钮权限
+  function hasImportAuth() {
+    let auth = props.config?.import?.auth;
+    return auth && auth.length > 0 ? hasPermission(auth) : true;
+  }
 
+  // 导出按钮权限
+  function hasExportAuth() {
+    let auth = props.config?.export?.auth;
+    return auth && auth.length > 0 ? hasPermission(auth) : true;
+  }
 </script>
 
-<style scoped lang="less">
-
-</style>
+<style scoped lang="less"></style>
diff --git a/src/components/jeecg/JVxeTable/hooks.ts b/src/components/jeecg/JVxeTable/hooks.ts
index f2dd1d2..54c46fa 100644
--- a/src/components/jeecg/JVxeTable/hooks.ts
+++ b/src/components/jeecg/JVxeTable/hooks.ts
@@ -1,2 +1,2 @@
-export { useJVxeCompProps, useJVxeComponent } from './src/hooks/useJVxeComponent'
-export { useResolveComponent } from './src/hooks/useData'
+export { useJVxeCompProps, useJVxeComponent } from './src/hooks/useJVxeComponent';
+export { useResolveComponent } from './src/hooks/useData';
diff --git a/src/components/jeecg/JVxeTable/index.ts b/src/components/jeecg/JVxeTable/index.ts
index 032b2ad..b288fbb 100644
--- a/src/components/jeecg/JVxeTable/index.ts
+++ b/src/components/jeecg/JVxeTable/index.ts
@@ -1,4 +1,4 @@
-export { default as JVxeTable } from './src/JVxeTable'
-export { registerJVxeTable } from './src/install'
-export { deleteComponent } from './src/componentMap'
-export { registerComponent, registerAsyncComponent } from './src/utils/registerUtils'
\ No newline at end of file
+export { default as JVxeTable } from './src/JVxeTable';
+export { registerJVxeTable } from './src/install';
+export { deleteComponent } from './src/componentMap';
+export { registerComponent, registerAsyncComponent } from './src/utils/registerUtils';
diff --git a/src/components/jeecg/JVxeTable/src/JVxeTable.ts b/src/components/jeecg/JVxeTable/src/JVxeTable.ts
index 2f2e755..8894206 100644
--- a/src/components/jeecg/JVxeTable/src/JVxeTable.ts
+++ b/src/components/jeecg/JVxeTable/src/JVxeTable.ts
@@ -1,14 +1,14 @@
-import { useSlots, defineComponent, getCurrentInstance, h } from 'vue'
-import { vxeEmits, vxeProps } from './vxe.data'
-import { useData, useRefs, useResolveComponent as rc } from './hooks/useData'
-import { useColumns } from './hooks/useColumns'
-import { useMethods } from './hooks/useMethods'
-import { useDataSource } from './hooks/useDataSource'
-import { useDragSort } from './hooks/useDragSort'
-import { useRenderComponents } from './hooks/useRenderComponents'
-import { useFinallyProps } from './hooks/useFinallyProps'
-import { JVxeTableProps } from './types'
-import './style/index.less'
+import { useSlots, defineComponent, getCurrentInstance, h } from 'vue';
+import { vxeEmits, vxeProps } from './vxe.data';
+import { useData, useRefs, useResolveComponent as rc } from './hooks/useData';
+import { useColumns } from './hooks/useColumns';
+import { useMethods } from './hooks/useMethods';
+import { useDataSource } from './hooks/useDataSource';
+import { useDragSort } from './hooks/useDragSort';
+import { useRenderComponents } from './hooks/useRenderComponents';
+import { useFinallyProps } from './hooks/useFinallyProps';
+import { JVxeTableProps } from './types';
+import './style/index.less';
 
 export default defineComponent({
   name: 'JVxeTable',
@@ -16,45 +16,57 @@ export default defineComponent({
   props: vxeProps(),
   emits: [...vxeEmits],
   setup(props: JVxeTableProps, context) {
-    const instance = getCurrentInstance()
-    const refs = useRefs()
-    const slots = useSlots()
-    const data = useData(props)
-    const { methods, publicMethods, created } = useMethods(props, context, data, refs, instance)
-    created()
-    useColumns(props, data, methods, slots)
-    useDataSource(props, data, methods, refs)
-    useDragSort(props, methods)
+    const instance = getCurrentInstance();
+    const refs = useRefs();
+    const slots = useSlots();
+    const data = useData(props);
+    const { methods, publicMethods, created } = useMethods(props, context, data, refs, instance);
+    created();
+    useColumns(props, data, methods, slots);
+    useDataSource(props, data, methods, refs);
+    useDragSort(props, methods);
     // 最终传入到 template 里的 props
-    const finallyProps = useFinallyProps(props, data, methods)
+    const finallyProps = useFinallyProps(props, data, methods);
     // 渲染子组件
-    const renderComponents = useRenderComponents(props, data, methods, slots)
+    const renderComponents = useRenderComponents(props, data, methods, slots);
     return {
       ...refs,
       ...publicMethods,
       ...finallyProps,
       ...renderComponents,
       vxeDataSource: data.vxeDataSource,
-    }
+    };
   },
   render() {
-    return h('div', {
-      style: this.$attrs.style,
-    }, h(rc('a-spin'), {
-      spinning: this.loading,
-      wrapperClassName: this.prefixCls,
-    }, {
-      default: () => [
-        this.renderSubPopover(),
-        this.renderToolbar(),
-        this.renderToolbarAfterSlot(),
-        h(rc('vxe-grid'), {
-          ...this.vxeProps,
-          data: this.vxeDataSource,
-        }, this.$slots),
-        this.renderPagination(),
-        this.renderDetailsModal(),
-      ],
-    }))
+    return h(
+      'div',
+      {
+        style: this.$attrs.style,
+      },
+      h(
+        rc('a-spin'),
+        {
+          spinning: this.loading,
+          wrapperClassName: this.prefixCls,
+        },
+        {
+          default: () => [
+            this.renderSubPopover(),
+            this.renderToolbar(),
+            this.renderToolbarAfterSlot(),
+            h(
+              rc('vxe-grid'),
+              {
+                ...this.vxeProps,
+                data: this.vxeDataSource,
+              },
+              this.$slots
+            ),
+            this.renderPagination(),
+            this.renderDetailsModal(),
+          ],
+        }
+      )
+    );
   },
-})
+});
diff --git a/src/components/jeecg/JVxeTable/src/componentMap.ts b/src/components/jeecg/JVxeTable/src/componentMap.ts
index 71a22e4..ab2707a 100644
--- a/src/components/jeecg/JVxeTable/src/componentMap.ts
+++ b/src/components/jeecg/JVxeTable/src/componentMap.ts
@@ -1,36 +1,30 @@
-import type { JVxeVueComponent } from './types'
-import { JVxeTypes } from './types/JVxeTypes'
+import type { JVxeVueComponent } from './types';
+import { JVxeTypes } from './types/JVxeTypes';
 
-import JVxeSlotCell from './components/cells/JVxeSlotCell'
-import JVxeNormalCell from './components/cells/JVxeNormalCell.vue'
-import JVxeDragSortCell from './components/cells/JVxeDragSortCell.vue'
+import JVxeSlotCell from './components/cells/JVxeSlotCell';
+import JVxeNormalCell from './components/cells/JVxeNormalCell.vue';
+import JVxeDragSortCell from './components/cells/JVxeDragSortCell.vue';
 
-import JVxeInputCell from './components/cells/JVxeInputCell.vue'
-import JVxeDateCell from './components/cells/JVxeDateCell.vue'
-import JVxeTimeCell from './components/cells/JVxeTimeCell.vue'
-import JVxeSelectCell from './components/cells/JVxeSelectCell.vue'
-import JVxeRadioCell from './components/cells/JVxeRadioCell.vue'
-import JVxeCheckboxCell from './components/cells/JVxeCheckboxCell.vue'
-import JVxeUploadCell from './components/cells/JVxeUploadCell.vue'
+import JVxeInputCell from './components/cells/JVxeInputCell.vue';
+import JVxeDateCell from './components/cells/JVxeDateCell.vue';
+import JVxeTimeCell from './components/cells/JVxeTimeCell.vue';
+import JVxeSelectCell from './components/cells/JVxeSelectCell.vue';
+import JVxeRadioCell from './components/cells/JVxeRadioCell.vue';
+import JVxeCheckboxCell from './components/cells/JVxeCheckboxCell.vue';
+import JVxeUploadCell from './components/cells/JVxeUploadCell.vue';
 // import { TagsInputCell, TagsSpanCell } from './components/cells/JVxeTagsCell.vue'
-import JVxeProgressCell from './components/cells/JVxeProgressCell.vue'
-import JVxeTextareaCell from './components/cells/JVxeTextareaCell.vue'
+import JVxeProgressCell from './components/cells/JVxeProgressCell.vue';
+import JVxeTextareaCell from './components/cells/JVxeTextareaCell.vue';
 // import JVxeDepartSelectCell from './components/cells/JVxeDepartSelectCell.vue'
 // import JVxeUserSelectCell from './components/cells/JVxeUserSelectCell.vue'
 
-const componentMap = new Map<JVxeTypes | string, JVxeVueComponent>()
+const componentMap = new Map<JVxeTypes | string, JVxeVueComponent>();
 
 /** span 组件结尾 */
-export const spanEnds: string = ':span'
+export const spanEnds: string = ':span';
 
 /** 定义不能用于注册的关键字 */
-export const excludeKeywords: Array<JVxeTypes> = [
-  JVxeTypes.hidden,
-  JVxeTypes.rowNumber,
-  JVxeTypes.rowCheckbox,
-  JVxeTypes.rowRadio,
-  JVxeTypes.rowExpand,
-]
+export const excludeKeywords: Array<JVxeTypes> = [JVxeTypes.hidden, JVxeTypes.rowNumber, JVxeTypes.rowCheckbox, JVxeTypes.rowRadio, JVxeTypes.rowExpand];
 
 /**
  * 注册组件
@@ -41,47 +35,46 @@ export const excludeKeywords: Array<JVxeTypes> = [
  */
 export function addComponent(type: JVxeTypes, component: JVxeVueComponent, spanComponent?: JVxeVueComponent) {
   if (excludeKeywords.includes(type)) {
-    throw new Error(`【addComponent】不能使用"${type}"作为组件的name，因为这是关键字。`)
+    throw new Error(`【addComponent】不能使用"${type}"作为组件的name，因为这是关键字。`);
   }
   if (componentMap.has(type)) {
-    throw new Error(`【addComponent】组件"${type}"已存在`)
+    throw new Error(`【addComponent】组件"${type}"已存在`);
   }
-  componentMap.set(type, component)
+  componentMap.set(type, component);
   if (spanComponent) {
-    componentMap.set(type + spanEnds, spanComponent)
+    componentMap.set(type + spanEnds, spanComponent);
   }
 }
 
 export function deleteComponent(type: JVxeTypes) {
-  componentMap.delete(type)
-  componentMap.delete(type + spanEnds)
+  componentMap.delete(type);
+  componentMap.delete(type + spanEnds);
 }
 
 /** 定义内置自定义组件 */
 export function definedComponent() {
-  addComponent(JVxeTypes.slot, JVxeSlotCell)
-  addComponent(JVxeTypes.normal, JVxeNormalCell)
-  addComponent(JVxeTypes.rowDragSort, JVxeDragSortCell)
+  addComponent(JVxeTypes.slot, JVxeSlotCell);
+  addComponent(JVxeTypes.normal, JVxeNormalCell);
+  addComponent(JVxeTypes.rowDragSort, JVxeDragSortCell);
 
-  addComponent(JVxeTypes.input, JVxeInputCell)
-  addComponent(JVxeTypes.inputNumber, JVxeInputCell)
-  addComponent(JVxeTypes.radio, JVxeRadioCell)
-  addComponent(JVxeTypes.checkbox, JVxeCheckboxCell)
-  addComponent(JVxeTypes.select, JVxeSelectCell)
-  addComponent(JVxeTypes.selectSearch, JVxeSelectCell)  // 下拉搜索
-  addComponent(JVxeTypes.selectMultiple, JVxeSelectCell) // 下拉多选
-  addComponent(JVxeTypes.date, JVxeDateCell)
-  addComponent(JVxeTypes.datetime, JVxeDateCell)
-  addComponent(JVxeTypes.time, JVxeTimeCell)
-  addComponent(JVxeTypes.upload, JVxeUploadCell)
-  addComponent(JVxeTypes.textarea, JVxeTextareaCell)
+  addComponent(JVxeTypes.input, JVxeInputCell);
+  addComponent(JVxeTypes.inputNumber, JVxeInputCell);
+  addComponent(JVxeTypes.radio, JVxeRadioCell);
+  addComponent(JVxeTypes.checkbox, JVxeCheckboxCell);
+  addComponent(JVxeTypes.select, JVxeSelectCell);
+  addComponent(JVxeTypes.selectSearch, JVxeSelectCell); // 下拉搜索
+  addComponent(JVxeTypes.selectMultiple, JVxeSelectCell); // 下拉多选
+  addComponent(JVxeTypes.date, JVxeDateCell);
+  addComponent(JVxeTypes.datetime, JVxeDateCell);
+  addComponent(JVxeTypes.time, JVxeTimeCell);
+  addComponent(JVxeTypes.upload, JVxeUploadCell);
+  addComponent(JVxeTypes.textarea, JVxeTextareaCell);
 
   // addComponent(JVxeTypes.tags, TagsInputCell, TagsSpanCell)
-  addComponent(JVxeTypes.progress, JVxeProgressCell)
+  addComponent(JVxeTypes.progress, JVxeProgressCell);
 
   // addComponent(JVxeTypes.departSelect, JVxeDepartSelectCell)
   // addComponent(JVxeTypes.userSelect, JVxeUserSelectCell)
-
 }
 
-export { componentMap }
\ No newline at end of file
+export { componentMap };
diff --git a/src/components/jeecg/JVxeTable/src/components/JVxeDetailsModal.vue b/src/components/jeecg/JVxeTable/src/components/JVxeDetailsModal.vue
index 1c791eb..99225f4 100644
--- a/src/components/jeecg/JVxeTable/src/components/JVxeDetailsModal.vue
+++ b/src/components/jeecg/JVxeTable/src/components/JVxeDetailsModal.vue
@@ -1,83 +1,76 @@
 <template>
-  <BasicModal
-      @register="registerModel"
-      title="详细信息"
-      :width="1200"
-      :keyboard="true"
-      @ok="handleOk"
-      @cancel="close"
-  >
+  <BasicModal @register="registerModel" title="详细信息" :width="1200" :keyboard="true" @ok="handleOk" @cancel="close">
     <transition name="fade">
       <div v-if="getVisible">
-        <slot name="mainForm" :row="row" :column="column"/>
+        <slot name="mainForm" :row="row" :column="column" />
       </div>
     </transition>
   </BasicModal>
 </template>
 <script lang="ts">
-import { ref, defineComponent } from 'vue'
-import { cloneDeep } from 'lodash-es'
-import { useModal } from '/@/components/Modal/src/hooks/useModal'
-import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent'
+  import { ref, defineComponent } from 'vue';
+  import { cloneDeep } from 'lodash-es';
+  import { useModal } from '/@/components/Modal/src/hooks/useModal';
+  import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent';
 
-export default defineComponent({
-  components: {
-    BasicModal: createAsyncComponent(() => import('/@/components/Modal/src/BasicModal.vue'), { loading: true }),
-  },
-  props: {
-    trigger: {
-      type: Function,
-      required: true,
+  export default defineComponent({
+    components: {
+      BasicModal: createAsyncComponent(() => import('/@/components/Modal/src/BasicModal.vue'), { loading: true }),
     },
-  },
-  setup(props) {
+    props: {
+      trigger: {
+        type: Function,
+        required: true,
+      },
+    },
+    setup(props) {
+      const row = ref(null);
+      const column = ref(null);
 
-    const row = ref(null)
-    const column = ref(null)
+      const [registerModel, { openModal, closeModal, getVisible }] = useModal();
 
-    const [registerModel, { openModal, closeModal, getVisible }] = useModal()
+      function open(event) {
+        let { row: $row, column: $column } = event;
+        row.value = cloneDeep($row);
+        column.value = $column;
+        openModal();
+      }
 
-    function open(event) {
-      let { row: $row, column: $column } = event
-      row.value = cloneDeep($row)
-      column.value = $column
-      openModal()
-    }
+      function close() {
+        closeModal();
+      }
 
-    function close() {
-      closeModal()
-    }
-
-    function handleOk() {
-      props.trigger('detailsConfirm', {
-        row: row.value,
-        column: column.value,
-        callback: (success) => {
-          success ? closeModal() : openModal()
-        },
-      })
-    }
-
-    return {
-      getVisible,
-      row, column,
-      open, close,
-      handleOk,
-      registerModel,
-    }
-  },
-})
+      function handleOk() {
+        props.trigger('detailsConfirm', {
+          row: row.value,
+          column: column.value,
+          callback: (success) => {
+            success ? closeModal() : openModal();
+          },
+        });
+      }
 
+      return {
+        getVisible,
+        row,
+        column,
+        open,
+        close,
+        handleOk,
+        registerModel,
+      };
+    },
+  });
 </script>
 <style scoped lang="less">
-.fade-enter-active,
-.fade-leave-active {
-  opacity: 1;
-  transition: opacity 0.5s;
-}
+  .fade-enter-active,
+  .fade-leave-active {
+    opacity: 1;
+    transition: opacity 0.5s;
+  }
 
-.fade-enter,
-.fade-leave-to {
-  opacity: 0;
-}
-</style>
\ No newline at end of file
+  .fade-enter,
+  .fade-leave-to {
+    opacity: 0;
+  }
+</style>
diff --git a/src/components/jeecg/JVxeTable/src/components/JVxeReloadEffect.ts b/src/components/jeecg/JVxeTable/src/components/JVxeReloadEffect.ts
index 3f0d8c4..7dd3276 100644
--- a/src/components/jeecg/JVxeTable/src/components/JVxeReloadEffect.ts
+++ b/src/components/jeecg/JVxeTable/src/components/JVxeReloadEffect.ts
@@ -1,6 +1,6 @@
-import { defineComponent, h, ref, watch } from 'vue'
-import { randomString } from '/@/utils/common/compUtils'
-import '../style/reload-effect.less'
+import { defineComponent, h, ref, watch } from 'vue';
+import { randomString } from '/@/utils/common/compUtils';
+import '../style/reload-effect.less';
 
 // 修改数据特效
 export default defineComponent({
@@ -12,47 +12,54 @@ export default defineComponent({
   emits: ['effectBegin', 'effectEnd'],
   setup(props, { emit }) {
     // vNode: null,
-    const innerEffect = ref(props.effect)
+    const innerEffect = ref(props.effect);
     // 应付同时多个特效
-    const effectIdx = ref(0)
-    const effectList = ref<any[]>([])
+    const effectIdx = ref(0);
+    const effectList = ref<any[]>([]);
 
-    watch(() => props.effect, () => innerEffect.value = props.effect)
-    watch(() => props.vNode, (_vNode, old) => {
-      if (props.effect && old != null) {
-        let topLayer = renderSpan(old, 'top')
-        effectList.value.push(topLayer)
-      }
-    }, { deep: true, immediate: true })
+    watch(
+      () => props.effect,
+      () => (innerEffect.value = props.effect)
+    );
+    watch(
+      () => props.vNode,
+      (_vNode, old) => {
+        if (props.effect && old != null) {
+          let topLayer = renderSpan(old, 'top');
+          effectList.value.push(topLayer);
+        }
+      },
+      { deep: true, immediate: true }
+    );
 
     // 条件渲染内容 span
     function renderVNode() {
       if (props.vNode == null) {
-        return null
+        return null;
       }
-      let bottom = renderSpan(props.vNode, 'bottom')
+      let bottom = renderSpan(props.vNode, 'bottom');
       // 启用了特效，并且有旧数据，就渲染特效顶层
       if (innerEffect.value && effectList.value.length > 0) {
-        emit('effectBegin')
+        emit('effectBegin');
         // 1.4s 以后关闭特效
         window.setTimeout(() => {
-          let item = effectList.value[effectIdx.value]
+          let item = effectList.value[effectIdx.value];
           if (item && item.elm) {
             // 特效结束后，展示先把 display 设为 none，而不是直接删掉该元素，
             // 目的是为了防止页面重新渲染，导致动画重置
-            item.elm.style.display = 'none'
+            item.elm.style.display = 'none';
           }
           // 当所有的层级动画都结束时，再删掉所有元素
           if (++effectIdx.value === effectList.value.length) {
-            innerEffect.value = false
-            effectIdx.value = 0
-            effectList.value = []
-            emit('effectEnd')
+            innerEffect.value = false;
+            effectIdx.value = 0;
+            effectList.value = [];
+            emit('effectEnd');
           }
-        }, 1400)
-        return [effectList.value, bottom]
+        }, 1400);
+        return [effectList.value, bottom];
       } else {
-        return bottom
+        return bottom;
       }
     }
 
@@ -62,16 +69,21 @@ export default defineComponent({
         key: layer + effectIdx.value + randomString(6),
         class: ['j-vxe-reload-effect-span', `layer-${layer}`],
         style: {},
-      }
+      };
       if (layer === 'top') {
         // 最新渲染的在下面
-        options.style['z-index'] = (9999 - effectIdx.value)
+        options.style['z-index'] = 9999 - effectIdx.value;
       }
-      return h('span', options, [vNode])
+      return h('span', options, [vNode]);
     }
 
-    return () => h('div', {
-      class: ['j-vxe-reload-effect-box'],
-    }, [renderVNode()])
+    return () =>
+      h(
+        'div',
+        {
+          class: ['j-vxe-reload-effect-box'],
+        },
+        [renderVNode()]
+      );
   },
-})
\ No newline at end of file
+});
diff --git a/src/components/jeecg/JVxeTable/src/components/JVxeSubPopover.vue b/src/components/jeecg/JVxeTable/src/components/JVxeSubPopover.vue
index c0c9855..b0b5907 100644
--- a/src/components/jeecg/JVxeTable/src/components/JVxeSubPopover.vue
+++ b/src/components/jeecg/JVxeTable/src/components/JVxeSubPopover.vue
@@ -1,198 +1,197 @@
 <template>
-  <a-popover
-      :visible="visible"
-      :placement="placement"
-      overlayClassName="j-vxe-popover-overlay"
-      :overlayStyle="overlayStyle">
-
+  <a-popover :visible="visible" :placement="placement" overlayClassName="j-vxe-popover-overlay" :overlayStyle="overlayStyle">
     <template #title>
       <div class="j-vxe-popover-title">
         <div>子表</div>
         <div class="j-vxe-popover-title-close" @click="close">
-          <a-icon type="close"/>
+          <a-icon type="close" />
         </div>
       </div>
     </template>
 
     <template #content>
       <transition name="fade">
-        <slot v-if="visible" name="subForm" :row="row" :column="column"/>
+        <slot v-if="visible" name="subForm" :row="row" :column="column" />
       </transition>
     </template>
 
     <div ref="divRef" class="j-vxe-popover-div"></div>
-
   </a-popover>
 </template>
 <script lang="ts">
-import { ref, reactive, nextTick, defineComponent } from 'vue'
-import domAlign from 'dom-align'
-import { getParentNodeByTagName } from '../utils/vxeUtils'
-import { triggerWindowResizeEvent } from '/@/utils/common/compUtils'
-import { cloneDeep } from 'lodash-es'
-import { useMessage } from '/@/hooks/web/useMessage'
-import { isString } from '/@/utils/is'
+  import { ref, reactive, nextTick, defineComponent } from 'vue';
+  import domAlign from 'dom-align';
+  import { getParentNodeByTagName } from '../utils/vxeUtils';
+  import { triggerWindowResizeEvent } from '/@/utils/common/compUtils';
+  import { cloneDeep } from 'lodash-es';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { isString } from '/@/utils/is';
 
-export default defineComponent({
-  name: 'JVxeSubPopover',
-  setup() {
-    const visible = ref(false)
-    const row = ref<any>(null)
-    const column = ref<any>(null)
-    const overlayStyle = reactive<{
-      width?: number | string,
-      maxWidth?: number | string,
-      zIndex: number,
-    }>({
-      zIndex: 100,
-    })
-    const placement = ref('bottom')
-    const divRef = ref<HTMLElement>()
-    const { createMessage } = useMessage()
+  export default defineComponent({
+    name: 'JVxeSubPopover',
+    setup() {
+      const visible = ref(false);
+      const row = ref<any>(null);
+      const column = ref<any>(null);
+      const overlayStyle = reactive<{
+        width?: number | string;
+        maxWidth?: number | string;
+        zIndex: number;
+      }>({
+        zIndex: 100,
+      });
+      const placement = ref('bottom');
+      const divRef = ref<HTMLElement>();
+      const { createMessage } = useMessage();
 
-    function toggle(event) {
-      if (document.body.clientHeight - event.$event.clientY > 350) {
-        placement.value = 'bottom'
-      } else {
-        placement.value = 'top'
-      }
-      if (row.value == null) {
-        open(event)
-      } else {
-        row.value.id === event.row.id ? close() : reopen(event)
-      }
-    }
-
-    function open(event, level = 0) {
-      if (level > 3) {
-        createMessage.error('打开子表失败')
-        console.warn('【JVxeSubPopover】打开子表失败')
-        return
-      }
-
-      let { row: $row, column: $column, $table, $event: { target } } = event
-      row.value = cloneDeep($row)
-      column.value = $column
-
-      let className = target.className || ''
-      className = isString(className) ? className : className.toString()
-
-      // 点击的是expand，不做处理
-      if (className.includes('vxe-table--expand-btn')) {
-        return
-      }
-      // 点击的是checkbox，不做处理
-      if (className.includes('vxe-checkbox--icon') || className.includes('vxe-cell--checkbox')) {
-        return
-      }
-      // 点击的是radio，不做处理
-      if (className.includes('vxe-radio--icon') || className.includes('vxe-cell--radio')) {
-        return
-      }
-      let parentElem = $table.getParentElem()
-      let tr = getParentNodeByTagName(target, 'tr')
-      if (parentElem && tr) {
-        let clientWidth = parentElem.clientWidth
-        let clientHeight = tr.clientHeight
-        divRef.value!.style.width = clientWidth + 'px'
-        divRef.value!.style.height = clientHeight + 'px'
-        overlayStyle.width = Number.parseInt(`${(clientWidth - clientWidth * 0.04)}`) + 'px'
-        overlayStyle.maxWidth = overlayStyle.width
-        //let realTable = getParentNodeByTagName(tr, 'table')
-        //let left = realTable.parentNode.scrollLeft
-        let h = event.$event.clientY
-        if (h) {
-          h = h - 140
+      function toggle(event) {
+        if (document.body.clientHeight - event.$event.clientY > 350) {
+          placement.value = 'bottom';
+        } else {
+          placement.value = 'top';
         }
-        let toolbar = divRef.value!.nextElementSibling
-        domAlign(divRef.value, toolbar, {
-          points: ['tl', 'tl'],
-          offset: [0, h],
-          overflow: {
-            alwaysByViewport: true,
-          },
-        })
-        nextTick(() => {
-          visible.value = true
+        if (row.value == null) {
+          open(event);
+        } else {
+          row.value.id === event.row.id ? close() : reopen(event);
+        }
+      }
+
+      function open(event, level = 0) {
+        if (level > 3) {
+          createMessage.error('打开子表失败');
+          console.warn('【JVxeSubPopover】打开子表失败');
+          return;
+        }
+
+        let {
+          row: $row,
+          column: $column,
+          $table,
+          $event: { target },
+        } = event;
+        row.value = cloneDeep($row);
+        column.value = $column;
+
+        let className = target.className || '';
+        className = isString(className) ? className : className.toString();
+
+        // 点击的是expand，不做处理
+        if (className.includes('vxe-table--expand-btn')) {
+          return;
+        }
+        // 点击的是checkbox，不做处理
+        if (className.includes('vxe-checkbox--icon') || className.includes('vxe-cell--checkbox')) {
+          return;
+        }
+        // 点击的是radio，不做处理
+        if (className.includes('vxe-radio--icon') || className.includes('vxe-cell--radio')) {
+          return;
+        }
+        let parentElem = $table.getParentElem();
+        let tr = getParentNodeByTagName(target, 'tr');
+        if (parentElem && tr) {
+          let clientWidth = parentElem.clientWidth;
+          let clientHeight = tr.clientHeight;
+          divRef.value!.style.width = clientWidth + 'px';
+          divRef.value!.style.height = clientHeight + 'px';
+          overlayStyle.width = Number.parseInt(`${clientWidth - clientWidth * 0.04}`) + 'px';
+          overlayStyle.maxWidth = overlayStyle.width;
+          //let realTable = getParentNodeByTagName(tr, 'table')
+          //let left = realTable.parentNode.scrollLeft
+          let h = event.$event.clientY;
+          if (h) {
+            h = h - 140;
+          }
+          let toolbar = divRef.value!.nextElementSibling;
+          domAlign(divRef.value, toolbar, {
+            points: ['tl', 'tl'],
+            offset: [0, h],
+            overflow: {
+              alwaysByViewport: true,
+            },
+          });
           nextTick(() => {
-            triggerWindowResizeEvent()
-          })
-        })
-      } else {
-        let num = ++level
-        console.warn('【JVxeSubPopover】table or tr 获取失败，正在进行第 ' + num + '次重试', { event, table: parentElem, tr })
-        window.setTimeout(() => open(event, num), 100)
+            visible.value = true;
+            nextTick(() => {
+              triggerWindowResizeEvent();
+            });
+          });
+        } else {
+          let num = ++level;
+          console.warn('【JVxeSubPopover】table or tr 获取失败，正在进行第 ' + num + '次重试', { event, table: parentElem, tr });
+          window.setTimeout(() => open(event, num), 100);
+        }
       }
-    }
 
-    function close() {
-      if (visible.value) {
-        row.value = null
-        visible.value = false
+      function close() {
+        if (visible.value) {
+          row.value = null;
+          visible.value = false;
+        }
       }
-    }
 
-    function reopen(event) {
-      open(event)
-    }
+      function reopen(event) {
+        open(event);
+      }
 
-    return {
-      divRef,
-      row,
-      column,
-      visible,
-      placement,
-      overlayStyle,
-      close,
-      toggle,
-    }
-  },
-})
+      return {
+        divRef,
+        row,
+        column,
+        visible,
+        placement,
+        overlayStyle,
+        close,
+        toggle,
+      };
+    },
+  });
 </script>
 <style scoped lang="less">
-.j-vxe-popover-title {
-  .j-vxe-popover-title-close {
-    position: absolute;
-    right: 0;
-    top: 0;
-    width: 31px;
-    height: 31px;
-    text-align: center;
-    line-height: 31px;
-    color: rgba(0, 0, 0, 0.45);
-    cursor: pointer;
-    transition: color 300ms;
+  .j-vxe-popover-title {
+    .j-vxe-popover-title-close {
+      position: absolute;
+      right: 0;
+      top: 0;
+      width: 31px;
+      height: 31px;
+      text-align: center;
+      line-height: 31px;
+      color: rgba(0, 0, 0, 0.45);
+      cursor: pointer;
+      transition: color 300ms;
 
-    &:hover {
-      color: rgba(0, 0, 0, 0.8);
+      &:hover {
+        color: rgba(0, 0, 0, 0.8);
+      }
     }
   }
-}
 
-.j-vxe-popover-div {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 31px;
-  z-index: -1;
-}
+  .j-vxe-popover-div {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 31px;
+    z-index: -1;
+  }
 </style>
 <style lang="less">
-.j-vxe-popover-overlay.ant-popover {
-  .ant-popover-title {
-    position: relative;
+  .j-vxe-popover-overlay.ant-popover {
+    .ant-popover-title {
+      position: relative;
+    }
   }
-}
 
-.fade-enter-active,
-.fade-leave-active {
-  opacity: 1;
-  transition: opacity 0.5s;
-}
+  .fade-enter-active,
+  .fade-leave-active {
+    opacity: 1;
+    transition: opacity 0.5s;
+  }
 
-.fade-enter,
-.fade-leave-to {
-  opacity: 0;
-}
-</style>
\ No newline at end of file
+  .fade-enter,
+  .fade-leave-to {
+    opacity: 0;
+  }
+</style>
diff --git a/src/components/jeecg/JVxeTable/src/components/JVxeToolbar.vue b/src/components/jeecg/JVxeTable/src/components/JVxeToolbar.vue
index d6446a6..c38a266 100644
--- a/src/components/jeecg/JVxeTable/src/components/JVxeToolbar.vue
+++ b/src/components/jeecg/JVxeTable/src/components/JVxeToolbar.vue
@@ -4,38 +4,25 @@
       <!-- 工具按钮 -->
       <template #buttons>
         <div :class="`${prefixCls}-button div`" :size="btnSize">
-          <slot v-if="showPrefix" name="toolbarPrefix" :size="btnSize"/>
-          <a-button
-              v-if="showAdd"
-              type="primary"
-              preIcon="ant-design:plus-outlined"
-              :disabled="disabled"
-              @click="trigger('add')">
+          <slot v-if="showPrefix" name="toolbarPrefix" :size="btnSize" />
+          <a-button v-if="showAdd" type="primary" preIcon="ant-design:plus-outlined" :disabled="disabled" @click="trigger('add')">
             <span>新增</span>
           </a-button>
-          <a-button
-              v-if="showSave"
-              preIcon="ant-design:save-outlined"
-              :disabled="disabled"
-              @click="trigger('save')">
+          <a-button v-if="showSave" preIcon="ant-design:save-outlined" :disabled="disabled" @click="trigger('save')">
             <span>保存</span>
           </a-button>
           <template v-if="selectedRowIds.length > 0">
-            <Popconfirm
-                v-if="showRemove"
-                :title="`确定要删除这 ${selectedRowIds.length} 项吗?`"
-                @confirm="trigger('remove')"
-            >
+            <Popconfirm v-if="showRemove" :title="`确定要删除这 ${selectedRowIds.length} 项吗?`" @confirm="trigger('remove')">
               <a-button preIcon="ant-design:minus-outlined" :disabled="disabled">删除</a-button>
             </Popconfirm>
             <template v-if="showClearSelection">
               <a-button preIcon="ant-design:delete-outlined" @click="trigger('clearSelection')">清空选择</a-button>
             </template>
           </template>
-          <slot v-if="showSuffix" name="toolbarSuffix" :size="btnSize"/>
+          <slot v-if="showSuffix" name="toolbarSuffix" :size="btnSize" />
           <a v-if="showCollapse" style="margin-left: 4px" @click="toggleCollapse">
             <span>{{ collapsed ? '展开' : '收起' }}</span>
-            <Icon :icon="collapsed ? 'ant-design:down-outlined' : 'ant-design:up-outlined'"/>
+            <Icon :icon="collapsed ? 'ant-design:down-outlined' : 'ant-design:up-outlined'" />
           </a>
         </div>
       </template>
@@ -44,85 +31,84 @@
 </template>
 
 <script lang="ts" setup>
-import { computed, inject, ref, onMounted } from 'vue'
-// noinspection ES6UnusedImports
-import { Popconfirm } from 'ant-design-vue'
-import { VxeToolbarInstance } from 'vxe-table'
-import { Icon } from '/@/components/Icon'
-import { propTypes } from '/@/utils/propTypes'
+  import { computed, inject, ref, onMounted } from 'vue';
+  // noinspection ES6UnusedImports
+  import { Popconfirm } from 'ant-design-vue';
+  import { VxeToolbarInstance } from 'vxe-table';
+  import { Icon } from '/@/components/Icon';
+  import { propTypes } from '/@/utils/propTypes';
 
-const props = defineProps({
-  size: propTypes.string,
-  disabled: propTypes.bool.def(false),
-  toolbarConfig: propTypes.object,
-  disabledRows: propTypes.object,
-  hasBtnAuth: propTypes.func,
-  selectedRowIds: propTypes.array.def(() => []),
-})
-const emit = defineEmits(['save', 'add', 'remove', 'clearSelection', 'register'])
-const xToolbarRef = ref({} as VxeToolbarInstance)
-const prefixCls = `${inject('prefixCls')}-toolbar`
-const boxClass = computed(() => [
-  prefixCls,
-  {
-    [`${prefixCls}-collapsed`]: collapsed.value,
-  },
-])
-// 是否收起
-const collapsed = ref(true)
-// 配置的按钮
-const btns = computed(() => {
-  let btns = props.toolbarConfig?.btn || ['add', 'remove', 'clearSelection']
-  // 排除掉没有授权的按钮
-  return btns.filter(btn => {
-    // 系统默认的批量删除编码配置为 batch_delete 此处需要兼容一下
-    if (btn === 'remove') {
-      return hasBtnAuth(btn) || hasBtnAuth('batch_delete')
+  const props = defineProps({
+    size: propTypes.string,
+    disabled: propTypes.bool.def(false),
+    toolbarConfig: propTypes.object,
+    disabledRows: propTypes.object,
+    hasBtnAuth: propTypes.func,
+    selectedRowIds: propTypes.array.def(() => []),
+  });
+  const emit = defineEmits(['save', 'add', 'remove', 'clearSelection', 'register']);
+  const xToolbarRef = ref({} as VxeToolbarInstance);
+  const prefixCls = `${inject('prefixCls')}-toolbar`;
+  const boxClass = computed(() => [
+    prefixCls,
+    {
+      [`${prefixCls}-collapsed`]: collapsed.value,
+    },
+  ]);
+  // 是否收起
+  const collapsed = ref(true);
+  // 配置的按钮
+  const btns = computed(() => {
+    let btns = props.toolbarConfig?.btn || ['add', 'remove', 'clearSelection'];
+    // 排除掉没有授权的按钮
+    return btns.filter((btn) => {
+      // 系统默认的批量删除编码配置为 batch_delete 此处需要兼容一下
+      if (btn === 'remove') {
+        return hasBtnAuth(btn) || hasBtnAuth('batch_delete');
+      }
+      return hasBtnAuth(btn);
+    });
+  });
+  const showAdd = computed(() => btns.value.includes('add'));
+  const showSave = computed(() => btns.value.includes('save'));
+  const showRemove = computed(() => btns.value.includes('remove'));
+  // 配置的插槽
+  const slots = computed(() => props.toolbarConfig?.slot || ['prefix', 'suffix']);
+  const showPrefix = computed(() => slots.value.includes('prefix'));
+  const showSuffix = computed(() => slots.value.includes('suffix'));
+  // 是否显示清除选择按钮
+  const showClearSelection = computed(() => {
+    if (btns.value.includes('clearSelection')) {
+      // 有禁用行时才显示清空选择按钮
+      // 因为禁用行会阻止选择行，导致无法取消全选
+      // return Object.keys(props.disabledRows).length > 0
     }
-    return hasBtnAuth(btn)
-  })
-})
-const showAdd = computed(() => btns.value.includes('add'))
-const showSave = computed(() => btns.value.includes('save'))
-const showRemove = computed(() => btns.value.includes('remove'))
-// 配置的插槽
-const slots = computed(() => props.toolbarConfig?.slot || ['prefix', 'suffix'])
-const showPrefix = computed(() => slots.value.includes('prefix'))
-const showSuffix = computed(() => slots.value.includes('suffix'))
-// 是否显示清除选择按钮
-const showClearSelection = computed(() => {
-  if (btns.value.includes('clearSelection')) {
-    // 有禁用行时才显示清空选择按钮
-    // 因为禁用行会阻止选择行，导致无法取消全选
-    // return Object.keys(props.disabledRows).length > 0
+    return false;
+  });
+  // 是否显示展开收起按钮
+  const showCollapse = computed(() => btns.value.includes('collapse'));
+  // 按钮 size
+  const btnSize = computed(() => (props.size === 'tiny' ? 'small' : null));
+
+  onMounted(() => {
+    // 注册 vxe-toolbar
+    emit('register', {
+      xToolbarRef,
+    });
+  });
+
+  // 判断按钮是否已授权
+  function hasBtnAuth(key: string) {
+    return props.hasBtnAuth ? props.hasBtnAuth(key) : true;
   }
-  return false
-})
-// 是否显示展开收起按钮
-const showCollapse = computed(() => btns.value.includes('collapse'))
-// 按钮 size
-const btnSize = computed(() => props.size === 'tiny' ? 'small' : null)
 
-onMounted(() => {
-  // 注册 vxe-toolbar
-  emit('register', {
-    xToolbarRef,
-  })
-})
+  /** 触发事件 */
+  function trigger(name) {
+    emit(name);
+  }
 
-// 判断按钮是否已授权
-function hasBtnAuth(key: string) {
-  return props.hasBtnAuth ? props.hasBtnAuth(key) : true
-}
-
-/** 触发事件 */
-function trigger(name) {
-  emit(name)
-}
-
-// 切换展开收起
-function toggleCollapse() {
-  collapsed.value = !collapsed.value
-}
-
-</script>
\ No newline at end of file
+  // 切换展开收起
+  function toggleCollapse() {
+    collapsed.value = !collapsed.value;
+  }
+</script>
diff --git a/src/components/jeecg/JVxeTable/src/components/cells/JVxeCheckboxCell.vue b/src/components/jeecg/JVxeTable/src/components/cells/JVxeCheckboxCell.vue
index 541e3fb..683abfb 100644
--- a/src/components/jeecg/JVxeTable/src/components/cells/JVxeCheckboxCell.vue
+++ b/src/components/jeecg/JVxeTable/src/components/cells/JVxeCheckboxCell.vue
@@ -1,125 +1,116 @@
 <template>
   <div :class="boxClass" :style="boxStyle">
-    <a-checkbox
-        :checked="innerValue"
-        v-bind="cellProps"
-        @change="handleChange"
-    />
+    <a-checkbox :checked="innerValue" v-bind="cellProps" @change="handleChange" />
   </div>
 </template>
 
 <script lang="ts">
-import { computed, defineComponent } from 'vue'
-import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types'
-import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
-import { isArray, isBoolean } from '/@/utils/is'
+  import { computed, defineComponent } from 'vue';
+  import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types';
+  import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
+  import { isArray, isBoolean } from '/@/utils/is';
 
-export default defineComponent({
-  name: 'JVxeCheckboxCell',
-  props: useJVxeCompProps(),
-  setup(props: JVxeComponent.Props) {
-    const {
-      innerValue,
-      cellProps,
-      originColumn,
-      scrolling,
-      handleChangeCommon,
-    } = useJVxeComponent(props)
-    // 是否启用边框
-    const bordered = computed(() => !!props.renderOptions.bordered)
-    // box 类名
-    const boxClass = computed(() => {
-      return {
-        'j-vxe-checkbox': true,
-        'no-animation': scrolling.value,
-      }
-    })
-    // box 行内样式
-    const boxStyle = computed(() => {
-      const style = {}
-      // 如果有边框且未设置align属性，就强制居中
-      if (bordered.value && !originColumn.value.align) {
-        style['text-align'] = 'center'
-      }
-      return style
-    })
-
-    // onChange 事件
-    function handleChange(event) {
-      handleChangeCommon(event.target.checked)
-    }
-
-    return {
-      cellProps,
-      innerValue,
-      boxClass,
-      boxStyle,
-      handleChange,
-    }
-  },
-
-  // 【组件增强】注释详见：JVxeComponent.Enhanced
-  enhanced: {
-    switches: {
-      visible: true,
-    },
-    getValue(value, ctx) {
-      let { context } = ctx!
-      let { originColumn } = context
-      // 处理 customValue
-      if (isArray(originColumn.value.customValue)) {
-        let customValue = getCustomValue(originColumn.value)
-        if (isBoolean(value)) {
-          return value ? customValue[0] : customValue[1]
-        } else {
-          return value
+  export default defineComponent({
+    name: 'JVxeCheckboxCell',
+    props: useJVxeCompProps(),
+    setup(props: JVxeComponent.Props) {
+      const { innerValue, cellProps, originColumn, scrolling, handleChangeCommon } = useJVxeComponent(props);
+      // 是否启用边框
+      const bordered = computed(() => !!props.renderOptions.bordered);
+      // box 类名
+      const boxClass = computed(() => {
+        return {
+          'j-vxe-checkbox': true,
+          'no-animation': scrolling.value,
+        };
+      });
+      // box 行内样式
+      const boxStyle = computed(() => {
+        const style = {};
+        // 如果有边框且未设置align属性，就强制居中
+        if (bordered.value && !originColumn.value.align) {
+          style['text-align'] = 'center';
         }
-      } else {
-        return value
-      }
-    },
-    setValue(value, ctx) {
-      let { context } = ctx!
-      let { originColumn } = context
-      // 判断是否设定了customValue（自定义值）
-      if (isArray(originColumn.value.customValue)) {
-        let customValue = getCustomValue(originColumn.value)
-        return neverNull(value).toString() === customValue[0].toString()
-      } else {
-        return !!value
-      }
-    },
-    createValue(_defaultValue, ctx) {
-      let { context } = ctx!
-      let { column: { params: col } } = context
-      if (isArray(col.customValue)) {
-        let customValue = getCustomValue(col)
-        return col.defaultChecked ? customValue[0] : customValue[1]
-      } else {
-        return !!col.defaultChecked
-      }
-    },
-  } as JVxeComponent.EnhancedPartial,
-})
+        return style;
+      });
 
+      // onChange 事件
+      function handleChange(event) {
+        handleChangeCommon(event.target.checked);
+      }
 
-function neverNull(value, def?) {
-  return value == null ? (neverNull(def, '')) : value
-}
+      return {
+        cellProps,
+        innerValue,
+        boxClass,
+        boxStyle,
+        handleChange,
+      };
+    },
 
-function getCustomValue(col) {
-  let customTrue = neverNull(col.customValue[0], true)
-  let customFalse = neverNull(col.customValue[1], false)
-  return [customTrue, customFalse]
-}
+    // 【组件增强】注释详见：JVxeComponent.Enhanced
+    enhanced: {
+      switches: {
+        visible: true,
+      },
+      getValue(value, ctx) {
+        let { context } = ctx!;
+        let { originColumn } = context;
+        // 处理 customValue
+        if (isArray(originColumn.value.customValue)) {
+          let customValue = getCustomValue(originColumn.value);
+          if (isBoolean(value)) {
+            return value ? customValue[0] : customValue[1];
+          } else {
+            return value;
+          }
+        } else {
+          return value;
+        }
+      },
+      setValue(value, ctx) {
+        let { context } = ctx!;
+        let { originColumn } = context;
+        // 判断是否设定了customValue（自定义值）
+        if (isArray(originColumn.value.customValue)) {
+          let customValue = getCustomValue(originColumn.value);
+          return neverNull(value).toString() === customValue[0].toString();
+        } else {
+          return !!value;
+        }
+      },
+      createValue(_defaultValue, ctx) {
+        let { context } = ctx!;
+        let {
+          column: { params: col },
+        } = context;
+        if (isArray(col.customValue)) {
+          let customValue = getCustomValue(col);
+          return col.defaultChecked ? customValue[0] : customValue[1];
+        } else {
+          return !!col.defaultChecked;
+        }
+      },
+    } as JVxeComponent.EnhancedPartial,
+  });
+
+  function neverNull(value, def?) {
+    return value == null ? neverNull(def, '') : value;
+  }
+
+  function getCustomValue(col) {
+    let customTrue = neverNull(col.customValue[0], true);
+    let customFalse = neverNull(col.customValue[1], false);
+    return [customTrue, customFalse];
+  }
 </script>
 
 <style lang="less">
-// 关闭动画，防止滚动时动态赋值出现问题
-.j-vxe-checkbox.no-animation {
-  .ant-checkbox-inner,
-  .ant-checkbox-inner::after {
-    transition: none !important;
+  // 关闭动画，防止滚动时动态赋值出现问题
+  .j-vxe-checkbox.no-animation {
+    .ant-checkbox-inner,
+    .ant-checkbox-inner::after {
+      transition: none !important;
+    }
   }
-}
-</style>
\ No newline at end of file
+</style>
diff --git a/src/components/jeecg/JVxeTable/src/components/cells/JVxeDateCell.vue b/src/components/jeecg/JVxeTable/src/components/cells/JVxeDateCell.vue
index 3b354a2..658dcb4 100644
--- a/src/components/jeecg/JVxeTable/src/components/cells/JVxeDateCell.vue
+++ b/src/components/jeecg/JVxeTable/src/components/cells/JVxeDateCell.vue
@@ -1,75 +1,66 @@
 <template>
-  <a-date-picker
-      :value="innerDateValue"
-      allowClear
-      :format="dateFormat"
-      :showTime="isDatetime"
-      dropdownClassName="j-vxe-date-picker"
-      style="min-width: 0;"
-      v-bind="cellProps"
-      @change="handleChange"
-  />
+  <a-date-picker :value="innerDateValue" allowClear :format="dateFormat" :showTime="isDatetime" dropdownClassName="j-vxe-date-picker" style="min-width: 0" v-bind="cellProps" @change="handleChange" />
 </template>
 
 <script lang="ts">
-import { ref, computed, watch, defineComponent } from 'vue'
-import moment from 'moment'
-import { dispatchEvent } from '/@/components/jeecg/JVxeTable/utils'
-import { JVxeComponent, JVxeTypes } from '/@/components/jeecg/JVxeTable/types'
-import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
-import { isEmpty } from '/@/utils/is'
+  import { ref, computed, watch, defineComponent } from 'vue';
+  import moment from 'moment';
+  import { dispatchEvent } from '/@/components/jeecg/JVxeTable/utils';
+  import { JVxeComponent, JVxeTypes } from '/@/components/jeecg/JVxeTable/types';
+  import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
+  import { isEmpty } from '/@/utils/is';
 
-export default defineComponent({
-  name: 'JVxeDateCell',
-  props: useJVxeCompProps(),
-  setup(props: JVxeComponent.Props) {
-    const {
-      innerValue,
-      cellProps,
-      originColumn,
-      handleChangeCommon,
-    } = useJVxeComponent(props)
-    const innerDateValue = ref<any>(null)
-    const isDatetime = computed(() => props.type === JVxeTypes.datetime)
-    const dateFormat = computed(() => {
-      let format = originColumn.value.format
-      return format ? format : (isDatetime.value ? 'YYYY-MM-DD HH:mm:ss' : 'YYYY-MM-DD')
-    })
-    watch(innerValue, (val) => {
-      if (val == null || isEmpty(val)) {
-        innerDateValue.value = null
-      } else {
-        innerDateValue.value = moment(val, dateFormat.value)
+  export default defineComponent({
+    name: 'JVxeDateCell',
+    props: useJVxeCompProps(),
+    setup(props: JVxeComponent.Props) {
+      const { innerValue, cellProps, originColumn, handleChangeCommon } = useJVxeComponent(props);
+      const innerDateValue = ref<any>(null);
+      const isDatetime = computed(() => props.type === JVxeTypes.datetime);
+      const dateFormat = computed(() => {
+        let format = originColumn.value.format;
+        return format ? format : isDatetime.value ? 'YYYY-MM-DD HH:mm:ss' : 'YYYY-MM-DD';
+      });
+      watch(
+        innerValue,
+        (val) => {
+          if (val == null || isEmpty(val)) {
+            innerDateValue.value = null;
+          } else {
+            innerDateValue.value = moment(val, dateFormat.value);
+          }
+        },
+        { immediate: true }
+      );
+
+      function handleChange(_mom, dateStr) {
+        handleChangeCommon(dateStr);
       }
-    }, { immediate: true })
 
-    function handleChange(_mom, dateStr) {
-      handleChangeCommon(dateStr)
-    }
-
-    return {
-      cellProps,
-      isDatetime,
-      dateFormat,
-      innerDateValue,
-      handleChange,
-    }
-  },
-  // 【组件增强】注释详见：JVxeComponent.Enhanced
-  enhanced: {
-    aopEvents: {
-      editActived({$event, row, column}) {
-        dispatchEvent({
-          $event,
-          row, column,
-          props: this.props,
-          instance: this,
-          className: '.ant-calendar-picker',
-          isClick: false,
-          handler: (el) => el.children[0].click(),
-        })
-      },
+      return {
+        cellProps,
+        isDatetime,
+        dateFormat,
+        innerDateValue,
+        handleChange,
+      };
     },
-  } as JVxeComponent.EnhancedPartial,
-})
-</script>
\ No newline at end of file
+    // 【组件增强】注释详见：JVxeComponent.Enhanced
+    enhanced: {
+      aopEvents: {
+        editActived({ $event, row, column }) {
+          dispatchEvent({
+            $event,
+            row,
+            column,
+            props: this.props,
+            instance: this,
+            className: '.ant-calendar-picker',
+            isClick: false,
+            handler: (el) => el.children[0].click(),
+          });
+        },
+      },
+    } as JVxeComponent.EnhancedPartial,
+  });
+</script>
diff --git a/src/components/jeecg/JVxeTable/src/components/cells/JVxeDragSortCell.vue b/src/components/jeecg/JVxeTable/src/components/cells/JVxeDragSortCell.vue
index db4366e..c32efe3 100644
--- a/src/components/jeecg/JVxeTable/src/components/cells/JVxeDragSortCell.vue
+++ b/src/components/jeecg/JVxeTable/src/components/cells/JVxeDragSortCell.vue
@@ -1,14 +1,14 @@
 <template>
   <div class="j-vxe-drag-box">
     <a-dropdown :trigger="['click']">
-      <span><span class="drag-btn">
-        <Icon icon="mi:drag"/>
-      </span></span>
+      <span
+        ><span class="drag-btn"> <Icon icon="mi:drag" /> </span
+      ></span>
       <template #overlay>
         <a-menu>
           <a-menu-item key="0" :disabled="disabledMoveUp" @click="handleRowMoveUp">向上移</a-menu-item>
           <a-menu-item key="1" :disabled="disabledMoveDown" @click="handleRowMoveDown">向下移</a-menu-item>
-          <a-menu-divider/>
+          <a-menu-divider />
           <a-menu-item key="3" @click="handleRowInsertDown">插入一行</a-menu-item>
         </a-menu>
       </template>
@@ -17,76 +17,76 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent } from 'vue'
-import { Icon } from '/@/components/Icon'
-import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types'
-import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
+  import { computed, defineComponent } from 'vue';
+  import { Icon } from '/@/components/Icon';
+  import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types';
+  import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
 
-export default defineComponent({
-  name: 'JVxeDragSortCell',
-  components: { Icon },
-  props: useJVxeCompProps(),
-  setup(props: JVxeComponent.Props) {
-    const { rowIndex, fullDataLength, trigger } = useJVxeComponent(props)
+  export default defineComponent({
+    name: 'JVxeDragSortCell',
+    components: { Icon },
+    props: useJVxeCompProps(),
+    setup(props: JVxeComponent.Props) {
+      const { rowIndex, fullDataLength, trigger } = useJVxeComponent(props);
 
-    const disabledMoveUp = computed(() => rowIndex.value === 0)
-    const disabledMoveDown = computed(() => rowIndex.value === (fullDataLength.value - 1))
+      const disabledMoveUp = computed(() => rowIndex.value === 0);
+      const disabledMoveDown = computed(() => rowIndex.value === fullDataLength.value - 1);
 
-    /** 向上移 */
-    function handleRowMoveUp() {
-      if (!disabledMoveUp.value) {
-        trigger('rowResort', {
-          oldIndex: rowIndex.value,
-          newIndex: rowIndex.value - 1,
-        })
+      /** 向上移 */
+      function handleRowMoveUp() {
+        if (!disabledMoveUp.value) {
+          trigger('rowResort', {
+            oldIndex: rowIndex.value,
+            newIndex: rowIndex.value - 1,
+          });
+        }
       }
-    }
 
-    /** 向下移 */
-    function handleRowMoveDown() {
-      if (!disabledMoveDown.value) {
-        trigger('rowResort', {
-          oldIndex: rowIndex.value,
-          newIndex: rowIndex.value + 1,
-        })
+      /** 向下移 */
+      function handleRowMoveDown() {
+        if (!disabledMoveDown.value) {
+          trigger('rowResort', {
+            oldIndex: rowIndex.value,
+            newIndex: rowIndex.value + 1,
+          });
+        }
       }
-    }
 
-    /** 插入一行 */
-    function handleRowInsertDown() {
-      trigger('rowInsertDown', rowIndex.value)
-    }
+      /** 插入一行 */
+      function handleRowInsertDown() {
+        trigger('rowInsertDown', rowIndex.value);
+      }
 
-    return {
-      disabledMoveUp,
-      disabledMoveDown,
-      handleRowMoveUp,
-      handleRowMoveDown,
-      handleRowInsertDown,
-    }
-  },
-  // 【组件增强】注释详见：JVxeComponent.Enhanced
-  enhanced: {
-    // 【功能开关】
-    switches: {
-      editRender: false,
+      return {
+        disabledMoveUp,
+        disabledMoveDown,
+        handleRowMoveUp,
+        handleRowMoveDown,
+        handleRowInsertDown,
+      };
     },
-  } as JVxeComponent.EnhancedPartial,
-})
+    // 【组件增强】注释详见：JVxeComponent.Enhanced
+    enhanced: {
+      // 【功能开关】
+      switches: {
+        editRender: false,
+      },
+    } as JVxeComponent.EnhancedPartial,
+  });
 </script>
 
 <style lang="less">
-.j-vxe-drag-box {
-  .app-iconify {
-    cursor: move;
-  }
-}
-
-.vxe-table--fixed-wrapper {
   .j-vxe-drag-box {
     .app-iconify {
-      cursor: pointer;
+      cursor: move;
     }
   }
-}
-</style>
\ No newline at end of file
+
+  .vxe-table--fixed-wrapper {
+    .j-vxe-drag-box {
+      .app-iconify {
+        cursor: pointer;
+      }
+    }
+  }
+</style>
diff --git a/src/components/jeecg/JVxeTable/src/components/cells/JVxeInputCell.vue b/src/components/jeecg/JVxeTable/src/components/cells/JVxeInputCell.vue
index 78eefca..5f3aa83 100644
--- a/src/components/jeecg/JVxeTable/src/components/cells/JVxeInputCell.vue
+++ b/src/components/jeecg/JVxeTable/src/components/cells/JVxeInputCell.vue
@@ -1,83 +1,77 @@
 <template>
-  <a-input
-      ref="input"
-      :value="innerValue"
-      v-bind="cellProps"
-      @blur="handleBlur"
-      @change="handleChange"
-  />
+  <a-input ref="input" :value="innerValue" v-bind="cellProps" @blur="handleBlur" @change="handleChange" />
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue'
-import { isString } from '/@/utils/is'
-import { JVxeComponent, JVxeTypes } from '/@/components/jeecg/JVxeTable/types'
-import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
+  import { defineComponent } from 'vue';
+  import { isString } from '/@/utils/is';
+  import { JVxeComponent, JVxeTypes } from '/@/components/jeecg/JVxeTable/types';
+  import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
 
-const NumberRegExp = /^-?\d+\.?\d*$/
-export default defineComponent({
-  name: 'JVxeInputCell',
-  props: useJVxeCompProps(),
-  setup(props: JVxeComponent.Props) {
-    const { innerValue, cellProps, handleChangeCommon } = useJVxeComponent(props)
+  const NumberRegExp = /^-?\d+\.?\d*$/;
+  export default defineComponent({
+    name: 'JVxeInputCell',
+    props: useJVxeCompProps(),
+    setup(props: JVxeComponent.Props) {
+      const { innerValue, cellProps, handleChangeCommon } = useJVxeComponent(props);
 
-    /** 处理change事件 */
-    function handleChange(event) {
-      let { target } = event
-      let { value, selectionStart } = target
-      let change = true
-      if (props.type === JVxeTypes.inputNumber) {
-        // 判断输入的值是否匹配数字正则表达式，不匹配就还原
-        if (!NumberRegExp.test(value) && (value !== '' && value !== '-')) {
-          change = false
-          value = innerValue.value
-          target.value = value || ''
-          if (typeof selectionStart === 'number') {
-            target.selectionStart = selectionStart - 1
-            target.selectionEnd = selectionStart - 1
+      /** 处理change事件 */
+      function handleChange(event) {
+        let { target } = event;
+        let { value, selectionStart } = target;
+        let change = true;
+        if (props.type === JVxeTypes.inputNumber) {
+          // 判断输入的值是否匹配数字正则表达式，不匹配就还原
+          if (!NumberRegExp.test(value) && value !== '' && value !== '-') {
+            change = false;
+            value = innerValue.value;
+            target.value = value || '';
+            if (typeof selectionStart === 'number') {
+              target.selectionStart = selectionStart - 1;
+              target.selectionEnd = selectionStart - 1;
+            }
           }
         }
-      }
-      // 触发事件，存储输入的值
-      if (change) {
-        handleChangeCommon(value)
-      }
-    }
-
-    /** 处理blur失去焦点事件 */
-    function handleBlur(event) {
-      let { target } = event
-      // 判断输入的值是否匹配数字正则表达式，不匹配就置空
-      if (props.type === JVxeTypes.inputNumber) {
-        if (!NumberRegExp.test(target.value)) {
-          target.value = ''
-        } else {
-          target.value = Number.parseFloat(target.value)
-        }
-        handleChangeCommon(target.value)
-      }
-      handleChangeCommon(target.value)
-    }
-
-    return {
-      innerValue,
-      cellProps,
-      handleChange,
-      handleBlur,
-    }
-  },
-  enhanced: {
-    installOptions: {
-      autofocus: '.ant-input',
-    },
-    getValue(value, ctx) {
-      if (ctx?.props?.type === JVxeTypes.inputNumber && isString(value)) {
-        if (NumberRegExp.test(value)) {
-          return Number.parseFloat(value)
+        // 触发事件，存储输入的值
+        if (change) {
+          handleChangeCommon(value);
         }
       }
-      return value
+
+      /** 处理blur失去焦点事件 */
+      function handleBlur(event) {
+        let { target } = event;
+        // 判断输入的值是否匹配数字正则表达式，不匹配就置空
+        if (props.type === JVxeTypes.inputNumber) {
+          if (!NumberRegExp.test(target.value)) {
+            target.value = '';
+          } else {
+            target.value = Number.parseFloat(target.value);
+          }
+          handleChangeCommon(target.value);
+        }
+        handleChangeCommon(target.value);
+      }
+
+      return {
+        innerValue,
+        cellProps,
+        handleChange,
+        handleBlur,
+      };
     },
-  } as JVxeComponent.EnhancedPartial,
-})
-</script>
\ No newline at end of file
+    enhanced: {
+      installOptions: {
+        autofocus: '.ant-input',
+      },
+      getValue(value, ctx) {
+        if (ctx?.props?.type === JVxeTypes.inputNumber && isString(value)) {
+          if (NumberRegExp.test(value)) {
+            return Number.parseFloat(value);
+          }
+        }
+        return value;
+      },
+    } as JVxeComponent.EnhancedPartial,
+  });
+</script>
diff --git a/src/components/jeecg/JVxeTable/src/components/cells/JVxeNormalCell.vue b/src/components/jeecg/JVxeTable/src/components/cells/JVxeNormalCell.vue
index be84b00..d6107f1 100644
--- a/src/components/jeecg/JVxeTable/src/components/cells/JVxeNormalCell.vue
+++ b/src/components/jeecg/JVxeTable/src/components/cells/JVxeNormalCell.vue
@@ -1,55 +1,53 @@
 <template>
-  <JVxeReloadEffect
-      :vNode="innerValue"
-      :effect="isEffect"
-      @effectEnd="handleEffectEnd"
-  />
+  <JVxeReloadEffect :vNode="innerValue" :effect="isEffect" @effectEnd="handleEffectEnd" />
 </template>
 
 <script lang="ts">
-import { ref, defineComponent } from 'vue'
-import JVxeReloadEffect from '../JVxeReloadEffect'
-import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types'
-import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
-import { watch } from 'vue'
+  import { ref, defineComponent } from 'vue';
+  import JVxeReloadEffect from '../JVxeReloadEffect';
+  import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types';
+  import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
+  import { watch } from 'vue';
 
-export default defineComponent({
-  name: 'JVxeNormalCell',
-  components: { JVxeReloadEffect },
-  props: useJVxeCompProps(),
-  setup(props: JVxeComponent.Props) {
-    const setup = useJVxeComponent(props)
-    const { innerValue, row } = setup
+  export default defineComponent({
+    name: 'JVxeNormalCell',
+    components: { JVxeReloadEffect },
+    props: useJVxeCompProps(),
+    setup(props: JVxeComponent.Props) {
+      const setup = useJVxeComponent(props);
+      const { innerValue, row } = setup;
 
-    const reloadEffect = props.renderOptions.reloadEffect
-    const isEffect = ref<boolean>(false)
+      const reloadEffect = props.renderOptions.reloadEffect;
+      const isEffect = ref<boolean>(false);
 
-    watch(innerValue, () => {
-      if (reloadEffect.enabled) {
-        if (reloadEffect.isEffect(row.value.id)) {
-          isEffect.value = true
-        }
+      watch(
+        innerValue,
+        () => {
+          if (reloadEffect.enabled) {
+            if (reloadEffect.isEffect(row.value.id)) {
+              isEffect.value = true;
+            }
+          }
+        },
+        { immediate: true }
+      );
+
+      // 特效结束
+      function handleEffectEnd() {
+        isEffect.value = false;
+        reloadEffect.removeEffect(row.value.id);
       }
-    }, { immediate: true })
 
-    // 特效结束
-    function handleEffectEnd() {
-      isEffect.value = false
-      reloadEffect.removeEffect(row.value.id)
-    }
-
-    return {
-      innerValue,
-      isEffect,
-      handleEffectEnd,
-    }
-  },
-  enhanced: {
-    switches: { editRender: false },
-  } as JVxeComponent.EnhancedPartial,
-})
+      return {
+        innerValue,
+        isEffect,
+        handleEffectEnd,
+      };
+    },
+    enhanced: {
+      switches: { editRender: false },
+    } as JVxeComponent.EnhancedPartial,
+  });
 </script>
 
-<style scoped>
-
-</style>
\ No newline at end of file
+<style scoped></style>
diff --git a/src/components/jeecg/JVxeTable/src/components/cells/JVxeProgressCell.vue b/src/components/jeecg/JVxeTable/src/components/cells/JVxeProgressCell.vue
index ebc6ca9..135eb97 100644
--- a/src/components/jeecg/JVxeTable/src/components/cells/JVxeProgressCell.vue
+++ b/src/components/jeecg/JVxeTable/src/components/cells/JVxeProgressCell.vue
@@ -1,57 +1,52 @@
 <template>
-  <Progress
-      :class="clazz"
-      :percent="innerValue"
-      size="small"
-      v-bind="cellProps"
-  />
+  <Progress :class="clazz" :percent="innerValue" size="small" v-bind="cellProps" />
 </template>
 
 <script lang="ts">
-import { computed, defineComponent } from 'vue'
-import { Progress } from 'ant-design-vue'
-import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types'
-import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
+  import { computed, defineComponent } from 'vue';
+  import { Progress } from 'ant-design-vue';
+  import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types';
+  import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
 
-export default defineComponent({
-  name: 'JVxeCheckboxCell',
-  components: { Progress },
-  props: useJVxeCompProps(),
-  setup(props: JVxeComponent.Props) {
-    const { innerValue, cellProps, scrolling } = useJVxeComponent(props)
-    const clazz = computed(() => {
-      return {
-        'j-vxe-progress': true,
-        'no-animation': scrolling.value,
-      }
-    })
-    return { innerValue, cellProps, clazz }
-  },
-  // 【组件增强】注释详见：：JVxeComponent.Enhanced
-  enhanced: {
-    switches: {
-      editRender: false,
+  export default defineComponent({
+    name: 'JVxeCheckboxCell',
+    components: { Progress },
+    props: useJVxeCompProps(),
+    setup(props: JVxeComponent.Props) {
+      const { innerValue, cellProps, scrolling } = useJVxeComponent(props);
+      const clazz = computed(() => {
+        return {
+          'j-vxe-progress': true,
+          'no-animation': scrolling.value,
+        };
+      });
+      return { innerValue, cellProps, clazz };
     },
-    setValue(value) {
-      try {
-        if (typeof value !== 'number') {
-          return Number.parseFloat(value)
-        } else {
-          return value
+    // 【组件增强】注释详见：：JVxeComponent.Enhanced
+    enhanced: {
+      switches: {
+        editRender: false,
+      },
+      setValue(value) {
+        try {
+          if (typeof value !== 'number') {
+            return Number.parseFloat(value);
+          } else {
+            return value;
+          }
+        } catch {
+          return 0;
         }
-      } catch {
-        return 0
-      }
-    },
-  } as JVxeComponent.EnhancedPartial,
-})
+      },
+    } as JVxeComponent.EnhancedPartial,
+  });
 </script>
 
 <style scoped lang="less">
-// 关闭进度条的动画，防止滚动时动态赋值出现问题
-.j-vxe-progress.no-animation {
-  ::v-deep(.ant-progress-bg) {
-    transition: none !important;
+  // 关闭进度条的动画，防止滚动时动态赋值出现问题
+  .j-vxe-progress.no-animation {
+    ::v-deep(.ant-progress-bg) {
+      transition: none !important;
+    }
   }
-}
 </style>
diff --git a/src/components/jeecg/JVxeTable/src/components/cells/JVxeRadioCell.vue b/src/components/jeecg/JVxeTable/src/components/cells/JVxeRadioCell.vue
index e25f116..2fdd473 100644
--- a/src/components/jeecg/JVxeTable/src/components/cells/JVxeRadioCell.vue
+++ b/src/components/jeecg/JVxeTable/src/components/cells/JVxeRadioCell.vue
@@ -1,75 +1,58 @@
 <template>
-  <a-radio-group
-      :class="clazz"
-      :value="innerValue"
-      v-bind="cellProps"
-      @change="(e)=>handleChangeCommon(e.target.value)"
-  >
-    <a-radio
-        v-for="item of originColumn.options"
-        :key="item.value"
-        :value="item.value"
-        @click="e=>handleRadioClick(item,e)"
-    >{{ item.text || item.label || item.title || item.value }}
-    </a-radio>
+  <a-radio-group :class="clazz" :value="innerValue" v-bind="cellProps" @change="(e) => handleChangeCommon(e.target.value)">
+    <a-radio v-for="item of originColumn.options" :key="item.value" :value="item.value" @click="(e) => handleRadioClick(item, e)">{{ item.text || item.label || item.title || item.value }} </a-radio>
   </a-radio-group>
 </template>
 
-
 <script lang="ts">
-import { computed, defineComponent } from 'vue'
-import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types'
-import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
+  import { computed, defineComponent } from 'vue';
+  import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types';
+  import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
 
-export default defineComponent({
-  name: 'JVxeRadioCell',
-  props: useJVxeCompProps(),
-  setup(props: JVxeComponent.Props) {
-    const {
-      innerValue,
-      cellProps,
-      originColumn,
-      handleChangeCommon,
-    } = useJVxeComponent(props)
-    const scrolling = computed(() => !!props.renderOptions.scrolling)
-    const clazz = computed(() => {
-      return {
-        'j-vxe-radio': true,
-        'no-animation': scrolling.value,
-      }
-    })
+  export default defineComponent({
+    name: 'JVxeRadioCell',
+    props: useJVxeCompProps(),
+    setup(props: JVxeComponent.Props) {
+      const { innerValue, cellProps, originColumn, handleChangeCommon } = useJVxeComponent(props);
+      const scrolling = computed(() => !!props.renderOptions.scrolling);
+      const clazz = computed(() => {
+        return {
+          'j-vxe-radio': true,
+          'no-animation': scrolling.value,
+        };
+      });
 
-    function handleRadioClick(item) {
-      if (originColumn.value.allowClear === true) {
-        // 取消选择
-        if (item.value === innerValue.value) {
-          handleChangeCommon(null)
+      function handleRadioClick(item) {
+        if (originColumn.value.allowClear === true) {
+          // 取消选择
+          if (item.value === innerValue.value) {
+            handleChangeCommon(null);
+          }
         }
       }
-    }
 
-    return {
-      clazz,
-      innerValue,
-      originColumn,
-      cellProps,
-      handleRadioClick,
-      handleChangeCommon,
-    }
-  },
-  // 【组件增强】注释详见：JVxeComponent.Enhanced
-  enhanced: {
-    switches: { visible: true },
-  } as JVxeComponent.EnhancedPartial,
-})
+      return {
+        clazz,
+        innerValue,
+        originColumn,
+        cellProps,
+        handleRadioClick,
+        handleChangeCommon,
+      };
+    },
+    // 【组件增强】注释详见：JVxeComponent.Enhanced
+    enhanced: {
+      switches: { visible: true },
+    } as JVxeComponent.EnhancedPartial,
+  });
 </script>
 
 <style lang="less">
-// 关闭动画，防止滚动时动态赋值出现问题
-.j-vxe-radio.no-animation {
-  .ant-radio-inner,
-  .ant-radio-inner::after {
-    transition: none !important;
+  // 关闭动画，防止滚动时动态赋值出现问题
+  .j-vxe-radio.no-animation {
+    .ant-radio-inner,
+    .ant-radio-inner::after {
+      transition: none !important;
+    }
   }
-}
-</style>
\ No newline at end of file
+</style>
diff --git a/src/components/jeecg/JVxeTable/src/components/cells/JVxeSelectCell.vue b/src/components/jeecg/JVxeTable/src/components/cells/JVxeSelectCell.vue
index c90ae67..d8a82f6 100644
--- a/src/components/jeecg/JVxeTable/src/components/cells/JVxeSelectCell.vue
+++ b/src/components/jeecg/JVxeTable/src/components/cells/JVxeSelectCell.vue
@@ -1,7 +1,7 @@
 <template>
   <a-select :value="innerValue" v-bind="selectProps">
     <template v-if="loading" #notFoundContent>
-      <LoadingOutlined/>
+      <LoadingOutlined />
       <span>&nbsp;加载中…</span>
     </template>
     <template v-for="option of selectOptions" :key="option.value">
@@ -13,223 +13,219 @@
 </template>
 
 <script lang="ts">
-import { ref, computed, defineComponent } from 'vue'
-import { LoadingOutlined } from '@ant-design/icons-vue'
-import { filterDictText } from '/@/utils/dict/JDictSelectUtil'
-import { JVxeComponent, JVxeTypes } from '/@/components/jeecg/JVxeTable/types'
-import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
-import { dispatchEvent } from '/@/components/jeecg/JVxeTable/utils'
-import { isPromise } from '/@/utils/is'
+  import { ref, computed, defineComponent } from 'vue';
+  import { LoadingOutlined } from '@ant-design/icons-vue';
+  import { filterDictText } from '/@/utils/dict/JDictSelectUtil';
+  import { JVxeComponent, JVxeTypes } from '/@/components/jeecg/JVxeTable/types';
+  import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
+  import { dispatchEvent } from '/@/components/jeecg/JVxeTable/utils';
+  import { isPromise } from '/@/utils/is';
 
-export default defineComponent({
-  name: 'JVxeSelectCell',
-  components: { LoadingOutlined },
-  props: useJVxeCompProps(),
-  setup(props: JVxeComponent.Props) {
-    const {
-      innerValue,
-      cellProps,
-      row,
-      originColumn,
-      handleChangeCommon,
-      handleBlurCommon,
-    } = useJVxeComponent(props)
-    const loading = ref(false)
-    // 异步加载的options（用于多级联动）
-    const asyncOptions = ref<any[] | null>(null)
-    // 下拉框 props
-    const selectProps = computed(() => {
-      let selProps = {
-        ...cellProps.value,
-        allowClear: true,
-        autofocus: true,
-        defaultOpen: true,
-        style: { width: '100%' },
-        filterOption: handleSelectFilterOption,
-        onBlur: handleBlur,
-        onChange: handleChange,
-      }
-      // 判断select是否允许输入
-      let { allowSearch, allowInput } = originColumn.value
-      if (allowInput === true || allowSearch === true) {
-        selProps['showSearch'] = true
-        selProps['onSearch'] = handleSearchSelect
-      }
-      return selProps
-    })
-    // 下拉选项
-    const selectOptions = computed(() => {
-      if (asyncOptions.value) {
-        return asyncOptions.value
-      }
-      let { linkage } = props.renderOptions
-      if (linkage) {
-        let { getLinkageOptionsSibling, config } = linkage
-        let res = getLinkageOptionsSibling(row.value, originColumn.value, config, true)
-        // 当返回Promise时，说明是多级联动
-        if (res instanceof Promise) {
-          loading.value = true
-          res.then(opt => {
-            asyncOptions.value = opt
-            loading.value = false
-          }).catch(e => {
-            console.error(e)
-            loading.value = false
-          })
-        } else {
-          asyncOptions.value = null
-          return res
+  export default defineComponent({
+    name: 'JVxeSelectCell',
+    components: { LoadingOutlined },
+    props: useJVxeCompProps(),
+    setup(props: JVxeComponent.Props) {
+      const { innerValue, cellProps, row, originColumn, handleChangeCommon, handleBlurCommon } = useJVxeComponent(props);
+      const loading = ref(false);
+      // 异步加载的options（用于多级联动）
+      const asyncOptions = ref<any[] | null>(null);
+      // 下拉框 props
+      const selectProps = computed(() => {
+        let selProps = {
+          ...cellProps.value,
+          allowClear: true,
+          autofocus: true,
+          defaultOpen: true,
+          style: { width: '100%' },
+          filterOption: handleSelectFilterOption,
+          onBlur: handleBlur,
+          onChange: handleChange,
+        };
+        // 判断select是否允许输入
+        let { allowSearch, allowInput } = originColumn.value;
+        if (allowInput === true || allowSearch === true) {
+          selProps['showSearch'] = true;
+          selProps['onSearch'] = handleSearchSelect;
         }
-      }
-      return originColumn.value.options
-    })
-
-    // --------- created ---------
-
-    // 多选、搜索type
-    let multipleTypes = [JVxeTypes.selectMultiple, 'list_multi']
-    let searchTypes = [JVxeTypes.selectSearch, 'sel_search']
-    if (multipleTypes.includes(props.type)) {
-      // 处理多选
-      let props = originColumn.value.props || {}
-      props['mode'] = 'multiple'
-      props['maxTagCount'] = 1
-      originColumn.value.props = props
-    } else if (searchTypes.includes(props.type)) {
-      // 处理搜索
-      originColumn.value.allowSearch = true
-    }
-
-    /** 处理 change 事件 */
-    function handleChange(value) {
-      // 处理下级联动
-      let linkage = props.renderOptions.linkage
-      if (linkage) {
-        linkage.handleLinkageSelectChange(row.value, originColumn.value, linkage.config, value)
-      }
-      handleChangeCommon(value)
-    }
-
-    /** 处理blur失去焦点事件 */
-    function handleBlur(value) {
-      let { allowInput, options } = originColumn.value
-      if (allowInput === true) {
-        // 删除无用的因搜索（用户输入）而创建的项
-        if (typeof value === 'string') {
-          let indexes: number[] = []
-          options.forEach((option, index) => {
-            if (option.value.toLocaleString() === value.toLocaleString()) {
-              delete option.searchAdd
-            } else if (option.searchAdd === true) {
-              indexes.push(index)
-            }
-          })
-          // 翻转删除数组中的项
-          for (let index of indexes.reverse()) {
-            options.splice(index, 1)
-          }
+        return selProps;
+      });
+      // 下拉选项
+      const selectOptions = computed(() => {
+        if (asyncOptions.value) {
+          return asyncOptions.value;
         }
-      }
-      handleBlurCommon(value)
-    }
-
-    /** 用于搜索下拉框中的内容 */
-    function handleSelectFilterOption(input, option) {
-      let { allowSearch, allowInput } = originColumn.value
-      if (allowSearch === true || allowInput === true) {
-        return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0
-      }
-      return true
-    }
-
-    /** select 搜索时的事件，用于动态添加options */
-    function handleSearchSelect(value) {
-      let { allowSearch, allowInput, options } = originColumn.value
-
-      if (allowSearch !== true && allowInput === true) {
-        // 是否找到了对应的项，找不到则添加这一项
-        let flag = false
-        for (let option of options) {
-          if (option.value.toLocaleString() === value.toLocaleString()) {
-            flag = true
-            break
-          }
-        }
-        // !!value ：不添加空值
-        if (!flag && !!value) {
-          // searchAdd 是否是通过搜索添加的
-          options.push({ title: value, value: value, searchAdd: true })
-        }
-      }
-    }
-
-    return {
-      loading,
-      innerValue,
-      selectProps,
-      selectOptions,
-      handleChange,
-      handleBlur,
-    }
-  },
-  // 【组件增强】注释详见：JVxeComponent.Enhanced
-  enhanced: {
-    aopEvents: {
-      editActived({$event, row, column}) {
-        dispatchEvent({
-          $event,
-          row, column,
-          props: this.props,
-          instance: this,
-          className: '.ant-select .ant-select-selection-search-input',
-          isClick: false,
-          handler: (el) => el.focus(),
-        })
-      },
-    },
-    translate: {
-      enabled: true,
-      async handler(value, ctx) {
-        let { props, context } = ctx!
-        let { row, originColumn } = context
-        let options
-        let linkage = props?.renderOptions.linkage
-        // 判断是否是多级联动，如果是就通过接口异步翻译
+        let { linkage } = props.renderOptions;
         if (linkage) {
-          let { getLinkageOptionsSibling, config } = linkage
-          let linkageOptions = getLinkageOptionsSibling(row.value, originColumn.value, config, true)
-          options = isPromise(linkageOptions) ? await linkageOptions : linkageOptions
-        } else if (isPromise(originColumn.value.optionsPromise)) {
-          options = await originColumn.value.optionsPromise
-        } else {
-          options = originColumn.value.options
+          let { getLinkageOptionsSibling, config } = linkage;
+          let res = getLinkageOptionsSibling(row.value, originColumn.value, config, true);
+          // 当返回Promise时，说明是多级联动
+          if (res instanceof Promise) {
+            loading.value = true;
+            res
+              .then((opt) => {
+                asyncOptions.value = opt;
+                loading.value = false;
+              })
+              .catch((e) => {
+                console.error(e);
+                loading.value = false;
+              });
+          } else {
+            asyncOptions.value = null;
+            return res;
+          }
         }
-        return filterDictText(options, value)
+        return originColumn.value.options;
+      });
+
+      // --------- created ---------
+
+      // 多选、搜索type
+      let multipleTypes = [JVxeTypes.selectMultiple, 'list_multi'];
+      let searchTypes = [JVxeTypes.selectSearch, 'sel_search'];
+      if (multipleTypes.includes(props.type)) {
+        // 处理多选
+        let props = originColumn.value.props || {};
+        props['mode'] = 'multiple';
+        props['maxTagCount'] = 1;
+        originColumn.value.props = props;
+      } else if (searchTypes.includes(props.type)) {
+        // 处理搜索
+        originColumn.value.allowSearch = true;
+      }
+
+      /** 处理 change 事件 */
+      function handleChange(value) {
+        // 处理下级联动
+        let linkage = props.renderOptions.linkage;
+        if (linkage) {
+          linkage.handleLinkageSelectChange(row.value, originColumn.value, linkage.config, value);
+        }
+        handleChangeCommon(value);
+      }
+
+      /** 处理blur失去焦点事件 */
+      function handleBlur(value) {
+        let { allowInput, options } = originColumn.value;
+        if (allowInput === true) {
+          // 删除无用的因搜索（用户输入）而创建的项
+          if (typeof value === 'string') {
+            let indexes: number[] = [];
+            options.forEach((option, index) => {
+              if (option.value.toLocaleString() === value.toLocaleString()) {
+                delete option.searchAdd;
+              } else if (option.searchAdd === true) {
+                indexes.push(index);
+              }
+            });
+            // 翻转删除数组中的项
+            for (let index of indexes.reverse()) {
+              options.splice(index, 1);
+            }
+          }
+        }
+        handleBlurCommon(value);
+      }
+
+      /** 用于搜索下拉框中的内容 */
+      function handleSelectFilterOption(input, option) {
+        let { allowSearch, allowInput } = originColumn.value;
+        if (allowSearch === true || allowInput === true) {
+          return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0;
+        }
+        return true;
+      }
+
+      /** select 搜索时的事件，用于动态添加options */
+      function handleSearchSelect(value) {
+        let { allowSearch, allowInput, options } = originColumn.value;
+
+        if (allowSearch !== true && allowInput === true) {
+          // 是否找到了对应的项，找不到则添加这一项
+          let flag = false;
+          for (let option of options) {
+            if (option.value.toLocaleString() === value.toLocaleString()) {
+              flag = true;
+              break;
+            }
+          }
+          // !!value ：不添加空值
+          if (!flag && !!value) {
+            // searchAdd 是否是通过搜索添加的
+            options.push({ title: value, value: value, searchAdd: true });
+          }
+        }
+      }
+
+      return {
+        loading,
+        innerValue,
+        selectProps,
+        selectOptions,
+        handleChange,
+        handleBlur,
+      };
+    },
+    // 【组件增强】注释详见：JVxeComponent.Enhanced
+    enhanced: {
+      aopEvents: {
+        editActived({ $event, row, column }) {
+          dispatchEvent({
+            $event,
+            row,
+            column,
+            props: this.props,
+            instance: this,
+            className: '.ant-select .ant-select-selection-search-input',
+            isClick: false,
+            handler: (el) => el.focus(),
+          });
+        },
       },
-    },
-    getValue(value) {
-      if (Array.isArray(value)) {
-        return value.join(',')
-      } else {
-        return value
-      }
-    },
-    setValue(value, ctx) {
-      let { context } = ctx!
-      let { originColumn } = context
-      // 判断是否是多选
-      if ((originColumn.value.props || {})['mode'] === 'multiple') {
-        originColumn.value.props['maxTagCount'] = 1
-      }
-      if (value != null && value !== '') {
-        if (typeof value === 'string') {
-          return value === '' ? [] : value.split(',')
+      translate: {
+        enabled: true,
+        async handler(value, ctx) {
+          let { props, context } = ctx!;
+          let { row, originColumn } = context;
+          let options;
+          let linkage = props?.renderOptions.linkage;
+          // 判断是否是多级联动，如果是就通过接口异步翻译
+          if (linkage) {
+            let { getLinkageOptionsSibling, config } = linkage;
+            let linkageOptions = getLinkageOptionsSibling(row.value, originColumn.value, config, true);
+            options = isPromise(linkageOptions) ? await linkageOptions : linkageOptions;
+          } else if (isPromise(originColumn.value.optionsPromise)) {
+            options = await originColumn.value.optionsPromise;
+          } else {
+            options = originColumn.value.options;
+          }
+          return filterDictText(options, value);
+        },
+      },
+      getValue(value) {
+        if (Array.isArray(value)) {
+          return value.join(',');
+        } else {
+          return value;
         }
-        return value
-      } else {
-        return undefined
-      }
-    },
-  } as JVxeComponent.EnhancedPartial,
-})
-</script>
\ No newline at end of file
+      },
+      setValue(value, ctx) {
+        let { context } = ctx!;
+        let { originColumn } = context;
+        // 判断是否是多选
+        if ((originColumn.value.props || {})['mode'] === 'multiple') {
+          originColumn.value.props['maxTagCount'] = 1;
+        }
+        if (value != null && value !== '') {
+          if (typeof value === 'string') {
+            return value === '' ? [] : value.split(',');
+          }
+          return value;
+        } else {
+          return undefined;
+        }
+      },
+    } as JVxeComponent.EnhancedPartial,
+  });
+</script>
diff --git a/src/components/jeecg/JVxeTable/src/components/cells/JVxeSlotCell.ts b/src/components/jeecg/JVxeTable/src/components/cells/JVxeSlotCell.ts
index 6605d5c..35fcb9f 100644
--- a/src/components/jeecg/JVxeTable/src/components/cells/JVxeSlotCell.ts
+++ b/src/components/jeecg/JVxeTable/src/components/cells/JVxeSlotCell.ts
@@ -1,12 +1,12 @@
-import { computed, defineComponent, h } from 'vue'
-import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/src/hooks/useJVxeComponent'
-import { JVxeComponent } from '/@/components/jeecg/JVxeTable/src/types/JVxeComponent'
+import { computed, defineComponent, h } from 'vue';
+import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/src/hooks/useJVxeComponent';
+import { JVxeComponent } from '/@/components/jeecg/JVxeTable/src/types/JVxeComponent';
 
 export default defineComponent({
   name: 'JVxeSlotCell',
   props: useJVxeCompProps(),
   setup(props: JVxeComponent.Props) {
-    const data = useJVxeComponent(props)
+    const data = useJVxeComponent(props);
     const slotProps = computed(() => {
       return {
         value: data.innerValue.value,
@@ -21,16 +21,16 @@ export default defineComponent({
         scrolling: props.renderOptions.scrolling,
         reloadEffect: props.renderOptions.reloadEffect.enabled,
         triggerChange: (v) => data.handleChangeCommon(v),
-      }
-    })
+      };
+    });
     return () => {
-      let { slot } = props.renderOptions
+      let { slot } = props.renderOptions;
       if (slot) {
-        return h('div', {}, slot(slotProps.value))
+        return h('div', {}, slot(slotProps.value));
       } else {
-        return h('div')
+        return h('div');
       }
-    }
+    };
   },
   // 【组件增强】注释详见：JVxeComponent.Enhanced
   enhanced: {
@@ -38,4 +38,4 @@ export default defineComponent({
       editRender: false,
     },
   } as JVxeComponent.EnhancedPartial,
-})
+});
diff --git a/src/components/jeecg/JVxeTable/src/components/cells/JVxeTextareaCell.vue b/src/components/jeecg/JVxeTable/src/components/cells/JVxeTextareaCell.vue
index 3523b89..a1dfc7f 100644
--- a/src/components/jeecg/JVxeTable/src/components/cells/JVxeTextareaCell.vue
+++ b/src/components/jeecg/JVxeTable/src/components/cells/JVxeTextareaCell.vue
@@ -1,50 +1,43 @@
 <template>
-  <JInputPop
-      :value="innerValue"
-      :width="300"
-      :height="210"
-      v-bind="cellProps"
-      style="width: 100%;"
-      @blur="handleBlurCommon"
-      @change="handleChangeCommon"
-  />
+  <JInputPop :value="innerValue" :width="300" :height="210" v-bind="cellProps" style="width: 100%" @blur="handleBlurCommon" @change="handleChangeCommon" />
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue'
-import JInputPop from '/@/components/Form/src/jeecg/components/JInputPop.vue'
-import { dispatchEvent } from '/@/components/jeecg/JVxeTable/utils'
-import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types'
-import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
+  import { defineComponent } from 'vue';
+  import JInputPop from '/@/components/Form/src/jeecg/components/JInputPop.vue';
+  import { dispatchEvent } from '/@/components/jeecg/JVxeTable/utils';
+  import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types';
+  import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
 
-export default defineComponent({
-  name: 'JVxeTextareaCell',
-  components: { JInputPop },
-  props: useJVxeCompProps(),
-  setup(props: JVxeComponent.Props) {
-    const { innerValue, cellProps, handleChangeCommon, handleBlurCommon } = useJVxeComponent(props)
-    return { innerValue, cellProps, handleChangeCommon, handleBlurCommon }
-  },
-  // 【组件增强】注释详见：JVxeComponent.Enhanced
-  enhanced: {
-    installOptions: {
-      autofocus: '.ant-input',
+  export default defineComponent({
+    name: 'JVxeTextareaCell',
+    components: { JInputPop },
+    props: useJVxeCompProps(),
+    setup(props: JVxeComponent.Props) {
+      const { innerValue, cellProps, handleChangeCommon, handleBlurCommon } = useJVxeComponent(props);
+      return { innerValue, cellProps, handleChangeCommon, handleBlurCommon };
     },
-    aopEvents: {
-      editActived({$event, row, column}) {
-        // 是否默认打开右侧弹窗
-        if ((column.params.defaultOpen ?? false)) {
-          dispatchEvent({
-            $event,
-            row, column,
-            props: this.props,
-            instance: this,
-            className: '.ant-input-suffix .app-iconify',
-            isClick: true,
-          })
-        }
+    // 【组件增强】注释详见：JVxeComponent.Enhanced
+    enhanced: {
+      installOptions: {
+        autofocus: '.ant-input',
       },
-    },
-  } as JVxeComponent.EnhancedPartial,
-})
+      aopEvents: {
+        editActived({ $event, row, column }) {
+          // 是否默认打开右侧弹窗
+          if (column.params.defaultOpen ?? false) {
+            dispatchEvent({
+              $event,
+              row,
+              column,
+              props: this.props,
+              instance: this,
+              className: '.ant-input-suffix .app-iconify',
+              isClick: true,
+            });
+          }
+        },
+      },
+    } as JVxeComponent.EnhancedPartial,
+  });
 </script>
diff --git a/src/components/jeecg/JVxeTable/src/components/cells/JVxeTimeCell.vue b/src/components/jeecg/JVxeTable/src/components/cells/JVxeTimeCell.vue
index 06cef2c..2a4d4be 100644
--- a/src/components/jeecg/JVxeTable/src/components/cells/JVxeTimeCell.vue
+++ b/src/components/jeecg/JVxeTable/src/components/cells/JVxeTimeCell.vue
@@ -1,73 +1,65 @@
 <template>
-  <TimePicker
-      :value="innerTimeValue"
-      allowClear
-      :format="format"
-      dropdownClassName="j-vxe-time-picker"
-      style="min-width: 0;"
-      v-bind="cellProps"
-      @change="handleChange"
-  />
+  <TimePicker :value="innerTimeValue" allowClear :format="format" dropdownClassName="j-vxe-time-picker" style="min-width: 0" v-bind="cellProps" @change="handleChange" />
 </template>
 
 <script lang="ts">
-import { ref, computed, watch, defineComponent } from 'vue'
-import moment from 'moment'
-import { TimePicker } from 'ant-design-vue'
-import { dispatchEvent } from '/@/components/jeecg/JVxeTable/utils'
-import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types'
-import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
-import { isEmpty } from '/@/utils/is'
+  import { ref, computed, watch, defineComponent } from 'vue';
+  import moment from 'moment';
+  import { TimePicker } from 'ant-design-vue';
+  import { dispatchEvent } from '/@/components/jeecg/JVxeTable/utils';
+  import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types';
+  import { useJVxeComponent, useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
+  import { isEmpty } from '/@/utils/is';
 
-export default defineComponent({
-  name: 'JVxeTimeCell',
-  components: { TimePicker },
-  props: useJVxeCompProps(),
-  setup(props: JVxeComponent.Props) {
-    const {
-      innerValue,
-      cellProps,
-      originColumn,
-      handleChangeCommon,
-    } = useJVxeComponent(props)
-    const innerTimeValue = ref<any>(null)
-    const format = computed(() => {
-      let format = originColumn.value.format
-      return format ? format : 'HH:mm:ss'
-    })
-    watch(innerValue, (val) => {
-      if (val == null || isEmpty(val)) {
-        innerTimeValue.value = null
-      } else {
-        innerTimeValue.value = moment(val, format.value)
+  export default defineComponent({
+    name: 'JVxeTimeCell',
+    components: { TimePicker },
+    props: useJVxeCompProps(),
+    setup(props: JVxeComponent.Props) {
+      const { innerValue, cellProps, originColumn, handleChangeCommon } = useJVxeComponent(props);
+      const innerTimeValue = ref<any>(null);
+      const format = computed(() => {
+        let format = originColumn.value.format;
+        return format ? format : 'HH:mm:ss';
+      });
+      watch(
+        innerValue,
+        (val) => {
+          if (val == null || isEmpty(val)) {
+            innerTimeValue.value = null;
+          } else {
+            innerTimeValue.value = moment(val, format.value);
+          }
+        },
+        { immediate: true }
+      );
+
+      function handleChange(_mom, dateStr) {
+        handleChangeCommon(dateStr);
       }
-    }, { immediate: true })
 
-    function handleChange(_mom, dateStr) {
-      handleChangeCommon(dateStr)
-    }
-
-    return {
-      cellProps,
-      format,
-      innerTimeValue,
-      handleChange,
-    }
-  },
-  // 【组件增强】注释详见：JVxeComponent.Enhanced
-  enhanced: {
-    aopEvents: {
-      editActived({ $event, row, column }) {
-        dispatchEvent({
-          $event,
-          row, column,
-          props: this.props,
-          instance: this,
-          className: '.ant-time-picker-input',
-          isClick: true,
-        })
-      },
+      return {
+        cellProps,
+        format,
+        innerTimeValue,
+        handleChange,
+      };
     },
-  } as JVxeComponent.EnhancedPartial,
-})
-</script>
\ No newline at end of file
+    // 【组件增强】注释详见：JVxeComponent.Enhanced
+    enhanced: {
+      aopEvents: {
+        editActived({ $event, row, column }) {
+          dispatchEvent({
+            $event,
+            row,
+            column,
+            props: this.props,
+            instance: this,
+            className: '.ant-time-picker-input',
+            isClick: true,
+          });
+        },
+      },
+    } as JVxeComponent.EnhancedPartial,
+  });
+</script>
diff --git a/src/components/jeecg/JVxeTable/src/components/cells/JVxeUploadCell.vue b/src/components/jeecg/JVxeTable/src/components/cells/JVxeUploadCell.vue
index c8e1287..0c8f0d3 100644
--- a/src/components/jeecg/JVxeTable/src/components/cells/JVxeUploadCell.vue
+++ b/src/components/jeecg/JVxeTable/src/components/cells/JVxeUploadCell.vue
@@ -4,28 +4,28 @@
       <a-input :readOnly="true" :value="file.name">
         <template #addonBefore style="width: 30px">
           <a-tooltip v-if="file.status === 'uploading'" :title="`上传中(${Math.floor(file.percent)}%)`">
-            <LoadingOutlined/>
+            <LoadingOutlined />
           </a-tooltip>
           <a-tooltip v-else-if="file.status === 'done'" title="上传完成">
-            <Icon icon="ant-design:check-circle-outlined" style="color:#00DB00;"/>
+            <Icon icon="ant-design:check-circle-outlined" style="color: #00db00" />
           </a-tooltip>
-          <a-tooltip v-else :title="file.message||'上传失败'">
-            <Icon icon="ant-design:exclamation-circle-outlined" style="color:red;"/>
+          <a-tooltip v-else :title="file.message || '上传失败'">
+            <Icon icon="ant-design:exclamation-circle-outlined" style="color: red" />
           </a-tooltip>
         </template>
         <span v-if="file.status === 'uploading'" slot="addonAfter">{{ Math.floor(file.percent) }}%</span>
         <template v-if="originColumn.allowDownload !== false || originColumn.allowRemove !== false" #addonAfter>
           <Dropdown :trigger="['click']" placement="bottomRight">
             <a-tooltip title="操作">
-              <Icon icon="ant-design:setting-outlined" style="cursor: pointer;"/>
+              <Icon icon="ant-design:setting-outlined" style="cursor: pointer" />
             </a-tooltip>
             <template #overlay>
               <a-menu>
                 <a-menu-item v-if="originColumn.allowDownload !== false" @click="handleClickDownloadFile">
-                  <span><Icon icon="ant-design:download-outlined"/>&nbsp;下载</span>
+                  <span><Icon icon="ant-design:download-outlined" />&nbsp;下载</span>
                 </a-menu-item>
                 <a-menu-item v-if="originColumn.allowRemove !== false" @click="handleClickDeleteFile">
-                  <span><Icon icon="ant-design:delete-outlined"/>&nbsp;删除</span>
+                  <span><Icon icon="ant-design:delete-outlined" />&nbsp;删除</span>
                 </a-menu-item>
               </a-menu>
             </template>
@@ -34,15 +34,15 @@
       </a-input>
     </template>
     <a-upload
-        v-show="!hasFile"
-        name="file"
-        :data="{'isup': 1}"
-        :multiple="false"
-        :action="originColumn.action"
-        :headers="uploadHeaders"
-        :showUploadList="false"
-        v-bind="cellProps"
-        @change="handleChangeUpload"
+      v-show="!hasFile"
+      name="file"
+      :data="{ isup: 1 }"
+      :multiple="false"
+      :action="originColumn.action"
+      :headers="uploadHeaders"
+      :showUploadList="false"
+      v-bind="cellProps"
+      @change="handleChangeUpload"
     >
       <a-button preIcon="ant-design:upload-outlined">{{ originColumn.btnText || '点击上传' }}</a-button>
     </a-upload>
@@ -50,27 +50,27 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue'
-import { Icon } from '/@/components/Icon'
-import { Dropdown } from 'ant-design-vue'
-import { LoadingOutlined } from '@ant-design/icons-vue'
-import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types'
-import { useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
-import { useJVxeUploadCell, fileGetValue, fileSetValue } from '../../hooks/cells/useJVxeUploadCell'
+  import { defineComponent } from 'vue';
+  import { Icon } from '/@/components/Icon';
+  import { Dropdown } from 'ant-design-vue';
+  import { LoadingOutlined } from '@ant-design/icons-vue';
+  import { JVxeComponent } from '/@/components/jeecg/JVxeTable/types';
+  import { useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
+  import { useJVxeUploadCell, fileGetValue, fileSetValue } from '../../hooks/cells/useJVxeUploadCell';
 
-export default defineComponent({
-  name: 'JVxeUploadCell',
-  components: { Icon, Dropdown, LoadingOutlined },
-  props: useJVxeCompProps(),
-  setup(props: JVxeComponent.Props) {
-    const setup = useJVxeUploadCell(props)
-    return { ...setup }
-  },
-  // 【组件增强】注释详见：：JVxeComponent.Enhanced
-  enhanced: {
-    switches: { visible: true },
-    getValue: value => fileGetValue(value),
-    setValue: value => fileSetValue(value),
-  } as JVxeComponent.EnhancedPartial,
-})
-</script>
\ No newline at end of file
+  export default defineComponent({
+    name: 'JVxeUploadCell',
+    components: { Icon, Dropdown, LoadingOutlined },
+    props: useJVxeCompProps(),
+    setup(props: JVxeComponent.Props) {
+      const setup = useJVxeUploadCell(props);
+      return { ...setup };
+    },
+    // 【组件增强】注释详见：：JVxeComponent.Enhanced
+    enhanced: {
+      switches: { visible: true },
+      getValue: (value) => fileGetValue(value),
+      setValue: (value) => fileSetValue(value),
+    } as JVxeComponent.EnhancedPartial,
+  });
+</script>
diff --git a/src/components/jeecg/JVxeTable/src/hooks/cells/useJVxeUploadCell.ts b/src/components/jeecg/JVxeTable/src/hooks/cells/useJVxeUploadCell.ts
index e79f570..707d89d 100644
--- a/src/components/jeecg/JVxeTable/src/hooks/cells/useJVxeUploadCell.ts
+++ b/src/components/jeecg/JVxeTable/src/hooks/cells/useJVxeUploadCell.ts
@@ -1,9 +1,9 @@
-import { ref, computed, watch } from 'vue'
+import { ref, computed, watch } from 'vue';
 
-import { getToken } from '/@/utils/auth'
-import { getFileAccessHttpUrl } from '/@/utils/common/compUtils'
-import { JVxeComponent } from '../../types/JVxeComponent'
-import { useJVxeComponent } from '../useJVxeComponent'
+import { getToken } from '/@/utils/auth';
+import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
+import { JVxeComponent } from '../../types/JVxeComponent';
+import { useJVxeComponent } from '../useJVxeComponent';
 
 /**
  * use 公共上传组件
@@ -11,41 +11,45 @@ import { useJVxeComponent } from '../useJVxeComponent'
  * @param options 组件选项，token：默认是否传递token，action：默认上传路径，multiple：是否允许多文件
  */
 export function useJVxeUploadCell(props: JVxeComponent.Props, options?) {
-  const setup = useJVxeComponent(props)
-  const { innerValue, originColumn, handleChangeCommon } = setup
+  const setup = useJVxeComponent(props);
+  const { innerValue, originColumn, handleChangeCommon } = setup;
 
-  const innerFile = ref<any>(null)
+  const innerFile = ref<any>(null);
 
   /** upload headers */
   const uploadHeaders = computed(() => {
-    let headers = {}
-    if ((originColumn.value.token ?? (options?.token ?? false)) === true) {
-      headers['X-Access-Token'] = getToken()
+    let headers = {};
+    if ((originColumn.value.token ?? options?.token ?? false) === true) {
+      headers['X-Access-Token'] = getToken();
     }
-    return headers
-  })
+    return headers;
+  });
 
   /** 上传请求地址 */
   const uploadAction = computed(() => {
     if (!originColumn.value.action) {
-      return options?.action ?? ''
+      return options?.action ?? '';
     } else {
-      return originColumn.value.action
+      return originColumn.value.action;
     }
-  })
-  const hasFile = computed(() => innerFile.value != null)
-  const responseName = computed(() => originColumn.value.responseName ?? 'message')
+  });
+  const hasFile = computed(() => innerFile.value != null);
+  const responseName = computed(() => originColumn.value.responseName ?? 'message');
 
-  watch(innerValue, (val) => {
-    if (val) {
-      innerFile.value = val
-    } else {
-      innerFile.value = null
-    }
-  }, { immediate: true })
+  watch(
+    innerValue,
+    (val) => {
+      if (val) {
+        innerFile.value = val;
+      } else {
+        innerFile.value = null;
+      }
+    },
+    { immediate: true }
+  );
 
   function handleChangeUpload(info) {
-    let { file } = info
+    let { file } = info;
     let value = {
       name: file.name,
       type: file.type,
@@ -53,50 +57,50 @@ export function useJVxeUploadCell(props: JVxeComponent.Props, options?) {
       status: file.status,
       percent: file.percent,
       path: innerFile.value?.path ?? '',
-    }
+    };
     if (file.response) {
-      value['responseName'] = file.response[responseName.value]
+      value['responseName'] = file.response[responseName.value];
     }
-    let paths: string[] = []
+    let paths: string[] = [];
     if (options?.multiple && innerFile.value && innerFile.value.path) {
-      paths = innerFile.value.path.split(',')
+      paths = innerFile.value.path.split(',');
     }
     if (file.status === 'done') {
       if (typeof file.response.success === 'boolean') {
         if (file.response.success) {
-          paths.push(file.response[responseName.value])
-          value['path'] = paths.join(',')
-          handleChangeCommon(value)
+          paths.push(file.response[responseName.value]);
+          value['path'] = paths.join(',');
+          handleChangeCommon(value);
         } else {
-          value['status'] = 'error'
-          value['message'] = file.response.message || '未知错误'
+          value['status'] = 'error';
+          value['message'] = file.response.message || '未知错误';
         }
       } else {
         // 考虑到如果设置action上传路径为非jeecg-boot后台，可能不会返回 success 属性的情况，就默认为成功
-        paths.push(file.response[responseName.value])
-        value['path'] = paths.join(',')
-        handleChangeCommon(value)
+        paths.push(file.response[responseName.value]);
+        value['path'] = paths.join(',');
+        handleChangeCommon(value);
       }
     } else if (file.status === 'error') {
-      value['message'] = file.response.message || '未知错误'
+      value['message'] = file.response.message || '未知错误';
     }
-    innerFile.value = value
+    innerFile.value = value;
   }
 
   function handleClickDownloadFile() {
-    let { url, path } = innerFile.value || {}
+    let { url, path } = innerFile.value || {};
     if (!url || url.length === 0) {
       if (path && path.length > 0) {
-        url = getFileAccessHttpUrl(path.split(',')[0])
+        url = getFileAccessHttpUrl(path.split(',')[0]);
       }
     }
     if (url) {
-      window.open(url)
+      window.open(url);
     }
   }
 
   function handleClickDeleteFile() {
-    handleChangeCommon(null)
+    handleChangeCommon(null);
   }
 
   return {
@@ -109,25 +113,25 @@ export function useJVxeUploadCell(props: JVxeComponent.Props, options?) {
     handleChangeUpload,
     handleClickDownloadFile,
     handleClickDeleteFile,
-  }
+  };
 }
 
 export function fileGetValue(value) {
   if (value && value.path) {
-    return value.path
+    return value.path;
   }
-  return value
+  return value;
 }
 
 export function fileSetValue(value) {
   if (value) {
-    let first = value.split(',')[0]
-    let name = first.substring(first.lastIndexOf('/') + 1)
+    let first = value.split(',')[0];
+    let name = first.substring(first.lastIndexOf('/') + 1);
     return {
       name: name,
       path: value,
       status: 'done',
-    }
+    };
   }
-  return value
-}
\ No newline at end of file
+  return value;
+}
diff --git a/src/components/jeecg/JVxeTable/src/hooks/useColumns.ts b/src/components/jeecg/JVxeTable/src/hooks/useColumns.ts
index 1f0638b..f4f9b40 100644
--- a/src/components/jeecg/JVxeTable/src/hooks/useColumns.ts
+++ b/src/components/jeecg/JVxeTable/src/hooks/useColumns.ts
@@ -1,58 +1,58 @@
-import type { JVxeColumn, JVxeDataProps, JVxeTableProps } from '../types'
-import { computed, nextTick } from 'vue'
-import { isArray, isEmpty, isPromise } from '/@/utils/is'
-import { cloneDeep } from 'lodash-es'
-import { JVxeTypePrefix, JVxeTypes } from '../types/JVxeTypes'
-import { initDictOptions } from '/@/utils/dict'
-import { pushIfNotExist } from '/@/utils/common/compUtils'
-import { getEnhanced } from '../utils/enhancedUtils'
-import { isRegistered } from '../utils/registerUtils'
-import { JVxeComponent } from '../types/JVxeComponent'
-import { useValidateRules } from './useValidateRules'
-import { JVxeTableMethods } from '../types'
+import type { JVxeColumn, JVxeDataProps, JVxeTableProps } from '../types';
+import { computed, nextTick } from 'vue';
+import { isArray, isEmpty, isPromise } from '/@/utils/is';
+import { cloneDeep } from 'lodash-es';
+import { JVxeTypePrefix, JVxeTypes } from '../types/JVxeTypes';
+import { initDictOptions } from '/@/utils/dict';
+import { pushIfNotExist } from '/@/utils/common/compUtils';
+import { getEnhanced } from '../utils/enhancedUtils';
+import { isRegistered } from '../utils/registerUtils';
+import { JVxeComponent } from '../types/JVxeComponent';
+import { useValidateRules } from './useValidateRules';
+import { JVxeTableMethods } from '../types';
 
 // handle 方法参数
 export interface HandleArgs {
-  props: JVxeTableProps,
-  slots: any,
-  data: JVxeDataProps,
-  methods: JVxeTableMethods,
-  col?: JVxeColumn,
-  columns: JVxeColumn[],
-  renderOptions?: any,
-  enhanced?: JVxeComponent.Enhanced,
+  props: JVxeTableProps;
+  slots: any;
+  data: JVxeDataProps;
+  methods: JVxeTableMethods;
+  col?: JVxeColumn;
+  columns: JVxeColumn[];
+  renderOptions?: any;
+  enhanced?: JVxeComponent.Enhanced;
 }
 
 export function useColumns(props: JVxeTableProps, data: JVxeDataProps, methods: JVxeTableMethods, slots) {
   data.vxeColumns = computed(() => {
-    let columns: JVxeColumn[] = []
+    let columns: JVxeColumn[] = [];
     if (isArray(props.columns)) {
       // handle 方法参数
-      const args: HandleArgs = { props, slots, data, methods, columns }
-      let seqColumn, selectionColumn, expandColumn, dragSortColumn
+      const args: HandleArgs = { props, slots, data, methods, columns };
+      let seqColumn, selectionColumn, expandColumn, dragSortColumn;
       props.columns.forEach((column: JVxeColumn) => {
         // 排除未授权的列 1 = 显示/隐藏； 2 = 禁用
-        let auth = methods.getColAuth(column.key)
+        let auth = methods.getColAuth(column.key);
         if (auth?.type == '1' && !auth.isAuth) {
-          return
+          return;
         } else if (auth?.type == '2' && !auth.isAuth) {
-          column.disabled = true
+          column.disabled = true;
         }
         // type 不填，默认为 normal
         if (column.type == null || isEmpty(column.type)) {
-          column.type = JVxeTypes.normal
+          column.type = JVxeTypes.normal;
         }
-        let col: JVxeColumn = cloneDeep(column)
+        let col: JVxeColumn = cloneDeep(column);
         // 处理隐藏列
         if (col.type === JVxeTypes.hidden) {
-          return handleInnerColumn(args, col, handleHiddenColumn)
+          return handleInnerColumn(args, col, handleHiddenColumn);
         }
         // 组件未注册，自动设置为 normal
         if (!isRegistered(col.type)) {
-          col.type = JVxeTypes.normal
+          col.type = JVxeTypes.normal;
         }
-        args.enhanced = getEnhanced(col.type)
-        args.col = col
+        args.enhanced = getEnhanced(col.type);
+        args.col = col;
         args.renderOptions = {
           bordered: props.bordered,
           disabled: props.disabled,
@@ -60,59 +60,59 @@ export function useColumns(props: JVxeTableProps, data: JVxeDataProps, methods:
           isDisabledRow: methods.isDisabledRow,
           listeners: {
             trigger: (name, event) => methods.trigger(name, event),
-            valueChange: event => methods.trigger('valueChange', event),
+            valueChange: (event) => methods.trigger('valueChange', event),
             /** 重新排序行 */
-            rowResort: event => {
-              methods.doSort(event.oldIndex, event.newIndex)
-              methods.trigger('dragged', event)
+            rowResort: (event) => {
+              methods.doSort(event.oldIndex, event.newIndex);
+              methods.trigger('dragged', event);
             },
             /** 在当前行下面插入一行 */
-            rowInsertDown: rowIndex => methods.insertRows({}, rowIndex + 1),
+            rowInsertDown: (rowIndex) => methods.insertRows({}, rowIndex + 1),
           },
-        }
+        };
         if (col.type === JVxeTypes.rowNumber) {
-          seqColumn = col
-          columns.push(col)
+          seqColumn = col;
+          columns.push(col);
         } else if (col.type === JVxeTypes.rowRadio || col.type === JVxeTypes.rowCheckbox) {
-          selectionColumn = col
-          columns.push(col)
+          selectionColumn = col;
+          columns.push(col);
         } else if (col.type === JVxeTypes.rowExpand) {
-          expandColumn = col
-          columns.push(col)
+          expandColumn = col;
+          columns.push(col);
         } else if (col.type === JVxeTypes.rowDragSort) {
-          dragSortColumn = col
-          columns.push(col)
+          dragSortColumn = col;
+          columns.push(col);
         } else {
-          col.params = column
-          handlerCol(args)
+          col.params = column;
+          handlerCol(args);
         }
-      })
-      handleInnerColumn(args, seqColumn, handleSeqColumn)
-      handleInnerColumn(args, selectionColumn, handleSelectionColumn)
-      handleInnerColumn(args, expandColumn, handleExpandColumn)
-      handleInnerColumn(args, dragSortColumn, handleDragSortColumn, true)
+      });
+      handleInnerColumn(args, seqColumn, handleSeqColumn);
+      handleInnerColumn(args, selectionColumn, handleSelectionColumn);
+      handleInnerColumn(args, expandColumn, handleExpandColumn);
+      handleInnerColumn(args, dragSortColumn, handleDragSortColumn, true);
     }
-    return columns
-  })
+    return columns;
+  });
 }
 
 /** 处理内置列 */
 function handleInnerColumn(args: HandleArgs, col: JVxeColumn, handler: (args: HandleArgs) => void, assign?: boolean) {
-  let renderOptions = col?.editRender || col?.cellRender
+  let renderOptions = col?.editRender || col?.cellRender;
   return handler({
     ...args,
     col: col,
     renderOptions: assign ? Object.assign({}, args.renderOptions, renderOptions) : renderOptions,
-  })
+  });
 }
 
 /**
  * 处理隐藏列
  */
 function handleHiddenColumn({ col, columns }: HandleArgs) {
-  delete col!.type
-  col!.visible = false
-  columns.push(col!)
+  delete col!.type;
+  col!.visible = false;
+  columns.push(col!);
 }
 
 /**
@@ -127,11 +127,11 @@ function handleSeqColumn({ props, col, columns }: HandleArgs) {
       width: 60,
       fixed: 'left',
       align: 'center',
-    }
+    };
     if (col) {
-      Object.assign(col, column)
+      Object.assign(col, column);
     } else {
-      columns.unshift(column as any)
+      columns.unshift(column as any);
     }
   }
 }
@@ -142,20 +142,20 @@ function handleSeqColumn({ props, col, columns }: HandleArgs) {
 function handleSelectionColumn({ props, data, col, columns }: HandleArgs) {
   // 判断是否开启了可选择行
   if (props.rowSelection) {
-    let width = 40
+    let width = 40;
     if (data.statistics.has && !props.rowExpand && !props.dragSort) {
-      width = 60
+      width = 60;
     }
     let column = {
       type: props.rowSelectionType,
       width: width,
       fixed: 'left',
       align: 'center',
-    }
+    };
     if (col) {
-      Object.assign(col, column)
+      Object.assign(col, column);
     } else {
-      columns.unshift(column as any)
+      columns.unshift(column as any);
     }
   }
 }
@@ -166,9 +166,9 @@ function handleSelectionColumn({ props, data, col, columns }: HandleArgs) {
 function handleExpandColumn({ props, data, col, columns }: HandleArgs) {
   // 是否可展开行
   if (props.rowExpand) {
-    let width = 40
+    let width = 40;
     if (data.statistics.has && !props.dragSort) {
-      width = 60
+      width = 60;
     }
     let column = {
       type: 'expand',
@@ -177,11 +177,11 @@ function handleExpandColumn({ props, data, col, columns }: HandleArgs) {
       fixed: 'left',
       align: 'center',
       slots: { content: 'expandContent' },
-    }
+    };
     if (col) {
-      Object.assign(col, column)
+      Object.assign(col, column);
     } else {
-      columns.unshift(column as any)
+      columns.unshift(column as any);
     }
   }
 }
@@ -190,66 +190,66 @@ function handleExpandColumn({ props, data, col, columns }: HandleArgs) {
 function handleDragSortColumn({ props, data, col, columns, renderOptions }: HandleArgs) {
   // 是否可拖动排序
   if (props.dragSort) {
-    let width = 40
+    let width = 40;
     if (data.statistics.has) {
-      width = 60
+      width = 60;
     }
     let column: any = {
       title: '',
       width: width,
       fixed: 'left',
       align: 'center',
-    }
+    };
     let cellRender = {
       name: JVxeTypePrefix + JVxeTypes.rowDragSort,
       sortKey: props.sortKey,
-    }
+    };
     if (renderOptions) {
-      column.cellRender = Object.assign(renderOptions, cellRender)
+      column.cellRender = Object.assign(renderOptions, cellRender);
     } else {
-      column.cellRender = cellRender
+      column.cellRender = cellRender;
     }
     if (col) {
-      Object.assign(col, column)
+      Object.assign(col, column);
     } else {
-      columns.unshift(column)
+      columns.unshift(column);
     }
   }
 }
 
 /** 处理自定义组件列 */
 function handlerCol(args: HandleArgs) {
-  const { props, col, columns, enhanced } = args
-  if (!col) return
-  let { type } = col
-  col.field = col.key
-  delete col.type
-  let renderName = 'cellRender'
+  const { props, col, columns, enhanced } = args;
+  if (!col) return;
+  let { type } = col;
+  col.field = col.key;
+  delete col.type;
+  let renderName = 'cellRender';
   // 渲染选项
-  let $renderOptions: any = { name: JVxeTypePrefix + type }
+  let $renderOptions: any = { name: JVxeTypePrefix + type };
   if (enhanced?.switches.editRender) {
     if (!(enhanced.switches.visible || props.alwaysEdit)) {
-      renderName = 'editRender'
+      renderName = 'editRender';
     }
     // $renderOptions.type = (enhanced.switches.visible || props.alwaysEdit) ? 'visible' : 'default'
   }
-  col[renderName] = $renderOptions
+  col[renderName] = $renderOptions;
 
-  handleDict(args)
-  handleRules(args)
-  handleStatistics(args)
-  handleSlots(args)
-  handleLinkage(args)
-  handleReloadEffect(args)
+  handleDict(args);
+  handleRules(args);
+  handleStatistics(args);
+  handleSlots(args);
+  handleLinkage(args);
+  handleReloadEffect(args);
 
   if (col.editRender) {
-    Object.assign(col.editRender, args.renderOptions)
+    Object.assign(col.editRender, args.renderOptions);
   }
   if (col.cellRender) {
-    Object.assign(col.cellRender, args.renderOptions)
+    Object.assign(col.cellRender, args.renderOptions);
   }
 
-  columns.push(col)
+  columns.push(col);
 }
 
 /**
@@ -261,25 +261,25 @@ async function handleDict({ col, methods }: HandleArgs) {
     try {
       // 查询字典
       if (!isPromise(col.params.optionsPromise)) {
-        col.params.optionsPromise = new Promise(async resolve => {
-          const dictOptions: any = await initDictOptions(col.params.dictCode)
-          let options = col.params.options ?? []
-          dictOptions.forEach(dict => {
+        col.params.optionsPromise = new Promise(async (resolve) => {
+          const dictOptions: any = await initDictOptions(col.params.dictCode);
+          let options = col.params.options ?? [];
+          dictOptions.forEach((dict) => {
             // 过滤重复数据
-            if (options.findIndex(o => o.value === dict.value) === -1) {
-              options.push(dict)
+            if (options.findIndex((o) => o.value === dict.value) === -1) {
+              options.push(dict);
             }
-          })
-          resolve(options)
-        })
+          });
+          resolve(options);
+        });
       }
-      col.params.options = await col.params.optionsPromise
-      await nextTick()
-      await methods.getXTable().updateData()
+      col.params.options = await col.params.optionsPromise;
+      await nextTick();
+      await methods.getXTable().updateData();
     } catch (e) {
-      console.group(`[JVxeTable] 查询字典 "${col.params.dictCode}" 时发生异常！`)
-      console.warn(e)
-      console.groupEnd()
+      console.group(`[JVxeTable] 查询字典 "${col.params.dictCode}" 时发生异常！`);
+      console.warn(e);
+      console.groupEnd();
     }
   }
 }
@@ -289,7 +289,7 @@ async function handleDict({ col, methods }: HandleArgs) {
  */
 function handleRules(args: HandleArgs) {
   if (isArray(args.col?.validateRules)) {
-    useValidateRules(args)
+    useValidateRules(args);
   }
 }
 
@@ -299,15 +299,15 @@ function handleRules(args: HandleArgs) {
 function handleStatistics({ col, data }: HandleArgs) {
   // sum = 求和、average = 平均值
   if (col && isArray(col.statistics)) {
-    data.statistics.has = true
-    col.statistics.forEach(item => {
+    data.statistics.has = true;
+    col.statistics.forEach((item) => {
       if (!isEmpty(item)) {
-        let arr = data.statistics[(item as string).toLowerCase()]
+        let arr = data.statistics[(item as string).toLowerCase()];
         if (isArray(arr)) {
-          pushIfNotExist(arr, col.key)
+          pushIfNotExist(arr, col.key);
         }
       }
-    })
+    });
   }
 }
 
@@ -318,7 +318,7 @@ function handleSlots({ slots, col, renderOptions }: HandleArgs) {
   // slot 组件特殊处理
   if (col && col.params.type === JVxeTypes.slot) {
     if (!isEmpty(col.slotName) && slots.hasOwnProperty(col.slotName)) {
-      renderOptions.slot = slots[col.slotName]
+      renderOptions.slot = slots[col.slotName];
     }
   }
 }
@@ -334,7 +334,7 @@ function handleLinkage({ data, col, renderOptions, methods }: HandleArgs) {
         getLinkageOptionsAsync: methods.getLinkageOptionsAsync,
         getLinkageOptionsSibling: methods.getLinkageOptionsSibling,
         handleLinkageSelectChange: methods.handleLinkageSelectChange,
-      }
+      };
     }
   }
 }
@@ -343,13 +343,13 @@ function handleReloadEffect({ props, data, renderOptions }: HandleArgs) {
   renderOptions.reloadEffect = {
     enabled: props.reloadEffect,
     getMap() {
-      return data.reloadEffectRowKeysMap
+      return data.reloadEffectRowKeysMap;
     },
     isEffect(rowId) {
-      return data.reloadEffectRowKeysMap[rowId] === true
+      return data.reloadEffectRowKeysMap[rowId] === true;
     },
     removeEffect(rowId) {
-      return data.reloadEffectRowKeysMap[rowId] = false
+      return (data.reloadEffectRowKeysMap[rowId] = false);
     },
-  }
+  };
 }
diff --git a/src/components/jeecg/JVxeTable/src/hooks/useData.ts b/src/components/jeecg/JVxeTable/src/hooks/useData.ts
index 0e3f10e..a9e666f 100644
--- a/src/components/jeecg/JVxeTable/src/hooks/useData.ts
+++ b/src/components/jeecg/JVxeTable/src/hooks/useData.ts
@@ -1,12 +1,12 @@
-import { ref, reactive, provide, resolveComponent } from 'vue'
-import { useDesign } from '/@/hooks/web/useDesign'
-import { JVxeDataProps, JVxeRefs, JVxeTableProps } from '../types'
-import { VxeGridInstance } from 'vxe-table'
-import { randomString } from '/@/utils/common/compUtils'
+import { ref, reactive, provide, resolveComponent } from 'vue';
+import { useDesign } from '/@/hooks/web/useDesign';
+import { JVxeDataProps, JVxeRefs, JVxeTableProps } from '../types';
+import { VxeGridInstance } from 'vxe-table';
+import { randomString } from '/@/utils/common/compUtils';
 
 export function useData(props: JVxeTableProps): JVxeDataProps {
-  const { prefixCls } = useDesign('j-vxe-table')
-  provide('prefixCls', prefixCls)
+  const { prefixCls } = useDesign('j-vxe-table');
+  provide('prefixCls', prefixCls);
   return {
     prefixCls: prefixCls,
     caseId: `j-vxe-${randomString(8)}`,
@@ -41,7 +41,7 @@ export function useData(props: JVxeTableProps): JVxeDataProps {
       // },
       radioConfig: { highlight: true },
       checkboxConfig: { highlight: true },
-      mouseConfig: {selected: false},
+      mouseConfig: { selected: false },
       keyboardConfig: {
         // 删除键功能
         isDel: false,
@@ -71,7 +71,7 @@ export function useData(props: JVxeTableProps): JVxeDataProps {
     innerEditRules: {},
     innerLinkageConfig: new Map<string, any>(),
     reloadEffectRowKeysMap: reactive({}),
-  }
+  };
 }
 
 export function useRefs(): JVxeRefs {
@@ -79,10 +79,10 @@ export function useRefs(): JVxeRefs {
     gridRef: ref<VxeGridInstance>(),
     subPopoverRef: ref<any>(),
     detailsModalRef: ref<any>(),
-  }
+  };
 }
 
 export function useResolveComponent(...t: any[]): any {
   // @ts-ignore
-  return resolveComponent(...t)
-}
\ No newline at end of file
+  return resolveComponent(...t);
+}
diff --git a/src/components/jeecg/JVxeTable/src/hooks/useDataSource.ts b/src/components/jeecg/JVxeTable/src/hooks/useDataSource.ts
index cf7c92b..59816a8 100644
--- a/src/components/jeecg/JVxeTable/src/hooks/useDataSource.ts
+++ b/src/components/jeecg/JVxeTable/src/hooks/useDataSource.ts
@@ -1,32 +1,36 @@
-import { nextTick, watch } from 'vue'
-import { JVxeDataProps, JVxeRefs, JVxeTableMethods } from '../types'
-import { cloneDeep } from 'lodash-es'
+import { nextTick, watch } from 'vue';
+import { JVxeDataProps, JVxeRefs, JVxeTableMethods } from '../types';
+import { cloneDeep } from 'lodash-es';
 
 export function useDataSource(props, data: JVxeDataProps, methods: JVxeTableMethods, refs: JVxeRefs) {
-  watch(() => [props.dataSource, props.disabledRows], async () => {
-    data.disabledRowIds = []
-    data.vxeDataSource.value = cloneDeep(props.dataSource)
-    data.vxeDataSource.value.forEach(row => {
-      // 判断是否是禁用行
-      if (methods.isDisabledRow(row)) {
-        data.disabledRowIds.push(row.id)
-      }
-      // 处理联动回显数据
-      methods.handleLinkageBackData(row)
-    })
-    await waitRef(refs.gridRef)
-    methods.recalcSortNumber()
-  }, { immediate: true })
+  watch(
+    () => [props.dataSource, props.disabledRows],
+    async () => {
+      data.disabledRowIds = [];
+      data.vxeDataSource.value = cloneDeep(props.dataSource);
+      data.vxeDataSource.value.forEach((row) => {
+        // 判断是否是禁用行
+        if (methods.isDisabledRow(row)) {
+          data.disabledRowIds.push(row.id);
+        }
+        // 处理联动回显数据
+        methods.handleLinkageBackData(row);
+      });
+      await waitRef(refs.gridRef);
+      methods.recalcSortNumber();
+    },
+    { immediate: true }
+  );
 }
 
 function waitRef($ref) {
   return new Promise<any>((resolve) => {
     (function next() {
       if ($ref.value) {
-        resolve($ref)
+        resolve($ref);
       } else {
-        nextTick(() => next())
+        nextTick(() => next());
       }
-    })()
-  })
-}
\ No newline at end of file
+    })();
+  });
+}
diff --git a/src/components/jeecg/JVxeTable/src/hooks/useDragSort.ts b/src/components/jeecg/JVxeTable/src/hooks/useDragSort.ts
index ac5191b..a697100 100644
--- a/src/components/jeecg/JVxeTable/src/hooks/useDragSort.ts
+++ b/src/components/jeecg/JVxeTable/src/hooks/useDragSort.ts
@@ -1,64 +1,64 @@
-import { onMounted, onUnmounted, nextTick } from 'vue'
-import { JVxeTableMethods, JVxeTableProps } from '/@/components/jeecg/JVxeTable/src/types'
-import Sortable from 'sortablejs'
+import { onMounted, onUnmounted, nextTick } from 'vue';
+import { JVxeTableMethods, JVxeTableProps } from '/@/components/jeecg/JVxeTable/src/types';
+import Sortable from 'sortablejs';
 
 export function useDragSort(props: JVxeTableProps, methods: JVxeTableMethods) {
   if (props.dragSort) {
-    let sortable2: Sortable
-    let initTime: any
+    let sortable2: Sortable;
+    let initTime: any;
 
     onMounted(() => {
       // 加载完成之后再绑定拖动事件
-      initTime = setTimeout(createSortable, 300)
-    })
+      initTime = setTimeout(createSortable, 300);
+    });
 
     onUnmounted(() => {
-      clearTimeout(initTime)
+      clearTimeout(initTime);
       if (sortable2) {
-        sortable2.destroy()
+        sortable2.destroy();
       }
-    })
+    });
 
     function createSortable() {
-      let xTable = methods.getXTable()
+      let xTable = methods.getXTable();
       // let dom = xTable.$el.querySelector('.vxe-table--fixed-wrapper .vxe-table--body tbody')
-      let dom = xTable.$el.querySelector('.body--wrapper>.vxe-table--body tbody')
-      let startChildren = []
+      let dom = xTable.$el.querySelector('.body--wrapper>.vxe-table--body tbody');
+      let startChildren = [];
       sortable2 = Sortable.create(dom as HTMLElement, {
         handle: '.drag-btn',
         direction: 'vertical',
         animation: 300,
         onStart(e) {
-          let from = e.from
+          let from = e.from;
           // @ts-ignore
-          startChildren = [...from.children]
+          startChildren = [...from.children];
         },
         onEnd(e) {
-          let oldIndex = e.oldIndex as number
-          let newIndex = e.newIndex as number
+          let oldIndex = e.oldIndex as number;
+          let newIndex = e.newIndex as number;
           if (oldIndex === newIndex) {
-            return
+            return;
           }
-          let from = e.from
-          let element = startChildren[oldIndex]
-          let target = null
+          let from = e.from;
+          let element = startChildren[oldIndex];
+          let target = null;
           if (oldIndex > newIndex) {
             // 向上移动
             if (oldIndex + 1 < startChildren.length) {
-              target = startChildren[oldIndex + 1]
+              target = startChildren[oldIndex + 1];
             }
           } else {
             // 向下移动
-            target = startChildren[oldIndex + 1]
+            target = startChildren[oldIndex + 1];
           }
-          from.removeChild(element)
-          from.insertBefore(element, target)
+          from.removeChild(element);
+          from.insertBefore(element, target);
           nextTick(() => {
-            methods.doSort(oldIndex, newIndex)
-            methods.trigger('dragged', { oldIndex, newIndex })
-          })
+            methods.doSort(oldIndex, newIndex);
+            methods.trigger('dragged', { oldIndex, newIndex });
+          });
         },
-      })
+      });
     }
   }
-}
\ No newline at end of file
+}
diff --git a/src/components/jeecg/JVxeTable/src/hooks/useFinallyProps.ts b/src/components/jeecg/JVxeTable/src/hooks/useFinallyProps.ts
index 0a29e97..11db9f7 100644
--- a/src/components/jeecg/JVxeTable/src/hooks/useFinallyProps.ts
+++ b/src/components/jeecg/JVxeTable/src/hooks/useFinallyProps.ts
@@ -1,19 +1,19 @@
-import { unref, computed } from 'vue'
-import { merge } from 'lodash-es'
-import { isArray } from '/@/utils/is'
-import { useAttrs } from '/@/hooks/core/useAttrs'
-import {useKeyboardEdit} from '../hooks/useKeyboardEdit'
-import { JVxeDataProps, JVxeTableMethods, JVxeTableProps } from '../types'
+import { unref, computed } from 'vue';
+import { merge } from 'lodash-es';
+import { isArray } from '/@/utils/is';
+import { useAttrs } from '/@/hooks/core/useAttrs';
+import { useKeyboardEdit } from '../hooks/useKeyboardEdit';
+import { JVxeDataProps, JVxeTableMethods, JVxeTableProps } from '../types';
 
 export function useFinallyProps(props: JVxeTableProps, data: JVxeDataProps, methods: JVxeTableMethods) {
-  const attrs = useAttrs()
+  const attrs = useAttrs();
   // vxe 键盘操作配置
-  const {keyboardEditConfig} = useKeyboardEdit(props)
+  const { keyboardEditConfig } = useKeyboardEdit(props);
   // vxe 最终 editRules
-  const vxeEditRules = computed(() => merge({}, props.editRules, data.innerEditRules))
+  const vxeEditRules = computed(() => merge({}, props.editRules, data.innerEditRules));
   // vxe 最终 events
   const vxeEvents = computed(() => {
-    let listeners = { ...unref(attrs) }
+    let listeners = { ...unref(attrs) };
     let events = {
       onScroll: methods.handleVxeScroll,
       onCellClick: methods.handleCellClick,
@@ -22,54 +22,62 @@ export function useFinallyProps(props: JVxeTableProps, data: JVxeDataProps, meth
       onRadioChange: methods.handleVxeRadioChange,
       onCheckboxAll: methods.handleVxeCheckboxAll,
       onCheckboxChange: methods.handleVxeCheckboxChange,
-    }
+    };
     // 用户传递的事件，进行合并操作
-    Object.keys(listeners).forEach(key => {
-      let listen = listeners[key]
+    Object.keys(listeners).forEach((key) => {
+      let listen = listeners[key];
       if (events.hasOwnProperty(key)) {
         if (isArray(listen)) {
-          listen.push(events[key])
+          listen.push(events[key]);
         } else {
-          listen = [events[key], listen]
+          listen = [events[key], listen];
         }
       }
-      events[key] = listen
-    })
-    return events
-  })
+      events[key] = listen;
+    });
+    return events;
+  });
   // vxe 最终 props
   const vxeProps = computed(() => {
-    return merge({}, data.defaultVxeProps, {
-      showFooter: data.statistics.has,
-    }, unref(attrs), {
-      ref: 'gridRef',
-      size: props.size,
-      loading: false,
-      disabled: props.disabled,
-      columns: unref(data.vxeColumns),
-      editRules: unref(vxeEditRules),
-      height: props.height === 'auto' ? null : props.height,
-      maxHeight: props.maxHeight,
-      border: props.bordered,
-      footerMethod: methods.handleFooterMethod,
-      // 展开行配置
-      expandConfig: {
-        toggleMethod: methods.handleExpandToggleMethod,
+    return merge(
+      {},
+      data.defaultVxeProps,
+      {
+        showFooter: data.statistics.has,
       },
-      // 可编辑配置
-      editConfig: {
-        activeMethod: methods.handleActiveMethod,
+      unref(attrs),
+      {
+        ref: 'gridRef',
+        size: props.size,
+        loading: false,
+        disabled: props.disabled,
+        columns: unref(data.vxeColumns),
+        editRules: unref(vxeEditRules),
+        height: props.height === 'auto' ? null : props.height,
+        maxHeight: props.maxHeight,
+        border: props.bordered,
+        footerMethod: methods.handleFooterMethod,
+        // 展开行配置
+        expandConfig: {
+          toggleMethod: methods.handleExpandToggleMethod,
+        },
+        // 可编辑配置
+        editConfig: {
+          activeMethod: methods.handleActiveMethod,
+        },
+        radioConfig: {
+          checkMethod: methods.handleCheckMethod,
+        },
+        checkboxConfig: {
+          checkMethod: methods.handleCheckMethod,
+        },
       },
-      radioConfig: {
-        checkMethod: methods.handleCheckMethod,
-      },
-      checkboxConfig: {
-        checkMethod: methods.handleCheckMethod,
-      },
-    }, unref(vxeEvents), unref(keyboardEditConfig))
-  })
+      unref(vxeEvents),
+      unref(keyboardEditConfig)
+    );
+  });
   return {
     vxeProps,
     prefixCls: data.prefixCls,
-  }
-}
\ No newline at end of file
+  };
+}
diff --git a/src/components/jeecg/JVxeTable/src/hooks/useJVxeComponent.ts b/src/components/jeecg/JVxeTable/src/hooks/useJVxeComponent.ts
index 2cb6c19..f615b21 100644
--- a/src/components/jeecg/JVxeTable/src/hooks/useJVxeComponent.ts
+++ b/src/components/jeecg/JVxeTable/src/hooks/useJVxeComponent.ts
@@ -1,10 +1,10 @@
-import { computed, nextTick, ref, unref, watch } from 'vue'
-import { propTypes } from '/@/utils/propTypes'
-import { getEnhanced, replaceProps, vModel } from '../utils/enhancedUtils'
-import { JVxeRenderType } from '../types/JVxeTypes'
-import { isBoolean, isFunction, isObject, isPromise } from '/@/utils/is'
-import { JVxeComponent } from '../types/JVxeComponent'
-import { filterDictText } from '/@/utils/dict/JDictSelectUtil'
+import { computed, nextTick, ref, unref, watch } from 'vue';
+import { propTypes } from '/@/utils/propTypes';
+import { getEnhanced, replaceProps, vModel } from '../utils/enhancedUtils';
+import { JVxeRenderType } from '../types/JVxeTypes';
+import { isBoolean, isFunction, isObject, isPromise } from '/@/utils/is';
+import { JVxeComponent } from '../types/JVxeComponent';
+import { filterDictText } from '/@/utils/dict/JDictSelectUtil';
 
 export function useJVxeCompProps() {
   return {
@@ -16,66 +16,66 @@ export function useJVxeCompProps() {
     params: propTypes.object,
     // 渲染自定义选项
     renderOptions: propTypes.object,
-  }
+  };
 }
 
 export function useJVxeComponent(props: JVxeComponent.Props) {
-  const value = computed(() => props.params.row[props.params.column.property])
-  const innerValue = ref(value.value)
-  const row = computed(() => props.params.row)
-  const rows = computed(() => props.params.data)
-  const column = computed(() => props.params.column)
+  const value = computed(() => props.params.row[props.params.column.property]);
+  const innerValue = ref(value.value);
+  const row = computed(() => props.params.row);
+  const rows = computed(() => props.params.data);
+  const column = computed(() => props.params.column);
   // 用户配置的原始 column
-  const originColumn = computed(() => column.value.params)
-  const rowIndex = computed(() => props.params.$rowIndex)
-  const columnIndex = computed(() => props.params.columnIndex)
+  const originColumn = computed(() => column.value.params);
+  const rowIndex = computed(() => props.params.$rowIndex);
+  const columnIndex = computed(() => props.params.columnIndex);
   // 表格数据长度
-  const fullDataLength = computed(() => props.params.$table.internalData.tableFullData.length)
+  const fullDataLength = computed(() => props.params.$table.internalData.tableFullData.length);
   // 是否正在滚动中
-  const scrolling = computed(() => !!props.renderOptions.scrolling)
+  const scrolling = computed(() => !!props.renderOptions.scrolling);
   const cellProps = computed(() => {
-    let renderOptions = props.renderOptions
-    let col = originColumn.value
+    let renderOptions = props.renderOptions;
+    let col = originColumn.value;
 
-    let cellProps = {}
+    let cellProps = {};
 
     // 输入占位符
-    cellProps['placeholder'] = replaceProps(col, col.placeholder)
+    cellProps['placeholder'] = replaceProps(col, col.placeholder);
 
     // 解析props
     if (isObject(col.props)) {
-      Object.keys(col.props).forEach(key => {
-        cellProps[key] = replaceProps(col, col.props[key])
-      })
+      Object.keys(col.props).forEach((key) => {
+        cellProps[key] = replaceProps(col, col.props[key]);
+      });
     }
 
     // 判断是否是禁用的列
-    cellProps['disabled'] = (isBoolean(col['disabled']) ? col['disabled'] : cellProps['disabled'])
+    cellProps['disabled'] = isBoolean(col['disabled']) ? col['disabled'] : cellProps['disabled'];
     // 判断是否禁用行
     if (renderOptions.isDisabledRow(row.value)) {
-      cellProps['disabled'] = true
+      cellProps['disabled'] = true;
     }
     // 判断是否禁用所有组件
     if (renderOptions.disabled === true) {
-      cellProps['disabled'] = true
+      cellProps['disabled'] = true;
     }
 
-    return cellProps
-  })
+    return cellProps;
+  });
 
   const listeners = computed(() => {
-    let listeners = Object.assign({}, (props.renderOptions.listeners || {}))
+    let listeners = Object.assign({}, props.renderOptions.listeners || {});
     // 默认change事件
     if (!listeners.change) {
       listeners.change = async (event) => {
-        vModel(event.value, row, column)
-        await nextTick()
+        vModel(event.value, row, column);
+        await nextTick();
         // 处理 change 事件相关逻辑（例如校验）
-        props.params.$table.updateStatus(props.params)
-      }
+        props.params.$table.updateStatus(props.params);
+      };
     }
-    return listeners
-  })
+    return listeners;
+  });
   const context = {
     innerValue,
     row,
@@ -89,39 +89,43 @@ export function useJVxeComponent(props: JVxeComponent.Props) {
     scrolling,
     handleChangeCommon,
     handleBlurCommon,
-  }
-  const ctx = { props, context }
+  };
+  const ctx = { props, context };
 
   // 获取组件增强
-  const enhanced = getEnhanced(props.type)
+  const enhanced = getEnhanced(props.type);
 
-  watch(value, (newValue) => {
-    // 验证值格式
-    let getValue = enhanced.getValue(newValue, ctx)
-    if (newValue !== getValue) {
-      // 值格式不正确，重新赋值
-      newValue = getValue
-      vModel(newValue, row, column)
-    }
-    innerValue.value = enhanced.setValue(newValue, ctx)
-    // 判断是否启用翻译
-    if (props.renderType === JVxeRenderType.spaner && enhanced.translate.enabled === true) {
-      if (isFunction(enhanced.translate.handler)) {
-        let res = enhanced.translate.handler(newValue, ctx)
-        // 异步翻译，可解决字典查询慢的问题
-        if (isPromise(res)) {
-          res.then(v => innerValue.value = v)
-        } else {
-          innerValue.value = res
+  watch(
+    value,
+    (newValue) => {
+      // 验证值格式
+      let getValue = enhanced.getValue(newValue, ctx);
+      if (newValue !== getValue) {
+        // 值格式不正确，重新赋值
+        newValue = getValue;
+        vModel(newValue, row, column);
+      }
+      innerValue.value = enhanced.setValue(newValue, ctx);
+      // 判断是否启用翻译
+      if (props.renderType === JVxeRenderType.spaner && enhanced.translate.enabled === true) {
+        if (isFunction(enhanced.translate.handler)) {
+          let res = enhanced.translate.handler(newValue, ctx);
+          // 异步翻译，可解决字典查询慢的问题
+          if (isPromise(res)) {
+            res.then((v) => (innerValue.value = v));
+          } else {
+            innerValue.value = res;
+          }
         }
       }
-    }
-  }, { immediate: true })
+    },
+    { immediate: true }
+  );
 
   /** 通用处理 change 事件 */
   function handleChangeCommon($value) {
-    let getValue = enhanced.getValue($value, ctx)
-    trigger('change', { value: getValue })
+    let getValue = enhanced.getValue($value, ctx);
+    trigger('change', { value: getValue });
     // 触发valueChange事件
     parentTrigger('valueChange', {
       type: props.type,
@@ -130,12 +134,12 @@ export function useJVxeComponent(props: JVxeComponent.Props) {
       col: originColumn.value,
       rowIndex: rowIndex.value,
       columnIndex: columnIndex.value,
-    })
+    });
   }
 
   /** 通用处理 blur 事件 */
   function handleBlurCommon(value) {
-    trigger('blur', { value })
+    trigger('blur', { value });
   }
 
   /**
@@ -145,44 +149,44 @@ export function useJVxeComponent(props: JVxeComponent.Props) {
    * @param args 其他附带参数
    */
   function trigger(name, event?, args: any[] = []) {
-    let listener = listeners.value[name]
+    let listener = listeners.value[name];
     if (isFunction(listener)) {
       if (isObject(event)) {
-        event = packageEvent(name, event)
+        event = packageEvent(name, event);
       }
-      listener(event, ...args)
+      listener(event, ...args);
     }
   }
 
   function parentTrigger(name, event, args: any[] = []) {
-    args.unshift(packageEvent(name, event))
-    trigger('trigger', name, args)
+    args.unshift(packageEvent(name, event));
+    trigger('trigger', name, args);
   }
 
   function packageEvent(name, event: any = {}) {
-    event.row = row.value
-    event.column = column.value
+    event.row = row.value;
+    event.column = column.value;
     // online增强参数兼容
-    event.column['key'] = column.value['property']
+    event.column['key'] = column.value['property'];
     // event.cellTarget = this
     if (!event.type) {
-      event.type = name
+      event.type = name;
     }
     if (!event.cellType) {
-      event.cellType = props.type
+      event.cellType = props.type;
     }
     // 是否校验表单，默认为true
     if (isBoolean(event.validate)) {
-      event.validate = true
+      event.validate = true;
     }
-    return event
+    return event;
   }
 
   return {
     ...context,
     enhanced,
     trigger,
-  }
+  };
 }
 
 /**
@@ -202,10 +206,8 @@ export function useDefaultEnhanced(): JVxeComponent.EnhancedPartial {
       visible: false,
     },
     aopEvents: {
-      editActived() {
-      },
-      editClosed() {
-      },
+      editActived() {},
+      editClosed() {},
       activeMethod: () => true,
     },
     translate: {
@@ -213,14 +215,14 @@ export function useDefaultEnhanced(): JVxeComponent.EnhancedPartial {
       handler(value, ctx) {
         // 默认翻译方法
         if (ctx) {
-          return filterDictText(unref(ctx.context.column).params.options, value)
+          return filterDictText(unref(ctx.context.column).params.options, value);
         } else {
-          return value
+          return value;
         }
       },
     },
-    getValue: value => value,
-    setValue: value => value,
+    getValue: (value) => value,
+    setValue: (value) => value,
     createValue: (defaultValue) => defaultValue,
-  } as JVxeComponent.Enhanced
+  } as JVxeComponent.Enhanced;
 }
diff --git a/src/components/jeecg/JVxeTable/src/hooks/useKeyboardEdit.ts b/src/components/jeecg/JVxeTable/src/hooks/useKeyboardEdit.ts
index a63e943..a6bb9b9 100644
--- a/src/components/jeecg/JVxeTable/src/hooks/useKeyboardEdit.ts
+++ b/src/components/jeecg/JVxeTable/src/hooks/useKeyboardEdit.ts
@@ -1,9 +1,9 @@
 /*
-* JVxeTable 键盘操作 
-*/
-import type {VxeTablePropTypes} from 'vxe-table'
-import type {JVxeTableProps} from '../types'
-import {computed} from 'vue'
+ * JVxeTable 键盘操作
+ */
+import type { VxeTablePropTypes } from 'vxe-table';
+import type { JVxeTableProps } from '../types';
+import { computed } from 'vue';
 
 /**
  * JVxeTable 键盘操作
@@ -12,15 +12,15 @@ import {computed} from 'vue'
  */
 export function useKeyboardEdit(props: JVxeTableProps) {
   // 是否开启了键盘操作
-  const enabledKeyboard = computed(() => props.keyboardEdit ?? false)
+  const enabledKeyboard = computed(() => props.keyboardEdit ?? false);
   // 重写 keyboardConfig
   const keyboardConfig: VxeTablePropTypes.KeyboardConfig = {
-    editMethod({row, column, $table}) {
+    editMethod({ row, column, $table }) {
       // 重写默认的覆盖式，改为追加式
-      $table.setActiveCell(row, column)
-      return true
+      $table.setActiveCell(row, column);
+      return true;
     },
-  }
+  };
   // 键盘操作配置
   const keyboardEditConfig = computed(() => {
     return {
@@ -28,10 +28,10 @@ export function useKeyboardEdit(props: JVxeTableProps) {
         selected: enabledKeyboard.value,
       },
       keyboardConfig,
-    }
-  })
+    };
+  });
 
   return {
     keyboardEditConfig,
-  }
+  };
 }
diff --git a/src/components/jeecg/JVxeTable/src/hooks/useLinkage.ts b/src/components/jeecg/JVxeTable/src/hooks/useLinkage.ts
index fe349c6..f5916d1 100644
--- a/src/components/jeecg/JVxeTable/src/hooks/useLinkage.ts
+++ b/src/components/jeecg/JVxeTable/src/hooks/useLinkage.ts
@@ -1,46 +1,50 @@
-import { watch } from 'vue'
-import { isFunction, isPromise, isArray } from '/@/utils/is'
-import { JVxeColumn, JVxeDataProps, JVxeTableProps, JVxeLinkageConfig } from '../types'
+import { watch } from 'vue';
+import { isFunction, isPromise, isArray } from '/@/utils/is';
+import { JVxeColumn, JVxeDataProps, JVxeTableProps, JVxeLinkageConfig } from '../types';
 
 /**
  * 多级联动
  */
 export function useLinkage(props: JVxeTableProps, data: JVxeDataProps, methods) {
-
   // 整理多级联动配置
-  watch(() => props.linkageConfig, (linkageConfig: JVxeLinkageConfig[]) => {
-    data.innerLinkageConfig.clear()
-    if (isArray(linkageConfig) && linkageConfig.length > 0) {
-      linkageConfig.forEach(config => {
-        let keys = getLinkageKeys(config.key, [])
-        // 多个key共享一个，引用地址
-        let configItem = {
-          ...config, keys,
-          optionsMap: new Map(),
-        }
-        keys.forEach(k => data.innerLinkageConfig.set(k, configItem))
-      })
-    }
-  }, { immediate: true })
+  watch(
+    () => props.linkageConfig,
+    (linkageConfig: JVxeLinkageConfig[]) => {
+      data.innerLinkageConfig.clear();
+      if (isArray(linkageConfig) && linkageConfig.length > 0) {
+        linkageConfig.forEach((config) => {
+          let keys = getLinkageKeys(config.key, []);
+          // 多个key共享一个，引用地址
+          let configItem = {
+            ...config,
+            keys,
+            optionsMap: new Map(),
+          };
+          keys.forEach((k) => data.innerLinkageConfig.set(k, configItem));
+        });
+      }
+    },
+    { immediate: true }
+  );
 
   // 获取联动的key顺序
   function getLinkageKeys(key: string, keys: string[]): string[] {
-    let col = props.columns?.find((col: JVxeColumn) => col.key === key) as JVxeColumn
+    let col = props.columns?.find((col: JVxeColumn) => col.key === key) as JVxeColumn;
     if (col) {
-      keys.push(col.key)
+      keys.push(col.key);
       // 寻找下级
       if (col.linkageKey) {
-        return getLinkageKeys(col.linkageKey, keys)
+        return getLinkageKeys(col.linkageKey, keys);
       }
     }
-    return keys
+    return keys;
   }
 
   // 处理联动回显数据
   function handleLinkageBackData(row) {
     if (data.innerLinkageConfig.size > 0) {
       for (let configItem of data.innerLinkageConfig.values()) {
-        autoSetLinkageOptionsByData(row, '', configItem, 0)
+        autoSetLinkageOptionsByData(row, '', configItem, 0);
       }
     }
   }
@@ -48,72 +52,72 @@ export function useLinkage(props: JVxeTableProps, data: JVxeDataProps, methods)
   /** 【多级联动】获取同级联动下拉选项 */
   function getLinkageOptionsSibling(row, col, config, request) {
     // 如果当前列不是顶级列
-    let key = ''
+    let key = '';
     if (col.key !== config.key) {
       // 就找出联动上级列
-      let idx = config.keys.findIndex(k => col.key === k)
-      let parentKey = config.keys[idx - 1]
-      key = row[parentKey]
+      let idx = config.keys.findIndex((k) => col.key === k);
+      let parentKey = config.keys[idx - 1];
+      key = row[parentKey];
       // 如果联动上级列没有选择数据，就直接返回空数组
       if (key === '' || key == null) {
-        return []
+        return [];
       }
     } else {
-      key = 'root'
+      key = 'root';
     }
-    let options = config.optionsMap.get(key)
+    let options = config.optionsMap.get(key);
     if (!Array.isArray(options)) {
       if (request) {
-        let parent = key === 'root' ? '' : key
-        return getLinkageOptionsAsync(config, parent)
+        let parent = key === 'root' ? '' : key;
+        return getLinkageOptionsAsync(config, parent);
       } else {
-        options = []
+        options = [];
       }
     }
-    return options
+    return options;
   }
 
   /** 【多级联动】获取联动下拉选项（异步） */
   function getLinkageOptionsAsync(config, parent) {
-    return new Promise(resolve => {
-      let key = parent ? parent : 'root'
-      let options
+    return new Promise((resolve) => {
+      let key = parent ? parent : 'root';
+      let options;
       if (config.optionsMap.has(key)) {
-        options = config.optionsMap.get(key)
+        options = config.optionsMap.get(key);
         if (isPromise(options)) {
-          options.then(opt => {
-            config.optionsMap.set(key, opt)
-            resolve(opt)
-          })
+          options.then((opt) => {
+            config.optionsMap.set(key, opt);
+            resolve(opt);
+          });
         } else {
-          resolve(options)
+          resolve(options);
         }
       } else if (isFunction(config.requestData)) {
         // 调用requestData方法，通过传入parent来获取子级
         // noinspection JSVoidFunctionReturnValueUsed,TypeScriptValidateJSTypes
-        let promise = config.requestData(parent)
-        config.optionsMap.set(key, promise)
-        promise.then(opt => {
-          config.optionsMap.set(key, opt)
-          resolve(opt)
-        })
+        let promise = config.requestData(parent);
+        config.optionsMap.set(key, promise);
+        promise.then((opt) => {
+          config.optionsMap.set(key, opt);
+          resolve(opt);
+        });
       } else {
-        resolve([])
+        resolve([]);
       }
-    })
+    });
   }
 
   // 【多级联动】 用于回显数据，自动填充 optionsMap
   function autoSetLinkageOptionsByData(data, parent, config, level) {
     if (level === 0) {
-      getLinkageOptionsAsync(config, '')
+      getLinkageOptionsAsync(config, '');
     } else {
-      getLinkageOptionsAsync(config, parent)
+      getLinkageOptionsAsync(config, parent);
     }
     if (config.keys.length - 1 > level) {
-      let value = data[config.keys[level]]
+      let value = data[config.keys[level]];
       if (value) {
-        autoSetLinkageOptionsByData(data, value, config, level + 1)
+        autoSetLinkageOptionsByData(data, value, config, level + 1);
       }
     }
   }
@@ -121,14 +125,14 @@ export function useLinkage(props: JVxeTableProps, data: JVxeDataProps, methods)
   // 【多级联动】联动组件change时，清空下级组件
   function handleLinkageSelectChange(row, col, config, value) {
     if (col.linkageKey) {
-      getLinkageOptionsAsync(config, value)
-      let idx = config.keys.findIndex(k => k === col.key)
-      let values = {}
+      getLinkageOptionsAsync(config, value);
+      let idx = config.keys.findIndex((k) => k === col.key);
+      let values = {};
       for (let i = idx; i < config.keys.length; i++) {
-        values[config.keys[i]] = ''
+        values[config.keys[i]] = '';
       }
       // 清空后几列的数据
-      methods.setValues([{ rowKey: row.id, values }])
+      methods.setValues([{ rowKey: row.id, values }]);
     }
   }
 
@@ -137,5 +141,5 @@ export function useLinkage(props: JVxeTableProps, data: JVxeDataProps, methods)
     getLinkageOptionsSibling,
     handleLinkageSelectChange,
     handleLinkageBackData,
-  }
-}
\ No newline at end of file
+  };
+}
diff --git a/src/components/jeecg/JVxeTable/src/hooks/useMethods.ts b/src/components/jeecg/JVxeTable/src/hooks/useMethods.ts
index 6a7a95a..001c32a 100644
--- a/src/components/jeecg/JVxeTable/src/hooks/useMethods.ts
+++ b/src/components/jeecg/JVxeTable/src/hooks/useMethods.ts
@@ -1,23 +1,23 @@
-import XEUtils from 'xe-utils'
-import { simpleDebounce } from '/@/utils/common/compUtils'
-import { JVxeDataProps, JVxeRefs, JVxeTableProps, JVxeTypes } from '../types'
-import { getEnhanced } from '../utils/enhancedUtils'
-import { VxeTableInstance, VxeTablePrivateMethods } from 'vxe-table'
-import { cloneDeep } from 'lodash-es'
-import { isArray, isEmpty, isNull, isString } from '/@/utils/is'
-import { useLinkage } from './useLinkage'
-import { useWebSocket } from './useWebSocket'
-import { getPrefix, getJVxeAuths } from '../utils/authUtils'
+import XEUtils from 'xe-utils';
+import { simpleDebounce } from '/@/utils/common/compUtils';
+import { JVxeDataProps, JVxeRefs, JVxeTableProps, JVxeTypes } from '../types';
+import { getEnhanced } from '../utils/enhancedUtils';
+import { VxeTableInstance, VxeTablePrivateMethods } from 'vxe-table';
+import { cloneDeep } from 'lodash-es';
+import { isArray, isEmpty, isNull, isString } from '/@/utils/is';
+import { useLinkage } from './useLinkage';
+import { useWebSocket } from './useWebSocket';
+import { getPrefix, getJVxeAuths } from '../utils/authUtils';
 
 export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps, refs: JVxeRefs, instance) {
-  let xTableTemp: VxeTableInstance & VxeTablePrivateMethods
+  let xTableTemp: VxeTableInstance & VxeTablePrivateMethods;
 
   function getXTable() {
     if (!xTableTemp) {
       // !. 为 typescript 的非空断言
-      xTableTemp = refs.gridRef.value!.getRefMaps().refTable.value
+      xTableTemp = refs.gridRef.value!.getRefMaps().refTable.value;
     }
-    return xTableTemp
+    return xTableTemp;
   }
 
   // noinspection JSUnusedGlobalSymbols
@@ -47,64 +47,64 @@ export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps,
     isDisabledRow,
     recalcDisableRows,
     rowResort,
-  }
+  };
 
   // 多级联动
-  const linkageMethods = useLinkage(props, data, hookMethods)
+  const linkageMethods = useLinkage(props, data, hookMethods);
   // WebSocket 无痕刷新
-  const socketMethods = useWebSocket(props, data, hookMethods)
+  const socketMethods = useWebSocket(props, data, hookMethods);
 
   // 可显式供外部调用的方法
   const publicMethods = {
     ...hookMethods,
     ...linkageMethods,
     ...socketMethods,
-  }
+  };
 
   /** 监听vxe滚动条位置 */
   function handleVxeScroll(event) {
-    let { scroll } = data
+    let { scroll } = data;
 
     // 记录滚动条的位置
-    scroll.top = event.scrollTop
-    scroll.left = event.scrollLeft
+    scroll.top = event.scrollTop;
+    scroll.left = event.scrollLeft;
 
-    refs.subPopoverRef.value?.close()
-    data.scrolling.value = true
-    closeScrolling()
+    refs.subPopoverRef.value?.close();
+    data.scrolling.value = true;
+    closeScrolling();
   }
 
   // 当手动勾选单选时触发的事件
   function handleVxeRadioChange(event) {
-    let row = event.$table.getRadioRecord()
-    data.selectedRows.value = row ? [row] : []
-    handleSelectChange('radio', data.selectedRows.value, event)
+    let row = event.$table.getRadioRecord();
+    data.selectedRows.value = row ? [row] : [];
+    handleSelectChange('radio', data.selectedRows.value, event);
   }
 
   // 当手动勾选全选时触发的事件
   function handleVxeCheckboxAll(event) {
-    data.selectedRows.value = event.$table.getCheckboxRecords()
-    handleSelectChange('checkbox-all', data.selectedRows.value, event)
+    data.selectedRows.value = event.$table.getCheckboxRecords();
+    handleSelectChange('checkbox-all', data.selectedRows.value, event);
   }
 
   // 当手动勾选并且值发生改变时触发的事件
   function handleVxeCheckboxChange(event) {
-    data.selectedRows.value = event.$table.getCheckboxRecords()
-    handleSelectChange('checkbox', data.selectedRows.value, event)
+    data.selectedRows.value = event.$table.getCheckboxRecords();
+    handleSelectChange('checkbox', data.selectedRows.value, event);
   }
 
   // 行选择change事件
   function handleSelectChange(type, selectedRows, $event) {
-    let action
+    let action;
     if (type === 'radio') {
-      action = 'selected'
+      action = 'selected';
     } else if (type === 'checkbox') {
-      action = selectedRows.includes($event.row) ? 'selected' : 'unselected'
+      action = selectedRows.includes($event.row) ? 'selected' : 'unselected';
     } else {
-      action = 'selected-all'
+      action = 'selected-all';
     }
 
-    data.selectedRowIds.value = selectedRows.map(row => row.id)
+    data.selectedRowIds.value = selectedRows.map((row) => row.id);
     trigger('selectRowChange', {
       type: type,
       action: action,
@@ -112,45 +112,45 @@ export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps,
       row: $event.row,
       selectedRows: data.selectedRows.value,
       selectedRowIds: data.selectedRowIds.value,
-    })
+    });
   }
 
   // 点击单元格时触发的事件
   function handleCellClick(event) {
-    let { row, column, $event, $table } = event
+    let { row, column, $event, $table } = event;
 
     // 点击了可编辑的
     if (column.editRender) {
-      refs.subPopoverRef.value?.close()
-      return
+      refs.subPopoverRef.value?.close();
+      return;
     }
 
     // 显示详细信息
     if (column.params?.showDetails) {
-      refs.detailsModalRef.value?.open(event)
+      refs.detailsModalRef.value?.open(event);
     } else if (refs.subPopoverRef.value) {
-      refs.subPopoverRef.value.toggle(event)
+      refs.subPopoverRef.value.toggle(event);
     } else if (props.clickSelectRow) {
-      let className = $event.target.className || ''
-      className = isString(className) ? className : className.toString()
+      let className = $event.target.className || '';
+      className = isString(className) ? className : className.toString();
       // 点击的是expand，不做处理
       if (className.includes('vxe-table--expand-btn')) {
-        return
+        return;
       }
       // 点击的是checkbox，不做处理
       if (className.includes('vxe-checkbox--icon') || className.includes('vxe-cell--checkbox')) {
-        return
+        return;
       }
       // 点击的是radio，不做处理
       if (className.includes('vxe-radio--icon') || className.includes('vxe-cell--radio')) {
-        return
+        return;
       }
       if (props.rowSelectionType === 'radio') {
-        $table.setRadioRow(row)
-        handleVxeRadioChange(event)
+        $table.setRadioRow(row);
+        handleVxeRadioChange(event);
       } else {
-        $table.toggleCheckboxRow(row)
-        handleVxeCheckboxChange(event)
+        $table.toggleCheckboxRow(row);
+        handleVxeCheckboxChange(event);
       }
     }
   }
@@ -158,42 +158,42 @@ export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps,
   // 单元格被激活编辑时会触发该事件
   function handleEditActived({ column }) {
     // 执行增强
-    getEnhanced(column.params.type).aopEvents.editActived!.apply(instance, arguments as any)
+    getEnhanced(column.params.type).aopEvents.editActived!.apply(instance, arguments as any);
   }
 
   // 单元格编辑状态下被关闭时会触发该事件
   function handleEditClosed({ column }) {
     // 执行增强
-    getEnhanced(column.params.type).aopEvents.editClosed!.apply(instance, arguments as any)
+    getEnhanced(column.params.type).aopEvents.editClosed!.apply(instance, arguments as any);
   }
 
   // 返回值决定行是否可选中
   function handleCheckMethod({ row }) {
     if (props.disabled) {
-      return false
+      return false;
     }
-    return !data.disabledRowIds.includes(row.id)
+    return !data.disabledRowIds.includes(row.id);
   }
 
   // 返回值决定单元格是否可以编辑
   function handleActiveMethod({ row, column }) {
     let flag = (() => {
       if (props.disabled) {
-        return false
+        return false;
       }
       if (data.disabledRowIds.includes(row.id)) {
-        return false
+        return false;
       }
       if (column.params?.disabled) {
-        return false
+        return false;
       }
       // 执行增强
-      return getEnhanced(column.params.type).aopEvents.activeMethod!.apply(instance, arguments as any) ?? true
-    })()
+      return getEnhanced(column.params.type).aopEvents.activeMethod!.apply(instance, arguments as any) ?? true;
+    })();
     if (!flag) {
-      getXTable().clearActived()
+      getXTable().clearActived();
     }
-    return flag
+    return flag;
   }
 
   /**
@@ -203,157 +203,161 @@ export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps,
    */
   function isDisabledRow(row, force = true) {
     if (!force) {
-      return !data.disabledRowIds.includes(row.id)
+      return !data.disabledRowIds.includes(row.id);
     }
     if (props.disabledRows == null || isEmpty(props.disabledRows)) {
-      return false
+      return false;
     }
-    let disabled: boolean = false
-    let keys: string[] = Object.keys(props.disabledRows)
+    let disabled: boolean = false;
+    let keys: string[] = Object.keys(props.disabledRows);
     for (const key of keys) {
       // 判断是否有该属性
       if (row.hasOwnProperty(key)) {
-        let temp: any = props.disabledRows![key]
+        let temp: any = props.disabledRows![key];
         // 禁用规则可以是一个数组
         if (isArray(temp)) {
-          disabled = temp.includes(row[key])
+          disabled = temp.includes(row[key]);
         } else {
-          disabled = (temp === row[key])
+          disabled = temp === row[key];
         }
         if (disabled) {
-          break
+          break;
         }
       }
     }
-    return disabled
+    return disabled;
   }
 
   // 重新计算禁用行
   function recalcDisableRows() {
-    let xTable = getXTable()
-    data.disabledRowIds = []
-    const { tableFullData } = xTable.internalData
-    tableFullData.forEach(row => {
+    let xTable = getXTable();
+    data.disabledRowIds = [];
+    const { tableFullData } = xTable.internalData;
+    tableFullData.forEach((row) => {
       // 判断是否是禁用行
       if (isDisabledRow(row)) {
-        data.disabledRowIds.push(row.id)
+        data.disabledRowIds.push(row.id);
       }
-    })
-    xTable.updateData()
+    });
+    xTable.updateData();
   }
 
   // 返回值决定是否允许展开、收起行
   function handleExpandToggleMethod({ expanded }) {
-    return !(expanded && props.disabled)
+    return !(expanded && props.disabled);
   }
 
   // 设置 data.scrolling 防抖模式
   const closeScrolling = simpleDebounce(function () {
-    data.scrolling.value = false
-  }, 100)
+    data.scrolling.value = false;
+  }, 100);
 
   /** 表尾数据处理方法，用于显示统计信息 */
   function handleFooterMethod({ columns, data: $data }) {
-    const { statistics } = data
-    let footers: any[] = []
+    const { statistics } = data;
+    let footers: any[] = [];
     if (statistics.has) {
       if (statistics.sum.length > 0) {
-        footers.push(getFooterStatisticsMap({
-          columns: columns,
-          title: '合计',
-          checks: statistics.sum,
-          method: (column) => XEUtils.sum($data, column.property),
-        }))
+        footers.push(
+          getFooterStatisticsMap({
+            columns: columns,
+            title: '合计',
+            checks: statistics.sum,
+            method: (column) => XEUtils.sum($data, column.property),
+          })
+        );
       }
       if (statistics.average.length > 0) {
-        footers.push(getFooterStatisticsMap({
-          columns: columns,
-          title: '平均',
-          checks: statistics.average,
-          method: (column) => XEUtils.mean($data, column.property),
-        }))
+        footers.push(
+          getFooterStatisticsMap({
+            columns: columns,
+            title: '平均',
+            checks: statistics.average,
+            method: (column) => XEUtils.mean($data, column.property),
+          })
+        );
       }
     }
-    return footers
+    return footers;
   }
 
   /** 获取底部统计Map */
   function getFooterStatisticsMap({ columns, title, checks, method }) {
     return columns.map((column, columnIndex) => {
       if (columnIndex === 0) {
-        return title
+        return title;
       }
       if (checks.includes(column.property)) {
-        return method(column, columnIndex)
+        return method(column, columnIndex);
       }
-      return null
-    })
+      return null;
+    });
   }
 
   // 创建新行，自动添加默认值
   function createRow(record: Recordable = {}) {
-    let xTable = getXTable()
+    let xTable = getXTable();
     // 添加默认值
-    xTable.internalData.tableFullColumn.forEach(column => {
-      let col = column.params
+    xTable.internalData.tableFullColumn.forEach((column) => {
+      let col = column.params;
       if (col) {
         if (col.key && (record[col.key] == null || record[col.key] === '')) {
           // 设置默认值
-          let createValue = getEnhanced(col.type).createValue
-          let defaultValue = col.defaultValue ?? ''
-          let ctx = { context: { row: record, column, $table: xTable } }
-          record[col.key] = createValue(defaultValue, ctx)
+          let createValue = getEnhanced(col.type).createValue;
+          let defaultValue = col.defaultValue ?? '';
+          let ctx = { context: { row: record, column, $table: xTable } };
+          record[col.key] = createValue(defaultValue, ctx);
         }
         // 处理联动列
         if (col.type === JVxeTypes.select && data.innerLinkageConfig.size > 0) {
           // 判断当前列是否是联动列
           if (data.innerLinkageConfig.has(col.key)) {
-            let configItem = data.innerLinkageConfig.get(col.key)
-            linkageMethods.getLinkageOptionsAsync(configItem, '')
+            let configItem = data.innerLinkageConfig.get(col.key);
+            linkageMethods.getLinkageOptionsAsync(configItem, '');
           }
         }
       }
-    })
-    return record
+    });
+    return record;
   }
 
   async function addOrInsert(rows: Recordable | Recordable[] = {}, index, triggerName, options?: IAddRowsOptions) {
-    let xTable = getXTable()
-    let records
+    let xTable = getXTable();
+    let records;
     if (isArray(rows)) {
-      records = rows
+      records = rows;
     } else {
-      records = [rows]
+      records = [rows];
     }
     // 遍历添加默认值
-    records.forEach(record => createRow(record))
-    let setActive = (options?.setActive ?? (props.addSetActive ?? true))
-    let result = await pushRows(records, { index: index, setActive })
+    records.forEach((record) => createRow(record));
+    let setActive = options?.setActive ?? props.addSetActive ?? true;
+    let result = await pushRows(records, { index: index, setActive });
     // 遍历插入的行
     // online js增强时以传过来值为准，不再赋默认值
     if (!(options?.isOnlineJS ?? false)) {
       if (triggerName != null) {
         for (let i = 0; i < result.rows.length; i++) {
-          let row = result.rows[i]
+          let row = result.rows[i];
           trigger(triggerName, {
             row: row,
             rows: result.rows,
             insertIndex: index,
             $table: xTable,
             target: instance,
-          })
+          });
         }
       }
     }
-    return result
+    return result;
   }
 
   // 新增、插入一行时的可选参数
   interface IAddRowsOptions {
     // 是否是 onlineJS增强 触发的
-    isOnlineJS?: boolean,
+    isOnlineJS?: boolean;
     // 是否激活编辑状态
-    setActive?: boolean,
+    setActive?: boolean;
   }
 
   /**
@@ -364,7 +368,7 @@ export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps,
    * @return
    */
   async function addRows(rows: Recordable | Recordable[] = {}, options?: IAddRowsOptions) {
-    return addOrInsert(rows, -1, 'added', options)
+    return addOrInsert(rows, -1, 'added', options);
   }
 
   /**
@@ -374,17 +378,17 @@ export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps,
    * @param options.setActive 是否激活最后一行的编辑模式
    */
   async function pushRows(rows: Recordable | Recordable[] = {}, options = { setActive: false, index: -1 }) {
-    let xTable = getXTable()
-    let { setActive, index } = options
-    index = index === -1 ? index : xTable.internalData.tableFullData[index]
+    let xTable = getXTable();
+    let { setActive, index } = options;
+    index = index === -1 ? index : xTable.internalData.tableFullData[index];
     // 插入行
-    let result = await xTable.insertAt(rows, index)
+    let result = await xTable.insertAt(rows, index);
     if (setActive) {
       // 激活最后一行的编辑模式
-      xTable.setActiveRow(result.rows[result.rows.length - 1])
+      xTable.setActiveRow(result.rows[result.rows.length - 1]);
     }
-    await recalcSortNumber()
-    return result
+    await recalcSortNumber();
+    return result;
   }
 
   /**
@@ -397,75 +401,76 @@ export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps,
    */
   function insertRows(rows: Recordable | Recordable[] = {}, index: number, options?: IAddRowsOptions) {
     if (index < 0) {
-      console.warn(`【JVxeTable】insertRows：index必须传递数字，且大于-1`)
-      return
+      console.warn(`【JVxeTable】insertRows：index必须传递数字，且大于-1`);
+      return;
     }
-    return addOrInsert(rows, index, 'inserted', options)
+    return addOrInsert(rows, index, 'inserted', options);
   }
 
   /** 获取表格表单里的值 */
   function getValues(callback, rowIds) {
-    let tableData = getTableData({ rowIds: rowIds })
-    callback('', tableData)
+    let tableData = getTableData({ rowIds: rowIds });
+    callback('', tableData);
   }
 
   /** 获取表格数据 */
   function getTableData(options: any = {}) {
-    let { rowIds } = options
-    let tableData
+    let { rowIds } = options;
+    let tableData;
     // 仅查询指定id的行
     if (isArray(rowIds) && rowIds.length > 0) {
-      tableData = []
-      rowIds.forEach(rowId => {
-        let { row } = getIfRowById(rowId)
+      tableData = [];
+      rowIds.forEach((rowId) => {
+        let { row } = getIfRowById(rowId);
         if (row) {
-          tableData.push(row)
+          tableData.push(row);
         }
-      })
+      });
     } else {
       // 查询所有行
-      tableData = getXTable().getTableData().fullData
+      tableData = getXTable().getTableData().fullData;
     }
-    return filterNewRows(tableData, false)
+    return filterNewRows(tableData, false);
   }
 
   /** 仅获取新增的数据 */
   function getNewData() {
-    let newData = getNewDataWithId()
-    newData.forEach(row => delete row.id)
-    return newData
+    let newData = getNewDataWithId();
+    newData.forEach((row) => delete row.id);
+    return newData;
   }
 
   /** 仅获取新增的数据,带有id */
   function getNewDataWithId() {
-    let xTable = getXTable()
-    return cloneDeep(xTable.getInsertRecords())
+    let xTable = getXTable();
+    return cloneDeep(xTable.getInsertRecords());
   }
 
   /** 根据ID获取行，新增的行也能查出来 */
   function getIfRowById(id) {
-    let xTable = getXTable()
-    let row = xTable.getRowById(id), isNew = false
+    let xTable = getXTable();
+    let row = xTable.getRowById(id),
+      isNew = false;
     if (!row) {
-      row = getNewRowById(id)
+      row = getNewRowById(id);
       if (!row) {
-        console.warn(`JVxeTable.getIfRowById：没有找到id为"${id}"的行`)
-        return { row: null }
+        console.warn(`JVxeTable.getIfRowById：没有找到id为"${id}"的行`);
+        return { row: null };
       }
-      isNew = true
+      isNew = true;
     }
-    return { row, isNew }
+    return { row, isNew };
   }
 
   /** 通过临时ID获取新增的行 */
   function getNewRowById(id) {
-    let records = getXTable().getInsertRecords()
+    let records = getXTable().getInsertRecords();
     for (let record of records) {
       if (record.id === id) {
-        return record
+        return record;
       }
     }
-    return null
+    return null;
   }
 
   /**
@@ -475,20 +480,20 @@ export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps,
    * @param handler function
    */
   function filterNewRows(rows, remove = true, handler?: Fn) {
-    let insertRecords = getXTable().getInsertRecords()
-    let records: Recordable[] = []
+    let insertRecords = getXTable().getInsertRecords();
+    let records: Recordable[] = [];
     for (let row of rows) {
-      let item = cloneDeep(row)
+      let item = cloneDeep(row);
       if (insertRecords.includes(row)) {
-        handler ? handler({ item, row, insertRecords }) : null
+        handler ? handler({ item, row, insertRecords }) : null;
         if (remove) {
-          continue
+          continue;
         }
-        delete item.id
+        delete item.id;
       }
-      records.push(item)
+      records.push(item);
     }
-    return records
+    return records;
   }
 
   /**
@@ -496,25 +501,25 @@ export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps,
    * @param top 新top位置，留空则滚动到上次记录的位置，用于解决切换tab选项卡时导致白屏以及自动将滚动条滚动到顶部的问题
    */
   function resetScrollTop(top?) {
-    let xTable = getXTable()
-    xTable.scrollTo(null, (top == null || top === '') ? data.scroll.top : top)
+    let xTable = getXTable();
+    xTable.scrollTo(null, top == null || top === '' ? data.scroll.top : top);
   }
 
   /** 校验table，失败返回errMap，成功返回null */
   async function validateTable(rows?) {
-    let xTable = getXTable()
-    const errMap = await xTable.validate(rows ?? true).catch(errMap => errMap)
-    return errMap ? errMap : null
+    let xTable = getXTable();
+    const errMap = await xTable.validate(rows ?? true).catch((errMap) => errMap);
+    return errMap ? errMap : null;
   }
 
   /** 完整校验 */
   async function fullValidateTable(rows?) {
-    let xTable = getXTable()
-    const errMap = await xTable.fullValidate(rows ?? true).catch(errMap => errMap)
-    return errMap ? errMap : null
+    let xTable = getXTable();
+    const errMap = await xTable.fullValidate(rows ?? true).catch((errMap) => errMap);
+    return errMap ? errMap : null;
   }
 
-  type setValuesParam = { rowKey: string, values: Recordable }
+  type setValuesParam = { rowKey: string; values: Recordable };
 
   /**
    * 设置某行某列的值
@@ -524,24 +529,24 @@ export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps,
    */
   function setValues(values: setValuesParam[]): number {
     if (!isArray(values)) {
-      console.warn(`[JVxeTable] setValues 必须传递数组`)
-      return 0
+      console.warn(`[JVxeTable] setValues 必须传递数组`);
+      return 0;
     }
-    let xTable = getXTable()
-    let count = 0
+    let xTable = getXTable();
+    let count = 0;
     values.forEach((item) => {
-      let { rowKey, values: record } = item
-      let { row } = getIfRowById(rowKey)
+      let { rowKey, values: record } = item;
+      let { row } = getIfRowById(rowKey);
       if (!row) {
-        return
+        return;
       }
-      Object.keys(record).forEach(colKey => {
-        let column = xTable.getColumnByField(colKey)
+      Object.keys(record).forEach((colKey) => {
+        let column = xTable.getColumnByField(colKey);
         if (column) {
-          let oldValue = row[colKey]
-          let newValue = record[colKey]
+          let oldValue = row[colKey];
+          let newValue = record[colKey];
           if (newValue !== oldValue) {
-            row[colKey] = newValue
+            row[colKey] = newValue;
             // 触发 valueChange 事件
             trigger('valueChange', {
               type: column.params.type,
@@ -550,30 +555,30 @@ export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps,
               col: column.params,
               column: column,
               isSetValues: true,
-            })
-            count++
+            });
+            count++;
           }
         } else {
-          console.warn(`[JVxeTable] setValues 没有找到key为"${colKey}"的列`)
+          console.warn(`[JVxeTable] setValues 没有找到key为"${colKey}"的列`);
         }
-      })
-    })
+      });
+    });
     if (count > 0) {
-      xTable.updateData()
+      xTable.updateData();
     }
-    return count
+    return count;
   }
 
   /** 清空选择行 */
   async function clearSelection() {
-    const xTable = getXTable()
-    let event = { $table: xTable, target: instance }
+    const xTable = getXTable();
+    let event = { $table: xTable, target: instance };
     if (props.rowSelectionType === JVxeTypes.rowRadio) {
-      await xTable.clearRadioRow()
-      handleVxeRadioChange(event)
+      await xTable.clearRadioRow();
+      handleVxeRadioChange(event);
     } else {
-      await xTable.clearCheckboxRow()
-      handleVxeCheckboxChange(event)
+      await xTable.clearCheckboxRow();
+      handleVxeCheckboxChange(event);
     }
   }
 
@@ -582,82 +587,84 @@ export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps,
    * @param isFull 如果 isFull=true 则获取全表已选中的数据
    */
   function getSelectionData(isFull?: boolean) {
-    const xTable = getXTable()
+    const xTable = getXTable();
     if (props.rowSelectionType === JVxeTypes.rowRadio) {
-      let row = xTable.getRadioRecord(isFull)
+      let row = xTable.getRadioRecord(isFull);
       if (isNull(row)) {
-        return []
+        return [];
       }
-      return filterNewRows([row], false)
+      return filterNewRows([row], false);
     } else {
-      return filterNewRows(xTable.getCheckboxRecords(isFull), false)
+      return filterNewRows(xTable.getCheckboxRecords(isFull), false);
     }
   }
 
   /** 仅获取被删除的数据（新增又被删除的数据不会被获取到） */
   function getDeleteData() {
-    return filterNewRows(getXTable().getRemoveRecords(), false)
+    return filterNewRows(getXTable().getRemoveRecords(), false);
   }
 
   /** 删除一行或多行数据 */
   async function removeRows(rows) {
-    const xTable = getXTable()
-    const res = await xTable.remove(rows)
-    let removeEvent: any = { deleteRows: rows, $table: xTable }
-    trigger('removed', removeEvent)
-    await recalcSortNumber()
-    return res
+    const xTable = getXTable();
+    const res = await xTable.remove(rows);
+    let removeEvent: any = { deleteRows: rows, $table: xTable };
+    trigger('removed', removeEvent);
+    await recalcSortNumber();
+    return res;
   }
 
   /** 根据id删除一行或多行 */
   function removeRowsById(rowId) {
-    let rowIds
+    let rowIds;
     if (isArray(rowId)) {
-      rowIds = rowId
+      rowIds = rowId;
     } else {
-      rowIds = [rowId]
+      rowIds = [rowId];
     }
-    let rows = rowIds.map((id) => {
-      let { row } = getIfRowById(id)
-      if (!row) {
-        return
-      }
-      if (row) {
-        return row
-      } else {
-        console.warn(`【JVxeTable】removeRowsById：${id}不存在`)
-        return null
-      }
-    }).filter((row) => row != null)
-    return removeRows(rows)
+    let rows = rowIds
+      .map((id) => {
+        let { row } = getIfRowById(id);
+        if (!row) {
+          return;
+        }
+        if (row) {
+          return row;
+        } else {
+          console.warn(`【JVxeTable】removeRowsById：${id}不存在`);
+          return null;
+        }
+      })
+      .filter((row) => row != null);
+    return removeRows(rows);
   }
 
   // 删除选中的数据
   async function removeSelection() {
-    let xTable = getXTable()
-    let res
+    let xTable = getXTable();
+    let res;
     if (props.rowSelectionType === JVxeTypes.rowRadio) {
-      res = await xTable.removeRadioRow()
+      res = await xTable.removeRadioRow();
     } else {
-      res = await xTable.removeCheckboxRow()
+      res = await xTable.removeCheckboxRow();
     }
-    await clearSelection()
-    await recalcSortNumber()
-    return res
+    await clearSelection();
+    await recalcSortNumber();
+    return res;
   }
 
   /** 重新计算排序字段的数值 */
   async function recalcSortNumber(force = false) {
     if (props.dragSort || force) {
-      let xTable = getXTable()
-      let sortKey = props.sortKey ?? 'orderNum'
-      let sortBegin = props.sortBegin ?? 0
-      xTable.internalData.tableFullData.forEach((data) => data[sortKey] = sortBegin++)
+      let xTable = getXTable();
+      let sortKey = props.sortKey ?? 'orderNum';
+      let sortBegin = props.sortBegin ?? 0;
+      xTable.internalData.tableFullData.forEach((data) => (data[sortKey] = sortBegin++));
       // 4.1.0
-      await xTable.updateCache()
+      await xTable.updateCache();
       // 4.1.1
       // await xTable.cacheRowMap()
-      return await xTable.updateData()
+      return await xTable.updateData();
     }
   }
 
@@ -669,33 +676,33 @@ export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps,
    */
   async function doSort(oldIndex: number, newIndex: number, force = false) {
     if (props.dragSort || force) {
-      let xTable = getXTable()
+      let xTable = getXTable();
       let sort = (array) => {
         // 存储old数据，并删除该项
-        let row = array.splice(oldIndex, 1)[0]
+        let row = array.splice(oldIndex, 1)[0];
         // 向newIndex处添加old数据
-        array.splice(newIndex, 0, row)
-      }
-      sort(xTable.internalData.tableFullData)
+        array.splice(newIndex, 0, row);
+      };
+      sort(xTable.internalData.tableFullData);
       if (xTable.keepSource) {
-        sort(xTable.internalData.tableSourceData)
+        sort(xTable.internalData.tableSourceData);
       }
-      return await recalcSortNumber(force)
+      return await recalcSortNumber(force);
     }
   }
 
   /** 行重新排序 */
   function rowResort(oldIndex: number, newIndex: number) {
-    return doSort(oldIndex, newIndex, true)
+    return doSort(oldIndex, newIndex, true);
   }
 
   // ---------------- begin 权限控制 ----------------
   // 加载权限
   function loadAuthsMap() {
     if (!props.authPre || props.authPre.length == 0) {
-      data.authsMap.value = null
+      data.authsMap.value = null;
     } else {
-      data.authsMap.value = getJVxeAuths(props.authPre)
+      data.authsMap.value = getJVxeAuths(props.authPre);
     }
   }
 
@@ -705,20 +712,20 @@ export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps,
    */
   function getAuth(authCode) {
     if (data.authsMap.value != null && props.authPre) {
-      let prefix = getPrefix(props.authPre)
-      return data.authsMap.value.get(prefix + authCode)
+      let prefix = getPrefix(props.authPre);
+      return data.authsMap.value.get(prefix + authCode);
     }
-    return null
+    return null;
   }
 
   // 获取列权限
   function getColAuth(key: string) {
-    return getAuth(key)
+    return getAuth(key);
   }
 
   // 判断按钮权限
   function hasBtnAuth(key: string) {
-    return getAuth('btn:' + key)?.isAuth ?? true
+    return getAuth('btn:' + key)?.isAuth ?? true;
   }
 
   // ---------------- end 权限控制 ----------------
@@ -726,16 +733,16 @@ export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps,
   /* --- 辅助方法 ---*/
 
   function created() {
-    loadAuthsMap()
+    loadAuthsMap();
   }
 
   // 触发事件
   function trigger(name, event: any = {}) {
-    event.$target = instance
-    event.$table = getXTable()
+    event.$target = instance;
+    event.$table = getXTable();
     //online增强参数兼容
-    event.target = instance
-    emit(name, event)
+    event.target = instance;
+    emit(name, event);
   }
 
   return {
@@ -756,9 +763,10 @@ export function useMethods(props: JVxeTableProps, { emit }, data: JVxeDataProps,
       handleCheckMethod,
       handleActiveMethod,
       handleExpandToggleMethod,
-      getColAuth, hasBtnAuth,
+      getColAuth,
+      hasBtnAuth,
     },
     publicMethods,
     created,
-  }
+  };
 }
diff --git a/src/components/jeecg/JVxeTable/src/hooks/usePagination.ts b/src/components/jeecg/JVxeTable/src/hooks/usePagination.ts
index e26dd26..5bd6546 100644
--- a/src/components/jeecg/JVxeTable/src/hooks/usePagination.ts
+++ b/src/components/jeecg/JVxeTable/src/hooks/usePagination.ts
@@ -1,63 +1,66 @@
-import { computed, reactive, h } from 'vue'
-import { JVxeTableMethods, JVxeTableProps } from '/@/components/jeecg/JVxeTable/src/types'
-import { isEmpty } from '/@/utils/is'
-import { Pagination } from 'ant-design-vue'
+import { computed, reactive, h } from 'vue';
+import { JVxeTableMethods, JVxeTableProps } from '/@/components/jeecg/JVxeTable/src/types';
+import { isEmpty } from '/@/utils/is';
+import { Pagination } from 'ant-design-vue';
 
 export function usePagination(props: JVxeTableProps, methods: JVxeTableMethods) {
-
   const innerPagination = reactive({
     current: 1,
     pageSize: 10,
     pageSizeOptions: ['10', '20', '30'],
     showTotal: (total, range) => {
-      return range[0] + '-' + range[1] + ' 共 ' + total + ' 条'
+      return range[0] + '-' + range[1] + ' 共 ' + total + ' 条';
     },
     showQuickJumper: true,
     showSizeChanger: true,
     total: 100,
-  })
+  });
 
   const bindProps = computed(() => {
     return {
       ...innerPagination,
       ...props.pagination,
       size: props.size === 'tiny' ? 'small' : '',
-    }
-  })
+    };
+  });
 
   const boxClass = computed(() => {
     return {
       'j-vxe-pagination': true,
       'show-quick-jumper': !!bindProps.value.showQuickJumper,
-    }
-  })
+    };
+  });
 
   function handleChange(current, pageSize) {
-    innerPagination.current = current
-    methods.trigger('pageChange', { current, pageSize })
+    innerPagination.current = current;
+    methods.trigger('pageChange', { current, pageSize });
   }
 
   function handleShowSizeChange(current, pageSize) {
-    innerPagination.pageSize = pageSize
-    methods.trigger('pageChange', { current, pageSize })
+    innerPagination.pageSize = pageSize;
+    methods.trigger('pageChange', { current, pageSize });
   }
 
   /** 渲染分页器 */
   function renderPagination() {
     if (props.pagination && !isEmpty(props.pagination)) {
-      return h('div', {
-        class: boxClass.value,
-      }, [
-        h(Pagination, {
-          ...bindProps.value,
-          disabled: props.disabled,
-          onChange: handleChange,
-          onShowSizeChange: handleShowSizeChange,
-        }),
-      ])
+      return h(
+        'div',
+        {
+          class: boxClass.value,
+        },
+        [
+          h(Pagination, {
+            ...bindProps.value,
+            disabled: props.disabled,
+            onChange: handleChange,
+            onShowSizeChange: handleShowSizeChange,
+          }),
+        ]
+      );
     }
-    return null
+    return null;
   }
 
-  return { renderPagination }
-}
\ No newline at end of file
+  return { renderPagination };
+}
diff --git a/src/components/jeecg/JVxeTable/src/hooks/useRenderComponents.ts b/src/components/jeecg/JVxeTable/src/hooks/useRenderComponents.ts
index d04de54..e8ad036 100644
--- a/src/components/jeecg/JVxeTable/src/hooks/useRenderComponents.ts
+++ b/src/components/jeecg/JVxeTable/src/hooks/useRenderComponents.ts
@@ -1,46 +1,53 @@
-import { h } from 'vue'
-import { JVxeDataProps, JVxeTableMethods, JVxeTableProps } from '../types'
-import JVxeSubPopover from '../components/JVxeSubPopover.vue'
-import JVxeDetailsModal from '../components/JVxeDetailsModal.vue'
-import { useToolbar } from '/@/components/jeecg/JVxeTable/src/hooks/useToolbar'
-import { usePagination } from '/@/components/jeecg/JVxeTable/src/hooks/usePagination'
+import { h } from 'vue';
+import { JVxeDataProps, JVxeTableMethods, JVxeTableProps } from '../types';
+import JVxeSubPopover from '../components/JVxeSubPopover.vue';
+import JVxeDetailsModal from '../components/JVxeDetailsModal.vue';
+import { useToolbar } from '/@/components/jeecg/JVxeTable/src/hooks/useToolbar';
+import { usePagination } from '/@/components/jeecg/JVxeTable/src/hooks/usePagination';
 
 export function useRenderComponents(props: JVxeTableProps, data: JVxeDataProps, methods: JVxeTableMethods, slots) {
-
   // 渲染 toolbar
-  const { renderToolbar } = useToolbar(props, data, methods, slots)
+  const { renderToolbar } = useToolbar(props, data, methods, slots);
   // 渲染分页器
-  const { renderPagination } = usePagination(props, methods)
+  const { renderPagination } = usePagination(props, methods);
 
   // 渲染 toolbarAfter 插槽
   function renderToolbarAfterSlot() {
     if (slots['toolbarAfter']) {
-      return slots['toolbarAfter']()
+      return slots['toolbarAfter']();
     }
-    return null
+    return null;
   }
 
   // 渲染点击时弹出的子表
   function renderSubPopover() {
     if (props.clickRowShowSubForm && slots.subForm) {
-      return h(JVxeSubPopover, {
-        ref: 'subPopoverRef',
-      }, {
-        subForm: slots.subForm,
-      })
+      return h(
+        JVxeSubPopover,
+        {
+          ref: 'subPopoverRef',
+        },
+        {
+          subForm: slots.subForm,
+        }
+      );
     }
-    return null
+    return null;
   }
 
   // 渲染点击时弹出的详细信息
   function renderDetailsModal() {
     if (props.clickRowShowMainForm && slots.mainForm) {
-      return h(JVxeDetailsModal, {
-        ref: 'detailsModalRef',
-        trigger: methods.trigger,
-      }, {
-        mainForm: slots.mainForm,
-      })
+      return h(
+        JVxeDetailsModal,
+        {
+          ref: 'detailsModalRef',
+          trigger: methods.trigger,
+        },
+        {
+          mainForm: slots.mainForm,
+        }
+      );
     }
   }
 
@@ -50,5 +57,5 @@ export function useRenderComponents(props: JVxeTableProps, data: JVxeDataProps,
     renderSubPopover,
     renderDetailsModal,
     renderToolbarAfterSlot,
-  }
-}
\ No newline at end of file
+  };
+}
diff --git a/src/components/jeecg/JVxeTable/src/hooks/useToolbar.ts b/src/components/jeecg/JVxeTable/src/hooks/useToolbar.ts
index b91d3c7..2a716ca 100644
--- a/src/components/jeecg/JVxeTable/src/hooks/useToolbar.ts
+++ b/src/components/jeecg/JVxeTable/src/hooks/useToolbar.ts
@@ -1,51 +1,53 @@
-import { h } from 'vue'
-import JVxeToolbar from '../components/JVxeToolbar.vue'
-import { JVxeDataProps, JVxeTableMethods, JVxeTableProps } from '../types'
+import { h } from 'vue';
+import JVxeToolbar from '../components/JVxeToolbar.vue';
+import { JVxeDataProps, JVxeTableMethods, JVxeTableProps } from '../types';
 
 export function useToolbar(props: JVxeTableProps, data: JVxeDataProps, methods: JVxeTableMethods, $slots) {
-
   /** 渲染工具栏 */
   function renderToolbar() {
     if (props.toolbar) {
-      return h(JVxeToolbar, {
-        size: props.size,
-        disabled: props.disabled,
-        toolbarConfig: props.toolbarConfig,
-        disabledRows: props.disabledRows,
-        hasBtnAuth: methods.hasBtnAuth,
-        selectedRowIds: data.selectedRowIds.value,
-        // 新增事件
-        onAdd: () => methods.addRows(),
-        // 保存事件
-        onSave: () => methods.trigger('save'),
-        onRemove() {
-          let $table = methods.getXTable()
-          let deleteRows = methods.filterNewRows(data.selectedRows.value)
-          // 触发删除事件
-          if (deleteRows.length > 0) {
-            let removeEvent: any = { deleteRows, $table, target: this }
-            if (props.asyncRemove) {
-              // 确认删除，只有调用这个方法才会真删除
-              removeEvent.confirmRemove = () => methods.removeSelection()
+      return h(
+        JVxeToolbar,
+        {
+          size: props.size,
+          disabled: props.disabled,
+          toolbarConfig: props.toolbarConfig,
+          disabledRows: props.disabledRows,
+          hasBtnAuth: methods.hasBtnAuth,
+          selectedRowIds: data.selectedRowIds.value,
+          // 新增事件
+          onAdd: () => methods.addRows(),
+          // 保存事件
+          onSave: () => methods.trigger('save'),
+          onRemove() {
+            let $table = methods.getXTable();
+            let deleteRows = methods.filterNewRows(data.selectedRows.value);
+            // 触发删除事件
+            if (deleteRows.length > 0) {
+              let removeEvent: any = { deleteRows, $table, target: this };
+              if (props.asyncRemove) {
+                // 确认删除，只有调用这个方法才会真删除
+                removeEvent.confirmRemove = () => methods.removeSelection();
+              } else {
+                methods.removeSelection();
+              }
+              methods.trigger('removed', removeEvent);
             } else {
-              methods.removeSelection()
+              methods.removeSelection();
             }
-            methods.trigger('removed', removeEvent)
-          } else {
-            methods.removeSelection()
-          }
+          },
+          // 清除选择事件
+          onClearSelection: () => methods.clearSelection(),
+          onRegister: ({ xToolbarRef }) => methods.getXTable().connect(xToolbarRef.value),
         },
-        // 清除选择事件
-        onClearSelection: () => methods.clearSelection(),
-        onRegister: ({ xToolbarRef }) => methods.getXTable().connect(xToolbarRef.value),
-      }, {
-        toolbarPrefix: $slots.toolbarPrefix,
-        toolbarSuffix: $slots.toolbarSuffix,
-      })
+        {
+          toolbarPrefix: $slots.toolbarPrefix,
+          toolbarSuffix: $slots.toolbarSuffix,
+        }
+      );
     }
-    return null
+    return null;
   }
 
-  return { renderToolbar }
+  return { renderToolbar };
 }
-
diff --git a/src/components/jeecg/JVxeTable/src/hooks/useValidateRules.ts b/src/components/jeecg/JVxeTable/src/hooks/useValidateRules.ts
index 2bf6e0d..53ffc3d 100644
--- a/src/components/jeecg/JVxeTable/src/hooks/useValidateRules.ts
+++ b/src/components/jeecg/JVxeTable/src/hooks/useValidateRules.ts
@@ -1,79 +1,79 @@
-import { VxeTablePropTypes } from 'vxe-table'
-import { isArray } from '/@/utils/is'
-import { HandleArgs } from './useColumns'
-import { replaceProps } from '../utils/enhancedUtils'
+import { VxeTablePropTypes } from 'vxe-table';
+import { isArray } from '/@/utils/is';
+import { HandleArgs } from './useColumns';
+import { replaceProps } from '../utils/enhancedUtils';
 
 export function useValidateRules(args: HandleArgs) {
-  const { data } = args
-  const col = args.col!
-  let rules: VxeTablePropTypes.EditRules[] = []
+  const { data } = args;
+  const col = args.col!;
+  let rules: VxeTablePropTypes.EditRules[] = [];
   if (isArray(col.validateRules)) {
     for (let rule of col.validateRules) {
       let replace = {
         message: replaceProps(col, rule.message),
-      }
+      };
       if (rule.unique || rule.pattern === 'only') {
         // 唯一校验器
-        rule.validator = uniqueValidator(args)
+        rule.validator = uniqueValidator(args);
       } else if (rule.pattern) {
         // 非空
         if (rule.pattern === fooPatterns[0].value) {
-          rule.required = true
-          delete rule.pattern
+          rule.required = true;
+          delete rule.pattern;
         } else {
           // 兼容Online表单的特殊规则
           for (let foo of fooPatterns) {
             if (foo.value === rule.pattern) {
-              rule.pattern = foo.pattern
-              break
+              rule.pattern = foo.pattern;
+              break;
             }
           }
         }
       } else if (typeof rule.handler === 'function') {
         // 自定义函数校验
-        rule.validator = handlerConvertToValidator
+        rule.validator = handlerConvertToValidator;
       }
-      rules.push(Object.assign({}, rule, replace))
+      rules.push(Object.assign({}, rule, replace));
     }
   }
-  data.innerEditRules[col.key] = rules
+  data.innerEditRules[col.key] = rules;
 }
 
 /** 唯一校验器 */
 function uniqueValidator({ methods }: HandleArgs) {
   return function (event) {
-    const { cellValue, column, rule } = event
-    let tableData = methods.getTableData()
-    let findCount = 0
+    const { cellValue, column, rule } = event;
+    let tableData = methods.getTableData();
+    let findCount = 0;
     for (let rowData of tableData) {
       if (rowData[column.params.key] === cellValue) {
         if (++findCount >= 2) {
-          return Promise.reject(new Error(rule.message))
+          return Promise.reject(new Error(rule.message));
         }
       }
     }
-    return Promise.resolve()
-  }
+    return Promise.resolve();
+  };
 }
 
 /** 旧版handler转为新版Validator */
 function handlerConvertToValidator(event) {
-  const { column, rule } = event
+  const { column, rule } = event;
   return new Promise((resolve, reject) => {
     rule.handler(event, (flag, msg) => {
-      let message = rule.message
+      let message = rule.message;
       if (typeof msg === 'string') {
-        message = replaceProps(column.params, msg)
+        message = replaceProps(column.params, msg);
       }
       if (flag == null) {
-        resolve(message)
+        resolve(message);
       } else if (!!flag) {
-        resolve(message)
+        resolve(message);
       } else {
-        reject(new Error(message))
+        reject(new Error(message));
       }
-    })
-  })
+    });
+  });
 }
 
 // 兼容 online 的规则
@@ -90,4 +90,4 @@ const fooPatterns = [
   { title: '数字', value: 'n', pattern: /^-?\d+(\.?\d+|\d?)$/ },
   { title: '整数', value: 'z', pattern: /^-?\d+$/ },
   { title: '金额', value: 'money', pattern: /^(([1-9][0-9]*)|([0]\.\d{0,2}|[1-9][0-9]*\.\d{0,2}))$/ },
-]
+];
diff --git a/src/components/jeecg/JVxeTable/src/hooks/useWebSocket.ts b/src/components/jeecg/JVxeTable/src/hooks/useWebSocket.ts
index 29020d0..9605a90 100644
--- a/src/components/jeecg/JVxeTable/src/hooks/useWebSocket.ts
+++ b/src/components/jeecg/JVxeTable/src/hooks/useWebSocket.ts
@@ -1,9 +1,9 @@
-import { watch, onUnmounted } from 'vue'
-import { buildUUID } from '/@/utils/uuid'
-import { useGlobSetting } from '/@/hooks/setting'
-import { useUserStore } from '/@/store/modules/user'
-import { JVxeDataProps, JVxeTableMethods, JVxeTableProps } from '../types'
-import { isArray } from '/@/utils/is'
+import { watch, onUnmounted } from 'vue';
+import { buildUUID } from '/@/utils/uuid';
+import { useGlobSetting } from '/@/hooks/setting';
+import { useUserStore } from '/@/store/modules/user';
+import { JVxeDataProps, JVxeTableMethods, JVxeTableProps } from '../types';
+import { isArray } from '/@/utils/is';
 import { getToken } from '/@/utils/auth';
 
 // vxe socket
@@ -31,54 +31,56 @@ const vs = {
     timeout: 6000,
     timeoutTimer: -1,
     clear() {
-      clearTimeout(this.timeoutTimer)
-      return this
+      clearTimeout(this.timeoutTimer);
+      return this;
     },
     start() {
-      vs.sendMessage(vs.constants.TYPE_HB, '')
+      vs.sendMessage(vs.constants.TYPE_HB, '');
       // 如果超过一定时间还没重置，说明后端主动断开了
       this.timeoutTimer = window.setTimeout(() => {
-        vs.reconnect()
-      }, this.timeout)
-      return this
+        vs.reconnect();
+      }, this.timeout);
+      return this;
     },
     // 心跳消息返回
     back() {
-      this.clear()
-      window.setTimeout(() => this.start(), this.interval)
+      this.clear();
+      window.setTimeout(() => this.start(), this.interval);
     },
   },
 
   /** 初始化 WebSocket */
   initialWebSocket() {
     if (this.ws === null) {
-      const userId = useUserStore().getUserInfo?.id
-      const domainURL = useGlobSetting().uploadUrl!
-      const domain = domainURL.replace('https://', 'wss://').replace('http://', 'ws://')
-      const url = `${domain}/vxeSocket/${userId}/${this.pageId}`
+      const userId = useUserStore().getUserInfo?.id;
+      const domainURL = useGlobSetting().uploadUrl!;
+      const domain = domainURL.replace('https://', 'wss://').replace('http://', 'ws://');
+      const url = `${domain}/vxeSocket/${userId}/${this.pageId}`;
       //update-begin-author:taoyan date:2022-4-24 for: v2.4.6 的 websocket 服务端，存在性能和安全问题。 #3278
-      let token = (getToken() || '') as string
-      this.ws = new WebSocket(url)
+      let token = (getToken() || '') as string;
+      this.ws = new WebSocket(url);
       //update-end-author:taoyan date:2022-4-24 for: v2.4.6 的 websocket 服务端，存在性能和安全问题。 #3278
-      this.ws.onopen = this.on.open.bind(this)
-      this.ws.onerror = this.on.error.bind(this)
-      this.ws.onmessage = this.on.message.bind(this)
-      this.ws.onclose = this.on.close.bind(this)
+      this.ws.onopen = this.on.open.bind(this);
+      this.ws.onerror = this.on.error.bind(this);
+      this.ws.onmessage = this.on.message.bind(this);
+      this.ws.onclose = this.on.close.bind(this);
     }
   },
 
   // 发送消息
   sendMessage(type, message) {
     try {
-      let ws = this.ws
+      let ws = this.ws;
       if (ws != null && ws.readyState === ws.OPEN) {
-        ws.send(JSON.stringify({
-          type: type,
-          data: message,
-        }))
+        ws.send(
+          JSON.stringify({
+            type: type,
+            data: message,
+          })
+        );
       }
     } catch (err: any) {
-      console.warn('【JVxeWebSocket】发送消息失败：(' + err.code + ')')
+      console.warn('【JVxeWebSocket】发送消息失败：(' + err.code + ')');
     }
   },
 
@@ -86,92 +88,92 @@ const vs = {
   tableMap: new Map(),
   /** 添加绑定 */
   addBind(map, key, value: VmArgs) {
-    let binds = map.get(key)
+    let binds = map.get(key);
     if (isArray(binds)) {
-      binds.push(value)
+      binds.push(value);
     } else {
-      map.set(key, [value])
+      map.set(key, [value]);
     }
   },
   /** 移除绑定 */
   removeBind(map, key, value: VmArgs) {
-    let binds = map.get(key)
+    let binds = map.get(key);
     if (isArray(binds)) {
       for (let i = 0; i < binds.length; i++) {
-        let bind = binds[i]
+        let bind = binds[i];
         if (bind === value) {
-          binds.splice(i, 1)
-          break
+          binds.splice(i, 1);
+          break;
         }
       }
       if (binds.length === 0) {
-        map.delete(key)
+        map.delete(key);
       }
     } else {
-      map.delete(key)
+      map.delete(key);
     }
   },
   // 呼叫绑定的表单
   callBind(map, key, callback) {
-    let binds = map.get(key)
+    let binds = map.get(key);
     if (isArray(binds)) {
-      binds.forEach(callback)
+      binds.forEach(callback);
     }
   },
 
   lockReconnect: false,
   /** 尝试重连 */
   reconnect() {
-    if (this.lockReconnect) return
-    this.lockReconnect = true
+    if (this.lockReconnect) return;
+    this.lockReconnect = true;
     setTimeout(() => {
       if (this.ws && this.ws.close) {
-        this.ws.close()
+        this.ws.close();
       }
-      this.ws = null
-      console.info('【JVxeWebSocket】尝试重连...')
-      this.initialWebSocket()
-      this.lockReconnect = false
-    }, 5000)
+      this.ws = null;
+      console.info('【JVxeWebSocket】尝试重连...');
+      this.initialWebSocket();
+      this.lockReconnect = false;
+    }, 5000);
   },
 
   on: {
     open() {
-      console.info('【JVxeWebSocket】连接成功')
-      this.heartCheck.start()
+      console.info('【JVxeWebSocket】连接成功');
+      this.heartCheck.start();
     },
     error(e) {
-      console.warn('【JVxeWebSocket】连接发生错误:', e)
-      this.reconnect()
+      console.warn('【JVxeWebSocket】连接发生错误:', e);
+      this.reconnect();
     },
     message(e) {
       // 解析消息
-      let json
+      let json;
       try {
-        json = JSON.parse(e.data)
+        json = JSON.parse(e.data);
       } catch (e: any) {
-        console.warn('【JVxeWebSocket】收到无法解析的消息:', e.data)
-        return
+        console.warn('【JVxeWebSocket】收到无法解析的消息:', e.data);
+        return;
       }
-      let type = json[this.constants.TYPE]
-      let data = json[this.constants.DATA]
+      let type = json[this.constants.TYPE];
+      let data = json[this.constants.DATA];
       switch (type) {
         // 心跳检测
         case this.constants.TYPE_HB:
-          this.heartCheck.back()
-          break
+          this.heartCheck.back();
+          break;
         // 更新form数据
         case this.constants.TYPE_UVT:
-          this.callBind(this.tableMap, data.socketKey, (args) => this.onVM.onUpdateTable(args, ...data.args))
-          break
+          this.callBind(this.tableMap, data.socketKey, (args) => this.onVM.onUpdateTable(args, ...data.args));
+          break;
         default:
-          console.warn('【JVxeWebSocket】收到不识别的消息类型:' + type)
-          break
+          console.warn('【JVxeWebSocket】收到不识别的消息类型:' + type);
+          break;
       }
     },
     close(e) {
-      console.info('【JVxeWebSocket】连接被关闭:', e)
-      this.reconnect()
+      console.info('【JVxeWebSocket】连接被关闭:', e);
+      this.reconnect();
     },
   },
 
@@ -179,53 +181,56 @@ const vs = {
     /** 收到更新表格的消息 */
     onUpdateTable({ props, data, methods }: VmArgs, row, caseId) {
       if (data.caseId !== caseId) {
-        const tableRow = methods.getIfRowById(row.id).row
+        const tableRow = methods.getIfRowById(row.id).row;
         // 局部保更新数据
         if (tableRow) {
           if (props.reloadEffect) {
-            data.reloadEffectRowKeysMap[row.id] = true
+            data.reloadEffectRowKeysMap[row.id] = true;
           }
-          Object.assign(tableRow, row, { id: tableRow.id })
-          methods.getXTable().reloadRow(tableRow)
+          Object.assign(tableRow, row, { id: tableRow.id });
+          methods.getXTable().reloadRow(tableRow);
         }
       }
     },
   },
-
-} as ({
-  ws: Nullable<WebSocket>
-} & Recordable)
+} as {
+  ws: Nullable<WebSocket>;
+} & Recordable;
 
 type VmArgs = {
-  props: JVxeTableProps,
-  data: JVxeDataProps,
-  methods: JVxeTableMethods
-}
+  props: JVxeTableProps;
+  data: JVxeDataProps;
+  methods: JVxeTableMethods;
+};
 
 export function useWebSocket(props: JVxeTableProps, data: JVxeDataProps, methods) {
-  const args: VmArgs = { props, data, methods }
-  watch(() => props.socketReload, (socketReload: boolean) => {
-    if (socketReload) {
-      vs.initialWebSocket()
-      vs.addBind(vs.tableMap, props.socketKey, args)
-    } else {
-      vs.removeBind(vs.tableMap, props.socketKey, args)
-    }
-  }, { immediate: true })
+  const args: VmArgs = { props, data, methods };
+  watch(
+    () => props.socketReload,
+    (socketReload: boolean) => {
+      if (socketReload) {
+        vs.initialWebSocket();
+        vs.addBind(vs.tableMap, props.socketKey, args);
+      } else {
+        vs.removeBind(vs.tableMap, props.socketKey, args);
+      }
+    },
+    { immediate: true }
+  );
 
   /** 发送socket消息更新行 */
   function socketSendUpdateRow(row) {
     vs.sendMessage(vs.constants.TYPE_UVT, {
       socketKey: props.socketKey,
       args: [row, data.caseId],
-    })
+    });
   }
 
   onUnmounted(() => {
-    vs.removeBind(vs.tableMap, props.socketKey, args)
-  })
+    vs.removeBind(vs.tableMap, props.socketKey, args);
+  });
 
   return {
     socketSendUpdateRow,
-  }
+  };
 }
diff --git a/src/components/jeecg/JVxeTable/src/install.ts b/src/components/jeecg/JVxeTable/src/install.ts
index f42832d..34b598b 100644
--- a/src/components/jeecg/JVxeTable/src/install.ts
+++ b/src/components/jeecg/JVxeTable/src/install.ts
@@ -1,14 +1,14 @@
-import type { App } from 'vue'
+import type { App } from 'vue';
 // 引入 vxe-table
-import 'xe-utils'
-import VXETable, { /*Grid*/ } from 'vxe-table'
-import VXETablePluginAntd from 'vxe-table-plugin-antd'
-import 'vxe-table/lib/style.css'
+import 'xe-utils';
+import VXETable /*Grid*/ from 'vxe-table';
+import VXETablePluginAntd from 'vxe-table-plugin-antd';
+import 'vxe-table/lib/style.css';
 
-import JVxeTable from './JVxeTable'
-import { getEventPath } from '/@/utils/common/compUtils'
-import { registerAllComponent } from './utils/registerUtils'
-import { getEnhanced } from './utils/enhancedUtils'
+import JVxeTable from './JVxeTable';
+import { getEventPath } from '/@/utils/common/compUtils';
+import { registerAllComponent } from './utils/registerUtils';
+import { getEnhanced } from './utils/enhancedUtils';
 
 export function registerJVxeTable(app: App) {
   // VXETable 全局配置
@@ -16,48 +16,48 @@ export function registerJVxeTable(app: App) {
     // z-index 起始值
     zIndex: 1000,
     table: {},
-  }
+  };
 
   // 添加事件拦截器 event.clearActived
   // 比如点击了某个组件的弹出层面板之后，此时被激活单元格不应该被自动关闭，通过返回 false 可以阻止默认的行为。
   VXETable.interceptor.add('event.clearActived', function (this: any, params) {
     // 获取组件增强
-    let col = params.column.params
-    let { $event } = params
-    const interceptor = getEnhanced(col.type).interceptor
+    let col = params.column.params;
+    let { $event } = params;
+    const interceptor = getEnhanced(col.type).interceptor;
     // 执行增强
-    let flag = interceptor['event.clearActived']?.call(this, ...arguments)
+    let flag = interceptor['event.clearActived']?.call(this, ...arguments);
     if (flag === false) {
-      return false
+      return false;
     }
 
-    let path = getEventPath($event)
+    let path = getEventPath($event);
     for (let p of path) {
-      let className: any = p.className || ''
-      className = typeof className === 'string' ? className : className.toString()
+      let className: any = p.className || '';
+      className = typeof className === 'string' ? className : className.toString();
 
       /* --- 特殊处理以下组件，点击以下标签时不清空编辑状态 --- */
 
       // 点击的标签是JInputPop
       if (className.includes('j-input-pop')) {
-        return false
+        return false;
       }
       // 点击的标签是JPopup的弹出层、部门选择、用户选择
       if (className.includes('j-popup-modal') || className.includes('j-depart-select-modal') || className.includes('j-user-select-modal')) {
-        return false
+        return false;
       }
       // 执行增强
-      let flag = interceptor['event.clearActived.className']?.call(this, className, ...arguments)
+      let flag = interceptor['event.clearActived.className']?.call(this, className, ...arguments);
       if (flag === false) {
-        return false
+        return false;
       }
     }
-  })
+  });
   // 注册插件
-  VXETable.use(VXETablePluginAntd)
+  VXETable.use(VXETablePluginAntd);
   // 注册自定义组件
-  registerAllComponent()
+  registerAllComponent();
   // 执行注册方法
-  app.use(VXETable, VXETableSettings)
-  app.component('JVxeTable', JVxeTable)
-}
\ No newline at end of file
+  app.use(VXETable, VXETableSettings);
+  app.component('JVxeTable', JVxeTable);
+}
diff --git a/src/components/jeecg/JVxeTable/src/style/index.less b/src/components/jeecg/JVxeTable/src/style/index.less
index 63b0f02..16de74c 100644
--- a/src/components/jeecg/JVxeTable/src/style/index.less
+++ b/src/components/jeecg/JVxeTable/src/style/index.less
@@ -1,8 +1,7 @@
-@import "vxe.const";
-@import "vxe.dark";
+@import 'vxe.const';
+@import 'vxe.dark';
 
 .@{prefix-cls} {
-
   // 编辑按钮样式
   .vxe-cell--edit-icon {
     border-color: #606266;
@@ -14,7 +13,6 @@
 
   // toolbar 样式
   &-toolbar {
-
     &-collapsed {
       [data-collapse] {
         display: none;
@@ -74,5 +72,4 @@
   .vxe-body--row.sortable-chosen {
     background-color: #dfecfb;
   }
-
 }
diff --git a/src/components/jeecg/JVxeTable/src/style/reload-effect.less b/src/components/jeecg/JVxeTable/src/style/reload-effect.less
index c794ea7..0333c81 100644
--- a/src/components/jeecg/JVxeTable/src/style/reload-effect.less
+++ b/src/components/jeecg/JVxeTable/src/style/reload-effect.less
@@ -1,5 +1,4 @@
 .j-vxe-reload-effect-box {
-
   &,
   .j-vxe-reload-effect-span {
     display: inline;
@@ -8,7 +7,6 @@
   }
 
   .j-vxe-reload-effect-span {
-
     &.layer-top {
       display: inline-block;
       width: 100%;
@@ -43,4 +41,4 @@
       transform: rotateX(180deg);
     }
   }
-}
\ No newline at end of file
+}
diff --git a/src/components/jeecg/JVxeTable/src/style/vxe.const.less b/src/components/jeecg/JVxeTable/src/style/vxe.const.less
index 6baeaf0..49db4e3 100644
--- a/src/components/jeecg/JVxeTable/src/style/vxe.const.less
+++ b/src/components/jeecg/JVxeTable/src/style/vxe.const.less
@@ -1,2 +1,2 @@
 //noinspection LessUnresolvedVariable
-@prefix-cls: ~'@{namespace}-j-vxe-table';
\ No newline at end of file
+@prefix-cls: ~'@{namespace}-j-vxe-table';
diff --git a/src/components/jeecg/JVxeTable/src/style/vxe.dark.less b/src/components/jeecg/JVxeTable/src/style/vxe.dark.less
index fd9fdcf..a33c872 100644
--- a/src/components/jeecg/JVxeTable/src/style/vxe.dark.less
+++ b/src/components/jeecg/JVxeTable/src/style/vxe.dark.less
@@ -1,11 +1,14 @@
-@import "vxe.const";
+@import 'vxe.const';
 
 [data-theme='dark'] .@{prefix-cls} {
   @fontColor: #c9d1d9;
   @bgColor: #151515;
   @borderColor: #606060;
 
-  .vxe-cell--item, .vxe-cell--title, .vxe-cell, .vxe-body--expanded-cell {
+  .vxe-cell--item,
+  .vxe-cell--title,
+  .vxe-cell,
+  .vxe-body--expanded-cell {
     color: @fontColor;
   }
 
@@ -63,7 +66,6 @@
     background-color: #1d1d1d;
   }
 
-
   .vxe-table--render-default.border--default .vxe-body--column,
   .vxe-table--render-default.border--default .vxe-footer--column,
   .vxe-table--render-default.border--default .vxe-header--column,
@@ -73,20 +75,18 @@
     background-image: linear-gradient(#1d1d1d, #1d1d1d);
   }
 
-
   // 列宽拖动
   .vxe-header--column .vxe-resizable.is--line:before {
     background-color: #505050;
   }
 
-
   // checkbox
   .vxe-custom--option .vxe-checkbox--icon:before,
   .vxe-export--panel-column-option .vxe-checkbox--icon:before,
   .vxe-table--filter-option .vxe-checkbox--icon:before,
   .vxe-table--render-default .vxe-cell--checkbox .vxe-checkbox--icon:before {
     background-color: @bgColor;
-    border-color: @borderColor
+    border-color: @borderColor;
   }
 
   .vxe-toolbar .vxe-custom--option-wrapper {
@@ -95,7 +95,7 @@
 
   .vxe-button {
     background-color: @bgColor;
-    border-color: @borderColor
+    border-color: @borderColor;
   }
 
   .vxe-button.type--button:not(.is--disabled):active {
@@ -109,4 +109,4 @@
   .vxe-toolbar .vxe-custom--option-wrapper .vxe-custom--footer button {
     color: @fontColor;
   }
-}
\ No newline at end of file
+}
diff --git a/src/components/jeecg/JVxeTable/src/types/JVxeComponent.ts b/src/components/jeecg/JVxeTable/src/types/JVxeComponent.ts
index 3ca6420..1e7009a 100644
--- a/src/components/jeecg/JVxeTable/src/types/JVxeComponent.ts
+++ b/src/components/jeecg/JVxeTable/src/types/JVxeComponent.ts
@@ -1,13 +1,12 @@
-import { ComponentInternalInstance, ExtractPropTypes } from 'vue'
-import { useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks'
+import { ComponentInternalInstance, ExtractPropTypes } from 'vue';
+import { useJVxeCompProps } from '/@/components/jeecg/JVxeTable/hooks';
 
 export namespace JVxeComponent {
-
   export type Props = ExtractPropTypes<ReturnType<typeof useJVxeCompProps>>;
 
   interface EnhancedCtx {
-    props?: JVxeComponent.Props,
-    context?: any,
+    props?: JVxeComponent.Props;
+    context?: any;
   }
 
   /** 组件增强类型 */
@@ -15,60 +14,60 @@ export namespace JVxeComponent {
     // 注册参数（详见：https://xuliangzhan_admin.gitee.io/vxe-table/v4/table/renderer/edit）
     installOptions: {
       // 自动聚焦的 class 类名
-      autofocus?: string,
-    } & Recordable,
+      autofocus?: string;
+    } & Recordable;
     // 事件拦截器（用于兼容）
     interceptor: {
       // 已实现：event.clearActived
       // 说明：比如点击了某个组件的弹出层面板之后，此时被激活单元格不应该被自动关闭，通过返回 false 可以阻止默认的行为。
-      'event.clearActived'?: (params, event, target, ctx?: EnhancedCtx) => boolean,
+      'event.clearActived'?: (params, event, target, ctx?: EnhancedCtx) => boolean;
       // 自定义：event.clearActived.className
       // 说明：比原生的多了一个参数：className，用于判断点击的元素的样式名（递归到顶层）
-      'event.clearActived.className'?: (params, event, target, ctx?: EnhancedCtx) => boolean,
-    },
+      'event.clearActived.className'?: (params, event, target, ctx?: EnhancedCtx) => boolean;
+    };
     // 【功能开关】
     switches: {
       // 是否使用 editRender 模式（仅当前组件，并非全局）
       // 如果设为true，则表头上方会出现一个可编辑的图标
-      editRender?: boolean,
+      editRender?: boolean;
       // false = 组件触发后可视）；true = 组件一直可视
-      visible?: boolean,
-    },
+      visible?: boolean;
+    };
     // 【切面增强】切面事件处理，一般在某些方法执行后同步执行
     aopEvents: {
       // 单元格被激活编辑时会触发该事件
-      editActived?: (this: ComponentInternalInstance, ...args) => any,
+      editActived?: (this: ComponentInternalInstance, ...args) => any;
       // 单元格编辑状态下被关闭时会触发该事件
-      editClosed?: (this: ComponentInternalInstance, ...args) => any,
+      editClosed?: (this: ComponentInternalInstance, ...args) => any;
       // 返回值决定单元格是否可以编辑
-      activeMethod?: (this: ComponentInternalInstance, ...args) => boolean,
-    },
+      activeMethod?: (this: ComponentInternalInstance, ...args) => boolean;
+    };
     // 【翻译增强】可以实现例如select组件保存的value，但是span模式下需要显示成text
     translate: {
       // 是否启用翻译
-      enabled?: boolean,
+      enabled?: boolean;
       /**
        * 【翻译处理方法】如果handler留空，则使用默认的翻译方法
        *
        * @param value 需要翻译的值
        * @returns{*} 返回翻译后的数据
        */
-      handler?: (value, ctx?: EnhancedCtx) => any
-    },
+      handler?: (value, ctx?: EnhancedCtx) => any;
+    };
     /**
      * 【获取值增强】组件抛出的值
      *
      * @param value 保存到数据库里的值
      * @returns{*} 返回处理后的值
      */
-    getValue: (value, ctx?: EnhancedCtx) => any,
+    getValue: (value, ctx?: EnhancedCtx) => any;
     /**
      * 【设置值增强】设置给组件的值
      *
      * @param value 组件触发的值
      * @returns{*} 返回处理后的值
      */
-    setValue: (value, ctx?: EnhancedCtx) => any,
+    setValue: (value, ctx?: EnhancedCtx) => any;
     /**
      * 【新增行增强】在用户点击新增时触发的事件，返回新行的默认值
      *
@@ -81,8 +80,8 @@ export namespace JVxeComponent {
      *
      * @returns 返回新值
      */
-    createValue: (defaultValue: any, ctx?: EnhancedCtx) => any,
+    createValue: (defaultValue: any, ctx?: EnhancedCtx) => any;
   }
 
-  export type EnhancedPartial = Partial<Enhanced>
-}
\ No newline at end of file
+  export type EnhancedPartial = Partial<Enhanced>;
+}
diff --git a/src/components/jeecg/JVxeTable/src/types/JVxeTypes.ts b/src/components/jeecg/JVxeTable/src/types/JVxeTypes.ts
index 617204b..060b62a 100644
--- a/src/components/jeecg/JVxeTable/src/types/JVxeTypes.ts
+++ b/src/components/jeecg/JVxeTable/src/types/JVxeTypes.ts
@@ -48,11 +48,11 @@ export enum JVxeTypes {
 
 // 为了防止和 vxe 内置的类型冲突，所以加上一个前缀
 // 前缀是自动加的，代码中直接用就行（JVxeTypes.input）
-export const JVxeTypePrefix = 'j-'
+export const JVxeTypePrefix = 'j-';
 
 /** VxeTable 渲染类型 */
 export enum JVxeRenderType {
   editer = 'editer',
   spaner = 'spaner',
   default = 'default',
-}
\ No newline at end of file
+}
diff --git a/src/components/jeecg/JVxeTable/src/types/index.ts b/src/components/jeecg/JVxeTable/src/types/index.ts
index b9c5de7..a7dca8e 100644
--- a/src/components/jeecg/JVxeTable/src/types/index.ts
+++ b/src/components/jeecg/JVxeTable/src/types/index.ts
@@ -1,120 +1,120 @@
-import type { Component, Ref, ComputedRef, ExtractPropTypes } from 'vue'
-import type { VxeColumnProps } from 'vxe-table/types/column'
-import type { JVxeComponent } from './JVxeComponent'
-import type { VxeGridInstance, VxeTablePropTypes } from 'vxe-table'
-import { JVxeTypes } from './JVxeTypes'
-import { vxeProps } from '../vxe.data'
-import { useMethods } from '../hooks/useMethods'
-import { getJVxeAuths } from '../utils/authUtils'
+import type { Component, Ref, ComputedRef, ExtractPropTypes } from 'vue';
+import type { VxeColumnProps } from 'vxe-table/types/column';
+import type { JVxeComponent } from './JVxeComponent';
+import type { VxeGridInstance, VxeTablePropTypes } from 'vxe-table';
+import { JVxeTypes } from './JVxeTypes';
+import { vxeProps } from '../vxe.data';
+import { useMethods } from '../hooks/useMethods';
+import { getJVxeAuths } from '../utils/authUtils';
 
 export type JVxeTableProps = Partial<ExtractPropTypes<ReturnType<typeof vxeProps>>>;
-export type JVxeTableMethods = ReturnType<typeof useMethods>['methods']
+export type JVxeTableMethods = ReturnType<typeof useMethods>['methods'];
 
 export type JVxeVueComponent = {
-  enhanced?: JVxeComponent.EnhancedPartial
-} & Component
+  enhanced?: JVxeComponent.EnhancedPartial;
+} & Component;
 
-type statisticsTypes = 'sum' | 'average'
+type statisticsTypes = 'sum' | 'average';
 
-export type JVxeColumn = IJVxeColumn & Recordable
+export type JVxeColumn = IJVxeColumn & Recordable;
 
 /**
  * JVxe 列配置项
  */
 export interface IJVxeColumn extends VxeColumnProps {
-  type?: any,
+  type?: any;
   // 行唯一标识
-  key: string,
+  key: string;
   // 表单预期值的提示信息，可以使用${...}变量替换文本
-  placeholder?: string,
+  placeholder?: string;
   // 默认值
-  defaultValue?: any,
+  defaultValue?: any;
   // 是否禁用当前列，默认false
-  disabled?: boolean,
+  disabled?: boolean;
   // 校验规则 TODO 类型待定义
-  validateRules?: any,
+  validateRules?: any;
   // 联动下一级的字段key
-  linkageKey?: string,
+  linkageKey?: string;
   // 自定义传入组件的其他属性
-  props?: Recordable,
-  allowClear?: boolean,// 允许清除
+  props?: Recordable;
+  allowClear?: boolean; // 允许清除
   // 【inputNumber】是否是统计列，只有 inputNumber 才能设置统计列。统计列：sum 求和；average 平均值
-  statistics?: boolean | [statisticsTypes, statisticsTypes?],
+  statistics?: boolean | [statisticsTypes, statisticsTypes?];
   // 【select】
-  dictCode?: string,  // 字典 code
-  options?: ({ title?: string, label?: string, text?: string, value: any, disabled?: boolean })[],  // 下拉选项列表
-  allowInput?: boolean,  // 允许输入
-  allowSearch?: boolean,  // 允许搜索
+  dictCode?: string; // 字典 code
+  options?: { title?: string; label?: string; text?: string; value: any; disabled?: boolean }[]; // 下拉选项列表
+  allowInput?: boolean; // 允许输入
+  allowSearch?: boolean; // 允许搜索
   // 【slot】
-  slotName?: string,// 插槽名
+  slotName?: string; // 插槽名
   // 【checkbox】
-  customValue?: [any, any],  // 自定义值
-  defaultChecked?: boolean,  // 默认选中
+  customValue?: [any, any]; // 自定义值
+  defaultChecked?: boolean; // 默认选中
   // 【upload】 upload
-  btnText?: string, // 上传按钮文字
-  token?: boolean, // 是否传递 token
-  responseName?: string, // 返回取值名称
-  action?: string, // 上传地址
-  allowRemove?: boolean, // 是否允许删除
-  allowDownload?: boolean, // 是否允许下载
+  btnText?: string; // 上传按钮文字
+  token?: boolean; // 是否传递 token
+  responseName?: string; // 返回取值名称
+  action?: string; // 上传地址
+  allowRemove?: boolean; // 是否允许删除
+  allowDownload?: boolean; // 是否允许下载
   // 【下拉字典搜索】
-  dict?: string,// 字典表配置信息：数据库表名,显示字段名,存储字段名
-  async?: boolean, // 是否同步模式
-  tipsContent?: string,
+  dict?: string; // 字典表配置信息：数据库表名,显示字段名,存储字段名
+  async?: boolean; // 是否同步模式
+  tipsContent?: string;
   // 【popup】
-  popupCode?: string,
-  field?: string,
-  orgFields?: string,
-  destFields?: string,
+  popupCode?: string;
+  field?: string;
+  orgFields?: string;
+  destFields?: string;
 }
 
 export interface JVxeRefs {
-  gridRef: Ref<VxeGridInstance | undefined>
-  subPopoverRef: Ref<any>
-  detailsModalRef: Ref<any>
+  gridRef: Ref<VxeGridInstance | undefined>;
+  subPopoverRef: Ref<any>;
+  detailsModalRef: Ref<any>;
 }
 
 export interface JVxeDataProps {
-  prefixCls: string,
+  prefixCls: string;
   // vxe 实例ID
-  caseId: string,
+  caseId: string;
   // vxe 最终 columns
-  vxeColumns?: ComputedRef,
+  vxeColumns?: ComputedRef;
   // vxe 最终 dataSource
-  vxeDataSource: Ref<Recordable[]>,
+  vxeDataSource: Ref<Recordable[]>;
   // 记录滚动条位置
-  scroll: { top: number, left: number },
+  scroll: { top: number; left: number };
   // 当前是否正在滚动
-  scrolling: Ref<boolean>,
+  scrolling: Ref<boolean>;
   // vxe 默认配置
-  defaultVxeProps: object,
+  defaultVxeProps: object;
   // 绑定左侧选择框
-  selectedRows: Ref<any[]>,
+  selectedRows: Ref<any[]>;
   // 绑定左侧选择框已选择的id
-  selectedRowIds: Ref<string[]>,
-  disabledRowIds: string[],
+  selectedRowIds: Ref<string[]>;
+  disabledRowIds: string[];
   // 统计列配置
   statistics: {
-    has: boolean,
-    sum: string[],
-    average: string[],
-  },
+    has: boolean;
+    sum: string[];
+    average: string[];
+  };
   // 所有和当前表格相关的授权信息
-  authsMap: Ref<Nullable<ReturnType<typeof getJVxeAuths>>>,
+  authsMap: Ref<Nullable<ReturnType<typeof getJVxeAuths>>>;
   // 内置 EditRules
-  innerEditRules: Recordable<VxeTablePropTypes.EditRules[]>,
+  innerEditRules: Recordable<VxeTablePropTypes.EditRules[]>;
   // 联动下拉选项（用于隔离不同的下拉选项）
   // 内部联动配置，map
-  innerLinkageConfig: Map<string, any>,
+  innerLinkageConfig: Map<string, any>;
   // 开启了数据刷新效果的行
-  reloadEffectRowKeysMap: Recordable,
+  reloadEffectRowKeysMap: Recordable;
 }
 
 export interface JVxeLinkageConfig {
   // 联动第一级的 key
-  key: string,
+  key: string;
   // 获取数据的方法
-  requestData: (parent: string) => Promise<any>,
+  requestData: (parent: string) => Promise<any>;
 }
 
-export { JVxeTypes }
\ No newline at end of file
+export { JVxeTypes };
diff --git a/src/components/jeecg/JVxeTable/src/utils/authUtils.ts b/src/components/jeecg/JVxeTable/src/utils/authUtils.ts
index c75a1a4..405f10a 100644
--- a/src/components/jeecg/JVxeTable/src/utils/authUtils.ts
+++ b/src/components/jeecg/JVxeTable/src/utils/authUtils.ts
@@ -1,33 +1,33 @@
 /* JVxeTable 行编辑 权限 */
-import { usePermissionStoreWithOut } from '/@/store/modules/permission'
+import { usePermissionStoreWithOut } from '/@/store/modules/permission';
 
-const permissionStore = usePermissionStoreWithOut()
+const permissionStore = usePermissionStoreWithOut();
 
 /**
  * JVxe 专用，获取权限
  * @param prefix
  */
 export function getJVxeAuths(prefix) {
-  prefix = getPrefix(prefix)
-  let { authList, allAuthList } = permissionStore
-  let authsMap = new Map<string, typeof allAuthList[0]>()
+  prefix = getPrefix(prefix);
+  let { authList, allAuthList } = permissionStore;
+  let authsMap = new Map<string, typeof allAuthList[0]>();
   if (!prefix || prefix.length == 0) {
-    return authsMap
+    return authsMap;
   }
   // 将所有vxe用到的权限取出来
   for (let auth of allAuthList) {
     if (auth.status == '1' && auth.action.startsWith(prefix)) {
-      authsMap.set(auth.action, { ...auth, isAuth: false })
+      authsMap.set(auth.action, { ...auth, isAuth: false });
     }
   }
   // 设置是否已授权
   for (let auth of authList) {
-    let getAuth = authsMap.get(auth.action)
+    let getAuth = authsMap.get(auth.action);
     if (getAuth != null) {
-      getAuth.isAuth = true
+      getAuth.isAuth = true;
     }
   }
-  return authsMap
+  return authsMap;
 }
 
 /**
@@ -36,7 +36,7 @@ export function getJVxeAuths(prefix) {
  */
 export function getPrefix(prefix: string) {
   if (prefix && !prefix.endsWith(':')) {
-    return prefix + ':'
+    return prefix + ':';
   }
-  return prefix
+  return prefix;
 }
diff --git a/src/components/jeecg/JVxeTable/src/utils/enhancedUtils.ts b/src/components/jeecg/JVxeTable/src/utils/enhancedUtils.ts
index 10f74eb..18b360a 100644
--- a/src/components/jeecg/JVxeTable/src/utils/enhancedUtils.ts
+++ b/src/components/jeecg/JVxeTable/src/utils/enhancedUtils.ts
@@ -1,154 +1,155 @@
-import type {Ref, ComponentInternalInstance} from 'vue'
-import {unref, isRef} from 'vue'
-import { useDefaultEnhanced } from '../hooks/useJVxeComponent'
-import { isFunction, isObject, isString } from '/@/utils/is'
-import { JVxeTypes } from '../types'
-import { JVxeComponent } from '../types/JVxeComponent'
-import { componentMap } from '../componentMap'
+import type { Ref, ComponentInternalInstance } from 'vue';
+import { unref, isRef } from 'vue';
+import { useDefaultEnhanced } from '../hooks/useJVxeComponent';
+import { isFunction, isObject, isString } from '/@/utils/is';
+import { JVxeTypes } from '../types';
+import { JVxeComponent } from '../types/JVxeComponent';
+import { componentMap } from '../componentMap';
 
 // 已注册的组件增强
-const enhancedMap = new Map<JVxeTypes, JVxeComponent.Enhanced>()
+const enhancedMap = new Map<JVxeTypes, JVxeComponent.Enhanced>();
 
 /**
  * 获取某个组件的增强
  * @param type JVxeTypes
  */
 export function getEnhanced(type: JVxeTypes | string): JVxeComponent.Enhanced {
-  let $type: JVxeTypes = <JVxeTypes>type
+  let $type: JVxeTypes = <JVxeTypes>type;
   if (!enhancedMap.has($type)) {
-    let defaultEnhanced = useDefaultEnhanced()
+    let defaultEnhanced = useDefaultEnhanced();
     if (componentMap.has($type)) {
-      let enhanced = componentMap.get($type)?.enhanced ?? {}
+      let enhanced = componentMap.get($type)?.enhanced ?? {};
       if (isObject(enhanced)) {
-        Object.keys(defaultEnhanced).forEach(key => {
-          let def = defaultEnhanced[key]
+        Object.keys(defaultEnhanced).forEach((key) => {
+          let def = defaultEnhanced[key];
           if (enhanced.hasOwnProperty(key)) {
             // 方法如果存在就不覆盖
             if (!isFunction(def) && !isString(def)) {
-              enhanced[key] = Object.assign({}, def, enhanced[key])
+              enhanced[key] = Object.assign({}, def, enhanced[key]);
             }
           } else {
-            enhanced[key] = def
+            enhanced[key] = def;
           }
-        })
-        enhancedMap.set($type, <JVxeComponent.Enhanced>enhanced)
-        return <JVxeComponent.Enhanced>enhanced
+        });
+        enhancedMap.set($type, <JVxeComponent.Enhanced>enhanced);
+        return <JVxeComponent.Enhanced>enhanced;
       }
     } else {
-      throw new Error(`[JVxeTable] ${$type} 组件尚未注册，获取增强失败`)
+      throw new Error(`[JVxeTable] ${$type} 组件尚未注册，获取增强失败`);
     }
-    enhancedMap.set($type, <JVxeComponent.Enhanced>defaultEnhanced)
+    enhancedMap.set($type, <JVxeComponent.Enhanced>defaultEnhanced);
   }
-  return <JVxeComponent.Enhanced>enhancedMap.get($type)
+  return <JVxeComponent.Enhanced>enhancedMap.get($type);
 }
 
 /** 辅助方法：替换${...}变量 */
 export function replaceProps(col, value) {
   if (value && typeof value === 'string') {
-    let text = value
-    text = text.replace(/\${title}/g, col.title)
-    text = text.replace(/\${key}/g, col.key)
-    text = text.replace(/\${defaultValue}/g, col.defaultValue)
-    return text
+    let text = value;
+    text = text.replace(/\${title}/g, col.title);
+    text = text.replace(/\${key}/g, col.key);
+    text = text.replace(/\${defaultValue}/g, col.defaultValue);
+    return text;
   }
-  return value
+  return value;
 }
 
 type dispatchEventOptions = {
   // JVxeTable 的 props
-  props,
+  props;
   // 触发的 event 事件对象
-  $event,
+  $event;
   // 行、列
-  row?, column?,
+  row?;
+  column?;
   // JVxeTable的vue3实例
-  instance?: ComponentInternalInstance,
+  instance?: ComponentInternalInstance;
   // 要寻找的className
-  className: string,
+  className: string;
   // 重写找到dom后的处理方法
-  handler?: Fn,
+  handler?: Fn;
   // 是否直接执行click方法而不是模拟click事件
-  isClick?: boolean,
-}
+  isClick?: boolean;
+};
 
 /** 模拟触发事件 */
 export function dispatchEvent(options: dispatchEventOptions) {
-  const {props, $event, row, column, instance, className, handler, isClick} = options
+  const { props, $event, row, column, instance, className, handler, isClick } = options;
   if ((!$event || !$event.path) && !instance) {
-    return
+    return;
   }
   // alwaysEdit 下不模拟触发事件，否者会导致触发两次
   if (props && props.alwaysEdit) {
-    return
+    return;
   }
   let getCell = () => {
-    let paths: HTMLElement[] = [...($event?.path ?? [])]
+    let paths: HTMLElement[] = [...($event?.path ?? [])];
     // 通过 instance 获取 cell dom对象
     if (row && column) {
-      let selector = `table.vxe-table--body tbody tr[rowid='${row.id}'] td[colid='${column.id}']`
-      let cellDom = instance!.vnode?.el?.querySelector(selector)
+      let selector = `table.vxe-table--body tbody tr[rowid='${row.id}'] td[colid='${column.id}']`;
+      let cellDom = instance!.vnode?.el?.querySelector(selector);
       if (cellDom) {
-        paths.unshift(cellDom)
+        paths.unshift(cellDom);
       }
     }
     for (const el of paths) {
       if (el.classList?.contains('vxe-body--column')) {
-        return el
+        return el;
       }
     }
-    return null
-  }
-  let cell = getCell()
+    return null;
+  };
+  let cell = getCell();
   if (cell) {
     window.setTimeout(() => {
       let getElement = () => {
-        let classList = className.split(' ')
+        let classList = className.split(' ');
         if (classList.length > 0) {
           const getClassName = (cls: string) => {
             if (cls.startsWith('.')) {
-              return cls.substring(1, cls.length)
+              return cls.substring(1, cls.length);
             }
-            return cls
-          }
+            return cls;
+          };
           let get = (target, className, idx = 0) => {
-            let elements = target.getElementsByClassName(getClassName(className))
+            let elements = target.getElementsByClassName(getClassName(className));
             if (elements && elements.length > 0) {
-              return elements[idx]
+              return elements[idx];
             }
-            return null
-          }
-          let element: HTMLElement = get(cell, classList[0])
+            return null;
+          };
+          let element: HTMLElement = get(cell, classList[0]);
           for (let i = 1; i < classList.length; i++) {
             if (!element) {
-              break
+              break;
             }
-            element = get(element, classList[i])
+            element = get(element, classList[i]);
           }
-          return element
+          return element;
         }
-        return null
-      }
-      let element = getElement()
+        return null;
+      };
+      let element = getElement();
       if (element) {
         if (isFunction(handler)) {
-          handler(element)
+          handler(element);
         } else {
           // 模拟触发点击事件
           if (isClick) {
-            element.click()
+            element.click();
           } else {
-            element.dispatchEvent($event)
+            element.dispatchEvent($event);
           }
         }
       }
-    }, 10)
+    }, 10);
   } else {
-    console.warn('【JVxeTable】dispatchEvent 获取 cell 失败')
+    console.warn('【JVxeTable】dispatchEvent 获取 cell 失败');
   }
 }
 
 /** 绑定 VxeTable 数据 */
 export function vModel(value, row, column: Ref<any> | string) {
-  let property = isRef(column) ? column.value.property : column
-  unref(row)[property] = value
-}
\ No newline at end of file
+  let property = isRef(column) ? column.value.property : column;
+  unref(row)[property] = value;
+}
diff --git a/src/components/jeecg/JVxeTable/src/utils/registerUtils.ts b/src/components/jeecg/JVxeTable/src/utils/registerUtils.ts
index 07dc2da..4a4f9ea 100644
--- a/src/components/jeecg/JVxeTable/src/utils/registerUtils.ts
+++ b/src/components/jeecg/JVxeTable/src/utils/registerUtils.ts
@@ -1,10 +1,10 @@
-import type { Component } from 'vue'
-import { h } from 'vue'
-import VXETable from 'vxe-table'
-import { definedComponent, addComponent, componentMap, spanEnds, excludeKeywords } from '../componentMap'
-import { JVxeRenderType, JVxeTypePrefix, JVxeTypes } from '../types/JVxeTypes'
-import { getEnhanced } from './enhancedUtils'
-import { isFunction } from '/@/utils/is'
+import type { Component } from 'vue';
+import { h } from 'vue';
+import VXETable from 'vxe-table';
+import { definedComponent, addComponent, componentMap, spanEnds, excludeKeywords } from '../componentMap';
+import { JVxeRenderType, JVxeTypePrefix, JVxeTypes } from '../types/JVxeTypes';
+import { getEnhanced } from './enhancedUtils';
+import { isFunction } from '/@/utils/is';
 
 /**
  * 判断某个组件是否已注册
@@ -12,9 +12,9 @@ import { isFunction } from '/@/utils/is'
  */
 export function isRegistered(type: JVxeTypes | string) {
   if (excludeKeywords.includes(<JVxeTypes>type)) {
-    return true
+    return true;
   }
-  return componentMap.has(type)
+  return componentMap.has(type);
 }
 
 /**
@@ -25,8 +25,8 @@ export function isRegistered(type: JVxeTypes | string) {
  * @param spanComponent
  */
 export function registerComponent(type: JVxeTypes, component: Component, spanComponent?: Component) {
-  addComponent(type, component, spanComponent)
-  registerOneComponent(type)
+  addComponent(type, component, spanComponent);
+  registerOneComponent(type);
 }
 
 /**
@@ -36,15 +36,15 @@ export function registerComponent(type: JVxeTypes, component: Component, spanCom
  * @param promise
  */
 export async function registerAsyncComponent(type: JVxeTypes, promise: Promise<any>) {
-  const result = await promise
+  const result = await promise;
   if (isFunction(result.installJVxe)) {
     result.install((component: Component, spanComponent?: Component) => {
-      addComponent(type, component, spanComponent)
-      registerOneComponent(type)
-    })
+      addComponent(type, component, spanComponent);
+      registerOneComponent(type);
+    });
   } else {
-    addComponent(type, result.default)
-    registerOneComponent(type)
+    addComponent(type, result.default);
+    registerOneComponent(type);
   }
 }
 
@@ -52,14 +52,14 @@ export async function registerAsyncComponent(type: JVxeTypes, promise: Promise<a
  * 安装所有vxe组件
  */
 export function registerAllComponent() {
-  definedComponent()
+  definedComponent();
   // 遍历所有组件批量注册
-  const components = [...componentMap.keys()]
-  components.forEach(type => {
+  const components = [...componentMap.keys()];
+  components.forEach((type) => {
     if (!type.endsWith(spanEnds)) {
-      registerOneComponent(<JVxeTypes>type)
+      registerOneComponent(<JVxeTypes>type);
     }
-  })
+  });
 }
 
 /**
@@ -68,29 +68,29 @@ export function registerAllComponent() {
  * @param type 组件 type
  */
 export function registerOneComponent(type: JVxeTypes) {
-  const component = componentMap.get(type)
+  const component = componentMap.get(type);
   if (component) {
-    const switches = getEnhanced(type).switches
+    const switches = getEnhanced(type).switches;
     if (switches.editRender && !switches.visible) {
-      createEditRender(type, component)
+      createEditRender(type, component);
     } else {
-      createCellRender(type, component)
+      createCellRender(type, component);
     }
   } else {
-    throw new Error(`【registerOneComponent】"${type}"不存在于componentMap中`)
+    throw new Error(`【registerOneComponent】"${type}"不存在于componentMap中`);
   }
 }
 
 /** 注册可编辑组件 */
 function createEditRender(type: JVxeTypes, component: Component, spanComponent?: Component) {
   // 获取当前组件的增强
-  const enhanced = getEnhanced(type)
+  const enhanced = getEnhanced(type);
   if (!spanComponent) {
     if (componentMap.has(type + spanEnds)) {
-      spanComponent = componentMap.get(type + spanEnds)
+      spanComponent = componentMap.get(type + spanEnds);
     } else {
       // 默认的 span 组件为 normal
-      spanComponent = componentMap.get(JVxeTypes.normal)
+      spanComponent = componentMap.get(JVxeTypes.normal);
     }
   }
   // 添加渲染
@@ -101,28 +101,30 @@ function createEditRender(type: JVxeTypes, component: Component, spanComponent?:
     renderCell: createRender(type, spanComponent, JVxeRenderType.spaner),
     // 增强注册
     ...enhanced.installOptions,
-  })
+  });
 }
 
 /** 注册普通组件 */
 function createCellRender(type: JVxeTypes, component: Component = <Component>componentMap.get(JVxeTypes.normal)) {
   // 获取当前组件的增强
-  const enhanced = getEnhanced(type)
+  const enhanced = getEnhanced(type);
   VXETable.renderer.add(JVxeTypePrefix + type, {
     // 默认显示模板
     renderDefault: createRender(type, component, JVxeRenderType.default),
     // 增强注册
     ...enhanced.installOptions,
-  })
+  });
 }
 
 function createRender(type, component, renderType) {
   return function (renderOptions, params) {
-    return [h(component, {
-      type: type,
-      params: params,
-      renderOptions: renderOptions,
-      renderType: renderType,
-    })]
-  }
+    return [
+      h(component, {
+        type: type,
+        params: params,
+        renderOptions: renderOptions,
+        renderType: renderType,
+      }),
+    ];
+  };
 }
diff --git a/src/components/jeecg/JVxeTable/src/utils/vxeUtils.ts b/src/components/jeecg/JVxeTable/src/utils/vxeUtils.ts
index e49acc1..108fd67 100644
--- a/src/components/jeecg/JVxeTable/src/utils/vxeUtils.ts
+++ b/src/components/jeecg/JVxeTable/src/utils/vxeUtils.ts
@@ -7,15 +7,15 @@
  */
 export function getParentNodeByTagName(dom: HTMLElement, tagName: string = 'body'): HTMLElement | null {
   if (tagName === 'body') {
-    return document.body
+    return document.body;
   }
   if (dom.parentElement) {
     if (dom.parentElement.tagName.toLowerCase() === tagName.trim().toLowerCase()) {
-      return dom.parentElement
+      return dom.parentElement;
     } else {
-      return getParentNodeByTagName(dom.parentElement, tagName)
+      return getParentNodeByTagName(dom.parentElement, tagName);
     }
   } else {
-    return null
+    return null;
   }
 }
diff --git a/src/components/jeecg/JVxeTable/src/vxe.data.ts b/src/components/jeecg/JVxeTable/src/vxe.data.ts
index 756eea0..8a109c2 100644
--- a/src/components/jeecg/JVxeTable/src/vxe.data.ts
+++ b/src/components/jeecg/JVxeTable/src/vxe.data.ts
@@ -1,4 +1,4 @@
-import { propTypes } from '/@/utils/propTypes'
+import { propTypes } from '/@/utils/propTypes';
 
 export const vxeProps = () => ({
   rowKey: propTypes.string.def('id'),
@@ -39,10 +39,7 @@ export const vxeProps = () => ({
   // 页面是否在加载中
   loading: propTypes.bool.def(false),
   // 表格高度
-  height: propTypes.oneOfType([
-    propTypes.number,
-    propTypes.string,
-  ]).def('auto'),
+  height: propTypes.oneOfType([propTypes.number, propTypes.string]).def('auto'),
   // 最大高度
   maxHeight: {
     type: Number,
@@ -91,6 +88,6 @@ export const vxeProps = () => ({
   addSetActive: propTypes.bool.def(true),
   // 是否开启键盘编辑
   keyboardEdit: propTypes.bool.def(false),
-})
+});
 
-export const vxeEmits = ['save', 'added', 'removed', 'inserted', 'dragged', 'selectRowChange', 'pageChange', 'valueChange']
\ No newline at end of file
+export const vxeEmits = ['save', 'added', 'removed', 'inserted', 'dragged', 'selectRowChange', 'pageChange', 'valueChange'];
diff --git a/src/components/jeecg/JVxeTable/types.ts b/src/components/jeecg/JVxeTable/types.ts
index 0fe3879..7e668f7 100644
--- a/src/components/jeecg/JVxeTable/types.ts
+++ b/src/components/jeecg/JVxeTable/types.ts
@@ -1,6 +1,6 @@
-import JVxeTable from './src/JVxeTable'
+import JVxeTable from './src/JVxeTable';
 
-export type { JVxeComponent } from './src/types/JVxeComponent'
-export type { JVxeColumn, JVxeLinkageConfig } from './src/types'
-export { JVxeTypes } from './src/types/JVxeTypes'
-export type JVxeTableInstance = InstanceType<typeof JVxeTable>
\ No newline at end of file
+export type { JVxeComponent } from './src/types/JVxeComponent';
+export type { JVxeColumn, JVxeLinkageConfig } from './src/types';
+export { JVxeTypes } from './src/types/JVxeTypes';
+export type JVxeTableInstance = InstanceType<typeof JVxeTable>;
diff --git a/src/components/jeecg/JVxeTable/utils.ts b/src/components/jeecg/JVxeTable/utils.ts
index af259f8..edd3e2c 100644
--- a/src/components/jeecg/JVxeTable/utils.ts
+++ b/src/components/jeecg/JVxeTable/utils.ts
@@ -1 +1 @@
-export { dispatchEvent, vModel } from './src/utils/enhancedUtils'
\ No newline at end of file
+export { dispatchEvent, vModel } from './src/utils/enhancedUtils';
diff --git a/src/components/jeecg/OnLine/JPopupOnlReport.vue b/src/components/jeecg/OnLine/JPopupOnlReport.vue
index f7a3df0..df84be3 100644
--- a/src/components/jeecg/OnLine/JPopupOnlReport.vue
+++ b/src/components/jeecg/OnLine/JPopupOnlReport.vue
@@ -3,48 +3,47 @@
     <div class="jeecg-basic-table-form-container" v-if="showSearchFlag">
       <a-form ref="formRef" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol" @keyup.enter.native="searchQuery">
         <a-row :gutter="24">
-          <template v-for="(item,index) in queryInfo">
-            <template v-if=" item.hidden==='1' ">
-              <a-col :md="8" :sm="24" :key=" 'query'+index " v-show="toggleSearchStatus">
+          <template v-for="(item, index) in queryInfo">
+            <template v-if="item.hidden === '1'">
+              <a-col :md="8" :sm="24" :key="'query' + index" v-show="toggleSearchStatus">
                 <SearchFormItem :formElRef="formRef" :queryParam="queryParam" :item="item" :dictOptions="dictOptions"></SearchFormItem>
               </a-col>
             </template>
             <template v-else>
-              <a-col :md="8" :sm="24" :key=" 'query'+index ">
+              <a-col :md="8" :sm="24" :key="'query' + index">
                 <SearchFormItem :formElRef="formRef" :queryParam="queryParam" :item="item" :dictOptions="dictOptions"></SearchFormItem>
               </a-col>
             </template>
           </template>
 
           <a-col :md="8" :sm="8">
-                           <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
-                                <a-col :lg="6">
-                                  <a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset">重置</a-button>
-                                  <a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery" style="margin-left: 8px">查询</a-button>
-                                  <a @click="handleToggleSearch" style="margin-left: 8px">
-                                    {{ toggleSearchStatus ? '收起' : '展开' }}
-                                    <Icon :icon="toggleSearchStatus ? 'ant-design:up-outlined' : 'ant-design:down-outlined'"/>
-                                  </a>
-                                </a-col>
-                           </span>
+            <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
+              <a-col :lg="6">
+                <a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset">重置</a-button>
+                <a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery" style="margin-left: 8px">查询</a-button>
+                <a @click="handleToggleSearch" style="margin-left: 8px">
+                  {{ toggleSearchStatus ? '收起' : '展开' }}
+                  <Icon :icon="toggleSearchStatus ? 'ant-design:up-outlined' : 'ant-design:down-outlined'" />
+                </a>
+              </a-col>
+            </span>
           </a-col>
-
         </a-row>
       </a-form>
     </div>
     <BasicTable
-            ref="tableRef"
-            :canResize="true"
-            :bordered="true"
-            :loading="loading"
-            :rowKey="combineRowKey"
-            :columns="columns"
-            :showIndexColumn="false"
-            :dataSource="dataSource"
-            :pagination="pagination"
-            :rowSelection="rowSelection"
-            @row-click="clickThenCheck"
-            @change="handleChangeInTable"
+      ref="tableRef"
+      :canResize="true"
+      :bordered="true"
+      :loading="loading"
+      :rowKey="combineRowKey"
+      :columns="columns"
+      :showIndexColumn="false"
+      :dataSource="dataSource"
+      :pagination="pagination"
+      :rowSelection="rowSelection"
+      @row-click="clickThenCheck"
+      @change="handleChangeInTable"
     >
       <template #tableTitle>
         <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
@@ -53,9 +52,8 @@
 
     <!-- 跳转Href的动态组件方式 -->
     <a-modal v-bind="hrefComponent.model" v-on="hrefComponent.on">
-      <component :is="hrefComponent.is" v-bind="hrefComponent.params"/>
+      <component :is="hrefComponent.is" v-bind="hrefComponent.params" />
     </a-modal>
-
   </div>
 </template>
 
@@ -72,7 +70,7 @@
       SearchFormItem: createAsyncComponent(() => import('/@/components/jeecg/OnLine/SearchFormItem.vue'), { loading: true }),
       BasicTable: createAsyncComponent(() => import('/@/components/Table/src/BasicTable.vue'), { loading: true }),
     },
-    props: ['multi', 'code','id', 'sorter', 'groupId', 'param', 'clickToRowSelect'],
+    props: ['multi', 'code', 'id', 'sorter', 'groupId', 'param', 'clickToRowSelect'],
     emits: ['ok', 'register'],
     setup(props, { emit, refs }) {
       const { createMessage } = useMessage();
@@ -90,8 +88,10 @@
       const attrs = useAttrs();
       const tableScroll = ref({ x: true });
       const getBindValue = Object.assign({}, unref(props), unref(attrs));
-      const [{ visibleChange, loadColumnsInfo, dynamicParamHandler, loadData,loadColumnsAndData, handleChangeInTable, combineRowKey, clickThenCheck, filterUnuseSelect, handleExport },
-        { hrefComponent,visible, rowSelection, checkedKeys, selectRows, pagination, dataSource, columns, loading, title, iSorter, queryInfo, queryParam, dictOptions }] = usePopBiz(getBindValue);
+      const [
+        { visibleChange, loadColumnsInfo, dynamicParamHandler, loadData, loadColumnsAndData, handleChangeInTable, combineRowKey, clickThenCheck, filterUnuseSelect, handleExport },
+        { hrefComponent, visible, rowSelection, checkedKeys, selectRows, pagination, dataSource, columns, loading, title, iSorter, queryInfo, queryParam, dictOptions },
+      ] = usePopBiz(getBindValue);
 
       const showSearchFlag = computed(() => unref(queryInfo) && unref(queryInfo).length > 0);
       /**
@@ -102,7 +102,7 @@
         () => {
           loadColumnsAndData();
         },
-        {immediate: true}
+        { immediate: true }
       );
       /**
        *监听popup动态参数 支持系统变量语法
@@ -114,7 +114,7 @@
             dynamicParamHandler();
             //loadData();
           }
-        },
+        }
       );
       /**
        *监听sorter排序字段
@@ -125,7 +125,7 @@
           if (arr.length === 2 && ['asc', 'desc'].includes(arr[1].toLowerCase())) {
             iSorter.value = { column: arr[0], order: arr[1].toLowerCase() };
             // 排序字段受控
-            unref(columns).forEach(col => {
+            unref(columns).forEach((col) => {
               if (col.dataIndex === unref(iSorter).column) {
                 col['sortOrder'] = unref(iSorter).order === 'asc' ? 'ascend' : 'descend';
               } else {
@@ -142,12 +142,11 @@
         toggleSearchStatus.value = !unref(toggleSearchStatus);
       }
 
-
       /**
        * 导出excel
        */
       function onExportXls() {
-        handleExport!()
+        handleExport!();
       }
 
       /**
@@ -195,7 +194,7 @@
         handleToggleSearch,
         searchQuery,
         searchReset,
-        onExportXls
+        onExportXls,
       };
     },
   });
diff --git a/src/components/jeecg/OnLine/SearchFormItem.vue b/src/components/jeecg/OnLine/SearchFormItem.vue
index 068fa0f..8171f50 100644
--- a/src/components/jeecg/OnLine/SearchFormItem.vue
+++ b/src/components/jeecg/OnLine/SearchFormItem.vue
@@ -1,142 +1,138 @@
 <template>
-    <a-form-item v-if="item.view===DateTypeEnum.Date" :labelCol="labelCol" :class="'jeecg-online-search'" >
-        <template #label>
-            <span :title="item.label" class="label-text">{{ item.label }}</span>
-        </template>
-        <template v-if="single_mode===item.mode">
-            <a-date-picker :showTime="false" valueFormat="YYYY-MM-DD" :placeholder=" '请选择'+item.label " v-model:value="queryParam[item.field]"></a-date-picker>
-        </template>
-        <template v-else>
-            <a-date-picker :showTime="false" valueFormat="YYYY-MM-DD" placeholder="开始日期" v-model:value="queryParam[item.field+'_begin']" style="width: calc(50% - 15px);"></a-date-picker>
-            <span class="group-query-strig">~</span>
-            <a-date-picker :showTime="false" valueFormat="YYYY-MM-DD" placeholder="结束日期" v-model:value="queryParam[item.field+'_end']" style="width: calc(50% - 15px);"></a-date-picker>
-        </template>
-    </a-form-item>
+  <a-form-item v-if="item.view === DateTypeEnum.Date" :labelCol="labelCol" :class="'jeecg-online-search'">
+    <template #label>
+      <span :title="item.label" class="label-text">{{ item.label }}</span>
+    </template>
+    <template v-if="single_mode === item.mode">
+      <a-date-picker :showTime="false" valueFormat="YYYY-MM-DD" :placeholder="'请选择' + item.label" v-model:value="queryParam[item.field]"></a-date-picker>
+    </template>
+    <template v-else>
+      <a-date-picker :showTime="false" valueFormat="YYYY-MM-DD" placeholder="开始日期" v-model:value="queryParam[item.field + '_begin']" style="width: calc(50% - 15px)"></a-date-picker>
+      <span class="group-query-strig">~</span>
+      <a-date-picker :showTime="false" valueFormat="YYYY-MM-DD" placeholder="结束日期" v-model:value="queryParam[item.field + '_end']" style="width: calc(50% - 15px)"></a-date-picker>
+    </template>
+  </a-form-item>
 
-    <a-form-item v-else-if="item.view===DateTypeEnum.Datetime" :labelCol="labelCol" :class="'jeecg-online-search'">
-        <template #label :title="item.label">
-            <span :title="item.label" class="label-text">{{ item.label }}</span>
-        </template>
-        <template v-if="single_mode===item.mode">
-            <a-date-picker :placeholder=" '请选择'+item.label " :show-time="true" valueFormat="YYYY-MM-DD HH:mm:ss" v-model:value="queryParam[item.field]"></a-date-picker>
-        </template>
-        <template v-else>
-            <a-date-picker placeholder="1选择开始时间" :show-time="true" valueFormat="YYYY-MM-DD HH:mm:ss" v-model:value="queryParam[item.field+'_begin']" style="width: calc(50% - 9px);min-width: 60px;"></a-date-picker>
-            <span class="group-query-strig" style="width: auto;padding: 0 4px;">~</span>
-            <a-date-picker placeholder="2选择结束时间" :show-time="true" valueFormat="YYYY-MM-DD HH:mm:ss" v-model:value="queryParam[item.field+'_end']" style="width: calc(50% - 9px);min-width: 60px;"></a-date-picker>
-        </template>
-    </a-form-item>
+  <a-form-item v-else-if="item.view === DateTypeEnum.Datetime" :labelCol="labelCol" :class="'jeecg-online-search'">
+    <template #label :title="item.label">
+      <span :title="item.label" class="label-text">{{ item.label }}</span>
+    </template>
+    <template v-if="single_mode === item.mode">
+      <a-date-picker :placeholder="'请选择' + item.label" :show-time="true" valueFormat="YYYY-MM-DD HH:mm:ss" v-model:value="queryParam[item.field]"></a-date-picker>
+    </template>
+    <template v-else>
+      <a-date-picker
+        placeholder="1选择开始时间"
+        :show-time="true"
+        valueFormat="YYYY-MM-DD HH:mm:ss"
+        v-model:value="queryParam[item.field + '_begin']"
+        style="width: calc(50% - 9px); min-width: 60px"
+      ></a-date-picker>
+      <span class="group-query-strig" style="width: auto; padding: 0 4px">~</span>
+      <a-date-picker
+        placeholder="2选择结束时间"
+        :show-time="true"
+        valueFormat="YYYY-MM-DD HH:mm:ss"
+        v-model:value="queryParam[item.field + '_end']"
+        style="width: calc(50% - 9px); min-width: 60px"
+      ></a-date-picker>
+    </template>
+  </a-form-item>
 
-    <a-form-item v-else-if="item.view===DateTypeEnum.Time" :labelCol="labelCol" :class="'jeecg-online-search'">
-        <template #label>
-            <span :title="item.label" class="label-text">{{ item.label }}</span>
-        </template>
-        <template v-if="single_mode===item.mode">
-            <a-date-picker :placeholder=" '请选择'+item.label " mode="time" valueFormat="HH:mm:ss" v-model:value="queryParam[item.field]"></a-date-picker>
-        </template>
-        <template v-else>
-            <a-date-picker placeholder="请选择开始时间" mode="time" valueFormat="HH:mm:ss" v-model:value="queryParam[item.field+'_begin']" style="width: calc(50% - 15px);"></a-date-picker>
-            <span class="group-query-strig">~</span>
-            <a-date-picker placeholder="请选择结束时间" mode="time" valueFormat="HH:mm:ss" v-model:value="queryParam[item.field+'_end']" style="width: calc(50% - 15px);"></a-date-picker>
-        </template>
-    </a-form-item>
+  <a-form-item v-else-if="item.view === DateTypeEnum.Time" :labelCol="labelCol" :class="'jeecg-online-search'">
+    <template #label>
+      <span :title="item.label" class="label-text">{{ item.label }}</span>
+    </template>
+    <template v-if="single_mode === item.mode">
+      <a-date-picker :placeholder="'请选择' + item.label" mode="time" valueFormat="HH:mm:ss" v-model:value="queryParam[item.field]"></a-date-picker>
+    </template>
+    <template v-else>
+      <a-date-picker placeholder="请选择开始时间" mode="time" valueFormat="HH:mm:ss" v-model:value="queryParam[item.field + '_begin']" style="width: calc(50% - 15px)"></a-date-picker>
+      <span class="group-query-strig">~</span>
+      <a-date-picker placeholder="请选择结束时间" mode="time" valueFormat="HH:mm:ss" v-model:value="queryParam[item.field + '_end']" style="width: calc(50% - 15px)"></a-date-picker>
+    </template>
+  </a-form-item>
 
-    <a-form-item v-else-if=" item.view===CompTypeEnum.List || item.view===CompTypeEnum.Radio || item.view===CompTypeEnum.Switch" :labelCol="labelCol" :class="'jeecg-online-search'">
-        <template #label>
-            <span :title="item.label" class="label-text">{{ item.label }}</span>
-        </template>
-        <JDictSelectTag
-                v-if="item.config==='1'"
-                :placeholder=" '请选择'+item.label "
-                v-model="queryParam[item.field]"
-                :dictCode="getDictCode(item)">
-        </JDictSelectTag>
-        <a-select v-else :placeholder=" '请选择'+item.label " v-model:value="queryParam[item.field]">
-            <template v-for="(obj,index) in dictOptions[getDictOptionKey(item)]" :key="index" >
-                <a-select-option :value="obj.value"> {{ obj.text }}</a-select-option>
-            </template>
-        </a-select>
-    </a-form-item>
+  <a-form-item v-else-if="item.view === CompTypeEnum.List || item.view === CompTypeEnum.Radio || item.view === CompTypeEnum.Switch" :labelCol="labelCol" :class="'jeecg-online-search'">
+    <template #label>
+      <span :title="item.label" class="label-text">{{ item.label }}</span>
+    </template>
+    <JDictSelectTag v-if="item.config === '1'" :placeholder="'请选择' + item.label" v-model="queryParam[item.field]" :dictCode="getDictCode(item)"> </JDictSelectTag>
+    <a-select v-else :placeholder="'请选择' + item.label" v-model:value="queryParam[item.field]">
+      <template v-for="(obj, index) in dictOptions[getDictOptionKey(item)]" :key="index">
+        <a-select-option :value="obj.value"> {{ obj.text }}</a-select-option>
+      </template>
+    </a-select>
+  </a-form-item>
 
-    <a-form-item v-else-if=" item.view===CompTypeEnum.SelTree " :labelCol="labelCol" :class="'jeecg-online-search'">
-        <template #label>
-            <span :title="item.label" class="label-text">{{ item.label }}</span>
-        </template>
-        <JTreeSelect
-                :placeholder=" '请选择'+item.label "
-                v-model:value="queryParam[item.field]"
-                :dict="item.dict"
-                :pidField="item.pidField"
-                :pidValue="item.pidValue"
-                :hasChildField="item.hasChildField"
-                load-triggle-change>
-        </JTreeSelect>
-    </a-form-item>
+  <a-form-item v-else-if="item.view === CompTypeEnum.SelTree" :labelCol="labelCol" :class="'jeecg-online-search'">
+    <template #label>
+      <span :title="item.label" class="label-text">{{ item.label }}</span>
+    </template>
+    <JTreeSelect
+      :placeholder="'请选择' + item.label"
+      v-model:value="queryParam[item.field]"
+      :dict="item.dict"
+      :pidField="item.pidField"
+      :pidValue="item.pidValue"
+      :hasChildField="item.hasChildField"
+      load-triggle-change
+    >
+    </JTreeSelect>
+  </a-form-item>
 
-    <a-form-item v-else-if=" item.view===CompTypeEnum.CatTree " :labelCol="labelCol" :class="'jeecg-online-search'">
-        <template #label>
-            <span :title="item.label" class="label-text">{{ item.label }}</span>
-        </template>
-        <JCategorySelect :pcode="item.pcode" v-model:value="queryParam[item.field]" :placeholder=" '请选择'+item.label "/>
-    </a-form-item>
+  <a-form-item v-else-if="item.view === CompTypeEnum.CatTree" :labelCol="labelCol" :class="'jeecg-online-search'">
+    <template #label>
+      <span :title="item.label" class="label-text">{{ item.label }}</span>
+    </template>
+    <JCategorySelect :pcode="item.pcode" v-model:value="queryParam[item.field]" :placeholder="'请选择' + item.label" />
+  </a-form-item>
 
-    <a-form-item v-else-if=" item.view===CompTypeEnum.SelSearch" :labelCol="labelCol" :class="'jeecg-online-search'">
-        <template #label>
-            <span :title="item.label" class="label-text">{{ item.label }}</span>
-        </template>
-        <JDictSelectTag
-                v-if="item.config==='1'"
-                v-model:value="queryParam[item.field]"
-                :placeholder=" '请选择'+item.label "
-                :dict="getDictCode(item)">
-        </JDictSelectTag>
-        <!--TODO 新需要的组件-->
-       <!-- <j-online-search-select
+  <a-form-item v-else-if="item.view === CompTypeEnum.SelSearch" :labelCol="labelCol" :class="'jeecg-online-search'">
+    <template #label>
+      <span :title="item.label" class="label-text">{{ item.label }}</span>
+    </template>
+    <JDictSelectTag v-if="item.config === '1'" v-model:value="queryParam[item.field]" :placeholder="'请选择' + item.label" :dict="getDictCode(item)"> </JDictSelectTag>
+    <!--TODO 新需要的组件-->
+    <!-- <j-online-search-select
                 v-else
                 :ref="item.field+'_search'"
                 v-model="queryParam[item.field]"
                 :placeholder=" '请选择'+item.label "
                 :sql="getSqlByDictCode(item)">
         </j-online-search-select>-->
+  </a-form-item>
 
-    </a-form-item>
+  <a-form-item v-else-if="item.view === CompTypeEnum.SelUser" :labelCol="labelCol" :class="'jeecg-online-search'">
+    <template #label>
+      <span :title="item.label" class="label-text">{{ item.label }}</span>
+    </template>
+    <JSelectUserByDept v-model:value="queryParam[item.field]" :placeholder="'请选择' + item.label"></JSelectUserByDept>
+  </a-form-item>
 
-    <a-form-item v-else-if=" item.view===CompTypeEnum.SelUser" :labelCol="labelCol" :class="'jeecg-online-search'">
-        <template #label>
-            <span :title="item.label" class="label-text">{{ item.label }}</span>
-        </template>
-        <JSelectUserByDept v-model:value="queryParam[item.field]" :placeholder=" '请选择'+item.label " ></JSelectUserByDept>
-    </a-form-item>
+  <a-form-item v-else-if="item.view == CompTypeEnum.SelDepart" :labelCol="labelCol" :class="'jeecg-online-search'">
+    <template #label>
+      <span :title="item.label" class="label-text">{{ item.label }}</span>
+    </template>
+    <JSelectDept v-model:value="queryParam[item.field]" :placeholder="'请选择' + item.label" />
+  </a-form-item>
 
-    <a-form-item v-else-if=" item.view==CompTypeEnum.SelDepart" :labelCol="labelCol" :class="'jeecg-online-search'">
-        <template #label>
-            <span :title="item.label" class="label-text">{{ item.label }}</span>
-        </template>
-        <JSelectDept v-model:value="queryParam[item.field]" :placeholder=" '请选择'+item.label "/>
-    </a-form-item>
+  <a-form-item v-else-if="item.view === CompTypeEnum.Popup" :labelCol="labelCol" :class="'jeecg-online-search'">
+    <template #label>
+      <span :title="item.label" class="label-text">{{ item.label }}</span>
+    </template>
+    <JPopup :placeholder="'请选择' + item.label" v-model:value="queryParam[item.field]" :formElRef="formElRef" :code="item.dictTable" :field-config="item.dictCode" :multi="true" />
+  </a-form-item>
 
-    <a-form-item v-else-if=" item.view===CompTypeEnum.Popup" :labelCol="labelCol" :class="'jeecg-online-search'">
-        <template #label>
-            <span :title="item.label" class="label-text">{{ item.label }}</span>
-        </template>
-        <JPopup
-            :placeholder=" '请选择'+item.label "
-            v-model:value="queryParam[item.field]"
-            :formElRef="formElRef"
-            :code="item.dictTable"
-            :field-config="item.dictCode"
-            :multi="true"/>
-    </a-form-item>
-
-    <a-form-item v-else-if=" item.view=== CompTypeEnum.Pca" :labelCol="labelCol" :class="'jeecg-online-search'">
-        <template #label>
-            <span :title="item.label" class="label-text">{{ item.label }}</span>
-        </template>
-        <JAreaLinkage :placeholder=" '请选择'+item.label " v-model:value="queryParam[item.field]"/>
-    </a-form-item>
-    <!--TODO 缺少的组件-->
-    <a-form-item v-else-if=" item.view===CompTypeEnum.Checkbox || item.view===CompTypeEnum.ListMulti" :labelCol="labelCol" :label="item.label" :class="'jeecg-online-search'">
-       <!-- <j-select-multiple
+  <a-form-item v-else-if="item.view === CompTypeEnum.Pca" :labelCol="labelCol" :class="'jeecg-online-search'">
+    <template #label>
+      <span :title="item.label" class="label-text">{{ item.label }}</span>
+    </template>
+    <JAreaLinkage :placeholder="'请选择' + item.label" v-model:value="queryParam[item.field]" />
+  </a-form-item>
+  <!--TODO 缺少的组件-->
+  <a-form-item v-else-if="item.view === CompTypeEnum.Checkbox || item.view === CompTypeEnum.ListMulti" :labelCol="labelCol" :label="item.label" :class="'jeecg-online-search'">
+    <!-- <j-select-multiple
                 v-if="item.config==='1'"
                 :placeholder=" '请选择'+item.label "
                 v-model="queryParam[item.field]"
@@ -148,142 +144,128 @@
                 :options="dictOptions[item.dbField]"
                 v-model="queryParam[item.field]">
         </j-select-multiple>-->
-    </a-form-item>
-
-    <a-form-item v-else :labelCol="labelCol" :class="'jeecg-online-search'">
-        <template #label>
-            <span :title="item.label" class="label-text">{{ item.label }}</span>
-        </template>
-        <template v-if="single_mode===item.mode">
-            <a-input :placeholder=" '请输入'+item.label " v-model:value="queryParam[item.field]"></a-input>
-        </template>
-        <template v-else>
-            <a-input :placeholder=" '请输入开始'+item.label " v-model:value="queryParam[item.field+'_begin']" style="width: calc(50% - 15px);"></a-input>
-            <span class="group-query-strig">~</span>
-            <a-input :placeholder=" '请输入结束'+item.label " v-model:value="queryParam[item.field+'_end']" style="width: calc(50% - 15px);"></a-input>
-        </template>
-    </a-form-item>
+  </a-form-item>
 
+  <a-form-item v-else :labelCol="labelCol" :class="'jeecg-online-search'">
+    <template #label>
+      <span :title="item.label" class="label-text">{{ item.label }}</span>
+    </template>
+    <template v-if="single_mode === item.mode">
+      <a-input :placeholder="'请输入' + item.label" v-model:value="queryParam[item.field]"></a-input>
+    </template>
+    <template v-else>
+      <a-input :placeholder="'请输入开始' + item.label" v-model:value="queryParam[item.field + '_begin']" style="width: calc(50% - 15px)"></a-input>
+      <span class="group-query-strig">~</span>
+      <a-input :placeholder="'请输入结束' + item.label" v-model:value="queryParam[item.field + '_end']" style="width: calc(50% - 15px)"></a-input>
+    </template>
+  </a-form-item>
 </template>
 
 <script lang="ts">
-    //import JOnlineSearchSelect from '@/components/online/autoform/comp/JOnlineSearchSelect'
-    import {defineComponent, ref} from 'vue';
-    import {DateTypeEnum} from '/@/enums/DateTypeEnum.ts';
-    import {CompTypeEnum} from '/@/enums/CompTypeEnum.ts';
-    import {
-        JDictSelectTag,
-        JTreeSelect,
-        JCategorySelect,
-        JSelectUserByDept,
-        JSelectDept,
-        JPopup,
-        JAreaLinkage
-    } from '/@/components/Form'
-    export default defineComponent({
-        name: 'JPopupOnlReport',
-        components: {
-            //JOnlineSearchSelect
-            JDictSelectTag,
-            JTreeSelect,
-            JCategorySelect,
-            JSelectUserByDept,
-            JSelectDept,
-            JPopup,
-            JAreaLinkage
-        },
-        props: {
-            formElRef: {
-                type: Object,
-                default: () => {
-                },
-            },
-            item: {
-                type: Object,
-                default: () => {
-                },
-                required: true
-            },
-            dictOptions: {
-                type: Object,
-                default: () => {
-                },
-                required: true
-            },
-            queryParam: {
-                type: Object,
-                default: () => {
-                },
-                required: true
-            }
-        },
-        setup(props) {
-            const single_mode = ref("single");
-            console.log("dictOptions===>",props.dictOptions)
-            function getDictCode(item) {
-                if (item.dictTable && item.dictTable.length > 0) {
-                    return item.dictTable + ',' + item.dictText + ',' + item.dictCode
-                } else {
-                    return item.dictCode
-                }
-            }
-
-            function getSqlByDictCode(item) {
-                let {dictTable, dictCode, dictText} = item;
-                let temp = dictTable.toLowerCase();
-                let arr = temp.split('where');
-                let condition = '';
-                if (arr.length > 1) {
-                    condition = ' where' + arr[1]
-                }
-                let sql = "select " + dictCode + " as 'value', " + dictText + " as 'text' from " + arr[0] + condition;
-                console.log('sql', sql);
-                return sql;
-            }
-
-            function getDictOptionKey(item) {
-                if(item.dbField){
-                  return item.dbField
-                }else{
-                  return item.field
-                }
-            }
-
-            // 定义查询条件 文本label的最大宽度 比起单纯的控制字体个数更好
-            const labelTextMaxWidth = '120px'
-            const labelCol = {
-              style:{
-                'max-width': labelTextMaxWidth
-              }
-            }
-            return {labelTextMaxWidth, labelCol, single_mode,getDictOptionKey,getDictCode, getSqlByDictCode,DateTypeEnum,CompTypeEnum}
+  //import JOnlineSearchSelect from '@/components/online/autoform/comp/JOnlineSearchSelect'
+  import { defineComponent, ref } from 'vue';
+  import { DateTypeEnum } from '/@/enums/DateTypeEnum.ts';
+  import { CompTypeEnum } from '/@/enums/CompTypeEnum.ts';
+  import { JDictSelectTag, JTreeSelect, JCategorySelect, JSelectUserByDept, JSelectDept, JPopup, JAreaLinkage } from '/@/components/Form';
+  export default defineComponent({
+    name: 'JPopupOnlReport',
+    components: {
+      //JOnlineSearchSelect
+      JDictSelectTag,
+      JTreeSelect,
+      JCategorySelect,
+      JSelectUserByDept,
+      JSelectDept,
+      JPopup,
+      JAreaLinkage,
+    },
+    props: {
+      formElRef: {
+        type: Object,
+        default: () => {},
+      },
+      item: {
+        type: Object,
+        default: () => {},
+        required: true,
+      },
+      dictOptions: {
+        type: Object,
+        default: () => {},
+        required: true,
+      },
+      queryParam: {
+        type: Object,
+        default: () => {},
+        required: true,
+      },
+    },
+    setup(props) {
+      const single_mode = ref('single');
+      console.log('dictOptions===>', props.dictOptions);
+      function getDictCode(item) {
+        if (item.dictTable && item.dictTable.length > 0) {
+          return item.dictTable + ',' + item.dictText + ',' + item.dictCode;
+        } else {
+          return item.dictCode;
         }
-    })
+      }
 
+      function getSqlByDictCode(item) {
+        let { dictTable, dictCode, dictText } = item;
+        let temp = dictTable.toLowerCase();
+        let arr = temp.split('where');
+        let condition = '';
+        if (arr.length > 1) {
+          condition = ' where' + arr[1];
+        }
+        let sql = 'select ' + dictCode + " as 'value', " + dictText + " as 'text' from " + arr[0] + condition;
+        console.log('sql', sql);
+        return sql;
+      }
+
+      function getDictOptionKey(item) {
+        if (item.dbField) {
+          return item.dbField;
+        } else {
+          return item.field;
+        }
+      }
+
+      // 定义查询条件 文本label的最大宽度 比起单纯的控制字体个数更好
+      const labelTextMaxWidth = '120px';
+      const labelCol = {
+        style: {
+          'max-width': labelTextMaxWidth,
+        },
+      };
+      return { labelTextMaxWidth, labelCol, single_mode, getDictOptionKey, getDictCode, getSqlByDictCode, DateTypeEnum, CompTypeEnum };
+    },
+  });
 </script>
 
 <style lang="less" scoped>
-    .group-query-strig {
-        width: 30px;
-        text-align: center;
-        display: inline-block;
-    }
+  .group-query-strig {
+    width: 30px;
+    text-align: center;
+    display: inline-block;
+  }
 
-    /* 查询条件左对齐样式设置 */
-    .jeecg-online-search ::v-deep .ant-form-item-label{
-        flex: 0 0 auto !important;
-        width: auto;
-    }
-    .jeecg-online-search ::v-deep .ant-form-item-control{
-        max-width: 100%;
-    }
+  /* 查询条件左对齐样式设置 */
+  .jeecg-online-search ::v-deep .ant-form-item-label {
+    flex: 0 0 auto !important;
+    width: auto;
+  }
+  .jeecg-online-search ::v-deep .ant-form-item-control {
+    max-width: 100%;
+  }
 
-    /* label显示宽度 超出显示... */
-    .jeecg-online-search ::v-deep .label-text{
-        max-width: v-bind(labelTextMaxWidth);
-        overflow: hidden;
-        white-space: nowrap;
-        text-overflow: ellipsis;
-        overflow-wrap: break-word;
-    }
+  /* label显示宽度 超出显示... */
+  .jeecg-online-search ::v-deep .label-text {
+    max-width: v-bind(labelTextMaxWidth);
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow-wrap: break-word;
+  }
 </style>
diff --git a/src/components/jeecg/OnLine/hooks/usePopBiz.ts b/src/components/jeecg/OnLine/hooks/usePopBiz.ts
index aa7ec7f..348c7c5 100644
--- a/src/components/jeecg/OnLine/hooks/usePopBiz.ts
+++ b/src/components/jeecg/OnLine/hooks/usePopBiz.ts
@@ -1,283 +1,281 @@
-import {reactive, ref, unref, defineAsyncComponent } from "vue";
-import {httpGroupRequest} from "/@/components/Form/src/utils/GroupRequest";
-import {defHttp} from '/@/utils/http/axios';
-import {filterMultiDictText} from '/@/utils/dict/JDictSelectUtil.js';
-import {useMessage} from '/@/hooks/web/useMessage';
-import { OnlineColumn } from '/@/components/jeecg/OnLine/types/onlineConfig'
-import { h } from 'vue'
+import { reactive, ref, unref, defineAsyncComponent } from 'vue';
+import { httpGroupRequest } from '/@/components/Form/src/utils/GroupRequest';
+import { defHttp } from '/@/utils/http/axios';
+import { filterMultiDictText } from '/@/utils/dict/JDictSelectUtil.js';
+import { useMessage } from '/@/hooks/web/useMessage';
+import { OnlineColumn } from '/@/components/jeecg/OnLine/types/onlineConfig';
+import { h } from 'vue';
 import { useRouter } from 'vue-router';
-import {useMethods} from '/@/hooks/system/useMethods';
+import { useMethods } from '/@/hooks/system/useMethods';
 
-export function usePopBiz(props,tableRef?) {
+export function usePopBiz(props, tableRef?) {
+  const { createMessage } = useMessage();
+  //弹窗可视状态
+  const visible = ref(false);
+  //表格加载
+  const loading = ref(false);
+  //cgRpConfigId
+  const cgRpConfigId = ref('');
+  //标题
+  const title = ref('列表');
+  // 排序字段，默认无排序
+  const iSorter = ref<any>('');
+  // 查询对象
+  const queryInfo = ref([]);
+  // 查询参数
+  const queryParam = ref<any>({});
+  // 动态参数
+  const dynamicParam = ref<any>({});
+  //字典配置项
+  const dictOptions = ref({});
+  //数据集
+  const dataSource = ref<Array<object>>([]);
+  //定义表格信息
+  const columns = ref<Array<object>>([]);
+  //定义请求url信息
+  const configUrl = reactive({
+    //列表页加载column和data
+    getColumnsAndData: '/online/cgreport/api/getColumnsAndData/',
+    getColumns: '/online/cgreport/api/getRpColumns/',
+    getData: '/online/cgreport/api/getData/',
+    getQueryInfo: '/online/cgreport/api/getQueryInfo/',
+    export: '/online/cgreport/api/exportXls/',
+  });
+  //已选择的值
+  const checkedKeys = ref<Array<string | number>>([]);
+  //选择的行记录
+  const selectRows = ref<Array<any>>([]);
+  // 点击单元格选中行 popup需要 但是报表预览不需要
+  let clickThenCheckFlag = true;
+  if (props.clickToRowSelect === false) {
+    clickThenCheckFlag = false;
+  }
 
-    const {createMessage} = useMessage();
-    //弹窗可视状态
-    const visible = ref(false);
-    //表格加载
-    const loading = ref(false);
-    //cgRpConfigId
-    const cgRpConfigId = ref('');
-    //标题
-    const title = ref('列表');
-    // 排序字段，默认无排序
-    const iSorter = ref<any>('');
-    // 查询对象
-    const queryInfo = ref([]);
-    // 查询参数
-    const queryParam = ref<any>({});
-    // 动态参数
-    const dynamicParam = ref<any>({});
-    //字典配置项
-    const dictOptions = ref({});
-    //数据集
-    const dataSource = ref<Array<object>>([]);
-    //定义表格信息
-    const columns = ref<Array<object>>([]);
-    //定义请求url信息
-    const configUrl = reactive({
-        //列表页加载column和data
-        getColumnsAndData: '/online/cgreport/api/getColumnsAndData/',
-        getColumns: '/online/cgreport/api/getRpColumns/',
-        getData: '/online/cgreport/api/getData/',
-        getQueryInfo: '/online/cgreport/api/getQueryInfo/',
-        export: '/online/cgreport/api/exportXls/'
-    });
-    //已选择的值
-    const checkedKeys = ref<Array<string | number>>([]);
-    //选择的行记录
-    const selectRows = ref<Array<any>>([]);
-    // 点击单元格选中行 popup需要 但是报表预览不需要
-    let clickThenCheckFlag = true
-    if(props.clickToRowSelect===false){
-      clickThenCheckFlag = false
-    }
+  /**
+   * 选择列配置
+   */
+  const rowSelection = {
+    fixed: true,
+    selectedRowKeys: checkedKeys,
+    selectionRows: selectRows,
+    onChange: onSelectChange,
+  };
 
-    /**
-     * 选择列配置
-     */
-    const rowSelection = {
-        fixed: true,
-        selectedRowKeys: checkedKeys,
-        selectionRows: selectRows,
-        onChange: onSelectChange
-    }
+  /**
+   * 序号列配置
+   */
+  const indexColumnProps = {
+    dataIndex: 'index',
+    width: '15px',
+  };
+  /**
+   * 分页配置
+   */
+  const pagination = reactive({
+    current: 1,
+    pageSize: 10,
+    pageSizeOptions: ['10', '20', '30'],
+    // showTotal: (total, range) => {
+    //     return range[0] + '-' + range[1] + ' 共' + total + '条'
+    // },
+    showQuickJumper: true,
+    showSizeChanger: true,
+    total: 0,
+    // 合计逻辑 [待优化 3.0]
+    showTotal: (total) => onShowTotal(total),
+    realPageSize: 10,
+    realTotal: 0,
+    // 是否有合计列，默认为""，在第一次获取到数据之后会设计为ture或者false
+    isTotal: <string | boolean>'',
+    onShowSizeChange: (current, pageSize) => onSizeChange(current, pageSize),
+  });
 
-    /**
-     * 序号列配置
-     */
-    const indexColumnProps = {
-        dataIndex: 'index',
-        width: '15px',
-    };
-    /**
-     * 分页配置
-     */
-    const pagination = reactive({
-        current: 1,
-        pageSize: 10,
-        pageSizeOptions: ['10', '20', '30'],
-        // showTotal: (total, range) => {
-        //     return range[0] + '-' + range[1] + ' 共' + total + '条'
-        // },
-        showQuickJumper: true,
-        showSizeChanger: true,
-        total: 0,
-        // 合计逻辑 [待优化 3.0]
-        showTotal: (total) => onShowTotal(total),
-        realPageSize: 10,
-        realTotal: 0,
-        // 是否有合计列，默认为""，在第一次获取到数据之后会设计为ture或者false
-        isTotal: <string | boolean> '',
-        onShowSizeChange: (current, pageSize) => onSizeChange(current, pageSize)
-    });
-
-    /**
-     * 表格选择事件
-     * @param selectedRowKeys
-     * @param selectRow
-     */
-    function onSelectChange(selectedRowKeys: (string | number)[]) {
-        if (!selectedRowKeys || selectedRowKeys.length == 0) {
-            selectRows.value = []
-        } else {
-            for (let i = 0; i < selectedRowKeys.length; i++) {
-                let combineKey = combineRowKey(getRowByKey(selectedRowKeys[i]));
-                let keys = unref(checkedKeys);
-                if (combineKey && keys.indexOf(combineKey) < 0) {
-                    let row = getRowByKey(selectedRowKeys[i]);
-                    row && selectRows.value.push(row)
-                }
-            }
+  /**
+   * 表格选择事件
+   * @param selectedRowKeys
+   * @param selectRow
+   */
+  function onSelectChange(selectedRowKeys: (string | number)[]) {
+    if (!selectedRowKeys || selectedRowKeys.length == 0) {
+      selectRows.value = [];
+    } else {
+      for (let i = 0; i < selectedRowKeys.length; i++) {
+        let combineKey = combineRowKey(getRowByKey(selectedRowKeys[i]));
+        let keys = unref(checkedKeys);
+        if (combineKey && keys.indexOf(combineKey) < 0) {
+          let row = getRowByKey(selectedRowKeys[i]);
+          row && selectRows.value.push(row);
         }
-        checkedKeys.value = selectedRowKeys;
+      }
     }
+    checkedKeys.value = selectedRowKeys;
+  }
 
-    /**
-     * 过滤没用选项
-     * @param selectedRowKeys
-     */
-    function filterUnuseSelect() {
-        selectRows.value = unref(selectRows).filter(item=>{
-            let combineKey = combineRowKey(item);
-            return unref(checkedKeys).indexOf(combineKey)>=0
-        })
-    }
+  /**
+   * 过滤没用选项
+   * @param selectedRowKeys
+   */
+  function filterUnuseSelect() {
+    selectRows.value = unref(selectRows).filter((item) => {
+      let combineKey = combineRowKey(item);
+      return unref(checkedKeys).indexOf(combineKey) >= 0;
+    });
+  }
 
-    /**
-     * 根据key获取row信息
-     * @param key
-     */
-    function getRowByKey(key) {
-        let row = unref(dataSource).filter(record => combineRowKey(record) === key);
-        return row&&row.length>0?row[0]:'';
-    }
+  /**
+   * 根据key获取row信息
+   * @param key
+   */
+  function getRowByKey(key) {
+    let row = unref(dataSource).filter((record) => combineRowKey(record) === key);
+    return row && row.length > 0 ? row[0] : '';
+  }
 
-    /**
-     * 加载rowKey
-     */
-    function combineRowKey(record) {
-        let res = record?.id || '';
-        Object.keys(record).forEach(key => {
-            res = (key =='rowIndex') ? (record[key] + res) : (res + record[key]);
-        });
-        res = res.length > 50 ? res.substring(0, 50) : res;
-        return res
-    }
-
-    /**
-     * 加载列信息
-     */
-    function loadColumnsInfo() {
-        let url = `${configUrl.getColumns}${props.code}`;
-        //缓存key
-        let groupIdKey = props.groupId ? `${props.groupId}${url}` : '';
-        httpGroupRequest(() => defHttp.get({url}, {isTransformResponse: false, successMessageMode: 'none'}), groupIdKey).then(res => {
-            if (res.success) {
-                initDictOptionData(res.result.dictOptions);
-                cgRpConfigId.value = res.result.cgRpConfigId;
-                title.value = res.result.cgRpConfigName;
-                let currColumns = res.result.columns;
-                for (let a = 0; a < currColumns.length; a++) {
-                    if (currColumns[a].customRender) {
-                        let dictCode = currColumns[a].customRender;
-                        currColumns[a].customRender = ({text}) => {
-                            return filterMultiDictText(unref(dictOptions)[dictCode], text + "");
-                        }
-                    }
-                    // 排序字段受控
-                    if (unref(iSorter) && currColumns[a].dataIndex === unref(iSorter).column) {
-                        currColumns[a].sortOrder = unref(iSorter).order === 'asc' ? 'ascend' : 'descend'
-                    }
-                }
-                if (currColumns[0].key !== 'rowIndex') {
-                  currColumns.unshift({
-                      title: '序号',
-                      dataIndex: 'rowIndex',
-                      key:'rowIndex',
-                      width:60,
-                      align:"center",
-                      customRender:function ({text}) {
-                          return parseInt(text)+1;
-                      }
-                  });
-                }
-                columns.value = [...currColumns];
-                initQueryInfo(null)
-            }
-        })
-    }
+  /**
+   * 加载rowKey
+   */
+  function combineRowKey(record) {
+    let res = record?.id || '';
+    Object.keys(record).forEach((key) => {
+      res = key == 'rowIndex' ? record[key] + res : res + record[key];
+    });
+    res = res.length > 50 ? res.substring(0, 50) : res;
+    return res;
+  }
 
+  /**
+   * 加载列信息
+   */
+  function loadColumnsInfo() {
+    let url = `${configUrl.getColumns}${props.code}`;
+    //缓存key
+    let groupIdKey = props.groupId ? `${props.groupId}${url}` : '';
+    httpGroupRequest(() => defHttp.get({ url }, { isTransformResponse: false, successMessageMode: 'none' }), groupIdKey).then((res) => {
+      if (res.success) {
+        initDictOptionData(res.result.dictOptions);
+        cgRpConfigId.value = res.result.cgRpConfigId;
+        title.value = res.result.cgRpConfigName;
+        let currColumns = res.result.columns;
+        for (let a = 0; a < currColumns.length; a++) {
+          if (currColumns[a].customRender) {
+            let dictCode = currColumns[a].customRender;
+            currColumns[a].customRender = ({ text }) => {
+              return filterMultiDictText(unref(dictOptions)[dictCode], text + '');
+            };
+          }
+          // 排序字段受控
+          if (unref(iSorter) && currColumns[a].dataIndex === unref(iSorter).column) {
+            currColumns[a].sortOrder = unref(iSorter).order === 'asc' ? 'ascend' : 'descend';
+          }
+        }
+        if (currColumns[0].key !== 'rowIndex') {
+          currColumns.unshift({
+            title: '序号',
+            dataIndex: 'rowIndex',
+            key: 'rowIndex',
+            width: 60,
+            align: 'center',
+            customRender: function ({ text }) {
+              return parseInt(text) + 1;
+            },
+          });
+        }
+        columns.value = [...currColumns];
+        initQueryInfo(null);
+      }
+    });
+  }
 
   /**
    * 加载列和数据[列表专用]
    */
   function loadColumnsAndData() {
     // 第一次加载 置空isTotal 在这里调用确保 该方法只是进入页面后 加载一次 其余查询不走该方法
-    pagination.isTotal = ''
+    pagination.isTotal = '';
     let url = `${configUrl.getColumnsAndData}${props.id}`;
     //缓存key
     let groupIdKey = props.groupId ? `${props.groupId}${url}` : '';
-    httpGroupRequest(() => defHttp.get({url}, {isTransformResponse: false, successMessageMode: 'none'}), groupIdKey).then(res => {
+    httpGroupRequest(() => defHttp.get({ url }, { isTransformResponse: false, successMessageMode: 'none' }), groupIdKey).then((res) => {
       if (res.success) {
         initDictOptionData(res.result.dictOptions);
         cgRpConfigId.value = props.id;
         let { columns: metaColumnList, cgreportHeadName, fieldHrefSlots, isGroupTitle } = res.result;
         title.value = cgreportHeadName;
         // href 跳转
-        const fieldHrefSlotKeysMap = {}
-        fieldHrefSlots.forEach(item => fieldHrefSlotKeysMap[item.slotName] = item)
-        let currColumns = handleColumnHrefAndDict(metaColumnList, fieldHrefSlotKeysMap)
+        const fieldHrefSlotKeysMap = {};
+        fieldHrefSlots.forEach((item) => (fieldHrefSlotKeysMap[item.slotName] = item));
+        let currColumns = handleColumnHrefAndDict(metaColumnList, fieldHrefSlotKeysMap);
 
         // popup需要序号， 普通列表不需要
-        if(clickThenCheckFlag===true){
+        if (clickThenCheckFlag === true) {
           currColumns.unshift({
             title: '序号',
             dataIndex: 'rowIndex',
-            key:'rowIndex',
-            width:60,
-            align:"center",
-            customRender:function ({text}) {
-              return parseInt(text)+1;
-            }
+            key: 'rowIndex',
+            width: 60,
+            align: 'center',
+            customRender: function ({ text }) {
+              return parseInt(text) + 1;
+            },
           });
         }
 
         // 合并表头
-        if(isGroupTitle === true){
+        if (isGroupTitle === true) {
           currColumns = handleGroupTitle(currColumns);
         }
         columns.value = [...currColumns];
-        initQueryInfo(res.result.data)
-      }else{
+        initQueryInfo(res.result.data);
+      } else {
         //update-begin-author:taoyan date:20220401 for: VUEN-583【vue3】JeecgBootException: sql黑名单校验不通过,请联系管理员!,前台无提示
-        createMessage.warning(res.message)
+        createMessage.warning(res.message);
         //update-end-author:taoyan date:20220401 for: VUEN-583【vue3】JeecgBootException: sql黑名单校验不通过,请联系管理员!,前台无提示
       }
-    })
+    });
   }
 
   /**
    * 处理求和的列 合计逻辑 [待优化 3.0]
    */
-  function handleSumColumn(metaColumnList: OnlineColumn[], dataTotal: number):void {
+  function handleSumColumn(metaColumnList: OnlineColumn[], dataTotal: number): void {
     // 获取需要合计列的dataIndex
     let sumColumnList = getNeedSumColumns(metaColumnList);
     // 判断是否为第一次获取数据，如果是的话，则需要重新设置pageSize
     if (pagination.isTotal == '') {
       if (sumColumnList.length > 0) {
-        pagination.isTotal = true
+        pagination.isTotal = true;
         // 有合计字段时，每次最多查询原pageSize-1条记录，另外需要第一次时将查询的10条中删除最后一条
         // 删除最后一条数据 如果第一次得到的数据长度等于pageSize的话，则删除最后一条
         if (dataSource.value.length == pagination.pageSize) {
-          let remove_data = dataSource.value.pop()
+          let remove_data = dataSource.value.pop();
         }
-        pagination.realPageSize = pagination.pageSize - 1
+        pagination.realPageSize = pagination.pageSize - 1;
       } else {
-        pagination.isTotal = false
+        pagination.isTotal = false;
       }
     }
     // 需要添加合计字段
     if (pagination.isTotal) {
-      let totalRow = { }
-      sumColumnList.forEach(dataIndex => {
-        let count = 0
-        dataSource.value.forEach(row => {
+      let totalRow = {};
+      sumColumnList.forEach((dataIndex) => {
+        let count = 0;
+        dataSource.value.forEach((row) => {
           // 统计去除null及空数据
-          if(row[dataIndex] != null && row[dataIndex] != ''){
-            count += parseFloat(row[dataIndex])
+          if (row[dataIndex] != null && row[dataIndex] != '') {
+            count += parseFloat(row[dataIndex]);
           }
-        })
-        totalRow[dataIndex] = isNaN(count) ? '包含非数字内容' : count.toFixed(2)
+        });
+        totalRow[dataIndex] = isNaN(count) ? '包含非数字内容' : count.toFixed(2);
 
         // 长整形时合计不显示.00后缀
-        let v = metaColumnList.find(v=>v.dataIndex==dataIndex);
-        if(v &&　v.fieldType == 'Long'){
-          totalRow[dataIndex] =  parseInt(totalRow[dataIndex]);
+        let v = metaColumnList.find((v) => v.dataIndex == dataIndex);
+        if (v && v.fieldType == 'Long') {
+          totalRow[dataIndex] = parseInt(totalRow[dataIndex]);
         }
-      })
-      dataSource.value.push(totalRow)
-      pagination.realTotal = dataTotal
-      pagination.total = Number(dataTotal) + Number(Math.floor(dataTotal/pagination.realPageSize))
+      });
+      dataSource.value.push(totalRow);
+      pagination.realTotal = dataTotal;
+      pagination.total = Number(dataTotal) + Number(Math.floor(dataTotal / pagination.realPageSize));
     }
   }
 
@@ -285,15 +283,15 @@ export function usePopBiz(props,tableRef?) {
    * 获取需要求和的列 dataIndex
    * @param columns
    */
-  function getNeedSumColumns(columns: OnlineColumn[]):string[]{
-    let arr:string[] = []
-    for(let column of columns){
+  function getNeedSumColumns(columns: OnlineColumn[]): string[] {
+    let arr: string[] = [];
+    for (let column of columns) {
       if (column.isTotal === '1') {
-        arr.push(column.dataIndex!)
-        if(column.children && column.children.length>0){
-          let subArray = getNeedSumColumns(column.children)
-          if(subArray.length>0){
-            arr.push(...subArray)
+        arr.push(column.dataIndex!);
+        if (column.children && column.children.length > 0) {
+          let subArray = getNeedSumColumns(column.children);
+          if (subArray.length > 0) {
+            arr.push(...subArray);
           }
         }
       }
@@ -304,61 +302,65 @@ export function usePopBiz(props,tableRef?) {
   /**
    * 处理列的href和字典翻译
    */
-  function handleColumnHrefAndDict(columns: OnlineColumn[], fieldHrefSlotKeysMap:{}):OnlineColumn[] {
-    for(let column of columns){
-      let { customRender, hrefSlotName, fieldType } = column
+  function handleColumnHrefAndDict(columns: OnlineColumn[], fieldHrefSlotKeysMap: {}): OnlineColumn[] {
+    for (let column of columns) {
+      let { customRender, hrefSlotName, fieldType } = column;
       // online 报表中类型配置为日期（yyyy-MM-dd ），但是实际展示为日期时间格式(yyyy-MM-dd HH:mm:ss) issues/3042
-      if(fieldType=='Date'){
-        column.customRender = ({text}) => {
-          if(!text){
-            return ''
+      if (fieldType == 'Date') {
+        column.customRender = ({ text }) => {
+          if (!text) {
+            return '';
           }
-          if(text.length>10){
-            return text.substring(0, 10)
+          if (text.length > 10) {
+            return text.substring(0, 10);
           }
           return text;
-        }
-      }else{
-        if (!hrefSlotName && (column.scopedSlots && column.scopedSlots.customRender)) {
+        };
+      } else {
+        if (!hrefSlotName && column.scopedSlots && column.scopedSlots.customRender) {
           //【Online报表】字典和href互斥 这里通过fieldHrefSlotKeysMap 先找到是href的列
           if (fieldHrefSlotKeysMap.hasOwnProperty(column.scopedSlots.customRender)) {
-            hrefSlotName = column.scopedSlots.customRender
+            hrefSlotName = column.scopedSlots.customRender;
           }
         }
         // 如果 customRender 有值则代表使用了字典
         // 如果 hrefSlotName 有值则代表使用了href跳转
         // 两者可以兼容。兼容的具体思路为：先获取到字典替换的值，再添加href链接跳转
         if (customRender || hrefSlotName) {
-          let dictCode = customRender as string
-          let replaceFlag = '_replace_text_'
-          column.customRender = ({text, record}) => {
-            let value = text
+          let dictCode = customRender as string;
+          let replaceFlag = '_replace_text_';
+          column.customRender = ({ text, record }) => {
+            let value = text;
             // 如果 dictCode 有值，就进行字典转换
             if (dictCode) {
               if (dictCode.startsWith(replaceFlag)) {
-                let textFieldName = dictCode.replace(replaceFlag, '')
-                value = record[textFieldName]
+                let textFieldName = dictCode.replace(replaceFlag, '');
+                value = record[textFieldName];
               } else {
-                value = filterMultiDictText(unref(dictOptions)[dictCode], text + "");
+                value = filterMultiDictText(unref(dictOptions)[dictCode], text + '');
               }
             }
             // 扩展参数设置列的内容长度
-            if(column.showLength){
-              if(value && value.length>column.showLength){
-                value = value.substr(0, column.showLength)+'...'
+            if (column.showLength) {
+              if (value && value.length > column.showLength) {
+                value = value.substr(0, column.showLength) + '...';
               }
             }
             // 如果 hrefSlotName 有值，就生成一个 a 标签，包裹住字典替换后（或原生）的值
             if (hrefSlotName) {
-              let field = fieldHrefSlotKeysMap[hrefSlotName]
+              let field = fieldHrefSlotKeysMap[hrefSlotName];
               if (field) {
-                return h('a', {
-                  onClick: ()=>handleClickFieldHref(field, record)
-                }, value)
+                return h(
+                  'a',
+                  {
+                    onClick: () => handleClickFieldHref(field, record),
+                  },
+                  value
+                );
               }
             }
-            return value
-          }
+            return value;
+          };
         }
       }
     }
@@ -369,30 +371,31 @@ export function usePopBiz(props,tableRef?) {
    * 处理合并表头
    * @param columns
    */
-  function handleGroupTitle(columns: OnlineColumn[]):OnlineColumn[]{
-    let newColumns:OnlineColumn[] = []
-    for(let column of columns){
+  function handleGroupTitle(columns: OnlineColumn[]): OnlineColumn[] {
+    let newColumns: OnlineColumn[] = [];
+    for (let column of columns) {
       //排序字段受控  ---- 此逻辑为新增逻辑 待
       if (unref(iSorter) && column.dataIndex === unref(iSorter).column) {
-        column.sortOrder = unref(iSorter).order === 'asc' ? 'ascend' : 'descend'
+        column.sortOrder = unref(iSorter).order === 'asc' ? 'ascend' : 'descend';
       }
       //判断字段是否需要合并表头
       if (column.groupTitle) {
-        let clIndex = newColumns.findIndex(im => im.title === column.groupTitle)
+        let clIndex = newColumns.findIndex((im) => im.title === column.groupTitle);
         if (clIndex !== -1) {
           //表头已存在直接push children
-          newColumns[clIndex].children!.push(column)
+          newColumns[clIndex].children!.push(column);
         } else {
           //表头不存在组装表头信息
-          let clGroup:OnlineColumn = {},child:OnlineColumn[] = []
-          child.push(column)
-          clGroup.title = column.groupTitle
-          clGroup.align = 'center'
-          clGroup.children = child
-          newColumns.push(clGroup)
+          let clGroup: OnlineColumn = {},
+            child: OnlineColumn[] = [];
+          child.push(column);
+          clGroup.title = column.groupTitle;
+          clGroup.align = 'center';
+          clGroup.children = child;
+          newColumns.push(clGroup);
         }
       } else {
-        newColumns.push(column)
+        newColumns.push(column);
       }
     }
     return newColumns;
@@ -406,30 +409,30 @@ export function usePopBiz(props,tableRef?) {
    * @param record
    */
   function handleClickFieldHref(field, record) {
-    let href = field.href
-    let urlPattern = /(ht|f)tp(s?)\:\/\/[0-9a-zA-Z]([-.\w]*[0-9a-zA-Z])*(:(0-9)*)*(\/?)([a-zA-Z0-9\-\.\?\,\'\/\\\+&amp;%\$#_]*)?/
-    let compPattern = /\.vue(\?.*)?$/
-    let jsPattern =  /{{([^}]+)}}/g // {{ xxx }}
+    let href = field.href;
+    let urlPattern = /(ht|f)tp(s?)\:\/\/[0-9a-zA-Z]([-.\w]*[0-9a-zA-Z])*(:(0-9)*)*(\/?)([a-zA-Z0-9\-\.\?\,\'\/\\\+&amp;%\$#_]*)?/;
+    let compPattern = /\.vue(\?.*)?$/;
+    let jsPattern = /{{([^}]+)}}/g; // {{ xxx }}
     if (typeof href === 'string') {
-      href = href.trim().replace(/\${([^}]+)?}/g, (s1, s2) => record[s2])
+      href = href.trim().replace(/\${([^}]+)?}/g, (s1, s2) => record[s2]);
       // 执行 {{...}} JS增强语句
       if (jsPattern.test(href)) {
         href = href.replace(jsPattern, function (text, s0) {
           try {
-            return eval(s0)
+            return eval(s0);
           } catch (e) {
-            console.error(e)
-            return text
+            console.error(e);
+            return text;
           }
-        })
+        });
       }
       if (urlPattern.test(href)) {
-        window.open(href, '_blank')
+        window.open(href, '_blank');
       } else if (compPattern.test(href)) {
         // 处理弹框
-        openHrefCompModal(href)
+        openHrefCompModal(href);
       } else {
-        router.push(href)
+        router.push(href);
       }
     }
   }
@@ -438,26 +441,25 @@ export function usePopBiz(props,tableRef?) {
    * 导出
    */
   function handleExport() {
-    const {handleExportXls} = useMethods();
+    const { handleExportXls } = useMethods();
     let url = `${configUrl.export}${cgRpConfigId.value}`;
-    let params = getQueryParams();//查询条件
-    handleExportXls(title.value , url, params)
+    let params = getQueryParams(); //查询条件
+    handleExportXls(title.value, url, params);
   }
 
-
   /**
    * 合计逻辑 [待优化 3.0]
    * 分页 大小改变事件
    * @param _current
    * @param size
    */
-  function onSizeChange(_current, size){
+  function onSizeChange(_current, size) {
     pagination.isTotal = '';
     pagination.pageSize = size;
-    if(pagination.isTotal){
+    if (pagination.isTotal) {
       pagination.realPageSize = size - 1;
-    }else{
-      pagination.realPageSize = size
+    } else {
+      pagination.realPageSize = size;
     }
     pagination.current = 1;
   }
@@ -469,223 +471,222 @@ export function usePopBiz(props,tableRef?) {
    */
   function onShowTotal(total) {
     // 重新根据是否有合计计算每页显示的数据
-    let start = (pagination.current - 1) * pagination.realPageSize + 1
-    let end = start + (pagination.isTotal ? dataSource.value.length - 1 : dataSource.value.length) - 1
-    let realTotal = pagination.isTotal ? pagination.realTotal : total
-    return start + '-' + end + ' 共' + realTotal + '条'
+    let start = (pagination.current - 1) * pagination.realPageSize + 1;
+    let end = start + (pagination.isTotal ? dataSource.value.length - 1 : dataSource.value.length) - 1;
+    let realTotal = pagination.isTotal ? pagination.realTotal : total;
+    return start + '-' + end + ' 共' + realTotal + '条';
   }
 
-    /**
-     * 弹出框显示隐藏触发事件
-     */
-    async function visibleChange($event) {
-        visible.value = $event;
-        $event && loadColumnsInfo();
-    }
+  /**
+   * 弹出框显示隐藏触发事件
+   */
+  async function visibleChange($event) {
+    visible.value = $event;
+    $event && loadColumnsInfo();
+  }
 
-   /**
+  /**
    * 初始化查询条件
    * @param data 数据结果集
    */
-    function initQueryInfo(data) {
-        let url = `${configUrl.getQueryInfo}${unref(cgRpConfigId)}`
-        //缓存key
-        let groupIdKey = props.groupId ? `${props.groupId}${url}` : '';
-        httpGroupRequest(() => defHttp.get({url}, {isTransformResponse: false, successMessageMode: 'none'}), groupIdKey).then((res) => {
-            // console.log("获取查询条件", res);
-            if (res.success) {
-                dynamicParamHandler(res.result);
-                queryInfo.value = res.result;
-                console.log("queryInfo==>",queryInfo.value)
-                //查询条件加载后再请求数据
-                if(data){
-                   setDataSource(data)
-                }else{
-                   //没有传递data时查询数据
-                   loadData(1);
-                }
-
-            } else {
-                createMessage.warning(res.message)
-            }
-        })
-    }
-
-    /**
-     * 加载表格数据
-     * @param arg
-     */
-    function loadData(arg?) {
-        if (arg == 1) {
-            pagination.current = 1
+  function initQueryInfo(data) {
+    let url = `${configUrl.getQueryInfo}${unref(cgRpConfigId)}`;
+    //缓存key
+    let groupIdKey = props.groupId ? `${props.groupId}${url}` : '';
+    httpGroupRequest(() => defHttp.get({ url }, { isTransformResponse: false, successMessageMode: 'none' }), groupIdKey).then((res) => {
+      // console.log("获取查询条件", res);
+      if (res.success) {
+        dynamicParamHandler(res.result);
+        queryInfo.value = res.result;
+        console.log('queryInfo==>', queryInfo.value);
+        //查询条件加载后再请求数据
+        if (data) {
+          setDataSource(data);
+        } else {
+          //没有传递data时查询数据
+          loadData(1);
         }
-        let params = getQueryParams();//查询条件
-        loading.value = true;
-        let url = `${configUrl.getData}${unref(cgRpConfigId)}`
-        //缓存key
-        let groupIdKey = props.groupId ? `${props.groupId}${url}${JSON.stringify(params)}` : '';
-        httpGroupRequest(() => defHttp.get({url, params}, {isTransformResponse: false, successMessageMode: 'none'}), groupIdKey).then(res => {
-            loading.value = false;
-            let data = res.result;
-            console.log("表格信息:", data)
-            setDataSource(data);
-        })
-    }
+      } else {
+        createMessage.warning(res.message);
+      }
+    });
+  }
 
-   /**
+  /**
+   * 加载表格数据
+   * @param arg
+   */
+  function loadData(arg?) {
+    if (arg == 1) {
+      pagination.current = 1;
+    }
+    let params = getQueryParams(); //查询条件
+    loading.value = true;
+    let url = `${configUrl.getData}${unref(cgRpConfigId)}`;
+    //缓存key
+    let groupIdKey = props.groupId ? `${props.groupId}${url}${JSON.stringify(params)}` : '';
+    httpGroupRequest(() => defHttp.get({ url, params }, { isTransformResponse: false, successMessageMode: 'none' }), groupIdKey).then((res) => {
+      loading.value = false;
+      let data = res.result;
+      console.log('表格信息:', data);
+      setDataSource(data);
+    });
+  }
+
+  /**
    * 设置dataSource
    */
-    function setDataSource(data) {
-      if (data) {
-        pagination.total = Number(data.total)
-        let currentPage = pagination?.current??1;
-        for (let a = 0; a < data.records.length; a++) {
-          if (!data.records[a].rowIndex) {
-            data.records[a].rowIndex = a+(currentPage-1)*10;
-          }
+  function setDataSource(data) {
+    if (data) {
+      pagination.total = Number(data.total);
+      let currentPage = pagination?.current ?? 1;
+      for (let a = 0; a < data.records.length; a++) {
+        if (!data.records[a].rowIndex) {
+          data.records[a].rowIndex = a + (currentPage - 1) * 10;
         }
-        dataSource.value = data.records
-      } else {
-        pagination.total = 0;
-        dataSource.value = [];
       }
-      // 合计逻辑 [待优化 3.0]
-      handleSumColumn(columns.value, pagination.total)
+      dataSource.value = data.records;
+    } else {
+      pagination.total = 0;
+      dataSource.value = [];
+    }
+    // 合计逻辑 [待优化 3.0]
+    handleSumColumn(columns.value, pagination.total);
+  }
+
+  /**
+   * 获取查询参数
+   */
+  function getQueryParams() {
+    let paramTarget = {};
+    if (unref(dynamicParam)) {
+      //处理自定义参数
+      Object.keys(unref(dynamicParam)).map((key) => {
+        paramTarget['self_' + key] = unref(dynamicParam)[key];
+      });
+    }
+    let param = Object.assign(paramTarget, unref(queryParam), unref(iSorter));
+    param.pageNo = pagination.current;
+    // 合计逻辑 [待优化 3.0]
+    //  实际查询时不使用table组件的pageSize，而使用自定义的realPageSize,realPageSize会在第一次获取到数据后变化
+    param.pageSize = pagination.realPageSize;
+    return filterObj(param);
+  }
+
+  /**
+   * 处理动态参数
+   */
+  function dynamicParamHandler(arr?) {
+    if (arr && arr.length > 0) {
+      //第一次加载查询条件前 初始化queryParam为空对象
+      let queryTemp = {};
+      for (let item of arr) {
+        if (item.mode === 'single') {
+          queryTemp[item.field] = '';
+        }
+      }
+      queryParam.value = { ...queryTemp };
+    }
+    let dynamicTemp = {};
+    if (props.param) {
+      Object.keys(props.param).map((key) => {
+        let str = props.param[key];
+        if (key in queryParam) {
+          if (str && str.startsWith("'") && str.endsWith("'")) {
+            str = str.substring(1, str.length - 1);
+          }
+          //如果查询条件包含参数 设置值
+          unref(queryParam)[key] = str;
+        }
+        dynamicTemp[key] = props.param[key];
+      });
+    }
+    dynamicParam.value = { ...dynamicTemp };
+  }
+
+  /**
+   * 分页
+   * @param page
+   * @param filters
+   * @param sorter
+   */
+  function handleChangeInTable(page, filters, sorter) {
+    console.log(page, filters, sorter);
+    //分页、排序、筛选变化时触发
+    if (Object.keys(sorter).length > 0) {
+      iSorter.value = {
+        column: sorter.field,
+        order: 'ascend' === sorter.order ? 'asc' : 'desc',
+      };
+      // 排序字段受控
+      unref(columns).forEach((col) => {
+        if (col['dataIndex'] === sorter.field) {
+          col['sortOrder'] = sorter.order;
+        }
+      });
+    }
+    pagination.current = page.current;
+    pagination.pageSize = page.pageSize;
+    loadData();
+  }
+
+  /**
+   * 行点击事件
+   * @param record
+   */
+  function clickThenCheck(record) {
+    if (clickThenCheckFlag === true) {
+      let rowKey = combineRowKey(record);
+      if (!unref(checkedKeys) || unref(checkedKeys).length == 0) {
+        let arr1: any[] = [],
+          arr2: any[] = [];
+        arr1.push(record);
+        arr2.push(rowKey);
+        checkedKeys.value = arr2;
+        selectRows.value = arr1;
+      } else {
+        if (unref(checkedKeys).indexOf(rowKey) < 0) {
+          //不存在就选中
+          checkedKeys.value.push(rowKey);
+          selectRows.value.push(record);
+        } else {
+          //已选中就取消
+          let rowKey_index = unref(checkedKeys).indexOf(rowKey);
+          checkedKeys.value.splice(rowKey_index, 1);
+          selectRows.value.splice(rowKey_index, 1);
+        }
+      }
+    }
+  }
+
+  //防止字典中有垃圾数据
+  function initDictOptionData(arr) {
+    let obj = {};
+    Object.keys(arr).map((k) => {
+      obj[k] = arr[k].filter((item) => {
+        return item != null;
+      });
+    });
+    dictOptions.value = obj;
+  }
+
+  /**
+   * 过滤对象中为空的属性
+   * @param obj
+   * @returns {*}
+   */
+  function filterObj(obj) {
+    if (!(typeof obj == 'object')) {
+      return;
     }
 
-    /**
-     * 获取查询参数
-     */
-    function getQueryParams() {
-        let paramTarget = {};
-        if (unref(dynamicParam)) {
-            //处理自定义参数
-            Object.keys(unref(dynamicParam)).map(key => {
-                paramTarget['self_' + key] = unref(dynamicParam)[key]
-            })
-        }
-        let param = Object.assign(paramTarget, unref(queryParam), unref(iSorter));
-        param.pageNo = pagination.current;
-        // 合计逻辑 [待优化 3.0]
-        //  实际查询时不使用table组件的pageSize，而使用自定义的realPageSize,realPageSize会在第一次获取到数据后变化
-        param.pageSize = pagination.realPageSize;
-        return filterObj(param);
-    }
-
-    /**
-     * 处理动态参数
-     */
-    function dynamicParamHandler(arr?) {
-        if (arr && arr.length > 0) {
-            //第一次加载查询条件前 初始化queryParam为空对象
-            let queryTemp = {};
-            for (let item of arr) {
-                if (item.mode === 'single') {
-                    queryTemp[item.field] = ''
-                }
-            }
-            queryParam.value = {...queryTemp}
-        }
-        let dynamicTemp = {};
-        if (props.param) {
-            Object.keys(props.param).map(key => {
-                let str = props.param[key];
-                if (key in queryParam) {
-                    if (str && str.startsWith("'") && str.endsWith("'")) {
-                        str = str.substring(1, str.length - 1)
-                    }
-                    //如果查询条件包含参数 设置值
-                    unref(queryParam)[key] = str
-                }
-                dynamicTemp[key] = props.param[key]
-            })
-        }
-        dynamicParam.value = {...dynamicTemp}
-    }
-
-    /**
-     * 分页
-     * @param page
-     * @param filters
-     * @param sorter
-     */
-    function handleChangeInTable(page, filters, sorter) {
-        console.log(page, filters, sorter);
-        //分页、排序、筛选变化时触发
-        if (Object.keys(sorter).length > 0) {
-            iSorter.value = {
-                column: sorter.field,
-                order: 'ascend' === sorter.order ? 'asc' : 'desc'
-            }
-            // 排序字段受控
-            unref(columns).forEach(col => {
-                if (col['dataIndex'] === sorter.field) {
-                    col['sortOrder'] = sorter.order
-                }
-            })
-        }
-        pagination.current = page.current;
-        pagination.pageSize = page.pageSize;
-        loadData()
-    }
-
-    /**
-     * 行点击事件
-     * @param record
-     */
-    function clickThenCheck(record) {
-        if(clickThenCheckFlag===true){
-            let rowKey = combineRowKey(record);
-            if (!unref(checkedKeys) || unref(checkedKeys).length == 0) {
-                let arr1: any[] = [], arr2: any[] = [];
-                arr1.push(record);
-                arr2.push(rowKey);
-                checkedKeys.value = arr2;
-                selectRows.value = arr1
-            } else {
-                if (unref(checkedKeys).indexOf(rowKey) < 0) {
-                    //不存在就选中
-                    checkedKeys.value.push(rowKey);
-                    selectRows.value.push(record)
-                } else {
-                    //已选中就取消
-                    let rowKey_index = unref(checkedKeys).indexOf(rowKey);
-                    checkedKeys.value.splice(rowKey_index, 1);
-                    selectRows.value.splice(rowKey_index, 1);
-                }
-            }
-        }
-    }
-
-    //防止字典中有垃圾数据
-    function initDictOptionData(arr) {
-        let obj = {};
-        Object.keys(arr).map(k => {
-            obj[k] = arr[k].filter(item => {
-                return item != null
-            });
-        });
-        dictOptions.value = obj
-    }
-
-    /**
-     * 过滤对象中为空的属性
-     * @param obj
-     * @returns {*}
-     */
-    function filterObj(obj) {
-        if (!(typeof obj == 'object')) {
-            return;
-        }
-
-        for (let key in obj) {
-            if (obj.hasOwnProperty(key)
-                && (obj[key] == null || obj[key] == undefined || obj[key] === '')) {
-                delete obj[key];
-            }
-        }
-        return obj;
+    for (let key in obj) {
+      if (obj.hasOwnProperty(key) && (obj[key] == null || obj[key] == undefined || obj[key] === '')) {
+        delete obj[key];
+      }
     }
+    return obj;
+  }
 
   // 样式
   const dialogStyle = {
@@ -694,7 +695,7 @@ export function usePopBiz(props,tableRef?) {
     height: '100%',
     margin: 0,
     padding: 0,
-  }
+  };
 
   // 弹窗属性配置
   const hrefComponent = ref({
@@ -705,42 +706,44 @@ export function usePopBiz(props,tableRef?) {
       visible: false,
       destroyOnClose: true,
       style: dialogStyle,
-     // dialogStyle: dialogStyle,
+      // dialogStyle: dialogStyle,
       bodyStyle: { padding: '8px', height: 'calc(100vh - 108px)', overflow: 'auto', overflowX: 'hidden' },
       // 隐藏掉取消按钮
-      cancelButtonProps: { style: { display: 'none' } }
+      cancelButtonProps: { style: { display: 'none' } },
     },
     on: {
-      ok: () => hrefComponent.value.model.visible = false,
-      cancel: () => hrefComponent.value.model.visible = false,
+      ok: () => (hrefComponent.value.model.visible = false),
+      cancel: () => (hrefComponent.value.model.visible = false),
     },
-    is: <any> null,
+    is: <any>null,
     params: {},
   });
 
   // 超链点击事件--> 打开一个modal窗口
   function openHrefCompModal(href) {
     // 解析 href 参数
-    let index = href.indexOf('?')
-    let path = href
+    let index = href.indexOf('?');
+    let path = href;
     if (index !== -1) {
-      path = href.substring(0, index)
-      let paramString = href.substring(index + 1, href.length)
-      let paramArray = paramString.split('&')
-      let params = {}
-      paramArray.forEach(paramObject => {
-        let paramItem = paramObject.split('=')
-        params[paramItem[0]] = paramItem[1]
-      })
-      hrefComponent.value.params = params
+      path = href.substring(0, index);
+      let paramString = href.substring(index + 1, href.length);
+      let paramArray = paramString.split('&');
+      let params = {};
+      paramArray.forEach((paramObject) => {
+        let paramItem = paramObject.split('=');
+        params[paramItem[0]] = paramItem[1];
+      });
+      hrefComponent.value.params = params;
     } else {
-      hrefComponent.value.params = {}
+      hrefComponent.value.params = {};
     }
-    hrefComponent.value.model.visible = true
-    hrefComponent.value.model.title = '操作'
-    hrefComponent.value.is = defineAsyncComponent(() => import(/* @vite-ignore */'/@/views/' + (path.startsWith('/') ? path.slice(1) : path)))
+    hrefComponent.value.model.visible = true;
+    hrefComponent.value.model.title = '操作';
+    hrefComponent.value.is = defineAsyncComponent(() => import(/* @vite-ignore */ '/@/views/' + (path.startsWith('/') ? path.slice(1) : path)));
   }
 
-    return [{visibleChange, loadColumnsInfo,loadColumnsAndData, dynamicParamHandler, loadData, handleChangeInTable, combineRowKey, clickThenCheck,filterUnuseSelect, handleExport},
-        {hrefComponent, visible, rowSelection, checkedKeys, selectRows, pagination, dataSource, columns, indexColumnProps, loading, title,iSorter,queryInfo,queryParam,dictOptions}];
+  return [
+    { visibleChange, loadColumnsInfo, loadColumnsAndData, dynamicParamHandler, loadData, handleChangeInTable, combineRowKey, clickThenCheck, filterUnuseSelect, handleExport },
+    { hrefComponent, visible, rowSelection, checkedKeys, selectRows, pagination, dataSource, columns, indexColumnProps, loading, title, iSorter, queryInfo, queryParam, dictOptions },
+  ];
 }
diff --git a/src/components/jeecg/OnLine/types/onlineConfig.ts b/src/components/jeecg/OnLine/types/onlineConfig.ts
index 9517445..701cb19 100644
--- a/src/components/jeecg/OnLine/types/onlineConfig.ts
+++ b/src/components/jeecg/OnLine/types/onlineConfig.ts
@@ -1,12 +1,12 @@
-interface ScopedSlots{
-  customRender: string
+interface ScopedSlots {
+  customRender: string;
 }
 
-interface HrefSlots{
+interface HrefSlots {
   // 链接地址
-  href: string
+  href: string;
   // fieldHref_字段名
-  slotName: string
+  slotName: string;
 }
 
 interface OnlineColumn {
@@ -20,7 +20,7 @@ interface OnlineColumn {
   isTotal?: string | number | boolean;
   groupTitle?: string;
   // 超链的时候 和HrefSlots中的slotName匹配
-  scopedSlots? : ScopedSlots;
+  scopedSlots?: ScopedSlots;
   // 一般用于字典 字典传过来的是字典编码字符串 后转函数
   customRender?: string | Function;
   // 这个类型不知道有什么用
@@ -29,12 +29,9 @@ interface OnlineColumn {
   children?: OnlineColumn[];
   sortOrder?: string;
   // 插槽对应控件类型(列表)
-  slots?:ScopedSlots,
+  slots?: ScopedSlots;
   //超过宽度将自动省略，暂不支持和排序筛选一起使用。
-  ellipsis?: boolean
+  ellipsis?: boolean;
 }
 
-export{
-  OnlineColumn,
-  HrefSlots
-}
+export { OnlineColumn, HrefSlots };
diff --git a/src/components/jeecg/thirdApp/JThirdAppButton.vue b/src/components/jeecg/thirdApp/JThirdAppButton.vue
index bb1b39a..d3a06b7 100644
--- a/src/components/jeecg/thirdApp/JThirdAppButton.vue
+++ b/src/components/jeecg/thirdApp/JThirdAppButton.vue
@@ -1,179 +1,175 @@
 <template>
-    <template v-if="syncToApp || syncToLocal">
-        <JThirdAppDropdown v-if="enabledTypes.wechatEnterprise" type="wechatEnterprise" name="企微" v-bind="bindAttrs" v-on="bindEvents"/>
-        <JThirdAppDropdown v-if="enabledTypes.dingtalk" type="dingtalk" name="钉钉" v-bind="bindAttrs" v-on="bindEvents"/>
-    </template>
-    <template v-else>未设置任何同步方向</template>
+  <template v-if="syncToApp || syncToLocal">
+    <JThirdAppDropdown v-if="enabledTypes.wechatEnterprise" type="wechatEnterprise" name="企微" v-bind="bindAttrs" v-on="bindEvents" />
+    <JThirdAppDropdown v-if="enabledTypes.dingtalk" type="dingtalk" name="钉钉" v-bind="bindAttrs" v-on="bindEvents" />
+  </template>
+  <template v-else>未设置任何同步方向</template>
 </template>
 
 <script lang="ts" setup>
-    import {ExclamationCircleOutlined} from '@ant-design/icons-vue';
-    import {ref, computed, createVNode, h, resolveComponent} from 'vue';
-    import {defHttp} from '/@/utils/http/axios';
-    import {backEndUrl, getEnabledTypes, doSyncThirdApp} from './jThirdApp.api'
-    import {Modal, Input} from 'ant-design-vue';
-    import JThirdAppDropdown from './JThirdAppDropdown.vue'
-    import {useMessage} from '/@/hooks/web/useMessage';
+  import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
+  import { ref, computed, createVNode, h, resolveComponent } from 'vue';
+  import { defHttp } from '/@/utils/http/axios';
+  import { backEndUrl, getEnabledTypes, doSyncThirdApp } from './jThirdApp.api';
+  import { Modal, Input } from 'ant-design-vue';
+  import JThirdAppDropdown from './JThirdAppDropdown.vue';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
-    const {createMessage, createWarningModal} = useMessage();
-    const props = defineProps({
-        // 同步类型，可以是 user、depart
-        bizType: {
-            type: String,
-            required: true,
-        },
-        // 是否允许同步到第三方APP
-        syncToApp: Boolean,
-        // 是否允许第三方APP同步到本地
-        syncToLocal: Boolean,
-        // 选择的行
-        selectedRowKeys: Array,
-    });
-    // 声明Emits
-    const emit = defineEmits(['sync-ok', 'sync-error', 'sync-finally']);
+  const { createMessage, createWarningModal } = useMessage();
+  const props = defineProps({
+    // 同步类型，可以是 user、depart
+    bizType: {
+      type: String,
+      required: true,
+    },
+    // 是否允许同步到第三方APP
+    syncToApp: Boolean,
+    // 是否允许第三方APP同步到本地
+    syncToLocal: Boolean,
+    // 选择的行
+    selectedRowKeys: Array,
+  });
+  // 声明Emits
+  const emit = defineEmits(['sync-ok', 'sync-error', 'sync-finally']);
 
-    const enabledTypes = ref({});
-    // 绑定属性
-    const bindAttrs = computed(() => {
-        return {
-            syncToApp: props.syncToApp,
-            syncToLocal: props.syncToLocal
-        }
-    });
-    // 绑定方法
-    const bindEvents = computed(() => {
-        return {
-            'to-app': onToApp,
-            'to-local': onToLocal,
-        }
-    });
+  const enabledTypes = ref({});
+  // 绑定属性
+  const bindAttrs = computed(() => {
+    return {
+      syncToApp: props.syncToApp,
+      syncToLocal: props.syncToLocal,
+    };
+  });
+  // 绑定方法
+  const bindEvents = computed(() => {
+    return {
+      'to-app': onToApp,
+      'to-local': onToLocal,
+    };
+  });
 
-    // 同步到第三方App
-    function onToApp(e) {
-        doSync(e.type, '/toApp')
+  // 同步到第三方App
+  function onToApp(e) {
+    doSync(e.type, '/toApp');
+  }
+
+  // 同步到本地
+  function onToLocal(e) {
+    doSync(e.type, '/toLocal');
+  }
+
+  // 获取启用的第三方App
+  async function loadEnabledTypes() {
+    enabledTypes.value = await getEnabledTypes();
+  }
+
+  // 开始同步第三方App
+  function doSync(type, direction) {
+    let urls = backEndUrl[type];
+    if (!(urls && urls[props.bizType])) {
+      console.warn('配置出错');
+      return;
     }
+    let url = urls[props.bizType] + direction;
+    let selectedRowKeys = props.selectedRowKeys;
+    let content = '确定要开始同步全部数据吗？可能花费较长时间！';
 
-    // 同步到本地
-    function onToLocal(e) {
-        doSync(e.type, '/toLocal')
+    if (Array.isArray(selectedRowKeys) && selectedRowKeys.length > 0) {
+      content = `确定要开始同步这 ${selectedRowKeys.length} 项吗？`;
+    } else {
+      selectedRowKeys = [];
     }
-
-    // 获取启用的第三方App
-    async function loadEnabledTypes() {
-        enabledTypes.value = await getEnabledTypes()
-    }
-
-    // 开始同步第三方App
-    function doSync(type, direction) {
-        let urls = backEndUrl[type]
-        if (!(urls && urls[props.bizType])) {
-            console.warn('配置出错')
-            return
-        }
-        let url = urls[props.bizType] + direction
-        let selectedRowKeys = props.selectedRowKeys;
-        let content = '确定要开始同步全部数据吗？可能花费较长时间！';
-
-        if (Array.isArray(selectedRowKeys) && selectedRowKeys.length > 0) {
-            content = `确定要开始同步这 ${selectedRowKeys.length} 项吗？`
-        } else {
-            selectedRowKeys = []
-        }
-        return new Promise((resolve, reject) => {
-            const model = Modal.confirm({
-                icon: createVNode(ExclamationCircleOutlined),
-                title: '同步',
-                content,
-                onOk: () => {
-                    model.update({
-                        keyboard: false,
-                        okText: '同步中…',
-                        cancelButtonProps: {disabled: true}
-                    })
-                    let params = {ids: selectedRowKeys.join(',')}
-                    return defHttp.get({url, params}, {isTransformResponse: false}).then(res => {
-                        let options = {}
-                        if (res.result) {
-                            options = {
-                                width: 600,
-                                title: res.message,
-                                content: () => {
-                                    let nodes
-                                    let successInfo = [
-                                        `成功信息如下：`,
-                                        renderTextarea(h, res.result.successInfo.map((v, i) => `${i + 1}. ${v}`).join('\n')),
-                                    ]
-                                    if (res.success) {
-                                        nodes = [
-                                            ...successInfo,
-                                            h('br'),
-                                            `无失败信息！`,
-                                        ]
-                                    } else {
-                                        nodes = [
-                                            `失败信息如下：`,
-                                            renderTextarea(h, res.result.failInfo.map((v, i) => `${i + 1}. ${v}`).join('\n')),
-                                            h('br'),
-                                            ...successInfo,
-                                        ]
-                                    }
-                                    return nodes
-                                }
-                            }
-                        }
-                        if (res.success) {
-                            if (options != null) {
-                                Modal.success(options)
-                            } else {
-                                createMessage.warning(res.message)
-                            }
-                            emit('sync-ok')
-                        } else {
-                            if (options != null) {
-                                Modal.warning(options)
-                            } else {
-                                createMessage.warning(res.message)
-                            }
-                            emit('sync-error')
-                        }
-                    }).catch(() => model.destroy()).finally(() => {
-                        resolve()
-                        emit('sync-finally', {
-                            type,
-                            direction,
-                            isToApp: direction === '/toApp',
-                            isToLocal: direction === '/toLocal',
-                        })
-                    })
-                },
-                onCancel() {
-                    resolve()
-                },
+    return new Promise((resolve, reject) => {
+      const model = Modal.confirm({
+        icon: createVNode(ExclamationCircleOutlined),
+        title: '同步',
+        content,
+        onOk: () => {
+          model.update({
+            keyboard: false,
+            okText: '同步中…',
+            cancelButtonProps: { disabled: true },
+          });
+          let params = { ids: selectedRowKeys.join(',') };
+          return defHttp
+            .get({ url, params }, { isTransformResponse: false })
+            .then((res) => {
+              let options = {};
+              if (res.result) {
+                options = {
+                  width: 600,
+                  title: res.message,
+                  content: () => {
+                    let nodes;
+                    let successInfo = [`成功信息如下：`, renderTextarea(h, res.result.successInfo.map((v, i) => `${i + 1}. ${v}`).join('\n'))];
+                    if (res.success) {
+                      nodes = [...successInfo, h('br'), `无失败信息！`];
+                    } else {
+                      nodes = [`失败信息如下：`, renderTextarea(h, res.result.failInfo.map((v, i) => `${i + 1}. ${v}`).join('\n')), h('br'), ...successInfo];
+                    }
+                    return nodes;
+                  },
+                };
+              }
+              if (res.success) {
+                if (options != null) {
+                  Modal.success(options);
+                } else {
+                  createMessage.warning(res.message);
+                }
+                emit('sync-ok');
+              } else {
+                if (options != null) {
+                  Modal.warning(options);
+                } else {
+                  createMessage.warning(res.message);
+                }
+                emit('sync-error');
+              }
             })
-        })
-    }
+            .catch(() => model.destroy())
+            .finally(() => {
+              resolve();
+              emit('sync-finally', {
+                type,
+                direction,
+                isToApp: direction === '/toApp',
+                isToLocal: direction === '/toLocal',
+              });
+            });
+        },
+        onCancel() {
+          resolve();
+        },
+      });
+    });
+  }
 
-    function renderTextarea(h, value) {
-        return h('div', {
-            id: 'box',
-            style: {
-                minHeight: '100px',
-                border: '1px solid #d9d9d9',
-                fontSize: '14px',
-                maxHeight: '250px',
-                whiteSpace: 'pre',
-                overflow: 'auto',
-                padding: '10px'
-            }
-        }, value)
-    }
+  function renderTextarea(h, value) {
+    return h(
+      'div',
+      {
+        id: 'box',
+        style: {
+          minHeight: '100px',
+          border: '1px solid #d9d9d9',
+          fontSize: '14px',
+          maxHeight: '250px',
+          whiteSpace: 'pre',
+          overflow: 'auto',
+          padding: '10px',
+        },
+      },
+      value
+    );
+  }
 
-    // 获取启用的第三方App
-    loadEnabledTypes()
+  // 获取启用的第三方App
+  loadEnabledTypes();
 </script>
 
 <style scoped>
-    #box:hover {
-        border-color: #40a9ff;
-    }
+  #box:hover {
+    border-color: #40a9ff;
+  }
 </style>
diff --git a/src/components/jeecg/thirdApp/JThirdAppDropdown.vue b/src/components/jeecg/thirdApp/JThirdAppDropdown.vue
index 67f07b4..2eaacc9 100644
--- a/src/components/jeecg/thirdApp/JThirdAppDropdown.vue
+++ b/src/components/jeecg/thirdApp/JThirdAppDropdown.vue
@@ -1,35 +1,32 @@
 <template>
-    <a-dropdown v-if="syncToApp && syncToLocal">
-        <a-button type="primary" preIcon="ant-design:sync-outlined">同步{{name}}</a-button>
-        <template #overlay>
-            <a-menu @click="handleMenuClick">
-                <a-menu-item v-if="syncToApp" key="to-app">同步到{{name}}</a-menu-item>
-                <a-menu-item v-if="syncToLocal" key="to-local">同步到本地</a-menu-item>
-            </a-menu>
-        </template>
-    </a-dropdown>
-    <a-button v-else-if="syncToApp" type="primary" preIcon="ant-design:sync-outlined" @click="handleMenuClick({key:'to-app'})">同步{{name}}</a-button>
-    <a-button v-else type="primary" preIcon="ant-design:sync-outlined" @click="handleMenuClick({key:'to-local'})">同步{{name}}到本地</a-button>
+  <a-dropdown v-if="syncToApp && syncToLocal">
+    <a-button type="primary" preIcon="ant-design:sync-outlined">同步{{ name }}</a-button>
+    <template #overlay>
+      <a-menu @click="handleMenuClick">
+        <a-menu-item v-if="syncToApp" key="to-app">同步到{{ name }}</a-menu-item>
+        <a-menu-item v-if="syncToLocal" key="to-local">同步到本地</a-menu-item>
+      </a-menu>
+    </template>
+  </a-dropdown>
+  <a-button v-else-if="syncToApp" type="primary" preIcon="ant-design:sync-outlined" @click="handleMenuClick({ key: 'to-app' })">同步{{ name }}</a-button>
+  <a-button v-else type="primary" preIcon="ant-design:sync-outlined" @click="handleMenuClick({ key: 'to-local' })">同步{{ name }}到本地</a-button>
 </template>
 
 <script lang="ts" setup>
-    /* JThirdAppButton 的子组件，不可单独使用 */
+  /* JThirdAppButton 的子组件，不可单独使用 */
 
-    const props = defineProps({
-        type: String,
-        name: String,
-        syncToApp: Boolean,
-        syncToLocal: Boolean,
-    });
-    // 声明Emits
-    const emit = defineEmits(['to-app', 'to-local']);
-
-    function handleMenuClick(event) {
-        emit(event.key, {type: props.type})
-    }
+  const props = defineProps({
+    type: String,
+    name: String,
+    syncToApp: Boolean,
+    syncToLocal: Boolean,
+  });
+  // 声明Emits
+  const emit = defineEmits(['to-app', 'to-local']);
 
+  function handleMenuClick(event) {
+    emit(event.key, { type: props.type });
+  }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/components/jeecg/thirdApp/jThirdApp.api.ts b/src/components/jeecg/thirdApp/jThirdApp.api.ts
index 9f6f5c0..a3dfc04 100644
--- a/src/components/jeecg/thirdApp/jThirdApp.api.ts
+++ b/src/components/jeecg/thirdApp/jThirdApp.api.ts
@@ -1,37 +1,37 @@
-import {defHttp} from '/@/utils/http/axios';
-import {cloneObject} from '/@/utils/index'
+import { defHttp } from '/@/utils/http/axios';
+import { cloneObject } from '/@/utils/index';
 
 export const backEndUrl = {
-    // 获取启用的第三方App
-    getEnabledType: '/sys/thirdApp/getEnabledType',
-    // 企业微信
-    wechatEnterprise: {
-        user: '/sys/thirdApp/sync/wechatEnterprise/user',
-        depart: '/sys/thirdApp/sync/wechatEnterprise/depart',
-    },
-    // 钉钉
-    dingtalk: {
-        user: '/sys/thirdApp/sync/dingtalk/user',
-        depart: '/sys/thirdApp/sync/dingtalk/depart',
-    }
-}
+  // 获取启用的第三方App
+  getEnabledType: '/sys/thirdApp/getEnabledType',
+  // 企业微信
+  wechatEnterprise: {
+    user: '/sys/thirdApp/sync/wechatEnterprise/user',
+    depart: '/sys/thirdApp/sync/wechatEnterprise/depart',
+  },
+  // 钉钉
+  dingtalk: {
+    user: '/sys/thirdApp/sync/dingtalk/user',
+    depart: '/sys/thirdApp/sync/dingtalk/depart',
+  },
+};
 // 启用了哪些第三方App（在此缓存）
-let enabledTypes = null
+let enabledTypes = null;
 
 // 获取启用的第三方App
 export const getEnabledTypes = async () => {
-    // 获取缓存
-    if (enabledTypes != null) {
-        return cloneObject(enabledTypes)
+  // 获取缓存
+  if (enabledTypes != null) {
+    return cloneObject(enabledTypes);
+  } else {
+    let { success, result } = await defHttp.get({ url: backEndUrl.getEnabledType }, { isTransformResponse: false });
+    if (success) {
+      // 在此缓存
+      enabledTypes = cloneObject(result);
+      return result;
     } else {
-        let {success, result} = await defHttp.get({url: backEndUrl.getEnabledType}, {isTransformResponse: false})
-        if (success) {
-            // 在此缓存
-            enabledTypes = cloneObject(result)
-            return result
-        } else {
-            console.warn('getEnabledType查询失败：')
-        }
+      console.warn('getEnabledType查询失败：');
     }
-    return {}
-}
+  }
+  return {};
+};
diff --git a/src/components/registerGlobComp.ts b/src/components/registerGlobComp.ts
index 4a582b1..716742a 100644
--- a/src/components/registerGlobComp.ts
+++ b/src/components/registerGlobComp.ts
@@ -1,102 +1,103 @@
-import type {App} from 'vue';
-import {Icon} from './Icon';
-import AIcon from '/@/components/jeecg/AIcon.vue'
-import {Button,UploadButton} from './Button';
+import type { App } from 'vue';
+import { Icon } from './Icon';
+import AIcon from '/@/components/jeecg/AIcon.vue';
+import { Button, UploadButton } from './Button';
 import {
-    // Need
-    Button as AntButton,
-    Select,
-    Alert,
-    Checkbox,
-    DatePicker,
-    Radio,
-    Switch,
-    Card,
-    List,
-    Tabs,
-    Descriptions,
-    Tree,
-    Table,
-    Divider,
-    Modal,
-    Drawer,
-    TreeSelect,
-    Dropdown,
-    Tag,
-    Tooltip,
-    Badge,
-    Popover,
-    Upload,
-    Transfer,
-    Steps,
-    PageHeader,
-    Result,
-    Empty,
-    Avatar,
-    Menu,
-    Breadcrumb,
-    Form,
-    Input,
-    Row,
-    Col,
-    Spin,
-    Space,
-    Layout,
-    Collapse,
-    Slider,
-    InputNumber,
-    Carousel,
-    Popconfirm,
+  // Need
+  Button as AntButton,
+  Select,
+  Alert,
+  Checkbox,
+  DatePicker,
+  Radio,
+  Switch,
+  Card,
+  List,
+  Tabs,
+  Descriptions,
+  Tree,
+  Table,
+  Divider,
+  Modal,
+  Drawer,
+  TreeSelect,
+  Dropdown,
+  Tag,
+  Tooltip,
+  Badge,
+  Popover,
+  Upload,
+  Transfer,
+  Steps,
+  PageHeader,
+  Result,
+  Empty,
+  Avatar,
+  Menu,
+  Breadcrumb,
+  Form,
+  Input,
+  Row,
+  Col,
+  Spin,
+  Space,
+  Layout,
+  Collapse,
+  Slider,
+  InputNumber,
+  Carousel,
+  Popconfirm,
 } from 'ant-design-vue';
 
-const compList = [AntButton.Group, Icon, AIcon,UploadButton];
+const compList = [AntButton.Group, Icon, AIcon, UploadButton];
 
 export function registerGlobComp(app: App) {
-    compList.forEach((comp) => {
-        app.component(comp.name || comp.displayName, comp);
-    });
+  compList.forEach((comp) => {
+    app.component(comp.name || comp.displayName, comp);
+  });
 
-    app.use(Select)
-        .use(Alert)
-        .use(Button)
-        .use(Breadcrumb)
-        .use(Checkbox)
-        .use(DatePicker)
-        .use(Radio)
-        .use(Switch)
-        .use(Card)
-        .use(List)
-        .use(Descriptions)
-        .use(Tree)
-        .use(TreeSelect)
-        .use(Table)
-        .use(Divider)
-        .use(Modal)
-        .use(Drawer)
-        .use(Dropdown)
-        .use(Tag)
-        .use(Tooltip)
-        .use(Badge)
-        .use(Popover)
-        .use(Upload)
-        .use(Transfer)
-        .use(Steps)
-        .use(PageHeader)
-        .use(Result)
-        .use(Empty)
-        .use(Avatar)
-        .use(Menu)
-        .use(Tabs)
-        .use(Form)
-        .use(Input)
-        .use(Row)
-        .use(Col)
-        .use(Spin)
-        .use(Space)
-        .use(Layout)
-        .use(Collapse)
-        .use(Slider)
-        .use(InputNumber)
-        .use(Carousel)
-        .use(Popconfirm)
+  app
+    .use(Select)
+    .use(Alert)
+    .use(Button)
+    .use(Breadcrumb)
+    .use(Checkbox)
+    .use(DatePicker)
+    .use(Radio)
+    .use(Switch)
+    .use(Card)
+    .use(List)
+    .use(Descriptions)
+    .use(Tree)
+    .use(TreeSelect)
+    .use(Table)
+    .use(Divider)
+    .use(Modal)
+    .use(Drawer)
+    .use(Dropdown)
+    .use(Tag)
+    .use(Tooltip)
+    .use(Badge)
+    .use(Popover)
+    .use(Upload)
+    .use(Transfer)
+    .use(Steps)
+    .use(PageHeader)
+    .use(Result)
+    .use(Empty)
+    .use(Avatar)
+    .use(Menu)
+    .use(Tabs)
+    .use(Form)
+    .use(Input)
+    .use(Row)
+    .use(Col)
+    .use(Spin)
+    .use(Space)
+    .use(Layout)
+    .use(Collapse)
+    .use(Slider)
+    .use(InputNumber)
+    .use(Carousel)
+    .use(Popconfirm);
 }
diff --git a/src/design/public.less b/src/design/public.less
index 408dc06..eda1bbf 100644
--- a/src/design/public.less
+++ b/src/design/public.less
@@ -110,4 +110,4 @@
     right: -20px;
     bottom: -20px;
   }
-}
\ No newline at end of file
+}
diff --git a/src/design/theme.less b/src/design/theme.less
index eca2326..7f348bf 100644
--- a/src/design/theme.less
+++ b/src/design/theme.less
@@ -32,13 +32,11 @@ html[data-theme='light'] {
   }
 
   .ant-card-grid-hoverable:hover {
-    box-shadow: 0 3px 6px -4px rgb(0 0 0 / 48%), 0 6px 16px 0 rgb(0 0 0 / 32%),
-    0 9px 28px 8px rgb(0 0 0 / 20%);
+    box-shadow: 0 3px 6px -4px rgb(0 0 0 / 48%), 0 6px 16px 0 rgb(0 0 0 / 32%), 0 9px 28px 8px rgb(0 0 0 / 20%);
   }
 
   .ant-card-grid {
-    box-shadow: 1px 0 0 0 #434343, 0 1px 0 0 #434343, 1px 1px 0 0 #434343, 1px 0 0 0 #434343 inset,
-    0 1px 0 0 #434343 inset;
+    box-shadow: 1px 0 0 0 #434343, 0 1px 0 0 #434343, 1px 1px 0 0 #434343, 1px 0 0 0 #434343 inset, 0 1px 0 0 #434343 inset;
   }
 
   .ant-calendar-selected-day .ant-calendar-date {
diff --git a/src/directives/clickOutside.ts b/src/directives/clickOutside.ts
index f6f3051..a5da105 100644
--- a/src/directives/clickOutside.ts
+++ b/src/directives/clickOutside.ts
@@ -46,19 +46,9 @@ function createDocumentHandler(el: HTMLElement, binding: DirectiveBinding): Docu
     const isContainedByEl = el.contains(mouseUpTarget) || el.contains(mouseDownTarget);
     const isSelf = el === mouseUpTarget;
 
-    const isTargetExcluded =
-      (excludes.length && excludes.some((item) => item?.contains(mouseUpTarget))) ||
-      (excludes.length && excludes.includes(mouseDownTarget as HTMLElement));
-    const isContainedByPopper =
-      popperRef && (popperRef.contains(mouseUpTarget) || popperRef.contains(mouseDownTarget));
-    if (
-      isBound ||
-      isTargetExists ||
-      isContainedByEl ||
-      isSelf ||
-      isTargetExcluded ||
-      isContainedByPopper
-    ) {
+    const isTargetExcluded = (excludes.length && excludes.some((item) => item?.contains(mouseUpTarget))) || (excludes.length && excludes.includes(mouseDownTarget as HTMLElement));
+    const isContainedByPopper = popperRef && (popperRef.contains(mouseUpTarget) || popperRef.contains(mouseDownTarget));
+    if (isBound || isTargetExists || isContainedByEl || isSelf || isTargetExcluded || isContainedByPopper) {
       return;
     }
     binding.value();
diff --git a/src/directives/ripple/index.ts b/src/directives/ripple/index.ts
index 85a80e8..6932264 100644
--- a/src/directives/ripple/index.ts
+++ b/src/directives/ripple/index.ts
@@ -46,12 +46,7 @@ const RippleDirective: Directive & RippleProto = {
   },
 };
 
-function rippler({
-  event,
-  el,
-  zIndex,
-  background,
-}: { event: EventType; el: HTMLElement } & RippleProto) {
+function rippler({ event, el, zIndex, background }: { event: EventType; el: HTMLElement } & RippleProto) {
   const targetBorder = parseInt(getComputedStyle(el).borderWidth.replace('px', ''));
   const clientX = event.clientX || event.touches[0].clientX;
   const clientY = event.clientY || event.touches[0].clientY;
@@ -99,8 +94,7 @@ function rippler({
     overflow: 'hidden',
   });
 
-  const storedTargetPosition =
-    el.style.position.length > 0 ? el.style.position : getComputedStyle(el).position;
+  const storedTargetPosition = el.style.position.length > 0 ? el.style.position : getComputedStyle(el).position;
 
   if (storedTargetPosition !== 'relative') {
     el.style.position = 'relative';
@@ -114,12 +108,7 @@ function rippler({
     marginLeft: `${dx}px`,
   });
 
-  const {
-    borderTopLeftRadius,
-    borderTopRightRadius,
-    borderBottomLeftRadius,
-    borderBottomRightRadius,
-  } = style;
+  const { borderTopLeftRadius, borderTopRightRadius, borderBottomLeftRadius, borderBottomRightRadius } = style;
   Object.assign(rippleContainer.style, {
     width: `${width}px`,
     height: `${height}px`,
diff --git a/src/enums/CompTypeEnum.ts b/src/enums/CompTypeEnum.ts
index 7d0b0be..c0f43e4 100644
--- a/src/enums/CompTypeEnum.ts
+++ b/src/enums/CompTypeEnum.ts
@@ -2,31 +2,31 @@
  * 组件类型
  */
 export enum CompTypeEnum {
-     //单选
-    Radio = 'radio',
-    //按钮样式单选
-    RadioButton = 'radioButton',
-    //下拉框
-    Select = 'select',
-    //列表
-    List = 'list',
-    //开关
-    Switch = 'switch',
-    //下拉树
-    SelTree = 'sel_tree',
-    //分类字典树
-    CatTree = 'cat_tree',
-    //下拉搜索
-    SelSearch = 'sel_search',
-    //用户现在框
-    SelUser = 'sel_user',
-    //复选框
-    Checkbox = 'checkbox',
-    //多选列表
-    ListMulti = 'list_multi',
-    //区域选择
-    Pca = 'pca',
-    Popup = 'popup',
-    //部门选择
-    SelDepart = 'sel_depart',
+  //单选
+  Radio = 'radio',
+  //按钮样式单选
+  RadioButton = 'radioButton',
+  //下拉框
+  Select = 'select',
+  //列表
+  List = 'list',
+  //开关
+  Switch = 'switch',
+  //下拉树
+  SelTree = 'sel_tree',
+  //分类字典树
+  CatTree = 'cat_tree',
+  //下拉搜索
+  SelSearch = 'sel_search',
+  //用户现在框
+  SelUser = 'sel_user',
+  //复选框
+  Checkbox = 'checkbox',
+  //多选列表
+  ListMulti = 'list_multi',
+  //区域选择
+  Pca = 'pca',
+  Popup = 'popup',
+  //部门选择
+  SelDepart = 'sel_depart',
 }
diff --git a/src/enums/DateTypeEnum.ts b/src/enums/DateTypeEnum.ts
index 002a9f0..9ccf88c 100644
--- a/src/enums/DateTypeEnum.ts
+++ b/src/enums/DateTypeEnum.ts
@@ -2,7 +2,7 @@
  * 日期类型
  */
 export enum DateTypeEnum {
-    Date = 'date',
-    Datetime = 'datetime',
-    Time = 'time',
+  Date = 'date',
+  Datetime = 'datetime',
+  Time = 'time',
 }
diff --git a/src/enums/jeecgEnum.ts b/src/enums/jeecgEnum.ts
index 69104b6..9290893 100644
--- a/src/enums/jeecgEnum.ts
+++ b/src/enums/jeecgEnum.ts
@@ -2,20 +2,20 @@
  * JInput组件类型
  */
 export enum JInputTypeEnum {
-     //模糊
-    JINPUT_QUERY_LIKE = 'like',
-    //非
-    JINPUT_QUERY_NE = 'ne',
-    //大于等于
-    JINPUT_QUERY_GE = 'ge',
-    //小于等于
-    JINPUT_QUERY_LE = 'le',
+  //模糊
+  JINPUT_QUERY_LIKE = 'like',
+  //非
+  JINPUT_QUERY_NE = 'ne',
+  //大于等于
+  JINPUT_QUERY_GE = 'ge',
+  //小于等于
+  JINPUT_QUERY_LE = 'le',
 }
 
 /**
  * 面板设计器需要的常量定义
  */
 export enum JDragConfigEnum {
-    //baseURL
-    DRAG_BASE_URL = 'drag-base-url',
+  //baseURL
+  DRAG_BASE_URL = 'drag-base-url',
 }
diff --git a/src/enums/sizeEnum.ts b/src/enums/sizeEnum.ts
index 923a1e6..4348c2c 100644
--- a/src/enums/sizeEnum.ts
+++ b/src/enums/sizeEnum.ts
@@ -11,11 +11,11 @@ export enum SizeNumberEnum {
 }
 
 export enum ScreenSizeEnum {
- XS = 480,
- SM = 576,
- MD = 768,
- LG = 992,
- XL = 1200,
+  XS = 480,
+  SM = 576,
+  MD = 768,
+  LG = 992,
+  XL = 1200,
 }
 
 export const sizeMap: Map<SizeEnum, SizeNumberEnum> = (() => {
diff --git a/src/hooks/component/useFormItem.ts b/src/hooks/component/useFormItem.ts
index 93b1a2d..e5e1d01 100644
--- a/src/hooks/component/useFormItem.ts
+++ b/src/hooks/component/useFormItem.ts
@@ -1,28 +1,14 @@
 import type { UnwrapRef, Ref, WritableComputedRef, DeepReadonly } from 'vue';
-import {
-  reactive,
-  readonly,
-  computed,
-  getCurrentInstance,
-  watchEffect,
-  unref,
-  nextTick,
-  toRaw,
-} from 'vue';
+import { reactive, readonly, computed, getCurrentInstance, watchEffect, unref, nextTick, toRaw } from 'vue';
 
 import { isEqual } from 'lodash-es';
 export function useRuleFormItem<T extends Recordable, K extends keyof T, V = UnwrapRef<T[K]>>(
   props: T,
   key?: K,
   changeEvent?,
-  emitData?: Ref<any[]>,
-): [WritableComputedRef<V>, (val: V) => void, DeepReadonly<V>];
-export function useRuleFormItem<T extends Recordable>(
-  props: T,
-  key: keyof T = 'value',
-  changeEvent = 'change',
   emitData?: Ref<any[]>
-) {
+): [WritableComputedRef<V>, (val: V) => void, DeepReadonly<V>];
+export function useRuleFormItem<T extends Recordable>(props: T, key: keyof T = 'value', changeEvent = 'change', emitData?: Ref<any[]>) {
   const instance = getCurrentInstance();
   const emit = instance?.emit;
 
@@ -43,7 +29,7 @@ export function useRuleFormItem<T extends Recordable>(
   const state: any = computed({
     get() {
       //修复多选时空值显示问题
-      return innerState.value===''?[]:innerState.value;
+      return innerState.value === '' ? [] : innerState.value;
     },
     set(value) {
       if (isEqual(value, defaultState.value)) return;
diff --git a/src/hooks/core/useAttrs.ts b/src/hooks/core/useAttrs.ts
index 6188676..ea96575 100644
--- a/src/hooks/core/useAttrs.ts
+++ b/src/hooks/core/useAttrs.ts
@@ -1,41 +1,41 @@
-import {getCurrentInstance, reactive, shallowRef, watchEffect} from 'vue';
-import type {Ref} from 'vue';
+import { getCurrentInstance, reactive, shallowRef, watchEffect } from 'vue';
+import type { Ref } from 'vue';
 
 interface Params {
-    excludeListeners?: boolean;
-    excludeKeys?: string[];
-    excludeDefaultKeys?: boolean;
+  excludeListeners?: boolean;
+  excludeKeys?: string[];
+  excludeDefaultKeys?: boolean;
 }
 
 const DEFAULT_EXCLUDE_KEYS = ['class', 'style'];
 const LISTENER_PREFIX = /^on[A-Z]/;
 
 export function entries<T>(obj: Recordable<T>): [string, T][] {
-    return Object.keys(obj).map((key: string) => [key, obj[key]]);
+  return Object.keys(obj).map((key: string) => [key, obj[key]]);
 }
 
 export function useAttrs(params: Params = {}): Ref<Recordable> | {} {
-    const instance = getCurrentInstance();
-    if (!instance) return {};
+  const instance = getCurrentInstance();
+  if (!instance) return {};
 
-    const {excludeListeners = false, excludeKeys = [], excludeDefaultKeys = true} = params;
-    const attrs = shallowRef({});
-    const allExcludeKeys = excludeKeys.concat(excludeDefaultKeys ? DEFAULT_EXCLUDE_KEYS : []);
+  const { excludeListeners = false, excludeKeys = [], excludeDefaultKeys = true } = params;
+  const attrs = shallowRef({});
+  const allExcludeKeys = excludeKeys.concat(excludeDefaultKeys ? DEFAULT_EXCLUDE_KEYS : []);
 
-    // Since attrs are not reactive, make it reactive instead of doing in `onUpdated` hook for better performance
-    instance.attrs = reactive(instance.attrs);
+  // Since attrs are not reactive, make it reactive instead of doing in `onUpdated` hook for better performance
+  instance.attrs = reactive(instance.attrs);
 
-    watchEffect(() => {
-        const res = entries(instance.attrs).reduce((acm, [key, val]) => {
-            if (!allExcludeKeys.includes(key) && !(excludeListeners && LISTENER_PREFIX.test(key))) {
-                acm[key] = val;
-            }
+  watchEffect(() => {
+    const res = entries(instance.attrs).reduce((acm, [key, val]) => {
+      if (!allExcludeKeys.includes(key) && !(excludeListeners && LISTENER_PREFIX.test(key))) {
+        acm[key] = val;
+      }
 
-            return acm;
-        }, {} as Recordable);
+      return acm;
+    }, {} as Recordable);
 
-        attrs.value = res;
-    });
+    attrs.value = res;
+  });
 
-    return attrs;
+  return attrs;
 }
diff --git a/src/hooks/core/useContext.ts b/src/hooks/core/useContext.ts
index 0294030..0f039eb 100644
--- a/src/hooks/core/useContext.ts
+++ b/src/hooks/core/useContext.ts
@@ -18,11 +18,7 @@ type ShallowUnwrap<T> = {
   [P in keyof T]: UnwrapRef<T[P]>;
 };
 
-export function createContext<T>(
-  context: any,
-  key: InjectionKey<T> = Symbol(),
-  options: CreateContextOptions = {}
-) {
+export function createContext<T>(context: any, key: InjectionKey<T> = Symbol(), options: CreateContextOptions = {}) {
   const { readonly = true, createProvider = false, native = false } = options;
 
   const state = reactive(context);
@@ -37,9 +33,6 @@ export function createContext<T>(
 export function useContext<T>(key: InjectionKey<T>, native?: boolean): T;
 export function useContext<T>(key: InjectionKey<T>, defaultValue?: any, native?: boolean): T;
 
-export function useContext<T>(
-  key: InjectionKey<T> = Symbol(),
-  defaultValue?: any
-): ShallowUnwrap<T> {
+export function useContext<T>(key: InjectionKey<T> = Symbol(), defaultValue?: any): ShallowUnwrap<T> {
   return inject(key, defaultValue || {});
 }
diff --git a/src/hooks/core/useLockFn.ts b/src/hooks/core/useLockFn.ts
index 6da611f..141073b 100644
--- a/src/hooks/core/useLockFn.ts
+++ b/src/hooks/core/useLockFn.ts
@@ -1,8 +1,6 @@
 import { ref, unref } from 'vue';
 
-export function useLockFn<P extends any[] = any[], V extends any = any>(
-  fn: (...args: P) => Promise<V>
-) {
+export function useLockFn<P extends any[] = any[], V extends any = any>(fn: (...args: P) => Promise<V>) {
   const lockRef = ref(false);
   return async function (...args: P) {
     if (unref(lockRef)) return;
diff --git a/src/hooks/event/useEventListener.ts b/src/hooks/event/useEventListener.ts
index 983a143..46fd186 100644
--- a/src/hooks/event/useEventListener.ts
+++ b/src/hooks/event/useEventListener.ts
@@ -12,15 +12,7 @@ export interface UseEventParams {
   isDebounce?: boolean;
   wait?: number;
 }
-export function useEventListener({
-                                   el = window,
-                                   name,
-                                   listener,
-                                   options,
-                                   autoRemove = true,
-                                   isDebounce = true,
-                                   wait = 80,
-                                 }: UseEventParams): { removeEvent: RemoveEventFn } {
+export function useEventListener({ el = window, name, listener, options, autoRemove = true, isDebounce = true, wait = 80 }: UseEventParams): { removeEvent: RemoveEventFn } {
   /* eslint-disable-next-line */
   let remove: RemoveEventFn = () => {};
   const isAddRef = ref(false);
@@ -37,16 +29,16 @@ export function useEventListener({
     const addEventListener = (e: Element) => e.addEventListener(name, realHandler, options);
 
     const removeWatch = watch(
-        element,
-        (v, _ov, cleanUp) => {
-          if (v) {
-            !unref(isAddRef) && addEventListener(v);
-            cleanUp(() => {
-              autoRemove && removeEventListener(v);
-            });
-          }
-        },
-        { immediate: true }
+      element,
+      (v, _ov, cleanUp) => {
+        if (v) {
+          !unref(isAddRef) && addEventListener(v);
+          cleanUp(() => {
+            autoRemove && removeEventListener(v);
+          });
+        }
+      },
+      { immediate: true }
     );
 
     remove = () => {
diff --git a/src/hooks/event/useIntersectionObserver.ts b/src/hooks/event/useIntersectionObserver.ts
index 1f7b152..44ed699 100644
--- a/src/hooks/event/useIntersectionObserver.ts
+++ b/src/hooks/event/useIntersectionObserver.ts
@@ -8,13 +8,7 @@ interface IntersectionObserverProps {
   threshold?: number;
 }
 
-export function useIntersectionObserver({
-                                          target,
-                                          root,
-                                          onIntersect,
-                                          rootMargin = '0px',
-                                          threshold = 0.1,
-                                        }: IntersectionObserverProps) {
+export function useIntersectionObserver({ target, root, onIntersect, rootMargin = '0px', threshold = 0.1 }: IntersectionObserverProps) {
   let cleanup = () => {};
   const observer: Ref<Nullable<IntersectionObserver>> = ref(null);
   const stopEffect = watchEffect(() => {
diff --git a/src/hooks/jeecg/useAdaptiveWidth.ts b/src/hooks/jeecg/useAdaptiveWidth.ts
index 7722c82..2eb88ec 100644
--- a/src/hooks/jeecg/useAdaptiveWidth.ts
+++ b/src/hooks/jeecg/useAdaptiveWidth.ts
@@ -4,9 +4,9 @@
  * @time 2022-4-8
  * @author sunjianlei
  */
-import {ref} from 'vue'
-import {useDebounceFn, tryOnUnmounted} from '@vueuse/core'
-import {useEventListener} from '/@/hooks/event/useEventListener'
+import { ref } from 'vue';
+import { useDebounceFn, tryOnUnmounted } from '@vueuse/core';
+import { useEventListener } from '/@/hooks/event/useEventListener';
 
 // key = js运算符+数字
 const defWidthConfig: configType = {
@@ -15,71 +15,74 @@ const defWidthConfig: configType = {
   '<=1600': '600px',
   '<=1920': '600px',
   '>1920': '500px',
-}
+};
 
-type configType = Record<string, string | number>
+type configType = Record<string, string | number>;
 
 /**
  * 自适应宽度
- * 
+ *
  * @param widthConfig 宽度配置，可参考 defWidthConfig 配置
  * @param assign 是否合并默认配置
  * @param debounce 去抖毫秒数
  */
 export function useAdaptiveWidth(widthConfig = defWidthConfig, assign = true, debounce = 50) {
-  const widthConfigAssign = assign ? Object.assign({}, defWidthConfig, widthConfig) : widthConfig
-  const configKeys = Object.keys(widthConfigAssign)
+  const widthConfigAssign = assign ? Object.assign({}, defWidthConfig, widthConfig) : widthConfig;
+  const configKeys = Object.keys(widthConfigAssign);
 
-  const adaptiveWidth = ref<string | number>()
+  const adaptiveWidth = ref<string | number>();
 
   /**
    * 进行计算宽度
    * @param innerWidth
    */
   function calcWidth(innerWidth) {
-    let width
+    let width;
     for (const key of configKeys) {
       try {
         // 通过js运算
-        let flag = new Function(`return ${innerWidth} ${key}`)()
+        let flag = new Function(`return ${innerWidth} ${key}`)();
         if (flag) {
-          width = widthConfigAssign[key]
-          break
+          width = widthConfigAssign[key];
+          break;
         }
       } catch (e) {
-        console.error(e)
+        console.error(e);
       }
     }
     if (width) {
-      adaptiveWidth.value = width
+      adaptiveWidth.value = width;
     } else {
-      console.warn('没有找到匹配的自适应宽度')
+      console.warn('没有找到匹配的自适应宽度');
     }
   }
 
   // 初始计算
-  calcWidth(window.innerWidth)
+  calcWidth(window.innerWidth);
 
   // 监听 resize 事件
-  const {removeEvent} = useEventListener({
+  const { removeEvent } = useEventListener({
     el: window,
     name: 'resize',
     listener: useDebounceFn(() => calcWidth(window.innerWidth), debounce),
-  })
+  });
   // 卸载组件时取消监听事件
-  tryOnUnmounted(() => removeEvent())
+  tryOnUnmounted(() => removeEvent());
 
-  return {adaptiveWidth}
+  return { adaptiveWidth };
 }
 
 /**
  * 抽屉自适应宽度
  */
 export function useDrawerAdaptiveWidth() {
-  return useAdaptiveWidth({
-    '<=620': '100%',
-    '<=1600': 600,
-    '<=1920': 650,
-    '>1920': 700,
-  }, false)
+  return useAdaptiveWidth(
+    {
+      '<=620': '100%',
+      '<=1600': 600,
+      '<=1920': 650,
+      '>1920': 700,
+    },
+    false
+  );
 }
diff --git a/src/hooks/setting/index.ts b/src/hooks/setting/index.ts
index 67d5e92..70ab48d 100644
--- a/src/hooks/setting/index.ts
+++ b/src/hooks/setting/index.ts
@@ -27,13 +27,13 @@ export const useGlobSetting = (): Readonly<GlobConfig> => {
     domainUrl: VITE_GLOB_DOMAIN_URL,
     apiUrl: VITE_GLOB_API_URL,
     shortName: VITE_GLOB_APP_SHORT_NAME,
-    openSso:VITE_GLOB_APP_OPEN_SSO,
-    openQianKun:VITE_GLOB_APP_OPEN_QIANKUN,
-    casBaseUrl:VITE_GLOB_APP_CAS_BASE_URL,
+    openSso: VITE_GLOB_APP_OPEN_SSO,
+    openQianKun: VITE_GLOB_APP_OPEN_QIANKUN,
+    casBaseUrl: VITE_GLOB_APP_CAS_BASE_URL,
     urlPrefix: VITE_GLOB_API_URL_PREFIX,
     uploadUrl: VITE_GLOB_DOMAIN_URL,
     viewUrl: VITE_GLOB_ONLINE_VIEW_URL,
   };
-  window._CONFIG['domianURL'] = VITE_GLOB_DOMAIN_URL
+  window._CONFIG['domianURL'] = VITE_GLOB_DOMAIN_URL;
   return glob as Readonly<GlobConfig>;
 };
diff --git a/src/hooks/setting/useHeaderSetting.ts b/src/hooks/setting/useHeaderSetting.ts
index d590be8..4ed6023 100644
--- a/src/hooks/setting/useHeaderSetting.ts
+++ b/src/hooks/setting/useHeaderSetting.ts
@@ -14,34 +14,17 @@ export function useHeaderSetting() {
   const appStore = useAppStore();
 
   const getShowFullHeaderRef = computed(() => {
-    return (
-      !unref(getFullContent) &&
-      unref(getShowMixHeaderRef) &&
-      unref(getShowHeader) &&
-      !unref(getIsTopMenu) &&
-      !unref(getIsMixSidebar)
-    );
+    return !unref(getFullContent) && unref(getShowMixHeaderRef) && unref(getShowHeader) && !unref(getIsTopMenu) && !unref(getIsMixSidebar);
   });
 
   const getUnFixedAndFull = computed(() => !unref(getFixed) && !unref(getShowFullHeaderRef));
 
   const getShowInsetHeaderRef = computed(() => {
     const need = !unref(getFullContent) && unref(getShowHeader);
-    return (
-      (need && !unref(getShowMixHeaderRef)) ||
-      (need && unref(getIsTopMenu)) ||
-      (need && unref(getIsMixSidebar))
-    );
+    return (need && !unref(getShowMixHeaderRef)) || (need && unref(getIsTopMenu)) || (need && unref(getIsMixSidebar));
   });
 
-  const {
-    getMenuMode,
-    getSplit,
-    getShowHeaderTrigger,
-    getIsSidebarType,
-    getIsMixSidebar,
-    getIsTopMenu,
-  } = useMenuSetting();
+  const { getMenuMode, getSplit, getShowHeaderTrigger, getIsSidebarType, getIsMixSidebar, getIsTopMenu } = useMenuSetting();
   const { getShowBreadCrumb, getShowLogo } = useRootSetting();
 
   const getShowMixHeaderRef = computed(() => !unref(getIsSidebarType) && unref(getShowHeader));
@@ -65,9 +48,7 @@ export function useHeaderSetting() {
   const getShowNotice = computed(() => appStore.getHeaderSetting.showNotice);
 
   const getShowBread = computed(() => {
-    return (
-      unref(getMenuMode) !== MenuModeEnum.HORIZONTAL && unref(getShowBreadCrumb) && !unref(getSplit)
-    );
+    return unref(getMenuMode) !== MenuModeEnum.HORIZONTAL && unref(getShowBreadCrumb) && !unref(getSplit);
   });
 
   const getShowHeaderLogo = computed(() => {
diff --git a/src/hooks/setting/useMenuSetting.ts b/src/hooks/setting/useMenuSetting.ts
index 442cbb2..a6da699 100644
--- a/src/hooks/setting/useMenuSetting.ts
+++ b/src/hooks/setting/useMenuSetting.ts
@@ -15,10 +15,7 @@ export function useMenuSetting() {
   const appStore = useAppStore();
 
   const getShowSidebar = computed(() => {
-    return (
-      unref(getSplit) ||
-      (unref(getShowMenu) && unref(getMenuMode) !== MenuModeEnum.HORIZONTAL && !unref(fullContent))
-    );
+    return unref(getSplit) || (unref(getShowMenu) && unref(getMenuMode) !== MenuModeEnum.HORIZONTAL && !unref(fullContent));
   });
 
   const getCollapsed = computed(() => appStore.getMenuSetting.collapsed);
@@ -53,9 +50,7 @@ export function useMenuSetting() {
 
   const getTopMenuAlign = computed(() => appStore.getMenuSetting.topMenuAlign);
 
-  const getCloseMixSidebarOnChange = computed(
-    () => appStore.getMenuSetting.closeMixSidebarOnChange
-  );
+  const getCloseMixSidebarOnChange = computed(() => appStore.getMenuSetting.closeMixSidebarOnChange);
 
   const getIsSidebarType = computed(() => unref(getMenuType) === MenuTypeEnum.SIDEBAR);
 
@@ -68,11 +63,7 @@ export function useMenuSetting() {
   });
 
   const getShowHeaderTrigger = computed(() => {
-    if (
-      unref(getMenuType) === MenuTypeEnum.TOP_MENU ||
-      !unref(getShowMenu) ||
-      unref(getMenuHidden)
-    ) {
+    if (unref(getMenuType) === MenuTypeEnum.TOP_MENU || !unref(getShowMenu) || unref(getMenuHidden)) {
       return false;
     }
 
@@ -93,9 +84,7 @@ export function useMenuSetting() {
 
   const getRealWidth = computed(() => {
     if (unref(getIsMixSidebar)) {
-      return unref(getCollapsed) && !unref(getMixSideFixed)
-        ? unref(getMiniWidthNumber)
-        : unref(getMenuWidth);
+      return unref(getCollapsed) && !unref(getMixSideFixed) ? unref(getMiniWidthNumber) : unref(getMenuWidth);
     }
     return unref(getCollapsed) ? unref(getMiniWidthNumber) : unref(getMenuWidth);
   });
@@ -110,8 +99,7 @@ export function useMenuSetting() {
       unref(getIsTopMenu) || !unref(getShowMenu) || (unref(getSplit) && unref(getMenuHidden))
         ? 0
         : unref(getIsMixSidebar)
-        ? (unref(getCollapsed) ? SIDE_BAR_MINI_WIDTH : SIDE_BAR_SHOW_TIT_MINI_WIDTH) +
-          (unref(getMixSideFixed) && unref(mixSideHasChildren) ? unref(getRealWidth) : 0)
+        ? (unref(getCollapsed) ? SIDE_BAR_MINI_WIDTH : SIDE_BAR_SHOW_TIT_MINI_WIDTH) + (unref(getMixSideFixed) && unref(mixSideHasChildren) ? unref(getRealWidth) : 0)
         : unref(getRealWidth);
 
     return `calc(100% - ${unref(width)}px)`;
diff --git a/src/hooks/setting/useRootSetting.ts b/src/hooks/setting/useRootSetting.ts
index e08394c..1fc16d1 100644
--- a/src/hooks/setting/useRootSetting.ts
+++ b/src/hooks/setting/useRootSetting.ts
@@ -5,10 +5,7 @@ import { computed } from 'vue';
 import { useAppStore } from '/@/store/modules/app';
 import { ContentEnum, ThemeEnum } from '/@/enums/appEnum';
 
-type RootSetting = Omit<
-  ProjectConfig,
-  'locale' | 'headerSetting' | 'menuSetting' | 'multiTabsSetting'
->;
+type RootSetting = Omit<ProjectConfig, 'locale' | 'headerSetting' | 'menuSetting' | 'multiTabsSetting'>;
 
 export function useRootSetting() {
   const appStore = useAppStore();
@@ -53,11 +50,7 @@ export function useRootSetting() {
 
   const getDarkMode = computed(() => appStore.getDarkMode);
 
-  const getLayoutContentMode = computed(() =>
-    appStore.getProjectConfig.contentMode === ContentEnum.FULL
-      ? ContentEnum.FULL
-      : ContentEnum.FIXED
-  );
+  const getLayoutContentMode = computed(() => (appStore.getProjectConfig.contentMode === ContentEnum.FULL ? ContentEnum.FULL : ContentEnum.FIXED));
 
   function setRootSetting(setting: Partial<RootSetting>) {
     appStore.setProjectConfig(setting);
diff --git a/src/hooks/system/useAutoAdapt.ts b/src/hooks/system/useAutoAdapt.ts
index 45fea09..7f5c71b 100644
--- a/src/hooks/system/useAutoAdapt.ts
+++ b/src/hooks/system/useAutoAdapt.ts
@@ -1,51 +1,51 @@
-import { ref } from "vue";
+import { ref } from 'vue';
 import { ScreenSizeEnum } from '/@/enums/sizeEnum';
 import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn';
 // 定义 useAdapt 方法参数
 interface AdaptOptions {
-    // xl>1200
-    xl?: string | number,
-    // xl>992
-    lg?: string | number,
-    // xl>768
-    md?: string | number,
-    // xl>576
-    sm?: string | number,
-    // xl>480
-    xs?: string | number,
-    //xl<480默认值
-    mindef?: string | number,
-    //默认值
-    def?: string | number,
+  // xl>1200
+  xl?: string | number;
+  // xl>992
+  lg?: string | number;
+  // xl>768
+  md?: string | number;
+  // xl>576
+  sm?: string | number;
+  // xl>480
+  xs?: string | number;
+  //xl<480默认值
+  mindef?: string | number;
+  //默认值
+  def?: string | number;
 }
-export function useAdapt(props?:AdaptOptions) {
-    //默认宽度
-    const width = ref<string | number>(props?.def||'600px');
-    //获取宽度
-    useWindowSizeFn(calcWidth,100,{ immediate: true  });
-    //计算宽度
-    function calcWidth(){
-        let windowWidth = document.documentElement.clientWidth;
-        switch (true) {
-            case windowWidth > ScreenSizeEnum.XL:
-                width.value = props?.xl||'600px';
-                break;
-            case windowWidth > ScreenSizeEnum.LG:
-                width.value = props?.lg||'600px';
-                break;
-            case windowWidth > ScreenSizeEnum.MD:
-                width.value = props?.md||'600px';
-                break;
-            case windowWidth > ScreenSizeEnum.SM:
-                width.value = props?.sm||'500px';
-                break;
-            case windowWidth > ScreenSizeEnum.XS:
-                width.value = props?.xs||'400px';
-                break;
-            default:
-                width.value = props?.mindef||'300px';
-                break;
-        }
+export function useAdapt(props?: AdaptOptions) {
+  //默认宽度
+  const width = ref<string | number>(props?.def || '600px');
+  //获取宽度
+  useWindowSizeFn(calcWidth, 100, { immediate: true });
+  //计算宽度
+  function calcWidth() {
+    let windowWidth = document.documentElement.clientWidth;
+    switch (true) {
+      case windowWidth > ScreenSizeEnum.XL:
+        width.value = props?.xl || '600px';
+        break;
+      case windowWidth > ScreenSizeEnum.LG:
+        width.value = props?.lg || '600px';
+        break;
+      case windowWidth > ScreenSizeEnum.MD:
+        width.value = props?.md || '600px';
+        break;
+      case windowWidth > ScreenSizeEnum.SM:
+        width.value = props?.sm || '500px';
+        break;
+      case windowWidth > ScreenSizeEnum.XS:
+        width.value = props?.xs || '400px';
+        break;
+      default:
+        width.value = props?.mindef || '300px';
+        break;
     }
-    return {width,calcWidth};
+  }
+  return { width, calcWidth };
 }
diff --git a/src/hooks/system/useJvxeMethods.ts b/src/hooks/system/useJvxeMethods.ts
index 7f393ea..d45f40d 100644
--- a/src/hooks/system/useJvxeMethods.ts
+++ b/src/hooks/system/useJvxeMethods.ts
@@ -1,81 +1,88 @@
-import {defHttp} from '/@/utils/http/axios';
-import {ref,unref} from 'vue';
-import { VALIDATE_FAILED,validateFormModelAndTables} from '/@/utils/common/vxeUtils'
+import { defHttp } from '/@/utils/http/axios';
+import { ref, unref } from 'vue';
+import { VALIDATE_FAILED, validateFormModelAndTables } from '/@/utils/common/vxeUtils';
 
-export function useJvxeMethod(requestAddOrEdit,classifyIntoFormData,tableRefs,activeKey,refKeys,validateSubForm?) {
-    const formRef = ref();
-    /** 查询某个tab的数据 */
-    function requestSubTableData(url, params, tab, success) {
-        tab.loading = true
-        defHttp.get({url, params},{isTransformResponse:false}).then(res => {
-            let { result } = res;
-            if (res.success && result) {
-                if (Array.isArray(result)) {
-                    tab.dataSource = result
-                } else if (Array.isArray(result.records)) {
-                    tab.dataSource = result.records
-                }
-            }
-            typeof success === 'function' ? success(res) : ''
-        }).finally(() => {
-            tab.loading = false
-        })
-    }
+export function useJvxeMethod(requestAddOrEdit, classifyIntoFormData, tableRefs, activeKey, refKeys, validateSubForm?) {
+  const formRef = ref();
+  /** 查询某个tab的数据 */
+  function requestSubTableData(url, params, tab, success) {
+    tab.loading = true;
+    defHttp
+      .get({ url, params }, { isTransformResponse: false })
+      .then((res) => {
+        let { result } = res;
+        if (res.success && result) {
+          if (Array.isArray(result)) {
+            tab.dataSource = result;
+          } else if (Array.isArray(result.records)) {
+            tab.dataSource = result.records;
+          }
+        }
+        typeof success === 'function' ? success(res) : '';
+      })
+      .finally(() => {
+        tab.loading = false;
+      });
+  }
 
-    /* --- handle 事件 --- */
+  /* --- handle 事件 --- */
 
-    /** ATab 选项卡切换事件 */
-    function handleChangeTabs(key) {
-        // 自动重置scrollTop状态，防止出现白屏
-        tableRefs[key]?.value?.resetScrollTop(0);
-    }
+  /** ATab 选项卡切换事件 */
+  function handleChangeTabs(key) {
+    // 自动重置scrollTop状态，防止出现白屏
+    tableRefs[key]?.value?.resetScrollTop(0);
+  }
 
-    /** 获取所有的editableTable实例*/
-    function getAllTable() {
-        let values = Object.values(tableRefs);
-        return Promise.all(values)
-    }
-    /** 确定按钮点击事件 */
-    function handleSubmit() {
-        /** 触发表单验证 */
-        getAllTable().then(tables => {
-            let values = formRef.value.getFieldsValue()
-            return validateFormModelAndTables(formRef.value.validate,values,tables)
-        }).then(allValues => {
-            /** 一次性验证一对一的所有子表 */
-            return (validateSubForm && typeof validateSubForm === 'function')?validateSubForm(allValues):validateAllSubOne(allValues)
-        }).then(allValues => {
-            if (typeof classifyIntoFormData !== 'function') {
-                throw throwNotFunction('classifyIntoFormData')
-            }
-            let formData = classifyIntoFormData(allValues)
-            // 发起请求
-            return requestAddOrEdit(formData)
-        }).catch(e => {
-            if (e.error === VALIDATE_FAILED) {
-                // 如果有未通过表单验证的子表，就自动跳转到它所在的tab
-                activeKey.value = e.index == null ? unref(activeKey) : refKeys.value[e.index]
-            } else {
-                console.error(e)
-            }
-        })
-    }
-    //校验所有子表表单
-    function validateAllSubOne(allValues){
-        return new Promise((resolve) => {
-            resolve(allValues)
-        })
-    }
-    /* --- throw --- */
+  /** 获取所有的editableTable实例*/
+  function getAllTable() {
+    let values = Object.values(tableRefs);
+    return Promise.all(values);
+  }
+  /** 确定按钮点击事件 */
+  function handleSubmit() {
+    /** 触发表单验证 */
+    getAllTable()
+      .then((tables) => {
+        let values = formRef.value.getFieldsValue();
+        return validateFormModelAndTables(formRef.value.validate, values, tables);
+      })
+      .then((allValues) => {
+        /** 一次性验证一对一的所有子表 */
+        return validateSubForm && typeof validateSubForm === 'function' ? validateSubForm(allValues) : validateAllSubOne(allValues);
+      })
+      .then((allValues) => {
+        if (typeof classifyIntoFormData !== 'function') {
+          throw throwNotFunction('classifyIntoFormData');
+        }
+        let formData = classifyIntoFormData(allValues);
+        // 发起请求
+        return requestAddOrEdit(formData);
+      })
+      .catch((e) => {
+        if (e.error === VALIDATE_FAILED) {
+          // 如果有未通过表单验证的子表，就自动跳转到它所在的tab
+          activeKey.value = e.index == null ? unref(activeKey) : refKeys.value[e.index];
+        } else {
+          console.error(e);
+        }
+      });
+  }
+  //校验所有子表表单
+  function validateAllSubOne(allValues) {
+    return new Promise((resolve) => {
+      resolve(allValues);
+    });
+  }
+  /* --- throw --- */
 
-    /** not a function */
-    function throwNotFunction(name) {
-        return `${name} 未定义或不是一个函数`
-    }
+  /** not a function */
+  function throwNotFunction(name) {
+    return `${name} 未定义或不是一个函数`;
+  }
 
-    /** not a array */
-    function throwNotArray(name) {
-        return `${name} 未定义或不是一个数组`
-    }
-    return [handleChangeTabs,handleSubmit,requestSubTableData,formRef]
+  /** not a array */
+  function throwNotArray(name) {
+    return `${name} 未定义或不是一个数组`;
+  }
+  return [handleChangeTabs, handleSubmit, requestSubTableData, formRef];
 }
diff --git a/src/hooks/system/useListPage.ts b/src/hooks/system/useListPage.ts
index 4547530..1cae6a1 100644
--- a/src/hooks/system/useListPage.ts
+++ b/src/hooks/system/useListPage.ts
@@ -1,46 +1,46 @@
-import { reactive, ref, Ref } from 'vue'
-import { merge } from 'lodash-es'
-import { DynamicProps } from '/#/utils'
-import { BasicTableProps, TableActionType, useTable } from '/@/components/Table'
-import { ColEx } from '/@/components/Form/src/types'
-import { FormActionType } from '/@/components/Form'
-import { useMessage } from '/@/hooks/web/useMessage'
-import { useMethods } from '/@/hooks/system/useMethods'
-import { useDesign } from '/@/hooks/web/useDesign'
-import { filterObj } from '/@/utils/common/compUtils'
-const { handleExportXls, handleImportXls } = useMethods()
+import { reactive, ref, Ref } from 'vue';
+import { merge } from 'lodash-es';
+import { DynamicProps } from '/#/utils';
+import { BasicTableProps, TableActionType, useTable } from '/@/components/Table';
+import { ColEx } from '/@/components/Form/src/types';
+import { FormActionType } from '/@/components/Form';
+import { useMessage } from '/@/hooks/web/useMessage';
+import { useMethods } from '/@/hooks/system/useMethods';
+import { useDesign } from '/@/hooks/web/useDesign';
+import { filterObj } from '/@/utils/common/compUtils';
+const { handleExportXls, handleImportXls } = useMethods();
 
 // 定义 useListPage 方法所需参数
 interface ListPageOptions {
   // 样式作用域范围
-  designScope?: string,
+  designScope?: string;
   // 【必填】表格参数配置
-  tableProps: TableProps,
+  tableProps: TableProps;
   // 分页
-  pagination?: boolean,
+  pagination?: boolean;
   // 导出配置
   exportConfig?: {
-    url: string,
+    url: string;
     // 导出文件名
-    name?: string | (() => string),
+    name?: string | (() => string);
     //导出参数
-    params?: object,
-  }
+    params?: object;
+  };
   // 导入配置
   importConfig?: {
-    url: string,
+    url: string;
     // 导出成功后的回调
-    success?: (fileInfo?: any) => void
-  }
+    success?: (fileInfo?: any) => void;
+  };
 }
 
 interface IDoRequestOptions {
   // 是否显示确认对话框，默认 true
-  confirm?: boolean,
+  confirm?: boolean;
   // 是否自动刷新表格，默认 true
-  reload?: boolean,
+  reload?: boolean;
   // 是否自动清空选择，默认 true
-  clearSelection?: boolean,
+  clearSelection?: boolean;
 }
 
 /**
@@ -49,46 +49,46 @@ interface IDoRequestOptions {
  * @param options
  */
 export function useListPage(options: ListPageOptions) {
-  const $message = useMessage()
-  let $design = {} as ReturnType<typeof useDesign>
+  const $message = useMessage();
+  let $design = {} as ReturnType<typeof useDesign>;
   if (options.designScope) {
-    $design = useDesign(options.designScope)
+    $design = useDesign(options.designScope);
   }
 
-  const tableContext = useListTable(options.tableProps)
+  const tableContext = useListTable(options.tableProps);
 
-  const [, { getForm, reload, setLoading }, { selectedRowKeys }] = tableContext
+  const [, { getForm, reload, setLoading }, { selectedRowKeys }] = tableContext;
 
   // 导出 excel
   async function onExportXls() {
     //update-begin---author:wangshuai ---date:20220411  for：导出新增自定义参数------------
-    let { url, name,params } = options?.exportConfig ?? {}
+    let { url, name, params } = options?.exportConfig ?? {};
     if (url) {
-      let title = typeof name === 'function' ? name() : name
-      let paramsForm = await getForm().validate()
+      let title = typeof name === 'function' ? name() : name;
+      let paramsForm = await getForm().validate();
       //如果参数不为空，则整合到一起
-      if(params){
-        paramsForm = Object.assign({},paramsForm,params);
+      if (params) {
+        paramsForm = Object.assign({}, paramsForm, params);
       }
-      if(selectedRowKeys.value && selectedRowKeys.value.length>0){
-        paramsForm['selections'] = selectedRowKeys.value.join(",")
+      if (selectedRowKeys.value && selectedRowKeys.value.length > 0) {
+        paramsForm['selections'] = selectedRowKeys.value.join(',');
       }
-      return handleExportXls(title as string, url,filterObj(paramsForm))
-     //update-end---author:wangshuai ---date:20220411  for：导出新增自定义参数--------------
+      return handleExportXls(title as string, url, filterObj(paramsForm));
+      //update-end---author:wangshuai ---date:20220411  for：导出新增自定义参数--------------
     } else {
-      $message.createMessage.warn('没有传递 exportConfig.url 参数')
-      return Promise.reject()
+      $message.createMessage.warn('没有传递 exportConfig.url 参数');
+      return Promise.reject();
     }
   }
 
   // 导入 excel
   function onImportXls(file) {
-    let { url,success } = options?.importConfig ?? {}
+    let { url, success } = options?.importConfig ?? {};
     if (url) {
-      return handleImportXls(file, url, success||reload)
+      return handleImportXls(file, url, success || reload);
     } else {
-      $message.createMessage.warn('没有传递 importConfig.url 参数')
-      return Promise.reject()
+      $message.createMessage.warn('没有传递 importConfig.url 参数');
+      return Promise.reject();
     }
   }
 
@@ -101,21 +101,21 @@ export function useListPage(options: ListPageOptions) {
     return new Promise((resolve, reject) => {
       const execute = async () => {
         try {
-          setLoading(true)
-          const res = await api()
+          setLoading(true);
+          const res = await api();
           if (options?.reload ?? true) {
-            reload()
+            reload();
           }
           if (options?.clearSelection ?? true) {
-            selectedRowKeys.value = []
+            selectedRowKeys.value = [];
           }
-          resolve(res)
+          resolve(res);
         } catch (e) {
-          reject(e)
+          reject(e);
         } finally {
-          setLoading(false)
+          setLoading(false);
         }
-      }
+      };
       if (options?.confirm ?? true) {
         $message.createConfirm({
           iconType: 'warning',
@@ -123,16 +123,16 @@ export function useListPage(options: ListPageOptions) {
           content: '确定要删除吗？',
           onOk: () => execute(),
           onCancel: () => reject(),
-        })
+        });
       } else {
-        execute()
+        execute();
       }
-    })
+    });
   }
 
   /** 执行单个删除操作 */
   function doDeleteRecord(api: () => Promise<any>) {
-    return doRequest(api, { confirm: false, clearSelection: false })
+    return doRequest(api, { confirm: false, clearSelection: false });
   }
 
   return {
@@ -143,7 +143,7 @@ export function useListPage(options: ListPageOptions) {
     doRequest,
     doDeleteRecord,
     tableContext,
-  }
+  };
 }
 
 // 定义表格所需参数
@@ -159,13 +159,13 @@ type UseTableMethod = TableActionType & {
  */
 export function useListTable(tableProps: TableProps): [
   (instance: TableActionType, formInstance: UseTableMethod) => void,
-    TableActionType & {
+  TableActionType & {
     getForm: () => FormActionType;
   },
   {
-    rowSelection: any,
-    selectedRows: Ref<Recordable[]>
-    selectedRowKeys: Ref<any[]>
+    rowSelection: any;
+    selectedRows: Ref<Recordable[]>;
+    selectedRowKeys: Ref<any[]>;
   }
 ] {
   // 自适应列配置
@@ -176,7 +176,7 @@ export function useListTable(tableProps: TableProps): [
     lg: 8, // ≥992px
     xl: 8, // ≥1200px
     xxl: 6, // ≥1600px
-  }
+  };
   const defaultTableProps: TableProps = {
     rowKey: 'id',
     // 使用查询条件区域
@@ -243,37 +243,37 @@ export function useListTable(tableProps: TableProps): [
       dataIndex: 'action',
       slots: { customRender: 'action' },
     },
-  }
+  };
   // 合并用户个性化配置
   if (tableProps) {
     // merge 方法可深度合并对象
-    merge(defaultTableProps, tableProps)
+    merge(defaultTableProps, tableProps);
   }
 
   // 发送请求之前调用的方法
   function beforeFetch(params) {
     // 默认以 createTime 降序排序
-    return Object.assign({ column: 'createTime', order: 'desc' }, params)
+    return Object.assign({ column: 'createTime', order: 'desc' }, params);
   }
 
   // 合并方法
-  Object.assign(defaultTableProps, { beforeFetch })
+  Object.assign(defaultTableProps, { beforeFetch });
   if (typeof tableProps.beforeFetch === 'function') {
     defaultTableProps.beforeFetch = function (params) {
-      params = beforeFetch(params)
+      params = beforeFetch(params);
       // @ts-ignore
-      tableProps.beforeFetch(params)
-      return params
-    }
+      tableProps.beforeFetch(params);
+      return params;
+    };
   }
 
   // 当前选择的行
-  const selectedRowKeys = ref<any[]>([])
+  const selectedRowKeys = ref<any[]>([]);
   // 选择的行记录
-  const selectedRows = ref<Recordable[]>([])
+  const selectedRows = ref<Recordable[]>([]);
 
   // 表格选择列配置
-  const rowSelection: any = tableProps?.rowSelection ?? {}
+  const rowSelection: any = tableProps?.rowSelection ?? {};
   const defaultRowSelection = reactive({
     ...rowSelection,
     type: rowSelection.type ?? 'checkbox',
@@ -282,14 +282,14 @@ export function useListTable(tableProps: TableProps): [
     selectedRows: selectedRows,
     selectedRowKeys: selectedRowKeys,
     onChange(...args) {
-      selectedRowKeys.value = args[0]
-      selectedRows.value = args[1]
+      selectedRowKeys.value = args[0];
+      selectedRows.value = args[1];
       if (typeof rowSelection.onChange === 'function') {
-        rowSelection.onChange(...args)
+        rowSelection.onChange(...args);
       }
     },
-  })
-  delete defaultTableProps.rowSelection
+  });
+  delete defaultTableProps.rowSelection;
 
   return [
     ...useTable(defaultTableProps),
@@ -298,5 +298,5 @@ export function useListTable(tableProps: TableProps): [
       selectedRowKeys,
       rowSelection: defaultRowSelection,
     },
-  ]
+  ];
 }
diff --git a/src/hooks/system/useMethods.ts b/src/hooks/system/useMethods.ts
index 44a1c7c..6871de2 100644
--- a/src/hooks/system/useMethods.ts
+++ b/src/hooks/system/useMethods.ts
@@ -1,18 +1,18 @@
-import {defHttp} from "/@/utils/http/axios";
-import {useMessage} from '/@/hooks/web/useMessage';
-import {useGlobSetting} from '/@/hooks/setting';
+import { defHttp } from '/@/utils/http/axios';
+import { useMessage } from '/@/hooks/web/useMessage';
+import { useGlobSetting } from '/@/hooks/setting';
 
-const {createMessage, createWarningModal} = useMessage();
+const { createMessage, createWarningModal } = useMessage();
 const glob = useGlobSetting();
 
 /**
  * 导出文件xlsx的mime-type
  */
-export const XLSX_MIME_TYPE = "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
+export const XLSX_MIME_TYPE = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
 /**
  * 导出文件xlsx的文件后缀
  */
-export const XLSX_FILE_SUFFIX = ".xlsx";
+export const XLSX_FILE_SUFFIX = '.xlsx';
 
 export function useMethods() {
   /**
@@ -20,31 +20,31 @@ export function useMethods() {
    * @param name
    * @param url
    */
-  async function exportXls(name,url,params, isXlsx=false) {
-    const data = await defHttp.get({url: url, params:params,responseType: 'blob'}, {isTransformResponse: false})
+  async function exportXls(name, url, params, isXlsx = false) {
+    const data = await defHttp.get({ url: url, params: params, responseType: 'blob' }, { isTransformResponse: false });
     if (!data) {
-      createMessage.warning("文件下载失败")
-      return
+      createMessage.warning('文件下载失败');
+      return;
     }
-    if(!name || typeof name != "string"){
-      name = "导出文件"
+    if (!name || typeof name != 'string') {
+      name = '导出文件';
     }
-    let blobOptions = { type: 'application/vnd.ms-excel' }
-    let fileSuffix = '.xls'
-    if(isXlsx===true){
-      blobOptions['type'] = XLSX_MIME_TYPE
-      fileSuffix = XLSX_FILE_SUFFIX
+    let blobOptions = { type: 'application/vnd.ms-excel' };
+    let fileSuffix = '.xls';
+    if (isXlsx === true) {
+      blobOptions['type'] = XLSX_MIME_TYPE;
+      fileSuffix = XLSX_FILE_SUFFIX;
     }
     if (typeof window.navigator.msSaveBlob !== 'undefined') {
-      window.navigator.msSaveBlob(new Blob([data], blobOptions), name + fileSuffix)
+      window.navigator.msSaveBlob(new Blob([data], blobOptions), name + fileSuffix);
     } else {
-      let url = window.URL.createObjectURL(new Blob([data], blobOptions))
-      let link = document.createElement('a')
-      link.style.display = 'none'
-      link.href = url
-      link.setAttribute('download', name + fileSuffix)
-      document.body.appendChild(link)
-      link.click()
+      let url = window.URL.createObjectURL(new Blob([data], blobOptions));
+      let link = document.createElement('a');
+      link.style.display = 'none';
+      link.href = url;
+      link.setAttribute('download', name + fileSuffix);
+      document.body.appendChild(link);
+      link.click();
       document.body.removeChild(link); //下载完成移除元素
       window.URL.revokeObjectURL(url); //释放掉blob对象
     }
@@ -58,35 +58,38 @@ export function useMethods() {
    */
   async function importXls(data, url, success) {
     const isReturn = (fileInfo) => {
-        try{
-            if (fileInfo.code === 201) {
-                let {message, result: {msg, fileUrl, fileName}} = fileInfo
-                let href = glob.uploadUrl + fileUrl;
-                createWarningModal({
-                    title: message,
-                    centered:false,
-                    content: `<div>
+      try {
+        if (fileInfo.code === 201) {
+          let {
+            message,
+            result: { msg, fileUrl, fileName },
+          } = fileInfo;
+          let href = glob.uploadUrl + fileUrl;
+          createWarningModal({
+            title: message,
+            centered: false,
+            content: `<div>
                                 <span>${msg}</span><br/> 
                                 <span>具体详情请<a href = ${href} download = ${fileName}> 点击下载 </a> </span> 
-                              </div>`
-                })
-            } else if (fileInfo.code === 500) {
-                createMessage.error(fileInfo.message || `${data.file.name} 导入失败`)
-            } else {
-                createMessage.success(fileInfo.message || `${data.file.name} 文件上传成功`)
-            }
-        } catch (error) {
-            console.log("导入的数据异常",error)
-        }finally{
-            typeof success === 'function' ? success(fileInfo) : ''
+                              </div>`,
+          });
+        } else if (fileInfo.code === 500) {
+          createMessage.error(fileInfo.message || `${data.file.name} 导入失败`);
+        } else {
+          createMessage.success(fileInfo.message || `${data.file.name} 文件上传成功`);
         }
+      } catch (error) {
+        console.log('导入的数据异常', error);
+      } finally {
+        typeof success === 'function' ? success(fileInfo) : '';
+      }
     };
-    await defHttp.uploadFile({url}, {file: data.file},{success:isReturn});
+    await defHttp.uploadFile({ url }, { file: data.file }, { success: isReturn });
   }
 
   return {
-    handleExportXls: (name: string, url: string,params?:object) => exportXls(name, url,params),
+    handleExportXls: (name: string, url: string, params?: object) => exportXls(name, url, params),
     handleImportXls: (data, url, success) => importXls(data, url, success),
-    handleExportXlsx: (name: string, url: string, params?:object) => exportXls(name, url,params, true),
+    handleExportXlsx: (name: string, url: string, params?: object) => exportXls(name, url, params, true),
   };
 }
diff --git a/src/hooks/system/useThirdLogin.ts b/src/hooks/system/useThirdLogin.ts
index 8a33fbe..3566d79 100644
--- a/src/hooks/system/useThirdLogin.ts
+++ b/src/hooks/system/useThirdLogin.ts
@@ -1,174 +1,190 @@
-import {ref, unref} from "vue";
+import { ref, unref } from 'vue';
 import { defHttp } from '/@/utils/http/axios';
-import {useGlobSetting} from '/@/hooks/setting';
-import {useMessage} from '/@/hooks/web/useMessage';
-import {useUserStore} from '/@/store/modules/user';
-import { setThirdCaptcha,getCaptcha } from '/@/api/sys/user';
-import {useI18n} from '/@/hooks/web/useI18n';
+import { useGlobSetting } from '/@/hooks/setting';
+import { useMessage } from '/@/hooks/web/useMessage';
+import { useUserStore } from '/@/store/modules/user';
+import { setThirdCaptcha, getCaptcha } from '/@/api/sys/user';
+import { useI18n } from '/@/hooks/web/useI18n';
 
 export function useThirdLogin() {
-    const {createMessage,notification} = useMessage();
-    const {t} = useI18n();
-    const glob = useGlobSetting();
-    const userStore = useUserStore();
-    //第三方类型
-    const thirdType = ref('');
-    //第三方登录相关信息
-    const thirdLoginInfo = ref<any>({});
-    //状态
-    const thirdLoginState = ref(false);
-    //绑定手机号弹窗
-    const bindingPhoneModal = ref(false);
-    //第三方用户UUID
-    const thirdUserUuid = ref('');
-    //提示窗
-    const thirdConfirmShow = ref(false);
-    //绑定密码弹窗
-    const thirdPasswordShow = ref(false);
-    //绑定密码
-    const thirdLoginPassword = ref('');
-    //绑定用户
-    const thirdLoginUser = ref('');
-    //加载中
-    const thirdCreateUserLoding = ref(false);
-    //绑定手机号
-    const thirdPhone = ref('');
-    //验证码
-    const thirdCaptcha = ref('');
-    //第三方登录
-    function onThirdLogin(source) {
-        let url = `${glob.uploadUrl}/sys/thirdLogin/render/${source}`;
-        window.open(url, `login ${source}`, 'height=500, width=500, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=n o, status=no')
-        thirdType.value = source;
-        thirdLoginInfo.value = {};
-        thirdLoginState.value = false;
-        let receiveMessage = function (event) {
-            let token = event.data;
-            if (typeof token === 'string') {
-                //如果是字符串类型 说明是token信息
-                if (token === '登录失败') {
-                    createMessage.warning(token)
-                } else if (token.includes('绑定手机号')) {
-                    bindingPhoneModal.value = true;
-                    let strings = token.split(',');
-                    thirdUserUuid.value = strings[1];
-                } else {
-                    doThirdLogin(token)
-                }
-            } else if (typeof token === 'object') {
-                //对象类型 说明需要提示是否绑定现有账号
-                if (token['isObj'] === true) {
-                    thirdConfirmShow.value = true;
-                    thirdLoginInfo.value = {...token}
-                }
-            } else {
-                createMessage.warning('不识别的信息传递')
-            }
-        };
-        window.addEventListener('message', receiveMessage, false)
-    }
-   // 根据token执行登录
-    function doThirdLogin(token) {
-        if (unref(thirdLoginState) === false) {
-            thirdLoginState.value = true;
-            userStore.ThirdLogin({token,thirdType:unref(thirdType)}).then(res => {
-                console.log("res====>doThirdLogin",res)
-                if(res&&res.userInfo){
-                    notification.success({
-                        message: t('sys.login.loginSuccessTitle'),
-                        description: `${t('sys.login.loginSuccessDesc')}: ${res.userInfo.realname}`,
-                        duration: 3,
-                    });
-                }else{
-                    requestFailed(res)
-                }
-            })
+  const { createMessage, notification } = useMessage();
+  const { t } = useI18n();
+  const glob = useGlobSetting();
+  const userStore = useUserStore();
+  //第三方类型
+  const thirdType = ref('');
+  //第三方登录相关信息
+  const thirdLoginInfo = ref<any>({});
+  //状态
+  const thirdLoginState = ref(false);
+  //绑定手机号弹窗
+  const bindingPhoneModal = ref(false);
+  //第三方用户UUID
+  const thirdUserUuid = ref('');
+  //提示窗
+  const thirdConfirmShow = ref(false);
+  //绑定密码弹窗
+  const thirdPasswordShow = ref(false);
+  //绑定密码
+  const thirdLoginPassword = ref('');
+  //绑定用户
+  const thirdLoginUser = ref('');
+  //加载中
+  const thirdCreateUserLoding = ref(false);
+  //绑定手机号
+  const thirdPhone = ref('');
+  //验证码
+  const thirdCaptcha = ref('');
+  //第三方登录
+  function onThirdLogin(source) {
+    let url = `${glob.uploadUrl}/sys/thirdLogin/render/${source}`;
+    window.open(url, `login ${source}`, 'height=500, width=500, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=n o, status=no');
+    thirdType.value = source;
+    thirdLoginInfo.value = {};
+    thirdLoginState.value = false;
+    let receiveMessage = function (event) {
+      let token = event.data;
+      if (typeof token === 'string') {
+        //如果是字符串类型 说明是token信息
+        if (token === '登录失败') {
+          createMessage.warning(token);
+        } else if (token.includes('绑定手机号')) {
+          bindingPhoneModal.value = true;
+          let strings = token.split(',');
+          thirdUserUuid.value = strings[1];
+        } else {
+          doThirdLogin(token);
         }
+      } else if (typeof token === 'object') {
+        //对象类型 说明需要提示是否绑定现有账号
+        if (token['isObj'] === true) {
+          thirdConfirmShow.value = true;
+          thirdLoginInfo.value = { ...token };
+        }
+      } else {
+        createMessage.warning('不识别的信息传递');
+      }
+    };
+    window.addEventListener('message', receiveMessage, false);
+  }
+  // 根据token执行登录
+  function doThirdLogin(token) {
+    if (unref(thirdLoginState) === false) {
+      thirdLoginState.value = true;
+      userStore.ThirdLogin({ token, thirdType: unref(thirdType) }).then((res) => {
+        console.log('res====>doThirdLogin', res);
+        if (res && res.userInfo) {
+          notification.success({
+            message: t('sys.login.loginSuccessTitle'),
+            description: `${t('sys.login.loginSuccessDesc')}: ${res.userInfo.realname}`,
+            duration: 3,
+          });
+        } else {
+          requestFailed(res);
+        }
+      });
     }
+  }
 
-    function requestFailed (err) {
-        notification.error({
-            message: '登录失败',
-            description: ((err.response || {}).data || {}).message || err.message || "请求出现错误，请稍后再试",
-            duration: 4,
-        });
-    }
-    // 绑定已有账号 需要输入密码
-    function thirdLoginUserBind() {
-        thirdLoginPassword.value = ''
-        thirdLoginUser.value = thirdLoginInfo.value.uuid;
-        thirdConfirmShow.value = false
-        thirdPasswordShow.value= true
-    }
-    //创建新账号
-    function thirdLoginUserCreate() {
-        thirdCreateUserLoding.value = true;
-        // 账号名后面添加两位随机数
-        thirdLoginInfo.value.suffix = parseInt(Math.random() * 98 + 1)
-        defHttp.post({url:'/sys/third/user/create',params:{thirdLoginInfo:unref(thirdLoginInfo)}},{isTransformResponse: false}).then(res => {
-            if (res.success) {
-                let token = res.result;
-                doThirdLogin(token)
-                thirdConfirmShow.value = false
-            } else {
-                createMessage.warning(res.message)
-            }
-        }).finally(() => {
-            thirdCreateUserLoding.value = false
-        })
-    }
-    // 核实密码
-    function thirdLoginCheckPassword() {
-        let params = Object.assign({}, unref(thirdLoginInfo), { password: unref(thirdLoginPassword) });
-        defHttp.post({url:'/sys/third/user/checkPassword',params},{isTransformResponse: false}).then(res => {
-            if (res.success) {
-                thirdLoginNoPassword();
-                doThirdLogin(res.result)
-            } else{
-                createMessage.warning(res.message)
-            }
-        })
-    }
-    // 没有密码 取消操作
-    function thirdLoginNoPassword() {
-        thirdPasswordShow.value = false;
-        thirdLoginPassword.value = '';
-        thirdLoginUser.value = '';
-    }
+  function requestFailed(err) {
+    notification.error({
+      message: '登录失败',
+      description: ((err.response || {}).data || {}).message || err.message || '请求出现错误，请稍后再试',
+      duration: 4,
+    });
+  }
+  // 绑定已有账号 需要输入密码
+  function thirdLoginUserBind() {
+    thirdLoginPassword.value = '';
+    thirdLoginUser.value = thirdLoginInfo.value.uuid;
+    thirdConfirmShow.value = false;
+    thirdPasswordShow.value = true;
+  }
+  //创建新账号
+  function thirdLoginUserCreate() {
+    thirdCreateUserLoding.value = true;
+    // 账号名后面添加两位随机数
+    thirdLoginInfo.value.suffix = parseInt(Math.random() * 98 + 1);
+    defHttp
+      .post({ url: '/sys/third/user/create', params: { thirdLoginInfo: unref(thirdLoginInfo) } }, { isTransformResponse: false })
+      .then((res) => {
+        if (res.success) {
+          let token = res.result;
+          doThirdLogin(token);
+          thirdConfirmShow.value = false;
+        } else {
+          createMessage.warning(res.message);
+        }
+      })
+      .finally(() => {
+        thirdCreateUserLoding.value = false;
+      });
+  }
+  // 核实密码
+  function thirdLoginCheckPassword() {
+    let params = Object.assign({}, unref(thirdLoginInfo), { password: unref(thirdLoginPassword) });
+    defHttp.post({ url: '/sys/third/user/checkPassword', params }, { isTransformResponse: false }).then((res) => {
+      if (res.success) {
+        thirdLoginNoPassword();
+        doThirdLogin(res.result);
+      } else {
+        createMessage.warning(res.message);
+      }
+    });
+  }
+  // 没有密码 取消操作
+  function thirdLoginNoPassword() {
+    thirdPasswordShow.value = false;
+    thirdLoginPassword.value = '';
+    thirdLoginUser.value = '';
+  }
 
-    //倒计时执行前的函数
-    function sendCodeApi() {
-        //return setThirdCaptcha({mobile:unref(thirdPhone)});
-        return getCaptcha({mobile:unref(thirdPhone),smsmode:"0"});
+  //倒计时执行前的函数
+  function sendCodeApi() {
+    //return setThirdCaptcha({mobile:unref(thirdPhone)});
+    return getCaptcha({ mobile: unref(thirdPhone), smsmode: '0' });
+  }
+  //绑定手机号点击确定按钮
+  function thirdHandleOk() {
+    if (!unref(thirdPhone)) {
+      cmsFailed('请输入手机号');
     }
-    //绑定手机号点击确定按钮
-    function thirdHandleOk() {
-        if (!unref(thirdPhone)) {
-            cmsFailed('请输入手机号')
-        }
-        if (!unref(thirdCaptcha)) {
-            cmsFailed('请输入验证码')
-        }
-        let params = {mobile:unref(thirdPhone),captcha:unref(thirdCaptcha),thirdUserUuid:unref(thirdUserUuid)};
-        defHttp.post({url:'/sys/thirdLogin/bindingThirdPhone',params},{isTransformResponse: false}).then(res => {
-            if (res.success) {
-                bindingPhoneModal.value = false
-                doThirdLogin(res.result)
-            } else{
-                createMessage.warning(res.message)
-            }
-        })
+    if (!unref(thirdCaptcha)) {
+      cmsFailed('请输入验证码');
     }
-    function cmsFailed(err){
-        notification.error({
-            message: "登录失败",
-            description:err,
-            duration: 4,
-        });
-        return;
-    }
-    //返回数据和方法
-    return {thirdPasswordShow,thirdLoginCheckPassword,thirdLoginNoPassword,thirdLoginPassword,
-        thirdConfirmShow,thirdCreateUserLoding,thirdLoginUserCreate,thirdLoginUserBind,bindingPhoneModal,
-        thirdHandleOk,thirdPhone,thirdCaptcha,onThirdLogin,sendCodeApi}
+    let params = { mobile: unref(thirdPhone), captcha: unref(thirdCaptcha), thirdUserUuid: unref(thirdUserUuid) };
+    defHttp.post({ url: '/sys/thirdLogin/bindingThirdPhone', params }, { isTransformResponse: false }).then((res) => {
+      if (res.success) {
+        bindingPhoneModal.value = false;
+        doThirdLogin(res.result);
+      } else {
+        createMessage.warning(res.message);
+      }
+    });
+  }
+  function cmsFailed(err) {
+    notification.error({
+      message: '登录失败',
+      description: err,
+      duration: 4,
+    });
+    return;
+  }
+  //返回数据和方法
+  return {
+    thirdPasswordShow,
+    thirdLoginCheckPassword,
+    thirdLoginNoPassword,
+    thirdLoginPassword,
+    thirdConfirmShow,
+    thirdCreateUserLoding,
+    thirdLoginUserCreate,
+    thirdLoginUserBind,
+    bindingPhoneModal,
+    thirdHandleOk,
+    thirdPhone,
+    thirdCaptcha,
+    onThirdLogin,
+    sendCodeApi,
+  };
 }
diff --git a/src/hooks/web/useContentHeight.ts b/src/hooks/web/useContentHeight.ts
index a37bdb9..e43da1e 100644
--- a/src/hooks/web/useContentHeight.ts
+++ b/src/hooks/web/useContentHeight.ts
@@ -27,12 +27,12 @@ type Upward = number | string | null | undefined;
  * @returns 响应式高度
  */
 export function useContentHeight(
-    flag: ComputedRef<Boolean>,
-    anchorRef: Ref,
-    subtractHeightRefs: Ref[],
-    substractSpaceRefs: Ref[],
-    upwardSpace: Ref<Upward> | ComputedRef<Upward> | Upward = 0,
-    offsetHeightRef: Ref<number> = ref(0),
+  flag: ComputedRef<Boolean>,
+  anchorRef: Ref,
+  subtractHeightRefs: Ref[],
+  substractSpaceRefs: Ref[],
+  upwardSpace: Ref<Upward> | ComputedRef<Upward> | Upward = 0,
+  offsetHeightRef: Ref<number> = ref(0)
 ) {
   const contentHeight: Ref<Nullable<number>> = ref(null);
   const { footerHeightRef: layoutFooterHeightRef } = useLayoutHeight();
@@ -50,10 +50,7 @@ export function useContentHeight(
     });
   }
 
-  function calcSubtractSpace(
-      element: Element | null | undefined,
-      direction: 'all' | 'top' | 'bottom' = 'all',
-  ): number {
+  function calcSubtractSpace(element: Element | null | undefined, direction: 'all' | 'top' | 'bottom' = 'all'): number {
     function numberPx(px: string) {
       return Number(px.replace(/[^\d]/g, ''));
     }
@@ -141,13 +138,7 @@ export function useContentHeight(
       upward(anchorEl, upwardSpace);
     }
 
-    let height =
-        bottomIncludeBody -
-        unref(layoutFooterHeightRef) -
-        unref(offsetHeightRef) -
-        substractHeight -
-        substractSpaceHeight -
-        upwardSpaceHeight;
+    let height = bottomIncludeBody - unref(layoutFooterHeightRef) - unref(offsetHeightRef) - substractHeight - substractSpaceHeight - upwardSpaceHeight;
 
     // compensation height
     const calcCompensationHeight = () => {
@@ -170,21 +161,21 @@ export function useContentHeight(
     });
   });
   useWindowSizeFn(
-      () => {
-        calcContentHeight();
-      },
-      50,
-      { immediate: true },
+    () => {
+      calcContentHeight();
+    },
+    50,
+    { immediate: true }
   );
   watch(
-      () => [layoutFooterHeightRef.value],
-      () => {
-        calcContentHeight();
-      },
-      {
-        flush: 'post',
-        immediate: true,
-      },
+    () => [layoutFooterHeightRef.value],
+    () => {
+      calcContentHeight();
+    },
+    {
+      flush: 'post',
+      immediate: true,
+    }
   );
 
   return { redoHeight, setCompensation, contentHeight };
diff --git a/src/hooks/web/useCopyModal.ts b/src/hooks/web/useCopyModal.ts
index 8a089a2..694630b 100644
--- a/src/hooks/web/useCopyModal.ts
+++ b/src/hooks/web/useCopyModal.ts
@@ -1,21 +1,21 @@
-import { isRef, unref, watch, Ref, ComputedRef } from 'vue'
-import Clipboard from 'clipboard'
-import { ModalOptionsEx, useMessage } from '/@/hooks/web/useMessage'
+import { isRef, unref, watch, Ref, ComputedRef } from 'vue';
+import Clipboard from 'clipboard';
+import { ModalOptionsEx, useMessage } from '/@/hooks/web/useMessage';
 
 /** 带复制按钮的弹窗 */
 interface IOptions extends ModalOptionsEx {
   // 要复制的文本，可以是一个 ref 对象，动态更新
-  copyText: string | Ref<string> | ComputedRef<string>,
+  copyText: string | Ref<string> | ComputedRef<string>;
 }
 
-const COPY_CLASS = 'copy-this-text'
-const CLIPBOARD_TEXT = 'data-clipboard-text'
+const COPY_CLASS = 'copy-this-text';
+const CLIPBOARD_TEXT = 'data-clipboard-text';
 
 export function useCopyModal() {
-  return { createCopyModal }
+  return { createCopyModal };
 }
 
-const { createMessage, createConfirm } = useMessage()
+const { createMessage, createConfirm } = useMessage();
 
 /** 创建复制弹窗 */
 function createCopyModal(options: Partial<IOptions>) {
@@ -33,20 +33,20 @@ function createCopyModal(options: Partial<IOptions>) {
     } as any,
     onOk() {
       return new Promise((resolve: any) => {
-        const clipboard = new Clipboard('.' + COPY_CLASS)
+        const clipboard = new Clipboard('.' + COPY_CLASS);
         clipboard.on('success', () => {
-          clipboard.destroy()
-          createMessage.success('复制成功')
-          resolve()
-        })
+          clipboard.destroy();
+          createMessage.success('复制成功');
+          resolve();
+        });
         clipboard.on('error', () => {
-          createMessage.error('该浏览器不支持自动复制')
-          clipboard.destroy()
-          resolve()
-        })
-      })
+          createMessage.error('该浏览器不支持自动复制');
+          clipboard.destroy();
+          resolve();
+        });
+      });
     },
-  })
+  });
 
   // 动态更新 copyText
   if (isRef(options.copyText)) {
@@ -57,8 +57,8 @@ function createCopyModal(options: Partial<IOptions>) {
           class: COPY_CLASS,
           [CLIPBOARD_TEXT]: copyText,
         } as any,
-      })
-    })
+      });
+    });
   }
-  return modal
+  return modal;
 }
diff --git a/src/hooks/web/useECharts.ts b/src/hooks/web/useECharts.ts
index 332918a..858d1a7 100644
--- a/src/hooks/web/useECharts.ts
+++ b/src/hooks/web/useECharts.ts
@@ -9,10 +9,7 @@ import { useBreakpoint } from '/@/hooks/event/useBreakpoint';
 import echarts from '/@/utils/lib/echarts';
 import { useRootSetting } from '/@/hooks/setting/useRootSetting';
 
-export function useECharts(
-    elRef: Ref<HTMLDivElement>,
-    theme: 'light' | 'dark' | 'default' = 'default'
-) {
+export function useECharts(elRef: Ref<HTMLDivElement>, theme: 'light' | 'dark' | 'default' = 'default') {
   const { getDarkMode: getSysDarkMode } = useRootSetting();
 
   const getDarkMode = computed(() => {
@@ -83,14 +80,14 @@ export function useECharts(
   }
 
   watch(
-      () => getDarkMode.value,
-      (theme) => {
-        if (chartInstance) {
-          chartInstance.dispose();
-          initCharts(theme as 'default');
-          setOptions(cacheOptions.value);
-        }
+    () => getDarkMode.value,
+    (theme) => {
+      if (chartInstance) {
+        chartInstance.dispose();
+        initCharts(theme as 'default');
+        setOptions(cacheOptions.value);
       }
+    }
   );
 
   tryOnUnmounted(() => {
diff --git a/src/hooks/web/useMessage.tsx b/src/hooks/web/useMessage.tsx
index bae9cd9..ad64eda 100644
--- a/src/hooks/web/useMessage.tsx
+++ b/src/hooks/web/useMessage.tsx
@@ -45,7 +45,7 @@ function getIcon(iconType: string) {
     } else {
       return <CloseCircleFilled class="modal-icon-error" />;
     }
-  } catch(e) {
+  } catch (e) {
     console.log(e);
   }
 }
@@ -57,7 +57,7 @@ function renderContent({ content }: Pick<ModalOptionsEx, 'content'>) {
     } else {
       return content;
     }
-  } catch(e) {
+  } catch (e) {
     console.log(e);
     return content;
   }
@@ -75,7 +75,7 @@ function createConfirm(options: ModalOptionsEx): ReturnType<ModalFunc> {
     ...options,
     content: renderContent(options),
   };
-  return Modal.confirm(opt)
+  return Modal.confirm(opt);
 }
 
 const getBaseOptions = () => {
diff --git a/src/hooks/web/usePagination.ts b/src/hooks/web/usePagination.ts
index 1e19913..ea234ef 100644
--- a/src/hooks/web/usePagination.ts
+++ b/src/hooks/web/usePagination.ts
@@ -3,10 +3,7 @@ import { ref, unref, computed } from 'vue';
 
 function pagination<T = any>(list: T[], pageNo: number, pageSize: number): T[] {
   const offset = (pageNo - 1) * Number(pageSize);
-  const ret =
-    offset + Number(pageSize) >= list.length
-      ? list.slice(offset, list.length)
-      : list.slice(offset, offset + Number(pageSize));
+  const ret = offset + Number(pageSize) >= list.length ? list.slice(offset, list.length) : list.slice(offset, offset + Number(pageSize));
   return ret;
 }
 
diff --git a/src/hooks/web/usePermission.ts b/src/hooks/web/usePermission.ts
index 694a037..eebfa54 100644
--- a/src/hooks/web/usePermission.ts
+++ b/src/hooks/web/usePermission.ts
@@ -29,10 +29,7 @@ export function usePermission() {
    */
   async function togglePermissionMode() {
     appStore.setProjectConfig({
-      permissionMode:
-        projectSetting.permissionMode === PermissionModeEnum.BACK
-          ? PermissionModeEnum.ROUTE_MAPPING
-          : PermissionModeEnum.BACK,
+      permissionMode: projectSetting.permissionMode === PermissionModeEnum.BACK ? PermissionModeEnum.ROUTE_MAPPING : PermissionModeEnum.BACK,
     });
     location.reload();
   }
@@ -73,7 +70,7 @@ export function usePermission() {
 
     if (PermissionModeEnum.BACK === permMode) {
       const allCodeList = permissionStore.getPermCodeList as string[];
-      if (!isArray(value)&&allCodeList&&allCodeList.length>0) {
+      if (!isArray(value) && allCodeList && allCodeList.length > 0) {
         return allCodeList.includes(value);
       }
       return (intersection(value, allCodeList) as string[]).length > 0;
@@ -93,9 +90,7 @@ export function usePermission() {
    */
   async function changeRole(roles: RoleEnum | RoleEnum[]): Promise<void> {
     if (projectSetting.permissionMode !== PermissionModeEnum.ROUTE_MAPPING) {
-      throw new Error(
-        'Please switch PermissionModeEnum to ROUTE_MAPPING mode in the configuration to operate!'
-      );
+      throw new Error('Please switch PermissionModeEnum to ROUTE_MAPPING mode in the configuration to operate!');
     }
 
     if (!isArray(roles)) {
diff --git a/src/hooks/web/usePrintJS.ts b/src/hooks/web/usePrintJS.ts
index 218e651..9cfe0a6 100644
--- a/src/hooks/web/usePrintJS.ts
+++ b/src/hooks/web/usePrintJS.ts
@@ -1,42 +1,42 @@
-import { nextTick } from 'vue'
-import $printJS, { Configuration } from 'print-js'
-import Print from 'vue-print-nb-jeecg/src/printarea'
+import { nextTick } from 'vue';
+import $printJS, { Configuration } from 'print-js';
+import Print from 'vue-print-nb-jeecg/src/printarea';
 
 /**
  * 调用 printJS，如果type = html，就走 printNB 的方法
  */
 export function printJS(configuration: Configuration) {
   if (configuration?.type === 'html') {
-    printNb(configuration.printable)
+    printNb(configuration.printable);
   } else {
-    return $printJS(configuration)
+    return $printJS(configuration);
   }
 }
 
 /** 调用 printNB 打印 */
 export function printNb(domId) {
   if (domId) {
-    localPrint(domId)
+    localPrint(domId);
   } else {
-    window.print()
+    window.print();
   }
 }
 
-let closeBtn = true
+let closeBtn = true;
 
 function localPrint(domId) {
   if (typeof domId === 'string' && !domId.startsWith('#')) {
-    domId = '#' + domId
+    domId = '#' + domId;
   }
   nextTick(() => {
     if (closeBtn) {
-      closeBtn = false
+      closeBtn = false;
       new Print({
         el: domId,
         endCallback() {
-          closeBtn = true
+          closeBtn = true;
         },
-      })
+      });
     }
-  })
-}
\ No newline at end of file
+  });
+}
diff --git a/src/hooks/web/useScript.ts b/src/hooks/web/useScript.ts
index 2df6b1d..9707116 100644
--- a/src/hooks/web/useScript.ts
+++ b/src/hooks/web/useScript.ts
@@ -1,46 +1,46 @@
-import {onMounted, onUnmounted, ref} from 'vue';
+import { onMounted, onUnmounted, ref } from 'vue';
 
 interface ScriptOptions {
-    src: string;
+  src: string;
 }
 
 export function useScript(opts: ScriptOptions) {
-    const isLoading = ref(false);
-    const error = ref(false);
-    const success = ref(false);
-    let script: HTMLScriptElement;
+  const isLoading = ref(false);
+  const error = ref(false);
+  const success = ref(false);
+  let script: HTMLScriptElement;
 
-    const promise = new Promise((resolve, reject) => {
-        onMounted(() => {
-            script = document.createElement('script');
-            script.type = 'text/javascript';
-            script.onload = function () {
-                isLoading.value = false;
-                success.value = true;
-                error.value = false;
-                resolve('');
-            };
+  const promise = new Promise((resolve, reject) => {
+    onMounted(() => {
+      script = document.createElement('script');
+      script.type = 'text/javascript';
+      script.onload = function () {
+        isLoading.value = false;
+        success.value = true;
+        error.value = false;
+        resolve('');
+      };
 
-            script.onerror = function (err) {
-                isLoading.value = false;
-                success.value = false;
-                error.value = true;
-                reject(err);
-            };
+      script.onerror = function (err) {
+        isLoading.value = false;
+        success.value = false;
+        error.value = true;
+        reject(err);
+      };
 
-            script.src = opts.src;
-            document.head.appendChild(script);
-        });
+      script.src = opts.src;
+      document.head.appendChild(script);
     });
+  });
 
-    onUnmounted(() => {
-        script && script.remove();
-    });
+  onUnmounted(() => {
+    script && script.remove();
+  });
 
-    return {
-        isLoading,
-        error,
-        success,
-        toPromise: () => promise,
-    };
+  return {
+    isLoading,
+    error,
+    success,
+    toPromise: () => promise,
+  };
 }
diff --git a/src/hooks/web/useSso.ts b/src/hooks/web/useSso.ts
index 041e26d..61b6ca5 100644
--- a/src/hooks/web/useSso.ts
+++ b/src/hooks/web/useSso.ts
@@ -5,14 +5,14 @@ import { useGlobSetting } from '/@/hooks/setting';
 import { validateCasLogin } from '/@/api/sys/user';
 import { useUserStore } from '/@/store/modules/user';
 const globSetting = useGlobSetting();
-const openSso =globSetting.openSso;
-export  function useSso() {
+const openSso = globSetting.openSso;
+export function useSso() {
   let locationUrl = 'http://' + window.location.host + '/';
   /**
    * 单点登录
    */
   async function ssoLogin() {
-    if (openSso=='true') {
+    if (openSso == 'true') {
       let token = getToken();
       let ticket = getUrlParam('ticket');
       if (!token) {
@@ -26,7 +26,7 @@ export  function useSso() {
             return userStore.afterLoginAction(true, {});
           });
         } else {
-          window.location.href =  globSetting.casBaseUrl+ '/login?service=' + encodeURIComponent(locationUrl);;
+          window.location.href = globSetting.casBaseUrl + '/login?service=' + encodeURIComponent(locationUrl);
         }
       }
     }
@@ -36,7 +36,7 @@ export  function useSso() {
    * 退出登录
    */
   async function ssoLoginOut() {
-    window.location.href =  globSetting.casBaseUrl+ '/logout?service=' + encodeURIComponent(locationUrl);
+    window.location.href = globSetting.casBaseUrl + '/logout?service=' + encodeURIComponent(locationUrl);
   }
-  return {ssoLogin,ssoLoginOut};
+  return { ssoLogin, ssoLoginOut };
 }
diff --git a/src/hooks/web/useTitle.ts b/src/hooks/web/useTitle.ts
index a7f48d8..ed28a21 100644
--- a/src/hooks/web/useTitle.ts
+++ b/src/hooks/web/useTitle.ts
@@ -30,6 +30,6 @@ export function useTitle() {
       const tTitle = t(route?.meta?.title as string);
       pageTitle.value = tTitle ? ` ${tTitle} - ${title} ` : `${title}`;
     },
-    { immediate: true },
+    { immediate: true }
   );
 }
diff --git a/src/hooks/web/useWatermark.ts b/src/hooks/web/useWatermark.ts
index 54823ba..bde1549 100644
--- a/src/hooks/web/useWatermark.ts
+++ b/src/hooks/web/useWatermark.ts
@@ -5,9 +5,7 @@ import { isDef } from '/@/utils/is';
 
 const domSymbol = Symbol('watermark-dom');
 
-export function useWatermark(
-  appendEl: Ref<HTMLElement | null> = ref(document.body) as Ref<HTMLElement>
-) {
+export function useWatermark(appendEl: Ref<HTMLElement | null> = ref(document.body) as Ref<HTMLElement>) {
   const func = useRafThrottle(function () {
     const el = unref(appendEl);
     if (!el) return;
diff --git a/src/hooks/web/useWebSocket.ts b/src/hooks/web/useWebSocket.ts
index 3677972..b7c4506 100644
--- a/src/hooks/web/useWebSocket.ts
+++ b/src/hooks/web/useWebSocket.ts
@@ -1,18 +1,18 @@
 // noinspection JSUnusedGlobalSymbols
 
-import { computed, reactive, ref, unref } from 'vue'
-import { useWebSocket as $useWebSocket, WebSocketResult } from '@vueuse/core'
+import { computed, reactive, ref, unref } from 'vue';
+import { useWebSocket as $useWebSocket, WebSocketResult } from '@vueuse/core';
 import { getToken } from '/@/utils/auth';
 
 const state = reactive({
   server: '',
   sendValue: '',
   recordList: [] as { id: number; time: number; res: string }[],
-})
+});
 
-const result = ref<WebSocketResult<any>>()
+const result = ref<WebSocketResult<any>>();
 
-const listeners = new Map()
+const listeners = new Map();
 
 /**
  * 开启 WebSocket 链接，全局只需执行一次
@@ -20,63 +20,63 @@ const listeners = new Map()
  */
 export function connectWebSocket(url: string) {
   if (!unref(getIsOpen)) {
-    state.server = url
+    state.server = url;
     //update-begin-author:taoyan date:2022-4-24 for: v2.4.6 的 websocket 服务端，存在性能和安全问题。 #3278
-    let token = (getToken() || '') as string
+    let token = (getToken() || '') as string;
     result.value = $useWebSocket(state.server, {
       // 自动重连
       autoReconnect: true,
       // 心跳检测
       heartbeat: false,
       //protocols: [token],
-    })
+    });
     //update-end-author:taoyan date:2022-4-24 for: v2.4.6 的 websocket 服务端，存在性能和安全问题。 #3278
-    result.value.open()
-    const ws = unref(result.value.ws)
+    result.value.open();
+    const ws = unref(result.value.ws);
     if (ws) {
-      ws.onopen = onOpen
-      ws.onclose = onClose
-      ws.onerror = onError
-      ws.onmessage = onMessage
+      ws.onopen = onOpen;
+      ws.onclose = onClose;
+      ws.onerror = onError;
+      ws.onmessage = onMessage;
     }
   }
 }
 
 function onOpen() {
-  console.log('[WebSocket] 连接成功')
+  console.log('[WebSocket] 连接成功');
 }
 
 function onClose(e) {
-  console.log('[WebSocket] 连接断开：', e)
+  console.log('[WebSocket] 连接断开：', e);
 }
 
 function onError(e) {
-  console.log('[WebSocket] 连接发生错误: ', e)
+  console.log('[WebSocket] 连接发生错误: ', e);
 }
 
 function onMessage(e) {
   if (e.data === 'ping') {
-    return
+    return;
   }
-  console.debug('[WebSocket] -----接收消息-------', e.data)
+  console.debug('[WebSocket] -----接收消息-------', e.data);
   try {
-    const data = JSON.parse(e.data)
+    const data = JSON.parse(e.data);
     for (const callback of listeners.keys()) {
       try {
-        callback(data)
+        callback(data);
       } catch (err) {
-        console.error(err)
+        console.error(err);
       }
     }
   } catch (err) {
-    console.error('[WebSocket] data解析失败：', err)
+    console.error('[WebSocket] data解析失败：', err);
   }
 }
 
 /**
  * 判断 WebSocket 是否是开启状态
  */
-export const getIsOpen = computed(() => result.value?.status.value === 'OPEN')
+export const getIsOpen = computed(() => result.value?.status.value === 'OPEN');
 
 /**
  * 添加 WebSocket 消息监听
@@ -85,9 +85,9 @@ export const getIsOpen = computed(() => result.value?.status.value === 'OPEN')
 export function onWebSocket(callback: (data: object) => any) {
   if (!listeners.has(callback)) {
     if (typeof callback === 'function') {
-      listeners.set(callback, null)
+      listeners.set(callback, null);
     } else {
-      console.debug('[WebSocket] 添加 WebSocket 消息监听失败：传入的参数不是一个方法')
+      console.debug('[WebSocket] 添加 WebSocket 消息监听失败：传入的参数不是一个方法');
     }
   }
 }
@@ -98,9 +98,9 @@ export function onWebSocket(callback: (data: object) => any) {
  * @param callback
  */
 export function offWebSocket(callback: (data: object) => any) {
-  listeners.delete(callback)
+  listeners.delete(callback);
 }
 
 export function useWebSocket() {
-  return unref(result)
+  return unref(result);
 }
diff --git a/src/layouts/default/content/index.vue b/src/layouts/default/content/index.vue
index 7e8d1d0..d1eadb6 100644
--- a/src/layouts/default/content/index.vue
+++ b/src/layouts/default/content/index.vue
@@ -2,18 +2,18 @@
   <div :class="[prefixCls, getLayoutContentMode]" v-loading="getOpenPageLoading && getPageLoading">
     <PageLayout />
     <!-- update-begin-author:zyf date:20211129 for:qiankun 挂载子应用盒子 -->
-    <div id="content" class="app-view-box" v-if="openQianKun=='true'"></div>
+    <div id="content" class="app-view-box" v-if="openQianKun == 'true'"></div>
     <!-- update-end-author:zyf date:20211129 for: qiankun 挂载子应用盒子-->
   </div>
 </template>
 <script lang="ts">
-  import {defineComponent, onMounted} from 'vue';
+  import { defineComponent, onMounted } from 'vue';
   import PageLayout from '/@/layouts/page/index.vue';
   import { useDesign } from '/@/hooks/web/useDesign';
   import { useRootSetting } from '/@/hooks/setting/useRootSetting';
   import { useTransitionSetting } from '/@/hooks/setting/useTransitionSetting';
   import { useContentViewHeight } from './useContentViewHeight';
-  import registerApps from "/@/qiankun";
+  import registerApps from '/@/qiankun';
   import { useGlobSetting } from '/@/hooks/setting';
   export default defineComponent({
     name: 'LayoutContent',
@@ -23,16 +23,16 @@
       const { getOpenPageLoading } = useTransitionSetting();
       const { getLayoutContentMode, getPageLoading } = useRootSetting();
       const globSetting = useGlobSetting();
-      const openQianKun =globSetting.openQianKun;
+      const openQianKun = globSetting.openQianKun;
       useContentViewHeight();
       onMounted(() => {
-         //注册openQianKun
-          if (openQianKun=='true') {
-              if (!window.qiankunStarted) {
-                  window.qiankunStarted = true;
-                  registerApps();
-              }
+        //注册openQianKun
+        if (openQianKun == 'true') {
+          if (!window.qiankunStarted) {
+            window.qiankunStarted = true;
+            registerApps();
           }
+        }
       });
       return {
         prefixCls,
diff --git a/src/layouts/default/feature/index.vue b/src/layouts/default/feature/index.vue
index 0787014..99c83cb 100644
--- a/src/layouts/default/feature/index.vue
+++ b/src/layouts/default/feature/index.vue
@@ -20,8 +20,7 @@
       SessionTimeoutLogin,
     },
     setup() {
-      const { getUseOpenBackTop, getShowSettingButton, getSettingButtonPosition, getFullContent } =
-        useRootSetting();
+      const { getUseOpenBackTop, getShowSettingButton, getSettingButtonPosition, getFullContent } = useRootSetting();
       const userStore = useUserStoreWithOut();
       const { prefixCls } = useDesign('setting-drawer-fearure');
       const { getShowHeader } = useHeaderSetting();
diff --git a/src/layouts/default/footer/index.vue b/src/layouts/default/footer/index.vue
index 9df0f78..adca7d5 100644
--- a/src/layouts/default/footer/index.vue
+++ b/src/layouts/default/footer/index.vue
@@ -7,7 +7,7 @@
 
       <a @click="openWindow(DOC_URL)">{{ t('layout.footer.onlineDocument') }}</a>
     </div>
-    <div>Copyright &copy;2021  JEECG开源社区 出品</div>
+    <div>Copyright &copy;2021 JEECG开源社区 出品</div>
   </Footer>
 </template>
 
diff --git a/src/layouts/default/header/MultipleHeader.vue b/src/layouts/default/header/MultipleHeader.vue
index 11908c5..c69bf01 100644
--- a/src/layouts/default/header/MultipleHeader.vue
+++ b/src/layouts/default/header/MultipleHeader.vue
@@ -18,7 +18,7 @@
   import { useAppInject } from '/@/hooks/web/useAppInject';
   import { useDesign } from '/@/hooks/web/useDesign';
   import { useLayoutHeight } from '../content/useContentViewHeight';
-  import { TabsThemeEnum } from '/@/enums/appEnum'
+  import { TabsThemeEnum } from '/@/enums/appEnum';
 
   const HEADER_HEIGHT = 48;
 
@@ -36,13 +36,7 @@
 
       const { getCalcContentWidth, getSplit } = useMenuSetting();
       const { getIsMobile } = useAppInject();
-      const {
-        getFixed,
-        getShowInsetHeaderRef,
-        getShowFullHeaderRef,
-        getHeaderTheme,
-        getShowHeader,
-      } = useHeaderSetting();
+      const { getFixed, getShowInsetHeaderRef, getShowFullHeaderRef, getHeaderTheme, getShowHeader } = useHeaderSetting();
 
       const { getFullContent } = useFullContent();
 
@@ -73,27 +67,23 @@
 
       // updateBy:sunjianlei---updateDate:2021-09-08---根据主题的不同，动态计算tabs高度
       const getTabsThemeHeight = computed(() => {
-        let tabsTheme = unref(getTabsTheme)
+        let tabsTheme = unref(getTabsTheme);
         if (tabsTheme === TabsThemeEnum.CARD) {
-          return TABS_HEIGHT_CARD
+          return TABS_HEIGHT_CARD;
         } else if (tabsTheme === TabsThemeEnum.SMOOTH) {
-          return TABS_HEIGHT_SMOOTH
+          return TABS_HEIGHT_SMOOTH;
         } else {
-          return TABS_HEIGHT
+          return TABS_HEIGHT;
         }
-      })
+      });
 
       const getPlaceholderDomStyle = computed((): CSSProperties => {
         let height = 0;
-        if (
-          (unref(getShowFullHeaderRef) || !unref(getSplit)) &&
-          unref(getShowHeader) &&
-          !unref(getFullContent)
-        ) {
+        if ((unref(getShowFullHeaderRef) || !unref(getSplit)) && unref(getShowHeader) && !unref(getFullContent)) {
           height += HEADER_HEIGHT;
         }
         if (unref(getShowMultipleTab) && !unref(getFullContent)) {
-          height += unref(getTabsThemeHeight)
+          height += unref(getTabsThemeHeight);
         }
         setHeaderHeight(height);
         return {
@@ -102,11 +92,7 @@
       });
 
       const getClass = computed(() => {
-        return [
-          prefixCls,
-          `${prefixCls}--${unref(getHeaderTheme)}`,
-          { [`${prefixCls}--fixed`]: unref(getIsFixed) },
-        ];
+        return [prefixCls, `${prefixCls}--${unref(getHeaderTheme)}`, { [`${prefixCls}--fixed`]: unref(getIsFixed) }];
       });
 
       return {
diff --git a/src/layouts/default/header/components/ErrorAction.vue b/src/layouts/default/header/components/ErrorAction.vue
index 243e587..ff173ae 100644
--- a/src/layouts/default/header/components/ErrorAction.vue
+++ b/src/layouts/default/header/components/ErrorAction.vue
@@ -1,10 +1,5 @@
 <template>
-  <Tooltip
-    :title="t('layout.header.tooltipErrorLog')"
-    placement="bottom"
-    :mouseEnterDelay="0.5"
-    @click="handleToErrorList"
-  >
+  <Tooltip :title="t('layout.header.tooltipErrorLog')" placement="bottom" :mouseEnterDelay="0.5" @click="handleToErrorList">
     <Badge :count="getCount" :offset="[0, 10]" :overflowCount="99">
       <Icon icon="ion:bug-outline" />
     </Badge>
diff --git a/src/layouts/default/header/components/FullScreen.vue b/src/layouts/default/header/components/FullScreen.vue
index 374ee76..9efbfab 100644
--- a/src/layouts/default/header/components/FullScreen.vue
+++ b/src/layouts/default/header/components/FullScreen.vue
@@ -22,9 +22,7 @@
       const { toggle, isFullscreen } = useFullscreen();
 
       const getTitle = computed(() => {
-        return unref(isFullscreen)
-          ? t('layout.header.tooltipExitFull')
-          : t('layout.header.tooltipEntryFull');
+        return unref(isFullscreen) ? t('layout.header.tooltipExitFull') : t('layout.header.tooltipEntryFull');
       });
 
       return {
diff --git a/src/layouts/default/header/components/LockScreen.vue b/src/layouts/default/header/components/LockScreen.vue
index 577007e..cf88cbd 100644
--- a/src/layouts/default/header/components/LockScreen.vue
+++ b/src/layouts/default/header/components/LockScreen.vue
@@ -1,16 +1,11 @@
 <template>
-  <Tooltip
-    :title="t('layout.header.tooltipLock')"
-    placement="bottom"
-    :mouseEnterDelay="0.5"
-    @click="handleLock"
-  >
-     <LockOutlined />
+  <Tooltip :title="t('layout.header.tooltipLock')" placement="bottom" :mouseEnterDelay="0.5" @click="handleLock">
+    <LockOutlined />
   </Tooltip>
-  <LockModal @register="register" />  
+  <LockModal @register="register" />
 </template>
 <script lang="ts">
-  import { defineComponent, computed} from 'vue';
+  import { defineComponent, computed } from 'vue';
   import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent';
   import { Tooltip } from 'ant-design-vue';
   import { LockOutlined } from '@ant-design/icons-vue';
@@ -20,15 +15,17 @@
 
   export default defineComponent({
     name: 'LockScreen',
-    inheritAttrs:false,
+    inheritAttrs: false,
     components: {
-        Icon, Tooltip,LockOutlined,
-        LockModal: createAsyncComponent(() => import('./lock/LockModal.vue'))
+      Icon,
+      Tooltip,
+      LockOutlined,
+      LockModal: createAsyncComponent(() => import('./lock/LockModal.vue')),
     },
     setup() {
       const { t } = useI18n();
       const [register, { openModal }] = useModal();
-      
+
       function handleLock() {
         openModal(true);
       }
diff --git a/src/layouts/default/header/components/lock/LockModal.vue b/src/layouts/default/header/components/lock/LockModal.vue
index 9bf764c..b2e4b0e 100644
--- a/src/layouts/default/header/components/lock/LockModal.vue
+++ b/src/layouts/default/header/components/lock/LockModal.vue
@@ -1,11 +1,5 @@
 <template>
-  <BasicModal
-    :footer="null"
-    :title="t('layout.header.lockScreen')"
-    v-bind="$attrs"
-    :class="prefixCls"
-    @register="register"
-  >
+  <BasicModal :footer="null" :title="t('layout.header.lockScreen')" v-bind="$attrs" :class="prefixCls" @register="register">
     <div :class="`${prefixCls}__entry`">
       <div :class="`${prefixCls}__header`">
         <img :src="avatar" :class="`${prefixCls}__header-img`" />
diff --git a/src/layouts/default/header/components/notify/NoticeList.vue b/src/layouts/default/header/components/notify/NoticeList.vue
index 7396766..8f82824 100644
--- a/src/layouts/default/header/components/notify/NoticeList.vue
+++ b/src/layouts/default/header/components/notify/NoticeList.vue
@@ -6,14 +6,10 @@
           <template #title>
             <div class="title">
               <a-typography-paragraph
-                      style="width: 100%; margin-bottom: 0 !important"
-                      :delete="!!item.titleDelete"
-                      :ellipsis="
-                  $props.titleRows && $props.titleRows > 0
-                    ? { rows: $props.titleRows, tooltip: !!item.title }
-                    : false
-                "
-                      :content="item.title"
+                style="width: 100%; margin-bottom: 0 !important"
+                :delete="!!item.titleDelete"
+                :ellipsis="$props.titleRows && $props.titleRows > 0 ? { rows: $props.titleRows, tooltip: !!item.title } : false"
+                :content="item.title"
               />
               <div class="extra" v-if="item.extra">
                 <a-tag class="tag" :color="item.color">
@@ -28,17 +24,17 @@
             <template v-else-if="item.priority">
               <a-avatar v-if="item.priority === PriorityTypes.L" class="avatar priority-L" title="一般消息">
                 <template #icon>
-                  <Icon icon="entypo:info"/>
+                  <Icon icon="entypo:info" />
                 </template>
               </a-avatar>
               <a-avatar v-if="item.priority === PriorityTypes.M" class="avatar priority-M" title="重要消息">
                 <template #icon>
-                  <Icon icon="bi:exclamation-lg"/>
+                  <Icon icon="bi:exclamation-lg" />
                 </template>
               </a-avatar>
               <a-avatar v-if="item.priority === PriorityTypes.H" class="avatar priority-H" title="紧急消息">
                 <template #icon>
-                  <Icon icon="ant-design:warning-filled"/>
+                  <Icon icon="ant-design:warning-filled" />
                 </template>
               </a-avatar>
             </template>
@@ -49,17 +45,13 @@
             <div>
               <div class="description" v-if="item.description">
                 <a-typography-paragraph
-                        style="width: 100%; margin-bottom: 0 !important"
-                        :ellipsis="
-                    $props.descRows && $props.descRows > 0
-                      ? { rows: $props.descRows, tooltip: !!item.description }
-                      : false
-                  "
-                        :content="item.description"
+                  style="width: 100%; margin-bottom: 0 !important"
+                  :ellipsis="$props.descRows && $props.descRows > 0 ? { rows: $props.descRows, tooltip: !!item.description } : false"
+                  :content="item.description"
                 />
               </div>
               <div class="datetime">
-                <Time :value="item.datetime" :title="item.datetime"/>
+                <Time :value="item.datetime" :title="item.datetime" />
               </div>
             </div>
           </template>
@@ -121,10 +113,10 @@
         return list.slice(size * (unref(current) - 1), size * unref(current));
       });
       watch(
-              () => props.currentPage,
-              (v) => {
-                current.value = v;
-              }
+        () => props.currentPage,
+        (v) => {
+          current.value = v;
+        }
       );
       const isTitleClickable = computed(() => !!props.onTitleClick);
       const getPagination = computed(() => {
@@ -206,8 +198,9 @@
     }
 
     .list-item {
-
-      .priority-L, .priority-M, .priority-H {
+      .priority-L,
+      .priority-M,
+      .priority-H {
         font-size: 12px;
       }
 
diff --git a/src/layouts/default/header/components/notify/data.ts b/src/layouts/default/header/components/notify/data.ts
index b65674b..7c95e6c 100644
--- a/src/layouts/default/header/components/notify/data.ts
+++ b/src/layouts/default/header/components/notify/data.ts
@@ -74,8 +74,7 @@ export const tabListData: TabItem[] = [
       {
         id: '000000005',
         avatar: 'https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png',
-        title:
-          '标题可以设置自动显示省略号，本例中标题行数已设为1行，如果内容超过1行将自动截断并支持tooltip显示完整标题。',
+        title: '标题可以设置自动显示省略号，本例中标题行数已设为1行，如果内容超过1行将自动截断并支持tooltip显示完整标题。',
         description: '',
         datetime: '2017-08-07',
         type: '1',
@@ -149,8 +148,7 @@ export const tabListData: TabItem[] = [
         id: '000000008',
         avatar: 'https://gw.alipayobjects.com/zos/rmsportal/fcHMVNCjPOsbUGdEduuv.jpeg',
         title: '标题',
-        description:
-          '请将鼠标移动到此处，以便测试超长的消息在此处将如何处理。本例中设置的描述最大行数为2，超过2行的描述内容将被省略并且可以通过tooltip查看完整内容',
+        description: '请将鼠标移动到此处，以便测试超长的消息在此处将如何处理。本例中设置的描述最大行数为2，超过2行的描述内容将被省略并且可以通过tooltip查看完整内容',
         datetime: '2017-08-07',
         type: '2',
         clickClose: true,
@@ -204,4 +202,4 @@ export const tabListData: TabItem[] = [
   //     },
   //   ],
   // },
-]
+];
diff --git a/src/layouts/default/header/components/notify/index.vue b/src/layouts/default/header/components/notify/index.vue
index 8002743..fd66a23 100644
--- a/src/layouts/default/header/components/notify/index.vue
+++ b/src/layouts/default/header/components/notify/index.vue
@@ -22,52 +22,52 @@
             <a-button @click="onEmptyNotify" type="dashed" block>清空消息</a-button>
           </a-col>
           <a-col :span="count === 0 ? 24 : 12">
-            <a-button @click="popoverVisible=false" type="dashed" block>
+            <a-button @click="popoverVisible = false" type="dashed" block>
               <router-link to="/monitor/mynews">查看更多</router-link>
             </a-button>
           </a-col>
         </a-row>
       </template>
     </Popover>
-    <DynamicNotice ref="dynamicNoticeRef" v-bind="dynamicNoticeProps"/>
-    <DetailModal @register="registerDetail"/>
+    <DynamicNotice ref="dynamicNoticeRef" v-bind="dynamicNoticeProps" />
+    <DetailModal @register="registerDetail" />
   </div>
 </template>
 <script lang="ts">
-  import { computed, defineComponent, ref, unref, reactive, onMounted, getCurrentInstance } from 'vue'
+  import { computed, defineComponent, ref, unref, reactive, onMounted, getCurrentInstance } from 'vue';
   import { Popover, Tabs, Badge } from 'ant-design-vue';
   import { BellOutlined } from '@ant-design/icons-vue';
-  import { tabListData } from './data'
+  import { tabListData } from './data';
   import { listCementByUser, editCementSend } from './notify.api';
   import NoticeList from './NoticeList.vue';
   import DetailModal from '/@/views/monitor/mynews/DetailModal.vue';
   import DynamicNotice from '/@/views/monitor/mynews/DynamicNotice.vue';
-  import { useModal } from '/@/components/Modal'
+  import { useModal } from '/@/components/Modal';
   import { useDesign } from '/@/hooks/web/useDesign';
-  import { useGlobSetting } from '/@/hooks/setting'
+  import { useGlobSetting } from '/@/hooks/setting';
   import { useUserStore } from '/@/store/modules/user';
-  import { connectWebSocket, onWebSocket } from '/@/hooks/web/useWebSocket'
-  import { readAllMsg } from '/@/views/monitor/mynews/mynews.api'
+  import { connectWebSocket, onWebSocket } from '/@/hooks/web/useWebSocket';
+  import { readAllMsg } from '/@/views/monitor/mynews/mynews.api';
   import { getToken } from '/@/utils/auth';
   export default defineComponent({
     components: { Popover, BellOutlined, Tabs, TabPane: Tabs.TabPane, Badge, NoticeList, DetailModal, DynamicNotice },
     setup() {
       const { prefixCls } = useDesign('header-notify');
-      const instance: any = getCurrentInstance()
+      const instance: any = getCurrentInstance();
       const userStore = useUserStore();
       const glob = useGlobSetting();
-      const dynamicNoticeProps = reactive({ path: '', formData: {} })
+      const dynamicNoticeProps = reactive({ path: '', formData: {} });
       const [registerDetail, detailModal] = useModal();
       const popoverVisible = ref<boolean>(false);
       const listData = ref(tabListData);
-      listData.value[0].list = []
-      listData.value[1].list = []
-      listData.value[0].count = 0
-      listData.value[1].count = 0
+      listData.value[0].list = [];
+      listData.value[1].list = [];
+      listData.value[0].count = 0;
+      listData.value[1].count = 0;
 
       onMounted(() => {
-        initWebSocket()
-      })
+        initWebSocket();
+      });
 
       const count = computed(() => {
         let count = 0;
@@ -83,64 +83,64 @@
           title: item.titile,
           description: item.msgAbstract,
           datetime: item.sendTime,
-        }
+        };
       }
 
       // 获取系统消息
       async function loadData() {
         try {
-          let { anntMsgList, sysMsgList, anntMsgTotal, sysMsgTotal } = await listCementByUser({ pageSize: 5 })
-          listData.value[0].list = anntMsgList.map(mapAnnouncement)
-          listData.value[1].list = sysMsgList.map(mapAnnouncement)
-          listData.value[0].count = anntMsgTotal
-          listData.value[1].count = sysMsgTotal
+          let { anntMsgList, sysMsgList, anntMsgTotal, sysMsgTotal } = await listCementByUser({ pageSize: 5 });
+          listData.value[0].list = anntMsgList.map(mapAnnouncement);
+          listData.value[1].list = sysMsgList.map(mapAnnouncement);
+          listData.value[0].count = anntMsgTotal;
+          listData.value[1].count = sysMsgTotal;
         } catch (e) {
-          console.warn('系统消息通知异常：', e)
+          console.warn('系统消息通知异常：', e);
         }
       }
 
-      loadData()
+      loadData();
 
       function onNoticeClick(record) {
         try {
-          editCementSend(record.id)
-          loadData()
+          editCementSend(record.id);
+          loadData();
         } catch (e) {
-          console.error(e)
+          console.error(e);
         }
         if (record.openType === 'component') {
-          dynamicNoticeProps.path = record.openPage
-          dynamicNoticeProps.formData = { id: record.busId }
-          instance.refs.dynamicNoticeRef?.detail(record.openPage)
+          dynamicNoticeProps.path = record.openPage;
+          dynamicNoticeProps.formData = { id: record.busId };
+          instance.refs.dynamicNoticeRef?.detail(record.openPage);
         } else {
           detailModal.openModal(true, {
             record,
             isUpdate: true,
-          })
+          });
         }
-        popoverVisible.value = false
+        popoverVisible.value = false;
       }
 
       // 初始化 WebSocket
       function initWebSocket() {
-        let userId = unref(userStore.getUserInfo).id
-        let token=getToken();
+        let userId = unref(userStore.getUserInfo).id;
+        let token = getToken();
         // WebSocket与普通的请求所用协议有所不同，ws等同于http，wss等同于https
-        let url = glob.domainUrl?.replace('https://', 'wss://').replace('http://', 'ws://') + '/websocket/' + userId
-        connectWebSocket(url)
-        onWebSocket(onWebSocketMessage)
+        let url = glob.domainUrl?.replace('https://', 'wss://').replace('http://', 'ws://') + '/websocket/' + userId;
+        connectWebSocket(url);
+        onWebSocket(onWebSocketMessage);
       }
 
       function onWebSocketMessage(data) {
         if (data.cmd === 'topic' || data.cmd === 'user') {
-          loadData()
+          loadData();
         }
       }
 
       // 清空消息
       function onEmptyNotify() {
-        popoverVisible.value = false
-        readAllMsg({}, loadData)
+        popoverVisible.value = false;
+        readAllMsg({}, loadData);
       }
 
       return {
diff --git a/src/layouts/default/header/components/notify/notify.api.ts b/src/layouts/default/header/components/notify/notify.api.ts
index a84242e..40cc724 100644
--- a/src/layouts/default/header/components/notify/notify.api.ts
+++ b/src/layouts/default/header/components/notify/notify.api.ts
@@ -1,4 +1,4 @@
-import { defHttp } from '/@/utils/http/axios'
+import { defHttp } from '/@/utils/http/axios';
 
 enum Api {
   listCementByUser = '/sys/annountCement/listByUser',
@@ -9,6 +9,6 @@ enum Api {
  * 列表接口
  * @param params
  */
-export const listCementByUser = (params?) => defHttp.get({ url: Api.listCementByUser, params })
+export const listCementByUser = (params?) => defHttp.get({ url: Api.listCementByUser, params });
 
-export const editCementSend = (anntId, params?) => defHttp.put({ url: Api.editCementSend, params: { anntId, ...params } })
\ No newline at end of file
+export const editCementSend = (anntId, params?) => defHttp.put({ url: Api.editCementSend, params: { anntId, ...params } });
diff --git a/src/layouts/default/header/components/user-dropdown/DepartSelect.vue b/src/layouts/default/header/components/user-dropdown/DepartSelect.vue
index 755d8c9..4b1c2db 100644
--- a/src/layouts/default/header/components/user-dropdown/DepartSelect.vue
+++ b/src/layouts/default/header/components/user-dropdown/DepartSelect.vue
@@ -1,263 +1,262 @@
 <template>
-    <BasicModal v-bind="config" :title="currTitle" v-model:visible="visible" wrapClassName="loginSelectModal" >
-        <a-form ref="formRef" v-bind="layout" :colon="false" class="loginSelectForm">
-            <a-form-item v-if="isMultiTenant" :validate-status="validate_status">
-                <!--label内容-->
-                <template #label>
-                    <a-tooltip placement="topLeft">
-                        <template #title>
-                            <span>您隶属于多租户，请选择当前所属租户</span>
-                        </template>
-                        <a-avatar style="background-color: #87d068" :size="30">
-                           租户
-                        </a-avatar>
-                    </a-tooltip>
-                </template>
-                <!--部门下拉内容-->
-                <a-select v-model:value="tenantSelected" placeholder="请选择登录部门"  :class="{'valid-error':validate_status=='error'}">
-                    <template #suffixIcon>
-                        <Icon icon="ant-design:gold-outline"/>
-                    </template>
-                    <template v-for="tenant in tenantList" :key="tenant.id">
-                        <a-select-option :value="tenant.id">{{ tenant.name }}</a-select-option>
-                    </template>
-                </a-select>
-            </a-form-item>
-            <a-form-item v-if="isMultiDepart" :validate-status="validate_status1">
-                <!--label内容-->
-                <template #label>
-                    <a-tooltip placement="topLeft">
-                        <template #title>
-                            <span>您隶属于多部门，请选择当前所在部门</span>
-                        </template>
-                        <a-avatar style="background-color: rgb(104, 208, 203);" :size="30">
-                           部门
-                        </a-avatar>
-                    </a-tooltip>
-                </template>
-                <!--部门下拉内容-->
-                <a-select v-model:value="departSelected" placeholder="请选择登录部门"  :class="{'valid-error':validate_status1=='error'}">
-                    <template #suffixIcon>
-                        <Icon icon="ant-design:gold-outline"/>
-                    </template>
-                    <template v-for="depart in departList" :key="depart.orgCode">
-                        <a-select-option :value="depart.orgCode">{{ depart.departName }}</a-select-option>
-                    </template>
-                </a-select>
-            </a-form-item>
-        </a-form>
-
-        <template #footer>
-            <a-button @click="close">关闭</a-button>
-            <a-button @click="handleSubmit" type="primary">确认</a-button>
+  <BasicModal v-bind="config" :title="currTitle" v-model:visible="visible" wrapClassName="loginSelectModal">
+    <a-form ref="formRef" v-bind="layout" :colon="false" class="loginSelectForm">
+      <a-form-item v-if="isMultiTenant" :validate-status="validate_status">
+        <!--label内容-->
+        <template #label>
+          <a-tooltip placement="topLeft">
+            <template #title>
+              <span>您隶属于多租户，请选择当前所属租户</span>
+            </template>
+            <a-avatar style="background-color: #87d068" :size="30"> 租户 </a-avatar>
+          </a-tooltip>
         </template>
-    </BasicModal>
+        <!--部门下拉内容-->
+        <a-select v-model:value="tenantSelected" placeholder="请选择登录部门" :class="{ 'valid-error': validate_status == 'error' }">
+          <template #suffixIcon>
+            <Icon icon="ant-design:gold-outline" />
+          </template>
+          <template v-for="tenant in tenantList" :key="tenant.id">
+            <a-select-option :value="tenant.id">{{ tenant.name }}</a-select-option>
+          </template>
+        </a-select>
+      </a-form-item>
+      <a-form-item v-if="isMultiDepart" :validate-status="validate_status1">
+        <!--label内容-->
+        <template #label>
+          <a-tooltip placement="topLeft">
+            <template #title>
+              <span>您隶属于多部门，请选择当前所在部门</span>
+            </template>
+            <a-avatar style="background-color: rgb(104, 208, 203)" :size="30"> 部门 </a-avatar>
+          </a-tooltip>
+        </template>
+        <!--部门下拉内容-->
+        <a-select v-model:value="departSelected" placeholder="请选择登录部门" :class="{ 'valid-error': validate_status1 == 'error' }">
+          <template #suffixIcon>
+            <Icon icon="ant-design:gold-outline" />
+          </template>
+          <template v-for="depart in departList" :key="depart.orgCode">
+            <a-select-option :value="depart.orgCode">{{ depart.departName }}</a-select-option>
+          </template>
+        </a-select>
+      </a-form-item>
+    </a-form>
+
+    <template #footer>
+      <a-button @click="close">关闭</a-button>
+      <a-button @click="handleSubmit" type="primary">确认</a-button>
+    </template>
+  </BasicModal>
 </template>
 <script lang="ts" setup>
-    import {ref, computed, watch,unref,defineExpose} from 'vue';
-    import {Avatar} from 'ant-design-vue';
-    import {BasicModal} from '/@/components/Modal';
-    import {getUserDeparts,selectDepart} from '/@/views/system/depart/depart.api';
-    import {getUserTenants} from "/@/views/system/tenant/tenant.api";
-    import {useMessage} from '/@/hooks/web/useMessage';
-    import { useUserStore } from '/@/store/modules/user';
-    
-    const userStore = useUserStore();
-    const {createMessage,notification} = useMessage();
-    const props = defineProps({
-        title: {type: String, default: '部门选择'},
-        closable: {type: Boolean, default: false},
-        username: {type: String, default: ''},
+  import { ref, computed, watch, unref, defineExpose } from 'vue';
+  import { Avatar } from 'ant-design-vue';
+  import { BasicModal } from '/@/components/Modal';
+  import { getUserDeparts, selectDepart } from '/@/views/system/depart/depart.api';
+  import { getUserTenants } from '/@/views/system/tenant/tenant.api';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { useUserStore } from '/@/store/modules/user';
+
+  const userStore = useUserStore();
+  const { createMessage, notification } = useMessage();
+  const props = defineProps({
+    title: { type: String, default: '部门选择' },
+    closable: { type: Boolean, default: false },
+    username: { type: String, default: '' },
+  });
+
+  const layout = {
+    labelCol: { span: 4 },
+    wrapperCol: { span: 18 },
+  };
+
+  const config = {
+    maskClosable: false,
+    closable: false,
+    canFullscreen: false,
+    width: '500px',
+    minHeight: 20,
+    maxHeight: 20,
+  };
+  const currTitle = ref('');
+
+  const isMultiTenant = ref(false);
+  const currentTenantName = ref('');
+  const tenantSelected = ref();
+  const tenantList = ref([]);
+  const validate_status = ref('');
+
+  const isMultiDepart = ref(false);
+  const currentDepartName = ref('');
+  const departSelected = ref('');
+  const departList = ref([]);
+  const validate_status1 = ref('');
+  //弹窗显隐
+  const visible = ref(false);
+  /**
+   * 弹窗打开前处理
+   */
+  async function show() {
+    //加载部门
+    await loadDepartList();
+    //加载租户
+    await loadTenantList();
+    //标题配置
+    if (unref(isMultiTenant) && unref(isMultiDepart)) {
+      currTitle.value = '切换租户和部门';
+    } else if (unref(isMultiTenant)) {
+      currTitle.value = unref(currentTenantName) && unref(currentTenantName).length > 0 ? `租户切换（当前租户 :${unref(currentTenantName)}）` : props.title;
+    } else if (unref(isMultiDepart)) {
+      currTitle.value = unref(currentDepartName) && unref(currentDepartName).length > 0 ? `部门切换（当前部门 :${unref(currentDepartName)}）` : props.title;
+    }
+    //model显隐
+    if (unref(isMultiTenant) || unref(isMultiDepart)) {
+      visible.value = true;
+    }
+  }
+  /**
+   *加载部门信息
+   */
+  async function loadDepartList() {
+    const result = await getUserDeparts();
+    if (!result.list || result.list.length == 0) {
+      return;
+    }
+    let currentDepart = result.list.filter((item) => item.orgCode == result.orgCode);
+    departList.value = result.list;
+    departSelected.value = currentDepart && currentDepart.length > 0 ? result.orgCode : '';
+    currentDepartName.value = currentDepart && currentDepart.length > 0 ? currentDepart[0].departName : '';
+    isMultiDepart.value = true;
+  }
+  /**
+   *加载租户信息
+   */
+  async function loadTenantList() {
+    const result = await getUserTenants();
+    if (!result.list || result.list.length == 0) {
+      return;
+    }
+    let tenantId = userStore.getTenant;
+    let currentTenant = result.list.filter((item) => item.id == tenantId);
+    currentTenantName.value = currentTenant && currentTenant.length > 0 ? currentTenant[0].name : '';
+    tenantList.value = result.list;
+    tenantSelected.value = tenantId;
+    isMultiTenant.value = true;
+  }
+
+  /**
+   * 提交数据
+   */
+  async function handleSubmit() {
+    if (unref(isMultiTenant) && !unref(tenantSelected)) {
+      validate_status.value = 'error';
+      return false;
+    }
+    if (unref(isMultiDepart) && !unref(departSelected)) {
+      validate_status1.value = 'error';
+      return false;
+    }
+    departResolve()
+      .then(() => {
+        if (unref(isMultiTenant)) {
+          userStore.setTenant(unref(tenantSelected));
+        }
+        createMessage.success('切换成功');
+      })
+      .catch((e) => {
+        console.log('登录选择出现问题', e);
+      })
+      .finally(() => {
+        if (unref(isMultiTenant)) {
+          userStore.setTenant(unref(tenantSelected));
+        }
+        close();
+      });
+  }
+  /**
+   *切换选择部门
+   */
+  function departResolve() {
+    return new Promise(async (resolve, reject) => {
+      if (!unref(isMultiDepart)) {
+        resolve();
+      } else {
+        const result = await selectDepart({ username: userStore.getUserInfo.username, orgCode: unref(departSelected) });
+        if (result.userInfo) {
+          const userInfo = result.userInfo;
+          userStore.setUserInfo(userInfo);
+          resolve();
+        } else {
+          requestFailed(result);
+          userStore.logout();
+          reject();
+        }
+      }
     });
-    
-    const layout = {
-        labelCol: { span: 4 },
-        wrapperCol: { span: 18 },
-    };
-    
-    const config ={
-        maskClosable:false,
-        closable:false,
-        canFullscreen:false,
-        width:"500px" ,
-        minHeight: 20,
-        maxHeight: 20,
-    };
-    const currTitle = ref('');
-    
-    const isMultiTenant = ref(false);
-    const currentTenantName = ref('');
-    const tenantSelected = ref();
-    const tenantList = ref([]);
-    const validate_status = ref('');
-    
-    const isMultiDepart = ref(false);
-    const currentDepartName = ref('');
-    const departSelected = ref('');
-    const departList = ref([]);
-    const validate_status1 = ref('');
-    //弹窗显隐
-    const visible = ref(false);
-    /**
-     * 弹窗打开前处理
-     */
-     async function show() {
-         //加载部门
-        await loadDepartList();
-        //加载租户
-        await loadTenantList();
-        //标题配置
-        if(unref(isMultiTenant)&&unref(isMultiDepart)){
-            currTitle.value =  '切换租户和部门';
-        }else if(unref(isMultiTenant)){
-            currTitle.value = unref(currentTenantName) && unref(currentTenantName).length > 0 ? `租户切换（当前租户 :${unref(currentTenantName)}）` : props.title;
-        }else if(unref(isMultiDepart)){
-            currTitle.value = unref(currentDepartName) && unref(currentDepartName).length > 0 ? `部门切换（当前部门 :${unref(currentDepartName)}）` : props.title;
-        }
-        //model显隐
-        if(unref(isMultiTenant)||unref(isMultiDepart)){
-            visible.value = true
-        }
-     }
-    /**
-     *加载部门信息
-     */
-    async function loadDepartList() {
-        const result = await getUserDeparts();
-        if (!result.list || result.list.length == 0) {
-            return;
-        }
-        let currentDepart = result.list.filter(item => item.orgCode == result.orgCode);
-        departList.value = result.list;
-        departSelected.value = currentDepart && currentDepart.length > 0 ?result.orgCode:'';
-        currentDepartName.value = currentDepart && currentDepart.length > 0 ?currentDepart[0].departName:'';
-        isMultiDepart.value = true
-    }
-    /**
-     *加载租户信息
-     */
-    async function loadTenantList() {
-        const result = await getUserTenants();
-        if (!result.list || result.list.length == 0) {
-            return;
-        }
-        let tenantId = userStore.getTenant;
-        let currentTenant = result.list.filter(item => item.id == tenantId);
-        currentTenantName.value = currentTenant && currentTenant.length > 0 ?currentTenant[0].name:'';
-        tenantList.value = result.list;
-        tenantSelected.value = tenantId;
-        isMultiTenant.value = true
-    }
+  }
+  /**
+   * 请求失败处理
+   */
+  function requestFailed(err) {
+    notification.error({
+      message: '登录失败',
+      description: ((err.response || {}).data || {}).message || err.message || '请求出现错误，请稍后再试',
+      duration: 4,
+    });
+  }
+  /**
+   * 关闭model
+   */
+  function close() {
+    departClear();
+  }
 
-    /**
-     * 提交数据
-     */
-    async function handleSubmit() {
-        if(unref(isMultiTenant) && !unref(tenantSelected)){
-            validate_status.value = 'error';
-            return false
-        }
-        if(unref(isMultiDepart)&& !unref(departSelected)){
-            validate_status1.value = 'error';
-            return false
-        }
-        departResolve().then(()=>{
-            if(unref(isMultiTenant)){
-                userStore.setTenant(unref(tenantSelected));
-            }
-            createMessage.success('切换成功')
-        }).catch((e) => {
-            console.log('登录选择出现问题', e)
-        }).finally(()=>{
-            if(unref(isMultiTenant)){
-                userStore.setTenant(unref(tenantSelected));
-            }
-            close()
-        })
-    }
-    /**
-     *切换选择部门
-     */
-     function departResolve() {
-        return new Promise(async (resolve, reject) => {
-            if (!unref(isMultiDepart)) {
-                resolve();
-            } else {
-                const result = await selectDepart({username:userStore.getUserInfo.username,orgCode:unref(departSelected)});
-                if(result.userInfo){
-                    const userInfo = result.userInfo;
-                    userStore.setUserInfo(userInfo);
-                    resolve();
-                }else{
-                    requestFailed(result);
-                    userStore.logout();
-                    reject();
-                }
-            }
-        })
-    }
-    /**
-     * 请求失败处理
-     */
-    function requestFailed(err) {
-        notification.error({
-            message: '登录失败',
-            description: ((err.response || {}).data || {}).message || err.message || "请求出现错误，请稍后再试",
-            duration: 4,
-        });
-    }
-    /**
-     * 关闭model
-     */
-    function close() {
-       departClear();
-    }
+  /**
+   *初始化数据
+   */
+  function departClear() {
+    currTitle.value = '';
 
-    /**
-     *初始化数据
-     */
-    function departClear() {
-        currTitle.value = "";
+    isMultiTenant.value = false;
+    currentTenantName.value = '';
+    tenantSelected.value = '';
+    tenantList.value = [];
+    validate_status.value = '';
 
-        isMultiTenant.value = false;
-        currentTenantName.value = '';
-        tenantSelected.value = '';
-        tenantList.value = [];
-        validate_status.value = '';
+    isMultiDepart.value = false;
+    currentDepartName.value = '';
+    departSelected.value = '';
+    departList.value = [];
+    validate_status1.value = '';
 
-        isMultiDepart.value = false;
-        currentDepartName.value = "";
-        departSelected.value = "";
-        departList.value = [];
-        validate_status1.value = "";
-        
-        visible.value = false
+    visible.value = false;
+  }
+
+  /**
+   * 监听username
+   */
+  watch(
+    () => props.username,
+    (value) => {
+      value && loadDepartList();
     }
+  );
 
-    /**
-     * 监听username
-     */
-    watch(
-        () => props.username,
-        (value) => {
-            value && loadDepartList();
-        }
-    );
-    
-    defineExpose({
-        show,
-    })
+  defineExpose({
+    show,
+  });
 </script>
 <style lang="less" scoped>
-    .loginSelectForm{
-        margin-bottom: -20px;
-    }
+  .loginSelectForm {
+    margin-bottom: -20px;
+  }
 
-    .loginSelectModal{
-        top: 20px;
-    }
-    
-    .valid-error .ant-select-selection__placeholder{
-        color: #f5222d;
-    }
+  .loginSelectModal {
+    top: 20px;
+  }
+
+  .valid-error .ant-select-selection__placeholder {
+    color: #f5222d;
+  }
 </style>
diff --git a/src/layouts/default/header/components/user-dropdown/UpdatePassword.vue b/src/layouts/default/header/components/user-dropdown/UpdatePassword.vue
index d460428..50fed3b 100644
--- a/src/layouts/default/header/components/user-dropdown/UpdatePassword.vue
+++ b/src/layouts/default/header/components/user-dropdown/UpdatePassword.vue
@@ -1,89 +1,89 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" title="修改密码" @ok="handleSubmit" width="600px">
-        <BasicForm @register="registerForm"/>
-    </BasicModal>
+  <BasicModal v-bind="$attrs" @register="registerModal" title="修改密码" @ok="handleSubmit" width="600px">
+    <BasicForm @register="registerForm" />
+  </BasicModal>
 </template>
 <script lang="ts" setup>
-    import {ref, unref, defineExpose} from 'vue';
-    import {rules} from '/@/utils/helper/validator';
-    import {defHttp} from '/@/utils/http/axios';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {BasicForm, useForm} from '/@/components/Form/index';
-    import {useMessage} from '/@/hooks/web/useMessage';
-    // 声明Emits
-    const emit = defineEmits(['register']);
-    const $message = useMessage();
-    const formRef = ref();
-    const username = ref('');
-    //表单配置
-    const [registerForm, {resetFields, validate, clearValidate}] = useForm({
-        schemas: [
-            {
-                label: '旧密码',
-                field: 'oldpassword',
-                component: 'InputPassword',
-                required: true
-            },
-            {
-                label: '新密码',
-                field: 'password',
-                component: 'StrengthMeter',
-                componentProps: {
-                    placeholder: '请输入新密码',
-                },
-                rules: [
-                    {
-                        required: true,
-                        message: '请输入新密码',
-                    },
-                ],
-            },
-            {
-                label: '确认新密码',
-                field: 'confirmpassword',
-                component: 'InputPassword',
-                dynamicRules: ({values}) => rules.confirmPassword(values, true)
-            }
+  import { ref, unref, defineExpose } from 'vue';
+  import { rules } from '/@/utils/helper/validator';
+  import { defHttp } from '/@/utils/http/axios';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  // 声明Emits
+  const emit = defineEmits(['register']);
+  const $message = useMessage();
+  const formRef = ref();
+  const username = ref('');
+  //表单配置
+  const [registerForm, { resetFields, validate, clearValidate }] = useForm({
+    schemas: [
+      {
+        label: '旧密码',
+        field: 'oldpassword',
+        component: 'InputPassword',
+        required: true,
+      },
+      {
+        label: '新密码',
+        field: 'password',
+        component: 'StrengthMeter',
+        componentProps: {
+          placeholder: '请输入新密码',
+        },
+        rules: [
+          {
+            required: true,
+            message: '请输入新密码',
+          },
         ],
-        showActionButtonGroup: false,
-    });
-    //表单赋值
-    const [registerModal, {setModalProps, closeModal}] = useModalInner();
+      },
+      {
+        label: '确认新密码',
+        field: 'confirmpassword',
+        component: 'InputPassword',
+        dynamicRules: ({ values }) => rules.confirmPassword(values, true),
+      },
+    ],
+    showActionButtonGroup: false,
+  });
+  //表单赋值
+  const [registerModal, { setModalProps, closeModal }] = useModalInner();
 
-    //表单提交事件
-    async function handleSubmit() {
-        try {
-            const values = await validate();
-            setModalProps({confirmLoading: true});
-            //提交表单
-            let params = Object.assign({username: unref(username)}, values)
-            defHttp.put({url: 'sys/user/updatePassword', params}, {isTransformResponse: false}).then((res) => {
-                if (res.success) {
-                    $message.createMessage.success(res.message);
-                    //关闭弹窗
-                    closeModal();
-                } else {
-                    $message.createMessage.warning(res.message);
-                }
-            })
-        } finally {
-            setModalProps({confirmLoading: false});
-        }
-    }
-
-    async function show(name) {
-        if (!name) {
-            $message.createMessage.warning("当前系统无登录用户!");
-            return
+  //表单提交事件
+  async function handleSubmit() {
+    try {
+      const values = await validate();
+      setModalProps({ confirmLoading: true });
+      //提交表单
+      let params = Object.assign({ username: unref(username) }, values);
+      defHttp.put({ url: 'sys/user/updatePassword', params }, { isTransformResponse: false }).then((res) => {
+        if (res.success) {
+          $message.createMessage.success(res.message);
+          //关闭弹窗
+          closeModal();
         } else {
-            username.value = name
-            await setModalProps({visible: true});
-            await resetFields();
-            await clearValidate();
+          $message.createMessage.warning(res.message);
         }
+      });
+    } finally {
+      setModalProps({ confirmLoading: false });
     }
+  }
 
-    defineExpose({
-        show
-    })
+  async function show(name) {
+    if (!name) {
+      $message.createMessage.warning('当前系统无登录用户!');
+      return;
+    } else {
+      username.value = name;
+      await setModalProps({ visible: true });
+      await resetFields();
+      await clearValidate();
+    }
+  }
+
+  defineExpose({
+    show,
+  });
 </script>
diff --git a/src/layouts/default/header/components/user-dropdown/index.vue b/src/layouts/default/header/components/user-dropdown/index.vue
index 1ede485..8e568f7 100644
--- a/src/layouts/default/header/components/user-dropdown/index.vue
+++ b/src/layouts/default/header/components/user-dropdown/index.vue
@@ -11,56 +11,31 @@
 
     <template #overlay>
       <Menu @click="handleMenuClick">
-        <MenuItem
-          key="doc"
-          :text="t('layout.header.dropdownItemDoc')"
-          icon="ion:document-text-outline"
-          v-if="getShowDoc"
-        />
+        <MenuItem key="doc" :text="t('layout.header.dropdownItemDoc')" icon="ion:document-text-outline" v-if="getShowDoc" />
         <MenuDivider v-if="getShowDoc" />
-        <MenuItem
-          key="account"
-          :text="t('layout.header.dropdownItemSwitchAccount')"
-          icon="ant-design:setting-outlined"
-        />
-        <MenuItem
-          key="password"
-          :text="t('layout.header.dropdownItemSwitchPassword')"
-          icon="ant-design:edit-outlined"
-        />
-        <MenuItem
-          key="depart"
-          :text="t('layout.header.dropdownItemSwitchDepart')"
-          icon="ant-design:cluster-outlined"
-        />
-        <MenuItem
-          key="cache"
-          :text="t('layout.header.dropdownItemRefreshCache')"
-          icon="ion:sync-outline"
-        />
-       <!-- <MenuItem
+        <MenuItem key="account" :text="t('layout.header.dropdownItemSwitchAccount')" icon="ant-design:setting-outlined" />
+        <MenuItem key="password" :text="t('layout.header.dropdownItemSwitchPassword')" icon="ant-design:edit-outlined" />
+        <MenuItem key="depart" :text="t('layout.header.dropdownItemSwitchDepart')" icon="ant-design:cluster-outlined" />
+        <MenuItem key="cache" :text="t('layout.header.dropdownItemRefreshCache')" icon="ion:sync-outline" />
+        <!-- <MenuItem
             v-if="getUseLockPage"
             key="lock"
             :text="t('layout.header.tooltipLock')"
             icon="ion:lock-closed-outline"
         />-->
-        <MenuItem
-                key="logout"
-                :text="t('layout.header.dropdownItemLoginOut')"
-                icon="ion:power-outline"
-        />
+        <MenuItem key="logout" :text="t('layout.header.dropdownItemLoginOut')" icon="ion:power-outline" />
       </Menu>
     </template>
   </Dropdown>
   <LockAction @register="register" />
-  <DepartSelect ref="loginSelectRef"/>
-  <UpdatePassword ref="updatePasswordRef"/>
+  <DepartSelect ref="loginSelectRef" />
+  <UpdatePassword ref="updatePasswordRef" />
 </template>
 <script lang="ts">
   // components
   import { Dropdown, Menu } from 'ant-design-vue';
 
-  import { defineComponent, computed,ref } from 'vue';
+  import { defineComponent, computed, ref } from 'vue';
 
   import { SITE_URL } from '/@/settings/siteSetting';
 
@@ -69,7 +44,7 @@
   import { useI18n } from '/@/hooks/web/useI18n';
   import { useDesign } from '/@/hooks/web/useDesign';
   import { useModal } from '/@/components/Modal';
-  import {useMessage} from '/src/hooks/web/useMessage';
+  import { useMessage } from '/src/hooks/web/useMessage';
   import { useGo } from '/@/hooks/web/usePage';
   import headerImg from '/@/assets/images/header.jpg';
   import { propTypes } from '/@/utils/propTypes';
@@ -77,13 +52,13 @@
 
   import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent';
 
-  import {refreshCache,queryAllDictItems} from '/@/views/system/dict/dict.api';
+  import { refreshCache, queryAllDictItems } from '/@/views/system/dict/dict.api';
   import { DB_DICT_DATA_KEY } from '/src/enums/cacheEnum';
-  import { removeAuthCache,setAuthCache } from '/src/utils/auth';
-  import {getFileAccessHttpUrl} from '/@/utils/common/compUtils'
+  import { removeAuthCache, setAuthCache } from '/src/utils/auth';
+  import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
 
-  type MenuEvent = 'logout' | 'doc' | 'lock'|'cache' | 'depart';
-  const {createMessage} = useMessage();
+  type MenuEvent = 'logout' | 'doc' | 'lock' | 'cache' | 'depart';
+  const { createMessage } = useMessage();
   export default defineComponent({
     name: 'UserDropdown',
     components: {
@@ -104,16 +79,16 @@
       const { getShowDoc, getUseLockPage } = useHeaderSetting();
       const userStore = useUserStore();
       const go = useGo();
-      
+
       const getUserInfo = computed(() => {
         const { realname = '', avatar, desc } = userStore.getUserInfo || {};
         return { realname, avatar: avatar || headerImg, desc };
       });
 
-      const getAvatarUrl = computed(() => getFileAccessHttpUrl(getUserInfo.value?.avatar))
-      
+      const getAvatarUrl = computed(() => getFileAccessHttpUrl(getUserInfo.value?.avatar));
+
       const [register, { openModal }] = useModal();
-       /**
+      /**
        * 多部门弹窗逻辑
        */
       const loginSelectRef = ref();
@@ -133,24 +108,24 @@
 
       // 清除缓存
       async function clearCache() {
-          const result = await refreshCache();
-          if(result.success){
-              const res = await queryAllDictItems();
-              removeAuthCache(DB_DICT_DATA_KEY)
-              setAuthCache(DB_DICT_DATA_KEY, res.result)
-              createMessage.success("刷新缓存完成！");
-          }else{
-              createMessage.error("刷新缓存失败！");
-          }
+        const result = await refreshCache();
+        if (result.success) {
+          const res = await queryAllDictItems();
+          removeAuthCache(DB_DICT_DATA_KEY);
+          setAuthCache(DB_DICT_DATA_KEY, res.result);
+          createMessage.success('刷新缓存完成！');
+        } else {
+          createMessage.error('刷新缓存失败！');
+        }
       }
       // 切换部门
-       function updateCurrentDepart() {
-           loginSelectRef.value.show()
+      function updateCurrentDepart() {
+        loginSelectRef.value.show();
       }
       // 修改密码
-       const updatePasswordRef = ref();
-       function updatePassword() {
-           updatePasswordRef.value.show(userStore.getUserInfo.username)
+      const updatePasswordRef = ref();
+      function updatePassword() {
+        updatePasswordRef.value.show(userStore.getUserInfo.username);
       }
 
       function handleMenuClick(e: { key: MenuEvent }) {
diff --git a/src/layouts/default/header/index.vue b/src/layouts/default/header/index.vue
index b4bfc3c..c6cb142 100644
--- a/src/layouts/default/header/index.vue
+++ b/src/layouts/default/header/index.vue
@@ -3,31 +3,15 @@
     <!-- left start -->
     <div :class="`${prefixCls}-left`">
       <!-- logo -->
-      <AppLogo
-        v-if="getShowHeaderLogo || getIsMobile"
-        :class="`${prefixCls}-logo`"
-        :theme="getHeaderTheme"
-        :style="getLogoWidth"
-      />
-      <LayoutTrigger
-        v-if="
-          (getShowContent && getShowHeaderTrigger && !getSplit && !getIsMixSidebar) || getIsMobile
-        "
-        :theme="getHeaderTheme"
-        :sider="false"
-      />
+      <AppLogo v-if="getShowHeaderLogo || getIsMobile" :class="`${prefixCls}-logo`" :theme="getHeaderTheme" :style="getLogoWidth" />
+      <LayoutTrigger v-if="(getShowContent && getShowHeaderTrigger && !getSplit && !getIsMixSidebar) || getIsMobile" :theme="getHeaderTheme" :sider="false" />
       <LayoutBreadcrumb v-if="getShowContent && getShowBread" :theme="getHeaderTheme" />
     </div>
     <!-- left end -->
 
     <!-- menu start -->
     <div :class="`${prefixCls}-menu`" v-if="getShowTopMenu && !getIsMobile">
-      <LayoutMenu
-        :isHorizontal="true"
-        :theme="getHeaderTheme"
-        :splitType="getSplitType"
-        :menuMode="getMenuMode"
-      />
+      <LayoutMenu :isHorizontal="true" :theme="getHeaderTheme" :splitType="getSplitType" :menuMode="getMenuMode" />
     </div>
     <!-- menu-end -->
 
@@ -41,14 +25,9 @@
 
       <FullScreen v-if="getShowFullScreen" :class="`${prefixCls}-action__item fullscreen-item`" />
 
-      <LockScreen  v-if="getUseLockPage"  />
+      <LockScreen v-if="getUseLockPage" />
 
-      <AppLocalePicker
-        v-if="getShowLocalePicker"
-        :reload="true"
-        :showText="false"
-        :class="`${prefixCls}-action__item`"
-      />
+      <AppLocalePicker v-if="getShowLocalePicker" :reload="true" :showText="false" :class="`${prefixCls}-action__item`" />
 
       <UserDropDown :theme="getHeaderTheme" />
 
@@ -58,7 +37,7 @@
   <LoginSelect ref="loginSelectRef" @success="loginSelectOk"></LoginSelect>
 </template>
 <script lang="ts">
-  import { defineComponent, unref, computed , ref , onMounted , toRaw} from 'vue';
+  import { defineComponent, unref, computed, ref, onMounted, toRaw } from 'vue';
 
   import { propTypes } from '/@/utils/propTypes';
 
@@ -86,7 +65,7 @@
 
   import LoginSelect from '/@/views/sys/login/LoginSelect.vue';
   import { useUserStore } from '/@/store/modules/user';
-  import { getUserTenantId,setAuthCache } from '/@/utils/auth';
+  import { getUserTenantId, setAuthCache } from '/@/utils/auth';
   import { TENANT_ID } from '/@/enums/cacheEnum';
 
   export default defineComponent({
@@ -115,28 +94,10 @@
     setup(props) {
       const { prefixCls } = useDesign('layout-header');
       const userStore = useUserStore();
-      const {
-        getShowTopMenu,
-        getShowHeaderTrigger,
-        getSplit,
-        getIsMixMode,
-        getMenuWidth,
-        getIsMixSidebar,
-      } = useMenuSetting();
-      const { getUseErrorHandle, getShowSettingButton, getSettingButtonPosition } =
-        useRootSetting();
+      const { getShowTopMenu, getShowHeaderTrigger, getSplit, getIsMixMode, getMenuWidth, getIsMixSidebar } = useMenuSetting();
+      const { getUseErrorHandle, getShowSettingButton, getSettingButtonPosition } = useRootSetting();
 
-      const {
-        getHeaderTheme,
-        getShowFullScreen,
-        getShowNotice,
-        getShowContent,
-        getShowBread,
-        getShowHeaderLogo,
-        getShowHeader,
-        getShowSearch,
-        getUseLockPage,
-      } = useHeaderSetting();
+      const { getHeaderTheme, getShowFullScreen, getShowNotice, getShowContent, getShowBread, getShowHeaderLogo, getShowHeader, getShowSearch, getUseLockPage } = useHeaderSetting();
 
       const { getShowLocalePicker } = useLocale();
 
@@ -182,32 +143,32 @@
         return unref(getSplit) ? MenuModeEnum.HORIZONTAL : null;
       });
 
-       /**
+      /**
        * 首页多租户部门弹窗逻辑
        */
       const loginSelectRef = ref();
 
-      function showLoginSelect(){
-          //update-begin---author:liusq  Date:20220101  for：判断登录进来是否需要弹窗选择租户----
-          //判断当前用户的租户在缓存中是否存在
-          const userTenantId = getUserTenantId(userStore.getUserInfo.username);
-          if(!userTenantId && userTenantId!=0){
-              //当前用户的租户不存在，弹窗选择
-              const loginInfo = toRaw(userStore.getLoginInfo) || {};
-              loginSelectRef.value.show(loginInfo)
-          }else{
-              //当前用户的租户存在，直接赋值
-              setAuthCache(TENANT_ID, userTenantId);
-          }
-          //update-end---author:liusq  Date:20220101  for：判断登录进来是否需要弹窗选择租户----
+      function showLoginSelect() {
+        //update-begin---author:liusq  Date:20220101  for：判断登录进来是否需要弹窗选择租户----
+        //判断当前用户的租户在缓存中是否存在
+        const userTenantId = getUserTenantId(userStore.getUserInfo.username);
+        if (!userTenantId && userTenantId != 0) {
+          //当前用户的租户不存在，弹窗选择
+          const loginInfo = toRaw(userStore.getLoginInfo) || {};
+          loginSelectRef.value.show(loginInfo);
+        } else {
+          //当前用户的租户存在，直接赋值
+          setAuthCache(TENANT_ID, userTenantId);
+        }
+        //update-end---author:liusq  Date:20220101  for：判断登录进来是否需要弹窗选择租户----
       }
 
-      function loginSelectOk(){
-         console.log("成功。。。。。")
+      function loginSelectOk() {
+        console.log('成功。。。。。');
       }
 
       onMounted(() => {
-          showLoginSelect();
+        showLoginSelect();
       });
 
       return {
diff --git a/src/layouts/default/menu/index.vue b/src/layouts/default/menu/index.vue
index 639e458..c332e5a 100644
--- a/src/layouts/default/menu/index.vue
+++ b/src/layouts/default/menu/index.vue
@@ -1,197 +1,163 @@
 <script lang="tsx">
-    import type { PropType, CSSProperties } from 'vue';
+  import type { PropType, CSSProperties } from 'vue';
 
-    import { computed, defineComponent, unref, toRef } from 'vue';
-    import { BasicMenu } from '/@/components/Menu';
-    import { SimpleMenu } from '/@/components/SimpleMenu';
-    import { AppLogo } from '/@/components/Application';
+  import { computed, defineComponent, unref, toRef } from 'vue';
+  import { BasicMenu } from '/@/components/Menu';
+  import { SimpleMenu } from '/@/components/SimpleMenu';
+  import { AppLogo } from '/@/components/Application';
 
-    import { MenuModeEnum, MenuSplitTyeEnum } from '/@/enums/menuEnum';
+  import { MenuModeEnum, MenuSplitTyeEnum } from '/@/enums/menuEnum';
 
-    import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
-    import { ScrollContainer } from '/@/components/Container';
+  import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
+  import { ScrollContainer } from '/@/components/Container';
 
-    import { useGo } from '/@/hooks/web/usePage';
-    import { useSplitMenu } from './useLayoutMenu';
-    import { openWindow } from '/@/utils';
-    import { propTypes } from '/@/utils/propTypes';
-    import { isUrl } from '/@/utils/is';
-    import { useRootSetting } from '/@/hooks/setting/useRootSetting';
-    import { useAppInject } from '/@/hooks/web/useAppInject';
-    import { useDesign } from '/@/hooks/web/useDesign';
+  import { useGo } from '/@/hooks/web/usePage';
+  import { useSplitMenu } from './useLayoutMenu';
+  import { openWindow } from '/@/utils';
+  import { propTypes } from '/@/utils/propTypes';
+  import { isUrl } from '/@/utils/is';
+  import { useRootSetting } from '/@/hooks/setting/useRootSetting';
+  import { useAppInject } from '/@/hooks/web/useAppInject';
+  import { useDesign } from '/@/hooks/web/useDesign';
 
-    export default defineComponent({
-        name: 'LayoutMenu',
-        props: {
-            theme: propTypes.oneOf(['light', 'dark']),
+  export default defineComponent({
+    name: 'LayoutMenu',
+    props: {
+      theme: propTypes.oneOf(['light', 'dark']),
 
-            splitType: {
-                type: Number as PropType<MenuSplitTyeEnum>,
-                default: MenuSplitTyeEnum.NONE,
-            },
+      splitType: {
+        type: Number as PropType<MenuSplitTyeEnum>,
+        default: MenuSplitTyeEnum.NONE,
+      },
 
-            isHorizontal: propTypes.bool,
-            // menu Mode
-            menuMode: {
-                type: [String] as PropType<Nullable<MenuModeEnum>>,
-                default: '',
-            },
-        },
-        setup(props) {
-            const go = useGo();
+      isHorizontal: propTypes.bool,
+      // menu Mode
+      menuMode: {
+        type: [String] as PropType<Nullable<MenuModeEnum>>,
+        default: '',
+      },
+    },
+    setup(props) {
+      const go = useGo();
 
-            const {
-                getMenuMode,
-                getMenuType,
-                getMenuTheme,
-                getCollapsed,
-                getCollapsedShowTitle,
-                getAccordion,
-                getIsHorizontal,
-                getIsSidebarType,
-                getSplit,
-            } = useMenuSetting();
-            const { getShowLogo } = useRootSetting();
+      const { getMenuMode, getMenuType, getMenuTheme, getCollapsed, getCollapsedShowTitle, getAccordion, getIsHorizontal, getIsSidebarType, getSplit } = useMenuSetting();
+      const { getShowLogo } = useRootSetting();
 
-            const { prefixCls } = useDesign('layout-menu');
+      const { prefixCls } = useDesign('layout-menu');
 
-            const { menusRef } = useSplitMenu(toRef(props, 'splitType'));
+      const { menusRef } = useSplitMenu(toRef(props, 'splitType'));
 
-            const { getIsMobile } = useAppInject();
+      const { getIsMobile } = useAppInject();
 
-            const getComputedMenuMode = computed(() =>
-                unref(getIsMobile) ? MenuModeEnum.INLINE : props.menuMode || unref(getMenuMode)
-            );
+      const getComputedMenuMode = computed(() => (unref(getIsMobile) ? MenuModeEnum.INLINE : props.menuMode || unref(getMenuMode)));
 
-            const getComputedMenuTheme = computed(() => props.theme || unref(getMenuTheme));
+      const getComputedMenuTheme = computed(() => props.theme || unref(getMenuTheme));
 
-            const getIsShowLogo = computed(() => unref(getShowLogo) && unref(getIsSidebarType));
+      const getIsShowLogo = computed(() => unref(getShowLogo) && unref(getIsSidebarType));
 
-            const getUseScroll = computed(() => {
-                return (
-                    !unref(getIsHorizontal) &&
-                    (unref(getIsSidebarType) ||
-                        props.splitType === MenuSplitTyeEnum.LEFT ||
-                        props.splitType === MenuSplitTyeEnum.NONE)
-                );
-            });
+      const getUseScroll = computed(() => {
+        return !unref(getIsHorizontal) && (unref(getIsSidebarType) || props.splitType === MenuSplitTyeEnum.LEFT || props.splitType === MenuSplitTyeEnum.NONE);
+      });
 
-            const getWrapperStyle = computed((): CSSProperties => {
-                return {
-                    height: `calc(100% - ${unref(getIsShowLogo) ? '48px' : '0px'})`,
-                };
-            });
+      const getWrapperStyle = computed((): CSSProperties => {
+        return {
+          height: `calc(100% - ${unref(getIsShowLogo) ? '48px' : '0px'})`,
+        };
+      });
 
-            const getLogoClass = computed(() => {
-                return [
-                    `${prefixCls}-logo`,
-                    unref(getComputedMenuTheme),
-                    {
-                        [`${prefixCls}--mobile`]: unref(getIsMobile),
-                    },
-                ];
-            });
+      const getLogoClass = computed(() => {
+        return [
+          `${prefixCls}-logo`,
+          unref(getComputedMenuTheme),
+          {
+            [`${prefixCls}--mobile`]: unref(getIsMobile),
+          },
+        ];
+      });
 
-            const getCommonProps = computed(() => {
-                const menus = unref(menusRef);
-                return {
-                    menus,
-                    beforeClickFn: beforeMenuClickFn,
-                    items: menus,
-                    theme: unref(getComputedMenuTheme),
-                    accordion: unref(getAccordion),
-                    collapse: unref(getCollapsed),
-                    collapsedShowTitle: unref(getCollapsedShowTitle),
-                    onMenuClick: handleMenuClick,
-                };
-            });
-            /**
-             * click menu
-             * @param menu
-             */
+      const getCommonProps = computed(() => {
+        const menus = unref(menusRef);
+        return {
+          menus,
+          beforeClickFn: beforeMenuClickFn,
+          items: menus,
+          theme: unref(getComputedMenuTheme),
+          accordion: unref(getAccordion),
+          collapse: unref(getCollapsed),
+          collapsedShowTitle: unref(getCollapsedShowTitle),
+          onMenuClick: handleMenuClick,
+        };
+      });
+      /**
+       * click menu
+       * @param menu
+       */
 
-            function handleMenuClick(path: string) {
-                go(path);
-            }
+      function handleMenuClick(path: string) {
+        go(path);
+      }
 
-            /**
-             * before click menu
-             * @param menu
-             */
-            async function beforeMenuClickFn(path: string) {
-                if (!isUrl(path)) {
-                    return true;
-                }
-                openWindow(path);
-                return false;
-            }
+      /**
+       * before click menu
+       * @param menu
+       */
+      async function beforeMenuClickFn(path: string) {
+        if (!isUrl(path)) {
+          return true;
+        }
+        openWindow(path);
+        return false;
+      }
 
-            function renderHeader() {
-                if (!unref(getIsShowLogo) && !unref(getIsMobile)) return null;
+      function renderHeader() {
+        if (!unref(getIsShowLogo) && !unref(getIsMobile)) return null;
 
-                return (
-                    <AppLogo
-                        showTitle={!unref(getCollapsed)}
-                        class={unref(getLogoClass)}
-                        theme={unref(getComputedMenuTheme)}
-                    />
-                );
-            }
+        return <AppLogo showTitle={!unref(getCollapsed)} class={unref(getLogoClass)} theme={unref(getComputedMenuTheme)} />;
+      }
 
-            function renderMenu() {
-                const { menus, ...menuProps } = unref(getCommonProps);
-                // console.log(menus);
-                if (!menus || !menus.length) return null;
-                return !props.isHorizontal ? (
-                    <SimpleMenu {...menuProps} isSplitMenu={unref(getSplit)} items={menus} />
-                ) : (
-                    <BasicMenu
-                        {...(menuProps as any)}
-                        isHorizontal={props.isHorizontal}
-                        type={unref(getMenuType)}
-                        showLogo={unref(getIsShowLogo)}
-                        mode={unref(getComputedMenuMode as any)}
-                        items={menus}
-                    />
-                );
-            }
+      function renderMenu() {
+        const { menus, ...menuProps } = unref(getCommonProps);
+        // console.log(menus);
+        if (!menus || !menus.length) return null;
+        return !props.isHorizontal ? (
+          <SimpleMenu {...menuProps} isSplitMenu={unref(getSplit)} items={menus} />
+        ) : (
+          <BasicMenu {...(menuProps as any)} isHorizontal={props.isHorizontal} type={unref(getMenuType)} showLogo={unref(getIsShowLogo)} mode={unref(getComputedMenuMode as any)} items={menus} />
+        );
+      }
 
-            return () => {
-                return (
-                    <>
-                        {renderHeader()}
-                        {unref(getUseScroll) ? (
-                            <ScrollContainer style={unref(getWrapperStyle)}>{() => renderMenu()}</ScrollContainer>
-                        ) : (
-                            renderMenu()
-                        )}
-                    </>
-                );
-            };
-        },
-    });
+      return () => {
+        return (
+          <>
+            {renderHeader()}
+            {unref(getUseScroll) ? <ScrollContainer style={unref(getWrapperStyle)}>{() => renderMenu()}</ScrollContainer> : renderMenu()}
+          </>
+        );
+      };
+    },
+  });
 </script>
 <style lang="less">
-    @prefix-cls: ~'@{namespace}-layout-menu';
-    @logo-prefix-cls: ~'@{namespace}-app-logo';
+  @prefix-cls: ~'@{namespace}-layout-menu';
+  @logo-prefix-cls: ~'@{namespace}-app-logo';
 
-    .@{prefix-cls} {
-        &-logo {
-            height: @header-height;
-            padding: 10px 4px 10px 10px;
+  .@{prefix-cls} {
+    &-logo {
+      height: @header-height;
+      padding: 10px 4px 10px 10px;
 
-            img {
-                width: @logo-width;
-                height: @logo-width;
-            }
-        }
-
-        &--mobile {
-            .@{logo-prefix-cls} {
-                &__title {
-                    opacity: 1;
-                }
-            }
-        }
+      img {
+        width: @logo-width;
+        height: @logo-width;
+      }
     }
+
+    &--mobile {
+      .@{logo-prefix-cls} {
+        &__title {
+          opacity: 1;
+        }
+      }
+    }
+  }
 </style>
diff --git a/src/layouts/default/menu/useLayoutMenu.ts b/src/layouts/default/menu/useLayoutMenu.ts
index a7bf665..e5792da 100644
--- a/src/layouts/default/menu/useLayoutMenu.ts
+++ b/src/layouts/default/menu/useLayoutMenu.ts
@@ -19,13 +19,9 @@ export function useSplitMenu(splitType: Ref<MenuSplitTyeEnum>) {
 
   const throttleHandleSplitLeftMenu = useThrottleFn(handleSplitLeftMenu, 50);
 
-  const splitNotLeft = computed(
-    () => unref(splitType) !== MenuSplitTyeEnum.LEFT && !unref(getIsHorizontal)
-  );
+  const splitNotLeft = computed(() => unref(splitType) !== MenuSplitTyeEnum.LEFT && !unref(getIsHorizontal));
 
-  const getSplitLeft = computed(
-    () => !unref(getSplit) || unref(splitType) !== MenuSplitTyeEnum.LEFT
-  );
+  const getSplitLeft = computed(() => !unref(getSplit) || unref(splitType) !== MenuSplitTyeEnum.LEFT);
 
   const getSpiltTop = computed(() => unref(splitType) === MenuSplitTyeEnum.TOP);
 
diff --git a/src/layouts/default/setting/SettingDrawer.tsx b/src/layouts/default/setting/SettingDrawer.tsx
index db405f5..68efce5 100644
--- a/src/layouts/default/setting/SettingDrawer.tsx
+++ b/src/layouts/default/setting/SettingDrawer.tsx
@@ -1,14 +1,7 @@
 import { defineComponent, computed, unref } from 'vue';
 import { BasicDrawer } from '/@/components/Drawer/index';
 import { Divider } from 'ant-design-vue';
-import {
-  TypePicker,
-  ThemeColorPicker,
-  SettingFooter,
-  SwitchItem,
-  SelectItem,
-  InputNumberItem,
-} from './components';
+import { TypePicker, ThemeColorPicker, SettingFooter, SwitchItem, SelectItem, InputNumberItem } from './components';
 
 import { AppDarkModeToggle } from '/@/components/Application';
 
@@ -23,44 +16,19 @@ import { useI18n } from '/@/hooks/web/useI18n';
 
 import { baseHandler } from './handler';
 
-import {
-  HandlerEnum,
-  contentModeOptions,
-  topMenuAlignOptions,
-  getMenuTriggerOptions,
-  routerTransitionOptions,
-  menuTypeList,
-  mixSidebarTriggerOptions,
-  tabsThemeOptions,
-} from './enum'
+import { HandlerEnum, contentModeOptions, topMenuAlignOptions, getMenuTriggerOptions, routerTransitionOptions, menuTypeList, mixSidebarTriggerOptions, tabsThemeOptions } from './enum';
 
-import {
-  HEADER_PRESET_BG_COLOR_LIST,
-  SIDE_BAR_BG_COLOR_LIST,
-  APP_PRESET_COLOR_LIST,
-} from '/@/settings/designSetting';
+import { HEADER_PRESET_BG_COLOR_LIST, SIDE_BAR_BG_COLOR_LIST, APP_PRESET_COLOR_LIST } from '/@/settings/designSetting';
 
 const { t } = useI18n();
 
 export default defineComponent({
   name: 'SettingDrawer',
   setup(_, { attrs }) {
-    const {
-      getContentMode,
-      getShowFooter,
-      getShowBreadCrumb,
-      getShowBreadCrumbIcon,
-      getShowLogo,
-      getFullContent,
-      getColorWeak,
-      getGrayMode,
-      getLockTime,
-      getShowDarkModeToggle,
-      getThemeColor,
-    } = useRootSetting();
+    const { getContentMode, getShowFooter, getShowBreadCrumb, getShowBreadCrumbIcon, getShowLogo, getFullContent, getColorWeak, getGrayMode, getLockTime, getShowDarkModeToggle, getThemeColor } =
+      useRootSetting();
 
-    const { getOpenPageLoading, getBasicTransition, getEnableTransition, getOpenNProgress } =
-      useTransitionSetting();
+    const { getOpenPageLoading, getBasicTransition, getEnableTransition, getOpenNProgress } = useTransitionSetting();
 
     const {
       getIsHorizontal,
@@ -83,14 +51,9 @@ export default defineComponent({
       getMixSideFixed,
     } = useMenuSetting();
 
-    const {
-      getShowHeader,
-      getFixed: getHeaderFixed,
-      getHeaderBgColor,
-      getShowSearch,
-    } = useHeaderSetting();
+    const { getShowHeader, getFixed: getHeaderFixed, getHeaderBgColor, getShowSearch } = useHeaderSetting();
 
-    const { getShowMultipleTab, getShowQuick, getShowRedo, getShowFold, getTabsTheme } = useMultipleTabSetting()
+    const { getShowMultipleTab, getShowQuick, getShowRedo, getShowFold, getTabsTheme } = useMultipleTabSetting();
 
     const getShowMenuRef = computed(() => {
       return unref(getShowMenu) && !unref(getIsHorizontal);
@@ -115,33 +78,15 @@ export default defineComponent({
     }
 
     function renderHeaderTheme() {
-      return (
-        <ThemeColorPicker
-          colorList={HEADER_PRESET_BG_COLOR_LIST}
-          def={unref(getHeaderBgColor)}
-          event={HandlerEnum.HEADER_THEME}
-        />
-      );
+      return <ThemeColorPicker colorList={HEADER_PRESET_BG_COLOR_LIST} def={unref(getHeaderBgColor)} event={HandlerEnum.HEADER_THEME} />;
     }
 
     function renderSiderTheme() {
-      return (
-        <ThemeColorPicker
-          colorList={SIDE_BAR_BG_COLOR_LIST}
-          def={unref(getMenuBgColor)}
-          event={HandlerEnum.MENU_THEME}
-        />
-      );
+      return <ThemeColorPicker colorList={SIDE_BAR_BG_COLOR_LIST} def={unref(getMenuBgColor)} event={HandlerEnum.MENU_THEME} />;
     }
 
     function renderMainTheme() {
-      return (
-        <ThemeColorPicker
-          colorList={APP_PRESET_COLOR_LIST}
-          def={unref(getThemeColor)}
-          event={HandlerEnum.CHANGE_THEME_COLOR}
-        />
-      );
+      return <ThemeColorPicker colorList={APP_PRESET_COLOR_LIST} def={unref(getThemeColor)} event={HandlerEnum.CHANGE_THEME_COLOR} />;
     }
 
     /**
@@ -158,12 +103,7 @@ export default defineComponent({
 
       return (
         <>
-          <SwitchItem
-            title={t('layout.setting.splitMenu')}
-            event={HandlerEnum.MENU_SPLIT}
-            def={unref(getSplit)}
-            disabled={!unref(getShowMenuRef) || unref(getMenuType) !== MenuTypeEnum.MIX}
-          />
+          <SwitchItem title={t('layout.setting.splitMenu')} event={HandlerEnum.MENU_SPLIT} def={unref(getSplit)} disabled={!unref(getShowMenuRef) || unref(getMenuType) !== MenuTypeEnum.MIX} />
           {/*<SwitchItem*/}
           {/*  title={t('layout.setting.mixSidebarFixed')}*/}
           {/*  event={HandlerEnum.MENU_FIXED_MIX_SIDEBAR}*/}
@@ -184,7 +124,6 @@ export default defineComponent({
           {/*  disabled={!unref(getShowMenuRef)}*/}
           {/*/>*/}
 
-
           {/*<SwitchItem*/}
           {/*  title={t('layout.setting.menuSearch')}*/}
           {/*  event={HandlerEnum.HEADER_SEARCH}*/}
@@ -217,23 +156,13 @@ export default defineComponent({
           {/*  options={mixSidebarTriggerOptions}*/}
           {/*  disabled={!unref(getIsMixSidebar)}*/}
           {/*/>*/}
-          <SelectItem
-            title={t('layout.setting.tabsTheme')}
-            event={HandlerEnum.TABS_THEME}
-            def={unref(getTabsTheme)}
-            options={tabsThemeOptions}
-          />
+          <SelectItem title={t('layout.setting.tabsTheme')} event={HandlerEnum.TABS_THEME} def={unref(getTabsTheme)} options={tabsThemeOptions} />
           <SelectItem
             title={t('layout.setting.topMenuLayout')}
             event={HandlerEnum.MENU_TOP_ALIGN}
             def={unref(getTopMenuAlign)}
             options={topMenuAlignOptions}
-            disabled={
-              !unref(getShowHeader) ||
-              unref(getSplit) ||
-              (!unref(getIsTopMenu) && !unref(getSplit)) ||
-              unref(getIsMixSidebar)
-            }
+            disabled={!unref(getShowHeader) || unref(getSplit) || (!unref(getIsTopMenu) && !unref(getSplit)) || unref(getIsMixSidebar)}
           />
           <SelectItem
             title={t('layout.setting.menuCollapseButton')}
@@ -242,21 +171,14 @@ export default defineComponent({
             options={triggerOptions}
             disabled={!unref(getShowMenuRef) || unref(getIsMixSidebar)}
           />
-          <SelectItem
-            title={t('layout.setting.contentMode')}
-            event={HandlerEnum.CONTENT_MODE}
-            def={unref(getContentMode)}
-            options={contentModeOptions}
-          />
+          <SelectItem title={t('layout.setting.contentMode')} event={HandlerEnum.CONTENT_MODE} def={unref(getContentMode)} options={contentModeOptions} />
           <InputNumberItem
             title={t('layout.setting.autoScreenLock')}
             min={0}
             event={HandlerEnum.LOCK_TIME}
             defaultValue={unref(getLockTime)}
             formatter={(value: string) => {
-              return parseInt(value) === 0
-                ? `0(${t('layout.setting.notAutoScreenLock')})`
-                : `${value}${t('layout.setting.minute')}`;
+              return parseInt(value) === 0 ? `0(${t('layout.setting.notAutoScreenLock')})` : `${value}${t('layout.setting.minute')}`;
             }}
           />
           <InputNumberItem
@@ -276,29 +198,15 @@ export default defineComponent({
     function renderContent() {
       return (
         <>
-          <SwitchItem
-            title={t('layout.setting.menuDrag')}
-            event={HandlerEnum.MENU_HAS_DRAG}
-            def={unref(getCanDrag)}
-            disabled={!unref(getShowMenuRef)}
-          />
+          <SwitchItem title={t('layout.setting.menuDrag')} event={HandlerEnum.MENU_HAS_DRAG} def={unref(getCanDrag)} disabled={!unref(getShowMenuRef)} />
           <SwitchItem
             title={t('layout.setting.collapseMenuDisplayName')}
             event={HandlerEnum.MENU_COLLAPSED_SHOW_TITLE}
             def={unref(getCollapsedShowTitle)}
             disabled={!unref(getShowMenuRef) || !unref(getCollapsed) || unref(getIsMixSidebar)}
           />
-          <SwitchItem
-            title={t('layout.setting.tabs')}
-            event={HandlerEnum.TABS_SHOW}
-            def={unref(getShowMultipleTab)}
-          />
-          <SwitchItem
-            title={t('layout.setting.breadcrumb')}
-            event={HandlerEnum.SHOW_BREADCRUMB}
-            def={unref(getShowBreadCrumb)}
-            disabled={!unref(getShowHeader)}
-          />
+          <SwitchItem title={t('layout.setting.tabs')} event={HandlerEnum.TABS_SHOW} def={unref(getShowMultipleTab)} />
+          <SwitchItem title={t('layout.setting.breadcrumb')} event={HandlerEnum.SHOW_BREADCRUMB} def={unref(getShowBreadCrumb)} disabled={!unref(getShowHeader)} />
 
           {/*<SwitchItem*/}
           {/*  title={t('layout.setting.breadcrumbIcon')}*/}
@@ -345,28 +253,16 @@ export default defineComponent({
           {/*  def={unref(getShowLogo)}*/}
           {/*  disabled={unref(getIsMixSidebar)}*/}
           {/*/>*/}
-          <SwitchItem
-            title={t('layout.setting.footer')}
-            event={HandlerEnum.SHOW_FOOTER}
-            def={unref(getShowFooter)}
-          />
+          <SwitchItem title={t('layout.setting.footer')} event={HandlerEnum.SHOW_FOOTER} def={unref(getShowFooter)} />
           {/*<SwitchItem*/}
           {/*  title={t('layout.setting.fullContent')}*/}
           {/*  event={HandlerEnum.FULL_CONTENT}*/}
           {/*  def={unref(getFullContent)}*/}
           {/*/>*/}
 
-          <SwitchItem
-            title={t('layout.setting.grayMode')}
-            event={HandlerEnum.GRAY_MODE}
-            def={unref(getGrayMode)}
-          />
+          <SwitchItem title={t('layout.setting.grayMode')} event={HandlerEnum.GRAY_MODE} def={unref(getGrayMode)} />
 
-          <SwitchItem
-            title={t('layout.setting.colorWeak')}
-            event={HandlerEnum.COLOR_WEAK}
-            def={unref(getColorWeak)}
-          />
+          <SwitchItem title={t('layout.setting.colorWeak')} event={HandlerEnum.COLOR_WEAK} def={unref(getColorWeak)} />
         </>
       );
     }
@@ -374,22 +270,10 @@ export default defineComponent({
     function renderTransition() {
       return (
         <>
-          <SwitchItem
-            title={t('layout.setting.progress')}
-            event={HandlerEnum.OPEN_PROGRESS}
-            def={unref(getOpenNProgress)}
-          />
-          <SwitchItem
-            title={t('layout.setting.switchLoading')}
-            event={HandlerEnum.OPEN_PAGE_LOADING}
-            def={unref(getOpenPageLoading)}
-          />
+          <SwitchItem title={t('layout.setting.progress')} event={HandlerEnum.OPEN_PROGRESS} def={unref(getOpenNProgress)} />
+          <SwitchItem title={t('layout.setting.switchLoading')} event={HandlerEnum.OPEN_PAGE_LOADING} def={unref(getOpenPageLoading)} />
 
-          <SwitchItem
-            title={t('layout.setting.switchAnimation')}
-            event={HandlerEnum.OPEN_ROUTE_TRANSITION}
-            def={unref(getEnableTransition)}
-          />
+          <SwitchItem title={t('layout.setting.switchAnimation')} event={HandlerEnum.OPEN_ROUTE_TRANSITION} def={unref(getEnableTransition)} />
 
           <SelectItem
             title={t('layout.setting.animationType')}
@@ -403,12 +287,7 @@ export default defineComponent({
     }
 
     return () => (
-      <BasicDrawer
-        {...attrs}
-        title={t('layout.setting.drawerTitle')}
-        width={330}
-        wrapClassName="setting-drawer"
-      >
+      <BasicDrawer {...attrs} title={t('layout.setting.drawerTitle')} width={330} wrapClassName="setting-drawer">
         {unref(getShowDarkModeToggle) && <Divider>{() => t('layout.setting.darkMode')}</Divider>}
         {unref(getShowDarkModeToggle) && <AppDarkModeToggle class="mx-auto" />}
         <Divider>{() => t('layout.setting.navMode')}</Divider>
diff --git a/src/layouts/default/setting/components/InputNumberItem.vue b/src/layouts/default/setting/components/InputNumberItem.vue
index 8d679db..7a664ae 100644
--- a/src/layouts/default/setting/components/InputNumberItem.vue
+++ b/src/layouts/default/setting/components/InputNumberItem.vue
@@ -1,12 +1,7 @@
 <template>
   <div :class="prefixCls">
     <span> {{ title }}</span>
-    <InputNumber
-            v-bind="$attrs"
-            size="small"
-            :class="`${prefixCls}-input-number`"
-            @change="handleChange"
-    />
+    <InputNumber v-bind="$attrs" size="small" :class="`${prefixCls}-input-number`" @change="handleChange" />
   </div>
 </template>
 <script lang="ts">
diff --git a/src/layouts/default/setting/components/SelectItem.vue b/src/layouts/default/setting/components/SelectItem.vue
index 676ca91..1656de2 100644
--- a/src/layouts/default/setting/components/SelectItem.vue
+++ b/src/layouts/default/setting/components/SelectItem.vue
@@ -1,14 +1,7 @@
 <template>
   <div :class="prefixCls">
     <span> {{ title }}</span>
-    <Select
-      v-bind="getBindValue"
-      :class="`${prefixCls}-select`"
-      @change="handleChange"
-      :disabled="disabled"
-      size="small"
-      :options="options"
-    />
+    <Select v-bind="getBindValue" :class="`${prefixCls}-select`" @change="handleChange" :disabled="disabled" size="small" :options="options" />
   </div>
 </template>
 <script lang="ts">
diff --git a/src/layouts/default/setting/components/SettingFooter.vue b/src/layouts/default/setting/components/SettingFooter.vue
index abe4a51..c9baefb 100644
--- a/src/layouts/default/setting/components/SettingFooter.vue
+++ b/src/layouts/default/setting/components/SettingFooter.vue
@@ -1,9 +1,9 @@
 <template>
   <div :class="prefixCls">
-<!--    <a-button type="primary" block @click="handleCopy">-->
-<!--      <CopyOutlined class="mr-2" />-->
-<!--      {{ t('layout.setting.copyBtn') }}-->
-<!--    </a-button>-->
+    <!--    <a-button type="primary" block @click="handleCopy">-->
+    <!--      <CopyOutlined class="mr-2" />-->
+    <!--      {{ t('layout.setting.copyBtn') }}-->
+    <!--    </a-button>-->
 
     <a-button color="warning" block @click="handleResetSetting" class="my-3">
       <RedoOutlined class="mr-2" />
@@ -48,9 +48,7 @@
       const appStore = useAppStore();
 
       function handleCopy() {
-        const { isSuccessRef } = useCopyToClipboard(
-          JSON.stringify(unref(appStore.getProjectConfig), null, 2)
-        );
+        const { isSuccessRef } = useCopyToClipboard(JSON.stringify(unref(appStore.getProjectConfig), null, 2));
         unref(isSuccessRef) &&
           createSuccessModal({
             title: t('layout.setting.operatingTitle'),
diff --git a/src/layouts/default/setting/components/SwitchItem.vue b/src/layouts/default/setting/components/SwitchItem.vue
index ff27477..506dda7 100644
--- a/src/layouts/default/setting/components/SwitchItem.vue
+++ b/src/layouts/default/setting/components/SwitchItem.vue
@@ -1,13 +1,7 @@
 <template>
   <div :class="prefixCls">
     <span> {{ title }}</span>
-    <Switch
-      v-bind="getBindValue"
-      @change="handleChange"
-      :disabled="disabled"
-      :checkedChildren="t('layout.setting.on')"
-      :unCheckedChildren="t('layout.setting.off')"
-    />
+    <Switch v-bind="getBindValue" @change="handleChange" :disabled="disabled" :checkedChildren="t('layout.setting.on')" :unCheckedChildren="t('layout.setting.off')" />
   </div>
 </template>
 <script lang="ts">
diff --git a/src/layouts/default/setting/enum.ts b/src/layouts/default/setting/enum.ts
index 53a7c96..7fb3594 100644
--- a/src/layouts/default/setting/enum.ts
+++ b/src/layouts/default/setting/enum.ts
@@ -1,11 +1,5 @@
 import { TabsThemeEnum, ContentEnum, RouterTransitionEnum } from '/@/enums/appEnum';
-import {
-  MenuModeEnum,
-  MenuTypeEnum,
-  TopMenuAlignEnum,
-  TriggerEnum,
-  MixSidebarTriggerEnum,
-} from '/@/enums/menuEnum';
+import { MenuModeEnum, MenuTypeEnum, TopMenuAlignEnum, TriggerEnum, MixSidebarTriggerEnum } from '/@/enums/menuEnum';
 
 import { useI18n } from '/@/hooks/web/useI18n';
 
@@ -74,7 +68,7 @@ export const tabsThemeOptions = [
     value: TabsThemeEnum.SIMPLE,
     label: t('layout.setting.tabsThemeSimple'),
   },
-]
+];
 
 export const contentModeOptions = [
   {
diff --git a/src/layouts/default/sider/LayoutSider.vue b/src/layouts/default/sider/LayoutSider.vue
index 2144505..c165d84 100644
--- a/src/layouts/default/sider/LayoutSider.vue
+++ b/src/layouts/default/sider/LayoutSider.vue
@@ -1,9 +1,5 @@
 <template>
-  <div
-    v-if="getMenuFixed && !getIsMobile"
-    :style="getHiddenDomStyle"
-    v-show="showClassSideBarRef"
-  ></div>
+  <div v-if="getMenuFixed && !getIsMobile" :style="getHiddenDomStyle" v-show="showClassSideBarRef"></div>
   <Sider
     v-show="showClassSideBarRef"
     ref="sideRef"
@@ -47,17 +43,7 @@
       const dragBarRef = ref<ElRef>(null);
       const sideRef = ref<ElRef>(null);
 
-      const {
-        getCollapsed,
-        getMenuWidth,
-        getSplit,
-        getMenuTheme,
-        getRealWidth,
-        getMenuHidden,
-        getMenuFixed,
-        getIsMixMode,
-        toggleCollapsed,
-      } = useMenuSetting();
+      const { getCollapsed, getMenuWidth, getSplit, getMenuTheme, getRealWidth, getMenuHidden, getMenuFixed, getIsMixMode, toggleCollapsed } = useMenuSetting();
 
       const { prefixCls } = useDesign('layout-sideBar');
 
diff --git a/src/layouts/default/sider/MixSider.vue b/src/layouts/default/sider/MixSider.vue
index 5fd37c4..d4eeb6a 100644
--- a/src/layouts/default/sider/MixSider.vue
+++ b/src/layouts/default/sider/MixSider.vue
@@ -31,11 +31,7 @@
           :key="item.path"
         >
           <SimpleMenuTag :item="item" collapseParent dot />
-          <Icon
-            :class="`${prefixCls}-module__icon`"
-            :size="getCollapsed ? 16 : 20"
-            :icon="item.icon || (item.meta && item.meta.icon)"
-          />
+          <Icon :class="`${prefixCls}-module__icon`" :size="getCollapsed ? 16 : 20" :icon="item.icon || (item.meta && item.meta.icon)" />
           <p :class="`${prefixCls}-module__name`">
             {{ t(item.name) }}
           </p>
@@ -54,26 +50,12 @@
         ]"
       >
         <span class="text"> {{ title }}</span>
-        <Icon
-          :size="16"
-          :icon="getMixSideFixed ? 'ri:pushpin-2-fill' : 'ri:pushpin-2-line'"
-          class="pushpin"
-          @click="handleFixedMenu"
-        />
+        <Icon :size="16" :icon="getMixSideFixed ? 'ri:pushpin-2-fill' : 'ri:pushpin-2-line'" class="pushpin" @click="handleFixedMenu" />
       </div>
       <ScrollContainer :class="`${prefixCls}-menu-list__content`">
-        <SimpleMenu
-          :items="childrenMenus"
-          :theme="getMenuTheme"
-          mixSider
-          @menuClick="handleMenuClick"
-        />
+        <SimpleMenu :items="childrenMenus" :theme="getMenuTheme" mixSider @menuClick="handleMenuClick" />
       </ScrollContainer>
-      <div
-        v-show="getShowDragBar && openMenu"
-        :class="`${prefixCls}-drag-bar`"
-        ref="dragBarRef"
-      ></div>
+      <div v-show="getShowDragBar && openMenu" :class="`${prefixCls}-drag-bar`" ref="dragBarRef"></div>
     </div>
   </div>
 </template>
diff --git a/src/layouts/default/sider/index.vue b/src/layouts/default/sider/index.vue
index d5357f4..31ef913 100644
--- a/src/layouts/default/sider/index.vue
+++ b/src/layouts/default/sider/index.vue
@@ -1,13 +1,5 @@
 <template>
-  <Drawer
-    v-if="getIsMobile"
-    placement="left"
-    :class="prefixCls"
-    :width="getMenuWidth"
-    :getContainer="null"
-    :visible="!getCollapsed"
-    @close="handleClose"
-  >
+  <Drawer v-if="getIsMobile" placement="left" :class="prefixCls" :width="getMenuWidth" :getContainer="null" :visible="!getCollapsed" @close="handleClose">
     <Sider />
   </Drawer>
   <MixSider v-else-if="getIsMixSidebar" />
diff --git a/src/layouts/default/sider/useLayoutSider.ts b/src/layouts/default/sider/useLayoutSider.ts
index 292c146..48f2814 100644
--- a/src/layouts/default/sider/useLayoutSider.ts
+++ b/src/layouts/default/sider/useLayoutSider.ts
@@ -35,11 +35,7 @@ export function useTrigger(getIsMobile: Ref<boolean>) {
   const getShowTrigger = computed(() => {
     const trigger = unref(getTrigger);
 
-    return (
-      trigger !== TriggerEnum.NONE &&
-      !unref(getIsMobile) &&
-      (trigger === TriggerEnum.FOOTER || unref(getSplit))
-    );
+    return trigger !== TriggerEnum.NONE && !unref(getIsMobile) && (trigger === TriggerEnum.FOOTER || unref(getSplit));
   });
 
   const getTriggerAttr = computed(() => {
@@ -104,9 +100,7 @@ export function useDragLine(siderRef: Ref<any>, dragBarRef: Ref<any>, mix = fals
       if (!mix) {
         const miniWidth = unref(getMiniWidthNumber);
         if (!unref(getCollapsed)) {
-          width > miniWidth + 20
-            ? setMenuSetting({ menuWidth: width })
-            : setMenuSetting({ collapsed: true });
+          width > miniWidth + 20 ? setMenuSetting({ menuWidth: width }) : setMenuSetting({ collapsed: true });
         } else {
           width > miniWidth && setMenuSetting({ collapsed: false, menuWidth: width });
         }
diff --git a/src/layouts/default/tabs/components/FoldButton.vue b/src/layouts/default/tabs/components/FoldButton.vue
index 30a8b59..6ed5b36 100644
--- a/src/layouts/default/tabs/components/FoldButton.vue
+++ b/src/layouts/default/tabs/components/FoldButton.vue
@@ -22,9 +22,7 @@
 
       const getIsUnFold = computed(() => !unref(getShowMenu) && !unref(getShowHeader));
 
-      const getIcon = computed(() =>
-        unref(getIsUnFold) ? 'codicon:screen-normal' : 'codicon:screen-full'
-      );
+      const getIcon = computed(() => (unref(getIsUnFold) ? 'codicon:screen-normal' : 'codicon:screen-full'));
 
       function handleFold() {
         const isUnFold = unref(getIsUnFold);
diff --git a/src/layouts/default/tabs/components/TabContent.vue b/src/layouts/default/tabs/components/TabContent.vue
index 954169f..2bae6a4 100644
--- a/src/layouts/default/tabs/components/TabContent.vue
+++ b/src/layouts/default/tabs/components/TabContent.vue
@@ -22,7 +22,7 @@
 
   import { TabContentProps } from '../types';
 
-  import { TabsThemeEnum } from '/@/enums/appEnum'
+  import { TabsThemeEnum } from '/@/enums/appEnum';
   import { useDesign } from '/@/hooks/web/useDesign';
   import { useI18n } from '/@/hooks/web/useI18n';
   import { useTabDropdown } from '../useTabDropdown';
@@ -49,34 +49,29 @@
 
       const getIsTabs = computed(() => !props.isExtra);
 
-     // updateBy:sunjianlei---updateDate:2021-09-03---修改tab切换栏样式：前缀图标类型
+      // updateBy:sunjianlei---updateDate:2021-09-03---修改tab切换栏样式：前缀图标类型
       const prefixIconType = computed(() => {
         if (props.tabItem.meta.icon) {
-          return props.tabItem.meta.icon
+          return props.tabItem.meta.icon;
         } else if (props.tabItem.path === '/dashboard/analysis') {
           // 当是首页时返回 home 图标 TODO 此处可能需要动态判断首页路径
-          return 'ant-design:home-outlined'
+          return 'ant-design:home-outlined';
         } else {
-          return 'ant-design:code'
+          return 'ant-design:code';
         }
       });
 
-      const getTrigger = computed((): ('contextmenu' | 'click' | 'hover')[] =>
-        unref(getIsTabs) ? ['contextmenu'] : ['click']
-      );
+      const getTrigger = computed((): ('contextmenu' | 'click' | 'hover')[] => (unref(getIsTabs) ? ['contextmenu'] : ['click']));
 
-      const { getDropMenuList, handleMenuEvent, handleContextMenu } = useTabDropdown(
-        props as TabContentProps,
-        getIsTabs
-      );
+      const { getDropMenuList, handleMenuEvent, handleContextMenu } = useTabDropdown(props as TabContentProps, getIsTabs);
 
       function handleContext(e) {
         props.tabItem && handleContextMenu(props.tabItem)(e);
       }
 
-      const { getTabsTheme } = useMultipleTabSetting()
+      const { getTabsTheme } = useMultipleTabSetting();
       // 是否显示图标
-      const showPrefixIcon = computed(() => unref(getTabsTheme) === TabsThemeEnum.SMOOTH)
+      const showPrefixIcon = computed(() => unref(getTabsTheme) === TabsThemeEnum.SMOOTH);
 
       return {
         prefixCls,
diff --git a/src/layouts/default/tabs/index.less b/src/layouts/default/tabs/index.less
index 4ceafd5..04e581c 100644
--- a/src/layouts/default/tabs/index.less
+++ b/src/layouts/default/tabs/index.less
@@ -25,7 +25,7 @@ html[data-theme='light'] {
   box-shadow: 0 4px 4px rgb(0 21 41 / 8%);
 
   .ant-tabs-small {
-    height:calc(@multiple-height + 4px);
+    height: calc(@multiple-height + 4px);
   }
 
   .ant-tabs.ant-tabs-card {
diff --git a/src/layouts/default/tabs/index.vue b/src/layouts/default/tabs/index.vue
index a01f296..b362781 100644
--- a/src/layouts/default/tabs/index.vue
+++ b/src/layouts/default/tabs/index.vue
@@ -1,15 +1,6 @@
 <template>
   <div :class="getWrapClass">
-    <Tabs
-            type="editable-card"
-            size="small"
-            :animated="false"
-            :hideAdd="true"
-            :tabBarGutter="3"
-            :activeKey="activeKeyRef"
-            @change="handleChange"
-            @edit="handleEdit"
-    >
+    <Tabs type="editable-card" size="small" :animated="false" :hideAdd="true" :tabBarGutter="3" :activeKey="activeKeyRef" @change="handleChange" @edit="handleEdit">
       <template v-for="item in getTabsState" :key="item.query ? item.fullPath : item.path">
         <TabPane :closable="!(item && item.meta && item.meta.affix)">
           <template #tab>
@@ -103,9 +94,7 @@
         }
 
         if (isHide) {
-          const findParentRoute = router
-                  .getRoutes()
-                  .find((item) => item.path === currentActiveMenu);
+          const findParentRoute = router.getRoutes().find((item) => item.path === currentActiveMenu);
 
           findParentRoute && tabStore.addTab(findParentRoute as unknown as RouteLocationNormalized);
         } else {
diff --git a/src/layouts/default/tabs/tabs.theme.card.less b/src/layouts/default/tabs/tabs.theme.card.less
index 90c8392..71d79ba 100644
--- a/src/layouts/default/tabs/tabs.theme.card.less
+++ b/src/layouts/default/tabs/tabs.theme.card.less
@@ -86,7 +86,6 @@ html[data-theme='light'] {
           border-radius: 100%;
 
           &:hover {
-
             svg {
               fill: #fff;
             }
@@ -104,7 +103,6 @@ html[data-theme='light'] {
         }
 
         &:first-child {
-
         }
       }
 
@@ -216,11 +214,9 @@ html[data-theme='light'] {
 
     // tab 前缀图标样式
     &__prefix-icon {
-
       & .app-iconify.anticon {
         margin-right: 4px;
       }
     }
-
   }
 }
diff --git a/src/layouts/default/tabs/tabs.theme.smooth.less b/src/layouts/default/tabs/tabs.theme.smooth.less
index 886bf6f..da34774 100644
--- a/src/layouts/default/tabs/tabs.theme.smooth.less
+++ b/src/layouts/default/tabs/tabs.theme.smooth.less
@@ -87,7 +87,6 @@ html[data-theme='light'] {
           border-radius: 100%;
 
           &:hover {
-
             svg {
               fill: #fff;
             }
@@ -219,11 +218,9 @@ html[data-theme='light'] {
 
     // tab 前缀图标样式
     &__prefix-icon {
-
       & .app-iconify.anticon {
         margin-right: 4px;
       }
     }
-
   }
 }
diff --git a/src/layouts/default/tabs/useTabDropdown.ts b/src/layouts/default/tabs/useTabDropdown.ts
index 2feb36c..0695084 100644
--- a/src/layouts/default/tabs/useTabDropdown.ts
+++ b/src/layouts/default/tabs/useTabDropdown.ts
@@ -46,8 +46,7 @@ export function useTabDropdown(tabContentProps: TabContentProps, getIsTabs: Comp
     const disabled = tabStore.getTabList.length === 1;
 
     // Close right
-    const closeRightDisabled =
-      !isCurItem || (index === tabStore.getTabList.length - 1 && tabStore.getLastDragEndIndex >= 0);
+    const closeRightDisabled = !isCurItem || (index === tabStore.getTabList.length - 1 && tabStore.getLastDragEndIndex >= 0);
     const dropMenuList: DropMenu[] = [
       {
         icon: 'ion:reload-sharp',
diff --git a/src/layouts/default/trigger/HeaderTrigger.vue b/src/layouts/default/trigger/HeaderTrigger.vue
index d7dbb23..33077ba 100644
--- a/src/layouts/default/trigger/HeaderTrigger.vue
+++ b/src/layouts/default/trigger/HeaderTrigger.vue
@@ -1,7 +1,5 @@
 <template>
-  <span :class="[prefixCls, theme]" @click="toggleCollapsed">
-    <MenuUnfoldOutlined v-if="getCollapsed" /> <MenuFoldOutlined v-else />
-  </span>
+  <span :class="[prefixCls, theme]" @click="toggleCollapsed"> <MenuUnfoldOutlined v-if="getCollapsed" /> <MenuFoldOutlined v-else /> </span>
 </template>
 <script lang="ts">
   import { defineComponent } from 'vue';
diff --git a/src/layouts/iframe/index.vue b/src/layouts/iframe/index.vue
index d9ee7e5..09900cc 100644
--- a/src/layouts/iframe/index.vue
+++ b/src/layouts/iframe/index.vue
@@ -1,11 +1,7 @@
 <template>
   <div v-if="showFrame">
     <template v-for="frame in getFramePages" :key="frame.path">
-      <FramePage
-        v-if="frame.meta.frameSrc && hasRenderFrame(frame.name)"
-        v-show="showIframe(frame)"
-        :frameSrc="frame.meta.frameSrc"
-      />
+      <FramePage v-if="frame.meta.frameSrc && hasRenderFrame(frame.name)" v-show="showIframe(frame)" :frameSrc="frame.meta.frameSrc" />
     </template>
   </div>
 </template>
diff --git a/src/layouts/page/index.vue b/src/layouts/page/index.vue
index c3c320a..dc1d4fc 100644
--- a/src/layouts/page/index.vue
+++ b/src/layouts/page/index.vue
@@ -1,24 +1,24 @@
 <template>
   <RouterView>
     <template #default="{ Component, route }">
-<!--      <transition-->
-<!--        :name="-->
-<!--          getTransitionName({-->
-<!--            route,-->
-<!--            openCache,-->
-<!--            enableTransition: getEnableTransition,-->
-<!--            cacheTabs: getCaches,-->
-<!--            def: getBasicTransition,-->
-<!--          })-->
-<!--        "-->
-<!--        mode="out-in"-->
-<!--        appear-->
-<!--      >-->
-        <keep-alive v-if="openCache" :include="getCaches">
-          <component :is="Component" :key="route.fullPath" />
-        </keep-alive>
-        <component v-else :is="Component" :key="route.fullPath" />
-<!--      </transition>-->
+      <!--      <transition-->
+      <!--        :name="-->
+      <!--          getTransitionName({-->
+      <!--            route,-->
+      <!--            openCache,-->
+      <!--            enableTransition: getEnableTransition,-->
+      <!--            cacheTabs: getCaches,-->
+      <!--            def: getBasicTransition,-->
+      <!--          })-->
+      <!--        "-->
+      <!--        mode="out-in"-->
+      <!--        appear-->
+      <!--      >-->
+      <keep-alive v-if="openCache" :include="getCaches">
+        <component :is="Component" :key="route.fullPath" />
+      </keep-alive>
+      <component v-else :is="Component" :key="route.fullPath" />
+      <!--      </transition>-->
     </template>
   </RouterView>
   <FrameLayout v-if="getCanEmbedIFramePage" />
diff --git a/src/locales/lang/en.ts b/src/locales/lang/en.ts
index 29ca1aa..9dc3b13 100644
--- a/src/locales/lang/en.ts
+++ b/src/locales/lang/en.ts
@@ -8,6 +8,6 @@ export default {
     ...genMessage(modules, 'en'),
     antdLocale,
   },
-  momentLocale:null,
+  momentLocale: null,
   momentLocaleName: 'en',
 };
diff --git a/src/locales/lang/en/layout.ts b/src/locales/lang/en/layout.ts
index 1a78b29..78b2cec 100644
--- a/src/locales/lang/en/layout.ts
+++ b/src/locales/lang/en/layout.ts
@@ -52,8 +52,7 @@ export default {
     minute: 'Minute',
 
     operatingTitle: 'Successful!',
-    operatingContent:
-      'The copy is successful, please go to src/settings/projectSetting.ts to modify the configuration!',
+    operatingContent: 'The copy is successful, please go to src/settings/projectSetting.ts to modify the configuration!',
     resetSuccess: 'Successfully reset!',
 
     copyBtn: 'Copy',
diff --git a/src/locales/lang/en/sys.ts b/src/locales/lang/en/sys.ts
index 3b29600..7e18b12 100644
--- a/src/locales/lang/en/sys.ts
+++ b/src/locales/lang/en/sys.ts
@@ -7,8 +7,7 @@ export default {
     apiTimeoutMessage: 'The interface request timed out, please refresh the page and try again!',
     apiRequestFailed: 'The interface request failed, please try again later!',
     networkException: 'network anomaly',
-    networkExceptionMsg:
-      'Please check if your network connection is normal! The network is abnormal',
+    networkExceptionMsg: 'Please check if your network connection is normal! The network is abnormal',
 
     errMsg401: 'The user does not have permission (token, user name, password error)!',
     errMsg403: 'The user is authorized, but access is forbidden!',
@@ -53,8 +52,7 @@ export default {
     subTitle500: 'Sorry, the server is reporting an error.',
     noDataTitle: 'No data on the current page.',
     networkErrorTitle: 'Network Error',
-    networkErrorSubTitle:
-      'Sorry，Your network connection has been disconnected, please check your network!',
+    networkErrorSubTitle: 'Sorry，Your network connection has been disconnected, please check your network!',
   },
   lock: {
     unlock: 'Click to unlock',
diff --git a/src/locales/lang/zh-CN/routes/demo.ts b/src/locales/lang/zh-CN/routes/demo.ts
index 7a9b6ab..b7c2822 100644
--- a/src/locales/lang/zh-CN/routes/demo.ts
+++ b/src/locales/lang/zh-CN/routes/demo.ts
@@ -46,11 +46,11 @@ export default {
     time: '相对时间',
     cropperImage: '图片裁剪',
     cardList: '卡片列表',
-    oneToMore:'一对多示例',
-    vexTable:'一对多示例'
+    oneToMore: '一对多示例',
+    vexTable: '一对多示例',
   },
-  basic:{
-    button:'按钮组件'
+  basic: {
+    button: '按钮组件',
   },
   editor: {
     editor: '编辑器',
@@ -115,7 +115,7 @@ export default {
     customerForm: '自定义组件',
     appendForm: '表单增删示例',
   },
-  modal:{
+  modal: {
     basic: '弹窗扩展',
     drawer: '抽屉扩展',
   },
@@ -201,7 +201,7 @@ export default {
     editRowTable: '可编辑行',
     authColumn: '权限列',
   },
-  jeecg:{
-    JAreaLinkage:'区域选择'
-  }
+  jeecg: {
+    JAreaLinkage: '区域选择',
+  },
 };
diff --git a/src/locales/lang/zh-CN/sys.ts b/src/locales/lang/zh-CN/sys.ts
index 6cd1e5d..779028a 100644
--- a/src/locales/lang/zh-CN/sys.ts
+++ b/src/locales/lang/zh-CN/sys.ts
@@ -21,7 +21,7 @@ export default {
     errMsg504: '网络超时!',
     errMsg505: 'http版本不支持该请求!',
 
-    registerMsg:'注册成功',
+    registerMsg: '注册成功',
   },
   app: { logoutTip: '温馨提醒', logoutMessage: '是否确认退出系统?', menuLoading: '菜单加载中...' },
   errorLog: {
@@ -100,6 +100,6 @@ export default {
     smsCode: '短信验证码',
     mobile: '手机号码',
 
-    subTitleText:'{0}秒后返回登录页面',
+    subTitleText: '{0}秒后返回登录页面',
   },
 };
diff --git a/src/logics/error-handle/index.ts b/src/logics/error-handle/index.ts
index 4925109..d4d0c82 100644
--- a/src/logics/error-handle/index.ts
+++ b/src/logics/error-handle/index.ts
@@ -80,13 +80,7 @@ function vueErrorHandler(err: Error, vm: any, info: string) {
 /**
  * Configure script error handling function
  */
-export function scriptErrorHandler(
-  event: Event | string,
-  source?: string,
-  lineno?: number,
-  colno?: number,
-  error?: Error
-) {
+export function scriptErrorHandler(event: Event | string, source?: string, lineno?: number, colno?: number, error?: Error) {
   if (event === 'Script error.' && !source) {
     return false;
   }
diff --git a/src/logics/mitt/routeChange.ts b/src/logics/mitt/routeChange.ts
index 335ffcc..1f842eb 100644
--- a/src/logics/mitt/routeChange.ts
+++ b/src/logics/mitt/routeChange.ts
@@ -18,10 +18,7 @@ export function setRouteChange(lastChangeRoute: RouteLocationNormalized) {
   lastChangeTab = r;
 }
 
-export function listenerRouteChange(
-  callback: (route: RouteLocationNormalized) => void,
-  immediate = true
-) {
+export function listenerRouteChange(callback: (route: RouteLocationNormalized) => void, immediate = true) {
   emitter.on(key, callback);
   immediate && lastChangeTab && callback(lastChangeTab);
 }
diff --git a/src/logics/theme/dark.ts b/src/logics/theme/dark.ts
index 75b7b47..7069826 100644
--- a/src/logics/theme/dark.ts
+++ b/src/logics/theme/dark.ts
@@ -1,24 +1,24 @@
-import {darkCssIsReady, loadDarkThemeCss} from 'vite-plugin-theme/es/client';
-import {addClass, hasClass, removeClass} from '/@/utils/domUtils';
+import { darkCssIsReady, loadDarkThemeCss } from 'vite-plugin-theme/es/client';
+import { addClass, hasClass, removeClass } from '/@/utils/domUtils';
 
 export async function updateDarkTheme(mode: string | null = 'light') {
-    const htmlRoot = document.getElementById('htmlRoot');
-    if (!htmlRoot) {
-        return;
+  const htmlRoot = document.getElementById('htmlRoot');
+  if (!htmlRoot) {
+    return;
+  }
+  const hasDarkClass = hasClass(htmlRoot, 'dark');
+  if (mode === 'dark') {
+    if (import.meta.env.PROD && !darkCssIsReady) {
+      await loadDarkThemeCss();
     }
-    const hasDarkClass = hasClass(htmlRoot, 'dark');
-    if (mode === 'dark') {
-        if (import.meta.env.PROD && !darkCssIsReady) {
-            await loadDarkThemeCss();
-        }
-        htmlRoot.setAttribute('data-theme', 'dark');
-        if (!hasDarkClass) {
-            addClass(htmlRoot, 'dark');
-        }
-    } else {
-        htmlRoot.setAttribute('data-theme', 'light');
-        if (hasDarkClass) {
-            removeClass(htmlRoot, 'dark');
-        }
+    htmlRoot.setAttribute('data-theme', 'dark');
+    if (!hasDarkClass) {
+      addClass(htmlRoot, 'dark');
     }
+  } else {
+    htmlRoot.setAttribute('data-theme', 'light');
+    if (hasDarkClass) {
+      removeClass(htmlRoot, 'dark');
+    }
+  }
 }
diff --git a/src/logics/theme/index.ts b/src/logics/theme/index.ts
index 611eb76..a3f6743 100644
--- a/src/logics/theme/index.ts
+++ b/src/logics/theme/index.ts
@@ -14,14 +14,14 @@ export async function changeTheme(color: string) {
   let res = await replaceStyleVariables({
     colorVariables: [...getThemeColors(color), ...colors],
   });
-  fixDark()
-  return res
+  fixDark();
+  return res;
 }
 
 // 【LOWCOD-2262】修复黑暗模式下切换皮肤无效的问题
 async function fixDark() {
-  let el = document.getElementById('__VITE_PLUGIN_THEME__')
+  let el = document.getElementById('__VITE_PLUGIN_THEME__');
   if (el) {
-    el.innerHTML = el.innerHTML.replace(/\\["']dark\\["']/g, `'dark'`)
+    el.innerHTML = el.innerHTML.replace(/\\["']dark\\["']/g, `'dark'`);
   }
-}
\ No newline at end of file
+}
diff --git a/src/main.ts b/src/main.ts
index 8ee5f84..5603cbd 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -7,65 +7,65 @@ import 'virtual:windi-devtools';
 // 注册图标
 import 'virtual:svg-icons-register';
 import App from './App.vue';
-import {createApp} from 'vue';
-import {initAppConfigStore} from '/@/logics/initAppConfig';
-import {setupErrorHandle} from '/@/logics/error-handle';
-import {router, setupRouter} from '/@/router';
-import {setupRouterGuard} from '/@/router/guard';
-import {setupStore} from '/@/store';
-import {setupGlobDirectives} from '/@/directives';
-import {setupI18n} from '/@/locales/setupI18n';
-import {registerGlobComp} from '/@/components/registerGlobComp';
-import {registerThirdComp} from '/@/settings/registerThirdComp';
-import {useSso} from '/@/hooks/web/useSso';
-import {registerPackages} from '/@/utils/monorepo/registerPackages';
+import { createApp } from 'vue';
+import { initAppConfigStore } from '/@/logics/initAppConfig';
+import { setupErrorHandle } from '/@/logics/error-handle';
+import { router, setupRouter } from '/@/router';
+import { setupRouterGuard } from '/@/router/guard';
+import { setupStore } from '/@/store';
+import { setupGlobDirectives } from '/@/directives';
+import { setupI18n } from '/@/locales/setupI18n';
+import { registerGlobComp } from '/@/components/registerGlobComp';
+import { registerThirdComp } from '/@/settings/registerThirdComp';
+import { useSso } from '/@/hooks/web/useSso';
+import { registerPackages } from '/@/utils/monorepo/registerPackages';
 
 // 在本地开发中引入的,以提高浏览器响应速度
 if (import.meta.env.DEV) {
-    import('ant-design-vue/dist/antd.less');
+  import('ant-design-vue/dist/antd.less');
 }
 async function bootstrap() {
-    // 创建应用实例
-    const app = createApp(App);
+  // 创建应用实例
+  const app = createApp(App);
 
-    // 多语言配置,异步情况:语言文件可以从服务器端获得
-    await setupI18n(app);
+  // 多语言配置,异步情况:语言文件可以从服务器端获得
+  await setupI18n(app);
 
-    // 配置存储
-    setupStore(app);
+  // 配置存储
+  setupStore(app);
 
-    // 初始化内部系统配置
-    initAppConfigStore();
+  // 初始化内部系统配置
+  initAppConfigStore();
 
-    // 注册外部模块路由
-    registerPackages(app);
-  
-    // 注册全局组件
-    registerGlobComp(app);
+  // 注册外部模块路由
+  registerPackages(app);
 
-    //CAS单点登录
-    await useSso().ssoLogin();
+  // 注册全局组件
+  registerGlobComp(app);
 
-    // 配置路由
-    setupRouter(app);
+  //CAS单点登录
+  await useSso().ssoLogin();
 
-    // 路由保护
-    setupRouterGuard(router);
+  // 配置路由
+  setupRouter(app);
 
-    // 注册全局指令
-    setupGlobDirectives(app);
+  // 路由保护
+  setupRouterGuard(router);
 
-    // 配置全局错误处理
-    setupErrorHandle(app);
+  // 注册全局指令
+  setupGlobDirectives(app);
 
-    // 注册第三方组件
-    await registerThirdComp(app);
+  // 配置全局错误处理
+  setupErrorHandle(app);
 
-    // 当路由准备好时在执行挂载( https://next.router.vuejs.org/api/#isready)
-    await router.isReady();
+  // 注册第三方组件
+  await registerThirdComp(app);
 
-    // 挂载应用
-    app.mount('#app', true);
+  // 当路由准备好时在执行挂载( https://next.router.vuejs.org/api/#isready)
+  await router.isReady();
+
+  // 挂载应用
+  app.mount('#app', true);
 }
 
 bootstrap();
diff --git a/src/qiankun/apps.ts b/src/qiankun/apps.ts
index a467cfc..21a1192 100644
--- a/src/qiankun/apps.ts
+++ b/src/qiankun/apps.ts
@@ -6,17 +6,17 @@
  * @activeRule: 微应用触发的路由规则 - 触发路由规则后将加载该微应用
  */
 //子应用列表
-const _apps:object[] = [];
+const _apps: object[] = [];
 for (const key in import.meta.env) {
-    if (key.includes('VITE_APP_SUB_')) {
-        const name = key.split('VITE_APP_SUB_')[1];
-        const obj = {
-            name,
-            entry: import.meta.env[key],
-            container: '#content',
-            activeRule: name,
-        };
-        _apps.push(obj)
-    }
+  if (key.includes('VITE_APP_SUB_')) {
+    const name = key.split('VITE_APP_SUB_')[1];
+    const obj = {
+      name,
+      entry: import.meta.env[key],
+      container: '#content',
+      activeRule: name,
+    };
+    _apps.push(obj);
+  }
 }
 export const apps = _apps;
diff --git a/src/qiankun/index.ts b/src/qiankun/index.ts
index 975b821..11d4f82 100644
--- a/src/qiankun/index.ts
+++ b/src/qiankun/index.ts
@@ -1,22 +1,22 @@
 /**
  * qiankun配置
  */
-import {registerMicroApps, setDefaultMountApp, start, runAfterFirstMounted, addGlobalUncaughtErrorHandler} from 'qiankun';
-import {apps} from './apps';
-import {getProps, initGlState} from './state';
+import { registerMicroApps, setDefaultMountApp, start, runAfterFirstMounted, addGlobalUncaughtErrorHandler } from 'qiankun';
+import { apps } from './apps';
+import { getProps, initGlState } from './state';
 
 /**
  * 重构apps
  */
 function filterApps() {
-    apps.forEach((item) => {
-        //主应用需要传递给微应用的数据。
-        item.props = getProps();
-        //微应用触发的路由规则
-        // @ts-ignore
-        item.activeRule = genActiveRule('/' + item.activeRule);
-    });
-    return apps;
+  apps.forEach((item) => {
+    //主应用需要传递给微应用的数据。
+    item.props = getProps();
+    //微应用触发的路由规则
+    // @ts-ignore
+    item.activeRule = genActiveRule('/' + item.activeRule);
+  });
+  return apps;
 }
 
 /**
@@ -24,51 +24,50 @@ function filterApps() {
  * @param {*} routerPrefix 前缀
  */
 function genActiveRule(routerPrefix) {
-    return location => location.pathname.startsWith(routerPrefix);
+  return (location) => location.pathname.startsWith(routerPrefix);
 }
 
 /**
  * 微应用注册
  */
 function registerApps() {
-    const _apps = filterApps();
-    registerMicroApps(_apps,
-        {
-            beforeLoad: [
-                // @ts-ignore
-                loadApp => {
-                    console.log('before load', loadApp);
-                }
-            ],
-            beforeMount: [
-                // @ts-ignore
-                mountApp => {
-                    console.log('before mount', mountApp);
-                }
-            ],
-            afterMount: [
-                // @ts-ignore
-                mountApp => {
-                    console.log('before mount', mountApp);
-                }
-            ],
-            afterUnmount: [
-                // @ts-ignore
-                unloadApp => {
-                    console.log('after unload', unloadApp);
-                }
-            ]
-        });
-    // 设置默认子应用,与 genActiveRule中的参数保持一致
-    // setDefaultMountApp();
-    // 第一个微应用 mount 后需要调用的方法，比如开启一些监控或者埋点脚本。
-    runAfterFirstMounted(() => console.log('开启监控'));
-    // 添加全局的未捕获异常处理器。
-    addGlobalUncaughtErrorHandler(event => console.log(event));
-    // 定义全局状态
-    initGlState();
-    //启动qiankun
-    start({});
+  const _apps = filterApps();
+  registerMicroApps(_apps, {
+    beforeLoad: [
+      // @ts-ignore
+      (loadApp) => {
+        console.log('before load', loadApp);
+      },
+    ],
+    beforeMount: [
+      // @ts-ignore
+      (mountApp) => {
+        console.log('before mount', mountApp);
+      },
+    ],
+    afterMount: [
+      // @ts-ignore
+      (mountApp) => {
+        console.log('before mount', mountApp);
+      },
+    ],
+    afterUnmount: [
+      // @ts-ignore
+      (unloadApp) => {
+        console.log('after unload', unloadApp);
+      },
+    ],
+  });
+  // 设置默认子应用,与 genActiveRule中的参数保持一致
+  // setDefaultMountApp();
+  // 第一个微应用 mount 后需要调用的方法，比如开启一些监控或者埋点脚本。
+  runAfterFirstMounted(() => console.log('开启监控'));
+  // 添加全局的未捕获异常处理器。
+  addGlobalUncaughtErrorHandler((event) => console.log(event));
+  // 定义全局状态
+  initGlState();
+  //启动qiankun
+  start({});
 }
 
 export default registerApps;
diff --git a/src/qiankun/state.ts b/src/qiankun/state.ts
index 4c0c35f..102e987 100644
--- a/src/qiankun/state.ts
+++ b/src/qiankun/state.ts
@@ -1,38 +1,38 @@
 /**
  *公共数据
  */
-import {initGlobalState} from 'qiankun';
-import {store} from '/@/store';
-import {router} from '/@/router';
+import { initGlobalState } from 'qiankun';
+import { store } from '/@/store';
+import { router } from '/@/router';
 import { getToken } from '/@/utils/auth';
 //定义传入子应用的数据
 export function getProps() {
-    return {
-        data: {
-            publicPath:'/',
-            token: getToken(),
-            store,
-            router
-        }
-    }
+  return {
+    data: {
+      publicPath: '/',
+      token: getToken(),
+      store,
+      router,
+    },
+  };
 }
 
 /**
  * 定义全局状态，并返回通信方法,在主应用使用，微应用通过 props 获取通信方法。
  * @param state 主应用穿的公共数据
  */
-export function initGlState(info = {userName: 'admin'}) {
-    // 初始化state
-    const actions = initGlobalState(info);
-    // 设置新的值
-    actions.setGlobalState(info);
-    // 注册 观察者 函数 - 响应 globalState 变化，在 globalState 发生改变时触发该 观察者 函数。
-    actions.onGlobalStateChange((newState, prev) => {
-        // state: 变更后的状态; prev 变更前的状态
-        console.info("newState", newState)
-        console.info("prev", prev)
-        for (const key in newState) {
-            console.info("onGlobalStateChange", key)
-        }
-    });
+export function initGlState(info = { userName: 'admin' }) {
+  // 初始化state
+  const actions = initGlobalState(info);
+  // 设置新的值
+  actions.setGlobalState(info);
+  // 注册 观察者 函数 - 响应 globalState 变化，在 globalState 发生改变时触发该 观察者 函数。
+  actions.onGlobalStateChange((newState, prev) => {
+    // state: 变更后的状态; prev 变更前的状态
+    console.info('newState', newState);
+    console.info('prev', prev);
+    for (const key in newState) {
+      console.info('onGlobalStateChange', key);
+    }
+  });
 }
diff --git a/src/router/guard/permissionGuard.ts b/src/router/guard/permissionGuard.ts
index e04849f..132927d 100644
--- a/src/router/guard/permissionGuard.ts
+++ b/src/router/guard/permissionGuard.ts
@@ -16,103 +16,94 @@ const ROOT_PATH = RootRoute.path;
 const whitePathList: PageEnum[] = [LOGIN_PATH];
 
 export function createPermissionGuard(router: Router) {
-    const userStore = useUserStoreWithOut();
-    const permissionStore = usePermissionStoreWithOut();
-    router.beforeEach(async (to, from, next) => {
-        if (
-            from.path === ROOT_PATH &&
-            to.path === PageEnum.BASE_HOME &&
-            userStore.getUserInfo.homePath &&
-            userStore.getUserInfo.homePath !== PageEnum.BASE_HOME
-        ) {
-            next(userStore.getUserInfo.homePath);
+  const userStore = useUserStoreWithOut();
+  const permissionStore = usePermissionStoreWithOut();
+  router.beforeEach(async (to, from, next) => {
+    if (from.path === ROOT_PATH && to.path === PageEnum.BASE_HOME && userStore.getUserInfo.homePath && userStore.getUserInfo.homePath !== PageEnum.BASE_HOME) {
+      next(userStore.getUserInfo.homePath);
+      return;
+    }
+
+    const token = userStore.getToken;
+
+    // Whitelist can be directly entered
+    if (whitePathList.includes(to.path as PageEnum)) {
+      if (to.path === LOGIN_PATH && token) {
+        const isSessionTimeout = userStore.getSessionTimeout;
+        try {
+          await userStore.afterLoginAction();
+          if (!isSessionTimeout) {
+            next((to.query?.redirect as string) || '/');
             return;
-        }
+          }
+        } catch {}
+      }
+      next();
+      return;
+    }
 
-        const token = userStore.getToken;
+    // token does not exist
+    if (!token) {
+      // You can access without permission. You need to set the routing meta.ignoreAuth to true
+      if (to.meta.ignoreAuth) {
+        next();
+        return;
+      }
 
-        // Whitelist can be directly entered
-        if (whitePathList.includes(to.path as PageEnum)) {
-            if (to.path === LOGIN_PATH && token) {
-                const isSessionTimeout = userStore.getSessionTimeout;
-                try {
-                    await userStore.afterLoginAction();
-                    if (!isSessionTimeout) {
-                        next((to.query?.redirect as string) || '/');
-                        return;
-                    }
-                } catch {}
-            }
-            next();
-            return;
-        }
+      // redirect login page
+      const redirectData: { path: string; replace: boolean; query?: Recordable<string> } = {
+        path: LOGIN_PATH,
+        replace: true,
+      };
+      if (to.path) {
+        redirectData.query = {
+          ...redirectData.query,
+          redirect: to.path,
+        };
+      }
+      next(redirectData);
+      return;
+    }
 
-        // token does not exist
-        if (!token) {
-            // You can access without permission. You need to set the routing meta.ignoreAuth to true
-            if (to.meta.ignoreAuth) {
-                next();
-                return;
-            }
+    // Jump to the 404 page after processing the login
+    if (from.path === LOGIN_PATH && to.name === PAGE_NOT_FOUND_ROUTE.name && to.fullPath !== (userStore.getUserInfo.homePath || PageEnum.BASE_HOME)) {
+      next(userStore.getUserInfo.homePath || PageEnum.BASE_HOME);
+      return;
+    }
 
-            // redirect login page
-            const redirectData: { path: string; replace: boolean; query?: Recordable<string> } = {
-                path: LOGIN_PATH,
-                replace: true,
-            };
-            if (to.path) {
-                redirectData.query = {
-                    ...redirectData.query,
-                    redirect: to.path,
-                };
-            }
-            next(redirectData);
-            return;
-        }
+    // get userinfo while last fetch time is empty
+    if (userStore.getLastUpdateTime === 0) {
+      try {
+        await userStore.getUserInfoAction();
+      } catch (err) {
+        console.info(err);
+        next();
+      }
+    }
 
-        // Jump to the 404 page after processing the login
-        if (
-            from.path === LOGIN_PATH &&
-            to.name === PAGE_NOT_FOUND_ROUTE.name &&
-            to.fullPath !== (userStore.getUserInfo.homePath || PageEnum.BASE_HOME)
-        ) {
-            next(userStore.getUserInfo.homePath || PageEnum.BASE_HOME);
-            return;
-        }
+    if (permissionStore.getIsDynamicAddedRoute) {
+      next();
+      return;
+    }
 
-        // get userinfo while last fetch time is empty
-        if (userStore.getLastUpdateTime === 0) {
-            try {
-                await userStore.getUserInfoAction();
-            } catch (err) {
-                console.info(err);
-                next();
-            }
-        }
+    const routes = await permissionStore.buildRoutesAction();
 
-        if (permissionStore.getIsDynamicAddedRoute) {
-            next();
-            return;
-        }
-
-        const routes = await permissionStore.buildRoutesAction();
-
-        routes.forEach((route) => {
-            router.addRoute(route as unknown as RouteRecordRaw);
-        });
-
-        router.addRoute(PAGE_NOT_FOUND_ROUTE as unknown as RouteRecordRaw);
-
-        permissionStore.setDynamicAddedRoute(true);
-
-        if (to.name === PAGE_NOT_FOUND_ROUTE.name) {
-            // 动态添加路由后，此处应当重定向到fullPath，否则会加载404页面内容
-            next({ path: to.fullPath, replace: true, query: to.query });
-        } else {
-            const redirectPath = (from.query.redirect || to.path) as string;
-            const redirect = decodeURIComponent(redirectPath);
-            const nextData = to.path === redirect ? { ...to, replace: true } : { path: redirect };
-            next(nextData);
-        }
+    routes.forEach((route) => {
+      router.addRoute(route as unknown as RouteRecordRaw);
     });
+
+    router.addRoute(PAGE_NOT_FOUND_ROUTE as unknown as RouteRecordRaw);
+
+    permissionStore.setDynamicAddedRoute(true);
+
+    if (to.name === PAGE_NOT_FOUND_ROUTE.name) {
+      // 动态添加路由后，此处应当重定向到fullPath，否则会加载404页面内容
+      next({ path: to.fullPath, replace: true, query: to.query });
+    } else {
+      const redirectPath = (from.query.redirect || to.path) as string;
+      const redirect = decodeURIComponent(redirectPath);
+      const nextData = to.path === redirect ? { ...to, replace: true } : { path: redirect };
+      next(nextData);
+    }
+  });
 }
diff --git a/src/router/helper/routeHelper.ts b/src/router/helper/routeHelper.ts
index 1ab989b..6b8350a 100644
--- a/src/router/helper/routeHelper.ts
+++ b/src/router/helper/routeHelper.ts
@@ -6,7 +6,7 @@ import { cloneDeep, omit } from 'lodash-es';
 import { warn } from '/@/utils/log';
 import { createRouter, createWebHashHistory } from 'vue-router';
 import { getToken } from '/@/utils/auth';
-import {URL_HASH_TAB} from '/@/utils'
+import { URL_HASH_TAB } from '/@/utils';
 import { packageViews } from '/@/utils/monorepo/dynamicRouter';
 
 export type LayoutMapKey = 'LAYOUT';
@@ -34,36 +34,36 @@ function asyncImportRoute(routes: AppRouteRecordRaw[] | undefined) {
     // update-begin--author:sunjianlei---date:20210918---for:适配旧版路由选项 --------
     // @ts-ignore 适配隐藏路由
     if (item?.hidden) {
-      item.meta.hideMenu = true
+      item.meta.hideMenu = true;
       //是否隐藏面包屑
-      item.meta.hideBreadcrumb = true
+      item.meta.hideBreadcrumb = true;
     }
     // @ts-ignore 添加忽略路由配置
-    if (item?.route==0) {
-      item.meta.ignoreRoute = true
+    if (item?.route == 0) {
+      item.meta.ignoreRoute = true;
     }
     // @ts-ignore 添加是否缓存路由配置
-    item.meta.ignoreKeepAlive = !item?.meta.keepAlive
-    let token=getToken();
+    item.meta.ignoreKeepAlive = !item?.meta.keepAlive;
+    let token = getToken();
     // URL支持{{ window.xxx }}占位符变量
-    item.component = (item.component|| '').replace(/{{([^}}]+)?}}/g, (s1, s2) => eval(s2)).replace('${token}',token);
+    item.component = (item.component || '').replace(/{{([^}}]+)?}}/g, (s1, s2) => eval(s2)).replace('${token}', token);
 
     // 适配 iframe
     if (/^\/?http(s)?/.test(item.component as string)) {
-      item.component = item.component.substring(1, item.component.length)
+      item.component = item.component.substring(1, item.component.length);
     }
     if (/^http(s)?/.test(item.component as string)) {
       if (item.meta?.internalOrExternal) {
         // @ts-ignore 外部打开
-        item.path = item.component
+        item.path = item.component;
         // update-begin--author:sunjianlei---date:20220408---for: 【VUEN-656】配置外部网址打不开，原因是带了#号，需要替换一下
-        item.path = item.path.replace('#', URL_HASH_TAB)
+        item.path = item.path.replace('#', URL_HASH_TAB);
         // update-end--author:sunjianlei---date:20220408---for: 【VUEN-656】配置外部网址打不开，原因是带了#号，需要替换一下
       } else {
         // @ts-ignore 内部打开
-        item.meta.frameSrc = item.component
+        item.meta.frameSrc = item.component;
       }
-      delete item.component
+      delete item.component;
     }
     // update-end--author:sunjianlei---date:20210918---for:适配旧版路由选项 --------
     if (!item.component && item.meta?.frameSrc) {
@@ -76,12 +76,11 @@ function asyncImportRoute(routes: AppRouteRecordRaw[] | undefined) {
       if (layoutFound) {
         item.component = layoutFound;
       } else {
-
         // update-end--author:zyf---date:20220307--for:VUEN-219兼容后台返回动态首页,目的适配跟v2版本配置一致 --------
-        if(component.indexOf('dashboard/')>-1){
+        if (component.indexOf('dashboard/') > -1) {
           //当数据标sys_permission中component没有拼接index时前端需要拼接
-          if(component.indexOf('/index')<0) {
-            component = component + '/index'
+          if (component.indexOf('/index') < 0) {
+            component = component + '/index';
           }
         }
         // update-end--author:zyf---date:20220307---for:VUEN-219兼容后台返回动态首页,目的适配跟v2版本配置一致 --------
@@ -94,10 +93,7 @@ function asyncImportRoute(routes: AppRouteRecordRaw[] | undefined) {
   });
 }
 
-function dynamicImport(
-  dynamicViewsModules: Record<string, () => Promise<Recordable>>,
-  component: string
-) {
+function dynamicImport(dynamicViewsModules: Record<string, () => Promise<Recordable>>, component: string) {
   const keys = Object.keys(dynamicViewsModules);
   const matchKeys = keys.filter((key) => {
     const k = key.replace('../../views', '');
@@ -110,11 +106,8 @@ function dynamicImport(
   if (matchKeys?.length === 1) {
     const matchKey = matchKeys[0];
     return dynamicViewsModules[matchKey];
-  }
-  else if (matchKeys?.length > 1) {
-    warn(
-      'Please do not create `.vue` and `.TSX` files with the same file name in the same hierarchical directory under the views folder. This will cause dynamic introduction failure'
-    );
+  } else if (matchKeys?.length > 1) {
+    warn('Please do not create `.vue` and `.TSX` files with the same file name in the same hierarchical directory under the views folder. This will cause dynamic introduction failure');
     return;
   }
 }
@@ -136,8 +129,7 @@ export function transformObjToRoute<T = AppRouteModule>(routeList: AppRouteModul
         meta.affix = false;
         route.meta = meta;
       }
-    }
-    else {
+    } else {
       warn('请正确配置路由：' + route?.name + '的component属性');
     }
     route.children && asyncImportRoute(route.children);
@@ -176,11 +168,7 @@ function promoteRouteLevel(routeModule: AppRouteModule) {
 }
 
 // Add all sub-routes to the secondary route
-function addToChildren(
-  routes: RouteRecordNormalized[],
-  children: AppRouteRecordRaw[],
-  routeModule: AppRouteModule
-) {
+function addToChildren(routes: RouteRecordNormalized[], children: AppRouteRecordRaw[], routeModule: AppRouteModule) {
   for (let index = 0; index < children.length; index++) {
     const child = children[index];
     const route = routes.find((item) => item.name === child.name);
@@ -220,7 +208,7 @@ function isMultipleRoute(routeModule: AppRouteModule) {
  * @updateBy:lsq
  * @updateDate:2021-09-08
  */
-export function addSlashToRouteComponent(routeList: AppRouteRecordRaw[]){
+export function addSlashToRouteComponent(routeList: AppRouteRecordRaw[]) {
   routeList.forEach((route) => {
     let component = route.component as string;
     if (component) {
diff --git a/src/router/index.ts b/src/router/index.ts
index ffb0610..359c388 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -7,10 +7,10 @@ import { basicRoutes } from './routes';
 // 白名单应该包含基本静态路由
 const WHITE_NAME_LIST: string[] = [];
 const getRouteNames = (array: any[]) =>
-    array.forEach((item) => {
-      WHITE_NAME_LIST.push(item.name);
-      getRouteNames(item.children || []);
-    });
+  array.forEach((item) => {
+    WHITE_NAME_LIST.push(item.name);
+    getRouteNames(item.children || []);
+  });
 getRouteNames(basicRoutes);
 
 // app router
diff --git a/src/router/routes/basic.ts b/src/router/routes/basic.ts
index 58db494..3dddee2 100644
--- a/src/router/routes/basic.ts
+++ b/src/router/routes/basic.ts
@@ -1,11 +1,6 @@
 import type { AppRouteRecordRaw } from '/@/router/types';
 import { t } from '/@/hooks/web/useI18n';
-import {
-  REDIRECT_NAME,
-  LAYOUT,
-  EXCEPTION_COMPONENT,
-  PAGE_NOT_FOUND_NAME,
-} from '/@/router/constant';
+import { REDIRECT_NAME, LAYOUT, EXCEPTION_COMPONENT, PAGE_NOT_FOUND_NAME } from '/@/router/constant';
 
 // 404 on a page
 export const PAGE_NOT_FOUND_ROUTE: AppRouteRecordRaw = {
diff --git a/src/router/routes/index.ts b/src/router/routes/index.ts
index 149ec42..1592316 100644
--- a/src/router/routes/index.ts
+++ b/src/router/routes/index.ts
@@ -37,10 +37,4 @@ export const LoginRoute: AppRouteRecordRaw = {
 };
 
 // Basic routing without permission
-export const basicRoutes = [
-  LoginRoute,
-  RootRoute,
-  ...mainOutRoutes,
-  REDIRECT_ROUTE,
-  PAGE_NOT_FOUND_ROUTE,
-];
+export const basicRoutes = [LoginRoute, RootRoute, ...mainOutRoutes, REDIRECT_ROUTE, PAGE_NOT_FOUND_ROUTE];
diff --git a/src/router/routes/modules/demo/comp.ts b/src/router/routes/modules/demo/comp.ts
index ca32398..42444e5 100644
--- a/src/router/routes/modules/demo/comp.ts
+++ b/src/router/routes/modules/demo/comp.ts
@@ -23,7 +23,7 @@ const comp: AppRouteModule = {
       meta: {
         title: t('routes.demo.comp.jeecg'),
       },
-      children:[
+      children: [
         {
           path: 'basic',
           name: 'JAreaLinkage',
@@ -40,7 +40,7 @@ const comp: AppRouteModule = {
             title: t('routes.demo.comp.oneToMore'),
           },
         },
-      ]
+      ],
     },
     {
       path: 'basic',
@@ -49,7 +49,7 @@ const comp: AppRouteModule = {
       meta: {
         title: t('routes.demo.comp.basic'),
       },
-      children:[
+      children: [
         {
           path: 'button',
           name: 'ButtonDemo',
@@ -97,10 +97,9 @@ const comp: AppRouteModule = {
             },
           ],
         },
-      ]
+      ],
     },
 
-
     {
       path: 'form',
       name: 'FormDemo',
@@ -334,7 +333,7 @@ const comp: AppRouteModule = {
       meta: {
         title: t('routes.demo.comp.modal'),
       },
-      children:[
+      children: [
         {
           path: 'basic',
           name: 'ModalBasicDemo',
@@ -351,7 +350,7 @@ const comp: AppRouteModule = {
             title: t('routes.demo.comp.modal.drawer'),
           },
         },
-      ]
+      ],
     },
 
     {
@@ -362,7 +361,7 @@ const comp: AppRouteModule = {
       meta: {
         title: t('routes.demo.comp.third'),
       },
-      children:[
+      children: [
         {
           path: 'basic',
           name: 'CropperDemo',
@@ -491,7 +490,7 @@ const comp: AppRouteModule = {
             title: t('routes.demo.feat.ripple'),
           },
         },
-      ]
+      ],
     },
     {
       path: 'tree',
@@ -702,7 +701,7 @@ const comp: AppRouteModule = {
           },
         },
       ],
-    }
+    },
   ],
 };
 
diff --git a/src/router/routes/modules/demo/feat.ts b/src/router/routes/modules/demo/feat.ts
index a6fbe01..68b63af 100644
--- a/src/router/routes/modules/demo/feat.ts
+++ b/src/router/routes/modules/demo/feat.ts
@@ -94,7 +94,6 @@ const feat: AppRouteModule = {
       },
     },
 
-
     {
       path: 'copy',
       name: 'CopyDemo',
@@ -122,7 +121,6 @@ const feat: AppRouteModule = {
       },
     },
 
-
     {
       path: '/error-log',
       name: 'ErrorLog',
diff --git a/src/router/routes/modules/demo/page.ts b/src/router/routes/modules/demo/page.ts
index e9dc9f4..17ab276 100644
--- a/src/router/routes/modules/demo/page.ts
+++ b/src/router/routes/modules/demo/page.ts
@@ -1,255 +1,255 @@
-import type {AppRouteModule} from '/@/router/types';
+import type { AppRouteModule } from '/@/router/types';
 
-import {getParentLayout, LAYOUT} from '/@/router/constant';
-import {ExceptionEnum} from '/@/enums/exceptionEnum';
-import {t} from '/@/hooks/web/useI18n';
+import { getParentLayout, LAYOUT } from '/@/router/constant';
+import { ExceptionEnum } from '/@/enums/exceptionEnum';
+import { t } from '/@/hooks/web/useI18n';
 
 const ExceptionPage = () => import('/@/views/sys/exception/Exception.vue');
 
 const page: AppRouteModule = {
-    path: '/page-demo',
-    name: 'PageDemo',
-    component: LAYOUT,
-    redirect: '/page-demo/form/basic',
-    meta: {
-        orderNo: 20,
-        icon: 'ion:aperture-outline',
-        title: t('routes.demo.page.page'),
+  path: '/page-demo',
+  name: 'PageDemo',
+  component: LAYOUT,
+  redirect: '/page-demo/form/basic',
+  meta: {
+    orderNo: 20,
+    icon: 'ion:aperture-outline',
+    title: t('routes.demo.page.page'),
+  },
+  children: [
+    // =============================form start=============================
+    {
+      path: 'form',
+      name: 'FormPage',
+      redirect: '/page-demo/form/basic',
+      component: getParentLayout('FormPage'),
+      meta: {
+        title: t('routes.demo.page.form'),
+      },
+      children: [
+        {
+          path: 'basic',
+          name: 'FormBasicPage',
+          component: () => import('/@/views/demo/page/form/basic/index.vue'),
+          meta: {
+            title: t('routes.demo.page.formBasic'),
+          },
+        },
+        {
+          path: 'step',
+          name: 'FormStepPage',
+          component: () => import('/@/views/demo/page/form/step/index.vue'),
+          meta: {
+            title: t('routes.demo.page.formStep'),
+          },
+        },
+        {
+          path: 'high',
+          name: 'FormHightPage',
+          component: () => import('/@/views/demo/page/form/high/index.vue'),
+          meta: {
+            title: t('routes.demo.page.formHigh'),
+          },
+        },
+      ],
     },
-    children: [
-        // =============================form start=============================
+    // =============================form end=============================
+    // =============================desc start=============================
+    {
+      path: 'desc',
+      name: 'DescPage',
+      component: getParentLayout('DescPage'),
+      redirect: '/page-demo/desc/basic',
+      meta: {
+        title: t('routes.demo.page.desc'),
+      },
+      children: [
         {
-            path: 'form',
-            name: 'FormPage',
-            redirect: '/page-demo/form/basic',
-            component: getParentLayout('FormPage'),
-            meta: {
-                title: t('routes.demo.page.form'),
-            },
-            children: [
-                {
-                    path: 'basic',
-                    name: 'FormBasicPage',
-                    component: () => import('/@/views/demo/page/form/basic/index.vue'),
-                    meta: {
-                        title: t('routes.demo.page.formBasic'),
-                    },
-                },
-                {
-                    path: 'step',
-                    name: 'FormStepPage',
-                    component: () => import('/@/views/demo/page/form/step/index.vue'),
-                    meta: {
-                        title: t('routes.demo.page.formStep'),
-                    },
-                },
-                {
-                    path: 'high',
-                    name: 'FormHightPage',
-                    component: () => import('/@/views/demo/page/form/high/index.vue'),
-                    meta: {
-                        title: t('routes.demo.page.formHigh'),
-                    },
-                },
-            ],
+          path: 'basic',
+          name: 'DescBasicPage',
+          component: () => import('/@/views/demo/page/desc/basic/index.vue'),
+          meta: {
+            title: t('routes.demo.page.descBasic'),
+          },
         },
-        // =============================form end=============================
-        // =============================desc start=============================
         {
-            path: 'desc',
-            name: 'DescPage',
-            component: getParentLayout('DescPage'),
-            redirect: '/page-demo/desc/basic',
-            meta: {
-                title: t('routes.demo.page.desc'),
-            },
-            children: [
-                {
-                    path: 'basic',
-                    name: 'DescBasicPage',
-                    component: () => import('/@/views/demo/page/desc/basic/index.vue'),
-                    meta: {
-                        title: t('routes.demo.page.descBasic'),
-                    },
-                },
-                {
-                    path: 'high',
-                    name: 'DescHighPage',
-                    component: () => import('/@/views/demo/page/desc/high/index.vue'),
-                    meta: {
-                        title: t('routes.demo.page.descHigh'),
-                    },
-                },
-            ],
+          path: 'high',
+          name: 'DescHighPage',
+          component: () => import('/@/views/demo/page/desc/high/index.vue'),
+          meta: {
+            title: t('routes.demo.page.descHigh'),
+          },
         },
-        // =============================desc end=============================
+      ],
+    },
+    // =============================desc end=============================
 
-        // =============================result start=============================
-        {
-            path: 'result',
-            name: 'ResultPage',
-            redirect: '/page-demo/result/success',
-            component: getParentLayout('ResultPage'),
+    // =============================result start=============================
+    {
+      path: 'result',
+      name: 'ResultPage',
+      redirect: '/page-demo/result/success',
+      component: getParentLayout('ResultPage'),
 
-            meta: {
-                title: t('routes.demo.page.result'),
-            },
-            children: [
-                {
-                    path: 'success',
-                    name: 'ResultSuccessPage',
-                    component: () => import('/@/views/demo/page/result/success/index.vue'),
-                    meta: {
-                        title: t('routes.demo.page.resultSuccess'),
-                    },
-                },
-                {
-                    path: 'fail',
-                    name: 'ResultFailPage',
-                    component: () => import('/@/views/demo/page/result/fail/index.vue'),
-                    meta: {
-                        title: t('routes.demo.page.resultFail'),
-                    },
-                },
-            ],
+      meta: {
+        title: t('routes.demo.page.result'),
+      },
+      children: [
+        {
+          path: 'success',
+          name: 'ResultSuccessPage',
+          component: () => import('/@/views/demo/page/result/success/index.vue'),
+          meta: {
+            title: t('routes.demo.page.resultSuccess'),
+          },
         },
-        // =============================result end=============================
+        {
+          path: 'fail',
+          name: 'ResultFailPage',
+          component: () => import('/@/views/demo/page/result/fail/index.vue'),
+          meta: {
+            title: t('routes.demo.page.resultFail'),
+          },
+        },
+      ],
+    },
+    // =============================result end=============================
 
-        // =============================account start=============================
+    // =============================account start=============================
+    {
+      path: 'account',
+      name: 'AccountPage',
+      component: getParentLayout('AccountPage'),
+      redirect: '/page-demo/account/setting',
+      meta: {
+        title: t('routes.demo.page.account'),
+      },
+      children: [
         {
-            path: 'account',
-            name: 'AccountPage',
-            component: getParentLayout('AccountPage'),
-            redirect: '/page-demo/account/setting',
-            meta: {
-                title: t('routes.demo.page.account'),
-            },
-            children: [
-                {
-                    path: 'center',
-                    name: 'AccountCenterPage',
-                    component: () => import('/@/views/demo/page/account/center/index.vue'),
-                    meta: {
-                        title: t('routes.demo.page.accountCenter'),
-                    },
-                },
-                {
-                    path: 'setting',
-                    name: 'AccountSettingPage',
-                    component: () => import('/@/views/demo/page/account/setting/index.vue'),
-                    meta: {
-                        title: t('routes.demo.page.accountSetting'),
-                    },
-                },
-            ],
+          path: 'center',
+          name: 'AccountCenterPage',
+          component: () => import('/@/views/demo/page/account/center/index.vue'),
+          meta: {
+            title: t('routes.demo.page.accountCenter'),
+          },
         },
-        // =============================account end=============================
-        // =============================exception start=============================
         {
-            path: 'exception',
-            name: 'ExceptionPage',
-            component: getParentLayout('ExceptionPage'),
-            redirect: '/page-demo/exception/404',
-            meta: {
-                title: t('routes.demo.page.exception'),
-            },
-            children: [
-                {
-                    path: '403',
-                    name: 'PageNotAccess',
-                    component: ExceptionPage,
-                    props: {
-                        status: ExceptionEnum.PAGE_NOT_ACCESS,
-                    },
-                    meta: {
-                        title: '403',
-                    },
-                },
-                {
-                    path: '404',
-                    name: 'PageNotFound',
-                    component: ExceptionPage,
-                    props: {
-                        status: ExceptionEnum.PAGE_NOT_FOUND,
-                    },
-                    meta: {
-                        title: '404',
-                    },
-                },
-                {
-                    path: '500',
-                    name: 'ServiceError',
-                    component: ExceptionPage,
-                    props: {
-                        status: ExceptionEnum.ERROR,
-                    },
-                    meta: {
-                        title: '500',
-                    },
-                },
-                {
-                    path: 'net-work-error',
-                    name: 'NetWorkError',
-                    component: ExceptionPage,
-                    props: {
-                        status: ExceptionEnum.NET_WORK_ERROR,
-                    },
-                    meta: {
-                        title: t('routes.demo.page.netWorkError'),
-                    },
-                },
-                {
-                    path: 'not-data',
-                    name: 'NotData',
-                    component: ExceptionPage,
-                    props: {
-                        status: ExceptionEnum.PAGE_NOT_DATA,
-                    },
-                    meta: {
-                        title: t('routes.demo.page.notData'),
-                    },
-                },
-            ],
+          path: 'setting',
+          name: 'AccountSettingPage',
+          component: () => import('/@/views/demo/page/account/setting/index.vue'),
+          meta: {
+            title: t('routes.demo.page.accountSetting'),
+          },
         },
-        // =============================exception end=============================
-        // =============================list start=============================
+      ],
+    },
+    // =============================account end=============================
+    // =============================exception start=============================
+    {
+      path: 'exception',
+      name: 'ExceptionPage',
+      component: getParentLayout('ExceptionPage'),
+      redirect: '/page-demo/exception/404',
+      meta: {
+        title: t('routes.demo.page.exception'),
+      },
+      children: [
         {
-            path: 'list',
-            name: 'ListPage',
-            component: getParentLayout('ListPage'),
-            redirect: '/page-demo/list/card',
-            meta: {
-                title: t('routes.demo.page.list'),
-            },
-            children: [
-                {
-                    path: 'basic',
-                    name: 'ListBasicPage',
-                    component: () => import('/@/views/demo/page/list/basic/index.vue'),
-                    meta: {
-                        title: t('routes.demo.page.listBasic'),
-                    },
-                },
-                {
-                    path: 'card',
-                    name: 'ListCardPage',
-                    component: () => import('/@/views/demo/page/list/card/index.vue'),
-                    meta: {
-                        title: t('routes.demo.page.listCard'),
-                    },
-                },
-                {
-                    path: 'search',
-                    name: 'ListSearchPage',
-                    component: () => import('/@/views/demo/page/list/search/index.vue'),
-                    meta: {
-                        title: t('routes.demo.page.listSearch'),
-                    },
-                },
-            ],
+          path: '403',
+          name: 'PageNotAccess',
+          component: ExceptionPage,
+          props: {
+            status: ExceptionEnum.PAGE_NOT_ACCESS,
+          },
+          meta: {
+            title: '403',
+          },
         },
-        // =============================list end=============================
-    ],
+        {
+          path: '404',
+          name: 'PageNotFound',
+          component: ExceptionPage,
+          props: {
+            status: ExceptionEnum.PAGE_NOT_FOUND,
+          },
+          meta: {
+            title: '404',
+          },
+        },
+        {
+          path: '500',
+          name: 'ServiceError',
+          component: ExceptionPage,
+          props: {
+            status: ExceptionEnum.ERROR,
+          },
+          meta: {
+            title: '500',
+          },
+        },
+        {
+          path: 'net-work-error',
+          name: 'NetWorkError',
+          component: ExceptionPage,
+          props: {
+            status: ExceptionEnum.NET_WORK_ERROR,
+          },
+          meta: {
+            title: t('routes.demo.page.netWorkError'),
+          },
+        },
+        {
+          path: 'not-data',
+          name: 'NotData',
+          component: ExceptionPage,
+          props: {
+            status: ExceptionEnum.PAGE_NOT_DATA,
+          },
+          meta: {
+            title: t('routes.demo.page.notData'),
+          },
+        },
+      ],
+    },
+    // =============================exception end=============================
+    // =============================list start=============================
+    {
+      path: 'list',
+      name: 'ListPage',
+      component: getParentLayout('ListPage'),
+      redirect: '/page-demo/list/card',
+      meta: {
+        title: t('routes.demo.page.list'),
+      },
+      children: [
+        {
+          path: 'basic',
+          name: 'ListBasicPage',
+          component: () => import('/@/views/demo/page/list/basic/index.vue'),
+          meta: {
+            title: t('routes.demo.page.listBasic'),
+          },
+        },
+        {
+          path: 'card',
+          name: 'ListCardPage',
+          component: () => import('/@/views/demo/page/list/card/index.vue'),
+          meta: {
+            title: t('routes.demo.page.listCard'),
+          },
+        },
+        {
+          path: 'search',
+          name: 'ListSearchPage',
+          component: () => import('/@/views/demo/page/list/search/index.vue'),
+          meta: {
+            title: t('routes.demo.page.listSearch'),
+          },
+        },
+      ],
+    },
+    // =============================list end=============================
+  ],
 };
 
 export default page;
diff --git a/src/router/types.ts b/src/router/types.ts
index a8d9546..116755b 100644
--- a/src/router/types.ts
+++ b/src/router/types.ts
@@ -2,10 +2,7 @@ import type { RouteRecordRaw, RouteMeta } from 'vue-router';
 import { RoleEnum } from '/@/enums/roleEnum';
 import { defineComponent } from 'vue';
 
-export type Component<T extends any = any> =
-  | ReturnType<typeof defineComponent>
-  | (() => Promise<typeof import('*.vue')>)
-  | (() => Promise<T>);
+export type Component<T extends any = any> = ReturnType<typeof defineComponent> | (() => Promise<typeof import('*.vue')>) | (() => Promise<T>);
 
 // @ts-ignore
 export interface AppRouteRecordRaw extends Omit<RouteRecordRaw, 'meta'> {
diff --git a/src/settings/designSetting.ts b/src/settings/designSetting.ts
index 654152f..9e5c0c6 100644
--- a/src/settings/designSetting.ts
+++ b/src/settings/designSetting.ts
@@ -5,44 +5,10 @@ export const prefixCls = 'jeecg';
 export const darkMode = ThemeEnum.LIGHT;
 
 // app theme preset color
-export const APP_PRESET_COLOR_LIST: string[] = [
-  '#0960bd',
-  '#1890ff',
-  '#009688',
-  '#536dfe',
-  '#ff5c93',
-  '#ee4f12',
-  '#0096c7',
-  '#9c27b0',
-  '#ff9800',
-];
+export const APP_PRESET_COLOR_LIST: string[] = ['#0960bd', '#1890ff', '#009688', '#536dfe', '#ff5c93', '#ee4f12', '#0096c7', '#9c27b0', '#ff9800'];
 
 // header preset color
-export const HEADER_PRESET_BG_COLOR_LIST: string[] = [
-  '#ffffff',
-  '#151515',
-  '#009688',
-  '#5172DC',
-  '#018ffb',
-  '#409eff',
-  '#e74c3c',
-  '#24292e',
-  '#394664',
-  '#001529',
-  '#383f45',
-];
+export const HEADER_PRESET_BG_COLOR_LIST: string[] = ['#ffffff', '#151515', '#009688', '#5172DC', '#018ffb', '#409eff', '#e74c3c', '#24292e', '#394664', '#001529', '#383f45'];
 
 // sider preset color
-export const SIDE_BAR_BG_COLOR_LIST: string[] = [
-  '#001529',
-  '#212121',
-  '#273352',
-  '#ffffff',
-  '#191b24',
-  '#191a23',
-  '#304156',
-  '#001628',
-  '#28333E',
-  '#344058',
-  '#383f45',
-];
+export const SIDE_BAR_BG_COLOR_LIST: string[] = ['#001529', '#212121', '#273352', '#ffffff', '#191b24', '#191a23', '#304156', '#001628', '#28333E', '#344058', '#383f45'];
diff --git a/src/settings/projectSetting.ts b/src/settings/projectSetting.ts
index 111ec50..4752c80 100644
--- a/src/settings/projectSetting.ts
+++ b/src/settings/projectSetting.ts
@@ -1,15 +1,7 @@
 import type { ProjectConfig } from '/#/config';
 import { MenuTypeEnum, MenuModeEnum, TriggerEnum, MixSidebarTriggerEnum } from '/@/enums/menuEnum';
 import { CacheTypeEnum } from '/@/enums/cacheEnum';
-import {
-  ContentEnum,
-  PermissionModeEnum,
-  ThemeEnum,
-  RouterTransitionEnum,
-  SettingButtonPositionEnum,
-  SessionTimeoutProcessingEnum,
-  TabsThemeEnum,
-} from '/@/enums/appEnum';
+import { ContentEnum, PermissionModeEnum, ThemeEnum, RouterTransitionEnum, SettingButtonPositionEnum, SessionTimeoutProcessingEnum, TabsThemeEnum } from '/@/enums/appEnum';
 import { SIDE_BAR_BG_COLOR_LIST, HEADER_PRESET_BG_COLOR_LIST } from './designSetting';
 import { primaryColor } from '../../build/config/themeConfig';
 
diff --git a/src/settings/registerThirdComp.ts b/src/settings/registerThirdComp.ts
index ce980a7..0118f0f 100644
--- a/src/settings/registerThirdComp.ts
+++ b/src/settings/registerThirdComp.ts
@@ -1,11 +1,10 @@
-import type { App } from 'vue'
-import { registerJVxeTable } from '/@/components/jeecg/JVxeTable'
-import { registerJVxeCustom } from '/@/components/JVxeCustom'
+import type { App } from 'vue';
+import { registerJVxeTable } from '/@/components/jeecg/JVxeTable';
+import { registerJVxeCustom } from '/@/components/JVxeCustom';
 
 export async function registerThirdComp(app: App) {
   // 注册 JVxeTable 组件
-  registerJVxeTable(app)
+  registerJVxeTable(app);
   // 注册 JVxeTable 自定义组件
-  await registerJVxeCustom()
-
+  await registerJVxeCustom();
 }
diff --git a/src/store/modules/app.ts b/src/store/modules/app.ts
index 72f9bf6..468eb5e 100644
--- a/src/store/modules/app.ts
+++ b/src/store/modules/app.ts
@@ -1,10 +1,4 @@
-import type {
-  ProjectConfig,
-  HeaderSetting,
-  MenuSetting,
-  TransitionSetting,
-  MultiTabsSetting,
-} from '/#/config';
+import type { ProjectConfig, HeaderSetting, MenuSetting, TransitionSetting, MultiTabsSetting } from '/#/config';
 import type { BeforeMiniState } from '/#/store';
 
 import { defineStore } from 'pinia';
diff --git a/src/store/modules/errorLog.ts b/src/store/modules/errorLog.ts
index a4b0b8c..c95edba 100644
--- a/src/store/modules/errorLog.ts
+++ b/src/store/modules/errorLog.ts
@@ -56,10 +56,7 @@ export const useErrorLogStore = defineStore({
         type: ErrorTypeEnum.AJAX,
       };
       if (error.response) {
-        const {
-          config: { url = '', data: params = '', method = 'get', headers = {} } = {},
-          data = {},
-        } = error.response;
+        const { config: { url = '', data: params = '', method = 'get', headers = {} } = {}, data = {} } = error.response;
         errInfo.url = url;
         errInfo.name = 'Ajax Error!';
         errInfo.file = '-';
diff --git a/src/store/modules/multipleTab.ts b/src/store/modules/multipleTab.ts
index 8059bb9..38f3a8b 100644
--- a/src/store/modules/multipleTab.ts
+++ b/src/store/modules/multipleTab.ts
@@ -34,7 +34,6 @@ const getToTarget = (tabItem: RouteLocationNormalized) => {
   };
 };
 
-
 const cacheTab = projectSetting.multiTabsSetting.cache;
 
 export const useMultipleTabStore = defineStore({
@@ -121,12 +120,7 @@ export const useMultipleTabStore = defineStore({
     async addTab(route: RouteLocationNormalized) {
       const { path, name, fullPath, params, query, meta } = getRawRoute(route);
       // 404  The page does not need to add a tab
-      if (
-        path === PageEnum.ERROR_PAGE ||
-        path === PageEnum.BASE_LOGIN ||
-        !name ||
-        [REDIRECT_ROUTE.name, PAGE_NOT_FOUND_ROUTE.name].includes(name as string)
-      ) {
+      if (path === PageEnum.ERROR_PAGE || path === PageEnum.BASE_LOGIN || !name || [REDIRECT_ROUTE.name, PAGE_NOT_FOUND_ROUTE.name].includes(name as string)) {
         return;
       }
 
@@ -157,9 +151,7 @@ export const useMultipleTabStore = defineStore({
           // const realName: string = path.match(/(\S*)\//)![1];
           const realPath = meta?.realPath ?? '';
           // 获取到已经打开的动态路由数, 判断是否大于某一个值
-          if (
-            this.tabList.filter((e) => e.meta?.realPath ?? '' === realPath).length >= dynamicLevel
-          ) {
+          if (this.tabList.filter((e) => e.meta?.realPath ?? '' === realPath).length >= dynamicLevel) {
             // 关闭第一个
             const index = this.tabList.findIndex((item) => item.meta.realPath === realPath);
             index !== -1 && this.tabList.splice(index, 1);
diff --git a/src/store/modules/permission.ts b/src/store/modules/permission.ts
index debe2c1..d5e6fab 100644
--- a/src/store/modules/permission.ts
+++ b/src/store/modules/permission.ts
@@ -6,7 +6,7 @@ import { useI18n } from '/@/hooks/web/useI18n';
 import { useUserStore } from './user';
 import { useAppStoreWithOut } from './app';
 import { toRaw } from 'vue';
-import {transformObjToRoute, flatMultiLevelRoutes, addSlashToRouteComponent} from '/@/router/helper/routeHelper';
+import { transformObjToRoute, flatMultiLevelRoutes, addSlashToRouteComponent } from '/@/router/helper/routeHelper';
 import { transformRouteToMenu } from '/@/router/helper/menuHelper';
 
 import projectSetting from '/@/settings/projectSetting';
@@ -27,14 +27,14 @@ import { PageEnum } from '/@/enums/pageEnum';
 // 系统权限
 interface AuthItem {
   // 菜单权限编码，例如：“sys:schedule:list,sys:schedule:info”,多个逗号隔开
-  action: string,
+  action: string;
   // 权限策略1显示2禁用
-  type: string | number,
+  type: string | number;
   // 权限状态(0无效1有效)
-  status: string | number,
+  status: string | number;
   // 权限名称
-  describe?: string,
-  isAuth?: boolean,
+  describe?: string;
+  isAuth?: boolean;
 }
 
 interface PermissionState {
@@ -48,11 +48,11 @@ interface PermissionState {
   backMenuList: Menu[];
   frontMenuList: Menu[];
   // 用户所拥有的权限
-  authList: AuthItem[],
+  authList: AuthItem[];
   // 全部权限配置
-  allAuthList: AuthItem[],
+  allAuthList: AuthItem[];
   // 系统安全模式
-  sysSafeMode: boolean,
+  sysSafeMode: boolean;
 }
 export const usePermissionStore = defineStore({
   id: 'app-permission',
@@ -116,9 +116,9 @@ export const usePermissionStore = defineStore({
     },
     async changePermissionCode() {
       const systemPermission = await getPermCode();
-      const codeList = systemPermission.codeList
+      const codeList = systemPermission.codeList;
       this.setPermCodeList(codeList);
-      this.setAuthData(systemPermission)
+      this.setAuthData(systemPermission);
     },
     async buildRoutesAction(): Promise<AppRouteRecordRaw[]> {
       const { t } = useI18n();
@@ -211,30 +211,35 @@ export const usePermissionStore = defineStore({
             this.changePermissionCode();
             routeList = (await getMenuList()) as AppRouteRecordRaw[];
             // update-begin----author:sunjianlei---date:20220315------for: 判断是否是 vue3 版本的菜单 ---
-            let hasIndex: boolean = false
-            let hasIcon: boolean = false
+            let hasIndex: boolean = false;
+            let hasIcon: boolean = false;
             for (let menuItem of routeList) {
               // 条件1：判断组件是否是 layouts/default/index
               if (!hasIndex) {
-                hasIndex = menuItem.component === 'layouts/default/index'
+                hasIndex = menuItem.component === 'layouts/default/index';
               }
               // 条件2：判断图标是否带有 冒号
               if (!hasIcon) {
-                hasIcon = !!menuItem.meta?.icon?.includes(':')
+                hasIcon = !!menuItem.meta?.icon?.includes(':');
               }
               // 满足任何一个条件都直接跳出循环
               if (hasIcon || hasIndex) {
-                break
+                break;
               }
             }
             // 两个条件都不满足，就弹出提示框
             if (!hasIcon && !hasIndex) {
               // 延迟1.5秒之后再出现提示，否则提示框出不来
-              setTimeout(() => createWarningModal({
-                title: '提示',
-                content: '检测到你可能使用了<b>非vue3版本</b>的数据库表，这将会导致菜单或其他功能出现异常，请更换成vue3版本的数据库表后刷新。'
-                  + '<br>文档地址：<a href="http://vue3.jeecg.com/2671576" target="_blank">http://vue3.jeecg.com/2671576</a>',
-              }), 1500)
+              setTimeout(
+                () =>
+                  createWarningModal({
+                    title: '提示',
+                    content:
+                      '检测到你可能使用了<b>非vue3版本</b>的数据库表，这将会导致菜单或其他功能出现异常，请更换成vue3版本的数据库表后刷新。' +
+                      '<br>文档地址：<a href="http://vue3.jeecg.com/2671576" target="_blank">http://vue3.jeecg.com/2671576</a>',
+                  }),
+                1500
+              );
             }
             // update-end----author:sunjianlei---date:20220315------for: 判断是否是 vue3 版本的菜单 ---
           } catch (error) {
@@ -263,15 +268,15 @@ export const usePermissionStore = defineStore({
       return routes;
     },
     setAuthData(systemPermission) {
-      this.authList = systemPermission.auth
-      this.allAuthList = systemPermission.allAuth
-      this.sysSafeMode = systemPermission.sysSafeMode
+      this.authList = systemPermission.auth;
+      this.allAuthList = systemPermission.allAuth;
+      this.sysSafeMode = systemPermission.sysSafeMode;
     },
     setAuthList(authList: AuthItem[]) {
-      this.authList = authList
+      this.authList = authList;
     },
     setAllAuthList(authList: AuthItem[]) {
-      this.allAuthList = authList
+      this.allAuthList = authList;
     },
   },
 });
diff --git a/src/store/modules/user.ts b/src/store/modules/user.ts
index e6190f0..c1894af 100644
--- a/src/store/modules/user.ts
+++ b/src/store/modules/user.ts
@@ -1,13 +1,13 @@
-import type { UserInfo,LoginInfo } from '/#/store';
+import type { UserInfo, LoginInfo } from '/#/store';
 import type { ErrorMessageMode } from '/#/axios';
 import { defineStore } from 'pinia';
 import { store } from '/@/store';
 import { RoleEnum } from '/@/enums/roleEnum';
 import { PageEnum } from '/@/enums/pageEnum';
-import { ROLES_KEY, TOKEN_KEY, USER_INFO_KEY,LOGIN_INFO_KEY,DB_DICT_DATA_KEY,TENANT_ID } from '/@/enums/cacheEnum';
+import { ROLES_KEY, TOKEN_KEY, USER_INFO_KEY, LOGIN_INFO_KEY, DB_DICT_DATA_KEY, TENANT_ID } from '/@/enums/cacheEnum';
 import { getAuthCache, setAuthCache } from '/@/utils/auth';
-import { GetUserInfoModel, LoginParams,ThirdLoginParams } from '/@/api/sys/model/userModel';
-import { doLogout, getUserInfo, loginApi,phoneLoginApi,thirdLogin } from '/@/api/sys/user';
+import { GetUserInfoModel, LoginParams, ThirdLoginParams } from '/@/api/sys/model/userModel';
+import { doLogout, getUserInfo, loginApi, phoneLoginApi, thirdLogin } from '/@/api/sys/user';
 import { useI18n } from '/@/hooks/web/useI18n';
 import { useMessage } from '/@/hooks/web/useMessage';
 import { router } from '/@/router';
@@ -16,7 +16,7 @@ import { RouteRecordRaw } from 'vue-router';
 import { PAGE_NOT_FOUND_ROUTE } from '/@/router/routes/basic';
 import { isArray } from '/@/utils/is';
 import { useGlobSetting } from '/@/hooks/setting';
-import {useSso} from '/@/hooks/web/useSso';
+import { useSso } from '/@/hooks/web/useSso';
 interface UserState {
   userInfo: Nullable<UserInfo>;
   token?: string;
@@ -24,7 +24,7 @@ interface UserState {
   dictItems?: [];
   sessionTimeout?: boolean;
   lastUpdateTime: number;
-  tenantid?: string|number;
+  tenantid?: string | number;
   loginInfo?: Nullable<LoginInfo>;
 }
 
@@ -58,7 +58,7 @@ export const useUserStore = defineStore({
     getToken(): string {
       return this.token || getAuthCache<string>(TOKEN_KEY);
     },
-    getAllDictItems(): []{
+    getAllDictItems(): [] {
       return this.dictItems || getAuthCache(DB_DICT_DATA_KEY);
     },
     getRoleList(): RoleEnum[] {
@@ -70,9 +70,9 @@ export const useUserStore = defineStore({
     getLastUpdateTime(): number {
       return this.lastUpdateTime;
     },
-    getTenant(): string|number{
-      return this.tenantid || getAuthCache<string|number>(TENANT_ID);
-    },  
+    getTenant(): string | number {
+      return this.tenantid || getAuthCache<string | number>(TENANT_ID);
+    },
   },
   actions: {
     setToken(info: string | undefined) {
@@ -89,14 +89,14 @@ export const useUserStore = defineStore({
       setAuthCache(USER_INFO_KEY, info);
     },
     setLoginInfo(info: LoginInfo | null) {
-      this.loginInfo = info; 
+      this.loginInfo = info;
       setAuthCache(LOGIN_INFO_KEY, info);
-    },  
+    },
     setAllDictItems(dictItems) {
       this.dictItems = dictItems;
       setAuthCache(DB_DICT_DATA_KEY, dictItems);
     },
-    setTenant(id){
+    setTenant(id) {
       this.tenantid = id;
       setAuthCache(TENANT_ID, id);
       //update-begin---author:liusq  Date:20220102  for：保存用户租户id----
@@ -121,7 +121,7 @@ export const useUserStore = defineStore({
       params: LoginParams & {
         goHome?: boolean;
         mode?: ErrorMessageMode;
-      },
+      }
     ): Promise<GetUserInfoModel | null> {
       try {
         const { goHome = true, mode, ...loginParams } = params;
@@ -129,7 +129,7 @@ export const useUserStore = defineStore({
         const { token } = data;
         // save token
         this.setToken(token);
-        return this.afterLoginAction(goHome,data);
+        return this.afterLoginAction(goHome, data);
       } catch (error) {
         return Promise.reject(error);
       }
@@ -141,7 +141,7 @@ export const useUserStore = defineStore({
       try {
         // save token
         this.setToken(token);
-        return this.afterLoginAction(true,{});
+        return this.afterLoginAction(true, {});
       } catch (error) {
         return Promise.reject(error);
       }
@@ -150,7 +150,7 @@ export const useUserStore = defineStore({
      * 登录完成处理
      * @param goHome
      */
-    async afterLoginAction(goHome?: boolean,data?:any): Promise<any | null> {
+    async afterLoginAction(goHome?: boolean, data?: any): Promise<any | null> {
       if (!this.getToken) return null;
       //获取用户信息
       const userInfo = await this.getUserInfoAction();
@@ -168,7 +168,7 @@ export const useUserStore = defineStore({
           permissionStore.setDynamicAddedRoute(true);
         }
         await this.setLoginInfo(data);
-        goHome && (await router.replace(userInfo && userInfo.homePath || PageEnum.BASE_HOME));
+        goHome && (await router.replace((userInfo && userInfo.homePath) || PageEnum.BASE_HOME));
       }
       return data;
     },
@@ -180,7 +180,7 @@ export const useUserStore = defineStore({
       params: LoginParams & {
         goHome?: boolean;
         mode?: ErrorMessageMode;
-      },
+      }
     ): Promise<GetUserInfoModel | null> {
       try {
         const { goHome = true, mode, ...loginParams } = params;
@@ -188,7 +188,7 @@ export const useUserStore = defineStore({
         const { token } = data;
         // save token
         this.setToken(token);
-        return this.afterLoginAction(goHome,data);
+        return this.afterLoginAction(goHome, data);
       } catch (error) {
         return Promise.reject(error);
       }
@@ -200,8 +200,8 @@ export const useUserStore = defineStore({
       if (!this.getToken) {
         return null;
       }
-      const {userInfo,sysAllDictItems} = await getUserInfo();
-      if(userInfo) {
+      const { userInfo, sysAllDictItems } = await getUserInfo();
+      if (userInfo) {
         const { roles = [] } = userInfo;
         if (isArray(roles)) {
           const roleList = roles.map((item) => item.value) as RoleEnum[];
@@ -217,7 +217,7 @@ export const useUserStore = defineStore({
        * @updateBy:lsq
        * @updateDate:2021-09-08
        */
-      if(sysAllDictItems) {
+      if (sysAllDictItems) {
         this.setAllDictItems(sysAllDictItems);
       }
       return userInfo;
@@ -241,32 +241,32 @@ export const useUserStore = defineStore({
 
       //如果开启单点登录,则跳转到单点统一登录中心
       const openSso = useGlobSetting().openSso;
-      if(openSso=='true'){
+      if (openSso == 'true') {
         await useSso().ssoLoginOut();
       }
 
-      goLogin && await router.push(PageEnum.BASE_LOGIN);
+      goLogin && (await router.push(PageEnum.BASE_LOGIN));
     },
-  /**
-   * 登录事件
-   */
-   async ThirdLogin(
-       params: ThirdLoginParams & {
-           goHome?: boolean;
-           mode?: ErrorMessageMode;
-       },
-      ): Promise<any | null> {
-      try {
-          const { goHome = true, mode, ...ThirdLoginParams } = params;
-          const data = await thirdLogin(ThirdLoginParams, mode);
-          const { token } = data;
-          // save token
-          this.setToken(token);
-          return this.afterLoginAction(goHome,data);
-      } catch (error) {
-          return Promise.reject(error);
+    /**
+     * 登录事件
+     */
+    async ThirdLogin(
+      params: ThirdLoginParams & {
+        goHome?: boolean;
+        mode?: ErrorMessageMode;
       }
-   },
+    ): Promise<any | null> {
+      try {
+        const { goHome = true, mode, ...ThirdLoginParams } = params;
+        const data = await thirdLogin(ThirdLoginParams, mode);
+        const { token } = data;
+        // save token
+        this.setToken(token);
+        return this.afterLoginAction(goHome, data);
+      } catch (error) {
+        return Promise.reject(error);
+      }
+    },
     /**
      * 退出询问
      */
diff --git a/src/utils/auth/index.ts b/src/utils/auth/index.ts
index 38b0d17..b851aa3 100644
--- a/src/utils/auth/index.ts
+++ b/src/utils/auth/index.ts
@@ -1,7 +1,7 @@
 import { Persistent, BasicKeys } from '/@/utils/cache/persistent';
 import { CacheTypeEnum } from '/@/enums/cacheEnum';
 import projectSetting from '/@/settings/projectSetting';
-import { TOKEN_KEY,LOGIN_INFO_KEY,TENANT_ID } from '/@/enums/cacheEnum';
+import { TOKEN_KEY, LOGIN_INFO_KEY, TENANT_ID } from '/@/enums/cacheEnum';
 
 const { permissionCacheType } = projectSetting;
 const isLocal = permissionCacheType === CacheTypeEnum.LOCAL;
diff --git a/src/utils/browser.js b/src/utils/browser.js
index 97f232e..9765f94 100644
--- a/src/utils/browser.js
+++ b/src/utils/browser.js
@@ -1,38 +1,37 @@
 //判断是否IE<11浏览器
 export function isIE() {
-  return navigator.userAgent.indexOf('compatible') > -1 && navigator.userAgent.indexOf('MSIE') > -1
-
+  return navigator.userAgent.indexOf('compatible') > -1 && navigator.userAgent.indexOf('MSIE') > -1;
 }
 
 export function isIE11() {
-  return navigator.userAgent.indexOf('Trident') > -1 && navigator.userAgent.indexOf('rv:11.0') > -1
+  return navigator.userAgent.indexOf('Trident') > -1 && navigator.userAgent.indexOf('rv:11.0') > -1;
 }
 
 //判断是否IE的Edge浏览器
 export function isEdge() {
-  return navigator.userAgent.indexOf('Edge') > -1 && !isIE()
+  return navigator.userAgent.indexOf('Edge') > -1 && !isIE();
 }
 
 export function getIEVersion() {
-  let userAgent = navigator.userAgent //取得浏览器的userAgent字符串
-  let isIE = isIE()
-  let isIE11 = isIE11()
-  let isEdge = isEdge()
+  let userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
+  let isIE = isIE();
+  let isIE11 = isIE11();
+  let isEdge = isEdge();
 
   if (isIE) {
-    let reIE = new RegExp('MSIE (\\d+\\.\\d+);')
-    reIE.test(userAgent)
-    let fIEVersion = parseFloat(RegExp['$1'])
+    let reIE = new RegExp('MSIE (\\d+\\.\\d+);');
+    reIE.test(userAgent);
+    let fIEVersion = parseFloat(RegExp['$1']);
     if (fIEVersion === 7 || fIEVersion === 8 || fIEVersion === 9 || fIEVersion === 10) {
-      return fIEVersion
+      return fIEVersion;
     } else {
-      return 6//IE版本<7
+      return 6; //IE版本<7
     }
   } else if (isEdge) {
-    return 'edge'
+    return 'edge';
   } else if (isIE11) {
-    return 11
+    return 11;
   } else {
-    return -1
+    return -1;
   }
-}
\ No newline at end of file
+}
diff --git a/src/utils/cache/memory.ts b/src/utils/cache/memory.ts
index aceedf4..20622d5 100644
--- a/src/utils/cache/memory.ts
+++ b/src/utils/cache/memory.ts
@@ -1,13 +1,5 @@
-import {
-    TOKEN_KEY,
-    ROLES_KEY,
-    USER_INFO_KEY,
-    DB_DICT_DATA_KEY,
-    TENANT_ID,
-    LOGIN_INFO_KEY,
-    PROJ_CFG_KEY,
-} from '/@/enums/cacheEnum';
-import {  omit } from 'lodash-es';
+import { TOKEN_KEY, ROLES_KEY, USER_INFO_KEY, DB_DICT_DATA_KEY, TENANT_ID, LOGIN_INFO_KEY, PROJ_CFG_KEY } from '/@/enums/cacheEnum';
+import { omit } from 'lodash-es';
 
 export interface Cache<V = any> {
   value?: V;
@@ -104,15 +96,15 @@ export class Memory<T = any, V = any> {
   }
 
   clear() {
-    console.log("------clear------进入clear方法")
+    console.log('------clear------进入clear方法');
     Object.keys(this.cache).forEach((key) => {
       const item = this.cache[key];
       item.timeoutId && clearTimeout(item.timeoutId);
     });
-   //update-begin---author:liusq  Date:20220108  for：不删除登录用户的租户id，其他缓存信息都清除----
+    //update-begin---author:liusq  Date:20220108  for：不删除登录用户的租户id，其他缓存信息都清除----
     this.cache = {
-       ...omit(this.cache, [TOKEN_KEY,USER_INFO_KEY,ROLES_KEY,DB_DICT_DATA_KEY,TENANT_ID,LOGIN_INFO_KEY,PROJ_CFG_KEY]),
+      ...omit(this.cache, [TOKEN_KEY, USER_INFO_KEY, ROLES_KEY, DB_DICT_DATA_KEY, TENANT_ID, LOGIN_INFO_KEY, PROJ_CFG_KEY]),
     };
-  //update-end---author:liusq  Date:20220108  for：不删除登录用户的租户id，其他缓存信息都清除----
+    //update-end---author:liusq  Date:20220108  for：不删除登录用户的租户id，其他缓存信息都清除----
   }
 }
diff --git a/src/utils/cache/persistent.ts b/src/utils/cache/persistent.ts
index 5fe5482..6198d22 100644
--- a/src/utils/cache/persistent.ts
+++ b/src/utils/cache/persistent.ts
@@ -1,21 +1,21 @@
-import type { LockInfo, UserInfo,LoginInfo } from '/#/store';
+import type { LockInfo, UserInfo, LoginInfo } from '/#/store';
 import type { ProjectConfig } from '/#/config';
 import type { RouteLocationNormalized } from 'vue-router';
 
 import { createLocalStorage, createSessionStorage } from '/@/utils/cache';
 import { Memory } from './memory';
 import {
-    TOKEN_KEY,
-    USER_INFO_KEY,
-    ROLES_KEY,
-    LOCK_INFO_KEY,
-    PROJ_CFG_KEY,
-    APP_LOCAL_CACHE_KEY,
-    APP_SESSION_CACHE_KEY,
-    MULTIPLE_TABS_KEY,
-    DB_DICT_DATA_KEY, 
-    TENANT_ID,
-    LOGIN_INFO_KEY,
+  TOKEN_KEY,
+  USER_INFO_KEY,
+  ROLES_KEY,
+  LOCK_INFO_KEY,
+  PROJ_CFG_KEY,
+  APP_LOCAL_CACHE_KEY,
+  APP_SESSION_CACHE_KEY,
+  MULTIPLE_TABS_KEY,
+  DB_DICT_DATA_KEY,
+  TENANT_ID,
+  LOGIN_INFO_KEY,
 } from '/@/enums/cacheEnum';
 import { DEFAULT_CACHE_TIME } from '/@/settings/encryptionSetting';
 import { toRaw } from 'vue';
diff --git a/src/utils/cache/storageCache.ts b/src/utils/cache/storageCache.ts
index 8562665..6237350 100644
--- a/src/utils/cache/storageCache.ts
+++ b/src/utils/cache/storageCache.ts
@@ -12,14 +12,7 @@ export interface CreateStorageParams extends EncryptionParams {
   hasEncrypt: boolean;
   timeout?: Nullable<number>;
 }
-export const createStorage = ({
-  prefixKey = '',
-  storage = sessionStorage,
-  key = cacheCipher.key,
-  iv = cacheCipher.iv,
-  timeout = null,
-  hasEncrypt = true,
-}: Partial<CreateStorageParams> = {}) => {
+export const createStorage = ({ prefixKey = '', storage = sessionStorage, key = cacheCipher.key, iv = cacheCipher.iv, timeout = null, hasEncrypt = true }: Partial<CreateStorageParams> = {}) => {
   if (hasEncrypt && [key.length, iv.length].some((item) => item !== 16)) {
     throw new Error('When hasEncrypt is true, the key or iv must be 16 bits!');
   }
@@ -66,9 +59,7 @@ export const createStorage = ({
         time: Date.now(),
         expire: !isNullOrUnDef(expire) ? new Date().getTime() + expire * 1000 : null,
       });
-      const stringifyValue = this.hasEncrypt
-        ? this.encryption.encryptByAES(stringData)
-        : stringData;
+      const stringifyValue = this.hasEncrypt ? this.encryption.encryptByAES(stringData) : stringData;
       this.storage.setItem(this.getKey(key), stringifyValue);
     }
 
diff --git a/src/utils/color.ts b/src/utils/color.ts
index 99bb89a..37108af 100644
--- a/src/utils/color.ts
+++ b/src/utils/color.ts
@@ -67,10 +67,7 @@ export function colorIsDark(color: string) {
 export function darken(color: string, amount: number) {
   color = color.indexOf('#') >= 0 ? color.substring(1, color.length) : color;
   amount = Math.trunc((255 * amount) / 100);
-  return `#${subtractLight(color.substring(0, 2), amount)}${subtractLight(
-    color.substring(2, 4),
-    amount
-  )}${subtractLight(color.substring(4, 6), amount)}`;
+  return `#${subtractLight(color.substring(0, 2), amount)}${subtractLight(color.substring(2, 4), amount)}${subtractLight(color.substring(4, 6), amount)}`;
 }
 
 /**
@@ -82,10 +79,7 @@ export function darken(color: string, amount: number) {
 export function lighten(color: string, amount: number) {
   color = color.indexOf('#') >= 0 ? color.substring(1, color.length) : color;
   amount = Math.trunc((255 * amount) / 100);
-  return `#${addLight(color.substring(0, 2), amount)}${addLight(
-    color.substring(2, 4),
-    amount
-  )}${addLight(color.substring(4, 6), amount)}`;
+  return `#${addLight(color.substring(0, 2), amount)}${addLight(color.substring(2, 4), amount)}${addLight(color.substring(4, 6), amount)}`;
 }
 
 /* Suma el porcentaje indicado a un color (RR, GG o BB) hexadecimal para aclararlo */
@@ -121,10 +115,7 @@ function luminanace(r: number, g: number, b: number) {
  * @param {string} rgb2 rgb color 2
  */
 function contrast(rgb1: string[], rgb2: number[]) {
-  return (
-    (luminanace(~~rgb1[0], ~~rgb1[1], ~~rgb1[2]) + 0.05) /
-    (luminanace(rgb2[0], rgb2[1], rgb2[2]) + 0.05)
-  );
+  return (luminanace(~~rgb1[0], ~~rgb1[1], ~~rgb1[2]) + 0.05) / (luminanace(rgb2[0], rgb2[1], rgb2[2]) + 0.05);
 }
 
 /**
diff --git a/src/utils/common/compUtils.ts b/src/utils/common/compUtils.ts
index e5694cb..38ec3b4 100644
--- a/src/utils/common/compUtils.ts
+++ b/src/utils/common/compUtils.ts
@@ -1,7 +1,7 @@
-import { useGlobSetting } from '/@/hooks/setting'
-import { merge, random } from 'lodash-es'
-import {isArray} from "/@/utils/is";
-import { FormSchema } from '/@/components/Form'
+import { useGlobSetting } from '/@/hooks/setting';
+import { merge, random } from 'lodash-es';
+import { isArray } from '/@/utils/is';
+import { FormSchema } from '/@/components/Form';
 
 const globSetting = useGlobSetting();
 const baseApiUrl = globSetting.domainUrl;
@@ -10,22 +10,21 @@ const baseApiUrl = globSetting.domainUrl;
  * @param fileUrl 文件路径
  * @param prefix(默认http)  文件路径前缀 http/https
  */
-export const getFileAccessHttpUrl = (fileUrl, prefix='http') => {
+export const getFileAccessHttpUrl = (fileUrl, prefix = 'http') => {
   let result = fileUrl;
   try {
     if (fileUrl && fileUrl.length > 0 && !fileUrl.startsWith(prefix)) {
       //判断是否是数组格式
       let isArray = fileUrl.indexOf('[') != -1;
       if (!isArray) {
-        let prefix = `${baseApiUrl}/sys/common/static/`
+        let prefix = `${baseApiUrl}/sys/common/static/`;
         // 判断是否已包含前缀
         if (!fileUrl.startsWith(prefix)) {
-          result = `${prefix}${fileUrl}`
+          result = `${prefix}${fileUrl}`;
         }
       }
     }
-  } catch (err) {
-  }
+  } catch (err) {}
   return result;
 };
 
@@ -33,17 +32,17 @@ export const getFileAccessHttpUrl = (fileUrl, prefix='http') => {
  * 触发 window.resize
  */
 export function triggerWindowResizeEvent() {
-  let event: any = document.createEvent('HTMLEvents')
-  event.initEvent('resize', true, true)
-  event.eventType = 'message'
-  window.dispatchEvent(event)
+  let event: any = document.createEvent('HTMLEvents');
+  event.initEvent('resize', true, true);
+  event.eventType = 'message';
+  window.dispatchEvent(event);
 }
 
 /**
  * 获取随机数
  *  @param length 数字位数
  */
-export const getRandom = (length:number=1) => {
+export const getRandom = (length: number = 1) => {
   return '-' + parseInt(String(Math.random() * 10000 + 1), length);
 };
 
@@ -54,17 +53,17 @@ export const getRandom = (length:number=1) => {
  * @return string 生成的字符串
  */
 export function randomString(length: number, chats?: string) {
-  if (!length) length = 1
+  if (!length) length = 1;
   if (!chats) {
     // noinspection SpellCheckingInspection
-    chats = '0123456789qwertyuioplkjhgfdsazxcvbnm'
+    chats = '0123456789qwertyuioplkjhgfdsazxcvbnm';
   }
-  let str = ''
+  let str = '';
   for (let i = 0; i < length; i++) {
-    let num = random(0, chats.length - 1)
-    str += chats[num]
+    let num = random(0, chats.length - 1);
+    str += chats[num];
   }
-  return str
+  return str;
 }
 
 /**
@@ -73,7 +72,7 @@ export function randomString(length: number, chats?: string) {
  * @param opt  配置参数
  * @param startPid 父节点
  */
-export const listToTree = (array, opt,startPid) => {
+export const listToTree = (array, opt, startPid) => {
   const obj = {
     primaryKey: opt.primaryKey || 'key',
     parentKey: opt.parentKey || 'parentId',
@@ -81,13 +80,13 @@ export const listToTree = (array, opt,startPid) => {
     startPid: opt.startPid || '',
     currentDept: opt.currentDept || 0,
     maxDept: opt.maxDept || 100,
-    childKey: opt.childKey || 'children'
+    childKey: opt.childKey || 'children',
+  };
+  if (startPid) {
+    obj.startPid = startPid;
   }
-  if(startPid){
-    obj.startPid=startPid;
-  }
-  return toTree(array, obj.startPid, obj.currentDept, obj)
-}
+  return toTree(array, obj.startPid, obj.currentDept, obj);
+};
 /**
  *  递归构建tree
  * @param list
@@ -98,35 +97,36 @@ export const listToTree = (array, opt,startPid) => {
  */
 export const toTree = (array, startPid, currentDept, opt) => {
   if (opt.maxDept < currentDept) {
-    return []
+    return [];
   }
-  let child = []
+  let child = [];
   if (array && array.length > 0) {
-    child = array.map(item => {
-      // 筛查符合条件的数据（主键 = startPid）
-      if (typeof item[opt.parentKey] !== 'undefined' && item[opt.parentKey] === startPid) {
-
-        // 满足条件则递归
-        const nextChild = toTree(array, item[opt.primaryKey], currentDept + 1, opt)
-        // 节点信息保存
-        if (nextChild.length > 0) {
-          item['isLeaf'] = false
-          item[opt.childKey] = nextChild
-        } else {
-          item['isLeaf'] = true
+    child = array
+      .map((item) => {
+        // 筛查符合条件的数据（主键 = startPid）
+        if (typeof item[opt.parentKey] !== 'undefined' && item[opt.parentKey] === startPid) {
+          // 满足条件则递归
+          const nextChild = toTree(array, item[opt.primaryKey], currentDept + 1, opt);
+          // 节点信息保存
+          if (nextChild.length > 0) {
+            item['isLeaf'] = false;
+            item[opt.childKey] = nextChild;
+          } else {
+            item['isLeaf'] = true;
+          }
+          item['title'] = item[opt.titleKey];
+          item['label'] = item[opt.titleKey];
+          item['key'] = item[opt.primaryKey];
+          item['value'] = item[opt.primaryKey];
+          return item;
         }
-        item['title'] = item[opt.titleKey]
-        item['label'] = item[opt.titleKey]
-        item['key'] = item[opt.primaryKey]
-        item['value'] = item[opt.primaryKey]
-        return item
-      }
-    }).filter(item => {
-      return item !== undefined
-    })
+      })
+      .filter((item) => {
+        return item !== undefined;
+      });
   }
-  return child
-}
+  return child;
+};
 
 /**
  * 表格底部合计工具方法
@@ -134,14 +134,14 @@ export const toTree = (array, startPid, currentDept, opt) => {
  * @param fieldKeys 要计算合计的列字段
  */
 export function mapTableTotalSummary(tableData: Recordable[], fieldKeys: string[]) {
-  let totals: any = { _row: '合计', _index: '合计' }
-  fieldKeys.forEach(key => {
+  let totals: any = { _row: '合计', _index: '合计' };
+  fieldKeys.forEach((key) => {
     totals[key] = tableData.reduce((prev, next) => {
-      prev += next[key]
-      return prev
-    }, 0)
-  })
-  return totals
+      prev += next[key];
+      return prev;
+    }, 0);
+  });
+  return totals;
 }
 
 /**
@@ -156,17 +156,17 @@ export function mapTableTotalSummary(tableData: Recordable[], fieldKeys: string[
  * @returns {Function}
  */
 export function simpleDebounce(fn, delay = 100) {
-  let timer: any | null = null
+  let timer: any | null = null;
   return function () {
-    let args = arguments
+    let args = arguments;
     if (timer) {
-      clearTimeout(timer)
+      clearTimeout(timer);
     }
     timer = setTimeout(() => {
       // @ts-ignore
-      fn.apply(this, args)
-    }, delay)
-  }
+      fn.apply(this, args);
+    }, delay);
+  };
 }
 
 /**
@@ -176,10 +176,10 @@ export function simpleDebounce(fn, delay = 100) {
  */
 export function dateFormat(date, block) {
   if (!date) {
-    return ''
+    return '';
   }
-  let format = block || 'yyyy-MM-dd'
-  date = new Date(date)
+  let format = block || 'yyyy-MM-dd';
+  date = new Date(date);
   const map = {
     M: date.getMonth() + 1, // 月份
     d: date.getDate(), // 日
@@ -188,21 +188,24 @@ export function dateFormat(date, block) {
     s: date.getSeconds(), // 秒
     q: Math.floor((date.getMonth() + 3) / 3), // 季度
     S: date.getMilliseconds(), // 毫秒
-  }
+  };
   format = format.replace(/([yMdhmsqS])+/g, (all, t) => {
-    let v = map[t]
+    let v = map[t];
     if (v !== undefined) {
       if (all.length > 1) {
-        v = `0${v}`
-        v = v.substr(v.length - 2)
+        v = `0${v}`;
+        v = v.substr(v.length - 2);
       }
-      return v
+      return v;
     } else if (t === 'y') {
-      return (date.getFullYear().toString()).substr(4 - all.length)
+      return date
+        .getFullYear()
+        .toString()
+        .substr(4 - all.length);
     }
-    return all
-  })
-  return format
+    return all;
+  });
+  return format;
 }
 
 /**
@@ -210,27 +213,27 @@ export function dateFormat(date, block) {
  * 目前使用的地方：JVxeTable Span模式
  */
 export function getEventPath(event) {
-  let target = event.target
-  let path = (event.composedPath && event.composedPath()) || event.path
+  let target = event.target;
+  let path = (event.composedPath && event.composedPath()) || event.path;
 
   if (path != null) {
-    return (path.indexOf(window) < 0) ? path.concat(window) : path
+    return path.indexOf(window) < 0 ? path.concat(window) : path;
   }
 
   if (target === window) {
-    return [window]
+    return [window];
   }
 
   let getParents = (node, memo) => {
-    const parentNode = node.parentNode
+    const parentNode = node.parentNode;
 
     if (!parentNode) {
-      return memo
+      return memo;
     } else {
-      return getParents(parentNode, memo.concat(parentNode))
+      return getParents(parentNode, memo.concat(parentNode));
     }
-  }
-  return [target].concat(getParents(target, []), window)
+  };
+  return [target].concat(getParents(target, []), window);
 }
 
 /**
@@ -242,14 +245,14 @@ export function getEventPath(event) {
  */
 export function pushIfNotExist(array, value, key?) {
   for (let item of array) {
-    if (key && (item[key] === value[key])) {
-      return false
+    if (key && item[key] === value[key]) {
+      return false;
     } else if (item === value) {
-      return false
+      return false;
     }
   }
-  array.push(value)
-  return true
+  array.push(value);
+  return true;
 }
 /**
  * 过滤对象中为空的属性
@@ -261,9 +264,8 @@ export function filterObj(obj) {
     return;
   }
 
-  for ( let key in obj) {
-    if (obj.hasOwnProperty(key)
-      && (obj[key] == null || obj[key] == undefined || obj[key] === '')) {
+  for (let key in obj) {
+    if (obj.hasOwnProperty(key) && (obj[key] == null || obj[key] == undefined || obj[key] === '')) {
       delete obj[key];
     }
   }
@@ -275,7 +277,7 @@ export function filterObj(obj) {
  * @param string
  */
 export function underLine2CamelCase(string: string) {
-  return string.replace(/_([a-z])/g, (_, letter) => letter.toUpperCase())
+  return string.replace(/_([a-z])/g, (_, letter) => letter.toUpperCase());
 }
 
 /**
@@ -290,22 +292,26 @@ export function findTree(treeList: any[], fn: Fn, childrenKey = 'children') {
     if (fn(item, i, treeList)) {
       return item;
     }
-    let children = item[childrenKey]
+    let children = item[childrenKey];
     if (isArray(children)) {
       let findResult = findTree(children, fn, childrenKey);
       if (findResult) {
-        return findResult
+        return findResult;
       }
     }
   }
-  return null
+  return null;
 }
 
 /** 获取 mapFormSchema 方法 */
 export function bindMapFormSchema<T>(spanMap, spanTypeDef: T) {
   return function (s: FormSchema, spanType: T = spanTypeDef) {
-    return merge({
-      disabledLabelWidth: true,
-    } as FormSchema, spanMap[spanType], s)
-  }
+    return merge(
+      {
+        disabledLabelWidth: true,
+      } as FormSchema,
+      spanMap[spanType],
+      s
+    );
+  };
 }
diff --git a/src/utils/common/renderUtils.ts b/src/utils/common/renderUtils.ts
index 3ea1331..0fa193c 100644
--- a/src/utils/common/renderUtils.ts
+++ b/src/utils/common/renderUtils.ts
@@ -1,12 +1,12 @@
 import { h } from 'vue';
-import { Avatar,Tag, Tooltip } from 'ant-design-vue';
+import { Avatar, Tag, Tooltip } from 'ant-design-vue';
 import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
 import { Tinymce } from '/@/components/Tinymce';
 import Icon from '/@/components/Icon';
 import { getDictItemsByCode } from '/@/utils/dict/index';
 import { filterMultiDictText } from '/@/utils/dict/JDictSelectUtil.js';
 import { loadCategoryData } from '/@/api/common/api';
-import {isEmpty} from "/@/utils/is";
+import { isEmpty } from '/@/utils/is';
 
 const render = {
   /**
@@ -15,13 +15,20 @@ const render = {
   renderAvatar: ({ record }) => {
     if (record.avatar) {
       let avatarList = record.avatar.split(',');
-      return h('span', avatarList.map((item) => {
-        return h(Avatar, { src: getFileAccessHttpUrl(item), shape: 'square', size: 'default', style: { marginRight: '5px' } });
-      }));
+      return h(
+        'span',
+        avatarList.map((item) => {
+          return h(Avatar, { src: getFileAccessHttpUrl(item), shape: 'square', size: 'default', style: { marginRight: '5px' } });
+        })
+      );
     } else {
-      return h(Avatar, { shape: 'square', size: 'default' }, {
-        icon: () => h(Icon, { icon: 'ant-design:file-image-outlined', size: 30 }),
-      });
+      return h(
+        Avatar,
+        { shape: 'square', size: 'default' },
+        {
+          icon: () => h(Icon, { icon: 'ant-design:file-image-outlined', size: 30 }),
+        }
+      );
     }
   },
   /**
@@ -30,44 +37,51 @@ const render = {
    * @param code 字典编码
    * @param renderTag 是否使用tag渲染
    */
-  renderDict: (v, code,renderTag=false) => {
+  renderDict: (v, code, renderTag = false) => {
     let text = '';
     let array = getDictItemsByCode(code);
-    let obj = array.filter(item => {
+    let obj = array.filter((item) => {
       return item.value == v;
     });
     if (obj.length > 0) {
       text = obj[0].text;
     }
-    return isEmpty(text)||!renderTag?h('span',text):h(Tag,text)
+    return isEmpty(text) || !renderTag ? h('span', text) : h(Tag, text);
   },
   /**
    * 渲染图片
    * @param text
    */
-  renderImage: ({text}) => {
-    if(!text){
-      return h(Avatar, { shape: 'square', size: 'large' }, {
-        icon: () => h(Icon, { icon: 'ant-design:file-image-outlined', size: 30 }),
-      });
+  renderImage: ({ text }) => {
+    if (!text) {
+      return h(
+        Avatar,
+        { shape: 'square', size: 'large' },
+        {
+          icon: () => h(Icon, { icon: 'ant-design:file-image-outlined', size: 30 }),
+        }
+      );
     }
     let avatarList = text.split(',');
-    return h('span', avatarList.map((item) => {
+    return h(
+      'span',
+      avatarList.map((item) => {
         return h(Avatar, { src: getFileAccessHttpUrl(item), shape: 'square', size: 'large', style: { marginRight: '5px' } });
-    }));
+      })
+    );
   },
   /**
    * 渲染 Tooltip
    * @param text
    * @param len
    */
-  renderTip: (text, len=20) => {
-    if(text){
-      let showText = text+''
-      if(showText.length>len){
-          showText = showText.substr(0, len)+'...'
+  renderTip: (text, len = 20) => {
+    if (text) {
+      let showText = text + '';
+      if (showText.length > len) {
+        showText = showText.substr(0, len) + '...';
       }
-      return h(Tooltip, { title: text }, ()=>showText)
+      return h(Tooltip, { title: text }, () => showText);
     }
     return text;
   },
@@ -75,32 +89,32 @@ const render = {
    * 渲染a标签
    * @param text
    */
-  renderHref: ({text}) => {
-    if(!text){
-      return ''
+  renderHref: ({ text }) => {
+    if (!text) {
+      return '';
     }
-    const len = 20
-    if(text.length>len){
-      text = text.substr(0, len)
+    const len = 20;
+    if (text.length > len) {
+      text = text.substr(0, len);
     }
-    return h('a', { href: text, target: '_blank'}, text)
+    return h('a', { href: text, target: '_blank' }, text);
   },
   /**
    * 根据字典渲染
    * @param v
    * @param array
    */
-  renderDictNative: (v, array,renderTag=false) => {
+  renderDictNative: (v, array, renderTag = false) => {
     let text = '';
     let color = '';
-    let obj = array.filter(item => {
+    let obj = array.filter((item) => {
       return item.value == v;
     });
     if (obj.length > 0) {
       text = obj[0].label;
       color = obj[0].color;
     }
-    return isEmpty(text)||!renderTag?h('span',text):h(Tag, {color},()=>text)
+    return isEmpty(text) || !renderTag ? h('span', text) : h(Tag, { color }, () => text);
   },
   /**
    * 渲染富文本
@@ -117,15 +131,14 @@ const render = {
   },
 
   renderSwitch: (text, arr) => {
-      return text ? filterMultiDictText(arr, text) : '';
+    return text ? filterMultiDictText(arr, text) : '';
   },
   renderCategoryTree: (text, code) => {
-     let array = getDictItemsByCode(code);
-     return filterMultiDictText(array, text);
+    let array = getDictItemsByCode(code);
+    return filterMultiDictText(array, text);
+  },
+  renderTag(text, color) {
+    return isEmpty(text) ? h('span', text) : h(Tag, { color }, () => text);
   },
-  renderTag(text,color){
-      return isEmpty(text)?h('span', text):h(Tag, { color },()=>text)
-  }
-
 };
 export { render };
diff --git a/src/utils/common/vxeUtils.ts b/src/utils/common/vxeUtils.ts
index 1acf9dd..cb164c1 100644
--- a/src/utils/common/vxeUtils.ts
+++ b/src/utils/common/vxeUtils.ts
@@ -1,29 +1,31 @@
-export const VALIDATE_FAILED = Symbol()
+export const VALIDATE_FAILED = Symbol();
 /**
  * 一次性验证主表单和所有的次表单(新版本)
  * @param form 主表单 form 对象
  * @param cases 接收一个数组，每项都是一个JEditableTable实例
  * @returns {Promise<any>}
  */
-export async function validateFormModelAndTables(validate,formData,cases,autoJumpTab?) {
-    if (!(validate && typeof validate === 'function')) {
-        throw `validate 参数需要的是一个方法，而传入的却是${typeof validate}`
-    }
-    let dataMap = {}
-    let values = await new Promise((resolve, reject) => {
-        // 验证主表表单
-        validate().then(()=>{
-            resolve(formData)
-        }).catch(()=>{
-            reject({error: VALIDATE_FAILED})
-        })
-    });
-    Object.assign(dataMap, {formValue: values})
-    // 验证所有子表的表单
-    let subData = await validateTables(cases, autoJumpTab)
-    // 合并最终数据
-    dataMap = Object.assign(dataMap, {tablesValue: subData})
-    return dataMap
+export async function validateFormModelAndTables(validate, formData, cases, autoJumpTab?) {
+  if (!(validate && typeof validate === 'function')) {
+    throw `validate 参数需要的是一个方法，而传入的却是${typeof validate}`;
+  }
+  let dataMap = {};
+  let values = await new Promise((resolve, reject) => {
+    // 验证主表表单
+    validate()
+      .then(() => {
+        resolve(formData);
+      })
+      .catch(() => {
+        reject({ error: VALIDATE_FAILED });
+      });
+  });
+  Object.assign(dataMap, { formValue: values });
+  // 验证所有子表的表单
+  let subData = await validateTables(cases, autoJumpTab);
+  // 合并最终数据
+  dataMap = Object.assign(dataMap, { tablesValue: subData });
+  return dataMap;
 }
 /**
  * 验证并获取一个或多个表格的所有值
@@ -31,59 +33,56 @@ export async function validateFormModelAndTables(validate,formData,cases,autoJum
  * @param autoJumpTab 是否自动跳转到报错的tab
  */
 export function validateTables(cases, autoJumpTab = true) {
-    if (!(cases instanceof Array)) {
-        throw `'validateTables'函数的'cases'参数需要的是一个数组，而传入的却是${typeof cases}`
+  if (!(cases instanceof Array)) {
+    throw `'validateTables'函数的'cases'参数需要的是一个数组，而传入的却是${typeof cases}`;
+  }
+  return new Promise((resolve, reject) => {
+    let tablesData: any = [];
+    let index = 0;
+    if (!cases || cases.length === 0) {
+      resolve(tablesData);
     }
-    return new Promise((resolve, reject) => {
-        let tablesData:any= []
-        let index = 0
-        if (!cases || cases.length === 0) {
-            resolve(tablesData)
+    (function next() {
+      let vm = cases[index];
+      vm.value.validateTable().then((errMap) => {
+        // 校验通过
+        if (!errMap) {
+          tablesData[index] = { tableData: vm.value.getTableData() };
+          // 判断校验是否全部完成，完成返回成功，否则继续进行下一步校验
+          if (++index === cases.length) {
+            resolve(tablesData);
+          } else next();
+        } else {
+          // 尝试获取tabKey，如果在ATab组件内即可获取
+          let paneKey;
+          let tabPane = getVmParentByName(vm.value, 'ATabPane');
+          if (tabPane) {
+            paneKey = tabPane.$.vnode.key;
+            // 自动跳转到该表格
+            if (autoJumpTab) {
+              let tabs = getVmParentByName(tabPane, 'Tabs');
+              tabs && tabs.setActiveKey && tabs.setActiveKey(paneKey);
+            }
+          }
+          // 出现未验证通过的表单，不再进行下一步校验，直接返回失败
+          reject({ error: VALIDATE_FAILED, index, paneKey, errMap });
         }
-        (function next() {
-            let vm = cases[index]
-            vm.value.validateTable().then(errMap => {
-                // 校验通过
-                if (!errMap) {
-                    tablesData[index] = {tableData:vm.value.getTableData()};
-                    // 判断校验是否全部完成，完成返回成功，否则继续进行下一步校验
-                    if (++index === cases.length) {
-                        resolve(tablesData)
-                    } else (
-                        next()
-                    )
-                } else {
-                    // 尝试获取tabKey，如果在ATab组件内即可获取
-                    let paneKey
-                    let tabPane = getVmParentByName(vm.value, 'ATabPane');
-                    if (tabPane) {
-                        paneKey = tabPane.$.vnode.key;
-                        // 自动跳转到该表格
-                        if (autoJumpTab) {
-                            let tabs = getVmParentByName(tabPane, 'Tabs')
-                            tabs && tabs.setActiveKey && tabs.setActiveKey(paneKey)
-                        }
-                    }
-                    // 出现未验证通过的表单，不再进行下一步校验，直接返回失败
-                    reject({error: VALIDATE_FAILED, index, paneKey, errMap})
-                }
-            })
-        })()
-    })
+      });
+    })();
+  });
 }
 
 export function getVmParentByName(vm, name) {
-    let parent = vm.$parent
-    if (parent && parent.$options) {
-        if (parent.$options.name === name) {
-            return parent
-        } else {
-            let res = getVmParentByName(parent, name)
-            if (res) {
-                return res
-            }
-        }
+  let parent = vm.$parent;
+  if (parent && parent.$options) {
+    if (parent.$options.name === name) {
+      return parent;
+    } else {
+      let res = getVmParentByName(parent, name);
+      if (res) {
+        return res;
+      }
     }
-    return null
+  }
+  return null;
 }
-
diff --git a/src/utils/dateUtil.ts b/src/utils/dateUtil.ts
index 902ce0d..b975274 100644
--- a/src/utils/dateUtil.ts
+++ b/src/utils/dateUtil.ts
@@ -6,10 +6,7 @@ import moment from 'moment';
 const DATE_TIME_FORMAT = 'YYYY-MM-DD HH:mm';
 const DATE_FORMAT = 'YYYY-MM-DD ';
 
-export function formatToDateTime(
-    date: moment.MomentInput = undefined,
-    format = DATE_TIME_FORMAT
-): string {
+export function formatToDateTime(date: moment.MomentInput = undefined, format = DATE_TIME_FORMAT): string {
   return moment(date).format(format);
 }
 
diff --git a/src/utils/desform/customExpression.ts b/src/utils/desform/customExpression.ts
index 03a308b..5359ba6 100644
--- a/src/utils/desform/customExpression.ts
+++ b/src/utils/desform/customExpression.ts
@@ -1,30 +1,30 @@
 /*
-*
-* 这里填写用户自定义的表达式
-* 可用在Online表单的默认值表达式中使用
-* 需要外部使用的变量或方法一定要 export，否则无法识别
-* 示例：
-*   export const name = '张三'; // const 是常量
-*   export let age = 17; // 看情况 export const 还是 let ，两者都可正常使用
-*   export function content(arg) { // export 方法，可传参数，使用时要加括号，值一定要return回去，可以返回Promise
-*     return 'content' + arg;
-*   }
-*   export const address = (arg) => content(arg) + ' | 北京市'; // export 箭头函数也可以
-*
-*/
+ *
+ * 这里填写用户自定义的表达式
+ * 可用在Online表单的默认值表达式中使用
+ * 需要外部使用的变量或方法一定要 export，否则无法识别
+ * 示例：
+ *   export const name = '张三'; // const 是常量
+ *   export let age = 17; // 看情况 export const 还是 let ，两者都可正常使用
+ *   export function content(arg) { // export 方法，可传参数，使用时要加括号，值一定要return回去，可以返回Promise
+ *     return 'content' + arg;
+ *   }
+ *   export const address = (arg) => content(arg) + ' | 北京市'; // export 箭头函数也可以
+ *
+ */
 
 /** 字段默认值官方示例：获取地址 */
 export function demoFieldDefVal_getAddress(arg) {
   if (!arg) {
-    arg = '朝阳区'
+    arg = '朝阳区';
   }
-  return `北京市 ${arg}`
+  return `北京市 ${arg}`;
 }
 
 /** 自定义JS函数示例 */
 export function sayHi(name) {
   if (!name) {
-    name = '张三'
+    name = '张三';
   }
-  return `您好，我叫： ${name}`
-}
\ No newline at end of file
+  return `您好，我叫： ${name}`;
+}
diff --git a/src/utils/dict/JDictSelectUtil.js b/src/utils/dict/JDictSelectUtil.js
index 5533319..4ca43ec 100644
--- a/src/utils/dict/JDictSelectUtil.js
+++ b/src/utils/dict/JDictSelectUtil.js
@@ -4,7 +4,7 @@
  * date: 20190109
  */
 
-import {ajaxGetDictItems,getDictItemsByCode} from './index'
+import { ajaxGetDictItems, getDictItemsByCode } from './index';
 
 /**
  * 获取字典数组
@@ -16,8 +16,8 @@ export async function initDictOptions(dictCode) {
     return '字典Code不能为空!';
   }
   //优先从缓存中读取字典配置
-  if(getDictItemsByCode(dictCode)){
-    let res = {}
+  if (getDictItemsByCode(dictCode)) {
+    let res = {};
     res.result = getDictItemsByCode(dictCode);
     res.success = true;
     return res;
@@ -36,27 +36,27 @@ export async function initDictOptions(dictCode) {
 export function filterDictText(dictOptions, text) {
   // --update-begin----author:sunjianlei---date:20200323------for: 字典翻译 text 允许逗号分隔 ---
   if (text != null && Array.isArray(dictOptions)) {
-    let result = []
+    let result = [];
     // 允许多个逗号分隔，允许传数组对象
-    let splitText
+    let splitText;
     if (Array.isArray(text)) {
-      splitText = text
+      splitText = text;
     } else {
-      splitText = text.toString().trim().split(',')
+      splitText = text.toString().trim().split(',');
     }
     for (let txt of splitText) {
-      let dictText = txt
+      let dictText = txt;
       for (let dictItem of dictOptions) {
         if (txt.toString() === dictItem.value.toString()) {
-          dictText = (dictItem.text || dictItem.title || dictItem.label)
-          break
+          dictText = dictItem.text || dictItem.title || dictItem.label;
+          break;
         }
       }
-      result.push(dictText)
+      result.push(dictText);
     }
-    return result.join(',')
+    return result.join(',');
   }
-  return text
+  return text;
   // --update-end----author:sunjianlei---date:20200323------for: 字典翻译 text 允许逗号分隔 ---
 }
 
@@ -68,36 +68,36 @@ export function filterDictText(dictOptions, text) {
  */
 export function filterMultiDictText(dictOptions, text) {
   //js “!text” 认为0为空，所以做提前处理
-  if(text === 0 || text === '0'){
-    if(dictOptions){
+  if (text === 0 || text === '0') {
+    if (dictOptions) {
       for (let dictItem of dictOptions) {
         if (text == dictItem.value) {
-          return dictItem.text
+          return dictItem.text;
         }
       }
     }
   }
 
-  if(!text || text=='undefined' || text=='null' || !dictOptions || dictOptions.length==0){
-    return ""
+  if (!text || text == 'undefined' || text == 'null' || !dictOptions || dictOptions.length == 0) {
+    return '';
   }
-  let re = "";
-  text = text.toString()
-  let arr = text.split(",")
+  let re = '';
+  text = text.toString();
+  let arr = text.split(',');
   dictOptions.forEach(function (option) {
-    if(option){
-      for(let i=0;i<arr.length;i++){
+    if (option) {
+      for (let i = 0; i < arr.length; i++) {
         if (arr[i] === option.value) {
-          re += option.text+",";
+          re += option.text + ',';
           break;
         }
       }
     }
   });
-  if(re==""){
+  if (re == '') {
     return text;
   }
-  return re.substring(0,re.length-1);
+  return re.substring(0, re.length - 1);
 }
 
 /**
@@ -106,41 +106,43 @@ export function filterMultiDictText(dictOptions, text) {
  * @returns string
  */
 export function filterDictTextByCache(dictCode, key) {
-  if(key==null ||key.length==0){
+  if (key == null || key.length == 0) {
     return;
   }
   if (!dictCode) {
     return '字典Code不能为空!';
   }
-   //优先从缓存中读取字典配置
-  if(getDictItemsByCode(dictCode)){
-    let item = getDictItemsByCode(dictCode).filter(t => t["value"] == key)
-    if(item && item.length>0){
-      return item[0]["text"]
+  //优先从缓存中读取字典配置
+  if (getDictItemsByCode(dictCode)) {
+    let item = getDictItemsByCode(dictCode).filter((t) => t['value'] == key);
+    if (item && item.length > 0) {
+      return item[0]['text'];
     }
   }
 }
 
 /** 通过code获取字典数组 */
 export async function getDictItems(dictCode, params) {
-    //优先从缓存中读取字典配置
-    if(getDictItemsByCode(dictCode)){
-      let desformDictItems = getDictItemsByCode(dictCode).map(item => ({...item, label: item.text}))
-      return desformDictItems;
-    }
+  //优先从缓存中读取字典配置
+  if (getDictItemsByCode(dictCode)) {
+    let desformDictItems = getDictItemsByCode(dictCode).map((item) => ({ ...item, label: item.text }));
+    return desformDictItems;
+  }
 
-    //缓存中没有，就请求后台
-    return await ajaxGetDictItems(dictCode, params).then(({success, result}) => {
+  //缓存中没有，就请求后台
+  return await ajaxGetDictItems(dictCode, params)
+    .then(({ success, result }) => {
       if (success) {
-        let res = result.map(item => ({...item, label: item.text}))
-        console.log('------- 从DB中获取到了字典-------dictCode : ', dictCode, res)
-        return Promise.resolve(res)
+        let res = result.map((item) => ({ ...item, label: item.text }));
+        console.log('------- 从DB中获取到了字典-------dictCode : ', dictCode, res);
+        return Promise.resolve(res);
       } else {
-        console.error('getDictItems error: : ', res)
-        return Promise.resolve([])
+        console.error('getDictItems error: : ', res);
+        return Promise.resolve([]);
       }
-    }).catch((res) => {
-      console.error('getDictItems error: ', res)
-      return Promise.resolve([])
     })
+    .catch((res) => {
+      console.error('getDictItems error: ', res);
+      return Promise.resolve([]);
+    });
 }
diff --git a/src/utils/dict/index.ts b/src/utils/dict/index.ts
index b086f3b..578e3d1 100644
--- a/src/utils/dict/index.ts
+++ b/src/utils/dict/index.ts
@@ -1,30 +1,30 @@
-import {getAuthCache} from "/@/utils/auth";
-import {DB_DICT_DATA_KEY} from "/@/enums/cacheEnum";
-import {defHttp} from "/@/utils/http/axios";
+import { getAuthCache } from '/@/utils/auth';
+import { DB_DICT_DATA_KEY } from '/@/enums/cacheEnum';
+import { defHttp } from '/@/utils/http/axios';
 
 /**
  * 从缓存中获取字典配置
  * @param code
  */
-export const getDictItemsByCode= (code) =>  {
+export const getDictItemsByCode = (code) => {
   if (getAuthCache(DB_DICT_DATA_KEY) && getAuthCache(DB_DICT_DATA_KEY)[code]) {
     return getAuthCache(DB_DICT_DATA_KEY)[code];
   }
-}
+};
 /**
  * 获取字典数组
  * @param dictCode 字典Code
  * @return List<Map>
  */
-export const initDictOptions = (code) =>{
+export const initDictOptions = (code) => {
   //1.优先从缓存中读取字典配置
-  if(getDictItemsByCode(code)){
+  if (getDictItemsByCode(code)) {
     return new Promise((resolve, reject) => {
-      resolve(getDictItemsByCode(code))
-    })
+      resolve(getDictItemsByCode(code));
+    });
   }
   //2.获取字典数组
-  return defHttp.get({url: `/sys/dict/getDictItems/${code}`});
+  return defHttp.get({ url: `/sys/dict/getDictItems/${code}` });
 };
 /**
  * 获取字典数组
@@ -32,4 +32,4 @@ export const initDictOptions = (code) =>{
  * @param params 查询参数
  * @return List<Map>
  */
-export const ajaxGetDictItems = (code, params)=>defHttp.get({url:`/sys/dict/getDictItems/${code}`,params});
+export const ajaxGetDictItems = (code, params) => defHttp.get({ url: `/sys/dict/getDictItems/${code}`, params });
diff --git a/src/utils/domUtils.ts b/src/utils/domUtils.ts
index 126a114..6062950 100644
--- a/src/utils/domUtils.ts
+++ b/src/utils/domUtils.ts
@@ -133,22 +133,14 @@ export function hackCss(attr: string, value: string) {
 }
 
 /* istanbul ignore next */
-export function on(
-  element: Element | HTMLElement | Document | Window,
-  event: string,
-  handler: EventListenerOrEventListenerObject
-): void {
+export function on(element: Element | HTMLElement | Document | Window, event: string, handler: EventListenerOrEventListenerObject): void {
   if (element && event && handler) {
     element.addEventListener(event, handler, false);
   }
 }
 
 /* istanbul ignore next */
-export function off(
-  element: Element | HTMLElement | Document | Window,
-  event: string,
-  handler: Fn
-): void {
+export function off(element: Element | HTMLElement | Document | Window, event: string, handler: Fn): void {
   if (element && event && handler) {
     element.removeEventListener(event, handler, false);
   }
diff --git a/src/utils/encryption/signMd5Utils.js b/src/utils/encryption/signMd5Utils.js
index d42b837..6f13978 100644
--- a/src/utils/encryption/signMd5Utils.js
+++ b/src/utils/encryption/signMd5Utils.js
@@ -1,6 +1,6 @@
-import md5 from 'md5'
+import md5 from 'md5';
 //签名密钥串(前后端要一致，正式发布请自行修改)
-const signatureSecret = "dd05f1c54d63749eda95f9fa6d49v442a";
+const signatureSecret = 'dd05f1c54d63749eda95f9fa6d49v442a';
 
 export default class signMd5Utils {
   /**
@@ -23,7 +23,6 @@ export default class signMd5Utils {
     return sortObj;
   }
 
-
   /**
    * @param url 请求的url,应该包含请求参数(url的?后面的参数)
    * @param requestParams 请求参数(POST的JSON参数)
@@ -50,19 +49,20 @@ export default class signMd5Utils {
     // 获取URL上最后带逗号的参数变量 sys/dict/getDictItems/sys_user,realname,username
     //【这边条件没有encode】带条件参数例子：/sys/dict/getDictItems/sys_user,realname,id,username!='admin'%20order%20by%20create_time
     let lastpathVariable = url.substring(url.lastIndexOf('/') + 1);
-    if(lastpathVariable.includes(",")){
-      if(lastpathVariable.includes("?")){
-        lastpathVariable = lastpathVariable.substring(0, lastpathVariable.indexOf("?"));
+    if (lastpathVariable.includes(',')) {
+      if (lastpathVariable.includes('?')) {
+        lastpathVariable = lastpathVariable.substring(0, lastpathVariable.indexOf('?'));
       }
       //解决Sign 签名校验失败 #2728
-      result["x-path-variable"] = decodeURI(lastpathVariable);
+      result['x-path-variable'] = decodeURI(lastpathVariable);
     }
     if (urlArray && urlArray[1]) {
-      let paramString = urlArray[1], paramResult;
+      let paramString = urlArray[1],
+        paramResult;
       while ((paramResult = paramReg.exec(paramString)) != null) {
         //数字值转为string类型，前后端加密规则保持一致
-        if(this.myIsNaN(paramResult[2])){
-          paramResult[2] = paramResult[2].toString()
+        if (this.myIsNaN(paramResult[2])) {
+          paramResult[2] = paramResult[2].toString();
         }
         result[paramResult[1]] = paramResult[2];
       }
@@ -78,8 +78,8 @@ export default class signMd5Utils {
       for (let key in objectTwo) {
         if (objectTwo.hasOwnProperty(key) === true) {
           //数字值转为string类型，前后端加密规则保持一致
-          if(this.myIsNaN(objectTwo[key])){
-            objectTwo[key] = objectTwo[key].toString()
+          if (this.myIsNaN(objectTwo[key])) {
+            objectTwo[key] = objectTwo[key].toString();
           }
           objectOne[key] = objectTwo[key];
         }
@@ -91,9 +91,9 @@ export default class signMd5Utils {
   static urlEncode(param, key, encode) {
     if (param == null) return '';
     let paramStr = '';
-    let t = typeof (param);
+    let t = typeof param;
     if (t == 'string' || t == 'number' || t == 'boolean') {
-      paramStr += '&' + key + '=' + ((encode == null || encode) ? encodeURIComponent(param) : param);
+      paramStr += '&' + key + '=' + (encode == null || encode ? encodeURIComponent(param) : param);
     } else {
       for (let i in param) {
         let k = key == null ? i : key + (param instanceof Array ? '[' + i + ']' : '.' + i);
@@ -101,14 +101,14 @@ export default class signMd5Utils {
       }
     }
     return paramStr;
-  };
+  }
 
   /**
    * 接口签名用 生成header中的时间戳
    * @returns {number}
    */
-  static getTimestamp(){
-    return new Date().getTime()
+  static getTimestamp() {
+    return new Date().getTime();
   }
 
   // static getDateTimeToString() {
@@ -128,9 +128,8 @@ export default class signMd5Utils {
   //   if (msecs < 10) secs = '0' + msecs
   //   return year + '' + month + '' + day + '' + hours + '' + mins + '' + secs
   // }
-    // true:数值型的，false：非数值型
+  // true:数值型的，false：非数值型
   static myIsNaN(value) {
     return typeof value === 'number' && !isNaN(value);
   }
-
 }
diff --git a/src/utils/file/download.ts b/src/utils/file/download.ts
index fd519ae..168e235 100644
--- a/src/utils/file/download.ts
+++ b/src/utils/file/download.ts
@@ -58,15 +58,7 @@ export function downloadByData(data: BlobPart, filename: string, mime?: string,
  * Download file according to file address
  * @param {*} sUrl
  */
-export function downloadByUrl({
-  url,
-  target = '_blank',
-  fileName,
-}: {
-  url: string;
-  target?: TargetContext;
-  fileName?: string;
-}): boolean {
+export function downloadByUrl({ url, target = '_blank', fileName }: { url: string; target?: TargetContext; fileName?: string }): boolean {
   const isChrome = window.navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
   const isSafari = window.navigator.userAgent.toLowerCase().indexOf('safari') > -1;
 
diff --git a/src/utils/helper/treeHelper.ts b/src/utils/helper/treeHelper.ts
index f77faff..77fef5f 100644
--- a/src/utils/helper/treeHelper.ts
+++ b/src/utils/helper/treeHelper.ts
@@ -40,11 +40,7 @@ export function treeToList<T = any>(tree: any, config: Partial<TreeHelperConfig>
   return result;
 }
 
-export function findNode<T = any>(
-  tree: any,
-  func: Fn,
-  config: Partial<TreeHelperConfig> = {}
-): T | null {
+export function findNode<T = any>(tree: any, func: Fn, config: Partial<TreeHelperConfig> = {}): T | null {
   config = getConfig(config);
   const { children } = config;
   const list = [...tree];
@@ -55,11 +51,7 @@ export function findNode<T = any>(
   return null;
 }
 
-export function findNodeAll<T = any>(
-  tree: any,
-  func: Fn,
-  config: Partial<TreeHelperConfig> = {}
-): T[] {
+export function findNodeAll<T = any>(tree: any, func: Fn, config: Partial<TreeHelperConfig> = {}): T[] {
   config = getConfig(config);
   const { children } = config;
   const list = [...tree];
@@ -71,11 +63,7 @@ export function findNodeAll<T = any>(
   return result;
 }
 
-export function findPath<T = any>(
-  tree: any,
-  func: Fn,
-  config: Partial<TreeHelperConfig> = {}
-): T | T[] | null {
+export function findPath<T = any>(tree: any, func: Fn, config: Partial<TreeHelperConfig> = {}): T | T[] | null {
   config = getConfig(config);
   const path: T[] = [];
   const list = [...tree];
@@ -120,11 +108,7 @@ export function findPathAll(tree: any, func: Fn, config: Partial<TreeHelperConfi
   return result;
 }
 
-export function filter<T = any>(
-  tree: T[],
-  func: (n: T) => boolean,
-  config: Partial<TreeHelperConfig> = {}
-): T[] {
+export function filter<T = any>(tree: T[], func: (n: T) => boolean, config: Partial<TreeHelperConfig> = {}): T[] {
   config = getConfig(config);
   const children = config.children as string;
   function listFilter(list: T[]) {
@@ -138,11 +122,7 @@ export function filter<T = any>(
   return listFilter(tree);
 }
 
-export function forEach<T = any>(
-  tree: T[],
-  func: (n: T) => any,
-  config: Partial<TreeHelperConfig> = {}
-): void {
+export function forEach<T = any>(tree: T[], func: (n: T) => any, config: Partial<TreeHelperConfig> = {}): void {
   config = getConfig(config);
   const list: any[] = [...tree];
   const { children } = config;
@@ -165,10 +145,7 @@ export function treeMap<T = any>(treeData: T[], opt: { children?: string; conver
 /**
  * @description: Extract tree specified structure
  */
-export function treeMapEach(
-  data: any,
-  { children = 'children', conversion }: { children?: string; conversion: Fn }
-) {
+export function treeMapEach(data: any, { children = 'children', conversion }: { children?: string; conversion: Fn }) {
   const haveChildren = Array.isArray(data[children]) && data[children].length > 0;
   const conversionData = conversion(data) || {};
   if (haveChildren) {
diff --git a/src/utils/helper/validator.ts b/src/utils/helper/validator.ts
index 33fa64a..9deb52e 100644
--- a/src/utils/helper/validator.ts
+++ b/src/utils/helper/validator.ts
@@ -1,5 +1,5 @@
-import {dateUtil} from '/@/utils/dateUtil';
-import {duplicateCheck} from "/@/views/system/user/user.api";
+import { dateUtil } from '/@/utils/dateUtil';
+import { duplicateCheck } from '/@/views/system/user/user.api';
 
 export const rules = {
   rule(type, required) {
@@ -18,7 +18,10 @@ export const rules = {
           if (required == true && !value) {
             return Promise.reject('请输入邮箱!');
           }
-          if (value && !new RegExp(/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/).test(value)) {
+          if (
+            value &&
+            !new RegExp(/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/).test(value)
+          ) {
             return Promise.reject('请输入正确邮箱格式!');
           }
           return Promise.resolve();
@@ -42,7 +45,7 @@ export const rules = {
         },
         trigger: 'change',
       },
-    ]
+    ];
   },
   startTime(endTime, required) {
     return [
@@ -78,7 +81,7 @@ export const rules = {
       },
     ];
   },
-  confirmPassword(values,required){
+  confirmPassword(values, required) {
     return [
       {
         required: required ? required : false,
@@ -94,7 +97,7 @@ export const rules = {
       },
     ];
   },
-  duplicateCheckRule(tableName,fieldName,model,schema, required) {
+  duplicateCheckRule(tableName, fieldName, model, schema, required) {
     return [
       {
         required: required,
@@ -111,15 +114,13 @@ export const rules = {
             })
               .then((res) => {
                 res.success ? resolve() : reject(res.message || '校验失败');
-              }).catch((err) => {
-              reject(err.message || '验证失败');
-            });
+              })
+              .catch((err) => {
+                reject(err.message || '验证失败');
+              });
           });
         },
       },
     ] as ArrayRule;
   },
 };
-
-
-
diff --git a/src/utils/http/axios/Axios.ts b/src/utils/http/axios/Axios.ts
index 7aaff3c..d24241a 100644
--- a/src/utils/http/axios/Axios.ts
+++ b/src/utils/http/axios/Axios.ts
@@ -1,131 +1,119 @@
-import type {AxiosRequestConfig, AxiosInstance, AxiosResponse, AxiosError} from 'axios';
-import type { RequestOptions, Result, UploadFileParams,UploadFileCallBack } from '/#/axios';
-import type {CreateAxiosOptions} from './axiosTransform';
+import type { AxiosRequestConfig, AxiosInstance, AxiosResponse, AxiosError } from 'axios';
+import type { RequestOptions, Result, UploadFileParams, UploadFileCallBack } from '/#/axios';
+import type { CreateAxiosOptions } from './axiosTransform';
 import axios from 'axios';
 import qs from 'qs';
-import {AxiosCanceler} from './axiosCancel';
-import {isFunction} from '/@/utils/is';
+import { AxiosCanceler } from './axiosCancel';
+import { isFunction } from '/@/utils/is';
 import { cloneDeep } from 'lodash-es';
-import {ContentTypeEnum} from '/@/enums/httpEnum';
-import {RequestEnum} from '/@/enums/httpEnum';
-import {useGlobSetting} from '/@/hooks/setting';
-import {useMessage} from "/@/hooks/web/useMessage";
+import { ContentTypeEnum } from '/@/enums/httpEnum';
+import { RequestEnum } from '/@/enums/httpEnum';
+import { useGlobSetting } from '/@/hooks/setting';
+import { useMessage } from '/@/hooks/web/useMessage';
 
-const {createMessage} = useMessage();
+const { createMessage } = useMessage();
 export * from './axiosTransform';
 
 /**
  * @description:  axios module
  */
 export class VAxios {
-	private axiosInstance: AxiosInstance;
-	private readonly options: CreateAxiosOptions;
+  private axiosInstance: AxiosInstance;
+  private readonly options: CreateAxiosOptions;
 
-	constructor(options: CreateAxiosOptions) {
-		this.options = options;
-		this.axiosInstance = axios.create(options);
-		this.setupInterceptors();
-	}
+  constructor(options: CreateAxiosOptions) {
+    this.options = options;
+    this.axiosInstance = axios.create(options);
+    this.setupInterceptors();
+  }
 
-	/**
-	 * @description:  Create axios instance
-	 */
-	private createAxios(config: CreateAxiosOptions): void {
-		this.axiosInstance = axios.create(config);
-	}
+  /**
+   * @description:  Create axios instance
+   */
+  private createAxios(config: CreateAxiosOptions): void {
+    this.axiosInstance = axios.create(config);
+  }
 
-	private getTransform() {
-		const {transform} = this.options;
-		return transform;
-	}
+  private getTransform() {
+    const { transform } = this.options;
+    return transform;
+  }
 
-	getAxios(): AxiosInstance {
-		return this.axiosInstance;
-	}
+  getAxios(): AxiosInstance {
+    return this.axiosInstance;
+  }
 
-	/**
-	 * @description: Reconfigure axios
-	 */
-	configAxios(config: CreateAxiosOptions) {
-		if (!this.axiosInstance) {
-			return;
-		}
-		this.createAxios(config);
-	}
+  /**
+   * @description: Reconfigure axios
+   */
+  configAxios(config: CreateAxiosOptions) {
+    if (!this.axiosInstance) {
+      return;
+    }
+    this.createAxios(config);
+  }
 
-	/**
-	 * @description: Set general header
-	 */
-	setHeader(headers: any): void {
-		if (!this.axiosInstance) {
-			return;
-		}
-		Object.assign(this.axiosInstance.defaults.headers, headers);
-	}
+  /**
+   * @description: Set general header
+   */
+  setHeader(headers: any): void {
+    if (!this.axiosInstance) {
+      return;
+    }
+    Object.assign(this.axiosInstance.defaults.headers, headers);
+  }
 
-	/**
-	 * @description: Interceptor configuration
-	 */
-	private setupInterceptors() {
-		const transform = this.getTransform();
-		if (!transform) {
-			return;
-		}
-		const {
-			requestInterceptors,
-			requestInterceptorsCatch,
-			responseInterceptors,
-			responseInterceptorsCatch,
-		} = transform;
+  /**
+   * @description: Interceptor configuration
+   */
+  private setupInterceptors() {
+    const transform = this.getTransform();
+    if (!transform) {
+      return;
+    }
+    const { requestInterceptors, requestInterceptorsCatch, responseInterceptors, responseInterceptorsCatch } = transform;
 
-		const axiosCanceler = new AxiosCanceler();
+    const axiosCanceler = new AxiosCanceler();
 
-		// 请求侦听器配置处理
-		this.axiosInstance.interceptors.request.use((config: AxiosRequestConfig) => {
-			// If cancel repeat request is turned on, then cancel repeat request is prohibited
-			const {
-				headers: {ignoreCancelToken},
-			} = config;
+    // 请求侦听器配置处理
+    this.axiosInstance.interceptors.request.use((config: AxiosRequestConfig) => {
+      // If cancel repeat request is turned on, then cancel repeat request is prohibited
+      const {
+        headers: { ignoreCancelToken },
+      } = config;
 
-			const ignoreCancel =
-				ignoreCancelToken !== undefined
-					? ignoreCancelToken
-					: this.options.requestOptions?.ignoreCancelToken;
+      const ignoreCancel = ignoreCancelToken !== undefined ? ignoreCancelToken : this.options.requestOptions?.ignoreCancelToken;
 
-			!ignoreCancel && axiosCanceler.addPending(config);
-			if (requestInterceptors && isFunction(requestInterceptors)) {
-				config = requestInterceptors(config, this.options);
-			}
-			return config;
-		}, undefined);
+      !ignoreCancel && axiosCanceler.addPending(config);
+      if (requestInterceptors && isFunction(requestInterceptors)) {
+        config = requestInterceptors(config, this.options);
+      }
+      return config;
+    }, undefined);
 
-		// 请求拦截器错误捕获
-		requestInterceptorsCatch &&
-		isFunction(requestInterceptorsCatch) &&
-		this.axiosInstance.interceptors.request.use(undefined, requestInterceptorsCatch);
+    // 请求拦截器错误捕获
+    requestInterceptorsCatch && isFunction(requestInterceptorsCatch) && this.axiosInstance.interceptors.request.use(undefined, requestInterceptorsCatch);
 
-		// 响应结果拦截器处理
-		this.axiosInstance.interceptors.response.use((res: AxiosResponse<any>) => {
-			res && axiosCanceler.removePending(res.config);
-			if (responseInterceptors && isFunction(responseInterceptors)) {
-				res = responseInterceptors(res);
-			}
-			return res;
-		}, undefined);
+    // 响应结果拦截器处理
+    this.axiosInstance.interceptors.response.use((res: AxiosResponse<any>) => {
+      res && axiosCanceler.removePending(res.config);
+      if (responseInterceptors && isFunction(responseInterceptors)) {
+        res = responseInterceptors(res);
+      }
+      return res;
+    }, undefined);
 
-		// 响应结果拦截器错误捕获
-		responseInterceptorsCatch &&
-		isFunction(responseInterceptorsCatch) &&
-		this.axiosInstance.interceptors.response.use(undefined, responseInterceptorsCatch);
-	}
+    // 响应结果拦截器错误捕获
+    responseInterceptorsCatch && isFunction(responseInterceptorsCatch) && this.axiosInstance.interceptors.response.use(undefined, responseInterceptorsCatch);
+  }
 
-	/**
-	 * 文件上传
-	 */
-    //--@updateBy-begin----author:liusq---date:20211117------for:增加上传回调参数callback------
-	uploadFile<T = any>(config: AxiosRequestConfig, params: UploadFileParams,callback?:UploadFileCallBack) {
+  /**
+   * 文件上传
+   */
+  //--@updateBy-begin----author:liusq---date:20211117------for:增加上传回调参数callback------
+  uploadFile<T = any>(config: AxiosRequestConfig, params: UploadFileParams, callback?: UploadFileCallBack) {
     //--@updateBy-end----author:liusq---date:20211117------for:增加上传回调参数callback------
-		const formData = new window.FormData();
+    const formData = new window.FormData();
     const customFilename = params.name || 'file';
 
     if (params.filename) {
@@ -133,128 +121,126 @@ export class VAxios {
     } else {
       formData.append(customFilename, params.file);
     }
-		const glob = useGlobSetting();
-		config.baseURL = glob.uploadUrl;
-		if (params.data) {
-			Object.keys(params.data).forEach((key) => {
+    const glob = useGlobSetting();
+    config.baseURL = glob.uploadUrl;
+    if (params.data) {
+      Object.keys(params.data).forEach((key) => {
         const value = params.data![key];
-				if (Array.isArray(value)) {
-					value.forEach((item) => {
-						formData.append(`${key}[]`, item);
-					});
-					return;
-				}
+        if (Array.isArray(value)) {
+          value.forEach((item) => {
+            formData.append(`${key}[]`, item);
+          });
+          return;
+        }
 
-				formData.append(key, params.data[key]);
-			});
-		}
+        formData.append(key, params.data[key]);
+      });
+    }
 
-		return this.axiosInstance.request<T>({
-			...config,
-			method: 'POST',
-			data: formData,
-			headers: {
-				'Content-type': ContentTypeEnum.FORM_DATA,
-				ignoreCancelToken: true,
-			},
-		}).then((res:any) => {
-            //--@updateBy-begin----author:liusq---date:20210914------for:上传判断是否包含回调方法------
-             if(callback?.success && isFunction(callback?.success)){
-                 callback?.success(res?.data)
-            //--@updateBy-end----author:liusq---date:20210914------for:上传判断是否包含回调方法------
-             }else if(callback?.isReturnResponse){
-              //--@updateBy-begin----author:liusq---date:20211117------for:上传判断是否返回res信息------  
-                return Promise.resolve(res?.data)
-              //--@updateBy-end----author:liusq---date:20211117------for:上传判断是否返回res信息------
-             }else{
-              if (res.data.success == true && res.data.code == 200) {
-                  createMessage.success(res.data.message)
-              } else {
-                  createMessage.error(res.data.message);
-              }
+    return this.axiosInstance
+      .request<T>({
+        ...config,
+        method: 'POST',
+        data: formData,
+        headers: {
+          'Content-type': ContentTypeEnum.FORM_DATA,
+          ignoreCancelToken: true,
+        },
+      })
+      .then((res: any) => {
+        //--@updateBy-begin----author:liusq---date:20210914------for:上传判断是否包含回调方法------
+        if (callback?.success && isFunction(callback?.success)) {
+          callback?.success(res?.data);
+          //--@updateBy-end----author:liusq---date:20210914------for:上传判断是否包含回调方法------
+        } else if (callback?.isReturnResponse) {
+          //--@updateBy-begin----author:liusq---date:20211117------for:上传判断是否返回res信息------
+          return Promise.resolve(res?.data);
+          //--@updateBy-end----author:liusq---date:20211117------for:上传判断是否返回res信息------
+        } else {
+          if (res.data.success == true && res.data.code == 200) {
+            createMessage.success(res.data.message);
+          } else {
+            createMessage.error(res.data.message);
           }
-		});
-	}
+        }
+      });
+  }
 
-	// 支持表单数据
-	supportFormData(config: AxiosRequestConfig) {
-		const headers = config.headers || this.options.headers;
-		const contentType = headers?.['Content-Type'] || headers?.['content-type'];
+  // 支持表单数据
+  supportFormData(config: AxiosRequestConfig) {
+    const headers = config.headers || this.options.headers;
+    const contentType = headers?.['Content-Type'] || headers?.['content-type'];
 
-		if (
-			contentType !== ContentTypeEnum.FORM_URLENCODED ||
-			!Reflect.has(config, 'data') ||
-			config.method?.toUpperCase() === RequestEnum.GET
-		) {
-			return config;
-		}
+    if (contentType !== ContentTypeEnum.FORM_URLENCODED || !Reflect.has(config, 'data') || config.method?.toUpperCase() === RequestEnum.GET) {
+      return config;
+    }
 
-		return {
-			...config,
-			data: qs.stringify(config.data, {arrayFormat: 'brackets'}),
-		};
-	}
+    return {
+      ...config,
+      data: qs.stringify(config.data, { arrayFormat: 'brackets' }),
+    };
+  }
 
-	get<T = any>(config: AxiosRequestConfig, options?: RequestOptions): Promise<T> {
-		return this.request({...config, method: 'GET'}, options);
-	}
+  get<T = any>(config: AxiosRequestConfig, options?: RequestOptions): Promise<T> {
+    return this.request({ ...config, method: 'GET' }, options);
+  }
 
-	post<T = any>(config: AxiosRequestConfig, options?: RequestOptions): Promise<T> {
-		return this.request({...config, method: 'POST'}, options);
-	}
+  post<T = any>(config: AxiosRequestConfig, options?: RequestOptions): Promise<T> {
+    return this.request({ ...config, method: 'POST' }, options);
+  }
 
-	put<T = any>(config: AxiosRequestConfig, options?: RequestOptions): Promise<T> {
-		return this.request({...config, method: 'PUT'}, options);
-	}
+  put<T = any>(config: AxiosRequestConfig, options?: RequestOptions): Promise<T> {
+    return this.request({ ...config, method: 'PUT' }, options);
+  }
 
-	delete<T = any>(config: AxiosRequestConfig, options?: RequestOptions): Promise<T> {
-		return this.request({...config, method: 'DELETE'}, options);
-	}
+  delete<T = any>(config: AxiosRequestConfig, options?: RequestOptions): Promise<T> {
+    return this.request({ ...config, method: 'DELETE' }, options);
+  }
 
-	request<T = any>(config: AxiosRequestConfig, options?: RequestOptions): Promise<T> {
-		let conf: CreateAxiosOptions = cloneDeep(config);
-		const transform = this.getTransform();
+  request<T = any>(config: AxiosRequestConfig, options?: RequestOptions): Promise<T> {
+    let conf: CreateAxiosOptions = cloneDeep(config);
+    const transform = this.getTransform();
 
-		const {requestOptions} = this.options;
+    const { requestOptions } = this.options;
 
-		const opt: RequestOptions = Object.assign({}, requestOptions, options);
+    const opt: RequestOptions = Object.assign({}, requestOptions, options);
 
-		const {beforeRequestHook, requestCatchHook, transformRequestHook} = transform || {};
-		if (beforeRequestHook && isFunction(beforeRequestHook)) {
-			conf = beforeRequestHook(conf, opt);
-		}
-		conf.requestOptions = opt;
+    const { beforeRequestHook, requestCatchHook, transformRequestHook } = transform || {};
+    if (beforeRequestHook && isFunction(beforeRequestHook)) {
+      conf = beforeRequestHook(conf, opt);
+    }
+    conf.requestOptions = opt;
 
-		conf = this.supportFormData(conf);
+    conf = this.supportFormData(conf);
 
-		return new Promise((resolve, reject) => {
-			this.axiosInstance
-				.request<any, AxiosResponse<Result>>(conf)
-				.then((res: AxiosResponse<Result>) => {
-					if (transformRequestHook && isFunction(transformRequestHook)) {
-						try {
-							const ret = transformRequestHook(res, opt);
-							//zhangyafei---添加回调方法
-							config.success && config.success(res.data);
-							//zhangyafei---添加回调方法
-							resolve(ret);
-						} catch (err) {
-							reject(err || new Error('request error!'));
-						}
-						return;
-					}
-					resolve(res as unknown as Promise<T>);
-				})
-				.catch((e: Error | AxiosError) => {
-					if (requestCatchHook && isFunction(requestCatchHook)) {
-						reject(requestCatchHook(e, opt));
-						return;
-					}
-					if (axios.isAxiosError(e)) {
-						// 在此处重写来自axios的错误消息
-					}
-					reject(e);
-				});
-		});
-	}
+    return new Promise((resolve, reject) => {
+      this.axiosInstance
+        .request<any, AxiosResponse<Result>>(conf)
+        .then((res: AxiosResponse<Result>) => {
+          if (transformRequestHook && isFunction(transformRequestHook)) {
+            try {
+              const ret = transformRequestHook(res, opt);
+              //zhangyafei---添加回调方法
+              config.success && config.success(res.data);
+              //zhangyafei---添加回调方法
+              resolve(ret);
+            } catch (err) {
+              reject(err || new Error('request error!'));
+            }
+            return;
+          }
+          resolve(res as unknown as Promise<T>);
+        })
+        .catch((e: Error | AxiosError) => {
+          if (requestCatchHook && isFunction(requestCatchHook)) {
+            reject(requestCatchHook(e, opt));
+            return;
+          }
+          if (axios.isAxiosError(e)) {
+            // 在此处重写来自axios的错误消息
+          }
+          reject(e);
+        });
+    });
+  }
 }
diff --git a/src/utils/http/axios/axiosTransform.ts b/src/utils/http/axios/axiosTransform.ts
index 3da9dcc..141ac5a 100644
--- a/src/utils/http/axios/axiosTransform.ts
+++ b/src/utils/http/axios/axiosTransform.ts
@@ -30,10 +30,7 @@ export abstract class AxiosTransform {
   /**
    * @description: 请求之前的拦截器
    */
-  requestInterceptors?: (
-    config: AxiosRequestConfig,
-    options: CreateAxiosOptions
-  ) => AxiosRequestConfig;
+  requestInterceptors?: (config: AxiosRequestConfig, options: CreateAxiosOptions) => AxiosRequestConfig;
 
   /**
    * @description: 请求之后的拦截器
diff --git a/src/utils/http/axios/checkStatus.ts b/src/utils/http/axios/checkStatus.ts
index 68c2ecf..fc292e3 100644
--- a/src/utils/http/axios/checkStatus.ts
+++ b/src/utils/http/axios/checkStatus.ts
@@ -11,11 +11,7 @@ const { createMessage, createErrorModal } = useMessage();
 const error = createMessage.error!;
 const stp = projectSetting.sessionTimeoutProcessing;
 
-export function checkStatus(
-  status: number,
-  msg: string,
-  errorMessageMode: ErrorMessageMode = 'message'
-): void {
+export function checkStatus(status: number, msg: string, errorMessageMode: ErrorMessageMode = 'message'): void {
   const { t } = useI18n();
   const userStore = useUserStoreWithOut();
   let errMessage = '';
diff --git a/src/utils/http/axios/helper.ts b/src/utils/http/axios/helper.ts
index dc30e04..f7f95e9 100644
--- a/src/utils/http/axios/helper.ts
+++ b/src/utils/http/axios/helper.ts
@@ -2,10 +2,7 @@ import { isObject, isString } from '/@/utils/is';
 
 const DATE_TIME_FORMAT = 'YYYY-MM-DD HH:mm';
 
-export function joinTimestamp<T extends boolean>(
-  join: boolean,
-  restful: T
-): T extends true ? string : object;
+export function joinTimestamp<T extends boolean>(join: boolean, restful: T): T extends true ? string : object;
 
 export function joinTimestamp(join: boolean, restful = false): string | object {
   if (!join) {
diff --git a/src/utils/http/axios/index.ts b/src/utils/http/axios/index.ts
index d0685dd..938ee50 100644
--- a/src/utils/http/axios/index.ts
+++ b/src/utils/http/axios/index.ts
@@ -8,11 +8,11 @@ import { VAxios } from './Axios';
 import { checkStatus } from './checkStatus';
 import { useGlobSetting } from '/@/hooks/setting';
 import { useMessage } from '/@/hooks/web/useMessage';
-import { RequestEnum, ResultEnum, ContentTypeEnum,ConfigEnum } from '/@/enums/httpEnum';
+import { RequestEnum, ResultEnum, ContentTypeEnum, ConfigEnum } from '/@/enums/httpEnum';
 import { isString } from '/@/utils/is';
-import { getToken,getTenantId } from '/@/utils/auth';
+import { getToken, getTenantId } from '/@/utils/auth';
 import { setObjToUrlParams, deepMerge } from '/@/utils';
-import signMd5Utils from '/@/utils/encryption/signMd5Utils'
+import signMd5Utils from '/@/utils/encryption/signMd5Utils';
 import { useErrorLogStoreWithOut } from '/@/store/modules/errorLog';
 import { useI18n } from '/@/hooks/web/useI18n';
 import { joinTimestamp, formatRequestDate } from './helper';
@@ -48,13 +48,13 @@ const transform: AxiosTransform = {
       throw new Error(t('sys.api.apiRequestFailed'));
     }
     //  这里 code，result，message为 后台统一的字段，需要在 types.ts内修改为项目自己的接口返回格式
-    const { code, result, message,success } = data;
+    const { code, result, message, success } = data;
     // 这里逻辑可以根据项目进行修改
-    const hasSuccess = data && Reflect.has(data, 'code') && (code === ResultEnum.SUCCESS||code === 200);
+    const hasSuccess = data && Reflect.has(data, 'code') && (code === ResultEnum.SUCCESS || code === 200);
     if (hasSuccess) {
-      if(success&&message&&options.successMessageMode==='success'){
-         //信息成功提示
-         createMessage.success(message);
+      if (success && message && options.successMessageMode === 'success') {
+        //信息成功提示
+        createMessage.success(message);
       }
       return result;
     }
@@ -88,7 +88,7 @@ const transform: AxiosTransform = {
 
   // 请求之前处理config
   beforeRequestHook: (config, options) => {
-    const { apiUrl, joinPrefix, joinParamsToUrl, formatDate, joinTime = true,urlPrefix } = options;
+    const { apiUrl, joinPrefix, joinParamsToUrl, formatDate, joinTime = true, urlPrefix } = options;
 
     if (joinPrefix) {
       config.url = `${urlPrefix}${config.url}`;
@@ -121,10 +121,7 @@ const transform: AxiosTransform = {
           config.params = undefined;
         }
         if (joinParamsToUrl) {
-          config.url = setObjToUrlParams(
-            config.url as string,
-            Object.assign({}, config.params, config.data)
-          );
+          config.url = setObjToUrlParams(config.url as string, Object.assign({}, config.params, config.data));
         }
       } else {
         // 兼容restful风格
@@ -138,32 +135,31 @@ const transform: AxiosTransform = {
   /**
    * @description: 请求拦截器处理
    */
-  requestInterceptors: (config:Recordable, options) => {
+  requestInterceptors: (config: Recordable, options) => {
     // 请求之前处理config
     const token = getToken();
     let tenantid = getTenantId();
     if (token && (config as Recordable)?.requestOptions?.withToken !== false) {
       // jwt token
       config.headers.Authorization = options.authenticationScheme ? `${options.authenticationScheme} ${token}` : token;
-      config.headers[ConfigEnum.TOKEN] = token
+      config.headers[ConfigEnum.TOKEN] = token;
       //--update-begin--author:liusq---date:20210831---for:将签名和时间戳，添加在请求接口 Header
-      
+
       // update-begin--author:taoyan---date:20220421--for: VUEN-410【签名改造】 X-TIMESTAMP牵扯
       config.headers[ConfigEnum.TIMESTAMP] = signMd5Utils.getTimestamp();
       // update-end--author:taoyan---date:20220421--for: VUEN-410【签名改造】 X-TIMESTAMP牵扯
-      
+
       config.headers[ConfigEnum.Sign] = signMd5Utils.getSign(config.url, config.params);
       //--update-end--author:liusq---date:20210831---for:将签名和时间戳，添加在请求接口 Header
       //--update-begin--author:liusq---date:20211105---for: for:将多租户id，添加在请求接口 Header
       if (!tenantid) {
-         tenantid = 0;
+        tenantid = 0;
       }
-      config.headers[ConfigEnum.TENANT_ID ] = tenantid
+      config.headers[ConfigEnum.TENANT_ID] = tenantid;
       //--update-begin--author:liusq---date:20220325---for: 增加vue3标记
-       config.headers[ConfigEnum.VERSION] = "v3"
+      config.headers[ConfigEnum.VERSION] = 'v3';
       //--update-end--author:liusq---date:20220325---for:增加vue3标记
       //--update-end--author:liusq---date:20211105---for:将多租户id，添加在请求接口 Header
-
     }
     return config;
   },
diff --git a/src/utils/index.ts b/src/utils/index.ts
index affbaf1..e83721a 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -5,7 +5,7 @@ import { unref } from 'vue';
 import { isObject } from '/@/utils/is';
 
 // update-begin--author:sunjianlei---date:20220408---for: 【VUEN-656】配置外部网址打不开，原因是带了#号，需要替换一下
-export const URL_HASH_TAB = `__AGWE4H__HASH__TAG__PWHRG__`
+export const URL_HASH_TAB = `__AGWE4H__HASH__TAG__PWHRG__`;
 // update-end--author:sunjianlei---date:20220408---for: 【VUEN-656】配置外部网址打不开，原因是带了#号，需要替换一下
 
 export const noop = () => {};
@@ -44,10 +44,7 @@ export function deepMerge<T = any>(src: any = {}, target: any = {}): T {
   return src;
 }
 
-export function openWindow(
-  url: string,
-  opt?: { target?: TargetContext | string; noopener?: boolean; noreferrer?: boolean }
-) {
+export function openWindow(url: string, opt?: { target?: TargetContext | string; noopener?: boolean; noreferrer?: boolean }) {
   const { target = '__blank', noopener = true, noreferrer = true } = opt || {};
   const feature: string[] = [];
 
@@ -74,12 +71,12 @@ export function getDynamicProps<T, U>(props: T): Partial<U> {
  * @param field
  * @updateBy:zyf
  */
-export function getValueType(props,field){
-  let formSchema = unref(unref(props)?.schemas)
-  let valueType = "string";
+export function getValueType(props, field) {
+  let formSchema = unref(unref(props)?.schemas);
+  let valueType = 'string';
   if (formSchema) {
     let schema = formSchema.filter((item) => item.field === field)[0];
-    valueType = schema.componentProps&&schema.componentProps.valueType ? schema.componentProps.valueType : valueType;
+    valueType = schema.componentProps && schema.componentProps.valueType ? schema.componentProps.valueType : valueType;
   }
   return valueType;
 }
@@ -103,7 +100,7 @@ export function getRawRoute(route: RouteLocationNormalized): RouteLocationNormal
  * @return 克隆后的对象
  */
 export function cloneObject(obj) {
-    return JSON.parse(JSON.stringify(obj))
+  return JSON.parse(JSON.stringify(obj));
 }
 
 export const withInstall = <T>(component: T, alias?: string) => {
@@ -123,23 +120,22 @@ export const withInstall = <T>(component: T, alias?: string) => {
  */
 export function getUrlParam(paraName) {
   let url = document.location.toString();
-  let arrObj = url.split("?");
+  let arrObj = url.split('?');
 
   if (arrObj.length > 1) {
-    let arrPara = arrObj[1].split("&");
+    let arrPara = arrObj[1].split('&');
     let arr;
 
     for (let i = 0; i < arrPara.length; i++) {
-      arr = arrPara[i].split("=");
+      arr = arrPara[i].split('=');
 
       if (arr != null && arr[0] == paraName) {
         return arr[1];
       }
     }
-    return "";
-  }
-  else {
-    return "";
+    return '';
+  } else {
+    return '';
   }
 }
 
@@ -150,10 +146,12 @@ export function getUrlParam(paraName) {
  * @return Promise
  */
 export function sleep(ms: number, fn?: Fn) {
-  return new Promise<void>(resolve => setTimeout(() => {
-    fn && fn()
-    resolve()
-  }, ms))
+  return new Promise<void>((resolve) =>
+    setTimeout(() => {
+      fn && fn();
+      resolve();
+    }, ms)
+  );
 }
 
 /**
@@ -164,10 +162,10 @@ export function sleep(ms: number, fn?: Fn) {
  * @returns {String} 替换后的字符串
  */
 export function replaceAll(text, checker, replacer) {
-  let lastText = text
-  text = text.replace(checker, replacer)
+  let lastText = text;
+  text = text.replace(checker, replacer);
   if (lastText !== text) {
-    return replaceAll(text, checker, replacer)
+    return replaceAll(text, checker, replacer);
   }
-  return text
-}
\ No newline at end of file
+  return text;
+}
diff --git a/src/utils/is.ts b/src/utils/is.ts
index 2aec540..2982c19 100644
--- a/src/utils/is.ts
+++ b/src/utils/is.ts
@@ -62,11 +62,11 @@ export function isString(val: unknown): val is string {
   return is(val, 'String');
 }
 
-export function isJsonObjectString(val: string ): val is string {
-    if(!val){
-        return false  
-    }
-    return val.startsWith('{') && val.endsWith('}');
+export function isJsonObjectString(val: string): val is string {
+  if (!val) {
+    return false;
+  }
+  return val.startsWith('{') && val.endsWith('}');
 }
 
 export function isFunction(val: unknown): val is Function {
@@ -102,7 +102,6 @@ export const isServer = typeof window === 'undefined';
 export const isClient = !isServer;
 
 export function isUrl(path: string): boolean {
-  const reg =
-      /(((^https?:(?:\/\/)?)(?:[-;:&=\+\$,\w]+@)?[A-Za-z0-9.-]+(?::\d+)?|(?:www.|[-;:&=\+\$,\w]+@)[A-Za-z0-9.-]+)((?:\/[\+~%\/.\w-_]*)?\??(?:[-\+=&;%@.\w_]*)#?(?:[\w]*))?)$/;
+  const reg = /(((^https?:(?:\/\/)?)(?:[-;:&=\+\$,\w]+@)?[A-Za-z0-9.-]+(?::\d+)?|(?:www.|[-;:&=\+\$,\w]+@)[A-Za-z0-9.-]+)((?:\/[\+~%\/.\w-_]*)?\??(?:[-\+=&;%@.\w_]*)#?(?:[\w]*))?)$/;
   return reg.test(path);
 }
diff --git a/src/utils/lib/echarts.ts b/src/utils/lib/echarts.ts
index 258ac8f..9b40020 100644
--- a/src/utils/lib/echarts.ts
+++ b/src/utils/lib/echarts.ts
@@ -1,13 +1,6 @@
 import * as echarts from 'echarts/core';
 
-import {
-  BarChart,
-  LineChart,
-  PieChart,
-  MapChart,
-  PictorialBarChart,
-  RadarChart,
-} from 'echarts/charts';
+import { BarChart, LineChart, PieChart, MapChart, PictorialBarChart, RadarChart } from 'echarts/charts';
 
 import {
   TitleComponent,
diff --git a/src/utils/monorepo/dynamicRouter.ts b/src/utils/monorepo/dynamicRouter.ts
index d734333..11f9ab8 100644
--- a/src/utils/monorepo/dynamicRouter.ts
+++ b/src/utils/monorepo/dynamicRouter.ts
@@ -1,4 +1,4 @@
-export type DynamicViewsRecord = Record<string, () => Promise<Recordable>>
+export type DynamicViewsRecord = Record<string, () => Promise<Recordable>>;
 
 /** 已注册模块的动态页面 */
 export const packageViews: DynamicViewsRecord = {};
diff --git a/src/utils/monorepo/registerPackages.ts b/src/utils/monorepo/registerPackages.ts
index 91ab6a2..44008e1 100644
--- a/src/utils/monorepo/registerPackages.ts
+++ b/src/utils/monorepo/registerPackages.ts
@@ -20,10 +20,7 @@ function use(app: App, pkg) {
 }
 
 // 模块里可使用的import
-const importGlobs = [
-  import.meta.glob('../../utils/**/*.{ts,js,tsx}'),
-  import.meta.glob('../../hooks/**/*.{ts,js,tsx}'),
-];
+const importGlobs = [import.meta.glob('../../utils/**/*.{ts,js,tsx}'), import.meta.glob('../../hooks/**/*.{ts,js,tsx}')];
 
 /**
  * 基础项目导包
diff --git a/src/views/dashboard/Analysis/api.ts b/src/views/dashboard/Analysis/api.ts
index 33e2197..0f40443 100644
--- a/src/views/dashboard/Analysis/api.ts
+++ b/src/views/dashboard/Analysis/api.ts
@@ -1,18 +1,16 @@
-import {defHttp} from '/@/utils/http/axios';
+import { defHttp } from '/@/utils/http/axios';
 
 enum Api {
-    loginfo = '/sys/loginfo',
-    visitInfo = '/sys/visitInfo',
+  loginfo = '/sys/loginfo',
+  visitInfo = '/sys/visitInfo',
 }
 /**
  * 日志统计信息
  * @param params
  */
-export const getLoginfo = (params) =>
-    defHttp.get({url: Api.loginfo, params},{isTransformResponse:false});
+export const getLoginfo = (params) => defHttp.get({ url: Api.loginfo, params }, { isTransformResponse: false });
 /**
  * 访问量信息
  * @param params
  */
-export const getVisitInfo = (params) =>
-    defHttp.get({url: Api.visitInfo, params},{isTransformResponse:false});
+export const getVisitInfo = (params) => defHttp.get({ url: Api.visitInfo, params }, { isTransformResponse: false });
diff --git a/src/views/dashboard/Analysis/components/BdcTabCard.vue b/src/views/dashboard/Analysis/components/BdcTabCard.vue
index 95015ea..3ff75c4 100644
--- a/src/views/dashboard/Analysis/components/BdcTabCard.vue
+++ b/src/views/dashboard/Analysis/components/BdcTabCard.vue
@@ -1,105 +1,105 @@
 <template>
-    <a-card :loading="loading" :bordered="false" :body-style="{padding: '0'}">
-        <div class="salesCard">
-            <a-tabs default-active-key="1" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
-                <template #tabBarExtraContent>
-                    <div class="extra-wrapper">
-                        <div class="extra-item">
-                            <a>今日</a>
-                            <a>本周</a>
-                            <a>本月</a>
-                            <a>本年</a>
-                        </div>
-                        <a-range-picker :style="{width: '256px'}"/>
-                    </div>
-                </template>
-                <a-tab-pane loading="true" tab="受理监管" key="1">
-                    <a-row>
-                        <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
-                            <Bar :chartData="barData" :option="{title:{text:'受理量统计',textStyle:{fontWeight:'lighter'}}}" height="40vh"/>
-                        </a-col>
-                        <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
-                            <QuickNav :loading="loading" class="enter-y" :bordered="false" :body-style="{padding: 0}"/>
-                        </a-col>
-                    </a-row>
-                </a-tab-pane>
-                <a-tab-pane tab="交互监管" key="2">
-                    <a-row>
-                        <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
-                            <BarMulti :chartData="barMultiData" :option="{title:{text:'平台与部门交互量统计',textStyle:{fontWeight:'lighter'}}}" height="40vh"/>
-                        </a-col>
-                        <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
-                            <QuickNav :loading="loading" class="enter-y" :bordered="false" :body-style="{padding: 0}"/>
-                        </a-col>
-                    </a-row>
-                </a-tab-pane>
-                <a-tab-pane tab="存储监管" key="3">
-                    <a-row>
-                        <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24" style="display: flex">
-                            <Gauge :chartData="{name:'C盘',value:70}" height="30vh"></Gauge>
-                            <Gauge :chartData="{name:'D盘',value:50}" height="30vh"></Gauge>
-                        </a-col>
-                        <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
-                            <QuickNav :loading="loading" class="enter-y" :bordered="false" :body-style="{padding: 0}"/>
-                        </a-col>
-                    </a-row>
-                </a-tab-pane>
-            </a-tabs>
-        </div>
-    </a-card>
+  <a-card :loading="loading" :bordered="false" :body-style="{ padding: '0' }">
+    <div class="salesCard">
+      <a-tabs default-active-key="1" size="large" :tab-bar-style="{ marginBottom: '24px', paddingLeft: '16px' }">
+        <template #tabBarExtraContent>
+          <div class="extra-wrapper">
+            <div class="extra-item">
+              <a>今日</a>
+              <a>本周</a>
+              <a>本月</a>
+              <a>本年</a>
+            </div>
+            <a-range-picker :style="{ width: '256px' }" />
+          </div>
+        </template>
+        <a-tab-pane loading="true" tab="受理监管" key="1">
+          <a-row>
+            <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
+              <Bar :chartData="barData" :option="{ title: { text: '受理量统计', textStyle: { fontWeight: 'lighter' } } }" height="40vh" />
+            </a-col>
+            <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
+              <QuickNav :loading="loading" class="enter-y" :bordered="false" :body-style="{ padding: 0 }" />
+            </a-col>
+          </a-row>
+        </a-tab-pane>
+        <a-tab-pane tab="交互监管" key="2">
+          <a-row>
+            <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
+              <BarMulti :chartData="barMultiData" :option="{ title: { text: '平台与部门交互量统计', textStyle: { fontWeight: 'lighter' } } }" height="40vh" />
+            </a-col>
+            <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
+              <QuickNav :loading="loading" class="enter-y" :bordered="false" :body-style="{ padding: 0 }" />
+            </a-col>
+          </a-row>
+        </a-tab-pane>
+        <a-tab-pane tab="存储监管" key="3">
+          <a-row>
+            <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24" style="display: flex">
+              <Gauge :chartData="{ name: 'C盘', value: 70 }" height="30vh"></Gauge>
+              <Gauge :chartData="{ name: 'D盘', value: 50 }" height="30vh"></Gauge>
+            </a-col>
+            <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
+              <QuickNav :loading="loading" class="enter-y" :bordered="false" :body-style="{ padding: 0 }" />
+            </a-col>
+          </a-row>
+        </a-tab-pane>
+      </a-tabs>
+    </div>
+  </a-card>
 </template>
 <script lang="ts" setup>
-    import {ref} from 'vue';
-    import Bar from '/@/components/chart/Bar.vue';
-    import BarMulti from '/@/components/chart/BarMulti.vue';
-    import Gauge from '/@/components/chart/Gauge.vue';
-    import QuickNav from './QuickNav.vue';
+  import { ref } from 'vue';
+  import Bar from '/@/components/chart/Bar.vue';
+  import BarMulti from '/@/components/chart/BarMulti.vue';
+  import Gauge from '/@/components/chart/Gauge.vue';
+  import QuickNav from './QuickNav.vue';
 
-    defineProps({
-        loading: {
-            type: Boolean,
-        },
+  defineProps({
+    loading: {
+      type: Boolean,
+    },
+  });
+
+  const rankList = [];
+  for (let i = 0; i < 7; i++) {
+    rankList.push({
+      name: '白鹭岛 ' + (i + 1) + ' 号店',
+      total: 1234.56 - i * 100,
     });
+  }
 
-    const rankList = [];
-    for (let i = 0; i < 7; i++) {
-        rankList.push({
-            name: '白鹭岛 ' + (i + 1) + ' 号店',
-            total: 1234.56 - i * 100
-        })
-    }
-
-    const barData = [];
+  const barData = [];
+  for (let i = 0; i < 12; i += 1) {
+    barData.push({
+      name: `${i + 1}月`,
+      value: Math.floor(Math.random() * 1000) + 200,
+    });
+  }
+  const barMultiData = [];
+  for (let j = 0; j < 2; j++) {
     for (let i = 0; i < 12; i += 1) {
-        barData.push({
-            name: `${i + 1}月`,
-            value: Math.floor(Math.random() * 1000) + 200
-        })
-    }
-    const barMultiData = [];
-    for (let j = 0; j < 2; j++) {
-        for (let i = 0; i < 12; i += 1) {
-            barMultiData.push({
-                type: j == 0 ? 'jeecg' : 'jeebt',
-                name: `${i + 1}月`,
-                value: Math.floor(Math.random() * 1000) + 200
-            })
-        }
+      barMultiData.push({
+        type: j == 0 ? 'jeecg' : 'jeebt',
+        name: `${i + 1}月`,
+        value: Math.floor(Math.random() * 1000) + 200,
+      });
     }
+  }
 </script>
 
 <style lang="less" scoped>
-    .extra-wrapper {
-        line-height: 55px;
-        padding-right: 24px;
+  .extra-wrapper {
+    line-height: 55px;
+    padding-right: 24px;
 
-        .extra-item {
-            display: inline-block;
-            margin-right: 24px;
+    .extra-item {
+      display: inline-block;
+      margin-right: 24px;
 
-            a {
-                margin-left: 24px;
-            }
-        }
+      a {
+        margin-left: 24px;
+      }
     }
+  }
 </style>
diff --git a/src/views/dashboard/Analysis/components/ChartGroupCard.vue b/src/views/dashboard/Analysis/components/ChartGroupCard.vue
index 6540c75..8b6fd25 100644
--- a/src/views/dashboard/Analysis/components/ChartGroupCard.vue
+++ b/src/views/dashboard/Analysis/components/ChartGroupCard.vue
@@ -1,96 +1,98 @@
 <template>
-    <div class="md:flex">
-        <template v-for="(item, index) in dataList" :key="item.title">
-            <ChartCard :loading="loading" :title="item.title" :total="getTotal(item.total, index)" class="md:w-1/4 w-full !md:mt-0 !mt-4" :class="[index + 1 < 4 && '!md:mr-4']">
-                <template #action>
-                    <a-tooltip title="指标说明">
-                        <Icon :icon="item.icon" :size="20"/>
-                    </a-tooltip>
-                </template>
-                <div v-if="type==='chart'">
-                    <Trend term="周同比" :percentage="12" v-if="index===0"/>
-                    <Trend term="日同比" :percentage="11" v-if="index===0" :type="false"/>
-
-                    <Line v-if="index===1" :option="option" :chartData="chartData" height="50px"></Line>
-
-                    <Bar v-if="index===2" :option="option" :chartData="chartData" height="50px"></Bar>
-
-                    <Progress v-if="index===3" :percent="78" :show-info="false"></Progress>
-                </div>
-                <div v-else>
-
-                    <Line v-if="index===0" :option="option" :chartData="chartData" height="50px"></Line>
-
-                    <Line v-if="index===1" :option="option" :chartData="chartData" height="50px"></Line>
-
-                    <Bar v-if="index===2" :option="option" :chartData="chartData" height="50px"></Bar>
-
-                    <Bar v-if="index===3" :option="option" :chartData="chartData" height="50px"></Bar>
-
-                </div>
-                <template #footer v-if="type==='chart'">
-                    <span v-if="inde!==3">{{item.footer}}<span>{{item.value}}</span></span>
-                    <Trend term="周同比" :percentage="12" v-if="index===3"/>
-                    <Trend term="日同比" :percentage="11" v-if="index===3" :type="false"/>
-                </template>
-                <template #footer v-else>
-                    <span>{{item.footer}}<span>{{item.value}}</span></span>
-                </template>
-            </ChartCard>
+  <div class="md:flex">
+    <template v-for="(item, index) in dataList" :key="item.title">
+      <ChartCard :loading="loading" :title="item.title" :total="getTotal(item.total, index)" class="md:w-1/4 w-full !md:mt-0 !mt-4" :class="[index + 1 < 4 && '!md:mr-4']">
+        <template #action>
+          <a-tooltip title="指标说明">
+            <Icon :icon="item.icon" :size="20" />
+          </a-tooltip>
         </template>
-    </div>
+        <div v-if="type === 'chart'">
+          <Trend term="周同比" :percentage="12" v-if="index === 0" />
+          <Trend term="日同比" :percentage="11" v-if="index === 0" :type="false" />
+
+          <Line v-if="index === 1" :option="option" :chartData="chartData" height="50px"></Line>
+
+          <Bar v-if="index === 2" :option="option" :chartData="chartData" height="50px"></Bar>
+
+          <Progress v-if="index === 3" :percent="78" :show-info="false"></Progress>
+        </div>
+        <div v-else>
+          <Line v-if="index === 0" :option="option" :chartData="chartData" height="50px"></Line>
+
+          <Line v-if="index === 1" :option="option" :chartData="chartData" height="50px"></Line>
+
+          <Bar v-if="index === 2" :option="option" :chartData="chartData" height="50px"></Bar>
+
+          <Bar v-if="index === 3" :option="option" :chartData="chartData" height="50px"></Bar>
+        </div>
+        <template #footer v-if="type === 'chart'">
+          <span v-if="inde !== 3"
+            >{{ item.footer }}<span>{{ item.value }}</span></span
+          >
+          <Trend term="周同比" :percentage="12" v-if="index === 3" />
+          <Trend term="日同比" :percentage="11" v-if="index === 3" :type="false" />
+        </template>
+        <template #footer v-else>
+          <span
+            >{{ item.footer }}<span>{{ item.value }}</span></span
+          >
+        </template>
+      </ChartCard>
+    </template>
+  </div>
 </template>
 <script lang="ts" setup>
-    import {ref, computed} from 'vue';
-    import {Icon} from '/@/components/Icon';
-    import {Progress} from 'ant-design-vue';
-    import ChartCard from '/@/components/chart/ChartCard.vue';
-    import Trend from '/@/components/chart/Trend.vue';
-    import Bar from '/@/components/chart/Bar.vue';
-    import Line from '/@/components/chart/Line.vue';
-    import {chartCardList, bdcCardList} from '../data';
+  import { ref, computed } from 'vue';
+  import { Icon } from '/@/components/Icon';
+  import { Progress } from 'ant-design-vue';
+  import ChartCard from '/@/components/chart/ChartCard.vue';
+  import Trend from '/@/components/chart/Trend.vue';
+  import Bar from '/@/components/chart/Bar.vue';
+  import Line from '/@/components/chart/Line.vue';
+  import { chartCardList, bdcCardList } from '../data';
 
-    const props = defineProps({
-        loading: {
-            type: Boolean,
-        },
-        type: {
-            type: String,
-            default: 'chart'
-        },
-    });
-    const option = ref({xAxis: {show: false, boundaryGap: false}, yAxis: {show: false, boundaryGap: false, max: 220}});
+  const props = defineProps({
+    loading: {
+      type: Boolean,
+    },
+    type: {
+      type: String,
+      default: 'chart',
+    },
+  });
+  const option = ref({ xAxis: { show: false, boundaryGap: false }, yAxis: { show: false, boundaryGap: false, max: 220 } });
 
-    const chartData = ref([
-        {
-            "name": "1月",
-            "value": 50
-        },
-        {
-            "name": "2月",
-            "value": 100
-        },
-        {
-            "name": "3月",
-            "value": 150
-        },
-        {
-            "name": "4月",
-            "value": 40
-        },
-        {
-            "name": "5月",
-            "value": 110
-        },
-        {
-            "name": "6月",
-            "value": 120
-        }
-    ])
+  const chartData = ref([
+    {
+      name: '1月',
+      value: 50,
+    },
+    {
+      name: '2月',
+      value: 100,
+    },
+    {
+      name: '3月',
+      value: 150,
+    },
+    {
+      name: '4月',
+      value: 40,
+    },
+    {
+      name: '5月',
+      value: 110,
+    },
+    {
+      name: '6月',
+      value: 120,
+    },
+  ]);
 
-    const dataList = computed(() => props.type === 'dbc' ? bdcCardList : chartCardList);
+  const dataList = computed(() => (props.type === 'dbc' ? bdcCardList : chartCardList));
 
-    function getTotal(total, index) {
-        return index === 0 ? `￥${total}` : index === 3 ? `${total}%` : total;
-    }
+  function getTotal(total, index) {
+    return index === 0 ? `￥${total}` : index === 3 ? `${total}%` : total;
+  }
 </script>
diff --git a/src/views/dashboard/Analysis/components/GrowCard.vue b/src/views/dashboard/Analysis/components/GrowCard.vue
index 821292e..5625c97 100644
--- a/src/views/dashboard/Analysis/components/GrowCard.vue
+++ b/src/views/dashboard/Analysis/components/GrowCard.vue
@@ -1,40 +1,33 @@
 <template>
-    <div class="md:flex">
-        <template v-for="(item, index) in growCardList" :key="item.title">
-            <Card
-                    size="small"
-                    :loading="loading"
-                    :title="item.title"
-                    class="md:w-1/4 w-full !md:mt-0 !mt-4"
-                    :class="[index + 1 < 4 && '!md:mr-4']"
-                    :canExpan="false"
-            >
-                <template #extra>
-                    <Tag :color="item.color">{{ item.action }}</Tag>
-                </template>
-
-                <div class="py-4 px-4 flex justify-between">
-                    <CountTo prefix="$" :startVal="1" :endVal="item.value" class="text-2xl" />
-                    <Icon :icon="item.icon" :size="40" />
-                </div>
-
-                <div class="p-2 px-4 flex justify-between">
-                    <span>总{{ item.title }}</span>
-                    <CountTo prefix="$" :startVal="1" :endVal="item.total" />
-                </div>
-            </Card>
+  <div class="md:flex">
+    <template v-for="(item, index) in growCardList" :key="item.title">
+      <Card size="small" :loading="loading" :title="item.title" class="md:w-1/4 w-full !md:mt-0 !mt-4" :class="[index + 1 < 4 && '!md:mr-4']" :canExpan="false">
+        <template #extra>
+          <Tag :color="item.color">{{ item.action }}</Tag>
         </template>
-    </div>
+
+        <div class="py-4 px-4 flex justify-between">
+          <CountTo prefix="$" :startVal="1" :endVal="item.value" class="text-2xl" />
+          <Icon :icon="item.icon" :size="40" />
+        </div>
+
+        <div class="p-2 px-4 flex justify-between">
+          <span>总{{ item.title }}</span>
+          <CountTo prefix="$" :startVal="1" :endVal="item.total" />
+        </div>
+      </Card>
+    </template>
+  </div>
 </template>
 <script lang="ts" setup>
-    import { CountTo } from '/@/components/CountTo/index';
-    import { Icon } from '/@/components/Icon';
-    import { Tag, Card } from 'ant-design-vue';
-    import { growCardList } from '../data';
+  import { CountTo } from '/@/components/CountTo/index';
+  import { Icon } from '/@/components/Icon';
+  import { Tag, Card } from 'ant-design-vue';
+  import { growCardList } from '../data';
 
-    defineProps({
-        loading: {
-            type: Boolean,
-        },
-    });
+  defineProps({
+    loading: {
+      type: Boolean,
+    },
+  });
 </script>
diff --git a/src/views/dashboard/Analysis/components/QuickNav.vue b/src/views/dashboard/Analysis/components/QuickNav.vue
index 57de4b3..1677958 100644
--- a/src/views/dashboard/Analysis/components/QuickNav.vue
+++ b/src/views/dashboard/Analysis/components/QuickNav.vue
@@ -1,41 +1,46 @@
 <template>
-    <Card title="快捷导航" v-bind="$attrs">
-        <template v-for="item in navItems" :key="item">
-            <CardGrid @click="goPage">
-                <span class="flex flex-col items-center">
-                  <Icon :icon="item.icon" :color="item.color" size="20"/>
-                  <span class="text-md mt-2">{{ item.title }}</span>
-                </span>
-            </CardGrid>
-        </template>
-    </Card>
+  <Card title="快捷导航" v-bind="$attrs">
+    <template v-for="item in navItems" :key="item">
+      <CardGrid @click="goPage">
+        <span class="flex flex-col items-center">
+          <Icon :icon="item.icon" :color="item.color" size="20" />
+          <span class="text-md mt-2">{{ item.title }}</span>
+        </span>
+      </CardGrid>
+    </template>
+  </Card>
 </template>
 <script lang="ts" setup>
-    import {Card} from 'ant-design-vue';
-    import {useMessage} from '/@/hooks/web/useMessage';
-    import {Icon} from '/@/components/Icon';
+  import { Card } from 'ant-design-vue';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { Icon } from '/@/components/Icon';
 
-    const CardGrid = Card.Grid;
-    const $message = useMessage()
-    const navItems = [{
-        title: '业务受理',
-        icon: 'ion:home-outline',
-        color: '#1fdaca',
-    }, {
-        title: '业务管理',
-        icon: 'ion:grid-outline',
-        color: '#bf0c2c',
-    }, {
-        title: '文件管理',
-        icon: 'ion:layers-outline',
-        color: '#e18525',
-    }, {
-        title: '信息查询',
-        icon: 'ion:settings-outline',
-        color: '#3fb27f',
-    }];
+  const CardGrid = Card.Grid;
+  const $message = useMessage();
+  const navItems = [
+    {
+      title: '业务受理',
+      icon: 'ion:home-outline',
+      color: '#1fdaca',
+    },
+    {
+      title: '业务管理',
+      icon: 'ion:grid-outline',
+      color: '#bf0c2c',
+    },
+    {
+      title: '文件管理',
+      icon: 'ion:layers-outline',
+      color: '#e18525',
+    },
+    {
+      title: '信息查询',
+      icon: 'ion:settings-outline',
+      color: '#3fb27f',
+    },
+  ];
 
-    function goPage() {
-        $message.createMessage.success("根据业务自行处理跳转页面!")
-    }
+  function goPage() {
+    $message.createMessage.success('根据业务自行处理跳转页面!');
+  }
 </script>
diff --git a/src/views/dashboard/Analysis/components/SaleTabCard.vue b/src/views/dashboard/Analysis/components/SaleTabCard.vue
index b3cf43f..2a3c8ba 100644
--- a/src/views/dashboard/Analysis/components/SaleTabCard.vue
+++ b/src/views/dashboard/Analysis/components/SaleTabCard.vue
@@ -1,81 +1,81 @@
 <template>
-    <a-card :loading="loading" :bordered="false" :body-style="{padding: '0'}">
-        <div class="salesCard">
-            <a-tabs default-active-key="1" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
-                <template #tabBarExtraContent>
-                    <div class="extra-wrapper">
-                        <div class="extra-item">
-                            <a>今日</a>
-                            <a>本周</a>
-                            <a>本月</a>
-                            <a>本年</a>
-                        </div>
-                        <a-range-picker :style="{width: '256px'}"/>
-                    </div>
-                </template>
-                <a-tab-pane loading="true" tab="销售额" key="1">
-                    <a-row>
-                        <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
-                            <Bar :chartData="barData" :option="{title:{text:'销售额排行',textStyle:{fontWeight:'lighter'}}}" height="40vh"/>
-                        </a-col>
-                        <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
-                            <RankList title="门店销售排行榜" :list="rankList"/>
-                        </a-col>
-                    </a-row>
-                </a-tab-pane>
-                <a-tab-pane tab="销售趋势" key="2">
-                    <a-row>
-                        <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
-                            <Bar :chartData="barData.reverse()" :option="{title:{text:'销售额排行',textStyle:{fontWeight:'lighter'}}}" height="40vh"/>
-                        </a-col>
-                        <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
-                            <RankList title="门店销售排行榜" :list="rankList"/>
-                        </a-col>
-                    </a-row>
-                </a-tab-pane>
-            </a-tabs>
-        </div>
-    </a-card>
+  <a-card :loading="loading" :bordered="false" :body-style="{ padding: '0' }">
+    <div class="salesCard">
+      <a-tabs default-active-key="1" size="large" :tab-bar-style="{ marginBottom: '24px', paddingLeft: '16px' }">
+        <template #tabBarExtraContent>
+          <div class="extra-wrapper">
+            <div class="extra-item">
+              <a>今日</a>
+              <a>本周</a>
+              <a>本月</a>
+              <a>本年</a>
+            </div>
+            <a-range-picker :style="{ width: '256px' }" />
+          </div>
+        </template>
+        <a-tab-pane loading="true" tab="销售额" key="1">
+          <a-row>
+            <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
+              <Bar :chartData="barData" :option="{ title: { text: '销售额排行', textStyle: { fontWeight: 'lighter' } } }" height="40vh" />
+            </a-col>
+            <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
+              <RankList title="门店销售排行榜" :list="rankList" />
+            </a-col>
+          </a-row>
+        </a-tab-pane>
+        <a-tab-pane tab="销售趋势" key="2">
+          <a-row>
+            <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
+              <Bar :chartData="barData.reverse()" :option="{ title: { text: '销售额排行', textStyle: { fontWeight: 'lighter' } } }" height="40vh" />
+            </a-col>
+            <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
+              <RankList title="门店销售排行榜" :list="rankList" />
+            </a-col>
+          </a-row>
+        </a-tab-pane>
+      </a-tabs>
+    </div>
+  </a-card>
 </template>
 <script lang="ts" setup>
-    import {ref} from 'vue';
-    import Bar from '/@/components/chart/Bar.vue';
-    import RankList from '/@/components/chart/RankList.vue';
+  import { ref } from 'vue';
+  import Bar from '/@/components/chart/Bar.vue';
+  import RankList from '/@/components/chart/RankList.vue';
 
-    defineProps({
-        loading: {
-            type: Boolean,
-        },
+  defineProps({
+    loading: {
+      type: Boolean,
+    },
+  });
+  const rankList = [];
+  for (let i = 0; i < 7; i++) {
+    rankList.push({
+      name: '白鹭岛 ' + (i + 1) + ' 号店',
+      total: 1234.56 - i * 100,
     });
-    const rankList = []
-    for (let i = 0; i < 7; i++) {
-        rankList.push({
-            name: '白鹭岛 ' + (i + 1) + ' 号店',
-            total: 1234.56 - i * 100
-        })
-    }
+  }
 
-    const barData = []
-    for (let i = 0; i < 12; i += 1) {
-        barData.push({
-            name: `${i + 1}月`,
-            value: Math.floor(Math.random() * 1000) + 200
-        })
-    }
+  const barData = [];
+  for (let i = 0; i < 12; i += 1) {
+    barData.push({
+      name: `${i + 1}月`,
+      value: Math.floor(Math.random() * 1000) + 200,
+    });
+  }
 </script>
 
 <style lang="less" scoped>
-    .extra-wrapper {
-        line-height: 55px;
-        padding-right: 24px;
+  .extra-wrapper {
+    line-height: 55px;
+    padding-right: 24px;
 
-        .extra-item {
-            display: inline-block;
-            margin-right: 24px;
+    .extra-item {
+      display: inline-block;
+      margin-right: 24px;
 
-            a {
-                margin-left: 24px;
-            }
-        }
+      a {
+        margin-left: 24px;
+      }
     }
+  }
 </style>
diff --git a/src/views/dashboard/Analysis/components/SalesProductPie.vue b/src/views/dashboard/Analysis/components/SalesProductPie.vue
index 25bb362..6dc41fb 100644
--- a/src/views/dashboard/Analysis/components/SalesProductPie.vue
+++ b/src/views/dashboard/Analysis/components/SalesProductPie.vue
@@ -23,41 +23,41 @@
   const chartRef = ref<HTMLDivElement | null>(null);
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
   watch(
-          () => props.loading,
-          () => {
-            if (props.loading) {
-              return;
-            }
-            setOptions({
-              tooltip: {
-                trigger: 'item',
-              },
+    () => props.loading,
+    () => {
+      if (props.loading) {
+        return;
+      }
+      setOptions({
+        tooltip: {
+          trigger: 'item',
+        },
 
-              series: [
-                {
-                  name: '访问来源',
-                  type: 'pie',
-                  radius: '80%',
-                  center: ['50%', '50%'],
-                  color: ['#5ab1ef', '#b6a2de', '#67e0e3', '#2ec7c9'],
-                  data: [
-                    { value: 500, name: '电子产品' },
-                    { value: 310, name: '服装' },
-                    { value: 274, name: '化妆品' },
-                    { value: 400, name: '家居' },
-                  ].sort(function (a, b) {
-                    return a.value - b.value;
-                  }),
-                  roseType: 'radius',
-                  animationType: 'scale',
-                  animationEasing: 'exponentialInOut',
-                  animationDelay: function () {
-                    return Math.random() * 400;
-                  },
-                },
-              ],
-            });
+        series: [
+          {
+            name: '访问来源',
+            type: 'pie',
+            radius: '80%',
+            center: ['50%', '50%'],
+            color: ['#5ab1ef', '#b6a2de', '#67e0e3', '#2ec7c9'],
+            data: [
+              { value: 500, name: '电子产品' },
+              { value: 310, name: '服装' },
+              { value: 274, name: '化妆品' },
+              { value: 400, name: '家居' },
+            ].sort(function (a, b) {
+              return a.value - b.value;
+            }),
+            roseType: 'radius',
+            animationType: 'scale',
+            animationEasing: 'exponentialInOut',
+            animationDelay: function () {
+              return Math.random() * 400;
+            },
           },
-          { immediate: true }
+        ],
+      });
+    },
+    { immediate: true }
   );
 </script>
diff --git a/src/views/dashboard/Analysis/components/SiteAnalysis.vue b/src/views/dashboard/Analysis/components/SiteAnalysis.vue
index 63a3f49..570861a 100644
--- a/src/views/dashboard/Analysis/components/SiteAnalysis.vue
+++ b/src/views/dashboard/Analysis/components/SiteAnalysis.vue
@@ -1,10 +1,5 @@
 <template>
-  <Card
-          :tab-list="tabListTitle"
-          v-bind="$attrs"
-          :active-tab-key="activeKey"
-          @tabChange="onTabChange"
-  >
+  <Card :tab-list="tabListTitle" v-bind="$attrs" :active-tab-key="activeKey" @tabChange="onTabChange">
     <p v-if="activeKey === 'tab1'">
       <VisitAnalysis />
     </p>
diff --git a/src/views/dashboard/Analysis/components/VisitAnalysis.vue b/src/views/dashboard/Analysis/components/VisitAnalysis.vue
index 1429166..bda7e9d 100644
--- a/src/views/dashboard/Analysis/components/VisitAnalysis.vue
+++ b/src/views/dashboard/Analysis/components/VisitAnalysis.vue
@@ -26,26 +26,7 @@
       xAxis: {
         type: 'category',
         boundaryGap: false,
-        data: [
-          '6:00',
-          '7:00',
-          '8:00',
-          '9:00',
-          '10:00',
-          '11:00',
-          '12:00',
-          '13:00',
-          '14:00',
-          '15:00',
-          '16:00',
-          '17:00',
-          '18:00',
-          '19:00',
-          '20:00',
-          '21:00',
-          '22:00',
-          '23:00',
-        ],
+        data: ['6:00', '7:00', '8:00', '9:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '19:00', '20:00', '21:00', '22:00', '23:00'],
         splitLine: {
           show: true,
           lineStyle: {
@@ -78,10 +59,7 @@
       series: [
         {
           smooth: true,
-          data: [
-            111, 222, 4000, 18000, 33333, 55555, 66666, 33333, 14000, 36000, 66666, 44444, 22222,
-            11111, 4000, 2000, 500, 333, 222, 111,
-          ],
+          data: [111, 222, 4000, 18000, 33333, 55555, 66666, 33333, 14000, 36000, 66666, 44444, 22222, 11111, 4000, 2000, 500, 333, 222, 111],
           type: 'line',
           areaStyle: {},
           itemStyle: {
@@ -90,10 +68,7 @@
         },
         {
           smooth: true,
-          data: [
-            33, 66, 88, 333, 3333, 5000, 18000, 3000, 1200, 13000, 22000, 11000, 2221, 1201, 390,
-            198, 60, 30, 22, 11,
-          ],
+          data: [33, 66, 88, 333, 3333, 5000, 18000, 3000, 1200, 13000, 22000, 11000, 2221, 1201, 390, 198, 60, 30, 22, 11],
           type: 'line',
           areaStyle: {},
           itemStyle: {
diff --git a/src/views/dashboard/Analysis/components/VisitAnalysisBar.vue b/src/views/dashboard/Analysis/components/VisitAnalysisBar.vue
index 4883d87..a1a2478 100644
--- a/src/views/dashboard/Analysis/components/VisitAnalysisBar.vue
+++ b/src/views/dashboard/Analysis/components/VisitAnalysisBar.vue
@@ -26,20 +26,7 @@
       grid: { left: '1%', right: '1%', top: '2  %', bottom: 0, containLabel: true },
       xAxis: {
         type: 'category',
-        data: [
-          '1月',
-          '2月',
-          '3月',
-          '4月',
-          '5月',
-          '6月',
-          '7月',
-          '8月',
-          '9月',
-          '10月',
-          '11月',
-          '12月',
-        ],
+        data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
       },
       yAxis: {
         type: 'value',
diff --git a/src/views/dashboard/Analysis/components/VisitRadar.vue b/src/views/dashboard/Analysis/components/VisitRadar.vue
index 518d840..4f35287 100644
--- a/src/views/dashboard/Analysis/components/VisitRadar.vue
+++ b/src/views/dashboard/Analysis/components/VisitRadar.vue
@@ -23,78 +23,78 @@
   const chartRef = ref<HTMLDivElement | null>(null);
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
   watch(
-          () => props.loading,
-          () => {
-            if (props.loading) {
-              return;
-            }
-            setOptions({
-              legend: {
-                bottom: 0,
-                data: ['访问', '购买'],
-              },
-              tooltip: {},
-              radar: {
-                radius: '60%',
-                splitNumber: 8,
-                indicator: [
-                  {
-                    text: '电脑',
-                    max: 100,
-                  },
-                  {
-                    text: '充电器',
-                    max: 100,
-                  },
-                  {
-                    text: '耳机',
-                    max: 100,
-                  },
-                  {
-                    text: '手机',
-                    max: 100,
-                  },
-                  {
-                    text: 'Ipad',
-                    max: 100,
-                  },
-                  {
-                    text: '耳机',
-                    max: 100,
-                  },
-                ],
-              },
-              series: [
-                {
-                  type: 'radar',
-                  symbolSize: 0,
-                  areaStyle: {
-                    shadowBlur: 0,
-                    shadowColor: 'rgba(0,0,0,.2)',
-                    shadowOffsetX: 0,
-                    shadowOffsetY: 10,
-                    opacity: 1,
-                  },
-                  data: [
-                    {
-                      value: [90, 50, 86, 40, 50, 20],
-                      name: '访问',
-                      itemStyle: {
-                        color: '#b6a2de',
-                      },
-                    },
-                    {
-                      value: [70, 75, 70, 76, 20, 85],
-                      name: '购买',
-                      itemStyle: {
-                        color: '#5ab1ef',
-                      },
-                    },
-                  ],
+    () => props.loading,
+    () => {
+      if (props.loading) {
+        return;
+      }
+      setOptions({
+        legend: {
+          bottom: 0,
+          data: ['访问', '购买'],
+        },
+        tooltip: {},
+        radar: {
+          radius: '60%',
+          splitNumber: 8,
+          indicator: [
+            {
+              text: '电脑',
+              max: 100,
+            },
+            {
+              text: '充电器',
+              max: 100,
+            },
+            {
+              text: '耳机',
+              max: 100,
+            },
+            {
+              text: '手机',
+              max: 100,
+            },
+            {
+              text: 'Ipad',
+              max: 100,
+            },
+            {
+              text: '耳机',
+              max: 100,
+            },
+          ],
+        },
+        series: [
+          {
+            type: 'radar',
+            symbolSize: 0,
+            areaStyle: {
+              shadowBlur: 0,
+              shadowColor: 'rgba(0,0,0,.2)',
+              shadowOffsetX: 0,
+              shadowOffsetY: 10,
+              opacity: 1,
+            },
+            data: [
+              {
+                value: [90, 50, 86, 40, 50, 20],
+                name: '访问',
+                itemStyle: {
+                  color: '#b6a2de',
                 },
-              ],
-            });
+              },
+              {
+                value: [70, 75, 70, 76, 20, 85],
+                name: '购买',
+                itemStyle: {
+                  color: '#5ab1ef',
+                },
+              },
+            ],
           },
-          { immediate: true }
+        ],
+      });
+    },
+    { immediate: true }
   );
 </script>
diff --git a/src/views/dashboard/Analysis/components/VisitSource.vue b/src/views/dashboard/Analysis/components/VisitSource.vue
index 4c64167..7b8e32a 100644
--- a/src/views/dashboard/Analysis/components/VisitSource.vue
+++ b/src/views/dashboard/Analysis/components/VisitSource.vue
@@ -21,60 +21,60 @@
   const chartRef = ref<HTMLDivElement | null>(null);
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
   watch(
-          () => props.loading,
-          () => {
-            if (props.loading) {
-              return;
-            }
-            setOptions({
-              tooltip: {
-                trigger: 'item',
+    () => props.loading,
+    () => {
+      if (props.loading) {
+        return;
+      }
+      setOptions({
+        tooltip: {
+          trigger: 'item',
+        },
+        legend: {
+          bottom: '1%',
+          left: 'center',
+        },
+        series: [
+          {
+            color: ['#5ab1ef', '#b6a2de', '#67e0e3', '#2ec7c9'],
+            name: '访问来源',
+            type: 'pie',
+            radius: ['40%', '70%'],
+            avoidLabelOverlap: false,
+            itemStyle: {
+              borderRadius: 10,
+              borderColor: '#fff',
+              borderWidth: 2,
+            },
+            label: {
+              show: false,
+              position: 'center',
+            },
+            emphasis: {
+              label: {
+                show: true,
+                fontSize: '12',
+                fontWeight: 'bold',
               },
-              legend: {
-                bottom: '1%',
-                left: 'center',
-              },
-              series: [
-                {
-                  color: ['#5ab1ef', '#b6a2de', '#67e0e3', '#2ec7c9'],
-                  name: '访问来源',
-                  type: 'pie',
-                  radius: ['40%', '70%'],
-                  avoidLabelOverlap: false,
-                  itemStyle: {
-                    borderRadius: 10,
-                    borderColor: '#fff',
-                    borderWidth: 2,
-                  },
-                  label: {
-                    show: false,
-                    position: 'center',
-                  },
-                  emphasis: {
-                    label: {
-                      show: true,
-                      fontSize: '12',
-                      fontWeight: 'bold',
-                    },
-                  },
-                  labelLine: {
-                    show: false,
-                  },
-                  data: [
-                    { value: 1048, name: '搜索引擎' },
-                    { value: 735, name: '直接访问' },
-                    { value: 580, name: '邮件营销' },
-                    { value: 484, name: '联盟广告' },
-                  ],
-                  animationType: 'scale',
-                  animationEasing: 'exponentialInOut',
-                  animationDelay: function () {
-                    return Math.random() * 100;
-                  },
-                },
-              ],
-            });
+            },
+            labelLine: {
+              show: false,
+            },
+            data: [
+              { value: 1048, name: '搜索引擎' },
+              { value: 735, name: '直接访问' },
+              { value: 580, name: '邮件营销' },
+              { value: 484, name: '联盟广告' },
+            ],
+            animationType: 'scale',
+            animationEasing: 'exponentialInOut',
+            animationDelay: function () {
+              return Math.random() * 100;
+            },
           },
-          { immediate: true }
+        ],
+      });
+    },
+    { immediate: true }
   );
 </script>
diff --git a/src/views/dashboard/Analysis/data.ts b/src/views/dashboard/Analysis/data.ts
index 01060d4..94a0e42 100644
--- a/src/views/dashboard/Analysis/data.ts
+++ b/src/views/dashboard/Analysis/data.ts
@@ -44,165 +44,178 @@ export const growCardList: GrowCardItem[] = [
 ];
 
 export const chartCardList: GrowCardItem[] = [
-    {
-        title: '总销售额',
-        icon: 'visit-count|svg',
-        total: 126560,
-        value: 234.56,
-        footer: '日均销售额',
-    },
-    {
-        title: '订单量',
-        icon: 'total-sales|svg',
-        value: 1234,
-        total: 8846,
-        color: 'blue',
-        footer: '日订单量',
-    },
-    {
-        title: '支付笔数',
-        icon: 'download-count|svg',
-        value: 60,
-        total: 6560,
-        color: 'orange',
-        footer: '转化率',
-    },
-    {
-        title: '运营活动效果',
-        icon: 'transaction|svg',
-        total: 78,
-    },
+  {
+    title: '总销售额',
+    icon: 'visit-count|svg',
+    total: 126560,
+    value: 234.56,
+    footer: '日均销售额',
+  },
+  {
+    title: '订单量',
+    icon: 'total-sales|svg',
+    value: 1234,
+    total: 8846,
+    color: 'blue',
+    footer: '日订单量',
+  },
+  {
+    title: '支付笔数',
+    icon: 'download-count|svg',
+    value: 60,
+    total: 6560,
+    color: 'orange',
+    footer: '转化率',
+  },
+  {
+    title: '运营活动效果',
+    icon: 'transaction|svg',
+    total: 78,
+  },
 ];
 export const bdcCardList: GrowCardItem[] = [
-    {
-        title: '受理量',
-        icon: 'ant-design:info-circle-outlined',
-        total: 100,
-        value: 60,
-        footer: '今日受理量',
-    },
-    {
-        title: '办结量',
-        icon: 'ant-design:info-circle-outlined',
-        value: 54,
-        total: 87,
-        color: 'blue',
-        footer: '今日办结量',
-    },
-    {
-        title: '用户受理量',
-        icon: 'ant-design:info-circle-outlined',
-        value: 13,
-        total: 15,
-        color: 'orange',
-        footer: '用户今日受理量',
-    },
-    {
-        title: '用户办结量',
-        icon: 'ant-design:info-circle-outlined',
-        total: 9,
-        value: 7,
-        footer: '用户今日办结量',
-    },
+  {
+    title: '受理量',
+    icon: 'ant-design:info-circle-outlined',
+    total: 100,
+    value: 60,
+    footer: '今日受理量',
+  },
+  {
+    title: '办结量',
+    icon: 'ant-design:info-circle-outlined',
+    value: 54,
+    total: 87,
+    color: 'blue',
+    footer: '今日办结量',
+  },
+  {
+    title: '用户受理量',
+    icon: 'ant-design:info-circle-outlined',
+    value: 13,
+    total: 15,
+    color: 'orange',
+    footer: '用户今日受理量',
+  },
+  {
+    title: '用户办结量',
+    icon: 'ant-design:info-circle-outlined',
+    total: 9,
+    value: 7,
+    footer: '用户今日办结量',
+  },
 ];
 
 export const table = {
-     dataSource : [
-        {reBizCode:"1",type:"转移登记",acceptBy:'张三',acceptDate:"2019-01-22",curNode:"任务分派",flowRate:60},
-        {reBizCode:"2",type:"抵押登记",acceptBy:'李四',acceptDate:"2019-01-23",curNode:"领导审核",flowRate:30},
-        {reBizCode:"3",type:"转移登记",acceptBy:'王武',acceptDate:"2019-01-25",curNode:"任务处理",flowRate:20},
-        {reBizCode:"4",type:"转移登记",acceptBy:'赵楼',acceptDate:"2019-11-22",curNode:"部门审核",flowRate:80},
-        {reBizCode:"5",type:"转移登记",acceptBy:'钱就',acceptDate:"2019-12-12",curNode:"任务分派",flowRate:90},
-        {reBizCode:"6",type:"转移登记",acceptBy:'孙吧',acceptDate:"2019-03-06",curNode:"任务处理",flowRate:10},
-        {reBizCode:"7",type:"抵押登记",acceptBy:'周大',acceptDate:"2019-04-13",curNode:"任务分派",flowRate:100},
-        {reBizCode:"8",type:"抵押登记",acceptBy:'吴二',acceptDate:"2019-05-09",curNode:"任务上报",flowRate:50},
-        {reBizCode:"9",type:"抵押登记",acceptBy:'郑爽',acceptDate:"2019-07-12",curNode:"任务处理",flowRate:63},
-        {reBizCode:"20",type:"抵押登记",acceptBy:'林有',acceptDate:"2019-12-12",curNode:"任务打回",flowRate:59},
-        {reBizCode:"11",type:"转移登记",acceptBy:'码云',acceptDate:"2019-09-10",curNode:"任务签收",flowRate:87}
-    ],
-     columns: [{
-        title: '业务号',
-        align:"center",
-        dataIndex: 'reBizCode'
-    },{
-        title: '业务类型',
-        align:"center",
-        dataIndex: 'type'
-    },{
-        title: '受理人',
-        align:"center",
-        dataIndex: 'acceptBy'
-    },{
-        title: '受理时间',
-        align:"center",
-        dataIndex: 'acceptDate'
-    },{
-        title: '当前节点',
-        align:"center",
-        dataIndex: 'curNode'
-    },{
-        title: '办理时长',
-        align:"center",
-        dataIndex: 'flowRate',
-        slots: { customRender: 'flowRate' }
-    }],
-    ipagination:{
-        current: 1,
-        pageSize: 5,
-        pageSizeOptions: ['10', '20', '30'],
-        showTotal: (total, range) => {
-            return range[0] + "-" + range[1] + " 共" + total + "条"
-        },
-        showQuickJumper: true,
-        showSizeChanger: true,
-        total: 0,
-    }
+  dataSource: [
+    { reBizCode: '1', type: '转移登记', acceptBy: '张三', acceptDate: '2019-01-22', curNode: '任务分派', flowRate: 60 },
+    { reBizCode: '2', type: '抵押登记', acceptBy: '李四', acceptDate: '2019-01-23', curNode: '领导审核', flowRate: 30 },
+    { reBizCode: '3', type: '转移登记', acceptBy: '王武', acceptDate: '2019-01-25', curNode: '任务处理', flowRate: 20 },
+    { reBizCode: '4', type: '转移登记', acceptBy: '赵楼', acceptDate: '2019-11-22', curNode: '部门审核', flowRate: 80 },
+    { reBizCode: '5', type: '转移登记', acceptBy: '钱就', acceptDate: '2019-12-12', curNode: '任务分派', flowRate: 90 },
+    { reBizCode: '6', type: '转移登记', acceptBy: '孙吧', acceptDate: '2019-03-06', curNode: '任务处理', flowRate: 10 },
+    { reBizCode: '7', type: '抵押登记', acceptBy: '周大', acceptDate: '2019-04-13', curNode: '任务分派', flowRate: 100 },
+    { reBizCode: '8', type: '抵押登记', acceptBy: '吴二', acceptDate: '2019-05-09', curNode: '任务上报', flowRate: 50 },
+    { reBizCode: '9', type: '抵押登记', acceptBy: '郑爽', acceptDate: '2019-07-12', curNode: '任务处理', flowRate: 63 },
+    { reBizCode: '20', type: '抵押登记', acceptBy: '林有', acceptDate: '2019-12-12', curNode: '任务打回', flowRate: 59 },
+    { reBizCode: '11', type: '转移登记', acceptBy: '码云', acceptDate: '2019-09-10', curNode: '任务签收', flowRate: 87 },
+  ],
+  columns: [
+    {
+      title: '业务号',
+      align: 'center',
+      dataIndex: 'reBizCode',
+    },
+    {
+      title: '业务类型',
+      align: 'center',
+      dataIndex: 'type',
+    },
+    {
+      title: '受理人',
+      align: 'center',
+      dataIndex: 'acceptBy',
+    },
+    {
+      title: '受理时间',
+      align: 'center',
+      dataIndex: 'acceptDate',
+    },
+    {
+      title: '当前节点',
+      align: 'center',
+      dataIndex: 'curNode',
+    },
+    {
+      title: '办理时长',
+      align: 'center',
+      dataIndex: 'flowRate',
+      slots: { customRender: 'flowRate' },
+    },
+  ],
+  ipagination: {
+    current: 1,
+    pageSize: 5,
+    pageSizeOptions: ['10', '20', '30'],
+    showTotal: (total, range) => {
+      return range[0] + '-' + range[1] + ' 共' + total + '条';
+    },
+    showQuickJumper: true,
+    showSizeChanger: true,
+    total: 0,
+  },
 };
 export const table1 = {
-     dataSource : [
-         {reBizCode:"A001",type:"转移登记",acceptBy:'张四',acceptDate:"2019-01-22",curNode:"任务分派",flowRate:12},
-         {reBizCode:"A002",type:"抵押登记",acceptBy:'李吧',acceptDate:"2019-01-23",curNode:"任务签收",flowRate:3},
-         {reBizCode:"A003",type:"转移登记",acceptBy:'王三',acceptDate:"2019-01-25",curNode:"任务处理",flowRate:24},
-         {reBizCode:"A004",type:"转移登记",acceptBy:'赵二',acceptDate:"2019-11-22",curNode:"部门审核",flowRate:10},
-         {reBizCode:"A005",type:"转移登记",acceptBy:'钱大',acceptDate:"2019-12-12",curNode:"任务签收",flowRate:8},
-         {reBizCode:"A006",type:"转移登记",acceptBy:'孙就',acceptDate:"2019-03-06",curNode:"任务处理",flowRate:10},
-         {reBizCode:"A007",type:"抵押登记",acceptBy:'周晕',acceptDate:"2019-04-13",curNode:"部门审核",flowRate:24},
-         {reBizCode:"A008",type:"抵押登记",acceptBy:'吴有',acceptDate:"2019-05-09",curNode:"部门审核",flowRate:30},
-         {reBizCode:"A009",type:"抵押登记",acceptBy:'郑武',acceptDate:"2019-07-12",curNode:"任务分派",flowRate:1},
-         {reBizCode:"A0010",type:"抵押登记",acceptBy:'林爽',acceptDate:"2019-12-12",curNode:"部门审核",flowRate:16},
-         {reBizCode:"A0011",type:"转移登记",acceptBy:'码楼',acceptDate:"2019-09-10",curNode:"部门审核",flowRate:7},
-     ],
-     columns: [{
-         title: '业务号',
-         align:"center",
-         dataIndex: 'reBizCode'
-     },{
-         title: '受理人',
-         align:"center",
-         dataIndex: 'acceptBy'
-     },{
-         title: '发起时间',
-         align:"center",
-         dataIndex: 'acceptDate'
-     },{
-         title: '当前节点',
-         align:"center",
-         dataIndex: 'curNode'
-     },{
-         title: '超时时间',
-         align:"center",
-         dataIndex: 'flowRate',
-         slots: { customRender: 'flowRate' }
-     }],
-    ipagination:{
-        current: 1,
-        pageSize: 5,
-        pageSizeOptions: ['10', '20', '30'],
-        showTotal: (total, range) => {
-            return range[0] + "-" + range[1] + " 共" + total + "条"
-        },
-        showQuickJumper: true,
-        showSizeChanger: true,
-        total: 0,
-    }
+  dataSource: [
+    { reBizCode: 'A001', type: '转移登记', acceptBy: '张四', acceptDate: '2019-01-22', curNode: '任务分派', flowRate: 12 },
+    { reBizCode: 'A002', type: '抵押登记', acceptBy: '李吧', acceptDate: '2019-01-23', curNode: '任务签收', flowRate: 3 },
+    { reBizCode: 'A003', type: '转移登记', acceptBy: '王三', acceptDate: '2019-01-25', curNode: '任务处理', flowRate: 24 },
+    { reBizCode: 'A004', type: '转移登记', acceptBy: '赵二', acceptDate: '2019-11-22', curNode: '部门审核', flowRate: 10 },
+    { reBizCode: 'A005', type: '转移登记', acceptBy: '钱大', acceptDate: '2019-12-12', curNode: '任务签收', flowRate: 8 },
+    { reBizCode: 'A006', type: '转移登记', acceptBy: '孙就', acceptDate: '2019-03-06', curNode: '任务处理', flowRate: 10 },
+    { reBizCode: 'A007', type: '抵押登记', acceptBy: '周晕', acceptDate: '2019-04-13', curNode: '部门审核', flowRate: 24 },
+    { reBizCode: 'A008', type: '抵押登记', acceptBy: '吴有', acceptDate: '2019-05-09', curNode: '部门审核', flowRate: 30 },
+    { reBizCode: 'A009', type: '抵押登记', acceptBy: '郑武', acceptDate: '2019-07-12', curNode: '任务分派', flowRate: 1 },
+    { reBizCode: 'A0010', type: '抵押登记', acceptBy: '林爽', acceptDate: '2019-12-12', curNode: '部门审核', flowRate: 16 },
+    { reBizCode: 'A0011', type: '转移登记', acceptBy: '码楼', acceptDate: '2019-09-10', curNode: '部门审核', flowRate: 7 },
+  ],
+  columns: [
+    {
+      title: '业务号',
+      align: 'center',
+      dataIndex: 'reBizCode',
+    },
+    {
+      title: '受理人',
+      align: 'center',
+      dataIndex: 'acceptBy',
+    },
+    {
+      title: '发起时间',
+      align: 'center',
+      dataIndex: 'acceptDate',
+    },
+    {
+      title: '当前节点',
+      align: 'center',
+      dataIndex: 'curNode',
+    },
+    {
+      title: '超时时间',
+      align: 'center',
+      dataIndex: 'flowRate',
+      slots: { customRender: 'flowRate' },
+    },
+  ],
+  ipagination: {
+    current: 1,
+    pageSize: 5,
+    pageSizeOptions: ['10', '20', '30'],
+    showTotal: (total, range) => {
+      return range[0] + '-' + range[1] + ' 共' + total + '条';
+    },
+    showQuickJumper: true,
+    showSizeChanger: true,
+    total: 0,
+  },
 };
diff --git a/src/views/dashboard/Analysis/homePage/IndexBdc.vue b/src/views/dashboard/Analysis/homePage/IndexBdc.vue
index bec333b..fb74ea2 100644
--- a/src/views/dashboard/Analysis/homePage/IndexBdc.vue
+++ b/src/views/dashboard/Analysis/homePage/IndexBdc.vue
@@ -1,219 +1,214 @@
 <template>
-    <div class="p-4">
-        <ChartGroupCard class="enter-y" :loading="loading" type="bdc"/>
-        <BdcTabCard class="!my-4 enter-y" :loading="loading"/>
-        <a-row>
-            <a-col :span="24">
-                <a-card :loading="loading" :class="{ 'anty-list-cust':true }" :bordered="false">
+  <div class="p-4">
+    <ChartGroupCard class="enter-y" :loading="loading" type="bdc" />
+    <BdcTabCard class="!my-4 enter-y" :loading="loading" />
+    <a-row>
+      <a-col :span="24">
+        <a-card :loading="loading" :class="{ 'anty-list-cust': true }" :bordered="false">
+          <a-tabs v-model:activeKey="indexBottomTab" size="large" :tab-bar-style="{ marginBottom: '24px', paddingLeft: '16px' }">
+            <template #tabBarExtraContent>
+              <div class="extra-wrapper">
+                <a-radio-group v-model:value="indexRegisterType" @change="changeRegisterType">
+                  <a-radio-button value="转移登记">转移登记</a-radio-button>
+                  <a-radio-button value="抵押登记">抵押登记</a-radio-button>
+                  <a-radio-button value="">所有</a-radio-button>
+                </a-radio-group>
+              </div>
+            </template>
 
-                    <a-tabs v-model:activeKey="indexBottomTab" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
-                        <template #tabBarExtraContent>
-                            <div class="extra-wrapper">
-                                <a-radio-group v-model:value="indexRegisterType" @change="changeRegisterType">
-                                    <a-radio-button value="转移登记">转移登记</a-radio-button>
-                                    <a-radio-button value="抵押登记">抵押登记</a-radio-button>
-                                    <a-radio-button value="">所有</a-radio-button>
-                                </a-radio-group>
-                            </div>
-                        </template>
+            <a-tab-pane tab="业务流程限时监管" key="1">
+              <a-table :dataSource="dataSource" size="default" rowKey="reBizCode" :columns="table.columns" :pagination="ipagination" @change="tableChange">
+                <template #flowRate="{ text, record, index }">
+                  <Progress :strokeColor="getPercentColor(record.flowRate)" :format="getPercentFormat" :percent="getFlowRateNumber(record.flowRate)" style="width: 80px" />
+                </template>
+              </a-table>
+            </a-tab-pane>
 
-                        <a-tab-pane tab="业务流程限时监管" key="1">
-                            <a-table :dataSource="dataSource" size="default" rowKey="reBizCode" :columns="table.columns" :pagination="ipagination" @change="tableChange">
-                                <template #flowRate="{text, record, index}">
-                                    <Progress :strokeColor="getPercentColor(record.flowRate)" :format="getPercentFormat" :percent="getFlowRateNumber(record.flowRate)" style="width: 80px"/>
-                                </template>
-                            </a-table>
-                        </a-tab-pane>
-
-                        <a-tab-pane loading="true" tab="业务节点限时监管" key="2">
-                            <a-table :dataSource="dataSource1" size="default" rowKey="reBizCode" :columns="table1.columns" :pagination="ipagination1" @change="tableChange1">
-                                <template #flowRate="{text, record, index}">
-                                    <span style="color: red;">{{ record.flowRate }}小时</span>
-                                </template>
-                            </a-table>
-                        </a-tab-pane>
-
-                    </a-tabs>
-
-                </a-card>
-            </a-col>
-        </a-row>
-    </div>
+            <a-tab-pane loading="true" tab="业务节点限时监管" key="2">
+              <a-table :dataSource="dataSource1" size="default" rowKey="reBizCode" :columns="table1.columns" :pagination="ipagination1" @change="tableChange1">
+                <template #flowRate="{ text, record, index }">
+                  <span style="color: red">{{ record.flowRate }}小时</span>
+                </template>
+              </a-table>
+            </a-tab-pane>
+          </a-tabs>
+        </a-card>
+      </a-col>
+    </a-row>
+  </div>
 </template>
 <script lang="ts" setup>
-    import {ref, unref} from 'vue';
-    import {Progress} from 'ant-design-vue';
-    import ChartGroupCard from '../components/ChartGroupCard.vue';
-    import BdcTabCard from '../components/BdcTabCard.vue';
-    import LineMulti from '/@/components/chart/LineMulti.vue';
-    import HeadInfo from '/@/components/chart/HeadInfo.vue';
-    import {table, table1} from '../data';
+  import { ref, unref } from 'vue';
+  import { Progress } from 'ant-design-vue';
+  import ChartGroupCard from '../components/ChartGroupCard.vue';
+  import BdcTabCard from '../components/BdcTabCard.vue';
+  import LineMulti from '/@/components/chart/LineMulti.vue';
+  import HeadInfo from '/@/components/chart/HeadInfo.vue';
+  import { table, table1 } from '../data';
 
-    const loading = ref(true);
+  const loading = ref(true);
 
-    setTimeout(() => {
-        loading.value = false;
-    }, 500);
+  setTimeout(() => {
+    loading.value = false;
+  }, 500);
 
+  const indexBottomTab = ref('1');
+  const indexRegisterType = ref('转移登记');
+  const dataSource = ref([]);
+  const dataSource1 = ref([]);
+  const ipagination = ref(table.ipagination);
+  const ipagination1 = ref(table1.ipagination);
 
-    const indexBottomTab = ref('1')
-    const indexRegisterType = ref('转移登记')
-    const dataSource = ref([])
-    const dataSource1 = ref([])
-    const ipagination = ref(table.ipagination)
-    const ipagination1 = ref(table1.ipagination)
-
-    function changeRegisterType(e) {
-        indexRegisterType.value = e.target.value
-        if (unref(indexBottomTab) == '1') {
-            loadDataSource()
-        } else {
-            loadDataSource1()
-        }
+  function changeRegisterType(e) {
+    indexRegisterType.value = e.target.value;
+    if (unref(indexBottomTab) == '1') {
+      loadDataSource();
+    } else {
+      loadDataSource1();
     }
+  }
 
-    function tableChange(pagination) {
-        ipagination.value.current = pagination.current
-        ipagination.value.pageSize = pagination.pageSize
-        loadDataSource()
+  function tableChange(pagination) {
+    ipagination.value.current = pagination.current;
+    ipagination.value.pageSize = pagination.pageSize;
+    loadDataSource();
+  }
+
+  function tableChange1(pagination) {
+    ipagination1.value.current = pagination.current;
+    ipagination1.value.pageSize = pagination.pageSize;
+    loadDataSource1();
+  }
+
+  function getFlowRateNumber(value) {
+    return +value;
+  }
+
+  function getPercentFormat(value) {
+    if (value == 100) {
+      return '超时';
+    } else {
+      return value + '%';
     }
+  }
 
-    function tableChange1(pagination) {
-        ipagination1.value.current = pagination.current
-        ipagination1.value.pageSize = pagination.pageSize
-        loadDataSource1()
+  function getPercentColor(value) {
+    let p = +value;
+    if (p >= 90 && p < 100) {
+      return 'rgb(244, 240, 89)';
+    } else if (p >= 100) {
+      return 'red';
+    } else {
+      return 'rgb(16, 142, 233)';
     }
+  }
 
-    function getFlowRateNumber(value) {
-        return +value
-    }
+  function loadDataSource() {
+    dataSource.value = table.dataSource.filter((item) => {
+      if (!unref(indexRegisterType)) {
+        return true;
+      }
+      return item.type == unref(indexRegisterType);
+    });
+  }
 
-    function getPercentFormat(value) {
-        if (value == 100) {
-            return "超时"
-        } else {
-            return value + "%"
-        }
-    }
+  function loadDataSource1() {
+    dataSource1.value = table1.dataSource.filter((item) => {
+      if (!unref(indexRegisterType)) {
+        return true;
+      }
+      return item.type == unref(indexRegisterType);
+    });
+  }
 
-    function getPercentColor(value) {
-        let p = +value
-        if (p >= 90 && p < 100) {
-            return 'rgb(244, 240, 89)'
-        } else if (p >= 100) {
-            return 'red'
-        } else {
-            return 'rgb(16, 142, 233)'
-        }
-    }
-
-    function loadDataSource() {
-        dataSource.value = table.dataSource.filter(item => {
-            if (!unref(indexRegisterType)) {
-                return true
-            }
-            return item.type == unref(indexRegisterType)
-        })
-    }
-
-    function loadDataSource1() {
-        dataSource1.value = table1.dataSource.filter(item => {
-            if (!unref(indexRegisterType)) {
-                return true
-            }
-            return item.type == unref(indexRegisterType)
-        })
-    }
-
-    loadDataSource()
-    loadDataSource1()
+  loadDataSource();
+  loadDataSource1();
 </script>
 
 <style lang="less" scoped>
-    .extra-wrapper {
-        line-height: 55px;
-        padding-right: 24px;
+  .extra-wrapper {
+    line-height: 55px;
+    padding-right: 24px;
 
-        .extra-item {
-            display: inline-block;
-            margin-right: 24px;
+    .extra-item {
+      display: inline-block;
+      margin-right: 24px;
 
-            a {
-                margin-left: 24px;
-            }
-        }
+      a {
+        margin-left: 24px;
+      }
     }
+  }
 
-    .item-group {
-        padding: 20px 0 8px 24px;
-        font-size: 0;
+  .item-group {
+    padding: 20px 0 8px 24px;
+    font-size: 0;
 
-        a {
-            color: rgba(0, 0, 0, 0.65);
-            display: inline-block;
-            font-size: 14px;
-            margin-bottom: 13px;
-            width: 25%;
-        }
+    a {
+      color: rgba(0, 0, 0, 0.65);
+      display: inline-block;
+      font-size: 14px;
+      margin-bottom: 13px;
+      width: 25%;
     }
+  }
 
-    .item-group {
-
-        .more-btn {
-            margin-bottom: 13px;
-            text-align: center;
-        }
+  .item-group {
+    .more-btn {
+      margin-bottom: 13px;
+      text-align: center;
     }
+  }
 
+  .list-content-item {
+    color: rgba(0, 0, 0, 0.45);
+    display: inline-block;
+    vertical-align: middle;
+    font-size: 14px;
+    margin-left: 40px;
+  }
+
+  @media only screen and (min-width: 1600px) {
     .list-content-item {
-        color: rgba(0, 0, 0, .45);
-        display: inline-block;
-        vertical-align: middle;
-        font-size: 14px;
-        margin-left: 40px;
-    }
-
-    @media only screen and (min-width: 1600px) {
-        .list-content-item {
-            margin-left: 60px;
-        }
-    }
-
-    @media only screen and (max-width: 1300px) {
-        .list-content-item {
-            margin-left: 20px;
-        }
-
-        .width-hidden4 {
-            display: none
-        }
+      margin-left: 60px;
     }
+  }
 
+  @media only screen and (max-width: 1300px) {
     .list-content-item {
-        span {
-            line-height: 20px;
-        }
+      margin-left: 20px;
     }
 
-    .list-content-item {
-        p {
-            margin-top: 4px;
-            margin-bottom: 0;
-            line-height: 22px;
-        }
+    .width-hidden4 {
+      display: none;
     }
+  }
 
-    .anty-list-cust {
-        .ant-list-item-meta {
-            flex: 0.3 !important;
-        }
+  .list-content-item {
+    span {
+      line-height: 20px;
     }
+  }
 
-    .anty-list-cust {
-        .ant-list-item-content {
-            flex: 1 !important;
-            justify-content: flex-start !important;
-            margin-left: 20px;
-        }
+  .list-content-item {
+    p {
+      margin-top: 4px;
+      margin-bottom: 0;
+      line-height: 22px;
     }
+  }
+
+  .anty-list-cust {
+    .ant-list-item-meta {
+      flex: 0.3 !important;
+    }
+  }
+
+  .anty-list-cust {
+    .ant-list-item-content {
+      flex: 1 !important;
+      justify-content: flex-start !important;
+      margin-left: 20px;
+    }
+  }
 </style>
diff --git a/src/views/dashboard/Analysis/homePage/IndexChart.vue b/src/views/dashboard/Analysis/homePage/IndexChart.vue
index 1f1235c..7a3e73a 100644
--- a/src/views/dashboard/Analysis/homePage/IndexChart.vue
+++ b/src/views/dashboard/Analysis/homePage/IndexChart.vue
@@ -1,117 +1,116 @@
 <template>
-    <div class="p-4">
-        <ChartGroupCard class="enter-y" :loading="loading" type="chart"/>
-        <SaleTabCard class="!my-4 enter-y" :loading="loading"/>
-        <a-row>
-            <a-col :span="24">
-                <a-card :loading="loading" :bordered="false" title="最近一周访问量统计" :style="{ marginTop: '24px' }">
-                    <a-row>
-                        <a-col :span="6">
-                            <HeadInfo title="今日IP" :content="loginfo.todayIp" icon="environment"></HeadInfo>
-                        </a-col>
-                        <a-col :span="6">
-                            <HeadInfo title="今日访问" :content="loginfo.todayVisitCount" icon="team"></HeadInfo>
-                        </a-col>
-                        <a-col :span="6">
-                            <HeadInfo title="总访问量" :content="loginfo.totalVisitCount" icon="rise"></HeadInfo>
-                        </a-col>
-                    </a-row>
-                    <LineMulti :chartData="lineMultiData" height="50vh" type="line" :option="{legend:{top:'bottom'}}"></LineMulti>
-                </a-card>
+  <div class="p-4">
+    <ChartGroupCard class="enter-y" :loading="loading" type="chart" />
+    <SaleTabCard class="!my-4 enter-y" :loading="loading" />
+    <a-row>
+      <a-col :span="24">
+        <a-card :loading="loading" :bordered="false" title="最近一周访问量统计" :style="{ marginTop: '24px' }">
+          <a-row>
+            <a-col :span="6">
+              <HeadInfo title="今日IP" :content="loginfo.todayIp" icon="environment"></HeadInfo>
             </a-col>
-        </a-row>
-    </div>
+            <a-col :span="6">
+              <HeadInfo title="今日访问" :content="loginfo.todayVisitCount" icon="team"></HeadInfo>
+            </a-col>
+            <a-col :span="6">
+              <HeadInfo title="总访问量" :content="loginfo.totalVisitCount" icon="rise"></HeadInfo>
+            </a-col>
+          </a-row>
+          <LineMulti :chartData="lineMultiData" height="50vh" type="line" :option="{ legend: { top: 'bottom' } }"></LineMulti>
+        </a-card>
+      </a-col>
+    </a-row>
+  </div>
 </template>
 <script lang="ts" setup>
-    import {ref} from 'vue';
-    import ChartGroupCard from '../components/ChartGroupCard.vue';
-    import SaleTabCard from '../components/SaleTabCard.vue';
-    import LineMulti from '/@/components/chart/LineMulti.vue';
-    import HeadInfo from '/@/components/chart/HeadInfo.vue';
-    import {getLoginfo, getVisitInfo} from '../api.ts';
+  import { ref } from 'vue';
+  import ChartGroupCard from '../components/ChartGroupCard.vue';
+  import SaleTabCard from '../components/SaleTabCard.vue';
+  import LineMulti from '/@/components/chart/LineMulti.vue';
+  import HeadInfo from '/@/components/chart/HeadInfo.vue';
+  import { getLoginfo, getVisitInfo } from '../api.ts';
 
-    const loading = ref(true);
+  const loading = ref(true);
 
-    setTimeout(() => {
-        loading.value = false;
-    }, 500);
+  setTimeout(() => {
+    loading.value = false;
+  }, 500);
 
+  const loginfo = ref({});
+  const lineMultiData = ref([]);
 
-    const loginfo = ref({});
-    const lineMultiData = ref([]);
-
-    function initLogInfo() {
-        getLoginfo(null).then((res) => {
-            if (res.success) {
-                Object.keys(res.result).forEach(key => {
-                    res.result[key] = res.result[key] + ""
-                });
-                loginfo.value = res.result;
-            }
+  function initLogInfo() {
+    getLoginfo(null).then((res) => {
+      if (res.success) {
+        Object.keys(res.result).forEach((key) => {
+          res.result[key] = res.result[key] + '';
         });
-        getVisitInfo(null).then((res) => {
-            if (res.success) {
-                lineMultiData.value = [];
-                res.result.forEach(item => {
-                    lineMultiData.value.push({name: item.type, type: 'ip', value: item.ip})
-                    lineMultiData.value.push({name: item.type, type: 'visit', value: item.visit})
-                })
-            }
-        })
-    }
+        loginfo.value = res.result;
+      }
+    });
+    getVisitInfo(null).then((res) => {
+      if (res.success) {
+        lineMultiData.value = [];
+        res.result.forEach((item) => {
+          lineMultiData.value.push({ name: item.type, type: 'ip', value: item.ip });
+          lineMultiData.value.push({ name: item.type, type: 'visit', value: item.visit });
+        });
+      }
+    });
+  }
 
-    initLogInfo();
+  initLogInfo();
 </script>
 
 <style lang="less" scoped>
-    .circle-cust {
-        position: relative;
-        top: 28px;
-        left: -100%;
+  .circle-cust {
+    position: relative;
+    top: 28px;
+    left: -100%;
+  }
+
+  .extra-wrapper {
+    line-height: 55px;
+    padding-right: 24px;
+
+    .extra-item {
+      display: inline-block;
+      margin-right: 24px;
+
+      a {
+        margin-left: 24px;
+      }
+    }
+  }
+
+  /* 首页访问量统计 */
+  .head-info {
+    position: relative;
+    text-align: left;
+    padding: 0 32px 0 0;
+    min-width: 125px;
+
+    &.center {
+      text-align: center;
+      padding: 0 32px;
     }
 
-    .extra-wrapper {
-        line-height: 55px;
-        padding-right: 24px;
-
-        .extra-item {
-            display: inline-block;
-            margin-right: 24px;
-
-            a {
-                margin-left: 24px;
-            }
-        }
+    span {
+      color: rgba(0, 0, 0, 0.45);
+      display: inline-block;
+      font-size: 0.95rem;
+      line-height: 42px;
+      margin-bottom: 4px;
     }
 
-    /* 首页访问量统计 */
-    .head-info {
-        position: relative;
-        text-align: left;
-        padding: 0 32px 0 0;
-        min-width: 125px;
+    p {
+      line-height: 42px;
+      margin: 0;
 
-        &.center {
-            text-align: center;
-            padding: 0 32px;
-        }
-
-        span {
-            color: rgba(0, 0, 0, .45);
-            display: inline-block;
-            font-size: .95rem;
-            line-height: 42px;
-            margin-bottom: 4px;
-        }
-
-        p {
-            line-height: 42px;
-            margin: 0;
-
-            a {
-                font-weight: 600;
-                font-size: 1rem;
-            }
-        }
+      a {
+        font-weight: 600;
+        font-size: 1rem;
+      }
     }
+  }
 </style>
diff --git a/src/views/dashboard/Analysis/homePage/IndexDef.vue b/src/views/dashboard/Analysis/homePage/IndexDef.vue
index e5bfd86..48dec86 100644
--- a/src/views/dashboard/Analysis/homePage/IndexDef.vue
+++ b/src/views/dashboard/Analysis/homePage/IndexDef.vue
@@ -1,25 +1,25 @@
 <template>
-    <div class="p-4">
-        <GrowCard :loading="loading" class="enter-y"/>
-        <SiteAnalysis class="!my-4 enter-y" :loading="loading"/>
-        <div class="md:flex enter-y">
-            <VisitRadar class="md:w-1/3 w-full" :loading="loading"/>
-            <VisitSource class="md:w-1/3 !md:mx-4 !md:my-0 !my-4 w-full" :loading="loading"/>
-            <SalesProductPie class="md:w-1/3 w-full" :loading="loading"/>
-        </div>
+  <div class="p-4">
+    <GrowCard :loading="loading" class="enter-y" />
+    <SiteAnalysis class="!my-4 enter-y" :loading="loading" />
+    <div class="md:flex enter-y">
+      <VisitRadar class="md:w-1/3 w-full" :loading="loading" />
+      <VisitSource class="md:w-1/3 !md:mx-4 !md:my-0 !my-4 w-full" :loading="loading" />
+      <SalesProductPie class="md:w-1/3 w-full" :loading="loading" />
     </div>
+  </div>
 </template>
 <script lang="ts" setup>
-    import {ref} from 'vue';
-    import GrowCard from '../components/GrowCard.vue';
-    import SiteAnalysis from '../components/SiteAnalysis.vue';
-    import VisitSource from '../components/VisitSource.vue';
-    import VisitRadar from '../components/VisitRadar.vue';
-    import SalesProductPie from '../components/SalesProductPie.vue';
+  import { ref } from 'vue';
+  import GrowCard from '../components/GrowCard.vue';
+  import SiteAnalysis from '../components/SiteAnalysis.vue';
+  import VisitSource from '../components/VisitSource.vue';
+  import VisitRadar from '../components/VisitRadar.vue';
+  import SalesProductPie from '../components/SalesProductPie.vue';
 
-    const loading = ref(true);
+  const loading = ref(true);
 
-    setTimeout(() => {
-        loading.value = false;
-    }, 500);
+  setTimeout(() => {
+    loading.value = false;
+  }, 500);
 </script>
diff --git a/src/views/dashboard/Analysis/homePage/IndexTask.vue b/src/views/dashboard/Analysis/homePage/IndexTask.vue
index 8200643..6479c9d 100644
--- a/src/views/dashboard/Analysis/homePage/IndexTask.vue
+++ b/src/views/dashboard/Analysis/homePage/IndexTask.vue
@@ -1,388 +1,372 @@
 <template>
-    <div class="index-container-ty">
-        <a-row type="flex" justify="start" :gutter="3">
-            <a-col :sm="24" :lg="12">
-                <a-card>
-                    <template #title>
-                        <div class="index-md-title">
-                            <img src="../../../../assets/images/daiban.png"/>
-                            我的待办【{{ dataSource1.length }}】
-                        </div>
-                    </template>
+  <div class="index-container-ty">
+    <a-row type="flex" justify="start" :gutter="3">
+      <a-col :sm="24" :lg="12">
+        <a-card>
+          <template #title>
+            <div class="index-md-title">
+              <img src="../../../../assets/images/daiban.png" />
+              我的待办【{{ dataSource1.length }}】
+            </div>
+          </template>
 
-                    <template v-if="dataSource1 && dataSource1.length>0" #extra>
-                        <a @click="goPage">更多
-                            <Icon icon="ant-design:double-right-outlined"/>
-                        </a>
-                    </template>
+          <template v-if="dataSource1 && dataSource1.length > 0" #extra>
+            <a @click="goPage"
+              >更多
+              <Icon icon="ant-design:double-right-outlined" />
+            </a>
+          </template>
 
-                    <a-table
-                            :class="'my-index-table tytable1'"
-                            ref="table1"
-                            size="small"
-                            rowKey="id"
-                            :columns="columns"
-                            :dataSource="dataSource1"
-                            :pagination="false">
-                        <template #ellipsisText="{text}">
-                            <JEllipsis :value="text" :length="textMaxLength"></JEllipsis>
-                        </template>
+          <a-table :class="'my-index-table tytable1'" ref="table1" size="small" rowKey="id" :columns="columns" :dataSource="dataSource1" :pagination="false">
+            <template #ellipsisText="{ text }">
+              <JEllipsis :value="text" :length="textMaxLength"></JEllipsis>
+            </template>
 
-                        <template #dayWarnning="{text,record}">
-                            <BellTwoTone style="font-size: 22px" :twoToneColor="getTipColor(record)"/>
-                        </template>
+            <template #dayWarnning="{ text, record }">
+              <BellTwoTone style="font-size: 22px" :twoToneColor="getTipColor(record)" />
+            </template>
 
-                        <template #action="{text, record}">
-                            <a @click="handleData">办理</a>
-                        </template>
-                    </a-table>
-                </a-card>
-            </a-col>
+            <template #action="{ text, record }">
+              <a @click="handleData">办理</a>
+            </template>
+          </a-table>
+        </a-card>
+      </a-col>
 
-            <a-col :sm="24" :lg="12">
-                <a-card>
-                    <template #title>
-                        <div class="index-md-title">
-                            <img src="../../../../assets/images/zaiban.png"/>
-                            我的在办【{{ dataSource2.length }}】
-                        </div>
-                    </template>
+      <a-col :sm="24" :lg="12">
+        <a-card>
+          <template #title>
+            <div class="index-md-title">
+              <img src="../../../../assets/images/zaiban.png" />
+              我的在办【{{ dataSource2.length }}】
+            </div>
+          </template>
 
-                    <template v-if="dataSource2 && dataSource2.length>0" #extra>
-                        <a @click="goPage">更多
-                            <Icon icon="ant-design:double-right-outlined"/>
-                        </a>
-                    </template>
+          <template v-if="dataSource2 && dataSource2.length > 0" #extra>
+            <a @click="goPage"
+              >更多
+              <Icon icon="ant-design:double-right-outlined" />
+            </a>
+          </template>
 
-                    <a-table
-                            :class="'my-index-table tytable2'"
-                            ref="table1"
-                            size="small"
-                            rowKey="id"
-                            :columns="columns"
-                            :dataSource="dataSource2"
-                            :pagination="false">
-                        <template #ellipsisText="{text}">
-                            <JEllipsis :value="text" :length="textMaxLength"></JEllipsis>
-                        </template>
+          <a-table :class="'my-index-table tytable2'" ref="table1" size="small" rowKey="id" :columns="columns" :dataSource="dataSource2" :pagination="false">
+            <template #ellipsisText="{ text }">
+              <JEllipsis :value="text" :length="textMaxLength"></JEllipsis>
+            </template>
 
-                        <template #dayWarnning="{text,record}">
-                            <BellTwoTone style="font-size: 22px" :twoToneColor="getTipColor(record)"/>
-                        </template>
+            <template #dayWarnning="{ text, record }">
+              <BellTwoTone style="font-size: 22px" :twoToneColor="getTipColor(record)" />
+            </template>
 
-                        <template #action="{text, record}">
-                            <a @click="handleData">办理</a>
-                        </template>
-                    </a-table>
-                </a-card>
-            </a-col>
+            <template #action="{ text, record }">
+              <a @click="handleData">办理</a>
+            </template>
+          </a-table>
+        </a-card>
+      </a-col>
 
-            <a-col :span="24">
-                <div style="height: 5px;"></div>
-            </a-col>
+      <a-col :span="24">
+        <div style="height: 5px"></div>
+      </a-col>
 
-            <a-col :sm="24" :lg="12">
-                <a-card>
-                    <template #title>
-                        <div class="index-md-title">
-                            <img src="../../../../assets/images/guaz.png"/>
-                            我的挂账【{{ dataSource4.length }}】
-                        </div>
-                    </template>
+      <a-col :sm="24" :lg="12">
+        <a-card>
+          <template #title>
+            <div class="index-md-title">
+              <img src="../../../../assets/images/guaz.png" />
+              我的挂账【{{ dataSource4.length }}】
+            </div>
+          </template>
 
-                    <a-table
-                            :class="'my-index-table tytable4'"
-                            ref="table1"
-                            size="small"
-                            rowKey="id"
-                            :columns="columns"
-                            :dataSource="dataSource4"
-                            :pagination="false">
-                        <template #ellipsisText="{text}">
-                            <JEllipsis :value="text" :length="textMaxLength"></JEllipsis>
-                        </template>
+          <a-table :class="'my-index-table tytable4'" ref="table1" size="small" rowKey="id" :columns="columns" :dataSource="dataSource4" :pagination="false">
+            <template #ellipsisText="{ text }">
+              <JEllipsis :value="text" :length="textMaxLength"></JEllipsis>
+            </template>
 
-                        <template #dayWarnning="{text,record}">
-                            <BellTwoTone style="font-size: 22px" :twoToneColor="getTipColor(record)"/>
-                        </template>
+            <template #dayWarnning="{ text, record }">
+              <BellTwoTone style="font-size: 22px" :twoToneColor="getTipColor(record)" />
+            </template>
 
-                        <template #action="{text, record}">
-                            <a @click="handleData">办理</a>
-                        </template>
-                    </a-table>
-                </a-card>
-            </a-col>
+            <template #action="{ text, record }">
+              <a @click="handleData">办理</a>
+            </template>
+          </a-table>
+        </a-card>
+      </a-col>
 
-            <a-col :sm="24" :lg="12">
-                <a-card>
-                    <template #title>
-                        <div class="index-md-title">
-                            <img src="../../../../assets/images/duban.png"/>
-                            我的督办【{{ dataSource3.length }}】
-                        </div>
-                    </template>
+      <a-col :sm="24" :lg="12">
+        <a-card>
+          <template #title>
+            <div class="index-md-title">
+              <img src="../../../../assets/images/duban.png" />
+              我的督办【{{ dataSource3.length }}】
+            </div>
+          </template>
 
-                    <a-table
-                            :class="'my-index-table tytable3'"
-                            ref="table1"
-                            size="small"
-                            rowKey="id"
-                            :columns="columns"
-                            :dataSource="dataSource3"
-                            :pagination="false">
-                        <template #ellipsisText="{text}">
-                            <JEllipsis :value="text" :length="textMaxLength"></JEllipsis>
-                        </template>
+          <a-table :class="'my-index-table tytable3'" ref="table1" size="small" rowKey="id" :columns="columns" :dataSource="dataSource3" :pagination="false">
+            <template #ellipsisText="{ text }">
+              <JEllipsis :value="text" :length="textMaxLength"></JEllipsis>
+            </template>
 
-                        <template #dayWarnning="{text,record}">
-                            <BellTwoTone style="font-size: 22px" :twoToneColor="getTipColor(record)"/>
-                        </template>
+            <template #dayWarnning="{ text, record }">
+              <BellTwoTone style="font-size: 22px" :twoToneColor="getTipColor(record)" />
+            </template>
 
-                        <template #action="{text, record}">
-                            <a @click="handleData">办理</a>
-                        </template>
-                    </a-table>
-                </a-card>
-            </a-col>
-        </a-row>
-    </div>
+            <template #action="{ text, record }">
+              <a @click="handleData">办理</a>
+            </template>
+          </a-table>
+        </a-card>
+      </a-col>
+    </a-row>
+  </div>
 </template>
 
 <script lang="ts" setup>
-    import {ref} from 'vue'
-    import noDataPng from '/@/assets/images/nodata.png'
-    import {useMessage} from '/@/hooks/web/useMessage'
-    import {JEllipsis} from '/@/components/Form'
-    import {BulbTwoTone, BellTwoTone} from '@ant-design/icons-vue';
+  import { ref } from 'vue';
+  import noDataPng from '/@/assets/images/nodata.png';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { JEllipsis } from '/@/components/Form';
+  import { BulbTwoTone, BellTwoTone } from '@ant-design/icons-vue';
 
-    const tempSs1 = [
-        {
-            id: "001",
-            orderNo: "电[1]1267102",
-            orderTitle: "药品出问题了",
-            restDay: 1
-        }, {
-            id: "002",
-            orderNo: "电[4]5967102",
-            orderTitle: "吃了xxx医院的药，病情越来越严重",
-            restDay: 0
-        }, {
-            id: "003",
-            orderNo: "电[3]5988987",
-            orderTitle: "今天去超市买鸡蛋，鸡蛋都是坏的",
-            restDay: 7
-        }, {
-            id: "004",
-            orderNo: "电[2]5213491",
-            orderTitle: "xx宝实体店高价售卖xx",
-            restDay: 5
-        }, {
-            id: "005",
-            orderNo: "电[1]1603491",
-            orderTitle: "以红利相诱，答应退保后扣一年费用",
-            restDay: 0
-        }]
+  const tempSs1 = [
+    {
+      id: '001',
+      orderNo: '电[1]1267102',
+      orderTitle: '药品出问题了',
+      restDay: 1,
+    },
+    {
+      id: '002',
+      orderNo: '电[4]5967102',
+      orderTitle: '吃了xxx医院的药，病情越来越严重',
+      restDay: 0,
+    },
+    {
+      id: '003',
+      orderNo: '电[3]5988987',
+      orderTitle: '今天去超市买鸡蛋，鸡蛋都是坏的',
+      restDay: 7,
+    },
+    {
+      id: '004',
+      orderNo: '电[2]5213491',
+      orderTitle: 'xx宝实体店高价售卖xx',
+      restDay: 5,
+    },
+    {
+      id: '005',
+      orderNo: '电[1]1603491',
+      orderTitle: '以红利相诱，答应退保后扣一年费用',
+      restDay: 0,
+    },
+  ];
 
-    const tempSs2 = [
-        {
-            id: "001",
-            orderTitle: "我要投诉这个大超市",
-            orderNo: "电[1]10299456",
-            restDay: 6
-        }, {
-            id: "002",
-            orderTitle: "xxx医院乱开药方,售卖假药",
-            orderNo: "电[2]20235691",
-            restDay: 0
-        }, {
-            id: "003",
-            orderTitle: "我想问问这家店是干啥的",
-            orderNo: "电[3]495867322",
-            restDay: 7
-        }, {
-            id: "004",
-            orderTitle: "我要举报朝阳区奥森公园酒店",
-            orderNo: "电[2]1193849",
-            restDay: 3
-        }, {
-            id: "005",
-            orderTitle: "我今天吃饭吃到一个石头子",
-            orderNo: "电[4]56782344",
-            restDay: 9
-        }]
+  const tempSs2 = [
+    {
+      id: '001',
+      orderTitle: '我要投诉这个大超市',
+      orderNo: '电[1]10299456',
+      restDay: 6,
+    },
+    {
+      id: '002',
+      orderTitle: 'xxx医院乱开药方,售卖假药',
+      orderNo: '电[2]20235691',
+      restDay: 0,
+    },
+    {
+      id: '003',
+      orderTitle: '我想问问这家店是干啥的',
+      orderNo: '电[3]495867322',
+      restDay: 7,
+    },
+    {
+      id: '004',
+      orderTitle: '我要举报朝阳区奥森公园酒店',
+      orderNo: '电[2]1193849',
+      restDay: 3,
+    },
+    {
+      id: '005',
+      orderTitle: '我今天吃饭吃到一个石头子',
+      orderNo: '电[4]56782344',
+      restDay: 9,
+    },
+  ];
 
-    //4-7天
-    const tip_green = "rgba(0, 255, 0, 1)";
-    //1-3天
-    const tip_yellow = "rgba(255, 255, 0, 1)";
-    //超期
-    const tip_red = "rgba(255, 0, 0, 1)";
+  //4-7天
+  const tip_green = 'rgba(0, 255, 0, 1)';
+  //1-3天
+  const tip_yellow = 'rgba(255, 255, 0, 1)';
+  //超期
+  const tip_red = 'rgba(255, 0, 0, 1)';
 
-    const textMaxLength = 8;
-    const $message = useMessage()
+  const textMaxLength = 8;
+  const $message = useMessage();
 
-    const dataSource1 = ref([]);
-    const dataSource2 = ref([]);
-    const dataSource3 = ref([]);
-    const dataSource4 = ref([]);
-    const columns = [
-        {
-            title: '',
-            dataIndex: '',
-            key: 'rowIndex',
-            width: 50,
-            fixed: 'left',
-            align: "center",
-            slots: {customRender: "dayWarnning"}
-        },
-        {
-            title: '剩余天数',
-            align: "center",
-            dataIndex: 'restDay',
-            width: 80
-        },
-        {
-            title: '工单标题',
-            align: "center",
-            dataIndex: 'orderTitle',
-            slots: {customRender: "ellipsisText"}
-        },
-        {
-            title: '工单编号',
-            align: "center",
-            dataIndex: 'orderNo',
-        },
-        {
-            title: '操作',
-            dataIndex: 'action',
-            align: "center",
-            slots: {customRender: 'action'}
-        }
-    ];
+  const dataSource1 = ref([]);
+  const dataSource2 = ref([]);
+  const dataSource3 = ref([]);
+  const dataSource4 = ref([]);
+  const columns = [
+    {
+      title: '',
+      dataIndex: '',
+      key: 'rowIndex',
+      width: 50,
+      fixed: 'left',
+      align: 'center',
+      slots: { customRender: 'dayWarnning' },
+    },
+    {
+      title: '剩余天数',
+      align: 'center',
+      dataIndex: 'restDay',
+      width: 80,
+    },
+    {
+      title: '工单标题',
+      align: 'center',
+      dataIndex: 'orderTitle',
+      slots: { customRender: 'ellipsisText' },
+    },
+    {
+      title: '工单编号',
+      align: 'center',
+      dataIndex: 'orderNo',
+    },
+    {
+      title: '操作',
+      dataIndex: 'action',
+      align: 'center',
+      slots: { customRender: 'action' },
+    },
+  ];
 
-    function getTipColor(rd) {
-        let num = rd.restDay;
-        if (num <= 0) {
-            return tip_red
-        } else if (num >= 1 && num < 4) {
-            return tip_yellow
-        } else if (num >= 4) {
-            return tip_green
-        }
+  function getTipColor(rd) {
+    let num = rd.restDay;
+    if (num <= 0) {
+      return tip_red;
+    } else if (num >= 1 && num < 4) {
+      return tip_yellow;
+    } else if (num >= 4) {
+      return tip_green;
     }
+  }
 
-    function mock() {
-        dataSource1.value = tempSs1;
-        dataSource2.value = tempSs2;
-        dataSource3.value = tempSs1;
-        dataSource4.value = [];
-        ifNullDataSource(dataSource4, '.tytable4')
+  function mock() {
+    dataSource1.value = tempSs1;
+    dataSource2.value = tempSs2;
+    dataSource3.value = tempSs1;
+    dataSource4.value = [];
+    ifNullDataSource(dataSource4, '.tytable4');
+  }
+
+  function ifNullDataSource(ds, tb) {
+    if (!ds || ds.length == 0) {
+      var tmp = document.createElement('img');
+      tmp.src = noDataPng;
+      tmp.width = 300;
+      let tbclass = `${tb} .ant-table-placeholder`;
+      document.querySelector(tbclass).innerHTML = '';
+      document.querySelector(tbclass).appendChild(tmp);
     }
+  }
 
-    function ifNullDataSource(ds, tb) {
-        if (!ds || ds.length == 0) {
-            var tmp = document.createElement('img');
-            tmp.src = noDataPng;
-            tmp.width = 300;
-            let tbclass = `${tb} .ant-table-placeholder`;
-            document.querySelector(tbclass).innerHTML = "";
-            document.querySelector(tbclass).appendChild(tmp)
-        }
-    }
+  function handleData() {
+    $message.createMessage.success('办理完成');
+  }
 
-    function handleData() {
-        $message.createMessage.success("办理完成")
-    }
+  function goPage() {
+    $message.createMessage.success('请根据具体业务跳转页面');
+  }
 
-    function goPage() {
-        $message.createMessage.success("请根据具体业务跳转页面")
-    }
-
-    mock();
+  mock();
 </script>
 
 <style scoped lang="less">
-    .my-index-table {
-        height: 270px;
+  .my-index-table {
+    height: 270px;
 
-        table {
-            font-size: 14px !important;
-        }
+    table {
+      font-size: 14px !important;
+    }
+  }
+
+  .index-container-ty {
+    margin: 12px 12px 0;
+
+    :deep .ant-card-body {
+      padding: 10px 12px 0 12px;
     }
 
-    .index-container-ty {
-        margin: 12px 12px 0;
+    :deep .ant-card-head {
+      line-height: 24px;
+      min-height: 24px;
+      background: #7196fb !important;
 
-        :deep .ant-card-body {
-            padding: 10px 12px 0 12px
+      .ant-card-head-title {
+        padding-top: 6px;
+        padding-bottom: 6px;
+      }
+
+      .ant-card-extra {
+        padding: 0;
+
+        a {
+          color: #fff;
         }
 
-        :deep .ant-card-head {
-            line-height: 24px;
-            min-height: 24px;
-            background: #7196fb !important;
-
-            .ant-card-head-title {
-                padding-top: 6px;
-                padding-bottom: 6px;
-            }
-
-            .ant-card-extra {
-                padding: 0;
-
-                a {
-                    color: #fff
-                }
-
-                a:hover {
-                    color: #152ede
-                }
-            }
-        }
-
-        :deep .ant-table-footer {
-            text-align: right;
-            padding: 6px 12px 6px 6px;
-            background: #fff;
-            border-top: 2px solid #f7f1f1;
-        }
-
-        .index-md-title {
-            position: relative;
-            width: 100%;
-            color: #fff;
-            font-size: 21px;
-            font-family: cursive;
-            padding-left: 25px;
-
-            img {
-                position: absolute;
-                height: 25px;
-                left: 0
-            }
-        }
-
-        :deep .ant-table-thead > tr > th,
-        :deep .ant-table-tbody > tr > td {
-            border-bottom: 1px solid #90aeff;
-        }
-
-        :deep .ant-table-small > .ant-table-content > .ant-table-fixed-left > .ant-table-body-outer > .ant-table-body-inner > table > .ant-table-thead > tr > th,
-        :deep .ant-table-small > .ant-table-content > .ant-table-fixed-right > .ant-table-body-outer > .ant-table-body-inner > table > .ant-table-thead > tr > th {
-            border-bottom: 1px solid #90aeff;
-        }
-
-        :deep .ant-table-small > .ant-table-content > .ant-table-scroll > .ant-table-body > table > .ant-table-thead > tr > th {
-            border-bottom: 1px solid #90aeff;
-        }
-
-        :deep .ant-table-small {
-            border: 1px solid #90aeff;
-        }
-
-        :deep .ant-table-placeholder {
-            padding: 0;
-            height: 215px
+        a:hover {
+          color: #152ede;
         }
+      }
     }
+
+    :deep .ant-table-footer {
+      text-align: right;
+      padding: 6px 12px 6px 6px;
+      background: #fff;
+      border-top: 2px solid #f7f1f1;
+    }
+
+    .index-md-title {
+      position: relative;
+      width: 100%;
+      color: #fff;
+      font-size: 21px;
+      font-family: cursive;
+      padding-left: 25px;
+
+      img {
+        position: absolute;
+        height: 25px;
+        left: 0;
+      }
+    }
+
+    :deep .ant-table-thead > tr > th,
+    :deep .ant-table-tbody > tr > td {
+      border-bottom: 1px solid #90aeff;
+    }
+
+    :deep .ant-table-small > .ant-table-content > .ant-table-fixed-left > .ant-table-body-outer > .ant-table-body-inner > table > .ant-table-thead > tr > th,
+    :deep .ant-table-small > .ant-table-content > .ant-table-fixed-right > .ant-table-body-outer > .ant-table-body-inner > table > .ant-table-thead > tr > th {
+      border-bottom: 1px solid #90aeff;
+    }
+
+    :deep .ant-table-small > .ant-table-content > .ant-table-scroll > .ant-table-body > table > .ant-table-thead > tr > th {
+      border-bottom: 1px solid #90aeff;
+    }
+
+    :deep .ant-table-small {
+      border: 1px solid #90aeff;
+    }
+
+    :deep .ant-table-placeholder {
+      padding: 0;
+      height: 215px;
+    }
+  }
 </style>
diff --git a/src/views/dashboard/Analysis/index.vue b/src/views/dashboard/Analysis/index.vue
index 5c480e5..5ee4e92 100644
--- a/src/views/dashboard/Analysis/index.vue
+++ b/src/views/dashboard/Analysis/index.vue
@@ -1,25 +1,24 @@
 <template>
-    <IndexDef v-if="indexStyle===0"></IndexDef>
-    <IndexChart v-if="indexStyle===1"></IndexChart>
-    <IndexBdc v-if="indexStyle==2"></IndexBdc>
-    <IndexTask v-if="indexStyle==3"></IndexTask>
-    <div style="width: 100%;text-align: right;margin-top: 20px">
-        请选择首页样式：
-        <a-radio-group v-model:value="indexStyle">
-            <a-radio :value="0">默认</a-radio>
-            <a-radio :value="1">销量统计</a-radio>
-            <a-radio :value="2">业务统计</a-radio>
-            <a-radio :value="3">我的任务</a-radio>
-        </a-radio-group>
-    </div>
+  <IndexDef v-if="indexStyle === 0"></IndexDef>
+  <IndexChart v-if="indexStyle === 1"></IndexChart>
+  <IndexBdc v-if="indexStyle == 2"></IndexBdc>
+  <IndexTask v-if="indexStyle == 3"></IndexTask>
+  <div style="width: 100%; text-align: right; margin-top: 20px">
+    请选择首页样式：
+    <a-radio-group v-model:value="indexStyle">
+      <a-radio :value="0">默认</a-radio>
+      <a-radio :value="1">销量统计</a-radio>
+      <a-radio :value="2">业务统计</a-radio>
+      <a-radio :value="3">我的任务</a-radio>
+    </a-radio-group>
+  </div>
 </template>
 <script lang="ts" setup>
-    import {ref} from 'vue';
-    import IndexDef from './homePage/IndexDef.vue';
-    import IndexChart from './homePage/IndexChart.vue';
-    import IndexBdc from './homePage/IndexBdc.vue';
-    import IndexTask from './homePage/IndexTask.vue';
-
-    const indexStyle = ref(0);
+  import { ref } from 'vue';
+  import IndexDef from './homePage/IndexDef.vue';
+  import IndexChart from './homePage/IndexChart.vue';
+  import IndexBdc from './homePage/IndexBdc.vue';
+  import IndexTask from './homePage/IndexTask.vue';
 
+  const indexStyle = ref(0);
 </script>
diff --git a/src/views/dashboard/workbench/components/SaleRadar.vue b/src/views/dashboard/workbench/components/SaleRadar.vue
index 43b0190..99965a7 100644
--- a/src/views/dashboard/workbench/components/SaleRadar.vue
+++ b/src/views/dashboard/workbench/components/SaleRadar.vue
@@ -23,78 +23,78 @@
   const chartRef = ref<HTMLDivElement | null>(null);
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
   watch(
-          () => props.loading,
-          () => {
-            if (props.loading) {
-              return;
-            }
-            setOptions({
-              legend: {
-                bottom: 0,
-                data: ['Visits', 'Sales'],
-              },
-              tooltip: {},
-              radar: {
-                radius: '60%',
-                splitNumber: 8,
-                indicator: [
-                  {
-                    text: '2017',
-                    max: 100,
-                  },
-                  {
-                    text: '2017',
-                    max: 100,
-                  },
-                  {
-                    text: '2018',
-                    max: 100,
-                  },
-                  {
-                    text: '2019',
-                    max: 100,
-                  },
-                  {
-                    text: '2020',
-                    max: 100,
-                  },
-                  {
-                    text: '2021',
-                    max: 100,
-                  },
-                ],
-              },
-              series: [
-                {
-                  type: 'radar',
-                  symbolSize: 0,
-                  areaStyle: {
-                    shadowBlur: 0,
-                    shadowColor: 'rgba(0,0,0,.2)',
-                    shadowOffsetX: 0,
-                    shadowOffsetY: 10,
-                    opacity: 1,
-                  },
-                  data: [
-                    {
-                      value: [90, 50, 86, 40, 50, 20],
-                      name: 'Visits',
-                      itemStyle: {
-                        color: '#b6a2de',
-                      },
-                    },
-                    {
-                      value: [70, 75, 70, 76, 20, 85],
-                      name: 'Sales',
-                      itemStyle: {
-                        color: '#67e0e3',
-                      },
-                    },
-                  ],
+    () => props.loading,
+    () => {
+      if (props.loading) {
+        return;
+      }
+      setOptions({
+        legend: {
+          bottom: 0,
+          data: ['Visits', 'Sales'],
+        },
+        tooltip: {},
+        radar: {
+          radius: '60%',
+          splitNumber: 8,
+          indicator: [
+            {
+              text: '2017',
+              max: 100,
+            },
+            {
+              text: '2017',
+              max: 100,
+            },
+            {
+              text: '2018',
+              max: 100,
+            },
+            {
+              text: '2019',
+              max: 100,
+            },
+            {
+              text: '2020',
+              max: 100,
+            },
+            {
+              text: '2021',
+              max: 100,
+            },
+          ],
+        },
+        series: [
+          {
+            type: 'radar',
+            symbolSize: 0,
+            areaStyle: {
+              shadowBlur: 0,
+              shadowColor: 'rgba(0,0,0,.2)',
+              shadowOffsetX: 0,
+              shadowOffsetY: 10,
+              opacity: 1,
+            },
+            data: [
+              {
+                value: [90, 50, 86, 40, 50, 20],
+                name: 'Visits',
+                itemStyle: {
+                  color: '#b6a2de',
                 },
-              ],
-            });
+              },
+              {
+                value: [70, 75, 70, 76, 20, 85],
+                name: 'Sales',
+                itemStyle: {
+                  color: '#67e0e3',
+                },
+              },
+            ],
           },
-          { immediate: true }
+        ],
+      });
+    },
+    { immediate: true }
   );
 </script>
diff --git a/src/views/dashboard/workbench/index.vue b/src/views/dashboard/workbench/index.vue
index d27efbc..cc17cae 100644
--- a/src/views/dashboard/workbench/index.vue
+++ b/src/views/dashboard/workbench/index.vue
@@ -1,36 +1,36 @@
 <template>
-    <PageWrapper>
-        <template #headerContent> <WorkbenchHeader /> </template>
-        <div class="lg:flex">
-            <div class="lg:w-7/10 w-full !mr-4 enter-y">
-                <ProjectCard :loading="loading" class="enter-y" />
-                <DynamicInfo :loading="loading" class="!my-4 enter-y" />
-            </div>
-            <div class="lg:w-3/10 w-full enter-y">
-                <QuickNav :loading="loading" class="enter-y" />
+  <PageWrapper>
+    <template #headerContent> <WorkbenchHeader /> </template>
+    <div class="lg:flex">
+      <div class="lg:w-7/10 w-full !mr-4 enter-y">
+        <ProjectCard :loading="loading" class="enter-y" />
+        <DynamicInfo :loading="loading" class="!my-4 enter-y" />
+      </div>
+      <div class="lg:w-3/10 w-full enter-y">
+        <QuickNav :loading="loading" class="enter-y" />
 
-                <Card class="!my-4 enter-y" :loading="loading">
-                    <img class="xl:h-50 h-30 mx-auto" src="../../../assets/svg/illustration.svg" />
-                </Card>
+        <Card class="!my-4 enter-y" :loading="loading">
+          <img class="xl:h-50 h-30 mx-auto" src="../../../assets/svg/illustration.svg" />
+        </Card>
 
-                <SaleRadar :loading="loading" class="enter-y" />
-            </div>
-        </div>
-    </PageWrapper>
+        <SaleRadar :loading="loading" class="enter-y" />
+      </div>
+    </div>
+  </PageWrapper>
 </template>
 <script lang="ts" setup>
-    import { ref } from 'vue';
-    import { Card } from 'ant-design-vue';
-    import { PageWrapper } from '/@/components/Page';
-    import WorkbenchHeader from './components/WorkbenchHeader.vue';
-    import ProjectCard from './components/ProjectCard.vue';
-    import QuickNav from './components/QuickNav.vue';
-    import DynamicInfo from './components/DynamicInfo.vue';
-    import SaleRadar from './components/SaleRadar.vue';
+  import { ref } from 'vue';
+  import { Card } from 'ant-design-vue';
+  import { PageWrapper } from '/@/components/Page';
+  import WorkbenchHeader from './components/WorkbenchHeader.vue';
+  import ProjectCard from './components/ProjectCard.vue';
+  import QuickNav from './components/QuickNav.vue';
+  import DynamicInfo from './components/DynamicInfo.vue';
+  import SaleRadar from './components/SaleRadar.vue';
 
-    const loading = ref(true);
+  const loading = ref(true);
 
-    setTimeout(() => {
-        loading.value = false;
-    }, 500);
+  setTimeout(() => {
+    loading.value = false;
+  }, 500);
 </script>
diff --git a/src/views/demo/charts/Pie.vue b/src/views/demo/charts/Pie.vue
index faf2435..4f6110d 100644
--- a/src/views/demo/charts/Pie.vue
+++ b/src/views/demo/charts/Pie.vue
@@ -21,18 +21,7 @@
       const chartRef = ref<HTMLDivElement | null>(null);
       const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
       const dataAll = [389, 259, 262, 324, 232, 176, 196, 214, 133, 370];
-      const yAxisData = [
-        '原因1',
-        '原因2',
-        '原因3',
-        '原因4',
-        '原因5',
-        '原因6',
-        '原因7',
-        '原因8',
-        '原因9',
-        '原因10',
-      ];
+      const yAxisData = ['原因1', '原因2', '原因3', '原因4', '原因5', '原因6', '原因7', '原因8', '原因9', '原因10'];
       onMounted(() => {
         setOptions({
           backgroundColor: '#0f375f',
diff --git a/src/views/demo/charts/china.json b/src/views/demo/charts/china.json
index bbc0a83..27aaf0d 100644
--- a/src/views/demo/charts/china.json
+++ b/src/views/demo/charts/china.json
@@ -14,9 +14,7 @@
         "type": "MultiPolygon",
         "coordinates": [
           ["@@°Ü¯Û"],
-          [
-            "@@ƛĴÕƊÉɼģºðʀ\\ƎsÆNŌÔĚäœnÜƤɊĂǀĆĴžĤNJŨxĚĮǂƺòƌ‚–âÔ®ĮXŦţƸZûЋƕƑGđ¨ĭMó·ęcëƝɉlÝƯֹÅŃ^Ó·śŃNjƏďíåɛGɉ™¿@ăƑŽ¥ĘWǬÏĶŁâ"
-          ],
+          ["@@ƛĴÕƊÉɼģºðʀ\\ƎsÆNŌÔĚäœnÜƤɊĂǀĆĴžĤNJŨxĚĮǂƺòƌ‚–âÔ®ĮXŦţƸZûЋƕƑGđ¨ĭMó·ęcëƝɉlÝƯֹÅŃ^Ó·śŃNjƏďíåɛGɉ™¿@ăƑŽ¥ĘWǬÏĶŁâ"],
           ["@@\\p|WoYG¿¥I†j@¢"],
           ["@@…¡‰@ˆV^RqˆBbAŒnTXeRz¤Lž«³I"],
           ["@@ÆEE—„kWqë @œ"],
@@ -24,16 +22,7 @@
           ["@@„¯ɜÄèaì¯ØǓIġĽ"],
           ["@@çûĖ롖hòř "]
         ],
-        "encodeOffsets": [
-          [[122886, 24033]],
-          [[123335, 22980]],
-          [[122375, 24193]],
-          [[122518, 24117]],
-          [[124427, 22618]],
-          [[124862, 26043]],
-          [[126259, 26318]],
-          [[127671, 26683]]
-        ]
+        "encodeOffsets": [[[122886, 24033]], [[123335, 22980]], [[122375, 24193]], [[122518, 24117]], [[124427, 22618]], [[124862, 26043]], [[126259, 26318]], [[127671, 26683]]]
       }
     },
     {
@@ -576,9 +565,7 @@
       "properties": { "id": "460000", "cp": [109.83119, 19.031971], "name": "海南", "childNum": 1 },
       "geometry": {
         "type": "Polygon",
-        "coordinates": [
-          "@@š¦Ŝil¢”XƦ‘ƞò–ïè§ŞCêɕrŧůÇąĻõ™·ĉ³œ̅kÇm@ċȧƒŧĥ‰Ľʉ­ƅſ“ȓÒ˦ŝE}ºƑ[ÍĜȋ gÎfǐÏĤ¨êƺ\\Ɔ¸ĠĎvʄȀœÐ¾jNðĀÒRŒšZdž™zÐŘΰH¨Ƣb²_Ġ "
-        ],
+        "coordinates": ["@@š¦Ŝil¢”XƦ‘ƞò–ïè§ŞCêɕrŧůÇąĻõ™·ĉ³œ̅kÇm@ċȧƒŧĥ‰Ľʉ­ƅſ“ȓÒ˦ŝE}ºƑ[ÍĜȋ gÎfǐÏĤ¨êƺ\\Ɔ¸ĠĎvʄȀœÐ¾jNðĀÒRŒšZdž™zÐŘΰH¨Ƣb²_Ġ "],
         "encodeOffsets": [[112750, 20508]]
       }
     },
@@ -776,22 +763,8 @@
       },
       "geometry": {
         "type": "MultiPolygon",
-        "coordinates": [
-          ["@@ɧư¬EpƸÁxc‡"],
-          ["@@©„ªƒ"],
-          ["@@”MA‹‘š"],
-          ["@@Qp݁E§ÉC¾"],
-          ["@@bŝՕÕEȣÚƥêImɇǦèÜĠŒÚžÃƌÃ͎ó"],
-          ["@@ǜûȬɋŠŭ™×^‰sYŒɍDŋ‘ŽąñCG²«ªč@h–_p¯A{‡oloY€¬j@IJ`•gQڛhr|ǀ^MIJvtbe´R¯Ô¬¨YŽô¤r]ì†Ƭį"]
-        ],
-        "encodeOffsets": [
-          [[124702, 32062]],
-          [[124547, 32200]],
-          [[124808, 31991]],
-          [[124726, 32110]],
-          [[124903, 32376]],
-          [[124438, 32149]]
-        ]
+        "coordinates": [["@@ɧư¬EpƸÁxc‡"], ["@@©„ªƒ"], ["@@”MA‹‘š"], ["@@Qp݁E§ÉC¾"], ["@@bŝՕÕEȣÚƥêImɇǦèÜĠŒÚžÃƌÃ͎ó"], ["@@ǜûȬɋŠŭ™×^‰sYŒɍDŋ‘ŽąñCG²«ªč@h–_p¯A{‡oloY€¬j@IJ`•gQڛhr|ǀ^MIJvtbe´R¯Ô¬¨YŽô¤r]ì†Ƭį"]],
+        "encodeOffsets": [[[124702, 32062]], [[124547, 32200]], [[124808, 31991]], [[124726, 32110]], [[124903, 32376]], [[124438, 32149]]]
       }
     },
     {
@@ -825,20 +798,8 @@
       },
       "geometry": {
         "type": "MultiPolygon",
-        "coordinates": [
-          ["@@AlBk"],
-          ["@@mŽn"],
-          ["@@EpFo"],
-          ["@@ea¢pl¸Eõ¹‡hj[ƒ]ÔCΖ@lj˜¡uBXŸ…•´‹AI¹…[‹yDUˆ]W`çwZkmc–…M›žp€Åv›}I‹oJlcaƒfёKŽ°ä¬XJmРđhI®æÔtSHn€Eˆ„ÒrÈc"],
-          ["@@rMUw‡AS®€e"]
-        ],
-        "encodeOffsets": [
-          [[117111, 23002]],
-          [[117072, 22876]],
-          [[117045, 22887]],
-          [[116975, 23082]],
-          [[116882, 22747]]
-        ]
+        "coordinates": [["@@AlBk"], ["@@mŽn"], ["@@EpFo"], ["@@ea¢pl¸Eõ¹‡hj[ƒ]ÔCΖ@lj˜¡uBXŸ…•´‹AI¹…[‹yDUˆ]W`çwZkmc–…M›žp€Åv›}I‹oJlcaƒfёKŽ°ä¬XJmРđhI®æÔtSHn€Eˆ„ÒrÈc"], ["@@rMUw‡AS®€e"]],
+        "encodeOffsets": [[[117111, 23002]], [[117072, 22876]], [[117045, 22887]], [[116975, 23082]], [[116882, 22747]]]
       }
     },
     {
diff --git a/src/views/demo/charts/map/Baidu.vue b/src/views/demo/charts/map/Baidu.vue
index ff53def..b126ae6 100644
--- a/src/views/demo/charts/map/Baidu.vue
+++ b/src/views/demo/charts/map/Baidu.vue
@@ -6,8 +6,7 @@
 
   import { useScript } from '/@/hooks/web/useScript';
 
-  const BAI_DU_MAP_URL =
-    'https://api.map.baidu.com/getscript?v=3.0&ak=OaBvYmKX3pjF7YFUFeeBCeGdy9Zp7xB2&services=&t=20210201100830&s=1';
+  const BAI_DU_MAP_URL = 'https://api.map.baidu.com/getscript?v=3.0&ak=OaBvYmKX3pjF7YFUFeeBCeGdy9Zp7xB2&services=&t=20210201100830&s=1';
   export default defineComponent({
     name: 'BaiduMap',
     props: {
diff --git a/src/views/demo/charts/map/Google.vue b/src/views/demo/charts/map/Google.vue
index e346296..bc86d15 100644
--- a/src/views/demo/charts/map/Google.vue
+++ b/src/views/demo/charts/map/Google.vue
@@ -6,8 +6,7 @@
 
   import { useScript } from '/@/hooks/web/useScript';
 
-  const MAP_URL =
-    'https://maps.googleapis.com/maps/api/js?key=AIzaSyBQWrGwj4gAzKndcbwD5favT9K0wgty_0&signed_in=true';
+  const MAP_URL = 'https://maps.googleapis.com/maps/api/js?key=AIzaSyBQWrGwj4gAzKndcbwD5favT9K0wgty_0&signed_in=true';
 
   export default defineComponent({
     name: 'GoogleMap',
diff --git a/src/views/demo/codemirror/index.vue b/src/views/demo/codemirror/index.vue
index e3a3df4..fe17d91 100644
--- a/src/views/demo/codemirror/index.vue
+++ b/src/views/demo/codemirror/index.vue
@@ -1,68 +1,67 @@
 <template>
-    <div>
-        <textarea ref="textarea">
+  <div>
+    <textarea ref="textarea">
 白日依山尽，黄河入海流。
 欲穷千里目，更上一层楼。
-        </textarea>
-    </div>
+        </textarea
+    >
+  </div>
 </template>
 
-<script lang='ts'>
-    import {defineComponent, onMounted, ref,reactive} from "vue";
-    // 引入全局实例
-    import _CodeMirror from 'codemirror'
+<script lang="ts">
+  import { defineComponent, onMounted, ref, reactive } from 'vue';
+  // 引入全局实例
+  import _CodeMirror from 'codemirror';
 
-    // 核心样式
-    import 'codemirror/lib/codemirror.css'
-    // 引入主题后还需要在 options 中指定主题才会生效
-    import 'codemirror/theme/cobalt.css'
+  // 核心样式
+  import 'codemirror/lib/codemirror.css';
+  // 引入主题后还需要在 options 中指定主题才会生效
+  import 'codemirror/theme/cobalt.css';
 
-    // 需要引入具体的语法高亮库才会有对应的语法高亮效果
-    // codemirror 官方其实支持通过 /addon/mode/loadmode.js 和 /mode/meta.js 来实现动态加载对应语法高亮库
-    // 但 vue 貌似没有无法在实例初始化后再动态加载对应 JS ，所以此处才把对应的 JS 提前引入
-    import 'codemirror/mode/javascript/javascript.js'
-    import 'codemirror/mode/css/css.js'
-    import 'codemirror/mode/xml/xml.js'
-    import 'codemirror/mode/clike/clike.js'
-    import 'codemirror/mode/markdown/markdown.js'
-    import 'codemirror/mode/python/python.js'
-    import 'codemirror/mode/r/r.js'
-    import 'codemirror/mode/shell/shell.js'
-    import 'codemirror/mode/sql/sql.js'
-    import 'codemirror/mode/swift/swift.js'
-    import 'codemirror/mode/vue/vue.js'
-    // 尝试获取全局实例
+  // 需要引入具体的语法高亮库才会有对应的语法高亮效果
+  // codemirror 官方其实支持通过 /addon/mode/loadmode.js 和 /mode/meta.js 来实现动态加载对应语法高亮库
+  // 但 vue 貌似没有无法在实例初始化后再动态加载对应 JS ，所以此处才把对应的 JS 提前引入
+  import 'codemirror/mode/javascript/javascript.js';
+  import 'codemirror/mode/css/css.js';
+  import 'codemirror/mode/xml/xml.js';
+  import 'codemirror/mode/clike/clike.js';
+  import 'codemirror/mode/markdown/markdown.js';
+  import 'codemirror/mode/python/python.js';
+  import 'codemirror/mode/r/r.js';
+  import 'codemirror/mode/shell/shell.js';
+  import 'codemirror/mode/sql/sql.js';
+  import 'codemirror/mode/swift/swift.js';
+  import 'codemirror/mode/vue/vue.js';
+  // 尝试获取全局实例
 
-    export default defineComponent({
-        components: {},
-        setup() {
-            const CodeMirror = window.CodeMirror || _CodeMirror
+  export default defineComponent({
+    components: {},
+    setup() {
+      const CodeMirror = window.CodeMirror || _CodeMirror;
 
-            const textarea = ref(null)
-            const options = reactive({
-                // 缩进格式
-                tabSize: 2,
-                // 主题，对应主题库 JS 需要提前引入
-                theme: 'cobalt',
-                // 显示行号
-                lineNumbers: true,
-                line: true
-            })
-            onMounted(() => {
-                init();
-            })
+      const textarea = ref(null);
+      const options = reactive({
+        // 缩进格式
+        tabSize: 2,
+        // 主题，对应主题库 JS 需要提前引入
+        theme: 'cobalt',
+        // 显示行号
+        lineNumbers: true,
+        line: true,
+      });
+      onMounted(() => {
+        init();
+      });
 
-            function init() {
-                CodeMirror.fromTextArea(textarea.value, options)
-            }
+      function init() {
+        CodeMirror.fromTextArea(textarea.value, options);
+      }
 
-            return {
-                textarea
-            };
-        },
-    });
+      return {
+        textarea,
+      };
+    },
+  });
 </script>
 
-<style lang='css' scoped>
-
-</style>
+<style lang="css" scoped></style>
diff --git a/src/views/demo/comp/button/index.vue b/src/views/demo/comp/button/index.vue
index b81ff7f..c2713fd 100644
--- a/src/views/demo/comp/button/index.vue
+++ b/src/views/demo/comp/button/index.vue
@@ -1,9 +1,5 @@
 <template>
-  <PageWrapper
-          contentFullHeight
-          title="基础组件"
-          content=" 基础组件依赖于ant-design-vue,组件库已有的基础组件,项目中不会再次进行demo展示（二次封装组件除外）"
-  >
+  <PageWrapper contentFullHeight title="基础组件" content=" 基础组件依赖于ant-design-vue,组件库已有的基础组件,项目中不会再次进行demo展示（二次封装组件除外）">
     <a-row :gutter="[20, 20]">
       <a-col :xl="10" :lg="24">
         <a-card title="BasicButton Color">
@@ -55,9 +51,7 @@
             <h3>primary</h3>
             <a-button type="primary" preIcon="mdi:page-next-outline"> 主按钮 </a-button>
             <a-button type="primary" class="ml-2" disabled> 禁用 </a-button>
-            <a-button type="primary" class="ml-2" danger preIcon="mdi:page-next-outline">
-              危险
-            </a-button>
+            <a-button type="primary" class="ml-2" danger preIcon="mdi:page-next-outline"> 危险 </a-button>
             <a-button type="primary" class="ml-2" loading> loading </a-button>
             <a-button type="link" class="ml-2"> link </a-button>
             <a-button type="link" class="ml-2" loading> loading link </a-button>
diff --git a/src/views/demo/comp/count-to/index.vue b/src/views/demo/comp/count-to/index.vue
index 86cdd9b..12b3ff3 100644
--- a/src/views/demo/comp/count-to/index.vue
+++ b/src/views/demo/comp/count-to/index.vue
@@ -5,32 +5,13 @@
         <CountTo prefix="$" :color="'#409EFF'" :startVal="1" :endVal="200000" :duration="8000" />
       </CardGrid>
       <CardGrid class="count-to-demo-card">
-        <CountTo
-          suffix="$"
-          :color="'red'"
-          :startVal="1"
-          :endVal="300000"
-          :decimals="2"
-          :duration="6000"
-        />
+        <CountTo suffix="$" :color="'red'" :startVal="1" :endVal="300000" :decimals="2" :duration="6000" />
       </CardGrid>
       <CardGrid class="count-to-demo-card">
-        <CountTo
-          suffix="$"
-          :color="'rgb(0,238,0)'"
-          :startVal="1"
-          :endVal="400000"
-          :duration="7000"
-        />
+        <CountTo suffix="$" :color="'rgb(0,238,0)'" :startVal="1" :endVal="400000" :duration="7000" />
       </CardGrid>
       <CardGrid class="count-to-demo-card">
-        <CountTo
-          separator="-"
-          :color="'rgba(138,43,226,.6)'"
-          :startVal="10000"
-          :endVal="500000"
-          :duration="8000"
-        />
+        <CountTo separator="-" :color="'rgba(138,43,226,.6)'" :startVal="10000" :endVal="500000" :duration="8000" />
       </CardGrid>
     </Card>
   </PageWrapper>
diff --git a/src/views/demo/comp/cropper/index.vue b/src/views/demo/comp/cropper/index.vue
index 983f368..cac50fa 100644
--- a/src/views/demo/comp/cropper/index.vue
+++ b/src/views/demo/comp/cropper/index.vue
@@ -17,13 +17,7 @@
     <CollapseContainer title="圆形裁剪">
       <div class="container p-4">
         <div class="cropper-container mr-10">
-          <CropperImage
-                  ref="refCropper"
-                  :src="img"
-                  @cropend="handleCircleCropend"
-                  style="width: 40vw"
-                  circled
-          />
+          <CropperImage ref="refCropper" :src="img" @cropend="handleCircleCropend" style="width: 40vw" circled />
         </div>
         <img :src="circleImg" class="croppered" v-if="circleImg" />
       </div>
diff --git a/src/views/demo/comp/desc/index.vue b/src/views/demo/comp/desc/index.vue
index 28736a6..c37876c 100644
--- a/src/views/demo/comp/desc/index.vue
+++ b/src/views/demo/comp/desc/index.vue
@@ -1,22 +1,8 @@
 <template>
   <PageWrapper title="详情组件示例">
-    <Description
-      title="基础示例"
-      :collapseOptions="{ canExpand: true, helpMessage: 'help me' }"
-      :column="3"
-      :data="mockData"
-      :schema="schema"
-    />
+    <Description title="基础示例" :collapseOptions="{ canExpand: true, helpMessage: 'help me' }" :column="3" :data="mockData" :schema="schema" />
 
-    <Description
-      class="mt-4"
-      title="垂直示例"
-      layout="vertical"
-      :collapseOptions="{ canExpand: true, helpMessage: 'help me' }"
-      :column="2"
-      :data="mockData"
-      :schema="schema"
-    />
+    <Description class="mt-4" title="垂直示例" layout="vertical" :collapseOptions="{ canExpand: true, helpMessage: 'help me' }" :column="2" :data="mockData" :schema="schema" />
 
     <Description @register="register" class="mt-4" />
     <Description @register="register1" class="mt-4" />
diff --git a/src/views/demo/comp/loading/index.vue b/src/views/demo/comp/loading/index.vue
index 8988561..f7ac1e8 100644
--- a/src/views/demo/comp/loading/index.vue
+++ b/src/views/demo/comp/loading/index.vue
@@ -2,23 +2,17 @@
   <PageWrapper v-loading="loadingRef" loading-tip="加载中..." title="Loading组件示例">
     <div ref="wrapEl">
       <a-alert message="组件方式" />
-      <a-button class="my-4 mr-4" type="primary" @click="openCompFullLoading">
-        全屏 Loading
-      </a-button>
+      <a-button class="my-4 mr-4" type="primary" @click="openCompFullLoading"> 全屏 Loading </a-button>
       <a-button class="my-4" type="primary" @click="openCompAbsolute"> 容器内 Loading </a-button>
-      <Loading :loading="loading" :absolute="absolute" :theme="theme" :background="background" :tip="tip"/>
+      <Loading :loading="loading" :absolute="absolute" :theme="theme" :background="background" :tip="tip" />
 
       <a-alert message="函数方式" />
 
-      <a-button class="my-4 mr-4" type="primary" @click="openFnFullLoading">
-        全屏 Loading
-      </a-button>
+      <a-button class="my-4 mr-4" type="primary" @click="openFnFullLoading"> 全屏 Loading </a-button>
       <a-button class="my-4" type="primary" @click="openFnWrapLoading"> 容器内 Loading </a-button>
 
       <a-alert message="指令方式" />
-      <a-button class="my-4 mr-4" type="primary" @click="openDirectiveLoading">
-        打开指令Loading
-      </a-button>
+      <a-button class="my-4 mr-4" type="primary" @click="openDirectiveLoading"> 打开指令Loading </a-button>
     </div>
   </PageWrapper>
 </template>
diff --git a/src/views/demo/comp/modal/Modal1.vue b/src/views/demo/comp/modal/Modal1.vue
index a49ceb2..f9dfdca 100644
--- a/src/views/demo/comp/modal/Modal1.vue
+++ b/src/views/demo/comp/modal/Modal1.vue
@@ -1,12 +1,5 @@
 <template>
-  <BasicModal
-    v-bind="$attrs"
-    destroyOnClose
-    @register="register"
-    title="Modal Title"
-    :helpMessage="['提示1', '提示2']"
-    @visible-change="handleShow"
-  >
+  <BasicModal v-bind="$attrs" destroyOnClose @register="register" title="Modal Title" :helpMessage="['提示1', '提示2']" @visible-change="handleShow">
     <template #insertFooter>
       <a-button type="primary" danger @click="setLines" :disabled="loading">点我更新内容</a-button>
     </template>
diff --git a/src/views/demo/comp/modal/Modal2.vue b/src/views/demo/comp/modal/Modal2.vue
index 1446b18..da9581d 100644
--- a/src/views/demo/comp/modal/Modal2.vue
+++ b/src/views/demo/comp/modal/Modal2.vue
@@ -1,10 +1,5 @@
 <template>
-  <BasicModal
-    @register="register"
-    title="Modal Title"
-    :helpMessage="['提示1', '提示2']"
-    :okButtonProps="{ disabled: true }"
-  >
+  <BasicModal @register="register" title="Modal Title" :helpMessage="['提示1', '提示2']" :okButtonProps="{ disabled: true }">
     <a-button type="primary" @click="closeModal" class="mr-2"> 从内部关闭弹窗 </a-button>
     <a-button type="primary" @click="setModalProps"> 从内部修改title </a-button>
   </BasicModal>
diff --git a/src/views/demo/comp/modal/Modal4.vue b/src/views/demo/comp/modal/Modal4.vue
index 0614152..90894ea 100644
--- a/src/views/demo/comp/modal/Modal4.vue
+++ b/src/views/demo/comp/modal/Modal4.vue
@@ -1,86 +1,81 @@
 <template>
-    <BasicModal
-            v-bind="$attrs"
-            @register="register"
-            title="Modal Title"
-            @visible-change="handleVisibleChange"
-    >
-        <div class="pt-3px pr-3px">
-            <BasicForm @register="registerForm" :model="model" />
-        </div>
-    </BasicModal>
+  <BasicModal v-bind="$attrs" @register="register" title="Modal Title" @visible-change="handleVisibleChange">
+    <div class="pt-3px pr-3px">
+      <BasicForm @register="registerForm" :model="model" />
+    </div>
+  </BasicModal>
 </template>
 <script lang="ts">
-    import {defineComponent, ref, nextTick} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {BasicForm, FormSchema, useForm} from '/@/components/Form/index';
+  import { defineComponent, ref, nextTick } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
 
-    const schemas: FormSchema[] = [
+  const schemas: FormSchema[] = [
+    {
+      field: 'field1',
+      component: 'Input',
+      label: '字段1',
+      colProps: {
+        span: 24,
+      },
+      defaultValue: '111',
+    },
+    {
+      field: 'field2',
+      component: 'Input',
+      label: '字段2',
+      colProps: {
+        span: 24,
+      },
+    },
+  ];
+  export default defineComponent({
+    components: { BasicModal, BasicForm },
+    props: {
+      userData: { type: Object },
+    },
+    setup(props) {
+      const modelRef = ref({});
+      const [
+        registerForm,
         {
-            field: 'field1',
-            component: 'Input',
-            label: '字段1',
-            colProps: {
-                span: 24,
-            },
-            defaultValue: '111',
+          // setFieldsValue,
+          // setProps
         },
-        {
-            field: 'field2',
-            component: 'Input',
-            label: '字段2',
-            colProps: {
-                span: 24,
-            },
+      ] = useForm({
+        labelWidth: 120,
+        schemas,
+        showActionButtonGroup: false,
+        actionColOptions: {
+          span: 24,
         },
-    ];
-    export default defineComponent({
-        components: {BasicModal, BasicForm},
-        props: {
-            userData: {type: Object},
-        },
-        setup(props) {
-            const modelRef = ref({});
-            const [
-                registerForm,
-                {
-                    // setFieldsValue,
-                    // setProps
-                },
-            ] = useForm({
-                labelWidth: 120,
-                schemas,
-                showActionButtonGroup: false,
-                actionColOptions: {
-                    span: 24,
-                },
-            });
+      });
 
-            const [register] = useModalInner((data) => {
-                data && onDataReceive(data);
-            });
+      const [register] = useModalInner((data) => {
+        data && onDataReceive(data);
+      });
 
-            function onDataReceive(data) {
-                console.log('Data Received', data);
-                // 方式1;
-                // setFieldsValue({
-                //   field2: data.data,
-                //   field1: data.info,
-                // });
+      function onDataReceive(data) {
+        console.log('Data Received', data);
+        // 方式1;
+        // setFieldsValue({
+        //   field2: data.data,
+        //   field1: data.info,
+        // });
 
-                // // 方式2
-                modelRef.value = {field2: data.data, field1: data.info};
+        // // 方式2
+        modelRef.value = { field2: data.data, field1: data.info };
 
-                // setProps({
-                //   model:{ field2: data.data, field1: data.info }
-                // })
-            }
+        // setProps({
+        //   model:{ field2: data.data, field1: data.info }
+        // })
+      }
 
-            function handleVisibleChange(v) {
-                v && props.userData && nextTick(() => onDataReceive(props.userData));
-            }
+      function handleVisibleChange(v) {
+        v && props.userData && nextTick(() => onDataReceive(props.userData));
+      }
 
-            return {register, schemas, registerForm, model: modelRef, handleVisibleChange};
-        },
-    });
+      return { register, schemas, registerForm, model: modelRef, handleVisibleChange };
+    },
+  });
 </script>
diff --git a/src/views/demo/comp/modal/index.vue b/src/views/demo/comp/modal/index.vue
index 8041b02..21137d9 100644
--- a/src/views/demo/comp/modal/index.vue
+++ b/src/views/demo/comp/modal/index.vue
@@ -1,114 +1,112 @@
 <template>
-    <PageWrapper title="modal组件使用示例">
-        <Alert
-                message="使用 useModal 进行弹窗操作，默认可以拖动，可以通过 draggable
+  <PageWrapper title="modal组件使用示例">
+    <Alert
+      message="使用 useModal 进行弹窗操作，默认可以拖动，可以通过 draggable
     参数进行控制是否可以拖动/全屏，并演示了在Modal内动态加载内容并自动调整高度"
-                show-icon
-        />
-        <a-button type="primary" class="my-4" @click="openModalLoading">
-            打开弹窗,加载动态数据并自动调整高度(默认可以拖动/全屏)
-        </a-button>
+      show-icon
+    />
+    <a-button type="primary" class="my-4" @click="openModalLoading"> 打开弹窗,加载动态数据并自动调整高度(默认可以拖动/全屏) </a-button>
 
-        <Alert message="内外同时同时显示隐藏" show-icon/>
-        <a-button type="primary" class="my-4" @click="openModal2"> 打开弹窗</a-button>
-        <Alert message="自适应高度" show-icon/>
-        <a-button type="primary" class="my-4" @click="openModal3"> 打开弹窗</a-button>
+    <Alert message="内外同时同时显示隐藏" show-icon />
+    <a-button type="primary" class="my-4" @click="openModal2"> 打开弹窗</a-button>
+    <Alert message="自适应高度" show-icon />
+    <a-button type="primary" class="my-4" @click="openModal3"> 打开弹窗</a-button>
 
-        <Alert message="内外数据交互" show-icon/>
-        <a-button type="primary" class="my-4" @click="send"> 打开弹窗并传递数据</a-button>
+    <Alert message="内外数据交互" show-icon />
+    <a-button type="primary" class="my-4" @click="send"> 打开弹窗并传递数据</a-button>
 
-        <Alert message="使用动态组件的方式在页面内使用多个弹窗" show-icon/>
-        <a-space>
-            <a-button type="primary" class="my-4" @click="openTargetModal(1)"> 打开弹窗1</a-button>
-            <a-button type="primary" class="my-4" @click="openTargetModal(2)"> 打开弹窗2</a-button>
-            <a-button type="primary" class="my-4" @click="openTargetModal(3)"> 打开弹窗3</a-button>
-            <a-button type="primary" class="my-4" @click="openTargetModal(4)"> 打开弹窗4</a-button>
-        </a-space>
+    <Alert message="使用动态组件的方式在页面内使用多个弹窗" show-icon />
+    <a-space>
+      <a-button type="primary" class="my-4" @click="openTargetModal(1)"> 打开弹窗1</a-button>
+      <a-button type="primary" class="my-4" @click="openTargetModal(2)"> 打开弹窗2</a-button>
+      <a-button type="primary" class="my-4" @click="openTargetModal(3)"> 打开弹窗3</a-button>
+      <a-button type="primary" class="my-4" @click="openTargetModal(4)"> 打开弹窗4</a-button>
+    </a-space>
 
-        <component :is="currentModal" v-model:visible="modalVisible" :userData="userData"/>
+    <component :is="currentModal" v-model:visible="modalVisible" :userData="userData" />
 
-        <Modal1 @register="register1" :minHeight="100"/>
-        <Modal2 @register="register2"/>
-        <Modal3 @register="register3"/>
-        <Modal4 @register="register4"/>
-    </PageWrapper>
+    <Modal1 @register="register1" :minHeight="100" />
+    <Modal2 @register="register2" />
+    <Modal3 @register="register3" />
+    <Modal4 @register="register4" />
+  </PageWrapper>
 </template>
 <script lang="ts">
-    import {defineComponent, shallowRef, ComponentOptions, ref, nextTick} from 'vue';
-    import {Alert, Space} from 'ant-design-vue';
-    import {useModal} from '/@/components/Modal';
-    import Modal1 from './Modal1.vue';
-    import Modal2 from './Modal2.vue';
-    import Modal3 from './Modal3.vue';
-    import Modal4 from './Modal4.vue';
-    import {PageWrapper} from '/@/components/Page';
+  import { defineComponent, shallowRef, ComponentOptions, ref, nextTick } from 'vue';
+  import { Alert, Space } from 'ant-design-vue';
+  import { useModal } from '/@/components/Modal';
+  import Modal1 from './Modal1.vue';
+  import Modal2 from './Modal2.vue';
+  import Modal3 from './Modal3.vue';
+  import Modal4 from './Modal4.vue';
+  import { PageWrapper } from '/@/components/Page';
 
-    export default defineComponent({
-        components: {Alert, Modal1, Modal2, Modal3, Modal4, PageWrapper, ASpace: Space},
-        setup() {
-            const currentModal = shallowRef<Nullable<ComponentOptions>>(null);
-            const [register1, {openModal: openModal1}] = useModal();
-            const [register2, {openModal: openModal2}] = useModal();
-            const [register3, {openModal: openModal3}] = useModal();
-            const [register4, {openModal: openModal4}] = useModal();
-            const modalVisible = ref<Boolean>(false);
-            const userData = ref<any>(null);
+  export default defineComponent({
+    components: { Alert, Modal1, Modal2, Modal3, Modal4, PageWrapper, ASpace: Space },
+    setup() {
+      const currentModal = shallowRef<Nullable<ComponentOptions>>(null);
+      const [register1, { openModal: openModal1 }] = useModal();
+      const [register2, { openModal: openModal2 }] = useModal();
+      const [register3, { openModal: openModal3 }] = useModal();
+      const [register4, { openModal: openModal4 }] = useModal();
+      const modalVisible = ref<Boolean>(false);
+      const userData = ref<any>(null);
 
-            function send() {
-                openModal4(true, {
-                    data: 'content',
-                    info: 'Info',
-                });
-            }
+      function send() {
+        openModal4(true, {
+          data: 'content',
+          info: 'Info',
+        });
+      }
 
-            function openModalLoading() {
-                openModal1(true);
-                // setModalProps({ loading: true });
-                // setTimeout(() => {
-                //   setModalProps({ loading: false });
-                // }, 2000);
-            }
+      function openModalLoading() {
+        openModal1(true);
+        // setModalProps({ loading: true });
+        // setTimeout(() => {
+        //   setModalProps({ loading: false });
+        // }, 2000);
+      }
 
-            function openTargetModal(index) {
-                switch (index) {
-                    case 1:
-                        currentModal.value = Modal1;
-                        break;
-                    case 2:
-                        currentModal.value = Modal2;
-                        break;
-                    case 3:
-                        currentModal.value = Modal3;
-                        break;
-                    default:
-                        currentModal.value = Modal4;
-                        break;
-                }
-                nextTick(() => {
-                    // `useModal` not working with dynamic component
-                    // passing data through `userData` prop
-                    userData.value = {data: Math.random(), info: 'Info222'};
-                    // open the target modal
-                    modalVisible.value = true;
-                });
-            }
+      function openTargetModal(index) {
+        switch (index) {
+          case 1:
+            currentModal.value = Modal1;
+            break;
+          case 2:
+            currentModal.value = Modal2;
+            break;
+          case 3:
+            currentModal.value = Modal3;
+            break;
+          default:
+            currentModal.value = Modal4;
+            break;
+        }
+        nextTick(() => {
+          // `useModal` not working with dynamic component
+          // passing data through `userData` prop
+          userData.value = { data: Math.random(), info: 'Info222' };
+          // open the target modal
+          modalVisible.value = true;
+        });
+      }
 
-            return {
-                register1,
-                openModal1,
-                register2,
-                openModal2,
-                register3,
-                openModal3,
-                register4,
-                openModal4,
-                modalVisible,
-                userData,
-                openTargetModal,
-                send,
-                currentModal,
-                openModalLoading,
-            };
-        },
-    });
+      return {
+        register1,
+        openModal1,
+        register2,
+        openModal2,
+        register3,
+        openModal3,
+        register4,
+        openModal4,
+        modalVisible,
+        userData,
+        openTargetModal,
+        send,
+        currentModal,
+        openModalLoading,
+      };
+    },
+  });
 </script>
diff --git a/src/views/demo/comp/qrcode/index.vue b/src/views/demo/comp/qrcode/index.vue
index 8112b20..1ab6d9f 100644
--- a/src/views/demo/comp/qrcode/index.vue
+++ b/src/views/demo/comp/qrcode/index.vue
@@ -1,11 +1,7 @@
 <template>
   <PageWrapper title="二维码组件使用示例">
     <div class="flex flex-wrap">
-      <CollapseContainer
-              title="基础示例"
-              :canExpan="true"
-              class="text-center mb-6 qrcode-demo-item"
-      >
+      <CollapseContainer title="基础示例" :canExpan="true" class="text-center mb-6 qrcode-demo-item">
         <QrCode :value="qrCodeUrl" />
       </CollapseContainer>
 
@@ -15,8 +11,8 @@
 
       <CollapseContainer title="配置样式示例" class="text-center mb-6 qrcode-demo-item">
         <QrCode
-                :value="qrCodeUrl"
-                :options="{
+          :value="qrCodeUrl"
+          :options="{
             color: { dark: '#55D187' },
           }"
         />
@@ -28,9 +24,9 @@
 
       <CollapseContainer title="在线logo示例" class="text-center mb-6 qrcode-demo-item">
         <QrCode
-                :value="qrCodeUrl"
-                logo="http://jeecg.com/images/logo.png"
-                :options="{
+          :value="qrCodeUrl"
+          logo="http://jeecg.com/images/logo.png"
+          :options="{
             color: { dark: '#55D187' },
           }"
         />
@@ -38,8 +34,8 @@
 
       <CollapseContainer title="logo配置示例" class="text-center mb-6 qrcode-demo-item">
         <QrCode
-                :value="qrCodeUrl"
-                :logo="{
+          :value="qrCodeUrl"
+          :logo="{
             src: 'http://jeecg.com/images/logo.png',
             logoSize: 0.2,
             borderSize: 0.05,
@@ -60,14 +56,7 @@
       </CollapseContainer>
 
       <CollapseContainer title="扩展绘制示例" class="text-center qrcode-demo-item">
-        <QrCode
-                :value="qrCodeUrl"
-                :width="200"
-                :options="{ margin: 5 }"
-                ref="qrDiyRef"
-                :logo="LogoImg"
-                @done="onQrcodeDone"
-        />
+        <QrCode :value="qrCodeUrl" :width="200" :options="{ margin: 5 }" ref="qrDiyRef" :logo="LogoImg" @done="onQrcodeDone" />
         <a-button class="mb-2" type="primary" @click="downloadDiy"> 下载 </a-button>
         <div class="msg"> 要进行扩展绘制则不能将tag设为img </div>
       </CollapseContainer>
diff --git a/src/views/demo/comp/transition/index.vue b/src/views/demo/comp/transition/index.vue
index 1d237d0..447ce39 100644
--- a/src/views/demo/comp/transition/index.vue
+++ b/src/views/demo/comp/transition/index.vue
@@ -1,12 +1,7 @@
 <template>
   <PageWrapper title="动画组件示例">
     <div class="flex">
-      <Select
-        :options="options"
-        v-model:value="value"
-        placeholder="选择动画"
-        :style="{ width: '150px' }"
-      />
+      <Select :options="options" v-model:value="value" placeholder="选择动画" :style="{ width: '150px' }" />
       <a-button type="primary" class="ml-4" @click="start"> start </a-button>
     </div>
     <component :is="`${value}Transition`">
@@ -34,21 +29,7 @@
     ExpandTransition,
   } from '/@/components/Transition';
 
-  const transitionList = [
-    'Fade',
-    'Scale',
-    'SlideY',
-    'ScrollY',
-    'SlideYReverse',
-    'ScrollYReverse',
-    'SlideX',
-    'ScrollX',
-    'SlideXReverse',
-    'ScrollXReverse',
-    'ScaleRotate',
-    'ExpandX',
-    'Expand',
-  ];
+  const transitionList = ['Fade', 'Scale', 'SlideY', 'ScrollY', 'SlideYReverse', 'ScrollYReverse', 'SlideX', 'ScrollX', 'SlideXReverse', 'ScrollXReverse', 'ScaleRotate', 'ExpandX', 'Expand'];
   const options = transitionList.map((item) => ({
     label: item,
     value: item,
diff --git a/src/views/demo/comp/upload/index.vue b/src/views/demo/comp/upload/index.vue
index d619681..c9091e6 100644
--- a/src/views/demo/comp/upload/index.vue
+++ b/src/views/demo/comp/upload/index.vue
@@ -1,14 +1,7 @@
 <template>
   <PageWrapper title="上传组件示例">
     <a-alert message="基础示例" />
-    <BasicUpload
-      :maxSize="20"
-      :maxNumber="10"
-      @change="handleChange"
-      :api="uploadApi"
-      class="my-5"
-      :accept="['image/*']"
-    />
+    <BasicUpload :maxSize="20" :maxNumber="10" @change="handleChange" :api="uploadApi" class="my-5" :accept="['image/*']" />
 
     <a-alert message="嵌入表单,加入表单校验" />
 
diff --git a/src/views/demo/editor/markdown/Editor.vue b/src/views/demo/editor/markdown/Editor.vue
index f972891..6c731bd 100644
--- a/src/views/demo/editor/markdown/Editor.vue
+++ b/src/views/demo/editor/markdown/Editor.vue
@@ -1,12 +1,7 @@
 <template>
   <PageWrapper title="MarkDown组件嵌入Form示例">
     <CollapseContainer title="MarkDown表单">
-      <BasicForm
-        :labelWidth="100"
-        :schemas="schemas"
-        :actionColOptions="{ span: 24 }"
-        @submit="handleSubmit"
-      />
+      <BasicForm :labelWidth="100" :schemas="schemas" :actionColOptions="{ span: 24 }" @submit="handleSubmit" />
     </CollapseContainer>
   </PageWrapper>
 </template>
diff --git a/src/views/demo/editor/markdown/index.vue b/src/views/demo/editor/markdown/index.vue
index f2995a7..7d94947 100644
--- a/src/views/demo/editor/markdown/index.vue
+++ b/src/views/demo/editor/markdown/index.vue
@@ -3,12 +3,7 @@
     <div>
       <a-button @click="toggleTheme" class="mb-2" type="primary"> 黑暗主题 </a-button>
       <a-button @click="clearValue" class="mb-2" type="default"> 清空内容 </a-button>
-      <MarkDown
-              v-model:value="value"
-              @change="handleChange"
-              ref="markDownRef"
-              placeholder="这是占位文本"
-      />
+      <MarkDown v-model:value="value" @change="handleChange" ref="markDownRef" placeholder="这是占位文本" />
     </div>
     <div class="mt-2">
       <a-card title="Markdown Viewer 组件演示">
diff --git a/src/views/demo/editor/tinymce/Editor.vue b/src/views/demo/editor/tinymce/Editor.vue
index c01324f..b109c02 100644
--- a/src/views/demo/editor/tinymce/Editor.vue
+++ b/src/views/demo/editor/tinymce/Editor.vue
@@ -1,12 +1,7 @@
 <template>
   <PageWrapper title="富文本嵌入表单示例">
     <CollapseContainer title="富文本表单">
-      <BasicForm
-        :labelWidth="100"
-        :schemas="schemas"
-        :actionColOptions="{ span: 24 }"
-        @submit="handleSubmit"
-      />
+      <BasicForm :labelWidth="100" :schemas="schemas" :actionColOptions="{ span: 24 }" @submit="handleSubmit" />
     </CollapseContainer>
   </PageWrapper>
 </template>
diff --git a/src/views/demo/excel/ImportExcel.vue b/src/views/demo/excel/ImportExcel.vue
index 9b35aff..a0da444 100644
--- a/src/views/demo/excel/ImportExcel.vue
+++ b/src/views/demo/excel/ImportExcel.vue
@@ -3,13 +3,7 @@
     <ImpExcel @success="loadDataSuccess" dateFormat="YYYY-MM-DD">
       <a-button class="m-3"> 导入Excel </a-button>
     </ImpExcel>
-    <BasicTable
-            v-for="(table, index) in tableListRef"
-            :key="index"
-            :title="table.title"
-            :columns="table.columns"
-            :dataSource="table.dataSource"
-    />
+    <BasicTable v-for="(table, index) in tableListRef" :key="index" :title="table.title" :columns="table.columns" :dataSource="table.dataSource" />
   </PageWrapper>
 </template>
 <script lang="ts">
@@ -29,7 +23,7 @@
           columns?: any[];
           dataSource?: any[];
         }[]
-        >([]);
+      >([]);
 
       function loadDataSuccess(excelDataList: ExcelData[]) {
         tableListRef.value = [];
diff --git a/src/views/demo/feat/download/index.vue b/src/views/demo/feat/download/index.vue
index c52b348..efb4e34 100644
--- a/src/views/demo/feat/download/index.vue
+++ b/src/views/demo/feat/download/index.vue
@@ -10,19 +10,12 @@
     <a-button type="primary" class="my-4" @click="handleDownloadByBase64"> base64流下载 </a-button>
 
     <a-alert message="图片Url下载,如果有跨域问题，需要处理图片跨域" />
-    <a-button type="primary" class="my-4" @click="handleDownloadByOnlineUrl">
-      图片Url下载
-    </a-button>
+    <a-button type="primary" class="my-4" @click="handleDownloadByOnlineUrl"> 图片Url下载 </a-button>
   </PageWrapper>
 </template>
 <script lang="ts">
   import { defineComponent } from 'vue';
-  import {
-    downloadByUrl,
-    downloadByData,
-    downloadByBase64,
-    downloadByOnlineUrl,
-  } from '/@/utils/file/download';
+  import { downloadByUrl, downloadByData, downloadByBase64, downloadByOnlineUrl } from '/@/utils/file/download';
   import imgBase64 from './imgBase64';
   import { PageWrapper } from '/@/components/Page';
   import { Alert } from 'ant-design-vue';
@@ -50,10 +43,7 @@
       }
 
       function handleDownloadByOnlineUrl() {
-        downloadByOnlineUrl(
-          'https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/5944817f47b8408e9f1442ece49d68ca~tplv-k3u1fbpfcp-watermark.image',
-          'logo.png'
-        );
+        downloadByOnlineUrl('https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/5944817f47b8408e9f1442ece49d68ca~tplv-k3u1fbpfcp-watermark.image', 'logo.png');
       }
       return {
         handleDownloadByUrl,
diff --git a/src/views/demo/feat/full-screen/index.vue b/src/views/demo/feat/full-screen/index.vue
index a8fa2c7..aefa3fe 100644
--- a/src/views/demo/feat/full-screen/index.vue
+++ b/src/views/demo/feat/full-screen/index.vue
@@ -13,10 +13,7 @@
       <a-button type="primary" @click="toggleDom" class="mr-2"> Enter Dom Full Screen </a-button>
     </CollapseContainer>
 
-    <div
-      ref="domRef"
-      class="flex items-center justify-center w-1/2 h-64 mx-auto mt-10 bg-white rounded-md"
-    >
+    <div ref="domRef" class="flex items-center justify-center w-1/2 h-64 mx-auto mt-10 bg-white rounded-md">
       <a-button type="primary" @click="toggleDom" class="mr-2"> Exit Dom Full Screen </a-button>
     </div>
   </PageWrapper>
diff --git a/src/views/demo/feat/icon/index.vue b/src/views/demo/feat/icon/index.vue
index 7e3d50f..0238507 100644
--- a/src/views/demo/feat/icon/index.vue
+++ b/src/views/demo/feat/icon/index.vue
@@ -42,11 +42,7 @@
       </div>
     </CollapseContainer>
 
-    <Alert
-      show-icon
-      message="推荐使用Iconify组件"
-      description="Icon组件基本包含所有的图标,在下面网址内你可以查询到你想要的任何图标。并且打包只会打包所用到的图标。"
-    />
+    <Alert show-icon message="推荐使用Iconify组件" description="Icon组件基本包含所有的图标,在下面网址内你可以查询到你想要的任何图标。并且打包只会打包所用到的图标。" />
     <a-button type="link" @click="toIconify"> Iconify 图标大全 </a-button>
   </PageWrapper>
 </template>
@@ -54,15 +50,7 @@
   import { defineComponent } from 'vue';
   import { CollapseContainer } from '/@/components/Container/index';
   import { Alert } from 'ant-design-vue';
-  import {
-    QqCircleFilled,
-    GithubFilled,
-    WechatFilled,
-    AlipayCircleFilled,
-    IeCircleFilled,
-    TaobaoCircleFilled,
-    CodepenCircleFilled,
-  } from '@ant-design/icons-vue';
+  import { QqCircleFilled, GithubFilled, WechatFilled, AlipayCircleFilled, IeCircleFilled, TaobaoCircleFilled, CodepenCircleFilled } from '@ant-design/icons-vue';
 
   import { Icon, IconPicker, SvgIcon } from '/@/components/Icon/index';
 
diff --git a/src/views/demo/feat/img-preview/index.vue b/src/views/demo/feat/img-preview/index.vue
index 9899e5d..29b6e76 100644
--- a/src/views/demo/feat/img-preview/index.vue
+++ b/src/views/demo/feat/img-preview/index.vue
@@ -1,32 +1,28 @@
 <template>
-    <PageWrapper title="图片预览示例">
-        <ImagePreview :imageList="imgList"/>
-        <a-button @click="openImg" type="primary">无预览图</a-button>
-    </PageWrapper>
+  <PageWrapper title="图片预览示例">
+    <ImagePreview :imageList="imgList" />
+    <a-button @click="openImg" type="primary">无预览图</a-button>
+  </PageWrapper>
 </template>
 <script lang="ts">
-    import {defineComponent} from 'vue';
-    import {createImgPreview, ImagePreview} from '/@/components/Preview/index';
-    import {PageWrapper} from '/@/components/Page';
-    // import { PreviewActions } from '/@/components/Preview/src/typing';
+  import { defineComponent } from 'vue';
+  import { createImgPreview, ImagePreview } from '/@/components/Preview/index';
+  import { PageWrapper } from '/@/components/Page';
+  // import { PreviewActions } from '/@/components/Preview/src/typing';
 
-    const imgList: string[] = [
-        'https://picsum.photos/id/66/346/216',
-        'https://picsum.photos/id/67/346/216',
-        'https://picsum.photos/id/68/346/216',
-    ];
-    export default defineComponent({
-        components: {PageWrapper, ImagePreview},
-        setup() {
-            function openImg() {
-                const onImgLoad = ({index, url, dom}) => {
-                    console.log(`第${index + 1}张图片已加载，URL为：${url}`, dom);
-                };
-                // 可以使用createImgPreview返回的 PreviewActions 来控制预览逻辑，实现类似幻灯片、自动旋转之类的骚操作
-                createImgPreview({imageList: imgList, defaultWidth: 700, rememberState: true, onImgLoad});
-            }
+  const imgList: string[] = ['https://picsum.photos/id/66/346/216', 'https://picsum.photos/id/67/346/216', 'https://picsum.photos/id/68/346/216'];
+  export default defineComponent({
+    components: { PageWrapper, ImagePreview },
+    setup() {
+      function openImg() {
+        const onImgLoad = ({ index, url, dom }) => {
+          console.log(`第${index + 1}张图片已加载，URL为：${url}`, dom);
+        };
+        // 可以使用createImgPreview返回的 PreviewActions 来控制预览逻辑，实现类似幻灯片、自动旋转之类的骚操作
+        createImgPreview({ imageList: imgList, defaultWidth: 700, rememberState: true, onImgLoad });
+      }
 
-            return {imgList, openImg};
-        },
-    });
+      return { imgList, openImg };
+    },
+  });
 </script>
diff --git a/src/views/demo/feat/msg/index.vue b/src/views/demo/feat/msg/index.vue
index 6e8763f..f0eb5a3 100644
--- a/src/views/demo/feat/msg/index.vue
+++ b/src/views/demo/feat/msg/index.vue
@@ -2,12 +2,8 @@
   <PageWrapper title="消息示例">
     <CollapseContainer class="w-full h-32 bg-white rounded-md" title="Message">
       <a-button @click="infoMsg('Info message')" class="mr-2"> Info </a-button>
-      <a-button @click="successMsg('Success message')" class="mr-2" color="success">
-        Success
-      </a-button>
-      <a-button @click="warningMsg('Warning message')" class="mr-2" color="warning">
-        Warning
-      </a-button>
+      <a-button @click="successMsg('Success message')" class="mr-2" color="success"> Success </a-button>
+      <a-button @click="warningMsg('Warning message')" class="mr-2" color="warning"> Warning </a-button>
       <a-button @click="errorMsg('Error message')" class="mr-2" color="error"> Error </a-button>
       <a-button @click="handleLoading" class="mr-2" type="primary"> Loading </a-button>
     </CollapseContainer>
@@ -26,10 +22,7 @@
       <a-button @click="handleWarningModal" color="warning" class="mr-2"> Warning </a-button>
     </CollapseContainer>
 
-    <CollapseContainer
-      class="w-full h-32 mt-5 bg-white rounded-md"
-      title="Notification 用法与上面一致"
-    >
+    <CollapseContainer class="w-full h-32 mt-5 bg-white rounded-md" title="Notification 用法与上面一致">
       <a-button @click="handleNotify" color="success" class="mr-2"> Success </a-button>
     </CollapseContainer>
   </PageWrapper>
@@ -43,15 +36,7 @@
   export default defineComponent({
     components: { CollapseContainer, PageWrapper },
     setup() {
-      const {
-        createMessage,
-        createConfirm,
-        createSuccessModal,
-        createInfoModal,
-        createErrorModal,
-        createWarningModal,
-        notification,
-      } = useMessage();
+      const { createMessage, createConfirm, createSuccessModal, createInfoModal, createErrorModal, createWarningModal, notification } = useMessage();
       const { info, success, warning, error } = createMessage;
 
       function handleLoading() {
diff --git a/src/views/demo/feat/print/index.vue b/src/views/demo/feat/print/index.vue
index 556a3b7..723e201 100644
--- a/src/views/demo/feat/print/index.vue
+++ b/src/views/demo/feat/print/index.vue
@@ -31,10 +31,7 @@
 
       function imagePrint() {
         printJS({
-          printable: [
-            'https://anncwb.github.io/anncwb/images/preview1.png',
-            'https://anncwb.github.io/anncwb/images/preview2.png',
-          ],
+          printable: ['https://anncwb.github.io/anncwb/images/preview1.png', 'https://anncwb.github.io/anncwb/images/preview2.png'],
           type: 'image',
           header: 'Multiple Images',
           imageStyle: 'width:100%;',
diff --git a/src/views/demo/feat/session-timeout/index.vue b/src/views/demo/feat/session-timeout/index.vue
index 4fa8074..5ad7a92 100644
--- a/src/views/demo/feat/session-timeout/index.vue
+++ b/src/views/demo/feat/session-timeout/index.vue
@@ -1,8 +1,5 @@
 <template>
-  <PageWrapper
-          title="登录过期示例"
-          content="用户登录过期示例，不再跳转登录页，直接生成页面覆盖当前页面，方便保持过期前的用户状态！"
-  >
+  <PageWrapper title="登录过期示例" content="用户登录过期示例，不再跳转登录页，直接生成页面覆盖当前页面，方便保持过期前的用户状态！">
     <a-card title="请点击下面的按钮访问测试接口" extra="所访问的接口会返回Token过期响应">
       <a-card-grid style="width: 50%; text-align: center">
         <a-button type="primary" @click="test1">HttpStatus == 401</a-button>
diff --git a/src/views/demo/feat/tabs/index.vue b/src/views/demo/feat/tabs/index.vue
index dcaf5d0..53422c3 100644
--- a/src/views/demo/feat/tabs/index.vue
+++ b/src/views/demo/feat/tabs/index.vue
@@ -18,9 +18,7 @@
     </CollapseContainer>
 
     <CollapseContainer class="mt-4" title="标签页复用超出限制自动关闭(使用场景: 动态路由)">
-      <a-button v-for="index in 6" :key="index" class="mr-2" @click="toDetail(index)">
-        打开{{ index }}详情页
-      </a-button>
+      <a-button v-for="index in 6" :key="index" class="mr-2" @click="toDetail(index)"> 打开{{ index }}详情页 </a-button>
     </CollapseContainer>
   </PageWrapper>
 </template>
@@ -39,8 +37,7 @@
     setup() {
       const go = useGo();
       const title = ref<string>('');
-      const { closeAll, closeLeft, closeRight, closeOther, closeCurrent, refreshPage, setTitle } =
-        useTabs();
+      const { closeAll, closeLeft, closeRight, closeOther, closeCurrent, refreshPage, setTitle } = useTabs();
       const { createMessage } = useMessage();
       function setTabTitle() {
         if (title.value) {
diff --git a/src/views/demo/feat/watermark/index.vue b/src/views/demo/feat/watermark/index.vue
index a8a22d2..b1acd7e 100644
--- a/src/views/demo/feat/watermark/index.vue
+++ b/src/views/demo/feat/watermark/index.vue
@@ -1,13 +1,9 @@
 <template>
   <PageWrapper title="水印示例">
     <CollapseContainer class="w-full h-32 bg-white rounded-md" title="Global WaterMark">
-      <a-button type="primary" class="mr-2" @click="setWatermark('WaterMark Info')">
-        Create
-      </a-button>
+      <a-button type="primary" class="mr-2" @click="setWatermark('WaterMark Info')"> Create </a-button>
       <a-button color="error" class="mr-2" @click="clear"> Clear </a-button>
-      <a-button color="warning" class="mr-2" @click="setWatermark('WaterMark Info New')">
-        Reset
-      </a-button>
+      <a-button color="warning" class="mr-2" @click="setWatermark('WaterMark Info New')"> Reset </a-button>
     </CollapseContainer>
   </PageWrapper>
 </template>
diff --git a/src/views/demo/feat/ws/index.vue b/src/views/demo/feat/ws/index.vue
index 31deafd..348fe33 100644
--- a/src/views/demo/feat/ws/index.vue
+++ b/src/views/demo/feat/ws/index.vue
@@ -19,16 +19,9 @@
         <p class="text-lg font-medium mt-4">设置</p>
         <hr class="my-4" />
 
-        <InputTextArea
-          placeholder="需要发送到服务器的内容"
-          :disabled="!getIsOpen"
-          v-model:value="sendValue"
-          allowClear
-        />
+        <InputTextArea placeholder="需要发送到服务器的内容" :disabled="!getIsOpen" v-model:value="sendValue" allowClear />
 
-        <a-button type="primary" block class="mt-4" :disabled="!getIsOpen" @click="handlerSend">
-          发送
-        </a-button>
+        <a-button type="primary" block class="mt-4" :disabled="!getIsOpen" @click="handlerSend"> 发送 </a-button>
       </div>
 
       <div class="w-2/3 bg-white ml-4 p-4">
diff --git a/src/views/demo/form/AdvancedForm.vue b/src/views/demo/form/AdvancedForm.vue
index 4872698..c1e7f75 100644
--- a/src/views/demo/form/AdvancedForm.vue
+++ b/src/views/demo/form/AdvancedForm.vue
@@ -173,12 +173,7 @@
       }
       const [register1] = useForm({
         labelWidth: 120,
-        schemas: [
-          ...getSchamas(),
-          ...getAppendSchemas(),
-          { field: '', component: 'Divider', label: '更多字段' },
-          ...extraSchemas,
-        ],
+        schemas: [...getSchamas(), ...getAppendSchemas(), { field: '', component: 'Divider', label: '更多字段' }, ...extraSchemas],
         actionColOptions: {
           span: 24,
         },
diff --git a/src/views/demo/form/DynamicForm.vue b/src/views/demo/form/DynamicForm.vue
index 046b423..c7bb16e 100644
--- a/src/views/demo/form/DynamicForm.vue
+++ b/src/views/demo/form/DynamicForm.vue
@@ -24,14 +24,14 @@
   const { hasPermission } = usePermission();
   const schemas: FormSchema[] = [
     {
-        field: 'field5',
-        component: 'Switch',
-        label: '是否显示字段1(css控制)',
-        defaultValue:true,
-        colProps: {
-            span: 12,
-        },
-        labelWidth: 200,
+      field: 'field5',
+      component: 'Switch',
+      label: '是否显示字段1(css控制)',
+      defaultValue: true,
+      colProps: {
+        span: 12,
+      },
+      labelWidth: 200,
     },
     {
       field: 'field1',
@@ -45,14 +45,14 @@
       },
     },
     {
-        field: 'field6',
-        component: 'Switch',
-        label: '是否显示字段2(dom控制)',
-        defaultValue:true,
-        colProps: {
-            span: 12,
-        },
-        labelWidth: 200,
+      field: 'field6',
+      component: 'Switch',
+      label: '是否显示字段2(dom控制)',
+      defaultValue: true,
+      colProps: {
+        span: 12,
+      },
+      labelWidth: 200,
     },
     {
       field: 'field2',
@@ -66,13 +66,13 @@
       },
     },
     {
-        field: 'field7',
-        component: 'Switch',
-        label: '是否禁用字段3',
-        colProps: {
-            span: 12,
-        },
-        labelWidth: 200,
+      field: 'field7',
+      component: 'Switch',
+      label: '是否禁用字段3',
+      colProps: {
+        span: 12,
+      },
+      labelWidth: 200,
     },
     {
       field: 'field3',
@@ -86,13 +86,13 @@
       },
     },
     {
-        field: 'field8',
-        component: 'Switch',
-        label: '字段4是否必填',
-        colProps: {
-            span: 12,
-        },
-        labelWidth: 200,
+      field: 'field8',
+      component: 'Switch',
+      label: '字段4是否必填',
+      colProps: {
+        span: 12,
+      },
+      labelWidth: 200,
     },
     {
       field: 'field4',
@@ -184,24 +184,23 @@
   export default defineComponent({
     components: { BasicForm, CollapseContainer, PageWrapper },
     setup() {
-      const [register, { setProps, updateSchema, appendSchemaByField, removeSchemaByFiled }] =
-        useForm({
-          labelWidth: 120,
-          schemas,
-          //禁用表单所有组件
-          disabled:true,
-          labelCol: {
-              xs: { span: 24 },
-              sm: { span: 6 },
-          },
-          wrapperCol: {
-              xs: { span: 24 },
-              sm: { span: 18 },
-          },
-          actionColOptions: {
-            span: 24,
-          },
-        });
+      const [register, { setProps, updateSchema, appendSchemaByField, removeSchemaByFiled }] = useForm({
+        labelWidth: 120,
+        schemas,
+        //禁用表单所有组件
+        disabled: true,
+        labelCol: {
+          xs: { span: 24 },
+          sm: { span: 6 },
+        },
+        wrapperCol: {
+          xs: { span: 24 },
+          sm: { span: 18 },
+        },
+        actionColOptions: {
+          span: 24,
+        },
+      });
       const [register1] = useForm({
         labelWidth: 120,
         schemas: schemas1,
diff --git a/src/views/demo/form/RefForm.vue b/src/views/demo/form/RefForm.vue
index 20fa7b6..29b2136 100644
--- a/src/views/demo/form/RefForm.vue
+++ b/src/views/demo/form/RefForm.vue
@@ -9,22 +9,14 @@
       <a-button @click="setProps({ disabled: false })" class="mr-2"> 解除禁用 </a-button>
       <a-button @click="setProps({ compact: true })" class="mr-2"> 紧凑表单 </a-button>
       <a-button @click="setProps({ compact: false })" class="mr-2"> 还原正常间距 </a-button>
-      <a-button @click="setProps({ actionColOptions: { span: 8 } })" class="mr-2">
-        操作按钮位置
-      </a-button>
+      <a-button @click="setProps({ actionColOptions: { span: 8 } })" class="mr-2"> 操作按钮位置 </a-button>
     </div>
     <div class="mb-4">
-      <a-button @click="setProps({ showActionButtonGroup: false })" class="mr-2">
-        隐藏操作按钮
-      </a-button>
-      <a-button @click="setProps({ showActionButtonGroup: true })" class="mr-2">
-        显示操作按钮
-      </a-button>
+      <a-button @click="setProps({ showActionButtonGroup: false })" class="mr-2"> 隐藏操作按钮 </a-button>
+      <a-button @click="setProps({ showActionButtonGroup: true })" class="mr-2"> 显示操作按钮 </a-button>
       <a-button @click="setProps({ showResetButton: false })" class="mr-2"> 隐藏重置按钮 </a-button>
       <a-button @click="setProps({ showResetButton: true })" class="mr-2"> 显示重置按钮 </a-button>
-      <a-button @click="setProps({ showSubmitButton: false })" class="mr-2">
-        隐藏查询按钮
-      </a-button>
+      <a-button @click="setProps({ showSubmitButton: false })" class="mr-2"> 隐藏查询按钮 </a-button>
       <a-button @click="setProps({ showSubmitButton: true })" class="mr-2"> 显示查询按钮 </a-button>
       <a-button
         @click="
@@ -54,13 +46,7 @@
       </a-button>
     </div>
     <CollapseContainer title="使用ref调用表单内部函数示例">
-      <BasicForm
-        :schemas="schemas"
-        ref="formElRef"
-        :labelWidth="100"
-        @submit="handleSubmit"
-        :actionColOptions="{ span: 24 }"
-      />
+      <BasicForm :schemas="schemas" ref="formElRef" :labelWidth="100" @submit="handleSubmit" :actionColOptions="{ span: 24 }" />
     </CollapseContainer>
   </PageWrapper>
 </template>
diff --git a/src/views/demo/form/RuleForm.vue b/src/views/demo/form/RuleForm.vue
index cd1c77d..958f496 100644
--- a/src/views/demo/form/RuleForm.vue
+++ b/src/views/demo/form/RuleForm.vue
@@ -1,263 +1,260 @@
 <template>
-    <PageWrapper title="表单校验示例">
-        <div class="mb-4">
-            <a-button @click="validateForm" class="mr-2"> 手动校验表单</a-button>
-            <a-button @click="resetValidate" class="mr-2"> 清空校验信息</a-button>
-            <a-button @click="getFormValues" class="mr-2"> 获取表单值</a-button>
-            <a-button @click="setFormValues" class="mr-2"> 设置表单值</a-button>
-            <a-button @click="resetFields" class="mr-2"> 重置</a-button>
-        </div>
-        <CollapseContainer title="表单校验">
-            <BasicForm @register="register" @submit="handleSubmit"/>
-        </CollapseContainer>
-    </PageWrapper>
+  <PageWrapper title="表单校验示例">
+    <div class="mb-4">
+      <a-button @click="validateForm" class="mr-2"> 手动校验表单</a-button>
+      <a-button @click="resetValidate" class="mr-2"> 清空校验信息</a-button>
+      <a-button @click="getFormValues" class="mr-2"> 获取表单值</a-button>
+      <a-button @click="setFormValues" class="mr-2"> 设置表单值</a-button>
+      <a-button @click="resetFields" class="mr-2"> 重置</a-button>
+    </div>
+    <CollapseContainer title="表单校验">
+      <BasicForm @register="register" @submit="handleSubmit" />
+    </CollapseContainer>
+  </PageWrapper>
 </template>
 <script lang="ts">
-    import {defineComponent} from 'vue';
-    import {BasicForm, FormSchema, useForm} from '/@/components/Form/index';
-    import {CollapseContainer} from '/@/components/Container';
-    import {useMessage} from '/@/hooks/web/useMessage';
-    import {PageWrapper} from '/@/components/Page';
-    import {isAccountExist} from '/@/api/demo/system';
+  import { defineComponent } from 'vue';
+  import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
+  import { CollapseContainer } from '/@/components/Container';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { PageWrapper } from '/@/components/Page';
+  import { isAccountExist } from '/@/api/demo/system';
 
-    const schemas: FormSchema[] = [
+  const schemas: FormSchema[] = [
+    {
+      field: 'field1',
+      component: 'Input',
+      label: '字段1',
+      colProps: {
+        span: 8,
+      },
+      required: true,
+    },
+    {
+      field: 'field2',
+      component: 'Input',
+      label: '字段2',
+      colProps: {
+        span: 8,
+      },
+      required: true,
+    },
+    {
+      field: 'id',
+      label: 'id',
+      required: true,
+      defaultValue: 0,
+      component: 'InputNumber',
+      show: false,
+    },
+    {
+      field: 'field3',
+      component: 'DatePicker',
+      label: '字段3',
+      colProps: {
+        span: 8,
+      },
+      required: true,
+    },
+    {
+      field: 'field33',
+      component: 'DatePicker',
+      label: '字段33',
+      colProps: {
+        span: 8,
+      },
+      componentProps: {
+        valueFormat: 'YYYY-MM-DD',
+      },
+      rules: [{ required: true, type: 'string' }],
+    },
+    {
+      field: 'field44',
+      component: 'InputCountDown',
+      label: '验证码',
+      colProps: {
+        span: 8,
+      },
+      required: true,
+    },
+    {
+      field: 'field4',
+      component: 'Select',
+      label: '字段4',
+      colProps: {
+        span: 8,
+      },
+      componentProps: {
+        mode: 'multiple',
+        options: [
+          {
+            label: '选项1',
+            value: '1',
+            key: '1',
+          },
+          {
+            label: '选项2',
+            value: '2',
+            key: '2',
+          },
+        ],
+      },
+      rules: [
         {
-            field: 'field1',
-            component: 'Input',
-            label: '字段1',
-            colProps: {
-                span: 8,
-            },
-            required: true,
+          required: true,
+          message: '请输入aa',
+          type: 'array',
         },
+      ],
+    },
+    {
+      field: 'field441',
+      component: 'Input',
+      label: '自定义校验',
+      colProps: {
+        span: 8,
+      },
+      rules: [
         {
-            field: 'field2',
-            component: 'Input',
-            label: '字段2',
-            colProps: {
-                span: 8,
-            },
-            required: true,
-        },
-        {
-            field: 'id',
-            label: 'id',
-            required: true,
-            defaultValue: 0,
-            component: 'InputNumber',
-            show: false,
-        },
-        {
-            field: 'field3',
-            component: 'DatePicker',
-            label: '字段3',
-            colProps: {
-                span: 8,
-            },
-            required: true,
-        },
-        {
-            field: 'field33',
-            component: 'DatePicker',
-            label: '字段33',
-            colProps: {
-                span: 8,
-            },
-            componentProps: {
-                valueFormat: 'YYYY-MM-DD',
-            },
-            rules: [{required: true, type: 'string'}],
-        },
-        {
-            field: 'field44',
-            component: 'InputCountDown',
-            label: '验证码',
-            colProps: {
-                span: 8,
-            },
-            required: true,
-        },
-        {
-            field: 'field4',
-            component: 'Select',
-            label: '字段4',
-            colProps: {
-                span: 8,
-            },
-            componentProps: {
-                mode: 'multiple',
-                options: [
-                    {
-                        label: '选项1',
-                        value: '1',
-                        key: '1',
-                    },
-                    {
-                        label: '选项2',
-                        value: '2',
-                        key: '2',
-                    },
-                ],
-            },
-            rules: [
-                {
-                    required: true,
-                    message: '请输入aa',
-                    type: 'array',
-                },
-            ],
-        },
-        {
-            field: 'field441',
-            component: 'Input',
-            label: '自定义校验',
-            colProps: {
-                span: 8,
-            },
-            rules: [
-                {
-                    required: true,
-                    // @ts-ignore
-                    validator: async (rule, value) => {
-                        if (!value) {
-                            /* eslint-disable-next-line */
-                            return Promise.reject('值不能为空');
-                        }
-                        if (value === '1') {
-                            /* eslint-disable-next-line */
-                            return Promise.reject('值不能为1');
-                        }
-                        return Promise.resolve();
-                    },
-                    trigger: 'change',
-                },
-            ],
-        },
-        {
-            field: 'field5',
-            component: 'CheckboxGroup',
-            label: '字段5',
-            colProps: {
-                span: 8,
-            },
-            componentProps: {
-                options: [
-                    {
-                        label: '选项1',
-                        value: '1',
-                    },
-                    {
-                        label: '选项2',
-                        value: '2',
-                    },
-                ],
-            },
-            rules: [{required: true}],
-        },
-        {
-            field: 'field7',
-            component: 'RadioGroup',
-            label: '字段7',
-            colProps: {
-                span: 8,
-            },
-            componentProps: {
-                options: [
-                    {
-                        label: '选项1',
-                        value: '1',
-                    },
-                    {
-                        label: '选项2',
-                        value: '2',
-                    },
-                ],
-            },
-            rules: [{required: true, message: '覆盖默认生成的校验信息'}],
-        },
-        {
-            field: 'field8',
-            component: 'Input',
-            label: '后端异步验证',
-            colProps: {
-                span: 8,
-            },
-            helpMessage: ['本字段演示异步验证', '本地规则：必须填写', '后端规则：不能包含admin'],
-            rules: [
-                {
-                    required: true,
-                    message: '请输入数据',
-                },
-                {
-                    validator(_, value) {
-                        return new Promise((resolve, reject) => {
-                            isAccountExist(value)
-                                .then(() => resolve())
-                                .catch((err) => {
-                                    reject(err.message || '验证失败');
-                                });
-                        });
-                    },
-                },
-            ],
-        },
-    ];
-
-    export default defineComponent({
-        components: {BasicForm, CollapseContainer, PageWrapper},
-        setup() {
-            const {createMessage} = useMessage();
-            const [
-                register,
-                {validateFields, clearValidate, getFieldsValue, resetFields, setFieldsValue},
-            ] = useForm({
-                labelWidth: 120,
-                schemas,
-                actionColOptions: {
-                    span: 24,
-                },
-            });
-
-            async function validateForm() {
-                try {
-                    const res = await validateFields();
-                    console.log('passing', res);
-                } catch (error) {
-                    console.log('not passing', error);
-                }
+          required: true,
+          // @ts-ignore
+          validator: async (rule, value) => {
+            if (!value) {
+              /* eslint-disable-next-line */
+              return Promise.reject('值不能为空');
             }
-
-            async function resetValidate() {
-                clearValidate();
+            if (value === '1') {
+              /* eslint-disable-next-line */
+              return Promise.reject('值不能为1');
             }
-
-            function getFormValues() {
-                const values = getFieldsValue();
-                createMessage.success('values:' + JSON.stringify(values));
-            }
-
-            function setFormValues() {
-                setFieldsValue({
-                    field1: 1111,
-                    field5: ['1'],
-                    field7: '1',
-                    field33: '2020-12-12',
-                    field3: '2020-12-12',
+            return Promise.resolve();
+          },
+          trigger: 'change',
+        },
+      ],
+    },
+    {
+      field: 'field5',
+      component: 'CheckboxGroup',
+      label: '字段5',
+      colProps: {
+        span: 8,
+      },
+      componentProps: {
+        options: [
+          {
+            label: '选项1',
+            value: '1',
+          },
+          {
+            label: '选项2',
+            value: '2',
+          },
+        ],
+      },
+      rules: [{ required: true }],
+    },
+    {
+      field: 'field7',
+      component: 'RadioGroup',
+      label: '字段7',
+      colProps: {
+        span: 8,
+      },
+      componentProps: {
+        options: [
+          {
+            label: '选项1',
+            value: '1',
+          },
+          {
+            label: '选项2',
+            value: '2',
+          },
+        ],
+      },
+      rules: [{ required: true, message: '覆盖默认生成的校验信息' }],
+    },
+    {
+      field: 'field8',
+      component: 'Input',
+      label: '后端异步验证',
+      colProps: {
+        span: 8,
+      },
+      helpMessage: ['本字段演示异步验证', '本地规则：必须填写', '后端规则：不能包含admin'],
+      rules: [
+        {
+          required: true,
+          message: '请输入数据',
+        },
+        {
+          validator(_, value) {
+            return new Promise((resolve, reject) => {
+              isAccountExist(value)
+                .then(() => resolve())
+                .catch((err) => {
+                  reject(err.message || '验证失败');
                 });
-            }
-
-            return {
-                register,
-                schemas,
-                handleSubmit: (values: any) => {
-                    createMessage.success('click search,values:' + JSON.stringify(values));
-                },
-                getFormValues,
-                setFormValues,
-                validateForm,
-                resetValidate,
-                resetFields,
-            };
+            });
+          },
         },
-    });
+      ],
+    },
+  ];
+
+  export default defineComponent({
+    components: { BasicForm, CollapseContainer, PageWrapper },
+    setup() {
+      const { createMessage } = useMessage();
+      const [register, { validateFields, clearValidate, getFieldsValue, resetFields, setFieldsValue }] = useForm({
+        labelWidth: 120,
+        schemas,
+        actionColOptions: {
+          span: 24,
+        },
+      });
+
+      async function validateForm() {
+        try {
+          const res = await validateFields();
+          console.log('passing', res);
+        } catch (error) {
+          console.log('not passing', error);
+        }
+      }
+
+      async function resetValidate() {
+        clearValidate();
+      }
+
+      function getFormValues() {
+        const values = getFieldsValue();
+        createMessage.success('values:' + JSON.stringify(values));
+      }
+
+      function setFormValues() {
+        setFieldsValue({
+          field1: 1111,
+          field5: ['1'],
+          field7: '1',
+          field33: '2020-12-12',
+          field3: '2020-12-12',
+        });
+      }
+
+      return {
+        register,
+        schemas,
+        handleSubmit: (values: any) => {
+          createMessage.success('click search,values:' + JSON.stringify(values));
+        },
+        getFormValues,
+        setFormValues,
+        validateForm,
+        resetValidate,
+        resetFields,
+      };
+    },
+  });
 </script>
diff --git a/src/views/demo/form/UseForm.vue b/src/views/demo/form/UseForm.vue
index d24f3f9..9d3e860 100644
--- a/src/views/demo/form/UseForm.vue
+++ b/src/views/demo/form/UseForm.vue
@@ -9,22 +9,14 @@
       <a-button @click="setProps({ disabled: false })" class="mr-2"> 解除禁用 </a-button>
       <a-button @click="setProps({ compact: true })" class="mr-2"> 紧凑表单 </a-button>
       <a-button @click="setProps({ compact: false })" class="mr-2"> 还原正常间距 </a-button>
-      <a-button @click="setProps({ actionColOptions: { span: 8 } })" class="mr-2">
-        操作按钮位置
-      </a-button>
+      <a-button @click="setProps({ actionColOptions: { span: 8 } })" class="mr-2"> 操作按钮位置 </a-button>
     </div>
     <div class="mb-4">
-      <a-button @click="setProps({ showActionButtonGroup: false })" class="mr-2">
-        隐藏操作按钮
-      </a-button>
-      <a-button @click="setProps({ showActionButtonGroup: true })" class="mr-2">
-        显示操作按钮
-      </a-button>
+      <a-button @click="setProps({ showActionButtonGroup: false })" class="mr-2"> 隐藏操作按钮 </a-button>
+      <a-button @click="setProps({ showActionButtonGroup: true })" class="mr-2"> 显示操作按钮 </a-button>
       <a-button @click="setProps({ showResetButton: false })" class="mr-2"> 隐藏重置按钮 </a-button>
       <a-button @click="setProps({ showResetButton: true })" class="mr-2"> 显示重置按钮 </a-button>
-      <a-button @click="setProps({ showSubmitButton: false })" class="mr-2">
-        隐藏查询按钮
-      </a-button>
+      <a-button @click="setProps({ showSubmitButton: false })" class="mr-2"> 隐藏查询按钮 </a-button>
       <a-button @click="setProps({ showSubmitButton: true })" class="mr-2"> 显示查询按钮 </a-button>
       <a-button
         @click="
diff --git a/src/views/demo/form/index.vue b/src/views/demo/form/index.vue
index 1af741b..91b8f99 100644
--- a/src/views/demo/form/index.vue
+++ b/src/views/demo/form/index.vue
@@ -1,604 +1,589 @@
 <template>
-    <PageWrapper title="表单基础示例" contentFullHeight>
-        <CollapseContainer title="基础示例">
-            <BasicForm autoFocusFirstItem :labelWidth="200" :schemas="schemas" :actionColOptions="{ span: 24 }" :labelCol="{span:8}" @submit="handleSubmit" @reset="handleReset">
-                <template #jAreaLinkage="{model, field }">
-                    <JAreaLinkage v-model:value="model[field]" :showArea="true" :showAll="false" />
-                </template>
-                <template #localSearch="{ model, field }">
-                    <ApiSelect :api="optionsListApi" showSearch v-model:value="model[field]" optionFilterProp="label" resultField="list" labelField="name" valueField="id"/>
-                </template>
-                <template #selectA="{ model, field }">
-                    <a-select
-                            :options="optionsA"
-                            mode="multiple"
-                            v-model:value="model[field]"
-                            @change="valueSelectA = model[field]"
-                            allowClear
-                    />
-                </template>
-                <template #selectB="{ model, field }">
-                    <a-select
-                            :options="optionsB"
-                            mode="multiple"
-                            v-model:value="model[field]"
-                            @change="valueSelectB = model[field]"
-                            allowClear
-                    />
-                </template>
-                <template #remoteSearch="{ model, field }">
-                    <ApiSelect :api="optionsListApi" showSearch v-model:value="model[field]" :filterOption="false" resultField="list" labelField="name" valueField="id" @search="onSearch"/>
-                </template>
-            </BasicForm>
-        </CollapseContainer>
-    </PageWrapper>
+  <PageWrapper title="表单基础示例" contentFullHeight>
+    <CollapseContainer title="基础示例">
+      <BasicForm autoFocusFirstItem :labelWidth="200" :schemas="schemas" :actionColOptions="{ span: 24 }" :labelCol="{ span: 8 }" @submit="handleSubmit" @reset="handleReset">
+        <template #jAreaLinkage="{ model, field }">
+          <JAreaLinkage v-model:value="model[field]" :showArea="true" :showAll="false" />
+        </template>
+        <template #localSearch="{ model, field }">
+          <ApiSelect :api="optionsListApi" showSearch v-model:value="model[field]" optionFilterProp="label" resultField="list" labelField="name" valueField="id" />
+        </template>
+        <template #selectA="{ model, field }">
+          <a-select :options="optionsA" mode="multiple" v-model:value="model[field]" @change="valueSelectA = model[field]" allowClear />
+        </template>
+        <template #selectB="{ model, field }">
+          <a-select :options="optionsB" mode="multiple" v-model:value="model[field]" @change="valueSelectB = model[field]" allowClear />
+        </template>
+        <template #remoteSearch="{ model, field }">
+          <ApiSelect :api="optionsListApi" showSearch v-model:value="model[field]" :filterOption="false" resultField="list" labelField="name" valueField="id" @search="onSearch" />
+        </template>
+      </BasicForm>
+    </CollapseContainer>
+  </PageWrapper>
 </template>
 <script lang="ts">
-    import {computed, defineComponent, unref, ref} from 'vue';
-    import {BasicForm, FormSchema, ApiSelect, JAreaLinkage} from '/@/components/Form/index';
-    import {CollapseContainer} from '/@/components/Container';
-    import {useMessage} from '/@/hooks/web/useMessage';
-    import {PageWrapper} from '/@/components/Page';
+  import { computed, defineComponent, unref, ref } from 'vue';
+  import { BasicForm, FormSchema, ApiSelect, JAreaLinkage } from '/@/components/Form/index';
+  import { CollapseContainer } from '/@/components/Container';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { PageWrapper } from '/@/components/Page';
 
-    import {optionsListApi} from '/@/api/demo/select';
-    import {useDebounceFn} from '@vueuse/core';
-    import {treeOptionsListApi} from '/@/api/demo/tree';
-    import { Select } from 'ant-design-vue';
-    import { cloneDeep } from 'lodash-es';
+  import { optionsListApi } from '/@/api/demo/select';
+  import { useDebounceFn } from '@vueuse/core';
+  import { treeOptionsListApi } from '/@/api/demo/tree';
+  import { Select } from 'ant-design-vue';
+  import { cloneDeep } from 'lodash-es';
 
-    const valueSelectA = ref<string[]>([]);
-    const valueSelectB = ref<string[]>([]);
-    const options = ref<Recordable[]>([]);
-    for (let i = 1; i < 10; i++) options.value.push({ label: '选项' + i, value: `${i}` });
+  const valueSelectA = ref<string[]>([]);
+  const valueSelectB = ref<string[]>([]);
+  const options = ref<Recordable[]>([]);
+  for (let i = 1; i < 10; i++) options.value.push({ label: '选项' + i, value: `${i}` });
 
-    const optionsA = computed(() => {
-        return cloneDeep(unref(options)).map((op) => {
-            op.disabled = unref(valueSelectB).indexOf(op.value) !== -1;
-            return op;
-        });
+  const optionsA = computed(() => {
+    return cloneDeep(unref(options)).map((op) => {
+      op.disabled = unref(valueSelectB).indexOf(op.value) !== -1;
+      return op;
     });
-    const optionsB = computed(() => {
-        return cloneDeep(unref(options)).map((op) => {
-            op.disabled = unref(valueSelectA).indexOf(op.value) !== -1;
-            return op;
-        });
+  });
+  const optionsB = computed(() => {
+    return cloneDeep(unref(options)).map((op) => {
+      op.disabled = unref(valueSelectA).indexOf(op.value) !== -1;
+      return op;
     });
-    const provincesOptions = [
-        {
-            id: 'guangdong',
-            label: '广东省',
+  });
+  const provincesOptions = [
+    {
+      id: 'guangdong',
+      label: '广东省',
+      value: '1',
+      key: '1',
+    },
+    {
+      id: 'jiangsu',
+      label: '江苏省',
+      value: '2',
+      key: '2',
+    },
+  ];
+  const citiesOptionsData = {
+    guangdong: [
+      {
+        label: '珠海市',
+        value: '1',
+        key: '1',
+      },
+      {
+        label: '深圳市',
+        value: '2',
+        key: '2',
+      },
+      {
+        label: '广州市',
+        value: '3',
+        key: '3',
+      },
+    ],
+    jiangsu: [
+      {
+        label: '南京市',
+        value: '1',
+        key: '1',
+      },
+      {
+        label: '无锡市',
+        value: '2',
+        key: '2',
+      },
+      {
+        label: '苏州市',
+        value: '3',
+        key: '3',
+      },
+    ],
+  };
+
+  const schemas: FormSchema[] = [
+    {
+      field: 'divider-basic',
+      component: 'Divider',
+      label: '基础字段',
+    },
+    {
+      field: 'field1',
+      component: 'Input',
+      label: '字段1',
+
+      colProps: {
+        span: 8,
+      },
+      // componentProps:{},
+      // can func
+      componentProps: ({ schema, formModel }) => {
+        console.log('form:', schema);
+        console.log('formModel:', formModel);
+        return {
+          placeholder: '自定义placeholder',
+          onChange: (e: any) => {
+            console.log(e);
+          },
+        };
+      },
+      renderComponentContent: () => {
+        return {
+          prefix: () => 'pSlot',
+          suffix: () => 'sSlot',
+        };
+      },
+    },
+    {
+      field: 'field2',
+      component: 'Input',
+      label: '字段2',
+      defaultValue: '111',
+      colProps: {
+        span: 8,
+      },
+      componentProps: {
+        onChange: (e: any) => {
+          console.log(e);
+        },
+      },
+      suffix: '天',
+    },
+    {
+      field: 'field3',
+      component: 'DatePicker',
+      label: '字段3',
+      colProps: {
+        span: 8,
+      },
+    },
+    {
+      field: 'field4',
+      component: 'Select',
+      label: '字段4',
+      colProps: {
+        span: 8,
+      },
+      componentProps: {
+        options: [
+          {
+            label: '选项1',
             value: '1',
             key: '1',
-        },
-        {
-            id: 'jiangsu',
-            label: '江苏省',
+          },
+          {
+            label: '选项2',
             value: '2',
             key: '2',
-        },
-    ];
-    const citiesOptionsData = {
-        guangdong: [
-            {
-                label: '珠海市',
-                value: '1',
-                key: '1',
-            },
-            {
-                label: '深圳市',
-                value: '2',
-                key: '2',
-            },
-            {
-                label: '广州市',
-                value: '3',
-                key: '3',
-            },
-        ],
-        jiangsu: [
-            {
-                label: '南京市',
-                value: '1',
-                key: '1',
-            },
-            {
-                label: '无锡市',
-                value: '2',
-                key: '2',
-            },
-            {
-                label: '苏州市',
-                value: '3',
-                key: '3',
-            },
-        ],
-    };
-
-    const schemas: FormSchema[] = [
-        {
-            field: 'divider-basic',
-            component: 'Divider',
-            label: '基础字段',
-        },
-        {
-            field: 'field1',
-            component: 'Input',
-            label: '字段1',
-
-            colProps: {
-                span: 8,
-            },
-            // componentProps:{},
-            // can func
-            componentProps: ({schema, formModel}) => {
-                console.log('form:', schema);
-                console.log('formModel:', formModel);
-                return {
-                    placeholder: '自定义placeholder',
-                    onChange: (e: any) => {
-                        console.log(e);
-                    },
-                };
-            },
-            renderComponentContent: () => {
-                return {
-                    prefix: () => 'pSlot',
-                    suffix: () => 'sSlot',
-                };
-            },
-        },
-        {
-            field: 'field2',
-            component: 'Input',
-            label: '字段2',
-            defaultValue: '111',
-            colProps: {
-                span: 8,
-            },
-            componentProps: {
-                onChange: (e: any) => {
-                    console.log(e);
-                },
-            },
-            suffix: '天',
-        },
-        {
-            field: 'field3',
-            component: 'DatePicker',
-            label: '字段3',
-            colProps: {
-                span: 8,
-            },
-        },
-        {
-            field: 'field4',
-            component: 'Select',
-            label: '字段4',
-            colProps: {
-                span: 8,
-            },
-            componentProps: {
-                options: [
-                    {
-                        label: '选项1',
-                        value: '1',
-                        key: '1',
-                    },
-                    {
-                        label: '选项2',
-                        value: '2',
-                        key: '2',
-                    },
-                ],
-            },
-        },
-        {
-            field: 'field5',
-            component: 'CheckboxGroup',
-            label: '字段5',
-            colProps: {
-                span: 8,
-            },
-            componentProps: {
-                options: [
-                    {
-                        label: '选项1',
-                        value: '1',
-                    },
-                    {
-                        label: '选项2',
-                        value: '2',
-                    },
-                ],
-            },
-        },
-        {
-            field: 'field7',
-            component: 'RadioGroup',
-            label: '字段7',
-            colProps: {
-                span: 8,
-            },
-            componentProps: {
-                options: [
-                    {
-                        label: '选项1',
-                        value: '1',
-                    },
-                    {
-                        label: '选项2',
-                        value: '2',
-                    },
-                ],
-            },
-        },
-        {
-            field: 'field8',
-            component: 'Checkbox',
-            label: '字段8',
-            colProps: {
-                span: 8,
-            },
-            renderComponentContent: 'Check',
-        },
-        {
-            field: 'field9',
-            component: 'Switch',
-            label: '字段9',
-            colProps: {
-                span: 8,
-            },
-        },
-        {
-            field: 'field10',
-            component: 'RadioButtonGroup',
-            label: '字段10',
-            colProps: {
-                span: 8,
-            },
-            componentProps: {
-                options: [
-                    {
-                        label: '选项1',
-                        value: '1',
-                    },
-                    {
-                        label: '选项2',
-                        value: '2',
-                    },
-                ],
-            },
-        },
-        {
-            field: 'field11',
-            component: 'Cascader',
-            label: '字段11',
-            colProps: {
-                span: 8,
-            },
-            componentProps: {
-                options: [
-                    {
-                        value: 'zhejiang',
-                        label: 'Zhejiang',
-                        children: [
-                            {
-                                value: 'hangzhou',
-                                label: 'Hangzhou',
-                                children: [
-                                    {
-                                        value: 'xihu',
-                                        label: 'West Lake',
-                                    },
-                                ],
-                            },
-                        ],
-                    },
-                    {
-                        value: 'jiangsu',
-                        label: 'Jiangsu',
-                        children: [
-                            {
-                                value: 'nanjing',
-                                label: 'Nanjing',
-                                children: [
-                                    {
-                                        value: 'zhonghuamen',
-                                        label: 'Zhong Hua Men',
-                                    },
-                                ],
-                            },
-                        ],
-                    },
-                ],
-            },
-        },
-        {
-            field: 'divider-api-select',
-            component: 'Divider',
-            label: '远程下拉演示',
-        },
-        {
-            field: 'field30',
-            component: 'ApiSelect',
-            label: '懒加载远程下拉',
-            required: true,
-            componentProps: {
-                // more details see /src/components/Form/src/components/ApiSelect.vue
-                api: optionsListApi,
-                params: {
-                    id: 1,
-                },
-                resultField: 'list',
-                // use name as label
-                labelField: 'name',
-                // use id as value
-                valueField: 'id',
-                // not request untill to select
-                immediate: false,
-                onChange: (e) => {
-                    console.log('selected:', e);
-                },
-                // atfer request callback
-                onOptionsChange: (options) => {
-                    console.log('get options', options.length, options);
-                },
-            },
-            colProps: {
-                span: 8,
-            },
-            defaultValue: '0',
-        },
-        {
-            field: 'field311',
-            component: 'JAreaLinkage',
-            label: '省市区选择',
-            helpMessage: ['JAreaLinkage组件', '省市区选择'],
-            required: true,
-            slot: 'jAreaLinkage',
-            colProps: {
-                span: 8,
-            },
-            defaultValue: ["130000","130200"],
-        },
-        {
-            field: 'field31',
-            component: 'Input',
-            label: '下拉本地搜索',
-            helpMessage: ['ApiSelect组件', '远程数据源本地搜索', '只发起一次请求获取所有选项'],
-            required: true,
-            slot: 'localSearch',
-            colProps: {
-                span: 8,
-            },
-            defaultValue: '0',
-        },
-        {
-            field: 'field32',
-            component: 'Input',
-            label: '下拉远程搜索',
-            helpMessage: ['ApiSelect组件', '将关键词发送到接口进行远程搜索'],
-            required: true,
-            slot: 'remoteSearch',
-            colProps: {
-                span: 8,
-            },
-            defaultValue: '0',
-        },
-        {
-            field: 'field33',
-            component: 'ApiTreeSelect',
-            label: '远程下拉树',
-            helpMessage: ['ApiTreeSelect组件', '使用接口提供的数据生成选项'],
-            required: true,
-            componentProps: {
-                api: treeOptionsListApi,
-                resultField: 'list',
-            },
-            colProps: {
-                span: 8,
-            },
-        },
-      {
-        field: 'field34',
-        component: 'ApiRadioGroup',
-        label: '远程Radio',
-        helpMessage: ['ApiRadioGroup组件', '使用接口提供的数据生成选项'],
-        required: true,
-        componentProps: {
-          api: optionsListApi,
-          params: {
-            count: 2,
           },
-          resultField: 'list',
-          // use name as label
-          labelField: 'name',
-          // use id as value
-          valueField: 'id',
+        ],
+      },
+    },
+    {
+      field: 'field5',
+      component: 'CheckboxGroup',
+      label: '字段5',
+      colProps: {
+        span: 8,
+      },
+      componentProps: {
+        options: [
+          {
+            label: '选项1',
+            value: '1',
+          },
+          {
+            label: '选项2',
+            value: '2',
+          },
+        ],
+      },
+    },
+    {
+      field: 'field7',
+      component: 'RadioGroup',
+      label: '字段7',
+      colProps: {
+        span: 8,
+      },
+      componentProps: {
+        options: [
+          {
+            label: '选项1',
+            value: '1',
+          },
+          {
+            label: '选项2',
+            value: '2',
+          },
+        ],
+      },
+    },
+    {
+      field: 'field8',
+      component: 'Checkbox',
+      label: '字段8',
+      colProps: {
+        span: 8,
+      },
+      renderComponentContent: 'Check',
+    },
+    {
+      field: 'field9',
+      component: 'Switch',
+      label: '字段9',
+      colProps: {
+        span: 8,
+      },
+    },
+    {
+      field: 'field10',
+      component: 'RadioButtonGroup',
+      label: '字段10',
+      colProps: {
+        span: 8,
+      },
+      componentProps: {
+        options: [
+          {
+            label: '选项1',
+            value: '1',
+          },
+          {
+            label: '选项2',
+            value: '2',
+          },
+        ],
+      },
+    },
+    {
+      field: 'field11',
+      component: 'Cascader',
+      label: '字段11',
+      colProps: {
+        span: 8,
+      },
+      componentProps: {
+        options: [
+          {
+            value: 'zhejiang',
+            label: 'Zhejiang',
+            children: [
+              {
+                value: 'hangzhou',
+                label: 'Hangzhou',
+                children: [
+                  {
+                    value: 'xihu',
+                    label: 'West Lake',
+                  },
+                ],
+              },
+            ],
+          },
+          {
+            value: 'jiangsu',
+            label: 'Jiangsu',
+            children: [
+              {
+                value: 'nanjing',
+                label: 'Nanjing',
+                children: [
+                  {
+                    value: 'zhonghuamen',
+                    label: 'Zhong Hua Men',
+                  },
+                ],
+              },
+            ],
+          },
+        ],
+      },
+    },
+    {
+      field: 'divider-api-select',
+      component: 'Divider',
+      label: '远程下拉演示',
+    },
+    {
+      field: 'field30',
+      component: 'ApiSelect',
+      label: '懒加载远程下拉',
+      required: true,
+      componentProps: {
+        // more details see /src/components/Form/src/components/ApiSelect.vue
+        api: optionsListApi,
+        params: {
+          id: 1,
         },
-        defaultValue: '1',
-        colProps: {
-          span: 8,
+        resultField: 'list',
+        // use name as label
+        labelField: 'name',
+        // use id as value
+        valueField: 'id',
+        // not request untill to select
+        immediate: false,
+        onChange: (e) => {
+          console.log('selected:', e);
+        },
+        // atfer request callback
+        onOptionsChange: (options) => {
+          console.log('get options', options.length, options);
         },
       },
-      {
-        field: 'field35',
-        component: 'ApiRadioGroup',
-        label: '远程Radio',
-        helpMessage: ['ApiRadioGroup组件', '使用接口提供的数据生成选项'],
-        required: true,
-        componentProps: {
-          api: optionsListApi,
-          params: {
-            count: 2,
-          },
-          resultField: 'list',
-          // use name as label
-          labelField: 'name',
-          // use id as value
-          valueField: 'id',
-          isBtn: true,
-        },
-        colProps: {
-          span: 8,
-        },
+      colProps: {
+        span: 8,
       },
-        {
-            field: 'divider-linked',
-            component: 'Divider',
-            label: '字段联动',
+      defaultValue: '0',
+    },
+    {
+      field: 'field311',
+      component: 'JAreaLinkage',
+      label: '省市区选择',
+      helpMessage: ['JAreaLinkage组件', '省市区选择'],
+      required: true,
+      slot: 'jAreaLinkage',
+      colProps: {
+        span: 8,
+      },
+      defaultValue: ['130000', '130200'],
+    },
+    {
+      field: 'field31',
+      component: 'Input',
+      label: '下拉本地搜索',
+      helpMessage: ['ApiSelect组件', '远程数据源本地搜索', '只发起一次请求获取所有选项'],
+      required: true,
+      slot: 'localSearch',
+      colProps: {
+        span: 8,
+      },
+      defaultValue: '0',
+    },
+    {
+      field: 'field32',
+      component: 'Input',
+      label: '下拉远程搜索',
+      helpMessage: ['ApiSelect组件', '将关键词发送到接口进行远程搜索'],
+      required: true,
+      slot: 'remoteSearch',
+      colProps: {
+        span: 8,
+      },
+      defaultValue: '0',
+    },
+    {
+      field: 'field33',
+      component: 'ApiTreeSelect',
+      label: '远程下拉树',
+      helpMessage: ['ApiTreeSelect组件', '使用接口提供的数据生成选项'],
+      required: true,
+      componentProps: {
+        api: treeOptionsListApi,
+        resultField: 'list',
+      },
+      colProps: {
+        span: 8,
+      },
+    },
+    {
+      field: 'field34',
+      component: 'ApiRadioGroup',
+      label: '远程Radio',
+      helpMessage: ['ApiRadioGroup组件', '使用接口提供的数据生成选项'],
+      required: true,
+      componentProps: {
+        api: optionsListApi,
+        params: {
+          count: 2,
         },
-        {
-            field: 'province',
-            component: 'Select',
-            label: '省份',
-            colProps: {
-                span: 8,
-            },
-            componentProps: ({formModel, formActionType}) => {
-                return {
-                    options: provincesOptions,
-                    placeholder: '省份与城市联动',
-                    onChange: (e: any) => {
-                        // console.log(e)
-                        let citiesOptions =
-                            e == 1
-                                ? citiesOptionsData[provincesOptions[0].id]
-                                : citiesOptionsData[provincesOptions[1].id];
-                        // console.log(citiesOptions)
-                        if (e === undefined) {
-                            citiesOptions = [];
-                        }
-                        formModel.city = undefined; //  reset city value
-                        const {updateSchema} = formActionType;
-                        updateSchema({
-                            field: 'city',
-                            componentProps: {
-                                options: citiesOptions,
-                            },
-                        });
-                    },
-                };
-            },
+        resultField: 'list',
+        // use name as label
+        labelField: 'name',
+        // use id as value
+        valueField: 'id',
+      },
+      defaultValue: '1',
+      colProps: {
+        span: 8,
+      },
+    },
+    {
+      field: 'field35',
+      component: 'ApiRadioGroup',
+      label: '远程Radio',
+      helpMessage: ['ApiRadioGroup组件', '使用接口提供的数据生成选项'],
+      required: true,
+      componentProps: {
+        api: optionsListApi,
+        params: {
+          count: 2,
         },
-        {
-            field: 'city',
-            component: 'Select',
-            label: '城市',
-            colProps: {
-                span: 8,
-            },
-            componentProps: {
-                options: [], // defalut []
-                placeholder: '省份与城市联动',
-            },
-        },
-        {
-            field: 'divider-selects',
-            component: 'Divider',
-            label: '互斥多选',
-            helpMessage: ['两个Select共用数据源', '但不可选择对方已选中的项目'],
-        },
-        {
-            field: 'selectA',
-            component: 'Select',
-            label: '互斥SelectA',
-            slot: 'selectA',
-            defaultValue: [],
-            colProps: {
-                span: 8,
-            },
-        },
-        {
-            field: 'selectB',
-            component: 'Select',
-            label: '互斥SelectB',
-            slot: 'selectB',
-            defaultValue: [],
-            colProps: {
-                span: 8,
-            },
-        },
-        {
-            field: 'divider-others',
-            component: 'Divider',
-            label: '其它',
-        },
-        {
-            field: 'field20',
-            component: 'InputNumber',
-            label: '字段20',
-            required: true,
-            colProps: {
-                span: 8,
-            },
-        },
-        {
-            field: 'field21',
-            component: 'Slider',
-            label: '字段21',
-            componentProps: {
-                min: 0,
-                max: 100,
-                range: true,
-                marks: {
-                    20: '20°C',
-                    60: '60°C',
-                },
-            },
-            colProps: {
-                span: 8,
-            },
-        },
-        {
-            field: 'field22',
-            component: 'Rate',
-            label: '字段22',
-            defaultValue: 3,
-            colProps: {
-                span: 8,
-            },
-            componentProps: {
-                disabled: false,
-                allowHalf: true,
-            },
-        },
-    ];
-
-    export default defineComponent({
-        components: {BasicForm, CollapseContainer, PageWrapper, ApiSelect, JAreaLinkage, ASelect: Select},
-        setup() {
-            const check = ref(null);
-            const {createMessage} = useMessage();
-            const keyword = ref<string>('');
-            const searchParams = computed<Recordable>(() => {
-                return {keyword: unref(keyword)};
+        resultField: 'list',
+        // use name as label
+        labelField: 'name',
+        // use id as value
+        valueField: 'id',
+        isBtn: true,
+      },
+      colProps: {
+        span: 8,
+      },
+    },
+    {
+      field: 'divider-linked',
+      component: 'Divider',
+      label: '字段联动',
+    },
+    {
+      field: 'province',
+      component: 'Select',
+      label: '省份',
+      colProps: {
+        span: 8,
+      },
+      componentProps: ({ formModel, formActionType }) => {
+        return {
+          options: provincesOptions,
+          placeholder: '省份与城市联动',
+          onChange: (e: any) => {
+            // console.log(e)
+            let citiesOptions = e == 1 ? citiesOptionsData[provincesOptions[0].id] : citiesOptionsData[provincesOptions[1].id];
+            // console.log(citiesOptions)
+            if (e === undefined) {
+              citiesOptions = [];
+            }
+            formModel.city = undefined; //  reset city value
+            const { updateSchema } = formActionType;
+            updateSchema({
+              field: 'city',
+              componentProps: {
+                options: citiesOptions,
+              },
             });
-
-            function onSearch(value: string) {
-                keyword.value = value;
-            }
-            function areaChange(value) {
-                alert(value);
-            }
-
-            return {
-                schemas,
-                optionsListApi,
-                optionsA,
-                optionsB,
-                valueSelectA,
-                valueSelectB,
-                onSearch: useDebounceFn(onSearch, 300),
-                searchParams,
-                handleReset: () => {
-                    keyword.value = '';
-                },
-                handleSubmit: (values: any) => {
-                    createMessage.success('click search,values:' + JSON.stringify(values));
-                },
-                check,
-            };
+          },
+        };
+      },
+    },
+    {
+      field: 'city',
+      component: 'Select',
+      label: '城市',
+      colProps: {
+        span: 8,
+      },
+      componentProps: {
+        options: [], // defalut []
+        placeholder: '省份与城市联动',
+      },
+    },
+    {
+      field: 'divider-selects',
+      component: 'Divider',
+      label: '互斥多选',
+      helpMessage: ['两个Select共用数据源', '但不可选择对方已选中的项目'],
+    },
+    {
+      field: 'selectA',
+      component: 'Select',
+      label: '互斥SelectA',
+      slot: 'selectA',
+      defaultValue: [],
+      colProps: {
+        span: 8,
+      },
+    },
+    {
+      field: 'selectB',
+      component: 'Select',
+      label: '互斥SelectB',
+      slot: 'selectB',
+      defaultValue: [],
+      colProps: {
+        span: 8,
+      },
+    },
+    {
+      field: 'divider-others',
+      component: 'Divider',
+      label: '其它',
+    },
+    {
+      field: 'field20',
+      component: 'InputNumber',
+      label: '字段20',
+      required: true,
+      colProps: {
+        span: 8,
+      },
+    },
+    {
+      field: 'field21',
+      component: 'Slider',
+      label: '字段21',
+      componentProps: {
+        min: 0,
+        max: 100,
+        range: true,
+        marks: {
+          20: '20°C',
+          60: '60°C',
         },
-    });
+      },
+      colProps: {
+        span: 8,
+      },
+    },
+    {
+      field: 'field22',
+      component: 'Rate',
+      label: '字段22',
+      defaultValue: 3,
+      colProps: {
+        span: 8,
+      },
+      componentProps: {
+        disabled: false,
+        allowHalf: true,
+      },
+    },
+  ];
+
+  export default defineComponent({
+    components: { BasicForm, CollapseContainer, PageWrapper, ApiSelect, JAreaLinkage, ASelect: Select },
+    setup() {
+      const check = ref(null);
+      const { createMessage } = useMessage();
+      const keyword = ref<string>('');
+      const searchParams = computed<Recordable>(() => {
+        return { keyword: unref(keyword) };
+      });
+
+      function onSearch(value: string) {
+        keyword.value = value;
+      }
+      function areaChange(value) {
+        alert(value);
+      }
+
+      return {
+        schemas,
+        optionsListApi,
+        optionsA,
+        optionsB,
+        valueSelectA,
+        valueSelectB,
+        onSearch: useDebounceFn(onSearch, 300),
+        searchParams,
+        handleReset: () => {
+          keyword.value = '';
+        },
+        handleSubmit: (values: any) => {
+          createMessage.success('click search,values:' + JSON.stringify(values));
+        },
+        check,
+      };
+    },
+  });
 </script>
diff --git a/src/views/demo/fullcalendar/event-utils.ts b/src/views/demo/fullcalendar/event-utils.ts
index 9131e07..5efd8d7 100644
--- a/src/views/demo/fullcalendar/event-utils.ts
+++ b/src/views/demo/fullcalendar/event-utils.ts
@@ -1,21 +1,21 @@
-import { EventInput } from '@fullcalendar/vue3'
+import { EventInput } from '@fullcalendar/vue3';
 
-let eventGuid = 0
-let todayStr = new Date().toISOString().replace(/T.*$/, '') // YYYY-MM-DD of today
+let eventGuid = 0;
+let todayStr = new Date().toISOString().replace(/T.*$/, ''); // YYYY-MM-DD of today
 
 export const INITIAL_EVENTS: EventInput[] = [
   {
     id: createEventId(),
     title: 'All-day event',
-    start: todayStr
+    start: todayStr,
   },
   {
     id: createEventId(),
     title: 'Timed event',
-    start: todayStr + 'T12:00:00'
-  }
-]
+    start: todayStr + 'T12:00:00',
+  },
+];
 
 export function createEventId() {
-  return String(eventGuid++)
+  return String(eventGuid++);
 }
diff --git a/src/views/demo/fullcalendar/index.vue b/src/views/demo/fullcalendar/index.vue
index 28890cc..c89a278 100644
--- a/src/views/demo/fullcalendar/index.vue
+++ b/src/views/demo/fullcalendar/index.vue
@@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
   import { defineComponent } from 'vue';
   import '@fullcalendar/core/vdom'; // solve problem with Vite
   import FullCalendar, { CalendarOptions, EventApi, DateSelectArg, EventClickArg } from '@fullcalendar/vue3';
@@ -77,97 +77,90 @@
 </script>
 
 <template>
-    <div class='demo-app'>
-        <div class='demo-app-sidebar'>
-            <div class='demo-app-sidebar-section'>
-                <h2>Instructions</h2>
-                <ul>
-                    <li>Select dates and you will be prompted to create a new event</li>
-                    <li>Drag, drop, and resize events</li>
-                    <li>Click an event to delete it</li>
-                </ul>
-            </div>
-            <div class='demo-app-sidebar-section'>
-                <label>
-                    <input
-                            type='checkbox'
-                            :checked='calendarOptions.weekends'
-                            @change='handleWeekendsToggle'
-                    />
-                    toggle weekends
-                </label>
-            </div>
-            <div class='demo-app-sidebar-section'>
-                <h2>All Events ({{ currentEvents.length }})</h2>
-                <ul>
-                    <li v-for='event in currentEvents' :key='event.id'>
-                        <b>{{ event.startStr }}</b>
-                        <i>{{ event.title }}</i>
-                    </li>
-                </ul>
-            </div>
-        </div>
-        <div class='demo-app-main'>
-            <FullCalendar
-                    class='demo-app-calendar'
-                    :options='calendarOptions'
-            >
-                <template v-slot:eventContent='arg'>
-                    <b>{{ arg.timeText }}</b>
-                    <i>{{ arg.event.title }}</i>
-                </template>
-            </FullCalendar>
-        </div>
+  <div class="demo-app">
+    <div class="demo-app-sidebar">
+      <div class="demo-app-sidebar-section">
+        <h2>Instructions</h2>
+        <ul>
+          <li>Select dates and you will be prompted to create a new event</li>
+          <li>Drag, drop, and resize events</li>
+          <li>Click an event to delete it</li>
+        </ul>
+      </div>
+      <div class="demo-app-sidebar-section">
+        <label>
+          <input type="checkbox" :checked="calendarOptions.weekends" @change="handleWeekendsToggle" />
+          toggle weekends
+        </label>
+      </div>
+      <div class="demo-app-sidebar-section">
+        <h2>All Events ({{ currentEvents.length }})</h2>
+        <ul>
+          <li v-for="event in currentEvents" :key="event.id">
+            <b>{{ event.startStr }}</b>
+            <i>{{ event.title }}</i>
+          </li>
+        </ul>
+      </div>
     </div>
+    <div class="demo-app-main">
+      <FullCalendar class="demo-app-calendar" :options="calendarOptions">
+        <template v-slot:eventContent="arg">
+          <b>{{ arg.timeText }}</b>
+          <i>{{ arg.event.title }}</i>
+        </template>
+      </FullCalendar>
+    </div>
+  </div>
 </template>
 
-<style lang='css' scoped>
+<style lang="css" scoped>
+  h2 {
+    margin: 0;
+    font-size: 16px;
+  }
 
-    h2 {
-        margin: 0;
-        font-size: 16px;
-    }
+  ul {
+    margin: 0;
+    padding: 0 0 0 1.5em;
+  }
 
-    ul {
-        margin: 0;
-        padding: 0 0 0 1.5em;
-    }
+  li {
+    margin: 1.5em 0;
+    padding: 0;
+  }
 
-    li {
-        margin: 1.5em 0;
-        padding: 0;
-    }
+  b {
+    /* used for event dates/times */
+    margin-right: 3px;
+  }
 
-    b { /* used for event dates/times */
-        margin-right: 3px;
-    }
+  .demo-app {
+    display: flex;
+    min-height: 100%;
+    font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
+    font-size: 14px;
+  }
 
-    .demo-app {
-        display: flex;
-        min-height: 100%;
-        font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
-        font-size: 14px;
-    }
+  .demo-app-sidebar {
+    width: 300px;
+    line-height: 1.5;
+    background: #eaf9ff;
+    border-right: 1px solid #d3e2e8;
+  }
 
-    .demo-app-sidebar {
-        width: 300px;
-        line-height: 1.5;
-        background: #eaf9ff;
-        border-right: 1px solid #d3e2e8;
-    }
+  .demo-app-sidebar-section {
+    padding: 2em;
+  }
 
-    .demo-app-sidebar-section {
-        padding: 2em;
-    }
-
-    .demo-app-main {
-        flex-grow: 1;
-        padding: 3em;
-    }
-
-    .fc { /* the calendar root */
-        max-width: 1100px;
-        margin: 0 auto;
-    }
+  .demo-app-main {
+    flex-grow: 1;
+    padding: 3em;
+  }
 
+  .fc {
+    /* the calendar root */
+    max-width: 1100px;
+    margin: 0 auto;
+  }
 </style>
diff --git a/src/views/demo/jeecg/AsyncTreeTable.vue b/src/views/demo/jeecg/AsyncTreeTable.vue
index b150dcb..f3e24fa 100644
--- a/src/views/demo/jeecg/AsyncTreeTable.vue
+++ b/src/views/demo/jeecg/AsyncTreeTable.vue
@@ -1,61 +1,57 @@
 <template>
   <PageWrapper>
     <a-card :bordered="false">
-      <BasicTable
-          :loading="loading"
-          :dataSource="dataSource"
-          @register="registerTable"
-          @expand="onExpand"/>
+      <BasicTable :loading="loading" :dataSource="dataSource" @register="registerTable" @expand="onExpand" />
     </a-card>
   </PageWrapper>
 </template>
 
 <script lang="ts" setup>
-import { ref } from 'vue'
-import { defHttp } from '/@/utils/http/axios'
-import { PageWrapper } from '/@/components/Page'
-import { BasicTable, useTable } from '/@/components/Table'
+  import { ref } from 'vue';
+  import { defHttp } from '/@/utils/http/axios';
+  import { PageWrapper } from '/@/components/Page';
+  import { BasicTable, useTable } from '/@/components/Table';
 
-const url = '/mock/api/asynTreeList'
+  const url = '/mock/api/asynTreeList';
 
-const loading = ref<boolean>(false)
-const dataSource = ref<any[]>([])
-const [registerTable, { setLoading }] = useTable({
-  rowKey: 'id',
-  bordered: true,
-  canResize: false,
-  // 树表格
-  isTreeTable: true,
-  showIndexColumn: true,
-  columns: [
-    { title: '名称', dataIndex: 'name' },
-    { title: '组件', dataIndex: 'component' },
-    { title: '排序', dataIndex: 'orderNum' },
-  ],
-})
+  const loading = ref<boolean>(false);
+  const dataSource = ref<any[]>([]);
+  const [registerTable, { setLoading }] = useTable({
+    rowKey: 'id',
+    bordered: true,
+    canResize: false,
+    // 树表格
+    isTreeTable: true,
+    showIndexColumn: true,
+    columns: [
+      { title: '名称', dataIndex: 'name' },
+      { title: '组件', dataIndex: 'component' },
+      { title: '排序', dataIndex: 'orderNum' },
+    ],
+  });
 
-async function loadData(params) {
-  loading.value = true
-  let result = await defHttp.get({ url, params })
-  loading.value = false
-  return result.map(item => {
-    if (item.hasChildren) {
-      return { ...item, children: [] }
-    } else {
-      return item
-    }
-  })
-}
-
-async function loadRootData() {
-  dataSource.value = await loadData({ id: '0' })
-}
-
-loadRootData()
-
-async function onExpand(isExpand, rowData) {
-  if (isExpand && rowData.hasChildren && rowData.children.length === 0) {
-    rowData.children = await loadData({ id: rowData.id })
+  async function loadData(params) {
+    loading.value = true;
+    let result = await defHttp.get({ url, params });
+    loading.value = false;
+    return result.map((item) => {
+      if (item.hasChildren) {
+        return { ...item, children: [] };
+      } else {
+        return item;
+      }
+    });
   }
-}
-</script>
\ No newline at end of file
+
+  async function loadRootData() {
+    dataSource.value = await loadData({ id: '0' });
+  }
+
+  loadRootData();
+
+  async function onExpand(isExpand, rowData) {
+    if (isExpand && rowData.hasChildren && rowData.children.length === 0) {
+      rowData.children = await loadData({ id: rowData.id });
+    }
+  }
+</script>
diff --git a/src/views/demo/jeecg/ImgDragSort.vue b/src/views/demo/jeecg/ImgDragSort.vue
index 9709b1f..cb289e5 100644
--- a/src/views/demo/jeecg/ImgDragSort.vue
+++ b/src/views/demo/jeecg/ImgDragSort.vue
@@ -1,80 +1,80 @@
 <template>
-    <div>
-        <draggable @end="end" v-model="dataArr" item-key="id" style="display: flex">
-            <template #item="{element}">
-                <div class="imgDiv">
-                    <img :src="element.filePath" preview="index">
-                </div>
-            </template>
-            <template #footer>
-                <a-button @click="sureChange" type="primary" style="margin-top: 100px">确定</a-button>
-            </template>
-        </draggable>
-        <a-divider>json数据</a-divider>
-        <a-row>
-            <a-col :span="12">
-                <p>拖拽前：</p>
-                <textarea rows="25" style="width: 780px">{{ oldDateSource }}</textarea>
-            </a-col>
-            <a-col :span="12">
-                <p>拖拽后：</p>
-                <textarea rows="25" style="width: 780px">{{ newDateSource }}</textarea>
-            </a-col>
-        </a-row>
-    </div>
+  <div>
+    <draggable @end="end" v-model="dataArr" item-key="id" style="display: flex">
+      <template #item="{ element }">
+        <div class="imgDiv">
+          <img :src="element.filePath" preview="index" />
+        </div>
+      </template>
+      <template #footer>
+        <a-button @click="sureChange" type="primary" style="margin-top: 100px">确定</a-button>
+      </template>
+    </draggable>
+    <a-divider>json数据</a-divider>
+    <a-row>
+      <a-col :span="12">
+        <p>拖拽前：</p>
+        <textarea rows="25" style="width: 780px">{{ oldDateSource }}</textarea>
+      </a-col>
+      <a-col :span="12">
+        <p>拖拽后：</p>
+        <textarea rows="25" style="width: 780px">{{ newDateSource }}</textarea>
+      </a-col>
+    </a-row>
+  </div>
 </template>
 
 <script lang="ts" setup>
-    import draggable from 'vuedraggable'
-    import {defineComponent, ref, unref} from 'vue';
+  import draggable from 'vuedraggable';
+  import { defineComponent, ref, unref } from 'vue';
 
-    const mockData = [
-        {id: '000', sort: 0, filePath: 'https://static.jeecg.com/upload/test/1_1588149743473.jpg'},
-        {id: '111', sort: 1, filePath: 'https://static.jeecg.com/upload/test/u27356337152749454924fm27gp0_1588149731821.jpg'},
-        {id: '222', sort: 2, filePath: 'https://static.jeecg.com/upload/test/u24454681402491956848fm27gp0_1588149712663.jpg'},
-        {id: '333', sort: 3, filePath: 'https://static.jeecg.com/temp/国炬软件logo_1606575029126.png'},
-        {id: '444', sort: 4, filePath: 'https://static.jeecg.com/upload/test/u8891206113801177793fm27gp0_1588149704459.jpg'}
-    ];
+  const mockData = [
+    { id: '000', sort: 0, filePath: 'https://static.jeecg.com/upload/test/1_1588149743473.jpg' },
+    { id: '111', sort: 1, filePath: 'https://static.jeecg.com/upload/test/u27356337152749454924fm27gp0_1588149731821.jpg' },
+    { id: '222', sort: 2, filePath: 'https://static.jeecg.com/upload/test/u24454681402491956848fm27gp0_1588149712663.jpg' },
+    { id: '333', sort: 3, filePath: 'https://static.jeecg.com/temp/国炬软件logo_1606575029126.png' },
+    { id: '444', sort: 4, filePath: 'https://static.jeecg.com/upload/test/u8891206113801177793fm27gp0_1588149704459.jpg' },
+  ];
 
-    //数据集
-    const dataArr = ref(mockData);
-    //原始数据
-    const oldDateSource = ref(mockData);
-    //更改后的数据
-    const newDateSource = ref([]);
+  //数据集
+  const dataArr = ref(mockData);
+  //原始数据
+  const oldDateSource = ref(mockData);
+  //更改后的数据
+  const newDateSource = ref([]);
 
-    /**
-     * 拖动结束事件
-     * @param evt
-     */
-    function end(evt) {
-        console.log("拖动前的位置" + evt.oldIndex);
-        console.log("拖动后的位置" + evt.newIndex);
-    }
-
-    /**
-     * 确认更改事件
-     * @param evt
-     */
-    function sureChange() {
-        for (let i = 0; i < unref(dataArr).length; i++) {
-            dataArr.value[i].sort = i;
-        }
-        newDateSource.value = unref(dataArr);
+  /**
+   * 拖动结束事件
+   * @param evt
+   */
+  function end(evt) {
+    console.log('拖动前的位置' + evt.oldIndex);
+    console.log('拖动后的位置' + evt.newIndex);
+  }
+
+  /**
+   * 确认更改事件
+   * @param evt
+   */
+  function sureChange() {
+    for (let i = 0; i < unref(dataArr).length; i++) {
+      dataArr.value[i].sort = i;
     }
+    newDateSource.value = unref(dataArr);
+  }
 </script>
 
 <style scoped lang="less">
-    .imgDiv {
-        padding: 8px;
-        border: 1px solid #d9d9d9;
-        border-radius: 4px;
-        margin: 0 8px 8px 0;
+  .imgDiv {
+    padding: 8px;
+    border: 1px solid #d9d9d9;
+    border-radius: 4px;
+    margin: 0 8px 8px 0;
 
-        img {
-            width: 120px;
-            height: 120px;
-            object-fit: cover
-        }
+    img {
+      width: 120px;
+      height: 120px;
+      object-fit: cover;
     }
+  }
 </style>
diff --git a/src/views/demo/jeecg/ImgTurnPage.vue b/src/views/demo/jeecg/ImgTurnPage.vue
index dd5bfa2..9859c2e 100644
--- a/src/views/demo/jeecg/ImgTurnPage.vue
+++ b/src/views/demo/jeecg/ImgTurnPage.vue
@@ -1,158 +1,170 @@
 <template>
-    <div style="min-width: 800px;">
-        <a-row>
-            <!-- 左侧文件树 -->
-            <a-col :span="6">
-                <a-tree
-                    showLine
-                    :treeData="treeData"
-                    :expandedKeys="[expandedKeys[0]]"
-                    :selectedKeys="selectedKeys"
-                    :style="{'height':'500px','border-right':'2px solid #c1c1c1','overflow-y':'auto'}"
-                    @expand="onExpand"
-                    @select="onSelect"
-                ></a-tree>
-            </a-col>
+  <div style="min-width: 800px">
+    <a-row>
+      <!-- 左侧文件树 -->
+      <a-col :span="6">
+        <a-tree
+          showLine
+          :treeData="treeData"
+          :expandedKeys="[expandedKeys[0]]"
+          :selectedKeys="selectedKeys"
+          :style="{ height: '500px', 'border-right': '2px solid #c1c1c1', 'overflow-y': 'auto' }"
+          @expand="onExpand"
+          @select="onSelect"
+        ></a-tree>
+      </a-col>
 
-            <!--右侧缩略图-->
-            <a-col :span="18">
-                <a-row style="margin-top: 10px;padding-left: 2%;">
-                    <a-col :span="24" style="margin-bottom: 10px">
-                        <a-button @click="prev" preIcon="ant-design:left-outlined" type="primary">上一页</a-button>
-                        <a-button @click="next" preIcon="ant-design:right-outlined" style="margin-left: 8px" type="primary">下一页</a-button>
-                        <span style="margin-left: 100px;font-weight: bolder">{{ navName }}</span>
-                    </a-col>
-                    <a-col :span="24">
-                        <img :src="imgUrl" preview>
-                    </a-col>
-                </a-row>
-            </a-col>
+      <!--右侧缩略图-->
+      <a-col :span="18">
+        <a-row style="margin-top: 10px; padding-left: 2%">
+          <a-col :span="24" style="margin-bottom: 10px">
+            <a-button @click="prev" preIcon="ant-design:left-outlined" type="primary">上一页</a-button>
+            <a-button @click="next" preIcon="ant-design:right-outlined" style="margin-left: 8px" type="primary">下一页</a-button>
+            <span style="margin-left: 100px; font-weight: bolder">{{ navName }}</span>
+          </a-col>
+          <a-col :span="24">
+            <img :src="imgUrl" preview />
+          </a-col>
         </a-row>
-    </div>
+      </a-col>
+    </a-row>
+  </div>
 </template>
 
 <script lang="ts" setup>
-    import {ref, unref,onMounted} from 'vue';
-    //mock数据
-    const mockdata = [{
-        title: '第一页',
-        key: '0-0',
-        children: [{
-            title: '1页',
-            key: '0-0-0',
-            imgUrl: 'https://static.jeecg.com/upload/test/1_1588149743473.jpg'
-        }, {
-            title: '2页',
-            key: '0-0-1',
-            imgUrl: 'https://static.jeecg.com/upload/test/u27356337152749454924fm27gp0_1588149731821.jpg'
-        }]
-    }, {
-        title: '第二页',
-        key: '0-1',
-        children: [{
-            title: '1页',
-            key: '0-1-0',
-            imgUrl: 'https://static.jeecg.com/upload/test/u24454681402491956848fm27gp0_1588149712663.jpg'
-        }, {
-            title: '2页',
-            key: '0-1-1',
-            imgUrl: 'https://static.jeecg.com/upload/test/u8891206113801177793fm27gp0_1588149704459.jpg'
-        }]
-    }, {
-        title: '第三页',
-        key: '0-2',
-        children: [{
-            title: '1页',
-            key: '0-2-0',
-            imgUrl: 'https://static.jeecg.com/upload/test/1374962_1587621329085.jpg'
-        }]
-    }];
-    /**
-     * 左侧树形数据
-     */
-    const treeData = ref(mockdata);
-    //选中的key
-    const selectedKeys = ref([]);
-    //展开的key
-    const expandedKeys = ref([]);
-    const sort = ref(0);
-    //图片链接
-    const imgUrl = ref('');
-    //页码标题
-    const navName = ref(''); 
-    //图片集合
-    const imgList = ref([]);
+  import { ref, unref, onMounted } from 'vue';
+  //mock数据
+  const mockdata = [
+    {
+      title: '第一页',
+      key: '0-0',
+      children: [
+        {
+          title: '1页',
+          key: '0-0-0',
+          imgUrl: 'https://static.jeecg.com/upload/test/1_1588149743473.jpg',
+        },
+        {
+          title: '2页',
+          key: '0-0-1',
+          imgUrl: 'https://static.jeecg.com/upload/test/u27356337152749454924fm27gp0_1588149731821.jpg',
+        },
+      ],
+    },
+    {
+      title: '第二页',
+      key: '0-1',
+      children: [
+        {
+          title: '1页',
+          key: '0-1-0',
+          imgUrl: 'https://static.jeecg.com/upload/test/u24454681402491956848fm27gp0_1588149712663.jpg',
+        },
+        {
+          title: '2页',
+          key: '0-1-1',
+          imgUrl: 'https://static.jeecg.com/upload/test/u8891206113801177793fm27gp0_1588149704459.jpg',
+        },
+      ],
+    },
+    {
+      title: '第三页',
+      key: '0-2',
+      children: [
+        {
+          title: '1页',
+          key: '0-2-0',
+          imgUrl: 'https://static.jeecg.com/upload/test/1374962_1587621329085.jpg',
+        },
+      ],
+    },
+  ];
+  /**
+   * 左侧树形数据
+   */
+  const treeData = ref(mockdata);
+  //选中的key
+  const selectedKeys = ref([]);
+  //展开的key
+  const expandedKeys = ref([]);
+  const sort = ref(0);
+  //图片链接
+  const imgUrl = ref('');
+  //页码标题
+  const navName = ref('');
+  //图片集合
+  const imgList = ref([]);
 
-    onMounted(getImgList);
+  onMounted(getImgList);
 
-    /**
-     * 加载图片集合
-     */
-    function getImgList() {
-        var count = 0;
-        for (var i = 0; i < unref(treeData).length; i++) {
-            for (var j = 0; j < unref(treeData)[i].children.length; j++) {
-                imgList.value.push({
-                    key: unref(treeData)[i].children[j].key, 
-                    pkey: unref(treeData)[i].key, 
-                    sort: count++,
-                    imgUrl: unref(treeData)[i].children[j].imgUrl, 
-                    navName: unref(treeData)[i].title + "/" + unref(treeData)[i].children[j].title
-                })
-            }
-        }
-        setValue(imgList.value[unref(sort)]);
+  /**
+   * 加载图片集合
+   */
+  function getImgList() {
+    var count = 0;
+    for (var i = 0; i < unref(treeData).length; i++) {
+      for (var j = 0; j < unref(treeData)[i].children.length; j++) {
+        imgList.value.push({
+          key: unref(treeData)[i].children[j].key,
+          pkey: unref(treeData)[i].key,
+          sort: count++,
+          imgUrl: unref(treeData)[i].children[j].imgUrl,
+          navName: unref(treeData)[i].title + '/' + unref(treeData)[i].children[j].title,
+        });
+      }
     }
-    /**
-     * 节点选中事件
-     */
-    function onSelect(selectedKeys, info) {
-        for (var i = 0; i < unref(imgList).length; i++) {
-            if (unref(imgList)[i].key === selectedKeys[0]) {
-                sort.value = unref(imgList)[i].sort;
-                setValue(unref(imgList)[i]);
-                break;
-            }
-        }
+    setValue(imgList.value[unref(sort)]);
+  }
+  /**
+   * 节点选中事件
+   */
+  function onSelect(selectedKeys, info) {
+    for (var i = 0; i < unref(imgList).length; i++) {
+      if (unref(imgList)[i].key === selectedKeys[0]) {
+        sort.value = unref(imgList)[i].sort;
+        setValue(unref(imgList)[i]);
+        break;
+      }
     }
-    /**
-     * 节点展开事件
-     */
-    function onExpand(expandedKey) {
-        expandedKeys.value = [];
-        if (expandedKey !== null && expandedKey !== '') {
-            expandedKeys.value[0] = expandedKey[1];
-        }
+  }
+  /**
+   * 节点展开事件
+   */
+  function onExpand(expandedKey) {
+    expandedKeys.value = [];
+    if (expandedKey !== null && expandedKey !== '') {
+      expandedKeys.value[0] = expandedKey[1];
     }
-    /**
-     * 上一页
-     */
-    function prev() {
-        if (unref(sort) === 0) {
-            sort.value = unref(imgList).length - 1;
-        } else {
-            sort.value = sort.value - 1;
-        }
-        setValue(unref(imgList)[unref(sort)]);
+  }
+  /**
+   * 上一页
+   */
+  function prev() {
+    if (unref(sort) === 0) {
+      sort.value = unref(imgList).length - 1;
+    } else {
+      sort.value = sort.value - 1;
     }
-    /**
-     * 下一页
-     */
-    function next() {
-        if (unref(sort) === unref(imgList).length - 1) {
-            sort.value = 0;
-        } else {
-            sort.value = unref(sort) + 1;
-        }
-        setValue(unref(imgList)[unref(sort)]);
+    setValue(unref(imgList)[unref(sort)]);
+  }
+  /**
+   * 下一页
+   */
+  function next() {
+    if (unref(sort) === unref(imgList).length - 1) {
+      sort.value = 0;
+    } else {
+      sort.value = unref(sort) + 1;
     }
+    setValue(unref(imgList)[unref(sort)]);
+  }
 
-    // 设置受控节点值
-    function setValue(value) {
-        selectedKeys.value = [];
-        imgUrl.value = value.imgUrl;
-        selectedKeys.value[0] = value.key;
-        expandedKeys.value[0] = value.pkey;
-        navName.value = value.navName;
-    }
+  // 设置受控节点值
+  function setValue(value) {
+    selectedKeys.value = [];
+    imgUrl.value = value.imgUrl;
+    selectedKeys.value[0] = value.key;
+    expandedKeys.value[0] = value.pkey;
+    navName.value = value.navName;
+  }
 </script>
diff --git a/src/views/demo/jeecg/InnerExpandTable.vue b/src/views/demo/jeecg/InnerExpandTable.vue
index af47dc5..4499fa3 100644
--- a/src/views/demo/jeecg/InnerExpandTable.vue
+++ b/src/views/demo/jeecg/InnerExpandTable.vue
@@ -1,219 +1,210 @@
 <template>
   <a-card :bordered="false">
-      <BasicTable
-          @register="registerTable"
-          :expandedRowKeys="expandedRowKeys"
-          :rowSelection="rowSelection"
-          @expand="handleExpand">
-          <template #tableTitle>
-              <a-button type="primary" @click="handleAdd" preIcon="ant-design:plus-outlined"> 新增</a-button>
-          </template>
-          <template #expandedRowRender>
-              <BasicTable 
-                  bordered
-                  size="middle"
-                  rowKey="id"
-                  :canResize="false"
-                  :columns="innerColumns"
-                  :dataSource="innerData"
-                  :pagination="false">
-              </BasicTable>
-          </template>
-          <!--操作栏-->
-          <template #action="{ record }">
-              <TableAction :actions="getTableAction(record)"/>
-          </template>
-      </BasicTable>
-      <JVxeTableModal @register="registerModal" @success="reload()"></JVxeTableModal>
+    <BasicTable @register="registerTable" :expandedRowKeys="expandedRowKeys" :rowSelection="rowSelection" @expand="handleExpand">
+      <template #tableTitle>
+        <a-button type="primary" @click="handleAdd" preIcon="ant-design:plus-outlined"> 新增</a-button>
+      </template>
+      <template #expandedRowRender>
+        <BasicTable bordered size="middle" rowKey="id" :canResize="false" :columns="innerColumns" :dataSource="innerData" :pagination="false"> </BasicTable>
+      </template>
+      <!--操作栏-->
+      <template #action="{ record }">
+        <TableAction :actions="getTableAction(record)" />
+      </template>
+    </BasicTable>
+    <JVxeTableModal @register="registerModal" @success="reload()"></JVxeTableModal>
   </a-card>
 </template>
 
 <script lang="ts" setup>
-    import { ref } from 'vue';
-    import { defHttp } from '/@/utils/http/axios'
-    import { BasicTable, useTable,TableAction } from '/@/components/Table'
-    import {useModal} from '/@/components/Modal';
-    import JVxeTableModal from '/@/views/demo/vextable/jvxetable/JVxeTableModal.vue';
-    //接口url
-    const url = {
-        list: "/test/order/orderList",
-        delete: "/test/order/delete",
-        deleteBatch: "/test/order/deleteBatch",
-        customerListByMainId: "/test/order/listOrderCustomerByMainId",
-    };
-    // 展开key
-    const expandedRowKeys = ref<any[]>([]);
-    // 选择key
-    const checkedKeys = ref<any[]>([]);
-    // 子表数据
-    const innerData = ref<any[]>([]);
-    // 主表表头
-    const columns = [
+  import { ref } from 'vue';
+  import { defHttp } from '/@/utils/http/axios';
+  import { BasicTable, useTable, TableAction } from '/@/components/Table';
+  import { useModal } from '/@/components/Modal';
+  import JVxeTableModal from '/@/views/demo/vextable/jvxetable/JVxeTableModal.vue';
+  //接口url
+  const url = {
+    list: '/test/order/orderList',
+    delete: '/test/order/delete',
+    deleteBatch: '/test/order/deleteBatch',
+    customerListByMainId: '/test/order/listOrderCustomerByMainId',
+  };
+  // 展开key
+  const expandedRowKeys = ref<any[]>([]);
+  // 选择key
+  const checkedKeys = ref<any[]>([]);
+  // 子表数据
+  const innerData = ref<any[]>([]);
+  // 主表表头
+  const columns = [
     {
-        title: '订单号',
-        align: "center",
-        dataIndex: 'orderCode',
-        width: 100,
+      title: '订单号',
+      align: 'center',
+      dataIndex: 'orderCode',
+      width: 100,
     },
     {
-        title: '订单类型',
-        align: "center",
-        dataIndex: 'ctype',
-        width: 100,
-        customRender: ({text}) => {
-            let re = "";
-            if (text === '1') {
-                re = "国内订单";
-            } else if (text === '2') {
-                re = "国际订单";
-            }
-            return re;
+      title: '订单类型',
+      align: 'center',
+      dataIndex: 'ctype',
+      width: 100,
+      customRender: ({ text }) => {
+        let re = '';
+        if (text === '1') {
+          re = '国内订单';
+        } else if (text === '2') {
+          re = '国际订单';
         }
+        return re;
+      },
     },
     {
-        title: '订单日期',
-        align: "center",
-        width: 100,
-        dataIndex: 'orderDate'
+      title: '订单日期',
+      align: 'center',
+      width: 100,
+      dataIndex: 'orderDate',
     },
     {
-        title: '订单金额',
-        align: "center",
-        dataIndex: 'orderMoney',
-        width: 100,
+      title: '订单金额',
+      align: 'center',
+      dataIndex: 'orderMoney',
+      width: 100,
     },
     {
-        title: '订单备注',
-        align: "center",
-        dataIndex: 'content',
-        width: 100,
-    }];
-    // 子表表头
-    const innerColumns = [
-        {
-            title: '客户名',
-            align: "center",
-            width: 100,
-            dataIndex: 'name',
-            key: 'name',
-        },
-        {
-            title: '性别',
-            align: "center",
-            dataIndex: 'sex',
-            customRender: function (text) {
-                if (text == 1) {
-                    return "男";
-                } else if (text == 2) {
-                    return "女";
-                } else {
-                    return text;
-                }
-            }
-        },
-        {
-            title: '身份证号码',
-            align: "center",
-            dataIndex: 'idcard',
-        },
-        {
-            title: '电话',
-            dataIndex: 'telphone',
-            align: "center",
-        }];
-    const list = (params) =>defHttp.get({url: url.list, params});
-    const [registerModal, {openModal}] = useModal();
-    const [registerTable, { reload }] = useTable({
-        columns,
-        api:list,
-        rowKey: 'id',
-        striped: true,
-        useSearchForm: false,
-        showTableSetting: true,
-        clickToRowSelect: false,
-        bordered: true,
-        actionColumn: {
-            width: 110,
-            title: '操作',
-            dataIndex: 'action',
-            slots: {customRender: 'action'},
-            fixed: undefined,
-        },
-    });
-    
-    /**
-     * 选择列配置
-     */
-    const rowSelection = {
-        type: 'checkbox',
-        columnWidth: 30,
-        selectedRowKeys: checkedKeys,
-        onChange: onSelectChange
-    };
+      title: '订单备注',
+      align: 'center',
+      dataIndex: 'content',
+      width: 100,
+    },
+  ];
+  // 子表表头
+  const innerColumns = [
+    {
+      title: '客户名',
+      align: 'center',
+      width: 100,
+      dataIndex: 'name',
+      key: 'name',
+    },
+    {
+      title: '性别',
+      align: 'center',
+      dataIndex: 'sex',
+      customRender: function (text) {
+        if (text == 1) {
+          return '男';
+        } else if (text == 2) {
+          return '女';
+        } else {
+          return text;
+        }
+      },
+    },
+    {
+      title: '身份证号码',
+      align: 'center',
+      dataIndex: 'idcard',
+    },
+    {
+      title: '电话',
+      dataIndex: 'telphone',
+      align: 'center',
+    },
+  ];
+  const list = (params) => defHttp.get({ url: url.list, params });
+  const [registerModal, { openModal }] = useModal();
+  const [registerTable, { reload }] = useTable({
+    columns,
+    api: list,
+    rowKey: 'id',
+    striped: true,
+    useSearchForm: false,
+    showTableSetting: true,
+    clickToRowSelect: false,
+    bordered: true,
+    actionColumn: {
+      width: 110,
+      title: '操作',
+      dataIndex: 'action',
+      slots: { customRender: 'action' },
+      fixed: undefined,
+    },
+  });
 
-    /**
-     * 选择事件
-     */
-    function onSelectChange(selectedRowKeys: (string | number)[]) {
-        checkedKeys.value = selectedRowKeys;
-    }
-    /**
-     * 展开事件
-     * */
-    function handleExpand(expanded, record){
-        expandedRowKeys.value=[];
-        innerData.value=[];
-        if(expanded === true){
-            expandedRowKeys.value.push(record.id);
-            defHttp.get({url:url.customerListByMainId,params:{orderId: record.id}},{isTransformResponse:false}).then((res) => {
-                if (res.success) {
-                   innerData.value = res.result.records;
-                }
-            });
+  /**
+   * 选择列配置
+   */
+  const rowSelection = {
+    type: 'checkbox',
+    columnWidth: 30,
+    selectedRowKeys: checkedKeys,
+    onChange: onSelectChange,
+  };
+
+  /**
+   * 选择事件
+   */
+  function onSelectChange(selectedRowKeys: (string | number)[]) {
+    checkedKeys.value = selectedRowKeys;
+  }
+  /**
+   * 展开事件
+   * */
+  function handleExpand(expanded, record) {
+    expandedRowKeys.value = [];
+    innerData.value = [];
+    if (expanded === true) {
+      expandedRowKeys.value.push(record.id);
+      defHttp.get({ url: url.customerListByMainId, params: { orderId: record.id } }, { isTransformResponse: false }).then((res) => {
+        if (res.success) {
+          innerData.value = res.result.records;
         }
+      });
     }
-    /**
-     * 新增事件
-     */
-     function handleAdd() {
-        openModal(true, {
-            isUpdate: false,
-        });
-    }
-    /**
-     * 编辑事件
-     */
-    function handleEdit(record) {
-        openModal(true, {
-            record,
-            isUpdate: true,
-        });
-    }
-    /**
-     * 删除事件
-     */
-     function handleDelete(record) {
-         defHttp.delete({url: url.delete, data: {id:record.id}}, {joinParamsToUrl: true}).then(()=>{
-            reload();
-        });
-    }
-    /**
-     * 操作栏
-     */
-    function getTableAction(record){
-        return [
-            {
-                label: '编辑',
-                onClick: handleEdit.bind(null, record),
-            },{
-                label: '删除',
-                popConfirm: {
-                    title: '是否确认删除',
-                    confirm: handleDelete.bind(null, record),
-                },
-            }
-        ]
-    }
+  }
+  /**
+   * 新增事件
+   */
+  function handleAdd() {
+    openModal(true, {
+      isUpdate: false,
+    });
+  }
+  /**
+   * 编辑事件
+   */
+  function handleEdit(record) {
+    openModal(true, {
+      record,
+      isUpdate: true,
+    });
+  }
+  /**
+   * 删除事件
+   */
+  function handleDelete(record) {
+    defHttp.delete({ url: url.delete, data: { id: record.id } }, { joinParamsToUrl: true }).then(() => {
+      reload();
+    });
+  }
+  /**
+   * 操作栏
+   */
+  function getTableAction(record) {
+    return [
+      {
+        label: '编辑',
+        onClick: handleEdit.bind(null, record),
+      },
+      {
+        label: '删除',
+        popConfirm: {
+          title: '是否确认删除',
+          confirm: handleDelete.bind(null, record),
+        },
+      },
+    ];
+  }
 </script>
 <style scoped>
   .ant-card-body .table-operator {
@@ -226,24 +217,24 @@
   }
 
   .anty-row-operator button {
-    margin: 0 5px
+    margin: 0 5px;
   }
 
   .ant-btn-danger {
-    background-color: #ffffff
+    background-color: #ffffff;
   }
 
   .ant-modal-cust-warp {
-    height: 100%
+    height: 100%;
   }
 
   .ant-modal-cust-warp .ant-modal-body {
     height: calc(100% - 110px) !important;
-    overflow-y: auto
+    overflow-y: auto;
   }
 
   .ant-modal-cust-warp .ant-modal-content {
     height: 90% !important;
-    overflow-y: hidden
+    overflow-y: hidden;
   }
 </style>
diff --git a/src/views/demo/jeecg/JCodeEditDemo.vue b/src/views/demo/jeecg/JCodeEditDemo.vue
index 92243b5..675e7b6 100644
--- a/src/views/demo/jeecg/JCodeEditDemo.vue
+++ b/src/views/demo/jeecg/JCodeEditDemo.vue
@@ -1,9 +1,9 @@
 <template>
-    <BasicForm :labelWidth="200" :schemas="schemas" :showResetButton="false" :showSubmitButton="false"  :actionColOptions="{ span: 24 }" @submit="handleSubmit" @reset="handleReset" style="height: 800px">
-        <template #jCodeEdit="{model, field }">
-            <JCodeEditor v-model:value="model[field]" mode="js" height="300px" :fullScreen="true"/>
-        </template>
-    </BasicForm>
+  <BasicForm :labelWidth="200" :schemas="schemas" :showResetButton="false" :showSubmitButton="false" :actionColOptions="{ span: 24 }" @submit="handleSubmit" @reset="handleReset" style="height: 800px">
+    <template #jCodeEdit="{ model, field }">
+      <JCodeEditor v-model:value="model[field]" mode="js" height="300px" :fullScreen="true" />
+    </template>
+  </BasicForm>
 </template>
 <script lang="ts">
   import { computed, defineComponent, unref, ref } from 'vue';
@@ -22,7 +22,7 @@
       colProps: {
         span: 15,
       },
-      defaultValue: 'Hello JeecgBoot'
+      defaultValue: 'Hello JeecgBoot',
     },
   ];
 
diff --git a/src/views/demo/jeecg/JEditorDemo.vue b/src/views/demo/jeecg/JEditorDemo.vue
index af47222..10657eb 100644
--- a/src/views/demo/jeecg/JEditorDemo.vue
+++ b/src/views/demo/jeecg/JEditorDemo.vue
@@ -8,95 +8,92 @@
         <a-button type="primary" @click="setValues()">设置值</a-button>
       </a-button-group>
 
-      <BasicForm @register="register" @submit="handleSubmit"/>
+      <BasicForm @register="register" @submit="handleSubmit" />
     </div>
   </div>
 </template>
 
 <script lang="ts">
-export default {
-  title: '富文本 | Markdown',
-  name: 'MarkdownDemo',
-}
+  export default {
+    title: '富文本 | Markdown',
+    name: 'MarkdownDemo',
+  };
 </script>
 
 <script lang="ts" setup>
-import { FormSchema, useForm, BasicForm } from '/@/components/Form'
-import { useMessage } from '/@/hooks/web/useMessage'
+  import { FormSchema, useForm, BasicForm } from '/@/components/Form';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
-const { createMessage, createSuccessModal } = useMessage()
+  const { createMessage, createSuccessModal } = useMessage();
 
-const schemas: FormSchema[] = [
-  {
-    field: 'name',
-    component: 'Input',
-    label: '姓名',
-    required: true,
-    defaultValue: 'zhangsan',
-  },
-  {
-    field: 'tinymce',
-    component: 'JEditor',
-    label: '富文本',
-    defaultValue: 'defaultValue',
-    required: true,
-  },
-  {
-    field: 'markdown',
-    component: 'JMarkdownEditor',
-    label: 'Markdown',
-    defaultValue: '# 张三',
-    required: true,
-    componentProps: {
-      height: 300,
+  const schemas: FormSchema[] = [
+    {
+      field: 'name',
+      component: 'Input',
+      label: '姓名',
+      required: true,
+      defaultValue: 'zhangsan',
     },
-  },
-]
+    {
+      field: 'tinymce',
+      component: 'JEditor',
+      label: '富文本',
+      defaultValue: 'defaultValue',
+      required: true,
+    },
+    {
+      field: 'markdown',
+      component: 'JMarkdownEditor',
+      label: 'Markdown',
+      defaultValue: '# 张三',
+      required: true,
+      componentProps: {
+        height: 300,
+      },
+    },
+  ];
 
-const [register, { setProps, validate, setFieldsValue }] = useForm({
-  labelWidth: 120,
-  schemas: schemas,
-  actionColOptions: {
-    span: 24,
-  },
-  compact: true,
-  showResetButton:false,
-  showSubmitButton:false,
-  showAdvancedButton: false,
-  disabled: false,
-})
+  const [register, { setProps, validate, setFieldsValue }] = useForm({
+    labelWidth: 120,
+    schemas: schemas,
+    actionColOptions: {
+      span: 24,
+    },
+    compact: true,
+    showResetButton: false,
+    showSubmitButton: false,
+    showAdvancedButton: false,
+    disabled: false,
+  });
 
-function handleSubmit(values) {
-  console.log(values)
-}
-
-function setDis(flag) {
-  setProps({ disabled: !!flag })
-}
-
-async function getValues() {
-  try {
-    const values = await validate()
-    console.log(values)
-    createSuccessModal({
-      title: '校验通过',
-      content: `${JSON.stringify(values)}`,
-    })
-  } catch (error) {
-    createMessage.warning('检验不通过')
+  function handleSubmit(values) {
+    console.log(values);
   }
-}
 
-function setValues() {
-  setFieldsValue({
-    name: 'LiSi',
-    markdown: '# 李四',
-    tinymce: '<p><strong><span style="font-size: 18pt;">张<span style="color: #e03e2d;">三</span>丰</span></strong></p>',
-  })
-}
+  function setDis(flag) {
+    setProps({ disabled: !!flag });
+  }
 
+  async function getValues() {
+    try {
+      const values = await validate();
+      console.log(values);
+      createSuccessModal({
+        title: '校验通过',
+        content: `${JSON.stringify(values)}`,
+      });
+    } catch (error) {
+      createMessage.warning('检验不通过');
+    }
+  }
+
+  function setValues() {
+    setFieldsValue({
+      name: 'LiSi',
+      markdown: '# 李四',
+      tinymce: '<p><strong><span style="font-size: 18pt;">张<span style="color: #e03e2d;">三</span>丰</span></strong></p>',
+    });
+  }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/views/demo/jeecg/JUploadDemo.vue b/src/views/demo/jeecg/JUploadDemo.vue
index e1e7863..c7f2cd8 100644
--- a/src/views/demo/jeecg/JUploadDemo.vue
+++ b/src/views/demo/jeecg/JUploadDemo.vue
@@ -4,83 +4,81 @@
     <a-button type="primary" @click="setDisabled(1)">禁用</a-button>
     <a-button type="primary" @click="showUploadModal">文件弹窗</a-button>
   </a-button-group>
-  <BasicForm @register="register" @submit="handleSubmit"/>
-  <JUploadModal v-model:value="uploadModalValue" @register="registerModel"/>
+  <BasicForm @register="register" @submit="handleSubmit" />
+  <JUploadModal v-model:value="uploadModalValue" @register="registerModel" />
 </template>
 
 <script lang="ts" setup>
-import { ref } from 'vue'
-import { FormSchema, useForm, BasicForm } from '/@/components/Form'
-import { UploadTypeEnum } from '/@/components/Form/src/jeecg/components/JUpload'
-import { JUploadModal } from '/@/components/Form/src/jeecg/components/JUpload'
-import { useModal } from '/@/components/Modal'
+  import { ref } from 'vue';
+  import { FormSchema, useForm, BasicForm } from '/@/components/Form';
+  import { UploadTypeEnum } from '/@/components/Form/src/jeecg/components/JUpload';
+  import { JUploadModal } from '/@/components/Form/src/jeecg/components/JUpload';
+  import { useModal } from '/@/components/Modal';
 
-const uploadModalValue = ref('')
+  const uploadModalValue = ref('');
 
-const schemas: FormSchema[] = [
-  {
-    field: 'uploadFile',
-    component: 'JUpload',
-    helpMessage: '无限制上传',
-    label: '上传文件',
-  },
-  {
-    field: 'uploadFileMax',
-    component: 'JUpload',
-    helpMessage: '最多上传3个文件',
-    label: '上传文件（3）',
-    componentProps: { maxCount: 3 },
-  },
-  {
-    field: 'uploadImage',
-    component: 'JUpload',
-    label: '上传图片',
-    helpMessage: '无限制上传',
-    componentProps: {
-      fileType: UploadTypeEnum.image,
+  const schemas: FormSchema[] = [
+    {
+      field: 'uploadFile',
+      component: 'JUpload',
+      helpMessage: '无限制上传',
+      label: '上传文件',
     },
-  },
-  {
-    field: 'uploadImageMax',
-    component: 'JUpload',
-    label: '上传图片（1）',
-    helpMessage: '最多上传1张图片',
-    componentProps: {
-      fileType: UploadTypeEnum.image,
-      maxCount: 1,
+    {
+      field: 'uploadFileMax',
+      component: 'JUpload',
+      helpMessage: '最多上传3个文件',
+      label: '上传文件（3）',
+      componentProps: { maxCount: 3 },
     },
-  },
-]
+    {
+      field: 'uploadImage',
+      component: 'JUpload',
+      label: '上传图片',
+      helpMessage: '无限制上传',
+      componentProps: {
+        fileType: UploadTypeEnum.image,
+      },
+    },
+    {
+      field: 'uploadImageMax',
+      component: 'JUpload',
+      label: '上传图片（1）',
+      helpMessage: '最多上传1张图片',
+      componentProps: {
+        fileType: UploadTypeEnum.image,
+        maxCount: 1,
+      },
+    },
+  ];
 
-const [registerModel, { openModal }] = useModal()
+  const [registerModel, { openModal }] = useModal();
 
-const [register, { setProps, validate, setFieldsValue }] = useForm({
-  labelWidth: 120,
-  schemas: schemas,
-  actionColOptions: {
-    span: 24,
-  },
-  compact: true,
-  showResetButton:false,
-  showSubmitButton:false,
-  showAdvancedButton: false,
-  disabled: false,
-})
+  const [register, { setProps, validate, setFieldsValue }] = useForm({
+    labelWidth: 120,
+    schemas: schemas,
+    actionColOptions: {
+      span: 24,
+    },
+    compact: true,
+    showResetButton: false,
+    showSubmitButton: false,
+    showAdvancedButton: false,
+    disabled: false,
+  });
 
+  function handleSubmit(values) {
+    console.log(values);
+  }
 
-function handleSubmit(values) {
-  console.log(values)
-}
-
-function setDisabled(flag) {
-  setProps({ disabled: !!flag })
-}
-
-function showUploadModal() {
-  openModal(true, {
-    maxCount: 9,
-    fileType: UploadTypeEnum.image,
-  })
-}
+  function setDisabled(flag) {
+    setProps({ disabled: !!flag });
+  }
 
+  function showUploadModal() {
+    openModal(true, {
+      maxCount: 9,
+      fileType: UploadTypeEnum.image,
+    });
+  }
 </script>
diff --git a/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo1.vue b/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo1.vue
index 3f22d48..60e5101 100644
--- a/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo1.vue
+++ b/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo1.vue
@@ -5,25 +5,24 @@
   </a-space>
 
   <JVxeTable
-      ref="tableRef"
-      stripe
-      toolbar
-      rowNumber
-      rowSelection
-      rowExpand
-      resizable
-      asyncRemove
-      clickSelectRow
-      :maxHeight="480"
-      :checkboxConfig="{range: true}"
-      :disabledRows="{ input:['text--16','text--18' ]}"
-      :loading="loading"
-      :disabled="disabled"
-      :columns="columns"
-      :dataSource="dataSource"
-      @remove="onJVxeRemove"
+    ref="tableRef"
+    stripe
+    toolbar
+    rowNumber
+    rowSelection
+    rowExpand
+    resizable
+    asyncRemove
+    clickSelectRow
+    :maxHeight="480"
+    :checkboxConfig="{ range: true }"
+    :disabledRows="{ input: ['text--16', 'text--18'] }"
+    :loading="loading"
+    :disabled="disabled"
+    :columns="columns"
+    :dataSource="dataSource"
+    @remove="onJVxeRemove"
   >
-
     <template #toolbarSuffix>
       <a-button @click="handleTableCheck">表单验证</a-button>
       <a-tooltip placement="top" title="获取值，忽略表单验证" :autoAdjustOverflow="true">
@@ -46,343 +45,340 @@
 
     <template #myAction="props">
       <a @click="onLookRow(props)">查看</a>
-      <a-divider type="vertical"/>
+      <a-divider type="vertical" />
       <Popconfirm title="确定删除吗？" @confirm="onDeleteRow(props)">
         <a>删除</a>
       </Popconfirm>
     </template>
-
   </JVxeTable>
 </template>
 
 <script lang="ts" setup>
-import { ref } from 'vue'
-// noinspection ES6UnusedImports
-import { Popconfirm } from 'ant-design-vue'
-import { JVxeTypes, JVxeColumn, JVxeTableInstance } from '/@/components/jeecg/JVxeTable/types'
-import { useMessage } from '/@/hooks/web/useMessage'
-import { random } from 'lodash-es'
-import { buildUUID } from '/@/utils/uuid'
-import moment from 'moment'
-import { pushIfNotExist } from '/@/utils/common/compUtils'
+  import { ref } from 'vue';
+  // noinspection ES6UnusedImports
+  import { Popconfirm } from 'ant-design-vue';
+  import { JVxeTypes, JVxeColumn, JVxeTableInstance } from '/@/components/jeecg/JVxeTable/types';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { random } from 'lodash-es';
+  import { buildUUID } from '/@/utils/uuid';
+  import moment from 'moment';
+  import { pushIfNotExist } from '/@/utils/common/compUtils';
 
-const { createMessage } = useMessage()
-const tableRef = ref<JVxeTableInstance>()
-const loading = ref(false)
-const disabled = ref(false)
-const columns = ref<JVxeColumn[]>([
-  {
-    title: 'ID',
-    key: 'id',
-    type: JVxeTypes.hidden,
-  },
-  {
-    title: '不可编辑',
-    key: 'noEdit',
-    type: JVxeTypes.normal,
-    width: 180,
-    defaultValue: 'noEdit-new',
-  },
-  {
-    title: '单行文本',
-    key: 'input',
-    type: JVxeTypes.input,
-    width: 180,
-    defaultValue: '',
-    placeholder: '请输入${title}',
-    validateRules: [
-      {
-        required: true, // 必填
-        message: '请输入${title}', // 显示的文本
-      },
-      {
-        pattern: /^[a-z|A-Z][a-z|A-Z\d_-]*$/, // 正则
-        message: '必须以字母开头，可包含数字、下划线、横杠',
-      },
-      {
-        unique: true,
-        message: '${title}不能重复',
-      },
-      {
-        handler({ cellValue, row, column }, callback, target) {
-          // cellValue 当前校验的值
-          // callback(flag, message) 方法必须执行且只能执行一次
-          //          flag = 是否通过了校验，不填写或者填写 null 代表不进行任何操作
-          //          message = 提示的类型，默认使用配置的 message
-          // target 行编辑的实例对象
-          if (cellValue === 'abc') {
-            callback(false, '${title}不能是abc')  // false = 未通过校验
-          } else {
-            callback(true) // true = 通过验证
-          }
+  const { createMessage } = useMessage();
+  const tableRef = ref<JVxeTableInstance>();
+  const loading = ref(false);
+  const disabled = ref(false);
+  const columns = ref<JVxeColumn[]>([
+    {
+      title: 'ID',
+      key: 'id',
+      type: JVxeTypes.hidden,
+    },
+    {
+      title: '不可编辑',
+      key: 'noEdit',
+      type: JVxeTypes.normal,
+      width: 180,
+      defaultValue: 'noEdit-new',
+    },
+    {
+      title: '单行文本',
+      key: 'input',
+      type: JVxeTypes.input,
+      width: 180,
+      defaultValue: '',
+      placeholder: '请输入${title}',
+      validateRules: [
+        {
+          required: true, // 必填
+          message: '请输入${title}', // 显示的文本
         },
-        message: '${title}默认提示',
-      },
-    ],
-  },
-  {
-    title: '多行文本',
-    key: 'textarea',
-    type: JVxeTypes.textarea,
-    width: 200,
-  },
-  {
-    title: '数字',
-    key: 'number',
-    type: JVxeTypes.inputNumber,
-    width: 80,
-    defaultValue: 32,
-    // 【统计列】sum = 求和、average = 平均值
-    statistics: ['sum', 'average'],
-  },
-  {
-    title: '下拉框',
-    key: 'select',
-    type: JVxeTypes.select,
-    width: 180,
-    // 下拉选项
-    options: [
-      { title: 'String', value: 'string' },
-      { title: 'Integer', value: 'int' },
-      { title: 'Double', value: 'double' },
-      { title: 'Boolean', value: 'boolean' },
-    ],
-    // allowInput: true,
-    allowSearch: true,
-    placeholder: '请选择',
-  },
-  {
-    title: '下拉框_字典',
-    key: 'select_dict',
-    type: JVxeTypes.select,
-    width: 180,
-    options: [],
-    dictCode: 'sex',
-    placeholder: '请选择',
-  },
-  {
-    title: '下拉框_多选',
-    key: 'select_multiple',
-    type: JVxeTypes.selectMultiple,
-    width: 205,
-    options: [
-      { title: 'String', value: 'string' },
-      { title: 'Integer', value: 'int' },
-      { title: 'Double', value: 'double' },
-      { title: 'Boolean', value: 'boolean' },
-    ],
-    defaultValue: ['int', 'boolean'], // 多个默认项
-    // defaultValue: 'string,double,int', // 也可使用这种方式
-    placeholder: '多选',
-  },
-  {
-    title: '下拉框_搜索',
-    key: 'select_search',
-    type: JVxeTypes.selectSearch,
-    width: 180,
-    options: [
-      { title: 'String', value: 'string' },
-      { title: 'Integer', value: 'int' },
-      { title: 'Double', value: 'double' },
-      { title: 'Boolean', value: 'boolean' },
-    ],
-  },
-  {
-    title: '日期时间',
-    key: 'datetime',
-    type: JVxeTypes.datetime,
-    width: 200,
-    defaultValue: '2019-4-30 14:52:22',
-    placeholder: '请选择',
-  },
-  {
-    title: '时间',
-    key: 'time',
-    type: JVxeTypes.time,
-    width: 200,
-    defaultValue: '14:52:22',
-    placeholder: '请选择',
-  },
-  {
-    title: '复选框',
-    key: 'checkbox',
-    type: JVxeTypes.checkbox,
-    width: 100,
-    customValue: ['Y', 'N'], // true ,false
-    defaultChecked: false,
-  },
-  {
-    title: '操作',
-    key: 'action',
-    type: JVxeTypes.slot,
-    fixed: 'right',
-    minWidth: 100,
-    align: 'center',
-    slotName: 'myAction',
-  },
-])
-const dataSource = ref<any[]>([])
+        {
+          pattern: /^[a-z|A-Z][a-z|A-Z\d_-]*$/, // 正则
+          message: '必须以字母开头，可包含数字、下划线、横杠',
+        },
+        {
+          unique: true,
+          message: '${title}不能重复',
+        },
+        {
+          handler({ cellValue, row, column }, callback, target) {
+            // cellValue 当前校验的值
+            // callback(flag, message) 方法必须执行且只能执行一次
+            //          flag = 是否通过了校验，不填写或者填写 null 代表不进行任何操作
+            //          message = 提示的类型，默认使用配置的 message
+            // target 行编辑的实例对象
+            if (cellValue === 'abc') {
+              callback(false, '${title}不能是abc'); // false = 未通过校验
+            } else {
+              callback(true); // true = 通过验证
+            }
+          },
+          message: '${title}默认提示',
+        },
+      ],
+    },
+    {
+      title: '多行文本',
+      key: 'textarea',
+      type: JVxeTypes.textarea,
+      width: 200,
+    },
+    {
+      title: '数字',
+      key: 'number',
+      type: JVxeTypes.inputNumber,
+      width: 80,
+      defaultValue: 32,
+      // 【统计列】sum = 求和、average = 平均值
+      statistics: ['sum', 'average'],
+    },
+    {
+      title: '下拉框',
+      key: 'select',
+      type: JVxeTypes.select,
+      width: 180,
+      // 下拉选项
+      options: [
+        { title: 'String', value: 'string' },
+        { title: 'Integer', value: 'int' },
+        { title: 'Double', value: 'double' },
+        { title: 'Boolean', value: 'boolean' },
+      ],
+      // allowInput: true,
+      allowSearch: true,
+      placeholder: '请选择',
+    },
+    {
+      title: '下拉框_字典',
+      key: 'select_dict',
+      type: JVxeTypes.select,
+      width: 180,
+      options: [],
+      dictCode: 'sex',
+      placeholder: '请选择',
+    },
+    {
+      title: '下拉框_多选',
+      key: 'select_multiple',
+      type: JVxeTypes.selectMultiple,
+      width: 205,
+      options: [
+        { title: 'String', value: 'string' },
+        { title: 'Integer', value: 'int' },
+        { title: 'Double', value: 'double' },
+        { title: 'Boolean', value: 'boolean' },
+      ],
+      defaultValue: ['int', 'boolean'], // 多个默认项
+      // defaultValue: 'string,double,int', // 也可使用这种方式
+      placeholder: '多选',
+    },
+    {
+      title: '下拉框_搜索',
+      key: 'select_search',
+      type: JVxeTypes.selectSearch,
+      width: 180,
+      options: [
+        { title: 'String', value: 'string' },
+        { title: 'Integer', value: 'int' },
+        { title: 'Double', value: 'double' },
+        { title: 'Boolean', value: 'boolean' },
+      ],
+    },
+    {
+      title: '日期时间',
+      key: 'datetime',
+      type: JVxeTypes.datetime,
+      width: 200,
+      defaultValue: '2019-4-30 14:52:22',
+      placeholder: '请选择',
+    },
+    {
+      title: '时间',
+      key: 'time',
+      type: JVxeTypes.time,
+      width: 200,
+      defaultValue: '14:52:22',
+      placeholder: '请选择',
+    },
+    {
+      title: '复选框',
+      key: 'checkbox',
+      type: JVxeTypes.checkbox,
+      width: 100,
+      customValue: ['Y', 'N'], // true ,false
+      defaultChecked: false,
+    },
+    {
+      title: '操作',
+      key: 'action',
+      type: JVxeTypes.slot,
+      fixed: 'right',
+      minWidth: 100,
+      align: 'center',
+      slotName: 'myAction',
+    },
+  ]);
+  const dataSource = ref<any[]>([]);
 
-/* 随机生成数据 */
-function randomPage(current, pageSize, isLoading = false) {
-  if (isLoading) {
-    loading.value = true
-  }
-
-  let randomDatetime = () => {
-    let time = random(1000, 9999999999999)
-    return moment(new Date(time)).format('YYYY-MM-DD HH:mm:ss')
-  }
-
-  let limit = (current - 1) * pageSize
-
-  let options = ['string', 'int', 'double', 'boolean']
-
-  let begin = Date.now()
-  let values: any[] = []
-  for (let i = 0; i < pageSize; i++) {
-    values.push({
-      id: buildUUID(),
-      noEdit: `noEdit-${(limit + i) + 1}`,
-      input: `text-${(limit + i) + 1}`,
-      textarea: `textarea-${(limit + i) + 1}`,
-      number: random(0, 233),
-      select: options[random(0, 3)],
-      select_dict: random(1, 2).toString(),
-      select_multiple: (() => {
-        let length = random(1, 4)
-        let arr = []
-        for (let j = 0; j < length; j++) {
-          pushIfNotExist(arr, options[random(0, 3)])
-        }
-        return arr.join(',')
-      })(),
-      select_search: options[random(0, 3)],
-      datetime: randomDatetime(),
-      checkbox: ['Y', 'N'][random(0, 1)],
-    })
-  }
-
-  dataSource.value = values
-  let end = Date.now()
-  let diff = end - begin
-
-  if (isLoading && diff < pageSize) {
-    setTimeout(() => loading.value = false, pageSize - diff)
-  }
-
-}
-
-randomPage(0, 20, true)
-
-function onLookRow(props) {
-  createMessage.success('请在控制台查看输出')
-  // 参数介绍：
-  // props.value          当前单元格的值
-  // props.row            当前行的数据
-  // props.rowId          当前行ID
-  // props.rowIndex       当前行下标
-  // props.column         当前列的配置
-  // props.columnIndex    当前列下标
-  // props.$table         vxe实例，可以调用vxe内置方法
-  // props.target         JVXE实例，可以调用JVXE内置方法
-  // props.caseId         JVXE实例唯一ID
-  // props.scrolling      是否正在滚动
-  // props.triggerChange  触发change事件，用于更改slot的值
-  console.log('查看: ', { props })
-}
-
-async function onDeleteRow(props) {
-  // 调用删除方法
-  const res = await tableRef.value?.removeRows(props.row)
-  if (res && res.rows.length > 0) {
-    createMessage.success('删除成功')
-  }
-}
-
-function handleValueChange(event) {
-  console.log('handleValueChange.event: ', event)
-}
-
-/** 表单验证 */
-function handleTableCheck() {
-  tableRef.value!.validateTable().then(errMap => {
-    if (errMap) {
-      console.log('表单验证未通过：', { errMap })
-      createMessage.error('验证未通过，请在控制台查看详细')
-    } else {
-      createMessage.success('验证通过')
+  /* 随机生成数据 */
+  function randomPage(current, pageSize, isLoading = false) {
+    if (isLoading) {
+      loading.value = true;
     }
-  })
-}
 
-/** 获取值，忽略表单验证 */
-function onGetData() {
-  const values = tableRef.value!.getTableData()
-  console.log('获取值:', { values })
-  createMessage.success('获取值成功，请看控制台输出')
-}
+    let randomDatetime = () => {
+      let time = random(1000, 9999999999999);
+      return moment(new Date(time)).format('YYYY-MM-DD HH:mm:ss');
+    };
 
-/** 模拟加载1000条数据 */
-function handleTableSet() {
-  randomPage(1, 1000, true)
-}
+    let limit = (current - 1) * pageSize;
 
-function onDelFirst() {
-  const xTable = tableRef.value!.getXTable()
-  const record = xTable.getTableData().fullData[0]
-  tableRef.value!.removeRows(record)
-}
+    let options = ['string', 'int', 'double', 'boolean'];
 
-function onDelSel() {
-  const xTable = tableRef.value!.getXTable()
-  xTable.removeCheckboxRow()
-}
-
-function onGetSelData() {
-  createMessage.info('请看控制台')
-  console.log(tableRef.value!.getSelectionData())
-}
-
-function onClearSel() {
-  tableRef.value!.clearSelection()
-}
-
-function onToggleLoading() {
-  loading.value = !loading.value
-}
-
-function onToggleDisabled() {
-  disabled.value = !disabled.value
-}
-
-function doDelete(deleteRows) {
-  return new Promise((resolve) => {
-    let rowId = deleteRows.map(row => row.id)
-    console.log('删除 rowId: ', rowId)
-    setTimeout(() => resolve(true), 1500)
-  })
-}
-
-/** 异步删除示例 */
-async function onJVxeRemove(event) {
-  const hideLoading = createMessage.loading('删除中…', 0)
-  try {
-    // 1. 向后台传递 event.deleteRows 以删除
-    let flag = await doDelete(event.deleteRows)
-    if (flag) {
-      // 注：如果启用了表格的 loading 状态，则必须先停止再删除，否则会导致无法从表格上删除数据
-      // 2. 调用 event.confirmRemove 方法确认删除成功
-      await tableRef.value!.removeSelection()
-      // await event.confirmRemove()
-      createMessage.success('删除成功！')
-    } else {
-      // 3. 若删除失败，不调用 event.confirmRemove() 方法就不会删除数据
-      createMessage.warn('删除失败！')
+    let begin = Date.now();
+    let values: any[] = [];
+    for (let i = 0; i < pageSize; i++) {
+      values.push({
+        id: buildUUID(),
+        noEdit: `noEdit-${limit + i + 1}`,
+        input: `text-${limit + i + 1}`,
+        textarea: `textarea-${limit + i + 1}`,
+        number: random(0, 233),
+        select: options[random(0, 3)],
+        select_dict: random(1, 2).toString(),
+        select_multiple: (() => {
+          let length = random(1, 4);
+          let arr = [];
+          for (let j = 0; j < length; j++) {
+            pushIfNotExist(arr, options[random(0, 3)]);
+          }
+          return arr.join(',');
+        })(),
+        select_search: options[random(0, 3)],
+        datetime: randomDatetime(),
+        checkbox: ['Y', 'N'][random(0, 1)],
+      });
     }
-  } finally {
-    hideLoading()
-  }
-}
 
-</script>
\ No newline at end of file
+    dataSource.value = values;
+    let end = Date.now();
+    let diff = end - begin;
+
+    if (isLoading && diff < pageSize) {
+      setTimeout(() => (loading.value = false), pageSize - diff);
+    }
+  }
+
+  randomPage(0, 20, true);
+
+  function onLookRow(props) {
+    createMessage.success('请在控制台查看输出');
+    // 参数介绍：
+    // props.value          当前单元格的值
+    // props.row            当前行的数据
+    // props.rowId          当前行ID
+    // props.rowIndex       当前行下标
+    // props.column         当前列的配置
+    // props.columnIndex    当前列下标
+    // props.$table         vxe实例，可以调用vxe内置方法
+    // props.target         JVXE实例，可以调用JVXE内置方法
+    // props.caseId         JVXE实例唯一ID
+    // props.scrolling      是否正在滚动
+    // props.triggerChange  触发change事件，用于更改slot的值
+    console.log('查看: ', { props });
+  }
+
+  async function onDeleteRow(props) {
+    // 调用删除方法
+    const res = await tableRef.value?.removeRows(props.row);
+    if (res && res.rows.length > 0) {
+      createMessage.success('删除成功');
+    }
+  }
+
+  function handleValueChange(event) {
+    console.log('handleValueChange.event: ', event);
+  }
+
+  /** 表单验证 */
+  function handleTableCheck() {
+    tableRef.value!.validateTable().then((errMap) => {
+      if (errMap) {
+        console.log('表单验证未通过：', { errMap });
+        createMessage.error('验证未通过，请在控制台查看详细');
+      } else {
+        createMessage.success('验证通过');
+      }
+    });
+  }
+
+  /** 获取值，忽略表单验证 */
+  function onGetData() {
+    const values = tableRef.value!.getTableData();
+    console.log('获取值:', { values });
+    createMessage.success('获取值成功，请看控制台输出');
+  }
+
+  /** 模拟加载1000条数据 */
+  function handleTableSet() {
+    randomPage(1, 1000, true);
+  }
+
+  function onDelFirst() {
+    const xTable = tableRef.value!.getXTable();
+    const record = xTable.getTableData().fullData[0];
+    tableRef.value!.removeRows(record);
+  }
+
+  function onDelSel() {
+    const xTable = tableRef.value!.getXTable();
+    xTable.removeCheckboxRow();
+  }
+
+  function onGetSelData() {
+    createMessage.info('请看控制台');
+    console.log(tableRef.value!.getSelectionData());
+  }
+
+  function onClearSel() {
+    tableRef.value!.clearSelection();
+  }
+
+  function onToggleLoading() {
+    loading.value = !loading.value;
+  }
+
+  function onToggleDisabled() {
+    disabled.value = !disabled.value;
+  }
+
+  function doDelete(deleteRows) {
+    return new Promise((resolve) => {
+      let rowId = deleteRows.map((row) => row.id);
+      console.log('删除 rowId: ', rowId);
+      setTimeout(() => resolve(true), 1500);
+    });
+  }
+
+  /** 异步删除示例 */
+  async function onJVxeRemove(event) {
+    const hideLoading = createMessage.loading('删除中…', 0);
+    try {
+      // 1. 向后台传递 event.deleteRows 以删除
+      let flag = await doDelete(event.deleteRows);
+      if (flag) {
+        // 注：如果启用了表格的 loading 状态，则必须先停止再删除，否则会导致无法从表格上删除数据
+        // 2. 调用 event.confirmRemove 方法确认删除成功
+        await tableRef.value!.removeSelection();
+        // await event.confirmRemove()
+        createMessage.success('删除成功！');
+      } else {
+        // 3. 若删除失败，不调用 event.confirmRemove() 方法就不会删除数据
+        createMessage.warn('删除失败！');
+      }
+    } finally {
+      hideLoading();
+    }
+  }
+</script>
diff --git a/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo2.vue b/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo2.vue
index c37223c..b7ef461 100644
--- a/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo2.vue
+++ b/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo2.vue
@@ -1,181 +1,179 @@
 <template>
   <JVxeTable
-      ref="tableRef"
-      toolbar
-      row-number
-      row-selection
-      keep-source
-      :height="484"
-      :loading="loading"
-      :dataSource="dataSource"
-      :columns="columns"
-      :pagination="pagination"
-      style="margin-top: 8px;"
-      @pageChange="handlePageChange"
+    ref="tableRef"
+    toolbar
+    row-number
+    row-selection
+    keep-source
+    :height="484"
+    :loading="loading"
+    :dataSource="dataSource"
+    :columns="columns"
+    :pagination="pagination"
+    style="margin-top: 8px"
+    @pageChange="handlePageChange"
   >
-
     <template #toolbarSuffix>
       <a-button @click="handleTableGet">获取数据</a-button>
     </template>
-
   </JVxeTable>
 </template>
 
 <script lang="ts" setup>
-import { reactive, ref } from 'vue'
-// noinspection ES6UnusedImports
-import { Popconfirm } from 'ant-design-vue'
-import { JVxeColumn, JVxeTableInstance, JVxeTypes } from '/@/components/jeecg/JVxeTable/types'
-import { useMessage } from '/@/hooks/web/useMessage'
-import { random } from 'lodash-es'
-import { buildUUID } from '/@/utils/uuid'
-import { uploadUrl } from '/@/api/common/api'
+  import { reactive, ref } from 'vue';
+  // noinspection ES6UnusedImports
+  import { Popconfirm } from 'ant-design-vue';
+  import { JVxeColumn, JVxeTableInstance, JVxeTypes } from '/@/components/jeecg/JVxeTable/types';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { random } from 'lodash-es';
+  import { buildUUID } from '/@/utils/uuid';
+  import { uploadUrl } from '/@/api/common/api';
 
-const tableRef = ref<JVxeTableInstance>()
-const { createMessage } = useMessage()
-const loading = ref(false)
-const columns = ref<JVxeColumn[]>([
-  {
-    title: '下拉框_字典表搜索',
-    key: 'select_dict_search',
-    type: JVxeTypes.selectDictSearch,
-    width: 200,
-    async: true, // 异步搜索，默认为 true
-    // 字典表配置信息：数据库表名,显示字段名,存储字段名
-    dict: 'sys_user,realname,username',
-    tipsContent: '请输入查询条件',
-  },
-  {
-    title: 'JPopup',
-    key: 'popup',
-    type: JVxeTypes.popup,
-    width: 180,
-    popupCode: 'demo',
-    // field: 'name,sex,age',
-    // orgFields: 'name,sex,age',
-    // destFields: 'popup,popup_sex,popup_age',
-    fieldConfig: [
-      { source: 'name', target: 'popup' },
-      { source: 'sex', target: 'popup_sex' },
-      { source: 'age', target: 'popup_age' },
-    ],
-  },
-  {
-    title: 'JP-性别',
-    key: 'popup_sex',
-    type: JVxeTypes.select,
-    dictCode: 'sex',
-    disabled: true,
-    width: 100,
-  },
-  {
-    title: 'JP-年龄',
-    key: 'popup_age',
-    type: JVxeTypes.normal,
-    width: 80,
-  },
-  {
-    title: '用户选择',
-    key: 'userSelect',
-    type: JVxeTypes.userSelect,
-    width: 240,
-  },
-  {
-    title: '部门选择',
-    key: 'departSelect',
-    type: JVxeTypes.departSelect,
-    width: 240,
-  },
-  {
-    title: '单选',
-    key: 'radio',
-    type: JVxeTypes.radio,
-    width: 130,
-    options: [
-      { text: '男', value: '1' },
-      { text: '女', value: '2' },
-    ],
-    // 允许清除选择（再点一次取消选择）
-    allowClear: false,
-  },
-  {
-    title: '上传',
-    key: 'upload',
-    type: JVxeTypes.upload,
-    width: 180,
-    btnText: '点击上传',
-    token: true,
-    responseName: 'message',
-    action: uploadUrl,
-  },
-  {
-    title: '图片上传',
-    key: 'image',
-    type: JVxeTypes.image,
-    width: 180,
-    maxCount: 6,
-  },
-  {
-    title: '文件上传',
-    key: 'file',
-    type: JVxeTypes.file,
-    width: 180,
-    maxCount: 2,
-  },
-  {
-    title: '进度条',
-    key: 'progress',
-    type: JVxeTypes.progress,
-    minWidth: 320,
-  },
-])
-const dataSource = ref<any[]>([])
-const pagination = reactive({
-  current: 1,
-  pageSize: 10,
-  pageSizeOptions: ['10', '20', '30', '100', '200'],
-  total: 1000,
-})
+  const tableRef = ref<JVxeTableInstance>();
+  const { createMessage } = useMessage();
+  const loading = ref(false);
+  const columns = ref<JVxeColumn[]>([
+    {
+      title: '下拉框_字典表搜索',
+      key: 'select_dict_search',
+      type: JVxeTypes.selectDictSearch,
+      width: 200,
+      async: true, // 异步搜索，默认为 true
+      // 字典表配置信息：数据库表名,显示字段名,存储字段名
+      dict: 'sys_user,realname,username',
+      tipsContent: '请输入查询条件',
+    },
+    {
+      title: 'JPopup',
+      key: 'popup',
+      type: JVxeTypes.popup,
+      width: 180,
+      popupCode: 'demo',
+      // field: 'name,sex,age',
+      // orgFields: 'name,sex,age',
+      // destFields: 'popup,popup_sex,popup_age',
+      fieldConfig: [
+        { source: 'name', target: 'popup' },
+        { source: 'sex', target: 'popup_sex' },
+        { source: 'age', target: 'popup_age' },
+      ],
+    },
+    {
+      title: 'JP-性别',
+      key: 'popup_sex',
+      type: JVxeTypes.select,
+      dictCode: 'sex',
+      disabled: true,
+      width: 100,
+    },
+    {
+      title: 'JP-年龄',
+      key: 'popup_age',
+      type: JVxeTypes.normal,
+      width: 80,
+    },
+    {
+      title: '用户选择',
+      key: 'userSelect',
+      type: JVxeTypes.userSelect,
+      width: 240,
+    },
+    {
+      title: '部门选择',
+      key: 'departSelect',
+      type: JVxeTypes.departSelect,
+      width: 240,
+    },
+    {
+      title: '单选',
+      key: 'radio',
+      type: JVxeTypes.radio,
+      width: 130,
+      options: [
+        { text: '男', value: '1' },
+        { text: '女', value: '2' },
+      ],
+      // 允许清除选择（再点一次取消选择）
+      allowClear: false,
+    },
+    {
+      title: '上传',
+      key: 'upload',
+      type: JVxeTypes.upload,
+      width: 180,
+      btnText: '点击上传',
+      token: true,
+      responseName: 'message',
+      action: uploadUrl,
+    },
+    {
+      title: '图片上传',
+      key: 'image',
+      type: JVxeTypes.image,
+      width: 180,
+      maxCount: 6,
+    },
+    {
+      title: '文件上传',
+      key: 'file',
+      type: JVxeTypes.file,
+      width: 180,
+      maxCount: 2,
+    },
+    {
+      title: '进度条',
+      key: 'progress',
+      type: JVxeTypes.progress,
+      minWidth: 320,
+    },
+  ]);
+  const dataSource = ref<any[]>([]);
+  const pagination = reactive({
+    current: 1,
+    pageSize: 10,
+    pageSizeOptions: ['10', '20', '30', '100', '200'],
+    total: 1000,
+  });
 
-randomPage(pagination.current, pagination.pageSize, true)
+  randomPage(pagination.current, pagination.pageSize, true);
 
-// 当分页参数变化时触发的事件
-function handlePageChange(event) {
-  // 重新赋值
-  pagination.current = event.current
-  pagination.pageSize = event.pageSize
-  // 查询数据
-  randomPage(event.current, event.pageSize, true)
-}
-
-/** 获取值，忽略表单验证 */
-function handleTableGet() {
-  const values = tableRef.value!.getTableData()
-  console.log('获取值:', { values })
-  createMessage.success('获取值成功，请看控制台输出')
-}
-
-/* 随机生成分页数据 */
-function randomPage(current, pageSize, $loading = false) {
-  if ($loading) {
-    loading.value = true
+  // 当分页参数变化时触发的事件
+  function handlePageChange(event) {
+    // 重新赋值
+    pagination.current = event.current;
+    pagination.pageSize = event.pageSize;
+    // 查询数据
+    randomPage(event.current, event.pageSize, true);
   }
-  let begin = Date.now()
-  let values: any[] = []
-  for (let i = 0; i < pageSize; i++) {
-    let radio = random(0, 2)
-    values.push({
-      id: buildUUID(),
-      select_dict_search: ['admin', '', 'jeecg'][random(0, 2)],
-      progress: random(0, 100),
-      radio: radio ? radio.toString() : null,
-    })
+
+  /** 获取值，忽略表单验证 */
+  function handleTableGet() {
+    const values = tableRef.value!.getTableData();
+    console.log('获取值:', { values });
+    createMessage.success('获取值成功，请看控制台输出');
   }
-  dataSource.value = values
-  let end = Date.now()
-  let diff = end - begin
-  if ($loading && diff < pageSize) {
-    setTimeout(() => loading.value = false, pageSize - diff)
+
+  /* 随机生成分页数据 */
+  function randomPage(current, pageSize, $loading = false) {
+    if ($loading) {
+      loading.value = true;
+    }
+    let begin = Date.now();
+    let values: any[] = [];
+    for (let i = 0; i < pageSize; i++) {
+      let radio = random(0, 2);
+      values.push({
+        id: buildUUID(),
+        select_dict_search: ['admin', '', 'jeecg'][random(0, 2)],
+        progress: random(0, 100),
+        radio: radio ? radio.toString() : null,
+      });
+    }
+    dataSource.value = values;
+    let end = Date.now();
+    let diff = end - begin;
+    if ($loading && diff < pageSize) {
+      setTimeout(() => (loading.value = false), pageSize - diff);
+    }
   }
-}
-</script>
\ No newline at end of file
+</script>
diff --git a/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo3.vue b/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo3.vue
index ad3bd45..e9c834a 100644
--- a/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo3.vue
+++ b/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo3.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <ol style="border: 1px solid #cccccc; width: 600px; padding: 8px;">
+    <ol style="border: 1px solid #cccccc; width: 600px; padding: 8px">
       <li>1. 开启 dragSort 属性之后即可实现上下拖拽排序。</li>
       <li>2. 使用 sortKey 属性可以自定义排序保存的 key，默认为 orderNum。</li>
       <li>3. 使用 sortBegin 属性可以自定义排序的起始值，默认为 0。</li>
@@ -8,132 +8,110 @@
       <li>5. 当存在 fixed 列时，拖拽排序将会失效，仅能上下排序。</li>
     </ol>
 
-    <p>
-      以下示例开启了拖拽排序，排序值保存字段为 sortNum，排序起始值为 3<br>
-    </p>
+    <p> 以下示例开启了拖拽排序，排序值保存字段为 sortNum，排序起始值为 3<br /> </p>
 
-    <JVxeTable
-        ref="tableRef1"
-        toolbar
-        dragSort
-        sortKey="sortNum"
-        :sortBegin="3"
-        rowSelection
-        :maxHeight="580"
-        :columns="table1.columns"
-        :dataSource="table1.data"
-    >
+    <JVxeTable ref="tableRef1" toolbar dragSort sortKey="sortNum" :sortBegin="3" rowSelection :maxHeight="580" :columns="table1.columns" :dataSource="table1.data">
       <template #toolbarSuffix>
         <a-button @click="onGetData1">获取数据</a-button>
       </template>
     </JVxeTable>
 
-    <br>
+    <br />
     <p>以下 fixed 表格不支持拖拽排序，仅支持点击上下排序</p>
 
-    <JVxeTable
-        ref="tableRef2"
-        toolbar
-        dragSort
-        rowSelection
-        :maxHeight="580"
-        :columns="table2.columns"
-        :dataSource="table2.data"
-    >
+    <JVxeTable ref="tableRef2" toolbar dragSort rowSelection :maxHeight="580" :columns="table2.columns" :dataSource="table2.data">
       <template #toolbarSuffix>
         <a-button @click="onGetData2">获取数据</a-button>
       </template>
     </JVxeTable>
-
   </div>
 </template>
 
 <script lang="ts" setup>
-import { ref, reactive } from 'vue'
-import { JVxeTypes, JVxeColumn, JVxeTableInstance } from '/@/components/jeecg/JVxeTable/types'
-import { useMessage } from '/@/hooks/web/useMessage'
+  import { ref, reactive } from 'vue';
+  import { JVxeTypes, JVxeColumn, JVxeTableInstance } from '/@/components/jeecg/JVxeTable/types';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
-const tableRef1 = ref<JVxeTableInstance>()
-const tableRef2 = ref<JVxeTableInstance>()
-const table1 = reactive({
-  columns: [
-    {
-      title: 'ID',
-      key: 'id',
-      width: 120,
-      type: JVxeTypes.normal,
-    },
-    {
-      title: '姓名',
-      key: 'name',
-      width: 240,
-      type: JVxeTypes.input,
-      defaultValue: 'new name',
-    },
-    {
-      title: '字段长度',
-      key: 'dbLength',
-      width: 240,
-      type: JVxeTypes.inputNumber,
-      defaultValue: 32,
-    },
-    {
-      title: 'sortNum',
-      key: 'sortNum',
-      width: 120,
-      type: JVxeTypes.normal,
-    },
-  ] as JVxeColumn[],
-  data: [
-    { id: 'uuid-0001', name: '张三', dbLength: 123 },
-    { id: 'uuid-0002', name: '李四', dbLength: 777 },
-    { id: 'uuid-0003', name: '王五', dbLength: 666 },
-    { id: 'uuid-0004', name: '赵六', dbLength: 233 },
-  ],
-})
+  const tableRef1 = ref<JVxeTableInstance>();
+  const tableRef2 = ref<JVxeTableInstance>();
+  const table1 = reactive({
+    columns: [
+      {
+        title: 'ID',
+        key: 'id',
+        width: 120,
+        type: JVxeTypes.normal,
+      },
+      {
+        title: '姓名',
+        key: 'name',
+        width: 240,
+        type: JVxeTypes.input,
+        defaultValue: 'new name',
+      },
+      {
+        title: '字段长度',
+        key: 'dbLength',
+        width: 240,
+        type: JVxeTypes.inputNumber,
+        defaultValue: 32,
+      },
+      {
+        title: 'sortNum',
+        key: 'sortNum',
+        width: 120,
+        type: JVxeTypes.normal,
+      },
+    ] as JVxeColumn[],
+    data: [
+      { id: 'uuid-0001', name: '张三', dbLength: 123 },
+      { id: 'uuid-0002', name: '李四', dbLength: 777 },
+      { id: 'uuid-0003', name: '王五', dbLength: 666 },
+      { id: 'uuid-0004', name: '赵六', dbLength: 233 },
+    ],
+  });
 
-const table2 = reactive({
-  columns: [
-    {
-      title: 'ID',
-      key: 'id',
-      width: 320,
-      fixed: 'left',
-      type: JVxeTypes.normal,
-    },
-    {
-      title: '姓名',
-      key: 'name',
-      width: 720,
-      type: JVxeTypes.input,
-      defaultValue: 'new name',
-    },
-    {
-      title: '字段长度',
-      key: 'dbLength',
-      width: 720,
-      type: JVxeTypes.inputNumber,
-      defaultValue: 32,
-    },
-  ] as JVxeColumn[],
-  data: [
-    { id: 'uuid-0001', name: '张三', dbLength: 123 },
-    { id: 'uuid-0002', name: '李四', dbLength: 777 },
-    { id: 'uuid-0003', name: '王五', dbLength: 666 },
-    { id: 'uuid-0004', name: '赵六', dbLength: 233 },
-  ],
-})
+  const table2 = reactive({
+    columns: [
+      {
+        title: 'ID',
+        key: 'id',
+        width: 320,
+        fixed: 'left',
+        type: JVxeTypes.normal,
+      },
+      {
+        title: '姓名',
+        key: 'name',
+        width: 720,
+        type: JVxeTypes.input,
+        defaultValue: 'new name',
+      },
+      {
+        title: '字段长度',
+        key: 'dbLength',
+        width: 720,
+        type: JVxeTypes.inputNumber,
+        defaultValue: 32,
+      },
+    ] as JVxeColumn[],
+    data: [
+      { id: 'uuid-0001', name: '张三', dbLength: 123 },
+      { id: 'uuid-0002', name: '李四', dbLength: 777 },
+      { id: 'uuid-0003', name: '王五', dbLength: 666 },
+      { id: 'uuid-0004', name: '赵六', dbLength: 233 },
+    ],
+  });
 
+  const { createMessage } = useMessage();
 
-const { createMessage } = useMessage()
+  function onGetData1() {
+    createMessage.info('请看控制台');
+    console.log(tableRef1.value!.getTableData());
+  }
 
-function onGetData1() {
-  createMessage.info('请看控制台')
-  console.log(tableRef1.value!.getTableData())
-}
-
-function onGetData2() {
-  createMessage.info('请看控制台')
-  console.log(tableRef2.value!.getTableData())
-}
-</script>
\ No newline at end of file
+  function onGetData2() {
+    createMessage.info('请看控制台');
+    console.log(tableRef2.value!.getTableData());
+  }
+</script>
diff --git a/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo4.vue b/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo4.vue
index 116ee3d..96fd07a 100644
--- a/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo4.vue
+++ b/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo4.vue
@@ -1,154 +1,144 @@
 <template>
-  <JVxeTable
-      ref="vTable"
-      toolbar
-      rowNumber
-      rowSelection
-      :maxHeight="580"
-      :dataSource="dataSource"
-      :columns="columns"
-      :linkageConfig="linkageConfig"
-  />
+  <JVxeTable ref="vTable" toolbar rowNumber rowSelection :maxHeight="580" :dataSource="dataSource" :columns="columns" :linkageConfig="linkageConfig" />
 </template>
 
 <script lang="ts" setup>
-import { ref } from 'vue'
-import { defHttp } from '/@/utils/http/axios'
-import { JVxeTypes, JVxeColumn, JVxeLinkageConfig } from '/@/components/jeecg/JVxeTable/types'
+  import { ref } from 'vue';
+  import { defHttp } from '/@/utils/http/axios';
+  import { JVxeTypes, JVxeColumn, JVxeLinkageConfig } from '/@/components/jeecg/JVxeTable/types';
 
-// 联动配置
-const linkageConfig = ref<JVxeLinkageConfig[]>([
-  { requestData: requestMockData, key: 's1' },
-  // 可配置多个联动
-  { requestData: requestMenu, key: 'menu1' },
-])
+  // 联动配置
+  const linkageConfig = ref<JVxeLinkageConfig[]>([
+    { requestData: requestMockData, key: 's1' },
+    // 可配置多个联动
+    { requestData: requestMenu, key: 'menu1' },
+  ]);
 
-const columns = ref<JVxeColumn[]>([
-  {
-    title: '性别',
-    key: 'sex',
-    type: JVxeTypes.select,
-    dictCode: 'sex',
-    width: '180px',
-    placeholder: '请选择${title}',
-  },
-  {
-    title: '省/直辖市/自治区',
-    key: 's1',
-    type: JVxeTypes.select,
-    width: '180px',
-    placeholder: '请选择${title}',
-    // 联动字段（即下一级的字段）
-    linkageKey: 's2',
-  },
-  {
-    title: '市',
-    key: 's2',
-    type: JVxeTypes.select,
-    width: '180px',
-    placeholder: '请选择${title}',
-    // 联动字段（即下一级的字段）
-    linkageKey: 's3',
-  },
-  {
-    title: '县/区',
-    key: 's3',
-    type: JVxeTypes.select,
-    width: '180px',
-    options: [],
-    placeholder: '请选择${title}',
-  },
-  {
-    title: '一级菜单',
-    key: 'menu1',
-    type: JVxeTypes.select,
-    width: '180px',
-    placeholder: '请选择${title}',
-    // 联动字段（即下一级的字段）
-    linkageKey: 'menu2',
-  },
-  {
-    title: '二级菜单',
-    key: 'menu2',
-    type: JVxeTypes.select,
-    width: '180px',
-    placeholder: '请选择${title}',
-    // 联动字段（即下一级的字段）
-    linkageKey: 'menu3',
-  },
-  {
-    title: '三级菜单',
-    key: 'menu3',
-    type: JVxeTypes.select,
-    width: '180px',
-    placeholder: '请选择${title}',
-  },
-])
+  const columns = ref<JVxeColumn[]>([
+    {
+      title: '性别',
+      key: 'sex',
+      type: JVxeTypes.select,
+      dictCode: 'sex',
+      width: '180px',
+      placeholder: '请选择${title}',
+    },
+    {
+      title: '省/直辖市/自治区',
+      key: 's1',
+      type: JVxeTypes.select,
+      width: '180px',
+      placeholder: '请选择${title}',
+      // 联动字段（即下一级的字段）
+      linkageKey: 's2',
+    },
+    {
+      title: '市',
+      key: 's2',
+      type: JVxeTypes.select,
+      width: '180px',
+      placeholder: '请选择${title}',
+      // 联动字段（即下一级的字段）
+      linkageKey: 's3',
+    },
+    {
+      title: '县/区',
+      key: 's3',
+      type: JVxeTypes.select,
+      width: '180px',
+      options: [],
+      placeholder: '请选择${title}',
+    },
+    {
+      title: '一级菜单',
+      key: 'menu1',
+      type: JVxeTypes.select,
+      width: '180px',
+      placeholder: '请选择${title}',
+      // 联动字段（即下一级的字段）
+      linkageKey: 'menu2',
+    },
+    {
+      title: '二级菜单',
+      key: 'menu2',
+      type: JVxeTypes.select,
+      width: '180px',
+      placeholder: '请选择${title}',
+      // 联动字段（即下一级的字段）
+      linkageKey: 'menu3',
+    },
+    {
+      title: '三级菜单',
+      key: 'menu3',
+      type: JVxeTypes.select,
+      width: '180px',
+      placeholder: '请选择${title}',
+    },
+  ]);
 
-const dataSource = ref([
-  { sex: '1', s1: '110000', s2: '110100', s3: '110101' },
-  { sex: '2', s1: '130000', s2: '130300', s3: '130303' },
-])
+  const dataSource = ref([
+    { sex: '1', s1: '110000', s2: '110100', s3: '110101' },
+    { sex: '2', s1: '130000', s2: '130300', s3: '130303' },
+  ]);
 
-// 模拟数据
-const mockData = [
-  { text: '北京市', value: '110000', parent: '' },
-  { text: '天津市', value: '120000', parent: '' },
-  { text: '河北省', value: '130000', parent: '' },
-  { text: '上海市', value: '310000', parent: '' },
+  // 模拟数据
+  const mockData = [
+    { text: '北京市', value: '110000', parent: '' },
+    { text: '天津市', value: '120000', parent: '' },
+    { text: '河北省', value: '130000', parent: '' },
+    { text: '上海市', value: '310000', parent: '' },
 
-  { text: '北京市', value: '110100', parent: '110000' },
-  { text: '天津市市', value: '120100', parent: '120000' },
-  { text: '石家庄市', value: '130100', parent: '130000' },
-  { text: '唐山市', value: '130200', parent: '130000' },
-  { text: '秦皇岛市', value: '130300', parent: '130000' },
-  { text: '上海市', value: '310100', parent: '310000' },
+    { text: '北京市', value: '110100', parent: '110000' },
+    { text: '天津市市', value: '120100', parent: '120000' },
+    { text: '石家庄市', value: '130100', parent: '130000' },
+    { text: '唐山市', value: '130200', parent: '130000' },
+    { text: '秦皇岛市', value: '130300', parent: '130000' },
+    { text: '上海市', value: '310100', parent: '310000' },
 
-  { text: '东城区', value: '110101', parent: '110100' },
-  { text: '西城区', value: '110102', parent: '110100' },
-  { text: '朝阳区', value: '110105', parent: '110100' },
-  { text: '和平区', value: '120101', parent: '120100' },
-  { text: '河东区', value: '120102', parent: '120100' },
-  { text: '河西区', value: '120103', parent: '120100' },
-  { text: '黄浦区', value: '310101', parent: '310100' },
-  { text: '徐汇区', value: '310104', parent: '310100' },
-  { text: '长宁区', value: '310105', parent: '310100' },
-  { text: '长安区', value: '130102', parent: '130100' },
-  { text: '桥西区', value: '130104', parent: '130100' },
-  { text: '新华区', value: '130105', parent: '130100' },
-  { text: '路南区', value: '130202', parent: '130200' },
-  { text: '路北区', value: '130203', parent: '130200' },
-  { text: '古冶区', value: '130204', parent: '130200' },
-  { text: '海港区', value: '130302', parent: '130300' },
-  { text: '山海关区', value: '130303', parent: '130300' },
-  { text: '北戴河区', value: '130304', parent: '130300' },
-]
+    { text: '东城区', value: '110101', parent: '110100' },
+    { text: '西城区', value: '110102', parent: '110100' },
+    { text: '朝阳区', value: '110105', parent: '110100' },
+    { text: '和平区', value: '120101', parent: '120100' },
+    { text: '河东区', value: '120102', parent: '120100' },
+    { text: '河西区', value: '120103', parent: '120100' },
+    { text: '黄浦区', value: '310101', parent: '310100' },
+    { text: '徐汇区', value: '310104', parent: '310100' },
+    { text: '长宁区', value: '310105', parent: '310100' },
+    { text: '长安区', value: '130102', parent: '130100' },
+    { text: '桥西区', value: '130104', parent: '130100' },
+    { text: '新华区', value: '130105', parent: '130100' },
+    { text: '路南区', value: '130202', parent: '130200' },
+    { text: '路北区', value: '130203', parent: '130200' },
+    { text: '古冶区', value: '130204', parent: '130200' },
+    { text: '海港区', value: '130302', parent: '130300' },
+    { text: '山海关区', value: '130303', parent: '130300' },
+    { text: '北戴河区', value: '130304', parent: '130300' },
+  ];
 
-/** 模拟从后台查询数据 */
-function requestMockData(parent) {
-  return new Promise(resolve => {
-    let data = mockData.filter(i => i.parent === parent)
-    setTimeout(() => resolve(data), 500)
-  })
-}
-
-/** 查询后台真实数据 */
-async function requestMenu(parent) {
-  let result
-  // 如果parent为空，则查询第一级菜单
-  if (parent === '') {
-    result = await defHttp.get({
-      url: '/sys/permission/getSystemMenuList',
-      params: {},
-    })
-  } else {
-    result = await defHttp.get({
-      url: '/sys/permission/getSystemSubmenu',
-      params: { parentId: parent },
-    })
+  /** 模拟从后台查询数据 */
+  function requestMockData(parent) {
+    return new Promise((resolve) => {
+      let data = mockData.filter((i) => i.parent === parent);
+      setTimeout(() => resolve(data), 500);
+    });
   }
-  // 返回的数据里必须包含 value 和 text 字段
-  return result.map(item => ({ value: item.id, text: item.name }))
-}
 
-</script>
\ No newline at end of file
+  /** 查询后台真实数据 */
+  async function requestMenu(parent) {
+    let result;
+    // 如果parent为空，则查询第一级菜单
+    if (parent === '') {
+      result = await defHttp.get({
+        url: '/sys/permission/getSystemMenuList',
+        params: {},
+      });
+    } else {
+      result = await defHttp.get({
+        url: '/sys/permission/getSystemSubmenu',
+        params: { parentId: parent },
+      });
+    }
+    // 返回的数据里必须包含 value 和 text 字段
+    return result.map((item) => ({ value: item.id, text: item.name }));
+  }
+</script>
diff --git a/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo5.vue b/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo5.vue
index 2aea8db..4a92e7e 100644
--- a/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo5.vue
+++ b/src/views/demo/jeecg/JVxeTableDemo/JVxeDemo5.vue
@@ -1,8 +1,8 @@
 <template>
   <div>
     <b>键盘操作快捷键：</b>
-    <div style="border: 1px solid #cccccc; padding: 8px; width: 740px;">
-        <pre>
+    <div style="border: 1px solid #cccccc; padding: 8px; width: 740px">
+      <pre>
              F2 | 如果存在，激活单元格为编辑状态
             Esc | 如果存在，取消单元格编辑状态
               ↑ | 如果存在，则移动到上面的单元格
@@ -12,132 +12,116 @@
             Tab | 如果存在，则移动到右边单元格；如果移动到最后一列，则从下一行开始移到，以此循环
     Shift + Tab | 如果存在，则移动到左边单元格，如果移动到第一列，则从上一行开始移到，以此循环
           Enter | 如果存在，取消单元格编辑并移动到下面的单元格
-  Shift + Enter | 如果存在，取消单元格编辑并移动到上面的单元格</pre>
+  Shift + Enter | 如果存在，取消单元格编辑并移动到上面的单元格</pre
+      >
     </div>
 
-    <JVxeTable
-        ref="tableRef"
-        stripe
-        toolbar
-        rowNumber
-        rowSelection
-        keyboardEdit
-        :columns="columns"
-        :dataSource="dataSource"
-    >
-    </JVxeTable>
-
+    <JVxeTable ref="tableRef" stripe toolbar rowNumber rowSelection keyboardEdit :columns="columns" :dataSource="dataSource"> </JVxeTable>
   </div>
 </template>
 <script lang="ts">
-import {ref, onMounted, nextTick, defineComponent} from 'vue'
-import {Popconfirm} from 'ant-design-vue'
-import {JVxeTypes, JVxeColumn, JVxeTableInstance} from '/@/components/jeecg/JVxeTable/types'
+  import { ref, onMounted, nextTick, defineComponent } from 'vue';
+  import { Popconfirm } from 'ant-design-vue';
+  import { JVxeTypes, JVxeColumn, JVxeTableInstance } from '/@/components/jeecg/JVxeTable/types';
 
-export default defineComponent({
-  name: 'JVxeDemo5',
-  components: {[Popconfirm.name]: Popconfirm},
-  setup() {
-    const tableRef = ref<JVxeTableInstance>()
-    const columns = ref<JVxeColumn[]>([
-      {
-        title: '单行文本',
-        key: 'input',
-        type: JVxeTypes.input,
-        width: 220,
-        defaultValue: '',
-        placeholder: '请输入${title}',
-      },
-      {
-        title: '多行文本',
-        key: 'textarea',
-        type: JVxeTypes.textarea,
-        width: 240,
-      },
-      {
-        title: '数字',
-        key: 'number',
-        type: JVxeTypes.inputNumber,
-        width: 120,
-        defaultValue: 32,
-      },
-      {
-        title: '日期时间',
-        key: 'datetime',
-        type: JVxeTypes.datetime,
-        width: 240,
-        defaultValue: '2019-4-30 14:52:22',
-        placeholder: '请选择',
-      },
-      {
-        title: '时间',
-        key: 'time',
-        type: JVxeTypes.time,
-        width: 220,
-        defaultValue: '14:52:22',
-        placeholder: '请选择',
-      },
-      {
-        title: '下拉框',
-        key: 'select',
-        type: JVxeTypes.select,
-        width: 220,
-        // 下拉选项
-        options: [
-          {title: 'String', value: 'string'},
-          {title: 'Integer', value: 'int'},
-          {title: 'Double', value: 'double'},
-          {title: 'Boolean', value: 'boolean'},
-        ],
-        // allowInput: true,
-        allowSearch: true,
-        placeholder: '请选择',
-      },
-      {
-        title: '复选框',
-        key: 'checkbox',
-        type: JVxeTypes.checkbox,
-        // width: 100,
-        customValue: ['Y', 'N'], // true ,false
-        defaultChecked: false,
-      },
-    ])
-    const dataSource = ref([])
+  export default defineComponent({
+    name: 'JVxeDemo5',
+    components: { [Popconfirm.name]: Popconfirm },
+    setup() {
+      const tableRef = ref<JVxeTableInstance>();
+      const columns = ref<JVxeColumn[]>([
+        {
+          title: '单行文本',
+          key: 'input',
+          type: JVxeTypes.input,
+          width: 220,
+          defaultValue: '',
+          placeholder: '请输入${title}',
+        },
+        {
+          title: '多行文本',
+          key: 'textarea',
+          type: JVxeTypes.textarea,
+          width: 240,
+        },
+        {
+          title: '数字',
+          key: 'number',
+          type: JVxeTypes.inputNumber,
+          width: 120,
+          defaultValue: 32,
+        },
+        {
+          title: '日期时间',
+          key: 'datetime',
+          type: JVxeTypes.datetime,
+          width: 240,
+          defaultValue: '2019-4-30 14:52:22',
+          placeholder: '请选择',
+        },
+        {
+          title: '时间',
+          key: 'time',
+          type: JVxeTypes.time,
+          width: 220,
+          defaultValue: '14:52:22',
+          placeholder: '请选择',
+        },
+        {
+          title: '下拉框',
+          key: 'select',
+          type: JVxeTypes.select,
+          width: 220,
+          // 下拉选项
+          options: [
+            { title: 'String', value: 'string' },
+            { title: 'Integer', value: 'int' },
+            { title: 'Double', value: 'double' },
+            { title: 'Boolean', value: 'boolean' },
+          ],
+          // allowInput: true,
+          allowSearch: true,
+          placeholder: '请选择',
+        },
+        {
+          title: '复选框',
+          key: 'checkbox',
+          type: JVxeTypes.checkbox,
+          // width: 100,
+          customValue: ['Y', 'N'], // true ,false
+          defaultChecked: false,
+        },
+      ]);
+      const dataSource = ref([]);
 
-    function handleView(props) {
-      // 参数介绍：
-      // props.value          当前单元格的值
-      // props.row            当前行的数据
-      // props.rowId          当前行ID
-      // props.rowIndex       当前行下标
-      // props.column         当前列的配置
-      // props.columnIndex    当前列下标
-      // props.$table         vxe-table实例，可以调用vxe-table内置方法
-      // props.scrolling      是否正在滚动
-      // props.reloadEffect   是否开启了数据刷新特效
-      // props.triggerChange  触发change事件，用于更改slot的值
-      console.log('props: ', props)
-    }
+      function handleView(props) {
+        // 参数介绍：
+        // props.value          当前单元格的值
+        // props.row            当前行的数据
+        // props.rowId          当前行ID
+        // props.rowIndex       当前行下标
+        // props.column         当前列的配置
+        // props.columnIndex    当前列下标
+        // props.$table         vxe-table实例，可以调用vxe-table内置方法
+        // props.scrolling      是否正在滚动
+        // props.reloadEffect   是否开启了数据刷新特效
+        // props.triggerChange  触发change事件，用于更改slot的值
+        console.log('props: ', props);
+      }
 
-    function handleDelete({row}) {
-      // 使用实例：删除当前操作的行
-      tableRef.value?.removeRows(row)
-    }
+      function handleDelete({ row }) {
+        // 使用实例：删除当前操作的行
+        tableRef.value?.removeRows(row);
+      }
 
-    onMounted(async () => {
-      console.log(tableRef.value)
-      await nextTick()
-      // 默认添加五行数据
-      tableRef.value!.addRows([
-        {input: 'input_1'},
-        {input: 'input_2'},
-        {input: 'input_3'},
-        {input: 'input_4'},
-        {input: 'input_5'},
-      ], {setActive: false})
-    })
+      onMounted(async () => {
+        console.log(tableRef.value);
+        await nextTick();
+        // 默认添加五行数据
+        tableRef.value!.addRows([{ input: 'input_1' }, { input: 'input_2' }, { input: 'input_3' }, { input: 'input_4' }, { input: 'input_5' }], { setActive: false });
+      });
 
-    return {tableRef, columns, dataSource, handleView, handleDelete}
-  },
-})
-</script>
\ No newline at end of file
+      return { tableRef, columns, dataSource, handleView, handleDelete };
+    },
+  });
+</script>
diff --git a/src/views/demo/jeecg/JVxeTableDemo/func-demo/JSBCDemo.vue b/src/views/demo/jeecg/JVxeTableDemo/func-demo/JSBCDemo.vue
index c52c055..e633a9d 100644
--- a/src/views/demo/jeecg/JVxeTableDemo/func-demo/JSBCDemo.vue
+++ b/src/views/demo/jeecg/JVxeTableDemo/func-demo/JSBCDemo.vue
@@ -7,215 +7,218 @@
       3. 在这个事件里面判断数据是否更改，如果更改了就调用接口进行保存操作
     -->
     <JVxeTable
-        toolbar
-        :toolbarConfig="toolbarConfig"
-
-        rowNumber
-        rowSelection
-        keepSource
-        asyncRemove
-
-        :height="340"
-        :loading="loading"
-        :columns="columns"
-        :dataSource="dataSource"
-        :pagination="pagination"
-
-        @save="handleTableSave"
-        @remove="handleTableRemove"
-        @edit-closed="handleEditClosed"
-        @pageChange="handlePageChange"
-        @selectRowChange="handleSelectRowChange"
+      toolbar
+      :toolbarConfig="toolbarConfig"
+      rowNumber
+      rowSelection
+      keepSource
+      asyncRemove
+      :height="340"
+      :loading="loading"
+      :columns="columns"
+      :dataSource="dataSource"
+      :pagination="pagination"
+      @save="handleTableSave"
+      @remove="handleTableRemove"
+      @edit-closed="handleEditClosed"
+      @pageChange="handlePageChange"
+      @selectRowChange="handleSelectRowChange"
     />
   </a-card>
 </template>
 
 <script lang="ts" setup>
-// 即时保存示例
-import { reactive, ref } from 'vue'
-import { defHttp } from '/@/utils/http/axios'
-import { JVxeColumn, JVxeTypes } from '/@/components/jeecg/JVxeTable/types'
-import { useMessage } from '/@/hooks/web/useMessage'
+  // 即时保存示例
+  import { reactive, ref } from 'vue';
+  import { defHttp } from '/@/utils/http/axios';
+  import { JVxeColumn, JVxeTypes } from '/@/components/jeecg/JVxeTable/types';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
-const { createMessage } = useMessage()
-// 工具栏的按钮配置
-const toolbarConfig = reactive({
-  // add 新增按钮；remove 删除按钮；clearSelection 清空选择按钮
-  btn: ['add', 'save', 'remove', 'clearSelection'],
-})
-// 是否正在加载
-const loading = ref(false)
-// 分页器参数
-const pagination = reactive({
-  // 当前页码
-  current: 1,
-  // 每页的条数
-  pageSize: 200,
-  // 可切换的条数
-  pageSizeOptions: ['10', '20', '30', '100', '200'],
-  // 数据总数（目前并不知道真实的总数，所以先填写0，在后台查出来后再赋值）
-  total: 0,
-})
-// 选择的行
-const selectedRows = ref<Recordable[]>([])
-// 数据源，控制表格的数据
-const dataSource = ref<Recordable[]>([])
-// 列配置，控制表格显示的列
-const columns = ref<JVxeColumn[]>([
-  { key: 'num', title: '序号', width: 80, type: JVxeTypes.normal },
-  {
-    // 字段key，跟后台数据的字段名匹配
-    key: 'ship_name',
-    // 列的标题
-    title: '船名',
-    // 列的宽度
-    width: 180,
-    // 如果加上了该属性，就代表当前单元格是可编辑的，type就是表单的类型，input就是简单的输入框
-    type: JVxeTypes.input,
-  },
-  { key: 'call', title: '呼叫', width: 80, type: JVxeTypes.input },
-  { key: 'len', title: '长', width: 80, type: JVxeTypes.input },
-  { key: 'ton', title: '吨', width: 120, defaultValue: 233, type: JVxeTypes.input },
-  { key: 'payer', title: '付款方', width: 120, defaultValue: '张三', type: JVxeTypes.input },
-  { key: 'count', title: '数', width: 40, type: JVxeTypes.normal },
-  {
-    key: 'company',
-    title: '公司',
-    // 最小宽度，与宽度不同的是，这个不是固定的宽度，如果表格有多余的空间，会平均分配给设置了 minWidth 的列
-    // 如果要做占满表格的列可以这么写
-    minWidth: 180,
-    type: JVxeTypes.input,
-  },
-  { key: 'trend', title: '动向', width: 120, type: JVxeTypes.input },
-])
-
-// 查询url地址
-enum Api {
-  getData = '/mock/vxe/getData',
-  // 模拟保存单行数据（即时保存）
-  saveRow = '/mock/vxe/immediateSaveRow',
-  // 模拟保存整个表格的数据
-  saveAll = '/mock/vxe/immediateSaveAll',
-}
-
-loadData()
-
-// 加载数据
-async function loadData() {
-  loading.value = true
-  // 调用查询数据接口
-  await defHttp.get({
-    // 请求地址
-    url: Api.getData,
-    // 封装查询条件
-    params: {
-      pageNo: pagination.current,
-      pageSize: pagination.pageSize,
+  const { createMessage } = useMessage();
+  // 工具栏的按钮配置
+  const toolbarConfig = reactive({
+    // add 新增按钮；remove 删除按钮；clearSelection 清空选择按钮
+    btn: ['add', 'save', 'remove', 'clearSelection'],
+  });
+  // 是否正在加载
+  const loading = ref(false);
+  // 分页器参数
+  const pagination = reactive({
+    // 当前页码
+    current: 1,
+    // 每页的条数
+    pageSize: 200,
+    // 可切换的条数
+    pageSizeOptions: ['10', '20', '30', '100', '200'],
+    // 数据总数（目前并不知道真实的总数，所以先填写0，在后台查出来后再赋值）
+    total: 0,
+  });
+  // 选择的行
+  const selectedRows = ref<Recordable[]>([]);
+  // 数据源，控制表格的数据
+  const dataSource = ref<Recordable[]>([]);
+  // 列配置，控制表格显示的列
+  const columns = ref<JVxeColumn[]>([
+    { key: 'num', title: '序号', width: 80, type: JVxeTypes.normal },
+    {
+      // 字段key，跟后台数据的字段名匹配
+      key: 'ship_name',
+      // 列的标题
+      title: '船名',
+      // 列的宽度
+      width: 180,
+      // 如果加上了该属性，就代表当前单元格是可编辑的，type就是表单的类型，input就是简单的输入框
+      type: JVxeTypes.input,
     },
-  }).then(result => {
-    // 后台查询回来的 total，数据总数量
-    pagination.total = result.total
-    // 将查询的数据赋值给 dataSource
-    dataSource.value = result.records
-    // 重置选择
-    selectedRows.value = []
-  }).finally(() => {
-    // 这里是无论成功或失败都会执行的方法，在这里关闭loading
-    loading.value = false
-  })
-}
+    { key: 'call', title: '呼叫', width: 80, type: JVxeTypes.input },
+    { key: 'len', title: '长', width: 80, type: JVxeTypes.input },
+    { key: 'ton', title: '吨', width: 120, defaultValue: 233, type: JVxeTypes.input },
+    { key: 'payer', title: '付款方', width: 120, defaultValue: '张三', type: JVxeTypes.input },
+    { key: 'count', title: '数', width: 40, type: JVxeTypes.normal },
+    {
+      key: 'company',
+      title: '公司',
+      // 最小宽度，与宽度不同的是，这个不是固定的宽度，如果表格有多余的空间，会平均分配给设置了 minWidth 的列
+      // 如果要做占满表格的列可以这么写
+      minWidth: 180,
+      type: JVxeTypes.input,
+    },
+    { key: 'trend', title: '动向', width: 120, type: JVxeTypes.input },
+  ]);
 
-// 【整体保存】点击保存按钮时触发的事件
-function handleTableSave({ $table, target }) {
-  // 校验整个表格
-  $table.validate().then((errMap) => {
-    // 校验通过
-    if (!errMap) {
-      // 获取所有数据
-      let tableData = target.getTableData()
-      console.log('当前保存的数据是：', tableData)
-      // 获取新增的数据
-      let newData = target.getNewData()
-      console.log('-- 新增的数据：', newData)
-      // 获取删除的数据
-      let deleteData = target.getDeleteData()
-      console.log('-- 删除的数据：', deleteData)
-      // 【模拟保存】
-      loading.value = true
-      defHttp.post({
-        url: Api.saveAll,
-        params: tableData,
-      }).then(() => {
-        createMessage.success(`保存成功！`)
-      }).finally(() => {
-        loading.value = false
+  // 查询url地址
+  enum Api {
+    getData = '/mock/vxe/getData',
+    // 模拟保存单行数据（即时保存）
+    saveRow = '/mock/vxe/immediateSaveRow',
+    // 模拟保存整个表格的数据
+    saveAll = '/mock/vxe/immediateSaveAll',
+  }
+
+  loadData();
+
+  // 加载数据
+  async function loadData() {
+    loading.value = true;
+    // 调用查询数据接口
+    await defHttp
+      .get({
+        // 请求地址
+        url: Api.getData,
+        // 封装查询条件
+        params: {
+          pageNo: pagination.current,
+          pageSize: pagination.pageSize,
+        },
       })
-    }
-  })
-}
+      .then((result) => {
+        // 后台查询回来的 total，数据总数量
+        pagination.total = result.total;
+        // 将查询的数据赋值给 dataSource
+        dataSource.value = result.records;
+        // 重置选择
+        selectedRows.value = [];
+      })
+      .finally(() => {
+        // 这里是无论成功或失败都会执行的方法，在这里关闭loading
+        loading.value = false;
+      });
+  }
 
-// 触发单元格删除事件
-function handleTableRemove(event) {
-  // 把 event.deleteRows 传给后台进行删除（注意：这里不会传递前端逻辑新增的数据，因为不需要请求后台删除）
-  console.log('待删除的数据: ', event.deleteRows)
-  // 也可以只传ID，因为可以根据ID删除
-  let deleteIds = event.deleteRows.map(row => row.id)
-  console.log('待删除的数据ids: ', deleteIds)
-
-  // 模拟请求后台删除
-  loading.value = true
-  window.setTimeout(() => {
-    loading.value = false
-    createMessage.success('删除成功')
-    // 假设后台返回删除成功，必须要调用 confirmRemove() 方法，才会真正在表格里移除（会同时删除选中的逻辑新增的数据）
-    event.confirmRemove()
-  }, 1000)
-}
-
-// 单元格编辑完成之后触发的事件
-function handleEditClosed(event) {
-  let { $table, row, column } = event
-  let field = column.property
-  // 判断单元格值是否被修改
-  if ($table.isUpdateByRow(row, field)) {
-    // 校验当前行
-    $table.validate(row).then((errMap) => {
+  // 【整体保存】点击保存按钮时触发的事件
+  function handleTableSave({ $table, target }) {
+    // 校验整个表格
+    $table.validate().then((errMap) => {
       // 校验通过
       if (!errMap) {
+        // 获取所有数据
+        let tableData = target.getTableData();
+        console.log('当前保存的数据是：', tableData);
+        // 获取新增的数据
+        let newData = target.getNewData();
+        console.log('-- 新增的数据：', newData);
+        // 获取删除的数据
+        let deleteData = target.getDeleteData();
+        console.log('-- 删除的数据：', deleteData);
         // 【模拟保存】
-        let hideLoading = createMessage.loading(`正在保存"${column.title}"`, 0)
-        console.log('即时保存数据：', row)
-        defHttp.put({
-          url: Api.saveRow,
-          params: row,
-        }).then(res => {
-          createMessage.success(`"${column.title}"保存成功！`)
-          // 局部更新单元格为已保存状态
-          $table.reloadRow(row, null, field)
-        }).finally(() => {
-          hideLoading()
-        })
+        loading.value = true;
+        defHttp
+          .post({
+            url: Api.saveAll,
+            params: tableData,
+          })
+          .then(() => {
+            createMessage.success(`保存成功！`);
+          })
+          .finally(() => {
+            loading.value = false;
+          });
       }
-    })
+    });
   }
-}
 
-// 当分页参数变化时触发的事件
-function handlePageChange(event) {
-  // 重新赋值
-  pagination.current = event.current
-  pagination.pageSize = event.pageSize
-  // 查询数据
-  loadData()
-}
+  // 触发单元格删除事件
+  function handleTableRemove(event) {
+    // 把 event.deleteRows 传给后台进行删除（注意：这里不会传递前端逻辑新增的数据，因为不需要请求后台删除）
+    console.log('待删除的数据: ', event.deleteRows);
+    // 也可以只传ID，因为可以根据ID删除
+    let deleteIds = event.deleteRows.map((row) => row.id);
+    console.log('待删除的数据ids: ', deleteIds);
 
-// 当选择的行变化时触发的事件
-function handleSelectRowChange(event) {
-  selectedRows.value = event.selectedRows
-}
+    // 模拟请求后台删除
+    loading.value = true;
+    window.setTimeout(() => {
+      loading.value = false;
+      createMessage.success('删除成功');
+      // 假设后台返回删除成功，必须要调用 confirmRemove() 方法，才会真正在表格里移除（会同时删除选中的逻辑新增的数据）
+      event.confirmRemove();
+    }, 1000);
+  }
 
+  // 单元格编辑完成之后触发的事件
+  function handleEditClosed(event) {
+    let { $table, row, column } = event;
+    let field = column.property;
+    // 判断单元格值是否被修改
+    if ($table.isUpdateByRow(row, field)) {
+      // 校验当前行
+      $table.validate(row).then((errMap) => {
+        // 校验通过
+        if (!errMap) {
+          // 【模拟保存】
+          let hideLoading = createMessage.loading(`正在保存"${column.title}"`, 0);
+          console.log('即时保存数据：', row);
+          defHttp
+            .put({
+              url: Api.saveRow,
+              params: row,
+            })
+            .then((res) => {
+              createMessage.success(`"${column.title}"保存成功！`);
+              // 局部更新单元格为已保存状态
+              $table.reloadRow(row, null, field);
+            })
+            .finally(() => {
+              hideLoading();
+            });
+        }
+      });
+    }
+  }
+
+  // 当分页参数变化时触发的事件
+  function handlePageChange(event) {
+    // 重新赋值
+    pagination.current = event.current;
+    pagination.pageSize = event.pageSize;
+    // 查询数据
+    loadData();
+  }
+
+  // 当选择的行变化时触发的事件
+  function handleSelectRowChange(event) {
+    selectedRows.value = event.selectedRows;
+  }
 </script>
 
-<style scoped>
-
-</style>
\ No newline at end of file
+<style scoped></style>
diff --git a/src/views/demo/jeecg/JVxeTableDemo/func-demo/PopupSubTable.vue b/src/views/demo/jeecg/JVxeTableDemo/func-demo/PopupSubTable.vue
index a869068..1fd2027 100644
--- a/src/views/demo/jeecg/JVxeTableDemo/func-demo/PopupSubTable.vue
+++ b/src/views/demo/jeecg/JVxeTableDemo/func-demo/PopupSubTable.vue
@@ -12,242 +12,226 @@
       2. 必须要有 mainForm 插槽，用于规定弹出的内容
     -->
     <JVxeTable
-        toolbar
-        rowNumber
-        rowSelection
-
-        highlightCurrentRow
-        clickRowShowSubForm
-        clickRowShowMainForm
-
-        :height="750"
-        :loading="loading"
-        :columns="columns"
-        :dataSource="dataSource"
-        @detailsConfirm="handleDetailsConfirm"
+      toolbar
+      rowNumber
+      rowSelection
+      highlightCurrentRow
+      clickRowShowSubForm
+      clickRowShowMainForm
+      :height="750"
+      :loading="loading"
+      :columns="columns"
+      :dataSource="dataSource"
+      @detailsConfirm="handleDetailsConfirm"
     >
-
       <!-- 主表单 -->
-      <template #mainForm="{row}">
+      <template #mainForm="{ row }">
         <template v-if="row">
-          <a-form
-              ref="form2"
-              :model="row"
-              :rules="rules"
-              :label-col="labelCol"
-              :wrapper-col="wrapperCol"
-          >
+          <a-form ref="form2" :model="row" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
             <a-row :gutter="8">
               <a-col :span="8">
                 <a-form-item label="ID" name="id">
-                  <a-input v-model:value="row.id" disabled/>
+                  <a-input v-model:value="row.id" disabled />
                 </a-form-item>
               </a-col>
               <a-col :span="8">
                 <a-form-item label="序号" name="num">
-                  <a-input v-model:value="row.num"/>
+                  <a-input v-model:value="row.num" />
                 </a-form-item>
               </a-col>
               <a-col :span="8">
                 <a-form-item label="船名" name="ship_name">
-                  <a-input v-model:value="row.ship_name"/>
+                  <a-input v-model:value="row.ship_name" />
                 </a-form-item>
               </a-col>
               <a-col :span="8">
                 <a-form-item label="呼叫" name="call">
-                  <a-input v-model:value="row.call"/>
+                  <a-input v-model:value="row.call" />
                 </a-form-item>
               </a-col>
               <a-col :span="8">
                 <a-form-item label="长" name="len">
-                  <a-input v-model:value="row.len"/>
+                  <a-input v-model:value="row.len" />
                 </a-form-item>
               </a-col>
               <a-col :span="8">
                 <a-form-item label="吨" name="ton">
-                  <a-input v-model:value="row.ton"/>
+                  <a-input v-model:value="row.ton" />
                 </a-form-item>
               </a-col>
               <a-col :span="8">
                 <a-form-item label="付款方" name="payer">
-                  <a-input v-model:value="row.payer"/>
+                  <a-input v-model:value="row.payer" />
                 </a-form-item>
               </a-col>
               <a-col :span="8">
                 <a-form-item label="数" name="count">
-                  <a-input v-model:value="row.count"/>
+                  <a-input v-model:value="row.count" />
                 </a-form-item>
               </a-col>
               <a-col :span="8">
                 <a-form-item label="公司" name="company">
-                  <a-input v-model:value="row.company"/>
+                  <a-input v-model:value="row.company" />
                 </a-form-item>
               </a-col>
               <a-col :span="8">
                 <a-form-item label="动向" name="trend">
-                  <a-input v-model:value="row.trend"/>
+                  <a-input v-model:value="row.trend" />
                 </a-form-item>
               </a-col>
             </a-row>
           </a-form>
         </template>
-
       </template>
 
       <!-- 子表单 -->
-      <template #subForm="{row}">
+      <template #subForm="{ row }">
         <template v-if="loadSubData(row)">
-          <JVxeTable
-              ref="subFormTable"
-              height="auto"
-              :max-height="350"
-              :loading="subTable.loading"
-              :columns="subTable.columns"
-              :dataSource="subTable.dataSource"
-          />
+          <JVxeTable ref="subFormTable" height="auto" :max-height="350" :loading="subTable.loading" :columns="subTable.columns" :dataSource="subTable.dataSource" />
         </template>
       </template>
-
     </JVxeTable>
   </a-card>
 </template>
 
 <script lang="ts" setup>
-// 弹出子表示例
-import { reactive, ref } from 'vue'
-import { defHttp } from '/@/utils/http/axios'
-import { JVxeColumn, JVxeTypes } from '/@/components/jeecg/JVxeTable/types'
-import { useMessage } from '/@/hooks/web/useMessage'
+  // 弹出子表示例
+  import { reactive, ref } from 'vue';
+  import { defHttp } from '/@/utils/http/axios';
+  import { JVxeColumn, JVxeTypes } from '/@/components/jeecg/JVxeTable/types';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
-const { createMessage } = useMessage()
-const loading = ref(false)
-const dataSource = ref([])
-const columns = ref<JVxeColumn[]>([
-  { key: 'num', title: '序号', width: '80px' },
-  { key: 'ship_name', title: '船名', width: '180px', type: JVxeTypes.input },
-  { key: 'call', title: '呼叫', width: '80px' },
-  { key: 'len', title: '长', width: '80px' },
-  { key: 'ton', title: '吨', width: '120px' },
-  { key: 'payer', title: '付款方', width: '120px' },
-  { key: 'count', title: '数', width: '40px' },
-  {
-    key: 'company',
-    title: '公司',
-    minWidth: '180px',
-    // 是否点击显示详细信息
-    // 只有当前单元格不能编辑的时候才能生效
-    // 如果不设的话，点击就只弹出子表，不会弹出主表的详细信息
-    showDetails: true,
-  },
-  { key: 'trend', title: '动向', width: '120px' },
-])
-const selectedRows = ref([])
-// 子表的信息
-const subTable = reactive({
-  currentRowId: null,
-  loading: false,
-  pagination: { current: 1, pageSize: 200, pageSizeOptions: ['100', '200'], total: 0 },
-  selectedRows: [],
-  dataSource: [],
-  columns: [
-    { key: 'dd_num', title: '调度序号', width: '120px' },
-    { key: 'tug', title: '拖轮', width: '180px', type: JVxeTypes.input },
-    { key: 'work_start_time', title: '作业开始时间', width: '180px', type: JVxeTypes.input },
-    { key: 'work_stop_time', title: '作业结束时间', width: '180px', type: JVxeTypes.input },
-    { key: 'type', title: '船舶分类', width: '120px', type: JVxeTypes.input },
-    { key: 'port_area', title: '所属港区', minWidth: '120px', type: JVxeTypes.input },
-  ] as JVxeColumn[],
-})
-
-// form表单 col
-const labelCol = reactive({ span: 4 })
-const wrapperCol = reactive({ span: 20 })
-const rules = reactive({
-  num: [
-    { required: true, message: '必须输入序号' },
-  ],
-})
-
-// 查询url地址
-enum Api {
-  getData = '/mock/vxe/getData'
-}
-
-loadData()
-
-// 加载数据
-function loadData() {
-  // 封装查询条件
-  // 调用查询数据接口
-  loading.value = true
-  defHttp.get({
-    url: Api.getData,
-    params: {
-      pageNo: 1,
-      pageSize: 30,
+  const { createMessage } = useMessage();
+  const loading = ref(false);
+  const dataSource = ref([]);
+  const columns = ref<JVxeColumn[]>([
+    { key: 'num', title: '序号', width: '80px' },
+    { key: 'ship_name', title: '船名', width: '180px', type: JVxeTypes.input },
+    { key: 'call', title: '呼叫', width: '80px' },
+    { key: 'len', title: '长', width: '80px' },
+    { key: 'ton', title: '吨', width: '120px' },
+    { key: 'payer', title: '付款方', width: '120px' },
+    { key: 'count', title: '数', width: '40px' },
+    {
+      key: 'company',
+      title: '公司',
+      minWidth: '180px',
+      // 是否点击显示详细信息
+      // 只有当前单元格不能编辑的时候才能生效
+      // 如果不设的话，点击就只弹出子表，不会弹出主表的详细信息
+      showDetails: true,
     },
-  }).then(result => {
-    // 将查询的数据赋值给 dataSource
-    dataSource.value = result.records
-    // 重置选择
-    selectedRows.value = []
-  }).finally(() => {
-    // 这里是无论成功或失败都会执行的方法，在这里关闭loading
-    loading.value = false
-  })
-}
+    { key: 'trend', title: '动向', width: '120px' },
+  ]);
+  const selectedRows = ref([]);
+  // 子表的信息
+  const subTable = reactive({
+    currentRowId: null,
+    loading: false,
+    pagination: { current: 1, pageSize: 200, pageSizeOptions: ['100', '200'], total: 0 },
+    selectedRows: [],
+    dataSource: [],
+    columns: [
+      { key: 'dd_num', title: '调度序号', width: '120px' },
+      { key: 'tug', title: '拖轮', width: '180px', type: JVxeTypes.input },
+      { key: 'work_start_time', title: '作业开始时间', width: '180px', type: JVxeTypes.input },
+      { key: 'work_stop_time', title: '作业结束时间', width: '180px', type: JVxeTypes.input },
+      { key: 'type', title: '船舶分类', width: '120px', type: JVxeTypes.input },
+      { key: 'port_area', title: '所属港区', minWidth: '120px', type: JVxeTypes.input },
+    ] as JVxeColumn[],
+  });
 
-// 查询子表数据
-function loadSubData(row) {
-  if (row) {
-    // 这里一定要做限制，限制不能重复查询，否者会出现死循环
-    if (subTable.currentRowId === row.id) {
-      return true
-    }
-    subTable.currentRowId = row.id
-    subTable.loading = true
-    defHttp.get({
-      url: Api.getData,
-      params: {
-        pageNo: 1,
-        pageSize: 30,
-        parentId: row.id,
-      },
-    }).then(result => {
-      // 将查询的数据赋值给 dataSource
-      subTable.dataSource = result.records
-    }).finally(() => {
-      // 这里是无论成功或失败都会执行的方法，在这里关闭loading
-      subTable.loading = false
-    })
-    return true
-  } else {
-    return false
+  // form表单 col
+  const labelCol = reactive({ span: 4 });
+  const wrapperCol = reactive({ span: 20 });
+  const rules = reactive({
+    num: [{ required: true, message: '必须输入序号' }],
+  });
+
+  // 查询url地址
+  enum Api {
+    getData = '/mock/vxe/getData',
   }
-}
 
-// 详细信息里点了确认按钮
-function handleDetailsConfirm({ row, $table, callback }) {
-  console.log('保存的数据：', row)
-  // 校验当前行
-  $table.validate(row).then((errMap) => {
-    // 校验通过
-    if (!errMap) {
-      // 校验子表，如果需要的话，可以操作下面这个对象：
-      callback(true)
-      loading.value = true
-      setTimeout(() => {
-        loading.value = false
-        createMessage.success('保存成功')
-      }, 1000)
+  loadData();
+
+  // 加载数据
+  function loadData() {
+    // 封装查询条件
+    // 调用查询数据接口
+    loading.value = true;
+    defHttp
+      .get({
+        url: Api.getData,
+        params: {
+          pageNo: 1,
+          pageSize: 30,
+        },
+      })
+      .then((result) => {
+        // 将查询的数据赋值给 dataSource
+        dataSource.value = result.records;
+        // 重置选择
+        selectedRows.value = [];
+      })
+      .finally(() => {
+        // 这里是无论成功或失败都会执行的方法，在这里关闭loading
+        loading.value = false;
+      });
+  }
+
+  // 查询子表数据
+  function loadSubData(row) {
+    if (row) {
+      // 这里一定要做限制，限制不能重复查询，否者会出现死循环
+      if (subTable.currentRowId === row.id) {
+        return true;
+      }
+      subTable.currentRowId = row.id;
+      subTable.loading = true;
+      defHttp
+        .get({
+          url: Api.getData,
+          params: {
+            pageNo: 1,
+            pageSize: 30,
+            parentId: row.id,
+          },
+        })
+        .then((result) => {
+          // 将查询的数据赋值给 dataSource
+          subTable.dataSource = result.records;
+        })
+        .finally(() => {
+          // 这里是无论成功或失败都会执行的方法，在这里关闭loading
+          subTable.loading = false;
+        });
+      return true;
     } else {
-      callback(false)
-      createMessage.warn('校验失败')
+      return false;
     }
-  })
-}
+  }
+
+  // 详细信息里点了确认按钮
+  function handleDetailsConfirm({ row, $table, callback }) {
+    console.log('保存的数据：', row);
+    // 校验当前行
+    $table.validate(row).then((errMap) => {
+      // 校验通过
+      if (!errMap) {
+        // 校验子表，如果需要的话，可以操作下面这个对象：
+        callback(true);
+        loading.value = true;
+        setTimeout(() => {
+          loading.value = false;
+          createMessage.success('保存成功');
+        }, 1000);
+      } else {
+        callback(false);
+        createMessage.warn('校验失败');
+      }
+    });
+  }
 </script>
 
-<style scoped>
-
-</style>
\ No newline at end of file
+<style scoped></style>
diff --git a/src/views/demo/jeecg/JVxeTableDemo/func-demo/SocketReload.vue b/src/views/demo/jeecg/JVxeTableDemo/func-demo/SocketReload.vue
index 610b4a1..8245619 100644
--- a/src/views/demo/jeecg/JVxeTableDemo/func-demo/SocketReload.vue
+++ b/src/views/demo/jeecg/JVxeTableDemo/func-demo/SocketReload.vue
@@ -1,9 +1,8 @@
 <template>
   <a-card title="无痕刷新示例" :bordered="false">
-
-    <div style="margin-bottom: 8px;">
+    <div style="margin-bottom: 8px">
       <span>启用数据变动特效：</span>
-      <a-switch v-model:checked="reloadEffect"/>
+      <a-switch v-model:checked="reloadEffect" />
     </div>
 
     <!--
@@ -16,96 +15,94 @@
          保存成功后调用 socketSendUpdateRow 方法，将当前 row 传递过去即可 （见第 102 行）
     -->
     <JVxeTable
-        ref="tableRef"
-        rowNumber
-        rowSelection
-
-        keepSource
-        socketReload
-        socketKey="demo-socket-reload"
-        :reloadEffect="reloadEffect"
-
-        :height="340"
-        :loading="loading"
-        :columns="columns"
-        :dataSource="dataSource"
-        @edit-closed="handleEditClosed"
+      ref="tableRef"
+      rowNumber
+      rowSelection
+      keepSource
+      socketReload
+      socketKey="demo-socket-reload"
+      :reloadEffect="reloadEffect"
+      :height="340"
+      :loading="loading"
+      :columns="columns"
+      :dataSource="dataSource"
+      @edit-closed="handleEditClosed"
     />
   </a-card>
 </template>
 
 <script lang="ts" setup>
-// 无痕刷新示例
-import { reactive, ref } from 'vue'
-import { defHttp } from '/@/utils/http/axios'
-import { JVxeColumn, JVxeTableInstance, JVxeTypes } from '/@/components/jeecg/JVxeTable/types'
-import { useMessage } from '/@/hooks/web/useMessage'
+  // 无痕刷新示例
+  import { reactive, ref } from 'vue';
+  import { defHttp } from '/@/utils/http/axios';
+  import { JVxeColumn, JVxeTableInstance, JVxeTypes } from '/@/components/jeecg/JVxeTable/types';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
-const { createMessage } = useMessage()
-const tableRef = ref<JVxeTableInstance>()
-// 是否启用日历刷新效果
-const reloadEffect = ref(true)
-const loading = ref(false)
-const dataSource = ref<Recordable[]>([])
-const columns = ref<JVxeColumn[]>([
-  { key: 'num', title: '序号', width: 80 },
-  { key: 'ship_name', title: '船名', width: 180, type: JVxeTypes.input },
-  { key: 'call', title: '呼叫', width: 80, type: JVxeTypes.input },
-  { key: 'len', title: '长', width: 80, type: JVxeTypes.input },
-  { key: 'ton', title: '吨', width: 120, type: JVxeTypes.input },
-  { key: 'payer', title: '付款方', width: 120, type: JVxeTypes.input },
-  { key: 'count', title: '数', width: 40 },
-  { key: 'company', title: '公司', minWidth: 180, type: JVxeTypes.input },
-  { key: 'trend', title: '动向', width: 120, type: JVxeTypes.input },
-])
+  const { createMessage } = useMessage();
+  const tableRef = ref<JVxeTableInstance>();
+  // 是否启用日历刷新效果
+  const reloadEffect = ref(true);
+  const loading = ref(false);
+  const dataSource = ref<Recordable[]>([]);
+  const columns = ref<JVxeColumn[]>([
+    { key: 'num', title: '序号', width: 80 },
+    { key: 'ship_name', title: '船名', width: 180, type: JVxeTypes.input },
+    { key: 'call', title: '呼叫', width: 80, type: JVxeTypes.input },
+    { key: 'len', title: '长', width: 80, type: JVxeTypes.input },
+    { key: 'ton', title: '吨', width: 120, type: JVxeTypes.input },
+    { key: 'payer', title: '付款方', width: 120, type: JVxeTypes.input },
+    { key: 'count', title: '数', width: 40 },
+    { key: 'company', title: '公司', minWidth: 180, type: JVxeTypes.input },
+    { key: 'trend', title: '动向', width: 120, type: JVxeTypes.input },
+  ]);
 
-// 查询url地址
-enum Api {
-  getData = '/mock/vxe/getData'
-}
-
-loadData()
-
-// 加载数据
-function loadData() {
-  loading.value = true
-  defHttp.get({
-    url: Api.getData,
-    params: { pageNo: 1, pageSize: 200 },
-  }).then(result => {
-    dataSource.value = result.records
-  }).finally(() => {
-    loading.value = false
-  })
-}
-
-// 单元格编辑完成之后触发的事件
-function handleEditClosed(event) {
-  let { $table, row, column } = event
-  let field = column.property
-  // 判断单元格值是否被修改
-  if ($table.isUpdateByRow(row, field)) {
-    // 校验当前行
-    $table.validate(row).then((errMap) => {
-      // 校验通过
-      if (!errMap) {
-        // 【模拟保存】（此处需要替换成真实的请求）
-        let hideLoading = createMessage.loading(`正在保存"${column.title}"`, 0)
-        setTimeout(() => {
-          hideLoading()
-          createMessage.success(`"${column.title}"保存成功！`)
-          // 局部更新单元格为已保存状态
-          $table.reloadRow(row, null, field)
-          // 发送更新消息
-          tableRef.value?.socketSendUpdateRow(row)
-        }, 555)
-      }
-    })
+  // 查询url地址
+  enum Api {
+    getData = '/mock/vxe/getData',
   }
-}
 
+  loadData();
+
+  // 加载数据
+  function loadData() {
+    loading.value = true;
+    defHttp
+      .get({
+        url: Api.getData,
+        params: { pageNo: 1, pageSize: 200 },
+      })
+      .then((result) => {
+        dataSource.value = result.records;
+      })
+      .finally(() => {
+        loading.value = false;
+      });
+  }
+
+  // 单元格编辑完成之后触发的事件
+  function handleEditClosed(event) {
+    let { $table, row, column } = event;
+    let field = column.property;
+    // 判断单元格值是否被修改
+    if ($table.isUpdateByRow(row, field)) {
+      // 校验当前行
+      $table.validate(row).then((errMap) => {
+        // 校验通过
+        if (!errMap) {
+          // 【模拟保存】（此处需要替换成真实的请求）
+          let hideLoading = createMessage.loading(`正在保存"${column.title}"`, 0);
+          setTimeout(() => {
+            hideLoading();
+            createMessage.success(`"${column.title}"保存成功！`);
+            // 局部更新单元格为已保存状态
+            $table.reloadRow(row, null, field);
+            // 发送更新消息
+            tableRef.value?.socketSendUpdateRow(row);
+          }, 555);
+        }
+      });
+    }
+  }
 </script>
 
-<style scoped>
-
-</style>
\ No newline at end of file
+<style scoped></style>
diff --git a/src/views/demo/jeecg/JVxeTableDemo/index.vue b/src/views/demo/jeecg/JVxeTableDemo/index.vue
index 2b79978..9e73f3c 100644
--- a/src/views/demo/jeecg/JVxeTableDemo/index.vue
+++ b/src/views/demo/jeecg/JVxeTableDemo/index.vue
@@ -3,19 +3,19 @@
     <a-card :bordered="false">
       <a-tabs defaultActiveKey="1">
         <a-tab-pane tab="基础示例" key="1">
-          <JVxeDemo1/>
+          <JVxeDemo1 />
         </a-tab-pane>
         <a-tab-pane tab="高级示例" key="2">
-          <JVxeDemo2/>
+          <JVxeDemo2 />
         </a-tab-pane>
         <a-tab-pane tab="排序示例" key="3">
-          <JVxeDemo3/>
+          <JVxeDemo3 />
         </a-tab-pane>
         <a-tab-pane tab="联动示例" key="4">
-          <JVxeDemo4/>
+          <JVxeDemo4 />
         </a-tab-pane>
         <a-tab-pane tab="键盘操作" key="5">
-          <JVxeDemo5/>
+          <JVxeDemo5 />
         </a-tab-pane>
       </a-tabs>
     </a-card>
@@ -23,11 +23,11 @@
 </template>
 
 <script lang="ts" setup>
-// noinspection ES6UnusedImports
-import { PageWrapper } from '/@/components/Page'
-import JVxeDemo1 from './JVxeDemo1.vue'
-import JVxeDemo2 from './JVxeDemo2.vue'
-import JVxeDemo3 from './JVxeDemo3.vue'
-import JVxeDemo4 from './JVxeDemo4.vue'
-import JVxeDemo5 from './JVxeDemo5.vue'
-</script>
\ No newline at end of file
+  // noinspection ES6UnusedImports
+  import { PageWrapper } from '/@/components/Page';
+  import JVxeDemo1 from './JVxeDemo1.vue';
+  import JVxeDemo2 from './JVxeDemo2.vue';
+  import JVxeDemo3 from './JVxeDemo3.vue';
+  import JVxeDemo4 from './JVxeDemo4.vue';
+  import JVxeDemo5 from './JVxeDemo5.vue';
+</script>
diff --git a/src/views/demo/jeecg/JVxeTableDemo/layout-demo/ErpTemplate.vue b/src/views/demo/jeecg/JVxeTableDemo/layout-demo/ErpTemplate.vue
index 38194c7..5cfbf02 100644
--- a/src/views/demo/jeecg/JVxeTableDemo/layout-demo/ErpTemplate.vue
+++ b/src/views/demo/jeecg/JVxeTableDemo/layout-demo/ErpTemplate.vue
@@ -1,40 +1,38 @@
 <template>
   <a-card :bordered="false">
     <JVxeTable
-        toolbar
-        :toolbarConfig="toolbarConfig"
-
-        rowNumber
-        rowSelection
-        rowSelectionType="radio"
-        clickSelectRow
-        highlightCurrentRow
-        :height="tableHeight"
-        :loading="table1.loading"
-        :columns="table1.columns"
-        :dataSource="table1.dataSource"
-        :pagination="table1.pagination"
-        :expandConfig="expandConfig"
-        style="margin-bottom: 8px"
-
-        @pageChange="handleTable1PageChange"
-        @selectRowChange="handleTable1SelectRowChange"
+      toolbar
+      :toolbarConfig="toolbarConfig"
+      rowNumber
+      rowSelection
+      rowSelectionType="radio"
+      clickSelectRow
+      highlightCurrentRow
+      :height="tableHeight"
+      :loading="table1.loading"
+      :columns="table1.columns"
+      :dataSource="table1.dataSource"
+      :pagination="table1.pagination"
+      :expandConfig="expandConfig"
+      style="margin-bottom: 8px"
+      @pageChange="handleTable1PageChange"
+      @selectRowChange="handleTable1SelectRowChange"
     ></JVxeTable>
 
-    <a-tabs v-show="subTabs.show" :class="{'sub-tabs':true, 'un-expand': !subTabs.expand}">
+    <a-tabs v-show="subTabs.show" :class="{ 'sub-tabs': true, 'un-expand': !subTabs.expand }">
       <a-tab-pane tab="子表1" key="1">
         <JVxeTable
-            toolbar
-            row-number
-            row-selection
-            height="auto"
-            :maxHeight="350"
-            :loading="table2.loading"
-            :columns="table2.columns"
-            :dataSource="table2.dataSource"
-            :pagination="table2.pagination"
-            @pageChange="handleTable2PageChange"
-            @selectRowChange="handleTable2SelectRowChange"
+          toolbar
+          row-number
+          row-selection
+          height="auto"
+          :maxHeight="350"
+          :loading="table2.loading"
+          :columns="table2.columns"
+          :dataSource="table2.dataSource"
+          :pagination="table2.pagination"
+          @pageChange="handleTable2PageChange"
+          @selectRowChange="handleTable2SelectRowChange"
         />
       </a-tab-pane>
       <a-tab-pane tab="子表2" key="2">
@@ -50,264 +48,272 @@
 </template>
 
 <script>
-import {h} from 'vue'
-import {defHttp} from '/@/utils/http/axios'
-import {JVxeTypes} from '/@/components/jeecg/JVxeTable/types'
-import {Button, Checkbox} from 'ant-design-vue'
-import {UpOutlined, DownOutlined} from '@ant-design/icons-vue'
+  import { h } from 'vue';
+  import { defHttp } from '/@/utils/http/axios';
+  import { JVxeTypes } from '/@/components/jeecg/JVxeTable/types';
+  import { Button, Checkbox } from 'ant-design-vue';
+  import { UpOutlined, DownOutlined } from '@ant-design/icons-vue';
 
-export default {
-  name: 'ErpTemplate',
-  data() {
-    return {
-      toolbarConfig: {
-        // prefix 前缀；suffix 后缀
-        slot: ['prefix', 'suffix'],
-        // add 新增按钮；remove 删除按钮；clearSelection 清空选择按钮
-        btn: ['add', 'remove', 'clearSelection'],
-      },
-
-      expandConfig: {
-        // 是否只能同时展开一行
-        accordion: true,
-      },
-
-      // 子表 tabs
-      subTabs: {
-        show: false,
-        // 是否展开
-        expand: true,
-        // 是否自动展开
-        autoExpand: true,
-      },
-
-      table1: {
-        // 是否正在加载
-        loading: false,
-        // 分页器参数
-        pagination: {
-          // 当前页码
-          current: 1,
-          // 每页的条数
-          pageSize: 200,
-          // 可切换的条数
-          pageSizeOptions: ['10', '20', '30', '100', '200'],
-          // 数据总数（目前并不知道真实的总数，所以先填写0，在后台查出来后再赋值）
-          total: 0,
-          showTotal: (total, range) => {
-            // 此处为 jsx 语法
-            let text = h('span', `${range[0]}-${range[1]} 共 ${total} 条`)
-            // 判断子表是否显示，如果显示就渲染展开收起按钮
-            if (this.subTabs.show) {
-              let expand = h('span', {}, [
-                h(Button, {
-                  type: 'link',
-                  onClick: this.handleToggleTabs,
-                }, () => [
-                  this.subTabs.expand ? h(UpOutlined) : h(DownOutlined),
-                  h('span', {}, this.subTabs.expand ? '收起' : '展开'),
-                ]),
-                h(Checkbox, {
-                  // h 写法不支持 v-model , 所以需要手动赋值
-                  checked: this.subTabs.autoExpand,
-                  'onUpdate:checked': checked => this.subTabs.autoExpand = checked,
-                }, () => '自动展开'),
-              ])
-              // 返回多个dom用数组
-              return [expand, text]
-            } else {
-              // 直接返回单个dom
-              return text
-            }
-          },
+  export default {
+    name: 'ErpTemplate',
+    data() {
+      return {
+        toolbarConfig: {
+          // prefix 前缀；suffix 后缀
+          slot: ['prefix', 'suffix'],
+          // add 新增按钮；remove 删除按钮；clearSelection 清空选择按钮
+          btn: ['add', 'remove', 'clearSelection'],
         },
-        // 选择的行
-        selectedRows: [],
-        // 数据源，控制表格的数据
-        dataSource: [],
-        // 列配置，控制表格显示的列
-        columns: [
-          {key: 'num', title: '序号', width: '80px'},
-          {
-            // 字段key，跟后台数据的字段名匹配
-            key: 'ship_name',
-            // 列的标题
-            title: '船名',
-            // 列的宽度
-            width: '180px',
-            // 如果加上了该属性，就代表当前单元格是可编辑的，type就是表单的类型，input就是简单的输入框
-            type: JVxeTypes.input,
-          },
-          {key: 'call', title: '呼叫', width: '990px', type: JVxeTypes.input},
-          {key: 'len', title: '长', width: '80px', type: JVxeTypes.inputNumber},
-          {key: 'ton', title: '吨', width: '120px', type: JVxeTypes.inputNumber},
-          {key: 'payer', title: '付款方', width: '120px', type: JVxeTypes.input},
-          {key: 'count', title: '数', width: '40px'},
-          {
-            key: 'company',
-            title: '公司',
-            // 最小宽度，与宽度不同的是，这个不是固定的宽度，如果表格有多余的空间，会平均分配给设置了 minWidth 的列
-            // 如果要做占满表格的列可以这么写
-            minWidth: '180px',
-            type: JVxeTypes.input,
-          },
-          {key: 'trend', title: '动向', width: '120px', type: JVxeTypes.input},
-        ],
-      },
-      // 子级表的配置信息 （配置和主表的完全一致，就不写冗余的注释了）
-      table2: {
-        currentRowId: null,
-        loading: false,
-        pagination: {current: 1, pageSize: 10, pageSizeOptions: ['5', '10', '20', '30'], total: 0},
-        selectedRows: [],
-        dataSource: [],
-        columns: [
-          {key: 'dd_num', title: '调度序号', width: '120px'},
-          {key: 'tug', title: '拖轮', width: '180px', type: JVxeTypes.input},
-          {key: 'work_start_time', title: '作业开始时间', width: '180px', type: JVxeTypes.input},
-          {key: 'work_stop_time', title: '作业结束时间', width: '180px', type: JVxeTypes.input},
-          {key: 'type', title: '船舶分类', width: '120px', type: JVxeTypes.input},
-          {key: 'port_area', title: '所属港区', width: '120px', type: JVxeTypes.input},
-        ],
-      },
-      currentSubRow: null,
-      // 查询url地址
-      url: {
-        getData: '/mock/vxe/getData',
-      },
-    }
-  },
-  computed: {
-    tableHeight() {
-      let {show, expand} = this.subTabs
-      return show ? (expand ? 350 : 482) : 482
-    },
-  },
-  created() {
-    this.loadTable1Data()
-  },
-  methods: {
 
-    // 加载table1【主表】的数据
-    loadTable1Data() {
-      // 封装查询条件
-      let formData = {
-        pageNo: this.table1.pagination.current,
-        pageSize: this.table1.pagination.pageSize,
-      }
-      // 调用查询数据接口
-      this.table1.loading = true
-      defHttp.get({
-        url: this.url.getData,
-        params: formData,
-      }).then(result => {
-        // 后台查询回来的 total，数据总数量
-        this.table1.pagination.total = result.total
-        // 将查询的数据赋值给 dataSource
-        this.table1.dataSource = result.records
-        // 重置选择
-        this.table1.selectedRows = []
-      }).finally(() => {
-        // 这里是无论成功或失败都会执行的方法，在这里关闭loading
-        this.table1.loading = false
-      })
-    },
+        expandConfig: {
+          // 是否只能同时展开一行
+          accordion: true,
+        },
 
-    // 查询子表数据
-    loadSubData(row) {
-      if (row) {
-        // 这里一定要做限制，限制不能重复查询，否者会出现死循环
-        if (this.table2.currentRowId === row.id) {
-          return true
+        // 子表 tabs
+        subTabs: {
+          show: false,
+          // 是否展开
+          expand: true,
+          // 是否自动展开
+          autoExpand: true,
+        },
+
+        table1: {
+          // 是否正在加载
+          loading: false,
+          // 分页器参数
+          pagination: {
+            // 当前页码
+            current: 1,
+            // 每页的条数
+            pageSize: 200,
+            // 可切换的条数
+            pageSizeOptions: ['10', '20', '30', '100', '200'],
+            // 数据总数（目前并不知道真实的总数，所以先填写0，在后台查出来后再赋值）
+            total: 0,
+            showTotal: (total, range) => {
+              // 此处为 jsx 语法
+              let text = h('span', `${range[0]}-${range[1]} 共 ${total} 条`);
+              // 判断子表是否显示，如果显示就渲染展开收起按钮
+              if (this.subTabs.show) {
+                let expand = h('span', {}, [
+                  h(
+                    Button,
+                    {
+                      type: 'link',
+                      onClick: this.handleToggleTabs,
+                    },
+                    () => [this.subTabs.expand ? h(UpOutlined) : h(DownOutlined), h('span', {}, this.subTabs.expand ? '收起' : '展开')]
+                  ),
+                  h(
+                    Checkbox,
+                    {
+                      // h 写法不支持 v-model , 所以需要手动赋值
+                      checked: this.subTabs.autoExpand,
+                      'onUpdate:checked': (checked) => (this.subTabs.autoExpand = checked),
+                    },
+                    () => '自动展开'
+                  ),
+                ]);
+                // 返回多个dom用数组
+                return [expand, text];
+              } else {
+                // 直接返回单个dom
+                return text;
+              }
+            },
+          },
+          // 选择的行
+          selectedRows: [],
+          // 数据源，控制表格的数据
+          dataSource: [],
+          // 列配置，控制表格显示的列
+          columns: [
+            { key: 'num', title: '序号', width: '80px' },
+            {
+              // 字段key，跟后台数据的字段名匹配
+              key: 'ship_name',
+              // 列的标题
+              title: '船名',
+              // 列的宽度
+              width: '180px',
+              // 如果加上了该属性，就代表当前单元格是可编辑的，type就是表单的类型，input就是简单的输入框
+              type: JVxeTypes.input,
+            },
+            { key: 'call', title: '呼叫', width: '990px', type: JVxeTypes.input },
+            { key: 'len', title: '长', width: '80px', type: JVxeTypes.inputNumber },
+            { key: 'ton', title: '吨', width: '120px', type: JVxeTypes.inputNumber },
+            { key: 'payer', title: '付款方', width: '120px', type: JVxeTypes.input },
+            { key: 'count', title: '数', width: '40px' },
+            {
+              key: 'company',
+              title: '公司',
+              // 最小宽度，与宽度不同的是，这个不是固定的宽度，如果表格有多余的空间，会平均分配给设置了 minWidth 的列
+              // 如果要做占满表格的列可以这么写
+              minWidth: '180px',
+              type: JVxeTypes.input,
+            },
+            { key: 'trend', title: '动向', width: '120px', type: JVxeTypes.input },
+          ],
+        },
+        // 子级表的配置信息 （配置和主表的完全一致，就不写冗余的注释了）
+        table2: {
+          currentRowId: null,
+          loading: false,
+          pagination: { current: 1, pageSize: 10, pageSizeOptions: ['5', '10', '20', '30'], total: 0 },
+          selectedRows: [],
+          dataSource: [],
+          columns: [
+            { key: 'dd_num', title: '调度序号', width: '120px' },
+            { key: 'tug', title: '拖轮', width: '180px', type: JVxeTypes.input },
+            { key: 'work_start_time', title: '作业开始时间', width: '180px', type: JVxeTypes.input },
+            { key: 'work_stop_time', title: '作业结束时间', width: '180px', type: JVxeTypes.input },
+            { key: 'type', title: '船舶分类', width: '120px', type: JVxeTypes.input },
+            { key: 'port_area', title: '所属港区', width: '120px', type: JVxeTypes.input },
+          ],
+        },
+        currentSubRow: null,
+        // 查询url地址
+        url: {
+          getData: '/mock/vxe/getData',
+        },
+      };
+    },
+    computed: {
+      tableHeight() {
+        let { show, expand } = this.subTabs;
+        return show ? (expand ? 350 : 482) : 482;
+      },
+    },
+    created() {
+      this.loadTable1Data();
+    },
+    methods: {
+      // 加载table1【主表】的数据
+      loadTable1Data() {
+        // 封装查询条件
+        let formData = {
+          pageNo: this.table1.pagination.current,
+          pageSize: this.table1.pagination.pageSize,
+        };
+        // 调用查询数据接口
+        this.table1.loading = true;
+        defHttp
+          .get({
+            url: this.url.getData,
+            params: formData,
+          })
+          .then((result) => {
+            // 后台查询回来的 total，数据总数量
+            this.table1.pagination.total = result.total;
+            // 将查询的数据赋值给 dataSource
+            this.table1.dataSource = result.records;
+            // 重置选择
+            this.table1.selectedRows = [];
+          })
+          .finally(() => {
+            // 这里是无论成功或失败都会执行的方法，在这里关闭loading
+            this.table1.loading = false;
+          });
+      },
+
+      // 查询子表数据
+      loadSubData(row) {
+        if (row) {
+          // 这里一定要做限制，限制不能重复查询，否者会出现死循环
+          if (this.table2.currentRowId === row.id) {
+            return true;
+          }
+          this.table2.currentRowId = row.id;
+          this.loadTable2Data();
+          return true;
+        } else {
+          return false;
         }
-        this.table2.currentRowId = row.id
-        this.loadTable2Data()
-        return true
-      } else {
-        return false
-      }
-    },
-    // 查询子表数据
-    loadTable2Data() {
-      let table2 = this.table2
-      let formData = {
-        parentId: table2.currentRowId,
-        pageNo: this.table2.pagination.current,
-        pageSize: this.table2.pagination.pageSize,
-      }
-      table2.loading = true
-      defHttp.get({
-        url: this.url.getData,
-        params: formData,
-      }).then(result => {
-        // 将查询的数据赋值给 dataSource
-        table2.selectedRows = []
-        table2.dataSource = result.records
-        table2.pagination.total = result.total
-      }).finally(() => {
-        // 这里是无论成功或失败都会执行的方法，在这里关闭loading
-        table2.loading = false
-      })
-    },
+      },
+      // 查询子表数据
+      loadTable2Data() {
+        let table2 = this.table2;
+        let formData = {
+          parentId: table2.currentRowId,
+          pageNo: this.table2.pagination.current,
+          pageSize: this.table2.pagination.pageSize,
+        };
+        table2.loading = true;
+        defHttp
+          .get({
+            url: this.url.getData,
+            params: formData,
+          })
+          .then((result) => {
+            // 将查询的数据赋值给 dataSource
+            table2.selectedRows = [];
+            table2.dataSource = result.records;
+            table2.pagination.total = result.total;
+          })
+          .finally(() => {
+            // 这里是无论成功或失败都会执行的方法，在这里关闭loading
+            table2.loading = false;
+          });
+      },
 
-    // table1【主表】当选择的行变化时触发的事件
-    handleTable1SelectRowChange(event) {
-      this.table1.selectedRows = event.selectedRows
-      this.subTabs.show = true
-      if (this.subTabs.autoExpand) {
-        this.subTabs.expand = true
-      }
-      this.loadSubData(event.selectedRows[0])
-    },
-    // table2【子表】当选择的行变化时触发的事件
-    handleTable2SelectRowChange(event) {
-      this.table2.selectedRows = event.selectedRows
-    },
+      // table1【主表】当选择的行变化时触发的事件
+      handleTable1SelectRowChange(event) {
+        this.table1.selectedRows = event.selectedRows;
+        this.subTabs.show = true;
+        if (this.subTabs.autoExpand) {
+          this.subTabs.expand = true;
+        }
+        this.loadSubData(event.selectedRows[0]);
+      },
+      // table2【子表】当选择的行变化时触发的事件
+      handleTable2SelectRowChange(event) {
+        this.table2.selectedRows = event.selectedRows;
+      },
 
-    handleTable1PageChange(event) {
-      // 重新赋值
-      this.table1.pagination.current = event.current
-      this.table1.pagination.pageSize = event.pageSize
-      // 查询数据
-      this.loadTable1Data()
-    },
-    // 当table2【子表】分页参数变化时触发的事件
-    handleTable2PageChange(event) {
-      // 重新赋值
-      this.table2.pagination.current = event.current
-      this.table2.pagination.pageSize = event.pageSize
-      // 查询数据
-      this.loadTable2Data()
-    },
+      handleTable1PageChange(event) {
+        // 重新赋值
+        this.table1.pagination.current = event.current;
+        this.table1.pagination.pageSize = event.pageSize;
+        // 查询数据
+        this.loadTable1Data();
+      },
+      // 当table2【子表】分页参数变化时触发的事件
+      handleTable2PageChange(event) {
+        // 重新赋值
+        this.table2.pagination.current = event.current;
+        this.table2.pagination.pageSize = event.pageSize;
+        // 查询数据
+        this.loadTable2Data();
+      },
 
-    // 展开或收起子表tabs
-    handleToggleTabs() {
-      this.subTabs.expand = !this.subTabs.expand
+      // 展开或收起子表tabs
+      handleToggleTabs() {
+        this.subTabs.expand = !this.subTabs.expand;
+      },
     },
-
-  },
-
-}
+  };
 </script>
 
 <style lang="less" scoped>
-.sub-tabs {
-  &.un-expand {
-    ::v-deep(.ant-tabs-content) {
-      height: 0 !important;
-    }
+  .sub-tabs {
+    &.un-expand {
+      ::v-deep(.ant-tabs-content) {
+        height: 0 !important;
+      }
 
-    ::v-deep(.ant-tabs-bar) {
-      border-color: transparent !important;
-    }
+      ::v-deep(.ant-tabs-bar) {
+        border-color: transparent !important;
+      }
 
-    ::v-deep(.ant-tabs-ink-bar) {
-      background-color: transparent !important;
-    }
+      ::v-deep(.ant-tabs-ink-bar) {
+        background-color: transparent !important;
+      }
 
-    ::v-deep(.ant-tabs-tab) {
-      display: none !important;
+      ::v-deep(.ant-tabs-tab) {
+        display: none !important;
+      }
     }
   }
-}
 </style>
diff --git a/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template1.vue b/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template1.vue
index 0b48629..37ab585 100644
--- a/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template1.vue
+++ b/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template1.vue
@@ -2,56 +2,56 @@
   <a-card :bordered="false">
     <a-row :gutter="8">
       <!-- 这里是父级节点 -->
-      <a-col :span="24" style="margin-bottom: 4px;">
+      <a-col :span="24" style="margin-bottom: 4px">
         <JVxeTable
-            toolbar
-            rowNumber
-            rowSelection
-            clickSelectRow
-            highlightCurrentRow
-            :radioConfig="{highlight: false}"
-            :checkboxConfig="{highlight: false}"
-            :height="340"
-            :loading="table1.loading"
-            :columns="table1.columns"
-            :dataSource="table1.dataSource"
-            :pagination="table1.pagination"
-            @pageChange="handleTable1PageChange"
-            @selectRowChange="handleTable1SelectRowChange"
+          toolbar
+          rowNumber
+          rowSelection
+          clickSelectRow
+          highlightCurrentRow
+          :radioConfig="{ highlight: false }"
+          :checkboxConfig="{ highlight: false }"
+          :height="340"
+          :loading="table1.loading"
+          :columns="table1.columns"
+          :dataSource="table1.dataSource"
+          :pagination="table1.pagination"
+          @pageChange="handleTable1PageChange"
+          @selectRowChange="handleTable1SelectRowChange"
         />
       </a-col>
       <!-- 这里是子级节点 -->
       <a-col :span="12">
         <JVxeTable
-            toolbar
-            rowNumber
-            rowSelection
-            clickSelectRow
-            highlightCurrentRow
-            :radioConfig="{highlight: false}"
-            :checkboxConfig="{highlight: false}"
-            :height="340"
-            :loading="table2.loading"
-            :columns="table2.columns"
-            :dataSource="table2.dataSource"
-            :pagination="table2.pagination"
-            @pageChange="handleTable2PageChange"
-            @selectRowChange="handleTable2SelectRowChange"
+          toolbar
+          rowNumber
+          rowSelection
+          clickSelectRow
+          highlightCurrentRow
+          :radioConfig="{ highlight: false }"
+          :checkboxConfig="{ highlight: false }"
+          :height="340"
+          :loading="table2.loading"
+          :columns="table2.columns"
+          :dataSource="table2.dataSource"
+          :pagination="table2.pagination"
+          @pageChange="handleTable2PageChange"
+          @selectRowChange="handleTable2SelectRowChange"
         >
         </JVxeTable>
       </a-col>
       <!-- 这里是孙级节点 -->
       <a-col :span="12">
         <JVxeTable
-            toolbar
-            rowNumber
-            rowSelection
-            :height="340"
-            :loading="table3.loading"
-            :columns="table3.columns"
-            :dataSource="table3.dataSource"
-            :pagination="table3.pagination"
-            @pageChange="handleTable3PageChange"
+          toolbar
+          rowNumber
+          rowSelection
+          :height="340"
+          :loading="table3.loading"
+          :columns="table3.columns"
+          :dataSource="table3.dataSource"
+          :pagination="table3.pagination"
+          @pageChange="handleTable3PageChange"
         >
         </JVxeTable>
       </a-col>
@@ -60,268 +60,273 @@
 </template>
 
 <script>
-import {defHttp} from '/@/utils/http/axios'
-import {JVxeTypes} from '/@/components/jeecg/JVxeTable/types'
+  import { defHttp } from '/@/utils/http/axios';
+  import { JVxeTypes } from '/@/components/jeecg/JVxeTable/types';
 
-// 【多种布局模板】上面父、左下子、右下孙
-export default {
-  name: 'Template1',
-  data() {
-    return {
-      table1: {
-        // 是否正在加载
-        loading: false,
-        // 分页器参数
-        pagination: {
-          // 当前页码
-          current: 1,
-          // 每页的条数
-          pageSize: 200,
-          // 可切换的条数
-          pageSizeOptions: ['10', '20', '30', '100', '200'],
-          // 数据总数（目前并不知道真实的总数，所以先填写0，在后台查出来后再赋值）
-          total: 0,
-        },
-        // 最后选中的行
-        lastRow: null,
-        // 选择的行
-        selectedRows: [],
-        // 数据源，控制表格的数据
-        dataSource: [],
-        // 列配置，控制表格显示的列
-        columns: [
-          {key: 'num', title: '序号', width: '80px'},
-          {
-            // 字段key，跟后台数据的字段名匹配
-            key: 'ship_name',
-            // 列的标题
-            title: '船名',
-            // 列的宽度
-            width: '180px',
-            // 如果加上了该属性，就代表当前单元格是可编辑的，type就是表单的类型，input就是简单的输入框
-            type: JVxeTypes.input,
-            formatter({cellValue, row, column}) {
-              let foo = ''
-              if (row.company === '佧伒侾佯有限公司') {
-                foo += '-233'
-              }
-              return cellValue + foo
+  // 【多种布局模板】上面父、左下子、右下孙
+  export default {
+    name: 'Template1',
+    data() {
+      return {
+        table1: {
+          // 是否正在加载
+          loading: false,
+          // 分页器参数
+          pagination: {
+            // 当前页码
+            current: 1,
+            // 每页的条数
+            pageSize: 200,
+            // 可切换的条数
+            pageSizeOptions: ['10', '20', '30', '100', '200'],
+            // 数据总数（目前并不知道真实的总数，所以先填写0，在后台查出来后再赋值）
+            total: 0,
+          },
+          // 最后选中的行
+          lastRow: null,
+          // 选择的行
+          selectedRows: [],
+          // 数据源，控制表格的数据
+          dataSource: [],
+          // 列配置，控制表格显示的列
+          columns: [
+            { key: 'num', title: '序号', width: '80px' },
+            {
+              // 字段key，跟后台数据的字段名匹配
+              key: 'ship_name',
+              // 列的标题
+              title: '船名',
+              // 列的宽度
+              width: '180px',
+              // 如果加上了该属性，就代表当前单元格是可编辑的，type就是表单的类型，input就是简单的输入框
+              type: JVxeTypes.input,
+              formatter({ cellValue, row, column }) {
+                let foo = '';
+                if (row.company === '佧伒侾佯有限公司') {
+                  foo += '-233';
+                }
+                return cellValue + foo;
+              },
             },
-          },
-          {key: 'call', title: '呼叫', width: '80px', type: JVxeTypes.input},
-          {key: 'len', title: '长', width: '80px', type: JVxeTypes.inputNumber},
-          {key: 'ton', title: '吨', width: '120px', type: JVxeTypes.inputNumber},
-          {key: 'payer', title: '付款方', width: '120px', type: JVxeTypes.input},
-          {key: 'count', title: '数', width: '40px'},
-          {
-            key: 'company',
-            title: '公司',
-            // 最小宽度，与宽度不同的是，这个不是固定的宽度，如果表格有多余的空间，会平均分配给设置了 minWidth 的列
-            // 如果要做占满表格的列可以这么写
-            minWidth: '180px',
-            type: JVxeTypes.input,
-          },
-          {key: 'trend', title: '动向', width: '120px', type: JVxeTypes.input},
-        ],
+            { key: 'call', title: '呼叫', width: '80px', type: JVxeTypes.input },
+            { key: 'len', title: '长', width: '80px', type: JVxeTypes.inputNumber },
+            { key: 'ton', title: '吨', width: '120px', type: JVxeTypes.inputNumber },
+            { key: 'payer', title: '付款方', width: '120px', type: JVxeTypes.input },
+            { key: 'count', title: '数', width: '40px' },
+            {
+              key: 'company',
+              title: '公司',
+              // 最小宽度，与宽度不同的是，这个不是固定的宽度，如果表格有多余的空间，会平均分配给设置了 minWidth 的列
+              // 如果要做占满表格的列可以这么写
+              minWidth: '180px',
+              type: JVxeTypes.input,
+            },
+            { key: 'trend', title: '动向', width: '120px', type: JVxeTypes.input },
+          ],
+        },
+        // 子级表的配置信息 （配置和主表的完全一致，就不写冗余的注释了）
+        table2: {
+          loading: false,
+          pagination: { current: 1, pageSize: 200, pageSizeOptions: ['100', '200'], total: 0 },
+          // 最后选中的行
+          lastRow: null,
+          selectedRows: [],
+          dataSource: [],
+          columns: [
+            { key: 'dd_num', title: '调度序号', width: '120px' },
+            { key: 'tug', title: '拖轮', width: '180px', type: JVxeTypes.input },
+            { key: 'work_start_time', title: '作业开始时间', width: '180px', type: JVxeTypes.input },
+            { key: 'work_stop_time', title: '作业结束时间', width: '180px', type: JVxeTypes.input },
+            { key: 'type', title: '船舶分类', width: '120px', type: JVxeTypes.input },
+            { key: 'port_area', title: '所属港区', width: '120px', type: JVxeTypes.input },
+          ],
+        },
+        // 孙级表的配置信息 （配置和主表的完全一致，就不写冗余的注释了）
+        table3: {
+          loading: false,
+          pagination: { current: 1, pageSize: 200, pageSizeOptions: ['100', '200'], total: 0 },
+          selectedRows: [],
+          dataSource: [],
+          columns: [
+            { key: 'dd_num', title: '调度序号', width: '120px' },
+            { key: 'tug', title: '拖轮', width: '120px', type: JVxeTypes.input },
+            { key: 'power', title: '马力', width: '120px', type: JVxeTypes.input },
+            { key: 'nature', title: '性质', width: '120px', type: JVxeTypes.input },
+            { key: 'departure_time', title: '发船时间', width: '180px', type: JVxeTypes.input },
+          ],
+        },
+        // 查询url地址
+        url: {
+          getData: '/mock/vxe/getData',
+        },
+      };
+    },
+    // 监听器
+    watch: {
+      // 监听table1 【主表】选择的数据发生了变化
+      ['table1.lastRow'](row) {
+        this.loadTable2Data();
       },
-      // 子级表的配置信息 （配置和主表的完全一致，就不写冗余的注释了）
-      table2: {
-        loading: false,
-        pagination: {current: 1, pageSize: 200, pageSizeOptions: ['100', '200'], total: 0},
-        // 最后选中的行
-        lastRow: null,
-        selectedRows: [],
-        dataSource: [],
-        columns: [
-          {key: 'dd_num', title: '调度序号', width: '120px'},
-          {key: 'tug', title: '拖轮', width: '180px', type: JVxeTypes.input},
-          {key: 'work_start_time', title: '作业开始时间', width: '180px', type: JVxeTypes.input},
-          {key: 'work_stop_time', title: '作业结束时间', width: '180px', type: JVxeTypes.input},
-          {key: 'type', title: '船舶分类', width: '120px', type: JVxeTypes.input},
-          {key: 'port_area', title: '所属港区', width: '120px', type: JVxeTypes.input},
-        ],
+      // 监听table2 【子表】选择的数据发生了变化
+      ['table2.lastRow']() {
+        this.loadTable3Data();
       },
-      // 孙级表的配置信息 （配置和主表的完全一致，就不写冗余的注释了）
-      table3: {
-        loading: false,
-        pagination: {current: 1, pageSize: 200, pageSizeOptions: ['100', '200'], total: 0},
-        selectedRows: [],
-        dataSource: [],
-        columns: [
-          {key: 'dd_num', title: '调度序号', width: '120px'},
-          {key: 'tug', title: '拖轮', width: '120px', type: JVxeTypes.input},
-          {key: 'power', title: '马力', width: '120px', type: JVxeTypes.input},
-          {key: 'nature', title: '性质', width: '120px', type: JVxeTypes.input},
-          {key: 'departure_time', title: '发船时间', width: '180px', type: JVxeTypes.input},
-        ],
+    },
+    created() {
+      this.loadTable1Data();
+    },
+    methods: {
+      // 加载table1【主表】的数据
+      loadTable1Data() {
+        // 封装查询条件
+        let formData = {
+          pageNo: this.table1.pagination.current,
+          pageSize: this.table1.pagination.pageSize,
+        };
+        // 调用查询数据接口
+        this.table1.loading = true;
+        defHttp
+          .get({
+            url: this.url.getData,
+            params: formData,
+          })
+          .then((result) => {
+            // 后台查询回来的 total，数据总数量
+            this.table1.pagination.total = result.total;
+            // 将查询的数据赋值给 dataSource
+            this.table1.dataSource = result.records;
+            // 重置选择
+            this.table1.selectedRows = [];
+          })
+          .finally(() => {
+            // 这里是无论成功或失败都会执行的方法，在这里关闭loading
+            this.table1.loading = false;
+          });
       },
-      // 查询url地址
-      url: {
-        getData: '/mock/vxe/getData',
+
+      // 当table1【主表】分页参数变化时触发的事件
+      handleTable1PageChange(event) {
+        // 重新赋值
+        this.table1.pagination.current = event.current;
+        this.table1.pagination.pageSize = event.pageSize;
+        // 查询数据
+        this.loadTable1Data();
       },
-    }
-  },
-  // 监听器
-  watch: {
-    // 监听table1 【主表】选择的数据发生了变化
-    ['table1.lastRow'](row) {
-      this.loadTable2Data()
-    },
-    // 监听table2 【子表】选择的数据发生了变化
-    ['table2.lastRow']() {
-      this.loadTable3Data()
-    },
-  },
-  created() {
-    this.loadTable1Data()
-  },
-  methods: {
 
-    // 加载table1【主表】的数据
-    loadTable1Data() {
-      // 封装查询条件
-      let formData = {
-        pageNo: this.table1.pagination.current,
-        pageSize: this.table1.pagination.pageSize,
-      }
-      // 调用查询数据接口
-      this.table1.loading = true
-      defHttp.get({
-        url: this.url.getData,
-        params: formData,
-      }).then(result => {
-        // 后台查询回来的 total，数据总数量
-        this.table1.pagination.total = result.total
-        // 将查询的数据赋值给 dataSource
-        this.table1.dataSource = result.records
-        // 重置选择
-        this.table1.selectedRows = []
-      }).finally(() => {
-        // 这里是无论成功或失败都会执行的方法，在这里关闭loading
-        this.table1.loading = false
-      })
-    },
+      // table1【主表】当选择的行变化时触发的事件
+      handleTable1SelectRowChange(event) {
+        this.handleTableSelectRowChange(this.table1, event);
+      },
 
-    // 当table1【主表】分页参数变化时触发的事件
-    handleTable1PageChange(event) {
-      // 重新赋值
-      this.table1.pagination.current = event.current
-      this.table1.pagination.pageSize = event.pageSize
-      // 查询数据
-      this.loadTable1Data()
-    },
-
-    // table1【主表】当选择的行变化时触发的事件
-    handleTable1SelectRowChange(event) {
-      this.handleTableSelectRowChange(this.table1, event)
-    },
-
-    // 加载table2【子表】的数据，根据主表的id进行查询
-    loadTable2Data() {
-      // 如果主表没有选择，则不查询
-      let selectedRows = this.table1.selectedRows
-      if (!selectedRows || selectedRows.length === 0) {
-        this.table2.pagination.total = 0
-        this.table2.dataSource = []
-        this.table2.selectedRows = []
-        return
-      } else if (this.table1.lastRow == null) {
-        this.table1.lastRow = selectedRows[selectedRows.length - 1]
-      }
-      let formData = {
-        parentId: this.table1.lastRow.id,
-        pageNo: this.table2.pagination.current,
-        pageSize: this.table2.pagination.pageSize,
-      }
-      this.table2.loading = true
-      defHttp.get({
-        url: this.url.getData,
-        params: formData,
-      }).then(result => {
-        this.table2.pagination.total = result.total
-        this.table2.dataSource = result.records
-        this.table2.selectedRows = []
-      }).finally(() => {
-        this.table2.loading = false
-      })
-    },
-
-    // table2【子表】当选择的行变化时触发的事件
-    handleTable2SelectRowChange(event) {
-      this.handleTableSelectRowChange(this.table2, event)
-    },
-
-    // 当table2【子表】分页参数变化时触发的事件
-    handleTable2PageChange(event) {
-      // 重新赋值
-      this.table2.pagination.current = event.current
-      this.table2.pagination.pageSize = event.pageSize
-      // 查询数据
-      this.loadTable2Data()
-    },
-
-    // 加载table3【孙表】的数据，根据子表的id进行查询
-    loadTable3Data() {
-      // 如果主表没有选择，则不查询
-      let selectedRows = this.table2.selectedRows
-      if (!selectedRows || selectedRows.length === 0) {
-        this.table3.pagination.total = 0
-        this.table3.dataSource = []
-        this.table3.selectedRows = []
-        return
-      } else if (this.table2.lastRow == null) {
-        this.table2.lastRow = selectedRows[selectedRows.length - 1]
-      }
-      let formData = {
-        parentId: this.table2.lastRow.id,
-        pageNo: this.table3.pagination.current,
-        pageSize: this.table3.pagination.pageSize,
-      }
-      this.table3.loading = true
-      defHttp.get({
-        url: this.url.getData,
-        params: formData,
-      }).then(result => {
-        this.table3.pagination.total = result.total
-        this.table3.dataSource = result.records
-      }).finally(() => {
-        this.table3.loading = false
-      })
-    },
-    // 当table3【孙表】分页参数变化时触发的事件
-    handleTable3PageChange(event) {
-      // 重新赋值
-      this.table3.pagination.current = event.current
-      this.table3.pagination.pageSize = event.pageSize
-      // 查询数据
-      this.loadTable3Data()
-    },
-
-    /** 公共方法：处理表格选中变化事件 */
-    handleTableSelectRowChange(table, event) {
-      let {row, action, selectedRows, $table} = event
-      // 获取最后一个选中的
-      let lastSelected = selectedRows[selectedRows.length - 1]
-      if (action === 'selected') {
-        table.lastRow = row
-      } else if (action === 'selected-all') {
-        // 取消全选
-        if (selectedRows.length === 0) {
-          table.lastRow = null
-        } else if (!table.lastRow) {
-          table.lastRow = lastSelected
+      // 加载table2【子表】的数据，根据主表的id进行查询
+      loadTable2Data() {
+        // 如果主表没有选择，则不查询
+        let selectedRows = this.table1.selectedRows;
+        if (!selectedRows || selectedRows.length === 0) {
+          this.table2.pagination.total = 0;
+          this.table2.dataSource = [];
+          this.table2.selectedRows = [];
+          return;
+        } else if (this.table1.lastRow == null) {
+          this.table1.lastRow = selectedRows[selectedRows.length - 1];
         }
-      } else if (action === 'unselected' && row === table.lastRow) {
-        table.lastRow = lastSelected
-      }
-      $table.setCurrentRow(table.lastRow)
-      table.selectedRows = selectedRows
-    },
+        let formData = {
+          parentId: this.table1.lastRow.id,
+          pageNo: this.table2.pagination.current,
+          pageSize: this.table2.pagination.pageSize,
+        };
+        this.table2.loading = true;
+        defHttp
+          .get({
+            url: this.url.getData,
+            params: formData,
+          })
+          .then((result) => {
+            this.table2.pagination.total = result.total;
+            this.table2.dataSource = result.records;
+            this.table2.selectedRows = [];
+          })
+          .finally(() => {
+            this.table2.loading = false;
+          });
+      },
 
-  },
-}
+      // table2【子表】当选择的行变化时触发的事件
+      handleTable2SelectRowChange(event) {
+        this.handleTableSelectRowChange(this.table2, event);
+      },
+
+      // 当table2【子表】分页参数变化时触发的事件
+      handleTable2PageChange(event) {
+        // 重新赋值
+        this.table2.pagination.current = event.current;
+        this.table2.pagination.pageSize = event.pageSize;
+        // 查询数据
+        this.loadTable2Data();
+      },
+
+      // 加载table3【孙表】的数据，根据子表的id进行查询
+      loadTable3Data() {
+        // 如果主表没有选择，则不查询
+        let selectedRows = this.table2.selectedRows;
+        if (!selectedRows || selectedRows.length === 0) {
+          this.table3.pagination.total = 0;
+          this.table3.dataSource = [];
+          this.table3.selectedRows = [];
+          return;
+        } else if (this.table2.lastRow == null) {
+          this.table2.lastRow = selectedRows[selectedRows.length - 1];
+        }
+        let formData = {
+          parentId: this.table2.lastRow.id,
+          pageNo: this.table3.pagination.current,
+          pageSize: this.table3.pagination.pageSize,
+        };
+        this.table3.loading = true;
+        defHttp
+          .get({
+            url: this.url.getData,
+            params: formData,
+          })
+          .then((result) => {
+            this.table3.pagination.total = result.total;
+            this.table3.dataSource = result.records;
+          })
+          .finally(() => {
+            this.table3.loading = false;
+          });
+      },
+      // 当table3【孙表】分页参数变化时触发的事件
+      handleTable3PageChange(event) {
+        // 重新赋值
+        this.table3.pagination.current = event.current;
+        this.table3.pagination.pageSize = event.pageSize;
+        // 查询数据
+        this.loadTable3Data();
+      },
+
+      /** 公共方法：处理表格选中变化事件 */
+      handleTableSelectRowChange(table, event) {
+        let { row, action, selectedRows, $table } = event;
+        // 获取最后一个选中的
+        let lastSelected = selectedRows[selectedRows.length - 1];
+        if (action === 'selected') {
+          table.lastRow = row;
+        } else if (action === 'selected-all') {
+          // 取消全选
+          if (selectedRows.length === 0) {
+            table.lastRow = null;
+          } else if (!table.lastRow) {
+            table.lastRow = lastSelected;
+          }
+        } else if (action === 'unselected' && row === table.lastRow) {
+          table.lastRow = lastSelected;
+        }
+        $table.setCurrentRow(table.lastRow);
+        table.selectedRows = selectedRows;
+      },
+    },
+  };
 </script>
 
-<style lang="less">
-
-</style>
\ No newline at end of file
+<style lang="less"></style>
diff --git a/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template2.vue b/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template2.vue
index 8bea95c..cb4e22c 100644
--- a/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template2.vue
+++ b/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template2.vue
@@ -4,255 +4,246 @@
       <!-- 左侧父 -->
       <a-col :span="12">
         <JVxeTable
-            toolbar
-            rowNumber
-            rowSelection
-            clickSelectRow
-            highlightCurrentRow
-            :radioConfig="{highlight: false}"
-            :checkboxConfig="{highlight: false}"
-            :height="790"
-            :loading="table1.loading"
-            :columns="table1.columns"
-            :dataSource="table1.dataSource"
-            :pagination="table1.pagination"
-            @pageChange="handleTable1PageChange"
-            @selectRowChange="handleTable1SelectRowChange"
+          toolbar
+          rowNumber
+          rowSelection
+          clickSelectRow
+          highlightCurrentRow
+          :radioConfig="{ highlight: false }"
+          :checkboxConfig="{ highlight: false }"
+          :height="790"
+          :loading="table1.loading"
+          :columns="table1.columns"
+          :dataSource="table1.dataSource"
+          :pagination="table1.pagination"
+          @pageChange="handleTable1PageChange"
+          @selectRowChange="handleTable1SelectRowChange"
         />
       </a-col>
       <a-col :span="12">
-
         <!-- 左侧选择的数据展示在这里 -->
-        <JVxeTable
-            rowNumber
-            :height="375"
-
-            :columns="table1.columns"
-            :dataSource="table1.selectedRows"
-            style="margin: 52px 0 8px;"
-        />
+        <JVxeTable rowNumber :height="375" :columns="table1.columns" :dataSource="table1.selectedRows" style="margin: 52px 0 8px" />
 
         <!-- 右下子 -->
         <JVxeTable
-            toolbar
-            rowNumber
-            rowSelection
-            clickSelectRow
-            :height="355"
-            :loading="table2.loading"
-            :columns="table2.columns"
-            :dataSource="table2.dataSource"
-            :pagination="table2.pagination"
-            @pageChange="handleTable2PageChange"
-            @selectRowChange="handleTable2SelectRowChange"
+          toolbar
+          rowNumber
+          rowSelection
+          clickSelectRow
+          :height="355"
+          :loading="table2.loading"
+          :columns="table2.columns"
+          :dataSource="table2.dataSource"
+          :pagination="table2.pagination"
+          @pageChange="handleTable2PageChange"
+          @selectRowChange="handleTable2SelectRowChange"
         />
       </a-col>
     </a-row>
-
   </a-card>
 </template>
 
 <script>
-import {defHttp} from '/@/utils/http/axios'
-import {JVxeTypes} from '/@/components/jeecg/JVxeTable/types'
+  import { defHttp } from '/@/utils/http/axios';
+  import { JVxeTypes } from '/@/components/jeecg/JVxeTable/types';
 
-// 【多种布局模板】 左边选择后，记录选到右侧，右侧是父、子
-export default {
-  name: 'Template2',
-  data() {
-    return {
-      table1: {
-        // 是否正在加载
-        loading: false,
-        // 分页器参数
-        pagination: {
-          // 当前页码
-          current: 1,
-          // 每页的条数
-          pageSize: 200,
-          // 可切换的条数
-          pageSizeOptions: ['10', '20', '30', '100', '200'],
-          // 数据总数（目前并不知道真实的总数，所以先填写0，在后台查出来后再赋值）
-          total: 0,
+  // 【多种布局模板】 左边选择后，记录选到右侧，右侧是父、子
+  export default {
+    name: 'Template2',
+    data() {
+      return {
+        table1: {
+          // 是否正在加载
+          loading: false,
+          // 分页器参数
+          pagination: {
+            // 当前页码
+            current: 1,
+            // 每页的条数
+            pageSize: 200,
+            // 可切换的条数
+            pageSizeOptions: ['10', '20', '30', '100', '200'],
+            // 数据总数（目前并不知道真实的总数，所以先填写0，在后台查出来后再赋值）
+            total: 0,
+          },
+          // 最后选中的行
+          lastRow: null,
+          // 选择的行
+          selectedRows: [],
+          // 数据源，控制表格的数据
+          dataSource: [],
+          // 列配置，控制表格显示的列
+          columns: [
+            { key: 'num', title: '序号', width: '80px' },
+            {
+              // 字段key，跟后台数据的字段名匹配
+              key: 'ship_name',
+              // 列的标题
+              title: '船名',
+              // 列的宽度
+              width: '180px',
+              // 如果加上了该属性，就代表当前单元格是可编辑的，type就是表单的类型，input就是简单的输入框
+              type: JVxeTypes.input,
+            },
+            { key: 'call', title: '呼叫', width: '80px', type: JVxeTypes.input },
+            { key: 'len', title: '长', width: '80px', type: JVxeTypes.input },
+            { key: 'ton', title: '吨', width: '120px', type: JVxeTypes.input },
+            { key: 'payer', title: '付款方', width: '120px', type: JVxeTypes.input },
+            { key: 'count', title: '数', width: '40px' },
+            {
+              key: 'company',
+              title: '公司',
+              // 最小宽度，与宽度不同的是，这个不是固定的宽度，如果表格有多余的空间，会平均分配给设置了 minWidth 的列
+              // 如果要做占满表格的列可以这么写
+              minWidth: '180px',
+              type: JVxeTypes.input,
+            },
+            { key: 'trend', title: '动向', width: '120px', type: JVxeTypes.input },
+          ],
         },
-        // 最后选中的行
-        lastRow: null,
-        // 选择的行
-        selectedRows: [],
-        // 数据源，控制表格的数据
-        dataSource: [],
-        // 列配置，控制表格显示的列
-        columns: [
-          {key: 'num', title: '序号', width: '80px'},
-          {
-            // 字段key，跟后台数据的字段名匹配
-            key: 'ship_name',
-            // 列的标题
-            title: '船名',
-            // 列的宽度
-            width: '180px',
-            // 如果加上了该属性，就代表当前单元格是可编辑的，type就是表单的类型，input就是简单的输入框
-            type: JVxeTypes.input,
-          },
-          {key: 'call', title: '呼叫', width: '80px', type: JVxeTypes.input},
-          {key: 'len', title: '长', width: '80px', type: JVxeTypes.input},
-          {key: 'ton', title: '吨', width: '120px', type: JVxeTypes.input},
-          {key: 'payer', title: '付款方', width: '120px', type: JVxeTypes.input},
-          {key: 'count', title: '数', width: '40px'},
-          {
-            key: 'company',
-            title: '公司',
-            // 最小宽度，与宽度不同的是，这个不是固定的宽度，如果表格有多余的空间，会平均分配给设置了 minWidth 的列
-            // 如果要做占满表格的列可以这么写
-            minWidth: '180px',
-            type: JVxeTypes.input,
-          },
-          {key: 'trend', title: '动向', width: '120px', type: JVxeTypes.input},
-        ],
+        // 子级表的配置信息 （配置和主表的完全一致，就不写冗余的注释了）
+        table2: {
+          loading: false,
+          pagination: { current: 1, pageSize: 200, pageSizeOptions: ['100', '200'], total: 0 },
+          selectedRows: [],
+          dataSource: [],
+          columns: [
+            { key: 'dd_num', title: '调度序号', width: '120px' },
+            { key: 'tug', title: '拖轮', width: '180px', type: JVxeTypes.input },
+            { key: 'work_start_time', title: '作业开始时间', width: '180px', type: JVxeTypes.input },
+            { key: 'work_stop_time', title: '作业结束时间', width: '180px', type: JVxeTypes.input },
+            { key: 'type', title: '船舶分类', width: '120px', type: JVxeTypes.input },
+            { key: 'port_area', title: '所属港区', width: '120px', type: JVxeTypes.input },
+          ],
+        },
+        // 查询url地址
+        url: {
+          getData: '/mock/vxe/getData',
+        },
+      };
+    },
+    // 监听器
+    watch: {
+      // 监听table1 【主表】选择的数据发生了变化
+      ['table1.lastRow']() {
+        this.loadTable2Data();
       },
-      // 子级表的配置信息 （配置和主表的完全一致，就不写冗余的注释了）
-      table2: {
-        loading: false,
-        pagination: {current: 1, pageSize: 200, pageSizeOptions: ['100', '200'], total: 0},
-        selectedRows: [],
-        dataSource: [],
-        columns: [
-          {key: 'dd_num', title: '调度序号', width: '120px'},
-          {key: 'tug', title: '拖轮', width: '180px', type: JVxeTypes.input},
-          {key: 'work_start_time', title: '作业开始时间', width: '180px', type: JVxeTypes.input},
-          {key: 'work_stop_time', title: '作业结束时间', width: '180px', type: JVxeTypes.input},
-          {key: 'type', title: '船舶分类', width: '120px', type: JVxeTypes.input},
-          {key: 'port_area', title: '所属港区', width: '120px', type: JVxeTypes.input},
-        ],
+    },
+    created() {
+      this.loadTable1Data();
+    },
+    methods: {
+      // 加载table1【主表】的数据
+      loadTable1Data() {
+        // 封装查询条件
+        let formData = {
+          pageNo: this.table1.pagination.current,
+          pageSize: this.table1.pagination.pageSize,
+        };
+        // 调用查询数据接口
+        this.table1.loading = true;
+        defHttp
+          .get({
+            url: this.url.getData,
+            params: formData,
+          })
+          .then((result) => {
+            // 后台查询回来的 total，数据总数量
+            this.table1.pagination.total = result.total;
+            // 将查询的数据赋值给 dataSource
+            this.table1.dataSource = result.records;
+            // 重置选择
+            this.table1.selectedRows = [];
+          })
+          .finally(() => {
+            // 这里是无论成功或失败都会执行的方法，在这里关闭loading
+            this.table1.loading = false;
+          });
       },
-      // 查询url地址
-      url: {
-        getData: '/mock/vxe/getData',
-      },
-    }
-  },
-  // 监听器
-  watch: {
-    // 监听table1 【主表】选择的数据发生了变化
-    ['table1.lastRow']() {
-      this.loadTable2Data()
-    },
 
-  },
-  created() {
-    this.loadTable1Data()
-  },
-  methods: {
-
-    // 加载table1【主表】的数据
-    loadTable1Data() {
-      // 封装查询条件
-      let formData = {
-        pageNo: this.table1.pagination.current,
-        pageSize: this.table1.pagination.pageSize,
-      }
-      // 调用查询数据接口
-      this.table1.loading = true
-      defHttp.get({
-        url: this.url.getData,
-        params: formData,
-      }).then(result => {
-        // 后台查询回来的 total，数据总数量
-        this.table1.pagination.total = result.total
-        // 将查询的数据赋值给 dataSource
-        this.table1.dataSource = result.records
-        // 重置选择
-        this.table1.selectedRows = []
-      }).finally(() => {
-        // 这里是无论成功或失败都会执行的方法，在这里关闭loading
-        this.table1.loading = false
-      })
-    },
-
-
-    // 加载table2【子表】的数据，根据主表的id进行查询
-    loadTable2Data() {
-      // 如果主表没有选择，则不查询
-      let selectedRows = this.table1.selectedRows
-      if (!selectedRows || selectedRows.length === 0) {
-        this.table2.pagination.total = 0
-        this.table2.dataSource = []
-        this.table2.selectedRows = []
-        return
-      } else if (this.table1.lastRow == null) {
-        this.table1.lastRow = selectedRows[selectedRows.length - 1]
-      }
-      let formData = {
-        parentId: this.table1.lastRow.id,
-        pageNo: this.table2.pagination.current,
-        pageSize: this.table2.pagination.pageSize,
-      }
-      this.table2.loading = true
-      defHttp.get({
-        url: this.url.getData,
-        params: formData,
-      }).then(result => {
-        this.table2.pagination.total = result.total
-        this.table2.dataSource = result.records
-        this.table2.selectedRows = []
-      }).finally(() => {
-        this.table2.loading = false
-      })
-    },
-
-    // table1【主表】当选择的行变化时触发的事件
-    handleTable1SelectRowChange(event) {
-      this.handleTableSelectRowChange(this.table1, event)
-    },
-
-    // table2【子表】当选择的行变化时触发的事件
-    handleTable2SelectRowChange(event) {
-      this.table2.selectedRows = event.selectedRows
-    },
-
-    // 当table1【主表】分页参数变化时触发的事件
-    handleTable1PageChange(event) {
-      // 重新赋值
-      this.table1.pagination.current = event.current
-      this.table1.pagination.pageSize = event.pageSize
-      // 查询数据
-      this.loadTable1Data()
-    },
-
-    // 当table2【子表】分页参数变化时触发的事件
-    handleTable2PageChange(event) {
-      // 重新赋值
-      this.table2.pagination.current = event.current
-      this.table2.pagination.pageSize = event.pageSize
-      // 查询数据
-      this.loadTable2Data()
-    },
-
-    /** 公共方法：处理表格选中变化事件 */
-    handleTableSelectRowChange(table, event) {
-      let {row, action, selectedRows, $table} = event
-      // 获取最后一个选中的
-      let lastSelected = selectedRows[selectedRows.length - 1]
-      if (action === 'selected') {
-        table.lastRow = row
-      } else if (action === 'selected-all') {
-        // 取消全选
-        if (selectedRows.length === 0) {
-          table.lastRow = null
-        } else if (!table.lastRow) {
-          table.lastRow = lastSelected
+      // 加载table2【子表】的数据，根据主表的id进行查询
+      loadTable2Data() {
+        // 如果主表没有选择，则不查询
+        let selectedRows = this.table1.selectedRows;
+        if (!selectedRows || selectedRows.length === 0) {
+          this.table2.pagination.total = 0;
+          this.table2.dataSource = [];
+          this.table2.selectedRows = [];
+          return;
+        } else if (this.table1.lastRow == null) {
+          this.table1.lastRow = selectedRows[selectedRows.length - 1];
         }
-      } else if (action === 'unselected' && row === table.lastRow) {
-        table.lastRow = lastSelected
-      }
-      $table.setCurrentRow(table.lastRow)
-      table.selectedRows = selectedRows
-    },
+        let formData = {
+          parentId: this.table1.lastRow.id,
+          pageNo: this.table2.pagination.current,
+          pageSize: this.table2.pagination.pageSize,
+        };
+        this.table2.loading = true;
+        defHttp
+          .get({
+            url: this.url.getData,
+            params: formData,
+          })
+          .then((result) => {
+            this.table2.pagination.total = result.total;
+            this.table2.dataSource = result.records;
+            this.table2.selectedRows = [];
+          })
+          .finally(() => {
+            this.table2.loading = false;
+          });
+      },
 
-  },
-}
+      // table1【主表】当选择的行变化时触发的事件
+      handleTable1SelectRowChange(event) {
+        this.handleTableSelectRowChange(this.table1, event);
+      },
+
+      // table2【子表】当选择的行变化时触发的事件
+      handleTable2SelectRowChange(event) {
+        this.table2.selectedRows = event.selectedRows;
+      },
+
+      // 当table1【主表】分页参数变化时触发的事件
+      handleTable1PageChange(event) {
+        // 重新赋值
+        this.table1.pagination.current = event.current;
+        this.table1.pagination.pageSize = event.pageSize;
+        // 查询数据
+        this.loadTable1Data();
+      },
+
+      // 当table2【子表】分页参数变化时触发的事件
+      handleTable2PageChange(event) {
+        // 重新赋值
+        this.table2.pagination.current = event.current;
+        this.table2.pagination.pageSize = event.pageSize;
+        // 查询数据
+        this.loadTable2Data();
+      },
+
+      /** 公共方法：处理表格选中变化事件 */
+      handleTableSelectRowChange(table, event) {
+        let { row, action, selectedRows, $table } = event;
+        // 获取最后一个选中的
+        let lastSelected = selectedRows[selectedRows.length - 1];
+        if (action === 'selected') {
+          table.lastRow = row;
+        } else if (action === 'selected-all') {
+          // 取消全选
+          if (selectedRows.length === 0) {
+            table.lastRow = null;
+          } else if (!table.lastRow) {
+            table.lastRow = lastSelected;
+          }
+        } else if (action === 'unselected' && row === table.lastRow) {
+          table.lastRow = lastSelected;
+        }
+        $table.setCurrentRow(table.lastRow);
+        table.selectedRows = selectedRows;
+      },
+    },
+  };
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template3.vue b/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template3.vue
index c889e4f..8ff7272 100644
--- a/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template3.vue
+++ b/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template3.vue
@@ -1,243 +1,237 @@
 <template>
-
   <a-card :bordered="false">
     <a-row :gutter="8">
       <a-col :span="12">
         <!-- 左上父 -->
         <JVxeTable
-            toolbar
-            rowNumber
-            rowSelection
-            clickSelectRow
-            highlightCurrentRow
-            :radioConfig="{highlight: false}"
-            :checkboxConfig="{highlight: false}"
-            :height="357"
-            :loading="table1.loading"
-            :columns="table1.columns"
-            :dataSource="table1.dataSource"
-            :pagination="table1.pagination"
-            style="margin-bottom: 8px;"
-            @pageChange="handleTable1PageChange"
-            @selectRowChange="handleTable1SelectRowChange"
+          toolbar
+          rowNumber
+          rowSelection
+          clickSelectRow
+          highlightCurrentRow
+          :radioConfig="{ highlight: false }"
+          :checkboxConfig="{ highlight: false }"
+          :height="357"
+          :loading="table1.loading"
+          :columns="table1.columns"
+          :dataSource="table1.dataSource"
+          :pagination="table1.pagination"
+          style="margin-bottom: 8px"
+          @pageChange="handleTable1PageChange"
+          @selectRowChange="handleTable1SelectRowChange"
         />
 
         <!-- 左下子 -->
         <JVxeTable
-            toolbar
-            rowNumber
-            rowSelection
-            clickSelectRow
-            :height="356"
-            :loading="table2.loading"
-            :columns="table2.columns"
-            :dataSource="table2.dataSource"
-            :pagination="table2.pagination"
-            @pageChange="handleTable2PageChange"
+          toolbar
+          rowNumber
+          rowSelection
+          clickSelectRow
+          :height="356"
+          :loading="table2.loading"
+          :columns="table2.columns"
+          :dataSource="table2.dataSource"
+          :pagination="table2.pagination"
+          @pageChange="handleTable2PageChange"
         />
       </a-col>
       <!-- 左侧父选择的数据展示在这里 -->
       <a-col :span="12">
-        <JVxeTable
-            rowNumber
-            :height="812"
-            :columns="table1.columns"
-            :dataSource="table1.selectedRows"
-            style="margin-top: 52px;"
-        />
+        <JVxeTable rowNumber :height="812" :columns="table1.columns" :dataSource="table1.selectedRows" style="margin-top: 52px" />
       </a-col>
     </a-row>
-
   </a-card>
 </template>
 
 <script>
-import {defHttp} from '/@/utils/http/axios'
-import {JVxeTypes} from '/@/components/jeecg/JVxeTable/types'
+  import { defHttp } from '/@/utils/http/axios';
+  import { JVxeTypes } from '/@/components/jeecg/JVxeTable/types';
 
-// 【多种布局模板】左侧上边是主表、下边是子表，右侧是选中数据
-export default {
-  name: 'Template3',
-  components: {},
-  data() {
-    return {
-      // 主表的配置信息
-      table1: {
-        // 是否正在加载
-        loading: false,
-        // 分页器参数
-        pagination: {
-          // 当前页码
-          current: 1,
-          // 每页的条数
-          pageSize: 200,
-          // 可切换的条数
-          pageSizeOptions: ['10', '20', '30', '100', '200'],
-          // 数据总数（目前并不知道真实的总数，所以先填写0，在后台查出来后再赋值）
-          total: 0,
-        },
-        // 最后选中的行
-        lastRow: null,
-        // 选择的行
-        selectedRows: [],
-        // 数据源，控制表格的数据
-        dataSource: [],
-        // 列配置，控制表格显示的列
-        columns: [
-          {key: 'num', title: '序号', width: '80px'},
-          {
-            // 字段key，跟后台数据的字段名匹配
-            key: 'ship_name',
-            // 列的标题
-            title: '船名',
-            // 列的宽度
-            width: '180px',
-            // 如果加上了该属性，就代表当前单元格是可编辑的，type就是表单的类型，input就是简单的输入框
-            type: JVxeTypes.input,
+  // 【多种布局模板】左侧上边是主表、下边是子表，右侧是选中数据
+  export default {
+    name: 'Template3',
+    components: {},
+    data() {
+      return {
+        // 主表的配置信息
+        table1: {
+          // 是否正在加载
+          loading: false,
+          // 分页器参数
+          pagination: {
+            // 当前页码
+            current: 1,
+            // 每页的条数
+            pageSize: 200,
+            // 可切换的条数
+            pageSizeOptions: ['10', '20', '30', '100', '200'],
+            // 数据总数（目前并不知道真实的总数，所以先填写0，在后台查出来后再赋值）
+            total: 0,
           },
-          {key: 'call', title: '呼叫', width: '80px', type: JVxeTypes.input},
-          {key: 'len', title: '长', width: '80px', type: JVxeTypes.input},
-          {key: 'ton', title: '吨', width: '120px', type: JVxeTypes.input},
-          {key: 'payer', title: '付款方', width: '120px', type: JVxeTypes.input},
-          {key: 'count', title: '数', width: '40px'},
-          {key: 'company', title: '公司', width: '180px', type: JVxeTypes.input},
-          {key: 'trend', title: '动向', width: '120px', type: JVxeTypes.input},
-        ],
+          // 最后选中的行
+          lastRow: null,
+          // 选择的行
+          selectedRows: [],
+          // 数据源，控制表格的数据
+          dataSource: [],
+          // 列配置，控制表格显示的列
+          columns: [
+            { key: 'num', title: '序号', width: '80px' },
+            {
+              // 字段key，跟后台数据的字段名匹配
+              key: 'ship_name',
+              // 列的标题
+              title: '船名',
+              // 列的宽度
+              width: '180px',
+              // 如果加上了该属性，就代表当前单元格是可编辑的，type就是表单的类型，input就是简单的输入框
+              type: JVxeTypes.input,
+            },
+            { key: 'call', title: '呼叫', width: '80px', type: JVxeTypes.input },
+            { key: 'len', title: '长', width: '80px', type: JVxeTypes.input },
+            { key: 'ton', title: '吨', width: '120px', type: JVxeTypes.input },
+            { key: 'payer', title: '付款方', width: '120px', type: JVxeTypes.input },
+            { key: 'count', title: '数', width: '40px' },
+            { key: 'company', title: '公司', width: '180px', type: JVxeTypes.input },
+            { key: 'trend', title: '动向', width: '120px', type: JVxeTypes.input },
+          ],
+        },
+        // 子表的配置信息 （配置和主表的完全一致，就不写冗余的注释了）
+        table2: {
+          loading: false,
+          pagination: { current: 1, pageSize: 200, pageSizeOptions: ['100', '200'], total: 0 },
+          dataSource: [],
+          columns: [
+            { key: 'dd_num', title: '调度序号', width: '120px' },
+            { key: 'tug', title: '拖轮', width: '180px', type: JVxeTypes.input },
+            { key: 'work_start_time', title: '作业开始时间', width: '180px', type: JVxeTypes.input },
+            { key: 'work_stop_time', title: '作业结束时间', width: '180px', type: JVxeTypes.input },
+            { key: 'type', title: '船舶分类', width: '120px', type: JVxeTypes.input },
+            { key: 'port_area', title: '所属港区', width: '120px', type: JVxeTypes.input },
+          ],
+        },
+        // 查询url地址
+        url: {
+          getData: '/mock/vxe/getData',
+        },
+      };
+    },
+
+    // 监听器
+    watch: {
+      // 监听table1 【主表】选择的数据发生了变化
+      ['table1.lastRow'](row) {
+        this.loadTable2Data();
       },
-      // 子表的配置信息 （配置和主表的完全一致，就不写冗余的注释了）
-      table2: {
-        loading: false,
-        pagination: {current: 1, pageSize: 200, pageSizeOptions: ['100', '200'], total: 0},
-        dataSource: [],
-        columns: [
-          {key: 'dd_num', title: '调度序号', width: '120px'},
-          {key: 'tug', title: '拖轮', width: '180px', type: JVxeTypes.input},
-          {key: 'work_start_time', title: '作业开始时间', width: '180px', type: JVxeTypes.input},
-          {key: 'work_stop_time', title: '作业结束时间', width: '180px', type: JVxeTypes.input},
-          {key: 'type', title: '船舶分类', width: '120px', type: JVxeTypes.input},
-          {key: 'port_area', title: '所属港区', width: '120px', type: JVxeTypes.input},
-        ],
+    },
+    created() {
+      this.loadTable1Data();
+    },
+    methods: {
+      // 加载table1（主表）的数据
+      loadTable1Data() {
+        // 封装查询条件
+        let formData = {
+          pageNo: this.table1.pagination.current,
+          pageSize: this.table1.pagination.pageSize,
+        };
+        // 调用查询数据接口
+        this.table1.loading = true;
+        defHttp
+          .get({
+            url: this.url.getData,
+            params: formData,
+          })
+          .then((result) => {
+            // 后台查询回来的 total，数据总数量
+            this.table1.pagination.total = result.total;
+            // 将查询的数据赋值给 dataSource
+            this.table1.dataSource = result.records;
+          })
+          .finally(() => {
+            // 这里是无论成功或失败都会执行的方法，在这里关闭loading
+            this.table1.loading = false;
+          });
       },
-      // 查询url地址
-      url: {
-        getData: '/mock/vxe/getData',
-      },
-    }
-  },
-
-  // 监听器
-  watch: {
-    // 监听table1 【主表】选择的数据发生了变化
-    ['table1.lastRow'](row) {
-      this.loadTable2Data()
-    },
-  },
-  created() {
-    this.loadTable1Data()
-  },
-  methods: {
-
-    // 加载table1（主表）的数据
-    loadTable1Data() {
-      // 封装查询条件
-      let formData = {
-        pageNo: this.table1.pagination.current,
-        pageSize: this.table1.pagination.pageSize,
-      }
-      // 调用查询数据接口
-      this.table1.loading = true
-      defHttp.get({
-        url: this.url.getData,
-        params: formData,
-      }).then(result => {
-        // 后台查询回来的 total，数据总数量
-        this.table1.pagination.total = result.total
-        // 将查询的数据赋值给 dataSource
-        this.table1.dataSource = result.records
-      }).finally(() => {
-        // 这里是无论成功或失败都会执行的方法，在这里关闭loading
-        this.table1.loading = false
-      })
-    },
-    // 加载table2（子表）的数据，根据主表的id进行查询
-    loadTable2Data() {
-      // 如果主表没有选择，则不查询
-      let selectedRows = this.table1.selectedRows
-      if (!selectedRows || selectedRows.length === 0) {
-        this.table2.pagination.total = 0
-        this.table2.dataSource = []
-        return
-      } else if (this.table1.lastRow == null) {
-        this.table1.lastRow = selectedRows[selectedRows.length - 1]
-      }
-      let formData = {
-        parentId: this.table1.lastRow.id,
-        pageNo: this.table2.pagination.current,
-        pageSize: this.table2.pagination.pageSize,
-      }
-      this.table2.loading = true
-      defHttp.get({
-        url: this.url.getData,
-        params: formData,
-      }).then(result => {
-        this.table2.pagination.total = result.total
-        this.table2.dataSource = result.records
-      }).finally(() => {
-        this.table2.loading = false
-      })
-    },
-
-    // table1【主表】当分页参数变化时触发的事件
-    handleTable1PageChange(event) {
-      // 重新赋值
-      this.table1.pagination.current = event.current
-      this.table1.pagination.pageSize = event.pageSize
-      // 查询数据
-      this.loadTable1Data()
-      // 分页后重置选择
-      this.table1.selectedRows = []
-      this.loadTable2Data()
-    },
-
-    // table2【子表】当分页参数变化时触发的事件
-    handleTable2PageChange(event) {
-      // 重新赋值
-      this.table1.pagination.current = event.current
-      this.table1.pagination.pageSize = event.pageSize
-      // 查询数据
-      this.loadTable2Data()
-    },
-
-    // table1【主表】当选择的行变化时触发的事件
-    handleTable1SelectRowChange(event) {
-      this.handleTableSelectRowChange(this.table1, event)
-    },
-
-    /** 公共方法：处理表格选中变化事件 */
-    handleTableSelectRowChange(table, event) {
-      let {row, action, selectedRows, $table} = event
-      // 获取最后一个选中的
-      let lastSelected = selectedRows[selectedRows.length - 1]
-      if (action === 'selected') {
-        table.lastRow = row
-      } else if (action === 'selected-all') {
-        // 取消全选
-        if (selectedRows.length === 0) {
-          table.lastRow = null
-        } else if (!table.lastRow) {
-          table.lastRow = lastSelected
+      // 加载table2（子表）的数据，根据主表的id进行查询
+      loadTable2Data() {
+        // 如果主表没有选择，则不查询
+        let selectedRows = this.table1.selectedRows;
+        if (!selectedRows || selectedRows.length === 0) {
+          this.table2.pagination.total = 0;
+          this.table2.dataSource = [];
+          return;
+        } else if (this.table1.lastRow == null) {
+          this.table1.lastRow = selectedRows[selectedRows.length - 1];
         }
-      } else if (action === 'unselected' && row === table.lastRow) {
-        table.lastRow = lastSelected
-      }
-      $table.setCurrentRow(table.lastRow)
-      table.selectedRows = selectedRows
-    },
+        let formData = {
+          parentId: this.table1.lastRow.id,
+          pageNo: this.table2.pagination.current,
+          pageSize: this.table2.pagination.pageSize,
+        };
+        this.table2.loading = true;
+        defHttp
+          .get({
+            url: this.url.getData,
+            params: formData,
+          })
+          .then((result) => {
+            this.table2.pagination.total = result.total;
+            this.table2.dataSource = result.records;
+          })
+          .finally(() => {
+            this.table2.loading = false;
+          });
+      },
 
-  },
-}
+      // table1【主表】当分页参数变化时触发的事件
+      handleTable1PageChange(event) {
+        // 重新赋值
+        this.table1.pagination.current = event.current;
+        this.table1.pagination.pageSize = event.pageSize;
+        // 查询数据
+        this.loadTable1Data();
+        // 分页后重置选择
+        this.table1.selectedRows = [];
+        this.loadTable2Data();
+      },
+
+      // table2【子表】当分页参数变化时触发的事件
+      handleTable2PageChange(event) {
+        // 重新赋值
+        this.table1.pagination.current = event.current;
+        this.table1.pagination.pageSize = event.pageSize;
+        // 查询数据
+        this.loadTable2Data();
+      },
+
+      // table1【主表】当选择的行变化时触发的事件
+      handleTable1SelectRowChange(event) {
+        this.handleTableSelectRowChange(this.table1, event);
+      },
+
+      /** 公共方法：处理表格选中变化事件 */
+      handleTableSelectRowChange(table, event) {
+        let { row, action, selectedRows, $table } = event;
+        // 获取最后一个选中的
+        let lastSelected = selectedRows[selectedRows.length - 1];
+        if (action === 'selected') {
+          table.lastRow = row;
+        } else if (action === 'selected-all') {
+          // 取消全选
+          if (selectedRows.length === 0) {
+            table.lastRow = null;
+          } else if (!table.lastRow) {
+            table.lastRow = lastSelected;
+          }
+        } else if (action === 'unselected' && row === table.lastRow) {
+          table.lastRow = lastSelected;
+        }
+        $table.setCurrentRow(table.lastRow);
+        table.selectedRows = selectedRows;
+      },
+    },
+  };
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template4.vue b/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template4.vue
index 2b01b95..67f2411 100644
--- a/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template4.vue
+++ b/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template4.vue
@@ -1,346 +1,340 @@
 <template>
   <a-card :bordered="false">
-
     <a-row :gutter="8">
       <a-col :span="12">
         <!-- 左上父 -->
         <JVxeTable
-            toolbar
-            rowNumber
-            rowSelection
-            clickSelectRow
-            highlightCurrentRow
-            :radioConfig="{highlight: false}"
-            :checkboxConfig="{highlight: false}"
-            :height="340"
-            :loading="table1.loading"
-            :columns="table1.columns"
-            :dataSource="table1.dataSource"
-            :pagination="table1.pagination"
-            style="margin-bottom: 8px;"
-            @pageChange="handleTable1PageChange"
-            @selectRowChange="handleTable1SelectRowChange"
+          toolbar
+          rowNumber
+          rowSelection
+          clickSelectRow
+          highlightCurrentRow
+          :radioConfig="{ highlight: false }"
+          :checkboxConfig="{ highlight: false }"
+          :height="340"
+          :loading="table1.loading"
+          :columns="table1.columns"
+          :dataSource="table1.dataSource"
+          :pagination="table1.pagination"
+          style="margin-bottom: 8px"
+          @pageChange="handleTable1PageChange"
+          @selectRowChange="handleTable1SelectRowChange"
         />
         <!-- 左下子 -->
         <JVxeTable
-            toolbar
-            rowNumber
-            rowSelection
-            clickSelectRow
-            :height="350"
-            :loading="table2.loading"
-            :columns="table2.columns"
-            :dataSource="table2.dataSource"
-            :pagination="table2.pagination"
-            @pageChange="handleTable2PageChange"
+          toolbar
+          rowNumber
+          rowSelection
+          clickSelectRow
+          :height="350"
+          :loading="table2.loading"
+          :columns="table2.columns"
+          :dataSource="table2.dataSource"
+          :pagination="table2.pagination"
+          @pageChange="handleTable2PageChange"
         />
       </a-col>
       <!-- 左侧父选择的数据展示在这里 -->
       <a-col :span="12">
         <!-- 右上父 -->
         <JVxeTable
-            rowNumber
-            rowSelection
-            clickSelectRow
-            highlightCurrentRow
-            :radioConfig="{highlight: false}"
-            :checkboxConfig="{highlight: false}"
-            :height="340"
-            :columns="table1.columns"
-            :dataSource="table1.selectedRows"
-            style="margin: 52px 0 8px;"
-            @selectRowChange="handleTable3SelectRowChange"
+          rowNumber
+          rowSelection
+          clickSelectRow
+          highlightCurrentRow
+          :radioConfig="{ highlight: false }"
+          :checkboxConfig="{ highlight: false }"
+          :height="340"
+          :columns="table1.columns"
+          :dataSource="table1.selectedRows"
+          style="margin: 52px 0 8px"
+          @selectRowChange="handleTable3SelectRowChange"
         />
         <!-- 右下子 -->
         <JVxeTable
-            toolbar
-            rowNumber
-            rowSelection
-            clickSelectRow
-            :height="350"
-            :loading="table4.loading"
-            :columns="table4.columns"
-            :dataSource="table4.dataSource"
-            :pagination="table4.pagination"
-            style="margin: 48px 0 0;"
+          toolbar
+          rowNumber
+          rowSelection
+          clickSelectRow
+          :height="350"
+          :loading="table4.loading"
+          :columns="table4.columns"
+          :dataSource="table4.dataSource"
+          :pagination="table4.pagination"
+          style="margin: 48px 0 0"
         />
       </a-col>
     </a-row>
-
   </a-card>
 </template>
 
 <script>
-import {defHttp} from '/@/utils/http/axios'
-import {JVxeTypes} from '/@/components/jeecg/JVxeTable/types'
+  import { defHttp } from '/@/utils/http/axios';
+  import { JVxeTypes } from '/@/components/jeecg/JVxeTable/types';
 
-export default {
-  name: 'Template4',
-  data() {
-    return {
-      table1: {
-        // 是否正在加载
-        loading: false,
-        // 分页器参数
-        pagination: {
-          // 当前页码
-          current: 1,
-          // 每页的条数
-          pageSize: 200,
-          // 可切换的条数
-          pageSizeOptions: ['10', '20', '30', '100', '200'],
-          // 数据总数（目前并不知道真实的总数，所以先填写0，在后台查出来后再赋值）
-          total: 0,
+  export default {
+    name: 'Template4',
+    data() {
+      return {
+        table1: {
+          // 是否正在加载
+          loading: false,
+          // 分页器参数
+          pagination: {
+            // 当前页码
+            current: 1,
+            // 每页的条数
+            pageSize: 200,
+            // 可切换的条数
+            pageSizeOptions: ['10', '20', '30', '100', '200'],
+            // 数据总数（目前并不知道真实的总数，所以先填写0，在后台查出来后再赋值）
+            total: 0,
+          },
+          // 最后选中的行
+          lastRow: null,
+          // 选择的行
+          selectedRows: [],
+          // 数据源，控制表格的数据
+          dataSource: [],
+          // 列配置，控制表格显示的列
+          columns: [
+            { key: 'num', title: '序号', width: '80px' },
+            {
+              // 字段key，跟后台数据的字段名匹配
+              key: 'ship_name',
+              // 列的标题
+              title: '船名',
+              // 列的宽度
+              width: '180px',
+              // 如果加上了该属性，就代表当前单元格是可编辑的，type就是表单的类型，input就是简单的输入框
+              type: JVxeTypes.input,
+            },
+            { key: 'call', title: '呼叫', width: '80px', type: JVxeTypes.input },
+            { key: 'len', title: '长', width: '80px', type: JVxeTypes.input },
+            { key: 'ton', title: '吨', width: '120px', type: JVxeTypes.input },
+            { key: 'payer', title: '付款方', width: '120px', type: JVxeTypes.input },
+            { key: 'count', title: '数', width: '40px' },
+            {
+              key: 'company',
+              title: '公司',
+              // 最小宽度，与宽度不同的是，这个不是固定的宽度，如果表格有多余的空间，会平均分配给设置了 minWidth 的列
+              // 如果要做占满表格的列可以这么写
+              minWidth: '180px',
+              type: JVxeTypes.input,
+            },
+            { key: 'trend', title: '动向', width: '120px', type: JVxeTypes.input },
+          ],
         },
-        // 最后选中的行
-        lastRow: null,
-        // 选择的行
-        selectedRows: [],
-        // 数据源，控制表格的数据
-        dataSource: [],
-        // 列配置，控制表格显示的列
-        columns: [
-          {key: 'num', title: '序号', width: '80px'},
-          {
-            // 字段key，跟后台数据的字段名匹配
-            key: 'ship_name',
-            // 列的标题
-            title: '船名',
-            // 列的宽度
-            width: '180px',
-            // 如果加上了该属性，就代表当前单元格是可编辑的，type就是表单的类型，input就是简单的输入框
-            type: JVxeTypes.input,
-          },
-          {key: 'call', title: '呼叫', width: '80px', type: JVxeTypes.input},
-          {key: 'len', title: '长', width: '80px', type: JVxeTypes.input},
-          {key: 'ton', title: '吨', width: '120px', type: JVxeTypes.input},
-          {key: 'payer', title: '付款方', width: '120px', type: JVxeTypes.input},
-          {key: 'count', title: '数', width: '40px'},
-          {
-            key: 'company',
-            title: '公司',
-            // 最小宽度，与宽度不同的是，这个不是固定的宽度，如果表格有多余的空间，会平均分配给设置了 minWidth 的列
-            // 如果要做占满表格的列可以这么写
-            minWidth: '180px',
-            type: JVxeTypes.input,
-          },
-          {key: 'trend', title: '动向', width: '120px', type: JVxeTypes.input},
-        ],
+        // 子级表的配置信息 （配置和主表的完全一致，就不写冗余的注释了）
+        table2: {
+          loading: false,
+          pagination: { current: 1, pageSize: 200, pageSizeOptions: ['100', '200'], total: 0 },
+          selectedRows: [],
+          dataSource: [],
+          columns: [
+            { key: 'dd_num', title: '调度序号', width: '120px' },
+            { key: 'tug', title: '拖轮', width: '180px', type: JVxeTypes.input },
+            { key: 'work_start_time', title: '作业开始时间', width: '180px', type: JVxeTypes.input },
+            { key: 'work_stop_time', title: '作业结束时间', width: '180px', type: JVxeTypes.input },
+            { key: 'type', title: '船舶分类', width: '120px', type: JVxeTypes.input },
+            { key: 'port_area', title: '所属港区', width: '120px', type: JVxeTypes.input },
+          ],
+        },
+        table3: {
+          // 最后选中的行
+          lastRow: null,
+          // 选择的行
+          selectedRows: [],
+        },
+        table4: {
+          loading: false,
+          pagination: { current: 1, pageSize: 200, pageSizeOptions: ['100', '200'], total: 0 },
+          selectedRows: [],
+          dataSource: [],
+          columns: [
+            { key: 'dd_num', title: '调度序号', width: '120px' },
+            { key: 'tug', title: '拖轮', width: '180px', type: JVxeTypes.input },
+            { key: 'work_start_time', title: '作业开始时间', width: '180px', type: JVxeTypes.input },
+            { key: 'work_stop_time', title: '作业结束时间', width: '180px', type: JVxeTypes.input },
+            { key: 'type', title: '船舶分类', width: '120px', type: JVxeTypes.input },
+            { key: 'port_area', title: '所属港区', width: '120px', type: JVxeTypes.input },
+          ],
+        },
+        // 查询url地址
+        url: {
+          getData: '/mock/vxe/getData',
+        },
+      };
+    },
+    // 监听器
+    watch: {
+      // 监听table1 左上【主表】选择的数据发生了变化
+      ['table1.lastRow']() {
+        this.loadTable2Data();
       },
-      // 子级表的配置信息 （配置和主表的完全一致，就不写冗余的注释了）
-      table2: {
-        loading: false,
-        pagination: {current: 1, pageSize: 200, pageSizeOptions: ['100', '200'], total: 0},
-        selectedRows: [],
-        dataSource: [],
-        columns: [
-          {key: 'dd_num', title: '调度序号', width: '120px'},
-          {key: 'tug', title: '拖轮', width: '180px', type: JVxeTypes.input},
-          {key: 'work_start_time', title: '作业开始时间', width: '180px', type: JVxeTypes.input},
-          {key: 'work_stop_time', title: '作业结束时间', width: '180px', type: JVxeTypes.input},
-          {key: 'type', title: '船舶分类', width: '120px', type: JVxeTypes.input},
-          {key: 'port_area', title: '所属港区', width: '120px', type: JVxeTypes.input},
-        ],
+      // 监听table3 右上【主表】选择的数据发生了变化
+      ['table3.lastRow']() {
+        this.loadTable4Data();
       },
-      table3: {
-        // 最后选中的行
-        lastRow: null,
-        // 选择的行
-        selectedRows: [],
+    },
+    created() {
+      this.loadTable1Data();
+    },
+    methods: {
+      // 加载table1左上【主表】的数据
+      loadTable1Data() {
+        // 封装查询条件
+        let formData = {
+          pageNo: this.table1.pagination.current,
+          pageSize: this.table1.pagination.pageSize,
+        };
+        // 调用查询数据接口
+        this.table1.loading = true;
+        defHttp
+          .get({
+            url: this.url.getData,
+            params: formData,
+          })
+          .then((result) => {
+            // 后台查询回来的 total，数据总数量
+            this.table1.pagination.total = result.total;
+            // 将查询的数据赋值给 dataSource
+            this.table1.dataSource = result.records;
+            // 重置选择
+            this.table1.selectedRows = [];
+          })
+          .finally(() => {
+            // 这里是无论成功或失败都会执行的方法，在这里关闭loading
+            this.table1.loading = false;
+          });
       },
-      table4: {
-        loading: false,
-        pagination: {current: 1, pageSize: 200, pageSizeOptions: ['100', '200'], total: 0},
-        selectedRows: [],
-        dataSource: [],
-        columns: [
-          {key: 'dd_num', title: '调度序号', width: '120px'},
-          {key: 'tug', title: '拖轮', width: '180px', type: JVxeTypes.input},
-          {key: 'work_start_time', title: '作业开始时间', width: '180px', type: JVxeTypes.input},
-          {key: 'work_stop_time', title: '作业结束时间', width: '180px', type: JVxeTypes.input},
-          {key: 'type', title: '船舶分类', width: '120px', type: JVxeTypes.input},
-          {key: 'port_area', title: '所属港区', width: '120px', type: JVxeTypes.input},
-        ],
+
+      // 当table1左上【主表】分页参数变化时触发的事件
+      handleTable1PageChange(event) {
+        // 重新赋值
+        this.table1.pagination.current = event.current;
+        this.table1.pagination.pageSize = event.pageSize;
+        // 查询数据
+        this.loadTable1Data();
       },
-      // 查询url地址
-      url: {
-        getData: '/mock/vxe/getData',
+
+      // table1左上【主表】当选择的行变化时触发的事件
+      handleTable1SelectRowChange(event) {
+        this.handleTableSelectRowChange(this.table1, event);
       },
-    }
-  },
-  // 监听器
-  watch: {
-    // 监听table1 左上【主表】选择的数据发生了变化
-    ['table1.lastRow']() {
-      this.loadTable2Data()
-    },
-    // 监听table3 右上【主表】选择的数据发生了变化
-    ['table3.lastRow']() {
-      this.loadTable4Data()
-    },
 
-  },
-  created() {
-    this.loadTable1Data()
-  },
-  methods: {
-
-    // 加载table1左上【主表】的数据
-    loadTable1Data() {
-      // 封装查询条件
-      let formData = {
-        pageNo: this.table1.pagination.current,
-        pageSize: this.table1.pagination.pageSize,
-      }
-      // 调用查询数据接口
-      this.table1.loading = true
-      defHttp.get({
-        url: this.url.getData,
-        params: formData,
-      }).then(result => {
-        // 后台查询回来的 total，数据总数量
-        this.table1.pagination.total = result.total
-        // 将查询的数据赋值给 dataSource
-        this.table1.dataSource = result.records
-        // 重置选择
-        this.table1.selectedRows = []
-      }).finally(() => {
-        // 这里是无论成功或失败都会执行的方法，在这里关闭loading
-        this.table1.loading = false
-      })
-    },
-
-
-    // 当table1左上【主表】分页参数变化时触发的事件
-    handleTable1PageChange(event) {
-      // 重新赋值
-      this.table1.pagination.current = event.current
-      this.table1.pagination.pageSize = event.pageSize
-      // 查询数据
-      this.loadTable1Data()
-    },
-
-
-    // table1左上【主表】当选择的行变化时触发的事件
-    handleTable1SelectRowChange(event) {
-      this.handleTableSelectRowChange(this.table1, event)
-    },
-
-
-    // 加载table2左下【子表】的数据，根据主表的id进行查询
-    loadTable2Data() {
-      // 如果主表没有选择，则不查询
-      let selectedRows = this.table1.selectedRows
-      if (!selectedRows || selectedRows.length === 0) {
-        this.table2.pagination.total = 0
-        this.table2.dataSource = []
-        this.table2.selectedRows = []
-        return
-      } else if (this.table1.lastRow == null) {
-        this.table1.lastRow = selectedRows[selectedRows.length - 1]
-      }
-      let formData = {
-        parentId: this.table1.lastRow.id,
-        pageNo: this.table2.pagination.current,
-        pageSize: this.table2.pagination.pageSize,
-      }
-      this.table2.loading = true
-      defHttp.get({
-        url: this.url.getData,
-        params: formData,
-      }).then(result => {
-        this.table2.pagination.total = result.total
-        this.table2.dataSource = result.records
-        this.table2.selectedRows = []
-
-      }).finally(() => {
-        this.table2.loading = false
-      })
-    },
-
-    // 当table2左下【子表】分页参数变化时触发的事件
-    handleTable2PageChange(event) {
-      // 重新赋值
-      this.table2.pagination.current = event.current
-      this.table2.pagination.pageSize = event.pageSize
-      // 查询数据
-      this.loadTable2Data()
-    },
-
-
-    // table3右上【主表】当选择的行变化时触发的事件
-    handleTable3SelectRowChange(event) {
-      this.handleTableSelectRowChange(this.table3, event)
-    },
-
-
-    // 加载table4右下【子表】的数据，根据主表的id进行查询
-    loadTable4Data() {
-      let parentIds = []
-      // 如果主表没有选择，则不查询
-      let selectedRows = this.table3.selectedRows
-      if (!selectedRows || selectedRows.length === 0) {
-        this.table4.pagination.total = 0
-        this.table4.dataSource = []
-        this.table4.selectedRows = []
-        return
-      } else if (this.table3.lastRow == null) {
-        this.table3.lastRow = selectedRows[selectedRows.length - 1]
-      }
-      let formData = {
-        parentId: this.table3.lastRow.id,
-        pageNo: this.table4.pagination.current,
-        pageSize: this.table4.pagination.pageSize,
-      }
-      this.table4.loading = true
-      defHttp.get({
-        url: this.url.getData,
-        params: formData,
-      }).then(result => {
-        this.table4.pagination.total = result.total
-        this.table4.dataSource = result.records
-        this.table4.selectedRows = []
-
-      }).finally(() => {
-        this.table4.loading = false
-      })
-    },
-
-
-    // 当table4右下【子表】分页参数变化时触发的事件
-    handleTable4PageChange(event) {
-      // 重新赋值
-      this.table4.pagination.current = event.current
-      this.table4.pagination.pageSize = event.pageSize
-      // 查询数据
-      this.loadTable4Data()
-    },
-
-    /** 公共方法：处理表格选中变化事件 */
-    handleTableSelectRowChange(table, event) {
-      let {row, action, selectedRows, $table} = event
-      // 获取最后一个选中的
-      let lastSelected = selectedRows[selectedRows.length - 1]
-      if (action === 'selected') {
-        table.lastRow = row
-      } else if (action === 'selected-all') {
-        // 取消全选
-        if (selectedRows.length === 0) {
-          table.lastRow = null
-        } else if (!table.lastRow) {
-          table.lastRow = lastSelected
+      // 加载table2左下【子表】的数据，根据主表的id进行查询
+      loadTable2Data() {
+        // 如果主表没有选择，则不查询
+        let selectedRows = this.table1.selectedRows;
+        if (!selectedRows || selectedRows.length === 0) {
+          this.table2.pagination.total = 0;
+          this.table2.dataSource = [];
+          this.table2.selectedRows = [];
+          return;
+        } else if (this.table1.lastRow == null) {
+          this.table1.lastRow = selectedRows[selectedRows.length - 1];
         }
-      } else if (action === 'unselected' && row === table.lastRow) {
-        table.lastRow = lastSelected
-      }
-      $table.setCurrentRow(table.lastRow)
-      table.selectedRows = selectedRows
-    },
+        let formData = {
+          parentId: this.table1.lastRow.id,
+          pageNo: this.table2.pagination.current,
+          pageSize: this.table2.pagination.pageSize,
+        };
+        this.table2.loading = true;
+        defHttp
+          .get({
+            url: this.url.getData,
+            params: formData,
+          })
+          .then((result) => {
+            this.table2.pagination.total = result.total;
+            this.table2.dataSource = result.records;
+            this.table2.selectedRows = [];
+          })
+          .finally(() => {
+            this.table2.loading = false;
+          });
+      },
 
-  },
-}
+      // 当table2左下【子表】分页参数变化时触发的事件
+      handleTable2PageChange(event) {
+        // 重新赋值
+        this.table2.pagination.current = event.current;
+        this.table2.pagination.pageSize = event.pageSize;
+        // 查询数据
+        this.loadTable2Data();
+      },
+
+      // table3右上【主表】当选择的行变化时触发的事件
+      handleTable3SelectRowChange(event) {
+        this.handleTableSelectRowChange(this.table3, event);
+      },
+
+      // 加载table4右下【子表】的数据，根据主表的id进行查询
+      loadTable4Data() {
+        let parentIds = [];
+        // 如果主表没有选择，则不查询
+        let selectedRows = this.table3.selectedRows;
+        if (!selectedRows || selectedRows.length === 0) {
+          this.table4.pagination.total = 0;
+          this.table4.dataSource = [];
+          this.table4.selectedRows = [];
+          return;
+        } else if (this.table3.lastRow == null) {
+          this.table3.lastRow = selectedRows[selectedRows.length - 1];
+        }
+        let formData = {
+          parentId: this.table3.lastRow.id,
+          pageNo: this.table4.pagination.current,
+          pageSize: this.table4.pagination.pageSize,
+        };
+        this.table4.loading = true;
+        defHttp
+          .get({
+            url: this.url.getData,
+            params: formData,
+          })
+          .then((result) => {
+            this.table4.pagination.total = result.total;
+            this.table4.dataSource = result.records;
+            this.table4.selectedRows = [];
+          })
+          .finally(() => {
+            this.table4.loading = false;
+          });
+      },
+
+      // 当table4右下【子表】分页参数变化时触发的事件
+      handleTable4PageChange(event) {
+        // 重新赋值
+        this.table4.pagination.current = event.current;
+        this.table4.pagination.pageSize = event.pageSize;
+        // 查询数据
+        this.loadTable4Data();
+      },
+
+      /** 公共方法：处理表格选中变化事件 */
+      handleTableSelectRowChange(table, event) {
+        let { row, action, selectedRows, $table } = event;
+        // 获取最后一个选中的
+        let lastSelected = selectedRows[selectedRows.length - 1];
+        if (action === 'selected') {
+          table.lastRow = row;
+        } else if (action === 'selected-all') {
+          // 取消全选
+          if (selectedRows.length === 0) {
+            table.lastRow = null;
+          } else if (!table.lastRow) {
+            table.lastRow = lastSelected;
+          }
+        } else if (action === 'unselected' && row === table.lastRow) {
+          table.lastRow = lastSelected;
+        }
+        $table.setCurrentRow(table.lastRow);
+        table.selectedRows = selectedRows;
+      },
+    },
+  };
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template5.vue b/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template5.vue
index 5cc48c2..51a6945 100644
--- a/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template5.vue
+++ b/src/views/demo/jeecg/JVxeTableDemo/layout-demo/Template5.vue
@@ -1,224 +1,212 @@
 <template>
   <a-card :bordered="false">
-
     <a-row :gutter="8">
       <a-col :span="6">
         <!-- 加上 show-line 属性后，展开收起图标自动变成 +- 样式 -->
         <a-tree
-            class="template-5-tree"
-            :tree-data="treeData"
-            show-icon
-            show-line
-            :expandedKeys="treeExpandedKeys"
-            :selectedKeys="[pagination.current]"
-            @expand="handleTreeExpand"
-            @select="handleTreeSelect"
+          class="template-5-tree"
+          :tree-data="treeData"
+          show-icon
+          show-line
+          :expandedKeys="treeExpandedKeys"
+          :selectedKeys="[pagination.current]"
+          @expand="handleTreeExpand"
+          @select="handleTreeSelect"
         >
           <!-- 自定义子节点图标 -->
-          <a-icon slot="myIcon" type="unordered-list" style="color:#0c8fcf;"/>
+          <a-icon slot="myIcon" type="unordered-list" style="color: #0c8fcf" />
         </a-tree>
       </a-col>
       <a-col :span="18">
-        <JVxeTable
-            rowNumber
-            rowSelection
-            :height="750"
-            :loading="loading"
-            :columns="columns"
-            :dataSource="dataSource"
-            :pagination="pagination"
-            @pageChange="handleTablePageChange"
-        />
+        <JVxeTable rowNumber rowSelection :height="750" :loading="loading" :columns="columns" :dataSource="dataSource" :pagination="pagination" @pageChange="handleTablePageChange" />
       </a-col>
     </a-row>
-
-
   </a-card>
 </template>
 
 <script>
-import {defHttp} from '/@/utils/http/axios'
-import {JVxeTypes} from '/@/components/jeecg/JVxeTable/types'
+  import { defHttp } from '/@/utils/http/axios';
+  import { JVxeTypes } from '/@/components/jeecg/JVxeTable/types';
 
-// 【多种布局模板】左侧为树，右侧为行编辑
-export default {
-  name: 'Template5',
-  data() {
-    return {
-      // 是否正在加载
-      loading: false,
-      // 分页器参数
-      pagination: {
-        // 当前页码
-        current: 1,
-        // 每页的条数
-        pageSize: 50,
-        // 可切换的条数
-        pageSizeOptions: ['50'],
-        // 数据总数（目前并不知道真实的总数，所以先填写0，在后台查出来后再赋值）
-        total: 0,
+  // 【多种布局模板】左侧为树，右侧为行编辑
+  export default {
+    name: 'Template5',
+    data() {
+      return {
+        // 是否正在加载
+        loading: false,
+        // 分页器参数
+        pagination: {
+          // 当前页码
+          current: 1,
+          // 每页的条数
+          pageSize: 50,
+          // 可切换的条数
+          pageSizeOptions: ['50'],
+          // 数据总数（目前并不知道真实的总数，所以先填写0，在后台查出来后再赋值）
+          total: 0,
+        },
+        // 选择的行
+        selectedRows: [],
+        // 数据源，控制表格的数据
+        dataSource: [],
+        // 列配置，控制表格显示的列
+        columns: [
+          { key: 'num', title: '序号', width: '80px' },
+          {
+            // 字段key，跟后台数据的字段名匹配
+            key: 'ship_name',
+            // 列的标题
+            title: '船名',
+            // 列的宽度
+            width: '180px',
+            // 如果加上了该属性，就代表当前单元格是可编辑的，type就是表单的类型，input就是简单的输入框
+            type: JVxeTypes.input,
+          },
+          { key: 'call', title: '呼叫', width: '80px', type: JVxeTypes.input },
+          { key: 'len', title: '长', width: '80px', type: JVxeTypes.input },
+          { key: 'ton', title: '吨', width: '120px', type: JVxeTypes.input },
+          { key: 'payer', title: '付款方', width: '120px', type: JVxeTypes.input },
+          { key: 'count', title: '数', width: '40px' },
+          {
+            key: 'company',
+            title: '公司',
+            // 最小宽度，与宽度不同的是，这个不是固定的宽度，如果表格有多余的空间，会平均分配给设置了 minWidth 的列
+            // 如果要做占满表格的列可以这么写
+            minWidth: '180px',
+            type: JVxeTypes.input,
+          },
+          { key: 'trend', title: '动向', width: '120px', type: JVxeTypes.input },
+        ],
+        // 树的数据，这里模拟分页固定数据，实际情况应该是后台查出来的数据
+        treeData: [
+          // 第1级数据
+          {
+            title: '1-10页',
+            key: '1-10',
+            // 第2级数据
+            children: [
+              { title: '第 1 页', key: 1, slots: { icon: 'myIcon' } },
+              { title: '第 2 页', key: 2, slots: { icon: 'myIcon' } },
+              {
+                title: '第 3 页',
+                key: 3,
+                slots: { icon: 'myIcon' },
+                // 第3级数据
+                children: [
+                  { title: '第 333 页', key: 333, slots: { icon: 'myIcon' } },
+                  { title: '第 444 页', key: 444, slots: { icon: 'myIcon' } },
+                  { title: '第 555 页', key: 555, slots: { icon: 'myIcon' } },
+                  // 第4第5级以此类推，加上 children 属性即可
+                ],
+              },
+              { title: '第 4 页', key: 4, slots: { icon: 'myIcon' } },
+              { title: '第 5 页', key: 5, slots: { icon: 'myIcon' } },
+              { title: '第 6 页', key: 6, slots: { icon: 'myIcon' } },
+              { title: '第 7 页', key: 7, slots: { icon: 'myIcon' } },
+              { title: '第 8 页', key: 8, slots: { icon: 'myIcon' } },
+              { title: '第 9 页', key: 9, slots: { icon: 'myIcon' } },
+              { title: '第 10 页', key: 10, slots: { icon: 'myIcon' } },
+            ],
+            slots: { icon: 'myIcon' },
+          },
+          {
+            title: '11-20页',
+            key: '11-20',
+            children: [
+              { title: '第 11 页', key: 11, slots: { icon: 'myIcon' } },
+              { title: '第 12 页', key: 12, slots: { icon: 'myIcon' } },
+              { title: '第 13 页', key: 13, slots: { icon: 'myIcon' } },
+              { title: '第 14 页', key: 14, slots: { icon: 'myIcon' } },
+              { title: '第 15 页', key: 15, slots: { icon: 'myIcon' } },
+              { title: '第 16 页', key: 16, slots: { icon: 'myIcon' } },
+              { title: '第 17 页', key: 17, slots: { icon: 'myIcon' } },
+              { title: '第 18 页', key: 18, slots: { icon: 'myIcon' } },
+              { title: '第 19 页', key: 19, slots: { icon: 'myIcon' } },
+              { title: '第 20 页', key: 20, slots: { icon: 'myIcon' } },
+            ],
+            slots: { icon: 'myIcon' },
+          },
+        ],
+        // 树展开的列，默认 1-10
+        treeExpandedKeys: ['1-10'],
+        // 查询url地址
+        url: {
+          getData: '/mock/vxe/getData',
+        },
+      };
+    },
+    created() {
+      this.loadData();
+    },
+    methods: {
+      // 加载行编辑的数据
+      loadData() {
+        // 封装查询条件
+        let formData = {
+          pageNo: this.pagination.current,
+          pageSize: this.pagination.pageSize,
+        };
+        // 调用查询数据接口
+        this.loading = true;
+        defHttp
+          .get({
+            url: this.url.getData,
+            params: formData,
+          })
+          .then((result) => {
+            // 后台查询回来的 total，数据总数量
+            this.pagination.total = result.total;
+            // 将查询的数据赋值给 dataSource
+            this.dataSource = result.records;
+            // 重置选择
+            this.selectedRows = [];
+          })
+          .finally(() => {
+            // 这里是无论成功或失败都会执行的方法，在这里关闭loading
+            this.loading = false;
+          });
       },
-      // 选择的行
-      selectedRows: [],
-      // 数据源，控制表格的数据
-      dataSource: [],
-      // 列配置，控制表格显示的列
-      columns: [
-        {key: 'num', title: '序号', width: '80px'},
-        {
-          // 字段key，跟后台数据的字段名匹配
-          key: 'ship_name',
-          // 列的标题
-          title: '船名',
-          // 列的宽度
-          width: '180px',
-          // 如果加上了该属性，就代表当前单元格是可编辑的，type就是表单的类型，input就是简单的输入框
-          type: JVxeTypes.input,
-        },
-        {key: 'call', title: '呼叫', width: '80px', type: JVxeTypes.input},
-        {key: 'len', title: '长', width: '80px', type: JVxeTypes.input},
-        {key: 'ton', title: '吨', width: '120px', type: JVxeTypes.input},
-        {key: 'payer', title: '付款方', width: '120px', type: JVxeTypes.input},
-        {key: 'count', title: '数', width: '40px'},
-        {
-          key: 'company',
-          title: '公司',
-          // 最小宽度，与宽度不同的是，这个不是固定的宽度，如果表格有多余的空间，会平均分配给设置了 minWidth 的列
-          // 如果要做占满表格的列可以这么写
-          minWidth: '180px',
-          type: JVxeTypes.input,
-        },
-        {key: 'trend', title: '动向', width: '120px', type: JVxeTypes.input},
-      ],
-      // 树的数据，这里模拟分页固定数据，实际情况应该是后台查出来的数据
-      treeData: [
-        // 第1级数据
-        {
-          title: '1-10页',
-          key: '1-10',
-          // 第2级数据
-          children: [
-            {title: '第 1 页', key: 1, slots: {icon: 'myIcon'}},
-            {title: '第 2 页', key: 2, slots: {icon: 'myIcon'}},
-            {
-              title: '第 3 页',
-              key: 3,
-              slots: {icon: 'myIcon'},
-              // 第3级数据
-              children: [
-                {title: '第 333 页', key: 333, slots: {icon: 'myIcon'}},
-                {title: '第 444 页', key: 444, slots: {icon: 'myIcon'}},
-                {title: '第 555 页', key: 555, slots: {icon: 'myIcon'}},
-                // 第4第5级以此类推，加上 children 属性即可
-              ],
-            },
-            {title: '第 4 页', key: 4, slots: {icon: 'myIcon'}},
-            {title: '第 5 页', key: 5, slots: {icon: 'myIcon'}},
-            {title: '第 6 页', key: 6, slots: {icon: 'myIcon'}},
-            {title: '第 7 页', key: 7, slots: {icon: 'myIcon'}},
-            {title: '第 8 页', key: 8, slots: {icon: 'myIcon'}},
-            {title: '第 9 页', key: 9, slots: {icon: 'myIcon'}},
-            {title: '第 10 页', key: 10, slots: {icon: 'myIcon'}},
-          ],
-          slots: {icon: 'myIcon'},
-        },
-        {
-          title: '11-20页',
-          key: '11-20',
-          children: [
-            {title: '第 11 页', key: 11, slots: {icon: 'myIcon'}},
-            {title: '第 12 页', key: 12, slots: {icon: 'myIcon'}},
-            {title: '第 13 页', key: 13, slots: {icon: 'myIcon'}},
-            {title: '第 14 页', key: 14, slots: {icon: 'myIcon'}},
-            {title: '第 15 页', key: 15, slots: {icon: 'myIcon'}},
-            {title: '第 16 页', key: 16, slots: {icon: 'myIcon'}},
-            {title: '第 17 页', key: 17, slots: {icon: 'myIcon'}},
-            {title: '第 18 页', key: 18, slots: {icon: 'myIcon'}},
-            {title: '第 19 页', key: 19, slots: {icon: 'myIcon'}},
-            {title: '第 20 页', key: 20, slots: {icon: 'myIcon'}},
-          ],
-          slots: {icon: 'myIcon'},
-        },
-      ],
-      // 树展开的列，默认 1-10
-      treeExpandedKeys: ['1-10'],
-      // 查询url地址
-      url: {
-        getData: '/mock/vxe/getData',
+
+      handleTablePageChange(event) {
+        // 重新赋值
+        this.pagination.current = event.current;
+        this.pagination.pageSize = event.pageSize;
+        // 查询数据
+        this.loadData();
+        // 判断树展开的key
+        if (event.current <= 10) {
+          this.treeExpandedKeys = ['1-10'];
+        } else {
+          this.treeExpandedKeys = ['11-20'];
+        }
       },
-    }
-  },
-  created() {
-    this.loadData()
-  },
-  methods: {
 
-    // 加载行编辑的数据
-    loadData() {
-      // 封装查询条件
-      let formData = {
-        pageNo: this.pagination.current,
-        pageSize: this.pagination.pageSize,
-      }
-      // 调用查询数据接口
-      this.loading = true
-      defHttp.get({
-        url: this.url.getData,
-        params: formData,
-      }).then(result => {
-        // 后台查询回来的 total，数据总数量
-        this.pagination.total = result.total
-        // 将查询的数据赋值给 dataSource
-        this.dataSource = result.records
-        // 重置选择
-        this.selectedRows = []
+      // 树被选择触发的事件
+      handleTreeSelect(selectedKeys) {
+        let key = selectedKeys[0];
+        if (typeof key === 'string') {
+          // 控制树展开为当前选择的列
+          this.treeExpandedKeys = selectedKeys;
+        } else {
+          this.pagination.current = key;
+          this.loadData();
+        }
+      },
 
-      }).finally(() => {
-        // 这里是无论成功或失败都会执行的方法，在这里关闭loading
-        this.loading = false
-      })
+      // 树被选择触发的事件
+      handleTreeExpand(expandedKeys) {
+        this.treeExpandedKeys = expandedKeys;
+      },
     },
-
-    handleTablePageChange(event) {
-      // 重新赋值
-      this.pagination.current = event.current
-      this.pagination.pageSize = event.pageSize
-      // 查询数据
-      this.loadData()
-      // 判断树展开的key
-      if (event.current <= 10) {
-        this.treeExpandedKeys = ['1-10']
-      } else {
-        this.treeExpandedKeys = ['11-20']
-      }
-    },
-
-    // 树被选择触发的事件
-    handleTreeSelect(selectedKeys) {
-      let key = selectedKeys[0]
-      if (typeof key === 'string') {
-        // 控制树展开为当前选择的列
-        this.treeExpandedKeys = selectedKeys
-      } else {
-        this.pagination.current = key
-        this.loadData()
-      }
-    },
-
-    // 树被选择触发的事件
-    handleTreeExpand(expandedKeys) {
-      this.treeExpandedKeys = expandedKeys
-    },
-
-  },
-}
+  };
 </script>
 
 <style lang="less">
-/** 隐藏文件小图标 */
-.template-5-tree.ant-tree {
-  li span.ant-tree-switcher.ant-tree-switcher-noop {
-    display: none;
+  /** 隐藏文件小图标 */
+  .template-5-tree.ant-tree {
+    li span.ant-tree-switcher.ant-tree-switcher-noop {
+      display: none;
+    }
   }
-}
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/demo/jeecg/JVxeTableDemo/layout-demo/index.vue b/src/views/demo/jeecg/JVxeTableDemo/layout-demo/index.vue
index cf38f32..15a8832 100644
--- a/src/views/demo/jeecg/JVxeTableDemo/layout-demo/index.vue
+++ b/src/views/demo/jeecg/JVxeTableDemo/layout-demo/index.vue
@@ -2,37 +2,34 @@
   <a-card :bordered="false">
     <a-tabs>
       <a-tab-pane tab="ERP布局模板" key="erp">
-        <erp-template/>
+        <erp-template />
       </a-tab-pane>
       <a-tab-pane tab="布局模板1" key="1">
-        <template1/>
+        <template1 />
       </a-tab-pane>
       <a-tab-pane tab="布局模板2" key="2">
-        <template2/>
+        <template2 />
       </a-tab-pane>
       <a-tab-pane tab="布局模板3" key="3">
-        <template3/>
+        <template3 />
       </a-tab-pane>
       <a-tab-pane tab="布局模板4" key="4">
-        <template4/>
+        <template4 />
       </a-tab-pane>
       <a-tab-pane tab="布局模板5" key="5">
-        <template5/>
+        <template5 />
       </a-tab-pane>
     </a-tabs>
   </a-card>
 </template>
 
 <script lang="ts" setup>
-import Template1 from './Template1.vue'
-import Template2 from './Template2.vue'
-import Template3 from './Template3.vue'
-import Template4 from './Template4.vue'
-import Template5 from './Template5.vue'
-import ErpTemplate from './ErpTemplate.vue'
-
+  import Template1 from './Template1.vue';
+  import Template2 from './Template2.vue';
+  import Template3 from './Template3.vue';
+  import Template4 from './Template4.vue';
+  import Template5 from './Template5.vue';
+  import ErpTemplate from './ErpTemplate.vue';
 </script>
 
-<style scoped>
-
-</style>
\ No newline at end of file
+<style scoped></style>
diff --git a/src/views/demo/jeecg/JeecgPdfView.vue b/src/views/demo/jeecg/JeecgPdfView.vue
index d0494db..0a009e9 100644
--- a/src/views/demo/jeecg/JeecgPdfView.vue
+++ b/src/views/demo/jeecg/JeecgPdfView.vue
@@ -1,97 +1,93 @@
 <template>
-    <a-card :bordered="false">
-        <a-row>
-            <!-- 左侧文件树 -->
-            <a-col :span="4" class="clName">
-                <a-tree
-                        :treeData="treeData"
-                        :defaultExpandAll="true"
-                        @select="onSelect"
-                        style="height: 500px;overflow-y: auto;">
-                </a-tree>
-            </a-col>
-            <!--右侧缩略图-->
-            <a-col :span="18">
-                <div v-for="(file, key) in dataSource" :key="key">
-                    <a-col :span="24">
-                        <a-divider orientation="left">{{ file.fileName }}</a-divider>
-                    </a-col>
-                    <!-- 预览区域 -->
-                    <a-col :span="24">
-                        <template v-if="file.filePdfPath">
-                            <div @click="pdfPreview(file.title)">
-                                <img style="width: 80px;height: 80px;" src="../../../assets/images/pdf4.jpg">
-                            </div>
-                        </template>
-                        <template v-else>
-                            (暂无材料，点击"选择文件"或"扫描上传"上传文件)
-                        </template>
-                    </a-col>
-                </div>
-            </a-col>
-        </a-row>
-        <div style="display: none">
-            <iframe id="pdfPreviewIframe" :src="url" frameborder="0" width="100%" height="550px" scrolling="auto"></iframe>
+  <a-card :bordered="false">
+    <a-row>
+      <!-- 左侧文件树 -->
+      <a-col :span="4" class="clName">
+        <a-tree :treeData="treeData" :defaultExpandAll="true" @select="onSelect" style="height: 500px; overflow-y: auto"> </a-tree>
+      </a-col>
+      <!--右侧缩略图-->
+      <a-col :span="18">
+        <div v-for="(file, key) in dataSource" :key="key">
+          <a-col :span="24">
+            <a-divider orientation="left">{{ file.fileName }}</a-divider>
+          </a-col>
+          <!-- 预览区域 -->
+          <a-col :span="24">
+            <template v-if="file.filePdfPath">
+              <div @click="pdfPreview(file.title)">
+                <img style="width: 80px; height: 80px" src="../../../assets/images/pdf4.jpg" />
+              </div>
+            </template>
+            <template v-else> (暂无材料，点击"选择文件"或"扫描上传"上传文件) </template>
+          </a-col>
         </div>
-    </a-card>
+      </a-col>
+    </a-row>
+    <div style="display: none">
+      <iframe id="pdfPreviewIframe" :src="url" frameborder="0" width="100%" height="550px" scrolling="auto"></iframe>
+    </div>
+  </a-card>
 </template>
 
 <script lang="ts">
+  import { defineComponent, ref, unref, onMounted } from 'vue';
+  import { useGlobSetting } from '/@/hooks/setting';
+  import { getToken } from '/@/utils/auth';
 
-    import {defineComponent, ref, unref, onMounted} from 'vue';
-    import {useGlobSetting} from '/@/hooks/setting';
-    import {getToken} from '/@/utils/auth';
+  const mockdata = [
+    {
+      id: '1',
+      key: '1',
+      title: '实例.pdf',
+      fileCode: 'shili',
+      fileName: '实例',
+      filePdfPath: '实例',
+    },
+  ];
 
-    const mockdata = [{
-        "id": "1",
-        "key": "1",
-        "title": "实例.pdf",
-        "fileCode": "shili",
-        "fileName": "实例",
-        "filePdfPath": "实例"
-    }];
+  export default defineComponent({
+    name: 'JeecgPdfView',
+    setup() {
+      const glob = useGlobSetting();
+      const treeData = ref([
+        {
+          title: '所有PDF电子档',
+          key: '0-0',
+          children: mockdata,
+        },
+      ]);
+      const dataSource = ref(mockdata);
+      const allData = ref(mockdata);
+      const url = ref(`${glob.domainUrl}/sys/common/pdf/pdfPreviewIframe`);
 
-    export default defineComponent({
-        name: "JeecgPdfView",
-        setup() {
-            const glob = useGlobSetting();
-            const treeData = ref([{
-                title: '所有PDF电子档',
-                key: '0-0',
-                children: mockdata
-            }]);
-            const dataSource = ref(mockdata);
-            const allData = ref(mockdata);
-            const url = ref(`${glob.domainUrl}/sys/common/pdf/pdfPreviewIframe`);
+      /**
+       * 打开iframe窗口
+       * @param title
+       */
+      function pdfPreview(title) {
+        let iframe = document.getElementById('pdfPreviewIframe');
+        let json = { title: title, token: getToken() };
+        iframe.contentWindow.postMessage(json, '*');
+      }
 
-            /**
-             * 打开iframe窗口
-             * @param title
-             */
-            function pdfPreview(title) {
-                let iframe = document.getElementById("pdfPreviewIframe");
-                let json = {"title": title, "token": getToken()};
-                iframe.contentWindow.postMessage(json, "*");
-            }
-
-            // 选择PDF文件
-            function onSelect(selectedKeys, info) {
-                dataSource.value = [];
-                if (selectedKeys[0] === undefined || selectedKeys[0] === '0-0') {
-                    dataSource.value = unref(allData);
-                } else {
-                    dataSource.value.push(info.node.dataRef);
-                }
-            }
-
-            return {
-                url,
-                dataSource,
-                treeData,
-                allData,
-                onSelect,
-                pdfPreview,
-            }
+      // 选择PDF文件
+      function onSelect(selectedKeys, info) {
+        dataSource.value = [];
+        if (selectedKeys[0] === undefined || selectedKeys[0] === '0-0') {
+          dataSource.value = unref(allData);
+        } else {
+          dataSource.value.push(info.node.dataRef);
         }
-    })
+      }
+
+      return {
+        url,
+        dataSource,
+        treeData,
+        allData,
+        onSelect,
+        pdfPreview,
+      };
+    },
+  });
 </script>
diff --git a/src/views/demo/jeecg/PrintDemo.vue b/src/views/demo/jeecg/PrintDemo.vue
index f6f3b0e..9845364 100644
--- a/src/views/demo/jeecg/PrintDemo.vue
+++ b/src/views/demo/jeecg/PrintDemo.vue
@@ -6,43 +6,37 @@
       </div>
       <section ref="print" id="printContent">
         <div style="text-align: center">
-          <p style="font-size: 24px;font-weight: 800">打印测试表单</p>
+          <p style="font-size: 24px; font-weight: 800">打印测试表单</p>
         </div>
         <!--签字-->
         <a-col :md="24" :sm="24">
           <div class="sign" style="text-align: left; height: inherit">
             <a-col :span="24">
               <span>打印人员:</span>
-              <a-input style="width: 30%" v-model:value="model.printer"/>
+              <a-input style="width: 30%" v-model:value="model.printer" />
               <span style="margin-left: 12.5%">打印日期:</span>
-              <a-input style="width: 30%" v-model:value="model.printTime"/>
-            </a-col>
-            <a-col :span="24">
+              <a-input style="width: 30%" v-model:value="model.printTime" />
             </a-col>
+            <a-col :span="24"> </a-col>
             <a-col :span="24" style="margin-top: 20px">
               <span>打印内容:</span>
-              <a-input style="width: 80%" v-model:value="model.printContent"/>
+              <a-input style="width: 80%" v-model:value="model.printContent" />
             </a-col>
             <a-col :span="24" style="margin-top: 20px">
               <span>打印目的:</span>
-              <a-input style="width: 80%" v-model:value="model.printReason"/>
+              <a-input style="width: 80%" v-model:value="model.printReason" />
             </a-col>
             <a-col style="margin-top: 20px" :span="24">
               <span>打印图片:</span>
-              <br/>
-              <a-upload
-                  action="/jsonplaceholder.typicode.com/posts/"
-                  listType="picture-card"
-                  :fileList="model.fileList"
-                  @preview="handlePreview"
-                  @change="handleChange">
+              <br />
+              <a-upload action="/jsonplaceholder.typicode.com/posts/" listType="picture-card" :fileList="model.fileList" @preview="handlePreview" @change="handleChange">
                 <div v-if="model.fileList.length < 3">
-                  <Icon icon="ant-design:plus-outlined"/>
+                  <Icon icon="ant-design:plus-outlined" />
                   <div class="ant-upload-text">Upload</div>
                 </div>
               </a-upload>
               <a-modal :visible="previewVisible" :footer="null" @cancel="previewVisible = false">
-                <img alt="example" style="width: 100%" :src="previewImage"/>
+                <img alt="example" style="width: 100%" :src="previewImage" />
               </a-modal>
             </a-col>
           </div>
@@ -52,100 +46,99 @@
   </PageWrapper>
 </template>
 <script lang="ts">
-import { ref, reactive } from 'vue'
-import { PageWrapper } from '/@/components/Page'
-import Icon from '/@/components/Icon/src/Icon.vue'
-import { printJS } from '/@/hooks/web/usePrintJS'
+  import { ref, reactive } from 'vue';
+  import { PageWrapper } from '/@/components/Page';
+  import Icon from '/@/components/Icon/src/Icon.vue';
+  import { printJS } from '/@/hooks/web/usePrintJS';
 
-export default {
-  name: 'PrintDemo',
-  components: { PageWrapper, Icon },
-  props: {
-    reBizCode: {
-      type: String,
-      default: '',
+  export default {
+    name: 'PrintDemo',
+    components: { PageWrapper, Icon },
+    props: {
+      reBizCode: {
+        type: String,
+        default: '',
+      },
     },
-  },
-  setup() {
-    const model = reactive({
-      printer: '张三',
-      printTime: '2021-12-31 23:59:59',
-      printContent: '打印内容：这是一个打印测试！',
-      printReason: '做一个打印测试',
-      fileList: [
-        {
-          uid: '-1',
-          name: 'xxx.png',
-          status: 'done',
-          url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
-        },
-        {
-          uid: '-2',
-          name: 'pic1.png',
-          status: 'done',
-          url: 'https://www.gizbot.com/img/2016/11/whatsapp-error-lead-image-08-1478607387.jpg',
-        },
-      ],
-    })
-    const previewImage = ref('')
-    const previewVisible = ref(false)
+    setup() {
+      const model = reactive({
+        printer: '张三',
+        printTime: '2021-12-31 23:59:59',
+        printContent: '打印内容：这是一个打印测试！',
+        printReason: '做一个打印测试',
+        fileList: [
+          {
+            uid: '-1',
+            name: 'xxx.png',
+            status: 'done',
+            url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
+          },
+          {
+            uid: '-2',
+            name: 'pic1.png',
+            status: 'done',
+            url: 'https://www.gizbot.com/img/2016/11/whatsapp-error-lead-image-08-1478607387.jpg',
+          },
+        ],
+      });
+      const previewImage = ref('');
+      const previewVisible = ref(false);
 
-    function onPrint() {
-      printJS({
-        printable: '#printContent',
-        type: 'html',
-      })
-    }
+      function onPrint() {
+        printJS({
+          printable: '#printContent',
+          type: 'html',
+        });
+      }
 
-    function handlePreview(file) {
-      previewImage.value = file.url || file.thumbUrl
-      previewVisible.value = true
-    }
+      function handlePreview(file) {
+        previewImage.value = file.url || file.thumbUrl;
+        previewVisible.value = true;
+      }
 
-    function handleChange({ fileList }) {
-      model.fileList = fileList
-    }
+      function handleChange({ fileList }) {
+        model.fileList = fileList;
+      }
 
-    return {
-      model,
-      previewImage,
-      previewVisible,
-      onPrint,
-      handlePreview,
-      handleChange,
-    }
-  },
-}
+      return {
+        model,
+        previewImage,
+        previewVisible,
+        onPrint,
+        handlePreview,
+        handleChange,
+      };
+    },
+  };
 </script>
 <style lang="less" scoped>
+  .j-print-demo .ant-card-body {
+    margin-left: 0;
+    margin-right: 0;
+    margin-bottom: 1%;
+    border: 0 solid black;
+    min-width: 800px;
+    color: #000000 !important;
+  }
 
-.j-print-demo .ant-card-body {
-  margin-left: 0;
-  margin-right: 0;
-  margin-bottom: 1%;
-  border: 0 solid black;
-  min-width: 800px;
-  color: #000000 !important;
-}
+  .sign .ant-input {
+    font-weight: bolder;
+    text-align: center;
+    border-left-width: 0 !important;
+    border-top-width: 0 !important;
+    border-right-width: 0 !important;
+    outline: none !important;
+    box-shadow: none !important;
+  }
 
-.sign .ant-input {
-  font-weight: bolder;
-  text-align: center;
-  border-left-width: 0 !important;
-  border-top-width: 0 !important;
-  border-right-width: 0 !important;
-  outline: none !important;
-  box-shadow: none !important;
-}
+  /* you can make up upload button and sample style by using stylesheets */
+  .ant-upload-select-picture-card i {
+    font-size: 32px;
+    color: #999;
+  }
 
-/* you can make up upload button and sample style by using stylesheets */
-.ant-upload-select-picture-card i {
-  font-size: 32px;
-  color: #999;
-}
-
-.ant-upload-select-picture-card .ant-upload-text {
-  margin-top: 8px;
-  color: #666;
-}
-</style>
\ No newline at end of file
+  .ant-upload-select-picture-card .ant-upload-text {
+    margin-top: 8px;
+    color: #666;
+  }
+</style>
diff --git a/src/views/demo/jeecg/TableTotal.vue b/src/views/demo/jeecg/TableTotal.vue
index 389df2f..d95e312 100644
--- a/src/views/demo/jeecg/TableTotal.vue
+++ b/src/views/demo/jeecg/TableTotal.vue
@@ -1,59 +1,59 @@
 <template>
   <PageWrapper>
     <a-card :bordered="false">
-      <BasicTable @register="registerTable"/>
+      <BasicTable @register="registerTable" />
     </a-card>
   </PageWrapper>
 </template>
 
 <script lang="ts" setup>
-import { PageWrapper } from '/@/components/Page'
-import { BasicTable, useTable } from '/@/components/Table'
-import { mapTableTotalSummary } from '/@/utils/common/compUtils'
+  import { PageWrapper } from '/@/components/Page';
+  import { BasicTable, useTable } from '/@/components/Table';
+  import { mapTableTotalSummary } from '/@/utils/common/compUtils';
 
-const [registerTable] = useTable({
-  rowKey: 'id',
-  bordered: true,
-  canResize: false,
-  columns: [
-    { title: '姓名', dataIndex: 'name' },
-    { title: '贡献点', dataIndex: 'point' },
-    { title: '等级', dataIndex: 'level' },
-    { title: '更新时间', dataIndex: 'updateTime' },
-  ],
-  dataSource: [
-    { id: 0, name: '张三', point: 23, level: 3, updateTime: '2019-8-14' },
-    { id: 1, name: '小鹿', point: 33, level: 9, updateTime: '2019-8-10' },
-    { id: 2, name: '小王', point: 6, level: 1, updateTime: '2019-8-13' },
-    { id: 3, name: '李四', point: 53, level: 8, updateTime: '2019-8-12' },
-    { id: 4, name: '小红', point: 44, level: 5, updateTime: '2019-8-11' },
-    { id: 5, name: '王五', point: 97, level: 10, updateTime: '2019-8-10' },
-    { id: 6, name: '小明', point: 33, level: 2, updateTime: '2019-8-10' },
-    { id: 7, name: '小张', point: 33, level: 4, updateTime: '2019-8-10' },
-    { id: 8, name: '小六', point: 33, level: 2, updateTime: '2019-8-10' },
-    { id: 9, name: '小五', point: 33, level: 7, updateTime: '2019-8-10' },
-    { id: 10, name: '小赵', point: 33, level: 2, updateTime: '2019-8-10' },
-    { id: 11, name: '李华', point: 33, level: 8, updateTime: '2019-8-10' },
-    { id: 12, name: '小康', point: 33, level: 5, updateTime: '2019-8-10' },
-  ],
-  // 显示底部合计
-  showSummary: true,
-  // 底部合计计算方法
-  summaryFunc: onSummary,
-})
+  const [registerTable] = useTable({
+    rowKey: 'id',
+    bordered: true,
+    canResize: false,
+    columns: [
+      { title: '姓名', dataIndex: 'name' },
+      { title: '贡献点', dataIndex: 'point' },
+      { title: '等级', dataIndex: 'level' },
+      { title: '更新时间', dataIndex: 'updateTime' },
+    ],
+    dataSource: [
+      { id: 0, name: '张三', point: 23, level: 3, updateTime: '2019-8-14' },
+      { id: 1, name: '小鹿', point: 33, level: 9, updateTime: '2019-8-10' },
+      { id: 2, name: '小王', point: 6, level: 1, updateTime: '2019-8-13' },
+      { id: 3, name: '李四', point: 53, level: 8, updateTime: '2019-8-12' },
+      { id: 4, name: '小红', point: 44, level: 5, updateTime: '2019-8-11' },
+      { id: 5, name: '王五', point: 97, level: 10, updateTime: '2019-8-10' },
+      { id: 6, name: '小明', point: 33, level: 2, updateTime: '2019-8-10' },
+      { id: 7, name: '小张', point: 33, level: 4, updateTime: '2019-8-10' },
+      { id: 8, name: '小六', point: 33, level: 2, updateTime: '2019-8-10' },
+      { id: 9, name: '小五', point: 33, level: 7, updateTime: '2019-8-10' },
+      { id: 10, name: '小赵', point: 33, level: 2, updateTime: '2019-8-10' },
+      { id: 11, name: '李华', point: 33, level: 8, updateTime: '2019-8-10' },
+      { id: 12, name: '小康', point: 33, level: 5, updateTime: '2019-8-10' },
+    ],
+    // 显示底部合计
+    showSummary: true,
+    // 底部合计计算方法
+    summaryFunc: onSummary,
+  });
 
-function onSummary(tableData: Recordable[]) {
-  // 可用工具方法自动计算合计
-  const totals = mapTableTotalSummary(tableData, ['point', 'level'])
-  return [
-    totals,
-    {
-      _row: '平均',
-      _index: '平均',
-      // 计算平均值
-      point: (totals.point / tableData.length).toFixed(2),
-      level: (totals.level / tableData.length).toFixed(0),
-    },
-  ]
-}
-</script>
\ No newline at end of file
+  function onSummary(tableData: Recordable[]) {
+    // 可用工具方法自动计算合计
+    const totals = mapTableTotalSummary(tableData, ['point', 'level']);
+    return [
+      totals,
+      {
+        _row: '平均',
+        _index: '平均',
+        // 计算平均值
+        point: (totals.point / tableData.length).toFixed(2),
+        level: (totals.level / tableData.length).toFixed(0),
+      },
+    ];
+  }
+</script>
diff --git a/src/views/demo/jeecg/erplist/JeecgOrderCustomerList.vue b/src/views/demo/jeecg/erplist/JeecgOrderCustomerList.vue
index 544168a..4e5bea3 100644
--- a/src/views/demo/jeecg/erplist/JeecgOrderCustomerList.vue
+++ b/src/views/demo/jeecg/erplist/JeecgOrderCustomerList.vue
@@ -1,148 +1,147 @@
 <template>
-    <div>
-        <!--表格-->
-        <BasicTable @register="registerTable" :rowSelection="rowSelection" :searchInfo="searchInfo">
-            <!--插槽:table标题-->
-            <template #tableTitle>
-                <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增</a-button>
-                <a-dropdown v-if="selectedRowKeys.length > 0">
-                    <template #overlay>
-                        <a-menu>
-                            <a-menu-item key="1" @click="batchHandleDelete">
-                                <Icon icon="ant-design:delete-outlined"></Icon>
-                                删除
-                            </a-menu-item>
-                        </a-menu>
-                    </template>
-                    <a-button>批量操作
-                        <Icon icon="mdi:chevron-down"></Icon>
-                    </a-button>
-                </a-dropdown>
-            </template>
-            <!--操作栏-->
-            <template #action="{ record }">
-                <TableAction :actions="getTableAction(record)"/>
-            </template>
-        </BasicTable>
-        <!-- 表单区域 -->
-        <JeecgOrderCustomerModal @register="registerModal" @success="handleSuccess"></JeecgOrderCustomerModal>
-    </div>
+  <div>
+    <!--表格-->
+    <BasicTable @register="registerTable" :rowSelection="rowSelection" :searchInfo="searchInfo">
+      <!--插槽:table标题-->
+      <template #tableTitle>
+        <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增</a-button>
+        <a-dropdown v-if="selectedRowKeys.length > 0">
+          <template #overlay>
+            <a-menu>
+              <a-menu-item key="1" @click="batchHandleDelete">
+                <Icon icon="ant-design:delete-outlined"></Icon>
+                删除
+              </a-menu-item>
+            </a-menu>
+          </template>
+          <a-button
+            >批量操作
+            <Icon icon="mdi:chevron-down"></Icon>
+          </a-button>
+        </a-dropdown>
+      </template>
+      <!--操作栏-->
+      <template #action="{ record }">
+        <TableAction :actions="getTableAction(record)" />
+      </template>
+    </BasicTable>
+    <!-- 表单区域 -->
+    <JeecgOrderCustomerModal @register="registerModal" @success="handleSuccess"></JeecgOrderCustomerModal>
+  </div>
 </template>
 
 <script lang="ts" setup>
-    //ts语法
-    import {ref, computed, unref, watch, inject} from 'vue';
-    import {BasicTable, TableAction} from '/@/components/Table';
-    import JeecgOrderCustomerModal from './components/JeecgOrderCustomerModal.vue';
-    import {useListPage} from '/@/hooks/system/useListPage'
-    import {useModal} from '/@/components/Modal';
-    import {customColumns} from './erplist.data';
-    import {customList, deleteCustomer, deleteBatchCustomer} from './erplist.api';
-    import {isEmpty} from "/@/utils/is";
-    import {useMessage} from '/@/hooks/web/useMessage';
-    //接收主表id
-    const orderId = inject('orderId') || '';
-    //提示弹窗
-    const $message = useMessage()
-    //弹窗model
-    const [registerModal, {openModal}] = useModal();
-    const searchInfo = {};
-    // 列表页面公共参数、方法
-    const {prefixCls, tableContext} = useListPage({
-        tableProps: {
-            api: customList,
-            columns: customColumns,
-            canResize: false,
-            useSearchForm: false,
-            actionColumn: {
-                width: 180,
-            },
-            pagination:{
-                current: 1,
-                pageSize: 5,
-                pageSizeOptions: ['5', '10', '20'],
-            }
-        },
+  //ts语法
+  import { ref, computed, unref, watch, inject } from 'vue';
+  import { BasicTable, TableAction } from '/@/components/Table';
+  import JeecgOrderCustomerModal from './components/JeecgOrderCustomerModal.vue';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import { useModal } from '/@/components/Modal';
+  import { customColumns } from './erplist.data';
+  import { customList, deleteCustomer, deleteBatchCustomer } from './erplist.api';
+  import { isEmpty } from '/@/utils/is';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  //接收主表id
+  const orderId = inject('orderId') || '';
+  //提示弹窗
+  const $message = useMessage();
+  //弹窗model
+  const [registerModal, { openModal }] = useModal();
+  const searchInfo = {};
+  // 列表页面公共参数、方法
+  const { prefixCls, tableContext } = useListPage({
+    tableProps: {
+      api: customList,
+      columns: customColumns,
+      canResize: false,
+      useSearchForm: false,
+      actionColumn: {
+        width: 180,
+      },
+      pagination: {
+        current: 1,
+        pageSize: 5,
+        pageSizeOptions: ['5', '10', '20'],
+      },
+    },
+  });
+
+  //注册table数据
+  const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;
+
+  watch(orderId, () => {
+    searchInfo['orderId'] = unref(orderId);
+    reload();
+  });
+
+  /**
+   * 新增事件
+   */
+  function handleCreate() {
+    console.log('orderId=====》', orderId);
+    if (isEmpty(unref(orderId))) {
+      $message.createMessage.warning('请选择一个订单信息');
+      return;
+    }
+    openModal(true, {
+      isUpdate: false,
+      showFooter: true,
     });
+  }
 
-    //注册table数据
-    const [registerTable, {reload}, {rowSelection, selectedRowKeys}] = tableContext;
+  /**
+   * 编辑事件
+   */
+  async function handleEdit(record: Recordable) {
+    openModal(true, {
+      record,
+      isUpdate: true,
+      showFooter: true,
+    });
+  }
 
-    watch(orderId, () => {
-            searchInfo['orderId'] = unref(orderId);
-            reload();
-        }
-    );
+  /**
+   * 删除事件
+   */
+  async function handleDelete(record) {
+    await deleteCustomer({ id: record.id }, reload);
+  }
 
-    /**
-     * 新增事件
-     */
-    function handleCreate() {
-        console.log("orderId=====》", orderId)
-        if (isEmpty(unref(orderId))) {
-            $message.createMessage.warning('请选择一个订单信息')
-            return;
-        }
-        openModal(true, {
-            isUpdate: false,
-            showFooter: true,
-        });
-    }
+  /**
+   * 批量删除事件
+   */
+  async function batchHandleDelete() {
+    await deleteBatchCustomer({ ids: selectedRowKeys.value }, () => {
+      selectedRowKeys.value = [];
+      reload();
+    });
+  }
 
-    /**
-     * 编辑事件
-     */
-    async function handleEdit(record: Recordable) {
-        openModal(true, {
-            record,
-            isUpdate: true,
-            showFooter: true,
-        });
-    }
+  /**
+   * 成功回调
+   */
+  function handleSuccess() {
+    reload();
+  }
 
-    /**
-     * 删除事件
-     */
-    async function handleDelete(record) {
-        await deleteCustomer({id: record.id}, reload);
-    }
-
-    /**
-     * 批量删除事件
-     */
-    async function batchHandleDelete() {
-        await deleteBatchCustomer({ids: selectedRowKeys.value}, () => {
-            selectedRowKeys.value = []
-            reload()
-        })
-    }
-
-    /**
-     * 成功回调
-     */
-    function handleSuccess() {
-        reload();
-    }
-
-    /**
-     * 操作栏
-     */
-    function getTableAction(record) {
-        return [
-            {
-                label: '编辑',
-                onClick: handleEdit.bind(null, record),
-            }, {
-                label: '删除',
-                popConfirm: {
-                    title: '是否确认删除',
-                    confirm: handleDelete.bind(null, record),
-                },
-            }
-        ]
-    }
+  /**
+   * 操作栏
+   */
+  function getTableAction(record) {
+    return [
+      {
+        label: '编辑',
+        onClick: handleEdit.bind(null, record),
+      },
+      {
+        label: '删除',
+        popConfirm: {
+          title: '是否确认删除',
+          confirm: handleDelete.bind(null, record),
+        },
+      },
+    ];
+  }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/views/demo/jeecg/erplist/JeecgOrderTicketList.vue b/src/views/demo/jeecg/erplist/JeecgOrderTicketList.vue
index f6f6e3e..8628487 100644
--- a/src/views/demo/jeecg/erplist/JeecgOrderTicketList.vue
+++ b/src/views/demo/jeecg/erplist/JeecgOrderTicketList.vue
@@ -1,147 +1,146 @@
 <template>
-    <div>
-        <!--表格-->
-        <BasicTable @register="registerTable" :rowSelection="rowSelection" :searchInfo="searchInfo">
-            <!--插槽:table标题-->
-            <template #tableTitle>
-                <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增</a-button>
-                <a-dropdown v-if="selectedRowKeys.length > 0">
-                    <template #overlay>
-                        <a-menu>
-                            <a-menu-item key="1" @click="batchHandleDelete">
-                                <Icon icon="ant-design:delete-outlined"></Icon>
-                                删除
-                            </a-menu-item>
-                        </a-menu>
-                    </template>
-                    <a-button>批量操作
-                        <Icon icon="mdi:chevron-down"></Icon>
-                    </a-button>
-                </a-dropdown>
-            </template>
-            <!--操作栏-->
-            <template #action="{ record }">
-                <TableAction :actions="getTableAction(record)"/>
-            </template>
-        </BasicTable>
-        <!-- 表单区域 -->
-        <JeecgOrderTicketModal @register="registerModal" @success="handleSuccess"></JeecgOrderTicketModal>
-    </div>
+  <div>
+    <!--表格-->
+    <BasicTable @register="registerTable" :rowSelection="rowSelection" :searchInfo="searchInfo">
+      <!--插槽:table标题-->
+      <template #tableTitle>
+        <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增</a-button>
+        <a-dropdown v-if="selectedRowKeys.length > 0">
+          <template #overlay>
+            <a-menu>
+              <a-menu-item key="1" @click="batchHandleDelete">
+                <Icon icon="ant-design:delete-outlined"></Icon>
+                删除
+              </a-menu-item>
+            </a-menu>
+          </template>
+          <a-button
+            >批量操作
+            <Icon icon="mdi:chevron-down"></Icon>
+          </a-button>
+        </a-dropdown>
+      </template>
+      <!--操作栏-->
+      <template #action="{ record }">
+        <TableAction :actions="getTableAction(record)" />
+      </template>
+    </BasicTable>
+    <!-- 表单区域 -->
+    <JeecgOrderTicketModal @register="registerModal" @success="handleSuccess"></JeecgOrderTicketModal>
+  </div>
 </template>
 
 <script lang="ts" setup>
-    //ts语法
-    import {ref, computed, unref, watch, inject} from 'vue';
-    import {BasicTable, TableAction} from '/@/components/Table';
-    import JeecgOrderTicketModal from './components/JeecgOrderTicketModal.vue';
-    import {useListPage} from '/@/hooks/system/useListPage'
-    import {useModal} from '/@/components/Modal';
-    import {ticketColumns} from './erplist.data';
-    import {ticketList, deleteTicket, deleteBatchTicket} from './erplist.api';
-    import {isEmpty} from "/@/utils/is";
-    import {useMessage} from '/@/hooks/web/useMessage';
-    //接收主表id
-    const orderId = inject('orderId');
-    //提示弹窗
-    const $message = useMessage();
-    //弹窗model
-    const [registerModal, {openModal}] = useModal();
-    const searchInfo = {};
-    // 列表页面公共参数、方法
-    const {prefixCls, tableContext} = useListPage({
-        tableProps: {
-            api: ticketList,
-            columns: ticketColumns,
-            canResize: false,
-            useSearchForm: false,
-            actionColumn: {
-                width: 180,
-            },
-            pagination:{
-                current: 1,
-                pageSize: 5,
-                pageSizeOptions: ['5', '10', '20'],
-            }
-        },
+  //ts语法
+  import { ref, computed, unref, watch, inject } from 'vue';
+  import { BasicTable, TableAction } from '/@/components/Table';
+  import JeecgOrderTicketModal from './components/JeecgOrderTicketModal.vue';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import { useModal } from '/@/components/Modal';
+  import { ticketColumns } from './erplist.data';
+  import { ticketList, deleteTicket, deleteBatchTicket } from './erplist.api';
+  import { isEmpty } from '/@/utils/is';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  //接收主表id
+  const orderId = inject('orderId');
+  //提示弹窗
+  const $message = useMessage();
+  //弹窗model
+  const [registerModal, { openModal }] = useModal();
+  const searchInfo = {};
+  // 列表页面公共参数、方法
+  const { prefixCls, tableContext } = useListPage({
+    tableProps: {
+      api: ticketList,
+      columns: ticketColumns,
+      canResize: false,
+      useSearchForm: false,
+      actionColumn: {
+        width: 180,
+      },
+      pagination: {
+        current: 1,
+        pageSize: 5,
+        pageSizeOptions: ['5', '10', '20'],
+      },
+    },
+  });
+
+  //注册table数据
+  const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;
+
+  watch(orderId, () => {
+    searchInfo['orderId'] = unref(orderId);
+    reload();
+  });
+
+  /**
+   * 新增事件
+   */
+  function handleCreate() {
+    if (isEmpty(unref(orderId))) {
+      $message.createMessage.warning('请选择一个订单信息');
+      return;
+    }
+    openModal(true, {
+      isUpdate: false,
+      showFooter: true,
     });
+  }
 
-    //注册table数据
-    const [registerTable, {reload}, {rowSelection, selectedRowKeys}] = tableContext;
+  /**
+   * 编辑事件
+   */
+  async function handleEdit(record: Recordable) {
+    openModal(true, {
+      record,
+      isUpdate: true,
+      showFooter: true,
+    });
+  }
 
-    watch(orderId, () => {
-            searchInfo['orderId'] = unref(orderId);
-            reload();
-        }
-    );
+  /**
+   * 删除事件
+   */
+  async function handleDelete(record) {
+    await deleteTicket({ id: record.id }, reload);
+  }
 
-    /**
-     * 新增事件
-     */
-    function handleCreate() {
-        if (isEmpty(unref(orderId))) {
-            $message.createMessage.warning('请选择一个订单信息')
-            return;
-        }
-        openModal(true, {
-            isUpdate: false,
-            showFooter: true,
-        });
-    }
+  /**
+   * 批量删除事件
+   */
+  async function batchHandleDelete() {
+    await deleteBatchTicket({ ids: selectedRowKeys.value }, () => {
+      selectedRowKeys.value = [];
+      reload();
+    });
+  }
 
-    /**
-     * 编辑事件
-     */
-    async function handleEdit(record: Recordable) {
-        openModal(true, {
-            record,
-            isUpdate: true,
-            showFooter: true,
-        });
-    }
+  /**
+   * 成功回调
+   */
+  function handleSuccess() {
+    reload();
+  }
 
-    /**
-     * 删除事件
-     */
-    async function handleDelete(record) {
-        await deleteTicket({id: record.id}, reload);
-    }
-
-    /**
-     * 批量删除事件
-     */
-    async function batchHandleDelete() {
-        await deleteBatchTicket({ids: selectedRowKeys.value}, () => {
-            selectedRowKeys.value = []
-            reload()
-        })
-    }
-
-    /**
-     * 成功回调
-     */
-    function handleSuccess() {
-        reload();
-    }
-
-    /**
-     * 操作栏
-     */
-    function getTableAction(record) {
-        return [
-            {
-                label: '编辑',
-                onClick: handleEdit.bind(null, record),
-            }, {
-                label: '删除',
-                popConfirm: {
-                    title: '是否确认删除',
-                    confirm: handleDelete.bind(null, record),
-                },
-            }
-        ]
-    }
+  /**
+   * 操作栏
+   */
+  function getTableAction(record) {
+    return [
+      {
+        label: '编辑',
+        onClick: handleEdit.bind(null, record),
+      },
+      {
+        label: '删除',
+        popConfirm: {
+          title: '是否确认删除',
+          confirm: handleDelete.bind(null, record),
+        },
+      },
+    ];
+  }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/views/demo/jeecg/erplist/components/JeecgOrderCustomerModal.vue b/src/views/demo/jeecg/erplist/components/JeecgOrderCustomerModal.vue
index e9021e5..3590ea6 100644
--- a/src/views/demo/jeecg/erplist/components/JeecgOrderCustomerModal.vue
+++ b/src/views/demo/jeecg/erplist/components/JeecgOrderCustomerModal.vue
@@ -1,57 +1,57 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" :width="700">
-        <BasicForm @register="registerForm"/>
-    </BasicModal>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" :width="700">
+    <BasicForm @register="registerForm" />
+  </BasicModal>
 </template>
 <script lang="ts" setup>
-    import {ref, computed, unref, inject} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {BasicForm, useForm} from '/@/components/Form/index';
-    import {customerFormSchema} from '../erplist.data';
-    import {saveOrUpdateCustomer} from '../erplist.api';
-    //接收主表id
-    const orderId = inject('orderId') || '';
-    // 声明Emits
-    const emit = defineEmits(['success', 'register']);
-    const isUpdate = ref(true);
-    //表单配置
-    const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
-        labelWidth: 150,
-        schemas: customerFormSchema,
-        showActionButtonGroup: false,
-    });
-    //表单赋值
-    const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-        //重置表单
-        await resetFields();
-        setModalProps({confirmLoading: false});
-        isUpdate.value = !!data?.isUpdate;
-        if (unref(isUpdate)) {
-            //表单赋值
-            await setFieldsValue({
-                ...data.record,
-            });
-        }
-    });
-    //设置标题
-    const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
-
-    //表单提交事件
-    async function handleSubmit() {
-        try {
-            const values = await validate();
-            setModalProps({confirmLoading: true});
-            if (unref(orderId)) {
-                values.orderId = unref(orderId);
-            }
-            //提交表单
-            await saveOrUpdateCustomer(values, isUpdate.value);
-            //关闭弹窗
-            closeModal();
-            //刷新列表
-            emit('success');
-        } finally {
-            setModalProps({confirmLoading: false});
-        }
+  import { ref, computed, unref, inject } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { customerFormSchema } from '../erplist.data';
+  import { saveOrUpdateCustomer } from '../erplist.api';
+  //接收主表id
+  const orderId = inject('orderId') || '';
+  // 声明Emits
+  const emit = defineEmits(['success', 'register']);
+  const isUpdate = ref(true);
+  //表单配置
+  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
+    labelWidth: 150,
+    schemas: customerFormSchema,
+    showActionButtonGroup: false,
+  });
+  //表单赋值
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    //重置表单
+    await resetFields();
+    setModalProps({ confirmLoading: false });
+    isUpdate.value = !!data?.isUpdate;
+    if (unref(isUpdate)) {
+      //表单赋值
+      await setFieldsValue({
+        ...data.record,
+      });
     }
+  });
+  //设置标题
+  const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
+
+  //表单提交事件
+  async function handleSubmit() {
+    try {
+      const values = await validate();
+      setModalProps({ confirmLoading: true });
+      if (unref(orderId)) {
+        values.orderId = unref(orderId);
+      }
+      //提交表单
+      await saveOrUpdateCustomer(values, isUpdate.value);
+      //关闭弹窗
+      closeModal();
+      //刷新列表
+      emit('success');
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
+  }
 </script>
diff --git a/src/views/demo/jeecg/erplist/components/JeecgOrderModal.vue b/src/views/demo/jeecg/erplist/components/JeecgOrderModal.vue
index f29344e..f5511cf 100644
--- a/src/views/demo/jeecg/erplist/components/JeecgOrderModal.vue
+++ b/src/views/demo/jeecg/erplist/components/JeecgOrderModal.vue
@@ -1,52 +1,52 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" :width="700">
-        <BasicForm @register="registerForm"/>
-    </BasicModal>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" :width="700">
+    <BasicForm @register="registerForm" />
+  </BasicModal>
 </template>
 <script lang="ts" setup>
-    import {ref, computed, unref} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {BasicForm, useForm} from '/@/components/Form/index';
-    import {formSchema} from '../erplist.data';
-    import {saveOrUpdate} from '../erplist.api';
-    // 声明Emits
-    const emit = defineEmits(['success', 'register']);
-    const isUpdate = ref(true);
-    //表单配置
-    const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
-        labelWidth: 150,
-        schemas: formSchema,
-        showActionButtonGroup: false,
-    });
-    //表单赋值
-    const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-        //重置表单
-        await resetFields();
-        setModalProps({confirmLoading: false});
-        isUpdate.value = !!data?.isUpdate;
-        if (unref(isUpdate)) {
-            //表单赋值
-            await setFieldsValue({
-                ...data.record,
-            });
-        }
-    });
-    //设置标题
-    const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
-
-    //表单提交事件
-    async function handleSubmit() {
-        try {
-            const values = await validate();
-            setModalProps({confirmLoading: true});
-            //提交表单
-            await saveOrUpdate(values, isUpdate.value);
-            //关闭弹窗
-            closeModal();
-            //刷新列表
-            emit('success');
-        } finally {
-            setModalProps({confirmLoading: false});
-        }
+  import { ref, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { formSchema } from '../erplist.data';
+  import { saveOrUpdate } from '../erplist.api';
+  // 声明Emits
+  const emit = defineEmits(['success', 'register']);
+  const isUpdate = ref(true);
+  //表单配置
+  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
+    labelWidth: 150,
+    schemas: formSchema,
+    showActionButtonGroup: false,
+  });
+  //表单赋值
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    //重置表单
+    await resetFields();
+    setModalProps({ confirmLoading: false });
+    isUpdate.value = !!data?.isUpdate;
+    if (unref(isUpdate)) {
+      //表单赋值
+      await setFieldsValue({
+        ...data.record,
+      });
     }
+  });
+  //设置标题
+  const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
+
+  //表单提交事件
+  async function handleSubmit() {
+    try {
+      const values = await validate();
+      setModalProps({ confirmLoading: true });
+      //提交表单
+      await saveOrUpdate(values, isUpdate.value);
+      //关闭弹窗
+      closeModal();
+      //刷新列表
+      emit('success');
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
+  }
 </script>
diff --git a/src/views/demo/jeecg/erplist/components/JeecgOrderTicketModal.vue b/src/views/demo/jeecg/erplist/components/JeecgOrderTicketModal.vue
index 12c72dd..3890222 100644
--- a/src/views/demo/jeecg/erplist/components/JeecgOrderTicketModal.vue
+++ b/src/views/demo/jeecg/erplist/components/JeecgOrderTicketModal.vue
@@ -1,57 +1,57 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" :width="500" :minHeight="20" :maxHeight="20">
-        <BasicForm @register="registerForm"/>
-    </BasicModal>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" :width="500" :minHeight="20" :maxHeight="20">
+    <BasicForm @register="registerForm" />
+  </BasicModal>
 </template>
 <script lang="ts" setup>
-    import {ref, computed, unref, inject} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {BasicForm, useForm} from '/@/components/Form/index';
-    import {ticketFormSchema} from '../erplist.data';
-    import {saveOrUpdateTicket} from '../erplist.api';
-    //接收主表id
-    const orderId = inject('orderId');
-    // 声明Emits
-    const emit = defineEmits(['success', 'register']);
-    const isUpdate = ref(true);
-    //表单配置
-    const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
-        labelWidth: 150,
-        schemas: ticketFormSchema,
-        showActionButtonGroup: false,
-    });
-    //表单赋值
-    const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-        //重置表单
-        await resetFields();
-        setModalProps({confirmLoading: false});
-        isUpdate.value = !!data?.isUpdate;
-        if (unref(isUpdate)) {
-            //表单赋值
-            await setFieldsValue({
-                ...data.record,
-            });
-        }
-    });
-    //设置标题
-    const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
-
-    //表单提交事件
-    async function handleSubmit() {
-        try {
-            const values = await validate();
-            setModalProps({confirmLoading: true});
-            if (unref(orderId)) {
-                values.orderId = unref(orderId);
-            }
-            //提交表单
-            await saveOrUpdateTicket(values, isUpdate.value);
-            //关闭弹窗
-            closeModal();
-            //刷新列表
-            emit('success');
-        } finally {
-            setModalProps({confirmLoading: false});
-        }
+  import { ref, computed, unref, inject } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { ticketFormSchema } from '../erplist.data';
+  import { saveOrUpdateTicket } from '../erplist.api';
+  //接收主表id
+  const orderId = inject('orderId');
+  // 声明Emits
+  const emit = defineEmits(['success', 'register']);
+  const isUpdate = ref(true);
+  //表单配置
+  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
+    labelWidth: 150,
+    schemas: ticketFormSchema,
+    showActionButtonGroup: false,
+  });
+  //表单赋值
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    //重置表单
+    await resetFields();
+    setModalProps({ confirmLoading: false });
+    isUpdate.value = !!data?.isUpdate;
+    if (unref(isUpdate)) {
+      //表单赋值
+      await setFieldsValue({
+        ...data.record,
+      });
     }
+  });
+  //设置标题
+  const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
+
+  //表单提交事件
+  async function handleSubmit() {
+    try {
+      const values = await validate();
+      setModalProps({ confirmLoading: true });
+      if (unref(orderId)) {
+        values.orderId = unref(orderId);
+      }
+      //提交表单
+      await saveOrUpdateTicket(values, isUpdate.value);
+      //关闭弹窗
+      closeModal();
+      //刷新列表
+      emit('success');
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
+  }
 </script>
diff --git a/src/views/demo/jeecg/erplist/erplist.api.ts b/src/views/demo/jeecg/erplist/erplist.api.ts
index f5fa869..ca9509d 100644
--- a/src/views/demo/jeecg/erplist/erplist.api.ts
+++ b/src/views/demo/jeecg/erplist/erplist.api.ts
@@ -1,144 +1,139 @@
-import {defHttp} from '/@/utils/http/axios';
-import {Modal} from 'ant-design-vue';
+import { defHttp } from '/@/utils/http/axios';
+import { Modal } from 'ant-design-vue';
 
 enum Api {
-    list = '/test/order/orderList',
-    save = '/test/order/add',
-    edit = '/test/order/edit',
-    deleteOne = '/test/order/delete',
-    deleteBatch = '/test/order/deleteBatch',
-    customList = '/test/order/listOrderCustomerByMainId',
-    saveCustomer = '/test/order/addCustomer',
-    editCustomer = '/test/order/editCustomer',
-    deleteCustomer = '/test/order/deleteCustomer',
-    deleteBatchCustomer = '/test/order/deleteBatchCustomer',
-    ticketList = '/test/order/listOrderTicketByMainId',
-    saveTicket = '/test/order/addTicket',
-    editTicket = '/test/order/editTicket',
-    deleteTicket = '/test/order/deleteTicket',
-    deleteBatchTicket = '/test/order/deleteBatchTicket',
+  list = '/test/order/orderList',
+  save = '/test/order/add',
+  edit = '/test/order/edit',
+  deleteOne = '/test/order/delete',
+  deleteBatch = '/test/order/deleteBatch',
+  customList = '/test/order/listOrderCustomerByMainId',
+  saveCustomer = '/test/order/addCustomer',
+  editCustomer = '/test/order/editCustomer',
+  deleteCustomer = '/test/order/deleteCustomer',
+  deleteBatchCustomer = '/test/order/deleteBatchCustomer',
+  ticketList = '/test/order/listOrderTicketByMainId',
+  saveTicket = '/test/order/addTicket',
+  editTicket = '/test/order/editTicket',
+  deleteTicket = '/test/order/deleteTicket',
+  deleteBatchTicket = '/test/order/deleteBatchTicket',
 }
 
 /**
  * 列表接口
  * @param params
  */
-export const list = (params) =>
-    defHttp.get({url: Api.list, params});
+export const list = (params) => defHttp.get({ url: Api.list, params });
 
 /**
  * 删除
  */
 export const deleteOne = (params, handleSuccess) => {
-    return defHttp.delete({url: Api.deleteOne, params}, {joinParamsToUrl: true}).then(() => {
-        handleSuccess();
-    });
-}
+  return defHttp.delete({ url: Api.deleteOne, params }, { joinParamsToUrl: true }).then(() => {
+    handleSuccess();
+  });
+};
 /**
  * 批量删除
  * @param params
  */
 export const batchDelete = (params, handleSuccess) => {
-    Modal.confirm({
-        title: '确认删除',
-        content: '是否删除选中数据',
-        okText: '确认',
-        cancelText: '取消',
-        onOk: () => {
-            return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
-                handleSuccess();
-            });
-        }
-    });
-}
+  Modal.confirm({
+    title: '确认删除',
+    content: '是否删除选中数据',
+    okText: '确认',
+    cancelText: '取消',
+    onOk: () => {
+      return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => {
+        handleSuccess();
+      });
+    },
+  });
+};
 /**
  * 保存或者更新
  * @param params
  */
 export const saveOrUpdate = (params, isUpdate) => {
-    let url = isUpdate ? Api.edit : Api.save;
-    return defHttp.post({url: url, params});
-}
+  let url = isUpdate ? Api.edit : Api.save;
+  return defHttp.post({ url: url, params });
+};
 
 /**
  * 列表接口
  * @param params
  */
-export const customList = (params) =>
-    defHttp.get({url: Api.customList, params});
-
+export const customList = (params) => defHttp.get({ url: Api.customList, params });
 
 /**
  * 删除
  */
 export const deleteCustomer = (params, handleSuccess) => {
-    return defHttp.delete({url: Api.deleteCustomer, params}, {joinParamsToUrl: true}).then(() => {
-        handleSuccess();
-    });
-}
+  return defHttp.delete({ url: Api.deleteCustomer, params }, { joinParamsToUrl: true }).then(() => {
+    handleSuccess();
+  });
+};
 /**
  * 批量删除
  * @param params
  */
 export const deleteBatchCustomer = (params, handleSuccess) => {
-    Modal.confirm({
-        title: '确认删除',
-        content: '是否删除选中数据',
-        okText: '确认',
-        cancelText: '取消',
-        onOk: () => {
-            return defHttp.delete({url: Api.deleteBatchCustomer, data: params}, {joinParamsToUrl: true}).then(() => {
-                handleSuccess();
-            });
-        }
-    });
-}
+  Modal.confirm({
+    title: '确认删除',
+    content: '是否删除选中数据',
+    okText: '确认',
+    cancelText: '取消',
+    onOk: () => {
+      return defHttp.delete({ url: Api.deleteBatchCustomer, data: params }, { joinParamsToUrl: true }).then(() => {
+        handleSuccess();
+      });
+    },
+  });
+};
 /**
  * 保存或者更新
  * @param params
  */
 export const saveOrUpdateCustomer = (params, isUpdate) => {
-    let url = isUpdate ? Api.editCustomer : Api.saveCustomer;
-    return defHttp.post({url: url, params});
-}
+  let url = isUpdate ? Api.editCustomer : Api.saveCustomer;
+  return defHttp.post({ url: url, params });
+};
 /**
  * 列表接口
  * @param params
  */
-export const ticketList = (params) =>
-    defHttp.get({url: Api.ticketList, params});
-
+export const ticketList = (params) => defHttp.get({ url: Api.ticketList, params });
 
 /**
  * 删除
  */
 export const deleteTicket = (params, handleSuccess) => {
-    return defHttp.delete({url: Api.deleteTicket, params}, {joinParamsToUrl: true}).then(() => {
-        handleSuccess();
-    });
-}
+  return defHttp.delete({ url: Api.deleteTicket, params }, { joinParamsToUrl: true }).then(() => {
+    handleSuccess();
+  });
+};
 /**
  * 批量删除
  * @param params
  */
 export const deleteBatchTicket = (params, handleSuccess) => {
-    Modal.confirm({
-        title: '确认删除',
-        content: '是否删除选中数据',
-        okText: '确认',
-        cancelText: '取消',
-        onOk: () => {
-            return defHttp.delete({url: Api.deleteBatchTicket, data: params}, {joinParamsToUrl: true}).then(() => {
-                handleSuccess();
-            });
-        }
-    });
-}
+  Modal.confirm({
+    title: '确认删除',
+    content: '是否删除选中数据',
+    okText: '确认',
+    cancelText: '取消',
+    onOk: () => {
+      return defHttp.delete({ url: Api.deleteBatchTicket, data: params }, { joinParamsToUrl: true }).then(() => {
+        handleSuccess();
+      });
+    },
+  });
+};
 /**
  * 保存或者更新
  * @param params
  */
 export const saveOrUpdateTicket = (params, isUpdate) => {
-    let url = isUpdate ? Api.editTicket : Api.saveTicket;
-    return defHttp.post({url: url, params});
-}
+  let url = isUpdate ? Api.editTicket : Api.saveTicket;
+  return defHttp.post({ url: url, params });
+};
diff --git a/src/views/demo/jeecg/erplist/erplist.data.ts b/src/views/demo/jeecg/erplist/erplist.data.ts
index d3ca255..275891b 100644
--- a/src/views/demo/jeecg/erplist/erplist.data.ts
+++ b/src/views/demo/jeecg/erplist/erplist.data.ts
@@ -1,239 +1,238 @@
-import {BasicColumn} from '/@/components/Table';
-import {FormSchema} from '/@/components/Table';
-import {render} from "/@/utils/common/renderUtils";
+import { BasicColumn } from '/@/components/Table';
+import { FormSchema } from '/@/components/Table';
+import { render } from '/@/utils/common/renderUtils';
 
 export const columns: BasicColumn[] = [
-    {
-        title: '订单号',
-        dataIndex: 'orderCode',
-        width: 260,
+  {
+    title: '订单号',
+    dataIndex: 'orderCode',
+    width: 260,
+  },
+  {
+    title: '订单类型',
+    dataIndex: 'ctype',
+    width: 160,
+    customRender: ({ text }) => {
+      return text == '1' ? '国内订单' : text == '2' ? '国际订单' : '';
     },
-    {
-        title: '订单类型',
-        dataIndex: 'ctype',
-        width: 160,
-        customRender: ({text}) => {
-            return text == '1' ? '国内订单' : text == '2' ? "国际订单" : ''
-        }
-    },
-    {
-        title: '订单日期',
-        dataIndex: 'orderDate',
-        width: 300,
-    },
-    {
-        title: '订单金额',
-        width: 200,
-        dataIndex: 'orderMoney',
-    },
-    {
-        title: '订单备注',
-        width: 200,
-        dataIndex: 'content',
-    }
+  },
+  {
+    title: '订单日期',
+    dataIndex: 'orderDate',
+    width: 300,
+  },
+  {
+    title: '订单金额',
+    width: 200,
+    dataIndex: 'orderMoney',
+  },
+  {
+    title: '订单备注',
+    width: 200,
+    dataIndex: 'content',
+  },
 ];
 
-
 export const searchFormSchema: FormSchema[] = [
-    {
-        label: '订单号',
-        field: 'orderCode',
-        component: 'Input',
-        colProps: {span: 6}
-    },
-    {
-        label: '订单类型',
-        field: 'ctype',
-        component: 'Select',
-        componentProps: {
-            options: [
-                {
-                    label: '国内订单',
-                    value: '1',
-                    key: '1',
-                },
-                {
-                    label: '国际订单',
-                    value: '2',
-                    key: '2',
-                },
-            ],
+  {
+    label: '订单号',
+    field: 'orderCode',
+    component: 'Input',
+    colProps: { span: 6 },
+  },
+  {
+    label: '订单类型',
+    field: 'ctype',
+    component: 'Select',
+    componentProps: {
+      options: [
+        {
+          label: '国内订单',
+          value: '1',
+          key: '1',
         },
-        colProps: {span: 6},
-    }
+        {
+          label: '国际订单',
+          value: '2',
+          key: '2',
+        },
+      ],
+    },
+    colProps: { span: 6 },
+  },
 ];
 
 export const formSchema: FormSchema[] = [
-    {
-        label: '',
-        field: 'id',
-        component: 'Input',
-        show: false
-    },
-    {
-        label: '订单号',
-        field: 'orderCode',
-        component: 'Input',
-        required: true
-    },
-    {
-        label: '订单类型',
-        field: 'ctype',
-        component: 'Select',
-        componentProps: {
-            options: [
-                {
-                    label: '国内订单',
-                    value: '1',
-                    key: '1',
-                },
-                {
-                    label: '国际订单',
-                    value: '2',
-                    key: '2',
-                },
-            ],
+  {
+    label: '',
+    field: 'id',
+    component: 'Input',
+    show: false,
+  },
+  {
+    label: '订单号',
+    field: 'orderCode',
+    component: 'Input',
+    required: true,
+  },
+  {
+    label: '订单类型',
+    field: 'ctype',
+    component: 'Select',
+    componentProps: {
+      options: [
+        {
+          label: '国内订单',
+          value: '1',
+          key: '1',
         },
-    },
-    {
-        label: '订单日期',
-        field: 'orderDate',
-        component: 'DatePicker',
-        componentProps: {
-            valueFormat: 'YYYY-MM-DD hh:mm:ss',
+        {
+          label: '国际订单',
+          value: '2',
+          key: '2',
         },
+      ],
     },
-    {
-        label: '订单金额',
-        field: 'orderMoney',
-        component: 'InputNumber',
+  },
+  {
+    label: '订单日期',
+    field: 'orderDate',
+    component: 'DatePicker',
+    componentProps: {
+      valueFormat: 'YYYY-MM-DD hh:mm:ss',
     },
-    {
-        label: '订单备注',
-        field: 'content',
-        component: 'Input',
-    }
+  },
+  {
+    label: '订单金额',
+    field: 'orderMoney',
+    component: 'InputNumber',
+  },
+  {
+    label: '订单备注',
+    field: 'content',
+    component: 'Input',
+  },
 ];
 
 export const customColumns: BasicColumn[] = [
-    {
-        title: '客户名',
-        dataIndex: 'name',
-        width: 260,
+  {
+    title: '客户名',
+    dataIndex: 'name',
+    width: 260,
+  },
+  {
+    title: '性别',
+    dataIndex: 'sex',
+    width: 100,
+    customRender: ({ text }) => {
+      return render.renderDict(text, 'sex');
     },
-    {
-        title: '性别',
-        dataIndex: 'sex',
-        width: 100,
-        customRender: ({text}) => {
-            return render.renderDict(text, 'sex')
-        }
-    },
-    {
-        title: '身份证号',
-        dataIndex: 'idcard',
-        width: 300,
-    },
-    {
-        title: '电话',
-        width: 200,
-        dataIndex: 'telphone',
-    }
+  },
+  {
+    title: '身份证号',
+    dataIndex: 'idcard',
+    width: 300,
+  },
+  {
+    title: '电话',
+    width: 200,
+    dataIndex: 'telphone',
+  },
 ];
 
 export const customerFormSchema: FormSchema[] = [
-    {
-        label: '',
-        field: 'id',
-        component: 'Input',
-        show: false
+  {
+    label: '',
+    field: 'id',
+    component: 'Input',
+    show: false,
+  },
+  {
+    label: '客户姓名',
+    field: 'name',
+    component: 'Input',
+    required: true,
+  },
+  {
+    label: '性别',
+    field: 'sex',
+    component: 'JDictSelectTag',
+    componentProps: {
+      dictCode: 'sex',
+      placeholder: '请选择性别',
     },
-    {
-        label: '客户姓名',
-        field: 'name',
-        component: 'Input',
-        required: true
+  },
+  {
+    label: '身份证号码',
+    field: 'idcard',
+    component: 'Input',
+  },
+  {
+    label: '身份证扫描件',
+    field: 'idcardPic',
+    component: 'JImageUpload',
+    componentProps: {
+      fileMax: 2,
     },
-    {
-        label: '性别',
-        field: 'sex',
-        component: 'JDictSelectTag',
-        componentProps: {
-            dictCode: 'sex',
-            placeholder: '请选择性别',
-        },
-    },
-    {
-        label: '身份证号码',
-        field: 'idcard',
-        component: 'Input',
-    },
-    {
-        label: '身份证扫描件',
-        field: 'idcardPic',
-        component: 'JImageUpload',
-        componentProps: {
-            fileMax: 2
-        },
-    },
-    {
-        label: '联系方式',
-        field: 'telphone',
-        component: 'Input',
-        rules: [{required: false, pattern: /^1[3|4|5|7|8|9][0-9]\d{8}$/, message: '手机号码格式有误'}],
-    },
-    {
-        label: 'orderId',
-        field: 'orderId',
-        component: 'Input',
-        show: false
-    }
+  },
+  {
+    label: '联系方式',
+    field: 'telphone',
+    component: 'Input',
+    rules: [{ required: false, pattern: /^1[3|4|5|7|8|9][0-9]\d{8}$/, message: '手机号码格式有误' }],
+  },
+  {
+    label: 'orderId',
+    field: 'orderId',
+    component: 'Input',
+    show: false,
+  },
 ];
 
 export const ticketColumns: BasicColumn[] = [
-    {
-        title: '航班号',
-        dataIndex: 'ticketCode',
-    },
-    {
-        title: '航班时间',
-        dataIndex: 'tickectDate',
-    },
-    {
-        title: '创建人',
-        dataIndex: 'createBy',
-    },
-    {
-        title: '创建时间',
-        dataIndex: 'createTime',
-    }
+  {
+    title: '航班号',
+    dataIndex: 'ticketCode',
+  },
+  {
+    title: '航班时间',
+    dataIndex: 'tickectDate',
+  },
+  {
+    title: '创建人',
+    dataIndex: 'createBy',
+  },
+  {
+    title: '创建时间',
+    dataIndex: 'createTime',
+  },
 ];
 
 export const ticketFormSchema: FormSchema[] = [
-    {
-        label: '',
-        field: 'id',
-        component: 'Input',
-        show: false
+  {
+    label: '',
+    field: 'id',
+    component: 'Input',
+    show: false,
+  },
+  {
+    label: '航班号',
+    field: 'ticketCode',
+    component: 'Input',
+    required: true,
+  },
+  {
+    label: '航班时间',
+    field: 'tickectDate',
+    component: 'DatePicker',
+    componentProps: {
+      valueFormat: 'YYYY-MM-DD hh:mm:ss',
     },
-    {
-        label: '航班号',
-        field: 'ticketCode',
-        component: 'Input',
-        required: true
-    },
-    {
-        label: '航班时间',
-        field: 'tickectDate',
-        component: 'DatePicker',
-        componentProps: {
-            valueFormat: 'YYYY-MM-DD hh:mm:ss',
-        },
-    },
-    {
-        label: 'orderId',
-        field: 'orderId',
-        component: 'Input',
-        show: false
-    }
+  },
+  {
+    label: 'orderId',
+    field: 'orderId',
+    component: 'Input',
+    show: false,
+  },
 ];
diff --git a/src/views/demo/jeecg/erplist/index.vue b/src/views/demo/jeecg/erplist/index.vue
index 6a48fd0..b1219d2 100644
--- a/src/views/demo/jeecg/erplist/index.vue
+++ b/src/views/demo/jeecg/erplist/index.vue
@@ -1,160 +1,160 @@
 <template>
-    <div>
-        <!--主表表格-->
-        <BasicTable @register="registerTable" :rowSelection="rowSelection">
-            <!--插槽:table标题-->
-            <template #tableTitle>
-                <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增</a-button>
-                <a-dropdown v-if="selectedRowKeys.length > 0">
-                    <template #overlay>
-                        <a-menu>
-                            <a-menu-item key="1" @click="batchHandleDelete">
-                                <Icon icon="ant-design:delete-outlined"></Icon>
-                                删除
-                            </a-menu-item>
-                        </a-menu>
-                    </template>
-                    <a-button>批量操作
-                        <Icon icon="mdi:chevron-down"></Icon>
-                    </a-button>
-                </a-dropdown>
-            </template>
-            <!--操作栏-->
-            <template #action="{ record }">
-                <TableAction :actions="getTableAction(record)"/>
-            </template>
-        </BasicTable>
-        <!--子表表格tab-->
-        <a-tabs defaultActiveKey="1" style="margin: 10px">
-            <a-tab-pane tab="客户信息" key="1">
-                <JeecgOrderCustomerList/>
-            </a-tab-pane>
-            <a-tab-pane tab="机票信息" key="2" forceRender>
-                <JeecgOrderTicketList/>
-            </a-tab-pane>
-        </a-tabs>
-    </div>
-    <!-- 表单区域 -->
-    <JeecgOrderModal @register="registerModal" @success="handleSuccess"></JeecgOrderModal>
+  <div>
+    <!--主表表格-->
+    <BasicTable @register="registerTable" :rowSelection="rowSelection">
+      <!--插槽:table标题-->
+      <template #tableTitle>
+        <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增</a-button>
+        <a-dropdown v-if="selectedRowKeys.length > 0">
+          <template #overlay>
+            <a-menu>
+              <a-menu-item key="1" @click="batchHandleDelete">
+                <Icon icon="ant-design:delete-outlined"></Icon>
+                删除
+              </a-menu-item>
+            </a-menu>
+          </template>
+          <a-button
+            >批量操作
+            <Icon icon="mdi:chevron-down"></Icon>
+          </a-button>
+        </a-dropdown>
+      </template>
+      <!--操作栏-->
+      <template #action="{ record }">
+        <TableAction :actions="getTableAction(record)" />
+      </template>
+    </BasicTable>
+    <!--子表表格tab-->
+    <a-tabs defaultActiveKey="1" style="margin: 10px">
+      <a-tab-pane tab="客户信息" key="1">
+        <JeecgOrderCustomerList />
+      </a-tab-pane>
+      <a-tab-pane tab="机票信息" key="2" forceRender>
+        <JeecgOrderTicketList />
+      </a-tab-pane>
+    </a-tabs>
+  </div>
+  <!-- 表单区域 -->
+  <JeecgOrderModal @register="registerModal" @success="handleSuccess"></JeecgOrderModal>
 </template>
 
 <script lang="ts" name="tab-list" setup>
-    //ts语法
-    import {ref, computed, unref, watch, provide} from 'vue';
-    import {BasicTable, TableAction} from '/@/components/Table';
-    import {useListPage} from '/@/hooks/system/useListPage'
-    import {useModal} from '/@/components/Modal';
-    import JeecgOrderModal from './components/JeecgOrderModal.vue';
-    import JeecgOrderCustomerList from './JeecgOrderCustomerList.vue';
-    import JeecgOrderTicketList from './JeecgOrderTicketList.vue';
-    import {columns, searchFormSchema} from './erplist.data';
-    import {list, deleteOne, batchDelete} from './erplist.api';
+  //ts语法
+  import { ref, computed, unref, watch, provide } from 'vue';
+  import { BasicTable, TableAction } from '/@/components/Table';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import { useModal } from '/@/components/Modal';
+  import JeecgOrderModal from './components/JeecgOrderModal.vue';
+  import JeecgOrderCustomerList from './JeecgOrderCustomerList.vue';
+  import JeecgOrderTicketList from './JeecgOrderTicketList.vue';
+  import { columns, searchFormSchema } from './erplist.data';
+  import { list, deleteOne, batchDelete } from './erplist.api';
 
-    //弹窗model
-    const [registerModal, {openModal}] = useModal();
+  //弹窗model
+  const [registerModal, { openModal }] = useModal();
 
-    // 列表页面公共参数、方法
-    const {tableContext} = useListPage({
-        tableProps: {
-            api: list,
-            columns: columns,
-            canResize: false,
-            rowSelection: {type: 'radio'},
-            formConfig: {
-                schemas: searchFormSchema,
-            },
-            actionColumn: {
-                width: 180,
-            },
-            pagination:{
-                current: 1,
-                pageSize: 5,
-                pageSizeOptions: ['5', '10', '20'],
-            }
-        },
+  // 列表页面公共参数、方法
+  const { tableContext } = useListPage({
+    tableProps: {
+      api: list,
+      columns: columns,
+      canResize: false,
+      rowSelection: { type: 'radio' },
+      formConfig: {
+        schemas: searchFormSchema,
+      },
+      actionColumn: {
+        width: 180,
+      },
+      pagination: {
+        current: 1,
+        pageSize: 5,
+        pageSizeOptions: ['5', '10', '20'],
+      },
+    },
+  });
+  //注册table数据
+  const [registerTable, { reload, updateTableDataRecord }, { rowSelection, selectedRowKeys }] = tableContext;
+
+  const orderId = computed(() => (unref(selectedRowKeys).length > 0 ? unref(selectedRowKeys)[0] : ''));
+  //下发 orderId,子组件接收
+  provide('orderId', orderId);
+
+  /**
+   * 新增事件
+   */
+  function handleCreate() {
+    openModal(true, {
+      isUpdate: false,
+      showFooter: true,
     });
-    //注册table数据
-    const [registerTable, {reload, updateTableDataRecord}, {rowSelection, selectedRowKeys}] = tableContext
+  }
 
-    const orderId = computed(() => (unref(selectedRowKeys).length > 0 ? unref(selectedRowKeys)[0] : ''));
-    //下发 orderId,子组件接收
-    provide('orderId', orderId);
+  /**
+   * 编辑事件
+   */
+  async function handleEdit(record: Recordable) {
+    openModal(true, {
+      record,
+      isUpdate: true,
+      showFooter: true,
+    });
+  }
 
-    /**
-     * 新增事件
-     */
-    function handleCreate() {
-        openModal(true, {
-            isUpdate: false,
-            showFooter: true,
-        });
-    }
+  /**
+   * 详情
+   */
+  async function handleDetail(record: Recordable) {
+    openModal(true, {
+      record,
+      isUpdate: true,
+      showFooter: false,
+    });
+  }
 
-    /**
-     * 编辑事件
-     */
-    async function handleEdit(record: Recordable) {
-        openModal(true, {
-            record,
-            isUpdate: true,
-            showFooter: true,
-        });
-    }
+  /**
+   * 删除事件
+   */
+  async function handleDelete(record) {
+    await deleteOne({ id: record.id }, reload);
+  }
 
-    /**
-     * 详情
-     */
-    async function handleDetail(record: Recordable) {
-        openModal(true, {
-            record,
-            isUpdate: true,
-            showFooter: false,
-        });
-    }
+  /**
+   * 批量删除事件
+   */
+  async function batchHandleDelete() {
+    await batchDelete({ ids: selectedRowKeys.value }, () => {
+      selectedRowKeys.value = [];
+      reload();
+    });
+  }
 
-    /**
-     * 删除事件
-     */
-    async function handleDelete(record) {
-        await deleteOne({id: record.id}, reload);
-    }
+  /**
+   * 成功回调
+   */
+  function handleSuccess() {
+    reload();
+  }
 
-    /**
-     * 批量删除事件
-     */
-    async function batchHandleDelete() {
-        await batchDelete({ids: selectedRowKeys.value}, () => {
-            selectedRowKeys.value = []
-            reload()
-        })
-    }
-
-    /**
-     * 成功回调
-     */
-    function handleSuccess() {
-        reload();
-    }
-
-    /**
-     * 操作栏
-     */
-    function getTableAction(record) {
-        return [
-            {
-                label: '编辑',
-                onClick: handleEdit.bind(null, record),
-            }, {
-                label: '删除',
-                popConfirm: {
-                    title: '是否确认删除',
-                    confirm: handleDelete.bind(null, record),
-                },
-            }
-        ]
-    }
+  /**
+   * 操作栏
+   */
+  function getTableAction(record) {
+    return [
+      {
+        label: '编辑',
+        onClick: handleEdit.bind(null, record),
+      },
+      {
+        label: '删除',
+        popConfirm: {
+          title: '是否确认删除',
+          confirm: handleDelete.bind(null, record),
+        },
+      },
+    ];
+  }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/views/demo/jeecg/index.vue b/src/views/demo/jeecg/index.vue
index b88539b..e0bb1a2 100644
--- a/src/views/demo/jeecg/index.vue
+++ b/src/views/demo/jeecg/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="p-4">
-    <a-card :bordered="false" style="height: 100%;">
+    <a-card :bordered="false" style="height: 100%">
       <a-tabs v-model:activeKey="activeKey" @change="tabChange">
         <a-tab-pane key="JeecgComponents" tab="下拉选择组件"></a-tab-pane>
         <a-tab-pane key="JCodeEditDemo" tab="代码编辑器" force-render></a-tab-pane>
@@ -24,28 +24,31 @@
   import JeecgPdfView from './JeecgPdfView.vue';
   import JUploadDemo from './JUploadDemo.vue';
   export default defineComponent({
-    name:"comp-jeecg-basic",
+    name: 'comp-jeecg-basic',
     setup() {
       const activeKey = ref('JeecgComponents');
       const currentComponent = computed(() => {
         const componentType = {
-          'JeecgComponents': JeecgComponents,
-          'JEditorDemo': JEditorDemo,
-          'JCodeEditDemo': JCodeEditDemo,
-          'ImgDragSort': ImgDragSort,
-          'ImgTurnPage': ImgTurnPage,
-          'JeecgPdfView': JeecgPdfView,
-          'JUploadDemo': JUploadDemo,
+          JeecgComponents: JeecgComponents,
+          JEditorDemo: JEditorDemo,
+          JCodeEditDemo: JCodeEditDemo,
+          ImgDragSort: ImgDragSort,
+          ImgTurnPage: ImgTurnPage,
+          JeecgPdfView: JeecgPdfView,
+          JUploadDemo: JUploadDemo,
         };
         return componentType[activeKey.value];
       });
 
       //使用component动态切换tab
       function tabChange(key) {
-        activeKey.value=key
+        activeKey.value = key;
       }
       return {
-        activeKey, currentComponent, tabChange,activeKey
+        activeKey,
+        currentComponent,
+        tabChange,
+        activeKey,
       };
     },
   });
diff --git a/src/views/demo/jeecg/model/JeecgOrderModal.vue b/src/views/demo/jeecg/model/JeecgOrderModal.vue
index 489d7f7..760242b 100644
--- a/src/views/demo/jeecg/model/JeecgOrderModal.vue
+++ b/src/views/demo/jeecg/model/JeecgOrderModal.vue
@@ -1,94 +1,94 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit" width="700px">
-        <BasicForm @register="registerForm"/>
-        <!--TODO 子表Tab数据-->
-    </BasicModal>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit" width="700px">
+    <BasicForm @register="registerForm" />
+    <!--TODO 子表Tab数据-->
+  </BasicModal>
 </template>
 <script lang="ts" setup>
-    import {ref, computed, unref} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {BasicForm, useForm} from '/@/components/Form/index';
-    import {defHttp} from '/@/utils/http/axios';
-    // Emits声明
-    const emit = defineEmits(['register','success']);
-    const isUpdate = ref(true);
-    //表单配置
-    const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
-        labelWidth: 150,
-        schemas: [
-            {
-                field: 'orderCode',
-                label: '订单号',
-                component: 'Input',
-                required:true
-            },
-            {
-                field: 'ctype',
-                label: '订单类型',
-                component: 'Select',
-                componentProps: {
-                    options: [
-                        {label: '国内订单', value: '1'},
-                        {label: '国际订单', value: '2'},
-                    ],
-                },
-            },
-            {
-                field: 'orderDate',
-                label: '订单日期',
-                component: 'DatePicker',
-                componentProps: {
-                    valueFormat: 'YYYY-MM-DD hh:mm:ss',
-                },
-            },
-            {
-                field: 'orderMoney',
-                label: '订单金额',
-                component: 'InputNumber',
-            },
-            {
-                field: 'content',
-                label: '订单备注',
-                component: 'Input',
-            },
-            {
-                field: 'id',
-                label: 'id',
-                component: 'Input',
-                show:false
-            }
-        ],
-        showActionButtonGroup: false,
-    });
-    //表单赋值
-    const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-        //重置表单
-        await resetFields();
-        setModalProps({confirmLoading: false});
-        isUpdate.value = !!data?.isUpdate;
-        if (unref(isUpdate)) {
-            //表单赋值
-            await setFieldsValue({
-                ...data.record,
-            });
-        }
-    });
-    //设置标题
-    const title = computed(() => (!unref(isUpdate) ? '新增订单' : '编辑订单'));
-    //表单提交事件
-    async function handleSubmit(v) {
-        try {
-            let values = await validate();
-            setModalProps({confirmLoading: true});
-            //提交表单
-            let url = unref(isUpdate) ? '/test/order/edit' : '/test/order/add';
-            defHttp.post({url: url, params:values});
-            //关闭弹窗
-            closeModal();
-            //刷新列表
-            emit('success');
-        } finally {
-            setModalProps({confirmLoading: false});
-        }
+  import { ref, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { defHttp } from '/@/utils/http/axios';
+  // Emits声明
+  const emit = defineEmits(['register', 'success']);
+  const isUpdate = ref(true);
+  //表单配置
+  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
+    labelWidth: 150,
+    schemas: [
+      {
+        field: 'orderCode',
+        label: '订单号',
+        component: 'Input',
+        required: true,
+      },
+      {
+        field: 'ctype',
+        label: '订单类型',
+        component: 'Select',
+        componentProps: {
+          options: [
+            { label: '国内订单', value: '1' },
+            { label: '国际订单', value: '2' },
+          ],
+        },
+      },
+      {
+        field: 'orderDate',
+        label: '订单日期',
+        component: 'DatePicker',
+        componentProps: {
+          valueFormat: 'YYYY-MM-DD hh:mm:ss',
+        },
+      },
+      {
+        field: 'orderMoney',
+        label: '订单金额',
+        component: 'InputNumber',
+      },
+      {
+        field: 'content',
+        label: '订单备注',
+        component: 'Input',
+      },
+      {
+        field: 'id',
+        label: 'id',
+        component: 'Input',
+        show: false,
+      },
+    ],
+    showActionButtonGroup: false,
+  });
+  //表单赋值
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    //重置表单
+    await resetFields();
+    setModalProps({ confirmLoading: false });
+    isUpdate.value = !!data?.isUpdate;
+    if (unref(isUpdate)) {
+      //表单赋值
+      await setFieldsValue({
+        ...data.record,
+      });
     }
+  });
+  //设置标题
+  const title = computed(() => (!unref(isUpdate) ? '新增订单' : '编辑订单'));
+  //表单提交事件
+  async function handleSubmit(v) {
+    try {
+      let values = await validate();
+      setModalProps({ confirmLoading: true });
+      //提交表单
+      let url = unref(isUpdate) ? '/test/order/edit' : '/test/order/add';
+      defHttp.post({ url: url, params: values });
+      //关闭弹窗
+      closeModal();
+      //刷新列表
+      emit('success');
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
+  }
 </script>
diff --git a/src/views/demo/page/account/center/Application.vue b/src/views/demo/page/account/center/Application.vue
index 636e57c..ae0e281 100644
--- a/src/views/demo/page/account/center/Application.vue
+++ b/src/views/demo/page/account/center/Application.vue
@@ -15,11 +15,7 @@
               <div :class="`${prefixCls}__card-num`">
                 新增用户：<span>{{ item.new }}</span>
               </div>
-              <Icon
-                :class="`${prefixCls}__card-download`"
-                v-if="item.download"
-                :icon="item.download"
-              />
+              <Icon :class="`${prefixCls}__card-download`" v-if="item.download" :icon="item.download" />
             </Card>
           </ListItem>
         </a-col>
diff --git a/src/views/demo/page/account/center/Article.vue b/src/views/demo/page/account/center/Article.vue
index 505f16d..7addc32 100644
--- a/src/views/demo/page/account/center/Article.vue
+++ b/src/views/demo/page/account/center/Article.vue
@@ -24,12 +24,7 @@
         <div>
           <template v-for="action in actions" :key="action.text">
             <div :class="`${prefixCls}__action`">
-              <Icon
-                v-if="action.icon"
-                :class="`${prefixCls}__action-icon`"
-                :icon="action.icon"
-                :color="action.color"
-              />
+              <Icon v-if="action.icon" :class="`${prefixCls}__action-icon`" :icon="action.icon" :color="action.color" />
               {{ action.text }}
             </div>
           </template>
diff --git a/src/views/demo/page/account/center/data.tsx b/src/views/demo/page/account/center/data.tsx
index 37b919c..e8251b3 100644
--- a/src/views/demo/page/account/center/data.tsx
+++ b/src/views/demo/page/account/center/data.tsx
@@ -10,15 +10,7 @@ export interface TabItem {
   component: string;
 }
 
-export const tags: string[] = [
-  '很有想法的',
-  '专注设计',
-  '川妹子',
-  '大长腿',
-  '海纳百川',
-  '前端开发',
-  'vue3',
-];
+export const tags: string[] = ['很有想法的', '专注设计', '川妹子', '大长腿', '海纳百川', '前端开发', 'vue3'];
 <span class="iconify" data-icon="jam:codepen-circle" data-inline="false"></span>;
 export const teams: ListItem[] = [
   {
diff --git a/src/views/demo/page/account/setting/BaseSetting.vue b/src/views/demo/page/account/setting/BaseSetting.vue
index 4175a74..af81fa8 100644
--- a/src/views/demo/page/account/setting/BaseSetting.vue
+++ b/src/views/demo/page/account/setting/BaseSetting.vue
@@ -7,14 +7,7 @@
       <a-col :span="10">
         <div class="change-avatar">
           <div class="mb-2"> 头像 </div>
-          <CropperAvatar
-            :uploadApi="uploadImg"
-            :value="avatar"
-            btnText="更换头像"
-            :btnProps="{ preIcon: 'ant-design:cloud-upload-outlined' }"
-            @change="updateAvatar"
-            width="150"
-          />
+          <CropperAvatar :uploadApi="uploadImg" :value="avatar" btnText="更换头像" :btnProps="{ preIcon: 'ant-design:cloud-upload-outlined' }" @change="updateAvatar" width="150" />
         </div>
       </a-col>
     </a-row>
@@ -31,11 +24,11 @@
   import { useMessage } from '/@/hooks/web/useMessage';
 
   import headerImg from '/@/assets/images/header.jpg';
-  import {defHttp} from '/@/utils/http/axios';
+  import { defHttp } from '/@/utils/http/axios';
   import { baseSetschemas } from './data';
   import { useUserStore } from '/@/store/modules/user';
   import { uploadImg } from '/@/api/sys/upload';
-  import {getFileAccessHttpUrl} from '/@/utils/common/compUtils'
+  import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
 
   export default defineComponent({
     components: {
@@ -50,7 +43,7 @@
       const { createMessage } = useMessage();
       const userStore = useUserStore();
 
-      const [register, { setFieldsValue,validate }] = useForm({
+      const [register, { setFieldsValue, validate }] = useForm({
         labelWidth: 120,
         schemas: baseSetschemas,
         showActionButtonGroup: false,
@@ -67,28 +60,28 @@
         return getFileAccessHttpUrl(avatar) || headerImg;
       });
 
-      function updateAvatar(src: string, data:string) {
-        console.log("data====》",data)
+      function updateAvatar(src: string, data: string) {
+        console.log('data====》', data);
         const userinfo = userStore.getUserInfo;
         userinfo.avatar = data;
         userStore.setUserInfo(userinfo);
       }
       /**
-       *更新基本信息 
+       *更新基本信息
        * */
       async function handleSubmit() {
-          try {
-              let values = await validate();
-              console.log("values",values);
-              //提交表单
-              defHttp.post({url: '/sys/user/appEdit', params:values});
-              const userinfo = userStore.getUserInfo;
-              Object.assign(userinfo,values);
-              userStore.setUserInfo(userinfo);
-              createMessage.success("更新成功")
-          } catch(e) {
-              console.log("e",e)
-          }
+        try {
+          let values = await validate();
+          console.log('values', values);
+          //提交表单
+          defHttp.post({ url: '/sys/user/appEdit', params: values });
+          const userinfo = userStore.getUserInfo;
+          Object.assign(userinfo, values);
+          userStore.setUserInfo(userinfo);
+          createMessage.success('更新成功');
+        } catch (e) {
+          console.log('e', e);
+        }
       }
 
       return {
@@ -96,7 +89,7 @@
         register,
         uploadImg,
         updateAvatar,
-        handleSubmit
+        handleSubmit,
       };
     },
   });
diff --git a/src/views/demo/page/account/setting/MsgNotify.vue b/src/views/demo/page/account/setting/MsgNotify.vue
index 6ca6e34..c816a6e 100644
--- a/src/views/demo/page/account/setting/MsgNotify.vue
+++ b/src/views/demo/page/account/setting/MsgNotify.vue
@@ -6,12 +6,7 @@
           <ListItemMeta>
             <template #title>
               {{ item.title }}
-              <Switch
-                class="extra"
-                checked-children="开"
-                un-checked-children="关"
-                default-checked
-              />
+              <Switch class="extra" checked-children="开" un-checked-children="关" default-checked />
             </template>
             <template #description>
               <div>{{ item.description }} </div>
diff --git a/src/views/demo/page/account/setting/SecureSetting.vue b/src/views/demo/page/account/setting/SecureSetting.vue
index c41d994..0c95a31 100644
--- a/src/views/demo/page/account/setting/SecureSetting.vue
+++ b/src/views/demo/page/account/setting/SecureSetting.vue
@@ -18,11 +18,11 @@
       </template>
     </List>
   </CollapseContainer>
-  <UpdatePassword ref="updatePasswordRef"/>
+  <UpdatePassword ref="updatePasswordRef" />
 </template>
 <script lang="ts">
   import { List } from 'ant-design-vue';
-  import { defineComponent,ref } from 'vue';
+  import { defineComponent, ref } from 'vue';
   import { CollapseContainer } from '/@/components/Container/index';
 
   import { secureSettingList } from './data';
@@ -30,23 +30,26 @@
   import { useUserStore } from '/@/store/modules/user';
   import { useMessage } from '/@/hooks/web/useMessage';
   export default defineComponent({
-    components: { 
-        CollapseContainer, List, ListItem: List.Item, ListItemMeta: List.Item.Meta ,
-        UpdatePassword: createAsyncComponent(() => import('/@/layouts/default/header/components/user-dropdown/UpdatePassword.vue'))
+    components: {
+      CollapseContainer,
+      List,
+      ListItem: List.Item,
+      ListItemMeta: List.Item.Meta,
+      UpdatePassword: createAsyncComponent(() => import('/@/layouts/default/header/components/user-dropdown/UpdatePassword.vue')),
     },
     setup() {
       const { createMessage } = useMessage();
-      const userStore = useUserStore();  
-      const updatePasswordRef = ref();  
-      function extraClick(key){
-          if(key=='1') {
-              updatePasswordRef.value.show(userStore.getUserInfo.username) 
-          }else{
-              createMessage.warning("暂不支持")
-          }
+      const userStore = useUserStore();
+      const updatePasswordRef = ref();
+      function extraClick(key) {
+        if (key == '1') {
+          updatePasswordRef.value.show(userStore.getUserInfo.username);
+        } else {
+          createMessage.warning('暂不支持');
+        }
       }
       return {
-        updatePasswordRef,  
+        updatePasswordRef,
         extraClick,
         list: secureSettingList,
       };
diff --git a/src/views/demo/page/account/setting/data.ts b/src/views/demo/page/account/setting/data.ts
index 982f5b0..36b1c22 100644
--- a/src/views/demo/page/account/setting/data.ts
+++ b/src/views/demo/page/account/setting/data.ts
@@ -1,5 +1,5 @@
 import { FormSchema } from '/@/components/Form/index';
-import {rules} from "/@/utils/helper/validator";
+import { rules } from '/@/utils/helper/validator';
 
 export interface ListItem {
   key: string;
@@ -22,7 +22,7 @@ export const settingList = [
     name: '安全设置',
     component: 'SecureSetting',
   },
- /* {
+  /* {
     key: '3',
     name: '账号绑定',
     component: 'AccountBind',
@@ -40,8 +40,8 @@ export const baseSetschemas: FormSchema[] = [
     label: '',
     field: 'id',
     component: 'Input',
-    show:false
-  },  
+    show: false,
+  },
   {
     field: 'realname',
     component: 'Input',
@@ -53,9 +53,9 @@ export const baseSetschemas: FormSchema[] = [
     label: '性别',
     component: 'JDictSelectTag',
     componentProps: {
-      dictCode:'sex',
-      placeholder:'请选择性别',
-      stringToNumber:true
+      dictCode: 'sex',
+      placeholder: '请选择性别',
+      stringToNumber: true,
     },
     colProps: { span: 18 },
   },
@@ -63,7 +63,7 @@ export const baseSetschemas: FormSchema[] = [
     label: '生日',
     field: 'birthday',
     component: 'DatePicker',
-    colProps: { span: 18 },    
+    colProps: { span: 18 },
   },
   {
     field: 'email',
@@ -75,14 +75,11 @@ export const baseSetschemas: FormSchema[] = [
     field: 'phone',
     component: 'Input',
     label: '联系电话',
-    dynamicRules: ({model,schema}) => {
-      return [
-          {...rules.duplicateCheckRule( "sys_user", "phone",model,schema,false)[0]},
-          { pattern: /^1[3|4|5|7|8|9][0-9]\d{8}$/, message: '手机号码格式有误' }
-      ];
+    dynamicRules: ({ model, schema }) => {
+      return [{ ...rules.duplicateCheckRule('sys_user', 'phone', model, schema, false)[0] }, { pattern: /^1[3|4|5|7|8|9][0-9]\d{8}$/, message: '手机号码格式有误' }];
     },
     colProps: { span: 18 },
-  }
+  },
 ];
 
 // 安全设置 list
diff --git a/src/views/demo/page/account/setting/index.vue b/src/views/demo/page/account/setting/index.vue
index 108324e..74920b8 100644
--- a/src/views/demo/page/account/setting/index.vue
+++ b/src/views/demo/page/account/setting/index.vue
@@ -40,7 +40,7 @@
         settingList,
         tabBarStyle: {
           width: '220px',
-          marginBottom:'200px'
+          marginBottom: '200px',
         },
       };
     },
diff --git a/src/views/demo/page/desc/basic/index.vue b/src/views/demo/page/desc/basic/index.vue
index 7dfbc56..8f3aa87 100644
--- a/src/views/demo/page/desc/basic/index.vue
+++ b/src/views/demo/page/desc/basic/index.vue
@@ -1,22 +1,8 @@
 <template>
   <PageWrapper title="基础详情页" contentBackground>
-    <Description
-      size="middle"
-      title="退款申请"
-      :bordered="false"
-      :column="3"
-      :data="refundData"
-      :schema="refundSchema"
-    />
+    <Description size="middle" title="退款申请" :bordered="false" :column="3" :data="refundData" :schema="refundSchema" />
     <a-divider />
-    <Description
-      size="middle"
-      title="用户信息"
-      :bordered="false"
-      :column="3"
-      :data="personData"
-      :schema="personSchema"
-    />
+    <Description size="middle" title="用户信息" :bordered="false" :column="3" :data="personData" :schema="personSchema" />
     <a-divider />
 
     <BasicTable @register="registerRefundTable" />
@@ -31,16 +17,7 @@
   import { PageWrapper } from '/@/components/Page';
   import { Divider } from 'ant-design-vue';
 
-  import {
-    refundSchema,
-    refundData,
-    personSchema,
-    personData,
-    refundTableSchema,
-    refundTimeTableSchema,
-    refundTableData,
-    refundTimeTableData,
-  } from './data';
+  import { refundSchema, refundData, personSchema, personData, refundTableSchema, refundTimeTableSchema, refundTableData, refundTimeTableData } from './data';
   export default defineComponent({
     components: { Description, BasicTable, PageWrapper, [Divider.name]: Divider },
     setup() {
diff --git a/src/views/demo/page/desc/high/index.vue b/src/views/demo/page/desc/high/index.vue
index cdbc7d1..301cde3 100644
--- a/src/views/demo/page/desc/high/index.vue
+++ b/src/views/demo/page/desc/high/index.vue
@@ -45,9 +45,7 @@
           <a-descriptions-item label="会员卡号"> XX 32943898021309809423 </a-descriptions-item>
           <a-descriptions-item label="身份证"> 3321944288191034921 </a-descriptions-item>
           <a-descriptions-item label="联系方式"> 18100000000 </a-descriptions-item>
-          <a-descriptions-item label="联系地址" :span="2">
-            曲丽丽 18100000000 浙江省杭州市西湖区黄姑山路工专路交叉路口
-          </a-descriptions-item>
+          <a-descriptions-item label="联系地址" :span="2"> 曲丽丽 18100000000 浙江省杭州市西湖区黄姑山路工专路交叉路口 </a-descriptions-item>
         </a-descriptions>
 
         <a-descriptions title="信息组" :column="3">
@@ -64,16 +62,11 @@
             <a-descriptions-item label="角色码"> 1234567 </a-descriptions-item>
             <a-descriptions-item label="所属部门"> XX公司 - YY部 </a-descriptions-item>
             <a-descriptions-item label="过期时间"> 2017-08-08 </a-descriptions-item>
-            <a-descriptions-item label="描述" :span="2">
-              这段描述很长很长很长很长很长很长很长很长很长很长很长很长很长很长...
-            </a-descriptions-item>
+            <a-descriptions-item label="描述" :span="2"> 这段描述很长很长很长很长很长很长很长很长很长很长很长很长很长很长... </a-descriptions-item>
           </a-descriptions>
           <a-divider />
           <a-descriptions title="组名称" :column="1">
-            <a-descriptions-item label="学名">
-              Citrullus lanatus (Thunb.) Matsum. et
-              Nakai一年生蔓生藤本；茎、枝粗壮，具明显的棱。卷须较粗..
-            </a-descriptions-item>
+            <a-descriptions-item label="学名"> Citrullus lanatus (Thunb.) Matsum. et Nakai一年生蔓生藤本；茎、枝粗壮，具明显的棱。卷须较粗.. </a-descriptions-item>
           </a-descriptions>
           <a-divider />
           <a-descriptions title="组名称" :column="1">
diff --git a/src/views/demo/page/form/basic/index.vue b/src/views/demo/page/form/basic/index.vue
index b787219..407c176 100644
--- a/src/views/demo/page/form/basic/index.vue
+++ b/src/views/demo/page/form/basic/index.vue
@@ -1,10 +1,5 @@
 <template>
-  <PageWrapper
-    title="基础表单"
-    contentBackground
-    content=" 表单页用于向用户收集或验证信息，基础表单常见于数据项较少的表单场景。"
-    contentClass="p-4"
-  >
+  <PageWrapper title="基础表单" contentBackground content=" 表单页用于向用户收集或验证信息，基础表单常见于数据项较少的表单场景。" contentClass="p-4">
     <BasicForm @register="register" />
   </PageWrapper>
 </template>
diff --git a/src/views/demo/page/form/high/PersonTable.vue b/src/views/demo/page/form/high/PersonTable.vue
index 0ee9fc7..47d250d 100644
--- a/src/views/demo/page/form/high/PersonTable.vue
+++ b/src/views/demo/page/form/high/PersonTable.vue
@@ -10,14 +10,7 @@
 </template>
 <script lang="ts">
   import { defineComponent } from 'vue';
-  import {
-    BasicTable,
-    useTable,
-    TableAction,
-    BasicColumn,
-    ActionItem,
-    EditRecordRow,
-  } from '/@/components/Table';
+  import { BasicTable, useTable, TableAction, BasicColumn, ActionItem, EditRecordRow } from '/@/components/Table';
 
   const columns: BasicColumn[] = [
     {
diff --git a/src/views/demo/page/form/high/index.vue b/src/views/demo/page/form/high/index.vue
index 824953e..364e012 100644
--- a/src/views/demo/page/form/high/index.vue
+++ b/src/views/demo/page/form/high/index.vue
@@ -1,9 +1,5 @@
 <template>
-  <PageWrapper
-    class="high-form"
-    title="高级表单"
-    content=" 高级表单常见于一次性输入和提交大批量数据的场景。"
-  >
+  <PageWrapper class="high-form" title="高级表单" content=" 高级表单常见于一次性输入和提交大批量数据的场景。">
     <a-card title="仓库管理" :bordered="false">
       <BasicForm @register="register" />
     </a-card>
diff --git a/src/views/demo/page/form/step/Step1.vue b/src/views/demo/page/form/step/Step1.vue
index 74bae97..f029986 100644
--- a/src/views/demo/page/form/step/Step1.vue
+++ b/src/views/demo/page/form/step/Step1.vue
@@ -16,14 +16,10 @@
     <a-divider />
     <h3>说明</h3>
     <h4>转账到支付宝账户</h4>
-    <p>
-      如果需要，这里可以放一些关于产品的常见问题说明。如果需要，这里可以放一些关于产品的常见问题说明。如果需要，这里可以放一些关于产品的常见问题说明。
-    </p>
+    <p> 如果需要，这里可以放一些关于产品的常见问题说明。如果需要，这里可以放一些关于产品的常见问题说明。如果需要，这里可以放一些关于产品的常见问题说明。 </p>
 
     <h4>转账到银行卡</h4>
-    <p>
-      如果需要，这里可以放一些关于产品的常见问题说明。如果需要，这里可以放一些关于产品的常见问题说明。如果需要，这里可以放一些关于产品的常见问题说明。
-    </p>
+    <p> 如果需要，这里可以放一些关于产品的常见问题说明。如果需要，这里可以放一些关于产品的常见问题说明。如果需要，这里可以放一些关于产品的常见问题说明。 </p>
   </div>
 </template>
 <script lang="ts">
diff --git a/src/views/demo/page/form/step/index.vue b/src/views/demo/page/form/step/index.vue
index a3a24ca..f762c6c 100644
--- a/src/views/demo/page/form/step/index.vue
+++ b/src/views/demo/page/form/step/index.vue
@@ -1,10 +1,5 @@
 <template>
-  <PageWrapper
-    title="分步表单"
-    contentBackground
-    content=" 将一个冗长或用户不熟悉的表单任务分成多个步骤，指导用户完成。"
-    contentClass="p-4"
-  >
+  <PageWrapper title="分步表单" contentBackground content=" 将一个冗长或用户不熟悉的表单任务分成多个步骤，指导用户完成。" contentClass="p-4">
     <div class="step-form-form">
       <a-steps :current="current">
         <a-step title="填写转账信息" />
@@ -14,12 +9,7 @@
     </div>
     <div class="mt-5">
       <Step1 @next="handleStep1Next" v-show="current === 0" />
-      <Step2
-        @prev="handleStepPrev"
-        @next="handleStep2Next"
-        v-show="current === 1"
-        v-if="initSetp2"
-      />
+      <Step2 @prev="handleStepPrev" @next="handleStep2Next" v-show="current === 1" v-if="initSetp2" />
       <Step3 v-show="current === 2" @redo="handleRedo" v-if="initSetp3" />
     </div>
   </PageWrapper>
diff --git a/src/views/demo/page/list/card/index.vue b/src/views/demo/page/list/card/index.vue
index 40b46c1..f868653 100644
--- a/src/views/demo/page/list/card/index.vue
+++ b/src/views/demo/page/list/card/index.vue
@@ -20,9 +20,7 @@
                     <Icon class="icon" v-if="item.icon" :icon="item.icon" :color="item.color" />
                     {{ item.title }}
                   </div>
-                  <div :class="`${prefixCls}__card-detail`">
-                    基于Vue Next, TypeScript, Ant Design Vue实现的一套完整的企业级后台管理系统
-                  </div>
+                  <div :class="`${prefixCls}__card-detail`"> 基于Vue Next, TypeScript, Ant Design Vue实现的一套完整的企业级后台管理系统 </div>
                 </a-card>
               </a-list-item>
             </a-col>
diff --git a/src/views/demo/page/list/search/index.vue b/src/views/demo/page/list/search/index.vue
index cb2258b..e498f9a 100644
--- a/src/views/demo/page/list/search/index.vue
+++ b/src/views/demo/page/list/search/index.vue
@@ -1,12 +1,7 @@
 <template>
   <PageWrapper :class="prefixCls" title="搜索列表">
     <template #headerContent>
-      <BasicForm
-        :class="`${prefixCls}__header-form`"
-        :labelWidth="100"
-        :schemas="schemas"
-        :showActionButtonGroup="false"
-      />
+      <BasicForm :class="`${prefixCls}__header-form`" :labelWidth="100" :schemas="schemas" :showActionButtonGroup="false" />
     </template>
 
     <div :class="`${prefixCls}__container`">
@@ -21,12 +16,7 @@
                 <div :class="`${prefixCls}__action`">
                   <template v-for="action in actions" :key="action.icon">
                     <div :class="`${prefixCls}__action-item`">
-                      <Icon
-                        v-if="action.icon"
-                        :class="`${prefixCls}__action-icon`"
-                        :icon="action.icon"
-                        :color="action.color"
-                      />
+                      <Icon v-if="action.icon" :class="`${prefixCls}__action-icon`" :icon="action.icon" :color="action.color" />
                       {{ action.text }}
                     </div>
                   </template>
diff --git a/src/views/demo/permission/back/Btn.vue b/src/views/demo/permission/back/Btn.vue
index abfadae..87dde12 100644
--- a/src/views/demo/permission/back/Btn.vue
+++ b/src/views/demo/permission/back/Btn.vue
@@ -5,19 +5,10 @@
       当前拥有的code列表: <a> {{ permissionStore.getPermCodeList }} </a>
     </p>
     <Divider />
-    <Alert
-      class="mt-4"
-      type="info"
-      message="点击后请查看按钮变化(必须处于后台权限模式才可测试此页面所展示的功能)"
-      show-icon
-    />
+    <Alert class="mt-4" type="info" message="点击后请查看按钮变化(必须处于后台权限模式才可测试此页面所展示的功能)" show-icon />
     <Divider />
-    <a-button type="primary" class="mr-2" @click="switchToken(2)" :disabled="!isBackPremissionMode">
-      点击切换按钮权限(用户id为2)
-    </a-button>
-    <a-button type="primary" @click="switchToken(1)" :disabled="!isBackPremissionMode">
-      点击切换按钮权限(用户id为1,默认)
-    </a-button>
+    <a-button type="primary" class="mr-2" @click="switchToken(2)" :disabled="!isBackPremissionMode"> 点击切换按钮权限(用户id为2) </a-button>
+    <a-button type="primary" @click="switchToken(1)" :disabled="!isBackPremissionMode"> 点击切换按钮权限(用户id为1,默认) </a-button>
 
     <template v-if="isBackPremissionMode">
       <Divider>组件方式判断权限</Divider>
@@ -34,26 +25,18 @@
       </Authority>
 
       <Divider>函数方式方式判断权限</Divider>
-      <a-button v-if="hasPermission('1000')" type="primary" class="mx-4">
-        拥有code ['1000']权限可见
-      </a-button>
+      <a-button v-if="hasPermission('1000')" type="primary" class="mx-4"> 拥有code ['1000']权限可见 </a-button>
 
-      <a-button v-if="hasPermission('2000')" color="success" class="mx-4">
-        拥有code ['2000']权限可见
-      </a-button>
+      <a-button v-if="hasPermission('2000')" color="success" class="mx-4"> 拥有code ['2000']权限可见 </a-button>
 
-      <a-button v-if="hasPermission(['1000', '2000'])" color="error" class="mx-4">
-        拥有code ['1000','2000']角色权限可见
-      </a-button>
+      <a-button v-if="hasPermission(['1000', '2000'])" color="error" class="mx-4"> 拥有code ['1000','2000']角色权限可见 </a-button>
 
       <Divider>指令方式方式判断权限(该方式不能动态修改权限.)</Divider>
       <a-button v-auth="'1000'" type="primary" class="mx-4"> 拥有code ['1000']权限可见 </a-button>
 
       <a-button v-auth="'2000'" color="success" class="mx-4"> 拥有code ['2000']权限可见 </a-button>
 
-      <a-button v-auth="['1000', '2000']" color="error" class="mx-4">
-        拥有code ['1000','2000']角色权限可见
-      </a-button>
+      <a-button v-auth="['1000', '2000']" color="error" class="mx-4"> 拥有code ['1000','2000']角色权限可见 </a-button>
     </template>
   </PageWrapper>
 </template>
@@ -77,9 +60,7 @@
       const appStore = useAppStore();
       const userStore = useUserStore();
 
-      const isBackPremissionMode = computed(
-        () => appStore.getProjectConfig.permissionMode === PermissionModeEnum.BACK
-      );
+      const isBackPremissionMode = computed(() => appStore.getProjectConfig.permissionMode === PermissionModeEnum.BACK);
 
       async function switchToken(userId: number) {
         // 本函数切换用户登录Token的部分仅用于演示，实际生产时切换身份应当重新登录
diff --git a/src/views/demo/permission/back/index.vue b/src/views/demo/permission/back/index.vue
index 98574ad..c981835 100644
--- a/src/views/demo/permission/back/index.vue
+++ b/src/views/demo/permission/back/index.vue
@@ -1,10 +1,5 @@
 <template>
-  <PageWrapper
-    title="后台权限示例"
-    contentBackground
-    contentClass="p-4"
-    content="目前mock了两组数据， id为1 和 2 具体返回的菜单可以在mock/sys/menu.ts内查看"
-  >
+  <PageWrapper title="后台权限示例" contentBackground contentClass="p-4" content="目前mock了两组数据， id为1 和 2 具体返回的菜单可以在mock/sys/menu.ts内查看">
     <CurrentPermissionMode />
 
     <Alert class="mt-4" type="info" message="点击后请查看左侧菜单变化" show-icon />
@@ -12,12 +7,8 @@
     <div class="mt-4">
       权限切换(请先切换权限模式为后台权限模式):
       <a-button-group>
-        <a-button @click="switchToken(1)" :disabled="!isBackPremissionMode">
-          获取用户id为1的菜单
-        </a-button>
-        <a-button @click="switchToken(2)" :disabled="!isBackPremissionMode">
-          获取用户id为2的菜单
-        </a-button>
+        <a-button @click="switchToken(1)" :disabled="!isBackPremissionMode"> 获取用户id为1的菜单 </a-button>
+        <a-button @click="switchToken(2)" :disabled="!isBackPremissionMode"> 获取用户id为2的菜单 </a-button>
       </a-button-group>
     </div>
   </PageWrapper>
@@ -39,9 +30,7 @@
       const userStore = useUserStore();
       const appStore = useAppStore();
 
-      const isBackPremissionMode = computed(
-        () => appStore.getProjectConfig.permissionMode === PermissionModeEnum.BACK
-      );
+      const isBackPremissionMode = computed(() => appStore.getProjectConfig.permissionMode === PermissionModeEnum.BACK);
 
       async function switchToken(userId: number) {
         // 本函数切换用户登录Token的部分仅用于演示，实际生产时切换身份应当重新登录
diff --git a/src/views/demo/permission/front/Btn.vue b/src/views/demo/permission/front/Btn.vue
index e99fbba..d7d3f97 100644
--- a/src/views/demo/permission/front/Btn.vue
+++ b/src/views/demo/permission/front/Btn.vue
@@ -37,26 +37,18 @@
     </Authority>
 
     <Divider>函数方式方式判断权限(适用于函数内部过滤)</Divider>
-    <a-button v-if="hasPermission(RoleEnum.SUPER)" type="primary" class="mx-4">
-      拥有super角色权限可见
-    </a-button>
+    <a-button v-if="hasPermission(RoleEnum.SUPER)" type="primary" class="mx-4"> 拥有super角色权限可见 </a-button>
 
-    <a-button v-if="hasPermission(RoleEnum.TEST)" color="success" class="mx-4">
-      拥有test角色权限可见
-    </a-button>
+    <a-button v-if="hasPermission(RoleEnum.TEST)" color="success" class="mx-4"> 拥有test角色权限可见 </a-button>
 
-    <a-button v-if="hasPermission([RoleEnum.TEST, RoleEnum.SUPER])" color="error" class="mx-4">
-      拥有[test,super]角色权限可见
-    </a-button>
+    <a-button v-if="hasPermission([RoleEnum.TEST, RoleEnum.SUPER])" color="error" class="mx-4"> 拥有[test,super]角色权限可见 </a-button>
 
     <Divider>指令方式方式判断权限(该方式不能动态修改权限.)</Divider>
     <a-button v-auth="RoleEnum.SUPER" type="primary" class="mx-4"> 拥有super角色权限可见 </a-button>
 
     <a-button v-auth="RoleEnum.TEST" color="success" class="mx-4"> 拥有test角色权限可见 </a-button>
 
-    <a-button v-auth="[RoleEnum.TEST, RoleEnum.SUPER]" color="error" class="mx-4">
-      拥有[test,super]角色权限可见
-    </a-button>
+    <a-button v-auth="[RoleEnum.TEST, RoleEnum.SUPER]" color="error" class="mx-4"> 拥有[test,super]角色权限可见 </a-button>
   </PageWrapper>
 </template>
 <script lang="ts">
diff --git a/src/views/demo/system/account/AccountDetail.vue b/src/views/demo/system/account/AccountDetail.vue
index 150cc8b..5bb620b 100644
--- a/src/views/demo/system/account/AccountDetail.vue
+++ b/src/views/demo/system/account/AccountDetail.vue
@@ -1,10 +1,5 @@
 <template>
-  <PageWrapper
-    :title="`用户` + userId + `的资料`"
-    content="这是用户资料详情页面。本页面仅用于演示相同路由在tab中打开多个页面并且显示不同的数据"
-    contentBackground
-    @back="goBack"
-  >
+  <PageWrapper :title="`用户` + userId + `的资料`" content="这是用户资料详情页面。本页面仅用于演示相同路由在tab中打开多个页面并且显示不同的数据" contentBackground @back="goBack">
     <template #extra>
       <a-button type="primary" danger> 禁用账号 </a-button>
       <a-button type="primary"> 修改密码 </a-button>
diff --git a/src/views/demo/system/account/DeptTree.vue b/src/views/demo/system/account/DeptTree.vue
index d2fef49..cf56caa 100644
--- a/src/views/demo/system/account/DeptTree.vue
+++ b/src/views/demo/system/account/DeptTree.vue
@@ -1,14 +1,6 @@
 <template>
   <div class="bg-white m-4 mr-0 overflow-hidden">
-    <BasicTree
-      title="部门列表"
-      toolbar
-      search
-      :clickRowToExpand="false"
-      :treeData="treeData"
-      :replaceFields="{ key: 'id', title: 'deptName' }"
-      @select="handleSelect"
-    />
+    <BasicTree title="部门列表" toolbar search :clickRowToExpand="false" :treeData="treeData" :replaceFields="{ key: 'id', title: 'deptName' }" @select="handleSelect" />
   </div>
 </template>
 <script lang="ts">
diff --git a/src/views/demo/system/account/account.data.ts b/src/views/demo/system/account/account.data.ts
index 3beb8e7..d2bbb22 100644
--- a/src/views/demo/system/account/account.data.ts
+++ b/src/views/demo/system/account/account.data.ts
@@ -64,10 +64,10 @@ export const accountFormSchema: FormSchema[] = [
         validator(_, value) {
           return new Promise((resolve, reject) => {
             isAccountExist(value)
-                .then(() => resolve())
-                .catch((err) => {
-                  reject(err.message || '验证失败');
-                });
+              .then(() => resolve())
+              .catch((err) => {
+                reject(err.message || '验证失败');
+              });
           });
         },
       },
diff --git a/src/views/demo/system/menu/MenuDrawer.vue b/src/views/demo/system/menu/MenuDrawer.vue
index 0402510..606c3c7 100644
--- a/src/views/demo/system/menu/MenuDrawer.vue
+++ b/src/views/demo/system/menu/MenuDrawer.vue
@@ -1,12 +1,5 @@
 <template>
-  <BasicDrawer
-    v-bind="$attrs"
-    @register="registerDrawer"
-    showFooter
-    :title="getTitle"
-    width="50%"
-    @ok="handleSubmit"
-  >
+  <BasicDrawer v-bind="$attrs" @register="registerDrawer" showFooter :title="getTitle" width="50%" @ok="handleSubmit">
     <BasicForm @register="registerForm" />
   </BasicDrawer>
 </template>
diff --git a/src/views/demo/system/menu/menu.data.ts b/src/views/demo/system/menu/menu.data.ts
index aef1645..834bd21 100644
--- a/src/views/demo/system/menu/menu.data.ts
+++ b/src/views/demo/system/menu/menu.data.ts
@@ -1,55 +1,55 @@
-import {BasicColumn} from '/@/components/Table';
-import {FormSchema} from '/@/components/Table';
-import {h} from 'vue';
-import {Tag} from 'ant-design-vue';
-import {Icon} from '/@/components/Icon';
+import { BasicColumn } from '/@/components/Table';
+import { FormSchema } from '/@/components/Table';
+import { h } from 'vue';
+import { Tag } from 'ant-design-vue';
+import { Icon } from '/@/components/Icon';
 
 export const columns: BasicColumn[] = [
-    {
-        title: '菜单名称',
-        dataIndex: 'menuName',
-        width: 200,
-        align: 'left',
+  {
+    title: '菜单名称',
+    dataIndex: 'menuName',
+    width: 200,
+    align: 'left',
+  },
+  {
+    title: '图标',
+    dataIndex: 'icon',
+    width: 50,
+    customRender: ({ record }) => {
+      return h(Icon, { icon: record.icon });
     },
-    {
-        title: '图标',
-        dataIndex: 'icon',
-        width: 50,
-        customRender: ({record}) => {
-            return h(Icon, {icon: record.icon});
-        },
-    },
-    {
-        title: '权限标识',
-        dataIndex: 'permission',
-        width: 180,
-    },
-    {
-        title: '组件',
-        dataIndex: 'component',
-    },
-    {
-        title: '排序',
-        dataIndex: 'orderNo',
-        width: 50,
-    },
-    {
-        title: '状态',
-        dataIndex: 'status',
-        width: 80,
-        customRender: ({record}) => {
-            const status = record.status;
-            const enable = ~~status === 0;
-            const color = enable ? 'green' : 'red';
-            const text = enable ? '启用' : '停用';
-            return h(Tag, {color: color}, () => text);
-        },
-    },
-    {
-        title: '创建时间',
-        dataIndex: 'createTime',
-        width: 180,
+  },
+  {
+    title: '权限标识',
+    dataIndex: 'permission',
+    width: 180,
+  },
+  {
+    title: '组件',
+    dataIndex: 'component',
+  },
+  {
+    title: '排序',
+    dataIndex: 'orderNo',
+    width: 50,
+  },
+  {
+    title: '状态',
+    dataIndex: 'status',
+    width: 80,
+    customRender: ({ record }) => {
+      const status = record.status;
+      const enable = ~~status === 0;
+      const color = enable ? 'green' : 'red';
+      const text = enable ? '启用' : '停用';
+      return h(Tag, { color: color }, () => text);
     },
+  },
+  {
+    title: '创建时间',
+    dataIndex: 'createTime',
+    width: 180,
+  },
 ];
 
 const isDir = (type: string) => type === '0';
@@ -57,146 +57,146 @@ const isMenu = (type: string) => type === '1';
 const isButton = (type: string) => type === '2';
 
 export const searchFormSchema: FormSchema[] = [
-    {
-        field: 'menuName',
-        label: '菜单名称',
-        component: 'Input',
-        colProps: {span: 8},
-    },
-    {
-        field: 'status',
-        label: '状态',
-        component: 'Select',
-        componentProps: {
-            options: [
-                {label: '启用', value: '0'},
-                {label: '停用', value: '1'},
-            ],
-        },
-        colProps: {span: 8},
+  {
+    field: 'menuName',
+    label: '菜单名称',
+    component: 'Input',
+    colProps: { span: 8 },
+  },
+  {
+    field: 'status',
+    label: '状态',
+    component: 'Select',
+    componentProps: {
+      options: [
+        { label: '启用', value: '0' },
+        { label: '停用', value: '1' },
+      ],
     },
+    colProps: { span: 8 },
+  },
 ];
 
 export const formSchema: FormSchema[] = [
-    {
-        field: 'type',
-        label: '菜单类型',
-        component: 'RadioButtonGroup',
-        defaultValue: '0',
-        componentProps: {
-            options: [
-                {label: '目录', value: '0'},
-                {label: '菜单', value: '1'},
-                {label: '按钮', value: '2'},
-            ],
-        },
-        colProps: {lg: 24, md: 24},
-    },
-    {
-        field: 'menuName',
-        label: '菜单名称',
-        component: 'Input',
-        required: true,
+  {
+    field: 'type',
+    label: '菜单类型',
+    component: 'RadioButtonGroup',
+    defaultValue: '0',
+    componentProps: {
+      options: [
+        { label: '目录', value: '0' },
+        { label: '菜单', value: '1' },
+        { label: '按钮', value: '2' },
+      ],
     },
+    colProps: { lg: 24, md: 24 },
+  },
+  {
+    field: 'menuName',
+    label: '菜单名称',
+    component: 'Input',
+    required: true,
+  },
 
-    {
-        field: 'parentMenu',
-        label: '上级菜单',
-        component: 'TreeSelect',
-        componentProps: {
-            replaceFields: {
-                title: 'menuName',
-                key: 'id',
-                value: 'id',
-            },
-            getPopupContainer: () => document.body,
-        },
+  {
+    field: 'parentMenu',
+    label: '上级菜单',
+    component: 'TreeSelect',
+    componentProps: {
+      replaceFields: {
+        title: 'menuName',
+        key: 'id',
+        value: 'id',
+      },
+      getPopupContainer: () => document.body,
     },
+  },
 
-    {
-        field: 'orderNo',
-        label: '排序',
-        component: 'InputNumber',
-        required: true,
-    },
-    {
-        field: 'icon',
-        label: '图标',
-        component: 'IconPicker',
-        required: true,
-        ifShow: ({values}) => !isButton(values.type),
-    },
+  {
+    field: 'orderNo',
+    label: '排序',
+    component: 'InputNumber',
+    required: true,
+  },
+  {
+    field: 'icon',
+    label: '图标',
+    component: 'IconPicker',
+    required: true,
+    ifShow: ({ values }) => !isButton(values.type),
+  },
 
-    {
-        field: 'routePath',
-        label: '路由地址',
-        component: 'Input',
-        required: true,
-        ifShow: ({values}) => !isButton(values.type),
+  {
+    field: 'routePath',
+    label: '路由地址',
+    component: 'Input',
+    required: true,
+    ifShow: ({ values }) => !isButton(values.type),
+  },
+  {
+    field: 'component',
+    label: '组件路径',
+    component: 'Input',
+    ifShow: ({ values }) => isMenu(values.type),
+  },
+  {
+    field: 'permission',
+    label: '权限标识',
+    component: 'Input',
+    ifShow: ({ values }) => !isDir(values.type),
+  },
+  {
+    field: 'status',
+    label: '状态',
+    component: 'RadioButtonGroup',
+    defaultValue: '0',
+    componentProps: {
+      options: [
+        { label: '启用', value: '0' },
+        { label: '禁用', value: '1' },
+      ],
     },
-    {
-        field: 'component',
-        label: '组件路径',
-        component: 'Input',
-        ifShow: ({values}) => isMenu(values.type),
-    },
-    {
-        field: 'permission',
-        label: '权限标识',
-        component: 'Input',
-        ifShow: ({values}) => !isDir(values.type),
-    },
-    {
-        field: 'status',
-        label: '状态',
-        component: 'RadioButtonGroup',
-        defaultValue: '0',
-        componentProps: {
-            options: [
-                {label: '启用', value: '0'},
-                {label: '禁用', value: '1'},
-            ],
-        },
-    },
-    {
-        field: 'isExt',
-        label: '是否外链',
-        component: 'RadioButtonGroup',
-        defaultValue: '0',
-        componentProps: {
-            options: [
-                {label: '否', value: '0'},
-                {label: '是', value: '1'},
-            ],
-        },
-        ifShow: ({values}) => !isButton(values.type),
+  },
+  {
+    field: 'isExt',
+    label: '是否外链',
+    component: 'RadioButtonGroup',
+    defaultValue: '0',
+    componentProps: {
+      options: [
+        { label: '否', value: '0' },
+        { label: '是', value: '1' },
+      ],
     },
+    ifShow: ({ values }) => !isButton(values.type),
+  },
 
-    {
-        field: 'keepalive',
-        label: '是否缓存',
-        component: 'RadioButtonGroup',
-        defaultValue: '0',
-        componentProps: {
-            options: [
-                {label: '否', value: '0'},
-                {label: '是', value: '1'},
-            ],
-        },
-        ifShow: ({values}) => isMenu(values.type),
+  {
+    field: 'keepalive',
+    label: '是否缓存',
+    component: 'RadioButtonGroup',
+    defaultValue: '0',
+    componentProps: {
+      options: [
+        { label: '否', value: '0' },
+        { label: '是', value: '1' },
+      ],
     },
+    ifShow: ({ values }) => isMenu(values.type),
+  },
 
-    {
-        field: 'show',
-        label: '是否显示',
-        component: 'RadioButtonGroup',
-        defaultValue: '0',
-        componentProps: {
-            options: [
-                {label: '是', value: '0'},
-                {label: '否', value: '1'},
-            ],
-        },
-        ifShow: ({values}) => !isButton(values.type),
+  {
+    field: 'show',
+    label: '是否显示',
+    component: 'RadioButtonGroup',
+    defaultValue: '0',
+    componentProps: {
+      options: [
+        { label: '是', value: '0' },
+        { label: '否', value: '1' },
+      ],
     },
+    ifShow: ({ values }) => !isButton(values.type),
+  },
 ];
diff --git a/src/views/demo/system/role/RoleDrawer.vue b/src/views/demo/system/role/RoleDrawer.vue
index e861715..caabe6f 100644
--- a/src/views/demo/system/role/RoleDrawer.vue
+++ b/src/views/demo/system/role/RoleDrawer.vue
@@ -1,22 +1,8 @@
 <template>
-  <BasicDrawer
-    v-bind="$attrs"
-    @register="registerDrawer"
-    showFooter
-    :title="getTitle"
-    width="500px"
-    @ok="handleSubmit"
-  >
+  <BasicDrawer v-bind="$attrs" @register="registerDrawer" showFooter :title="getTitle" width="500px" @ok="handleSubmit">
     <BasicForm @register="registerForm">
       <template #menu="{ model, field }">
-        <BasicTree
-          v-model:value="model[field]"
-          :treeData="treeData"
-          :replaceFields="{ title: 'menuName', key: 'id' }"
-          checkable
-          toolbar
-          title="菜单分配"
-        />
+        <BasicTree v-model:value="model[field]" :treeData="treeData" :replaceFields="{ title: 'menuName', key: 'id' }" checkable toolbar title="菜单分配" />
       </template>
     </BasicForm>
   </BasicDrawer>
diff --git a/src/views/demo/system/test/TestDrawer.vue b/src/views/demo/system/test/TestDrawer.vue
index 15536de..264692f 100644
--- a/src/views/demo/system/test/TestDrawer.vue
+++ b/src/views/demo/system/test/TestDrawer.vue
@@ -1,15 +1,6 @@
 <template>
-  <BasicDrawer
-    v-bind="$attrs"
-    @register="registerDrawer"
-    showFooter
-    :title="getTitle"
-    width="500px"
-    @ok="handleSubmit"
-  >
-    <BasicForm @register="registerForm">
-
-    </BasicForm>
+  <BasicDrawer v-bind="$attrs" @register="registerDrawer" showFooter :title="getTitle" width="500px" @ok="handleSubmit">
+    <BasicForm @register="registerForm"> </BasicForm>
   </BasicDrawer>
 </template>
 <script lang="ts">
diff --git a/src/views/demo/system/test/test.data.ts b/src/views/demo/system/test/test.data.ts
index fe93a1b..b8f9023 100644
--- a/src/views/demo/system/test/test.data.ts
+++ b/src/views/demo/system/test/test.data.ts
@@ -16,7 +16,7 @@ export const columns: BasicColumn[] = [
     title: '创建时间',
     dataIndex: 'createTime',
     width: 180,
-  }
+  },
 ];
 
 export const searchFormSchema: FormSchema[] = [
@@ -25,7 +25,7 @@ export const searchFormSchema: FormSchema[] = [
     label: '名称',
     component: 'Input',
     colProps: { span: 8 },
-  }
+  },
 ];
 
 export const formSchema: FormSchema[] = [
diff --git a/src/views/demo/table/Basic.vue b/src/views/demo/table/Basic.vue
index 2a29262..4d8e88c 100644
--- a/src/views/demo/table/Basic.vue
+++ b/src/views/demo/table/Basic.vue
@@ -1,6 +1,18 @@
 <template>
   <div class="p-4">
-    <BasicTable title="基础示例" titleHelpMessage="温馨提醒" :columns="columns" :dataSource="data" :canResize="canResize" :loading="loading" :striped="striped" :bordered="border" showTableSetting :pagination="pagination" @columns-change="handleColumnChange">
+    <BasicTable
+      title="基础示例"
+      titleHelpMessage="温馨提醒"
+      :columns="columns"
+      :dataSource="data"
+      :canResize="canResize"
+      :loading="loading"
+      :striped="striped"
+      :bordered="border"
+      showTableSetting
+      :pagination="pagination"
+      @columns-change="handleColumnChange"
+    >
       <template #toolbar>
         <a-button type="primary" @click="toggleCanResize">
           {{ !canResize ? '自适应高度' : '取消自适应' }}
diff --git a/src/views/demo/table/EditCellTable.vue b/src/views/demo/table/EditCellTable.vue
index 4a309bd..530f806 100644
--- a/src/views/demo/table/EditCellTable.vue
+++ b/src/views/demo/table/EditCellTable.vue
@@ -1,11 +1,6 @@
 <template>
   <div class="p-4">
-    <BasicTable
-            @register="registerTable"
-            @edit-end="handleEditEnd"
-            @edit-cancel="handleEditCancel"
-            :beforeEditSubmit="beforeEditSubmit"
-    />
+    <BasicTable @register="registerTable" @edit-end="handleEditEnd" @edit-cancel="handleEditCancel" :beforeEditSubmit="beforeEditSubmit" />
   </div>
 </template>
 <script lang="ts">
diff --git a/src/views/demo/table/EditRowTable.vue b/src/views/demo/table/EditRowTable.vue
index bbceec1..cb0dd26 100644
--- a/src/views/demo/table/EditRowTable.vue
+++ b/src/views/demo/table/EditRowTable.vue
@@ -1,262 +1,253 @@
 <template>
-    <div class="p-4">
-        <BasicTable @register="registerTable" @edit-change="onEditChange">
-            <template #action="{ record, column }">
-                <TableAction :actions="createActions(record, column)" />
-            </template>
-        </BasicTable>
-    </div>
+  <div class="p-4">
+    <BasicTable @register="registerTable" @edit-change="onEditChange">
+      <template #action="{ record, column }">
+        <TableAction :actions="createActions(record, column)" />
+      </template>
+    </BasicTable>
+  </div>
 </template>
 <script lang="ts">
-    import { defineComponent, ref } from 'vue';
-    import {
-        BasicTable,
-        useTable,
-        TableAction,
-        BasicColumn,
-        ActionItem,
-        EditRecordRow,
-    } from '/@/components/Table';
-    import { optionsListApi } from '/@/api/demo/select';
+  import { defineComponent, ref } from 'vue';
+  import { BasicTable, useTable, TableAction, BasicColumn, ActionItem, EditRecordRow } from '/@/components/Table';
+  import { optionsListApi } from '/@/api/demo/select';
 
-    import { demoListApi } from '/@/api/demo/table';
-    import { treeOptionsListApi } from '/@/api/demo/tree';
-    import { cloneDeep } from 'lodash-es';
-    import { useMessage } from '/@/hooks/web/useMessage';
+  import { demoListApi } from '/@/api/demo/table';
+  import { treeOptionsListApi } from '/@/api/demo/tree';
+  import { cloneDeep } from 'lodash-es';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
-    const columns: BasicColumn[] = [
-        {
-            title: '输入框',
-            dataIndex: 'name',
-            editRow: true,
-            editComponentProps: {
-                prefix: '$',
-            },
-            width: 150,
-        },
-        {
-            title: '默认输入状态',
-            dataIndex: 'name7',
-            editRow: true,
-            width: 150,
-        },
-        {
-            title: '输入框校验',
-            dataIndex: 'name1',
-            editRow: true,
-            align: 'left',
-            // 默认必填校验
-            editRule: true,
-            width: 150,
-        },
-        {
-            title: '输入框函数校验',
-            dataIndex: 'name2',
-            editRow: true,
-            align: 'right',
-            editRule: async (text) => {
-                if (text === '2') {
-                    return '不能输入该值';
-                }
-                return '';
-            },
-        },
-        {
-            title: '数字输入框',
-            dataIndex: 'id',
-            editRow: true,
-            editRule: true,
-            editComponent: 'InputNumber',
-            width: 150,
-        },
-        {
-            title: '下拉框',
-            dataIndex: 'name3',
-            editRow: true,
-            editComponent: 'Select',
-            editComponentProps: {
-                options: [
-                    {
-                        label: 'Option1',
-                        value: '1',
-                    },
-                    {
-                        label: 'Option2',
-                        value: '2',
-                    },
-                    {
-                        label: 'Option3',
-                        value: '3',
-                    },
-                ],
-            },
-            width: 200,
-        },
-        {
-            title: '远程下拉',
-            dataIndex: 'name4',
-            editRow: true,
-            editComponent: 'ApiSelect',
-            editComponentProps: {
-                api: optionsListApi,
-                resultField: 'list',
-                labelField: 'name',
-                valueField: 'id',
-            },
-            width: 200,
-        },
-        {
-            title: '远程下拉树',
-            dataIndex: 'name8',
-            editRow: true,
-            editComponent: 'ApiTreeSelect',
-            editRule: false,
-            editComponentProps: {
-                api: treeOptionsListApi,
-                resultField: 'list',
-            },
-            width: 200,
-        },
-        {
-            title: '日期选择',
-            dataIndex: 'date',
-            editRow: true,
-            editComponent: 'DatePicker',
-            editComponentProps: {
-                valueFormat: 'YYYY-MM-DD',
-                format: 'YYYY-MM-DD',
-            },
-            width: 150,
-        },
-        {
-            title: '时间选择',
-            dataIndex: 'time',
-            editRow: true,
-            editComponent: 'TimePicker',
-            editComponentProps: {
-                valueFormat: 'HH:mm',
-                format: 'HH:mm',
-            },
-            width: 100,
-        },
-        {
-            title: '勾选框',
-            dataIndex: 'name5',
-            editRow: true,
+  const columns: BasicColumn[] = [
+    {
+      title: '输入框',
+      dataIndex: 'name',
+      editRow: true,
+      editComponentProps: {
+        prefix: '$',
+      },
+      width: 150,
+    },
+    {
+      title: '默认输入状态',
+      dataIndex: 'name7',
+      editRow: true,
+      width: 150,
+    },
+    {
+      title: '输入框校验',
+      dataIndex: 'name1',
+      editRow: true,
+      align: 'left',
+      // 默认必填校验
+      editRule: true,
+      width: 150,
+    },
+    {
+      title: '输入框函数校验',
+      dataIndex: 'name2',
+      editRow: true,
+      align: 'right',
+      editRule: async (text) => {
+        if (text === '2') {
+          return '不能输入该值';
+        }
+        return '';
+      },
+    },
+    {
+      title: '数字输入框',
+      dataIndex: 'id',
+      editRow: true,
+      editRule: true,
+      editComponent: 'InputNumber',
+      width: 150,
+    },
+    {
+      title: '下拉框',
+      dataIndex: 'name3',
+      editRow: true,
+      editComponent: 'Select',
+      editComponentProps: {
+        options: [
+          {
+            label: 'Option1',
+            value: '1',
+          },
+          {
+            label: 'Option2',
+            value: '2',
+          },
+          {
+            label: 'Option3',
+            value: '3',
+          },
+        ],
+      },
+      width: 200,
+    },
+    {
+      title: '远程下拉',
+      dataIndex: 'name4',
+      editRow: true,
+      editComponent: 'ApiSelect',
+      editComponentProps: {
+        api: optionsListApi,
+        resultField: 'list',
+        labelField: 'name',
+        valueField: 'id',
+      },
+      width: 200,
+    },
+    {
+      title: '远程下拉树',
+      dataIndex: 'name8',
+      editRow: true,
+      editComponent: 'ApiTreeSelect',
+      editRule: false,
+      editComponentProps: {
+        api: treeOptionsListApi,
+        resultField: 'list',
+      },
+      width: 200,
+    },
+    {
+      title: '日期选择',
+      dataIndex: 'date',
+      editRow: true,
+      editComponent: 'DatePicker',
+      editComponentProps: {
+        valueFormat: 'YYYY-MM-DD',
+        format: 'YYYY-MM-DD',
+      },
+      width: 150,
+    },
+    {
+      title: '时间选择',
+      dataIndex: 'time',
+      editRow: true,
+      editComponent: 'TimePicker',
+      editComponentProps: {
+        valueFormat: 'HH:mm',
+        format: 'HH:mm',
+      },
+      width: 100,
+    },
+    {
+      title: '勾选框',
+      dataIndex: 'name5',
+      editRow: true,
 
-            editComponent: 'Checkbox',
-            editValueMap: (value) => {
-                return value ? '是' : '否';
-            },
-            width: 100,
+      editComponent: 'Checkbox',
+      editValueMap: (value) => {
+        return value ? '是' : '否';
+      },
+      width: 100,
+    },
+    {
+      title: '开关',
+      dataIndex: 'name6',
+      editRow: true,
+      editComponent: 'Switch',
+      editValueMap: (value) => {
+        return value ? '开' : '关';
+      },
+      width: 100,
+    },
+  ];
+  export default defineComponent({
+    components: { BasicTable, TableAction },
+    setup() {
+      const { createMessage: msg } = useMessage();
+      const currentEditKeyRef = ref('');
+      const [registerTable] = useTable({
+        title: '可编辑行示例',
+        titleHelpMessage: ['本例中修改[数字输入框]这一列时，同一行的[远程下拉]列的当前编辑数据也会同步发生改变'],
+        api: demoListApi,
+        columns: columns,
+        showIndexColumn: false,
+        showTableSetting: true,
+        tableSetting: { fullScreen: true },
+        actionColumn: {
+          width: 160,
+          title: 'Action',
+          dataIndex: 'action',
+          slots: { customRender: 'action' },
         },
-        {
-            title: '开关',
-            dataIndex: 'name6',
-            editRow: true,
-            editComponent: 'Switch',
-            editValueMap: (value) => {
-                return value ? '开' : '关';
-            },
-            width: 100,
-        },
-    ];
-    export default defineComponent({
-        components: { BasicTable, TableAction },
-        setup() {
-            const { createMessage: msg } = useMessage();
-            const currentEditKeyRef = ref('');
-            const [registerTable] = useTable({
-                title: '可编辑行示例',
-                titleHelpMessage: [
-                    '本例中修改[数字输入框]这一列时，同一行的[远程下拉]列的当前编辑数据也会同步发生改变',
-                ],
-                api: demoListApi,
-                columns: columns,
-                showIndexColumn: false,
-                showTableSetting: true,
-                tableSetting: { fullScreen: true },
-                actionColumn: {
-                    width: 160,
-                    title: 'Action',
-                    dataIndex: 'action',
-                    slots: { customRender: 'action' },
-                },
-            });
+      });
 
-            function handleEdit(record: EditRecordRow) {
-                currentEditKeyRef.value = record.key;
-                record.onEdit?.(true);
+      function handleEdit(record: EditRecordRow) {
+        currentEditKeyRef.value = record.key;
+        record.onEdit?.(true);
+      }
+
+      function handleCancel(record: EditRecordRow) {
+        currentEditKeyRef.value = '';
+        record.onEdit?.(false, false);
+      }
+
+      async function handleSave(record: EditRecordRow) {
+        // 校验
+        msg.loading({ content: '正在保存...', duration: 0, key: 'saving' });
+        const valid = await record.onValid?.();
+        if (valid) {
+          try {
+            const data = cloneDeep(record.editValueRefs);
+            console.log(data);
+            //TODO 此处将数据提交给服务器保存
+            // ...
+            // 保存之后提交编辑状态
+            const pass = await record.onEdit?.(false, true);
+            if (pass) {
+              currentEditKeyRef.value = '';
             }
+            msg.success({ content: '数据已保存', key: 'saving' });
+          } catch (error) {
+            msg.error({ content: '保存失败', key: 'saving' });
+          }
+        } else {
+          msg.error({ content: '请填写正确的数据', key: 'saving' });
+        }
+      }
 
-            function handleCancel(record: EditRecordRow) {
-                currentEditKeyRef.value = '';
-                record.onEdit?.(false, false);
-            }
+      function createActions(record: EditRecordRow, column: BasicColumn): ActionItem[] {
+        if (!record.editable) {
+          return [
+            {
+              label: '编辑',
+              disabled: currentEditKeyRef.value ? currentEditKeyRef.value !== record.key : false,
+              onClick: handleEdit.bind(null, record),
+            },
+          ];
+        }
+        return [
+          {
+            label: '保存',
+            onClick: handleSave.bind(null, record, column),
+          },
+          {
+            label: '取消',
+            popConfirm: {
+              title: '是否取消编辑',
+              confirm: handleCancel.bind(null, record, column),
+            },
+          },
+        ];
+      }
 
-            async function handleSave(record: EditRecordRow) {
-                // 校验
-                msg.loading({ content: '正在保存...', duration: 0, key: 'saving' });
-                const valid = await record.onValid?.();
-                if (valid) {
-                    try {
-                        const data = cloneDeep(record.editValueRefs);
-                        console.log(data);
-                        //TODO 此处将数据提交给服务器保存
-                        // ...
-                        // 保存之后提交编辑状态
-                        const pass = await record.onEdit?.(false, true);
-                        if (pass) {
-                            currentEditKeyRef.value = '';
-                        }
-                        msg.success({ content: '数据已保存', key: 'saving' });
-                    } catch (error) {
-                        msg.error({ content: '保存失败', key: 'saving' });
-                    }
-                } else {
-                    msg.error({ content: '请填写正确的数据', key: 'saving' });
-                }
-            }
+      function onEditChange({ column, value, record }) {
+        // 本例
+        if (column.dataIndex === 'id') {
+          record.editValueRefs.name4.value = `${value}`;
+        }
+        console.log(column, value, record);
+      }
 
-            function createActions(record: EditRecordRow, column: BasicColumn): ActionItem[] {
-                if (!record.editable) {
-                    return [
-                        {
-                            label: '编辑',
-                            disabled: currentEditKeyRef.value ? currentEditKeyRef.value !== record.key : false,
-                            onClick: handleEdit.bind(null, record),
-                        },
-                    ];
-                }
-                return [
-                    {
-                        label: '保存',
-                        onClick: handleSave.bind(null, record, column),
-                    },
-                    {
-                        label: '取消',
-                        popConfirm: {
-                            title: '是否取消编辑',
-                            confirm: handleCancel.bind(null, record, column),
-                        },
-                    },
-                ];
-            }
-
-            function onEditChange({ column, value, record }) {
-                // 本例
-                if (column.dataIndex === 'id') {
-                    record.editValueRefs.name4.value = `${value}`;
-                }
-                console.log(column, value, record);
-            }
-
-            return {
-                registerTable,
-                handleEdit,
-                createActions,
-                onEditChange,
-            };
-        },
-    });
+      return {
+        registerTable,
+        handleEdit,
+        createActions,
+        onEditChange,
+      };
+    },
+  });
 </script>
diff --git a/src/views/demo/table/FormTable.vue b/src/views/demo/table/FormTable.vue
index 23300aa..f73c59b 100644
--- a/src/views/demo/table/FormTable.vue
+++ b/src/views/demo/table/FormTable.vue
@@ -1,8 +1,5 @@
 <template>
-  <BasicTable
-    @register="registerTable"
-    :rowSelection="{ type: 'checkbox', selectedRowKeys: checkedKeys, onChange: onSelectChange }"
-  >
+  <BasicTable @register="registerTable" :rowSelection="{ type: 'checkbox', selectedRowKeys: checkedKeys, onChange: onSelectChange }">
     <template #form-custom> custom-slot </template>
     <template #headerTop>
       <a-alert type="info" show-icon>
diff --git a/src/views/demo/table/NestedTable.vue b/src/views/demo/table/NestedTable.vue
index 95e07f1..fb71592 100644
--- a/src/views/demo/table/NestedTable.vue
+++ b/src/views/demo/table/NestedTable.vue
@@ -1,113 +1,110 @@
 <template>
-    <a-table :columns="columns" :data-source="data" class="components-table-demo-nested">
+  <a-table :columns="columns" :data-source="data" class="components-table-demo-nested">
+    <template #operation>
+      <a>Publish</a>
+    </template>
+    <template #expandedRowRender>
+      <a-table :columns="innerColumns" :data-source="innerData" :pagination="false">
+        <template #status>
+          <span>
+            <a-badge status="success" />
+            Finished
+          </span>
+        </template>
         <template #operation>
-            <a>Publish</a>
+          <span class="table-operation">
+            <a>Pause</a>
+            <a>Stop</a>
+            <a-dropdown>
+              <template #overlay>
+                <a-menu>
+                  <a-menu-item>Action 1</a-menu-item>
+                  <a-menu-item>Action 2</a-menu-item>
+                </a-menu>
+              </template>
+              <a> More </a>
+            </a-dropdown>
+          </span>
         </template>
-        <template #expandedRowRender>
-            <a-table :columns="innerColumns" :data-source="innerData" :pagination="false">
-                <template #status>
-                  <span>
-                    <a-badge status="success"/>
-                    Finished
-                  </span>
-                </template>
-                <template #operation>
-                  <span class="table-operation">
-                    <a>Pause</a>
-                    <a>Stop</a>
-                    <a-dropdown>
-                      <template #overlay>
-                        <a-menu>
-                          <a-menu-item>Action 1</a-menu-item>
-                          <a-menu-item>Action 2</a-menu-item>
-                        </a-menu>
-                      </template>
-                      <a>
-                        More
-                      </a>
-                    </a-dropdown>
-                  </span>
-                </template>
-            </a-table>
-        </template>
-    </a-table>
+      </a-table>
+    </template>
+  </a-table>
 </template>
 <script lang="ts">
-    import {defineComponent} from 'vue';
+  import { defineComponent } from 'vue';
 
-    const columns = [
-        {title: 'Name', dataIndex: 'name', key: 'name'},
-        {title: 'Platform', dataIndex: 'platform', key: 'platform'},
-        {title: 'Version', dataIndex: 'version', key: 'version'},
-        {title: 'Upgraded', dataIndex: 'upgradeNum', key: 'upgradeNum'},
-        {title: 'Creator', dataIndex: 'creator', key: 'creator'},
-        {title: 'Date', dataIndex: 'createdAt', key: 'createdAt'},
-        {title: 'Action', key: 'operation', slots: {customRender: 'operation'}},
-    ];
+  const columns = [
+    { title: 'Name', dataIndex: 'name', key: 'name' },
+    { title: 'Platform', dataIndex: 'platform', key: 'platform' },
+    { title: 'Version', dataIndex: 'version', key: 'version' },
+    { title: 'Upgraded', dataIndex: 'upgradeNum', key: 'upgradeNum' },
+    { title: 'Creator', dataIndex: 'creator', key: 'creator' },
+    { title: 'Date', dataIndex: 'createdAt', key: 'createdAt' },
+    { title: 'Action', key: 'operation', slots: { customRender: 'operation' } },
+  ];
 
-    interface DataItem {
-        key: number;
-        name: string;
-        platform: string;
-        version: string;
-        upgradeNum: number;
-        creator: string;
-        createdAt: string;
-    }
+  interface DataItem {
+    key: number;
+    name: string;
+    platform: string;
+    version: string;
+    upgradeNum: number;
+    creator: string;
+    createdAt: string;
+  }
 
-    const data: DataItem[] = [];
-    for (let i = 0; i < 3; ++i) {
-        data.push({
-            key: i,
-            name: 'Screem',
-            platform: 'iOS',
-            version: '10.3.4.5654',
-            upgradeNum: 500,
-            creator: 'Jack',
-            createdAt: '2014-12-24 23:12:00',
-        });
-    }
-
-    const innerColumns = [
-        {title: 'Date', dataIndex: 'date', key: 'date'},
-        {title: 'Name', dataIndex: 'name', key: 'name'},
-        {title: 'Status', key: 'state', slots: {customRender: 'status'}},
-        {title: 'Upgrade Status', dataIndex: 'upgradeNum', key: 'upgradeNum'},
-        {
-            title: 'Action',
-            dataIndex: 'operation',
-            key: 'operation',
-            slots: {customRender: 'operation'},
-        },
-    ];
-
-    interface innerDataItem {
-        key: number;
-        date: string;
-        name: string;
-        upgradeNum: string;
-    }
-
-    const innerData: innerDataItem[] = [];
-    for (let i = 0; i < 3; ++i) {
-        innerData.push({
-            key: i,
-            date: '2014-12-24 23:12:00',
-            name: 'This is production name',
-            upgradeNum: 'Upgraded: 56',
-        });
-    }
-
-    export default defineComponent({
-        components: {
-        },
-        setup() {
-            return {
-                data,
-                columns,
-                innerColumns,
-                innerData,
-            };
-        },
+  const data: DataItem[] = [];
+  for (let i = 0; i < 3; ++i) {
+    data.push({
+      key: i,
+      name: 'Screem',
+      platform: 'iOS',
+      version: '10.3.4.5654',
+      upgradeNum: 500,
+      creator: 'Jack',
+      createdAt: '2014-12-24 23:12:00',
     });
+  }
+
+  const innerColumns = [
+    { title: 'Date', dataIndex: 'date', key: 'date' },
+    { title: 'Name', dataIndex: 'name', key: 'name' },
+    { title: 'Status', key: 'state', slots: { customRender: 'status' } },
+    { title: 'Upgrade Status', dataIndex: 'upgradeNum', key: 'upgradeNum' },
+    {
+      title: 'Action',
+      dataIndex: 'operation',
+      key: 'operation',
+      slots: { customRender: 'operation' },
+    },
+  ];
+
+  interface innerDataItem {
+    key: number;
+    date: string;
+    name: string;
+    upgradeNum: string;
+  }
+
+  const innerData: innerDataItem[] = [];
+  for (let i = 0; i < 3; ++i) {
+    innerData.push({
+      key: i,
+      date: '2014-12-24 23:12:00',
+      name: 'This is production name',
+      upgradeNum: 'Upgraded: 56',
+    });
+  }
+
+  export default defineComponent({
+    components: {},
+    setup() {
+      return {
+        data,
+        columns,
+        innerColumns,
+        innerData,
+      };
+    },
+  });
 </script>
diff --git a/src/views/demo/table/RefTable.vue b/src/views/demo/table/RefTable.vue
index 8c5566c..9f0f520 100644
--- a/src/views/demo/table/RefTable.vue
+++ b/src/views/demo/table/RefTable.vue
@@ -16,16 +16,7 @@
       <a-button class="mr-2" @click="clearSelect"> 清空选中行 </a-button>
       <a-button class="mr-2" @click="getPagination"> 获取分页信息 </a-button>
     </div>
-    <BasicTable
-            :canResize="false"
-            title="RefTable示例"
-            titleHelpMessage="使用Ref调用表格内方法"
-            ref="tableRef"
-            :api="api"
-            :columns="columns"
-            rowKey="id"
-            :rowSelection="{ type: 'checkbox' }"
-    />
+    <BasicTable :canResize="false" title="RefTable示例" titleHelpMessage="使用Ref调用表格内方法" ref="tableRef" :api="api" :columns="columns" rowKey="id" :rowSelection="{ type: 'checkbox' }" />
   </div>
 </template>
 <script lang="ts">
diff --git a/src/views/demo/table/UseTable.vue b/src/views/demo/table/UseTable.vue
index 3c54997..c632a1b 100644
--- a/src/views/demo/table/UseTable.vue
+++ b/src/views/demo/table/UseTable.vue
@@ -34,20 +34,7 @@
       }
       const [
         registerTable,
-        {
-          setLoading,
-          setColumns,
-          getColumns,
-          getDataSource,
-          getRawDataSource,
-          reload,
-          getPaginationRef,
-          setPagination,
-          getSelectRows,
-          getSelectRowKeys,
-          setSelectedRowKeys,
-          clearSelectedRowKeys,
-        },
+        { setLoading, setColumns, getColumns, getDataSource, getRawDataSource, reload, getPaginationRef, setPagination, getSelectRows, getSelectRowKeys, setSelectedRowKeys, clearSelectedRowKeys },
       ] = useTable({
         canResize: true,
         title: 'useTable示例',
diff --git a/src/views/demo/tree/EditTree.vue b/src/views/demo/tree/EditTree.vue
index 7c7fcfe..7b9ef0e 100644
--- a/src/views/demo/tree/EditTree.vue
+++ b/src/views/demo/tree/EditTree.vue
@@ -1,29 +1,9 @@
 <template>
   <PageWrapper title="Tree函数操作示例">
     <div class="flex">
-      <BasicTree
-        class="w-1/3"
-        title="右侧操作按钮/自定义图标"
-        helpMessage="帮助信息"
-        :treeData="treeData"
-        :actionList="actionList"
-        :renderIcon="createIcon"
-      />
-      <BasicTree
-        class="w-1/3 mx-4"
-        title="右键菜单"
-        :treeData="treeData"
-        :beforeRightClick="getRightMenuList"
-      />
-      <BasicTree
-        class="w-1/3"
-        title="工具栏使用"
-        toolbar
-        checkable
-        search
-        :treeData="treeData"
-        :beforeRightClick="getRightMenuList"
-      />
+      <BasicTree class="w-1/3" title="右侧操作按钮/自定义图标" helpMessage="帮助信息" :treeData="treeData" :actionList="actionList" :renderIcon="createIcon" />
+      <BasicTree class="w-1/3 mx-4" title="右键菜单" :treeData="treeData" :beforeRightClick="getRightMenuList" />
+      <BasicTree class="w-1/3" title="工具栏使用" toolbar checkable search :treeData="treeData" :beforeRightClick="getRightMenuList" />
     </div>
   </PageWrapper>
 </template>
diff --git a/src/views/demo/tree/index.vue b/src/views/demo/tree/index.vue
index 704938f..d87f7c4 100644
--- a/src/views/demo/tree/index.vue
+++ b/src/views/demo/tree/index.vue
@@ -5,30 +5,13 @@
         <BasicTree title="基础示例，默认展开第一层" :treeData="treeData" defaultExpandLevel="1" />
       </Col>
       <Col :span="8">
-        <BasicTree
-          title="可勾选，默认全部展开"
-          :treeData="treeData"
-          :checkable="true"
-          defaultExpandAll
-          @check="handleCheck"
-        />
+        <BasicTree title="可勾选，默认全部展开" :treeData="treeData" :checkable="true" defaultExpandAll @check="handleCheck" />
       </Col>
       <Col :span="8">
-        <BasicTree
-          title="指定默认展开/勾选示例"
-          :treeData="treeData"
-          :checkable="true"
-          :expandedKeys="['0-0']"
-          :checkedKeys="['0-0']"
-        />
+        <BasicTree title="指定默认展开/勾选示例" :treeData="treeData" :checkable="true" :expandedKeys="['0-0']" :checkedKeys="['0-0']" />
       </Col>
       <Col :span="8">
-        <BasicTree
-          title="懒加载异步树"
-          ref="asyncTreeRef"
-          :treeData="tree"
-          :load-data="onLoadData"
-        />
+        <BasicTree title="懒加载异步树" ref="asyncTreeRef" :treeData="tree" :load-data="onLoadData" />
       </Col>
       <Col :span="16">
         <Card title="异步数据，默认展开">
@@ -52,7 +35,7 @@
   import { cloneDeep } from 'lodash-es';
 
   export default defineComponent({
-    name:"system-testtree",
+    name: 'system-testtree',
     components: { BasicTree, PageWrapper, Card, Row, Col, Spin },
     setup() {
       const asyncTreeRef = ref<Nullable<TreeActionType>>(null);
@@ -100,10 +83,7 @@
                 { title: `Child Node ${treeNode.eventKey}-1`, key: `${treeNode.eventKey}-1` },
               ];
               asyncTreeAction.updateNodeByKey(treeNode.eventKey, { children: nodeChildren });
-              asyncTreeAction.setExpandedKeys([
-                treeNode.eventKey,
-                ...asyncTreeAction.getExpandedKeys(),
-              ]);
+              asyncTreeAction.setExpandedKeys([treeNode.eventKey, ...asyncTreeAction.getExpandedKeys()]);
             }
 
             resolve();
diff --git a/src/views/demo/vextable/OneToOneModal.vue b/src/views/demo/vextable/OneToOneModal.vue
index 227c04e..ddd7300 100644
--- a/src/views/demo/vextable/OneToOneModal.vue
+++ b/src/views/demo/vextable/OneToOneModal.vue
@@ -1,182 +1,181 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" width="70%">
-        <a-form ref="formRef" :model="orderMainModel" :label-col="labelCol" :wrapper-col="wrapperCol" :rules="validatorRules">
-            <a-row class="form-row" :gutter="16">
-                <a-col :lg="8">
-                    <a-form-item label="订单号" name="orderCode">
-                        <a-input v-model:value="orderMainModel.orderCode" placeholder="请输入订单号"/>
-                    </a-form-item>
-                </a-col>
-                <a-col :lg="8">
-                    <a-form-item label="订单类型">
-                        <a-select placeholder="请选择订单类型" v-model:value="orderMainModel.ctype">
-                            <a-select-option value="1">国内订单</a-select-option>
-                            <a-select-option value="2">国际订单</a-select-option>
-                        </a-select>
-                    </a-form-item>
-                </a-col>
-                <a-col :lg="8">
-                    <a-form-item label="订单日期">
-                        <a-date-picker showTime valueFormat="YYYY-MM-DD HH:mm:ss" v-model:value="orderMainModel.orderDate"/>
-                    </a-form-item>
-                </a-col>
-            </a-row>
-            <a-row class="form-row" :gutter="16">
-                <a-col :lg="8">
-                    <a-form-item label="订单金额">
-                        <a-input v-model:value="orderMainModel.orderMoney" placeholder="请输入订单金额"/>
-                    </a-form-item>
-                </a-col>
-                <a-col :lg="8">
-                    <a-form-item label="订单备注">
-                        <a-input v-model:value="orderMainModel.content" placeholder="请输入订单备注"/>
-                    </a-form-item>
-                </a-col>
-            </a-row>
-            <a-tabs defaultActiveKey="1">
-                <a-tab-pane tab="客户信息" key="1">
-                    <a-row class="form-row" :gutter="16">
-                        <a-col :lg="8">
-                            <a-form-item label="客户姓名">
-                                <a-input v-model:value="orderMainModel.jeecgOrderCustomerList.name" placeholder="请输入客户姓名"/>
-                            </a-form-item>
-                        </a-col>
-                        <a-col :lg="8">
-                            <a-form-item label="手机号">
-                                <a-input v-model:value="orderMainModel.jeecgOrderCustomerList.telphone" placeholder="请输入手机号"/>
-                            </a-form-item>
-                        </a-col>
-                    </a-row>
-                </a-tab-pane>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" width="70%">
+    <a-form ref="formRef" :model="orderMainModel" :label-col="labelCol" :wrapper-col="wrapperCol" :rules="validatorRules">
+      <a-row class="form-row" :gutter="16">
+        <a-col :lg="8">
+          <a-form-item label="订单号" name="orderCode">
+            <a-input v-model:value="orderMainModel.orderCode" placeholder="请输入订单号" />
+          </a-form-item>
+        </a-col>
+        <a-col :lg="8">
+          <a-form-item label="订单类型">
+            <a-select placeholder="请选择订单类型" v-model:value="orderMainModel.ctype">
+              <a-select-option value="1">国内订单</a-select-option>
+              <a-select-option value="2">国际订单</a-select-option>
+            </a-select>
+          </a-form-item>
+        </a-col>
+        <a-col :lg="8">
+          <a-form-item label="订单日期">
+            <a-date-picker showTime valueFormat="YYYY-MM-DD HH:mm:ss" v-model:value="orderMainModel.orderDate" />
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <a-row class="form-row" :gutter="16">
+        <a-col :lg="8">
+          <a-form-item label="订单金额">
+            <a-input v-model:value="orderMainModel.orderMoney" placeholder="请输入订单金额" />
+          </a-form-item>
+        </a-col>
+        <a-col :lg="8">
+          <a-form-item label="订单备注">
+            <a-input v-model:value="orderMainModel.content" placeholder="请输入订单备注" />
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <a-tabs defaultActiveKey="1">
+        <a-tab-pane tab="客户信息" key="1">
+          <a-row class="form-row" :gutter="16">
+            <a-col :lg="8">
+              <a-form-item label="客户姓名">
+                <a-input v-model:value="orderMainModel.jeecgOrderCustomerList.name" placeholder="请输入客户姓名" />
+              </a-form-item>
+            </a-col>
+            <a-col :lg="8">
+              <a-form-item label="手机号">
+                <a-input v-model:value="orderMainModel.jeecgOrderCustomerList.telphone" placeholder="请输入手机号" />
+              </a-form-item>
+            </a-col>
+          </a-row>
+        </a-tab-pane>
 
-                <a-tab-pane tab="机票信息" key="2" forceRender>
-                    <a-row class="form-row" :gutter="16">
-                        <a-col :lg="8">
-                            <a-form-item label="航班号">
-                                <a-input v-model:value="orderMainModel.jeecgOrderTicketList.ticketCode" placeholder="请输入航班号"/>
-                            </a-form-item>
-                        </a-col>
-                        <a-col :lg="8">
-                            <a-form-item label="起飞时间">
-                                <a-date-picker showTime valueFormat="YYYY-MM-DD HH:mm:ss" v-model:value="orderMainModel.jeecgOrderTicketList.tickectDate"/>
-                            </a-form-item>
-                        </a-col>
-                    </a-row>
-                </a-tab-pane>
-            </a-tabs>
-        </a-form>
-    </BasicModal>
+        <a-tab-pane tab="机票信息" key="2" forceRender>
+          <a-row class="form-row" :gutter="16">
+            <a-col :lg="8">
+              <a-form-item label="航班号">
+                <a-input v-model:value="orderMainModel.jeecgOrderTicketList.ticketCode" placeholder="请输入航班号" />
+              </a-form-item>
+            </a-col>
+            <a-col :lg="8">
+              <a-form-item label="起飞时间">
+                <a-date-picker showTime valueFormat="YYYY-MM-DD HH:mm:ss" v-model:value="orderMainModel.jeecgOrderTicketList.tickectDate" />
+              </a-form-item>
+            </a-col>
+          </a-row>
+        </a-tab-pane>
+      </a-tabs>
+    </a-form>
+  </BasicModal>
 </template>
 <script lang="ts">
-    import {defineComponent, ref, reactive, computed, unref} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {ValidateErrorEntity} from 'ant-design-vue/es/form/interface';
-    import { saveOrUpdate } from './jvxetable/jvxetable.api'
-    import { orderCustomerList,orderTicketList } from './api'
+  import { defineComponent, ref, reactive, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { ValidateErrorEntity } from 'ant-design-vue/es/form/interface';
+  import { saveOrUpdate } from './jvxetable/jvxetable.api';
+  import { orderCustomerList, orderTicketList } from './api';
 
-    export default defineComponent({
-        name: 'OneToOneModal',
-        components: {BasicModal},
-        emits: ['success', 'register'],
-        setup(props, {emit}) {
-            const isUpdate = ref(true);
-            const rowId = ref('');
-            const formRef = ref();
-            const labelCol = reactive({
-                xs: {span: 24},
-                sm: {span: 5},
-            })
-            const wrapperCol = reactive({
-                xs: {span: 24},
-                sm: {span: 16},
-            })
-            const validatorRules = {
-                orderCode: [
-                    {required: true, message: '订单号不能为空', trigger: 'blur'}
-                ]
-            }
-            const orderMainModel = reactive({
-                id: null,
-                orderCode: "",
-                orderMoney: "",
-                ctype: "",
-                content: "",
-                jeecgOrderCustomerList: {
-                    name:"",
-                    telphone:"",
-                },
-                jeecgOrderTicketList: {
-                    ticketCode:"",
-                    tickectDate:"",
-                }
-            });
-            const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-                setModalProps({confirmLoading: false});
-                reset()
-                isUpdate.value = !!data?.isUpdate;
-                if (unref(isUpdate)) {
-                    rowId.value = data.record.id;
-                    Object.assign(orderMainModel, data.record);
-                    let params = { id: orderMainModel.id };
-                    const customerList = await orderCustomerList(params);
-                    orderMainModel.jeecgOrderCustomerList = customerList[0];
-                    const ticketList = await orderTicketList(params);
-                    orderMainModel.jeecgOrderTicketList = ticketList[0]
-                }
-            });
-            const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
-            
-            function reset(){
-                orderMainModel.id = null;
-                orderMainModel.orderCode = "";
-                orderMainModel.orderMoney = "";
-                orderMainModel.orderDate = null;
-                orderMainModel.ctype = "";
-                orderMainModel.content = "";
-                orderMainModel.jeecgOrderCustomerList = {};
-                orderMainModel.jeecgOrderTicketList = {}
-            }
-            async function handleSubmit() {
-                formRef.value.validate().then(async() => {
-                    try {
-                        console.log('formData', JSON.stringify(orderMainModel));
-                        setModalProps({confirmLoading: true});
-                        orderMainModel.jeecgOrderCustomerList = Object.keys(orderMainModel.jeecgOrderCustomerList).length>0?[orderMainModel.jeecgOrderCustomerList]:[]
-                        orderMainModel.jeecgOrderTicketList = Object.keys(orderMainModel.jeecgOrderTicketList).length>0?[orderMainModel.jeecgOrderTicketList]:[]
-                        await saveOrUpdate(orderMainModel,unref(isUpdate));
-                        closeModal();
-                        emit('success');
-                    } finally {
-                        setModalProps({confirmLoading: false});
-                    }
-                })
-                    .catch((error: ValidateErrorEntity<any>) => {
-                        console.log('error', error);
-                    });
-
-            }
-
-            return {formRef, validatorRules, orderMainModel, registerModal, getTitle, labelCol, wrapperCol, handleSubmit};
+  export default defineComponent({
+    name: 'OneToOneModal',
+    components: { BasicModal },
+    emits: ['success', 'register'],
+    setup(props, { emit }) {
+      const isUpdate = ref(true);
+      const rowId = ref('');
+      const formRef = ref();
+      const labelCol = reactive({
+        xs: { span: 24 },
+        sm: { span: 5 },
+      });
+      const wrapperCol = reactive({
+        xs: { span: 24 },
+        sm: { span: 16 },
+      });
+      const validatorRules = {
+        orderCode: [{ required: true, message: '订单号不能为空', trigger: 'blur' }],
+      };
+      const orderMainModel = reactive({
+        id: null,
+        orderCode: '',
+        orderMoney: '',
+        ctype: '',
+        content: '',
+        jeecgOrderCustomerList: {
+          name: '',
+          telphone: '',
         },
-    });
+        jeecgOrderTicketList: {
+          ticketCode: '',
+          tickectDate: '',
+        },
+      });
+      const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+        setModalProps({ confirmLoading: false });
+        reset();
+        isUpdate.value = !!data?.isUpdate;
+        if (unref(isUpdate)) {
+          rowId.value = data.record.id;
+          Object.assign(orderMainModel, data.record);
+          let params = { id: orderMainModel.id };
+          const customerList = await orderCustomerList(params);
+          orderMainModel.jeecgOrderCustomerList = customerList[0];
+          const ticketList = await orderTicketList(params);
+          orderMainModel.jeecgOrderTicketList = ticketList[0];
+        }
+      });
+      const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
+
+      function reset() {
+        orderMainModel.id = null;
+        orderMainModel.orderCode = '';
+        orderMainModel.orderMoney = '';
+        orderMainModel.orderDate = null;
+        orderMainModel.ctype = '';
+        orderMainModel.content = '';
+        orderMainModel.jeecgOrderCustomerList = {};
+        orderMainModel.jeecgOrderTicketList = {};
+      }
+      async function handleSubmit() {
+        formRef.value
+          .validate()
+          .then(async () => {
+            try {
+              console.log('formData', JSON.stringify(orderMainModel));
+              setModalProps({ confirmLoading: true });
+              orderMainModel.jeecgOrderCustomerList = Object.keys(orderMainModel.jeecgOrderCustomerList).length > 0 ? [orderMainModel.jeecgOrderCustomerList] : [];
+              orderMainModel.jeecgOrderTicketList = Object.keys(orderMainModel.jeecgOrderTicketList).length > 0 ? [orderMainModel.jeecgOrderTicketList] : [];
+              await saveOrUpdate(orderMainModel, unref(isUpdate));
+              closeModal();
+              emit('success');
+            } finally {
+              setModalProps({ confirmLoading: false });
+            }
+          })
+          .catch((error: ValidateErrorEntity<any>) => {
+            console.log('error', error);
+          });
+      }
+
+      return { formRef, validatorRules, orderMainModel, registerModal, getTitle, labelCol, wrapperCol, handleSubmit };
+    },
+  });
 </script>
 <style scoped>
-    .ant-btn {
-        padding: 0 10px;
-        margin-left: 3px;
-    }
+  .ant-btn {
+    padding: 0 10px;
+    margin-left: 3px;
+  }
 
-    .ant-form-item-control {
-        line-height: 0px;
-    }
+  .ant-form-item-control {
+    line-height: 0px;
+  }
 
-    /** 主表单行间距 */
-    .ant-form .ant-form-item {
-        margin-bottom: 10px;
-    }
+  /** 主表单行间距 */
+  .ant-form .ant-form-item {
+    margin-bottom: 10px;
+  }
 
-    /** Tab页面行间距 */
-    .ant-tabs-content .ant-form-item {
-        margin-bottom: 0px;
-    }
+  /** Tab页面行间距 */
+  .ant-tabs-content .ant-form-item {
+    margin-bottom: 0px;
+  }
 </style>
diff --git a/src/views/demo/vextable/VexTableModal.vue b/src/views/demo/vextable/VexTableModal.vue
index b6d8d8a..64573be 100644
--- a/src/views/demo/vextable/VexTableModal.vue
+++ b/src/views/demo/vextable/VexTableModal.vue
@@ -1,172 +1,177 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" width="70%">
-        <a-form ref="formRef" :model="orderMainModel" :label-col="labelCol" :wrapper-col="wrapperCol" :rules="validatorRules">
-            <a-row class="form-row" :gutter="16">
-                <a-col :lg="8">
-                    <a-form-item label="订单号" name="orderCode">
-                        <a-input v-model:value="orderMainModel.orderCode" placeholder="请输入订单号"/>
-                    </a-form-item>
-                </a-col>
-                <a-col :lg="8">
-                    <a-form-item label="订单类型">
-                        <a-select placeholder="请选择订单类型" v-model:value="orderMainModel.ctype">
-                            <a-select-option value="1">国内订单</a-select-option>
-                            <a-select-option value="2">国际订单</a-select-option>
-                        </a-select>
-                    </a-form-item>
-                </a-col>
-                <a-col :lg="8">
-                    <a-form-item label="订单日期">
-                        <a-date-picker showTime valueFormat="YYYY-MM-DD HH:mm:ss" v-model:value="orderMainModel.orderDate"/>
-                    </a-form-item>
-                </a-col>
-            </a-row>
-            <a-row class="form-row" :gutter="16">
-                <a-col :lg="8">
-                    <a-form-item label="订单金额">
-                        <a-input v-model:value="orderMainModel.orderMoney" placeholder="请输入订单金额"/>
-                    </a-form-item>
-                </a-col>
-                <a-col :lg="8">
-                    <a-form-item label="订单备注">
-                        <a-input v-model:value="orderMainModel.content" placeholder="请输入订单备注"/>
-                    </a-form-item>
-                </a-col>
-            </a-row>
-            <a-tabs defaultActiveKey="1">
-                <a-tab-pane tab="客户信息" key="1">
-                    <vxe-toolbar>
-                        <template #buttons>
-                            <vxe-button icon="fa fa-plus" @click="insertEvent()">新增</vxe-button>
-                            <vxe-button @click="$refs.xTable.removeCheckboxRow()">删除选中</vxe-button>
-                        </template>
-                    </vxe-toolbar>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" width="70%">
+    <a-form ref="formRef" :model="orderMainModel" :label-col="labelCol" :wrapper-col="wrapperCol" :rules="validatorRules">
+      <a-row class="form-row" :gutter="16">
+        <a-col :lg="8">
+          <a-form-item label="订单号" name="orderCode">
+            <a-input v-model:value="orderMainModel.orderCode" placeholder="请输入订单号" />
+          </a-form-item>
+        </a-col>
+        <a-col :lg="8">
+          <a-form-item label="订单类型">
+            <a-select placeholder="请选择订单类型" v-model:value="orderMainModel.ctype">
+              <a-select-option value="1">国内订单</a-select-option>
+              <a-select-option value="2">国际订单</a-select-option>
+            </a-select>
+          </a-form-item>
+        </a-col>
+        <a-col :lg="8">
+          <a-form-item label="订单日期">
+            <a-date-picker showTime valueFormat="YYYY-MM-DD HH:mm:ss" v-model:value="orderMainModel.orderDate" />
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <a-row class="form-row" :gutter="16">
+        <a-col :lg="8">
+          <a-form-item label="订单金额">
+            <a-input v-model:value="orderMainModel.orderMoney" placeholder="请输入订单金额" />
+          </a-form-item>
+        </a-col>
+        <a-col :lg="8">
+          <a-form-item label="订单备注">
+            <a-input v-model:value="orderMainModel.content" placeholder="请输入订单备注" />
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <a-tabs defaultActiveKey="1">
+        <a-tab-pane tab="客户信息" key="1">
+          <vxe-toolbar>
+            <template #buttons>
+              <vxe-button icon="fa fa-plus" @click="insertEvent()">新增</vxe-button>
+              <vxe-button @click="$refs.xTable.removeCheckboxRow()">删除选中</vxe-button>
+            </template>
+          </vxe-toolbar>
 
-                    <vxe-table border show-overflow keep-source ref="xTable" max-height="400" :data="orderMainModel.jeecgOrderCustomerList" :edit-config="{trigger: 'click', mode: 'row', icon: 'fa fa-pencil', showStatus: true}">
-                        <vxe-column type="checkbox" width="60" align="center"></vxe-column>
-                        <vxe-column type="seq" width="60" align="center"></vxe-column>
-                        <vxe-column field="name" title="客户名" sortable :edit-render="{name: 'input', defaultValue: ''}"></vxe-column>
-                        <vxe-column field="sex" title="性别" :edit-render="{name: '$select', options: sexList}"></vxe-column>
-                        <vxe-column field="idcard" title="身份证" sortable :edit-render="{name: 'input', defaultValue:''}"></vxe-column>
-                        <vxe-column field="telphone" title="手机" sortable :edit-render="{name: 'input',defaultValue:'' }"></vxe-column>
-                    </vxe-table>
-                </a-tab-pane>
+          <vxe-table
+            border
+            show-overflow
+            keep-source
+            ref="xTable"
+            max-height="400"
+            :data="orderMainModel.jeecgOrderCustomerList"
+            :edit-config="{ trigger: 'click', mode: 'row', icon: 'fa fa-pencil', showStatus: true }"
+          >
+            <vxe-column type="checkbox" width="60" align="center"></vxe-column>
+            <vxe-column type="seq" width="60" align="center"></vxe-column>
+            <vxe-column field="name" title="客户名" sortable :edit-render="{ name: 'input', defaultValue: '' }"></vxe-column>
+            <vxe-column field="sex" title="性别" :edit-render="{ name: '$select', options: sexList }"></vxe-column>
+            <vxe-column field="idcard" title="身份证" sortable :edit-render="{ name: 'input', defaultValue: '' }"></vxe-column>
+            <vxe-column field="telphone" title="手机" sortable :edit-render="{ name: 'input', defaultValue: '' }"></vxe-column>
+          </vxe-table>
+        </a-tab-pane>
 
-                <a-tab-pane tab="机票信息" key="2" forceRender>
-
-                </a-tab-pane>
-            </a-tabs>
-        </a-form>
-    </BasicModal>
+        <a-tab-pane tab="机票信息" key="2" forceRender> </a-tab-pane>
+      </a-tabs>
+    </a-form>
+  </BasicModal>
 </template>
 <script lang="ts">
-    import {defineComponent, ref, reactive, computed, unref} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {ValidateErrorEntity} from 'ant-design-vue/es/form/interface';
-    import { VxeTableInstance } from 'vxe-table'
-    export default defineComponent({
-        name: 'VexTableModal',
-        components: {BasicModal},
-        emits: ['success', 'register'],
-        setup(props, {emit}) {
-            const isUpdate = ref(true);
-            const xTable = ref({} as VxeTableInstance)
-            const rowId = ref('');
-            const formRef = ref();
-            const labelCol = reactive({
-                xs: {span: 24},
-                sm: {span: 5},
-            })
-            const wrapperCol = reactive({
-                xs: {span: 24},
-                sm: {span: 16},
-            })
-            const sexList = ref([
-                { label: '', value: '' },
-                { label: '男', value: '1' },
-                { label: '女', value: '2' }
-            ])
-            const validatorRules = {
-                orderCode: [
-                    {required: true, message: '订单号不能为空', trigger: 'blur'}
-                ]
+  import { defineComponent, ref, reactive, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { ValidateErrorEntity } from 'ant-design-vue/es/form/interface';
+  import { VxeTableInstance } from 'vxe-table';
+  export default defineComponent({
+    name: 'VexTableModal',
+    components: { BasicModal },
+    emits: ['success', 'register'],
+    setup(props, { emit }) {
+      const isUpdate = ref(true);
+      const xTable = ref({} as VxeTableInstance);
+      const rowId = ref('');
+      const formRef = ref();
+      const labelCol = reactive({
+        xs: { span: 24 },
+        sm: { span: 5 },
+      });
+      const wrapperCol = reactive({
+        xs: { span: 24 },
+        sm: { span: 16 },
+      });
+      const sexList = ref([
+        { label: '', value: '' },
+        { label: '男', value: '1' },
+        { label: '女', value: '2' },
+      ]);
+      const validatorRules = {
+        orderCode: [{ required: true, message: '订单号不能为空', trigger: 'blur' }],
+      };
+      const orderMainModel = reactive({
+        id: null,
+        orderCode: '',
+        orderMoney: '',
+        ctype: '',
+        content: '',
+        jeecgOrderCustomerList: [],
+        jeecgOrderTicketList: [],
+      });
+      const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+        orderMainModel.orderCode = '';
+        setModalProps({ confirmLoading: false });
+        isUpdate.value = !!data?.isUpdate;
+
+        if (unref(isUpdate)) {
+          rowId.value = data.record.id;
+          orderMainModel.orderCode = data.record.orderCode;
+        }
+      });
+      const tableData = ref([]);
+      const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
+
+      //动态添加行
+      async function insertEvent(row: any) {
+        const $table = xTable.value;
+        const record = {
+          name: '',
+          sex: '1',
+          idcard: '',
+          telphone: '',
+        };
+        const { row: newRow } = await $table.insertAt(record, row);
+        await $table.setActiveCell(newRow, 'sex');
+      }
+
+      async function handleSubmit() {
+        formRef.value
+          .validate()
+          .then(() => {
+            try {
+              const $table = xTable.value;
+              const { fullData } = $table.getTableData();
+              orderMainModel.jeecgOrderCustomerList = fullData;
+              console.log('formData', JSON.stringify(orderMainModel));
+              setModalProps({ confirmLoading: true });
+              closeModal();
+              emit('success', { isUpdate: unref(isUpdate), values: { id: rowId.value } });
+            } finally {
+              setModalProps({ confirmLoading: false });
             }
-            const orderMainModel = reactive({
-                id: null,
-                orderCode: "",
-                orderMoney: "",
-                ctype: "",
-                content: "",
-                jeecgOrderCustomerList: [],
-                jeecgOrderTicketList: []
-            });
-            const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-                orderMainModel.orderCode = '';
-                setModalProps({confirmLoading: false});
-                isUpdate.value = !!data?.isUpdate;
+          })
+          .catch((error: ValidateErrorEntity<any>) => {
+            console.log('error', error);
+          });
+      }
 
-                if (unref(isUpdate)) {
-                    rowId.value = data.record.id;
-                    orderMainModel.orderCode = data.record.orderCode;
-                }
-            });
-            const tableData = ref([])
-            const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
-
-            //动态添加行
-            async function insertEvent(row: any){
-                const $table = xTable.value
-                const record = {
-                    name: '',
-                    sex: '1',
-                    idcard: '',
-                    telphone: '',
-                }
-                const { row: newRow } = await  $table.insertAt(record, row)
-                await  $table.setActiveCell(newRow, 'sex')
-            }
-
-            async function handleSubmit() {
-                formRef.value.validate().then(() => {
-                    try {
-                        const $table = xTable.value
-                        const { fullData } = $table.getTableData()
-                        orderMainModel.jeecgOrderCustomerList=fullData;
-                        console.log('formData', JSON.stringify(orderMainModel));
-                        setModalProps({confirmLoading: true});
-                        closeModal();
-                        emit('success', {isUpdate: unref(isUpdate), values: {id: rowId.value}});
-                    } finally {
-                        setModalProps({confirmLoading: false});
-                    }
-                })
-                    .catch((error: ValidateErrorEntity<any>) => {
-                        console.log('error', error);
-                    });
-
-            }
-
-            return { xTable, tableData,sexList,formRef, validatorRules, orderMainModel, registerModal, getTitle, labelCol, wrapperCol, insertEvent, handleSubmit};
-        },
-    });
+      return { xTable, tableData, sexList, formRef, validatorRules, orderMainModel, registerModal, getTitle, labelCol, wrapperCol, insertEvent, handleSubmit };
+    },
+  });
 </script>
 <style scoped>
-    .ant-btn {
-        padding: 0 10px;
-        margin-left: 3px;
-    }
+  .ant-btn {
+    padding: 0 10px;
+    margin-left: 3px;
+  }
 
-    .ant-form-item-control {
-        line-height: 0px;
-    }
+  .ant-form-item-control {
+    line-height: 0px;
+  }
 
-    /** 主表单行间距 */
-    .ant-form .ant-form-item {
-        margin-bottom: 10px;
-    }
+  /** 主表单行间距 */
+  .ant-form .ant-form-item {
+    margin-bottom: 10px;
+  }
 
-    /** Tab页面行间距 */
-    .ant-tabs-content .ant-form-item {
-        margin-bottom: 0px;
-    }
+  /** Tab页面行间距 */
+  .ant-tabs-content .ant-form-item {
+    margin-bottom: 0px;
+  }
 </style>
diff --git a/src/views/demo/vextable/api.ts b/src/views/demo/vextable/api.ts
index 886f9b9..c8021ab 100644
--- a/src/views/demo/vextable/api.ts
+++ b/src/views/demo/vextable/api.ts
@@ -1,35 +1,32 @@
-import {defHttp} from '/@/utils/http/axios';
+import { defHttp } from '/@/utils/http/axios';
 
 enum Api {
-    list = '/test/jeecgOrderMain/list',
-    delete = "/test/jeecgOrderMain/delete",
-    orderCustomerList = '/test/jeecgOrderMain/queryOrderCustomerListByMainId',
-    orderTicketList = '/test/jeecgOrderMain/queryOrderTicketListByMainId'
+  list = '/test/jeecgOrderMain/list',
+  delete = '/test/jeecgOrderMain/delete',
+  orderCustomerList = '/test/jeecgOrderMain/queryOrderCustomerListByMainId',
+  orderTicketList = '/test/jeecgOrderMain/queryOrderTicketListByMainId',
 }
 
 /**
  * 列表接口
  * @param params
  */
-export const list = (params) =>
-    defHttp.get({url: Api.list, params});
+export const list = (params) => defHttp.get({ url: Api.list, params });
 /**
  * 子表单信息
  * @param params
  */
-export const orderTicketList = (params) =>
-    defHttp.get({url: Api.orderTicketList, params});
+export const orderTicketList = (params) => defHttp.get({ url: Api.orderTicketList, params });
 /**
  * 子表单信息
  * @param params
  */
-export const orderCustomerList = (params) =>
-    defHttp.get({url: Api.orderCustomerList, params});
+export const orderCustomerList = (params) => defHttp.get({ url: Api.orderCustomerList, params });
 /**
  * 删除用户
  */
 export const deleteOne = (params, handleSuccess) => {
-    return defHttp.delete({url: Api.delete, params}, {joinParamsToUrl: true}).then(() => {
-        handleSuccess();
-    });
-}
+  return defHttp.delete({ url: Api.delete, params }, { joinParamsToUrl: true }).then(() => {
+    handleSuccess();
+  });
+};
diff --git a/src/views/demo/vextable/data.ts b/src/views/demo/vextable/data.ts
index 9668b22..85e8cc6 100644
--- a/src/views/demo/vextable/data.ts
+++ b/src/views/demo/vextable/data.ts
@@ -1,30 +1,29 @@
-import {BasicColumn} from '/@/components/Table';
+import { BasicColumn } from '/@/components/Table';
 
 export const columns: BasicColumn[] = [
-    {
-        title: '订单号',
-        dataIndex: 'orderCode',
-        width: 260,
-    },
-    {
-        title: '订单类型',
-        dataIndex: 'ctype',
-        slots: {customRender: 'ctype'}
-    },
-    {
-        title: '订单日期',
-        dataIndex: 'orderDate',
-        width: 300,
-    },
-    {
-        title: '订单金额',
-        width: 200,
-        dataIndex: 'orderMoney',
-    },
-    {
-        title: '订单备注',
-        width: 200,
-        dataIndex: 'content',
-    }
+  {
+    title: '订单号',
+    dataIndex: 'orderCode',
+    width: 260,
+  },
+  {
+    title: '订单类型',
+    dataIndex: 'ctype',
+    slots: { customRender: 'ctype' },
+  },
+  {
+    title: '订单日期',
+    dataIndex: 'orderDate',
+    width: 300,
+  },
+  {
+    title: '订单金额',
+    width: 200,
+    dataIndex: 'orderMoney',
+  },
+  {
+    title: '订单备注',
+    width: 200,
+    dataIndex: 'content',
+  },
 ];
-
diff --git a/src/views/demo/vextable/drawer.vue b/src/views/demo/vextable/drawer.vue
index c28ccc5..7f94b04 100644
--- a/src/views/demo/vextable/drawer.vue
+++ b/src/views/demo/vextable/drawer.vue
@@ -1,40 +1,38 @@
 <template>
-    <BasicDrawer v-bind="$attrs" @register="registerDrawer" showFooter :title="getTitle" width="500px" @ok="handleSubmit">
-
-    </BasicDrawer>
+  <BasicDrawer v-bind="$attrs" @register="registerDrawer" showFooter :title="getTitle" width="500px" @ok="handleSubmit"> </BasicDrawer>
 </template>
 <script lang="ts">
-    import {defineComponent, ref, computed, unref} from 'vue';
-    import {BasicDrawer, useDrawerInner} from '/@/components/Drawer';
+  import { defineComponent, ref, computed, unref } from 'vue';
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
 
-    export default defineComponent({
-        name: 'tableDrawer',
-        components: {BasicDrawer},
-        emits: ['success', 'register'],
-        setup(_, {emit}) {
-            const isUpdate = ref(true);
-            const [registerDrawer, {setDrawerProps, closeDrawer}] = useDrawerInner(async (data) => {
-                setDrawerProps({confirmLoading: false});
-                isUpdate.value = !!data?.isUpdate;
-            });
+  export default defineComponent({
+    name: 'tableDrawer',
+    components: { BasicDrawer },
+    emits: ['success', 'register'],
+    setup(_, { emit }) {
+      const isUpdate = ref(true);
+      const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
+        setDrawerProps({ confirmLoading: false });
+        isUpdate.value = !!data?.isUpdate;
+      });
 
-            const getTitle = computed(() => (!unref(isUpdate) ? '新增角色' : '编辑角色'));
+      const getTitle = computed(() => (!unref(isUpdate) ? '新增角色' : '编辑角色'));
 
-            async function handleSubmit() {
-                try {
-                    setDrawerProps({confirmLoading: true});
-                    closeDrawer();
-                    emit('success');
-                } finally {
-                    setDrawerProps({confirmLoading: false});
-                }
-            }
+      async function handleSubmit() {
+        try {
+          setDrawerProps({ confirmLoading: true });
+          closeDrawer();
+          emit('success');
+        } finally {
+          setDrawerProps({ confirmLoading: false });
+        }
+      }
 
-            return {
-                registerDrawer,
-                getTitle,
-                handleSubmit
-            };
-        },
-    });
+      return {
+        registerDrawer,
+        getTitle,
+        handleSubmit,
+      };
+    },
+  });
 </script>
diff --git a/src/views/demo/vextable/index.vue b/src/views/demo/vextable/index.vue
index 3f6a2d3..1f73b59 100644
--- a/src/views/demo/vextable/index.vue
+++ b/src/views/demo/vextable/index.vue
@@ -1,138 +1,140 @@
 <template>
-    <div class="p-4">
-        <BasicTable @register="registerTable" :rowSelection="rowSelection">
-            <template #tableTitle>
-                <a-dropdown>
-                    <template #overlay>
-                        <a-menu @click="handleCreate">
-                            <a-menu-item :key="1">一对一示例</a-menu-item>
-                            <a-menu-item :key="2">一对多示例</a-menu-item>
-                            <a-menu-item :key="3">一对多(JVexTable)</a-menu-item>
-                        </a-menu>
-                    </template>
-                    <a-button type="primary">新增 <DownOutlined /></a-button>
-                </a-dropdown>
-            </template>
-            <template #ctype="{ text }">
-                {{text===1?'国内订单':text===2?'国际订单':''}}
-            </template>
-            <template #action="{ record }">
-                <TableAction :actions="getAction(record)" :dropDownActions="getDropDownActions(record)"/>
-            </template>
-        </BasicTable>
-        <!--        <TableDrawer @register="registerDrawer" @success="handleSuccess" />-->
-        <TableModal @register="registerModal" @success="handleSuccess"/>
-        <JVxeTableModal @register="registerVexTableModal" @success="handleSuccess"></JVxeTableModal>
-        <OneToOneModal @register="registerOneToOneModal" @success="handleSuccess"></OneToOneModal>
-    </div>
+  <div class="p-4">
+    <BasicTable @register="registerTable" :rowSelection="rowSelection">
+      <template #tableTitle>
+        <a-dropdown>
+          <template #overlay>
+            <a-menu @click="handleCreate">
+              <a-menu-item :key="1">一对一示例</a-menu-item>
+              <a-menu-item :key="2">一对多示例</a-menu-item>
+              <a-menu-item :key="3">一对多(JVexTable)</a-menu-item>
+            </a-menu>
+          </template>
+          <a-button type="primary">新增 <DownOutlined /></a-button>
+        </a-dropdown>
+      </template>
+      <template #ctype="{ text }">
+        {{ text === 1 ? '国内订单' : text === 2 ? '国际订单' : '' }}
+      </template>
+      <template #action="{ record }">
+        <TableAction :actions="getAction(record)" :dropDownActions="getDropDownActions(record)" />
+      </template>
+    </BasicTable>
+    <!--        <TableDrawer @register="registerDrawer" @success="handleSuccess" />-->
+    <TableModal @register="registerModal" @success="handleSuccess" />
+    <JVxeTableModal @register="registerVexTableModal" @success="handleSuccess"></JVxeTableModal>
+    <OneToOneModal @register="registerOneToOneModal" @success="handleSuccess"></OneToOneModal>
+  </div>
 </template>
 <script lang="ts" setup>
-    import {ref} from 'vue';
-    import {BasicTable, useTable, TableAction} from '/@/components/Table';
-    import TableDrawer from './drawer.vue';
-    import TableModal from './modal.vue';
-    import VexTableModal from './VexTableModal.vue';
-    import JVxeTableModal from './jvxetable/JVxeTableModal.vue';
-    import OneToOneModal from './OneToOneModal.vue';
-    import { DownOutlined } from '@ant-design/icons-vue';
-    import { useListPage } from '/@/hooks/system/useListPage'
-    
-    import {useModal} from "/@/components/Modal";
-    import {columns} from "./data";
-    import {list,deleteOne} from "./api";
-    
-    const [registerModal, {openModal}] = useModal();
-    const [registerOneToOneModal, {openModal: openOneToOneModal}] = useModal();
-    const [registerVexTableModal, {openModal: openVexTableModal}] = useModal();
-    
-    //定义表格行操作
-    const getAction = (record) => {
-        return [{
-            label: '编辑',
-            onClick: handleEdit.bind(null, record),
-        }]
-    };
-    
-    const getDropDownActions = (record) => {
-        return [
-            {
-                label: '删除',
-                popConfirm: {
-                    title: '是否删除？',
-                    confirm: handleDelete.bind(null, record),
-                },
-            },
-        ]
-    };
-    
-    // 列表页面公共参数、方法
-    const { tableContext } = useListPage({
-        tableProps: {
-            api: list,
-            columns: columns,
-            useSearchForm:false,
-            actionColumn: {
-                width: 160,
-                title: '操作',
-                dataIndex: 'action',
-                slots: {customRender: 'action'},
-            },
-        }
-    });
-    
-    //注册table数据
-    const [registerTable, {reload},{ rowSelection }] = tableContext;
-    //新增类型
-    const addType = ref(1);
-    //添加事件
-    function handleCreate(e) {
-        addType.value = e.key
-        let type = addType.value;
-        if (type == 1) {
-            openOneToOneModal(true, {
-                isUpdate: false,
-            });
-        }
-        if (type == 2) {
-            openModal(true, {
-                isUpdate: false,
-            });
-        }
-        if (type == 3) {
-            openVexTableModal(true, {
-                isUpdate: false,
-            });
-        }
-    }
+  import { ref } from 'vue';
+  import { BasicTable, useTable, TableAction } from '/@/components/Table';
+  import TableDrawer from './drawer.vue';
+  import TableModal from './modal.vue';
+  import VexTableModal from './VexTableModal.vue';
+  import JVxeTableModal from './jvxetable/JVxeTableModal.vue';
+  import OneToOneModal from './OneToOneModal.vue';
+  import { DownOutlined } from '@ant-design/icons-vue';
+  import { useListPage } from '/@/hooks/system/useListPage';
 
-    //编辑事件
-    function handleEdit(record: Recordable) {
-        let type = addType.value;
-        if (type == 1) {
-            openOneToOneModal(true, {
-                record,
-                isUpdate: true,
-            });
-        }
-        if (type == 2) {
-            openModal(true, {
-                record,
-                isUpdate: true,
-            });
-        }
-        if (type == 3) {
-            openVexTableModal(true, {
-                record,
-                isUpdate: true,
-            });
-        }
-    }
+  import { useModal } from '/@/components/Modal';
+  import { columns } from './data';
+  import { list, deleteOne } from './api';
 
-    async function handleDelete(record: Recordable) {
-        await deleteOne({id: record.id}, reload);
+  const [registerModal, { openModal }] = useModal();
+  const [registerOneToOneModal, { openModal: openOneToOneModal }] = useModal();
+  const [registerVexTableModal, { openModal: openVexTableModal }] = useModal();
+
+  //定义表格行操作
+  const getAction = (record) => {
+    return [
+      {
+        label: '编辑',
+        onClick: handleEdit.bind(null, record),
+      },
+    ];
+  };
+
+  const getDropDownActions = (record) => {
+    return [
+      {
+        label: '删除',
+        popConfirm: {
+          title: '是否删除？',
+          confirm: handleDelete.bind(null, record),
+        },
+      },
+    ];
+  };
+
+  // 列表页面公共参数、方法
+  const { tableContext } = useListPage({
+    tableProps: {
+      api: list,
+      columns: columns,
+      useSearchForm: false,
+      actionColumn: {
+        width: 160,
+        title: '操作',
+        dataIndex: 'action',
+        slots: { customRender: 'action' },
+      },
+    },
+  });
+
+  //注册table数据
+  const [registerTable, { reload }, { rowSelection }] = tableContext;
+  //新增类型
+  const addType = ref(1);
+  //添加事件
+  function handleCreate(e) {
+    addType.value = e.key;
+    let type = addType.value;
+    if (type == 1) {
+      openOneToOneModal(true, {
+        isUpdate: false,
+      });
     }
-    
-    function handleSuccess() {
-        reload()
+    if (type == 2) {
+      openModal(true, {
+        isUpdate: false,
+      });
     }
+    if (type == 3) {
+      openVexTableModal(true, {
+        isUpdate: false,
+      });
+    }
+  }
+
+  //编辑事件
+  function handleEdit(record: Recordable) {
+    let type = addType.value;
+    if (type == 1) {
+      openOneToOneModal(true, {
+        record,
+        isUpdate: true,
+      });
+    }
+    if (type == 2) {
+      openModal(true, {
+        record,
+        isUpdate: true,
+      });
+    }
+    if (type == 3) {
+      openVexTableModal(true, {
+        record,
+        isUpdate: true,
+      });
+    }
+  }
+
+  async function handleDelete(record: Recordable) {
+    await deleteOne({ id: record.id }, reload);
+  }
+
+  function handleSuccess() {
+    reload();
+  }
 </script>
diff --git a/src/views/demo/vextable/index2.vue b/src/views/demo/vextable/index2.vue
index 2974b47..01a00ad 100644
--- a/src/views/demo/vextable/index2.vue
+++ b/src/views/demo/vextable/index2.vue
@@ -1,42 +1,39 @@
 <template>
-    <div style="padding: 5px">
-        <vxe-toolbar>
-            <template #buttons>
-                <vxe-button @click="allAlign = 'left'">新增</vxe-button>
-            </template>
-        </vxe-toolbar>
+  <div style="padding: 5px">
+    <vxe-toolbar>
+      <template #buttons>
+        <vxe-button @click="allAlign = 'left'">新增</vxe-button>
+      </template>
+    </vxe-toolbar>
 
-        <vxe-table :align="allAlign" :data="tableData1">
-            <vxe-table-column type="seq" width="60"></vxe-table-column>
-            <vxe-table-column field="name" title="Name"></vxe-table-column>
-            <vxe-table-column field="sex" title="Sex"></vxe-table-column>
-            <vxe-table-column field="age" title="Age"></vxe-table-column>
-        </vxe-table>
-    </div>
+    <vxe-table :align="allAlign" :data="tableData1">
+      <vxe-table-column type="seq" width="60"></vxe-table-column>
+      <vxe-table-column field="name" title="Name"></vxe-table-column>
+      <vxe-table-column field="sex" title="Sex"></vxe-table-column>
+      <vxe-table-column field="age" title="Age"></vxe-table-column>
+    </vxe-table>
+  </div>
 </template>
-<script lang='ts'>
-    import {defineComponent, ref} from 'vue'
-    import {CollapseContainer} from '/@/components/Container/index';
-
-    export default defineComponent({
-        components: {CollapseContainer},
-        setup() {
-            const allAlign = ref(null)
-            const tableData1 = ref([
-                {id: 10001, name: 'Test1', role: 'Develop', sex: 'Man', age: 28, address: 'vxe-table 从入门到放弃'},
-                {id: 10002, name: 'Test2', role: 'Test', sex: 'Women', age: 22, address: 'Guangzhou'},
-                {id: 10003, name: 'Test3', role: 'PM', sex: 'Man', age: 32, address: 'Shanghai'},
-                {id: 10004, name: 'Test4', role: 'Designer', sex: 'Women', age: 24, address: 'Shanghai'}
-            ])
-            return {
-                allAlign,
-                tableData1
-            }
-        }
-    })
+<script lang="ts">
+  import { defineComponent, ref } from 'vue';
+  import { CollapseContainer } from '/@/components/Container/index';
 
+  export default defineComponent({
+    components: { CollapseContainer },
+    setup() {
+      const allAlign = ref(null);
+      const tableData1 = ref([
+        { id: 10001, name: 'Test1', role: 'Develop', sex: 'Man', age: 28, address: 'vxe-table 从入门到放弃' },
+        { id: 10002, name: 'Test2', role: 'Test', sex: 'Women', age: 22, address: 'Guangzhou' },
+        { id: 10003, name: 'Test3', role: 'PM', sex: 'Man', age: 32, address: 'Shanghai' },
+        { id: 10004, name: 'Test4', role: 'Designer', sex: 'Women', age: 24, address: 'Shanghai' },
+      ]);
+      return {
+        allAlign,
+        tableData1,
+      };
+    },
+  });
 </script>
 
-<style lang='css' scoped>
-
-</style>
+<style lang="css" scoped></style>
diff --git a/src/views/demo/vextable/jvxetable/JVxeTableModal.vue b/src/views/demo/vextable/jvxetable/JVxeTableModal.vue
index 6bbc2e9..61de391 100644
--- a/src/views/demo/vextable/jvxetable/JVxeTableModal.vue
+++ b/src/views/demo/vextable/jvxetable/JVxeTableModal.vue
@@ -1,173 +1,170 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" width="70%">
-        <a-form ref="formRef" :model="orderMainModel" :label-col="labelCol" :wrapper-col="wrapperCol" :rules="validatorRules">
-            <a-row class="form-row" :gutter="16">
-                <a-col :lg="8">
-                    <a-form-item label="订单号" name="orderCode">
-                        <a-input v-model:value="orderMainModel.orderCode" placeholder="请输入订单号"/>
-                    </a-form-item>
-                </a-col>
-                <a-col :lg="8">
-                    <a-form-item label="订单类型" name="ctype">
-                        <a-select placeholder="请选择订单类型" v-model:value="orderMainModel.ctype">
-                            <a-select-option value="1">国内订单</a-select-option>
-                            <a-select-option value="2">国际订单</a-select-option>
-                        </a-select>
-                    </a-form-item>
-                </a-col>
-                <a-col :lg="8">
-                    <a-form-item label="订单日期"  name="orderDate">
-                        <a-date-picker showTime valueFormat="YYYY-MM-DD HH:mm:ss" v-model:value="orderMainModel.orderDate"/>
-                    </a-form-item>
-                </a-col>
-            </a-row>
-            <a-row class="form-row" :gutter="16">
-                <a-col :lg="8">
-                    <a-form-item label="订单金额" name="orderMoney">
-                        <a-input v-model:value="orderMainModel.orderMoney" placeholder="请输入订单金额"/>
-                    </a-form-item>
-                </a-col>
-                <a-col :lg="8">
-                    <a-form-item label="订单备注"  name="content">
-                        <a-input v-model:value="orderMainModel.content" placeholder="请输入订单备注"/>
-                    </a-form-item>
-                </a-col>
-            </a-row>
-            <!-- 子表单区域 -->
-            <a-tabs v-model:activeKey="activeKey" @change="handleChangeTabs">
-                <a-tab-pane tab="客户信息" key="tableRef1">
-                    <JVxeTable
-                            ref="tableRef1"
-                            stripe
-                            toolbar
-                            rowNumber
-                            rowSelection
-                            resizable
-                            keepSource
-                            :maxHeight="300"
-                            :checkbox-config="{range: true}"
-                            :loading="table1.loading"
-                            :columns="table1.columns"
-                            :dataSource="table1.dataSource"
-                    ></JVxeTable>
-                </a-tab-pane>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" width="70%">
+    <a-form ref="formRef" :model="orderMainModel" :label-col="labelCol" :wrapper-col="wrapperCol" :rules="validatorRules">
+      <a-row class="form-row" :gutter="16">
+        <a-col :lg="8">
+          <a-form-item label="订单号" name="orderCode">
+            <a-input v-model:value="orderMainModel.orderCode" placeholder="请输入订单号" />
+          </a-form-item>
+        </a-col>
+        <a-col :lg="8">
+          <a-form-item label="订单类型" name="ctype">
+            <a-select placeholder="请选择订单类型" v-model:value="orderMainModel.ctype">
+              <a-select-option value="1">国内订单</a-select-option>
+              <a-select-option value="2">国际订单</a-select-option>
+            </a-select>
+          </a-form-item>
+        </a-col>
+        <a-col :lg="8">
+          <a-form-item label="订单日期" name="orderDate">
+            <a-date-picker showTime valueFormat="YYYY-MM-DD HH:mm:ss" v-model:value="orderMainModel.orderDate" />
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <a-row class="form-row" :gutter="16">
+        <a-col :lg="8">
+          <a-form-item label="订单金额" name="orderMoney">
+            <a-input v-model:value="orderMainModel.orderMoney" placeholder="请输入订单金额" />
+          </a-form-item>
+        </a-col>
+        <a-col :lg="8">
+          <a-form-item label="订单备注" name="content">
+            <a-input v-model:value="orderMainModel.content" placeholder="请输入订单备注" />
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <!-- 子表单区域 -->
+      <a-tabs v-model:activeKey="activeKey" @change="handleChangeTabs">
+        <a-tab-pane tab="客户信息" key="tableRef1">
+          <JVxeTable
+            ref="tableRef1"
+            stripe
+            toolbar
+            rowNumber
+            rowSelection
+            resizable
+            keepSource
+            :maxHeight="300"
+            :checkbox-config="{ range: true }"
+            :loading="table1.loading"
+            :columns="table1.columns"
+            :dataSource="table1.dataSource"
+          ></JVxeTable>
+        </a-tab-pane>
 
-                <a-tab-pane tab="机票信息" key="tableRef2" forceRender>
-                    <JVxeTable
-                            ref="tableRef2"
-                            stripe
-                            toolbar
-                            rowNumber
-                            rowSelection
-                            resizable
-                            keepSource
-                            :maxHeight="300"
-                            :checkbox-config="{range: true}"
-                            :loading="table2.loading"
-                            :columns="table2.columns"
-                            :dataSource="table2.dataSource"
-                    ></JVxeTable>
-                </a-tab-pane>
-            </a-tabs>
-        </a-form>
-    </BasicModal>
+        <a-tab-pane tab="机票信息" key="tableRef2" forceRender>
+          <JVxeTable
+            ref="tableRef2"
+            stripe
+            toolbar
+            rowNumber
+            rowSelection
+            resizable
+            keepSource
+            :maxHeight="300"
+            :checkbox-config="{ range: true }"
+            :loading="table2.loading"
+            :columns="table2.columns"
+            :dataSource="table2.dataSource"
+          ></JVxeTable>
+        </a-tab-pane>
+      </a-tabs>
+    </a-form>
+  </BasicModal>
 </template>
 <script lang="ts">
-    import {defineComponent, ref, reactive, computed, unref} from 'vue';
-    import {BasicModal, useModalInner} from '/src/components/Modal';
-    import { JVxeTable } from '/src/components/jeecg/JVxeTable'
-    import { columns,columns1 } from './jvxetable.data'
-    import { orderCustomerList,orderTicketList,saveOrUpdate } from './jvxetable.api'
-    import { useJvxeMethod } from '/@/hooks/system/useJvxeMethods.ts'
-    export default defineComponent({
-        name: 'JVexTableModal',
-        components: {BasicModal,JVxeTable},
-        emits: ['success', 'register'],
-        setup(props, {emit}) {
-            const isUpdate = ref(true);
-            const tableRef1 = ref();
-            const tableRef2 = ref();
-            const refKeys = ref(['tableRef1','tableRef2']);
-            const activeKey = ref('tableRef1');
-            const tableRefs = {tableRef1,tableRef2};
-            const labelCol = reactive({
-                xs: {span: 24},
-                sm: {span: 5},
-            });
-            const wrapperCol = reactive({
-                xs: {span: 24},
-                sm: {span: 16},
-            });
-            // 客户信息
-            const table1= reactive({
-                loading: false,
-                dataSource: [],
-                columns
-            });
-            // 机票信息
-            const table2 = reactive({
-                loading: false,
-                dataSource: [],
-                columns: columns1
-            });
-            const orderMainModel = reactive({
-                id: null,
-                orderCode: "",
-                orderMoney: "",
-                ctype: "",
-                content: "",
-                jeecgOrderCustomerList: [],
-                jeecgOrderTicketList: []
-            });
-            const [handleChangeTabs,handleSubmit,requestSubTableData,formRef] = useJvxeMethod(requestAddOrEdit,classifyIntoFormData,tableRefs,activeKey,refKeys);
-            const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-                setModalProps({confirmLoading: false});
-                reset()
-                isUpdate.value = !!data?.isUpdate;
-                if (unref(isUpdate)) {
-                     Object.assign(orderMainModel, data.record);
-                    //加载子表数据
-                    let params = { id: orderMainModel.id }
-                    requestSubTableData(orderCustomerList, params, table1)
-                    requestSubTableData(orderTicketList, params, table2)
-                }
-            });
-            
-            const validatorRules = {orderCode: [{required: true, message: '订单号不能为空', trigger: 'blur'}] };
-            const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
-          
-            
-            function classifyIntoFormData(allValues){
-                let orderMain = Object.assign(orderMainModel, allValues.formValue)
-                return {
-                    ...orderMain, // 展开
-                    jeecgOrderCustomerList: allValues.tablesValue[0].tableData,
-                    jeecgOrderTicketList: allValues.tablesValue[1].tableData
-                }
-            }
-            function reset(){
-                orderMainModel.id = null;
-                orderMainModel.orderCode = "";
-                orderMainModel.orderMoney = "";
-                orderMainModel.orderDate = null;
-                orderMainModel.ctype = "";
-                orderMainModel.content = "";
-                orderMainModel.jeecgOrderCustomerList = [];
-                orderMainModel.jeecgOrderTicketList = []
-            }
-            async function requestAddOrEdit(values){
-                setModalProps({confirmLoading: true});
-                //提交表单
-                await saveOrUpdate(values,unref(isUpdate));
-                //关闭弹窗
-                closeModal();
-                //刷新列表
-                emit('success');
-            }
-            return { formRef,activeKey,table1,table2,tableRef1,tableRef2,getTitle, labelCol, wrapperCol, validatorRules, orderMainModel, registerModal,handleChangeTabs, handleSubmit};
-        },
-    });
+  import { defineComponent, ref, reactive, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/src/components/Modal';
+  import { JVxeTable } from '/src/components/jeecg/JVxeTable';
+  import { columns, columns1 } from './jvxetable.data';
+  import { orderCustomerList, orderTicketList, saveOrUpdate } from './jvxetable.api';
+  import { useJvxeMethod } from '/@/hooks/system/useJvxeMethods.ts';
+  export default defineComponent({
+    name: 'JVexTableModal',
+    components: { BasicModal, JVxeTable },
+    emits: ['success', 'register'],
+    setup(props, { emit }) {
+      const isUpdate = ref(true);
+      const tableRef1 = ref();
+      const tableRef2 = ref();
+      const refKeys = ref(['tableRef1', 'tableRef2']);
+      const activeKey = ref('tableRef1');
+      const tableRefs = { tableRef1, tableRef2 };
+      const labelCol = reactive({
+        xs: { span: 24 },
+        sm: { span: 5 },
+      });
+      const wrapperCol = reactive({
+        xs: { span: 24 },
+        sm: { span: 16 },
+      });
+      // 客户信息
+      const table1 = reactive({
+        loading: false,
+        dataSource: [],
+        columns,
+      });
+      // 机票信息
+      const table2 = reactive({
+        loading: false,
+        dataSource: [],
+        columns: columns1,
+      });
+      const orderMainModel = reactive({
+        id: null,
+        orderCode: '',
+        orderMoney: '',
+        ctype: '',
+        content: '',
+        jeecgOrderCustomerList: [],
+        jeecgOrderTicketList: [],
+      });
+      const [handleChangeTabs, handleSubmit, requestSubTableData, formRef] = useJvxeMethod(requestAddOrEdit, classifyIntoFormData, tableRefs, activeKey, refKeys);
+      const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+        setModalProps({ confirmLoading: false });
+        reset();
+        isUpdate.value = !!data?.isUpdate;
+        if (unref(isUpdate)) {
+          Object.assign(orderMainModel, data.record);
+          //加载子表数据
+          let params = { id: orderMainModel.id };
+          requestSubTableData(orderCustomerList, params, table1);
+          requestSubTableData(orderTicketList, params, table2);
+        }
+      });
+
+      const validatorRules = { orderCode: [{ required: true, message: '订单号不能为空', trigger: 'blur' }] };
+      const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
+
+      function classifyIntoFormData(allValues) {
+        let orderMain = Object.assign(orderMainModel, allValues.formValue);
+        return {
+          ...orderMain, // 展开
+          jeecgOrderCustomerList: allValues.tablesValue[0].tableData,
+          jeecgOrderTicketList: allValues.tablesValue[1].tableData,
+        };
+      }
+      function reset() {
+        orderMainModel.id = null;
+        orderMainModel.orderCode = '';
+        orderMainModel.orderMoney = '';
+        orderMainModel.orderDate = null;
+        orderMainModel.ctype = '';
+        orderMainModel.content = '';
+        orderMainModel.jeecgOrderCustomerList = [];
+        orderMainModel.jeecgOrderTicketList = [];
+      }
+      async function requestAddOrEdit(values) {
+        setModalProps({ confirmLoading: true });
+        //提交表单
+        await saveOrUpdate(values, unref(isUpdate));
+        //关闭弹窗
+        closeModal();
+        //刷新列表
+        emit('success');
+      }
+      return { formRef, activeKey, table1, table2, tableRef1, tableRef2, getTitle, labelCol, wrapperCol, validatorRules, orderMainModel, registerModal, handleChangeTabs, handleSubmit };
+    },
+  });
 </script>
-<style scoped>
-  
-</style>
+<style scoped></style>
diff --git a/src/views/demo/vextable/jvxetable/jvxetable.api.ts b/src/views/demo/vextable/jvxetable/jvxetable.api.ts
index b2f9899..b00fb60 100644
--- a/src/views/demo/vextable/jvxetable/jvxetable.api.ts
+++ b/src/views/demo/vextable/jvxetable/jvxetable.api.ts
@@ -1,9 +1,9 @@
-import {defHttp} from '/@/utils/http/axios';
+import { defHttp } from '/@/utils/http/axios';
 enum Api {
-    save = '/test/jeecgOrderMain/add',
-    edit = '/test/jeecgOrderMain/edit',
-    orderCustomerList ='/test/jeecgOrderMain/queryOrderCustomerListByMainId',
-    orderTicketList = '/test/jeecgOrderMain/queryOrderTicketListByMainId'
+  save = '/test/jeecgOrderMain/add',
+  edit = '/test/jeecgOrderMain/edit',
+  orderCustomerList = '/test/jeecgOrderMain/queryOrderCustomerListByMainId',
+  orderTicketList = '/test/jeecgOrderMain/queryOrderTicketListByMainId',
 }
 export const orderCustomerList = Api.orderCustomerList;
 export const orderTicketList = Api.orderTicketList;
@@ -12,6 +12,6 @@ export const orderTicketList = Api.orderTicketList;
  * @param params
  */
 export const saveOrUpdate = (params, isUpdate) => {
-    let url = isUpdate ? Api.edit : Api.save;
-    return defHttp.post({url: url, params});
-}
+  let url = isUpdate ? Api.edit : Api.save;
+  return defHttp.post({ url: url, params });
+};
diff --git a/src/views/demo/vextable/jvxetable/jvxetable.data.ts b/src/views/demo/vextable/jvxetable/jvxetable.data.ts
index 064b6ba..f746647 100644
--- a/src/views/demo/vextable/jvxetable/jvxetable.data.ts
+++ b/src/views/demo/vextable/jvxetable/jvxetable.data.ts
@@ -1,70 +1,73 @@
-import {JVxeTypes, JVxeColumn} from '/src/components/jeecg/JVxeTable/types'
+import { JVxeTypes, JVxeColumn } from '/src/components/jeecg/JVxeTable/types';
 
 export const columns: JVxeColumn[] = [
-    {
-        title: '客户名',
-        key: 'name',
-        width: 180,
-        type: JVxeTypes.input,
-        defaultValue: '',
-        placeholder: '请输入${title}',
-        validateRules: [{required: true, message: '${title}不能为空'}]
-    },
-    {
-        title: '性别',
-        key: 'sex',
-        width: 180,
-        type: JVxeTypes.select,
-        options: [ // 下拉选项
-            {title: '男', value: '1'},
-            {title: '女', value: '2'}
-        ],
-        defaultValue: '',
-        placeholder: '请选择${title}'
-    },
-    {
-        title: '身份证号',
-        key: 'idcard',
-        width: 180,
-        type: JVxeTypes.input,
-        defaultValue: '',
-        placeholder: '请输入${title}',
-        validateRules: [{
-            pattern: '^\\d{6}(18|19|20)?\\d{2}(0[1-9]|1[012])(0[1-9]|[12]\\d|3[01])\\d{3}(\\d|[xX])$',
-            message: '${title}格式不正确'
-        }]
-    },
-    {
-        title: '手机号',
-        key: 'telphone',
-        width: 180,
-        type: JVxeTypes.input,
-        defaultValue: '',
-        placeholder: '请输入${title}',
-        validateRules: [{
-            pattern: '^1(3|4|5|7|8)\\d{9}$',
-            message: '${title}格式不正确'
-        }]
-    }
+  {
+    title: '客户名',
+    key: 'name',
+    width: 180,
+    type: JVxeTypes.input,
+    defaultValue: '',
+    placeholder: '请输入${title}',
+    validateRules: [{ required: true, message: '${title}不能为空' }],
+  },
+  {
+    title: '性别',
+    key: 'sex',
+    width: 180,
+    type: JVxeTypes.select,
+    options: [
+      // 下拉选项
+      { title: '男', value: '1' },
+      { title: '女', value: '2' },
+    ],
+    defaultValue: '',
+    placeholder: '请选择${title}',
+  },
+  {
+    title: '身份证号',
+    key: 'idcard',
+    width: 180,
+    type: JVxeTypes.input,
+    defaultValue: '',
+    placeholder: '请输入${title}',
+    validateRules: [
+      {
+        pattern: '^\\d{6}(18|19|20)?\\d{2}(0[1-9]|1[012])(0[1-9]|[12]\\d|3[01])\\d{3}(\\d|[xX])$',
+        message: '${title}格式不正确',
+      },
+    ],
+  },
+  {
+    title: '手机号',
+    key: 'telphone',
+    width: 180,
+    type: JVxeTypes.input,
+    defaultValue: '',
+    placeholder: '请输入${title}',
+    validateRules: [
+      {
+        pattern: '^1(3|4|5|7|8)\\d{9}$',
+        message: '${title}格式不正确',
+      },
+    ],
+  },
 ];
 export const columns1: JVxeColumn[] = [
-    {
-        title: '航班号',
-        key: 'ticketCode',
-        width: 180,
-        type: JVxeTypes.input,
-        defaultValue: '',
-        placeholder: '请输入${title}',
-        validateRules: [{ required: true, message: '${title}不能为空' }]
-    },
-    {
-        title: '航班时间',
-        key: 'tickectDate',
-        width: 180,
-        type: JVxeTypes.date,
-        placeholder: '请选择${title}',
-        defaultValue: ''
-    }
+  {
+    title: '航班号',
+    key: 'ticketCode',
+    width: 180,
+    type: JVxeTypes.input,
+    defaultValue: '',
+    placeholder: '请输入${title}',
+    validateRules: [{ required: true, message: '${title}不能为空' }],
+  },
+  {
+    title: '航班时间',
+    key: 'tickectDate',
+    width: 180,
+    type: JVxeTypes.date,
+    placeholder: '请选择${title}',
+    defaultValue: '',
+  },
 ];
-
-
diff --git a/src/views/demo/vextable/modal.vue b/src/views/demo/vextable/modal.vue
index df3aab5..4eb22f2 100644
--- a/src/views/demo/vextable/modal.vue
+++ b/src/views/demo/vextable/modal.vue
@@ -1,249 +1,248 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" width="70%">
-        <a-form ref="formRef" :model="orderMainModel" :label-col="labelCol" :wrapper-col="wrapperCol" :rules="validatorRules">
-            <a-row class="form-row" :gutter="16">
-                <a-col :lg="8">
-                    <a-form-item label="订单号" name="orderCode">
-                        <a-input v-model:value="orderMainModel.orderCode" placeholder="请输入订单号"/>
-                    </a-form-item>
-                </a-col>
-                <a-col :lg="8">
-                    <a-form-item label="订单类型">
-                        <a-select placeholder="请选择订单类型" v-model:value="orderMainModel.ctype">
-                            <a-select-option value="1">国内订单</a-select-option>
-                            <a-select-option value="2">国际订单</a-select-option>
-                        </a-select>
-                    </a-form-item>
-                </a-col>
-                <a-col :lg="8">
-                    <a-form-item label="订单日期">
-                        <a-date-picker showTime valueFormat="YYYY-MM-DD HH:mm:ss" v-model:value="orderMainModel.orderDate"/>
-                    </a-form-item>
-                </a-col>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" width="70%">
+    <a-form ref="formRef" :model="orderMainModel" :label-col="labelCol" :wrapper-col="wrapperCol" :rules="validatorRules">
+      <a-row class="form-row" :gutter="16">
+        <a-col :lg="8">
+          <a-form-item label="订单号" name="orderCode">
+            <a-input v-model:value="orderMainModel.orderCode" placeholder="请输入订单号" />
+          </a-form-item>
+        </a-col>
+        <a-col :lg="8">
+          <a-form-item label="订单类型">
+            <a-select placeholder="请选择订单类型" v-model:value="orderMainModel.ctype">
+              <a-select-option value="1">国内订单</a-select-option>
+              <a-select-option value="2">国际订单</a-select-option>
+            </a-select>
+          </a-form-item>
+        </a-col>
+        <a-col :lg="8">
+          <a-form-item label="订单日期">
+            <a-date-picker showTime valueFormat="YYYY-MM-DD HH:mm:ss" v-model:value="orderMainModel.orderDate" />
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <a-row class="form-row" :gutter="16">
+        <a-col :lg="8">
+          <a-form-item label="订单金额">
+            <a-input v-model:value="orderMainModel.orderMoney" placeholder="请输入订单金额" />
+          </a-form-item>
+        </a-col>
+        <a-col :lg="8">
+          <a-form-item label="订单备注">
+            <a-input v-model:value="orderMainModel.content" placeholder="请输入订单备注" />
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <a-tabs defaultActiveKey="1">
+        <a-tab-pane tab="客户信息" key="1">
+          <div>
+            <a-row type="flex" style="margin-bottom: 10px" :gutter="16">
+              <a-col :span="5">客户名</a-col>
+              <a-col :span="5">性别</a-col>
+              <a-col :span="6">身份证号码</a-col>
+              <a-col :span="6">手机号</a-col>
+              <a-col :span="2">操作</a-col>
             </a-row>
-            <a-row class="form-row" :gutter="16">
-                <a-col :lg="8">
-                    <a-form-item label="订单金额">
-                        <a-input v-model:value="orderMainModel.orderMoney" placeholder="请输入订单金额"/>
-                    </a-form-item>
-                </a-col>
-                <a-col :lg="8">
-                    <a-form-item label="订单备注">
-                        <a-input v-model:value="orderMainModel.content" placeholder="请输入订单备注"/>
-                    </a-form-item>
-                </a-col>
+            <a-row type="flex" style="margin-bottom: 10px" :gutter="16" v-for="(item, index) in orderMainModel.jeecgOrderCustomerList" :key="index">
+              <a-col :span="6" style="display: none">
+                <a-form-item>
+                  <a-input placeholder="id" v-model:value="item.id" />
+                </a-form-item>
+              </a-col>
+              <a-col :span="5">
+                <a-form-item>
+                  <a-input placeholder="客户名" v-model:value="item.name" />
+                </a-form-item>
+              </a-col>
+              <a-col :span="5">
+                <a-form-item>
+                  <a-select placeholder="性别" v-model:value="item.sex">
+                    <a-select-option value="1">男</a-select-option>
+                    <a-select-option value="2">女</a-select-option>
+                  </a-select>
+                </a-form-item>
+              </a-col>
+              <a-col :span="6">
+                <a-form-item :name="['jeecgOrderCustomerList', index, 'idcard']" :rules="[{ required: true, message: '请输入身份证号', trigger: 'blur' }]" :key="index">
+                  <a-input placeholder="身份证号" v-model:value="item.idcard" />
+                </a-form-item>
+              </a-col>
+              <a-col :span="6">
+                <a-form-item :name="['jeecgOrderCustomerList', index, 'telphone']">
+                  <a-input placeholder="手机号" v-model:value="item.telphone" />
+                </a-form-item>
+              </a-col>
+              <a-col :span="2">
+                <a-form-item>
+                  <Icon icon="ant-design:minus-outlined" @click="delRowCustom(index)" style="fontsize: 20px" />
+                </a-form-item>
+              </a-col>
             </a-row>
-            <a-tabs defaultActiveKey="1">
-                <a-tab-pane tab="客户信息" key="1">
-                    <div>
-                        <a-row type="flex" style="margin-bottom:10px" :gutter="16">
-                            <a-col :span="5">客户名</a-col>
-                            <a-col :span="5">性别</a-col>
-                            <a-col :span="6">身份证号码</a-col>
-                            <a-col :span="6">手机号</a-col>
-                            <a-col :span="2">操作</a-col>
-                        </a-row>
-                        <a-row type="flex" style="margin-bottom:10px" :gutter="16" v-for="(item, index) in orderMainModel.jeecgOrderCustomerList" :key="index">
-                            <a-col :span="6" style="display: none">
-                                <a-form-item>
-                                    <a-input placeholder="id" v-model:value="item.id"/>
-                                </a-form-item>
-                            </a-col>
-                            <a-col :span="5">
-                                <a-form-item>
-                                    <a-input placeholder="客户名" v-model:value="item.name"/>
-                                </a-form-item>
-                            </a-col>
-                            <a-col :span="5">
-                                <a-form-item>
-                                    <a-select placeholder="性别" v-model:value="item.sex">
-                                        <a-select-option value="1">男</a-select-option>
-                                        <a-select-option value="2">女</a-select-option>
-                                    </a-select>
-                                </a-form-item>
-                            </a-col>
-                            <a-col :span="6">
-                                <a-form-item :name="['jeecgOrderCustomerList', index, 'idcard']" :rules="[{required: true,message: '请输入身份证号',trigger: 'blur'}]" :key="index">
-                                    <a-input placeholder="身份证号" v-model:value="item.idcard"/>
-                                </a-form-item>
-                            </a-col>
-                            <a-col :span="6">
-                                <a-form-item :name="['jeecgOrderCustomerList', index, 'telphone']">
-                                    <a-input placeholder="手机号" v-model:value="item.telphone"/>
-                                </a-form-item>
-                            </a-col>
-                            <a-col :span="2">
-                                <a-form-item>
-                                    <Icon icon="ant-design:minus-outlined" @click="delRowCustom(index)" style="fontSize :20px"/>
-                                </a-form-item>
-                            </a-col>
-                        </a-row>
-                        <a-button type="dashed" style="width: 98%;margin-top: 10px" @click="addRowCustom">
-                            <Icon icon="ph:plus-bold"/>
-                            添加客户信息
-                        </a-button>
-                    </div>
-                </a-tab-pane>
+            <a-button type="dashed" style="width: 98%; margin-top: 10px" @click="addRowCustom">
+              <Icon icon="ph:plus-bold" />
+              添加客户信息
+            </a-button>
+          </div>
+        </a-tab-pane>
 
-                <a-tab-pane tab="机票信息" key="2" forceRender>
-                    <a-row type="flex" style="margin-bottom:10px" :gutter="16">
-                        <a-col :span="6">航班号</a-col>
-                        <a-col :span="6">航班时间</a-col>
-                        <a-col :span="6">操作</a-col>
-                    </a-row>
-                    <a-row type="flex" style="margin-bottom:10px" :gutter="16" v-for="(item, index) in orderMainModel.jeecgOrderTicketList" :key="index">
-                        <a-col :span="6" style="display: none">
-                            <a-form-item>
-                                <a-input placeholder="id" v-model:value="item.id"/>
-                            </a-form-item>
-                        </a-col>
-                        <a-col :span="6">
-                            <a-form-item :name="['jeecgOrderTicketList', index, 'ticketCode']" :rules="{required: true,message: '请输入航班号',trigger: 'blur'}">
-                                <a-input placeholder="航班号" v-model:value="item.ticketCode"/>
-                            </a-form-item>
-                        </a-col>
-                        <a-col :span="6">
-                            <a-form-item>
-                                <a-date-picker placeholder="航班时间" valueFormat="YYYY-MM-DD" v-model:value="item.tickectDate"/>
-                            </a-form-item>
-                        </a-col>
-                        <a-col :span="6">
-                            <a-form-item>
-                                <Icon icon="ant-design:minus-outlined" @click="delRowTicket(index)" style="fontSize :20px"/>
-                            </a-form-item>
-                        </a-col>
-                    </a-row>
-                    <a-button type="dashed" style="width: 98%;margin-top: 10px" @click="addRowTicket">
-                        <Icon icon="ph:plus-bold"/>
-                        添加机票信息
-                    </a-button>
-                </a-tab-pane>
-            </a-tabs>
-        </a-form>
-    </BasicModal>
+        <a-tab-pane tab="机票信息" key="2" forceRender>
+          <a-row type="flex" style="margin-bottom: 10px" :gutter="16">
+            <a-col :span="6">航班号</a-col>
+            <a-col :span="6">航班时间</a-col>
+            <a-col :span="6">操作</a-col>
+          </a-row>
+          <a-row type="flex" style="margin-bottom: 10px" :gutter="16" v-for="(item, index) in orderMainModel.jeecgOrderTicketList" :key="index">
+            <a-col :span="6" style="display: none">
+              <a-form-item>
+                <a-input placeholder="id" v-model:value="item.id" />
+              </a-form-item>
+            </a-col>
+            <a-col :span="6">
+              <a-form-item :name="['jeecgOrderTicketList', index, 'ticketCode']" :rules="{ required: true, message: '请输入航班号', trigger: 'blur' }">
+                <a-input placeholder="航班号" v-model:value="item.ticketCode" />
+              </a-form-item>
+            </a-col>
+            <a-col :span="6">
+              <a-form-item>
+                <a-date-picker placeholder="航班时间" valueFormat="YYYY-MM-DD" v-model:value="item.tickectDate" />
+              </a-form-item>
+            </a-col>
+            <a-col :span="6">
+              <a-form-item>
+                <Icon icon="ant-design:minus-outlined" @click="delRowTicket(index)" style="fontsize: 20px" />
+              </a-form-item>
+            </a-col>
+          </a-row>
+          <a-button type="dashed" style="width: 98%; margin-top: 10px" @click="addRowTicket">
+            <Icon icon="ph:plus-bold" />
+            添加机票信息
+          </a-button>
+        </a-tab-pane>
+      </a-tabs>
+    </a-form>
+  </BasicModal>
 </template>
 <script lang="ts">
-    import {defineComponent, ref, reactive, computed, unref} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {ValidateErrorEntity} from 'ant-design-vue/es/form/interface';
-    import { saveOrUpdate } from './jvxetable/jvxetable.api'
-    import { orderCustomerList,orderTicketList } from './api'
+  import { defineComponent, ref, reactive, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { ValidateErrorEntity } from 'ant-design-vue/es/form/interface';
+  import { saveOrUpdate } from './jvxetable/jvxetable.api';
+  import { orderCustomerList, orderTicketList } from './api';
 
-    export default defineComponent({
-        name: 'tableModal',
-        components: {BasicModal},
-        emits: ['success', 'register'],
-        setup(props, {emit}) {
-            const isUpdate = ref(true);
-            const rowId = ref('');
-            const formRef = ref();
-            const labelCol = reactive({
-                xs: {span: 24},
-                sm: {span: 5},
-            })
-            const wrapperCol = reactive({
-                xs: {span: 24},
-                sm: {span: 16},
-            })
-            const validatorRules = {
-                orderCode: [
-                    {required: true, message: '订单号不能为空', trigger: 'blur'}
-                ]
-            }
-            const orderMainModel = reactive({
-                id: null,
-                orderCode: "",
-                orderMoney: "",
-                ctype: "",
-                content: "",
-                jeecgOrderCustomerList: [],
-                jeecgOrderTicketList: []
-            });
-            const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-                setModalProps({confirmLoading: false});
-                isUpdate.value = !!data?.isUpdate;
-                reset()
-                if (unref(isUpdate)) {
-                    rowId.value = data.record.id;
-                    Object.assign(orderMainModel, data.record);
-                    let params = { id: orderMainModel.id };
-                    const customerList = await orderCustomerList(params);
-                    orderMainModel.jeecgOrderCustomerList = customerList;
-                    const ticketList = await orderTicketList(params);
-                    orderMainModel.jeecgOrderTicketList = ticketList
-                }
-            });
-            const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
+  export default defineComponent({
+    name: 'tableModal',
+    components: { BasicModal },
+    emits: ['success', 'register'],
+    setup(props, { emit }) {
+      const isUpdate = ref(true);
+      const rowId = ref('');
+      const formRef = ref();
+      const labelCol = reactive({
+        xs: { span: 24 },
+        sm: { span: 5 },
+      });
+      const wrapperCol = reactive({
+        xs: { span: 24 },
+        sm: { span: 16 },
+      });
+      const validatorRules = {
+        orderCode: [{ required: true, message: '订单号不能为空', trigger: 'blur' }],
+      };
+      const orderMainModel = reactive({
+        id: null,
+        orderCode: '',
+        orderMoney: '',
+        ctype: '',
+        content: '',
+        jeecgOrderCustomerList: [],
+        jeecgOrderTicketList: [],
+      });
+      const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+        setModalProps({ confirmLoading: false });
+        isUpdate.value = !!data?.isUpdate;
+        reset();
+        if (unref(isUpdate)) {
+          rowId.value = data.record.id;
+          Object.assign(orderMainModel, data.record);
+          let params = { id: orderMainModel.id };
+          const customerList = await orderCustomerList(params);
+          orderMainModel.jeecgOrderCustomerList = customerList;
+          const ticketList = await orderTicketList(params);
+          orderMainModel.jeecgOrderTicketList = ticketList;
+        }
+      });
+      const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
 
-            //动态添加行
-            function addRowCustom() {
-                orderMainModel.jeecgOrderCustomerList.push({});
-            }
+      //动态添加行
+      function addRowCustom() {
+        orderMainModel.jeecgOrderCustomerList.push({});
+      }
 
-            //删除行
-            function delRowCustom(index) {
-                orderMainModel['jeecgOrderCustomerList'].splice(index, 1);
-                orderMainModel.jeecgOrderCustomerList.splice(index, 1);
-            }
-            function reset(){
-                orderMainModel.id = null;
-                orderMainModel.orderCode = "";
-                orderMainModel.orderMoney = "";
-                orderMainModel.orderDate = null;
-                orderMainModel.ctype = "";
-                orderMainModel.content = "";
-                orderMainModel.jeecgOrderCustomerList = [];
-                orderMainModel.jeecgOrderTicketList = []
-            }
-            function addRowTicket() {
-                orderMainModel.jeecgOrderTicketList.push({});
-            }
+      //删除行
+      function delRowCustom(index) {
+        orderMainModel['jeecgOrderCustomerList'].splice(index, 1);
+        orderMainModel.jeecgOrderCustomerList.splice(index, 1);
+      }
+      function reset() {
+        orderMainModel.id = null;
+        orderMainModel.orderCode = '';
+        orderMainModel.orderMoney = '';
+        orderMainModel.orderDate = null;
+        orderMainModel.ctype = '';
+        orderMainModel.content = '';
+        orderMainModel.jeecgOrderCustomerList = [];
+        orderMainModel.jeecgOrderTicketList = [];
+      }
+      function addRowTicket() {
+        orderMainModel.jeecgOrderTicketList.push({});
+      }
 
-            //删除机票
-            function delRowTicket(index) {
-                orderMainModel['jeecgOrderTicketList'].splice(index, 1);
-                orderMainModel.jeecgOrderTicketList.splice(index, 1);
+      //删除机票
+      function delRowTicket(index) {
+        orderMainModel['jeecgOrderTicketList'].splice(index, 1);
+        orderMainModel.jeecgOrderTicketList.splice(index, 1);
+      }
+
+      async function handleSubmit() {
+        formRef.value
+          .validate()
+          .then(async () => {
+            try {
+              console.log('formData', JSON.stringify(orderMainModel));
+              setModalProps({ confirmLoading: true });
+              await saveOrUpdate(orderMainModel, unref(isUpdate));
+              closeModal();
+              emit('success');
+            } finally {
+              setModalProps({ confirmLoading: false });
             }
+          })
+          .catch((error: ValidateErrorEntity<any>) => {
+            console.log('error', error);
+          });
+      }
 
-            async function handleSubmit() {
-                formRef.value.validate().then(async() => {
-                    try {
-                        console.log('formData', JSON.stringify(orderMainModel));
-                        setModalProps({confirmLoading: true});
-                        await saveOrUpdate(orderMainModel,unref(isUpdate));
-                        closeModal();
-                        emit('success');
-                    } finally {
-                        setModalProps({confirmLoading: false});
-                    }
-                })
-                    .catch((error: ValidateErrorEntity<any>) => {
-                        console.log('error', error);
-                    });
-
-            }
-
-            return {formRef, validatorRules, orderMainModel, registerModal, getTitle, labelCol, wrapperCol, addRowCustom, delRowCustom, addRowTicket, delRowTicket, handleSubmit};
-        },
-    });
+      return { formRef, validatorRules, orderMainModel, registerModal, getTitle, labelCol, wrapperCol, addRowCustom, delRowCustom, addRowTicket, delRowTicket, handleSubmit };
+    },
+  });
 </script>
 <style scoped>
-    .ant-btn {
-        padding: 0 10px;
-        margin-left: 3px;
-    }
+  .ant-btn {
+    padding: 0 10px;
+    margin-left: 3px;
+  }
 
-    .ant-form-item-control {
-        line-height: 0px;
-    }
+  .ant-form-item-control {
+    line-height: 0px;
+  }
 
-    /** 主表单行间距 */
-    .ant-form .ant-form-item {
-        margin-bottom: 10px;
-    }
+  /** 主表单行间距 */
+  .ant-form .ant-form-item {
+    margin-bottom: 10px;
+  }
 
-    /** Tab页面行间距 */
-    .ant-tabs-content .ant-form-item {
-        margin-bottom: 0px;
-    }
+  /** Tab页面行间距 */
+  .ant-tabs-content .ant-form-item {
+    margin-bottom: 0px;
+  }
 </style>
diff --git a/src/views/monitor/datalog/DataLogCompareModal.vue b/src/views/monitor/datalog/DataLogCompareModal.vue
index d1989bc..2959398 100644
--- a/src/views/monitor/datalog/DataLogCompareModal.vue
+++ b/src/views/monitor/datalog/DataLogCompareModal.vue
@@ -1,36 +1,44 @@
 <!--用户选择框-->
 <template>
-    <div>
-        <BasicModal v-bind="$attrs" @register="register" title="数据对比" width="50%" destroyOnClose :showOkBtn="false">
-          <a-row  :gutter="6" v-if="dataVersionList" style="margin-left:2px">
-              <span style="margin-top: 5px;margin-right: 3px;margin-left: 4px">版本对比:</span>
-              <a-select placeholder="版本号" @change="handleChange1" v-model:value="params.dataId1">
-                <a-select-option v-for="(log,logindex) in dataVersionList" :key="log.value" :value="log.value">
-                  {{ log.text }}
-                </a-select-option>
-              </a-select>
+  <div>
+    <BasicModal v-bind="$attrs" @register="register" title="数据对比" width="50%" destroyOnClose :showOkBtn="false">
+      <a-row :gutter="6" v-if="dataVersionList" style="margin-left: 2px">
+        <span style="margin-top: 5px; margin-right: 3px; margin-left: 4px">版本对比:</span>
+        <a-select placeholder="版本号" @change="handleChange1" v-model:value="params.dataId1">
+          <a-select-option v-for="(log, logindex) in dataVersionList" :key="log.value" :value="log.value">
+            {{ log.text }}
+          </a-select-option>
+        </a-select>
 
-              <a-select placeholder="版本号" @change="handleChange2" style="padding-left:10px" v-model:value="params.dataId2">
-                <a-select-option v-for="(log,logindex) in dataVersionList" :key="log.value" :value="log.value">
-                  {{ log.text }}
-                </a-select-option>
-              </a-select>
-          </a-row>
-            <BasicTable :columns="columns" v-bind="getBindValue" :rowClassName="setDataCss" :striped="false" :showIndexColumn="false" :pagination="false"  :canResize="false" :bordered="true" :dataSource="dataSource" :searchInfo="searchInfo" v-if="isUpdate">
-                <template #dataVersionTitle1="{ record }">
-                    <Icon icon="icon-park-outline:grinning-face" /> 版本:{{dataVersion1Num}}
-                </template>
-                <template #dataVersionTitle2="{ record }">
-                    <Icon icon="icon-park-outline:grinning-face" /> 版本:{{dataVersion2Num}}
-                </template>
-                <template #avatarslot="{ record }">
-                    <div class="anty-img-wrap" v-if="record.dataVersion1 != record.dataVersion2">
-                        <Icon icon="mdi:arrow-right-bold" style="color: red"></Icon>
-                    </div>
-                </template>
-            </BasicTable>
-        </BasicModal>
-    </div>
+        <a-select placeholder="版本号" @change="handleChange2" style="padding-left: 10px" v-model:value="params.dataId2">
+          <a-select-option v-for="(log, logindex) in dataVersionList" :key="log.value" :value="log.value">
+            {{ log.text }}
+          </a-select-option>
+        </a-select>
+      </a-row>
+      <BasicTable
+        :columns="columns"
+        v-bind="getBindValue"
+        :rowClassName="setDataCss"
+        :striped="false"
+        :showIndexColumn="false"
+        :pagination="false"
+        :canResize="false"
+        :bordered="true"
+        :dataSource="dataSource"
+        :searchInfo="searchInfo"
+        v-if="isUpdate"
+      >
+        <template #dataVersionTitle1="{ record }"> <Icon icon="icon-park-outline:grinning-face" /> 版本:{{ dataVersion1Num }} </template>
+        <template #dataVersionTitle2="{ record }"> <Icon icon="icon-park-outline:grinning-face" /> 版本:{{ dataVersion2Num }} </template>
+        <template #avatarslot="{ record }">
+          <div class="anty-img-wrap" v-if="record.dataVersion1 != record.dataVersion2">
+            <Icon icon="mdi:arrow-right-bold" style="color: red"></Icon>
+          </div>
+        </template>
+      </BasicTable>
+    </BasicModal>
+  </div>
 </template>
 <script lang="ts">
   import { defineComponent, unref, ref, reactive, watch } from 'vue';
@@ -45,14 +53,15 @@
     name: 'UserSelectModal',
     components: {
       //此处需要异步加载BasicTable
-      BasicModal, BasicTable: createAsyncComponent(() => import('/@/components/Table/src/BasicTable.vue'), { loading: true }),
+      BasicModal,
+      BasicTable: createAsyncComponent(() => import('/@/components/Table/src/BasicTable.vue'), { loading: true }),
     },
     props: {
       ...selectProps,
     },
     emits: ['register', 'btnOk'],
     setup(props, { emit, refs }) {
-      const {createMessage} = useMessage();
+      const { createMessage } = useMessage();
       const attrs = useAttrs();
       const getBindValue = Object.assign({}, unref(props), unref(attrs));
       const dataSource = ref([]);
@@ -66,9 +75,9 @@
       const dataTable1 = ref('');
       const dataID3 = ref('');
       const dataTable = ref('');
-      const confirmLoading = ref(false);;
+      const confirmLoading = ref(false);
       const dataVersionList = ref([]);
-      let params = reactive({dataId1:"",dataId2:""});
+      let params = reactive({ dataId1: '', dataId2: '' });
       let dataLog = reactive({});
       const [register, { setModalProps, closeModal }] = useModalInner(async (data) => {
         isUpdate.value = !!data?.isUpdate;
@@ -78,8 +87,8 @@
           dataId.value = checkedRows[0].dataId;
           dataId1.value = checkedRows[0].id;
           dataId2.value = checkedRows[1].id;
-          params.dataId1=dataId1.value;
-          params.dataId2=dataId2.value;
+          params.dataId1 = dataId1.value;
+          params.dataId2 = dataId2.value;
           await initDataVersionList();
           await initTableData();
         }
@@ -97,33 +106,33 @@
           dataIndex: 'dataVersion1',
           align: 'left',
           width: 60,
-          slots: { title: 'dataVersionTitle1' }
+          slots: { title: 'dataVersionTitle1' },
         },
         {
           title: '',
           dataIndex: 'imgshow',
           align: 'center',
           slots: { customRender: 'avatarslot' },
-          width: 5
+          width: 5,
         },
         {
           align: 'left',
           dataIndex: 'dataVersion2',
           width: 60,
-          filters:[],
-          filterMultiple:false,
-          slots: { title: 'dataVersionTitle2' }
-        }
+          filters: [],
+          filterMultiple: false,
+          slots: { title: 'dataVersionTitle2' },
+        },
       ];
       async function initTableData() {
-        console.info("params",params)
+        console.info('params', params);
         queryCompareList(unref(params)).then((res) => {
-          console.info("test",res)
+          console.info('test', res);
           dataVersion1Num.value = res[0].dataVersion;
           dataVersion2Num.value = res[1].dataVersion;
           let json1 = JSON.parse(res[0].dataContent);
           let json2 = JSON.parse(res[1].dataContent);
-          let data=[];
+          let data = [];
           for (var item1 in json1) {
             for (var item2 in json2) {
               if (item1 == item2) {
@@ -136,23 +145,23 @@
               }
             }
           }
-          dataSource.value=data;
+          dataSource.value = data;
         });
       }
-      function handleChange1(value){
-        if(params.dataId2==value){
-          createMessage.warning("相同版本号不能比较")
+      function handleChange1(value) {
+        if (params.dataId2 == value) {
+          createMessage.warning('相同版本号不能比较');
           return;
         }
-        params.dataId1=value;
+        params.dataId1 = value;
         initTableData();
       }
-      function handleChange2(value){
-        if(params.dataId1==value){
-          createMessage.warning("相同版本号不能比较")
+      function handleChange2(value) {
+        if (params.dataId1 == value) {
+          createMessage.warning('相同版本号不能比较');
           return;
         }
-        params.dataId2=value;
+        params.dataId2 = value;
         initTableData();
       }
       function setDataCss(record) {
@@ -164,13 +173,13 @@
         }
       }
       async function initDataVersionList() {
-         queryDataVerList({ dataTable: dataTable.value, dataId: dataId.value }).then((res) => {
-          dataVersionList.value = res.map((value,key,arr) => {
-            let item={};
-            item['text']=value['dataVersion'];
-            item['value']=value['id'];
+        queryDataVerList({ dataTable: dataTable.value, dataId: dataId.value }).then((res) => {
+          dataVersionList.value = res.map((value, key, arr) => {
+            let item = {};
+            item['text'] = value['dataVersion'];
+            item['value'] = value['id'];
             return item;
-          })
+          });
         });
       }
 
@@ -196,16 +205,16 @@
   });
 </script>
 <style scoped>
-    .anty-img-wrap {
-        height: 25px;
-        position: relative;
-    }
+  .anty-img-wrap {
+    height: 25px;
+    position: relative;
+  }
 
-    .anty-img-wrap > img {
-        max-height: 100%;
-    }
+  .anty-img-wrap > img {
+    max-height: 100%;
+  }
 
-    .marginCss {
-        margin-top: 20px;
-    }
+  .marginCss {
+    margin-top: 20px;
+  }
 </style>
diff --git a/src/views/monitor/datalog/DataLogModal.vue b/src/views/monitor/datalog/DataLogModal.vue
index 5ec1534..743e8e6 100644
--- a/src/views/monitor/datalog/DataLogModal.vue
+++ b/src/views/monitor/datalog/DataLogModal.vue
@@ -1,53 +1,53 @@
 <template>
-    <div>
-        <BasicModal v-bind="$attrs" @register="registerModal" title="数据对比窗口" :minHeight="300" width="800px" @ok="handleSubmit">
-            <a-spin :spinning="confirmLoading">
-                <a-form @submit="handleSubmit" :form="form" class="form">
-                    <a-row class="form-row" :gutter="24">
-                        <a-col :md="12" :sm="8">
-                            <a-form-item label="数据库表名" :label-col="{ span: 6 }" :wrapper-col="{ span: 15 }" name="dataTable">
-                                <a-input placeholder="请输入数据库表名" v-model:value="dataTable" disabled/>
-                            </a-form-item>
-                        </a-col>
+  <div>
+    <BasicModal v-bind="$attrs" @register="registerModal" title="数据对比窗口" :minHeight="300" width="800px" @ok="handleSubmit">
+      <a-spin :spinning="confirmLoading">
+        <a-form @submit="handleSubmit" :form="form" class="form">
+          <a-row class="form-row" :gutter="24">
+            <a-col :md="12" :sm="8">
+              <a-form-item label="数据库表名" :label-col="{ span: 6 }" :wrapper-col="{ span: 15 }" name="dataTable">
+                <a-input placeholder="请输入数据库表名" v-model:value="dataTable" disabled />
+              </a-form-item>
+            </a-col>
 
-                        <a-col :md="12" :sm="8">
-                            <a-form-item label="数据ID" :label-col="{ span: 5 }" :wrapper-col="{ span: 15 }">
-                                <a-input placeholder="请输入数据ID" v-model:value="dataId" disabled/>
-                            </a-form-item>
-                        </a-col>
-                    </a-row>
+            <a-col :md="12" :sm="8">
+              <a-form-item label="数据ID" :label-col="{ span: 5 }" :wrapper-col="{ span: 15 }">
+                <a-input placeholder="请输入数据ID" v-model:value="dataId" disabled />
+              </a-form-item>
+            </a-col>
+          </a-row>
 
-                    <a-row class="form-row" :gutter="24">
-                        <a-col :md="12" :sm="8">
-                            <a-form-item label="版本号1" :label-col="{ span: 6 }" :wrapper-col="{ span: 15 }">
-                                <a-select placeholder="请选择版本号" @change="handleChange1" v-model:value="dataVersion1">
-                                    <a-select-option v-for="(log,logindex) in dataVersionList" :key="logindex.toString()" :value="log.id">
-                                        {{ log.dataVersion }}
-                                    </a-select-option>
-                                </a-select>
-                            </a-form-item>
-                        </a-col>
-                        <a-col :md="12" :sm="8">
-                            <a-form-item label="版本号2" :label-col="{ span: 5 }" :wrapper-col="{ span: 15 }">
-                                <a-select placeholder="请选择版本号" @change="handleChange2" v-model:value="dataVersion2">
-                                    <a-select-option v-for="(log,logindex) in dataVersionList" :key="logindex.toString()" :value="log.id">
-                                        {{ log.dataVersion }}
-                                    </a-select-option>
-                                </a-select>
-                            </a-form-item>
-                        </a-col>
-                    </a-row>
-                </a-form>
-            </a-spin>
-        </BasicModal>
-        <DataLogCompareModal @register="registerDataLogCompareModal" ></DataLogCompareModal>
-    </div>
+          <a-row class="form-row" :gutter="24">
+            <a-col :md="12" :sm="8">
+              <a-form-item label="版本号1" :label-col="{ span: 6 }" :wrapper-col="{ span: 15 }">
+                <a-select placeholder="请选择版本号" @change="handleChange1" v-model:value="dataVersion1">
+                  <a-select-option v-for="(log, logindex) in dataVersionList" :key="logindex.toString()" :value="log.id">
+                    {{ log.dataVersion }}
+                  </a-select-option>
+                </a-select>
+              </a-form-item>
+            </a-col>
+            <a-col :md="12" :sm="8">
+              <a-form-item label="版本号2" :label-col="{ span: 5 }" :wrapper-col="{ span: 15 }">
+                <a-select placeholder="请选择版本号" @change="handleChange2" v-model:value="dataVersion2">
+                  <a-select-option v-for="(log, logindex) in dataVersionList" :key="logindex.toString()" :value="log.id">
+                    {{ log.dataVersion }}
+                  </a-select-option>
+                </a-select>
+              </a-form-item>
+            </a-col>
+          </a-row>
+        </a-form>
+      </a-spin>
+    </BasicModal>
+    <DataLogCompareModal @register="registerDataLogCompareModal"></DataLogCompareModal>
+  </div>
 </template>
 <script lang="ts" setup>
   import { BasicModal, useModal, useModalInner } from '/@/components/Modal';
   import { queryDataVerList } from './datalog.api';
   import { reactive, ref, unref } from 'vue';
-  import  DataLogCompareModal from './DataLogCompareModal.vue';
+  import DataLogCompareModal from './DataLogCompareModal.vue';
   const dataId1 = ref('');
   const dataId2 = ref('');
   const dataId = ref('');
@@ -82,7 +82,7 @@
   }
 
   function handleSubmit() {
-    let result={dataId1:dataId1.value,dataId2:dataId2.value}
+    let result = { dataId1: dataId1.value, dataId2: dataId2.value };
     openModal(true, {
       result,
       isUpdate: true,
@@ -92,20 +92,20 @@
 
   function initDataVersionList() {
     queryDataVerList({ dataTable: dataTable.value, dataId: dataId.value }).then((res) => {
-      dataVersionList.value = res.map((value,key,arr) => {
-         arr['label']=value;
+      dataVersionList.value = res.map((value, key, arr) => {
+        arr['label'] = value;
         return arr;
-      })
-      console.info(dataVersionList.value)
+      });
+      console.info(dataVersionList.value);
     });
   }
 </script>
 
 <style scoped lang="less">
-    .detail-iframe {
-        border: 0;
-        width: 100%;
-        height: 100%;
-        min-height: 600px;
-    }
+  .detail-iframe {
+    border: 0;
+    width: 100%;
+    height: 100%;
+    min-height: 600px;
+  }
 </style>
diff --git a/src/views/monitor/datalog/datalog.api.ts b/src/views/monitor/datalog/datalog.api.ts
index 3f719d9..a50f12b 100644
--- a/src/views/monitor/datalog/datalog.api.ts
+++ b/src/views/monitor/datalog/datalog.api.ts
@@ -1,9 +1,9 @@
-import {defHttp} from '/@/utils/http/axios';
+import { defHttp } from '/@/utils/http/axios';
 
 enum Api {
-    list = "/sys/dataLog/list",
-    queryDataVerList = "/sys/dataLog/queryDataVerList",
-    queryCompareList = "/sys/dataLog/queryCompareList"
+  list = '/sys/dataLog/list',
+  queryDataVerList = '/sys/dataLog/queryDataVerList',
+  queryCompareList = '/sys/dataLog/queryCompareList',
 }
 
 /**
@@ -11,22 +11,21 @@ enum Api {
  * @param params
  */
 export const getDataLogList = (params) => {
-    return defHttp.get({url: Api.list, params});
-}
+  return defHttp.get({ url: Api.list, params });
+};
 
 /**
  * 查询数据日志列表
  * @param params
  */
 export const queryDataVerList = (params) => {
-    return defHttp.get({url: Api.queryDataVerList, params});
-}
+  return defHttp.get({ url: Api.queryDataVerList, params });
+};
 
 /**
  * 查询对比数据
  * @param params
  */
 export const queryCompareList = (params) => {
-    return defHttp.get({url: Api.queryCompareList, params});
-}
-
+  return defHttp.get({ url: Api.queryCompareList, params });
+};
diff --git a/src/views/monitor/datalog/datalog.data.ts b/src/views/monitor/datalog/datalog.data.ts
index 4bd3bf6..07de096 100644
--- a/src/views/monitor/datalog/datalog.data.ts
+++ b/src/views/monitor/datalog/datalog.data.ts
@@ -1,32 +1,32 @@
 import { BasicColumn, FormSchema } from '/@/components/Table';
 
 export const columns: BasicColumn[] = [
-    {
-        title: '表名',
-        dataIndex: 'dataTable',
-        width: 150,
-        align: 'left',
-    },
-    {
-        title: '数据ID',
-        dataIndex: 'dataId',
-        width: 350,
-    },
-    {
-        title: '版本号',
-        dataIndex: 'dataVersion',
-        width: 100,
-    },
-    {
-        title: '数据内容',
-        dataIndex: 'dataContent',
-    },
-    {
-        title: '创建人',
-        dataIndex: 'createBy',
-        sorter: true,
-        width: 200,
-    }
+  {
+    title: '表名',
+    dataIndex: 'dataTable',
+    width: 150,
+    align: 'left',
+  },
+  {
+    title: '数据ID',
+    dataIndex: 'dataId',
+    width: 350,
+  },
+  {
+    title: '版本号',
+    dataIndex: 'dataVersion',
+    width: 100,
+  },
+  {
+    title: '数据内容',
+    dataIndex: 'dataContent',
+  },
+  {
+    title: '创建人',
+    dataIndex: 'createBy',
+    sorter: true,
+    width: 200,
+  },
 ];
 
 export const searchFormSchema: FormSchema[] = [
diff --git a/src/views/monitor/datalog/index.vue b/src/views/monitor/datalog/index.vue
index 6ce182b..77bd99f 100644
--- a/src/views/monitor/datalog/index.vue
+++ b/src/views/monitor/datalog/index.vue
@@ -5,7 +5,7 @@
         <a-button preIcon="ant-design:plus-outlined" type="primary" @click="handleCompare" style="margin-right: 5px">数据比较</a-button>
       </template>
     </BasicTable>
-    <DataLogCompareModal @register="registerModal" @success="reload"/>
+    <DataLogCompareModal @register="registerModal" @success="reload" />
   </div>
 </template>
 <script lang="ts" name="monitor-datalog" setup>
@@ -17,7 +17,7 @@
   import { columns, searchFormSchema } from './datalog.data';
   import { useMessage } from '/@/hooks/web/useMessage';
   import { useModal } from '/@/components/Modal';
-  import { useListPage } from '/@/hooks/system/useListPage'
+  import { useListPage } from '/@/hooks/system/useListPage';
   const { createMessage } = useMessage();
   const checkedRows = ref<Array<object | number>>([]);
 
@@ -32,16 +32,15 @@
         labelWidth: 120,
         schemas: searchFormSchema,
       },
-      actionColumn:false
-    }
-  })
-
-  const [registerTable, { reload },{ rowSelection, selectedRowKeys,selectedRows}] = tableContext;
+      actionColumn: false,
+    },
+  });
 
+  const [registerTable, { reload }, { rowSelection, selectedRowKeys, selectedRows }] = tableContext;
 
   function handleCompare() {
     let obj = selectedRows.value;
-    console.info("sfsfsf",obj)
+    console.info('sfsfsf', obj);
     if (!obj || obj.length != 2) {
       createMessage.warning('请选择两条数据!');
       return false;
@@ -55,5 +54,4 @@
       isUpdate: true,
     });
   }
-
 </script>
diff --git a/src/views/monitor/datasource/DataSourceModal.vue b/src/views/monitor/datasource/DataSourceModal.vue
index c1f2834..2839c77 100644
--- a/src/views/monitor/datasource/DataSourceModal.vue
+++ b/src/views/monitor/datasource/DataSourceModal.vue
@@ -1,18 +1,18 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit" width="40%">
-        <BasicForm @register="registerForm">
-            <template #pwd="{ model, field }">
-                <a-row :gutter="8">
-                    <a-col :sm="15" :md="16" :lg="17" :xl="19">
-                        <a-input-password v-model:value="model[field]" placeholder="请输入密码"/>
-                    </a-col>
-                    <a-col :sm="9" :md="7" :lg="7" :xl="5">
-                        <a-button type="primary" style="width: 100%" @click="handleTest">测试</a-button>
-                    </a-col>
-                </a-row>
-            </template>
-        </BasicForm>
-    </BasicModal>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit" width="40%">
+    <BasicForm @register="registerForm">
+      <template #pwd="{ model, field }">
+        <a-row :gutter="8">
+          <a-col :sm="15" :md="16" :lg="17" :xl="19">
+            <a-input-password v-model:value="model[field]" placeholder="请输入密码" />
+          </a-col>
+          <a-col :sm="9" :md="7" :lg="7" :xl="5">
+            <a-button type="primary" style="width: 100%" @click="handleTest">测试</a-button>
+          </a-col>
+        </a-row>
+      </template>
+    </BasicForm>
+  </BasicModal>
 </template>
 <script lang="ts" setup>
   import { ref, computed, unref } from 'vue';
@@ -55,18 +55,18 @@
     // 获取以上字段的值，并清除校验状态
     let fieldsValues = getFieldsValue(keys);
     let setFields = {};
-    keys.forEach(key => setFields[key] = { value: fieldsValues[key], errors: null });
+    keys.forEach((key) => (setFields[key] = { value: fieldsValues[key], errors: null }));
     await validateFields(keys).then((values) => {
       let loading = createMessage.loading('连接中....', 0);
-      testConnection(values).then((data) => {
-        if (data.success) {
-          createMessage.success('连接成功');
-        }
-      }).catch(error => {
-      }).finally(() => loading());
+      testConnection(values)
+        .then((data) => {
+          if (data.success) {
+            createMessage.success('连接成功');
+          }
+        })
+        .catch((error) => {})
+        .finally(() => loading());
     });
-
-
   }
 
   //表单提交事件
diff --git a/src/views/monitor/datasource/datasource.api.ts b/src/views/monitor/datasource/datasource.api.ts
index 75d06a2..3aa0580 100644
--- a/src/views/monitor/datasource/datasource.api.ts
+++ b/src/views/monitor/datasource/datasource.api.ts
@@ -1,16 +1,16 @@
-import {defHttp} from '/@/utils/http/axios';
-import {Modal} from 'ant-design-vue';
+import { defHttp } from '/@/utils/http/axios';
+import { Modal } from 'ant-design-vue';
 
 enum Api {
-    list = "/sys/dataSource/list",
-    save = "/sys/dataSource/add",
-    edit = "/sys/dataSource/edit",
-    get = "/sys/dataSource/queryById",
-    delete = "/sys/dataSource/delete",
-    testConnection = "/online/cgreport/api/testConnection",
-    deleteBatch = "/sys/dataSource/deleteBatch",
-    exportXlsUrl = 'sys/dataSource/exportXls',
-    importExcelUrl = 'sys/dataSource/importExcel',
+  list = '/sys/dataSource/list',
+  save = '/sys/dataSource/add',
+  edit = '/sys/dataSource/edit',
+  get = '/sys/dataSource/queryById',
+  delete = '/sys/dataSource/delete',
+  testConnection = '/online/cgreport/api/testConnection',
+  deleteBatch = '/sys/dataSource/deleteBatch',
+  exportXlsUrl = 'sys/dataSource/exportXls',
+  importExcelUrl = 'sys/dataSource/importExcel',
 }
 /**
  * 导出api
@@ -26,60 +26,58 @@ export const getImportUrl = Api.importExcelUrl;
  * @param params
  */
 export const getDataSourceList = (params) => {
-    return defHttp.get({url: Api.list, params});
-}
+  return defHttp.get({ url: Api.list, params });
+};
 
 /**
  * 保存或者更新数据源
  * @param params
  */
 export const saveOrUpdateDataSource = (params, isUpdate) => {
-    let url = isUpdate ? Api.edit : Api.save;
-    return defHttp.post({url: url, params});
-}
+  let url = isUpdate ? Api.edit : Api.save;
+  return defHttp.post({ url: url, params });
+};
 
 /**
  * 查询数据源详情
  * @param params
  */
 export const getDataSourceById = (params) => {
-    return defHttp.get({url: Api.get, params});
-}
+  return defHttp.get({ url: Api.get, params });
+};
 
 /**
  * 删除数据源
  * @param params
  */
-export const deleteDataSource = (params,handleSuccess) => {
-    return defHttp.delete({url: Api.delete, data: params}, {joinParamsToUrl: true}).then(()=>{
-        handleSuccess();
-    });
-}
+export const deleteDataSource = (params, handleSuccess) => {
+  return defHttp.delete({ url: Api.delete, data: params }, { joinParamsToUrl: true }).then(() => {
+    handleSuccess();
+  });
+};
 
 /**
  * 测试连接
  * @param params
  */
 export const testConnection = (params) => {
-    return defHttp.post({url: Api.testConnection, params});
-}
-
+  return defHttp.post({ url: Api.testConnection, params });
+};
 
 /**
  * 批量删除数据源
  * @param params
  */
 export const batchDeleteDataSource = (params, handleSuccess) => {
-    Modal.confirm({
-        title: '确认删除',
-        content: '是否删除选中数据',
-        okText: '确认',
-        cancelText: '取消',
-        onOk: () => {
-            return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
-                handleSuccess();
-            });
-        }
-    });
-}
-
+  Modal.confirm({
+    title: '确认删除',
+    content: '是否删除选中数据',
+    okText: '确认',
+    cancelText: '取消',
+    onOk: () => {
+      return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => {
+        handleSuccess();
+      });
+    },
+  });
+};
diff --git a/src/views/monitor/datasource/datasource.data.ts b/src/views/monitor/datasource/datasource.data.ts
index 9dca05f..7069613 100644
--- a/src/views/monitor/datasource/datasource.data.ts
+++ b/src/views/monitor/datasource/datasource.data.ts
@@ -125,7 +125,7 @@ export const formSchema: FormSchema[] = [
     label: '数据源编码',
     component: 'Input',
     required: true,
-    dynamicDisabled: ({values}) => {
+    dynamicDisabled: ({ values }) => {
       return !!values.id;
     },
   },
@@ -144,7 +144,7 @@ export const formSchema: FormSchema[] = [
       return {
         dictCode: 'database_type',
         onChange: (e: any) => {
-          formModel=Object.assign(formModel,dbDriverMap[e], dbUrlMap[e]);
+          formModel = Object.assign(formModel, dbDriverMap[e], dbUrlMap[e]);
         },
       };
     },
@@ -172,7 +172,7 @@ export const formSchema: FormSchema[] = [
     label: '密码',
     required: true,
     component: 'InputPassword',
-    slot:'pwd'
+    slot: 'pwd',
   },
   {
     field: 'remark',
diff --git a/src/views/monitor/datasource/index.vue b/src/views/monitor/datasource/index.vue
index ab0ac06..f12f5af 100644
--- a/src/views/monitor/datasource/index.vue
+++ b/src/views/monitor/datasource/index.vue
@@ -1,117 +1,118 @@
 <template>
-    <div>
-        <BasicTable @register="registerTable" :rowSelection="rowSelection">
-            <template #tableTitle>
-                <a-button type="primary" preIcon="ant-design:plus-outlined"  @click="handleAdd" style="margin-right: 5px">新增</a-button>
-                <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
-                <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
-                <a-dropdown v-if="selectedRowKeys.length > 0" >
-                    <template #overlay>
-                        <a-menu>
-                            <a-menu-item key="1" @click="batchHandleDelete">
-                                <Icon icon="ant-design:delete-outlined"></Icon>
-                                删除
-                            </a-menu-item>
-                        </a-menu>
-                    </template>
-                    <a-button>批量操作
-                        <Icon  icon="mdi:chevron-down"></Icon>
-                    </a-button>
-                </a-dropdown>
-            </template>
-            <template #action="{ record }">
-                <TableAction :actions="getActions(record)"/>
-            </template>
-        </BasicTable>
-        <DataSourceModal @register="registerModal" @success="reload"/>
-    </div>
+  <div>
+    <BasicTable @register="registerTable" :rowSelection="rowSelection">
+      <template #tableTitle>
+        <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleAdd" style="margin-right: 5px">新增</a-button>
+        <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
+        <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
+        <a-dropdown v-if="selectedRowKeys.length > 0">
+          <template #overlay>
+            <a-menu>
+              <a-menu-item key="1" @click="batchHandleDelete">
+                <Icon icon="ant-design:delete-outlined"></Icon>
+                删除
+              </a-menu-item>
+            </a-menu>
+          </template>
+          <a-button
+            >批量操作
+            <Icon icon="mdi:chevron-down"></Icon>
+          </a-button>
+        </a-dropdown>
+      </template>
+      <template #action="{ record }">
+        <TableAction :actions="getActions(record)" />
+      </template>
+    </BasicTable>
+    <DataSourceModal @register="registerModal" @success="reload" />
+  </div>
 </template>
 <script lang="ts" name="monitor-datasource" setup>
-    import {ref} from 'vue';
-    import {BasicTable, TableAction} from '/@/components/Table';
-    import {useModal} from '/@/components/Modal';
-    import {getDataSourceList, deleteDataSource, batchDeleteDataSource,getExportUrl, getImportUrl} from './datasource.api';
-    import {columns, searchFormSchema} from './datasource.data';
-    import DataSourceModal from './DataSourceModal.vue';
-    import {useMessage} from "/@/hooks/web/useMessage";
-    import { useListPage } from '/@/hooks/system/useListPage'
-    const {createMessage} = useMessage();
-    const [registerModal, {openModal}] = useModal();
+  import { ref } from 'vue';
+  import { BasicTable, TableAction } from '/@/components/Table';
+  import { useModal } from '/@/components/Modal';
+  import { getDataSourceList, deleteDataSource, batchDeleteDataSource, getExportUrl, getImportUrl } from './datasource.api';
+  import { columns, searchFormSchema } from './datasource.data';
+  import DataSourceModal from './DataSourceModal.vue';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  const { createMessage } = useMessage();
+  const [registerModal, { openModal }] = useModal();
 
-    // 列表页面公共参数、方法
-    const { prefixCls, tableContext,onImportXls,onExportXls } = useListPage({
-      designScope: 'quartz-template',
-      tableProps: {
-        title: '任务列表',
-        api: getDataSourceList,
-        columns: columns,
-        formConfig: {
-          labelWidth: 120,
-          schemas: searchFormSchema,
-          fieldMapToTime: [['fieldTime', ['beginDate', 'endDate'], 'YYYY-MM-DD HH:mm:ss']],
-        }
+  // 列表页面公共参数、方法
+  const { prefixCls, tableContext, onImportXls, onExportXls } = useListPage({
+    designScope: 'quartz-template',
+    tableProps: {
+      title: '任务列表',
+      api: getDataSourceList,
+      columns: columns,
+      formConfig: {
+        labelWidth: 120,
+        schemas: searchFormSchema,
+        fieldMapToTime: [['fieldTime', ['beginDate', 'endDate'], 'YYYY-MM-DD HH:mm:ss']],
       },
-      exportConfig: {
-        name:"数据源列表",
-        url: getExportUrl,
+    },
+    exportConfig: {
+      name: '数据源列表',
+      url: getExportUrl,
+    },
+    importConifg: {
+      url: getImportUrl,
+    },
+  });
+
+  const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;
+
+  /**
+   * 操作列定义
+   * @param record
+   */
+  function getActions(record) {
+    return [
+      {
+        label: '编辑',
+        onClick: handleEdit.bind(null, record),
       },
-      importConifg: {
-        url: getImportUrl
-      }
-    })
+      {
+        label: '删除',
+        popConfirm: {
+          title: '是否确认删除',
+          confirm: handleDelete.bind(null, record),
+        },
+      },
+    ];
+  }
 
-    const [registerTable, {reload},{ rowSelection, selectedRowKeys }] =tableContext;
+  /**
+   * 新增事件
+   */
+  function handleAdd() {
+    openModal(true, {
+      isUpdate: false,
+    });
+  }
 
-    /**
-     * 操作列定义
-     * @param record
-     */
-    function getActions(record) {
-        return [
-            {
-                label: '编辑',
-                onClick: handleEdit.bind(null, record),
-            },
-            {
-                label: '删除',
-                popConfirm: {
-                    title: '是否确认删除',
-                    confirm: handleDelete.bind(null, record),
-                },
-            },
-        ]
-    }
+  /**
+   * 编辑事件
+   */
+  function handleEdit(record) {
+    openModal(true, {
+      record,
+      isUpdate: true,
+    });
+  }
 
-    /**
-     * 新增事件
-     */
-    function handleAdd() {
-        openModal(true, {
-            isUpdate: false,
-        });
-    }
+  /**
+   * 删除事件
+   */
+  async function handleDelete(record) {
+    await deleteDataSource({ id: record.id }, reload);
+  }
 
-    /**
-     * 编辑事件
-     */
-    function handleEdit(record) {
-        openModal(true, {
-            record,
-            isUpdate: true,
-        });
-    }
-
-    /**
-     * 删除事件
-     */
-    async function handleDelete(record) {
-        await deleteDataSource({id: record.id}, reload);
-    }
-
-    /**
-     * 批量删除事件
-     */
-    async function batchHandleDelete() {
-        await batchDeleteDataSource({ids: selectedRowKeys.value}, reload);
-    }
+  /**
+   * 批量删除事件
+   */
+  async function batchHandleDelete() {
+    await batchDeleteDataSource({ ids: selectedRowKeys.value }, reload);
+  }
 </script>
diff --git a/src/views/monitor/disk/DiskInfo.vue b/src/views/monitor/disk/DiskInfo.vue
index 873edc7..7154678 100644
--- a/src/views/monitor/disk/DiskInfo.vue
+++ b/src/views/monitor/disk/DiskInfo.vue
@@ -1,12 +1,12 @@
 <template>
-  <Skeleton v-if="spinning" active/>
+  <Skeleton v-if="spinning" active />
   <div v-else>
     <a-row>
-        <template v-if="diskInfo && diskInfo.length>0">
-            <a-col :span="6" v-for="(item,index) in diskInfo" :key=" 'diskInfo'+index ">
-                <gauge :data="item"></gauge>
-            </a-col>
-        </template>
+      <template v-if="diskInfo && diskInfo.length > 0">
+        <a-col :span="6" v-for="(item, index) in diskInfo" :key="'diskInfo' + index">
+          <gauge :data="item"></gauge>
+        </a-col>
+      </template>
     </a-row>
   </div>
 </template>
@@ -20,18 +20,18 @@
   const spinning = ref(true);
 
   function loadRedisInfo() {
-    queryDiskInfo().then((res) => {
-      for (let i = 0; i < res.length; i++) {
-        // 当前算法算的是磁盘的已使用空间
-        res[i].restPPT = 100 - parseInt(String((res[i].rest / res[i].max) * 100));
-      }
-      diskInfo.value = res;
-    }).finally(() => spinning.value = false);
+    queryDiskInfo()
+      .then((res) => {
+        for (let i = 0; i < res.length; i++) {
+          // 当前算法算的是磁盘的已使用空间
+          res[i].restPPT = 100 - parseInt(String((res[i].rest / res[i].max) * 100));
+        }
+        diskInfo.value = res;
+      })
+      .finally(() => (spinning.value = false));
   }
 
   onMounted(() => {
     loadRedisInfo();
   });
-
-
 </script>
diff --git a/src/views/monitor/disk/disk.api.ts b/src/views/monitor/disk/disk.api.ts
index 7e9a318..ce01231 100644
--- a/src/views/monitor/disk/disk.api.ts
+++ b/src/views/monitor/disk/disk.api.ts
@@ -1,13 +1,12 @@
 import { defHttp } from '/@/utils/http/axios';
 
 enum Api {
-  queryDiskInfo = '/sys/actuator/redis/queryDiskInfo'
+  queryDiskInfo = '/sys/actuator/redis/queryDiskInfo',
 }
 
-
 /**
  * 详细信息
  */
 export const queryDiskInfo = () => {
-  return defHttp.get({url: Api.queryDiskInfo}, {successMessageMode: 'none'})
+  return defHttp.get({ url: Api.queryDiskInfo }, { successMessageMode: 'none' });
 };
diff --git a/src/views/monitor/disk/gauge.vue b/src/views/monitor/disk/gauge.vue
index 3658bf9..89224cf 100644
--- a/src/views/monitor/disk/gauge.vue
+++ b/src/views/monitor/disk/gauge.vue
@@ -1,7 +1,7 @@
 <template>
-    <div>
-        <div ref="chartRef" style="width:100%;height: 400px"></div>
-    </div>
+  <div>
+    <div ref="chartRef" style="width: 100%; height: 400px"></div>
+  </div>
 </template>
 <script lang="ts" setup>
   import { onMounted, ref, reactive, Ref, defineProps } from 'vue';
@@ -68,7 +68,6 @@
     ],
   });
 
-
   function initCharts() {
     option.series[0].data[0].name = props.data.name;
     option.series[0].data[0].value = props.data.restPPT;
@@ -80,6 +79,4 @@
     echarts.use(GaugeChart);
     initCharts();
   });
-
-
 </script>
diff --git a/src/views/monitor/log/index.vue b/src/views/monitor/log/index.vue
index 9b3e5d0..08a2c74 100644
--- a/src/views/monitor/log/index.vue
+++ b/src/views/monitor/log/index.vue
@@ -1,22 +1,24 @@
 <template>
-    <BasicTable @register="registerTable" :searchInfo="searchInfo">
-      <template #tableTitle>
-        <a-tabs defaultActiveKey="1" @change="tabChange" size="small">
-          <a-tab-pane tab="登录日志" key="1"></a-tab-pane>
-          <a-tab-pane tab="操作日志" key="2"></a-tab-pane>
-        </a-tabs>
-      </template>
-        <template #expandedRowRender="{ record }">
-            <div v-if="searchInfo.logType==2">
-                <div style="margin-bottom: 5px">
-                    <a-badge status="success" style="vertical-align: middle;"/>
-                    <span style="vertical-align: middle;">请求方法:{{ record.method }}</span></div>
-                <div>
-                    <a-badge status="processing" style="vertical-align: middle;"/>
-                    <span style="vertical-align: middle;">请求参数:{{ record.requestParam }}</span></div>
-            </div>
-        </template>
-    </BasicTable>
+  <BasicTable @register="registerTable" :searchInfo="searchInfo">
+    <template #tableTitle>
+      <a-tabs defaultActiveKey="1" @change="tabChange" size="small">
+        <a-tab-pane tab="登录日志" key="1"></a-tab-pane>
+        <a-tab-pane tab="操作日志" key="2"></a-tab-pane>
+      </a-tabs>
+    </template>
+    <template #expandedRowRender="{ record }">
+      <div v-if="searchInfo.logType == 2">
+        <div style="margin-bottom: 5px">
+          <a-badge status="success" style="vertical-align: middle" />
+          <span style="vertical-align: middle">请求方法:{{ record.method }}</span></div
+        >
+        <div>
+          <a-badge status="processing" style="vertical-align: middle" />
+          <span style="vertical-align: middle">请求参数:{{ record.requestParam }}</span></div
+        >
+      </div>
+    </template>
+  </BasicTable>
 </template>
 <script lang="ts" name="monitor-log" setup>
   import { ref } from 'vue';
@@ -24,33 +26,31 @@
   import { getLogList } from './log.api';
   import { columns, searchFormSchema } from './log.data';
   import { useMessage } from '/@/hooks/web/useMessage';
-  import { useListPage } from '/@/hooks/system/useListPage'
+  import { useListPage } from '/@/hooks/system/useListPage';
   const { createMessage } = useMessage();
   const checkedKeys = ref<Array<string | number>>([]);
 
   const searchInfo = { logType: '1' };
   // 列表页面公共参数、方法
-  const { prefixCls,tableContext } = useListPage({
+  const { prefixCls, tableContext } = useListPage({
     designScope: 'user-list',
     tableProps: {
       title: '日志列表',
       api: getLogList,
       columns: columns,
       expandRowByClick: true,
-      rowSelection:{
-        columnWidth:20
+      rowSelection: {
+        columnWidth: 20,
       },
       formConfig: {
-        schemas:searchFormSchema,
+        schemas: searchFormSchema,
         fieldMapToTime: [['fieldTime', ['createTime_begin', 'createTime_end'], 'YYYY-MM-DD HH:mm:ss']],
       },
-    }
-  })
-
+    },
+  });
 
   const [registerTable, { reload }] = tableContext;
 
-
   // 日志类型
   function tabChange(key) {
     searchInfo.logType = key;
@@ -63,5 +63,4 @@
   function onSelectChange(selectedRowKeys: (string | number)[]) {
     checkedKeys.value = selectedRowKeys;
   }
-
 </script>
diff --git a/src/views/monitor/log/log.api.ts b/src/views/monitor/log/log.api.ts
index dca062a..9676b58 100644
--- a/src/views/monitor/log/log.api.ts
+++ b/src/views/monitor/log/log.api.ts
@@ -1,7 +1,7 @@
-import {defHttp} from '/@/utils/http/axios';
+import { defHttp } from '/@/utils/http/axios';
 
 enum Api {
-    list = "/sys/log/list"
+  list = '/sys/log/list',
 }
 
 /**
@@ -9,5 +9,5 @@ enum Api {
  * @param params
  */
 export const getLogList = (params) => {
-    return defHttp.get({url: Api.list, params});
-}
+  return defHttp.get({ url: Api.list, params });
+};
diff --git a/src/views/monitor/mynews/DetailModal.vue b/src/views/monitor/mynews/DetailModal.vue
index c903c42..1d6357a 100644
--- a/src/views/monitor/mynews/DetailModal.vue
+++ b/src/views/monitor/mynews/DetailModal.vue
@@ -1,25 +1,23 @@
 <template>
   <BasicModal v-bind="$attrs" @register="registerModal" title="查看详情" :minHeight="600" :showCancelBtn="false" :showOkBtn="false" :height="88">
-
-    <a-card class="daily-article" >
-      <a-card-meta :title="content.titile" :description="'发布人：'+content.sender + ' 发布时间： ' + content.sendTime">
-      </a-card-meta>
+    <a-card class="daily-article">
+      <a-card-meta :title="content.titile" :description="'发布人：' + content.sender + ' 发布时间： ' + content.sendTime"> </a-card-meta>
       <a-divider />
       <span v-html="content.msgContent" class="article-content"></span>
     </a-card>
   </BasicModal>
 </template>
 <script lang="ts" setup>
-  import {BasicModal, useModalInner} from '/@/components/Modal';
-  import {propTypes} from '/@/utils/propTypes';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { propTypes } from '/@/utils/propTypes';
   import { ref, unref } from 'vue';
   const isUpdate = ref(true);
   const content = ref({});
   //表单赋值
-  const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
     isUpdate.value = !!data?.isUpdate;
     if (unref(isUpdate)) {
-      content.value=data.record
+      content.value = data.record;
     }
   });
 </script>
diff --git a/src/views/monitor/mynews/DynamicNotice.vue b/src/views/monitor/mynews/DynamicNotice.vue
index 7512a7e..e287b71 100644
--- a/src/views/monitor/mynews/DynamicNotice.vue
+++ b/src/views/monitor/mynews/DynamicNotice.vue
@@ -2,31 +2,31 @@
   <component :is="comp" :formData="formData" ref="compModel" v-if="comp"></component>
 </template>
 <script>
-  const modules = import.meta.glob('/@/views/monitor/mynews/*.vue')
+  const modules = import.meta.glob('/@/views/monitor/mynews/*.vue');
   export default {
     name: 'DynamicNotice',
-    data () {
+    data() {
       return {
-        compName: this.path
-      }
+        compName: this.path,
+      };
     },
     computed: {
       comp: function () {
-        if(!this.path){
+        if (!this.path) {
           return null;
         }
-        return () => modules[`/@/views/monitor/mynews/${this.path}`]
-      }
+        return () => modules[`/@/views/monitor/mynews/${this.path}`];
+      },
     },
-    props: ['path','formData'],
+    props: ['path', 'formData'],
     methods: {
-      detail () {
+      detail() {
         setTimeout(() => {
-          if(this.path){
+          if (this.path) {
             this.$refs.compModel.view(this.formData);
           }
-        }, 200)
+        }, 200);
       },
-    }
-  }
+    },
+  };
 </script>
diff --git a/src/views/monitor/mynews/index.vue b/src/views/monitor/mynews/index.vue
index aec306b..5a10bcc 100644
--- a/src/views/monitor/mynews/index.vue
+++ b/src/views/monitor/mynews/index.vue
@@ -1,21 +1,21 @@
 <template>
-    <div>
-        <BasicTable @register="registerTable" :searchInfo="searchInfo">
-            <template #tableTitle>
-                <a-button type="primary" @click="handlerReadAllMsg">全部标注已读</a-button>
-            </template>
-            <template #action="{ record }">
-                <TableAction :actions="getActions(record)"/>
-            </template>
-        </BasicTable>
-        <DetailModal @register="register"/>
-    </div>
+  <div>
+    <BasicTable @register="registerTable" :searchInfo="searchInfo">
+      <template #tableTitle>
+        <a-button type="primary" @click="handlerReadAllMsg">全部标注已读</a-button>
+      </template>
+      <template #action="{ record }">
+        <TableAction :actions="getActions(record)" />
+      </template>
+    </BasicTable>
+    <DetailModal @register="register" />
+  </div>
 </template>
 <script lang="ts" name="monitor-mynews" setup>
   import { ref } from 'vue';
   import { BasicTable, useTable, TableAction } from '/@/components/Table';
   import DetailModal from './DetailModal.vue';
-  import { getMyNewsList,editCementSend,syncNotic,readAllMsg} from './mynews.api';
+  import { getMyNewsList, editCementSend, syncNotic, readAllMsg } from './mynews.api';
   import { columns, searchFormSchema } from './mynews.data';
   import { useMessage } from '/@/hooks/web/useMessage';
   import { getToken } from '/@/utils/auth';
@@ -26,22 +26,22 @@
   const checkedKeys = ref<Array<string | number>>([]);
   const content = ref({});
   const searchInfo = { logType: '1' };
-  const [register, {openModal:openDetail}] = useModal();
-  import { useListPage } from '/@/hooks/system/useListPage'
+  const [register, { openModal: openDetail }] = useModal();
+  import { useListPage } from '/@/hooks/system/useListPage';
   import { getLogList } from '/@/views/monitor/log/log.api';
 
-  const { prefixCls,tableContext } = useListPage({
+  const { prefixCls, tableContext } = useListPage({
     designScope: 'mynews-list',
     tableProps: {
       title: '我的消息',
       api: getMyNewsList,
       columns: columns,
       formConfig: {
-        schemas:searchFormSchema,
+        schemas: searchFormSchema,
         fieldMapToTime: [['fieldTime', ['createTime_begin', 'createTime_end'], 'YYYY-MM-DD HH:mm:ss']],
       },
-    }
-  })
+    },
+  });
   const [registerTable, { reload }] = tableContext;
   /**
    * 操作列定义
@@ -53,17 +53,17 @@
         label: '查看',
         onClick: handleDetail.bind(null, record),
       },
-    ]
+    ];
   }
 
   /**
    * 查看
    */
   function handleDetail(record) {
-    let anntId=record.anntId;
-    editCementSend({anntId:anntId}).then((res)=>{
-        reload();
-        syncNotic({anntId:anntId})
+    let anntId = record.anntId;
+    editCementSend({ anntId: anntId }).then((res) => {
+      reload();
+      syncNotic({ anntId: anntId });
     });
     openDetail(true, {
       record,
@@ -78,7 +78,7 @@
 
   //全部标记已读
   function handlerReadAllMsg() {
-    readAllMsg({},reload);
+    readAllMsg({}, reload);
   }
 
   /**
@@ -87,5 +87,4 @@
   function onSelectChange(selectedRowKeys: (string | number)[]) {
     checkedKeys.value = selectedRowKeys;
   }
-
 </script>
diff --git a/src/views/monitor/mynews/mynews.api.ts b/src/views/monitor/mynews/mynews.api.ts
index 822d7ea..2ae9364 100644
--- a/src/views/monitor/mynews/mynews.api.ts
+++ b/src/views/monitor/mynews/mynews.api.ts
@@ -20,15 +20,15 @@ export const getMyNewsList = (params) => {
  * 更新用户系统消息阅读状态
  * @param params
  */
-export const editCementSend = (params,) =>{
-  return defHttp.put({url: Api.editCementSend,params});
-}
+export const editCementSend = (params) => {
+  return defHttp.put({ url: Api.editCementSend, params });
+};
 
 /**
  * 一键已读
  * @param params
  */
-export const readAllMsg = (params,handleSuccess) =>{
+export const readAllMsg = (params, handleSuccess) => {
   Modal.confirm({
     title: '确认操作',
     content: '是否全部标注已读?',
@@ -40,8 +40,7 @@ export const readAllMsg = (params,handleSuccess) =>{
       });
     },
   });
-}
-
+};
 
 /**
  * 同步消息
diff --git a/src/views/monitor/mynews/mynews.data.ts b/src/views/monitor/mynews/mynews.data.ts
index f3080b2..540cee0 100644
--- a/src/views/monitor/mynews/mynews.data.ts
+++ b/src/views/monitor/mynews/mynews.data.ts
@@ -13,7 +13,14 @@ export const columns: BasicColumn[] = [
     dataIndex: 'msgCategory',
     width: 80,
     customRender: ({ text }) => {
-      return render.renderDictNative(text, [{ label: '通知公告', value: '1',color:'blue' }, { label: '系统消息', value: '2' }],true);
+      return render.renderDictNative(
+        text,
+        [
+          { label: '通知公告', value: '1', color: 'blue' },
+          { label: '系统消息', value: '2' },
+        ],
+        true
+      );
     },
   },
   {
@@ -31,8 +38,8 @@ export const columns: BasicColumn[] = [
     dataIndex: 'priority',
     width: 80,
     customRender: ({ text }) => {
-      const color = text=='L'?'blue':text=='M'?'yellow':'red';
-      return  render.renderTag(render.renderDict(text, 'priority'),color)
+      const color = text == 'L' ? 'blue' : text == 'M' ? 'yellow' : 'red';
+      return render.renderTag(render.renderDict(text, 'priority'), color);
     },
   },
   {
@@ -40,7 +47,14 @@ export const columns: BasicColumn[] = [
     dataIndex: 'readFlag',
     width: 80,
     customRender: ({ text }) => {
-      return render.renderDictNative(text, [{ label: '未读', value: '0',color:'red' }, { label: '已读', value: '1' }],true);
+      return render.renderDictNative(
+        text,
+        [
+          { label: '未读', value: '0', color: 'red' },
+          { label: '已读', value: '1' },
+        ],
+        true
+      );
     },
   },
 ];
@@ -58,5 +72,4 @@ export const searchFormSchema: FormSchema[] = [
     component: 'Input',
     colProps: { span: 8 },
   },
-
 ];
diff --git a/src/views/monitor/quartz/QuartzModal.vue b/src/views/monitor/quartz/QuartzModal.vue
index 94c0dbd..5d1648c 100644
--- a/src/views/monitor/quartz/QuartzModal.vue
+++ b/src/views/monitor/quartz/QuartzModal.vue
@@ -1,59 +1,59 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit" width="40%">
-        <BasicForm @register="registerForm"/>
-    </BasicModal>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit" width="40%">
+    <BasicForm @register="registerForm" />
+  </BasicModal>
 </template>
 <script lang="ts" setup>
-    import {ref, computed, unref} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {BasicForm, useForm} from '/@/components/Form/index';
-    import {formSchema} from './quartz.data';
-    import {saveOrUpdateQuartz, getQuartzById} from './quartz.api';
-    import { isJsonObjectString } from '/@/utils/is'
-    // Emits声明
-    const emit = defineEmits(['register','success']);
-    const isUpdate = ref(true);
-    //表单配置
-    const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
-        labelWidth: 150,
-        schemas: formSchema,
-        showActionButtonGroup: false,
-    });
-    //表单赋值
-    const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-        //重置表单
-        await resetFields();
-        setModalProps({confirmLoading: false});
-        isUpdate.value = !!data?.isUpdate;
-        if (unref(isUpdate)) {
-            //获取详情
-            //data.record = await getQuartzById({id: data.record.id});
-            try{
-                data.record.paramterType = isJsonObjectString(data?.record?.parameter)?'json':'string'
-            }catch(e){
-                console.log(e)
-            }
-            //表单赋值
-            await setFieldsValue({
-                ...data.record,
-            });
-        }
-    });
-    //设置标题
-    const title = computed(() => (!unref(isUpdate) ? '新增任务' : '编辑任务'));
-    //表单提交事件
-    async function handleSubmit(v) {
-        try {
-            let values = await validate();
-            setModalProps({confirmLoading: true});
-            //提交表单
-            await saveOrUpdateQuartz(values, isUpdate.value);
-            //关闭弹窗
-            closeModal();
-            //刷新列表
-            emit('success');
-        } finally {
-            setModalProps({confirmLoading: false});
-        }
+  import { ref, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { formSchema } from './quartz.data';
+  import { saveOrUpdateQuartz, getQuartzById } from './quartz.api';
+  import { isJsonObjectString } from '/@/utils/is';
+  // Emits声明
+  const emit = defineEmits(['register', 'success']);
+  const isUpdate = ref(true);
+  //表单配置
+  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
+    labelWidth: 150,
+    schemas: formSchema,
+    showActionButtonGroup: false,
+  });
+  //表单赋值
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    //重置表单
+    await resetFields();
+    setModalProps({ confirmLoading: false });
+    isUpdate.value = !!data?.isUpdate;
+    if (unref(isUpdate)) {
+      //获取详情
+      //data.record = await getQuartzById({id: data.record.id});
+      try {
+        data.record.paramterType = isJsonObjectString(data?.record?.parameter) ? 'json' : 'string';
+      } catch (e) {
+        console.log(e);
+      }
+      //表单赋值
+      await setFieldsValue({
+        ...data.record,
+      });
     }
+  });
+  //设置标题
+  const title = computed(() => (!unref(isUpdate) ? '新增任务' : '编辑任务'));
+  //表单提交事件
+  async function handleSubmit(v) {
+    try {
+      let values = await validate();
+      setModalProps({ confirmLoading: true });
+      //提交表单
+      await saveOrUpdateQuartz(values, isUpdate.value);
+      //关闭弹窗
+      closeModal();
+      //刷新列表
+      emit('success');
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
+  }
 </script>
diff --git a/src/views/monitor/quartz/index.vue b/src/views/monitor/quartz/index.vue
index ff7099b..dcfcc30 100644
--- a/src/views/monitor/quartz/index.vue
+++ b/src/views/monitor/quartz/index.vue
@@ -1,37 +1,38 @@
 <template>
-    <div>
-        <BasicTable @register="registerTable" :rowSelection="rowSelection">
-            <template #tableTitle>
-                <a-button preIcon="ant-design:plus-outlined" type="primary" @click="handleAdd" style="margin-right: 5px">新增</a-button>
-                <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
-                <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
-                <a-dropdown v-if="selectedRowKeys.length > 0">
-                    <template #overlay>
-                        <a-menu>
-                            <a-menu-item key="1" @click="batchHandleDelete">
-                                <Icon icon="ant-design:delete-outlined"></Icon>
-                                删除
-                            </a-menu-item>
-                        </a-menu>
-                    </template>
-                    <a-button>批量操作
-                        <Icon icon="mdi:chevron-down"></Icon>
-                    </a-button>
-                </a-dropdown>
-            </template>
-            <template #action="{ record }">
-                <TableAction :actions="getActions(record)" :dropDownActions="getDropDownAction(record)"/>
-            </template>
-        </BasicTable>
-        <QuartzModal @register="registerModal" @success="reload"/>
-    </div>
+  <div>
+    <BasicTable @register="registerTable" :rowSelection="rowSelection">
+      <template #tableTitle>
+        <a-button preIcon="ant-design:plus-outlined" type="primary" @click="handleAdd" style="margin-right: 5px">新增</a-button>
+        <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
+        <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
+        <a-dropdown v-if="selectedRowKeys.length > 0">
+          <template #overlay>
+            <a-menu>
+              <a-menu-item key="1" @click="batchHandleDelete">
+                <Icon icon="ant-design:delete-outlined"></Icon>
+                删除
+              </a-menu-item>
+            </a-menu>
+          </template>
+          <a-button
+            >批量操作
+            <Icon icon="mdi:chevron-down"></Icon>
+          </a-button>
+        </a-dropdown>
+      </template>
+      <template #action="{ record }">
+        <TableAction :actions="getActions(record)" :dropDownActions="getDropDownAction(record)" />
+      </template>
+    </BasicTable>
+    <QuartzModal @register="registerModal" @success="reload" />
+  </div>
 </template>
 <script lang="ts" name="monitor-quartz" setup>
   import { ref } from 'vue';
   import { BasicTable, TableAction } from '/@/components/Table';
   import { useModal } from '/@/components/Modal';
-  import { useListPage } from '/@/hooks/system/useListPage'
-  import { getQuartzList, deleteQuartz, batchDeleteQuartz,executeImmediately, resumeJob,pauseJob,getExportUrl, getImportUrl } from './quartz.api';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import { getQuartzList, deleteQuartz, batchDeleteQuartz, executeImmediately, resumeJob, pauseJob, getExportUrl, getImportUrl } from './quartz.api';
   import { columns, searchFormSchema } from './quartz.data';
   import QuartzModal from './QuartzModal.vue';
   import { useMessage } from '/@/hooks/web/useMessage';
@@ -39,7 +40,7 @@
   const { createMessage } = useMessage();
   const [registerModal, { openModal }] = useModal();
   // 列表页面公共参数、方法
-  const { prefixCls, tableContext,onExportXls,onImportXls } = useListPage({
+  const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
     designScope: 'quartz-template',
     tableProps: {
       title: '任务列表',
@@ -55,16 +56,15 @@
       },
     },
     exportConfig: {
-      name:"定时任务列表",
+      name: '定时任务列表',
       url: getExportUrl,
     },
     importConfig: {
-      url: getImportUrl
-    }
-  })
+      url: getImportUrl,
+    },
+  });
 
-
-  const [registerTable, { reload },{ rowSelection, selectedRowKeys }] = tableContext;
+  const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;
 
   /**
    * 操作列定义
@@ -79,7 +79,7 @@
           confirm: handlerResume.bind(null, record),
         },
         ifShow: (_action) => {
-          return record.status== -1;
+          return record.status == -1;
         },
       },
       {
@@ -89,9 +89,9 @@
           confirm: handlerPause.bind(null, record),
         },
         ifShow: (_action) => {
-          return record.status== 0;
+          return record.status == 0;
         },
-      }
+      },
     ];
   }
 
@@ -105,7 +105,7 @@
         popConfirm: {
           title: '是否立即执行任务?',
           confirm: handlerExecute.bind(null, record),
-        }
+        },
       },
       {
         label: '编辑',
@@ -150,21 +150,21 @@
   /**
    * 立即执行
    */
-  async function handlerExecute(record){
+  async function handlerExecute(record) {
     await executeImmediately({ id: record.id }, reload);
   }
 
   /**
    * 暂停
    */
-  async function handlerPause(record){
+  async function handlerPause(record) {
     await pauseJob({ id: record.id }, reload);
   }
 
   /**
    * 启动
    */
-  async function handlerResume(record){
+  async function handlerResume(record) {
     await resumeJob({ id: record.id }, reload);
   }
 
diff --git a/src/views/monitor/quartz/quartz.api.ts b/src/views/monitor/quartz/quartz.api.ts
index bf5aad3..3e47562 100644
--- a/src/views/monitor/quartz/quartz.api.ts
+++ b/src/views/monitor/quartz/quartz.api.ts
@@ -105,4 +105,3 @@ export const batchDeleteQuartz = (params, handleSuccess) => {
     },
   });
 };
-
diff --git a/src/views/monitor/quartz/quartz.data.ts b/src/views/monitor/quartz/quartz.data.ts
index a37a058..f756db9 100644
--- a/src/views/monitor/quartz/quartz.data.ts
+++ b/src/views/monitor/quartz/quartz.data.ts
@@ -1,6 +1,6 @@
 import { BasicColumn, FormSchema } from '/@/components/Table';
 import { render } from '/@/utils/common/renderUtils';
-import { JCronValidator } from '/@/components/Form'
+import { JCronValidator } from '/@/components/Form';
 
 export const columns: BasicColumn[] = [
   {
@@ -29,8 +29,8 @@ export const columns: BasicColumn[] = [
     dataIndex: 'status',
     width: 100,
     customRender: ({ text }) => {
-      const color = text=='0'?'red':text=='-1'?'green':'gray';
-      return  render.renderTag(render.renderDict(text, 'quartz_status'),color)
+      const color = text == '0' ? 'red' : text == '-1' ? 'green' : 'gray';
+      return render.renderTag(render.renderDict(text, 'quartz_status'), color);
     },
   },
 ];
@@ -72,21 +72,18 @@ export const formSchema: FormSchema[] = [
     label: 'Cron表达式',
     component: 'JEasyCron',
     defaultValue: '* * * * * ? *',
-    rules: [
-      { required: true, message: '请输入Cron表达式' },
-      { validator: JCronValidator },
-    ],
+    rules: [{ required: true, message: '请输入Cron表达式' }, { validator: JCronValidator }],
   },
   {
     field: 'paramterType',
     label: '参数类型',
     component: 'Select',
-    defaultValue:'string',
+    defaultValue: 'string',
     componentProps: {
-        options: [
-            { label: '字符串', value: 'string' },
-            { label: 'JSON对象', value: 'json' },
-        ],
+      options: [
+        { label: '字符串', value: 'string' },
+        { label: 'JSON对象', value: 'json' },
+      ],
     },
   },
   {
@@ -94,16 +91,16 @@ export const formSchema: FormSchema[] = [
     label: '参数',
     component: 'InputTextArea',
     ifShow: ({ values }) => {
-        return values.paramterType == 'string';
+      return values.paramterType == 'string';
     },
   },
   {
     field: 'parameter',
     label: '参数',
     component: 'JAddInput',
-    helpMessage:'键值对形式填写',
+    helpMessage: '键值对形式填写',
     ifShow: ({ values }) => {
-        return values.paramterType == 'json';
+      return values.paramterType == 'json';
     },
   },
   {
@@ -124,5 +121,4 @@ export const formSchema: FormSchema[] = [
     label: '描述',
     component: 'InputTextArea',
   },
-
 ];
diff --git a/src/views/monitor/redis/index.vue b/src/views/monitor/redis/index.vue
index c6af234..06ad02f 100644
--- a/src/views/monitor/redis/index.vue
+++ b/src/views/monitor/redis/index.vue
@@ -1,19 +1,19 @@
 <template>
-    <div class="p-4">
-        <a-card>
-            <!-- Redis 信息实时监控 -->
-            <a-row :gutter="8">
-                <a-col :sm="24" :xl="12">
-                    <div ref="chartRef" style="width:100%;height: 300px"></div>
-                </a-col>
-                <a-col :sm="24" :xl="12">
-                    <div ref="chartRef2" style="width:100%;height: 300px"></div>
-                </a-col>
-            </a-row>
-        </a-card>
+  <div class="p-4">
+    <a-card>
+      <!-- Redis 信息实时监控 -->
+      <a-row :gutter="8">
+        <a-col :sm="24" :xl="12">
+          <div ref="chartRef" style="width: 100%; height: 300px"></div>
+        </a-col>
+        <a-col :sm="24" :xl="12">
+          <div ref="chartRef2" style="width: 100%; height: 300px"></div>
+        </a-col>
+      </a-row>
+    </a-card>
 
-        <BasicTable @register="registerTable" :api="getInfo"></BasicTable>
-    </div>
+    <BasicTable @register="registerTable" :api="getInfo"></BasicTable>
+  </div>
 </template>
 <script lang="ts" name="monitor-redis" setup>
   import { onMounted, ref, reactive, Ref } from 'vue';
@@ -54,7 +54,7 @@
         lineStyle: {
           color: '#dc143c',
           width: 10,
-          type: 'solid'
+          type: 'solid',
         },
       },
     ],
@@ -81,7 +81,7 @@
         lineStyle: {
           color: '#1890ff',
           width: 10,
-          type: 'solid'
+          type: 'solid',
         },
       },
     ],
@@ -96,8 +96,9 @@
 
   // 获取一组数据中最大和最小的值
   function getMaxAndMin(dataSource, field) {
-    let maxValue = null, minValue = null;
-    dataSource.forEach(item => {
+    let maxValue = null,
+      minValue = null;
+    dataSource.forEach((item) => {
       let value = Number.parseInt(item[field]);
       // max
       if (maxValue == null) {
@@ -119,7 +120,6 @@
     getInfo().then((res) => {
       dataSource.value = res.result;
     });
-
   }
 
   function initCharts() {
@@ -142,39 +142,41 @@
   }
 
   function loadData() {
-    getRedisInfo().then((res) => {
-      let time = moment().format('hh:mm:ss');
-      let [{ dbSize: currentSize }, memoryInfo] = res;
-      let currentMemory = memoryInfo.used_memory / 1000;
-      // push 数据
-      key.xAxis.data.push(time);
-      key.series[0].data.push(currentSize);
-      memory.xAxis.data.push(time);
-      memory.series[0].data.push(currentMemory);
-      // 最大长度为6
-      if (key.series[0].data.length > 6) {
-        key.xAxis.data.splice(0, 1);
-        key.series[0].data.splice(0, 1);
-        memory.xAxis.data.splice(0, 1);
-        memory.series[0].data.splice(0, 1);
-      }
-      setOptions(memory, false);
-      setOptions2(key, false);
+    getRedisInfo()
+      .then((res) => {
+        let time = moment().format('hh:mm:ss');
+        let [{ dbSize: currentSize }, memoryInfo] = res;
+        let currentMemory = memoryInfo.used_memory / 1000;
+        // push 数据
+        key.xAxis.data.push(time);
+        key.series[0].data.push(currentSize);
+        memory.xAxis.data.push(time);
+        memory.series[0].data.push(currentMemory);
+        // 最大长度为6
+        if (key.series[0].data.length > 6) {
+          key.xAxis.data.splice(0, 1);
+          key.series[0].data.splice(0, 1);
+          memory.xAxis.data.splice(0, 1);
+          memory.series[0].data.splice(0, 1);
+        }
+        setOptions(memory, false);
+        setOptions2(key, false);
 
-      // 计算 Key 最大最小值
-      //let keyPole = getMaxAndMin(key.dataSource, 'y');
-      //key.max = Math.floor(keyPole[0]) + 10;
-      //key.min = Math.floor(keyPole[1]) - 10;
-      //if (key.min < 0) this.key.min = 0;
+        // 计算 Key 最大最小值
+        //let keyPole = getMaxAndMin(key.dataSource, 'y');
+        //key.max = Math.floor(keyPole[0]) + 10;
+        //key.min = Math.floor(keyPole[1]) - 10;
+        //if (key.min < 0) this.key.min = 0;
 
-      // 计算 Memory 最大最小值
-      //let memoryPole = getMaxAndMin(memory.dataSource, 'y');
-      //memory.max = Math.floor(memoryPole[0]) + 100;
-      //memory.min = Math.floor(memoryPole[1]) - 100;
-      //if (memory.min < 0) memory.min = 0;
-    }).catch((e) => {
-      //closeTimer()
-    });
+        // 计算 Memory 最大最小值
+        //let memoryPole = getMaxAndMin(memory.dataSource, 'y');
+        //memory.max = Math.floor(memoryPole[0]) + 100;
+        //memory.min = Math.floor(memoryPole[1]) - 100;
+        //if (memory.min < 0) memory.min = 0;
+      })
+      .catch((e) => {
+        //closeTimer()
+      });
   }
 
   onMounted(() => {
@@ -184,6 +186,4 @@
       loadData();
     }, 1000);
   });
-
-
 </script>
diff --git a/src/views/monitor/redis/redis.api.ts b/src/views/monitor/redis/redis.api.ts
index d5be37e..09734f3 100644
--- a/src/views/monitor/redis/redis.api.ts
+++ b/src/views/monitor/redis/redis.api.ts
@@ -3,7 +3,7 @@ import { defHttp } from '/@/utils/http/axios';
 enum Api {
   keysSize = '/sys/actuator/redis/keysSize',
   memoryInfo = '/sys/actuator/redis/memoryInfo',
-  info = '/sys/actuator/redis/info'
+  info = '/sys/actuator/redis/info',
 }
 
 /**
@@ -28,8 +28,5 @@ export const getInfo = () => {
 };
 
 export const getRedisInfo = () => {
-  return Promise.all([
-    getKeysSize(),
-    getMemoryInfo(),
-  ]);
+  return Promise.all([getKeysSize(), getMemoryInfo()]);
 };
diff --git a/src/views/monitor/redis/redis.data.ts b/src/views/monitor/redis/redis.data.ts
index 6f40917..d370f94 100644
--- a/src/views/monitor/redis/redis.data.ts
+++ b/src/views/monitor/redis/redis.data.ts
@@ -4,7 +4,7 @@ export const columns: BasicColumn[] = [
   {
     title: 'Key',
     dataIndex: 'key',
-    width: 100
+    width: 100,
   },
   {
     title: 'Description',
@@ -15,5 +15,5 @@ export const columns: BasicColumn[] = [
     title: 'Value',
     dataIndex: 'value',
     width: 80,
-  }
+  },
 ];
diff --git a/src/views/monitor/route/RouteModal.vue b/src/views/monitor/route/RouteModal.vue
index 498c314..95cb656 100644
--- a/src/views/monitor/route/RouteModal.vue
+++ b/src/views/monitor/route/RouteModal.vue
@@ -1,115 +1,139 @@
 <template>
-    <BasicDrawer v-bind="$attrs" @register="registerDrawer" :title="getTitle" width="30%" @ok="handleSubmit" destroyOnClose showFooter>
-        <a-form ref="formRef" :label-col="labelCol" :wrapper-col="wrapperCol" :model="router" :rules="validatorRules">
-            <a-form-item label="路由ID" name="routerId">
-                <a-input v-model:value="router.routerId" placeholder="路由唯一ID"/>
-            </a-form-item>
-            <a-form-item label="路由名称" name="name">
-                <a-input v-model:value="router.name" placeholder="路由名称"/>
-            </a-form-item>
-            <a-form-item label="路由URI" name="uri">
-                <a-input v-model:value="router.uri" placeholder="路由URL"/>
-            </a-form-item>
-            <a-form-item label="路由状态" name="status">
-                <a-switch default-checked :checked-value="1" :un-checked-value="0" v-model:checked="router.status"/>
-            </a-form-item>
+  <BasicDrawer v-bind="$attrs" @register="registerDrawer" :title="getTitle" width="30%" @ok="handleSubmit" destroyOnClose showFooter>
+    <a-form ref="formRef" :label-col="labelCol" :wrapper-col="wrapperCol" :model="router" :rules="validatorRules">
+      <a-form-item label="路由ID" name="routerId">
+        <a-input v-model:value="router.routerId" placeholder="路由唯一ID" />
+      </a-form-item>
+      <a-form-item label="路由名称" name="name">
+        <a-input v-model:value="router.name" placeholder="路由名称" />
+      </a-form-item>
+      <a-form-item label="路由URI" name="uri">
+        <a-input v-model:value="router.uri" placeholder="路由URL" />
+      </a-form-item>
+      <a-form-item label="路由状态" name="status">
+        <a-switch default-checked :checked-value="1" :un-checked-value="0" v-model:checked="router.status" />
+      </a-form-item>
 
-            <a-form-item name="predicates" label="路由条件">
-                <div v-for="(item,index) in router.predicates" >
-                  <!--当name在noKeyRouter时不需要指定key-->
-                   <template v-if="noKeyRouter.includes(item.name)">
-                     <a-divider>{{item.name}}
-                       <DeleteOutlined size="22" @click="removePredicate(router,index)"/>
-                     </a-divider>
-                     <div>
-                       <template v-for="(tag, tagIndx) in item.args">
-                         <a-input ref="inputRef2" v-if="tagIndx==currentTagIndex&&index==currentNameIndex"  type="text" size="small" :style="{ width: '190px' }" v-model:value="state.inputValue" @change="handleInputChange" @blur="handleInputEditConfirm(item,tag,tagIndx)" @keyup.enter="handleInputEditConfirm(item,tag,tagIndx)"/>
-                         <a-tag v-else :key="tag" style="margin-bottom:2px" :closable="true" @close="() => removeTag(item,tag)" @click="editTag(item,tag,tagIndx,index)">
-                           {{ tag }}
-                         </a-tag>
-                       </template>
-                       <a-input ref="inputRef" v-if="state.inputVisible&&index==currentNameIndex" type="text" size="small" :style="{ width: '100px' }" v-model:value="state.inputValue" @change="handleInputChange" @blur="handleInputConfirm(item)" @keyup.enter="handleInputConfirm(item)"/>
-                       <a-tag v-else style="background: #fff; borderStyle: dashed;margin-bottom:2px" @click="showInput(item,index)">
-                         <PlusOutlined size="22" />
-                         新建{{item.name}}
-                       </a-tag>
-                     </div>
-                   </template>
-                  <!--当name不在noKeyRouter时需要指定key-->
-                  <template v-if="!noKeyRouter.includes(item.name)">
-                    <a-divider>{{item.name}}
-                      <DeleteOutlined size="22" @click="removePredicate(router,index)"/>
-                    </a-divider>
-                    <div>
-                        <template v-for="(value, key) in item.args">
-                          <a-row>
-                            <a-col :span="5" style="margin-top: 8px">
-                              <span v-if="key=='header'" >Header名称</span>
-                              <span v-if="key=='regexp'">参数值</span>
-                              <span v-if="key=='param'">参数名</span>
-                              <span v-if="key=='name'">参数名</span>
-                            </a-col>
-                            <a-col :span="18">
-                              <a-input :defaultValue="value" placeholder="参数值" style="width: 70%; margin-right: 8px;margin-top: 3px" @change="(e)=>valueChange(e,item.args,key)"/>
-                            </a-col>
-                          </a-row>
-                        </template>
-                    </div>
-                   </template>
-                </div>
-                <p class="btn" style="padding-top: 10px">
-                    <a-dropdown>
-                        <template #overlay>
-                            <a-menu >
-                                <a-menu-item :key="item.name" v-for="item in tagArray" @click="predicatesHandleMenuClick(item)">{{item.name}}</a-menu-item>
-                            </a-menu>
-                        </template>
-                        <a-button type="dashed" style="margin-left: 8px;width:100%"> 添加路由条件
-                          <DownOutlined :size="22"/>
-                        </a-button>
-                    </a-dropdown>
-                </p>
-            </a-form-item>
-            <a-form-item name="predicates" label="过滤器">
-                <div v-for="(item,index) in router.filters">
-                    <a-divider>{{item.name}}
-                        <DeleteOutlined  size="22" @click="removeFilter(router,index)"/>
-                    </a-divider>
-                    <div v-for="(tag, index) in item.args" :key="tag.key">
-                        <a-input v-model:value="tag.key" placeholder="参数键" style="width: 45%; margin-right: 8px"/>
-                        <a-input v-model:value="tag.value" placeholder="参数值" style="width: 40%; margin-right: 8px;margin-top: 3px"/>
-                        <CloseOutlined :size="22" @click="removeFilterParams(item,index)"/>
-                    </div>
-                    <a-button type="dashed" style="margin-left:28%;width: 37%;margin-top:5px" size="small" @click="addFilterParams(item)">
-                        <DownOutlined :size="22"/>
-                        添加参数
-                    </a-button>
-                </div>
-                <p class="btn" style="padding-top: 10px">
-                    <a-dropdown>
-                        <template #overlay>
-                            <a-menu @click="filterHandleMenuClick">
-                                <a-menu-item :key="item.key" :name="item.name" v-for="item in filterArray">{{item.name}}</a-menu-item>
-                            </a-menu>
-                        </template>
-                        <a-button type="dashed" style="margin-left: 8px;width:100%"> 添加过滤器
-                            <DownOutlined />
-                        </a-button>
-                    </a-dropdown>
-                </p>
-            </a-form-item>
-        </a-form>
-
-    </BasicDrawer>
+      <a-form-item name="predicates" label="路由条件">
+        <div v-for="(item, index) in router.predicates">
+          <!--当name在noKeyRouter时不需要指定key-->
+          <template v-if="noKeyRouter.includes(item.name)">
+            <a-divider
+              >{{ item.name }}
+              <DeleteOutlined size="22" @click="removePredicate(router, index)" />
+            </a-divider>
+            <div>
+              <template v-for="(tag, tagIndx) in item.args">
+                <a-input
+                  ref="inputRef2"
+                  v-if="tagIndx == currentTagIndex && index == currentNameIndex"
+                  type="text"
+                  size="small"
+                  :style="{ width: '190px' }"
+                  v-model:value="state.inputValue"
+                  @change="handleInputChange"
+                  @blur="handleInputEditConfirm(item, tag, tagIndx)"
+                  @keyup.enter="handleInputEditConfirm(item, tag, tagIndx)"
+                />
+                <a-tag v-else :key="tag" style="margin-bottom: 2px" :closable="true" @close="() => removeTag(item, tag)" @click="editTag(item, tag, tagIndx, index)">
+                  {{ tag }}
+                </a-tag>
+              </template>
+              <a-input
+                ref="inputRef"
+                v-if="state.inputVisible && index == currentNameIndex"
+                type="text"
+                size="small"
+                :style="{ width: '100px' }"
+                v-model:value="state.inputValue"
+                @change="handleInputChange"
+                @blur="handleInputConfirm(item)"
+                @keyup.enter="handleInputConfirm(item)"
+              />
+              <a-tag v-else style="background: #fff; borderstyle: dashed; margin-bottom: 2px" @click="showInput(item, index)">
+                <PlusOutlined size="22" />
+                新建{{ item.name }}
+              </a-tag>
+            </div>
+          </template>
+          <!--当name不在noKeyRouter时需要指定key-->
+          <template v-if="!noKeyRouter.includes(item.name)">
+            <a-divider
+              >{{ item.name }}
+              <DeleteOutlined size="22" @click="removePredicate(router, index)" />
+            </a-divider>
+            <div>
+              <template v-for="(value, key) in item.args">
+                <a-row>
+                  <a-col :span="5" style="margin-top: 8px">
+                    <span v-if="key == 'header'">Header名称</span>
+                    <span v-if="key == 'regexp'">参数值</span>
+                    <span v-if="key == 'param'">参数名</span>
+                    <span v-if="key == 'name'">参数名</span>
+                  </a-col>
+                  <a-col :span="18">
+                    <a-input :defaultValue="value" placeholder="参数值" style="width: 70%; margin-right: 8px; margin-top: 3px" @change="(e) => valueChange(e, item.args, key)" />
+                  </a-col>
+                </a-row>
+              </template>
+            </div>
+          </template>
+        </div>
+        <p class="btn" style="padding-top: 10px">
+          <a-dropdown>
+            <template #overlay>
+              <a-menu>
+                <a-menu-item :key="item.name" v-for="item in tagArray" @click="predicatesHandleMenuClick(item)">{{ item.name }}</a-menu-item>
+              </a-menu>
+            </template>
+            <a-button type="dashed" style="margin-left: 8px; width: 100%">
+              添加路由条件
+              <DownOutlined :size="22" />
+            </a-button>
+          </a-dropdown>
+        </p>
+      </a-form-item>
+      <a-form-item name="predicates" label="过滤器">
+        <div v-for="(item, index) in router.filters">
+          <a-divider
+            >{{ item.name }}
+            <DeleteOutlined size="22" @click="removeFilter(router, index)" />
+          </a-divider>
+          <div v-for="(tag, index) in item.args" :key="tag.key">
+            <a-input v-model:value="tag.key" placeholder="参数键" style="width: 45%; margin-right: 8px" />
+            <a-input v-model:value="tag.value" placeholder="参数值" style="width: 40%; margin-right: 8px; margin-top: 3px" />
+            <CloseOutlined :size="22" @click="removeFilterParams(item, index)" />
+          </div>
+          <a-button type="dashed" style="margin-left: 28%; width: 37%; margin-top: 5px" size="small" @click="addFilterParams(item)">
+            <DownOutlined :size="22" />
+            添加参数
+          </a-button>
+        </div>
+        <p class="btn" style="padding-top: 10px">
+          <a-dropdown>
+            <template #overlay>
+              <a-menu @click="filterHandleMenuClick">
+                <a-menu-item :key="item.key" :name="item.name" v-for="item in filterArray">{{ item.name }}</a-menu-item>
+              </a-menu>
+            </template>
+            <a-button type="dashed" style="margin-left: 8px; width: 100%">
+              添加过滤器
+              <DownOutlined />
+            </a-button>
+          </a-dropdown>
+        </p>
+      </a-form-item>
+    </a-form>
+  </BasicDrawer>
 </template>
 <script lang="ts" setup>
-  import { ref, computed, unref, useAttrs, reactive,nextTick } from 'vue';
-  import {BasicDrawer, useDrawerInner} from '/@/components/Drawer';
+  import { ref, computed, unref, useAttrs, reactive, nextTick } from 'vue';
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
   import { saveOrUpdateRoute } from './route.api';
-  import {DeleteOutlined} from '@ant-design/icons-vue';
-  import {PlusOutlined} from '@ant-design/icons-vue';
-  import {CloseOutlined} from '@ant-design/icons-vue';
-  import {DownOutlined} from '@ant-design/icons-vue';
+  import { DeleteOutlined } from '@ant-design/icons-vue';
+  import { PlusOutlined } from '@ant-design/icons-vue';
+  import { CloseOutlined } from '@ant-design/icons-vue';
+  import { DownOutlined } from '@ant-design/icons-vue';
   // 声明Emits
   const emit = defineEmits(['register', 'success']);
   const labelCol = reactive({
@@ -131,68 +155,62 @@
   const currentNameIndex = ref(0);
   const currentTagIndex = ref(-1);
   const validatorRules = {
-    routerId: [
-      { required: true, message: 'routerId不能为空', trigger: 'blur' },
-    ],
-    name: [
-      { required: true, message: '路由名称不能为空', trigger: 'blur' },
-    ],
-    uri: [
-      { required: true, message: 'uri不能为空', trigger: 'blur' },
-    ],
+    routerId: [{ required: true, message: 'routerId不能为空', trigger: 'blur' }],
+    name: [{ required: true, message: '路由名称不能为空', trigger: 'blur' }],
+    uri: [{ required: true, message: 'uri不能为空', trigger: 'blur' }],
   };
-  const noKeyRouter=["Path","Host","Method","After","Before","Between","RemoteAddr"];
+  const noKeyRouter = ['Path', 'Host', 'Method', 'After', 'Before', 'Between', 'RemoteAddr'];
   const filterArray = [/*{ key: 0, name: '熔断器' },*/ { key: 1, name: '限流过滤器' }];
   const tagArray = ref([
     {
-      name:'Path',
-      args:[]
+      name: 'Path',
+      args: [],
     },
     {
-      name:'Header',
-      args:{
-        header:'',
-        regexp:''
-      }
+      name: 'Header',
+      args: {
+        header: '',
+        regexp: '',
+      },
     },
     {
-      name:'Query',
-      args:{
-        param:'',
-        regexp:''
-      }
+      name: 'Query',
+      args: {
+        param: '',
+        regexp: '',
+      },
     },
     {
-      name:'Method',
-      args:[]
+      name: 'Method',
+      args: [],
     },
     {
-      name:'Host',
-      args:[]
+      name: 'Host',
+      args: [],
     },
     {
-      name:'Cookie',
-      args:{
-        name:'',
-        regexp:''
-      }
+      name: 'Cookie',
+      args: {
+        name: '',
+        regexp: '',
+      },
     },
     {
-      name:'After',
-      args:[]
+      name: 'After',
+      args: [],
     },
     {
-      name:'Before',
-      args:[]
+      name: 'Before',
+      args: [],
     },
     {
-      name:'Between',
-      args:[]
+      name: 'Between',
+      args: [],
     },
     {
-      name:'RemoteAddr',
-      args:[]
-    }
+      name: 'RemoteAddr',
+      args: [],
+    },
   ]);
   const formRef = ref();
   let router = reactive({});
@@ -210,10 +228,9 @@
    */
   const getTitle = computed(() => (!unref(isUpdate) ? '新增路由' : '编辑路由'));
 
-
   //删除路由条件配置项
   function removeTag(item, removedTag) {
-    let tags = item.args.filter(tag => tag !== removedTag);
+    let tags = item.args.filter((tag) => tag !== removedTag);
     item.args = tags;
   }
 
@@ -244,14 +261,14 @@
    * @param item
    * @param key
    */
-  function valueChange(e,item,key){
-    item[key]=e.target.value
+  function valueChange(e, item, key) {
+    item[key] = e.target.value;
   }
 
-  function editTag(item,tag, tagIndex,index) {
+  function editTag(item, tag, tagIndex, index) {
     currentNameIndex.value = index;
     currentTagIndex.value = tagIndex;
-    state.inputValue=tag;
+    state.inputValue = tag;
     nextTick(() => {
       inputRef2.value.focus();
     });
@@ -259,7 +276,7 @@
 
   //显示输入框
   function showInput(item, index) {
-    state.inputValue='';
+    state.inputValue = '';
     state.inputVisible = true;
     currentNameIndex.value = index;
     nextTick(() => {
@@ -269,11 +286,10 @@
 
   //路由选项输入框改变事件
   function handleInputChange(e) {
-    console.info("change",e)
-    console.info("change",e.target.value)
+    console.info('change', e);
+    console.info('change', e.target.value);
     //state.value = e.target.value;
     //state.tag=true;
-
   }
 
   //删除路由条件
@@ -303,13 +319,16 @@
   function filterHandleMenuClick(e) {
     if (e.key == 0) {
       router.filters.push({
-        args: [{
-          key: 'name',
-          value: 'default',
-        }, {
-          key: 'fallbackUri',
-          value: 'forward:/fallback',
-        }],
+        args: [
+          {
+            key: 'name',
+            value: 'default',
+          },
+          {
+            key: 'fallbackUri',
+            value: 'forward:/fallback',
+          },
+        ],
         name: 'Hystrix',
         title: filterArray[0].name,
       });
@@ -317,16 +336,20 @@
     console.info('test', router);
     if (e.key == 1) {
       router.filters.push({
-        args: [{
-          key: 'key-resolver',
-          value: '#{@ipKeyResolver}',
-        }, {
-          key: 'redis-rate-limiter.replenishRate',
-          value: 20,
-        }, {
-          key: 'redis-rate-limiter.burstCapacity',
-          value: 20,
-        }],
+        args: [
+          {
+            key: 'key-resolver',
+            value: '#{@ipKeyResolver}',
+          },
+          {
+            key: 'redis-rate-limiter.replenishRate',
+            value: 20,
+          },
+          {
+            key: 'redis-rate-limiter.burstCapacity',
+            value: 20,
+          },
+        ],
         name: 'RequestRateLimiter',
         title: filterArray[0].name,
       });
@@ -340,8 +363,8 @@
     if (inputValue && tags.indexOf(inputValue) === -1) {
       item.args = [...tags, state.inputValue];
     }
-    state.inputVisible=false;
-    state.inputValue='';
+    state.inputVisible = false;
+    state.inputValue = '';
     currentTagIndex.value = -1;
     currentNameIndex.value = -1;
   }
@@ -354,13 +377,10 @@
     }
     currentTagIndex.value = -1;
     currentNameIndex.value = -1;
-
   }
 
   //关闭弹窗
-  function handleCancel() {
-
-  }
+  function handleCancel() {}
 
   /**
    * 提交
@@ -370,17 +390,16 @@
       try {
         setDrawerProps({ confirmLoading: true });
         //重新构造表单提交对象,切记不可修改router对象，数组修改为字符串容易造成界面混乱
-        let params=Object.assign({},router,{
-          predicates:JSON.stringify(router.predicates),
-          filters:JSON.stringify(router.filters),
-        })
+        let params = Object.assign({}, router, {
+          predicates: JSON.stringify(router.predicates),
+          filters: JSON.stringify(router.filters),
+        });
         //提交表单
         saveOrUpdateRoute({ router: params }).then(() => {
           closeDrawer();
           //刷新列表
           emit('success');
         });
-
       } finally {
         setDrawerProps({ confirmLoading: false });
       }
diff --git a/src/views/monitor/route/index.vue b/src/views/monitor/route/index.vue
index 521c17c..7e96e83 100644
--- a/src/views/monitor/route/index.vue
+++ b/src/views/monitor/route/index.vue
@@ -1,19 +1,19 @@
 <template>
-    <div class="p-4">
-        <BasicTable @register="registerTable" :indexColumnProps="indexColumnProps">
-            <template #tableTitle>
-                <a-button preIcon="ant-design:plus-outlined" type="primary" @click="handleAdd" style="margin-right: 5px">新增</a-button>
-            </template>
-            <template #status="{ record,text }">
-                <a-tag color="pink" v-if="text==0">禁用</a-tag>
-                <a-tag color="#87d068" v-if="text==1" >正常</a-tag>
-            </template>
-            <template #action="{ record }">
-                <TableAction :actions="getActions(record)"/>
-            </template>
-        </BasicTable>
-        <RouteModal @register="registerDrawer" @success="reload"/>
-    </div>
+  <div class="p-4">
+    <BasicTable @register="registerTable" :indexColumnProps="indexColumnProps">
+      <template #tableTitle>
+        <a-button preIcon="ant-design:plus-outlined" type="primary" @click="handleAdd" style="margin-right: 5px">新增</a-button>
+      </template>
+      <template #status="{ record, text }">
+        <a-tag color="pink" v-if="text == 0">禁用</a-tag>
+        <a-tag color="#87d068" v-if="text == 1">正常</a-tag>
+      </template>
+      <template #action="{ record }">
+        <TableAction :actions="getActions(record)" />
+      </template>
+    </BasicTable>
+    <RouteModal @register="registerDrawer" @success="reload" />
+  </div>
 </template>
 <script lang="ts" name="monitor-route" setup>
   import { ref } from 'vue';
@@ -24,7 +24,7 @@
   import RouteModal from './RouteModal.vue';
   import { useMessage } from '/@/hooks/web/useMessage';
   import { useDrawer } from '/@/components/Drawer';
-  import { useListPage } from '/@/hooks/system/useListPage'
+  import { useListPage } from '/@/hooks/system/useListPage';
   const { createMessage } = useMessage();
   const [registerDrawer, { openDrawer }] = useDrawer();
   const checkedKeys = ref<Array<string | number>>([]);
@@ -35,13 +35,12 @@
     tableProps: {
       title: '路由列表',
       api: getRouteList,
-      useSearchForm:false,
+      useSearchForm: false,
       columns: columns,
-    }
-  })
+    },
+  });
 
-
-  const [registerTable, { reload },{ rowSelection, selectedRowKeys }] = tableContext;
+  const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;
   /**
    * 序号列配置
    */
diff --git a/src/views/monitor/route/route.api.ts b/src/views/monitor/route/route.api.ts
index 9f3264f..d78e40a 100644
--- a/src/views/monitor/route/route.api.ts
+++ b/src/views/monitor/route/route.api.ts
@@ -1,10 +1,10 @@
-import {defHttp} from '/@/utils/http/axios';
+import { defHttp } from '/@/utils/http/axios';
 
 enum Api {
-    list = "/sys/gatewayRoute/list",
-    save = "/sys/gatewayRoute/add",
-    edit = "/sys/gatewayRoute/updateAll",
-    delete = "/sys/gatewayRoute/delete"
+  list = '/sys/gatewayRoute/list',
+  save = '/sys/gatewayRoute/add',
+  edit = '/sys/gatewayRoute/updateAll',
+  delete = '/sys/gatewayRoute/delete',
 }
 
 /**
@@ -12,25 +12,23 @@ enum Api {
  * @param params
  */
 export const getRouteList = (params) => {
-    return defHttp.get({url: Api.list, params});
-}
+  return defHttp.get({ url: Api.list, params });
+};
 
 /**
  * 保存或者更新路由
  * @param params
  */
 export const saveOrUpdateRoute = (params) => {
-    return defHttp.post({url: Api.edit, params});
-}
-
-
+  return defHttp.post({ url: Api.edit, params });
+};
 
 /**
  * 删除路由
  * @param params
  */
-export const deleteRoute = (params,handleSuccess) => {
-    return defHttp.delete({url: Api.delete, data: params}, {joinParamsToUrl: true}).then(()=>{
-        handleSuccess();
-    });
-}
+export const deleteRoute = (params, handleSuccess) => {
+  return defHttp.delete({ url: Api.delete, data: params }, { joinParamsToUrl: true }).then(() => {
+    handleSuccess();
+  });
+};
diff --git a/src/views/monitor/route/route.data.ts b/src/views/monitor/route/route.data.ts
index 5ed6fdc..9749f5b 100644
--- a/src/views/monitor/route/route.data.ts
+++ b/src/views/monitor/route/route.data.ts
@@ -25,7 +25,6 @@ export const columns: BasicColumn[] = [
   },
 ];
 
-
 export const formSchema: FormSchema[] = [
   {
     field: 'name',
diff --git a/src/views/monitor/server/index.vue b/src/views/monitor/server/index.vue
index c51fc00..15d2add 100644
--- a/src/views/monitor/server/index.vue
+++ b/src/views/monitor/server/index.vue
@@ -1,38 +1,37 @@
 <template>
-    <div class="p-4">
-        <a-card :bordered="false" style="height: 100%;">
-            <a-tabs v-model:activeKey="activeKey" @change="tabChange">
-                <a-tab-pane key="1" tab="服务器信息"></a-tab-pane>
-                <a-tab-pane key="2" tab="JVM信息" force-render></a-tab-pane>
-                <a-tab-pane key="3" tab="Tomcat信息"></a-tab-pane>
-                <a-tab-pane key="4" tab="磁盘监控">
-                    <DiskInfo v-if="activeKey==4" style="height: 100%;"></DiskInfo>
-                </a-tab-pane>
-            </a-tabs>
-            <BasicTable @register="registerTable" :searchInfo="searchInfo" :dataSource="dataSource" v-if="activeKey!=4">
-
-                <template #tableTitle>
-                    <div slot="message">上次更新时间：{{ lastUpdateTime }}
-                        <a-divider type="vertical"/>
-                        <a @click="handleUpdate">立即更新</a></div>
-                </template>
-                <template #param="{ record ,text}">
-                    <a-tag :color="textInfo[record.param].color">{{ text }}</a-tag>
-                </template>
-                <template #text="{ record }">
-                    {{ textInfo[record.param].text }}
-                </template>
-                <template #value="{ record,text }">
-                    {{ text }} {{ textInfo[record.param].unit }}
-                </template>
-            </BasicTable>
-        </a-card>
-    </div>
+  <div class="p-4">
+    <a-card :bordered="false" style="height: 100%">
+      <a-tabs v-model:activeKey="activeKey" @change="tabChange">
+        <a-tab-pane key="1" tab="服务器信息"></a-tab-pane>
+        <a-tab-pane key="2" tab="JVM信息" force-render></a-tab-pane>
+        <a-tab-pane key="3" tab="Tomcat信息"></a-tab-pane>
+        <a-tab-pane key="4" tab="磁盘监控">
+          <DiskInfo v-if="activeKey == 4" style="height: 100%"></DiskInfo>
+        </a-tab-pane>
+      </a-tabs>
+      <BasicTable @register="registerTable" :searchInfo="searchInfo" :dataSource="dataSource" v-if="activeKey != 4">
+        <template #tableTitle>
+          <div slot="message"
+            >上次更新时间：{{ lastUpdateTime }}
+            <a-divider type="vertical" />
+            <a @click="handleUpdate">立即更新</a></div
+          >
+        </template>
+        <template #param="{ record, text }">
+          <a-tag :color="textInfo[record.param].color">{{ text }}</a-tag>
+        </template>
+        <template #text="{ record }">
+          {{ textInfo[record.param].text }}
+        </template>
+        <template #value="{ record, text }"> {{ text }} {{ textInfo[record.param].unit }} </template>
+      </BasicTable>
+    </a-card>
+  </div>
 </template>
 <script lang="ts" name="monitor-server" setup>
   import { onMounted, ref, unref } from 'vue';
   import { BasicTable, useTable, TableAction } from '/@/components/Table';
-  import DiskInfo  from '../disk/DiskInfo.vue';
+  import DiskInfo from '../disk/DiskInfo.vue';
   import { getServerInfo, getTextInfo, getMoreInfo } from './server.api';
   import { columns } from './server.data';
   import { useMessage } from '/@/hooks/web/useMessage';
@@ -59,7 +58,7 @@
 
   //tab切换
   function tabChange(key) {
-    if(key!=4){
+    if (key != 4) {
       getInfoList(key);
     }
   }
@@ -105,6 +104,4 @@
   onMounted(() => {
     getInfoList(activeKey.value);
   });
-
-
 </script>
diff --git a/src/views/monitor/server/server.api.ts b/src/views/monitor/server/server.api.ts
index 5c8c8ad..41b2f8f 100644
--- a/src/views/monitor/server/server.api.ts
+++ b/src/views/monitor/server/server.api.ts
@@ -23,12 +23,11 @@ enum Api {
   jvmGcLiveDataSize = '/actuator/metrics/jvm.gc.live.data.size',
   jvmGcPause = '/actuator/metrics/jvm.gc.pause',
 
-
   tomcatSessionsCreated = '/actuator/metrics/tomcat.sessions.created',
   tomcatSessionsExpired = '/actuator/metrics/tomcat.sessions.expired',
   tomcatSessionsActiveCurrent = '/actuator/metrics/tomcat.sessions.active.current',
   tomcatSessionsActiveMax = '/actuator/metrics/tomcat.sessions.active.max',
-  tomcatSessionsRejected = '/actuator/metrics/tomcat.sessions.rejected'
+  tomcatSessionsRejected = '/actuator/metrics/tomcat.sessions.rejected',
 }
 
 /**
@@ -52,7 +51,6 @@ export const getProcessStartTime = () => {
   return defHttp.get({ url: Api.processStartTime }, { isTransformResponse: false });
 };
 
-
 /**
  * 查询应用已运行时间
  */
@@ -81,7 +79,6 @@ export const getJvmMemoryCommitted = () => {
   return defHttp.get({ url: Api.jvmMemoryCommitted }, { isTransformResponse: false });
 };
 
-
 /**
  * JVM 已用内存
  */
@@ -89,7 +86,6 @@ export const getJvmMemoryUsed = () => {
   return defHttp.get({ url: Api.jvmMemoryUsed }, { isTransformResponse: false });
 };
 
-
 /**
  * JVM 缓冲区已用内存
  */
@@ -97,7 +93,6 @@ export const getJvmBufferMemoryUsed = () => {
   return defHttp.get({ url: Api.jvmBufferMemoryUsed }, { isTransformResponse: false });
 };
 
-
 /**
  *JVM 当前缓冲区数量
  */
@@ -112,7 +107,6 @@ export const getJvmThreadsDaemon = () => {
   return defHttp.get({ url: Api.jvmThreadsDaemon }, { isTransformResponse: false });
 };
 
-
 /**
  *JVM 当前活跃线程数量
  */
@@ -120,7 +114,6 @@ export const getJvmThreadsLive = () => {
   return defHttp.get({ url: Api.jvmThreadsLive }, { isTransformResponse: false });
 };
 
-
 /**
  *JVM 峰值线程数量
  */
@@ -135,7 +128,6 @@ export const getJvmClassesLoaded = () => {
   return defHttp.get({ url: Api.jvmClassesLoaded }, { isTransformResponse: false });
 };
 
-
 /**
  *JVM 未加载 Class 数量
  */
@@ -143,7 +135,6 @@ export const getJvmClassesUnloaded = () => {
   return defHttp.get({ url: Api.jvmClassesUnloaded }, { isTransformResponse: false });
 };
 
-
 /**
  **GC 时, 年轻代分配的内存空间
  */
@@ -151,7 +142,6 @@ export const getJvmGcMemoryAllocated = () => {
   return defHttp.get({ url: Api.jvmGcMemoryAllocated }, { isTransformResponse: false });
 };
 
-
 /**
  *GC 时, 老年代分配的内存空间
  */
@@ -159,7 +149,6 @@ export const getJvmGcMemoryPromoted = () => {
   return defHttp.get({ url: Api.jvmGcMemoryPromoted }, { isTransformResponse: false });
 };
 
-
 /**
  *GC 时, 老年代的最大内存空间
  */
@@ -167,7 +156,6 @@ export const getJvmGcMaxDataSize = () => {
   return defHttp.get({ url: Api.jvmGcMaxDataSize }, { isTransformResponse: false });
 };
 
-
 /**
  *FullGC 时, 老年代的内存空间
  */
@@ -182,7 +170,6 @@ export const getJvmGcPause = () => {
   return defHttp.get({ url: Api.jvmGcPause }, { isTransformResponse: false });
 };
 
-
 /**
  *tomcat 已创建 session 数
  */
@@ -190,7 +177,6 @@ export const getTomcatSessionsCreated = () => {
   return defHttp.get({ url: Api.tomcatSessionsCreated }, { isTransformResponse: false });
 };
 
-
 /**
  *tomcat 已过期 session 数
  */
@@ -198,7 +184,6 @@ export const getTomcatSessionsExpired = () => {
   return defHttp.get({ url: Api.tomcatSessionsExpired }, { isTransformResponse: false });
 };
 
-
 /**
  *tomcat 当前活跃 session 数
  */
@@ -206,7 +191,6 @@ export const getTomcatSessionsActiveCurrent = () => {
   return defHttp.get({ url: Api.tomcatSessionsActiveCurrent }, { isTransformResponse: false });
 };
 
-
 /**
  *tomcat 活跃 session 数峰值
  */
@@ -221,7 +205,6 @@ export const getTomcatSessionsRejected = () => {
   return defHttp.get({ url: Api.tomcatSessionsRejected }, { isTransformResponse: false });
 };
 
-
 export const getMoreInfo = (infoType) => {
   if (infoType == '1') {
     return {};
@@ -237,7 +220,6 @@ export const getMoreInfo = (infoType) => {
   }
 };
 
-
 export const getTextInfo = (infoType) => {
   if (infoType == '1') {
     return {
@@ -288,20 +270,13 @@ export const getTextInfo = (infoType) => {
   }
 };
 
-
 /**
  * 查询cpu数量
  * @param params
  */
 export const getServerInfo = (infoType) => {
   if (infoType == '1') {
-    return Promise.all([
-      getCpuCount(),
-      getCpuUsage(),
-      getProcessStartTime(),
-      getProcessUptime(),
-      getProcessCpuUsage(),
-    ]);
+    return Promise.all([getCpuCount(), getCpuUsage(), getProcessStartTime(), getProcessUptime(), getProcessCpuUsage()]);
   }
   if (infoType == '2') {
     return Promise.all([
@@ -323,14 +298,6 @@ export const getServerInfo = (infoType) => {
     ]);
   }
   if (infoType == '3') {
-    return Promise.all([
-      getTomcatSessionsActiveCurrent(),
-      getTomcatSessionsActiveMax(),
-      getTomcatSessionsCreated(),
-      getTomcatSessionsExpired(),
-      getTomcatSessionsRejected(),
-    ]);
+    return Promise.all([getTomcatSessionsActiveCurrent(), getTomcatSessionsActiveMax(), getTomcatSessionsCreated(), getTomcatSessionsExpired(), getTomcatSessionsRejected()]);
   }
-
 };
-
diff --git a/src/views/monitor/trace/index.vue b/src/views/monitor/trace/index.vue
index 0a2d621..f6b8e6f 100644
--- a/src/views/monitor/trace/index.vue
+++ b/src/views/monitor/trace/index.vue
@@ -1,37 +1,37 @@
 <template>
-    <div class="p-4">
-        <BasicTable @register="registerTable" :dataSource="dataSource">
-            <template #tableTitle>
-                <div slot="message">
-                    共追踪到 {{ dataSource.length }} 条近期HTTP请求记录
-                    <a-divider type="vertical"/>
-                    <a @click="loadDate">立即刷新</a>
-                </div>
-            </template>
-            <template #timeTaken="{ record ,text}">
-                <a-tag v-if="text < 500" color="green">{{ text }} ms</a-tag>
-                <a-tag v-else-if="text < 1000" color="cyan">{{ text }} ms</a-tag>
-                <a-tag v-else-if="text < 1500" color="orange">{{ text }} ms</a-tag>
-                <a-tag v-else color="red">{{ text }} ms</a-tag>
-            </template>
+  <div class="p-4">
+    <BasicTable @register="registerTable" :dataSource="dataSource">
+      <template #tableTitle>
+        <div slot="message">
+          共追踪到 {{ dataSource.length }} 条近期HTTP请求记录
+          <a-divider type="vertical" />
+          <a @click="loadDate">立即刷新</a>
+        </div>
+      </template>
+      <template #timeTaken="{ record, text }">
+        <a-tag v-if="text < 500" color="green">{{ text }} ms</a-tag>
+        <a-tag v-else-if="text < 1000" color="cyan">{{ text }} ms</a-tag>
+        <a-tag v-else-if="text < 1500" color="orange">{{ text }} ms</a-tag>
+        <a-tag v-else color="red">{{ text }} ms</a-tag>
+      </template>
 
-            <template #responseStatus="{ record ,text}">
-                <a-tag v-if="text < 200" color="pink">{{ text }}</a-tag>
-                <a-tag v-else-if="text < 201" color="green">{{ text }}</a-tag>
-                <a-tag v-else-if="text < 399" color="cyan">{{ text }}</a-tag>
-                <a-tag v-else-if="text < 403" color="orange">{{ text }}</a-tag>
-                <a-tag v-else-if="text < 501" color="red">{{ text }}</a-tag>
-                <span v-else>{{ text }}</span>
-            </template>
-            <template #requestMethod="{ record ,text}">
-                <a-tag v-if="text === 'GET'" color="#87d068">{{ text }}</a-tag>
-                <a-tag v-else-if="text === 'POST'" color="#2db7f5">{{ text }}</a-tag>
-                <a-tag v-else-if="text === 'PUT'" color="#ffba5a">{{ text }}</a-tag>
-                <a-tag v-else-if="text === 'DELETE'" color="#f50">{{ text }}</a-tag>
-                <span v-else>{{ text }} ms</span>
-            </template>
-        </BasicTable>
-    </div>
+      <template #responseStatus="{ record, text }">
+        <a-tag v-if="text < 200" color="pink">{{ text }}</a-tag>
+        <a-tag v-else-if="text < 201" color="green">{{ text }}</a-tag>
+        <a-tag v-else-if="text < 399" color="cyan">{{ text }}</a-tag>
+        <a-tag v-else-if="text < 403" color="orange">{{ text }}</a-tag>
+        <a-tag v-else-if="text < 501" color="red">{{ text }}</a-tag>
+        <span v-else>{{ text }}</span>
+      </template>
+      <template #requestMethod="{ record, text }">
+        <a-tag v-if="text === 'GET'" color="#87d068">{{ text }}</a-tag>
+        <a-tag v-else-if="text === 'POST'" color="#2db7f5">{{ text }}</a-tag>
+        <a-tag v-else-if="text === 'PUT'" color="#ffba5a">{{ text }}</a-tag>
+        <a-tag v-else-if="text === 'DELETE'" color="#f50">{{ text }}</a-tag>
+        <span v-else>{{ text }} ms</span>
+      </template>
+    </BasicTable>
+  </div>
 </template>
 <script lang="ts" name="monitor-trace" setup>
   import { onMounted, ref, reactive } from 'vue';
@@ -50,7 +50,6 @@
     rowKey: 'id',
   });
 
-
   function loadDate() {
     getActuatorList().then((res) => {
       let filterData = [];
@@ -66,6 +65,4 @@
   onMounted(() => {
     loadDate();
   });
-
-
 </script>
diff --git a/src/views/monitor/trace/trace.api.ts b/src/views/monitor/trace/trace.api.ts
index 14a1e9b..f41b093 100644
--- a/src/views/monitor/trace/trace.api.ts
+++ b/src/views/monitor/trace/trace.api.ts
@@ -1,14 +1,12 @@
 import { defHttp } from '/@/utils/http/axios';
 
 enum Api {
-  actuatorList = '/actuator/httptrace'
+  actuatorList = '/actuator/httptrace',
 }
 
-
 /**
  * 追踪信息
  */
 export const getActuatorList = () => {
-  return defHttp.get({ url: Api.actuatorList },{ isTransformResponse: false });
+  return defHttp.get({ url: Api.actuatorList }, { isTransformResponse: false });
 };
-
diff --git a/src/views/monitor/trace/trace.data.ts b/src/views/monitor/trace/trace.data.ts
index f31054b..13c7747 100644
--- a/src/views/monitor/trace/trace.data.ts
+++ b/src/views/monitor/trace/trace.data.ts
@@ -1,5 +1,5 @@
 import { BasicColumn } from '/@/components/Table';
-import moment from 'moment'
+import moment from 'moment';
 export const columns: BasicColumn[] = [
   {
     title: '请求时间',
@@ -13,23 +13,23 @@ export const columns: BasicColumn[] = [
     title: '请求方法',
     dataIndex: 'request.method',
     width: 20,
-    slots: { customRender: 'requestMethod' }
+    slots: { customRender: 'requestMethod' },
   },
   {
     title: '请求URL',
     dataIndex: 'request.uri',
-    width: 200
+    width: 200,
   },
   {
     title: '响应状态',
     dataIndex: 'response.status',
     width: 50,
-    slots: { customRender: 'responseStatus' }
+    slots: { customRender: 'responseStatus' },
   },
   {
     title: '请求耗时',
     dataIndex: 'timeTaken',
     width: 50,
-    slots: { customRender: 'timeTaken' }
+    slots: { customRender: 'timeTaken' },
   },
 ];
diff --git a/src/views/report/chartdemo/chartdemo.data.ts b/src/views/report/chartdemo/chartdemo.data.ts
index dcafec9..d87e020 100644
--- a/src/views/report/chartdemo/chartdemo.data.ts
+++ b/src/views/report/chartdemo/chartdemo.data.ts
@@ -3,47 +3,47 @@ export const getData = (() => {
   const barDataSource: any[] = [];
   const barMultiData: any[] = [];
   const barLineData: any[] = [];
-  
+
   for (let i = 0; i < 20; i++) {
-    let obj={name:'',value:0};
+    let obj = { name: '', value: 0 };
     const date = new Date((dottedBase += 1000 * 3600 * 24));
     obj.name = [date.getFullYear(), date.getMonth() + 1, date.getDate()].join('-');
     obj.value = Math.random() * 200;
-    barDataSource.push(obj)
+    barDataSource.push(obj);
   }
-  
-  for(let j = 0; j < 2; j++){
-      for (let i = 0; i < 20; i++) {
-          let obj={name:'', value:0, type:2010+j+''};
-          const date = new Date(dottedBase+1000 * 3600 * 24 * i);
-          obj.name = [date.getFullYear(), date.getMonth() + 1, date.getDate()].join('-');
-          obj.value = Math.random() * 200;
-          barMultiData.push(obj)
-      }  
+
+  for (let j = 0; j < 2; j++) {
+    for (let i = 0; i < 20; i++) {
+      let obj = { name: '', value: 0, type: 2010 + j + '' };
+      const date = new Date(dottedBase + 1000 * 3600 * 24 * i);
+      obj.name = [date.getFullYear(), date.getMonth() + 1, date.getDate()].join('-');
+      obj.value = Math.random() * 200;
+      barMultiData.push(obj);
+    }
   }
-  const pieData =  [
+  const pieData = [
     { value: 335, name: '客服电话' },
     { value: 310, name: '奥迪官网' },
     { value: 234, name: '媒体曝光' },
     { value: 135, name: '质检总局' },
-    { value: 105, name: '其他' }
+    { value: 105, name: '其他' },
   ];
-  const radarData =  [
-    { value: 75, name: '政治',type:'文综',max:100 },
-    { value: 65, name: '历史',type:'文综',max:100 },
-    { value: 55, name: '地理',type:'文综',max:100 },
-    { value: 74, name: '化学',type:'文综',max:100 },
-    { value: 38, name: '物理',type:'文综',max:100 },
-    { value: 88, name: '生物',type:'文综',max:100 },
+  const radarData = [
+    { value: 75, name: '政治', type: '文综', max: 100 },
+    { value: 65, name: '历史', type: '文综', max: 100 },
+    { value: 55, name: '地理', type: '文综', max: 100 },
+    { value: 74, name: '化学', type: '文综', max: 100 },
+    { value: 38, name: '物理', type: '文综', max: 100 },
+    { value: 88, name: '生物', type: '文综', max: 100 },
   ];
-  for(let j = 0; j < 2; j++){
+  for (let j = 0; j < 2; j++) {
     for (let i = 0; i < 15; i++) {
-        let obj={name:'', value:0, type:2010+j+'',seriesType:j>=1?'line':'bar'};
-        const date = new Date(dottedBase+1000 * 3600 * 24 * i);
-        obj.name = [date.getFullYear(), date.getMonth() + 1, date.getDate()].join('-');
-        obj.value = Math.random() * 200;
-        barLineData.push(obj)
+      let obj = { name: '', value: 0, type: 2010 + j + '', seriesType: j >= 1 ? 'line' : 'bar' };
+      const date = new Date(dottedBase + 1000 * 3600 * 24 * i);
+      obj.name = [date.getFullYear(), date.getMonth() + 1, date.getDate()].join('-');
+      obj.value = Math.random() * 200;
+      barLineData.push(obj);
     }
   }
-  return { barDataSource, barMultiData,pieData,barLineData,radarData };
+  return { barDataSource, barMultiData, pieData, barLineData, radarData };
 })();
diff --git a/src/views/report/chartdemo/index.vue b/src/views/report/chartdemo/index.vue
index b1152a8..5df2256 100644
--- a/src/views/report/chartdemo/index.vue
+++ b/src/views/report/chartdemo/index.vue
@@ -1,93 +1,93 @@
 <template>
-    <div class="p-4">
-        <a-card :bordered="false" style="height: 100%;">
-            <a-tabs v-model:activeKey="activeKey" @change="tabChange">
-                <a-tab-pane key="1" tab="柱状图">
-                    <a-row>
-                        <a-col :span="24">
-                            <Bar :chartData="barDataSource" height="50vh" :option="{title:{text:'销售额排行', left: 'center'}}"></Bar>
-                        </a-col>
-                       <!-- <a-col :span="7" style="margin-left:50px" >
+  <div class="p-4">
+    <a-card :bordered="false" style="height: 100%">
+      <a-tabs v-model:activeKey="activeKey" @change="tabChange">
+        <a-tab-pane key="1" tab="柱状图">
+          <a-row>
+            <a-col :span="24">
+              <Bar :chartData="barDataSource" height="50vh" :option="{ title: { text: '销售额排行', left: 'center' } }"></Bar>
+            </a-col>
+            <!-- <a-col :span="7" style="margin-left:50px" >
                             配置项：
                             <textarea rows="18" style="width: 500px">{{ barDataSource }}</textarea>
                         </a-col>-->
-                    </a-row>
-                </a-tab-pane>
-                <a-tab-pane key="2" tab="多列柱状图" force-render>
-                    <BarMulti :chartData="barMultiData" :option="multiBarOption" height="50vh"></BarMulti>
-                </a-tab-pane>
-                <a-tab-pane key="3" tab="迷你柱状图"  style="display: flex;justify-content: center;">
-                    <Bar :chartData="barDataSource" width="30%" height="50vh"></Bar>
-                </a-tab-pane>
-                <a-tab-pane key="4" tab="面积图">
-                    <Line :chartData="barDataSource" height="50vh" :option="{title:{text:'销售额排行', left: 'center'}}"></Line>
-                </a-tab-pane>
-                <a-tab-pane key="5" tab="迷你面积图"  style="display: flex;justify-content: center;">
-                    <Line :chartData="barDataSource" width="30%" height="50vh"></Line>
-                </a-tab-pane>
-                <a-tab-pane key="6" tab="多行折线图">
-                    <LineMulti :chartData="barMultiData" height="50vh" :option="multiBarOption" type="line"></LineMulti>
-                </a-tab-pane>
-                <a-tab-pane key="7" tab="饼图">
-                  <pie :chartData="pieData" height="40vh" :option="{title:{text:'基础饼状图', left: 'center'}}"/>
-                </a-tab-pane>
-                <a-tab-pane key="8" tab="雷达图">
-                    <Radar :chartData="radarData" height="50vh"></Radar>
-                </a-tab-pane>
-                <a-tab-pane key="9" tab="仪表盘">
-                    <Gauge :chartData="{name:'出勤率',value:70}" height="50vh"></Gauge>
-                </a-tab-pane>
-                <a-tab-pane key="10" tab="折柱图">
-                    <BarAndLine :chartData="barLineData" height="50vh"></BarAndLine>
-                </a-tab-pane>
-                <a-tab-pane key="11" tab="排名列表">
-                    <RankList title="门店销售排行榜" :list="rankList" style="width: 600px;margin: 0 auto;"></RankList>
-                </a-tab-pane>
-                <a-tab-pane key="13" tab="趋势">
-                    <trend title="Trend" term="Trend：" :percentage="30"/>
-                </a-tab-pane>
-                <!--暂无-->
-               <!-- <a-tab-pane key="14" tab="进度条">
+          </a-row>
+        </a-tab-pane>
+        <a-tab-pane key="2" tab="多列柱状图" force-render>
+          <BarMulti :chartData="barMultiData" :option="multiBarOption" height="50vh"></BarMulti>
+        </a-tab-pane>
+        <a-tab-pane key="3" tab="迷你柱状图" style="display: flex; justify-content: center">
+          <Bar :chartData="barDataSource" width="30%" height="50vh"></Bar>
+        </a-tab-pane>
+        <a-tab-pane key="4" tab="面积图">
+          <Line :chartData="barDataSource" height="50vh" :option="{ title: { text: '销售额排行', left: 'center' } }"></Line>
+        </a-tab-pane>
+        <a-tab-pane key="5" tab="迷你面积图" style="display: flex; justify-content: center">
+          <Line :chartData="barDataSource" width="30%" height="50vh"></Line>
+        </a-tab-pane>
+        <a-tab-pane key="6" tab="多行折线图">
+          <LineMulti :chartData="barMultiData" height="50vh" :option="multiBarOption" type="line"></LineMulti>
+        </a-tab-pane>
+        <a-tab-pane key="7" tab="饼图">
+          <pie :chartData="pieData" height="40vh" :option="{ title: { text: '基础饼状图', left: 'center' } }" />
+        </a-tab-pane>
+        <a-tab-pane key="8" tab="雷达图">
+          <Radar :chartData="radarData" height="50vh"></Radar>
+        </a-tab-pane>
+        <a-tab-pane key="9" tab="仪表盘">
+          <Gauge :chartData="{ name: '出勤率', value: 70 }" height="50vh"></Gauge>
+        </a-tab-pane>
+        <a-tab-pane key="10" tab="折柱图">
+          <BarAndLine :chartData="barLineData" height="50vh"></BarAndLine>
+        </a-tab-pane>
+        <a-tab-pane key="11" tab="排名列表">
+          <RankList title="门店销售排行榜" :list="rankList" style="width: 600px; margin: 0 auto"></RankList>
+        </a-tab-pane>
+        <a-tab-pane key="13" tab="趋势">
+          <trend title="Trend" term="Trend：" :percentage="30" />
+        </a-tab-pane>
+        <!--暂无-->
+        <!-- <a-tab-pane key="14" tab="进度条">
                     <Bar :option="{xAxis:{show:false},yAxis:{show:false}}" :chartData="chartData" width="100px" height="50px"></Bar>
                 </a-tab-pane>-->
-                <!--<a-tab-pane key="15" tab="水波图"></a-tab-pane>-->
-           </a-tabs>
-       </a-card>
-   </div>
+        <!--<a-tab-pane key="15" tab="水波图"></a-tab-pane>-->
+      </a-tabs>
+    </a-card>
+  </div>
 </template>
 
 <script lang="ts" setup>
- import { ref } from 'vue';
- import { getData } from './chartdemo.data.ts';
- import Bar from '/@/components/chart/Bar.vue';
- import BarMulti from '/@/components/chart/BarMulti.vue';
- import Line from '/@/components/chart/Line.vue';
- import LineMulti from '/@/components/chart/LineMulti.vue';
- import Pie from '/@/components/chart/Pie.vue';
- import Radar from '/@/components/chart/Radar.vue';
- import Gauge from '/@/components/chart/Gauge.vue';
- import RankList from '/@/components/chart/RankList.vue';
- import Trend from '/@/components/chart/Trend.vue';
- import BarAndLine from '/@/components/chart/BarAndLine.vue';
+  import { ref } from 'vue';
+  import { getData } from './chartdemo.data.ts';
+  import Bar from '/@/components/chart/Bar.vue';
+  import BarMulti from '/@/components/chart/BarMulti.vue';
+  import Line from '/@/components/chart/Line.vue';
+  import LineMulti from '/@/components/chart/LineMulti.vue';
+  import Pie from '/@/components/chart/Pie.vue';
+  import Radar from '/@/components/chart/Radar.vue';
+  import Gauge from '/@/components/chart/Gauge.vue';
+  import RankList from '/@/components/chart/RankList.vue';
+  import Trend from '/@/components/chart/Trend.vue';
+  import BarAndLine from '/@/components/chart/BarAndLine.vue';
 
- const activeKey = ref('1');
- const { barDataSource,barMultiData,pieData,barLineData,radarData } = getData;
- const multiBarOption = {
-     title:{text:"多列柱状图", left: 'center'}
- };
- const rankList = loadData('name', 'total', 2000, 100, '北京朝阳 ', ' 号店')
- //tab切换
- function tabChange(key) {
-   console.log("切换的key:",key)
- }
- function loadData(x, y, max, min, before = '', after = '月') {
-     let data = []
-     for (let i = 0; i < 12; i += 1) {
-         data.push({
-             [x]: `${before}${i + 1}${after}`,
-             [y]: Math.floor(Math.random() * max) + min
-         })
-     }
-     return data
- }
+  const activeKey = ref('1');
+  const { barDataSource, barMultiData, pieData, barLineData, radarData } = getData;
+  const multiBarOption = {
+    title: { text: '多列柱状图', left: 'center' },
+  };
+  const rankList = loadData('name', 'total', 2000, 100, '北京朝阳 ', ' 号店');
+  //tab切换
+  function tabChange(key) {
+    console.log('切换的key:', key);
+  }
+  function loadData(x, y, max, min, before = '', after = '月') {
+    let data = [];
+    for (let i = 0; i < 12; i += 1) {
+      data.push({
+        [x]: `${before}${i + 1}${after}`,
+        [y]: Math.floor(Math.random() * max) + min,
+      });
+    }
+    return data;
+  }
 </script>
diff --git a/src/views/report/statisticst/index.vue b/src/views/report/statisticst/index.vue
index 34f1351..bfcd5e3 100644
--- a/src/views/report/statisticst/index.vue
+++ b/src/views/report/statisticst/index.vue
@@ -1,138 +1,135 @@
 <template>
-    <div class="p-4">
-        <a-card :bordered="false" style="height: 100%;">
-            <a-tabs v-model:activeKey="activeKey" @change="tabChange">
-                <a-tab-pane key="bar" tab="柱状图">
-                    <a-row>
-                        <a-col :span="10">
-                            <a-radio-group v-model:value="barType" @change="statisticst">
-                                <a-radio-button value="year">按年统计</a-radio-button>
-                                <a-radio-button value="month">按月统计</a-radio-button>
-                                <a-radio-button value="category">按类别统计</a-radio-button>
-                                <a-radio-button value="cabinet">按柜号统计</a-radio-button>
-                            </a-radio-group>
-                        </a-col>
-                    </a-row>
-                    <Bar :chartData="dataSource" height="50vh"></Bar>
-                </a-tab-pane>
-                <a-tab-pane key="pie" tab="饼状图" force-render>
-                    <a-row :gutter="24">
-                        <a-col :span="10">
-                            <a-radio-group v-model:value="pieType" @change="statisticst">
-                                <a-radio-button value="year">按年统计</a-radio-button>
-                                <a-radio-button value="month">按月统计</a-radio-button>
-                                <a-radio-button value="category">按类别统计</a-radio-button>
-                                <a-radio-button value="cabinet">按柜号统计</a-radio-button>
-                            </a-radio-group>
-                        </a-col>
-                        <Pie :chartData="dataSource" height="40vh"></Pie>
-                    </a-row>
-                </a-tab-pane>
-            </a-tabs>
-        </a-card>
-    </div>
+  <div class="p-4">
+    <a-card :bordered="false" style="height: 100%">
+      <a-tabs v-model:activeKey="activeKey" @change="tabChange">
+        <a-tab-pane key="bar" tab="柱状图">
+          <a-row>
+            <a-col :span="10">
+              <a-radio-group v-model:value="barType" @change="statisticst">
+                <a-radio-button value="year">按年统计</a-radio-button>
+                <a-radio-button value="month">按月统计</a-radio-button>
+                <a-radio-button value="category">按类别统计</a-radio-button>
+                <a-radio-button value="cabinet">按柜号统计</a-radio-button>
+              </a-radio-group>
+            </a-col>
+          </a-row>
+          <Bar :chartData="dataSource" height="50vh"></Bar>
+        </a-tab-pane>
+        <a-tab-pane key="pie" tab="饼状图" force-render>
+          <a-row :gutter="24">
+            <a-col :span="10">
+              <a-radio-group v-model:value="pieType" @change="statisticst">
+                <a-radio-button value="year">按年统计</a-radio-button>
+                <a-radio-button value="month">按月统计</a-radio-button>
+                <a-radio-button value="category">按类别统计</a-radio-button>
+                <a-radio-button value="cabinet">按柜号统计</a-radio-button>
+              </a-radio-group>
+            </a-col>
+            <Pie :chartData="dataSource" height="40vh"></Pie>
+          </a-row>
+        </a-tab-pane>
+      </a-tabs>
+    </a-card>
+  </div>
 </template>
 
 <script lang="ts" setup>
-
-  import {defHttp} from '/@/utils/http/axios';
-  import { ref,unref,reactive } from 'vue';
+  import { defHttp } from '/@/utils/http/axios';
+  import { ref, unref, reactive } from 'vue';
   import Bar from '/@/components/chart/Bar.vue';
   import Pie from '/@/components/chart/Pie.vue';
 
-
   const activeKey = ref('bar');
   const barType = ref('year');
   const pieType = ref('year');
   const dataSource = ref([]);
   const url = reactive({
-      getYearCountInfo: "/mock/api/report/getYearCountInfo",
-      getMonthCountInfo:"/mock/api/report/getMonthCountInfo",
-      getCntrNoCountInfo:"/mock/api/report/getCntrNoCountInfo",
-      getCabinetCountInfo:"/mock/api/report/getCabinetCountInfo",
+    getYearCountInfo: '/mock/api/report/getYearCountInfo',
+    getMonthCountInfo: '/mock/api/report/getMonthCountInfo',
+    getCntrNoCountInfo: '/mock/api/report/getCntrNoCountInfo',
+    getCabinetCountInfo: '/mock/api/report/getCabinetCountInfo',
   });
 
-  async function loadDate(url,type,params) {
-      const res =  await defHttp.get({url,params},{isTransformResponse:false ,errorMessageMode:'none'})
-          if(res.success){
-              dataSource.value = [];
-              switch (type) {
-                  case 'year':
-                      getYearCountSource(res.result);
-                      break;
-                  case 'month':
-                      getMonthCountSource(res.result);
-                      break;
-                  case 'category':
-                      getCategoryCountSource(res.result);
-                      break;
-                  case 'cabinet':
-                      getCabinetCountSource(res.result);
-                      break;
-                  default:
-                      break;
-              }
-
-          }
-  }
-  function getYearCountSource(data){
-      for (let i = 0; i < data.length; i++) {
-          dataSource.value.push({
-              name: `${data[i].year}年`,
-              value: data[i].yearcount
-          })
+  async function loadDate(url, type, params) {
+    const res = await defHttp.get({ url, params }, { isTransformResponse: false, errorMessageMode: 'none' });
+    if (res.success) {
+      dataSource.value = [];
+      switch (type) {
+        case 'year':
+          getYearCountSource(res.result);
+          break;
+        case 'month':
+          getMonthCountSource(res.result);
+          break;
+        case 'category':
+          getCategoryCountSource(res.result);
+          break;
+        case 'cabinet':
+          getCabinetCountSource(res.result);
+          break;
+        default:
+          break;
       }
+    }
   }
-  function getMonthCountSource(data){
-      for (let i = 0; i < data.length; i++) {
-          dataSource.value.push({
-              name: `${data[i].month}`,
-              value: data[i].monthcount
-          })
-      }
+  function getYearCountSource(data) {
+    for (let i = 0; i < data.length; i++) {
+      dataSource.value.push({
+        name: `${data[i].year}年`,
+        value: data[i].yearcount,
+      });
+    }
   }
-  function getCategoryCountSource(data){
-      for (let i = 0; i < data.length; i++) {
-          dataSource.value.push({
-              name: `${data[i].classifyname}`,
-              value: data[i].cntrnocount
-          })
-      }
+  function getMonthCountSource(data) {
+    for (let i = 0; i < data.length; i++) {
+      dataSource.value.push({
+        name: `${data[i].month}`,
+        value: data[i].monthcount,
+      });
+    }
   }
-  function getCabinetCountSource(data){
-      for (let i = 0; i < data.length; i++) {
-          dataSource.value.push({
-              name: `${data[i].cabinetname}`,
-              value: data[i].cabinetcocunt
-          })
-      }
+  function getCategoryCountSource(data) {
+    for (let i = 0; i < data.length; i++) {
+      dataSource.value.push({
+        name: `${data[i].classifyname}`,
+        value: data[i].cntrnocount,
+      });
+    }
+  }
+  function getCabinetCountSource(data) {
+    for (let i = 0; i < data.length; i++) {
+      dataSource.value.push({
+        name: `${data[i].cabinetname}`,
+        value: data[i].cabinetcocunt,
+      });
+    }
   }
   // 选择统计类别
   function statisticst(e) {
-      if(unref(activeKey) === "pie"){
-          loadDate(getUrl(unref(pieType)),unref(pieType),{});
-      }else{
-          loadDate(getUrl(unref(barType)),unref(barType),{});
-      }
+    if (unref(activeKey) === 'pie') {
+      loadDate(getUrl(unref(pieType)), unref(pieType), {});
+    } else {
+      loadDate(getUrl(unref(barType)), unref(barType), {});
+    }
   }
 
-  function getUrl(type){
-      if(type === 'year'){
-         return url.getYearCountInfo;
-      }
-      if(type === 'month'){
-         return url.getMonthCountInfo;
-      }
-      if(type === 'category'){
-          return url.getCntrNoCountInfo;
-      }
-      if(type === 'cabinet'){
-          return url.getCabinetCountInfo;
-      }
+  function getUrl(type) {
+    if (type === 'year') {
+      return url.getYearCountInfo;
+    }
+    if (type === 'month') {
+      return url.getMonthCountInfo;
+    }
+    if (type === 'category') {
+      return url.getCntrNoCountInfo;
+    }
+    if (type === 'cabinet') {
+      return url.getCabinetCountInfo;
+    }
   }
   //tab切换
   function tabChange(key) {
-    console.log("切换的key:",key)
+    console.log('切换的key:', key);
   }
-  loadDate(url.getYearCountInfo,'year',{});
+  loadDate(url.getYearCountInfo, 'year', {});
 </script>
diff --git a/src/views/sys/about/index.vue b/src/views/sys/about/index.vue
index 1b2cf37..a8f8d01 100644
--- a/src/views/sys/about/index.vue
+++ b/src/views/sys/about/index.vue
@@ -4,8 +4,7 @@
       <div class="flex justify-between items-center">
         <span class="flex-1">
           <a :href="GITHUB_URL" target="_blank">{{ name }}</a>
-          是一个基于Vue3.0、Vite、 Ant-Design-Vue 、TypeScript
-          的后台解决方案，目标是为中大型项目开发,提供现成的开箱解决方案及丰富的示例,原则上不会限制任何代码用于商用。
+          是一个基于Vue3.0、Vite、 Ant-Design-Vue 、TypeScript 的后台解决方案，目标是为中大型项目开发,提供现成的开箱解决方案及丰富的示例,原则上不会限制任何代码用于商用。
         </span>
       </div>
     </template>
diff --git a/src/views/sys/error-log/data.tsx b/src/views/sys/error-log/data.tsx
index 3ffc2f4..2aef412 100644
--- a/src/views/sys/error-log/data.tsx
+++ b/src/views/sys/error-log/data.tsx
@@ -12,16 +12,7 @@ export function getColumns(): BasicColumn[] {
       title: t('sys.errorLog.tableColumnType'),
       width: 80,
       customRender: ({ text }) => {
-        const color =
-          text === ErrorTypeEnum.VUE
-            ? 'green'
-            : text === ErrorTypeEnum.RESOURCE
-            ? 'cyan'
-            : text === ErrorTypeEnum.PROMISE
-            ? 'blue'
-            : ErrorTypeEnum.AJAX
-            ? 'red'
-            : 'purple';
+        const color = text === ErrorTypeEnum.VUE ? 'green' : text === ErrorTypeEnum.RESOURCE ? 'cyan' : text === ErrorTypeEnum.PROMISE ? 'blue' : ErrorTypeEnum.AJAX ? 'red' : 'purple';
         return <Tag color={color}>{() => text}</Tag>;
       },
     },
diff --git a/src/views/sys/error-log/index.vue b/src/views/sys/error-log/index.vue
index 571bb24..1895524 100644
--- a/src/views/sys/error-log/index.vue
+++ b/src/views/sys/error-log/index.vue
@@ -17,11 +17,7 @@
         </a-button>
       </template>
       <template #action="{ record }">
-        <TableAction
-                :actions="[
-            { label: t('sys.errorLog.tableActionDesc'), onClick: handleDetail.bind(null, record) },
-          ]"
-        />
+        <TableAction :actions="[{ label: t('sys.errorLog.tableActionDesc'), onClick: handleDetail.bind(null, record) }]" />
       </template>
     </BasicTable>
   </div>
@@ -58,15 +54,15 @@
   const [registerModal, { openModal }] = useModal();
 
   watch(
-          () => errorLogStore.getErrorLogInfoList,
-          (list) => {
-            nextTick(() => {
-              setTableData(cloneDeep(list));
-            });
-          },
-          {
-            immediate: true,
-          }
+    () => errorLogStore.getErrorLogInfoList,
+    (list) => {
+      nextTick(() => {
+        setTableData(cloneDeep(list));
+      });
+    },
+    {
+      immediate: true,
+    }
   );
   const { createMessage } = useMessage();
   if (import.meta.env.DEV) {
diff --git a/src/views/sys/exception/Exception.vue b/src/views/sys/exception/Exception.vue
index 7db1002..c3db956 100644
--- a/src/views/sys/exception/Exception.vue
+++ b/src/views/sys/exception/Exception.vue
@@ -1,148 +1,143 @@
 <script lang="tsx">
-    import type { PropType } from 'vue';
-    import { Result, Button } from 'ant-design-vue';
-    import { defineComponent, ref, computed, unref } from 'vue';
-    import { ExceptionEnum } from '/@/enums/exceptionEnum';
-    import notDataSvg from '/@/assets/svg/no-data.svg';
-    import netWorkSvg from '/@/assets/svg/net-error.svg';
-    import { useRoute } from 'vue-router';
-    import { useDesign } from '/@/hooks/web/useDesign';
-    import { useI18n } from '/@/hooks/web/useI18n';
-    import { useGo, useRedo } from '/@/hooks/web/usePage';
-    import { PageEnum } from '/@/enums/pageEnum';
+  import type { PropType } from 'vue';
+  import { Result, Button } from 'ant-design-vue';
+  import { defineComponent, ref, computed, unref } from 'vue';
+  import { ExceptionEnum } from '/@/enums/exceptionEnum';
+  import notDataSvg from '/@/assets/svg/no-data.svg';
+  import netWorkSvg from '/@/assets/svg/net-error.svg';
+  import { useRoute } from 'vue-router';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  import { useGo, useRedo } from '/@/hooks/web/usePage';
+  import { PageEnum } from '/@/enums/pageEnum';
 
-    interface MapValue {
-        title: string;
-        subTitle: string;
-        btnText?: string;
-        icon?: string;
-        handler?: Fn;
-        status?: string;
-    }
+  interface MapValue {
+    title: string;
+    subTitle: string;
+    btnText?: string;
+    icon?: string;
+    handler?: Fn;
+    status?: string;
+  }
 
-    export default defineComponent({
-        name: 'ErrorPage',
-        props: {
-            // 状态码
-            status: {
-                type: Number as PropType<number>,
-                default: ExceptionEnum.PAGE_NOT_FOUND,
-            },
+  export default defineComponent({
+    name: 'ErrorPage',
+    props: {
+      // 状态码
+      status: {
+        type: Number as PropType<number>,
+        default: ExceptionEnum.PAGE_NOT_FOUND,
+      },
 
-            title: {
-                type: String as PropType<string>,
-                default: '',
-            },
+      title: {
+        type: String as PropType<string>,
+        default: '',
+      },
 
-            subTitle: {
-                type: String as PropType<string>,
-                default: '',
-            },
+      subTitle: {
+        type: String as PropType<string>,
+        default: '',
+      },
 
-            full: {
-                type: Boolean as PropType<boolean>,
-                default: false,
-            },
-        },
-        setup(props) {
-            const statusMapRef = ref(new Map<string | number, MapValue>());
+      full: {
+        type: Boolean as PropType<boolean>,
+        default: false,
+      },
+    },
+    setup(props) {
+      const statusMapRef = ref(new Map<string | number, MapValue>());
 
-            const { query } = useRoute();
-            const go = useGo();
-            const redo = useRedo();
-            const { t } = useI18n();
-            const { prefixCls } = useDesign('app-exception-page');
+      const { query } = useRoute();
+      const go = useGo();
+      const redo = useRedo();
+      const { t } = useI18n();
+      const { prefixCls } = useDesign('app-exception-page');
 
-            const getStatus = computed(() => {
-                const { status: routeStatus } = query;
-                const { status } = props;
-                return Number(routeStatus) || status;
-            });
+      const getStatus = computed(() => {
+        const { status: routeStatus } = query;
+        const { status } = props;
+        return Number(routeStatus) || status;
+      });
 
-            const getMapValue = computed((): MapValue => {
-                return unref(statusMapRef).get(unref(getStatus)) as MapValue;
-            });
+      const getMapValue = computed((): MapValue => {
+        return unref(statusMapRef).get(unref(getStatus)) as MapValue;
+      });
 
-            const backLoginI18n = t('sys.exception.backLogin');
-            const backHomeI18n = t('sys.exception.backHome');
+      const backLoginI18n = t('sys.exception.backLogin');
+      const backHomeI18n = t('sys.exception.backHome');
 
-            unref(statusMapRef).set(ExceptionEnum.PAGE_NOT_ACCESS, {
-                title: '403',
-                status: `${ExceptionEnum.PAGE_NOT_ACCESS}`,
-                subTitle: t('sys.exception.subTitle403'),
-                btnText: props.full ? backLoginI18n : backHomeI18n,
-                handler: () => (props.full ? go(PageEnum.BASE_LOGIN) : go()),
-            });
+      unref(statusMapRef).set(ExceptionEnum.PAGE_NOT_ACCESS, {
+        title: '403',
+        status: `${ExceptionEnum.PAGE_NOT_ACCESS}`,
+        subTitle: t('sys.exception.subTitle403'),
+        btnText: props.full ? backLoginI18n : backHomeI18n,
+        handler: () => (props.full ? go(PageEnum.BASE_LOGIN) : go()),
+      });
 
-            unref(statusMapRef).set(ExceptionEnum.PAGE_NOT_FOUND, {
-                title: '404',
-                status: `${ExceptionEnum.PAGE_NOT_FOUND}`,
-                subTitle: t('sys.exception.subTitle404'),
-                btnText: props.full ? backLoginI18n : backHomeI18n,
-                handler: () => (props.full ? go(PageEnum.BASE_LOGIN) : go()),
-            });
+      unref(statusMapRef).set(ExceptionEnum.PAGE_NOT_FOUND, {
+        title: '404',
+        status: `${ExceptionEnum.PAGE_NOT_FOUND}`,
+        subTitle: t('sys.exception.subTitle404'),
+        btnText: props.full ? backLoginI18n : backHomeI18n,
+        handler: () => (props.full ? go(PageEnum.BASE_LOGIN) : go()),
+      });
 
-            unref(statusMapRef).set(ExceptionEnum.ERROR, {
-                title: '500',
-                status: `${ExceptionEnum.ERROR}`,
-                subTitle: t('sys.exception.subTitle500'),
-                btnText: backHomeI18n,
-                handler: () => go(),
-            });
+      unref(statusMapRef).set(ExceptionEnum.ERROR, {
+        title: '500',
+        status: `${ExceptionEnum.ERROR}`,
+        subTitle: t('sys.exception.subTitle500'),
+        btnText: backHomeI18n,
+        handler: () => go(),
+      });
 
-            unref(statusMapRef).set(ExceptionEnum.PAGE_NOT_DATA, {
-                title: t('sys.exception.noDataTitle'),
-                subTitle: '',
-                btnText: t('common.redo'),
-                handler: () => redo(),
-                icon: notDataSvg,
-            });
+      unref(statusMapRef).set(ExceptionEnum.PAGE_NOT_DATA, {
+        title: t('sys.exception.noDataTitle'),
+        subTitle: '',
+        btnText: t('common.redo'),
+        handler: () => redo(),
+        icon: notDataSvg,
+      });
 
-            unref(statusMapRef).set(ExceptionEnum.NET_WORK_ERROR, {
-                title: t('sys.exception.networkErrorTitle'),
-                subTitle: t('sys.exception.networkErrorSubTitle'),
-                btnText: t('common.redo'),
-                handler: () => redo(),
-                icon: netWorkSvg,
-            });
+      unref(statusMapRef).set(ExceptionEnum.NET_WORK_ERROR, {
+        title: t('sys.exception.networkErrorTitle'),
+        subTitle: t('sys.exception.networkErrorSubTitle'),
+        btnText: t('common.redo'),
+        handler: () => redo(),
+        icon: netWorkSvg,
+      });
 
-            return () => {
-                const { title, subTitle, btnText, icon, handler, status } = unref(getMapValue) || {};
-                return (
-                    <Result
-                        class={prefixCls}
-                        status={status as any}
-                        title={props.title || title}
-                        sub-title={props.subTitle || subTitle}
-                    >
-                        {{
-                            extra: () =>
-                                btnText && (
-                                    <Button type="primary" onClick={handler}>
-                                        {() => btnText}
-                                    </Button>
-                                ),
-                            icon: () => (icon ? <img src={icon} /> : null),
-                        }}
-                    </Result>
-                );
-            };
-        },
-    });
+      return () => {
+        const { title, subTitle, btnText, icon, handler, status } = unref(getMapValue) || {};
+        return (
+          <Result class={prefixCls} status={status as any} title={props.title || title} sub-title={props.subTitle || subTitle}>
+            {{
+              extra: () =>
+                btnText && (
+                  <Button type="primary" onClick={handler}>
+                    {() => btnText}
+                  </Button>
+                ),
+              icon: () => (icon ? <img src={icon} /> : null),
+            }}
+          </Result>
+        );
+      };
+    },
+  });
 </script>
 <style lang="less">
-    @prefix-cls: ~'@{namespace}-app-exception-page';
+  @prefix-cls: ~'@{namespace}-app-exception-page';
 
-    .@{prefix-cls} {
-        display: flex;
-        align-items: center;
-        flex-direction: column;
+  .@{prefix-cls} {
+    display: flex;
+    align-items: center;
+    flex-direction: column;
 
-        .ant-result-icon {
-            img {
-                max-width: 400px;
-                max-height: 300px;
-            }
-        }
+    .ant-result-icon {
+      img {
+        max-width: 400px;
+        max-height: 300px;
+      }
     }
+  }
 </style>
diff --git a/src/views/sys/exception/NetworkErrorException.vue b/src/views/sys/exception/NetworkErrorException.vue
index f9492a1..e4ce2b9 100644
--- a/src/views/sys/exception/NetworkErrorException.vue
+++ b/src/views/sys/exception/NetworkErrorException.vue
@@ -1,11 +1,11 @@
 <template>
-  <Exception :status="status"/>
+  <Exception :status="status" />
 </template>
 
 <script lang="ts" setup>
-import { ref } from 'vue'
-import { Exception } from '/@/views/sys/exception/index'
-import { ExceptionEnum } from '/@/enums/exceptionEnum'
+  import { ref } from 'vue';
+  import { Exception } from '/@/views/sys/exception/index';
+  import { ExceptionEnum } from '/@/enums/exceptionEnum';
 
-const status = ref(ExceptionEnum.NET_WORK_ERROR)
-</script>
\ No newline at end of file
+  const status = ref(ExceptionEnum.NET_WORK_ERROR);
+</script>
diff --git a/src/views/sys/exception/NotAccessException.vue b/src/views/sys/exception/NotAccessException.vue
index 4d9f9f7..a5b2a5f 100644
--- a/src/views/sys/exception/NotAccessException.vue
+++ b/src/views/sys/exception/NotAccessException.vue
@@ -1,11 +1,11 @@
 <template>
-  <Exception :status="status"/>
+  <Exception :status="status" />
 </template>
 
 <script lang="ts" setup>
-import { ref } from 'vue'
-import { Exception } from '/@/views/sys/exception/index'
-import { ExceptionEnum } from '/@/enums/exceptionEnum'
+  import { ref } from 'vue';
+  import { Exception } from '/@/views/sys/exception/index';
+  import { ExceptionEnum } from '/@/enums/exceptionEnum';
 
-const status = ref(ExceptionEnum.PAGE_NOT_ACCESS)
-</script>
\ No newline at end of file
+  const status = ref(ExceptionEnum.PAGE_NOT_ACCESS);
+</script>
diff --git a/src/views/sys/exception/NotDataErrorException.vue b/src/views/sys/exception/NotDataErrorException.vue
index e799b68..9a09dd0 100644
--- a/src/views/sys/exception/NotDataErrorException.vue
+++ b/src/views/sys/exception/NotDataErrorException.vue
@@ -1,11 +1,11 @@
 <template>
-  <Exception :status="status"/>
+  <Exception :status="status" />
 </template>
 
 <script lang="ts" setup>
-import { ref } from 'vue'
-import { Exception } from '/@/views/sys/exception/index'
-import { ExceptionEnum } from '/@/enums/exceptionEnum'
+  import { ref } from 'vue';
+  import { Exception } from '/@/views/sys/exception/index';
+  import { ExceptionEnum } from '/@/enums/exceptionEnum';
 
-const status = ref(ExceptionEnum.PAGE_NOT_DATA)
-</script>
\ No newline at end of file
+  const status = ref(ExceptionEnum.PAGE_NOT_DATA);
+</script>
diff --git a/src/views/sys/exception/ServerErrorException.vue b/src/views/sys/exception/ServerErrorException.vue
index fafd127..9742f55 100644
--- a/src/views/sys/exception/ServerErrorException.vue
+++ b/src/views/sys/exception/ServerErrorException.vue
@@ -1,11 +1,11 @@
 <template>
-  <Exception :status="status"/>
+  <Exception :status="status" />
 </template>
 
 <script lang="ts" setup>
-import { ref } from 'vue'
-import { Exception } from '/@/views/sys/exception/index'
-import { ExceptionEnum } from '/@/enums/exceptionEnum'
+  import { ref } from 'vue';
+  import { Exception } from '/@/views/sys/exception/index';
+  import { ExceptionEnum } from '/@/enums/exceptionEnum';
 
-const status = ref(ExceptionEnum.ERROR)
-</script>
\ No newline at end of file
+  const status = ref(ExceptionEnum.ERROR);
+</script>
diff --git a/src/views/sys/forget-password/step1.vue b/src/views/sys/forget-password/step1.vue
index f5e0d6f..7a7892f 100644
--- a/src/views/sys/forget-password/step1.vue
+++ b/src/views/sys/forget-password/step1.vue
@@ -1,36 +1,29 @@
 <template>
-    <Form class="p-4 enter-x" :model="formData" :rules="getFormRules" ref="formRef">
-      <FormItem name="mobile" class="enter-x">
-        <Input size="large" v-model:value="formData.mobile" :placeholder="t('sys.login.mobile')" />
-      </FormItem>
-      <FormItem name="sms" class="enter-x">
-        <CountdownInput
-          size="large"
-          v-model:value="formData.sms"
-          :placeholder="t('sys.login.smsCode')"
-          :sendCodeApi="sendCodeApi"
-        />
-      </FormItem>
-      <FormItem class="enter-x">
-        <Button type="primary" size="large" block @click="handleNext" :loading="loading">
-          下一步
-        </Button>
-        <Button size="large" block class="mt-4" @click="handleBackLogin">
-          {{ t('sys.login.backSignIn') }}
-        </Button>
-      </FormItem>
-    </Form>
+  <Form class="p-4 enter-x" :model="formData" :rules="getFormRules" ref="formRef">
+    <FormItem name="mobile" class="enter-x">
+      <Input size="large" v-model:value="formData.mobile" :placeholder="t('sys.login.mobile')" />
+    </FormItem>
+    <FormItem name="sms" class="enter-x">
+      <CountdownInput size="large" v-model:value="formData.sms" :placeholder="t('sys.login.smsCode')" :sendCodeApi="sendCodeApi" />
+    </FormItem>
+    <FormItem class="enter-x">
+      <Button type="primary" size="large" block @click="handleNext" :loading="loading"> 下一步 </Button>
+      <Button size="large" block class="mt-4" @click="handleBackLogin">
+        {{ t('sys.login.backSignIn') }}
+      </Button>
+    </FormItem>
+  </Form>
 </template>
 <script lang="ts">
-  import { defineComponent, reactive, ref, computed, unref,toRaw } from 'vue';
+  import { defineComponent, reactive, ref, computed, unref, toRaw } from 'vue';
 
   import { Form, Input, Button, steps } from 'ant-design-vue';
   import { CountdownInput } from '/@/components/CountDown';
 
   import { useI18n } from '/@/hooks/web/useI18n';
   import { useMessage } from '/@/hooks/web/useMessage';
-  import { useLoginState, useFormRules, useFormValid, LoginStateEnum, SmsEnum} from '../login/useLogin';
-  import { phoneVerify,getCaptcha } from '/@/api/sys/user';
+  import { useLoginState, useFormRules, useFormValid, LoginStateEnum, SmsEnum } from '../login/useLogin';
+  import { phoneVerify, getCaptcha } from '/@/api/sys/user';
 
   export default defineComponent({
     name: 'step1',
@@ -66,27 +59,27 @@
         const resultInfo = await phoneVerify(
           toRaw({
             phone: data.mobile,
-            smscode: data.sms
+            smscode: data.sms,
           })
         );
-        if(resultInfo.success){
+        if (resultInfo.success) {
           let accountInfo = {
             username: resultInfo.result.username,
             phone: data.mobile,
-            smscode: resultInfo.result.smscode
+            smscode: resultInfo.result.smscode,
           };
-          emit('nextStep',accountInfo)
-        }else{
+          emit('nextStep', accountInfo);
+        } else {
           notification.error({
             message: t('sys.api.errorTip'),
-            description:  resultInfo.message || t('sys.api.networkExceptionMsg'),
+            description: resultInfo.message || t('sys.api.networkExceptionMsg'),
             duration: 3,
           });
         }
       }
       //倒计时执行前的函数
       function sendCodeApi() {
-        return getCaptcha({mobile:formData.mobile,smsmode:SmsEnum.FORGET_PASSWORD});
+        return getCaptcha({ mobile: formData.mobile, smsmode: SmsEnum.FORGET_PASSWORD });
       }
       return {
         t,
@@ -96,7 +89,7 @@
         handleNext,
         loading,
         handleBackLogin,
-        sendCodeApi
+        sendCodeApi,
       };
     },
   });
diff --git a/src/views/sys/forget-password/step2.vue b/src/views/sys/forget-password/step2.vue
index 689efe5..b81d49e 100644
--- a/src/views/sys/forget-password/step2.vue
+++ b/src/views/sys/forget-password/step2.vue
@@ -1,27 +1,22 @@
 <template>
-    <Form class="p-4 enter-x" :model="formData" :rules="getFormRules" ref="formRef">
+  <Form class="p-4 enter-x" :model="formData" :rules="getFormRules" ref="formRef">
+    <FormItem name="username" class="enter-x">
+      <Input size="large" v-model:value="formData.username" :placeholder="t('sys.login.userName')" disabled />
+    </FormItem>
 
-      <FormItem name="username" class="enter-x">
-        <Input size="large" v-model:value="formData.username" :placeholder="t('sys.login.userName')" disabled/>
-      </FormItem>
+    <FormItem name="password" class="enter-x">
+      <StrengthMeter size="large" v-model:value="formData.password" :placeholder="t('sys.login.password')" />
+    </FormItem>
 
-      <FormItem name="password" class="enter-x">
-        <StrengthMeter size="large" v-model:value="formData.password" :placeholder="t('sys.login.password')"/>
-      </FormItem>
-      
-      <FormItem name="confirmPassword" class="enter-x">
-        <InputPassword size="large" visibilityToggle v-model:value="formData.confirmPassword" :placeholder="t('sys.login.confirmPassword')"/>
-      </FormItem>
+    <FormItem name="confirmPassword" class="enter-x">
+      <InputPassword size="large" visibilityToggle v-model:value="formData.confirmPassword" :placeholder="t('sys.login.confirmPassword')" />
+    </FormItem>
 
-      <FormItem class="enter-x">
-        <Button type="primary" size="large" block @click="handlePrev">
-          上一步
-        </Button>
-        <Button size="large" block class="mt-4" @click="handleNext">
-          下一步
-        </Button>
-      </FormItem>
-    </Form>
+    <FormItem class="enter-x">
+      <Button type="primary" size="large" block @click="handlePrev"> 上一步 </Button>
+      <Button size="large" block class="mt-4" @click="handleNext"> 下一步 </Button>
+    </FormItem>
+  </Form>
 </template>
 <script lang="ts">
   import { defineComponent, reactive, ref, computed, unref, toRaw, toRefs } from 'vue';
@@ -40,7 +35,7 @@
       FormItem: Form.Item,
       InputPassword: Input.Password,
       Input,
-      StrengthMeter
+      StrengthMeter,
     },
     props: {
       accountInfo: {
@@ -48,7 +43,7 @@
         default: () => ({}),
       },
     },
-    emits: ['prevStep','nextStep'],
+    emits: ['prevStep', 'nextStep'],
     setup(props, { emit }) {
       const { t } = useI18n();
       const { createErrorModal } = useMessage();
@@ -56,17 +51,17 @@
       const formRef = ref();
       const formData = reactive({
         username: accountInfo.obj.username || '',
-        password:'',
-        confirmPassword:''
+        password: '',
+        confirmPassword: '',
       });
-      const {getFormRules} = useFormRules(formData);
-      const {validForm} = useFormValid(formRef);
-      
+      const { getFormRules } = useFormRules(formData);
+      const { validForm } = useFormValid(formRef);
+
       /**
        * 上一步
        */
       function handlePrev() {
-        emit('prevStep',accountInfo.obj)
+        emit('prevStep', accountInfo.obj);
       }
 
       /**
@@ -76,17 +71,17 @@
         const data = await validForm();
         if (!data) return;
         const resultInfo = await passwordChange(
-           toRaw({
-             username: data.username,
-             password: data.password,
-             smscode: accountInfo.obj.smscode,
-             phone: accountInfo.obj.phone,
-           })
-         );
-        if(resultInfo.success){ 
+          toRaw({
+            username: data.username,
+            password: data.password,
+            smscode: accountInfo.obj.smscode,
+            phone: accountInfo.obj.phone,
+          })
+        );
+        if (resultInfo.success) {
           //修改密码
-          emit('nextStep', accountInfo.obj)
-        }else{
+          emit('nextStep', accountInfo.obj);
+        } else {
           //错误提示
           createErrorModal({
             title: t('sys.api.errorTip'),
@@ -94,7 +89,7 @@
           });
         }
       }
-     
+
       return {
         t,
         formRef,
diff --git a/src/views/sys/forget-password/step3.vue b/src/views/sys/forget-password/step3.vue
index 8b041a7..77ab02b 100644
--- a/src/views/sys/forget-password/step3.vue
+++ b/src/views/sys/forget-password/step3.vue
@@ -1,17 +1,12 @@
 <template>
-  <Result
-      status="success"
-      title="更改密码成功"
-      :sub-title="getSubTitle"
-    >
-      <template #extra>
-        <a-button key="console" type="primary" @click="finish"> 返回登录 </a-button>
-      </template>
-    </Result>
+  <Result status="success" title="更改密码成功" :sub-title="getSubTitle">
+    <template #extra>
+      <a-button key="console" type="primary" @click="finish"> 返回登录 </a-button>
+    </template>
+  </Result>
 </template>
 <script lang="ts">
-
-  import { defineComponent, ref, computed, unref, onMounted,watchEffect,watch } from 'vue';
+  import { defineComponent, ref, computed, unref, onMounted, watchEffect, watch } from 'vue';
   import { Form, Input, Button, Result } from 'ant-design-vue';
   import { useI18n } from '/@/hooks/web/useI18n';
   import { useLoginState } from '../login/useLogin';
@@ -23,7 +18,7 @@
     components: {
       Button,
       Form,
-      FormItem : Form.Item,
+      FormItem: Form.Item,
       Input,
       Result,
     },
@@ -40,7 +35,7 @@
       const { accountInfo } = props;
       const { handleBackLogin } = useLoginState();
 
-      const { currentCount,start } = useCountdown(props.count);
+      const { currentCount, start } = useCountdown(props.count);
       const getSubTitle = computed(() => {
         return t('sys.login.subTitleText', [unref(currentCount)]);
       });
@@ -48,7 +43,7 @@
        * 倒计时
        */
       watchEffect(() => {
-        if(unref(currentCount) === 1){
+        if (unref(currentCount) === 1) {
           setTimeout(() => {
             finish();
           }, 500);
@@ -59,8 +54,8 @@
        * 结束回调
        */
       function finish() {
-        handleBackLogin()
-        emit('finish')
+        handleBackLogin();
+        emit('finish');
       }
 
       onMounted(() => {
@@ -69,7 +64,7 @@
 
       return {
         getSubTitle,
-        finish
+        finish,
       };
     },
   });
diff --git a/src/views/sys/iframe/index.vue b/src/views/sys/iframe/index.vue
index 94566d8..e73bef3 100644
--- a/src/views/sys/iframe/index.vue
+++ b/src/views/sys/iframe/index.vue
@@ -1,90 +1,85 @@
 <template>
-    <div :class="prefixCls" :style="getWrapStyle">
-        <Spin :spinning="loading" size="large" :style="getWrapStyle">
-            <iframe
-                    :src="frameSrc"
-                    :class="`${prefixCls}__main`"
-                    ref="frameRef"
-                    @load="hideLoading"
-            ></iframe>
-        </Spin>
-    </div>
+  <div :class="prefixCls" :style="getWrapStyle">
+    <Spin :spinning="loading" size="large" :style="getWrapStyle">
+      <iframe :src="frameSrc" :class="`${prefixCls}__main`" ref="frameRef" @load="hideLoading"></iframe>
+    </Spin>
+  </div>
 </template>
 <script lang="ts" setup>
-    import type { CSSProperties } from 'vue';
-    import { ref, unref, computed } from 'vue';
-    import { Spin } from 'ant-design-vue';
-    import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn';
-    import { propTypes } from '/@/utils/propTypes';
-    import { useDesign } from '/@/hooks/web/useDesign';
-    import { useLayoutHeight } from '/@/layouts/default/content/useContentViewHeight';
+  import type { CSSProperties } from 'vue';
+  import { ref, unref, computed } from 'vue';
+  import { Spin } from 'ant-design-vue';
+  import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn';
+  import { propTypes } from '/@/utils/propTypes';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useLayoutHeight } from '/@/layouts/default/content/useContentViewHeight';
 
-    defineProps({
-        frameSrc: propTypes.string.def(''),
-    });
+  defineProps({
+    frameSrc: propTypes.string.def(''),
+  });
 
-    const loading = ref(true);
-    const topRef = ref(50);
-    const heightRef = ref(window.innerHeight);
-    const frameRef = ref<HTMLFrameElement>();
-    const { headerHeightRef } = useLayoutHeight();
+  const loading = ref(true);
+  const topRef = ref(50);
+  const heightRef = ref(window.innerHeight);
+  const frameRef = ref<HTMLFrameElement>();
+  const { headerHeightRef } = useLayoutHeight();
 
-    const { prefixCls } = useDesign('iframe-page');
-    useWindowSizeFn(calcHeight, 150, { immediate: true });
+  const { prefixCls } = useDesign('iframe-page');
+  useWindowSizeFn(calcHeight, 150, { immediate: true });
 
-    const getWrapStyle = computed((): CSSProperties => {
-        return {
-            height: `${unref(heightRef)}px`,
-        };
-    });
+  const getWrapStyle = computed((): CSSProperties => {
+    return {
+      height: `${unref(heightRef)}px`,
+    };
+  });
 
-    function calcHeight() {
-        const iframe = unref(frameRef);
-        if (!iframe) {
-            return;
-        }
-        const top = headerHeightRef.value;
-        topRef.value = top;
-        heightRef.value = window.innerHeight - top;
-        const clientHeight = document.documentElement.clientHeight - top;
-        iframe.style.height = `${clientHeight}px`;
+  function calcHeight() {
+    const iframe = unref(frameRef);
+    if (!iframe) {
+      return;
     }
+    const top = headerHeightRef.value;
+    topRef.value = top;
+    heightRef.value = window.innerHeight - top;
+    const clientHeight = document.documentElement.clientHeight - top;
+    iframe.style.height = `${clientHeight}px`;
+  }
 
-    function hideLoading() {
-        loading.value = false;
-        calcHeight();
-    }
+  function hideLoading() {
+    loading.value = false;
+    calcHeight();
+  }
 </script>
 <style lang="less" scoped>
-    @prefix-cls: ~'@{namespace}-iframe-page';
+  @prefix-cls: ~'@{namespace}-iframe-page';
 
-    .@{prefix-cls} {
-        .ant-spin-nested-loading {
-            position: relative;
-            height: 100%;
+  .@{prefix-cls} {
+    .ant-spin-nested-loading {
+      position: relative;
+      height: 100%;
 
-            .ant-spin-container {
-                width: 100%;
-                height: 100%;
-                padding: 10px;
-            }
-        }
-
-        &__mask {
-            position: absolute;
-            top: 0;
-            left: 0;
-            width: 100%;
-            height: 100%;
-        }
-
-        &__main {
-            width: 100%;
-            height: 100%;
-            overflow: hidden;
-            background-color: @component-background;
-            border: 0;
-            box-sizing: border-box;
-        }
+      .ant-spin-container {
+        width: 100%;
+        height: 100%;
+        padding: 10px;
+      }
     }
+
+    &__mask {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+    }
+
+    &__main {
+      width: 100%;
+      height: 100%;
+      overflow: hidden;
+      background-color: @component-background;
+      border: 0;
+      box-sizing: border-box;
+    }
+  }
 </style>
diff --git a/src/views/sys/lock/LockPage.vue b/src/views/sys/lock/LockPage.vue
index a887566..76262c3 100644
--- a/src/views/sys/lock/LockPage.vue
+++ b/src/views/sys/lock/LockPage.vue
@@ -1,29 +1,10 @@
 <template>
-  <div
-          :class="prefixCls"
-          class="fixed inset-0 flex h-screen w-screen bg-black items-center justify-center"
-  >
+  <div :class="prefixCls" class="fixed inset-0 flex h-screen w-screen bg-black items-center justify-center">
     <div
-            :class="`${prefixCls}__unlock`"
-            class="
-        absolute
-        top-0
-        left-1/2
-        flex
-        pt-5
-        h-16
-        items-center
-        justify-center
-        sm:text-md
-        xl:text-xl
-        text-white
-        flex-col
-        cursor-pointer
-        transform
-        translate-x-1/2
-      "
-            @click="handleShowForm(false)"
-            v-show="showDate"
+      :class="`${prefixCls}__unlock`"
+      class="absolute top-0 left-1/2 flex pt-5 h-16 items-center justify-center sm:text-md xl:text-xl text-white flex-col cursor-pointer transform translate-x-1/2"
+      @click="handleShowForm(false)"
+      v-show="showDate"
     >
       <LockOutlined />
       <span>{{ t('sys.lock.unlock') }}</span>
@@ -49,31 +30,15 @@
               {{ userinfo.realname }}
             </p>
           </div>
-          <InputPassword
-                  :placeholder="t('sys.lock.placeholder')"
-                  class="enter-x"
-                  v-model:value="password"
-          />
+          <InputPassword :placeholder="t('sys.lock.placeholder')" class="enter-x" v-model:value="password" />
           <span :class="`${prefixCls}-entry__err-msg enter-x`" v-if="errMsg">
             {{ t('sys.lock.alert') }}
           </span>
           <div :class="`${prefixCls}-entry__footer enter-x`">
-            <a-button
-                    type="link"
-                    size="small"
-                    class="mt-2 mr-2 enter-x"
-                    :disabled="loading"
-                    @click="handleShowForm(true)"
-            >
+            <a-button type="link" size="small" class="mt-2 mr-2 enter-x" :disabled="loading" @click="handleShowForm(true)">
               {{ t('common.back') }}
             </a-button>
-            <a-button
-                    type="link"
-                    size="small"
-                    class="mt-2 mr-2 enter-x"
-                    :disabled="loading"
-                    @click="goLogin"
-            >
+            <a-button type="link" size="small" class="mt-2 mr-2 enter-x" :disabled="loading" @click="goLogin">
               {{ t('sys.lock.backToLogin') }}
             </a-button>
             <a-button class="mt-2" type="link" size="small" @click="unLock()" :loading="loading">
diff --git a/src/views/sys/login/ForgetPasswordForm.vue b/src/views/sys/login/ForgetPasswordForm.vue
index 4d951ec..4f2d152 100644
--- a/src/views/sys/login/ForgetPasswordForm.vue
+++ b/src/views/sys/login/ForgetPasswordForm.vue
@@ -1,16 +1,16 @@
 <template>
   <template v-if="getShow">
     <!--节点-->
-    <a-steps style="margin-bottom:20px" :current="currentTab">
-      <a-step title="手机验证"/>
-      <a-step title="更改密码"/>
-      <a-step title="完成"/>
+    <a-steps style="margin-bottom: 20px" :current="currentTab">
+      <a-step title="手机验证" />
+      <a-step title="更改密码" />
+      <a-step title="完成" />
     </a-steps>
     <!--组件-->
     <div>
-      <step1 v-if="currentTab === 0" @nextStep="nextStep"/>
-      <step2 v-if="currentTab === 1" @nextStep="nextStep" @prevStep="prevStep" :accountInfo="accountInfo"/>
-      <step3 v-if="currentTab === 2" @prevStep="prevStep" @finish="finish"/>
+      <step1 v-if="currentTab === 0" @nextStep="nextStep" />
+      <step2 v-if="currentTab === 1" @nextStep="nextStep" @prevStep="prevStep" :accountInfo="accountInfo" />
+      <step3 v-if="currentTab === 2" @prevStep="prevStep" @finish="finish" />
     </div>
   </template>
 </template>
@@ -33,11 +33,11 @@
   });
   const getShow = computed(() => unref(getLoginState) === LoginStateEnum.RESET_PASSWORD);
   const accountInfo = reactive({
-    obj:{
-      username:'',
+    obj: {
+      username: '',
       phone: '',
-      smscode: ''
-    }
+      smscode: '',
+    },
   });
   /**
    * 下一步
@@ -46,7 +46,7 @@
   function nextStep(data) {
     accountInfo.obj = data;
     if (currentTab.value < 4) {
-      currentTab.value += 1
+      currentTab.value += 1;
     }
   }
   /**
@@ -55,14 +55,14 @@
    */
   function prevStep(data) {
     accountInfo.obj = data;
-    if ( currentTab.value > 0) {
-      currentTab.value -= 1
+    if (currentTab.value > 0) {
+      currentTab.value -= 1;
     }
   }
   /**
    * 结束
    */
   function finish() {
-    currentTab.value = 0
+    currentTab.value = 0;
   }
 </script>
diff --git a/src/views/sys/login/Login.vue b/src/views/sys/login/Login.vue
index 2187319..59304c4 100644
--- a/src/views/sys/login/Login.vue
+++ b/src/views/sys/login/Login.vue
@@ -1,205 +1,208 @@
 <template>
-    <div :class="prefixCls" class="relative w-full h-full px-4">
-        <AppLocalePicker class="absolute text-white top-4 right-4 enter-x xl:text-gray-600" :showText="false" v-if="!sessionTimeout && showLocale"/>
-        <AppDarkModeToggle class="absolute top-3 right-7 enter-x" v-if="!sessionTimeout"/>
-        <span class="-enter-x xl:hidden">
-        <AppLogo :alwaysShowTitle="true"/>
+  <div :class="prefixCls" class="relative w-full h-full px-4">
+    <AppLocalePicker class="absolute text-white top-4 right-4 enter-x xl:text-gray-600" :showText="false" v-if="!sessionTimeout && showLocale" />
+    <AppDarkModeToggle class="absolute top-3 right-7 enter-x" v-if="!sessionTimeout" />
+    <span class="-enter-x xl:hidden">
+      <AppLogo :alwaysShowTitle="true" />
     </span>
 
-        <div class="container relative h-full py-2 mx-auto sm:px-10">
-            <div class="flex h-full">
-                <div class="hidden min-h-full pl-4 mr-4 xl:flex xl:flex-col xl:w-6/12">
-                    <AppLogo class="-enter-x"/>
-                    <div class="my-auto">
-                        <img :alt="title" src="../../../assets/svg/login-box-bg.svg" class="w-1/2 -mt-16 -enter-x"/>
-                        <div class="mt-10 font-medium text-white -enter-x" >
-                            <span class="inline-block mt-4 text-3xl"> {{ t('sys.login.signInTitle') }}</span>
-                        </div>
-                        <div class="mt-5 font-normal text-white text-md dark:text-gray-500 -enter-x">
-                            {{ t('sys.login.signInDesc') }}
-                        </div>
-                    </div>
-                </div>
-                <div class="flex w-full h-full py-5 xl:h-auto xl:py-0 xl:my-0 xl:w-6/12">
-                    <div :class="`${prefixCls}-form`" class="relative w-full px-5 py-8 mx-auto my-auto rounded-md shadow-md xl:ml-16 xl:bg-transparent sm:px-8 xl:p-4 xl:shadow-none sm:w-3/4 lg:w-2/4 xl:w-auto enter-x">
-                        <LoginForm/>
-                        <ForgetPasswordForm/>
-                        <RegisterForm/>
-                        <MobileForm/>
-                        <QrCodeForm/>
-                    </div>
-                </div>
+    <div class="container relative h-full py-2 mx-auto sm:px-10">
+      <div class="flex h-full">
+        <div class="hidden min-h-full pl-4 mr-4 xl:flex xl:flex-col xl:w-6/12">
+          <AppLogo class="-enter-x" />
+          <div class="my-auto">
+            <img :alt="title" src="../../../assets/svg/login-box-bg.svg" class="w-1/2 -mt-16 -enter-x" />
+            <div class="mt-10 font-medium text-white -enter-x">
+              <span class="inline-block mt-4 text-3xl"> {{ t('sys.login.signInTitle') }}</span>
             </div>
+            <div class="mt-5 font-normal text-white text-md dark:text-gray-500 -enter-x">
+              {{ t('sys.login.signInDesc') }}
+            </div>
+          </div>
         </div>
+        <div class="flex w-full h-full py-5 xl:h-auto xl:py-0 xl:my-0 xl:w-6/12">
+          <div
+            :class="`${prefixCls}-form`"
+            class="relative w-full px-5 py-8 mx-auto my-auto rounded-md shadow-md xl:ml-16 xl:bg-transparent sm:px-8 xl:p-4 xl:shadow-none sm:w-3/4 lg:w-2/4 xl:w-auto enter-x"
+          >
+            <LoginForm />
+            <ForgetPasswordForm />
+            <RegisterForm />
+            <MobileForm />
+            <QrCodeForm />
+          </div>
+        </div>
+      </div>
     </div>
+  </div>
 </template>
 <script lang="ts" setup>
-    import { computed } from 'vue';
-    import { AppLogo } from '/@/components/Application';
-    import { AppLocalePicker, AppDarkModeToggle } from '/@/components/Application';
-    import LoginForm from './LoginForm.vue';
-    import ForgetPasswordForm from './ForgetPasswordForm.vue';
-    import RegisterForm from './RegisterForm.vue';
-    import MobileForm from './MobileForm.vue';
-    import QrCodeForm from './QrCodeForm.vue';
-    import { useGlobSetting } from '/@/hooks/setting';
-    import { useI18n } from '/@/hooks/web/useI18n';
-    import { useDesign } from '/@/hooks/web/useDesign';
-    import { useLocaleStore } from '/@/store/modules/locale';
-    import { useLoginState, LoginStateEnum } from './useLogin';
-    defineProps({
-        sessionTimeout: {
-            type: Boolean,
-        },
-    });
+  import { computed } from 'vue';
+  import { AppLogo } from '/@/components/Application';
+  import { AppLocalePicker, AppDarkModeToggle } from '/@/components/Application';
+  import LoginForm from './LoginForm.vue';
+  import ForgetPasswordForm from './ForgetPasswordForm.vue';
+  import RegisterForm from './RegisterForm.vue';
+  import MobileForm from './MobileForm.vue';
+  import QrCodeForm from './QrCodeForm.vue';
+  import { useGlobSetting } from '/@/hooks/setting';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useLocaleStore } from '/@/store/modules/locale';
+  import { useLoginState, LoginStateEnum } from './useLogin';
+  defineProps({
+    sessionTimeout: {
+      type: Boolean,
+    },
+  });
 
-    const globSetting = useGlobSetting();
-    const { prefixCls } = useDesign('login');
-    const { t } = useI18n();
-    const localeStore = useLocaleStore();
-    const showLocale = localeStore.getShowPicker;
-    const title = computed(() => globSetting?.title ?? '');
-    const { handleBackLogin } = useLoginState();
-    handleBackLogin();
+  const globSetting = useGlobSetting();
+  const { prefixCls } = useDesign('login');
+  const { t } = useI18n();
+  const localeStore = useLocaleStore();
+  const showLocale = localeStore.getShowPicker;
+  const title = computed(() => globSetting?.title ?? '');
+  const { handleBackLogin } = useLoginState();
+  handleBackLogin();
 </script>
 <style lang="less">
-    @prefix-cls: ~'@{namespace}-login';
-    @logo-prefix-cls: ~'@{namespace}-app-logo';
-    @countdown-prefix-cls: ~'@{namespace}-countdown-input';
-    @dark-bg: #293146;
-
-    html[data-theme='dark'] {
-        .@{prefix-cls} {
-            background-color: @dark-bg;
-
-            &::before {
-                background-image: url(/@/assets/svg/login-bg-dark.svg);
-            }
-
-            .ant-input,
-            .ant-input-password {
-                background-color: #232a3b;
-            }
-
-            .ant-btn:not(.ant-btn-link):not(.ant-btn-primary) {
-                border: 1px solid #4a5569;
-            }
-
-            &-form {
-                background: transparent !important;
-            }
-
-            .app-iconify {
-                color: #fff;
-            }
-        }
-
-        input.fix-auto-fill,
-        .fix-auto-fill input {
-            -webkit-text-fill-color: #c9d1d9 !important;
-            box-shadow: inherit !important;
-        }
-    }
+  @prefix-cls: ~'@{namespace}-login';
+  @logo-prefix-cls: ~'@{namespace}-app-logo';
+  @countdown-prefix-cls: ~'@{namespace}-countdown-input';
+  @dark-bg: #293146;
 
+  html[data-theme='dark'] {
     .@{prefix-cls} {
-        min-height: 100%;
-        overflow: hidden;
-        @media (max-width: @screen-xl) {
-            background-color: #293146;
+      background-color: @dark-bg;
 
-            .@{prefix-cls}-form {
-                background-color: #fff;
-            }
-        }
+      &::before {
+        background-image: url(/@/assets/svg/login-bg-dark.svg);
+      }
 
-        &::before {
-            position: absolute;
-            top: 0;
-            left: 0;
-            width: 100%;
-            height: 100%;
-            margin-left: -48%;
-            background-image: url(/@/assets/svg/login-bg.svg);
-            background-position: 100%;
-            background-repeat: no-repeat;
-            background-size: auto 100%;
-            content: '';
-            @media (max-width: @screen-xl) {
-                display: none;
-            }
-        }
+      .ant-input,
+      .ant-input-password {
+        background-color: #232a3b;
+      }
 
-        .@{logo-prefix-cls} {
-            position: absolute;
-            top: 12px;
-            height: 30px;
+      .ant-btn:not(.ant-btn-link):not(.ant-btn-primary) {
+        border: 1px solid #4a5569;
+      }
 
-            &__title {
-                font-size: 16px;
-                color: #fff;
-            }
+      &-form {
+        background: transparent !important;
+      }
 
-            img {
-                width: 32px;
-            }
-        }
-
-        .container {
-            .@{logo-prefix-cls} {
-                display: flex;
-                width: 60%;
-                height: 80px;
-
-                &__title {
-                    font-size: 24px;
-                    color: #fff;
-                }
-
-                img {
-                    width: 48px;
-                }
-            }
-        }
-
-        &-sign-in-way {
-            .anticon {
-                font-size: 22px;
-                color: #888;
-                cursor: pointer;
-
-                &:hover {
-                    color: @primary-color;
-                }
-            }
-        }
-
-        input:not([type='checkbox']) {
-            min-width: 360px;
-
-            @media (max-width: @screen-xl) {
-                min-width: 320px;
-            }
-
-            @media (max-width: @screen-lg) {
-                min-width: 260px;
-            }
-
-            @media (max-width: @screen-md) {
-                min-width: 240px;
-            }
-
-            @media (max-width: @screen-sm) {
-                min-width: 160px;
-            }
-        }
-
-        .@{countdown-prefix-cls} input {
-            min-width: unset;
-        }
-
-        .ant-divider-inner-text {
-            font-size: 12px;
-            color: @text-color-secondary;
-        }
+      .app-iconify {
+        color: #fff;
+      }
     }
+
+    input.fix-auto-fill,
+    .fix-auto-fill input {
+      -webkit-text-fill-color: #c9d1d9 !important;
+      box-shadow: inherit !important;
+    }
+  }
+
+  .@{prefix-cls} {
+    min-height: 100%;
+    overflow: hidden;
+    @media (max-width: @screen-xl) {
+      background-color: #293146;
+
+      .@{prefix-cls}-form {
+        background-color: #fff;
+      }
+    }
+
+    &::before {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      margin-left: -48%;
+      background-image: url(/@/assets/svg/login-bg.svg);
+      background-position: 100%;
+      background-repeat: no-repeat;
+      background-size: auto 100%;
+      content: '';
+      @media (max-width: @screen-xl) {
+        display: none;
+      }
+    }
+
+    .@{logo-prefix-cls} {
+      position: absolute;
+      top: 12px;
+      height: 30px;
+
+      &__title {
+        font-size: 16px;
+        color: #fff;
+      }
+
+      img {
+        width: 32px;
+      }
+    }
+
+    .container {
+      .@{logo-prefix-cls} {
+        display: flex;
+        width: 60%;
+        height: 80px;
+
+        &__title {
+          font-size: 24px;
+          color: #fff;
+        }
+
+        img {
+          width: 48px;
+        }
+      }
+    }
+
+    &-sign-in-way {
+      .anticon {
+        font-size: 22px;
+        color: #888;
+        cursor: pointer;
+
+        &:hover {
+          color: @primary-color;
+        }
+      }
+    }
+
+    input:not([type='checkbox']) {
+      min-width: 360px;
+
+      @media (max-width: @screen-xl) {
+        min-width: 320px;
+      }
+
+      @media (max-width: @screen-lg) {
+        min-width: 260px;
+      }
+
+      @media (max-width: @screen-md) {
+        min-width: 240px;
+      }
+
+      @media (max-width: @screen-sm) {
+        min-width: 160px;
+      }
+    }
+
+    .@{countdown-prefix-cls} input {
+      min-width: unset;
+    }
+
+    .ant-divider-inner-text {
+      font-size: 12px;
+      color: @text-color-secondary;
+    }
+  }
 </style>
diff --git a/src/views/sys/login/LoginForm.vue b/src/views/sys/login/LoginForm.vue
index d895d07..706af37 100644
--- a/src/views/sys/login/LoginForm.vue
+++ b/src/views/sys/login/LoginForm.vue
@@ -1,194 +1,187 @@
 <template>
-    <LoginFormTitle v-show="getShow" class="enter-x"/>
-    <Form class="p-4 enter-x" :model="formData" :rules="getFormRules" ref="formRef" v-show="getShow" @keypress.enter="handleLogin">
-        <FormItem name="account" class="enter-x">
-            <Input size="large" v-model:value="formData.account" :placeholder="t('sys.login.userName')" class="fix-auto-fill"/>
+  <LoginFormTitle v-show="getShow" class="enter-x" />
+  <Form class="p-4 enter-x" :model="formData" :rules="getFormRules" ref="formRef" v-show="getShow" @keypress.enter="handleLogin">
+    <FormItem name="account" class="enter-x">
+      <Input size="large" v-model:value="formData.account" :placeholder="t('sys.login.userName')" class="fix-auto-fill" />
+    </FormItem>
+    <FormItem name="password" class="enter-x">
+      <InputPassword size="large" visibilityToggle v-model:value="formData.password" :placeholder="t('sys.login.password')" />
+    </FormItem>
+
+    <!--验证码-->
+    <ARow class="enter-x">
+      <ACol :span="12">
+        <FormItem name="inputCode" class="enter-x">
+          <Input size="large" v-model:value="formData.inputCode" :placeholder="t('sys.login.inputCode')" style="min-width: 100px" />
         </FormItem>
-        <FormItem name="password" class="enter-x">
-            <InputPassword size="large" visibilityToggle v-model:value="formData.password" :placeholder="t('sys.login.password')"/>
+      </ACol>
+      <ACol :span="8">
+        <FormItem :style="{ 'text-align': 'right', 'margin-left': '20px' }" class="enter-x">
+          <img v-if="randCodeData.requestCodeSuccess" style="margin-top: 2px; max-width: initial" :src="randCodeData.randCodeImage" @click="handleChangeCheckCode" />
+          <img v-else style="margin-top: 2px; max-width: initial" src="../../../assets/images/checkcode.png" @click="handleChangeCheckCode" />
         </FormItem>
+      </ACol>
+    </ARow>
 
-        <!--验证码-->
-        <ARow class="enter-x">
-            <ACol :span="12">
-                <FormItem name="inputCode" class="enter-x">
-                    <Input size="large" v-model:value="formData.inputCode" :placeholder="t('sys.login.inputCode')" style="min-width: 100px"/>
-                </FormItem>
-            </ACol>
-            <ACol :span="8">
-                <FormItem :style="{ 'text-align': 'right','margin-left':'20px' }" class="enter-x">
-                    <img v-if="randCodeData.requestCodeSuccess" style="margin-top: 2px;max-width: initial;" :src="randCodeData.randCodeImage" @click="handleChangeCheckCode"/>
-                    <img v-else style="margin-top: 2px;max-width: initial;" src="../../../assets/images/checkcode.png"  @click="handleChangeCheckCode"/>
-                </FormItem>
-            </ACol>
-        </ARow>
+    <ARow class="enter-x">
+      <ACol :span="12">
+        <FormItem>
+          <!-- No logic, you need to deal with it yourself -->
+          <Checkbox v-model:checked="rememberMe" size="small">
+            {{ t('sys.login.rememberMe') }}
+          </Checkbox>
+        </FormItem>
+      </ACol>
+      <ACol :span="12">
+        <FormItem :style="{ 'text-align': 'right' }">
+          <!-- No logic, you need to deal with it yourself -->
+          <Button type="link" size="small" @click="setLoginState(LoginStateEnum.RESET_PASSWORD)">
+            {{ t('sys.login.forgetPassword') }}
+          </Button>
+        </FormItem>
+      </ACol>
+    </ARow>
 
-        <ARow class="enter-x">
-            <ACol :span="12">
-                <FormItem>
-                    <!-- No logic, you need to deal with it yourself -->
-                    <Checkbox v-model:checked="rememberMe" size="small">
-                        {{ t('sys.login.rememberMe') }}
-                    </Checkbox>
-                </FormItem>
-            </ACol>
-            <ACol :span="12">
-                <FormItem :style="{ 'text-align': 'right' }">
-                    <!-- No logic, you need to deal with it yourself -->
-                    <Button type="link" size="small" @click="setLoginState(LoginStateEnum.RESET_PASSWORD)">
-                        {{ t('sys.login.forgetPassword') }}
-                    </Button>
-                </FormItem>
-            </ACol>
-        </ARow>
-
-        <FormItem class="enter-x">
-            <Button type="primary" size="large" block @click="handleLogin" :loading="loading">
-                {{ t('sys.login.loginButton') }}
-            </Button>
-            <!-- <Button size="large" class="mt-4 enter-x" block @click="handleRegister">
+    <FormItem class="enter-x">
+      <Button type="primary" size="large" block @click="handleLogin" :loading="loading">
+        {{ t('sys.login.loginButton') }}
+      </Button>
+      <!-- <Button size="large" class="mt-4 enter-x" block @click="handleRegister">
               {{ t('sys.login.registerButton') }}
             </Button> -->
-        </FormItem>
-        <ARow class="enter-x">
-            <ACol :md="8" :xs="24">
-                <Button block @click="setLoginState(LoginStateEnum.MOBILE)">
-                    {{ t('sys.login.mobileSignInFormTitle') }}
-                </Button>
-            </ACol>
-            <ACol :md="8" :xs="24" class="!my-2 !md:my-0 xs:mx-0 md:mx-2">
-                <Button block @click="setLoginState(LoginStateEnum.QR_CODE)">
-                    {{ t('sys.login.qrSignInFormTitle') }}
-                </Button>
-            </ACol>
-            <ACol :md="7" :xs="24">
-                <Button block @click="setLoginState(LoginStateEnum.REGISTER)">
-                    {{ t('sys.login.registerButton') }}
-                </Button>
-            </ACol>
-        </ARow>
+    </FormItem>
+    <ARow class="enter-x">
+      <ACol :md="8" :xs="24">
+        <Button block @click="setLoginState(LoginStateEnum.MOBILE)">
+          {{ t('sys.login.mobileSignInFormTitle') }}
+        </Button>
+      </ACol>
+      <ACol :md="8" :xs="24" class="!my-2 !md:my-0 xs:mx-0 md:mx-2">
+        <Button block @click="setLoginState(LoginStateEnum.QR_CODE)">
+          {{ t('sys.login.qrSignInFormTitle') }}
+        </Button>
+      </ACol>
+      <ACol :md="7" :xs="24">
+        <Button block @click="setLoginState(LoginStateEnum.REGISTER)">
+          {{ t('sys.login.registerButton') }}
+        </Button>
+      </ACol>
+    </ARow>
 
-        <Divider class="enter-x">{{ t('sys.login.otherSignIn') }}</Divider>
-
-        <div class="flex justify-evenly enter-x" :class="`${prefixCls}-sign-in-way`">
-            <a @click="onThirdLogin('github')" title="github"><GithubFilled /></a>
-            <a @click="onThirdLogin('wechat_enterprise')" title="企业微信"> <icon-font class="item-icon" type="icon-qiyeweixin3" /></a>
-            <a @click="onThirdLogin('dingtalk')" title="钉钉"><DingtalkCircleFilled /></a>
-            <a @click="onThirdLogin('wechat_open')" title="微信"><WechatFilled/></a>
-        </div>
-    </Form>
-    <!-- 第三方登录相关弹框 -->
-    <ThirdModal ref="thirdModalRef"></ThirdModal>
+    <Divider class="enter-x">{{ t('sys.login.otherSignIn') }}</Divider>
 
+    <div class="flex justify-evenly enter-x" :class="`${prefixCls}-sign-in-way`">
+      <a @click="onThirdLogin('github')" title="github"><GithubFilled /></a>
+      <a @click="onThirdLogin('wechat_enterprise')" title="企业微信"> <icon-font class="item-icon" type="icon-qiyeweixin3" /></a>
+      <a @click="onThirdLogin('dingtalk')" title="钉钉"><DingtalkCircleFilled /></a>
+      <a @click="onThirdLogin('wechat_open')" title="微信"><WechatFilled /></a>
+    </div>
+  </Form>
+  <!-- 第三方登录相关弹框 -->
+  <ThirdModal ref="thirdModalRef"></ThirdModal>
 </template>
 <script lang="ts" setup>
-    import {reactive, ref, toRaw, unref, computed,onMounted} from 'vue';
+  import { reactive, ref, toRaw, unref, computed, onMounted } from 'vue';
 
-    import {Checkbox, Form, Input, Row, Col, Button, Divider} from 'ant-design-vue';
-    import {
-        GithubFilled,
-        WechatFilled,
-        DingtalkCircleFilled,
-        QuestionCircleFilled,
-        createFromIconfontCN
-    } from '@ant-design/icons-vue';
-    import LoginFormTitle from './LoginFormTitle.vue';
-    import ThirdModal from './ThirdModal.vue';
-    import {useI18n} from '/@/hooks/web/useI18n';
-    import {useMessage} from '/@/hooks/web/useMessage';
+  import { Checkbox, Form, Input, Row, Col, Button, Divider } from 'ant-design-vue';
+  import { GithubFilled, WechatFilled, DingtalkCircleFilled, QuestionCircleFilled, createFromIconfontCN } from '@ant-design/icons-vue';
+  import LoginFormTitle from './LoginFormTitle.vue';
+  import ThirdModal from './ThirdModal.vue';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
-    import {useUserStore} from '/@/store/modules/user';
-    import {LoginStateEnum, useLoginState, useFormRules, useFormValid} from './useLogin';
-    import {useDesign} from '/@/hooks/web/useDesign';
-    import {getCodeInfo} from '/@/api/sys/user';
-    //import { onKeyStroke } from '@vueuse/core';
+  import { useUserStore } from '/@/store/modules/user';
+  import { LoginStateEnum, useLoginState, useFormRules, useFormValid } from './useLogin';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { getCodeInfo } from '/@/api/sys/user';
+  //import { onKeyStroke } from '@vueuse/core';
 
-    const ACol = Col;
-    const ARow = Row;
-    const FormItem = Form.Item;
-    const InputPassword = Input.Password;
-    const IconFont = createFromIconfontCN({
-        scriptUrl: '//at.alicdn.com/t/font_2316098_umqusozousr.js',
-    });
-    const {t} = useI18n();
-    const {notification, createErrorModal} = useMessage();
-    const {prefixCls} = useDesign('login');
-    const userStore = useUserStore();
+  const ACol = Col;
+  const ARow = Row;
+  const FormItem = Form.Item;
+  const InputPassword = Input.Password;
+  const IconFont = createFromIconfontCN({
+    scriptUrl: '//at.alicdn.com/t/font_2316098_umqusozousr.js',
+  });
+  const { t } = useI18n();
+  const { notification, createErrorModal } = useMessage();
+  const { prefixCls } = useDesign('login');
+  const userStore = useUserStore();
 
-    const {setLoginState, getLoginState} = useLoginState();
-    const {getFormRules} = useFormRules();
+  const { setLoginState, getLoginState } = useLoginState();
+  const { getFormRules } = useFormRules();
 
-    const formRef = ref();
-    const thirdModalRef = ref();
-    const loading = ref(false);
-    const rememberMe = ref(false);
+  const formRef = ref();
+  const thirdModalRef = ref();
+  const loading = ref(false);
+  const rememberMe = ref(false);
 
-    const formData = reactive({
-        account: 'admin',
-        password: '123456',
-        inputCode: '',
-    });
-    const randCodeData = reactive({
-        randCodeImage: '',
-        requestCodeSuccess:false,
-        checkKey:null,
-    });
+  const formData = reactive({
+    account: 'admin',
+    password: '123456',
+    inputCode: '',
+  });
+  const randCodeData = reactive({
+    randCodeImage: '',
+    requestCodeSuccess: false,
+    checkKey: null,
+  });
 
-    const {validForm} = useFormValid(formRef);
+  const { validForm } = useFormValid(formRef);
 
-    //onKeyStroke('Enter', handleLogin);
+  //onKeyStroke('Enter', handleLogin);
 
-    const getShow = computed(() => unref(getLoginState) === LoginStateEnum.LOGIN);
+  const getShow = computed(() => unref(getLoginState) === LoginStateEnum.LOGIN);
 
-    async function handleLogin() {
-        const data = await validForm();
-        if (!data) return;
-        try {
-            loading.value = true;
-            const {userInfo} = await userStore.login(
-                toRaw({
-                    password: data.password,
-                    username: data.account,
-                    captcha: data.inputCode,
-                    checkKey: randCodeData.checkKey,
-                    mode: 'none', //不要默认的错误提示
-                })
-            );
-            if (userInfo) {
-                notification.success({
-                    message: t('sys.login.loginSuccessTitle'),
-                    description: `${t('sys.login.loginSuccessDesc')}: ${userInfo.realname}`,
-                    duration: 3,
-                });
-            }
-        } catch (error) {
-            notification.error({
-              message: t('sys.api.errorTip'),
-              description:  error.message || t('sys.api.networkExceptionMsg'),
-              duration: 3,
-            });
-            loading.value = false;
-        }
-    }
-    function handleChangeCheckCode(){
-        formData.inputCode = ''
-        //TODO 兼容mock和接口，暂时这样处理
-        randCodeData.checkKey = 1629428467008 //new Date().getTime();
-        getCodeInfo(randCodeData.checkKey).then(res=>{
-            randCodeData.randCodeImage = res
-            randCodeData.requestCodeSuccess = true
+  async function handleLogin() {
+    const data = await validForm();
+    if (!data) return;
+    try {
+      loading.value = true;
+      const { userInfo } = await userStore.login(
+        toRaw({
+          password: data.password,
+          username: data.account,
+          captcha: data.inputCode,
+          checkKey: randCodeData.checkKey,
+          mode: 'none', //不要默认的错误提示
+        })
+      );
+      if (userInfo) {
+        notification.success({
+          message: t('sys.login.loginSuccessTitle'),
+          description: `${t('sys.login.loginSuccessDesc')}: ${userInfo.realname}`,
+          duration: 3,
         });
+      }
+    } catch (error) {
+      notification.error({
+        message: t('sys.api.errorTip'),
+        description: error.message || t('sys.api.networkExceptionMsg'),
+        duration: 3,
+      });
+      loading.value = false;
     }
+  }
+  function handleChangeCheckCode() {
+    formData.inputCode = '';
+    //TODO 兼容mock和接口，暂时这样处理
+    randCodeData.checkKey = 1629428467008; //new Date().getTime();
+    getCodeInfo(randCodeData.checkKey).then((res) => {
+      randCodeData.randCodeImage = res;
+      randCodeData.requestCodeSuccess = true;
+    });
+  }
 
-    /**
-     * 第三方登录
-     * @param type
-     */
-    function onThirdLogin(type){
-        thirdModalRef.value.onThirdLogin(type);
-    }
-    //初始化验证码
-    onMounted(() => {
-        handleChangeCheckCode()
-    })
+  /**
+   * 第三方登录
+   * @param type
+   */
+  function onThirdLogin(type) {
+    thirdModalRef.value.onThirdLogin(type);
+  }
+  //初始化验证码
+  onMounted(() => {
+    handleChangeCheckCode();
+  });
 </script>
diff --git a/src/views/sys/login/LoginSelect.vue b/src/views/sys/login/LoginSelect.vue
index 51f2df5..ed7b241 100644
--- a/src/views/sys/login/LoginSelect.vue
+++ b/src/views/sys/login/LoginSelect.vue
@@ -1,305 +1,307 @@
 <template>
-    <BasicModal v-bind="config" @register="registerModal" :title="currTitle" wrapClassName="loginSelectModal" v-model:visible="visible">
-        <a-form ref="formRef" :model="formState" :rules="rules" v-bind="layout" :colon="false" class="loginSelectForm">
-            <!--多租户选择-->
-            <a-form-item v-if="isMultiTenant" name="tenantId" :validate-status="validate_status">
-                <!--label内容-->
-                <template #label>
-                    <a-tooltip placement="topLeft">
-                        <template #title>
-                            <span>您隶属于多租户，请选择登录租户</span>
-                        </template>
-                        <a-avatar style="background-color: #87d068" :size="30">
-                            租户
-                        </a-avatar>
-                    </a-tooltip>
-                </template>
-                <template #extra v-if="validate_status=='error'">
-                    <span style="color: #ED6F6F">请选择登录租户</span>
-                </template>
-                <!--租户下拉内容-->
-                <a-select v-model:value="formState.tenantId" @change="handleTenantChange" placeholder="请选择登录租户"  :class="{'valid-error':validate_status=='error'}">
-                    <template v-for="tenant in tenantList" :key="tenant.id">
-                        <a-select-option :value="tenant.id">{{ tenant.name }}</a-select-option>
-                    </template>
-                </a-select>
-            </a-form-item>
-            <!--多部门选择-->
-            <a-form-item v-if="isMultiDepart" :validate-status="validate_status1" :colon="false">
-                <!--label内容-->
-                <template #label>
-                    <a-tooltip placement="topLeft">
-                        <template #title>
-                            <span>您隶属于多部门，请选择登录部门</span>
-                        </template>
-                        <a-avatar style="background-color: rgb(104, 208, 203);" :size="30">
-                            部门
-                        </a-avatar>
-                    </a-tooltip>
-                </template>
-                <template #extra v-if="validate_status1=='error'">
-                    <span style="color: #ED6F6F">请选择登录部门</span>
-                </template>
-                <!--部门下拉内容-->
-                <a-select v-model:value="formState.orgCode" @change="handleDepartChange" placeholder="请选择登录部门" :class="{'valid-error':validate_status1=='error'}">
-                    <template v-for="depart in departList" :key="depart.orgCode">
-                        <a-select-option :value="depart.orgCode">{{ depart.departName }}</a-select-option>
-                    </template>
-                </a-select>
-            </a-form-item>
-        </a-form>
-
-        <template #footer>
-            <a-button @click="handleSubmit" type="primary">确认</a-button>
+  <BasicModal v-bind="config" @register="registerModal" :title="currTitle" wrapClassName="loginSelectModal" v-model:visible="visible">
+    <a-form ref="formRef" :model="formState" :rules="rules" v-bind="layout" :colon="false" class="loginSelectForm">
+      <!--多租户选择-->
+      <a-form-item v-if="isMultiTenant" name="tenantId" :validate-status="validate_status">
+        <!--label内容-->
+        <template #label>
+          <a-tooltip placement="topLeft">
+            <template #title>
+              <span>您隶属于多租户，请选择登录租户</span>
+            </template>
+            <a-avatar style="background-color: #87d068" :size="30"> 租户 </a-avatar>
+          </a-tooltip>
         </template>
-    </BasicModal>
+        <template #extra v-if="validate_status == 'error'">
+          <span style="color: #ed6f6f">请选择登录租户</span>
+        </template>
+        <!--租户下拉内容-->
+        <a-select v-model:value="formState.tenantId" @change="handleTenantChange" placeholder="请选择登录租户" :class="{ 'valid-error': validate_status == 'error' }">
+          <template v-for="tenant in tenantList" :key="tenant.id">
+            <a-select-option :value="tenant.id">{{ tenant.name }}</a-select-option>
+          </template>
+        </a-select>
+      </a-form-item>
+      <!--多部门选择-->
+      <a-form-item v-if="isMultiDepart" :validate-status="validate_status1" :colon="false">
+        <!--label内容-->
+        <template #label>
+          <a-tooltip placement="topLeft">
+            <template #title>
+              <span>您隶属于多部门，请选择登录部门</span>
+            </template>
+            <a-avatar style="background-color: rgb(104, 208, 203)" :size="30"> 部门 </a-avatar>
+          </a-tooltip>
+        </template>
+        <template #extra v-if="validate_status1 == 'error'">
+          <span style="color: #ed6f6f">请选择登录部门</span>
+        </template>
+        <!--部门下拉内容-->
+        <a-select v-model:value="formState.orgCode" @change="handleDepartChange" placeholder="请选择登录部门" :class="{ 'valid-error': validate_status1 == 'error' }">
+          <template v-for="depart in departList" :key="depart.orgCode">
+            <a-select-option :value="depart.orgCode">{{ depart.departName }}</a-select-option>
+          </template>
+        </a-select>
+      </a-form-item>
+    </a-form>
+
+    <template #footer>
+      <a-button @click="handleSubmit" type="primary">确认</a-button>
+    </template>
+  </BasicModal>
 </template>
 
 <script lang="ts">
-    import {defineComponent, ref, computed, watch, unref, reactive,UnwrapRef } from 'vue';
-    import {Avatar} from 'ant-design-vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {useMessage} from '/@/hooks/web/useMessage';
-    import {useUserStore} from '/@/store/modules/user';
-    import {defHttp} from '/@/utils/http/axios';
-    interface FormState {
-        orgCode: string | undefined;
-        tenantId: number;
-    }
-    export default defineComponent({
-        name: 'loginSelect',
-        components: {
-            Avatar,
-            BasicModal,
-        },
-        emits: ['success','register'],
-        setup(props, {emit}) {
-            const userStore = useUserStore();
-            const {notification} = useMessage();
-            //租户配置
-            const isMultiTenant = ref(false);
-            const tenantList = ref([]);
-            const validate_status = ref('');
-            //部门配置
-            const isMultiDepart = ref(false);
-            const departList = ref([]);
-            const validate_status1 = ref('');
-            //弹窗显隐
-            const visible = ref(false);
-            //登录用户
-            const username = ref('');
-            //表单
-            const formRef = ref();
-            //选择的租户部门信息
-            const formState: UnwrapRef<FormState> = reactive({
-                orgCode: undefined,
-                tenantId: null,
-            });
-            
-            const config ={
-                maskClosable:false, 
-                closable:false,
-                canFullscreen:false,
-                width:"500px" ,
-                minHeight: 20,
-                maxHeight: 20,
-            };
-            //弹窗操作
-            const [registerModal, {closeModal}] = useModalInner();
+  import { defineComponent, ref, computed, watch, unref, reactive, UnwrapRef } from 'vue';
+  import { Avatar } from 'ant-design-vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { useUserStore } from '/@/store/modules/user';
+  import { defHttp } from '/@/utils/http/axios';
+  interface FormState {
+    orgCode: string | undefined;
+    tenantId: number;
+  }
+  export default defineComponent({
+    name: 'loginSelect',
+    components: {
+      Avatar,
+      BasicModal,
+    },
+    emits: ['success', 'register'],
+    setup(props, { emit }) {
+      const userStore = useUserStore();
+      const { notification } = useMessage();
+      //租户配置
+      const isMultiTenant = ref(false);
+      const tenantList = ref([]);
+      const validate_status = ref('');
+      //部门配置
+      const isMultiDepart = ref(false);
+      const departList = ref([]);
+      const validate_status1 = ref('');
+      //弹窗显隐
+      const visible = ref(false);
+      //登录用户
+      const username = ref('');
+      //表单
+      const formRef = ref();
+      //选择的租户部门信息
+      const formState: UnwrapRef<FormState> = reactive({
+        orgCode: undefined,
+        tenantId: null,
+      });
 
-            //当前标题
-            const currTitle = computed(() => {
-                if (unref(isMultiDepart) && unref(isMultiTenant)) {
-                    return '请选择租户和部门'
-                } else if (unref(isMultiDepart) && !unref(isMultiTenant)) {
-                    return '请选择部门'
-                } else if (!unref(isMultiDepart) && unref(isMultiTenant)) {
-                    return '请选择租户'
-                }
-            });
-            
-            const rules = ref({
-                tenantId: [{ required: unref(isMultiTenant),type:'number', message: '请选择租户',  trigger: 'change' }],
-                orgCode: [{ required: unref(isMultiDepart), message: '请选择部门', trigger: 'change' }],
-            });
+      const config = {
+        maskClosable: false,
+        closable: false,
+        canFullscreen: false,
+        width: '500px',
+        minHeight: 20,
+        maxHeight: 20,
+      };
+      //弹窗操作
+      const [registerModal, { closeModal }] = useModalInner();
 
-            const layout = {
-                labelCol: { span: 4 },
-                wrapperCol: { span: 18 },
-            };
-            /**
-             * 处理部门情况
-             */
-            function bizDepart(loginResult) {
-                let multi_depart = loginResult.multi_depart;
-                //0:无部门 1:一个部门 2:多个部门
-                if (multi_depart == 0) {
-                    notification.warn({
-                        message: '提示',
-                        description: `您尚未归属部门,请确认账号信息`,
-                        duration: 3
-                    });
-                    isMultiDepart.value = false
-                } else if (multi_depart == 2) {
-                    isMultiDepart.value = true;
-                    departList.value = loginResult.departs
-                } else {
-                    isMultiDepart.value = false
-                }
-            }
-
-            /**
-             * 处理租户情况
-             */
-            function bizTenantList(loginResult) {
-                let tenantArr = loginResult.tenantList;
-                if (Array.isArray(tenantArr)) {
-                    if (tenantArr.length === 0) {
-                        isMultiTenant.value = false;
-                        userStore.setTenant(formState.tenantId)
-                    } else if (tenantArr.length === 1) {
-                        formState.tenantId = tenantArr[0].id;
-                        isMultiTenant.value = false;
-                        userStore.setTenant(formState.tenantId)
-                    } else {
-                        isMultiTenant.value = true;
-                        tenantList.value = tenantArr
-                    }
-                }
-            }
-
-            /**
-             * 确认选中的租户和部门信息
-             */
-            function handleSubmit() {
-                if (unref(isMultiTenant) && !formState.tenantId) {
-                    validate_status.value = 'error';
-                    return false
-                }
-                if (unref(isMultiDepart) && !formState.orgCode) {
-                    validate_status1.value = 'error';
-                    return false
-                }
-                formRef.value.validate().then(() => {
-                    departResolve().then(() => {
-                        userStore.setTenant(formState.tenantId);
-                        emit('success')
-                    }).catch((e) => {
-                        console.log('登录选择出现问题', e)
-                    }).finally(()=>{
-                        close()
-                    })
-                }).catch(err => {
-                    console.log('表单校验未通过error', err);
-                });
-            }
-            /**
-             *切换选择部门
-             */
-            function departResolve() {
-                return new Promise((resolve, reject) => {
-                    if (!unref(isMultiDepart)) {
-                        resolve();
-                    } else {
-                        let params = {orgCode: formState.orgCode, username: unref(username)};
-                        defHttp.put({url: "/sys/selectDepart", params}).then(res => {
-                            if (res.userInfo) {
-                                userStore.setUserInfo(res.userInfo);
-                                resolve();
-                            } else {
-                                requestFailed(res);
-                                userStore.logout();
-                                reject();
-                            }
-                        })
-                    }
-                })
-            }
-            
-            /**
-             * 请求失败处理
-             */
-            function requestFailed(err) {
-                notification.error({
-                    message: '登录失败',
-                    description: ((err.response || {}).data || {}).message || err.message || "请求出现错误，请稍后再试",
-                    duration: 4,
-                });
-            }
-
-            /**
-             * 关闭model
-             */
-            function close() {
-                closeModal();
-                reset();
-            }
-            /**
-             * 弹窗打开前处理
-             */
-            async function show(loginResult) {
-                if(loginResult){
-                    username.value = userStore.username;
-                    await reset();
-                    await bizDepart(loginResult);
-                    await bizTenantList(loginResult);
-                    if (!unref(isMultiDepart) && !unref(isMultiTenant)) {
-                        emit('success', userStore.getUserInfo)
-                    }else{
-                        visible.value = true
-                    }
-                }
-            }
-
-            /**
-             *重置数据
-             */
-            function reset() {
-                tenantList.value = []
-                validate_status.value = ''
-
-                departList.value = []
-                validate_status1.value = ''
-            }
-            
-            function handleTenantChange(e) {
-                validate_status.value = ''
-            }
-
-            function handleDepartChange(e) {
-                validate_status1.value = ''
-            }
-
-            return {
-                registerModal,
-                visible,
-                tenantList,
-                isMultiTenant,
-                validate_status,
-                isMultiDepart,
-                departList,
-                validate_status1,
-                formState,
-                rules,
-                layout,
-                formRef,
-                currTitle,
-                config,
-                handleTenantChange,
-                handleDepartChange,
-                show,
-                handleSubmit
-            }
+      //当前标题
+      const currTitle = computed(() => {
+        if (unref(isMultiDepart) && unref(isMultiTenant)) {
+          return '请选择租户和部门';
+        } else if (unref(isMultiDepart) && !unref(isMultiTenant)) {
+          return '请选择部门';
+        } else if (!unref(isMultiDepart) && unref(isMultiTenant)) {
+          return '请选择租户';
         }
-    })
+      });
+
+      const rules = ref({
+        tenantId: [{ required: unref(isMultiTenant), type: 'number', message: '请选择租户', trigger: 'change' }],
+        orgCode: [{ required: unref(isMultiDepart), message: '请选择部门', trigger: 'change' }],
+      });
+
+      const layout = {
+        labelCol: { span: 4 },
+        wrapperCol: { span: 18 },
+      };
+      /**
+       * 处理部门情况
+       */
+      function bizDepart(loginResult) {
+        let multi_depart = loginResult.multi_depart;
+        //0:无部门 1:一个部门 2:多个部门
+        if (multi_depart == 0) {
+          notification.warn({
+            message: '提示',
+            description: `您尚未归属部门,请确认账号信息`,
+            duration: 3,
+          });
+          isMultiDepart.value = false;
+        } else if (multi_depart == 2) {
+          isMultiDepart.value = true;
+          departList.value = loginResult.departs;
+        } else {
+          isMultiDepart.value = false;
+        }
+      }
+
+      /**
+       * 处理租户情况
+       */
+      function bizTenantList(loginResult) {
+        let tenantArr = loginResult.tenantList;
+        if (Array.isArray(tenantArr)) {
+          if (tenantArr.length === 0) {
+            isMultiTenant.value = false;
+            userStore.setTenant(formState.tenantId);
+          } else if (tenantArr.length === 1) {
+            formState.tenantId = tenantArr[0].id;
+            isMultiTenant.value = false;
+            userStore.setTenant(formState.tenantId);
+          } else {
+            isMultiTenant.value = true;
+            tenantList.value = tenantArr;
+          }
+        }
+      }
+
+      /**
+       * 确认选中的租户和部门信息
+       */
+      function handleSubmit() {
+        if (unref(isMultiTenant) && !formState.tenantId) {
+          validate_status.value = 'error';
+          return false;
+        }
+        if (unref(isMultiDepart) && !formState.orgCode) {
+          validate_status1.value = 'error';
+          return false;
+        }
+        formRef.value
+          .validate()
+          .then(() => {
+            departResolve()
+              .then(() => {
+                userStore.setTenant(formState.tenantId);
+                emit('success');
+              })
+              .catch((e) => {
+                console.log('登录选择出现问题', e);
+              })
+              .finally(() => {
+                close();
+              });
+          })
+          .catch((err) => {
+            console.log('表单校验未通过error', err);
+          });
+      }
+      /**
+       *切换选择部门
+       */
+      function departResolve() {
+        return new Promise((resolve, reject) => {
+          if (!unref(isMultiDepart)) {
+            resolve();
+          } else {
+            let params = { orgCode: formState.orgCode, username: unref(username) };
+            defHttp.put({ url: '/sys/selectDepart', params }).then((res) => {
+              if (res.userInfo) {
+                userStore.setUserInfo(res.userInfo);
+                resolve();
+              } else {
+                requestFailed(res);
+                userStore.logout();
+                reject();
+              }
+            });
+          }
+        });
+      }
+
+      /**
+       * 请求失败处理
+       */
+      function requestFailed(err) {
+        notification.error({
+          message: '登录失败',
+          description: ((err.response || {}).data || {}).message || err.message || '请求出现错误，请稍后再试',
+          duration: 4,
+        });
+      }
+
+      /**
+       * 关闭model
+       */
+      function close() {
+        closeModal();
+        reset();
+      }
+      /**
+       * 弹窗打开前处理
+       */
+      async function show(loginResult) {
+        if (loginResult) {
+          username.value = userStore.username;
+          await reset();
+          await bizDepart(loginResult);
+          await bizTenantList(loginResult);
+          if (!unref(isMultiDepart) && !unref(isMultiTenant)) {
+            emit('success', userStore.getUserInfo);
+          } else {
+            visible.value = true;
+          }
+        }
+      }
+
+      /**
+       *重置数据
+       */
+      function reset() {
+        tenantList.value = [];
+        validate_status.value = '';
+
+        departList.value = [];
+        validate_status1.value = '';
+      }
+
+      function handleTenantChange(e) {
+        validate_status.value = '';
+      }
+
+      function handleDepartChange(e) {
+        validate_status1.value = '';
+      }
+
+      return {
+        registerModal,
+        visible,
+        tenantList,
+        isMultiTenant,
+        validate_status,
+        isMultiDepart,
+        departList,
+        validate_status1,
+        formState,
+        rules,
+        layout,
+        formRef,
+        currTitle,
+        config,
+        handleTenantChange,
+        handleDepartChange,
+        show,
+        handleSubmit,
+      };
+    },
+  });
 </script>
 
 <style lang="less" scoped>
-  .loginSelectForm{
-      margin-bottom: -20px;
+  .loginSelectForm {
+    margin-bottom: -20px;
   }
-  
-  .loginSelectModal{
-      top: 10px;
+
+  .loginSelectModal {
+    top: 10px;
   }
 </style>
diff --git a/src/views/sys/login/MobileForm.vue b/src/views/sys/login/MobileForm.vue
index c6b76fa..32af7b8 100644
--- a/src/views/sys/login/MobileForm.vue
+++ b/src/views/sys/login/MobileForm.vue
@@ -3,21 +3,10 @@
     <LoginFormTitle class="enter-x" />
     <Form class="p-4 enter-x" :model="formData" :rules="getFormRules" ref="formRef">
       <FormItem name="mobile" class="enter-x">
-        <Input
-                size="large"
-                v-model:value="formData.mobile"
-                :placeholder="t('sys.login.mobile')"
-                class="fix-auto-fill"
-        />
+        <Input size="large" v-model:value="formData.mobile" :placeholder="t('sys.login.mobile')" class="fix-auto-fill" />
       </FormItem>
       <FormItem name="sms" class="enter-x">
-        <CountdownInput
-                size="large"
-                class="fix-auto-fill"
-                v-model:value="formData.sms"
-                :placeholder="t('sys.login.smsCode')"
-                :sendCodeApi="sendCodeApi"
-        />
+        <CountdownInput size="large" class="fix-auto-fill" v-model:value="formData.sms" :placeholder="t('sys.login.smsCode')" :sendCodeApi="sendCodeApi" />
       </FormItem>
 
       <FormItem class="enter-x">
@@ -32,13 +21,13 @@
   </template>
 </template>
 <script lang="ts" setup>
-  import { reactive, ref, computed, unref,toRaw } from 'vue';
+  import { reactive, ref, computed, unref, toRaw } from 'vue';
   import { Form, Input, Button } from 'ant-design-vue';
   import { CountdownInput } from '/@/components/CountDown';
   import LoginFormTitle from './LoginFormTitle.vue';
   import { useI18n } from '/@/hooks/web/useI18n';
   import { useMessage } from '/@/hooks/web/useMessage';
-  import { useLoginState, useFormRules, useFormValid, LoginStateEnum,SmsEnum } from './useLogin';
+  import { useLoginState, useFormRules, useFormValid, LoginStateEnum, SmsEnum } from './useLogin';
   import { useUserStore } from '/@/store/modules/user';
   import { getCaptcha } from '/@/api/sys/user';
   const FormItem = Form.Item;
@@ -89,6 +78,6 @@
   }
   //倒计时执行前的函数
   function sendCodeApi() {
-    return getCaptcha({mobile:formData.mobile,smsmode:SmsEnum.FORGET_PASSWORD});
+    return getCaptcha({ mobile: formData.mobile, smsmode: SmsEnum.FORGET_PASSWORD });
   }
 </script>
diff --git a/src/views/sys/login/QrCodeForm.vue b/src/views/sys/login/QrCodeForm.vue
index 821c77e..3b36731 100644
--- a/src/views/sys/login/QrCodeForm.vue
+++ b/src/views/sys/login/QrCodeForm.vue
@@ -2,7 +2,7 @@
   <template v-if="getShow">
     <LoginFormTitle class="enter-x" />
     <div class="enter-x min-w-64 min-h-64">
-      <QrCode :value="qrCodeUrl" class="enter-x flex justify-center xl:justify-start" :width="280"/>
+      <QrCode :value="qrCodeUrl" class="enter-x flex justify-center xl:justify-start" :width="280" />
       <Divider class="enter-x">{{ scanContent }}</Divider>
       <Button size="large" block class="mt-4 enter-x" @click="handleBackLogin">
         {{ t('sys.login.backSignIn') }}
@@ -11,29 +11,29 @@
   </template>
 </template>
 <script lang="ts" setup>
-  import { computed, onMounted, unref,ref,watch } from 'vue';
+  import { computed, onMounted, unref, ref, watch } from 'vue';
   import LoginFormTitle from './LoginFormTitle.vue';
   import { Button, Divider } from 'ant-design-vue';
   import { QrCode } from '/@/components/Qrcode/index';
-  import {useUserStore} from '/@/store/modules/user';
+  import { useUserStore } from '/@/store/modules/user';
   import { useI18n } from '/@/hooks/web/useI18n';
   import { useLoginState, LoginStateEnum } from './useLogin';
-  import {getLoginQrcode,getQrcodeToken} from '/@/api/sys/user';
+  import { getLoginQrcode, getQrcodeToken } from '/@/api/sys/user';
   const qrCodeUrl = ref('');
   let timer: IntervalHandle;
   const { t } = useI18n();
   const userStore = useUserStore();
   const { handleBackLogin, getLoginState } = useLoginState();
-  const state = ref('0')
+  const state = ref('0');
   const getShow = computed(() => unref(getLoginState) === LoginStateEnum.QR_CODE);
   const scanContent = computed(() => {
-      return unref(state) === '0'?t('sys.login.scanSign'):t('sys.login.scanSuccess')
+    return unref(state) === '0' ? t('sys.login.scanSign') : t('sys.login.scanSuccess');
   });
   //加载二维码信息
   function loadQrCode() {
-    state.value = '0'  
-    getLoginQrcode().then(res=>{
-      qrCodeUrl.value=res.qrcodeId;
+    state.value = '0';
+    getLoginQrcode().then((res) => {
+      qrCodeUrl.value = res.qrcodeId;
       if (res.qrcodeId) {
         openTimer(res.qrcodeId);
       }
@@ -41,7 +41,7 @@
   }
   //监控扫码状态
   function watchQrcodeToken(qrcodeId) {
-    getQrcodeToken({qrcodeId:qrcodeId}).then(res=>{
+    getQrcodeToken({ qrcodeId: qrcodeId }).then((res) => {
       let token = res.token;
       if (token == '-2') {
         //二维码过期重新获取
@@ -50,9 +50,9 @@
       }
       //扫码成功
       if (res.success) {
-        state.value = '2';  
+        state.value = '2';
         clearInterval(timer);
-        setTimeout(()=> {
+        setTimeout(() => {
           userStore.qrCodeLogin(token);
         }, 500);
       }
@@ -73,13 +73,11 @@
     if (timer) clearInterval(timer);
   }
 
-  watch( getShow, (v) => {
-     if(v){
-       loadQrCode();
-     }else{
-       closeTimer();
-     }
-  })
-
-
+  watch(getShow, (v) => {
+    if (v) {
+      loadQrCode();
+    } else {
+      closeTimer();
+    }
+  });
 </script>
diff --git a/src/views/sys/login/RegisterForm.vue b/src/views/sys/login/RegisterForm.vue
index 0c2dd9e..c8af2de 100644
--- a/src/views/sys/login/RegisterForm.vue
+++ b/src/views/sys/login/RegisterForm.vue
@@ -1,115 +1,108 @@
 <template>
-    <template v-if="getShow">
-        <LoginFormTitle class="enter-x" />
-        <Form class="p-4 enter-x" :model="formData" :rules="getFormRules" ref="formRef">
-            <FormItem name="account" class="enter-x">
-                <Input class="fix-auto-fill" size="large" v-model:value="formData.account" :placeholder="t('sys.login.userName')"/>
-            </FormItem>
-            <FormItem name="mobile" class="enter-x">
-                <Input size="large" v-model:value="formData.mobile" :placeholder="t('sys.login.mobile')" class="fix-auto-fill"/>
-            </FormItem>
-            <FormItem name="sms" class="enter-x">
-                <CountdownInput size="large" class="fix-auto-fill" v-model:value="formData.sms" :placeholder="t('sys.login.smsCode')" :sendCodeApi="sendCodeApi"/>
-            </FormItem>
-            <FormItem name="password" class="enter-x">
-                <StrengthMeter size="large" v-model:value="formData.password" :placeholder="t('sys.login.password')"/>
-            </FormItem>
-            <FormItem name="confirmPassword" class="enter-x">
-                <InputPassword size="large" visibilityToggle v-model:value="formData.confirmPassword" :placeholder="t('sys.login.confirmPassword')"/>
-            </FormItem>
+  <template v-if="getShow">
+    <LoginFormTitle class="enter-x" />
+    <Form class="p-4 enter-x" :model="formData" :rules="getFormRules" ref="formRef">
+      <FormItem name="account" class="enter-x">
+        <Input class="fix-auto-fill" size="large" v-model:value="formData.account" :placeholder="t('sys.login.userName')" />
+      </FormItem>
+      <FormItem name="mobile" class="enter-x">
+        <Input size="large" v-model:value="formData.mobile" :placeholder="t('sys.login.mobile')" class="fix-auto-fill" />
+      </FormItem>
+      <FormItem name="sms" class="enter-x">
+        <CountdownInput size="large" class="fix-auto-fill" v-model:value="formData.sms" :placeholder="t('sys.login.smsCode')" :sendCodeApi="sendCodeApi" />
+      </FormItem>
+      <FormItem name="password" class="enter-x">
+        <StrengthMeter size="large" v-model:value="formData.password" :placeholder="t('sys.login.password')" />
+      </FormItem>
+      <FormItem name="confirmPassword" class="enter-x">
+        <InputPassword size="large" visibilityToggle v-model:value="formData.confirmPassword" :placeholder="t('sys.login.confirmPassword')" />
+      </FormItem>
 
-            <FormItem class="enter-x" name="policy">
-                <!-- No logic, you need to deal with it yourself -->
-                <Checkbox v-model:checked="formData.policy" size="small">
-                    {{ t('sys.login.policy') }}
-                </Checkbox>
-            </FormItem>
+      <FormItem class="enter-x" name="policy">
+        <!-- No logic, you need to deal with it yourself -->
+        <Checkbox v-model:checked="formData.policy" size="small">
+          {{ t('sys.login.policy') }}
+        </Checkbox>
+      </FormItem>
 
-            <Button
-                    type="primary"
-                    class="enter-x"
-                    size="large"
-                    block
-                    @click="handleRegister"
-                    :loading="loading"
-            >
-                {{ t('sys.login.registerButton') }}
-            </Button>
-            <Button size="large" block class="mt-4 enter-x" @click="handleBackLogin">
-                {{ t('sys.login.backSignIn') }}
-            </Button>
-        </Form>
-    </template>
+      <Button type="primary" class="enter-x" size="large" block @click="handleRegister" :loading="loading">
+        {{ t('sys.login.registerButton') }}
+      </Button>
+      <Button size="large" block class="mt-4 enter-x" @click="handleBackLogin">
+        {{ t('sys.login.backSignIn') }}
+      </Button>
+    </Form>
+  </template>
 </template>
 <script lang="ts" setup>
-    import { reactive, ref, unref, computed,toRaw } from 'vue';
-    import LoginFormTitle from './LoginFormTitle.vue';
-    import { Form, Input, Button, Checkbox } from 'ant-design-vue';
-    import { StrengthMeter } from '/@/components/StrengthMeter';
-    import { CountdownInput } from '/@/components/CountDown';
-    import { useI18n } from '/@/hooks/web/useI18n';
-    import { useMessage } from '/@/hooks/web/useMessage';
-    import { useLoginState, useFormRules, useFormValid, LoginStateEnum, SmsEnum  } from './useLogin';
-    import { register,getCaptcha } from '/@/api/sys/user';
-    const FormItem = Form.Item;
-    const InputPassword = Input.Password;
-    const { t } = useI18n();
-    const { handleBackLogin, getLoginState } = useLoginState();
-    const { notification, createErrorModal } = useMessage();
-    const formRef = ref();
-    const loading = ref(false);
-    const formData = reactive({
-        account: '',
-        password: '',
-        confirmPassword: '',
-        mobile: '',
-        sms: '',
-        policy: false,
-    });
-    const { getFormRules } = useFormRules(formData);
-    const { validForm } = useFormValid(formRef);
-    const getShow = computed(() => unref(getLoginState) === LoginStateEnum.REGISTER);
-    /**
-     * 注册
-     */
-    async function handleRegister() {
-      const data = await validForm();
-      if (!data) return;
-      try {
-        loading.value = true;
-        const resultInfo = await register(
-          toRaw({
-            username: data.account,
-            password: data.password,
-            phone: data.mobile,
-            smscode: data.sms
-          })
-        );
-        if (resultInfo && resultInfo.data.success) {
-          notification.success({
-            description: resultInfo.data.message || t('sys.api.registerMsg'),
-            duration: 3,
-          });
-          handleBackLogin();
-        }else{
-          notification.warning({
-            message: t('sys.api.errorTip'),
-            description: resultInfo.data.message || t('sys.api.networkExceptionMsg'),
-            duration: 3,
-          });
-        }
-      } catch (error) {
-        notification.error({
-          message: t('sys.api.errorTip'),
-          description: error.message || t('sys.api.networkExceptionMsg'),
+  import { reactive, ref, unref, computed, toRaw } from 'vue';
+  import LoginFormTitle from './LoginFormTitle.vue';
+  import { Form, Input, Button, Checkbox } from 'ant-design-vue';
+  import { StrengthMeter } from '/@/components/StrengthMeter';
+  import { CountdownInput } from '/@/components/CountDown';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { useLoginState, useFormRules, useFormValid, LoginStateEnum, SmsEnum } from './useLogin';
+  import { register, getCaptcha } from '/@/api/sys/user';
+  const FormItem = Form.Item;
+  const InputPassword = Input.Password;
+  const { t } = useI18n();
+  const { handleBackLogin, getLoginState } = useLoginState();
+  const { notification, createErrorModal } = useMessage();
+  const formRef = ref();
+  const loading = ref(false);
+  const formData = reactive({
+    account: '',
+    password: '',
+    confirmPassword: '',
+    mobile: '',
+    sms: '',
+    policy: false,
+  });
+  const { getFormRules } = useFormRules(formData);
+  const { validForm } = useFormValid(formRef);
+  const getShow = computed(() => unref(getLoginState) === LoginStateEnum.REGISTER);
+  /**
+   * 注册
+   */
+  async function handleRegister() {
+    const data = await validForm();
+    if (!data) return;
+    try {
+      loading.value = true;
+      const resultInfo = await register(
+        toRaw({
+          username: data.account,
+          password: data.password,
+          phone: data.mobile,
+          smscode: data.sms,
+        })
+      );
+      if (resultInfo && resultInfo.data.success) {
+        notification.success({
+          description: resultInfo.data.message || t('sys.api.registerMsg'),
+          duration: 3,
+        });
+        handleBackLogin();
+      } else {
+        notification.warning({
+          message: t('sys.api.errorTip'),
+          description: resultInfo.data.message || t('sys.api.networkExceptionMsg'),
           duration: 3,
         });
-      } finally {
-        loading.value = false;
       }
+    } catch (error) {
+      notification.error({
+        message: t('sys.api.errorTip'),
+        description: error.message || t('sys.api.networkExceptionMsg'),
+        duration: 3,
+      });
+    } finally {
+      loading.value = false;
     }
-    //发送验证码的函数
-    function sendCodeApi() {
-      return getCaptcha({mobile:formData.mobile,smsmode:SmsEnum.REGISTER});
-    }
+  }
+  //发送验证码的函数
+  function sendCodeApi() {
+    return getCaptcha({ mobile: formData.mobile, smsmode: SmsEnum.REGISTER });
+  }
 </script>
diff --git a/src/views/sys/login/ThirdModal.vue b/src/views/sys/login/ThirdModal.vue
index dad7b38..aa7a8df 100644
--- a/src/views/sys/login/ThirdModal.vue
+++ b/src/views/sys/login/ThirdModal.vue
@@ -1,70 +1,62 @@
 <template>
-    <!-- 第三方登录绑定账号密码输入弹框 -->
-    <a-modal title="请输入密码" v-model:visible="thirdPasswordShow" @ok="thirdLoginCheckPassword" @cancel="thirdLoginNoPassword">
-        <a-input-password placeholder="请输入密码" v-model:value="thirdLoginPassword" style="margin: 15px;width: 80%;"/>
-    </a-modal>
+  <!-- 第三方登录绑定账号密码输入弹框 -->
+  <a-modal title="请输入密码" v-model:visible="thirdPasswordShow" @ok="thirdLoginCheckPassword" @cancel="thirdLoginNoPassword">
+    <a-input-password placeholder="请输入密码" v-model:value="thirdLoginPassword" style="margin: 15px; width: 80%" />
+  </a-modal>
 
-    <!-- 第三方登录提示是否绑定账号弹框 -->
-    <a-modal :footer="null" :closable="false" v-model:visible="thirdConfirmShow" :class="'ant-modal-confirm'">
-        <div class="ant-modal-confirm-body-wrapper">
-            <div class="ant-modal-confirm-body">
-                <QuestionCircleFilled style="color: #faad14"/>
-                <span class="ant-modal-confirm-title">提示</span>
-                <div class="ant-modal-confirm-content">
-                    已有同名账号存在,请确认是否绑定该账号？
-                </div>
-            </div>
-            <div class="ant-modal-confirm-btns">
-                <a-button @click="thirdLoginUserCreate" :loading="thirdCreateUserLoding">创建新账号</a-button>
-                <a-button @click="thirdLoginUserBind" type="primary">确认绑定</a-button>
-            </div>
-        </div>
-    </a-modal>
+  <!-- 第三方登录提示是否绑定账号弹框 -->
+  <a-modal :footer="null" :closable="false" v-model:visible="thirdConfirmShow" :class="'ant-modal-confirm'">
+    <div class="ant-modal-confirm-body-wrapper">
+      <div class="ant-modal-confirm-body">
+        <QuestionCircleFilled style="color: #faad14" />
+        <span class="ant-modal-confirm-title">提示</span>
+        <div class="ant-modal-confirm-content"> 已有同名账号存在,请确认是否绑定该账号？ </div>
+      </div>
+      <div class="ant-modal-confirm-btns">
+        <a-button @click="thirdLoginUserCreate" :loading="thirdCreateUserLoding">创建新账号</a-button>
+        <a-button @click="thirdLoginUserBind" type="primary">确认绑定</a-button>
+      </div>
+    </div>
+  </a-modal>
 
-    <!-- 第三方登录绑定手机号 -->
-    <a-modal title="绑定手机号" v-model:visible="bindingPhoneModal" :maskClosable="false">
-        <Form class="p-4 enter-x" style="margin: 15px 10px">
-            <FormItem class="enter-x">
-                <a-input size="large" placeholder="请输入手机号" v-model:value="thirdPhone" class="fix-auto-fill">
-                    <template #prefix>
-                        <Icon icon="ant-design:mobile-outlined" :style="{ color: 'rgba(0,0,0,.25)' }"></Icon>
-                    </template>
-                </a-input>
-            </FormItem>
-            <FormItem name="sms" class="enter-x">
-                <CountdownInput
-                        size="large"
-                        class="fix-auto-fill"
-                        v-model:value="thirdCaptcha"
-                        placeholder="请输入验证码"
-                        :sendCodeApi="sendCodeApi"
-                >
-                <template #prefix>
-                    <Icon icon="ant-design:mail-outlined" :style="{ color: 'rgba(0,0,0,.25)' }"></Icon>
-                </template>
-              </CountdownInput>
-            </FormItem>
-        </Form>
-        <template #footer>
-            <a-button type="primary" @click="thirdHandleOk">确定</a-button>
-        </template>
-    </a-modal>
+  <!-- 第三方登录绑定手机号 -->
+  <a-modal title="绑定手机号" v-model:visible="bindingPhoneModal" :maskClosable="false">
+    <Form class="p-4 enter-x" style="margin: 15px 10px">
+      <FormItem class="enter-x">
+        <a-input size="large" placeholder="请输入手机号" v-model:value="thirdPhone" class="fix-auto-fill">
+          <template #prefix>
+            <Icon icon="ant-design:mobile-outlined" :style="{ color: 'rgba(0,0,0,.25)' }"></Icon>
+          </template>
+        </a-input>
+      </FormItem>
+      <FormItem name="sms" class="enter-x">
+        <CountdownInput size="large" class="fix-auto-fill" v-model:value="thirdCaptcha" placeholder="请输入验证码" :sendCodeApi="sendCodeApi">
+          <template #prefix>
+            <Icon icon="ant-design:mail-outlined" :style="{ color: 'rgba(0,0,0,.25)' }"></Icon>
+          </template>
+        </CountdownInput>
+      </FormItem>
+    </Form>
+    <template #footer>
+      <a-button type="primary" @click="thirdHandleOk">确定</a-button>
+    </template>
+  </a-modal>
 </template>
 <script lang="ts">
-    import {defineComponent} from 'vue';
-    import {Form, Input} from 'ant-design-vue';
-    import { CountdownInput } from '/@/components/CountDown';
-    import {useThirdLogin} from '/@/hooks/system/useThirdLogin';
-    const FormItem = Form.Item;
-    const InputPassword = Input.Password;
+  import { defineComponent } from 'vue';
+  import { Form, Input } from 'ant-design-vue';
+  import { CountdownInput } from '/@/components/CountDown';
+  import { useThirdLogin } from '/@/hooks/system/useThirdLogin';
+  const FormItem = Form.Item;
+  const InputPassword = Input.Password;
 
-    export default defineComponent({
-        name: 'ThirdModal',
-        components: { FormItem, Form,InputPassword, CountdownInput},
-        setup() {
-            return {
-                ...useThirdLogin()
-            }
-        }
-    })
+  export default defineComponent({
+    name: 'ThirdModal',
+    components: { FormItem, Form, InputPassword, CountdownInput },
+    setup() {
+      return {
+        ...useThirdLogin(),
+      };
+    },
+  });
 </script>
diff --git a/src/views/sys/login/useLogin.ts b/src/views/sys/login/useLogin.ts
index 3c766e7..34456be 100644
--- a/src/views/sys/login/useLogin.ts
+++ b/src/views/sys/login/useLogin.ts
@@ -2,8 +2,8 @@ import type { ValidationRule } from 'ant-design-vue/lib/form/Form';
 import type { RuleObject } from 'ant-design-vue/lib/form/interface';
 import { ref, computed, unref, Ref } from 'vue';
 import { useI18n } from '/@/hooks/web/useI18n';
-import { checkOnlyUser } from "/@/api/sys/user";
-import {defHttp} from "/@/utils/http/axios";
+import { checkOnlyUser } from '/@/api/sys/user';
+import { defHttp } from '/@/utils/http/axios';
 
 export enum LoginStateEnum {
   LOGIN,
@@ -14,9 +14,9 @@ export enum LoginStateEnum {
 }
 
 export enum SmsEnum {
-  LOGIN  = "0",
-  REGISTER = "1",
-  FORGET_PASSWORD = "2",
+  LOGIN = '0',
+  REGISTER = '1',
+  FORGET_PASSWORD = '2',
 }
 const currentState = ref(LoginStateEnum.LOGIN);
 
@@ -52,11 +52,9 @@ export function useFormRules(formData?: Recordable) {
   const getPasswordFormRule = computed(() => createRule(t('sys.login.passwordPlaceholder')));
   const getSmsFormRule = computed(() => createRule(t('sys.login.smsPlaceholder')));
   const getMobileFormRule = computed(() => createRule(t('sys.login.mobilePlaceholder')));
-  
-  
+
   const getRegisterAccountRule = computed(() => createRegisterAccountRule('account'));
   const getRegisterMobileRule = computed(() => createRegisterAccountRule('mobile'));
-  
 
   const validatePolicy = async (_: RuleObject, value: boolean) => {
     return !value ? Promise.reject(t('sys.login.policyPlaceholder')) : Promise.resolve();
@@ -79,7 +77,7 @@ export function useFormRules(formData?: Recordable) {
     const passwordFormRule = unref(getPasswordFormRule);
     const smsFormRule = unref(getSmsFormRule);
     const mobileFormRule = unref(getMobileFormRule);
-    
+
     const registerAccountRule = unref(getRegisterAccountRule);
     const registerMobileRule = unref(getRegisterMobileRule);
 
@@ -95,9 +93,7 @@ export function useFormRules(formData?: Recordable) {
           password: passwordFormRule,
           mobile: registerMobileRule,
           sms: smsFormRule,
-          confirmPassword: [
-            { validator: validateConfirmPassword(formData?.password), trigger: 'change' },
-          ],
+          confirmPassword: [{ validator: validateConfirmPassword(formData?.password), trigger: 'change' }],
           policy: [{ validator: validatePolicy, trigger: 'change' }],
         };
 
@@ -105,9 +101,7 @@ export function useFormRules(formData?: Recordable) {
       case LoginStateEnum.RESET_PASSWORD:
         return {
           username: accountFormRule,
-          confirmPassword: [
-            { validator: validateConfirmPassword(formData?.password), trigger: 'change' },
-          ],
+          confirmPassword: [{ validator: validateConfirmPassword(formData?.password), trigger: 'change' }],
           ...mobileRule,
         };
 
@@ -136,35 +130,36 @@ function createRule(message: string) {
   ];
 }
 function createRegisterAccountRule(type) {
-  return [{
-      validator: type=='account'?checkUsername:checkPhone,
-      trigger: 'change'
-    }
+  return [
+    {
+      validator: type == 'account' ? checkUsername : checkPhone,
+      trigger: 'change',
+    },
   ];
 }
 
- function checkUsername(rule, value, callback) {
+function checkUsername(rule, value, callback) {
   const { t } = useI18n();
-  if(!value){
-    return Promise.reject(t('sys.login.accountPlaceholder'))
-  }else{
+  if (!value) {
+    return Promise.reject(t('sys.login.accountPlaceholder'));
+  } else {
     return new Promise((resolve, reject) => {
-      checkOnlyUser({username: value}).then((res) => {
-        res.success?resolve():reject("用户名已存在!");
-      })
-    })
+      checkOnlyUser({ username: value }).then((res) => {
+        res.success ? resolve() : reject('用户名已存在!');
+      });
+    });
   }
 }
 async function checkPhone(rule, value, callback) {
   const { t } = useI18n();
-  var reg=/^1[3456789]\d{9}$/
-  if(!reg.test(value)){
-    return Promise.reject(new Error("请输入正确手机号"))
-  }else{
+  var reg = /^1[3456789]\d{9}$/;
+  if (!reg.test(value)) {
+    return Promise.reject(new Error('请输入正确手机号'));
+  } else {
     return new Promise((resolve, reject) => {
-      checkOnlyUser({phone: value}).then((res) => {
-        res.success?resolve():reject("手机号已存在!");
-      })
-    })
+      checkOnlyUser({ phone: value }).then((res) => {
+        res.success ? resolve() : reject('手机号已存在!');
+      });
+    });
   }
 }
diff --git a/src/views/system/address/address.api.ts b/src/views/system/address/address.api.ts
index cb20fff..4890d34 100644
--- a/src/views/system/address/address.api.ts
+++ b/src/views/system/address/address.api.ts
@@ -1,20 +1,19 @@
-import { defHttp } from '/@/utils/http/axios'
+import { defHttp } from '/@/utils/http/axios';
 
 export enum Api {
-  list='/sys/user/queryByOrgCodeForAddressList',
-  positionList='/sys/position/list',  
+  list = '/sys/user/queryByOrgCodeForAddressList',
+  positionList = '/sys/position/list',
   queryDepartTreeSync = '/sys/sysDepart/queryDepartTreeSync',
 }
 /**
  * 获取部门树列表
  */
-export const queryDepartTreeSync = (params?) => defHttp.get({ url: Api.queryDepartTreeSync, params })
+export const queryDepartTreeSync = (params?) => defHttp.get({ url: Api.queryDepartTreeSync, params });
 /**
  * 部门用户信息
  */
-export const list = (params?) => defHttp.get({ url: Api.list, params })
+export const list = (params?) => defHttp.get({ url: Api.list, params });
 /**
  * 职务list
  */
-export const positionList = (params?) => defHttp.get({ url: Api.positionList, params })
-
+export const positionList = (params?) => defHttp.get({ url: Api.positionList, params });
diff --git a/src/views/system/address/address.data.ts b/src/views/system/address/address.data.ts
index de8919c..ffa5945 100644
--- a/src/views/system/address/address.data.ts
+++ b/src/views/system/address/address.data.ts
@@ -1,51 +1,51 @@
-import { FormSchema } from '/@/components/Form'
-import {BasicColumn} from '/@/components/Table';
+import { FormSchema } from '/@/components/Form';
+import { BasicColumn } from '/@/components/Table';
 
 export const columns: BasicColumn[] = [
-    {
-        title: '姓名',
-        dataIndex: 'realname',
-        width: 150,
-    },
-    {
-        title: '工号',
-        dataIndex: 'workNo',
-        width: 100,
-    },
-    {
-        title: '部门',
-        dataIndex: 'departName',
-        width: 200
-    },
-    {
-        title: '职务',
-        dataIndex: 'post',
-        width: 150,
-        slots: { customRender: 'post' },
-    },
-    {
-        title: '手机',
-        width: 150,
-        dataIndex: 'telephone',
-    },
-    {
-        title: '邮箱',
-        width: 150,
-        dataIndex: 'email',
-    }
+  {
+    title: '姓名',
+    dataIndex: 'realname',
+    width: 150,
+  },
+  {
+    title: '工号',
+    dataIndex: 'workNo',
+    width: 100,
+  },
+  {
+    title: '部门',
+    dataIndex: 'departName',
+    width: 200,
+  },
+  {
+    title: '职务',
+    dataIndex: 'post',
+    width: 150,
+    slots: { customRender: 'post' },
+  },
+  {
+    title: '手机',
+    width: 150,
+    dataIndex: 'telephone',
+  },
+  {
+    title: '邮箱',
+    width: 150,
+    dataIndex: 'email',
+  },
 ];
 
 export const searchFormSchema: FormSchema[] = [
-    {
-        label: '姓名',
-        field: 'realname',
-        component: 'Input',
-        colProps: {span: 6}
-    },
-    {
-        label: '工号',
-        field: 'workNo',
-        component: 'Input',
-        colProps: {span: 6},
-    }
+  {
+    label: '姓名',
+    field: 'realname',
+    component: 'Input',
+    colProps: { span: 6 },
+  },
+  {
+    label: '工号',
+    field: 'workNo',
+    component: 'Input',
+    colProps: { span: 6 },
+  },
 ];
diff --git a/src/views/system/address/components/DepartLeftTree.vue b/src/views/system/address/components/DepartLeftTree.vue
index 2e023a9..f371062 100644
--- a/src/views/system/address/components/DepartLeftTree.vue
+++ b/src/views/system/address/components/DepartLeftTree.vue
@@ -1,159 +1,158 @@
 <template>
-  <a-card :bordered="false" style="height: 100%;">
+  <a-card :bordered="false" style="height: 100%">
     <a-spin :spinning="loading">
-      <a-input-search placeholder="按部门名称搜索…" style="margin-bottom: 10px" @search="onSearch" allowClear/>
+      <a-input-search placeholder="按部门名称搜索…" style="margin-bottom: 10px" @search="onSearch" allowClear />
       <!--组织机构树-->
       <template v-if="treeData.length > 0">
         <a-tree
-            v-if="!treeReloading"
-            showLine
-            :clickRowToExpand="false"
-            :treeData="treeData"
-            :selectedKeys="selectedKeys"
-            :load-data="loadChildrenTreeData"
-            v-model:expandedKeys="expandedKeys"
-            @select="onSelect"
+          v-if="!treeReloading"
+          showLine
+          :clickRowToExpand="false"
+          :treeData="treeData"
+          :selectedKeys="selectedKeys"
+          :load-data="loadChildrenTreeData"
+          v-model:expandedKeys="expandedKeys"
+          @select="onSelect"
         ></a-tree>
       </template>
-      <a-empty v-else description="暂无数据"/>
+      <a-empty v-else description="暂无数据" />
     </a-spin>
   </a-card>
 </template>
 
 <script lang="ts" setup>
-import { inject, nextTick, ref, unref, defineExpose } from 'vue'
-import { queryDepartTreeSync } from '../address.api'
-import { searchByKeywords } from '/@/views/system/departUser/depart.user.api'
-import { Popconfirm } from 'ant-design-vue'
+  import { inject, nextTick, ref, unref, defineExpose } from 'vue';
+  import { queryDepartTreeSync } from '../address.api';
+  import { searchByKeywords } from '/@/views/system/departUser/depart.user.api';
+  import { Popconfirm } from 'ant-design-vue';
 
-const prefixCls = inject('prefixCls')
-const emit = defineEmits(['select', 'rootTreeData'])
+  const prefixCls = inject('prefixCls');
+  const emit = defineEmits(['select', 'rootTreeData']);
 
-const loading = ref<boolean>(false)
-// 部门树列表数据
-const treeData = ref<any[]>([])
-// 当前展开的项
-const expandedKeys = ref<any[]>([])
-// 当前选中的项
-const selectedKeys = ref<any[]>([])
-// 树组件重新加载
-const treeReloading = ref<boolean>(false)
-// 当前选中的部门
-const currentDepart = ref<any>(null)
-// 搜索关键字
-const searchKeyword = ref('')
+  const loading = ref<boolean>(false);
+  // 部门树列表数据
+  const treeData = ref<any[]>([]);
+  // 当前展开的项
+  const expandedKeys = ref<any[]>([]);
+  // 当前选中的项
+  const selectedKeys = ref<any[]>([]);
+  // 树组件重新加载
+  const treeReloading = ref<boolean>(false);
+  // 当前选中的部门
+  const currentDepart = ref<any>(null);
+  // 搜索关键字
+  const searchKeyword = ref('');
 
-// 加载顶级部门信息
-async function loadRootTreeData() {
-  try {
-    loading.value = true
-    treeData.value = []
-    const result = await queryDepartTreeSync()
-    if (Array.isArray(result)) {
-      treeData.value = result
+  // 加载顶级部门信息
+  async function loadRootTreeData() {
+    try {
+      loading.value = true;
+      treeData.value = [];
+      const result = await queryDepartTreeSync();
+      if (Array.isArray(result)) {
+        treeData.value = result;
+      }
+      if (expandedKeys.value.length === 0) {
+        autoExpandParentNode();
+      }
+    } finally {
+      loading.value = false;
     }
-    if (expandedKeys.value.length === 0) {
-      autoExpandParentNode()
-    }
-  } finally {
-    loading.value = false
   }
-}
 
-loadRootTreeData()
+  loadRootTreeData();
 
-// 加载子级部门信息
-async function loadChildrenTreeData(treeNode) {
-  try {
-    const result = await queryDepartTreeSync({
-      pid: treeNode.dataRef.id,
-    })
-    if (result.length == 0) {
-      treeNode.dataRef.isLeaf = true
-    } else {
-      treeNode.dataRef.children = result
-      if (expandedKeys.value.length > 0) {
-        // 判断获取的子级是否有当前展开的项
-        let subKeys: any[] = []
-        for (let key of expandedKeys.value) {
-          if (result.findIndex(item => item.id === key) !== -1) {
-            subKeys.push(key)
+  // 加载子级部门信息
+  async function loadChildrenTreeData(treeNode) {
+    try {
+      const result = await queryDepartTreeSync({
+        pid: treeNode.dataRef.id,
+      });
+      if (result.length == 0) {
+        treeNode.dataRef.isLeaf = true;
+      } else {
+        treeNode.dataRef.children = result;
+        if (expandedKeys.value.length > 0) {
+          // 判断获取的子级是否有当前展开的项
+          let subKeys: any[] = [];
+          for (let key of expandedKeys.value) {
+            if (result.findIndex((item) => item.id === key) !== -1) {
+              subKeys.push(key);
+            }
+          }
+          if (subKeys.length > 0) {
+            expandedKeys.value = [...expandedKeys.value];
           }
         }
-        if (subKeys.length > 0) {
-          expandedKeys.value = [...expandedKeys.value]
+      }
+      treeData.value = [...treeData.value];
+    } catch (e) {
+      console.error(e);
+    }
+    return Promise.resolve();
+  }
+
+  // 自动展开父节点，只展开一级
+  function autoExpandParentNode() {
+    let item = treeData.value[0];
+    if (item) {
+      if (!item.isLeaf) {
+        expandedKeys.value = [item.key];
+      }
+      reloadTree();
+    }
+  }
+
+  // 重新加载树组件，防止无法默认展开数据
+  async function reloadTree() {
+    await nextTick();
+    treeReloading.value = true;
+    await nextTick();
+    treeReloading.value = false;
+  }
+
+  /**
+   * 设置当前选中的行
+   */
+  function setSelectedKey(key: string, data?: object) {
+    selectedKeys.value = [key];
+    if (data) {
+      currentDepart.value = data;
+      emit('select', data);
+    }
+  }
+
+  // 搜索事件
+  async function onSearch(value: string) {
+    if (value) {
+      try {
+        loading.value = true;
+        treeData.value = [];
+        let result = await searchByKeywords({ keyWord: value });
+        if (Array.isArray(result)) {
+          treeData.value = result;
         }
+        autoExpandParentNode();
+      } finally {
+        loading.value = false;
       }
+    } else {
+      loadRootTreeData();
     }
-    treeData.value = [...treeData.value]
-  } catch (e) {
-    console.error(e)
+    searchKeyword.value = value;
   }
-  return Promise.resolve()
-}
 
-// 自动展开父节点，只展开一级
-function autoExpandParentNode() {
-  let item = treeData.value[0]
-  if (item) {
-    if (!item.isLeaf) {
-      expandedKeys.value = [item.key]
+  // 树选择事件
+  function onSelect(selKeys, event) {
+    if (selKeys.length > 0 && selectedKeys.value[0] !== selKeys[0]) {
+      setSelectedKey(selKeys[0], event.selectedNodes[0].props);
+    } else {
+      // 这样可以防止用户取消选择
+      setSelectedKey(selectedKeys.value[0]);
     }
-    reloadTree()
   }
-}
 
-// 重新加载树组件，防止无法默认展开数据
-async function reloadTree() {
-  await nextTick()
-  treeReloading.value = true
-  await nextTick()
-  treeReloading.value = false
-}
-
-/**
- * 设置当前选中的行
- */
-function setSelectedKey(key: string, data?: object) {
-  selectedKeys.value = [key]
-  if (data) {
-    currentDepart.value = data
-    emit('select', data)
-  }
-}
-
-// 搜索事件
-async function onSearch(value: string) {
-  if (value) {
-    try {
-      loading.value = true
-      treeData.value = []
-      let result = await searchByKeywords({ keyWord: value })
-      if (Array.isArray(result)) {
-        treeData.value = result
-      }
-      autoExpandParentNode()
-    } finally {
-      loading.value = false
-    }
-  } else {
-    loadRootTreeData()
-  }
-  searchKeyword.value = value
-}
-
-// 树选择事件
-function onSelect(selKeys, event) {
-  if (selKeys.length > 0 && selectedKeys.value[0] !== selKeys[0]) {
-    setSelectedKey(selKeys[0], event.selectedNodes[0].props)
-  } else {
-    // 这样可以防止用户取消选择
-    setSelectedKey(selectedKeys.value[0])
-  }
-}
-
-
-defineExpose({
-  loadRootTreeData,
-})
+  defineExpose({
+    loadRootTreeData,
+  });
 </script>
diff --git a/src/views/system/address/index.less b/src/views/system/address/index.less
index 1e98464..82554ac 100644
--- a/src/views/system/address/index.less
+++ b/src/views/system/address/index.less
@@ -7,5 +7,4 @@
       padding: 0 20px;
     }
   }
-
-}
\ No newline at end of file
+}
diff --git a/src/views/system/address/index.vue b/src/views/system/address/index.vue
index c16105e..6b2f328 100644
--- a/src/views/system/address/index.vue
+++ b/src/views/system/address/index.vue
@@ -1,83 +1,88 @@
 <template>
-    <a-row :class="['p-4', `${prefixCls}--box`]" type="flex" :gutter="10" style="max-height: 800px">
-        <a-col :xl="6" :lg="24" :md="24" style="margin-bottom: 10px;">
-            <DepartLeftTree ref="leftTree" @select="onTreeSelect"/>
-        </a-col>
-        <a-col :xl="18" :lg="24" :md="24" style="margin-bottom: 10px;">
-            <div style="height: 100%; background-color: white;">
-                <!--引用表格-->
-                <BasicTable @register="registerTable">
-                    <template #post="{text}">
-                         {{(text || '').split(',').map(t => positionInfo[t] ? positionInfo[t] : t).join(',')}}
-                    </template>
-                </BasicTable>
-            </div>
-        </a-col>
-    </a-row>
+  <a-row :class="['p-4', `${prefixCls}--box`]" type="flex" :gutter="10" style="max-height: 800px">
+    <a-col :xl="6" :lg="24" :md="24" style="margin-bottom: 10px">
+      <DepartLeftTree ref="leftTree" @select="onTreeSelect" />
+    </a-col>
+    <a-col :xl="18" :lg="24" :md="24" style="margin-bottom: 10px">
+      <div style="height: 100%; background-color: white">
+        <!--引用表格-->
+        <BasicTable @register="registerTable">
+          <template #post="{ text }">
+            {{
+              (text || '')
+                .split(',')
+                .map((t) => (positionInfo[t] ? positionInfo[t] : t))
+                .join(',')
+            }}
+          </template>
+        </BasicTable>
+      </div>
+    </a-col>
+  </a-row>
 </template>
 
 <script lang="ts" setup>
-    import {provide, ref, unref} from 'vue'
-    import {useDesign} from '/@/hooks/web/useDesign'
-    import DepartLeftTree from './components/DepartLeftTree.vue'
-    import {BasicTable} from '/@/components/Table';
-    import {useListPage} from '/@/hooks/system/useListPage'
-    import {columns, searchFormSchema} from './address.data';
-    import {list, positionList} from './address.api';
+  import { provide, ref, unref } from 'vue';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import DepartLeftTree from './components/DepartLeftTree.vue';
+  import { BasicTable } from '/@/components/Table';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import { columns, searchFormSchema } from './address.data';
+  import { list, positionList } from './address.api';
 
-    const {prefixCls} = useDesign('address-list');
-    provide('prefixCls', prefixCls);
+  const { prefixCls } = useDesign('address-list');
+  provide('prefixCls', prefixCls);
 
-    // 给子组件定义一个ref变量
-    const leftTree = ref();
+  // 给子组件定义一个ref变量
+  const leftTree = ref();
 
-    // 当前选中的部门code
-    const orgCode = ref('');
-    const positionInfo = ref({});
+  // 当前选中的部门code
+  const orgCode = ref('');
+  const positionInfo = ref({});
 
-    // 列表页面公共参数、方法
-    const {tableContext} = useListPage({
-        tableProps: {
-            api: list,
-            columns,
-            rowKey: 'id',
-            showIndexColumn: true,
-            formConfig: {
-                labelWidth: 200,
-                schemas: searchFormSchema,
-            },
-            canResize: false,
-            actionColumn: null,
-            showTableSetting: false,
-            // 请求之前对参数做处理
-            beforeFetch(params) {
-                params.orgCode = orgCode.value
-            },
-        }
-    });
-    //注册table数据
-    const [registerTable, {reload}] = tableContext;
+  // 列表页面公共参数、方法
+  const { tableContext } = useListPage({
+    tableProps: {
+      api: list,
+      columns,
+      rowKey: 'id',
+      showIndexColumn: true,
+      formConfig: {
+        labelWidth: 200,
+        schemas: searchFormSchema,
+      },
+      canResize: false,
+      actionColumn: null,
+      showTableSetting: false,
+      // 请求之前对参数做处理
+      beforeFetch(params) {
+        params.orgCode = orgCode.value;
+      },
+    },
+  });
+  //注册table数据
+  const [registerTable, { reload }] = tableContext;
 
-    // 左侧树选择后触发
-    function onTreeSelect(data) {
-        orgCode.value = data.orgCode;
-        reload();
+  // 左侧树选择后触发
+  function onTreeSelect(data) {
+    orgCode.value = data.orgCode;
+    reload();
+  }
+
+  // 查询职务信息
+  async function queryPositionInfo() {
+    const result = await positionList({ pageSize: 99999 });
+    if (result) {
+      let obj = {};
+      result.records.forEach((position) => {
+        obj[position['code']] = position['name'];
+      });
+      positionInfo.value = obj;
     }
-
-    // 查询职务信息
-    async function queryPositionInfo() {
-        const result = await positionList({pageSize: 99999});
-        if (result) {
-            let obj = {}
-            result.records.forEach(position => {
-                obj[position['code']] = position['name']
-            })
-            positionInfo.value = obj;
-        }
-    }
-    queryPositionInfo();
+  }
+  queryPositionInfo();
 </script>
 
 <style lang="less" scoped>
-    @import "./index.less";
+  @import './index.less';
 </style>
diff --git a/src/views/system/category/category.api.ts b/src/views/system/category/category.api.ts
index 591ef0b..9295745 100644
--- a/src/views/system/category/category.api.ts
+++ b/src/views/system/category/category.api.ts
@@ -1,10 +1,10 @@
-import {defHttp} from "/@/utils/http/axios";
-import {Modal} from 'ant-design-vue';
+import { defHttp } from '/@/utils/http/axios';
+import { Modal } from 'ant-design-vue';
 
 enum Api {
   list = '/sys/category/rootList',
-  save='/sys/category/add',
-  edit='/sys/category/edit',
+  save = '/sys/category/add',
+  edit = '/sys/category/edit',
   deleteCategory = '/sys/category/delete',
   deleteBatch = '/sys/category/deleteBatch',
   importExcel = '/sys/category/importExcel',
@@ -27,16 +27,15 @@ export const getImportUrl = Api.importExcel;
  * 列表接口
  * @param params
  */
-export const list = (params) =>
-  defHttp.get({url: Api.list, params});
+export const list = (params) => defHttp.get({ url: Api.list, params });
 /**
  * 删除
  */
-export const deleteCategory = (params,handleSuccess) => {
-  return defHttp.delete({url: Api.deleteCategory, params}, {joinParamsToUrl: true}).then(() => {
+export const deleteCategory = (params, handleSuccess) => {
+  return defHttp.delete({ url: Api.deleteCategory, params }, { joinParamsToUrl: true }).then(() => {
     handleSuccess();
   });
-}
+};
 /**
  * 批量删除
  * @param params
@@ -48,35 +47,32 @@ export const batchDeleteCategory = (params, handleSuccess) => {
     okText: '确认',
     cancelText: '取消',
     onOk: () => {
-      return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
+      return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => {
         handleSuccess();
       });
-    }
+    },
   });
-}
+};
 /**
  * 保存或者更新
  * @param params
  */
 export const saveOrUpdateDict = (params, isUpdate) => {
   let url = isUpdate ? Api.edit : Api.save;
-  return defHttp.post({url: url, params});
-}
+  return defHttp.post({ url: url, params });
+};
 /**
  * 查询全部树形节点数据
  * @param params
  */
-export const loadTreeData = (params) =>
-  defHttp.get({url: Api.loadTreeData,params});
+export const loadTreeData = (params) => defHttp.get({ url: Api.loadTreeData, params });
 /**
  * 查询子节点数据
  * @param params
  */
-export const getChildList = (params) =>
-  defHttp.get({url: Api.getChildList, params});
+export const getChildList = (params) => defHttp.get({ url: Api.getChildList, params });
 /**
  * 批量查询子节点数据
  * @param params
  */
-export const getChildListBatch = (params) =>
-  defHttp.get({url: Api.getChildListBatch, params},{isTransformResponse:false});
+export const getChildListBatch = (params) => defHttp.get({ url: Api.getChildListBatch, params }, { isTransformResponse: false });
diff --git a/src/views/system/category/category.data.ts b/src/views/system/category/category.data.ts
index 2f4ee92..c1f117f 100644
--- a/src/views/system/category/category.data.ts
+++ b/src/views/system/category/category.data.ts
@@ -1,5 +1,5 @@
-import {BasicColumn} from '/@/components/Table';
-import {FormSchema} from '/@/components/Table';
+import { BasicColumn } from '/@/components/Table';
+import { FormSchema } from '/@/components/Table';
 
 export const columns: BasicColumn[] = [
   {
@@ -11,21 +11,22 @@ export const columns: BasicColumn[] = [
   {
     title: '分类编码',
     dataIndex: 'code',
-  }];
+  },
+];
 
 export const searchFormSchema: FormSchema[] = [
-    {
-        label: '名称',
-        field: 'name',
-        component: 'Input',
-        colProps: {span: 6},
-    },
-    {
-        label: '编码',
-        field: 'code',
-        component: 'Input',
-        colProps: {span: 6},
-    }
+  {
+    label: '名称',
+    field: 'name',
+    component: 'Input',
+    colProps: { span: 6 },
+  },
+  {
+    label: '编码',
+    field: 'code',
+    component: 'Input',
+    colProps: { span: 6 },
+  },
 ];
 
 export const formSchema: FormSchema[] = [
@@ -33,7 +34,7 @@ export const formSchema: FormSchema[] = [
     label: '',
     field: 'id',
     component: 'Input',
-    show:false
+    show: false,
   },
   {
     label: '父级节点',
@@ -43,15 +44,15 @@ export const formSchema: FormSchema[] = [
       replaceFields: {
         value: 'key',
       },
-      dropdownStyle:{
-        maxHeight:'50vh'
+      dropdownStyle: {
+        maxHeight: '50vh',
       },
-      getPopupContainer: () => document.body
+      getPopupContainer: () => document.body,
     },
-    show: ({values}) => {
-       return values.pid !== '0';
+    show: ({ values }) => {
+      return values.pid !== '0';
     },
-    dynamicDisabled: ({values}) => {
+    dynamicDisabled: ({ values }) => {
       return !!values.id;
     },
   },
@@ -60,6 +61,5 @@ export const formSchema: FormSchema[] = [
     field: 'name',
     required: true,
     component: 'Input',
-  }
+  },
 ];
-
diff --git a/src/views/system/category/components/CategoryModal.vue b/src/views/system/category/components/CategoryModal.vue
index d7d3a4f..3a3ffb9 100644
--- a/src/views/system/category/components/CategoryModal.vue
+++ b/src/views/system/category/components/CategoryModal.vue
@@ -1,21 +1,21 @@
 <template>
   <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
-    <BasicForm @register="registerForm"/>
+    <BasicForm @register="registerForm" />
   </BasicModal>
 </template>
 <script lang="ts" setup>
-  import {ref, computed, unref} from 'vue';
-  import {BasicModal, useModalInner} from '/src/components/Modal';
-  import {BasicForm, useForm} from '/src/components/Form';
-  import {formSchema} from '../category.data';
-  import {loadTreeData, saveOrUpdateDict} from '../category.api';
+  import { ref, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/src/components/Modal';
+  import { BasicForm, useForm } from '/src/components/Form';
+  import { formSchema } from '../category.data';
+  import { loadTreeData, saveOrUpdateDict } from '../category.api';
   // 获取emit
   const emit = defineEmits(['register', 'success']);
   const isUpdate = ref(true);
   const expandedRowKeys = ref([]);
   const treeData = ref([]);
   //表单配置
-  const [registerForm, {resetFields, setFieldsValue, validate, updateSchema}] = useForm({
+  const [registerForm, { resetFields, setFieldsValue, validate, updateSchema }] = useForm({
     schemas: formSchema,
     showActionButtonGroup: false,
     labelCol: {
@@ -28,11 +28,11 @@
     },
   });
   //表单赋值
-  const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
     //重置表单
     await resetFields();
     expandedRowKeys.value = [];
-    setModalProps({confirmLoading: false, minHeight: 80});
+    setModalProps({ confirmLoading: false, minHeight: 80 });
     isUpdate.value = !!data?.isUpdate;
     if (data?.record) {
       //表单赋值
@@ -41,10 +41,10 @@
       });
     }
     //父级节点树信息
-    treeData.value = await loadTreeData({'async': false,'pcode':''});
+    treeData.value = await loadTreeData({ async: false, pcode: '' });
     updateSchema({
       field: 'pid',
-      componentProps: {treeData},
+      componentProps: { treeData },
     });
   });
   //设置标题
@@ -55,14 +55,14 @@
    * @param pid
    * @param arr
    */
-  function getExpandKeysByPid(pid,arr){
-    if(pid && arr && arr.length>0){
-      for(let i=0;i<arr.length;i++){
-        if(arr[i].key==pid && unref(expandedRowKeys).indexOf(pid)<0){
+  function getExpandKeysByPid(pid, arr) {
+    if (pid && arr && arr.length > 0) {
+      for (let i = 0; i < arr.length; i++) {
+        if (arr[i].key == pid && unref(expandedRowKeys).indexOf(pid) < 0) {
           expandedRowKeys.value.push(arr[i].key);
-          getExpandKeysByPid(arr[i]['parentId'],unref(treeData))
-        }else{
-          getExpandKeysByPid(pid,arr[i].children)
+          getExpandKeysByPid(arr[i]['parentId'], unref(treeData));
+        } else {
+          getExpandKeysByPid(pid, arr[i].children);
         }
       }
     }
@@ -71,17 +71,17 @@
   async function handleSubmit() {
     try {
       let values = await validate();
-      setModalProps({confirmLoading: true});
+      setModalProps({ confirmLoading: true });
       //提交表单
       await saveOrUpdateDict(values, isUpdate.value);
       //关闭弹窗
       closeModal();
       //展开的节点信息
-      await getExpandKeysByPid(values['pid'],unref(treeData))
+      await getExpandKeysByPid(values['pid'], unref(treeData));
       //刷新列表(isUpdate:是否编辑;values:表单信息;expandedArr:展开的节点信息)
-      emit('success', {isUpdate: unref(isUpdate), values:{...values},expandedArr: unref(expandedRowKeys).reverse()});
+      emit('success', { isUpdate: unref(isUpdate), values: { ...values }, expandedArr: unref(expandedRowKeys).reverse() });
     } finally {
-      setModalProps({confirmLoading: false});
+      setModalProps({ confirmLoading: false });
     }
   }
 </script>
diff --git a/src/views/system/category/index.vue b/src/views/system/category/index.vue
index 42de9d4..0986017 100644
--- a/src/views/system/category/index.vue
+++ b/src/views/system/category/index.vue
@@ -1,13 +1,13 @@
 <template>
-  <div >
+  <div>
     <!--引用表格-->
     <BasicTable @register="registerTable" :rowSelection="rowSelection" :expandedRowKeys="expandedRowKeys" @expand="handleExpand" @fetch-success="onFetchSuccess">
       <!--插槽:table标题-->
       <template #tableTitle>
-          <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增</a-button>
-          <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
-          <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
-          <a-dropdown v-if="selectedRowKeys.length > 0">
+        <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增</a-button>
+        <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
+        <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
+        <a-dropdown v-if="selectedRowKeys.length > 0">
           <template #overlay>
             <a-menu>
               <a-menu-item key="1" @click="batchHandleDelete">
@@ -16,38 +16,38 @@
               </a-menu-item>
             </a-menu>
           </template>
-          <a-button>批量操作
+          <a-button
+            >批量操作
             <Icon icon="ant-design:down-outlined"></Icon>
           </a-button>
         </a-dropdown>
       </template>
       <!--操作栏-->
       <template #action="{ record }">
-        <TableAction :actions="getTableAction(record)"/>
+        <TableAction :actions="getTableAction(record)" />
       </template>
     </BasicTable>
     <!--字典弹窗-->
-    <CategoryModal @register="registerModal" @success="handleSuccess"/>
+    <CategoryModal @register="registerModal" @success="handleSuccess" />
   </div>
 </template>
 
 <script lang="ts" name="system-category" setup>
   //ts语法
-  import {ref, computed, unref, toRaw, nextTick} from 'vue';
-  import {BasicTable, useTable, TableAction} from '/src/components/Table';
-  import {useDrawer} from '/src/components/Drawer';
+  import { ref, computed, unref, toRaw, nextTick } from 'vue';
+  import { BasicTable, useTable, TableAction } from '/src/components/Table';
+  import { useDrawer } from '/src/components/Drawer';
   import CategoryModal from './components/CategoryModal.vue';
-  import {useModal} from '/src/components/Modal';
-  import {useMethods} from '/src/hooks/system/useMethods';
-  import {columns,searchFormSchema} from './category.data';
-  import {list, deleteCategory, batchDeleteCategory, getExportUrl,getImportUrl, getChildList,getChildListBatch} from './category.api';
+  import { useModal } from '/src/components/Modal';
+  import { useMethods } from '/src/hooks/system/useMethods';
+  import { columns, searchFormSchema } from './category.data';
+  import { list, deleteCategory, batchDeleteCategory, getExportUrl, getImportUrl, getChildList, getChildListBatch } from './category.api';
   import { useListPage } from '/@/hooks/system/useListPage';
 
-
   const expandedRowKeys = ref([]);
-  const {handleExportXls,handleImportXls} = useMethods();
+  const { handleExportXls, handleImportXls } = useMethods();
   //字典model
-  const [registerModal, {openModal}] = useModal();
+  const [registerModal, { openModal }] = useModal();
   // 列表页面公共参数、方法
   const { prefixCls, onExportXls, onImportXls, tableContext } = useListPage({
     designScope: 'category-template',
@@ -63,18 +63,16 @@
       },
     },
     exportConfig: {
-       name:"分类字典列表",
-       url: getExportUrl,
+      name: '分类字典列表',
+      url: getExportUrl,
     },
     importConfig: {
-       url: getImportUrl
-    }
-  })
-
+      url: getImportUrl,
+    },
+  });
 
   //注册table数据
-  const [registerTable, {reload, collapseAll, updateTableDataRecord, findTableDataRecord,getDataSource},{ rowSelection, selectedRowKeys }] = tableContext;
-
+  const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] = tableContext;
 
   /**
    * 新增事件
@@ -110,21 +108,20 @@
    * 删除事件
    */
   async function handleDelete(record) {
-    await deleteCategory({id: record.id}, importSuccess);
-
+    await deleteCategory({ id: record.id }, importSuccess);
   }
 
   /**
    * 批量删除事件
    */
   async function batchHandleDelete() {
-    const ids = selectedRowKeys.value.filter(item => !item.includes('loading'))
-    await batchDeleteCategory({ids: ids}, importSuccess);
+    const ids = selectedRowKeys.value.filter((item) => !item.includes('loading'));
+    await batchDeleteCategory({ ids: ids }, importSuccess);
   }
   /**
    * 导入
    */
-   function importSuccess() {
+  function importSuccess() {
     reload() && (expandedRowKeys.value = []);
   }
   /**
@@ -139,21 +136,21 @@
   /**
    * 成功回调
    */
-  async function handleSuccess({isUpdate, values, expandedArr}) {
+  async function handleSuccess({ isUpdate, values, expandedArr }) {
     if (isUpdate) {
       //编辑回调
       updateTableDataRecord(values.id, values);
     } else {
-        if(!values['pid']){
-            //新增根节点
-            reload();
-        }else{
-            //新增子集
-            expandedRowKeys.value = [];
-            for (let key of unref(expandedArr)) {
-                await expandTreeNode(key)
-            }
+      if (!values['pid']) {
+        //新增根节点
+        reload();
+      } else {
+        //新增子集
+        expandedRowKeys.value = [];
+        for (let key of unref(expandedArr)) {
+          await expandTreeNode(key);
         }
+      }
     }
   }
 
@@ -161,58 +158,58 @@
    * 接口请求成功后回调
    */
   function onFetchSuccess(result) {
-      getDataByResult(result.items)&&loadDataByExpandedRows();
+    getDataByResult(result.items) && loadDataByExpandedRows();
   }
   /**
    * 根据已展开的行查询数据（用于保存后刷新时异步加载子级的数据）
    */
   async function loadDataByExpandedRows() {
-      if (unref(expandedRowKeys).length > 0) {
-          const res = await getChildListBatch({ parentIds: unref(expandedRowKeys).join(',')});
-          if (res.success && res.result.records.length>0) {
-              //已展开的数据批量子节点
-              let records = res.result.records
-              const listMap = new Map();
-              for (let item of records) {
-                  let pid = item['pid'];
-                  if (unref(expandedRowKeys).includes(pid)) {
-                      let mapList = listMap.get(pid);
-                      if (mapList == null) {
-                          mapList = [];
-                      }
-                      mapList.push(item);
-                      listMap.set(pid, mapList);
-                  }
-              }
-              let childrenMap = listMap;
-              let fn = (list) => {
-                  if(list) {
-                      list.forEach(data => {
-                          if (unref(expandedRowKeys).includes(data.id)) {
-                              data.children = getDataByResult(childrenMap.get(data.id))
-                              fn(data.children)
-                          }
-                      })
-                  }
-              };
-              fn(getDataSource())
+    if (unref(expandedRowKeys).length > 0) {
+      const res = await getChildListBatch({ parentIds: unref(expandedRowKeys).join(',') });
+      if (res.success && res.result.records.length > 0) {
+        //已展开的数据批量子节点
+        let records = res.result.records;
+        const listMap = new Map();
+        for (let item of records) {
+          let pid = item['pid'];
+          if (unref(expandedRowKeys).includes(pid)) {
+            let mapList = listMap.get(pid);
+            if (mapList == null) {
+              mapList = [];
+            }
+            mapList.push(item);
+            listMap.set(pid, mapList);
           }
+        }
+        let childrenMap = listMap;
+        let fn = (list) => {
+          if (list) {
+            list.forEach((data) => {
+              if (unref(expandedRowKeys).includes(data.id)) {
+                data.children = getDataByResult(childrenMap.get(data.id));
+                fn(data.children);
+              }
+            });
+          }
+        };
+        fn(getDataSource());
       }
+    }
   }
   /**
    * 处理数据集
    */
-  function getDataByResult(result){
-      if(result && result.length>0){
-          return result.map(item=>{
-              //判断是否标记了带有子节点
-              if(item["hasChild"]=='1'){
-                  let loadChild = { id: item.id+'_loadChild', name: 'loading...', isLoading: true }
-                  item.children = [loadChild]
-              }
-              return item
-          })
-      }
+  function getDataByResult(result) {
+    if (result && result.length > 0) {
+      return result.map((item) => {
+        //判断是否标记了带有子节点
+        if (item['hasChild'] == '1') {
+          let loadChild = { id: item.id + '_loadChild', name: 'loading...', isLoading: true };
+          item.children = [loadChild];
+        }
+        return item;
+      });
+    }
   }
   /**
    *树节点展开合并
@@ -220,18 +217,18 @@
   async function handleExpand(expanded, record) {
     // 判断是否是展开状态，展开状态(expanded)并且存在子集(children)并且未加载过(isLoading)的就去查询子节点数据
     if (expanded) {
-       expandedRowKeys.value.push(record.id)
+      expandedRowKeys.value.push(record.id);
       if (record.children.length > 0 && !!record.children[0].isLoading) {
-        let result = await getChildList({pid: record.id});
+        let result = await getChildList({ pid: record.id });
         if (result && result.length > 0) {
           record.children = getDataByResult(result);
         } else {
-          record.children = null
-          record.hasChild = '0'
+          record.children = null;
+          record.hasChild = '0';
         }
       }
     } else {
-      let keyIndex = expandedRowKeys.value.indexOf(record.id)
+      let keyIndex = expandedRowKeys.value.indexOf(record.id);
       if (keyIndex >= 0) {
         expandedRowKeys.value.splice(keyIndex, 1);
       }
@@ -241,16 +238,16 @@
    *操作表格后处理树节点展开合并
    * */
   async function expandTreeNode(key) {
-    let record = findTableDataRecord(key)
+    let record = findTableDataRecord(key);
     expandedRowKeys.value.push(key);
-      let result = await getChildList({pid: key});
-      if (result && result.length > 0) {
-          record.children = getDataByResult(result);
-      } else {
-          record.children = null
-          record.hasChild = '0'
-      }
-      updateTableDataRecord(key, record);
+    let result = await getChildList({ pid: key });
+    if (result && result.length > 0) {
+      record.children = getDataByResult(result);
+    } else {
+      record.children = null;
+      record.hasChild = '0';
+    }
+    updateTableDataRecord(key, record);
   }
   /**
    * 操作栏
@@ -270,12 +267,10 @@
       },
       {
         label: '添加下级',
-        onClick: handleAddSub.bind(null, {pid: record.id}),
-      }
-    ]
+        onClick: handleAddSub.bind(null, { pid: record.id }),
+      },
+    ];
   }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/views/system/checkRule/CheckRuleModal.vue b/src/views/system/checkRule/CheckRuleModal.vue
index 92505d0..cc3e019 100644
--- a/src/views/system/checkRule/CheckRuleModal.vue
+++ b/src/views/system/checkRule/CheckRuleModal.vue
@@ -1,261 +1,237 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" @ok="handleSubmit" :title="title" :width="1200" destroyOnClose>
-        <BasicForm @register="registerForm"/>
+  <BasicModal v-bind="$attrs" @register="registerModal" @ok="handleSubmit" :title="title" :width="1200" destroyOnClose>
+    <BasicForm @register="registerForm" />
 
-        <a-tabs v-model:activeKey="activeKey">
-            <a-tab-pane tab="局部规则" key="1" :forceRender="true">
-                <JVxeTable
-                    ref="vTable1"
-                    toolbar
-                    rowNumber
-                    dragSort
-                    rowSelection
-                    :maxHeight="580"
-                    :dataSource="dataSource1"
-                    :columns="columns1">
-                    <template #toolbarAfter>
-                        <a-alert type="info" showIcon message="局部规则按照你输入的位数有序的校验" style="margin-bottom: 8px;"/>
-                    </template>
-                </JVxeTable>
-            </a-tab-pane>
-            <a-tab-pane tab="全局规则" key="2" :forceRender="true">
-                <JVxeTable
-                    ref="vTable2"
-                    toolbar
-                    rowNumber
-                    dragSort
-                    rowSelection
-                    :maxHeight="580"
-                    :dataSource="dataSource2"
-                    :addSetActive="false"
-                    :columns="columns2">
-                    <template #toolbarAfter>
-                        <a-alert type="info" showIcon message="全局规则可校验用户输入的所有字符；全局规则的优先级比局部规则的要高。" style="margin-bottom: 8px;"/>
-                    </template>
-                </JVxeTable>
-            </a-tab-pane>
-        </a-tabs>
-    </BasicModal>
+    <a-tabs v-model:activeKey="activeKey">
+      <a-tab-pane tab="局部规则" key="1" :forceRender="true">
+        <JVxeTable ref="vTable1" toolbar rowNumber dragSort rowSelection :maxHeight="580" :dataSource="dataSource1" :columns="columns1">
+          <template #toolbarAfter>
+            <a-alert type="info" showIcon message="局部规则按照你输入的位数有序的校验" style="margin-bottom: 8px" />
+          </template>
+        </JVxeTable>
+      </a-tab-pane>
+      <a-tab-pane tab="全局规则" key="2" :forceRender="true">
+        <JVxeTable ref="vTable2" toolbar rowNumber dragSort rowSelection :maxHeight="580" :dataSource="dataSource2" :addSetActive="false" :columns="columns2">
+          <template #toolbarAfter>
+            <a-alert type="info" showIcon message="全局规则可校验用户输入的所有字符；全局规则的优先级比局部规则的要高。" style="margin-bottom: 8px" />
+          </template>
+        </JVxeTable>
+      </a-tab-pane>
+    </a-tabs>
+  </BasicModal>
 </template>
 
 <script lang="ts" setup>
-    import { BasicModal, useModalInner } from '/@/components/Modal';
-    import { BasicForm, useForm } from '/@/components/Form/index';
-    import {computed, ref, unref} from "vue";
-    import {formSchema} from "./check.rule.data";
-    import { saveCheckRule, updateCheckRule } from "./check.rule.api";
-    import {JVxeTypes, JVxeColumn, JVxeTableInstance} from '/@/components/jeecg/JVxeTable/types'
-    import { pick } from 'lodash-es';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { computed, ref, unref } from 'vue';
+  import { formSchema } from './check.rule.data';
+  import { saveCheckRule, updateCheckRule } from './check.rule.api';
+  import { JVxeTypes, JVxeColumn, JVxeTableInstance } from '/@/components/jeecg/JVxeTable/types';
+  import { pick } from 'lodash-es';
 
-    //设置标题
-    const title = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
-    // 声明Emits
-    const emit = defineEmits(['register','success']);
-    const isUpdate = ref(true);
+  //设置标题
+  const title = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
+  // 声明Emits
+  const emit = defineEmits(['register', 'success']);
+  const isUpdate = ref(true);
 
-    //表单配置
-    const [registerForm, { resetFields, setFieldsValue, validate, getFieldsValue }] = useForm({
-        schemas: formSchema,
-        showActionButtonGroup: false
+  //表单配置
+  const [registerForm, { resetFields, setFieldsValue, validate, getFieldsValue }] = useForm({
+    schemas: formSchema,
+    showActionButtonGroup: false,
+  });
+
+  const activeKey = ref('1');
+  let arr1: any[] = [];
+  let dataSource1 = ref(arr1);
+  let arr2: any[] = [];
+  let dataSource2 = ref(arr2);
+
+  //表单赋值
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    //重置表单
+    await resetFields();
+    setModalProps({ confirmLoading: false });
+    isUpdate.value = !!data?.isUpdate;
+    activeKey.value = '1';
+    dataSource1.value = [];
+    dataSource2.value = [];
+    if (unref(isUpdate)) {
+      //表单赋值
+      await setFieldsValue({
+        ...data.record,
+      });
+
+      let ruleJson = data.record.ruleJson;
+      if (ruleJson) {
+        let ruleList = JSON.parse(ruleJson);
+        // 筛选出全局规则和局部规则
+        let global: any[] = [],
+          design: any[] = [],
+          priority = '1';
+        ruleList.forEach((rule) => {
+          if (rule.digits === '*') {
+            global.push(Object.assign(rule, { priority }));
+          } else {
+            priority = '0';
+            design.push(rule);
+          }
+        });
+        dataSource1.value = design;
+        dataSource2.value = global;
+      }
+    }
+  });
+
+  const vTable1 = ref<JVxeTableInstance>();
+  const vTable2 = ref<JVxeTableInstance>();
+
+  // 验证表格 返回表格数据
+  function validateMyTable(tableRef, key) {
+    return new Promise((resolve, reject) => {
+      tableRef.value!.validateTable().then((errMap) => {
+        if (errMap) {
+          activeKey.value = key;
+          reject();
+        } else {
+          const values = tableRef.value!.getTableData();
+          resolve(values);
+        }
+      });
     });
+  }
 
-    const activeKey = ref('1')
-    let arr1:any[] = []
-    let dataSource1 = ref(arr1)
-    let arr2:any[] = []
-    let dataSource2 = ref(arr2)
-
-    //表单赋值
-    const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-        //重置表单
-        await resetFields();
-        setModalProps({confirmLoading: false});
-        isUpdate.value = !!data?.isUpdate;
-        activeKey.value = '1'
-        dataSource1.value = []
-        dataSource2.value = []
-        if (unref(isUpdate)) {
-            //表单赋值
-            await setFieldsValue({
-                ...data.record,
-            });
-
-            let ruleJson = data.record.ruleJson
-            if (ruleJson) {
-                let ruleList = JSON.parse(ruleJson)
-                // 筛选出全局规则和局部规则
-                let global:any[] = [], design:any[] = [], priority = '1'
-                ruleList.forEach(rule => {
-                    if (rule.digits === '*') {
-                        global.push(Object.assign(rule, { priority }))
-                    } else {
-                        priority = '0'
-                        design.push(rule)
-                    }
-                })
-                dataSource1.value = design
-                dataSource2.value = global
-            }
+  //表单提交事件
+  async function handleSubmit() {
+    let mainData;
+    let globalValues = [];
+    let designValues = [];
+    validate()
+      .then((formValue) => {
+        mainData = formValue;
+        return validateMyTable(vTable1, '1');
+      })
+      .then((tableData1: []) => {
+        if (tableData1 && tableData1.length > 0) {
+          designValues = tableData1;
         }
-    });
+        return validateMyTable(vTable2, '2');
+      })
+      .then((tableData2: []) => {
+        if (tableData2 && tableData2.length > 0) {
+          globalValues = tableData2;
+        }
+        // 整合两个子表的数据
+        let firstGlobal: any[] = [],
+          afterGlobal: any[] = [];
+        for (let i = 0; i < globalValues.length; i++) {
+          let v: any = globalValues[i];
+          v.digits = '*';
+          if (v.priority === '1') {
+            firstGlobal.push(v);
+          } else {
+            afterGlobal.push(v);
+          }
+        }
+        let concatValues = firstGlobal.concat(designValues).concat(afterGlobal);
+        let subValues = concatValues.map((i) => pick(i, 'digits', 'pattern', 'message'));
+        // 生成 formData，用于传入后台
+        let ruleJson = JSON.stringify(subValues);
+        let formData = Object.assign({}, mainData, { ruleJson });
+        saveOrUpdateFormData(formData);
+      })
+      .catch(() => {
+        setModalProps({ confirmLoading: false });
+        console.error('验证未通过!');
+      });
+  }
 
-
-    const vTable1 = ref<JVxeTableInstance>()
-    const vTable2 = ref<JVxeTableInstance>()
-
-    // 验证表格 返回表格数据
-    function validateMyTable(tableRef, key){
-        return new Promise(((resolve, reject) => {
-            tableRef.value!.validateTable().then(errMap => {
-                if (errMap) {
-                    activeKey.value = key
-                    reject()
-                } else {
-                    const values = tableRef.value!.getTableData()
-                    resolve(values);
-                }
-            })
-        }))
+  // 表单提交请求
+  async function saveOrUpdateFormData(formData) {
+    try {
+      console.log('表单提交数据', formData);
+      setModalProps({ confirmLoading: true });
+      if (isUpdate.value) {
+        await updateCheckRule(formData);
+      } else {
+        await saveCheckRule(formData);
+      }
+      //关闭弹窗
+      closeModal();
+      //刷新列表
+      emit('success');
+    } finally {
+      setModalProps({ confirmLoading: false });
     }
+  }
 
-    //表单提交事件
-    async function handleSubmit() {
-        let mainData;
-        let globalValues = []
-        let designValues = []
-        validate().then((formValue)=>{
-            mainData = formValue;
-            return validateMyTable(vTable1, '1')
-        }).then((tableData1:[])=>{
-            if(tableData1 && tableData1.length>0){
-                designValues = tableData1
-            }
-            return validateMyTable(vTable2, '2')
-        }).then((tableData2:[])=>{
-            if(tableData2 && tableData2.length>0){
-                globalValues = tableData2
-            }
-            // 整合两个子表的数据
-            let firstGlobal:any[]  = [],  afterGlobal:any[] = []
-            for(let i=0;i<globalValues.length;i++){
-                let v:any = globalValues[i]
-                v.digits = '*'
-                if (v.priority === '1') {
-                    firstGlobal.push(v)
-                } else {
-                    afterGlobal.push(v)
-                }
-            }
-            let concatValues = firstGlobal.concat(designValues).concat(afterGlobal)
-            let subValues = concatValues.map(i => pick(i, 'digits', 'pattern', 'message'))
-            // 生成 formData，用于传入后台
-            let ruleJson = JSON.stringify(subValues)
-            let formData = Object.assign({}, mainData, { ruleJson })
-            saveOrUpdateFormData(formData)
-        }).catch(()=>{
-            setModalProps({confirmLoading: false});
-            console.error("验证未通过!")
-        })
+  /**
+   * 校验
+   * @param cellValue
+   * @param callback
+   */
+  const validatePatternHandler = ({ cellValue }, callback) => {
+    try {
+      new RegExp(cellValue);
+      callback(true);
+    } catch (e) {
+      callback(false, '请输入正确的正则表达式');
     }
+  };
 
-    // 表单提交请求
-    async function saveOrUpdateFormData(formData) {
-        try {
-            console.log('表单提交数据', formData)
-            setModalProps({confirmLoading: true});
-            if(isUpdate.value){
-                await updateCheckRule(formData)
-            }else{
-                await saveCheckRule(formData);
-            }
-            //关闭弹窗
-            closeModal();
-            //刷新列表
-            emit('success');
-        } finally {
-            setModalProps({confirmLoading: false});
-        }
-    }
-
-    /**
-     * 校验
-     * @param cellValue
-     * @param callback
-     */
-    const validatePatternHandler = ({ cellValue }, callback) => {
-        try {
-            new RegExp(cellValue)
-            callback(true)
-        } catch (e) {
-            callback(false, '请输入正确的正则表达式')
-        }
-    };
-
-    const columns1 = ref<JVxeColumn[]>([
-        {
-            title: '位数',
-            key: 'digits',
-            type: JVxeTypes.inputNumber,
-            minWidth: 180,
-            validateRules: [
-                { required: true, message: '${title}不能为空' },
-                { pattern: /^[1-9]\d*$/, message: '请输入零以上的正整数' },
-            ]
-        },
-        {
-            title: '规则（正则表达式）',
-            key: 'pattern',
-            minWidth: 320,
-            type: JVxeTypes.input,
-            validateRules: [
-                { required: true, message: '规则不能为空' },
-                { handler: validatePatternHandler }
-            ]
-        },
-        {
-            title: '提示文本',
-            key: 'message',
-            minWidth: 180,
-            type: JVxeTypes.input,
-            validateRules: [
-                { required: true, message: '${title}不能为空' },
-            ]
-        }
-    ])
-
-    const columns2 = ref<JVxeColumn[]>([
-        {
-            title: '优先级',
-            key: 'priority',
-            type: JVxeTypes.select,
-            defaultValue: '1',
-            options: [
-                { title: '优先运行', value: '1' },
-                { title: '最后运行', value: '0' },
-            ],
-            validateRules: []
-        },
-        {
-            title: '规则（正则表达式）',
-            key: 'pattern',
-            width: '40%',
-            type:  JVxeTypes.input,
-            validateRules: [
-                { required: true, message: '规则不能为空' },
-                { handler: validatePatternHandler }
-            ]
-        },
-        {
-            title: '提示文本',
-            key: 'message',
-            width: '20%',
-            type:  JVxeTypes.input,
-            validateRules: [
-                { required: true, message: '${title}不能为空' },
-            ]
-        },
-
-    ])
+  const columns1 = ref<JVxeColumn[]>([
+    {
+      title: '位数',
+      key: 'digits',
+      type: JVxeTypes.inputNumber,
+      minWidth: 180,
+      validateRules: [
+        { required: true, message: '${title}不能为空' },
+        { pattern: /^[1-9]\d*$/, message: '请输入零以上的正整数' },
+      ],
+    },
+    {
+      title: '规则（正则表达式）',
+      key: 'pattern',
+      minWidth: 320,
+      type: JVxeTypes.input,
+      validateRules: [{ required: true, message: '规则不能为空' }, { handler: validatePatternHandler }],
+    },
+    {
+      title: '提示文本',
+      key: 'message',
+      minWidth: 180,
+      type: JVxeTypes.input,
+      validateRules: [{ required: true, message: '${title}不能为空' }],
+    },
+  ]);
 
+  const columns2 = ref<JVxeColumn[]>([
+    {
+      title: '优先级',
+      key: 'priority',
+      type: JVxeTypes.select,
+      defaultValue: '1',
+      options: [
+        { title: '优先运行', value: '1' },
+        { title: '最后运行', value: '0' },
+      ],
+      validateRules: [],
+    },
+    {
+      title: '规则（正则表达式）',
+      key: 'pattern',
+      width: '40%',
+      type: JVxeTypes.input,
+      validateRules: [{ required: true, message: '规则不能为空' }, { handler: validatePatternHandler }],
+    },
+    {
+      title: '提示文本',
+      key: 'message',
+      width: '20%',
+      type: JVxeTypes.input,
+      validateRules: [{ required: true, message: '${title}不能为空' }],
+    },
+  ]);
 </script>
-
diff --git a/src/views/system/checkRule/CheckRuleTestModal.vue b/src/views/system/checkRule/CheckRuleTestModal.vue
index 6b0dca9..06dd10c 100644
--- a/src/views/system/checkRule/CheckRuleTestModal.vue
+++ b/src/views/system/checkRule/CheckRuleTestModal.vue
@@ -1,57 +1,55 @@
 <template>
-    <BasicModal v-bind="$attrs" :okButtonProps="okButtonProps" @register="registerModal" destroyOnClose>
-        <BasicForm @register="registerForm"/>
-        <div style="display:flex;flex-flow: row wrap;">
-            <div style="padding:0 4px" v-for="(str,index) of realTestValue" :key="index">
-                <a-row>
-                    <a-col style="text-align: center;">
-                        <a-input :value="str" style="text-align: center;width: 40px;"/>
-                    </a-col>
-                    <a-col style="text-align: center;">{{index+1}}</a-col>
-                </a-row>
-            </div>
-        </div>
-    </BasicModal>
+  <BasicModal v-bind="$attrs" :okButtonProps="okButtonProps" @register="registerModal" destroyOnClose>
+    <BasicForm @register="registerForm" />
+    <div style="display: flex; flex-flow: row wrap">
+      <div style="padding: 0 4px" v-for="(str, index) of realTestValue" :key="index">
+        <a-row>
+          <a-col style="text-align: center">
+            <a-input :value="str" style="text-align: center; width: 40px" />
+          </a-col>
+          <a-col style="text-align: center">{{ index + 1 }}</a-col>
+        </a-row>
+      </div>
+    </div>
+  </BasicModal>
 </template>
 
 <script lang="ts" setup>
-    import { BasicModal, useModalInner } from '/@/components/Modal';
-    import { BasicForm, useForm } from '/@/components/Form/index';
-    import {checkRuleInput} from "/@/views/system/checkRule/check.rule.data";
-    import {ref} from 'vue'
-    let realTestValue = ref('')
-    const okButtonProps = {
-        style: {display:'none'}
-    }
-    const [registerForm, { resetFields, setFieldsValue, validate, getFieldsValue }] = useForm({
-        schemas: checkRuleInput,
-        showActionButtonGroup: false,
-        labelCol: {
-            span: 24
-        },
-        wrapperCol:{
-            span: 24
-        }
-    });
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { checkRuleInput } from '/@/views/system/checkRule/check.rule.data';
+  import { ref } from 'vue';
+  let realTestValue = ref('');
+  const okButtonProps = {
+    style: { display: 'none' },
+  };
+  const [registerForm, { resetFields, setFieldsValue, validate, getFieldsValue }] = useForm({
+    schemas: checkRuleInput,
+    showActionButtonGroup: false,
+    labelCol: {
+      span: 24,
+    },
+    wrapperCol: {
+      span: 24,
+    },
+  });
 
-    //表单赋值
-    const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-        //重置表单
-        await resetFields();
-        realTestValue.value=''
-        setModalProps({
-            confirmLoading: false,
-            cancelText:'关闭',
-            title:'功能测试',
-            width: '1000px'
-        });
-        await setFieldsValue({
-            ruleCode: data.ruleCode,
-            testValue: realTestValue
-        });
+  //表单赋值
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    //重置表单
+    await resetFields();
+    realTestValue.value = '';
+    setModalProps({
+      confirmLoading: false,
+      cancelText: '关闭',
+      title: '功能测试',
+      width: '1000px',
     });
+    await setFieldsValue({
+      ruleCode: data.ruleCode,
+      testValue: realTestValue,
+    });
+  });
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/views/system/checkRule/check.rule.api.ts b/src/views/system/checkRule/check.rule.api.ts
index 0988b51..c4b5391 100644
--- a/src/views/system/checkRule/check.rule.api.ts
+++ b/src/views/system/checkRule/check.rule.api.ts
@@ -1,15 +1,15 @@
-import { defHttp } from "/@/utils/http/axios";
-import { Modal } from "ant-design-vue";
+import { defHttp } from '/@/utils/http/axios';
+import { Modal } from 'ant-design-vue';
 
 enum Api {
-    list = '/sys/checkRule/list',
-    delete = '/sys/checkRule/delete',
-    deleteBatch = '/sys/checkRule/deleteBatch',
-    exportXls = 'sys/checkRule/exportXls',
-    importXls = 'sys/checkRule/importExcel',
-    checkByCode = '/sys/checkRule/checkByCode',
-    save = '/sys/checkRule/add',
-    edit = '/sys/checkRule/edit'
+  list = '/sys/checkRule/list',
+  delete = '/sys/checkRule/delete',
+  deleteBatch = '/sys/checkRule/deleteBatch',
+  exportXls = 'sys/checkRule/exportXls',
+  importXls = 'sys/checkRule/importExcel',
+  checkByCode = '/sys/checkRule/checkByCode',
+  save = '/sys/checkRule/add',
+  edit = '/sys/checkRule/edit',
 }
 
 /**
@@ -26,8 +26,8 @@ export const importUrl = Api.importXls;
  * @param params
  */
 export const getCheckRuleList = (params) => {
-    return defHttp.get({url: Api.list, params});
-}
+  return defHttp.get({ url: Api.list, params });
+};
 
 /**
  * 删除
@@ -35,53 +35,52 @@ export const getCheckRuleList = (params) => {
  * @param handleSuccess
  */
 export const deleteCheckRule = (params, handleSuccess) => {
-    return defHttp.delete({url: Api.delete, data: params}, {joinParamsToUrl: true}).then(() => {
-        handleSuccess();
-    });
-}
+  return defHttp.delete({ url: Api.delete, data: params }, { joinParamsToUrl: true }).then(() => {
+    handleSuccess();
+  });
+};
 
 /**
  * 批量删除
  * @param params
  */
 export const batchDeleteCheckRule = (params, handleSuccess) => {
-    Modal.confirm({
-        title: '确认删除',
-        content: '是否删除选中数据',
-        okText: '确认',
-        cancelText: '取消',
-        onOk: () => {
-            return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
-                handleSuccess();
-            });
-        }
-    });
-}
+  Modal.confirm({
+    title: '确认删除',
+    content: '是否删除选中数据',
+    okText: '确认',
+    cancelText: '取消',
+    onOk: () => {
+      return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => {
+        handleSuccess();
+      });
+    },
+  });
+};
 
 /**
  * 根据编码校验规则code，校验传入的值是否合法
  * @param ruleCode
  * @param value
  */
-export const validateCheckRule = (ruleCode, value)=>{
-    value = encodeURIComponent(value)
-    let params = { ruleCode, value }
-    return defHttp.get({url: Api.checkByCode, params},{isTransformResponse: false})
-}
-
+export const validateCheckRule = (ruleCode, value) => {
+  value = encodeURIComponent(value);
+  let params = { ruleCode, value };
+  return defHttp.get({ url: Api.checkByCode, params }, { isTransformResponse: false });
+};
 
 /**
  * 保存
  * @param params
  */
 export const saveCheckRule = (params) => {
-    return defHttp.post({url: Api.save, params});
-}
+  return defHttp.post({ url: Api.save, params });
+};
 
 /**
  * 更新
  * @param params
  */
 export const updateCheckRule = (params) => {
-    return defHttp.put({url: Api.edit, params});
-}
+  return defHttp.put({ url: Api.edit, params });
+};
diff --git a/src/views/system/checkRule/check.rule.data.ts b/src/views/system/checkRule/check.rule.data.ts
index 221c132..59fe236 100644
--- a/src/views/system/checkRule/check.rule.data.ts
+++ b/src/views/system/checkRule/check.rule.data.ts
@@ -1,156 +1,152 @@
 import { BasicColumn, FormSchema } from '/@/components/Table';
-import { render } from "/@/utils/common/renderUtils";
-import {duplicateCheck} from "/@/views/system/user/user.api";
-import { validateCheckRule } from "/@/views/system/checkRule/check.rule.api";
-import {array} from "vue-types";
-
+import { render } from '/@/utils/common/renderUtils';
+import { duplicateCheck } from '/@/views/system/user/user.api';
+import { validateCheckRule } from '/@/views/system/checkRule/check.rule.api';
+import { array } from 'vue-types';
 
 export const columns: BasicColumn[] = [
-    {
-        title: '规则名称',
-        dataIndex: 'ruleName',
-        width: 200,
-        align: 'center',
+  {
+    title: '规则名称',
+    dataIndex: 'ruleName',
+    width: 200,
+    align: 'center',
+  },
+  {
+    title: '规则编码',
+    dataIndex: 'ruleCode',
+    width: 200,
+    align: 'center',
+  },
+  {
+    title: '规则描述',
+    dataIndex: 'ruleDescription',
+    width: 300,
+    align: 'center',
+    customRender: function ({ text }) {
+      return render.renderTip(text, 30);
     },
-    {
-        title: '规则编码',
-        dataIndex: 'ruleCode',
-        width: 200,
-        align: 'center',
-    },
-    {
-        title: '规则描述',
-        dataIndex: 'ruleDescription',
-        width: 300,
-        align: 'center',
-        customRender: function({text}){
-            return render.renderTip(text, 30)
-        }
-    }
+  },
 ];
 
 export const searchFormSchema: FormSchema[] = [
-    {
-        field: 'ruleName',
-        label: '规则名称',
-        component: 'Input',
-        colProps: { span: 6 },
-    },
-    {
-        field: 'ruleCode',
-        label: '规则编码',
-        component: 'Input',
-        colProps: { span: 6 },
-    },
+  {
+    field: 'ruleName',
+    label: '规则名称',
+    component: 'Input',
+    colProps: { span: 6 },
+  },
+  {
+    field: 'ruleCode',
+    label: '规则编码',
+    component: 'Input',
+    colProps: { span: 6 },
+  },
 ];
 
-
 export const formSchema: FormSchema[] = [
-    {
-        label: '',
-        field: 'id',
-        component: 'Input',
-        show:false
+  {
+    label: '',
+    field: 'id',
+    component: 'Input',
+    show: false,
+  },
+  {
+    field: 'ruleName',
+    label: '规则名称',
+    component: 'Input',
+    required: true,
+    colProps: { span: 24 },
+  },
+  {
+    field: 'ruleCode',
+    label: '规则编码',
+    component: 'Input',
+    colProps: { span: 24 },
+    dynamicDisabled: ({ values }) => {
+      return !!values.id;
     },
-    {
-        field: 'ruleName',
-        label: '规则名称',
-        component: 'Input',
-        required: true,
-        colProps: { span: 24 }
-    },
-    {
-        field: 'ruleCode',
-        label: '规则编码',
-        component: 'Input',
-        colProps: { span: 24 },
-        dynamicDisabled: ({values}) => {
-            return !!values.id;
+    dynamicRules: ({ model }) => {
+      return [
+        {
+          required: true,
+          validator: (_, value) => {
+            return new Promise((resolve, reject) => {
+              if (!value) {
+                return reject('请输入规则编码！');
+              }
+              let params = {
+                tableName: 'sys_check_rule',
+                fieldName: 'rule_code',
+                fieldVal: value,
+                dataId: model.id,
+              };
+              duplicateCheck(params)
+                .then((res) => {
+                  res.success ? resolve() : reject('规则编码已存在!');
+                })
+                .catch((err) => {
+                  reject(err.message || '校验失败');
+                });
+            });
+          },
         },
-        dynamicRules: ({ model }) => {
-            return [
-                {
-                    required: true,
-                    validator: (_, value) => {
-                        return new Promise((resolve, reject) => {
-                            if (!value) {
-                                return reject('请输入规则编码！');
-                            }
-                            let params = {
-                                tableName: "sys_check_rule",
-                                fieldName: "rule_code",
-                                fieldVal: value,
-                                dataId: model.id,
-                            };
-                            duplicateCheck(params)
-                              .then((res) => {
-                                  res.success ? resolve() : reject('规则编码已存在!');
-                              }).catch((err) => {
-                                reject(err.message || '校验失败');
-                            });
-                        });
-                    },
-                },
-            ];
-        }
+      ];
     },
-    {
-        field: 'ruleDescription',
-        label: '规则描述',
-        colProps: { span: 24 },
-        component: 'InputTextArea',
-        componentProps: {
-            placeholder: '请输入规则描述',
-            rows: 2,
-        },
+  },
+  {
+    field: 'ruleDescription',
+    label: '规则描述',
+    colProps: { span: 24 },
+    component: 'InputTextArea',
+    componentProps: {
+      placeholder: '请输入规则描述',
+      rows: 2,
     },
-
-]
-
-
+  },
+];
 
 export const checkRuleInput: FormSchema[] = [
-    {
-        label: '123',
-        field: 'ruleCode',
-        component: 'Input',
-        show: false
-    },
-    {
-        field: 'testValue',
-        label: '需要测试的值:',
-        component: 'Input',
-        componentProps:({formModel}) => {
-            return {
-                onChange: (e) => {
-                    formModel.testValue = e.target.value
-                }
-            }
+  {
+    label: '123',
+    field: 'ruleCode',
+    component: 'Input',
+    show: false,
+  },
+  {
+    field: 'testValue',
+    label: '需要测试的值:',
+    component: 'Input',
+    componentProps: ({ formModel }) => {
+      return {
+        onChange: (e) => {
+          formModel.testValue = e.target.value;
         },
-        dynamicRules: ({ model }) => {
-            const { ruleCode } = model
-            return [
-                {
-                    required: false,
-                    validator: (_, value) => {
-                        return new Promise((resolve, reject) => {
-                            if (ruleCode && value) {
-                                /*console.log({ruleCode,value})*/
-                                validateCheckRule(ruleCode, value).then(res => {
-                                    //console.log(1233, res)
-                                    res['success'] ? resolve() : reject(res['message'])
-                                }).catch(err => {
-                                    reject(err.message || err)
-                                })
-                            }else{
-                                resolve();
-                            }
-                        });
-                    },
-                },
-            ];
-        }
+      };
     },
-
-]
-
+    dynamicRules: ({ model }) => {
+      const { ruleCode } = model;
+      return [
+        {
+          required: false,
+          validator: (_, value) => {
+            return new Promise((resolve, reject) => {
+              if (ruleCode && value) {
+                /*console.log({ruleCode,value})*/
+                validateCheckRule(ruleCode, value)
+                  .then((res) => {
+                    //console.log(1233, res)
+                    res['success'] ? resolve() : reject(res['message']);
+                  })
+                  .catch((err) => {
+                    reject(err.message || err);
+                  });
+              } else {
+                resolve();
+              }
+            });
+          },
+        },
+      ];
+    },
+  },
+];
diff --git a/src/views/system/checkRule/index.vue b/src/views/system/checkRule/index.vue
index f8ff320..7f76d98 100644
--- a/src/views/system/checkRule/index.vue
+++ b/src/views/system/checkRule/index.vue
@@ -1,147 +1,143 @@
 <template>
-    <div :class="prefixCls">
-        <BasicTable @register="registerTable" :rowSelection="rowSelection">
-            <!--插槽:table标题-->
-            <template #tableTitle>
-                <a-button preIcon="ant-design:plus-outlined" type="primary" @click="handleAdd">新增</a-button>
-                <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
-                <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
-                <a-dropdown v-if="selectedRowKeys.length>0">
-                    <template #overlay>
-                        <a-menu>
-                            <a-menu-item key="1" @click="batchHandleDelete">
-                                <Icon icon="ant-design:delete-outlined"></Icon>
-                                <span>删除</span>
-                            </a-menu-item>
-                        </a-menu>
-                    </template>
-                    <a-button>
-                        <span>批量操作</span>
-                        <Icon icon="mdi:chevron-down"></Icon>
-                    </a-button>
-                </a-dropdown>
-            </template>
+  <div :class="prefixCls">
+    <BasicTable @register="registerTable" :rowSelection="rowSelection">
+      <!--插槽:table标题-->
+      <template #tableTitle>
+        <a-button preIcon="ant-design:plus-outlined" type="primary" @click="handleAdd">新增</a-button>
+        <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
+        <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
+        <a-dropdown v-if="selectedRowKeys.length > 0">
+          <template #overlay>
+            <a-menu>
+              <a-menu-item key="1" @click="batchHandleDelete">
+                <Icon icon="ant-design:delete-outlined"></Icon>
+                <span>删除</span>
+              </a-menu-item>
+            </a-menu>
+          </template>
+          <a-button>
+            <span>批量操作</span>
+            <Icon icon="mdi:chevron-down"></Icon>
+          </a-button>
+        </a-dropdown>
+      </template>
 
-            <!--操作栏-->
-            <template #action="{ record }">
-                <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)"/>
-            </template>
-        </BasicTable>
+      <!--操作栏-->
+      <template #action="{ record }">
+        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
+      </template>
+    </BasicTable>
 
-        <CheckRuleTestModal @register="testModal" ></CheckRuleTestModal>
-        <CheckRuleModal @register="registerModal" @success="reload"></CheckRuleModal>
-    </div>
+    <CheckRuleTestModal @register="testModal"></CheckRuleTestModal>
+    <CheckRuleModal @register="registerModal" @success="reload"></CheckRuleModal>
+  </div>
 </template>
 
 <script name="system-fillrule" lang="ts" setup>
-    import { BasicTable, TableAction } from '/@/components/Table'
-    import { useListPage } from '/@/hooks/system/useListPage'
+  import { BasicTable, TableAction } from '/@/components/Table';
+  import { useListPage } from '/@/hooks/system/useListPage';
 
-    import {useModal} from "/@/components/Modal";
-    import { getCheckRuleList, exportUrl, importUrl, deleteCheckRule, batchDeleteCheckRule, validateCheckRule } from "/@/views/system/checkRule/check.rule.api";
-    import { columns, searchFormSchema } from "/@/views/system/checkRule/check.rule.data";
-    import {ActionItem} from "/@/components/Table";
+  import { useModal } from '/@/components/Modal';
+  import { getCheckRuleList, exportUrl, importUrl, deleteCheckRule, batchDeleteCheckRule, validateCheckRule } from '/@/views/system/checkRule/check.rule.api';
+  import { columns, searchFormSchema } from '/@/views/system/checkRule/check.rule.data';
+  import { ActionItem } from '/@/components/Table';
 
-    import CheckRuleTestModal from '/@/views/system/checkRule/CheckRuleTestModal.vue'
-    const [ testModal, {openModal: openTestModal} ] = useModal();
+  import CheckRuleTestModal from '/@/views/system/checkRule/CheckRuleTestModal.vue';
+  const [testModal, { openModal: openTestModal }] = useModal();
 
-    import CheckRuleModal from '/@/views/system/checkRule/CheckRuleModal.vue'
-    const [ registerModal, {openModal} ] = useModal();
+  import CheckRuleModal from '/@/views/system/checkRule/CheckRuleModal.vue';
+  const [registerModal, { openModal }] = useModal();
 
-    // 列表页面公共参数、方法
-    const { prefixCls, tableContext, createMessage, onExportXls, onImportXls, createSuccessModal } = useListPage({
-        designScope: 'check-rule',
-        tableProps: {
-            title: '编码校验规则管理页面',
-            api: getCheckRuleList,
-            columns: columns,
-            showIndexColumn: true,
-            formConfig: {
-                schemas: searchFormSchema,
-            }
+  // 列表页面公共参数、方法
+  const { prefixCls, tableContext, createMessage, onExportXls, onImportXls, createSuccessModal } = useListPage({
+    designScope: 'check-rule',
+    tableProps: {
+      title: '编码校验规则管理页面',
+      api: getCheckRuleList,
+      columns: columns,
+      showIndexColumn: true,
+      formConfig: {
+        schemas: searchFormSchema,
+      },
+    },
+    exportConfig: {
+      url: exportUrl,
+      name: '编码校验规则列表',
+    },
+    importConfig: {
+      url: importUrl,
+      success: () => reload(),
+    },
+  });
+  // 注册 ListTable
+  const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;
+
+  /**
+   * 新增事件
+   */
+  function handleAdd() {
+    openModal(true, {
+      isUpdate: false,
+    });
+  }
+
+  /**
+   * 编辑事件
+   */
+  function handleEdit(record) {
+    console.log('record....', record);
+    openModal(true, {
+      record,
+      isUpdate: true,
+    });
+  }
+
+  /**
+   * 删除事件
+   */
+  async function handleDelete(record) {
+    console.log(12345, record);
+    await deleteCheckRule({ id: record.id }, reload);
+  }
+
+  /**
+   * 批量删除事件
+   */
+  async function batchHandleDelete() {
+    await batchDeleteCheckRule({ ids: selectedRowKeys.value }, () => {
+      selectedRowKeys.value = [];
+      reload();
+    });
+  }
+
+  /**
+   * 功能测试
+   */
+  function testRule(record) {
+    openTestModal(true, { ruleCode: record.ruleCode });
+  }
+
+  /**
+   * 编辑
+   */
+  function getTableAction(record): ActionItem[] {
+    return [{ label: '编辑', onClick: handleEdit.bind(null, record) }];
+  }
+
+  /**
+   * 下拉操作栏
+   */
+  function getDropDownAction(record): ActionItem[] {
+    return [
+      { label: '功能测试', onClick: testRule.bind(null, record) },
+      {
+        label: '删除',
+        color: 'error',
+        popConfirm: {
+          title: '确认要删除吗？',
+          confirm: handleDelete.bind(null, record),
         },
-        exportConfig:{
-            url: exportUrl,
-            name: '编码校验规则列表',
-        },
-        importConfig:{
-            url: importUrl,
-            success: () => reload(),
-        }
-    })
-    // 注册 ListTable
-    const [registerTable, { reload }, {rowSelection, selectedRowKeys}] = tableContext
-
-    /**
-     * 新增事件
-     */
-    function handleAdd() {
-        openModal(true, {
-            isUpdate: false,
-        });
-    }
-
-    /**
-     * 编辑事件
-     */
-    function handleEdit(record) {
-        console.log('record....', record)
-        openModal(true, {
-            record,
-            isUpdate: true,
-        });
-    }
-
-    /**
-     * 删除事件
-     */
-    async function handleDelete(record) {
-        console.log(12345, record)
-        await deleteCheckRule({id: record.id}, reload);
-    }
-
-    /**
-     * 批量删除事件
-     */
-    async function batchHandleDelete() {
-        await batchDeleteCheckRule({ids: selectedRowKeys.value}, ()=>{
-            selectedRowKeys.value = []
-            reload()
-        });
-    }
-
-
-    /**
-     * 功能测试
-     */
-    function testRule(record) {
-        openTestModal(true, { ruleCode: record.ruleCode})
-    }
-
-    /**
-     * 编辑
-     */
-    function getTableAction(record): ActionItem[] {
-        return [
-            { label: '编辑', onClick: handleEdit.bind(null, record) },
-        ]
-    }
-
-    /**
-     * 下拉操作栏
-     */
-    function getDropDownAction(record): ActionItem[] {
-        return [
-            { label: '功能测试', onClick: testRule.bind(null, record) },
-            {
-                label: '删除',
-                color: 'error',
-                popConfirm: {
-                    title: '确认要删除吗？',
-                    confirm: handleDelete.bind(null, record),
-                },
-            }
-        ]
-    }
-
+      },
+    ];
+  }
 </script>
diff --git a/src/views/system/depart/components/DepartDataRuleDrawer.vue b/src/views/system/depart/components/DepartDataRuleDrawer.vue
index 19f0c04..3427872 100644
--- a/src/views/system/depart/components/DepartDataRuleDrawer.vue
+++ b/src/views/system/depart/components/DepartDataRuleDrawer.vue
@@ -1,32 +1,23 @@
 <template>
-  <BasicDrawer
-      title="数据规则/按钮权限配置"
-      :width="365"
-      @close="onClose"
-      @register="registerDrawer">
+  <BasicDrawer title="数据规则/按钮权限配置" :width="365" @close="onClose" @register="registerDrawer">
     <a-spin :spinning="loading">
       <a-tabs defaultActiveKey="1">
         <a-tab-pane tab="数据规则" key="1">
-          <a-checkbox-group v-model:value="dataRuleChecked" v-if="dataRuleList.length>0">
+          <a-checkbox-group v-model:value="dataRuleChecked" v-if="dataRuleList.length > 0">
             <a-row>
-              <a-col :span="24" v-for="(item,index) in dataRuleList" :key=" 'dr'+index ">
+              <a-col :span="24" v-for="(item, index) in dataRuleList" :key="'dr' + index">
                 <a-checkbox :value="item.id">{{ item.ruleName }}</a-checkbox>
               </a-col>
               <a-col :span="24">
-                <div style="width: 100%;margin-top: 15px">
-                  <a-button
-                      type="primary"
-                      :loading="loading"
-                      :size="'small'"
-                      preIcon="ant-design:save-filled"
-                      @click="saveDataRuleForRole">
+                <div style="width: 100%; margin-top: 15px">
+                  <a-button type="primary" :loading="loading" :size="'small'" preIcon="ant-design:save-filled" @click="saveDataRuleForRole">
                     <span>点击保存</span>
                   </a-button>
                 </div>
               </a-col>
             </a-row>
           </a-checkbox-group>
-          <a-empty v-else description="无配置信息"/>
+          <a-empty v-else description="无配置信息" />
         </a-tab-pane>
       </a-tabs>
     </a-spin>
@@ -34,54 +25,54 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, unref } from 'vue'
-import { BasicDrawer, useDrawerInner } from '/@/components/Drawer'
+  import { ref, unref } from 'vue';
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
 
-import { queryDepartDataRule, saveDepartDataRule } from '../depart.api'
+  import { queryDepartDataRule, saveDepartDataRule } from '../depart.api';
 
-defineEmits(['register'])
-const loading = ref<boolean>(false)
-const departId = ref('')
-const functionId = ref('')
-const dataRuleList = ref<Array<any>>([])
-const dataRuleChecked = ref<Array<any>>([])
+  defineEmits(['register']);
+  const loading = ref<boolean>(false);
+  const departId = ref('');
+  const functionId = ref('');
+  const dataRuleList = ref<Array<any>>([]);
+  const dataRuleChecked = ref<Array<any>>([]);
 
-// 注册抽屉组件
-const [registerDrawer, { closeDrawer }] = useDrawerInner((data) => {
-  departId.value = unref(data.departId)
-  functionId.value = unref(data.functionId)
-  loadData()
-})
+  // 注册抽屉组件
+  const [registerDrawer, { closeDrawer }] = useDrawerInner((data) => {
+    departId.value = unref(data.departId);
+    functionId.value = unref(data.functionId);
+    loadData();
+  });
 
-async function loadData() {
-  try {
-    loading.value = true
-    const { datarule, drChecked } = await queryDepartDataRule(functionId, departId)
-    dataRuleList.value = datarule
-    if (drChecked) {
-      dataRuleChecked.value = drChecked.split(',')
+  async function loadData() {
+    try {
+      loading.value = true;
+      const { datarule, drChecked } = await queryDepartDataRule(functionId, departId);
+      dataRuleList.value = datarule;
+      if (drChecked) {
+        dataRuleChecked.value = drChecked.split(',');
+      }
+    } finally {
+      loading.value = false;
     }
-  } finally {
-    loading.value = false
   }
-}
 
-function saveDataRuleForRole() {
-  let params = {
-    departId: departId.value,
-    permissionId: functionId.value,
-    dataRuleIds: dataRuleChecked.value.join(','),
+  function saveDataRuleForRole() {
+    let params = {
+      departId: departId.value,
+      permissionId: functionId.value,
+      dataRuleIds: dataRuleChecked.value.join(','),
+    };
+    saveDepartDataRule(params);
   }
-  saveDepartDataRule(params)
-}
 
-function onClose() {
-  doReset()
-}
+  function onClose() {
+    doReset();
+  }
 
-function doReset() {
-  functionId.value = ''
-  dataRuleList.value = []
-  dataRuleChecked.value = []
-}
-</script>
\ No newline at end of file
+  function doReset() {
+    functionId.value = '';
+    dataRuleList.value = [];
+    dataRuleChecked.value = [];
+  }
+</script>
diff --git a/src/views/system/depart/components/DepartFormModal.vue b/src/views/system/depart/components/DepartFormModal.vue
index fbc9e1d..7376154 100644
--- a/src/views/system/depart/components/DepartFormModal.vue
+++ b/src/views/system/depart/components/DepartFormModal.vue
@@ -1,95 +1,92 @@
 <template>
-  <BasicModal
-      :title="title"
-      :width="800"
-      v-bind="$attrs"
-      @ok="handleOk"
-      @register="registerModal">
-    <BasicForm @register="registerForm"/>
+  <BasicModal :title="title" :width="800" v-bind="$attrs" @ok="handleOk" @register="registerModal">
+    <BasicForm @register="registerForm" />
   </BasicModal>
 </template>
 
-
 <script lang="ts" setup>
-import { watch, computed, inject, ref, unref, onMounted } from 'vue'
+  import { watch, computed, inject, ref, unref, onMounted } from 'vue';
 
-import { BasicForm, useForm } from '/@/components/Form/index'
-import { BasicModal, useModalInner } from '/@/components/Modal'
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
 
-import { saveOrUpdateDepart } from '../depart.api'
-import { useBasicFormSchema, orgCategoryOptions } from '../depart.data'
+  import { saveOrUpdateDepart } from '../depart.api';
+  import { useBasicFormSchema, orgCategoryOptions } from '../depart.data';
 
-const emit = defineEmits(['success', 'register'])
-const props = defineProps({
-  rootTreeData: { type: Array, default: () => [] },
-})
-const prefixCls = inject('prefixCls')
-// 当前是否是更新模式
-const isUpdate = ref<boolean>(false)
-// 当前的弹窗数据
-const model = ref<object>({})
-const title = computed(() => isUpdate.value ? '编辑' : '新增')
+  const emit = defineEmits(['success', 'register']);
+  const props = defineProps({
+    rootTreeData: { type: Array, default: () => [] },
+  });
+  const prefixCls = inject('prefixCls');
+  // 当前是否是更新模式
+  const isUpdate = ref<boolean>(false);
+  // 当前的弹窗数据
+  const model = ref<object>({});
+  const title = computed(() => (isUpdate.value ? '编辑' : '新增'));
 
-//注册表单
-const [registerForm, { resetFields, setFieldsValue, validate, updateSchema }] = useForm({
-  schemas: useBasicFormSchema().basicFormSchema,
-  showActionButtonGroup: false,
-})
+  //注册表单
+  const [registerForm, { resetFields, setFieldsValue, validate, updateSchema }] = useForm({
+    schemas: useBasicFormSchema().basicFormSchema,
+    showActionButtonGroup: false,
+  });
 
-// 注册弹窗
-const [registerModal, { setModalProps, closeModal }] = useModalInner(async data => {
-  await resetFields()
-  isUpdate.value = unref(data?.isUpdate)
-  // 当前是否为添加子级
-  let isChild = unref(data?.isChild)
-  let categoryOptions = isChild ? orgCategoryOptions.child : orgCategoryOptions.root
-  // 隐藏不需要展示的字段
-  updateSchema([
-    {
-      field: 'parentId',
-      show: isChild,
-      componentProps: {
-        // 如果是添加子部门，就禁用该字段
-        disabled: isChild,
-        treeData: props.rootTreeData,
+  // 注册弹窗
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    await resetFields();
+    isUpdate.value = unref(data?.isUpdate);
+    // 当前是否为添加子级
+    let isChild = unref(data?.isChild);
+    let categoryOptions = isChild ? orgCategoryOptions.child : orgCategoryOptions.root;
+    // 隐藏不需要展示的字段
+    updateSchema([
+      {
+        field: 'parentId',
+        show: isChild,
+        componentProps: {
+          // 如果是添加子部门，就禁用该字段
+          disabled: isChild,
+          treeData: props.rootTreeData,
+        },
       },
-    },
-    {
-      field: 'orgCode',
-      show: false,
-    },
-    {
-      field: 'orgCategory',
-      componentProps: { options: categoryOptions },
-    },
-  ])
+      {
+        field: 'orgCode',
+        show: false,
+      },
+      {
+        field: 'orgCategory',
+        componentProps: { options: categoryOptions },
+      },
+    ]);
 
-  let record = unref(data?.record)
-  if (typeof record !== 'object') {
-    record = {}
-  }
-  // 赋默认值
-  record = Object.assign({
-    departOrder: 0,
-    orgCategory: categoryOptions[0].value,
-  }, record)
-  model.value = record
-  await setFieldsValue({ ...record })
-})
+    let record = unref(data?.record);
+    if (typeof record !== 'object') {
+      record = {};
+    }
+    // 赋默认值
+    record = Object.assign(
+      {
+        departOrder: 0,
+        orgCategory: categoryOptions[0].value,
+      },
+      record
+    );
+    model.value = record;
+    await setFieldsValue({ ...record });
+  });
 
-// 提交事件
-async function handleOk() {
-  try {
-    setModalProps({ confirmLoading: true })
-    let values = await validate()
-    //提交表单
-    await saveOrUpdateDepart(values, isUpdate.value)
-    //关闭弹窗
-    closeModal()
-    //刷新列表
-    emit('success')
-  } finally {
-    setModalProps({ confirmLoading: false })
+  // 提交事件
+  async function handleOk() {
+    try {
+      setModalProps({ confirmLoading: true });
+      let values = await validate();
+      //提交表单
+      await saveOrUpdateDepart(values, isUpdate.value);
+      //关闭弹窗
+      closeModal();
+      //刷新列表
+      emit('success');
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
   }
-}
-</script>
\ No newline at end of file
+</script>
diff --git a/src/views/system/depart/components/DepartFormTab.vue b/src/views/system/depart/components/DepartFormTab.vue
index 420ec17..83600c5 100644
--- a/src/views/system/depart/components/DepartFormTab.vue
+++ b/src/views/system/depart/components/DepartFormTab.vue
@@ -1,7 +1,7 @@
 <template>
   <a-spin :spinning="loading">
-    <BasicForm @register="registerForm"/>
-    <div class="j-box-bottom-button offset-20" style="margin-top: 30px;">
+    <BasicForm @register="registerForm" />
+    <div class="j-box-bottom-button offset-20" style="margin-top: 30px">
       <div class="j-box-bottom-button-float">
         <a-button preIcon="ant-design:sync-outlined" @click="onReset">重置</a-button>
         <a-button type="primary" preIcon="ant-design:save-filled" @click="onSubmit">保存</a-button>
@@ -11,93 +11,104 @@
 </template>
 
 <script lang="ts" setup>
-import { watch, computed, inject, ref, unref, onMounted } from 'vue'
-import { BasicForm, useForm } from '/@/components/Form/index'
-import { saveOrUpdateDepart } from '../depart.api'
-import { useBasicFormSchema, orgCategoryOptions } from '../depart.data'
+  import { watch, computed, inject, ref, unref, onMounted } from 'vue';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { saveOrUpdateDepart } from '../depart.api';
+  import { useBasicFormSchema, orgCategoryOptions } from '../depart.data';
 
-const emit = defineEmits(['success'])
-const props = defineProps({
-  data: { type: Object, default: () => ({}) },
-  rootTreeData: { type: Array, default: () => [] },
-})
-const prefixCls = inject('prefixCls')
-const loading = ref<boolean>(false)
-// 当前是否是更新模式
-const isUpdate = ref<boolean>(true)
-// 当前的弹窗数据
-const model = ref<object>({})
+  const emit = defineEmits(['success']);
+  const props = defineProps({
+    data: { type: Object, default: () => ({}) },
+    rootTreeData: { type: Array, default: () => [] },
+  });
+  const prefixCls = inject('prefixCls');
+  const loading = ref<boolean>(false);
+  // 当前是否是更新模式
+  const isUpdate = ref<boolean>(true);
+  // 当前的弹窗数据
+  const model = ref<object>({});
 
-//注册表单
-const [registerForm, { resetFields, setFieldsValue, validate, updateSchema }] = useForm({
-  schemas: useBasicFormSchema().basicFormSchema,
-  showActionButtonGroup: false,
-})
+  //注册表单
+  const [registerForm, { resetFields, setFieldsValue, validate, updateSchema }] = useForm({
+    schemas: useBasicFormSchema().basicFormSchema,
+    showActionButtonGroup: false,
+  });
 
-const categoryOptions = computed(() => {
-  if (!!props?.data?.parentId) {
-    return orgCategoryOptions.child
-  } else {
-    return orgCategoryOptions.root
-  }
-})
-
-onMounted(() => {
-  // 禁用字段
-  updateSchema([
-    { field: 'parentId', componentProps: { disabled: true } },
-    { field: 'orgCode', componentProps: { disabled: true } },
-  ])
-  // data 变化，重填表单
-  watch(() => props.data, async () => {
-    let record = unref(props.data)
-    if (typeof record !== 'object') {
-      record = {}
+  const categoryOptions = computed(() => {
+    if (!!props?.data?.parentId) {
+      return orgCategoryOptions.child;
+    } else {
+      return orgCategoryOptions.root;
     }
-    model.value = record
-    await resetFields()
-    await setFieldsValue({ ...record })
-  }, { deep: true, immediate: true })
-  // 更新 父部门 选项
-  watch(() => props.rootTreeData, async () => {
+  });
+
+  onMounted(() => {
+    // 禁用字段
     updateSchema([
-      {
-        field: 'parentId',
-        componentProps: { treeData: props.rootTreeData },
+      { field: 'parentId', componentProps: { disabled: true } },
+      { field: 'orgCode', componentProps: { disabled: true } },
+    ]);
+    // data 变化，重填表单
+    watch(
+      () => props.data,
+      async () => {
+        let record = unref(props.data);
+        if (typeof record !== 'object') {
+          record = {};
+        }
+        model.value = record;
+        await resetFields();
+        await setFieldsValue({ ...record });
       },
-    ])
-  }, { deep: true, immediate: true })
-  // 监听并更改 orgCategory options
-  watch(categoryOptions, async () => {
-    updateSchema([
-      {
-        field: 'orgCategory',
-        componentProps: { options: categoryOptions.value },
+      { deep: true, immediate: true }
+    );
+    // 更新 父部门 选项
+    watch(
+      () => props.rootTreeData,
+      async () => {
+        updateSchema([
+          {
+            field: 'parentId',
+            componentProps: { treeData: props.rootTreeData },
+          },
+        ]);
       },
-    ])
-  }, { immediate: true })
+      { deep: true, immediate: true }
+    );
+    // 监听并更改 orgCategory options
+    watch(
+      categoryOptions,
+      async () => {
+        updateSchema([
+          {
+            field: 'orgCategory',
+            componentProps: { options: categoryOptions.value },
+          },
+        ]);
+      },
+      { immediate: true }
+    );
+  });
 
-})
-
-// 重置表单
-async function onReset() {
-  await resetFields()
-  await setFieldsValue({ ...model.value })
-}
-
-// 提交事件
-async function onSubmit() {
-  try {
-    loading.value = true
-    let values = await validate()
-    values = Object.assign({}, model.value, values)
-    //提交表单
-    await saveOrUpdateDepart(values, isUpdate.value)
-    //刷新列表
-    emit('success')
-    Object.assign(model.value, values)
-  } finally {
-    loading.value = false
+  // 重置表单
+  async function onReset() {
+    await resetFields();
+    await setFieldsValue({ ...model.value });
   }
-}
-</script>
\ No newline at end of file
+
+  // 提交事件
+  async function onSubmit() {
+    try {
+      loading.value = true;
+      let values = await validate();
+      values = Object.assign({}, model.value, values);
+      //提交表单
+      await saveOrUpdateDepart(values, isUpdate.value);
+      //刷新列表
+      emit('success');
+      Object.assign(model.value, values);
+    } finally {
+      loading.value = false;
+    }
+  }
+</script>
diff --git a/src/views/system/depart/components/DepartLeftTree.vue b/src/views/system/depart/components/DepartLeftTree.vue
index 0f0a4b5..503a03b 100644
--- a/src/views/system/depart/components/DepartLeftTree.vue
+++ b/src/views/system/depart/components/DepartLeftTree.vue
@@ -1,6 +1,6 @@
 <template>
-  <a-card :bordered="false" style="height: 100%;">
-    <div class="j-table-operator" style="width: 100%;">
+  <a-card :bordered="false" style="height: 100%">
+    <div class="j-table-operator" style="width: 100%">
       <a-button type="primary" preIcon="ant-design:plus-outlined" @click="onAddDepart">新增</a-button>
       <a-button type="primary" preIcon="ant-design:plus-outlined" @click="onAddChildDepart()">添加下级</a-button>
       <a-upload name="file" :showUploadList="false" :customRequest="onImportXls">
@@ -14,24 +14,24 @@
           <template #overlay>
             <a-menu>
               <a-menu-item key="1" @click="onDeleteBatch">
-                <icon icon="ant-design:delete-outlined"/>
+                <icon icon="ant-design:delete-outlined" />
                 <span>删除</span>
               </a-menu-item>
             </a-menu>
           </template>
           <a-button>
             <span>批量操作 </span>
-            <icon icon="akar-icons:chevron-down"/>
+            <icon icon="akar-icons:chevron-down" />
           </a-button>
         </a-dropdown>
       </template>
     </div>
-    <a-alert type="info" show-icon class="alert" style="margin-bottom: 8px;">
+    <a-alert type="info" show-icon class="alert" style="margin-bottom: 8px">
       <template #message>
         <template v-if="checkedKeys.length > 0">
           <span>已选中 {{ checkedKeys.length }} 条记录</span>
-          <a-divider type="vertical"/>
-          <a @click="checkedKeys=[]">清空</a>
+          <a-divider type="vertical" />
+          <a @click="checkedKeys = []">清空</a>
         </template>
         <template v-else>
           <span>未选中任何数据</span>
@@ -39,32 +39,32 @@
       </template>
     </a-alert>
     <a-spin :spinning="loading">
-      <a-input-search placeholder="按部门名称搜索…" style="margin-bottom: 10px" @search="onSearch"/>
+      <a-input-search placeholder="按部门名称搜索…" style="margin-bottom: 10px" @search="onSearch" />
       <!--组织机构树-->
       <template v-if="treeData.length > 0">
         <a-tree
-            v-if="!treeReloading"
-            checkable
-            :clickRowToExpand="false"
-            :treeData="treeData"
-            :selectedKeys="selectedKeys"
-            :checkStrictly="checkStrictly"
-            :load-data="loadChildrenTreeData"
-            :checkedKeys="checkedKeys"
-            v-model:expandedKeys="expandedKeys"
-            @check="onCheck"
-            @select="onSelect"
+          v-if="!treeReloading"
+          checkable
+          :clickRowToExpand="false"
+          :treeData="treeData"
+          :selectedKeys="selectedKeys"
+          :checkStrictly="checkStrictly"
+          :load-data="loadChildrenTreeData"
+          :checkedKeys="checkedKeys"
+          v-model:expandedKeys="expandedKeys"
+          @check="onCheck"
+          @select="onSelect"
         >
           <template #title="{ key: treeKey, title, dataRef }">
             <a-dropdown :trigger="['contextmenu']">
               <Popconfirm
-                  :visible="visibleTreeKey===treeKey"
-                  title="确定要删除吗？"
-                  ok-text="确定"
-                  cancel-text="取消"
-                  placement="rightTop"
-                  @confirm="onDelete(dataRef)"
-                  @visibleChange="onVisibleChange"
+                :visible="visibleTreeKey === treeKey"
+                title="确定要删除吗？"
+                ok-text="确定"
+                cancel-text="取消"
+                placement="rightTop"
+                @confirm="onDelete(dataRef)"
+                @visibleChange="onVisibleChange"
               >
                 <span>{{ title }}</span>
               </Popconfirm>
@@ -72,261 +72,260 @@
               <template #overlay>
                 <a-menu @click="">
                   <a-menu-item key="1" @click="onAddChildDepart(dataRef)">添加子级</a-menu-item>
-                  <a-menu-item key="2" @click="visibleTreeKey=treeKey">
-                    <span style="color: red;">删除</span>
+                  <a-menu-item key="2" @click="visibleTreeKey = treeKey">
+                    <span style="color: red">删除</span>
                   </a-menu-item>
                 </a-menu>
               </template>
             </a-dropdown>
           </template>
-
         </a-tree>
       </template>
-      <a-empty v-else description="暂无数据"/>
+      <a-empty v-else description="暂无数据" />
     </a-spin>
-    <DepartFormModal :rootTreeData="treeData" @register="registerModal" @success="loadRootTreeData"/>
+    <DepartFormModal :rootTreeData="treeData" @register="registerModal" @success="loadRootTreeData" />
   </a-card>
 </template>
 
 <script lang="ts" setup>
-import { inject, nextTick, ref, unref, defineExpose } from 'vue'
-import { useModal } from '/@/components/Modal'
-import { useMessage } from '/@/hooks/web/useMessage'
-import { useMethods } from '/@/hooks/system/useMethods'
-import { Api, deleteBatchDepart, queryDepartTreeSync } from '../depart.api'
-import { searchByKeywords } from '/@/views/system/departUser/depart.user.api'
-import DepartFormModal from '/@/views/system/depart/components/DepartFormModal.vue'
-import { Popconfirm } from 'ant-design-vue'
+  import { inject, nextTick, ref, unref, defineExpose } from 'vue';
+  import { useModal } from '/@/components/Modal';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { useMethods } from '/@/hooks/system/useMethods';
+  import { Api, deleteBatchDepart, queryDepartTreeSync } from '../depart.api';
+  import { searchByKeywords } from '/@/views/system/departUser/depart.user.api';
+  import DepartFormModal from '/@/views/system/depart/components/DepartFormModal.vue';
+  import { Popconfirm } from 'ant-design-vue';
 
-const prefixCls = inject('prefixCls')
-const emit = defineEmits(['select', 'rootTreeData'])
-const { createMessage } = useMessage()
-const { handleImportXls, handleExportXls } = useMethods()
+  const prefixCls = inject('prefixCls');
+  const emit = defineEmits(['select', 'rootTreeData']);
+  const { createMessage } = useMessage();
+  const { handleImportXls, handleExportXls } = useMethods();
 
-const loading = ref<boolean>(false)
-// 部门树列表数据
-const treeData = ref<any[]>([])
-// 当前选中的项
-const checkedKeys = ref<any[]>([])
-// 当前展开的项
-const expandedKeys = ref<any[]>([])
-// 当前选中的项
-const selectedKeys = ref<any[]>([])
-// 树组件重新加载
-const treeReloading = ref<boolean>(false)
-// 树父子是否关联
-const checkStrictly = ref<boolean>(true)
-// 当前选中的部门
-const currentDepart = ref<any>(null)
-// 控制确认删除提示框是否显示
-const visibleTreeKey = ref<any>(null)
-// 搜索关键字
-const searchKeyword = ref('')
+  const loading = ref<boolean>(false);
+  // 部门树列表数据
+  const treeData = ref<any[]>([]);
+  // 当前选中的项
+  const checkedKeys = ref<any[]>([]);
+  // 当前展开的项
+  const expandedKeys = ref<any[]>([]);
+  // 当前选中的项
+  const selectedKeys = ref<any[]>([]);
+  // 树组件重新加载
+  const treeReloading = ref<boolean>(false);
+  // 树父子是否关联
+  const checkStrictly = ref<boolean>(true);
+  // 当前选中的部门
+  const currentDepart = ref<any>(null);
+  // 控制确认删除提示框是否显示
+  const visibleTreeKey = ref<any>(null);
+  // 搜索关键字
+  const searchKeyword = ref('');
 
-// 注册 modal
-const [registerModal, { openModal }] = useModal()
+  // 注册 modal
+  const [registerModal, { openModal }] = useModal();
 
-// 加载顶级部门信息
-async function loadRootTreeData() {
-  try {
-    loading.value = true
-    treeData.value = []
-    const result = await queryDepartTreeSync()
-    if (Array.isArray(result)) {
-      treeData.value = result
-    }
-    if (expandedKeys.value.length === 0) {
-      autoExpandParentNode()
-    } else {
-      if (selectedKeys.value.length === 0) {
-        let item = treeData.value[0]
-        if (item) {
-          // 默认选中第一个
-          setSelectedKey(item.id, item)
-        }
-      } else {
-        emit('select', currentDepart.value)
+  // 加载顶级部门信息
+  async function loadRootTreeData() {
+    try {
+      loading.value = true;
+      treeData.value = [];
+      const result = await queryDepartTreeSync();
+      if (Array.isArray(result)) {
+        treeData.value = result;
       }
+      if (expandedKeys.value.length === 0) {
+        autoExpandParentNode();
+      } else {
+        if (selectedKeys.value.length === 0) {
+          let item = treeData.value[0];
+          if (item) {
+            // 默认选中第一个
+            setSelectedKey(item.id, item);
+          }
+        } else {
+          emit('select', currentDepart.value);
+        }
+      }
+      emit('rootTreeData', treeData.value);
+    } finally {
+      loading.value = false;
     }
-    emit('rootTreeData', treeData.value)
-  } finally {
-    loading.value = false
   }
-}
 
-loadRootTreeData()
+  loadRootTreeData();
 
-// 加载子级部门信息
-async function loadChildrenTreeData(treeNode) {
-  try {
-    const result = await queryDepartTreeSync({
-      pid: treeNode.dataRef.id,
-    })
-    if (result.length == 0) {
-      treeNode.dataRef.isLeaf = true
-    } else {
-      treeNode.dataRef.children = result
-      if (expandedKeys.value.length > 0) {
-        // 判断获取的子级是否有当前展开的项
-        let subKeys: any[] = []
-        for (let key of expandedKeys.value) {
-          if (result.findIndex(item => item.id === key) !== -1) {
-            subKeys.push(key)
+  // 加载子级部门信息
+  async function loadChildrenTreeData(treeNode) {
+    try {
+      const result = await queryDepartTreeSync({
+        pid: treeNode.dataRef.id,
+      });
+      if (result.length == 0) {
+        treeNode.dataRef.isLeaf = true;
+      } else {
+        treeNode.dataRef.children = result;
+        if (expandedKeys.value.length > 0) {
+          // 判断获取的子级是否有当前展开的项
+          let subKeys: any[] = [];
+          for (let key of expandedKeys.value) {
+            if (result.findIndex((item) => item.id === key) !== -1) {
+              subKeys.push(key);
+            }
+          }
+          if (subKeys.length > 0) {
+            expandedKeys.value = [...expandedKeys.value];
           }
         }
-        if (subKeys.length > 0) {
-          expandedKeys.value = [...expandedKeys.value]
+      }
+      treeData.value = [...treeData.value];
+      emit('rootTreeData', treeData.value);
+    } catch (e) {
+      console.error(e);
+    }
+    return Promise.resolve();
+  }
+
+  // 自动展开父节点，只展开一级
+  function autoExpandParentNode() {
+    let item = treeData.value[0];
+    if (item) {
+      if (!item.isLeaf) {
+        expandedKeys.value = [item.key];
+      }
+      // 默认选中第一个
+      setSelectedKey(item.id, item);
+      reloadTree();
+    } else {
+      emit('select', null);
+    }
+  }
+
+  // 重新加载树组件，防止无法默认展开数据
+  async function reloadTree() {
+    await nextTick();
+    treeReloading.value = true;
+    await nextTick();
+    treeReloading.value = false;
+  }
+
+  /**
+   * 设置当前选中的行
+   */
+  function setSelectedKey(key: string, data?: object) {
+    selectedKeys.value = [key];
+    if (data) {
+      currentDepart.value = data;
+      emit('select', data);
+    }
+  }
+
+  // 添加一级部门
+  function onAddDepart() {
+    openModal(true, { isUpdate: false, isChild: false });
+  }
+
+  // 添加子级部门
+  function onAddChildDepart(data = currentDepart.value) {
+    if (data == null) {
+      createMessage.warning('请先选择一个部门');
+      return;
+    }
+    const record = { parentId: data.id };
+    openModal(true, { isUpdate: false, isChild: true, record });
+  }
+
+  // 搜索事件
+  async function onSearch(value: string) {
+    if (value) {
+      try {
+        loading.value = true;
+        treeData.value = [];
+        let result = await searchByKeywords({ keyWord: value });
+        if (Array.isArray(result)) {
+          treeData.value = result;
         }
+        autoExpandParentNode();
+      } finally {
+        loading.value = false;
+      }
+    } else {
+      loadRootTreeData();
+    }
+    searchKeyword.value = value;
+  }
+
+  // 树复选框选择事件
+  function onCheck(e) {
+    if (Array.isArray(e)) {
+      checkedKeys.value = e;
+    } else {
+      checkedKeys.value = e.checked;
+    }
+  }
+
+  // 树选择事件
+  function onSelect(selKeys, event) {
+    if (selKeys.length > 0 && selectedKeys.value[0] !== selKeys[0]) {
+      setSelectedKey(selKeys[0], event.selectedNodes[0].props);
+    } else {
+      // 这样可以防止用户取消选择
+      setSelectedKey(selectedKeys.value[0]);
+    }
+  }
+
+  /**
+   * 根据 ids 删除部门
+   * @param idListRef array
+   * @param confirm 是否显示确认提示框
+   */
+  async function doDeleteDepart(idListRef, confirm = true) {
+    const idList = unref(idListRef);
+    if (idList.length > 0) {
+      try {
+        loading.value = true;
+        await deleteBatchDepart({ ids: idList.join(',') }, confirm);
+        await loadRootTreeData();
+      } finally {
+        loading.value = false;
       }
     }
-    treeData.value = [...treeData.value]
-    emit('rootTreeData', treeData.value)
-  } catch (e) {
-    console.error(e)
   }
-  return Promise.resolve()
-}
 
-// 自动展开父节点，只展开一级
-function autoExpandParentNode() {
-  let item = treeData.value[0]
-  if (item) {
-    if (!item.isLeaf) {
-      expandedKeys.value = [item.key]
+  // 删除单个部门
+  async function onDelete(data) {
+    if (data) {
+      onVisibleChange(false);
+      doDeleteDepart([data.id], false);
     }
-    // 默认选中第一个
-    setSelectedKey(item.id, item)
-    reloadTree()
-  } else {
-    emit('select', null)
   }
-}
 
-// 重新加载树组件，防止无法默认展开数据
-async function reloadTree() {
-  await nextTick()
-  treeReloading.value = true
-  await nextTick()
-  treeReloading.value = false
-}
-
-/**
- * 设置当前选中的行
- */
-function setSelectedKey(key: string, data?: object) {
-  selectedKeys.value = [key]
-  if (data) {
-    currentDepart.value = data
-    emit('select', data)
-  }
-}
-
-// 添加一级部门
-function onAddDepart() {
-  openModal(true, { isUpdate: false, isChild: false })
-}
-
-// 添加子级部门
-function onAddChildDepart(data = currentDepart.value) {
-  if (data == null) {
-    createMessage.warning('请先选择一个部门')
-    return
-  }
-  const record = { parentId: data.id }
-  openModal(true, { isUpdate: false, isChild: true, record })
-}
-
-// 搜索事件
-async function onSearch(value: string) {
-  if (value) {
+  // 批量删除部门
+  async function onDeleteBatch() {
     try {
-      loading.value = true
-      treeData.value = []
-      let result = await searchByKeywords({ keyWord: value })
-      if (Array.isArray(result)) {
-        treeData.value = result
-      }
-      autoExpandParentNode()
+      await doDeleteDepart(checkedKeys);
+      checkedKeys.value = [];
     } finally {
-      loading.value = false
-    }
-  } else {
-    loadRootTreeData()
-  }
-  searchKeyword.value = value
-}
-
-// 树复选框选择事件
-function onCheck(e) {
-  if (Array.isArray(e)) {
-    checkedKeys.value = e
-  } else {
-    checkedKeys.value = e.checked
-  }
-}
-
-// 树选择事件
-function onSelect(selKeys, event) {
-  if (selKeys.length > 0 && selectedKeys.value[0] !== selKeys[0]) {
-    setSelectedKey(selKeys[0], event.selectedNodes[0].props)
-  } else {
-    // 这样可以防止用户取消选择
-    setSelectedKey(selectedKeys.value[0])
-  }
-}
-
-/**
- * 根据 ids 删除部门
- * @param idListRef array
- * @param confirm 是否显示确认提示框
- */
-async function doDeleteDepart(idListRef, confirm = true) {
-  const idList = unref(idListRef)
-  if (idList.length > 0) {
-    try {
-      loading.value = true
-      await deleteBatchDepart({ ids: idList.join(',') }, confirm)
-      await loadRootTreeData()
-    } finally {
-      loading.value = false
     }
   }
-}
 
-// 删除单个部门
-async function onDelete(data) {
-  if (data) {
-    onVisibleChange(false)
-    doDeleteDepart([data.id], false)
+  function onVisibleChange(visible) {
+    if (!visible) {
+      visibleTreeKey.value = null;
+    }
   }
-}
 
-// 批量删除部门
-async function onDeleteBatch() {
-  try {
-    await doDeleteDepart(checkedKeys)
-    checkedKeys.value = []
-  } finally {
+  function onImportXls(d) {
+    handleImportXls(d, Api.importExcelUrl, () => {
+      loadRootTreeData();
+    });
   }
-}
 
-function onVisibleChange(visible) {
-  if (!visible) {
-    visibleTreeKey.value = null
+  function onExportXls() {
+    handleExportXls('部门信息', Api.exportXlsUrl);
   }
-}
 
-function onImportXls(d) {
-  handleImportXls(d, Api.importExcelUrl, () => {
-    loadRootTreeData()
-  })
-}
-
-function onExportXls() {
-  handleExportXls('部门信息', Api.exportXlsUrl)
-}
-
-defineExpose({
-  loadRootTreeData,
-})
-</script>
\ No newline at end of file
+  defineExpose({
+    loadRootTreeData,
+  });
+</script>
diff --git a/src/views/system/depart/components/DepartRuleTab.vue b/src/views/system/depart/components/DepartRuleTab.vue
index 343c1b4..fcf8fe0 100644
--- a/src/views/system/depart/components/DepartRuleTab.vue
+++ b/src/views/system/depart/components/DepartRuleTab.vue
@@ -2,28 +2,28 @@
   <a-spin :spinning="loading">
     <template v-if="treeData.length > 0">
       <BasicTree
-          ref="basicTree"
-          class="depart-rule-tree"
-          checkable
-          :treeData="treeData"
-          :checkedKeys="checkedKeys"
-          :selectedKeys="selectedKeys"
-          :expandedKeys="expandedKeys"
-          :checkStrictly="checkStrictly"
-          style="height:500px; overflow: auto;"
-          @check="onCheck"
-          @expand="onExpand"
-          @select="onSelect"
+        ref="basicTree"
+        class="depart-rule-tree"
+        checkable
+        :treeData="treeData"
+        :checkedKeys="checkedKeys"
+        :selectedKeys="selectedKeys"
+        :expandedKeys="expandedKeys"
+        :checkStrictly="checkStrictly"
+        style="height: 500px; overflow: auto"
+        @check="onCheck"
+        @expand="onExpand"
+        @select="onSelect"
       >
-        <template #title="{slotTitle, ruleFlag}">
+        <template #title="{ slotTitle, ruleFlag }">
           <span>{{ slotTitle }}</span>
-          <Icon v-if="ruleFlag" icon="ant-design:align-left-outlined" style="margin-left:5px;color: red;"/>
+          <Icon v-if="ruleFlag" icon="ant-design:align-left-outlined" style="margin-left: 5px; color: red" />
         </template>
       </BasicTree>
     </template>
-    <a-empty v-else description="无可配置部门权限"/>
+    <a-empty v-else description="无可配置部门权限" />
 
-    <div class="j-box-bottom-button offset-20" style="margin-top: 30px;">
+    <div class="j-box-bottom-button offset-20" style="margin-top: 30px">
       <div class="j-box-bottom-button-float">
         <a-dropdown :trigger="['click']" placement="topCenter">
           <template #overlay>
@@ -36,135 +36,134 @@
           </template>
           <a-button style="float: left">
             树操作
-            <Icon icon="ant-design:up-outlined"/>
+            <Icon icon="ant-design:up-outlined" />
           </a-button>
         </a-dropdown>
         <a-button type="primary" preIcon="ant-design:save-filled" @click="onSubmit">保存</a-button>
       </div>
     </div>
   </a-spin>
-  <DepartDataRuleDrawer @register="registerDataRuleDrawer"/>
+  <DepartDataRuleDrawer @register="registerDataRuleDrawer" />
 </template>
 
 <script lang="ts" setup>
-import { watch, computed, inject, ref, nextTick } from 'vue'
-import { useDrawer } from '/@/components/Drawer'
-import { BasicTree } from '/@/components/Tree/index'
-import DepartDataRuleDrawer from './DepartDataRuleDrawer.vue'
-import { queryRoleTreeList, queryDepartPermission, saveDepartPermission } from '../depart.api'
+  import { watch, computed, inject, ref, nextTick } from 'vue';
+  import { useDrawer } from '/@/components/Drawer';
+  import { BasicTree } from '/@/components/Tree/index';
+  import DepartDataRuleDrawer from './DepartDataRuleDrawer.vue';
+  import { queryRoleTreeList, queryDepartPermission, saveDepartPermission } from '../depart.api';
 
-const props = defineProps({
-  data: { type: Object, default: () => ({}) },
-})
-// 当前选中的部门ID，可能会为空，代表未选择部门
-const departId = computed(() => props.data?.id)
+  const props = defineProps({
+    data: { type: Object, default: () => ({}) },
+  });
+  // 当前选中的部门ID，可能会为空，代表未选择部门
+  const departId = computed(() => props.data?.id);
 
-const prefixCls = inject('prefixCls')
-const basicTree = ref()
-const loading = ref<boolean>(false)
-const treeData = ref<any[]>([])
-const expandedKeys = ref<Array<any>>([])
-const selectedKeys = ref<Array<any>>([])
-const checkedKeys = ref<Array<any>>([])
-const lastCheckedKeys = ref<Array<any>>([])
-const checkStrictly = ref(true)
+  const prefixCls = inject('prefixCls');
+  const basicTree = ref();
+  const loading = ref<boolean>(false);
+  const treeData = ref<any[]>([]);
+  const expandedKeys = ref<Array<any>>([]);
+  const selectedKeys = ref<Array<any>>([]);
+  const checkedKeys = ref<Array<any>>([]);
+  const lastCheckedKeys = ref<Array<any>>([]);
+  const checkStrictly = ref(true);
 
-// 注册数据规则授权弹窗抽屉
-const [registerDataRuleDrawer, dataRuleDrawer] = useDrawer()
+  // 注册数据规则授权弹窗抽屉
+  const [registerDataRuleDrawer, dataRuleDrawer] = useDrawer();
 
-// onCreated
-loadData()
-watch(departId, () => loadDepartPermission(), { immediate: true })
+  // onCreated
+  loadData();
+  watch(departId, () => loadDepartPermission(), { immediate: true });
 
-async function loadData() {
-  try {
-    loading.value = true
-    let { treeList } = await queryRoleTreeList()
-    treeData.value = treeList
-    await nextTick()
-    toggleExpandAll(true)
-  } finally {
-    loading.value = false
-  }
-}
-
-async function loadDepartPermission() {
-  if (departId.value) {
+  async function loadData() {
     try {
-      loading.value = true
-      let keys = await queryDepartPermission({ departId: departId.value })
-      checkedKeys.value = keys
-      lastCheckedKeys.value = [...keys]
+      loading.value = true;
+      let { treeList } = await queryRoleTreeList();
+      treeData.value = treeList;
+      await nextTick();
+      toggleExpandAll(true);
     } finally {
-      loading.value = false
+      loading.value = false;
     }
   }
-}
 
-async function onSubmit() {
-  try {
-    loading.value = true
-    await saveDepartPermission({
-      departId: departId.value,
-      permissionIds: checkedKeys.value.join(','),
-      lastpermissionIds: lastCheckedKeys.value.join(','),
-    })
-    await loadData()
-    await loadDepartPermission()
-  } finally {
-    loading.value = false
+  async function loadDepartPermission() {
+    if (departId.value) {
+      try {
+        loading.value = true;
+        let keys = await queryDepartPermission({ departId: departId.value });
+        checkedKeys.value = keys;
+        lastCheckedKeys.value = [...keys];
+      } finally {
+        loading.value = false;
+      }
+    }
   }
-}
 
-// tree勾选复选框事件
-function onCheck(event) {
-  if (!Array.isArray(event)) {
-    checkedKeys.value = event.checked
-  } else {
-    checkedKeys.value = event
+  async function onSubmit() {
+    try {
+      loading.value = true;
+      await saveDepartPermission({
+        departId: departId.value,
+        permissionIds: checkedKeys.value.join(','),
+        lastpermissionIds: lastCheckedKeys.value.join(','),
+      });
+      await loadData();
+      await loadDepartPermission();
+    } finally {
+      loading.value = false;
+    }
   }
-}
 
-// tree展开事件
-function onExpand($expandedKeys) {
-  expandedKeys.value = $expandedKeys
-}
-
-// tree选中事件
-function onSelect($selectedKeys, { selectedNodes }) {
-  if (selectedNodes[0]?.props?.ruleFlag) {
-    let functionId = $selectedKeys[0]
-    dataRuleDrawer.openDrawer(true, { departId, functionId })
+  // tree勾选复选框事件
+  function onCheck(event) {
+    if (!Array.isArray(event)) {
+      checkedKeys.value = event.checked;
+    } else {
+      checkedKeys.value = event;
+    }
   }
-  selectedKeys.value = []
-}
 
-// 切换父子关联
-async function toggleCheckStrictly(flag) {
-  checkStrictly.value = flag
-  await nextTick()
-  checkedKeys.value = basicTree.value.getCheckedKeys()
-}
+  // tree展开事件
+  function onExpand($expandedKeys) {
+    expandedKeys.value = $expandedKeys;
+  }
 
-// 切换展开收起
-async function toggleExpandAll(flag) {
-  basicTree.value.expandAll(flag)
-  await nextTick()
-  expandedKeys.value = basicTree.value.getExpandedKeys()
-}
+  // tree选中事件
+  function onSelect($selectedKeys, { selectedNodes }) {
+    if (selectedNodes[0]?.props?.ruleFlag) {
+      let functionId = $selectedKeys[0];
+      dataRuleDrawer.openDrawer(true, { departId, functionId });
+    }
+    selectedKeys.value = [];
+  }
 
-// 切换全选
-async function toggleCheckALL(flag) {
-  basicTree.value.checkAll(flag)
-  await nextTick()
-  checkedKeys.value = basicTree.value.getCheckedKeys()
-}
+  // 切换父子关联
+  async function toggleCheckStrictly(flag) {
+    checkStrictly.value = flag;
+    await nextTick();
+    checkedKeys.value = basicTree.value.getCheckedKeys();
+  }
+
+  // 切换展开收起
+  async function toggleExpandAll(flag) {
+    basicTree.value.expandAll(flag);
+    await nextTick();
+    expandedKeys.value = basicTree.value.getExpandedKeys();
+  }
+
+  // 切换全选
+  async function toggleCheckALL(flag) {
+    basicTree.value.checkAll(flag);
+    await nextTick();
+    checkedKeys.value = basicTree.value.getCheckedKeys();
+  }
 </script>
 
 <style lang="less" scoped>
-
-// 【VUEN-188】解决滚动条不灵敏的问题
-.depart-rule-tree ::v-deep(.scrollbar__bar) {
-  pointer-events: none;
-}
-</style>
\ No newline at end of file
+  // 【VUEN-188】解决滚动条不灵敏的问题
+  .depart-rule-tree ::v-deep(.scrollbar__bar) {
+    pointer-events: none;
+  }
+</style>
diff --git a/src/views/system/depart/depart.api.ts b/src/views/system/depart/depart.api.ts
index c1bf2d7..d39c853 100644
--- a/src/views/system/depart/depart.api.ts
+++ b/src/views/system/depart/depart.api.ts
@@ -1,8 +1,8 @@
-import { unref } from 'vue'
-import { defHttp } from '/@/utils/http/axios'
-import { useMessage } from '/@/hooks/web/useMessage'
+import { unref } from 'vue';
+import { defHttp } from '/@/utils/http/axios';
+import { useMessage } from '/@/hooks/web/useMessage';
 
-const { createConfirm } = useMessage()
+const { createConfirm } = useMessage();
 
 export enum Api {
   queryDepartTreeSync = '/sys/sysDepart/queryDepartTreeSync',
@@ -26,18 +26,18 @@ export enum Api {
 /**
  * 获取部门树列表
  */
-export const queryDepartTreeSync = (params?) => defHttp.get({ url: Api.queryDepartTreeSync, params })
+export const queryDepartTreeSync = (params?) => defHttp.get({ url: Api.queryDepartTreeSync, params });
 
 /**
  * 保存或者更新部门角色
  */
 export const saveOrUpdateDepart = (params, isUpdate) => {
   if (isUpdate) {
-    return defHttp.put({ url: Api.edit, params })
+    return defHttp.put({ url: Api.edit, params });
   } else {
-    return defHttp.post({ url: Api.save, params })
+    return defHttp.post({ url: Api.save, params });
   }
-}
+};
 
 /**
  * 批量删除部门角色
@@ -45,8 +45,8 @@ export const saveOrUpdateDepart = (params, isUpdate) => {
 export const deleteBatchDepart = (params, confirm = false) => {
   return new Promise((resolve, reject) => {
     const doDelete = () => {
-      resolve(defHttp.delete({ url: Api.deleteBatch, params }, { joinParamsToUrl: true }))
-    }
+      resolve(defHttp.delete({ url: Api.deleteBatch, params }, { joinParamsToUrl: true }));
+    };
     if (confirm) {
       createConfirm({
         iconType: 'warning',
@@ -54,42 +54,42 @@ export const deleteBatchDepart = (params, confirm = false) => {
         content: '确定要删除吗？',
         onOk: () => doDelete(),
         onCancel: () => reject(),
-      })
+      });
     } else {
-      doDelete()
+      doDelete();
     }
-  })
-}
+  });
+};
 
 /**
  * 获取权限树列表
  */
-export const queryRoleTreeList = (params?) => defHttp.get({ url: Api.roleQueryTreeList, params })
+export const queryRoleTreeList = (params?) => defHttp.get({ url: Api.roleQueryTreeList, params });
 /**
  * 查询部门权限
  */
-export const queryDepartPermission = (params?) => defHttp.get({ url: Api.queryDepartPermission, params })
+export const queryDepartPermission = (params?) => defHttp.get({ url: Api.queryDepartPermission, params });
 /**
  * 保存部门权限
  */
-export const saveDepartPermission = (params) => defHttp.post({ url: Api.saveDepartPermission, params })
+export const saveDepartPermission = (params) => defHttp.post({ url: Api.saveDepartPermission, params });
 
 /**
  *  查询部门数据权限列表
  */
 export const queryDepartDataRule = (functionId, departId, params?) => {
-  let url = `${Api.dataRule}/${unref(functionId)}/${unref(departId)}`
-  return defHttp.get({ url, params })
-}
+  let url = `${Api.dataRule}/${unref(functionId)}/${unref(departId)}`;
+  return defHttp.get({ url, params });
+};
 /**
  * 保存部门数据权限
  */
-export const saveDepartDataRule = (params) => defHttp.post({ url: Api.dataRule, params })
+export const saveDepartDataRule = (params) => defHttp.post({ url: Api.dataRule, params });
 /**
  * 获取登录用户部门信息
  */
-export const getUserDeparts = (params?) => defHttp.get({ url: Api.getCurrentUserDeparts, params })
+export const getUserDeparts = (params?) => defHttp.get({ url: Api.getCurrentUserDeparts, params });
 /**
  * 切换选择部门
  */
-export const selectDepart = (params?) => defHttp.put({ url: Api.selectDepart, params })
+export const selectDepart = (params?) => defHttp.put({ url: Api.selectDepart, params });
diff --git a/src/views/system/depart/depart.data.ts b/src/views/system/depart/depart.data.ts
index bc6c0d0..9e0346e 100644
--- a/src/views/system/depart/depart.data.ts
+++ b/src/views/system/depart/depart.data.ts
@@ -1,4 +1,4 @@
-import { FormSchema } from '/@/components/Form'
+import { FormSchema } from '/@/components/Form';
 
 // 部门基础表单
 export function useBasicFormSchema() {
@@ -74,8 +74,8 @@ export function useBasicFormSchema() {
         placeholder: '请输入备注',
       },
     },
-  ]
-  return { basicFormSchema }
+  ];
+  return { basicFormSchema };
 }
 
 // 机构类型选项
@@ -83,5 +83,8 @@ export const orgCategoryOptions = {
   // 一级部门
   root: [{ value: '1', label: '公司' }],
   // 子级部门
-  child: [{ value: '2', label: '部门' }, { value: '3', label: '岗位' }],
-}
\ No newline at end of file
+  child: [
+    { value: '2', label: '部门' },
+    { value: '3', label: '岗位' },
+  ],
+};
diff --git a/src/views/system/depart/index.less b/src/views/system/depart/index.less
index 1e98464..82554ac 100644
--- a/src/views/system/depart/index.less
+++ b/src/views/system/depart/index.less
@@ -7,5 +7,4 @@
       padding: 0 20px;
     }
   }
-
-}
\ No newline at end of file
+}
diff --git a/src/views/system/depart/index.vue b/src/views/system/depart/index.vue
index 2422f4d..332b4a9 100644
--- a/src/views/system/depart/index.vue
+++ b/src/views/system/depart/index.vue
@@ -1,24 +1,24 @@
 <template>
   <a-row :class="['p-4', `${prefixCls}--box`]" type="flex" :gutter="10">
-    <a-col :xl="12" :lg="24" :md="24" style="margin-bottom: 10px;">
-      <DepartLeftTree ref="leftTree" @select="onTreeSelect" @rootTreeData="onRootTreeData"/>
+    <a-col :xl="12" :lg="24" :md="24" style="margin-bottom: 10px">
+      <DepartLeftTree ref="leftTree" @select="onTreeSelect" @rootTreeData="onRootTreeData" />
     </a-col>
-    <a-col :xl="12" :lg="24" :md="24" style="margin-bottom: 10px;">
-      <div style="height: 100%; background-color: white;">
+    <a-col :xl="12" :lg="24" :md="24" style="margin-bottom: 10px">
+      <div style="height: 100%; background-color: white">
         <a-tabs v-show="departData != null" defaultActiveKey="base-info">
-          <a-tab-pane tab="基本信息" key="base-info" forceRender style="position: relative;">
+          <a-tab-pane tab="基本信息" key="base-info" forceRender style="position: relative">
             <div style="padding: 20px">
-              <DepartFormTab :data="departData" :rootTreeData="rootTreeData" @success="onSuccess"/>
+              <DepartFormTab :data="departData" :rootTreeData="rootTreeData" @success="onSuccess" />
             </div>
           </a-tab-pane>
           <a-tab-pane tab="部门权限" key="role-info">
             <div style="padding: 0 20px 20px">
-              <DepartRuleTab :data="departData"/>
+              <DepartRuleTab :data="departData" />
             </div>
           </a-tab-pane>
         </a-tabs>
         <div v-show="departData == null" style="padding-top: 40px">
-          <a-empty description="尚未选择部门"/>
+          <a-empty description="尚未选择部门" />
         </div>
       </div>
     </a-col>
@@ -26,37 +26,37 @@
 </template>
 
 <script lang="ts" setup name="system-depart">
-import { provide, ref } from 'vue'
-import { useDesign } from '/@/hooks/web/useDesign'
-import DepartLeftTree from './components/DepartLeftTree.vue'
-import DepartFormTab from './components/DepartFormTab.vue'
-import DepartRuleTab from './components/DepartRuleTab.vue'
+  import { provide, ref } from 'vue';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import DepartLeftTree from './components/DepartLeftTree.vue';
+  import DepartFormTab from './components/DepartFormTab.vue';
+  import DepartRuleTab from './components/DepartRuleTab.vue';
 
-const { prefixCls } = useDesign('depart-manage')
-provide('prefixCls', prefixCls)
+  const { prefixCls } = useDesign('depart-manage');
+  provide('prefixCls', prefixCls);
 
-// 给子组件定义一个ref变量
-const leftTree = ref()
+  // 给子组件定义一个ref变量
+  const leftTree = ref();
 
-// 当前选中的部门信息
-const departData = ref({})
-const rootTreeData = ref<any[]>([])
+  // 当前选中的部门信息
+  const departData = ref({});
+  const rootTreeData = ref<any[]>([]);
 
-// 左侧树选择后触发
-function onTreeSelect(data) {
-  departData.value = data
-}
+  // 左侧树选择后触发
+  function onTreeSelect(data) {
+    departData.value = data;
+  }
 
-// 左侧树rootTreeData触发
-function onRootTreeData(data) {
-  rootTreeData.value = data
-}
+  // 左侧树rootTreeData触发
+  function onRootTreeData(data) {
+    rootTreeData.value = data;
+  }
 
-function onSuccess() {
-  leftTree.value.loadRootTreeData()
-}
+  function onSuccess() {
+    leftTree.value.loadRootTreeData();
+  }
 </script>
 
 <style lang="less">
-@import "./index.less";
+  @import './index.less';
 </style>
diff --git a/src/views/system/departUser/components/DepartBaseInfoTab.vue b/src/views/system/departUser/components/DepartBaseInfoTab.vue
index ca792c5..911319f 100644
--- a/src/views/system/departUser/components/DepartBaseInfoTab.vue
+++ b/src/views/system/departUser/components/DepartBaseInfoTab.vue
@@ -1,36 +1,40 @@
 <template>
-  <Description @register="registerDesc"/>
+  <Description @register="registerDesc" />
 </template>
 
 <script lang="ts" setup>
-import { ref, inject, onMounted, watch } from 'vue'
-import { queryIdTree } from '../depart.user.api'
-import {useBaseInfoForm} from '../depart.user.data'
-import { Description, useDescription } from '/@/components/Description/index';
+  import { ref, inject, onMounted, watch } from 'vue';
+  import { queryIdTree } from '../depart.user.api';
+  import { useBaseInfoForm } from '../depart.user.data';
+  import { Description, useDescription } from '/@/components/Description/index';
 
-const prefixCls = inject('prefixCls')
-const props = defineProps({
-  data: {require: true, type: Object},
-})
-const treeData = ref([])
-const {descItems} = useBaseInfoForm(treeData)
+  const prefixCls = inject('prefixCls');
+  const props = defineProps({
+    data: { require: true, type: Object },
+  });
+  const treeData = ref([]);
+  const { descItems } = useBaseInfoForm(treeData);
 
-const [registerDesc, {setDescProps}] = useDescription({
-  data: props.data,
-  schema: descItems,
-  column: 1,
-  labelStyle: {
-    width: '180px'
+  const [registerDesc, { setDescProps }] = useDescription({
+    data: props.data,
+    schema: descItems,
+    column: 1,
+    labelStyle: {
+      width: '180px',
+    },
+  });
+
+  function setData(data) {
+    setDescProps({ data });
   }
-});
 
-function setData(data) {
-  setDescProps({data})
-}
-
-onMounted(() => {
-  watch(() => props.data, () => setData(props.data), {immediate: true})
-})
-// 动态查询 parentId 组件的 treeData
-queryIdTree().then(data => treeData.value = data)
+  onMounted(() => {
+    watch(
+      () => props.data,
+      () => setData(props.data),
+      { immediate: true }
+    );
+  });
+  // 动态查询 parentId 组件的 treeData
+  queryIdTree().then((data) => (treeData.value = data));
 </script>
diff --git a/src/views/system/departUser/components/DepartRoleAuthDrawer.vue b/src/views/system/departUser/components/DepartRoleAuthDrawer.vue
index adf08f3..14b24f2 100644
--- a/src/views/system/departUser/components/DepartRoleAuthDrawer.vue
+++ b/src/views/system/departUser/components/DepartRoleAuthDrawer.vue
@@ -1,36 +1,29 @@
 <template>
-  <BasicDrawer
-      title="部门角色权限配置"
-      :width="650"
-      :loading="loading"
-      showFooter
-      okText="保存并关闭"
-      @ok="onSubmit(true)"
-      @close="onClose"
-      @register="registerDrawer">
+  <BasicDrawer title="部门角色权限配置" :width="650" :loading="loading" showFooter okText="保存并关闭" @ok="onSubmit(true)" @close="onClose" @register="registerDrawer">
     <div>
       <a-spin :spinning="loading">
         <template v-if="treeData.length > 0">
           <BasicTree
-              title="所拥有的部门权限"
-              toolbar
-              checkable
-              :treeData="treeData"
-              :checkedKeys="checkedKeys"
-              :selectedKeys="selectedKeys"
-              :expandedKeys="expandedKeys"
-              :checkStrictly="checkStrictly"
-              :clickRowToExpand="false"
-              @check="onCheck"
-              @expand="onExpand"
-              @select="onSelect">
-            <template #title="{slotTitle, ruleFlag}">
+            title="所拥有的部门权限"
+            toolbar
+            checkable
+            :treeData="treeData"
+            :checkedKeys="checkedKeys"
+            :selectedKeys="selectedKeys"
+            :expandedKeys="expandedKeys"
+            :checkStrictly="checkStrictly"
+            :clickRowToExpand="false"
+            @check="onCheck"
+            @expand="onExpand"
+            @select="onSelect"
+          >
+            <template #title="{ slotTitle, ruleFlag }">
               <span>{{ slotTitle }}</span>
-              <Icon v-if="ruleFlag" icon="ant-design:align-left-outlined" style="margin-left:5px;color: red;"/>
+              <Icon v-if="ruleFlag" icon="ant-design:align-left-outlined" style="margin-left: 5px; color: red" />
             </template>
           </BasicTree>
         </template>
-        <a-empty v-else description="无可配置部门权限"/>
+        <a-empty v-else description="无可配置部门权限" />
       </a-spin>
     </div>
 
@@ -38,119 +31,119 @@
       <a-button type="primary" :loading="loading" ghost @click="onSubmit(false)">仅保存</a-button>
     </template>
   </BasicDrawer>
-  <DepartRoleDataRuleDrawer @register="registerDataRuleDrawer"/>
+  <DepartRoleDataRuleDrawer @register="registerDataRuleDrawer" />
 </template>
 
 <script lang="ts" setup>
-import { ref } from 'vue'
+  import { ref } from 'vue';
 
-import { BasicTree } from '/@/components/Tree/index'
-import { BasicDrawer, useDrawer, useDrawerInner } from '/@/components/Drawer'
-import { useMessage } from '/@/hooks/web/useMessage'
+  import { BasicTree } from '/@/components/Tree/index';
+  import { BasicDrawer, useDrawer, useDrawerInner } from '/@/components/Drawer';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
-import DepartRoleDataRuleDrawer from './DepartRoleDataRuleDrawer.vue'
-import { queryTreeListForDeptRole, queryDeptRolePermission, saveDeptRolePermission } from '../depart.user.api'
+  import DepartRoleDataRuleDrawer from './DepartRoleDataRuleDrawer.vue';
+  import { queryTreeListForDeptRole, queryDeptRolePermission, saveDeptRolePermission } from '../depart.user.api';
 
-defineEmits(['register'])
-const { createMessage } = useMessage()
-const loading = ref(false)
-const departId = ref('')
-const roleId = ref('')
-const treeData = ref<Array<any>>([])
-const checkedKeys = ref<Array<any>>([])
-const lastCheckedKeys = ref<Array<any>>([])
-const expandedKeys = ref<Array<any>>([])
-const selectedKeys = ref<Array<any>>([])
-const allTreeKeys = ref<Array<any>>([])
-const checkStrictly = ref(true)
+  defineEmits(['register']);
+  const { createMessage } = useMessage();
+  const loading = ref(false);
+  const departId = ref('');
+  const roleId = ref('');
+  const treeData = ref<Array<any>>([]);
+  const checkedKeys = ref<Array<any>>([]);
+  const lastCheckedKeys = ref<Array<any>>([]);
+  const expandedKeys = ref<Array<any>>([]);
+  const selectedKeys = ref<Array<any>>([]);
+  const allTreeKeys = ref<Array<any>>([]);
+  const checkStrictly = ref(true);
 
-// 注册抽屉组件
-const [registerDrawer, { closeDrawer }] = useDrawerInner((data) => {
-  roleId.value = data.record.id
-  departId.value = data.record.departId
-  loadData()
-})
-// 注册数据规则授权弹窗抽屉
-const [registerDataRuleDrawer, dataRuleDrawer] = useDrawer()
+  // 注册抽屉组件
+  const [registerDrawer, { closeDrawer }] = useDrawerInner((data) => {
+    roleId.value = data.record.id;
+    departId.value = data.record.departId;
+    loadData();
+  });
+  // 注册数据规则授权弹窗抽屉
+  const [registerDataRuleDrawer, dataRuleDrawer] = useDrawer();
 
-async function loadData() {
-  try {
-    loading.value = true
-    // 用户角色授权功能，查询菜单权限树
-    const { ids, treeList } = await queryTreeListForDeptRole({ departId: departId.value })
-    if (ids.length > 0) {
-      allTreeKeys.value = ids
-      expandedKeys.value = ids
-      treeData.value = treeList
-      // 查询角色授权
-      checkedKeys.value = await queryDeptRolePermission({ roleId: roleId.value })
-      lastCheckedKeys.value = [checkedKeys.value]
+  async function loadData() {
+    try {
+      loading.value = true;
+      // 用户角色授权功能，查询菜单权限树
+      const { ids, treeList } = await queryTreeListForDeptRole({ departId: departId.value });
+      if (ids.length > 0) {
+        allTreeKeys.value = ids;
+        expandedKeys.value = ids;
+        treeData.value = treeList;
+        // 查询角色授权
+        checkedKeys.value = await queryDeptRolePermission({ roleId: roleId.value });
+        lastCheckedKeys.value = [checkedKeys.value];
+      } else {
+        reset();
+      }
+    } finally {
+      loading.value = false;
+    }
+  }
+
+  // 重置页面
+  function reset() {
+    treeData.value = [];
+    expandedKeys.value = [];
+    checkedKeys.value = [];
+    lastCheckedKeys.value = [];
+    loading.value = false;
+  }
+
+  // tree勾选复选框事件
+  function onCheck(event) {
+    if (checkStrictly.value) {
+      checkedKeys.value = event.checked;
     } else {
-      reset()
-    }
-  } finally {
-    loading.value = false
-  }
-}
-
-// 重置页面
-function reset() {
-  treeData.value = []
-  expandedKeys.value = []
-  checkedKeys.value = []
-  lastCheckedKeys.value = []
-  loading.value = false
-}
-
-// tree勾选复选框事件
-function onCheck(event) {
-  if (checkStrictly.value) {
-    checkedKeys.value = event.checked
-  } else {
-    checkedKeys.value = event
-  }
-}
-
-// tree展开事件
-function onExpand($expandedKeys) {
-  expandedKeys.value = $expandedKeys
-}
-
-// tree选中事件
-function onSelect($selectedKeys, { selectedNodes }) {
-  if (selectedNodes[0]?.props?.ruleFlag) {
-    let functionId = $selectedKeys[0]
-    dataRuleDrawer.openDrawer(true, { roleId, departId, functionId })
-  }
-  selectedKeys.value = []
-}
-
-function doClose() {
-  reset()
-  closeDrawer()
-}
-
-function onClose() {
-  reset()
-}
-
-async function onSubmit(exit) {
-  try {
-    loading.value = true
-    let params = {
-      roleId: roleId.value,
-      permissionIds: checkedKeys.value.join(','),
-      lastpermissionIds: lastCheckedKeys.value.join(','),
-    }
-    await saveDeptRolePermission(params)
-    if (exit) {
-      doClose()
-    }
-  } finally {
-    loading.value = false
-    if (!exit) {
-      loadData()
+      checkedKeys.value = event;
     }
   }
-}
-</script>
\ No newline at end of file
+
+  // tree展开事件
+  function onExpand($expandedKeys) {
+    expandedKeys.value = $expandedKeys;
+  }
+
+  // tree选中事件
+  function onSelect($selectedKeys, { selectedNodes }) {
+    if (selectedNodes[0]?.props?.ruleFlag) {
+      let functionId = $selectedKeys[0];
+      dataRuleDrawer.openDrawer(true, { roleId, departId, functionId });
+    }
+    selectedKeys.value = [];
+  }
+
+  function doClose() {
+    reset();
+    closeDrawer();
+  }
+
+  function onClose() {
+    reset();
+  }
+
+  async function onSubmit(exit) {
+    try {
+      loading.value = true;
+      let params = {
+        roleId: roleId.value,
+        permissionIds: checkedKeys.value.join(','),
+        lastpermissionIds: lastCheckedKeys.value.join(','),
+      };
+      await saveDeptRolePermission(params);
+      if (exit) {
+        doClose();
+      }
+    } finally {
+      loading.value = false;
+      if (!exit) {
+        loadData();
+      }
+    }
+  }
+</script>
diff --git a/src/views/system/departUser/components/DepartRoleDataRuleDrawer.vue b/src/views/system/departUser/components/DepartRoleDataRuleDrawer.vue
index b0be5f4..04f2e45 100644
--- a/src/views/system/departUser/components/DepartRoleDataRuleDrawer.vue
+++ b/src/views/system/departUser/components/DepartRoleDataRuleDrawer.vue
@@ -1,32 +1,23 @@
 <template>
-  <BasicDrawer
-      title="数据规则/按钮权限配置"
-      :width="365"
-      @close="onClose"
-      @register="registerDrawer">
+  <BasicDrawer title="数据规则/按钮权限配置" :width="365" @close="onClose" @register="registerDrawer">
     <a-spin :spinning="loading">
       <a-tabs defaultActiveKey="1">
         <a-tab-pane tab="数据规则" key="1">
-          <a-checkbox-group v-model:value="dataRuleChecked" v-if="dataRuleList.length>0">
+          <a-checkbox-group v-model:value="dataRuleChecked" v-if="dataRuleList.length > 0">
             <a-row>
-              <a-col :span="24" v-for="(item,index) in dataRuleList" :key=" 'dr'+index ">
+              <a-col :span="24" v-for="(item, index) in dataRuleList" :key="'dr' + index">
                 <a-checkbox :value="item.id">{{ item.ruleName }}</a-checkbox>
               </a-col>
               <a-col :span="24">
-                <div style="width: 100%;margin-top: 15px">
-                  <a-button
-                      type="primary"
-                      :loading="loading"
-                      :size="'small'"
-                      preIcon="ant-design:save-filled"
-                      @click="saveDataRuleForRole">
+                <div style="width: 100%; margin-top: 15px">
+                  <a-button type="primary" :loading="loading" :size="'small'" preIcon="ant-design:save-filled" @click="saveDataRuleForRole">
                     <span>点击保存</span>
                   </a-button>
                 </div>
               </a-col>
             </a-row>
           </a-checkbox-group>
-          <a-empty v-else description="无配置信息"/>
+          <a-empty v-else description="无配置信息" />
         </a-tab-pane>
         <!--<a-tab-pane tab="按钮权限" key="2">敬请期待!!!</a-tab-pane>-->
       </a-tabs>
@@ -35,58 +26,57 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, unref } from 'vue'
-import { BasicDrawer, useDrawerInner } from '/@/components/Drawer'
+  import { ref, unref } from 'vue';
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
 
-import { queryDepartRoleDataRule, saveDepartRoleDataRule } from '../depart.user.api'
+  import { queryDepartRoleDataRule, saveDepartRoleDataRule } from '../depart.user.api';
 
-defineEmits(['register'])
-const loading = ref<boolean>(false)
-const departId = ref('')
-const functionId = ref('')
-const roleId = ref('')
-const dataRuleList = ref<Array<any>>([])
-const dataRuleChecked = ref<Array<any>>([])
+  defineEmits(['register']);
+  const loading = ref<boolean>(false);
+  const departId = ref('');
+  const functionId = ref('');
+  const roleId = ref('');
+  const dataRuleList = ref<Array<any>>([]);
+  const dataRuleChecked = ref<Array<any>>([]);
 
-// 注册抽屉组件
-const [registerDrawer, { closeDrawer }] = useDrawerInner((data) => {
-  roleId.value = unref(data.roleId)
-  departId.value = unref(data.departId)
-  functionId.value = unref(data.functionId)
-  loadData()
-})
+  // 注册抽屉组件
+  const [registerDrawer, { closeDrawer }] = useDrawerInner((data) => {
+    roleId.value = unref(data.roleId);
+    departId.value = unref(data.departId);
+    functionId.value = unref(data.functionId);
+    loadData();
+  });
 
-async function loadData() {
-  try {
-    loading.value = true
-    const { datarule, drChecked } = await queryDepartRoleDataRule(functionId, departId, roleId)
-    dataRuleList.value = datarule
-    if (drChecked) {
-      dataRuleChecked.value = drChecked.split(',')
+  async function loadData() {
+    try {
+      loading.value = true;
+      const { datarule, drChecked } = await queryDepartRoleDataRule(functionId, departId, roleId);
+      dataRuleList.value = datarule;
+      if (drChecked) {
+        dataRuleChecked.value = drChecked.split(',');
+      }
+    } finally {
+      loading.value = false;
     }
-  } finally {
-    loading.value = false
   }
-}
 
-function saveDataRuleForRole() {
-  let params = {
-    permissionId: functionId.value,
-    roleId: roleId.value,
-    dataRuleIds: dataRuleChecked.value.join(','),
+  function saveDataRuleForRole() {
+    let params = {
+      permissionId: functionId.value,
+      roleId: roleId.value,
+      dataRuleIds: dataRuleChecked.value.join(','),
+    };
+    saveDepartRoleDataRule(params);
   }
-  saveDepartRoleDataRule(params)
-}
 
-function onClose() {
-  doReset()
-}
+  function onClose() {
+    doReset();
+  }
 
-function doReset() {
-  functionId.value = ''
-  roleId.value = ''
-  dataRuleList.value = []
-  dataRuleChecked.value = []
-}
-
-</script>
\ No newline at end of file
+  function doReset() {
+    functionId.value = '';
+    roleId.value = '';
+    dataRuleList.value = [];
+    dataRuleChecked.value = [];
+  }
+</script>
diff --git a/src/views/system/departUser/components/DepartRoleInfoTab.vue b/src/views/system/departUser/components/DepartRoleInfoTab.vue
index e74e14a..7722534 100644
--- a/src/views/system/departUser/components/DepartRoleInfoTab.vue
+++ b/src/views/system/departUser/components/DepartRoleInfoTab.vue
@@ -5,199 +5,191 @@
     <template #tableTitle>
       <a-button type="primary" preIcon="ant-design:plus-outlined" @click="addDepartRole">添加部门角色</a-button>
       <template v-if="selectedRowKeys.length > 0">
-        <a-divider type="vertical"/>
+        <a-divider type="vertical" />
         <a-dropdown>
           <template #overlay>
             <a-menu>
               <a-menu-item key="1" @click="onDeleteDepartRoleBatch">
-                <icon icon="ant-design:delete-outlined"/>
+                <icon icon="ant-design:delete-outlined" />
                 <span>删除</span>
               </a-menu-item>
             </a-menu>
           </template>
           <a-button>
             <span>批量操作 </span>
-            <icon icon="akar-icons:chevron-down"/>
+            <icon icon="akar-icons:chevron-down" />
           </a-button>
         </a-dropdown>
       </template>
     </template>
     <!-- 插槽：行内操作按钮 -->
     <template #action="{ record }">
-      <TableAction
-          :actions="getTableAction(record)"
-          :dropDownActions="getDropDownAction(record)"
-      />
+      <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
     </template>
   </BasicTable>
   <!-- 添加部门弹窗 -->
-  <DepartRoleModal :departId="departId" @register="registerFormModal" @success="onFormModalSuccess"/>
-  <DepartRoleAuthDrawer @register="registerAuthDrawer"/>
+  <DepartRoleModal :departId="departId" @register="registerFormModal" @success="onFormModalSuccess" />
+  <DepartRoleAuthDrawer @register="registerAuthDrawer" />
 </template>
 
 <script lang="ts" setup>
-import { inject, ref, unref, watch, computed, onMounted } from 'vue'
+  import { inject, ref, unref, watch, computed, onMounted } from 'vue';
 
-import { ActionItem, BasicTable, TableAction } from '/@/components/Table'
-import { useModal } from '/@/components/Modal'
-import { useDrawer } from '/@/components/Drawer'
-import { useListPage } from '/@/hooks/system/useListPage'
+  import { ActionItem, BasicTable, TableAction } from '/@/components/Table';
+  import { useModal } from '/@/components/Modal';
+  import { useDrawer } from '/@/components/Drawer';
+  import { useListPage } from '/@/hooks/system/useListPage';
 
-import DepartRoleModal from './DepartRoleModal.vue'
-import DepartRoleAuthDrawer from './DepartRoleAuthDrawer.vue'
-import { deleteBatchDepartRole, departRoleList } from '../depart.user.api'
-import { departRoleColumns, departRoleSearchFormSchema } from '../depart.user.data'
-import { ColEx } from '/@/components/Form/src/types'
+  import DepartRoleModal from './DepartRoleModal.vue';
+  import DepartRoleAuthDrawer from './DepartRoleAuthDrawer.vue';
+  import { deleteBatchDepartRole, departRoleList } from '../depart.user.api';
+  import { departRoleColumns, departRoleSearchFormSchema } from '../depart.user.data';
+  import { ColEx } from '/@/components/Form/src/types';
 
-const prefixCls = inject('prefixCls')
-const props = defineProps({
-  data: { require: true, type: Object },
-})
-defineEmits(['register'])
-// 当前选中的部门ID，可能会为空，代表未选择部门
-const departId = computed(() => props.data?.id)
+  const prefixCls = inject('prefixCls');
+  const props = defineProps({
+    data: { require: true, type: Object },
+  });
+  defineEmits(['register']);
+  // 当前选中的部门ID，可能会为空，代表未选择部门
+  const departId = computed(() => props.data?.id);
 
-// 自适应列配置
-const adaptiveColProps: Partial<ColEx> = {
-  xs: 24, // <576px
-  sm: 24, // ≥576px
-  md: 24, // ≥768px
-  lg: 12, // ≥992px
-  xl: 12, // ≥1200px
-  xxl: 8, // ≥1600px
-}
-// 列表页面公共参数、方法
-const { tableContext, createMessage } = useListPage({
-  tableProps: {
-    api: departRoleList,
-    columns: departRoleColumns,
-    canResize: false,
-    formConfig: {
-      schemas: departRoleSearchFormSchema,
-      baseColProps: adaptiveColProps,
-      labelAlign:"left",
-      labelCol: {
-        xs: 24,
-        sm: 24,
-        md: 24,
-        lg: 9,
-        xl: 7,
-        xxl: 6,
+  // 自适应列配置
+  const adaptiveColProps: Partial<ColEx> = {
+    xs: 24, // <576px
+    sm: 24, // ≥576px
+    md: 24, // ≥768px
+    lg: 12, // ≥992px
+    xl: 12, // ≥1200px
+    xxl: 8, // ≥1600px
+  };
+  // 列表页面公共参数、方法
+  const { tableContext, createMessage } = useListPage({
+    tableProps: {
+      api: departRoleList,
+      columns: departRoleColumns,
+      canResize: false,
+      formConfig: {
+        schemas: departRoleSearchFormSchema,
+        baseColProps: adaptiveColProps,
+        labelAlign: 'left',
+        labelCol: {
+          xs: 24,
+          sm: 24,
+          md: 24,
+          lg: 9,
+          xl: 7,
+          xxl: 6,
+        },
+        wrapperCol: {},
+        // 操作按钮配置
+        actionColOptions: {
+          ...adaptiveColProps,
+          style: { textAlign: 'left' },
+        },
       },
-      wrapperCol: {},
-      // 操作按钮配置
-      actionColOptions: {
-        ...adaptiveColProps,
-        style: { textAlign: 'left' },
+      // 请求之前对参数做处理
+      beforeFetch(params) {
+        params.deptId = departId.value;
       },
     },
-    // 请求之前对参数做处理
-    beforeFetch(params) {
-      params.deptId = departId.value
-    },
-  },
-})
+  });
 
-// 注册 ListTable
-const [registerTable, {
-  reload,
-  setProps,
-  setLoading,
-  updateTableDataRecord,
-}, { rowSelection, selectedRowKeys }] = tableContext
+  // 注册 ListTable
+  const [registerTable, { reload, setProps, setLoading, updateTableDataRecord }, { rowSelection, selectedRowKeys }] = tableContext;
 
-// 注册Form弹窗
-const [registerFormModal, formModal] = useModal()
-// 注册授权弹窗抽屉
-const [registerAuthDrawer, authDrawer] = useDrawer()
+  // 注册Form弹窗
+  const [registerFormModal, formModal] = useModal();
+  // 注册授权弹窗抽屉
+  const [registerAuthDrawer, authDrawer] = useDrawer();
 
-// 监听 data 更改，重新加载数据
-watch(() => props.data, () => reload())
-onMounted(() => {
-  reload()
-})
+  // 监听 data 更改，重新加载数据
+  watch(
+    () => props.data,
+    () => reload()
+  );
+  onMounted(() => {
+    reload();
+  });
 
-// 清空选择的行
-function clearSelection() {
-  selectedRowKeys.value = []
-}
+  // 清空选择的行
+  function clearSelection() {
+    selectedRowKeys.value = [];
+  }
 
-// 添加部门角色
-function addDepartRole() {
-  formModal.openModal(true, {
-    isUpdate: false,
-    record: {},
-  })
-}
+  // 添加部门角色
+  function addDepartRole() {
+    formModal.openModal(true, {
+      isUpdate: false,
+      record: {},
+    });
+  }
 
-// 编辑部门角色
-function editDepartRole(record) {
-  formModal.openModal(true, {
-    isUpdate: true,
-    record: record,
-  })
-}
+  // 编辑部门角色
+  function editDepartRole(record) {
+    formModal.openModal(true, {
+      isUpdate: true,
+      record: record,
+    });
+  }
 
-// 授权部门角色
-function permissionDepartRole(record) {
-  authDrawer.openDrawer(true, { record })
-}
+  // 授权部门角色
+  function permissionDepartRole(record) {
+    authDrawer.openDrawer(true, { record });
+  }
 
-// 批量删除部门角色
-async function deleteDepartRole(idList, confirm) {
-  if (!departId.value) {
-    createMessage.warning('请先选择一个部门')
-  } else {
-    setLoading(true)
-    let ids = unref(idList).join(',')
-    try {
-      await deleteBatchDepartRole({ ids }, confirm)
-      return reload()
-    } finally {
-      setLoading(false)
+  // 批量删除部门角色
+  async function deleteDepartRole(idList, confirm) {
+    if (!departId.value) {
+      createMessage.warning('请先选择一个部门');
+    } else {
+      setLoading(true);
+      let ids = unref(idList).join(',');
+      try {
+        await deleteBatchDepartRole({ ids }, confirm);
+        return reload();
+      } finally {
+        setLoading(false);
+      }
     }
+    return Promise.reject();
   }
-  return Promise.reject()
-}
 
-// 批量删除部门角色事件
-async function onDeleteDepartRoleBatch() {
-  try {
-    await deleteDepartRole(selectedRowKeys, true)
-    // 批量删除成功后清空选择
-    clearSelection()
-  } catch (e) {
+  // 批量删除部门角色事件
+  async function onDeleteDepartRoleBatch() {
+    try {
+      await deleteDepartRole(selectedRowKeys, true);
+      // 批量删除成功后清空选择
+      clearSelection();
+    } catch (e) {}
   }
-}
 
-// 表单弹窗成功后的回调
-function onFormModalSuccess({ isUpdate, values }) {
-  isUpdate ? updateTableDataRecord(values.id, values) : reload()
-}
+  // 表单弹窗成功后的回调
+  function onFormModalSuccess({ isUpdate, values }) {
+    isUpdate ? updateTableDataRecord(values.id, values) : reload();
+  }
 
-/**
- * 操作栏
- */
-function getTableAction(record): ActionItem[] {
-  return [
-    { label: '编辑', onClick: editDepartRole.bind(null, record) },
-  ]
-}
+  /**
+   * 操作栏
+   */
+  function getTableAction(record): ActionItem[] {
+    return [{ label: '编辑', onClick: editDepartRole.bind(null, record) }];
+  }
 
-/**
- * 下拉操作栏
- */
-function getDropDownAction(record): ActionItem[] {
-  return [
-    { label: '授权', onClick: permissionDepartRole.bind(null, record) },
-    {
-      label: '删除',
-      color: 'error',
-      popConfirm: {
-        title: '确认要删除吗？',
-        confirm: deleteDepartRole.bind(null, [record.id], false),
+  /**
+   * 下拉操作栏
+   */
+  function getDropDownAction(record): ActionItem[] {
+    return [
+      { label: '授权', onClick: permissionDepartRole.bind(null, record) },
+      {
+        label: '删除',
+        color: 'error',
+        popConfirm: {
+          title: '确认要删除吗？',
+          confirm: deleteDepartRole.bind(null, [record.id], false),
+        },
       },
-    },
-  ]
-}
+    ];
+  }
 </script>
diff --git a/src/views/system/departUser/components/DepartRoleModal.vue b/src/views/system/departUser/components/DepartRoleModal.vue
index 0e07117..4eec504 100644
--- a/src/views/system/departUser/components/DepartRoleModal.vue
+++ b/src/views/system/departUser/components/DepartRoleModal.vue
@@ -1,68 +1,63 @@
 <template>
-  <BasicModal
-      :title="title"
-      :width="800"
-      v-bind="$attrs"
-      @ok="handleOk"
-      @register="registerModal">
-    <BasicForm @register="registerForm"/>
+  <BasicModal :title="title" :width="800" v-bind="$attrs" @ok="handleOk" @register="registerModal">
+    <BasicForm @register="registerForm" />
   </BasicModal>
 </template>
 
 <script lang="ts" setup>
-import { computed, inject, ref, unref } from 'vue'
+  import { computed, inject, ref, unref } from 'vue';
 
-import { BasicForm, useForm } from '/@/components/Form/index'
-// noinspection ES6UnusedImports
-import { BasicModal, useModalInner } from '/@/components/Modal'
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  // noinspection ES6UnusedImports
+  import { BasicModal, useModalInner } from '/@/components/Modal';
 
-import { saveOrUpdateDepartRole } from '../depart.user.api'
-import { departRoleModalFormSchema } from '../depart.user.data'
+  import { saveOrUpdateDepartRole } from '../depart.user.api';
+  import { departRoleModalFormSchema } from '../depart.user.data';
 
-const emit = defineEmits(['success', 'register'])
-const props = defineProps({
-  // 当前部门ID
-  departId: { require: true, type: String },
-})
-const prefixCls = inject('prefixCls')
-// 当前是否是更新模式
-const isUpdate = ref<boolean>(true)
-// 当前的弹窗数据
-const model = ref<object>({})
-const title = computed(() => isUpdate.value ? '编辑' : '新增')
+  const emit = defineEmits(['success', 'register']);
+  const props = defineProps({
+    // 当前部门ID
+    departId: { require: true, type: String },
+  });
+  const prefixCls = inject('prefixCls');
+  // 当前是否是更新模式
+  const isUpdate = ref<boolean>(true);
+  // 当前的弹窗数据
+  const model = ref<object>({});
+  const title = computed(() => (isUpdate.value ? '编辑' : '新增'));
 
-//注册表单
-const [registerForm, { resetFields, setFieldsValue, validate, updateSchema }] = useForm({
-  schemas: departRoleModalFormSchema,
-  showActionButtonGroup: false,
-})
+  //注册表单
+  const [registerForm, { resetFields, setFieldsValue, validate, updateSchema }] = useForm({
+    schemas: departRoleModalFormSchema,
+    showActionButtonGroup: false,
+  });
 
-// 注册弹窗
-const [registerModal, { setModalProps, closeModal }] = useModalInner(async data => {
-  await resetFields()
-  isUpdate.value = unref(data?.isUpdate)
-  // 无论新增还是编辑，都可以设置表单值
-  let record = unref(data?.record)
-  if (typeof record === 'object') {
-    model.value = record
-    await setFieldsValue({ ...record })
+  // 注册弹窗
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    await resetFields();
+    isUpdate.value = unref(data?.isUpdate);
+    // 无论新增还是编辑，都可以设置表单值
+    let record = unref(data?.record);
+    if (typeof record === 'object') {
+      model.value = record;
+      await setFieldsValue({ ...record });
+    }
+  });
+
+  //提交事件
+  async function handleOk() {
+    try {
+      setModalProps({ confirmLoading: true });
+      let values = await validate();
+      values.departId = unref(props.departId);
+      //提交表单
+      await saveOrUpdateDepartRole(values, isUpdate.value);
+      //关闭弹窗
+      closeModal();
+      //刷新列表
+      emit('success', { isUpdate: unref(isUpdate), values });
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
   }
-})
-
-//提交事件
-async function handleOk() {
-  try {
-    setModalProps({ confirmLoading: true })
-    let values = await validate()
-    values.departId = unref(props.departId)
-    //提交表单
-    await saveOrUpdateDepartRole(values, isUpdate.value)
-    //关闭弹窗
-    closeModal()
-    //刷新列表
-    emit('success', { isUpdate: unref(isUpdate), values })
-  } finally {
-    setModalProps({ confirmLoading: false })
-  }
-}
-</script>
\ No newline at end of file
+</script>
diff --git a/src/views/system/departUser/components/DepartRoleUserAuthDrawer.vue b/src/views/system/departUser/components/DepartRoleUserAuthDrawer.vue
index 2d0c975..78dbc1b 100644
--- a/src/views/system/departUser/components/DepartRoleUserAuthDrawer.vue
+++ b/src/views/system/departUser/components/DepartRoleUserAuthDrawer.vue
@@ -1,9 +1,5 @@
 <template>
-  <BasicDrawer
-      title="部门角色分配"
-      :width="365"
-      @close="onClose"
-      @register="registerDrawer">
+  <BasicDrawer title="部门角色分配" :width="365" @close="onClose" @register="registerDrawer">
     <a-spin :spinning="loading">
       <template v-if="desformList.length > 0">
         <a-checkbox-group v-model:value="designNameValue">
@@ -13,91 +9,83 @@
             </a-col>
           </a-row>
         </a-checkbox-group>
-        <div style="width: 100%;margin-top: 15px">
-          <a-button
-              type="primary"
-              :loading="loading"
-              :size="'small'"
-              preIcon="ant-design:save-filled"
-              @click="onSubmit">
+        <div style="width: 100%; margin-top: 15px">
+          <a-button type="primary" :loading="loading" :size="'small'" preIcon="ant-design:save-filled" @click="onSubmit">
             <span>点击保存</span>
           </a-button>
         </div>
       </template>
-      <a-empty v-else description="无配置信息"/>
+      <a-empty v-else description="无配置信息" />
     </a-spin>
   </BasicDrawer>
 </template>
 
 <script lang="ts" setup>
-import { ref, unref } from 'vue'
-import { BasicDrawer, useDrawerInner } from '/@/components/Drawer'
+  import { ref, unref } from 'vue';
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
 
-import { queryDepartRoleByUserId, queryDepartRoleUserList, saveDepartRoleUser } from '../depart.user.api'
+  import { queryDepartRoleByUserId, queryDepartRoleUserList, saveDepartRoleUser } from '../depart.user.api';
 
-defineEmits(['register'])
-const loading = ref<boolean>(false)
-const userId = ref('')
-const departId = ref('')
-const oldRoleId = ref('')
-const desformList = ref<Array<any>>([])
-const designNameValue = ref<Array<any>>([])
+  defineEmits(['register']);
+  const loading = ref<boolean>(false);
+  const userId = ref('');
+  const departId = ref('');
+  const oldRoleId = ref('');
+  const desformList = ref<Array<any>>([]);
+  const designNameValue = ref<Array<any>>([]);
 
-// 注册抽屉组件
-const [registerDrawer, { closeDrawer }] = useDrawerInner((data) => {
-  userId.value = unref(data.userId)
-  departId.value = unref(data.departId)
-  loadData()
-})
+  // 注册抽屉组件
+  const [registerDrawer, { closeDrawer }] = useDrawerInner((data) => {
+    userId.value = unref(data.userId);
+    departId.value = unref(data.departId);
+    loadData();
+  });
 
-async function loadData() {
-  try {
-    loading.value = true
-    const params = {
-      departId: departId.value,
-      userId: userId.value,
+  async function loadData() {
+    try {
+      loading.value = true;
+      const params = {
+        departId: departId.value,
+        userId: userId.value,
+      };
+      // 查询 DepartRole
+      const [$desformList, $departRoleList] = await Promise.all([queryDepartRoleUserList(params), queryDepartRoleByUserId(params)]);
+      desformList.value = $desformList;
+      designNameValue.value = $departRoleList.map((item) => item.droleId);
+      oldRoleId.value = designNameValue.value.join(',');
+    } finally {
+      loading.value = false;
     }
-    // 查询 DepartRole
-    const [$desformList, $departRoleList] = await Promise.all([
-      queryDepartRoleUserList(params),
-      queryDepartRoleByUserId(params),
-    ])
-    desformList.value = $desformList
-    designNameValue.value = $departRoleList.map(item => item.droleId)
-    oldRoleId.value = designNameValue.value.join(',')
-  } finally {
-    loading.value = false
   }
-}
 
-async function onSubmit() {
-  try {
-    loading.value = true
-    await saveDepartRoleUser({
-      userId: userId.value,
-      newRoleId: designNameValue.value.join(','),
-      oldRoleId: oldRoleId.value,
-    })
-    doClose()
-  } finally {
-    loading.value = false
+  async function onSubmit() {
+    try {
+      loading.value = true;
+      await saveDepartRoleUser({
+        userId: userId.value,
+        newRoleId: designNameValue.value.join(','),
+        oldRoleId: oldRoleId.value,
+      });
+      doClose();
+    } finally {
+      loading.value = false;
+    }
   }
-}
 
-function onClose() {
-  doReset()
-}
+  function onClose() {
+    doReset();
+  }
 
-function doClose() {
-  doReset()
-  closeDrawer()
-}
+  function doClose() {
+    doReset();
+    closeDrawer();
+  }
 
-function doReset() {
-  userId.value = ''
-  departId.value = ''
-  oldRoleId.value = ''
-  desformList.value = []
-  designNameValue.value = []
-}
-</script>
\ No newline at end of file
+  function doReset() {
+    userId.value = '';
+    departId.value = '';
+    oldRoleId.value = '';
+    desformList.value = [];
+    designNameValue.value = [];
+  }
+</script>
diff --git a/src/views/system/departUser/components/DepartTree.vue b/src/views/system/departUser/components/DepartTree.vue
index 17cf163..eb3f385 100644
--- a/src/views/system/departUser/components/DepartTree.vue
+++ b/src/views/system/departUser/components/DepartTree.vue
@@ -1,9 +1,9 @@
 <template>
   <div class="bg-white m-4 mr-0 overflow-hidden">
-  <a-spin :spinning="loading">
-    <template v-if="userIdentity === '2'">
-      <!--组织机构树-->
-      <BasicTree
+    <a-spin :spinning="loading">
+      <template v-if="userIdentity === '2'">
+        <!--组织机构树-->
+        <BasicTree
           v-if="!treeReloading"
           title="部门列表"
           toolbar
@@ -18,122 +18,126 @@
           @select="onSelect"
           @expand="onExpand"
           @search="onSearch"
-      />
-    </template>
-    <a-empty v-else description="普通员工无此权限"/>
-  </a-spin>
+        />
+      </template>
+      <a-empty v-else description="普通员工无此权限" />
+    </a-spin>
   </div>
 </template>
 
 <script lang="ts" setup>
-import { inject, nextTick, ref } from 'vue'
-import { useMessage } from '/@/hooks/web/useMessage'
-import { BasicTree } from '/@/components/Tree'
-import { queryMyDepartTreeList, searchByKeywords } from '../depart.user.api'
+  import { inject, nextTick, ref } from 'vue';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { BasicTree } from '/@/components/Tree';
+  import { queryMyDepartTreeList, searchByKeywords } from '../depart.user.api';
 
-const prefixCls = inject('prefixCls')
-const emit = defineEmits(['select'])
-const { createMessage } = useMessage()
+  const prefixCls = inject('prefixCls');
+  const emit = defineEmits(['select']);
+  const { createMessage } = useMessage();
 
-let loading = ref<boolean>(false)
-// 部门树列表数据
-let treeData = ref<any[]>([])
-// 当前展开的项
-let expandedKeys = ref<any[]>([])
-// 当前选中的项
-let selectedKeys = ref<any[]>([])
-// 是否自动展开父级
-let autoExpandParent = ref<boolean>(true)
-// 用户身份
-let userIdentity = ref<string>('2')
-// 树组件重新加载
-let treeReloading = ref<boolean>(false)
+  let loading = ref<boolean>(false);
+  // 部门树列表数据
+  let treeData = ref<any[]>([]);
+  // 当前展开的项
+  let expandedKeys = ref<any[]>([]);
+  // 当前选中的项
+  let selectedKeys = ref<any[]>([]);
+  // 是否自动展开父级
+  let autoExpandParent = ref<boolean>(true);
+  // 用户身份
+  let userIdentity = ref<string>('2');
+  // 树组件重新加载
+  let treeReloading = ref<boolean>(false);
 
-// 加载部门信息
-function loadDepartTreeData() {
-  loading.value = true
-  treeData.value = []
-  queryMyDepartTreeList().then(res => {
-    if (res.success) {
-      if (Array.isArray(res.result)) {
-        treeData.value = res.result
-        userIdentity.value = res.message
-        autoExpandParentNode()
+  // 加载部门信息
+  function loadDepartTreeData() {
+    loading.value = true;
+    treeData.value = [];
+    queryMyDepartTreeList()
+      .then((res) => {
+        if (res.success) {
+          if (Array.isArray(res.result)) {
+            treeData.value = res.result;
+            userIdentity.value = res.message;
+            autoExpandParentNode();
+          }
+        } else {
+          createMessage.warning(res.message);
+        }
+      })
+      .finally(() => (loading.value = false));
+  }
+
+  loadDepartTreeData();
+
+  // 自动展开父节点，只展开一级
+  function autoExpandParentNode() {
+    let keys: Array<any> = [];
+    treeData.value.forEach((item, index) => {
+      if (item.children && item.children.length > 0) {
+        keys.push(item.key);
       }
+      if (index === 0) {
+        // 默认选中第一个
+        setSelectedKey(item.id, item);
+      }
+    });
+    if (keys.length > 0) {
+      reloadTree();
+      expandedKeys.value = keys;
+    }
+  }
+
+  // 重新加载树组件，防止无法默认展开数据
+  async function reloadTree() {
+    await nextTick();
+    treeReloading.value = true;
+    await nextTick();
+    treeReloading.value = false;
+  }
+
+  /**
+   * 设置当前选中的行
+   */
+  function setSelectedKey(key: string, data?: object) {
+    selectedKeys.value = [key];
+    if (data) {
+      emit('select', data);
+    }
+  }
+
+  // 搜索事件
+  function onSearch(value: string) {
+    if (value) {
+      loading.value = true;
+      searchByKeywords({ keyWord: value, myDeptSearch: '1' })
+        .then((result) => {
+          if (Array.isArray(result)) {
+            treeData.value = result;
+          } else {
+            createMessage.warning('未查询到部门信息');
+            treeData.value = [];
+          }
+        })
+        .finally(() => (loading.value = false));
     } else {
-      createMessage.warning(res.message)
+      loadDepartTreeData();
     }
-  }).finally(() => loading.value = false)
-}
+  }
 
-loadDepartTreeData()
-
-// 自动展开父节点，只展开一级
-function autoExpandParentNode() {
-  let keys: Array<any> = []
-  treeData.value.forEach((item, index) => {
-    if (item.children && item.children.length > 0) {
-      keys.push(item.key)
+  // 树选择事件
+  function onSelect(selKeys, event) {
+    if (selKeys.length > 0 && selectedKeys.value[0] !== selKeys[0]) {
+      setSelectedKey(selKeys[0], event.selectedNodes[0].props);
+    } else {
+      // 这样可以防止用户取消选择
+      setSelectedKey(selectedKeys.value[0]);
     }
-    if (index === 0) {
-      // 默认选中第一个
-      setSelectedKey(item.id, item)
-    }
-  })
-  if (keys.length > 0) {
-    reloadTree()
-    expandedKeys.value = keys
   }
-}
 
-// 重新加载树组件，防止无法默认展开数据
-async function reloadTree() {
-  await nextTick()
-  treeReloading.value = true
-  await nextTick()
-  treeReloading.value = false
-}
-
-/**
- * 设置当前选中的行
- */
-function setSelectedKey(key: string, data?: object) {
-  selectedKeys.value = [key]
-  if (data) {
-    emit('select', data)
+  // 树展开事件
+  function onExpand(keys) {
+    expandedKeys.value = keys;
+    autoExpandParent.value = false;
   }
-}
-
-// 搜索事件
-function onSearch(value: string) {
-  if (value) {
-    loading.value = true
-    searchByKeywords({ keyWord: value, myDeptSearch: '1' }).then(result => {
-      if (Array.isArray(result)) {
-        treeData.value = result
-      } else {
-        createMessage.warning('未查询到部门信息')
-        treeData.value = []
-      }
-    }).finally(() => loading.value = false)
-  } else {
-    loadDepartTreeData()
-  }
-}
-
-// 树选择事件
-function onSelect(selKeys, event) {
-  if (selKeys.length > 0 && selectedKeys.value[0] !== selKeys[0]) {
-    setSelectedKey(selKeys[0], event.selectedNodes[0].props)
-  } else {
-    // 这样可以防止用户取消选择
-    setSelectedKey(selectedKeys.value[0])
-  }
-}
-
-// 树展开事件
-function onExpand(keys) {
-  expandedKeys.value = keys
-  autoExpandParent.value = false
-}
 </script>
diff --git a/src/views/system/departUser/components/DepartUserInfoTab.vue b/src/views/system/departUser/components/DepartUserInfoTab.vue
index c6a60cb..a941e8a 100644
--- a/src/views/system/departUser/components/DepartUserInfoTab.vue
+++ b/src/views/system/departUser/components/DepartUserInfoTab.vue
@@ -10,228 +10,220 @@
           <template #overlay>
             <a-menu>
               <a-menu-item key="1" @click="onUnlinkDepartUserBatch">
-                <icon icon="bx:bx-unlink"/>
+                <icon icon="bx:bx-unlink" />
                 <span>取消关联</span>
               </a-menu-item>
             </a-menu>
           </template>
           <a-button>
             <span>批量操作 </span>
-            <icon icon="akar-icons:chevron-down"/>
+            <icon icon="akar-icons:chevron-down" />
           </a-button>
         </a-dropdown>
       </template>
     </template>
     <!-- 插槽：行内操作按钮 -->
     <template #action="{ record }">
-      <TableAction
-          :actions="getTableAction(record)"
-          :dropDownActions="getDropDownAction(record)"
-      />
+      <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
     </template>
   </BasicTable>
-  <UserDrawer @register="registerDrawer" @success="onUserDrawerSuccess"/>
-  <DepartRoleUserAuthDrawer @register="registerUserAuthDrawer"/>
-  <UserSelectModal rowKey="id" @register="registerSelUserModal" @getSelectResult="onSelectUserOk"/>
+  <UserDrawer @register="registerDrawer" @success="onUserDrawerSuccess" />
+  <DepartRoleUserAuthDrawer @register="registerUserAuthDrawer" />
+  <UserSelectModal rowKey="id" @register="registerSelUserModal" @getSelectResult="onSelectUserOk" />
 </template>
 
 <script lang="ts" setup>
-import { computed, inject, ref, unref, watch } from 'vue'
-import { ActionItem, BasicTable, TableAction } from '/@/components/Table'
-import { useModal } from '/@/components/Modal'
-import { useDrawer } from '/@/components/Drawer'
-import { useListPage } from '/@/hooks/system/useListPage'
+  import { computed, inject, ref, unref, watch } from 'vue';
+  import { ActionItem, BasicTable, TableAction } from '/@/components/Table';
+  import { useModal } from '/@/components/Modal';
+  import { useDrawer } from '/@/components/Drawer';
+  import { useListPage } from '/@/hooks/system/useListPage';
 
-import UserDrawer from '/@/views/system/user/UserDrawer.vue'
-import UserSelectModal from '/@/components/Form/src/jeecg/components/modal/UserSelectModal.vue'
-import DepartRoleUserAuthDrawer from './DepartRoleUserAuthDrawer.vue'
-import { departUserList, linkDepartUserBatch, unlinkDepartUserBatch } from '../depart.user.api'
-import { userInfoColumns, userInfoSearchFormSchema } from '../depart.user.data'
-import { ColEx } from '/@/components/Form/src/types'
+  import UserDrawer from '/@/views/system/user/UserDrawer.vue';
+  import UserSelectModal from '/@/components/Form/src/jeecg/components/modal/UserSelectModal.vue';
+  import DepartRoleUserAuthDrawer from './DepartRoleUserAuthDrawer.vue';
+  import { departUserList, linkDepartUserBatch, unlinkDepartUserBatch } from '../depart.user.api';
+  import { userInfoColumns, userInfoSearchFormSchema } from '../depart.user.data';
+  import { ColEx } from '/@/components/Form/src/types';
 
-const prefixCls = inject('prefixCls')
-const props = defineProps({
-  data: { require: true, type: Object },
-})
-// 当前选中的部门ID，可能会为空，代表未选择部门
-const departId = computed(() => props.data?.id)
+  const prefixCls = inject('prefixCls');
+  const props = defineProps({
+    data: { require: true, type: Object },
+  });
+  // 当前选中的部门ID，可能会为空，代表未选择部门
+  const departId = computed(() => props.data?.id);
 
-// 自适应列配置
-const adaptiveColProps: Partial<ColEx> = {
-  xs: 24, // <576px
-  sm: 24, // ≥576px
-  md: 24, // ≥768px
-  lg: 12, // ≥992px
-  xl: 12, // ≥1200px
-  xxl: 8, // ≥1600px
-}
-// 列表页面公共参数、方法
-const { tableContext, createMessage } = useListPage({
-  tableProps: {
-    api: departUserList,
-    columns: userInfoColumns,
-    canResize: false,
-    formConfig: {
-      schemas: userInfoSearchFormSchema,
-      baseColProps: adaptiveColProps,
-      labelAlign:"left",
-      labelCol: {
-        xs: 24,
-        sm: 24,
-        md: 24,
-        lg: 9,
-        xl: 7,
-        xxl: 5,
+  // 自适应列配置
+  const adaptiveColProps: Partial<ColEx> = {
+    xs: 24, // <576px
+    sm: 24, // ≥576px
+    md: 24, // ≥768px
+    lg: 12, // ≥992px
+    xl: 12, // ≥1200px
+    xxl: 8, // ≥1600px
+  };
+  // 列表页面公共参数、方法
+  const { tableContext, createMessage } = useListPage({
+    tableProps: {
+      api: departUserList,
+      columns: userInfoColumns,
+      canResize: false,
+      formConfig: {
+        schemas: userInfoSearchFormSchema,
+        baseColProps: adaptiveColProps,
+        labelAlign: 'left',
+        labelCol: {
+          xs: 24,
+          sm: 24,
+          md: 24,
+          lg: 9,
+          xl: 7,
+          xxl: 5,
+        },
+        wrapperCol: {},
+        // 操作按钮配置
+        actionColOptions: {
+          ...adaptiveColProps,
+          style: { textAlign: 'left' },
+        },
       },
-      wrapperCol: {},
-      // 操作按钮配置
-      actionColOptions: {
-        ...adaptiveColProps,
-        style: { textAlign: 'left' },
+      // 请求之前对参数做处理
+      beforeFetch(params) {
+        params.depId = departId.value;
       },
     },
-    // 请求之前对参数做处理
-    beforeFetch(params) {
-      params.depId = departId.value
-    },
-  },
-})
+  });
 
-// 注册 ListTable
-const [registerTable, {
-  reload,
-  setProps,
-  setLoading,
-  updateTableDataRecord,
-}, { rowSelection, selectedRowKeys }] = tableContext
+  // 注册 ListTable
+  const [registerTable, { reload, setProps, setLoading, updateTableDataRecord }, { rowSelection, selectedRowKeys }] = tableContext;
 
-watch(() => props.data, () => reload())
-//注册drawer
-const [registerDrawer, { openDrawer, setDrawerProps }] = useDrawer()
-const [registerUserAuthDrawer, userAuthDrawer] = useDrawer()
-// 注册用户选择 modal
-const [registerSelUserModal, selUserModal] = useModal()
+  watch(
+    () => props.data,
+    () => reload()
+  );
+  //注册drawer
+  const [registerDrawer, { openDrawer, setDrawerProps }] = useDrawer();
+  const [registerUserAuthDrawer, userAuthDrawer] = useDrawer();
+  // 注册用户选择 modal
+  const [registerSelUserModal, selUserModal] = useModal();
 
-// 清空选择的行
-function clearSelection() {
-  selectedRowKeys.value = []
-}
+  // 清空选择的行
+  function clearSelection() {
+    selectedRowKeys.value = [];
+  }
 
-// 查看部门角色
-function showDepartRole(record) {
-  userAuthDrawer.openDrawer(true, { userId: record.id, departId })
-}
+  // 查看部门角色
+  function showDepartRole(record) {
+    userAuthDrawer.openDrawer(true, { userId: record.id, departId });
+  }
 
-// 创建用户
-function createUser() {
-  if (!departId.value) {
-    createMessage.warning('请先选择一个部门')
-  } else {
+  // 创建用户
+  function createUser() {
+    if (!departId.value) {
+      createMessage.warning('请先选择一个部门');
+    } else {
+      openDrawer(true, {
+        isUpdate: false,
+        departDisabled: true,
+        // 初始化负责部门
+        nextDepartOptions: { value: props.data?.key, label: props.data?.title },
+        record: {
+          activitiSync: 1,
+          userIdentity: 1,
+          selecteddeparts: departId.value,
+        },
+      });
+    }
+  }
+
+  // 查看用户详情
+  function showUserDetail(record) {
     openDrawer(true, {
-      isUpdate: false,
+      record,
+      isUpdate: true,
       departDisabled: true,
-      // 初始化负责部门
-      nextDepartOptions: { value: props.data?.key, label: props.data?.title },
-      record: {
-        activitiSync: 1,
-        userIdentity: 1,
-        selecteddeparts: departId.value,
-      },
-    })
+      showFooter: false,
+    });
   }
-}
 
-// 查看用户详情
-function showUserDetail(record) {
-  openDrawer(true, {
-    record,
-    isUpdate: true,
-    departDisabled: true,
-    showFooter: false,
-  })
-}
+  // 编辑用户信息
+  function editUserInfo(record) {
+    openDrawer(true, { isUpdate: true, record, departDisabled: true });
+  }
 
-// 编辑用户信息
-function editUserInfo(record) {
-  openDrawer(true, { isUpdate: true, record, departDisabled: true })
-}
+  // 选择添加已有用户
+  function selectAddUser() {
+    selUserModal.openModal();
+  }
 
-// 选择添加已有用户
-function selectAddUser() {
-  selUserModal.openModal()
-}
+  // 批量取消关联部门和用户之间的关系
+  async function unlinkDepartUser(idList, confirm) {
+    if (!departId.value) {
+      createMessage.warning('请先选择一个部门');
+    } else {
+      setLoading(true);
+      let userIds = unref(idList).join(',');
+      try {
+        await unlinkDepartUserBatch({ depId: departId.value, userIds }, confirm);
+        return reload();
+      } finally {
+        setLoading(false);
+      }
+    }
+    return Promise.reject();
+  }
 
-// 批量取消关联部门和用户之间的关系
-async function unlinkDepartUser(idList, confirm) {
-  if (!departId.value) {
-    createMessage.warning('请先选择一个部门')
-  } else {
-    setLoading(true)
-    let userIds = unref(idList).join(',')
+  // 批量取消关联事件
+  async function onUnlinkDepartUserBatch() {
     try {
-      await unlinkDepartUserBatch({ depId: departId.value, userIds }, confirm)
-      return reload()
-    } finally {
-      setLoading(false)
+      await unlinkDepartUser(selectedRowKeys, true);
+      // 批量删除成功后清空选择
+      clearSelection();
+    } catch (e) {}
+  }
+
+  // 选择用户成功
+  async function onSelectUserOk(options, userIdList) {
+    if (userIdList.length > 0) {
+      try {
+        setLoading(true);
+        await linkDepartUserBatch(departId.value, userIdList);
+        reload();
+      } finally {
+        setLoading(false);
+      }
     }
   }
-  return Promise.reject()
-}
 
-// 批量取消关联事件
-async function onUnlinkDepartUserBatch() {
-  try {
-    await unlinkDepartUser(selectedRowKeys, true)
-    // 批量删除成功后清空选择
-    clearSelection()
-  } catch (e) {
+  /**
+   * 用户抽屉表单成功回调
+   */
+  function onUserDrawerSuccess({ isUpdate, values }) {
+    isUpdate ? updateTableDataRecord(values.id, values) : reload();
   }
-}
 
-// 选择用户成功
-async function onSelectUserOk(options, userIdList) {
-  if (userIdList.length > 0) {
-    try {
-      setLoading(true)
-      await linkDepartUserBatch(departId.value, userIdList)
-      reload()
-    } finally {
-      setLoading(false)
-    }
+  /**
+   * 操作栏
+   */
+  function getTableAction(record): ActionItem[] {
+    return [{ label: '编辑', onClick: editUserInfo.bind(null, record) }];
   }
-}
 
-/**
- * 用户抽屉表单成功回调
- */
-function onUserDrawerSuccess({ isUpdate, values }) {
-  isUpdate ? updateTableDataRecord(values.id, values) : reload()
-}
-
-/**
- * 操作栏
- */
-function getTableAction(record): ActionItem[] {
-  return [
-    { label: '编辑', onClick: editUserInfo.bind(null, record) },
-  ]
-}
-
-/**
- * 下拉操作栏
- */
-function getDropDownAction(record): ActionItem[] {
-  return [
-    { label: '部门角色', onClick: showDepartRole.bind(null, record) },
-    { label: '用户详情', onClick: showUserDetail.bind(null, record) },
-    {
-      label: '取消关联',
-      color: 'error',
-      popConfirm: {
-        title: '确认取消关联吗？',
-        confirm: unlinkDepartUser.bind(null, [record.id], false),
+  /**
+   * 下拉操作栏
+   */
+  function getDropDownAction(record): ActionItem[] {
+    return [
+      { label: '部门角色', onClick: showDepartRole.bind(null, record) },
+      { label: '用户详情', onClick: showUserDetail.bind(null, record) },
+      {
+        label: '取消关联',
+        color: 'error',
+        popConfirm: {
+          title: '确认取消关联吗？',
+          confirm: unlinkDepartUser.bind(null, [record.id], false),
+        },
       },
-    },
-  ]
-}
+    ];
+  }
 </script>
diff --git a/src/views/system/departUser/depart.user.api.ts b/src/views/system/departUser/depart.user.api.ts
index aef9377..bf9adc1 100644
--- a/src/views/system/departUser/depart.user.api.ts
+++ b/src/views/system/departUser/depart.user.api.ts
@@ -1,8 +1,8 @@
-import { unref } from 'vue'
-import { defHttp } from '/@/utils/http/axios'
-import { useMessage } from '/@/hooks/web/useMessage'
+import { unref } from 'vue';
+import { defHttp } from '/@/utils/http/axios';
+import { useMessage } from '/@/hooks/web/useMessage';
 
-const { createConfirm } = useMessage()
+const { createConfirm } = useMessage();
 
 enum Api {
   treeList = '/sys/sysDepart/queryMyDeptTreeList',
@@ -35,23 +35,22 @@ enum DepartRoleApi {
 /**
  * 获取部门树列表
  */
-export const queryMyDepartTreeList = (params?) =>
-  defHttp.get({ url: Api.treeList, params }, { isTransformResponse: false })
+export const queryMyDepartTreeList = (params?) => defHttp.get({ url: Api.treeList, params }, { isTransformResponse: false });
 
 /**
  * 查询数据，以树结构形式加载所有部门的名称
  */
-export const queryIdTree = (params?) => defHttp.get({ url: Api.queryIdTree, params })
+export const queryIdTree = (params?) => defHttp.get({ url: Api.queryIdTree, params });
 
 /**
  * 根据关键字搜索部门
  */
-export const searchByKeywords = (params) => defHttp.get({ url: Api.searchBy, params })
+export const searchByKeywords = (params) => defHttp.get({ url: Api.searchBy, params });
 
 /**
  * 查询部门下的用户信息
  */
-export const departUserList = (params) => defHttp.get({ url: DepartUserApi.list, params })
+export const departUserList = (params) => defHttp.get({ url: DepartUserApi.list, params });
 
 /**
  * 批量添加部门和用户的关联关系
@@ -59,8 +58,7 @@ export const departUserList = (params) => defHttp.get({ url: DepartUserApi.list,
  * @param departId 部门ID
  * @param userIdList 用户ID列表
  */
-export const linkDepartUserBatch = (departId: string, userIdList: string[]) =>
-  defHttp.post({ url: DepartUserApi.link, params: { depId: departId, userIdList } })
+export const linkDepartUserBatch = (departId: string, userIdList: string[]) => defHttp.post({ url: DepartUserApi.link, params: { depId: departId, userIdList } });
 
 /**
  * 批量取消部门和用户的关联关系
@@ -68,8 +66,8 @@ export const linkDepartUserBatch = (departId: string, userIdList: string[]) =>
 export const unlinkDepartUserBatch = (params, confirm = false) => {
   return new Promise((resolve, reject) => {
     const doDelete = () => {
-      resolve(defHttp.delete({ url: DepartUserApi.unlink, params }, { joinParamsToUrl: true }))
-    }
+      resolve(defHttp.delete({ url: DepartUserApi.unlink, params }, { joinParamsToUrl: true }));
+    };
     if (confirm) {
       createConfirm({
         iconType: 'warning',
@@ -77,28 +75,28 @@ export const unlinkDepartUserBatch = (params, confirm = false) => {
         content: '确定要取消关联吗？',
         onOk: () => doDelete(),
         onCancel: () => reject(),
-      })
+      });
     } else {
-      doDelete()
+      doDelete();
     }
-  })
-}
+  });
+};
 
 /**
  * 查询部门角色信息
  */
-export const departRoleList = (params) => defHttp.get({ url: DepartRoleApi.list, params })
+export const departRoleList = (params) => defHttp.get({ url: DepartRoleApi.list, params });
 
 /**
  * 保存或者更新部门角色
  */
 export const saveOrUpdateDepartRole = (params, isUpdate) => {
   if (isUpdate) {
-    return defHttp.put({ url: DepartRoleApi.edit, params })
+    return defHttp.put({ url: DepartRoleApi.edit, params });
   } else {
-    return defHttp.post({ url: DepartRoleApi.save, params })
+    return defHttp.post({ url: DepartRoleApi.save, params });
   }
-}
+};
 
 /**
  * 批量删除部门角色
@@ -106,8 +104,8 @@ export const saveOrUpdateDepartRole = (params, isUpdate) => {
 export const deleteBatchDepartRole = (params, confirm = false) => {
   return new Promise((resolve, reject) => {
     const doDelete = () => {
-      resolve(defHttp.delete({ url: DepartRoleApi.deleteBatch, params }, { joinParamsToUrl: true }))
-    }
+      resolve(defHttp.delete({ url: DepartRoleApi.deleteBatch, params }, { joinParamsToUrl: true }));
+    };
     if (confirm) {
       createConfirm({
         iconType: 'warning',
@@ -115,46 +113,46 @@ export const deleteBatchDepartRole = (params, confirm = false) => {
         content: '确定要删除吗？',
         onOk: () => doDelete(),
         onCancel: () => reject(),
-      })
+      });
     } else {
-      doDelete()
+      doDelete();
     }
-  })
-}
+  });
+};
 
 /**
  * 用户角色授权功能，查询菜单权限树
  */
-export const queryTreeListForDeptRole = (params) => defHttp.get({ url: DepartRoleApi.queryTreeListForDeptRole, params })
+export const queryTreeListForDeptRole = (params) => defHttp.get({ url: DepartRoleApi.queryTreeListForDeptRole, params });
 /**
  * 查询角色授权
  */
-export const queryDeptRolePermission = (params) => defHttp.get({ url: DepartRoleApi.queryDeptRolePermission, params })
+export const queryDeptRolePermission = (params) => defHttp.get({ url: DepartRoleApi.queryDeptRolePermission, params });
 /**
  * 保存角色授权
  */
-export const saveDeptRolePermission = (params) => defHttp.post({ url: DepartRoleApi.saveDeptRolePermission, params })
+export const saveDeptRolePermission = (params) => defHttp.post({ url: DepartRoleApi.saveDeptRolePermission, params });
 
 /**
  *  查询部门角色数据权限列表
  */
 export const queryDepartRoleDataRule = (functionId, departId, roleId, params?) => {
-  let url = `${DepartRoleApi.dataRule}/${unref(functionId)}/${unref(departId)}/${unref(roleId)}`
-  return defHttp.get({ url, params })
-}
+  let url = `${DepartRoleApi.dataRule}/${unref(functionId)}/${unref(departId)}/${unref(roleId)}`;
+  return defHttp.get({ url, params });
+};
 /**
  * 保存部门角色数据权限
  */
-export const saveDepartRoleDataRule = (params) => defHttp.post({ url: DepartRoleApi.dataRule, params })
+export const saveDepartRoleDataRule = (params) => defHttp.post({ url: DepartRoleApi.dataRule, params });
 /**
  * 查询部门角色用户授权
  */
-export const queryDepartRoleUserList = (params) => defHttp.get({ url: DepartRoleApi.getDeptRoleList, params })
+export const queryDepartRoleUserList = (params) => defHttp.get({ url: DepartRoleApi.getDeptRoleList, params });
 /**
  * 根据 userId 查询部门角色用户授权
  */
-export const queryDepartRoleByUserId = (params) => defHttp.get({ url: DepartRoleApi.getDeptRoleByUserId, params })
+export const queryDepartRoleByUserId = (params) => defHttp.get({ url: DepartRoleApi.getDeptRoleByUserId, params });
 /**
  * 保存部门角色用户授权
  */
-export const saveDepartRoleUser = (params) => defHttp.post({ url: DepartRoleApi.saveDeptRoleUser, params })
+export const saveDepartRoleUser = (params) => defHttp.post({ url: DepartRoleApi.saveDeptRoleUser, params });
diff --git a/src/views/system/departUser/depart.user.data.ts b/src/views/system/departUser/depart.user.data.ts
index ff07137..6eaa191 100644
--- a/src/views/system/departUser/depart.user.data.ts
+++ b/src/views/system/departUser/depart.user.data.ts
@@ -1,8 +1,8 @@
-import { Ref } from 'vue'
-import { duplicateCheck } from '/@/views/system/user/user.api'
-import { BasicColumn, FormSchema } from '/@/components/Table'
-import {DescItem} from "/@/components/Description";
-import {findTree} from "/@/utils/common/compUtils";
+import { Ref } from 'vue';
+import { duplicateCheck } from '/@/views/system/user/user.api';
+import { BasicColumn, FormSchema } from '/@/components/Table';
+import { DescItem } from '/@/components/Description';
+import { findTree } from '/@/utils/common/compUtils';
 
 // 用户信息 columns
 export const userInfoColumns: BasicColumn[] = [
@@ -19,7 +19,7 @@ export const userInfoColumns: BasicColumn[] = [
   {
     title: '部门',
     dataIndex: 'orgCode',
-     width: 200,
+    width: 200,
   },
   {
     title: '性别',
@@ -31,7 +31,7 @@ export const userInfoColumns: BasicColumn[] = [
     dataIndex: 'phone',
     width: 120,
   },
-]
+];
 
 // 用户信息查询条件表单
 export const userInfoSearchFormSchema: FormSchema[] = [
@@ -40,7 +40,7 @@ export const userInfoSearchFormSchema: FormSchema[] = [
     label: '用户账号',
     component: 'Input',
   },
-]
+];
 
 // 部门角色 columns
 export const departRoleColumns: BasicColumn[] = [
@@ -64,7 +64,7 @@ export const departRoleColumns: BasicColumn[] = [
     dataIndex: 'description',
     width: 100,
   },
-]
+];
 
 // 部门角色查询条件表单
 export const departRoleSearchFormSchema: FormSchema[] = [
@@ -73,7 +73,7 @@ export const departRoleSearchFormSchema: FormSchema[] = [
     label: '部门角色名称',
     component: 'Input',
   },
-]
+];
 
 // 部门角色弹窗form表单
 export const departRoleModalFormSchema: FormSchema[] = [
@@ -96,7 +96,7 @@ export const departRoleModalFormSchema: FormSchema[] = [
     field: 'roleCode',
     label: '部门角色编码',
     component: 'Input',
-    dynamicDisabled: ({values}) => {
+    dynamicDisabled: ({ values }) => {
       return !!values.id;
     },
     dynamicRules: ({ model }) => {
@@ -106,7 +106,7 @@ export const departRoleModalFormSchema: FormSchema[] = [
         {
           validator: (_, value) => {
             if (/[\u4E00-\u9FA5]/g.test(value)) {
-              return Promise.reject('部门角色编码不可输入汉字！')
+              return Promise.reject('部门角色编码不可输入汉字！');
             }
             return new Promise((resolve, reject) => {
               let params = {
@@ -114,27 +114,27 @@ export const departRoleModalFormSchema: FormSchema[] = [
                 fieldName: 'role_code',
                 fieldVal: value,
                 dataId: model.id,
-              }
-              duplicateCheck(params).then((res) => {
-                res.success ? resolve() : reject(res.message || '校验失败')
-              }).catch((err) => {
-                reject(err.message || '验证失败')
-              })
-            })
+              };
+              duplicateCheck(params)
+                .then((res) => {
+                  res.success ? resolve() : reject(res.message || '校验失败');
+                })
+                .catch((err) => {
+                  reject(err.message || '验证失败');
+                });
+            });
           },
         },
-      ]
+      ];
     },
   },
   {
     field: 'description',
     label: '描述',
     component: 'Input',
-    rules: [
-      { min: 0, max: 126, message: '长度不能超过 126 个字符', trigger: 'blur' },
-    ],
+    rules: [{ min: 0, max: 126, message: '长度不能超过 126 个字符', trigger: 'blur' }],
   },
-]
+];
 
 // 基本信息form
 export function useBaseInfoForm(treeData: Ref<any[]>) {
@@ -148,10 +148,10 @@ export function useBaseInfoForm(treeData: Ref<any[]>) {
       label: '上级部门',
       render(val) {
         if (val) {
-          let data = findTree(treeData.value, (item) => item.key == val)
-          return data?.title ?? val
+          let data = findTree(treeData.value, (item) => item.key == val);
+          return data?.title ?? val;
         }
-        return val
+        return val;
       },
     },
     {
@@ -163,13 +163,13 @@ export function useBaseInfoForm(treeData: Ref<any[]>) {
       label: '机构类型',
       render(val) {
         if (val === '1') {
-          return '公司'
+          return '公司';
         } else if (val === '2') {
-          return '部门'
+          return '部门';
         } else if (val === '3') {
-          return '岗位'
+          return '岗位';
         }
-        return val
+        return val;
       },
     },
     {
@@ -189,7 +189,7 @@ export function useBaseInfoForm(treeData: Ref<any[]>) {
       field: 'memo',
       label: '备注',
     },
-  ]
+  ];
 
-  return {descItems}
+  return { descItems };
 }
diff --git a/src/views/system/departUser/index.less b/src/views/system/departUser/index.less
index 546396d..df2d981 100644
--- a/src/views/system/departUser/index.less
+++ b/src/views/system/departUser/index.less
@@ -1,7 +1,6 @@
 @prefix-cls: ~'@{namespace}-depart-user';
 
 .@{prefix-cls} {
-
   &--tree-search {
     width: 100%;
     margin: 10px 0 20px;
@@ -37,7 +36,7 @@
 }
 
 // 夜间模式样式兼容
-[data-theme="dark"] .@{prefix-cls} {
+[data-theme='dark'] .@{prefix-cls} {
   &--base-info-form {
     .ant-select.ant-select-disabled {
       .ant-select-selector {
diff --git a/src/views/system/departUser/index.vue b/src/views/system/departUser/index.vue
index a2e852a..8e053f3 100644
--- a/src/views/system/departUser/index.vue
+++ b/src/views/system/departUser/index.vue
@@ -1,21 +1,21 @@
 <template>
   <a-row :class="['p-4', `${prefixCls}--box`]" :gutter="10">
-    <a-col :xl="6" :lg="8" :md="10" :sm="24" style="flex: 1;">
-      <a-card :bordered="false" style="height: 100%;">
-        <DepartTree @select="onTreeSelect"/>
+    <a-col :xl="6" :lg="8" :md="10" :sm="24" style="flex: 1">
+      <a-card :bordered="false" style="height: 100%">
+        <DepartTree @select="onTreeSelect" />
       </a-card>
     </a-col>
-    <a-col :xl="18" :lg="16" :md="14" :sm="24" style="flex: 1;">
-      <a-card :bordered="false" style="height: 100%;">
+    <a-col :xl="18" :lg="16" :md="14" :sm="24" style="flex: 1">
+      <a-card :bordered="false" style="height: 100%">
         <a-tabs defaultActiveKey="user-info">
           <a-tab-pane tab="基本信息" key="base-info" forceRender>
-            <DepartBaseInfoTab :data="departData"/>
+            <DepartBaseInfoTab :data="departData" />
           </a-tab-pane>
           <a-tab-pane tab="用户信息" key="user-info">
-            <DepartUserInfoTab :data="departData"/>
+            <DepartUserInfoTab :data="departData" />
           </a-tab-pane>
           <a-tab-pane tab="部门角色" key="role-info">
-            <DepartRoleInfoTab :data="departData"/>
+            <DepartRoleInfoTab :data="departData" />
           </a-tab-pane>
         </a-tabs>
       </a-card>
@@ -24,26 +24,26 @@
 </template>
 
 <script lang="ts" setup name="system-depart-user">
-import { provide, ref } from 'vue'
-import { useDesign } from '/@/hooks/web/useDesign'
+  import { provide, ref } from 'vue';
+  import { useDesign } from '/@/hooks/web/useDesign';
 
-import DepartTree from './components/DepartTree.vue'
-import DepartBaseInfoTab from './components/DepartBaseInfoTab.vue'
-import DepartUserInfoTab from './components/DepartUserInfoTab.vue'
-import DepartRoleInfoTab from './components/DepartRoleInfoTab.vue'
+  import DepartTree from './components/DepartTree.vue';
+  import DepartBaseInfoTab from './components/DepartBaseInfoTab.vue';
+  import DepartUserInfoTab from './components/DepartUserInfoTab.vue';
+  import DepartRoleInfoTab from './components/DepartRoleInfoTab.vue';
 
-const { prefixCls } = useDesign('depart-user')
-provide('prefixCls', prefixCls)
+  const { prefixCls } = useDesign('depart-user');
+  provide('prefixCls', prefixCls);
 
-// 当前选中的部门信息
-let departData = ref({})
+  // 当前选中的部门信息
+  let departData = ref({});
 
-// 左侧树选择后触发
-function onTreeSelect(data) {
-  departData.value = data
-}
+  // 左侧树选择后触发
+  function onTreeSelect(data) {
+    departData.value = data;
+  }
 </script>
 
 <style lang="less">
-@import "./index.less";
+  @import './index.less';
 </style>
diff --git a/src/views/system/dict/components/DictItemList.vue b/src/views/system/dict/components/DictItemList.vue
index 759f1a8..da25813 100644
--- a/src/views/system/dict/components/DictItemList.vue
+++ b/src/views/system/dict/components/DictItemList.vue
@@ -5,31 +5,31 @@
         <a-button type="primary" @click="handleCreate"> 新增</a-button>
       </template>
       <template #action="{ record }">
-        <TableAction :actions="getTableAction(record)"/>
+        <TableAction :actions="getTableAction(record)" />
       </template>
     </BasicTable>
   </BasicDrawer>
-  <DictItemModal @register="registerModal" @success="reload" :dictId="dictId"/>
+  <DictItemModal @register="registerModal" @success="reload" :dictId="dictId" />
 </template>
 <script lang="ts" setup>
-  import {ref,unref} from 'vue';
-  import {BasicDrawer, useDrawerInner} from '/src/components/Drawer';
-  import {BasicTable, useTable, TableAction} from '/src/components/Table';
-  import {useModal} from '/src/components/Modal';
-  import { useDesign } from '/@/hooks/web/useDesign'
+  import { ref, unref } from 'vue';
+  import { BasicDrawer, useDrawerInner } from '/src/components/Drawer';
+  import { BasicTable, useTable, TableAction } from '/src/components/Table';
+  import { useModal } from '/src/components/Modal';
+  import { useDesign } from '/@/hooks/web/useDesign';
   import DictItemModal from './DictItemModal.vue';
-  import {dictItemColumns, dictItemSearchFormSchema} from '../dict.data';
-  import {itemList,deleteItem} from '../dict.api';
+  import { dictItemColumns, dictItemSearchFormSchema } from '../dict.data';
+  import { itemList, deleteItem } from '../dict.api';
   import { ColEx } from '/@/components/Form/src/types';
 
   const { prefixCls } = useDesign('row-invalid');
   const dictId = ref('');
   //字典配置model
-  const [registerModal, {openModal}] = useModal();
+  const [registerModal, { openModal }] = useModal();
   const [registerDrawer] = useDrawerInner(async (data) => {
-    dictId.value = data.id
-    setProps({searchInfo:{dictId:unref(dictId)}});
-    reload()
+    dictId.value = data.id;
+    setProps({ searchInfo: { dictId: unref(dictId) } });
+    reload();
   });
   // 自适应列配置
   const adaptiveColProps: Partial<ColEx> = {
@@ -39,15 +39,15 @@
     lg: 12, // ≥992px
     xl: 12, // ≥1200px
     xxl: 8, // ≥1600px
-  }
-  const [registerTable, {reload,setProps}] = useTable({
+  };
+  const [registerTable, { reload, setProps }] = useTable({
     api: itemList,
     columns: dictItemColumns,
     formConfig: {
       baseColProps: adaptiveColProps,
-      labelAlign:"right",
+      labelAlign: 'right',
       labelCol: {
-        offset:1,
+        offset: 1,
         xs: 24,
         sm: 24,
         md: 24,
@@ -57,7 +57,7 @@
       },
       wrapperCol: {},
       schemas: dictItemSearchFormSchema,
-      autoSubmitOnEnter:true,
+      autoSubmitOnEnter: true,
     },
     striped: true,
     useSearchForm: true,
@@ -69,7 +69,7 @@
       width: 100,
       title: '操作',
       dataIndex: 'action',
-      slots: {customRender: 'action'},
+      slots: { customRender: 'action' },
       fixed: undefined,
     },
   });
@@ -97,7 +97,7 @@
    * 删除
    */
   async function handleDelete(record) {
-    await deleteItem({id: record.id}, reload);
+    await deleteItem({ id: record.id }, reload);
   }
 
   /**
@@ -115,18 +115,18 @@
           title: '是否确认删除',
           confirm: handleDelete.bind(null, record),
         },
-      }
+      },
     ];
   }
-  function getRowClassName(record){
-      return record.status==0?prefixCls:'';
+  function getRowClassName(record) {
+    return record.status == 0 ? prefixCls : '';
   }
 </script>
 <style scoped lang="less">
-    @prefix-cls: ~'@{namespace}-row-invalid';
+  @prefix-cls: ~'@{namespace}-row-invalid';
 
-   ::v-deep(.@{prefix-cls}) {
-        background: #f4f4f4;
-        color: #bababa;
-    }
+  ::v-deep(.@{prefix-cls}) {
+    background: #f4f4f4;
+    color: #bababa;
+  }
 </style>
diff --git a/src/views/system/dict/components/DictItemModal.vue b/src/views/system/dict/components/DictItemModal.vue
index 5c00a53..1fea1c8 100644
--- a/src/views/system/dict/components/DictItemModal.vue
+++ b/src/views/system/dict/components/DictItemModal.vue
@@ -1,20 +1,20 @@
 <template>
   <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" width="800px">
-    <BasicForm @register="registerForm"/>
+    <BasicForm @register="registerForm" />
   </BasicModal>
 </template>
 <script lang="ts" setup>
-  import {defineProps,ref, computed, unref,reactive} from 'vue';
-  import {BasicModal, useModalInner} from '/src/components/Modal';
-  import {BasicForm, useForm} from '/src/components/Form';
-  import {itemFormSchema} from '../dict.data';
-  import {saveOrUpdateDictItem} from '../dict.api';
+  import { defineProps, ref, computed, unref, reactive } from 'vue';
+  import { BasicModal, useModalInner } from '/src/components/Modal';
+  import { BasicForm, useForm } from '/src/components/Form';
+  import { itemFormSchema } from '../dict.data';
+  import { saveOrUpdateDictItem } from '../dict.api';
   // 声明Emits
-  const emit = defineEmits(['success','register']);
-  const props = defineProps({dictId: String})
+  const emit = defineEmits(['success', 'register']);
+  const props = defineProps({ dictId: String });
   const isUpdate = ref(true);
   //表单配置
-  const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
+  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
     schemas: itemFormSchema,
     showActionButtonGroup: false,
     mergeDynamicData: props,
@@ -28,10 +28,10 @@
     },
   });
   //表单赋值
-  const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
     //重置表单
     await resetFields();
-    setModalProps({confirmLoading: false});
+    setModalProps({ confirmLoading: false });
     isUpdate.value = !!data?.isUpdate;
     if (unref(isUpdate)) {
       //表单赋值
@@ -48,16 +48,16 @@
   async function handleSubmit() {
     try {
       const values = await validate();
-      values.dictId = props.dictId
-      setModalProps({confirmLoading: true});
+      values.dictId = props.dictId;
+      setModalProps({ confirmLoading: true });
       //提交表单
-      await saveOrUpdateDictItem(values,isUpdate.value);
+      await saveOrUpdateDictItem(values, isUpdate.value);
       //关闭弹窗
       closeModal();
       //刷新列表
       emit('success');
     } finally {
-      setModalProps({confirmLoading: false});
+      setModalProps({ confirmLoading: false });
     }
   }
 </script>
diff --git a/src/views/system/dict/components/DictModal.vue b/src/views/system/dict/components/DictModal.vue
index 09b0dc4..812a788 100644
--- a/src/views/system/dict/components/DictModal.vue
+++ b/src/views/system/dict/components/DictModal.vue
@@ -1,52 +1,52 @@
 <template>
   <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" width="500px" @ok="handleSubmit">
-    <BasicForm @register="registerForm"/>
+    <BasicForm @register="registerForm" />
   </BasicModal>
 </template>
 <script lang="ts" setup>
-    import {ref, computed, unref} from 'vue';
-    import {BasicModal, useModalInner} from '/src/components/Modal';
-    import {BasicForm, useForm} from '/src/components/Form';
-    import {formSchema} from '../dict.data';
-    import {saveOrUpdateDict} from '../dict.api';
-    // 声明Emits
-    const emit = defineEmits(['register','success']);
-    const isUpdate = ref(true);
-    const rowId = ref('');
-    //表单配置
-    const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
-        schemas: formSchema,
-        showActionButtonGroup: false
-    });
-    //表单赋值
-    const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-        //重置表单
-        await resetFields();
-        setModalProps({confirmLoading: false,minHeight:80});
-        isUpdate.value = !!data?.isUpdate;
-        if (unref(isUpdate)) {
-          rowId.value = data.record.id;
-            //表单赋值
-            await setFieldsValue({
-                ...data.record,
-            });
-        }
-    });
-    //设置标题
-    const getTitle = computed(() => (!unref(isUpdate) ? '新增字典' : '编辑字典'));
-    //表单提交事件
-    async function handleSubmit() {
-        try {
-            let values = await validate();
-            setModalProps({confirmLoading: true});
-            //提交表单
-            await saveOrUpdateDict(values, isUpdate.value);
-            //关闭弹窗
-            closeModal();
-            //刷新列表
-            emit('success', {isUpdate: unref(isUpdate), values: {...values, id: rowId.value}});
-        } finally {
-            setModalProps({confirmLoading: false});
-        }
+  import { ref, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/src/components/Modal';
+  import { BasicForm, useForm } from '/src/components/Form';
+  import { formSchema } from '../dict.data';
+  import { saveOrUpdateDict } from '../dict.api';
+  // 声明Emits
+  const emit = defineEmits(['register', 'success']);
+  const isUpdate = ref(true);
+  const rowId = ref('');
+  //表单配置
+  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
+    schemas: formSchema,
+    showActionButtonGroup: false,
+  });
+  //表单赋值
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    //重置表单
+    await resetFields();
+    setModalProps({ confirmLoading: false, minHeight: 80 });
+    isUpdate.value = !!data?.isUpdate;
+    if (unref(isUpdate)) {
+      rowId.value = data.record.id;
+      //表单赋值
+      await setFieldsValue({
+        ...data.record,
+      });
     }
+  });
+  //设置标题
+  const getTitle = computed(() => (!unref(isUpdate) ? '新增字典' : '编辑字典'));
+  //表单提交事件
+  async function handleSubmit() {
+    try {
+      let values = await validate();
+      setModalProps({ confirmLoading: true });
+      //提交表单
+      await saveOrUpdateDict(values, isUpdate.value);
+      //关闭弹窗
+      closeModal();
+      //刷新列表
+      emit('success', { isUpdate: unref(isUpdate), values: { ...values, id: rowId.value } });
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
+  }
 </script>
diff --git a/src/views/system/dict/components/DictRecycleBinModal.vue b/src/views/system/dict/components/DictRecycleBinModal.vue
index 8c459fc..c7e7cf5 100644
--- a/src/views/system/dict/components/DictRecycleBinModal.vue
+++ b/src/views/system/dict/components/DictRecycleBinModal.vue
@@ -3,25 +3,25 @@
     <BasicTable @register="registerTable">
       <!--操作栏-->
       <template #action="{ record }">
-        <TableAction :actions="getTableAction(record)"/>
+        <TableAction :actions="getTableAction(record)" />
       </template>
     </BasicTable>
   </BasicModal>
 </template>
 <script lang="ts" setup>
-  import {ref,toRaw} from 'vue';
-  import {BasicModal, useModalInner} from '/src/components/Modal';
-  import {BasicTable, useTable, TableAction} from '/src/components/Table';
-  import {recycleBincolumns} from '../dict.data';
-  import {getRecycleBinList, putRecycleBin, deleteRecycleBin} from '../dict.api';
+  import { ref, toRaw } from 'vue';
+  import { BasicModal, useModalInner } from '/src/components/Modal';
+  import { BasicTable, useTable, TableAction } from '/src/components/Table';
+  import { recycleBincolumns } from '../dict.data';
+  import { getRecycleBinList, putRecycleBin, deleteRecycleBin } from '../dict.api';
   // 声明Emits
   const emit = defineEmits(['success', 'register']);
   const checkedKeys = ref<Array<string | number>>([]);
-  const [registerModal, {setModalProps, closeModal}] = useModalInner();
+  const [registerModal, { setModalProps, closeModal }] = useModalInner();
   //注册table数据
-  const [registerTable, {reload}] = useTable({
+  const [registerTable, { reload }] = useTable({
     api: getRecycleBinList,
-    columns:recycleBincolumns,
+    columns: recycleBincolumns,
     striped: true,
     useSearchForm: false,
     showTableSetting: false,
@@ -29,13 +29,13 @@
     bordered: true,
     showIndexColumn: false,
     pagination: false,
-    tableSetting: {fullScreen: true},
+    tableSetting: { fullScreen: true },
     canResize: false,
     actionColumn: {
       width: 100,
       title: '操作',
       dataIndex: 'action',
-      slots: {customRender: 'action'},
+      slots: { customRender: 'action' },
       fixed: undefined,
     },
   });
@@ -44,48 +44,47 @@
    * 还原事件
    */
   async function handleRevert(record) {
-    await putRecycleBin(record.id,reload)
-    emit('success')
+    await putRecycleBin(record.id, reload);
+    emit('success');
   }
   /**
    * 删除事件
    */
   async function handleDelete(record) {
-    await deleteRecycleBin(record.id,reload)
+    await deleteRecycleBin(record.id, reload);
   }
   /**
    * 批量还原事件
    */
   function batchHandleRevert() {
-    handleRevert({id:toRaw(checkedKeys.value).join(",")})
+    handleRevert({ id: toRaw(checkedKeys.value).join(',') });
   }
   /**
    * 批量删除事件
    */
   function batchHandleDelete() {
-    handleDelete({id:toRaw(checkedKeys.value).join(",")})
+    handleDelete({ id: toRaw(checkedKeys.value).join(',') });
   }
   //获取操作栏事件
   function getTableAction(record) {
     return [
       {
-        label:"取回",
+        label: '取回',
         icon: 'ant-design:redo-outlined',
         popConfirm: {
           title: '是否确认取回',
           confirm: handleRevert.bind(null, record),
-        }
+        },
       },
       {
-        label:"彻底删除",
+        label: '彻底删除',
         icon: 'ant-design:scissor-outlined',
         color: 'error',
         popConfirm: {
           title: '是否确认删除',
           confirm: handleDelete.bind(null, record),
         },
-      }
-    ]
+      },
+    ];
   }
-
 </script>
diff --git a/src/views/system/dict/dict.api.ts b/src/views/system/dict/dict.api.ts
index d95540f..1a839ac 100644
--- a/src/views/system/dict/dict.api.ts
+++ b/src/views/system/dict/dict.api.ts
@@ -1,9 +1,9 @@
-import {defHttp} from '/@/utils/http/axios';
-import {Modal} from 'ant-design-vue';
+import { defHttp } from '/@/utils/http/axios';
+import { Modal } from 'ant-design-vue';
 enum Api {
   list = '/sys/dict/list',
-  save='/sys/dict/add',
-  edit='/sys/dict/edit',
+  save = '/sys/dict/add',
+  edit = '/sys/dict/edit',
   duplicateCheck = '/sys/duplicate/check',
   deleteDict = '/sys/dict/delete',
   deleteBatch = '/sys/dict/deleteBatch',
@@ -18,7 +18,7 @@ enum Api {
   itemEdit = '/sys/dictItem/edit',
   dictItemCheck = '/sys/dictItem/dictItemCheck',
   refreshCache = '/sys/dict/refleshCache',
-  queryAllDictItems = "/sys/dict/queryAllDictItems",
+  queryAllDictItems = '/sys/dict/queryAllDictItems',
 }
 /**
  * 导出api
@@ -34,16 +34,15 @@ export const getImportUrl = Api.importExcel;
  * 字典列表接口
  * @param params
  */
-export const list = (params) =>
-  defHttp.get({url: Api.list, params});
+export const list = (params) => defHttp.get({ url: Api.list, params });
 /**
  * 删除字典
  */
-export const deleteDict = (params,handleSuccess) => {
-  return defHttp.delete({url: Api.deleteDict, params}, {joinParamsToUrl: true}).then(() => {
+export const deleteDict = (params, handleSuccess) => {
+  return defHttp.delete({ url: Api.deleteDict, params }, { joinParamsToUrl: true }).then(() => {
     handleSuccess();
   });
-}
+};
 /**
  * 批量删除字典
  * @param params
@@ -55,88 +54,82 @@ export const batchDeleteDict = (params, handleSuccess) => {
     okText: '确认',
     cancelText: '取消',
     onOk: () => {
-      return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
+      return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => {
         handleSuccess();
       });
-    }
+    },
   });
-}
+};
 /**
  * 保存或者更新字典
  * @param params
  */
 export const saveOrUpdateDict = (params, isUpdate) => {
   let url = isUpdate ? Api.edit : Api.save;
-  return defHttp.post({url: url, params});
-}
+  return defHttp.post({ url: url, params });
+};
 /**
  * 唯一校验
  * @param params
  */
-export const duplicateCheck = (params) =>
-  defHttp.get({url: Api.duplicateCheck, params},{isTransformResponse:false});
+export const duplicateCheck = (params) => defHttp.get({ url: Api.duplicateCheck, params }, { isTransformResponse: false });
 /**
  * 字典回收站列表
  * @param params
  */
-export const getRecycleBinList = (params) =>
-  defHttp.get({url: Api.recycleBinList, params});
+export const getRecycleBinList = (params) => defHttp.get({ url: Api.recycleBinList, params });
 /**
  * 回收站还原
  * @param params
  */
-export const putRecycleBin = (id,handleSuccess) =>{
-  return defHttp.put({url: Api.putRecycleBin+`/${id}`}).then(() => {
+export const putRecycleBin = (id, handleSuccess) => {
+  return defHttp.put({ url: Api.putRecycleBin + `/${id}` }).then(() => {
     handleSuccess();
   });
-}
+};
 /**
  * 回收站删除
  * @param params
  */
-export const deleteRecycleBin = (id,handleSuccess) => {
-  return defHttp.delete({url: Api.deleteRecycleBin+`/${id}`}).then(() => {
+export const deleteRecycleBin = (id, handleSuccess) => {
+  return defHttp.delete({ url: Api.deleteRecycleBin + `/${id}` }).then(() => {
     handleSuccess();
   });
-}
+};
 /**
  * 字典配置列表
  * @param params
  */
-export const itemList = (params) =>
-  defHttp.get({url: Api.itemList, params});
+export const itemList = (params) => defHttp.get({ url: Api.itemList, params });
 /**
  * 字典配置删除
  * @param params
  */
-export const deleteItem = (params,handleSuccess) => {
-  return defHttp.delete({url: Api.deleteItem, params}, {joinParamsToUrl: true}).then(() => {
+export const deleteItem = (params, handleSuccess) => {
+  return defHttp.delete({ url: Api.deleteItem, params }, { joinParamsToUrl: true }).then(() => {
     handleSuccess();
   });
-}
+};
 /**
  * 保存或者更新字典配置
  * @param params
  */
 export const saveOrUpdateDictItem = (params, isUpdate) => {
   let url = isUpdate ? Api.itemEdit : Api.itemSave;
-  return defHttp.post({url: url, params});
-}
+  return defHttp.post({ url: url, params });
+};
 /**
  * 校验字典数据值
  * @param params
  */
-export const dictItemCheck = (params) =>
-  defHttp.get({url: Api.dictItemCheck, params},{isTransformResponse:false});
+export const dictItemCheck = (params) => defHttp.get({ url: Api.dictItemCheck, params }, { isTransformResponse: false });
 /**
  * 刷新字典
  * @param params
  */
-export const refreshCache = () =>
-  defHttp.get({url: Api.refreshCache},{isTransformResponse:false});
+export const refreshCache = () => defHttp.get({ url: Api.refreshCache }, { isTransformResponse: false });
 /**
  * 获取所有字典项
  * @param params
  */
-export const queryAllDictItems = () =>
-  defHttp.get({url: Api.queryAllDictItems},{isTransformResponse:false});
+export const queryAllDictItems = () => defHttp.get({ url: Api.queryAllDictItems }, { isTransformResponse: false });
diff --git a/src/views/system/dict/dict.data.ts b/src/views/system/dict/dict.data.ts
index 936b5d8..97c9b58 100644
--- a/src/views/system/dict/dict.data.ts
+++ b/src/views/system/dict/dict.data.ts
@@ -1,7 +1,7 @@
 import { BasicColumn } from '/@/components/Table';
 import { FormSchema } from '/@/components/Table';
-import {dictItemCheck} from "./dict.api";
-import { rules} from '/@/utils/helper/validator';
+import { dictItemCheck } from './dict.api';
+import { rules } from '/@/utils/helper/validator';
 export const columns: BasicColumn[] = [
   {
     title: '字典名称',
@@ -17,7 +17,8 @@ export const columns: BasicColumn[] = [
     title: '描述',
     dataIndex: 'description',
     // width: 120
-  }];
+  },
+];
 
 export const recycleBincolumns: BasicColumn[] = [
   {
@@ -33,22 +34,23 @@ export const recycleBincolumns: BasicColumn[] = [
   {
     title: '描述',
     dataIndex: 'description',
-    width: 120
-  }];
+    width: 120,
+  },
+];
 
 export const searchFormSchema: FormSchema[] = [
   {
     label: '字典名称',
     field: 'dictName',
     component: 'Input',
-    colProps: {span: 6},
+    colProps: { span: 6 },
   },
   {
     label: '字典编码',
     field: 'dictCode',
     component: 'Input',
-    colProps: {span: 6},
-  }
+    colProps: { span: 6 },
+  },
 ];
 
 export const formSchema: FormSchema[] = [
@@ -56,7 +58,7 @@ export const formSchema: FormSchema[] = [
     label: '',
     field: 'id',
     component: 'Input',
-    show:false
+    show: false,
   },
   {
     label: '字典名称',
@@ -68,47 +70,46 @@ export const formSchema: FormSchema[] = [
     label: '字典编码',
     field: 'dictCode',
     component: 'Input',
-    dynamicDisabled: ({values}) => {
+    dynamicDisabled: ({ values }) => {
       return !!values.id;
     },
-    dynamicRules:({model,schema}) =>rules.duplicateCheckRule("sys_dict", "dict_code",model,schema,true),
+    dynamicRules: ({ model, schema }) => rules.duplicateCheckRule('sys_dict', 'dict_code', model, schema, true),
   },
   {
     label: '描述',
     field: 'description',
-    component: 'Input'
-  }
+    component: 'Input',
+  },
 ];
 
 export const dictItemColumns: BasicColumn[] = [
   {
     title: '名称',
     dataIndex: 'itemText',
-    width: 80
+    width: 80,
   },
   {
     title: '数据值',
     dataIndex: 'itemValue',
-    width: 80
-  }];
+    width: 80,
+  },
+];
 
 export const dictItemSearchFormSchema: FormSchema[] = [
   {
     label: '名称',
     field: 'itemText',
     component: 'Input',
-
   },
   {
     label: '状态',
     field: 'status',
     component: 'JDictSelectTag',
     componentProps: {
-      dictCode:'dict_item_status',
-      stringToNumber:true
+      dictCode: 'dict_item_status',
+      stringToNumber: true,
     },
-
-  }
+  },
 ];
 
 export const itemFormSchema: FormSchema[] = [
@@ -116,7 +117,7 @@ export const itemFormSchema: FormSchema[] = [
     label: '',
     field: 'id',
     component: 'Input',
-    show:false
+    show: false,
   },
   {
     label: '名称',
@@ -128,7 +129,7 @@ export const itemFormSchema: FormSchema[] = [
     label: '数据值',
     field: 'itemValue',
     component: 'Input',
-    dynamicRules: ({values, model}) => {
+    dynamicRules: ({ values, model }) => {
       return [
         {
           required: true,
@@ -143,14 +144,15 @@ export const itemFormSchema: FormSchema[] = [
               let params = {
                 dictId: values.dictId,
                 id: model.id,
-                itemValue: value
+                itemValue: value,
               };
               dictItemCheck(params)
                 .then((res) => {
                   res.success ? resolve() : reject(res.message || '校验失败');
-                }).catch((err) => {
-                reject(err.message || '验证失败');
-              });
+                })
+                .catch((err) => {
+                  reject(err.message || '验证失败');
+                });
             });
           },
         },
@@ -160,7 +162,7 @@ export const itemFormSchema: FormSchema[] = [
   {
     label: '描述',
     field: 'description',
-    component: 'Input'
+    component: 'Input',
   },
   {
     field: 'sortOrder',
@@ -174,9 +176,9 @@ export const itemFormSchema: FormSchema[] = [
     defaultValue: 1,
     component: 'JDictSelectTag',
     componentProps: {
-        type:'radioButton',
-        dictCode:'dict_item_status',
-        stringToNumber:true
+      type: 'radioButton',
+      dictCode: 'dict_item_status',
+      stringToNumber: true,
     },
-  }
+  },
 ];
diff --git a/src/views/system/dict/index.vue b/src/views/system/dict/index.vue
index c4261bc..05e060a 100644
--- a/src/views/system/dict/index.vue
+++ b/src/views/system/dict/index.vue
@@ -1,68 +1,69 @@
 <template>
-    <!--引用表格-->
-    <BasicTable @register="registerTable" :rowSelection="rowSelection">
-      <!--插槽:table标题-->
-      <template #tableTitle>
-          <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增</a-button>
-          <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
-          <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
-          <a-button type="primary" @click="handlerRefreshCache" preIcon="ant-design:sync-outlined"> 刷新缓存</a-button>
-          <a-button type="primary" @click="openRecycleModal(true)" preIcon="ant-design:hdd-outlined"> 回收站</a-button>
+  <!--引用表格-->
+  <BasicTable @register="registerTable" :rowSelection="rowSelection">
+    <!--插槽:table标题-->
+    <template #tableTitle>
+      <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增</a-button>
+      <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
+      <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
+      <a-button type="primary" @click="handlerRefreshCache" preIcon="ant-design:sync-outlined"> 刷新缓存</a-button>
+      <a-button type="primary" @click="openRecycleModal(true)" preIcon="ant-design:hdd-outlined"> 回收站</a-button>
 
-          <a-dropdown v-if="selectedRowKeys.length > 0">
-          <template #overlay>
-            <a-menu>
-              <a-menu-item key="1" @click="batchHandleDelete">
-                <Icon icon="ant-design:delete-outlined"></Icon>
-                删除
-              </a-menu-item>
-            </a-menu>
-          </template>
-          <a-button>批量操作
-            <Icon icon="ant-design:down-outlined"></Icon>
-          </a-button>
-        </a-dropdown>
-      </template>
-      <!--操作栏-->
-      <template #action="{ record }">
-        <TableAction :actions="getTableAction(record)"/>
-      </template>
-    </BasicTable>
-    <!--字典弹窗-->
-    <DictModal @register="registerModal" @success="handleSuccess"/>
-    <!--字典配置抽屉-->
-    <DictItemList @register="registerDrawer"/>
-    <!--回收站弹窗-->
-    <DictRecycleBinModal @register="registerModal1" @success="reload"/>
+      <a-dropdown v-if="selectedRowKeys.length > 0">
+        <template #overlay>
+          <a-menu>
+            <a-menu-item key="1" @click="batchHandleDelete">
+              <Icon icon="ant-design:delete-outlined"></Icon>
+              删除
+            </a-menu-item>
+          </a-menu>
+        </template>
+        <a-button
+          >批量操作
+          <Icon icon="ant-design:down-outlined"></Icon>
+        </a-button>
+      </a-dropdown>
+    </template>
+    <!--操作栏-->
+    <template #action="{ record }">
+      <TableAction :actions="getTableAction(record)" />
+    </template>
+  </BasicTable>
+  <!--字典弹窗-->
+  <DictModal @register="registerModal" @success="handleSuccess" />
+  <!--字典配置抽屉-->
+  <DictItemList @register="registerDrawer" />
+  <!--回收站弹窗-->
+  <DictRecycleBinModal @register="registerModal1" @success="reload" />
 </template>
 
 <script lang="ts" name="system-dict" setup>
   //ts语法
-  import {ref, computed, unref} from 'vue';
-  import {BasicTable, TableAction} from '/src/components/Table';
-  import {useDrawer} from '/src/components/Drawer';
-  import {useModal} from '/src/components/Modal';
+  import { ref, computed, unref } from 'vue';
+  import { BasicTable, TableAction } from '/src/components/Table';
+  import { useDrawer } from '/src/components/Drawer';
+  import { useModal } from '/src/components/Modal';
   import DictItemList from './components/DictItemList.vue';
   import DictModal from './components/DictModal.vue';
   import DictRecycleBinModal from './components/DictRecycleBinModal.vue';
-  import {useMessage} from '/src/hooks/web/useMessage';
-  import { removeAuthCache,setAuthCache } from '/src/utils/auth';
-  import {columns, searchFormSchema} from './dict.data';
-  import {list,deleteDict,batchDeleteDict,getExportUrl,getImportUrl,refreshCache,queryAllDictItems} from './dict.api';
+  import { useMessage } from '/src/hooks/web/useMessage';
+  import { removeAuthCache, setAuthCache } from '/src/utils/auth';
+  import { columns, searchFormSchema } from './dict.data';
+  import { list, deleteDict, batchDeleteDict, getExportUrl, getImportUrl, refreshCache, queryAllDictItems } from './dict.api';
   import { DB_DICT_DATA_KEY } from '/src/enums/cacheEnum';
 
-  const {createMessage} = useMessage();
+  const { createMessage } = useMessage();
   //字典model
-  const [registerModal, {openModal}] = useModal();
+  const [registerModal, { openModal }] = useModal();
   //字典配置drawer
-  const [registerDrawer, {openDrawer}] = useDrawer();
-  import { useListPage } from '/@/hooks/system/useListPage'
+  const [registerDrawer, { openDrawer }] = useDrawer();
+  import { useListPage } from '/@/hooks/system/useListPage';
 
   //回收站model
-  const [registerModal1, {openModal: openRecycleModal}] = useModal();
+  const [registerModal1, { openModal: openRecycleModal }] = useModal();
 
   // 列表页面公共参数、方法
-  const { prefixCls, tableContext,onExportXls,onImportXls } = useListPage({
+  const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
     designScope: 'dict-template',
     tableProps: {
       title: '数据字典',
@@ -72,20 +73,20 @@
         schemas: searchFormSchema,
       },
       actionColumn: {
-        width: 240
+        width: 240,
       },
       exportConfig: {
-        name:"数据字典列表",
+        name: '数据字典列表',
         url: getExportUrl,
       },
       importConfig: {
-        url: getImportUrl
-      }
-    }
-  })
+        url: getImportUrl,
+      },
+    },
+  });
 
   //注册table数据
-  const [registerTable, {reload, updateTableDataRecord},{ rowSelection, selectedRowKeys }] =tableContext;
+  const [registerTable, { reload, updateTableDataRecord }, { rowSelection, selectedRowKeys }] = tableContext;
 
   /**
    * 新增事件
@@ -106,7 +107,7 @@
   }
   /**
    * 详情
-  */
+   */
   async function handleDetail(record) {
     openModal(true, {
       record,
@@ -117,18 +118,18 @@
    * 删除事件
    */
   async function handleDelete(record) {
-    await deleteDict({id: record.id}, reload);
+    await deleteDict({ id: record.id }, reload);
   }
   /**
    * 批量删除事件
    */
   async function batchHandleDelete() {
-    await batchDeleteDict({ids: selectedRowKeys.value}, reload);
+    await batchDeleteDict({ ids: selectedRowKeys.value }, reload);
   }
   /**
    * 成功回调
    */
-  function handleSuccess({isUpdate, values}) {
+  function handleSuccess({ isUpdate, values }) {
     if (isUpdate) {
       updateTableDataRecord(values.id, values);
     } else {
@@ -140,13 +141,13 @@
    */
   async function handlerRefreshCache() {
     const result = await refreshCache();
-    if(result.success){
+    if (result.success) {
       const res = await queryAllDictItems();
-      removeAuthCache(DB_DICT_DATA_KEY)
-      setAuthCache(DB_DICT_DATA_KEY, res.result)
-      createMessage.success("刷新缓存完成！");
-    }else{
-      createMessage.error("刷新缓存失败！");
+      removeAuthCache(DB_DICT_DATA_KEY);
+      setAuthCache(DB_DICT_DATA_KEY, res.result);
+      createMessage.success('刷新缓存完成！');
+    } else {
+      createMessage.error('刷新缓存失败！');
     }
   }
   /**
@@ -154,13 +155,13 @@
    */
   function handleItem(record) {
     openDrawer(true, {
-      id:record.id,
+      id: record.id,
     });
   }
   /**
    * 操作栏
    */
-  function getTableAction(record){
+  function getTableAction(record) {
     return [
       {
         label: '编辑',
@@ -176,11 +177,9 @@
           title: '确定删除吗?',
           confirm: handleDelete.bind(null, record),
         },
-      }
-    ]
+      },
+    ];
   }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/views/system/examples/demo/DemoModal.vue b/src/views/system/examples/demo/DemoModal.vue
index f2035af..f9f9473 100644
--- a/src/views/system/examples/demo/DemoModal.vue
+++ b/src/views/system/examples/demo/DemoModal.vue
@@ -1,53 +1,53 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit" width="40%">
-        <BasicForm @register="registerForm"/>
-    </BasicModal>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit" width="40%">
+    <BasicForm @register="registerForm" />
+  </BasicModal>
 </template>
 <script lang="ts" setup>
-    import {ref, computed, unref} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {BasicForm, useForm} from '/@/components/Form/index';
-    import {formSchema} from './demo.data';
-    import {saveOrUpdateDemo, getDemoById} from './demo.api';
-    // 声明Emits
-    const emit = defineEmits(['register','success']);
-    const isUpdate = ref(true);
-    //表单配置
-    const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
-        labelWidth: 150,
-        schemas: formSchema,
-        showActionButtonGroup: false,
-    });
-    //表单赋值
-    const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-        //重置表单
-        await resetFields();
-        setModalProps({confirmLoading: false});
-        isUpdate.value = !!data?.isUpdate;
-        if (unref(isUpdate)) {
-            //获取详情
-            data.record = await getDemoById({id: data.record.id});
-            //表单赋值
-            await setFieldsValue({
-                ...data.record,
-            });
-        }
-    });
-    //设置标题
-    const title = computed(() => (!unref(isUpdate) ? '新增租户' : '编辑租户'));
-    //表单提交事件
-    async function handleSubmit(v) {
-        try {
-            let values = await validate();
-            setModalProps({confirmLoading: true});
-            //提交表单
-            await saveOrUpdateDemo(values, isUpdate.value);
-            //关闭弹窗
-            closeModal();
-            //刷新列表
-            emit('success');
-        } finally {
-            setModalProps({confirmLoading: false});
-        }
+  import { ref, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { formSchema } from './demo.data';
+  import { saveOrUpdateDemo, getDemoById } from './demo.api';
+  // 声明Emits
+  const emit = defineEmits(['register', 'success']);
+  const isUpdate = ref(true);
+  //表单配置
+  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
+    labelWidth: 150,
+    schemas: formSchema,
+    showActionButtonGroup: false,
+  });
+  //表单赋值
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    //重置表单
+    await resetFields();
+    setModalProps({ confirmLoading: false });
+    isUpdate.value = !!data?.isUpdate;
+    if (unref(isUpdate)) {
+      //获取详情
+      data.record = await getDemoById({ id: data.record.id });
+      //表单赋值
+      await setFieldsValue({
+        ...data.record,
+      });
     }
+  });
+  //设置标题
+  const title = computed(() => (!unref(isUpdate) ? '新增租户' : '编辑租户'));
+  //表单提交事件
+  async function handleSubmit(v) {
+    try {
+      let values = await validate();
+      setModalProps({ confirmLoading: true });
+      //提交表单
+      await saveOrUpdateDemo(values, isUpdate.value);
+      //关闭弹窗
+      closeModal();
+      //刷新列表
+      emit('success');
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
+  }
 </script>
diff --git a/src/views/system/examples/demo/demo.api.ts b/src/views/system/examples/demo/demo.api.ts
index eb2d3e0..1cde92b 100644
--- a/src/views/system/examples/demo/demo.api.ts
+++ b/src/views/system/examples/demo/demo.api.ts
@@ -1,15 +1,15 @@
-import {defHttp} from '/@/utils/http/axios';
-import {Modal} from 'ant-design-vue';
+import { defHttp } from '/@/utils/http/axios';
+import { Modal } from 'ant-design-vue';
 
 enum Api {
-    list = "/test/jeecgDemo/list",
-    save = "/test/jeecgDemo/add",
-    edit = "/test/jeecgDemo/edit",
-    get = "/test/jeecgDemo/queryById",
-    delete = "/test/jeecgDemo/delete",
-    deleteBatch = "/test/jeecgDemo/deleteBatch",
-    exportXls = "/test/jeecgDemo/exportXls",
-    importExcel = "/test/jeecgDemo/importExcel",
+  list = '/test/jeecgDemo/list',
+  save = '/test/jeecgDemo/add',
+  edit = '/test/jeecgDemo/edit',
+  get = '/test/jeecgDemo/queryById',
+  delete = '/test/jeecgDemo/delete',
+  deleteBatch = '/test/jeecgDemo/deleteBatch',
+  exportXls = '/test/jeecgDemo/exportXls',
+  importExcel = '/test/jeecgDemo/importExcel',
 }
 /**
  * 导出api
@@ -24,51 +24,50 @@ export const getImportUrl = Api.importExcel;
  * @param params
  */
 export const getDemoList = (params) => {
-    return defHttp.get({url: Api.list, params});
-}
+  return defHttp.get({ url: Api.list, params });
+};
 
 /**
  * 保存或者更新示例
  * @param params
  */
 export const saveOrUpdateDemo = (params, isUpdate) => {
-    let url = isUpdate ? Api.edit : Api.save;
-    return defHttp.post({url: url, params});
-}
+  let url = isUpdate ? Api.edit : Api.save;
+  return defHttp.post({ url: url, params });
+};
 
 /**
  * 查询示例详情
  * @param params
  */
 export const getDemoById = (params) => {
-    return defHttp.get({url: Api.get, params});
-}
+  return defHttp.get({ url: Api.get, params });
+};
 
 /**
  * 删除示例
  * @param params
  */
-export const deleteDemo = (params,handleSuccess) => {
-    return defHttp.delete({url: Api.delete, data: params}, {joinParamsToUrl: true}).then(()=>{
-        handleSuccess();
-    });
-}
+export const deleteDemo = (params, handleSuccess) => {
+  return defHttp.delete({ url: Api.delete, data: params }, { joinParamsToUrl: true }).then(() => {
+    handleSuccess();
+  });
+};
 
 /**
  * 批量删除示例
  * @param params
  */
 export const batchDeleteDemo = (params, handleSuccess) => {
-    Modal.confirm({
-        title: '确认删除',
-        content: '是否删除选中数据',
-        okText: '确认',
-        cancelText: '取消',
-        onOk: () => {
-            return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
-                handleSuccess();
-            });
-        }
-    });
-}
-
+  Modal.confirm({
+    title: '确认删除',
+    content: '是否删除选中数据',
+    okText: '确认',
+    cancelText: '取消',
+    onOk: () => {
+      return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => {
+        handleSuccess();
+      });
+    },
+  });
+};
diff --git a/src/views/system/examples/demo/demo.data.ts b/src/views/system/examples/demo/demo.data.ts
index 86f055a..b780095 100644
--- a/src/views/system/examples/demo/demo.data.ts
+++ b/src/views/system/examples/demo/demo.data.ts
@@ -1,182 +1,180 @@
-import {BasicColumn} from '/@/components/Table';
-import {FormSchema} from '/@/components/Table';
-import {render} from "/@/utils/common/renderUtils";
+import { BasicColumn } from '/@/components/Table';
+import { FormSchema } from '/@/components/Table';
+import { render } from '/@/utils/common/renderUtils';
 
 export const columns: BasicColumn[] = [
-    {
-        title: '姓名',
-        dataIndex: 'name',
-        width: 70,
-        align: 'left',
-    },
-    {
-        title: '关键词',
-        dataIndex: 'keyWord',
-        width: 30,
-    },
-    {
-        title: '打卡时间',
-        dataIndex: 'punchTime',
-        width: 40,
-    },
-    {
-        title: '工资',
-        dataIndex: 'salaryMoney',
-        width: 40
-    },
-    {
-        title: '奖金',
-        dataIndex: 'bonusMoney',
-        width: 40,
-    },
-    {
-        title: '性别',
-        dataIndex: 'sex',
-        customRender: ({record}) => {
-          return  render.renderDict(record.sex, 'sex')
-          // let v = record.sex ? (record.sex == '1' ? '男' : '女') : '';
-          // return h('span', v);
-        },
-        width: 20
-    },
-    {
-        title: '生日',
-        dataIndex: 'birthday',
-        width: 20
-    },
-    {
-        title: '邮箱',
-        dataIndex: 'email',
-        width: 20
-    },
-    {
-        title: '个人简介',
-        dataIndex: 'content',
-        width: 20
+  {
+    title: '姓名',
+    dataIndex: 'name',
+    width: 70,
+    align: 'left',
+  },
+  {
+    title: '关键词',
+    dataIndex: 'keyWord',
+    width: 30,
+  },
+  {
+    title: '打卡时间',
+    dataIndex: 'punchTime',
+    width: 40,
+  },
+  {
+    title: '工资',
+    dataIndex: 'salaryMoney',
+    width: 40,
+  },
+  {
+    title: '奖金',
+    dataIndex: 'bonusMoney',
+    width: 40,
+  },
+  {
+    title: '性别',
+    dataIndex: 'sex',
+    customRender: ({ record }) => {
+      return render.renderDict(record.sex, 'sex');
+      // let v = record.sex ? (record.sex == '1' ? '男' : '女') : '';
+      // return h('span', v);
     },
+    width: 20,
+  },
+  {
+    title: '生日',
+    dataIndex: 'birthday',
+    width: 20,
+  },
+  {
+    title: '邮箱',
+    dataIndex: 'email',
+    width: 20,
+  },
+  {
+    title: '个人简介',
+    dataIndex: 'content',
+    width: 20,
+  },
 ];
 
 export const searchFormSchema: FormSchema[] = [
-    {
-        field: 'name',
-        label: '姓名',
-        component: 'Input',
-        colProps: {span: 8},
-    },
-    {
-        field: 'birthday',
-        label: '生日',
-        component: 'RangePicker',
-        colProps: {span: 8},
-    },
-    {
-      field: 'age',
-      label: '年龄',
-      component: 'Input',
-      slot:"age",
-      colProps: {span: 8},
-    },
-    {
-        field: 'sex',
-        label: '性别',
-        colProps: {span: 8},
-        component: 'JDictSelectTag',
-        componentProps: {
-          dictCode:'sex',
-          placeholder:'请选择性别'
-        },
+  {
+    field: 'name',
+    label: '姓名',
+    component: 'Input',
+    colProps: { span: 8 },
+  },
+  {
+    field: 'birthday',
+    label: '生日',
+    component: 'RangePicker',
+    colProps: { span: 8 },
+  },
+  {
+    field: 'age',
+    label: '年龄',
+    component: 'Input',
+    slot: 'age',
+    colProps: { span: 8 },
+  },
+  {
+    field: 'sex',
+    label: '性别',
+    colProps: { span: 8 },
+    component: 'JDictSelectTag',
+    componentProps: {
+      dictCode: 'sex',
+      placeholder: '请选择性别',
     },
+  },
 ];
 
 export const formSchema: FormSchema[] = [
-    {
-        field: 'id',
-        label: 'id',
-        component: 'Input',
-        show:false
+  {
+    field: 'id',
+    label: 'id',
+    component: 'Input',
+    show: false,
+  },
+  {
+    field: 'name',
+    label: '名字',
+    component: 'Input',
+    required: true,
+    componentProps: {
+      placeholder: '请输入名字',
     },
-    {
-        field: 'name',
-        label: '名字',
-        component: 'Input',
-        required: true,
-        componentProps: {
-            placeholder: '请输入名字',
-        }
+  },
+  {
+    field: 'keyWord',
+    label: '关键词',
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入关键词',
     },
-    {
-        field: 'keyWord',
-        label: '关键词',
-        component: 'Input',
-        componentProps: {
-            placeholder: '请输入关键词',
-        }
+  },
+  {
+    field: 'punchTime',
+    label: '打卡时间',
+    component: 'DatePicker',
+    componentProps: {
+      showTime: true,
+      valueFormat: 'YYYY-MM-DD HH:mm:ss',
+      placeholder: '请选择打卡时间',
     },
-    {
-        field: 'punchTime',
-        label: '打卡时间',
-        component: 'DatePicker',
-        componentProps: {
-            showTime:true,
-            valueFormat:'YYYY-MM-DD HH:mm:ss',
-            placeholder: '请选择打卡时间',
-        }
+  },
+  {
+    field: 'salaryMoney',
+    label: '工资',
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入工资',
     },
-    {
-        field: 'salaryMoney',
-        label: '工资',
-        component: 'Input',
-        componentProps: {
-            placeholder: '请输入工资',
-        }
+  },
+  {
+    field: 'sex',
+    label: '性别',
+    component: 'JDictSelectTag',
+    defaultValue: '1',
+    componentProps: {
+      type: 'radio',
+      dictCode: 'sex',
+      placeholder: '请选择性别',
     },
-    {
-        field: 'sex',
-        label: '性别',
-        component: 'JDictSelectTag',
-        defaultValue: '1',
-        componentProps: {
-          type: 'radio',
-          dictCode:'sex',
-          placeholder:'请选择性别'
-        },
+  },
+  {
+    field: 'age',
+    label: '年龄',
+    component: 'InputNumber',
+    defaultValue: 1,
+    componentProps: {
+      placeholder: '请输入年龄',
     },
-    {
-        field: 'age',
-        label: '年龄',
-        component: 'InputNumber',
-        defaultValue: 1,
-        componentProps: {
-          placeholder: '请输入年龄',
-        },
+  },
+  {
+    field: 'birthday',
+    label: '生日',
+    component: 'DatePicker',
+    componentProps: {
+      showTime: true,
+      valueFormat: 'YYYY-MM-DD',
+      placeholder: '请选择生日',
     },
-    {
-        field: 'birthday',
-        label: '生日',
-        component: 'DatePicker',
-        componentProps: {
-          showTime:true,
-          valueFormat:'YYYY-MM-DD',
-          placeholder: '请选择生日',
-        },
+  },
+  {
+    field: 'email',
+    label: '邮箱',
+    component: 'Input',
+    rules: [{ required: false, type: 'email', message: '邮箱格式不正确', trigger: 'blur' }],
+    componentProps: {
+      placeholder: '请输入邮箱',
     },
-    {
-        field: 'email',
-        label: '邮箱',
-        component: 'Input',
-        rules:  [
-          { required: false, type: 'email', message: '邮箱格式不正确', trigger: 'blur' }
-        ],
-        componentProps: {
-          placeholder: '请输入邮箱',
-        },
-    },
-    {
-        field: 'content',
-        label: '个人简介',
-        component: 'InputTextArea',
-        componentProps: {
-          placeholder: '请输入个人简介',
-        },
+  },
+  {
+    field: 'content',
+    label: '个人简介',
+    component: 'InputTextArea',
+    componentProps: {
+      placeholder: '请输入个人简介',
     },
+  },
 ];
diff --git a/src/views/system/examples/demo/index.vue b/src/views/system/examples/demo/index.vue
index 3b20307..68e8dc8 100644
--- a/src/views/system/examples/demo/index.vue
+++ b/src/views/system/examples/demo/index.vue
@@ -1,262 +1,262 @@
 <template>
-    <div>
-        <!--自定义查询区域-->
-        <div class="jeecg-basic-table-form-container" @keyup.enter="searchQuery" v-if="customSearch">
-            <a-form ref="formRef" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol">
-                <a-row :gutter="24">
-                    <a-col :lg="8">
-                        <a-form-item label="用户名">
-                            <a-input placeholder="请输入名称模糊查询" v-model:value="queryParam.name"></a-input>
-                        </a-form-item>
-                    </a-col>
-                     <a-col :lg="8">
-                         <a-form-item label="年龄">
-                             <a-input placeholder="最小年龄" type="ge" v-model:value="queryParam.age_begin" style="width:calc(50% - 15px);"></a-input>
-                             <span>~</span>
-                             <a-input placeholder="最大年龄" type="le" v-model:value="queryParam.age_end" style="width:calc(50% - 15px);"></a-input>
-                         </a-form-item>
-                     </a-col>
-                    <template v-if="toggleSearchStatus">
-                        <a-col :lg="8">
-                            <a-form-item label="性别">
-                                <JDictSelectTag v-model:value="queryParam.sex" placeholder="请选择性别" dictCode="sex"/>
-                            </a-form-item>
-                        </a-col>
-                        <a-col :lg="8">
-                            <a-form-item label="选择用户">
-                                <JDictSelectTag v-model:value="queryParam.id" placeholder="请选择用户" dictCode="demo,name,id"/>
-                            </a-form-item>
-                        </a-col>
-                    </template>
-                    <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
-                        <a-col :lg="6">
-                          <a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button>
-                          <a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset" style="margin-left: 8px">重置</a-button>
-                          <a @click="toggleSearchStatus = !toggleSearchStatus" style="margin-left: 8px">
-                            {{ toggleSearchStatus ? '收起' : '展开' }}
-                            <Icon :icon="toggleSearchStatus ? 'ant-design:up-outlined' : 'ant-design:down-outlined'"/>
-                          </a>
-                        </a-col>
-                  </span>
-                </a-row>
-            </a-form>
-        </div>
-        <BasicTable @register="registerTable" :rowSelection="rowSelection"  :class="{'p-4':customSearch}">
-            <template #form-age="{ model, field }">
-                <a-input placeholder="最小年龄" type="ge"  v-model:value="min" style="width:calc(50% - 15px);" @change="ageChange(model, field )"></a-input>
-                <span>~</span>
-                <a-input placeholder="最大年龄" type="le"  v-model:value="max" style="width:calc(50% - 15px);" @change="ageChange(model, field )"></a-input>
-            </template>
-            <template #tableTitle>
-                <a-button preIcon="ant-design:plus-outlined" type="primary" @click="handleAdd">新增</a-button>
-                <a-upload name="file" :showUploadList="false" :customRequest="(file)=>handleImportXls(file,getImportUrl,reload)">
-                    <a-button preIcon="ant-design:import-outlined" type="primary">导入</a-button>
-                </a-upload>
-                <a-button preIcon="ant-design:export-outlined" type="primary" @click="handleExportXls('单表示例',getExportUrl)">导出</a-button>
-                <a-button preIcon="ant-design:filter" type="primary" @click="">高级查询?</a-button>
-                <a-button preIcon="ant-design:plus-outlined" type="primary" @click="openTab">打开Tab页</a-button>
-                <a-button preIcon="ant-design:retweet-outlined" type="primary" @click="customSearch=!customSearch">{{customSearch?'表单配置查询':'自定义查询'}}</a-button>
-                <a-button preIcon="ant-design:import-outlined" type="primary" @click="handleImport">弹窗导入</a-button>
-
-                <a-dropdown v-if="checkedKeys.length > 0">
-                    <template #overlay>
-                        <a-menu>
-                            <a-menu-item key="1" @click="batchHandleDelete">
-                                <Icon icon="ant-design:delete-outlined"></Icon>
-                                删除
-                            </a-menu-item>
-                        </a-menu>
-                    </template>
-                    <a-button>批量操作
-                        <Icon style="fontSize:12px" icon="ant-design:down-outlined"></Icon>
-                    </a-button>
-                </a-dropdown>
-
-            </template>
-            <template #action="{ record }">
-                <TableAction :actions="getActions(record)"/>
-            </template>
-        </BasicTable>
-        <DemoModal @register="registerModal" @success="reload"/>
-        <JImportModal @register="registerModal1" :url="getImportUrl" online/>
+  <div>
+    <!--自定义查询区域-->
+    <div class="jeecg-basic-table-form-container" @keyup.enter="searchQuery" v-if="customSearch">
+      <a-form ref="formRef" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol">
+        <a-row :gutter="24">
+          <a-col :lg="8">
+            <a-form-item label="用户名">
+              <a-input placeholder="请输入名称模糊查询" v-model:value="queryParam.name"></a-input>
+            </a-form-item>
+          </a-col>
+          <a-col :lg="8">
+            <a-form-item label="年龄">
+              <a-input placeholder="最小年龄" type="ge" v-model:value="queryParam.age_begin" style="width: calc(50% - 15px)"></a-input>
+              <span>~</span>
+              <a-input placeholder="最大年龄" type="le" v-model:value="queryParam.age_end" style="width: calc(50% - 15px)"></a-input>
+            </a-form-item>
+          </a-col>
+          <template v-if="toggleSearchStatus">
+            <a-col :lg="8">
+              <a-form-item label="性别">
+                <JDictSelectTag v-model:value="queryParam.sex" placeholder="请选择性别" dictCode="sex" />
+              </a-form-item>
+            </a-col>
+            <a-col :lg="8">
+              <a-form-item label="选择用户">
+                <JDictSelectTag v-model:value="queryParam.id" placeholder="请选择用户" dictCode="demo,name,id" />
+              </a-form-item>
+            </a-col>
+          </template>
+          <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
+            <a-col :lg="6">
+              <a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button>
+              <a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset" style="margin-left: 8px">重置</a-button>
+              <a @click="toggleSearchStatus = !toggleSearchStatus" style="margin-left: 8px">
+                {{ toggleSearchStatus ? '收起' : '展开' }}
+                <Icon :icon="toggleSearchStatus ? 'ant-design:up-outlined' : 'ant-design:down-outlined'" />
+              </a>
+            </a-col>
+          </span>
+        </a-row>
+      </a-form>
     </div>
+    <BasicTable @register="registerTable" :rowSelection="rowSelection" :class="{ 'p-4': customSearch }">
+      <template #form-age="{ model, field }">
+        <a-input placeholder="最小年龄" type="ge" v-model:value="min" style="width: calc(50% - 15px)" @change="ageChange(model, field)"></a-input>
+        <span>~</span>
+        <a-input placeholder="最大年龄" type="le" v-model:value="max" style="width: calc(50% - 15px)" @change="ageChange(model, field)"></a-input>
+      </template>
+      <template #tableTitle>
+        <a-button preIcon="ant-design:plus-outlined" type="primary" @click="handleAdd">新增</a-button>
+        <a-upload name="file" :showUploadList="false" :customRequest="(file) => handleImportXls(file, getImportUrl, reload)">
+          <a-button preIcon="ant-design:import-outlined" type="primary">导入</a-button>
+        </a-upload>
+        <a-button preIcon="ant-design:export-outlined" type="primary" @click="handleExportXls('单表示例', getExportUrl)">导出</a-button>
+        <a-button preIcon="ant-design:filter" type="primary" @click="">高级查询?</a-button>
+        <a-button preIcon="ant-design:plus-outlined" type="primary" @click="openTab">打开Tab页</a-button>
+        <a-button preIcon="ant-design:retweet-outlined" type="primary" @click="customSearch = !customSearch">{{ customSearch ? '表单配置查询' : '自定义查询' }}</a-button>
+        <a-button preIcon="ant-design:import-outlined" type="primary" @click="handleImport">弹窗导入</a-button>
+
+        <a-dropdown v-if="checkedKeys.length > 0">
+          <template #overlay>
+            <a-menu>
+              <a-menu-item key="1" @click="batchHandleDelete">
+                <Icon icon="ant-design:delete-outlined"></Icon>
+                删除
+              </a-menu-item>
+            </a-menu>
+          </template>
+          <a-button
+            >批量操作
+            <Icon style="fontsize: 12px" icon="ant-design:down-outlined"></Icon>
+          </a-button>
+        </a-dropdown>
+      </template>
+      <template #action="{ record }">
+        <TableAction :actions="getActions(record)" />
+      </template>
+    </BasicTable>
+    <DemoModal @register="registerModal" @success="reload" />
+    <JImportModal @register="registerModal1" :url="getImportUrl" online />
+  </div>
 </template>
 <script lang="ts" setup>
-    import {ref, unref, reactive,toRaw,watch} from 'vue';
-    import {BasicTable, useTable, TableAction} from '/@/components/Table';
-    import {useModal} from '/@/components/Modal';
-    import DemoModal from './DemoModal.vue';
-    import JImportModal from '/@/components/Form/src/jeecg/components/JImportModal.vue';
-    import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
-    import {useMessage} from "/@/hooks/web/useMessage";
-    import {useMethods} from '/@/hooks/system/useMethods';
-    import {getDemoList, deleteDemo, batchDeleteDemo, getExportUrl,getImportUrl} from './demo.api';
-    import {columns, searchFormSchema} from './demo.data';
-    import { useGo } from '/@/hooks/web/usePage';
-    import { router } from '/@/router';
-    
-    const go = useGo();
-    const checkedKeys = ref<Array<string | number>>([]);
-    const [registerModal, {openModal}] = useModal();
-    const [registerModal1, {openModal:openModal1}] = useModal();
-    const {handleExportXls,handleImportXls}= useMethods();
-    const min=ref();
-    const max=ref();
-    const [registerTable, {reload,setProps}] = useTable({
-        title: '单表示例',
-        api: getDemoList,
-        columns,
-        formConfig: {
-            labelWidth: 120,
-            schemas: searchFormSchema,
-            fieldMapToTime: [['birthday', ['birthday_begin', 'birthday_end'], 'YYYY-MM-DD HH:mm:ss']],
-            fieldMapToNumber: [['age', ['age_begin', 'age_end']]],
-            autoAdvancedCol:2,
-            actionColOptions: {
-                style: { textAlign: 'left' },
-            },
-        },
-        striped: true,
-        useSearchForm: true,
-        showTableSetting: true,
-        clickToRowSelect: false,
-        bordered: true,
-        showIndexColumn: false,
-        tableSetting: {fullScreen: true},
-        canResize: false,
-        rowKey: 'id',
-        actionColumn: {
-            width: 30,
-            title: '操作',
-            dataIndex: 'action',
-            slots: {customRender: 'action'},
-            fixed: undefined,
+  import { ref, unref, reactive, toRaw, watch } from 'vue';
+  import { BasicTable, useTable, TableAction } from '/@/components/Table';
+  import { useModal } from '/@/components/Modal';
+  import DemoModal from './DemoModal.vue';
+  import JImportModal from '/@/components/Form/src/jeecg/components/JImportModal.vue';
+  import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { useMethods } from '/@/hooks/system/useMethods';
+  import { getDemoList, deleteDemo, batchDeleteDemo, getExportUrl, getImportUrl } from './demo.api';
+  import { columns, searchFormSchema } from './demo.data';
+  import { useGo } from '/@/hooks/web/usePage';
+  import { router } from '/@/router';
+
+  const go = useGo();
+  const checkedKeys = ref<Array<string | number>>([]);
+  const [registerModal, { openModal }] = useModal();
+  const [registerModal1, { openModal: openModal1 }] = useModal();
+  const { handleExportXls, handleImportXls } = useMethods();
+  const min = ref();
+  const max = ref();
+  const [registerTable, { reload, setProps }] = useTable({
+    title: '单表示例',
+    api: getDemoList,
+    columns,
+    formConfig: {
+      labelWidth: 120,
+      schemas: searchFormSchema,
+      fieldMapToTime: [['birthday', ['birthday_begin', 'birthday_end'], 'YYYY-MM-DD HH:mm:ss']],
+      fieldMapToNumber: [['age', ['age_begin', 'age_end']]],
+      autoAdvancedCol: 2,
+      actionColOptions: {
+        style: { textAlign: 'left' },
+      },
+    },
+    striped: true,
+    useSearchForm: true,
+    showTableSetting: true,
+    clickToRowSelect: false,
+    bordered: true,
+    showIndexColumn: false,
+    tableSetting: { fullScreen: true },
+    canResize: false,
+    rowKey: 'id',
+    actionColumn: {
+      width: 30,
+      title: '操作',
+      dataIndex: 'action',
+      slots: { customRender: 'action' },
+      fixed: undefined,
+    },
+  });
+  /**
+   * 选择列配置
+   */
+  const rowSelection = {
+    type: 'checkbox',
+    columnWidth: 20,
+    selectedRowKeys: checkedKeys,
+    onChange: onSelectChange,
+  };
+
+  function handleImport() {
+    openModal1(true);
+  }
+
+  /**
+   * 操作列定义
+   * @param record
+   */
+  function getActions(record) {
+    return [
+      {
+        label: '编辑',
+        onClick: handleEdit.bind(null, record),
+      },
+      {
+        label: '删除',
+        popConfirm: {
+          title: '是否确认删除',
+          confirm: handleDelete.bind(null, record),
         },
+      },
+    ];
+  }
+
+  /**
+   * 选择事件
+   */
+  function onSelectChange(selectedRowKeys: (string | number)[]) {
+    checkedKeys.value = selectedRowKeys;
+  }
+
+  /**
+   * 新增事件
+   */
+  function handleAdd() {
+    openModal(true, {
+      isUpdate: false,
     });
-    /**
-     * 选择列配置
-     */
-    const rowSelection = {
-        type: 'checkbox',
-        columnWidth: 20,
-        selectedRowKeys: checkedKeys,
-        onChange: onSelectChange
-    }
-    
-    function handleImport(){
-        openModal1(true)
-    }
-   
-    /**
-     * 操作列定义
-     * @param record
-     */
-    function getActions(record) {
-        return [
-            {
-                label: '编辑',
-                onClick: handleEdit.bind(null, record),
-            },
-            {
-                label: '删除',
-                popConfirm: {
-                    title: '是否确认删除',
-                    confirm: handleDelete.bind(null, record),
-                },
-            },
-        ]
-    }
+  }
 
-    /**
-     * 选择事件
-     */
-    function onSelectChange(selectedRowKeys: (string | number)[]) {
-        checkedKeys.value = selectedRowKeys;
-    }
-
-    /**
-     * 新增事件
-     */
-    function handleAdd() {
-        openModal(true, {
-            isUpdate: false,
-        });
-    }
-
-    /**
-     * 编辑事件
-     */
-    function handleEdit(record) {
-        openModal(true, {
-            record,
-            isUpdate: true,
-        });
-    }
-
-    /**
-     * 删除事件
-     */
-    async function handleDelete(record) {
-        await deleteDemo({id: record.id}, reload);
-    }
-
-    /**
-     * 批量删除事件
-     */
-    async function batchHandleDelete() {
-        await batchDeleteDemo({ids: checkedKeys.value}, reload);
-    }
-    /**
-     * 年龄修改事件
-     */
-     function ageChange(model,field) {
-        model[field]=[unref(min),unref(max)];
-    }
-
-    /**
-     * 打开tab页面
-     */
-    function openTab(){
-        go(`/comp/jeecg/basic`);
-    }
-    //-----自定义查询----begin--------
-    const formElRef = ref();
-    const labelCol = reactive({
-        xs: {span: 24},
-        sm: {span: 7},
-    })
-    const wrapperCol = reactive({
-        xs: {span: 24},
-        sm: {span: 16},
-    })
-    const toggleSearchStatus = ref(false);
-    const customSearch = ref(false);
-    const queryParam = reactive({
-        name: '',
-        age_begin: '',
-        age_end: '',
-        sex: '',
-        id: '',
+  /**
+   * 编辑事件
+   */
+  function handleEdit(record) {
+    openModal(true, {
+      record,
+      isUpdate: true,
     });
-    watch(customSearch, () => {
-        setProps({useSearchForm:!unref(customSearch)});
-    });
-    function searchQuery(){
-        setProps({searchInfo:toRaw(queryParam)});
-        reload()
-    }
-    function searchReset(){
-        Object.assign(queryParam,{ name: '',age_begin: '',age_end: '',sex: '',id: ''});
-        reload();
-    }
-    //自定义查询----end--------- 
+  }
+
+  /**
+   * 删除事件
+   */
+  async function handleDelete(record) {
+    await deleteDemo({ id: record.id }, reload);
+  }
+
+  /**
+   * 批量删除事件
+   */
+  async function batchHandleDelete() {
+    await batchDeleteDemo({ ids: checkedKeys.value }, reload);
+  }
+  /**
+   * 年龄修改事件
+   */
+  function ageChange(model, field) {
+    model[field] = [unref(min), unref(max)];
+  }
+
+  /**
+   * 打开tab页面
+   */
+  function openTab() {
+    go(`/comp/jeecg/basic`);
+  }
+  //-----自定义查询----begin--------
+  const formElRef = ref();
+  const labelCol = reactive({
+    xs: { span: 24 },
+    sm: { span: 7 },
+  });
+  const wrapperCol = reactive({
+    xs: { span: 24 },
+    sm: { span: 16 },
+  });
+  const toggleSearchStatus = ref(false);
+  const customSearch = ref(false);
+  const queryParam = reactive({
+    name: '',
+    age_begin: '',
+    age_end: '',
+    sex: '',
+    id: '',
+  });
+  watch(customSearch, () => {
+    setProps({ useSearchForm: !unref(customSearch) });
+  });
+  function searchQuery() {
+    setProps({ searchInfo: toRaw(queryParam) });
+    reload();
+  }
+  function searchReset() {
+    Object.assign(queryParam, { name: '', age_begin: '', age_end: '', sex: '', id: '' });
+    reload();
+  }
+  //自定义查询----end---------
 </script>
 <style lang="less" scoped>
-     .jeecg-basic-table-form-container {
-         .table-page-search-submitButtons {
-             display: block;
-             margin-bottom: 24px;
-             white-space: nowrap;
-         }
-     }
+  .jeecg-basic-table-form-container {
+    .table-page-search-submitButtons {
+      display: block;
+      margin-bottom: 24px;
+      white-space: nowrap;
+    }
+  }
 </style>
diff --git a/src/views/system/fillRule/FillRuleModal.vue b/src/views/system/fillRule/FillRuleModal.vue
index 918f889..6dec588 100644
--- a/src/views/system/fillRule/FillRuleModal.vue
+++ b/src/views/system/fillRule/FillRuleModal.vue
@@ -1,66 +1,65 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit" :width="800" destroyOnClose>
-        <BasicForm @register="registerForm"/>
-    </BasicModal>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit" :width="800" destroyOnClose>
+    <BasicForm @register="registerForm" />
+  </BasicModal>
 </template>
 
 <script lang="ts" setup>
-    import { ref, computed, unref } from 'vue';
-    import { BasicModal, useModalInner } from '/@/components/Modal';
-    import { BasicForm, useForm } from '/@/components/Form/index';
-    import { formSchema } from './fill.rule.data'
-    import { saveFillRule, updateFillRule } from './fill.rule.api';
+  import { ref, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { formSchema } from './fill.rule.data';
+  import { saveFillRule, updateFillRule } from './fill.rule.api';
 
-    //设置标题
-    const title = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
+  //设置标题
+  const title = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
 
-    // 声明Emits
-    const emit = defineEmits(['register','success']);
-    const isUpdate = ref(true);
+  // 声明Emits
+  const emit = defineEmits(['register', 'success']);
+  const isUpdate = ref(true);
 
-    //表单配置
-    const [registerForm, { resetFields, setFieldsValue, validate, getFieldsValue }] = useForm({
-        schemas: formSchema,
-        showActionButtonGroup: false,
-        baseColProps: { span:12 },
-    });
+  //表单配置
+  const [registerForm, { resetFields, setFieldsValue, validate, getFieldsValue }] = useForm({
+    schemas: formSchema,
+    showActionButtonGroup: false,
+    baseColProps: { span: 12 },
+  });
 
-    //表单赋值
-    const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-        //重置表单
-        await resetFields();
-        setModalProps({confirmLoading: false});
-        isUpdate.value = !!data?.isUpdate;
-        if (unref(isUpdate)) {
-            //表单赋值
-            await setFieldsValue({
-                ...data.record,
-            });
-        }
-    });
-
-    //表单提交事件
-    async function handleSubmit() {
-        try {
-            let formValue = await validate();
-            setModalProps({confirmLoading: true});
-            if(isUpdate.value){
-                let allFieldsValue = getFieldsValue();
-                // 编辑页面 如果表单没有父级下拉框 则提交时候 validate方法不返该值 需要手动设置
-                if(!formValue.parentId && allFieldsValue.parentId){
-                    formValue.parentId = allFieldsValue.parentId
-                }
-                await updateFillRule(formValue)
-            }else{
-                await saveFillRule(formValue);
-            }
-            //关闭弹窗
-            closeModal();
-            //刷新列表
-            emit('success');
-        } finally {
-            setModalProps({confirmLoading: false});
-        }
+  //表单赋值
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    //重置表单
+    await resetFields();
+    setModalProps({ confirmLoading: false });
+    isUpdate.value = !!data?.isUpdate;
+    if (unref(isUpdate)) {
+      //表单赋值
+      await setFieldsValue({
+        ...data.record,
+      });
     }
-</script>
+  });
 
+  //表单提交事件
+  async function handleSubmit() {
+    try {
+      let formValue = await validate();
+      setModalProps({ confirmLoading: true });
+      if (isUpdate.value) {
+        let allFieldsValue = getFieldsValue();
+        // 编辑页面 如果表单没有父级下拉框 则提交时候 validate方法不返该值 需要手动设置
+        if (!formValue.parentId && allFieldsValue.parentId) {
+          formValue.parentId = allFieldsValue.parentId;
+        }
+        await updateFillRule(formValue);
+      } else {
+        await saveFillRule(formValue);
+      }
+      //关闭弹窗
+      closeModal();
+      //刷新列表
+      emit('success');
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
+  }
+</script>
diff --git a/src/views/system/fillRule/fill.rule.api.ts b/src/views/system/fillRule/fill.rule.api.ts
index b970bfa..1348a12 100644
--- a/src/views/system/fillRule/fill.rule.api.ts
+++ b/src/views/system/fillRule/fill.rule.api.ts
@@ -2,14 +2,14 @@ import { defHttp } from '/@/utils/http/axios';
 import { Modal } from 'ant-design-vue';
 
 enum Api {
-    list = '/sys/fillRule/list',
-    test = '/sys/fillRule/testFillRule',
-    save = '/sys/fillRule/add',
-    edit = '/sys/fillRule/edit',
-    delete = '/sys/fillRule/delete',
-    deleteBatch = '/sys/fillRule/deleteBatch',
-    exportXls = '/sys/fillRule/exportXls',
-    importExcel = '/sys/fillRule/importExcel'
+  list = '/sys/fillRule/list',
+  test = '/sys/fillRule/testFillRule',
+  save = '/sys/fillRule/add',
+  edit = '/sys/fillRule/edit',
+  delete = '/sys/fillRule/delete',
+  deleteBatch = '/sys/fillRule/deleteBatch',
+  exportXls = '/sys/fillRule/exportXls',
+  importExcel = '/sys/fillRule/importExcel',
 }
 
 /**
@@ -26,8 +26,8 @@ export const importUrl = Api.importExcel;
  * @param params
  */
 export const getFillRuleList = (params) => {
-    return defHttp.get({url: Api.list, params});
-}
+  return defHttp.get({ url: Api.list, params });
+};
 
 /**
  * 删除
@@ -35,50 +35,49 @@ export const getFillRuleList = (params) => {
  * @param handleSuccess
  */
 export const deleteFillRule = (params, handleSuccess) => {
-    return defHttp.delete({url: Api.delete, data: params}, {joinParamsToUrl: true}).then(() => {
-        handleSuccess();
-    });
-}
+  return defHttp.delete({ url: Api.delete, data: params }, { joinParamsToUrl: true }).then(() => {
+    handleSuccess();
+  });
+};
 
 /**
  * 批量删除
  * @param params
  */
 export const batchDeleteFillRule = (params, handleSuccess) => {
-    Modal.confirm({
-        title: '确认删除',
-        content: '是否删除选中数据',
-        okText: '确认',
-        cancelText: '取消',
-        onOk: () => {
-            return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
-                handleSuccess();
-            });
-        }
-    });
-}
+  Modal.confirm({
+    title: '确认删除',
+    content: '是否删除选中数据',
+    okText: '确认',
+    cancelText: '取消',
+    onOk: () => {
+      return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => {
+        handleSuccess();
+      });
+    },
+  });
+};
 
 /**
  * 规则功能测试
  * @param params
  */
 export const handleTest = (params) => {
-    return defHttp.get({url: Api.test, params}, {isTransformResponse: false});
-}
-
+  return defHttp.get({ url: Api.test, params }, { isTransformResponse: false });
+};
 
 /**
  * 保存
  * @param params
  */
 export const saveFillRule = (params) => {
-    return defHttp.post({url: Api.save, params});
-}
+  return defHttp.post({ url: Api.save, params });
+};
 
 /**
  * 更新
  * @param params
  */
 export const updateFillRule = (params) => {
-    return defHttp.put({url: Api.edit, params});
-}
+  return defHttp.put({ url: Api.edit, params });
+};
diff --git a/src/views/system/fillRule/fill.rule.data.ts b/src/views/system/fillRule/fill.rule.data.ts
index 7f1bd97..4e07fd1 100644
--- a/src/views/system/fillRule/fill.rule.data.ts
+++ b/src/views/system/fillRule/fill.rule.data.ts
@@ -1,109 +1,109 @@
 import { BasicColumn, FormSchema } from '/@/components/Table';
-import {duplicateCheck} from "/@/views/system/user/user.api";
+import { duplicateCheck } from '/@/views/system/user/user.api';
 
 export const columns: BasicColumn[] = [
-    {
-        title: '规则名称',
-        dataIndex: 'ruleName',
-        width: 200,
-        align: 'center',
-    },
-    {
-        title: '规则编码',
-        dataIndex: 'ruleCode',
-        width: 200,
-        align: 'center',
-    },
-    {
-        title: '规则实现类',
-        dataIndex: 'ruleClass',
-        width: 300,
-        align: 'center',
-    },
-    {
-        title: '规则参数',
-        dataIndex: 'ruleParams',
-        width: 200,
-        align: 'center'
-    }
+  {
+    title: '规则名称',
+    dataIndex: 'ruleName',
+    width: 200,
+    align: 'center',
+  },
+  {
+    title: '规则编码',
+    dataIndex: 'ruleCode',
+    width: 200,
+    align: 'center',
+  },
+  {
+    title: '规则实现类',
+    dataIndex: 'ruleClass',
+    width: 300,
+    align: 'center',
+  },
+  {
+    title: '规则参数',
+    dataIndex: 'ruleParams',
+    width: 200,
+    align: 'center',
+  },
 ];
 
 export const searchFormSchema: FormSchema[] = [
-    {
-        field: 'ruleName',
-        label: '规则名称',
-        component: 'Input',
-        colProps: { span: 6 },
-    },
-    {
-        field: 'ruleCode',
-        label: '规则编码',
-        component: 'Input',
-        colProps: { span: 6 },
-    },
+  {
+    field: 'ruleName',
+    label: '规则名称',
+    component: 'Input',
+    colProps: { span: 6 },
+  },
+  {
+    field: 'ruleCode',
+    label: '规则编码',
+    component: 'Input',
+    colProps: { span: 6 },
+  },
 ];
 
-
 export const formSchema: FormSchema[] = [
-    {
-        label: '',
-        field: 'id',
-        component: 'Input',
-        show:false
+  {
+    label: '',
+    field: 'id',
+    component: 'Input',
+    show: false,
+  },
+  {
+    field: 'ruleName',
+    label: '规则名称',
+    component: 'Input',
+    required: true,
+    colProps: { span: 24 },
+  },
+  {
+    field: 'ruleCode',
+    label: '规则编码',
+    component: 'Input',
+    colProps: { span: 24 },
+    dynamicDisabled: ({ values }) => {
+      return !!values.id;
     },
-    {
-        field: 'ruleName',
-        label: '规则名称',
-        component: 'Input',
-        required: true,
-        colProps: { span: 24 }
-    },
-    {
-        field: 'ruleCode',
-        label: '规则编码',
-        component: 'Input',
-        colProps: { span: 24 },
-        dynamicDisabled: ({values}) => {
-            return !!values.id;
+    dynamicRules: ({ model }) => {
+      return [
+        {
+          required: true,
+          validator: (_, value) => {
+            return new Promise((resolve, reject) => {
+              if (!value) {
+                return reject('请输入规则编码！');
+              }
+              let params = {
+                tableName: 'sys_fill_rule',
+                fieldName: 'rule_code',
+                fieldVal: value,
+                dataId: model.id,
+              };
+              duplicateCheck(params)
+                .then((res) => {
+                  res.success ? resolve() : reject('规则编码已存在!');
+                })
+                .catch((err) => {
+                  reject(err.message || '校验失败');
+                });
+            });
+          },
         },
-        dynamicRules: ({ model }) => {
-            return [
-                {
-                    required: true,
-                    validator: (_, value) => {
-                        return new Promise((resolve, reject) => {
-                            if (!value) {
-                                return reject('请输入规则编码！');
-                            }
-                            let params = {
-                                tableName: "sys_fill_rule",
-                                fieldName: "rule_code",
-                                fieldVal: value,
-                                dataId: model.id,
-                            };
-                            duplicateCheck(params)
-                                .then((res) => {
-                                    res.success ? resolve() : reject('规则编码已存在!');
-                                }).catch((err) => {
-                                reject(err.message || '校验失败');
-                            });
-                        });
-                    },
-                },
-            ];
-        }
+      ];
     },
-    {
-        field: 'ruleClass',
-        label: '规则实现类',
-        component: 'Input',
-        required: true,
-        colProps: { span: 24 }
-    },
-    {
-        field: 'ruleParams',
-        label: '规则参数',
-        colProps: { span: 24 },
-        component: 'JAddInput'
-    },
-]
+  },
+  {
+    field: 'ruleClass',
+    label: '规则实现类',
+    component: 'Input',
+    required: true,
+    colProps: { span: 24 },
+  },
+  {
+    field: 'ruleParams',
+    label: '规则参数',
+    colProps: { span: 24 },
+    component: 'JAddInput',
+  },
+];
diff --git a/src/views/system/fillRule/index.vue b/src/views/system/fillRule/index.vue
index dbf9b4f..93d5e1c 100644
--- a/src/views/system/fillRule/index.vue
+++ b/src/views/system/fillRule/index.vue
@@ -1,149 +1,146 @@
 <template>
-    <div :class="prefixCls">
-        <BasicTable @register="registerTable" :rowSelection="rowSelection">
-            <!--插槽:table标题-->
-            <template #tableTitle>
-                <a-button preIcon="ant-design:plus-outlined" type="primary" @click="handleAdd">新增</a-button>
-                <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
-                <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
-                <a-dropdown v-if="selectedRowKeys.length>0">
-                    <template #overlay>
-                        <a-menu>
-                            <a-menu-item key="1" @click="batchHandleDelete">
-                                <Icon icon="ant-design:delete-outlined"></Icon>
-                                <span>删除</span>
-                            </a-menu-item>
-                        </a-menu>
-                    </template>
-                    <a-button>
-                        <span>批量操作</span>
-                        <Icon icon="mdi:chevron-down"></Icon>
-                    </a-button>
-                </a-dropdown>
-            </template>
+  <div :class="prefixCls">
+    <BasicTable @register="registerTable" :rowSelection="rowSelection">
+      <!--插槽:table标题-->
+      <template #tableTitle>
+        <a-button preIcon="ant-design:plus-outlined" type="primary" @click="handleAdd">新增</a-button>
+        <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
+        <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
+        <a-dropdown v-if="selectedRowKeys.length > 0">
+          <template #overlay>
+            <a-menu>
+              <a-menu-item key="1" @click="batchHandleDelete">
+                <Icon icon="ant-design:delete-outlined"></Icon>
+                <span>删除</span>
+              </a-menu-item>
+            </a-menu>
+          </template>
+          <a-button>
+            <span>批量操作</span>
+            <Icon icon="mdi:chevron-down"></Icon>
+          </a-button>
+        </a-dropdown>
+      </template>
 
-            <!--操作栏-->
-            <template #action="{ record }">
-                <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)"/>
-            </template>
-        </BasicTable>
-        <FillRuleModal @register="registerModal" @success="reload"/>
-    </div>
+      <!--操作栏-->
+      <template #action="{ record }">
+        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
+      </template>
+    </BasicTable>
+    <FillRuleModal @register="registerModal" @success="reload" />
+  </div>
 </template>
 
 <script name="system-fillrule" lang="ts" setup>
-    import { BasicTable, TableAction } from '/@/components/Table';
-    import { useListPage } from '/@/hooks/system/useListPage'
-    import { getFillRuleList, exportUrl, importUrl, deleteFillRule, batchDeleteFillRule, handleTest } from "/@/views/system/fillRule/fill.rule.api";
-    import { columns, searchFormSchema } from "/@/views/system/fillRule/fill.rule.data";
-    import {useModal} from "/@/components/Modal";
-    import {ActionItem} from "/@/components/Table";
-    const [ registerModal, {openModal} ] = useModal();
-    import FillRuleModal from '/@/views/system/fillRule/FillRuleModal.vue'
+  import { BasicTable, TableAction } from '/@/components/Table';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import { getFillRuleList, exportUrl, importUrl, deleteFillRule, batchDeleteFillRule, handleTest } from '/@/views/system/fillRule/fill.rule.api';
+  import { columns, searchFormSchema } from '/@/views/system/fillRule/fill.rule.data';
+  import { useModal } from '/@/components/Modal';
+  import { ActionItem } from '/@/components/Table';
+  const [registerModal, { openModal }] = useModal();
+  import FillRuleModal from '/@/views/system/fillRule/FillRuleModal.vue';
 
-    // 列表页面公共参数、方法
-    const { prefixCls, tableContext, createMessage, createSuccessModal, onExportXls,onImportXls } = useListPage({
-        designScope: 'fill-rule',
-        tableProps: {
-            title: '填值规则管理页面',
-            api: getFillRuleList,
-            columns: columns,
-            showIndexColumn: true,
-            formConfig: {
-                schemas: searchFormSchema,
-            }
+  // 列表页面公共参数、方法
+  const { prefixCls, tableContext, createMessage, createSuccessModal, onExportXls, onImportXls } = useListPage({
+    designScope: 'fill-rule',
+    tableProps: {
+      title: '填值规则管理页面',
+      api: getFillRuleList,
+      columns: columns,
+      showIndexColumn: true,
+      formConfig: {
+        schemas: searchFormSchema,
+      },
+    },
+    exportConfig: {
+      url: exportUrl,
+      name: '填值规则列表',
+    },
+    importConfig: {
+      url: importUrl,
+      success: () => reload(),
+    },
+  });
+  // 注册 ListTable
+  const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;
+
+  /**
+   * 新增事件
+   */
+  function handleAdd() {
+    openModal(true, {
+      isUpdate: false,
+    });
+  }
+
+  /**
+   * 编辑事件
+   */
+  function handleEdit(record) {
+    console.log('record....', record);
+    openModal(true, {
+      record,
+      isUpdate: true,
+    });
+  }
+
+  /**
+   * 删除事件
+   */
+  async function handleDelete(record) {
+    console.log(12345, record);
+    await deleteFillRule({ id: record.id }, reload);
+  }
+
+  /**
+   * 批量删除事件
+   */
+  async function batchHandleDelete() {
+    await batchDeleteFillRule({ ids: selectedRowKeys.value }, () => {
+      selectedRowKeys.value = [];
+      reload();
+    });
+  }
+
+  /**
+   * 功能测试
+   */
+  function testRule(record) {
+    let params = { ruleCode: record.ruleCode };
+    handleTest(params).then((res) => {
+      if (res.success) {
+        createSuccessModal({
+          title: '填值规则功能测试',
+          content: '生成结果：' + res.result,
+        });
+      } else {
+        createMessage.warn(res.message);
+      }
+    });
+  }
+
+  /**
+   * 编辑
+   */
+  function getTableAction(record): ActionItem[] {
+    return [{ label: '编辑', onClick: handleEdit.bind(null, record) }];
+  }
+
+  /**
+   * 下拉操作栏
+   */
+  function getDropDownAction(record): ActionItem[] {
+    return [
+      { label: '功能测试', onClick: testRule.bind(null, record) },
+      {
+        label: '删除',
+        color: 'error',
+        popConfirm: {
+          title: '确认要删除吗？',
+          confirm: handleDelete.bind(null, record),
         },
-        exportConfig:{
-            url: exportUrl,
-            name: '填值规则列表',
-        },
-        importConfig:{
-            url: importUrl,
-            success: () => reload(),
-        }
-
-    })
-    // 注册 ListTable
-    const [registerTable, { reload }, {rowSelection, selectedRowKeys}] = tableContext
-
-    /**
-     * 新增事件
-     */
-    function handleAdd() {
-        openModal(true, {
-            isUpdate: false,
-        });
-    }
-
-    /**
-     * 编辑事件
-     */
-    function handleEdit(record) {
-        console.log('record....', record)
-        openModal(true, {
-            record,
-            isUpdate: true,
-        });
-    }
-
-    /**
-     * 删除事件
-     */
-    async function handleDelete(record) {
-        console.log(12345, record)
-        await deleteFillRule({id: record.id}, reload);
-    }
-
-    /**
-     * 批量删除事件
-     */
-    async function batchHandleDelete() {
-        await batchDeleteFillRule({ids: selectedRowKeys.value}, ()=>{
-            selectedRowKeys.value = []
-            reload()
-        });
-    }
-
-    /**
-     * 功能测试
-     */
-    function testRule(record) {
-        let params = { ruleCode: record.ruleCode}
-        handleTest(params).then(res=>{
-            if (res.success) {
-                createSuccessModal({
-                    title: '填值规则功能测试',
-                    content: '生成结果：' + res.result
-                })
-            } else {
-                createMessage.warn(res.message)
-            }
-        })
-    }
-
-    /**
-     * 编辑
-     */
-    function getTableAction(record): ActionItem[] {
-        return [
-            { label: '编辑', onClick: handleEdit.bind(null, record) },
-        ]
-    }
-
-    /**
-     * 下拉操作栏
-     */
-    function getDropDownAction(record): ActionItem[] {
-        return [
-            { label: '功能测试', onClick: testRule.bind(null, record) },
-            {
-                label: '删除',
-                color: 'error',
-                popConfirm: {
-                    title: '确认要删除吗？',
-                    confirm: handleDelete.bind(null, record),
-                },
-            }
-        ]
-    }
+      },
+    ];
+  }
 </script>
diff --git a/src/views/system/menu/DataRuleList.vue b/src/views/system/menu/DataRuleList.vue
index 72ae3be..e3731fb 100644
--- a/src/views/system/menu/DataRuleList.vue
+++ b/src/views/system/menu/DataRuleList.vue
@@ -5,30 +5,30 @@
         <a-button type="primary" @click="handleCreate"> 新增</a-button>
       </template>
       <template #action="{ record }">
-        <TableAction :actions="getTableAction(record)"/>
+        <TableAction :actions="getTableAction(record)" />
       </template>
     </BasicTable>
   </BasicDrawer>
-  <DataRuleModal @register="registerModal" @success="reload" :permissionId="permissionId"/>
+  <DataRuleModal @register="registerModal" @success="reload" :permissionId="permissionId" />
 </template>
 <script lang="ts" setup>
-  import {ref,unref} from 'vue';
-  import {BasicDrawer, useDrawerInner} from '/@/components/Drawer';
-  import {BasicTable, useTable, TableAction} from '/@/components/Table';
-  import {useModal} from '/@/components/Modal';
+  import { ref, unref } from 'vue';
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
+  import { BasicTable, useTable, TableAction } from '/@/components/Table';
+  import { useModal } from '/@/components/Modal';
   import DataRuleModal from './DataRuleModal.vue';
-  import {dataRuleColumns, dataRuleSearchFormSchema} from './menu.data';
-  import {dataRuleList,deleteRule} from './menu.api';
+  import { dataRuleColumns, dataRuleSearchFormSchema } from './menu.data';
+  import { dataRuleList, deleteRule } from './menu.api';
   import { ColEx } from '/@/components/Form/src/types';
   import { useAdapt } from '/@/hooks/system/useAutoAdapt.ts';
   const permissionId = ref('');
-  const {width}= useAdapt({def:'650px',xl:'650px',lg:'650px'});
+  const { width } = useAdapt({ def: '650px', xl: '650px', lg: '650px' });
   //权限规则model
-  const [registerModal, {openModal}] = useModal();
+  const [registerModal, { openModal }] = useModal();
   const [registerDrawer] = useDrawerInner(async (data) => {
-    permissionId.value = data.id
-    setProps({searchInfo:{permissionId:unref(permissionId)}});
-    reload()
+    permissionId.value = data.id;
+    setProps({ searchInfo: { permissionId: unref(permissionId) } });
+    reload();
   });
   // 自适应列配置
   const adaptiveColProps: Partial<ColEx> = {
@@ -38,16 +38,16 @@
     lg: 12, // ≥992px
     xl: 8, // ≥1200px
     xxl: 8, // ≥1600px
-  }
-  const [registerTable, {reload,setProps}] = useTable({
+  };
+  const [registerTable, { reload, setProps }] = useTable({
     api: dataRuleList,
     columns: dataRuleColumns,
-    size:'small',
+    size: 'small',
     formConfig: {
       baseColProps: adaptiveColProps,
-      labelAlign:"right",
+      labelAlign: 'right',
       labelCol: {
-        offset:1,
+        offset: 1,
         xs: 24,
         sm: 24,
         md: 24,
@@ -57,7 +57,7 @@
       },
       wrapperCol: {},
       schemas: dataRuleSearchFormSchema,
-      autoSubmitOnEnter:true,
+      autoSubmitOnEnter: true,
     },
     striped: true,
     useSearchForm: true,
@@ -69,7 +69,7 @@
       width: 100,
       title: '操作',
       dataIndex: 'action',
-      slots: {customRender: 'action'},
+      slots: { customRender: 'action' },
       fixed: undefined,
     },
   });
@@ -97,7 +97,7 @@
    * 删除
    */
   async function handleDelete(record) {
-    await deleteRule({id: record.id}, reload);
+    await deleteRule({ id: record.id }, reload);
   }
 
   /**
@@ -115,7 +115,7 @@
           title: '是否确认删除',
           confirm: handleDelete.bind(null, record),
         },
-      }
+      },
     ];
   }
 </script>
diff --git a/src/views/system/menu/DataRuleModal.vue b/src/views/system/menu/DataRuleModal.vue
index 7230398..1daa5a8 100644
--- a/src/views/system/menu/DataRuleModal.vue
+++ b/src/views/system/menu/DataRuleModal.vue
@@ -1,28 +1,28 @@
 <template>
-  <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit"  width="700px">
-    <BasicForm @register="registerForm"/>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" width="700px">
+    <BasicForm @register="registerForm" />
   </BasicModal>
 </template>
 <script lang="ts" setup>
-  import {defineProps,ref, computed, unref} from 'vue';
-  import {BasicModal, useModalInner} from '/@/components/Modal';
-  import {BasicForm, useForm} from '/@/components/Form/index';
-  import {dataRuleFormSchema} from './menu.data';
-  import {saveOrUpdateRule} from './menu.api';
+  import { defineProps, ref, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { dataRuleFormSchema } from './menu.data';
+  import { saveOrUpdateRule } from './menu.api';
   // 声明Emits
-  const emit = defineEmits(['success','register']);
-  const props = defineProps({permissionId: String})
+  const emit = defineEmits(['success', 'register']);
+  const props = defineProps({ permissionId: String });
   const isUpdate = ref(true);
   //表单配置
-  const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
+  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
     schemas: dataRuleFormSchema,
-    showActionButtonGroup: false
+    showActionButtonGroup: false,
   });
   //表单赋值
-  const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
     //重置表单
     await resetFields();
-    setModalProps({confirmLoading: false});
+    setModalProps({ confirmLoading: false });
     isUpdate.value = !!data?.isUpdate;
     if (unref(isUpdate)) {
       //表单赋值
@@ -39,16 +39,16 @@
   async function handleSubmit() {
     try {
       const values = await validate();
-      values.permissionId = props.permissionId
-      setModalProps({confirmLoading: true});
+      values.permissionId = props.permissionId;
+      setModalProps({ confirmLoading: true });
       //提交表单
-      await saveOrUpdateRule(values,isUpdate.value);
+      await saveOrUpdateRule(values, isUpdate.value);
       //关闭弹窗
       closeModal();
       //刷新列表
       emit('success');
     } finally {
-      setModalProps({confirmLoading: false});
+      setModalProps({ confirmLoading: false });
     }
   }
 </script>
diff --git a/src/views/system/menu/MenuDrawer.vue b/src/views/system/menu/MenuDrawer.vue
index 4e47529..412cb8c 100644
--- a/src/views/system/menu/MenuDrawer.vue
+++ b/src/views/system/menu/MenuDrawer.vue
@@ -1,80 +1,83 @@
 <template>
   <BasicDrawer v-bind="$attrs" @register="registerDrawer" showFooter :width="width" :title="getTitle" @ok="handleSubmit">
-    <BasicForm @register="registerForm" class="menuForm"/>
+    <BasicForm @register="registerForm" class="menuForm" />
   </BasicDrawer>
 </template>
 <script lang="ts" setup>
-  import {ref, computed, unref,useAttrs} from 'vue';
-  import {BasicForm, useForm} from '/@/components/Form/index';
-  import {formSchema, ComponentTypes} from './menu.data';
-  import {BasicDrawer, useDrawerInner} from '/@/components/Drawer';
-  import {list, saveOrUpdateMenu} from './menu.api';
+  import { ref, computed, unref, useAttrs } from 'vue';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { formSchema, ComponentTypes } from './menu.data';
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
+  import { list, saveOrUpdateMenu } from './menu.api';
   import { useAdapt } from '/@/hooks/system/useAutoAdapt.ts';
   // 声明Emits
   const emit = defineEmits(['success', 'register']);
-  const {width}= useAdapt();
-  const attrs = useAttrs()
+  const { width } = useAdapt();
+  const attrs = useAttrs();
   const isUpdate = ref(true);
   const menuType = ref(0);
   const isButton = (type) => type === 2;
-  const [registerForm, {setProps,resetFields, setFieldsValue, updateSchema, validate,clearValidate}] = useForm({
+  const [registerForm, { setProps, resetFields, setFieldsValue, updateSchema, validate, clearValidate }] = useForm({
     labelCol: {
-        md: {span: 4},
-        sm: {span: 6},
+      md: { span: 4 },
+      sm: { span: 6 },
     },
     wrapperCol: {
-        md: {span: 20},
-        sm: {span: 18},
-    }, 
+      md: { span: 20 },
+      sm: { span: 18 },
+    },
     schemas: formSchema,
-    showActionButtonGroup: false
+    showActionButtonGroup: false,
   });
 
-  const [registerDrawer, {setDrawerProps, closeDrawer}] = useDrawerInner(async (data) => {
-    await resetFields()
-    setDrawerProps({confirmLoading: false});
+  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
+    await resetFields();
+    setDrawerProps({ confirmLoading: false });
     isUpdate.value = !!data?.isUpdate;
     menuType.value = data?.record?.menuType;
 
-   //获取下拉树信息
+    //获取下拉树信息
     const treeData = await list();
-    updateSchema([{
-      field: 'parentId',
-      componentProps: {treeData},
-    },{
-      field: 'name',
-      label: isButton(unref(menuType)) ? '按钮/权限' : '菜单名称'
-    },{
-      field: 'url',
-      required: !isButton(unref(menuType))
-    }]);
+    updateSchema([
+      {
+        field: 'parentId',
+        componentProps: { treeData },
+      },
+      {
+        field: 'name',
+        label: isButton(unref(menuType)) ? '按钮/权限' : '菜单名称',
+      },
+      {
+        field: 'url',
+        required: !isButton(unref(menuType)),
+      },
+    ]);
 
     // 无论新增还是编辑，都可以设置表单值
     if (typeof data.record === 'object') {
-      let values = { ...data.record }
-      setFieldsValue(values)
+      let values = { ...data.record };
+      setFieldsValue(values);
     }
     //禁用表单
-    setProps({disabled:!attrs.showFooter})
+    setProps({ disabled: !attrs.showFooter });
   });
   //获取弹窗标题
   const getTitle = computed(() => (!unref(isUpdate) ? '新增菜单' : '编辑菜单'));
   //提交事件
   async function handleSubmit() {
     try {
-      const values = await validate()
+      const values = await validate();
       // iframe兼容
       if (ComponentTypes.IFrame === values.component) {
-        values.component = values.frameSrc
+        values.component = values.frameSrc;
       }
-      setDrawerProps({confirmLoading: true});
+      setDrawerProps({ confirmLoading: true });
       //提交表单
       await saveOrUpdateMenu(values, unref(isUpdate));
       closeDrawer();
       emit('success');
     } finally {
-      setDrawerProps({confirmLoading: false});
+      setDrawerProps({ confirmLoading: false });
     }
   }
 </script>
-
diff --git a/src/views/system/menu/index.vue b/src/views/system/menu/index.vue
index a6de0f2..3cd4907 100644
--- a/src/views/system/menu/index.vue
+++ b/src/views/system/menu/index.vue
@@ -1,71 +1,70 @@
 <template>
   <div class="p-4">
     <BasicTable @register="registerTable" :rowSelection="rowSelection">
-
       <template #tableTitle>
-          <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增菜单</a-button>
-          <a-button type="primary" preIcon="ic:round-expand" @click="expandAll">展开全部</a-button>
-          <a-button type="primary" preIcon="ic:round-compress" @click="collapseAll">折叠全部</a-button>
+        <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增菜单</a-button>
+        <a-button type="primary" preIcon="ic:round-expand" @click="expandAll">展开全部</a-button>
+        <a-button type="primary" preIcon="ic:round-compress" @click="collapseAll">折叠全部</a-button>
 
-          <a-dropdown v-if="checkedKeys.length > 0">
+        <a-dropdown v-if="checkedKeys.length > 0">
           <template #overlay>
             <a-menu>
               <a-menu-item key="1" @click="batchHandleDelete">
-                <Icon icon="ant-design:delete-outlined"/>
+                <Icon icon="ant-design:delete-outlined" />
                 删除
               </a-menu-item>
             </a-menu>
           </template>
           <a-button
-          >批量操作
-            <Icon icon="ant-design:down-outlined"/>
+            >批量操作
+            <Icon icon="ant-design:down-outlined" />
           </a-button>
         </a-dropdown>
       </template>
       <template #action="{ record }">
-        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)"/>
+        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
       </template>
     </BasicTable>
-    <MenuDrawer @register="registerDrawer" @success="handleSuccess" :showFooter="showFooter"/>
-    <DataRuleList @register="registerDrawer1"/>
+    <MenuDrawer @register="registerDrawer" @success="handleSuccess" :showFooter="showFooter" />
+    <DataRuleList @register="registerDrawer1" />
   </div>
 </template>
 <script lang="ts" name="system-menu" setup>
-  import {nextTick, ref} from 'vue';
-  import {BasicTable, useTable, TableAction} from '/@/components/Table';
-  import { useListPage } from '/@/hooks/system/useListPage'
-  import {useDrawer} from '/@/components/Drawer';
+  import { nextTick, ref } from 'vue';
+  import { BasicTable, useTable, TableAction } from '/@/components/Table';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import { useDrawer } from '/@/components/Drawer';
   import MenuDrawer from './MenuDrawer.vue';
   import DataRuleList from './DataRuleList.vue';
-  import {columns} from './menu.data';
-  import {list,deleteMenu,batchDeleteMenu} from './menu.api';
+  import { columns } from './menu.data';
+  import { list, deleteMenu, batchDeleteMenu } from './menu.api';
 
   const checkedKeys = ref<Array<string | number>>([]);
   const showFooter = ref(true);
-  const [registerDrawer, {openDrawer}] = useDrawer();
-  const [registerDrawer1, {openDrawer:openDataRule}] = useDrawer();
+  const [registerDrawer, { openDrawer }] = useDrawer();
+  const [registerDrawer1, { openDrawer: openDataRule }] = useDrawer();
   // 列表页面公共参数、方法
-  const { prefixCls,tableContext} = useListPage({
-      tableProps: {
-          title: '菜单列表',
-          api: list,
-          columns: columns,
-          size: 'small',
-          pagination: false,
-          isTreeTable: true,
-          striped: true,
-          useSearchForm: false,
-          showTableSetting: true,
-          bordered: true,
-          showIndexColumn: false,
-          tableSetting: {fullScreen: true},
-          actionColumn: {
-              width: 120,
-          }
-      }
-  })
+  const { prefixCls, tableContext } = useListPage({
+    tableProps: {
+      title: '菜单列表',
+      api: list,
+      columns: columns,
+      size: 'small',
+      pagination: false,
+      isTreeTable: true,
+      striped: true,
+      useSearchForm: false,
+      showTableSetting: true,
+      bordered: true,
+      showIndexColumn: false,
+      tableSetting: { fullScreen: true },
+      actionColumn: {
+        width: 120,
+      },
+    },
+  });
   //注册table数据
-  const [registerTable, {reload, expandAll,collapseAll}] = tableContext
+  const [registerTable, { reload, expandAll, collapseAll }] = tableContext;
 
   /**
    * 选择列配置
@@ -119,7 +118,7 @@
    */
   function handleAddSub(record) {
     openDrawer(true, {
-      record:{'parentId':record.id,'menuType':1},
+      record: { parentId: record.id, menuType: 1 },
       isUpdate: false,
     });
   }
@@ -127,20 +126,20 @@
    * 数据权限弹窗
    */
   function handleDataRule(record) {
-    openDataRule(true,{id:record.id})
+    openDataRule(true, { id: record.id });
   }
 
   /**
    * 删除
    */
   async function handleDelete(record) {
-    await deleteMenu({id: record.id}, reload);
+    await deleteMenu({ id: record.id }, reload);
   }
   /**
    * 批量删除事件
    */
   async function batchHandleDelete() {
-    await batchDeleteMenu({ids: checkedKeys.value}, reload);
+    await batchDeleteMenu({ ids: checkedKeys.value }, reload);
   }
   /**
    * 成功回调
@@ -162,7 +161,7 @@
       {
         label: '编辑',
         onClick: handleEdit.bind(null, record),
-      }
+      },
     ];
   }
 
diff --git a/src/views/system/menu/menu.api.ts b/src/views/system/menu/menu.api.ts
index 41464a2..b6003a4 100644
--- a/src/views/system/menu/menu.api.ts
+++ b/src/views/system/menu/menu.api.ts
@@ -1,33 +1,32 @@
-import {defHttp} from '/@/utils/http/axios';
-import {Modal} from 'ant-design-vue';
+import { defHttp } from '/@/utils/http/axios';
+import { Modal } from 'ant-design-vue';
 
 enum Api {
   list = '/sys/permission/list',
-  save='/sys/permission/add',
-  edit='/sys/permission/edit',
+  save = '/sys/permission/add',
+  edit = '/sys/permission/edit',
   delete = '/sys/permission/delete',
   deleteBatch = '/sys/permission/deleteBatch',
   ruleList = '/sys/permission/queryPermissionRule',
-  ruleSave='/sys/permission/addPermissionRule',
-  ruleEdit='/sys/permission/editPermissionRule',
-  ruleDelete='/sys/permission/deletePermissionRule',
+  ruleSave = '/sys/permission/addPermissionRule',
+  ruleEdit = '/sys/permission/editPermissionRule',
+  ruleDelete = '/sys/permission/deletePermissionRule',
 }
 
 /**
  * 列表接口
  * @param params
  */
-export const list = () =>
-  defHttp.get({url: Api.list});
+export const list = () => defHttp.get({ url: Api.list });
 
 /**
  * 删除菜单
  */
-export const deleteMenu = (params,handleSuccess) => {
-  return defHttp.delete({url: Api.delete, params}, {joinParamsToUrl: true}).then(() => {
+export const deleteMenu = (params, handleSuccess) => {
+  return defHttp.delete({ url: Api.delete, params }, { joinParamsToUrl: true }).then(() => {
     handleSuccess();
   });
-}
+};
 /**
  * 批量删除菜单
  * @param params
@@ -39,46 +38,44 @@ export const batchDeleteMenu = (params, handleSuccess) => {
     okText: '确认',
     cancelText: '取消',
     onOk: () => {
-      return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
+      return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => {
         handleSuccess();
       });
-    }
+    },
   });
-}
+};
 /**
  * 保存或者更新菜单
  * @param params
  */
 export const saveOrUpdateMenu = (params, isUpdate) => {
   let url = isUpdate ? Api.edit : Api.save;
-  return defHttp.post({url: url, params});
-}
+  return defHttp.post({ url: url, params });
+};
 /**
  * 菜单数据权限列表接口
  * @param params
  */
-export const dataRuleList = (params) =>
-  defHttp.get({url: Api.ruleList, params});
+export const dataRuleList = (params) => defHttp.get({ url: Api.ruleList, params });
 /**
  * 保存或者更新数据规则
  * @param params
  */
 export const saveOrUpdateRule = (params, isUpdate) => {
   let url = isUpdate ? Api.ruleEdit : Api.ruleSave;
-  return defHttp.post({url: url, params});
-}
+  return defHttp.post({ url: url, params });
+};
 
 /**
  * 删除数据权限
  */
-export const deleteRule = (params,handleSuccess) => {
-  return defHttp.delete({url: Api.ruleDelete, params}, {joinParamsToUrl: true}).then(() => {
+export const deleteRule = (params, handleSuccess) => {
+  return defHttp.delete({ url: Api.ruleDelete, params }, { joinParamsToUrl: true }).then(() => {
     handleSuccess();
   });
-}
+};
 /**
  * 根据code获取字典数值
  * @param params
  */
-export const ajaxGetDictItems = (params) =>
-  defHttp.get({url: `/sys/dict/getDictItems/${params.code}`});
+export const ajaxGetDictItems = (params) => defHttp.get({ url: `/sys/dict/getDictItems/${params.code}` });
diff --git a/src/views/system/menu/menu.data.ts b/src/views/system/menu/menu.data.ts
index c2c8502..c702a18 100644
--- a/src/views/system/menu/menu.data.ts
+++ b/src/views/system/menu/menu.data.ts
@@ -1,12 +1,12 @@
-import {BasicColumn} from '/@/components/Table';
-import {FormSchema} from '/@/components/Table';
-import {h} from 'vue';
-import {Icon} from '/@/components/Icon';
-import {duplicateCheck} from "../user/user.api";
-import {ajaxGetDictItems} from "./menu.api";
-import {render} from "/@/utils/common/renderUtils";
+import { BasicColumn } from '/@/components/Table';
+import { FormSchema } from '/@/components/Table';
+import { h } from 'vue';
+import { Icon } from '/@/components/Icon';
+import { duplicateCheck } from '../user/user.api';
+import { ajaxGetDictItems } from './menu.api';
+import { render } from '/@/utils/common/renderUtils';
 import { Select } from 'ant-design-vue';
-import {rules} from '/@/utils/helper/validator'
+import { rules } from '/@/utils/helper/validator';
 
 const isDir = (type) => type === 0;
 const isMenu = (type) => type === 1;
@@ -29,16 +29,16 @@ export const columns: BasicColumn[] = [
     title: '菜单类型',
     dataIndex: 'menuType',
     width: 150,
-    customRender: ({text}) => {
-      return  render.renderDict(text, 'menu_type')
-    }
+    customRender: ({ text }) => {
+      return render.renderDict(text, 'menu_type');
+    },
   },
   {
     title: '图标',
     dataIndex: 'icon',
     width: 50,
-    customRender: ({record}) => {
-      return h(Icon, {icon: record.icon});
+    customRender: ({ record }) => {
+      return h(Icon, { icon: record.icon });
     },
   },
   {
@@ -57,7 +57,7 @@ export const columns: BasicColumn[] = [
     title: '排序',
     dataIndex: 'sortNo',
     width: 50,
-  }
+  },
 ];
 
 export const searchFormSchema: FormSchema[] = [
@@ -65,8 +65,8 @@ export const searchFormSchema: FormSchema[] = [
     field: 'name',
     label: '菜单名称',
     component: 'Input',
-    colProps: {span: 8},
-  }
+    colProps: { span: 8 },
+  },
 ];
 
 export const formSchema: FormSchema[] = [
@@ -74,35 +74,38 @@ export const formSchema: FormSchema[] = [
     label: 'id',
     field: 'id',
     component: 'Input',
-    show: false
+    show: false,
   },
   {
     field: 'menuType',
     label: '菜单类型',
     component: 'RadioButtonGroup',
     defaultValue: 0,
-    componentProps: ({formActionType}) => {
+    componentProps: ({ formActionType }) => {
       return {
         options: [
-          {label: '一级菜单', value: 0},
-          {label: '子菜单', value: 1},
-          {label: '按钮/权限', value: 2},
+          { label: '一级菜单', value: 0 },
+          { label: '子菜单', value: 1 },
+          { label: '按钮/权限', value: 2 },
         ],
-        onChange: e => {
-          const {updateSchema,clearValidate} = formActionType
+        onChange: (e) => {
+          const { updateSchema, clearValidate } = formActionType;
           const label = isButton(e) ? '按钮/权限' : '菜单名称';
           //清除校验
           clearValidate();
-          updateSchema([{
-            field: 'name',
-            label: label
-          },{
-            field: 'url',
-            required: !isButton(e)
-          }]);
-        }
-      }
-    }
+          updateSchema([
+            {
+              field: 'name',
+              label: label,
+            },
+            {
+              field: 'url',
+              required: !isButton(e),
+            },
+          ]);
+        },
+      };
+    },
   },
   {
     field: 'name',
@@ -121,12 +124,12 @@ export const formSchema: FormSchema[] = [
         key: 'id',
         value: 'id',
       },
-      dropdownStyle:{
-        maxHeight:'50vh'
+      dropdownStyle: {
+        maxHeight: '50vh',
       },
-      getPopupContainer: (node) => node.parentNode
+      getPopupContainer: (node) => node.parentNode,
     },
-    ifShow: ({values}) => !isDir(values.menuType),
+    ifShow: ({ values }) => !isDir(values.menuType),
   },
   {
     field: 'url',
@@ -134,8 +137,8 @@ export const formSchema: FormSchema[] = [
     component: 'Input',
     required: true,
     ifShow: ({ values }) => !(values.component === ComponentTypes.IFrame && values.internalOrExternal) && values.menuType !== 2,
-    dynamicRules: ({model, schema}) => {
-      return rules.duplicateCheckRule('sys_permission', 'url', model, schema, true)
+    dynamicRules: ({ model, schema }) => {
+      return rules.duplicateCheckRule('sys_permission', 'url', model, schema, true);
     },
   },
   {
@@ -143,10 +146,10 @@ export const formSchema: FormSchema[] = [
     label: '前端组件',
     component: 'Input',
     componentProps: {
-      placeholder:'请输入前端组件'
+      placeholder: '请输入前端组件',
     },
     required: true,
-    ifShow: ({values}) => !isButton(values.menuType),
+    ifShow: ({ values }) => !isButton(values.menuType),
   },
   {
     field: 'frameSrc',
@@ -162,36 +165,37 @@ export const formSchema: FormSchema[] = [
     field: 'redirect',
     label: '默认跳转地址',
     component: 'Input',
-    ifShow: ({values}) => isDir(values.menuType),
+    ifShow: ({ values }) => isDir(values.menuType),
   },
   {
     field: 'perms',
     label: '授权标识',
     component: 'Input',
-    ifShow: ({values}) => isButton(values.menuType),
-    dynamicRules: ({model}) => {
+    ifShow: ({ values }) => isButton(values.menuType),
+    dynamicRules: ({ model }) => {
       return [
         {
           required: false,
           validator: (_, value) => {
             return new Promise((resolve, reject) => {
               let params = {
-                tableName: "sys_permission",
-                fieldName: "perms",
+                tableName: 'sys_permission',
+                fieldName: 'perms',
                 fieldVal: value,
                 dataId: model.id,
               };
               duplicateCheck(params)
                 .then((res) => {
                   res.success ? resolve() : reject(res.message || '校验失败');
-                }).catch((err) => {
-                reject(err.message || '校验失败');
-              });
+                })
+                .catch((err) => {
+                  reject(err.message || '校验失败');
+                });
             });
           },
         },
       ];
-    }
+    },
   },
   {
     field: 'permsType',
@@ -201,11 +205,11 @@ export const formSchema: FormSchema[] = [
     helpMessage: ['可见/可访问(授权后可见/可访问)', '可编辑(未授权时禁用)'],
     componentProps: {
       options: [
-        {label: '可见/可访问', value: '1'},
-        {label: '可编辑', value: '2'},
+        { label: '可见/可访问', value: '1' },
+        { label: '可编辑', value: '2' },
       ],
     },
-    ifShow: ({values}) => isButton(values.menuType),
+    ifShow: ({ values }) => isButton(values.menuType),
   },
   {
     field: 'status',
@@ -214,24 +218,24 @@ export const formSchema: FormSchema[] = [
     defaultValue: '1',
     componentProps: {
       options: [
-        {label: '有效', value: '1'},
-        {label: '无效', value: '0'},
+        { label: '有效', value: '1' },
+        { label: '无效', value: '0' },
       ],
     },
-    ifShow: ({values}) => isButton(values.menuType),
+    ifShow: ({ values }) => isButton(values.menuType),
   },
   {
     field: 'icon',
     label: '菜单图标',
     component: 'IconPicker',
-    ifShow: ({values}) => !isButton(values.menuType),
+    ifShow: ({ values }) => !isButton(values.menuType),
   },
   {
     field: 'sortNo',
     label: '排序',
     component: 'InputNumber',
     defaultValue: 1,
-    ifShow: ({values}) => !isButton(values.menuType),
+    ifShow: ({ values }) => !isButton(values.menuType),
   },
   {
     field: 'route',
@@ -239,10 +243,10 @@ export const formSchema: FormSchema[] = [
     component: 'Switch',
     defaultValue: true,
     componentProps: {
-      checkedChildren: "是",
-      unCheckedChildren: "否"
+      checkedChildren: '是',
+      unCheckedChildren: '否',
     },
-    ifShow: ({values}) => !isButton(values.menuType),
+    ifShow: ({ values }) => !isButton(values.menuType),
   },
   {
     field: 'hidden',
@@ -250,10 +254,10 @@ export const formSchema: FormSchema[] = [
     component: 'Switch',
     defaultValue: 0,
     componentProps: {
-      checkedChildren: "是",
-      unCheckedChildren: "否"
+      checkedChildren: '是',
+      unCheckedChildren: '否',
     },
-    ifShow: ({values}) => !isButton(values.menuType),
+    ifShow: ({ values }) => !isButton(values.menuType),
   },
   {
     field: 'hideTab',
@@ -272,10 +276,10 @@ export const formSchema: FormSchema[] = [
     component: 'Switch',
     defaultValue: false,
     componentProps: {
-      checkedChildren: "是",
-      unCheckedChildren: "否"
+      checkedChildren: '是',
+      unCheckedChildren: '否',
     },
-    ifShow: ({values}) => !isButton(values.menuType),
+    ifShow: ({ values }) => !isButton(values.menuType),
   },
   {
     field: 'alwaysShow',
@@ -283,10 +287,10 @@ export const formSchema: FormSchema[] = [
     component: 'Switch',
     defaultValue: false,
     componentProps: {
-      checkedChildren: "是",
-      unCheckedChildren: "否"
+      checkedChildren: '是',
+      unCheckedChildren: '否',
     },
-    ifShow: ({values}) => !isButton(values.menuType),
+    ifShow: ({ values }) => !isButton(values.menuType),
   },
   {
     field: 'internalOrExternal',
@@ -294,11 +298,11 @@ export const formSchema: FormSchema[] = [
     component: 'Switch',
     defaultValue: false,
     componentProps: {
-      checkedChildren: "外部",
-      unCheckedChildren: "内部"
+      checkedChildren: '外部',
+      unCheckedChildren: '内部',
     },
-    ifShow: ({values}) => !isButton(values.menuType),
-  }
+    ifShow: ({ values }) => !isButton(values.menuType),
+  },
 ];
 
 export const dataRuleColumns: BasicColumn[] = [
@@ -316,7 +320,7 @@ export const dataRuleColumns: BasicColumn[] = [
     title: '规则值',
     dataIndex: 'ruleValue',
     width: 100,
-  }
+  },
 ];
 
 export const dataRuleSearchFormSchema: FormSchema[] = [
@@ -324,14 +328,14 @@ export const dataRuleSearchFormSchema: FormSchema[] = [
     field: 'ruleName',
     label: '规则名称',
     component: 'Input',
-    colProps: {span: 6},
+    colProps: { span: 6 },
   },
   {
     field: 'ruleValue',
     label: '规则值',
     component: 'Input',
-    colProps: {span: 6},
-  }
+    colProps: { span: 6 },
+  },
 ];
 
 export const dataRuleFormSchema: FormSchema[] = [
@@ -339,7 +343,7 @@ export const dataRuleFormSchema: FormSchema[] = [
     label: 'id',
     field: 'id',
     component: 'Input',
-    show: false
+    show: false,
   },
   {
     field: 'ruleName',
@@ -351,8 +355,8 @@ export const dataRuleFormSchema: FormSchema[] = [
     field: 'ruleColumn',
     label: '规则字段',
     component: 'Input',
-    ifShow: ({values}) => {
-      return values.ruleConditions !== 'USE_SQL_RULES'
+    ifShow: ({ values }) => {
+      return values.ruleConditions !== 'USE_SQL_RULES';
     },
   },
   {
@@ -362,7 +366,7 @@ export const dataRuleFormSchema: FormSchema[] = [
     component: 'ApiSelect',
     componentProps: {
       api: ajaxGetDictItems,
-      params:{code:'rule_conditions'},
+      params: { code: 'rule_conditions' },
       labelField: 'text',
       valueField: 'value',
       getPopupContainer: (node) => document.body,
@@ -381,9 +385,9 @@ export const dataRuleFormSchema: FormSchema[] = [
     defaultValue: '1',
     componentProps: {
       options: [
-        {label: '无效', value: '0'},
-        {label: '有效', value: '1'},
+        { label: '无效', value: '0' },
+        { label: '有效', value: '1' },
       ],
-    }
-  }
+    },
+  },
 ];
diff --git a/src/views/system/message/manage/ManageDrawer.vue b/src/views/system/message/manage/ManageDrawer.vue
index b41d2fa..407888c 100644
--- a/src/views/system/message/manage/ManageDrawer.vue
+++ b/src/views/system/message/manage/ManageDrawer.vue
@@ -1,24 +1,24 @@
 <template>
   <BasicDrawer @register="registerModal" title="详情" :width="600" v-bind="$attrs" @ok="closeDrawer">
-    <BasicForm @register="registerForm"/>
+    <BasicForm @register="registerForm" />
   </BasicDrawer>
 </template>
 
 <script lang="ts" setup>
-import { BasicForm, useForm } from '/@/components/Form/index'
-import { BasicDrawer, useDrawerInner } from '/@/components/Drawer'
-import { formSchemas } from './manage.data'
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
+  import { formSchemas } from './manage.data';
 
-// 声明 emits
-const emit = defineEmits(['register'])
-// 注册 form
-const [registerForm, { resetFields, setFieldsValue, validate, updateSchema }] = useForm({
-  schemas: formSchemas,
-  showActionButtonGroup: false,
-})
-// 注册 modal
-const [registerModal, { closeDrawer }] = useDrawerInner(async (data) => {
-  await resetFields()
-  await setFieldsValue({ ...data.record })
-})
+  // 声明 emits
+  const emit = defineEmits(['register']);
+  // 注册 form
+  const [registerForm, { resetFields, setFieldsValue, validate, updateSchema }] = useForm({
+    schemas: formSchemas,
+    showActionButtonGroup: false,
+  });
+  // 注册 modal
+  const [registerModal, { closeDrawer }] = useDrawerInner(async (data) => {
+    await resetFields();
+    await setFieldsValue({ ...data.record });
+  });
 </script>
diff --git a/src/views/system/message/manage/index.less b/src/views/system/message/manage/index.less
index 690d891..63b7bd0 100644
--- a/src/views/system/message/manage/index.less
+++ b/src/views/system/message/manage/index.less
@@ -2,4 +2,4 @@
 @prefix-cls: ~'@{namespace}-message-manage';
 
 .@{prefix-cls} {
-}
\ No newline at end of file
+}
diff --git a/src/views/system/message/manage/index.vue b/src/views/system/message/manage/index.vue
index 1fd3708..2602be1 100644
--- a/src/views/system/message/manage/index.vue
+++ b/src/views/system/message/manage/index.vue
@@ -21,112 +21,109 @@
 
       <!--操作栏-->
       <template #action="{ record }">
-        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)"/>
+        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
       </template>
     </BasicTable>
-    <ManageDrawer @register="registerDrawer"/>
+    <ManageDrawer @register="registerDrawer" />
   </div>
 </template>
 
-
 <script lang="ts" setup name="message-manage">
-import { unref, computed } from 'vue'
-import { ActionItem, BasicTable, TableAction } from '/@/components/Table'
-import { useDrawer } from '/@/components/Drawer'
-import { useListPage } from '/@/hooks/system/useListPage'
-import ManageDrawer from './ManageDrawer.vue'
-import { Api, list, deleteBatch } from './manage.api'
-import { columns, searchFormSchema } from './manage.data'
+  import { unref, computed } from 'vue';
+  import { ActionItem, BasicTable, TableAction } from '/@/components/Table';
+  import { useDrawer } from '/@/components/Drawer';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import ManageDrawer from './ManageDrawer.vue';
+  import { Api, list, deleteBatch } from './manage.api';
+  import { columns, searchFormSchema } from './manage.data';
 
-// 列表页面公共参数、方法
-const { prefixCls, tableContext } = useListPage({
-  designScope: 'message-manage',
-  tableProps: {
-    title: '消息中心模板列表数据',
-    api: list,
-    columns: columns,
-    formConfig: {
-      schemas: searchFormSchema,
-    },
-  },
-  exportConfig: {
-    url: Api.exportXls,
-    name: '消息中心模板列表',
-  },
-  importConfig: {
-    url: Api.importXls,
-    success: () => reload(),
-  },
-})
-
-// 注册 ListTable
-const [registerTable, { reload, setLoading }, { rowSelection, selectedRowKeys }] = tableContext
-const showBatchBtn = computed(() => selectedRowKeys.value.length > 0)
-
-const [registerDrawer, { openDrawer }] = useDrawer()
-
-function onDetail(record) {
-  openDrawer(true, { record: record })
-}
-
-function onDelete(record) {
-  if (record) {
-    doDeleteDepart([record.id], false)
-  }
-}
-
-async function onDeleteBatch() {
-  try {
-    await doDeleteDepart(selectedRowKeys)
-    selectedRowKeys.value = []
-  } finally {
-  }
-}
-
-/**
- * 根据 ids 批量删除
- * @param idListRef array
- * @param confirm 是否显示确认提示框
- */
-async function doDeleteDepart(idListRef, confirm = true) {
-  const idList = unref(idListRef)
-  if (idList.length > 0) {
-    try {
-      setLoading(true)
-      await deleteBatch({ ids: idList.join(',') }, confirm)
-      await reload()
-    } finally {
-      setLoading(false)
-    }
-  }
-}
-
-/**
- * 操作栏
- */
-function getTableAction(record): ActionItem[] {
-  return [
-    { label: '详情', onClick: onDetail.bind(null, record) },
-  ]
-}
-
-/**
- * 下拉操作栏
- */
-function getDropDownAction(record): ActionItem[] {
-  return [
-    {
-      label: '删除',
-      color: 'error',
-      popConfirm: {
-        title: '确认要删除吗？',
-        confirm: onDelete.bind(null, record),
+  // 列表页面公共参数、方法
+  const { prefixCls, tableContext } = useListPage({
+    designScope: 'message-manage',
+    tableProps: {
+      title: '消息中心模板列表数据',
+      api: list,
+      columns: columns,
+      formConfig: {
+        schemas: searchFormSchema,
       },
     },
-  ]
-}
+    exportConfig: {
+      url: Api.exportXls,
+      name: '消息中心模板列表',
+    },
+    importConfig: {
+      url: Api.importXls,
+      success: () => reload(),
+    },
+  });
+
+  // 注册 ListTable
+  const [registerTable, { reload, setLoading }, { rowSelection, selectedRowKeys }] = tableContext;
+  const showBatchBtn = computed(() => selectedRowKeys.value.length > 0);
+
+  const [registerDrawer, { openDrawer }] = useDrawer();
+
+  function onDetail(record) {
+    openDrawer(true, { record: record });
+  }
+
+  function onDelete(record) {
+    if (record) {
+      doDeleteDepart([record.id], false);
+    }
+  }
+
+  async function onDeleteBatch() {
+    try {
+      await doDeleteDepart(selectedRowKeys);
+      selectedRowKeys.value = [];
+    } finally {
+    }
+  }
+
+  /**
+   * 根据 ids 批量删除
+   * @param idListRef array
+   * @param confirm 是否显示确认提示框
+   */
+  async function doDeleteDepart(idListRef, confirm = true) {
+    const idList = unref(idListRef);
+    if (idList.length > 0) {
+      try {
+        setLoading(true);
+        await deleteBatch({ ids: idList.join(',') }, confirm);
+        await reload();
+      } finally {
+        setLoading(false);
+      }
+    }
+  }
+
+  /**
+   * 操作栏
+   */
+  function getTableAction(record): ActionItem[] {
+    return [{ label: '详情', onClick: onDetail.bind(null, record) }];
+  }
+
+  /**
+   * 下拉操作栏
+   */
+  function getDropDownAction(record): ActionItem[] {
+    return [
+      {
+        label: '删除',
+        color: 'error',
+        popConfirm: {
+          title: '确认要删除吗？',
+          confirm: onDelete.bind(null, record),
+        },
+      },
+    ];
+  }
 </script>
 
 <style lang="less">
-@import "index";
+  @import 'index';
 </style>
diff --git a/src/views/system/message/manage/manage.api.ts b/src/views/system/message/manage/manage.api.ts
index a3100c8..b83d6c2 100644
--- a/src/views/system/message/manage/manage.api.ts
+++ b/src/views/system/message/manage/manage.api.ts
@@ -1,8 +1,8 @@
-import { unref } from 'vue'
-import { defHttp } from '/@/utils/http/axios'
-import { useMessage } from '/@/hooks/web/useMessage'
+import { unref } from 'vue';
+import { defHttp } from '/@/utils/http/axios';
+import { useMessage } from '/@/hooks/web/useMessage';
 
-const { createConfirm } = useMessage()
+const { createConfirm } = useMessage();
 
 export enum Api {
   list = '/sys/message/sysMessage/list',
@@ -14,7 +14,7 @@ export enum Api {
   edit = '/sys/message/sysMessage/edit',
 }
 
-export const list = (params) => defHttp.get({ url: Api.list, params })
+export const list = (params) => defHttp.get({ url: Api.list, params });
 
 /**
  * 批量删除
@@ -24,8 +24,8 @@ export const list = (params) => defHttp.get({ url: Api.list, params })
 export const deleteBatch = (params, confirm = false) => {
   return new Promise((resolve, reject) => {
     const doDelete = () => {
-      resolve(defHttp.delete({ url: Api.deleteBatch, params }, { joinParamsToUrl: true }))
-    }
+      resolve(defHttp.delete({ url: Api.deleteBatch, params }, { joinParamsToUrl: true }));
+    };
     if (confirm) {
       createConfirm({
         iconType: 'warning',
@@ -33,20 +33,20 @@ export const deleteBatch = (params, confirm = false) => {
         content: '确定要删除吗？',
         onOk: () => doDelete(),
         onCancel: () => reject(),
-      })
+      });
     } else {
-      doDelete()
+      doDelete();
     }
-  })
-}
+  });
+};
 
 /**
  * 保存或者更改消息模板
  */
 export const saveOrUpdate = (params, isUpdate) => {
   if (unref(isUpdate)) {
-    return defHttp.put({ url: Api.edit, params })
+    return defHttp.put({ url: Api.edit, params });
   } else {
-    return defHttp.post({ url: Api.save, params })
+    return defHttp.post({ url: Api.save, params });
   }
-}
+};
diff --git a/src/views/system/message/manage/manage.data.ts b/src/views/system/message/manage/manage.data.ts
index 87495b0..97b2a92 100644
--- a/src/views/system/message/manage/manage.data.ts
+++ b/src/views/system/message/manage/manage.data.ts
@@ -1,4 +1,4 @@
-import { BasicColumn, FormSchema } from '/@/components/Table'
+import { BasicColumn, FormSchema } from '/@/components/Table';
 
 export const columns: BasicColumn[] = [
   {
@@ -37,7 +37,7 @@ export const columns: BasicColumn[] = [
     dataIndex: 'esType_dictText',
     width: 120,
   },
-]
+];
 
 export const searchFormSchema: FormSchema[] = [
   {
@@ -61,7 +61,7 @@ export const searchFormSchema: FormSchema[] = [
       dictCode: 'msgType',
     },
   },
-]
+];
 
 export const formSchemas: FormSchema[] = [
   {
@@ -131,4 +131,4 @@ export const formSchemas: FormSchema[] = [
     component: 'InputTextArea',
     componentProps: { readOnly: true },
   },
-]
+];
diff --git a/src/views/system/message/template/TemplateModal.vue b/src/views/system/message/template/TemplateModal.vue
index 24e5087..6eb9193 100644
--- a/src/views/system/message/template/TemplateModal.vue
+++ b/src/views/system/message/template/TemplateModal.vue
@@ -1,46 +1,46 @@
 <template>
   <BasicModal @register="registerModal" :title="title" :width="800" v-bind="$attrs" @ok="onSubmit">
-    <BasicForm @register="registerForm"/>
+    <BasicForm @register="registerForm" />
   </BasicModal>
 </template>
 
 <script lang="ts" setup>
-import { ref, unref } from 'vue'
-import { BasicForm, useForm } from '/@/components/Form/index'
-import { BasicModal, useModalInner } from '/@/components/Modal'
-import { formSchemas } from './template.data'
-import { saveOrUpdate } from './template.api'
+  import { ref, unref } from 'vue';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { formSchemas } from './template.data';
+  import { saveOrUpdate } from './template.api';
 
-// 声明 emits
-const emit = defineEmits(['success', 'register'])
-const title = ref<string>('')
-const isUpdate = ref<boolean>(false)
-// 注册 form
-const [registerForm, { resetFields, setFieldsValue, validate, updateSchema }] = useForm({
-  schemas: formSchemas,
-  showActionButtonGroup: false,
-})
-// 注册 modal
-const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
-  isUpdate.value = unref(data.isUpdate)
-  title.value = unref(data.title)
-  await resetFields()
-  await setFieldsValue({ ...data.record })
-})
+  // 声明 emits
+  const emit = defineEmits(['success', 'register']);
+  const title = ref<string>('');
+  const isUpdate = ref<boolean>(false);
+  // 注册 form
+  const [registerForm, { resetFields, setFieldsValue, validate, updateSchema }] = useForm({
+    schemas: formSchemas,
+    showActionButtonGroup: false,
+  });
+  // 注册 modal
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    isUpdate.value = unref(data.isUpdate);
+    title.value = unref(data.title);
+    await resetFields();
+    await setFieldsValue({ ...data.record });
+  });
 
-//表单提交事件
-async function onSubmit() {
-  try {
-    const values = await validate()
-    setModalProps({ confirmLoading: true })
-    // 提交表单
-    await saveOrUpdate(values, isUpdate)
-    //关闭弹窗
-    closeModal()
-    //刷新列表
-    emit('success')
-  } finally {
-    setModalProps({ confirmLoading: false })
+  //表单提交事件
+  async function onSubmit() {
+    try {
+      const values = await validate();
+      setModalProps({ confirmLoading: true });
+      // 提交表单
+      await saveOrUpdate(values, isUpdate);
+      //关闭弹窗
+      closeModal();
+      //刷新列表
+      emit('success');
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
   }
-}
 </script>
diff --git a/src/views/system/message/template/TemplateTestModal.vue b/src/views/system/message/template/TemplateTestModal.vue
index ade95f5..eeea2f5 100644
--- a/src/views/system/message/template/TemplateTestModal.vue
+++ b/src/views/system/message/template/TemplateTestModal.vue
@@ -1,40 +1,40 @@
 <template>
   <BasicModal @register="registerModal" title="发送测试" :width="800" v-bind="$attrs" @ok="onSubmit">
-    <BasicForm @register="registerForm"/>
+    <BasicForm @register="registerForm" />
   </BasicModal>
 </template>
 
 <script lang="ts" setup>
-import { ref, unref } from 'vue'
-import { BasicForm, useForm } from '/@/components/Form/index'
-import { BasicModal, useModalInner } from '/@/components/Modal'
-import { sendTestFormSchemas } from './template.data'
-import { sendMessageTest } from './template.api'
+  import { ref, unref } from 'vue';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { sendTestFormSchemas } from './template.data';
+  import { sendMessageTest } from './template.api';
 
-// 声明 emits
-const emit = defineEmits(['register'])
-// 注册 form
-const [registerForm, { resetFields, setFieldsValue, validate, updateSchema }] = useForm({
-  schemas: sendTestFormSchemas,
-  showActionButtonGroup: false,
-})
-// 注册 modal
-const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
-  await resetFields()
-  await setFieldsValue({ ...unref(data.record) })
-})
+  // 声明 emits
+  const emit = defineEmits(['register']);
+  // 注册 form
+  const [registerForm, { resetFields, setFieldsValue, validate, updateSchema }] = useForm({
+    schemas: sendTestFormSchemas,
+    showActionButtonGroup: false,
+  });
+  // 注册 modal
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    await resetFields();
+    await setFieldsValue({ ...unref(data.record) });
+  });
 
-//表单提交事件
-async function onSubmit() {
-  try {
-    const values = await validate()
-    setModalProps({ confirmLoading: true })
-    // 提交表单
-    await sendMessageTest(values)
-    //关闭弹窗
-    closeModal()
-  } finally {
-    setModalProps({ confirmLoading: false })
+  //表单提交事件
+  async function onSubmit() {
+    try {
+      const values = await validate();
+      setModalProps({ confirmLoading: true });
+      // 提交表单
+      await sendMessageTest(values);
+      //关闭弹窗
+      closeModal();
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
   }
-}
 </script>
diff --git a/src/views/system/message/template/index.less b/src/views/system/message/template/index.less
index 360fab9..15e8d49 100644
--- a/src/views/system/message/template/index.less
+++ b/src/views/system/message/template/index.less
@@ -2,4 +2,4 @@
 @prefix-cls: ~'@{namespace}-message-template';
 
 .@{prefix-cls} {
-}
\ No newline at end of file
+}
diff --git a/src/views/system/message/template/index.vue b/src/views/system/message/template/index.vue
index b02aded..28077a3 100644
--- a/src/views/system/message/template/index.vue
+++ b/src/views/system/message/template/index.vue
@@ -24,134 +24,129 @@
 
       <!--操作栏-->
       <template #action="{ record }">
-        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)"/>
+        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
       </template>
     </BasicTable>
-    <TemplateModal @register="registerModal" @success="reload"/>
-    <TemplateTestModal @register="registerTestModal"/>
+    <TemplateModal @register="registerModal" @success="reload" />
+    <TemplateTestModal @register="registerTestModal" />
   </div>
 </template>
 
-
 <script lang="ts" setup name="message-template">
-import { unref, computed } from 'vue'
-import { ActionItem, BasicTable, TableAction } from '/@/components/Table'
-import { useModal } from '/@/components/Modal'
-import { useListPage } from '/@/hooks/system/useListPage'
-import TemplateModal from './TemplateModal.vue'
-import TemplateTestModal from './TemplateTestModal.vue'
-import { Api, list, deleteBatch } from './template.api'
-import { columns, searchFormSchema } from './template.data'
+  import { unref, computed } from 'vue';
+  import { ActionItem, BasicTable, TableAction } from '/@/components/Table';
+  import { useModal } from '/@/components/Modal';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import TemplateModal from './TemplateModal.vue';
+  import TemplateTestModal from './TemplateTestModal.vue';
+  import { Api, list, deleteBatch } from './template.api';
+  import { columns, searchFormSchema } from './template.data';
 
-// 列表页面公共参数、方法
-const { prefixCls, onExportXls, onImportXls, tableContext } = useListPage({
-  designScope: 'message-template',
-  tableProps: {
-    title: '消息中心模板列表数据',
-    api: list,
-    columns: columns,
-    formConfig: {
-      schemas: searchFormSchema,
-    },
-  },
-  exportConfig: {
-    url: Api.exportXls,
-    name: '消息中心模板列表',
-  },
-  importConfig: {
-    url: Api.importXls,
-    success: () => reload(),
-  },
-})
-
-// 注册 ListTable
-const [registerTable, { reload, setLoading }, { rowSelection, selectedRowKeys }] = tableContext
-const [registerModal, { openModal }] = useModal()
-const [registerTestModal, testModal] = useModal()
-const showBatchBtn = computed(() => selectedRowKeys.value.length > 0)
-
-function onAdd() {
-  openModal(true, {
-    title: '新增消息模板',
-    isUpdate: false,
-    record: {},
-  })
-}
-
-function onEdit(record) {
-  openModal(true, {
-    title: '修改消息模板',
-    isUpdate: true,
-    record: record,
-  })
-}
-
-function onDelete(record) {
-  if (record) {
-    doDeleteDepart([record.id], false)
-  }
-}
-
-
-/**
- * 根据 ids 批量删除
- * @param idListRef array
- * @param confirm 是否显示确认提示框
- */
-async function doDeleteDepart(idListRef, confirm = true) {
-  const idList = unref(idListRef)
-  if (idList.length > 0) {
-    try {
-      setLoading(true)
-      await deleteBatch({ ids: idList.join(',') }, confirm)
-      await reload()
-    } finally {
-      setLoading(false)
-    }
-  }
-}
-
-
-async function onDeleteBatch() {
-  try {
-    await doDeleteDepart(selectedRowKeys)
-    selectedRowKeys.value = []
-  } finally {
-  }
-}
-
-// 发送消息测试
-function onSendTest(record) {
-  testModal.openModal(true, { record })
-}
-
-/**
- * 操作栏
- */
-function getTableAction(record): ActionItem[] {
-  return [
-    { label: '编辑', onClick: onEdit.bind(null, record) },
-  ]
-}
-
-/**
- * 下拉操作栏
- */
-function getDropDownAction(record): ActionItem[] {
-  return [
-    { label: '发送测试', onClick: onSendTest.bind(null, record) },
-    {
-      label: '删除',
-      color: 'error',
-      popConfirm: {
-        title: '确认要删除吗？',
-        confirm: onDelete.bind(null, record),
+  // 列表页面公共参数、方法
+  const { prefixCls, onExportXls, onImportXls, tableContext } = useListPage({
+    designScope: 'message-template',
+    tableProps: {
+      title: '消息中心模板列表数据',
+      api: list,
+      columns: columns,
+      formConfig: {
+        schemas: searchFormSchema,
       },
     },
-  ]
-}
+    exportConfig: {
+      url: Api.exportXls,
+      name: '消息中心模板列表',
+    },
+    importConfig: {
+      url: Api.importXls,
+      success: () => reload(),
+    },
+  });
+
+  // 注册 ListTable
+  const [registerTable, { reload, setLoading }, { rowSelection, selectedRowKeys }] = tableContext;
+  const [registerModal, { openModal }] = useModal();
+  const [registerTestModal, testModal] = useModal();
+  const showBatchBtn = computed(() => selectedRowKeys.value.length > 0);
+
+  function onAdd() {
+    openModal(true, {
+      title: '新增消息模板',
+      isUpdate: false,
+      record: {},
+    });
+  }
+
+  function onEdit(record) {
+    openModal(true, {
+      title: '修改消息模板',
+      isUpdate: true,
+      record: record,
+    });
+  }
+
+  function onDelete(record) {
+    if (record) {
+      doDeleteDepart([record.id], false);
+    }
+  }
+
+  /**
+   * 根据 ids 批量删除
+   * @param idListRef array
+   * @param confirm 是否显示确认提示框
+   */
+  async function doDeleteDepart(idListRef, confirm = true) {
+    const idList = unref(idListRef);
+    if (idList.length > 0) {
+      try {
+        setLoading(true);
+        await deleteBatch({ ids: idList.join(',') }, confirm);
+        await reload();
+      } finally {
+        setLoading(false);
+      }
+    }
+  }
+
+  async function onDeleteBatch() {
+    try {
+      await doDeleteDepart(selectedRowKeys);
+      selectedRowKeys.value = [];
+    } finally {
+    }
+  }
+
+  // 发送消息测试
+  function onSendTest(record) {
+    testModal.openModal(true, { record });
+  }
+
+  /**
+   * 操作栏
+   */
+  function getTableAction(record): ActionItem[] {
+    return [{ label: '编辑', onClick: onEdit.bind(null, record) }];
+  }
+
+  /**
+   * 下拉操作栏
+   */
+  function getDropDownAction(record): ActionItem[] {
+    return [
+      { label: '发送测试', onClick: onSendTest.bind(null, record) },
+      {
+        label: '删除',
+        color: 'error',
+        popConfirm: {
+          title: '确认要删除吗？',
+          confirm: onDelete.bind(null, record),
+        },
+      },
+    ];
+  }
 </script>
 
 <style lang="less">
-@import "index";
+  @import 'index';
 </style>
diff --git a/src/views/system/message/template/template.api.ts b/src/views/system/message/template/template.api.ts
index ef8fb8c..fe4f03c 100644
--- a/src/views/system/message/template/template.api.ts
+++ b/src/views/system/message/template/template.api.ts
@@ -1,8 +1,8 @@
-import { unref } from 'vue'
-import { defHttp } from '/@/utils/http/axios'
-import { useMessage } from '/@/hooks/web/useMessage'
+import { unref } from 'vue';
+import { defHttp } from '/@/utils/http/axios';
+import { useMessage } from '/@/hooks/web/useMessage';
 
-const { createConfirm } = useMessage()
+const { createConfirm } = useMessage();
 
 export enum Api {
   list = '/sys/message/sysMessageTemplate/list',
@@ -16,7 +16,7 @@ export enum Api {
   send = '/sys/message/sysMessageTemplate/sendMsg',
 }
 
-export const list = (params) => defHttp.get({ url: Api.list, params })
+export const list = (params) => defHttp.get({ url: Api.list, params });
 
 /**
  * 批量删除
@@ -26,8 +26,8 @@ export const list = (params) => defHttp.get({ url: Api.list, params })
 export const deleteBatch = (params, confirm = false) => {
   return new Promise((resolve, reject) => {
     const doDelete = () => {
-      resolve(defHttp.delete({ url: Api.deleteBatch, params }, { joinParamsToUrl: true }))
-    }
+      resolve(defHttp.delete({ url: Api.deleteBatch, params }, { joinParamsToUrl: true }));
+    };
     if (confirm) {
       createConfirm({
         iconType: 'warning',
@@ -35,26 +35,26 @@ export const deleteBatch = (params, confirm = false) => {
         content: '确定要删除吗？',
         onOk: () => doDelete(),
         onCancel: () => reject(),
-      })
+      });
     } else {
-      doDelete()
+      doDelete();
     }
-  })
-}
+  });
+};
 
 /**
  * 保存或者更改消息模板
  */
 export const saveOrUpdate = (params, isUpdate) => {
   if (unref(isUpdate)) {
-    return defHttp.put({ url: Api.edit, params })
+    return defHttp.put({ url: Api.edit, params });
   } else {
-    return defHttp.post({ url: Api.save, params })
+    return defHttp.post({ url: Api.save, params });
   }
-}
+};
 
 /**
  * 发送消息测试
  * @param params
  */
-export const sendMessageTest = (params) => defHttp.post({ url: Api.send, params })
+export const sendMessageTest = (params) => defHttp.post({ url: Api.send, params });
diff --git a/src/views/system/message/template/template.data.ts b/src/views/system/message/template/template.data.ts
index e655298..317f243 100644
--- a/src/views/system/message/template/template.data.ts
+++ b/src/views/system/message/template/template.data.ts
@@ -1,5 +1,5 @@
-import { BasicColumn, FormSchema } from '/@/components/Table'
-import { rules } from '/@/utils/helper/validator'
+import { BasicColumn, FormSchema } from '/@/components/Table';
+import { rules } from '/@/utils/helper/validator';
 
 export const columns: BasicColumn[] = [
   {
@@ -23,21 +23,21 @@ export const columns: BasicColumn[] = [
     width: 100,
     customRender: function ({ text }) {
       if (text == '1') {
-        return '短信'
+        return '短信';
       }
       if (text == '2') {
-        return '邮件'
+        return '邮件';
       }
       if (text == '3') {
-        return '微信'
+        return '微信';
       }
       if (text == '4') {
-        return '系统'
+        return '系统';
       }
-      return text
+      return text;
     },
   },
-]
+];
 
 export const searchFormSchema: FormSchema[] = [
   {
@@ -58,7 +58,7 @@ export const searchFormSchema: FormSchema[] = [
       dictCode: 'msgType',
     },
   },
-]
+];
 
 export const formSchemas: FormSchema[] = [
   {
@@ -78,15 +78,11 @@ export const formSchemas: FormSchema[] = [
     field: 'templateCode',
     component: 'Input',
     dynamicRules: ({ model, schema }) => {
-      return [
-        { required: true, message: '请输入模板编码！' },
-        ...rules.duplicateCheckRule('sys_sms_template', 'template_code', model, schema, true),
-      ]
+      return [{ required: true, message: '请输入模板编码！' }, ...rules.duplicateCheckRule('sys_sms_template', 'template_code', model, schema, true)];
     },
     // 编辑模式下不可修改编码
     dynamicDisabled: (params) => !!params.values.id,
-  }
-  ,
+  },
   {
     label: '模板类型',
     field: 'templateType',
@@ -108,7 +104,7 @@ export const formSchemas: FormSchema[] = [
       },
     },
     ifShow: ({ values }) => {
-      return !['2', '4'].includes(values.templateType)
+      return !['2', '4'].includes(values.templateType);
     },
   },
 
@@ -117,10 +113,10 @@ export const formSchemas: FormSchema[] = [
     field: 'templateContent',
     component: 'JEditor',
     ifShow: ({ values }) => {
-      return ['2', '4'].includes(values.templateType)
+      return ['2', '4'].includes(values.templateType);
     },
   },
-]
+];
 
 export const sendTestFormSchemas: FormSchema[] = [
   {
@@ -165,4 +161,4 @@ export const sendTestFormSchemas: FormSchema[] = [
     component: 'Input',
     required: true,
   },
-]
+];
diff --git a/src/views/system/notice/DetailModal.vue b/src/views/system/notice/DetailModal.vue
index 1690eeb..7497e73 100644
--- a/src/views/system/notice/DetailModal.vue
+++ b/src/views/system/notice/DetailModal.vue
@@ -1,11 +1,11 @@
 <template>
   <BasicModal v-bind="$attrs" @register="registerModal" title="查看详情" :showCancelBtn="false" :showOkBtn="false" :height="500">
-    <iframe :src="frameSrc" class="detail-iframe"/>
+    <iframe :src="frameSrc" class="detail-iframe" />
   </BasicModal>
 </template>
 <script lang="ts" setup>
-  import {BasicModal, useModalInner} from '/@/components/Modal';
-  import {propTypes} from '/@/utils/propTypes';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { propTypes } from '/@/utils/propTypes';
   // 获取props
   defineProps({
     frameSrc: propTypes.string.def(''),
diff --git a/src/views/system/notice/NoticeModal.vue b/src/views/system/notice/NoticeModal.vue
index 838ec40..84bc9e3 100644
--- a/src/views/system/notice/NoticeModal.vue
+++ b/src/views/system/notice/NoticeModal.vue
@@ -1,54 +1,54 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit" width="900px" destroyOnClose>
-        <BasicForm @register="registerForm"/>
-    </BasicModal>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit" width="900px" destroyOnClose>
+    <BasicForm @register="registerForm" />
+  </BasicModal>
 </template>
 <script lang="ts" setup>
-    import {ref, computed, unref} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {BasicForm, useForm} from '/@/components/Form/index';
-    import {formSchema} from './notice.data';
-    import {saveOrUpdate} from './notice.api';
-    // 声明Emits
-    const emit = defineEmits(['register','success']);
-    const isUpdate = ref(true);
-    //表单配置
-    const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
-        schemas: formSchema,
-        showActionButtonGroup: false
-    });
-    //表单赋值
-    const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-        //重置表单
-        await resetFields();
-        setModalProps({confirmLoading: false});
-        isUpdate.value = !!data?.isUpdate;
-        if (unref(isUpdate)) {
-            if(data.record.userIds){
-                data.record.userIds = data.record.userIds.substring(0,data.record.userIds.length - 1);
-            }
-            //表单赋值
-            await setFieldsValue({
-                ...data.record,
-            });
-        }
-    });
-    //设置标题
-    const title = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
-    //表单提交事件
-    async function handleSubmit(v) {
-        try {
-            let values = await validate();
-            setModalProps({confirmLoading: true});
-            //提交表单
-            values.userIds += ","
-            await saveOrUpdate(values, isUpdate.value);
-            //关闭弹窗
-            closeModal();
-            //刷新列表
-            emit('success');
-        } finally {
-            setModalProps({confirmLoading: false});
-        }
+  import { ref, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { formSchema } from './notice.data';
+  import { saveOrUpdate } from './notice.api';
+  // 声明Emits
+  const emit = defineEmits(['register', 'success']);
+  const isUpdate = ref(true);
+  //表单配置
+  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
+    schemas: formSchema,
+    showActionButtonGroup: false,
+  });
+  //表单赋值
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    //重置表单
+    await resetFields();
+    setModalProps({ confirmLoading: false });
+    isUpdate.value = !!data?.isUpdate;
+    if (unref(isUpdate)) {
+      if (data.record.userIds) {
+        data.record.userIds = data.record.userIds.substring(0, data.record.userIds.length - 1);
+      }
+      //表单赋值
+      await setFieldsValue({
+        ...data.record,
+      });
     }
+  });
+  //设置标题
+  const title = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
+  //表单提交事件
+  async function handleSubmit(v) {
+    try {
+      let values = await validate();
+      setModalProps({ confirmLoading: true });
+      //提交表单
+      values.userIds += ',';
+      await saveOrUpdate(values, isUpdate.value);
+      //关闭弹窗
+      closeModal();
+      //刷新列表
+      emit('success');
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
+  }
 </script>
diff --git a/src/views/system/notice/index.vue b/src/views/system/notice/index.vue
index ff6f83e..88a6cfe 100644
--- a/src/views/system/notice/index.vue
+++ b/src/views/system/notice/index.vue
@@ -1,167 +1,168 @@
 <template>
-    <div>
-        <BasicTable @register="registerTable" :rowSelection="rowSelection">
-            <template #tableTitle>
-                <a-button preIcon="ant-design:plus-outlined" type="primary" @click="handleAdd">新增</a-button>
-                <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
-                <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
-                <a-dropdown v-if="selectedRowKeys.length > 0">
-                    <template #overlay>
-                        <a-menu>
-                            <a-menu-item key="1" @click="batchHandleDelete">
-                                <Icon icon="ant-design:delete-outlined"></Icon>
-                                删除
-                            </a-menu-item>
-                        </a-menu>
-                    </template>
-                    <a-button>批量操作
-                        <Icon style="fontSize:12px" icon="ant-design:down-outlined"></Icon>
-                    </a-button>
-                </a-dropdown>
-            </template>
-            <template #action="{ record }">
-                <TableAction :actions="getActions(record)" :dropDownActions="getDropDownAction(record)"/>
-            </template>
-        </BasicTable>
-        <NoticeModal @register="registerModal" @success="reload"/>
-        <DetailModal @register="register" :frameSrc="iframeUrl"/>
-    </div>
+  <div>
+    <BasicTable @register="registerTable" :rowSelection="rowSelection">
+      <template #tableTitle>
+        <a-button preIcon="ant-design:plus-outlined" type="primary" @click="handleAdd">新增</a-button>
+        <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
+        <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
+        <a-dropdown v-if="selectedRowKeys.length > 0">
+          <template #overlay>
+            <a-menu>
+              <a-menu-item key="1" @click="batchHandleDelete">
+                <Icon icon="ant-design:delete-outlined"></Icon>
+                删除
+              </a-menu-item>
+            </a-menu>
+          </template>
+          <a-button
+            >批量操作
+            <Icon style="fontsize: 12px" icon="ant-design:down-outlined"></Icon>
+          </a-button>
+        </a-dropdown>
+      </template>
+      <template #action="{ record }">
+        <TableAction :actions="getActions(record)" :dropDownActions="getDropDownAction(record)" />
+      </template>
+    </BasicTable>
+    <NoticeModal @register="registerModal" @success="reload" />
+    <DetailModal @register="register" :frameSrc="iframeUrl" />
+  </div>
 </template>
 <script lang="ts" name="system-notice" setup>
-    import {ref} from 'vue';
-    import {BasicTable, TableAction} from '/@/components/Table';
-    import {useModal} from '/@/components/Modal';
-    import NoticeModal from './NoticeModal.vue';
-    import DetailModal from './DetailModal.vue';
-    import {useMethods} from '/@/hooks/system/useMethods';
-    import {useGlobSetting} from '/@/hooks/setting';
-    import { getToken } from '/@/utils/auth';
-    import {columns, searchFormSchema} from './notice.data';
-    import {getList, deleteNotice, batchDeleteNotice, getExportUrl,getImportUrl, doReleaseData, doReovkeData} from './notice.api';
-    import { useListPage } from '/@/hooks/system/useListPage';
-    const glob = useGlobSetting();
-    const [registerModal, {openModal}] = useModal();
-    const [register, {openModal:openDetail}] = useModal();
-    const iframeUrl = ref('');
+  import { ref } from 'vue';
+  import { BasicTable, TableAction } from '/@/components/Table';
+  import { useModal } from '/@/components/Modal';
+  import NoticeModal from './NoticeModal.vue';
+  import DetailModal from './DetailModal.vue';
+  import { useMethods } from '/@/hooks/system/useMethods';
+  import { useGlobSetting } from '/@/hooks/setting';
+  import { getToken } from '/@/utils/auth';
+  import { columns, searchFormSchema } from './notice.data';
+  import { getList, deleteNotice, batchDeleteNotice, getExportUrl, getImportUrl, doReleaseData, doReovkeData } from './notice.api';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  const glob = useGlobSetting();
+  const [registerModal, { openModal }] = useModal();
+  const [register, { openModal: openDetail }] = useModal();
+  const iframeUrl = ref('');
 
-    // 列表页面公共参数、方法
-    const { prefixCls, onExportXls, onImportXls, tableContext } = useListPage({
-      designScope: 'notice-template',
-      tableProps: {
-        title: '消息通知',
-        api: getList,
-        columns: columns,
-        formConfig: {
-          schemas: searchFormSchema,
+  // 列表页面公共参数、方法
+  const { prefixCls, onExportXls, onImportXls, tableContext } = useListPage({
+    designScope: 'notice-template',
+    tableProps: {
+      title: '消息通知',
+      api: getList,
+      columns: columns,
+      formConfig: {
+        schemas: searchFormSchema,
+      },
+    },
+    exportConfig: {
+      name: '消息通知列表',
+      url: getExportUrl,
+    },
+    importConfig: {
+      url: getImportUrl,
+    },
+  });
+
+  const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;
+
+  /**
+   * 新增事件
+   */
+  function handleAdd() {
+    openModal(true, {
+      isUpdate: false,
+    });
+  }
+
+  /**
+   * 编辑事件
+   */
+  function handleEdit(record) {
+    openModal(true, {
+      record,
+      isUpdate: true,
+    });
+  }
+
+  /**
+   * 删除事件
+   */
+  async function handleDelete(record) {
+    await deleteNotice({ id: record.id }, reload);
+  }
+
+  /**
+   * 批量删除事件
+   */
+  async function batchHandleDelete() {
+    await batchDeleteNotice({ ids: selectedRowKeys.value }, reload);
+  }
+  /**
+   * 发布
+   */
+  async function handleRelease(id) {
+    await doReleaseData({ id });
+    reload();
+  }
+  /**
+   * 撤销
+   */
+  async function handleReovke(id) {
+    await doReovkeData({ id });
+    reload();
+  }
+  /**
+   * 查看
+   */
+  function handleDetail(record) {
+    iframeUrl.value = `${glob.uploadUrl}/sys/annountCement/show/${record.id}?token=${getToken()}`;
+    openDetail(true);
+  }
+  /**
+   * 操作列定义
+   * @param record
+   */
+  function getActions(record) {
+    return [
+      {
+        label: '编辑',
+        onClick: handleEdit.bind(null, record),
+        ifShow: record.sendStatus == 0,
+      },
+    ];
+  }
+  /**
+   * 下拉操作栏
+   */
+  function getDropDownAction(record) {
+    return [
+      {
+        label: '删除',
+        ifShow: record.sendStatus != 1,
+        popConfirm: {
+          title: '是否确认删除',
+          confirm: handleDelete.bind(null, record),
         },
       },
-      exportConfig: {
-        name:"消息通知列表",
-        url: getExportUrl,
+      {
+        label: '发布',
+        ifShow: record.sendStatus == 0,
+        onClick: handleRelease.bind(null, record.id),
       },
-      importConfig: {
-        url: getImportUrl
-      }
-    })
-
-    const [registerTable, {reload},{ rowSelection, selectedRowKeys }] = tableContext;
-
-    /**
-     * 新增事件
-     */
-    function handleAdd() {
-        openModal(true, {
-            isUpdate: false,
-        });
-    }
-
-    /**
-     * 编辑事件
-     */
-    function handleEdit(record) {
-        openModal(true, {
-            record,
-            isUpdate: true,
-        });
-    }
-
-    /**
-     * 删除事件
-     */
-    async function handleDelete(record) {
-        await deleteNotice({id: record.id}, reload);
-    }
-
-    /**
-     * 批量删除事件
-     */
-    async function batchHandleDelete() {
-        await batchDeleteNotice({ids: selectedRowKeys.value}, reload);
-    }
-    /**
-     * 发布
-     */
-    async function handleRelease(id) {
-      await doReleaseData({id});
-      reload()
-    }
-    /**
-     * 撤销
-     */
-    async function handleReovke(id) {
-      await doReovkeData({id});
-      reload()
-    }
-    /**
-     * 查看
-     */
-    function handleDetail(record) {
-      iframeUrl.value = `${glob.uploadUrl}/sys/annountCement/show/${record.id}?token=${getToken()}`
-      openDetail(true)
-    }
-    /**
-     * 操作列定义
-     * @param record
-     */
-    function getActions(record) {
-      return [
-        {
-          label: '编辑',
-          onClick: handleEdit.bind(null, record),
-          ifShow: record.sendStatus == 0
-        }
-      ]
-    }
-    /**
-     * 下拉操作栏
-     */
-    function getDropDownAction(record) {
-      return [
-        {
-          label: '删除',
-          ifShow: record.sendStatus != 1,
-          popConfirm: {
-            title: '是否确认删除',
-            confirm: handleDelete.bind(null, record),
-          },
+      {
+        label: '撤销',
+        ifShow: record.sendStatus == 1,
+        popConfirm: {
+          title: '确定要撤销吗？',
+          confirm: handleReovke.bind(null, record.id),
         },
-        {
-          label: '发布',
-          ifShow: record.sendStatus == 0,
-          onClick: handleRelease.bind(null, record.id),
-        },
-        {
-          label: '撤销',
-          ifShow: record.sendStatus == 1,
-          popConfirm: {
-            title: '确定要撤销吗？',
-            confirm: handleReovke.bind(null, record.id),
-          },
-        },
-        {
-          label: '查看',
-          onClick: handleDetail.bind(null, record),
-        }
-      ]
-    }
+      },
+      {
+        label: '查看',
+        onClick: handleDetail.bind(null, record),
+      },
+    ];
+  }
 </script>
diff --git a/src/views/system/notice/notice.api.ts b/src/views/system/notice/notice.api.ts
index d8d3d97..12eae4d 100644
--- a/src/views/system/notice/notice.api.ts
+++ b/src/views/system/notice/notice.api.ts
@@ -1,16 +1,16 @@
-import {defHttp} from '/@/utils/http/axios';
-import {Modal} from 'ant-design-vue';
+import { defHttp } from '/@/utils/http/axios';
+import { Modal } from 'ant-design-vue';
 
 enum Api {
-  list = "/sys/annountCement/list",
-  save = "/sys/annountCement/add",
-  edit = "/sys/annountCement/edit",
-  delete = "/sys/annountCement/delete",
-  deleteBatch = "/sys/annountCement/deleteBatch",
-  exportXls = "/sys/annountCement/exportXls",
-  importExcel = "/sys/annountCement/importExcel",
-  releaseData = "/sys/annountCement/doReleaseData",
-  reovkeData = "/sys/annountCement/doReovkeData",
+  list = '/sys/annountCement/list',
+  save = '/sys/annountCement/add',
+  edit = '/sys/annountCement/edit',
+  delete = '/sys/annountCement/delete',
+  deleteBatch = '/sys/annountCement/deleteBatch',
+  exportXls = '/sys/annountCement/exportXls',
+  importExcel = '/sys/annountCement/importExcel',
+  releaseData = '/sys/annountCement/doReleaseData',
+  reovkeData = '/sys/annountCement/doReovkeData',
 }
 
 /**
@@ -26,8 +26,8 @@ export const getImportUrl = Api.importExcel;
  * @param params
  */
 export const getList = (params) => {
-  return defHttp.get({url: Api.list, params});
-}
+  return defHttp.get({ url: Api.list, params });
+};
 
 /**
  * 保存或者更新通告
@@ -35,18 +35,18 @@ export const getList = (params) => {
  */
 export const saveOrUpdate = (params, isUpdate) => {
   let url = isUpdate ? Api.edit : Api.save;
-  return defHttp.post({url: url, params});
-}
+  return defHttp.post({ url: url, params });
+};
 
 /**
  * 删除通告
  * @param params
  */
 export const deleteNotice = (params, handleSuccess) => {
-  return defHttp.delete({url: Api.delete, data: params}, {joinParamsToUrl: true}).then(() => {
+  return defHttp.delete({ url: Api.delete, data: params }, { joinParamsToUrl: true }).then(() => {
     handleSuccess();
   });
-}
+};
 
 /**
  * 批量删除租户
@@ -59,22 +59,20 @@ export const batchDeleteNotice = (params, handleSuccess) => {
     okText: '确认',
     cancelText: '取消',
     onOk: () => {
-      return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
+      return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => {
         handleSuccess();
       });
-    }
+    },
   });
-}
+};
 
 /**
  * 发布
  * @param id
  */
-export const doReleaseData = (params) =>
-  defHttp.get({url: Api.releaseData, params});
+export const doReleaseData = (params) => defHttp.get({ url: Api.releaseData, params });
 /**
  * 撤销
  * @param id
  */
-export const doReovkeData = (params) =>
-  defHttp.get({url: Api.reovkeData, params});
+export const doReovkeData = (params) => defHttp.get({ url: Api.reovkeData, params });
diff --git a/src/views/system/notice/notice.data.ts b/src/views/system/notice/notice.data.ts
index 52a9f6a..10ccbb8 100644
--- a/src/views/system/notice/notice.data.ts
+++ b/src/views/system/notice/notice.data.ts
@@ -12,8 +12,8 @@ export const columns: BasicColumn[] = [
     title: '消息类型',
     dataIndex: 'msgCategory',
     width: 100,
-    customRender: ({text}) => {
-        return  render.renderDict(text, 'msg_category')
+    customRender: ({ text }) => {
+      return render.renderDict(text, 'msg_category');
     },
   },
   {
@@ -25,27 +25,27 @@ export const columns: BasicColumn[] = [
     title: '优先级',
     dataIndex: 'priority',
     width: 70,
-    customRender: ({text}) => {
-        const color = text=='L'?'blue':text=='M'?'yellow':'red';
-        return  render.renderTag(render.renderDict(text, 'priority'),color)
+    customRender: ({ text }) => {
+      const color = text == 'L' ? 'blue' : text == 'M' ? 'yellow' : 'red';
+      return render.renderTag(render.renderDict(text, 'priority'), color);
     },
   },
   {
     title: '通告对象',
     dataIndex: 'msgType',
     width: 100,
-    customRender: ({text}) => {
-      return  render.renderDict(text, 'msg_type')
+    customRender: ({ text }) => {
+      return render.renderDict(text, 'msg_type');
     },
   },
   {
     title: '发布状态',
     dataIndex: 'sendStatus',
     width: 70,
-    customRender: ({text}) => {
-      const color = text=='0'?'red':text=='1'?'green':'gray';
-      return  render.renderTag(render.renderDict(text, 'send_status'),color)
-    }
+    customRender: ({ text }) => {
+      const color = text == '0' ? 'red' : text == '1' ? 'green' : 'gray';
+      return render.renderTag(render.renderDict(text, 'send_status'), color);
+    },
   },
   {
     title: '发布时间',
@@ -56,7 +56,7 @@ export const columns: BasicColumn[] = [
     title: '撤销时间',
     width: 100,
     dataIndex: 'cancelTime',
-  }
+  },
 ];
 
 export const searchFormSchema: FormSchema[] = [
@@ -64,8 +64,8 @@ export const searchFormSchema: FormSchema[] = [
     field: 'titile',
     label: '标题',
     component: 'JInput',
-    colProps: {span: 8},
-  }
+    colProps: { span: 8 },
+  },
 ];
 
 export const formSchema: FormSchema[] = [
@@ -73,18 +73,18 @@ export const formSchema: FormSchema[] = [
     field: 'id',
     label: 'id',
     component: 'Input',
-    show:false
+    show: false,
   },
   {
     field: 'msgCategory',
     label: '消息类型',
     required: true,
     component: 'JDictSelectTag',
-    defaultValue:'1',
+    defaultValue: '1',
     componentProps: {
-      type:'radio',
-      dictCode:'msg_category',
-      placeholder:'请选择类型',
+      type: 'radio',
+      dictCode: 'msg_category',
+      placeholder: '请选择类型',
     },
   },
   {
@@ -94,13 +94,13 @@ export const formSchema: FormSchema[] = [
     required: true,
     componentProps: {
       placeholder: '请输入标题',
-    }
+    },
   },
   {
     field: 'msgAbstract',
     label: '摘要',
     component: 'InputTextArea',
-    required: true
+    required: true,
   },
   {
     field: 'endTime',
@@ -111,18 +111,18 @@ export const formSchema: FormSchema[] = [
       valueFormat: 'YYYY-MM-DD HH:mm:ss',
       placeholder: '请选择截至日期',
     },
-    dynamicRules: ({model}) => rules.endTime(model.startTime,true),
+    dynamicRules: ({ model }) => rules.endTime(model.startTime, true),
   },
   {
     field: 'msgType',
     label: '接收用户',
-    defaultValue:'ALL',
+    defaultValue: 'ALL',
     component: 'JDictSelectTag',
     required: true,
     componentProps: {
-       type:'radio',
-       dictCode:'msg_type',
-       placeholder:'请选择发布范围'
+      type: 'radio',
+      dictCode: 'msg_type',
+      placeholder: '请选择发布范围',
     },
   },
   {
@@ -131,20 +131,20 @@ export const formSchema: FormSchema[] = [
     component: 'JSelectUser',
     required: true,
     componentProps: {
-      rowKey: "id",
-      labelKey: "username"
+      rowKey: 'id',
+      labelKey: 'username',
     },
-    ifShow: ({values}) => values.msgType=='USER',
+    ifShow: ({ values }) => values.msgType == 'USER',
   },
   {
     field: 'priority',
     label: '优先级',
-    defaultValue:'H',
+    defaultValue: 'H',
     component: 'JDictSelectTag',
     componentProps: {
-      dictCode:'priority',
-      type:'radio',
-      placeholder:'请选择优先级'
+      dictCode: 'priority',
+      type: 'radio',
+      placeholder: '请选择优先级',
     },
   },
   {
@@ -152,5 +152,5 @@ export const formSchema: FormSchema[] = [
     label: '内容',
     component: 'Input',
     render: render.renderTinymce,
-  }
+  },
 ];
diff --git a/src/views/system/ossfile/index.vue b/src/views/system/ossfile/index.vue
index 27023e6..cfb40af 100644
--- a/src/views/system/ossfile/index.vue
+++ b/src/views/system/ossfile/index.vue
@@ -1,144 +1,143 @@
 <template>
-    <div>
-        <!--引用表格-->
-        <BasicTable @register="registerTable">
-            <!--插槽:table标题-->
-            <template #tableTitle>
-                <a-upload name="file" :showUploadList="false" :action="ossAction" :headers="tokenHeader" :beforeUpload="beforeUpload" @change="handleChange">
-                    <a-button type="primary" preIcon="ant-design:upload-outlined">OSS文件上传</a-button>
-                </a-upload>
-                <a-upload name="file" :showUploadList="false" :action="minioAction" :headers="tokenHeader" :beforeUpload="beforeUpload" @change="handleChange">
-                    <a-button type="primary" preIcon="ant-design:upload-outlined">MINIO文件上传</a-button>
-                </a-upload>
-            </template>
-            <!--操作栏-->
-            <template #action="{ record }">
-                <TableAction :actions="getTableAction(record)"/>
-            </template>
-        </BasicTable>
-    </div>
+  <div>
+    <!--引用表格-->
+    <BasicTable @register="registerTable">
+      <!--插槽:table标题-->
+      <template #tableTitle>
+        <a-upload name="file" :showUploadList="false" :action="ossAction" :headers="tokenHeader" :beforeUpload="beforeUpload" @change="handleChange">
+          <a-button type="primary" preIcon="ant-design:upload-outlined">OSS文件上传</a-button>
+        </a-upload>
+        <a-upload name="file" :showUploadList="false" :action="minioAction" :headers="tokenHeader" :beforeUpload="beforeUpload" @change="handleChange">
+          <a-button type="primary" preIcon="ant-design:upload-outlined">MINIO文件上传</a-button>
+        </a-upload>
+      </template>
+      <!--操作栏-->
+      <template #action="{ record }">
+        <TableAction :actions="getTableAction(record)" />
+      </template>
+    </BasicTable>
+  </div>
 </template>
 
 <script lang="ts" name="system-ossfile" setup>
-    //ts语法
-    import {ref, computed, unref} from 'vue';
-    import {BasicTable, useTable, TableAction} from '/@/components/Table';
-    import {useMessage} from '/@/hooks/web/useMessage';
-    import {columns, searchFormSchema} from './ossfile.data';
-    import {list, deleteFile, getOssUrl, getMinioUrl} from './ossfile.api';
-    import {useGlobSetting} from '/@/hooks/setting';
-    import {getToken} from '/@/utils/auth';
+  //ts语法
+  import { ref, computed, unref } from 'vue';
+  import { BasicTable, useTable, TableAction } from '/@/components/Table';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { columns, searchFormSchema } from './ossfile.data';
+  import { list, deleteFile, getOssUrl, getMinioUrl } from './ossfile.api';
+  import { useGlobSetting } from '/@/hooks/setting';
+  import { getToken } from '/@/utils/auth';
 
-    const {createMessage} = useMessage();
-    const glob = useGlobSetting();
-    const tokenHeader = {'X-Access-Token': getToken()};
-    //注册table数据
-    const [registerTable, {reload}] = useTable({
-        api: list,
-        rowKey: 'id',
-        columns,
-        formConfig: {
-            labelWidth: 120,
-            schemas: searchFormSchema,
-            autoSubmitOnEnter: true,
+  const { createMessage } = useMessage();
+  const glob = useGlobSetting();
+  const tokenHeader = { 'X-Access-Token': getToken() };
+  //注册table数据
+  const [registerTable, { reload }] = useTable({
+    api: list,
+    rowKey: 'id',
+    columns,
+    formConfig: {
+      labelWidth: 120,
+      schemas: searchFormSchema,
+      autoSubmitOnEnter: true,
+    },
+    striped: true,
+    useSearchForm: true,
+    showTableSetting: true,
+    clickToRowSelect: false,
+    bordered: true,
+    showIndexColumn: false,
+    tableSetting: { fullScreen: true },
+    beforeFetch: (params) => {
+      return Object.assign({ column: 'createTime', order: 'desc' }, params);
+    },
+    actionColumn: {
+      width: 80,
+      title: '操作',
+      dataIndex: 'action',
+      slots: { customRender: 'action' },
+      fixed: undefined,
+    },
+  });
+  /**
+   * 上传url
+   */
+  const ossAction = computed(() => `${glob.uploadUrl}${getOssUrl}`);
+  const minioAction = computed(() => `${glob.uploadUrl}${getMinioUrl}`);
+
+  /**
+   * 预览
+   */
+  function handleView(record) {
+    if (record && record.url) {
+      //TODO 这种地址需不需要拿出去？
+      console.log('glob.onlineUrl', glob.viewUrl);
+      let url = `${glob.viewUrl}?url=` + encodeURIComponent(record.url);
+      window.open(url, '_blank');
+    }
+  }
+
+  /**
+   * 删除事件
+   */
+  async function handleDelete(record) {
+    await deleteFile({ id: record.id }, reload);
+  }
+
+  /**
+   * 上传前事件
+   */
+  function beforeUpload(file) {
+    var fileType = file.type;
+    if (fileType === 'image') {
+      if (fileType.indexOf('image') < 0) {
+        createMessage.warning('请上传图片');
+        return false;
+      }
+    } else if (fileType === 'file') {
+      if (fileType.indexOf('image') >= 0) {
+        createMessage.warning('请上传文件');
+        return false;
+      }
+    }
+    return true;
+  }
+
+  /**
+   * 文件上传事件
+   */
+  function handleChange(info) {
+    if (info.file.status === 'done') {
+      if (info.file.response.success) {
+        reload();
+        createMessage.success(`${info.file.name} 上传成功!`);
+      } else {
+        createMessage.error(`${info.file.response.message}`);
+      }
+    } else if (info.file.status === 'error') {
+      createMessage.error(`${info.file.response.message}`);
+    }
+  }
+
+  /**
+   * 操作栏
+   */
+  function getTableAction(record) {
+    return [
+      {
+        label: '预览',
+        onClick: handleView.bind(null, record),
+      },
+      {
+        label: '删除',
+        popConfirm: {
+          title: '是否确认删除',
+          confirm: handleDelete.bind(null, record),
         },
-        striped: true,
-        useSearchForm: true,
-        showTableSetting: true,
-        clickToRowSelect: false,
-        bordered: true,
-        showIndexColumn: false,
-        tableSetting: {fullScreen: true},
-        beforeFetch:(params)=>{
-            return Object.assign({'column':'createTime','order':"desc"},params)
-        },
-        actionColumn: {
-            width: 80,
-            title: '操作',
-            dataIndex: 'action',
-            slots: {customRender: 'action'},
-            fixed: undefined,
-        }
-    });
-    /**
-     * 上传url
-     */
-    const ossAction = computed(() => `${glob.uploadUrl}${getOssUrl}`);
-    const minioAction = computed(() => `${glob.uploadUrl}${getMinioUrl}`);
-
-    /**
-     * 预览
-     */
-    function handleView(record) {
-        if (record && record.url) {
-            //TODO 这种地址需不需要拿出去？
-            console.log("glob.onlineUrl", glob.viewUrl);
-            let url = `${glob.viewUrl}?url=`+ encodeURIComponent(record.url)
-            window.open(url, '_blank')
-        }
-    }
-
-    /**
-     * 删除事件
-     */
-    async function handleDelete(record) {
-        await deleteFile({id: record.id}, reload);
-    }
-
-    /**
-     * 上传前事件
-     */
-    function beforeUpload(file) {
-        var fileType = file.type;
-        if (fileType === 'image') {
-            if (fileType.indexOf('image') < 0) {
-                createMessage.warning('请上传图片');
-                return false;
-            }
-        } else if (fileType === 'file') {
-            if (fileType.indexOf('image') >= 0) {
-                createMessage.warning('请上传文件');
-                return false;
-            }
-        }
-        return true
-    }
-
-    /**
-     * 文件上传事件
-     */
-    function handleChange(info) {
-        if (info.file.status === 'done') {
-            if (info.file.response.success) {
-                reload();
-                createMessage.success(`${info.file.name} 上传成功!`);
-            } else {
-                createMessage.error(`${info.file.response.message}`);
-            }
-        } else if (info.file.status === 'error') {
-            createMessage.error(`${info.file.response.message}`);
-        }
-    }
-
-    /**
-     * 操作栏
-     */
-    function getTableAction(record) {
-        return [
-            {
-                label: '预览',
-                onClick: handleView.bind(null, record),
-            }, {
-                label: '删除',
-                popConfirm: {
-                    title: '是否确认删除',
-                    confirm: handleDelete.bind(null, record),
-                },
-            }
-        ]
-    }
+      },
+    ];
+  }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/views/system/ossfile/ossfile.api.ts b/src/views/system/ossfile/ossfile.api.ts
index e80fbfe..fe08466 100644
--- a/src/views/system/ossfile/ossfile.api.ts
+++ b/src/views/system/ossfile/ossfile.api.ts
@@ -1,10 +1,10 @@
-import {defHttp} from '/@/utils/http/axios';
+import { defHttp } from '/@/utils/http/axios';
 
 enum Api {
-    list = '/sys/oss/file/list',
-    deleteFile = '/sys/oss/file/delete',
-    ossUpload = '/sys/oss/file/upload',
-    minioUpload = '/sys/upload/uploadMinio',
+  list = '/sys/oss/file/list',
+  deleteFile = '/sys/oss/file/delete',
+  ossUpload = '/sys/oss/file/upload',
+  minioUpload = '/sys/upload/uploadMinio',
 }
 
 /**
@@ -21,14 +21,13 @@ export const getMinioUrl = Api.minioUpload;
  * 列表接口
  * @param params
  */
-export const list = (params) =>
-    defHttp.get({url: Api.list, params});
+export const list = (params) => defHttp.get({ url: Api.list, params });
 
 /**
  * 删除用户
  */
 export const deleteFile = (params, handleSuccess) => {
-    return defHttp.delete({url: Api.deleteFile, params}, {joinParamsToUrl: true}).then(() => {
-        handleSuccess();
-    });
-}
+  return defHttp.delete({ url: Api.deleteFile, params }, { joinParamsToUrl: true }).then(() => {
+    handleSuccess();
+  });
+};
diff --git a/src/views/system/ossfile/ossfile.data.ts b/src/views/system/ossfile/ossfile.data.ts
index 389c4fc..abd0839 100644
--- a/src/views/system/ossfile/ossfile.data.ts
+++ b/src/views/system/ossfile/ossfile.data.ts
@@ -1,28 +1,30 @@
-import {BasicColumn} from '/@/components/Table';
-import {FormSchema} from '/@/components/Table';
+import { BasicColumn } from '/@/components/Table';
+import { FormSchema } from '/@/components/Table';
 
 export const columns: BasicColumn[] = [
-    {
-        title: '文件名称',
-        dataIndex: 'fileName',
-        width: 120,
-    },
-    {
-        title: '文件地址',
-        dataIndex: 'url',
-        width: 100,
-    }];
+  {
+    title: '文件名称',
+    dataIndex: 'fileName',
+    width: 120,
+  },
+  {
+    title: '文件地址',
+    dataIndex: 'url',
+    width: 100,
+  },
+];
 
 export const searchFormSchema: FormSchema[] = [
-    {
-        label: '文件名称',
-        field: 'fileName',
-        component: 'Input',
-        colProps: {span: 6},
-    },
-    {
-        label: '文件地址',
-        field: 'url',
-        component: 'Input',
-        colProps: {span: 6},
-    }];
+  {
+    label: '文件名称',
+    field: 'fileName',
+    component: 'Input',
+    colProps: { span: 6 },
+  },
+  {
+    label: '文件地址',
+    field: 'url',
+    component: 'Input',
+    colProps: { span: 6 },
+  },
+];
diff --git a/src/views/system/position/PositionModal.vue b/src/views/system/position/PositionModal.vue
index c08b70e..fc1df98 100644
--- a/src/views/system/position/PositionModal.vue
+++ b/src/views/system/position/PositionModal.vue
@@ -1,53 +1,53 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" :width="700">
-        <BasicForm @register="registerForm"/>
-    </BasicModal>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" :width="700">
+    <BasicForm @register="registerForm" />
+  </BasicModal>
 </template>
 <script lang="ts" setup>
-    import {ref, computed, unref} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {BasicForm, useForm} from '/@/components/Form/index';
-    import {formSchema} from './position.data';
-    import {saveOrUpdatePosition, getPositionById} from './position.api';
-    // 声明Emits
-    const emit = defineEmits(['success','register']);
-    const isUpdate = ref(true);
-    //表单配置
-    const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
-        labelWidth: 150,
-        schemas: formSchema,
-        showActionButtonGroup: false,
-    });
-    //表单赋值
-    const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-        //重置表单
-        await resetFields();
-        setModalProps({confirmLoading: false});
-        isUpdate.value = !!data?.isUpdate;
-        if (unref(isUpdate)) {
-            //获取详情
-            data.record = await getPositionById({id: data.record.id});
-            //表单赋值
-            await setFieldsValue({
-                ...data.record,
-            });
-        }
-    });
-    //设置标题
-    const getTitle = computed(() => (!unref(isUpdate) ? '新增职务' : '编辑职务'));
-    //表单提交事件
-    async function handleSubmit() {
-        try {
-            const values = await validate();
-            setModalProps({confirmLoading: true});
-            //提交表单
-            await saveOrUpdatePosition(values, isUpdate.value);
-            //关闭弹窗
-            closeModal();
-            //刷新列表
-            emit('success');
-        } finally {
-            setModalProps({confirmLoading: false});
-        }
+  import { ref, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { formSchema } from './position.data';
+  import { saveOrUpdatePosition, getPositionById } from './position.api';
+  // 声明Emits
+  const emit = defineEmits(['success', 'register']);
+  const isUpdate = ref(true);
+  //表单配置
+  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
+    labelWidth: 150,
+    schemas: formSchema,
+    showActionButtonGroup: false,
+  });
+  //表单赋值
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    //重置表单
+    await resetFields();
+    setModalProps({ confirmLoading: false });
+    isUpdate.value = !!data?.isUpdate;
+    if (unref(isUpdate)) {
+      //获取详情
+      data.record = await getPositionById({ id: data.record.id });
+      //表单赋值
+      await setFieldsValue({
+        ...data.record,
+      });
     }
+  });
+  //设置标题
+  const getTitle = computed(() => (!unref(isUpdate) ? '新增职务' : '编辑职务'));
+  //表单提交事件
+  async function handleSubmit() {
+    try {
+      const values = await validate();
+      setModalProps({ confirmLoading: true });
+      //提交表单
+      await saveOrUpdatePosition(values, isUpdate.value);
+      //关闭弹窗
+      closeModal();
+      //刷新列表
+      emit('success');
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
+  }
 </script>
diff --git a/src/views/system/position/index.vue b/src/views/system/position/index.vue
index 9cea237..0c7a291 100644
--- a/src/views/system/position/index.vue
+++ b/src/views/system/position/index.vue
@@ -1,116 +1,116 @@
 <template>
-    <div>
-        <BasicTable @register="registerTable" :rowSelection="rowSelection">
-            <template #tableTitle>
-              <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleAdd">新增</a-button>
-              <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
-              <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
-              <a-dropdown v-if="selectedRowKeys.length > 0">
-                    <template #overlay>
-                        <a-menu>
-                            <a-menu-item key="1" @click="batchHandleDelete">
-                                <Icon icon="ant-design:delete-outlined"></Icon>
-                                删除
-                            </a-menu-item>
-                        </a-menu>
-                    </template>
-                    <a-button>批量操作
-                        <Icon icon="ant-design:down-outlined"></Icon>
-                    </a-button>
-                </a-dropdown>
-
-            </template>
-            <template #action="{ record }">
-                <TableAction :actions="getActions(record)"/>
-            </template>
-        </BasicTable>
-        <PositionModal @register="registerModal" @success="reload"/>
-    </div>
+  <div>
+    <BasicTable @register="registerTable" :rowSelection="rowSelection">
+      <template #tableTitle>
+        <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleAdd">新增</a-button>
+        <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
+        <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
+        <a-dropdown v-if="selectedRowKeys.length > 0">
+          <template #overlay>
+            <a-menu>
+              <a-menu-item key="1" @click="batchHandleDelete">
+                <Icon icon="ant-design:delete-outlined"></Icon>
+                删除
+              </a-menu-item>
+            </a-menu>
+          </template>
+          <a-button
+            >批量操作
+            <Icon icon="ant-design:down-outlined"></Icon>
+          </a-button>
+        </a-dropdown>
+      </template>
+      <template #action="{ record }">
+        <TableAction :actions="getActions(record)" />
+      </template>
+    </BasicTable>
+    <PositionModal @register="registerModal" @success="reload" />
+  </div>
 </template>
 <script lang="ts" name="system-position" setup>
-    import {ref} from 'vue';
-    import {BasicTable, TableAction} from '/@/components/Table';
-    import {useModal} from '/@/components/Modal';
-    import {getPositionList, deletePosition, batchDeletePosition,customUpload,getExportUrl,getImportUrl} from './position.api';
-    import {columns, searchFormSchema} from './position.data';
-    import PositionModal from './PositionModal.vue';
-    import {useMessage} from "/@/hooks/web/useMessage";
-    import { useListPage } from '/@/hooks/system/useListPage'
-    const {createMessage} = useMessage();
-    const [registerModal, {openModal}] = useModal();
+  import { ref } from 'vue';
+  import { BasicTable, TableAction } from '/@/components/Table';
+  import { useModal } from '/@/components/Modal';
+  import { getPositionList, deletePosition, batchDeletePosition, customUpload, getExportUrl, getImportUrl } from './position.api';
+  import { columns, searchFormSchema } from './position.data';
+  import PositionModal from './PositionModal.vue';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  const { createMessage } = useMessage();
+  const [registerModal, { openModal }] = useModal();
 
-    // 列表页面公共参数、方法
-    const { prefixCls, onExportXls, onImportXls, tableContext } = useListPage({
-      designScope: 'position-template',
-      tableProps: {
-        title: '职务列表',
-        api: getPositionList,
-        columns: columns,
-        formConfig: {
-          schemas: searchFormSchema,
+  // 列表页面公共参数、方法
+  const { prefixCls, onExportXls, onImportXls, tableContext } = useListPage({
+    designScope: 'position-template',
+    tableProps: {
+      title: '职务列表',
+      api: getPositionList,
+      columns: columns,
+      formConfig: {
+        schemas: searchFormSchema,
+      },
+    },
+    exportConfig: {
+      name: '职务列表',
+      url: getExportUrl,
+    },
+    importConfig: {
+      url: getImportUrl,
+    },
+  });
+
+  const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;
+
+  /**
+   * 操作列定义
+   * @param record
+   */
+  function getActions(record) {
+    return [
+      {
+        label: '编辑',
+        onClick: handleEdit.bind(null, record),
+      },
+      {
+        label: '删除',
+        popConfirm: {
+          title: '是否确认删除',
+          confirm: handleDelete.bind(null, record),
         },
       },
-      exportConfig: {
-        name:"职务列表",
-        url: getExportUrl
-      },
-      importConfig: {
-        url: getImportUrl
-      }
-    })
+    ];
+  }
 
-    const [registerTable, {reload},{ rowSelection, selectedRowKeys }] = tableContext;
+  /**
+   * 新增事件
+   */
+  function handleAdd() {
+    openModal(true, {
+      isUpdate: false,
+    });
+  }
 
-    /**
-     * 操作列定义
-     * @param record
-     */
-    function getActions(record) {
-        return [
-            {
-				label: '编辑',
-                onClick: handleEdit.bind(null, record),
-            },
-            {
-				label: '删除',
-                popConfirm: {
-                    title: '是否确认删除',
-                    confirm: handleDelete.bind(null, record),
-                },
-            },
-        ]
-    }
+  /**
+   * 编辑事件
+   */
+  function handleEdit(record) {
+    openModal(true, {
+      record,
+      isUpdate: true,
+    });
+  }
 
-    /**
-     * 新增事件
-     */
-    function handleAdd() {
-        openModal(true, {
-            isUpdate: false,
-        });
-    }
+  /**
+   * 删除事件
+   */
+  async function handleDelete(record) {
+    await deletePosition({ id: record.id }, reload);
+  }
 
-    /**
-     * 编辑事件
-     */
-    function handleEdit(record) {
-        openModal(true, {
-            record,
-            isUpdate: true,
-        });
-    }
-
-    /**
-     * 删除事件
-     */
-    async function handleDelete(record) {
-        await deletePosition({id: record.id}, reload);
-    }
-
-    /**
-     * 批量删除事件
-     */
-    async function batchHandleDelete() {
-        await batchDeletePosition({ids: selectedRowKeys.value}, reload);
-    }
+  /**
+   * 批量删除事件
+   */
+  async function batchHandleDelete() {
+    await batchDeletePosition({ ids: selectedRowKeys.value }, reload);
+  }
 </script>
diff --git a/src/views/system/position/position.api.ts b/src/views/system/position/position.api.ts
index 61f3679..5e5e58b 100644
--- a/src/views/system/position/position.api.ts
+++ b/src/views/system/position/position.api.ts
@@ -1,15 +1,15 @@
-import {defHttp} from '/@/utils/http/axios';
-import {Modal} from 'ant-design-vue';
+import { defHttp } from '/@/utils/http/axios';
+import { Modal } from 'ant-design-vue';
 
 enum Api {
-	list = "/sys/position/list",
-	save = "/sys/position/add",
-	edit = "/sys/position/edit",
-	get = "/sys/position/queryById",
-	delete = "/sys/position/delete",
-	importExcel = '/sys/position/importExcel',
-	exportXls = '/sys/position/exportXls',
-	deleteBatch = "/sys/position/deleteBatch",
+  list = '/sys/position/list',
+  save = '/sys/position/add',
+  edit = '/sys/position/edit',
+  get = '/sys/position/queryById',
+  delete = '/sys/position/delete',
+  importExcel = '/sys/position/importExcel',
+  exportXls = '/sys/position/exportXls',
+  deleteBatch = '/sys/position/deleteBatch',
 }
 /**
  * 导出api
@@ -22,53 +22,53 @@ export const getImportUrl = Api.importExcel;
  * @param params
  */
 export const getPositionList = (params) => {
-	return defHttp.get({url: Api.list, params});
-}
+  return defHttp.get({ url: Api.list, params });
+};
 
 /**
  * 保存或者更新
  * @param params
  */
 export const saveOrUpdatePosition = (params, isUpdate) => {
-	let url = isUpdate ? Api.edit : Api.save;
-	return defHttp.post({url: url, params});
-}
+  let url = isUpdate ? Api.edit : Api.save;
+  return defHttp.post({ url: url, params });
+};
 
 /**
  * 查询详情
  * @param params
  */
 export const getPositionById = (params) => {
-	return defHttp.get({url: Api.get, params});
-}
+  return defHttp.get({ url: Api.get, params });
+};
 
 /**
  * 单条删除
  * @param params
  */
 export const deletePosition = (params, handleSuccess) => {
-	return defHttp.delete({url: Api.delete, data: params}, {joinParamsToUrl: true}).then(() => {
-		handleSuccess();
-	});
-}
+  return defHttp.delete({ url: Api.delete, data: params }, { joinParamsToUrl: true }).then(() => {
+    handleSuccess();
+  });
+};
 
 /**
  * 批量删除
  * @param params
  */
 export const batchDeletePosition = (params, handleSuccess) => {
-	Modal.confirm({
-		title: '确认删除',
-		content: '是否删除选中数据',
-		okText: '确认',
-		cancelText: '取消',
-		onOk: () => {
-			return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
-				handleSuccess();
-			});
-		}
-	});
-}
+  Modal.confirm({
+    title: '确认删除',
+    content: '是否删除选中数据',
+    okText: '确认',
+    cancelText: '取消',
+    onOk: () => {
+      return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => {
+        handleSuccess();
+      });
+    },
+  });
+};
 
 /**
  * 自定义上传
diff --git a/src/views/system/position/position.data.ts b/src/views/system/position/position.data.ts
index 25ec8d1..a7d9a64 100644
--- a/src/views/system/position/position.data.ts
+++ b/src/views/system/position/position.data.ts
@@ -1,32 +1,32 @@
 import { BasicColumn, FormSchema } from '/@/components/Table';
-import {rules} from '/@/utils/helper/validator'
+import { rules } from '/@/utils/helper/validator';
 
 export const columns: BasicColumn[] = [
-    {
-        title: '职务编码',
-        dataIndex: 'code',
-        width: 200,
-        align: 'left',
-    },
-    {
-        title: '职务名称',
-        dataIndex: 'name',
-        width: 200,
-    },
-    {
-        title: '职务等级',
-        dataIndex: 'postRank_dictText',
-        width: 100
-    }
+  {
+    title: '职务编码',
+    dataIndex: 'code',
+    width: 200,
+    align: 'left',
+  },
+  {
+    title: '职务名称',
+    dataIndex: 'name',
+    width: 200,
+  },
+  {
+    title: '职务等级',
+    dataIndex: 'postRank_dictText',
+    width: 100,
+  },
 ];
 
 export const searchFormSchema: FormSchema[] = [
-    {
-        field: 'name',
-        label: '职务名称',
-        component: 'Input',
-        colProps: {span: 8},
-    }
+  {
+    field: 'name',
+    label: '职务名称',
+    component: 'Input',
+    colProps: { span: 8 },
+  },
 ];
 
 export const formSchema: FormSchema[] = [
@@ -59,11 +59,11 @@ export const formSchema: FormSchema[] = [
     label: '职务编码',
     component: 'Input',
     required: true,
-    dynamicDisabled: ({values}) => {
+    dynamicDisabled: ({ values }) => {
       return !!values.id;
     },
-    dynamicRules: ({model, schema}) => {
-      return rules.duplicateCheckRule('sys_position', 'code', model, schema, true)
+    dynamicRules: ({ model, schema }) => {
+      return rules.duplicateCheckRule('sys_position', 'code', model, schema, true);
     },
-  }
+  },
 ];
diff --git a/src/views/system/role/components/RoleDataRuleDrawer.vue b/src/views/system/role/components/RoleDataRuleDrawer.vue
index eed7087..d5b0596 100644
--- a/src/views/system/role/components/RoleDataRuleDrawer.vue
+++ b/src/views/system/role/components/RoleDataRuleDrawer.vue
@@ -2,14 +2,14 @@
   <BasicDrawer v-bind="$attrs" @register="registerDrawer" title="数据规则配置" width="450px" destroyOnClose>
     <a-tabs defaultActiveKey="1">
       <a-tab-pane tab="数据规则" key="1">
-        <a-checkbox-group v-model:value="dataRuleChecked" v-if="dataRuleList.length>0">
+        <a-checkbox-group v-model:value="dataRuleChecked" v-if="dataRuleList.length > 0">
           <a-row>
-            <a-col :span="24" v-for="(item,index) in dataRuleList" :key=" 'dr'+index ">
+            <a-col :span="24" v-for="(item, index) in dataRuleList" :key="'dr' + index">
               <a-checkbox :value="item.id">{{ item.ruleName }}</a-checkbox>
             </a-col>
 
             <a-col :span="24">
-              <div style="width: 100%;margin-top: 15px">
+              <div style="width: 100%; margin-top: 15px">
                 <a-button @click="saveDataRuleForRole" type="primary" size="small"> <Icon icon="ant-design:save-outlined"></Icon>点击保存</a-button>
               </div>
             </a-col>
@@ -21,10 +21,10 @@
   </BasicDrawer>
 </template>
 <script lang="ts" setup>
-  import {ref, unref} from 'vue';
-  import {BasicDrawer, useDrawerInner} from '/src/components/Drawer';
+  import { ref, unref } from 'vue';
+  import { BasicDrawer, useDrawerInner } from '/src/components/Drawer';
   import { useMessage } from '/src/hooks/web/useMessage';
-  import {queryDataRule,saveDataRule} from '../role.api';
+  import { queryDataRule, saveDataRule } from '../role.api';
   // 声明Emits
   const emit = defineEmits(['success', 'register']);
   const { createMessage } = useMessage();
@@ -37,19 +37,19 @@
   /**
    * 数据
    */
-  const [registerDrawer, {setDrawerProps, closeDrawer}] = useDrawerInner(async (data) => {
+  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
     await reset();
-    setDrawerProps({confirmLoading: false});
+    setDrawerProps({ confirmLoading: false });
     //权限的id
     functionId.value = data.functionId;
     //角色的id
     roleId.value = data.roleId;
     //查询数据
-    const res = await queryDataRule({functionId: unref(functionId), roleId: unref(roleId)});
-    if(res.success){
-        dataRuleList.value = res.result.datarule;
-      if(res.result.drChecked){
-          dataRuleChecked.value = res.result.drChecked.split(",")
+    const res = await queryDataRule({ functionId: unref(functionId), roleId: unref(roleId) });
+    if (res.success) {
+      dataRuleList.value = res.result.datarule;
+      if (res.result.drChecked) {
+        dataRuleChecked.value = res.result.drChecked.split(',');
       }
     }
   });
@@ -68,13 +68,13 @@
    * 提交
    */
   async function saveDataRuleForRole() {
-    if(!unref(dataRuleChecked) || unref(dataRuleChecked).length==0){
-      createMessage.warning("请注意，现未勾选任何数据权限!")
+    if (!unref(dataRuleChecked) || unref(dataRuleChecked).length == 0) {
+      createMessage.warning('请注意，现未勾选任何数据权限!');
     }
     let params = {
-      permissionId:unref(functionId),
-      roleId:unref(roleId),
-      dataRuleIds:unref(dataRuleChecked).join(",")
+      permissionId: unref(functionId),
+      roleId: unref(roleId),
+      dataRuleIds: unref(dataRuleChecked).join(','),
     };
     await saveDataRule(params);
     //关闭弹窗
@@ -82,5 +82,4 @@
     //刷新列表
     emit('success');
   }
-
 </script>
diff --git a/src/views/system/role/components/RoleDesc.vue b/src/views/system/role/components/RoleDesc.vue
index 86be9f4..2a4edc6 100644
--- a/src/views/system/role/components/RoleDesc.vue
+++ b/src/views/system/role/components/RoleDesc.vue
@@ -1,7 +1,7 @@
 <template>
-    <BasicDrawer v-bind="$attrs" @register="registerDrawer" title="角色详情" width="500px" destroyOnClose>
-        <Description :column="1" :data="roleData" :schema="formDescSchema"/>
-    </BasicDrawer>
+  <BasicDrawer v-bind="$attrs" @register="registerDrawer" title="角色详情" width="500px" destroyOnClose>
+    <Description :column="1" :data="roleData" :schema="formDescSchema" />
+  </BasicDrawer>
 </template>
 <script lang="ts" setup>
   import { ref, useAttrs } from 'vue';
diff --git a/src/views/system/role/components/RoleDesignModal.vue b/src/views/system/role/components/RoleDesignModal.vue
index 5236db6..fc504c0 100644
--- a/src/views/system/role/components/RoleDesignModal.vue
+++ b/src/views/system/role/components/RoleDesignModal.vue
@@ -1,11 +1,11 @@
 <template>
   <BasicModal v-bind="$attrs" @register="registerModal" title="工单授权" @ok="handleSubmit" width="1200px">
     <!--工单授权部分-->
-    <template v-for="(item,index) of processTypeDictOptions">
-      <a-card :title="item.text" :style="{ marginTop:(index==0?'0px':'12px'),height:'auto' }" :headStyle="{ backgroundColor:'#eaeaea' }">
+    <template v-for="(item, index) of processTypeDictOptions">
+      <a-card :title="item.text" :style="{ marginTop: index == 0 ? '0px' : '12px', height: 'auto' }" :headStyle="{ backgroundColor: '#eaeaea' }">
         <a-checkbox-group @change="designNameChange" v-model:value="designNameValue[index]" style="width: 100%">
           <a-row>
-            <template v-for="(des) in designNameOption">
+            <template v-for="des in designNameOption">
               <a-col :span="6" v-if="des.procType == item.value">
                 <a-checkbox :value="des.value">{{ des.text }}</a-checkbox>
               </a-col>
@@ -23,18 +23,16 @@
             <a-menu-item key="2" @click="cancelCheckALL">取消全选</a-menu-item>
           </a-menu>
         </template>
-        <a-button style="float: left;">
-          树操作 <Icon icon="ant-design:up-outlined" />
-        </a-button>
+        <a-button style="float: left"> 树操作 <Icon icon="ant-design:up-outlined" /> </a-button>
       </a-dropdown>
     </template>
   </BasicModal>
 </template>
 <script lang="ts" setup>
-  import {ref, computed, unref} from 'vue';
-  import {BasicModal, useModalInner} from '/src/components/Modal';
-  import {getParentDesignList, getRoleDegisnList,saveRoleDesign} from '../role.api';
-  import {initDictOptions} from '/@/utils/dict/index';
+  import { ref, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/src/components/Modal';
+  import { getParentDesignList, getRoleDegisnList, saveRoleDesign } from '../role.api';
+  import { initDictOptions } from '/@/utils/dict/index';
   // 声明Emits
   const emit = defineEmits(['success', 'register']);
   //角色id
@@ -54,11 +52,11 @@
   //工单数据集合
   const designNameValue = ref([]);
   //表单赋值
-  const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-    setModalProps({confirmLoading: false});
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    setModalProps({ confirmLoading: false });
     roleId.value = data.roleId;
     //初始化数据
-    initData()
+    initData();
   });
 
   /**
@@ -75,20 +73,20 @@
     if (designList) {
       desformList.value = designList;
       //获取指定属性的数据集合
-      let procTypeArr = [...new Set(Array.from(unref(designList), ({procType}) => procType))];
+      let procTypeArr = [...new Set(Array.from(unref(designList), ({ procType }) => procType))];
       //工单类型字典项
-      processTypeDictOptions.value = processTypeDict.value.filter(item => procTypeArr.indexOf(item.value) != -1);
+      processTypeDictOptions.value = processTypeDict.value.filter((item) => procTypeArr.indexOf(item.value) != -1);
       //工单名称集合
       designNameOption.value = designList.map((design) => {
-        return {value: design.id, text: design.desformName, procType: design.procType};
-      })
+        return { value: design.id, text: design.desformName, procType: design.procType };
+      });
     }
     //获取角色表单信息
-    let roleDegisnList = await getRoleDegisnList({roleId: unref(roleId)})
+    let roleDegisnList = await getRoleDegisnList({ roleId: unref(roleId) });
     if (roleDegisnList.length > 0) {
-      let{designName,designValues}= selectedDesign(roleDegisnList);
-      oldDesignId.value = designName.join(",");
-      newDesignId.value = designName.join(",");
+      let { designName, designValues } = selectedDesign(roleDegisnList);
+      oldDesignId.value = designName.join(',');
+      newDesignId.value = designName.join(',');
       designNameValue.value = designValues;
     }
   }
@@ -96,55 +94,55 @@
    * 点击修改
    */
   function designNameChange(selectedValue) {
-    newDesignId.value = unref(designNameValue).join(",");
+    newDesignId.value = unref(designNameValue).join(',');
   }
   /**
    * 全选
    */
-  function checkALL(){
-    let{designName,designValues}= selectedDesign(unref(desformList));
+  function checkALL() {
+    let { designName, designValues } = selectedDesign(unref(desformList));
     designNameValue.value = designValues;
-    newDesignId.value = designName.join(",");
+    newDesignId.value = designName.join(',');
   }
   /**
    * 取消全选
    */
-  function cancelCheckALL(){
-    designNameValue.value=[];
-    newDesignId.value="";
+  function cancelCheckALL() {
+    designNameValue.value = [];
+    newDesignId.value = '';
   }
   /**
    * 选中工单信息
    */
-  function selectedDesign(selectedList){
-      let designName = [];
-      let designValues = [];
-      for(let option of unref(processTypeDictOptions)){
-          let values = [];
-          for (let value of selectedList) {
-              if(option.value == value.procType){
-                  designName.push(value.id);
-                  values.push(value.id);
-              }
-          }
-          designValues.push(values);
+  function selectedDesign(selectedList) {
+    let designName = [];
+    let designValues = [];
+    for (let option of unref(processTypeDictOptions)) {
+      let values = [];
+      for (let value of selectedList) {
+        if (option.value == value.procType) {
+          designName.push(value.id);
+          values.push(value.id);
+        }
       }
-      return {designName,designValues}
+      designValues.push(values);
+    }
+    return { designName, designValues };
   }
   /**
    * 提交事件
    */
   async function handleSubmit() {
     try {
-      setModalProps({confirmLoading: true});
+      setModalProps({ confirmLoading: true });
       //提交表单
-      await saveRoleDesign({roleId:unref(roleId),newDesignId:unref(newDesignId),oldDessignId:unref(oldDesignId)});
+      await saveRoleDesign({ roleId: unref(roleId), newDesignId: unref(newDesignId), oldDessignId: unref(oldDesignId) });
       //关闭弹窗
       closeModal();
       //刷新列表
       emit('success');
     } finally {
-      setModalProps({confirmLoading: false});
+      setModalProps({ confirmLoading: false });
     }
   }
 </script>
diff --git a/src/views/system/role/components/RoleDrawer.vue b/src/views/system/role/components/RoleDrawer.vue
index d65c454..2d4c14e 100644
--- a/src/views/system/role/components/RoleDrawer.vue
+++ b/src/views/system/role/components/RoleDrawer.vue
@@ -1,35 +1,35 @@
 <template>
   <BasicDrawer v-bind="$attrs" @register="registerDrawer" :title="getTitle" width="500px" @ok="handleSubmit" destroyOnClose>
-    <BasicForm @register="registerForm"/>
+    <BasicForm @register="registerForm" />
   </BasicDrawer>
 </template>
 <script lang="ts" setup>
-  import {ref, computed, unref,useAttrs } from 'vue';
-  import {BasicForm, useForm} from '/src/components/Form';
-  import {BasicDrawer, useDrawerInner} from '/src/components/Drawer';
-  import {BasicTree, TreeItem} from '/src/components/Tree';
-  import {formSchema} from '../role.data';
-  import {saveOrUpdateRole} from '../role.api';
+  import { ref, computed, unref, useAttrs } from 'vue';
+  import { BasicForm, useForm } from '/src/components/Form';
+  import { BasicDrawer, useDrawerInner } from '/src/components/Drawer';
+  import { BasicTree, TreeItem } from '/src/components/Tree';
+  import { formSchema } from '../role.data';
+  import { saveOrUpdateRole } from '../role.api';
   // 声明Emits
   const emit = defineEmits(['success', 'register']);
-  const attrs = useAttrs()
+  const attrs = useAttrs();
   const isUpdate = ref(true);
-  const [registerForm, {setProps,resetFields, setFieldsValue, validate}] = useForm({
+  const [registerForm, { setProps, resetFields, setFieldsValue, validate }] = useForm({
     labelWidth: 90,
     schemas: formSchema,
-    showActionButtonGroup: false
+    showActionButtonGroup: false,
   });
-  const [registerDrawer, {setDrawerProps, closeDrawer}] = useDrawerInner(async (data) => {
+  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
     resetFields();
     isUpdate.value = !!data?.isUpdate;
-    setDrawerProps({confirmLoading: false});
+    setDrawerProps({ confirmLoading: false });
     if (unref(isUpdate)) {
       setFieldsValue({
         ...data.record,
       });
     }
     //禁用表单
-    setProps({disabled:!attrs.showFooter})
+    setProps({ disabled: !attrs.showFooter });
   });
   /**
    * 标题
@@ -41,13 +41,13 @@
   async function handleSubmit() {
     try {
       const values = await validate();
-      setDrawerProps({confirmLoading: true});
+      setDrawerProps({ confirmLoading: true });
       //提交表单
       await saveOrUpdateRole(values, isUpdate.value);
       closeDrawer();
       emit('success');
     } finally {
-      setDrawerProps({confirmLoading: false});
+      setDrawerProps({ confirmLoading: false });
     }
   }
 </script>
diff --git a/src/views/system/role/components/RoleIndexModal.vue b/src/views/system/role/components/RoleIndexModal.vue
index 7715ecb..07b35d3 100644
--- a/src/views/system/role/components/RoleIndexModal.vue
+++ b/src/views/system/role/components/RoleIndexModal.vue
@@ -1,57 +1,55 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" title="首页配置" @ok="handleSubmit" width="40%">
-        <BasicForm @register="registerForm"/>
-    </BasicModal>
+  <BasicModal v-bind="$attrs" @register="registerModal" title="首页配置" @ok="handleSubmit" width="40%">
+    <BasicForm @register="registerForm" />
+  </BasicModal>
 </template>
 
 <script lang="ts" setup>
-    import {ref, computed, unref} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {BasicForm, useForm} from '/@/components/Form/index';
-    import {roleIndexFormSchema} from '../role.data';
-    import {saveOrUpdateRoleIndex, queryIndexByCode} from '../role.api';
-    // Emits声明
-    const emit = defineEmits(['register', 'success']);
-    const isUpdate = ref(true);
-    //表单配置
-    const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
-        labelWidth: 150,
-        schemas: roleIndexFormSchema,
-        showActionButtonGroup: false,
-    });
-    //表单赋值
-    const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-        //重置表单
-        await resetFields();
-        setModalProps({confirmLoading: false});
-        setFieldsValue({roleCode: data.roleCode});
-        let res = await queryIndexByCode({roleCode: data.roleCode});
-        isUpdate.value = !!res.result?.id;
-        if (unref(isUpdate)) {
-            //表单赋值
-            await setFieldsValue({
-                ...res.result,
-            });
-        }
-    });
-
-    //表单提交事件
-    async function handleSubmit(v) {
-        try {
-            let values = await validate();
-            setModalProps({confirmLoading: true});
-            //提交表单
-            await saveOrUpdateRoleIndex(values, isUpdate.value);
-            //关闭弹窗
-            closeModal();
-            //刷新列表
-            emit('success', {isUpdate: isUpdate.value, values});
-        } finally {
-            setModalProps({confirmLoading: false});
-        }
+  import { ref, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { roleIndexFormSchema } from '../role.data';
+  import { saveOrUpdateRoleIndex, queryIndexByCode } from '../role.api';
+  // Emits声明
+  const emit = defineEmits(['register', 'success']);
+  const isUpdate = ref(true);
+  //表单配置
+  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
+    labelWidth: 150,
+    schemas: roleIndexFormSchema,
+    showActionButtonGroup: false,
+  });
+  //表单赋值
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    //重置表单
+    await resetFields();
+    setModalProps({ confirmLoading: false });
+    setFieldsValue({ roleCode: data.roleCode });
+    let res = await queryIndexByCode({ roleCode: data.roleCode });
+    isUpdate.value = !!res.result?.id;
+    if (unref(isUpdate)) {
+      //表单赋值
+      await setFieldsValue({
+        ...res.result,
+      });
     }
+  });
+
+  //表单提交事件
+  async function handleSubmit(v) {
+    try {
+      let values = await validate();
+      setModalProps({ confirmLoading: true });
+      //提交表单
+      await saveOrUpdateRoleIndex(values, isUpdate.value);
+      //关闭弹窗
+      closeModal();
+      //刷新列表
+      emit('success', { isUpdate: isUpdate.value, values });
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
+  }
 </script>
 
-<style lang="less" scoped>
-
-</style>
+<style lang="less" scoped></style>
diff --git a/src/views/system/role/components/RolePermissionDrawer.vue b/src/views/system/role/components/RolePermissionDrawer.vue
index bb9a579..c28f8e3 100644
--- a/src/views/system/role/components/RolePermissionDrawer.vue
+++ b/src/views/system/role/components/RolePermissionDrawer.vue
@@ -12,10 +12,11 @@
       :clickRowToExpand="false"
       title="所拥有的的权限"
       @check="onCheck"
-      @select="onTreeNodeSelect">
-      <template #title={slotTitle,ruleFlag}>
+      @select="onTreeNodeSelect"
+    >
+      <template #title="{ slotTitle, ruleFlag }">
         {{ slotTitle }}
-        <Icon v-if="ruleFlag" icon="ant-design:align-left-outlined" style="margin-left:5px;color: red;"></Icon>
+        <Icon v-if="ruleFlag" icon="ant-design:align-left-outlined" style="margin-left: 5px; color: red"></Icon>
       </template>
     </BasicTree>
     <!--右下角按钮-->
@@ -24,16 +25,16 @@
       <a-button @click="handleSubmit(false)" type="primary" :loading="loading" ghost style="margin-right: 0.8rem">仅保存</a-button>
       <a-button @click="handleSubmit(true)" type="primary" :loading="loading">保存并关闭</a-button>
     </template>
-    <RoleDataRuleDrawer @register="registerDrawer1"/>
+    <RoleDataRuleDrawer @register="registerDrawer1" />
   </BasicDrawer>
 </template>
 <script lang="ts" setup>
-  import {ref, computed, unref,onMounted} from 'vue';
-  import {BasicDrawer,useDrawer, useDrawerInner} from '/src/components/Drawer';
-  import {BasicTree, TreeItem} from '/src/components/Tree';
-  import {PopConfirmButton} from '/@/components/Button';
+  import { ref, computed, unref, onMounted } from 'vue';
+  import { BasicDrawer, useDrawer, useDrawerInner } from '/src/components/Drawer';
+  import { BasicTree, TreeItem } from '/src/components/Tree';
+  import { PopConfirmButton } from '/@/components/Button';
   import RoleDataRuleDrawer from './RoleDataRuleDrawer.vue';
-  import {queryTreeListForRole, queryRolePermission, saveRolePermission} from '../role.api';
+  import { queryTreeListForRole, queryRolePermission, saveRolePermission } from '../role.api';
   const emit = defineEmits(['register']);
   //树的信息
   const treeData = ref<TreeItem[]>([]);
@@ -49,46 +50,46 @@
   const treeRef = ref(null);
   const loading = ref(false);
 
-  const [registerDrawer1, {openDrawer:openDataRuleDrawer}] = useDrawer();
-  const [registerDrawer, {setDrawerProps, closeDrawer}] = useDrawerInner(async (data) => {
+  const [registerDrawer1, { openDrawer: openDataRuleDrawer }] = useDrawer();
+  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
     await reset();
-    setDrawerProps({confirmLoading: false,loading:true});
+    setDrawerProps({ confirmLoading: false, loading: true });
     roleId.value = data.roleId;
     //初始化数据
     const roleResult = await queryTreeListForRole();
     treeData.value = roleResult.treeList;
     allTreeKeys.value = roleResult.ids;
-   //初始化角色菜单数据
-    const permResult = await queryRolePermission({roleId: unref(roleId)});
+    //初始化角色菜单数据
+    const permResult = await queryRolePermission({ roleId: unref(roleId) });
     checkedKeys.value = permResult;
     defaultCheckedKeys.value = permResult;
-    setDrawerProps({loading:false});
+    setDrawerProps({ loading: false });
   });
   /**
    * 点击选中
    */
   function onCheck(o) {
-    checkedKeys.value = o.checked ? o.checked : o
+    checkedKeys.value = o.checked ? o.checked : o;
   }
   /**
    * 选中节点，打开数据权限抽屉
    */
   function onTreeNodeSelect(key) {
-    if(key && key.length>0){
-      selectedKeys.value = key
+    if (key && key.length > 0) {
+      selectedKeys.value = key;
     }
-    openDataRuleDrawer(true,{functionId:unref(selectedKeys)[0],roleId:unref(roleId)})
+    openDataRuleDrawer(true, { functionId: unref(selectedKeys)[0], roleId: unref(roleId) });
   }
   /**
    * 数据重置
    */
   function reset() {
-     treeData.value = [];
-     allTreeKeys.value = [];
-     checkedKeys.value = [];
-     defaultCheckedKeys.value = [];
-     selectedKeys.value = [];
-     roleId.value = '';
+    treeData.value = [];
+    allTreeKeys.value = [];
+    checkedKeys.value = [];
+    defaultCheckedKeys.value = [];
+    selectedKeys.value = [];
+    roleId.value = '';
   }
   /**
    * 获取tree实例
@@ -106,13 +107,12 @@
   async function handleSubmit(exit) {
     let params = {
       roleId: unref(roleId),
-      permissionIds: unref(getTree().getCheckedKeys()).join(","),
-      lastpermissionIds: unref(defaultCheckedKeys).join(","),
+      permissionIds: unref(getTree().getCheckedKeys()).join(','),
+      lastpermissionIds: unref(defaultCheckedKeys).join(','),
     };
     loading.value = true;
     await saveRolePermission(params);
     loading.value = false;
-    exit && closeDrawer()
+    exit && closeDrawer();
   }
-
 </script>
diff --git a/src/views/system/role/components/RoleUserTable.vue b/src/views/system/role/components/RoleUserTable.vue
index a7af76f..5df1d48 100644
--- a/src/views/system/role/components/RoleUserTable.vue
+++ b/src/views/system/role/components/RoleUserTable.vue
@@ -1,11 +1,11 @@
 <template>
-  <BasicDrawer  @register="registerBaseDrawer" title="角色用户" width="800"  destroyOnClose>
-    <BasicTable @register="registerTable" :rowSelection="rowSelection" >
+  <BasicDrawer @register="registerBaseDrawer" title="角色用户" width="800" destroyOnClose>
+    <BasicTable @register="registerTable" :rowSelection="rowSelection">
       <template #tableTitle>
-          <a-button type="primary" @click="handleCreate"> 新增用户</a-button>
-          <a-button type="primary" @click="handleSelect"> 已有用户</a-button>
+        <a-button type="primary" @click="handleCreate"> 新增用户</a-button>
+        <a-button type="primary" @click="handleSelect"> 已有用户</a-button>
 
-          <a-dropdown v-if="checkedKeys.length > 0">
+        <a-dropdown v-if="checkedKeys.length > 0">
           <template #overlay>
             <a-menu>
               <a-menu-item key="1" @click="batchHandleDelete">
@@ -14,53 +14,54 @@
               </a-menu-item>
             </a-menu>
           </template>
-          <a-button>批量操作
+          <a-button
+            >批量操作
             <Icon icon="ant-design:down-outlined"></Icon>
           </a-button>
         </a-dropdown>
       </template>
       <template #action="{ record }">
-        <TableAction :actions="getTableAction(record)"/>
+        <TableAction :actions="getTableAction(record)" />
       </template>
     </BasicTable>
     <!--用户操作抽屉-->
-    <UserDrawer @register="registerDrawer" @success="handleSuccess"/>
+    <UserDrawer @register="registerDrawer" @success="handleSuccess" />
     <!--用户选择弹窗-->
-    <UseSelectModal @register="registerModal" @select="selectOk"/>
+    <UseSelectModal @register="registerModal" @select="selectOk" />
   </BasicDrawer>
 </template>
 <script lang="ts" setup>
   import { ref, defineProps, watch, unref } from 'vue';
-  import {BasicTable, useTable, TableAction} from '/src/components/Table';
-  import { BasicDrawer,useDrawer, useDrawerInner } from '/src/components/Drawer';
-  import {useModal} from '/src/components/Modal';
+  import { BasicTable, useTable, TableAction } from '/src/components/Table';
+  import { BasicDrawer, useDrawer, useDrawerInner } from '/src/components/Drawer';
+  import { useModal } from '/src/components/Modal';
   import UserDrawer from '../../user/UserDrawer.vue';
   import UseSelectModal from './UseSelectModal.vue';
-  import {userList, deleteUserRole, batchDeleteUserRole, addUserRole} from '../role.api';
-  import {userColumns, searchUserFormSchema} from '../role.data';
-  import {getUserRoles} from '../../user/user.api';
+  import { userList, deleteUserRole, batchDeleteUserRole, addUserRole } from '../role.api';
+  import { userColumns, searchUserFormSchema } from '../role.data';
+  import { getUserRoles } from '../../user/user.api';
 
-  const emit = defineEmits(['register','hideUserList']);
+  const emit = defineEmits(['register', 'hideUserList']);
   const checkedKeys = ref<Array<string | number>>([]);
   const roleId = ref('');
-  const [registerBaseDrawer, {setDrawerProps, closeDrawer}] = useDrawerInner(async (data) => {
-    roleId.value = data.id
-    setProps({searchInfo:{roleId:data.id}});
-    reload()
+  const [registerBaseDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
+    roleId.value = data.id;
+    setProps({ searchInfo: { roleId: data.id } });
+    reload();
   });
   //注册drawer
-  const [registerDrawer, {openDrawer}] = useDrawer();
+  const [registerDrawer, { openDrawer }] = useDrawer();
   //注册drawer
-  const [registerModal, {openModal}] = useModal();
-  const [registerTable, {reload, updateTableDataRecord,setProps}] = useTable({
+  const [registerModal, { openModal }] = useModal();
+  const [registerTable, { reload, updateTableDataRecord, setProps }] = useTable({
     title: '用户列表',
     api: userList,
     columns: userColumns,
     formConfig: {
       labelWidth: 120,
       schemas: searchUserFormSchema,
-      autoSubmitOnEnter:true,
-      actionColOptions: { pull:1 }
+      autoSubmitOnEnter: true,
+      actionColOptions: { pull: 1 },
     },
     striped: true,
     useSearchForm: true,
@@ -68,20 +69,18 @@
     clickToRowSelect: false,
     bordered: true,
     showIndexColumn: false,
-    tableSetting: {fullScreen: true},
+    tableSetting: { fullScreen: true },
     canResize: false,
     rowKey: 'id',
     actionColumn: {
       width: 180,
       title: '操作',
       dataIndex: 'action',
-      slots: {customRender: 'action'},
+      slots: { customRender: 'action' },
       fixed: undefined,
     },
   });
 
-
-
   /**
    * 选择列配置
    */
@@ -89,10 +88,8 @@
     type: 'checkbox',
     columnWidth: 50,
     selectedRowKeys: checkedKeys,
-    onChange: onSelectChange
-  }
-
-
+    onChange: onSelectChange,
+  };
 
   /**
    * 选择事件
@@ -108,46 +105,46 @@
     openDrawer(true, {
       isUpdate: false,
       selectedroles: [roleId.value],
-      isRole: true
+      isRole: true,
     });
   }
   /**
    * 编辑
    */
   async function handleEdit(record: Recordable) {
-      try {
-        const userRoles = await getUserRoles({userid: record.id});
-        if (userRoles && userRoles.length > 0) {
-          record.selectedroles = userRoles;
-        }
-      } catch (e) {
-        console.log(e)
+    try {
+      const userRoles = await getUserRoles({ userid: record.id });
+      if (userRoles && userRoles.length > 0) {
+        record.selectedroles = userRoles;
       }
-      openDrawer(true, {
-        record,
-        isUpdate: true,
-        isRole: true,
-      });
+    } catch (e) {
+      console.log(e);
+    }
+    openDrawer(true, {
+      record,
+      isUpdate: true,
+      isRole: true,
+    });
   }
 
   /**
    * 删除事件
    */
   async function handleDelete(record) {
-    await deleteUserRole({userId: record.id, roleId: roleId.value}, reload);
+    await deleteUserRole({ userId: record.id, roleId: roleId.value }, reload);
   }
 
   /**
    * 批量删除事件
    */
   async function batchHandleDelete() {
-    await batchDeleteUserRole({userIds: checkedKeys.value.join(','), roleId:roleId.value}, reload);
+    await batchDeleteUserRole({ userIds: checkedKeys.value.join(','), roleId: roleId.value }, reload);
   }
 
   /**
    * 成功回调
    */
-  function handleSuccess({isUpdate, values}) {
+  function handleSuccess({ isUpdate, values }) {
     isUpdate ? updateTableDataRecord(values.id, values) : reload();
   }
   /**
@@ -160,7 +157,7 @@
    * 添加已有用户
    */
   async function selectOk(val) {
-    await addUserRole({roleId:roleId.value,userIdList:val},reload)
+    await addUserRole({ roleId: roleId.value, userIdList: val }, reload);
   }
   /**
    * 操作栏
@@ -176,8 +173,8 @@
         popConfirm: {
           title: '是否确认取消关联',
           confirm: handleDelete.bind(null, record),
-        }
-      }
-    ]
+        },
+      },
+    ];
   }
 </script>
diff --git a/src/views/system/role/components/UseSelectModal.vue b/src/views/system/role/components/UseSelectModal.vue
index 7e66bf3..f57b091 100644
--- a/src/views/system/role/components/UseSelectModal.vue
+++ b/src/views/system/role/components/UseSelectModal.vue
@@ -1,36 +1,36 @@
 <template>
-  <BasicModal v-bind="$attrs" @register="registerModal" title="用户选择列表" width="1000px" @ok="handleSubmit" >
-    <BasicTable @register="registerTable" :rowSelection="rowSelection" style="padding: 0px;"/>
+  <BasicModal v-bind="$attrs" @register="registerModal" title="用户选择列表" width="1000px" @ok="handleSubmit">
+    <BasicTable @register="registerTable" :rowSelection="rowSelection" style="padding: 0px" />
   </BasicModal>
 </template>
 <script lang="ts" setup>
-  import {ref,unref,toRaw} from 'vue';
-  import {BasicModal, useModalInner} from '/src/components/Modal';
-  import {BasicTable, useTable, TableAction} from '/src/components/Table';
-  import {userColumns, searchUserFormSchema} from '../role.data';
-  import {list} from '../../user/user.api';
+  import { ref, unref, toRaw } from 'vue';
+  import { BasicModal, useModalInner } from '/src/components/Modal';
+  import { BasicTable, useTable, TableAction } from '/src/components/Table';
+  import { userColumns, searchUserFormSchema } from '../role.data';
+  import { list } from '../../user/user.api';
   // 声明Emits
-  const emit = defineEmits(['select','register']);
+  const emit = defineEmits(['select', 'register']);
   const checkedKeys = ref<Array<string | number>>([]);
-  const [registerModal, {setModalProps, closeModal}] = useModalInner();
+  const [registerModal, { setModalProps, closeModal }] = useModalInner();
   //注册table数据
-  const [registerTable, {reload}] = useTable({
+  const [registerTable, { reload }] = useTable({
     api: list,
     rowKey: 'id',
-    columns:userColumns,
+    columns: userColumns,
     formConfig: {
       labelWidth: 60,
       schemas: searchUserFormSchema,
-      baseRowStyle:{maxHeight:"20px"},
-      autoSubmitOnEnter:true  
+      baseRowStyle: { maxHeight: '20px' },
+      autoSubmitOnEnter: true,
     },
     striped: true,
     useSearchForm: true,
     showTableSetting: false,
     bordered: true,
     showIndexColumn: false,
-    canResize: false
-  })
+    canResize: false,
+  });
   /**
    * 选择列配置
    */
@@ -38,8 +38,8 @@
     type: 'checkbox',
     columnWidth: 50,
     selectedRowKeys: checkedKeys,
-    onChange: onSelectChange
-  }
+    onChange: onSelectChange,
+  };
   /**
    * 选择事件
    */
@@ -47,14 +47,13 @@
     checkedKeys.value = selectedRowKeys;
   }
 
-   //提交事件
-   function handleSubmit() {
-      setModalProps({confirmLoading: true});
-      //关闭弹窗
-      closeModal();
-      //刷新列表
-      emit('select',toRaw(unref(checkedKeys)));
-      setModalProps({confirmLoading: false});
+  //提交事件
+  function handleSubmit() {
+    setModalProps({ confirmLoading: true });
+    //关闭弹窗
+    closeModal();
+    //刷新列表
+    emit('select', toRaw(unref(checkedKeys)));
+    setModalProps({ confirmLoading: false });
   }
-
 </script>
diff --git a/src/views/system/role/index.vue b/src/views/system/role/index.vue
index 385361d..c625d67 100644
--- a/src/views/system/role/index.vue
+++ b/src/views/system/role/index.vue
@@ -1,85 +1,86 @@
 <template>
-    <BasicTable @register="registerTable">
-        <template #tableTitle>
-            <a-button  type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增</a-button>
-            <a-button  type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
-            <j-upload-button  type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
-            <a-dropdown v-if="selectedRowKeys.length > 0">
-            <template #overlay>
-              <a-menu>
-                <a-menu-item key="1" @click="batchHandleDelete">
-                  <Icon icon="ant-design:delete-outlined"></Icon>
-                  删除
-                </a-menu-item>
-              </a-menu>
-            </template>
-            <a-button>批量操作
-              <Icon icon="mdi:chevron-down"></Icon>
-            </a-button>
-          </a-dropdown>
+  <BasicTable @register="registerTable">
+    <template #tableTitle>
+      <a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增</a-button>
+      <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
+      <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
+      <a-dropdown v-if="selectedRowKeys.length > 0">
+        <template #overlay>
+          <a-menu>
+            <a-menu-item key="1" @click="batchHandleDelete">
+              <Icon icon="ant-design:delete-outlined"></Icon>
+              删除
+            </a-menu-item>
+          </a-menu>
         </template>
-        <template #action="{ record }">
-          <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)"/>
-        </template>
-      </BasicTable>
-    <!--角色用户表格-->
-    <RoleUserTable @register="roleUserDrawer" />
-    <!--角色编辑抽屉-->
-    <RoleDrawer @register="registerDrawer" @success="reload" :showFooter="showFooter"/>
-    <RoleDesc @register="registerDesc"></RoleDesc>
-    <!--角色菜单授权抽屉-->
-    <RolePermissionDrawer @register="rolePermissionDrawer"/>
-    <!--角色工单授权-->
-    <RoleDesignModal @register="registerModal"/>
-    <!--角色工单授权-->
-    <RoleIndexModal @register="registerIndexModal"/>
+        <a-button
+          >批量操作
+          <Icon icon="mdi:chevron-down"></Icon>
+        </a-button>
+      </a-dropdown>
+    </template>
+    <template #action="{ record }">
+      <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
+    </template>
+  </BasicTable>
+  <!--角色用户表格-->
+  <RoleUserTable @register="roleUserDrawer" />
+  <!--角色编辑抽屉-->
+  <RoleDrawer @register="registerDrawer" @success="reload" :showFooter="showFooter" />
+  <RoleDesc @register="registerDesc"></RoleDesc>
+  <!--角色菜单授权抽屉-->
+  <RolePermissionDrawer @register="rolePermissionDrawer" />
+  <!--角色工单授权-->
+  <RoleDesignModal @register="registerModal" />
+  <!--角色工单授权-->
+  <RoleIndexModal @register="registerIndexModal" />
 </template>
 <script lang="ts" name="system-role" setup>
-  import {ref} from 'vue'
-  import {BasicTable, TableAction} from '/@/components/Table';
-  import {useDrawer} from '/@/components/Drawer';
-  import {useModal} from '/@/components/Modal';
+  import { ref } from 'vue';
+  import { BasicTable, TableAction } from '/@/components/Table';
+  import { useDrawer } from '/@/components/Drawer';
+  import { useModal } from '/@/components/Modal';
   import RoleDrawer from './components/RoleDrawer.vue';
   import RoleDesc from './components/RoleDesc.vue';
   import RolePermissionDrawer from './components/RolePermissionDrawer.vue';
   import RoleDesignModal from './components/RoleDesignModal.vue';
   import RoleIndexModal from './components/RoleIndexModal.vue';
   import RoleUserTable from './components/RoleUserTable.vue';
-  import {columns, searchFormSchema} from './role.data';
-  import {list, deleteRole, batchDeleteRole, getExportUrl,getImportUrl} from './role.api';
-  import { useListPage } from '/@/hooks/system/useListPage'
+  import { columns, searchFormSchema } from './role.data';
+  import { list, deleteRole, batchDeleteRole, getExportUrl, getImportUrl } from './role.api';
+  import { useListPage } from '/@/hooks/system/useListPage';
   const showFooter = ref(true);
-  const [roleUserDrawer, {openDrawer:openRoleUserDrawer}] = useDrawer();
-  const [registerDrawer, {openDrawer}] = useDrawer();
-  const [registerModal, {openModal}] = useModal();
-  const [registerIndexModal, {openModal:openIndexModal}] = useModal();
-  const [rolePermissionDrawer, {openDrawer: openRolePermissionDrawer}] = useDrawer();
-  const [registerDesc, {openDrawer: openRoleDesc}] = useDrawer();
+  const [roleUserDrawer, { openDrawer: openRoleUserDrawer }] = useDrawer();
+  const [registerDrawer, { openDrawer }] = useDrawer();
+  const [registerModal, { openModal }] = useModal();
+  const [registerIndexModal, { openModal: openIndexModal }] = useModal();
+  const [rolePermissionDrawer, { openDrawer: openRolePermissionDrawer }] = useDrawer();
+  const [registerDesc, { openDrawer: openRoleDesc }] = useDrawer();
 
   // 列表页面公共参数、方法
-  const { prefixCls, tableContext,onImportXls,onExportXls } = useListPage({
+  const { prefixCls, tableContext, onImportXls, onExportXls } = useListPage({
     designScope: 'role-template',
     tableProps: {
       title: '角色列表',
       api: list,
       columns: columns,
       formConfig: {
-        schemas: searchFormSchema
+        schemas: searchFormSchema,
       },
       actionColumn: {
         width: 120,
       },
-      rowSelection:null
+      rowSelection: null,
     },
     exportConfig: {
-      name:"角色列表",
-      url: getExportUrl
+      name: '角色列表',
+      url: getExportUrl,
     },
     importConfig: {
-      url: getImportUrl
-    }
-  })
-  const [registerTable, {reload},{ rowSelection, selectedRowKeys }] =tableContext;
+      url: getImportUrl,
+    },
+  });
+  const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;
 
   /**
    * 新增
@@ -103,7 +104,7 @@
   /**
    * 详情
    */
-   function handleDetail(record) {
+  function handleDetail(record) {
     showFooter.value = false;
     openRoleDesc(true, {
       record,
@@ -114,38 +115,38 @@
    * 删除事件
    */
   async function handleDelete(record) {
-    await deleteRole({id: record.id}, reload);
+    await deleteRole({ id: record.id }, reload);
   }
   /**
    * 批量删除事件
    */
   async function batchHandleDelete() {
-    await batchDeleteRole({ids: selectedRowKeys.value}, reload);
+    await batchDeleteRole({ ids: selectedRowKeys.value }, reload);
   }
   /**
    * 角色授权弹窗
    */
   function handlePerssion(record) {
-    openRolePermissionDrawer(true, {roleId: record.id});
+    openRolePermissionDrawer(true, { roleId: record.id });
   }
   /**
    * 工单授权弹窗
    */
   function handleDesign(id) {
-    openModal(true, {roleId: id});
+    openModal(true, { roleId: id });
   }
   /**
    * 首页配置弹窗
    */
   function handleIndexConfig(roleCode) {
-    openIndexModal(true, {roleCode});
+    openIndexModal(true, { roleCode });
   }
   /**
    * 角色用户
    */
   function handleUser(record) {
     //onSelectChange(selectedRowKeys)
-    openRoleUserDrawer(true,record)
+    openRoleUserDrawer(true, record);
   }
   /**
    * 操作栏
@@ -159,8 +160,8 @@
       {
         label: '授权',
         onClick: handlePerssion.bind(null, record),
-      }
-    ]
+      },
+    ];
   }
 
   /**
@@ -175,20 +176,22 @@
       {
         label: '详情',
         onClick: handleDetail.bind(null, record),
-      }, {
+      },
+      {
         label: '删除',
         popConfirm: {
           title: '是否确认删除',
           confirm: handleDelete.bind(null, record),
         },
-      },{
+      },
+      {
         label: '首页配置',
         onClick: handleIndexConfig.bind(null, record.roleCode),
-      }, {
+      },
+      {
         label: '工单?',
         onClick: handleDesign.bind(null, record.id),
-      }
-    ]
+      },
+    ];
   }
-
 </script>
diff --git a/src/views/system/role/role.api.ts b/src/views/system/role/role.api.ts
index 0b755c2..f535ab9 100644
--- a/src/views/system/role/role.api.ts
+++ b/src/views/system/role/role.api.ts
@@ -1,5 +1,5 @@
-import {defHttp} from '/@/utils/http/axios';
-import {Modal} from 'ant-design-vue';
+import { defHttp } from '/@/utils/http/axios';
+import { Modal } from 'ant-design-vue';
 
 enum Api {
   list = '/sys/role/list',
@@ -21,9 +21,9 @@ enum Api {
   deleteUserRole = '/sys/user/deleteUserRole',
   batchDeleteUserRole = '/sys/user/deleteUserRoleBatch',
   addUserRole = '/sys/user/addSysUserRole',
-  saveRoleIndex='/sys/sysRoleIndex/add',
-  editRoleIndex='/sys/sysRoleIndex/edit',
-  queryIndexByCode='/sys/sysRoleIndex/queryByCode',
+  saveRoleIndex = '/sys/sysRoleIndex/add',
+  editRoleIndex = '/sys/sysRoleIndex/edit',
+  queryIndexByCode = '/sys/sysRoleIndex/queryByCode',
 }
 /**
  * 导出api
@@ -37,17 +37,16 @@ export const getImportUrl = Api.importExcel;
  * 列表
  * @param params
  */
-export const list = (params) =>
-  defHttp.get({url: Api.list, params});
+export const list = (params) => defHttp.get({ url: Api.list, params });
 
 /**
  * 删除角色
  */
 export const deleteRole = (params, handleSuccess) => {
-  return defHttp.delete({url: Api.deleteRole, params}, {joinParamsToUrl: true}).then(() => {
+  return defHttp.delete({ url: Api.deleteRole, params }, { joinParamsToUrl: true }).then(() => {
     handleSuccess();
   });
-}
+};
 /**
  * 批量删除角色
  * @param params
@@ -59,82 +58,72 @@ export const batchDeleteRole = (params, handleSuccess) => {
     okText: '确认',
     cancelText: '取消',
     onOk: () => {
-      return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
+      return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => {
         handleSuccess();
       });
-    }
+    },
   });
-}
+};
 /**
  * 保存或者更新角色
  * @param params
  */
 export const saveOrUpdateRole = (params, isUpdate) => {
   let url = isUpdate ? Api.edit : Api.save;
-  return defHttp.post({url: url, params});
-}
+  return defHttp.post({ url: url, params });
+};
 /**
  * 编码校验
  * @param params
  */
-export const isRoleExist = (params) =>
-  defHttp.get({url: Api.isRoleExist, params}, {isTransformResponse: false});
+export const isRoleExist = (params) => defHttp.get({ url: Api.isRoleExist, params }, { isTransformResponse: false });
 /**
  * 根据角色查询树信息
  */
-export const queryTreeListForRole = () =>
-  defHttp.get({url: Api.queryTreeListForRole});
+export const queryTreeListForRole = () => defHttp.get({ url: Api.queryTreeListForRole });
 /**
  * 查询角色权限
  */
-export const queryRolePermission = (params) =>
-  defHttp.get({url: Api.queryRolePermission, params});
+export const queryRolePermission = (params) => defHttp.get({ url: Api.queryRolePermission, params });
 /**
  * 保存角色权限
  */
-export const saveRolePermission = (params) =>
-  defHttp.post({url: Api.saveRolePermission, params});
+export const saveRolePermission = (params) => defHttp.post({ url: Api.saveRolePermission, params });
 /**
  * 查询角色数据规则
  */
-export const queryDataRule = (params) =>
-  defHttp.get({url: `${Api.queryDataRule}/${params.functionId}/${params.roleId}`}, {isTransformResponse: false});
+export const queryDataRule = (params) => defHttp.get({ url: `${Api.queryDataRule}/${params.functionId}/${params.roleId}` }, { isTransformResponse: false });
 /**
  * 保存角色数据规则
  */
-export const saveDataRule = (params) =>
-  defHttp.post({url: Api.queryDataRule,params});
+export const saveDataRule = (params) => defHttp.post({ url: Api.queryDataRule, params });
 /**
  * 获取表单数据
  * @return List<Map>
  */
-export const getParentDesignList = () =>
-  defHttp.get({url: Api.getParentDesignList});
+export const getParentDesignList = () => defHttp.get({ url: Api.getParentDesignList });
 /**
  * 获取角色表单数据
  * @return List<Map>
  */
-export const getRoleDegisnList = (params) =>
-  defHttp.get({url: Api.getRoleDegisnList,params});
+export const getRoleDegisnList = (params) => defHttp.get({ url: Api.getRoleDegisnList, params });
 /**
  * 提交角色工单信息
  */
-export const saveRoleDesign = (params) =>
-  defHttp.post({url: Api.saveRoleDesign,params});
+export const saveRoleDesign = (params) => defHttp.post({ url: Api.saveRoleDesign, params });
 /**
  * 角色列表接口
  * @param params
  */
-export const userList = (params) =>
-  defHttp.get({url: Api.userList, params});
+export const userList = (params) => defHttp.get({ url: Api.userList, params });
 /**
  * 删除角色用户
  */
 export const deleteUserRole = (params, handleSuccess) => {
-  return defHttp.delete({url: Api.deleteUserRole, params}, {joinParamsToUrl: true}).then(() => {
+  return defHttp.delete({ url: Api.deleteUserRole, params }, { joinParamsToUrl: true }).then(() => {
     handleSuccess();
   });
-}
+};
 /**
  * 批量删除角色用户
  * @param params
@@ -146,32 +135,31 @@ export const batchDeleteUserRole = (params, handleSuccess) => {
     okText: '确认',
     cancelText: '取消',
     onOk: () => {
-      return defHttp.delete({url: Api.batchDeleteUserRole, params}, {joinParamsToUrl: true}).then(() => {
+      return defHttp.delete({ url: Api.batchDeleteUserRole, params }, { joinParamsToUrl: true }).then(() => {
         handleSuccess();
       });
-    }
+    },
   });
-}
+};
 /**
  * 添加已有用户
  */
 export const addUserRole = (params, handleSuccess) => {
-  return defHttp.post({url: Api.addUserRole, params}).then(() => {
+  return defHttp.post({ url: Api.addUserRole, params }).then(() => {
     handleSuccess();
   });
-}
+};
 /**
  * 保存或者更新
  * @param params
  * @param isUpdate 是否是更新数据
  */
 export const saveOrUpdateRoleIndex = (params, isUpdate) => {
-    let url = isUpdate ? Api.editRoleIndex : Api.saveRoleIndex;
-    return defHttp.post({url: url, params});
-}
+  let url = isUpdate ? Api.editRoleIndex : Api.saveRoleIndex;
+  return defHttp.post({ url: url, params });
+};
 /**
  * 根据code查询首页配置
  * @param params
  */
-export const queryIndexByCode = (params) =>
-    defHttp.get({url: Api.queryIndexByCode, params}, {isTransformResponse: false});
+export const queryIndexByCode = (params) => defHttp.get({ url: Api.queryIndexByCode, params }, { isTransformResponse: false });
diff --git a/src/views/system/role/role.data.ts b/src/views/system/role/role.data.ts
index 04f742f..df9b268 100644
--- a/src/views/system/role/role.data.ts
+++ b/src/views/system/role/role.data.ts
@@ -33,15 +33,15 @@ export const userColumns = [
     title: '状态',
     dataIndex: 'status_dictText',
     width: 80,
-  }
+  },
 ];
 export const searchFormSchema: FormSchema[] = [
   {
     field: 'roleName',
     label: '角色名称',
     component: 'Input',
-    colProps: { span: 6},
-  }
+    colProps: { span: 6 },
+  },
 ];
 /**
  * 角色用户搜索form
@@ -52,7 +52,7 @@ export const searchUserFormSchema: FormSchema[] = [
     label: '用户账号',
     component: 'Input',
     colProps: { span: 12 },
-  }
+  },
 ];
 
 export const formSchema: FormSchema[] = [
@@ -60,7 +60,7 @@ export const formSchema: FormSchema[] = [
     field: 'id',
     label: '',
     component: 'Input',
-    show:false
+    show: false,
   },
   {
     field: 'roleName',
@@ -73,11 +73,11 @@ export const formSchema: FormSchema[] = [
     label: '角色编码',
     required: true,
     component: 'Input',
-    dynamicDisabled: ({values}) => {
+    dynamicDisabled: ({ values }) => {
       return !!values.id;
     },
-    dynamicRules: ({ values,model }) => {
-      console.log("values:",values)
+    dynamicRules: ({ values, model }) => {
+      console.log('values:', values);
       return [
         {
           required: true,
@@ -85,14 +85,15 @@ export const formSchema: FormSchema[] = [
             if (!value) {
               return Promise.reject('请输入角色编码');
             }
-            if(values){
+            if (values) {
               return new Promise((resolve, reject) => {
-                isRoleExist({id:model.id,roleCode:value})
+                isRoleExist({ id: model.id, roleCode: value })
                   .then((res) => {
-                    res.success? resolve(): reject(res.message || '校验失败');
-                  }).catch((err) => {
-                  reject(err.message || '验证失败');
-                });
+                    res.success ? resolve() : reject(res.message || '校验失败');
+                  })
+                  .catch((err) => {
+                    reject(err.message || '验证失败');
+                  });
               });
             }
             return Promise.resolve();
@@ -105,7 +106,7 @@ export const formSchema: FormSchema[] = [
     label: '备注',
     field: 'description',
     component: 'InputTextArea',
-  }
+  },
 ];
 
 export const formDescSchema = [
@@ -115,44 +116,44 @@ export const formDescSchema = [
   },
   {
     field: 'roleCode',
-    label: '角色编码'
+    label: '角色编码',
   },
   {
     label: '备注',
     field: 'description',
-  }
+  },
 ];
 
 export const roleIndexFormSchema: FormSchema[] = [
-    {
-        field: 'id',
-        label: '',
-        component: 'Input',
-        show:false
+  {
+    field: 'id',
+    label: '',
+    component: 'Input',
+    show: false,
+  },
+  {
+    label: '角色编码',
+    field: 'roleCode',
+    component: 'Input',
+    dynamicDisabled: true,
+  },
+  {
+    label: '首页路由',
+    field: 'url',
+    component: 'Input',
+    required: true,
+  },
+  {
+    label: '优先级',
+    field: 'priority',
+    component: 'InputNumber',
+  },
+  {
+    label: '是否开启',
+    field: 'status',
+    component: 'JSwitch',
+    componentProps: {
+      options: ['1', '0'],
     },
-    {
-        label: '角色编码',
-        field: 'roleCode',
-        component: 'Input',
-        dynamicDisabled: true
-    },
-    {
-        label: '首页路由',
-        field: 'url',
-        component: 'Input',
-        required:true
-    },
-    {
-        label: '优先级',
-        field: 'priority',
-        component: 'InputNumber'
-    },
-    {
-        label: '是否开启',
-        field: 'status',
-        component: 'JSwitch',
-        componentProps:{
-            options	: ['1', '0'], 
-       }
-    }
+  },
 ];
diff --git a/src/views/system/tenant/TenantModal.vue b/src/views/system/tenant/TenantModal.vue
index 5e64aff..4762b91 100644
--- a/src/views/system/tenant/TenantModal.vue
+++ b/src/views/system/tenant/TenantModal.vue
@@ -1,57 +1,57 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit" width="700px">
-        <BasicForm @register="registerForm"/>
-    </BasicModal>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit" width="700px">
+    <BasicForm @register="registerForm" />
+  </BasicModal>
 </template>
 <script lang="ts" setup>
-    import {ref, computed, unref} from 'vue';
-    import {BasicModal, useModalInner} from '/@/components/Modal';
-    import {BasicForm, useForm} from '/@/components/Form/index';
-    import {formSchema} from './tenant.data';
-    import {saveOrUpdateTenant, getTenantById} from './tenant.api';
-    // Emits声明
-    const emit = defineEmits(['register','success']);
-    const isUpdate = ref(true);
-    //表单配置
-    const [registerForm, {resetFields, setFieldsValue, validate, updateSchema}] = useForm({
-        labelWidth: 150,
-        schemas: formSchema,
-        showActionButtonGroup: false,
-    });
-    //表单赋值
-    const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
-        //重置表单
-        await resetFields();
-        setModalProps({confirmLoading: false});
-        isUpdate.value = !!data?.isUpdate;
-        if (unref(isUpdate)) {
-            // 编辑模式下禁用id字段
-            updateSchema({field: 'id', dynamicDisabled: true})
-            //获取详情
-            data.record = await getTenantById({id: data.record.id});
-            //表单赋值
-            await setFieldsValue({
-                ...data.record,
-            });
-        } else {
-          updateSchema({field: 'id', dynamicDisabled: false})
-        }
-    });
-    //设置标题
-    const title = computed(() => (!unref(isUpdate) ? '新增租户' : '编辑租户'));
-    //表单提交事件
-    async function handleSubmit(v) {
-        try {
-            let values = await validate();
-            setModalProps({confirmLoading: true});
-            //提交表单
-            await saveOrUpdateTenant(values, isUpdate.value);
-            //关闭弹窗
-            closeModal();
-            //刷新列表
-            emit('success');
-        } finally {
-            setModalProps({confirmLoading: false});
-        }
+  import { ref, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { formSchema } from './tenant.data';
+  import { saveOrUpdateTenant, getTenantById } from './tenant.api';
+  // Emits声明
+  const emit = defineEmits(['register', 'success']);
+  const isUpdate = ref(true);
+  //表单配置
+  const [registerForm, { resetFields, setFieldsValue, validate, updateSchema }] = useForm({
+    labelWidth: 150,
+    schemas: formSchema,
+    showActionButtonGroup: false,
+  });
+  //表单赋值
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    //重置表单
+    await resetFields();
+    setModalProps({ confirmLoading: false });
+    isUpdate.value = !!data?.isUpdate;
+    if (unref(isUpdate)) {
+      // 编辑模式下禁用id字段
+      updateSchema({ field: 'id', dynamicDisabled: true });
+      //获取详情
+      data.record = await getTenantById({ id: data.record.id });
+      //表单赋值
+      await setFieldsValue({
+        ...data.record,
+      });
+    } else {
+      updateSchema({ field: 'id', dynamicDisabled: false });
     }
+  });
+  //设置标题
+  const title = computed(() => (!unref(isUpdate) ? '新增租户' : '编辑租户'));
+  //表单提交事件
+  async function handleSubmit(v) {
+    try {
+      let values = await validate();
+      setModalProps({ confirmLoading: true });
+      //提交表单
+      await saveOrUpdateTenant(values, isUpdate.value);
+      //关闭弹窗
+      closeModal();
+      //刷新列表
+      emit('success');
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
+  }
 </script>
diff --git a/src/views/system/tenant/index.vue b/src/views/system/tenant/index.vue
index d66366b..f4c8787 100644
--- a/src/views/system/tenant/index.vue
+++ b/src/views/system/tenant/index.vue
@@ -2,8 +2,8 @@
   <div>
     <BasicTable @register="registerTable" :rowSelection="rowSelection">
       <template #tableTitle>
-        <a-button  preIcon="ant-design:plus-outlined" type="primary" @click="handleAdd" style="margin-right: 5px">新增</a-button>
-        <a-dropdown v-if="selectedRowKeys.length > 0" >
+        <a-button preIcon="ant-design:plus-outlined" type="primary" @click="handleAdd" style="margin-right: 5px">新增</a-button>
+        <a-dropdown v-if="selectedRowKeys.length > 0">
           <template #overlay>
             <a-menu>
               <a-menu-item key="1" @click="batchHandleDelete">
@@ -12,30 +12,31 @@
               </a-menu-item>
             </a-menu>
           </template>
-          <a-button>批量操作
-            <Icon  icon="mdi:chevron-down"></Icon>
+          <a-button
+            >批量操作
+            <Icon icon="mdi:chevron-down"></Icon>
           </a-button>
         </a-dropdown>
       </template>
       <template #action="{ record }">
-        <TableAction :actions="getActions(record)"/>
+        <TableAction :actions="getActions(record)" />
       </template>
     </BasicTable>
-    <TenantModal @register="registerModal" @success="reload"/>
+    <TenantModal @register="registerModal" @success="reload" />
   </div>
 </template>
 <script lang="ts" name="system-tenant" setup>
-  import {ref} from 'vue';
-  import {BasicTable, TableAction} from '/@/components/Table';
-  import {useModal} from '/@/components/Modal';
-  import {getTenantList, deleteTenant, batchDeleteTenant} from './tenant.api';
-  import {columns, searchFormSchema} from './tenant.data';
+  import { ref } from 'vue';
+  import { BasicTable, TableAction } from '/@/components/Table';
+  import { useModal } from '/@/components/Modal';
+  import { getTenantList, deleteTenant, batchDeleteTenant } from './tenant.api';
+  import { columns, searchFormSchema } from './tenant.data';
   import TenantModal from './TenantModal.vue';
-  import {useMessage} from "/@/hooks/web/useMessage";
-  import { useListPage } from '/@/hooks/system/useListPage'
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { useListPage } from '/@/hooks/system/useListPage';
 
-  const {createMessage} = useMessage();
-  const [registerModal, {openModal}] = useModal();
+  const { createMessage } = useMessage();
+  const [registerModal, { openModal }] = useModal();
 
   // 列表页面公共参数、方法
   const { prefixCls, tableContext } = useListPage({
@@ -46,12 +47,11 @@
       columns: columns,
       formConfig: {
         schemas: searchFormSchema,
-        fieldMapToTime: [['fieldTime', ['beginDate', 'endDate'], 'YYYY-MM-DD HH:mm:ss']]
-      }
-    }
-  })
-  const [registerTable, {reload},{ rowSelection, selectedRowKeys }] =tableContext;
-
+        fieldMapToTime: [['fieldTime', ['beginDate', 'endDate'], 'YYYY-MM-DD HH:mm:ss']],
+      },
+    },
+  });
+  const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;
 
   /**
    * 操作列定义
@@ -71,10 +71,9 @@
           confirm: handleDelete.bind(null, record),
         },
       },
-    ]
+    ];
   }
 
-
   /**
    * 新增事件
    */
@@ -98,13 +97,13 @@
    * 删除事件
    */
   async function handleDelete(record) {
-    await deleteTenant({id: record.id}, reload);
+    await deleteTenant({ id: record.id }, reload);
   }
 
   /**
    * 批量删除事件
    */
   async function batchHandleDelete() {
-    await batchDeleteTenant({ids: selectedRowKeys.value}, reload);
+    await batchDeleteTenant({ ids: selectedRowKeys.value }, reload);
   }
 </script>
diff --git a/src/views/system/tenant/tenant.api.ts b/src/views/system/tenant/tenant.api.ts
index 5c0932f..7c7258e 100644
--- a/src/views/system/tenant/tenant.api.ts
+++ b/src/views/system/tenant/tenant.api.ts
@@ -1,14 +1,14 @@
-import {defHttp} from '/@/utils/http/axios';
-import {Modal} from 'ant-design-vue';
+import { defHttp } from '/@/utils/http/axios';
+import { Modal } from 'ant-design-vue';
 
 enum Api {
-    list = "/sys/tenant/list",
-    save = "/sys/tenant/add",
-    edit = "/sys/tenant/edit",
-    get = "/sys/tenant/queryById",
-    delete = "/sys/tenant/delete",
-    deleteBatch = "/sys/tenant/deleteBatch",
-    getCurrentUserTenants = "/sys/tenant/getCurrentUserTenant",
+  list = '/sys/tenant/list',
+  save = '/sys/tenant/add',
+  edit = '/sys/tenant/edit',
+  get = '/sys/tenant/queryById',
+  delete = '/sys/tenant/delete',
+  deleteBatch = '/sys/tenant/deleteBatch',
+  getCurrentUserTenants = '/sys/tenant/getCurrentUserTenant',
 }
 
 /**
@@ -16,55 +16,55 @@ enum Api {
  * @param params
  */
 export const getTenantList = (params) => {
-    return defHttp.get({url: Api.list, params});
-}
+  return defHttp.get({ url: Api.list, params });
+};
 
 /**
  * 保存或者更新租户
  * @param params
  */
 export const saveOrUpdateTenant = (params, isUpdate) => {
-    let url = isUpdate ? Api.edit : Api.save;
-    return defHttp.post({url: url, params});
-}
+  let url = isUpdate ? Api.edit : Api.save;
+  return defHttp.post({ url: url, params });
+};
 
 /**
  * 查询租户详情
  * @param params
  */
 export const getTenantById = (params) => {
-    return defHttp.get({url: Api.get, params});
-}
+  return defHttp.get({ url: Api.get, params });
+};
 
 /**
  * 删除租户
  * @param params
  */
-export const deleteTenant = (params,handleSuccess) => {
-    return defHttp.delete({url: Api.delete, data: params}, {joinParamsToUrl: true}).then(()=>{
-        handleSuccess();
-    });
-}
+export const deleteTenant = (params, handleSuccess) => {
+  return defHttp.delete({ url: Api.delete, data: params }, { joinParamsToUrl: true }).then(() => {
+    handleSuccess();
+  });
+};
 
 /**
  * 批量删除租户
  * @param params
  */
 export const batchDeleteTenant = (params, handleSuccess) => {
-    Modal.confirm({
-        title: '确认删除',
-        content: '是否删除选中数据',
-        okText: '确认',
-        cancelText: '取消',
-        onOk: () => {
-            return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
-                handleSuccess();
-            });
-        }
-    });
-}
+  Modal.confirm({
+    title: '确认删除',
+    content: '是否删除选中数据',
+    okText: '确认',
+    cancelText: '取消',
+    onOk: () => {
+      return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => {
+        handleSuccess();
+      });
+    },
+  });
+};
 
 /**
  * 获取登录用户部门信息
  */
-export const getUserTenants = (params?) => defHttp.get({ url: Api.getCurrentUserTenants, params })
+export const getUserTenants = (params?) => defHttp.get({ url: Api.getCurrentUserTenants, params });
diff --git a/src/views/system/tenant/tenant.data.ts b/src/views/system/tenant/tenant.data.ts
index 6bc0a25..f050916 100644
--- a/src/views/system/tenant/tenant.data.ts
+++ b/src/views/system/tenant/tenant.data.ts
@@ -1,40 +1,40 @@
 import { BasicColumn, FormSchema } from '/@/components/Table';
 
 export const columns: BasicColumn[] = [
-    {
-        title: '租户名称',
-        dataIndex: 'name',
-        width: 200,
-        align: 'left',
-    },
-    {
-        title: '租户编号',
-        dataIndex: 'id',
-        width: 180,
-    },
-    {
-        title: '开始时间',
-        dataIndex: 'beginDate',
-        sorter: true,
-        width: 180,
-    },
-    {
-        title: '结束时间',
-        dataIndex: 'endDate',
-        sorter: true,
-        width: 180
-    },
-    {
-        title: '创建时间',
-        dataIndex: 'createTime',
-        sorter: true,
-      width: 180
-    },
-    {
-        title: '状态',
-        dataIndex: 'status_dictText',
-        width: 100,
-    }
+  {
+    title: '租户名称',
+    dataIndex: 'name',
+    width: 200,
+    align: 'left',
+  },
+  {
+    title: '租户编号',
+    dataIndex: 'id',
+    width: 180,
+  },
+  {
+    title: '开始时间',
+    dataIndex: 'beginDate',
+    sorter: true,
+    width: 180,
+  },
+  {
+    title: '结束时间',
+    dataIndex: 'endDate',
+    sorter: true,
+    width: 180,
+  },
+  {
+    title: '创建时间',
+    dataIndex: 'createTime',
+    sorter: true,
+    width: 180,
+  },
+  {
+    title: '状态',
+    dataIndex: 'status_dictText',
+    width: 100,
+  },
 ];
 
 export const searchFormSchema: FormSchema[] = [
@@ -67,46 +67,46 @@ export const searchFormSchema: FormSchema[] = [
 ];
 
 export const formSchema: FormSchema[] = [
-    {
-        field: 'name',
-        label: '租户名称',
-        component: 'Input',
-        required: true
+  {
+    field: 'name',
+    label: '租户名称',
+    component: 'Input',
+    required: true,
+  },
+  {
+    field: 'id',
+    label: '租户编号',
+    component: 'InputNumber',
+    required: true,
+  },
+  {
+    field: 'beginDate',
+    label: '开始时间',
+    component: 'DatePicker',
+    componentProps: {
+      showTime: true,
+      valueFormat: 'YYYY-MM-DD HH:mm:ss',
     },
-    {
-        field: 'id',
-        label: '租户编号',
-        component: 'InputNumber',
-        required: true
+  },
+  {
+    field: 'endDate',
+    label: '结束时间',
+    component: 'DatePicker',
+    componentProps: {
+      showTime: true,
+      valueFormat: 'YYYY-MM-DD HH:mm:ss',
     },
-    {
-        field: 'beginDate',
-        label: '开始时间',
-        component: 'DatePicker',
-        componentProps: {
-            showTime:true,
-            valueFormat:'YYYY-MM-DD HH:mm:ss',
-        }
-    },
-    {
-        field: 'endDate',
-        label: '结束时间',
-        component: 'DatePicker',
-        componentProps: {
-            showTime:true,
-            valueFormat:'YYYY-MM-DD HH:mm:ss',
-        }
-    },
-    {
-        field: 'status',
-        label: '状态',
-        component: 'RadioButtonGroup',
-        defaultValue: 1,
-        componentProps: {
-            options: [
-                {label: '正常', value: 1},
-                {label: '冻结', value: 0},
-            ],
-        },
+  },
+  {
+    field: 'status',
+    label: '状态',
+    component: 'RadioButtonGroup',
+    defaultValue: 1,
+    componentProps: {
+      options: [
+        { label: '正常', value: 1 },
+        { label: '冻结', value: 0 },
+      ],
     },
+  },
 ];
diff --git a/src/views/system/user/PasswordModal.vue b/src/views/system/user/PasswordModal.vue
index a02f71f..d638c86 100644
--- a/src/views/system/user/PasswordModal.vue
+++ b/src/views/system/user/PasswordModal.vue
@@ -1,34 +1,34 @@
 <template>
   <BasicModal v-bind="$attrs" @register="registerModal" title="修改密码" @ok="handleSubmit">
-    <BasicForm @register="registerForm"/>
+    <BasicForm @register="registerForm" />
   </BasicModal>
 </template>
 <script lang="ts" name="PassWordModal" setup>
-  import {ref, computed, unref} from 'vue';
-  import {BasicModal, useModalInner} from '/@/components/Modal';
-  import {BasicForm, useForm} from '/@/components/Form/index';
-  import {formPasswordSchema} from './user.data';
-  import {changePassword} from './user.api';
+  import { ref, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { formPasswordSchema } from './user.data';
+  import { changePassword } from './user.api';
   // 声明Emits
   const emit = defineEmits(['success', 'register']);
   //表单配置
-  const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
+  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
     schemas: formPasswordSchema,
     showActionButtonGroup: false,
   });
   //表单赋值
-  const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
     //重置表单
     await resetFields();
-    setModalProps({confirmLoading: false});
+    setModalProps({ confirmLoading: false });
     //表单赋值
-    await setFieldsValue({...data});
+    await setFieldsValue({ ...data });
   });
   //表单提交事件
   async function handleSubmit() {
     try {
       const values = await validate();
-      setModalProps({confirmLoading: true});
+      setModalProps({ confirmLoading: true });
       //提交表单
       await changePassword(values);
       //关闭弹窗
@@ -36,7 +36,7 @@
       //刷新列表
       emit('success');
     } finally {
-      setModalProps({confirmLoading: false});
+      setModalProps({ confirmLoading: false });
     }
   }
 </script>
diff --git a/src/views/system/user/UserAgentModal.vue b/src/views/system/user/UserAgentModal.vue
index ff86510..25e8d4b 100644
--- a/src/views/system/user/UserAgentModal.vue
+++ b/src/views/system/user/UserAgentModal.vue
@@ -1,37 +1,37 @@
 <template>
   <BasicModal v-bind="$attrs" @register="registerModal" :width="800" title="用户代理" @ok="handleSubmit">
-    <BasicForm @register="registerForm"/>
+    <BasicForm @register="registerForm" />
   </BasicModal>
 </template>
 <script lang="ts" setup>
-  import {ref, computed, unref} from 'vue';
-  import {BasicModal, useModalInner} from '/@/components/Modal';
-  import {BasicForm, useForm} from '/@/components/Form/index';
-  import {formAgentSchema} from './user.data';
-  import {getUserAgent,saveOrUpdateAgent} from './user.api';
+  import { ref, computed, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { formAgentSchema } from './user.data';
+  import { getUserAgent, saveOrUpdateAgent } from './user.api';
   // 声明Emits
-  const emit = defineEmits(['success','register']);
+  const emit = defineEmits(['success', 'register']);
   //表单配置
-  const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
+  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
     schemas: formAgentSchema,
     showActionButtonGroup: false,
   });
   //表单赋值
-  const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
     //重置表单
     await resetFields();
-    setModalProps({confirmLoading: false});
+    setModalProps({ confirmLoading: false });
     //查询获取表单数据
-    const res = await getUserAgent({userName: data.userName});
-    data = res.result?res.result:data;
+    const res = await getUserAgent({ userName: data.userName });
+    data = res.result ? res.result : data;
     //表单赋值
-    await setFieldsValue({...data});
+    await setFieldsValue({ ...data });
   });
   //表单提交事件
   async function handleSubmit() {
     try {
       const values = await validate();
-      setModalProps({confirmLoading: true});
+      setModalProps({ confirmLoading: true });
       //提交表单
       await saveOrUpdateAgent(values);
       //关闭弹窗
@@ -39,7 +39,7 @@
       //刷新列表
       emit('success');
     } finally {
-      setModalProps({confirmLoading: false});
+      setModalProps({ confirmLoading: false });
     }
   }
 </script>
diff --git a/src/views/system/user/UserDrawer.vue b/src/views/system/user/UserDrawer.vue
index 625250b..089a387 100644
--- a/src/views/system/user/UserDrawer.vue
+++ b/src/views/system/user/UserDrawer.vue
@@ -4,67 +4,66 @@
   </BasicDrawer>
 </template>
 <script lang="ts" setup>
-  import {defineComponent, ref, computed, unref,useAttrs} from 'vue';
-  import {BasicForm, useForm} from '/@/components/Form/index';
-  import {formSchema} from './user.data';
-  import {BasicDrawer, useDrawerInner} from '/@/components/Drawer';
-  import {saveOrUpdateUser,getUserRoles,getUserDepartList} from './user.api';
-  import {useDrawerAdaptiveWidth} from '/@/hooks/jeecg/useAdaptiveWidth'
+  import { defineComponent, ref, computed, unref, useAttrs } from 'vue';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { formSchema } from './user.data';
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
+  import { saveOrUpdateUser, getUserRoles, getUserDepartList } from './user.api';
+  import { useDrawerAdaptiveWidth } from '/@/hooks/jeecg/useAdaptiveWidth';
   // 声明Emits
   const emit = defineEmits(['success', 'register']);
-  const attrs = useAttrs()
+  const attrs = useAttrs();
   const isUpdate = ref(true);
   const rowId = ref('');
   const departOptions = ref([]);
   //表单配置
-  const [registerForm, {setProps,resetFields, setFieldsValue, validate, updateSchema}] = useForm({
+  const [registerForm, { setProps, resetFields, setFieldsValue, validate, updateSchema }] = useForm({
     labelWidth: 90,
     schemas: formSchema,
     showActionButtonGroup: false,
   });
   // TODO [VUEN-527] https://www.teambition.com/task/6239beb894b358003fe93626
-  const showFooter = ref(true)
+  const showFooter = ref(true);
   //表单赋值
-  const [registerDrawer, {setDrawerProps, closeDrawer}] = useDrawerInner(async (data) => {
+  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
     await resetFields();
-    showFooter.value = data?.showFooter ?? true
-    setDrawerProps({ confirmLoading: false, showFooter: showFooter.value })
+    showFooter.value = data?.showFooter ?? true;
+    setDrawerProps({ confirmLoading: false, showFooter: showFooter.value });
     isUpdate.value = !!data?.isUpdate;
     if (unref(isUpdate)) {
       rowId.value = data.record.id;
       //租户信息定义成数组
       if (data.record.relTenantIds && !Array.isArray(data.record.relTenantIds)) {
-        data.record.relTenantIds = data.record.relTenantIds.split(",");
-      }else{
+        data.record.relTenantIds = data.record.relTenantIds.split(',');
+      } else {
         data.record.relTenantIds = [];
       }
-     //查角色/赋值/try catch 处理，不然编辑有问题
-     try {
-        const userRoles = await getUserRoles({userid: data.record.id});
-        if(userRoles && userRoles.length > 0 ){
-            data.record.selectedroles = userRoles
+      //查角色/赋值/try catch 处理，不然编辑有问题
+      try {
+        const userRoles = await getUserRoles({ userid: data.record.id });
+        if (userRoles && userRoles.length > 0) {
+          data.record.selectedroles = userRoles;
         }
-     } catch (error) {
-     }
+      } catch (error) {}
 
-     //查所属部门/赋值
-     const userDepart = await getUserDepartList({userId: data.record.id});
-     if(userDepart && userDepart.length > 0 ){
-         data.record.selecteddeparts = userDepart;
-         let selectDepartKeys = Array.from(userDepart, ({key}) => key);
-         data.record.selecteddeparts = selectDepartKeys.join(",");
-         departOptions.value = userDepart.map(item=>{
-             return {label: item.title,value: item.key}
-         });
-     }
-     //负责部门/赋值
-     data.record.departIds && !Array.isArray(data.record.departIds) &&(data.record.departIds = data.record.departIds.split(","));
-    //update-begin---author:zyf   Date:20211210  for：避免空值显示异常------------
-     data.record.departIds=data.record.departIds==""?[]:data.record.departIds
-     //update-begin---author:zyf   Date:20211210  for：避免空值显示异常------------
+      //查所属部门/赋值
+      const userDepart = await getUserDepartList({ userId: data.record.id });
+      if (userDepart && userDepart.length > 0) {
+        data.record.selecteddeparts = userDepart;
+        let selectDepartKeys = Array.from(userDepart, ({ key }) => key);
+        data.record.selecteddeparts = selectDepartKeys.join(',');
+        departOptions.value = userDepart.map((item) => {
+          return { label: item.title, value: item.key };
+        });
+      }
+      //负责部门/赋值
+      data.record.departIds && !Array.isArray(data.record.departIds) && (data.record.departIds = data.record.departIds.split(','));
+      //update-begin---author:zyf   Date:20211210  for：避免空值显示异常------------
+      data.record.departIds = data.record.departIds == '' ? [] : data.record.departIds;
+      //update-begin---author:zyf   Date:20211210  for：避免空值显示异常------------
     }
     //处理角色用户列表情况(和角色列表有关系)
-    data.selectedroles && await setFieldsValue({selectedroles:data.selectedroles});
+    data.selectedroles && (await setFieldsValue({ selectedroles: data.selectedroles }));
     //编辑时隐藏密码/角色列表隐藏角色信息/我的部门时隐藏所属部门
     updateSchema([
       {
@@ -77,44 +76,44 @@
       },
       {
         field: 'selectedroles',
-        show: !data.isRole
+        show: !data.isRole,
       },
       {
         field: 'departIds',
-        componentProps: {options:departOptions},
+        componentProps: { options: departOptions },
       },
       {
         field: 'selecteddeparts',
-        show: !data?.departDisabled ?? false
-      }
+        show: !data?.departDisabled ?? false,
+      },
     ]);
     // 无论新增还是编辑，都可以设置表单值
     if (typeof data.record === 'object') {
       setFieldsValue({
         ...data.record,
-      })
+      });
     }
     // 隐藏底部时禁用整个表单
-    setProps({ disabled: !showFooter })
+    setProps({ disabled: !showFooter });
   });
   //获取标题
   const getTitle = computed(() => (!unref(isUpdate) ? '新增用户' : '编辑用户'));
-  const {adaptiveWidth} = useDrawerAdaptiveWidth()
+  const { adaptiveWidth } = useDrawerAdaptiveWidth();
 
   //提交事件
   async function handleSubmit() {
     try {
       let values = await validate();
-      setDrawerProps({confirmLoading: true});
-      values.userIdentity===1&&(values.departIds='');
+      setDrawerProps({ confirmLoading: true });
+      values.userIdentity === 1 && (values.departIds = '');
       //提交表单
       await saveOrUpdateUser(values, unref(isUpdate));
       //关闭弹窗
       closeDrawer();
       //刷新列表
-      emit('success', {isUpdate: unref(isUpdate), values: {...values, id: rowId.value}});
+      emit('success', { isUpdate: unref(isUpdate), values: { ...values, id: rowId.value } });
     } finally {
-      setDrawerProps({confirmLoading: false});
+      setDrawerProps({ confirmLoading: false });
     }
   }
 </script>
diff --git a/src/views/system/user/UserRecycleBinModal.vue b/src/views/system/user/UserRecycleBinModal.vue
index 1452da8..a4e3605 100644
--- a/src/views/system/user/UserRecycleBinModal.vue
+++ b/src/views/system/user/UserRecycleBinModal.vue
@@ -16,37 +16,38 @@
               </a-menu-item>
             </a-menu>
           </template>
-          <a-button>批量操作
+          <a-button
+            >批量操作
             <Icon icon="ant-design:down-outlined"></Icon>
           </a-button>
         </a-dropdown>
       </template>
       <!--操作栏-->
       <template #action="{ record }">
-        <TableAction :actions="getTableAction(record)"/>
+        <TableAction :actions="getTableAction(record)" />
       </template>
     </BasicTable>
   </BasicModal>
 </template>
 <script lang="ts" setup>
-  import {ref,toRaw,unref} from 'vue';
-  import {BasicModal, useModalInner} from '/@/components/Modal';
-  import {BasicTable, useTable, TableAction} from '/@/components/Table';
-  import {recycleColumns} from './user.data';
-  import {getRecycleBinList, putRecycleBin, deleteRecycleBin} from './user.api';
-  import {useMessage} from '/@/hooks/web/useMessage'
+  import { ref, toRaw, unref } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { BasicTable, useTable, TableAction } from '/@/components/Table';
+  import { recycleColumns } from './user.data';
+  import { getRecycleBinList, putRecycleBin, deleteRecycleBin } from './user.api';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
-  const {createConfirm} = useMessage()
+  const { createConfirm } = useMessage();
   // 声明Emits
   const emit = defineEmits(['success', 'register']);
   const checkedKeys = ref<Array<string | number>>([]);
   const [registerModal] = useModalInner(() => {
-    checkedKeys.value = []
-  })
+    checkedKeys.value = [];
+  });
   //注册table数据
-  const [registerTable, {reload}] = useTable({
+  const [registerTable, { reload }] = useTable({
     api: getRecycleBinList,
-    columns:recycleColumns,
+    columns: recycleColumns,
     rowKey: 'id',
     striped: true,
     useSearchForm: false,
@@ -55,16 +56,16 @@
     bordered: true,
     showIndexColumn: false,
     pagination: true,
-    tableSetting: {fullScreen: true},
+    tableSetting: { fullScreen: true },
     canResize: false,
     actionColumn: {
       width: 150,
       title: '操作',
       dataIndex: 'action',
-      slots: {customRender: 'action'},
+      slots: { customRender: 'action' },
       fixed: undefined,
     },
-  })
+  });
   /**
    * 选择列配置
    */
@@ -72,8 +73,8 @@
     type: 'checkbox',
     columnWidth: 50,
     selectedRowKeys: checkedKeys,
-    onChange: onSelectChange
-  }
+    onChange: onSelectChange,
+  };
   /**
    * 选择事件
    */
@@ -84,20 +85,20 @@
    * 还原事件
    */
   async function handleRevert(record) {
-    await putRecycleBin({userIds: record.id},reload)
-    emit('success')
+    await putRecycleBin({ userIds: record.id }, reload);
+    emit('success');
   }
   /**
    * 批量还原事件
    */
   function batchHandleRevert() {
-    handleRevert({id:toRaw(unref(checkedKeys)).join(",")})
+    handleRevert({ id: toRaw(unref(checkedKeys)).join(',') });
   }
   /**
    * 删除事件
    */
   async function handleDelete(record) {
-    await deleteRecycleBin({userIds: record.id},reload)
+    await deleteRecycleBin({ userIds: record.id }, reload);
   }
   /**
    * 批量删除事件
@@ -107,31 +108,29 @@
       iconType: 'warning',
       title: '删除',
       content: '确定要永久删除吗？删除后将不可恢复！',
-      onOk: () => handleDelete({id: toRaw(unref(checkedKeys)).join(',')}),
-      onCancel() {
-      },
-    })
+      onOk: () => handleDelete({ id: toRaw(unref(checkedKeys)).join(',') }),
+      onCancel() {},
+    });
   }
   //获取操作栏事件
   function getTableAction(record) {
     return [
       {
-        label:"取回",
+        label: '取回',
         icon: 'ant-design:redo-outlined',
         popConfirm: {
           title: '是否确认还原',
           confirm: handleRevert.bind(null, record),
-        }
+        },
       },
       {
-        label:"彻底删除",
+        label: '彻底删除',
         icon: 'ant-design:scissor-outlined',
         popConfirm: {
           title: '是否确认删除',
           confirm: handleDelete.bind(null, record),
         },
-      }
-    ]
+      },
+    ];
   }
-
 </script>
diff --git a/src/views/system/user/index.vue b/src/views/system/user/index.vue
index 51f369f..048ccfc 100644
--- a/src/views/system/user/index.vue
+++ b/src/views/system/user/index.vue
@@ -4,14 +4,14 @@
     <BasicTable @register="registerTable" :rowSelection="rowSelection">
       <!--插槽:table标题-->
       <template #tableTitle>
-          <a-button  type="primary" preIcon="ant-design:plus-outlined"  v-auth="'user:add'" @click="handleCreate" > 新增</a-button>
-          <a-button  type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
-          <j-upload-button  type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
-          <a-button  type="primary" @click="handleSyncUser" preIcon="ant-design:sync-outlined"> 同步流程</a-button>
-          <a-button  type="primary" @click="openModal(true,{})" preIcon="ant-design:hdd-outlined"> 回收站</a-button>
-          <JThirdAppButton biz-type="user" :selected-row-keys="selectedRowKeys" syncToApp syncToLocal @sync-finally="onSyncFinally"/>
-          <a-button  type="primary" preIcon="ant-design:filter-outlined"> 高级查询?</a-button>
-          <a-dropdown v-if="selectedRowKeys.length > 0">
+        <a-button type="primary" preIcon="ant-design:plus-outlined" v-auth="'user:add'" @click="handleCreate"> 新增</a-button>
+        <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
+        <j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
+        <a-button type="primary" @click="handleSyncUser" preIcon="ant-design:sync-outlined"> 同步流程</a-button>
+        <a-button type="primary" @click="openModal(true, {})" preIcon="ant-design:hdd-outlined"> 回收站</a-button>
+        <JThirdAppButton biz-type="user" :selected-row-keys="selectedRowKeys" syncToApp syncToLocal @sync-finally="onSyncFinally" />
+        <a-button type="primary" preIcon="ant-design:filter-outlined"> 高级查询?</a-button>
+        <a-dropdown v-if="selectedRowKeys.length > 0">
           <template #overlay>
             <a-menu>
               <a-menu-item key="1" @click="batchHandleDelete">
@@ -28,60 +28,60 @@
               </a-menu-item>
             </a-menu>
           </template>
-          <a-button>批量操作
+          <a-button
+            >批量操作
             <Icon icon="mdi:chevron-down"></Icon>
           </a-button>
         </a-dropdown>
       </template>
       <!--操作栏-->
       <template #action="{ record }">
-        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)"/>
+        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
       </template>
     </BasicTable>
     <!--用户抽屉-->
-    <UserDrawer @register="registerDrawer" @success="handleSuccess"/>
+    <UserDrawer @register="registerDrawer" @success="handleSuccess" />
     <!--修改密码-->
-    <PasswordModal @register="registerPasswordModal" @success="reload"/>
+    <PasswordModal @register="registerPasswordModal" @success="reload" />
     <!--用户代理-->
-    <UserAgentModal @register="registerAgentModal" @success="reload"/>
+    <UserAgentModal @register="registerAgentModal" @success="reload" />
     <!--回收站-->
-    <UserRecycleBinModal @register="registerModal" @success="reload"/>
+    <UserRecycleBinModal @register="registerModal" @success="reload" />
   </div>
 </template>
 
 <script lang="ts" name="system-user" setup>
   //ts语法
-  import {ref, computed, unref} from 'vue';
-  import { BasicTable, TableAction, ActionItem } from '/@/components/Table'
+  import { ref, computed, unref } from 'vue';
+  import { BasicTable, TableAction, ActionItem } from '/@/components/Table';
   import UserDrawer from './UserDrawer.vue';
   import UserRecycleBinModal from './UserRecycleBinModal.vue';
   import PasswordModal from './PasswordModal.vue';
   import UserAgentModal from './UserAgentModal.vue';
-  import JThirdAppButton from '/@/components/jeecg/thirdApp/JThirdAppButton.vue'
-  import {useDrawer} from '/@/components/Drawer';
-  import { useListPage } from '/@/hooks/system/useListPage'
-  import {useModal} from '/@/components/Modal';
-  import {useMessage} from '/@/hooks/web/useMessage';
-  import {columns, searchFormSchema} from './user.data';
-  import {list, deleteUser, batchDeleteUser, getImportUrl,getExportUrl, frozenBatch, syncUser} from './user.api';
+  import JThirdAppButton from '/@/components/jeecg/thirdApp/JThirdAppButton.vue';
+  import { useDrawer } from '/@/components/Drawer';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import { useModal } from '/@/components/Modal';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { columns, searchFormSchema } from './user.data';
+  import { list, deleteUser, batchDeleteUser, getImportUrl, getExportUrl, frozenBatch, syncUser } from './user.api';
   // import { usePermission } from '/@/hooks/web/usePermission'
   // const { hasPermission } = usePermission();
 
-  const {createMessage, createConfirm} = useMessage();
+  const { createMessage, createConfirm } = useMessage();
 
   const selectRows = ref([]);
   //注册drawer
-  const [registerDrawer, {openDrawer}] = useDrawer();
+  const [registerDrawer, { openDrawer }] = useDrawer();
   //回收站model
-  const [registerModal, {openModal}] = useModal();
+  const [registerModal, { openModal }] = useModal();
   //密码model
-  const [registerPasswordModal, {openModal: openPasswordModal}] = useModal();
+  const [registerPasswordModal, { openModal: openPasswordModal }] = useModal();
   //代理人model
-  const [registerAgentModal, {openModal: openAgentModal}] = useModal();
-
+  const [registerAgentModal, { openModal: openAgentModal }] = useModal();
 
   // 列表页面公共参数、方法
-  const { prefixCls,tableContext,onExportXls,onImportXls } = useListPage({
+  const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
     designScope: 'user-list',
     tableProps: {
       title: '用户列表',
@@ -89,29 +89,27 @@
       columns: columns,
       size: 'small',
       formConfig: {
-        labelWidth:200,
+        labelWidth: 200,
         schemas: searchFormSchema,
       },
       actionColumn: {
         width: 120,
       },
-      beforeFetch:(params)=>{
-        return Object.assign({'column':'createTime','order':"desc"},params)
+      beforeFetch: (params) => {
+        return Object.assign({ column: 'createTime', order: 'desc' }, params);
       },
     },
     exportConfig: {
-      name:"用户列表",
+      name: '用户列表',
       url: getExportUrl,
     },
     importConfig: {
-      url: getImportUrl
+      url: getImportUrl,
     },
-  })
-
+  });
 
   //注册table数据
-  const [registerTable, {reload, updateTableDataRecord},{ rowSelection, selectedRowKeys }] = tableContext
-
+  const [registerTable, { reload, updateTableDataRecord }, { rowSelection, selectedRowKeys }] = tableContext;
 
   /**
    * 新增事件
@@ -134,7 +132,7 @@
   }
   /**
    * 详情
-  */
+   */
   async function handleDetail(record: Recordable) {
     openDrawer(true, {
       record,
@@ -150,26 +148,26 @@
       createMessage.warning('管理员账号不允许此操作！');
       return;
     }
-    await deleteUser({id: record.id}, reload);
+    await deleteUser({ id: record.id }, reload);
   }
   /**
    * 批量删除事件
    */
   async function batchHandleDelete() {
-    let hasAdmin = unref(selectRows).filter(item => item.username == 'admin');
+    let hasAdmin = unref(selectRows).filter((item) => item.username == 'admin');
     if (unref(hasAdmin).length > 0) {
       createMessage.warning('管理员账号不允许此操作！');
       return;
     }
     await batchDeleteUser({ ids: selectedRowKeys.value }, () => {
-      selectedRowKeys.value = []
-      reload()
-    })
+      selectedRowKeys.value = [];
+      reload();
+    });
   }
   /**
    * 成功回调
    */
-  function handleSuccess({isUpdate, values}) {
+  function handleSuccess({ isUpdate, values }) {
     if (isUpdate) {
       updateTableDataRecord(values.id, values);
     } else {
@@ -180,30 +178,30 @@
   /**
    * 打开修改密码弹窗
    */
-  function handleChangePassword(username){
-    openPasswordModal(true, {username});
+  function handleChangePassword(username) {
+    openPasswordModal(true, { username });
   }
   /**
    * 打开代理人弹窗
    */
-  function handleAgentSettings(userName){
-    openAgentModal(true, {userName});
+  function handleAgentSettings(userName) {
+    openAgentModal(true, { userName });
   }
   /**
    * 冻结解冻
    */
-  async function handleFrozen(record,status){
+  async function handleFrozen(record, status) {
     if ('admin' == record.username) {
       createMessage.warning('管理员账号不允许此操作！');
       return;
     }
-    await frozenBatch({ids: record.id, status: status},reload)
+    await frozenBatch({ ids: record.id, status: status }, reload);
   }
-   /**
+  /**
    * 批量冻结解冻
    */
   function batchFrozen(status) {
-    let hasAdmin = unref(selectRows).filter(item => item.username == 'admin');
+    let hasAdmin = unref(selectRows).filter((item) => item.username == 'admin');
     if (unref(hasAdmin).length > 0) {
       createMessage.warning('管理员账号不允许此操作！');
       return;
@@ -211,27 +209,27 @@
     createConfirm({
       iconType: 'warning',
       title: '确认操作',
-      content: "是否" + (status == 1 ? "解冻" : "冻结") + "选中账号?",
+      content: '是否' + (status == 1 ? '解冻' : '冻结') + '选中账号?',
       onOk: async () => {
-        await frozenBatch({ids: unref(selectedRowKeys).join(','), status: status}, reload)
-      }
-    })
+        await frozenBatch({ ids: unref(selectedRowKeys).join(','), status: status }, reload);
+      },
+    });
   }
 
   /**
    *同步流程
    */
   function handleSyncUser() {
-    syncUser()
+    syncUser();
   }
   /**
    *同步钉钉和微信回调
    */
-  function onSyncFinally({isToLocal}) {
-      // 同步到本地时刷新下数据
-      if (isToLocal) {
-          reload()
-      }
+  function onSyncFinally({ isToLocal }) {
+    // 同步到本地时刷新下数据
+    if (isToLocal) {
+      reload();
+    }
   }
 
   /**
@@ -243,8 +241,8 @@
         label: '编辑',
         onClick: handleEdit.bind(null, record),
         // ifShow: () => hasPermission('user:edit'),
-      }
-    ]
+      },
+    ];
   }
   /**
    * 下拉操作栏
@@ -254,37 +252,40 @@
       {
         label: '详情',
         onClick: handleDetail.bind(null, record),
-      }, {
+      },
+      {
         label: '密码',
         onClick: handleChangePassword.bind(null, record.username),
-      },{
+      },
+      {
         label: '删除',
         popConfirm: {
           title: '是否确认删除',
           confirm: handleDelete.bind(null, record),
         },
-      },{
+      },
+      {
         label: '冻结',
-        ifShow:record.status==1,
+        ifShow: record.status == 1,
         popConfirm: {
           title: '确定冻结吗?',
-          confirm: handleFrozen.bind(null, record,2),
+          confirm: handleFrozen.bind(null, record, 2),
         },
-      },{
+      },
+      {
         label: '解冻',
-        ifShow:record.status==2,
+        ifShow: record.status == 2,
         popConfirm: {
           title: '确定解冻吗?',
-          confirm: handleFrozen.bind(null, record,1),
+          confirm: handleFrozen.bind(null, record, 1),
         },
-      }, {
+      },
+      {
         label: '代理人',
         onClick: handleAgentSettings.bind(null, record.username),
-      }
-    ]
+      },
+    ];
   }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/src/views/system/user/user.api.ts b/src/views/system/user/user.api.ts
index f5a5e74..aac4a6f 100644
--- a/src/views/system/user/user.api.ts
+++ b/src/views/system/user/user.api.ts
@@ -1,12 +1,12 @@
-import {defHttp} from '/@/utils/http/axios';
-import {Modal} from 'ant-design-vue';
+import { defHttp } from '/@/utils/http/axios';
+import { Modal } from 'ant-design-vue';
 
 enum Api {
   list = '/sys/user/list',
-  save='/sys/user/add',
-  edit='/sys/user/edit',
-  agentSave='/sys/sysUserAgent/add',
-  agentEdit='/sys/sysUserAgent/edit',
+  save = '/sys/user/add',
+  edit = '/sys/user/edit',
+  agentSave = '/sys/sysUserAgent/add',
+  agentEdit = '/sys/sysUserAgent/edit',
   getUserRole = '/sys/user/queryUserRole',
   duplicateCheck = '/sys/duplicate/check',
   deleteUser = '/sys/user/delete',
@@ -38,24 +38,22 @@ export const getImportUrl = Api.importExcel;
  * 列表接口
  * @param params
  */
-export const list = (params) =>
-  defHttp.get({url: Api.list, params});
+export const list = (params) => defHttp.get({ url: Api.list, params });
 
 /**
  * 用户角色接口
  * @param params
  */
-export const getUserRoles = (params) =>
-  defHttp.get({url: Api.getUserRole, params}, {errorMessageMode: 'none'});
+export const getUserRoles = (params) => defHttp.get({ url: Api.getUserRole, params }, { errorMessageMode: 'none' });
 
 /**
  * 删除用户
  */
-export const deleteUser = (params,handleSuccess) => {
-  return defHttp.delete({url: Api.deleteUser, params}, {joinParamsToUrl: true}).then(() => {
+export const deleteUser = (params, handleSuccess) => {
+  return defHttp.delete({ url: Api.deleteUser, params }, { joinParamsToUrl: true }).then(() => {
     handleSuccess();
   });
-}
+};
 /**
  * 批量删除用户
  * @param params
@@ -67,110 +65,103 @@ export const batchDeleteUser = (params, handleSuccess) => {
     okText: '确认',
     cancelText: '取消',
     onOk: () => {
-      return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
+      return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => {
         handleSuccess();
       });
-    }
+    },
   });
-}
+};
 /**
  * 保存或者更新用户
  * @param params
  */
 export const saveOrUpdateUser = (params, isUpdate) => {
   let url = isUpdate ? Api.edit : Api.save;
-  return defHttp.post({url: url, params});
-}
+  return defHttp.post({ url: url, params });
+};
 /**
  * 唯一校验
  * @param params
  */
-export const duplicateCheck = (params) =>
-  defHttp.get({url: Api.duplicateCheck, params},{isTransformResponse:false});
+export const duplicateCheck = (params) => defHttp.get({ url: Api.duplicateCheck, params }, { isTransformResponse: false });
 /**
  * 获取全部角色
  * @param params
  */
-export const getAllRolesList = (params) =>
-  defHttp.get({url: Api.allRolesList, params});
+export const getAllRolesList = (params) => defHttp.get({ url: Api.allRolesList, params });
 /**
  * 获取全部租户
  */
-export const getAllTenantList = (params) =>
-  defHttp.get({url: Api.allTenantList, params});
+export const getAllTenantList = (params) => defHttp.get({ url: Api.allTenantList, params });
 /**
  * 获取指定用户负责部门
  */
-export const getUserDepartList = (params) =>
-  defHttp.get({url: Api.userDepartList, params},{successMessageMode:'none'});
+export const getUserDepartList = (params) => defHttp.get({ url: Api.userDepartList, params }, { successMessageMode: 'none' });
 /**
  * 获取全部职务
  */
 export const getAllPostList = (params) => {
   return new Promise((resolve) => {
-    defHttp.get({url: Api.allPostList, params}).then(res => {
-      resolve(res.records)
+    defHttp.get({ url: Api.allPostList, params }).then((res) => {
+      resolve(res.records);
     });
-  })
-}
+  });
+};
 /**
  * 回收站列表
  * @param params
  */
-export const getRecycleBinList = (params) =>
-  defHttp.get({url: Api.recycleBinList, params});
+export const getRecycleBinList = (params) => defHttp.get({ url: Api.recycleBinList, params });
 /**
  * 回收站还原
  * @param params
  */
-export const putRecycleBin = (params,handleSuccess) =>{
-  return defHttp.put({url: Api.putRecycleBin, params}).then(() => {
+export const putRecycleBin = (params, handleSuccess) => {
+  return defHttp.put({ url: Api.putRecycleBin, params }).then(() => {
     handleSuccess();
   });
-}
+};
 /**
  * 回收站删除
  * @param params
  */
-export const deleteRecycleBin = (params,handleSuccess) => {
-  return defHttp.delete({url: Api.deleteRecycleBin, params}, {joinParamsToUrl: true}).then(() => {
+export const deleteRecycleBin = (params, handleSuccess) => {
+  return defHttp.delete({ url: Api.deleteRecycleBin, params }, { joinParamsToUrl: true }).then(() => {
     handleSuccess();
   });
-}
+};
 /**
  * 修改密码
  * @param params
  */
-export const changePassword = (params) =>{
-  return defHttp.put({url: Api.changePassword, params})
-}
+export const changePassword = (params) => {
+  return defHttp.put({ url: Api.changePassword, params });
+};
 /**
  * 冻结解冻
  * @param params
  */
-export const frozenBatch = (params,handleSuccess) => {
-  return defHttp.put({url: Api.frozenBatch, params}).then(() => {
+export const frozenBatch = (params, handleSuccess) => {
+  return defHttp.put({ url: Api.frozenBatch, params }).then(() => {
     handleSuccess();
   });
-}
+};
 /**
  * 获取用户代理
  * @param params
  */
-export const getUserAgent = (params) =>
-  defHttp.get({url: Api.getUserAgent, params},{isTransformResponse:false});
+export const getUserAgent = (params) => defHttp.get({ url: Api.getUserAgent, params }, { isTransformResponse: false });
 /**
  * 保存或者更新用户代理
  * @param params
  */
 export const saveOrUpdateAgent = (params) => {
   let url = params.id ? Api.agentEdit : Api.agentSave;
-  return defHttp.post({url: url, params});
-}
+  return defHttp.post({ url: url, params });
+};
 
 /**
  * 用户同步流程
  * @param params
  */
-export const syncUser = () =>
-  defHttp.put({url: Api.syncUser});
+export const syncUser = () => defHttp.put({ url: Api.syncUser });
diff --git a/src/views/system/user/user.data.ts b/src/views/system/user/user.data.ts
index bbaf006..7cd34eb 100644
--- a/src/views/system/user/user.data.ts
+++ b/src/views/system/user/user.data.ts
@@ -1,7 +1,7 @@
-import {BasicColumn} from '/@/components/Table';
-import {FormSchema} from '/@/components/Table';
-import {getAllRolesList, getAllTenantList} from "./user.api";
-import { rules} from '/@/utils/helper/validator';
+import { BasicColumn } from '/@/components/Table';
+import { FormSchema } from '/@/components/Table';
+import { getAllRolesList, getAllTenantList } from './user.api';
+import { rules } from '/@/utils/helper/validator';
 import { render } from '/@/utils/common/renderUtils';
 export const columns: BasicColumn[] = [
   {
@@ -18,16 +18,16 @@ export const columns: BasicColumn[] = [
     title: '头像',
     dataIndex: 'avatar',
     width: 120,
-    customRender:render.renderAvatar,
+    customRender: render.renderAvatar,
   },
   {
     title: '性别',
     dataIndex: 'sex',
     width: 80,
     sorter: true,
-    customRender: ({text}) => {
-      return  render.renderDict(text, 'sex')
-    }
+    customRender: ({ text }) => {
+      return render.renderDict(text, 'sex');
+    },
   },
   {
     title: '生日',
@@ -42,18 +42,18 @@ export const columns: BasicColumn[] = [
   {
     title: '部门',
     width: 150,
-    dataIndex: 'orgCodeTxt'
+    dataIndex: 'orgCodeTxt',
   },
   {
     title: '负责部门',
     width: 150,
-    dataIndex: 'departIds_dictText'
+    dataIndex: 'departIds_dictText',
   },
   {
     title: '状态',
     dataIndex: 'status_dictText',
     width: 80,
-  }
+  },
 ];
 
 export const recycleColumns: BasicColumn[] = [
@@ -71,17 +71,17 @@ export const recycleColumns: BasicColumn[] = [
     title: '头像',
     dataIndex: 'avatar',
     width: 80,
-    customRender:render.renderAvatar,
+    customRender: render.renderAvatar,
   },
   {
     title: '性别',
     dataIndex: 'sex',
     width: 80,
     sorter: true,
-    customRender: ({text}) => {
-      return  render.renderDict(text, 'sex')
-    }
-  }
+    customRender: ({ text }) => {
+      return render.renderDict(text, 'sex');
+    },
+  },
 ];
 
 export const searchFormSchema: FormSchema[] = [
@@ -89,42 +89,42 @@ export const searchFormSchema: FormSchema[] = [
     label: '账号',
     field: 'username',
     component: 'JInput',
-    colProps: {span: 6}
+    colProps: { span: 6 },
   },
   {
     label: '性别',
     field: 'sex',
     component: 'JDictSelectTag',
     componentProps: {
-      dictCode:'sex',
-      placeholder:'请选择性别',
-      stringToNumber:true
+      dictCode: 'sex',
+      placeholder: '请选择性别',
+      stringToNumber: true,
     },
-    colProps: {span: 6},
+    colProps: { span: 6 },
   },
   {
     label: '真实名称',
     field: 'realname',
     component: 'Input',
-    colProps: {span: 6},
+    colProps: { span: 6 },
   },
   {
     label: '手机号码',
     field: 'phone',
     component: 'Input',
-    colProps: {span: 6},
+    colProps: { span: 6 },
   },
   {
     label: '用户状态',
     field: 'status',
     component: 'JDictSelectTag',
     componentProps: {
-      dictCode:'user_status',
-      placeholder:'请选择状态',
-      stringToNumber:true
+      dictCode: 'user_status',
+      placeholder: '请选择状态',
+      stringToNumber: true,
     },
-    colProps: {span: 6},
-  }
+    colProps: { span: 6 },
+  },
 ];
 
 export const formSchema: FormSchema[] = [
@@ -132,16 +132,16 @@ export const formSchema: FormSchema[] = [
     label: '',
     field: 'id',
     component: 'Input',
-    show:false
+    show: false,
   },
   {
     label: '用户账号',
     field: 'username',
     component: 'Input',
-    dynamicDisabled: ({values}) => {
+    dynamicDisabled: ({ values }) => {
       return !!values.id;
     },
-    dynamicRules: ({model,schema}) =>rules.duplicateCheckRule("sys_user", "username",model,schema,true),
+    dynamicRules: ({ model, schema }) => rules.duplicateCheckRule('sys_user', 'username', model, schema, true),
   },
   {
     label: '登录密码',
@@ -158,7 +158,7 @@ export const formSchema: FormSchema[] = [
     label: '确认密码',
     field: 'confirmPassword',
     component: 'InputPassword',
-    dynamicRules: ({values}) => rules.confirmPassword(values,true)
+    dynamicRules: ({ values }) => rules.confirmPassword(values, true),
   },
   {
     label: '用户姓名',
@@ -171,7 +171,7 @@ export const formSchema: FormSchema[] = [
     field: 'workNo',
     required: true,
     component: 'Input',
-    dynamicRules: ({model,schema}) =>rules.duplicateCheckRule( "sys_user", "work_no",model,schema,true),
+    dynamicRules: ({ model, schema }) => rules.duplicateCheckRule('sys_user', 'work_no', model, schema, true),
   },
   {
     label: '职务',
@@ -179,8 +179,8 @@ export const formSchema: FormSchema[] = [
     required: false,
     component: 'JSelectPosition',
     componentProps: {
-        rowKey:'code',
-        labelKey:'name'
+      rowKey: 'code',
+      labelKey: 'name',
     },
   },
   {
@@ -188,7 +188,7 @@ export const formSchema: FormSchema[] = [
     field: 'selectedroles',
     component: 'ApiSelect',
     componentProps: {
-      mode: "multiple",
+      mode: 'multiple',
       api: getAllRolesList,
       labelField: 'roleName',
       valueField: 'id',
@@ -198,49 +198,54 @@ export const formSchema: FormSchema[] = [
     label: '所属部门',
     field: 'selecteddeparts',
     component: 'JSelectDept',
-    componentProps:({formActionType,formModel}) => {
-        return {
-            sync:false,
-            checkStrictly:true,
-            defaultExpandLevel: 2,
+    componentProps: ({ formActionType, formModel }) => {
+      return {
+        sync: false,
+        checkStrictly: true,
+        defaultExpandLevel: 2,
 
-            onSelect: (options,values) => {
-                const {updateSchema} = formActionType;
-                //所属部门修改后更新负责部门下拉框数据
-                updateSchema([{
-                    field: 'departIds',
-                    componentProps: {options},
-                }]);
-                //所属部门修改后更新负责部门数据
-                formModel.departIds&&(formModel.departIds = formModel.departIds.filter(item=>values.value.indexOf(item)>-1));
-            }
-        }
-    }
+        onSelect: (options, values) => {
+          const { updateSchema } = formActionType;
+          //所属部门修改后更新负责部门下拉框数据
+          updateSchema([
+            {
+              field: 'departIds',
+              componentProps: { options },
+            },
+          ]);
+          //所属部门修改后更新负责部门数据
+          formModel.departIds && (formModel.departIds = formModel.departIds.filter((item) => values.value.indexOf(item) > -1));
+        },
+      };
+    },
   },
   {
     label: '租户',
     field: 'relTenantIds',
     component: 'ApiSelect',
     componentProps: {
-      mode: "multiple",
+      mode: 'multiple',
       api: getAllTenantList,
-      numberToString:true,
+      numberToString: true,
       labelField: 'name',
       valueField: 'id',
-    }
+    },
   },
   {
     label: '身份',
     field: 'userIdentity',
     component: 'RadioGroup',
     defaultValue: 1,
-    componentProps:({ formModel }) => {
+    componentProps: ({ formModel }) => {
       return {
-          options: [{label: '普通用户',value: 1,key: '1'},{label: '上级',value: 2,key: '2'}],
-          onChange: () => {
-              formModel.userIdentity==1&&(formModel.departIds=[]);
-          }
-      }
+        options: [
+          { label: '普通用户', value: 1, key: '1' },
+          { label: '上级', value: 2, key: '2' },
+        ],
+        onChange: () => {
+          formModel.userIdentity == 1 && (formModel.departIds = []);
+        },
+      };
     },
   },
   {
@@ -248,16 +253,16 @@ export const formSchema: FormSchema[] = [
     field: 'departIds',
     component: 'Select',
     componentProps: {
-      mode: "multiple",
+      mode: 'multiple',
     },
-    ifShow: ({values}) => (values.userIdentity==2),
+    ifShow: ({ values }) => values.userIdentity == 2,
   },
   {
     label: '头像',
     field: 'avatar',
     component: 'JImageUpload',
     componentProps: {
-      fileMax:1
+      fileMax: 1,
     },
   },
   {
@@ -270,33 +275,30 @@ export const formSchema: FormSchema[] = [
     field: 'sex',
     component: 'JDictSelectTag',
     componentProps: {
-      dictCode:'sex',
-      placeholder:'请选择性别',
-      stringToNumber:true
+      dictCode: 'sex',
+      placeholder: '请选择性别',
+      stringToNumber: true,
     },
   },
   {
     label: '邮箱',
     field: 'email',
     component: 'Input',
-    rules: rules.rule('email',false),
+    rules: rules.rule('email', false),
   },
   {
     label: '手机号码',
     field: 'phone',
     component: 'Input',
-    dynamicRules: ({model,schema}) => {
-      return [
-        {...rules.duplicateCheckRule( "sys_user", "phone",model,schema,true)[0]},
-        { pattern: /^1[3|4|5|7|8|9][0-9]\d{8}$/, message: '手机号码格式有误' }
-      ];
+    dynamicRules: ({ model, schema }) => {
+      return [{ ...rules.duplicateCheckRule('sys_user', 'phone', model, schema, true)[0] }, { pattern: /^1[3|4|5|7|8|9][0-9]\d{8}$/, message: '手机号码格式有误' }];
     },
   },
   {
     label: '座机',
     field: 'telephone',
     component: 'Input',
-    rules: [{ pattern: /^0\d{2,3}-[1-9]\d{6,7}$/, message: '请输入正确的座机号码' }]
+    rules: [{ pattern: /^0\d{2,3}-[1-9]\d{6,7}$/, message: '请输入正确的座机号码' }],
   },
   {
     label: '工作流引擎',
@@ -304,11 +306,11 @@ export const formSchema: FormSchema[] = [
     defaultValue: 1,
     component: 'JDictSelectTag',
     componentProps: {
-      dictCode:'activiti_sync',
-      type:'radio',
-      stringToNumber:true
+      dictCode: 'activiti_sync',
+      type: 'radio',
+      stringToNumber: true,
     },
-  }
+  },
 ];
 
 export const formPasswordSchema: FormSchema[] = [
@@ -316,7 +318,7 @@ export const formPasswordSchema: FormSchema[] = [
     label: '用户账号',
     field: 'username',
     component: 'Input',
-    componentProps: {readOnly: true}
+    componentProps: { readOnly: true },
   },
   {
     label: '登录密码',
@@ -336,33 +338,35 @@ export const formPasswordSchema: FormSchema[] = [
     label: '确认密码',
     field: 'confirmPassword',
     component: 'InputPassword',
-    dynamicRules: ({values}) => rules.confirmPassword(values,true)
-  }
+    dynamicRules: ({ values }) => rules.confirmPassword(values, true),
+  },
 ];
 
-export const formAgentSchema: FormSchema[] = [{
-  label: '',
-  field: 'id',
-  component: 'Input',
-  show: false
-},{
-  field: 'userName',
-  label: '用户名',
-  component: 'Input',
-  componentProps: {
-    readOnly: true,
-    allowClear:false
-  }
-},
+export const formAgentSchema: FormSchema[] = [
+  {
+    label: '',
+    field: 'id',
+    component: 'Input',
+    show: false,
+  },
+  {
+    field: 'userName',
+    label: '用户名',
+    component: 'Input',
+    componentProps: {
+      readOnly: true,
+      allowClear: false,
+    },
+  },
   {
     field: 'agentUserName',
     label: '代理人用户名',
     required: true,
     component: 'JSelectUser',
     componentProps: {
-      rowKey:'username',
-      labelKey:'realname',
-      maxSelectCount:10
+      rowKey: 'username',
+      labelKey: 'realname',
+      maxSelectCount: 10,
     },
   },
   {
@@ -374,7 +378,7 @@ export const formAgentSchema: FormSchema[] = [{
       showTime: true,
       valueFormat: 'YYYY-MM-DD HH:mm:ss',
       placeholder: '请选择代理开始时间',
-    }
+    },
   },
   {
     field: 'endTime',
@@ -385,15 +389,16 @@ export const formAgentSchema: FormSchema[] = [{
       showTime: true,
       valueFormat: 'YYYY-MM-DD HH:mm:ss',
       placeholder: '请选择代理结束时间',
-    }
+    },
   },
   {
     field: 'status',
     label: '状态',
     component: 'JDictSelectTag',
-    defaultValue: "1",
+    defaultValue: '1',
     componentProps: {
-      dictCode:'valid_status',
-      type:'radioButton'
+      dictCode: 'valid_status',
+      type: 'radioButton',
     },
-  }]
+  },
+];
diff --git a/src/views/system/user/userDetails.vue b/src/views/system/user/userDetails.vue
index 77e3db3..c0a8cd4 100644
--- a/src/views/system/user/userDetails.vue
+++ b/src/views/system/user/userDetails.vue
@@ -1,5 +1,5 @@
 <template>
-    <Description @register="register" class="mt-4"/>
+  <Description @register="register" class="mt-4" />
 </template>
 <script lang="ts">
   import { defineComponent } from 'vue';
diff --git a/types/config.d.ts b/types/config.d.ts
index 8502dbf..bfe0a1c 100644
--- a/types/config.d.ts
+++ b/types/config.d.ts
@@ -1,12 +1,5 @@
 import { MenuTypeEnum, MenuModeEnum, TriggerEnum, MixSidebarTriggerEnum } from '/@/enums/menuEnum';
-import {
-  ContentEnum,
-  PermissionModeEnum,
-  ThemeEnum,
-  RouterTransitionEnum,
-  SettingButtonPositionEnum,
-  SessionTimeoutProcessingEnum,
-} from '/@/enums/appEnum';
+import { ContentEnum, PermissionModeEnum, ThemeEnum, RouterTransitionEnum, SettingButtonPositionEnum, SessionTimeoutProcessingEnum } from '/@/enums/appEnum';
 
 import { CacheTypeEnum } from '/@/enums/cacheEnum';
 
diff --git a/types/global.d.ts b/types/global.d.ts
index 049ef55..d967bff 100644
--- a/types/global.d.ts
+++ b/types/global.d.ts
@@ -1,11 +1,4 @@
-import type {
-  ComponentRenderProxy,
-  VNode,
-  VNodeChild,
-  ComponentPublicInstance,
-  FunctionalComponent,
-  PropType as VuePropType,
-} from 'vue';
+import type { ComponentRenderProxy, VNode, VNodeChild, ComponentPublicInstance, FunctionalComponent, PropType as VuePropType } from 'vue';
 
 declare global {
   const __APP_INFO__: {
@@ -95,7 +88,5 @@ declare global {
 }
 
 declare module 'vue' {
-  export type JSXComponent<Props = any> =
-    | { new (): ComponentPublicInstance<Props> }
-    | FunctionalComponent<Props>;
+  export type JSXComponent<Props = any> = { new (): ComponentPublicInstance<Props> } | FunctionalComponent<Props>;
 }
diff --git a/types/store.d.ts b/types/store.d.ts
index d54301a..be2f2ea 100644
--- a/types/store.d.ts
+++ b/types/store.d.ts
@@ -46,7 +46,7 @@ export interface UserInfo {
 export interface LoginInfo {
   multi_depart?: string | number;
   userInfo?: object;
-  departs?:[];
+  departs?: [];
   tenantList?: [];
 }
 
diff --git a/yarn.lock b/yarn.lock
index 2cc3726..cbdb153 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1206,53 +1206,53 @@
     minimatch "^3.0.4"
     strip-json-comments "^3.1.1"
 
-"@fullcalendar/common@~5.10.1":
-  version "5.10.1"
-  resolved "https://registry.npmmirror.com/@fullcalendar/common/download/@fullcalendar/common-5.10.1.tgz#a019951743852277a4095e536fd7716f6f85b9aa"
-  integrity sha1-oBmVF0OFInekCV5Tb9dxb2+Fuao=
+"@fullcalendar/common@~5.11.0":
+  version "5.11.0"
+  resolved "https://registry.npmmirror.com/@fullcalendar/common/-/common-5.11.0.tgz#d7e47b4272ba6824f95581fb7fb630c5880f4212"
+  integrity sha512-gWjbMAnN1u73Oqlgjbyky7i+3bY0hvFSnGT0YBPx44n874AkQa9e9OU12PMLTMOPy0tXPb8DEwRelFQ7CJNbcw==
   dependencies:
     tslib "^2.1.0"
 
-"@fullcalendar/core@^5.8.0", "@fullcalendar/core@~5.10.1":
-  version "5.10.1"
-  resolved "https://registry.npmmirror.com/@fullcalendar/core/download/@fullcalendar/core-5.10.1.tgz#05c7653e5004149a63bcb03e9dc8b049186ca50b"
-  integrity sha1-BcdlPlAEFJpjvLA+nciwSRhspQs=
+"@fullcalendar/core@^5.10.1", "@fullcalendar/core@~5.11.0":
+  version "5.11.0"
+  resolved "https://registry.npmmirror.com/@fullcalendar/core/-/core-5.11.0.tgz#336fcfb9799cf0c2d1ee15c110dce26a9e14881c"
+  integrity sha512-cF/d9LuJb/6xw14ms0urv1H4BiA70c4jrufe/EuVzLR6qTDpK92IZ3JK7GVtZtzptfTYZ/NQgDV9YCzIaO9Blw==
   dependencies:
-    "@fullcalendar/common" "~5.10.1"
+    "@fullcalendar/common" "~5.11.0"
     preact "^10.0.5"
     tslib "^2.1.0"
 
-"@fullcalendar/daygrid@^5.8.0", "@fullcalendar/daygrid@~5.10.1":
-  version "5.10.1"
-  resolved "https://registry.npmmirror.com/@fullcalendar/daygrid/download/@fullcalendar/daygrid-5.10.1.tgz#bdee4f58364fdab631b2abf8b56094ab5776f203"
-  integrity sha1-ve5PWDZP2rYxsqv4tWCUq1d28gM=
+"@fullcalendar/daygrid@^5.10.1", "@fullcalendar/daygrid@~5.11.0":
+  version "5.11.0"
+  resolved "https://registry.npmmirror.com/@fullcalendar/daygrid/-/daygrid-5.11.0.tgz#fd10391dfc2b6caa3538e0826f8d8f3e83e0e22a"
+  integrity sha512-Ybh/dfHn/VL0qOVIRVyJc9I8oYiqqHl6xQONk8xXCe456QbPzAQLsAxpLLJLH+3smWNCfoQgvDKzR9e9XTzLMQ==
   dependencies:
-    "@fullcalendar/common" "~5.10.1"
+    "@fullcalendar/common" "~5.11.0"
     tslib "^2.1.0"
 
-"@fullcalendar/interaction@^5.8.0":
-  version "5.10.1"
-  resolved "https://registry.npmmirror.com/@fullcalendar/interaction/download/@fullcalendar/interaction-5.10.1.tgz#dfa74b5c50bbd5608eb50aeab6e579c8d20cb367"
-  integrity sha1-36dLXFC71WCOtQrqtuV5yNIMs2c=
+"@fullcalendar/interaction@^5.10.1":
+  version "5.11.0"
+  resolved "https://registry.npmmirror.com/@fullcalendar/interaction/-/interaction-5.11.0.tgz#9cfb46cc5f75690394ef553d2c5cf4955782ff05"
+  integrity sha512-9XTI5+ydqrSX+IL3iWgKBURXfnPewn57Tmsv9mJZhiqrUEF7/+qtftLoKEAc8ZdWk/+01aBe67PFL16uPXj2Jg==
   dependencies:
-    "@fullcalendar/common" "~5.10.1"
+    "@fullcalendar/common" "~5.11.0"
     tslib "^2.1.0"
 
-"@fullcalendar/timegrid@^5.8.0":
-  version "5.10.1"
-  resolved "https://registry.npmmirror.com/@fullcalendar/timegrid/download/@fullcalendar/timegrid-5.10.1.tgz#fa7feb909bf599eac1466b9e70c0d56ce0d1aefc"
-  integrity sha1-+n/rkJv1merBRmuecMDVbODRrvw=
+"@fullcalendar/timegrid@^5.10.1":
+  version "5.11.0"
+  resolved "https://registry.npmmirror.com/@fullcalendar/timegrid/-/timegrid-5.11.0.tgz#b41153ef301f21f8c1e19a65023493c48c8bacf5"
+  integrity sha512-GNy+/PwAj510PS4Fu18Mf/CytNBVftFU7M8XwsUXOCJ6ouyroHZje0a7k5cH/nE5IQ6NJZfH2eAPBlxGath1MQ==
   dependencies:
-    "@fullcalendar/common" "~5.10.1"
-    "@fullcalendar/daygrid" "~5.10.1"
+    "@fullcalendar/common" "~5.11.0"
+    "@fullcalendar/daygrid" "~5.11.0"
     tslib "^2.1.0"
 
-"@fullcalendar/vue3@^5.8.0":
-  version "5.10.1"
-  resolved "https://registry.npmmirror.com/@fullcalendar/vue3/download/@fullcalendar/vue3-5.10.1.tgz#b34adcaf7837256a5aa9240592a0d97b55eb675d"
-  integrity sha1-s0rcr3g3JWpaqSQFkqDZe1XrZ10=
+"@fullcalendar/vue3@^5.10.1":
+  version "5.11.0"
+  resolved "https://registry.npmmirror.com/@fullcalendar/vue3/-/vue3-5.11.0.tgz#51b737e91aadab53a03162a8ade9f017429ba1cf"
+  integrity sha512-vqRJRItEdIdtO+6B3/jNppF9dU1zkZVuEL+YiXmuqH3bwqrOH0xK5ALm7YfPJvZJq9TnrVI2HPaVl9D49Mxr7g==
   dependencies:
-    "@fullcalendar/core" "~5.10.1"
+    "@fullcalendar/core" "~5.11.0"
     tslib "^2.1.0"
 
 "@humanwhocodes/config-array@^0.6.0":
@@ -1365,6 +1365,11 @@
   resolved "https://registry.npmmirror.com/@istanbuljs/schema/download/@istanbuljs/schema-0.1.3.tgz#e45e384e4b8ec16bce2fd903af78450f6bf7ec98"
   integrity sha1-5F44TkuOwWvOL9kDr3hFD2v37Jg=
 
+"@jeecg/online@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.npmjs.org/@jeecg/online/-/online-1.0.1.tgz#68c8d573e9acc009915e7feff1776ed87e972ca6"
+  integrity sha512-wB93qHXc5HVEvOT59Too9OpeSlnQyGnvMkG2lo7dZ1DnkUDbYXPH3QoxuxmZxDTQ5gJVaq1dX0zmUKb+4kts2Q==
+
 "@jest/console@^27.3.1":
   version "27.3.1"
   resolved "https://registry.npmmirror.com/@jest/console/download/@jest/console-27.3.1.tgz#e8ea3a475d3f8162f23d69efbfaa9cbe486bee93"
@@ -4125,6 +4130,13 @@ debug@^3.1.1, debug@^3.2.6:
   dependencies:
     ms "^2.1.1"
 
+debug@^4.3.3:
+  version "4.3.4"
+  resolved "https://registry.npmmirror.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865"
+  integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==
+  dependencies:
+    ms "2.1.2"
+
 decamelize-keys@^1.1.0:
   version "1.1.0"
   resolved "https://registry.nlark.com/decamelize-keys/download/decamelize-keys-1.1.0.tgz#d171a87933252807eb3cb61dc1c1445d078df2d9"
@@ -11351,6 +11363,21 @@ vite-plugin-mock@^2.9.6:
     fast-glob "^3.2.7"
     path-to-regexp "^6.2.0"
 
+vite-plugin-optimize-persist@^0.1.2:
+  version "0.1.2"
+  resolved "https://registry.npmmirror.com/vite-plugin-optimize-persist/-/vite-plugin-optimize-persist-0.1.2.tgz#c2aa2712afa74db55f580e3d1656e8cc0b783019"
+  integrity sha512-H/Ebn2kZO8PvwUF08SsT5K5xMJNCWKoGX71+e9/ER3yNj7GHiFjNQlvGg5ih/zEx09MZ9m7WCxOwmEKbeIVzww==
+  dependencies:
+    debug "^4.3.2"
+    fs-extra "^10.0.0"
+
+vite-plugin-package-config@^0.1.1:
+  version "0.1.1"
+  resolved "https://registry.npmmirror.com/vite-plugin-package-config/-/vite-plugin-package-config-0.1.1.tgz#6bd579f71db7582ef9dcc05e9f7920e689c498c9"
+  integrity sha512-w9B3I8ZnqoyhlbzimXjXNk85imrMZgvI9m8f6j3zonK5IVA5KXzpT+PZOHlDz8lqh1vqvoEI1uhy+ZDoLAiA/w==
+  dependencies:
+    debug "^4.3.3"
+
 vite-plugin-purge-icons@^0.7.0:
   version "0.7.0"
   resolved "https://registry.npm.taobao.org/vite-plugin-purge-icons/download/vite-plugin-purge-icons-0.7.0.tgz#c460037438fd71372153360ccb9e7d97b030fb58"