import { createWebHashHistory, RouteRecordRaw } from 'vue-router'
import { clearPending } from '@/services/http/pending'
import { useLoginStore } from '@/stores'
import service from '@/services'
import Page from '@mobile/components/layouts/page/index.vue'
import animateRouter from './animateRouter'

const loginStore = useLoginStore()

const routes: Array<RouteRecordRaw> = [
  {
    path: '/:pathMatch(.*)*',
    name: 'error',
    component: () => import('../views/error/404.vue')
  },
  {
    path: '/boot',
    name: 'Boot',
    component: () => import('../views/boot/index.vue')
  },
  {
    path: '/',
    component: Page,
    children: [
      {
        path: '',
        name: 'Home',
        component: () => import('../views/home/index.vue'),
        children: [
          {
            path: '',
            name: 'HomeIndex',
            component: () => import('../views/home/main/index.vue')
          },
          {
            path: 'mall',
            name: 'HomeMall',
            component: () => import('../views/mall/main/index.vue')
          },
          {
            path: 'cart',
            name: 'HomeCart',
            component: () => import('../views/cart/main/index.vue')
          },
          {
            path: 'mine',
            name: 'HomeMine',
            component: () => import('../views/mine/main/index.vue')
          }
        ]
      }
    ]
  },
  {
    path: '/user',
    component: Page,
    children: [
      {
        path: 'login',
        name: 'UserLogin',
        component: () => import('../views/user/login/index.vue')
      },
      {
        path: 'register',
        name: 'UserRegister',
        component: () => import('../views/user/register/index.vue')
      }
    ]
  },
  {
    path: '/cart',
    component: Page,
    children: [
      {
        path: 'list',
        name: 'CartList',
        component: () => import('../views/cart/list/index.vue')
      },
      {
        path: 'detail',
        name: 'CartDetail',
        component: () => import('../views/cart/detail/index.vue')
      }
    ]
  },
  {
    path: '/message',
    component: Page,
    children: [
      {
        path: 'list',
        name: 'Message',
        component: () => import('../views/message/list/index.vue'),
        meta: {
          requireAuth: true
        }
      }
    ]
  },
]

const router = animateRouter.create({
  history: createWebHashHistory(),
  routes,
})

// 路由跳转拦截
router.beforeEach((to, from, next) => {
  clearPending()
  // 判断服务是否加载完成
  if (service.isReady) {
    if (to.meta.requireAuth && !loginStore.token) {
      if (to.matched.some((e) => e.name === 'Home')) {
        // 如果是主页导航页面，强制跳转到首页
        next({
          name: 'HomeIndex',
          replace: true
        })
      } else {
        next({
          name: 'UserLogin',
          query: { redirect: to.fullPath }
        })
      }
    } else {
      next()
    }
  } else {
    if (to.name === 'Boot' || to.name === 'UserLogin') {
      next()
    } else {
      next({
        name: 'Boot',
        query: { redirect: to.fullPath }
      })
    }
  }
})

export default router
