danak/shop-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

withdraw request

Browse Source
This commit is contained in:
hamid zarghami
2025-10-11 15:13:39 +03:30
parent ec4fe28289
commit c11c331fb9
9 changed files with 426 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/seller/components/WithdrawalRequestModal.tsx
+183
View File
@@ -0,0 +1,183 @@
import { type FC } from 'react'
import DefaulModal from '../../../components/DefaulModal'
import { Calendar, Call, Card, User as UserIcon, Shop, Money } from 'iconsax-react'
import type { WithdrawalRequestData } from '../WithdrawalRequest'
interface Props {
open: boolean
close: () => void
request: WithdrawalRequestData | null
}
const WithdrawalRequestModal: FC<Props> = ({ open, close, request }) => {
const formatCurrency = (amount: number) => {
return new Intl.NumberFormat('fa-IR', {
style: 'currency',
currency: 'IRR',
minimumFractionDigits: 0,
}).format(amount);
};
const formatDate = (dateString: string) => {
return new Date(dateString).toLocaleDateString('fa-IR');
};
const getStatusText = (status: string) => {
switch (status) {
case 'Approved': return 'تایید شده';
case 'Pending': return 'در انتظار';
default: return status;
}
};
const getStatusColor = (status: string) => {
switch (status) {
case 'Approved': return 'text-green-600';
case 'Pending': return 'text-yellow-600';
default: return 'text-gray-600';
}
};
if (!request) return null;
return (
<DefaulModal
open={open}
close={close}
isHeader={true}
title_header="جزئیات درخواست برداشت"
width={700}
>
<div className="p-4 space-y-6">
{/* Seller Information */}
<div className="border-b pb-4">
<h3 className="text-lg font-semibold mb-4 flex items-center gap-2">
<UserIcon size={20} />
اطلاعات فروشنده
</h3>
<div className="grid grid-cols-2 gap-4">
<div className="flex items-center gap-2">
<UserIcon size={16} className="text-gray-500" />
<div>
<span className="text-sm text-gray-500">نام و نام خانوادگی:</span>
<p className="font-medium">{request.wallet?.seller?.fullName || '-'}</p>
</div>
</div>
<div className="flex items-center gap-2">
<Card size={16} className="text-gray-500" />
<div>
<span className="text-sm text-gray-500">ایمیل:</span>
<p className="font-medium">{request.wallet?.seller?.email || '-'}</p>
</div>
</div>
<div className="flex items-center gap-2">
<Call size={16} className="text-gray-500" />
<div>
<span className="text-sm text-gray-500">شماره تلفن:</span>
<p className="font-medium">{request.wallet?.seller?.phoneNumber}</p>
</div>
</div>
<div className="flex items-center gap-2">
<Calendar size={16} className="text-gray-500" />
<div>
<span className="text-sm text-gray-500">تاریخ تولد:</span>
<p className="font-medium">
{request.wallet?.seller?.dateOfBirth ? formatDate(request.wallet.seller.dateOfBirth) : '-'}
</p>
</div>
</div>
<div className="flex items-center gap-2">
<Shop size={16} className="text-gray-500" />
<div>
<span className="text-sm text-gray-500">نوع کسب‌وکار:</span>
<p className="font-medium">{request.wallet?.seller?.businessType || '-'}</p>
</div>
</div>
<div className="flex items-center gap-2">
<div className="w-4 h-4 rounded-full bg-gray-400"></div>
<div>
<span className="text-sm text-gray-500">وضعیت حساب:</span>
<p className={`font-medium ${getStatusColor(request.wallet?.seller?.accountStatus || '')}`}>
{getStatusText(request.wallet?.seller?.accountStatus || '')}
</p>
</div>
</div>
</div>
</div>
{/* Wallet Information */}
<div className="border-b pb-4">
<h3 className="text-lg font-semibold mb-4 flex items-center gap-2">
<Money size={20} />
اطلاعات کیف پول
</h3>
<div className="grid grid-cols-2 gap-4">
<div className="flex items-center gap-2">
<Money size={16} className="text-gray-500" />
<div>
<span className="text-sm text-gray-500">موجودی:</span>
<p className="font-medium text-green-600">{formatCurrency(request.wallet?.balance || 0)}</p>
</div>
</div>
<div className="flex items-center gap-2">
<Calendar size={16} className="text-gray-500" />
<div>
<span className="text-sm text-gray-500">تاریخ ایجاد کیف پول:</span>
<p className="font-medium">{formatDate(request.wallet?.createdAt || '')}</p>
</div>
</div>
<div className="flex items-center gap-2 col-span-2">
<Calendar size={16} className="text-gray-500" />
<div>
<span className="text-sm text-gray-500">آخرین بروزرسانی:</span>
<p className="font-medium">{formatDate(request.wallet?.updatedAt || '')}</p>
</div>
</div>
</div>
</div>
{/* Additional Information */}
<div>
<h3 className="text-lg font-semibold mb-4">اطلاعات تکمیلی</h3>
<div className="grid grid-cols-2 gap-4">
<div>
<span className="text-sm text-gray-500">تاریخ عضویت:</span>
<p className="font-medium">
{request.wallet?.seller?.createdAt ? formatDate(request.wallet.seller.createdAt) : '-'}
</p>
</div>
<div>
<span className="text-sm text-gray-500">وضعیت تکمیل ثبت‌نام:</span>
<p className={`font-medium ${request.wallet?.seller?.isRegisterCompleted ? 'text-green-600' : 'text-red-600'}`}>
{request.wallet?.seller?.isRegisterCompleted ? 'تکمیل شده' : 'ناتمام'}
</p>
</div>
<div>
<span className="text-sm text-gray-500">فروشنده عمده:</span>
<p className={`font-medium ${request.wallet?.seller?.isWholesaler ? 'text-blue-600' : 'text-gray-600'}`}>
{request.wallet?.seller?.isWholesaler ? 'بله' : 'خیر'}
</p>
</div>
<div>
<span className="text-sm text-gray-500">تعداد درخواست‌های برداشت:</span>
<p className="font-medium">{request.withdrawals?.length || 0}</p>
</div>
</div>
</div>
</div>
</DefaulModal>
)
}
export default WithdrawalRequestModal