部署后提示用户更新06

src/App.vue

@@ -1,13 +1,13 @@
-<template>
-  <div id="app">
-    <router-view />
-  </div>
-</template>
-
-<script>
-import store from './store'
-
-export default {
-  name: 'App'
-}
-</script>
+<template>
+  <div id="app">
+    <router-view />
+  </div>
+</template>
+
+<script>
+import store from './store'
+
+export default {
+  name: 'App'
+}
+</script>

src/components/LangSelect/index.vue

@@ -1,42 +1,42 @@
-<template>
-  <el-dropdown trigger="click" class="international" @command="handleSetLanguage">
-    <div>
-      <svg-icon class-name="international-icon" icon-class="language" />
-    </div>
-    <el-dropdown-menu slot="dropdown">
-      <el-dropdown-item :disabled="language==='zh'" command="zh">
-        中文
-      </el-dropdown-item>
-      <el-dropdown-item :disabled="language==='en'" command="en">
-        English
-      </el-dropdown-item>
-<!--      <el-dropdown-item :disabled="language==='es'" command="es">-->
-<!--        Español-->
-<!--      </el-dropdown-item>-->
-<!--      <el-dropdown-item :disabled="language==='ja'" command="ja">-->
-<!--        日本語-->
-<!--      </el-dropdown-item>-->
-    </el-dropdown-menu>
-  </el-dropdown>
-</template>
-
-<script>
-export default {
-  computed: {
-    language() {
-      return this.$store.getters.language
-    }
-  },
-  methods: {
-    handleSetLanguage(lang) {
-      this.$i18n.locale = lang
-			// 调用setLanguage方法,设置语言,存储到cookie
-      this.$store.dispatch('app/setLanguage', lang)
-      this.$message({
-        message: this.$t('common.switchLanguageHints'),
-        type: 'success'
-      })
-    }
-  }
-}
-</script>
+<template>
+  <el-dropdown trigger="click" class="international" @command="handleSetLanguage">
+    <div>
+      <svg-icon class-name="international-icon" icon-class="language" />
+    </div>
+    <el-dropdown-menu slot="dropdown">
+      <el-dropdown-item :disabled="language==='zh'" command="zh">
+        中文
+      </el-dropdown-item>
+      <el-dropdown-item :disabled="language==='en'" command="en">
+        English
+      </el-dropdown-item>
+      <!--      <el-dropdown-item :disabled="language==='es'" command="es">-->
+      <!--        Español-->
+      <!--      </el-dropdown-item>-->
+      <!--      <el-dropdown-item :disabled="language==='ja'" command="ja">-->
+      <!--        日本語-->
+      <!--      </el-dropdown-item>-->
+    </el-dropdown-menu>
+  </el-dropdown>
+</template>
+
+<script>
+export default {
+  computed: {
+    language() {
+      return this.$store.getters.language
+    }
+  },
+  methods: {
+    handleSetLanguage(lang) {
+      this.$i18n.locale = lang
+      // 调用setLanguage方法,设置语言,存储到cookie
+      this.$store.dispatch('app/setLanguage', lang)
+      this.$message({
+        message: this.$t('common.switchLanguageHints'),
+        type: 'success'
+      })
+    }
+  }
+}
+</script>

src/utils/request.js

@@ -1,156 +1,163 @@
-import router from '@/router'
-import axios from 'axios'
-import { Message } from 'element-ui'
-import Cookies from 'js-cookie'
-import tool from './tool'
-import usersInfo from './usersInfo'
-// create an axios instance
-const service = axios.create({
-  baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url
-
-  // withCredentials: true, // send cookies when cross-domain requests
-  timeout: 12000 // request timeout
-})
-// request interceptor
-service.interceptors.request.use(
-  config => {
-    // do something before request is sent
-
-    // if (store.getters.token) {
-    //   // let each request carry token
-    //   // ['X-Token'] is a custom headers key
-    //   // please modify it according to the actual situation
-    //   config.headers['X-Token'] = getToken()
-    // }
-    if (usersInfo.accessToken()) {
-      config.headers['Authorization'] = process.env.VUE_APP_ACCESS_TOKEN_PREFIX + usersInfo.accessToken()
-    }
-    // 设置语言
-    config.headers['language'] = Cookies.get('language')
-
-    if (usersInfo.accessToken() && usersInfo.accessTokenExpiresIn() &&
-    parseInt(usersInfo.accessTokenExpiresIn()) + parseInt(usersInfo.accessTokenUpdateAt()) - 30 > parseInt(tool.getTimestamp())) {
-    } else if (usersInfo.accessToken()) {
-      // 需要先刷新token
-      const refreshToken = usersInfo.refreshToken()
-      const refreshTokenExpiresIn = usersInfo.refreshTokenExpiresIn()
-      const refreshTokenUpdateAt = usersInfo.refreshTokenUpdateAt()
-      if (refreshToken && refreshTokenExpiresIn &&
-        parseInt(refreshTokenExpiresIn) - 30 + parseInt(refreshTokenUpdateAt) > parseInt(tool.getTimestamp())) {
-        // 有效，去更新
-        axios.get(`${process.env.VUE_APP_BASE_API}/v1/oauth/refresh-token?refresh-token=${refreshToken}`).then(response => {
-          // 更新本地accessToken
-          usersInfo.accessToken(response.data.accessToken)
-          usersInfo.accessTokenExpiresIn(response.data.accessTokenExpiresIn)
-          usersInfo.accessTokenUpdateAt(response.data.accessTokenUpdateAt)
-          usersInfo.refreshToken(response.data.refreshToken)
-          usersInfo.refreshTokenExpiresIn(response.data.refreshTokenExpiresIn)
-          usersInfo.refreshTokenUpdateAt(response.data.refreshTokenUpdateAt)
+import router from '@/router'
+import axios from 'axios'
+import { Message } from 'element-ui'
+import Cookies from 'js-cookie'
+import tool from './tool'
+import usersInfo from './usersInfo'
+// create an axios instance
+const service = axios.create({
+  baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url
+
+  // withCredentials: true, // send cookies when cross-domain requests
+  timeout: 12000 // request timeout
+})
+// request interceptor
+service.interceptors.request.use(
+  config => {
+    // do something before request is sent
+
+    // if (store.getters.token) {
+    //   // let each request carry token
+    //   // ['X-Token'] is a custom headers key
+    //   // please modify it according to the actual situation
+    //   config.headers['X-Token'] = getToken()
+    // }
+    if (usersInfo.accessToken()) {
+      config.headers['Authorization'] = process.env.VUE_APP_ACCESS_TOKEN_PREFIX + usersInfo.accessToken()
+    }
+    // 设置语言
+    config.headers['language'] = Cookies.get('language')
+
+    if (usersInfo.accessToken() && usersInfo.accessTokenExpiresIn() &&
+    parseInt(usersInfo.accessTokenExpiresIn()) + parseInt(usersInfo.accessTokenUpdateAt()) - 30 > parseInt(tool.getTimestamp())) {
+    } else if (usersInfo.accessToken()) {
+      // 需要先刷新token
+      const refreshToken = usersInfo.refreshToken()
+      const refreshTokenExpiresIn = usersInfo.refreshTokenExpiresIn()
+      const refreshTokenUpdateAt = usersInfo.refreshTokenUpdateAt()
+      if (refreshToken && refreshTokenExpiresIn &&
+        parseInt(refreshTokenExpiresIn) - 30 + parseInt(refreshTokenUpdateAt) > parseInt(tool.getTimestamp())) {
+        // 有效，去更新
+        axios.get(`${process.env.VUE_APP_BASE_API}/v1/oauth/refresh-token?refresh-token=${refreshToken}`).then(response => {
+          // 更新本地accessToken
+          usersInfo.accessToken(response.data.accessToken)
+          usersInfo.accessTokenExpiresIn(response.data.accessTokenExpiresIn)
+          usersInfo.accessTokenUpdateAt(response.data.accessTokenUpdateAt)
+          usersInfo.refreshToken(response.data.refreshToken)
+          usersInfo.refreshTokenExpiresIn(response.data.refreshTokenExpiresIn)
+          usersInfo.refreshTokenUpdateAt(response.data.refreshTokenUpdateAt)
           usersInfo.accessToken()
-        }).catch(error => {
-          Message({
-            message: 'accessToken Failed',
-            type: 'error',
-            duration: 5 * 1000
-          })
-          return
-        })
-      } else {
-        // console.log('refreshToken已失效');
-        usersInfo.clear()
-        Message({
-          message: 'refreshToken Invalid',
-          type: 'error',
-          duration: 5 * 1000
-        })
-        return
-      }
-    }
-
-    return config
-  },
-  error => {
-    // do something with request error
-    console.log('请求报错----->', error) // for debug
-    return Promise.reject(error)
-  }
-)
-
-// response interceptor
-service.interceptors.response.use(
-  response => {
-    const responseData = response.data
-    const data = responseData.data
-    if ((responseData.success === false) || (responseData.code && responseData.code !== 200)) {
-      // Message({
-      //   message: responseData.message || 'Error',
-      //   type: 'error',
-      //   duration: 5 * 1000
-      // })
-      return Promise.reject(responseData.message)
-    } else {
-      if (!data) {
-        return { data: responseData }
-      }
-      return data
-    }
-  },
-  err => {
-    if (err && err.response && err.response.data && err.response.data.message) {
-      err.message = err.response.data.message
-    } else if (err && err.response) {
-      switch (err.response.data.status) {
-        case 400:
-          err.message = '请求错误'
-          break
-        case 401:
-          err.message = '未授权，请登录'
-          break
-        case 403:
-          err.message = '拒绝访问'
-          break
-        case 404:
-          err.message = `请求地址出错: ${err.response.data.config.url}`
-          break
-        case 408:
-          err.message = '请求超时'
-          break
-        case 500:
-          err.message = '服务器内部错误'
-          break
-        case 501:
-          err.message = '服务未实现'
-          break
-        case 502:
-          err.message = '网关错误'
-          break
-        case 503:
-          err.message = '服务不可用'
-          break
-        case 504:
-          err.message = '网关超时'
-          break
-        case 505:
-          err.message = 'HTTP版本不受支持'
-          break
-        default:
-      }
-    }
-    if (err.response.data.status == 401) {
-      localStorage.clear()
-      router.replace({
-        path: '/login',
-        query: { redirect: router.currentRoute.fullPath }
-      })
-    }
-    // Message({
-    //   message: err.message || 'Error',
-    //   type: 'error',
-    //   duration: 5 * 1000
-    // })
-
-    return Promise.reject(err)
-  }
-)
-
-export default service
+        }).catch(error => {
+          Message({
+            message: 'accessToken Failed',
+            type: 'error',
+            duration: 5 * 1000
+          })
+          return
+        })
+      } else {
+        // console.log('refreshToken已失效');
+        usersInfo.clear()
+        Message({
+          message: 'refreshToken Invalid',
+          type: 'error',
+          duration: 5 * 1000
+        })
+        return
+      }
+    }
+
+    return config
+  },
+  error => {
+    // do something with request error
+    console.log('请求报错----->', error) // for debug
+    return Promise.reject(error)
+  }
+)
+
+// response interceptor
+service.interceptors.response.use(
+  response => {
+    const responseData = response.data
+    const data = responseData.data
+    if ((responseData.success === false) || (responseData.code && responseData.code !== 200)) {
+      // Message({
+      //   message: responseData.message || 'Error',
+      //   type: 'error',
+      //   duration: 5 * 1000
+      // })
+      return Promise.reject(responseData.message)
+    } else {
+      if (!data) {
+        return { data: responseData }
+      }
+      return data
+    }
+  },
+  err => {
+    if (err && err.response && err.response.data && err.response.data.message) {
+      err.message = err.response.data.message
+    } else if (err && err.response) {
+      switch (err.response.data.status) {
+        case 400:
+          err.message = '请求错误'
+          break
+        case 401:
+          err.message = '未授权，请登录'
+          break
+        case 403:
+          err.message = '拒绝访问'
+          break
+        case 404:
+          err.message = `请求地址出错: ${err.response.data.config.url}`
+          break
+        case 408:
+          err.message = '请求超时'
+          break
+        case 500:
+          err.message = '服务器内部错误'
+          break
+        case 501:
+          err.message = '服务未实现'
+          break
+        case 502:
+          err.message = '网关错误'
+          break
+        case 503:
+          err.message = '服务不可用'
+          break
+        case 504:
+          err.message = '网关超时'
+          break
+        case 505:
+          err.message = 'HTTP版本不受支持'
+          break
+        default:
+      }
+    }
+    if (err.response.data.status == 401) {
+      localStorage.clear()
+      router.replace({
+        path: '/login',
+        query: { redirect: router.currentRoute.fullPath }
+      })
+    }
+    if (err.response.data.status == 403 || err.response.data.status == 400) {
+      Message({
+        message: err.message || 'Error',
+        type: 'error',
+        duration: 3 * 1000
+      })
+    }
+    // Message({
+    //   message: err.message || 'Error',
+    //   type: 'error',
+    //   duration: 5 * 1000
+    // })
+
+    return Promise.reject(err)
+  }
+)
+
+export default service

vue.config.js

@@ -1,7 +1,9 @@
 'use strict'
+// const store = require('./src/store')
 const path = require('path')
 const defaultSettings = require('./src/settings.js')
 const { WebUpdateNotificationPlugin } = require('@plugin-web-update-notification/webpack')
+const lang = 'en'
 
 function resolve(dir) {
   return path.join(__dirname, dir)
@@ -61,27 +63,27 @@ module.exports = {
       new WebUpdateNotificationPlugin({
         logVersion: true,
         notificationProps: {
-          title: 'System update',
-          description: 'System update, please refresh the page',
-          buttonText: '刷新',
-          dismissButtonText: '忽略'
-        },
+          title: lang === 'en' ? '📢 System update' : '📢 系统更新',
+          description: lang === 'en' ? 'System update, please refresh the page' : '系统更新，请刷新页面',
+          buttonText: lang === 'en' ? 'refresh' : '刷新',
+          dismissButtonText: lang === 'en' ? 'dismiss' : '忽略'
+        }
         // plugin preset: zh_CN | zh_TW | en_US
         // locale: 'en_US',
-        localeData: {
-          en_US: {
-            title: 'System update',
-            description: 'System update, please refresh the page',
-            buttonText: 'refresh',
-            dismissButtonText: 'dismiss'
-          },
-          zh_CN: {
-            title: '📢 系统更新',
-            description: '系统更新，请刷新页面',
-            buttonText: '刷新',
-            dismissButtonText: '取消'
-          }
-        }
+        // localeData: {
+        //   en_US: {
+        //     title: 'System update',
+        //     description: 'System update, please refresh the page',
+        //     buttonText: 'refresh',
+        //     dismissButtonText: 'dismiss'
+        //   },
+        //   zh_CN: {
+        //     title: '📢 系统更新',
+        //     description: '系统更新，请刷新页面',
+        //     buttonText: '刷新',
+        //     dismissButtonText: '取消'
+        //   }
+        // }
       })
     ]
   },