Backup_Repos/komga
1
0
Fork 0
mirror of https://github.com/gotson/komga.git synced 2025-12-21 07:56:57 +01:00
Code Issues Projects Releases Wiki Activity

fix(webui): validation on user login screen

Browse source 
closes #429
This commit is contained in:
Gauthier Roebroeck 2021-02-26 17:30:12 +08:00
parent 52472ecf1b
commit 392b3b87fe
1 changed files with 52 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

75
komga-webui/src/views/Login.vue
View file

@ -26,8 +26,10 @@
<v-col cols="12" sm="8" md="6" lg="4" xl="2">
<v-text-field v-model="form.login"
:label="$t('common.email')"
:error-messages="getErrors('login')"
autocomplete="username"
autofocus
@blur="$v.form.login.$touch()"
/>
</v-col>
</v-row>
@ -36,8 +38,11 @@
<v-col cols="12" sm="8" md="6" lg="4" xl="2">
<v-text-field v-model="form.password"
:label="$t('common.password')"
:error-messages="getErrors('password')"
type="password"
autocomplete="current-password"
@input="$v.form.password.$touch()"
@blur="$v.form.password.$touch()"
/>
</v-col>
</v-row>
@ -87,6 +92,7 @@
<script lang="ts">
import Vue from 'vue'
import {email, required} from "vuelidate/lib/validators";
const cookieLocale = 'locale'
@ -104,6 +110,12 @@ export default Vue.extend({
locales: this.$i18n.availableLocales.map((x: any) => ({text: this.$i18n.t('common.locale_name', x), value: x})),
}
},
validations: {
form: {
login: {required, email},
password: {required},
},
},
computed: {
logoWidth(): number {
let l = 100
@ -121,7 +133,6 @@ export default Vue.extend({
return l / (this.unclaimed ? 2 : 1)
},
locale: {
get: function (): string {
return this.$i18n.locale
@ -139,43 +150,61 @@ export default Vue.extend({
this.getClaimStatus()
},
methods: {
getErrors(fieldName: string): string[] {
const errors = [] as string[]
const field = this.$v.form!![fieldName] as any
if (field && field.$invalid && field.$dirty) {
if (!field.required) errors.push(this.$t('common.required').toString())
if (!field.email) errors.push(this.$t('dialog.add_user.field_email_error').toString())
}
return errors
},
async getClaimStatus() {
this.unclaimed = !(await this.$komgaClaim.getClaimStatus()).isClaimed
},
async performLogin() {
try {
await this.$store.dispatch(
'getMeWithAuth',
{
login: this.form.login,
password: this.form.password,
})
if (this.isUserValid()) {
try {
await this.$store.dispatch(
'getMeWithAuth',
{
login: this.form.login,
password: this.form.password,
})
await this.$store.dispatch('getLibraries')
await this.$store.dispatch('getLibraries')
if (this.$route.query.redirect) {
await this.$router.push({path: this.$route.query.redirect.toString()})
} else {
await this.$router.push({name: 'home'})
if (this.$route.query.redirect) {
await this.$router.push({path: this.$route.query.redirect.toString()})
} else {
await this.$router.push({name: 'home'})
}
} catch (e) {
this.showSnack(e?.message)
}
} catch (e) {
this.showSnack(e?.message)
}
},
showSnack(message: string) {
this.snackText = message
this.snackbar = true
},
isUserValid(): boolean {
this.$v.$touch()
return !this.$v.$invalid;
},
async claim() {
try {
await this.$komgaClaim.claimServer({
email: this.form.login,
password: this.form.password,
} as ClaimAdmin)
if (this.isUserValid()) {
try {
await this.$komgaClaim.claimServer({
email: this.form.login,
password: this.form.password,
} as ClaimAdmin)
await this.performLogin()
} catch (e) {
this.showSnack(e.message)
await this.performLogin()
} catch (e) {
this.showSnack(e.message)
}
}
},
},