part c v1

src/App.jsx

@@ -20,6 +20,7 @@ import QueryExecutor from "./Components/QueryExecutor";
 import RecordEditor from "./Components/RecordEditor";
 import VerifyMarks from "./Components/VerifyMarks";
 import QueryCardEditor from "./Components/QueryCardEditor";
+import AnomolyPartC from "./Components/AnomolyPartC";
 
 function App() {
   return (
@@ -76,6 +77,8 @@ function App() {
             path="/anomoly/partA/booklet"
             element={<PartACorrection />}
           ></Route>
+          <Route path="/anomoly/partC" element={<AnomolyPartC/>}></Route>
+          
         </Routes>
       </BrowserRouter>
     </>

src/Components/AnomolyPartC.jsx

@@ -0,0 +1,332 @@
+import React, { useEffect, useState } from 'react';
+import { Box, Button, Card, CardContent, Typography, CircularProgress } from '@mui/material';
+import { Layout, theme, Pagination } from 'antd';
+import { useNavigate } from "react-router-dom";
+import ArrowBackIcon from "@mui/icons-material/ArrowBack";
+import HomeIcon from "@mui/icons-material/Home";
+import QueryExecutorCard from './QueryExecutorCard';
+import { updatePartCErrorList, updatePartCErrorData, updateSelectedError, updateSelectedJson } from '../redux/actions/actions';
+import { useSelector, useDispatch } from 'react-redux';
+import SystemNumberDialog from './SystemNumberDialog';
+
+const { Content, Header } = Layout;
+
+function AnomalyPartC() {
+    const [isLoading, setIsLoading] = useState(false);
+    const [isLoading2, setIsLoading2] = useState(false);
+    const [anomalyData, setAnomalyData] = useState(null);
+    const [evErrors, setEvErrors] = useState([]);
+    const [error, setError] = useState(null);
+    const [errorReason, setErrorReason] = useState(null);
+    const [currentPage, setCurrentPage] = useState(1);
+    const [totalPages, setTotalPages] = useState(1);
+    const [showSystemNoContainer, setShowSystemNoContainer] = useState(false);
+    const [selectedIndex, setSelectedIndex] = useState(null);
+
+    const {
+        token: { colorBgContainer, borderRadiusLG },
+    } = theme.useToken();
+    const navigate = useNavigate();
+    const dispatch = useDispatch();
+    const evErrorsList = useSelector((state) => state?.partCErrorList);
+    console.log("evErrorsList = ", evErrorsList)
+
+    const evErrorsData = useSelector((state) => state?.partCErrorData);
+    console.log("evErrorData: ", evErrorsData)
+
+    const reduxSystemNo = useSelector((state) => state?.systemNumber);
+    console.log("systemno: ", reduxSystemNo)
+
+    // const selectedError = useSelector((state) => state?.selectedError);
+    // console.log("selectedError: ", selectedError)
+
+    // const selectedErrorData = useSelector((state) => state?.selectedErrorData);
+    // console.log("selectedErrorData: ", selectedErrorData)
+
+    const selectedErrorJson = useSelector((state) => state?.selectedErrorJson);
+    console.log("selectedErrorJson: ", selectedErrorJson)
+
+
+
+    useEffect(() => {
+        if(!reduxSystemNo){
+            setShowSystemNoContainer(true)
+        }else{
+            if(evErrorsList.length > 0){
+                setAnomalyData(evErrorsList)
+            }else{
+                fetchAnomalyData();
+            }
+        }
+        
+    }, [reduxSystemNo]);
+
+    useEffect(() => {
+        if(!reduxSystemNo){
+            setShowSystemNoContainer(true)
+        }else{
+            if( evErrorsData.length>0){
+                setEvErrors(evErrorsData)
+            }
+            if (error && errorReason) {
+                fetchAnomalyRecords(reduxSystemNo);
+            }
+        }
+        
+    }, [error, errorReason]);
+
+    useEffect(() => {
+        if (evErrors && evErrors.length > 0) {
+            console.log("len = ", evErrors.length)
+            const tp = Math.ceil(evErrors.length / 10);
+            console.log("tp = ", tp)
+            setTotalPages(tp);
+        }
+    }, [evErrors]);
+
+    const updateSystemReservationStatus = async (systemRecords) => {
+        const payload = {
+          systemRecords,
+          sysNo:reduxSystemNo
+        };
+        try {
+          fetch(
+            `${
+              import.meta.env.VITE_REACT_APP_BACKEND_URL
+            }/updateSystemReservationStatusPartC`,
+            {
+              method: "POST",
+              headers: {
+                "Content-Type": "application/json",
+              },
+              body: JSON.stringify(payload),
+            }
+          )
+            .then((response) => response.json())
+            .then((responseData) => {
+              console.log("response from updation : ", responseData);
+            });
+        } catch (error) {
+          throw new Error("Error in update system records : ", systemRecords);
+        }
+      };
+
+    const fetchAnomalyData = async () => {
+        setIsLoading(true);
+        try {
+            const response = await fetch(
+                `${import.meta.env.VITE_REACT_APP_BACKEND_URL}/getpartcEv`,
+                {
+                    method: "GET",
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                }
+            );
+            const responseData = await response.json();
+            setAnomalyData(responseData.data);
+            dispatch(updatePartCErrorList(responseData.data))
+
+        } catch (error) {
+            console.error("Error fetching data: ", error);
+        } finally {
+            setIsLoading(false);
+        }
+    };
+
+    const fetchAnomalyRecords = async (reduxSystemNo) => {
+        setIsLoading(true);
+        try {
+            const response = await fetch(
+                `${import.meta.env.VITE_REACT_APP_BACKEND_URL}/getpartcEvErrors`,
+                {
+                    method: "POST",
+                    body: JSON.stringify({
+                        error,
+                        error_reason: errorReason,
+                        sysno: reduxSystemNo
+                    }),
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                }
+            );
+            const responseData = await response.json();
+            var systemRecords = responseData?.data
+            console.log("System record ====== ",responseData.systemRecord)
+            if(!responseData.systemRecord){
+                systemRecords = getRecordsBySystemId(
+                 responseData?.data,
+                 reduxSystemNo
+               );
+             }
+            updateSystemReservationStatus(systemRecords);
+            console.log("System records : ", systemRecords);
+
+            setEvErrors(systemRecords);
+            dispatch(updatePartCErrorData(systemRecords))
+        } catch (error) {
+            console.error("Error fetching data: ", error);
+        } finally {
+            setIsLoading(false);
+        }
+    };
+
+    function getRecordsBySystemId(records, systemId) {
+        const new_data = [];
+        for (var i = 0; i < records.length; i++) {
+          var count = i % 5;
+          if (count === systemId - 1) {
+            new_data.push(records[i]);
+          }
+        }
+        return new_data;
+      }
+
+    const handleClick = (error, errorReason, index) => {
+        setError(error);
+        setErrorReason(errorReason);
+        setCurrentPage(1);
+        setSelectedIndex(index);
+        let tmp = {}
+        tmp["error"] = error
+        tmp["error_reason"] = errorReason
+        console.log("tmp = ", tmp)
+        dispatch(updateSelectedJson(tmp))
+    };
+
+    const handlePageChange = (page) => {
+        setIsLoading2(true);
+        setCurrentPage(page);
+    };
+
+    useEffect(() => {
+        if (currentPage > 0) {
+            setIsLoading2(false);
+        }
+    }, [currentPage, evErrors]);
+
+    const getCurrentPageData = () => {
+        const startIndex = (currentPage - 1) * 10;
+        const endIndex = startIndex + 10;
+        return evErrors.slice(startIndex, endIndex);
+    };
+
+    const handleSystemNoChange = () => {
+        console.log("System No Change is called");
+        setShowSystemNoContainer(true);
+        dispatch(updateSelectedJson({}))
+        // dispatch(updatePartCErrorList([]))
+        dispatch(updatePartCErrorData([]))
+
+      };
+
+    return (
+        <Layout style={{ minHeight: "100vh" }}>
+            <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">
+                            {reduxSystemNo && (
+                            <Box
+                                className="h6 p-0 m-0 text-light bg-primary rounded h-100 d-flex align-items-center px-3"
+                                style={{ cursor: "pointer" }}
+                                onClick={handleSystemNoChange}
+                            >
+                                <b>System No : </b> {reduxSystemNo}
+                            </Box>
+                            )}
+                            <Button
+                                className="bg-primary p-1 text-light"
+                                onClick={() => navigate("/")}
+                            >
+                                <HomeIcon />
+                            </Button>
+                        </Box>
+                    </Box>
+                </Header>
+                <Content style={{ padding: '24px', backgroundColor: "#5078f2", backgroundImage: "linear-gradient(315deg, #5078f2 0%, #efe9f4 74%)" }}>
+                    {isLoading ? (
+                        <Box display="flex" justifyContent="center" alignItems="center" height="100%">
+                            <CircularProgress />
+                        </Box>
+                    ) : (
+                        <>
+                            {anomalyData && anomalyData.map((item, index) => (
+                                <Card
+                                    onClick={() => handleClick(item.error, item.error_reason, index)}
+                                    key={index}
+                                    style={{ margin: '16px', borderRadius: borderRadiusLG, 
+                                    alignItems: 'flex-start', textAlign: 'start', cursor: 'pointer',
+                                    color:"white",
+                                    backgroundColor: selectedIndex === index ? '#3f51b5' : '#537895',
+                                    backgroundImage: selectedIndex === index ? 
+                                        'linear-gradient(315deg, #70a1ff 0%, #c2c0c0 74%);' : 
+                                        'linear-gradient(315deg, #537895 0%, #09203f 74%)'
+                                     }}
+                                >
+                                    <CardContent>
+                                        {item.error && (
+                                            <Typography id="1" variant="body2">
+                                                Code: {item.error}
+                                            </Typography>
+                                        )}
+                                        {item['count(*)'] && (
+                                            <Typography id="2" variant="body2" color="whitesmoke">
+                                                Count: {item['count(*)']}
+                                            </Typography>
+                                        )}
+                                        {item.error_reason && (
+                                            <Typography id="3" variant="body2" color="whitesmoke">
+                                                Reason: {item.error_reason}
+                                            </Typography>
+                                        )}
+                                    </CardContent>
+                                </Card>
+                            ))}
+                            {evErrors && evErrors.length > 0  &&(
+                                <>
+                                    <Box display="flex" justifyContent="center" marginBottom="16px">
+                                        <Pagination
+                                            current={currentPage}
+                                            total={totalPages * 10}
+                                            onChange={handlePageChange}
+                                        />
+                                    </Box>
+                                    {isLoading2 ? (
+                                        <Box display="flex" justifyContent="center" alignItems="center" height="100%">
+                                            <CircularProgress />
+                                        </Box>
+                                    ) : (
+                                        getCurrentPageData().map((data, index) => (
+                                            <QueryExecutorCard
+                                                key={index}
+                                                data={data}
+                                                s3_image_column="s3_path"
+                                                query="ocr_scanned_part_c_v1"
+                                            />
+                                        ))
+                                    )}
+                                </>
+                            )}
+                        </>
+                    )}
+                </Content>
+                {showSystemNoContainer && (
+                    <SystemNumberDialog
+                    setShowSystemNoContainer={setShowSystemNoContainer}
+                    showSystemNoContainer={showSystemNoContainer}
+                    />
+                )}
+            </Layout>
+        </Layout>
+    );
+}
+
+export default AnomalyPartC;

src/Components/Home.jsx

@@ -20,6 +20,10 @@ const Home = () => {
       title: "Part A OCR Anomoly - Old Dummy",
       url: "/anomoly/partA?type=old",
     },
+    {
+      title: "Part C",
+      url: "/anomoly/partC",
+    },
     // {
     //   title:"Verification",
     //   url:"/verification"

src/Components/QueryExecutorCard.jsx

@@ -51,7 +51,7 @@ const QueryExecutorCard = ({ data, s3_image_column, query }) => {
       const responseData = await response.json();
       if (responseData.status === "success") {
         const updatedData = { ...dataValue, is_cover: 1 };
-        console.log("Data ===== ", updatedData);
+        // console.log("Data ===== ", updatedData);
         setDataValue(updatedData);
         console.log("Updation successfull ....");
         toast.success("Record Marked As Ev !...");
@@ -63,6 +63,38 @@ const QueryExecutorCard = ({ data, s3_image_column, query }) => {
     }
   };
 
+  const mark_as_dummy = async () => {
+    const payload = {
+      data,
+    };
+    try {
+      setIsLoading(true);
+      const response = await fetch(
+        `${import.meta.env.VITE_REACT_APP_BACKEND_URL}/partcDummyMarking`,
+        {
+          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, type: 102 };
+        // console.log("Data ===== ", updatedData);
+        setDataValue(updatedData);
+        toast.success("Record Marked as Dummy ! ....");
+      } else {
+        throw new Error(responseData?.message);
+      }
+    } catch (error) {
+      throw new Error(error);
+    }
+  }
+
   const mark_as_backpage = async () => {
     const payload = {
       data,
@@ -84,7 +116,7 @@ const QueryExecutorCard = ({ data, s3_image_column, query }) => {
       if (responseData.status === "success") {
         console.log("Updation successfull ....");
         const updatedData = { ...dataValue, is_backpage: 1 };
-        console.log("Data ===== ", updatedData);
+        // console.log("Data ===== ", updatedData);
         setDataValue(updatedData);
         toast.success("Record Marked as Backpage ! ....");
       } else {
@@ -160,6 +192,14 @@ const QueryExecutorCard = ({ data, s3_image_column, query }) => {
                   >
                     Mark As EV
                   </Button>
+                  <Button
+                    className="w-50 m-0 bg-primary text-white p-1 rounded"
+                    onClick={() => {
+                      mark_as_dummy();
+                    }}
+                  >
+                    Mark As Dummy
+                  </Button>
                 </>
               )}
             <Button className="bg-primary">

src/redux/actions/actions.jsx

@@ -32,3 +32,28 @@ export const updatePlaygroundResults = (data) => ({
   type: "UPDATE_PLAYGROUND_RESULTS",
   payload: data,
 });
+
+export const updatePartCErrorList = (data) => ({
+  type: "UPDATE_PARTC_ERROR_LIST",
+  payload: data,
+});
+
+export const updatePartCErrorData = (data) => ({
+  type: "UPDATE_PARTC_ERROR_DATA",
+  payload: data,
+});
+
+export const updateSelectedError = (data) => ({
+  type: "UPDATE_SELECTED_ERROR",
+  payload: data,
+});
+
+export const updateSelectedErrorData = (data) => ({
+  type: "UPDATE_SELECTED_ERROR_DATA",
+  payload: data,
+});
+
+export const updateSelectedJson = (data) => ({
+  type: "UPDATE_SELECTED_ERROR_JSON",
+  payload: data,
+})

src/redux/reducers/Reducer.jsx

@@ -6,7 +6,13 @@ const initialState = {
     playGroundQuery : null,
     playGroundResults : [],
     playGroundtotalPages : 0,
-    playGroundCurrentPage : 0
+    playGroundCurrentPage : 0,
+    partCAnomolyList: [],
+    partCErrorList: [],
+    partCErrorData: [],
+    selectedError: null,
+    selectedErrorData: [],
+    selectedErrorJson: {},
   };
   
   const reducer = (state = initialState, action) => {
@@ -25,6 +31,16 @@ const initialState = {
         return { ...state,playGroundtotalPages:action?.payload}
       case 'UPDATE_PLAYGROUND_TOTAL_PAGES':
         return { ...state,playGroundCurrentPage:action?.payload}
+      case 'UPDATE_PARTC_ERROR_LIST':
+        return { ...state,partCErrorList:action?.payload}
+      case 'UPDATE_PARTC_ERROR_DATA':
+        return { ...state, partCErrorData:action?.payload}
+      case 'UPDATE_SELECTED_ERROR':
+        return { ...state, selectedError:action?.payload}
+      case 'UPDATE_SELECTED_ERROR_DATA':
+        return { ...state, selectedErrorData:action?.payload}
+      case 'UPDATE_SELECTED_ERROR_JSON':
+        return { ...state, selectedErrorJson:action?.payload}
       default:
         return state;
     }