Modifier un document : amélioration formulaire ajout de produits (affichage total, mise en page, format inputs) #166

backend/controllers/DocumentController.php

@@ -179,9 +179,7 @@ class DocumentController extends BackendController
                         
                         if($document) {
                                 
-                                $productsArray = Product::searchAll([], [
-                                    'as_array' => true,
-                                ]) ;
+                                $productsArray = Product::searchAll() ;
                                 
                                 $ordersArray = [] ;
                                 foreach($document->orders as $order) {
@@ -206,8 +204,10 @@ class DocumentController extends BackendController
                                             ]),
                                             'idUser' => $document->user->id,
                                             'products' => ArrayHelper::map($productsArray, 'id', function($product) {
-                                                    $product['wording_unit'] = Product::strUnit($product['unit']) ;
-                                                    return $product;
+                                                    return array_merge($product->getAttributes(),[
+                                                            'price_with_tax' => $product->price_with_tax,
+                                                            'wording_unit' => $product->wording_unit,
+                                                    ]) ;
                                             }),
                                             'orders' => $ordersArray,
                                             'total' => $document->getAmount(Order::AMOUNT_TOTAL)

backend/views/document/_form.php

@@ -124,7 +124,8 @@ use common\models\Producer;
                                         Ajouter un produit
                                 </div>
                                 <div class="panel-body">
-                                        <div class="col-md-5">
+                                        <div class="col-md-3">
+                                                <strong>Produit</strong>
                                                 <select class="form-control" v-model="productAddId"
                                                         @change="changeProductAdd">
                                                         <option value="0" selected="selected">--</option>
@@ -134,22 +135,24 @@ use common\models\Producer;
                                                 </select>
                                         </div>
                                         <template v-if="productAddId > 0">
-                                                <div class="col-md-2">
+                                                <div class="col-md-3">
+                                                        <strong>Prix unitaire</strong>
                                                         <div class="input-group">
                                                                 <input type="text" class="form-control input-price"
-                                                                       v-model="productAddPrice"/>
+                                                                       v-model="productAddPrice" @change="formatProductAddPrice"/>
                                                                 <span class="input-group-addon"><span
-                                                                            class="glyphicon glyphicon-euro"></span></span>
+                                                                            class="glyphicon glyphicon-euro"></span> TTC</span>
                                                         </div>
                                                 </div>
                                                 <div class="col-md-3">
+                                                        <strong>Quantité</strong>
                                                         <div class="input-group input-group-quantity">
                                                                 <span class="input-group-btn">
                                                                     <button class="btn btn-default" type="button"
                                                                             @click="changeQuantityProductAdd(-1)">-</button>
                                                                 </span>
                                                                 <input type="text" class="form-control input-quantity"
-                                                                       v-model="productAddQuantity"/>
+                                                                       v-model="productAddQuantity" @change="formatProductAddQuantity"/>
                                                                 <span class="input-group-addon">{{ productsArray[productAddId].wording_unit }}</span>
                                                                 <span class="input-group-btn">
                                                                             <button class="btn btn-default"
@@ -158,10 +161,18 @@ use common\models\Producer;
                                                                 </span>
                                                         </div>
                                                 </div>
-                                                <div class="col-md-2">
+                                                <div class="col-md-3 total">
+                                                        <strong>Total</strong>
+                                                        <div class="input-group">
+                                                                <input type="text" class="form-control input-price" readonly
+                                                                       :value="formatPrice(productAddPrice * productAddQuantity)"/>
+                                                                <span class="input-group-addon"><span
+                                                                            class="glyphicon glyphicon-euro"></span> TTC</span>
+                                                        </div>
                                                         <button class="btn btn-primary" value="Ajouter"
                                                                 @click="submitProductAdd">Ajouter
                                                         </button>
+                                                        <div class="clr"></div>
                                                 </div>
                                         </template>
                                         <div class="clr"></div>
@@ -176,26 +187,26 @@ use common\models\Producer;
                                                 <table class="table table-bordered" v-if="total > 0">
                                                         <thead>
                                                         <tr>
-                                                                <td>Nom</td>
-                                                                <td>Prix (unité)</td>
-                                                                <td>Quantité</td>
-                                                                <td>Total</td>
-                                                                <td>Supprimer</td>
+                                                                <th>Nom</th>
+                                                                <th>Prix (unité)</th>
+                                                                <th>Quantité</th>
+                                                                <th>Total</th>
+                                                                <th>Supprimer</th>
                                                         </tr>
                                                         </thead>
                                                         <tbody>
                                                         <template v-for="order in ordersArray">
                                                                 <tr v-for="productOrder in order.productOrder">
-                                                                        <td>{{
+                                                                        <td class="col-md-4">{{
                                                                                 productsArray[productOrder.id_product].name
                                                                                 }}
                                                                         </td>
-                                                                        <td>{{ formatPrice(productOrder.price) }}</td>
-                                                                        <td>{{ productOrder.quantity }}</td>
-                                                                        <td>{{ formatPrice(productOrder.quantity *
+                                                                        <td class="col-md-2">{{ formatPrice(productOrder.price) }}</td>
+                                                                        <td class="col-md-2">{{ productOrder.quantity }}</td>
+                                                                        <td class="col-md-2">{{ formatPrice(productOrder.quantity *
                                                                                 productOrder.price) }}
                                                                         </td>
-                                                                        <td>
+                                                                        <td class="col-md-2">
                                                                                 <a class="btn btn-default" @click="deleteProductOrder(productOrder.id)">
                                                                                         <span class="glyphicon glyphicon-trash"></span>
                                                                                 </a>

backend/web/css/screen.css

@@ -2313,3 +2313,11 @@ termes.
 .document-form #block-add-product .input-group-quantity .input-quantity {
   text-align: center;
 }
+/* line 22, ../sass/document/_form.scss */
+.document-form #block-add-product .total .input-group {
+  margin-bottom: 10px;
+}
+/* line 25, ../sass/document/_form.scss */
+.document-form #block-add-product .total .btn {
+  float: right;
+}

backend/web/js/vuejs/document-form.js

@@ -108,7 +108,7 @@ var app = new Vue({
         changeProductAdd: function(event) {
                 var idProduct = event.currentTarget.value ;
                 this.productAddId = idProduct ;
-                this.productAddPrice = parseFloat(this.productsArray[idProduct].price).toFixed(2) ;
+                this.productAddPrice = parseFloat(this.productsArray[idProduct].price_with_tax).toFixed(2) ;
                 this.productAddQuantity = this.getStepProductAdd() ;
         }, 
         changeQuantityProductAdd: function(quantity) {
@@ -143,6 +143,18 @@ var app = new Vue({
                 app.init() ;
                 appAlerts.alert('danger','Produit supprimé') ;
             }) ;
+        },
+        formatProductAddPrice: function() {
+            this.productAddPrice = Number(this.productAddPrice).toFixed(2).replace(',', '.');
+            if(isNaN(this.productAddPrice)) {
+                this.productAddPrice = 0 ;
+            }
+        },
+        formatProductAddQuantity: function() {
+            this.productAddQuantity = parseInt(this.productAddQuantity) ;
+            if(isNaN(this.productAddQuantity)) {
+                this.productAddQuantity = 1 ;
+            }
         }
     }
 });

backend/web/sass/document/_form.scss

@@ -17,5 +17,14 @@
                                 text-align: center ;
                         }
                 }
+
+                .total {
+                        .input-group {
+                                margin-bottom: 10px ;
+                        }
+                        .btn {
+                                float: right ;
+                        }
+                }
         }
 }

common/models/Product.php

@@ -60,8 +60,11 @@ use common\components\ActiveRecordCommon;
  */
 class Product extends ActiveRecordCommon
 {
-        var $total = 0;
-        var $apply_distributions = true;
+        public $total = 0;
+        public $apply_distributions = true;
+
+        public $price_with_tax = 0 ;
+        public $wording_unit = '' ;
 
         public static $unitsArray = [
                 'piece' => [
@@ -128,6 +131,7 @@ class Product extends ActiveRecordCommon
                                 }
                                 return false;
                         }],
+                        [['price_with_tax', 'wording_unit'], 'safe']
                 ];
         }
 
@@ -166,6 +170,10 @@ class Product extends ActiveRecordCommon
                 if ($this->taxRate == null) {
                         $this->populateRelation('taxRate', GlobalParam::getCurrentProducer()->taxRate);
                 }
+
+                $this->wording_unit = Product::strUnit($this->unit) ;
+                $this->price_with_tax = $this->getpriceWithTax() ;
+
                 parent::afterFind();
         }