60 lines
1.2 KiB
Vue
60 lines
1.2 KiB
Vue
<script setup>
|
|
import { useAuthStore } from '@/stores/authStore.js'
|
|
import { computed, onMounted, ref } from 'vue'
|
|
import { convertIso } from '@/services/convertTime.js'
|
|
|
|
const store = useAuthStore()
|
|
|
|
const currentSession = ref(null)
|
|
|
|
onMounted(() => {
|
|
store.currentSession().then((data) => {
|
|
currentSession.value = data
|
|
})
|
|
})
|
|
|
|
const formattedDate = computed(() => {
|
|
const expires = currentSession?.value?.expires
|
|
|
|
if (!expires) {
|
|
return '---'
|
|
}
|
|
|
|
try {
|
|
return convertIso(expires)
|
|
} catch (error) {
|
|
console.log(error, expires);
|
|
return '---';
|
|
}
|
|
});
|
|
|
|
const onLogout = () => {
|
|
store.logout()
|
|
}
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<n-card :bordered="false" title="Session">
|
|
<n-list hoverable clickable>
|
|
<n-list-item>
|
|
<n-thing title="Session id" content-style="margin-top: 10px;">
|
|
{{ currentSession?.uuid || '---' }}
|
|
</n-thing>
|
|
</n-list-item>
|
|
|
|
<n-list-item>
|
|
<n-thing title="Expires at" content-style="margin-top: 10px;">
|
|
{{ formattedDate }}
|
|
</n-thing>
|
|
</n-list-item>
|
|
<div class="button-container-center">
|
|
<n-button type="info" class="center-button" @click="onLogout">Log out</n-button>
|
|
</div>
|
|
</n-list>
|
|
</n-card>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|