48 lines
1.8 KiB
TypeScript
48 lines
1.8 KiB
TypeScript
import { useState } from "react"
|
||
import ServersView from "../components/ServersView"
|
||
import ServerIpsView from "../components/ServerIpsView"
|
||
import ServerHardware from "../components/ServerHardware"
|
||
import ServerStorage from "../components/ServerStorages"
|
||
import { Flex, ScrollAreaAutosize, Tabs } from "@mantine/core"
|
||
|
||
export default function Servers() {
|
||
const [currentTab, setCurrentTab] = useState<string | null>('0')
|
||
|
||
return (
|
||
<ScrollAreaAutosize w={'100%'} h={'100%'} p='sm'>
|
||
<Flex gap='sm' direction='column'>
|
||
<Tabs value={currentTab} onChange={setCurrentTab}>
|
||
<Tabs.List>
|
||
<Tabs.Tab value="0">Серверы</Tabs.Tab>
|
||
<Tabs.Tab value="1">IP-адреса</Tabs.Tab>
|
||
<Tabs.Tab value="3">Hardware</Tabs.Tab>
|
||
<Tabs.Tab value="4">Storages</Tabs.Tab>
|
||
</Tabs.List>
|
||
|
||
<Tabs.Panel value="0" pt='sm'>
|
||
<ServersView />
|
||
</Tabs.Panel>
|
||
|
||
<Tabs.Panel value="1" pt='sm'>
|
||
<ServerIpsView />
|
||
</Tabs.Panel>
|
||
|
||
<Tabs.Panel value="2" pt='sm'>
|
||
<ServerHardware />
|
||
</Tabs.Panel>
|
||
|
||
<Tabs.Panel value="3" pt='sm'>
|
||
<ServerStorage />
|
||
</Tabs.Panel>
|
||
</Tabs>
|
||
</Flex>
|
||
|
||
{/* <BarChart
|
||
xAxis={[{ scaleType: 'band', data: ['group A', 'group B', 'group C'] }]}
|
||
series={[{ data: [4, 3, 5] }, { data: [1, 6, 3] }, { data: [2, 5, 6] }]}
|
||
width={500}
|
||
height={300}
|
||
/> */}
|
||
</ScrollAreaAutosize>
|
||
)
|
||
} |