Merge branch 'develop' of github.com:Tencent/tdesign-vue-next-starter

.eslintrc

@@ -17,7 +17,7 @@
     "defineProps": "readonly",
     "defineEmits": "readonly"
   },
-  "plugins": ["vue", "@typescript-eslint"],
+  "plugins": ["vue", "@typescript-eslint", "simple-import-sort"],
   "parserOptions": {
     "parser": "@typescript-eslint/parser",
     "sourceType": "module",
@@ -65,7 +65,9 @@
     "@typescript-eslint/no-use-before-define": "off",
     "@typescript-eslint/ban-ts-comment": "off",
     "@typescript-eslint/ban-types": "off",
-    "class-methods-use-this": "off" // 因为AxiosCancel必须实例化而能静态化所以加的规则，如果有办法解决可以取消
+    "class-methods-use-this": "off", // 因为AxiosCancel必须实例化而能静态化所以加的规则，如果有办法解决可以取消
+    "simple-import-sort/imports": "error",
+    "simple-import-sort/exports": "error"
   },
   "overrides": [
     {

mock/index.ts

@@ -1,5 +1,5 @@
-import { MockMethod } from 'vite-plugin-mock';
 import Mock from 'mockjs';
+import { MockMethod } from 'vite-plugin-mock';
 
 export default [
   {
@@ -221,6 +221,7 @@ export default [
                   component: '/form/step/index',
                   meta: {
                     title: '分步表单页',
+                    keepAlive: false,
                   },
                 },
               ],

package.json

@@ -1,6 +1,6 @@
 {
   "name": "tdesign-vue-next-starter",
-  "version": "0.7.3",
+  "version": "0.7.4",
   "scripts": {
     "dev:mock": "vite --open --mode mock",
     "dev": "vite --open --mode development",
@@ -19,20 +19,19 @@
     "test:coverage": "echo \"no test:coverage specified,work in process\""
   },
   "dependencies": {
-    "@types/nprogress": "^0.2.0",
-    "axios": "^1.2.6",
+    "axios": "^1.3.4",
     "dayjs": "^1.11.7",
     "echarts": "5.1.2",
     "lodash": "^4.17.21",
     "nprogress": "^0.2.0",
-    "pinia": "^2.0.28",
-    "pinia-plugin-persistedstate": "^3.0.2",
-    "qrcode.vue": "^3.3.3",
-    "qs": "^6.11.0",
-    "tdesign-icons-vue-next": "^0.1.7",
-    "tdesign-vue-next": "^1.0.8",
+    "pinia": "^2.0.33",
+    "pinia-plugin-persistedstate": "^3.1.0",
+    "qrcode.vue": "^3.3.4",
+    "qs": "^6.11.1",
+    "tdesign-icons-vue-next": "^0.1.8",
+    "tdesign-vue-next": "^1.2.2",
     "tvision-color": "^1.5.0",
-    "vue": "^3.2.45",
+    "vue": "^3.2.47",
     "vue-clipboard3": "^2.0.0",
     "vue-router": "~4.1.6"
   },
@@ -41,13 +40,13 @@
     "@commitlint/config-conventional": "^17.3.0",
     "@types/echarts": "^4.9.16",
     "@types/lodash": "^4.14.191",
+    "@types/nprogress": "^0.2.0",
     "@types/qs": "^6.9.7",
-    "@types/ws": "^8.5.3",
     "@typescript-eslint/eslint-plugin": "^5.47.1",
     "@typescript-eslint/parser": "^5.47.1",
     "@vitejs/plugin-vue": "^3.2.0",
-    "@vitejs/plugin-vue-jsx": "^1.1.7",
-    "@vue/compiler-sfc": "^3.2.45",
+    "@vitejs/plugin-vue-jsx": "^1.3.10",
+    "@vue/compiler-sfc": "^3.2.47",
     "@vue/eslint-config-typescript": "^11.0.2",
     "commitizen": "^4.2.4",
     "cz-conventional-changelog": "^3.3.0",
@@ -56,6 +55,7 @@
     "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-import": "^2.26.0",
     "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-simple-import-sort": "^10.0.0",
     "eslint-plugin-vue": "^9.8.0",
     "eslint-plugin-vue-scoped-css": "^2.2.0",
     "husky": "^8.0.2",
@@ -69,11 +69,11 @@
     "stylelint-config-prettier": "~9.0.4",
     "stylelint-less": "1.0.6",
     "stylelint-order": "~6.0.1",
-    "typescript": "~4.9.4",
-    "vite": "^3.0.3",
+    "typescript": "~4.9.5",
+    "vite": "^3.2.5",
     "vite-plugin-mock": "^2.9.6",
     "vite-svg-loader": "^4.0.0",
-    "vue-tsc": "^1.0.19"
+    "vue-tsc": "^1.2.0"
   },
   "config": {
     "commitizen": {

src/App.vue

@@ -3,6 +3,7 @@
 </template>
 <script setup lang="ts">
 import { computed } from 'vue';
+
 import { useSettingStore } from '@/store';
 
 const store = useSettingStore();

src/api/detail.ts

@@ -1,5 +1,5 @@
-import { request } from '@/utils/request';
 import type { ProjectListResult, PurchaseListResult } from '@/api/model/detailModel';
+import { request } from '@/utils/request';
 
 const Api = {
   PurchaseList: '/get-purchase-list',

src/api/list.ts

@@ -1,5 +1,5 @@
-import { request } from '@/utils/request';
 import type { CardListResult, ListResult } from '@/api/model/listModel';
+import { request } from '@/utils/request';
 
 const Api = {
   BaseList: '/get-list',

src/api/model/permissionModel.ts

@@ -26,4 +26,7 @@ export interface RouteMeta {
   hidden?: boolean;
   hiddenBreadcrumb?: boolean;
   single?: boolean;
+  keepAlive?: boolean;
+  frameSrc?: string;
+  frameBlank?: boolean;
 }

src/api/permission.ts

@@ -1,5 +1,5 @@
-import { request } from '@/utils/request';
 import type { MenuListResult } from '@/api/model/permissionModel';
+import { request } from '@/utils/request';
 
 const Api = {
   MenuList: '/get-menu-list',

src/components/color/index.vue

@@ -3,6 +3,7 @@
 </template>
 <script setup lang="ts">
 import { computed } from 'vue';
+
 import { DEFAULT_COLOR_OPTIONS } from '@/config/color';
 
 const panelColor =

src/components/product-card/index.vue

@@ -55,16 +55,16 @@
   </t-card>
 </template>
 <script setup lang="ts">
-import type { PropType } from 'vue';
 import {
-  ShopIcon,
+  AddIcon,
   CalendarIcon,
-  ServiceIcon,
-  UserAvatarIcon,
   LaptopIcon,
   MoreIcon,
-  AddIcon,
+  ServiceIcon,
+  ShopIcon,
+  UserAvatarIcon,
 } from 'tdesign-icons-vue-next';
+import type { PropType } from 'vue';
 
 export interface CardProductType {
   type: number;

src/components/result/index.vue

@@ -10,12 +10,13 @@
 </template>
 <script setup lang="ts">
 import { computed } from 'vue';
+
 import Result403Icon from '@/assets/assets-result-403.svg?component';
 import Result404Icon from '@/assets/assets-result-404.svg?component';
 import Result500Icon from '@/assets/assets-result-500.svg?component';
 import ResultIeIcon from '@/assets/assets-result-ie.svg?component';
-import ResultWifiIcon from '@/assets/assets-result-wifi.svg?component';
 import ResultMaintenanceIcon from '@/assets/assets-result-maintenance.svg?component';
+import ResultWifiIcon from '@/assets/assets-result-wifi.svg?component';
 
 const props = defineProps({
   bgUrl: String,

src/hooks/event/useWindowSizeFn.ts

@@ -1,5 +1,5 @@
 import debounce from 'lodash/debounce';
-import { onUnmounted, onMounted } from 'vue';
+import { onMounted, onUnmounted } from 'vue';
 
 interface WindowSizeOptions {
   immediate?: boolean;

src/hooks/index.ts

@@ -1,5 +1,5 @@
-import { ref, Ref, onUnmounted, onMounted } from 'vue';
 import * as echarts from 'echarts/core';
+import { onMounted, onUnmounted, Ref, ref } from 'vue';
 
 /**
  * eChart hook

src/layouts/components/Content.vue

@@ -10,10 +10,13 @@
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue';
+import isBoolean from 'lodash/isBoolean';
+import isUndefined from 'lodash/isUndefined';
 import type { ComputedRef } from 'vue';
-import { useTabsRouterStore } from '@/store';
+import { computed } from 'vue';
+
 import FramePage from '@/layouts/frame/index.vue';
+import { useTabsRouterStore } from '@/store';
 
 // <suspense>标签属于实验性功能，请谨慎使用
 // 如果存在需解决/page/1=> /page/2 刷新数据问题 请修改代码 使用activeRouteFullPath 作为key
@@ -30,8 +33,13 @@ import FramePage from '@/layouts/frame/index.vue';
 const aliveViews = computed(() => {
   const tabsRouterStore = useTabsRouterStore();
   const { tabRouters } = tabsRouterStore;
-
-  return tabRouters.filter((route) => route.isAlive).map((route) => route.name);
+  return tabRouters
+    .filter((route) => {
+      const keepAliveConfig = route.meta?.keepAlive;
+      const isRouteKeepAlive = isUndefined(keepAliveConfig) || (isBoolean(keepAliveConfig) && keepAliveConfig); // 默认开启keepalive
+      return route.isAlive && isRouteKeepAlive;
+    })
+    .map((route) => route.name);
 }) as ComputedRef<string[]>;
 
 const isRefreshing = computed(() => {

src/layouts/components/FrameContent.vue

@@ -6,10 +6,11 @@
   </div>
 </template>
 <script lang="ts" setup>
-import { CSSProperties, watch, ref, unref, computed } from 'vue';
 import debounce from 'lodash/debounce';
-import { useWindowSizeFn } from '@/hooks/event/useWindowSizeFn';
+import { computed, CSSProperties, ref, unref, watch } from 'vue';
+
 import { prefix } from '@/config/global';
+import { useWindowSizeFn } from '@/hooks/event/useWindowSizeFn';
 import { useSettingStore } from '@/store';
 
 defineProps({

src/layouts/components/Header.vue

@@ -64,18 +64,19 @@
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue';
 import type { PropType } from 'vue';
+import { computed } from 'vue';
 import { useRouter } from 'vue-router';
-import { useSettingStore } from '@/store';
-import { getActive } from '@/router';
-import { prefix } from '@/config/global';
+
 import LogoFull from '@/assets/assets-logo-full.svg?component';
+import { prefix } from '@/config/global';
+import { getActive } from '@/router';
+import { useSettingStore } from '@/store';
 import type { MenuRoute } from '@/types/interface';
 
+import MenuContent from './MenuContent.vue';
 import Notice from './Notice.vue';
 import Search from './Search.vue';
-import MenuContent from './MenuContent.vue';
 
 const props = defineProps({
   theme: {

src/layouts/components/LayoutContent.vue

@@ -16,6 +16,7 @@
         :key="`${routeItem.path}_${index}`"
         :value="routeItem.path"
         :removable="!routeItem.isHome"
+        :draggable="!routeItem.isHome"
       >
         <template #label>
           <t-dropdown
@@ -69,14 +70,15 @@
 </template>
 
 <script setup lang="ts">
-import { nextTick, ref, computed } from 'vue';
+import { computed, nextTick, ref } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
-import { useSettingStore, useTabsRouterStore } from '@/store';
+
 import { prefix } from '@/config/global';
+import { useSettingStore, useTabsRouterStore } from '@/store';
 import type { TRouterInfo } from '@/types/interface';
 
-import LContent from './Content.vue';
 import LBreadcrumb from './Breadcrumb.vue';
+import LContent from './Content.vue';
 import LFooter from './Footer.vue';
 
 const route = useRoute();

src/layouts/components/LayoutHeader.vue

@@ -11,9 +11,11 @@
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue';
 import { storeToRefs } from 'pinia';
+import { computed } from 'vue';
+
 import { usePermissionStore, useSettingStore } from '@/store';
+
 import LHeader from './Header.vue';
 
 const permissionStore = usePermissionStore();

src/layouts/components/LayoutSideNav.vue

@@ -11,10 +11,12 @@
 </template>
 
 <script setup lang="ts">
+import { storeToRefs } from 'pinia';
 import { computed } from 'vue';
 import { useRoute } from 'vue-router';
-import { storeToRefs } from 'pinia';
+
 import { usePermissionStore, useSettingStore } from '@/store';
+
 import LSideNav from './SideNav.vue';
 
 const route = useRoute();

src/layouts/components/MenuContent.vue

@@ -25,10 +25,11 @@
   </div>
 </template>
 <script setup lang="tsx">
-import { computed } from 'vue';
 import type { PropType } from 'vue';
-import type { MenuRoute } from '@/types/interface';
+import { computed } from 'vue';
+
 import { getActive } from '@/router';
+import type { MenuRoute } from '@/types/interface';
 
 type ListItemType = MenuRoute & { icon?: string };
 
@@ -38,7 +39,6 @@ const props = defineProps({
     default: () => [],
   },
 });
-
 const active = computed(() => getActive());
 
 const list = computed(() => {
@@ -85,9 +85,16 @@ const getHref = (item: MenuRoute) => {
 };
 
 const getPath = (item: ListItemType) => {
-  if (active.value.startsWith(item.path)) {
+  const activeLevel = active.value.split('/').length;
+  const pathLevel = item.path.split('/').length;
+  if (activeLevel > pathLevel && active.value.startsWith(item.path)) {
     return active.value;
   }
+
+  if (active.value === item.path) {
+    return active.value;
+  }
+
   return item.meta?.single ? item.redirect : item.path;
 };
 

src/layouts/components/Notice.vue

@@ -47,8 +47,9 @@
 </template>
 
 <script setup lang="ts">
-import { useRouter } from 'vue-router';
 import { storeToRefs } from 'pinia';
+import { useRouter } from 'vue-router';
+
 import { useNotificationStore } from '@/store';
 import type { NotificationItem } from '@/types/interface';
 

src/layouts/components/SideNav.vue

@@ -16,19 +16,19 @@
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted } from 'vue';
-import type { PropType } from 'vue';
-import { useRouter } from 'vue-router';
 import union from 'lodash/union';
+import type { PropType } from 'vue';
+import { computed, onMounted } from 'vue';
+import { useRouter } from 'vue-router';
 
-import { useSettingStore } from '@/store';
-import { prefix } from '@/config/global';
-import pgk from '../../../package.json';
-import type { MenuRoute } from '@/types/interface';
-import { getActive, getRoutesExpanded } from '@/router';
-
-import AssetLogo from '@/assets/assets-t-logo.svg?component';
 import AssetLogoFull from '@/assets/assets-logo-full.svg?component';
+import AssetLogo from '@/assets/assets-t-logo.svg?component';
+import { prefix } from '@/config/global';
+import { getActive, getRoutesExpanded } from '@/router';
+import { useSettingStore } from '@/store';
+import type { MenuRoute } from '@/types/interface';
+
+import pgk from '../../../package.json';
 import MenuContent from './MenuContent.vue';
 
 const MIN_POINT = 992 - 1;

src/layouts/frame/index.vue

@@ -6,9 +6,9 @@
   </div>
 </template>
 <script lang="ts">
-import { defineComponent, unref, computed } from 'vue';
-import FrameContent from '../components/FrameContent.vue';
+import { computed, defineComponent, unref } from 'vue';
 
+import FrameContent from '../components/FrameContent.vue';
 import { useFrameKeepAlive } from './useFrameKeepAlive';
 
 export default defineComponent({

src/layouts/frame/useFrameKeepAlive.ts

@@ -1,6 +1,7 @@
-import { computed, toRaw, unref } from 'vue';
 import uniqBy from 'lodash/uniqBy';
+import { computed, toRaw, unref } from 'vue';
 import { useRouter } from 'vue-router';
+
 import { useSettingStore, useTabsRouterStore } from '@/store';
 import type { MenuRoute } from '@/types/interface';
 

src/layouts/index.vue

@@ -24,19 +24,19 @@
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted, watch } from 'vue';
-import { storeToRefs } from 'pinia';
-import { useRoute } from 'vue-router';
-import { useSettingStore, useTabsRouterStore } from '@/store';
+import '@/style/layout.less';
 
-import SettingCom from './setting.vue';
-import LayoutHeader from './components/LayoutHeader.vue';
-import LayoutContent from './components/LayoutContent.vue';
-import LayoutSideNav from './components/LayoutSideNav.vue';
+import { storeToRefs } from 'pinia';
+import { computed, onMounted, watch } from 'vue';
+import { useRoute } from 'vue-router';
 
 import { prefix } from '@/config/global';
+import { useSettingStore, useTabsRouterStore } from '@/store';
 
-import '@/style/layout.less';
+import LayoutContent from './components/LayoutContent.vue';
+import LayoutHeader from './components/LayoutHeader.vue';
+import LayoutSideNav from './components/LayoutSideNav.vue';
+import SettingCom from './setting.vue';
 
 const route = useRoute();
 const settingStore = useSettingStore();

src/layouts/setting.vue

@@ -92,21 +92,19 @@
   </t-drawer>
 </template>
 <script setup lang="ts">
-import { ref, computed, onMounted, watchEffect } from 'vue';
-import { MessagePlugin } from 'tdesign-vue-next';
 import type { PopupVisibleChangeContext } from 'tdesign-vue-next';
+import { MessagePlugin } from 'tdesign-vue-next';
+import { computed, onMounted, ref, watchEffect } from 'vue';
 import useClipboard from 'vue-clipboard3';
 
-import { useSettingStore } from '@/store';
-import Thumbnail from '@/components/thumbnail/index.vue';
-import ColorContainer from '@/components/color/index.vue';
-
-import STYLE_CONFIG from '@/config/style';
-import { DEFAULT_COLOR_OPTIONS } from '@/config/color';
-
+import SettingAutoIcon from '@/assets/assets-setting-auto.svg';
 import SettingDarkIcon from '@/assets/assets-setting-dark.svg';
 import SettingLightIcon from '@/assets/assets-setting-light.svg';
-import SettingAutoIcon from '@/assets/assets-setting-auto.svg';
+import ColorContainer from '@/components/color/index.vue';
+import Thumbnail from '@/components/thumbnail/index.vue';
+import { DEFAULT_COLOR_OPTIONS } from '@/config/color';
+import STYLE_CONFIG from '@/config/style';
+import { useSettingStore } from '@/store';
 
 const settingStore = useSettingStore();
 

src/main.ts

@@ -1,12 +1,13 @@
-import { createApp } from 'vue';
-
-import TDesign from 'tdesign-vue-next';
 import 'tdesign-vue-next/es/style/index.css';
-import { store } from './store';
-import router from './router';
 import '@/style/index.less';
 import './permission';
+
+import TDesign from 'tdesign-vue-next';
+import { createApp } from 'vue';
+
 import App from './App.vue';
+import router from './router';
+import { store } from './store';
 
 const app = createApp(App);
 

src/pages/dashboard/base/components/MiddleChart.vue

@@ -35,17 +35,17 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted, watch, ref, onUnmounted, nextTick, computed, onDeactivated } from 'vue';
-
+import { LineChart, PieChart } from 'echarts/charts';
+import { GridComponent, LegendComponent, TooltipComponent } from 'echarts/components';
 import * as echarts from 'echarts/core';
-import { TooltipComponent, LegendComponent, GridComponent } from 'echarts/components';
-import { PieChart, LineChart } from 'echarts/charts';
 import { CanvasRenderer } from 'echarts/renderers';
-import { useSettingStore } from '@/store';
-import { LAST_7_DAYS } from '@/utils/date';
-import { changeChartsTheme } from '@/utils/color';
+import { computed, nextTick, onDeactivated, onMounted, onUnmounted, ref, watch } from 'vue';
 
-import { getPieChartDataSet, getLineChartDataSet } from '../index';
+import { useSettingStore } from '@/store';
+import { changeChartsTheme } from '@/utils/color';
+import { LAST_7_DAYS } from '@/utils/date';
+
+import { getLineChartDataSet, getPieChartDataSet } from '../index';
 
 echarts.use([TooltipComponent, LegendComponent, PieChart, GridComponent, LineChart, CanvasRenderer]);
 

src/pages/dashboard/base/components/OutputOverview.vue

@@ -67,18 +67,18 @@ export default {
 </script>
 
 <script setup lang="ts">
-import { onMounted, watch, ref, onUnmounted, nextTick, computed } from 'vue';
-
-import * as echarts from 'echarts/core';
-import { TooltipComponent, LegendComponent, GridComponent } from 'echarts/components';
 import { LineChart } from 'echarts/charts';
+import { GridComponent, LegendComponent, TooltipComponent } from 'echarts/components';
+import * as echarts from 'echarts/core';
 import { CanvasRenderer } from 'echarts/renderers';
-import { useSettingStore } from '@/store';
-import { LAST_7_DAYS } from '@/utils/date';
-import { changeChartsTheme } from '@/utils/color';
+import { computed, nextTick, onMounted, onUnmounted, ref, watch } from 'vue';
 
 // 导入样式
 import Trend from '@/components/trend/index.vue';
+import { useSettingStore } from '@/store';
+import { changeChartsTheme } from '@/utils/color';
+import { LAST_7_DAYS } from '@/utils/date';
+
 import { constructInitDataset } from '../index';
 
 echarts.use([TooltipComponent, LegendComponent, GridComponent, LineChart, CanvasRenderer]);

src/pages/dashboard/base/components/RankList.vue

@@ -55,7 +55,7 @@
 // 导入样式
 import Trend from '@/components/trend/index.vue';
 
-import { SALE_TEND_LIST, BUY_TEND_LIST, SALE_COLUMNS, BUY_COLUMNS } from '../constants';
+import { BUY_COLUMNS, BUY_TEND_LIST, SALE_COLUMNS, SALE_TEND_LIST } from '../constants';
 
 const rehandleClickOp = (val: MouseEvent) => {
   console.log(val);

src/pages/dashboard/base/components/TopPanel.vue

@@ -55,20 +55,19 @@ export default {
 </script>
 
 <script setup lang="ts">
-import { onMounted, watch, ref, onUnmounted, nextTick } from 'vue';
-
+import { BarChart, LineChart } from 'echarts/charts';
 import * as echarts from 'echarts/core';
-import { LineChart, BarChart } from 'echarts/charts';
 import { CanvasRenderer } from 'echarts/renderers';
-import { UsergroupIcon, FileIcon } from 'tdesign-icons-vue-next';
-import { useSettingStore } from '@/store';
-import { changeChartsTheme } from '@/utils/color';
+import { FileIcon, UsergroupIcon } from 'tdesign-icons-vue-next';
+import { nextTick, onMounted, onUnmounted, ref, watch } from 'vue';
 
 // 导入样式
 import Trend from '@/components/trend/index.vue';
-import { constructInitDashboardDataset } from '../index';
+import { useSettingStore } from '@/store';
+import { changeChartsTheme } from '@/utils/color';
 
 import { PANE_LIST } from '../constants';
+import { constructInitDashboardDataset } from '../index';
 
 echarts.use([LineChart, BarChart, CanvasRenderer]);
 

src/pages/dashboard/base/index.ts

@@ -1,7 +1,8 @@
 import dayjs from 'dayjs';
+
 import { TChartColor } from '@/config/color';
-import { getChartListColor } from '@/utils/color';
 import { getRandomArray } from '@/utils/charts';
+import { getChartListColor } from '@/utils/color';
 
 /** 首页 dashboard 折线图 */
 export function constructInitDashboardDataset(type: string) {

src/pages/dashboard/base/index.vue

@@ -18,10 +18,10 @@ export default {
 </script>
 
 <script setup lang="ts">
-import TopPanel from './components/TopPanel.vue';
 import MiddleChart from './components/MiddleChart.vue';
-import RankList from './components/RankList.vue';
 import OutputOverview from './components/OutputOverview.vue';
+import RankList from './components/RankList.vue';
+import TopPanel from './components/TopPanel.vue';
 </script>
 
 <style scoped>

src/pages/dashboard/detail/index.ts

@@ -1,7 +1,8 @@
 import dayjs from 'dayjs';
+
 import { TChartColor } from '@/config/color';
+import { getDateArray, getRandomArray } from '@/utils/charts';
 import { getChartListColor } from '@/utils/color';
-import { getRandomArray, getDateArray } from '@/utils/charts';
 
 /**
  * 散点图数据

src/pages/dashboard/detail/index.vue

@@ -65,21 +65,20 @@ export default {
 </script>
 
 <script setup lang="ts">
-import { nextTick, onMounted, onUnmounted, watch, computed, onDeactivated } from 'vue';
-
-import * as echarts from 'echarts/core';
-import { GridComponent, TooltipComponent, LegendComponent } from 'echarts/components';
 import { LineChart, ScatterChart } from 'echarts/charts';
+import { GridComponent, LegendComponent, TooltipComponent } from 'echarts/components';
+import * as echarts from 'echarts/core';
 import { CanvasRenderer } from 'echarts/renderers';
-import ProductCard from '@/components/product-card/index.vue';
+import { computed, nextTick, onDeactivated, onMounted, onUnmounted, watch } from 'vue';
 
-import { getFolderLineDataSet, getScatterDataSet } from './index';
-import { PANE_LIST_DATA, PRODUCT_LIST } from './constants';
-import { LAST_7_DAYS } from '@/utils/date';
+import ProductCard from '@/components/product-card/index.vue';
+import Trend from '@/components/trend/index.vue';
 import { useSettingStore } from '@/store';
 import { changeChartsTheme } from '@/utils/color';
+import { LAST_7_DAYS } from '@/utils/date';
 
-import Trend from '@/components/trend/index.vue';
+import { PANE_LIST_DATA, PRODUCT_LIST } from './constants';
+import { getFolderLineDataSet, getScatterDataSet } from './index';
 
 echarts.use([GridComponent, LegendComponent, TooltipComponent, LineChart, ScatterChart, CanvasRenderer]);
 

src/pages/detail/advanced/index.vue

@@ -125,12 +125,13 @@ export default {
 </script>
 
 <script setup lang="ts">
-import { ref, onMounted } from 'vue';
-import { prefix } from '@/config/global';
-import { BASE_INFO_DATA, TABLE_COLUMNS_DATA as columns, PRODUCT_LIST } from './constants';
+import { onMounted, ref } from 'vue';
+
 import { getPurchaseList } from '@/api/detail';
+import { prefix } from '@/config/global';
 
 import Product from './components/Product.vue';
+import { BASE_INFO_DATA, PRODUCT_LIST, TABLE_COLUMNS_DATA as columns } from './constants';
 
 const data = ref([]);
 const pagination = ref({

src/pages/detail/deploy/index.ts

@@ -1,6 +1,6 @@
 import { TChartColor } from '@/config/color';
+import { getDateArray, getRandomArray } from '@/utils/charts';
 import { getChartListColor } from '@/utils/color';
-import { getRandomArray, getDateArray } from '@/utils/charts';
 
 /** 平滑图数据 */
 export function getSmoothLineDataSet({

src/pages/detail/deploy/index.vue

@@ -77,20 +77,19 @@ export default {
 </script>
 
 <script setup lang="ts">
-import { onMounted, onUnmounted, ref, watch, computed } from 'vue';
-
-import * as echarts from 'echarts/core';
-import { TitleComponent, ToolboxComponent, TooltipComponent, GridComponent, LegendComponent } from 'echarts/components';
 import { BarChart, LineChart } from 'echarts/charts';
+import { GridComponent, LegendComponent, TitleComponent, ToolboxComponent, TooltipComponent } from 'echarts/components';
+import * as echarts from 'echarts/core';
 import { CanvasRenderer } from 'echarts/renderers';
-import { useSettingStore } from '@/store';
+import { computed, onMounted, onUnmounted, ref, watch } from 'vue';
 
-import { getSmoothLineDataSet, get2ColBarChartDataSet } from './index';
-import { BASE_INFO_DATA, TABLE_COLUMNS as columns } from './constants';
+import { getProjectList } from '@/api/detail';
+import { prefix } from '@/config/global';
+import { useSettingStore } from '@/store';
 import { changeChartsTheme } from '@/utils/color';
 
-import { prefix } from '@/config/global';
-import { getProjectList } from '@/api/detail';
+import { BASE_INFO_DATA, TABLE_COLUMNS as columns } from './constants';
+import { get2ColBarChartDataSet, getSmoothLineDataSet } from './index';
 
 echarts.use([
   TitleComponent,

src/pages/detail/secondary/index.vue

@@ -57,12 +57,13 @@ export default {
 </script>
 
 <script setup lang="ts">
-import { ref, computed } from 'vue';
 import { storeToRefs } from 'pinia';
-import { NOTIFICATION_TYPES } from '@/constants';
-import type { NotificationItem } from '@/types/interface';
+import { computed, ref } from 'vue';
+
 import EmptyIcon from '@/assets/assets-empty.svg?component';
+import { NOTIFICATION_TYPES } from '@/constants';
 import { useNotificationStore } from '@/store';
+import type { NotificationItem } from '@/types/interface';
 
 const TAB_LIST = [
   {

src/pages/form/base/index.vue

@@ -164,9 +164,10 @@ export default {
 </script>
 
 <script setup lang="ts">
-import { ref } from 'vue';
 import { MessagePlugin } from 'tdesign-vue-next';
-import { FORM_RULES, INITIAL_DATA, TYPE_OPTIONS, PARTY_A_OPTIONS, PARTY_B_OPTIONS } from './constants';
+import { ref } from 'vue';
+
+import { FORM_RULES, INITIAL_DATA, PARTY_A_OPTIONS, PARTY_B_OPTIONS, TYPE_OPTIONS } from './constants';
 
 const formData = ref({ ...INITIAL_DATA });
 

src/pages/form/step/index.vue

@@ -147,18 +147,18 @@ export default {
 </script>
 
 <script setup lang="ts">
-import { ref, computed } from 'vue';
+import { Data, SubmitContext } from 'tdesign-vue-next';
+import { computed, ref } from 'vue';
 import { useRouter } from 'vue-router';
-import { SubmitContext, Data } from 'tdesign-vue-next';
 
 import {
-  FORM_RULES,
-  NAME_OPTIONS,
-  TYPE_OPTIONS,
   ADDRESS_OPTIONS,
+  FORM_RULES,
   INITIAL_DATA1,
   INITIAL_DATA2,
   INITIAL_DATA3,
+  NAME_OPTIONS,
+  TYPE_OPTIONS,
 } from './constants';
 
 const formData1 = ref({ ...INITIAL_DATA1 });

src/pages/list/base/index.vue

@@ -74,16 +74,16 @@ export default {
 </script>
 
 <script setup lang="ts">
-import { ref, onMounted, computed } from 'vue';
-import { useRouter } from 'vue-router';
 import { SearchIcon } from 'tdesign-icons-vue-next';
 import { MessagePlugin } from 'tdesign-vue-next';
+import { computed, onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
 
-import { CONTRACT_STATUS, CONTRACT_TYPES, CONTRACT_PAYMENT_TYPES } from '@/constants';
-import Trend from '@/components/trend/index.vue';
 import { getList } from '@/api/list';
-import { useSettingStore } from '@/store';
+import Trend from '@/components/trend/index.vue';
 import { prefix } from '@/config/global';
+import { CONTRACT_PAYMENT_TYPES, CONTRACT_STATUS, CONTRACT_TYPES } from '@/constants';
+import { useSettingStore } from '@/store';
 
 import { COLUMNS } from './constants';
 

src/pages/list/card/components/DialogForm.vue

@@ -35,8 +35,8 @@
 </template>
 
 <script setup lang="ts">
+import { Data, FormRule, MessagePlugin, SubmitContext } from 'tdesign-vue-next';
 import { ref, watch } from 'vue';
-import { MessagePlugin, FormRule, SubmitContext, Data } from 'tdesign-vue-next';
 
 const INITIAL_DATA = {
   name: '',

src/pages/list/card/index.vue

@@ -68,12 +68,14 @@ export default {
 </script>
 
 <script setup lang="ts">
-import { ref, computed, onMounted } from 'vue';
 import { SearchIcon } from 'tdesign-icons-vue-next';
 import { MessagePlugin } from 'tdesign-vue-next';
-import ProductCard from '@/components/product-card/index.vue';
-import DialogForm from './components/DialogForm.vue';
+import { computed, onMounted, ref } from 'vue';
+
 import { getCardList } from '@/api/list';
+import ProductCard from '@/components/product-card/index.vue';
+
+import DialogForm from './components/DialogForm.vue';
 
 const INITIAL_DATA = {
   name: '',

src/pages/list/components/CommonTable.vue

@@ -105,20 +105,20 @@
   </div>
 </template>
 <script setup lang="ts">
-import { ref, computed, onMounted } from 'vue';
-import { MessagePlugin, PrimaryTableCol, TableRowData, PageInfo } from 'tdesign-vue-next';
-import Trend from '@/components/trend/index.vue';
-import { getList } from '@/api/list';
-import { useSettingStore } from '@/store';
-import { prefix } from '@/config/global';
+import { MessagePlugin, PageInfo, PrimaryTableCol, TableRowData } from 'tdesign-vue-next';
+import { computed, onMounted, ref } from 'vue';
 
+import { getList } from '@/api/list';
+import Trend from '@/components/trend/index.vue';
+import { prefix } from '@/config/global';
 import {
+  CONTRACT_PAYMENT_TYPES,
   CONTRACT_STATUS,
   CONTRACT_STATUS_OPTIONS,
-  CONTRACT_TYPES,
   CONTRACT_TYPE_OPTIONS,
-  CONTRACT_PAYMENT_TYPES,
+  CONTRACT_TYPES,
 } from '@/constants';
+import { useSettingStore } from '@/store';
 
 const store = useSettingStore();
 

src/pages/list/tree/index.vue

@@ -23,11 +23,11 @@ export default {
 </script>
 
 <script setup lang="ts">
-import { ref } from 'vue';
 import { SearchIcon } from 'tdesign-icons-vue-next';
+import { ref } from 'vue';
 
-import { TREE_DATA } from './constants';
 import CommonTable from '../components/CommonTable.vue';
+import { TREE_DATA } from './constants';
 
 const filterByText = ref();
 const filterText = ref();

src/pages/login/components/Login.vue

@@ -79,11 +79,12 @@
 </template>
 
 <script setup lang="ts">
+import QrcodeVue from 'qrcode.vue';
+import type { FormInstanceFunctions, FormRule } from 'tdesign-vue-next';
+import { MessagePlugin } from 'tdesign-vue-next';
 import { ref } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
-import QrcodeVue from 'qrcode.vue';
-import { MessagePlugin } from 'tdesign-vue-next';
-import type { FormInstanceFunctions, FormRule } from 'tdesign-vue-next';
+
 import { useCounter } from '@/hooks';
 import { useUserStore } from '@/store';
 

src/pages/login/components/Register.vue

@@ -71,8 +71,9 @@
 </template>
 
 <script setup lang="ts">
+import { FormRule, MessagePlugin } from 'tdesign-vue-next';
 import { ref } from 'vue';
-import { MessagePlugin, FormRule } from 'tdesign-vue-next';
+
 import { useCounter } from '@/hooks';
 
 const INITIAL_DATA = {

src/pages/login/index.vue

@@ -30,10 +30,11 @@ export default {
 <script setup lang="ts">
 import { ref } from 'vue';
 
+import TdesignSetting from '@/layouts/setting.vue';
+
+import LoginHeader from './components/Header.vue';
 import Login from './components/Login.vue';
 import Register from './components/Register.vue';
-import LoginHeader from './components/Header.vue';
-import TdesignSetting from '@/layouts/setting.vue';
 
 const type = ref('login');
 const switchType = (val: string) => {

src/pages/user/index.ts

@@ -1,6 +1,6 @@
 import { TChartColor } from '@/config/color';
+import { getDateArray, getRandomArray } from '@/utils/charts';
 import { getChartListColor } from '@/utils/color';
-import { getRandomArray, getDateArray } from '@/utils/charts';
 
 /** 折线图数据 */
 export function getFolderLineDataSet({

src/pages/user/index.vue

@@ -94,21 +94,22 @@ export default {
 };
 </script>
 <script setup lang="ts">
-import { nextTick, onMounted, onUnmounted, watch, computed } from 'vue';
-import * as echarts from 'echarts/core';
-import { GridComponent, TooltipComponent, LegendComponent } from 'echarts/components';
 import { LineChart } from 'echarts/charts';
+import { GridComponent, LegendComponent, TooltipComponent } from 'echarts/components';
+import * as echarts from 'echarts/core';
 import { CanvasRenderer } from 'echarts/renderers';
-import { useSettingStore } from '@/store';
+import { computed, nextTick, onMounted, onUnmounted, watch } from 'vue';
 
-import { LAST_7_DAYS } from '@/utils/date';
-import { USER_INFO_LIST, TEAM_MEMBERS, PRODUCT_LIST } from './constants';
-import { getFolderLineDataSet } from './index';
 import ProductAIcon from '@/assets/assets-product-1.svg';
 import ProductBIcon from '@/assets/assets-product-2.svg';
 import ProductCIcon from '@/assets/assets-product-3.svg';
 import ProductDIcon from '@/assets/assets-product-4.svg';
+import { useSettingStore } from '@/store';
 import { changeChartsTheme } from '@/utils/color';
+import { LAST_7_DAYS } from '@/utils/date';
+
+import { PRODUCT_LIST, TEAM_MEMBERS, USER_INFO_LIST } from './constants';
+import { getFolderLineDataSet } from './index';
 
 echarts.use([GridComponent, TooltipComponent, LineChart, CanvasRenderer, LegendComponent]);
 

src/permission.ts

@@ -1,10 +1,11 @@
-import { MessagePlugin } from 'tdesign-vue-next';
-import NProgress from 'nprogress'; // progress bar
 import 'nprogress/nprogress.css'; // progress bar style
 
+import NProgress from 'nprogress'; // progress bar
+import { MessagePlugin } from 'tdesign-vue-next';
 import { RouteRecordRaw } from 'vue-router';
-import { getPermissionStore, getUserStore } from '@/store';
+
 import router from '@/router';
+import { getPermissionStore, getUserStore } from '@/store';
 import { PAGE_NOT_FOUND_ROUTE } from '@/utils/route/constant';
 
 NProgress.configure({ showSpinner: false });

src/router/index.ts

@@ -1,5 +1,5 @@
-import { useRoute, createRouter, RouteRecordRaw, createWebHistory } from 'vue-router';
 import uniq from 'lodash/uniq';
+import { createRouter, createWebHistory, RouteRecordRaw, useRoute } from 'vue-router';
 
 const env = import.meta.env.MODE || 'development';
 

src/router/modules/homepage.ts

@@ -1,5 +1,6 @@
 import { DashboardIcon } from 'tdesign-icons-vue-next';
 import { shallowRef } from 'vue';
+
 import Layout from '@/layouts/index.vue';
 
 export default [

src/router/modules/user.ts

@@ -1,5 +1,6 @@
 import { LogoutIcon } from 'tdesign-icons-vue-next';
 import { shallowRef } from 'vue';
+
 import Layout from '@/layouts/index.vue';
 
 export default [

src/store/index.ts

@@ -8,8 +8,8 @@ export { store };
 
 export * from './modules/notification';
 export * from './modules/permission';
-export * from './modules/user';
 export * from './modules/setting';
 export * from './modules/tabs-router';
+export * from './modules/user';
 
 export default store;

src/store/modules/notification.ts

@@ -1,4 +1,5 @@
 import { defineStore } from 'pinia';
+
 import type { NotificationItem } from '@/types/interface';
 
 const msgData = [

src/store/modules/permission-fe.ts

@@ -3,6 +3,7 @@
 
 import { defineStore } from 'pinia';
 import { RouteRecordRaw } from 'vue-router';
+
 import router, { allRoutes } from '@/router';
 import { store } from '@/store';
 

src/store/modules/permission.ts

@@ -1,9 +1,10 @@
 import { defineStore } from 'pinia';
 import { RouteRecordRaw } from 'vue-router';
-import router, { fixedRouterList, homepageRouterList } from '@/router';
-import { store } from '@/store';
+
 import { RouteItem } from '@/api/model/permissionModel';
 import { getMenuList } from '@/api/permission';
+import router, { fixedRouterList, homepageRouterList } from '@/router';
+import { store } from '@/store';
 import { transformObjectToRoute } from '@/utils/route';
 
 export const usePermissionStore = defineStore('permission', {

src/store/modules/setting.ts

@@ -1,10 +1,11 @@
+import keys from 'lodash/keys';
 import { defineStore } from 'pinia';
 import { Color } from 'tvision-color';
-import keys from 'lodash/keys';
-import { LIGHT_CHART_COLORS, DARK_CHART_COLORS } from '@/config/color';
-import { insertThemeStylesheet, generateColorMap } from '@/utils/color';
+
+import { DARK_CHART_COLORS, LIGHT_CHART_COLORS } from '@/config/color';
 import STYLE_CONFIG from '@/config/style';
 import { store } from '@/store';
+import { generateColorMap, insertThemeStylesheet } from '@/utils/color';
 
 const state = {
   ...STYLE_CONFIG,

src/store/modules/tabs-router.ts

@@ -1,6 +1,7 @@
 import { defineStore } from 'pinia';
-import type { TRouterInfo, TTabRouterType } from '@/types/interface';
+
 import { store } from '@/store';
+import type { TRouterInfo, TTabRouterType } from '@/types/interface';
 
 const homeRoute: Array<TRouterInfo> = [
   {

src/store/modules/user.ts

@@ -1,4 +1,5 @@
 import { defineStore } from 'pinia';
+
 import { TOKEN_NAME } from '@/config/global';
 import { store, usePermissionStore } from '@/store';
 

src/types/interface.d.ts

@@ -1,4 +1,5 @@
-import { RouteRecordName, LocationQueryRaw } from 'vue-router';
+import { LocationQueryRaw, RouteRecordName } from 'vue-router';
+
 import STYLE_CONFIG from '@/config/style';
 
 export interface MenuRoute {

src/utils/color.ts

@@ -1,6 +1,7 @@
-import { Color } from 'tvision-color';
 import * as echarts from 'echarts/core';
 import trim from 'lodash/trim';
+import { Color } from 'tvision-color';
+
 import { TColorToken } from '@/config/color';
 
 /**

src/utils/request/Axios.ts

@@ -1,11 +1,13 @@
-import axios, { AxiosRequestConfig, InternalAxiosRequestConfig, AxiosInstance, AxiosResponse, AxiosError } from 'axios';
-import { stringify } from 'qs';
-import isFunction from 'lodash/isFunction';
+import axios, { AxiosError, AxiosInstance, AxiosRequestConfig, AxiosResponse, InternalAxiosRequestConfig } from 'axios';
 import cloneDeep from 'lodash/cloneDeep';
-import { CreateAxiosOptions } from './AxiosTransform';
-import { AxiosCanceler } from './AxiosCancel';
-import { AxiosRequestConfigRetry, RequestOptions, Result } from '@/types/axios';
+import isFunction from 'lodash/isFunction';
+import { stringify } from 'qs';
+
 import { ContentTypeEnum } from '@/constants';
+import { AxiosRequestConfigRetry, RequestOptions, Result } from '@/types/axios';
+
+import { AxiosCanceler } from './AxiosCancel';
+import { CreateAxiosOptions } from './AxiosTransform';
 
 // Axios模块
 export class VAxios {
@@ -93,7 +95,7 @@ export class VAxios {
 
     // 响应错误处理
     if (responseInterceptorsCatch && isFunction(responseInterceptorsCatch)) {
-      this.instance.interceptors.response.use(undefined, responseInterceptorsCatch);
+      this.instance.interceptors.response.use(undefined, (error) => responseInterceptorsCatch(error, this.instance));
     }
   }
 

src/utils/request/AxiosTransform.ts

@@ -1,5 +1,6 @@
-import type { AxiosRequestConfig, InternalAxiosRequestConfig, AxiosResponse } from 'axios';
+import type { AxiosInstance, AxiosRequestConfig, AxiosResponse, InternalAxiosRequestConfig } from 'axios';
 import { AxiosError } from 'axios';
+
 import type { RequestOptions, Result } from '@/types/axios';
 
 // 创建Axios选项
@@ -33,5 +34,5 @@ export abstract class AxiosTransform {
   requestInterceptorsCatch?: (error: AxiosError) => void;
 
   // 请求后的拦截器错误处理
-  responseInterceptorsCatch?: (error: AxiosError) => void;
+  responseInterceptorsCatch?: (error: AxiosError, instance: AxiosInstance) => void;
 }

src/utils/request/index.ts

@@ -1,13 +1,15 @@
 // axios配置  可自行根据项目进行更改，只需更改该文件即可，其他文件可以不动
+import type { AxiosInstance, InternalAxiosRequestConfig } from 'axios';
 import isString from 'lodash/isString';
 import merge from 'lodash/merge';
-import type { InternalAxiosRequestConfig } from 'axios';
-import type { AxiosTransform, CreateAxiosOptions } from './AxiosTransform';
-import { VAxios } from './Axios';
-import { joinTimestamp, formatRequestDate, setObjToUrlParams } from './utils';
+
 import { TOKEN_NAME } from '@/config/global';
 import { ContentTypeEnum } from '@/constants';
 
+import { VAxios } from './Axios';
+import type { AxiosTransform, CreateAxiosOptions } from './AxiosTransform';
+import { formatRequestDate, joinTimestamp, setObjToUrlParams } from './utils';
+
 const env = import.meta.env.MODE || 'development';
 
 // 如果是mock模式 或 没启用直连代理 就不配置host 会走本地Mock拦截 或 Vite 代理
@@ -127,7 +129,7 @@ const transform: AxiosTransform = {
   },
 
   // 响应错误处理
-  responseInterceptorsCatch: (error: any) => {
+  responseInterceptorsCatch: (error: any, instance: AxiosInstance) => {
     const { config } = error;
     if (!config || !config.requestOptions.retry) return Promise.reject(error);
 
@@ -143,7 +145,7 @@ const transform: AxiosTransform = {
       }, config.requestOptions.retry.delay || 1);
     });
     config.headers = { ...config.headers, 'Content-Type': ContentTypeEnum.Json };
-    return backoff.then((config) => request.request(config));
+    return backoff.then((config) => instance.request(config));
   },
 };
 

src/utils/request/utils.ts

@@ -1,5 +1,5 @@
-import isString from 'lodash/isString';
 import isObject from 'lodash/isObject';
+import isString from 'lodash/isString';
 
 const DATE_TIME_FORMAT = 'YYYY-MM-DD HH:mm:ss';
 

src/utils/route/index.ts

@@ -1,13 +1,14 @@
 import cloneDeep from 'lodash/cloneDeep';
 import { shallowRef } from 'vue';
+
 import { RouteItem, RouteMeta } from '@/api/model/permissionModel';
 import {
   BLANK_LAYOUT,
-  LAYOUT,
-  IFRAME,
   EXCEPTION_COMPONENT,
-  PARENT_LAYOUT,
+  IFRAME,
+  LAYOUT,
   PAGE_NOT_FOUND_ROUTE,
+  PARENT_LAYOUT,
 } from '@/utils/route/constant';
 
 // vite 3+ support dynamic import from node_modules

vite.config.ts

@@ -1,10 +1,9 @@
-import { ConfigEnv, UserConfig, loadEnv } from 'vite';
-import { viteMockServe } from 'vite-plugin-mock';
 import vue from '@vitejs/plugin-vue';
 import vueJsx from '@vitejs/plugin-vue-jsx';
-import svgLoader from 'vite-svg-loader';
-
 import path from 'path';
+import { ConfigEnv, loadEnv, UserConfig } from 'vite';
+import { viteMockServe } from 'vite-plugin-mock';
+import svgLoader from 'vite-svg-loader';
 
 const CWD = process.cwd();