enable bill storing

2026-03-04 23:17:12 +01:00 · 2020-10-05 00:09:05 +02:00
parent df6ec51af9
commit ec1b2e9629
7 changed files with 152 additions and 109 deletions
--- a/db/index.ts
+++ b/db/index.ts
@@ -1,6 +1,7 @@
 import * as mongoose from 'mongoose'
 import Booker from './booker'
 import Booking from './booking'
+import Bill, { BillDocument } from './bill'
 import { dateFormatFrontend } from '../helpers/date'
 import { BOOKING_STATUS } from './enums'

@@ -82,3 +83,15 @@ export async function createBooking({
  await booking.populate('booker').execPopulate()
  return booking.toJSON()
 }
+
+export async function createBill(bookingUUID: string, billData: BillDocument) {
+  await connect()
+  const bill = new Bill(billData)
+
+  const booking = await getBookingByUUID(bookingUUID)
+  bill.booking = booking._id
+
+  await bill.save()
+  await bill.populate('booking').execPopulate()
+  return bill.toJSON()
+}
--- a/pages/api/booking/[uuid]/bill.ts
+++ b/pages/api/booking/[uuid]/bill.ts
@@ -0,0 +1,33 @@
+import { NextApiRequest, NextApiResponse } from 'next'
+import { BillDocument } from '../../../../db/bill'
+import { createBill } from '../../../../db/index'
+
+export default async function userHandler(
+  req: NextApiRequest,
+  res: NextApiResponse
+) {
+  const {
+    method,
+    query: { uuid: uuids },
+  } = req
+
+  const bookingUUID = Array.isArray(uuids) ? uuids[0] : uuids
+
+  let bill: BillDocument
+
+  switch (method) {
+    case 'POST':
+      try {
+        bill = await createBill(bookingUUID, req.body)
+        res.status(200).json(bill)
+      } catch (e) {
+        console.error(e)
+        res.status(500).end(`Internal Server Error...Guru is meditating...`)
+        return
+      }
+      break
+    default:
+      res.setHeader('Allow', ['POST'])
+      res.status(405).end(`Method ${method} Not Allowed`)
+  }
+}
--- a/pages/api/booking/[uuid]/index.ts
+++ b/pages/api/booking/[uuid]/index.ts
@@ -1,7 +1,7 @@
 import { NextApiRequest, NextApiResponse } from 'next'
-import { BookingDocument } from '../../../db/booking'
-import { BOOKING_STATUS } from '../../../db/enums'
-import { getBookingByUUID } from '../../../db/index'
+import { BookingDocument } from '../../../../db/booking'
+import { BOOKING_STATUS } from '../../../../db/enums'
+import { getBookingByUUID } from '../../../../db/index'

 export default async function userHandler(
  req: NextApiRequest,
--- a/pages/api/booking/index.tsx
+++ b/pages/api/booking/index.tsx
--- a/pages/api/daysbooked.ics.tsx
+++ b/pages/api/daysbooked.ics.tsx
--- a/pages/api/daysbooked.tsx
+++ b/pages/api/daysbooked.tsx
--- a/pages/booking/[uuid]/bill.tsx
+++ b/pages/booking/[uuid]/bill.tsx
@@ -3,6 +3,7 @@ import React, { useEffect, useState } from 'react'
 import Footer from '../../../components/footer'
 import Header from '../../../components/header'
 import Input from '../../../components/wizard/input'
+import { BillDocument } from '../../../db/bill'
 import { BookingDocument } from '../../../db/booking'
 import { BOOKING_STATUS, MILAGE_RATES } from '../../../db/enums'
 import { getBookingByUUID } from '../../../db/index'
@@ -44,9 +45,9 @@ function getBookingStatus(booking: BookingDocument) {
  }
 }

-async function cancelBooking(booking: BookingDocument) {
-  const response = await fetch(`/api/booking/${booking.uuid}`, {
-    method: 'PATCH',
+async function saveBill(booking: BookingDocument, bill: BillDocument) {
+  const response = await fetch(`/api/booking/${booking.uuid}/bill/`, {
+    method: 'POST',
    mode: 'cors',
    cache: 'no-cache',
    credentials: 'same-origin',
@@ -54,7 +55,7 @@ async function cancelBooking(booking: BookingDocument) {
      'Content-Type': 'application/json',
    },
    referrerPolicy: 'no-referrer',
-    body: JSON.stringify({ status: BOOKING_STATUS.CANCELED }),
+    body: JSON.stringify(bill),
  })
  return response.json()
 }
@@ -69,122 +70,118 @@ export default function Bill({
  const [milageEnd, setMilageEnd] = useState(0)
  const [rate, setRate] = useState(MILAGE_RATES.EXTERN_UP_TO_200)
  const milage =
-    (0 < milageEnd &&
-      0 < milageStart &&
-      milageStart < milageEnd &&
-      milageEnd - milageStart) ||
-    0
-  const total = milage && rate && milage * rate
+    (0 < milageStart && milageStart < milageEnd && milageEnd - milageStart) || 0
+  const total = (milage && rate && milage * rate) || 0

  // in case the props change, update the internal state
  useEffect(() => setBooking(bookingProp), [bookingProp])

-  const onCancelBooking = async () => {
-    if (!confirm('Soll die Buchung wirklich storniert werden?')) {
-      return
-    }
-    try {
-      const updatedBooking = await cancelBooking(booking)
-      setBooking(updatedBooking)
-    } catch (e) {
-      alert(
-        'Die Buchung konnte nicht storniert werden. Kontaktieren Sie uns bitt per E-Mail!'
-      )
-    }
-  }
-
  return (
    <div className="mx-3 flex flex-col min-h-screen">
      <Header />
      <main className="flex-grow">
        <h2 className="text-3xl">Pfadi Bussle Buchung</h2>
-        <div>
-          <strong>Buchungsstatus:</strong> {getBookingStatus(booking)}
-        </div>
-        <div>
-          <strong>Buchungszeitraum:</strong>{' '}
-          {dateFormatFrontend(new Date(booking.startDate))} -{' '}
-          {dateFormatFrontend(new Date(booking.endDate))}
-        </div>
-        <div>
-          <strong>Bucher:</strong> {booking.booker.name}
-        </div>
-        <div>
-          <Input
-            label="Anfangskilometer"
-            name="milageStart"
-            required
-            value={milageStart}
-            type="number"
-            onChange={(e: React.ChangeEvent<React.ElementRef<'input'>>) =>
-              setMilageStart(Number(e.target.value))
-            }
-          />
-          <Input
-            label="Endkilometer"
-            name="milageEnd"
-            required
-            value={milageEnd}
-            type="number"
-            onChange={(e: React.ChangeEvent<React.ElementRef<'input'>>) =>
-              setMilageEnd(Number(e.target.value))
-            }
-          />
-          <Input label="Gefahren" name="milage" readOnly value={milage} />
-          <div className="fsw">
-            <div className="fs">
-              <label className="flabel">Rate</label>
-              <div className="relative">
-                <select
-                  className="block appearance-none w-full bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
-                  id="rate"
-                  onChange={(
-                    e: React.ChangeEvent<React.ElementRef<'select'>>
-                  ) => setRate(Number(e.target.value))}
-                >
-                  <option value={MILAGE_RATES.INTERN_UP_TO_200}>
-                    Intern bis 200 ({MILAGE_RATES.INTERN_UP_TO_200})
-                  </option>
-                  <option value={MILAGE_RATES.INTERN_200_1000}>
-                    Intern 200-1000 ({MILAGE_RATES.INTERN_200_1000})
-                  </option>
-                  <option value={MILAGE_RATES.INTERN_1001_2000}>
-                    Intern 1001-2000 ({MILAGE_RATES.INTERN_1001_2000})
-                  </option>
-                  <option value={MILAGE_RATES.INTERN_OVER_2000}>
-                    Intern ab 2001 ({MILAGE_RATES.INTERN_OVER_2000})
-                  </option>
-                  <option value={MILAGE_RATES.EXTERN_UP_TO_200}>
-                    Extern bis 200 ({MILAGE_RATES.EXTERN_UP_TO_200})
-                  </option>
-                  <option value={MILAGE_RATES.EXTERN_200_1000}>
-                    Extern 200-1000 ({MILAGE_RATES.EXTERN_200_1000})
-                  </option>
-                  <option value={MILAGE_RATES.EXTERN_1001_2000}>
-                    Extern 1001-2000 ({MILAGE_RATES.EXTERN_1001_2000})
-                  </option>
-                  <option value={MILAGE_RATES.EXTERN_OVER_2000}>
-                    Extern ab 2001 ({MILAGE_RATES.EXTERN_OVER_2000})
-                  </option>
-                </select>
-                <div className="pointer-events-none absolute inset-y-0 right-0 flex items-center px-2 text-gray-700">
-                  <svg
-                    className="fill-current h-4 w-4"
-                    xmlns="http://www.w3.org/2000/svg"
-                    viewBox="0 0 20 20"
+        <form
+          className="form"
+          onSubmit={(event) => {
+            event.preventDefault()
+            saveBill(booking, {
+              milageStart,
+              milageEnd,
+              milage,
+              total,
+              rate: MILAGE_RATES[rate],
+            })
+          }}
+        >
+          <div>
+            <strong>Buchungsstatus:</strong> {getBookingStatus(booking)}
+          </div>
+          <div>
+            <strong>Buchungszeitraum:</strong>{' '}
+            {dateFormatFrontend(new Date(booking.startDate))} -{' '}
+            {dateFormatFrontend(new Date(booking.endDate))}
+          </div>
+          <div>
+            <strong>Bucher:</strong> {booking.booker.name}
+          </div>
+          <div>
+            <Input
+              label="Anfangskilometer"
+              name="milageStart"
+              required
+              value={milageStart}
+              type="number"
+              onChange={(e: React.ChangeEvent<React.ElementRef<'input'>>) =>
+                setMilageStart(Number(e.target.value))
+              }
+            />
+            <Input
+              label="Endkilometer"
+              name="milageEnd"
+              required
+              value={milageEnd}
+              type="number"
+              onChange={(e: React.ChangeEvent<React.ElementRef<'input'>>) =>
+                setMilageEnd(Number(e.target.value))
+              }
+            />
+            <Input label="Gefahren" name="milage" readOnly value={milage} />
+            <div className="fsw">
+              <div className="fs">
+                <label className="flabel">Rate</label>
+                <div className="relative">
+                  <select
+                    className="block appearance-none w-full bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
+                    id="rate"
+                    onChange={(
+                      e: React.ChangeEvent<React.ElementRef<'select'>>
+                    ) => setRate(Number(e.target.value))}
                  >
-                    <path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z" />
-                  </svg>
+                    <option value={MILAGE_RATES.INTERN_UP_TO_200}>
+                      Intern bis 200 ({MILAGE_RATES.INTERN_UP_TO_200})
+                    </option>
+                    <option value={MILAGE_RATES.INTERN_200_1000}>
+                      Intern 200-1000 ({MILAGE_RATES.INTERN_200_1000})
+                    </option>
+                    <option value={MILAGE_RATES.INTERN_1001_2000}>
+                      Intern 1001-2000 ({MILAGE_RATES.INTERN_1001_2000})
+                    </option>
+                    <option value={MILAGE_RATES.INTERN_OVER_2000}>
+                      Intern ab 2001 ({MILAGE_RATES.INTERN_OVER_2000})
+                    </option>
+                    <option value={MILAGE_RATES.EXTERN_UP_TO_200}>
+                      Extern bis 200 ({MILAGE_RATES.EXTERN_UP_TO_200})
+                    </option>
+                    <option value={MILAGE_RATES.EXTERN_200_1000}>
+                      Extern 200-1000 ({MILAGE_RATES.EXTERN_200_1000})
+                    </option>
+                    <option value={MILAGE_RATES.EXTERN_1001_2000}>
+                      Extern 1001-2000 ({MILAGE_RATES.EXTERN_1001_2000})
+                    </option>
+                    <option value={MILAGE_RATES.EXTERN_OVER_2000}>
+                      Extern ab 2001 ({MILAGE_RATES.EXTERN_OVER_2000})
+                    </option>
+                  </select>
+                  <div className="pointer-events-none absolute inset-y-0 right-0 flex items-center px-2 text-gray-700">
+                    <svg
+                      className="fill-current h-4 w-4"
+                      xmlns="http://www.w3.org/2000/svg"
+                      viewBox="0 0 20 20"
+                    >
+                      <path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z" />
+                    </svg>
+                  </div>
                </div>
              </div>
            </div>
-          </div>

-          <Input label="Summe" name="milage" readOnly value={total} />
-        </div>
-        <button onClick={onCancelBooking} className="btn btn-blue">
-          Rechnung Erstellen
-        </button>
+            <Input label="Summe" name="milage" readOnly value={total} />
+          </div>
+          <button type="submit" className="btn btn-blue">
+            Rechnung Erstellen
+          </button>
+        </form>
      </main>

      <Footer />