Kevin
40 lines
1017 B
Vue
40 lines
1017 B
Vue
<script setup lang="ts">
|
|
import { defineEmits, defineProps } from 'vue'
|
|
|
|
defineProps<{ show: boolean }>()
|
|
const emit = defineEmits(['confirm', 'cancel'])
|
|
|
|
const confirm = () => {
|
|
emit('confirm')
|
|
}
|
|
|
|
const cancel = () => {
|
|
emit('cancel')
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div v-if="show" class="fixed inset-0 flex items-center justify-center z-50">
|
|
<div class="fixed inset-0 bg-black opacity-50"></div>
|
|
<div class="bg-white rounded-lg p-6 z-10">
|
|
<h2 class="text-lg font-semibold mb-4">Confirmation</h2>
|
|
<p class="mb-4">Are you sure to delete this item ?</p>
|
|
<div class="flex justify-end space-x-2">
|
|
<button @click="confirm" class="px-4 py-2 bg-red-500 text-white rounded hover:bg-red-700">
|
|
Ok
|
|
</button>
|
|
<button
|
|
@click="cancel"
|
|
class="px-4 py-2 bg-gray-300 text-gray-700 rounded hover:bg-gray-400"
|
|
>
|
|
Cancel
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
/* Styles pour le modal */
|
|
</style>
|