import React from 'react';
import { Navigate, RouteObject } from 'react-router-dom';
import ErrorPage from '~/pages/common/error';
import LayoutView from '~/components/layout';
import {
  AccountBookOutlined,
  MacCommandOutlined,
  GiftOutlined,
  PayCircleOutlined,
  BarsOutlined,
  ShoppingOutlined,
  ShopOutlined,
  CreditCardOutlined,
} from '@ant-design/icons';
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
import { AgnosticIndexRouteObject } from '@remix-run/router';
import { Spin } from 'antd';
import { PointList } from '~/pages/pointManage/pointList';
import { PointDetail } from '~/pages/pointManage/pointList/detail';
import { PointRules } from '~/pages/pointManage/pointRules';
import PointDetailList from '~/pages/pointManage/pointDetail';
import DivideOrder from '~/pages/pointManage/divideOrder';
import DivideRules from '~/pages/pointManage/divideRules';
import LoginView from '~/pages/common/login';
import ProductOrderDetail from '~/pages/orderManage/productOrder/detail';
import ServiceOrderDetail from '~/pages/orderManage/serviceOrder/detail';
import EquipmentOrderDetail from '~/pages/orderManage/equipmentOrder/detail';

const ActivityList = React.lazy(() => import('src/pages/activityManage/activityList')); //活动管理
const ProductOrderView = React.lazy(() => import('src/pages/orderManage/productOrder')); //销售订单
const EquipmentOrderView = React.lazy(() => import('src/pages/orderManage/equipmentOrder')); //设备订单
const ServiceOrderView = React.lazy(() => import('src/pages/orderManage/serviceOrder')); //服务订单
const CouponList = React.lazy(() => import('src/pages/couponManage/couponList')); //优惠券管理
const CouponDetail = React.lazy(() => import('src/pages/couponManage/couponList/detail')); //优惠券明细
const SplitCouponList = React.lazy(() => import('src/pages/couponManage/splitCouponList')); //裂变优惠券
const SplitCouponOperate = React.lazy(
  () => import('src/pages/couponManage/splitCouponList/addOrEditOrDetail'),
); //裂变优惠券操作
const CouponDetailed = React.lazy(() => import('src/pages/couponManage/couponDetailed')); //优惠券明细
export interface RouteObjectType {
  path: AgnosticIndexRouteObject['path'];
  element: any;
  errorElement?: React.ReactNode | null;
  children?: Array<RouteObject & RouteObjectType>;
  meta: {
    id: number;
    hidden?: boolean;
    icon: any;
    customIcon?: boolean;
    title: string;
  };
}

const withLoadingComponent = (comp: JSX.Element) => (
  <React.Suspense
    fallback={
      <Spin size='large' tip='Loading...'>
        <div style={{ width: '100%', height: '50vh', marginTop: '10vh' }}></div>
      </Spin>
    }
  >
    {comp}
  </React.Suspense>
);

// 路由数组
export const routerList: Array<RouteObjectType> = [
  {
    path: '/activityManage',
    element: <LayoutView />,
    errorElement: <ErrorPage />,
    meta: {
      id: 19000,
      icon: <GiftOutlined />,
      title: '活动管理',
    },
    children: [
      {
        path: '/activityManage/activityList',
        element: withLoadingComponent(<ActivityList />),
        meta: {
          id: 19100,
          title: '活动列表',
          icon: <GiftOutlined />,
        },
      },
    ],
  },
  {
    path: '/orderManage',
    element: <LayoutView />,
    errorElement: <ErrorPage />,
    meta: {
      id: 10000,
      icon: <BarsOutlined />,
      title: '订单管理',
    },
    children: [
      {
        path: '/orderManage/productOrder',
        element: withLoadingComponent(<ProductOrderView />),
        meta: {
          id: 10010,
          title: '商城订单',
          icon: <ShoppingOutlined />,
        },
      },
      {
        path: '/orderManage/productOrder/detail',
        element: withLoadingComponent(<ProductOrderDetail />),
        meta: {
          id: 10010,
          title: '商城订单 / 详情',
          icon: <ShoppingOutlined />,
          hidden: true,
        },
      },
      {
        path: '/orderManage/equipmentOrder',
        element: withLoadingComponent(<EquipmentOrderView />),
        meta: {
          id: 10020,
          title: '租赁订单',
          icon: <ShopOutlined />,
        },
      },
      {
        path: '/orderManage/equipmentOrder/detail',
        element: withLoadingComponent(<EquipmentOrderDetail />),
        meta: {
          id: 10020,
          title: '租赁订单 / 详情',
          icon: <ShopOutlined />,
          hidden: true,
        },
      },
      {
        path: '/orderManage/serviceOrder',
        element: withLoadingComponent(<ServiceOrderView />),
        meta: {
          id: 10030,
          title: '服务订单',
          icon: <CreditCardOutlined />,
        },
      },
      {
        path: '/orderManage/serviceOrder/detail',
        element: withLoadingComponent(<ServiceOrderDetail />),
        meta: {
          id: 10010,
          title: '服务订单 / 详情',
          icon: <CreditCardOutlined />,
          hidden: true,
        },
      },
    ],
  },
  {
    path: '/pointManage',
    element: <LayoutView />,
    errorElement: <ErrorPage />,
    meta: {
      id: 25000,
      icon: <AccountBookOutlined />,
      title: '积分管理',
    },
    children: [
      {
        path: '/pointManage/pointList',
        element: withLoadingComponent(<PointList />),
        meta: {
          id: 25100,
          title: '积分列表',
          icon: <MacCommandOutlined />,
        },
      },
      {
        path: '/pointManage/pointList/detail',
        element: withLoadingComponent(
          <PointDetail
            location={{
              search: '',
            }}
          />,
        ),
        meta: {
          id: 25100,
          title: '个人积分明细',
          icon: <MacCommandOutlined />,
          hidden: true,
        },
      },
      {
        path: '/pointManage/pointRule',
        element: withLoadingComponent(<PointRules />),
        meta: {
          id: 25200,
          title: '兑换规则',
          icon: <MacCommandOutlined />,
        },
      },
      {
        path: '/pointManage/pointList/list',
        element: withLoadingComponent(
          <PointDetailList
            location={{
              search: '',
            }}
          />,
        ),
        meta: {
          id: 25100,
          title: '积分明细',
          icon: <MacCommandOutlined />,
          hidden: true,
        },
      },
      {
        path: '/pointManage/divideOrder',
        element: withLoadingComponent(<DivideOrder />),
        meta: {
          id: 25300,
          title: '订单分成',
          icon: <MacCommandOutlined />,
        },
      },
      {
        path: '/pointManage/divideRules',
        element: withLoadingComponent(<DivideRules />),
        meta: {
          id: 25400,
          title: '分成规则',
          icon: <MacCommandOutlined />,
          hidden: true,
        },
      },
    ],
  },
  {
    path: '/couponManage',
    element: <LayoutView />,
    errorElement: <ErrorPage />,
    meta: {
      id: 26000,
      icon: <PayCircleOutlined />,
      title: '优惠券管理',
    },
    children: [
      {
        path: '/couponManage/couponList',
        element: withLoadingComponent(<CouponList />),
        meta: {
          id: 26100,
          title: '活动优惠券',
          icon: <PayCircleOutlined />,
        },
      },
      {
        path: '/couponManage/couponList/detail',
        element: withLoadingComponent(
          <CouponDetail
            location={{
              search: '',
            }}
          />,
        ),
        meta: {
          id: 26100,
          title: '活动优惠券操作',
          icon: <PayCircleOutlined />,
          hidden: true,
        },
      },
      {
        path: '/couponManage/splitCouponList',
        element: withLoadingComponent(<SplitCouponList />),
        meta: {
          id: 26200,
          title: '裂变优惠券',
          icon: <PayCircleOutlined />,
        },
      },
      {
        path: '/couponManage/addOrEditOrDetail',
        element: withLoadingComponent(<SplitCouponOperate />),
        meta: {
          id: 26200,
          title: '裂变优惠券操作',
          icon: <PayCircleOutlined />,
          hidden: true,
        },
      },
      {
        path: '/couponManage/couponDetailed',
        element: withLoadingComponent(<CouponDetailed />),
        meta: {
          id: 26300,
          title: '优惠券明细',
          icon: <PayCircleOutlined />,
        },
      },
    ],
  },
];
// 路由白名单
export const whiteRouterList: Array<RouteObject & RouteObjectType> = [
  {
    path: '/',
    element: <Navigate to='/orderManage/productOrder' />,
    meta: {
      id: 0,
      title: '销售订单',
      icon: MacCommandOutlined,
    },
  },
  {
    path: '/login',
    element: withLoadingComponent(<LoginView />),
    meta: {
      id: 0,
      title: '登录',
      icon: MacCommandOutlined,
    },
  },
];
// 整合路由数据
export const routes = [...routerList, ...whiteRouterList];
