tobias/lrc-frontend
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

added oldLogin.vue to modify Login.vue

Browse Source
This commit is contained in:
Tobias Kurze
2020-07-24 16:46:31 +02:00
parent d3df9d5a30
commit f701797639
15 changed files with 21477 additions and 20110 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3375
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

8
package.json
View File

@@ -17,10 +17,10 @@
"bootstrap": "^4.3.1",
"bootstrap-vue": "^2.0.0-rc.15",
"i": "^0.3.6",
"jquery": "^3.4.1",
"jquery": "^3.5.1",
"js-cookie": "^2.2.0",
"node-sass": "^4.13.0",
"npm": "^6.13.1",
"node-sass": "^4.14.1",
"npm": "^6.14.7",
"npm-sass": "^2.3.0",
"popper.js": "^1.15.0",
"sass": "^1.26.10",
@@ -32,7 +32,7 @@
"vue-cookies": "^1.5.13",
"vue-flag-icon": "^1.0.6",
"vue-i18n": "^8.9.0",
"vue-moment": "^4.0.0",
"vue-moment": "^4.1.0",
"vue-property-decorator": "^7.0.0",
"vue-router": "^3.0.1",
"vue-socket.io-extended": "^4.0.1",

25
src/components/Login.vue
View File

@@ -9,23 +9,18 @@
<p class="subtitle error-msg">{{ errorMsg }}</p>
</div>
</div>
<ul>
<li v-for="(provider, index) in loginProviders" v-bind:id="index">
<a :href="provider.url">{{ index }} ({{provider.type}})</a>
</li>
</ul>
<h3>Users</h3>
<ul>
<li v-for="(user) in users">
<a href="#">({{user.id}}) {{user.first_name}}</a>
</li>
</ul>
<button v-on:click="oidc_login">Login via OIDC</button>
<a href="http://localhost:5443/api/auth/oidc?redirect_url=/login">OIDC with redirect</a>
</section>
<section class="section">
<div class="container">
<ul>
<li v-for="(provider, index) in loginProviders" v-bind:id="index">
<a :href="provider.url">{{ index }} ({{provider.type}})</a>
</li>
</ul>
<button v-on:click="oidc_login">Login via OIDC</button>
<a href="http://localhost:5443/api/auth/oidc?redirect_url=/login">OIDC with redirect</a>
<div class="field">
<label class="label is-large" for="email">Email:</label>
<div class="control">

153
src/components/OldLogin.vue Normal file
View File

@@ -0,0 +1,153 @@
<!-- components/Login.vue -->
<template>
<div>
<div v-if="!authenticated">
<section class="hero is-primary">
<div class="hero-body">
<div class="container has-text-centered">
<h2 class="title">Login or Register</h2>
<p class="subtitle error-msg">{{ errorMsg }}</p>
</div>
</div>
<ul>
<li v-for="(provider, index) in loginProviders" v-bind:id="index">
<a :href="provider.url">{{ index }} ({{provider.type}})</a>
</li>
</ul>
<h3>Users</h3>
<ul>
<li v-for="(user) in users">
<a href="#">({{user.id}}) {{user.first_name}}</a>
</li>
</ul>
<button v-on:click="oidc_login">Login via OIDC</button>
<a href="http://localhost:5443/api/auth/oidc?redirect_url=/login">OIDC with redirect</a>
</section>
<section class="section">
<div class="container">
<div class="field">
<label class="label is-large" for="email">Email:</label>
<div class="control">
<input type="email" class="input is-large" id="email" v-model="email">
</div>
</div>
<div class="field">
<label class="label is-large" for="password">Password:</label>
<div class="control">
<input type="password" class="input is-large" id="password" v-model="password">
</div>
</div>
<div class="control">
<a class="button is-large is-primary" @click="authenticate">Login</a>
<a class="button is-large is-success" @click="register">Register</a>
</div>
</div>
</section>
</div>
<div v-else>
<h1>{{ $t('You are already logged in!') }}</h1>
<h2>{{$t('Redirecting you to')}} <router-link :to="{name: redirectTarget}">{{redirectTarget}}</router-link> {{$t('in')}} {{redirectTime}} {{$t('seconds')}}.</h2>
<p><a href="" @click.prevent="logout()">{{$t('logout')}}</a></p>
</div>
</div>
</template>
<script>
import {EventBus} from '@/utils';
export default {
data() {
return {
email: '',
password: '',
errorMsg: '',
redirectMsg: '',
redirectTarget: 'profile',
redirectTime: 5,
loginProviders: [],
redirect_interval: null,
};
},
methods: {
authenticate() {
this.$store.dispatch('login', {email: this.email, password: this.password})
.then(() => this.$router.push('/'));
},
register() {
this.$store.dispatch('register', {email: this.email, password: this.password})
.then(() => this.$router.push('/'));
},
oidc_login() {
this.$store.dispatch('oidc_login', '\\oidc_login_redirection');
},
logout() {
this.$store.dispatch('logout', {revokeRefreshToken: true});
this.$router.push({name: 'home'});
},
},
mounted() {
// this.$parent.$data.isLoading = true;
EventBus.$on('failedRegistering', (msg) => {
this.errorMsg = msg;
});
EventBus.$on('failedAuthentication', (msg) => {
this.errorMsg = msg;
});
EventBus.$on('loginProvidersLoaded', (providers) => {
this.loginProviders = providers;
});
EventBus.$on('storedTokens', () => {
this.$store.dispatch('loadUsers');
this.$store.dispatch('loadProfile');
});
this.$store.dispatch('loadLoginProviders');
// get tokens
if (this.$cookies.isKey('tokens')) {
this.$store.dispatch('storeTokens', JSON.parse(atob(this.$cookies.get('tokens'))));
this.$cookies.remove('tokens');
}
this.$log.debug(this.$cookies.keys());
this.$nextTick(() => {
if (this.authenticated) {
if (this.$route.query.redirectionTarget) {
this.redirectTarget = this.$route.query.redirectionTarget;
}
this.redirect_interval = window.setInterval(() => {
this.redirectTime = this.redirectTime - 1;
if (this.redirectTime < 0) {
clearInterval(this.redirect_interval);
this.$router.push({name: this.redirectTarget});
}
}, 1000);
}
});
},
beforeDestroy() {
clearInterval(this.redirect_interval);
EventBus.$off('failedRegistering');
EventBus.$off('failedAuthentication');
},
computed: {
users() {
return this.$store.state.users;
},
authenticated() {
return this.$store.getters.isAuthenticated;
},
},
};
</script>
<style lang="scss">
.error-msg {
color: red;
font-weight: bold;
}
</style>