-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
fbf44c3
commit 348a2fd
Showing
66 changed files
with
2,961 additions
and
1,342 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
import type { Metadata } from "next"; | ||
import { Inter } from "next/font/google"; | ||
|
||
const inter = Inter({ subsets: ["latin"] }); | ||
|
||
export const metadata: Metadata = { | ||
title: "Tutor:innen Anmeldung", | ||
description: "Anmeldung für Tutor:innen des Vorkurs", | ||
}; | ||
|
||
export default function RootLayout({ | ||
children, | ||
}: Readonly<{ | ||
children: React.ReactNode; | ||
}>) { | ||
return ( | ||
<html lang="en"> | ||
<body className={inter.className}>{children}</body> | ||
</html> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
|
||
export const metadata = { | ||
title: "Anmeldungen", | ||
} | ||
|
||
export default function OverviewPage() { | ||
return ( | ||
<p>Anmeldungen</p> | ||
) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,112 @@ | ||
import { DataTableColumnHeader } from "@/components/data-table-column-header"; | ||
import { Badge } from "@/components/ui/badge"; | ||
import { Button } from "@/components/ui/button"; | ||
import { Checkbox } from "@/components/ui/checkbox"; | ||
import { | ||
DropdownMenu, | ||
DropdownMenuContent, | ||
DropdownMenuItem, | ||
DropdownMenuLabel, | ||
DropdownMenuTrigger, | ||
} from "@/components/ui/dropdown-menu"; | ||
import { Event } from "@/lib/gql/generated/graphql"; | ||
import { formatDateToDDMM, formatDateToHHMM } from "@/lib/utils"; | ||
import { ColumnDef } from "@tanstack/react-table"; | ||
import { MoreHorizontal } from "lucide-react"; | ||
|
||
export const columns: ColumnDef<Event>[] = [ | ||
{ | ||
id: "select", | ||
header: ({ table }) => ( | ||
<Checkbox | ||
checked={ | ||
table.getIsAllPageRowsSelected() || | ||
(table.getIsSomePageRowsSelected() && "indeterminate") | ||
} | ||
onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)} | ||
aria-label="Alle auswählen" | ||
/> | ||
), | ||
cell: ({ row }) => ( | ||
<Checkbox | ||
checked={row.getIsSelected()} | ||
onCheckedChange={(value) => row.toggleSelected(!!value)} | ||
aria-label="Reihe auswählen" | ||
/> | ||
), | ||
}, | ||
{ | ||
accessorKey: "title", | ||
header: ({ column }) => ( | ||
<DataTableColumnHeader column={column} title="Titel" /> | ||
), | ||
}, | ||
{ | ||
accessorKey: "date", | ||
header: ({ column }) => ( | ||
<DataTableColumnHeader column={column} title="Datum" /> | ||
), | ||
cell: ({ row }) => { | ||
return formatDateToDDMM(new Date(row.original.from)); | ||
}, | ||
}, | ||
{ | ||
accessorKey: "from", | ||
header: ({ column }) => ( | ||
<DataTableColumnHeader column={column} title="Von" /> | ||
), | ||
cell: ({ row }) => { | ||
return formatDateToHHMM(new Date(row.original.from)); | ||
}, | ||
}, | ||
{ | ||
accessorKey: "to", | ||
header: ({ column }) => ( | ||
<DataTableColumnHeader column={column} title="Bis" /> | ||
), | ||
cell: ({ row }) => { | ||
return formatDateToHHMM(new Date(row.original.to)); | ||
}, | ||
}, | ||
{ | ||
accessorKey: "type", | ||
header: "Art", | ||
cell: ({ row }) => ( | ||
<Badge variant="event" color={row.original.type.color}> | ||
{row.original.type.name} | ||
</Badge> | ||
), | ||
}, | ||
{ | ||
accessorKey: "topic", | ||
header: "Thema", | ||
cell: ({ row }) => ( | ||
<Badge variant="event" color={row.original.topic.color}> | ||
{row.original.topic.name} | ||
</Badge> | ||
), | ||
}, | ||
{ | ||
id: "actions", | ||
enableHiding: false, | ||
cell: ({ row }) => { | ||
const event = row.original; | ||
|
||
return ( | ||
<DropdownMenu> | ||
<DropdownMenuTrigger asChild> | ||
<Button variant="ghost" className="h-8 w-8 p-0"> | ||
<span className="sr-only">Menü öffnen</span> | ||
<MoreHorizontal className="h-4 w-4" /> | ||
</Button> | ||
</DropdownMenuTrigger> | ||
<DropdownMenuContent align="end"> | ||
<DropdownMenuLabel>Optionen</DropdownMenuLabel> | ||
<DropdownMenuItem>Bearbeiten</DropdownMenuItem> | ||
<DropdownMenuItem>Löschen</DropdownMenuItem> | ||
</DropdownMenuContent> | ||
</DropdownMenu> | ||
); | ||
}, | ||
}, | ||
]; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,139 @@ | ||
"use client"; | ||
|
||
import { | ||
ColumnDef, | ||
ColumnFiltersState, | ||
SortingState, | ||
VisibilityState, | ||
flexRender, | ||
getCoreRowModel, | ||
getFilteredRowModel, | ||
getSortedRowModel, | ||
useReactTable, | ||
} from "@tanstack/react-table"; | ||
|
||
import { | ||
Table, | ||
TableBody, | ||
TableCell, | ||
TableHead, | ||
TableHeader, | ||
TableRow, | ||
} from "@/components/ui/table"; | ||
import React from "react"; | ||
import { Button } from "@/components/ui/button"; | ||
import { Input } from "@/components/ui/input"; | ||
import { | ||
DropdownMenu, | ||
DropdownMenuCheckboxItem, | ||
DropdownMenuContent, | ||
DropdownMenuTrigger, | ||
} from "@/components/ui/dropdown-menu"; | ||
import {DataTablePagination} from "@/components/data-table-pagination"; | ||
import {DataTableViewOptions} from "@/components/data-table-view-options"; | ||
import {useUmbrella} from "@/components/providers"; | ||
|
||
interface DataTableProps<TData, TValue> { | ||
columns: ColumnDef<TData, TValue>[]; | ||
data: TData[]; | ||
} | ||
|
||
export function DataTable<TData, TValue>({ | ||
columns, | ||
data, | ||
}: DataTableProps<TData, TValue>) { | ||
const {setCloseupID} = useUmbrella() | ||
|
||
const [sorting, setSorting] = React.useState<SortingState>([]); | ||
const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>( | ||
[] | ||
); | ||
const [columnVisibility, setColumnVisibility] = | ||
React.useState<VisibilityState>({}); | ||
const [rowSelection, setRowSelection] = React.useState({}); | ||
|
||
const table = useReactTable({ | ||
data, | ||
columns, | ||
getCoreRowModel: getCoreRowModel(), | ||
onSortingChange: setSorting, | ||
getSortedRowModel: getSortedRowModel(), | ||
onColumnFiltersChange: setColumnFilters, | ||
getFilteredRowModel: getFilteredRowModel(), | ||
onColumnVisibilityChange: setColumnVisibility, | ||
onRowSelectionChange: setRowSelection, | ||
state: { | ||
sorting, | ||
columnFilters, | ||
columnVisibility, | ||
rowSelection, | ||
}, | ||
}); | ||
|
||
return ( | ||
<div className="space-y-4"> | ||
<div className="flex items-center"> | ||
<Input | ||
placeholder="Veranstaltungstitel filtern..." | ||
value={(table.getColumn("title")?.getFilterValue() as string) ?? ""} | ||
onChange={(event) => | ||
table.getColumn("title")?.setFilterValue(event.target.value) | ||
} | ||
className="max-w-sm" | ||
/> | ||
<DataTableViewOptions table={table} /> | ||
</div> | ||
<div className="rounded-md border overflow-hidden"> | ||
<Table> | ||
<TableHeader> | ||
{table.getHeaderGroups().map((headerGroup) => ( | ||
<TableRow key={headerGroup.id}> | ||
{headerGroup.headers.map((header) => { | ||
return ( | ||
<TableHead key={header.id}> | ||
{header.isPlaceholder | ||
? null | ||
: flexRender( | ||
header.column.columnDef.header, | ||
header.getContext() | ||
)} | ||
</TableHead> | ||
); | ||
})} | ||
</TableRow> | ||
))} | ||
</TableHeader> | ||
<TableBody> | ||
{table.getRowModel().rows?.length ? ( | ||
table.getRowModel().rows.map((row) => ( | ||
<TableRow | ||
key={row.id} | ||
data-state={row.getIsSelected() && "selected"} | ||
> | ||
{row.getVisibleCells().map((cell) => ( | ||
<TableCell key={cell.id}> | ||
{flexRender( | ||
cell.column.columnDef.cell, | ||
cell.getContext() | ||
)} | ||
</TableCell> | ||
))} | ||
</TableRow> | ||
)) | ||
) : ( | ||
<TableRow> | ||
<TableCell | ||
colSpan={columns.length} | ||
className="h-24 text-center" | ||
> | ||
Keine Ergebnisse. | ||
</TableCell> | ||
</TableRow> | ||
)} | ||
</TableBody> | ||
</Table> | ||
</div> | ||
<DataTablePagination table={table} /> | ||
</div> | ||
); | ||
} |
Oops, something went wrong.