diff --git a/FRONTEND/src/components/Modal/ModalLineHistory.tsx b/FRONTEND/src/components/Modal/ModalLineHistory.tsx index febf778..17c16fd 100644 --- a/FRONTEND/src/components/Modal/ModalLineHistory.tsx +++ b/FRONTEND/src/components/Modal/ModalLineHistory.tsx @@ -242,6 +242,7 @@ const ModalLineHistory = ({ }} testLogContent={selectedHistory?.output || ""} isShowShortLog={true} + portPhysical={selectedHistory?.portPhysical} /> ); diff --git a/FRONTEND/src/components/Modal/ModalLog.tsx b/FRONTEND/src/components/Modal/ModalLog.tsx index 0e23030..2f9eee5 100644 --- a/FRONTEND/src/components/Modal/ModalLog.tsx +++ b/FRONTEND/src/components/Modal/ModalLog.tsx @@ -12,18 +12,37 @@ const ModalLog = ({ onClose, testLogContent, isShowShortLog = false, + portPhysical, }: { opened: boolean; onClose: () => void; testLogContent: string; isShowShortLog?: boolean; + portPhysical?: { + name: string; + tested: boolean; + }[]; }) => { const [valueLog, setValueLog] = useState(testLogContent); const [isShort, setIsShort] = useState(false); + const [valueTestedPorts, setValueTestedPorts] = useState(""); useEffect(() => { setValueLog(testLogContent); }, [testLogContent]); + + useEffect(() => { + if(portPhysical && Array.isArray(portPhysical)) { + const portPoE = portPhysical.filter(port => !port.name.includes("SFP")) + const poeTested = portPhysical.filter(port => port.tested && !port.name.includes("SFP")) + const portSFP = portPhysical.filter(port => port.name.includes("SFP")) + const sfpTested = portPhysical.filter(port => port.tested && port.name.includes("SFP")) + const value = `POE Tested: ${poeTested.length}/${portPoE.length}\nSFP Tested: ${sfpTested.length}/${portSFP.length}`; + setValueTestedPorts(value); + setValueLog(testLogContent + "\n\n" + value); + } + }, [portPhysical]); + const addTooltipsToHighlights = () => { const highlights = document.querySelectorAll(".highlight"); highlights.forEach((highlight) => { @@ -99,7 +118,7 @@ const ModalLog = ({