Add initial placeholder page for email domains list

This commit is contained in:
Johannes Zellner
2025-09-23 21:08:48 +02:00
parent aefe69c4b5
commit 9146e2a318
3 changed files with 46 additions and 8 deletions

View File

@@ -22,6 +22,7 @@ import BackupListView from './views/BackupListView.vue';
import CloudronAccountView from './views/CloudronAccountView.vue';
import DomainsView from './views/DomainsView.vue';
import EmailDomainView from './views/EmailDomainView.vue';
import EmailDomainsView from './views/EmailDomainsView.vue';
import EmailMailboxesView from './views/EmailMailboxesView.vue';
import EmailMailinglistsView from './views/EmailMailinglistsView.vue';
import EmailSettingsView from './views/EmailSettingsView.vue';
@@ -53,6 +54,7 @@ const VIEWS = {
CLOUDRON_ACCOUNT: 'cloudron-account',
DOMAINS: 'domains',
EMAIL_DOMAIN: 'email-domain',
EMAIL_DOMAINS: 'email-domains',
EMAIL_MAILBOXES: 'email-mailboxes',
EMAIL_MAILINGLISTS: 'email-mailinglists',
EMAIL_SETTINGS: 'email-settings',
@@ -158,8 +160,10 @@ function onHashChange() {
view.value = VIEWS.CLOUDRON_ACCOUNT;
} else if (v === VIEWS.DOMAINS && profile.value.isAtLeastAdmin) {
view.value = VIEWS.DOMAINS;
} else if (v === VIEWS.EMAIL_DOMAIN && profile.value.isAtLeastMailManager) {
} else if (v.indexOf(VIEWS.EMAIL_DOMAIN+'/') === 0 && profile.value.isAtLeastMailManager) {
view.value = VIEWS.EMAIL_DOMAIN;
} else if (v === VIEWS.EMAIL_DOMAINS && profile.value.isAtLeastMailManager) {
view.value = VIEWS.EMAIL_DOMAINS;
} else if (v === VIEWS.EMAIL_MAILBOXES && profile.value.isAtLeastMailManager) {
view.value = VIEWS.EMAIL_MAILBOXES;
} else if (v === VIEWS.EMAIL_MAILINGLISTS && profile.value.isAtLeastMailManager) {
@@ -297,7 +301,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-globe"></i> Domains</a>
<a class="sidebar-item" :class="{ active: activeSidebarItem === 'email-domains' }" href="#/email-domains" @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> {{ $t('emails.eventlog.title') }}</a>
@@ -359,6 +363,7 @@ onMounted(async () => {
<BackupAppArchiveView v-else-if="view === VIEWS.BACKUP_APP_ARCHIVE" />
<CloudronAccountView v-else-if="view === VIEWS.CLOUDRON_ACCOUNT" />
<DomainsView v-else-if="view === VIEWS.DOMAINS" />
<EmailDomainsView v-else-if="view === VIEWS.EMAIL_DOMAINS" />
<EmailDomainView v-else-if="view === VIEWS.EMAIL_DOMAIN" />
<EmailMailboxesView v-else-if="view === VIEWS.EMAIL_MAILBOXES" />
<EmailMailinglistsView v-else-if="view === VIEWS.EMAIL_MAILINGLISTS" />

View File

@@ -5,7 +5,7 @@ const i18n = useI18n();
const t = i18n.t;
import { ref, onMounted, useTemplateRef, inject } from 'vue';
import { Button, Checkbox, InputDialog, Dialog, FormGroup, Switch, SingleSelect } from '@cloudron/pankow';
import { Button, Checkbox, InputDialog, Dialog, FormGroup, Switch } from '@cloudron/pankow';
import { prettyDecimalSize, sleep } from '@cloudron/pankow/utils';
import Section from '../components/Section.vue';
import SettingsItem from '../components/SettingsItem.vue';
@@ -26,7 +26,6 @@ const features = inject('features');
const inputDialog = useTemplateRef('inputDialog');
const enableIncomingDialog = useTemplateRef('enableIncomingDialog');
const connectionDialog = useTemplateRef('connectionDialog');
const domains = ref([]);
const domain = ref('');
const domainProvider = ref('');
const mailConfig = ref({});
@@ -208,6 +207,14 @@ async function onDomainChanged() {
}
onMounted(async () => {
const tmp = window.location.hash.slice('#/email-domain/'.length);
if (!tmp) return;
const parts = tmp.split('/');
if (parts.length !== 1) return;
domain.value = parts[0];
let [error, result] = await dashboardModel.config();
if (error) return console.error(error);
@@ -221,9 +228,6 @@ onMounted(async () => {
[error, result] = await domainsModel.list();
if (error) return console.error(error);
domains.value = result;
domain.value = domains.value[0].domain;
await onDomainChanged();
});
@@ -298,7 +302,6 @@ onMounted(async () => {
<Section :title="$t('email.config.title', { domain: domain })">
<template #header-buttons>
<SingleSelect v-if="domains.length" v-model="domain" :options="domains" option-key="domain" option-label="domain" @select="onDomainChanged"/>
<Button secondary tool icon="fa-solid fa-book" v-tooltip="$t('app.docsActionTooltip')" :menu="infoMenu" />
</template>

View File

@@ -0,0 +1,30 @@
<script setup>
import { ref, onMounted } from 'vue';
import Section from '../components/Section.vue';
import DomainsModel from '../models/DomainsModel.js';
const domainsModel = DomainsModel.create();
const domains = ref([]);
onMounted(async () => {
const [error, result] = await domainsModel.list();
if (error) return console.error(error);
domains.value = result;
});
</script>
<template>
<div class="content">
<Section :title="$t('email.config.title')">
<div>
<div v-for="domain in domains" :key="domain.domain">
<a :href="`#/email-domain/${domain.domain}`">{{ domain.domain }}</a>
</div>
</div>
</Section>
</div>
</template>