temp/src/Components/SystemNumberDialog.jsx

81 lines
2.6 KiB
JavaScript

import React, { useState, useEffect } from "react";
import Dialog from "@mui/material/Dialog";
import DialogContent from "@mui/material/DialogContent";
import DialogContentText from "@mui/material/DialogContentText";
import DialogTitle from "@mui/material/DialogTitle";
import { Button, Box } from "@mui/material";
import TextField from "@mui/material/TextField";
import { NavLink, Link, useNavigate } from "react-router-dom";
import InputLabel from "@mui/material/InputLabel";
import MenuItem from "@mui/material/MenuItem";
import FormControl from "@mui/material/FormControl";
import Select from "@mui/material/Select";
import { useDispatch,useSelector } from "react-redux";
import { updateSystemNo } from "../redux/actions/actions";
const SystemNumberDialog = (setShowSystemNoContainer,showSystemNoContainer) => {
const dispatch = useDispatch();
const navigate = useNavigate()
const [open, setOpen] = useState(true); // Set open state to true by default
const reduxSystemNo = useSelector((state)=>state?.systemNumber)
console.log("Redux system No : ",reduxSystemNo)
const [systemNo, setSystemNo] = useState(1);
const handleClose = () => {
setOpen(false);
};
const handleSubmit = () => {
console.log("Handling submit")
dispatch(updateSystemNo(systemNo));
navigate("/")
handleClose(true)
};
useEffect(()=>{
console.log("System No in useEffect : ",systemNo)
},[systemNo])
const numberOfSystems = 5;
const selectValues = [];
for (var i = 1; i <= numberOfSystems; i++) {
selectValues.push({ value: Number(i), systemLabel: `System ${i}` });
}
return (
<Dialog open={open} onClose={handleClose}>
<DialogTitle>Choose Your System Number:</DialogTitle>
<DialogContent>
<DialogContentText>
<Select
labelId="system-no-select-label"
id="system-no-select"
className="w-100"
label="System No"
value={systemNo}
onChange={(e) => {
setSystemNo(e.target.value);
}}
>
{selectValues.length > 0 &&
selectValues.map((value) => (
<MenuItem value={value.value}>{value.systemLabel}</MenuItem>
))}
</Select>
<Box className="d-flex justify-content-end gap-2 my-3">
<Button
className="bg-primary p-2 text-light"
onClick={handleSubmit}
>
Submit
</Button>
</Box>
</DialogContentText>
</DialogContent>
</Dialog>
);
};
export default SystemNumberDialog;