fix - ui updated - headers added

This commit is contained in:
2026-01-19 02:33:38 +05:30
parent fd6d55be18
commit f88a5bf7ec

View File

@@ -389,6 +389,17 @@ export function AppointmentProceduresDialog({
</div> </div>
<div className="border rounded-lg divide-y bg-white"> <div className="border rounded-lg divide-y bg-white">
{/* ===== TABLE HEADER ===== */}
<div className="grid grid-cols-[90px_1fr_90px_80px_80px_72px_72px] gap-2 px-3 py-2 text-xs font-semibold text-muted-foreground bg-muted/40">
<div>Code</div>
<div>Label</div>
<div>Fee</div>
<div>Tooth</div>
<div>Surface</div>
<div className="text-center">Edit</div>
<div className="text-center">Delete</div>
</div>
{isLoading && ( {isLoading && (
<div className="p-4 text-sm text-muted-foreground"> <div className="p-4 text-sm text-muted-foreground">
Loading... Loading...
@@ -404,7 +415,7 @@ export function AppointmentProceduresDialog({
{procedures.map((p) => ( {procedures.map((p) => (
<div <div
key={p.id} key={p.id}
className="flex items-center gap-2 p-3 text-sm hover:bg-muted/40 transition" className="grid grid-cols-[90px_1fr_90px_80px_80px_72px_72px] gap-2 px-3 py-3 text-sm hover:bg-muted/40 transition"
> >
{editingId === p.id ? ( {editingId === p.id ? (
<> <>
@@ -460,18 +471,21 @@ export function AppointmentProceduresDialog({
}) })
} }
/> />
<div className="flex justify-center">
<Button
size="icon"
variant="ghost"
onClick={() => updateMutation.mutate()}
>
<Save className="h-4 w-4" />
</Button>
</div>
<Button <div className="flex justify-center">
size="icon" <Button size="icon" variant="ghost" onClick={cancelEdit}>
variant="ghost" <X className="h-4 w-4" />
onClick={() => updateMutation.mutate()} </Button>
> </div>
<Save className="h-4 w-4" />
</Button>
<Button size="icon" variant="ghost" onClick={cancelEdit}>
<X className="h-4 w-4" />
</Button>
</> </>
) : ( ) : (
<> <>
@@ -490,21 +504,25 @@ export function AppointmentProceduresDialog({
<div className="w-[80px]">{p.toothNumber}</div> <div className="w-[80px]">{p.toothNumber}</div>
<div className="w-[80px]">{p.toothSurface}</div> <div className="w-[80px]">{p.toothSurface}</div>
<Button <div className="flex justify-center">
size="icon" <Button
variant="ghost" size="icon"
onClick={() => startEdit(p)} variant="ghost"
> onClick={() => startEdit(p)}
Edit >
</Button> Edit
</Button>
</div>
<Button <div className="flex justify-center">
size="icon" <Button
variant="ghost" size="icon"
onClick={() => deleteMutation.mutate(p.id!)} variant="ghost"
> onClick={() => deleteMutation.mutate(p.id!)}
<Trash2 className="h-4 w-4 text-red-500" /> >
</Button> <Trash2 className="h-4 w-4 text-red-500" />
</Button>
</div>
</> </>
)} )}
</div> </div>