107 lines
3.2 KiB
Vue
107 lines
3.2 KiB
Vue
<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>
|
|
<chismosa-dropdown
|
|
v-if="this.$root.pedido != null"
|
|
class="hide-above-1023"
|
|
id="mobile">
|
|
</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>
|
|
<chismosa-dropdown
|
|
v-if="this.$root.pedido != null"
|
|
class="hide-below-1024"
|
|
id="wide">
|
|
</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>
|
|
</nav>
|
|
</template>
|
|
|
|
<script>
|
|
import ChismosaDropdown from '../pedidos/ChismosaDropdown.vue';
|
|
import {mapActions} from "vuex";
|
|
|
|
export default {
|
|
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});
|
|
|
|
}
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style>
|
|
|
|
p.navbar-item:empty {
|
|
display: none;
|
|
}
|
|
|
|
#nav-bar {
|
|
z-index: 10;
|
|
}
|
|
|
|
.text-a {
|
|
color: inherit;
|
|
}
|
|
|
|
@media (max-width: 1023px) {
|
|
.hide-below-1024 {
|
|
display: none !important;
|
|
}
|
|
}
|
|
|
|
@media (min-width: 1024px) {
|
|
.hide-above-1023 {
|
|
display: none !important;
|
|
}
|
|
}
|
|
</style>
|