sipo/Teren-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Changes

Browse Source
This commit is contained in:
Simon Pocrnjič
2026-01-10 20:11:20 +01:00
parent 711438d79f
commit c4d2f6e473
21 changed files with 1744 additions and 1889 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/js/Pages/Profile/Partials/DeleteUserForm.vue
+58 -55
View File
@@ -1,12 +1,12 @@
<script setup>
import { ref } from 'vue';
import { useForm } from '@inertiajs/vue3';
import ActionSection from '@/Components/ActionSection.vue';
import DangerButton from '@/Components/DangerButton.vue';
import DialogModal from '@/Components/DialogModal.vue';
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/Components/ui/card';
import { Button } from '@/Components/ui/button';
import { Input } from '@/Components/ui/input';
import { AlertDialog, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle } from '@/Components/ui/alert-dialog';
import InputError from '@/Components/InputError.vue';
import SecondaryButton from '@/Components/SecondaryButton.vue';
import TextInput from '@/Components/TextInput.vue';
import { Trash2, AlertTriangle } from 'lucide-vue-next';
const confirmingUserDeletion = ref(false);
const passwordInput = ref(null);
@@ -38,65 +38,68 @@ const closeModal = () => {
</script>
<template>
<ActionSection>
<template #title>
Delete Account
</template>
<Card>
<CardHeader>
<div class="flex items-center gap-2">
<Trash2 class="h-5 w-5 text-destructive" />
<CardTitle>Delete Account</CardTitle>
</div>
<CardDescription>
Permanently delete your account.
</CardDescription>
</CardHeader>
<template #description>
Permanently delete your account.
</template>
<template #content>
<div class="max-w-xl text-sm text-gray-600">
Once your account is deleted, all of its resources and data will be permanently deleted. Before deleting your account, please download any data or information that you wish to retain.
<CardContent class="space-y-4">
<div class="rounded-lg border border-destructive/50 bg-destructive/10 p-4">
<div class="flex gap-3">
<AlertTriangle class="h-5 w-5 text-destructive flex-shrink-0 mt-0.5" />
<p class="text-sm text-foreground">
Once your account is deleted, all of its resources and data will be permanently deleted. Before deleting your account, please download any data or information that you wish to retain.
</p>
</div>
</div>
<div class="mt-5">
<DangerButton @click="confirmUserDeletion">
Delete Account
</DangerButton>
</div>
<Button variant="destructive" @click="confirmUserDeletion">
<Trash2 class="h-4 w-4 mr-2" />
Delete Account
</Button>
</CardContent>
<!-- Delete Account Confirmation Modal -->
<DialogModal :show="confirmingUserDeletion" @close="closeModal">
<template #title>
Delete Account
</template>
<!-- Delete Account Confirmation Dialog -->
<AlertDialog :open="confirmingUserDeletion" @update:open="closeModal">
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Delete Account</AlertDialogTitle>
<AlertDialogDescription>
Are you sure you want to delete your account? Once your account is deleted, all of its resources and data will be permanently deleted. Please enter your password to confirm you would like to permanently delete your account.
</AlertDialogDescription>
</AlertDialogHeader>
<template #content>
Are you sure you want to delete your account? Once your account is deleted, all of its resources and data will be permanently deleted. Please enter your password to confirm you would like to permanently delete your account.
<div class="py-4">
<Input
ref="passwordInput"
v-model="form.password"
type="password"
placeholder="Password"
autocomplete="current-password"
@keyup.enter="deleteUser"
/>
<InputError :message="form.errors.password" class="mt-2" />
</div>
<div class="mt-4">
<TextInput
ref="passwordInput"
v-model="form.password"
type="password"
class="mt-1 block w-3/4"
placeholder="Password"
autocomplete="current-password"
@keyup.enter="deleteUser"
/>
<InputError :message="form.errors.password" class="mt-2" />
</div>
</template>
<template #footer>
<SecondaryButton @click="closeModal">
<AlertDialogFooter>
<Button variant="outline" @click="closeModal">
Cancel
</SecondaryButton>
<DangerButton
class="ms-3"
:class="{ 'opacity-25': form.processing }"
</Button>
<Button
variant="destructive"
:disabled="form.processing"
@click="deleteUser"
>
Delete Account
</DangerButton>
</template>
</DialogModal>
</template>
</ActionSection>
</Button>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
</Card>
</template>