Split user directory views

This commit is contained in:
Johannes Zellner
2025-04-21 12:48:22 +02:00
parent 1d5bca7962
commit 3ec502d862
4 changed files with 29 additions and 16 deletions
+25 -8
View File
@@ -29,7 +29,9 @@ import ServicesView from './views/ServicesView.vue';
import SettingsView from './views/SettingsView.vue';
import SupportView from './views/SupportView.vue';
import SystemView from './views/SystemView.vue';
import UserDirectoryView from './views/UserDirectoryView.vue';
import UserDirectorySettingsView from './views/UserDirectorySettingsView.vue';
import UserDirectoryLdapProviderView from './views/UserDirectoryLdapProviderView.vue';
import UserDirectoryOpenIdProviderView from './views/UserDirectoryOpenIdProviderView.vue';
import UsersView from './views/UsersView.vue';
import VolumesView from './views/VolumesView.vue';
@@ -53,7 +55,9 @@ const VIEWS = {
SETTINGS: 'settings',
SUPPORT: 'support',
SYSTEM: 'system',
USER_DIRECTORY: 'user-directory',
USER_DIRECTORY_SETTINGS: 'user-directory-settings',
USER_DIRECTORY_LDAP_PROVIDER: 'user-directory-ldap-provider',
USER_DIRECTORY_OPENID_PROVIDER: 'user-directory-openid-provider',
USERS: 'users',
VOLUMES: 'volumes',
};
@@ -119,6 +123,7 @@ function onHashChange() {
activeSidebarItem.value = v;
if (activeSidebarItem.value.indexOf('email') === 0) activeSidebarGroup.value = 'email';
else if (activeSidebarItem.value.indexOf('user-directory') === 0) activeSidebarGroup.value = 'user-directory';
else activeSidebarGroup.value = '';
if (v === VIEWS.APPS) {
@@ -159,8 +164,12 @@ function onHashChange() {
view.value = VIEWS.SUPPORT;
} else if (v === VIEWS.SYSTEM && profile.value.isAtLeastAdmin) {
view.value = VIEWS.SYSTEM;
} else if (v === VIEWS.USER_DIRECTORY && profile.value.isAtLeastAdmin) {
view.value = VIEWS.USER_DIRECTORY;
} else if (v === VIEWS.USER_DIRECTORY_SETTINGS && profile.value.isAtLeastAdmin) {
view.value = VIEWS.USER_DIRECTORY_SETTINGS;
} else if (v === VIEWS.USER_DIRECTORY_LDAP_PROVIDER && profile.value.isAtLeastAdmin) {
view.value = VIEWS.USER_DIRECTORY_LDAP_PROVIDER;
} else if (v === VIEWS.USER_DIRECTORY_OPENID_PROVIDER && profile.value.isAtLeastAdmin) {
view.value = VIEWS.USER_DIRECTORY_OPENID_PROVIDER;
} else if (v === VIEWS.USERS && profile.value.isAtLeastUserManager) {
view.value = VIEWS.USERS;
} else if (v === VIEWS.VOLUMES && profile.value.isAtLeastAdmin) {
@@ -244,7 +253,7 @@ onMounted(async () => {
<div class="sidebar-item" v-show="profile.isAtLeastMailManager" @click="onToggleGroup('email')"><i class="fa fa-envelope fa-fw"></i>{{ $t('emails.title') }} <i class="collapse fa-solid fa-angle-right" :class="{ expanded: activeSidebarGroup === 'email' }" style="margin-left: 6px;"></i> </div>
<Transition name="sidebar-item-group-animation">
<div class="sidebar-item-group" v-if="activeSidebarGroup === 'email'">
<a class="sidebar-item" :class="{ active: activeSidebarItem === 'email-domain' }" href="#/email-domain" @click="onSidebarClose()"><i class="fa fa-fw fa-wrench"></i> Domains</a>
<a class="sidebar-item" :class="{ active: activeSidebarItem === 'email-domain' }" href="#/email-domain" @click="onSidebarClose()"><i class="fa fa-fw fa-globe"></i> Domains</a>
<a class="sidebar-item" :class="{ active: activeSidebarItem === 'email-mailboxes' }" href="#/email-mailboxes" @click="onSidebarClose()"><i class="fa fa-fw fa-inbox"></i> {{ $t('email.incoming.mailboxes.title') }}</a>
<a class="sidebar-item" :class="{ active: activeSidebarItem === 'email-mailinglists' }" href="#/email-mailinglists" @click="onSidebarClose()"><i class="fa fa-fw-solid fa-envelopes-bulk"></i> {{ $t('email.incoming.mailinglists.title') }}</a>
<a class="sidebar-item" :class="{ active: activeSidebarItem === 'email-eventlog' }" href="#/email-eventlog" @click="onSidebarClose()"><i class="fa fa-fw fa-list-alt"></i> Logs</a>
@@ -256,8 +265,14 @@ onMounted(async () => {
<a class="sidebar-item" :class="{ active: activeSidebarItem === 'network' }" v-show="profile.isAtLeastAdmin" href="#/network" @click="onSidebarClose()"><i class="fas fa-network-wired fa-fw"></i> {{ $t('network.title') }}</a>
<a class="sidebar-item" :class="{ active: activeSidebarItem === 'services' }" v-show="profile.isAtLeastAdmin" href="#/services" @click="onSidebarClose()"><i class="fa fa-cogs fa-fw"></i> {{ $t('services.title') }}</a>
<a class="sidebar-item" :class="{ active: activeSidebarItem === 'settings' }" v-show="profile.isAtLeastAdmin" href="#/settings" @click="onSidebarClose()"><i class="fa fa-wrench fa-fw"></i> {{ $t('settings.title') }}</a>
<!-- TODO split this in 3, settings, external ldap connector, directory server -->
<a class="sidebar-item" :class="{ active: activeSidebarItem === 'user-directory' }" v-show="profile.isAtLeastAdmin" href="#/user-directory" @click="onSidebarClose()"><i class="fa fa-users-gear fa-fw"></i> {{ $t('users.title') }}</a>
<div class="sidebar-item" v-show="profile.isAtLeastAdmin" @click="onToggleGroup('user-directory')"><i class="fa fa-users-gear fa-fw"></i>{{ $t('users.title') }} <i class="collapse fa-solid fa-angle-right" :class="{ expanded: activeSidebarGroup === 'user-directory' }" style="margin-left: 6px;"></i> </div>
<Transition name="sidebar-item-group-animation">
<div class="sidebar-item-group" v-if="activeSidebarGroup === 'user-directory'">
<a class="sidebar-item" :class="{ active: activeSidebarItem === 'user-directory-ldap-provider' }" href="#/user-directory-ldap-provider" @click="onSidebarClose()"><i class="fa fa-fw fa-users-rays"></i> {{ $t('users.exposedLdap.title') }}</a>
<a class="sidebar-item" :class="{ active: activeSidebarItem === 'user-directory-openid-provider' }" href="#/user-directory-openid-provider" @click="onSidebarClose()"><i class="fa fa-fw fa-brands fa-openid"></i> {{ $t('oidc.title') }}</a>
<a class="sidebar-item" :class="{ active: activeSidebarItem === 'user-directory-settings' }" href="#/user-directory-settings" @click="onSidebarClose()"><i class="fa fa-fw fa-cog"></i> {{ $t('settings.title') }}</a>
</div>
</Transition>
<a class="sidebar-item" :class="{ active: activeSidebarItem === 'volumes' }" v-show="profile.isAtLeastAdmin" href="#/volumes" @click="onSidebarClose()"><i class="fa fa-hdd fa-fw"></i> {{ $t('volumes.title') }}</a>
<a class="sidebar-item" :class="{ active: activeSidebarItem === 'system' }" v-show="profile.isAtLeastAdmin" href="#/system" @click="onSidebarClose()"><i class="fa fa-chart-area fa-fw"></i> {{ $t('system.title') }}</a>
</div>
@@ -287,7 +302,9 @@ onMounted(async () => {
<SettingsView v-else-if="view === VIEWS.SETTINGS" />
<SupportView v-else-if="view === VIEWS.SUPPORT" />
<SystemView v-else-if="view === VIEWS.SYSTEM" />
<UserDirectoryView v-else-if="view === VIEWS.USER_DIRECTORY" />
<UserDirectorySettingsView v-else-if="view === VIEWS.USER_DIRECTORY_SETTINGS" />
<UserDirectoryLdapProviderView v-else-if="view === VIEWS.USER_DIRECTORY_LDAP_PROVIDER" />
<UserDirectoryOpenIdProviderView v-else-if="view === VIEWS.USER_DIRECTORY_OPENID_PROVIDER" />
<UsersView v-else-if="view === VIEWS.USERS" />
<VolumesView v-else-if="view === VIEWS.VOLUMES" />
</Transition>