Compare commits
No commits in common. "4d85cd3c19af5f9efcce093e03d3eafcfe979735" and "6d3d7a848d05a02b6387dd45327aaf9b115b9d6d" have entirely different histories.
4d85cd3c19
...
6d3d7a848d
@ -206,6 +206,20 @@ export default function Dashboard() {
|
|||||||
trend: stats?.trends.cancelled_bookings ?? "0%",
|
trend: stats?.trends.cancelled_bookings ?? "0%",
|
||||||
trendUp: false,
|
trendUp: false,
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: "Total Revenue",
|
||||||
|
value: `$${stats?.total_revenue.toLocaleString() ?? 0}`,
|
||||||
|
icon: DollarSign,
|
||||||
|
trend: stats?.trends.total_revenue ?? "0%",
|
||||||
|
trendUp: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Monthly Revenue",
|
||||||
|
value: `$${stats?.monthly_revenue.toLocaleString() ?? 0}`,
|
||||||
|
icon: TrendingUp,
|
||||||
|
trend: stats?.trends.monthly_revenue ?? "0%",
|
||||||
|
trendUp: true,
|
||||||
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
||||||
@ -261,7 +275,7 @@ export default function Dashboard() {
|
|||||||
) : (
|
) : (
|
||||||
<>
|
<>
|
||||||
{/* Stats Grid */}
|
{/* Stats Grid */}
|
||||||
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3 sm:gap-4">
|
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-3 sm:gap-4">
|
||||||
{statCards.map((card, index) => {
|
{statCards.map((card, index) => {
|
||||||
const Icon = card.icon;
|
const Icon = card.icon;
|
||||||
return (
|
return (
|
||||||
@ -273,16 +287,14 @@ export default function Dashboard() {
|
|||||||
<div className={`p-2 sm:p-2.5 rounded-lg ${isDark ? "bg-gray-700" : "bg-gray-50"}`}>
|
<div className={`p-2 sm:p-2.5 rounded-lg ${isDark ? "bg-gray-700" : "bg-gray-50"}`}>
|
||||||
<Icon className={`w-4 h-4 sm:w-5 sm:h-5 ${isDark ? "text-gray-200" : "text-gray-600"}`} />
|
<Icon className={`w-4 h-4 sm:w-5 sm:h-5 ${isDark ? "text-gray-200" : "text-gray-600"}`} />
|
||||||
</div>
|
</div>
|
||||||
{card.showTrend !== false && card.trend && (
|
<div className={`flex items-center gap-1 px-2 py-1 rounded-full text-xs font-medium ${getTrendClasses(card.trendUp)}`}>
|
||||||
<div className={`flex items-center gap-1 px-2 py-1 rounded-full text-xs font-medium ${getTrendClasses(card.trendUp)}`}>
|
{card.trendUp ? (
|
||||||
{card.trendUp ? (
|
<ArrowUpRight className="w-3 h-3" />
|
||||||
<ArrowUpRight className="w-3 h-3" />
|
) : (
|
||||||
) : (
|
<ArrowDownRight className="w-3 h-3" />
|
||||||
<ArrowDownRight className="w-3 h-3" />
|
)}
|
||||||
)}
|
<span className="hidden sm:inline">{card.trend}</span>
|
||||||
<span className="hidden sm:inline">{card.trend}</span>
|
</div>
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
@ -292,11 +304,9 @@ export default function Dashboard() {
|
|||||||
<p className={`text-xl sm:text-2xl font-bold mb-1 ${isDark ? "text-white" : "text-gray-900"}`}>
|
<p className={`text-xl sm:text-2xl font-bold mb-1 ${isDark ? "text-white" : "text-gray-900"}`}>
|
||||||
{card.value}
|
{card.value}
|
||||||
</p>
|
</p>
|
||||||
{card.showTrend !== false && (
|
<p className={`text-xs ${isDark ? "text-gray-400" : "text-gray-500"}`}>
|
||||||
<p className={`text-xs ${isDark ? "text-gray-400" : "text-gray-500"}`}>
|
vs last month
|
||||||
vs last month
|
</p>
|
||||||
</p>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user