import React, { useContext, useEffect, useState } from "react";
import { IconButton, Tooltip } from "@mui/material";
import { Grid } from "../../../../components/grid/Grid";
import { useDispatch } from "react-redux";
import RemoveRedEyeIcon from "@mui/icons-material/RemoveRedEye";
import {
  cityFetchSamasatTransportChickens,
  visorsGetSamasatCookieService,
} from "../../../visors/services/fetch-samasat-transport-chickens";
import { DRAWER, LOADING_END } from "../../../../lib/redux/slices/appSlice";
import ResponsiveTable from "../../../../components/responsive-table/ResponsiveTable";
import { TransportChickensDetails } from "../transport-chickens-details/TransportChickensDetails";
import { AppContext } from "../../../../contexts/AppContext";
import { useProvinceName } from "../../../../utils/getProvinceName";

export const TransportChickens = () => {
  const [tableData, setTableData] = useState([]);
  const [openNotif] = useContext(AppContext);
  const [data, setData] = useState([]);
  const dispatch = useDispatch();
  const province = useProvinceName();
  const [cookie, setCookie] = useState();

  useEffect(() => {
    dispatch(visorsGetSamasatCookieService()).then((r) => {
      setCookie(r.payload.data.cookie);
      dispatch(
        cityFetchSamasatTransportChickens({
          cookie: r.payload.data.cookie,
          province:
            province === "hamedan"
              ? "65550"
              : province === "bushehr"
              ? "65527"
              : "65548",
        })
      ).then((r) => {
        dispatch(LOADING_END());
        if (r.error) {
          openNotif({
            vertical: "top",
            horizontal: "center",
            msg: "کوکی معتبر نیست!",
            severity: "error",
          });
        } else {
          setData(r.payload.data);
        }
      });
    });
  }, []);

  useEffect(() => {
    const d = data?.map((item, i) => {
      return [
        i + 1,
        item?.LocationNameProvince,
        item?.LocationNameCity,
        item?.PersonFullName,
        item?.PartIdCode,
        item?.UnitName,
        item?.EpidemiologicCode,
        item?.PostalCode,
        item?.CapacityFemale.toLocaleString(),
        item?.RequestCode,
        item?.SourceCertId,
        item?.HatchingDatePersian,
        item?.HatchingCount?.toLocaleString(),
        item?.RemoveCount,
        item?.RemoveCountTakhlie,
        item?.RemovePartyCount,
        <Tooltip placement="right" title="جزئیات" key={i}>
          <IconButton
            size="small"
            color="primary"
            onClick={() => {
              dispatch(
                DRAWER({
                  right: false,
                  top: true,
                  content: (
                    <TransportChickensDetails
                      code={item?.SourceCertId}
                      cookie={cookie}
                    />
                  ),
                  title: "جزئیات حمل مرغ زنده",
                })
              );
            }}
          >
            <RemoveRedEyeIcon />
          </IconButton>
        </Tooltip>,
      ];
    });

    setTableData(d);
  }, [data]);

  return (
    <Grid container xs={12} mt={2} justifyContent="center">
      <Grid container xs={12} mt={2} justifyContent="center">
        <ResponsiveTable
          paginated
          data={tableData}
          columns={[
            "ردیف",
            "استان",
            "شهر",
            "نام مالک",
            "شناسه یکتا واحد",
            "نام واحد",
            "کد اپیدمیولوژیک واحد",
            "کد پستی",
            "ظرفیت",
            "شماره مجوز",
            "شماره گواهی بهداشتی",
            "تاریخ جوجه ریزی",
            "تعداد جوجه ریزی",
            "مجموع حمل مرغ (تخلیه/ بارگیری)",
            "مجموع حمل مرغ (تایید تخلیه)",
            "تعداد ماشین حمل",
            "جزئیات",
          ]}
          title="گزارش حمل مرغ زنده گله ها بر اساس حمل "
        />
      </Grid>
    </Grid>
  );
};
