Pestañas para body de compras

This commit is contained in:
Alejandro Tasistro 2024-12-21 13:29:14 -03:00
parent bddaf223e4
commit 22cbac14f1
1 changed files with 51 additions and 23 deletions

View File

@ -1,42 +1,70 @@
<template>
<div class="container is-fluid has-text-centered">
<div class="block">
<div class="field">
<p class="control">
<a href="/compras/pedidos/descargar" class="button">
<div class="block ml-3 mr-3 is-max-widescreen is-max-desktop">
<comunes-tabs-secciones :tabs="tabs" :tabInicial="tabActiva"></comunes-tabs-secciones>
<div class="block" id="pedidos-compras-seccion"
:class="seccionActiva === 'pedidos-compras-seccion' ? 'is-active' : 'is-hidden'">
<div class="block">
<div class="field">
<p class="control">
<a href="/compras/pedidos/descargar" class="button">
<span class="icon is-small">
<i class="fas fa-download"></i>
</span>
<span>Descargar planilla de totales</span>
</a>
</p>
</div>
<div class="field">
<p class="control">
<a href="/compras/pedidos/notas" class="button">
<span>Descargar planilla de totales</span>
</a>
</p>
</div>
<div class="field">
<p class="control">
<a href="/compras/pedidos/notas" class="button">
<span class="icon is-small">
<i class="fas fa-sticky-note"></i>
</span>
<span>Descargar planilla de notas</span>
</a>
</p>
</div>
<div class="field">
<p class="control">
<a href="/compras/pedidos/transporte" class="button">
<span>Descargar planilla de notas</span>
</a>
</p>
</div>
<div class="field">
<p class="control">
<a href="/compras/pedidos/transporte" class="button">
<span class="icon is-small">
<i class="fa fa-truck"></i>
</span>
<span>Descargar planilla de transporte</span>
</a>
</p>
<span>Descargar planilla de transporte</span>
</a>
</p>
</div>
</div>
</div>
<div class="block pb-6" id="canasta-compras-seccion"
:class="seccionActiva === 'canasta-compras-seccion' ? 'is-active' : 'is-hidden'">
<div class="block" id="canasta-compras-seccion">
<p> Todavía no hay nada por acá </p>
</div>
</div>
</div>
</template>
<script>
export default {
import TabsSecciones from "../comunes/TabsSecciones.vue";
export default {
components: {
TabsSecciones,
},
data() {
return {
tabs: [{ id: "pedidos-compras", nombre: "Pedidos" },
{ id: "canasta-compras", nombre: "Canasta" }],
tabActiva: "pedidos-compras",
seccionActiva: "pedidos-compras-seccion",
}
},
methods: {
setSeccionActiva(tabId) {
this.tabActiva = tabId;
this.seccionActiva = tabId + "-seccion";
},
}
}
</script>