diff --git a/src/features/districts/ui/CategoriesList.tsx b/src/features/districts/ui/CategoriesList.tsx
index 7467b59..ba5e74f 100644
--- a/src/features/districts/ui/CategoriesList.tsx
+++ b/src/features/districts/ui/CategoriesList.tsx
@@ -4,12 +4,14 @@ import FilterCategory from "@/features/districts/ui/Filter";
import TableDistrict from "@/features/districts/ui/TableCategories";
import type { CategoryItem } from "@/features/plans/lib/data";
import Pagination from "@/shared/ui/pagination";
-import { useQuery } from "@tanstack/react-query";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
import { useState } from "react";
+import { toast } from "sonner";
const CategoriesList = () => {
const [currentPage, setCurrentPage] = useState(1);
+ const queryClient = useQueryClient();
const { data, isLoading, isError } = useQuery({
queryKey: ["categories", currentPage],
@@ -33,6 +35,31 @@ const CategoriesList = () => {
setOpenDelete(true);
};
+ const { mutate } = useMutation({
+ mutationFn: ({ body, id }: { id: number; body: FormData }) =>
+ categories_api.image_upload({ body, id }),
+ onSuccess() {
+ toast.success("Banner tartibi o'zgartilidi", {
+ richColors: true,
+ position: "top-center",
+ });
+ queryClient.refetchQueries({ queryKey: ["categories"] });
+ },
+ onError() {
+ toast.error("Xatolik yuz berdi", {
+ richColors: true,
+ position: "top-center",
+ });
+ },
+ });
+
+ const handleOrderChange = ({ body, id }: { id: number; body: FormData }) => {
+ mutate({
+ body,
+ id: id,
+ });
+ };
+
return (
@@ -42,6 +69,7 @@ const CategoriesList = () => {
>;
dialogOpen: boolean;
currentPage: number;
+ handleOrderChange: ({ body, id }: { id: number; body: FormData }) => void;
}
const TableDistrict = ({
@@ -35,8 +36,35 @@ const TableDistrict = ({
isLoading,
dialogOpen,
setDialogOpen,
+ handleOrderChange,
}: Props) => {
const [initialValues, setEditing] = useState();
+ const [localOrders, setLocalOrders] = useState<{ [key: number]: number }>({});
+
+ useEffect(() => {
+ const orders = data.reduce(
+ (acc, item) => {
+ acc[item.id] = item.order;
+ return acc;
+ },
+ {} as { [key: number]: number },
+ );
+ setLocalOrders(orders);
+ }, [data]);
+
+ const onOrderChange = (id: number, value: string) => {
+ if (value === "") {
+ // bo'sh inputni ham qabul qilamiz
+ setLocalOrders((prev) => ({ ...prev, [id]: 0 })); // yoki null ham bo'lishi mumkin
+ return;
+ }
+
+ const num = parseInt(value, 10);
+ if (!isNaN(num)) {
+ setLocalOrders((prev) => ({ ...prev, [id]: num }));
+ }
+ };
+
return (
{isLoading && (
@@ -61,7 +89,8 @@ const TableDistrict = ({
ID
Rasmi
- Nomi (uz)
+ Nomi (uz){" "}
+ Tartib raqami
Kategoriya idsi
Turi
Harakatlar
@@ -79,10 +108,41 @@ const TableDistrict = ({
className="w-10 h-10 object-cover rounded-md"
/>
- {d.name}
+ {d.name}{" "}
+
+ onOrderChange(d.id, e.target.value)}
+ onKeyDown={(e) => {
+ if (e.key === "Enter") {
+ const formData = new FormData();
+ formData.append("order", localOrders[d.id].toString());
+ handleOrderChange({
+ id: d.id,
+ body: formData,
+ });
+ }
+ }}
+ className="w-24 h-10 border rounded px-2"
+ />
+
+
{d.category_id ? d.category_id : "----"}
{d.type ? d.type : "----"}
-