felix
/
pedi2
forked from nathalie/pedi2
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Cismosa: Ajustes visuales

This commit is contained in:
Rodrigo 2024-09-10 22:07:16 -03:00
parent 69cd306263
commit fbae6770df
5 changed files with 69 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
resources/js/components/CategoriasContainer.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div v-show="visible" class="block ml-3 mr-3"> <div v-show="visible" class="column">
<div class="columns is-multiline is-mobile"> <div class="columns is-multiline is-mobile">
<div v-for="(categoria,i) in categorias" :key="i" class="block column is-one-quarter-desktop is-one-third-tablet is-half-mobile"> <div v-for="(categoria,i) in categorias" :key="i" class="block column is-one-quarter-desktop is-one-third-tablet is-half-mobile">
<div @click.capture="seleccionarCategoria(categoria)" class="card" style="height:100%" > <div @click.capture="seleccionarCategoria(categoria)" class="card" style="height:100%" >

109
resources/js/components/Chismosa.vue
View File

@ -1,51 +1,53 @@
<template> <template>
<div class="column"> <div class="column is-one-third full-height">
<table v-show="mostrar_tabla" class="chismosa-tabla table is-narrow is-striped is-bordered"> <div class="fixed-right">
<thead> <table v-show="mostrar_tabla" class="table is-striped is-bordered tabla-chismosa">
<tr> <thead>
<th>Producto</th> <tr>
<th><abbr title="Cantidad">C</abbr></th> <th>Producto</th>
<th><abbr title="Precio Total">$</abbr></th> <th><abbr title="Cantidad">C</abbr></th>
<th></th> <th><abbr title="Precio Total">$</abbr></th>
<th><abbr title="Eliminar"></abbr></th> <th></th>
</tr> <th><abbr title="Eliminar"></abbr></th>
</thead> </tr>
<tfoot> </thead>
<tr> <tfoot>
<th><abbr title="Bonos de Transporte">B. Transporte</abbr></th> <tr>
<th class="has-text-right">{{ cantidadBonosDeTransporte() }}</th> <th><abbr title="Bonos de Transporte">B. Transporte</abbr></th>
<th class="has-text-right">{{ totalBonosDeTransporte() }}</th> <th class="has-text-right">{{ cantidadBonosDeTransporte() }}</th>
<th></th> <th class="has-text-right">{{ totalBonosDeTransporte() }}</th>
<th></th> <th></th>
</tr> <th></th>
<tr v-if="this.$root.devoluciones"> </tr>
<th><p>Devoluciones</p></th> <tr v-if="this.$root.devoluciones">
<td><p :title="notasDevoluciones()">...</p></td> <th><p>Devoluciones</p></th>
<th class="has-text-right">-{{ devoluciones() }}</th> <td><p :title="notasDevoluciones()">...</p></td>
<th> <th class="has-text-right">-{{ devoluciones() }}</th>
<button @click.capture="modificarDevoluciones()" class="button is-warning"> <th>
<span class="icon"> <button @click.capture="modificarDevoluciones()" class="button is-warning">
<i class="fas fa-edit"></i> <span class="icon">
</span> <i class="fas fa-edit"></i>
</button> </span>
</th> </button>
<th></th> </th>
</tr> <th></th>
<tr> </tr>
<th>Total total</th> <tr>
<th></th> <th>Total total</th>
<th class="has-text-right">{{ total() }}</th> <th></th>
<th></th> <th class="has-text-right">{{ total() }}</th>
<th></th> <th></th>
</tr> <th></th>
</tfoot> </tr>
<tbody> </tfoot>
<producto-row v-for="producto in productos()" :producto="producto" :key="producto.id"></producto-row> <tbody>
</tbody> <producto-row v-for="producto in productos()" :producto="producto" :key="producto.id"></producto-row>
</table> </tbody>
<p class="has-text-centered" v-show="!mostrar_tabla"> </table>
Compa, todavía no agregaste nada a la chismosa. <p class="has-text-centered" v-show="!mostrar_tabla">
</p> Compa, todavía no agregaste nada a la chismosa.
</p>
</div>
</div> </div>
</template> </template>
@ -87,4 +89,15 @@
}, },
}, },
} }
</script> </script>
<style>
.tabla-chismosa {
width: 100%;
}
.fixed-right {
position: fixed;
overflow-y: auto;
max-height: 88vh;
}
</style>

2
resources/js/components/ChismosaDropdown.vue
View File

@ -31,7 +31,7 @@ export default {
methods: { methods: {
toggle() { toggle() {
this.activa = !this.activa; this.activa = !this.activa;
Event.$emit("toggle-chismosa"); Event.$emit("toggle-chismosa", this.activa);
}, },
}, },
} }

11
resources/js/components/PedidoBody.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div class="columns"> <div class="columns ml-3 mr-3">
<categorias-container></categorias-container> <categorias-container :class="chismosaActiva ? 'hide-below-1024' : ''"></categorias-container>
<productos-container></productos-container> <productos-container :class="chismosaActiva ? 'hide-below-1024' : ''"></productos-container>
<chismosa v-show="chismosaActiva"></chismosa> <chismosa v-show="chismosaActiva"></chismosa>
</div> </div>
</template> </template>
@ -23,9 +23,8 @@
} }
}, },
mounted() { mounted() {
Event.$on('toggle-chismosa', () => { Event.$on('toggle-chismosa', (activa) => {
this.chismosaActiva = !this.chismosaActiva; this.chismosaActiva = activa;
console.log(this.chismosaActiva);
}); });
}, },
} }

2
resources/js/components/ProductosContainer.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div v-show="visible" class="block ml-6 mr-6"> <div v-show="visible" class="column">
<div class="columns is-multiline is-mobile"> <div class="columns is-multiline is-mobile">
<producto-card v-for="(producto,i) in productos" :key="i" :producto="producto"> <producto-card v-for="(producto,i) in productos" :key="i" :producto="producto">
</producto-card><!-- END BLOCK COLUMN --> </producto-card><!-- END BLOCK COLUMN -->