diff --git a/project/frontend/src/components/pdfViewer.tsx b/project/frontend/src/components/pdfViewer.tsx index 4d171a7..b41a433 100644 --- a/project/frontend/src/components/pdfViewer.tsx +++ b/project/frontend/src/components/pdfViewer.tsx @@ -4,6 +4,8 @@ import "react-pdf/dist/esm/Page/AnnotationLayer.css"; import "react-pdf/dist/esm/Page/TextLayer.css"; import ArrowCircleLeftIcon from "@mui/icons-material/ArrowCircleLeft"; import ArrowCircleRightIcon from "@mui/icons-material/ArrowCircleRight"; +import ZoomInIcon from "@mui/icons-material/ZoomIn"; +import ZoomOutIcon from "@mui/icons-material/ZoomOut"; import { Box, IconButton } from "@mui/material"; import type { CustomTextRenderer, @@ -30,7 +32,7 @@ export default function PDFViewer({ }: PDFViewerProps) { const [numPages, setNumPages] = useState(null); const [pageNumber, setPageNumber] = useState(currentPage || 1); - const [containerWidth, setContainerWidth] = useState(null); + const [baseWidth, setBaseWidth] = useState(null); const [pdfKey, setPdfKey] = useState(Date.now()); const containerRef = useRef(null); const [posHighlight, setPosHighlight] = useState([]); @@ -38,6 +40,7 @@ export default function PDFViewer({ const [textContent, setTextContent] = useState< { posKey: string; text: string; i: number }[] >([]); + const [zoomLevel, setZoomLevel] = useState(1.0); const onDocumentLoadSuccess = ({ numPages }: { numPages: number }) => { setNumPages(numPages); @@ -46,7 +49,9 @@ export default function PDFViewer({ useEffect(() => { const updateWidth = () => { if (containerRef.current) { - setContainerWidth(containerRef.current.offsetWidth); + if (!baseWidth) { + setBaseWidth(containerRef.current.offsetWidth); + } } }; @@ -112,8 +117,9 @@ export default function PDFViewer({ }); if (positions.length === 0) { - let cumulativeText = ''; - const textBoundaries: { start: number; end: number; index: number }[] = []; + let cumulativeText = ""; + const textBoundaries: { start: number; end: number; index: number }[] = + []; textContent.forEach((item, index) => { const start = cumulativeText.length; @@ -128,7 +134,7 @@ export default function PDFViewer({ while (searchIndex !== -1) { const endIndex = searchIndex + normalizedSearch.length; - textBoundaries.forEach(boundary => { + textBoundaries.forEach((boundary) => { if ( (boundary.start <= searchIndex && searchIndex < boundary.end) || // Search starts in this item (boundary.start < endIndex && endIndex <= boundary.end) || // Search ends in this item @@ -139,16 +145,19 @@ export default function PDFViewer({ } } }); - searchIndex = lowerCumulative.indexOf(normalizedSearch, searchIndex + 1); + searchIndex = lowerCumulative.indexOf( + normalizedSearch, + searchIndex + 1, + ); } } return positions.sort((a, b) => a - b); }; highlight - .filter(h => h.page === pageNumber) - .forEach(highlightItem => { + .filter((h) => h.page === pageNumber) + .forEach((highlightItem) => { const positions = findTextPositions(highlightItem.text); - positions.forEach(pos => { + positions.forEach((pos) => { if (pos >= 0 && pos < textContent.length) { tmpPos.push(textContent[pos].posKey); } @@ -158,7 +167,7 @@ export default function PDFViewer({ if (focusHighlight?.page === pageNumber && focusHighlight.text) { const positions = findTextPositions(focusHighlight.text); - positions.forEach(pos => { + positions.forEach((pos) => { if (pos >= 0 && pos < textContent.length) { tmpPosHighlight.push(textContent[pos].posKey); } @@ -186,16 +195,29 @@ export default function PDFViewer({ justifyContent="center" alignItems="center" width="100%" - height="auto" + maxWidth="850px" + margin="0 auto" + sx={{ + backgroundColor: "#f5f5f5", + borderRadius: 2, + boxShadow: 2, + }} > console.error("Ungültige PDF:", error)} > - {containerWidth && ( + {baseWidth && ( @@ -225,6 +247,13 @@ export default function PDFViewer({ gap={1} p={1} > + setZoomLevel((z) => Math.max(0.3, z - 0.1))} + title="Verkleinern" + > + + handlePageChange(pageNumber - 1)} @@ -240,6 +269,12 @@ export default function PDFViewer({ > + setZoomLevel((z) => Math.min(3, z + 0.1))} + title="Vergrößern" + > + + ); diff --git a/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx b/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx index 0194c09..1fbf5fd 100644 --- a/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx +++ b/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx @@ -256,8 +256,8 @@ function ExtractedResultsPage() { - - Überprüfung der Kennzahl: {kpi} + + Überprüfung der Kennzahl: {kpi}