This commit is contained in:
Pradeeppon01 2024-07-06 13:08:43 +05:30
parent d7c1927bb1
commit b8f72c2887
8 changed files with 349 additions and 172 deletions

2
.env
View File

@ -1,4 +1,4 @@
#VITE_REACT_APP_BACKEND_URL="https://sandbox.exampaper.vidh.ai"
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="http://localhost:9999"
#VITE_REACT_APP_BACKEND_URL="http://localhost:9999"

View File

@ -24,6 +24,7 @@ import AnomolyPartC from "./Components/AnomolyPartC";
import BarcodeScanner from "./Components/BarcodeScanner"
import EvQrcode from "./Components/EvQrcode";
import QrcodeCardEditor from "./Components/QrCodeCardEditor";
import StudentResultsData from "./Components/StudentsResultsData";
function App() {
return (
@ -34,6 +35,7 @@ function App() {
<Route path="/sqlPlayground" element={<QueryExecutor />}></Route>
<Route path="/sqlPlayground/edit" element={<QueryCardEditor/>}></Route>
<Route path="/evQrcode/edit" element={<QrcodeCardEditor/>}></Route>
<Route path="/studentsDetails" element={<StudentResultsData/>}></Route>
<Route
path="/anomoly/attendence/reassigned"
element={<AnomolyReassigned />}

View File

@ -42,36 +42,39 @@ function AnomalyPartC() {
const [showSystemNoContainer, setShowSystemNoContainer] = useState(false);
const [selectedIndex, setSelectedIndex] = useState(null);
const [selectedDegreeType, setSelectedDegreeType] = useState(null);
const [dataFetched, setDataFetched] = useState([]);
const [counter, setCounter] = useState(0);
const degreeTypes = [
{ type: "UG", type_code: "0" },
{ type: "PG", type_code: "2" },
{ type: "UNIVERSITY" , type_code: "5"}
];
const reduxDegreeType = useSelector((state)=> state?.partCDegreeType)
console.log("Redux degree type ...",reduxDegreeType)
useEffect(()=>{
if(reduxDegreeType){
setSelectedDegreeType(reduxDegreeType)
}else{
setSelectedDegreeType("2")
const reduxDegreeType = useSelector((state) => state?.partCDegreeType);
console.log("Redux degree type ...", reduxDegreeType);
useEffect(() => {
if (reduxDegreeType) {
setSelectedDegreeType(reduxDegreeType);
} else {
setSelectedDegreeType("2");
}
},[reduxDegreeType])
}, [reduxDegreeType]);
const handleDegreeTypeChange = (e) => {
const newDegreeType = e.target.value
console.log("Value ===== ",newDegreeType);
const newDegreeType = e.target.value;
console.log("Value ===== ", newDegreeType);
setSelectedDegreeType(newDegreeType);
dispatch(updatePartCDegreeType(newDegreeType))
dispatch(updatePartCDegreeType(newDegreeType));
};
const {
token: { colorBgContainer, borderRadiusLG },
} = theme.useToken();
const navigate = useNavigate();
const dispatch = useDispatch();
const paramsError = searchParams.get("error")
const paramsErrorReason = searchParams.get("error_reason")
const paramsSysNo = searchParams.get("sysNo")
const paramsDegreeType = searchParams.get("degreeType")
const paramsError = searchParams.get("error");
const paramsErrorReason = searchParams.get("error_reason");
const paramsSysNo = searchParams.get("sysNo");
const paramsDegreeType = searchParams.get("degreeType");
const evErrorsList = useSelector((state) => state?.partCErrorList);
console.log("evErrorsList = ", evErrorsList);
@ -103,17 +106,18 @@ function AnomalyPartC() {
}, [reduxSystemNo]);
useEffect(() => {
console.log("Use effect 11 called ...");
if (!reduxSystemNo) {
setShowSystemNoContainer(true);
} else {
if (evErrorsData && evErrorsData.length > 0) {
setEvErrors(evErrorsData);
}
if (error && errorReason) {
if (error) {
fetchAnomalyRecords(reduxSystemNo);
}
}
}, [error, errorReason]);
}, [error, errorReason,counter]);
useEffect(() => {
if (evErrors && evErrors.length > 0) {
@ -125,9 +129,10 @@ function AnomalyPartC() {
}, [evErrors]);
useEffect(() => {
// dispatch(updatePartCErrorData([]));
dispatch(updatePartCErrorData([]));
// setAnomalyData([]);
// setEvErrors([]);
setEvErrors([]);
setDataFetched(false);
fetchAnomalyData();
}, [selectedDegreeType]);
@ -160,6 +165,7 @@ function AnomalyPartC() {
const fetchAnomalyData = async () => {
setIsLoading(true);
setDataFetched(false);
try {
const response = await fetch(
`${
@ -174,6 +180,7 @@ function AnomalyPartC() {
);
const responseData = await response.json();
setAnomalyData(responseData.data);
setDataFetched(true);
dispatch(updatePartCErrorList(responseData.data));
} catch (error) {
console.error("Error fetching data: ", error);
@ -183,8 +190,9 @@ function AnomalyPartC() {
};
const fetchAnomalyRecords = async (reduxSystemNo) => {
console.log("fetching anomoly records")
console.log("fetching anomoly records");
setIsLoading(true);
setDataFetched(false);
try {
const response = await fetch(
`${import.meta.env.VITE_REACT_APP_BACKEND_URL}/getpartcEvErrors`,
@ -208,7 +216,7 @@ function AnomalyPartC() {
systemRecords = getRecordsBySystemId(responseData?.data, reduxSystemNo);
}
console.log("System records : ", systemRecords);
setDataFetched(true);
setEvErrors(systemRecords);
setIsLoading(false);
dispatch(updatePartCErrorData(systemRecords));
@ -222,7 +230,7 @@ function AnomalyPartC() {
function getRecordsBySystemId(records, systemId) {
const new_data = [];
if(!records) records = []
if (!records) records = [];
for (var i = 0; i < records.length; i++) {
var count = i % 5;
if (count === systemId - 1) {
@ -242,6 +250,7 @@ function AnomalyPartC() {
tmp["error_reason"] = errorReason;
console.log("tmp = ", tmp);
dispatch(updateSelectedJson(tmp));
setCounter(prev=>prev+1)
};
const handlePageChange = (page) => {
@ -333,7 +342,8 @@ function AnomalyPartC() {
</Select>
</FormControl>
</Box>
{anomalyData &&
{dataFetched ? (
anomalyData && anomalyData.length > 0 ? (
anomalyData.map((item, index) => (
<Card
onClick={() =>
@ -373,8 +383,14 @@ function AnomalyPartC() {
)} */}
</CardContent>
</Card>
))}
{evErrors && evErrors.length > 0 && (
))
) : (
<Box className="p-3 my-3 bg-white rounded">
<h5>No data to display ...</h5>
</Box>
)
) : null}
{evErrors && evErrors.length > 0 && dataFetched ? (
<>
<Box
display="flex"
@ -406,12 +422,16 @@ function AnomalyPartC() {
error={error}
error_reason={errorReason}
reduxSystemNo={reduxSystemNo}
degreeType = {selectedDegreeType}
degreeType={selectedDegreeType}
/>
))
)}
</>
)}
) : dataFetched && evErrorsList && evErrorsList.length == 0 ? (
<Box className="p-3 my-3 bg-white rounded">
<h5>No data to display ...</h5>
</Box>
) : null}
</>
)}
</Content>

View File

@ -20,6 +20,9 @@ const BarcodeScanner = () => {
});
const fetchBarcodeData = () => {
if(!scanResult){
return
}
setIsLoading(true);
try {
const payload = {

View File

@ -1,13 +1,21 @@
import { Layout, theme } from "antd";
import React, { useEffect, useState } from "react";
import React, { useEffect, useState, useRef } from "react";
import { useNavigate } from "react-router-dom/dist";
import ArrowBackIcon from "@mui/icons-material/ArrowBack";
import HomeIcon from "@mui/icons-material/Home";
import { useDispatch, useSelector } from "react-redux";
import { Box, Button, Card, CardContent, Typography, CircularProgress } from "@mui/material";
import {
Box,
Button,
Card,
CardContent,
Typography,
CircularProgress,
} from "@mui/material";
import { updateEvQrcodeList } from "../redux/actions/actions";
import SystemNumberDialog from "./SystemNumberDialog";
import { toast, ToastContainer } from "react-toastify";
import LoadingContainer from "./LoadingContainer";
const { Content, Header } = Layout;
@ -16,6 +24,7 @@ function EvQrcode() {
const [showSystemNoContainer, setShowSystemNoContainer] = useState(false);
const [anomalyData, setAnomalyData] = useState([]);
const [currentIndex, setCurrentIndex] = useState(0);
const inputRef = useRef(null);
const navigate = useNavigate();
@ -26,7 +35,9 @@ function EvQrcode() {
console.log("systemno: ", reduxSystemNo);
const dispatch = useDispatch();
const { token: { colorBgContainer } } = theme.useToken();
const {
token: { colorBgContainer },
} = theme.useToken();
useEffect(() => {
if (!reduxSystemNo) {
@ -82,15 +93,18 @@ function EvQrcode() {
const fetchAnomalyData = async () => {
setIsLoading(true);
try {
const response = await fetch(`${import.meta.env.VITE_REACT_APP_BACKEND_URL}/getEvRecords`, {
const response = await fetch(
`${import.meta.env.VITE_REACT_APP_BACKEND_URL}/getEvRecords`,
{
method: "POST",
body: JSON.stringify({
sysno: reduxSystemNo
sysno: reduxSystemNo,
}),
headers: {
"Content-Type": "application/json",
},
});
}
);
const responseData = await response.json();
var systemRecords = responseData?.data;
console.log("System record ====== ", responseData.systemRecord);
@ -120,59 +134,75 @@ function EvQrcode() {
}
const handleNext = () => {
setIsLoading(true);
setAnomalyData([]);
setTimeout(() => {
const newItems = anomalyData.filter((_, index) => index !== currentIndex);
setAnomalyData(newItems);
if (currentIndex >= newItems.length) {
setCurrentIndex(0);
}
setIsLoading(false)
},1000);
};
const handleUpdate = async() => {
const handleUpdate = async () => {
try {
const inputValue = document.getElementById('qrcodeInput').value;
console.log("inputvalu = ", inputValue)
const inputValue = document.getElementById("qrcodeInput").value;
console.log("inputvalu = ", inputValue);
const payload = {
imageName: currentItem.image_name,
qrvalue: inputValue,
};
console.log("payload=", payload)
console.log("payload=", payload);
const response = await fetch(`${import.meta.env.VITE_REACT_APP_BACKEND_URL}/updateEvRecord`, {
const response = await fetch(
`${import.meta.env.VITE_REACT_APP_BACKEND_URL}/updateEvRecord`,
{
method: "POST",
headers: {
"Content-Type": "application/json",
},
body:JSON.stringify(payload)
});
body: JSON.stringify(payload),
}
);
const responseData = await response.json();
console.log("responsedata: ", responseData)
console.log("responsedata: ", responseData);
if (responseData?.status_code === 200) {
toast.success("Record Updated Successfully");
handleNext()
document.getElementById('qrcodeInput').value = ''
}else{
handleNext();
document.getElementById("qrcodeInput").value = "";
} else {
toast.error("Updation Failed");
}
} catch (error) {
console.error("Error fetching data: ", error);
} finally {
setIsLoading(false);
}
}
};
const handleArrowBack = () => {
dispatch(updateEvQrcodeList([]));
navigate(-1)
}
navigate(-1);
};
if (isLoading) {
return <CircularProgress />;
}
const currentItem = anomalyData[currentIndex];
const imageUrl = currentItem ? `https://docs.exampaper.vidh.ai/${currentItem.s3_path}` : '';
const imageUrl = currentItem
? `https://docs.exampaper.vidh.ai/${currentItem.s3_path}`
: "";
const handleKeyDown = (e) => {
if (e.key === "Enter") {
console.log("Updating ......");
handleUpdate();
}
};
return (
<Layout style={{ minHeight: "100vh" }}>
@ -180,7 +210,10 @@ function EvQrcode() {
<ToastContainer />
<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={handleArrowBack}>
<Button
className="bg-primary p-1 text-light"
onClick={handleArrowBack}
>
<ArrowBackIcon />
</Button>
<Box className="d-flex justify-content-between gap-2">
@ -193,7 +226,10 @@ function EvQrcode() {
<b>System No : </b> {reduxSystemNo}
</Box>
)}
<Button className="bg-primary p-1 text-light" onClick={() => navigate("/")}>
<Button
className="bg-primary p-1 text-light"
onClick={() => navigate("/")}
>
<HomeIcon />
</Button>
</Box>
@ -202,36 +238,77 @@ function EvQrcode() {
<Content>
{currentItem ? (
<Box className="d-flex justify-content-center align-items-center flex-column" style={{ minHeight: '80vh' }}>
<Card style={{ display: 'flex', flexDirection: 'row', margin:'20px 20px 20px 20px' }}>
<Box style={{ flex: '20%', padding: '20px', marginTop:'30px', textAlign:'left' }}>
<Typography variant="h5" style={{paddingBottom:'20px'}}>Records Count: {anomalyData.length}</Typography>
<Typography variant="h6">Image Name: {currentItem.image_name}</Typography>
<Box
className="d-flex justify-content-center align-items-center flex-column"
style={{ minHeight: "80vh" }}
>
<Card
style={{
display: "flex",
flexDirection: "row",
margin: "20px 20px 20px 20px",
}}
>
<Box
style={{
flex: "20%",
padding: "20px",
marginTop: "30px",
textAlign: "left",
}}
>
<Typography variant="h5" style={{ paddingBottom: "20px" }}>
Records Count: {anomalyData.length}
</Typography>
<Typography variant="h6">
Image Name: {currentItem.image_name}
</Typography>
{/* <Typography variant="body2">S3 Path: {currentItem.s3_path}</Typography> */}
<Typography variant="subtitle1" style={{paddingTop:'20px', fontWeight:'bold'}}>Qrcode Value</Typography>
<Typography
variant="subtitle1"
style={{ paddingTop: "20px", fontWeight: "bold" }}
>
Qrcode Value
</Typography>
<input
type="text"
id="qrcodeInput"
placeholder="Enter qrcode value"
style={{
marginTop: '10px',
width: '100%',
padding: '5px',
backgroundColor: 'transparent',
color: '#000000' // black text color
marginTop: "10px",
width: "100%",
padding: "5px",
backgroundColor: "transparent",
color: "#000000", // black text color
}}
onKeyDown={handleKeyDown}
inputRef={inputRef}
/>
<Box mt={2}>
<Button variant="contained" color="primary" onClick={handleNext} style={{ marginRight: 10 }}>
<Button
variant="contained"
color="primary"
onClick={handleNext}
style={{ marginRight: 10 }}
>
Skip
</Button>
<Button variant="contained" color="secondary" onClick={handleUpdate} style={{backgroundColor:'green'}}>
<Button
variant="contained"
color="secondary"
onClick={handleUpdate}
style={{ backgroundColor: "green" }}
>
Update
</Button>
</Box>
</Box>
<CardContent style={{ flex: '80%' }}>
<img src={imageUrl} alt={currentItem.image_name} style={{ width: '100%', marginTop: '20px' }} />
<CardContent style={{ flex: "80%" }}>
<img
src={imageUrl}
alt={currentItem.image_name}
style={{ minWidth:"1000px",width: "100%", marginTop: "20px" }}
/>
</CardContent>
</Card>
</Box>
@ -241,9 +318,13 @@ function EvQrcode() {
</Content>
{showSystemNoContainer && (
<SystemNumberDialog setShowSystemNoContainer={setShowSystemNoContainer} showSystemNoContainer={showSystemNoContainer} />
<SystemNumberDialog
setShowSystemNoContainer={setShowSystemNoContainer}
showSystemNoContainer={showSystemNoContainer}
/>
)}
</Layout>
{isLoading && <LoadingContainer />}
</Layout>
);
}

View File

@ -1,4 +1,4 @@
import { useState, useEffect } from "react";
import { useState, useEffect, useRef } from "react";
import { useSelector } from "react-redux";
import { useSearchParams } from "react-router-dom";
import { Box, Button } from "@mui/material";
@ -37,8 +37,11 @@ const QueryCardEditor = () => {
const paramsSysNo = searchParams.get("sysNo");
const paramsDegreeType = searchParams.get("degreeType");
const [items, setItems] = useState([]);
const [evErrorsData,setEvErrorsData] = useState([]);
const [evErrorsData, setEvErrorsData] = useState([]);
const barcodeInputRef = useRef(null);
const qrInputRef = useRef(null);
const marksInputRef = useRef(null);
const subjectCodeInputRef = useRef(null);
const navigate = useNavigate();
const dispatch = useDispatch();
console.log("Ev errors list ==== ", evErrorsList);
@ -71,22 +74,21 @@ const QueryCardEditor = () => {
useEffect(() => {
const marksLocalData = localStorage.getItem("marks_manual_data");
console.log("Marks local data 123 ========= ",marksLocalData)
console.log("Marks local data 123 ========= ", marksLocalData);
if (marksLocalData) {
console.log("Into if and updating .......")
console.log("marks local data ==== ",marksLocalData)
console.log("Into if and updating .......");
console.log("marks local data ==== ", marksLocalData);
setEvErrorsData(JSON.parse(marksLocalData));
}
}, []);
useEffect(()=>{
dispatch(updateSystemNo(paramsSysNo))
},[paramsSysNo])
useEffect(() => {
dispatch(updateSystemNo(paramsSysNo));
}, [paramsSysNo]);
useEffect(()=>{
console.log("Ev error data =============== ",evErrorsData)
},[evErrorsData])
useEffect(() => {
console.log("Ev error data =============== ", evErrorsData);
}, [evErrorsData]);
useEffect(() => {
const fetchData = async () => {
@ -117,10 +119,9 @@ const QueryCardEditor = () => {
setS3Path(recordData?.s3_path);
}, [recordData]);
const updateRecord = async () => {
if(!marks){
return
if (!marks) {
return;
}
setIsLoading(true);
try {
@ -132,7 +133,7 @@ const QueryCardEditor = () => {
subjectCode,
marks,
imageName,
rotateAngle
rotateAngle,
};
const response = await fetch(
`${import.meta.env.VITE_REACT_APP_BACKEND_URL}/editPartCdata`,
@ -150,7 +151,10 @@ const QueryCardEditor = () => {
if (responseData?.status === "success") {
toast.success("Record Updated Successfully ...");
var currentIndex = null;
console.log("Ev errors data before filter ============= ",evErrorsData)
console.log(
"Ev errors data before filter ============= ",
evErrorsData
);
var newRecords = evErrorsData.filter((data, index) => {
if (data?.image_name === imageName) {
currentIndex = index;
@ -158,8 +162,8 @@ const QueryCardEditor = () => {
}
return true;
});
if(!currentIndex){
currentIndex = 0
if (!currentIndex) {
currentIndex = 0;
}
console.log("new records ======1 ", newRecords);
console.log("Current Index ===== ", currentIndex);
@ -219,10 +223,10 @@ const QueryCardEditor = () => {
}
};
const skipPage = () =>{
try{
if(evErrorsData){
var currentIndex = null
const skipPage = () => {
try {
if (evErrorsData) {
var currentIndex = null;
var newRecords = evErrorsData.filter((data, index) => {
if (data?.image_name === imageName) {
currentIndex = index;
@ -230,12 +234,12 @@ const skipPage = () =>{
}
return true;
});
if(!currentIndex){
currentIndex = 0
if (!currentIndex) {
currentIndex = 0;
}
console.log("Current Index ===== ", currentIndex);
const newIndex = currentIndex+1
console.log("new index ===== ",newIndex)
const newIndex = currentIndex + 1;
console.log("new index ===== ", newIndex);
if (newRecords.length > 0) {
console.log("Has to navigte 12 .....");
const newUrl = `/sqlPlayground/edit?image_name=${evErrorsData[newIndex]?.image_name}&table=ocr_scanned_part_c_v1&error=${paramsError}&error_reason=${paramsErrorReason}&degreeType=${paramsDegreeType}&sysNo=${paramsSysNo}`;
@ -243,40 +247,72 @@ const skipPage = () =>{
window.location.href = newUrl;
}
}
}catch(error){
throw new Error(error)
} catch (error) {
throw new Error(error);
}
}
};
const handleKeyDown = (e) => {
try {
console.log("Handle key down clicked ...", e);
console.log("event target ..... ", e.target);
console.log("barcode targed .....", barcodeInputRef.current);
if (e.key === "Enter") {
if (e.target === barcodeInputRef.current) {
qrInputRef.current.focus();
} else if (e.target === qrInputRef.current) {
marksInputRef.current.focus();
} else if (e.target === marksInputRef.current) {
subjectCodeInputRef.current.focus();
} else if (e.target === subjectCodeInputRef.current) {
updateRecord();
}
}
} catch (error) {}
};
return (
<AntdesignLayout>
<Box className="d-flex justify-content-between align-items-center">
<Box className="d-flex flex-column gap-3 w-25">
{imageName && <h5 className="text-left">ID : {imageName}</h5>}
{paramsError && <h5 className="text-left">Error Code : {paramsError}</h5>}
{paramsError && (
<h5 className="text-left">Error Code : {paramsError}</h5>
)}
{paramsDegreeType ? (
paramsDegreeType === 0 ? <h5 className="text-left">Degree Type : UG</h5> :
paramsDegreeType === 0 ? (
<h5 className="text-left">Degree Type : UG</h5>
) : (
<h5 className="text-left">Degree Type : PG</h5>
): null}
)
) : null}
<TextInputField
placeholder={"Barcode"}
placeholder="Barcode"
value={barcode}
setValue={setBarcode}
onKeyDown={handleKeyDown}
ref={barcodeInputRef}
/>
<TextInputField
placeholder={"QR Code"}
placeholder="QR Code"
value={qrcode}
setValue={setQrcode}
onKeyDown={handleKeyDown}
ref={qrInputRef}
/>
<TextInputField
placeholder={"Marks"}
placeholder="Marks"
value={marks}
setValue={setMarks}
onKeyDown={handleKeyDown}
ref={marksInputRef}
/>
<TextInputField
placeholder={"Subject Code"}
placeholder="Subject Code"
value={subjectCode}
setValue={setSubjectCode}
onKeyDown={handleKeyDown}
ref={subjectCodeInputRef}
/>
<Button
className="bg-primary text-white rounded p-3"
@ -289,7 +325,7 @@ const skipPage = () =>{
<Button
className="bg-primary text-white rounded p-3"
onClick={() => {
skipPage()
skipPage();
}}
>
Skip

View File

@ -0,0 +1,33 @@
import { useState, useEffect } from "react";
import { Box, Button } from "@mui/material";
import AntdesignLayout from "./AntdesignLayout";
import TextInputField from "./TextInputField";
const StudentResultsData = () => {
const [registerNumber, setRegisterNumber] = useState();
const [scannedValue, setScannedValue] = useState();
return (
<AntdesignLayout>
<Box>
<Box className="d-flex justify-content-center gap-3 flex-row">
<TextInputField
placeholder={"Register Number"}
value={registerNumber}
setValue={setRegisterNumber}
/>
<TextInputField
placeholder={"Scanned Value"}
value={scannedValue}
setValue={setScannedValue}
/>
<Box>
<Button className="bg-primary text-white p-3 rounded">Search</Button>
</Box>
</Box>
</Box>
</AntdesignLayout>
);
};
export default StudentResultsData;

View File

@ -1,10 +1,10 @@
import { Label } from "@mui/icons-material";
import { TextField, Box } from "@mui/material";
import React from 'react';
const TextInputField = ({ placeholder, value, setValue }) => {
const TextInputField = React.forwardRef(({ placeholder, value, setValue, onKeyDown }, ref) => {
return (
<Box className="d-flex flex-column">
<label for="limit-input" className="text-left">
<label htmlFor="limit-input" className="text-left">
{placeholder} :-
</label>
<TextField
@ -15,9 +15,11 @@ const TextInputField = ({ placeholder, value, setValue }) => {
autoComplete="off"
value={value}
onChange={(e) => setValue(e.target.value)}
onKeyDown={onKeyDown}
inputRef={ref}
/>
</Box>
);
};
});
export default TextInputField;