diff --git a/.env b/.env index a596950..43b1052 100644 --- a/.env +++ b/.env @@ -1,5 +1,5 @@ #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="http://localhost:9999" +#VITE_REACT_APP_BACKEND_URL="http://localhost:9999" VITE_REACT_APP_BACKEND_URL="https://api.exampaper.vidh.ai" \ No newline at end of file diff --git a/src/App.jsx b/src/App.jsx index e0e1452..ab23e8f 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -27,6 +27,9 @@ import QrcodeCardEditor from "./Components/QrCodeCardEditor"; import StudentResultsData from "./Components/StudentsResultsData"; import PlayGrounds from "./Components/PlayGrounds"; import PlayGround from "./Components/PlayGround"; +import Revaluation from "./Components/Revaluation"; +import PlayGroundUpdated from "./Components/PlaygroundUpdated" + function App() { return ( @@ -40,6 +43,8 @@ function App() { }> }> }> + }> + }> } diff --git a/src/Components/BarcodeScanner.jsx b/src/Components/BarcodeScanner.jsx index 84f1283..e3815ad 100644 --- a/src/Components/BarcodeScanner.jsx +++ b/src/Components/BarcodeScanner.jsx @@ -21,9 +21,11 @@ const BarcodeScanner = () => { }); const fetchBarcodeData = () => { + console.log("fetching barcode data ......",scanResult) if (!scanResult) { return; } + console.log("fetching barcode data ......") setIsLoading(true); setMarksData([]) setBarcodeInfo([]) @@ -47,6 +49,7 @@ const BarcodeScanner = () => { .then((response) => response.json()) .then((responseData) => { setIsLoading(false); + console.log("fetchbarcodedata result ===== ",responseData) if (responseData.status === "success") { setBarcodeInfo(responseData.results); setMarksData(responseData?.marks); @@ -87,7 +90,7 @@ const BarcodeScanner = () => { const reinitializeScanner = () => { console.log("calling reinitialize scanner ......") - setScanResult(null); + // setScanResult(null); setBarcodeInfo([]); setMarksData([]); // if (document.getElementById("reader")) { @@ -104,7 +107,7 @@ useEffect(()=>{ useEffect(() => { - console.log("Calling the use effect ..... scan result changed ...") + console.log("Calling the use effect ..... scan result changed ...",scanResult) if (!scanResult) { const readerEle = document.getElementById("reader"); console.log("Reader ELe ===== ", readerEle); diff --git a/src/Components/Home.jsx b/src/Components/Home.jsx index 447c05c..45677bd 100644 --- a/src/Components/Home.jsx +++ b/src/Components/Home.jsx @@ -43,7 +43,11 @@ const Home = () => { { title:"PlayGrounds", url:"/Playgrounds" - } + }, + // { + // title:"Revaluation", + // url:"/revaluation" + // }, // { // title:"Marks Verfication", // url:"/part-c/marks/verify" diff --git a/src/Components/PartAReassigned.jsx b/src/Components/PartAReassigned.jsx index 79e00dc..33b526f 100644 --- a/src/Components/PartAReassigned.jsx +++ b/src/Components/PartAReassigned.jsx @@ -32,6 +32,9 @@ import { } from "react-redux"; import useEnhancedEffect from "@mui/material/utils/useEnhancedEffect"; import SystemNumberDialog from "./SystemNumberDialog"; +import FormControl from "@mui/material/FormControl"; +import Select, { selectClasses } from "@mui/material/Select"; +import MenuItem from "@mui/material/MenuItem"; const { Header, Content, Footer, Sider } = Layout; function getItem(label, key, icon, children) { @@ -49,9 +52,11 @@ const PartAReassigned = () => { const [collapsed, setCollapsed] = useState(false); const [anomolyData, setAnomolyData] = useState([]); const [tableRowData, setTableRowData] = useState([]); + const [selectedDegreeType, setSelectedDegreeType] = useState(null); const [isLoading, setIsLoading] = useState(false); const [windowWidth, setWindowWidth] = useState(window.innerWidth); let [searchParams, setSearchParams] = useSearchParams(); + const [showSystemNoContainer, setShowSystemNoContainer] = useState(false); const searchParamsType = searchParams.get("type"); const dispatch = useDispatch(); @@ -60,6 +65,27 @@ const PartAReassigned = () => { ); const reduxSystemNo = useSelector((state) => state?.systemNumber); console.log("Redux partA 2023 anomoly data : ", reduxPartA2023AnomolyData); + const degreeTypes = [ + { type: "NON VOCATIONAL", type_code: "0" }, + { type: "VOCATIONAL", type_code: "6" }, + ]; + + const handleDegreeTypeChange = (e) => { + const newDegreeType = e.target.value; + console.log("Value ===== ", newDegreeType); + setSelectedDegreeType(newDegreeType); + // dispatch(updatePartCDegreeType(newDegreeType)); + }; + + useEffect(() => { + if (!selectedDegreeType) { + setSelectedDegreeType("0"); + } + }, []); + + useEffect(() => { + console.log("Selected degree type in use Effect === ", selectedDegreeType); + }, [selectedDegreeType]); useEffect(() => { if (!reduxSystemNo) { @@ -77,7 +103,10 @@ const PartAReassigned = () => { // localstorageRecords = JSON.parse(localstorageRecords); // } // } - fetchAnomalyData(reduxSystemNo) + if (selectedDegreeType) { + fetchAnomalyData(reduxSystemNo); + } + // if (localstorageRecords && localstorageRecords.length > 0) { // console.log( // "Length of local storage records is high so aborting fetching ..." @@ -112,7 +141,7 @@ const PartAReassigned = () => { // const sytemData = localStorage.get("part-a-old-anomoly") // } } - }, [reduxSystemNo]); + }, [reduxSystemNo, selectedDegreeType]); useEffect(() => { const handleResize = () => { @@ -157,7 +186,7 @@ const PartAReassigned = () => { const updateSystemReservationStatus = async (systemRecords) => { const payload = { systemRecords, - sysNo:reduxSystemNo + sysNo: reduxSystemNo, }; try { fetch( @@ -187,7 +216,7 @@ const PartAReassigned = () => { fetch( `${ import.meta.env.VITE_REACT_APP_BACKEND_URL - }/fetchAnamolyPartAData?type=${searchParamsType}&sysNo=${reduxSystemNo}`, + }/fetchAnamolyPartAData?type=${searchParamsType}&sysNo=${reduxSystemNo}°reeType=${selectedDegreeType}`, { method: "GET", headers: { @@ -203,15 +232,15 @@ const PartAReassigned = () => { console.log("Response Data is : ", responseData); setIsLoading(false); if (responseData.status === "success") { - console.log("System record ====== ",responseData.systemRecord) - var systemRecords = responseData?.data - if(!responseData.systemRecord){ - systemRecords = getRecordsBySystemId( + console.log("System record ====== ", responseData.systemRecord); + var systemRecords = responseData?.data; + if (!responseData.systemRecord) { + systemRecords = getRecordsBySystemId( responseData?.data, reduxSystemNo ); } - updateSystemReservationStatus(systemRecords); + //updateSystemReservationStatus(systemRecords); console.log("System records : ", systemRecords); if (searchParamsType === "old") { localStorage.setItem( @@ -351,6 +380,22 @@ const PartAReassigned = () => { margin: "16px 16px", }} > + + Degree Type + + + {degreeTypes.map((degree) => ( + + {degree.type} + + ))} + + + {tableRowData.length > 0 && ( diff --git a/src/Components/PlayGroundEditContainer.jsx b/src/Components/PlayGroundEditContainer.jsx index 9c7dbdd..6c2029e 100644 --- a/src/Components/PlayGroundEditContainer.jsx +++ b/src/Components/PlayGroundEditContainer.jsx @@ -10,7 +10,7 @@ import TextInputField from "./TextInputField"; import { Height } from "@mui/icons-material"; import HighlightOffIcon from "@mui/icons-material/HighlightOff"; import LoadingContainer from "./LoadingContainer"; -import { toast } from "react-toastify"; +//import { toast } from "react-toastify"; import { updatePlayGroundAttendence } from "./Utilities/AttendencePlaygroundUtilities"; import { updateAttendenceBlank } from "./Utilities/AttendencePlaygroundUtilities"; @@ -85,12 +85,12 @@ const PlayGroundEditContainer = ({ setIsLoading(false); console.log("response data ========= ", responseData); if (responseData?.status === "success") { - toast.success("Record Updated Successfully ..."); + //toast.success("Record Updated Successfully ..."); setShowEditContainer(false); } } catch (error) { setIsLoading(false); - toast.error("Something Went Wrong ..."); + //toast.error("Something Went Wrong ..."); throw new Error(error); } }; @@ -129,12 +129,12 @@ const PlayGroundEditContainer = ({ setIsLoading(false); console.log("response data ========= ", responseData); if (responseData?.status === "success") { - toast.success("Record Updated Successfully ..."); + //toast.success("Record Updated Successfully ..."); setShowEditContainer(false); } } catch (error) { setIsLoading(false); - toast.error("Something Went Wrong ..."); + //toast.error("Something Went Wrong ..."); throw new Error(error); } }; diff --git a/src/Components/PlayGrounds.jsx b/src/Components/PlayGrounds.jsx index a81b173..ca7c650 100644 --- a/src/Components/PlayGrounds.jsx +++ b/src/Components/PlayGrounds.jsx @@ -16,6 +16,10 @@ const PlayGrounds = () => { title: "ATTENDENCE", url: "/Playground/Attendence", }, + { + title: "Part - A Updated", + url: "/Playground/updated/PartA", + }, ]; return ( <> diff --git a/src/Components/PlaygroundUpdated.jsx b/src/Components/PlaygroundUpdated.jsx new file mode 100644 index 0000000..228f976 --- /dev/null +++ b/src/Components/PlaygroundUpdated.jsx @@ -0,0 +1,413 @@ +import React, { useState, useEffect, useRef } from "react"; +import { + DesktopOutlined, + FileOutlined, + PieChartOutlined, + TeamOutlined, + UserOutlined, +} from "@ant-design/icons"; +import { Breadcrumb, Layout, Menu, Typography, theme } from "antd"; +import { ToastContainer, toast } from "react-toastify"; +import { Box, Button } from "@mui/material"; +import TextField from "@mui/material/TextField"; +import EditButton from "./EditButton"; +import { width } from "@mui/system"; +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 RotateLeftIcon from "@mui/icons-material/RotateLeft"; +import RotateRightIcon from "@mui/icons-material/RotateRight"; +import { + updatePartAanomolyData, + updatePlaygroundCurrentPage, + updatePlaygroundResults, + updatePlaygroundTotalPages, + updateSystemNo, +} from "../redux/actions/actions"; +import { Select } from "antd"; + +import CustomQueryExecutorCard from "./CustomQueryExecutorCard"; +import SimpleDialog from "./SimpleDialog"; +import SystemNumberDialog from "./SystemNumberDialog"; +import ValidationContainer from "./ValidationContainer"; +import QueryExecutorCard from "./QueryExecutorCard"; +import ArrowUpwardIcon from "@mui/icons-material/ArrowUpward"; +import QueryExecutortextArea from "./QueryExecutortextArea"; +import AntdesignLayout from "./AntdesignLayout"; +import TextInputField from "./TextInputField"; +import { render } from "react-dom"; +import { updatePlaygroundQuery } from "../redux/actions/actions"; +import { useSelector, useDispatch } from "react-redux"; +import PlayGrounds from "./PlayGrounds"; +import { useParams } from "react-router-dom"; +import UpdatedPlaygroundUpdater from "./UpdatedPlaygroundUpdater"; + +const { Header, Content, Footer, Sider } = Layout; +const PlayGroundUpdated = () => { + const { type } = useParams(); + + console.log("Backend URL:", import.meta.env.VITE_REACT_APP_BACKEND_URL); + + console.log("Type ============= ", type); + const [tableName, setTableName] = useState(null); + const tableType = { + PartA: "ocr_scanned_part_a_v1", + PartC: "ocr_scanned_part_c_v1", + Attendence: "attendence_scanned_data", + }; + + useEffect(() => { + console.log("use effect type 123==== ", type); + console.log("use effect table name ===== ", tableName); + console.log("table name ==== ", tableType[type]); + if (!tableName) { + setTableName(tableType[type]); + } + }, [type, tableName]); + + const [cardData, setCardData] = useState({}); + const [responseData, setResponseData] = useState(null); + const [totalData, setTotalData] = useState([]); + const [currentPage, setCurrentPage] = useState(1); + const [totalPages, setTotalPages] = useState(0); + const [imageColumn, setImageColumn] = useState(null); + const [dataFetched, setDataFetched] = useState(false); + const [currentCardIndex, setCurrentCardIndex] = useState(0); + const [query, setQuery] = useState(""); + const [isLoading, setIsLoading] = useState(false); + const [paginationPages, setPaginationPages] = useState(null); + const [limit, setLimit] = useState(""); + const recordsPerPage = 50; + const resultsContainerRef = useRef(); + const navigate = useNavigate(); + const dispatch = useDispatch(); + const reduxPlaygroundQuery = useSelector((state) => state?.playGroundQuery); + const reduxPlaygroundPageNo = useSelector( + (state) => state?.playGroundCurrentPage + ); + const reduxPlaygroundTotalPages = useSelector( + (state) => state?.playGroundtotalPages + ); + const reduxPlaygroundResults = useSelector( + (state) => state?.playGroundResults + ); + console.log("Redux playground query : ", reduxPlaygroundQuery); + console.log("Redux playground page no : ", reduxPlaygroundPageNo); + console.log("Redux playground total pages : ", reduxPlaygroundTotalPages); + console.log("Redux playground resutls : ", reduxPlaygroundResults); + const { + token: { colorBgContainer, borderRadiusLG }, + } = theme.useToken(); + + useEffect(() => { + if (reduxPlaygroundQuery && !query) { + setQuery(reduxPlaygroundQuery); + } + }, [reduxPlaygroundQuery]); + + useEffect(() => { + if (reduxPlaygroundPageNo != 0 && totalPages == 0) { + setTotalPages(reduxPlaygroundTotalPages); + } + }, [reduxPlaygroundTotalPages]); + + useEffect(() => { + console.log("1234 ---- useEffect"); + + if (totalData?.length == 0 && reduxPlaygroundResults) { + console.log("Redux playground results if ..."); + console.log( + "reduxPlaygroundResults.type === type ", + reduxPlaygroundResults.type === type + ); + if (reduxPlaygroundResults.type === type) { + console.log("Into if ..."); + setTotalData(reduxPlaygroundResults?.data); + setImageColumn("s3_path"); + } + } + }, [reduxPlaygroundResults]); + + useEffect(() => { + if (currentPage == 0 && reduxPlaygroundPageNo !== 0) { + console.log("Updating in use effect ============================= >"); + setCurrentPage(reduxPlaygroundPageNo); + } + }, [reduxPlaygroundPageNo]); + + const fetchQueryValue = async () => { + // console.log("results container ref ===== ", resultsContainerRef); + // if (resultsContainerRef) { + // console.log( + // "Results container ref current ===== ", + // resultsContainerRef.current + // ); + // resultsContainerRef.current.innerHTML = ""; + // } + if (query.includes("limit")) { + alert("Please specify the limit in the input field."); + return; + } + if (query.includes(";")) { + alert("Please remove the special character from the query ';'"); + return; + } + if (!limit) { + alert("Limit cannot be empty !!"); + return; + } + if ( + !query.includes("image_name") && + !query.includes("*") && + query.includes("ocr_scanned_part_c_v1") + ) { + alert( + "Selecting primary Key (image_name) or Selecting all (*) is mandatory" + ); + return; + } + if (!query.includes(tableName)) { + alert(`This playground is only for : ${tableName}`); + return; + } + setIsLoading(true); + const payload = { + query: query, + limit: limit, + }; + + try { + const response = await fetch( + `${import.meta.env.VITE_REACT_APP_BACKEND_URL}/fetchQueryValue`, + { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify(payload), + } + ); + const data = await response.json(); + setIsLoading(false); + if (data.status === "success") { + setDataFetched(true); + setTotalData(data.results); + var tmp = {}; + tmp.type = type; + tmp.data = data?.results; + // dispatch(updatePlaygroundResults(data?.results)); + dispatch(updatePlaygroundResults(tmp)); + const totalPageCount = Math.ceil(data?.results.length / recordsPerPage); + setTotalPages(totalPageCount); + dispatch(updatePlaygroundTotalPages(totalPages)); + setCurrentPage(1); + setResponseData(data.results.slice(0, recordsPerPage)); + const totalResults = data?.results; + if (totalResults) { + if (totalResults?.length > 0) { + setCardData(totalResults[0]); + } + } + } else { + toast.error(data.message); + } + } catch (error) { + console.error("Error:", error); + } + }; + + useEffect(() => { + dispatch(updatePlaygroundQuery(query)); + }, [query]); + + useEffect(() => { + if (totalData) { + if (totalData.length > 0) { + setResponseData([]); + console.log(" ===========================>>>>>>>>>>>>>>>>>>>>>>>> "); + setIsLoading(true); + setTimeout(() => { + const startIndex = (currentPage - 1) * recordsPerPage; + const endIndex = startIndex + recordsPerPage; + setResponseData(totalData.slice(startIndex, endIndex)); + setIsLoading(false); + }, 1000); + } + dispatch(updatePlaygroundCurrentPage(currentPage)); + renderPagination(); + } + }, [currentPage, totalData]); + + const renderPagination = () => { + const pages = []; + for (let i = 1; i <= totalPages; i++) { + pages.push( + + {i > 1 && " | "} + setCurrentPage(i)} + className={i === currentPage ? "active" : ""} + > + {i} + + + ); + } + setPaginationPages(pages); + }; + + useEffect(() => { + renderPagination(); + dispatch(updatePlaygroundTotalPages(totalPages)); + }, [currentPage, totalPages]); + + useEffect(() => { + console.log("current card index use effect ... ", currentCardIndex); + if (totalData) { + if (totalData.length > 0 && currentCardIndex < totalData.length) { + setIsLoading(true); + setTimeout(() => { + setCardData(totalData[currentCardIndex]); + setIsLoading(false); + }, 1000); + } + } + }, [currentCardIndex]); + + useEffect(() => { + if (totalData?.length > 0) { + console.log("Result container ref ===== ", resultsContainerRef.current); + resultsContainerRef.current.scrollIntoView(); + resultsContainerRef.current.scroll; + // Adding a slight delay to ensure the element is rendered + // setTimeout(() => { + // resultsContainerRef.current.scrollIntoView({ behavior: "smooth" }); + // }, 100); + } + }, [totalData]); + + const getTableData = () => { + if (totalData.length === 0) { + return ( + + No Results Found ... + + ); + } + + const keys = Object.keys(totalData[0]); + + return ( + + + {responseData ? ( + responseData.length > 0 ? ( + + ) : ( + No Results Found ... + ) + ) : null} + + + ); + }; + + const handleSelect = (e) => { + console.log("E ======= ", e); + setImageColumn(e); + }; + + return ( + + + + + + + + + + {totalData && totalData.length > 0 ? ( + + {Object.keys(totalData[0]).map((key) => ( + + {key} + + ))} + + ) : null} + + + Submit + + + + + + + setLimit(e.target.value)} + /> + {totalData && totalData.length > 0 ? ( + + {Object.keys(totalData[0]).map((key) => ( + + {key} + + ))} + + ) : null} + + + Submit + + + + + + {dataFetched && getTableData()} + + + {isLoading && } + + ); +}; + +export default PlayGroundUpdated; diff --git a/src/Components/Revaluation.jsx b/src/Components/Revaluation.jsx new file mode 100644 index 0000000..129b508 --- /dev/null +++ b/src/Components/Revaluation.jsx @@ -0,0 +1,215 @@ +import { Box, Button } from "@mui/material"; +import { useState, useEffect } from "react"; +import { ToastContainer, toast } from "react-toastify"; +import { UserOutlined } from "@ant-design/icons"; +import { Avatar, Space } from "antd"; +import { Drawer, Flex } from "antd"; +import { DownloadOutlined } from "@ant-design/icons"; + +import TextInputField from "./TextInputField"; +import LoadingContainer from "./LoadingContainer"; + +const Revaluation = () => { + const [registerNumber, setRegisterNumber] = useState(null); + const [subjectCode, setSubjectCode] = useState(null); + const [isLoading, setIsLoading] = useState(false); + const [studentInfo, setStudentInfo] = useState([]); + const [partAInfo, setPartAInfo] = useState([]); + const [partCInfo, setPartCInfo] = useState([]); + const [open, setOpen] = useState(false); + const [size, setSize] = useState("large"); + const [type,setType] = useState(null) + + const showDrawer = () => { + setOpen(true); + }; + + const onClose = () => { + setOpen(false); + }; + const submitRevaluationAction = async () => { + console.log("submitRevalutionResults ...."); + if (!subjectCode || !registerNumber) { + console.log("Returning ..."); + return; + } + setIsLoading(true); + const payload = { + subjectCode, + registerNumber, + }; + try { + const response = await fetch( + `${import.meta.env.VITE_REACT_APP_BACKEND_URL}/submitRevalutionResults`, + { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify(payload), + } + ); + setIsLoading(false); + const responseData = await response.json(); + if (responseData.status === "success") { + setStudentInfo(responseData?.studentInfo); + setPartAInfo(responseData?.partAInfo); + setPartCInfo(responseData?.partCInfo); + } else { + toast.error("Something went Wrong !!"); + } + } catch (error) { + setIsLoading(false); + throw new Error(error); + } + }; + + return ( + <> + + + Welcome to exampaper.vidh.ai + + + {" "} + + + + + Submit + + + {studentInfo.length > 0 && ( + + + + } /> + + + + Student Name : + {studentInfo[0]?.candidate_name} + + + Register Number : + {studentInfo[0]?.register_number} + + + {" "} + Subject Code : + {studentInfo[0]?.subject_code} + + + {" "} + Exam Date : + {studentInfo[0]?.exam_date} + + + {" "} + Exam Centre Code : + {studentInfo[0]?.exam_centre_code} + + + {" "} + Exam Centre : + {studentInfo[0]?.exam_center} + + + + {partCInfo && ( + + Show Part C Data.. + + )} + + + {studentInfo.length > 0 && ( + + + {" "} + Barcode 2 : + {studentInfo[0]?.bar_code2} + + + {" "} + QR code 2 : + {studentInfo[0]?.qr_code2} + + + {" "} + Barcode 4 : + {studentInfo[0]?.bar_code4} + + + {" "} + QR code 4 : + {studentInfo[0]?.qr_code4} + + + + + + + + )} + + + {partCInfo && ( + + Show Part A Data.. + + )} + + + {partCInfo.length > 0 && ( + + )} + + + )} + {isLoading && } + + > + ); +}; + +export default Revaluation; diff --git a/src/Components/UpdatedPlaygroundUpdater.jsx b/src/Components/UpdatedPlaygroundUpdater.jsx new file mode 100644 index 0000000..f1185ab --- /dev/null +++ b/src/Components/UpdatedPlaygroundUpdater.jsx @@ -0,0 +1,814 @@ +import { Box, Button } from "@mui/material"; +import DownloadIcon from "@mui/icons-material/Download"; +import { LazyLoadImage } from "react-lazy-load-image-component"; +import { Label, MoreHorizTwoTone, RotateRight } from "@mui/icons-material"; +import { useState, useEffect, useRef } from "react"; +import { ToastContainer, toast } from "react-toastify"; +import LoadingContainer from "./LoadingContainer"; +import { useNavigate } from "react-router-dom"; +// import "react-toastify/dist/ReactToastify.css"; +import RotateLeftIcon from "@mui/icons-material/RotateLeft"; +import RotateRightIcon from "@mui/icons-material/RotateRight"; +import PlayGroundEditContainer from "./PlayGroundEditContainer"; +import saveRotatedImage from "./Utilities/PartCPlaygroundUtilities"; +import markAsPartc from "./Utilities/PartAPlaygroundUtilities"; +import { updateAttendenceBlank } from "./Utilities/AttendencePlaygroundUtilities"; +import TextInputField from "./TextInputField"; +import ArrowBackIcon from "@mui/icons-material/ArrowBack"; +import ArrowForwardIcon from "@mui/icons-material/ArrowForward"; + +const UpdatedPlaygroundUpdater = ({ + oldData, + s3_image_column, + query, + error, + error_reason, + reduxSystemNo, + degreeType, + type, + tableName, + currentCardIndex, + setCurrentCardIndex, + setCardData, + totalData, +}) => { + // console.log("ERROR ============= ",error) + // console.log("ERROR REASON ============== ",error_reason) + // console.log("REDUX SYSTEM NO ================== ",reduxSystemNo) + const navigate = useNavigate(); + const [dataValue, setDataValue] = useState({}); + const [isLoading, setIsLoading] = useState(false); + // console.log("data in query executor Card : ", data); + const [keys, setKeys] = useState([]); + const [values, setValues] = useState([]); + const [rotateAngle, setRotateAngle] = useState(0); + const [imageName, setImageName] = useState(null); + const [tableNameData, setTableNameData] = useState(null); + const imageEleRef = useRef(); + const [showEditContainer, setShowEditContainer] = useState(false); + const [editorType, setEditorType] = useState(null); + const dialogText = "This is dialog text"; + const [marks, setMarks] = useState(null); + const [registerNumber, setRegisterNumber] = useState(null); + const [totalStudents, setTotalStudents] = useState(null); + const [totalPresent, setTotalPresent] = useState(null); + const [totalAbsent, setTotalAbsent] = useState(null); + const [barcode, setBarcode] = useState(null); + const [qrcode, setQrcode] = useState(null); + const [s3Path, setS3Path] = useState(null); + const [subjectCode, setSubjectCode] = useState(null); + const [data,setData] = useState(null) + + const [open, setOpen] = useState(true); // Set open state to true by default + const handleClose = () => { + setOpen(false); + }; + + useEffect(() => { + console.log("data ========== ", data); + if (data) { + setQrcode(data.qrcode); + setBarcode(data.barcode); + setMarks(data.marks); + setS3Path(data.s3Path); + setSubjectCode(data.subject_code); + setRegisterNumber(data.register_number); + setTotalAbsent(data?.total_absent); + setTotalPresent(data?.total_present); + setTotalStudents(data?.total_students); + } + console.log("the currect editor type: ", type); + }, [data]); + + useEffect(() => { + console.log("barcode in use effect ==== ", barcode); + }, [barcode]); + + const updateRecordPartC = async () => { + if (!marks) { + return; + } + setIsLoading(true); + try { + const payload = { + qrcode, + barcode, + table: tableName, + s3Path, + subjectCode, + marks, + imageName, + rotateAngle, + }; + const response = await fetch( + `${import.meta.env.VITE_REACT_APP_BACKEND_URL}/editPartCdata`, + { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify(payload), + } + ); + const responseData = await response.json(); + setIsLoading(false); + console.log("response data ========= ", responseData); + if (responseData?.status === "success") { + //toast.success("Record Updated Successfully ..."); + setShowEditContainer(false); + } + } catch (error) { + setIsLoading(false); + //toast.error("Something Went Wrong ..."); + throw new Error(error); + } + }; + + console.log("data =================== ", data); + // console.log("image column ====== ", s3_image_column); + // console.log("s3 image ======= ", data[s3_image_column]); + // console.log("Keys ==== ",keys) + // console.log("Values ===== ",values) + + useEffect(() => { + if (data) { + console.log("Image name ====== ", data?.image_name); + setImageName(data?.image_name); + } + if (tableName) { + setTableNameData(tableName); + } + if (data?.subject_code) { + } + }, [data]); + + const updatePartAInstructions = async () => { + console.log("update instrunction"); + const payload = { + data, + }; + try { + setIsLoading(true); + const response = await fetch( + `${import.meta.env.VITE_REACT_APP_BACKEND_URL}/updatePartAInstructions`, + { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify(payload), + } + ); + setIsLoading(false); + const responseData = await response.json(); + if (responseData?.status === "success") { + console.log("Updation successfull ...."); + const updatedData = { ...dataValue, is_backpage: 1 }; + // console.log("Data ===== ", updatedData); + setDataValue(updatedData); + // toast.success("Record Marked as Backpage ! ...."); + } else { + throw new Error(responseData?.message); + } + } catch (error) { + throw new Error(error); + } + }; + + const updatePartAFront = async () => { + console.log("update front"); + const payload = { + data, + }; + try { + setIsLoading(true); + const response = await fetch( + `${import.meta.env.VITE_REACT_APP_BACKEND_URL}/partAFrontSideMarking`, + { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify(payload), + } + ); + setIsLoading(false); + const responseData = await response.json(); + if (responseData.status === "success") { + console.log("Updation successfull ...."); + const updatedData = { ...dataValue, is_backpage: 1 }; + // console.log("Data ===== ", updatedData); + setDataValue(updatedData); + // toast.success("Record Marked as Backpage ! ...."); + } else { + throw new Error(responseData?.message); + } + } catch (error) { + throw new Error(error); + } + }; + + const updateFront = async () => { + console.log("update front"); + const payload = { + data, + }; + try { + setIsLoading(true); + const response = await fetch( + `${import.meta.env.VITE_REACT_APP_BACKEND_URL}/partcEvFrontSideMarking`, + { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify(payload), + } + ); + setIsLoading(false); + const responseData = await response.json(); + if (responseData.status === "success") { + console.log("Updation successfull ...."); + const updatedData = { ...dataValue, is_backpage: 1 }; + // console.log("Data ===== ", updatedData); + setDataValue(updatedData); + toast.success("Record Marked as Frontpage ! ...."); + } else { + toast.error("Something Went Wrong !..."); + setIsLoading(false); + throw new Error(responseData?.message); + } + } catch (error) { + throw new Error(error); + } + }; + + const updateBack = async () => { + const payload = { + data, + }; + try { + setIsLoading(true); + const response = await fetch( + `${import.meta.env.VITE_REACT_APP_BACKEND_URL}/partcEvBacksideMarking`, + { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify(payload), + } + ); + setIsLoading(false); + const responseData = await response.json(); + if (responseData.status === "success") { + console.log("Updation successfull ...."); + const updatedData = { ...dataValue, is_backpage: 1 }; + // console.log("Data ===== ", updatedData); + setDataValue(updatedData); + toast.success("Record Marked as Backpage ! ...."); + } else { + setIsLoading(false); + toast.error("Something Went Wrong !..."); + throw new Error(responseData?.message); + } + } catch (error) { + throw new Error(error); + } + }; + + const initateProcess = () => { + console.log("inititate process.."); + }; + + const rotateLeft = () => { + console.log("rotate left ....."); + const newAngle = rotateAngle - 90; + setRotateAngle((prev) => prev - 90); + console.log("new angle ....", newAngle); + const newStyle = `rotate(${newAngle}deg)`; + imageEleRef.current.style.transform = newStyle; + }; + + const rotateRight = () => { + console.log("rotate right"); + const newAngle = rotateAngle + 90; + setRotateAngle((prev) => prev + 90); + const newStyle = `rotate(${newAngle}deg)`; + imageEleRef.current.style.transform = newStyle; + }; + + const updateEvCover = async () => { + const payload = { + data, + }; + try { + setIsLoading(true); + const response = await fetch( + `${import.meta.env.VITE_REACT_APP_BACKEND_URL}/partcEvCoverMarking`, + { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify(payload), + } + ); + setIsLoading(false); + const responseData = await response.json(); + if (responseData.status === "success") { + const updatedData = { ...dataValue, is_cover: 1 }; + // console.log("Data ===== ", updatedData); + setDataValue(updatedData); + console.log("Updation successfull ...."); + // toast.success("Record Marked As Ev !..."); + } else { + throw new Error(responseData?.message); + } + } catch (error) { + throw new Error(error); + } + }; + + const markAsDummy = async () => { + const payload = { + data, + }; + try { + setIsLoading(true); + const response = await fetch( + `${import.meta.env.VITE_REACT_APP_BACKEND_URL}/partcEvDummyMarking`, + { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify(payload), + } + ); + setIsLoading(false); + const responseData = await response.json(); + if (responseData.status === "success") { + const updatedData = { ...dataValue, is_cover: 1 }; + // console.log("Data ===== ", updatedData); + setDataValue(updatedData); + console.log("Updation successfull ...."); + toast.success("Record Marked As Ev !..."); + } else { + setIsLoading(false); + toast.error("Something Went Wrong !..."); + throw new Error(responseData?.message); + } + } catch (error) { + setIsLoading(false); + toast.error("Something Went Wrong !..."); + throw new Error(error); + } + }; + + const showContainerAction = () => { + setShowEditContainer(true); + console.log("type === ", type); + // setEditorType(type) + }; + + const updateAttendenceBlankAction = () => { + updateAttendenceBlank(setIsLoading, data, setShowEditContainer); + }; + + const buttonActions = { + PartC: [ + { btnLabel: "Mark As Front", action: updateFront }, + { btnLabel: "Mark As Back", action: updateBack }, + { btnLabel: "Mark As Ev", action: updateEvCover }, + { btnLabel: "Mark As Dummy", action: markAsDummy }, + { btnLabel: "Edit", action: showContainerAction }, + ], + PartA: [ + { btnLabel: "Mark As Front", action: updatePartAFront }, + { btnLabel: "Mark As Backpage", action: updatePartAInstructions }, + // { btnLabel: "Initiate Process", action: initateProcess }, + { btnLabel: "Mark As Dummy", action: markAsDummy }, + { btnLabel: "Mark As Part-C", action: markAsPartc }, + { btnLabel: "Edit", action: showContainerAction }, + ], + Attendence: [ + { btnLabel: "Mark As Blank", action: updateAttendenceBlankAction }, + { btnLabel: "Edit", action: showContainerAction }, + ], + }; + + // useEffect(() => { + // setDataValue(data); + // setKeys(Object.keys(data)); + // setValues(Object.values(data)); + // }, [data]); + + useEffect(() => { + console.log("Data value ===== ", dataValue); + setKeys(Object.keys(dataValue)); + setValues(Object.values(dataValue)); + }, [dataValue]); + + const rotate_and_process = async () => { + setIsLoading(true); + try { + const payload = { + data, + }; + const response = await fetch( + `${import.meta.env.VITE_REACT_APP_BACKEND_URL}/partCRotateProcess`, + { + method: "POST", + header: { + "Content-Type": "application/json", + }, + body: JSON.stringify(payload), + } + ); + const responseData = await response.json(); + setIsLoading(false); + if (responseData.status === "success") { + console.log("Response successfull ..."); + } + } catch (error) { + setIsLoading(false); + throw new Error(error); + } + }; + + const updateRecordPartA = async () => { + console.log(registerNumber); + console.log(subjectCode); + console.log(barcode, qrcode); + console.log(!registerNumber && !subjectCode && (!barcode || !qrcode)); + if (!registerNumber && !subjectCode && (!barcode || !qrcode)) { + return; + } + setIsLoading(true); + try { + const payload = { + qrcode, + barcode, + table: tableName, + s3Path, + subjectCode, + registerNumber, + imageName, + rotateAngle, + }; + const response = await fetch( + `${import.meta.env.VITE_REACT_APP_BACKEND_URL}/editPartAdata`, + { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify(payload), + } + ); + const responseData = await response.json(); + setIsLoading(false); + console.log("response data ========= ", responseData); + if (responseData?.status === "success") { + //toast.success("Record Updated Successfully ..."); + if (totalData) { + console.log("current total length ... ", totalData?.length); + console.log("current current index ...", currentCardIndex); + if (currentCardIndex < totalData?.length - 1) { + setCurrentCardIndex((prev) => prev + 1); + } + } + const newCurrentIndex = currentCardIndex + 1; + } + } catch (error) { + setIsLoading(false); + //toast.error("Something Went Wrong ..."); + throw new Error(error); + } + }; + + const saveRotatedImage = async () => { + try { + if (rotateAngle === 0) { + return; + } + const payload = { + imageName, + tableNameData, + rotateAngle, + s3_path: data[s3_image_column], + }; + setIsLoading(true); + const response = await fetch( + `${import.meta.env.VITE_REACT_APP_BACKEND_URL}/saveRotatedImage`, + { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify(payload), + } + ); + setIsLoading(false); + const responseData = await response.json(); + if (responseData.status === "success") { + toast.success("Image Rotation Saved Successfully"); + } else { + toast.error("Something Went Wrong !..."); + } + } catch (error) { + setIsLoading(false); + toast.error("Something Went Wrong !..."); + throw new Error(error); + } + }; + + useEffect(() => { + if (oldData?.image_name && tableName) { + const fetchPrimaryKeyData = async () => { + setIsLoading(true) + try { + const payload = { + table: tableName, + image_name: oldData?.image_name, + }; + const response = await fetch( + `${import.meta.env.VITE_REACT_APP_BACKEND_URL}/fetchPrimaryKeyData`, + { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify(payload), + } + ); + const responseData = await response.json(); + console.log("response json 11 === ", responseData); + setIsLoading(false) + if (responseData?.status === "success") { + const results = responseData?.data; + console.log("results ==== ", results); + if (results?.length > 0) { + console.log("results === ", results); + setData(results[0]); + } + } + } catch (error) { + setIsLoading(false) + throw new Error(error); + } + }; + setTimeout(() => { + fetchPrimaryKeyData(); + }, 200); + } + }, [oldData]); + + return ( + + + + + + {/* {query.includes("ocr_scanned_part_c_v1") && + data[s3_image_column] && ( + <> + navigate(`/sqlPlayground/edit?image_name=${data["image_name"]}&table=ocr_scanned_part_c_v1&error=${error}&error_reason=${error_reason}&sysNo=${reduxSystemNo}°reeType=${degreeType}`)} + > + Edit + + { + mark_as_backpage(); + }} + > + Mark As Back + + { + mark_as_ev(); + }} + > + Mark As EV + + { + mark_as_dummy(); + }} + > + Mark As Dummy + + > + )} */} + + {/* + + + + */} + + + + + + {/* + {type && + buttonActions[type].map((action) => ( + + {action?.btnLabel} + + ))} + + + Rotate left + + + + + Rotate Right + + + + saveRotatedImage( + imageName, + tableNameData, + rotateAngle, + data, + setIsLoading + ) + } + > + Save + + + */} + + {type !== "Attendence" ? ( + <> + + + + > + ) : ( + <> + + + + + + > + )} + {type == "PartC" ? ( + + ) : type == "PartA" ? ( + + ) : null} + {type == "PartC" ? ( + updateRecordPartC()} + > + Update + + ) : type == "PartA" ? ( + updateRecordPartA()} + > + Update + + ) : type == "Attendence" ? ( + + updatePlayGroundAttendence( + setIsLoading, + qrcode, + subjectCode, + totalStudents, + totalPresent, + totalAbsent, + data, + setShowEditContainer + ) + } + > + Update + + ) : null} + {/* Skip */} + + { + if (totalData) { + if (currentCardIndex >= 1) { + setCurrentCardIndex((prev) => prev - 1); + } + } + }} + > + + + { + if (totalData) { + console.log("current total length ... ", totalData?.length); + console.log("current current index ...", currentCardIndex); + if (currentCardIndex < totalData?.length - 1) { + setCurrentCardIndex((prev) => prev + 1); + } + } + }} + > + + + + + + {isLoading && } + {showEditContainer && ( + + )} + + ); +}; + +export default UpdatedPlaygroundUpdater;