import { Card, IconButton } from "@mui/material";
import { useEffect, useState } from "react";
import { AdvancedTable } from "../../../../components/advanced-table/AdvancedTable";
import { useDispatch, useSelector } from "react-redux";
import { provinceGetActiveRequestsService } from "../../services/province-get-active-requests";
import { useNavigate } from "react-router-dom";
import { ROUTE_PROVINCE_FILE } from "../../../../routes/routes";
import PlagiarismIcon from "@mui/icons-material/Plagiarism";
import { format } from "date-fns-jalali";

export const ProvinceActiveRequests = () => {
  const dispatch = useDispatch();
  const navigate = useNavigate();
  const { provinceGetActiveRequests } = useSelector(
    (state) => state.provinceSlice
  );
  const [dataTable, setDataTable] = useState([]);

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

  useEffect(() => {
    const d = provinceGetActiveRequests?.map((item, i) => {
      return [
        i + 1,
        item?.poultryRequest?.orderCode,
        format(new Date(item?.poultryRequest?.createDate), "yyyy/MM/dd"),
        format(new Date(item?.poultryRequest?.sendDate), "yyyy/MM/dd"),
        item?.poultryRequest?.process?.poultry?.poultryName,
        item?.poultryRequest?.process?.poultry?.poultryMobile,
        item?.poultryRequest?.process?.poultry?.poultryCity,
        item?.poultryRequest?.process?.poultry?.poultryProvince,
        item?.poultryRequest?.process?.poultry?.age,
        item?.poultryRequest?.process?.poultry?.poultryQuantity,
        <IconButton
          key={i}
          aria-label="delete"
          color="primary"
          onClick={() => {
            navigate(
              ROUTE_PROVINCE_FILE +
                item?.poultryRequest?.process?.poultry?.poultryRequestId
            );
          }}
        >
          <PlagiarismIcon />
        </IconButton>,
      ];
    });
    setDataTable(d);
  }, [provinceGetActiveRequests]);

  return (
    <Card>
      <AdvancedTable
        name={"درخواست های فعال"}
        columns={[
          "ردیف",
          "کد سفارش",
          "تاریخ ثبت درخواست",
          "تاریخ کشتار",
          "مرغدار",
          "تلفن مرغدار",
          "شهر",
          "استان",
          "سن مرغ",
          "تعداد",
          "مشاهده",
        ]}
        data={dataTable}
      />
    </Card>
  );
};