Updated Server Manager layout (#6158)

Signed-off-by: Alexander Platov <alexander.platov@hardcoreeng.com>
This commit is contained in:
Alexander Platov 2024-07-29 08:23:52 +03:00 committed by GitHub
parent 5d7e109398
commit 10fe399bd0
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -10,9 +10,13 @@
import ServerManagerGeneral from './ServerManagerGeneral.svelte'
import { getEmbeddedLabel } from '@hcengineering/platform'
import { Panel, TabItem, TabList } from '@hcengineering/ui'
import { createEventDispatcher } from 'svelte'
import presentation from '@hcengineering/presentation'
import { Header, TabItem, Switcher, Breadcrumb, IconSettings, ButtonIcon, IconClose } from '@hcengineering/ui'
import ServerManagerAccountStatistics from './ServerManagerAccountStatistics.svelte'
const dispatch = createEventDispatcher()
const tabs: TabItem[] = [
{
id: 'general',
@ -42,35 +46,46 @@
let selectedTab: string | number = tabs[0].id
</script>
<Panel on:close isFullSize useMaxWidth={true}>
<svelte:fragment slot="title">
<span class="p-3"> Server manager </span>
<TabList
items={tabs}
bind:selected={selectedTab}
kind={'separated'}
on:select={(result) => {
selectedTab = result.detail.id
}}
/>
</svelte:fragment>
{#if selectedTab === 'general'}
<ServerManagerGeneral />
{:else if selectedTab === 'users'}
<ServerManagerUsers />
{:else if selectedTab === 'statistics'}
<ServerManagerServerStatistics />
{:else if selectedTab === 'statistics-front'}
<ServerManagerFrontStatistics />
{:else if selectedTab === 'statistics-collab'}
<ServerManagerCollaboratorStatistics />
{:else if selectedTab === 'account'}
<ServerManagerAccountStatistics />
{/if}
</Panel>
<div class="hulyComponent">
<Header type={'type-panel'} freezeBefore>
<svelte:fragment slot="beforeTitle">
<ButtonIcon
icon={IconClose}
kind={'secondary'}
size={'small'}
tooltip={{ label: presentation.string.Close }}
on:click={() => dispatch('close')}
/>
</svelte:fragment>
<style lang="scss">
.greyed {
color: rgba(black, 0.5);
}
</style>
<Breadcrumb icon={IconSettings} title={'Server manager'} size={'large'} isCurrent />
<svelte:fragment slot="actions">
<Switcher
name={'swManagerMode'}
items={tabs}
bind:selected={selectedTab}
kind={'subtle'}
on:select={(result) => {
selectedTab = result.detail.id
}}
/>
</svelte:fragment>
</Header>
<div class="hulyComponent-content__column content">
{#if selectedTab === 'general'}
<ServerManagerGeneral />
{:else if selectedTab === 'users'}
<ServerManagerUsers />
{:else if selectedTab === 'statistics'}
<ServerManagerServerStatistics />
{:else if selectedTab === 'statistics-front'}
<ServerManagerFrontStatistics />
{:else if selectedTab === 'statistics-collab'}
<ServerManagerCollaboratorStatistics />
{:else if selectedTab === 'account'}
<ServerManagerAccountStatistics />
{/if}
</div>
</div>