diff --git a/project/frontend/src/components/PitchBooksTable.tsx b/project/frontend/src/components/PitchBooksTable.tsx index 1398a18..bd7e5e7 100644 --- a/project/frontend/src/components/PitchBooksTable.tsx +++ b/project/frontend/src/components/PitchBooksTable.tsx @@ -21,6 +21,7 @@ import { useCallback, useEffect, useState } from "react"; import { socket } from "../socket"; import { fetchPitchBooksById } from "../util/api"; import { pitchBooksQueryOptions } from "../util/query"; +import { formatDate } from "../util/date" interface PitchBook { id: number; @@ -46,6 +47,7 @@ export function PitchBooksTable() { id: number; progress: number; filename?: string; + created_at?: string; buffer: number; intervalId?: number; }[] @@ -76,7 +78,6 @@ export function PitchBooksTable() { const intervalId = prev.find( (item) => item.id === progress.id, )?.intervalId; - console.log(intervalId, prev); intervalId && clearInterval(intervalId); return [...prev.filter((item) => item.id !== progress.id)]; @@ -102,6 +103,7 @@ export function PitchBooksTable() { filename: oldItem?.filename, buffer: oldItem ? oldItem.buffer + 0.5 : 0, intervalId: oldItem.intervalId, + created_at: oldItem?.created_at, }, ]; }); @@ -117,6 +119,7 @@ export function PitchBooksTable() { filename: res.filename, buffer: 0, intervalId, + created_at: res.created_at, }, ]); }) @@ -130,6 +133,7 @@ export function PitchBooksTable() { id: progress.id, progress: progress.progress, filename: oldItem?.filename, + created_at: oldItem?.created_at, buffer: 0, intervalId, }, @@ -211,6 +215,7 @@ export function PitchBooksTable() { Fondsname Fondsmanager + Hochgeladen am Dateiname Status @@ -218,6 +223,71 @@ export function PitchBooksTable() { + {loadingPitchBooks + .sort((a, b) => a.id - b.id) + .map((pitchBook) => ( + + + + + + + + + + + + {pitchBook.created_at && formatDate(pitchBook.created_at)} + + + + + {pitchBook.filename} + + + + } + label="In Bearbeitung" + size="small" + sx={{ + backgroundColor: "#fff3e0", + color: "#e65100", + "& .MuiChip-icon": { + color: "#e65100", + }, + }} + /> + + + ))} {pitchBooks .filter( (pitchbook: PitchBook) => @@ -225,8 +295,8 @@ export function PitchBooksTable() { ) .sort( (a: PitchBook, b: PitchBook) => - new Date(a.created_at).getTime() - - new Date(b.created_at).getTime(), + new Date(b.created_at).getTime() - + new Date(a.created_at).getTime(), ) .map((pitchBook: PitchBook) => { const status = getStatus(pitchBook); @@ -276,6 +346,7 @@ export function PitchBooksTable() { {manager} + {formatDate(pitchBook.created_at)} ); })} - {loadingPitchBooks - .sort((a, b) => a.id - b.id) - .map((pitchBook) => ( - - - - - - - - - - - {" "} - - {pitchBook.filename} - - - - } - label="In Bearbeitung" - size="small" - sx={{ - backgroundColor: "#fff3e0", - color: "#e65100", - "& .MuiChip-icon": { - color: "#e65100", - }, - }} - /> - - - ))} {pitchBooks.length === 0 && ( diff --git a/project/frontend/src/util/date.ts b/project/frontend/src/util/date.ts new file mode 100644 index 0000000..13dbfa8 --- /dev/null +++ b/project/frontend/src/util/date.ts @@ -0,0 +1,11 @@ +export const formatDate = (dateString: string): string => { + const date = new Date(dateString); + + const hours = String(date.getHours()).padStart(2, '0'); + const minutes = String(date.getMinutes()).padStart(2, '0'); + const month = String(date.getMonth() + 1).padStart(2, '0'); // Months are zero-based + const day = String(date.getDate()).padStart(2, '0'); + const year = date.getFullYear(); + + return `${hours}:${minutes} ${day}.${month}.${year}`; +};