Edit Class Definition

Name form.setData('name', e.target.value)} className="w-full rounded border p-2" />

Class # form.setData('class_number', e.target.value)} className="w-full rounded border p-2" />

Description

form.setData('description', e.target.value)} className="w-full rounded border p-2" />
                    </div>
                    <div>
                        <label className="block text-sm font-medium">Teacher</label>
                        <select 
                            value={form.data.teacher_id} 
                            onChange={(e) => form.setData('teacher_id', e.target.value)} 
                            className="w-full rounded border p-2"
                        >
                            <option value="">-- Select Teacher --</option>
                            {teachers.map((teacher) => (
                                <option key={teacher.id} value={teacher.id}>
                                    {teacher.last_name}, {teacher.first_name}
                                </option>
                            ))}
                        </select>
                    </div>
                    <div>
                        <label className="block text-sm font-medium">Capacity</label>
                        <input type="number" value={form.data.capacity} onChange={(e) => form.setData('capacity', e.target.value)} className="w-full rounded border p-2" />
                    </div>
                    <div className="flex gap-2">
                        <div className="flex-1">
                            <label className="block text-sm font-medium">Start Date</label>
                            <input type="date" value={form.data.start_date} onChange={(e) => form.setData('start_date', e.target.value)} className="w-full rounded border p-2" />
                        </div>
                        <div className="flex-1">
                            <label className="block text-sm font-medium">End Date</label>
                            <input type="date" value={form.data.end_date} onChange={(e) => form.setData('end_date', e.target.value)} className="w-full rounded border p-2" />
                        </div>
                    </div>
                    <div>
                        <label className="block text-sm font-medium">Location</label>
                        <input value={form.data.location} onChange={(e) => form.setData('location', e.target.value)} className="w-full rounded border p-2" />
                    </div>
                    <div>
                        <label className="block text-sm font-medium">Fee</label>
                        <input type="number" step="0.01" value={form.data.fee} onChange={(e) => form.setData('fee', e.target.value)} className="w-full rounded border p-2" />
                    </div>
                    <div className="flex gap-2 justify-end">
                        <Link href={`/admin/school/class-definitions/${item.id}`}>
                            <Button type="button" variant="outline">Cancel</Button>
                        </Link>
                        <Button type="submit" disabled={form.processing}>Update Class</Button>
                    </div>
                </form>
            </div>
        </AppLayout>
    );
}