import React from 'react';
import dynamic from 'dva/dynamic';
import { getMenuData } from './menu';

// wrapper of dynamic
const dynamicWrapper = (app, models, component) => dynamic({
  app,
  // eslint-disable-next-line no-underscore-dangle
  models: () => models.filter(m => !app._models.some(({ namespace }) => namespace === m)).map(m => import(`../models/${m}.js`)),
  // add routerData prop
  component: () => {
    const p = component();
    return new Promise((resolve, reject) => {
      p.then((Comp) => {
        resolve(props => <Comp {...props} routerData={getRouterData(app)} />);
      }).catch(err => reject(err));
    });
  },
});

function getFlatMenuData(menus) {
  let keys = {};
  menus.forEach((item) => {
    if (item.children) {
      keys[item.path] = item.name;
      keys = { ...keys, ...getFlatMenuData(item.children) };
    } else {
      keys[item.path] = item.name;
    }
  });
  return keys;
}

export const getRouterData = (app) => {
  const routerData = {
    '/': {
      component: dynamicWrapper(app, ['user', 'login'], () => import('../layouts/BasicLayout')),
    },
    '/help': {
      component: dynamicWrapper(app, [], () => import('../routes/About')),
    },
    '/dashboard': {
      component: dynamicWrapper(app, [], () => import('../routes/Dashboard')),
    },
    '/merchant': {
      component: dynamicWrapper(app, ['merchant'], () => import('../routes/Merchant')),
      name: '修改厂商信息',
    },
    '/frontend': {
      component: dynamicWrapper(app, ['recommend', 'mproduct/mproduct'], () => import('../routes/Frontend')),
      name: '前端展现配置',
    },
    '/campus': {
      component: dynamicWrapper(app, ['campus'], () => import('../routes/Campus')),
    },
    '/terminal': {
      component: dynamicWrapper(app, ['terminal/terminal'], () => import('../routes/Terminal/List')),
    },
    '/terminal/add': {
      component: dynamicWrapper(app, ['terminal/detail', 'campus'], () => import('../routes/Terminal/Edit')),
      name: '添加终端',
    },
    '/terminal/edit/:id': {
      component: dynamicWrapper(app, ['terminal/detail', 'campus'], () => import('../routes/Terminal/Edit')),
      name: '编辑终端',
    },
    '/goods': {
      component: dynamicWrapper(app, ['mproduct/mproduct'], () => import('../routes/MProduct/List')),
    },
    '/order': {
      component: dynamicWrapper(app, ['order/order'], () => import('../routes/Order/List')),
    },
    '/order/add': {
      component: dynamicWrapper(app, ['order/detail', 'terminal/terminal', 'mproduct/mproduct'], () => import('../routes/Order/Add')),
      name: '新建订单',
    },
    // '/order/edit/:id': {
    //   component: dynamicWrapper(app, ['order/detail'], () => import('../routes/Order/detail')),
    //   name: '修改订单',
    // },
    // '/order/profile/:id': {
    //   component: dynamicWrapper(app, ['order/detail'], () => import('../routes/Order/detail/orderProfile')),
    //   name: '订单详情',
    // },
    '/sold': {
      component: dynamicWrapper(app, [], () => import('../routes/SoldProduct')),
    },
    '/user': {
      component: dynamicWrapper(app, [], () => import('../layouts/UserLayout')),
    },
    '/user/login': {
      component: dynamicWrapper(app, ['login'], () => import('../routes/Login')),
    },
  };
  // Get name from ./menu.js or just set it in the router data.
  const menuData = getFlatMenuData(getMenuData());
  const routerDataWithName = {};
  Object.keys(routerData).forEach((item) => {
    routerDataWithName[item] = {
      ...routerData[item],
      name: routerData[item].name || menuData[item.replace(/^\//, '')],
    };
  });
  return routerDataWithName;
};