update dashboard view

This commit is contained in:
wayanrivan
2025-04-23 17:00:02 +07:00
parent 0ea561aebc
commit 7db3e72476
4 changed files with 297 additions and 77 deletions

View File

@ -4,46 +4,31 @@ import { toAbsoluteUrl } from '@/utils/Assets';
interface CardDataProduct {
title: string;
total: string;
type: Array<{ label: string; value: string; total: string }>;
count: 'sum' | 'count';
total: number;
growth: number;
surplus: boolean;
icon: string;
}
const Card = ({ title, total, type, count }: CardDataProduct) => {
const Card = ({ title, total, growth, surplus,icon }: CardDataProduct) => {
const { isRTL } = useLanguage();
return (
<div className="card h-full bg-[length:85%] bg-[length:85%] [background-position:9rem_-4rem] rtl:[background-position:-4rem_-4rem] bg-no-repeat channel-stats-bg">
<div className="card h-full w-full bg-[length:85%] [background-position:9rem_-4rem] rtl:[background-position:-4rem_-4rem] bg-no-repeat channel-stats-bg">
<div className="card-body flex flex-col gap-4 p-5 lg:p-b-7.5 lg:pt-4">
<div className="flex justify-between">
<div className="flex flex-col w-8/12" style={{ background: '' }}>
<div className="flex flex-col w-full">
<span className="text-sm font-normal text-gray-600 mb-5">{title}</span>
<span className="text-3xl font-semibold text-gray-900 mb-0">
{count === 'sum' ? fCurrency(total) : total}
<span className="text-3xl font-semibold text-gray-900 mb-0">{total}</span>
<span
className={`text-sm font-semibold mt-2 flex items-center gap-1 ${
surplus ? 'text-green-500' : 'text-red-500'
}`}
>
{surplus ? '▲' : '▼'} {growth} % From Last Week
</span>
</div>
<div className="flex flex-col w-4/12 justify-between" style={{ background: '' }}>
<img
src={toAbsoluteUrl('/media/file-types/chart.svg')}
className="dark:hidden h-5 h-8"
alt="Chart Icon"
/>
</div>
</div>
{/* <hr className="" />
<div className="">
{type.map((data: any, index: number) => (
<div key={data.label}>
<div className="flex justify-between mb-1">
<div className="w-8/12 text-sm">{data.label}</div>
<div className="w-4/12 text-sm text-end">
{count === 'sum' ? fCurrency(data.total) : data.total}{' '}
</div>
</div>
{index !== type.length - 1 && <hr className="border-dashed my-2" />}
</div>
))}
</div> */}
</div>
</div>
);