38 lines
1.5 KiB
Vue
38 lines
1.5 KiB
Vue
<script setup>
|
|
import { router } from '@inertiajs/vue3';
|
|
|
|
const props = defineProps({
|
|
message: {
|
|
type: Object,
|
|
required: true,
|
|
},
|
|
});
|
|
|
|
function confirmDelete() {
|
|
router.delete(`/dashboard/message/${props.message.id}/delete`);
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<InertiaHead title="Usuwanie wiadomości" />
|
|
<div class="p-4">
|
|
<header class="pb-4">
|
|
<h1 class="text-3xl font-roboto font-light">Usuwanie wiadomości</h1>
|
|
</header>
|
|
<div class="max-w-[600px]">
|
|
<p class="mb-4">Na pewno usunąć wiadomość od {{ message.sender }}?</p>
|
|
<div class="grid grid-cols-3 gap-2">
|
|
<InertiaLink
|
|
as="button"
|
|
:href="`/dashboard/message/${message.id}`"
|
|
class="col-span-1 flex justify-center items-center gap-3 w-full px-2 py-1 border-t-4 border-b-4 border-transparent hover:border-b-black"
|
|
><FontAwesomeIcon :icon="['fas', 'backward']" />Anuluj</InertiaLink>
|
|
<button
|
|
@click.prevent="confirmDelete"
|
|
class="col-span-2 flex justify-center items-center gap-3 w-full px-2 py-1 rounded-md bg-red-600 border-4 border-red-600 text-white text-lg hover:bg-transparent hover:text-red-600"
|
|
><FontAwesomeIcon :icon="['fas', 'trash']" /><span class="whitespace-nowrap overflow-hidden overflow-ellipsis">Usuń wiadomość od {{ message.sender }}</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|