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> <template>
<div class="container is-fluid has-text-centered"> <div class="block ml-3 mr-3 is-max-widescreen is-max-desktop">
<div class="block"> <comunes-tabs-secciones :tabs="tabs" :tabInicial="tabActiva"></comunes-tabs-secciones>
<div class="field"> <div class="block" id="pedidos-compras-seccion"
<p class="control"> :class="seccionActiva === 'pedidos-compras-seccion' ? 'is-active' : 'is-hidden'">
<a href="/compras/pedidos/descargar" class="button"> <div class="block">
<div class="field">
<p class="control">
<a href="/compras/pedidos/descargar" class="button">
<span class="icon is-small"> <span class="icon is-small">
<i class="fas fa-download"></i> <i class="fas fa-download"></i>
</span> </span>
<span>Descargar planilla de totales</span> <span>Descargar planilla de totales</span>
</a> </a>
</p> </p>
</div> </div>
<div class="field"> <div class="field">
<p class="control"> <p class="control">
<a href="/compras/pedidos/notas" class="button"> <a href="/compras/pedidos/notas" class="button">
<span class="icon is-small"> <span class="icon is-small">
<i class="fas fa-sticky-note"></i> <i class="fas fa-sticky-note"></i>
</span> </span>
<span>Descargar planilla de notas</span> <span>Descargar planilla de notas</span>
</a> </a>
</p> </p>
</div> </div>
<div class="field"> <div class="field">
<p class="control"> <p class="control">
<a href="/compras/pedidos/transporte" class="button"> <a href="/compras/pedidos/transporte" class="button">
<span class="icon is-small"> <span class="icon is-small">
<i class="fa fa-truck"></i> <i class="fa fa-truck"></i>
</span> </span>
<span>Descargar planilla de transporte</span> <span>Descargar planilla de transporte</span>
</a> </a>
</p> </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> </div>
</div> </div>
</template> </template>
<script> <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> </script>