47 lines
1.6 KiB
Vue
47 lines
1.6 KiB
Vue
<template>
|
|
<div v-auto-animate class="grid grid-cols-2 h-screen">
|
|
<div class="flex flex-col shadow-xl shadow-surface-950 overflow-y-hidden z-10">
|
|
<AppHeader title="Шальные сиськи 18+">
|
|
<template #right>
|
|
<PrimeButtonGroup class="ml-auto">
|
|
<PrimeButton
|
|
icon="pi pi-microphone" size="large" :severity="inputMuted ? 'contrast' : 'secondary'"
|
|
:outlined="!inputMuted" @click="toggleInput"
|
|
/>
|
|
<PrimeButton
|
|
icon="pi pi-headphones" size="large" :severity="outputMuted ? 'contrast' : 'secondary'"
|
|
:outlined="!outputMuted" @click="toggleOutput"
|
|
/>
|
|
</PrimeButtonGroup>
|
|
|
|
<PrimeButton icon="pi pi-cog" size="large" :text="!inPreferences" :severity="inPreferences ? 'contrast' : 'secondary'" @click="onClickPreferences" />
|
|
</template>
|
|
</AppHeader>
|
|
|
|
<div v-auto-animate class="p-3 overflow-y-auto flex-1 bg-surface-900 overflow-hidden divide-y divide-surface-800">
|
|
<ClientRow v-for="client of clients" :key="client.id" :client="client" />
|
|
</div>
|
|
</div>
|
|
|
|
<slot />
|
|
</div>
|
|
|
|
<PrimeBadge class="fixed top-3 right-3" severity="success" />
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { vAutoAnimate } from '@formkit/auto-animate'
|
|
|
|
const { clients, inputMuted, toggleInput, outputMuted, toggleOutput } = useApp()
|
|
|
|
const route = useRoute()
|
|
|
|
const inPreferences = computed(() => {
|
|
return route.name === 'Preferences'
|
|
})
|
|
|
|
function onClickPreferences() {
|
|
navigateTo(!inPreferences.value ? { name: 'Preferences' } : '/')
|
|
}
|
|
</script>
|