This commit is contained in:
2024-07-09 19:05:45 +05:30
8 changed files with 288 additions and 63 deletions

View File

@@ -7,6 +7,8 @@ import { TbClock2 } from "react-icons/tb";
import { CiWallet } from "react-icons/ci";
import { HiOutlineReceiptPercent } from "react-icons/hi2";
import { IoMdQrScanner } from "react-icons/io";
import { GrDocumentPdf } from "react-icons/gr";
import { AiOutlineFileGif } from "react-icons/ai";
const getRandomDate = (start, end) => {
const date = new Date(
@@ -488,8 +490,22 @@ const GlobalStateProvider = ({ children }) => {
updateOn: "28-Jun-24",
},
]);
const [create, setCreate] = useState([
{
id: 1,
Type: <GrDocumentPdf />,
fileName: "Investment Private Company",
document: "Investment.pdf",
status: true,
},
{
id: 2,
Type: <AiOutlineFileGif />,
fileName: "Investment Private",
document: "Investment.pdf",
status: true,
},
]);
const [keyMerits, setKeyMerits] = useState([
{
id: 1,
@@ -1576,8 +1592,8 @@ const GlobalStateProvider = ({ children }) => {
setDeleteRequest,
viewIO,
setViewIO,
// create,
// setCreate,
create,
setCreate,
keyMerits,
setKeyMerits,
iOArtifacts,

View File

@@ -6,7 +6,6 @@ import {
Text,
Tooltip,
useDisclosure,
VStack,
useToast,
} from "@chakra-ui/react";
import React, { useContext, useEffect, useRef, useState } from "react";
@@ -25,37 +24,35 @@ import {
} from "@chakra-ui/icons";
import { GrDocumentPdf } from "react-icons/gr";
import { AiOutlineFileGif } from "react-icons/ai";
import InvestmentView from "../ViewIO/InvestmentView";
import InvestmentEdit from "../EditIO/InvestmentEdit";
const InvestmentDocument = ({ control, errors, enableNextTab, index }) => {
const { slideFromRight } =
useContext(GlobalStateContext);
const { slideFromRight, create, setCreate } = useContext(GlobalStateContext);
const firstField = useRef();
const secondField = useRef();
const thirdField = useRef();
const [searchTerm, setSearchTerm] = useState("");
const [isLoading, setIsLoading] = useState(true);
const [deleteAlert, setDeleteAlert] = useState(false);
const [actionId, setActionId] = useState(null);
const [mouseEntered, setMouseEntered] = useState(false);
const [mouseEnteredId, setMouseEnteredId] = useState("");
const { isOpen, onOpen, onClose } = useDisclosure();
const {
isOpen: isViewOpen,
onOpen: onViewOpen,
onClose: onViewClose,
} = useDisclosure();
const {
isOpen: isEditOpen,
onOpen: onEditOpen,
onClose: onEditClose,
} = useDisclosure();
const [actionId, setActionId] = useState(null);
const navigate = useNavigate();
const toast = useToast();
const [create, setCreate] = useState([
{
id: 1,
Type: <GrDocumentPdf />,
fileName: "Investment Private Company",
document: "Investment.pdf",
status: true,
},
{
id: 2,
Type: <AiOutlineFileGif />,
fileName: "Investment Private",
document: "Investment.pdf",
status: true,
},
]);
useEffect(() => {
const timer = setTimeout(() => {
@@ -96,6 +93,16 @@ const InvestmentDocument = ({ control, errors, enableNextTab, index }) => {
setIsLoading(true);
};
const handleView = (id) => {
setActionId(id)
onViewOpen();
};
const handleEdit = (id) => {
setActionId(id)
onEditOpen();
};
const extractedArray = filteredData.map((item, index) => ({
"Sr.no": (
<Text
@@ -115,7 +122,7 @@ const InvestmentDocument = ({ control, errors, enableNextTab, index }) => {
color="teal.900"
fontWeight="500"
className="d-flex align-items-center"
fontSize={'xl'}
fontSize={"xl"}
>
{item.Type}
</Text>
@@ -150,7 +157,7 @@ const InvestmentDocument = ({ control, errors, enableNextTab, index }) => {
>
<Button
_hover={{ color: "green.500" }}
onClick={() => navigate(`view-investment/${item.id}`)}
onClick={() => handleView(item.id)}
color="green.300"
rounded="sm"
size="xs"
@@ -168,6 +175,7 @@ const InvestmentDocument = ({ control, errors, enableNextTab, index }) => {
>
<Button
_hover={{ color: "blue.500" }}
onClick={() => handleEdit(item.id)}
color="blue.400"
rounded="sm"
size="xs"
@@ -238,15 +246,26 @@ const InvestmentDocument = ({ control, errors, enableNextTab, index }) => {
rounded="sm"
color="green"
>
Add document
Add Document
</Button>
<InvestmentDocuments
create={create}
setCreate={setCreate}
create={create}
setCreate={setCreate}
isOpen={isOpen}
onClose={onClose}
firstField={firstField}
/>
<InvestmentView
id={actionId}
isOpen={isViewOpen}
onClose={onViewClose}
secondField={secondField}
/>
<InvestmentEdit
isOpen={isEditOpen}
onClose={onEditClose}
thirdField={thirdField}
/>
</Box>
<DataTable
emptyMessage="We don't have any Sponsors"

View File

@@ -0,0 +1,121 @@
import {
Button,
Drawer,
DrawerBody,
DrawerCloseButton,
DrawerContent,
DrawerFooter,
DrawerHeader,
FormControl,
FormLabel,
Input,
Box,
Text,
} from "@chakra-ui/react";
import React, { useContext, useEffect } from "react";
import { investmentDocSchema } from "../InvestmentDocuments";
import { yupResolver } from "@hookform/resolvers/yup";
import { useForm } from "react-hook-form";
import GlobalStateContext from "../../../Contexts/GlobalStateContext";
const InvestmentEdit = ({ isOpen, onClose, thirdField, id }) => {
const { create, setCreate } = useContext(GlobalStateContext);
const filteredObject = create?.find((item) => item?.id === id);
const {
control,
handleSubmit,
reset,
register,
formState: { errors },
} = useForm({
resolver: yupResolver(investmentDocSchema),
});
useEffect(() => {
if (filteredObject) {
reset(filteredObject);
}
}, [id, create, reset]);
const onSubmit = (data) => {
const updatedCreate = create.map((item) =>
item.id === id ? { ...item, ...data } : item
);
setCreate(updatedCreate);
onClose();
};
return (
<Drawer isOpen={isOpen} placement="right" onClose={onClose} initialFocusRef={thirdField}>
<DrawerContent>
<DrawerCloseButton />
<DrawerHeader fontSize={"md"}>Edit Document</DrawerHeader>
<Box as="form" onSubmit={handleSubmit(onSubmit)}>
<DrawerBody>
<FormControl mb={4} isInvalid={errors.fileName}>
<FormLabel fontSize="sm">File Name</FormLabel>
<Input
fontSize="sm"
type="text"
size="sm"
{...register("fileName")}
/>
{errors.fileName && (
<Text color="red.500" fontSize="sm">
{errors.fileName.message}
</Text>
)}
</FormControl>
<FormControl mb={4} isInvalid={errors.document}>
<FormLabel fontSize="sm">Document</FormLabel>
<Input
fontSize="sm"
type="text"
size="sm"
{...register("document")}
/>
{errors.document && (
<Text color="red.500" fontSize="sm">
{errors.document.message}
</Text>
)}
</FormControl>
<FormControl mb={4} isInvalid={errors.Type}>
<FormLabel fontSize="sm">Type</FormLabel>
<Input
fontSize="sm"
type="text"
size="sm"
{...register("Type")}
/>
{errors.Type && (
<Text color="red.500" fontSize="sm">
{errors.Type.message}
</Text>
)}
</FormControl>
</DrawerBody>
<DrawerFooter>
<Button
variant="outline"
colorScheme="green"
rounded="sm"
size="sm"
mr={3}
onClick={onClose}
>
Cancel
</Button>
<Button colorScheme="green" rounded="sm" size="sm" type="submit">
Save
</Button>
</DrawerFooter>
</Box>
</DrawerContent>
</Drawer>
);
};
export default InvestmentEdit;

View File

@@ -86,7 +86,7 @@ const InvestmentDocuments = ({ id, isOpen, onClose, firstField, create, setCreat
return <GrDocumentPdf />;
case 'application/vnd.openxmlformats-officedocument.wordprocessingml.document':
case 'application/msword':
return <TbFileTypeDocx />;
return <TbFileTypeDocx fontSize={'16px'} />;
case 'image/jpeg':
case 'image/png':
case 'image/gif':

View File

@@ -0,0 +1,78 @@
import {
Button,
Drawer,
DrawerBody,
DrawerCloseButton,
DrawerContent,
DrawerFooter,
DrawerHeader,
FormControl,
FormLabel,
Input,
Text,
Box,
} from "@chakra-ui/react";
import React, { useContext } from "react";
import GlobalStateContext from "../../../Contexts/GlobalStateContext";
const InvestmentView = ({ isOpen, onClose, secondField, id }) => {
console.log(id);
const { create, setCreate } = useContext(GlobalStateContext);
const filteredObject = create?.find((item) => item?.id === id)
console.log(filteredObject);
return (
<Drawer
isOpen={isOpen}
placement="right"
onClose={onClose}
initialFocusRef={secondField}
>
<DrawerContent>
<DrawerCloseButton />
<DrawerHeader fontSize={'md'}>View Document</DrawerHeader>
<DrawerBody>
<>
<FormControl mb={4}>
<FormLabel fontSize="sm">File Name</FormLabel>
<Text
fontSize="sm"
type="text"
size="sm"
>{filteredObject?.fileName}</Text>
</FormControl>
<FormControl mb={4}>
<FormLabel fontSize="sm">Document</FormLabel>
<Text
fontSize="sm"
type="text"
size="sm"
>{filteredObject?.document}</Text>
</FormControl>
<FormControl mb={4}>
<FormLabel fontSize="sm">Type</FormLabel>
<Text
fontSize="xl"
type="text"
size="sm"
>{filteredObject?.Type}</Text>
</FormControl>
</>
</DrawerBody>
<DrawerFooter>
<Button
variant="outline"
colorScheme="green"
rounded="sm"
size="sm"
mr={3}
onClick={onClose}
>
Cancel
</Button>
</DrawerFooter>
</DrawerContent>
</Drawer>
);
};
export default InvestmentView;

View File

@@ -46,19 +46,14 @@ const EditSponser = () => {
}
}, [params, sponser, reset]);
if (!foundObject) {
return <Box>Loading...</Box>; // or any loading indicator
}
const formFields = [
{
label: "Sponser name (English)",
placeHolder:" ",
placeHolder: " ",
name: "sponserName",
type: "text",
isRequired: true,
@@ -67,7 +62,7 @@ const EditSponser = () => {
{
label: "Sponser Name (Arabic)",
name: "sponserNameArabic",
placeHolder:" ",
placeHolder: " ",
type: "text",
isRequired: true,
arabic: true,
@@ -76,7 +71,7 @@ const EditSponser = () => {
{
label: "Description (English)",
name: "description",
placeHolder:" ",
placeHolder: " ",
type: "textarea",
isRequired: true,
section: "Add Details",
@@ -84,7 +79,7 @@ const EditSponser = () => {
{
label: "Description (Arabic)",
name: "descriptionArabic",
placeHolder:" ",
placeHolder: " ",
type: "textarea",
isRequired: true,
arabic: true,
@@ -92,8 +87,8 @@ const EditSponser = () => {
},
{
label: "Address (English)",
name: "sponserAddress",
placeHolder:" ",
name: "sponserAddress",
placeHolder: " ",
type: "text",
isRequired: true,
section: "Add Details",
@@ -101,7 +96,7 @@ const EditSponser = () => {
{
label: "Address (Arabic)",
name: "sponserAddressArabic",
placeHolder:" ",
placeHolder: " ",
type: "text",
isRequired: true,
arabic: true,
@@ -110,7 +105,7 @@ const EditSponser = () => {
{
label: "Bank Name (English)",
name: "bankName",
placeHolder:" ",
placeHolder: " ",
type: "text",
isRequired: true,
section: "Add Details",
@@ -118,7 +113,7 @@ const EditSponser = () => {
{
label: "Bank Name (Arabic)",
name: "bankNameArabic",
placeHolder:" ",
placeHolder: " ",
type: "text",
isRequired: true,
arabic: true,
@@ -127,7 +122,7 @@ const EditSponser = () => {
{
label: "Account Name (English)",
name: "accountHolderName",
placeHolder:" ",
placeHolder: " ",
type: "text",
isRequired: true,
section: "Add Details",
@@ -135,7 +130,7 @@ const EditSponser = () => {
{
label: "Account Name (Arabic)",
name: "accountHolderNameArabic",
placeHolder:" ",
placeHolder: " ",
type: "text",
isRequired: true,
arabic: true,
@@ -144,7 +139,7 @@ const EditSponser = () => {
{
label: "Mobile Number (English)",
name: "mobileNo",
placeHolder:" ",
placeHolder: " ",
type: "number",
isRequired: true,
section: "Add Details",
@@ -152,14 +147,14 @@ const EditSponser = () => {
{
label: "Account Number (English)",
name: "accountNumber",
placeHolder:" ",
placeHolder: " ",
type: "text",
isRequired: true,
section: "Add Details",
},
{
label: "IFSC Code (English)",
placeHolder:" ",
placeHolder: " ",
name: "swiftCode",
type: "text",
isRequired: true,
@@ -167,9 +162,6 @@ const EditSponser = () => {
},
];
const groupedFields = formFields.reduce((groups, field) => {
const { section } = field;
if (!groups[section]) {
@@ -180,18 +172,17 @@ const EditSponser = () => {
}, {});
const onSubmit = (data) => {
console.log(data);
}
console.log(data);
};
return (
<Box {...OPACITY_ON_LOAD} overflowY={"scroll"} height={"100vh"} pb={14}>
<FormInputMain
groupedFields={groupedFields}
control={control}
errors={errors}
onSubmit={handleSubmit(onSubmit)}
/>
<FormInputMain
groupedFields={groupedFields}
control={control}
errors={errors}
onSubmit={handleSubmit(onSubmit)}
/>
</Box>
);
};

View File

@@ -150,7 +150,7 @@ const Sponser = () => {
<Box display={"flex"} justifyContent={"center"} gap={2}>
<Tooltip
rounded={"sm"}
rounded={"sm"}
fontSize={"xs"}
label="View"
bg="#fff"

View File

@@ -30,7 +30,7 @@ const ViewSponser = () => {
},
{
label: "Sponser Name (Arabic)",
value: foundObject.sponserName,
value: foundObject.sponserName,
type: "text",
isRequired: true,
arabic: true,