<template>
    <div class="dropdown is-right navbar-item" :class="{'is-active':activa}">
        <div class="dropdown-trigger">
            <a class="text-a" aria-haspopup="true" :aria-controls="id" @click.capture="toggle">
            <span class="icon is-small mr-1">
                <img src="/assets/chismosa.png">
            </span>
            <span v-text="'$' + total"></span>
            </a>
        </div>
    </div>
</template>

<script>
import Chismosa from './Chismosa.vue'
import { mapState } from "vuex";
export default {
    components: {
        Chismosa
    },
    props: {
        id: {
            type: String,
            required: true
        }
    },
    data() {
        return {
            activa: false,
        }
    },
    computed: {
        ...mapState('pedido',["total"]),
    },
    mounted() {
        Event.$on('pedido-actualizado', this.actualizar);
    },
    methods: {
        toggle() {
            this.activa = !this.activa;
            Event.$emit("toggle-chismosa", this.activa);
        },
    },
}
</script>