登录

package.json

@@ -23,9 +23,11 @@
   "dependencies": {
     "@element-plus/icons-vue": "^2.0.9",
     "axios": "0.21.3",
+    "blueimp-md5": "^2.19.0",
     "echarts": "5.3.2",
     "el-table-infinite-scroll": "^3.0.1",
     "element-plus": "^2.2.9",
+    "js-cookie": "^3.0.1",
     "js-error-collection": "^1.0.7",
     "mitt": "^3.0.0",
     "moment-mini": "2.22.1",

public/demo.js

@@ -1,3 +1,25 @@
-const apiConfig = {
-  url: 'http://www.baidu.com'
+/* url配置 */
+const PLATFROM_CONFIG = {
+  baseNewUrl: "http://120.26.64.82:8093/", //登录前的http请求地址
+  baseUrl: "http://120.26.64.82:8095/", // 4A-http请求地址
+  appKeyString: "9inu7zpllz1folzsljm498dcpi0lsog1", //appSecret
+  appId: "q7kdjmmaf0kerwpf", //appid
+  baseURLCA: "http://10.211.67.163:16300", // 登录后的http请求地址-测试
+  baggageMessageURL: "/openApi/query",
+};
+
+/* 轮询间隔 */
+const LOOP_INTERVAL = {
+  arrivalTable: 5 * 1000, // 进港视图表格
+  departureTable: 5 * 1000, // 离港视图表格
+  transferArrivalTable: 5 * 1000, // 中转进港表格
+  transferDepartureTable: 5 * 1000, // 中转离港表格
+  baggageTrack: 5 * 1000, // 行李跟踪节点信息
+  baggageDetails: 5 * 1000, // 行李详情表格
+  baggageMessage: 15 * 1000, // 行李原始报文
+};
+
+const DATACONTENT_ID = {
+  /***-----登录------***/
+  loginId: 36, //登录-获取权限-id
 }

src/api/dataIntegration.ts

@@ -0,0 +1,75 @@
+/*
+ * @Author: Badguy
+ * @Date: 2022-04-13 14:35:17
+ * @LastEditTime: 2022-05-13 09:26:03
+ * @LastEditors: your name
+ * @Description: 数据整合接口
+ * have a nice day!
+ */
+
+import request from '@/utils/axiosReq'
+import { ElMessage } from 'element-plus'
+
+export function GeneralDataReception(params) {
+  return request({
+    url: '/openApi/generalDataReception',
+    method: 'post',
+    headers: {
+      'content-type': 'application/json',
+    },
+    data: params,
+  })
+}
+
+export function Query(params) {
+  return request({
+    url: '/openApi/query',
+    method: 'post',
+    headers: {
+      'content-type': 'application/json',
+    },
+    data: params,
+  })
+}
+
+//服务管理-启动
+export function Start(params) {
+  return request({
+    url: '/openApi/start',
+    method: 'post',
+    headers: {
+      'content-type': 'application/json',
+    },
+    data: params,
+  })
+}
+
+//服务管理-停止
+export function Stop(params) {
+  return request({
+    url: '/openApi/stop',
+    method: 'post',
+    headers: {
+      'content-type': 'application/json',
+    },
+    data: params,
+  })
+}
+
+export async function myQuery(id, ...dataContent) {
+  const params = {
+    id,
+    dataContent,
+  }
+  try {
+    const result = await Query(params)
+    if (Number(result.code) === 0) {
+      return result.returnData.listValues
+    } else {
+      ElMessage.error(result.message ?? '失败')
+      return Promise.reject(result.message)
+    }
+  } catch (error) {
+    return Promise.reject(error)
+  }
+}

src/api/newLogin.ts

@@ -0,0 +1,83 @@
+/*
+ * @Author: your name
+ * @Date: 2022-02-21 09:15:17
+ * @LastEditTime: 2022-02-23 15:11:47
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: \CABaggageData\src\api\login.js
+ */
+import request from '@/utils/mockAxiosReq'
+
+//获取动态验证码
+export function GetCheckCode(params) {
+  return request({
+    url: '/foxlibc/verification-code',
+    method: 'post',
+    data: params,
+  })
+}
+
+//登录
+export function login(params) {
+  return request({
+    url: '/foxlibc/sign-in',
+    method: 'post',
+    data: params,
+  })
+}
+
+//登出
+export function loginUp(params) {
+  return request({
+    url: '/foxlibc/sign-out',
+    method: 'post',
+    data: params,
+  })
+}
+
+//忘记密码
+export function changePassword(params) {
+  return request({
+    url: '/foxlibc/reset-passwd',
+    method: 'post',
+    data: params,
+  })
+}
+
+//忘记密码
+export function changeSecpasswd(params) {
+  return request({
+    url: '/foxlibc/reset-secpasswd',
+    method: 'post',
+    data: params,
+  })
+}
+
+//权限获取
+export function permission(params) {
+  return request({
+    url: '/api/fs4a/GetAuth/v1',
+    method: 'post',
+    data: params,
+  })
+}
+
+//token
+export function gettoken(params) {
+  return request({
+    url: '/foxlibc/application-token',
+    method: 'post',
+    data: params,
+    istoken: true,
+  })
+}
+
+//获取系统基础设置
+export function GetSystemSet(params) {
+  return request({
+    url: '/foxlibc/system/setting',
+    method: 'post',
+    data: params,
+    proxy: true,
+  })
+}

src/permission.ts

@@ -1,6 +1,6 @@
 import router, { asyncRoutes } from '@/router'
 import settings from './settings'
-import { getToken, setToken } from '@/utils/auth'
+import { getToken, setToken, TokenKey } from '@/utils/auth'
 import NProgress from 'nprogress'
 NProgress.configure({ showSpinner: false }) // NProgress Configuration
 import 'nprogress/nprogress.css'
@@ -15,8 +15,8 @@ router.beforeEach(async (to: any, from, next: any) => {
   if (settings.isNeedNprogress) NProgress.start()
   // set page title
   document.title = getPageTitle(to.meta.title)
-  if (!settings.isNeedLogin) setToken(settings.tmpToken)
-  const hasToken: string | null = getToken()
+  if (!settings.isNeedLogin) setToken(TokenKey, settings.tmpToken)
+  const hasToken: string | null = getToken(TokenKey)
 
   const userStore = useUserStore()
   const permissionStore = usePermissionStore()

src/store/user.ts

@@ -1,5 +1,13 @@
 import { loginReq, logoutReq, getInfoReq } from '@/api/user'
-import { setToken, removeToken } from '@/utils/auth'
+import {
+  getToken,
+  setToken,
+  removeToken,
+  setUserId,
+  TokenKey,
+} from '@/utils/auth'
+import { Query } from '@/api/dataIntegration'
+import { login, loginUp } from '@/api/newLogin'
 import { ObjTy } from '~/common'
 import router, { constantRoutes, asyncRoutes } from '@/router'
 import { defineStore } from 'pinia'
@@ -20,7 +28,17 @@ export const useUserStore = defineStore('user', {
     return {
       username: '',
       avatar: '',
-      roles: [] as Array<any>
+      roles: [] as Array<any>,
+      token: getToken(),
+      UserType: sessionStorage.getItem('UserType')
+        ? sessionStorage.getItem('UserType')
+        : '',
+      UserId: sessionStorage.getItem('User_Id')
+        ? sessionStorage.getItem('User_Id')
+        : '',
+      userPoewrList: sessionStorage.getItem('userAuthList')
+        ? JSON.parse(sessionStorage.getItem('userAuthList'))
+        : [],
     }
   },
 
@@ -30,23 +48,53 @@ export const useUserStore = defineStore('user', {
         state.username = username
       })
     },
+    M_AVATAR(avatar: string) {
+      this.$patch((state) => {
+        state.avatar = avatar
+      })
+    },
     M_roles(roles: Array<string>) {
       this.$patch((state) => {
         state.roles = roles
       })
     },
 
+    SET_TOKEN(token: string) {
+      this.$patch((state) => {
+        state.token = token
+      })
+    },
+
+    SET_UserId(UserId: string) {
+      this.$patch((state) => {
+        state.UserId = UserId
+      })
+    },
+    SET_UserType(UserType: string) {
+      this.$patch((state) => {
+        state.UserType = UserType
+        sessionStorage.setItem('UserType', UserType)
+      })
+    },
+    SET_UserPoewrList(userPoewrList: any) {
+      this.$patch((state) => {
+        state.userPoewrList = userPoewrList
+      })
+    },
+
     login(data: ObjTy) {
       return new Promise((resolve, reject) => {
-        loginReq(data)
+        login(data)
           .then((res: ObjTy) => {
-            if (res.code === 20000) {
-              //commit('SET_Token', res.data?.jwtToken)
-              setToken(res.data?.jwtToken)
-              resolve(null)
-            } else {
-              reject(res)
-            }
+            const { date, token, userid } = res.data
+            this.SET_TOKEN(token)
+            this.SET_UserId(userid)
+            this.SET_UserType('1')
+            setToken('userName', data.username)
+            setToken(TokenKey, token)
+            setUserId(userid)
+            setToken('userid', userid)
+            resolve(null)
           })
           .catch((error: any) => {
             reject(error)
@@ -56,24 +104,63 @@ export const useUserStore = defineStore('user', {
     // get user info
     getInfo() {
       return new Promise((resolve, reject) => {
-        getInfoReq()
-          .then((response: ObjTy) => {
-            const { data } = response
-            if (!data) {
-              return reject('Verification failed, please Login again.')
-            }
-            //此处模拟数据
-            const rolesArr: any = localStorage.getItem('roles')
-            if (rolesArr) {
-              data.roles = JSON.parse(rolesArr)
+        Query({
+          id: DATACONTENT_ID.loginId,
+          dataContent: [getToken('userid')],
+        })
+          .then((res: ObjTy) => {
+            if (res.code == 0) {
+              const { listValues } = res.returnData
+              const datas = listValues
+              if (datas && datas.length) {
+                const arrs: any = []
+                for (const item of datas) {
+                  if (item.ident) {
+                    arrs.push(item.ident)
+                  }
+                }
+                // arrs.push('transit');
+                sessionStorage.setItem('userAuthList', JSON.stringify(arrs))
+                setTimeout(() => {
+                  const data = {
+                    roles: arrs,
+                    introduction: '',
+                    avatar: '',
+                    name: getToken('userName'),
+                    token: this.token,
+                  }
+
+                  const { name, avatar, roles } = data
+                  this.M_username(name)
+                  this.M_AVATAR(avatar)
+                  this.M_roles(roles ? roles : ['admin'])
+                  this.SET_UserPoewrList(roles ? roles : ['admin'])
+                  resolve(data)
+                }, 100)
+              } else {
+                const arr: any = []
+                sessionStorage.setItem('userAuthList', arr)
+                setTimeout(() => {
+                  const data = {
+                    roles: this.userPoewrList,
+                    introduction: '',
+                    avatar: '',
+                    name: getToken('userName'),
+                    token: this.token,
+                  }
+
+                  const { name, avatar, roles } = data
+
+                  this.M_username(name)
+                  this.M_AVATAR(avatar)
+                  this.M_roles(roles ? roles : ['admin'])
+                  this.SET_UserPoewrList(roles ? roles : ['admin'])
+                  resolve(data)
+                }, 100)
+              }
             } else {
-              data.roles = ['admin']
-              localStorage.setItem('roles', JSON.stringify(data.roles))
+              reject(res.returnData)
             }
-            const { roles, username } = data
-            this.M_username(username)
-            this.M_roles(roles)
-            resolve(data)
           })
           .catch((error: any) => {
             reject(error)
@@ -83,7 +170,7 @@ export const useUserStore = defineStore('user', {
     // user logout
     logout() {
       return new Promise((resolve, reject) => {
-        logoutReq()
+        loginUp({})
           .then(() => {
             this.resetState()
             resolve(null)
@@ -95,6 +182,10 @@ export const useUserStore = defineStore('user', {
     },
     resetState() {
       return new Promise((resolve) => {
+        sessionStorage.clear()
+        removeToken('codeToken')
+        removeToken('systemSet')
+        removeToken('userid')
         this.M_username('')
         this.M_roles([])
         removeToken() // must remove  token  first
@@ -105,6 +196,6 @@ export const useUserStore = defineStore('user', {
         tagsViewStore.delAllViews()
         resolve(null)
       })
-    }
-  }
+    },
+  },
 })

src/utils/auth.ts

@@ -1,13 +1,31 @@
-const TokenKey = "Admin-Token";
+import Cookies from 'js-cookie'
 
-export function getToken() {
-  return localStorage.getItem(TokenKey);
+export const TokenKey = 'vue_admin_template_token'
+
+export function getToken(name = TokenKey) {
+  return Cookies.get(name)
+}
+
+export function setToken(name = TokenKey, token) {
+  return Cookies.set(name, token)
+}
+
+export function setCodeToken(token) {
+  return Cookies.set('codeToken', token)
+}
+
+export function getCodeToken() {
+  return Cookies.get('codeToken')
+}
+
+export function removeToken(name = TokenKey) {
+  return Cookies.remove(name)
 }
 
-export function setToken(token: string) {
-  return localStorage.setItem(TokenKey, token);
+export function setUserId(id) {
+  return sessionStorage.setItem('User_Id', id)
 }
 
-export function removeToken() {
-  return localStorage.removeItem(TokenKey);
+export function getUserId() {
+  return sessionStorage.getItem('User_Id')
 }

src/utils/axiosReq.ts

@@ -13,7 +13,7 @@ const service: any = axios.create()
 service.interceptors.request.use(
   (request: AxiosReqTy) => {
     // token setting
-    request.headers['AUTHORIZE_TOKEN'] = getToken()
+    request.headers['token'] = getToken()
     /* download file*/
     if (request.isDownLoadFile) {
       request.responseType = 'blob'
@@ -28,7 +28,7 @@ service.interceptors.request.use(
         lock: true,
         text: '数据载入中',
         // spinner: 'el-icon-ElLoading',
-        background: 'rgba(0, 0, 0, 0.1)'
+        background: 'rgba(0, 0, 0, 0.1)',
       })
     }
     /*
@@ -67,7 +67,7 @@ service.interceptors.response.use(
         ElMessageBox.confirm('请重新登录', {
           confirmButtonText: '重新登录',
           cancelButtonText: '取消',
-          type: 'warning'
+          type: 'warning',
         }).then(() => {
           const userStore = useUserStore()
           userStore.resetState().then(() => {
@@ -79,7 +79,7 @@ service.interceptors.response.use(
         ElMessage({
           message: msg,
           type: 'error',
-          duration: 2 * 1000
+          duration: 2 * 1000,
         })
       }
       //返回错误信息
@@ -94,14 +94,14 @@ service.interceptors.response.use(
     ElMessage({
       message: err,
       type: 'error',
-      duration: 2 * 1000
+      duration: 2 * 1000,
     })
     //如果是跨域
     //Network Error,cross origin
     const errObj: ObjTy = {
       msg: err.toString(),
       reqUrl: reqConfig.baseURL + reqConfig.url,
-      params: reqConfig.isParams ? reqConfig.params : reqConfig.data
+      params: reqConfig.isParams ? reqConfig.params : reqConfig.data,
     }
     return Promise.reject(JSON.stringify(errObj))
   }
@@ -118,7 +118,7 @@ export function axiosReq({
   isDownLoadFile,
   baseURL,
   timeout,
-  isAlertErrorMsg = true
+  isAlertErrorMsg = true,
 }: AxiosConfigTy): any {
   return service({
     url: url,
@@ -130,8 +130,9 @@ export function axiosReq({
     isUploadFile: isUploadFile ?? false,
     isDownLoadFile: isDownLoadFile ?? false,
     isAlertErrorMsg: isAlertErrorMsg,
-    baseURL: baseURL ?? import.meta.env.VITE_APP_BASE_URL,
-    timeout: timeout ?? 15000
+    // baseURL: baseURL ?? import.meta.env.VITE_APP_BASE_URL,
+    baseURL: baseURL ?? PLATFROM_CONFIG.baseNewUrl,
+    timeout: timeout ?? 15000,
   })
 }
 

src/utils/mockAxiosReq.ts

@@ -1,20 +1,44 @@
 import axios from 'axios'
+import { getToken, getUserId, getCodeToken } from '@/utils/auth'
 import { ElMessage } from 'element-plus'
-import { AxiosReqTy } from '~/common'
-
+let isMttoken
 // create an axios instance
 const service = axios.create({
-  baseURL: '', // url = base url + request url
+  //baseURL: baseURL, // url = base url + request url
+  // baseURL: 'http://106.14.243.117:9112',
+  //baseURL: 'http://106.14.243.117:9111',
+  baseURL: `${PLATFROM_CONFIG.baseNewUrl}`,
   // withCredentials: true, // send cookies when cross-domain requests
-  timeout: 8000 // request timeout
+  timeout: 30000, // request timeout
+  headers: {
+    'Content-Type': 'application/json',
+  },
 })
-
 // request interceptor
 service.interceptors.request.use(
-  (config: AxiosReqTy) => {
+  (config) => {
+    // config.headers.common["content-type"] = "application/json"
+    if (config.istoken) {
+      config.headers['appSecret'] = PLATFROM_CONFIG.appKeyString
+      isMttoken = config.istoken
+    }
+    if (config.data) {
+      config.data['OperatorId'] = getUserId()
+      config.data['token'] = getCodeToken()
+    }
+    // do something before request is sent
+    // config.headers['Content-Type'] = 'text/plain'
+    if (getCodeToken() && !config.istoken) {
+      config.headers['Authorization'] = getCodeToken()
+    }
+    // if (store.getters.token) {
+    //   config.headers['Authorization'] = getToken()
+    // }
     return config
   },
   (error) => {
+    // do something with request error
+
     return Promise.reject(error)
   }
 )
@@ -35,24 +59,38 @@ service.interceptors.response.use(
     const res = response.data
 
     // if the custom code is not 20000, it is judged as an error.
-    if (res.code !== 20000) {
+    if (res.code != 0) {
       ElMessage({
-        message: res.ElMessage || 'Error',
+        message: res.message || 'Error',
         type: 'error',
-        duration: 5 * 1000
+        duration: 5 * 1000,
       })
-      return Promise.reject(new Error(res.ElMessage || 'Error'))
+
+      // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired;
+      if (!isMttoken) {
+        if (res.code == 500) {
+          // to re-login
+          ElMessage({
+            message: '身份令牌过期或失效，即将重新登录',
+            type: 'error',
+            duration: 5 * 1000,
+            onClose: () => {
+              // store.dispatch('user/resetToken').then(() => {
+              //   location.reload()
+              // })
+            },
+          })
+        }
+      }
+      return Promise.reject(new Error(res.message || 'Error'))
     } else {
       return res
     }
   },
   (error) => {
-    console.log('err' + error) // for debug
-    ElMessage({
-      message: error.ElMessage,
-      type: 'error',
-      duration: 5 * 1000
-    })
+    if (isMttoken) {
+      // store.dispatch('user/setIsLogin', true)
+    }
     return Promise.reject(error)
   }
 )

src/views/login/Login.vue

@@ -16,114 +16,171 @@
         <el-input size="large" show-password ref="refPassword" v-model="formInline.password" type="password" name="password" placeholder="密码" />
       </el-form-item>
       <div class="rowSS">
-        <el-form-item prop="identifyCode" :rules="formRules.isNotNull">
-          <el-input size="large" @keyup.enter="handleLogin" v-model="formInline.identifyCode" placeholder="请输入验证码" />
+        <el-form-item prop="verificationCode" :rules="formRules.isNotNull">
+          <el-input size="large" @keyup.enter="handleLogin" v-model="formInline.verificationCode" placeholder="请输入验证码" />
         </el-form-item>
-        <Identify style="margin-left:18px" />
+        <Identify :identifyCode="identifyCode" @changeCode="changeCode" style="margin-left:18px" />
       </div>
       <div class="tip-message">{{ tipMessage }}</div>
       <el-button :loading="loading" type="primary" class="login-btn" size="large" @click.prevent="handleLogin">
-        Login
+        登录
       </el-button>
     </el-form>
   </div>
 </template>
 
 <script setup lang="ts">
-import { ref, reactive } from 'vue'
-import settings from '@/settings'
-import Identify from './identify.vue'
-import { ElMessage } from 'element-plus'
-import { ObjTy } from '~/common'
-import { useUserStore } from '@/store/user'
+import { ref, reactive, onBeforeMount } from "vue";
+import { GetCheckCode, gettoken, GetSystemSet } from "@/api/newLogin";
+import { setCodeToken, getCodeToken } from "@/utils/auth";
+import Identify from "./identify.vue";
+import { ElMessage } from "element-plus";
+import { ObjTy } from "~/common";
+import { useUserStore } from "@/store/user";
+import MD5 from "blueimp-md5";
 //element valid
-const formRules = useElement().formRules
+const formRules = useElement().formRules;
 //form
 let formInline = reactive({
-  username: 'admin',
-  password: '123456',
-  identifyCode: '1234'
-})
+  username: "",
+  password: "",
+  verificationCode: "",
+});
+const identifyCode = ref("");
 let state: ObjTy = reactive({
   otherQuery: {},
-  redirect: undefined
-})
-const title = ref('系统名称')
-const imgUrl = ref('https://cube.elemecdn.com/')
+  redirect: undefined,
+});
+const title = ref("系统名称");
+const imgUrl = ref("https://cube.elemecdn.com/");
 /* listen router change  */
-const route = useRoute()
+const route = useRoute();
 let getOtherQuery = (query: any) => {
   return Object.keys(query).reduce((acc: any, cur: any) => {
-    if (cur !== 'redirect') {
-      acc[cur] = query[cur]
+    if (cur !== "redirect") {
+      acc[cur] = query[cur];
     }
-    return acc
-  }, {})
-}
-const errorHandler = () => true
+    return acc;
+  }, {});
+};
+const errorHandler = () => true;
 watch(
   () => route.query,
   (query) => {
     if (query) {
-      state.redirect = query.redirect
-      state.otherQuery = getOtherQuery(query)
+      state.redirect = query.redirect;
+      state.otherQuery = getOtherQuery(query);
     }
   },
   { immediate: true }
-)
+);
+
+//获取token
+onBeforeMount(() => {
+  getToken();
+});
+
+const getToken = async () => {
+  const res = await gettoken({
+    appid: PLATFROM_CONFIG.appId,
+    appSecret: PLATFROM_CONFIG.appKeyString,
+  });
+  if (res.code == 0 && res.data) {
+    setCodeToken(res.data.appToken);
+    getCheckCode();
+    //getSystemSet();
+  } else {
+    ElMessage.error(res.message);
+  }
+};
+
+//获取动态验证码
+const getCheckCode = async () => {
+  const { code, message, data } = await GetCheckCode({
+    appToken: getCodeToken(),
+  });
+  if (code == 0) {
+    identifyCode.value = data;
+  } else {
+    ElMessage.error(message);
+  }
+};
 
+//切换验证码
+const changeCode = () => {
+  getCheckCode();
+};
+
+//获取系统设置
+const getSystemSet = async () => {
+  const { code, message } = await GetSystemSet({});
+  if (code == 0) {
+    ElMessage.success(message);
+  } else {
+    ElMessage.error(message);
+  }
+};
 /*
  *  login relative
  * */
-let loading = ref(false)
-let tipMessage = ref('')
+let loading = ref(false);
+let tipMessage = ref("");
 
-const refloginForm: any = ref(null)
+const refloginForm: any = ref(null);
 let handleLogin = () => {
   refloginForm.value.validate((valid: any) => {
     if (valid) {
-      loginReq()
+      loginReq();
     } else {
-      return false
+      return false;
     }
-  })
-}
+  });
+};
 
 //use the auto import from vite.config.js of AutoImport
-const router = useRouter()
+const router = useRouter();
 let loginReq = () => {
-  loading.value = true
-  const userStore = useUserStore()
+  loading.value = true;
+  const params = {
+    username: formInline.username.replace(/\s+/g, ""),
+    password: MD5(formInline.password.replace(/\s+/g, "")),
+    // password: this.loginForm.password.replace(/\s+/g, ""),
+    verificationCode: formInline.verificationCode.replace(/\s+/g, ""),
+  };
+  const userStore = useUserStore();
   userStore
-    .login(formInline)
+    .login(params)
     .then(() => {
-      ElMessage({ message: '登录成功', type: 'success' })
-      router.push({ path: state.redirect || '/', query: state.otherQuery })
+      ElMessage({ message: "登录成功", type: "success" });
+      sessionStorage.setItem("userName", params.username);
+      router.push({ path: state.redirect || "/", query: state.otherQuery });
     })
     .catch((res) => {
-      tipMessage.value = res.msg
+      console.log(res);
+      tipMessage.value = res.msg;
       useCommon()
         .sleep(30)
         .then(() => {
-          loading.value = false
-        })
-    })
-}
+          getCheckCode();
+          loading.value = false;
+        });
+    });
+};
 /*
  *  password show or hidden
  * */
-let passwordType = ref('password')
-const refPassword: any = ref(null)
+let passwordType = ref("password");
+const refPassword: any = ref(null);
 let showPwd = () => {
-  if (passwordType.value === 'password') {
-    passwordType.value = ''
+  if (passwordType.value === "password") {
+    passwordType.value = "";
   } else {
-    passwordType.value = 'password'
+    passwordType.value = "password";
   }
   nextTick(() => {
-    refPassword.value.focus()
-  })
-}
+    refPassword.value.focus();
+  });
+};
 </script>
 
 <style lang="scss" scoped>
@@ -133,7 +190,7 @@ $light_gray: #eee;
 .login-container {
   height: 100vh;
   width: 100%;
-  background-image: url('../../assets/login/bg.jpg');
+  background-image: url("../../assets/login/bg.jpg");
   background-repeat: no-repeat;
   background-size: 100% 100%;
   .login-form {

src/views/login/identify.vue

@@ -113,9 +113,9 @@ export default {
       this.drawPic()
     }
   },
-  mounted () {
-    this.drawPic()
-  }
+  // mounted () {
+  //   this.drawPic()
+  // }
 }
 </script>