From c4f1be2b766c9add4af1926019415f5942866661 Mon Sep 17 00:00:00 2001
From: Alicia Sykes <sykes.alicia@gmail.com>
Date: Wed, 9 Feb 2022 18:04:16 +0000
Subject: [PATCH] :children_crossing: Pressing enter submits login form (#483)
---
src/components/FormElements/Input.vue | 2 ++
src/views/Login.vue | 9 +++++----
2 files changed, 7 insertions(+), 4 deletions(-)
diff --git a/src/components/FormElements/Input.vue b/src/components/FormElements/Input.vue
index 42ec58af..c0b81b37 100644
--- a/src/components/FormElements/Input.vue
+++ b/src/components/FormElements/Input.vue
@@ -14,6 +14,7 @@
:name="name"
:id="name"
:placeholder="placeholder"
+ @keyup.enter="onEnter ? onEnter() : () => {}"
class="input-field"
/>
<p
@@ -35,6 +36,7 @@ export default {
name: String, // Required unique ID value, for accessibility
placeholder: String, // Optional placeholder value
description: String, // Optional info paragraph
+ onEnter: Function,
type: {
default: 'text', // Input type, e.g. text, password, number
type: String,
diff --git a/src/views/Login.vue b/src/views/Login.vue
index a26685ec..2dc73e78 100644
--- a/src/views/Login.vue
+++ b/src/views/Login.vue
@@ -21,15 +21,15 @@
<!-- Main login form -->
<form class="login-form" v-if="(!isUserAlreadyLoggedIn) && isAuthenticationEnabled">
<h2 class="login-title">{{ $t('login.title') }}</h2>
- <Input
+ <Input type="text"
v-model="username"
- type="text"
+ :onEnter="submitLogin"
:label="$t('login.username-label')"
class="login-field username"
/>
- <Input
+ <Input type="password"
v-model="password"
- type="password"
+ :onEnter="submitLogin"
:label="$t('login.password-label')"
class="login-field password"
/>
@@ -38,6 +38,7 @@
v-model="timeout"
:selectOnTab="true"
:options="dropDownMenu"
+ :map-keydown="(map) => ({ ...map, 13: () => this.submitLogin() })"
class="login-time-dropdown"
/>
<Button class="login-button" :click="submitLogin">