yazan/car_mms
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

demo2

Browse Source
This commit is contained in:
yznahmad
2026-03-08 14:27:16 +03:00
parent 66c151653e
commit 11b58b68c3
22 changed files with 4652 additions and 204 deletions
Download Patch File Download Diff File Expand all files Collapse all files

129
app/components/maintenance-visits/MaintenanceVisitList.tsx
View File

@@ -214,11 +214,130 @@ export function MaintenanceVisitList({
</p>
</div>
) : (
<DataTable
data={visits}
columns={columns}
emptyMessage="لم يتم العثور على أي زيارات صيانة"
/>
<>
{/* Desktop Table View */}
<div className="hidden lg:block">
<DataTable
data={visits}
columns={columns}
emptyMessage="لم يتم العثور على أي زيارات صيانة"
/>
</div>
{/* Mobile Card View */}
<div className="lg:hidden divide-y divide-gray-200">
{visits.map((visit) => {
let jobs;
try {
jobs = JSON.parse(visit.maintenanceJobs);
} catch {
jobs = [];
}
return (
<div key={visit.id} className="p-4 hover:bg-gray-50">
<div className="space-y-3">
<div className="flex justify-between items-start">
<div className="flex-1">
<Text weight="medium" className="text-gray-900">
{formatDate(visit.visitDate)}
</Text>
<Text size="sm" color="secondary">
{formatDateTime(visit.visitDate).split(' ')[1]}
</Text>
</div>
<span className={`inline-flex px-2 py-1 text-xs font-medium rounded-full ${getPaymentStatusColor(visit.paymentStatus)}`}>
{PAYMENT_STATUS_NAMES[visit.paymentStatus as keyof typeof PAYMENT_STATUS_NAMES]}
</span>
</div>
<div className="space-y-2">
<div>
<Text size="sm" color="secondary">المركبة</Text>
<Text weight="medium">{visit.vehicle.plateNumber}</Text>
<Text size="sm" color="secondary">
{visit.vehicle.manufacturer} {visit.vehicle.model} ({visit.vehicle.year})
</Text>
</div>
<div>
<Text size="sm" color="secondary">العميل</Text>
<Text weight="medium">{visit.customer.name}</Text>
{visit.customer.phone && (
<Text size="sm" color="secondary">{visit.customer.phone}</Text>
)}
</div>
<div>
<Text size="sm" color="secondary">أعمال الصيانة</Text>
<Text weight="medium">
{jobs.length > 1 ? `${jobs.length} أعمال صيانة` : jobs[0]?.job || 'غير محدد'}
</Text>
{visit.description && (
<Text size="sm" color="secondary" className="line-clamp-2">
{visit.description}
</Text>
)}
</div>
<div className="grid grid-cols-2 gap-2">
<div>
<Text size="sm" color="secondary">التكلفة</Text>
<Text weight="medium" className="font-mono">
{formatCurrency(visit.cost)}
</Text>
</div>
<div>
<Text size="sm" color="secondary">الكيلومترات</Text>
<Text className="font-mono">
{formatNumber(visit.kilometers)} كم
</Text>
</div>
</div>
</div>
<div className="flex gap-2 pt-2">
{onView ? (
<Button
size="sm"
variant="outline"
onClick={() => onView(visit)}
className="flex-1"
>
عرض
</Button>
) : (
<Link to={`/maintenance-visits/${visit.id}`} className="flex-1">
<Button size="sm" variant="outline" className="w-full">
عرض
</Button>
</Link>
)}
{onEdit && (
<Button
size="sm"
variant="outline"
onClick={() => onEdit(visit)}
className="flex-1"
>
تعديل
</Button>
)}
<Button
size="sm"
variant="outline"
className="text-red-600 border-red-300 hover:bg-red-50 flex-1"
onClick={() => handleDelete(visit.id)}
>
حذف
</Button>
</div>
</div>
</div>
);
})}
</div>
</>
)}
</div>