import { LinearProgress, Typography } from "@mui/material";
import { useEffect, useRef, useState } from "react";
import { useDispatch } from "react-redux";
import { Grid } from "../../../../components/grid/Grid";
import { SPACING } from "../../../../data/spacing";
import { getRoleFromUrl } from "../../../../utils/getRoleFromUrl";
import { slaughterPaymentRefIdService } from "../../services/salughter-payment-refid";
import {
  provincePaymentRefIdService,
  provincePaymentRefIdWagesService,
} from "../../../province/services/province-payment-refId";

export const SlaughterPayFeesGateway = ({
  amount,
  user_key,
  amountWithTax,
  isZarinPal,
  isPayment,
  isPaymentData,
  backend,
}) => {
  const dispatch = useDispatch();
  const formRef = useRef();
  const [refId, setRefId] = useState();
  const [authority, setAuthority] = useState();

  const handleSubmit = () => {
    formRef.current.submit();
  };

  useEffect(() => {
    if (isZarinPal) {
      dispatch(
        provincePaymentRefIdService({
          role: getRoleFromUrl(),
          total_amount: parseInt(amount),
        })
      ).then((r) => {
        // setAuthority(r.payload.data?.authority);
        setAuthority(r.payload.data?.token);
      });
    } else if (isPayment) {
      dispatch(
        provincePaymentRefIdWagesService({ data: isPaymentData, backend })
      ).then((r) => {
        // setAuthority(r.payload.data?.authority);
        setAuthority(r.payload.data?.token);
      });
    } else {
      dispatch(
        slaughterPaymentRefIdService({
          role: getRoleFromUrl(),
          kill_house_key: user_key,
          payment_type: "auto",
          amount: parseInt(amount),
          amount_with_tax: parseInt(amountWithTax),
        })
      ).then((r) => {
        setRefId(r.payload.data.refId);
      });
    }
  }, []);

  useEffect(() => {
    if (refId) {
      handleSubmit();
    }
  }, [refId]);

  useEffect(() => {
    if (authority) {
      // window.location.href = `https://www.zarinpal.com/pg/StartPay/${authority}`;
      // window.location.href = `https://sep.shaparak.ir/OnlinePG/SendToken?token=${authority}`;
      handleSubmit();
    }
  }, [authority]);

  return (
    <Grid container direction="column" width="100%" gap={SPACING.TINY}>
      <LinearProgress style={{ width: "100%" }} />
      <Typography textAlign={"center"}>
        در حال انتقال به درگاه پرداخت...
      </Typography>
      <div style={{ display: "none" }}>
        {/* <form
          ref={formRef}
          name="input"
          action="https://bpm.shaparak.ir/pgwchannel/startpay.mellat"
          method="post"
          // target="_blank"
        >
          <input type="text" id="RefId" name="RefId" value={refId} />
          <input type="submit" value="Submit" />
        </form> */}
        <form
          ref={formRef}
          action="https://sep.shaparak.ir/OnlinePG/OnlinePG"
          method="post"
        >
          <input type="hidden" name="Token" value={authority} />
          <input name="GetMethod" type="text" value="" />
          <input type="submit" value="Submit" />
        </form>
      </div>
    </Grid>
  );
};