summaryrefslogtreecommitdiff
path: root/admin/src
diff options
context:
space:
mode:
Diffstat (limited to 'admin/src')
-rw-r--r--admin/src/components/Accordion/Accordion.jsx121
-rw-r--r--admin/src/components/Accordion/Accordion.module.css6
-rw-r--r--admin/src/components/Header/Header.jsx18
-rw-r--r--admin/src/components/Modal/Modal.jsx78
-rw-r--r--admin/src/components/Modal/Modal.module.css21
-rw-r--r--admin/src/pages/EnrollmentRequests/EnrollmentRequests.jsx9
-rw-r--r--admin/src/pages/UpdateRequests/UpdateRequests.jsx22
-rw-r--r--admin/src/services/apiservice.js5
8 files changed, 219 insertions, 61 deletions
diff --git a/admin/src/components/Accordion/Accordion.jsx b/admin/src/components/Accordion/Accordion.jsx
index 08c46b1..c885d0b 100644
--- a/admin/src/components/Accordion/Accordion.jsx
+++ b/admin/src/components/Accordion/Accordion.jsx
@@ -2,54 +2,91 @@ import React, {useState} from 'react';
import {Button} from '@mui/material';
import styles from './Accordion.module.css';
+import PopUpModal from '../Modal/Modal';
const Accordion = ({name, user}) => {
const [isActive, setIsActive] = useState(false);
+ const [open, setOpen] = React.useState(false);
+ const handleOpen = () => setOpen(true);
+
return (
- <div className={styles.accordion}>
- <div
- className={styles.accordion__title}
- onClick={() => setIsActive(!isActive)}
- >
- <h2>{name}</h2>
- <div>&#10095;</div>
- </div>
- {isActive && (
- <div className={styles.accordion__content}>
- <div className={styles.accordion__demographic}>
- <div><span>Name</span> <hr/> {user.name}</div>
- <div><span>Gender</span> <hr/> {user.gender}</div>
- <div><span>Date of Birth</span> <hr/> {user.dob}</div>
- <div><span>Mobile Number</span> <hr/> {user.mobile}</div>
- <div><span>Email</span> <hr/> {user.email}</div>
- <div><span>Address</span> <hr/> {user.address.houseNo},{user.address.street},
- {user.address.locality},{user.address.landmark},
- {user.address.village},{user.address.district.name},
- {user.address.state.name},{user.address.pincode}</div>
- <div><span>Indian Resident</span> <hr/> {user.indianResident ? 'Yes' : 'No'}</div>
- </div>
- <div className={styles.accordion__biometric}>
- <img
- src={user.photo}
- alt=''
- height='300px'
- className={styles.accordion__biometric_image}
- />
- <Button
- sx={{margin: '10px 0px', padding: '20px'}}
- variant='contained'
- onClick={() => {}}
- >
- Documents
- </Button>
- <Button sx={{padding: '20px'}} variant='contained'>
- Biometric
- </Button>
- </div>
+ <>
+ <div className={styles.accordion}>
+ <div
+ className={styles.accordion__title}
+ onClick={() => setIsActive(!isActive)}
+ >
+ <h2>{name}</h2>
+ <span className={styles.accordion__subheading}>
+ Date of Birth: {user.dob}
+ </span>
+ <span className={styles.accordion__subheading}>
+ Mobile Number: {user.mobile}
+ </span>
+ <div>&#10095;</div>
</div>
- )}
- </div>
+ {isActive && (
+ <div className={styles.accordion__content}>
+ <div className={styles.accordion__demographic}>
+ <div>
+ <span>Name</span> <hr /> {user.name}
+ </div>
+ <div>
+ <span>Gender</span> <hr /> {user.gender}
+ </div>
+ <div>
+ <span>Date of Birth</span> <hr /> {user.dob}
+ </div>
+ <div>
+ <span>Mobile Number</span> <hr /> {user.mobile}
+ </div>
+ <div>
+ <span>Email</span> <hr /> {user.email}
+ </div>
+ <div>
+ <span>Address</span> <hr /> {user.address.houseNo},
+ {user.address.street},{user.address.locality},
+ {user.address.landmark},{user.address.village},
+ {user.address.district.name},{user.address.state.name},
+ {user.address.pincode}
+ </div>
+ <div>
+ <span>Indian Resident</span> <hr />{' '}
+ {user.indianResident ? 'Yes' : 'No'}
+ </div>
+ </div>
+ <div className={styles.accordion__biometric}>
+ <img
+ src={user.photo}
+ alt=''
+ height='300px'
+ className={styles.accordion__biometric_image}
+ />
+ <Button
+ sx={{margin: '10px 0px', padding: '20px'}}
+ variant='contained'
+ onClick={() => {
+ handleOpen();
+ }}
+ >
+ Documents
+ </Button>
+ <Button
+ sx={{padding: '20px'}}
+ variant='contained'
+ onClick={() => {
+ handleOpen();
+ }}
+ >
+ Biometric
+ </Button>
+ </div>
+ </div>
+ )}
+ </div>
+ <PopUpModal open={open} setOpen={setOpen} documents={user.documents} />
+ </>
);
};
diff --git a/admin/src/components/Accordion/Accordion.module.css b/admin/src/components/Accordion/Accordion.module.css
index 0cf2603..347a405 100644
--- a/admin/src/components/Accordion/Accordion.module.css
+++ b/admin/src/components/Accordion/Accordion.module.css
@@ -5,7 +5,7 @@
.accordion__title {
display: flex;
- flex-direction: row;
+ align-items: center;
justify-content: space-between;
cursor: pointer;
background-color: #2c3e50;
@@ -23,6 +23,10 @@
padding: 1rem;
}
+.accordion__subheading {
+ font-size: 1.1rem;
+}
+
.accordion__content {
display: flex;
justify-content: center;
diff --git a/admin/src/components/Header/Header.jsx b/admin/src/components/Header/Header.jsx
index a6e8523..fc0cf91 100644
--- a/admin/src/components/Header/Header.jsx
+++ b/admin/src/components/Header/Header.jsx
@@ -1,13 +1,17 @@
-import React from 'react'
-import styles from './Header.module.css'
+import React from 'react';
+import styles from './Header.module.css';
-const Header = ({ subheading }) => {
+const Header = ({subheading}) => {
return (
<header className={styles.header}>
- <img src={`${process.env.PUBLIC_URL}/favicon.ico`} className={styles.header__image}/>
+ <img
+ src={`${process.env.PUBLIC_URL}/favicon.ico`}
+ className={styles.header__image}
+ alt=''
+ />
<h3 className={styles.header__subheading}>{subheading}</h3>
</header>
- )
-}
+ );
+};
-export default Header
+export default Header;
diff --git a/admin/src/components/Modal/Modal.jsx b/admin/src/components/Modal/Modal.jsx
new file mode 100644
index 0000000..ffe0167
--- /dev/null
+++ b/admin/src/components/Modal/Modal.jsx
@@ -0,0 +1,78 @@
+import React from 'react';
+import {Modal, Box} from '@mui/material';
+import styles from './Modal.module.css';
+import Tab from '@mui/material/Tab';
+import TabContext from '@mui/lab/TabContext';
+import TabList from '@mui/lab/TabList';
+import TabPanel from '@mui/lab/TabPanel';
+
+const PopUpModal = ({documents, open, setOpen}) => {
+ const style = {
+ position: 'absolute',
+ top: '50%',
+ left: '50%',
+ transform: 'translate(-50%, -50%)',
+ width: 1000,
+ bgcolor: 'background.paper',
+ borderRadius: '10px',
+ boxShadow: 24,
+ p: 4,
+ };
+
+ const [value, setValue] = React.useState('1');
+
+ const handleChange = (event, newValue) => {
+ setValue(newValue);
+ };
+
+ const handleClose = () => setOpen(false);
+
+ return (
+ <div className={styles.modal}>
+ <Modal
+ open={open}
+ onClose={handleClose}
+ aria-labelledby='modal-modal-title'
+ aria-describedby='modal-modal-description'
+ >
+ <Box sx={style}>
+ <TabContext value={value}>
+ <Box sx={{borderBottom: 1, borderColor: 'divider'}}>
+ <TabList onChange={handleChange}>
+ <Tab label='Proof of Identity' value='1' />
+ <Tab label='Proof of Address' value='2' />
+ <Tab label='Proof of Date of Birth' value='3' />
+ </TabList>
+ </Box>
+ <TabPanel
+ value='1'
+ sx={{
+ textAlign: 'center',
+ }}
+ >
+ <img src={documents.POI} alt='' />
+ </TabPanel>
+ <TabPanel
+ value='2'
+ sx={{
+ textAlign: 'center',
+ }}
+ >
+ <img src={documents.POA} alt='' />
+ </TabPanel>
+ <TabPanel
+ value='3'
+ sx={{
+ textAlign: 'center',
+ }}
+ >
+ <img src={documents.DOB} alt='' />
+ </TabPanel>
+ </TabContext>
+ </Box>
+ </Modal>
+ </div>
+ );
+};
+
+export default PopUpModal;
diff --git a/admin/src/components/Modal/Modal.module.css b/admin/src/components/Modal/Modal.module.css
new file mode 100644
index 0000000..fd5e327
--- /dev/null
+++ b/admin/src/components/Modal/Modal.module.css
@@ -0,0 +1,21 @@
+.modal {
+ margin: 0px 15px;
+ position: absolute;
+ top: 100px;
+ right: 250px;
+}
+
+.modal__title {
+ text-align: center;
+ margin: 20px 0px 40px;
+ font-size: var(--font-medium-large);
+}
+
+.modal__image {
+ width: 50%;
+}
+
+.modal__content {
+ width: 50%;
+ font-size: var(--font-medium-sm);
+}
diff --git a/admin/src/pages/EnrollmentRequests/EnrollmentRequests.jsx b/admin/src/pages/EnrollmentRequests/EnrollmentRequests.jsx
index 22eb2c9..4ae5a85 100644
--- a/admin/src/pages/EnrollmentRequests/EnrollmentRequests.jsx
+++ b/admin/src/pages/EnrollmentRequests/EnrollmentRequests.jsx
@@ -10,6 +10,7 @@ import {
import {useQuery, useMutation} from 'react-query';
import {useNavigate} from 'react-router-dom';
import BackButton from '../../components/BackButton/BackButton';
+import {sendMessage} from '../../services/apiservice';
import styles from './EnrollmentRequests.module.css';
@@ -28,6 +29,10 @@ const EnrollmentRequests = () => {
},
});
+ const setConfirm = useMutation((payload) => {
+ sendMessage(payload);
+ });
+
return (
<div className={styles.unverified_users}>
<Header subheading='Admin' />
@@ -46,7 +51,9 @@ const EnrollmentRequests = () => {
<Button
title='Reject'
color='red'
- onClick={() => deleteUse.mutate(item._id)}
+ onClick={() => {
+ deleteUse.mutate(item._id);
+ }}
/>
</div>
))
diff --git a/admin/src/pages/UpdateRequests/UpdateRequests.jsx b/admin/src/pages/UpdateRequests/UpdateRequests.jsx
index 07b3579..91629bd 100644
--- a/admin/src/pages/UpdateRequests/UpdateRequests.jsx
+++ b/admin/src/pages/UpdateRequests/UpdateRequests.jsx
@@ -49,16 +49,18 @@ const UpdateRequests = () => {
data?.data.map((item) => (
<div className={styles.unverified_users__accordion} key={item._id}>
<Accordion name={item.name} user={item} />
- <Button
- title='Accept'
- color='green'
- onClick={() => updateUse.mutate(item._id)}
- />
- <Button
- title='Reject'
- color='red'
- onClick={() => deleteUse.mutate(item._id)}
- />
+ <div>
+ <Button
+ title='Accept'
+ color='green'
+ onClick={() => updateUse.mutate(item._id)}
+ />
+ <Button
+ title='Reject'
+ color='red'
+ onClick={() => deleteUse.mutate(item._id)}
+ />
+ </div>
</div>
))
) : (
diff --git a/admin/src/services/apiservice.js b/admin/src/services/apiservice.js
index c000755..2075239 100644
--- a/admin/src/services/apiservice.js
+++ b/admin/src/services/apiservice.js
@@ -28,3 +28,8 @@ export const updatingUsers = async () => {
const response = await apiClient.get(`/users/updating`);
return response;
};
+
+export const sendMessage = async (payload) => {
+ const response = await apiClient.post('/message', payload);
+ return response;
+};
Powered by cgit, Gruvboxed by Blaster4385.