chore: annotate code in english (#2)

Author: ljt990218

build/vite/vconsole.ts

@@ -1,44 +1,44 @@
-import path from 'node:path'
-import { viteVConsole } from 'vite-plugin-vconsole'
-
-export function createViteVConsole() {
-  return viteVConsole({
-    entry: [path.resolve('src/main.ts')],
-    enabled: false,
-    config: {
-      maxLogNumber: 1000,
-      theme: 'light',
-    },
-    // https://github.com/vadxq/vite-plugin-vconsole/issues/21
-    dynamicConfig: {
-      theme: `document.documentElement.classList.contains('dark') ? 'dark' : 'light'`,
-    },
-    eventListener: `
-      const targetElement = document.querySelector('html'); // 择要监听的元素
-      const observerOptions = {
-        attributes: true, // 监听属性变化
-        attributeFilter: ['class'] // 只监听class属性变化
-      };
-
-      // 定义回调函数来处理观察到的变化
-      function handleAttributeChange(mutationsList) {
-        for(let mutation of mutationsList) {
-          if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
-            if (window && window.vConsole) {
-              window.vConsole.dynamicChange.value = new Date().getTime();
-            }
-          }
-        }
-      }
-
-      // 创建观察者实例并传入回调函数
-      const observer = new MutationObserver(handleAttributeChange);
-
-      // 开始观察目标元素
-      observer.observe(targetElement, observerOptions);
-
-      // 当不再需要观察时，停止观察
-      // observer.disconnect();
-    `,
-  })
-}
+import path from 'node:path'
+import { viteVConsole } from 'vite-plugin-vconsole'
+
+export function createViteVConsole() {
+  return viteVConsole({
+    entry: [path.resolve('src/main.ts')],
+    enabled: false,
+    config: {
+      maxLogNumber: 1000,
+      theme: 'light',
+    },
+    // https://github.com/vadxq/vite-plugin-vconsole/issues/21
+    dynamicConfig: {
+      theme: `document.documentElement.classList.contains('dark') ? 'dark' : 'light'`,
+    },
+    eventListener: `
+      const targetElement = document.querySelector('html'); // Choose the elements to be monitored
+      const observerOptions = {
+        attributes: true, // Monitor attribute changes
+        attributeFilter: ['class'] // Only listen to changes in class attributes
+      };
+
+      // Define a callback function to deal with observed changes
+      function handleAttributeChange(mutationsList) {
+        for(let mutation of mutationsList) {
+          if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
+            if (window && window.vConsole) {
+              window.vConsole.dynamicChange.value = new Date().getTime();
+            }
+          }
+        }
+      }
+
+      // Create an observer instance and pass in the callback function
+      const observer = new MutationObserver(handleAttributeChange);
+
+      // Start observing the target element
+      observer.observe(targetElement, observerOptions);
+
+      // Stop observing when you no longer need to observe.
+      // observer.disconnect();
+    `,
+  })
+}

src/api/typing.ts

@@ -5,8 +5,7 @@ export interface ResponseBody<T = any> {
   success: boolean
 }
 
-/** 统一返回结构体 */
-
+/** Unified return structure */
 export interface PageResult<T = any> {
   data: T[]
   current?: number

src/main.ts

@@ -7,7 +7,7 @@ import 'virtual:uno.css'
 import '@/styles/app.less'
 import { i18n } from '@/utils/i18n'
 
-// Varlet 桌面端适配
+// Varlet Desktop adaptation
 import '@varlet/touch-emulator'
 
 const app = createApp(App)

src/utils/i18n.ts

@@ -14,13 +14,13 @@ export const i18n = createI18n({
   messages,
 })
 
-/** 多语言 picker columns */
+/** i18n picker columns */
 export const languageColumns: PickerColumnOption[] = [
   { text: '简体中文', value: 'zh-CN' },
   { text: 'English', value: 'en-US' },
 ]
 
-/** 当前语言 */
+/** Current language */
 export const locale = computed({
   get() {
     return (i18n.global.locale as unknown as Ref<string>).value
@@ -32,9 +32,9 @@ export const locale = computed({
   },
 })
 
-// 载入 varlet 语言包
+// Load the varlet language package
 Locale.add('zh-CN', Locale.zhCN)
 Locale.add('en-US', Locale.enUS)
 
-// 根据当前语言切换 varlet 语言包
+// Switch current language
 Locale.use(locale.value)

src/utils/request.ts

@@ -3,17 +3,17 @@ import axios from 'axios'
 import { localStorage } from '@/utils/local-storage'
 import { STORAGE_TOKEN_KEY } from '@/stores/mutation-type'
 
-// 这里是用于设定请求后端时，所用的 Token KEY
-// 可以根据自己的需要修改，常见的如 Access-Token，Authorization
-// 需要注意的是，请尽量保证使用中横线`-` 来作为分隔符，
-// 避免被 nginx 等负载均衡器丢弃了自定义的请求头
+// This is the Token KEY used to set the request backend.
+// You can modify it according to your own needs, such as Access-Token，Authorization
+// It should be noted that please try to use the horizontal line `-` as the separator
+// Avoid discarding custom request headers by load balancers such as nginx
 export const REQUEST_TOKEN_KEY = 'Access-Token'
 
-// 创建 axios 实例
+// Create an axios instance
 const request = axios.create({
-  // API 请求的默认前缀
+  // API Default prefix for requests
   baseURL: import.meta.env.VITE_APP_API_BASE_URL,
-  timeout: 6000, // 请求超时时间
+  timeout: 6000, // Request timeout
 })
 
 export type RequestError = AxiosError<{
@@ -22,28 +22,28 @@ export type RequestError = AxiosError<{
   errorMessage?: string
 }>
 
-// 异常拦截处理器
+// Abnormal interception processor
 function errorHandler(error: RequestError): Promise<any> {
   if (error.response) {
     const { data = {}, status, statusText } = error.response
-    // 403 无权限
+    // 403 No permission
     if (status === 403)
       Snackbar({ type: 'warning', content: (data && data.message) || statusText })
 
-    // 401 未登录/未授权
+    // 401 Not logged in/Unauthorized
     if (status === 401 && data.result && data.result.isLogin)
       Snackbar({ type: 'warning', content: 'Authorization verification failed' })
-      // 如果你需要直接跳转登录页面
+      // If you need to jump directly to the login page
       // location.replace(loginRoutePath)
   }
   return Promise.reject(error)
 }
 
-// 请求拦截器
+// Request interceptor
 function requestHandler(config: InternalAxiosRequestConfig): InternalAxiosRequestConfig | Promise<InternalAxiosRequestConfig> {
   const savedToken = localStorage.get(STORAGE_TOKEN_KEY)
-  // 如果 token 存在
-  // 让每个请求携带自定义 token, 请根据实际情况修改
+  // If the token exists
+  // Let each request carry a custom token, please modify it according to the actual situation.
   if (savedToken)
     config.headers[REQUEST_TOKEN_KEY] = savedToken
 
@@ -53,7 +53,7 @@ function requestHandler(config: InternalAxiosRequestConfig): InternalAxiosReques
 // Add a request interceptor
 request.interceptors.request.use(requestHandler, errorHandler)
 
-// 响应拦截器
+// Response interceptor
 function responseHandler(response: { data: any }) {
   return response.data
 }

uno.config.ts

@@ -1,34 +1,34 @@
-import {
-  defineConfig,
-  presetAttributify,
-  presetIcons,
-  presetMini,
-  presetUno,
-} from 'unocss'
-import { presetVarlet } from '@varlet/preset-unocss'
-
-import presetRemToPx from '@unocss/preset-rem-to-px'
-
-// 刚使用unocss的朋友，可以借助这个工具： https://to-unocss.netlify.app
-
-export default defineConfig({
-  presets: [
-    presetUno,
-    presetVarlet(),
-    presetAttributify,
-    presetIcons(),
-    // 为什么要用到这个插件？
-    // 模板使用 viewport 作为移动端适配方案，unocss 默认单位为 rem
-    // 所以需要转成 px，然后由 postcss 把 px 转成 vw/vh，完成适配
-    presetRemToPx({
-      // 这里为什么要设置基础字体大小？看下面这篇文章
-      // https://juejin.cn/post/7262975395620618298
-      baseFontSize: 4,
-    }),
-    presetMini(),
-  ],
-  shortcuts: [
-    // shortcuts to multiple utilities
-    ['btn', 'px-6 py-3 rounded-3 border-none inline-block bg-green-400 text-white cursor-pointer !outline-none hover:bg-green-600 disabled:cursor-default disabled:bg-gray-600 disabled:opacity-50'],
-  ],
-})
+import {
+  defineConfig,
+  presetAttributify,
+  presetIcons,
+  presetMini,
+  presetUno,
+} from 'unocss'
+import { presetVarlet } from '@varlet/preset-unocss'
+
+import presetRemToPx from '@unocss/preset-rem-to-px'
+
+// Friends who have just used unocss can use this tool: https://to-unocss.netlify.app
+
+export default defineConfig({
+  presets: [
+    presetUno,
+    presetVarlet(),
+    presetAttributify,
+    presetIcons(),
+    // Why use this plug-in?
+    // The template uses viewport as the mobile adaptation scheme, and the default unit of unocss is rem
+    // So it needs to be converted to px, and then postcss converts px to vw/vh to complete the adaptation.
+    presetRemToPx({
+      // Why do you want to set the basic font size here? Read the following article.
+      // https://juejin.cn/post/7262975395620618298
+      baseFontSize: 4,
+    }),
+    presetMini(),
+  ],
+  shortcuts: [
+    // shortcuts to multiple utilities
+    ['btn', 'px-6 py-3 rounded-3 border-none inline-block bg-green-400 text-white cursor-pointer !outline-none hover:bg-green-600 disabled:cursor-default disabled:bg-gray-600 disabled:opacity-50'],
+  ],
+})