fix:修改请求错误提示内容，初始化多语言配置等

src/App.vue

@@ -1,7 +1,16 @@
-<script setup></script>
+<script setup>
+import { useLocaleStore } from '@/store/module/locale.store'
+import { useElementPlusLocale } from '@/locales/useLocale'
+
+const { currentLocale } = useLocaleStore()
+
+const { locale } = useElementPlusLocale(currentLocale)
+</script>
 
 <template>
+  <el-config-provider :locale="locale">
     <RouterView />
+  </el-config-provider>
 </template>
 
 <style scoped></style>

src/api/login.js

@@ -18,6 +18,10 @@ export const test = () => {
   return http({
     url: '/test',
     method: 'post',
-    data: { uname: 'tom' }
+    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
+    data: {
+      name: 'test',
+      files: 123
+    }
   })
 }

src/locales/lang/zh-CN/common.js

@@ -0,0 +1,16 @@
+export default {
+  apiMsg: {
+    200: '成功',
+    201: '创建成功',
+    202: '操作成功',
+    204: '操作成功',
+    400: '请求错误',
+    401: '未授权，请重新登录',
+    403: '拒绝访问',
+    404: '请求错误，未找到该资源',
+    405: '请求方法未允许',
+    408: '请求超时',
+    500: '服务器错误',
+    501: '网络未实现'
+  }
+}

src/locales/useLocale.js

@@ -0,0 +1,12 @@
+import { ref } from 'vue'
+import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
+import en from 'element-plus/dist/locale/en.mjs'
+
+const useElementPlusLocale = (l = 'en') => {
+  const locale = ref(l === 'zh-CN' ? zhCn : en)
+  return {
+    locale
+  }
+}
+
+export { useElementPlusLocale }

src/store/module/locale.store.js

@@ -0,0 +1,25 @@
+import { defineStore } from 'pinia'
+
+const useLocaleStore = defineStore('locale', {
+  state: () => {
+    return {
+      LOCALE_MAP: {
+        'zh-CN': 'zh-CN',
+        en: 'en'
+      },
+      currentLocale: navigator.language
+    }
+  },
+  getters: {},
+  actions: {
+    setCurrentLocale(l) {
+      this.currentLocale = this.LOCALE_MAP[l]
+    }
+  },
+  // 持久化存储
+  persist: {
+    storage: window.localStorage
+  }
+})
+
+export { useLocaleStore }

src/utils/request/errMsg.js

@@ -0,0 +1,10 @@
+import { ElMessage, ElMessageBox, Notification } from 'element-plus'
+
+
+export const errorMsg = ()=>{
+  ElMessage({
+    message: '操作失败',
+    type: 'error',
+    duration: 5 * 1000
+  })
+}

src/utils/request/index.js

@@ -1,8 +1,7 @@
 import axios from 'axios'
-import { useRouter } from 'vue-router'
 import { ElMessage, ElNotification } from 'element-plus'
 
-const router = useRouter()
+import { router } from '@/router'
 
 const API_URL = import.meta.env.VITE_API_BASE_URL
 
@@ -25,7 +24,7 @@ $http.interceptors.request.use(
   (config) => {
     config.headers.Authorization = localStorage.getItem('token')
       ? `Bearer ${localStorage.getItem('token')}`
-      : 'NO TOKEN'
+      : ''
     return config
   },
   (error) => {
@@ -48,8 +47,7 @@ $http.interceptors.response.use(
         router.push({ path: '/login' })
       }
     } else {
-      ElNotification({
-        title: '错误',
+      ElMessage({
         message: res.data.message,
         type: 'error',
         duration: 2000
@@ -58,8 +56,14 @@ $http.interceptors.response.use(
 
     return res.data
   },
-
+  // 请求出错
   (error) => {
+    ElNotification({
+      title: '请求错误',
+      message: error.message,
+      type: 'error',
+      duration: 2000
+    })
     return Promise.reject(error)
   }
 )

src/views/Home/src/Home.vue

@@ -11,7 +11,9 @@ test()
 </script>
 
 <template>
-  <div class="home">home</div>
+  <div class="home">
+    home
+  </div>
 </template>
 
 <style lang="scss" scoped></style>