Hide room popover

This commit is contained in:
Ramon Wenger 2018-10-17 15:32:15 +02:00
parent 20ff1f8137
commit 100fd19165
3 changed files with 11 additions and 5 deletions

View File

@ -1,5 +1,5 @@
<template> <template>
<div class="visibility-menu" v-if="show" v-click-outside="hideVisibility"> <div class="visibility-menu" v-if="show" v-click-outside="hidePopover">
<h3 class="visibility-menu__title">Sichtbarkeit</h3> <h3 class="visibility-menu__title">Sichtbarkeit</h3>
<div v-for="schoolClass in schoolClassVisibility" :key="schoolClass.id" class="visibility-menu__item"> <div v-for="schoolClass in schoolClassVisibility" :key="schoolClass.id" class="visibility-menu__item">
<checkbox :checked="!schoolClass.hidden" <checkbox :checked="!schoolClass.hidden"
@ -59,7 +59,7 @@
} }
}); });
}, },
hideVisibility() { hidePopover() {
this.$emit('hide-me'); this.$emit('hide-me');
} }

View File

@ -1,5 +1,5 @@
<template> <template>
<div class="room-popover"> <div class="room-popover" v-click-outside="hidePopover">
<a class="room-popover__link" @click="$emit('delete', id)">Raum löschen</a> <a class="room-popover__link" @click="$emit('delete', id)">Raum löschen</a>
<router-link :to="{name: 'edit-room', params: {id: id}}" class="room-popover__link">Raum bearbeiten</router-link> <router-link :to="{name: 'edit-room', params: {id: id}}" class="room-popover__link">Raum bearbeiten</router-link>
</div> </div>
@ -7,7 +7,13 @@
<script> <script>
export default { export default {
props: ['id'] props: ['id'],
methods: {
hidePopover() {
this.$emit('hide-me');
}
}
} }
</script> </script>

View File

@ -10,7 +10,7 @@
<a @click="showMenu = !showMenu" class="room-widget__more-link"> <a @click="showMenu = !showMenu" class="room-widget__more-link">
<ellipses></ellipses> <ellipses></ellipses>
</a> </a>
<room-popover @delete="deleteRoom" :id="id" v-if="showMenu"></room-popover> <room-popover @delete="deleteRoom" @hide-me="showMenu = false" :id="id" v-if="showMenu"></room-popover>
</div> </div>
</div> </div>
</div> </div>