66 lines
1.7 KiB
Vue
66 lines
1.7 KiB
Vue
<template>
|
|
<div>
|
|
<q-page
|
|
padding
|
|
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" />
|
|
<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"
|
|
:session="session"
|
|
/>
|
|
</div>
|
|
<div class="row">
|
|
<q-btn label="show sessions" @click="showRootGetters" />
|
|
</div>
|
|
</q-page>
|
|
</div>
|
|
</template>
|
|
|
|
<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';
|
|
import { Store } from 'vuex';
|
|
import { StateInterface } from 'src/store';
|
|
|
|
export default defineComponent({
|
|
// name: 'PageName'
|
|
components: { CircularProgress, Sessions, Main },
|
|
setup(_, { root }) {
|
|
const store = <Store<StateInterface>>root.$store;
|
|
|
|
onBeforeMount(() => {
|
|
store.dispatch('sessions/getSessions').catch(error => {
|
|
console.warn(error);
|
|
});
|
|
});
|
|
const sessions = computed(() => store.state.sessions.sessions);
|
|
|
|
function showRootGetters() {
|
|
console.log(sessions.value);
|
|
}
|
|
|
|
const sessionsLoading = computed(() => store.state.sessions.loading);
|
|
|
|
return {
|
|
showRootGetters,
|
|
sessionsLoading,
|
|
sessions
|
|
};
|
|
}
|
|
});
|
|
</script>
|