Agregado componente para dropdown generico

This commit is contained in:
Alejandro Tasistro 2025-08-12 22:26:48 -03:00
parent bdd44d72fb
commit 2dba5ef3b4

View file

@ -0,0 +1,52 @@
<template>
<div class="buttons" :class="{'is-right': isRight}">
<div class="dropdown" :class="{'is-active': dropdownActivo}" @mouseleave="dropdownActivo = false">
<div class="dropdown-trigger">
<button class="button" aria-haspopup="true" aria-controls="dropdown-menu" @click="dropdownActivo = !dropdownActivo">
<span class="icon is-small"><i class="fas fa-download"/></span>
<span>{{ placeholder }}</span>
<span class="icon is-small"><i class="fas fa-angle-down" aria-hidden="true"/></span>
</button>
</div>
<div class="dropdown-menu" id="dropdown-menu" role="menu">
<div class="dropdown-content">
<a class="dropdown-item"
v-for="(opcion,i) in opciones"
:key="i"
:href="opcion.href">
{{ opcion.nombre }}
</a>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name: "Dropdown",
props: {
placeholder: {
type: String,
required: true,
},
opciones: {
type: Array,
required: true,
},
isRight: {
type: Boolean,
required: false,
default: true,
}
},
data() {
return {
dropdownActivo: false
}
},
}
</script>
<style>
</style>