import { useEffect, useState } from "react";
import { useDispatch, useSelector } from "react-redux";
import { AdvancedTable } from "../../../../components/advanced-table/AdvancedTable";
import { Grid } from "../../../../components/grid/Grid";
import { formatJustDate } from "../../../../utils/formatTime";
import { jahadIllegalKillingService } from "../../services/jahad-illegal-killing";

export const JahadIllegalKillingComponent = () => {
  const dispatch = useDispatch();
  const { jahadIllegalKilling } = useSelector((state) => state.jahadSlice);

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

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

  useEffect(() => {
    const d = jahadIllegalKilling?.map((item, i) => {
      const killedNumber = item.quantity - item.losses - item.leftOver;
      return [
        i + 1,
        item.poultry.unitName,
        item.poultry.userprofile.baseOrder,
        item.poultry.userprofile.mobile,
        item.hall,
        item.period,
        formatJustDate(item?.createDate),
        formatJustDate(item?.date),
        item.chickenBreed,
        item.age,
        item.quantity,
        `${item.losses} (%${((item.losses * 100) / item.quantity).toFixed(0)})`,
        killedNumber +
          ` (%${((killedNumber * 100) / item.quantity).toFixed(0)})`,
        `${item.leftOver} (%${((item.leftOver * 100) / item.quantity).toFixed(
          0
        )})`,
        item.message,
      ];
    });

    setDataTable(d);
  }, [jahadIllegalKilling]);

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