From c144db3f13eda08dbdc6526bb19cee4d1d3770dd Mon Sep 17 00:00:00 2001 From: s8613 Date: Tue, 17 Jun 2025 11:29:49 +0200 Subject: [PATCH 1/7] Updated KennzahlenTabel --- .../src/components/KennzahlenTable.tsx | 217 +++++++++++++++--- 1 file changed, 184 insertions(+), 33 deletions(-) diff --git a/project/frontend/src/components/KennzahlenTable.tsx b/project/frontend/src/components/KennzahlenTable.tsx index b6a19bb..5cfbad3 100644 --- a/project/frontend/src/components/KennzahlenTable.tsx +++ b/project/frontend/src/components/KennzahlenTable.tsx @@ -38,29 +38,47 @@ interface KennzahlenTableProps { } export default function KennzahlenTable({ - onPageClick, - data, - pdfId, - settings, - from -}: KennzahlenTableProps) { + onPageClick, + data, + pdfId, + settings, + from + }: KennzahlenTableProps) { const [editingIndex, setEditingIndex] = useState(""); const [editValue, setEditValue] = useState(""); + const [editingPageIndex, setEditingPageIndex] = useState(""); + const [editPageValue, setEditPageValue] = useState(""); + const [hoveredPageIndex, setHoveredPageIndex] = useState(""); const navigate = useNavigate(); const queryClient = useQueryClient(); const { mutate } = useMutation({ - mutationFn: (id: string) => { + mutationFn: (params: { id: string; newValue?: string; newPage?: number }) => { + const { id, newValue, newPage } = params; const key = id.toUpperCase(); const updatedData = { ...data }; - updatedData[key] = data[key]?.map((item) => ({ - ...item, - entity: editValue, - })) || [{ label: key, entity: editValue }]; + + if (data[key] && data[key].length > 0) { + updatedData[key] = data[key].map((item) => ({ + ...item, + ...(newValue !== undefined && { entity: newValue }), + ...(newPage !== undefined && { page: newPage }), + })); + } else { + updatedData[key] = [{ + label: key, + entity: newValue || "", + page: newPage || 0, + status: "single-source", + source: "manual" + }]; + } + return fetchPutKPI(Number(pdfId), updatedData); }, - onMutate: async (id: string) => { + onMutate: async (params: { id: string; newValue?: string; newPage?: number }) => { + const { id, newValue, newPage } = params; await queryClient.cancelQueries({ queryKey: ["pitchBookKPI", pdfId], }); @@ -71,10 +89,23 @@ export default function KennzahlenTable({ queryClient.setQueryData(["pitchBookKPI", pdfId], () => { const updatedData = { ...data }; - updatedData[key] = data[key]?.map((item) => ({ - ...item, - entity: editValue, - })) || [{ label: key, entity: editValue }]; + + if (data[key] && data[key].length > 0) { + updatedData[key] = data[key].map((item) => ({ + ...item, + ...(newValue !== undefined && { entity: newValue }), + ...(newPage !== undefined && { page: newPage }), + })); + } else { + updatedData[key] = [{ + label: key, + entity: newValue || "", + page: newPage || 0, + status: "single-source", + source: "manual" + }]; + } + return updatedData; }); @@ -99,19 +130,39 @@ export default function KennzahlenTable({ setEditValue(value); }; + const startPageEditing = (value: number, index: string) => { + setEditingPageIndex(index); + setEditPageValue(value.toString()); + }; + // Bearbeitung beenden und Wert speichern const handleSave = async (index: string) => { - // await updateKennzahl(rows[index].label, editValue); - mutate(index); + mutate({ id: index, newValue: editValue }); setEditingIndex(""); }; + const handlePageSave = async (index: string) => { + const pageNumber = parseInt(editPageValue); + if (!isNaN(pageNumber) && pageNumber > 0) { + mutate({ id: index, newPage: pageNumber }); + } + setEditingPageIndex(""); + }; + // Tastatureingaben verarbeiten const handleKeyPress = (e: KeyboardEvent, index: string) => { if (e.key === "Enter") { handleSave(index); } else if (e.key === "Escape") { - setEditingIndex("null"); + setEditingIndex(""); + } + }; + + const handlePageKeyPress = (e: KeyboardEvent, index: string) => { + if (e.key === "Enter") { + handlePageSave(index); + } else if (e.key === "Escape") { + setEditingPageIndex(""); } }; @@ -138,7 +189,9 @@ export default function KennzahlenTable({ Wert - Seite + + Seite + @@ -165,6 +218,10 @@ export default function KennzahlenTable({ borderColor = "#f6ed48"; } + const currentPage = row.extractedValues.at(0)?.page ?? 0; + const isPageHovered = hoveredPageIndex === row.setting.name; + const canEditPage = !hasMultipleValues; + return ( {row.setting.name} @@ -300,21 +357,115 @@ export default function KennzahlenTable({ )} - {(row.extractedValues.at(0)?.page ?? 0) > 0 ? ( - { - const extractedValue = row.extractedValues.at(0); - if (extractedValue?.page && extractedValue.page > 0) { - onPageClick?.(Number(extractedValue.page), extractedValue.entity || ""); + {editingPageIndex === row.setting.name ? ( + { + const value = e.target.value; + if (value === '' || /^\d+$/.test(value) && parseInt(value) > 0) { + setEditPageValue(value); } }} - sx={{ cursor: "pointer" }} - > - {row.extractedValues.at(0)?.page} - + onKeyDown={(e) => handlePageKeyPress(e, row.setting.name)} + onBlur={() => handlePageSave(row.setting.name)} + autoFocus + size="small" + variant="standard" + sx={{ + width: "60px", + "& .MuiInput-input": { + textAlign: "center" + } + }} + inputProps={{ + min: 0, + style: { textAlign: 'center' } + }} + /> ) : ( - "" + <> + {currentPage > 0 ? ( + canEditPage && setHoveredPageIndex(row.setting.name)} + onMouseLeave={() => setHoveredPageIndex("")} + onClick={() => { + if (canEditPage) { + startPageEditing(currentPage, row.setting.name); + } + }} + > + { + e.stopPropagation(); + const extractedValue = row.extractedValues.at(0); + if (extractedValue?.page && extractedValue.page > 0) { + onPageClick?.(Number(extractedValue.page), extractedValue.entity || ""); + } + }} + sx={{ cursor: "pointer" }} + > + {currentPage} + + + {isPageHovered && canEditPage && ( + + )} + + ) : canEditPage ? ( + setHoveredPageIndex(row.setting.name)} + onMouseLeave={() => setHoveredPageIndex("")} + onClick={() => startPageEditing(0, row.setting.name)} + > + ... + + + ) : ( + "" + )} + )} @@ -324,4 +475,4 @@ export default function KennzahlenTable({ ); -} +} \ No newline at end of file -- 2.43.0 From ac8cf2f7c2f0debaae9ea78083c5e1fdba564e08 Mon Sep 17 00:00:00 2001 From: s8613 Date: Tue, 17 Jun 2025 11:43:20 +0200 Subject: [PATCH 2/7] Updated extractedResult_.$pitchBook.$kpi.tsx for page number editing --- .../extractedResult_.$pitchBook.$kpi.tsx | 96 ++++++++++++++++++- 1 file changed, 93 insertions(+), 3 deletions(-) diff --git a/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx b/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx index 22ec938..a2cda4d 100644 --- a/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx +++ b/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx @@ -1,4 +1,5 @@ import ArrowBackIcon from "@mui/icons-material/ArrowBack"; +import EditIcon from "@mui/icons-material/Edit"; import { Box, Button, @@ -27,6 +28,7 @@ import { } from "@tanstack/react-query"; import { createFileRoute, useNavigate } from "@tanstack/react-router"; import { useEffect, useState } from "react"; +import type { KeyboardEvent } from "react"; import PDFViewer from "../components/pdfViewer"; import { fetchPutKPI } from "../util/api"; import { kpiQueryOptions } from "../util/query"; @@ -65,13 +67,23 @@ function ExtractedResultsPage() { const [showConfirmDialog, setShowConfirmDialog] = useState(false); const [hasChanges, setHasChanges] = useState(false); const [customValue, setCustomValue] = useState(""); + const [customPage, setCustomPage] = useState(""); + const [editingCustomPage, setEditingCustomPage] = useState(false); + const originalValue = kpiValues[0]?.entity || ""; + const originalPage = kpiValues[0]?.page || 0; const selectedValue = selectedIndex === -1 ? customValue : kpiValues[selectedIndex]?.entity || ""; + const selectedPage = + selectedIndex === -1 + ? (parseInt(customPage) > 0 ? parseInt(customPage) : 1) + : kpiValues[selectedIndex]?.page || 1; useEffect(() => { - setHasChanges(selectedValue !== originalValue); - }, [selectedValue, originalValue]); + const valueChanged = selectedValue !== originalValue; + const pageChanged = selectedPage !== originalPage; + setHasChanges(valueChanged || pageChanged); + }, [selectedValue, selectedPage, originalValue, originalPage]); const { mutate: updateKPI } = useMutation({ mutationFn: () => { @@ -83,7 +95,7 @@ function ExtractedResultsPage() { baseObject = { label: kpi.toUpperCase(), entity: selectedValue, - page: 0, + page: selectedPage, status: "single-source", source: "manual", }; @@ -92,6 +104,7 @@ function ExtractedResultsPage() { { ...baseObject, entity: selectedValue, + page: selectedPage, }, ]; return fetchPutKPI(Number(pitchBook), updatedData); @@ -120,6 +133,7 @@ function ExtractedResultsPage() { setSelectedIndex(index); setCurrentPage(kpiValues[index].page); setCustomValue(""); + setCustomPage(""); } }; @@ -131,10 +145,21 @@ function ExtractedResultsPage() { setSelectedIndex(-1); }; + const handleCustomPageChange = ( + event: React.ChangeEvent, + ) => { + const value = event.target.value; + // Allow empty string or positive numbers only (no 0) + if (value === '' || (/^\d+$/.test(value) && parseInt(value) > 0)) { + setCustomPage(value); + } + }; + const handleRowClick = (index: number) => { setCurrentPage(kpiValues[index].page); setSelectedIndex(index); setCustomValue(""); + setCustomPage(""); }; const handleBackClick = () => { @@ -166,6 +191,18 @@ function ExtractedResultsPage() { updateKPI(); }; + const startCustomPageEditing = () => { + setEditingCustomPage(true); + }; + + const handleCustomPageKeyPress = (e: KeyboardEvent) => { + if (e.key === "Enter") { + setEditingCustomPage(false); + } else if (e.key === "Escape") { + setEditingCustomPage(false); + } + }; + return ( @@ -318,6 +355,59 @@ function ExtractedResultsPage() { /> + + {editingCustomPage ? ( + setEditingCustomPage(false)} + autoFocus + size="small" + variant="standard" + sx={{ + width: "60px", + "& .MuiInput-input": { + textAlign: "center" + } + }} + inputProps={{ + min: 0, + style: { textAlign: 'center' } + }} + /> + ) : ( + { + e.stopPropagation(); + startCustomPageEditing(); + }} + > + {customPage || "..."} + { + e.stopPropagation(); + startCustomPageEditing(); + }} + /> + + )} + -- 2.43.0 From 615007b437060b6f9cf0a2ad794ea78d3a9b64f2 Mon Sep 17 00:00:00 2001 From: s8613 Date: Tue, 17 Jun 2025 11:45:30 +0200 Subject: [PATCH 3/7] Fixed change of tabs --- project/frontend/src/components/KennzahlenTable.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/project/frontend/src/components/KennzahlenTable.tsx b/project/frontend/src/components/KennzahlenTable.tsx index 5cfbad3..4e8f565 100644 --- a/project/frontend/src/components/KennzahlenTable.tsx +++ b/project/frontend/src/components/KennzahlenTable.tsx @@ -38,12 +38,12 @@ interface KennzahlenTableProps { } export default function KennzahlenTable({ - onPageClick, - data, - pdfId, - settings, - from - }: KennzahlenTableProps) { + onPageClick, + data, + pdfId, + settings, + from + }: KennzahlenTableProps) { const [editingIndex, setEditingIndex] = useState(""); const [editValue, setEditValue] = useState(""); const [editingPageIndex, setEditingPageIndex] = useState(""); -- 2.43.0 From 26224671bb5ec068cec8abf3aebaff10ed473aad Mon Sep 17 00:00:00 2001 From: s8613 Date: Tue, 17 Jun 2025 11:45:54 +0200 Subject: [PATCH 4/7] Fixed change of tabs --- project/frontend/src/components/KennzahlenTable.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/project/frontend/src/components/KennzahlenTable.tsx b/project/frontend/src/components/KennzahlenTable.tsx index 4e8f565..784c976 100644 --- a/project/frontend/src/components/KennzahlenTable.tsx +++ b/project/frontend/src/components/KennzahlenTable.tsx @@ -38,12 +38,12 @@ interface KennzahlenTableProps { } export default function KennzahlenTable({ - onPageClick, - data, - pdfId, - settings, - from - }: KennzahlenTableProps) { + onPageClick, + data, + pdfId, + settings, + from +}: KennzahlenTableProps) { const [editingIndex, setEditingIndex] = useState(""); const [editValue, setEditValue] = useState(""); const [editingPageIndex, setEditingPageIndex] = useState(""); -- 2.43.0 From 6816e1a2d753821ee16ffcc3dab996df61df2808 Mon Sep 17 00:00:00 2001 From: s8613 Date: Tue, 17 Jun 2025 12:12:33 +0200 Subject: [PATCH 5/7] fixed small styling issue --- .../frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx b/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx index a2cda4d..1802d34 100644 --- a/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx +++ b/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx @@ -384,7 +384,9 @@ function ExtractedResultsPage() { justifyContent: "center", gap: 1, cursor: "pointer", - minHeight: "24px" + minHeight: "24px", + minWidth: "100px", + margin: "0 auto", }} onClick={(e: React.MouseEvent) => { e.stopPropagation(); @@ -398,7 +400,6 @@ function ExtractedResultsPage() { color: "#666", opacity: 0.7, transition: "opacity 0.2s ease", - ml: 1 // margin-left instead of absolute positioning }} onClick={(e) => { e.stopPropagation(); -- 2.43.0 From eea2d015b28ad875e6c7ce7bd2d77bdee8522b64 Mon Sep 17 00:00:00 2001 From: s8613 Date: Tue, 17 Jun 2025 12:22:17 +0200 Subject: [PATCH 6/7] fixed small styling issue --- project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx b/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx index 1802d34..ca2fa6f 100644 --- a/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx +++ b/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx @@ -400,6 +400,7 @@ function ExtractedResultsPage() { color: "#666", opacity: 0.7, transition: "opacity 0.2s ease", + ml: 1 }} onClick={(e) => { e.stopPropagation(); -- 2.43.0 From f20516535042d6094d02629792634db46c82aa90 Mon Sep 17 00:00:00 2001 From: s8613 Date: Tue, 17 Jun 2025 13:05:13 +0200 Subject: [PATCH 7/7] Fixed table columns sizing always changing widths --- project/frontend/src/components/KennzahlenTable.tsx | 6 +++--- .../src/routes/extractedResult_.$pitchBook.$kpi.tsx | 4 ++-- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/project/frontend/src/components/KennzahlenTable.tsx b/project/frontend/src/components/KennzahlenTable.tsx index 784c976..9615208 100644 --- a/project/frontend/src/components/KennzahlenTable.tsx +++ b/project/frontend/src/components/KennzahlenTable.tsx @@ -182,13 +182,13 @@ export default function KennzahlenTable({ - + Kennzahl - + Wert - + Seite diff --git a/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx b/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx index ca2fa6f..1e98430 100644 --- a/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx +++ b/project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx @@ -240,10 +240,10 @@ function ExtractedResultsPage() {
- + Gefundene Werte - + Seite -- 2.43.0