Rasadyar_FrontEnd/src/features/file/components/slaughter-house-vet-check-request/SlaughterHouseVetCheckRequest.js

import { Button, TextField, Typography } from "@mui/material";
import React, { useState } from "react";
import { SPACING } from "../../../../data/spacing";
import { AnimatePresence } from "framer-motion";
import {
  DRAWER,
  LOADING_END,
  LOADING_START,
  OPEN_MODAL,
} from "../../../../lib/redux/slices/appSlice";
import { useDispatch } from "react-redux";
import { PropTypes } from "prop-types";
import { Grid } from "../../../../components/grid/Grid";
import { useContext } from "react";
import { AppContext } from "../../../../contexts/AppContext";
import { slaughterHouseVetSendCheckRequest } from "../../services/slaughter-house-vet-send-check-request";
import {
  TimelineConnector,
  TimelineContent,
  TimelineDot,
  TimelineItem,
  TimelineOppositeContent,
  TimelineSeparator,
} from "@mui/lab";
import { slaughterHouseVetNewRequests } from "../../../slaughter-house-vet/services/slaughter-house-vet-new-requests";
// import { SlaughterHouseVetCancelBar } from "../slaughter-house-vet-cancel-bar/SlaughterHouseVetCancelBar";
import { VetFarmCancelBar } from "../../../vet-farm/components/vet-farm-cancel-bar/VetFarmCancelBar";

export default function SlaughterHouseVetCheckRequest({ item }) {
  const dispatch = useDispatch();
  const [openNotif, , selectedDate1, , selectedDate2] = useContext(AppContext);

  const [value, setValue] = useState(item.quantity);
  const [realWeight, setRealWeight] = useState();

  const handleInputChange = (event) => {
    setValue(event.target.value);
  };

  const handleInputChangeRealWeight = (event) => {
    setRealWeight(event.target.value);
  };

  return (
    <TimelineItem sx={{ alignSelf: "flex-start", width: "100%" }}>
      <TimelineSeparator>
        <TimelineDot color={"secondary"} />
        <TimelineConnector />
      </TimelineSeparator>
      <Grid container direction="column" flexWrap="nowrap" flex="1">
        <Grid container alignItems="center">
          <Grid>
            <TimelineOppositeContent
              variant="body1"
              fontWeight="bold"
              // color="secondary"
              color={"secondary"}
            >
              انجام عملیات
            </TimelineOppositeContent>
          </Grid>
          <Grid>
            <TimelineContent color="textSecondary">
              <Typography variant="body2">
                در این مرحله درخواست را بررسی و تایید کنید.
              </Typography>
            </TimelineContent>
          </Grid>
        </Grid>

        <Grid container gap={SPACING.SMALL}>
          <AnimatePresence>
            <Grid
              container
              gap={SPACING.SMALL}
              mt={SPACING.SMALL}
              mx={SPACING.SMALL}
            >
              <Grid>
                <TextField
                  label="تعداد واقعی تحویلی"
                  variant="outlined"
                  type={"number"}
                  value={value}
                  onChange={handleInputChange}
                />
              </Grid>
              <Grid>
                <TextField
                  label="وزن واقعی بار"
                  variant="outlined"
                  type={"number"}
                  value={realWeight}
                  onChange={handleInputChangeRealWeight}
                />
              </Grid>
              <Button
                variant="contained"
                // disabled={!value || !realWeight}
                onClick={() => {
                  dispatch(LOADING_START());
                  dispatch(
                    slaughterHouseVetSendCheckRequest({
                      kill_house_request_key: item.killHouseRequestKey,
                      state: "accepted",
                      accepted_real_quantity: !Number(realWeight)
                        ? 0
                        : Number(value)
                        ? Number(value)
                        : 0,
                      accepted_real_weight: !Number(value)
                        ? 0
                        : Number(realWeight)
                        ? Number(realWeight)
                        : 0,
                    })
                  ).then((r) => {
                    dispatch(LOADING_END());
                    if (r.payload.error) {
                      openNotif({
                        vertical: "top",
                        horizontal: "center",
                        msg: r.payload.error,
                        severity: "error",
                      });
                    } else {
                      dispatch(
                        slaughterHouseVetNewRequests({
                          selectedDate1,
                          selectedDate2,
                        })
                      );
                      dispatch(
                        DRAWER({
                          right: false,
                          bottom: false,
                          top: false,
                          content: null,
                          size: null,
                        })
                      );
                      openNotif({
                        vertical: "top",
                        horizontal: "center",
                        msg: "عملیات با موفقیت انجام شد.",
                        severity: "success",
                      });
                    }
                  });
                }}
              >
                تحویل بار
              </Button>
              <Button
                variant="contained"
                color="error"
                onClick={() => {
                  dispatch(
                    OPEN_MODAL({
                      title: "عملیات لغو بار",
                      content: (
                        <VetFarmCancelBar
                          killHouseRequestKey={item.killHouseRequestKey}
                        />
                      ),
                    })
                  );
                }}
              >
                عدم وصول
              </Button>
            </Grid>
          </AnimatePresence>
        </Grid>
      </Grid>
    </TimelineItem>
  );
}
SlaughterHouseVetCheckRequest.propTypes = {
  file: PropTypes.any,
};