69 lines
1.6 KiB
React
69 lines
1.6 KiB
React
|
import {
|
||
|
|
Box,
|
||
|
|
Button,
|
||
|
|
Input,
|
||
|
|
Modal,
|
||
|
|
ModalBody,
|
||
|
|
ModalCloseButton,
|
||
|
|
ModalContent,
|
||
|
|
ModalFooter,
|
||
|
|
ModalHeader,
|
||
|
|
ModalOverlay,
|
||
|
|
Text,
|
||
|
|
Textarea,
|
||
|
|
} from "@chakra-ui/react";
|
||
|
|
|
||
|
|
const UpdateIOStatus = ({ isOpen, onClose }) => {
|
||
|
|
return (
|
||
|
|
<Modal isOpen={isOpen} onClose={onClose}>
|
||
|
|
<ModalOverlay />
|
||
|
|
<ModalContent>
|
||
|
|
<ModalHeader>Update IO Status</ModalHeader>
|
||
|
|
<ModalCloseButton />
|
||
|
|
<ModalBody>
|
||
|
|
<Box mb={"15px"}>
|
||
|
|
<Text as={"label"} fontSize={"sm"} fontWeight={"bold"}>
|
||
|
|
Date
|
||
|
|
</Text>
|
||
|
|
<Input
|
||
|
|
placeholder="Select Date"
|
||
|
|
size="md"
|
||
|
|
type="date"
|
||
|
|
fontSize={"sm"}
|
||
|
|
/>
|
||
|
|
</Box>
|
||
|
|
|
||
|
|
<Box mb={"15px"} fontSize={"sm"} fontWeight={"bold"}>
|
||
|
|
<Text as={"label"}>Amount</Text>
|
||
|
|
<Input placeholder="Enter amount" fontSize={"sm"} />
|
||
|
|
</Box>
|
||
|
|
|
||
|
|
<Box mb={"15px"}>
|
||
|
|
<Text as={"label"} fontSize={"sm"} fontWeight={"bold"}>
|
||
|
|
Comments
|
||
|
|
</Text>
|
||
|
|
<Textarea placeholder="Write Comments" fontSize={"sm"} />
|
||
|
|
</Box>
|
||
|
|
</ModalBody>
|
||
|
|
<ModalFooter>
|
||
|
|
<Button
|
||
|
|
bg={"hsla(139, 100%, 14%, 1)"}
|
||
|
|
mr={3}
|
||
|
|
color={"#fff"}
|
||
|
|
_hover={{
|
||
|
|
bg: "hsl(139deg 98.99% 26.59%)",
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Save
|
||
|
|
</Button>
|
||
|
|
<Button mr={3} onClick={onClose}>
|
||
|
|
Close
|
||
|
|
</Button>
|
||
|
|
</ModalFooter>
|
||
|
|
</ModalContent>
|
||
|
|
</Modal>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export default UpdateIOStatus;
|