🚸 Pressing enter submits login form (#483)

This commit is contained in:
Alicia Sykes 2022-02-09 18:04:16 +00:00
parent 33855dca40
commit c4f1be2b76
2 changed files with 7 additions and 4 deletions

View File

@ -14,6 +14,7 @@
:name="name" :name="name"
:id="name" :id="name"
:placeholder="placeholder" :placeholder="placeholder"
@keyup.enter="onEnter ? onEnter() : () => {}"
class="input-field" class="input-field"
/> />
<p <p
@ -35,6 +36,7 @@ export default {
name: String, // Required unique ID value, for accessibility name: String, // Required unique ID value, for accessibility
placeholder: String, // Optional placeholder value placeholder: String, // Optional placeholder value
description: String, // Optional info paragraph description: String, // Optional info paragraph
onEnter: Function,
type: { type: {
default: 'text', // Input type, e.g. text, password, number default: 'text', // Input type, e.g. text, password, number
type: String, type: String,

View File

@ -21,15 +21,15 @@
<!-- Main login form --> <!-- Main login form -->
<form class="login-form" v-if="(!isUserAlreadyLoggedIn) && isAuthenticationEnabled"> <form class="login-form" v-if="(!isUserAlreadyLoggedIn) && isAuthenticationEnabled">
<h2 class="login-title">{{ $t('login.title') }}</h2> <h2 class="login-title">{{ $t('login.title') }}</h2>
<Input <Input type="text"
v-model="username" v-model="username"
type="text" :onEnter="submitLogin"
:label="$t('login.username-label')" :label="$t('login.username-label')"
class="login-field username" class="login-field username"
/> />
<Input <Input type="password"
v-model="password" v-model="password"
type="password" :onEnter="submitLogin"
:label="$t('login.password-label')" :label="$t('login.password-label')"
class="login-field password" class="login-field password"
/> />
@ -38,6 +38,7 @@
v-model="timeout" v-model="timeout"
:selectOnTab="true" :selectOnTab="true"
:options="dropDownMenu" :options="dropDownMenu"
:map-keydown="(map) => ({ ...map, 13: () => this.submitLogin() })"
class="login-time-dropdown" class="login-time-dropdown"
/> />
<Button class="login-button" :click="submitLogin"> <Button class="login-button" :click="submitLogin">