part c v1
This commit is contained in:
parent
07e3b607f4
commit
ab72d324e1
|
|
@ -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>
|
||||
</>
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
@ -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"
|
||||
|
|
|
|||
|
|
@ -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">
|
||||
|
|
|
|||
|
|
@ -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,
|
||||
})
|
||||
|
|
@ -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;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue