Sink-UrlShortener/components/dashboard/links/Delete.vue
2024-05-25 08:09:30 +08:00

46 lines
1.1 KiB
Vue

<script setup>
import { toast } from 'vue-sonner'
const props = defineProps({
link: {
type: Object,
required: true,
},
})
const emit = defineEmits(['update:link'])
async function deleteLink() {
await useAPI('/api/link/delete', {
method: 'POST',
body: {
slug: props.link.slug,
},
})
emit('update:link', props.link, 'delete')
toast('Delete successful!')
}
</script>
<template>
<AlertDialog>
<AlertDialogTrigger as-child>
<slot />
</AlertDialogTrigger>
<AlertDialogContent class="max-w-[95svw] max-h-[95svh] md:max-w-lg grid-rows-[auto_minmax(0,1fr)_auto]">
<AlertDialogHeader>
<AlertDialogTitle>Are you absolutely sure?</AlertDialogTitle>
<AlertDialogDescription>
This action cannot be undone. This will really delete your link from servers.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel>Cancel</AlertDialogCancel>
<AlertDialogAction @click="deleteLink">
Continue
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
</template>