store/resources/js/components/admin/hr/ResetPasswordDialog.vue

75 lines
2.2 KiB
Vue

<script setup lang="ts">
import { router } from '@inertiajs/vue3';
import { ref } from 'vue';
import { toast } from 'vue-sonner';
import {
AlertDialog,
AlertDialogAction,
AlertDialogCancel,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
AlertDialogTrigger,
} from '@/components/ui/alert-dialog';
import { Button } from '@/components/ui/button';
const props = defineProps<{
employeeId: number;
employeeName?: string | null;
}>();
const open = ref(false);
const processing = ref(false);
function resetPassword() {
processing.value = true;
router.post(`/admin/hr/employees/${props.employeeId}/reset-password`, {}, {
preserveScroll: true,
onSuccess: () => {
open.value = false;
},
onError: () => {
toast.error('Gagal mereset kata sandi.');
},
onFinish: () => {
processing.value = false;
},
});
}
</script>
<template>
<AlertDialog v-model:open="open">
<AlertDialogTrigger as-child>
<Button variant="outline" type="button">
Reset Kata Sandi
</Button>
</AlertDialogTrigger>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Reset kata sandi pegawai?</AlertDialogTitle>
<AlertDialogDescription>
Kata sandi
<span class="text-foreground font-medium">{{ employeeName ?? 'pegawai' }}</span>
akan direset ke kata sandi default sistem. Pengguna akan otomatis logout dari
semua sesi aktif.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel :disabled="processing">
Batal
</AlertDialogCancel>
<AlertDialogAction
:disabled="processing"
@click.prevent="resetPassword"
>
{{ processing ? 'Memproses...' : 'Reset Kata Sandi' }}
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
</template>