import { Box } from "@mui/material";
import { Grid } from "../components/grid/Grid";
import { SPACING } from "../data/spacing";
import { useLocation } from "react-router-dom";
import {
  ROUTE_STEWARD_INVENTORY,
  ROUTE_STEWARD_SALE_IN_PROVINCE,
  ROUTE_STEWARD_INVENTORY_STOCK,
  ROUTE_STEWARD_DAILY_LIST,
  ROUTE_STEWARD_PURCHASE_OUT_PROVINCE,
  ROUTE_STEWARD_SALE_OUT_PROVINCE,
  ROUTE_STEWARD_SEGMENT,
} from "../routes/routes";
import { BackButton } from "../components/back-button/BackButton";
import { useEffect } from "react";
import { useDispatch, useSelector } from "react-redux";
import { GuildInventoryOperation } from "../features/guild/components/GuildInventoryOperation";
import ResponsiveTable from "../components/responsive-table/ResponsiveTable";
import { StewardDailyList } from "../features/guild/components/StewardDailyList";
import { StewardSegmant } from "../features/guild/components/StewardSegmant";
import { StewardShowProducts } from "../features/steward/components/steward-show-products/StewardShowProducts";
import { fetchStewardBroadcastAndProducts } from "../features/steward/services/handle-fetch-steward-products";
import { StewardStock } from "../features/steward/components/steward-stock/StewardStock";
import { StewardPurchaseOutProvince } from "../features/steward/components/steward-purchase-out-province/StewardPurchaseOutProvince";
import { StewardSellOutOfProvince } from "../features/steward/components/steward-sell-out-of-province/StewardSellOutOfProvince";
import { StewardSellInProvince } from "../features/steward/components/steward-sell-in-province/StewardSellInProvince";

const StewardInventoryPage = () => {
  const { pathname } = useLocation();
  const dispatch = useDispatch();
  const selectedSubUser = useSelector(
    (state) => state.userSlice.selectedSubUser
  );
  const { distributionInfo } = useSelector((state) => state.stewardSlice);

  useEffect(() => {
    if (
      [
        ROUTE_STEWARD_PURCHASE_OUT_PROVINCE,
        ROUTE_STEWARD_INVENTORY,
        ROUTE_STEWARD_SALE_OUT_PROVINCE,
      ].includes(pathname)
    ) {
      dispatch(
        fetchStewardBroadcastAndProducts({
          role_key: selectedSubUser?.key || "",
        })
      );
    }
  }, [pathname, selectedSubUser?.key]);

  return (
    <>
      <Box display={"flex"} justifyContent="center" pb={12}>
        <Grid container xs={12} sm={12} md={10} lg={10}>
          <BackButton />
          {pathname === ROUTE_STEWARD_INVENTORY ? (
            <Grid
              container
              direction="column"
              justifyContent="center"
              alignItems="center"
            >
              <Grid
                container
                width="100%"
                mb={2}
                gap={SPACING.SMALL}
                px={SPACING.SMALL}
              >
                <StewardShowProducts />
                <ResponsiveTable
                  title="اطلاعات پخش"
                  noPagination
                  isDashboard
                  data={[
                    [
                      (
                        distributionInfo?.totalGovernmentalInputWeight ?? 0
                      ).toLocaleString(),
                      (
                        distributionInfo?.totalFreeInputWeight ?? 0
                      ).toLocaleString(),
                      (
                        distributionInfo?.totalGovernmentalOutputWeight ?? 0
                      ).toLocaleString(),
                      (
                        distributionInfo?.totalFreeOutputWeight ?? 0
                      ).toLocaleString(),
                      (
                        distributionInfo?.totalStewardInProvinceAllocationsWeight ??
                        0
                      ).toLocaleString(),
                      (
                        distributionInfo?.totalStewardFreeSaleBarCarcassesWeight ??
                        0
                      ).toLocaleString(),
                      (
                        distributionInfo?.segmentationsWeight ?? 0
                      ).toLocaleString(),
                      (
                        distributionInfo?.totalGovernmentalRemainWeight ?? 0
                      ).toLocaleString(),
                      (
                        distributionInfo?.totalFreeRemainWeight ?? 0
                      ).toLocaleString(),
                    ],
                  ]}
                  columns={[
                    "وزن دولتی (کیلوگرم)",
                    "وزن آزاد (کیلوگرم)",
                    "فروش دولتی (کیلوگرم)",
                    "فروش آزاد (کیلوگرم)",
                    "فروش و توزیع داخل استان (کیلوگرم)",
                    "فروش و توزیع خارج استان (کیلوگرم)",
                    "وزن قطعه بندی (کیلوگرم)",
                    "مانده دولتی (کیلوگرم)",
                    "مانده آزاد (کیلوگرم)",
                  ]}
                />
                <ResponsiveTable
                  title="تعهدات"
                  noPagination
                  isDashboard
                  data={[
                    [
                      (
                        distributionInfo?.totalCommitmentSellingInProvinceGovernmentalWeight ??
                        0
                      ).toLocaleString(),
                      (
                        distributionInfo?.totalSellingInProvinceGovernmentalWeight ??
                        0
                      ).toLocaleString(),
                      (
                        distributionInfo?.totalCommitmentSellingInProvinceGovernmentalRemainWeight ??
                        0
                      ).toLocaleString(),
                      (
                        distributionInfo?.totalCommitmentSellingInProvinceFreeWeight ??
                        0
                      ).toLocaleString(),
                      (
                        distributionInfo?.totalSellingInProvinceFreeWeight ?? 0
                      ).toLocaleString(),
                      (
                        distributionInfo?.totalCommitmentSellingInProvinceFreeRemainWeight ??
                        0
                      ).toLocaleString(),
                    ],
                  ]}
                  columns={[
                    "تعهد دولتی توزیع داخل استان",
                    "توزیع دولتی داخل استان",
                    "باقیمانده تعهد دولتی توزیع داخل استان",
                    "تعهد آزاد توزیع داخل استان",
                    "توزیع آزاد داخل استان",
                    "باقیمانده تعهد آزاد توزیع داخل استان",
                  ]}
                  allColors={{ color: "green", text: "#332a3d" }}
                />
              </Grid>

              <GuildInventoryOperation />
            </Grid>
          ) : null}
          {pathname.includes(ROUTE_STEWARD_INVENTORY_STOCK) && <StewardStock />}
          {pathname.includes(ROUTE_STEWARD_SALE_IN_PROVINCE) && (
            <StewardSellInProvince />
          )}
          {pathname.includes(ROUTE_STEWARD_PURCHASE_OUT_PROVINCE) && (
            <StewardPurchaseOutProvince />
          )}
          {pathname.includes(ROUTE_STEWARD_DAILY_LIST) && <StewardDailyList />}
          {pathname.includes(ROUTE_STEWARD_SALE_OUT_PROVINCE) && (
            <StewardSellOutOfProvince />
          )}
          {pathname.includes(ROUTE_STEWARD_SEGMENT) && <StewardSegmant />}
        </Grid>
      </Box>
    </>
  );
};

export default StewardInventoryPage;
