Changeset View
Changeset View
Standalone View
Standalone View
src/resources/vue/Login.vue
| Show All 22 Lines | <div class="container d-flex flex-column align-items-center justify-content-center"> | ||||
| <label for="secondfactor" class="visually-hidden">{{ $t('login.2fa') }}</label> | <label for="secondfactor" class="visually-hidden">{{ $t('login.2fa') }}</label> | ||||
| <div class="input-group"> | <div class="input-group"> | ||||
| <span class="input-group-text"><svg-icon icon="key"></svg-icon></span> | <span class="input-group-text"><svg-icon icon="key"></svg-icon></span> | ||||
| <input type="text" id="secondfactor" class="form-control rounded-end" :placeholder="$t('login.2fa')" v-model="secondfactor"> | <input type="text" id="secondfactor" class="form-control rounded-end" :placeholder="$t('login.2fa')" v-model="secondfactor"> | ||||
| </div> | </div> | ||||
| <small class="text-muted mt-2">{{ $t('login.2fa_desc') }}</small> | <small class="text-muted mt-2">{{ $t('login.2fa_desc') }}</small> | ||||
| </div> | </div> | ||||
| <div class="text-center"> | <div class="text-center"> | ||||
| <btn class="btn-primary" type="submit" icon="right-to-bracket">{{ $t('login.sign_in') }}</btn> | <btn class="btn-primary" type="submit" icon="right-to-bracket" :is-loading="loading"> | ||||
| {{ $t(loading ? 'login.signing_in' : 'login.sign_in') }} | |||||
| </btn> | |||||
| </div> | </div> | ||||
| </form> | </form> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| <div id="logon-form-footer" class="mt-1"> | <div id="logon-form-footer" class="mt-1"> | ||||
| <router-link v-if="$root.isUser && $root.hasRoute('password-reset')" :to="{ name: 'password-reset' }" id="forgot-password">{{ $t('login.forgot_password') }}</router-link> | <router-link v-if="$root.isUser && $root.hasRoute('password-reset')" :to="{ name: 'password-reset' }" id="forgot-password">{{ $t('login.forgot_password') }}</router-link> | ||||
| <a v-if="webmailURL && $root.isUser" :href="webmailURL" id="webmail">{{ $t('login.webmail') }}</a> | <a v-if="webmailURL && $root.isUser" :href="webmailURL" id="webmail">{{ $t('login.webmail') }}</a> | ||||
| Show All 14 Lines | export default { | ||||
| props: { | props: { | ||||
| dashboard: { type: Boolean, default: true } | dashboard: { type: Boolean, default: true } | ||||
| }, | }, | ||||
| data() { | data() { | ||||
| return { | return { | ||||
| email: '', | email: '', | ||||
| password: '', | password: '', | ||||
| secondfactor: '', | secondfactor: '', | ||||
| webmailURL: window.config['app.webmail_url'] | webmailURL: window.config['app.webmail_url'], | ||||
| loading: false | |||||
| } | } | ||||
| }, | }, | ||||
| methods: { | methods: { | ||||
| submitLogin() { | submitLogin() { | ||||
| this.$root.clearFormValidation($('form.form-signin')) | this.$root.clearFormValidation($('form.form-signin')) | ||||
| const post = this.$root.pick(this, ['email', 'password', 'secondfactor']) | const post = this.$root.pick(this, ['email', 'password', 'secondfactor']) | ||||
| this.loading = true | |||||
| axios.post('/api/auth/login', post) | axios.post('/api/auth/login', post) | ||||
| .then(response => { | .then(response => { | ||||
| // login user and redirect to dashboard | // login user and redirect to dashboard | ||||
| this.$root.loginUser(response.data, this.dashboard) | this.$root.loginUser(response.data, this.dashboard) | ||||
| this.$emit('success') | this.$emit('success') | ||||
| }) | }) | ||||
| .catch(e => {}) | .catch(() => {}) | ||||
| .finally(() => { | |||||
| this.loading = false | |||||
| }) | |||||
| } | } | ||||
| } | } | ||||
| } | } | ||||
| </script> | </script> | ||||