36 lines
695 B
Vue
36 lines
695 B
Vue
|
<template>
|
||
|
|
<span style="position: relative; display: inline-block;">
|
||
|
|
<div class="delete-button">
|
||
|
|
<button class="btn btn-danger btn-sm" @click="triggerDelete">
|
||
|
|
<b-icon-trash></b-icon-trash>
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
<slot></slot>
|
||
|
|
</span>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
.delete-button {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
right: 0;
|
||
|
|
z-index: 1;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import * as BIcons from "bootstrap-icons-vue";
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: "DeletableWrapper",
|
||
|
|
components: {
|
||
|
|
...BIcons
|
||
|
|
},
|
||
|
|
emits: ["delete"],
|
||
|
|
methods: {
|
||
|
|
triggerDelete() {
|
||
|
|
this.$emit("delete");
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|