pradeeppon2001
/
temp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

latest

This commit is contained in:
Pradeeppon01 2024-07-02 14:53:21 +05:30
parent 165c91d1d0
commit 2b0e3b11be
2 changed files with 380 additions and 308 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
.env
View File

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

210
src/Components/AnomolyPartC.jsx
View File

@ -1,13 +1,29 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from "react";
import { Box, Button, Card, CardContent, Typography, CircularProgress } from '@mui/material'; import {
import { Layout, theme, Pagination } from 'antd'; Box,
Button,
Card,
CardContent,
Typography,
CircularProgress,
} from "@mui/material";
import { Layout, theme, Pagination } from "antd";
import { useNavigate } from "react-router-dom"; import { useNavigate } from "react-router-dom";
import ArrowBackIcon from "@mui/icons-material/ArrowBack"; import ArrowBackIcon from "@mui/icons-material/ArrowBack";
import HomeIcon from "@mui/icons-material/Home"; import HomeIcon from "@mui/icons-material/Home";
import QueryExecutorCard from './QueryExecutorCard'; import QueryExecutorCard from "./QueryExecutorCard";
import { updatePartCErrorList, updatePartCErrorData, updateSelectedError, updateSelectedJson } from '../redux/actions/actions'; import {
import { useSelector, useDispatch } from 'react-redux'; updatePartCErrorList,
import SystemNumberDialog from './SystemNumberDialog'; updatePartCErrorData,
updateSelectedError,
updateSelectedJson,
} from "../redux/actions/actions";
import { useSelector, useDispatch } from "react-redux";
import SystemNumberDialog from "./SystemNumberDialog";
import InputLabel from "@mui/material/InputLabel";
import MenuItem from "@mui/material/MenuItem";
import FormControl from "@mui/material/FormControl";
import Select from "@mui/material/Select";
const { Content, Header } = Layout; const { Content, Header } = Layout;
@ -22,20 +38,29 @@ function AnomalyPartC() {
const [totalPages, setTotalPages] = useState(1); const [totalPages, setTotalPages] = useState(1);
const [showSystemNoContainer, setShowSystemNoContainer] = useState(false); const [showSystemNoContainer, setShowSystemNoContainer] = useState(false);
const [selectedIndex, setSelectedIndex] = useState(null); const [selectedIndex, setSelectedIndex] = useState(null);
const [selectedDegreeType, setSelectedDegreeType] = useState("0");
const degreeTypes = [
{ type: "UG", type_code: "0" },
{ type: "PG", type_code: "2" },
];
const handleDegreeTypeChange = (e) => {
console.log("Value ===== ", e.target.value);
setSelectedDegreeType(e.target.value);
};
const { const {
token: { colorBgContainer, borderRadiusLG }, token: { colorBgContainer, borderRadiusLG },
} = theme.useToken(); } = theme.useToken();
const navigate = useNavigate(); const navigate = useNavigate();
const dispatch = useDispatch(); const dispatch = useDispatch();
const evErrorsList = useSelector((state) => state?.partCErrorList); const evErrorsList = useSelector((state) => state?.partCErrorList);
console.log("evErrorsList = ", evErrorsList) console.log("evErrorsList = ", evErrorsList);
const evErrorsData = useSelector((state) => state?.partCErrorData); const evErrorsData = useSelector((state) => state?.partCErrorData);
console.log("evErrorData: ", evErrorsData) console.log("evErrorData: ", evErrorsData);
const reduxSystemNo = useSelector((state) => state?.systemNumber); const reduxSystemNo = useSelector((state) => state?.systemNumber);
console.log("systemno: ", reduxSystemNo) console.log("systemno: ", reduxSystemNo);
// const selectedError = useSelector((state) => state?.selectedError); // const selectedError = useSelector((state) => state?.selectedError);
// console.log("selectedError: ", selectedError) // console.log("selectedError: ", selectedError)
@ -44,50 +69,53 @@ function AnomalyPartC() {
// console.log("selectedErrorData: ", selectedErrorData) // console.log("selectedErrorData: ", selectedErrorData)
const selectedErrorJson = useSelector((state) => state?.selectedErrorJson); const selectedErrorJson = useSelector((state) => state?.selectedErrorJson);
console.log("selectedErrorJson: ", selectedErrorJson) console.log("selectedErrorJson: ", selectedErrorJson);
useEffect(() => { useEffect(() => {
if(!reduxSystemNo){ if (!reduxSystemNo) {
setShowSystemNoContainer(true) setShowSystemNoContainer(true);
}else{ } else {
if(evErrorsList.length > 0){ if (evErrorsList.length > 0) {
setAnomalyData(evErrorsList) setAnomalyData(evErrorsList);
}else{ } else {
fetchAnomalyData(); fetchAnomalyData();
} }
} }
}, [reduxSystemNo]); }, [reduxSystemNo]);
useEffect(() => { useEffect(() => {
if(!reduxSystemNo){ if (!reduxSystemNo) {
setShowSystemNoContainer(true) setShowSystemNoContainer(true);
}else{ } else {
if( evErrorsData.length>0){ if (evErrorsData.length > 0) {
setEvErrors(evErrorsData) setEvErrors(evErrorsData);
} }
if (error && errorReason) { if (error && errorReason) {
fetchAnomalyRecords(reduxSystemNo); fetchAnomalyRecords(reduxSystemNo);
} }
} }
}, [error, errorReason]); }, [error, errorReason]);
useEffect(() => { useEffect(() => {
if (evErrors && evErrors.length > 0) { if (evErrors && evErrors.length > 0) {
console.log("len = ", evErrors.length) console.log("len = ", evErrors.length);
const tp = Math.ceil(evErrors.length / 10); const tp = Math.ceil(evErrors.length / 10);
console.log("tp = ", tp) console.log("tp = ", tp);
setTotalPages(tp); setTotalPages(tp);
} }
}, [evErrors]); }, [evErrors]);
useEffect(() => {
dispatch(updatePartCErrorData([]));
setAnomalyData([]);
setEvErrors([]);
fetchAnomalyData();
}, [selectedDegreeType]);
const updateSystemReservationStatus = async (systemRecords) => { const updateSystemReservationStatus = async (systemRecords) => {
const payload = { const payload = {
systemRecords, systemRecords,
sysNo:reduxSystemNo sysNo: reduxSystemNo,
}; };
try { try {
fetch( fetch(
@ -115,7 +143,9 @@ function AnomalyPartC() {
setIsLoading(true); setIsLoading(true);
try { try {
const response = await fetch( const response = await fetch(
`${import.meta.env.VITE_REACT_APP_BACKEND_URL}/getpartcEv`, `${
import.meta.env.VITE_REACT_APP_BACKEND_URL
}/getpartcEv?degreeType=${selectedDegreeType}`,
{ {
method: "GET", method: "GET",
headers: { headers: {
@ -125,8 +155,7 @@ function AnomalyPartC() {
); );
const responseData = await response.json(); const responseData = await response.json();
setAnomalyData(responseData.data); setAnomalyData(responseData.data);
dispatch(updatePartCErrorList(responseData.data)) dispatch(updatePartCErrorList(responseData.data));
} catch (error) { } catch (error) {
console.error("Error fetching data: ", error); console.error("Error fetching data: ", error);
} finally { } finally {
@ -144,7 +173,8 @@ function AnomalyPartC() {
body: JSON.stringify({ body: JSON.stringify({
error, error,
error_reason: errorReason, error_reason: errorReason,
sysno: reduxSystemNo sysno: reduxSystemNo,
degreeType: selectedDegreeType,
}), }),
headers: { headers: {
"Content-Type": "application/json", "Content-Type": "application/json",
@ -152,23 +182,21 @@ function AnomalyPartC() {
} }
); );
const responseData = await response.json(); const responseData = await response.json();
var systemRecords = responseData?.data var systemRecords = responseData?.data;
console.log("System record ====== ",responseData.systemRecord) console.log("System record ====== ", responseData.systemRecord);
if(!responseData.systemRecord){ if (!responseData.systemRecord) {
systemRecords = getRecordsBySystemId( systemRecords = getRecordsBySystemId(responseData?.data, reduxSystemNo);
responseData?.data,
reduxSystemNo
);
} }
updateSystemReservationStatus(systemRecords);
console.log("System records : ", systemRecords); console.log("System records : ", systemRecords);
setEvErrors(systemRecords); setEvErrors(systemRecords);
dispatch(updatePartCErrorData(systemRecords))
} catch (error) {
console.error("Error fetching data: ", error);
} finally {
setIsLoading(false); setIsLoading(false);
dispatch(updatePartCErrorData(systemRecords));
updateSystemReservationStatus(systemRecords);
} catch (error) {
setIsLoading(false);
console.error("Error fetching data: ", error);
} }
}; };
@ -188,11 +216,11 @@ function AnomalyPartC() {
setErrorReason(errorReason); setErrorReason(errorReason);
setCurrentPage(1); setCurrentPage(1);
setSelectedIndex(index); setSelectedIndex(index);
let tmp = {} let tmp = {};
tmp["error"] = error tmp["error"] = error;
tmp["error_reason"] = errorReason tmp["error_reason"] = errorReason;
console.log("tmp = ", tmp) console.log("tmp = ", tmp);
dispatch(updateSelectedJson(tmp)) dispatch(updateSelectedJson(tmp));
}; };
const handlePageChange = (page) => { const handlePageChange = (page) => {
@ -215,10 +243,9 @@ function AnomalyPartC() {
const handleSystemNoChange = () => { const handleSystemNoChange = () => {
console.log("System No Change is called"); console.log("System No Change is called");
setShowSystemNoContainer(true); setShowSystemNoContainer(true);
dispatch(updateSelectedJson({})) dispatch(updateSelectedJson({}));
// dispatch(updatePartCErrorList([])) // dispatch(updatePartCErrorList([]))
dispatch(updatePartCErrorData([])) dispatch(updatePartCErrorData([]));
}; };
return ( return (
@ -251,24 +278,60 @@ function AnomalyPartC() {
</Box> </Box>
</Box> </Box>
</Header> </Header>
<Content style={{ padding: '24px', backgroundColor: "#5078f2", backgroundImage: "linear-gradient(315deg, #5078f2 0%, #efe9f4 74%)" }}> <Content
style={{
padding: "24px",
backgroundColor: "#5078f2",
backgroundImage: "linear-gradient(315deg, #5078f2 0%, #efe9f4 74%)",
}}
>
{isLoading ? ( {isLoading ? (
<Box display="flex" justifyContent="center" alignItems="center" height="100%"> <Box
display="flex"
justifyContent="center"
alignItems="center"
height="100%"
>
<CircularProgress /> <CircularProgress />
</Box> </Box>
) : ( ) : (
<> <>
{anomalyData && anomalyData.map((item, index) => ( <Box className="w-25 d-flex flex-column align-items-start">
<h6>Degree Type</h6>
<FormControl fullWidth>
<Select
className="bg-white"
value={selectedDegreeType}
onChange={handleDegreeTypeChange}
>
{degreeTypes.map((degree) => (
<MenuItem key={degree.type_code} value={degree.type_code}>
{degree.type}
</MenuItem>
))}
</Select>
</FormControl>
</Box>
{anomalyData &&
anomalyData.map((item, index) => (
<Card <Card
onClick={() => handleClick(item.error, item.error_reason, index)} onClick={() =>
handleClick(item.error, item.error_reason, index)
}
key={index} key={index}
style={{ margin: '16px', borderRadius: borderRadiusLG, style={{
alignItems: 'flex-start', textAlign: 'start', cursor: 'pointer', margin: "16px",
color:"white", borderRadius: borderRadiusLG,
backgroundColor: selectedIndex === index ? '#3f51b5' : '#537895', alignItems: "flex-start",
backgroundImage: selectedIndex === index ? textAlign: "start",
'linear-gradient(315deg, #70a1ff 0%, #c2c0c0 74%);' : cursor: "pointer",
'linear-gradient(315deg, #537895 0%, #09203f 74%)' 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> <CardContent>
@ -277,9 +340,9 @@ function AnomalyPartC() {
Code: {item.error} Code: {item.error}
</Typography> </Typography>
)} )}
{item['count(*)'] && ( {item["count(*)"] && (
<Typography id="2" variant="body2" color="whitesmoke"> <Typography id="2" variant="body2" color="whitesmoke">
Count: {item['count(*)']} Count: {item["count(*)"]}
</Typography> </Typography>
)} )}
{item.error_reason && ( {item.error_reason && (
@ -290,9 +353,13 @@ function AnomalyPartC() {
</CardContent> </CardContent>
</Card> </Card>
))} ))}
{evErrors && evErrors.length > 0 &&( {evErrors && evErrors.length > 0 && (
<> <>
<Box display="flex" justifyContent="center" marginBottom="16px"> <Box
display="flex"
justifyContent="center"
marginBottom="16px"
>
<Pagination <Pagination
current={currentPage} current={currentPage}
total={totalPages * 10} total={totalPages * 10}
@ -300,7 +367,12 @@ function AnomalyPartC() {
/> />
</Box> </Box>
{isLoading2 ? ( {isLoading2 ? (
<Box display="flex" justifyContent="center" alignItems="center" height="100%"> <Box
display="flex"
justifyContent="center"
alignItems="center"
height="100%"
>
<CircularProgress /> <CircularProgress />
</Box> </Box>
) : ( ) : (