import React, { useContext, useEffect, useState } from "react";
import { Grid } from "../../../../components/grid/Grid";
import ResponsiveTable from "../../../../components/responsive-table/ResponsiveTable";
import { useDispatch, useSelector } from "react-redux";
import {
  provinceSubSectorCitySharesWageDetailsDashboard,
  provinceSubSectorCitySharesWageDetailsService,
} from "../../services/province-sub-sectors-services";
import { Checkbox, IconButton, TextField, Tooltip } from "@mui/material";
import SystemUpdateAltIcon from "@mui/icons-material/SystemUpdateAlt";
import { AppContext } from "../../../../contexts/AppContext";
import axios from "axios";
import { DatePicker } from "@mui/x-date-pickers";
import ToggleOffOutlinedIcon from "@mui/icons-material/ToggleOffOutlined";
import ToggleOnIcon from "@mui/icons-material/ToggleOn";
import moment from "moment";

export const ProvinceSubSectorCitySharesWageDetails = () => {
  const userKey = useSelector((state) => state.userSlice.userProfile.key);
  const [, , selectedDate1, setSelectedDate1, selectedDate2, setSelectedDate2] =
    useContext(AppContext);
  const [withDate, setWithDate] = useState(false);

  useEffect(() => {
    const currentDate = moment(new Date()).format("YYYY-MM-DD");
    setSelectedDate1(currentDate);
    setSelectedDate2(currentDate);
  }, []);

  const dispatch = useDispatch();
  const [openNotif] = useContext(AppContext);
  const [tableData, setTableData] = useState([]);
  const [dashboardData, setDashboardData] = useState([]);

  useEffect(() => {
    dispatch(
      provinceSubSectorCitySharesWageDetailsDashboard({
        date1: withDate ? selectedDate1 : null,
        date2: withDate ? selectedDate2 : null,
      })
    ).then((r) => {
      setDashboardData(r.payload.data);
    });

    dispatch(
      provinceSubSectorCitySharesWageDetailsService({
        date1: withDate ? selectedDate1 : null,
        date2: withDate ? selectedDate2 : null,
      })
    ).then((r) => {
      const d = r.payload.data?.map((item, i) => {
        return [
          i + 1,
          item?.unitName,
          item?.user?.city,
          `${item?.user?.fullname} (${item?.user?.mobile})`,
          Math.round(item?.wageInfo?.poultries),
          Math.round(item?.wageInfo?.hatchings),
          Math.round(item?.wageInfo?.hatchingsQuantity)?.toLocaleString(),
          Math.round(
            item?.wageInfo?.totalProvinceKillRequestsQuantity
          )?.toLocaleString(),
          Math.round(
            item?.wageInfo?.totalProvinceKillRequestsWeight
          )?.toLocaleString(),
          Math.round(
            item?.wageInfo?.totalProvinceCarcassesWeight
          )?.toLocaleString(),
          Math.round(
            item?.wageInfo?.totalPureInternalProvinceCarcassesWeight
          )?.toLocaleString(),
          Math.round(
            item?.wageInfo?.totalPureExternalProvinceCarcassesWeight
          )?.toLocaleString(),
          Math.round(
            item?.wageInfo?.outProvincePoultryRequestQuantity
          )?.toLocaleString(),
          Math.round(
            item?.wageInfo?.outProvincePoultryRequestWeight
          )?.toLocaleString(),
          Math.round(item?.wageInfo?.totalKilledQuantity)?.toLocaleString(),
          parseFloat(item?.wageInfo?.hatchingKillingPercent)?.toFixed(1),
          Math.round(
            item?.wageInfo?.outProvincePoultryRequestAmount
          )?.toLocaleString(),
          Math.round(
            item?.wageInfo?.totalPureInternalProvinceCarcassesAmount
          )?.toLocaleString(),
          Math.round(
            item?.wageInfo?.totalPureExternalProvinceCarcassesAmount
          )?.toLocaleString(),
          Math.round(item?.wageInfo?.totalWageAmount)?.toLocaleString(),
          Math.round(item?.wageInfo?.cityDeposit)?.toLocaleString(),
          Math.round(item?.wageInfo?.totalRemainWageAmount)?.toLocaleString(),
        ];
      });
      setTableData(d);
    });
  }, [dispatch, selectedDate1, selectedDate2, withDate]);

  return (
    <Grid
      container
      xs={12}
      justifyContent="center"
      alignItems="center"
      px={{
        xs: 2,
        md: 0,
      }}
    >
      <Grid
        container
        gap={1}
        style={{
          borderStyle: "solid",
          borderWidth: "1px",
          padding: "5px",
          borderRadius: "15px",
          borderColor: "gray",
          justifyContent: "left",
        }}
        alignItems="center"
        mb={{
          xs: 2,
          md: 0,
        }}
      >
        <Checkbox
          icon={<ToggleOffOutlinedIcon />}
          checkedIcon={<ToggleOnIcon />}
          checked={withDate}
          onChange={() => setWithDate(!withDate)}
          color="primary"
          size="large"
        />
        <Grid>
          <DatePicker
            disabled={!withDate}
            label="از تاریخ"
            id="date"
            renderInput={(params) => (
              <TextField
                size="small"
                sx={{ width: { xs: "126px", md: "160px" } }}
                {...params}
              />
            )}
            value={selectedDate1}
            onChange={(e) => {
              setSelectedDate1(moment(e).format("YYYY-MM-DD"));
            }}
          />
        </Grid>
        <Grid>
          <DatePicker
            disabled={!withDate}
            label="تا تاریخ"
            id="date"
            renderInput={(params) => (
              <TextField
                size="small"
                sx={{ width: { xs: "126px", md: "160px" } }}
                {...params}
              />
            )}
            value={selectedDate2}
            onChange={(e) => {
              setSelectedDate2(moment(e).format("YYYY-MM-DD"));
            }}
          />
        </Grid>
      </Grid>
      <Grid
        container
        xs={12}
        justifyContent="center"
        alignItems="center"
        mb={2}
      >
        <ResponsiveTable
          columns={[
            "تعداد فارم",
            "تعداد کل جوجه ریزی",
            "حجم کل جوجه ریزی",
            "حجم کل کشتار شده داخل استان",
            "وزن کل کشتار شده داخل استان",
            "وزن لاشه کشتار شده داخل استان",
            "وزن کل لاشه توزیع داخل استان",
            "وزن کل لاشه توزیع خارج استان",
            "حجم کل فروش به خارج استان",
            "وزن کل فروش به خارج استان",
            "حجم کل کشتار شده",
            "درصد کشتار شده نسبت به جوجه ریزی",
            "تعرفه زنده خارج استان (اتحادیه)",
            "تعرفه کشتار و توزیع داخل استان (اتحادیه)",
            "تعرفه کشتار و توزیع خارج استان (اتحادیه)",
            "کل تعرفه سهم اتحادیه استان",
            "تعرفه سهم زیر بخش ها",
            "واریزی اتحادیه به زیر بخش ها",
            "مانده تعرفه",
          ]}
          data={[
            [
              Math.round(dashboardData?.poultries)?.toLocaleString(),
              Math.round(dashboardData?.hatchings)?.toLocaleString(),
              Math.round(dashboardData?.hatchingsQuantity)?.toLocaleString(),
              Math.round(
                dashboardData?.totalProvinceKillRequestsQuantity
              )?.toLocaleString(),
              Math.round(
                dashboardData?.totalProvinceKillRequestsWeight
              )?.toLocaleString(),
              Math.round(
                dashboardData?.totalProvinceKillRequestsTotalCarcassesWeight
              )?.toLocaleString(),
              Math.round(
                dashboardData?.totalProvinceKillRequestsCarcassesWeight
              )?.toLocaleString(),
              Math.round(
                dashboardData?.totalOutSellingProvinceCarcassesWeight
              )?.toLocaleString(),
              Math.round(
                dashboardData?.outProvincePoultryRequestQuantity
              )?.toLocaleString(),
              Math.round(
                dashboardData?.outProvincePoultryRequestWeight
              )?.toLocaleString(),
              Math.round(dashboardData?.totalKilledQuantity)?.toLocaleString(),
              parseFloat(dashboardData?.hatchingKillingPercent)?.toFixed(1),
              Math.round(
                dashboardData?.unionTotalOutSellingProvinceCarcassesPrice
              )?.toLocaleString(),
              Math.round(
                dashboardData?.totalPureProvinceCarcassesPrice
              )?.toLocaleString(),
              Math.round(
                dashboardData?.outProvincePoultryRequestAmount
              )?.toLocaleString(),
              Math.round(dashboardData?.unionTotalWage)?.toLocaleString(),
              Math.round(dashboardData?.cityTotalWage)?.toLocaleString(),
              Math.round(dashboardData?.cityDeposit)?.toLocaleString(),
              Math.round(
                dashboardData?.cityTotalRemainWageAmount
              )?.toLocaleString(),
            ],
          ]}
          noPagination
          isDashboard
          title="خلاصه اطلاعات"
        />
      </Grid>

      <ResponsiveTable
        paginated
        operation={
          <Grid>
            <Tooltip title="خروجی اکسل" placement="top">
              <IconButton
                color="primary"
                onClick={() => {
                  openNotif({
                    vertical: "top",
                    horizontal: "center",
                    msg: "فایل اکسل در حال دانلود می باشد، این علمیات ممکن است زمان بر باشد لطفا صبر کنید.",
                    severity: "success",
                  });
                  const link = `${
                    axios.defaults.baseURL
                  }sub_section_of_cooperative_share_detail/?key=${userKey}${
                    withDate
                      ? `&date1=${selectedDate1}&date2=${selectedDate2}`
                      : ``
                  }`;
                  window.location.href = link;
                }}
              >
                <SystemUpdateAltIcon />
              </IconButton>
            </Tooltip>
          </Grid>
        }
        columns={[
          "ردیف",
          "تعاونی",
          "شهر",
          "کاربر",
          "تعداد فارم",
          "تعداد کل جوجه ریزی",
          "حجم کل جوجه ریزی",
          "حجم کل کشتار شده داخل استان",
          "وزن کل کشتار شده داخل استان",
          "وزن لاشه کشتار شده داخل استان",
          "وزن لاشه توزیع داخل استان",
          "وزن لاشه توزیع خارج استان",
          "حجم فروش خارج از استان",
          "وزن فروش خارج از استان",
          "حجم کل کشتار شده",
          "درصد کشتار شده نسبت به جوجه ریزی",
          "تعرفه زنده خارج استان",
          "تعرفه کشتار و توزیع داخل استان",
          "تعرفه کشتار و توزیع خارج استان",
          "مجموع تعرفه",
          "واریزی اتحادیه",
          "مانده تعرفه",
        ]}
        data={tableData}
        title="جزئیات تعرفه"
      />
    </Grid>
  );
};
