Mostrar apto para veganes y celiques. Reacomodar iconos de nacional y ecosolidaria

app/Http/Resources/SubpedidoResource.php

@@ -17,11 +17,11 @@ class SubpedidoResource extends JsonResource
         return [
             'id' => $this->id,
             'nombre' => $this->nombre,
-            'subtotal_productos' => number_format($this->getSubtotalProductos(),2),
-            'subtotal_bonos' => number_format($this->getSubtotalBonos(),2),
+            'subtotal_productos' => number_format($this->getSubtotalProductos(),0),
+            'subtotal_bonos' => number_format($this->getSubtotalBonos(),0),
             'bonos_de_transporte' => $this->cantidadBDT(),
-            'subtotal_bonos_de_transporte' => number_format($this->getSubtotalBDT(),2),
-            'total' => number_format($this->getTotal(),2),
+            'subtotal_bonos_de_transporte' => number_format($this->getSubtotalBDT(),0),
+            'total' => number_format($this->getTotal(),0),
             'grupo_de_compra' => $this->grupoDeCompra,
             'productos' => $this->productos
         ];

public/js/chismosa.js

@@ -4,7 +4,7 @@ Vue.component('chismosa', {
             <table class="table is-fullwidth is-striped is-bordered">
                 <thead>
                 <tr>
-                    <th><abbr title="Producto">Prod</abbr></th>
+                    <th>Producto</th>
                     <th><abbr title="Cantidad">C</abbr></th>
                     <th><abbr title="Precio Total">$</abbr></th>
                     <th></th>
@@ -13,7 +13,7 @@ Vue.component('chismosa', {
                 </thead>
                 <tfoot>
                 <tr>
-                    <th><abbr title="Bonos de Transporte">BTR</abbr></th>
+                    <th><abbr title="Bonos de Transporte">B. Transporte</abbr></th>
                     <th>{{ this.subpedido.bonos_de_transporte }}</th>
                     <th>{{ this.subpedido.subtotal_bonos_de_transporte }}</th>
                     <th></th>
@@ -63,6 +63,11 @@ Vue.component('chismosa', {
                     this.subpedido = response.data.data;
                 });
         }
+    },
+    mounted() {
+        Event.$on('sync-subpedido', () =>  {
+            this.fetchSubpedido();
+        });
     }
 });
 
@@ -72,12 +77,12 @@ Vue.component('producto-row', {
             <td>{{ this.producto.nombre }}</td>
             <td>{{ this.producto.pivot.cantidad }}</td>
             <td>{{ this.producto.pivot.total }}</td>
-            <td><button class="button is-warning">
+            <td><button @click.capture="seleccionarProducto(producto)" class="button is-warning">
                 <span class="icon">
                     <i class="fas fa-edit"></i>
                 </span>
             </button></td>
-            <td><button class="button is-danger">
+            <td><button @click.capture="eliminarProducto(producto)" class="button is-danger">
                 <span class="icon">
                     <i class="fas fa-trash-alt"></i>
                 </span>
@@ -86,5 +91,14 @@ Vue.component('producto-row', {
     `,
     props: {
         producto: Object
+    },
+    methods: {
+        seleccionarProducto(producto) {
+            Event.$emit("producto-seleccionado",producto);
+        },
+        eliminarProducto(producto) {
+            Event.$emit("sync-subpedido", 0, this.producto.id);
+            Event.$emit("sync-subpedido");
+        }
     }
 })

public/js/productos.js

@@ -119,20 +119,21 @@ Vue.component('producto-container', {
           </header>
           <section class="modal-card-body">
               <div class="card-image">
+                  <figure v-show="producto.nacional" class="image icono is-32x32" style="z-index:10">
+                      <img src="/assets/uruguay.png">
+                  </figure>
+                  <figure v-show="producto.economia_solidaria" class="image icono is-32x32" style="z-index:10">
+                      <img src="/assets/solidaria.png">
+                  </figure>
                   <figure class="image is-4by3">
                       <img
                           v-bind:src="producto.imagen ? producto.imagen : 'https://bulma.io/images/placeholders/1280x960.png'">
                   </figure>
-                  <figure v-show="producto.nacional" class="image icono is-32x32">
-                      <img src="/assets/uruguay.png">
-                  </figure>
-                  <figure v-show="producto.economia_solidaria" class="image icono is-32x32">
-                      <img src="/assets/solidaria.png">
-                  </figure>
               </div>
               <div class="media-content">
                   <p class="title is-4" v-text="producto.proveedor"></p>
                   <p class="subtitle is-4">$<span v-text="producto.precio"></span></p>
+                  <p class="subtitle is-6"><span v-show="producto.apto_veganxs">Apto para veganxs. </span><span v-show="producto.apto_celiacxs">Apto para celíacxs.</span></p>
                   <p class="subtitle is-5"><span v-text="producto.descripcion"></span></p>
                   <div class="field has-addons is-centered is-thin-centered">
                       <p class="control">

resources/views/chismosa.blade.php

@@ -6,8 +6,10 @@
 
 @section('content')
     <chismosa></chismosa>
+	<producto-container></producto-container>
 @endsection
 
 @section('scripts')
     <script src="{{ asset('js/chismosa.js') }}"></script>
+	<script src="{{ asset('js/productos.js') }}"></script>
 @endsection

resources/views/layouts/app.blade.php

@@ -8,9 +8,10 @@
     <meta name="csrf-token" content="{{ csrf_token() }}">
 
     <title>{{ session("subpedido_nombre") ? "Pedido de " . session("subpedido_nombre") . " - " . config('app.name', 'Compras del MPS') : config('app.name', 'Compras del MPS')}}</title>
+    <link rel="icon" type="image/x-icon" href="/assets/favicon.png">
 
     <!-- Fonts -->
-    <script src="https://kit.fontawesome.com/9235d1c676.js" crossorigin="anonymous"></script>    
+    <script src="https://kit.fontawesome.com/9235d1c676.js" crossorigin="anonymous"></script>
     <!-- Styles -->
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css">
     <link rel="stylesheet" href="{{ asset('css/app.css') }}">