import { Box } from "@mui/material";
import { Grid } from "../components/grid/Grid";
import { useLocation } from "react-router-dom";
import {
  ROUTE_STEWARD_INVENTORY,
  ROUTE_SLAUGHTER_INVENTORY,
  ROUTE_SLAUGHTER_INVENTORY_SELL_CARCASS_IN_PROVINCE,
  ROUTE_SLAUGHTER_INVENTORY_SELL_CARCASS_OUT_PROVINCE,
  ROUTE_SLAUGHTER_INVENTORY_STOCK,
  ROUTE_SLAUGHTER_DAILY_LIST,
  ROUTE_SLAUGHTER_SEGMENTATION,
  ROUTE_SLAUGHTER_ORDERS,
  ROUTE_SLAUGHTER_OUT_PROVINCE_BUY,
} from "../routes/routes";
import { BackButton } from "../components/back-button/BackButton";
import { SlaughterStockWrapper } from "../features/slaughter-house/components/slaughter-stock-wrapper/SlaughterStockWrapper";
import { SlaughterSellCarcass } from "../features/slaughter-house/components/slaughter-sell-carcass/SlaughterSellCarcass";
import { SlaughterSellCarcassOutProvincePage } from "../features/slaughter-house/components/slaughter-sell-carcass-out-province/SlaughterSellCarcassOutProvince";
import { useDispatch, useSelector } from "react-redux";
import { useEffect } from "react";
import { SlaughterDailyList } from "../features/slaughter-house/components/slaughter-daily-list/SlaughterDailyList";
import { SlaughterSegmentation } from "../features/slaughter-house/components/slaughter-segmentation/SlaughterSegmentation";
import { SlaughterOrders } from "../features/slaughter-house/components/slaughter-orders/SlaughterOrders";
import { SlaughterInventorySummary } from "../features/slaughter-house/components/slaughter-inventory-summary/SlaughterInventorySummary";
import { fetchSlaughterBroadcastAndProducts } from "../features/slaughter-house/services/handle-fetch-slaughter-products";
import { getKillhouseApprovedPriceState } from "../features/province/services/get-approved-price-state";
import { SPACING } from "../data/spacing";
import { NavLink } from "../components/nav-link/NavLink";
import LinkItem from "../components/link-item/LinkItem";
import WarehouseIcon from "@mui/icons-material/Warehouse";
import StoreIcon from "@mui/icons-material/Store";
import PublicIcon from "@mui/icons-material/Public";
import ContentCutIcon from "@mui/icons-material/ContentCut";
import { SlaughterFreeBuyBars } from "../features/slaughter-house/components/slaughter-free-buy-bars/SlaughterFreeBuyBars";
import { checkPathStartsWith } from "../utils/checkPathStartsWith";
// import { Grading } from "@mui/icons-material";

const SlaughterInventoryPage = () => {
  const { pathname } = useLocation();
  const dispatch = useDispatch();
  const { distributionInfo, priceInfo } = useSelector(
    (state) => state.slaughterSlice
  );
  const selectedSubUser = useSelector(
    (state) => state.userSlice.selectedSubUser
  );

  useEffect(() => {
    if (
      [
        ROUTE_SLAUGHTER_INVENTORY,
        ROUTE_SLAUGHTER_INVENTORY_SELL_CARCASS_OUT_PROVINCE,
      ].includes(pathname)
    ) {
      dispatch(
        fetchSlaughterBroadcastAndProducts({
          role_key: checkPathStartsWith("slaughter")
            ? selectedSubUser?.key || ""
            : "",
        })
      );
      dispatch(
        getKillhouseApprovedPriceState({
          role_key: checkPathStartsWith("slaughter")
            ? selectedSubUser?.key || ""
            : "",
        })
      );
    }
  }, [pathname, selectedSubUser?.key]);

  return (
    <>
      <Box display={"flex"} justifyContent="center">
        {pathname === ROUTE_SLAUGHTER_INVENTORY && (
          <Grid
            container
            direction="column"
            justifyContent="center"
            xs={12}
            sm={12}
            md={10}
            lg={10}
          >
            <BackButton />
            <SlaughterInventorySummary priceInfo={priceInfo} />
          </Grid>
        )}
      </Box>
      {/* )} */}
      {(pathname === ROUTE_SLAUGHTER_INVENTORY ||
        pathname === ROUTE_STEWARD_INVENTORY) && (
        <Grid
          container
          gap={SPACING.SMALL}
          p={SPACING.SMALL}
          justifyContent="center"
          mt={SPACING.MEDIUM}
          xs={12}
          alignItems="center"
          width="1040px"
          mx="auto"
        >
          {/* <NavLink to={ROUTE_SLAUGHTER_INVENTORY_SUMMARY}>
            <LinkItem
              icon={<AssessmentIcon sx={{ fontSize: 30, color: "#244CCC" }} />}
              title="خلاصه انبار"
            />
          </NavLink> */}

          <NavLink to={ROUTE_SLAUGHTER_INVENTORY_STOCK}>
            <LinkItem
              icon={<WarehouseIcon sx={{ fontSize: 30, color: "#244CCC" }} />}
              title="ورود به انبار"
            />
          </NavLink>

          <NavLink to={ROUTE_SLAUGHTER_INVENTORY_SELL_CARCASS_IN_PROVINCE}>
            <LinkItem
              icon={<StoreIcon sx={{ fontSize: 30, color: "#244CCC" }} />}
              title="فروش داخل استان"
            />
          </NavLink>

          <NavLink to={ROUTE_SLAUGHTER_INVENTORY_SELL_CARCASS_OUT_PROVINCE}>
            <LinkItem
              icon={<PublicIcon sx={{ fontSize: 30, color: "#244CCC" }} />}
              title="فروش به خارج استان"
            />
          </NavLink>
          <NavLink to={ROUTE_SLAUGHTER_OUT_PROVINCE_BUY}>
            <LinkItem
              icon={<PublicIcon sx={{ fontSize: 30, color: "#244CCC" }} />}
              title="خرید خارج از استان"
            />
          </NavLink>

          <NavLink to={ROUTE_SLAUGHTER_SEGMENTATION}>
            <LinkItem
              icon={<ContentCutIcon sx={{ fontSize: 30, color: "#244CCC" }} />}
              title="قطعه بندی"
            />
          </NavLink>

          {/* <NavLink to={ROUTE_SLAUGHTER_DAILY_LIST}>
            <LinkItem
              icon={<ListAltIcon sx={{ fontSize: 30, color: "#244CCC" }} />}
              title="لیست روزانه"
            />
          </NavLink> */}

          {/* <NavLink to={ROUTE_SLAUGHTER_ORDERS}>
            <LinkItem
              icon={<Grading sx={{ fontSize: 30, color: "#244CCC" }} />}
              title="سفارشات"
            />
          </NavLink> */}
        </Grid>
      )}

      {/* {pathname.includes(ROUTE_SLAUGHTER_INVENTORY_SUMMARY) && ( */}

      {pathname.includes(ROUTE_SLAUGHTER_INVENTORY_STOCK) && (
        <Box display={"flex"} justifyContent="center">
          <Grid
            container
            direction="column"
            justifyContent="center"
            xs={12}
            sm={12}
            md={10}
            lg={10}
          >
            <BackButton />
            <SlaughterStockWrapper />
          </Grid>
        </Box>
      )}

      {pathname.includes(
        ROUTE_SLAUGHTER_INVENTORY_SELL_CARCASS_OUT_PROVINCE
      ) && (
        <Box display={"flex"} justifyContent="center">
          <Grid
            container
            direction="column"
            justifyContent="center"
            xs={12}
            sm={12}
            md={10}
            lg={10}
          >
            <BackButton />
            <SlaughterSellCarcassOutProvincePage />
          </Grid>
        </Box>
      )}

      {pathname.includes(ROUTE_SLAUGHTER_DAILY_LIST) && (
        <Box display={"flex"} justifyContent="center">
          <Grid
            container
            direction="column"
            justifyContent="center"
            xs={12}
            sm={12}
            md={10}
            lg={10}
          >
            <BackButton />
            <SlaughterDailyList />
          </Grid>
        </Box>
      )}

      {pathname.includes(
        ROUTE_SLAUGHTER_INVENTORY_SELL_CARCASS_IN_PROVINCE
      ) && (
        <Box display={"flex"} justifyContent="center">
          <Grid
            container
            direction="column"
            justifyContent="center"
            xs={12}
            sm={12}
            md={10}
            lg={10}
          >
            <BackButton />
            <SlaughterSellCarcass distributionInfo={distributionInfo} />
          </Grid>
        </Box>
      )}

      {pathname.includes(ROUTE_SLAUGHTER_SEGMENTATION) && (
        <Box display={"flex"} justifyContent="center">
          <Grid
            container
            direction="column"
            justifyContent="center"
            xs={12}
            sm={12}
            md={10}
            lg={10}
          >
            <BackButton />
            <SlaughterSegmentation />
          </Grid>
        </Box>
      )}

      {pathname.includes(ROUTE_SLAUGHTER_ORDERS) && (
        <Box display={"flex"} justifyContent="center">
          <Grid
            container
            direction="column"
            justifyContent="center"
            xs={12}
            sm={12}
            md={10}
            lg={10}
          >
            <BackButton />
            <SlaughterOrders />
          </Grid>
        </Box>
      )}

      {pathname.includes(ROUTE_SLAUGHTER_OUT_PROVINCE_BUY) && (
        <Box display={"flex"} justifyContent="center">
          <Grid
            container
            direction="column"
            justifyContent="center"
            xs={12}
            sm={12}
            md={10}
            lg={10}
          >
            <BackButton />
            <SlaughterFreeBuyBars />
          </Grid>
        </Box>
      )}
    </>
  );
};

export default SlaughterInventoryPage;