jjkiers/cloudron-box
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Separate emails and email view

Browse Source
This commit is contained in:
Johannes Zellner
2020-02-11 21:06:34 +01:00
parent 1392abe2c0
commit 132a375347
7 changed files with 243 additions and 158 deletions
Download Patch File Download Diff File Expand all files Collapse all files

103
src/views/email.html
View File

@@ -4,16 +4,16 @@
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Enable Email for {{selectedDomain.domain}}?</h4>
<h4 class="modal-title">Enable Email for {{domain.domain}}?</h4>
</div>
<div class="modal-body">
<div>This will configure Cloudron to receive emails for <b>{{selectedDomain.domain}}</b>. See the
<div>This will configure Cloudron to receive emails for <b>{{domain.domain}}</b>. See the
documentation for opening up the <a ng-href="{{ config.webServerOrigin }}/documentation/email/#required-ports" target="_blank">required ports</a>
for Cloudron Email.
</div>
<br/>
<div ng-show="selectedDomain.provider === 'noop' || selectedDomain.provider === 'manual'">
<div ng-show="domain.provider === 'noop' || domain.provider === 'manual'">
No DNS provider is setup. The DNS records listed in the Status tab have to be setup manually.<br/>
</div>
<div class="text-danger" ng-show="adminDomain.provider === 'cloudflare'">
@@ -21,7 +21,7 @@
This is required because Cloudflare does not proxy email.<br/><br/>
</div>
<div ng-hide="selectedDomain.provider === 'noop' || selectedDomain.provider === 'manual'">
<div ng-hide="domain.provider === 'noop' || domain.provider === 'manual'">
<p>
<label class="control-label">
<input type="checkbox" ng-model="incomingEmail.setupDns"> Setup Mail DNS records now
@@ -46,10 +46,10 @@
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Disable Email Server for {{selectedDomain.domain}}?</h4>
<h4 class="modal-title">Disable Email Server for {{domain.domain}}?</h4>
</div>
<div class="modal-body">
<div>This will configure Cloudron to stop receiving emails for <b>{{selectedDomain.domain}}</b>. Mailboxes and lists associated with this
<div>This will configure Cloudron to stop receiving emails for <b>{{domain.domain}}</b>. Mailboxes and lists associated with this
domain will not be deleted.
</div>
<br/>
@@ -79,7 +79,7 @@
</div>
<div class="input-group form-inline" style="margin-top: 10px;">
<input type="text" class="form-control" ng-model="mailboxes.add.name" placeholder="Name" required autofocus autocomplete="off"/>
<div class="input-group-addon">@{{ selectedDomain.domain }}</div>
<div class="input-group-addon">@{{ domain.domain }}</div>
</div>
</div>
<div class="form-group">
@@ -102,7 +102,7 @@
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Edit mailbox {{ mailboxes.edit.name }}@{{selectedDomain.domain}}</h4>
<h4 class="modal-title">Edit mailbox {{ mailboxes.edit.name }}@{{domain.domain}}</h4>
</div>
<div class="modal-body">
<form name="mailboxedit_form" role="form" ng-submit="mailboxes.edit.submit()" autocomplete="off">
@@ -118,7 +118,7 @@
</div>
<div class="input-group form-inline" style="margin-top: 10px;">
<tag-input class="form-group form-control" placeholder="Add alias" taglist="mailboxes.edit.aliases" name="aliases"></tag-input>
<div class="input-group-addon">@{{ selectedDomain.domain }}</div>
<div class="input-group-addon">@{{ domain.domain }}</div>
</div>
</div>
<input class="hide" type="submit" ng-disabled="mailboxedit_form.$invalid || mailboxes.edit.busy || !mailboxes.edit.owner"/>
@@ -137,7 +137,7 @@
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Delete mailbox {{ mailboxes.remove.mailbox.name }}@{{selectedDomain.domain}}</h4>
<h4 class="modal-title">Delete mailbox {{ mailboxes.remove.mailbox.name }}@{{domain.domain}}</h4>
</div>
<div class="modal-body">
<p>After deletion, emails to this mailbox will bounce. Note that the mailbox data is not removed.</p>
@@ -165,7 +165,7 @@
<div class="control-label" ng-show="mailinglists.add.error.name"><small>{{ mailinglists.add.error.name }}</small></div>
<div class="input-group form-inline" style="margin-top: 10px;">
<input type="text" class="form-control" ng-model="mailinglists.add.name" placeholder="Name" required autofocus autocomplete="off"/>
<div class="input-group-addon">@{{ selectedDomain.domain }}</div>
<div class="input-group-addon">@{{ domain.domain }}</div>
</div>
</div>
<div class="form-group">
@@ -190,7 +190,7 @@
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Edit Mailing list {{ mailinglists.edit.name }}@{{selectedDomain.domain}}</h4>
<h4 class="modal-title">Edit Mailing list {{ mailinglists.edit.name }}@{{domain.domain}}</h4>
</div>
<div class="modal-body">
<form name="mailinglistedit_form" role="form" ng-submit="mailinglists.edit.submit()" autocomplete="off">
@@ -217,10 +217,10 @@
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Delete mailing list {{ mailinglists.remove.list.name }}@{{selectedDomain.domain}}</h4>
<h4 class="modal-title">Delete mailing list {{ mailinglists.remove.list.name }}@{{domain.domain}}</h4>
</div>
<div class="modal-body">
<p>Really delete mailinglist <b>{{ mailinglists.remove.list.name }}@{{selectedDomain.domain}}</b>?</p>
<p>Really delete mailinglist <b>{{ mailinglists.remove.list.name }}@{{domain.domain}}</b>?</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
@@ -242,7 +242,7 @@
<fieldset>
<p class="has-error text-center" ng-show="testEmail.error">{{ testEmail.error.generic }}</p>
<p>This will send a test email from no-reply@{{selectedDomain.domain}} to the address below.</p>
<p>This will send a test email from no-reply@{{domain.domain}} to the address below.</p>
<br/>
<div class="form-group" ng-class="{ 'has-error': testEmail.error.key }">
<label class="control-label" for="inputTestEmailKey">Email to</label>
@@ -268,13 +268,18 @@
</div>
<div class="content" ng-show="ready">
<a href="/#/email" class="back-to-view-link"><i class="fas fa-arrow-left"></i> Back to Email</a>
<br/>
<div class="text-left">
<h1>
Email
<select class="form-control pull-right" style="display: inline-block; width: 200px;" ng-model="selectedDomain" ng-options="a.domain for a in domains" ng-change="selectDomain()"></select>
</h1>
<h3>
Email configuration <b>{{ domain.domain }}</b>
</h3>
</div>
<br/>
<uib-tabset>
<uib-tab index="0" heading="Mailboxes">
<div class="card card-large" style="margin-bottom: 15px;">
@@ -288,12 +293,12 @@
to configure other email clients.
</div>
<div class="col-md-2">
<button ng-class="selectedDomain.mailConfig.enabled ? 'btn btn-danger' : 'btn btn-primary'" ng-click="selectedDomain.provider !== 'caas' && incomingEmail.toggleEmailEnabled()" ng-disabled="selectedDomain.provider === 'caas' || incomingEmail.busy">
<button ng-class="domain.mailConfig.enabled ? 'btn btn-danger' : 'btn btn-primary'" ng-click="domain.provider !== 'caas' && incomingEmail.toggleEmailEnabled()" ng-disabled="domain.provider === 'caas' || incomingEmail.busy">
<i class="fa fa-circle-notch fa-spin" ng-show="incomingEmail.busy"></i>
{{ selectedDomain.mailConfig.enabled ? "Disable" : "Enable" }}
{{ domain.mailConfig.enabled ? "Disable" : "Enable" }}
</button>
</div>
<div class="col-md-12" ng-show="selectedDomain.provider === 'caas'">
<div class="col-md-12" ng-show="domain.provider === 'caas'">
<br/>
<span class="text-danger text-bold">This feature is only available for custom domains.</span>
</div>
@@ -305,7 +310,7 @@
<p><b>Incoming Mail (IMAP)</b><br/>Server: <span ng-click-select>{{config.mailFqdn}}</span><br/>Port: 993 (TLS)</p>
<p><b>Outgoing Mail (SMTP)</b><br/>Server: <span ng-click-select>{{config.mailFqdn}}</span><br/>Port: 587 (STARTTLS)</p>
<p><b>ManageSieve</b><br/>Server: <span ng-click-select>{{config.mailFqdn}}</span><br/>Port: 4190 (STARTTLS)</p>
<p>Use <i>mailboxname</i>@{{ selectedDomain.domain }} and the mailbox owner password to access mailboxes of this domain</p>
<p>Use <i>mailboxname</i>@{{ domain.domain }} and the mailbox owner password to access mailboxes of this domain</p>
</div>
</div>
</div>
@@ -317,7 +322,7 @@
<div class="text-left">
<h3 style="margin-bottom: 15px;">Mailboxes
<button class="btn btn-primary btn-outline pull-right" ng-click="mailboxes.add.show()" ng-disabled="!selectedDomain.mailConfig.enabled" tooltip-enable="!selectedDomain.mailConfig.enabled" uib-tooltip="Email is disabled for this domain"><i class="fa fa-inbox"></i> New Mailbox</button>
<button class="btn btn-primary btn-outline pull-right" ng-click="mailboxes.add.show()" ng-disabled="!domain.mailConfig.enabled" tooltip-enable="!domain.mailConfig.enabled" uib-tooltip="Email is disabled for this domain"><i class="fa fa-inbox"></i> New Mailbox</button>
<input class="form-control pull-right" style="width: 200px;" placeholder="Search" type="text" ng-model="mailboxes.search"/>
</h3>
</div>
@@ -361,7 +366,7 @@
<div class="text-left">
<h3 style="margin-bottom: 15px;">Mailing Lists
<button class="btn btn-primary btn-outline pull-right" ng-click="mailinglists.add.show()" ng-disabled="!selectedDomain.mailConfig.enabled" tooltip-enable="!selectedDomain.mailConfig.enabled" uib-tooltip="Email is disabled for this domain"><i class="fa fa-list"></i> New Mailing list</button>
<button class="btn btn-primary btn-outline pull-right" ng-click="mailinglists.add.show()" ng-disabled="!domain.mailConfig.enabled" tooltip-enable="!domain.mailConfig.enabled" uib-tooltip="Email is disabled for this domain"><i class="fa fa-list"></i> New Mailing list</button>
<input class="form-control pull-right" style="width: 200px;" placeholder="Search" type="text" ng-model="mailinglists.search"/>
</h3>
</div>
@@ -417,8 +422,8 @@
<div class="row">
<div class="col-md-6">
<multiselect ng-model="catchall.mailboxes" options="mailbox.name for mailbox in mailboxes.mailboxes" data-compare-by="name" data-multiple="true" filter-after-rows="5" scroll-after-rows="10"></multiselect>
<button class="btn btn-outline btn-primary" ng-click="catchall.submit()" ng-disabled="catchall.busy || !selectedDomain.mailConfig.enabled"
tooltip-enable="!selectedDomain.mailConfig.enabled" uib-tooltip="Email is disabled for this domain">
<button class="btn btn-outline btn-primary" ng-click="catchall.submit()" ng-disabled="catchall.busy || !domain.mailConfig.enabled"
tooltip-enable="!domain.mailConfig.enabled" uib-tooltip="Email is disabled for this domain">
<i class="fa fa-circle-notch fa-spin" ng-show="catchall.busy"></i> Save
</button>
</div>
@@ -445,11 +450,11 @@
</div>
<p class="small text-danger" ng-show="mailRelay.preset.provider === 'noop'">
<span ng-if="selectedDomain.domain === config.adminDomain">
<span ng-if="domain.domain === config.adminDomain">
Cloudron cannot send user invites, password reset and other notifications when email is disabled on the primary domain
</span>
<span ng-if="selectedDomain.domain !== config.adminDomain">
Cloudron cannot email for apps hosted under this domain when email is disabled
<span ng-if="domain.domain !== config.adminDomain">
Cloudron cannot provide email sending for apps hosted under this domain when email is disabled
</span>
</p>
@@ -543,7 +548,7 @@
Masquerading allows users and apps to send emails with an arbitrary username in the FROM address
</div>
<div class="col-md-2">
<button ng-class="selectedDomain.mailConfig.mailFromValidation ? 'btn btn-danger' : 'btn btn-primary'" ng-click="toggleMailFromValidation()">{{ selectedDomain.mailConfig.mailFromValidation ? "Enable" : "Disable" }}</button>
<button ng-class="domain.mailConfig.mailFromValidation ? 'btn btn-danger' : 'btn btn-primary'" ng-click="toggleMailFromValidation()">{{ domain.mailConfig.mailFromValidation ? "Enable" : "Disable" }}</button>
</div>
</div>
</div>
@@ -551,7 +556,7 @@
<uib-tab index="3" heading="Status">
<!-- nothing to show if incoming mail is disabled and using a relay -->
<div class="card card-large" style="margin-bottom: 15px;" ng-hide="!selectedDomain.mailConfig.enabled && selectedDomain.mailConfig.relay.provider !== 'cloudron-smtp'">
<div class="card card-large" style="margin-bottom: 15px;" ng-hide="!domain.mailConfig.enabled && domain.mailConfig.relay.provider !== 'cloudron-smtp'">
<div class="row">
<div class="col-md-12">
<h4>DNS Status
@@ -575,7 +580,7 @@
</p>
<div id="collapse_dns_{{ record.value }}" class="panel-collapse collapse">
<div class="panel-body">
<p ng-show="record.name === 'MX' && selectedDomain.provider === 'namecheap'"><a ng-href="{{ config.webServerOrigin }}/documentation/domains/#namecheap-dns" target="_blank" class="btn btn-xs btn-danger">Namecheap requires manual steps for MX records</a></p>
<p ng-show="record.name === 'MX' && domain.provider === 'namecheap'"><a ng-href="{{ config.webServerOrigin }}/documentation/domains/#namecheap-dns" target="_blank" class="btn btn-xs btn-danger">Namecheap requires manual steps for MX records</a></p>
<p ng-show="expectedDnsRecords[record.value].name">Hostname: <b ng-click-select><tt>{{ expectedDnsRecords[record.value].name }}</tt></b></p>
<p ng-hide="expectedDnsRecords[record.value].name">Domain: <b ng-click-select><tt>{{ expectedDnsRecords[record.value].domain }}</tt></b></p>
<p>Record type: <b ng-click-select><tt>{{ expectedDnsRecords[record.value].type }}</tt></b></p>
@@ -590,7 +595,7 @@
</div>
</div>
<div class="card card-large" style="margin-bottom: 15px;" ng-if="selectedDomain.mailConfig.relay.provider !== 'noop'">
<div class="card card-large" style="margin-bottom: 15px;" ng-if="domain.mailConfig.relay.provider !== 'noop'">
<div class="row">
<div class="col-md-12">
<h4>SMTP Status <sup><a ng-href="{{ config.webServerOrigin }}/documentation/troubleshooting/#mail-smtp" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup></h4>
@@ -598,33 +603,33 @@
<div class="row">
<div class="col-xs-12">
<p class="text-muted">
<i ng-hide="refreshBusy" ng-class="selectedDomain.mailStatus.relay.status ? 'fa fa-check-circle text-success' : 'fa fa-exclamation-triangle text-danger'"></i> &nbsp;
<i ng-hide="refreshBusy" ng-class="domain.mailStatus.relay.status ? 'fa fa-check-circle text-success' : 'fa fa-exclamation-triangle text-danger'"></i> &nbsp;
<a href="" data-toggle="collapse" data-parent="#accordion" data-target="#collapse_outbound_smtp">
{{ selectedDomain.mailConfig.relay.provider === 'cloudron-smtp' ? 'Outbound SMTP (Direct)' : 'Outbound SMTP (Relay)' }}
{{ domain.mailConfig.relay.provider === 'cloudron-smtp' ? 'Outbound SMTP (Direct)' : 'Outbound SMTP (Relay)' }}
</a>
<button class="btn btn-xs btn-default" ng-click="refreshStatus()" ng-disabled="refreshBusy" ng-show="!selectedDomain.mailStatus.relay.status"><i class="fa fa-sync-alt" ng-class="{ 'fa-pulse': refreshBusy }"></i></button>
<button class="btn btn-xs btn-default" ng-click="refreshStatus()" ng-disabled="refreshBusy" ng-show="!domain.mailStatus.relay.status"><i class="fa fa-sync-alt" ng-class="{ 'fa-pulse': refreshBusy }"></i></button>
</p>
<div id="collapse_outbound_smtp" class="panel-collapse collapse">
<div class="panel-body">
<p><b> {{ selectedDomain.mailStatus.relay.value }} </b> </p>
<p><b> {{ domain.mailStatus.relay.value }} </b> </p>
</div>
</div>
</div>
</div>
<div class="row" ng-show="selectedDomain.mailConfig.relay.provider === 'cloudron-smtp'">
<div class="row" ng-show="domain.mailConfig.relay.provider === 'cloudron-smtp'">
<div class="col-xs-12">
<p class="text-muted">
<i ng-hide="refreshBusy" ng-class="selectedDomain.mailStatus.rbl.status ? 'fa fa-check-circle text-success' : 'fa fa-exclamation-triangle text-danger'"></i> &nbsp;
<i ng-hide="refreshBusy" ng-class="domain.mailStatus.rbl.status ? 'fa fa-check-circle text-success' : 'fa fa-exclamation-triangle text-danger'"></i> &nbsp;
<a href="" data-toggle="collapse" data-parent="#accordion" data-target="#collapse_rbl">
IP Address Blacklist Check
</a>
<button class="btn btn-xs btn-default" ng-click="refreshStatus()" ng-disabled="refreshBusy" ng-show="!selectedDomain.mailStatus.rbl.status"><i class="fa fa-sync-alt" ng-class="{ 'fa-pulse': refreshBusy }"></i></button>
<button class="btn btn-xs btn-default" ng-click="refreshStatus()" ng-disabled="refreshBusy" ng-show="!domain.mailStatus.rbl.status"><i class="fa fa-sync-alt" ng-class="{ 'fa-pulse': refreshBusy }"></i></button>
</p>
<div id="collapse_rbl" class="panel-collapse collapse">
<div class="panel-body">
<div>This server's IP {{ selectedDomain.mailStatus.rbl.ip }} is <b ng-hide="selectedDomain.mailStatus.rbl.servers.length">not</b> blacklisted.</div>
<div ng-repeat="server in selectedDomain.mailStatus.rbl.servers">
<div>This server's IP {{ domain.mailStatus.rbl.ip }} is <b ng-hide="domain.mailStatus.rbl.servers.length">not</b> blacklisted.</div>
<div ng-repeat="server in domain.mailStatus.rbl.servers">
<a ng-href="{{server.site}}" target="_blank">{{ server.name }}</a>
</div>
</div>
@@ -641,18 +646,6 @@
</div>
</div>
<div class="card card-large" style="margin-bottom: 15px;">
<div class="row">
<div class="col-md-12">
<h4>Email Server Logs</h4>
<p>
Logs are for all email domains on this Cloudron.
</p>
<a class="btn btn-primary" href="/logs.html?id=mail" target="_blank">Show Logs</a>
</div>
</div>
</div>
</uib-tab>
</uib-tabset>
</div>