<script>
import { mapActions, mapGetters, mapMutations, mapState } from "vuex";
import ChismosaDropdown from "../pedidos/ChismosaDropdown.vue";

export default {
    name: "OllasNavBarBrand",
    components: { ChismosaDropdown },
    computed: {
        ...mapGetters('ollas', ["montoTotal", "montoSuperado"]),
        ...mapGetters('pedido', ["pedidoDefinido"]),
        ...mapState('login', ["rol"]),
        ...mapState('ui', ["burger_activa"]),
        ...mapState('pedido', ["nombre"]),
        mostrarAviso() {
            return this.pedidoDefinido && this.rol === 'ollas' && this.montoSuperado;
        }
    },
    methods: {
        ...mapActions('ollas', ["getMontoPorOlla"]),
        ...mapMutations('ui', ["toggleBurger"]),
    },
    async mounted() {
        await this.getMontoPorOlla();
    }
}
</script>

<template>
    <div class="navbar-item">
        <chismosa-dropdown
            v-if="pedidoDefinido"
            class="hide-above-1023"
            ariaControls="mobile"/>
        <span v-if="mostrarAviso" class="tag is-warning is-size-6">
            Monto superado
        </span>
    </div>
</template>

<style scoped>
</style>
