import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout'; import { Head, useForm, router } from '@inertiajs/react'; import { formatCurrency } from '@/lib/utils'; import { Plus, Trash2, Search } from 'lucide-react'; import { Button } from '@/Components/ui/button'; import { useState } from 'react'; export default function CatalogueIndex({ items }: any) { const { data, setData, get } = useForm({ search: new URLSearchParams(window.location.search).get('search')??'' }); const [adding, setAdding] = useState(false); const { data: form, setData: setForm, post, processing, reset } = useForm({ description:'', sku:'', unit:'', unit_price:'0', notes:'' }); const submit = (e: React.FormEvent) => { e.preventDefault(); post('/catalogue', { onSuccess: () => { reset(); setAdding(false); } }); }; const search = (e: React.FormEvent) => { e.preventDefault(); get('/catalogue'); }; return (
setData('search',e.target.value)} placeholder="Search items..." className="border rounded-md px-3 py-2 text-sm flex-1 focus:outline-none focus:ring-2 focus:ring-primary/30"/>
{adding && (
setForm('description',e.target.value)} required className="w-full border rounded px-2 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-primary/30"/>
setForm('sku',e.target.value)} className="w-full border rounded px-2 py-1.5 text-sm focus:outline-none"/>
setForm('unit',e.target.value)} className="w-full border rounded px-2 py-1.5 text-sm focus:outline-none"/>
setForm('unit_price',e.target.value)} className="w-full border rounded px-2 py-1.5 text-sm focus:outline-none"/>
)}
{items.data.map((i:any)=>( ))}
DescriptionSKUUnitUnit Price
{i.description} {i.sku??'—'} {i.unit??'—'} {formatCurrency(i.unit_price)}
{items.data.length===0&&

No items in catalogue yet.

}
); }