Update tampilan

This commit is contained in:
wayanrivan
2025-04-08 11:53:25 +07:00
parent e012fadab1
commit 13da7fde9c
29 changed files with 1018 additions and 652 deletions

View File

@ -15,6 +15,7 @@ import { Button } from '@/components/ui/button';
import { useFetchYear } from './hooks/useFetchYear';
import { get5LastYear } from '@/utils/Date';
import { staticChartData } from './staticChart';
import { Helmet } from 'react-helmet';
// sum -> nominal, count-> total
type CountType = 'sum' | 'count';
@ -138,64 +139,69 @@ const DashboardHomePage = () => {
);
return (
<Container>
<div className="flex gap-3 items-center mb-6">
<YearPicker selectedYear={selectedYear} setSelectedYear={handleYearChange} />
<div className="w-auto min-w-[120px]">
<Select value={count} onValueChange={handleCountType}>
<SelectTrigger size="sm">
<SelectValue placeholder="Select Count Type" />
</SelectTrigger>
<SelectContent className="w-32">
<SelectItem value="sum">Nominal</SelectItem>
<SelectItem value="count">Status</SelectItem>
</SelectContent>
</Select>
</div>
{/* <DefaultTooltip title="Filter" placement="top">
<>
<Helmet>
<title>TPAY | Dashboard</title>
</Helmet>
<Container>
<div className="flex gap-3 items-center mb-6">
<YearPicker selectedYear={selectedYear} setSelectedYear={handleYearChange} />
<div className="w-auto min-w-[120px]">
<Select value={count} onValueChange={handleCountType}>
<SelectTrigger size="sm">
<SelectValue placeholder="Select Count Type" />
</SelectTrigger>
<SelectContent className="w-32">
<SelectItem value="sum">Nominal</SelectItem>
<SelectItem value="count">Status</SelectItem>
</SelectContent>
</Select>
</div>
{/* <DefaultTooltip title="Filter" placement="top">
<Button variant="outline" className="h-7.5" onClick={() => handleFilter(dateRange)}>
<KeenIcon icon="filter" />
</Button>
</DefaultTooltip> */}
<DefaultTooltip title="Reset Filter" placement="top">
<Button variant="outline" className="h-7.5" onClick={resetFilter}>
<KeenIcon icon="arrow-circle-left" />
</Button>
</DefaultTooltip>
</div>
{/* Cards */}
<div className="grid gap-5 lg:gap-7.5 mb-5">
<div className="grid lg:grid-cols-4 gap-y-5 lg:gap-5 items-stretch">
{cardData.map((data: any) => (
<div className="lg:col-span-1" key={data.type}>
<Card
title={data.type.toUpperCase()}
total={data.total}
type={data.type}
count={count}
/>
</div>
))}
<DefaultTooltip title="Reset Filter" placement="top">
<Button variant="outline" className="h-7.5" onClick={resetFilter}>
<KeenIcon icon="arrow-circle-left" />
</Button>
</DefaultTooltip>
</div>
</div>
{/* Chart */}
<div className="grid gap-5 lg:gap-7.5">
<div className="grid lg:grid-cols-1 gap-y-5 lg:gap-5 items-stretch">
<div className="lg:col-span-1">
<Chart
title="Overview"
count={12}
toolbar={toolbar}
chartData={staticChartData.series.map((data: any) => data.data)}
chartType={chartType}
chartLegend={chartLegend}
/>
{/* Cards */}
<div className="grid gap-5 lg:gap-7.5 mb-5">
<div className="grid lg:grid-cols-4 gap-y-5 lg:gap-5 items-stretch">
{cardData.map((data: any) => (
<div className="lg:col-span-1" key={data.type}>
<Card
title={data.type.toUpperCase()}
total={data.total}
type={data.type}
count={count}
/>
</div>
))}
</div>
</div>
</div>
</Container>
{/* Chart */}
<div className="grid gap-5 lg:gap-7.5">
<div className="grid lg:grid-cols-1 gap-y-5 lg:gap-5 items-stretch">
<div className="lg:col-span-1">
<Chart
title="Overview"
count={12}
toolbar={toolbar}
chartData={staticChartData.series.map((data: any) => data.data)}
chartType={chartType}
chartLegend={chartLegend}
/>
</div>
</div>
</div>
</Container>
</>
);
};