import { useContext, useState } from "react";
import axios from "axios";
import { Box, Typography } from "@mui/material";
import { GrCloudlinux } from "react-icons/gr";
import { motion } from "framer-motion";
import { AppContext } from "../../../../contexts/AppContext";
import { Grid } from "../../../../components/grid/Grid";
import { SPACING } from "../../../../data/spacing";

const ProcincePolicyKronjob = () => {
  const [openNotif] = useContext(AppContext);

  const handleCronjobClick = async (title, link) => {
    try {
      const response = await axios.get(link);
      if (response.status === 200) {
        openNotif({
          vertical: "top",
          horizontal: "center",
          msg: `"${title}" با موفقیت ارسال شد`,
          severity: "success",
        });
      }
    } catch (error) {
      openNotif({
        vertical: "top",
        horizontal: "center",
        msg: `خطا در ارسال  "${title}"`,
        severity: "error",
      });
    }
  };

  const [reportList, setReportList] = useState([
    {
      disabled: false,
      title: "اس ام اس های بدهی ساعت 9 صبح",
      description: "اس ام اس های بدهی",
      link: `${axios.defaults.baseURL}send_gate_way_sms_manual/`,
    },
    {
      disabled: false,
      title: " اس ام اس های بسته شدن پنل برای بدهی",
      description: " اس ام اس های بسته شدن پنل برای بدهی",
      link: `${axios.defaults.baseURL}send_deactivate_panel_debt_sms_manual/`,
    },
    {
      disabled: false,
      title: "وارد کردن بارهای خارج استان به انبار",
      description: "وارد کردن بارهای خارج استان به انبار",
      link: `${axios.defaults.baseURL}add_free_bar_to_warehouse_manual/`,
    },
    {
      disabled: false,
      title: "ساخت بارهای خارج استان",
      description: "ساخت بارهای خارج استان",
      link: `${axios.defaults.baseURL}create_kill_house_free_bar/`,
    },
    {
      disabled: false,
      title: "آپدیت جوجه ریزی ها",
      description: "آپدیت جوجه ریزی ها",
      link: `${axios.defaults.baseURL}api_update_poultry_hatching_from_rsi/`,
    },
    {
      disabled: false,
      title: "تیکت اخطاریه بار های واردنشده به انبار خارج استانی",
      description: "تیکت اخطاریه بار های واردنشده به انبار خارج استانی",
      link: `${axios.defaults.baseURL}warning_free_bar_to_warehouse_manual/`,
      isTicket: true,
    },
    {
      disabled: false,
      title: "تیکت تخصیصات بدون بار",
      description: "تیکت تخصیصات بدون بار",
      link: `${axios.defaults.baseURL}warning_province_kill_request_without_bar_manual/`,
      isTicket: true,
    },
    {
      disabled: false,
      title: "وارد کردن بارهای داخل استانی به انبار",
      description: "وارد کردن بارهای داخل استانی به انبار",
      link: `${axios.defaults.baseURL}add_to_warehouse_manual/`,
    },
    {
      disabled: false,
      title: "خارج کردن تمام افراد",
      description: "خارج کردن تمام افراد",
      link: `${axios.defaults.baseURL}remove_access_token_manual/`,
    },
    {
      disabled: false,
      title: "چک کردن تعداد کد قرنطینه داخل استان",
      description: "چک کردن تعداد کد قرنطینه داخل استان",
      link: `${axios.defaults.baseURL}find_gid_code_manual/`,
    },
    {
      disabled: false,
      title: "آپدیت سن جموجه ریزی",
      description: "آپدیت سن جموجه ریزی",
      link: `${axios.defaults.baseURL}update_chicken_age_from_login_manual/`,
    },
    {
      disabled: false,
      title: "چک کردن کد قرنطینه خارج استان",
      description: "چک کردن کد قرنطینه خارج استان",
      link: `${axios.defaults.baseURL}get_gid_out_province_manual/`,
    },
    {
      disabled: false,
      title: "پیغام تعرفه کل ساعت 4 ایتا",
      description: "پیغام تعرفه کل ساعت 4 ایتا",
      link: `${axios.defaults.baseURL}daily_manual_transaction_for_eata/`,
    },
    {
      disabled:
        process.env.NODE_ENV === "development" ||
        axios.defaults.baseURL.includes("testbackend.rasadyar.com"),
      title: "ارسال دستی پیامک گزارش توزیع گوشت مرغ داخل استان",
      description: "ارسال دستی پیامک گزارش توزیع گوشت مرغ داخل استان",
      link: `${axios.defaults.baseURL}send_daily_distribution_report_sms_manual/`,
    },
    {
      disabled:
        process.env.NODE_ENV === "development" ||
        axios.defaults.baseURL.includes("testbackend.rasadyar.com"),
      title: "ارسال دستی پیامک اطلاعات کشتار مرغ گوشتی",
      description: "ارسال دستی پیامک اطلاعات کشتار مرغ گوشتی",
      link: `${axios.defaults.baseURL}send_daily_slaughter_statistics_sms_manual/`,
    },
    {
      disabled: false,
      title: "ارسال دستی بارها به ایتا",
      description: "ارسال دستی بارها به ایتا",
      link: `${axios.defaults.baseURL}send_all_bar_to_eitaa/`,
    },
    {
      disabled: false,
      title: "ارسال دستی تخصیصات به ایتا فقط برای مرکزی کار میکنه",
      description: "ارسال دستی تخصیصات به ایتا فقط برای مرکزی کار میکنه",
      link: `${axios.defaults.baseURL}bot_eitaa_for_province_kill_request/`,
    },
  ]);

  return (
    <motion.div
      initial={{ opacity: 0 }}
      animate={{ opacity: 1 }}
      exit={{ opacity: 0 }}
    >
      <Box display="flex" justifyContent="center" alignItems="center">
        <Grid container direction="column" xs={12} sm={12} md={10} lg={12}>
          <Grid container xs={12} justifyContent="center" mb={2} px={1}>
            {(reportList || []).map((item, i) => (
              <Grid item xs={6} sm={4} md={4} lg={2} key={item?.id || i} p={1}>
                <Box
                  style={{ outline: "none", color: "#727272" }}
                  onClick={() => {
                    if (!item?.disabled) {
                      const updatedList = reportList.map((report, index) =>
                        index === i ? { ...report, disabled: true } : report
                      );
                      setReportList(updatedList);
                      handleCronjobClick(item?.title, item?.link);
                    }
                  }}
                  sx={{ cursor: "pointer" }}
                >
                  <motion.div
                    whileHover={{ scale: item?.disabled ? null : 1.05 }}
                    whileTap={{ scale: item?.disabled ? null : 0.9 }}
                  >
                    <Box
                      p={SPACING?.SMALL || 2}
                      border="1px solid #E6E6E6"
                      borderRadius={SPACING?.SMALL || 1}
                      bgcolor="#FCFCFC"
                      display="flex"
                      flexDirection="column"
                      alignItems="center"
                      sx={{
                        cursor: item?.disabled ? "not-allowed" : "pointer",
                      }}
                      minHeight="11rem"
                      maxHeight="11rem"
                    >
                      <Box
                        sx={{
                          width: 60,
                          minWidth: 60,
                          height: 60,
                          minHeight: 60,
                          borderRadius: "50%",
                          backgroundColor: item?.disabled ? "gray" : "#244CCC",
                          display: "flex",
                          justifyContent: "center",
                          alignItems: "center",
                          marginBottom: SPACING?.SMALL || 1,
                        }}
                      >
                        {item?.icon || (
                          <GrCloudlinux size={24} color="#FFFFFF" />
                        )}
                      </Box>
                      <Typography
                        variant="body1"
                        mt={SPACING?.TINY || 0.5}
                        sx={{
                          color: "#727272",
                          minHeight: "50px",
                          fontWeight: { xs: 600, md: 600 },
                          fontSize: { xs: "13px", md: "16px" },
                        }}
                      >
                        {item?.title || ""}
                      </Typography>
                      <Typography
                        mt={SPACING?.TINY || 0.5}
                        sx={{
                          color: "#727272",
                          fontSize: { xs: "10px", md: "12px" },
                        }}
                      >
                        {item?.description || ""}
                      </Typography>
                    </Box>
                  </motion.div>
                </Box>
              </Grid>
            ))}
          </Grid>
        </Grid>
      </Box>
    </motion.div>
  );
};

export default ProcincePolicyKronjob;
