forked from ddrilling/asb_cloud_front
69 lines
2.0 KiB
JavaScript
69 lines
2.0 KiB
JavaScript
import { Layout, Menu } from "antd";
|
||
import { Link, Switch, Route, Redirect, useParams } from "react-router-dom";
|
||
import { useState, useEffect } from "react";
|
||
import ClusterWells from "./ClusterWells";
|
||
import ClusterSections from "./ClusterSections";
|
||
import LoaderPortal from "../../components/LoaderPortal";
|
||
import { invokeWebApiWrapperAsync } from "../../components/factory";
|
||
import { WellOperationStatService } from "../../services/api";
|
||
|
||
const { Content } = Layout;
|
||
|
||
|
||
export default function Cluster() {
|
||
let { idClaster, tab } = useParams();
|
||
const [data, setData] = useState([]);
|
||
const [showLoader, setShowLoader] = useState(false);
|
||
|
||
useEffect(() => {
|
||
invokeWebApiWrapperAsync(
|
||
async () => {
|
||
const clusterData = await WellOperationStatService.getStatCluster(
|
||
idClaster
|
||
);
|
||
setData(clusterData ?? []);
|
||
},
|
||
setShowLoader,
|
||
`Не удалось загрузить данные по кусту "${idClaster}"`
|
||
);
|
||
}, [idClaster]);
|
||
|
||
return (
|
||
<>
|
||
<Layout>
|
||
<Menu
|
||
mode="horizontal"
|
||
selectable={true}
|
||
selectedKeys={[tab]}
|
||
className="well_menu"
|
||
>
|
||
<Menu.Item key="wells">
|
||
<Link to={`/cluster/${idClaster}/wells`}>Скважины</Link>
|
||
</Menu.Item>
|
||
<Menu.Item key="sections">
|
||
<Link to={`/cluster/${idClaster}/sections`}>Секции</Link>
|
||
</Menu.Item>
|
||
</Menu>
|
||
</Layout>
|
||
|
||
<Layout>
|
||
<LoaderPortal show={showLoader}>
|
||
<Content className="site-layout-background">
|
||
<Switch>
|
||
<Route path="/cluster/:id/wells">
|
||
<ClusterWells clusterData={data} />
|
||
</Route>
|
||
<Route path="/cluster/:id/sections">
|
||
<ClusterSections clusterData={data} />
|
||
</Route>
|
||
<Route path="/">
|
||
<Redirect to={`/cluster/${idClaster}/wells`} />
|
||
</Route>
|
||
</Switch>
|
||
</Content>
|
||
</LoaderPortal>
|
||
</Layout>
|
||
</>
|
||
);
|
||
}
|