141 lines
4.7 KiB
TypeScript
141 lines
4.7 KiB
TypeScript
import type { DoctorListResData } from "@/features/doctors/lib/data";
|
|
import formatPhone from "@/shared/lib/formatPhone";
|
|
import { Badge } from "@/shared/ui/badge";
|
|
import { Button } from "@/shared/ui/button";
|
|
import {
|
|
Table,
|
|
TableBody,
|
|
TableCell,
|
|
TableHead,
|
|
TableHeader,
|
|
TableRow,
|
|
} from "@/shared/ui/table";
|
|
import { Eye, Loader2, Pencil, Trash2 } from "lucide-react";
|
|
import type { Dispatch, SetStateAction } from "react";
|
|
|
|
interface Props {
|
|
setDetail: Dispatch<SetStateAction<DoctorListResData | null>>;
|
|
setEditingPlan: Dispatch<SetStateAction<DoctorListResData | null>>;
|
|
setDialogOpen: Dispatch<SetStateAction<boolean>>;
|
|
setDetailDialog: Dispatch<SetStateAction<boolean>>;
|
|
doctor: DoctorListResData[] | [];
|
|
isLoading: boolean;
|
|
isError: boolean;
|
|
isFetching: boolean;
|
|
handleDelete: (user: DoctorListResData) => void;
|
|
}
|
|
|
|
const TableDoctor = ({
|
|
doctor,
|
|
setDetail,
|
|
setDetailDialog,
|
|
isError,
|
|
setEditingPlan,
|
|
isLoading,
|
|
setDialogOpen,
|
|
handleDelete,
|
|
isFetching,
|
|
}: Props) => {
|
|
return (
|
|
<div className="flex-1 overflow-auto">
|
|
{(isLoading || isFetching) && (
|
|
<div className="h-full flex items-center justify-center bg-white/70 z-10">
|
|
<span className="text-lg font-medium">
|
|
<Loader2 className="animate-spin" />
|
|
</span>
|
|
</div>
|
|
)}
|
|
|
|
{isError && (
|
|
<div className="h-full flex items-center justify-center z-10">
|
|
<span className="text-lg font-medium text-red-600">
|
|
Ma'lumotlarni olishda xatolik yuz berdi.
|
|
</span>
|
|
</div>
|
|
)}
|
|
|
|
{!isLoading && !isError && (
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>#</TableHead>
|
|
<TableHead>Shifokor Ism Familiyasi</TableHead>
|
|
<TableHead>Telefon raqami</TableHead>
|
|
<TableHead>Tuman</TableHead>
|
|
<TableHead>Obyekt</TableHead>
|
|
<TableHead>Ish joyi</TableHead>
|
|
<TableHead>Sohasi</TableHead>
|
|
<TableHead>Kim qo'shgan</TableHead>
|
|
<TableHead className="text-right">Amallar</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
{doctor.length > 0 ? (
|
|
doctor.map((item, index) => (
|
|
<TableRow key={item.id}>
|
|
<TableCell>{index + 1}</TableCell>
|
|
<TableCell className="font-medium">
|
|
{item.first_name} {item.last_name}
|
|
</TableCell>
|
|
<TableCell className="font-medium">
|
|
{formatPhone(item.phone_number)}
|
|
</TableCell>
|
|
<TableCell>
|
|
<Badge variant="outline">{item.district.name}</Badge>
|
|
</TableCell>
|
|
<TableCell>{item.place.name}</TableCell>
|
|
<TableCell>{item.work_place}</TableCell>
|
|
<TableCell>{item.sphere}</TableCell>
|
|
<TableCell>
|
|
{item.user.first_name} {item.user.last_name}
|
|
</TableCell>
|
|
<TableCell className="text-right flex gap-2 justify-end">
|
|
<Button
|
|
variant="outline"
|
|
size="icon"
|
|
onClick={() => {
|
|
setDetail(item);
|
|
setDetailDialog(true);
|
|
}}
|
|
className="bg-green-600 text-white cursor-pointer hover:bg-green-600 hover:text-white"
|
|
>
|
|
<Eye size={18} />
|
|
</Button>
|
|
<Button
|
|
variant="outline"
|
|
size="icon"
|
|
className="bg-blue-600 text-white cursor-pointer hover:bg-blue-600 hover:text-white"
|
|
onClick={() => {
|
|
setEditingPlan(item);
|
|
setDialogOpen(true);
|
|
}}
|
|
>
|
|
<Pencil size={18} />
|
|
</Button>
|
|
<Button
|
|
variant="destructive"
|
|
size="icon"
|
|
className="cursor-pointer"
|
|
onClick={() => handleDelete(item)}
|
|
>
|
|
<Trash2 size={18} />
|
|
</Button>
|
|
</TableCell>
|
|
</TableRow>
|
|
))
|
|
) : (
|
|
<TableRow>
|
|
<TableCell colSpan={9} className="text-center py-4 text-lg">
|
|
Shifokor topilmadi.
|
|
</TableCell>
|
|
</TableRow>
|
|
)}
|
|
</TableBody>
|
|
</Table>
|
|
)}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default TableDoctor;
|