import React, { useContext, useEffect, useState } from "react";
import {
  Checkbox,
  FormControlLabel,
  FormGroup,
  Button,
  Typography,
} from "@mui/material";
import { Grid } from "../../../../components/grid/Grid";
import { SPACING } from "../../../../data/spacing";
import { useDispatch, useSelector } from "react-redux";
import { provinceSmsLincenseService } from "../../services/province-sms-license";
import { provinceGetSmsLincenseService } from "../../services/province-get-sms-license";
import { AppContext } from "../../../../contexts/AppContext";

export function ProvinceSmsManageComponent() {
  const [openNotif] = useContext(AppContext);
  const [checkedValues, setCheckedValues] = useState({
    hatching: false,
    poultry_request: false,
    city_approval: false,
    province_approval: false,
    kill_request: false,
    province_kill_request: false,
    farm_veterinarian_approval: false,
    kill_house_house_veterinarian_approval: false,
    assingment_information: false,
    confirmation_of_assingment_information: false,
    invoice_payment: false,
    invoice_payment_confirmation: false,
    inspector_approval: false,
    kill_house_request: false,
  });

  const dispatch = useDispatch();

  const handleChange = (event) => {
    setCheckedValues({
      ...checkedValues,
      [event.target.name]: event.target.checked,
    });
  };

  const { provinceGetSmsLincense } = useSelector(
    (store) => store.provinceSlice
  );

  useEffect(() => {
    dispatch(provinceGetSmsLincenseService());
  }, []);

  useEffect(() => {
    if (provinceGetSmsLincense?.length) {
      setCheckedValues({
        hatching: provinceGetSmsLincense[0]?.hatching,
        poultry_request: provinceGetSmsLincense[0]?.poultryRequest,
        city_approval: provinceGetSmsLincense[0]?.cityApproval,
        province_approval: provinceGetSmsLincense[0]?.provinceApproval,
        kill_request: provinceGetSmsLincense[0]?.killRequest,
        province_kill_request: provinceGetSmsLincense[0]?.provinceKillRequest,
        farm_veterinarian_approval:
          provinceGetSmsLincense[0]?.farmVeterinarianApproval,
        kill_house_house_veterinarian_approval:
          provinceGetSmsLincense[0]?.killHouseHouseVeterinarianApproval,
        assingment_information:
          provinceGetSmsLincense[0]?.assingmentInformation,
        confirmation_of_assingment_information:
          provinceGetSmsLincense[0]?.confirmationOfAssingmentInformation,
        invoice_payment: provinceGetSmsLincense[0]?.invoicePayment,
        invoice_payment_confirmation:
          provinceGetSmsLincense[0]?.invoicePaymentConfirmation,
        inspector_approval: provinceGetSmsLincense[0]?.inspectorApproval,
        kill_house_request: provinceGetSmsLincense[0]?.killHouseRequest,
      });
    }
  }, [provinceGetSmsLincense]);

  const handleSubmit = (event) => {
    event.preventDefault();
    dispatch(provinceSmsLincenseService(checkedValues)).then((r) => {
      openNotif({
        vertical: "top",
        horizontal: "center",
        msg: "عملیات با موفقیت انجام شد.",
        severity: "success",
      });
    });
    // You can do something else with the checkedValues here, like submitting them to a server
  };

  return (
    <Grid container direction="column" alignItems="start" gap={SPACING.SMALL}>
      <Grid>
        <Typography>
          با تغییر دادن این سطوح، می‌توانید تنظیم کنید که کاربران شما پیامک‌های
          خودکار را در چه زمان‌هایی دریافت کنند.
        </Typography>
      </Grid>
      <Grid>
        <form onSubmit={handleSubmit}>
          <FormGroup>
            <FormControlLabel
              control={
                <Checkbox
                  checked={checkedValues.hatching}
                  onChange={handleChange}
                  name="hatching"
                />
              }
              label="جوجه ریزی مرغدار"
            />
            <FormControlLabel
              control={
                <Checkbox
                  checked={checkedValues.poultry_request}
                  onChange={handleChange}
                  name="poultry_request"
                />
              }
              label="درخواست کشتار مرغدار"
            />
            <FormControlLabel
              control={
                <Checkbox
                  checked={checkedValues.city_approval}
                  onChange={handleChange}
                  name="city_approval"
                />
              }
              label="تاییدیه شهرستان"
            />
            <FormControlLabel
              control={
                <Checkbox
                  checked={checkedValues.province_approval}
                  onChange={handleChange}
                  name="province_approval"
                />
              }
              label="تاییدیه استان"
            />
            <FormControlLabel
              control={
                <Checkbox
                  checked={checkedValues.kill_request}
                  onChange={handleChange}
                  name="kill_request"
                />
              }
              label="درخواست کشتار کشتارگاه"
            />
            <FormControlLabel
              control={
                <Checkbox
                  checked={checkedValues.province_kill_request}
                  onChange={handleChange}
                  name="province_kill_request"
                />
              }
              label="تخصیص استان"
            />
            <FormControlLabel
              control={
                <Checkbox
                  checked={checkedValues.farm_veterinarian_approval}
                  onChange={handleChange}
                  name="farm_veterinarian_approval"
                />
              }
              label="تاییدیه دامپزشک فارم"
            />
            <FormControlLabel
              control={
                <Checkbox
                  checked={checkedValues.kill_house_request}
                  onChange={handleChange}
                  name="kill_house_request"
                />
              }
              label="تخصیص کشتارگاه"
            />
            <FormControlLabel
              control={
                <Checkbox
                  checked={checkedValues.kill_house_house_veterinarian_approval}
                  onChange={handleChange}
                  name="kill_house_house_veterinarian_approval"
                />
              }
              label="تاییدیه دامپزشک"
            />
            <FormControlLabel
              control={
                <Checkbox
                  checked={checkedValues.assingment_information}
                  onChange={handleChange}
                  name="assingment_information"
                />
              }
              label="ورود اطلاعات بار"
            />
            <FormControlLabel
              control={
                <Checkbox
                  checked={checkedValues.confirmation_of_assingment_information}
                  onChange={handleChange}
                  name="confirmation_of_assingment_information"
                />
              }
              label="تاییدیه اطلاعات بار/صدور فاکتور"
            />
            <FormControlLabel
              control={
                <Checkbox
                  checked={checkedValues.invoice_payment}
                  onChange={handleChange}
                  name="invoice_payment"
                />
              }
              label="پرداخت فاکتور"
            />
            <FormControlLabel
              control={
                <Checkbox
                  checked={checkedValues.invoice_payment_confirmation}
                  onChange={handleChange}
                  name="invoice_payment_confirmation"
                />
              }
              label="تاییدیه پرداخت فاکتور"
            />
            <FormControlLabel
              control={
                <Checkbox
                  checked={checkedValues.inspector_approval}
                  onChange={handleChange}
                  name="inspector_approval"
                />
              }
              label="تاییدیه بازرس"
            />
            <Grid>
              <Button type="submit" variant="contained">
                ثبت
              </Button>
            </Grid>
          </FormGroup>
        </form>
      </Grid>
    </Grid>
  );
}
