chore: format code by eslint #222

5 years ago · 9edc281322
149 changed files with 574 additions and 421 deletions
--- a/.eslintrc.js
+++ b/.eslintrc.js
@ -57,5 +57,27 @@ module.exports = {
      },
    ],
    'space-before-function-paren': 'off',
+
+    'vue/attributes-order': 'off',
+    'vue/one-component-per-file': 'off',
+    'vue/html-closing-bracket-newline': 'off',
+    'vue/max-attributes-per-line': 'off',
+    'vue/multiline-html-element-content-newline': 'off',
+    'vue/singleline-html-element-content-newline': 'off',
+    'vue/attribute-hyphenation': 'off',
+    // 'vue/html-self-closing': 'off',
+    'vue/require-default-prop': 'off',
+    'vue/html-self-closing': [
+      'error',
+      {
+        html: {
+          void: 'always',
+          normal: 'never',
+          component: 'always',
+        },
+        svg: 'always',
+        math: 'always',
+      },
+    ],
  },
 };
--- a/.yarnclean
+++ b/.yarnclean
@ -0,0 +1,48 @@
+# test directories
+__tests__
+test
+tests
+powered-test
+
+# asset directories
+docs
+doc
+website
+images
+assets
+
+# examples
+example
+examples
+
+# code coverage directories
+coverage
+.nyc_output
+
+# build scripts
+Makefile
+Gulpfile.js
+Gruntfile.js
+
+# configs
+appveyor.yml
+circle.yml
+codeship-services.yml
+codeship-steps.yml
+wercker.yml
+.tern-project
+.gitattributes
+.editorconfig
+.*ignore
+.eslintrc
+.jshintrc
+.flowconfig
+.documentup.json
+.yarn-metadata.json
+.travis.yml
+
+# misc
+*.md
+
+!istanbul-reports/lib/html/assets
+!istanbul-api/node_modules/istanbul-reports/lib/html/assets
--- a/package.json
+++ b/package.json
@ -14,7 +14,7 @@
    "clean:cache": "rimraf node_modules/.cache/ && rimraf node_modules/.vite",
    "clean:lib": "npx rimraf node_modules",
    "typecheck": "vuedx-typecheck .",
-    "lint:eslint": "eslint --fix --ext \"src/**/*.{vue,less,css,scss}\"",
+    "lint:eslint": "eslint \"{src,mock}/**/*.{vue,ts,tsx}\" --fix",
    "lint:prettier": "prettier --write --loglevel warn \"src/**/*.{js,json,tsx,css,less,scss,vue,html,md}\"",
    "lint:stylelint": "stylelint --fix \"**/*.{vue,less,postcss,css,scss}\" --cache --cache-location node_modules/.cache/stylelint/",
    "reinstall": "rimraf yarn.lock && rimraf package.lock.json && rimraf node_modules && npm run bootstrap"
@ -63,7 +63,7 @@
    "@types/zxcvbn": "^4.4.0",
    "@typescript-eslint/eslint-plugin": "^4.14.1",
    "@typescript-eslint/parser": "^4.14.1",
-    "@vitejs/plugin-legacy": "^1.2.1",
+    "@vitejs/plugin-legacy": "^1.2.2",
    "@vitejs/plugin-vue": "^1.1.2",
    "@vitejs/plugin-vue-jsx": "^1.0.2",
    "@vue/compiler-sfc": "^3.0.5",
@ -93,7 +93,7 @@
    "stylelint-order": "^4.1.0",
    "ts-node": "^9.1.1",
    "typescript": "^4.1.3",
-    "vite": "2.0.0-beta.50",
+    "vite": "2.0.0-beta.52",
    "vite-plugin-html": "^2.0.0-beta.6",
    "vite-plugin-mock": "^2.0.0-rc.2",
    "vite-plugin-purge-icons": "^0.6.0",
--- a/src/components/Application/src/AppLocalePicker.vue
+++ b/src/components/Application/src/AppLocalePicker.vue
@ -20,7 +20,6 @@
  import { defineComponent, ref, watchEffect, unref, computed } from 'vue';

  import { Dropdown, DropMenu } from '/@/components/Dropdown';
-  import { GlobalOutlined } from '@ant-design/icons-vue';

  import { useLocale } from '/@/locales/useLocale';
  import { useLocaleSetting } from '/@/hooks/setting/useLocaleSetting';
@ -33,7 +32,7 @@
  import Icon from '/@/components/Icon';
  export default defineComponent({
    name: 'AppLocalPicker',
-    components: { GlobalOutlined, Dropdown, Icon },
+    components: { Dropdown, Icon },
    props: {
      // Whether to display text
      showText: propTypes.bool.def(true),
--- a/src/components/Application/src/AppProvider.vue
+++ b/src/components/Application/src/AppProvider.vue
@ -1,5 +1,5 @@
 <template>
-  <slot />
+  <slot></slot>
 </template>
 <script lang="ts">
  import type { PropType } from 'vue';
--- a/src/components/Application/src/search/AppSearch.vue
+++ b/src/components/Application/src/search/AppSearch.vue
@ -1,7 +1,9 @@
 <template>
  <div :class="prefixCls" v-if="getShowSearch" @click.stop="handleSearch">
    <Tooltip>
-      <template #title> {{ t('common.searchText') }} </template>
+      <template #title>
+        {{ t('common.searchText') }}
+      </template>
      <SearchOutlined />
    </Tooltip>

--- a/src/components/Application/src/search/AppSearchModal.vue
+++ b/src/components/Application/src/search/AppSearchModal.vue
@ -40,7 +40,9 @@
              <div :class="`${prefixCls}-list__item-icon`">
                <g-icon :icon="item.icon || 'mdi:form-select'" :size="20" />
              </div>
-              <div :class="`${prefixCls}-list__item-text`">{{ item.name }}</div>
+              <div :class="`${prefixCls}-list__item-text`">
+                {{ item.name }}
+              </div>
              <div :class="`${prefixCls}-list__item-enter`">
                <g-icon icon="ant-design:enter-outlined" :size="20" />
              </div>
@ -68,14 +70,14 @@
  export default defineComponent({
    name: 'AppSearchModal',
    components: { SearchOutlined, AppSearchFooter, [Input.name]: Input },
-    emits: ['close'],
+    directives: {
+      clickOutside,
+    },

    props: {
      visible: Boolean,
    },
-    directives: {
-      clickOutside,
-    },
+    emits: ['close'],
    setup(_, { emit }) {
      const scrollWrap = ref<ElRef>(null);
      const { prefixCls } = useDesign('app-search-modal');
--- a/src/components/Basic/src/BasicTitle.vue
+++ b/src/components/Basic/src/BasicTitle.vue
@ -1,6 +1,6 @@
 <template>
  <span :class="[prefixCls, { 'show-span': span && $slots.default }]">
-    <slot />
+    <slot></slot>
    <BasicHelp :class="`${prefixCls}__help`" v-if="helpMessage" :text="helpMessage" />
  </span>
 </template>
--- a/src/components/Button/src/BasicButton.vue
+++ b/src/components/Button/src/BasicButton.vue
@ -2,7 +2,7 @@
  <Button v-bind="getBindValue" :class="[getColor, $attrs.class]">
    <template #default="data">
      <Icon :icon="preIcon" v-if="preIcon" :size="14" />
-      <slot v-bind="data" />
+      <slot v-bind="data"></slot>
      <Icon :icon="postIcon" v-if="postIcon" :size="14" />
    </template>
  </Button>
@ -16,8 +16,8 @@

  export default defineComponent({
    name: 'AButton',
-    inheritAttrs: false,
    components: { Button, Icon },
+    inheritAttrs: false,
    props: {
      type: propTypes.oneOf(['primary', 'default', 'danger', 'dashed', 'link']).def('default'),
      color: propTypes.oneOf(['error', 'warning', 'success', '']),
--- a/src/components/Button/src/PopConfirmButton.vue
+++ b/src/components/Button/src/PopConfirmButton.vue
@ -10,8 +10,8 @@

  export default defineComponent({
    name: 'PopButton',
-    inheritAttrs: false,
    components: { Popconfirm, BasicButton },
+    inheritAttrs: false,
    props: {
      size: propTypes.oneOf(['large', 'default', 'small']).def(),
      enable: propTypes.bool.def(true),
--- a/src/components/ClickOutSide/src/index.vue
+++ b/src/components/ClickOutSide/src/index.vue
@ -1,5 +1,7 @@
 <template>
-  <div ref="wrap"><slot /></div>
+  <div ref="wrap">
+    <slot></slot>
+  </div>
 </template>
 <script lang="ts">
  import type { Ref } from 'vue';
--- a/src/components/Container/src/LazyContainer.vue
+++ b/src/components/Container/src/LazyContainer.vue
@ -8,10 +8,10 @@
    mode="out-in"
  >
    <div key="component" v-if="isInit">
-      <slot :loading="loading" />
+      <slot :loading="loading"></slot>
    </div>
    <div key="skeleton" v-else name="lazy-skeleton">
-      <slot name="skeleton" v-if="$slots.skeleton" />
+      <slot name="skeleton" v-if="$slots.skeleton"></slot>
      <Skeleton v-else />
    </div>
  </transition-group>
@ -35,8 +35,8 @@

  export default defineComponent({
    name: 'LazyContainer',
-    inheritAttrs: false,
    components: { Skeleton },
+    inheritAttrs: false,
    props: {
      // Waiting time, if the time is specified, whether visible or not, it will be automatically loaded after the specified time
      timeout: propTypes.number,
@ -102,7 +102,7 @@
        const { timeout, direction, threshold } = props;
        if (timeout) return;
        // According to the scrolling direction to construct the viewport margin, used to load in advance
-        let rootMargin: string = '0px';
+        let rootMargin = '0px';
        switch (direction) {
          case 'vertical':
            rootMargin = `${threshold} 0px`;
--- a/src/components/Container/src/ScrollContainer.vue
+++ b/src/components/Container/src/ScrollContainer.vue
@ -1,6 +1,6 @@
 <template>
  <Scrollbar ref="scrollbarRef" class="scroll-container" v-bind="$attrs">
-    <slot />
+    <slot></slot>
  </Scrollbar>
 </template>

--- a/src/components/Container/src/collapse/CollapseContainer.vue
+++ b/src/components/Container/src/collapse/CollapseContainer.vue
@ -2,7 +2,7 @@
  <div :class="['p-2', prefixCls]">
    <CollapseHeader v-bind="$props" :prefixCls="prefixCls" :show="show" @expand="handleExpand">
      <template #title>
-        <slot name="title" />
+        <slot name="title"></slot>
      </template>
    </CollapseHeader>

@ -10,12 +10,12 @@
      <Skeleton v-if="loading" />
      <div :class="`${prefixCls}__body`" v-else v-show="show">
        <LazyContainer :timeout="lazyTime" v-if="lazy">
-          <slot />
+          <slot></slot>
          <template #skeleton>
-            <slot name="lazySkeleton" />
+            <slot name="lazySkeleton"></slot>
          </template>
        </LazyContainer>
-        <slot v-else />
+        <slot v-else></slot>
      </div>
    </CollapseTransition>
  </div>
--- a/src/components/Container/src/collapse/CollapseHeader.vue
+++ b/src/components/Container/src/collapse/CollapseHeader.vue
@ -5,12 +5,12 @@
        {{ $attrs.title }}
      </template>
      <template v-else>
-        <slot name="title" />
+        <slot name="title"></slot>
      </template>
    </BasicTitle>

    <div :class="`${prefixCls}__action`">
-      <slot name="action" />
+      <slot name="action"></slot>
      <BasicArrow v-if="$attrs.canExpan" top :expand="$attrs.show" @click="$emit('expand')" />
    </div>
  </div>
@ -19,10 +19,11 @@
  import { defineComponent } from 'vue';
  import { BasicArrow, BasicTitle } from '/@/components/Basic';
  export default defineComponent({
-    inheritAttrs: false,
    components: { BasicArrow, BasicTitle },
+    inheritAttrs: false,
    props: {
      prefixCls: String,
    },
+    emits: ['expand'],
  });
 </script>
--- a/src/components/Drawer/src/BasicDrawer.vue
+++ b/src/components/Drawer/src/BasicDrawer.vue
@ -8,7 +8,7 @@
        @close="onClose"
      >
        <template #titleToolbar>
-          <slot name="titleToolbar" />
+          <slot name="titleToolbar"></slot>
        </template>
      </DrawerHeader>
    </template>
@ -18,11 +18,11 @@
      v-loading="getLoading"
      :loading-tip="loadingText || t('common.loadingText')"
    >
-      <slot />
+      <slot></slot>
    </ScrollContainer>
    <DrawerFooter v-bind="getProps" @close="onClose" @ok="handleOk" :height="getFooterHeight">
      <template #[item]="data" v-for="item in Object.keys($slots)">
-        <slot :name="item" v-bind="data" />
+        <slot :name="item" v-bind="data"></slot>
      </template>
    </DrawerFooter>
  </Drawer>
@ -57,8 +57,8 @@
  import { useAttrs } from '/@/hooks/core/useAttrs';

  export default defineComponent({
-    inheritAttrs: false,
    components: { Drawer, ScrollContainer, DrawerFooter, DrawerHeader },
+    inheritAttrs: false,
    props: basicProps,
    emits: ['visible-change', 'ok', 'close', 'register'],
    setup(props, { emit }) {
--- a/src/components/Drawer/src/components/DrawerFooter.vue
+++ b/src/components/Drawer/src/components/DrawerFooter.vue
@ -1,11 +1,11 @@
 <template>
  <div :class="prefixCls" :style="getStyle" v-if="showFooter || $slots.footer">
    <template v-if="!$slots.footer">
-      <slot name="insertFooter" />
+      <slot name="insertFooter"></slot>
      <a-button v-bind="cancelButtonProps" @click="handleClose" class="mr-2" v-if="showCancelBtn">
        {{ cancelText }}
      </a-button>
-      <slot name="centerFooter" />
+      <slot name="centerFooter"></slot>
      <a-button
        :type="okType"
        @click="handleOk"
@ -16,11 +16,11 @@
      >
        {{ okText }}
      </a-button>
-      <slot name="appendFooter" />
+      <slot name="appendFooter"></slot>
    </template>

    <template v-else>
-      <slot name="footer" />
+      <slot name="footer"></slot>
    </template>
  </div>
 </template>
--- a/src/components/Drawer/src/components/DrawerHeader.vue
+++ b/src/components/Drawer/src/components/DrawerHeader.vue
@ -1,6 +1,6 @@
 <template>
  <BasicTitle v-if="!isDetail" :class="prefixCls">
-    <slot name="title" />
+    <slot name="title"></slot>
    {{ !$slots.title ? title : '' }}
  </BasicTitle>

@ -13,7 +13,7 @@
    </span>

    <span :class="`${prefixCls}__toolbar`">
-      <slot name="titleToolbar" />
+      <slot name="titleToolbar"></slot>
    </span>
  </div>
 </template>
@ -33,6 +33,7 @@
      showDetailBack: propTypes.bool,
      title: propTypes.string,
    },
+    emits: ['close'],
    setup(_, { emit }) {
      const { prefixCls } = useDesign('basic-drawer-header');

--- a/src/components/Dropdown/src/Dropdown.vue
+++ b/src/components/Dropdown/src/Dropdown.vue
@ -1,7 +1,7 @@
 <template>
  <a-dropdown :trigger="trigger" v-bind="$attrs">
    <span>
-      <slot />
+      <slot></slot>
    </span>
    <template #overlay>
      <a-menu :selectedKeys="selectedKeys">
--- a/src/components/Excel/src/ImportExcel.vue
+++ b/src/components/Excel/src/ImportExcel.vue
@ -7,7 +7,9 @@
      accept=".xlsx, .xls"
      @change="handleInputClick"
    />
-    <div @click="handleUpload"><slot /></div>
+    <div @click="handleUpload">
+      <slot></slot>
+    </div>
  </div>
 </template>
 <script lang="ts">
--- a/src/components/Form/src/BasicForm.vue
+++ b/src/components/Form/src/BasicForm.vue
@ -1,7 +1,7 @@
 <template>
  <Form v-bind="{ ...$attrs, ...$props }" :class="getFormClass" ref="formElRef" :model="formModel">
    <Row :style="getRowWrapStyle">
-      <slot name="formHeader" />
+      <slot name="formHeader"></slot>
      <template v-for="schema in getSchema" :key="schema.field">
        <FormItem
          :tableAction="tableAction"
@ -13,7 +13,7 @@
          :setFormModel="setFormModel"
        >
          <template #[item]="data" v-for="item in Object.keys($slots)">
-            <slot :name="item" v-bind="data" />
+            <slot :name="item" v-bind="data"></slot>
          </template>
        </FormItem>
      </template>
@ -23,10 +23,10 @@
          #[item]="data"
          v-for="item in ['resetBefore', 'submitBefore', 'advanceBefore', 'advanceAfter']"
        >
-          <slot :name="item" v-bind="data" />
+          <slot :name="item" v-bind="data"></slot>
        </template>
      </FormAction>
-      <slot name="formFooter" />
+      <slot name="formFooter"></slot>
    </Row>
  </Form>
 </template>
--- a/src/components/Form/src/components/ApiSelect.vue
+++ b/src/components/Form/src/components/ApiSelect.vue
@ -1,7 +1,7 @@
 <template>
  <Select v-bind="attrs" :options="getOptions" v-model:value="state">
    <template #[item]="data" v-for="item in Object.keys($slots)">
-      <slot :name="item" v-bind="data" />
+      <slot :name="item" v-bind="data"></slot>
    </template>
    <template #suffixIcon v-if="loading">
      <LoadingOutlined spin />
--- a/src/components/Form/src/components/FormAction.vue
+++ b/src/components/Form/src/components/FormAction.vue
@ -1,7 +1,7 @@
 <template>
  <a-col v-bind="actionColOpt" :style="{ textAlign: 'right' }" v-if="showActionButtonGroup">
    <FormItem>
-      <slot name="resetBefore" />
+      <slot name="resetBefore"></slot>
      <Button
        type="default"
        class="mr-2"
@ -11,7 +11,7 @@
      >
        {{ getResetBtnOptions.text }}
      </Button>
-      <slot name="submitBefore" />
+      <slot name="submitBefore"></slot>

      <Button
        type="primary"
@ -23,7 +23,7 @@
        {{ getSubmitBtnOptions.text }}
      </Button>

-      <slot name="advanceBefore" />
+      <slot name="advanceBefore"></slot>
      <Button
        type="link"
        size="small"
@ -33,7 +33,7 @@
        {{ isAdvanced ? t('component.form.putAway') : t('component.form.unfold') }}
        <BasicArrow class="ml-1" :expand="!isAdvanced" top />
      </Button>
-      <slot name="advanceAfter" />
+      <slot name="advanceAfter"></slot>
    </FormItem>
  </a-col>
 </template>
@ -81,6 +81,7 @@
      isAdvanced: propTypes.bool,
      hideAdvanceBtn: propTypes.bool,
    },
+    emits: ['toggle-advanced'],
    setup(props, { emit }) {
      const { t } = useI18n();

--- a/src/components/Form/src/components/RadioButtonGroup.vue
+++ b/src/components/Form/src/components/RadioButtonGroup.vue
@ -5,7 +5,9 @@
 <template>
  <RadioGroup v-bind="attrs" v-model:value="state" button-style="solid">
    <template v-for="item in getOptions" :key="`${item.value}`">
-      <RadioButton :value="item.value"> {{ item.label }} </RadioButton>
+      <RadioButton :value="item.value">
+        {{ item.label }}
+      </RadioButton>
    </template>
  </RadioGroup>
 </template>
--- a/src/components/Form/src/types/form.ts
+++ b/src/components/Form/src/types/form.ts
@ -36,7 +36,7 @@ export interface FormActionType {
  appendSchemaByField: (
    schema: FormSchema,
    prefixField: string | undefined,
-    first: boolean | undefined
+    first?: boolean | undefined
  ) => Promise<void>;
  validateFields: (nameList?: NamePath[]) => Promise<any>;
  validate: (nameList?: NamePath[]) => Promise<any>;
--- a/src/components/Icon/src/index.vue
+++ b/src/components/Icon/src/index.vue
@ -1,5 +1,5 @@
 <template>
-  <span ref="elRef" :class="[$attrs.class, 'app-iconify anticon']" :style="getWrapStyle" />
+  <span ref="elRef" :class="[$attrs.class, 'app-iconify anticon']" :style="getWrapStyle"></span>
 </template>
 <script lang="ts">
  import type { PropType } from 'vue';
--- a/src/components/Markdown/src/index.vue
+++ b/src/components/Markdown/src/index.vue
@ -1,8 +1,17 @@
 <template>
-  <div ref="wrapRef" />
+  <div ref="wrapRef"></div>
 </template>
 <script lang="ts">
-  import { defineComponent, ref, onMounted, unref, onUnmounted, nextTick, computed } from 'vue';
+  import {
+    defineComponent,
+    ref,
+    onMounted,
+    unref,
+    onUnmounted,
+    nextTick,
+    computed,
+    watchEffect,
+  } from 'vue';
  import Vditor from 'vditor';
  import 'vditor/dist/index.css';

@ -25,25 +34,26 @@

      const modalFn = useModalContext();

-      const lang = ref<Lang>();
-
      const { getLang } = useLocale();

+      watchEffect(() => {});
+
      const getCurrentLang = computed((): 'zh_CN' | 'en_US' | 'ja_JP' | 'ko_KR' => {
+        let lang: Lang;
        switch (unref(getLang)) {
          case 'en':
-            lang.value = 'en_US';
+            lang = 'en_US';
            break;
          case 'ja':
-            lang.value = 'ja_JP';
+            lang = 'ja_JP';
            break;
          case 'ko':
-            lang.value = 'ko_KR';
+            lang = 'ko_KR';
            break;
          default:
-            lang.value = 'zh_CN';
+            lang = 'zh_CN';
        }
-        return lang.value;
+        return lang;
      });
      function init() {
        const wrapEl = unref(wrapRef);
--- a/src/components/Menu/src/components/BasicSubMenuItem.vue
+++ b/src/components/Menu/src/components/BasicSubMenuItem.vue
@ -30,7 +30,6 @@
    components: {
      BasicMenuItem,
      SubMenu: Menu.SubMenu,
-      MenuItem: Menu.Item,
      MenuItemContent,
    },
    props: itemProps,
--- a/src/components/Modal/src/BasicModal.vue
+++ b/src/components/Modal/src/BasicModal.vue
@ -16,7 +16,7 @@
    <template #footer v-if="!$slots.footer">
      <ModalFooter v-bind="getProps" @ok="handleOk" @cancel="handleCancel">
        <template #[item]="data" v-for="item in Object.keys($slots)">
-          <slot :name="item" v-bind="data" />
+          <slot :name="item" v-bind="data"></slot>
        </template>
      </ModalFooter>
    </template>
@ -35,11 +35,11 @@
      @ext-height="handleExtHeight"
      @height-change="handleHeightChange"
    >
-      <slot />
+      <slot></slot>
    </ModalWrapper>

    <template #[item]="data" v-for="item in Object.keys(omit($slots, 'default'))">
-      <slot :name="item" v-bind="data" />
+      <slot :name="item" v-bind="data"></slot>
    </template>
  </Modal>
 </template>
@ -71,8 +71,8 @@
  import { omit } from 'lodash-es';
  export default defineComponent({
    name: 'BasicModal',
-    inheritAttrs: false,
    components: { Modal, ModalWrapper, ModalClose, ModalFooter, ModalHeader },
+    inheritAttrs: false,
    props: basicProps,
    emits: ['visible-change', 'height-change', 'cancel', 'ok', 'register'],
    setup(props, { emit, attrs }) {
--- a/src/components/Modal/src/components/ModalFooter.vue
+++ b/src/components/Modal/src/components/ModalFooter.vue
@ -1,10 +1,10 @@
 <template>
  <div>
-    <slot name="insertFooter" />
+    <slot name="insertFooter"></slot>
    <a-button v-bind="cancelButtonProps" @click="handleCancel" v-if="showCancelBtn">
      {{ cancelText }}
    </a-button>
-    <slot name="centerFooter" />
+    <slot name="centerFooter"></slot>
    <a-button
      :type="okType"
      @click="handleOk"
@ -14,7 +14,7 @@
    >
      {{ okText }}
    </a-button>
-    <slot name="appendFooter" />
+    <slot name="appendFooter"></slot>
  </div>
 </template>
 <script lang="ts">
--- a/src/components/Modal/src/components/ModalWrapper.vue
+++ b/src/components/Modal/src/components/ModalWrapper.vue
@ -1,7 +1,7 @@
 <template>
  <ScrollContainer ref="wrapperRef">
    <div ref="spinRef" :style="spinStyle" v-loading="loading" :loading-tip="loadingTip">
-      <slot />
+      <slot></slot>
    </div>
  </ScrollContainer>
 </template>
@ -20,7 +20,6 @@
    nextTick,
    onUnmounted,
  } from 'vue';
-  import { Spin } from 'ant-design-vue';

  import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn';
  import { ScrollContainer } from '/@/components/Container';
@ -31,8 +30,8 @@

  export default defineComponent({
    name: 'ModalWrapper',
+    components: { ScrollContainer },
    inheritAttrs: false,
-    components: { Spin, ScrollContainer },
    props: {
      loading: propTypes.bool,
      useWrapper: propTypes.bool.def(true),
--- a/src/components/Page/src/PageFooter.vue
+++ b/src/components/Page/src/PageFooter.vue
@ -1,11 +1,11 @@
 <template>
  <div :class="prefixCls" :style="{ width: getCalcContentWidth }">
    <div :class="`${prefixCls}__left`">
-      <slot name="left" />
+      <slot name="left"></slot>
    </div>
-    <slot />
+    <slot></slot>
    <div :class="`${prefixCls}__right`">
-      <slot name="right" />
+      <slot name="right"></slot>
    </div>
  </div>
 </template>
--- a/src/components/Page/src/PageWrapper.vue
+++ b/src/components/Page/src/PageWrapper.vue
@ -5,21 +5,21 @@
        <template v-if="content">
          {{ content }}
        </template>
-        <slot name="headerContent" v-else />
+        <slot name="headerContent" v-else></slot>
      </template>
      <template #[item]="data" v-for="item in getHeaderSlots">
-        <slot :name="item" v-bind="data" />
+        <slot :name="item" v-bind="data"></slot>
      </template>
    </PageHeader>
    <div :class="[`${prefixCls}-content`, $attrs.contentClass]" :style="getContentStyle">
-      <slot />
+      <slot></slot>
    </div>
    <PageFooter v-if="getShowFooter" ref="footerRef">
      <template #left>
-        <slot name="leftFooter" />
+        <slot name="leftFooter"></slot>
      </template>
      <template #right>
-        <slot name="rightFooter" />
+        <slot name="rightFooter"></slot>
      </template>
    </PageFooter>
  </div>
--- a/src/components/Preview/src/index.vue
+++ b/src/components/Preview/src/index.vue
@ -1,7 +1,7 @@
 <template>
  <div :class="prefixCls">
    <PreviewGroup>
-      <slot v-if="!imageList || $slots.default" />
+      <slot v-if="!imageList || $slots.default"></slot>
      <template v-else>
        <template v-for="item in getImageList" :key="item.src">
          <Image v-bind="item">
--- a/src/components/Qrcode/src/index.vue
+++ b/src/components/Qrcode/src/index.vue
@ -1,6 +1,6 @@
 <template>
  <div>
-    <component :is="tag" ref="wrapRef"></component>
+    <component :is="tag" ref="wrapRef" />
  </div>
 </template>
 <script lang="ts">
@ -11,7 +11,6 @@

  export default defineComponent({
    name: 'QrCode',
-    emits: { done: (url: string) => !!url, error: (error: any) => !!error },
    props: {
      value: {
        type: [String, Array] as PropType<string | any[]>,
@ -39,6 +38,7 @@
        validator: (v: string) => ['canvas', 'img'].includes(v),
      },
    },
+    emits: { done: (url: string) => !!url, error: (error: any) => !!error },
    setup(props, { emit }) {
      const wrapRef = ref<HTMLCanvasElement | HTMLImageElement | null>(null);
      const urlRef = ref<string>('');
--- a/src/components/SimpleMenu/src/SimpleMenu.vue
+++ b/src/components/SimpleMenu/src/SimpleMenu.vue
@ -36,11 +36,11 @@
  import { useOpenKeys } from './useOpenKeys';
  export default defineComponent({
    name: 'SimpleMenu',
-    inheritAttrs: false,
    components: {
      Menu,
      SimpleSubMenu,
    },
+    inheritAttrs: false,
    props: {
      items: {
        type: Array as PropType<MenuType[]>,
@ -55,6 +55,7 @@
        type: Function as PropType<(key: string) => Promise<boolean>>,
      },
    },
+    emits: ['menuClick'],
    setup(props, { attrs, emit }) {
      const currentActiveMenu = ref('');
      const isClickGo = ref(false);
--- a/src/components/SimpleMenu/src/components/MenuItem.vue
+++ b/src/components/SimpleMenu/src/components/MenuItem.vue
@ -5,7 +5,7 @@
        <slot name="title"></slot>
      </template>
      <div :class="`${prefixCls}-tooltip`">
-        <slot />
+        <slot></slot>
      </div>
    </Tooltip>

--- a/src/components/SimpleMenu/src/components/SubMenuItem.vue
+++ b/src/components/SimpleMenu/src/components/SubMenuItem.vue
@ -287,7 +287,9 @@
        );

        rootMenuEmitter.on('on-update-active-name:submenu', (data: number[]) => {
-          state.active = data.includes(instance?.uid!);
+          if (instance?.uid) {
+            state.active = data.includes(instance?.uid);
+          }
        });
      });

--- a/src/components/StrengthMeter/src/index.vue
+++ b/src/components/StrengthMeter/src/index.vue
@ -9,7 +9,7 @@
      :disabled="disabled"
    >
      <template #[item]="data" v-for="item in Object.keys($slots)">
-        <slot :name="item" v-bind="data" />
+        <slot :name="item" v-bind="data"></slot>
      </template>
    </InputPassword>
    <div :class="`${prefixCls}-bar`">
--- a/src/components/Table/src/BasicTable.vue
+++ b/src/components/Table/src/BasicTable.vue
@ -20,7 +20,7 @@
      @advanced-change="redoHeight"
    >
      <template #[replaceFormSlotKey(item)]="data" v-for="item in getFormSlotKeys">
-        <slot :name="item" v-bind="data" />
+        <slot :name="item" v-bind="data"></slot>
      </template>
    </BasicForm>

@ -32,7 +32,7 @@
      @change="handleTableChange"
    >
      <template #[item]="data" v-for="item in Object.keys($slots)">
-        <slot :name="item" v-bind="data" />
+        <slot :name="item" v-bind="data"></slot>
      </template>
      <template #[`header-${column.dataIndex}`] v-for="column in columns" :key="column.dataIndex">
        <HeaderCell :column="column" />
@ -69,12 +69,12 @@

  import './style/index.less';
  export default defineComponent({
-    props: basicProps,
    components: {
      Table,
      BasicForm,
      HeaderCell: createAsyncComponent(() => import('./components/HeaderCell.vue')),
    },
+    props: basicProps,
    emits: [
      'fetch-success',
      'fetch-error',
--- a/src/components/Table/src/components/EditTableHeaderIcon.vue
+++ b/src/components/Table/src/components/EditTableHeaderIcon.vue
@ -1,6 +1,6 @@
 <template>
  <span>
-    <slot />
+    <slot></slot>
    {{ title }}
    <FormOutlined />
  </span>
--- a/src/components/Table/src/components/TableAction.vue
+++ b/src/components/Table/src/components/TableAction.vue
@ -11,7 +11,7 @@
      />
    </template>
    <Dropdown :trigger="['hover']" :dropMenuList="getDropList" v-if="dropDownActions">
-      <slot name="more" />
+      <slot name="more"></slot>
      <a-button type="link" size="small" v-if="!$slots.more">
        <MoreOutlined class="icon-more" />
      </a-button>
--- a/src/components/Table/src/components/TableHeader.vue
+++ b/src/components/Table/src/components/TableHeader.vue
@ -1,9 +1,9 @@
 <template>
-  <slot name="tableTitle" v-if="$slots.tableTitle" />
+  <slot name="tableTitle" v-if="$slots.tableTitle"></slot>
  <TableTitle :helpMessage="titleHelpMessage" :title="title" v-if="!$slots.tableTitle && title" />

  <div :class="`${prefixCls}__toolbar`">
-    <slot name="toolbar" />
+    <slot name="toolbar"></slot>
    <Divider type="vertical" v-if="$slots.toolbar" />
    <TableSetting :setting="tableSetting" v-if="showTableSetting" />
  </div>
--- a/src/components/Table/src/components/editable/EditableCell.vue
+++ b/src/components/Table/src/components/editable/EditableCell.vue
@ -18,8 +18,7 @@
        @change="handleChange"
        @options-change="handleOptionsChange"
        @pressEnter="handleSubmit"
-      >
-      </CellComponent>
+      />
      <div :class="`${prefixCls}__action`" v-if="!getRowEditable">
        <CheckOutlined :class="[`${prefixCls}__icon`, 'mx-2']" @click="handleSubmit" />
        <CloseOutlined :class="`${prefixCls}__icon `" @click="handleCancel" />
@ -48,6 +47,9 @@
  export default defineComponent({
    name: 'EditableCell',
    components: { FormOutlined, CloseOutlined, CheckOutlined, CellComponent },
+    directives: {
+      clickOutside,
+    },
    props: {
      value: {
        type: [String, Number, Boolean, Object] as PropType<string | number | boolean | Recordable>,
@ -62,10 +64,6 @@
      },
      index: propTypes.number,
    },
-    directives: {
-      clickOutside,
-    },
-
    setup(props) {
      const table = useTableContext();
      const isEdit = ref(false);
@ -232,7 +230,7 @@
        const dataKey = (dataIndex || key) as string;

        const record = await table.updateTableData(index, dataKey, value);
-        needEmit && table.emit?.('edit-end', { record, index, key, value});
+        needEmit && table.emit?.('edit-end', { record, index, key, value });
        isEdit.value = false;
      }

--- a/src/components/Table/src/components/settings/ColumnSetting.vue
+++ b/src/components/Table/src/components/settings/ColumnSetting.vue
@ -44,10 +44,14 @@
            <template v-for="item in plainOptions" :key="item.value">
              <div :class="`${prefixCls}__check-item`">
                <DragOutlined class="table-coulmn-drag-icon" />
-                <Checkbox :value="item.value"> {{ item.label }} </Checkbox>
+                <Checkbox :value="item.value">
+                  {{ item.label }}
+                </Checkbox>

                <Tooltip placement="bottomLeft" :mouseLeaveDelay="0.4">
-                  <template #title> {{ t('component.table.settingFixedLeft') }}</template>
+                  <template #title>
+                    {{ t('component.table.settingFixedLeft') }}
+                  </template>
                  <Icon
                    icon="line-md:arrow-align-left"
                    :class="[
@ -62,7 +66,9 @@
                </Tooltip>
                <Divider type="vertical" />
                <Tooltip placement="bottomLeft" :mouseLeaveDelay="0.4">
-                  <template #title> {{ t('component.table.settingFixedRight') }}</template>
+                  <template #title>
+                    {{ t('component.table.settingFixedRight') }}
+                  </template>
                  <Icon
                    icon="line-md:arrow-align-left"
                    :class="[
--- a/src/components/Tinymce/src/Editor.vue
+++ b/src/components/Tinymce/src/Editor.vue
@ -39,9 +39,9 @@

  export default defineComponent({
    name: 'Tinymce',
+    components: { ImgUpload },
    inheritAttrs: false,
    props: basicProps,
-    components: { ImgUpload },
    emits: ['change', 'update:modelValue'],
    setup(props, { emit, attrs }) {
      const editorRef = ref<any>(null);
--- a/src/components/Tinymce/src/ImgUpload.vue
+++ b/src/components/Tinymce/src/ImgUpload.vue
@ -8,7 +8,9 @@
      :showUploadList="false"
      accept=".jpg,.jpeg,.gif,.png,.webp"
    >
-      <a-button type="primary">{{ t('component.upload.imgUpload') }}</a-button>
+      <a-button type="primary">
+        {{ t('component.upload.imgUpload') }}
+      </a-button>
    </Upload>
  </div>
 </template>
@ -16,14 +18,13 @@
  import { defineComponent } from 'vue';

  import { Upload } from 'ant-design-vue';
-  import { InboxOutlined } from '@ant-design/icons-vue';
  import { useDesign } from '/@/hooks/web/useDesign';
  import { useGlobSetting } from '/@/hooks/setting';
  import { useI18n } from '/@/hooks/web/useI18n';

  export default defineComponent({
    name: 'TinymceImageUpload',
-    components: { Upload, InboxOutlined },
+    components: { Upload },
    emits: ['uploading', 'done', 'error'],
    setup(_, { emit }) {
      let uploading = false;
--- a/src/components/Upload/src/BasicUpload.vue
+++ b/src/components/Upload/src/BasicUpload.vue
@ -7,7 +7,9 @@
      <Tooltip placement="bottom" v-if="showPreview">
        <template #title>
          {{ t('component.upload.uploaded') }}
-          <template v-if="fileListRef.length">{{ fileListRef.length }}</template>
+          <template v-if="fileListRef.length">
+            {{ fileListRef.length }}
+          </template>
        </template>
        <a-button @click="openPreviewModal">
          <Icon icon="bi:eye" />
@ -45,6 +47,8 @@
    name: 'BasicUpload',
    components: { UploadModal, UploadPreviewModal, Icon, Tooltip },
    props: uploadContainerProps,
+    emits: ['change'],
+
    setup(props, { emit, attrs }) {
      const { t } = useI18n();
      // 上传modal
--- a/src/components/Upload/src/UploadModal.vue
+++ b/src/components/Upload/src/UploadModal.vue
@ -33,7 +33,9 @@
        :before-upload="beforeUpload"
        class="upload-modal-toolbar__btn"
      >
-        <a-button type="primary"> {{ t('component.upload.choose') }} </a-button>
+        <a-button type="primary">
+          {{ t('component.upload.choose') }}
+        </a-button>
      </Upload>
    </div>
    <FileList :dataSource="fileListRef" :columns="columns" :actionColumn="actionColumn" />
@ -62,6 +64,7 @@
  export default defineComponent({
    components: { BasicModal, Upload, Alert, FileList },
    props: basicProps,
+    emits: ['change'],
    setup(props, { emit }) {
      const { t } = useI18n();

--- a/src/components/Upload/src/UploadPreviewModal.vue
+++ b/src/components/Upload/src/UploadPreviewModal.vue
@ -27,6 +27,7 @@
  export default defineComponent({
    components: { BasicModal, FileList },
    props: previewProps,
+    emits: ['list-change'],
    setup(props, { emit }) {
      const [register, { closeModal }] = useModalInner();
      const { t } = useI18n();
--- a/src/layouts/default/header/MultipleHeader.vue
+++ b/src/layouts/default/header/MultipleHeader.vue
@ -1,5 +1,5 @@
 <template>
-  <div :style="getPlaceholderDomStyle" v-if="getIsShowPlaceholderDom" />
+  <div :style="getPlaceholderDomStyle" v-if="getIsShowPlaceholderDom"></div>
  <div :style="getWrapStyle" :class="getClass">
    <LayoutHeader v-if="getShowInsetHeaderRef" />
    <MultipleTabs v-if="getShowTabs" />
--- a/src/layouts/default/header/components/Breadcrumb.vue
+++ b/src/layouts/default/header/components/Breadcrumb.vue
@ -25,7 +25,6 @@
  import { REDIRECT_NAME } from '/@/router/constant';
  import Icon from '/@/components/Icon';

-  import { HomeOutlined } from '@ant-design/icons-vue';
  import { PageEnum } from '/@/enums/pageEnum';

  import { useDesign } from '/@/hooks/web/useDesign';
@ -37,7 +36,7 @@

  export default defineComponent({
    name: 'LayoutBreadcrumb',
-    components: { HomeOutlined, Icon, [Breadcrumb.name]: Breadcrumb },
+    components: { Icon, [Breadcrumb.name]: Breadcrumb },
    props: {
      theme: propTypes.oneOf(['dark', 'light']),
    },
--- a/src/layouts/default/header/components/lock/LockModal.vue
+++ b/src/layouts/default/header/components/lock/LockModal.vue
@ -9,7 +9,9 @@
    <div :class="`${prefixCls}__entry`">
      <div :class="`${prefixCls}__header`">
        <img :src="headerImg" :class="`${prefixCls}__header-img`" />
-        <p :class="`${prefixCls}__header-name`">{{ getRealName }}</p>
+        <p :class="`${prefixCls}__header-name`">
+          {{ getRealName }}
+        </p>
      </div>

      <BasicForm @register="registerForm" />
--- a/src/layouts/default/header/components/notify/NoticeList.vue
+++ b/src/layouts/default/header/components/notify/NoticeList.vue
@ -21,8 +21,12 @@

          <template #description>
            <div>
-              <div class="description">{{ item.description }}</div>
-              <div class="datetime">{{ item.datetime }}</div>
+              <div class="description">
+                {{ item.description }}
+              </div>
+              <div class="datetime">
+                {{ item.datetime }}
+              </div>
            </div>
          </template>
        </a-list-item-meta>
--- a/src/layouts/default/header/components/user-dropdown/index.vue
+++ b/src/layouts/default/header/components/user-dropdown/index.vue
@ -33,8 +33,6 @@

  // res

-  import Icon from '/@/components/Icon/index';
-
  import { userStore } from '/@/store/modules/user';

  import { DOC_URL } from '/@/settings/siteSetting';
@ -58,7 +56,6 @@
      Menu,
      MenuItem: createAsyncComponent(() => import('./DropMenuItem.vue')),
      MenuDivider: Menu.Divider,
-      Icon,
    },
    props: {
      theme: propTypes.oneOf(['dark', 'light']),
--- a/src/layouts/default/setting/components/TypePicker.vue
+++ b/src/layouts/default/setting/components/TypePicker.vue
@ -12,7 +12,7 @@
            },
          ]"
        >
-          <div class="mix-sidebar" />
+          <div class="mix-sidebar"></div>
        </div>
      </Tooltip>
    </template>
@ -31,7 +31,7 @@
    props: {
      menuTypeList: {
        type: Array as PropType<typeof menuTypeList>,
-        defualt: [],
+        defualt: () => [],
      },
      handler: {
        type: Function as PropType<Fn>,
@ -39,6 +39,7 @@
      },
      def: {
        type: String,
+        default: '',
      },
    },
    setup() {
--- a/src/layouts/default/sider/DragBar.vue
+++ b/src/layouts/default/sider/DragBar.vue
@ -1,5 +1,5 @@
 <template>
-  <div :class="getClass" :style="getDragBarStyle" />
+  <div :class="getClass" :style="getDragBarStyle"></div>
 </template>
 <script lang="ts">
  import { defineComponent, computed, unref } from 'vue';
--- a/src/layouts/default/sider/LayoutSider.vue
+++ b/src/layouts/default/sider/LayoutSider.vue
@ -3,7 +3,7 @@
    v-if="getMenuFixed && !getIsMobile"
    :style="getHiddenDomStyle"
    :class="{ hidden: !showClassSideBarRef }"
-  />
+  ></div>
  <Sider
    ref="sideRef"
    breakpoint="lg"
--- a/src/layouts/default/sider/MixSider.vue
+++ b/src/layouts/default/sider/MixSider.vue
@ -1,5 +1,5 @@
 <template>
-  <div :class="`${prefixCls}-dom`" :style="getDomStyle" />
+  <div :class="`${prefixCls}-dom`" :style="getDomStyle"></div>

  <div
    v-click-outside="handleClickOutside"
@ -37,7 +37,9 @@
            :size="getCollapsed ? 16 : 20"
            :icon="item.meta && item.meta.icon"
          />
-          <p :class="`${prefixCls}-module__name`">{{ t(item.name) }}</p>
+          <p :class="`${prefixCls}-module__name`">
+            {{ t(item.name) }}
+          </p>
        </li>
      </ul>
    </ScrollContainer>
@ -156,9 +158,11 @@
      );

      const getIsFixed = computed(() => {
+        /* eslint-disable-next-line */
        mixSideHasChildren.value = unref(chilrenMenus).length > 0;
        const isFixed = unref(getMixSideFixed) && unref(mixSideHasChildren);
        if (isFixed) {
+          /* eslint-disable-next-line */
          openMenu.value = true;
        }
        return isFixed;
--- a/src/layouts/default/tabs/components/FoldButton.vue
+++ b/src/layouts/default/tabs/components/FoldButton.vue
@ -5,9 +5,7 @@
 </template>
 <script lang="ts">
  import { defineComponent, unref, computed } from 'vue';
-  import { RedoOutlined } from '@ant-design/icons-vue';
  import { useDesign } from '/@/hooks/web/useDesign';
-  import { Tooltip } from 'ant-design-vue';
  import { useHeaderSetting } from '/@/hooks/setting/useHeaderSetting';
  import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';

@ -15,7 +13,7 @@

  export default defineComponent({
    name: 'FoldButton',
-    components: { RedoOutlined, Tooltip, Icon },
+    components: { Icon },

    setup() {
      const { prefixCls } = useDesign('multiple-tabs-content');
--- a/src/layouts/page/ParentView.vue
+++ b/src/layouts/page/ParentView.vue
@ -4,7 +4,7 @@
 <template>
  <div>
    <router-view>
-      <template v-slot="{ Component, route }">
+      <template #default="{ Component, route }">
        <transition
          :name="
            getTransitionName({
--- a/src/layouts/page/index.vue
+++ b/src/layouts/page/index.vue
@ -1,7 +1,7 @@
 <template>
  <div>
    <router-view>
-      <template v-slot="{ Component, route }">
+      <template #default="{ Component, route }">
        <transition
          :name="
            getTransitionName({
--- a/src/views/dashboard/analysis/components/AnalysisBar.vue
+++ b/src/views/dashboard/analysis/components/AnalysisBar.vue
@ -1,5 +1,5 @@
 <template>
-  <div ref="chartRef" :style="{ height, width }" />
+  <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
  import { defineComponent, onMounted, ref, Ref } from 'vue';
--- a/src/views/dashboard/analysis/components/AnalysisLine.vue
+++ b/src/views/dashboard/analysis/components/AnalysisLine.vue
@ -1,5 +1,5 @@
 <template>
-  <div ref="chartRef" :style="{ height, width }" />
+  <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
  import { defineComponent, onMounted, ref, Ref } from 'vue';
--- a/src/views/dashboard/analysis/components/AnalysisPie.vue
+++ b/src/views/dashboard/analysis/components/AnalysisPie.vue
@ -1,5 +1,5 @@
 <template>
-  <div ref="chartRef" :style="{ height, width }" />
+  <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
  import { defineComponent, onMounted, ref, Ref } from 'vue';
--- a/src/views/dashboard/analysis/components/GrowCard.vue
+++ b/src/views/dashboard/analysis/components/GrowCard.vue
@ -2,14 +2,18 @@
  <div class="grow-card">
    <div class="grow-card-header">
      <div class="grow-card__info">
-        <p class="grow-card__title">{{ info.title }}</p>
+        <p class="grow-card__title">
+          {{ info.title }}
+        </p>
        <CountTo prefix="$" :startVal="1" :endVal="info.price" />
      </div>
      <img :src="info.icon" />
    </div>
    <div class="grow-card-footer" :class="{ 'is-up': info.up }">
      <Statistic :value="info.percent">
-        <template #prefix> <img :src="info.up ? riseSvg : downSvg" /> </template>
+        <template #prefix>
+          <img :src="info.up ? riseSvg : downSvg" />
+        </template>
      </Statistic>
      <span class="grow-card__mom">{{ info.mom }}</span>
    </div>
--- a/src/views/dashboard/analysis/components/TrendLine.vue
+++ b/src/views/dashboard/analysis/components/TrendLine.vue
@ -1,5 +1,5 @@
 <template>
-  <div ref="chartRef" :style="{ height, width }" />
+  <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
  import { defineComponent, onMounted, ref, Ref } from 'vue';
--- a/src/views/dashboard/analysis/index.vue
+++ b/src/views/dashboard/analysis/index.vue
@ -1,10 +1,10 @@
 <template>
-  <div class="analysis p-4">
+  <div class="p-4 analysis">
    <a-row class="pl-2">
      <template v-for="item in growCardList" :key="item.title">
-        <ACol :sm="24" :md="12" :lg="6">
+        <a-col :sm="24" :md="12" :lg="6">
          <GrowCard :info="item" />
-        </ACol>
+        </a-col>
      </template>
    </a-row>

@ -42,7 +42,6 @@
 <script lang="ts">
  import { defineComponent } from 'vue';
  import GrowCard from './components/GrowCard.vue';
-  import TrendLine from './components/TrendLine.vue';
  import AnalysisLine from './components/AnalysisLine.vue';
  import AnalysisPie from './components/AnalysisPie.vue';
  import AnalysisBar from './components/AnalysisBar.vue';
@ -55,7 +54,6 @@
    components: {
      GrowCard,
      CollapseContainer,
-      TrendLine,
      AnalysisLine,
      AnalysisPie,
      AnalysisBar,
--- a/src/views/dashboard/house/index.vue
+++ b/src/views/dashboard/house/index.vue
@ -15,26 +15,26 @@
      <div class="circle"></div>
      <div class="plastic">
        <div class="plastic__g">
-          <div class="plastic__item" />
-          <div class="plastic__item" />
-          <div class="plastic__item" />
-          <div class="plastic__item" />
-          <div class="plastic__item" />
-          <div class="plastic__item" />
-          <div class="plastic__item" />
-          <div class="plastic__item" />
+          <div class="plastic__item"></div>
+          <div class="plastic__item"></div>
+          <div class="plastic__item"></div>
+          <div class="plastic__item"></div>
+          <div class="plastic__item"></div>
+          <div class="plastic__item"></div>
+          <div class="plastic__item"></div>
+          <div class="plastic__item"></div>
        </div>
      </div>
      <div class="line">
-        <div class="line__item" />
-        <div class="line__item" />
-        <div class="line__item" />
-        <div class="line__item" />
-        <div class="line__item" />
-        <div class="line__item" />
-        <div class="line__item" />
-        <div class="line__item" />
-        <div class="line__item" />
+        <div class="line__item"></div>
+        <div class="line__item"></div>
+        <div class="line__item"></div>
+        <div class="line__item"></div>
+        <div class="line__item"></div>
+        <div class="line__item"></div>
+        <div class="line__item"></div>
+        <div class="line__item"></div>
+        <div class="line__item"></div>
      </div>
    </div>
    <div class="clouds">
@ -43,29 +43,29 @@
        <div class="cloud__item"></div>
      </div>
      <div class="cloud">
-        <div class="cloud__item" />
-        <div class="cloud__item" />
+        <div class="cloud__item"></div>
+        <div class="cloud__item"></div>
      </div>
      <div class="cloud">
-        <div class="cloud__item" />
-        <div class="cloud__item" />
+        <div class="cloud__item"></div>
+        <div class="cloud__item"></div>
      </div>
-      <div class="bird" />
+      <div class="bird"></div>
    </div>
    <div class="birds">
-      <div class="bird" />
-      <div class="bird" />
+      <div class="bird"></div>
+      <div class="bird"></div>
    </div>
    <div class="tree">
-      <div class="tree__item" />
-      <div class="tree__item" />
-      <div class="tree__item" />
+      <div class="tree__item"></div>
+      <div class="tree__item"></div>
+      <div class="tree__item"></div>
    </div>
    <div class="bush">
-      <div class="bush__item" />
-      <div class="bush__item" />
+      <div class="bush__item"></div>
+      <div class="bush__item"></div>
    </div>
-    <div class="dot" />
+    <div class="dot"></div>
  </div>
 </template>
 <script lang="ts">
--- a/src/views/dashboard/workbench/components/NewsList.vue
+++ b/src/views/dashboard/workbench/components/NewsList.vue
@ -10,7 +10,9 @@
              </template>
              <template #description>
                <div class="news-list__item-desc">
-                  <div class="news-list__item-time mb-1"> {{ item.sendTime }}</div>
+                  <div class="news-list__item-time mb-1">
+                    {{ item.sendTime }}
+                  </div>
                  <div class="news-list__item-title mb-1">
                    <span class="news-list__item-light">{{ item.sender }}&nbsp;</span>申请迭代
                    <span class="news-list__item-light">&nbsp;{{ item.title }}&nbsp;</span>发布
--- a/src/views/dashboard/workbench/components/ProdTotal.vue
+++ b/src/views/dashboard/workbench/components/ProdTotal.vue
@ -1,13 +1,13 @@
 <template>
-  <Row class="prod-total">
+  <a-row class="prod-total">
    <template v-for="(item, index) in wokbProd" :key="item.type">
-      <Col :xs="12" :sm="6" class="prod-total__item" :class="`prod-total__item-${index}`">
-        <div class="img" :class="`prod-total__item-${index}-img`" />
+      <a-col :xs="12" :sm="6" class="prod-total__item" :class="`prod-total__item-${index}`">
+        <div class="img" :class="`prod-total__item-${index}-img`"></div>
        <div>{{ item.amount }}</div>
        <span>{{ item.type }}</span>
-      </Col>
+      </a-col>
    </template>
-  </Row>
+  </a-row>
 </template>
 <script lang="ts">
  import { defineComponent } from 'vue';
@ -16,7 +16,7 @@
  import { wokbProd } from '../data';
  // import {ProdTypeEnum} from '@/api/dashboard/model/wokbModel'
  export default defineComponent({
-    components: { Row, Col },
+    components: { [Row.name]: Row, [Col.name]: Col },
    setup() {
      return { wokbProd };
    },
--- a/src/views/dashboard/workbench/components/ShortCuts.vue
+++ b/src/views/dashboard/workbench/components/ShortCuts.vue
@ -3,23 +3,23 @@
    <template #action>
      <a-button size="small" type="link"> 新建 </a-button>
    </template>
-    <Row>
+    <a-row>
      <template v-for="item in shortCuts" :key="item.img">
-        <Col :span="8" class="shortcuts__item p-3">
-          <img :src="item.img" class="shortcuts__item-img mb-2" />
+        <a-col :span="8" class="p-3 shortcuts__item">
+          <img :src="item.img" class="mb-2 shortcuts__item-img" />
          <br />
          <span>{{ item.name }}</span>
-        </Col>
+        </a-col>
      </template>

-      <Col :span="8" class="shortcuts__item p-3">
-        <span class="shortcuts__item-all mb-2">
+      <a-col :span="8" class="p-3 shortcuts__item">
+        <span class="mb-2 shortcuts__item-all">
          <RightOutlined />
        </span>
        <br />
        <span>查看全部</span>
-      </Col>
-    </Row>
+      </a-col>
+    </a-row>
  </CollapseContainer>
 </template>
 <script lang="ts">
@ -71,7 +71,7 @@
    },
  ];
  export default defineComponent({
-    components: { Row, Col, CollapseContainer, RightOutlined },
+    components: { [Row.name]: Row, [Col.name]: Col, CollapseContainer, RightOutlined },
    setup() {
      return { shortCuts };
    },
--- a/src/views/dashboard/workbench/components/TodoList.vue
+++ b/src/views/dashboard/workbench/components/TodoList.vue
@ -23,14 +23,14 @@
            </template>
          </ListItemMeta>
          <a-button type="link">
-            <Tag color="blue">待审批</Tag>
+            <Tag color="blue"> 待审批 </Tag>
          </a-button>
        </ListItem>
      </template>
    </List>
    <div class="todo-list__all">
      <Tooltip placement="topRight">
-        <template #title>查看更多</template>
+        <template #title> 查看更多 </template>
        <EllipsisOutlined />
      </Tooltip>
    </div>
--- a/src/views/dashboard/workbench/components/Week.vue
+++ b/src/views/dashboard/workbench/components/Week.vue
@ -1,6 +1,6 @@
 <template>
  <CollapseContainer title="销售统计" :canExpan="false">
-    <div ref="chartRef" :style="{ width: '100%' }" />
+    <div ref="chartRef" :style="{ width: '100%' }"></div>
  </CollapseContainer>
 </template>
 <script lang="ts">
--- a/src/views/demo/comp/button/index.vue
+++ b/src/views/demo/comp/button/index.vue
@ -5,12 +5,12 @@
    content=" 基础组件依赖于ant-design-vue,组件库已有的基础组件,项目中不会再次进行demo展示（二次封装组件除外）"
  >
    <template #rightFooter>
-      <a-button type="primary">确认</a-button>
+      <a-button type="primary"> 确认 </a-button>
    </template>

    <div class="my-2">
      <h3>success</h3>
-      <a-button color="success">成功</a-button>
+      <a-button color="success"> 成功 </a-button>
      <a-button color="success" class="ml-2" disabled> 禁用 </a-button>
      <a-button color="success" class="ml-2" loading> loading </a-button>
      <a-button color="success" type="link" class="ml-2"> link </a-button>
@ -20,7 +20,7 @@

    <div class="my-2">
      <h3>warning</h3>
-      <a-button color="warning">警告</a-button>
+      <a-button color="warning"> 警告 </a-button>
      <a-button color="warning" class="ml-2" disabled> 禁用 </a-button>
      <a-button color="warning" class="ml-2" loading> loading </a-button>
      <a-button color="warning" type="link" class="ml-2"> link </a-button>
@ -30,7 +30,7 @@

    <div class="my-2">
      <h3>error</h3>
-      <a-button color="error">错误</a-button>
+      <a-button color="error"> 错误 </a-button>
      <a-button color="error" class="ml-2" disabled> 禁用 </a-button>
      <a-button color="error" class="ml-2" loading> loading </a-button>
      <a-button color="error" type="link" class="ml-2"> link </a-button>
@ -40,7 +40,7 @@

    <div class="my-2">
      <h3>ghost</h3>
-      <a-button ghost>幽灵</a-button>
+      <a-button ghost> 幽灵 </a-button>
      <a-button ghost class="ml-2" disabled> 禁用 </a-button>
      <a-button ghost class="ml-2" loading> loading </a-button>
      <a-button ghost type="link" class="ml-2"> link </a-button>
@ -50,7 +50,7 @@

    <div class="my-2">
      <h3>primary</h3>
-      <a-button type="primary" preIcon="mdi:page-next-outline">主按钮</a-button>
+      <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" loading> loading </a-button>
      <a-button type="link" class="ml-2"> link </a-button>
@ -60,7 +60,7 @@

    <div class="my-2">
      <h3>default</h3>
-      <a-button type="default">默认</a-button>
+      <a-button type="default"> 默认 </a-button>
      <a-button type="default" class="ml-2" disabled> 禁用 </a-button>
      <a-button type="default" class="ml-2" loading> loading </a-button>
      <a-button type="link" class="ml-2"> link </a-button>
@ -70,7 +70,7 @@

    <div class="my-2">
      <h3>dashed</h3>
-      <a-button type="dashed">dashed</a-button>
+      <a-button type="dashed"> dashed </a-button>
      <a-button type="dashed" class="ml-2" disabled> 禁用 </a-button>
      <a-button type="dashed" class="ml-2" loading> loading </a-button>
    </div>
--- a/src/views/demo/comp/drawer/Drawer2.vue
+++ b/src/views/demo/comp/drawer/Drawer2.vue
@ -1,7 +1,7 @@
 <template>
  <BasicDrawer v-bind="$attrs" @register="register" title="Drawer Title" width="50%">
    Drawer Info.
-    <a-button type="primary" @click="closeDrawer">内部关闭drawer</a-button>
+    <a-button type="primary" @click="closeDrawer"> 内部关闭drawer </a-button>
  </BasicDrawer>
 </template>
 <script lang="ts">
--- a/src/views/demo/comp/drawer/Drawer3.vue
+++ b/src/views/demo/comp/drawer/Drawer3.vue
@ -1,6 +1,6 @@
 <template>
  <BasicDrawer v-bind="$attrs" title="Modal Title" width="50%" showFooter @ok="handleOk">
-    <p class="h-20" v-for="index in 40" :key="index">根据屏幕高度自适应</p>
+    <p class="h-20" v-for="index in 40" :key="index"> 根据屏幕高度自适应 </p>
    <template #insertFooter>
      <a-button> btn</a-button>
    </template>
--- a/src/views/demo/comp/drawer/Drawer5.vue
+++ b/src/views/demo/comp/drawer/Drawer5.vue
@ -1,6 +1,6 @@
 <template>
  <BasicDrawer v-bind="$attrs" :isDetail="true" title="Drawer Title5">
-    <p class="h-20">Content Message</p>
+    <p class="h-20"> Content Message </p>
    <template #titleToolbar> toolbar </template>
  </BasicDrawer>
 </template>
--- a/src/views/demo/comp/drawer/index.vue
+++ b/src/views/demo/comp/drawer/index.vue
@ -1,20 +1,20 @@
 <template>
  <PageWrapper title="抽屉组件使用示例">
    <Alert message="使用 useDrawer 进行抽屉操作" show-icon />
-    <a-button type="primary" class="my-4" @click="openDrawerLoading">打开Drawer</a-button>
+    <a-button type="primary" class="my-4" @click="openDrawerLoading"> 打开Drawer </a-button>

    <Alert message="内外同时控制显示隐藏" show-icon />
-    <a-button type="primary" class="my-4" @click="openDrawer2(true)">打开Drawer</a-button>
+    <a-button type="primary" class="my-4" @click="openDrawer2(true)"> 打开Drawer </a-button>
    <Alert message="自适应高度/显示footer" show-icon />
-    <a-button type="primary" class="my-4" @click="openDrawer3(true)">打开Drawer</a-button>
+    <a-button type="primary" class="my-4" @click="openDrawer3(true)"> 打开Drawer </a-button>

    <Alert
      message="内外数据交互,外部通过 transferModalData 发送，内部通过 receiveDrawerDataRef 接收。该数据具有响应式"
      show-icon
    />
-    <a-button type="primary" class="my-4" @click="send">打开Drawer并传递数据</a-button>
+    <a-button type="primary" class="my-4" @click="send"> 打开Drawer并传递数据 </a-button>
    <Alert message="详情页模式" show-icon />
-    <a-button type="primary" class="my-4" @click="openDrawer5(true)">打开详情Drawer</a-button>
+    <a-button type="primary" class="my-4" @click="openDrawer5(true)"> 打开详情Drawer </a-button>
    <Drawer1 @register="register1" />
    <Drawer2 @register="register2" />
    <Drawer3 @register="register3" />
--- a/src/views/demo/comp/lazy/Transition.vue
+++ b/src/views/demo/comp/lazy/Transition.vue
@ -13,13 +13,12 @@
 </template>
 <script lang="ts">
  import { defineComponent } from 'vue';
-  import { Skeleton } from 'ant-design-vue';
  import TargetContent from './TargetContent.vue';
  import { LazyContainer } from '/@/components/Container/index';
  import { PageWrapper } from '/@/components/Page';

  export default defineComponent({
-    components: { LazyContainer, TargetContent, Skeleton, PageWrapper },
+    components: { LazyContainer, TargetContent, PageWrapper },
  });
 </script>
 <style lang="less">
--- a/src/views/demo/comp/loading/index.vue
+++ b/src/views/demo/comp/loading/index.vue
@ -1,14 +1,16 @@
 <template>
  <PageWrapper v-loading="loadingRef" loading-tip="加载中..." title="Loading组件示例">
    <a-alert message="组件方式" />
-    <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>
+    <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" :tip="tip" />

    <a-alert message="函数方式" />

-    <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-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">
--- a/src/views/demo/comp/modal/Modal2.vue
+++ b/src/views/demo/comp/modal/Modal2.vue
@ -5,9 +5,9 @@
    title="Modal Title"
    :helpMessage="['提示1', '提示2']"
  >
-    <a-button type="primary" @click="closeModal" class="mr-2">从内部关闭弹窗</a-button>
+    <a-button type="primary" @click="closeModal" class="mr-2"> 从内部关闭弹窗 </a-button>

-    <a-button type="primary" @click="setModalProps">从内部修改title</a-button>
+    <a-button type="primary" @click="setModalProps"> 从内部修改title </a-button>
  </BasicModal>
 </template>
 <script lang="ts">
--- a/src/views/demo/comp/modal/Modal3.vue
+++ b/src/views/demo/comp/modal/Modal3.vue
@ -1,6 +1,6 @@
 <template>
  <BasicModal v-bind="$attrs" title="Modal Title" :helpMessage="['提示1', '提示2']" width="700px">
-    <p class="h-20" v-for="index in 20" :key="index">根据屏幕高度自适应</p>
+    <p class="h-20" v-for="index in 20" :key="index"> 根据屏幕高度自适应 </p>
  </BasicModal>
 </template>
 <script lang="ts">
--- a/src/views/demo/comp/modal/index.vue
+++ b/src/views/demo/comp/modal/index.vue
@ -5,20 +5,20 @@
    参数进行控制是否可以拖动/全屏"
      show-icon
    />
-    <a-button type="primary" class="my-4" @click="openModalLoading"
-      >打开弹窗 默认可以拖动/全屏</a-button
-    >
+    <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>
+    <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>
+    <a-button type="primary" class="my-4" @click="openModal3"> 打开弹窗 </a-button>

    <Alert
      message="内外数据交互,外部通过 transferModalData 发送，内部通过 receiveDrawerDataRef 接收。该数据具有响应式"
      show-icon
    />
-    <a-button type="primary" class="my-4" @click="send">打开弹窗并传递数据</a-button>
+    <a-button type="primary" class="my-4" @click="send"> 打开弹窗并传递数据 </a-button>

    <Modal1 @register="register1" />
    <Modal2 @register="register2" />
--- a/src/views/demo/comp/qrcode/index.vue
+++ b/src/views/demo/comp/qrcode/index.vue
@ -52,7 +52,7 @@
      <CollapseContainer title="下载示例" class="text-center qrcode-demo-item">
        <QrCode :value="qrCodeUrl" ref="qrRef" :logo="LogoImg" />
        <a-button class="mb-2" type="primary" @click="download"> 下载 </a-button>
-        <div class="msg">(在线logo会导致图片跨域，需要下载图片需要自行解决跨域问题)</div>
+        <div class="msg"> (在线logo会导致图片跨域，需要下载图片需要自行解决跨域问题) </div>
      </CollapseContainer>

      <CollapseContainer title="配置大小示例" class="text-center qrcode-demo-item">
--- a/src/views/demo/comp/scroll/Action.vue
+++ b/src/views/demo/comp/scroll/Action.vue
@ -1,16 +1,18 @@
 <template>
  <PageWrapper title="滚动组件函数示例" content="基于el-scrollbar">
    <div class="my-4">
-      <a-button @click="scrollTo(100)" class="mr-2">滚动到100px位置</a-button>
-      <a-button @click="scrollTo(800)" class="mr-2">滚动到800px位置</a-button>
-      <a-button @click="scrollTo(0)" class="mr-2">滚动到顶部</a-button>
-      <a-button @click="scrollBottom()" class="mr-2">滚动到底部</a-button>
+      <a-button @click="scrollTo(100)" class="mr-2"> 滚动到100px位置 </a-button>
+      <a-button @click="scrollTo(800)" class="mr-2"> 滚动到800px位置 </a-button>
+      <a-button @click="scrollTo(0)" class="mr-2"> 滚动到顶部 </a-button>
+      <a-button @click="scrollBottom()" class="mr-2"> 滚动到底部 </a-button>
    </div>
    <div class="scroll-wrap">
      <ScrollContainer class="mt-4" ref="scrollRef">
        <ul class="p-3">
          <template v-for="index in 100" :key="index">
-            <li class="p-2" :style="{ border: '1px solid #eee' }">{{ index }}</li>
+            <li class="p-2" :style="{ border: '1px solid #eee' }">
+              {{ index }}
+            </li>
          </template>
        </ul>
      </ScrollContainer>
@ -19,12 +21,11 @@
 </template>
 <script lang="ts">
  import { defineComponent, ref, unref } from 'vue';
-  import { CollapseContainer } from '/@/components/Container/index';
  import { ScrollContainer, ScrollActionType } from '/@/components/Container/index';
  import { PageWrapper } from '/@/components/Page';

  export default defineComponent({
-    components: { CollapseContainer, ScrollContainer, PageWrapper },
+    components: { ScrollContainer, PageWrapper },
    setup() {
      const scrollRef = ref<Nullable<ScrollActionType>>(null);
      const getScroll = () => {
--- a/src/views/demo/comp/scroll/VirtualScroll.vue
+++ b/src/views/demo/comp/scroll/VirtualScroll.vue
@ -3,8 +3,10 @@
    <Divider>基础滚动示例</Divider>
    <div class="virtual-scroll-demo-wrap">
      <VScroll :itemHeight="41" :items="data" :height="300" :width="300">
-        <template v-slot="{ item }">
-          <div class="virtual-scroll-demo__item">{{ item.title }}</div>
+        <template #default="{ item }">
+          <div class="virtual-scroll-demo__item">
+            {{ item.title }}
+          </div>
        </template>
      </VScroll>
    </div>
@ -12,8 +14,10 @@
    <Divider>即使不可见，也预先加载50条数据，防止空白</Divider>
    <div class="virtual-scroll-demo-wrap">
      <VScroll :itemHeight="41" :items="data" :height="300" :width="300" :bench="50">
-        <template v-slot="{ item }">
-          <div class="virtual-scroll-demo__item">{{ item.title }}</div>
+        <template #default="{ item }">
+          <div class="virtual-scroll-demo__item">
+            {{ item.title }}
+          </div>
        </template>
      </VScroll>
    </div>
--- a/src/views/demo/comp/scroll/index.vue
+++ b/src/views/demo/comp/scroll/index.vue
@ -4,7 +4,9 @@
      <ScrollContainer class="mt-4">
        <ul class="p-3">
          <template v-for="index in 100" :key="index">
-            <li class="p-2" :style="{ border: '1px solid #eee' }">{{ index }}</li>
+            <li class="p-2" :style="{ border: '1px solid #eee' }">
+              {{ index }}
+            </li>
          </template>
        </ul>
      </ScrollContainer>
@ -13,12 +15,11 @@
 </template>
 <script lang="ts">
  import { defineComponent } from 'vue';
-  import { CollapseContainer } from '/@/components/Container/index';
  import { ScrollContainer } from '/@/components/Container/index';
  import { PageWrapper } from '/@/components/Page';

  export default defineComponent({
-    components: { CollapseContainer, ScrollContainer, PageWrapper },
+    components: { ScrollContainer, PageWrapper },
  });
 </script>
 <style lang="less" scoped>
--- a/src/views/demo/comp/upload/index.vue
+++ b/src/views/demo/comp/upload/index.vue
@ -1,9 +1,9 @@
 <template>
  <PageWrapper title="上传组件示例">
-    <a-alert message="基础示例" class="my-5"></a-alert>
+    <a-alert message="基础示例" class="my-5" />
    <BasicUpload :maxSize="20" :maxNumber="10" @change="handleChange" :api="uploadApi" />

-    <a-alert message="嵌入表单,加入表单校验" class="my-5"></a-alert>
+    <a-alert message="嵌入表单,加入表单校验" class="my-5" />

    <BasicForm @register="register" />
  </PageWrapper>
--- a/src/views/demo/comp/verify/index.vue
+++ b/src/views/demo/comp/verify/index.vue
@ -2,12 +2,12 @@
  <PageWrapper title="拖动校验示例">
    <div class="flex justify-center p-4 items-center bg-gray-700">
      <BasicDragVerify ref="el1" @success="handleSuccess" />
-      <a-button type="primary" class="ml-2" @click="handleBtnClick(el1)">还原</a-button>
+      <a-button type="primary" class="ml-2" @click="handleBtnClick(el1)"> 还原 </a-button>
    </div>

    <div class="flex justify-center p-4 items-center bg-gray-700">
      <BasicDragVerify ref="el2" @success="handleSuccess" circle />
-      <a-button type="primary" class="ml-2" @click="handleBtnClick(el2)">还原</a-button>
+      <a-button type="primary" class="ml-2" @click="handleBtnClick(el2)"> 还原 </a-button>
    </div>

    <div class="flex justify-center p-4 items-center bg-gray-700">
@ -20,7 +20,7 @@
          background: '#018ffb',
        }"
      />
-      <a-button type="primary" class="ml-2" @click="handleBtnClick(el3)">还原</a-button>
+      <a-button type="primary" class="ml-2" @click="handleBtnClick(el3)"> 还原 </a-button>
    </div>

    <div class="flex justify-center p-4 items-center bg-gray-700">
@ -30,7 +30,7 @@
          <RightOutlined v-else />
        </template>
      </BasicDragVerify>
-      <a-button type="primary" class="ml-2" @click="handleBtnClick(el4)">还原</a-button>
+      <a-button type="primary" class="ml-2" @click="handleBtnClick(el4)"> 还原 </a-button>
    </div>

    <div class="flex justify-center p-4 items-center bg-gray-700">
@ -46,7 +46,7 @@
          </div>
        </template>
      </BasicDragVerify>
-      <a-button type="primary" class="ml-2" @click="handleBtnClick(el5)">还原</a-button>
+      <a-button type="primary" class="ml-2" @click="handleBtnClick(el5)"> 还原 </a-button>
    </div>
  </PageWrapper>
 </template>
--- a/src/views/demo/echarts/Line.vue
+++ b/src/views/demo/echarts/Line.vue
@ -1,5 +1,5 @@
 <template>
-  <div ref="chartRef" :style="{ height, width }" />
+  <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
  import { defineComponent, PropType, ref, Ref, onMounted } from 'vue';
--- a/src/views/demo/echarts/Map.vue
+++ b/src/views/demo/echarts/Map.vue
@ -1,5 +1,5 @@
 <template>
-  <div ref="chartRef" :style="{ height, width }" />
+  <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
  import { defineComponent, PropType, ref, Ref, onMounted } from 'vue';
--- a/src/views/demo/echarts/Pie.vue
+++ b/src/views/demo/echarts/Pie.vue
@ -1,5 +1,5 @@
 <template>
-  <div ref="chartRef" :style="{ height, width }" />
+  <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
  import { defineComponent, PropType, ref, Ref, onMounted } from 'vue';
--- a/src/views/demo/echarts/apex/Area.vue
+++ b/src/views/demo/echarts/apex/Area.vue
@ -1,5 +1,5 @@
 <template>
-  <div ref="chartRef" :style="{ width: '100%' }" />
+  <div ref="chartRef" :style="{ width: '100%' }"></div>
 </template>
 <script lang="ts">
  import { defineComponent, ref, Ref, onMounted } from 'vue';
--- a/src/views/demo/echarts/apex/Bar.vue
+++ b/src/views/demo/echarts/apex/Bar.vue
@ -1,5 +1,5 @@
 <template>
-  <div ref="chartRef" :style="{ width: '100%' }" />
+  <div ref="chartRef" :style="{ width: '100%' }"></div>
 </template>
 <script lang="ts">
  import { defineComponent, ref, Ref, onMounted } from 'vue';
--- a/src/views/demo/echarts/apex/Line.vue
+++ b/src/views/demo/echarts/apex/Line.vue
@ -1,5 +1,5 @@
 <template>
-  <div ref="chartRef" :style="{ width: '100%' }" />
+  <div ref="chartRef" :style="{ width: '100%' }"></div>
 </template>
 <script lang="ts">
  import { defineComponent, ref, Ref, onMounted } from 'vue';
--- a/src/views/demo/echarts/apex/Mixed.vue
+++ b/src/views/demo/echarts/apex/Mixed.vue
@ -1,5 +1,5 @@
 <template>
-  <div ref="chartRef" :style="{ width: '100%' }" />
+  <div ref="chartRef" :style="{ width: '100%' }"></div>
 </template>
 <script lang="ts">
  import { defineComponent, ref, Ref, onMounted } from 'vue';
--- a/src/views/demo/editor/markdown/Editor.vue
+++ b/src/views/demo/editor/markdown/Editor.vue
@ -6,8 +6,7 @@
        :schemas="schemas"
        :actionColOptions="{ span: 24 }"
        @submit="handleSubmit"
-      >
-      </BasicForm>
+      />
    </CollapseContainer>
  </PageWrapper>
 </template>
--- a/src/views/demo/editor/markdown/index.vue
+++ b/src/views/demo/editor/markdown/index.vue
@ -1,6 +1,6 @@
 <template>
  <PageWrapper title="MarkDown组件示例">
-    <a-button @click="toggleTheme" class="mb-2" type="primary">黑暗主题</a-button>
+    <a-button @click="toggleTheme" class="mb-2" type="primary"> 黑暗主题 </a-button>
    <MarkDown :value="value" @change="handleChange" ref="markDownRef" />
  </PageWrapper>
 </template>
--- a/src/views/demo/editor/tinymce/Editor.vue
+++ b/src/views/demo/editor/tinymce/Editor.vue
@ -6,8 +6,7 @@
        :schemas="schemas"
        :actionColOptions="{ span: 24 }"
        @submit="handleSubmit"
-      >
-      </BasicForm>
+      />
    </CollapseContainer>
  </PageWrapper>
 </template>