import React from 'react';
import { WhiteBack } from '../Component/layout';
import './ops.scss';

import { Route, Switch } from 'react-router-dom';
import Loadable from 'react-loadable';
import Loading from '../../Loading';

const About = Loadable({
  loader: () => import('./About'),
  loading: Loading,
})
const Infos = Loadable({
  loader: () => import('./Infos'),
  loading: Loading,
})
export default ((props)=>{
  return(
    <WhiteBack className="opsPanel">
      <Switch {...props}>
        <Route path="/projects/:projectsId/ops/dispose"
          render={
            () => (<Infos {...props} />)
          }
        ></Route>
        <Route path="/projects/:projectsId/ops/list"
          render={
            () => (<Infos {...props} />)
          }
        ></Route>
        <Route path="/projects/:projectsId/ops"
          render={
            () => (<About {...props} />)
          }
        ></Route>
      </Switch>
    </WhiteBack>
  )
})