Constructing barchart.

This commit is contained in:
THIS ONE IS A LITTLE BIT TRICKY KRUB 2023-11-20 21:21:10 +07:00
parent 1f665981ae
commit 78c8e3da2e
2 changed files with 14 additions and 12 deletions

View File

@ -2,17 +2,18 @@ import { BarChart, Card, Title } from "@tremor/react";
import React from "react"; import React from "react";
import axiosInstance from "../../api/configs/AxiosConfig"; import axiosInstance from "../../api/configs/AxiosConfig";
const fetchBarChartData = async () => {
}
const chartdata3 = [ const chartdata3 = [
{ {
date: "Jan 23", date: "Monday",
"2022": 45, "This Week": 45,
"2023": 78, "Last Week": 78,
}, },
{ {
date: "Feb 23", date: "Tuesday",
"2022": 52, "This Week": 52,
"2023": 71, "Last Week": 71,
}, },
{ {
date: "Mar 23", date: "Mar 23",
@ -70,20 +71,17 @@ export const BarChartGraph = () => {
const [value, setValue] = React.useState(null); const [value, setValue] = React.useState(null);
return ( return (
<> <>
<Card> <Title>Task completed statistics vs. last week</Title>
<Title>Closed Pull Requests</Title>
<BarChart <BarChart
className="mt-6" className="mt-6"
data={chartdata3} data={chartdata3}
index="date" index="date"
categories={["2022", "2023"]} categories={["This Week", "Last week"]}
colors={["neutral", "indigo"]} colors={["neutral", "indigo"]}
yAxisWidth={30} yAxisWidth={30}
onValueChange={(v) => setValue(v)} onValueChange={(v) => setValue(v)}
showAnimation showAnimation
/> />
</Card>
<pre>{JSON.stringify(value)}</pre>
</> </>
); );
}; };

View File

@ -37,6 +37,8 @@ export default function Dashboard() {
<TabPanel> <TabPanel>
<Grid numItemsMd={2} numItemsLg={3} className="gap-6 mt-6"> <Grid numItemsMd={2} numItemsLg={3} className="gap-6 mt-6">
<Card> <Card>
<Title>Highlights vs. last week</Title>
<br />
<KpiCard /> <KpiCard />
<br /> <br />
<KpiCard /> <KpiCard />
@ -55,7 +57,9 @@ export default function Dashboard() {
</Card> </Card>
</div> </div>
<Card>
<BarChartGraph /> <BarChartGraph />
</Card>
</Grid> </Grid>
</TabPanel> </TabPanel>
</TabPanels> </TabPanels>