import * as React from 'react';
import { Redirect } from 'react-router-dom';
import ReactLoading from 'react-loading';
const { lazy } = React;
import storage from '../utils/storage';

const tempLogin = lazy(() => import('../pages/tempLogin'));
// 管理中心
const adminSetUp = lazy(() => import('../pages/setup'));

const adminLayout = lazy(() => import('../layout/adminLayout'));
const adminVideoChanle = lazy(() => import('../pages/device-chanles'));
const projectInfo = lazy(() => import('../pages/projectInfo'));
const projectSeeUint = lazy(() => import('../pages/projects/pageSeeUnit'));
const projectManger = lazy(() => import('../pages/projects/pageMangerPerson'));
const projectPlan = lazy(() => import('../pages/projectPlan'));

const projectRender = lazy(() => import('../pages/admin-renderings'));

const dust = lazy(() => import('../pages/dust'));

const videoDevice = lazy(() => import('../pages/device-video'));

const accessController = lazy(
	() => import('../pages/devices/accessController')
);

const warnRules = lazy(() => import('../pages/admin-warn/config'));

const warnConcat = lazy(() => import('../pages/admin-warn/concat'));

const warns = lazy(() => import('../pages/admin-warn/index'));
const taskDetail = lazy(() => import('../pages/task-detail'));

const adminProcess = lazy(() => import('../pages/admin-process'));

const adminPerson = lazy(() => import('../pages/admin-person'));

const adminAttendance = lazy(() => import('../pages/admin-attendance'));

const adminTaskSafe = lazy(() => import('../pages/task-safe'));
const adminTaskQuality = lazy(() => import('../pages/task-quality'));
// 前台展示

const login = React.lazy(() => import('../pages/login'));
const Layout = React.lazy(
	() => import(/* webpackPreload: true */ '../layout/layout')
);
const index = React.lazy(() => import('../pages/index'));
const video = React.lazy(() => import('../pages/videos'));
const person = React.lazy(() => import('../pages/person'));
const Environmental = React.lazy(() => import('../pages/environmental'));
const carMangement = React.lazy(() => import('../pages/car-mangement'));
const hard = React.lazy(() => import('../pages/hard'));
const wrapperLoading = (Component) => (props) => {
	return (
		<React.Suspense
			fallback={
				<ReactLoading type='balls' color='#00a0ff' className='page-loading' />
			}>
			<Component {...props}></Component>
		</React.Suspense>
	);
};
const AuthHasLogin = ({ Component }) => {
	const { value, sucess } = storage.getItme('token');
	if (sucess) {
		return Component;
	}
	return <Redirect to='/'></Redirect>;
};

export const routerConfig = [
	{
		path: '/login',
		component: wrapperLoading(login),
		exact: true,
	},
	{
		path: '/tempLogin',
		component: wrapperLoading(tempLogin),
		exact: true,
	},
	{
		path: '/admin',
		admin: true,
		component: wrapperLoading(adminLayout),
		routes: [
			{
				path: '/admin',
				exact: true,
				component: () => <Redirect to='/admin/project/info'></Redirect>,
			},

			{
				path: '/admin/setup',
				exact: true,
				component: wrapperLoading(adminSetUp),
			},
			{
				path: '/admin/project/info',
				exact: true,
				component: wrapperLoading(projectInfo),
			},
			{
				path: '/admin/project/seeUnit',
				exact: true,
				component: wrapperLoading(projectSeeUint),
			},
			{
				path: '/admin/project/manger',
				exact: true,
				component: wrapperLoading(projectManger),
			},
			{
				path: '/admin/project/plan',
				exact: true,
				component: wrapperLoading(projectPlan),
			},
			{
				path: '/admin/project/renderings',
				exact: true,
				component: wrapperLoading(projectRender),
			},
			{
				path: '/admin/device/dust',
				exact: true,
				component: wrapperLoading(dust),
			},
			{
				path: '/admin/device/accessController',
				exact: true,
				component: wrapperLoading(accessController),
			},
			{
				path: '/admin/device/videos',
				exact: true,
				component: wrapperLoading(videoDevice),
			},
			{
				path: '/admin/device/chanle/:id',
				exact: true,
				component: wrapperLoading(adminVideoChanle),
			},
			{
				path: '/admin/warning/rules',
				exact: true,
				component: wrapperLoading(warnRules),
			},
			{
				path: '/admin/warning/concat',
				exact: true,
				component: wrapperLoading(warnConcat),
			},
			{
				path: '/admin/warns',
				exact: true,
				component: wrapperLoading(warns),
			},
			{
				path: '/admin/task/:id',
				exact: true,
				component: wrapperLoading(taskDetail),
			},
			{
				path: '/admin/process',
				exact: true,
				component: wrapperLoading(adminProcess),
			},
			{
				path: '/admin/person/persons',
				exact: true,
				component: wrapperLoading(adminPerson),
			},
			{
				path: '/admin/person/attendance',
				exact: true,
				component: wrapperLoading(adminAttendance),
			},
			{
				path: '/admin/tasks/safe',
				exact: true,
				component: wrapperLoading(adminTaskSafe),
			},
			{
				path: '/admin/tasks/quality',
				exact: true,
				component: wrapperLoading(adminTaskQuality),
			},
		],
	},
	{
		path: '/',
		component: wrapperLoading(Layout),
		routes: [
			{
				title: '首页',
				path: '/',
				exact: true,
				component: wrapperLoading(index),
			},
			{
				title: '视频监控',
				path: '/video',
				component: wrapperLoading(video),
			},

			{
				title: '绿色施工',
				path: '/environmental',
				component: wrapperLoading(Environmental),
			},
			{
				title: '人员管理',
				path: '/person',
				component: wrapperLoading(person),
			},
			// {
			// 	title: '车辆管理',
			// 	path: '/cars',
			// 	component: wrapperLoading(carMangement),
			// },
			{
				title: '智能硬件',
				path: '/hard',
				component: wrapperLoading(hard),
			},
		],
	},
];
