Files
chopin-frontend/src/components/Widget/View/Player/ActualChannel.vue

40 lines
996 B
Vue

<template>
<div class="channel-message">
<Tag color="var(--text-error)" v-if="!globalStore.currentChannel"><span class="tag-channel"><span>Vous</span> <span>êtes</span> déconnecté </span></Tag>
<Tag color="var(--text-success)" v-else><span class="tag-channel">Connecté <span>à </span> <Icon icon="fa-solid fa-volume-up"/> <span>{{ globalStore.currentChannel.name }}</span></span></Tag>
</div>
</template>
<script setup>
import { useGlobalStore } from '@/stores/globalStore';
import Tag from '@/components/UI/Tag.vue';
import { onMounted } from 'vue';
import { updateChannel } from '@/utils/Logic';
const globalStore = useGlobalStore();
onMounted(() => {
updateChannel()
})
</script>
<style scoped>
.channel-message {
display: flex;
flex-direction: column;
align-items: center;
gap: 5px;
}
.channel-message p {
margin: 0;
}
.tag-channel {
font-size: 1.2em;
display: flex;
align-items: center;
gap: 3px;
white-space: nowrap;
}
</style>