fix: #113 (#116 )

* fix(slot): 优化部分slot写法,减少手动判断 * fix(slot): 优化部分slot写法,减少手动判断 * feat(table): 添加vxe-table,适配naiveui主题,并替换掉之前table,自带导出 * feat(table): 添加vxe-table,适配naiveui主题,并替换掉之前table,自带导出 * fix: 完善table总条数不显示问题
feat(table): 添加vxe-table,适配naiveui主题,并替换掉之前table,自带导出 (#105 )
2025-12-28 04:00:22 +08:00 · 2025-03-19 09:15:41 +08:00 · 2024-11-22 15:47:29 +08:00 · 2024-11-13 11:05:03 +08:00 · 2024-10-29 15:14:04 +08:00 · 2024-10-22 15:27:46 +08:00
96 changed files with 7992 additions and 3665 deletions
--- a/.editorconfig
+++ b/.editorconfig
@@ -0,0 +1,9 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = unset
+insert_final_newline = true
+trim_trailing_whitespace = true
--- a/.eslint-global-variables.json
+++ b/.eslint-global-variables.json
@@ -1,63 +0,0 @@
-{
-  "globals": {
-    "$loadingBar": true,
-    "$message": true,
-    "$dialog": true,
-    "$notification": true,
-    "$modal": true,
-    "defineOptions": true,
-    "EffectScope": true,
-    "computed": true,
-    "createApp": true,
-    "customRef": true,
-    "defineAsyncComponent": true,
-    "defineComponent": true,
-    "effectScope": true,
-    "getCurrentInstance": true,
-    "getCurrentScope": true,
-    "h": true,
-    "inject": true,
-    "isProxy": true,
-    "isReactive": true,
-    "isReadonly": true,
-    "isRef": true,
-    "markRaw": true,
-    "nextTick": true,
-    "onActivated": true,
-    "onBeforeMount": true,
-    "onBeforeUnmount": true,
-    "onBeforeUpdate": true,
-    "onDeactivated": true,
-    "onErrorCaptured": true,
-    "onMounted": true,
-    "onRenderTracked": true,
-    "onRenderTriggered": true,
-    "onScopeDispose": true,
-    "onServerPrefetch": true,
-    "onUnmounted": true,
-    "onUpdated": true,
-    "provide": true,
-    "reactive": true,
-    "readonly": true,
-    "ref": true,
-    "resolveComponent": true,
-    "shallowReactive": true,
-    "shallowReadonly": true,
-    "shallowRef": true,
-    "toRaw": true,
-    "toRef": true,
-    "toRefs": true,
-    "triggerRef": true,
-    "unref": true,
-    "useAttrs": true,
-    "useCssModule": true,
-    "useCssVars": true,
-    "useRoute": true,
-    "useRouter": true,
-    "useSlots": true,
-    "watch": true,
-    "watchEffect": true,
-    "watchPostEffect": true,
-    "watchSyncEffect": true
-  }
-}
--- a/.eslintignore
+++ b/.eslintignore
@@ -1,4 +0,0 @@
-node_modules
-dist
-public
-package.json
--- a/.npmrc
+++ b/.npmrc
@@ -1,2 +1,3 @@
 registry=https://registry.npmmirror.com
-shamefully-hoist=true
+shamefully-hoist=true
+strict-peer-dependencies=false
--- a/.prettierignore
+++ b/.prettierignore
@@ -1,3 +0,0 @@
-/node_modules/**
-/dist/*
-/public/*
--- a/.prettierrc.json
+++ b/.prettierrc.json
@@ -1,7 +0,0 @@
-{
-  "printWidth": 100,
-  "singleQuote": true,
-  "semi": false,
-  "endOfLine": "auto",
-  "htmlWhitespaceSensitivity": "ignore"
-}
--- a/.vscode/extensions.json
+++ b/.vscode/extensions.json
@@ -6,6 +6,7 @@
    "dbaeumer.vscode-eslint",
    "esbenp.prettier-vscode",
    "sdras.vue-vscode-snippets",
-    "mikestead.dotenv"
+    "mikestead.dotenv",
+    "simonhe.common-intellisense"
  ]
 }
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -1,25 +1,31 @@
 {
-  "files.eol": "\n",
-  "files.associations": {
-    "*.env.*": "dotenv",
-    "*.svg": "html",
-    "*.css": "scss"
+  "prettier.enable": false,
+  "editor.formatOnSave": false,
+
+  // Auto fix
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": "explicit",
+    "source.organizeImports": "never"
  },

-  "editor.formatOnSave": false,
-  "[html][css][less][scss][sass][yaml][yml][jsonc][json]": {
-    "editor.formatOnSave": true,
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
-  },
-  "[markdown]": {
-    "editor.formatOnSave": true,
-    "editor.defaultFormatter": "yzhang.markdown-all-in-one"
-  },
-  "editor.codeActionsOnSave": {
-    "source.fixAll.eslint": "explicit"
-  },
-  "eslint.validate": ["javascript", "typescript", "javascriptreact", "typescriptreact", "vue"],
-  "eslint.options": {
-    "overrideConfigFile": "package.json"
+  // Enable eslint for all supported languages
+  "eslint.validate": [
+    "javascript",
+    "javascriptreact",
+    "typescript",
+    "typescriptreact",
+    "vue",
+    "html",
+    "markdown",
+    "json",
+    "jsonc"
+  ],
+  "common-intellisense.ui": [
+    "naiveUi2"
+  ],
+  "workbench.colorCustomizations": {
+    "activityBar.background": "#233212",
+    "titleBar.activeBackground": "#314619",
+    "titleBar.activeForeground": "#F9FCF6"
  }
 }
--- a/README.md
+++ b/README.md
@@ -8,6 +8,7 @@
 </p>

 ## 简介
+
 Vue Naive Admin 是一款极简风格的后台管理模板，包含前后端解决方案，前端使用 Vite + Vue3 + Pinia + Unocss，后端使用 Nestjs + TypeOrm + MySql，简单易用，赏心悦目，历经十几次重构和细节打磨，诚意满满！！

 ## 设计理念
@@ -51,17 +52,22 @@ Vue Naive Admin 提供一套后端代码，技术栈使用 Nestjs + TypeOrm + My
 - 源码-github: [isme-nest-serve | github](https://github.com/zclzone/isme-nest-serve)
 - 源码-gitee: [isme-nest-serve | gitee](https://gitee.com/isme-admin/isme-nest-serve)

-
 ## 文档
-  
- 项目文档: [docs | vue-naive-admin](https://docs.isme.top/web/#/624306705/188522224)
+
+- 项目文档: [docs | vue-naive-admin](https://isme.top)
 - 接口文档: [apidoc | isme-nest-serve](https://apifox.com/apidoc/shared-ff4a4d32-c0d1-4caf-b0ee-6abc130f734a)

-> 注：有个比较常见的问题，就是如何添加菜单和修改菜单，由于项目是由后端控制菜单资源的，所以需要对接后端后在资源管理功能对菜单进行增删改，然后在角色管理功能给对应角色进行授权。具体如何对接后端，请参考 [项目文档](https://docs.isme.top/web/#/624306705/188522224)。当然，可能有些菜单你不想通过权限控制，那么你可以在 `/src/settings.js` 文件添加 basePermissions，只需对齐菜单资源的结构即可，结构可以参照 [接口文档](https://apifox.com/apidoc/shared-ff4a4d32-c0d1-4caf-b0ee-6abc130f734a/api-134536978)。
+> 注：有个比较常见的问题，就是如何添加菜单和修改菜单，由于项目是由后端控制菜单资源的，所以需要对接后端后在资源管理功能对菜单进行增删改，然后在角色管理功能给对应角色进行授权。具体如何对接后端，请参考 [项目文档](https://isme.top)。当然，可能有些菜单你不想通过权限控制，那么你可以在 `/src/settings.js` 文件添加 basePermissions，只需对齐菜单资源的结构即可，结构可以参照 [接口文档](https://apifox.com/apidoc/shared-ff4a4d32-c0d1-4caf-b0ee-6abc130f734a/api-134536978)。

-## 使用这个模板创建 Github 仓库
+## 使用这个模板开始你的项目

-[使用这个模板创建仓库](https://github.com/zclzone/vue-naive-admin/generate).
+[使用这个模板创建Github仓库](https://github.com/zclzone/vue-naive-admin/generate).
+
+或者使用 `degit` 克隆此仓库，这样将没有任何历史提交记录：
+
+```cmd
+npx degit zclzone/vue-naive-admin
+```

 ## 版权说明

@@ -75,10 +81,8 @@ Vue Naive Admin 提供一套后端代码，技术栈使用 Nestjs + TypeOrm + My

 - [isme-java-serve](https://github.com/DHBin/isme-java-serve): 一个轻量级的Java后端服务，基于SpringBoot、MybatisPlus、SaToken、MapStruct等实现，已对接 Vue Naive Admin 2.0。
 - [naive-admin-go](https://github.com/ituserxxx/naive-admin-go): 一个 Go 后端服务，基于 gin、gorm、mysql、jwt和session，已对接 Vue Naive Admin 2.0。
+- [isme-java](https://github.com/AllenDengMs/isme-java): 一个轻量且完成度高的Java后端服务，基于Springboot 3 + JDK21，层次结构严谨，注释齐全，避免过度封装，代码可读性度高，依赖最简化，上手成本低，已集成 账号管理、权限管理、API鉴权、消息国际化等功能。

-## 入群交流
-
-添加微信，拉你进群
-
-![](https://static.isme.top/image/coder_wx.jpg)
+## 联系作者 or 进交流群

+[https://www.isme.top/contact.html](https://www.isme.top/contact.html)
--- a/build/index.js
+++ b/build/index.js
@@ -6,9 +6,9 @@
 * Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
 **********************************/

+import path from 'node:path'
 import { globSync } from 'glob'
-import path from 'path'
-import dynamicIcons from '../src/assets/icons/dynamic-icons'
+import dynamicIcons from '../src/assets/icons/dynamic-icons.js'

 /**
 * @usage 生成icons, 用于 unocss safelist，以支持页面动态渲染自定义图标
@@ -35,5 +35,5 @@ export function getIcons() {
 */
 export function getPagePathes() {
  const files = globSync('src/views/**/*.vue')
-  return files.map((item) => '/' + path.normalize(item).replace(/\\/g, '/'))
+  return files.map(item => `/${path.normalize(item).replace(/\\/g, '/')}`)
 }
--- a/build/plugin-isme/icons.js
+++ b/build/plugin-isme/icons.js
@@ -13,10 +13,11 @@ export function pluginIcons() {
  return {
    name: 'isme:icons',
    resolveId(id) {
-      if (id === PLUGIN_ICONS_ID) return '\0' + PLUGIN_ICONS_ID
+      if (id === PLUGIN_ICONS_ID)
+        return `\0${PLUGIN_ICONS_ID}`
    },
    load(id) {
-      if (id === '\0' + PLUGIN_ICONS_ID) {
+      if (id === `\0${PLUGIN_ICONS_ID}`) {
        return `export default ${JSON.stringify(getIcons())}`
      }
    },
--- a/build/plugin-isme/index.js
+++ b/build/plugin-isme/index.js
@@ -6,5 +6,5 @@
 * Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
 **********************************/

-export { pluginPagePathes } from './page-pathes'
 export { pluginIcons } from './icons'
+export { pluginPagePathes } from './page-pathes'
--- a/build/plugin-isme/page-pathes.js
+++ b/build/plugin-isme/page-pathes.js
@@ -13,10 +13,11 @@ export function pluginPagePathes() {
  return {
    name: 'isme:page-pathes',
    resolveId(id) {
-      if (id === PLUGIN_PAGE_PATHES_ID) return '\0' + PLUGIN_PAGE_PATHES_ID
+      if (id === PLUGIN_PAGE_PATHES_ID)
+        return `\0${PLUGIN_PAGE_PATHES_ID}`
    },
    load(id) {
-      if (id === '\0' + PLUGIN_PAGE_PATHES_ID) {
+      if (id === `\0${PLUGIN_PAGE_PATHES_ID}`) {
        return `export default ${JSON.stringify(getPagePathes())}`
      }
    },
--- a/eslint.config.js
+++ b/eslint.config.js
@@ -0,0 +1,34 @@
+import antfu from '@antfu/eslint-config'
+
+export default antfu({
+  unocss: true,
+  formatters: true,
+  stylistic: true,
+  rules: {
+    'n/prefer-global/process': 'off',
+    'no-undef': 'error',
+    'no-fallthrough': 'off',
+    'vue/block-order': 'off',
+    '@typescript-eslint/no-this-alias': 'off',
+    'prefer-promise-reject-errors': 'off',
+  },
+  languageOptions: {
+    globals: {
+      h: 'readonly',
+      unref: 'readonly',
+      provide: 'readonly',
+      inject: 'readonly',
+      markRaw: 'readonly',
+      defineAsyncComponent: 'readonly',
+      nextTick: 'readonly',
+      useRoute: 'readonly',
+      useRouter: 'readonly',
+      Message: 'readonly',
+      $loadingBar: 'readonly',
+      $message: 'readonly',
+      $dialog: 'readonly',
+      $notification: 'readonly',
+      $modal: 'readonly',
+    },
+  },
+})
--- a/index.html
+++ b/index.html
@@ -1,10 +1,9 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="icon" href="/favicon.png" />
-    <link rel="stylesheet" href="/resource/loading.css" />
    <title>%VITE_TITLE%</title>
    <style>
      .loading-container {
--- a/package.json
+++ b/package.json
@@ -1,58 +1,63 @@
 {
  "name": "vue-naive-admin",
-  "private": true,
-  "version": "2.0.0",
  "type": "module",
+  "version": "2.0.0",
+  "private": true,
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview",
-    "lint:fix": "eslint --fix --ext .js,.vue ."
+    "lint:fix": "eslint --fix",
+    "postinstall": "npx simple-git-hooks",
+    "up": "taze major -I"
  },
  "dependencies": {
    "@arco-design/color": "^0.4.0",
-    "@vueuse/core": "^10.9.0",
-    "axios": "^1.6.8",
-    "dayjs": "^1.11.11",
-    "echarts": "^5.5.0",
+    "@vueuse/core": "^11.1.0",
+    "axios": "^1.7.7",
+    "dayjs": "^1.11.13",
+    "echarts": "^5.5.1",
+    "exceljs": "^4.4.0",
    "lodash-es": "^4.17.21",
-    "naive-ui": "^2.38.2",
-    "pinia": "^2.1.7",
-    "pinia-plugin-persistedstate": "^3.2.1",
-    "vue": "^3.4.27",
-    "vue-echarts": "^6.7.2",
-    "vue-router": "^4.3.2",
+    "naive-ui": "^2.40.1",
+    "pinia": "^2.2.4",
+    "pinia-plugin-persistedstate": "^4.1.1",
+    "vue": "^3.5.12",
+    "vue-echarts": "^7.0.3",
+    "vue-router": "^4.4.5",
+    "vxe-pc-ui": "4.2.5",
+    "vxe-table": "4.8.13",
+    "vxe-table-plugin-export-xlsx": "^4.0.4",
    "xlsx": "^0.18.5"
  },
  "devDependencies": {
-    "@iconify/json": "^2.2.210",
-    "@iconify/utils": "^2.1.23",
-    "@unocss/eslint-config": "^0.58.9",
-    "@unocss/preset-rem-to-px": "^0.59.4",
-    "@vitejs/plugin-vue": "^5.0.4",
-    "@zclzone/eslint-config": "^0.0.5",
-    "esno": "^4.7.0",
+    "@antfu/eslint-config": "^3.8.0",
+    "@iconify/json": "^2.2.262",
+    "@unocss/eslint-config": "^0.63.6",
+    "@unocss/eslint-plugin": "^0.63.6",
+    "@unocss/preset-rem-to-px": "^0.63.6",
+    "@vitejs/plugin-vue": "^5.1.4",
+    "@vitejs/plugin-vue-jsx": "^4.0.1",
+    "eslint": "^9.13.0",
+    "eslint-plugin-format": "^0.1.2",
+    "esno": "^4.8.0",
    "fs-extra": "^11.2.0",
-    "glob": "^10.3.15",
+    "glob": "^11.0.0",
+    "lint-staged": "^15.2.10",
    "rollup-plugin-visualizer": "^5.12.0",
-    "sass": "^1.77.1",
-    "unocss": "^0.59.4",
-    "unplugin-auto-import": "^0.17.6",
-    "unplugin-vue-components": "^0.26.0",
-    "vite": "^5.2.11",
+    "simple-git-hooks": "^2.11.1",
+    "taze": "^0.17.2",
+    "unocss": "^0.63.6",
+    "unplugin-auto-import": "^0.18.3",
+    "unplugin-vue-components": "^0.27.4",
+    "vite": "^5.4.9",
    "vite-plugin-router-warn": "^1.0.0",
-    "vite-plugin-vue-devtools": "^7.2.0"
+    "vite-plugin-vue-devtools": "^7.5.2"
  },
-  "eslintConfig": {
-    "extends": [
-      "@zclzone",
-      "@unocss",
-      ".eslint-global-variables.json"
-    ],
-    "parserOptions": {
-      "ecmaFeatures": {
-        "jsx": true
-      }
-    }
+  "simple-git-hooks": {
+    "pre-commit": "pnpm lint-staged"
+  },
+  "lint-staged": {
+    "*": "eslint --fix"
  }
 }
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/src/App.vue
+++ b/src/App.vue
@@ -16,25 +16,29 @@
  >
    <router-view v-if="Layout" v-slot="{ Component, route: curRoute }">
      <component :is="Layout">
-        <KeepAlive :include="keepAliveNames">
-          <component :is="Component" v-if="!tabStore.reloading" :key="curRoute.fullPath" />
-        </KeepAlive>
+        <transition name="fade-slide" mode="out-in" appear>
+          <KeepAlive :include="keepAliveNames">
+            <component :is="Component" v-if="!tabStore.reloading" :key="curRoute.fullPath" />
+          </KeepAlive>
+        </transition>
      </component>

-      <LayoutSetting class="fixed right-12 top-1/2 z-999" />
+      <LayoutSetting v-if="layoutSettingVisible" class="fixed right-12 top-1/2 z-999" />
    </router-view>
  </n-config-provider>
 </template>

 <script setup>
-import { zhCN, dateZhCN, darkTheme } from 'naive-ui'
 import { LayoutSetting } from '@/components'
 import { useAppStore, useTabStore } from '@/store'
+import { darkTheme, dateZhCN, zhCN } from 'naive-ui'
+import { layoutSettingVisible } from './settings'

 const layouts = new Map()
 function getLayout(name) {
  // 利用map将加载过的layout缓存起来，防止重新加载layout导致页面闪烁
-  if (layouts.get(name)) return layouts.get(name)
+  if (layouts.get(name))
+    return layouts.get(name)
  const layout = markRaw(defineAsyncComponent(() => import(`@/layouts/${name}/index.vue`)))
  layouts.set(name, layout)
  return layout
@@ -42,15 +46,17 @@ function getLayout(name) {

 const route = useRoute()
 const appStore = useAppStore()
-if (appStore.layout === 'default') appStore.setLayout('')
+if (appStore.layout === 'default')
+  appStore.setLayout('')
 const Layout = computed(() => {
-  if (!route.matched?.length) return null
+  if (!route.matched?.length)
+    return null
  return getLayout(route.meta?.layout || appStore.layout)
 })

 const tabStore = useTabStore()
 const keepAliveNames = computed(() => {
-  return tabStore.tabs.filter((item) => item.keepAlive).map((item) => item.name)
+  return tabStore.tabs.filter(item => item.keepAlive).map(item => item.name)
 })

 watchEffect(() => {
--- a/src/api/index.js
+++ b/src/api/index.js
@@ -14,11 +14,11 @@ export default {
  // 刷新token
  refreshToken: () => request.get('/auth/refresh/token'),
  // 登出
-  logout: () => request.post('/auth/logout'),
+  logout: () => request.post('/auth/logout', {}, { needTip: false }),
  // 切换当前角色
-  switchCurrentRole: (role) => request.post(`/auth/current-role/switch/${role}`),
+  switchCurrentRole: role => request.post(`/auth/current-role/switch/${role}`),
  // 获取角色权限
  getRolePermissions: () => request.get('/role/permissions/tree'),
  // 验证菜单路径
-  validateMenuPath: (path) => request.get(`/permission/menu/validate?path=${path}`),
+  validateMenuPath: path => request.get(`/permission/menu/validate?path=${path}`),
 }
--- a/src/components/common/AppPage.vue
+++ b/src/components/common/AppPage.vue
@@ -8,11 +8,12 @@

 <template>
  <main class="cus-scroll h-full flex-col flex-1 bg-#f5f6fb dark:bg-#121212">
-    <transition name="fade-slide" mode="out-in" appear>
-      <main :class="{ 'flex-1': full }" class="m-12"><slot /></main>
-    </transition>
-    <slot v-if="$slots.footer" name="footer" />
-    <TheFooter v-else-if="showFooter" class="mb-12 mt-auto" />
+    <main :class="{ 'flex-1': full }" class="m-12">
+      <slot />
+    </main>
+    <slot name="footer">
+      <TheFooter v-if="showFooter" class="mb-12 mt-auto" />
+    </slot>
    <n-back-top :bottom="20" />
  </main>
 </template>
--- a/src/components/common/CommonPage.vue
+++ b/src/components/common/CommonPage.vue
@@ -7,18 +7,17 @@
 --------------------------------->

 <template>
-  <main class="h-full flex-1 overflow-hidden bg-#f5f6fb dark:bg-#121212">
-    <div class="h-full flex-col">
-      <AppCard
-        v-if="showHeader"
-        class="sticky top-0 z-1 min-h-60 flex items-center justify-between px-24"
-        border-b="1px solid light_border dark:dark_border"
-      >
-        <slot v-if="$slots.header" name="header" />
-        <template v-else>
-          <div class="flex items-center">
-            <slot v-if="$slots['title-prefix']" name="title-prefix" />
-            <template v-else-if="back">
+  <main class="h-full flex-col flex-1 overflow-hidden bg-#f5f6fb dark:bg-#121212">
+    <AppCard
+      v-if="showHeader"
+      class="sticky top-0 z-1 min-h-60 flex items-center justify-between px-24"
+      border-b="1px solid light_border dark:dark_border"
+    >
+      <slot v-if="$slots.header" name="header" />
+      <template v-else>
+        <div class="flex items-center">
+          <slot name="title-prefix">
+            <template v-if="back">
              <div
                class="mr-16 flex cursor-pointer items-center text-16 opacity-60 transition-all-300 hover:opacity-40"
                @click="router.back()"
@@ -27,27 +26,27 @@
                <span class="ml-4">返回</span>
              </div>
            </template>
-            <div class="mr-12 h-16 w-4 rounded-l-2 bg-primary"></div>
-            <h2 class="font-normal">{{ title ?? route.meta?.title }}</h2>
-            <slot name="title-suffix" />
-          </div>
-          <slot name="action" />
-        </template>
-      </AppCard>
-      <transition name="fade-slide" mode="out-in" appear>
-        <AppCard class="cus-scroll m-12 h-0 flex-1 rounded-8 p-24" bordered>
-          <slot />
-        </AppCard>
-      </transition>
-    </div>
-  </main>
+          </slot>

-  <footer class="bg-#f5f6fb dark:bg-#121212">
-    <slot v-if="$slots.footer" name="footer" />
-    <AppCard v-else-if="showFooter" class="py-12">
-      <TheFooter />
+          <div class="mr-12 h-16 w-4 rounded-l-2 bg-primary" />
+          <h2 class="font-normal">
+            {{ title ?? route.meta?.title }}
+          </h2>
+          <slot name="title-suffix" />
+        </div>
+        <slot name="action" />
+      </template>
    </AppCard>
-  </footer>
+    <AppCard class="cus-scroll m-12 h-0 flex-1 rounded-8 p-24" bordered>
+      <slot />
+    </AppCard>
+
+    <slot name="footer">
+      <AppCard v-if="showFooter" class="flex-shrink-0 py-12">
+        <TheFooter />
+      </AppCard>
+    </slot>
+  </main>
 </template>

 <script setup>
--- a/src/components/common/LayoutSetting.vue
+++ b/src/components/common/LayoutSetting.vue
@@ -94,8 +94,8 @@

 <script setup>
 import { MeModal } from '@/components'
-import { useAppStore } from '@/store'
 import { useModal } from '@/composables'
+import { useAppStore } from '@/store'

 const appStore = useAppStore()
 const [modalRef] = useModal()
--- a/src/components/common/MeVxeGrid.vue
+++ b/src/components/common/MeVxeGrid.vue
@@ -0,0 +1,240 @@
+<template>
+  <div
+    :style="isComputedHeight ? `height: calc(100% - ${autoHeight}px);` : `height: ${autoHeight}px`"
+  >
+    <vxe-grid
+      ref="gridRef"
+      :columns="vxeColumns"
+      :loading="loading"
+      :data="data"
+      height="auto"
+      :stripe="true"
+      :border="true"
+      size="mini"
+      :auto-resize="true"
+      :pager-config="pagerConfig"
+      :export-config="exportConfig"
+      :toolbar-config="vxeToolbarConfig"
+      :proxy-config="proxyConfig"
+      v-on="gridEvent"
+    >
+      <template #loading>
+        <n-spin :show="loading" />
+      </template>
+      <template #total>
+        <span class="font-size-14 line-height-28px">共 {{ pagerConfig.total }} 条数据</span>
+      </template>
+      <template v-for="(c, k) in slots" :key="k" #[c.key]="{ row }">
+        <template v-if="Array.isArray(c.render(row))">
+          <component :is="r" v-for="(r, k1) in c.render(row)" :key="k1" :row="row" :col="c" />
+        </template>
+        <template v-else>
+          <component :is="c.render(row)" :row="row" :col="c" />
+        </template>
+      </template>
+    </vxe-grid>
+  </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+
+defineOptions({ name: 'MeVxeGrid' })
+const props = defineProps({
+  /**
+   * @remote 当isComputedHeight为true时为除table外的高度 false时为table高度
+   */
+  autoHeight: {
+    type: Number,
+    default: 300,
+  },
+  /**
+   * @isPagination 是否为自动计算高度
+   */
+  isComputedHeight: {
+    type: Boolean,
+    default: false,
+  },
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * @remote table的列
+   */
+  columns: {
+    type: Array,
+    default: () => [],
+  },
+  data: {
+    type: Array,
+    default: () => [],
+  },
+
+  pagination: {
+    type: [Boolean, Object],
+    default: true,
+  },
+
+  exportConfig: {
+    type: Object,
+    default: () => ({}),
+  },
+  toolbarConfig: {
+    type: Object,
+    default: () => ({ }),
+  },
+  /**
+   * 是否显示复选框
+   */
+  showCheck: {
+    type: Boolean,
+    default: false,
+  },
+  rowKey: {
+    type: String, // rowKey
+    default: 'id',
+  },
+
+  exportMethod: {
+    type: Function,
+    default: () => null,
+  },
+  remoteMethod: {
+    type: Function,
+    default: () => null,
+  },
+})
+const emits = defineEmits(['update:checked-row-keys', 'pageChanged'])
+const isFirst = shallowRef(true)
+const gridRef = ref(null)
+
+watch(
+  () => props.data,
+  (n) => {
+    isFirst.value = false
+    gridRef.value.reloadData(n)
+  },
+)
+
+const vxeToolbarConfig = computed(() => {
+  return {
+    size: 'mini',
+    className: 'c-toolbar',
+    perfect: true,
+    refresh: true,
+    export: true,
+    zoom: true,
+    custom: true,
+    ...props.toolbarConfig,
+  }
+})
+const pagerConfig = computed(() => {
+  if (props.pagination === false) {
+    return {
+      enabled: false,
+    }
+  }
+  return {
+    currentPage: props.pagination.pageNo,
+    pageSize: props.pagination.pageSize,
+    total: props.pagination.itemCount || 0,
+    background: true,
+    size: 'small',
+    layouts: [
+      'Home',
+      'PrevPage',
+      'JumpNumber',
+      'NextPage',
+      'End',
+      'Sizes',
+      'FullJump',
+      // 'Total',
+    ],
+    slots: {
+      right: 'total',
+    },
+  }
+})
+/**
+ * 将naive 转为vxe-table可用的列
+ */
+const vxeColumns = computed(() => {
+  if (props.showCheck) {
+    return [{
+      type: 'checkbox',
+      resizable: false,
+      width: 45,
+      align: 'center',
+      fixed: 'left',
+    }, ...props.columns.map((item) => {
+      item.field = item.key
+      if (item.render) {
+        item.slots = { default: item.key }
+      }
+      return item
+    })]
+  }
+  return props.columns.map((item) => {
+    item.field = item.key
+    if (item.render) {
+      item.slots = { default: item.key }
+    }
+    return item
+  })
+})
+
+/**
+ * 将naive render函数转换为vxeTable的slots
+ */
+const slots = computed(() => {
+  return props.columns.filter(item => item.render)
+})
+
+const gridEvent = {
+  checkboxAll() {
+    const $grid = gridRef.value
+    if ($grid) {
+      emits(
+        'update:checked-row-keys',
+        $grid.getCheckboxRecords().map(item => item[props.rowKey]),
+      )
+    }
+  },
+  checkboxChange() {
+    const $grid = gridRef.value
+    if ($grid) {
+      emits(
+        'update:checked-row-keys',
+        $grid.getCheckboxRecords().map(item => item[props.rowKey]),
+      )
+    }
+  },
+  pageChange(e) {
+    emits('pageChanged', e)
+  },
+}
+
+const proxyConfig = {
+  props: {
+    result: 'data.pageData',
+    total: 'data.total',
+  },
+  ajax: {
+    query: async ({ page }) => {
+      if (isFirst.value === true) {
+        return Promise.reject('')
+      }
+      props.remoteMethod(page.currentPage, page.pageSize)
+    },
+    queryAll: async () => {
+      const res = await props.exportMethod()
+      return res
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>
--- a/src/components/common/TheLogo.vue
+++ b/src/components/common/TheLogo.vue
@@ -6,7 +6,7 @@
 - Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
 --------------------------------->
 <template>
-  <div class="h-40 w-40 rounded-4 bg-primary p-1/100">
-    <img src="@/assets/images/isme.png" alt="Logo" />
+  <div class="h-32 w-32 rounded-4 bg-primary">
+    <img src="@/assets/images/isme.png" alt="Logo">
  </div>
 </template>
--- a/src/components/common/ThemeSetting.vue
+++ b/src/components/common/ThemeSetting.vue
@@ -14,8 +14,9 @@
 </template>

 <script setup>
-import { getPresetColors } from '@arco-design/color'
 import { useAppStore } from '@/store'
+import { getPresetColors } from '@arco-design/color'
+
 const appStore = useAppStore()

 const primaryColors = Object.entries(getPresetColors()).map(([, value]) => value.primary)
--- a/src/components/common/ToggleTheme.vue
+++ b/src/components/common/ToggleTheme.vue
@@ -0,0 +1,44 @@
+<template>
+  <i
+    class="mr-16 cursor-pointer"
+    :class="isDark ? 'i-fe:moon' : 'i-fe:sun'"
+    @click="toggleDark"
+  />
+</template>
+
+<script setup>
+import { useAppStore } from '@/store'
+import { useDark, useToggle } from '@vueuse/core'
+
+const appStore = useAppStore()
+const isDark = useDark()
+async function toggleDark({ clientX, clientY }) {
+  function handler() {
+    appStore.toggleDark()
+    useToggle(isDark)()
+  }
+
+  if (!document.startViewTransition) {
+    return handler()
+  }
+
+  const clipPath = [
+    `circle(0px at ${clientX}px ${clientY}px)`,
+    `circle(${Math.hypot(
+      Math.max(clientX, window.innerWidth - clientX),
+      Math.max(clientY, window.innerHeight - clientY),
+    )}px at ${clientX}px ${clientY}px)`,
+  ]
+
+  await document.startViewTransition(handler).ready
+
+  document.documentElement.animate(
+    { clipPath: isDark.value ? clipPath.reverse() : clipPath },
+    {
+      duration: 500,
+      easing: 'ease-in',
+      pseudoElement: `::view-transition-${isDark.value ? 'old' : 'new'}(root)`,
+    },
+  )
+}
+</script>
--- a/src/components/common/index.js
+++ b/src/components/common/index.js
@@ -1,5 +1,7 @@
 export { default as AppCard } from './AppCard.vue'
-export { default as TheFooter } from './TheFooter.vue'
 export { default as AppPage } from './AppPage.vue'
 export { default as CommonPage } from './CommonPage.vue'
 export { default as LayoutSetting } from './LayoutSetting.vue'
+export { default as MeVxeGrid } from './MeVxeGrid.vue'
+export { default as TheFooter } from './TheFooter.vue'
+export { default as ToggleTheme } from './ToggleTheme.vue'
--- a/src/components/me/crud/QueryItem.vue
+++ b/src/components/me/crud/QueryItem.vue
@@ -8,10 +8,10 @@

 <template>
  <div class="flex items-center">
-    <label v-if="label || label === 0" class="flex-shrink-0" :style="{ width: labelWidth + 'px' }">
+    <label v-if="label || label === 0" class="flex-shrink-0" :style="{ width: `${labelWidth}px` }">
      {{ label }}
    </label>
-    <div :style="{ width: contentWidth + 'px' }" class="flex-shrink-0">
+    <div :style="{ width: `${contentWidth}px` }" class="flex-shrink-0">
      <slot />
    </div>
  </div>
--- a/src/components/me/crud/index.vue
+++ b/src/components/me/crud/index.vue
@@ -7,25 +7,59 @@
 --------------------------------->

 <template>
-  <AppCard v-if="$slots.default" bordered bg="#fafafc dark:black" class="mb-30 min-h-60 rounded-4">
-    <form class="flex justify-between p-16" @submit.prevent="handleSearch()">
-      <n-space wrap :size="[32, 16]">
-        <slot />
-      </n-space>
-      <div class="flex-shrink-0">
-        <n-button ghost type="primary" @click="handleReset">
-          <i class="i-fe:rotate-ccw mr-4" />
-          重置
-        </n-button>
-        <n-button attr-type="submit" class="ml-20" type="primary">
-          <i class="i-fe:search mr-4" />
-          搜索
-        </n-button>
-      </div>
-    </form>
-  </AppCard>
+  <div :class="computedHeight === true ? 'h-100%' : ''">
+    <div id="search_main">
+      <AppCard v-if="$slots.default" bordered bg="#fafafc dark:black" class="mb-30 min-h-60 rounded-4">
+        <form class="flex justify-between p-16" @submit.prevent="handleSearch()">
+          <n-scrollbar x-scrollable>
+            <n-space :wrap="!expand || isExpanded" :size="[32, 16]" class="p-10">
+              <slot />
+            </n-space>
+          </n-scrollbar>
+          <div class="flex-shrink-0 p-10">
+            <n-button ghost type="primary" @click="handleReset">
+              <i class="i-fe:rotate-ccw mr-4" />
+              重置
+            </n-button>
+            <n-button attr-type="submit" class="ml-20" type="primary">
+              <i class="i-fe:search mr-4" />
+              搜索
+            </n-button>

-  <n-data-table
+            <template v-if="expand">
+              <n-button v-if="!isExpanded" type="primary" text @click="toggleExpand">
+                <i class="i-fe:chevrons-down ml-4" />
+                展开
+              </n-button>
+              <n-button v-else text type="primary" @click="toggleExpand">
+                <i class="i-fe:chevrons-up ml-4" />
+                收起
+              </n-button>
+            </template>
+          </div>
+        </form>
+      </AppCard>
+    </div>
+    <MeVxeGrid
+      :remote="remote"
+      :loading="loading"
+      :scroll-x="scrollX"
+      :columns="columns"
+      :export-config="{ filename: exportName, modes: ['all', 'current'] }"
+      :toolbar-config="toolbarConfig"
+      :data="tableData"
+      :auto-height="computedHeight === true ? autoHeight : computedHeight"
+      :row-key="rowKey"
+      :is-computed-height="computedHeight === true"
+      :show-check="showCheck"
+      :pagination="isPagination ? pagination : false"
+      :remote-method="remoteMethod"
+      :export-method="exportMethod"
+      @update:checked-row-keys="onChecked"
+      @update:page="onPageChange"
+    />
+
+  <!-- <NDataTable
    :remote="remote"
    :loading="loading"
    :scroll-x="scrollX"
@@ -35,14 +69,39 @@
    :pagination="isPagination ? pagination : false"
    @update:checked-row-keys="onChecked"
    @update:page="onPageChange"
-  />
+  /> -->
+  </div>
 </template>

 <script setup>
-import { NDataTable } from 'naive-ui'
 import { utils, writeFile } from 'xlsx'

 const props = defineProps({
+  /**
+   * 是否自动计算高度，适用只有search和table
+   */
+  computedHeight: {
+    type: [Boolean, Number],
+    default: () => true,
+  },
+  showCheck: {
+    type: Boolean,
+    default: () => false,
+  },
+  toolbarConfig: {
+    type: Object,
+    default: () => ({
+      export: true,
+      zoom: true,
+    }),
+  },
+  /**
+   * @remote 导出数据表格名称
+   */
+  exportName: {
+    type: String,
+    default: '导出数据',
+  },
  /**
   * @remote true: 后端分页  false： 前端分页
   */
@@ -78,10 +137,10 @@ const props = defineProps({
  },
  /**
   * ! 约定接口入参出参
-   * * 分页模式需约定分页接口入参
+   * 分页模式需约定分页接口入参
   *    @pageSize 分页参数：一页展示多少条，默认10
   *    @pageNo   分页参数：页码，默认1
-   * * 需约定接口出参
+   * 需约定接口出参
   *    @pageData 分页模式必须,非分页模式如果没有pageData则取上一层data
   *    @total    分页模式必须，非分页模式如果没有total则取上一层data.length
   */
@@ -89,13 +148,54 @@ const props = defineProps({
    type: Function,
    required: true,
  },
+  /** 是否支持展开 */
+  expand: Boolean,
+})
+const emit = defineEmits(['update:queryItems', 'onChecked', 'onDataChange'])
+
+const autoHeight = ref(0)
+
+window.onresize = () => {
+  autoHeight.value = document.getElementById('search_main').clientHeight + 24
+}
+
+onMounted(() => {
+  autoHeight.value = document.getElementById('search_main').clientHeight + 24
 })

-const emit = defineEmits(['update:queryItems', 'onChecked', 'onDataChange'])
 const loading = ref(false)
 const initQuery = { ...props.queryItems }
 const tableData = ref([])
-const pagination = reactive({ page: 1, pageSize: 10 })
+const pagination = reactive({
+  page: 1,
+  pageSize: 10,
+  prefix({ itemCount }) {
+    return `共 ${itemCount} 条数据`
+  },
+})
+
+// 是否展开
+const isExpanded = ref(false)
+
+function toggleExpand() {
+  isExpanded.value = !isExpanded.value
+}
+
+async function exportMethod() {
+  const { data } = await props.getData({
+    pageNo: 1,
+    pageSize: 2000,
+    ...props.queryItems,
+  })
+  return data
+}
+
+function remoteMethod(page, pageSize) {
+  pagination.page = page
+  pagination.pageSize = pageSize
+
+  handleQuery()
+}

 async function handleQuery() {
  try {
@@ -111,17 +211,30 @@ async function handleQuery() {
    })
    tableData.value = data?.pageData || data
    pagination.itemCount = data.total ?? data.length
-  } catch (error) {
+    if (pagination.itemCount && !tableData.value.length && pagination.page > 1) {
+      // 如果当前页数据为空，且总条数不为0，则返回上一页数据
+      onPageChange(pagination.page - 1)
+    }
+    return data
+  }
+  catch (error) {
+    console.error(error)
    tableData.value = []
    pagination.itemCount = 0
-  } finally {
+  }
+  finally {
    emit('onDataChange', tableData.value)
    loading.value = false
  }
 }
-function handleSearch() {
-  pagination.page = 1
-  handleQuery()
+
+function handleSearch(keepCurrentPage = false) {
+  if (keepCurrentPage || !props.remote) {
+    handleQuery()
+  }
+  else {
+    onPageChange(1)
+  }
 }
 async function handleReset() {
  const queryItems = { ...props.queryItems }
@@ -140,16 +253,15 @@ function onPageChange(currentPage) {
  }
 }
 function onChecked(rowKeys) {
-  if (props.columns.some((item) => item.type === 'selection')) {
-    emit('onChecked', rowKeys)
-  }
+  emit('onChecked', rowKeys)
 }
 function handleExport(columns = props.columns, data = tableData.value) {
-  if (!data?.length) return $message.warning('没有数据')
-  const columnsData = columns.filter((item) => !!item.title && !item.hideInExcel)
-  const thKeys = columnsData.map((item) => item.key)
-  const thData = columnsData.map((item) => item.title)
-  const trData = data.map((item) => thKeys.map((key) => item[key]))
+  if (!data?.length)
+    return $message.warning('没有数据')
+  const columnsData = columns.filter(item => !!item.title && !item.hideInExcel)
+  const thKeys = columnsData.map(item => item.key)
+  const thData = columnsData.map(item => item.title)
+  const trData = data.map(item => thKeys.map(key => item[key]))
  const sheet = utils.aoa_to_sheet([thData, ...trData])
  const workBook = utils.book_new()
  utils.book_append_sheet(workBook, sheet, '数据报表')
--- a/src/components/me/index.js
+++ b/src/components/me/index.js
@@ -1,3 +1,3 @@
-export { default as MeModal } from './modal/index.vue'
 export { default as MeCrud } from './crud/index.vue'
 export { default as MeQueryItem } from './crud/QueryItem.vue'
+export { default as MeModal } from './modal/index.vue'
--- a/src/components/me/modal/index.vue
+++ b/src/components/me/modal/index.vue
@@ -18,27 +18,30 @@
  >
    <n-card :style="modalOptions.contentStyle" :closable="modalOptions.closable" @close="close()">
      <template #header>
-        <header class="modal-header">{{ modalOptions.title }}</header>
+        <header class="modal-header">
+          {{ modalOptions.title }}
+        </header>
      </template>
-      <slot></slot>
+      <slot />

      <!-- 底部按钮 -->
      <template #footer>
-        <slot v-if="$slots.footer" name="footer" />
-        <footer v-else-if="modalOptions.showFooter" class="flex justify-end">
-          <n-button v-if="modalOptions.showCancel" @click="handleCancel()">
-            {{ modalOptions.cancelText }}
-          </n-button>
-          <n-button
-            v-if="modalOptions.showOk"
-            type="primary"
-            :loading="modalOptions.okLoading"
-            class="ml-20"
-            @click="handleOk()"
-          >
-            {{ modalOptions.okText }}
-          </n-button>
-        </footer>
+        <slot name="footer">
+          <footer v-if="modalOptions.showFooter" class="flex justify-end">
+            <n-button v-if="modalOptions.showCancel" @click="handleCancel()">
+              {{ modalOptions.cancelText }}
+            </n-button>
+            <n-button
+              v-if="modalOptions.showOk"
+              type="primary"
+              :loading="modalOptions.okLoading"
+              class="ml-20"
+              @click="handleOk()"
+            >
+              {{ modalOptions.okText }}
+            </n-button>
+          </footer>
+        </slot>
      </template>
    </n-card>
  </n-modal>
@@ -46,6 +49,7 @@

 <script setup>
 import { initDrag } from './utils'
+
 const props = defineProps({
  width: {
    type: String,
@@ -101,6 +105,17 @@ const show = ref(false)
 // 声明一个modalOptions变量，用于存储模态框的配置信息
 const modalOptions = ref({})

+const okLoading = computed({
+  get() {
+    return !!modalOptions.value?.okLoading
+  },
+  set(v) {
+    if (modalOptions.value) {
+      modalOptions.value.okLoading = v
+    }
+  },
+})
+
 // 打开模态框
 async function open(options = {}) {
  // 将props和options合并赋值给modalOptions
@@ -111,7 +126,7 @@ async function open(options = {}) {
  await nextTick()
  initDrag(
    Array.prototype.at.call(document.querySelectorAll('.modal-header'), -1),
-    Array.prototype.at.call(document.querySelectorAll('.modal-box'), -1)
+    Array.prototype.at.call(document.querySelectorAll('.modal-box'), -1),
  )
 }

@@ -130,10 +145,12 @@ async function handleOk(data) {
    // 调用onOk函数，传入data参数
    const res = await modalOptions.value.onOk(data)
    // 如果onOk函数的返回值不为false，则关闭模态框
-    res !== false && close()
-  } catch (error) {
-    okLoading.value = false
+    if (res !== false)
+      close()
+  }
+  catch (error) {
    console.error(error)
+    okLoading.value = false
  }
 }

@@ -148,10 +165,12 @@ async function handleCancel(data) {
    const res = await modalOptions.value.onCancel(data)

    // 如果onCancel函数的返回值不为false，则关闭模态框
-    res !== false && close()
-  } catch (error) {
-    okLoading.value = false
+    if (res !== false)
+      close()
+  }
+  catch (error) {
    console.error(error)
+    okLoading.value = false
  }
 }

@@ -159,21 +178,10 @@ async function onAfterLeave() {
  await nextTick()
  initDrag(
    Array.prototype.at.call(document.querySelectorAll('.modal-header'), -1),
-    Array.prototype.at.call(document.querySelectorAll('.modal-box'), -1)
+    Array.prototype.at.call(document.querySelectorAll('.modal-box'), -1),
  )
 }

-const okLoading = computed({
-  get() {
-    return !!modalOptions.value?.okLoading
-  },
-  set(v) {
-    if (modalOptions.value) {
-      modalOptions.value.okLoading = v
-    }
-  },
-})
-
 // 定义一个defineExpose函数，用于暴露open、close、handleOk、handleCancel函数
 defineExpose({
  open,
--- a/src/components/me/modal/utils.js
+++ b/src/components/me/modal/utils.js
@@ -15,7 +15,8 @@ function getCss(element, key) {

 // 初始化拖拽
 export function initDrag(bar, box) {
-  if (!bar || !box) return
+  if (!bar || !box)
+    return
  const params = {
    left: 0,
    top: 0,
@@ -50,7 +51,8 @@ export function initDrag(bar, box) {
    }
  }
  document.onmousemove = function (e) {
-    if (e.target !== bar && !params.flag) return
+    if (e.target !== bar && !params.flag)
+      return

    e.preventDefault() // 阻止默认事件
    // 如果拖拽标志为true
@@ -60,11 +62,11 @@ export function initDrag(bar, box) {
      const disX = nowX - params.currentX // 鼠标移动的X距离
      const disY = nowY - params.currentY // 鼠标移动的Y距离

-      let left = parseInt(params.left) + disX // 盒子元素的新left值
-      let top = parseInt(params.top) + disY // 盒子元素的新top值
+      const left = Number.parseInt(params.left) + disX // 盒子元素的新left值
+      const top = Number.parseInt(params.top) + disY // 盒子元素的新top值

-      box.style.left = left + 'px'
-      box.style.top = top + 'px'
+      box.style.left = `${left}px`
+      box.style.top = `${top}px`
    }
  }
 }
--- a/src/composables/index.js
+++ b/src/composables/index.js
@@ -1,4 +1,4 @@
+export * from './useAliveData'
 export * from './useCrud'
 export * from './useForm'
 export * from './useModal'
-export * from './useAliveData'
--- a/src/composables/useAliveData.js
+++ b/src/composables/useAliveData.js
@@ -7,7 +7,7 @@
 **********************************/

 const lastDataMap = new Map()
-export const useAliveData = (initData = {}, key) => {
+export function useAliveData(initData = {}, key) {
  key = key ?? useRoute().name
  const lastData = lastDataMap.get(key)
  const aliveData = ref(lastData || { ...initData })
@@ -17,7 +17,7 @@ export const useAliveData = (initData = {}, key) => {
    (v) => {
      lastDataMap.set(key, v)
    },
-    { deep: true }
+    { deep: true },
  )

  return {
--- a/src/composables/useCrud.js
+++ b/src/composables/useCrud.js
@@ -6,7 +6,7 @@
 * Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
 **********************************/

-import { useModal, useForm } from '.'
+import { useForm, useModal } from '.'

 const ACTIONS = {
  view: '查看',
@@ -14,7 +14,7 @@ const ACTIONS = {
  add: '新增',
 }

-export const useCrud = ({ name, initForm = {}, doCreate, doDelete, doUpdate, refresh }) => {
+export function useCrud({ name, initForm = {}, doCreate, doDelete, doUpdate, refresh }) {
  const modalAction = ref('')
  const [modalRef, okLoading] = useModal()
  const [modalFormRef, modalForm, validation] = useForm(initForm)
@@ -44,7 +44,8 @@ export const useCrud = ({ name, initForm = {}, doCreate, doDelete, doUpdate, ref
      async onOk() {
        if (typeof onOk === 'function') {
          return await onOk()
-        } else {
+        }
+        else {
          return await handleSave()
        }
      },
@@ -77,7 +78,9 @@ export const useCrud = ({ name, initForm = {}, doCreate, doDelete, doUpdate, ref
      action.cb()
      okLoading.value = false
      data && refresh(data)
-    } catch (error) {
+    }
+    catch (error) {
+      console.error(error)
      okLoading.value = false
      return false
    }
@@ -85,7 +88,8 @@ export const useCrud = ({ name, initForm = {}, doCreate, doDelete, doUpdate, ref

  /** 删除 */
  function handleDelete(id, confirmOptions) {
-    if (!id && id !== 0) return
+    if (!id && id !== 0)
+      return
    const d = $dialog.warning({
      content: '确定删除？',
      title: '提示',
@@ -97,8 +101,10 @@ export const useCrud = ({ name, initForm = {}, doCreate, doDelete, doUpdate, ref
          const data = await doDelete(id)
          $message.success('删除成功')
          d.loading = false
-          refresh(data)
-        } catch (error) {
+          refresh(data, true)
+        }
+        catch (error) {
+          console.error(error)
          d.loading = false
        }
      },
--- a/src/composables/useForm.js
+++ b/src/composables/useForm.js
@@ -6,7 +6,7 @@
 * Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
 **********************************/

-export const useForm = (initFormData = {}) => {
+export function useForm(initFormData = {}) {
  const formRef = ref(null)
  const formModel = ref({ ...initFormData })
  const rules = {
--- a/src/composables/useModal.js
+++ b/src/composables/useModal.js
@@ -6,7 +6,7 @@
 * Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
 **********************************/

-export const useModal = () => {
+export function useModal() {
  const modalRef = ref(null)
  const okLoading = computed({
    get() {
--- a/src/directives/index.js
+++ b/src/directives/index.js
@@ -11,7 +11,7 @@ import { router } from '@/router'
 const permission = {
  mounted(el, binding) {
    const currentRoute = unref(router.currentRoute)
-    const btns = currentRoute.meta?.btns?.map((item) => item.code) || []
+    const btns = currentRoute.meta?.btns?.map(item => item.code) || []
    if (!btns.includes(binding.value)) {
      el.remove()
    }
--- a/src/layouts/components/BreadCrumb.vue
+++ b/src/layouts/components/BreadCrumb.vue
@@ -33,6 +33,7 @@

 <script setup>
 import { usePermissionStore } from '@/store'
+
 const router = useRouter()
 const route = useRoute()
 const permissionStore = usePermissionStore()
@@ -43,7 +44,7 @@ watch(
  (v) => {
    breadItems.value = findMatchs(permissionStore.permissions, v)
  },
-  { immediate: true }
+  { immediate: true },
 )

 function findMatchs(tree, code, parents = []) {
@@ -69,8 +70,8 @@ function handleItemClick(item) {

 function getDropOptions(list = []) {
  return list
-    .filter((item) => item.show)
-    .map((child) => ({
+    .filter(item => item.show)
+    .map(child => ({
      label: child.name,
      key: child.code,
      icon: () => h('i', { class: child.icon }),
--- a/src/layouts/components/Fullscreen.vue
+++ b/src/layouts/components/Fullscreen.vue
@@ -0,0 +1,13 @@
+<template>
+  <i
+    class="mr-16 cursor-pointer"
+    :class="isFullscreen ? 'i-fe:minimize' : 'i-fe:maximize'"
+    @click="toggle"
+  />
+</template>
+
+<script setup>
+import { useFullscreen } from '@vueuse/core'
+
+const { isFullscreen, toggle } = useFullscreen()
+</script>
--- a/src/layouts/components/RoleSelect.vue
+++ b/src/layouts/components/RoleSelect.vue
@@ -24,7 +24,9 @@

    <template #footer>
      <div class="flex">
-        <n-button class="flex-1" size="large" @click="logout()">退出登录</n-button>
+        <n-button class="flex-1" size="large" @click="logout()">
+          退出登录
+        </n-button>
        <n-button
          :loading="okLoading"
          class="ml-20 flex-1"
@@ -44,13 +46,13 @@
 import api from '@/api'
 import { MeModal } from '@/components'
 import { useModal } from '@/composables'
-import { useUserStore, useAuthStore } from '@/store'
+import { useAuthStore, useUserStore } from '@/store'

 const userStore = useUserStore()
 const authStore = useAuthStore()

 const roles = ref(userStore.roles || [])
-const roleCode = ref(userStore.currentRole?.code ?? roles[0]?.code ?? '')
+const roleCode = ref(userStore.currentRole?.code ?? roles.value[0]?.code ?? '')

 const [modalRef, okLoading] = useModal()
 function open(options) {
@@ -67,7 +69,8 @@ async function setCurrentRole() {
    okLoading.value = false
    $message.success('切换成功')
    modalRef.value?.handleOk()
-  } catch (error) {
+  }
+  catch (error) {
    console.error(error)
    okLoading.value = false
    return false
--- a/src/layouts/components/SideLogo.vue
+++ b/src/layouts/components/SideLogo.vue
@@ -20,6 +20,7 @@

 <script setup>
 import { useAppStore } from '@/store'
+
 const title = import.meta.env.VITE_TITLE

 const appStore = useAppStore()
--- a/src/layouts/components/SideMenu.vue
+++ b/src/layouts/components/SideMenu.vue
@@ -52,13 +52,14 @@ function handleMenuSelect(key, item) {
        router.push(item.path)
      },
    })
-  } else {
+  }
+  else {
    router.push(item.path)
  }
 }
 </script>

-<style lang="scss">
+<style>
 .side-menu:not(.n-menu--collapsed) {
  .n-menu-item-content {
    &::before {
--- a/src/layouts/components/UserAvatar.vue
+++ b/src/layouts/components/UserAvatar.vue
@@ -21,9 +21,9 @@
 </template>

 <script setup>
-import { useUserStore, useAuthStore, usePermissionStore } from '@/store'
-import { RoleSelect } from '@/layouts/components'
 import api from '@/api'
+import { RoleSelect } from '@/layouts/components'
+import { useAuthStore, usePermissionStore, useUserStore } from '@/store'

 const router = useRouter()
 const userStore = useUserStore()
@@ -35,7 +35,7 @@ const options = reactive([
    label: '个人资料',
    key: 'profile',
    icon: () => h('i', { class: 'i-material-symbols:person-outline text-14' }),
-    show: computed(() => permissionStore.accessRoutes?.some((item) => item.path === '/profile')),
+    show: computed(() => permissionStore.accessRoutes?.some(item => item.path === '/profile')),
  },
  {
    label: '切换角色',
@@ -71,7 +71,8 @@ function handleSelect(key) {
        async confirm() {
          try {
            await api.logout()
-          } catch (error) {
+          }
+          catch (error) {
            console.error(error)
          }
          authStore.logout()
--- a/src/layouts/components/index.js
+++ b/src/layouts/components/index.js
@@ -1,7 +1,8 @@
-export { default as RoleSelect } from './RoleSelect.vue'
-export { default as UserAvatar } from './UserAvatar.vue'
-export { default as MenuCollapse } from './MenuCollapse.vue'
 export { default as BreadCrumb } from './BreadCrumb.vue'
-export { default as AppTab } from './tab/index.vue'
+export { default as Fullscreen } from './Fullscreen.vue'
+export { default as MenuCollapse } from './MenuCollapse.vue'
+export { default as RoleSelect } from './RoleSelect.vue'
 export { default as SideLogo } from './SideLogo.vue'
 export { default as SideMenu } from './SideMenu.vue'
+export { default as AppTab } from './tab/index.vue'
+export { default as UserAvatar } from './UserAvatar.vue'
--- a/src/layouts/components/tab/ContextMenu.vue
+++ b/src/layouts/components/tab/ContextMenu.vue
@@ -73,8 +73,8 @@ const options = computed(() => [
    label: '关闭右侧',
    key: 'close-right',
    disabled:
-      tabStore.tabs.length <= 1 ||
-      props.currentPath === tabStore.tabs[tabStore.tabs.length - 1].path,
+      tabStore.tabs.length <= 1
+      || props.currentPath === tabStore.tabs[tabStore.tabs.length - 1].path,
    icon: () => h('i', { class: 'i-mdi:arrow-expand-right text-14' }),
  },
 ])
@@ -119,7 +119,8 @@ function handleHideDropdown() {

 function handleSelect(key) {
  const actionFn = actionMap.get(key)
-  actionFn && actionFn()
+  if (typeof actionFn === 'function')
+    actionFn()
  handleHideDropdown()
 }
 </script>
--- a/src/layouts/components/tab/index.vue
+++ b/src/layouts/components/tab/index.vue
@@ -36,8 +36,8 @@
 </template>

 <script setup>
-import ContextMenu from './ContextMenu.vue'
 import { useTabStore } from '@/store'
+import ContextMenu from './ContextMenu.vue'

 const router = useRouter()
 const tabStore = useTabStore()
@@ -49,7 +49,7 @@ const contextMenuOption = reactive({
  currentPath: '',
 })

-const handleItemClick = (path) => {
+function handleItemClick(path) {
  tabStore.setActiveTab(path)
  router.push(path)
 }
@@ -74,7 +74,7 @@ async function handleContextMenu(e, tagItem) {
 }
 </script>

-<style scoped lang="scss">
+<style scoped>
 :deep(.n-tabs) {
  .n-tabs-tab {
    padding-left: 16px;
--- a/src/layouts/full/header/index.vue
+++ b/src/layouts/full/header/index.vue
@@ -13,16 +13,9 @@
    <BreadCrumb />

    <div class="ml-auto flex flex-shrink-0 items-center px-12 text-18">
-      <i
-        class="mr-16 cursor-pointer"
-        :class="isDark ? 'i-fe:moon' : 'i-fe:sun'"
-        @click="toggleDark"
-      />
-      <i
-        class="mr-16 cursor-pointer"
-        :class="isFullscreen ? 'i-fe:minimize' : 'i-fe:maximize'"
-        @click="toggle"
-      />
+      <ToggleTheme />
+
+      <Fullscreen />

      <i
        class="i-fe:github mr-16 cursor-pointer"
@@ -41,18 +34,8 @@
 </template>

 <script setup>
-import { MenuCollapse, UserAvatar, BreadCrumb } from '@/layouts/components'
-import { useAppStore } from '@/store'
-import { useDark, useToggle, useFullscreen } from '@vueuse/core'
-
-const appStore = useAppStore()
-const isDark = useDark()
-const toggleDark = () => {
-  appStore.toggleDark()
-  useToggle(isDark)()
-}
-
-const { isFullscreen, toggle } = useFullscreen()
+import { ToggleTheme } from '@/components'
+import { BreadCrumb, Fullscreen, MenuCollapse, UserAvatar } from '@/layouts/components'

 function handleLinkClick(link) {
  window.open(link)
--- a/src/layouts/full/index.vue
+++ b/src/layouts/full/index.vue
@@ -27,10 +27,10 @@
 </template>

 <script setup>
-import { useAppStore } from '@/store'
 import { AppTab } from '@/layouts/components'
-import SideBar from './sidebar/index.vue'
+import { useAppStore } from '@/store'
 import AppHeader from './header/index.vue'
+import SideBar from './sidebar/index.vue'

 const appStore = useAppStore()
 </script>
--- a/src/layouts/normal/header/index.vue
+++ b/src/layouts/normal/header/index.vue
@@ -15,16 +15,9 @@
    <span class="mx-6 opacity-20">|</span>

    <div class="flex flex-shrink-0 items-center px-12 text-18">
-      <i
-        class="mr-16 cursor-pointer"
-        :class="isDark ? 'i-fe:moon' : 'i-fe:sun'"
-        @click="toggleDark"
-      />
-      <i
-        class="mr-16 cursor-pointer"
-        :class="isFullscreen ? 'i-fe:minimize' : 'i-fe:maximize'"
-        @click="toggle"
-      />
+      <ToggleTheme />
+
+      <Fullscreen />

      <i
        class="i-fe:github mr-16 cursor-pointer"
@@ -43,24 +36,10 @@
 </template>

 <script setup>
-import { UserAvatar, MenuCollapse, AppTab } from '@/layouts/components'
-import { useDark, useToggle, useFullscreen } from '@vueuse/core'
-import { useAppStore } from '@/store'
-
-const appStore = useAppStore()
-const isDark = useDark()
-const toggleDark = () => {
-  appStore.toggleDark()
-  useToggle(isDark)()
-}
-
-const { isFullscreen, toggle } = useFullscreen()
+import { ToggleTheme } from '@/components'
+import { AppTab, Fullscreen, MenuCollapse, UserAvatar } from '@/layouts/components'

 function handleLinkClick(link) {
  window.open(link)
 }
-
-watchEffect(() => {
-  appStore.setThemeColor(appStore.primaryColor, appStore.isDark)
-})
 </script>
--- a/src/layouts/normal/index.vue
+++ b/src/layouts/normal/index.vue
@@ -25,8 +25,8 @@

 <script setup>
 import { useAppStore } from '@/store'
-import SideBar from './sidebar/index.vue'
 import AppHeader from './header/index.vue'
+import SideBar from './sidebar/index.vue'

 const appStore = useAppStore()
 </script>
--- a/src/layouts/simple/sidebar/index.vue
+++ b/src/layouts/simple/sidebar/index.vue
@@ -16,7 +16,7 @@
 </template>

 <script setup>
-import { UserAvatar, MenuCollapse, SideLogo, SideMenu } from '@/layouts/components'
+import { MenuCollapse, SideLogo, SideMenu, UserAvatar } from '@/layouts/components'
 import { useAppStore } from '@/store'

 const appStore = useAppStore()
--- a/src/main.js
+++ b/src/main.js
@@ -8,19 +8,35 @@
 * Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
 **********************************/

-import '@/styles/reset.css'
-import '@/styles/global.scss'
-import 'uno.css'
-
+import ExcelJS from 'exceljs'
 import { createApp } from 'vue'
 import App from './App.vue'
+
+import { setupDirectives } from './directives'
+/**
+ * 引入vxe-table 和 vxe-pc-ui excel导出
+ */
+import VxeUI from 'vxe-pc-ui'
+import VXETable from 'vxe-table'
+import VXETablePluginExportXLSX from 'vxe-table-plugin-export-xlsx'
 import { setupRouter } from './router'
 import { setupStore } from './store'
+
 import { setupNaiveDiscreteApi } from './utils'
-import { setupDirectives } from './directives'
+import 'vxe-pc-ui/lib/style.css'
+import 'vxe-table/lib/style.css'
+import '@/styles/reset.css'
+import '@/styles/global.css'
+import 'uno.css'

 async function bootstrap() {
  const app = createApp(App)
+
+  VXETable.use(VXETablePluginExportXLSX, {
+    ExcelJS,
+  })
+  app.use(VxeUI).use(VXETable)
+
  setupStore(app)
  setupDirectives(app)
  await setupRouter(app)
--- a/src/router/guards/page-title-guard.js
+++ b/src/router/guards/page-title-guard.js
@@ -13,7 +13,8 @@ export function createPageTitleGuard(router) {
    const pageTitle = to.meta?.title
    if (pageTitle) {
      document.title = `${pageTitle} | ${baseTitle}`
-    } else {
+    }
+    else {
      document.title = baseTitle
    }
  })
--- a/src/router/guards/permission-guard.js
+++ b/src/router/guards/permission-guard.js
@@ -6,8 +6,8 @@
 * Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
 **********************************/

-import { useAuthStore, usePermissionStore, useUserStore } from '@/store'
 import api from '@/api'
+import { useAuthStore, usePermissionStore, useUserStore } from '@/store'
 import { getPermissions, getUserInfo } from '@/store/helper'

 const WHITE_LIST = ['/login', '/404']
@@ -18,13 +18,16 @@ export function createPermissionGuard(router) {

    /** 没有token */
    if (!token) {
-      if (WHITE_LIST.includes(to.path)) return true
+      if (WHITE_LIST.includes(to.path))
+        return true
      return { path: 'login', query: { ...to.query, redirect: to.path } }
    }

    // 有token的情况
-    if (to.path === '/login') return { path: '/' }
-    if (WHITE_LIST.includes(to.path)) return true
+    if (to.path === '/login')
+      return { path: '/' }
+    if (WHITE_LIST.includes(to.path))
+      return true

    const userStore = useUserStore()
    const permissionStore = usePermissionStore()
@@ -41,7 +44,8 @@ export function createPermissionGuard(router) {
    }

    const routes = router.getRoutes()
-    if (routes.find((route) => route.name === to.name)) return true
+    if (routes.find(route => route.name === to.name))
+      return true

    // 判断是无权限还是404
    const { data: hasMenu } = await api.validateMenuPath(to.path)
--- a/src/router/guards/tab-guard.js
+++ b/src/router/guards/tab-guard.js
@@ -12,7 +12,8 @@ export const EXCLUDE_TAB = ['/404', '/403', '/login']

 export function createTabGuard(router) {
  router.afterEach((to) => {
-    if (EXCLUDE_TAB.includes(to.path)) return
+    if (EXCLUDE_TAB.includes(to.path))
+      return
    const tabStore = useTabStore()
    const { name, fullPath: path } = to
    const title = to.meta?.title
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -6,9 +6,9 @@
 * Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
 **********************************/

-import { createRouter, createWebHistory, createWebHashHistory } from 'vue-router'
-import { setupRouterGuards } from './guards'
+import { createRouter, createWebHashHistory, createWebHistory } from 'vue-router'
 import { basicRoutes } from './basic-routes'
+import { setupRouterGuards } from './guards'

 export const router = createRouter({
  history:
--- a/src/settings.js
+++ b/src/settings.js
@@ -10,6 +10,9 @@ export const defaultLayout = 'normal'

 export const defaultPrimaryColor = '#316C72'

+// 控制 LayoutSetting 组件是否可见
+export const layoutSettingVisible = true
+
 export const naiveThemeOverrides = {
  common: {
    primaryColor: '#316C72FF',
@@ -33,7 +36,7 @@ export const basePermissions = [
        code: 'ShowDocs',
        name: '项目文档',
        type: 'MENU',
-        path: 'https://docs.isme.top/web/#/624306705/188522224',
+        path: 'https://isme.top',
        icon: 'i-me:docs',
        order: 1,
        enable: true,
--- a/src/store/helper.js
+++ b/src/store/helper.js
@@ -1,5 +1,5 @@
-import { basePermissions } from '@/settings'
 import api from '@/api'
+import { basePermissions } from '@/settings'

 export async function getUserInfo() {
  const res = await api.getUser()
@@ -22,7 +22,8 @@ export async function getPermissions() {
  try {
    const res = await api.getRolePermissions()
    asyncPermissions = res?.data || []
-  } catch (error) {
+  }
+  catch (error) {
    console.error(error)
  }
  return basePermissions.concat(asyncPermissions)
--- a/src/store/modules/app.js
+++ b/src/store/modules/app.js
@@ -6,10 +6,11 @@
 * Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
 **********************************/

-import { defineStore } from 'pinia'
-import { useDark } from '@vueuse/core'
-import { generate, getRgbStr } from '@arco-design/color'
 import { defaultLayout, defaultPrimaryColor, naiveThemeOverrides } from '@/settings'
+import { generate, getRgbStr } from '@arco-design/color'
+import { useDark } from '@vueuse/core'
+import { defineStore } from 'pinia'
+import { VxeUI } from 'vxe-pc-ui'

 export const useAppStore = defineStore('app', {
  state: () => ({
@@ -40,6 +41,18 @@ export const useAppStore = defineStore('app', {
        list: true,
        dark: isDark,
      })
+      VxeUI.setTheme(isDark ? 'dark' : 'light')
+      if (isDark) {
+        document.body.style.setProperty('--vxe-ui-font-color', '#fff')
+      }
+      else {
+        document.body.style.setProperty('--vxe-ui-font-color', '#000')
+      }
+
+      document.body.style.setProperty('--vxe-ui-font-primary-color', color)
+      document.body.style.setProperty('--vxe-ui-font-primary-lighten-color', color)
+      document.body.style.setProperty('--vxe-ui-font-primary-darken-color', color)
+
      document.body.style.setProperty('--primary-color', getRgbStr(colors[5]))
      this.naiveThemeOverrides.common = Object.assign(this.naiveThemeOverrides.common || {}, {
        primaryColor: colors[5],
--- a/src/store/modules/auth.js
+++ b/src/store/modules/auth.js
@@ -6,8 +6,8 @@
 * Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
 **********************************/

+import { usePermissionStore, useRouterStore, useTabStore, useUserStore } from '@/store'
 import { defineStore } from 'pinia'
-import { useUserStore, usePermissionStore, useTabStore, useRouterStore } from '@/store'

 export const useAuthStore = defineStore('auth', {
  state: () => ({
--- a/src/store/modules/index.js
+++ b/src/store/modules/index.js
@@ -1,6 +1,6 @@
 export * from './app'
 export * from './auth'
 export * from './permission'
+export * from './router'
 export * from './tab'
 export * from './user'
-export * from './router'
--- a/src/store/modules/permission.js
+++ b/src/store/modules/permission.js
@@ -20,15 +20,17 @@ export const usePermissionStore = defineStore('permission', {
    setPermissions(permissions) {
      this.permissions = permissions
      this.menus = this.permissions
-        .filter((item) => item.type === 'MENU')
-        .map((item) => this.getMenuItem(item))
-        .filter((item) => !!item)
+        .filter(item => item.type === 'MENU')
+        .map(item => this.getMenuItem(item))
+        .filter(item => !!item)
        .sort((a, b) => a.order - b.order)
    },
    getMenuItem(item, parent) {
      const route = this.generateRoute(item, item.show ? null : parent?.key)
-      if (item.enable && route.path && !route.path.startsWith('http')) this.accessRoutes.push(route)
-      if (!item.show) return null
+      if (item.enable && route.path && !route.path.startsWith('http'))
+        this.accessRoutes.push(route)
+      if (!item.show)
+        return null
      const menuItem = {
        label: route.meta.title,
        key: route.name,
@@ -37,18 +39,19 @@ export const usePermissionStore = defineStore('permission', {
        icon: () => h('i', { class: `${route.meta.icon} text-16` }),
        order: item.order ?? 0,
      }
-      const children = item.children?.filter((item) => item.type === 'MENU') || []
+      const children = item.children?.filter(item => item.type === 'MENU') || []
      if (children.length) {
        menuItem.children = children
-          .map((child) => this.getMenuItem(child, menuItem))
-          .filter((item) => !!item)
+          .map(child => this.getMenuItem(child, menuItem))
+          .filter(item => !!item)
          .sort((a, b) => a.order - b.order)
-        if (!menuItem.children.length) delete menuItem.children
+        if (!menuItem.children.length)
+          delete menuItem.children
      }
      return menuItem
    },
    generateRoute(item, parentKey) {
-      let originPath = undefined
+      let originPath
      if (isExternal(item.path)) {
        originPath = item.path
        item.component = '/src/views/iframe/index.vue'
@@ -61,14 +64,14 @@ export const usePermissionStore = defineStore('permission', {
        component: item.component,
        meta: {
          originPath,
-          icon: item.icon + '?mask',
+          icon: `${item.icon}?mask`,
          title: item.name,
          layout: item.layout,
          keepAlive: !!item.keepAlive,
          parentKey,
          btns: item.children
-            ?.filter((item) => item.type === 'BUTTON')
-            .map((item) => ({ code: item.code, name: item.name })),
+            ?.filter(item => item.type === 'BUTTON')
+            .map(item => ({ code: item.code, name: item.name })),
        },
      }
    },
--- a/src/store/modules/tab.js
+++ b/src/store/modules/tab.js
@@ -17,7 +17,7 @@ export const useTabStore = defineStore('tab', {
  }),
  getters: {
    activeIndex() {
-      return this.tabs.findIndex((item) => item.path === this.activeTab)
+      return this.tabs.findIndex(item => item.path === this.activeTab)
    },
  },
  actions: {
@@ -29,19 +29,22 @@ export const useTabStore = defineStore('tab', {
      this.tabs = tabs
    },
    addTab(tab = {}) {
-      const findIndex = this.tabs.findIndex((item) => item.path === tab.path)
+      const findIndex = this.tabs.findIndex(item => item.path === tab.path)
      if (findIndex !== -1) {
        this.tabs.splice(findIndex, 1, tab)
-      } else {
+      }
+      else {
        this.setTabs([...this.tabs, tab])
      }
      this.setActiveTab(tab.path)
    },
    async reloadTab(path, keepAlive) {
-      const findItem = this.tabs.find((item) => item.path === path)
-      if (!findItem) return
+      const findItem = this.tabs.find(item => item.path === path)
+      if (!findItem)
+        return
      // 更新key可让keepAlive失效
-      if (keepAlive) findItem.keepAlive = false
+      if (keepAlive)
+        findItem.keepAlive = false
      $loadingBar.start()
      this.reloading = true
      await nextTick()
@@ -53,30 +56,30 @@ export const useTabStore = defineStore('tab', {
      }, 100)
    },
    async removeTab(path) {
-      this.setTabs(this.tabs.filter((tab) => tab.path !== path))
+      this.setTabs(this.tabs.filter(tab => tab.path !== path))
      if (path === this.activeTab) {
        useRouterStore().router?.push(this.tabs[this.tabs.length - 1].path)
      }
    },
    removeOther(curPath = this.activeTab) {
-      this.setTabs(this.tabs.filter((tab) => tab.path === curPath))
+      this.setTabs(this.tabs.filter(tab => tab.path === curPath))
      if (curPath !== this.activeTab) {
        useRouterStore().router?.push(this.tabs[this.tabs.length - 1].path)
      }
    },
    removeLeft(curPath) {
-      const curIndex = this.tabs.findIndex((item) => item.path === curPath)
+      const curIndex = this.tabs.findIndex(item => item.path === curPath)
      const filterTabs = this.tabs.filter((item, index) => index >= curIndex)
      this.setTabs(filterTabs)
-      if (!filterTabs.find((item) => item.path === this.activeTab)) {
+      if (!filterTabs.find(item => item.path === this.activeTab)) {
        useRouterStore().router?.push(filterTabs[filterTabs.length - 1].path)
      }
    },
    removeRight(curPath) {
-      const curIndex = this.tabs.findIndex((item) => item.path === curPath)
+      const curIndex = this.tabs.findIndex(item => item.path === curPath)
      const filterTabs = this.tabs.filter((item, index) => index <= curIndex)
      this.setTabs(filterTabs)
-      if (!filterTabs.find((item) => item.path === this.activeTab.value)) {
+      if (!filterTabs.find(item => item.path === this.activeTab.value)) {
        useRouterStore().router?.push(filterTabs[filterTabs.length - 1].path)
      }
    },
--- a/src/styles/global.scss
+++ b/src/styles/global.scss
@@ -26,12 +26,12 @@ body {

 .fade-slide-enter-from {
  opacity: 0;
-  transform: translateX(-30px);
+  transform: translateX(-2%);
 }

 .fade-slide-leave-to {
  opacity: 0;
-  transform: translateX(30px);
+  transform: translateX(2%);
 }

 /* 自定义滚动条样式 */
@@ -72,3 +72,20 @@ body {
    }
  }
 }
+
+/* 切换主题的动画效果 */
+::view-transition-old(root),
+::view-transition-new(root) {
+  animation: none;
+  mix-blend-mode: normal;
+}
+
+::view-transition-old(root),
+.dark::view-transition-new(root) {
+  z-index: 1;
+}
+
+::view-transition-new(root),
+.dark::view-transition-old(root) {
+  z-index: 9999;
+}
--- a/src/styles/reset.css
+++ b/src/styles/reset.css
@@ -1,49 +1,388 @@
-/**********************************
- * @Author: Ronnie Zhang
- * @LastEditor: Ronnie Zhang
- * @LastEditTime: 2023/12/05 21:26:38
- * @Email: zclzone@outlook.com
- * Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
- **********************************/
-
-html {
-  box-sizing: border-box;
-}
+/*
+1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
+2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
+2. [UnoCSS]: allow to override the default border color with css var `--un-default-border-color`
+*/

 *,
 ::before,
 ::after {
-  margin: 0;
-  padding: 0;
-  box-sizing: inherit;
+  box-sizing: border-box; /* 1 */
+  border-width: 0; /* 2 */
+  border-style: solid; /* 2 */
+  border-color: var(--un-default-border-color, #e5e7eb); /* 2 */
 }

+::before,
+::after {
+  --un-content: '';
+}
+
+/*
+1. Use a consistent sensible line-height in all browsers.
+2. Prevent adjustments of font size after orientation changes in iOS.
+3. Use a more readable tab size.
+4. Use the user's configured `sans` font-family by default.
+5. Use the user's configured `sans` font-feature-settings by default.
+6. Use the user's configured `sans` font-variation-settings by default.
+7. Disable tap highlights on iOS.
+*/
+
+html,
+:host {
+  line-height: 1.5; /* 1 */
+  -webkit-text-size-adjust: 100%; /* 2 */
+  -moz-tab-size: 4; /* 3 */
+  tab-size: 4; /* 3 */
+  font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
+    'Noto Color Emoji'; /* 4 */
+  font-feature-settings: normal; /* 5 */
+  font-variation-settings: normal; /* 6 */
+  -webkit-tap-highlight-color: transparent; /* 7 */
+}
+
+/*
+1. Remove the margin in all browsers.
+2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
+*/
+
+body {
+  margin: 0; /* 1 */
+  line-height: inherit; /* 2 */
+}
+
+/*
+1. Add the correct height in Firefox.
+2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
+3. Ensure horizontal rules are visible by default.
+*/
+
+hr {
+  height: 0; /* 1 */
+  color: inherit; /* 2 */
+  border-top-width: 1px; /* 3 */
+}
+
+/*
+Add the correct text decoration in Chrome, Edge, and Safari.
+*/
+
+abbr:where([title]) {
+  text-decoration: underline dotted;
+}
+
+/*
+Remove the default font size and weight for headings.
+*/
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-size: inherit;
+  font-weight: inherit;
+}
+
+/*
+Reset links to optimize for opt-in styling instead of opt-out.
+*/
+
 a {
-  text-decoration: none;
  color: inherit;
+  text-decoration: inherit;
 }

-a:hover,
-a:link,
-a:visited,
-a:active {
-  text-decoration: none;
+/*
+Add the correct font weight in Edge and Safari.
+*/
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+/*
+1. Use the user's configured `mono` font-family by default.
+2. Use the user's configured `mono` font-feature-settings by default.
+3. Use the user's configured `mono` font-variation-settings by default.
+4. Correct the odd `em` font sizing in all browsers.
+*/
+
+code,
+kbd,
+samp,
+pre {
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace; /* 1 */
+  font-feature-settings: normal; /* 2 */
+  font-variation-settings: normal; /* 3 */
+  font-size: 1em; /* 4 */
+}
+
+/*
+Add the correct font size in all browsers.
+*/
+
+small {
+  font-size: 80%;
+}
+
+/*
+Prevent `sub` and `sup` elements from affecting the line height in all browsers.
+*/
+
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+/*
+1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
+2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
+3. Remove gaps between table borders by default.
+*/
+
+table {
+  text-indent: 0; /* 1 */
+  border-color: inherit; /* 2 */
+  border-collapse: collapse; /* 3 */
+}
+
+/*
+1. Change the font styles in all browsers.
+2. Remove the margin in Firefox and Safari.
+3. Remove default padding in all browsers.
+*/
+
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: inherit; /* 1 */
+  font-feature-settings: inherit; /* 1 */
+  font-variation-settings: inherit; /* 1 */
+  font-size: 100%; /* 1 */
+  font-weight: inherit; /* 1 */
+  line-height: inherit; /* 1 */
+  color: inherit; /* 1 */
+  margin: 0; /* 2 */
+  padding: 0; /* 3 */
+}
+
+/*
+Remove the inheritance of text transform in Edge and Firefox.
+*/
+
+button,
+select {
+  text-transform: none;
+}
+
+/*
+1. Correct the inability to style clickable types in iOS and Safari.
+2. Remove default button styles.
+*/
+
+button,
+[type='button'],
+[type='reset'],
+[type='submit'] {
+  -webkit-appearance: button; /* 1 */
+  /* background-color: transparent;  */
+  background-image: none; /* 2 */
+}
+
+/*
+Use the modern Firefox focus style for all focusable elements.
+*/
+
+:-moz-focusring {
+  outline: auto;
+}
+
+/*
+Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
+*/
+
+:-moz-ui-invalid {
+  box-shadow: none;
+}
+
+/*
+Add the correct vertical alignment in Chrome and Firefox.
+*/
+
+progress {
+  vertical-align: baseline;
+}
+
+/*
+Correct the cursor style of increment and decrement buttons in Safari.
+*/
+
+::-webkit-inner-spin-button,
+::-webkit-outer-spin-button {
+  height: auto;
+}
+
+/*
+1. Correct the odd appearance in Chrome and Safari.
+2. Correct the outline style in Safari.
+*/
+
+[type='search'] {
+  -webkit-appearance: textfield; /* 1 */
+  outline-offset: -2px; /* 2 */
+}
+
+/*
+Remove the inner padding in Chrome and Safari on macOS.
+*/
+
+::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+/*
+1. Correct the inability to style clickable types in iOS and Safari.
+2. Change font properties to `inherit` in Safari.
+*/
+
+::-webkit-file-upload-button {
+  -webkit-appearance: button; /* 1 */
+  font: inherit; /* 2 */
+}
+
+/*
+Add the correct display in Chrome and Safari.
+*/
+
+summary {
+  display: list-item;
+}
+
+/*
+Removes the default spacing for appropriate elements.
+*/
+
+blockquote,
+dl,
+dd,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+hr,
+figure,
+p,
+pre {
+  margin: 0;
+}
+
+fieldset {
+  margin: 0;
+  padding: 0;
+}
+
+legend {
+  padding: 0;
 }

 ol,
-ul {
+ul,
+menu {
  list-style: none;
+  margin: 0;
+  padding: 0;
 }

-input,
-textarea {
-  outline: none;
-  border: none;
-  resize: none;
+dialog {
+  padding: 0;
 }

+/*
+Prevent resizing textareas horizontally by default.
+*/
+
+textarea {
+  resize: vertical;
+}
+
+/*
+1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
+2. Set the default placeholder color to the user's configured gray 400 color.
+*/
+
+input::placeholder,
+textarea::placeholder {
+  opacity: 1; /* 1 */
+  color: #9ca3af; /* 2 */
+}
+
+/*
+Set the default cursor for buttons.
+*/
+
+button,
+[role='button'] {
+  cursor: pointer;
+}
+
+/*
+Make sure disabled buttons don't get the pointer cursor.
+*/
+
+:disabled {
+  cursor: default;
+}
+
+/*
+1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
+2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
+   This can trigger a poorly considered lint error in some tools but is included by design.
+*/
+
+img,
+svg,
+video,
+canvas,
+audio,
+iframe,
+embed,
+object {
+  display: block; /* 1 */
+  vertical-align: middle; /* 2 */
+}
+
+/*
+Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
+*/
+
 img,
 video {
  max-width: 100%;
  height: auto;
 }
+
+/*
+Make elements with the HTML hidden attribute stay hidden by default.
+*/
+
+[hidden] {
+  display: none;
+}
--- a/src/utils/common.js
+++ b/src/utils/common.js
@@ -10,10 +10,10 @@
 import dayjs from 'dayjs'

 /**
- * @desc  格式化时间
- * @param {(Object|string|number)} time
+ * @param {(object | string | number)} time
 * @param {string} format
- * @returns {string | null}
+ * @returns {string | null} 格式化后的时间字符串
+ *
 */
 export function formatDateTime(time = undefined, format = 'YYYY-MM-DD HH:mm:ss') {
  return dayjs(time).format(format)
@@ -24,19 +24,19 @@ export function formatDate(date = undefined, format = 'YYYY-MM-DD') {
 }

 /**
- * @desc  函数节流
 * @param {Function} fn
- * @param {Number} wait
- * @returns {Function}
+ * @param {number} wait
+ * @returns {Function}  节流函数
+ *
 */
 export function throttle(fn, wait) {
-  var context, args
-  var previous = 0
+  let context, args
+  let previous = 0

-  return function () {
-    var now = +new Date()
+  return function (...argArr) {
+    const now = +new Date()
    context = this
-    args = arguments
+    args = argArr
    if (now - previous > wait) {
      fn.apply(context, args)
      previous = now
@@ -45,16 +45,15 @@ export function throttle(fn, wait) {
 }

 /**
- * @desc  函数防抖
- * @param {Function} func
+ * @param {Function} method
 * @param {number} wait
 * @param {boolean} immediate
- * @return {*}
+ * @return {*} 防抖函数
 */
 export function debounce(method, wait, immediate) {
  let timeout
  return function (...args) {
-    let context = this
+    const context = this
    if (timeout) {
      clearTimeout(timeout)
    }
@@ -64,14 +63,15 @@ export function debounce(method, wait, immediate) {
       * 如果定时器不存在，则立即执行，并设置一个定时器，wait毫秒后将定时器置为null
       * 这样确保立即执行后wait毫秒内不会被再次触发
       */
-      let callNow = !timeout
+      const callNow = !timeout
      timeout = setTimeout(() => {
        timeout = null
      }, wait)
      if (callNow) {
        method.apply(context, args)
      }
-    } else {
+    }
+    else {
      // 如果immediate为false，则函数wait毫秒后执行
      timeout = setTimeout(() => {
        /**
@@ -85,12 +85,11 @@ export function debounce(method, wait, immediate) {
 }

 /**
- * @desc  睡一会儿，让子弹暂停一下
 * @param {number} time 毫秒数
- * @returns
+ * @returns 睡一会儿，让子弹暂停一下
 */
 export function sleep(time) {
-  return new Promise((resolve) => setTimeout(resolve, time))
+  return new Promise(resolve => setTimeout(resolve, time))
 }

 /**
--- a/src/utils/http/helpers.js
+++ b/src/utils/http/helpers.js
@@ -10,10 +10,11 @@
 import { useAuthStore } from '@/store'

 let isConfirming = false
-export function resolveResError(code, message) {
+export function resolveResError(code, message, needTip = true) {
  switch (code) {
    case 401:
-      if (isConfirming) return
+      if (isConfirming || !needTip)
+        return
      isConfirming = true
      $dialog.confirm({
        title: '提示',
@@ -31,7 +32,8 @@ export function resolveResError(code, message) {
      return false
    case 11007:
    case 11008:
-      if (isConfirming) return
+      if (isConfirming || !needTip)
+        return
      isConfirming = true
      $dialog.confirm({
        title: '提示',
@@ -60,5 +62,6 @@ export function resolveResError(code, message) {
      message = message ?? `【${code}】: 未知异常!`
      break
  }
+  needTip && window.$message?.error(message)
  return message
 }
--- a/src/utils/http/interceptors.js
+++ b/src/utils/http/interceptors.js
@@ -7,29 +7,10 @@
 * Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
 **********************************/

-import { resolveResError } from './helpers'
 import { useAuthStore } from '@/store'
+import { resolveResError } from './helpers'

 export function setupInterceptors(axiosInstance) {
-  function reqResolve(config) {
-    // 处理不需要token的请求
-    if (config.noNeedToken) {
-      return config
-    }
-
-    const { accessToken } = useAuthStore()
-    if (accessToken) {
-      // token: Bearer + xxx
-      config.headers.Authorization = 'Bearer ' + accessToken
-    }
-
-    return config
-  }
-
-  function reqReject(error) {
-    return Promise.reject(error)
-  }
-
  const SUCCESS_CODES = [0, 200]
  function resResolve(response) {
    const { data, status, config, statusText, headers } = response
@@ -39,34 +20,51 @@ export function setupInterceptors(axiosInstance) {
      }
      const code = data?.code ?? status

-      // 根据code处理对应的操作，并返回处理后的message
-      const message = resolveResError(code, data?.message ?? statusText)
+      const needTip = config?.needTip !== false
+
+      // 根据code处理对应的操作，并返回处理后的message
+      const message = resolveResError(code, data?.message ?? statusText, needTip)

-      //需要错误提醒
-      !config?.noNeedTip && message && window.$message?.error(message)
      return Promise.reject({ code, message, error: data ?? response })
    }
    return Promise.resolve(data ?? response)
  }

-  async function resReject(error) {
-    if (!error || !error.response) {
-      const code = error?.code
-      /** 根据code处理对应的操作，并返回处理后的message */
-      const message = resolveResError(code, error.message)
-      window.$message?.error(message)
-      return Promise.reject({ code, message, error })
-    }
-
-    const { data, status, config } = error.response
-    const code = data?.code ?? status
-
-    const message = resolveResError(code, data?.message ?? error.message)
-    /** 需要错误提醒 */
-    !config?.noNeedTip && message && window.$message?.error(message)
-    return Promise.reject({ code, message, error: error.response?.data || error.response })
-  }
-
  axiosInstance.interceptors.request.use(reqResolve, reqReject)
  axiosInstance.interceptors.response.use(resResolve, resReject)
 }
+
+function reqResolve(config) {
+  // 处理不需要token的请求
+  if (config.needToken === false) {
+    return config
+  }
+
+  const { accessToken } = useAuthStore()
+  if (accessToken) {
+    // token: Bearer + xxx
+    config.headers.Authorization = `Bearer ${accessToken}`
+  }
+
+  return config
+}
+
+function reqReject(error) {
+  return Promise.reject(error)
+}
+
+async function resReject(error) {
+  if (!error || !error.response) {
+    const code = error?.code
+    /** 根据code处理对应的操作，并返回处理后的message */
+    const message = resolveResError(code, error.message)
+    return Promise.reject({ code, message, error })
+  }
+
+  const { data, status, config } = error.response
+  const code = data?.code ?? status
+
+  const needTip = config?.needTip !== false
+  const message = resolveResError(code, data?.message ?? error.message, needTip)
+  return Promise.reject({ code, message, error: error.response?.data || error.response })
+}
--- a/src/utils/is.js
+++ b/src/utils/is.js
@@ -99,28 +99,27 @@ export function isEmpty(val) {
 }

 /**
- * * 类似mysql的IFNULL函数
- * * 第一个参数为null/undefined/'' 则返回第二个参数作为备用值，否则返回第一个参数
- * @param {Number|Boolean|String} val
- * @param {Number|Boolean|String} def
- * @returns
+ * 类似mysql的IFNULL函数
+ *
+ * @param {number | boolean | string} val
+ * @param {number | boolean | string} def
+ * @returns 第一个参数为null | undefined | '' 则返回第二个参数作为备用值，否则返回第一个参数
 */
 export function ifNull(val, def = '') {
  return isNullOrWhitespace(val) ? def : val
 }

 export function isUrl(path) {
-  const reg =
-    /(((^https?:(?:\/\/)?)(?:[-;:&=+$,\w]+@)?[A-Za-z0-9.-]+(?::\d+)?|(?:www.|[-;:&=+$,\w]+@)[A-Za-z0-9.-]+)((?:\/[+~%/.\w-_]*)?\??(?:[-+=&;%@.\w_]*)#?(?:[\w]*))?)$/
+  const reg = /^https?:\/\/[-\w+&@#/%?=~|!:,.;]+[-\w+&@#/%=~|]$/
  return reg.test(path)
 }

 /**
 * @param {string} path
- * @returns {Boolean}
+ * @returns {boolean} 是否是外部链接
 */
 export function isExternal(path) {
-  return /^(https?:|mailto:|tel:)/.test(path)
+  return /^https?:|mailto:|tel:/.test(path)
 }

 export const isServer = typeof window === 'undefined'
--- a/src/utils/naiveTools.js
+++ b/src/utils/naiveTools.js
@@ -7,16 +7,17 @@
 * Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
 **********************************/

-import * as NaiveUI from 'naive-ui'
-import { isNullOrUndef } from '@/utils'
 import { useAppStore } from '@/store'
+import { isNullOrUndef } from '@/utils'
+import * as NaiveUI from 'naive-ui'

 export function setupMessage(NMessage) {
  class Message {
    static instance
    constructor() {
      // 单例模式
-      if (Message.instance) return Message.instance
+      if (Message.instance)
+        return Message.instance
      Message.instance = this
      this.message = {}
      this.removeTimer = {}
@@ -37,7 +38,7 @@ export function setupMessage(NMessage) {

    showMessage(type, content, option = {}) {
      if (Array.isArray(content)) {
-        return content.forEach((msg) => NMessage[type](msg, option))
+        return content.forEach(msg => NMessage[type](msg, option))
      }

      if (!option.key) {
@@ -48,7 +49,8 @@ export function setupMessage(NMessage) {
      if (currentMessage) {
        currentMessage.type = type
        currentMessage.content = content
-      } else {
+      }
+      else {
        this.message[option.key] = NMessage[type](content, {
          ...option,
          duration: 0,
@@ -109,7 +111,7 @@ export function setupNaiveDiscreteApi() {
  }))
  const { message, dialog, notification, loadingBar } = NaiveUI.createDiscreteApi(
    ['message', 'dialog', 'notification', 'loadingBar'],
-    { configProviderProps }
+    { configProviderProps },
  )

  window.$loadingBar = loadingBar
--- a/src/utils/storage/storage.js
+++ b/src/utils/storage/storage.js
@@ -35,7 +35,8 @@ class Storage {

  getItem(key, def = null) {
    const val = this.storage.getItem(this.getKey(key))
-    if (!val) return def
+    if (!val)
+      return def
    try {
      const data = JSON.parse(val)
      const { value, time, expire } = data
@@ -44,7 +45,9 @@ class Storage {
      }
      this.remove(key)
      return def
-    } catch (error) {
+    }
+    catch (error) {
+      console.error(error)
      this.remove(key)
      return def
    }
--- a/src/views/base/index.vue
+++ b/src/views/base/index.vue
@@ -12,12 +12,24 @@
      <n-card title="按钮 Button">
        <n-space>
          <n-button>Default</n-button>
-          <n-button type="tertiary">Tertiary</n-button>
-          <n-button type="primary">Primary</n-button>
-          <n-button type="info">Info</n-button>
-          <n-button type="success">Success</n-button>
-          <n-button type="warning">Warning</n-button>
-          <n-button type="error">Error</n-button>
+          <n-button type="tertiary">
+            Tertiary
+          </n-button>
+          <n-button type="primary">
+            Primary
+          </n-button>
+          <n-button type="info">
+            Info
+          </n-button>
+          <n-button type="success">
+            Success
+          </n-button>
+          <n-button type="warning">
+            Warning
+          </n-button>
+          <n-button type="error">
+            Error
+          </n-button>
        </n-space>
      </n-card>

@@ -46,10 +58,18 @@
    <n-space size="large" mt-30>
      <n-card min-w-340 title="通知 Notification">
        <n-space>
-          <n-button @click="notify('info')">信息</n-button>
-          <n-button @click="notify('success')">成功</n-button>
-          <n-button @click="notify('warning')">警告</n-button>
-          <n-button @click="notify('error')">错误</n-button>
+          <n-button @click="notify('info')">
+            信息
+          </n-button>
+          <n-button @click="notify('success')">
+            成功
+          </n-button>
+          <n-button @click="notify('warning')">
+            警告
+          </n-button>
+          <n-button @click="notify('error')">
+            错误
+          </n-button>
        </n-space>
      </n-card>

@@ -66,7 +86,9 @@
            <i v-show="!loading" class="i-mdi:login mr-4" />
            登录
          </n-button>
-          <n-button type="error" @click="handleMultiMessage">多个错误提醒</n-button>
+          <n-button type="error" @click="handleMultiMessage">
+            多个错误提醒
+          </n-button>
        </n-space>
      </n-card>
    </n-space>
@@ -75,6 +97,7 @@

 <script setup>
 import { sleep } from '@/utils'
+
 const handleDelete = function () {
  $dialog.confirm({
    content: '确认删除？',
--- a/src/views/base/keep-alive.vue
+++ b/src/views/base/keep-alive.vue
@@ -11,7 +11,9 @@
    <div w-350>
      <n-input v-model:value="inputVal" />
      <n-input-number v-model:value="number" mt-30 />
-      <p mt-20 text-center text-14 color-gray>注：右击标签重新加载可重置keep-alive</p>
+      <p mt-20 text-center text-14 color-gray>
+        注：右击标签重新加载可重置keep-alive
+      </p>
    </div>
  </CommonPage>
 </template>
--- a/src/views/base/test-modal.vue
+++ b/src/views/base/test-modal.vue
@@ -8,7 +8,9 @@

 <template>
  <CommonPage show-footer>
-    <n-button type="primary" @click="openModal1">打开第一个弹个窗</n-button>
+    <n-button type="primary" @click="openModal1">
+      打开第一个弹个窗
+    </n-button>
    <MeModal ref="$modal1">
      <n-input v-model:value="text" />
    </MeModal>
@@ -20,8 +22,8 @@

 <script setup>
 import { MeModal } from '@/components'
-import { sleep } from '@/utils'
 import { useModal } from '@/composables'
+import { sleep } from '@/utils'

 const text = ref('')
 const [$modal1, okLoading1] = useModal()
--- a/src/views/base/unocss-icon.vue
+++ b/src/views/base/unocss-icon.vue
@@ -9,16 +9,27 @@
 <template>
  <CommonPage show-footer>
    <template #title-suffix>
-      <n-tag class="ml-12" type="primary">feather图标集 + isme自定义图标</n-tag>
+      <n-tooltip
+        placement="bottom"
+        trigger="hover"
+      >
+        <template #trigger>
+          <a href="https://juejin.cn/post/7394789388154241033" target="_blank" class="ml-12 flex cursor-pointer items-center hover:underline">
+            <i class="i-simple-icons:juejin text-#1E80FF" />
+            <span class="ml-4">Unocss 图标</span>
+          </a>
+        </template>
+        点击查看如何使用 Unocss 图标
+      </n-tooltip>
    </template>
-    <ul class="flex flex-wrap justify-between">
+    <ul class="grid grid-cols-[repeat(auto-fill,minmax(160px,1fr))] justify-items-center gap-16">
      <li
        v-for="item in icons"
        :key="item"
-        class="m-16 w-160 f-c-c flex-col cursor-pointer rounded-12 px-12 py-24 card-border auto-bg"
+        class="w-160 f-c-c flex-col cursor-pointer rounded-12 px-12 py-24 card-border auto-bg"
        @click="copy(`&lt;i class=&quot;${item}&quot; /&gt;`)"
      >
-        <i :class="item + '?mask'" class="text-28 text-gray-600 hover:bg-primary" />
+        <i :class="`${item}?mask`" class="text-28 text-gray-600 hover:bg-primary" />
        <span
          class="mt-16 text-center text-14 text-gray-400 hover:color-primary"
          @click.stop="copy(item)"
@@ -26,13 +37,6 @@
          {{ item }}
        </span>
      </li>
-      <li class="mx-16 h-0 w-160"></li>
-      <li class="mx-16 h-0 w-160"></li>
-      <li class="mx-16 h-0 w-160"></li>
-      <li class="mx-16 h-0 w-160"></li>
-      <li class="mx-16 h-0 w-160"></li>
-      <li class="mx-16 h-0 w-160"></li>
-      <li class="mx-16 h-0 w-160"></li>
    </ul>
  </CommonPage>
 </template>
@@ -44,6 +48,7 @@ import icons from 'isme:icons'
 const { copy, copied } = useClipboard()

 watch(copied, (val) => {
-  val && $message.success('已复制到剪切板')
+  if (val)
+    $message.success('已复制到剪切板')
 })
 </script>
--- a/src/views/demo/upload/index.vue
+++ b/src/views/demo/upload/index.vue
@@ -18,7 +18,9 @@
      <n-upload-dragger>
        <div class="h-150 f-c-c flex-col">
          <i class="i-mdi:upload mb-12 text-68 color-primary" />
-          <n-text class="text-14 color-gray">点击或者拖动文件到该区域来上传</n-text>
+          <n-text class="text-14 color-gray">
+            点击或者拖动文件到该区域来上传
+          </n-text>
        </div>
      </n-upload-dragger>
    </n-upload>
@@ -31,7 +33,9 @@
              <n-image width="200" :src="item.url" />
            </div>
            <n-space class="mt-16" justify="space-evenly">
-              <n-button dashed type="primary" @click="copy(item.url)">url</n-button>
+              <n-button dashed type="primary" @click="copy(item.url)">
+                url
+              </n-button>
              <n-button dashed type="primary" @click="copy(`![${item.fileName}](${item.url})`)">
                MD
              </n-button>
@@ -53,19 +57,20 @@

 <script setup>
 import { useClipboard } from '@vueuse/core'
+
 defineOptions({ name: 'ImgUpload' })

 const { copy, copied } = useClipboard()

 const imgList = reactive([
-  { url: 'https://cdn.isme.top/images/5c23d52f880511ebb6edd017c2d2eca2.jpg' },
-  { url: 'https://cdn.isme.top/images/5c23d52f880511ebb6edd017c2d2eca2.jpg' },
-  { url: 'https://cdn.isme.top/images/5c23d52f880511ebb6edd017c2d2eca2.jpg' },
-  { url: 'https://cdn.isme.top/images/5c23d52f880511ebb6edd017c2d2eca2.jpg' },
+  { url: 'https://img.isme.top/isme/67208863145ef.jpg' },
+  { url: 'https://img.isme.top/isme/67208ab2a9de0.jpg' },
+  { url: 'https://img.isme.top/isme/67208ab4c6596.jpg' },
 ])

 watch(copied, (val) => {
-  val && $message.success('已复制到剪切板')
+  if (val)
+    $message.success('已复制到剪切板')
 })

 function onBeforeUpload({ file }) {
--- a/src/views/error-page/403.vue
+++ b/src/views/error-page/403.vue
@@ -20,7 +20,9 @@
          <n-button v-if="back" type="primary" ghost @click="router.replace(back)">
            返回上一页
          </n-button>
-          <n-button type="primary" class="ml-20" @click="router.replace('/')">返回首页</n-button>
+          <n-button type="primary" class="ml-20" @click="router.replace('/')">
+            返回首页
+          </n-button>
        </template>
      </n-result>
    </div>
@@ -35,7 +37,8 @@ const back = history.state.back

 if (history.state.from === 'permission-guard') {
  delete history.state.from
-} else if (route.query.path) {
+}
+else if (route.query.path) {
  router.replace(route.query.path)
 }
 </script>
--- a/src/views/error-page/404.vue
+++ b/src/views/error-page/404.vue
@@ -17,7 +17,9 @@
        size="large"
      >
        <template #footer>
-          <n-button type="primary" ghost @click="replace('/')">返回首页</n-button>
+          <n-button type="primary" ghost @click="replace('/')">
+            返回首页
+          </n-button>
        </template>
      </n-result>
    </div>
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -20,8 +20,12 @@
          </div>
        </div>

-        <p class="mt-28 text-14 opacity-60">一个人几乎可以在任何他怀有无限热忱的事情上成功。</p>
-        <p class="mt-12 text-right text-12 opacity-40">—— 查尔斯·史考伯</p>
+        <p class="mt-28 text-14 opacity-60">
+          一个人几乎可以在任何他怀有无限热忱的事情上成功。
+        </p>
+        <p class="mt-12 text-right text-12 opacity-40">
+          —— 查尔斯·史考伯
+        </p>
      </n-card>
      <n-card class="ml-12 w-70%" title="✨ 欢迎使用 Vue Naive Admin 2.0">
        <template #header-extra>
@@ -45,7 +49,7 @@
            type="primary"
            ghost
            tag="a"
-            href="https://docs.isme.top/web/#/624306705/188522224"
+            href="https://isme.top"
            target="__blank"
          >
            开发文档
@@ -157,9 +161,9 @@

 <script setup>
 import { useUserStore } from '@/store'
-import * as echarts from 'echarts/core'
-import { TooltipComponent, GridComponent, LegendComponent } from 'echarts/components'
 import { BarChart, LineChart, PieChart } from 'echarts/charts'
+import { GridComponent, LegendComponent, TooltipComponent } from 'echarts/components'
+import * as echarts from 'echarts/core'
 import { UniversalTransition } from 'echarts/features'
 import { CanvasRenderer } from 'echarts/renderers'
 import VChart from 'vue-echarts'
--- a/src/views/iframe/index.vue
+++ b/src/views/iframe/index.vue
@@ -1,6 +1,6 @@
 <template>
  <AppPage full>
-    <iframe :src="route.meta.originPath" frameborder="0" class="wh-full"></iframe>
+    <iframe :src="route.meta.originPath" frameborder="0" class="wh-full" />
  </AppPage>
 </template>

--- a/src/views/login/api.js
+++ b/src/views/login/api.js
@@ -9,7 +9,7 @@
 import { request } from '@/utils'

 export default {
-  toggleRole: (data) => request.post('/auth/role/toggle', data),
-  login: (data) => request.post('/auth/login', data, { noNeedToken: true }),
+  toggleRole: data => request.post('/auth/role/toggle', data),
+  login: data => request.post('/auth/login', data, { needToken: false }),
  getUser: () => request.get('/user/detail'),
 }
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -12,12 +12,12 @@
      class="m-auto max-w-700 min-w-345 f-c-c rounded-8 bg-opacity-20 bg-cover p-12 card-shadow auto-bg"
    >
      <div class="hidden w-380 px-20 py-35 md:block">
-        <img src="@/assets/images/login_banner.webp" class="w-full" alt="login_banner" />
+        <img src="@/assets/images/login_banner.webp" class="w-full" alt="login_banner">
      </div>

      <div class="w-320 flex-col px-20 py-32">
        <h2 class="f-c-c text-24 text-#6a6a6a font-normal">
-          <img src="@/assets/images/logo.png" class="mr-12 h-50" />
+          <img src="@/assets/images/logo.png" class="mr-12 h-50">
          {{ title }}
        </h2>
        <n-input
@@ -64,7 +64,7 @@
            height="40"
            class="ml-12 w-80 cursor-pointer"
            @click="initCaptcha"
-          />
+          >
        </div>

        <n-checkbox
@@ -101,10 +101,10 @@
 </template>

 <script setup>
-import { throttle, lStorage } from '@/utils'
+import { useAuthStore } from '@/store'
+import { lStorage, throttle } from '@/utils'
 import { useStorage } from '@vueuse/core'
 import api from './api'
-import { useAuthStore } from '@/store'

 const authStore = useAuthStore()
 const router = useRouter()
@@ -118,7 +118,7 @@ const loginInfo = ref({

 const captchaUrl = ref('')
 const initCaptcha = throttle(() => {
-  captchaUrl.value = import.meta.env.VITE_AXIOS_BASE_URL + '/auth/captcha?' + Date.now()
+  captchaUrl.value = `${import.meta.env.VITE_AXIOS_BASE_URL}/auth/captcha?${Date.now()}`
 }, 500)

 const localLoginInfo = lStorage.get('loginInfo')
@@ -138,19 +138,23 @@ const isRemember = useStorage('isRemember', true)
 const loading = ref(false)
 async function handleLogin(isQuick) {
  const { username, password, captcha } = loginInfo.value
-  if (!username || !password) return $message.warning('请输入用户名和密码')
-  if (!isQuick && !captcha) return $message.warning('请输入验证码')
+  if (!username || !password)
+    return $message.warning('请输入用户名和密码')
+  if (!isQuick && !captcha)
+    return $message.warning('请输入验证码')
  try {
    loading.value = true
    $message.loading('正在验证，请稍后...', { key: 'login' })
    const { data } = await api.login({ username, password: password.toString(), captcha, isQuick })
    if (isRemember.value) {
      lStorage.set('loginInfo', { username, password })
-    } else {
+    }
+    else {
      lStorage.remove('loginInfo')
    }
    onLoginSuccess(data)
-  } catch (error) {
+  }
+  catch (error) {
    // 10003为验证码错误专属业务码
    if (error?.code === 10003) {
      // 为防止爆破，验证码错误则刷新验证码
@@ -171,10 +175,12 @@ async function onLoginSuccess(data = {}) {
      const path = route.query.redirect
      delete route.query.redirect
      router.push({ path, query: route.query })
-    } else {
+    }
+    else {
      router.push('/')
    }
-  } catch (error) {
+  }
+  catch (error) {
    console.error(error)
    $message.destroy('login')
  }
--- a/src/views/pms/resource/api.js
+++ b/src/views/pms/resource/api.js
@@ -6,14 +6,14 @@
 * Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
 **********************************/

-import axios from 'axios'
 import { request } from '@/utils'
+import axios from 'axios'

 export default {
  getMenuTree: () => request.get('/permission/menu/tree'),
  getButtons: ({ parentId }) => request.get(`/permission/button/${parentId}`),
  getComponents: () => axios.get(`${import.meta.env.VITE_PUBLIC_PATH}components.json`),
-  addPermission: (data) => request.post('/permission', data),
+  addPermission: data => request.post('/permission', data),
  savePermission: (id, data) => request.patch(`/permission/${id}`, data),
-  deletePermission: (id) => request.delete(`permission/${id}`),
+  deletePermission: id => request.delete(`permission/${id}`),
 }
--- a/src/views/pms/resource/components/MenuTree.vue
+++ b/src/views/pms/resource/components/MenuTree.vue
@@ -12,10 +12,10 @@
      <h3>菜单</h3>
      <div class="flex">
        <n-input v-model:value="pattern" placeholder="搜索" clearable />
-        <n-button class="ml-12" type="primary" @click="handleAdd()">
+        <NButton class="ml-12" type="primary" @click="handleAdd()">
          <i class="i-material-symbols:add mr-4 text-14" />
          新增
-        </n-button>
+        </NButton>
      </div>

      <n-tree
@@ -28,8 +28,8 @@
        :on-update:selected-keys="onSelect"
        key-field="code"
        label-field="name"
-        block-line
-        default-expand-all
+
+        block-line default-expand-all
      />
    </n-space>

@@ -38,10 +38,10 @@
 </template>

 <script setup>
-import { withModifiers } from 'vue'
-import ResAddOrEdit from './ResAddOrEdit.vue'
 import { NButton } from 'naive-ui'
+import { withModifiers } from 'vue'
 import api from '../api'
+import ResAddOrEdit from './ResAddOrEdit.vue'

 defineProps({
  treeData: {
@@ -86,7 +86,7 @@ function renderSuffix({ option }) {
        size: 'tiny',
        onClick: withModifiers(() => handleAdd({ parentId: option.id }), ['stop']),
      },
-      { default: () => '新增' }
+      { default: () => '新增' },
    ),

    h(
@@ -98,7 +98,7 @@ function renderSuffix({ option }) {
        style: 'margin-left: 12px;',
        onClick: withModifiers(() => handleDelete(option), ['stop']),
      },
-      { default: () => '删除' }
+      { default: () => '删除' },
    ),
  ]
 }
@@ -113,7 +113,9 @@ function handleDelete(item) {
        $message.success('删除成功', { key: 'deleteMenu' })
        emit('refresh')
        emit('update:currentMenu', null)
-      } catch (error) {
+      }
+      catch (error) {
+        console.error(error)
        $message.destroy('deleteMenu')
      }
    },
--- a/src/views/pms/resource/components/ResAddOrEdit.vue
+++ b/src/views/pms/resource/components/ResAddOrEdit.vue
@@ -99,8 +99,12 @@
            <QuestionLabel label="显示状态" content="控制是否在菜单栏显示，不影响路由注册" />
          </template>
          <n-switch v-model:value="modalForm.show">
-            <template #checked>显示</template>
-            <template #unchecked>隐藏</template>
+            <template #checked>
+              显示
+            </template>
+            <template #unchecked>
+              隐藏
+            </template>
          </n-switch>
        </n-form-item-gi>
        <n-form-item-gi :span="12" path="enable">
@@ -111,8 +115,12 @@
            />
          </template>
          <n-switch v-model:value="modalForm.enable">
-            <template #checked>启用</template>
-            <template #unchecked>禁用</template>
+            <template #checked>
+              启用
+            </template>
+            <template #unchecked>
+              禁用
+            </template>
          </n-switch>
        </n-form-item-gi>
        <n-form-item-gi v-if="modalForm.type === 'MENU'" :span="12" path="keepAlive">
@@ -123,8 +131,12 @@
            />
          </template>
          <n-switch v-model:value="modalForm.keepAlive">
-            <template #checked>是</template>
-            <template #unchecked>否</template>
+            <template #checked>
+              是
+            </template>
+            <template #unchecked>
+              否
+            </template>
          </n-switch>
        </n-form-item-gi>
        <n-form-item-gi
@@ -148,11 +160,11 @@

 <script setup>
 import { MeModal } from '@/components'
-import QuestionLabel from './QuestionLabel.vue'
 import { useForm, useModal } from '@/composables'
-import api from '../api'
-import pagePathes from 'isme:page-pathes'
 import icons from 'isme:icons'
+import pagePathes from 'isme:page-pathes'
+import api from '../api'
+import QuestionLabel from './QuestionLabel.vue'

 const props = defineProps({
  menus: {
@@ -165,10 +177,10 @@ const emit = defineEmits(['refresh'])
 const menuOptions = computed(() => {
  return [{ name: '根菜单', id: '', children: props.menus || [] }]
 })
-const componentOptions = pagePathes.map((path) => ({ label: path, value: path }))
-const iconOptions = icons.map((item) => ({
+const componentOptions = pagePathes.map(path => ({ label: path, value: path }))
+const iconOptions = icons.map(item => ({
  label: () =>
-    h('span', { class: 'flex items-center' }, [h('i', { class: item + ' text-18 mr-8' }), item]),
+    h('span', { class: 'flex items-center' }, [h('i', { class: `${item} text-18 mr-8` }), item]),
  value: item,
 }))
 const layoutOptions = [
@@ -203,17 +215,20 @@ async function onSave() {
  okLoading.value = true
  try {
    let newFormData
-    if (!modalForm.value.parentId) modalForm.value.parentId = null
+    if (!modalForm.value.parentId)
+      modalForm.value.parentId = null
    if (modalAction.value === 'add') {
      const res = await api.addPermission(modalForm.value)
      newFormData = res.data
-    } else if (modalAction.value === 'edit') {
+    }
+    else if (modalAction.value === 'edit') {
      await api.savePermission(modalForm.value.id, modalForm.value)
    }
    okLoading.value = false
    $message.success('保存成功')
    emit('refresh', modalAction.value === 'add' ? newFormData : modalForm.value)
-  } catch (error) {
+  }
+  catch (error) {
    console.error(error)
    okLoading.value = false
    return false
--- a/src/views/pms/resource/index.vue
+++ b/src/views/pms/resource/index.vue
@@ -11,7 +11,7 @@
    <div class="flex">
      <n-spin size="small" :show="treeLoading">
        <MenuTree
-          v-model:currentMenu="currentMenu"
+          v-model:current-menu="currentMenu"
          class="w-320 shrink-0"
          :tree-data="treeData"
          @refresh="initData"
@@ -21,15 +21,21 @@
      <div class="ml-40 w-0 flex-1">
        <template v-if="currentMenu">
          <div class="flex justify-between">
-            <h3 class="mb-12">{{ currentMenu.name }}</h3>
-            <n-button size="small" type="primary" @click="handleEdit(currentMenu)">
+            <h3 class="mb-12">
+              {{ currentMenu.name }}
+            </h3>
+            <NButton size="small" type="primary" @click="handleEdit(currentMenu)">
              <i class="i-material-symbols:edit-outline mr-4 text-14" />
              编辑
-            </n-button>
+            </NButton>
          </div>
          <n-descriptions label-placement="left" bordered :column="2">
-            <n-descriptions-item label="编码">{{ currentMenu.code }}</n-descriptions-item>
-            <n-descriptions-item label="名称">{{ currentMenu.name }}</n-descriptions-item>
+            <n-descriptions-item label="编码">
+              {{ currentMenu.code }}
+            </n-descriptions-item>
+            <n-descriptions-item label="名称">
+              {{ currentMenu.name }}
+            </n-descriptions-item>
            <n-descriptions-item label="路由地址">
              {{ currentMenu.path ?? '--' }}
            </n-descriptions-item>
@@ -61,11 +67,13 @@
          </n-descriptions>

          <div class="mt-32 flex justify-between">
-            <h3 class="mb-12">按钮</h3>
-            <n-button size="small" type="primary" @click="handleAddBtn">
+            <h3 class="mb-12">
+              按钮
+            </h3>
+            <NButton size="small" type="primary" @click="handleAddBtn">
              <i class="i-fe:plus mr-4 text-14" />
              新增
-            </n-button>
+            </NButton>
          </div>

          <MeCrud
@@ -73,8 +81,9 @@
            :columns="btnsColumns"
            :scroll-x="-1"
            :get-data="api.getButtons"
+            :computed-height="300"
            :query-items="{ parentId: currentMenu.id }"
-          ></MeCrud>
+          />
        </template>
        <n-empty v-else class="h-450 f-c-c" size="large" description="请选择菜单查看详情" />
      </div>
@@ -84,14 +93,16 @@
 </template>

 <script setup>
+import { MeCrud } from '@/components'
 import { NButton, NSwitch } from 'naive-ui'
+import api from './api'
 import MenuTree from './components/MenuTree.vue'
 import ResAddOrEdit from './components/ResAddOrEdit.vue'
-import { MeCrud } from '@/components'
-import api from './api'

 const treeData = ref([])
 const treeLoading = ref(false)
+const $table = ref(null)
+const currentMenu = ref(null)
 async function initData(data) {
  if (data?.type === 'BUTTON') {
    $table.value.handleSearch()
@@ -102,17 +113,16 @@ async function initData(data) {
  treeData.value = res?.data || []
  treeLoading.value = false

-  if (data) currentMenu.value = data
+  if (data)
+    currentMenu.value = data
 }
 initData()

-const currentMenu = ref(null)
-
 const modalRef = ref(null)
 function handleEdit(item = {}) {
  modalRef.value?.handleOpen({
    action: 'edit',
-    title: '编辑菜单 - ' + item.name,
+    title: `编辑菜单 - ${item.name}`,
    row: item,
    okText: '保存',
  })
@@ -124,7 +134,7 @@ const btnsColumns = [
  {
    title: '状态',
    key: 'enable',
-    render: (row) =>
+    render: row =>
      h(
        NSwitch,
        {
@@ -137,7 +147,7 @@ const btnsColumns = [
        {
          checked: () => '启用',
          unchecked: () => '停用',
-        }
+        },
      ),
  },
  {
@@ -159,7 +169,7 @@ const btnsColumns = [
          {
            default: () => '编辑',
            icon: () => h('i', { class: 'i-material-symbols:edit-outline text-14' }),
-          }
+          },
        ),

        h(
@@ -173,20 +183,20 @@ const btnsColumns = [
          {
            default: () => '删除',
            icon: () => h('i', { class: 'i-material-symbols:delete-outline text-14' }),
-          }
+          },
        ),
      ]
    },
  },
 ]
-const $table = ref(null)

 watch(
  () => currentMenu.value,
  async (v) => {
    await nextTick()
-    if (v) $table.value.handleSearch()
-  }
+    if (v)
+      $table.value.handleSearch()
+  },
 )

 function handleAddBtn() {
@@ -201,7 +211,7 @@ function handleAddBtn() {
 function handleEditBtn(row) {
  modalRef.value?.handleOpen({
    action: 'edit',
-    title: '编辑按钮 - ' + row.name,
+    title: `编辑按钮 - ${row.name}`,
    row,
    okText: '保存',
  })
@@ -220,7 +230,9 @@ function handleDeleteBtn(id) {
        $message.success('删除成功')
        $table.value.handleSearch()
        d.loading = false
-      } catch (error) {
+      }
+      catch (error) {
+        console.error(error)
        d.loading = false
      }
    },
@@ -236,7 +248,9 @@ async function handleEnable(item) {
    $message.success('操作成功')
    $table.value?.handleSearch()
    item.enableLoading = false
-  } catch (error) {
+  }
+  catch (error) {
+    console.error(error)
    item.enableLoading = false
  }
 }
--- a/src/views/pms/role/api.js
+++ b/src/views/pms/role/api.js
@@ -9,10 +9,10 @@
 import { request } from '@/utils'

 export default {
-  create: (data) => request.post('/role', data),
+  create: data => request.post('/role', data),
  read: (params = {}) => request.get('/role/page', { params }),
-  update: (data) => request.patch(`/role/${data.id}`, data),
-  delete: (id) => request.delete(`/role/${id}`),
+  update: data => request.patch(`/role/${data.id}`, data),
+  delete: id => request.delete(`/role/${id}`),

  getAllPermissionTree: () => request.get('/permission/tree'),
  getAllUsers: (params = {}) => request.get('/user', { params }),
--- a/src/views/pms/role/index.vue
+++ b/src/views/pms/role/index.vue
@@ -9,10 +9,10 @@
 <template>
  <CommonPage>
    <template #action>
-      <n-button type="primary" @click="handleAdd()">
+      <NButton type="primary" @click="handleAdd()">
        <i class="i-material-symbols:add mr-4 text-18" />
        新增角色
-      </n-button>
+      </NButton>
    </template>

    <MeCrud
@@ -74,17 +74,20 @@
            :data="permissionTree"
            :checked-keys="modalForm.permissionIds"
            :on-update:checked-keys="(keys) => (modalForm.permissionIds = keys)"
-            default-expand-all
-            checkable
-            check-on-click
+
+            default-expand-all checkable check-on-click
            class="cus-scroll max-h-200 w-full"
          />
        </n-form-item>
        <n-form-item label="状态" path="enable">
-          <n-switch v-model:value="modalForm.enable">
-            <template #checked>启用</template>
-            <template #unchecked>停用</template>
-          </n-switch>
+          <NSwitch v-model:value="modalForm.enable">
+            <template #checked>
+              启用
+            </template>
+            <template #unchecked>
+              停用
+            </template>
+          </NSwitch>
        </n-form-item>
      </n-form>
    </MeModal>
@@ -92,9 +95,9 @@
 </template>

 <script setup>
-import { NButton, NSwitch } from 'naive-ui'
-import { MeCrud, MeQueryItem, MeModal } from '@/components'
+import { MeCrud, MeModal, MeQueryItem } from '@/components'
 import { useCrud } from '@/composables'
+import { NButton, NSwitch } from 'naive-ui'
 import api from './api'

 defineOptions({ name: 'RoleMgt' })
@@ -109,13 +112,23 @@ onMounted(() => {
  $table.value?.handleSearch()
 })

+const { modalRef, modalFormRef, modalAction, modalForm, handleAdd, handleDelete, handleEdit }
+  = useCrud({
+    name: '角色',
+    doCreate: api.create,
+    doDelete: api.delete,
+    doUpdate: api.update,
+    initForm: { enable: true },
+    refresh: (_, keepCurrentPage) => $table.value?.handleSearch(keepCurrentPage),
+  })
+
 const columns = [
  { title: '角色名', key: 'name' },
  { title: '角色编码', key: 'code' },
  {
    title: '状态',
    key: 'enable',
-    render: (row) =>
+    render: row =>
      h(
        NSwitch,
        {
@@ -129,7 +142,7 @@ const columns = [
        {
          checked: () => '启用',
          unchecked: () => '停用',
-        }
+        },
      ),
  },
  {
@@ -152,7 +165,7 @@ const columns = [
          {
            default: () => '分配用户',
            icon: () => h('i', { class: 'i-fe:user-plus text-14' }),
-          }
+          },
        ),
        h(
          NButton,
@@ -166,7 +179,7 @@ const columns = [
          {
            default: () => '编辑',
            icon: () => h('i', { class: 'i-material-symbols:edit-outline text-14' }),
-          }
+          },
        ),

        h(
@@ -181,7 +194,7 @@ const columns = [
          {
            default: () => '删除',
            icon: () => h('i', { class: 'i-material-symbols:delete-outline text-14' }),
-          }
+          },
        ),
      ]
    },
@@ -195,21 +208,13 @@ async function handleEnable(row) {
    row.enableLoading = false
    $message.success('操作成功')
    $table.value?.handleSearch()
-  } catch (error) {
+  }
+  catch (error) {
+    console.error(error)
    row.enableLoading = false
  }
 }

-const { modalRef, modalFormRef, modalAction, modalForm, handleAdd, handleDelete, handleEdit } =
-  useCrud({
-    name: '角色',
-    doCreate: api.create,
-    doDelete: api.delete,
-    doUpdate: api.update,
-    initForm: { enable: true },
-    refresh: () => $table.value?.handleSearch(),
-  })
-
 const permissionTree = ref([])
 api.getAllPermissionTree().then(({ data = [] }) => (permissionTree.value = data))
 </script>
--- a/src/views/pms/role/role-user.vue
+++ b/src/views/pms/role/role-user.vue
@@ -9,15 +9,17 @@
 <template>
  <CommonPage back>
    <template #title-suffix>
-      <n-tag class="ml-12" type="warning">{{ route.query.roleName }}</n-tag>
+      <NTag class="ml-12" type="warning">
+        {{ route.query.roleName }}
+      </NTag>
    </template>
    <template #action>
      <div class="flex items-center">
-        <n-button :disabled="!userIds.length" type="error" @click="handleBatchRemove()">
+        <NButton :disabled="!userIds.length" type="error" @click="handleBatchRemove()">
          <i v-if="userIds.length" class="i-material-symbols:delete-outline mr-4 text-18" />
          批量取消授权
-        </n-button>
-        <n-button
+        </NButton>
+        <NButton
          class="ml-12"
          :disabled="!userIds.length"
          type="primary"
@@ -25,7 +27,7 @@
        >
          <i v-if="userIds.length" class="i-line-md:confirm-circle mr-4 text-18" />
          批量授权
-        </n-button>
+        </NButton>
      </div>
    </template>

@@ -35,6 +37,7 @@
      :scroll-x="1200"
      :columns="columns"
      :get-data="api.getAllUsers"
+      :show-check="true"
      @on-checked="onChecked"
    >
      <MeQueryItem label="用户名" :label-width="50">
@@ -65,11 +68,11 @@
 </template>

 <script setup>
-import { NAvatar, NButton, NSwitch, NTag } from 'naive-ui'
 import { MeCrud, MeQueryItem } from '@/components'
 import { formatDateTime } from '@/utils'
-import api from './api'
+import { NAvatar, NButton, NSwitch, NTag } from 'naive-ui'
 import { h } from 'vue'
+import api from './api'

 defineOptions({ name: 'RoleUser' })
 const route = useRoute()
@@ -88,7 +91,7 @@ const genders = [
 ]

 const columns = [
-  { type: 'selection', fixed: 'left' },
+  // { type: 'selection', fixed: 'left' },
  {
    title: '头像',
    key: 'avatar',
@@ -99,11 +102,10 @@ const columns = [
        src: avatar,
      }),
  },
-  { title: '用户名', key: 'username', width: 150, ellipsis: { tooltip: true } },
+  { title: '用户名', key: 'username', ellipsis: { tooltip: true } },
  {
    title: '角色',
    key: 'roles',
-    width: 200,
    ellipsis: { tooltip: true },
    render: ({ roles }) => {
      if (roles?.length) {
@@ -111,8 +113,8 @@ const columns = [
          h(
            NTag,
            { type: 'success', style: index > 0 ? 'margin-left: 8px;' : '' },
-            { default: () => item.name }
-          )
+            { default: () => item.name },
+          ),
        )
      }
      return '暂无角色'
@@ -122,14 +124,14 @@ const columns = [
    title: '性别',
    key: 'gender',
    width: 80,
-    render: ({ gender }) => genders.find((item) => gender === item.value)?.label ?? '',
+    render: ({ gender }) => genders.find(item => gender === item.value)?.label ?? '',
  },
  {
    title: '创建时间',
    key: 'createDate',
    width: 180,
    render(row) {
-      return h('span', formatDateTime(row['createTime']))
+      return h('span', formatDateTime(row.createTime))
    },
  },
  {
@@ -137,7 +139,7 @@ const columns = [
    key: 'enable',
    width: 100,

-    render: (row) =>
+    render: row =>
      h(
        NSwitch,
        {
@@ -148,44 +150,44 @@ const columns = [
        {
          checked: () => '启用',
          unchecked: () => '停用',
-        }
+        },
      ),
  },
  {
    title: '操作',
    key: 'actions',
-    width: 100,
+    width: 120,
    align: 'right',
    fixed: 'right',
    hideInExcel: true,
    render(row) {
-      return row.roles?.some((item) => item.id === +route.params.roleId)
+      return row.roles?.some(item => item.id === +route.params.roleId)
        ? h(
-            NButton,
-            {
-              size: 'small',
-              type: 'error',
-              secondary: true,
-              onClick: () => handleBatchRemove([row.id]),
-            },
-            {
-              default: () => '取消授权',
-              icon: () => h('i', { class: 'i-material-symbols:delete-outline text-14' }),
-            }
-          )
+          NButton,
+          {
+            size: 'small',
+            type: 'error',
+            secondary: true,
+            onClick: () => handleBatchRemove([row.id]),
+          },
+          {
+            default: () => '取消授权',
+            icon: () => h('i', { class: 'i-material-symbols:delete-outline text-14' }),
+          },
+        )
        : h(
-            NButton,
-            {
-              size: 'small',
-              type: 'primary',
-              secondary: true,
-              onClick: () => handleBatchAdd([row.id]),
-            },
-            {
-              default: () => '授权',
-              icon: () => h('i', { class: 'i-line-md:confirm-circle text-14' }),
-            }
-          )
+          NButton,
+          {
+            size: 'small',
+            type: 'primary',
+            secondary: true,
+            onClick: () => handleBatchAdd([row.id]),
+          },
+          {
+            default: () => '授权',
+            icon: () => h('i', { class: 'i-line-md:confirm-circle text-14' }),
+          },
+        )
    },
  },
 ]
@@ -197,8 +199,10 @@ function onChecked(rowKeys) {

 function handleBatchAdd(ids = userIds.value) {
  const roleId = route.params.roleId
-  if (!roleId) return $message.error('角色异常，请重新选择角色')
-  if (!ids.length) return $message.error('请先选择用户')
+  if (!roleId)
+    return $message.error('角色异常，请重新选择角色')
+  if (!ids.length)
+    return $message.error('请先选择用户')
  $dialog.confirm({
    content: `确认分配【${route.query.roleName}】？`,
    async confirm() {
@@ -209,8 +213,10 @@ function handleBatchAdd(ids = userIds.value) {
 }
 function handleBatchRemove(ids = userIds.value) {
  const roleId = route.params.roleId
-  if (!roleId) return $message.error('角色异常，请重新选择角色')
-  if (!ids.length) return $message.error('请先选择用户')
+  if (!roleId)
+    return $message.error('角色异常，请重新选择角色')
+  if (!ids.length)
+    return $message.error('请先选择用户')
  $dialog.confirm({
    content: `确认取消分配【${route.query.roleName}】？`,
    async confirm() {
--- a/src/views/pms/user/api.js
+++ b/src/views/pms/user/api.js
@@ -9,10 +9,10 @@
 import { request } from '@/utils'

 export default {
-  create: (data) => request.post('/user', data),
+  create: data => request.post('/user', data),
  read: (params = {}) => request.get('/user', { params }),
-  update: (data) => request.patch(`/user/${data.id}`, data),
-  delete: (id) => request.delete(`/user/${id}`),
+  update: data => request.patch(`/user/${data.id}`, data),
+  delete: id => request.delete(`/user/${id}`),
  resetPwd: (id, data) => request.patch(`/user/password/reset/${id}`, data),

  getAllRoles: () => request.get('/role?enable=1'),
--- a/src/views/pms/user/index.vue
+++ b/src/views/pms/user/index.vue
@@ -9,10 +9,10 @@
 <template>
  <CommonPage>
    <template #action>
-      <n-button v-permission="'AddUser'" type="primary" @click="handleAdd()">
+      <NButton v-permission="'AddUser'" type="primary" @click="handleAdd()">
        <i class="i-material-symbols:add mr-4 text-18" />
        创建新用户
-      </n-button>
+      </NButton>
    </template>

    <MeCrud
@@ -92,10 +92,14 @@
          />
        </n-form-item>
        <n-form-item v-if="modalAction === 'add'" label="状态" path="enable">
-          <n-switch v-model:value="modalForm.enable">
-            <template #checked>启用</template>
-            <template #unchecked>停用</template>
-          </n-switch>
+          <NSwitch v-model:value="modalForm.enable">
+            <template #checked>
+              启用
+            </template>
+            <template #unchecked>
+              停用
+            </template>
+          </NSwitch>
        </n-form-item>
      </n-form>
      <n-alert v-if="modalAction === 'add'" type="warning" closable>
@@ -106,10 +110,10 @@
 </template>

 <script setup>
-import { NAvatar, NButton, NSwitch, NTag } from 'naive-ui'
-import { formatDateTime } from '@/utils'
-import { MeCrud, MeQueryItem, MeModal } from '@/components'
+import { MeCrud, MeModal, MeQueryItem } from '@/components'
 import { useCrud } from '@/composables'
+import { formatDateTime } from '@/utils'
+import { NAvatar, NButton, NSwitch, NTag } from 'naive-ui'
 import api from './api'

 defineOptions({ name: 'UserMgt' })
@@ -129,6 +133,24 @@ const genders = [
 const roles = ref([])
 api.getAllRoles().then(({ data = [] }) => (roles.value = data))

+const {
+  modalRef,
+  modalFormRef,
+  modalForm,
+  modalAction,
+  handleAdd,
+  handleDelete,
+  handleOpen,
+  handleSave,
+} = useCrud({
+  name: '用户',
+  initForm: { enable: true },
+  doCreate: api.create,
+  doDelete: api.delete,
+  doUpdate: api.update,
+  refresh: () => $table.value?.handleSearch(),
+})
+
 const columns = [
  {
    title: '头像',
@@ -140,11 +162,10 @@ const columns = [
        src: avatar,
      }),
  },
-  { title: '用户名', key: 'username', width: 150, ellipsis: { tooltip: true } },
+  { title: '用户名', key: 'username', ellipsis: { tooltip: true } },
  {
    title: '角色',
    key: 'roles',
-    width: 200,
    ellipsis: { tooltip: true },
    render: ({ roles }) => {
      if (roles?.length) {
@@ -152,8 +173,8 @@ const columns = [
          h(
            NTag,
            { type: 'success', style: index > 0 ? 'margin-left: 8px;' : '' },
-            { default: () => item.name }
-          )
+            { default: () => item.name },
+          ),
        )
      }
      return '暂无角色'
@@ -163,7 +184,7 @@ const columns = [
    title: '性别',
    key: 'gender',
    width: 80,
-    render: ({ gender }) => genders.find((item) => gender === item.value)?.label ?? '',
+    render: ({ gender }) => genders.find(item => gender === item.value)?.label ?? '',
  },
  { title: '邮箱', key: 'email', width: 150, ellipsis: { tooltip: true } },
  {
@@ -171,14 +192,14 @@ const columns = [
    key: 'createDate',
    width: 180,
    render(row) {
-      return h('span', formatDateTime(row['createTime']))
+      return h('span', formatDateTime(row.createTime))
    },
  },
  {
    title: '状态',
    key: 'enable',
    width: 120,
-    render: (row) =>
+    render: row =>
      h(
        NSwitch,
        {
@@ -191,7 +212,7 @@ const columns = [
        {
          checked: () => '启用',
          unchecked: () => '停用',
-        }
+        },
      ),
  },
  {
@@ -214,7 +235,7 @@ const columns = [
          {
            default: () => '分配角色',
            icon: () => h('i', { class: 'i-carbon:user-role text-14' }),
-          }
+          },
        ),
        h(
          NButton,
@@ -227,7 +248,7 @@ const columns = [
          {
            default: () => '重置密码',
            icon: () => h('i', { class: 'i-radix-icons:reset text-14' }),
-          }
+          },
        ),

        h(
@@ -241,7 +262,7 @@ const columns = [
          {
            default: () => '删除',
            icon: () => h('i', { class: 'i-material-symbols:delete-outline text-14' }),
-          }
+          },
        ),
      ]
    },
@@ -255,13 +276,15 @@ async function handleEnable(row) {
    row.enableLoading = false
    $message.success('操作成功')
    $table.value?.handleSearch()
-  } catch (error) {
+  }
+  catch (error) {
+    console.error(error)
    row.enableLoading = false
  }
 }

 function handleOpenRolesSet(row) {
-  const roleIds = row.roles.map((item) => item.id)
+  const roleIds = row.roles.map(item => item.id)
  handleOpen({
    action: 'setRole',
    title: '分配角色',
@@ -270,31 +293,14 @@ function handleOpenRolesSet(row) {
  })
 }

-const {
-  modalRef,
-  modalFormRef,
-  modalForm,
-  modalAction,
-  handleAdd,
-  handleDelete,
-  handleOpen,
-  handleSave,
-} = useCrud({
-  name: '用户',
-  initForm: { enable: true },
-  doCreate: api.create,
-  doDelete: api.delete,
-  doUpdate: api.update,
-  refresh: () => $table.value?.handleSearch(),
-})
-
 function onSave() {
  if (modalAction.value === 'setRole') {
    return handleSave({
      api: () => api.update(modalForm.value),
      cb: () => $message.success('分配成功'),
    })
-  } else if (modalAction.value === 'reset') {
+  }
+  else if (modalAction.value === 'reset') {
    return handleSave({
      api: () => api.resetPwd(modalForm.value.id, modalForm.value),
      cb: () => $message.success('密码重置成功'),
--- a/src/views/profile/api.js
+++ b/src/views/profile/api.js
@@ -9,6 +9,6 @@
 import { request } from '@/utils'

 export default {
-  changePassword: (data) => request.post('/auth/password', data),
-  updateProfile: (data) => request.patch(`/user/profile/${data.id}`, data),
+  changePassword: data => request.post('/auth/password', data),
+  updateProfile: data => request.patch(`/user/profile/${data.id}`, data),
 }
--- a/src/views/profile/index.vue
+++ b/src/views/profile/index.vue
@@ -21,7 +21,9 @@
            </n-button>
          </div>
          <div class="mt-16 flex items-center">
-            <n-button type="primary" ghost @click="avatarModalRef.open()">更改头像</n-button>
+            <n-button type="primary" ghost @click="avatarModalRef.open()">
+              更改头像
+            </n-button>
            <span class="ml-12 opacity-60">
              修改头像只支持在线链接，不提供上传图片功能，如有需要可自行对接！
            </span>
@@ -44,12 +46,18 @@
        :column="1"
        bordered
      >
-        <n-descriptions-item label="昵称">{{ userStore.nickName }}</n-descriptions-item>
+        <n-descriptions-item label="昵称">
+          {{ userStore.nickName }}
+        </n-descriptions-item>
        <n-descriptions-item label="性别">
          {{ genders.find((item) => item.value === userStore.userInfo?.gender)?.label ?? '未知' }}
        </n-descriptions-item>
-        <n-descriptions-item label="地址">{{ userStore.userInfo?.address }}</n-descriptions-item>
-        <n-descriptions-item label="邮箱">{{ userStore.userInfo?.email }}</n-descriptions-item>
+        <n-descriptions-item label="地址">
+          {{ userStore.userInfo?.address }}
+        </n-descriptions-item>
+        <n-descriptions-item label="邮箱">
+          {{ userStore.userInfo?.email }}
+        </n-descriptions-item>
      </n-descriptions>
    </n-card>

--- a/uno.config.js
+++ b/uno.config.js
@@ -6,10 +6,10 @@
 * Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
 **********************************/

-import { defineConfig, presetUno, presetIcons, presetAttributify } from 'unocss'
-import presetRemToPx from '@unocss/preset-rem-to-px'
 import { FileSystemIconLoader } from '@iconify/utils/lib/loader/node-loaders'
-import { getIcons } from './build'
+import presetRemToPx from '@unocss/preset-rem-to-px'
+import { defineConfig, presetAttributify, presetIcons, presetUno } from 'unocss'
+import { getIcons } from './build/index.js'

 const icons = getIcons()
 export default defineConfig({
@@ -21,6 +21,8 @@ export default defineConfig({
      prefix: ['i-'],
      extraProperties: {
        display: 'inline-block',
+        width: '1em',
+        height: '1em',
      },
      collections: {
        me: FileSystemIconLoader('./src/assets/icons/isme'),
@@ -29,7 +31,7 @@ export default defineConfig({
    }),
    presetRemToPx({ baseFontSize: 4 }),
  ],
-  safelist: icons.map((icon) => `${icon} ${icon}?mask`.split(' ')).flat(),
+  safelist: icons.map(icon => `${icon} ${icon}?mask`.split(' ')).flat(),
  shortcuts: [
    ['wh-full', 'w-full h-full'],
    ['f-c-c', 'flex justify-center items-center'],
--- a/vite.config.js
+++ b/vite.config.js
@@ -6,16 +6,17 @@
 * Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
 **********************************/

-import path from 'path'
-import { defineConfig, loadEnv } from 'vite'
+import path from 'node:path'
 import Vue from '@vitejs/plugin-vue'
-import VueDevTools from 'vite-plugin-vue-devtools'
+import VueJsx from '@vitejs/plugin-vue-jsx'
 import Unocss from 'unocss/vite'
 import AutoImport from 'unplugin-auto-import/vite'
-import Components from 'unplugin-vue-components/vite'
 import { NaiveUiResolver } from 'unplugin-vue-components/resolvers'
+import Components from 'unplugin-vue-components/vite'
+import { defineConfig, loadEnv } from 'vite'
 import removeNoMatch from 'vite-plugin-router-warn'
-import { pluginPagePathes, pluginIcons } from './build/plugin-isme'
+import VueDevTools from 'vite-plugin-vue-devtools'
+import { pluginIcons, pluginPagePathes } from './build/plugin-isme'

 export default defineConfig(({ mode }) => {
  const viteEnv = loadEnv(mode, process.cwd())
@@ -25,6 +26,7 @@ export default defineConfig(({ mode }) => {
    base: VITE_PUBLIC_PATH || '/',
    plugins: [
      Vue(),
+      VueJsx(),
      VueDevTools(),
      Unocss(),
      AutoImport({
@@ -56,7 +58,7 @@ export default defineConfig(({ mode }) => {
        '/api': {
          target: VITE_PROXY_TARGET,
          changeOrigin: true,
-          rewrite: (path) => path.replace(new RegExp('^/api'), ''),
+          rewrite: path => path.replace(/^\/api/, ''),
          secure: false,
          configure: (proxy, options) => {
            // 配置此项可在响应头中看到请求的真实地址
Author	SHA1	Message	Date
leip247	a977ec1f3a	fix: #113 (#116 ) * fix(slot): 优化部分slot写法,减少手动判断 * fix(slot): 优化部分slot写法,减少手动判断 * feat(table): 添加vxe-table,适配naiveui主题,并替换掉之前table,自带导出 * feat(table): 添加vxe-table,适配naiveui主题,并替换掉之前table,自带导出 * fix: 完善table总条数不显示问题	2025-03-19 09:15:41 +08:00
leip247	6d1b3a4159	feat(table): 添加vxe-table,适配naiveui主题,并替换掉之前table,自带导出 (#105 ) * fix(slot): 优化部分slot写法,减少手动判断 * fix(slot): 优化部分slot写法,减少手动判断 * feat(table): 添加vxe-table,适配naiveui主题,并替换掉之前table,自带导出 * feat(table): 添加vxe-table,适配naiveui主题,并替换掉之前table,自带导出	2024-11-22 15:47:29 +08:00
leip247	6af6eb3c99	fix(slot): 优化部分slot写法,减少手动判断 (#101 ) * fix(slot): 优化部分slot写法,减少手动判断 * fix(slot): 优化部分slot写法,减少手动判断	2024-11-13 11:05:03 +08:00
zclzone	69e6e9a14a	fix: 替换失效图片链接	2024-10-29 15:14:04 +08:00
zclzone	d066c999cc	chore: update deps	2024-10-22 15:27:46 +08:00
zclzone	97fb638ac2	chore: update deps	2024-10-08 15:44:41 +08:00
zclzone	db800f60a9	docs: update README	2024-09-26 17:25:52 +08:00
zclzone	304b74bb49	chore: 弃用sass，使用原生css替换	2024-09-25 18:19:48 +08:00
zclzone	359f683955	chore: update deps, close #97	2024-09-25 11:24:23 +08:00
zclzone	d7a4034c69	chore: 移除无用文件	2024-09-14 10:12:08 +08:00
zclzone	520db7ec6e	style: lint	2024-09-06 14:46:07 +08:00
zclzone	2264512a8b	chore: update deps	2024-09-06 14:27:47 +08:00
zclzone	3359b0f2b5	fix: 修复keepAlive页面transition不生效问题, close #93	2024-09-03 09:02:17 +08:00
zclzone	615c3b63f7	chore: 集成plugin-vue-jsx插件，支持jsx写法	2024-08-27 10:50:14 +08:00
zclzone	51f2d5d22c	fix: CRUD组件前端分页问题	2024-08-21 11:35:48 +08:00
zclzone	02e614e903	chore: 兼容较低版本node	2024-08-21 09:51:41 +08:00
zclzone	fdb6ad5f1d	chore: 修改 vscode settings.json	2024-08-15 09:04:16 +08:00
zclzone	723d141705	style: 优化样式	2024-08-11 13:45:59 +08:00
zclzone	7b1b990d77	chore: update deps	2024-08-11 13:39:17 +08:00
zclzone	36ce5c34d0	fix: 自定义图标不显示问题	2024-07-31 21:26:45 +08:00
zclzone	1e0e1f2c48	chore: update deps	2024-07-28 20:53:58 +08:00
zclzone	491237919a	docs: 添加图标使用文档外链	2024-07-24 09:51:30 +08:00
zclzone	0c0e7a465b	docs: update readme	2024-07-23 08:53:39 +08:00
zclzone	0a0c970f5c	Merge branch '2.x' of https://gitee.com/isme-admin/vue-naive-admin into 2.x	2024-07-22 21:47:42 +08:00
zclzone	c9e0feea47	docs: 变更文档地址	2024-07-22 21:47:32 +08:00
zclzone	f28e3a946e	fix: lint fix	2024-07-19 14:55:02 +08:00
zclzone	7dde0bbfc6	Merge branch '2.x' of https://github.com/zclzone/vue-naive-admin into 2.x	2024-07-16 22:04:09 +08:00
zclzone	cf76f2177b	chore: update deps	2024-07-16 21:59:35 +08:00
大脸怪	d0a99dcf12	Merge pull request #88 from lxc455735702/feat_crudExpand ✨ feat(crud): 支持展开收起	2024-07-10 17:14:55 +08:00
DeveloperLXC	6ab97f511f	✨ feat(crud): 支持展开收起	2024-07-10 15:05:36 +08:00
zclzone	2384113120	chore: update	2024-07-10 09:38:03 +08:00
zclzone	8cb3d2cf19	fix: 优化接口异常弹窗及消息提醒方式	2024-07-05 17:41:58 +08:00
zclzone	c5d93628f0	chore: 更新插件推荐列表，修改settings.json	2024-07-05 17:38:42 +08:00
zclzone	4d494801e3	chore: update deps	2024-06-30 22:16:38 +08:00
zclzone	e14bd2084a	style: 删除无用注释代码	2024-06-30 16:58:57 +08:00
zclzone	3c2e120e34	style: 优化主题切换过渡动画	2024-06-25 18:17:17 +08:00
zclzone	c230e86767	Merge branch '2.x' of https://gitee.com/isme-admin/vue-naive-admin into 2.x	2024-06-25 16:46:47 +08:00
zclzone	b464c70ae3	refactor: 封装不同layout下的公用组件	2024-06-25 16:46:31 +08:00
zclzone	c87f56814e	feat: 添加切换主题的动画效果	2024-06-25 16:44:27 +08:00
zclzone	fd4582fc0c	style: 图标示例布局改成grid	2024-06-23 00:15:10 +08:00
zclzone	c2ff434b9d	feat: crud组件handleSearch增加参数控制是否留在当前页	2024-06-20 14:02:45 +08:00
大脸怪	c98e489063	Merge pull request #82 from mengdebiao/2.x fix: 修复 crud 组件不显示总条数	2024-06-18 21:36:44 +08:00
mdb	0ab029a124	fix: 修复 crud 组件不显示总条数	2024-06-18 21:09:03 +08:00
zclzone	e30e1fa27f	chore: update deps	2024-06-17 18:06:04 +08:00
zclzone	3c64aca739	chore: 移除pnpm-lock.yaml	2024-06-17 18:05:51 +08:00
zclzone	995175a8a8	feat: 增加 layoutSettingVisible 控制 LayoutSetting 显示隐藏	2024-06-11 20:39:31 +08:00
zclzone	eca0859f66	docs: update README.md	2024-06-11 18:11:45 +08:00
zclzone	38fbbfd376	chore: 移除无用引用	2024-06-11 16:27:11 +08:00
zclzone	54c134c879	style: lint	2024-06-06 18:11:10 +08:00
zclzone	6b060291bb	chore: 移除无用依赖	2024-06-06 18:08:05 +08:00
zclzone	a67510fe34	style: lint	2024-06-06 18:05:36 +08:00
zclzone	98f9d5893a	chore: eslint 替换为 @antfu/eslint-config，集成 lint-staged 和 simple-git-hooks	2024-06-06 17:26:55 +08:00
zclzone	004ef366f2	fix: ref value	2024-06-06 16:42:07 +08:00