forgeplus-react/src/forge/DevOps/Index.jsx

import React , { useEffect } 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 New = Loadable({
  loader: () => import('./disposePipeline'),
  loading: Loading,
})
const Dispose = Loadable({
  loader: () => import('./Dispose'),
  loading: Loading,
})
const Stucture = Loadable({
  loader: () => import('./Structure'),
  loading: Loading,
})
const Mould = Loadable({
  loader: () => import('./Mould'),
  loading: Loading,
})
const Params = Loadable({
  loader: () => import('./Manage/Params'),
  loading: Loading,
})

export default ((props)=>{

  return(
    <WhiteBack className="opsPanel">
      <Switch {...props}>
        
        <Route path="/:owner/:projectsId/devops/params"
          render={
            (p) => (<Params {...props} {...p}/>)
          }
        ></Route>
        <Route path="/:owner/:projectsId/devops/mould"
          render={
            (p) => (<Mould {...props} {...p}/>)
          }
        ></Route>
        <Route path="/:owner/:projectsId/devops/new"
          render={
            (p) => (<New {...props} {...p}/>)
          }
        ></Route>
        
        <Route path="/:owner/:projectsId/devops/list/:branch"
          render={
            (p) => (<Stucture {...props} {...p}/>)
          }
        ></Route>
        <Route path="/:owner/:projectsId/devops/:disposeId"
          render={
            (p) => (<New {...props} {...p}/>)
          }
        ></Route>
        {/* 原本的两种合为一个 */}
        <Route path="/:owner/:projectsId/devops"
          render={
            (p) =>{return( p.location.state.open_devops?<Dispose {...props} {...p}/>:<About {...props} {...p}/>)}
          }
        ></Route>
      </Switch>
    </WhiteBack>
  )
})