优化token存储和app登录

src/api/modules/data-fill/wbs.js

@@ -299,4 +299,12 @@ export default {
             params: form,
         }, msg)
     },
+    //获取表单详情
+    async getWbsContractById(form, msg = true) {
+        return httpApi({
+            url: '/api/blade-manager/wbsTreeContract/getWbsContractById',
+            method: 'get',
+            params: form,
+        }, msg)
+    },
 }

src/api/request/index.js

@@ -3,7 +3,8 @@ import { Base64 } from 'js-base64'
 import website from '~src/config'
 import router from '~src/router/index'
 import { getToken } from '~src/api/util/auth'
-import { getObjValue, toSerialize } from 'js-fast-way'
+import { toSerialize } from 'js-fast-way'
+import { getStoreValue } from '~src/utils/storage'
 
 //默认超时时间
 axios.defaults.timeout = 0
@@ -46,8 +47,13 @@ axios.interceptors.response.use(res => {
     const status = res?.data?.code || res.status
     //如果是401则跳转到登录页面
     if (status === 401) {
-        window.$message?.error('身份失效,请重新登录！')
-        router.push({ path: '/login' })
+        const isSource = getStoreValue('isSource')
+        if (!isSource) {
+            window.$message?.error('身份失效,请重新登录！')
+            router.push({ path: '/login' }).then()
+        } else {
+            router.push({ name: 'app-auth' }).then()
+        }
     }
     // 如果请求为非200, 自行catch逻辑处理
     if (status !== 200) {

src/api/util/auth.js

@@ -1,26 +1,40 @@
-import Cookies from 'js-cookie'
-import config from '~src/config/index'
+import website from '~src/config/index'
+import { calcDate, delStoreData, getStoreData, setStoreData } from 'js-fast-way'
 
 export const getToken = () => {
-    return Cookies.get(config.tokenKey)
+    getTokenTime(website.tokenKey)
+    return getStoreData(website.tokenKey)
 }
 
 export const setToken = (token) => {
-    return Cookies.set(config['tokenKey'], token)
+    setStoreData(website.tokenKey, token)
 }
 
 export const getRefreshToken = () => {
-    return Cookies.get(config['refreshTokenKey'])
+    getTokenTime(website.refreshTokenKey)
+    return getStoreData(website.refreshTokenKey)
 }
 
 export const setRefreshToken = (token) => {
-    return Cookies.set(config['refreshTokenKey'], token)
+    setStoreData(website.refreshTokenKey, token)
 }
 
 export const removeToken = () => {
-    return Cookies.remove(config['tokenKey'])
+    delStoreData(website.tokenKey)
 }
 
 export const removeRefreshToken = () => {
-    return Cookies.remove(config['refreshTokenKey'])
+    delStoreData(website.refreshTokenKey)
+}
+
+//计算token是否过期
+const getTokenTime = (tokenKey) => {
+    const token = getStoreData(tokenKey, true)
+    if (token) {
+        const date = calcDate(token.datetime, new Date().getTime())
+        if (date.seconds > 2000) {
+            removeToken()
+            removeRefreshToken()
+        }
+    }
 }

src/router/modules/base.js

@@ -411,6 +411,12 @@ export default [
             },
         ],
     },
+    {
+        path: '/uni-app/table-form',
+        name: 'app-table-form',
+        meta: { title: 'app表单' },
+        component: () => import('~src/views/uni-app/table-form.vue'),
+    },
     {
         path: '/403',
         name: '403',

src/router/modules/token.js

@@ -11,4 +11,7 @@ export default [
     'user-index',
     'test-index',
     'tentative-detect-test-form',
+
+    //uni-app
+    'app-table-form',
 ]

src/store/index.js

@@ -40,6 +40,7 @@ export const useAppStore = defineStore('main', {
         dragModalSortTop: [], //拖拽弹窗排序
         isScreenShort: false,
         barMenuName: '',
+        isSource: getStoreValue('isSource') || '', //来源
     }),
     getters: {
         //系统信息
@@ -73,6 +74,7 @@ export const useAppStore = defineStore('main', {
         getFullScreen: state => state.fullScreen,
         getCollapse: state => state.isCollapse,
         getDragModalSortTop: state => state.dragModalSortTop,
+        getIsSource: state => state.isSource,
     },
     actions: {
         //系统信息
@@ -184,6 +186,10 @@ export const useAppStore = defineStore('main', {
         setDragModalSortTop(value) {
             this.dragModalSortTop = value
         },
+        setIsSource(value) {
+            this.isSource = value
+            setStoreValue('isSource', value)
+        },
         //清除缓存和token
         clearStoreData() {
             //清除状态
@@ -206,6 +212,7 @@ export const useAppStore = defineStore('main', {
             this.fullScreen = null
             this.isCollapse = false
             this.dragModalSortTop = []
+            this.isSource = ''
             //清除缓存
             clearStoreAll()
             removeToken()

src/store/modules/user.js

@@ -26,9 +26,9 @@ export const useAppLogin = async (form) => {
             return Promise.reject({ msg: '路由异常' })
         }
         await initUserConfigInfo()
-        return Promise.resolve(res)
+        return Promise.resolve({ error, status, res })
     } else {
-        return Promise.reject(res)
+        return Promise.reject({ error, status, res })
     }
 }
 

src/styles/error/app-auth.scss

@@ -1,3 +1,8 @@
+.hc-body-loading {
+    position: relative;
+    height: 100%;
+    width: 100%;
+}
 .error-page {
     background: #f0f2f5;
     height: 100vh;
@@ -38,3 +43,32 @@ html.theme-dark {
         }
     }
 }
+
+@media screen and (max-width: 600px) {
+    .hc-body-loading {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+    }
+    .error-page {
+        height: auto;
+        display: block;
+        background: transparent;
+        .img {
+            height: 220px;
+        }
+        .content {
+            position: relative;
+            text-align: center;
+            h1 {
+                font-size: 40px;
+            }
+            .desc {
+                font-size: 17px;
+            }
+            .actions {
+                margin-top: 10px;
+            }
+        }
+    }
+}

src/views/login/auth.vue

@@ -3,14 +3,9 @@
         <div v-if="isErrorShow" class="error-page">
             <div class="img" :style="`background-image: url(${svg403});`" />
             <div class="content">
-                <h1>403</h1>
+                <h1>401</h1>
                 <div class="desc">
-                    抱歉，token授权登录异常，请重新进入
-                </div>
-                <div class="actions">
-                    <el-button type="primary" block size="large" @click="toLoginTap">
-                        手动登录
-                    </el-button>
+                    抱歉，身份验证异常，请重新进入
                 </div>
             </div>
         </div>
@@ -21,9 +16,9 @@
 import { onMounted, ref } from 'vue'
 import { useAppStore } from '~src/store'
 import { useAppLogin } from '~sto/user'
-import userApi from '~api/userInfo'
 import { useRoute, useRouter } from 'vue-router'
 import svg403 from '~src/assets/view/403.svg'
+import { isNullES } from 'js-fast-way'
 
 //初始变量
 const router = useRouter()
@@ -36,61 +31,39 @@ const isErrorShow = ref(false)
 
 //渲染完成
 onMounted(() => {
-    // 域名后加  /#/auth?token=xxxxxxx
-    const { token } = useRoutes.query
-    console.log(token)
-    if (token) {
-        useAppState.setTokenVal(token)
-        queryCurrentUserData()
+    const { user, source } = useRoutes.query
+    if (!isNullES(user)) {
+        const userInfo = JSON.parse(decodeURIComponent(user))
+        useAppState.setIsSource(source)
+        useAppLoginApi(userInfo)
     } else {
         loading.value = false
         isErrorShow.value = true
     }
 })
 
-//获取用户信息
-const queryCurrentUserData = async () => {
-    const { error, code, data } = await userApi.queryCurrentUserData()
-    if (!error && code === 200) {
-        await useAppLoginApi({
-            tenantId: '000000',
-            username: data.account,
-            password: data.plaintextPassword,
-            type: 'account',
-        })
-    } else {
-        window.$message?.error('授权信息异常')
-        isErrorShow.value = true
-        loading.value = false
-    }
-}
-
 //请求授权登录
 const useAppLoginApi = async (form) => {
     loading.value = true
-    useAppLogin(form).then(() => {
+    const { error, status } = await useAppLogin(form)
+    if (!error && status === 200) {
+        const { url, node } = useRoutes.query
+        if (!isNullES(url)) {
+            router.push({
+                name: url,
+                query: node ? JSON.parse(decodeURIComponent(node)) : {},
+            }).then()
+        }
         loading.value = false
         isErrorShow.value = false
-        window?.$message?.success('授权登录成功')
-        //router.push({ path: '/using/stats' })//跳转到档案统计页面
-    }).catch(() => {
-        window.$message?.error('授权登录失败')
+    } else {
+        window.$message?.error('身份验证异常')
         isErrorShow.value = true
         loading.value = false
-    })
-}
-
-//跳转登陆
-const toLoginTap = () => {
-    //router.push({ path: '/login' })
+    }
 }
 </script>
 
 <style lang="scss" scoped>
 @import "../../styles/error/app-auth.scss";
-.hc-body-loading {
-    position: relative;
-    height: 100%;
-    width: 100%;
-}
 </style>

src/views/uni-app/table-form.vue

@@ -0,0 +1,29 @@
+<template>
+    <div>
+        表单
+    </div>
+</template>
+
+<script setup>
+import { onMounted, ref } from 'vue'
+import { useRoute } from 'vue-router'
+import wbsApi from '~api/data-fill/wbs'
+import { getObjValue } from 'js-fast-way'
+
+const useRoutes = useRoute()
+const appItem = useRoutes.query
+
+//渲染完成
+onMounted(() => {
+    console.log(appItem)
+    getWbsContractById()
+})
+
+//获取详情
+const getWbsContractById = async () => {
+    const { data } = await wbsApi.getWbsContractById({
+        pkeyId: appItem.pkeyId,
+    })
+    console.log(getObjValue(data))
+}
+</script>