38 lines
1.4 KiB
Vue

<script setup>
import { router } from '@inertiajs/vue3';
const props = defineProps({
project: {
type: Object,
required: true,
},
});
function confirmDelete() {
router.delete(`/dashboard/project/${props.project.id}/delete`);
}
</script>
<template>
<InertiaHead title="Nowy projekt" />
<div class="p-4">
<header class="pb-4">
<h1 class="text-3xl font-roboto font-light">Usuwanie projektu</h1>
</header>
<div class="max-w-[600px]">
<p class="mb-4">Na pewno usunąć projekt o nazwie {{ project.title }}?</p>
<div class="grid grid-cols-3 gap-2">
<InertiaLink
as="button"
href="/dashboard"
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']" />Usuń projekt {{ project.title }}</button>
</div>
</div>
</div>
</template>