48 lines
1.3 KiB
Vue
48 lines
1.3 KiB
Vue
<template>
|
|
<Box :box-class="'box'" padding="closed">
|
|
<User :user="userStore.userInfo" />
|
|
<div class="user-action">
|
|
<IconAction title="Paramètres" icon="fa-solid fa-gear" @click="userSettings.open()"/>
|
|
<IconAction title="Déconnexion" color="red" icon="fa-solid fa-right-from-bracket" @click="signOut(router)"/>
|
|
</div>
|
|
<!-- Paramètres : thème, comptes connectés (YouTube), support, confidentialité, accès à l'administration -->
|
|
<UserSettings ref="userSettings"/>
|
|
</Box>
|
|
</template>
|
|
<script setup>
|
|
import Box from '../UI/Box.vue';
|
|
import IconAction from '../UI/IconAction.vue';
|
|
import User from '../UI/User.vue';
|
|
import { signOut } from '@/utils/UserRequest';
|
|
import { useRouter } from 'vue-router';
|
|
import { socket } from '@/socket.js';
|
|
|
|
if(!socket.connected) {
|
|
socket.connect();
|
|
}
|
|
|
|
import { useUserStore } from '@/stores/userStore';
|
|
import UserSettings from '../Widget/User/UserSettings.vue';
|
|
import { ref } from 'vue';
|
|
const userStore = useUserStore();
|
|
const router = useRouter();
|
|
|
|
const userSettings = ref(null);
|
|
|
|
</script>
|
|
<style scoped>
|
|
.box {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
flex-direction: row;
|
|
gap: 30px;
|
|
}
|
|
.user-action {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 15px;
|
|
}
|
|
|
|
|
|
</style> |