🚸 Pressing enter submits login form (gchq#483)

BRAVO68WEB · Feb 9, 2022 · c4f1be2 · c4f1be2
1 parent 33855dc
commit c4f1be2
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 4 deletions.
diff --git 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
@@ -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">