43 lines
982 B
Vue
43 lines
982 B
Vue
<template>
|
|
<div
|
|
v-if="isOpen"
|
|
class="fixed inset-0 bg-black/50 flex items-center justify-center z-[9999]"
|
|
>
|
|
<div
|
|
class="bg-white rounded-lg shadow-lg p-6 w-[350px] text-center relative"
|
|
>
|
|
<!-- Judul -->
|
|
<p class="text-lg font-semibold mb-2">{{ props.title }}?</p>
|
|
|
|
<!-- Deskripsi tambahan -->
|
|
<p class="text-sm text-gray-600 mb-4">
|
|
{{ props.message }}
|
|
</p>
|
|
|
|
<!-- Tombol aksi -->
|
|
<div class="flex justify-center gap-3">
|
|
<button
|
|
@click="$emit('cancel')"
|
|
class="bg-gray-300 px-4 py-2 rounded hover:bg-gray-400"
|
|
>
|
|
Batal
|
|
</button>
|
|
<button
|
|
@click="$emit('confirm')"
|
|
class="bg-red-500 text-white px-4 py-2 rounded hover:bg-red-600"
|
|
>
|
|
Hapus
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
const props = defineProps({
|
|
isOpen: Boolean,
|
|
title:String,
|
|
message:String
|
|
});
|
|
</script>
|