Fixed MergeConflicts from 52dc3057ad

This commit is contained in:
Tim Gröger 2020-10-19 13:59:56 +02:00
parent 52dc3057ad
commit cb9ede5b27
4 changed files with 151 additions and 98 deletions

View File

@ -0,0 +1,15 @@
<template>
<q-card class="col-12">
<q-card-section class="text-h3">
Test
</q-card-section>
</q-card>
</template>
<script lang="ts">
import { defineComponent } from '@vue/composition-api';
export default defineComponent({
name: 'Main',
setup(_, ctx) {}
});
</script>

View File

@ -0,0 +1,83 @@
<template>
<q-card class="col-12" height="">
<q-card-section v-if="isThisSession(session.token)" class="text-caption">
Diese Session.
</q-card-section>
<q-card-section>
<div class="row">
<div class="col-xs-12 col-sm-6">
Browser:
<q-icon :name="getBrowserIcon(session.browser)" size="24px" />
{{ session.browser }}
</div>
<div class="col-xs-12 col-sm-6">
Plattform:
<q-icon :name="getPlatformIcon(session.platform)" size="24px" />
{{ session.platform }}
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-6">
Lebenszeit:
{{ session.lifetime }}
</div>
<div class="col-xs-12 col-sm-6">Läuft aus: {{ session.expires }}</div>
</div>
</q-card-section>
<q-card-actions align="right">
<q-btn
flat
round
dense
icon="mdi-delete"
@click="deleteSession(session.token)"
/>
</q-card-actions>
</q-card>
</template>
<script lang="ts">
import { computed, defineComponent } from '@vue/composition-api';
export default defineComponent({
name: 'Sessions',
props: {
session: {
required: true
}
},
setup(_, { root }) {
function getBrowserIcon(browser: string) {
return browser == 'firefox'
? 'mdi-firefox'
: browser == 'chrome'
? 'mdi-google-chrome'
: browser == 'safari'
? 'mdi-apple-safari'
: 'mdi-help';
}
function getPlatformIcon(platform: string) {
return platform == 'linux'
? 'mdi-linux'
: platform == 'windows'
? 'mdi-microsoft-windows'
: platform == 'apple'
? 'mdi-apple'
: 'mdi-help';
}
function deleteSession(token: string) {
root.$store.dispatch('sessions/deleteSession', token);
}
function isThisSession(token: string) {
return root.$store.getters['user/session'].token == token;
}
return {
getBrowserIcon,
getPlatformIcon,
isThisSession,
deleteSession
};
}
});
</script>

View File

@ -4,62 +4,22 @@
padding
class="fit row justify-center content-center items-center q-gutter-sm"
>
<div class="text-h5 row">
Deine Sessions:
</div>
<div class="fit row justify-center content-center items-center q-gutter-sm">
<div
class="fit row justify-center content-center items-center q-gutter-sm"
>
<circular-progress v-if="sessionsLoading" />
<q-card
class="col-12"
height=""
<div class="col-12 text-left text-h6">
Allgemeine Einstellungen:
</div>
<Main />
<div class="col-12 text-left text-h6">
Aktive Sessions:
</div>
<sessions
v-for="(session, index) in sessions"
:key="'session' + index"
>
<q-card-section
v-if="isThisSession(session.token)"
class="text-caption"
>
Diese Session.
</q-card-section>
<q-card-section>
<div class="row">
<div class="col-xs-12 col-sm-6">
Browser:
<q-icon
:name="getBrowserIcon(session.browser)"
size="24px"
:session="session"
/>
{{ session.browser }}
</div>
<div class="col-xs-12 col-sm-6">
Plattform:
<q-icon
:name="getPlatformIcon(session.platform)"
size="24px"
/>
{{ session.platform }}
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-6">
Lebenszeit:
{{ session.lifetime }}
</div>
<div class="col-xs-12 col-sm-6">
Läuft aus: {{ session.expires }}
</div>
</div>
</q-card-section>
<q-card-actions align="right">
<q-btn
flat
round
dense
icon="mdi-delete"
@click="deleteSession(session.token)"
/>
</q-card-actions>
</q-card>
</div>
<div class="row">
<q-btn
@ -74,44 +34,21 @@
<script lang="ts">
import { computed, defineComponent, onBeforeMount } from '@vue/composition-api';
import CircularProgress from 'components/loading/CircularProgress.vue';
import Sessions from '../components/settings/Sessions.vue';
import Main from '../components/settings/Main.vue';
export default defineComponent({
// name: 'PageName'
components: { CircularProgress },
components: { CircularProgress, Sessions, Main },
setup(_, { root }) {
onBeforeMount(() => {
root.$store.dispatch('sessions/getSessions');
});
const sessions = computed(() => root.$store.getters['sessions/sessions']);
function showRootGetters() {
//ctx.root.$store.dispatch('sessions/getSessions');
console.log(sessions.value);
}
function getBrowserIcon(browser: string) {
return browser == 'firefox'
? 'mdi-firefox'
: browser == 'chrome'
? 'mdi-google-chrome'
: browser == 'safari'
? 'mdi-apple-safari'
: 'mdi-help';
}
function getPlatformIcon(platform: string) {
return platform == 'linux'
? 'mdi-linux'
: platform == 'windows'
? 'mdi-microsoft-windows'
: platform == 'apple'
? 'mdi-apple'
: 'mdi-help';
}
function deleteSession(token: string) {
root.$store.dispatch('sessions/deleteSession', token);
}
function isThisSession(token: string) {
return root.$store.getters['user/session'].token == token;
}
const sessionsLoading = computed(() => {
return root.$store.getters['sessions/loading'];
@ -119,12 +56,8 @@ export default defineComponent({
return {
showRootGetters,
sessions,
getBrowserIcon,
getPlatformIcon,
isThisSession,
deleteSession,
sessionsLoading
sessionsLoading,
sessions
};
}
});

View File

@ -18,7 +18,11 @@ export interface LoginResponse {
const state: UserStateInterface = {
permissions: [],
session: {
browser: '', expires: new Date(), lifetime: -1, platform: '', token: '',
browser: '',
expires: new Date(),
lifetime: -1,
platform: '',
token: '',
user: {
display_name: '',
firstname: '',
@ -70,6 +74,18 @@ const actions: ActionTree<UserStateInterface, StateInterface> = {
Loading.hide();
});
},
logout({ commit }, token) {
void axios.delete(`/auth/${token}`).then(() => {
commit('setPermissions', []);
commit('setToken', {
browser: '',
expires: '',
lifetime: '',
platform: '',
token: ''
});
});
},
loadFromLocalStorage({ commit }) {
console.log('load from store');
let data = LocalStorage.getItem('permissions');
@ -79,7 +95,13 @@ const actions: ActionTree<UserStateInterface, StateInterface> = {
'setSession',
data
? data
: { browser: '', expires: new Date(), lifetime: -1, platform: '', token: '' }
: {
browser: '',
expires: new Date(),
lifetime: -1,
platform: '',
token: ''
}
);
commit('showState');
}
@ -95,7 +117,7 @@ const getters: GetterTree<UserStateInterface, StateInterface> = {
loginLoading({ loginLoading }) {
return loginLoading;
},
displayName({ user }) {
displayName({ session: { user } }) {
return `${user.firstname} ${user.lastname}`;
}
};