legalgonews/legalgo-FE-reactrouter
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: update report amounts to string format and enhance dashboard layout

Browse Source
This commit is contained in:
fredy.siswanto
2025-02-24 00:54:00 +07:00
parent 00bb4f99cb
commit e484af6e71
6 changed files with 255 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/components/ui/card-report.tsx
+14 -46
View File
@@ -1,60 +1,28 @@
import { Link } from 'react-router'
import { GraphIcon } from '~/components/icons/graph'
interface CardReportProperty {
title: string
amound?: number
amound?: number | string
url?: string
type?: 'history' | 'report'
counter?: number[]
}
export const CardReport = (properties: CardReportProperty) => {
const { title, amound, url } = properties
return url ? (
<div className="flex h-26 max-w-[360px] min-w-[300px] items-center justify-between rounded bg-white px-4 py-6 shadow-sm">
<GraphIcon
className="ml-2 rounded-xl bg-[#2E2F7C] p-2 text-white"
height={48}
width={48}
/>
<Link
to={url}
className="text-[#2E2F7C]"
>
<div className="text-[#2E2F7C]">
<h2 className="text-medium font-medium text-[#363636]">{title}</h2>
<p className="text-2xl font-bold">
<span>Rp.</span>
{amound}
</p>
const { title, amound } = properties
return (
<>
<div className="flex items-center rounded bg-white px-4 py-6 shadow-sm">
<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">{title}</h2>
<p className="text-2xl font-bold text-[#2E2F7C]">Rp. {amound}</p>
</div>
</Link>
</div>
) : (
<div className="flex h-26 max-w-[360px] min-w-[300px] items-center justify-between gap-4 rounded bg-white px-4 py-6 shadow-sm">
<GraphIcon
className="ml-2 rounded-xl bg-[#2E2F7C] p-2 text-white"
height={48}
width={48}
/>
<div className="text-[#2E2F7C]">
<h2 className="text-medium font-medium text-[#363636]">{title}</h2>
<p className="text-2xl font-bold">
<span>Rp.</span>
{amound}
</p>
{/* <div className="flex flex-row gap-4 text-[#363636]">
<p>
<span>Pribadi : </span> {0}
</p>
<p>
<span>Perusahaan : </span> {0}
</p>
</div> */}
</div>
</div>
</>
)
}