90 lines
3.6 KiB
Vue
90 lines
3.6 KiB
Vue
<script setup lang="ts">
|
|
import { Head, useForm } from '@inertiajs/vue3';
|
|
import { Save } from '@lucide/vue';
|
|
import { toast } from 'vue-sonner';
|
|
import { Button } from '@/components/ui/button';
|
|
import { Card, CardContent } from '@/components/ui/card';
|
|
import {
|
|
Field,
|
|
FieldError,
|
|
FieldGroup,
|
|
FieldLabel,
|
|
FieldSet,
|
|
} from '@/components/ui/field';
|
|
import { Input } from '@/components/ui/input';
|
|
import SettingsLayout from '@/layouts/SettingsLayout.vue';
|
|
import type { PasswordFormData } from '@/types/settings';
|
|
|
|
const form = useForm<PasswordFormData>({
|
|
current_password: '',
|
|
password: '',
|
|
password_confirmation: '',
|
|
});
|
|
|
|
function submit() {
|
|
form.put('/admin/setting/password', {
|
|
onSuccess: () => {
|
|
form.reset();
|
|
},
|
|
onError: () => {
|
|
toast.error('Gagal memperbarui kata sandi. Periksa kembali formulir.');
|
|
},
|
|
});
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
|
|
<Head title="Kata Sandi" />
|
|
|
|
<SettingsLayout>
|
|
<form @submit.prevent="submit">
|
|
<div class="grid gap-6">
|
|
<Card>
|
|
<CardContent>
|
|
<FieldSet>
|
|
<FieldGroup class="grid gap-4 sm:grid-cols-3">
|
|
<Field>
|
|
<FieldLabel for="current_password" required>
|
|
Kata Sandi Saat Ini
|
|
</FieldLabel>
|
|
<Input id="current_password" v-model="form.current_password" type="password"
|
|
placeholder="********" autocomplete="current-password" />
|
|
<FieldError
|
|
:errors="form.errors.current_password ? [form.errors.current_password] : []" />
|
|
</Field>
|
|
|
|
<Field>
|
|
<FieldLabel for="password" required>
|
|
Kata Sandi Baru
|
|
</FieldLabel>
|
|
<Input id="password" v-model="form.password" type="password" placeholder="********"
|
|
autocomplete="new-password" />
|
|
<FieldError :errors="form.errors.password ? [form.errors.password] : []" />
|
|
</Field>
|
|
|
|
<Field>
|
|
<FieldLabel for="password_confirmation" required>
|
|
Konfirmasi Kata Sandi Baru
|
|
</FieldLabel>
|
|
<Input id="password_confirmation" v-model="form.password_confirmation"
|
|
type="password" placeholder="********" autocomplete="new-password" />
|
|
<FieldError
|
|
:errors="form.errors.password_confirmation ? [form.errors.password_confirmation] : []" />
|
|
</Field>
|
|
</FieldGroup>
|
|
</FieldSet>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<div class="flex items-center justify-end gap-2">
|
|
<Button type="submit" :disabled="form.processing">
|
|
<Save class="size-4" />
|
|
{{ form.processing ? 'Menyimpan...' : 'Simpan' }}
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</SettingsLayout>
|
|
</template>
|