Skip to content

Commit

Permalink
Merge pull request #38 from TCC-Klaiton-Diogo/feature/TKD-52
Browse files Browse the repository at this point in the history 
TKD-52 - Alterar layout para "Esqueci minha senha"
  • Loading branch information
@Haaragard
Haaragard authored Sep 12, 2022
2 parents b8938ba + c34691e commit c2a3f58
Show file tree
Hide file tree
Showing 2 changed files with 106 additions and 99 deletions.
85 changes: 44 additions & 41 deletions resources/js/Pages/Auth/ForgotPassword.vue
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
<script setup>
import { Head, useForm } from '@inertiajs/inertia-vue3';
import JetAuthenticationCard from '@/Components/AuthenticationCard.vue';
import JetAuthenticationCardLogo from '@/Components/AuthenticationCardLogo.vue';
import JetButton from '@/Components/Button.vue';
import JetInput from '@/Components/Input.vue';
import JetInputError from '@/Components/InputError.vue';
import JetLabel from '@/Components/Label.vue';
import AuthenticationCard from '../../Components/AuthenticationCard.vue';
import Button from '../../Components/Button.vue';
import Input from '../../Components/Input.vue';
import InputError from '../../Components/InputError.vue';
import Label from '../../Components/Label.vue';
import GuestLayout from '../../Layouts/GuestLayout.vue';
defineProps({
status: String,
Expand All @@ -21,40 +21,43 @@ const submit = () => {
</script>

<template>
<Head title="Forgot Password" />

<JetAuthenticationCard>
<template #logo>
<JetAuthenticationCardLogo />
<GuestLayout title="Forgot Password">
<template #main>
<!-- Register -->
<AuthenticationCard class="mt-2">
<div class="mb-4 text-sm text-gray-600">
Forgot your password? No problem. Just let us know your email address and we will email you a password reset link that will allow you to choose a new one.
</div>

<div v-if="status" class="mb-4 font-medium text-sm text-green-600">
{{ status }}
</div>


<div class="mt-2">
<form @submit.prevent="submit">
<div>
<Label for="email" value="Email" />
<Input
id="email"
v-model="form.email"
type="email"
class="mt-1 block w-full"
required
autofocus
placeholder="Email"
/>
<InputError class="mt-2" :message="form.errors.email" />
</div>

<div class="flex items-center justify-end mt-8">
<Button class="mx-auto w-full text-center" :class="{ 'opacity-25': form.processing }" :disabled="form.processing">
Email Password Reset Link
</Button>
</div>
</form>
</div>
</AuthenticationCard>
</template>

<div class="mb-4 text-sm text-gray-600">
Forgot your password? No problem. Just let us know your email address and we will email you a password reset link that will allow you to choose a new one.
</div>

<div v-if="status" class="mb-4 font-medium text-sm text-green-600">
{{ status }}
</div>

<form @submit.prevent="submit">
<div>
<JetLabel for="email" value="Email" />
<JetInput
id="email"
v-model="form.email"
type="email"
class="mt-1 block w-full"
required
autofocus
/>
<JetInputError class="mt-2" :message="form.errors.email" />
</div>

<div class="flex items-center justify-end mt-4">
<JetButton :class="{ 'opacity-25': form.processing }" :disabled="form.processing">
Email Password Reset Link
</JetButton>
</div>
</form>
</JetAuthenticationCard>
</GuestLayout>
</template>
120 changes: 62 additions & 58 deletions resources/js/Pages/Auth/ResetPassword.vue
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,12 @@
<script setup>
import { Head, useForm } from '@inertiajs/inertia-vue3';
import JetAuthenticationCard from '@/Components/AuthenticationCard.vue';
import JetAuthenticationCardLogo from '@/Components/AuthenticationCardLogo.vue';
import JetButton from '@/Components/Button.vue';
import JetInput from '@/Components/Input.vue';
import JetInputError from '@/Components/InputError.vue';
import JetLabel from '@/Components/Label.vue';
import { useForm } from '@inertiajs/inertia-vue3';
import AuthenticationCard from '../../Components/AuthenticationCard.vue';
import AuthenticationCardLogo from '../../Components/AuthenticationCardLogo.vue';
import Button from '../../Components/Button.vue';
import Input from '../../Components/Input.vue';
import InputError from '../../Components/InputError.vue';
import Label from '../../Components/Label.vue';
import GuestLayout from '../../Layouts/GuestLayout.vue';
const props = defineProps({
email: String,
Expand All @@ -27,58 +28,61 @@ const submit = () => {
</script>

<template>
<Head title="Reset Password" />
<GuestLayout title="Reset Password">
<template #main>
<AuthenticationCard>
<form @submit.prevent="submit">
<div class="space-y-2">
<div>
<Label for="email" value="Email" />
<Input
id="email"
v-model="form.email"
type="email"
class="mt-1 block w-full"
required
autofocus
placeholder="Email"
/>
<InputError class="mt-2" :message="form.errors.email" />
</div>

<JetAuthenticationCard>
<template #logo>
<JetAuthenticationCardLogo />
</template>

<form @submit.prevent="submit">
<div>
<JetLabel for="email" value="Email" />
<JetInput
id="email"
v-model="form.email"
type="email"
class="mt-1 block w-full"
required
autofocus
/>
<JetInputError class="mt-2" :message="form.errors.email" />
</div>
<div>
<Label for="password" value="Password" />
<Input
id="password"
v-model="form.password"
type="password"
class="mt-1 block w-full"
required
autocomplete="new-password"
placeholder="Password"
/>
<InputError class="mt-2" :message="form.errors.password" />
</div>

<div class="mt-4">
<JetLabel for="password" value="Password" />
<JetInput
id="password"
v-model="form.password"
type="password"
class="mt-1 block w-full"
required
autocomplete="new-password"
/>
<JetInputError class="mt-2" :message="form.errors.password" />
</div>
<div>
<Label for="password_confirmation" value="Confirm Password" />
<Input
id="password_confirmation"
v-model="form.password_confirmation"
type="password"
class="mt-1 block w-full"
required
autocomplete="new-password"
placeholder="Confirm password"
/>
<InputError class="mt-2" :message="form.errors.password_confirmation" />
</div>
</div>

<div class="mt-4">
<JetLabel for="password_confirmation" value="Confirm Password" />
<JetInput
id="password_confirmation"
v-model="form.password_confirmation"
type="password"
class="mt-1 block w-full"
required
autocomplete="new-password"
/>
<JetInputError class="mt-2" :message="form.errors.password_confirmation" />
</div>

<div class="flex items-center justify-end mt-4">
<JetButton :class="{ 'opacity-25': form.processing }" :disabled="form.processing">
Reset Password
</JetButton>
</div>
</form>
</JetAuthenticationCard>
<div class="flex items-center justify-end mt-8">
<Button class="mx-auto w-full text-center" :class="{ 'opacity-25': form.processing }" :disabled="form.processing">
Reset Password
</Button>
</div>
</form>
</AuthenticationCard>
</template>
</GuestLayout>
</template>

0 comments on commit c2a3f58

Please sign in to comment.