ray
65 lines
2.0 KiB
TypeScript
65 lines
2.0 KiB
TypeScript
import { X } from 'lucide-react';
|
|
import ROForm from '../ROForm';
|
|
import type { RepairOrder } from '../../types';
|
|
import type { CustomerWithVehicles } from '../../pages/Customers';
|
|
|
|
export function ROModal({
|
|
isOpen,
|
|
onClose,
|
|
onSave,
|
|
editRO,
|
|
existingRoNumbers,
|
|
settings,
|
|
customers,
|
|
}: {
|
|
isOpen: boolean;
|
|
onClose: () => void;
|
|
onSave: (data: Partial<RepairOrder>) => void;
|
|
editRO: RepairOrder | null;
|
|
existingRoNumbers: Set<string>;
|
|
settings: { taxRate: number; shopChargeRate: number; shopChargeCap: number; defaultLaborRate: number };
|
|
customers?: CustomerWithVehicles[];
|
|
}) {
|
|
if (!isOpen) return null;
|
|
|
|
const isEditing = !!editRO;
|
|
|
|
return (
|
|
<div className="fixed inset-0 z-50 flex items-start justify-center overflow-y-auto bg-black/50 p-4 pt-10">
|
|
<div className="w-full max-w-3xl rounded-2xl bg-white shadow-2xl dark:bg-gray-900">
|
|
{/* Header */}
|
|
<div className="flex items-center justify-between border-b border-gray-200 px-6 py-4 dark:border-gray-700">
|
|
<div>
|
|
<h2 className="text-lg font-semibold text-gray-900 dark:text-white">
|
|
{isEditing ? 'Edit Repair Order' : 'Create Repair Order'}
|
|
</h2>
|
|
<p className="text-sm text-gray-500 dark:text-gray-400">
|
|
{isEditing
|
|
? `Editing RO #${editRO?.roNumber || ''}`
|
|
: 'Enter customer and vehicle information'}
|
|
</p>
|
|
</div>
|
|
<button
|
|
onClick={onClose}
|
|
className="rounded-lg p-2 text-gray-400 hover:bg-gray-100 hover:text-gray-600 dark:hover:bg-gray-800 dark:hover:text-gray-300"
|
|
>
|
|
<X className="h-5 w-5" />
|
|
</button>
|
|
</div>
|
|
|
|
{/* Body */}
|
|
<div className="px-6 py-5">
|
|
<ROForm
|
|
editRO={editRO}
|
|
existingRoNumbers={existingRoNumbers}
|
|
settings={settings}
|
|
customers={customers}
|
|
onSave={(data) => { onSave(data); onClose(); }}
|
|
onCancel={onClose}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|