Fix: Botones con iconos en formulario y listado de Áreas

This commit is contained in:
Santiago Lavaise
2026-04-13 11:17:09 -03:00
parent a707f78c19
commit ef6a67a802
+15 -11
View File
@@ -1,5 +1,5 @@
import { useState } from 'react';
import { Bed, CheckCircle2, Clock, Wrench, User, Plus, Trash, Edit2 } from 'lucide-react';
import { Bed, CheckCircle2, Clock, Wrench, User, Plus, Trash, Edit2, Save, X } from 'lucide-react';
import { Card, CardContent } from '@/components/ui/card';
import { Badge } from '@/components/ui/badge';
import { Button } from '@/components/ui/button';
@@ -500,17 +500,21 @@ export function MapaCamas({
</div>
<div className="flex gap-2 justify-end">
{editingAreaId && (
<Button variant="destructive" onClick={() => { if (confirm('Eliminar área?')) { onEliminarArea(editingAreaId); setAreaDialogOpen(false); } }}>
Eliminar
<Button size="sm" variant="destructive" onClick={() => { if (confirm('Eliminar área?')) { onEliminarArea(editingAreaId); setAreaDialogOpen(false); } }}>
<Trash className="h-4 w-4" />
</Button>
)}
<Button onClick={() => setAreaDialogOpen(false)}>Cancelar</Button>
<Button onClick={() => {
<Button size="sm" variant="outline" onClick={() => setAreaDialogOpen(false)}>
<X className="h-4 w-4" />
</Button>
<Button size="sm" onClick={() => {
if (!areaNombre.trim()) return alert('Nombre requerido');
if (editingAreaId) onActualizarArea(editingAreaId, { nombre: areaNombre });
else onAgregarArea({ nombre: areaNombre });
setAreaDialogOpen(false);
}}>Guardar</Button>
}}>
<Save className="h-4 w-4" />
</Button>
</div>
<div>
<p className="text-sm font-medium">Áreas existentes</p>
@@ -518,12 +522,12 @@ export function MapaCamas({
{areas.map(a => (
<div key={a.id} className="flex items-center justify-between">
<div>{a.nombre}</div>
<div className="flex gap-2">
<Button variant="ghost" onClick={() => { setEditingAreaId(a.id); setAreaNombre(a.nombre); }}>
Editar
<div className="flex gap-1">
<Button size="sm" variant="ghost" onClick={() => { setEditingAreaId(a.id); setAreaNombre(a.nombre); }}>
<Edit2 className="h-4 w-4" />
</Button>
<Button variant="destructive" onClick={() => { if (confirm('Eliminar área?')) onEliminarArea(a.id); }}>
Eliminar
<Button size="sm" variant="ghost" className="text-red-600" onClick={() => { if (confirm('Eliminar área?')) onEliminarArea(a.id); }}>
<Trash className="h-4 w-4" />
</Button>
</div>
</div>