Added basic functionality to send the invoice data to server

3 files changed, 26 insertions, 2 deletions

diff --git a/src/components/Pages/BillingPage.tsx b/src/components/Pages/BillingPage.tsx
index 3949beb..301f39e 100644
--- a/src/components/Pages/BillingPage.tsx
+++ b/src/components/Pages/BillingPage.tsx
@@ -9,7 +9,7 @@
 import React, { useState, useEffect } from "react";
 import axios from "axios";
 
-import { Item, Person, Transport } from "../../interfaces";
+import { Item, Person, Transport, Invoice } from "../../interfaces";
 
 import AddNewItemForm from "./../Form/Items/AddNewItemForm";
 import RegisterItemForm from "./../Form/Items/RegisterItemForm";
@@ -57,6 +57,24 @@ const BillingPage: React.FC = () => {
   // update the items from AddNewItemForm
   const getItems = (item: Item) => setItems([...items, item]);
 
+  const postInvoice = () => {
+    const newInvoice: Invoice = {
+      Items: items,
+      Transport: transporter
+    }
+    window.print();
+
+    // just for testing it will not save to DB
+    axios.post("/api/invoice/preview", newInvoice)
+      .then((res) => {
+        alert("OH MY FUCKEN GOD")
+        console.log(res)
+      })
+      .catch((res) => {
+        console.log(res)
+      })
+  }
+
   return (
     <>
       {registerItemFormVisibility &&
@@ -106,6 +124,7 @@ const BillingPage: React.FC = () => {
         />
         <SummaryDisplay items={items}/>
       </div>
+      <button onClick={postInvoice}>post (experimental)</button>
     </>
   );
 }
diff --git a/src/interfaces.ts b/src/interfaces.ts
index 5e918b7..3500c2b 100644
--- a/src/interfaces.ts
+++ b/src/interfaces.ts
@@ -41,3 +41,9 @@ export interface Person {
   Phone?: string
   Email?: string
 }
+
+export interface Invoice {
+  //Client: Person
+  Items: Item[]
+  Transport: Transport
+}
diff --git a/src/styles/global.scss b/src/styles/global.scss
index a82e4ad..ef3d11d 100644
--- a/src/styles/global.scss
+++ b/src/styles/global.scss
@@ -93,7 +93,6 @@ body {
   max-width: 960px;
 }
 
-
 @media only screen and (max-device-width: 480px) {
   .floatingMenu {
     width: 95%;