Address post is broken

GrossesMitaines/GrossesMitainesAPI/Controllers/AddressController.cs

@@ -62,7 +62,7 @@ public class AddressController : Controller {
             id = _signInMan.Context.User.Identity.GetUserId();
             if (all is not null && all == true && roles.Contains("Administrateur"))
                 return Ok(_context.Addresses.ToList());
-            else return Ok(user.Adresses.ToList());
+            else return Ok(_context.Users.Where(x=>x.Id == id).Include("Adresses").First().Adresses);
         } catch (Exception e) {
             _logger.LogError(10, e.Message);
             return BadRequest();

GrossesMitaines/GrossesMitainesAPI/Data/InventoryContext.cs

@@ -386,6 +386,7 @@ Pikachu is also the starter Pokémon of Pokémon Rumble Blast and Pokémon Rumbl
             LastName = "Admin",
             NormalizedUserName = "ADMIN",
             UserName = "Admin",
+            PhoneNumber = "111-111-1111",
             Id = AdminID,
             NormalizedEmail = "ADMIN@ADMIN.COM",
             Email = "admin@admin.com"
@@ -396,6 +397,7 @@ Pikachu is also the starter Pokémon of Pokémon Rumble Blast and Pokémon Rumbl
             LastName = "A.",
             NormalizedUserName = "PASLA",
             UserName = "PasLa",
+            PhoneNumber="222-222-2222",
             Id = PaulID,
             NormalizedEmail = "PAUL@EXEMPLE.COM",
             Email = "paul@exemple.com"

GrossesMitaines/grosses-mitaines-ui/src/components/CartButton.js

@@ -36,7 +36,7 @@ const CartButton = () => {
                     navigate("/login");
                     handleClose();
                 }
-                else if(result.isDismissed && result.dismiss == Swal.DismissReason.cancel){
+                else if (result.isDismissed && result.dismiss == Swal.DismissReason.cancel) {
                     navigate("/formulaire");
                     handleClose();
                 }

GrossesMitaines/grosses-mitaines-ui/src/pages/Formulaire.js

@@ -1,55 +1,163 @@
+import { useEffect } from "react";
 import { useState } from "react";
 import { Button } from "react-bootstrap";
 import { useForm } from "react-hook-form";
+import Cookies from "universal-cookie";
+import { Form } from "react-bootstrap";
 
 export default function App() {
-    const { register, handleSubmit, watch, formState: { errors } } = useForm();
+    const { register, handleSubmit, setValue, watch, formState: { errors } } = useForm();
     const onSubmit = data => console.log(data);
+    const cookies = new Cookies();
+
+    const [userAddresses, setUserAddresses] = useState([]);
+
+    useEffect(() => {
+
+        const userInfo = cookies.get("GMGM");
+        if (userInfo != null && userInfo.LoggedIn == true) {
+            if (userInfo.firstName != null)
+                setValue("firstName", userInfo.firstName);
+            if (userInfo.lastName != null)
+                setValue("lastName", userInfo.lastName);
+            if (userInfo.phone != null)
+                setValue("phoneNumber", userInfo.phone);
+            if (userInfo.email != null)
+                setValue("emailAddress", userInfo.email);
+
+            fetch("https://localhost:7292/api/Address", {
+                method: 'GET',
+                credentials: 'include',
+                mode: 'cors'
+            },).then(async (response) => {
+                if (response.ok) {
+                    const json = await response.json();
+                    setUserAddresses(json);
+                    // if (json.length >= 1)
+                    //     setFormAddress(json[0]);
+                }
+            });
+        }
+
+
+    }, []);
+
+    const setFormAddress = (addressId) => {
+
+        const address = userAddresses.filter(a => a.id == addressId);
+
+        console.log(address);
+        setValue("civicNumber", address.civicNumber);
+        setValue("appartment", address.appartment);
+        setValue("street", address.street);
+        setValue("city", address.city);
+        setValue("province", address.province);
+        setValue("country", address.country);
+        setValue("postalCode", address.postalCode);
+    }
 
     return (
         <div className="form-container">
             <form onSubmit={handleSubmit(onSubmit)}>
                 <h4 className="text-center">Formulaire de commande</h4>
                 <div className="Error_color">
-                <div className="form-group">
+                    <div className="form-group">
-                    <label>Prénom: </label>
+                        <label>Adresse courriel*: </label>
-                    <input placeholder="Votre prénom:" {...register("Prénom", { required: true, minLength: 2})} />
+                        <input {...register("emailAddress", { required: true, pattern: /^[A-Za-z0-9+_.-]+@(.+)$/ })} />
-                </div>
+                    </div>
-                <div>
+                    <div>
-                    {errors.Prénom && errors.Prénom.type === 'required' && <span>Vous devez entrer votre prénom!</span>}
+                        {errors.Email && errors.Email.type === 'required' && <span>Vous devez entrer une adresse courriel!</span>}
-                    {errors.Prénom && errors.Prénom.type === 'minLength' && <span>Votre prénom doit avoir au moins 2 lettres!</span>}
+                        {errors.Email && errors.Email.type === 'pattern' && <span>Adresse courriel non valide!</span>}
-                </div>
+                    </div>
-                <div className="form-group">
+                    <div className="form-group">
-                    <label>Nom: </label>
+                        <label>Prénom*: </label>
-                    <input placeholder="Votre nom:" {...register("Nom", { required: true, minLength: 2})} />
+                        <input {...register("firstName", { required: true, minLength: 2 })} />
-                </div>
+                    </div>
-                <div>
+                    <div>
-                    {errors.Nom && errors.Nom.type === 'required' && <span>Vous devez entrer votre nom!</span>}
+                        {errors.Prénom && errors.Prénom.type === 'required' && <span>Vous devez entrer votre prénom!</span>}
-                    {errors.Nom && errors.Nom.type === 'minLength' && <span>Votre nom doit avoir au moins 2 lettres!</span>}
+                        {errors.Prénom && errors.Prénom.type === 'minLength' && <span>Votre pré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>Nom*: </label>
-                    <input placeholder="Exemple: 111-111-1111" {...register("Téléphone", { required: true, pattern: /^[0-9]{3}-[0-9]{3}-[0-9]{4}$/ })} />
+                        <input {...register("lastName", { required: true, minLength: 2 })} />
-                </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.Nom && errors.Nom.type === 'required' && <span>Vous devez entrer votre nom!</span>}
-                    {errors.Téléphone && errors.Téléphone.type === 'pattern' && <span>Téléphone non valide!</span>}
+                        {errors.Nom && errors.Nom.type === 'minLength' && <span>Votre nom doit avoir au moins 2 lettres!</span>}
-                </div>
+                    </div>
-                <div className="form-group">
+                    <div className="form-group">
-                    <label>Adresse civique: </label>
+                        <label>Numéro de téléphone*: </label>
-                    <input placeholder="Votre adresse:" {...register("Adresse", { required: true })} />
+                        <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.Adresse && errors.Adresse.type === 'required' && <span>Vous devez entrer une adresse!</span>}
+                        {errors.Téléphone && errors.Téléphone.type === 'required' && <span>Vous devez entrer un numéro de téléphone!</span>}
-                </div>
+                        {errors.Téléphone && errors.Téléphone.type === 'pattern' && <span>Téléphone non valide!</span>}
-                <div className="form-group">
+                    </div>
-                    <label>Adresse courriel: </label>
+                    <div className="formulaire-address">
-                    <input placeholder="Votre courriel" {...register("Email", { required: true, pattern: /^[A-Za-z0-9+_.-]+@(.+)$/ })} />
+                        <h5>
-                </div>
+                            Adresse
-                <div>
+                            <Form.Select onSelect={(e) => { setFormAddress(e.target.value); }}>
-                {errors.Email && errors.Email.type === 'required' && <span>Vous devez entrer une adresse courriel!</span>}
+                                {userAddresses.map((a) => (
-                {errors.Email && errors.Email.type === 'pattern' && <span>Adresse courriel non valide!</span>}
+                                    <option key={a.id} value={a.id}>{a.civicNumber} {a.street}</option>
-                </div>
+                                ))}
+                            </Form.Select>
+                        </h5>
+                        <div className="form-group">
+                            <label>Numéro civique*: </label>
+                            <input type="number" min="0" {...register("civicNumber", { required: true })} />
+                        </div>
+                        <div>
+                            {errors.civicNumber && errors.civicNumber.type === 'required' && <span>Vous devez entrer une numéro civique!</span>}
+                        </div>
+                        <div className="form-group">
+                            <label>Rue*: </label>
+                            <input {...register("street", { required: true, minLength: 3, maxLength: 50 })} />
+                        </div>
+                        <div>
+                            {errors.street && errors.street.type === 'required' && <span>Vous devez entrer votre rue!</span>}
+                            {errors.street && errors.street.type === 'minLength' && <span>Votre rue doit avoir au moins 3 lettres!</span>}
+                            {errors.street && errors.street.type === 'maxLength' && <span>Votre rue doit avoir moins de 51 lettres!</span>}
+
+                        </div>
+                        <div className="form-group">
+                            <label>Numéro d'appartement: </label>
+                            <input {...register("appartment", { required: false })} />
+                        </div>
+                        <div className="form-group">
+                            <label>Ville*: </label>
+                            <input {...register("city", { required: true, minLength: 4, maxLength: 50 })} />
+                        </div>
+                        <div>
+                            {errors.city && errors.city.type === 'required' && <span>Vous devez entrer votre ville!</span>}
+                            {errors.city && errors.city.type === 'minLength' && <span>Votre ville doit avoir au moins 4 lettres!</span>}
+                            {errors.city && errors.city.type === 'maxLength' && <span>Votre ville doit avoir moins de 51 lettres!</span>}
+                        </div>
+                        <div className="form-group">
+                            <label>Province (abréviation)*: </label>
+                            <input placeholder="Exemple: QC" {...register("province", { required: true, maxLength: 3 })} />
+                        </div>
+                        <div>
+                            {errors.province && errors.province.type === 'required' && <span>Vous devez entrer votre province!</span>}
+                            {errors.province && errors.province.type === 'maxLength' && <span>Votre province doit avoir moins de 4 lettres!</span>}
+                        </div>
+                        <div className="form-group">
+                            <label>Pays*: </label>
+                            <input {...register("country", { required: true, minLength: 4, maxLength: 30 })} />
+                        </div>
+                        <div>
+                            {errors.country && errors.country.type === 'required' && <span>Vous devez entrer votre pays!</span>}
+                            {errors.country && errors.country.type === 'minLength' && <span>Votre pays doit avoir au moins 4 lettres!</span>}
+                            {errors.cicountryty && errors.country.type === 'maxLength' && <span>Votre pays doit avoir moins de 31 lettres!</span>}
+                        </div>
+                        <div className="form-group">
+                            <label>Code postal*: </label>
+                            <input {...register("postalCode", { required: true })} />
+                        </div>
+                        <div>
+                            {errors.postalCode && errors.postalCode.type === 'required' && <span>Vous devez entrer votre code postal!</span>}
+                        </div>
+                    </div>
+
                 </div>
                 <Button className="btn-primary btn-ajouter-morceau" type="submit" >Confirmer</Button>
             </form>

GrossesMitaines/grosses-mitaines-ui/src/stylesheets/site.css

@@ -780,6 +780,13 @@ a {
 
 .invoice-item-price {}
 
+.formulaire-address{
+    border:gray 1px solid;
+    padding: 10px;
+    margin-bottom: 10px;
+    border-radius: 2px;
+}
+
 /* -------------------------------------------------------- */
 /* specification pour les moyennes écrans
 /* -------------------------------------------------------- */