monke magic

This commit is contained in:
Victor Turgeon 2022-11-08 06:31:10 -05:00
parent faa119b0ad
commit 17d7c1ebb5
4 changed files with 52 additions and 21 deletions

View File

@ -11,7 +11,8 @@ public class InvoiceModel {
Preparing, Preparing,
Shipping, Shipping,
Shipped, Shipped,
Returned Returned,
Pending
} }
public class ProductInvoice { public class ProductInvoice {
[Key] [Key]

View File

@ -16,6 +16,7 @@ import { useState, useEffect } from "react";
import React from 'react'; import React from 'react';
import Invoices from "../pages/Invoices"; import Invoices from "../pages/Invoices";
import Cookies from "universal-cookie"; import Cookies from "universal-cookie";
import ReviewInvoice from "../pages/ReviewInvoice";
const App = () => { const App = () => {
const cookies = new Cookies(); const cookies = new Cookies();
@ -51,6 +52,7 @@ const App = () => {
<Route path="formulaire" element={<Formulaire />} /> <Route path="formulaire" element={<Formulaire />} />
<Route path="myinvoices" element={<MyInvoices />} /> <Route path="myinvoices" element={<MyInvoices />} />
<Route path="invoices" element={<Invoices />} /> <Route path="invoices" element={<Invoices />} />
<Route path="reviewinvoice/:id" element={<ReviewInvoice />} />
</Route> </Route>
</Routes> </Routes>
</BrowserRouter> </BrowserRouter>

View File

@ -4,13 +4,13 @@ import { Button } from "react-bootstrap";
import { useForm } from "react-hook-form"; import { useForm } from "react-hook-form";
import Cookies from "universal-cookie"; import Cookies from "universal-cookie";
import { Form } from "react-bootstrap"; import { Form } from "react-bootstrap";
import { useNavigate } from "react-router-dom";
export default function App() { export default function App() {
const { register, handleSubmit, setValue, watch, formState: { errors } } = useForm(); const { register, handleSubmit, setValue, watch, formState: { errors } } = useForm();
const onSubmit = data => console.log(data);
const cookies = new Cookies(); const cookies = new Cookies();
const [userAddresses, setUserAddresses] = useState([]); const [userAddresses, setUserAddresses] = useState([]);
const navigate = useNavigate();
useEffect(() => { useEffect(() => {
@ -33,20 +33,15 @@ export default function App() {
if (response.ok) { if (response.ok) {
const json = await response.json(); const json = await response.json();
setUserAddresses(json); setUserAddresses(json);
// if (json.length >= 1) if (json.length >= 1)
// setFormAddress(json[0]); setFormAddress(json[0]);
} }
}); });
} }
}, []); }, []);
const setFormAddress = (addressId) => { const setFormAddress = (address) => {
const address = userAddresses.filter(a => a.id == addressId);
console.log(address);
setValue("civicNumber", address.civicNumber); setValue("civicNumber", address.civicNumber);
setValue("appartment", address.appartment); setValue("appartment", address.appartment);
setValue("street", address.street); setValue("street", address.street);
@ -56,6 +51,34 @@ export default function App() {
setValue("postalCode", address.postalCode); setValue("postalCode", address.postalCode);
} }
const onSubmit = async (data) => {
const cart = cookies.get('cart');
if (cart == null || cart.length < 1) {
console.log("Your cart is empty!!!");
}
else {
data.prodQuant ={};
cart.map((p) => {
data.prodQuant[p.id] = p.quantity;
});
console.log(data);
const jsonData = JSON.stringify(data);
fetch("https://localhost:7292/api/Invoice", {
mode: "cors",
method: "POST",
credentials: "include",
body: jsonData
}).then((response) => {
console.log(response);
});
}
}
return ( return (
<div className="form-container"> <div className="form-container">
<form onSubmit={handleSubmit(onSubmit)}> <form onSubmit={handleSubmit(onSubmit)}>
@ -66,41 +89,41 @@ export default function App() {
<input {...register("emailAddress", { required: true, pattern: /^[A-Za-z0-9+_.-]+@(.+)$/ })} /> <input {...register("emailAddress", { required: true, pattern: /^[A-Za-z0-9+_.-]+@(.+)$/ })} />
</div> </div>
<div> <div>
{errors.Email && errors.Email.type === 'required' && <span>Vous devez entrer une adresse courriel!</span>} {errors.emailAddress && errors.emailAddress.type === 'required' && <span>Vous devez entrer une adresse courriel!</span>}
{errors.Email && errors.Email.type === 'pattern' && <span>Adresse courriel non valide!</span>} {errors.emailAddress && errors.emailAddress.type === 'pattern' && <span>Adresse courriel non valide!</span>}
</div> </div>
<div className="form-group"> <div className="form-group">
<label>Prénom*: </label> <label>Prénom*: </label>
<input {...register("firstName", { required: true, minLength: 2 })} /> <input {...register("firstName", { required: true, minLength: 2 })} />
</div> </div>
<div> <div>
{errors.Prénom && errors.Prénom.type === 'required' && <span>Vous devez entrer votre prénom!</span>} {errors.firstName && errors.firstName.type === 'required' && <span>Vous devez entrer votre prénom!</span>}
{errors.Prénom && errors.Prénom.type === 'minLength' && <span>Votre prénom doit avoir au moins 2 lettres!</span>} {errors.firstName && errors.firstName.type === 'minLength' && <span>Votre prénom doit avoir au moins 2 lettres!</span>}
</div> </div>
<div className="form-group"> <div className="form-group">
<label>Nom*: </label> <label>Nom*: </label>
<input {...register("lastName", { required: true, minLength: 2 })} /> <input {...register("lastName", { required: true, minLength: 2 })} />
</div> </div>
<div> <div>
{errors.Nom && errors.Nom.type === 'required' && <span>Vous devez entrer votre nom!</span>} {errors.lastName && errors.lastName.type === 'required' && <span>Vous devez entrer votre nom!</span>}
{errors.Nom && errors.Nom.type === 'minLength' && <span>Votre nom doit avoir au moins 2 lettres!</span>} {errors.lastName && errors.lastName.type === 'minLength' && <span>Votre nom doit avoir au moins 2 lettres!</span>}
</div> </div>
<div className="form-group"> <div className="form-group">
<label>Numéro de téléphone*: </label> <label>Numéro de téléphone*: </label>
<input placeholder="Exemple: 111-111-1111" {...register("phoneNumber", { required: true, pattern: /^[0-9]{3}-[0-9]{3}-[0-9]{4}$/ })} /> <input placeholder="Exemple: 111-111-1111" {...register("phoneNumber", { required: true, pattern: /^[0-9]{3}-[0-9]{3}-[0-9]{4}$/ })} />
</div> </div>
<div> <div>
{errors.Téléphone && errors.Téléphone.type === 'required' && <span>Vous devez entrer un numéro de téléphone!</span>} {errors.phoneNumber && errors.phoneNumber.type === 'required' && <span>Vous devez entrer un numéro de téléphone!</span>}
{errors.Téléphone && errors.Téléphone.type === 'pattern' && <span>Téléphone non valide!</span>} {errors.phoneNumber && errors.phoneNumber.type === 'pattern' && <span>Téléphone non valide!</span>}
</div> </div>
<div className="formulaire-address"> <div className="formulaire-address">
<h5> <h5>
Adresse Adresse
<Form.Select onSelect={(e) => { setFormAddress(e.target.value); }}> {/* <Form.Select onSelect={(e) => { setFormAddress(e.target.value); }}>
{userAddresses.map((a) => ( {userAddresses.map((a) => (
<option key={a.id} value={a.id}>{a.civicNumber} {a.street}</option> <option key={a.id} value={a.id}>{a.civicNumber} {a.street}</option>
))} ))}
</Form.Select> </Form.Select> */}
</h5> </h5>
<div className="form-group"> <div className="form-group">
<label>Numéro civique*: </label> <label>Numéro civique*: </label>

View File

@ -0,0 +1,5 @@
const ReviewInvoice = () =>{
}
export default ReviewInvoice;