import { Grid, IconButton } from "@mui/material";
import PlagiarismIcon from "@mui/icons-material/Plagiarism";
import { useDispatch, useSelector } from "react-redux";
import { useEffect, useState } from "react";
import { inspectorGetNewRequests } from "../../services/inspector-new-requests";
import { SPACING } from "../../../../data/spacing";
import { SimpleTable } from "../../../../components/simple-table/SimpleTable";
import { ROUTE_INSPECTOR_FILE } from "../../../../routes/routes";
import { useNavigate } from "react-router-dom";
import { DRAWER } from "../../../../lib/redux/slices/appSlice";
import { InspectorRequestOperations } from "../../../file/components/inspector-request-operations/InspectorRequestOperations";
import EditIcon from "@mui/icons-material/Edit";
import { formatJustDate } from "../../../../utils/formatTime";

export const InspectorNewRequests = () => {
  const navigate = useNavigate();
  const { inspectorNewRequests } = useSelector((state) => state.inspectorSlice);
  const dispatch = useDispatch();

  useEffect(() => {
    dispatch(inspectorGetNewRequests());
  }, []);

  const [dataTable, setDataTable] = useState([]);

  useEffect(() => {
    const d = inspectorNewRequests
      ?.filter((item) => !item.inspector || item.inspector === "pending")
      ?.map((item, i) => {
        return [
          i + 1,
          item.orderCode,
          formatJustDate(item?.createDate),
          formatJustDate(item?.sendDate),
          item?.process?.poultry?.poultryName,
          item?.process?.poultry?.poultryMobile,
          item?.process?.poultry?.poultryCity,
          item?.process?.poultry?.poultryProvince,
          item?.process?.poultry?.age,
          item?.process?.poultry?.poultryQuantity,
          <IconButton
            key={i}
            color="primary"
            onClick={() => {
              dispatch(
                DRAWER({
                  title: "عملیات تایید / رد بازرس",
                  // right: !(window.innerWidth <= 600),
                  top: !(window.innerWidth <= 600),
                  bottom: window.innerWidth <= 600,
                  content: (
                    <InspectorRequestOperations process={item.process} />
                  ),
                })
              );
            }}
          >
            <EditIcon />
          </IconButton>,
          <IconButton
            key={i}
            aria-label="delete"
            color="primary"
            onClick={() =>
              navigate(
                ROUTE_INSPECTOR_FILE + item?.process?.poultry?.poultryRequestId
              )
            }
          >
            <PlagiarismIcon />
          </IconButton>,
        ];
      });
    setDataTable(d);
  }, [inspectorNewRequests]);

  const [tableDataCol] = useState([
    "ردیف",
    "کد سفارش",
    "تاریخ ثبت درخواست",
    "تاریخ درخواست",
    "مرغدار",
    "تلفن مرغدار",
    "شهر",
    "استان",
    "سن مرغ",
    "تعداد",
    "عملیات",
    "مشاهده",
  ]);

  return (
    <>
      <Grid xs={12} mt={SPACING.SMALL}>
        <SimpleTable
          name={"درخواست های جدید در انتظار برای بررسی"}
          columns={tableDataCol}
          data={dataTable}
        />
      </Grid>
    </>
  );
};
