From f2724a5cd212465294d4c74e20a2ce6c1948a710 Mon Sep 17 00:00:00 2001 From: Beilin-b Date: Mon, 15 Jun 2026 10:18:15 -0700 Subject: [PATCH] GetMyTransactions api --- app/payments/page.js | 327 +++++++++++++++++++++++++++++++++++++------ 1 file changed, 284 insertions(+), 43 deletions(-) diff --git a/app/payments/page.js b/app/payments/page.js index fe8e70f..966efe7 100644 --- a/app/payments/page.js +++ b/app/payments/page.js @@ -1,3 +1,155 @@ +// 'use client'; + +// import { useEffect, useState, useCallback } from 'react'; +// import { useRouter } from 'next/navigation'; +// import { motion } from 'framer-motion'; +// import { CreditCard, Loader2, Home, Calendar, Check, X, Clock } from 'lucide-react'; +// import toast, { Toaster } from 'react-hot-toast'; +// import AuthService from '@/app/services/AuthService'; +// import { getUserReservations, payDeposit } from '@/app/utils/api'; + +// const STATUS_MAP = ['pending', 'ownerConfirmed', 'depositPaid', 'depositConfirmed', 'completed', 'cancelled']; + +// const STATUS_CONFIG = { +// pending: { label: 'قيد الانتظار', color: 'bg-yellow-100 text-yellow-800 border-yellow-300', depositPaid: false }, +// ownerConfirmed: { label: 'مؤكد من المالك', color: 'bg-blue-100 text-blue-800 border-blue-300', depositPaid: false }, +// depositPaid: { label: 'تم دفع السلفة', color: 'bg-orange-100 text-orange-800 border-orange-300', depositPaid: true }, +// depositConfirmed: { label: 'تم تأكيد الدفع', color: 'bg-green-100 text-green-800 border-green-300', depositPaid: true }, +// completed: { label: 'منتهي', color: 'bg-teal-100 text-teal-800 border-teal-300', depositPaid: true }, +// cancelled: { label: 'ملغي', color: 'bg-red-100 text-red-800 border-red-300', depositPaid: false }, +// }; + +// export default function PaymentsPage() { +// const router = useRouter(); +// const [reservations, setReservations] = useState([]); +// const [loading, setLoading] = useState(true); +// const [payingId, setPayingId] = useState(null); + +// useEffect(() => { +// // Admin check removed +// // if (AuthService.isAdmin()) { +// // router.push('/'); +// // return; +// // } +// loadReservations(); +// }, [router]); + +// const loadReservations = useCallback(async () => { +// try { +// const data = await getUserReservations(); +// setReservations(Array.isArray(data) ? data : []); +// } catch (err) { +// console.error(err); +// toast.error('فشل تحميل المدفوعات'); +// } finally { +// setLoading(false); +// } +// }, []); + +// const handlePayDeposit = async (reservation) => { +// setPayingId(reservation.id); +// try { +// await payDeposit({ reservationId: reservation.id }); +// toast.success('تم دفع السلفة بنجاح!'); +// loadReservations(); +// } catch (err) { +// toast.error(err?.message || 'فشل عملية الدفع'); +// } finally { +// setPayingId(null); +// } +// }; + +// const formatCurrency = (v) => (v ?? 0).toLocaleString() + ' ل.س'; + +// if (loading) { +// return ( +//
+// +//
+// ); +// } + +// const canPay = (status) => STATUS_MAP[status] === 'pending' || STATUS_MAP[status] === 'ownerConfirmed'; + +// return ( +//
+// +//
+// +//

المدفوعات

+//

إدارة مدفوعات الحجوزات والدفعات المقدمة

+// + +// {reservations.length === 0 ? ( +// +// +//

لا توجد معاملات مالية

+//

ستظهر هنا مدفوعاتك للحجوزات

+// +// ) : ( +//
+// {reservations.map((r, i) => { +// const statusKey = STATUS_MAP[r.status] || 'pending'; +// const cfg = STATUS_CONFIG[statusKey]; +// const amount = r.depositAmount || r.totalPrice || 0; + +// return ( +// +//
+//
+//
+// +//
+//
+//

+// {r.propertyAddress || r._prop?.address || `عقار #${r.propertyId || r.id}`} +//

+//

حجز #{r.id}

+//
+// {new Date(r.startDate).toLocaleDateString('ar')} +// {new Date(r.endDate).toLocaleDateString('ar')} +//
+//
+//
+//
+//
{formatCurrency(amount)}
+// +// {cfg.depositPaid ? : } +// {cfg.label} +// +//
+//
+ +// {canPay(r.status) && ( +//
+// +//
+// )} +// +// ); +// })} +//
+// )} +//
+//
+// ); +// } + + + + + + + + + + 'use client'; import { useEffect, useState, useCallback } from 'react'; @@ -6,7 +158,7 @@ import { motion } from 'framer-motion'; import { CreditCard, Loader2, Home, Calendar, Check, X, Clock } from 'lucide-react'; import toast, { Toaster } from 'react-hot-toast'; import AuthService from '@/app/services/AuthService'; -import { getUserReservations, payDeposit } from '@/app/utils/api'; +import { payDeposit } from '@/app/utils/api'; const STATUS_MAP = ['pending', 'ownerConfirmed', 'depositPaid', 'depositConfirmed', 'completed', 'cancelled']; @@ -25,19 +177,58 @@ export default function PaymentsPage() { const [loading, setLoading] = useState(true); const [payingId, setPayingId] = useState(null); - useEffect(() => { - // Admin check removed - // if (AuthService.isAdmin()) { - // router.push('/'); - // return; - // } - loadReservations(); - }, [router]); + const getAuthToken = () => { + if (typeof window === 'undefined') return ''; + return ( + AuthService?.getToken?.() || + AuthService?.getAccessToken?.() || + localStorage.getItem('token') || + localStorage.getItem('accessToken') || + localStorage.getItem('authToken') || + '' + ); + }; const loadReservations = useCallback(async () => { try { - const data = await getUserReservations(); - setReservations(Array.isArray(data) ? data : []); + const token = getAuthToken(); + + const res = await fetch('http://45.93.137.91/api/Customer/GetMyTransaction', { + method: 'GET', + headers: { + ...(token ? { Authorization: `Bearer ${token}` } : {}), + }, + }); + + if (!res.ok) { + throw new Error('فشل تحميل المدفوعات'); + } + + const json = await res.json(); + const items = Array.isArray(json?.data) ? json.data : Array.isArray(json) ? json : []; + + const mapped = items.map((item) => { + const deposit = item?.diposit || item?.deposit || {}; + const reservation = deposit?.reservation || {}; + const transaction = deposit?.transaction || {}; + const currency = item?.currency || {}; + + return { + id: reservation.id ?? deposit.reservationId ?? deposit?.reservation?.id ?? item?.reservationId ?? deposit?.id, + reservationId: reservation.id ?? deposit.reservationId ?? item?.reservationId ?? deposit?.id, + status: reservation.status ?? 0, + startDate: reservation.startDate, + endDate: reservation.endDate, + totalPrice: reservation.totalPrice ?? transaction.amount ?? 0, + depositAmount: transaction.amount ?? reservation.totalPrice ?? 0, + currencySign: currency.sign || 'ل.س', + currencyName: currency.name || '', + currencyRate: currency.rate, + _deposit: deposit, + }; + }); + + setReservations(mapped); } catch (err) { console.error(err); toast.error('فشل تحميل المدفوعات'); @@ -46,6 +237,15 @@ export default function PaymentsPage() { } }, []); + useEffect(() => { + // Admin check removed + // if (AuthService.isAdmin()) { + // router.push('/'); + // return; + // } + loadReservations(); + }, [router, loadReservations]); + const handlePayDeposit = async (reservation) => { setPayingId(reservation.id); try { @@ -59,7 +259,14 @@ export default function PaymentsPage() { } }; - const formatCurrency = (v) => (v ?? 0).toLocaleString() + ' ل.س'; + const formatCurrency = (v, sign = 'ل.س') => `${sign} ${Number(v ?? 0).toLocaleString()}`; + + const formatDate = (date) => { + if (!date) return ''; + const d = new Date(date); + if (Number.isNaN(d.getTime())) return ''; + return d.toLocaleDateString('en-GB'); + }; if (loading) { return ( @@ -81,8 +288,11 @@ export default function PaymentsPage() { {reservations.length === 0 ? ( - +

لا توجد معاملات مالية

ستظهر هنا مدفوعاتك للحجوزات

@@ -95,42 +305,73 @@ export default function PaymentsPage() { const amount = r.depositAmount || r.totalPrice || 0; return ( - -
-
-
- -
-
-

- {r.propertyAddress || r._prop?.address || `عقار #${r.propertyId || r.id}`} -

-

حجز #{r.id}

-
- {new Date(r.startDate).toLocaleDateString('ar')} - {new Date(r.endDate).toLocaleDateString('ar')} -
-
-
-
-
{formatCurrency(amount)}
+ +
+
+ #{r.reservationId || r.id} {cfg.depositPaid ? : } {cfg.label}
-
- {canPay(r.status) && ( -
- +
+
+
+ +
+
+
Reservation
+
#{r.reservationId || r.id}
+
+
+ +
+
{r.currencyName}
+
+ {formatCurrency(amount, r.currencySign)} +
+
- )} + +
+
+ + + الفترة + + + {formatDate(r.startDate)} - {formatDate(r.endDate)} + +
+ +
+ + + Reservation + + #{r.reservationId || r.id} +
+
+ + {canPay(r.status) && ( +
+ +
+ )} +
); })}