Compare commits
No commits in common. "ac559770c0c2dfc48cbeb1c461855e4d9d4a1f3d" and "f16b18c8b1716de1f47941a942c071c602dbb28b" have entirely different histories.
ac559770c0
...
f16b18c8b1
5 changed files with 162 additions and 209 deletions
|
@ -1,22 +1,111 @@
|
|||
<template>
|
||||
<div class="block ml-3 mr-3 is-max-widescreen is-max-desktop">
|
||||
<tabs-secciones :tabs="tabs" :tabInicial="tabActiva"/>
|
||||
<div class="block pb-6"
|
||||
id="pedidos-comisiones-seccion"
|
||||
<comunes-tabs-secciones :tabs="tabs" :tabInicial="tabActiva"></comunes-tabs-secciones>
|
||||
<div class="block pb-6" id="pedidos-comisiones-seccion"
|
||||
:class="seccionActiva === 'pedidos-comisiones-seccion' ? 'is-active' : 'is-hidden'">
|
||||
<div class="block" id="pedidos-comisiones-tabla-y-dropdown">
|
||||
<dropdown-descargar/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block pb-6"
|
||||
id="canasta-comisiones-seccion"
|
||||
<div class="block pb-6" id="canasta-comisiones-seccion"
|
||||
:class="seccionActiva === 'canasta-comisiones-seccion' ? 'is-active' : 'is-hidden'">
|
||||
<canasta-seccion/>
|
||||
<div class="block" id="canasta-comisiones-seccion">
|
||||
<article class="message is-warning">
|
||||
<div class="message-header">
|
||||
<p>Formato de la canasta</p>
|
||||
</div>
|
||||
<div class="message-body">
|
||||
<div class="content">
|
||||
La planilla de la canasta tiene que tener el siguiente formato para que la aplicación la lea correctamente:
|
||||
<ul>
|
||||
<li> Los precios deben usar punto y no coma decimal </li>
|
||||
<li> El nombre de las columnas deben ser "Tipo", "Producto", y "Precio" respectivamente </li>
|
||||
<li> Las celdas deben separarse con '|' </li>
|
||||
<li> No puede haber "enters" en ninguna celda </li>
|
||||
<li> El bono de transporte debe tener tipo 'T' </li>
|
||||
</ul>
|
||||
<a class="has-text-info" href="/comisiones/canasta/ejemplo">Planilla de ejemplo.</a>
|
||||
<article class="message is-danger mt-2">
|
||||
<div class="message-body">
|
||||
<div class="content">
|
||||
Cuidado! Cargar una nueva canasta elimina todos los pedidos de la aplicación.
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
<div class="buttons is-right">
|
||||
<canasta-input/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block pb-6"
|
||||
id="saldos-comisiones-seccion"
|
||||
:class="seccionActiva === 'saldos-comisiones-seccion' ? 'is-active' : 'is-hidden'">
|
||||
<saldos-seccion/>
|
||||
<div
|
||||
class="block pb-6"
|
||||
id="saldos-comisiones-seccion"
|
||||
:class="seccionActiva === 'saldos-comisiones-seccion' ? 'is-active' : 'is-hidden'"
|
||||
>
|
||||
<div class="block" id="saldos-comisiones-seccion">
|
||||
<article class="message is-warning">
|
||||
<div class="message-header">
|
||||
<p>
|
||||
<button class="icon" aria-label="foldout" @click="toggleSaldosFileDialog">
|
||||
<i class="fa" :class="show_saldos_file_dialog ? 'fa-arrow-up' : 'fa-arrow-down'"></i>
|
||||
</button>
|
||||
Cargar saldos
|
||||
</p>
|
||||
</div>
|
||||
<div class="message-body" v-if="show_saldos_file_dialog">
|
||||
<div class="content">
|
||||
La planilla de saldos tiene que tener el siguiente formato para que la aplicación la lea correctamente:
|
||||
<ul>
|
||||
<li>Los valores deben usar punto y no coma decimal</li>
|
||||
<li>El nombre de las columnas deben ser "Barrio" y "Saldo"</li>
|
||||
<li>Las celdas deben separarse con '|'</li>
|
||||
<li>No puede haber "enters" en ninguna celda</li>
|
||||
<li>El nombre de los barrios debe estar exactamente igual que como están configurados en esta aplicacaión</li>
|
||||
</ul>
|
||||
<article class="message is-danger mt-2">
|
||||
<div class="message-body">
|
||||
<div class="content">
|
||||
Cargar un archivo de saldos sólo reemplazará los saldos de los barrios presentes en la tabla.
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
<input-file-button text="Subir archivo" @archivo-subido="saldosSubido" />
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<table class="table container">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Barrio</th>
|
||||
<th>Saldo</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="gdc in grupos_de_compra">
|
||||
<th>{{ gdc.nombre }}</th>
|
||||
<td>
|
||||
<input id="cantidad"
|
||||
v-model="gdc.saldo"
|
||||
class="input is-small"
|
||||
type="number"
|
||||
style="text-align: center"
|
||||
@input="saldoModificado(gdc.id)">
|
||||
</td>
|
||||
<td>
|
||||
<button :disabled="!isSaldoModificado(gdc.id)" class="button is-small is-success ml-1" @click="confirmar_saldo(gdc.id)">
|
||||
<span class="icon">
|
||||
<i class="fas fa-check"></i>
|
||||
</span>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -24,18 +113,16 @@
|
|||
<script>
|
||||
import TabsSecciones from "../comunes/TabsSecciones.vue";
|
||||
import DropdownDescargar from "./DropdownDescargar.vue";
|
||||
import CanastaInput from "./CanastaInput.vue";
|
||||
import InputFileButton from "../comunes/InputFileButton.vue";
|
||||
import CanastaSeccion from "./canasta/CanastaSeccion.vue";
|
||||
import SaldosSeccion from "./saldos/SaldosSeccion.vue";
|
||||
import { mapActions } from "vuex";
|
||||
import { mapActions, mapState } from "vuex";
|
||||
|
||||
export default {
|
||||
name: "ComisionesBody",
|
||||
components: {
|
||||
SaldosSeccion,
|
||||
CanastaSeccion,
|
||||
TabsSecciones,
|
||||
DropdownDescargar,
|
||||
CanastaInput,
|
||||
InputFileButton,
|
||||
},
|
||||
data() {
|
||||
|
@ -47,14 +134,72 @@ export default {
|
|||
],
|
||||
tabActiva: "pedidos-comisiones",
|
||||
seccionActiva: "pedidos-comisiones-seccion",
|
||||
archivo: undefined,
|
||||
saldo_modificado: {},
|
||||
show_saldos_file_dialog: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
...mapActions('comisiones', ['getGruposDeCompra']),
|
||||
setSeccionActiva(tabId) {
|
||||
this.tabActiva = tabId;
|
||||
this.seccionActiva = tabId + "-seccion";
|
||||
},
|
||||
...mapActions('comisiones', ['getGruposDeCompra', 'setSaldo']),
|
||||
...mapActions('ui',["toast"]),
|
||||
async confirmar_saldo(gdc_id) {
|
||||
var saldo = this.getSaldo(gdc_id);
|
||||
await this.setSaldo({
|
||||
gdc_id: gdc_id,
|
||||
saldo: saldo,
|
||||
});
|
||||
this.saldo_modificado[gdc_id] = false;
|
||||
await this.getGruposDeCompra();
|
||||
},
|
||||
saldoModificado(gdc_id) {
|
||||
this.saldo_modificado[gdc_id] = true;
|
||||
},
|
||||
isSaldoModificado(gdc_id) {
|
||||
return gdc_id in this.saldo_modificado && this.saldo_modificado[gdc_id];
|
||||
},
|
||||
getSaldo(gdc_id) {
|
||||
for (var i = 0; i < this.grupos_de_compra.length; i++) {
|
||||
if (this.grupos_de_compra[i].id == gdc_id) {
|
||||
return this.grupos_de_compra[i].saldo;
|
||||
}
|
||||
}
|
||||
return 0;
|
||||
},
|
||||
async saldosSubido(event) {
|
||||
var archivo = event.archivo;
|
||||
if (archivo.type === "text/csv") {
|
||||
const formData = new FormData();
|
||||
formData.append("data", archivo);
|
||||
try {
|
||||
const response = await axios.post("/comisiones/saldos", formData, {
|
||||
headers: {
|
||||
"Content-Type": "multipart/form-data",
|
||||
},
|
||||
});
|
||||
this.getGruposDeCompra();
|
||||
this.toast({ mensaje: (response.data.message || "Canasta cargada exitosamente") });
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
this.toast({ mensaje: (error.response?.data?.message || "Hubo errores.") });
|
||||
}
|
||||
event.component.cargando = false;
|
||||
} else {
|
||||
this.toast("El archivo debe ser .CSV");
|
||||
event.component.cargando = false;
|
||||
}
|
||||
},
|
||||
toggleSaldosFileDialog() {
|
||||
this.show_saldos_file_dialog = !this.show_saldos_file_dialog;
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapState('comisiones', [
|
||||
'grupos_de_compra',
|
||||
]),
|
||||
},
|
||||
async mounted() {
|
||||
await this.getGruposDeCompra();
|
||||
|
|
|
@ -1,46 +0,0 @@
|
|||
<script>
|
||||
import { defineComponent } from "vue";
|
||||
import CanastaInput from "./CanastaInput.vue";
|
||||
|
||||
export default defineComponent({
|
||||
components: { CanastaInput },
|
||||
name: "CanastaSeccion",
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<article class="message is-warning">
|
||||
<div class="message-header">
|
||||
<p>Formato de la canasta</p>
|
||||
</div>
|
||||
<div class="message-body">
|
||||
<div class="content">
|
||||
La planilla de la canasta tiene que tener el siguiente formato para que la aplicación la lea correctamente:
|
||||
<ul>
|
||||
<li> Los precios deben usar punto y no coma decimal </li>
|
||||
<li> El nombre de las columnas deben ser "Tipo", "Producto", y "Precio" respectivamente </li>
|
||||
<li> Las celdas deben separarse con '|' </li>
|
||||
<li> No puede haber "enters" en ninguna celda </li>
|
||||
<li> El bono de transporte debe tener tipo 'T' </li>
|
||||
</ul>
|
||||
<a class="has-text-info" href="/comisiones/canasta/ejemplo">Planilla de ejemplo.</a>
|
||||
<article class="message is-danger mt-2">
|
||||
<div class="message-body">
|
||||
<div class="content">
|
||||
Cuidado! Cargar una nueva canasta elimina todos los pedidos de la aplicación.
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
<div class="buttons">
|
||||
<canasta-input/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
|
@ -1,146 +0,0 @@
|
|||
<script>
|
||||
import InputFileButton from "../../comunes/InputFileButton.vue";
|
||||
import { mapActions, mapState } from "vuex";
|
||||
|
||||
export default {
|
||||
name: "SaldosSeccion",
|
||||
components: { InputFileButton },
|
||||
data() {
|
||||
return {
|
||||
archivo: undefined,
|
||||
saldo_modificado: {},
|
||||
show_saldos_file_dialog: true,
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
...mapActions('ui',["toast"]),
|
||||
...mapActions('comisiones', ['setSaldo']),
|
||||
async confirmar_saldo(gdc_id) {
|
||||
var saldo = this.getSaldo(gdc_id);
|
||||
await this.setSaldo({
|
||||
gdc_id: gdc_id,
|
||||
saldo: saldo,
|
||||
});
|
||||
this.saldo_modificado[gdc_id] = false;
|
||||
await this.getGruposDeCompra();
|
||||
},
|
||||
saldoModificado(gdc_id) {
|
||||
this.saldo_modificado[gdc_id] = true;
|
||||
},
|
||||
isSaldoModificado(gdc_id) {
|
||||
return gdc_id in this.saldo_modificado && this.saldo_modificado[gdc_id];
|
||||
},
|
||||
getSaldo(gdc_id) {
|
||||
for (var i = 0; i < this.grupos_de_compra.length; i++) {
|
||||
if (this.grupos_de_compra[i].id == gdc_id) {
|
||||
return this.grupos_de_compra[i].saldo;
|
||||
}
|
||||
}
|
||||
return 0;
|
||||
},
|
||||
async saldosSubido(event) {
|
||||
var archivo = event.archivo;
|
||||
if (archivo.type === "text/csv") {
|
||||
const formData = new FormData();
|
||||
formData.append("data", archivo);
|
||||
try {
|
||||
const response = await axios.post("/comisiones/saldos", formData, {
|
||||
headers: {
|
||||
"Content-Type": "multipart/form-data",
|
||||
},
|
||||
});
|
||||
this.getGruposDeCompra();
|
||||
this.toast({ mensaje: (response.data.message || "Canasta cargada exitosamente") });
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
this.toast({ mensaje: (error.response?.data?.message || "Hubo errores.") });
|
||||
}
|
||||
event.component.cargando = false;
|
||||
} else {
|
||||
this.toast("El archivo debe ser .CSV");
|
||||
event.component.cargando = false;
|
||||
}
|
||||
},
|
||||
toggleSaldosFileDialog() {
|
||||
this.show_saldos_file_dialog = !this.show_saldos_file_dialog;
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapState('comisiones', ['grupos_de_compra']),
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<article class="message is-warning">
|
||||
<div class="message-header">
|
||||
<p>
|
||||
<span class="icon is-small"
|
||||
@click="toggleSaldosFileDialog">
|
||||
<i :class="`fas ${!show_saldos_file_dialog ? 'fa-angle-down' : 'fa-angle-up'}`" aria-hidden="true"></i>
|
||||
</span>
|
||||
Cargar saldos
|
||||
</p>
|
||||
</div>
|
||||
<div class="message-body" v-if="show_saldos_file_dialog">
|
||||
<div class="content">
|
||||
La planilla de saldos tiene que tener el siguiente formato para que la aplicación la lea correctamente:
|
||||
<ul>
|
||||
<li>Los valores deben usar punto y no coma decimal</li>
|
||||
<li>El nombre de las columnas deben ser "Barrio" y "Saldo"</li>
|
||||
<li>Las celdas deben separarse con '|'</li>
|
||||
<li>No puede haber "enters" en ninguna celda</li>
|
||||
<li>El nombre de los barrios debe estar exactamente igual que como están configurados en esta aplicacaión</li>
|
||||
</ul>
|
||||
<article class="message is-danger mt-2">
|
||||
<div class="message-body">
|
||||
<div class="content">
|
||||
Cargar un archivo de saldos sólo reemplazará los saldos de los barrios presentes en la tabla.
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
<input-file-button text="Subir archivo" @archivo-subido="saldosSubido" />
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
<div class="column">
|
||||
<table class="table container">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Barrio</th>
|
||||
<th>Saldo</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="gdc in grupos_de_compra">
|
||||
<th>{{ gdc.nombre }}</th>
|
||||
<td>
|
||||
<input id="cantidad"
|
||||
v-model="gdc.saldo"
|
||||
class="input is-small"
|
||||
type="number"
|
||||
style="text-align: center"
|
||||
@input="saldoModificado(gdc.id)">
|
||||
</td>
|
||||
<td>
|
||||
<button :disabled="!isSaldoModificado(gdc.id)" class="button is-small is-success ml-1" @click="confirmar_saldo(gdc.id)">
|
||||
<span class="icon">
|
||||
<i class="fas fa-check"></i>
|
||||
</span>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div id="pedidos-body" class="pb-6 mb-6">
|
||||
<div id="pedidos-body">
|
||||
<pedido-select v-if="!pedidoDefinido"/>
|
||||
<div v-else>
|
||||
<nav-migas/>
|
||||
|
|
Loading…
Add table
Reference in a new issue