opti1337/chad
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects 1 Releases 17 Wiki Activity

update

Browse Source
This commit is contained in:
opti1337
2025-12-25 07:21:30 +06:00
parent 8265e2d719
commit 0f9a7e39ce
8 changed files with 135 additions and 98 deletions
Download Patch File Download Diff File Expand all files Collapse all files

88
client/app/layouts/default.vue
View File

@@ -1,54 +1,54 @@
<template>
<div class="grid grid-cols-2 h-screen">
<div class="flex flex-col shadow-xl shadow-surface-950 overflow-y-hidden">
<div
class="flex items-center justify-between gap-2 border-b-2 border-surface-800 px-3 py-3 bg-surface-950"
style="height: 75px;"
>
<div class="inline-flex items-center gap-3">
<PrimeBadge v-if="isTauri" class="opacity-50" severity="secondary" :value="version" size="small" />
<PrimeBadge :severity="connected ? 'success' : 'danger' " />
</div>
<PrimeButtonGroup class="ml-auto">
<PrimeButton outlined @click="toggleInput">
<template #icon>
<Component :is="inputMuted ? MicOff : Mic" />
</template>
</PrimeButton>
<PrimeButton outlined @click="toggleOutput">
<template #icon>
<Component :is="outputMuted ? VolumeOff : Volume2" />
</template>
</PrimeButton>
</PrimeButtonGroup>
<div class="grid grid-cols-2 gap-2 p-2 h-screen grid-rows-[auto_1fr]">
<div
class="flex items-center justify-between gap-2 rounded-xl p-3 bg-surface-950"
>
<div class="inline-flex items-center gap-3">
<PrimeBadge v-if="isTauri" class="opacity-50" severity="secondary" :value="version" size="small" />
<PrimeBadge :severity="connected ? 'success' : 'danger' " />
</div>
<div v-auto-animate class="p-3 overflow-y-auto flex-1 bg-surface-900 overflow-hidden divide-y divide-surface-800">
<PrimeButtonGroup class="ml-auto">
<PrimeButton outlined @click="toggleInput">
<template #icon>
<Component :is="inputMuted ? MicOff : Mic" />
</template>
</PrimeButton>
<PrimeButton outlined @click="toggleOutput">
<template #icon>
<Component :is="outputMuted ? VolumeOff : Volume2" />
</template>
</PrimeButton>
</PrimeButtonGroup>
</div>
<div
class="flex items-center justify-center rounded-xl p-3 bg-surface-950"
>
<PrimeSelectButton
v-model="activeTab"
:options="tabs"
data-key="id"
:allow-empty="false"
style="--p-togglebutton-content-padding: 0.25rem 0.5rem"
>
<template #option="{ option }">
<Component :is="option.icon" size="24" />
</template>
</PrimeSelectButton>
</div>
<PrimeScrollPanel class="bg-surface-900 rounded-xl" style="min-height: 0">
<div v-auto-animate class="p-3 divide-y divide-surface-800">
<ClientRow v-for="client of clients" :key="client.id" :client="client" />
</div>
</div>
</PrimeScrollPanel>
<div class="bg-surface-950 overflow-y-auto">
<div
class="flex items-center justify-center gap-2 border-b-2 border-surface-800 px-3 py-3 bg-surface-900"
style="height: 75px;"
>
<PrimeSelectButton
v-model="activeTab"
:options="tabs"
data-key="id"
:allow-empty="false"
style="--p-togglebutton-content-padding: 0.25rem 0.5rem"
>
<template #option="{ option }">
<Component :is="option.icon" size="24" />
</template>
</PrimeSelectButton>
<PrimeScrollPanel class="bg-surface-900 rounded-xl" style="min-height: 0">
<div class="p-3">
<slot />
</div>
<slot />
</div>
</PrimeScrollPanel>
</div>
</template>