docs: 优化文档和注释中的单词大小写和语义

.eslintignore

@@ -1,4 +1,4 @@
-# eslint 会忽略的文件
+# Eslint 会忽略的文件
 
 .DS_Store
 node_modules

.eslintrc.js

@@ -33,7 +33,7 @@ module.exports = {
     }
   },
   rules: {
-    // ts
+    // TS
     "@typescript-eslint/no-explicit-any": "off",
     "no-debugger": "off",
     "@typescript-eslint/explicit-module-boundary-types": "off",
@@ -55,7 +55,7 @@ module.exports = {
         varsIgnorePattern: "^_"
       }
     ],
-    // vue
+    // Vue
     "vue/no-v-html": "off",
     "vue/require-default-prop": "off",
     "vue/require-explicit-emits": "off",
@@ -72,7 +72,7 @@ module.exports = {
         math: "always"
       }
     ],
-    // prettier
+    // Prettier
     "prettier/prettier": [
       "error",
       {

.gitignore

@@ -1,11 +1,11 @@
-# git 会忽略的文件
+# Git 会忽略的文件
 
 .DS_Store
 node_modules
 dist
 dist-ssr
 
-# local env files
+# Local env files
 *.local
 
 # Logs

.prettierignore

@@ -1,4 +1,4 @@
-# prettier 会忽略的文件
+# Prettier 会忽略的文件
 
 .DS_Store
 node_modules

README.md

@@ -2,9 +2,9 @@
 
 一个免费开源的中后台管理系统基础解决方案，基于 Vue3、TypeScript、Element-Plus、Pinia 和 Vite 等主流技术.
 
-模板代码是从 [v3-admin](https://github.com/un-pany/v3-admin) 迁移而来，脚手架从 vue-cli 5.x 切换到了 vite 2.9.x，并作了一些繁琐的适配.
+模板代码是从 [v3-admin](https://github.com/un-pany/v3-admin) 迁移而来，脚手架从 Vue-Cli 5.x 切换到了 Vite 2.9.x，并作了一些繁琐的适配.
 
-更推荐大家使用该 vite 版本！以后的重心也会从 [v3-admin](https://github.com/un-pany/v3-admin) 偏向本仓库.
+更推荐大家使用该 Vite 版本！以后的重心也会从 [v3-admin](https://github.com/un-pany/v3-admin) 偏向本仓库.
 
 - Electron 桌面版: [v3-electron-vite](https://github.com/un-pany/v3-electron-vite)
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "v3-admin-vite",
-  "version": "3.1.9",
+  "version": "3.1.10",
   "description": "一个免费开源的中后台管理系统基础解决方案，基于 Vue3、TypeScript、Element-Plus、Pinia 和 Vite 等主流技术.",
   "author": {
     "name": "pany",

prettier.config.js

@@ -2,9 +2,9 @@
 module.exports = {
   /** 每一行的宽度 */
   printWidth: 120,
-  /** tab 健的空格数 */
+  /** Tab 键的空格数 */
   tabWidth: 2,
-  /** 在对象中的括号之间用空格来间隔 */
+  /** 在对象中的括号之间是否用空格来间隔 */
   bracketSpacing: true,
   /** 箭头函数的参数无论有几个，都要括号包裹 */
   arrowParens: "always",
@@ -14,8 +14,8 @@ module.exports = {
   singleQuote: false,
   /** 对象或者数组的最后一个元素后面不要加逗号 */
   trailingComma: "none",
-  /** 不加分号 */
+  /** 是否加分号 */
   semi: false,
-  /** 不使用 tab 格式化 */
+  /** 是否使用 Tab 格式化 */
   useTabs: false
 }

src/App.vue

@@ -2,8 +2,8 @@
 import { useAppStore } from "@/store/modules/app"
 import zhCn from "element-plus/lib/locale/lang/zh-cn"
 
-useAppStore().initTheme() // 初始化 theme
+useAppStore().initTheme() // 初始化主题
-const locale = zhCn // element-plus 设置为中文
+const locale = zhCn // 将 Element-Plus 的语言设置为中文
 </script>
 
 <template>

src/config/layout.ts

@@ -1,16 +1,16 @@
 /** 布局配置 */
 interface ILayoutSettings {
-  /** 控制 settings panel 显示 */
+  /** 是否显示 Settings Panel */
   showSettings: boolean
-  /** 控制 tagsview 显示 */
+  /** 是否显示标签栏 */
   showTagsView: boolean
-  /** 控制 siderbar logo 显示 */
+  /** 是否显示侧边栏 Logo */
   showSidebarLogo: boolean
-  /** 如果为真，将固定 header */
+  /** 是否固定 Header */
   fixedHeader: boolean
-  /** 控制 换肤按钮 显示 */
+  /** 是否显示切换主题按钮 */
   showThemeSwitch: boolean
-  /** 控制 全屏按钮 显示 */
+  /** 是否显示全屏按钮 */
   showScreenfull: boolean
 }
 

src/directives/permission/index.ts

@@ -15,7 +15,7 @@ export const permission: Directive = {
         el.style.display = "none"
       }
     } else {
-      throw new Error("need roles! Like v-permission=\"['admin','editor']\"")
+      throw new Error(`need roles! Like v-permission="['admin','editor']"`)
     }
   }
 }

src/icons/index.ts

@@ -1,5 +1,5 @@
 import { createApp } from "vue"
-import SvgIcon from "@/components/SvgIcon/index.vue" // svg component
+import SvgIcon from "@/components/SvgIcon/index.vue" // Svg Component
 import "virtual:svg-icons-register"
 
 export default (app: ReturnType<typeof createApp>) => {

src/layout/components/Settings/index.vue

@@ -64,7 +64,7 @@ watch(
     <div>
       <h3 class="drawer-title">系统布局配置</h3>
       <div class="drawer-item">
-        <span>显示 Tags-View</span>
+        <span>显示标签栏</span>
         <el-switch v-model="state.showTagsView" class="drawer-switch" />
       </div>
       <div class="drawer-item">
@@ -76,7 +76,7 @@ watch(
         <el-switch v-model="state.fixedHeader" class="drawer-switch" />
       </div>
       <div class="drawer-item">
-        <span>显示换肤按钮</span>
+        <span>显示切换主题按钮</span>
         <el-switch v-model="state.showThemeSwitch" class="drawer-switch" />
       </div>
       <div class="drawer-item">

src/layout/components/Sidebar/index.vue

@@ -64,7 +64,7 @@ const isCollapse = computed(() => {
 
 <style lang="scss">
 .sidebar-container {
-  // 重置当前页面的 element-plus css, ，注意，虽然没有加 scoped 标识，但是被该页面的 sidebar-container 类名包裹，所以不会影响其他页面
+  // 重置当前页面的 Element-Plus CSS, ，注意，虽然没有加 scoped 标识，但是被该页面的 sidebar-container 类名包裹，所以不会影响其他页面
   .horizontal-collapse-transition {
     transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
   }

src/layout/components/TagsView/index.vue

@@ -20,7 +20,7 @@ const toLastView = (visitedViews: ITagView[], view: ITagView) => {
       console.warn(err)
     })
   } else {
-    // 如果没有 tags-view，请默认重定向到主页，如果你需要，可以自行调整它
+    // 如果没有 TagsView，请默认重定向到主页，如果你需要，可以自行调整它
     if (view.name === "Dashboard") {
       // 重新加载主页
       router.push({ path: "/redirect" + view.fullPath }).catch((err) => {

src/layout/useResize.ts

@@ -2,7 +2,7 @@ import { computed, watch } from "vue"
 import { useRoute } from "vue-router"
 import { useAppStore, DeviceType } from "@/store/modules/app"
 
-/** 参考 Bootstrap 的响应式设计 width = 992 */
+/** 参考 Bootstrap 的响应式设计 WIDTH = 992 */
 const WIDTH = 992
 
 /** 根据大小变化重新布局 */

src/main.ts

@@ -14,9 +14,9 @@ import "element-plus/theme-chalk/dark/css-vars.css"
 import "@/styles/index.scss"
 
 const app = createApp(App)
-/** element-plus 组件完整引入 */
+/** Element-Plus 组件完整引入 */
 app.use(ElementPlus)
-/** 加载全局 svg */
+/** 加载全局 SVG */
 loadSvg(app)
 /** 自定义指令 */
 Object.keys(directives).forEach((key) => {

src/router/index.ts

@@ -135,8 +135,8 @@ export const constantRoutes: Array<RouteRecordRaw> = [
 
 /**
  * 动态路由
- * 用来放置有权限（roles 属性）的路由
+ * 用来放置有权限 (Roles 属性) 的路由
- * 必须带有 name 属性
+ * 必须带有 Name 属性
  */
 export const asyncRoutes: Array<RouteRecordRaw> = [
   {
@@ -208,7 +208,7 @@ const router = createRouter({
 
 /** 重置路由 */
 export function resetRouter() {
-  // 注意：所有动态路由路由必须带有 name 属性，否则可能会不能完全重置干净
+  // 注意：所有动态路由路由必须带有 Name 属性，否则可能会不能完全重置干净
   try {
     router.getRoutes().forEach((route) => {
       const { name, meta } = route

src/router/permission.ts

@@ -18,7 +18,7 @@ router.beforeEach(async (to: RouteLocationNormalized, _: RouteLocationNormalized
   // 判断该用户是否登录
   if (getToken()) {
     if (to.path === "/login") {
-      // 如果登录，并准备进入 login 页面，则重定向到主页
+      // 如果登录，并准备进入 Login 页面，则重定向到主页
       next({ path: "/" })
       NProgress.done()
     } else {
@@ -29,14 +29,14 @@ router.beforeEach(async (to: RouteLocationNormalized, _: RouteLocationNormalized
             // 注意：角色必须是一个数组！ 例如: ['admin'] 或 ['developer', 'editor']
             await userStore.getInfo()
             const roles = userStore.roles
-            // 根据角色生成可访问的 routes（可访问路由 = 常驻路由 + 有访问权限的动态路由）
+            // 根据角色生成可访问的 Routes（可访问路由 = 常驻路由 + 有访问权限的动态路由）
             permissionStore.setRoutes(roles)
           } else {
             // 没有开启动态路由功能，则启用默认角色
             userStore.setRoles(asyncRouteSettings.defaultRoles)
             permissionStore.setRoutes(asyncRouteSettings.defaultRoles)
           }
-          // 将'有访问权限的动态路由' 添加到 router 中
+          // 将'有访问权限的动态路由' 添加到 Router 中
           permissionStore.dynamicRoutes.forEach((route) => {
             router.addRoute(route)
           })
@@ -44,7 +44,7 @@ router.beforeEach(async (to: RouteLocationNormalized, _: RouteLocationNormalized
           // 设置 replace: true, 因此导航将不会留下历史记录
           next({ ...to, replace: true })
         } catch (err: any) {
-          // 过程中发生任何错误，都直接重置 token，并重定向到登录页面
+          // 过程中发生任何错误，都直接重置 Token，并重定向到登录页面
           userStore.resetToken()
           ElMessage.error(err.message || "路由守卫过程发生错误")
           next("/login")
@@ -55,7 +55,7 @@ router.beforeEach(async (to: RouteLocationNormalized, _: RouteLocationNormalized
       }
     }
   } else {
-    // 如果没有 token
+    // 如果没有 Token
     if (whiteList.indexOf(to.path) !== -1) {
       // 如果在免登录的白名单中，则直接进入
       next()

src/store/modules/app.ts

@@ -55,7 +55,7 @@ export const useAppStore = defineStore({
       this.activeThemeName = this.themeList.find((theme) => theme.name === activeThemeName)
         ? activeThemeName
         : this.themeList[0].name
-      // 应用到 dom
+      // 应用到 Dom
       document.documentElement.className = this.activeThemeName
       // 持久化
       setActiveThemeName(this.activeThemeName)

src/store/modules/user.ts

@@ -74,7 +74,7 @@ export const useUserStore = defineStore({
       this.roles = []
       resetRouter()
     },
-    /** 重置 token */
+    /** 重置 Token */
     resetToken() {
       removeToken()
       this.token = ""

src/styles/index.scss

@@ -1,6 +1,6 @@
-// 全局 css 变量
+// 全局 CSS 变量
 @import "variables.css";
-// transition
+// Transition
 @import "./transition.scss";
 // 注册主题
 @import "./theme/register.scss";

src/styles/theme/theme.scss

@@ -42,7 +42,7 @@
       }
     }
 
-    // tags-view
+    // TagsView
     .tags-view-container {
       background-color: $theme-bg-color !important;
       border-bottom: 1px solid lighten($theme-bg-color, 10%) !important;
@@ -73,7 +73,7 @@
     }
   }
 
-  /** app-main 主要写 view 页面的黑暗样式 */
+  /** AppMain 主要写 View 页面的黑暗样式 */
 
   .app-main {
     // 指令权限页面 /permission/directive
@@ -82,7 +82,7 @@
     }
   }
 
-  /** login 页面 */
+  /** Login 页面 */
 
   .login-container {
     background-color: $theme-bg-color;
@@ -92,7 +92,7 @@
     }
   }
 
-  /** element-plus */
+  /** Element-Plus */
 
   // 侧边栏的 item 的 popper
   .el-popper {

src/styles/variables.css

@@ -1,4 +1,4 @@
-/** 全局 css 变量，这种变量不仅可以在 css 和 scss 中使用，还可以导入到 js 中使用 */
+/** 全局 CSS 变量，这种变量不仅可以在 CSS 和 SCSS 中使用，还可以导入到 JS 中使用 */
 
 :root {
   /** 全局背景色 */

src/utils/cookies.ts

@@ -1,4 +1,4 @@
-/** cookies 封装 */
+/** 统一处理 Cookie */
 
 import Keys from "@/constant/key"
 import Cookies from "js-cookie"

src/utils/index.ts

@@ -9,7 +9,7 @@ export const formatDateTime = (time: any) => {
   return dayjs(date).format("YYYY-MM-DD HH:mm:ss")
 }
 
-/** 将全局 css 导入 js 中使用 */
+/** 将全局 CSS 导入 JS 中使用 */
 export const getCssVariableValue = (cssVariableName: string) => {
   let cssVariableValue = ""
   try {

src/utils/service.ts

@@ -6,7 +6,7 @@ import { getToken } from "@/utils/cookies"
 
 /** 创建请求实例 */
 function createService() {
-  // 创建一个 axios 实例
+  // 创建一个 Axios 实例
   const service = axios.create()
   // 请求拦截
   service.interceptors.request.use(
@@ -17,11 +17,11 @@ function createService() {
   // 响应拦截（可根据具体业务作出相应的调整）
   service.interceptors.response.use(
     (response) => {
-      // apiData 是 api 返回的数据
+      // apiData 是 API 返回的数据
       const apiData = response.data as any
-      // 这个 code 是和后端约定的业务 code
+      // 这个 Code 是和后端约定的业务 Code
       const code = apiData.code
-      // 如果没有 code, 代表这不是项目后端开发的 api
+      // 如果没有 Code, 代表这不是项目后端开发的 API
       if (code === undefined) {
         ElMessage.error("非本系统的接口")
         return Promise.reject(new Error("非本系统的接口"))
@@ -34,14 +34,14 @@ function createService() {
             // code === 20000 代表没有错误
             return apiData
           default:
-            // 不是正确的 code
+            // 不是正确的 Code
             ElMessage.error(apiData.msg || "Error")
             return Promise.reject(new Error("Error"))
         }
       }
     },
     (error) => {
-      // status 是 HTTP 状态码
+      // Status 是 HTTP 状态码
       const status = get(error, "response.status")
       switch (status) {
         case 400:
@@ -51,7 +51,7 @@ function createService() {
           error.message = "未授权，请登录"
           break
         case 403:
-          // token 过期时，直接退出登录并强制刷新页面（会重定向到登录页）
+          // Token 过期时，直接退出登录并强制刷新页面（会重定向到登录页）
           useUserStoreHook().logout()
           location.reload()
           break
@@ -94,7 +94,7 @@ function createRequestFunction(service: AxiosInstance) {
   return function (config: AxiosRequestConfig) {
     const configDefault = {
       headers: {
-        // 携带 token
+        // 携带 Token
         "X-Access-Token": getToken(),
         "Content-Type": get(config, "headers.Content-Type", "application/json")
       },

src/views/login/index.vue

@@ -18,7 +18,7 @@ const router = useRouter()
 const loginFormDom = ref<any>()
 
 const state = reactive({
-  /** 登录按钮 loading */
+  /** 登录按钮 Loading */
   loading: false,
   /** 验证码图片 URL */
   codeUrl: "",

src/views/permission/directive.vue

@@ -45,7 +45,7 @@ const state = reactive({
     </div>
     <div :key="'checkPermission' + state.key" style="margin-top: 60px">
       <el-tag type="info" size="large">
-        在某些情况下，不适合使用 v-permission。例如：element-plus 的 el-tab 或 el-table-column 以及其它动态渲染 dom
+        在某些情况下，不适合使用 v-permission。例如: Element-Plus 的 el-tab 或 el-table-column 以及其它动态渲染 dom
         的场景。你只能通过手动设置 v-if 来实现。
       </el-tag>
       <el-tabs type="border-card" style="width: 550px; margin-top: 60px">
@@ -53,12 +53,10 @@ const state = reactive({
           admin 可以看见这个
           <el-tag class="permission-sourceCode" type="info"> v-if="checkPermission(['admin'])" </el-tag>
         </el-tab-pane>
-
         <el-tab-pane v-if="checkPermission(['editor'])" label="editor">
           editor 可以看见这个
           <el-tag class="permission-sourceCode" type="info"> v-if="checkPermission(['editor'])" </el-tag>
         </el-tab-pane>
-
         <el-tab-pane v-if="checkPermission(['admin', 'editor'])" label="admin 和 editor">
           两者 admin 和 editor 都可以看见这个
           <el-tag class="permission-sourceCode" type="info"> v-if="checkPermission(['admin', 'editor'])" </el-tag>

tsconfig.json

@@ -5,7 +5,7 @@
     "useDefineForClassFields": true,
     "module": "esnext",
     "moduleResolution": "node",
-    /** ts 严格模式 */
+    /** TS 严格模式 */
     "strict": true,
     "jsx": "preserve",
     "importHelpers": true,
@@ -24,7 +24,7 @@
     "types": [
       "node",
       "vite/client",
-      /** element-plus 的 volar 插件支持 */
+      /** Element-Plus 的 Volar 插件支持 */
       "element-plus/global"
     ],
     /** baseUrl 用来告诉编译器到哪里去查找模块，使用非相对模块时必须配置此项 */

vite.config.ts

@@ -7,7 +7,7 @@ import Unocss from "unocss/vite"
 /** 配置项文档：https://vitejs.dev/config */
 export default (): UserConfigExport => {
   return {
-    /** build 打包时根据实际情况修改 base */
+    /** 打包时根据实际情况修改 base */
     base: "./",
     resolve: {
       alias: {
@@ -16,9 +16,9 @@ export default (): UserConfigExport => {
       }
     },
     server: {
-      /** 是否开启 https */
+      /** 是否开启 HTTPS */
       https: false,
-      /** host 设置为 true 才可以使用 network 的形式，以 ip 访问项目 */
+      /** 设置 host: true 才可以使用 Network 的形式，以 IP 访问项目 */
       host: true, // host: "0.0.0.0"
       /** 端口号 */
       port: 3333,
@@ -43,9 +43,9 @@ export default (): UserConfigExport => {
       brotliSize: false,
       /** 消除打包大小超过 500kb 警告 */
       chunkSizeWarningLimit: 2000,
-      /** vite 2.6.x 以上需要配置 minify: terser，terserOptions 才能生效 */
+      /** Vite 2.6.x 以上需要配置 minify: "terser", terserOptions 才能生效 */
       minify: "terser",
-      /** 在 build 代码时移除 console.log、debugger 和 注释 */
+      /** 在打包代码时移除 console.log、debugger 和 注释 */
       terserOptions: {
         compress: {
           drop_console: false,
@@ -60,22 +60,22 @@ export default (): UserConfigExport => {
       /** 打包后静态资源目录 */
       assetsDir: "static"
     },
-    /** vite 插件 */
+    /** Vite 插件 */
     plugins: [
       vue(),
-      /** svg */
+      /** SVG */
       createSvgIconsPlugin({
         iconDirs: [path.resolve(process.cwd(), "src/icons/svg")],
         symbolId: "icon-[dir]-[name]"
       }),
-      /** unocss */
+      /** Unocss */
       Unocss()
-      /** 自动按需引入（已更改为完整引入，所以注释了） */
+      /** 自动按需引入 (已更改为完整引入，所以注释了) */
       // AutoImport({
       //   dts: "./types/auto-imports.d.ts",
-      //   /** 自动按需导入 element-plus 相关函数，比如 ElMessage */
+      //   /** 自动按需导入 Element-Plus 相关函数，比如 ElMessage */
       //   resolvers: [ElementPlusResolver()],
-      //   /** 根据自动按需导入的相关 api，生成 .eslintrc-auto-import.json 文件供 eslint 识别 */
+      //   /** 根据自动按需导入的相关 API，生成 .eslintrc-auto-import.json 文件供 Eslint 识别 */
       //   eslintrc: {
       //     enabled: true, // 默认 false
       //     filepath: "./types/.eslintrc-auto-import.json", // 默认 "./.eslintrc-auto-import.json"
@@ -84,7 +84,7 @@ export default (): UserConfigExport => {
       // }),
       // Components({
       //   dts: "./types/components.d.ts",
-      //   /** 自动按需导入 element-plus 组件 */
+      //   /** 自动按需导入 Element-Plus 组件 */
       //   resolvers: [ElementPlusResolver()]
       // })
     ]