TurTaskProject/TurTaskWeb
1
0
Fork 0
mirror of https://github.com/TurTaskProject/TurTaskWeb.git synced 2025-12-18 21:44:07 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Update dashboard layout

Browse Source
This commit is contained in:
sosokker 2023-11-20 17:25:21 +07:00
parent e75453e7c3
commit 9662d55c5a
1 changed files with 18 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
frontend/src/components/dashboard/dashboard.jsx
View File

@ -1,15 +1,4 @@
import {
Card,
Grid,
Tab,
TabGroup,
TabList,
TabPanel,
TabPanels,
Text,
Title,
DonutChart,
} from "@tremor/react";
import { Card, Grid, Tab, TabGroup, TabList, TabPanel, TabPanels, Text, Title, DonutChart } from "@tremor/react";
import KpiCard from "./kpiCard";
import { BarChartGraph } from "./Barchart";
@ -25,8 +14,7 @@ const cities = [
},
];
const valueFormatter = (number) =>
`$ ${new Intl.NumberFormat("us").format(number).toString()}`;
const valueFormatter = number => `$ ${new Intl.NumberFormat("us").format(number).toString()}`;
export default function Dashboard() {
return (
@ -50,47 +38,23 @@ export default function Dashboard() {
<br />
<KpiCard />
</Card>
{/* Placeholder to set height */}
<div className="h-31">
<Card className="mx-auto h-full">
<Title>Sales</Title>
<DonutChart
className="mt-6"
data={cities}
category="sales"
index="name"
colors={[
"rose",
"yellow",
"orange",
"indigo",
"blue",
"emerald",
]}
onValueChange={(v) => setValue(v)}
showAnimation
/>
</Card>
</div>
<BarChartGraph />
<Card>
{/* Placeholder to set height */}
<div className="h-28" />
</Card>
{/* Placeholder to set height */}
<div className="h-31">
<Card className="mx-auto h-full">
<Title>Sales</Title>
<DonutChart
className="mt-6"
data={cities}
category="sales"
index="name"
colors={["rose", "yellow", "orange", "indigo", "blue", "emerald"]}
onValueChange={v => setValue(v)}
showAnimation
/>
</Card>
</div>
<BarChartGraph />
</Grid>
<div className="mt-6">
<Card>
<div className="h-80" />
</Card>
</div>
</TabPanel>
<TabPanel>
<div className="mt-6">
<Card>
<div className="h-96" />
</Card>
</div>
</TabPanel>
</TabPanels>
</TabGroup>