优化：退出登录逻辑优化

env/.env.development

@@ -6,7 +6,7 @@ VITE_DELETE_CONSOLE = false
 VITE_SHOW_SOURCEMAP = false
 
 # 后台请求地址
-VITE_SERVER_BASEURL = 'http://192.168.1.28:8080/jeecg-boot'
+VITE_SERVER_BASEURL = 'http://192.168.1.28:8082/jeecg-boot'
 # VITE_SERVER_BASEURL = 'http://192.168.1.232:8082/jeecg-boot'
 # VITE_SERVER_BASEURL = 'https://life.baoxianzhanggui.com/locallive-pro-java'
 

src/http/alova.ts

@@ -104,10 +104,19 @@ const alovaInstance = createAlova({
             if (statusCode !== 200) {
                 // 直接处理401错误，跳转到登录页面
                 if (statusCode === 401) {
-                    uni.showToast({
-                        title: '登录已过期，请重新登录',
-                        icon: 'error',
-                        duration: 1500,
+                    uni.showModal({
+                        title: '提示',
+                        content: '登录已过期，请重新登录',
+                        confirmText: '去登录',
+                        cancelText: '回首页',
+                        success: ({ confirm, cancel }) => {
+                            if (confirm) {
+                                toLoginPage({ mode: 'reLaunch' })
+                            }
+                            else if (cancel) {
+                                uni.reLaunch({ url: '/pages/home/home' })
+                            }
+                        }
                     })
                     useTokenStore().cleanToken()
                     setTimeout(() => {

src/pages-A/couponRedemptionList/index.vue

@@ -323,6 +323,7 @@ function datePickerConfirm() {
             flex-wrap: nowrap;
             justify-content: space-around;
             gap: 40rpx;
+            margin-bottom: 20rpx;
 
             .redemption-content-item {
                 display: flex;

src/pages/home/home.vue

@@ -57,8 +57,9 @@ const { send: getCouponSituationRequest, data: couponSituationData } = useReques
 
 onShow((options) => {
     couponStore.getCouponListByType()
+    console.log(hasLogin.value)
     // 登录后查询收益数据
-    if (hasLogin) {
+    if (hasLogin.value) {
         Promise.allSettled([getAccountCountRequest(), getCouponSituationRequest()])
         // getAccountCountRequest()
         // getCouponSituationRequest()

src/pages/my/my.vue

@@ -72,23 +72,27 @@ function handleLogout() {
     uni.showModal({
         title: '提示',
         content: '确定要退出登录吗？',
-        success: (res) => {
+        success: async (res) => {
             if (res.confirm) {
                 // 清空用户信息
-                useTokenStore().logout()
+                await useTokenStore().logout()
                 // 执行退出登录逻辑
                 uni.showToast({
                     title: '退出登录成功',
                     icon: 'success',
+                    mask: true,
+                    duration: 2000,
+                    complete: () => {
+                        // #ifdef MP-WEIXIN
+                        // 微信小程序，去首页
+                        uni.reLaunch({ url: '/pages/home/home' })
+                        // #endif
+                        // #ifndef MP-WEIXIN
+                        // 非微信小程序，去登录页
+                        // uni.navigateTo({ url: LOGIN_PAGE })
+                        // #endif
+                    }
                 })
-                // #ifdef MP-WEIXIN
-                // 微信小程序，去首页
-                uni.reLaunch({ url: '/pages/home/home' })
-                // #endif
-                // #ifndef MP-WEIXIN
-                // 非微信小程序，去登录页
-                // uni.navigateTo({ url: LOGIN_PAGE })
-                // #endif
             }
         },
     })

src/router/config.ts

@@ -11,6 +11,7 @@ export const isNeedLoginMode = LOGIN_STRATEGY === LOGIN_STRATEGY_MAP.DEFAULT_NEE
 export const LOGIN_PAGE = '/pages-fg/login/login'
 export const REGISTER_PAGE = '/pages-fg/login/register'
 export const NOT_FOUND_PAGE = '/pages-fg/404/index'
+export const HOME_PAGE = '/pages/home/home'
 
 export const LOGIN_PAGE_LIST = [LOGIN_PAGE, REGISTER_PAGE]
 
@@ -21,8 +22,7 @@ export const excludeLoginPathList = getAllPages('excludeLoginPath').map(page =>
 // TODO: 2/3 在 definePage 配置 excludeLoginPath，或者在下面配置 EXCLUDE_LOGIN_PATH_LIST
 export const EXCLUDE_LOGIN_PATH_LIST = [
     LOGIN_PAGE,
-    '/pages/xxx/index', // 示例值
-    '/pages-sub/xxx/index', // 示例值
+    HOME_PAGE,
     '/pages/receiveCoupon/index',
     ...excludeLoginPathList, // 都是以 / 开头的 path
 ]

src/store/token.ts

@@ -61,8 +61,8 @@ export const useTokenStore = defineStore(
         }
 
         /**
-                                                                                                                                             * 判断token是否过期
-                                                                                                                                             */
+                                                                                                                                                     * 判断token是否过期
+                                                                                                                                                     */
         const isTokenExpired = computed(() => {
             if (!tokenInfo.value) {
                 return true
@@ -77,8 +77,8 @@ export const useTokenStore = defineStore(
         })
 
         /**
-                                                                                                                                             * 判断refreshToken是否过期
-                                                                                                                                             */
+                                                                                                                                                     * 判断refreshToken是否过期
+                                                                                                                                                     */
         const isRefreshTokenExpired = computed(() => {
             if (!isDoubleTokenMode)
                 return true
@@ -92,9 +92,9 @@ export const useTokenStore = defineStore(
         })
 
         /**
-                                                                                                                                             * 登录成功后处理逻辑
-                                                                                                                                             * @param tokenInfo 登录返回的token信息
-                                                                                                                                             */
+                                                                                                                                                     * 登录成功后处理逻辑
+                                                                                                                                                     * @param tokenInfo 登录返回的token信息
+                                                                                                                                                     */
         async function _postLogin(tokenInfo: IAuthLoginRes) {
             setTokenInfo(tokenInfo)
             // const userStore = useUserStore()
@@ -102,12 +102,12 @@ export const useTokenStore = defineStore(
         }
 
         /**
-                                                                                                                                             * 用户登录
-                                                                                                                                             * 有的时候后端会用一个接口返回token和用户信息，有的时候会分开2个接口，一个获取token，一个获取用户信息
-                                                                                                                                             * （各有利弊，看业务场景和系统复杂度），这里使用2个接口返回的来模拟
-                                                                                                                                             * @param loginForm 登录参数
-                                                                                                                                             * @returns 登录结果
-                                                                                                                                             */
+                                                                                                                                                     * 用户登录
+                                                                                                                                                     * 有的时候后端会用一个接口返回token和用户信息，有的时候会分开2个接口，一个获取token，一个获取用户信息
+                                                                                                                                                     * （各有利弊，看业务场景和系统复杂度），这里使用2个接口返回的来模拟
+                                                                                                                                                     * @param loginForm 登录参数
+                                                                                                                                                     * @returns 登录结果
+                                                                                                                                                     */
         const login = async (loginForm: ILoginForm) => {
             try {
                 const res = await _login(loginForm)
@@ -130,11 +130,11 @@ export const useTokenStore = defineStore(
         }
 
         /**
-                                                                                                                                             * 微信登录
-                                                                                                                                             * 有的时候后端会用一个接口返回token和用户信息，有的时候会分开2个接口，一个获取token，一个获取用户信息
-                                                                                                                                             * （各有利弊，看业务场景和系统复杂度），这里使用2个接口返回的来模拟
-                                                                                                                                             * @returns 登录结果
-                                                                                                                                             */
+                                                                                                                                                     * 微信登录
+                                                                                                                                                     * 有的时候后端会用一个接口返回token和用户信息，有的时候会分开2个接口，一个获取token，一个获取用户信息
+                                                                                                                                                     * （各有利弊，看业务场景和系统复杂度），这里使用2个接口返回的来模拟
+                                                                                                                                                     * @returns 登录结果
+                                                                                                                                                     */
         const wxLogin = async () => {
             try {
                 // 获取用户信息
@@ -178,8 +178,8 @@ export const useTokenStore = defineStore(
         }
 
         /**
-                                                                                                                                             * 退出登录 并 删除用户信息
-                                                                                                                                             */
+                                                                                                                                                     * 退出登录 并 删除用户信息
+                                                                                                                                                     */
         const logout = async () => {
             try {
                 // TODO 实现自己的退出登录逻辑
@@ -210,9 +210,9 @@ export const useTokenStore = defineStore(
         }
 
         /**
-                                                                                                                                             * 刷新token
-                                                                                                                                             * @returns 刷新结果
-                                                                                                                                             */
+                                                                                                                                                     * 刷新token
+                                                                                                                                                     * @returns 刷新结果
+                                                                                                                                                     */
         const refreshToken = async () => {
             if (!isDoubleTokenMode) {
                 console.error('单token模式不支持刷新token')
@@ -238,10 +238,10 @@ export const useTokenStore = defineStore(
         }
 
         /**
-                                                                                                                                             * 获取有效的token
-                                                                                                                                             * 注意：在computed中不直接调用异步函数，只做状态判断
-                                                                                                                                             * 实际的刷新操作应由调用方处理
-                                                                                                                                             */
+                                                                                                                                                     * 获取有效的token
+                                                                                                                                                     * 注意：在computed中不直接调用异步函数，只做状态判断
+                                                                                                                                                     * 实际的刷新操作应由调用方处理
+                                                                                                                                                     */
         const getValidToken = computed(() => {
             // token已过期，返回空
             if (isTokenExpired.value) {
@@ -257,8 +257,8 @@ export const useTokenStore = defineStore(
         })
 
         /**
-                                                                                                                                             * 检查是否有登录信息（不考虑token是否过期）
-                                                                                                                                             */
+                                                                                                                                                     * 检查是否有登录信息（不考虑token是否过期）
+                                                                                                                                                     */
         const hasLoginInfo = computed(() => {
             if (!tokenInfo.value) {
                 return false
@@ -272,17 +272,17 @@ export const useTokenStore = defineStore(
         })
 
         /**
-                                                                                             * 检查是否已登录且token有效
-                                                                                             */
+                                                                                                     * 检查是否已登录且token有效
+                                                                                                     */
         const hasValidLogin = computed(() => {
             console.log('hasValidLogin', hasLoginInfo.value && !isTokenExpired.value, hasLoginInfo.value, !isTokenExpired.value)
             return hasLoginInfo.value && !isTokenExpired.value
         })
 
         /**
-                                                                                         * 尝试获取有效的token，如果过期且可刷新，则刷新token
-                                                                                         * @returns 有效的token或空字符串
-                                                                                         */
+                                                                                                 * 尝试获取有效的token，如果过期且可刷新，则刷新token
+                                                                                                 * @returns 有效的token或空字符串
+                                                                                                 */
         const tryGetValidToken = async (): Promise<string> => {
             if (!getValidToken.value && isDoubleTokenMode && !isRefreshTokenExpired.value) {
                 try {