new ui changes

This commit is contained in:
Pradeeppon01 2024-06-12 11:56:52 +05:30
parent 6614046568
commit 33147c8b0e
11 changed files with 1194 additions and 38 deletions

4
.env
View File

@ -1,4 +1,4 @@
# VITE_REACT_APP_BACKEND_URL="https://sandbox.exampaper.vidh.ai"
VITE_REACT_APP_BACKEND_URL="http://localhost:9999"
# VITE_REACT_APP_BACKEND_URL="http://localhost:9999"
METABASE_BASE_URL="http://metabase.usln.in/public/question/d8774923-09bb-4cd9-903b-559d417e12cf"
# VITE_REACT_APP_BACKEND_URL="https://api.exampaper.vidh.ai"
VITE_REACT_APP_BACKEND_URL="https://api.exampaper.vidh.ai"

View File

@ -12,6 +12,9 @@ import PartAReassigned from "./Components/PartAReassigned";
import PartACorrection from "./Components/PartACorrection";
import Verification from "./Components/Verification";
import Statistics from "./Components/Statistics";
import AnomolyAttendencePage from "./Components/AnomolyAttendencePage";
import AttendenceAdditionalRecord from "./Components/AttendenceAdditionalRecord";
import AttendenceAdditionalRecordCorrection from "./Components/AttendenceAdditionalRecordCorrection";
function App() {
return (
@ -20,39 +23,44 @@ function App() {
<Routes>
<Route path="/" element={<Home />}></Route>
<Route
path="/anomoly/reassigned"
path="/anomoly/attendence/reassigned"
element={<AnomolyReassigned />}
></Route>
<Route
path="/anomoly/reassigned/booklet"
element={<AttendenceCorrection />}
>
</Route>
></Route>
<Route
path="/anomoly/reassigned/stats"
element={<ReassignedStats />}
>
</Route>
></Route>
<Route
path="/anomoly/attendence"
element={<AnomolyAttendencePage />}
></Route>
<Route
path="/anomoly/attendence/additionalRecord"
element={<AttendenceAdditionalRecord />}
/>
<Route
path="/anomoly/attendence/additionalRecord/correction"
element={<AttendenceAdditionalRecordCorrection />}
/>
<Route
path="/anomoly/reassigned/stats/:exam_centre_code"
element={<IndividualExamCentreStats/>}
>
</Route>
<Route
path="/anomoly/PartA"
element={<PartAReassigned/>}
>
</Route>
element={<IndividualExamCentreStats />}
></Route>
<Route path="/anomoly/PartA" element={<PartAReassigned />}></Route>
{/* <Route
path="/verification"
element={<Verification/>}
>
</Route> */}
<Route path="/statistics" element={<Statistics/>}></Route>
<Route path="/anomoly/partA/booklet"
element={<PartACorrection/>}
>
</Route>
<Route path="/statistics" element={<Statistics />}></Route>
<Route
path="/anomoly/partA/booklet"
element={<PartACorrection />}
></Route>
</Routes>
</BrowserRouter>
</>

View File

@ -0,0 +1,39 @@
import { Box } from "@mui/material";
import HomepageCard from "./HomepageCard";
import {useState,useEffect} from "react"
const AnomolyAttendencePage = () =>{
const cards = [
{
title: "Reassingned Serial No",
url: "/anomoly/attendence/reassigned"
},
{
title: "Additional Record Insertion",
url: "/anomoly/attendence/additionalRecord",
}, {
title: "Additional Sheet Insertion",
url: "/anomoly/attendence/additionalSheet",
}
]
return (
<>
<Box>
<Box className="d-flex justify-content-center text-light bg-primary rounded py-3">
<h1>Welcome to exampaper.vidh.ai</h1>
</Box>
<Box className="p-3">
{cards.map((card) => (
<HomepageCard title={card?.title} url={card?.url} />
))}
</Box>
</Box>
</>
);
}
export default AnomolyAttendencePage;

View File

@ -77,7 +77,7 @@ const AnomolyReassigned = () => {
const navigate = useNavigate();
function createData(
attendence_serial_no,
student_slno,
answer_booklet_sno,
exam_centre_code,
exam_centre,
student_name,
@ -86,7 +86,7 @@ const AnomolyReassigned = () => {
) {
return {
attendence_serial_no,
student_slno,
answer_booklet_sno,
exam_centre_code,
exam_centre,
student_name,
@ -101,7 +101,7 @@ const AnomolyReassigned = () => {
tmpData.push(
createData(
data.attendence_serial_no,
data.student_slno,
data.answer_booklet_sno,
data.exam_centre_code,
data.exam_centre,
data.student_name,

View File

@ -0,0 +1,286 @@
import React, { useState } from "react";
import {
DesktopOutlined,
FileOutlined,
PieChartOutlined,
TeamOutlined,
UserOutlined,
} from "@ant-design/icons";
import { Breadcrumb, Layout, Menu, Typography, theme } from "antd";
import BookletInput from "./BookletInput";
import { Box, Button } from "@mui/material";
import { useEffect } from "react";
import TextField from "@mui/material/TextField";
import EditButton from "./EditButton";
import { width } from "@mui/system";
import { ToastContainer, toast } from "react-toastify";
import "react-toastify/dist/ReactToastify.css";
import { TablePagination } from "@mui/base/TablePagination";
import TableComponent from "./TableComponent";
import LoadingContainer from "./LoadingContainer";
import HomeIcon from "@mui/icons-material/Home";
import ArrowBackIcon from "@mui/icons-material/ArrowBack";
import { useNavigate } from "react-router-dom";
import QueryStatsIcon from "@mui/icons-material/QueryStats";
import { updateAttendenceAnomolyData } from "../redux/actions/actions";
import { useDispatch, useSelector } from "react-redux";
const { Header, Content, Footer, Sider } = Layout;
function getItem(label, key, icon, children) {
return {
key,
icon,
children,
label,
};
}
const items = [getItem("Reassigned Booklet No", "1", <PieChartOutlined />)];
const AttendenceAdditionalRecord = () => {
const [collapsed, setCollapsed] = useState(false);
const [anomolyData, setAnomolyData] = useState([]);
const [filteredAnomolyData,setFilterAnomolyData] = useState([])
const [tableRowData, setTableRowData] = useState([]);
const [isLoading, setIsLoading] = useState(false);
const [windowWidth, setWindowWidth] = useState(window.innerWidth);
const [distinctExamCentreCodes,setDistinctExamCentreCodes] = useState([])
const dispatch = useDispatch();
const reduxAnomolyData = useSelector((state) => state.attendenceAnomolyData);
const [filterSelectedExamCentreCode,setFilterSelectedExamCentreCode] = useState("")
// Log Redux store state
console.log("Redux store state after dispatch:", reduxAnomolyData);
useEffect(() => {
const handleResize = () => {
setWindowWidth(window.innerWidth);
};
window.addEventListener("resize", handleResize);
return () => {
window.removeEventListener("resize", handleResize);
};
}, []);
useEffect(() => {
if (windowWidth < 800) {
setCollapsed(true);
}
if (windowWidth > 800) {
setCollapsed(false);
}
}, [windowWidth]);
const navigate = useNavigate();
function createData(
qrcode,
coverA,
coverB,
subject_code,
total_students,
total_present,
total_absent
) {
return {
qrcode,
coverA,
coverB,
subject_code,
total_students,
total_present,
total_absent
};
}
useEffect(()=>{
const tmpData = [];
for (const data of anomolyData) {
tmpData.push(
createData(
data.qrcode,
data.coverA,
data.coverB,
data.subject_code,
data.total_students,
data.total_present,
data.total_absent
)
);
}
console.log("Tmp data is : ", tmpData);
if (tmpData.length > 0) {
setTableRowData(tmpData);
}
},[anomolyData])
const fetchAnomalyData = () => {
console.log("Fetching.......");
setIsLoading(true);
fetch(
`${
import.meta.env.VITE_REACT_APP_BACKEND_URL
}/fetchAnamolyAttendencAdditionalRecordeData`,
{
method: "GET",
headers: {
"Content-Type": "application/json",
},
}
)
.then((response) => {
console.log("Response fetched..");
return response.json();
})
.then((responseData) => {
console.log("Response Data is : ", responseData);
setIsLoading(false);
if (responseData.status === "success") {
setAnomolyData(responseData?.data);
const tmpExamCentreCodes = [];
const distinctExamCentreCodesSet = new Set(distinctExamCentreCodes);
for (var data of responseData?.data) {
if (!distinctExamCentreCodesSet.has(data.exam_centre_code)) {
distinctExamCentreCodesSet.add(data.exam_centre_code);
tmpExamCentreCodes.push(data.exam_centre_code);
}
setFilterAnomolyData([...tmpExamCentreCodes])
}
setDistinctExamCentreCodes([...distinctExamCentreCodesSet]);
console.log("Tmp exam centre code: ", tmpExamCentreCodes);
// console.log("Data to be stored in store : ", responseData?.data);
//dispatch(updateAttendenceAnomolyData(responseData?.data));
}
})
.catch((error) => {
console.error("Error fetching data: ", error);
setIsLoading(false);
});
};
useEffect(() => {
if (reduxAnomolyData.length > 0) {
console.log("Redux anomoly data found")
setAnomolyData(reduxAnomolyData)
} else {
console.log("Redux anomoly data not found")
fetchAnomalyData();
}
}, []);
useEffect(()=>{
const tmpData = []
for(var data in anomolyData){
if(data?.exam_centre_code == filterSelectedExamCentreCode){
tmpData.push(data)
}
}
},[filterSelectedExamCentreCode])
const {
token: { colorBgContainer, borderRadiusLG },
} = theme.useToken();
return (
<Layout
style={{
minHeight: "100vh",
}}
>
<ToastContainer />
<Sider
collapsible
collapsed={collapsed}
onCollapse={(value) => setCollapsed(value)}
>
<div className="demo-logo-vertical" />
<Menu
theme="dark"
defaultSelectedKeys={["1"]}
mode="inline"
items={items}
/>
</Sider>
<Layout>
<Header
style={{
padding: 0,
background: colorBgContainer,
}}
>
<Box className="d-flex justify-content-between h-100 py-1 px-2">
<Button
className="bg-primary p-1 text-light"
onClick={() => {
navigate(-1);
}}
>
<ArrowBackIcon />
</Button>
<Box className="d-flex justify-content-between gap-2">
<Button
className="bg-primary p-1 text-light"
onClick={() => {
navigate("/anomoly/reassigned/stats");
}}
>
<QueryStatsIcon />
</Button>
<Button
className="bg-primary p-1 text-light"
onClick={() => {
navigate("/");
}}
>
<HomeIcon />
</Button>
</Box>
</Box>
</Header>
<Content
style={{
margin: "16px 16px",
}}
>
<Box className="w-100 d-flex justify-content-between">
<Box className="w-100 d-flex justify-content-center">
{tableRowData.length > 0 && (
<TableComponent
filterSelectedExamCentreCode = {filterSelectedExamCentreCode}
setFilterSelectedExamCentreCode = {setFilterSelectedExamCentreCode}
rows={tableRowData}
type={"AttendenceAdditionalRecord"}
distinctExamCentreCodes = {distinctExamCentreCodes}
/>
)}
{tableRowData.length == 0 && (
<Box className="w-100 d-flex justify-content-center py-2 align-items-center text-center">
<h6>No Data Found !!</h6>
</Box>
)}
</Box>
</Box>
</Content>
<Footer
style={{
textAlign: "center",
}}
>
exampaper.vidh.ai ©{new Date().getFullYear()}
</Footer>
</Layout>
{isLoading && <LoadingContainer loadingText={"Loading"} />}
</Layout>
);
};
export default AttendenceAdditionalRecord;

View File

@ -0,0 +1,708 @@
import React, { useState } from "react";
import {
DesktopOutlined,
FileOutlined,
PieChartOutlined,
TeamOutlined,
UserOutlined,
} from "@ant-design/icons";
import { Breadcrumb, Layout, Menu, Typography, theme } from "antd";
import BookletInput from "./BookletInput";
import { Box, Button } from "@mui/material";
import { useEffect } from "react";
import TextField from "@mui/material/TextField";
import EditButton from "./EditButton";
import { width } from "@mui/system";
import { ToastContainer, toast } from "react-toastify";
import "react-toastify/dist/ReactToastify.css";
import { useSearchParams } from "react-router-dom";
import LoadingContainer from "./LoadingContainer";
import HomeIcon from "@mui/icons-material/Home";
import ArrowBackIcon from "@mui/icons-material/ArrowBack";
import { useNavigate } from "react-router-dom";
import QueryStatsIcon from "@mui/icons-material/QueryStats";
import { useDispatch, useSelector } from "react-redux";
import { updateAttendenceAnomolyData } from "../redux/actions/actions";
import RotateLeftIcon from "@mui/icons-material/RotateLeft";
import RotateRightIcon from "@mui/icons-material/RotateRight";
const { Header, Content, Footer, Sider } = Layout;
function getItem(label, key, icon, children) {
return {
key,
icon,
children,
label,
};
}
const items = [getItem("Reassigned Booklet No", "1", <PieChartOutlined />)];
const AttendenceAdditionalRecordCorrection = () => {
console.log("Checking1 ...");
const [collapsed, setCollapsed] = useState(false);
const [bookletInput, setBookletInput] = useState(null);
const [dataFetched, setDataFetched] = useState(false);
const [studentData, setStudentData] = useState(null);
const [updateReassigned, setUpdateReassigned] = useState(false);
const [reasssingedSno, setReassignedSno] = useState(null);
const [isLoading, setIsLoading] = useState(false);
const [registerNumber, setRegisterNumber] = useState(null);
const [backgroundPosition, setBackgroundPosition] = useState("0% 0%");
const [zoomed, setZoomed] = useState(false);
const dispatch = useDispatch();
const [scaleWidthValue, setScaleWidthValue] = useState(80);
const [rotateValue, setRotateValue] = useState(0);
const [attendenceQRcode,setAttendenceQRcode] = useState(null)
// const reduxAnomolyData = useSelector((state) => state.attendenceAnomolyData);
// console.log("Anomoly Data is : ", reduxAnomolyData);
const [anomolyData, setAnomolyData] = useState([]);
const handleMouseMove = (e) => {
const { left, top, width, height } = e.target.getBoundingClientRect();
const x = ((e.pageX - left) / width) * 100;
const y = ((e.pageY - top) / height) * 100;
setBackgroundPosition(`${x}% ${y}%`);
setZoomed(true);
};
const navigate = useNavigate();
let [searchParams, setSearchParams] = useSearchParams();
const searchParamsqrcode = searchParams.get("qrcode");
// console.log("Serach parmas sno : ", searchParamsBookletSerialNo);
const [windowWidth, setWindowWidth] = useState(window.innerWidth);
useEffect(() => {
const handleResize = () => {
setWindowWidth(window.innerWidth);
};
window.addEventListener("resize", handleResize);
return () => {
window.removeEventListener("resize", handleResize);
};
}, []);
useEffect(() => {
if (windowWidth < 800) {
setCollapsed(true);
}
if (windowWidth > 800) {
setCollapsed(false);
}
}, [windowWidth]);
useEffect(() => {
if (searchParamsqrcode) {
setAttendenceQRcode(searchParamsqrcode);
}
}, [searchParamsqrcode]);
useEffect(() => {
submitQrInputData();
}, [attendenceQRcode]);
const {
token: { colorBgContainer, borderRadiusLG },
} = theme.useToken();
// useEffect(() => {
// if (reduxAnomolyData.length === 0) {
// fetchAnomalyData();
// }
// }, []);
const fetchAnomalyData = () => {
console.log("Fetching.......");
setIsLoading(true);
fetch(
`${
import.meta.env.VITE_REACT_APP_BACKEND_URL
}/fetchAnamolyAttendenceData`,
{
method: "GET",
headers: {
"Content-Type": "application/json",
},
}
)
.then((response) => {
console.log("Response fetched..");
return response.json();
})
.then((responseData) => {
console.log("Response Data is : ", responseData);
setIsLoading(false);
if (responseData.status === "success") {
setAnomolyData(responseData?.data);
console.log("Data to be stored in store : ", responseData?.data);
// dispatch(updateAttendenceAnomolyData(responseData?.data));
}
})
.catch((error) => {
console.error("Error fetching data: ", error);
setIsLoading(false);
});
};
const submitQrInputData = async () => {
setIsLoading(true);
setStudentData(null);
if (!bookletInput) {
console.log("Returning");
}
const payload = {
attendenceQRcode,
};
const response = await fetch(
`${import.meta.env.VITE_REACT_APP_BACKEND_URL}/fetchAttendenceAdditionalqrData`,
{
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(payload),
}
);
const responseData = await response.json();
console.log("Response Data is : ", responseData);
setDataFetched(true);
setIsLoading(false);
if (responseData.status === "success") {
console.log("Into top if");
if (!responseData.data) {
setStudentData(null);
}
if (responseData.data) {
setStudentData(responseData.data[0]);
const student_data = responseData.data[0];
setRegisterNumber(student_data?.register_number);
}
}
};
const url = `https://docs.exampaper.vidh.ai/${studentData?.s3_path}`;
// console.log("Url is : ", url);
const figureStyle = {
backgroundImage: `url(${url})`,
backgroundPosition: zoomed ? backgroundPosition : "center",
backgroundSize: zoomed ? "200%" : "cover",
height: "100%", // Adjust the height as needed
width: "60%", // Adjust the width as needed
border: "1px solid #ddd",
overflow: "hidden",
};
const ZoomInImage = () => {
console.log("Zooming In Image ....");
const elements = document.getElementsByClassName("scanned-img");
for (var ele of elements) {
console.log("Ele is : ", ele);
const newScaleWidthValue = scaleWidthValue + 10;
setScaleWidthValue(newScaleWidthValue);
// ele.style.transform = `scale(${newScaleValue})`;
ele.style.width = `${newScaleWidthValue}%`;
}
};
const ZoomOutImage = () => {
console.log("Zooming Out Image ....");
const elements = document.getElementsByClassName("scanned-img");
for (var ele of elements) {
console.log("Ele is : ", ele);
const newScaleWidthValue = scaleWidthValue - 10;
setScaleWidthValue(newScaleWidthValue);
// ele.style.transform = `scale(${newScaleValue})`;
ele.style.width = `${newScaleWidthValue}%`;
}
};
const RotateImageLeft = () => {
const elements = document.getElementsByClassName("scanned-img");
for (var ele of elements) {
console.log("Ele is : ", ele);
const newRotateValue = rotateValue - 90;
setRotateValue(newRotateValue);
ele.style.transform = `rotate(${newRotateValue}deg)`;
}
};
const RotateImageRight = () => {
const elements = document.getElementsByClassName("scanned-img");
for (var ele of elements) {
console.log("Ele is : ", ele);
const newRotateValue = rotateValue + 90;
setRotateValue(newRotateValue);
ele.style.transform = `rotate(${newRotateValue}deg)`;
}
};
const ImageStyle = {
// transform: `scale(${scaleValue})`,
transformOrigin: "left", // Adjust the zoom origin as needed
transition: "transform 0.2s ease-in-out",
};
const containerStyle = {
width: "auto", // Set the width and height as needed
maxHeight: "90%",
overflowX: "scroll",
position: "relative",
};
const handleMouseLeave = () => {
setBackgroundPosition("0% 0%");
setZoomed(false);
};
const updateReassignedSno = async () => {
setIsLoading(true);
// if(reduxAnomolyData.length === 0){
// console.log("Redux anomoly data length is 0.......")
// fetchAnomalyData()
// }
console.log("Reassgined Sno : ", reasssingedSno);
const payload = {
bookletInput,
reasssingedSno,
registerNumber,
};
const response = await fetch(
`${import.meta.env.VITE_REACT_APP_BACKEND_URL}/updateReassingedSno`,
{
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(payload),
}
);
const responseData = await response.json();
setIsLoading(false);
setReassignedSno(null);
if (responseData.status === "success" && responseData?.status_code == 200) {
console.log("Updation success");
toast.success("Record Updated Successfully !!");
var index = 0
var RecordIndex = 0
const filteredData = reduxAnomolyData.filter((data) => {
if (data?.student_slno === searchParamsBookletSerialNo) {
RecordIndex = index
console.log("data matched : ", data);
return false; // Return false to remove the matched item
}
index += 1
return true; // Keep the unmatched items
});
console.log("Filtered Data: ", filteredData);
// dispatch(updateAttendenceAnomolyData(filteredData));
if (filteredData.length > 0) {
navigate(
`/anomoly/reassigned/booklet?sno=${filteredData[RecordIndex].student_slno}`
);
}
} else if (
responseData.status === "success" &&
responseData?.status_code == 405
) {
console.log("Updation not allowed");
toast.error("Reassigned Serial No is Invalid !!");
}
};
const markAsAssigned = async () => {
setIsLoading(true);
const payload = { bookletInput };
const response = await fetch(
`${import.meta.env.VITE_REACT_APP_BACKEND_URL}/markAsAssigned`,
{
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(payload),
}
);
const responseData = await response.json();
setIsLoading(false);
if (responseData.status === "success") {
toast.success("Record Updated Successfully !!");
var index = 0
var RecordIndex = 0
const filteredData = reduxAnomolyData.filter((data) => {
if (data?.student_slno === searchParamsBookletSerialNo) {
RecordIndex = index
console.log("data matched : ", data);
return false; // Return false to remove the matched item
}
index += 1
return true; // Keep the unmatched items
});
console.log("Filtered Data: ", filteredData);
// dispatch(updateAttendenceAnomolyData(filteredData));
if (filteredData.length > 0) {
navigate(
`/anomoly/reassigned/booklet?sno=${filteredData[RecordIndex].student_slno}`
);
}
}
};
return (
<Layout
style={{
minHeight: "100vh",
}}
>
<ToastContainer />
<Sider
collapsible
collapsed={collapsed}
onCollapse={(value) => setCollapsed(value)}
>
<div className="demo-logo-vertical" />
<Menu
theme="dark"
defaultSelectedKeys={["1"]}
mode="inline"
items={items}
/>
</Sider>
<Layout>
<Header
style={{
padding: 0,
background: colorBgContainer,
}}
>
<Box className="d-flex justify-content-between h-100 py-1 px-2">
<Button
className="bg-primary p-1 text-light"
onClick={() => {
navigate(-1);
}}
>
<ArrowBackIcon />
</Button>
<Box className="d-flex justify-content-between gap-2">
<Button
className="bg-primary p-1 text-light"
onClick={() => {
navigate("/anomoly/reassigned/stats");
}}
>
<QueryStatsIcon />
</Button>
<Button
className="bg-primary p-1 text-light"
onClick={() => {
navigate("/");
}}
>
<HomeIcon />
</Button>
</Box>
</Box>
{/* <Box>Reassigned Booklet Serial Manual Updation :</Box> */}
</Header>
<Content
style={{
margin: "16px 16px",
}}
>
{/* <Breadcrumb
style={{
margin: "16px 0",
}}
>
<Breadcrumb.Item>User</Breadcrumb.Item>
<Breadcrumb.Item>Bill</Breadcrumb.Item>
</Breadcrumb> */}
{/* <div
style={{
padding: 24,
minHeight: 360,
background: colorBgContainer,
borderRadius: borderRadiusLG,
}}
>
Bill is a cat.
</div> */}
<Box className="w-100 d-flex flex-column flex-md-row justify-content-between">
<Box className="w-25 d-none d-md-flex flex-column">
<Box className="d-flex justify-content-between">
{/* <BookletInput
className="d-flex flex-1"
setBookletInput={setBookletInput}
bookletInput={bookletInput}
setDataFetched={setDataFetched}
/> */}
{/* <Button
className="px-md-5 px-2 mx-1 mx-md-2 text-light bg-primary"
onClick={submitBookletInput}
>
Submit
</Button> */}
</Box>
{/* {!isLoading && !studentData && (
<Box className="w-100 py-5">
<h6>Invalid Booklet Serial No !!</h6>
</Box>
)} */}
{studentData && (
<>
<Box>
<Box className="d-flex justify-content-start px-2 py-3">
<h6>
<u>Booklet Info:</u>
</h6>
</Box>
<Box className="px-2">
<Box className="d-flex flex-column align-items-start gap-2 py-2">
<label for="student-name-input" className="h6">
<u>Booklet Serial No:</u>
</label>
<h5>{bookletInput}</h5>
</Box>
<Box className="d-flex flex-column align-items-start gap-2 py-2">
<label for="student-name-input" className="h6">
<u>Student Name:</u>
</label>
<h5>{studentData?.student_name}</h5>
</Box>
<Box className="d-flex flex-column align-items-start gap-2 py-2">
<label for="exam-centre-code-input" className="h6">
<u>Exam Center Code:</u>
</label>
<h5>{studentData?.exam_centre_code}</h5>
</Box>
<Box className="d-flex flex-column align-items-start gap-2 py-2">
<label for="exam-centre-input" className="h6">
<u>Exam Centre:</u>
</label>
<h5>{studentData.exam_centre}</h5>
</Box>
<Box className="d-flex flex-column align-items-start gap-2 py-2">
<label for="exam-date-input" className="h6">
<u>Exam Date:</u>
</label>
<h5>{studentData?.exam_date}</h5>
</Box>
<Box className="d-flex flex-column align-items-start gap-2 py-2">
<label for="reassigned-serial-no-input">
<u>Reassigned Serial No:</u>
</label>
<Box className="d-flex justify-content-between w-100">
<TextField
id="reassigned-serial-no-input"
className="w-100"
value={studentData.reassigned_serial_no}
placeholder={`Please enter the SNo.${studentData?.rownumber} Answer Booklet No`}
autoComplete="off"
onChange={(e) => {
setReassignedSno(e.target.value);
}}
/>
</Box>
</Box>
<Box className="py-2 d-flex justify-content-start flex-column gap-2">
<Button
className="text-light bg-primary p-3 w-100"
disabled={!reasssingedSno}
onClick={updateReassignedSno}
>
Update
</Button>
<Button
className="text-light bg-primary p-3 w-100"
onClick={markAsAssigned}
>
Mark As Assigned
</Button>
</Box>
</Box>
</Box>
</>
)}
</Box>
<Box className="w-md-25 d-flex d-md-none flex-column">
{/* {!isLoading && !studentData && (
<Box className="w-100 py-5">
<h6>Invalid Booklet Serial No !!</h6>
</Box>
)} */}
{studentData && (
<>
<Box>
<Box className="d-flex justify-content-start px-2 py-3">
<h6>
<u>Booklet Info:</u>
</h6>
</Box>
<Box className="px-2">
<Box className="d-flex flex-column align-items-start gap-2 py-2">
<label for="student-name-input" className="h6">
<u>Booklet Serial No:</u>
</label>
<h5>{bookletInput}</h5>
</Box>
<Box className="d-flex flex-column align-items-start gap-2 py-2">
<label for="student-name-input" className="h6">
<u>Student Name:</u>
</label>
<h5>{studentData?.student_name}</h5>
</Box>
<Box className="d-flex flex-column align-items-start gap-2 py-2">
<label for="exam-centre-code-input" className="h6">
<u>Exam Center Code:</u>
</label>
<h5>{studentData?.exam_centre_code}</h5>
</Box>
<Box className="d-flex flex-column align-items-start gap-2 py-2">
<label for="exam-centre-input" className="h6">
<u>Exam Centre:</u>
</label>
<h5>{studentData.exam_centre}</h5>
</Box>
<Box className="d-flex flex-column align-items-start gap-2 py-2">
<label for="exam-date-input" className="h6">
<u>Exam Date:</u>
</label>
<h5>{studentData?.exam_date}</h5>
</Box>
<Box className="d-flex flex-column align-items-start gap-2 py-2">
<label for="reassigned-serial-no-input">
<u>Reassigned Serial No:</u>
</label>
<Box className="d-flex justify-content-between w-100">
<TextField
id="reassigned-serial-no-input"
className="w-100"
value={studentData.reassigned_serial_no}
placeholder={`Please enter the SNo.${studentData?.rownumber} Answer Booklet No`}
autoComplete="off"
onChange={(e) => {
setReassignedSno(e.target.value);
}}
/>
</Box>
</Box>
<Box className="py-2 d-flex justify-content-start flex-column gap-2">
<Button
className="text-light bg-primary p-3 w-100"
disabled={!reasssingedSno}
onClick={updateReassignedSno}
>
Update
</Button>
<Button
className="text-light bg-primary p-3 w-100"
onClick={markAsAssigned}
>
Mark As Assigned
</Button>
</Box>
</Box>
</Box>
</>
)}
</Box>
<Box
className="w-75 d-none d-md-block"
style={{ height: "800px", overflow: "auto" }}
>
{studentData && (
<>
<Box className="py-2">
<Button
className="bg-primary text-light p-3 mx-1"
onClick={ZoomInImage}
>
ZoomIn
</Button>
<Button
className="bg-primary text-light p-3 mx-1"
onClick={ZoomOutImage}
>
ZoomOut
</Button>
<Button
className="bg-primary text-light p-3 mx-1"
onClick={RotateImageLeft}
>
<RotateLeftIcon />
</Button>
<Button
className="bg-primary text-light p-3 mx-1"
onClick={RotateImageRight}
>
<RotateRightIcon />
</Button>
</Box>
<img
className="scanned-img"
src={`https://docs.exampaper.vidh.ai/${studentData?.s3_image_path}`}
width={`${scaleWidthValue}%`}
/>
</>
)}
</Box>
<Box className="w-100 d-md-none overflow-auto">
{studentData && (
<>
<Box className="py-2">
<Button
className="bg-primary text-light p-3 mx-1"
onClick={ZoomInImage}
>
ZoomIn
</Button>
<Button
className="bg-primary text-light p-3 mx-1"
onClick={ZoomOutImage}
>
ZoomOut
</Button>
<Button
className="bg-primary text-light p-3 mx-1"
onClick={RotateImageLeft}
>
<RotateLeftIcon />
</Button>
<Button
className="bg-primary text-light p-3 mx-1"
onClick={RotateImageRight}
>
<RotateRightIcon />
</Button>
</Box>
<img
className="scanned-img"
src={`https://docs.exampaper.vidh.ai/${studentData.s3_path}`}
width={`${scaleWidthValue}%`}
/>
</>
)}
</Box>
</Box>
</Content>
<Footer
style={{
textAlign: "center",
}}
>
exampaper.vidh.ai ©{new Date().getFullYear()}
</Footer>
</Layout>
{isLoading && <LoadingContainer loadingText={"Fetching"} />}
</Layout>
);
};
export default AttendenceAdditionalRecordCorrection;

View File

@ -80,7 +80,7 @@ const AttendenceCorrection = () => {
const navigate = useNavigate();
let [searchParams, setSearchParams] = useSearchParams();
const searchParamsBookletSerialNo = searchParams.get("sno");
// console.log("Serach parmas sno : ", searchParamsBookletSerialNo);
console.log("Serach parmas sno : ", searchParamsBookletSerialNo);
const [windowWidth, setWindowWidth] = useState(window.innerWidth);
useEffect(() => {

View File

@ -6,7 +6,7 @@ const Home = () => {
const cards = [
{
title: "Reassingned Serial No Anomoly Manual Updation",
url: "/anomoly/reassigned",
url: "/anomoly/attendence",
},
// {
// title: "Part A OCR Anomoly - Batch 2022",
@ -24,10 +24,10 @@ const Home = () => {
// title:"Verification",
// url:"/verification"
// }
{
title:"Statistics",
url:"/statistics"
}
// {
// title:"Statistics",
// url:"/statistics"
// }
];
// const cards = [

View File

@ -102,6 +102,10 @@ const PartACorrection = () => {
const subjectCodeInputRef = useRef(null);
const examcentreCodeInputRef = useRef(null);
const examDateInputRef = useRef(null);
const studentNameInputRef = useRef(null);
const bookletInputRef = useRef(null);
// Handle the Enter key press in the register number input
const handleRegisterNumberKeyDown = (e) => {
@ -793,6 +797,7 @@ const PartACorrection = () => {
id="corrected-register-number-input"
className="w-100"
value={correctedExamCentreCode}
inputRef={examcentreCodeInputRef}
autoComplete="off"
onChange={(e) => {
setCorrectedExamCentreCode(
@ -812,6 +817,7 @@ const PartACorrection = () => {
className="w-100"
value={correctedExamDate}
autoComplete="off"
inputRef = {examDateInputRef}
onChange={(e) => {
setCorrectedExamDate(e.target.value);
}}
@ -828,6 +834,7 @@ const PartACorrection = () => {
id="corrected-register-number-input"
className="w-100"
value={correctedCandidateName}
inputRef = {studentNameInputRef}
autoComplete="off"
onChange={(e) => {
setCorrectedCandidateName(e.target.value);
@ -845,6 +852,7 @@ const PartACorrection = () => {
id="corrected-register-number-input"
className="w-100"
value={correctedSerialNo}
inputRef={bookletInputRef}
autoComplete="off"
onChange={(e) => {
setCorrectedSerialNo(e.target.value);

View File

@ -37,6 +37,29 @@ const SimpleDialog = ({dialogBoxConsent,setDialogBoxConsent,showDialogBox,setSh
setShowDialogBox(false)
}
const handleKeyPress = (event) => {
if (event.key === 'n' || event.key === 'N') {
console.log('The "N" key was pressed!');
handleNo()
}else if(event.key === "Y" || event.key === "y"){
console.log("Y is pressed")
handleYes()
}
};
// Use useEffect to add the event listener
useEffect(() => {
window.addEventListener('keydown', handleKeyPress);
return () => {
window.removeEventListener('keydown', handleKeyPress);
};
}, []);
useEffect(()=>{
if(examCentreCode && examDate){
setMetaDataLink(`http://metabase.usln.in/public/question/d8774923-09bb-4cd9-903b-559d417e12cf?internal_exam_centre_code=${examCentreCode}&ref_exam_date=${examDate}`)

View File

@ -18,7 +18,7 @@ export default function TableComponent({
rows,
type,
distinctExamCentreCodes,
batchType
batchType,
}) {
// console.log("Exam centre code in table component : ",distinctExamCentreCodes)
console.log("Rows in table component : ", rows);
@ -90,9 +90,9 @@ export default function TableComponent({
<td>{row.attendence_serial_no}</td>
<td style={{ width: 160 }} align="right">
<Link
to={`/anomoly/reassigned/booklet?sno=${row.student_slno}`}
to={`/anomoly/reassigned/booklet?sno=${row?.answer_booklet_sno}`}
>
{row.student_slno}
{row.answer_booklet_sno}
</Link>
</td>
<td style={{ width: 160 }} align="right">
@ -302,7 +302,9 @@ export default function TableComponent({
).map((row) => (
<tr key={row.exam_centre_code}>
<td style={{ width: 160 }} align="right">
<Link to={`/anomoly/partA/booklet?batchType=${batchType}&barcode=${row.barcode}&s3Path=${row.s3_path}&sysNo=${row.systemNo}`}>
<Link
to={`/anomoly/partA/booklet?batchType=${batchType}&barcode=${row.barcode}&s3Path=${row.s3_path}&sysNo=${row.systemNo}`}
>
{row?.s3_path}
</Link>
</td>
@ -351,6 +353,88 @@ export default function TableComponent({
</table>
</>
)}
{type === "AttendenceAdditionalRecord" && (
<>
<h5 className="py-2">Part-A Anomoly Data :</h5>
<table aria-label="custom pagination table">
<thead>
<tr>
<th>qrcode</th>
<th>Cover A</th>
<th>Cover B</th>
<th>Subject Code</th>
<th>Total Students</th>
<th>Total Present</th>
<th>Total Absent</th>
</tr>
</thead>
<tbody>
{(rowsPerPage > 0
? rows.slice(
page * rowsPerPage,
page * rowsPerPage + rowsPerPage
)
: rows
).map((row) => (
<tr key={row.exam_centre_code}>
<td style={{ width: 160 }} align="right">
<Link
to={`/anomoly/attendence/additionalRecord/correction?qrcode=${row.qrcode}`}
>
{row?.qrcode}
</Link>
</td>
<td style={{ width: 160 }} align="right">
{row.coverA}
</td>
<td style={{ width: 160 }} align="right">
{row.coverB}
</td>
<td style={{ width: 160 }} align="right">
{row.subject_code}
</td>
<td style={{ width: 160 }} align="right">
{row.total_students}
</td>
<td style={{ width: 160 }} align="right">
{row.total_present}
</td>
<td style={{ width: 160 }} align="right">
{row.total_absent}
</td>
</tr>
))}
{emptyRows > 0 && (
<tr style={{ height: 41 * emptyRows }}>
<td colSpan={3} aria-hidden />
</tr>
)}
</tbody>
<tfoot>
<tr>
<CustomTablePagination
rowsPerPageOptions={[5, 10, 25, { label: "All", value: -1 }]}
colSpan={3}
count={rows.length}
rowsPerPage={rowsPerPage}
page={page}
slotProps={{
select: {
"aria-label": "rows per page",
},
actions: {
showFirstButton: true,
showLastButton: true,
},
}}
onPageChange={handleChangePage}
onRowsPerPageChange={handleChangeRowsPerPage}
/>
</tr>
</tfoot>
</table>
</>
)}
</Root>
);
}