notif when saved or error

app/Resources/views/logged/dashboard.html.twig

@@ -40,12 +40,13 @@
                     </button>
                 </div>
                 <div class="col-xs-12 col-md-6">
-                    <div class="row">
+                    <div class="row">{% verbatim %}
                         <div class="client-now text-right padded">
                             <div class="col-xs-12">
+
                                 <i class="fa fa-user"></i>
                                 Client actuel:
-                            </div> {% verbatim %}
+                            </div>
                             <div class="col-xs-10">
                             <div class="input-group">
 
@@ -57,16 +58,27 @@
                                <div>
 
                                 {{ activeSelling.length }} produit<span ng-if="activeSelling.length!=1">s</span>
-                            </div>{% endverbatim %}
-                        </div>
+
+                            </div>
+<!--états de sauvegarde-->
+          <div class="selling-ok alert-success alert block" ng-if="sellingOk" ng-click="sellingOk = false">
+            <i class="fa fa-save"></i>
+            Sauvegardé!
+        </div>
+         <div class="selling-ok alert-error alert block" ng-if="sellingError" ng-click="sellingError = false">
+            <i class="fa fa-warning"></i>
+            Problème de sauvegarde (pas de réseau ?)
+        </div>
+    {% endverbatim %}
                     </div>
                 </div>
             </div>
         </div>
+    </div>
 
-        <div class="row">
-            {% include 'logged/caisse-main.html.twig' %}
-        </div>
+    <div class="row">
+        {% include 'logged/caisse-main.html.twig' %}
+    </div>
 
 
     </div>
@@ -79,8 +91,9 @@
     <div id="history" class="tab-pane fade">
         <h2>Historique</h2>
     </div>
-    </div>
-    </div>
+
+
+
     {#</div>#}
     {#</div>#}
 

assets/css/pages/_dashboard.scss

@@ -86,12 +86,27 @@
   height: 70vh;
   overflow: auto;
 }
-.sellings{
-  .remove-item{
+
+.sellings {
+  .remove-item {
     margin-left: 1em;
   }
 }
-#not_loaded{
+
+#not_loaded {
   width: 100%;
   height: 75vh;
 }
+
+.selling-ok {
+  position: fixed;
+  bottom: 0;
+  left: 2em;
+  z-index: 10;
+}
+
+.block{
+  display: block;
+  width: calc(100% - 2em);
+  text-align:center;
+}

assets/js/parts/main.js

@@ -10,7 +10,7 @@ require('bootstrap-sass');
 
 $(document).ready(function () {
     $('[data-toggle="popover"]').popover();
-    $('#menu_button').on('click', function(){
+    $('#menu_button').on('click', function () {
         $('#menu-dashboard').toggleClass('shown');
     })
 });
@@ -87,7 +87,6 @@ angular
               }
           });
           $scope.activeSellingFiltered = soldObjectsIdsCount;
-
       }
 
       /**
@@ -283,22 +282,40 @@ angular
               }
           }, function (rep) {
               console.log('nope! ', rep.data);
+              $scope.showTemporaryErrorMessage();
           })
           ;
       };
 
       $scope.sellingOk = false;
+      $scope.sellingError = false;
       $scope.tempMessage = {};
       $scope.showTemporaryMessage = function () {
+          console.log('show message');
           if ($scope.sellingOk) {
+              $scope.sellingOk = false;
               return;
           }
           $scope.sellingOk = true;
           $timeout.cancel($scope.tempMessage);
           $scope.tempMessage = $timeout(function () {
+              console.log('hide message');
               $scope.sellingOk = false;
           }, 2000)
       };
+      $scope.showTemporaryErrorMessage = function () {
+          console.log('show message');
+          if ($scope.sellingError) {
+              $scope.sellingError = false;
+              return;
+          }
+          $scope.sellingError = true;
+          $timeout.cancel($scope.tempMessage);
+          $scope.tempMessage = $timeout(function () {
+              console.log('hide message');
+              $scope.sellingError = false;
+          }, 2000)
+      };
       $scope.init = (function () {
           $scope.fetchProductsFromDB();
       })();