import history from '@/utils/history'
import React from 'react'
import { Route, Router, Switch } from 'react-router-dom'
import SpinLoding from './SpinLoding'
import NotFound from '@/components/NotFound'

const routerArr = [
  {
    id: 1,
    name: '首页',
    path: '/',
    exact: true,
    Com: React.lazy(() => import('@/pages/A1home'))
  },
  {
    id: 2,
    name: '预约须知',
    path: '/notice',
    exact: true,
    Com: React.lazy(() => import('@/pages/A2notice'))
  },
  {
    id: 3,
    name: '选择日期',
    path: '/selectDay',
    exact: true,
    Com: React.lazy(() => import('@/pages/A3selectDay'))
  },
  {
    id: 4,
    name: '选择课程',
    path: '/selectCourse',
    exact: true,
    Com: React.lazy(() => import('@/pages/A4selectCourse'))
  },
  {
    id: 5,
    name: '填写信息',
    path: '/order',
    exact: true,
    Com: React.lazy(() => import('@/pages/A5order'))
  },
  {
    id: 6,
    name: '我的申请',
    path: '/my',
    exact: true,
    Com: React.lazy(() => import('@/pages/A6my'))
  },
  {
    id: 7,
    name: '团体认证选择',
    path: '/team',
    exact: true,
    Com: React.lazy(() => import('@/pages/A7team'))
  },
  {
    id: 8,
    name: '团体认证表单',
    path: '/proof/:id',
    exact: true,
    Com: React.lazy(() => import('@/pages/A8proof'))
  },
  {
    id: 9,
    name: '找不到页面',
    path: '*',
    exact: false,
    Com: NotFound
  }
]

function RouterOrder() {
  return (
    <Router history={history}>
      <React.Suspense fallback={<SpinLoding />}>
        <Switch>
          {routerArr.map(v => (
            <Route key={v.id} path={v.path} exact={v.exact} component={v.Com} />
          ))}
        </Switch>
      </React.Suspense>
    </Router>
  )
}

const MemoRouterOrder = React.memo(RouterOrder)

export default MemoRouterOrder
