PHP Classes

File: resources/js/Pages/Auth/ResetPassword.vue

Recommend this page to a friend!
  Classes of Rodrigo Faustino   Vue.js PHP CRUD Example Using Laravel Vite   resources/js/Pages/Auth/ResetPassword.vue   Download  
File: resources/js/Pages/Auth/ResetPassword.vue
Role: Auxiliary data
Content type: text/plain
Description: Auxiliary data
Class: Vue.js PHP CRUD Example Using Laravel Vite
Example application to manage users and blog posts
Author: By
Last change:
Date: 5 months ago
Size: 2,589 bytes
 

Contents

Class file image Download
<script setup> import GuestLayout from '@/Layouts/GuestLayout.vue'; import InputError from '@/Components/InputError.vue'; import InputLabel from '@/Components/InputLabel.vue'; import PrimaryButton from '@/Components/PrimaryButton.vue'; import TextInput from '@/Components/TextInput.vue'; import { Head, useForm } from '@inertiajs/inertia-vue3'; const props = defineProps({ email: String, token: String, }); const form = useForm({ token: props.token, email: props.email, password: '', password_confirmation: '', }); const submit = () => { form.post(route('password.store'), { onFinish: () => form.reset('password', 'password_confirmation'), }); }; </script> <template> <GuestLayout> <Head title="Reset Password" /> <form @submit.prevent="submit"> <div> <InputLabel for="email" value="Email" /> <TextInput id="email" type="email" class="mt-1 block w-full" v-model="form.email" required autofocus autocomplete="username" /> <InputError class="mt-2" :message="form.errors.email" /> </div> <div class="mt-4"> <InputLabel for="password" value="Password" /> <TextInput id="password" type="password" class="mt-1 block w-full" v-model="form.password" required autocomplete="new-password" /> <InputError class="mt-2" :message="form.errors.password" /> </div> <div class="mt-4"> <InputLabel for="password_confirmation" value="Confirm Password" /> <TextInput id="password_confirmation" type="password" class="mt-1 block w-full" v-model="form.password_confirmation" required autocomplete="new-password" /> <InputError class="mt-2" :message="form.errors.password_confirmation" /> </div> <div class="flex items-center justify-end mt-4"> <PrimaryButton :class="{ 'opacity-25': form.processing }" :disabled="form.processing"> Reset Password </PrimaryButton> </div> </form> </GuestLayout> </template>