StarMC/Astral-nook
StarMC/Astral-nook
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Get things into a somewhat working state on the login form

Browse source
This commit is contained in:
Dane Everitt 2018-03-31 15:52:11 -05:00
parent 7de2c8684c
commit 791cbaa5ce
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
15 changed files with 450 additions and 132 deletions
Download patch file Download diff file Expand all files Collapse all files

41
resources/assets/pterodactyl/scripts/components/auth/ForgotPassword.vue Normal file
View file

@ -0,0 +1,41 @@
<template>
<div>
<form class="bg-white shadow-lg rounded-lg pt-10 px-8 pb-6 mb-4 animate fadein" method="post">
<div class="flex flex-wrap -mx-3 mb-6">
<div class="input-open">
<input class="input" id="grid-email" type="text" aria-labelledby="grid-email" required
v-bind:value="email"
v-on:input="updateEmail($event)"
/>
<label for="grid-email">Email</label>
<p class="text-grey-darker text-xs">Enter your account email address to recive instructions on resetting your password.</p>
</div>
</div>
<div>
<button class="bg-blue hover:bg-blue-dark hover:border-blue-darker border-blue-dark border text-white p-4 rounded w-full uppercase tracking-wide text-sm"
type="submit">
Recover Account
</button>
</div>
<div class="pt-6 text-center">
<router-link to="/" class="text-xs text-grey tracking-wide no-underline uppercase hover:text-grey-dark">
Go to Login
</router-link>
</div>
</form>
</div>
</template>
<script>
export default {
name: 'forgot-password',
props: {
email: {type: String, required: true},
},
methods: {
updateEmail: function (event) {
this.$emit('update-email', event.target.value);
}
}
}
</script>

37
resources/assets/pterodactyl/scripts/components/auth/Login.vue Normal file
View file

@ -0,0 +1,37 @@
<template>
<div>
<login-form
v-if="this.$route.path === '/'"
v-bind:email="email"
v-on:update-email="onEmailUpdate"
/>
<forgot-password
v-if="this.$route.path === '/forgot-password'"
v-bind:email="email"
v-on:update-email="onEmailUpdate"
/>
</div>
</template>
<script>
import LoginForm from "./LoginForm";
import ForgotPassword from "./ForgotPassword";
export default {
name: 'login',
data: function () {
return {
email: '',
};
},
methods: {
onEmailUpdate: function (value) {
this.$data.email = value;
},
},
components: {
ForgotPassword,
LoginForm
},
}
</script>

45
resources/assets/pterodactyl/scripts/components/auth/LoginForm.vue Normal file
View file

@ -0,0 +1,45 @@
<template>
<div>
<form class="bg-white shadow-lg rounded-lg pt-10 px-8 pb-6 mb-4 animate fadein" :action="route('auth.login')" method="post">
<div class="flex flex-wrap -mx-3 mb-6">
<div class="input-open">
<input class="input" id="grid-username" type="text" name="user" aria-labelledby="grid-username" required
v-bind:value="email"
v-on:input="updateEmail($event)"
/>
<label for="grid-username">Username or Email</label>
</div>
</div>
<div class="flex flex-wrap -mx-3 mb-6">
<div class="input-open">
<input class="input" id="grid-password" type="password" name="password" aria-labelledby="grid-password" required>
<label for="grid-password">Password</label>
</div>
</div>
<div>
<button class="bg-blue hover:bg-blue-dark hover:border-blue-darker border-blue-dark border text-white p-4 rounded w-full uppercase tracking-wide text-sm" type="submit">
Sign In
</button>
</div>
<div class="pt-6 text-center">
<router-link to="/forgot-password" class="text-xs text-grey tracking-wide no-underline uppercase hover:text-grey-dark">
Forgot Password?
</router-link>
</div>
</form>
</div>
</template>
<script>
export default {
name: 'login-form',
props: {
email: { type: String, required: true },
},
methods: {
updateEmail: function (event) {
this.$emit('update-email', event.target.value);
}
}
}
</script>