'use client'; import React from 'react'; import type { ReportExportState, ReportExportHandlers } from '@/backend/hooks/useReportExport'; import type { ReportType, DeliveryOrderStatus } from '@/backend/actions/ReportExport'; import { Button } from "@/components/ui/button"; import { Input } from "@/components/ui/input"; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"; import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table"; import { ToggleGroup, ToggleGroupItem } from "@/components/ui/toggle-group"; import { Card, CardContent } from "@/components/ui/card"; import { FileSpreadsheet, FileText, LayoutDashboard, Loader2, SearchX, CalendarDays, MapPin, User, Filter } from "lucide-react"; import { cn } from "@/lib/utils"; const formatCurrency = (amount: number) => new Intl.NumberFormat('ar-IQ', { style: 'currency', currency: 'IQD', maximumFractionDigits: 0 }).format(amount); type OrderPreviewItem = NonNullable[number] & { totalAmount: number; }; interface Props { state: ReportExportState; handlers: ReportExportHandlers; } export const ReportExportView = ({ state, handlers }: Props) => { return
{/* HEADER SECTION */}

تصدير التقارير

إدارة وتحميل تقارير العمليات اللوجستية بدقة عالية

{/* REPORT TYPE SELECTOR */}
val && handlers.setReportType(val as ReportType)} className="flex gap-1" data-api-unique-id='reportexportview-rac3207bb7b100aea-s1514308204' data-api-unique-page-name='src/backend/components/ReportExportView'> {state.REPORT_TYPE_LABELS['ORDERS']} {state.REPORT_TYPE_LABELS['DRIVERS']} {state.REPORT_TYPE_LABELS['GOVERNORATES']}
{/* FILTERS MODULE */}
تخصيص البيانات
{/* Start Date */}
handlers.setStartDate(e.target.value)} className="h-11 bg-input px-4 focus:ring-primary/50" data-api-unique-id='reportexportview-r36a7f56ab29c7105-s1514308204' data-api-unique-page-name='src/backend/components/ReportExportView' />
{/* End Date */}
handlers.setEndDate(e.target.value)} className="h-11 bg-input px-4 focus:ring-primary/50" data-api-unique-id='reportexportview-rf04185c30be47af8-s1514308204' data-api-unique-page-name='src/backend/components/ReportExportView' />
{/* Governorate */}
handlers.handleGovChange(e.target.value)} onCompositionStart={handlers.handleGovCompositionStart} onCompositionEnd={handlers.handleGovCompositionEnd} placeholder="بحث باسم المحافظة" className="h-11 bg-input px-4 focus:ring-primary/50" data-api-unique-id='reportexportview-r0012684be2694ba0-s1514308204' data-api-unique-page-name='src/backend/components/ReportExportView' />
{/* Driver */}
handlers.handleDriverChange(e.target.value)} onCompositionStart={handlers.handleDriverCompositionStart} onCompositionEnd={handlers.handleDriverCompositionEnd} placeholder="بحث باسم السائق" className="h-11 bg-input px-4 focus:ring-primary/50" data-api-unique-id='reportexportview-rb572fa36874d4e14-s1514308204' data-api-unique-page-name='src/backend/components/ReportExportView' />
{/* Order Status */}
{/* PREVIEW DISPLAY */}

معاينة البيانات

يعرض أول 50 سجلاً فقط
{state.isLoading ?

جاري استرجاع البيانات المحدثة...

: !state.hasData ?

لا توجد نتائج مطابقة

جرب تغيير مرشحات البحث للحصول على بيانات

:
{state.reportType === 'ORDERS' && رقم الطلب المحافظة اسم العميل اسم السائق المبلغ الكلي الحالة تاريخ الإنشاء {state.reportData.orders?.slice(0, 50).map(order => { const orderItem = order as OrderPreviewItem; return {orderItem.order_no} {orderItem.governorate_name} {orderItem.customer_name} {orderItem.driver_name} {formatCurrency(orderItem.totalAmount)} {state.STATUS_LABELS[orderItem.status]} {new Date(orderItem.created_at).toLocaleDateString('ar-IQ')} ; })}
} {state.reportType === 'DRIVERS' && اسم السائق إجمالي الطلبات قيد الانتظار تم التوصيل {state.reportData.drivers?.map((driver, index) => {driver.driver_name} {driver.total_orders} {driver.pending_orders} {driver.delivered_orders} )}
} {state.reportType === 'GOVERNORATES' && المحافظة إجمالي الطلبات قيد الانتظار تم التوصيل {state.reportData.governorates?.map((gov, index) => {gov.governorate_name} {gov.total_orders} {gov.pending_orders} {gov.delivered_orders} )}
}
}
{/* FINAL ACTIONS BAR */}
هل أنت جاهز؟ سيتم تصدير كافة السجلات بناءً على الفلاتر المختارة
{/* FOOTER SPACE */}
; };