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

import Cards from '../../Component/Cards';

import '../Index.scss';

const DetailIndex = Loadable({
  loader: () => import("../List"),
  loading: Loading,
});
const Setting = Loadable({
  loader: () => import("../Setting/TeamSettingIndex"),
  loading: Loading,
});
const GroupSetting = Loadable({
  loader: () => import("../Group/GroupDetailSetting"),
  loading: Loading,
});
export default ((props)=>{
  return(
    <div className="teamDetail">
      <Cards
        title="组织名称"
        desc="组织名称组织名称组织名称组织名称组织名称"
        rightBtn={<a className="color-blue">设置<i className="iconfont icon-shezhi2 ml3"></i></a>}
        img={`https://dss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=4193840146,2109186388&fm=26&gp=0.jpg`}
      />
      <Switch {...props}>
        <Route
          path="/organize/:organizeId/member/:memberId/setting"
          render={() => {
            return <GroupSetting {...props} />
          }}
        ></Route>
        <Route
          path="/organize/:organizeId/setting"
          render={() => {
            return <Setting {...props} />
          }}
        ></Route>
        <Route
          path="/organize/:organizeId"
          render={() => {
            return <DetailIndex {...props} />
          }}
        ></Route>
      </Switch>
    </div>
  )
})