feat: add DoctorIcon component and integrate it into dashboard reports
This commit is contained in:
@@ -1,7 +1,6 @@
|
||||
import { GraphIcon } from '~/components/icons/graph'
|
||||
import { CardReport } from '~/components/ui/card-report'
|
||||
|
||||
import { REPORT } from './data'
|
||||
import { HISTORY, REPORT } from './data'
|
||||
export const DashboardPage = () => {
|
||||
return (
|
||||
<div className="relative">
|
||||
@@ -22,45 +21,27 @@ export const DashboardPage = () => {
|
||||
</section>
|
||||
|
||||
<div className="mb-5 grid grid-cols-3 gap-4">
|
||||
{REPORT.map(({ title, amount }, index) => (
|
||||
{REPORT.map(({ title, amount, icon }, index) => (
|
||||
<CardReport
|
||||
key={index}
|
||||
title={title}
|
||||
amount={amount}
|
||||
icon={icon}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-3 gap-x-4 gap-y-4">
|
||||
<div className="grid gap-y-4">
|
||||
<div className="rounded-lg bg-white p-5 shadow">
|
||||
<div className="flex items-center">
|
||||
<GraphIcon
|
||||
className="ml-2 rounded-xl bg-[#2E2F7C] p-2 text-white"
|
||||
height={48}
|
||||
width={48}
|
||||
/>
|
||||
<div className="ml-10">
|
||||
<h2 className="text-lg font-semibold">Total Kunjungan</h2>
|
||||
<p className="text-3xl font-bold text-[#2E2F7C]">2.890</p>
|
||||
</div>
|
||||
</div>
|
||||
<p className="pt-2">Pribadi: 2.190 | Perusahaan: 700</p>
|
||||
</div>
|
||||
<div className="rounded-lg bg-white p-5 shadow">
|
||||
<div className="flex items-center">
|
||||
<GraphIcon
|
||||
className="ml-2 rounded-xl bg-[#2E2F7C] p-2 text-white"
|
||||
height={48}
|
||||
width={48}
|
||||
/>
|
||||
<div className="ml-10">
|
||||
<h2 className="text-lg font-semibold">Total User Memesan</h2>
|
||||
<p className="text-3xl font-bold text-[#2E2F7C]">274</p>
|
||||
</div>
|
||||
</div>
|
||||
<p className="pt-2">Pribadi: 211 | Perusahaan: 54</p>
|
||||
</div>
|
||||
{HISTORY.map(({ title, amount, icon, counter }, index) => (
|
||||
<CardReport
|
||||
key={index}
|
||||
title={title}
|
||||
amount={amount}
|
||||
icon={icon}
|
||||
counter={counter}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
<div className="col-span-2">
|
||||
<img
|
||||
|
||||
Reference in New Issue
Block a user