pcpuma_unam_operador/components/layouts/Menu.vue
2022-07-21 22:43:16 -05:00

127 lines
3.4 KiB
Vue

<template>
<div>
<section>
<div
class="container is-flex is-justify-content-space-between is-align-items-center"
>
<div class="pl-3 py-2">
<b-button type="is-info" @click="open = true" size="is-small">
<b-icon icon="menu" size="is-small" />
</b-button>
</div>
</div>
</section>
<aside>
<b-sidebar type="is-white" v-model="open" fullheight overlay>
<div class="m-5">
<b-image :src="require('@/assets/icon.png')" alt="logo_pc_puma" />
<b-menu class="mt-6">
<b-menu-list label="Menu">
<b-menu-list v-if="idTipoUsuario === 3 || idTipoUsuario === 4">
<b-menu-item
label="Préstamo/Devolución"
:icon="icono('/operador/prestamo_devolucion')"
:disabled="activo('/operador/prestamo_devolucion')"
@click="opcionMenu('/operador/prestamo_devolucion')"
/>
</b-menu-list>
<b-menu-list v-if="idTipoUsuario === 3 || idTipoUsuario === 4">
<b-menu-item
label="Historial de Préstamos"
:icon="icono('/operador/historial_prestamos')"
:disabled="activo('/operador/historial_prestamos')"
@click="opcionMenu('/operador/historial_prestamos')"
/>
</b-menu-list>
<Equipos
:idTipoUsuario="idTipoUsuario"
:opcionMenu="opcionMenu"
/>
<Carritos
:idTipoUsuario="idTipoUsuario"
:opcionMenu="opcionMenu"
/>
<Usuarios
:idTipoUsuario="idTipoUsuario"
:opcionMenu="opcionMenu"
/>
<!--Admin-->
<Administrador
:idTipoUsuario="idTipoUsuario"
:opcionMenu="opcionMenu"
/>
<Configuracion
:idTipoUsuario="idTipoUsuario"
:opcionMenu="opcionMenu"
/>
</b-menu-list>
<b-menu-list label="Acciones">
<b-menu-item label="Cerrar Sesión" @click="cerrarSesion()" />
</b-menu-list>
</b-menu>
</div>
</b-sidebar>
</aside>
</div>
</template>
<script>
import Administrador from '@/components/layouts/Administrador'
import Carritos from '@/components/layouts/Carritos'
import Configuracion from '@/components/layouts/Configuracion'
import Equipos from '@/components/layouts/Equipos'
import Usuarios from '@/components/layouts/Usuarios'
export default {
components: {
Administrador,
Carritos,
Configuracion,
Equipos,
Usuarios,
},
data() {
return {
open: false,
idTipoUsuario: '',
}
},
methods: {
cerrarSesion() {
localStorage.clear()
this.$router.push('/')
},
opcionMenu(path) {
this.open = false
this.$router.push(path)
},
activo(ruta) {
return ruta === window.location.pathname
},
icono(ruta) {
return this.activo(ruta) ? 'square' : 'crop-square'
},
},
created() {
const objeto = JSON.parse(localStorage.getItem('usuario'))
this.idTipoUsuario = objeto.operador.tipoUsuario.id_tipo_usuario
},
}
</script>
<style scoped>
section {
background-color: #bb8704;
}
</style>