update

src/components/RoughScheduleSetting/RoughScheduleSetting.tsx

@@ -3,7 +3,6 @@
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 import SearchBox, { Criterion } from "../SearchBox";
 import { ItemsResult } from "@/app/api/settings/item";
-import SearchResults, { Column } from "../SearchResults";
 import { EditNote } from "@mui/icons-material";
 import { useRouter, useSearchParams } from "next/navigation";
 import { GridDeleteIcon } from "@mui/x-data-grid";
@@ -13,7 +12,7 @@ import { BASE_API_URL, NEXT_PUBLIC_API_URL } from "@/config/api";
 import { useTranslation } from "react-i18next";
 import axiosInstance from "@/app/(main)/axios/axiosInstance";
 import Qs from "qs";
-import EditableSearchResults from "@/components/SearchResults/EditableSearchResults"; // Make sure to import Qs
+import EditableSearchResults, { Column }  from "@/components/SearchResults/EditableSearchResults"; // Make sure to import Qs
 import { ItemsResultResponse } from "@/app/api/settings/item";
 type Props = {
   items: ItemsResult[];
@@ -68,31 +67,58 @@ const RSSOverview: React.FC<Props> = ({ items }) => {
       {
         label: t("Exclude Date"),
         paramName: "excludeDate",
-        type: "multi-select",
-        options: dayOptions,
-        selectedValues: filterObj,
+        type: "select",
+        options: ["qcChecks"],
+        // selectedValues: filterObj,
         handleSelectionChange: handleSelectionChange,
       },
     ];
     return searchCriteria;
   }, [t, items]);
 
-    const searchCriteria: Criterion<SearchParamNames>[] = useMemo(
-        () => {
-            var searchCriteria: Criterion<SearchParamNames>[] = [
-                { label: t("Finished Goods Name"), paramName: "name", type: "text" },
-                {
-                    label: t("Exclude Date"),
-                    paramName: "excludeDate",
-                    type: "multi-select",
-                    options: dayOptions,
-                    selectedValues: filterObj,
-                    handleSelectionChange: handleSelectionChange,
-                },
-            ]
-            return searchCriteria
-        },
-      },
+  // const onDetailClick = useCallback(
+  //     (item: ItemsResult) => {
+  //         router.push(`/settings/items/edit?id=${item.id}`);
+  //     },
+  //     [router]
+  // );
+
+  const handleEditClick = useCallback((item: ItemsResult) => {}, [router]);
+  const onDeleteClick = useCallback((item: ItemsResult) => {}, [router]);
+
+  const columns = useMemo<Column<ItemsResult>[]>(
+    () => [
+      // {
+      //     name: "id",
+      //     label: t("Details"),
+      //     onClick: ()=>{},
+      //     buttonIcon: <EditNote />,
+      // },
+      // {
+      //   name: "name",
+      //   label: "Finished Goods Name",
+      //   // type: "input",
+      // },
+      // {
+      //   name: "excludeDate",
+      //   label: t("Exclude Date"),
+        // type: "multi-select",
+        // options: dayOptions,
+        // renderCell: (item: ItemsResult) => {
+        //   console.log("[debug] render item", item);
+        //   const selectedValues = (item.excludeDate as number[]) ?? []; // Assuming excludeDate is an array of numbers
+        //   const selectedLabels = dayOptions
+        //     .filter((option) => selectedValues.includes(option.value))
+        //     .map((option) => option.label)
+        //     .join(", "); // Join labels into a string
+
+        //   return (
+        //     <span onDoubleClick={() => handleEditClick(item.id as number)}>
+        //       {selectedLabels || "None"}{" "}
+        //       {/* Display "None" if no days are selected */}
+        //     </span>
+        //   );
+        // },
       // {
       //     name: "action",
       //     label: t(""),
@@ -113,100 +139,41 @@ const RSSOverview: React.FC<Props> = ({ items }) => {
       return; // Exit the function if the token is not set
     }
 
-    const columns = useMemo<Column<ItemsResult>[]>(
-        () => [
-            // {
-            //     name: "id",
-            //     label: t("Details"),
-            //     onClick: ()=>{},
-            //     buttonIcon: <EditNote />,
-            // },
-            {
-                field: "name",
-                label: t("Finished Goods Name"),
-                type: 'input',
-            },
-            {
-                field: "excludeDate",
-                label: t("Exclude Date"),
-                type: 'multi-select',
-                options: dayOptions,
-                renderCell: (item: ItemsResult) => {
-                    console.log("[debug] render item", item)
-                    const selectedValues = item.excludeDate as number[] ?? []; // Assuming excludeDate is an array of numbers
-                    const selectedLabels = dayOptions
-                        .filter(option => selectedValues.includes(option.value))
-                        .map(option => option.label)
-                        .join(", "); // Join labels into a string
-
-                    return (
-                        <span onDoubleClick={() => handleEditClick(item.id as number)}>
-                            {selectedLabels || "None"} {/* Display "None" if no days are selected */}
-                        </span>
-                    );
-                },
-            },
-            // {
-            //     name: "action",
-            //     label: t(""),
-            //     buttonIcon: <GridDeleteIcon />,
-            //     onClick: onDeleteClick,
-            // },
-        ],
-        [filteredItems]
-    );
-
-    useEffect(() => {
-        refetchData(filterObj);
-
-    }, [filterObj, pagingController.pageNum, pagingController.pageSize]);
-
-    const refetchData = async (filterObj: SearchQuery) => {
-
-        const authHeader = axiosInstance.defaults.headers['Authorization'];
-        if (!authHeader) {
-            return; // Exit the function if the token is not set
-        }
-
-        const params ={
-            pageNum: pagingController.pageNum,
-            pageSize: pagingController.pageSize,
-            ...filterObj,
-            ...tempSelectedValue,
-        }
-
-        try {
-            const response = await axiosInstance.get<ItemsResultResponse>(`${NEXT_PUBLIC_API_URL}/items/getRecordByPage`, {
-                params,
-                paramsSerializer: (params) => {
-                    return Qs.stringify(params, { arrayFormat: 'repeat' });
-                },
-            });
-            setFilteredItems(response.data.records);
-            setPagingController({
-                ...pagingController,
-                totalCount: response.data.total
-            })
-            return response; // Return the data from the response
-        } catch (error) {
-            console.error('Error fetching items:', error);
-            throw error; // Rethrow the error for further handling
-        }
+    const params = {
+      pageNum: pagingController.pageNum,
+      pageSize: pagingController.pageSize,
+      ...filterObj,
+      ...tempSelectedValue,
     };
 
-    const onReset = useCallback(() => {
-        //setFilteredItems(items ?? []);
-        setFilterObj({});
-        setTempSelectedValue({});
-        refetchData(filterObj);
-    }, [items]);
+    try {
+      const response = await axiosInstance.get<ItemsResultResponse>(
+        `${NEXT_PUBLIC_API_URL}/items/getRecordByPage`,
+        {
+          params,
+          paramsSerializer: (params) => {
+            return Qs.stringify(params, { arrayFormat: "repeat" });
+          },
+        },
+      );
+      setFilteredItems(response.data.records);
+      setPagingController({
+        ...pagingController,
+        totalCount: response.data.total,
+      });
+      return response; // Return the data from the response
+    } catch (error) {
+      console.error("Error fetching items:", error);
+      throw error; // Rethrow the error for further handling
+    }
+  };
 
   const onReset = useCallback(() => {
     //setFilteredItems(items ?? []);
     setFilterObj({});
     setTempSelectedValue({});
-    refetchData();
-  }, [items]);
+    refetchData(filterObj);
+  }, [items, filterObj]);
 
   return (
     <>
@@ -220,6 +187,9 @@ const RSSOverview: React.FC<Props> = ({ items }) => {
         onReset={onReset}
       />
       <EditableSearchResults<ItemsResult>
+        index={1} // bug
+        isEdit
+        isEditable
         items={filteredItems}
         columns={columns}
         setPagingController={setPagingController}