basic commandes et mesCommandes

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

@@ -1,16 +1,82 @@
 const InvoiceItem = ({ invoice }) => {
 
     const productTotal = (p) => {
-        return (p.quantity * (p.product.status == 3 || p.product.status == 4 ? p.product.promoPrice : p.product.price)).toFixed(2)
+        return (p.quantity * (p.product.status == 3 || p.product.status == 4 ? p.product.promoPrice : p.product.price))
     }
 
-    const totals = () => {
-        var price = 0;
-        var tax = 0;
+    const getPriceHTML = () => {
 
-        invoice.products.map((p)=>{
-            price += productTotal(p)
-        })
+        const tpsRate = 5;
+        const tvqRate = 9.975;
+
+        var price = 0;
+        var tps = 0;
+        var tvq = 0;
+
+        invoice.products.map((p) => {
+            price += productTotal(p);
+        });
+
+        tps = price * (tpsRate / 100);
+        tvq = price * (tvqRate / 100);
+
+        return (
+            <div className="invoice-item-price">
+                Sous-total = {price.toFixed(2)} $ CA<br />
+                + TPS ({tpsRate}%) = {tps.toFixed(2)} $ CA<br />
+                + TVQ ({tvqRate}%) = {tvq.toFixed(2)} $ CA<br />
+                <b>Total = {(price + tps + tvq).toFixed(2)} $ CA</b>
+            </div>
+        );
+    }
+
+    const getStatus = (statusCode) => {
+        switch (statusCode) {
+
+            case 0:
+                return (
+                    <>
+                        Confirmé
+                    </>
+                )
+            case 1:
+                return (
+                    <>
+                        Cancellé
+                    </>
+                )
+            case 2:
+                return (
+                    <>
+                        En préparation
+                    </>
+                )
+            case 3:
+                return (
+                    <>
+                        En expédition
+                    </>
+                )
+            case 4:
+                return (
+                    <>
+                        Expédié
+                    </>
+                )
+            case 5:
+                return (
+                    <>
+                        Retourné
+                    </>
+                )
+
+            default:
+                return (
+                    <>
+                        Status Invalide
+                    </>
+                )
+        }
     }
 
 
@@ -19,7 +85,7 @@ const InvoiceItem = ({ invoice }) => {
         <div className="invoice-item-container">
             <div className="invoice-item-info">
                 <div>
-                    #{invoice.id}
+                    #{invoice.id} ({getStatus(invoice.status)})
                 </div>
                 <div className="invoice-item-expedition">
                     <b>Adresse d'expédition:</b><br />
@@ -30,14 +96,15 @@ const InvoiceItem = ({ invoice }) => {
                 </div>
             </div>
             <div className="invoice-item-products">
+                <h4>Produits</h4>
                 <ul className="invoice-item-product-list">
                     {invoice.products.map((p) => (
-                        <li>{p.quantity} x {p.product.title} -{'>'} {productTotal(p)}</li>
+                        <li key={p.id}>{p.quantity} x {p.product.title} <br/> <b>{productTotal(p).toFixed(2)} $ CA</b></li>
                     ))}
                 </ul>
-                <div>
-                    {totals()}
-                </div>
+                <>
+                    {getPriceHTML()}
+                </>
             </div>
         </div>
     );