dwindown/meet-hub
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Changes

Browse Source
This commit is contained in:
gpt-engineer-app[bot]
2025-12-19 15:17:47 +00:00
parent f57bba6f9c
commit 7fc10126df
11 changed files with 979 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
src/pages/member/MemberOrders.tsx
View File

@@ -1,5 +1,5 @@
import { useEffect, useState } from "react";
import { useNavigate } from "react-router-dom";
import { useNavigate, Link } from "react-router-dom";
import { AppLayout } from "@/components/AppLayout";
import { useAuth } from "@/hooks/useAuth";
import { supabase } from "@/integrations/supabase/client";
@@ -7,6 +7,7 @@ import { Card, CardContent } from "@/components/ui/card";
import { Badge } from "@/components/ui/badge";
import { Skeleton } from "@/components/ui/skeleton";
import { formatIDR, formatDate } from "@/lib/format";
import { ChevronRight } from "lucide-react";
interface Order {
id: string;
@@ -96,25 +97,28 @@ export default function MemberOrders() {
) : (
<div className="space-y-4">
{orders.map((order) => (
<Card key={order.id} className="border-2 border-border">
<CardContent className="py-4">
<div className="flex items-center justify-between">
<div>
<p className="font-mono text-sm text-muted-foreground">{order.id.slice(0, 8)}</p>
<p className="text-sm text-muted-foreground">{formatDate(order.created_at)}</p>
{order.payment_method && (
<p className="text-xs text-muted-foreground uppercase">{order.payment_method}</p>
)}
<Link key={order.id} to={`/orders/${order.id}`}>
<Card className="border-2 border-border hover:border-primary transition-colors cursor-pointer">
<CardContent className="py-4">
<div className="flex items-center justify-between">
<div>
<p className="font-mono text-sm text-muted-foreground">{order.id.slice(0, 8)}</p>
<p className="text-sm text-muted-foreground">{formatDate(order.created_at)}</p>
{order.payment_method && (
<p className="text-xs text-muted-foreground uppercase">{order.payment_method}</p>
)}
</div>
<div className="flex items-center gap-4">
<Badge className={getStatusColor(order.payment_status || order.status)}>
{getPaymentStatusLabel(order.payment_status || order.status)}
</Badge>
<span className="font-bold">{formatIDR(order.total_amount)}</span>
<ChevronRight className="w-5 h-5 text-muted-foreground" />
</div>
</div>
<div className="flex items-center gap-4">
<Badge className={getStatusColor(order.payment_status || order.status)}>
{getPaymentStatusLabel(order.payment_status || order.status)}
</Badge>
<span className="font-bold">{formatIDR(order.total_amount)}</span>
</div>
</div>
</CardContent>
</Card>
</CardContent>
</Card>
</Link>
))}
</div>
)}