doctor list
This commit is contained in:
@@ -44,7 +44,6 @@ const AuthLogin = () => {
|
|||||||
navigate("dashboard");
|
navigate("dashboard");
|
||||||
},
|
},
|
||||||
onError: (err: AxiosError) => {
|
onError: (err: AxiosError) => {
|
||||||
console.log(err);
|
|
||||||
const errMessage = err.response?.data as { message: string };
|
const errMessage = err.response?.data as { message: string };
|
||||||
const messageText = errMessage.message;
|
const messageText = errMessage.message;
|
||||||
|
|
||||||
|
|||||||
@@ -40,7 +40,6 @@ const DeleteDiscrit = ({
|
|||||||
setDiscritDelete(null);
|
setDiscritDelete(null);
|
||||||
},
|
},
|
||||||
onError: (err: AxiosError) => {
|
onError: (err: AxiosError) => {
|
||||||
console.log(err);
|
|
||||||
const errMessage = err.response?.data as { message: string };
|
const errMessage = err.response?.data as { message: string };
|
||||||
const messageText = errMessage.message;
|
const messageText = errMessage.message;
|
||||||
toast.error(messageText || "Xatolik yuz berdi", {
|
toast.error(messageText || "Xatolik yuz berdi", {
|
||||||
|
|||||||
20
src/features/doctors/lib/api.ts
Normal file
20
src/features/doctors/lib/api.ts
Normal file
@@ -0,0 +1,20 @@
|
|||||||
|
import type { DoctorListRes } from "@/features/doctors/lib/data";
|
||||||
|
import httpClient from "@/shared/config/api/httpClient";
|
||||||
|
import { DOCTOR } from "@/shared/config/api/URLs";
|
||||||
|
import type { AxiosResponse } from "axios";
|
||||||
|
|
||||||
|
export const doctor_api = {
|
||||||
|
async list(params: {
|
||||||
|
limit?: number;
|
||||||
|
offset?: number;
|
||||||
|
full_name?: string;
|
||||||
|
district_name?: string;
|
||||||
|
place_name?: string;
|
||||||
|
work_place?: string;
|
||||||
|
sphere?: string;
|
||||||
|
user?: string;
|
||||||
|
}): Promise<AxiosResponse<DoctorListRes>> {
|
||||||
|
const res = await httpClient.get(`${DOCTOR}list/`, { params });
|
||||||
|
return res;
|
||||||
|
},
|
||||||
|
};
|
||||||
@@ -50,3 +50,45 @@ export const doctorListData: DoctorListType[] = [
|
|||||||
long: ObjectListData[1].long,
|
long: ObjectListData[1].long,
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
|
export interface DoctorListRes {
|
||||||
|
status_code: number;
|
||||||
|
status: string;
|
||||||
|
message: string;
|
||||||
|
data: {
|
||||||
|
count: number;
|
||||||
|
next: string;
|
||||||
|
previous: string;
|
||||||
|
results: DoctorListResData[];
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface DoctorListResData {
|
||||||
|
id: number;
|
||||||
|
first_name: string;
|
||||||
|
last_name: string;
|
||||||
|
phone_number: string;
|
||||||
|
work_place: string;
|
||||||
|
sphere: string;
|
||||||
|
description: string;
|
||||||
|
district: {
|
||||||
|
id: number;
|
||||||
|
name: string;
|
||||||
|
};
|
||||||
|
place: {
|
||||||
|
id: number;
|
||||||
|
name: string;
|
||||||
|
};
|
||||||
|
user: {
|
||||||
|
id: number;
|
||||||
|
first_name: string;
|
||||||
|
last_name: string;
|
||||||
|
};
|
||||||
|
longitude: number;
|
||||||
|
latitude: number;
|
||||||
|
extra_location: {
|
||||||
|
latitude: number;
|
||||||
|
longitude: number;
|
||||||
|
};
|
||||||
|
created_at: string;
|
||||||
|
}
|
||||||
|
|||||||
@@ -32,10 +32,9 @@ import type z from "zod";
|
|||||||
interface Props {
|
interface Props {
|
||||||
initialValues: DoctorListType | null;
|
initialValues: DoctorListType | null;
|
||||||
setDialogOpen: Dispatch<SetStateAction<boolean>>;
|
setDialogOpen: Dispatch<SetStateAction<boolean>>;
|
||||||
setData: Dispatch<SetStateAction<DoctorListType[]>>;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const AddedDoctor = ({ initialValues, setData, setDialogOpen }: Props) => {
|
const AddedDoctor = ({ initialValues, setDialogOpen }: Props) => {
|
||||||
const [load, setLoad] = useState<boolean>(false);
|
const [load, setLoad] = useState<boolean>(false);
|
||||||
const form = useForm<z.infer<typeof DoctorForm>>({
|
const form = useForm<z.infer<typeof DoctorForm>>({
|
||||||
resolver: zodResolver(DoctorForm),
|
resolver: zodResolver(DoctorForm),
|
||||||
@@ -65,34 +64,8 @@ const AddedDoctor = ({ initialValues, setData, setDialogOpen }: Props) => {
|
|||||||
|
|
||||||
function onSubmit(values: z.infer<typeof DoctorForm>) {
|
function onSubmit(values: z.infer<typeof DoctorForm>) {
|
||||||
setLoad(true);
|
setLoad(true);
|
||||||
const newObject: DoctorListType = {
|
console.log(values);
|
||||||
id: initialValues ? initialValues.id : Date.now(),
|
|
||||||
user: FakeUserList.find((u) => u.id === Number(values.user))!,
|
|
||||||
district: fakeDistrict.find((d) => d.id === Number(values.district))!,
|
|
||||||
desc: values.desc,
|
|
||||||
first_name: values.first_name,
|
|
||||||
last_name: values.last_name,
|
|
||||||
lat: values.lat,
|
|
||||||
long: values.long,
|
|
||||||
object: ObjectListData.find((d) => d.id === Number(values.object))!,
|
|
||||||
phone_number: values.phone_number,
|
|
||||||
spec: values.spec,
|
|
||||||
work: values.work,
|
|
||||||
};
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
setData((prev) => {
|
|
||||||
if (initialValues) {
|
|
||||||
return prev.map((item) =>
|
|
||||||
item.id === initialValues.id ? newObject : item,
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
return [...prev, newObject];
|
|
||||||
}
|
|
||||||
});
|
|
||||||
setLoad(false);
|
|
||||||
setDialogOpen(false);
|
setDialogOpen(false);
|
||||||
}, 2000);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
import type { DoctorListType } from "@/features/doctors/lib/data";
|
import type { DoctorListResData } from "@/features/doctors/lib/data";
|
||||||
import formatPhone from "@/shared/lib/formatPhone";
|
import formatPhone from "@/shared/lib/formatPhone";
|
||||||
import { Button } from "@/shared/ui/button";
|
import { Button } from "@/shared/ui/button";
|
||||||
import {
|
import {
|
||||||
@@ -8,15 +8,88 @@ import {
|
|||||||
DialogHeader,
|
DialogHeader,
|
||||||
DialogTitle,
|
DialogTitle,
|
||||||
} from "@/shared/ui/dialog";
|
} from "@/shared/ui/dialog";
|
||||||
import { Circle, Map, Placemark, YMaps } from "@pbe/react-yandex-maps";
|
import {
|
||||||
|
Circle,
|
||||||
|
Map,
|
||||||
|
Placemark,
|
||||||
|
Polygon,
|
||||||
|
YMaps,
|
||||||
|
ZoomControl,
|
||||||
|
} from "@pbe/react-yandex-maps";
|
||||||
|
import { useEffect, useState } from "react";
|
||||||
|
|
||||||
|
interface CoordsData {
|
||||||
|
lat: number;
|
||||||
|
lon: number;
|
||||||
|
polygon: [number, number][][];
|
||||||
|
}
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
detail: boolean;
|
detail: boolean;
|
||||||
setDetail: (open: boolean) => void;
|
setDetail: (open: boolean) => void;
|
||||||
object: DoctorListType | null;
|
object: DoctorListResData | null;
|
||||||
}
|
}
|
||||||
|
|
||||||
const DoctorDetailDialog = ({ detail, setDetail, object }: Props) => {
|
const DoctorDetailDialog = ({ detail, setDetail, object }: Props) => {
|
||||||
|
const [coords, setCoords] = useState<[number, number]>([
|
||||||
|
41.311081, 69.240562,
|
||||||
|
]);
|
||||||
|
|
||||||
|
const [polygonCoords, setPolygonCoords] = useState<[number, number][][]>([]);
|
||||||
|
|
||||||
|
const [circleCoords] = useState<[number, number] | null>(null);
|
||||||
|
|
||||||
|
const getCoords = async (name: string): Promise<CoordsData | null> => {
|
||||||
|
try {
|
||||||
|
const res = await fetch(
|
||||||
|
`https://nominatim.openstreetmap.org/search?q=${encodeURIComponent(
|
||||||
|
name,
|
||||||
|
)}&format=json&polygon_geojson=1&limit=1`,
|
||||||
|
);
|
||||||
|
const data = await res.json();
|
||||||
|
|
||||||
|
if (!data.length || !data[0].geojson) return null;
|
||||||
|
|
||||||
|
const lat = parseFloat(data[0].lat);
|
||||||
|
const lon = parseFloat(data[0].lon);
|
||||||
|
|
||||||
|
let polygon: [number, number][][] = [];
|
||||||
|
|
||||||
|
if (data[0].geojson.type === "Polygon") {
|
||||||
|
polygon = data[0].geojson.coordinates.map((ring: []) =>
|
||||||
|
ring.map((c) => [c[1], c[0]]),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (data[0].geojson.type === "MultiPolygon") {
|
||||||
|
polygon = data[0].geojson.coordinates[0].map((ring: []) =>
|
||||||
|
ring.map((c) => [c[1], c[0]]),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
return { lat, lon, polygon };
|
||||||
|
} catch {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (!object) return;
|
||||||
|
|
||||||
|
const load = async () => {
|
||||||
|
const district = await getCoords(object.district.name);
|
||||||
|
|
||||||
|
if (district) {
|
||||||
|
setPolygonCoords(district.polygon);
|
||||||
|
}
|
||||||
|
|
||||||
|
setCoords([object.latitude, object.longitude]);
|
||||||
|
// setCircleCoords([object.latitude, object.longitude]);
|
||||||
|
};
|
||||||
|
|
||||||
|
load();
|
||||||
|
}, [object]);
|
||||||
|
|
||||||
if (!object) return null;
|
if (!object) return null;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -28,61 +101,77 @@ const DoctorDetailDialog = ({ detail, setDetail, object }: Props) => {
|
|||||||
|
|
||||||
<div className="space-y-3 mt-2">
|
<div className="space-y-3 mt-2">
|
||||||
<p>
|
<p>
|
||||||
<span className="font-semibold">Ism Familiya:</span>{" "}
|
<span className="font-semibold">Ism:</span> {object.first_name}{" "}
|
||||||
{object.first_name} {object.last_name}
|
{object.last_name}
|
||||||
</p>
|
</p>
|
||||||
<p>
|
<p>
|
||||||
<span className="font-semibold">Telefon:</span>{" "}
|
<span className="font-semibold">Telefon:</span>{" "}
|
||||||
{formatPhone(object.phone_number)}
|
{formatPhone(object.phone_number)}
|
||||||
</p>
|
</p>
|
||||||
<p>
|
<p>
|
||||||
<span className="font-semibold">Ish joyi:</span> {object.work}
|
<span className="font-semibold">Ish joyi:</span> {object.work_place}
|
||||||
</p>
|
</p>
|
||||||
<p>
|
<p>
|
||||||
<span className="font-semibold">Mutaxassislik:</span> {object.spec}
|
<span className="font-semibold">Mutaxassislik:</span>{" "}
|
||||||
</p>
|
{object.sphere}
|
||||||
<p>
|
|
||||||
<span className="font-semibold">Tavsif:</span> {object.desc}
|
|
||||||
</p>
|
</p>
|
||||||
<p>
|
<p>
|
||||||
<span className="font-semibold">Tuman:</span> {object.district.name}
|
<span className="font-semibold">Tuman:</span> {object.district.name}
|
||||||
</p>
|
</p>
|
||||||
<p>
|
<p>
|
||||||
<span className="font-semibold">Foydalanuvchi:</span>{" "}
|
|
||||||
{object.user.firstName} {object.user.lastName}
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<span className="font-semibold">Obyekt:</span> {object.object.name}
|
|
||||||
</p>
|
|
||||||
<span className="font-semibold">Manzili:</span>
|
<span className="font-semibold">Manzili:</span>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
{/* 🗺 MAP */}
|
||||||
<div className="h-[300px] w-full border rounded-lg overflow-hidden">
|
<div className="h-[300px] w-full border rounded-lg overflow-hidden">
|
||||||
<YMaps>
|
<YMaps query={{ lang: "en_RU" }}>
|
||||||
<Map
|
<Map
|
||||||
defaultState={{
|
state={{
|
||||||
center: [Number(object.lat), Number(object.long)],
|
center: coords,
|
||||||
zoom: 16,
|
zoom: 12,
|
||||||
}}
|
}}
|
||||||
width="100%"
|
width="100%"
|
||||||
height="300px"
|
height="100%"
|
||||||
>
|
>
|
||||||
<Placemark
|
<ZoomControl
|
||||||
geometry={[Number(object.lat), Number(object.long)]}
|
options={{
|
||||||
|
position: { right: "10px", bottom: "70px" },
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
<Circle
|
|
||||||
geometry={[[Number(object.lat), Number(object.long)], 100]}
|
{/* Ish joyining markazi */}
|
||||||
|
<Placemark geometry={coords} />
|
||||||
|
|
||||||
|
{/* Tuman polygon */}
|
||||||
|
{polygonCoords.length > 0 && (
|
||||||
|
<Polygon
|
||||||
|
geometry={polygonCoords}
|
||||||
options={{
|
options={{
|
||||||
fillColor: "rgba(0, 150, 255, 0.2)",
|
fillColor: "rgba(0, 150, 255, 0.2)",
|
||||||
strokeColor: "rgba(0, 150, 255, 0.8)",
|
strokeColor: "rgba(0, 150, 255, 0.8)",
|
||||||
strokeWidth: 2,
|
strokeWidth: 2,
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{/* Radius circle (ish joyi atrofida) */}
|
||||||
|
{circleCoords && (
|
||||||
|
<Circle
|
||||||
|
geometry={[circleCoords, 500]}
|
||||||
|
options={{
|
||||||
|
fillColor: "rgba(255, 100, 0, 0.3)",
|
||||||
|
strokeColor: "rgba(255, 100, 0, 0.8)",
|
||||||
|
strokeWidth: 2,
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
</Map>
|
</Map>
|
||||||
</YMaps>
|
</YMaps>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<DialogClose asChild>
|
<DialogClose asChild>
|
||||||
<Button className="mt-4 w-full bg-blue-600 cursor-pointer hover:bg-blue-600">
|
<Button className="mt-4 w-full bg-blue-600 hover:bg-blue-600">
|
||||||
Yopish
|
Yopish
|
||||||
</Button>
|
</Button>
|
||||||
</DialogClose>
|
</DialogClose>
|
||||||
|
|||||||
@@ -1,49 +1,22 @@
|
|||||||
|
import { doctor_api } from "@/features/doctors/lib/api";
|
||||||
import {
|
import {
|
||||||
doctorListData,
|
type DoctorListResData,
|
||||||
type DoctorListType,
|
type DoctorListType,
|
||||||
} from "@/features/doctors/lib/data";
|
} from "@/features/doctors/lib/data";
|
||||||
import AddedDoctor from "@/features/doctors/ui/AddedDoctor";
|
|
||||||
import DoctorDetailDialog from "@/features/doctors/ui/DoctorDetailDialog";
|
import DoctorDetailDialog from "@/features/doctors/ui/DoctorDetailDialog";
|
||||||
import formatPhone from "@/shared/lib/formatPhone";
|
import FilterDoctor from "@/features/doctors/ui/FilterDoctor";
|
||||||
import { Badge } from "@/shared/ui/badge";
|
import PaginationDoctor from "@/features/doctors/ui/PaginationDoctor";
|
||||||
import { Button } from "@/shared/ui/button";
|
import TableDoctor from "@/features/doctors/ui/TableDoctor";
|
||||||
import {
|
import { useQuery } from "@tanstack/react-query";
|
||||||
Dialog,
|
import { useState } from "react";
|
||||||
DialogContent,
|
|
||||||
DialogHeader,
|
|
||||||
DialogTitle,
|
|
||||||
DialogTrigger,
|
|
||||||
} from "@/shared/ui/dialog";
|
|
||||||
import { Input } from "@/shared/ui/input";
|
|
||||||
import {
|
|
||||||
Table,
|
|
||||||
TableBody,
|
|
||||||
TableCell,
|
|
||||||
TableHead,
|
|
||||||
TableHeader,
|
|
||||||
TableRow,
|
|
||||||
} from "@/shared/ui/table";
|
|
||||||
import clsx from "clsx";
|
|
||||||
import {
|
|
||||||
ChevronLeft,
|
|
||||||
ChevronRight,
|
|
||||||
Eye,
|
|
||||||
Pencil,
|
|
||||||
Plus,
|
|
||||||
Trash2,
|
|
||||||
} from "lucide-react";
|
|
||||||
import { useMemo, useState } from "react";
|
|
||||||
|
|
||||||
const DoctorsList = () => {
|
const DoctorsList = () => {
|
||||||
const [data, setData] = useState<DoctorListType[]>(doctorListData);
|
const [detail, setDetail] = useState<DoctorListResData | null>(null);
|
||||||
const [detail, setDetail] = useState<DoctorListType | null>(null);
|
|
||||||
const [detailDialog, setDetailDialog] = useState<boolean>(false);
|
const [detailDialog, setDetailDialog] = useState<boolean>(false);
|
||||||
const [editingPlan, setEditingPlan] = useState<DoctorListType | null>(null);
|
const [editingPlan, setEditingPlan] = useState<DoctorListType | null>(null);
|
||||||
const [dialogOpen, setDialogOpen] = useState<boolean>(false);
|
const [dialogOpen, setDialogOpen] = useState<boolean>(false);
|
||||||
const [currentPage, setCurrentPage] = useState(1);
|
const [currentPage, setCurrentPage] = useState(1);
|
||||||
const totalPages = 5;
|
|
||||||
|
|
||||||
// Filter states
|
|
||||||
const [searchName, setSearchName] = useState("");
|
const [searchName, setSearchName] = useState("");
|
||||||
const [searchDistrict, setSearchDistrict] = useState("");
|
const [searchDistrict, setSearchDistrict] = useState("");
|
||||||
const [searchObject, setSearchObject] = useState("");
|
const [searchObject, setSearchObject] = useState("");
|
||||||
@@ -51,50 +24,44 @@ const DoctorsList = () => {
|
|||||||
const [searchSpec, setSearchSpec] = useState("");
|
const [searchSpec, setSearchSpec] = useState("");
|
||||||
const [searchUser, setSearchUser] = useState("");
|
const [searchUser, setSearchUser] = useState("");
|
||||||
|
|
||||||
const handleDelete = (id: number) => {
|
const limit = 20;
|
||||||
setData((prev) => prev.filter((e) => e.id !== id));
|
|
||||||
};
|
|
||||||
|
|
||||||
// Filtered data
|
const {
|
||||||
const filteredData = useMemo(() => {
|
data: doctor,
|
||||||
return data.filter((item) => {
|
isError,
|
||||||
const nameMatch = `${item.first_name} ${item.last_name}`
|
isLoading,
|
||||||
.toLowerCase()
|
isFetching,
|
||||||
.includes(searchName.toLowerCase());
|
} = useQuery({
|
||||||
const districtMatch = item.district.name
|
queryKey: [
|
||||||
.toLowerCase()
|
"doctor_list",
|
||||||
.includes(searchDistrict.toLowerCase());
|
currentPage,
|
||||||
const objectMatch = item.object.name
|
|
||||||
.toLowerCase()
|
|
||||||
.includes(searchObject.toLowerCase());
|
|
||||||
const workMatch = item.work
|
|
||||||
.toLowerCase()
|
|
||||||
.includes(searchWork.toLowerCase());
|
|
||||||
const specMatch = item.spec
|
|
||||||
.toLowerCase()
|
|
||||||
.includes(searchSpec.toLowerCase());
|
|
||||||
const userMatch = `${item.user.firstName} ${item.user.lastName}`
|
|
||||||
.toLowerCase()
|
|
||||||
.includes(searchUser.toLowerCase());
|
|
||||||
|
|
||||||
return (
|
|
||||||
nameMatch &&
|
|
||||||
districtMatch &&
|
|
||||||
objectMatch &&
|
|
||||||
workMatch &&
|
|
||||||
specMatch &&
|
|
||||||
userMatch
|
|
||||||
);
|
|
||||||
});
|
|
||||||
}, [
|
|
||||||
data,
|
|
||||||
searchName,
|
|
||||||
searchDistrict,
|
searchDistrict,
|
||||||
|
searchName,
|
||||||
searchObject,
|
searchObject,
|
||||||
searchWork,
|
searchWork,
|
||||||
searchSpec,
|
searchSpec,
|
||||||
searchUser,
|
searchUser,
|
||||||
]);
|
],
|
||||||
|
queryFn: () =>
|
||||||
|
doctor_api.list({
|
||||||
|
limit,
|
||||||
|
offset: (currentPage - 1) * limit,
|
||||||
|
district_name: searchDistrict,
|
||||||
|
full_name: searchName,
|
||||||
|
place_name: searchObject,
|
||||||
|
work_place: searchWork,
|
||||||
|
sphere: searchSpec,
|
||||||
|
user: searchUser,
|
||||||
|
}),
|
||||||
|
select(data) {
|
||||||
|
return data.data.data;
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
// const handleDelete = (id: number) => {
|
||||||
|
// };
|
||||||
|
|
||||||
|
const totalPages = doctor ? Math.ceil(doctor.count / limit) : 1;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex flex-col h-full p-10 w-full">
|
<div className="flex flex-col h-full p-10 w-full">
|
||||||
@@ -103,69 +70,25 @@ const DoctorsList = () => {
|
|||||||
<div className="flex flex-col gap-4 w-full">
|
<div className="flex flex-col gap-4 w-full">
|
||||||
<h1 className="text-2xl font-bold">Shifokorlarni boshqarish</h1>
|
<h1 className="text-2xl font-bold">Shifokorlarni boshqarish</h1>
|
||||||
|
|
||||||
<div className="flex justify-end gap-2 w-full">
|
<FilterDoctor
|
||||||
<Input
|
dialogOpen={dialogOpen}
|
||||||
placeholder="Shifokor Ism Familiyasi"
|
editingPlan={editingPlan}
|
||||||
value={searchName}
|
searchDistrict={searchDistrict}
|
||||||
onChange={(e) => setSearchName(e.target.value)}
|
searchName={searchName}
|
||||||
className="w-full md:w-48"
|
searchObject={searchObject}
|
||||||
/>
|
searchSpec={searchSpec}
|
||||||
<Input
|
searchUser={searchUser}
|
||||||
placeholder="Tuman"
|
searchWork={searchWork}
|
||||||
value={searchDistrict}
|
// setData={setData}
|
||||||
onChange={(e) => setSearchDistrict(e.target.value)}
|
|
||||||
className="w-full md:w-48"
|
|
||||||
/>
|
|
||||||
<Input
|
|
||||||
placeholder="Obyekt"
|
|
||||||
value={searchObject}
|
|
||||||
onChange={(e) => setSearchObject(e.target.value)}
|
|
||||||
className="w-full md:w-48"
|
|
||||||
/>
|
|
||||||
<Input
|
|
||||||
placeholder="Ish joyi"
|
|
||||||
value={searchWork}
|
|
||||||
onChange={(e) => setSearchWork(e.target.value)}
|
|
||||||
className="w-full md:w-48"
|
|
||||||
/>
|
|
||||||
<Input
|
|
||||||
placeholder="Sohasi"
|
|
||||||
value={searchSpec}
|
|
||||||
onChange={(e) => setSearchSpec(e.target.value)}
|
|
||||||
className="w-full md:w-48"
|
|
||||||
/>
|
|
||||||
<Input
|
|
||||||
placeholder="Kim qo'shgan"
|
|
||||||
value={searchUser}
|
|
||||||
onChange={(e) => setSearchUser(e.target.value)}
|
|
||||||
className="w-full md:w-48"
|
|
||||||
/>
|
|
||||||
<Dialog open={dialogOpen} onOpenChange={setDialogOpen}>
|
|
||||||
<DialogTrigger asChild>
|
|
||||||
<Button
|
|
||||||
variant="default"
|
|
||||||
className="bg-blue-500 cursor-pointer hover:bg-blue-500"
|
|
||||||
onClick={() => setEditingPlan(null)}
|
|
||||||
>
|
|
||||||
<Plus className="!h-5 !w-5" /> Qo'shish
|
|
||||||
</Button>
|
|
||||||
</DialogTrigger>
|
|
||||||
<DialogContent className="sm:max-w-lg max-h-[80vh] overflow-x-hidden">
|
|
||||||
<DialogHeader>
|
|
||||||
<DialogTitle className="text-xl">
|
|
||||||
{editingPlan
|
|
||||||
? "Shifokor tahrirlash"
|
|
||||||
: "Yangi shifokor qo'shish"}
|
|
||||||
</DialogTitle>
|
|
||||||
</DialogHeader>
|
|
||||||
<AddedDoctor
|
|
||||||
initialValues={editingPlan}
|
|
||||||
setDialogOpen={setDialogOpen}
|
setDialogOpen={setDialogOpen}
|
||||||
setData={setData}
|
setEditingPlan={setEditingPlan}
|
||||||
|
setSearchDistrict={setSearchDistrict}
|
||||||
|
setSearchName={setSearchName}
|
||||||
|
setSearchObject={setSearchObject}
|
||||||
|
setSearchSpec={setSearchSpec}
|
||||||
|
setSearchUser={setSearchUser}
|
||||||
|
setSearchWork={setSearchWork}
|
||||||
/>
|
/>
|
||||||
</DialogContent>
|
|
||||||
</Dialog>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<DoctorDetailDialog
|
<DoctorDetailDialog
|
||||||
@@ -175,116 +98,20 @@ const DoctorsList = () => {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex-1 overflow-auto">
|
<TableDoctor
|
||||||
<Table>
|
isError={isError}
|
||||||
<TableHeader>
|
isLoading={isLoading}
|
||||||
<TableRow>
|
doctor={doctor ? doctor.results : []}
|
||||||
<TableHead>#</TableHead>
|
setDetail={setDetail}
|
||||||
<TableHead>Shifokor Ism Familiyasi</TableHead>
|
isFetching={isFetching}
|
||||||
<TableHead>Telefon raqami</TableHead>
|
setDetailDialog={setDetailDialog}
|
||||||
<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>
|
|
||||||
{filteredData.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.object.name}</TableCell>
|
|
||||||
<TableCell>{item.work}</TableCell>
|
|
||||||
<TableCell>{item.spec}</TableCell>
|
|
||||||
<TableCell>
|
|
||||||
{item.user.firstName} {item.user.lastName}
|
|
||||||
</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.id)}
|
|
||||||
>
|
|
||||||
<Trash2 size={18} />
|
|
||||||
</Button>
|
|
||||||
</TableCell>
|
|
||||||
</TableRow>
|
|
||||||
))}
|
|
||||||
</TableBody>
|
|
||||||
</Table>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="mt-2 sticky bottom-0 bg-white flex justify-end gap-2 z-10 py-2 border-t">
|
<PaginationDoctor
|
||||||
<Button
|
currentPage={currentPage}
|
||||||
variant="outline"
|
setCurrentPage={setCurrentPage}
|
||||||
size="icon"
|
totalPages={totalPages}
|
||||||
disabled={currentPage === 1}
|
/>
|
||||||
className="cursor-pointer"
|
|
||||||
onClick={() => setCurrentPage((prev) => Math.max(prev - 1, 1))}
|
|
||||||
>
|
|
||||||
<ChevronLeft />
|
|
||||||
</Button>
|
|
||||||
{Array.from({ length: totalPages }, (_, i) => (
|
|
||||||
<Button
|
|
||||||
key={i}
|
|
||||||
variant={currentPage === i + 1 ? "default" : "outline"}
|
|
||||||
size="icon"
|
|
||||||
className={clsx(
|
|
||||||
currentPage === i + 1
|
|
||||||
? "bg-blue-500 hover:bg-blue-500"
|
|
||||||
: " bg-none hover:bg-blue-200",
|
|
||||||
"cursor-pointer",
|
|
||||||
)}
|
|
||||||
onClick={() => setCurrentPage(i + 1)}
|
|
||||||
>
|
|
||||||
{i + 1}
|
|
||||||
</Button>
|
|
||||||
))}
|
|
||||||
<Button
|
|
||||||
variant="outline"
|
|
||||||
size="icon"
|
|
||||||
disabled={currentPage === totalPages}
|
|
||||||
onClick={() =>
|
|
||||||
setCurrentPage((prev) => Math.min(prev + 1, totalPages))
|
|
||||||
}
|
|
||||||
className="cursor-pointer"
|
|
||||||
>
|
|
||||||
<ChevronRight />
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
116
src/features/doctors/ui/FilterDoctor.tsx
Normal file
116
src/features/doctors/ui/FilterDoctor.tsx
Normal file
@@ -0,0 +1,116 @@
|
|||||||
|
import type { DoctorListType } from "@/features/doctors/lib/data";
|
||||||
|
import AddedDoctor from "@/features/doctors/ui/AddedDoctor";
|
||||||
|
import { Button } from "@/shared/ui/button";
|
||||||
|
import {
|
||||||
|
Dialog,
|
||||||
|
DialogContent,
|
||||||
|
DialogHeader,
|
||||||
|
DialogTitle,
|
||||||
|
DialogTrigger,
|
||||||
|
} from "@/shared/ui/dialog";
|
||||||
|
import { Input } from "@/shared/ui/input";
|
||||||
|
import { Plus } from "lucide-react";
|
||||||
|
import type { Dispatch, SetStateAction } from "react";
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
searchName: string;
|
||||||
|
setSearchName: Dispatch<SetStateAction<string>>;
|
||||||
|
searchDistrict: string;
|
||||||
|
setSearchDistrict: Dispatch<SetStateAction<string>>;
|
||||||
|
searchWork: string;
|
||||||
|
setSearchWork: Dispatch<SetStateAction<string>>;
|
||||||
|
searchSpec: string;
|
||||||
|
setSearchSpec: Dispatch<SetStateAction<string>>;
|
||||||
|
searchUser: string;
|
||||||
|
setSearchUser: Dispatch<SetStateAction<string>>;
|
||||||
|
dialogOpen: boolean;
|
||||||
|
setDialogOpen: Dispatch<SetStateAction<boolean>>;
|
||||||
|
searchObject: string;
|
||||||
|
setSearchObject: Dispatch<SetStateAction<string>>;
|
||||||
|
setEditingPlan: Dispatch<SetStateAction<DoctorListType | null>>;
|
||||||
|
editingPlan: DoctorListType | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
const FilterDoctor = ({
|
||||||
|
searchName,
|
||||||
|
setSearchName,
|
||||||
|
searchDistrict,
|
||||||
|
setSearchDistrict,
|
||||||
|
searchObject,
|
||||||
|
setSearchObject,
|
||||||
|
searchWork,
|
||||||
|
setSearchWork,
|
||||||
|
searchSpec,
|
||||||
|
setSearchSpec,
|
||||||
|
searchUser,
|
||||||
|
setSearchUser,
|
||||||
|
dialogOpen,
|
||||||
|
setDialogOpen,
|
||||||
|
setEditingPlan,
|
||||||
|
editingPlan,
|
||||||
|
}: Props) => {
|
||||||
|
return (
|
||||||
|
<div className="flex justify-end gap-2 w-full">
|
||||||
|
<Input
|
||||||
|
placeholder="Shifokor Ism Familiyasi"
|
||||||
|
value={searchName}
|
||||||
|
onChange={(e) => setSearchName(e.target.value)}
|
||||||
|
className="w-full md:w-48"
|
||||||
|
/>
|
||||||
|
<Input
|
||||||
|
placeholder="Tuman"
|
||||||
|
value={searchDistrict}
|
||||||
|
onChange={(e) => setSearchDistrict(e.target.value)}
|
||||||
|
className="w-full md:w-48"
|
||||||
|
/>
|
||||||
|
<Input
|
||||||
|
placeholder="Obyekt"
|
||||||
|
value={searchObject}
|
||||||
|
onChange={(e) => setSearchObject(e.target.value)}
|
||||||
|
className="w-full md:w-48"
|
||||||
|
/>
|
||||||
|
<Input
|
||||||
|
placeholder="Ish joyi"
|
||||||
|
value={searchWork}
|
||||||
|
onChange={(e) => setSearchWork(e.target.value)}
|
||||||
|
className="w-full md:w-48"
|
||||||
|
/>
|
||||||
|
<Input
|
||||||
|
placeholder="Sohasi"
|
||||||
|
value={searchSpec}
|
||||||
|
onChange={(e) => setSearchSpec(e.target.value)}
|
||||||
|
className="w-full md:w-48"
|
||||||
|
/>
|
||||||
|
<Input
|
||||||
|
placeholder="Kim qo'shgan"
|
||||||
|
value={searchUser}
|
||||||
|
onChange={(e) => setSearchUser(e.target.value)}
|
||||||
|
className="w-full md:w-48"
|
||||||
|
/>
|
||||||
|
<Dialog open={dialogOpen} onOpenChange={setDialogOpen}>
|
||||||
|
<DialogTrigger asChild>
|
||||||
|
<Button
|
||||||
|
variant="default"
|
||||||
|
className="bg-blue-500 cursor-pointer hover:bg-blue-500"
|
||||||
|
onClick={() => setEditingPlan(null)}
|
||||||
|
>
|
||||||
|
<Plus className="!h-5 !w-5" /> Qo'shish
|
||||||
|
</Button>
|
||||||
|
</DialogTrigger>
|
||||||
|
<DialogContent className="sm:max-w-lg max-h-[80vh] overflow-x-hidden">
|
||||||
|
<DialogHeader>
|
||||||
|
<DialogTitle className="text-xl">
|
||||||
|
{editingPlan ? "Shifokor tahrirlash" : "Yangi shifokor qo'shish"}
|
||||||
|
</DialogTitle>
|
||||||
|
</DialogHeader>
|
||||||
|
<AddedDoctor
|
||||||
|
initialValues={editingPlan}
|
||||||
|
setDialogOpen={setDialogOpen}
|
||||||
|
/>
|
||||||
|
</DialogContent>
|
||||||
|
</Dialog>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default FilterDoctor;
|
||||||
57
src/features/doctors/ui/PaginationDoctor.tsx
Normal file
57
src/features/doctors/ui/PaginationDoctor.tsx
Normal file
@@ -0,0 +1,57 @@
|
|||||||
|
import { Button } from "@/shared/ui/button";
|
||||||
|
import clsx from "clsx";
|
||||||
|
import { ChevronLeft, ChevronRight } from "lucide-react";
|
||||||
|
import type { Dispatch, SetStateAction } from "react";
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
currentPage: number;
|
||||||
|
setCurrentPage: Dispatch<SetStateAction<number>>;
|
||||||
|
totalPages: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
const PaginationDoctor = ({
|
||||||
|
currentPage,
|
||||||
|
setCurrentPage,
|
||||||
|
totalPages,
|
||||||
|
}: Props) => {
|
||||||
|
return (
|
||||||
|
<div className="mt-2 sticky bottom-0 bg-white flex justify-end gap-2 z-10 py-2 border-t">
|
||||||
|
<Button
|
||||||
|
variant="outline"
|
||||||
|
size="icon"
|
||||||
|
disabled={currentPage === 1}
|
||||||
|
className="cursor-pointer"
|
||||||
|
onClick={() => setCurrentPage((prev) => Math.max(prev - 1, 1))}
|
||||||
|
>
|
||||||
|
<ChevronLeft />
|
||||||
|
</Button>
|
||||||
|
{Array.from({ length: totalPages }, (_, i) => (
|
||||||
|
<Button
|
||||||
|
key={i}
|
||||||
|
variant={currentPage === i + 1 ? "default" : "outline"}
|
||||||
|
size="icon"
|
||||||
|
className={clsx(
|
||||||
|
currentPage === i + 1
|
||||||
|
? "bg-blue-500 hover:bg-blue-500"
|
||||||
|
: " bg-none hover:bg-blue-200",
|
||||||
|
"cursor-pointer",
|
||||||
|
)}
|
||||||
|
onClick={() => setCurrentPage(i + 1)}
|
||||||
|
>
|
||||||
|
{i + 1}
|
||||||
|
</Button>
|
||||||
|
))}
|
||||||
|
<Button
|
||||||
|
variant="outline"
|
||||||
|
size="icon"
|
||||||
|
disabled={currentPage === totalPages}
|
||||||
|
onClick={() => setCurrentPage((prev) => Math.min(prev + 1, totalPages))}
|
||||||
|
className="cursor-pointer"
|
||||||
|
>
|
||||||
|
<ChevronRight />
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default PaginationDoctor;
|
||||||
134
src/features/doctors/ui/TableDoctor.tsx
Normal file
134
src/features/doctors/ui/TableDoctor.tsx
Normal file
@@ -0,0 +1,134 @@
|
|||||||
|
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>>;
|
||||||
|
setDetailDialog: Dispatch<SetStateAction<boolean>>;
|
||||||
|
doctor: DoctorListResData[] | [];
|
||||||
|
isLoading: boolean;
|
||||||
|
isError: boolean;
|
||||||
|
isFetching: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
const TableDoctor = ({
|
||||||
|
doctor,
|
||||||
|
setDetail,
|
||||||
|
setDetailDialog,
|
||||||
|
isError,
|
||||||
|
isLoading,
|
||||||
|
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.id)}
|
||||||
|
>
|
||||||
|
<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;
|
||||||
@@ -11,4 +11,19 @@ export const region_api = {
|
|||||||
}): Promise<AxiosResponse<RegionListRes>> {
|
}): Promise<AxiosResponse<RegionListRes>> {
|
||||||
return await httpClient.get(`${REGIONS}list/`, { params });
|
return await httpClient.get(`${REGIONS}list/`, { params });
|
||||||
},
|
},
|
||||||
|
|
||||||
|
async create(body: { name: string }) {
|
||||||
|
const res = await httpClient.post(`${REGIONS}create/`, body);
|
||||||
|
return res;
|
||||||
|
},
|
||||||
|
|
||||||
|
async update({ body, id }: { id: number; body: { name: string } }) {
|
||||||
|
const res = await httpClient.patch(`${REGIONS}${id}/update/`, body);
|
||||||
|
return res;
|
||||||
|
},
|
||||||
|
|
||||||
|
async delete(id: number) {
|
||||||
|
const res = await httpClient.delete(`${REGIONS}${id}/delete/`);
|
||||||
|
return res;
|
||||||
|
},
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -1,3 +1,4 @@
|
|||||||
|
import { region_api } from "@/features/region/lib/api";
|
||||||
import type { RegionType } from "@/features/region/lib/data";
|
import type { RegionType } from "@/features/region/lib/data";
|
||||||
import { regionForm } from "@/features/region/lib/form";
|
import { regionForm } from "@/features/region/lib/form";
|
||||||
import { Button } from "@/shared/ui/button";
|
import { Button } from "@/shared/ui/button";
|
||||||
@@ -11,42 +12,69 @@ import {
|
|||||||
import { Input } from "@/shared/ui/input";
|
import { Input } from "@/shared/ui/input";
|
||||||
import { Label } from "@/shared/ui/label";
|
import { Label } from "@/shared/ui/label";
|
||||||
import { zodResolver } from "@hookform/resolvers/zod";
|
import { zodResolver } from "@hookform/resolvers/zod";
|
||||||
|
import { useMutation, useQueryClient } from "@tanstack/react-query";
|
||||||
|
import type { AxiosError } from "axios";
|
||||||
import { Loader2 } from "lucide-react";
|
import { Loader2 } from "lucide-react";
|
||||||
import { useState, type Dispatch, type SetStateAction } from "react";
|
import { type Dispatch, type SetStateAction } from "react";
|
||||||
import { useForm } from "react-hook-form";
|
import { useForm } from "react-hook-form";
|
||||||
|
import { toast } from "sonner";
|
||||||
import type z from "zod";
|
import type z from "zod";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
initialValues: RegionType | null;
|
initialValues: RegionType | null;
|
||||||
setDialogOpen: Dispatch<SetStateAction<boolean>>;
|
setDialogOpen: Dispatch<SetStateAction<boolean>>;
|
||||||
setPlans: Dispatch<SetStateAction<RegionType[]>>;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const AddedRegion = ({ initialValues, setDialogOpen, setPlans }: Props) => {
|
const AddedRegion = ({ initialValues, setDialogOpen }: Props) => {
|
||||||
const [load, setLoad] = useState<boolean>(false);
|
|
||||||
const form = useForm<z.infer<typeof regionForm>>({
|
const form = useForm<z.infer<typeof regionForm>>({
|
||||||
resolver: zodResolver(regionForm),
|
resolver: zodResolver(regionForm),
|
||||||
defaultValues: { name: initialValues?.name || "" },
|
defaultValues: { name: initialValues?.name || "" },
|
||||||
});
|
});
|
||||||
|
const queryClient = useQueryClient();
|
||||||
|
|
||||||
|
const { mutate, isPending } = useMutation({
|
||||||
|
mutationFn: (body: { name: string }) => region_api.create(body),
|
||||||
|
onSuccess: () => {
|
||||||
|
queryClient.refetchQueries({ queryKey: ["region_list"] });
|
||||||
|
toast.success(`Yangi hudud qo'shildi`);
|
||||||
|
setDialogOpen(false);
|
||||||
|
},
|
||||||
|
onError: (err: AxiosError) => {
|
||||||
|
const errMessage = err.response?.data as { message: string };
|
||||||
|
const messageText = errMessage.message;
|
||||||
|
toast.error(messageText || "Xatolik yuz berdi", {
|
||||||
|
richColors: true,
|
||||||
|
position: "top-center",
|
||||||
|
});
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const { mutate: edit, isPending: editPending } = useMutation({
|
||||||
|
mutationFn: ({ body, id }: { id: number; body: { name: string } }) =>
|
||||||
|
region_api.update({ body, id }),
|
||||||
|
onSuccess: () => {
|
||||||
|
queryClient.refetchQueries({ queryKey: ["region_list"] });
|
||||||
|
toast.success(`Yangi hudud qo'shildi`);
|
||||||
|
setDialogOpen(false);
|
||||||
|
},
|
||||||
|
onError: (err: AxiosError) => {
|
||||||
|
const errMessage = err.response?.data as { message: string };
|
||||||
|
const messageText = errMessage.message;
|
||||||
|
toast.error(messageText || "Xatolik yuz berdi", {
|
||||||
|
richColors: true,
|
||||||
|
position: "top-center",
|
||||||
|
});
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
function onSubmit(value: z.infer<typeof regionForm>) {
|
function onSubmit(value: z.infer<typeof regionForm>) {
|
||||||
setLoad(true);
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
setPlans((prev) => {
|
|
||||||
if (initialValues) {
|
if (initialValues) {
|
||||||
return prev.map((item) =>
|
edit({ id: initialValues.id, body: { name: value.name } });
|
||||||
item.id === initialValues.id ? { ...item, ...value } : item,
|
} else {
|
||||||
);
|
mutate({
|
||||||
}
|
name: value.name,
|
||||||
return [
|
|
||||||
...prev,
|
|
||||||
{ id: prev.length ? prev[prev.length - 1].id + 1 : 1, ...value },
|
|
||||||
];
|
|
||||||
});
|
});
|
||||||
setLoad(false);
|
}
|
||||||
setDialogOpen(false);
|
|
||||||
}, 2000);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -66,8 +94,11 @@ const AddedRegion = ({ initialValues, setDialogOpen, setPlans }: Props) => {
|
|||||||
)}
|
)}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<Button className="w-full bg-blue-500 cursor-pointer hover:bg-blue-500">
|
<Button
|
||||||
{load ? (
|
type="submit"
|
||||||
|
className="w-full bg-blue-500 cursor-pointer hover:bg-blue-500"
|
||||||
|
>
|
||||||
|
{isPending || editPending ? (
|
||||||
<Loader2 className="animate-spin" />
|
<Loader2 className="animate-spin" />
|
||||||
) : initialValues ? (
|
) : initialValues ? (
|
||||||
"Tahrirlash"
|
"Tahrirlash"
|
||||||
|
|||||||
88
src/features/region/ui/DeleteRegion.tsx
Normal file
88
src/features/region/ui/DeleteRegion.tsx
Normal file
@@ -0,0 +1,88 @@
|
|||||||
|
import { region_api } from "@/features/region/lib/api";
|
||||||
|
import type { RegionListResData } from "@/features/region/lib/data";
|
||||||
|
import { Button } from "@/shared/ui/button";
|
||||||
|
import {
|
||||||
|
Dialog,
|
||||||
|
DialogContent,
|
||||||
|
DialogDescription,
|
||||||
|
DialogFooter,
|
||||||
|
DialogHeader,
|
||||||
|
DialogTitle,
|
||||||
|
} from "@/shared/ui/dialog";
|
||||||
|
import { useMutation, useQueryClient } from "@tanstack/react-query";
|
||||||
|
import type { AxiosError } from "axios";
|
||||||
|
import { Loader2, Trash, X } from "lucide-react";
|
||||||
|
import type { Dispatch, SetStateAction } from "react";
|
||||||
|
import { toast } from "sonner";
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
opneDelete: boolean;
|
||||||
|
setOpenDelete: Dispatch<SetStateAction<boolean>>;
|
||||||
|
setRegionDelete: Dispatch<SetStateAction<RegionListResData | null>>;
|
||||||
|
regionDelete: RegionListResData | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
const DeleteRegion = ({
|
||||||
|
opneDelete,
|
||||||
|
setOpenDelete,
|
||||||
|
setRegionDelete,
|
||||||
|
regionDelete,
|
||||||
|
}: Props) => {
|
||||||
|
const queryClient = useQueryClient();
|
||||||
|
|
||||||
|
const { mutate: deleteRegion, isPending } = useMutation({
|
||||||
|
mutationFn: (id: number) => region_api.delete(id),
|
||||||
|
|
||||||
|
onSuccess: () => {
|
||||||
|
queryClient.refetchQueries({ queryKey: ["region_list"] });
|
||||||
|
toast.success(`Foydalanuvchi o'chirildi`);
|
||||||
|
setOpenDelete(false);
|
||||||
|
setRegionDelete(null);
|
||||||
|
},
|
||||||
|
onError: (err: AxiosError) => {
|
||||||
|
const errMessage = err.response?.data as { message: string };
|
||||||
|
const messageText = errMessage.message;
|
||||||
|
toast.error(messageText || "Xatolik yuz berdi", {
|
||||||
|
richColors: true,
|
||||||
|
position: "top-center",
|
||||||
|
});
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Dialog open={opneDelete} onOpenChange={setOpenDelete}>
|
||||||
|
<DialogContent>
|
||||||
|
<DialogHeader>
|
||||||
|
<DialogTitle>Foydalanuvchini o'chrish</DialogTitle>
|
||||||
|
<DialogDescription className="text-md font-semibold">
|
||||||
|
Siz rostan ham {regionDelete?.name} hududini o'chimoqchimiszi
|
||||||
|
</DialogDescription>
|
||||||
|
</DialogHeader>
|
||||||
|
<DialogFooter>
|
||||||
|
<Button
|
||||||
|
className="bg-blue-600 cursor-pointer hover:bg-blue-600"
|
||||||
|
onClick={() => setOpenDelete(false)}
|
||||||
|
>
|
||||||
|
<X />
|
||||||
|
Bekor qilish
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
variant={"destructive"}
|
||||||
|
onClick={() => regionDelete && deleteRegion(regionDelete.id)}
|
||||||
|
>
|
||||||
|
{isPending ? (
|
||||||
|
<Loader2 className="animate-spin" />
|
||||||
|
) : (
|
||||||
|
<>
|
||||||
|
<Trash />
|
||||||
|
O'chirish
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</Button>
|
||||||
|
</DialogFooter>
|
||||||
|
</DialogContent>
|
||||||
|
</Dialog>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default DeleteRegion;
|
||||||
@@ -1,5 +1,8 @@
|
|||||||
import { fakeRegionList, type RegionType } from "@/features/region/lib/data";
|
import { region_api } from "@/features/region/lib/api";
|
||||||
|
import { type RegionListResData } from "@/features/region/lib/data";
|
||||||
import AddedRegion from "@/features/region/ui/AddedRegion";
|
import AddedRegion from "@/features/region/ui/AddedRegion";
|
||||||
|
import DeleteRegion from "@/features/region/ui/DeleteRegion";
|
||||||
|
import RegionTable from "@/features/region/ui/RegionTable";
|
||||||
import { Button } from "@/shared/ui/button";
|
import { Button } from "@/shared/ui/button";
|
||||||
import {
|
import {
|
||||||
Dialog,
|
Dialog,
|
||||||
@@ -8,28 +11,33 @@ import {
|
|||||||
DialogTitle,
|
DialogTitle,
|
||||||
DialogTrigger,
|
DialogTrigger,
|
||||||
} from "@/shared/ui/dialog";
|
} from "@/shared/ui/dialog";
|
||||||
import {
|
import { useQuery } from "@tanstack/react-query";
|
||||||
Table,
|
|
||||||
TableBody,
|
import { Plus } from "lucide-react";
|
||||||
TableCell,
|
|
||||||
TableHead,
|
|
||||||
TableHeader,
|
|
||||||
TableRow,
|
|
||||||
} from "@/shared/ui/table";
|
|
||||||
import clsx from "clsx";
|
|
||||||
import { ChevronLeft, ChevronRight, Edit, Plus, Trash } from "lucide-react";
|
|
||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
|
|
||||||
const RegionList = () => {
|
const RegionList = () => {
|
||||||
const [currentPage, setCurrentPage] = useState(1);
|
const { data, isLoading, isError } = useQuery({
|
||||||
const totalPages = 5;
|
queryKey: ["region_list"],
|
||||||
const [plans, setPlans] = useState<RegionType[]>(fakeRegionList);
|
queryFn: () => region_api.list({}),
|
||||||
|
select(data) {
|
||||||
|
return data.data.data;
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
const [editingPlan, setEditingPlan] = useState<RegionType | null>(null);
|
const [regionDelete, setRegionDelete] = useState<RegionListResData | null>(
|
||||||
|
null,
|
||||||
|
);
|
||||||
|
const [opneDelete, setOpenDelete] = useState<boolean>(false);
|
||||||
|
|
||||||
|
const [editingPlan, setEditingPlan] = useState<RegionListResData | null>(
|
||||||
|
null,
|
||||||
|
);
|
||||||
const [dialogOpen, setDialogOpen] = useState(false);
|
const [dialogOpen, setDialogOpen] = useState(false);
|
||||||
|
|
||||||
const handleDelete = (id: number) => {
|
const handleDelete = (user: RegionListResData) => {
|
||||||
setPlans(plans.filter((p) => p.id !== id));
|
setRegionDelete(user);
|
||||||
|
setOpenDelete(true);
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -58,91 +66,27 @@ const RegionList = () => {
|
|||||||
<AddedRegion
|
<AddedRegion
|
||||||
initialValues={editingPlan}
|
initialValues={editingPlan}
|
||||||
setDialogOpen={setDialogOpen}
|
setDialogOpen={setDialogOpen}
|
||||||
setPlans={setPlans}
|
|
||||||
/>
|
/>
|
||||||
</DialogContent>
|
</DialogContent>
|
||||||
</Dialog>
|
</Dialog>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
{data && (
|
||||||
<div className="flex-1 overflow-auto">
|
<RegionTable
|
||||||
<Table>
|
region={data!}
|
||||||
<TableHeader>
|
handleDelete={handleDelete}
|
||||||
<TableRow className="text-center">
|
isError={isError}
|
||||||
<TableHead className="text-start">ID</TableHead>
|
setDialogOpen={setDialogOpen}
|
||||||
<TableHead className="text-start">Nomi</TableHead>
|
isLoading={isLoading}
|
||||||
</TableRow>
|
setEditingRegion={setEditingPlan}
|
||||||
</TableHeader>
|
/>
|
||||||
<TableBody>
|
|
||||||
{plans.map((plan) => (
|
|
||||||
<TableRow key={plan.id} className="text-start">
|
|
||||||
<TableCell>{plan.id}</TableCell>
|
|
||||||
<TableCell>{plan.name}</TableCell>
|
|
||||||
<TableCell className="flex gap-2 justify-end">
|
|
||||||
<Button
|
|
||||||
variant="outline"
|
|
||||||
size="sm"
|
|
||||||
className="bg-blue-500 text-white hover:bg-blue-500 hover:text-white cursor-pointer"
|
|
||||||
onClick={() => {
|
|
||||||
setEditingPlan(plan);
|
|
||||||
setDialogOpen(true);
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<Edit className="h-4 w-4" />
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
variant="destructive"
|
|
||||||
size="sm"
|
|
||||||
className="cursor-pointer"
|
|
||||||
onClick={() => handleDelete(plan.id)}
|
|
||||||
>
|
|
||||||
<Trash className="h-4 w-4" />
|
|
||||||
</Button>
|
|
||||||
</TableCell>
|
|
||||||
</TableRow>
|
|
||||||
))}
|
|
||||||
</TableBody>
|
|
||||||
</Table>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="mt-2 sticky bottom-0 bg-white flex justify-end gap-2 z-10 py-2 border-t">
|
|
||||||
<Button
|
|
||||||
variant="outline"
|
|
||||||
size="icon"
|
|
||||||
disabled={currentPage === 1}
|
|
||||||
className="cursor-pointer"
|
|
||||||
onClick={() => setCurrentPage((prev) => Math.max(prev - 1, 1))}
|
|
||||||
>
|
|
||||||
<ChevronLeft />
|
|
||||||
</Button>
|
|
||||||
{Array.from({ length: totalPages }, (_, i) => (
|
|
||||||
<Button
|
|
||||||
key={i}
|
|
||||||
variant={currentPage === i + 1 ? "default" : "outline"}
|
|
||||||
size="icon"
|
|
||||||
className={clsx(
|
|
||||||
currentPage === i + 1
|
|
||||||
? "bg-blue-500 hover:bg-blue-500"
|
|
||||||
: " bg-none hover:bg-blue-200",
|
|
||||||
"cursor-pointer",
|
|
||||||
)}
|
)}
|
||||||
onClick={() => setCurrentPage(i + 1)}
|
<DeleteRegion
|
||||||
>
|
opneDelete={opneDelete}
|
||||||
{i + 1}
|
regionDelete={regionDelete}
|
||||||
</Button>
|
setOpenDelete={setOpenDelete}
|
||||||
))}
|
setRegionDelete={setRegionDelete}
|
||||||
<Button
|
/>
|
||||||
variant="outline"
|
|
||||||
size="icon"
|
|
||||||
disabled={currentPage === totalPages}
|
|
||||||
onClick={() =>
|
|
||||||
setCurrentPage((prev) => Math.min(prev + 1, totalPages))
|
|
||||||
}
|
|
||||||
className="cursor-pointer"
|
|
||||||
>
|
|
||||||
<ChevronRight />
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
89
src/features/region/ui/RegionTable.tsx
Normal file
89
src/features/region/ui/RegionTable.tsx
Normal file
@@ -0,0 +1,89 @@
|
|||||||
|
import type { RegionListResData } from "@/features/region/lib/data";
|
||||||
|
import { Button } from "@/shared/ui/button";
|
||||||
|
import {
|
||||||
|
Table,
|
||||||
|
TableBody,
|
||||||
|
TableCell,
|
||||||
|
TableHead,
|
||||||
|
TableHeader,
|
||||||
|
TableRow,
|
||||||
|
} from "@/shared/ui/table";
|
||||||
|
import { Edit, Loader2, Trash } from "lucide-react";
|
||||||
|
import type { Dispatch, SetStateAction } from "react";
|
||||||
|
|
||||||
|
const RegionTable = ({
|
||||||
|
region,
|
||||||
|
handleDelete,
|
||||||
|
isLoading,
|
||||||
|
isError,
|
||||||
|
setEditingRegion,
|
||||||
|
setDialogOpen,
|
||||||
|
}: {
|
||||||
|
region: RegionListResData[];
|
||||||
|
isLoading: boolean;
|
||||||
|
isError: boolean;
|
||||||
|
setEditingRegion: Dispatch<SetStateAction<RegionListResData | null>>;
|
||||||
|
setDialogOpen: Dispatch<SetStateAction<boolean>>;
|
||||||
|
handleDelete: (user: RegionListResData) => void;
|
||||||
|
}) => {
|
||||||
|
return (
|
||||||
|
<div className="flex-1 overflow-auto">
|
||||||
|
{isLoading && (
|
||||||
|
<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 className="text-center">
|
||||||
|
<TableHead className="text-start">ID</TableHead>
|
||||||
|
<TableHead className="text-start">Nomi</TableHead>
|
||||||
|
</TableRow>
|
||||||
|
</TableHeader>
|
||||||
|
<TableBody>
|
||||||
|
{region.map((plan, index) => (
|
||||||
|
<TableRow key={plan.id} className="text-start">
|
||||||
|
<TableCell>{index + 1}</TableCell>
|
||||||
|
<TableCell>{plan.name}</TableCell>
|
||||||
|
<TableCell className="flex gap-2 justify-end">
|
||||||
|
<Button
|
||||||
|
variant="outline"
|
||||||
|
size="sm"
|
||||||
|
className="bg-blue-500 text-white hover:bg-blue-500 hover:text-white cursor-pointer"
|
||||||
|
onClick={() => {
|
||||||
|
setEditingRegion(plan);
|
||||||
|
setDialogOpen(true);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Edit className="h-4 w-4" />
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
variant="destructive"
|
||||||
|
size="sm"
|
||||||
|
className="cursor-pointer"
|
||||||
|
onClick={() => handleDelete(plan)}
|
||||||
|
>
|
||||||
|
<Trash className="h-4 w-4" />
|
||||||
|
</Button>
|
||||||
|
</TableCell>
|
||||||
|
</TableRow>
|
||||||
|
))}
|
||||||
|
</TableBody>
|
||||||
|
</Table>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default RegionTable;
|
||||||
@@ -1,3 +1,4 @@
|
|||||||
|
import { region_api } from "@/features/region/lib/api";
|
||||||
import { user_api } from "@/features/users/lib/api";
|
import { user_api } from "@/features/users/lib/api";
|
||||||
import type {
|
import type {
|
||||||
UserCreateReq,
|
UserCreateReq,
|
||||||
@@ -23,7 +24,7 @@ import {
|
|||||||
SelectValue,
|
SelectValue,
|
||||||
} from "@/shared/ui/select";
|
} from "@/shared/ui/select";
|
||||||
import { zodResolver } from "@hookform/resolvers/zod";
|
import { zodResolver } from "@hookform/resolvers/zod";
|
||||||
import { useMutation, useQueryClient } from "@tanstack/react-query";
|
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
|
||||||
import type { AxiosError } from "axios";
|
import type { AxiosError } from "axios";
|
||||||
import { Loader2 } from "lucide-react";
|
import { Loader2 } from "lucide-react";
|
||||||
import { useForm } from "react-hook-form";
|
import { useForm } from "react-hook-form";
|
||||||
@@ -103,6 +104,12 @@ const AddUsers = ({ initialData, setDialogOpen }: UserFormProps) => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const { data: regions } = useQuery({
|
||||||
|
queryKey: ["region_list"],
|
||||||
|
queryFn: () => region_api.list({}),
|
||||||
|
select: (res) => res.data.data,
|
||||||
|
});
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Form {...form}>
|
<Form {...form}>
|
||||||
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
|
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
|
||||||
@@ -154,9 +161,12 @@ const AddUsers = ({ initialData, setDialogOpen }: UserFormProps) => {
|
|||||||
<SelectValue placeholder="Hududni tanlang" />
|
<SelectValue placeholder="Hududni tanlang" />
|
||||||
</SelectTrigger>
|
</SelectTrigger>
|
||||||
<SelectContent>
|
<SelectContent>
|
||||||
<SelectItem value="1">Toshkent</SelectItem>
|
{regions &&
|
||||||
<SelectItem value="2">Samarqand</SelectItem>
|
regions.map((item) => (
|
||||||
<SelectItem value="3">Bekobod</SelectItem>
|
<SelectItem value={`${item.id}`}>
|
||||||
|
{item.name}
|
||||||
|
</SelectItem>
|
||||||
|
))}
|
||||||
</SelectContent>
|
</SelectContent>
|
||||||
</Select>
|
</Select>
|
||||||
</FormControl>
|
</FormControl>
|
||||||
|
|||||||
@@ -101,7 +101,7 @@ const Filter = ({
|
|||||||
role="combobox"
|
role="combobox"
|
||||||
aria-expanded={openRegion}
|
aria-expanded={openRegion}
|
||||||
className={cn(
|
className={cn(
|
||||||
"w-64 h-12 justify-between",
|
"w-64 justify-between",
|
||||||
!regionValue && "text-muted-foreground",
|
!regionValue && "text-muted-foreground",
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -67,7 +67,7 @@ const AppRouter = () => {
|
|||||||
element: <Pill />,
|
element: <Pill />,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "/dashboard/pharm",
|
path: "/dashboard/pharmaceuticals",
|
||||||
element: <Pharm />,
|
element: <Pharm />,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -6,5 +6,6 @@ const USER = "/api/v1/admin/user/";
|
|||||||
const REGION = "/api/v1/admin/district/";
|
const REGION = "/api/v1/admin/district/";
|
||||||
const REGIONS = "/api/v1/admin/region/";
|
const REGIONS = "/api/v1/admin/region/";
|
||||||
const DISTRICT = "/api/v1/admin/district/";
|
const DISTRICT = "/api/v1/admin/district/";
|
||||||
|
const DOCTOR = "/api/v1/admin/doctor/";
|
||||||
|
|
||||||
export { BASE_URL, DISTRICT, LOGIN, REGION, REGIONS, USER };
|
export { BASE_URL, DISTRICT, DOCTOR, LOGIN, REGION, REGIONS, USER };
|
||||||
|
|||||||
@@ -93,7 +93,7 @@ const items = [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Farmasevtikalar",
|
title: "Farmasevtikalar",
|
||||||
url: "/dashboard/pharm",
|
url: "/dashboard/pharmaceuticals",
|
||||||
icon: Microscope,
|
icon: Microscope,
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|||||||
Reference in New Issue
Block a user