nathalie/pedi2
3
3
Fork 1
Code Issues Pull requests 1 Projects Releases Wiki Activity

Busqueda funcionando con productos.js

Browse source
This commit is contained in:
Alejandro Tasistro 2025-05-21 18:23:35 -03:00
parent 0dc8f39f07
commit b76ecf57dc
2 changed files with 70 additions and 57 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

123
resources/js/components/comunes/NavBar.vue
View file

@ -1,90 +1,101 @@
<template>
<nav id="nav-bar" class="navbar is-danger is-fixed-top" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="navbar-item" href="https://mps.org.uy">
<img src="/assets/logoMPS.png" height="28">
</a>
<!-- Styles nombre del barrio-->
<p class="navbar-item hide-below-1024">
<slot name="gdc"></slot>
</p>
<p class="navbar-item">
<slot name="subpedido"></slot>
</p>
<pedidos-chismosa-dropdown v-if="this.$root.pedido != null" class="hide-above-1023" id="mobile"></pedidos-chismosa-dropdown>
<a role="button" class="navbar-burger" :class="{'is-active':burgerActiva}" aria-label="menu" aria-expanded="false" data-target="nav-bar" @click="toggleBurger">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div class="navbar-menu" :class="{'is-active':burgerActiva}">
<div class="navbar-end">
<div v-if="this.$root.pedido != null" class="navbar-item field has-addons mt-2 mr-3">
<a class="button is-small has-text-dark-grey" @click.capture="buscar">
<div class="navbar-brand">
<a class="navbar-item" href="https://mps.org.uy">
<img src="/assets/logoMPS.png" height="28">
</a>
<!-- Styles nombre del barrio-->
<p class="navbar-item hide-below-1024">
<slot name="gdc"></slot>
</p>
<p class="navbar-item">
<slot name="subpedido"></slot>
</p>
<pedidos-chismosa-dropdown v-if="this.$root.pedido != null" class="hide-above-1023"
id="mobile"></pedidos-chismosa-dropdown>
<a role="button" class="navbar-burger" :class="{'is-active':burgerActiva}" aria-label="menu"
aria-expanded="false" data-target="nav-bar" @click="toggleBurger">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div class="navbar-menu" :class="{'is-active':burgerActiva}">
<div class="navbar-end">
<div v-if="this.$root.pedido != null" class="navbar-item field has-addons mt-2 mr-3">
<a class="button is-small has-text-dark-grey" @click.capture="buscar">
<span class="icon">
<i class="fas fa-search"></i>
</span>
</a>
<input class="input is-small" type="text" placeholder="Harina" v-model="searchString" @keyup.enter="buscar" >
</div>
<pedidos-chismosa-dropdown v-if="this.$root.pedido != null" class="hide-below-1024" id="wide"></pedidos-chismosa-dropdown>
<div class="block navbar-item">
<a onclick="event.preventDefault(); document.getElementById('logout-form').submit();" class="text-a">
Cerrar sesión
</a>
<slot name="logout-form"></slot>
</a>
<input class="input is-small" type="text" placeholder="Harina" v-model="searchString"
@keyup.enter="buscar">
</div>
<pedidos-chismosa-dropdown v-if="this.$root.pedido != null" class="hide-below-1024"
id="wide"></pedidos-chismosa-dropdown>
<div class="block navbar-item">
<a onclick="event.preventDefault(); document.getElementById('logout-form').submit();"
class="text-a">
Cerrar sesión
</a>
<slot name="logout-form"></slot>
</div>
</div>
</div>
</div>
</nav>
</template>
<script>
import ChismosaDropdown from '../pedidos/ChismosaDropdown.vue';
import {mapActions} from "vuex";
export default {
components: { ChismosaDropdown },
data() {
return {
burgerActiva: false,
searchString: "",
}
},
methods: {
toggleBurger() {
this.burgerActiva = !this.burgerActiva
components: {ChismosaDropdown},
data() {
return {
burgerActiva: false,
searchString: "",
}
},
methods: {
...mapActions('productos', ["filtrarProductos"]),
toggleBurger() {
this.burgerActiva = !this.burgerActiva
},
buscar() {
if (this.burgerActiva)
this.toggleBurger();
this.filtrarProductos({filtro: "nombre", valor: this.searchString});
Event.$emit('migas-agregar', {nombre: this.searchString});
}
},
buscar() {
if (this.burgerActiva) this.toggleBurger()
Event.$emit("filtrar-productos",'nombre',this.searchString)
}
},
};
</script>
<style>
p.navbar-item:empty {
display: none;
display: none;
}
#nav-bar {
z-index: 10;
z-index: 10;
}
.text-a {
color: inherit;
color: inherit;
}
@media (max-width: 1023px) {
.hide-below-1024 {
display: none !important;
}
.hide-below-1024 {
display: none !important;
}
}
@media (min-width: 1024px) {
.hide-above-1023 {
display: none !important;
}
.hide-above-1023 {
display: none !important;
}
}
</style>

4
resources/js/store/modules/productos.js vendored
View file

@ -42,7 +42,9 @@ const actions = {
commit('setProductos', response.data.data);
},
async filtrarProductos({ commit }, { filtro, valor }) {
const response = await axios.get("/api/productos");
const response = await axios.get("/api/productos", {
params: { [filtro]: valor }
});
commit('setFiltro', { clave: filtro, valor: valor });
commit('setProductos', response.data.data);
}