refactor: 重构I18n目录结构，添加地区选择列表

src/components/Application/AppLocale.vue

@@ -5,15 +5,16 @@
     </span>
     <template #dropdown>
       <el-dropdown-menu>
-        <el-dropdown-item command="zh-ch">中文简体</el-dropdown-item>
-        <el-dropdown-item command="en">English</el-dropdown-item>
+        <el-dropdown-item v-for="item in localesList" :key="item.locale" :command="item.locale">{{
+          item.name
+        }}</el-dropdown-item>
       </el-dropdown-menu>
     </template>
   </el-dropdown>
 </template>
 
 <script setup lang="ts">
-  import { useI18n } from '@/hooks/useI18n';
+  import { useI18n, localesList } from '@/hooks/useI18n';
   import SvgIcon from '@/components/SvgIcon/index.vue';
 
   const i18n = useI18n();
@@ -22,8 +23,6 @@
     i18n.locale.value = key;
   };
 
-  console.log(i18n);
-
   // const options = ref([
   // 	{ name: '123', value: 'variables-theme-day' },
   // 	{ name: '456', value: 'variables-theme-dark' },

src/hooks/useI18n.ts

@@ -1,4 +1,4 @@
-import i18n from '@/locales/index';
+import i18n, { availableLocales } from '@/locales/index';
 import zh_Cn from 'element-plus/lib/locale/lang/zh-cn';
 import en from 'element-plus/lib/locale/lang/en';
 import { computed } from '@vue/reactivity';
@@ -7,6 +7,8 @@ export const useI18n = () => i18n.global;
 
 export const t = (key: string) => key;
 
+export const localesList = availableLocales;
+
 export const deffElementLocale = () => {
   const { locale } = useI18n();
 

src/hooks/web/useMessage.tsx

@@ -1,29 +1,25 @@
-import { ElMessageBox, ElMessageBoxOptions } from 'element-plus'
-import { useI18n } from '@/hooks/useI18n'
+import { ElMessageBox, ElMessageBoxOptions } from 'element-plus';
+import { useI18n } from '@/hooks/useI18n';
 
-const { t } = useI18n()
+const { t } = useI18n();
 
-function createElMessageBox(
-	message: string,
-	title: string,
-	options: ElMessageBoxOptions
-) {
-	console.log(title)
-	ElMessageBox.confirm(message, title, options)
-		.then(() => {})
-		.catch(() => {})
+function createElMessageBox(message: string, title: string, options: ElMessageBoxOptions) {
+  console.log(title);
+  ElMessageBox.confirm(message, title, options)
+    .then(() => {})
+    .catch(() => {});
 }
 
 function createErrorModal(message: string) {
-	createElMessageBox(message, t('sys.errorTip'), {
-		confirmButtonText: t('sys.okText'),
-		cancelButtonText: 'Cancel',
-		type: 'error',
-	})
+  createElMessageBox(message, t('sys.errorTip'), {
+    confirmButtonText: t('sys.okText'),
+    cancelButtonText: t('sys.closeText'),
+    type: 'error',
+  });
 }
 
 export function useMessage() {
-	return {
-		createErrorModal,
-	}
+  return {
+    createErrorModal,
+  };
 }

src/locales/en/index.ts

@@ -0,0 +1,13 @@
+const config = import.meta.globEager('./modules/*.ts');
+
+const messages: Recordable = {};
+Object.keys(config).forEach((key) => {
+  const name: RegExpMatchArray = key.match(/^\.\/([\s\S]+)\/([\s\S]+)\.ts$/) || [];
+  const valueName = name[2];
+  const value = config[key].default || {};
+  messages[valueName] = value;
+});
+
+export const name = 'English';
+
+export default messages;

src/locales/index.ts

@@ -1,6 +1,19 @@
 import { App } from 'vue';
 import { createI18n } from 'vue-i18n';
-import messages from './modules';
+interface localesType {
+  name: string;
+  locale: string;
+}
+
+const config = import.meta.globEager('./**/index.ts');
+
+const messages: any = {};
+const localesList: localesType[] = [];
+Object.keys(config).forEach((key) => {
+  const name: any = key.match(/^\.\/([\s\S]+)\/index.ts$/);
+  messages[name[1]] = config[key].default;
+  localesList.push({ name: config[key].name, locale: name[1] });
+});
 
 const i18n = createI18n({
   legacy: false,
@@ -13,4 +26,6 @@ export const configMainI18n = (app: App<Element>) => {
   app.use(i18n);
 };
 
+export const availableLocales: localesType[] = localesList;
+
 export default i18n;

src/locales/zh-ch/index.ts

@@ -0,0 +1,14 @@
+const config = import.meta.globEager('./modules/*.ts');
+
+const messages: Recordable = {};
+
+Object.keys(config).forEach((key) => {
+  const name: RegExpMatchArray = key.match(/^\.\/([\s\S]+)\/([\s\S]+)\.ts$/) || [];
+  const valueName = name[2];
+  const value = config[key].default || {};
+  messages[valueName] = value;
+});
+
+export const name = '中文简体';
+
+export default messages;

src/router/modules/index.ts

@@ -9,6 +9,5 @@ Object.keys(modules).forEach((key) => {
   const modList = Array.isArray(mod) ? [...mod] : [mod];
   routeModuleList.push(...modList);
 });
-console.log(routeModuleList);
 
 export default routeModuleList;

types/axios.d.ts

@@ -1,20 +1,20 @@
-export type ErrorMessageMode = 'none' | 'modal' | 'message' | undefined
+export type ErrorMessageMode = 'none' | 'modal' | 'message' | undefined;
 export interface RequestOptions {
-	// 是否只放回data数据
-	isShowData?: boolean
-	// 网址前缀 留空使用默认
-	urlPrefix?: string
-	// 设置token
-	specialToken?: string
-	// 是否开启自定义请求报错提示
-	errorMassge?: boolean
-	// 是否携带token
-	withToken?: boolean
-	// 错误消息提示类型
-	errorMessageMode?: ErrorMessageMode
+  // 是否只放回data数据
+  isShowData?: boolean;
+  // 网址前缀 留空使用默认
+  urlPrefix?: string;
+  // 设置token
+  specialToken?: string;
+  // 是否开启自定义请求报错提示
+  errorMassge?: boolean;
+  // 是否携带token
+  withToken?: boolean;
+  // 错误消息提示类型
+  errorMessageMode?: ErrorMessageMode;
 }
 export interface Result<T = any> {
-	code: number
-	message: string
-	data: T
+  code: number;
+  message: string;
+  data: T;
 }