tomru/pfadi-bussle
1
0
Fork 0
mirror of https://github.com/tomru/pfadi-bussle.git synced 2026-03-03 06:27:11 +01:00
Code Issues Packages Projects Releases Wiki Activity

add an admin overview page

Browse Source
This commit is contained in:
Thomas Ruoff
2020-11-23 23:49:13 +01:00
parent c7cd252506
commit 4db3eadaeb
2 changed files with 118 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
lib/getServerSideProps.ts
View File

@@ -1,4 +1,6 @@
import { getBookingByUUID } from '../db/index' import { startOfYear } from 'date-fns'
import { nowInTz } from '../helpers/date'
import { getBookingByUUID, getBookings } from '../db/index'
export interface ServerSideBooking { export interface ServerSideBooking {
props: { props: {
@@ -6,6 +8,30 @@ export interface ServerSideBooking {
} }
} }
export interface ServerSideRecentBooking {
props: {
bookings: object[]
}
}
export const getServerSideRecentBookings = async (): Promise<
ServerSideRecentBooking
> => {
const bookings = await getBookings({
startDateGreaterThan: startOfYear(nowInTz()).toISOString(),
})
// TODO: hack, not sure why _id is not serilizable
const bookingsJSON = JSON.parse(
JSON.stringify(bookings.map((b) => b.toJSON()))
) as object[]
return {
props: {
bookings: bookingsJSON,
},
}
}
export const getServerSideBooking = async ( export const getServerSideBooking = async (
context: any context: any
): Promise<ServerSideBooking> => { ): Promise<ServerSideBooking> => {

91
pages/admin/index.tsx Normal file
View File

@@ -0,0 +1,91 @@
import React from 'react'
import Head from 'next/head'
import Link from 'next/link'
import Footer from '../../components/footer'
import Header from '../../components/header'
import { daysFormatFrontend } from '../../helpers/date'
import withSession, { isAdminSession, redirectToLogin } from '../../lib/session'
import { getServerSideRecentBookings } from '../../lib/getServerSideProps'
export const getServerSideProps = withSession(async (context) => {
const { req, res } = context
const adminUser = isAdminSession(req)
if (!adminUser) {
redirectToLogin(req, res)
return { props: {} }
}
const serverSideRecentBookingProps = await getServerSideRecentBookings()
return {
props: {
...serverSideRecentBookingProps.props,
user: adminUser,
},
}
})
export default function AdminRecentBookings({ bookings }) {
return (
<>
<Head>
<title>Pfadi Bussle Admin</title>
<link rel="icon" href="/favicon.ico" />
</Head>
<Header label="Pfadi Bussle Buchungsliste" />
<main className="main py-3">
{bookings.map((booking: any) => (
<div
key={booking.uuid}
className="mb-6 bg-white shadow overflow-hidden sm:rounded-lg"
>
<div className="px-4 py-5 sm:px-6">
<h3 className="text-lg leading-6 font-medium text-gray-900">
<Link href={`/admin/booking/${booking.uuid}`}>
<a className="link">Booking {booking.uuid}</a>
</Link>
</h3>
<p className="mt-1 max-w-2xl text-sm text-gray-500">
Last updated {new Date(booking.updatedAt).toLocaleTimeString()}
</p>
</div>
<div className="border-t border-gray-200">
<dl>
<div className="bg-gray-100 px-2 py-3 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
<dt className="text-sm font-medium text-gray-500">
Buchungszeitraum
</dt>
<dd className="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
{daysFormatFrontend(booking.days)}
</dd>
</div>
<div className="bg-white px-2 py-3 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
<dt className="text-sm font-medium text-gray-500">Bucher</dt>
<dd className="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
{booking.booker.name}
</dd>
</div>
<div className="bg-gray-100 px-2 py-3 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
<dt className="text-sm font-medium text-gray-500">Email</dt>
<dd className="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
{booking.booker.email}
</dd>
</div>
<div className="bg-white px-2 py-3 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
<dt className="text-sm font-medium text-gray-500">Status</dt>
<dd className="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
{booking.status}
</dd>
</div>
</dl>
</div>
</div>
))}
</main>
<Footer />
</>
)
}