UX: display text & html parts alongside raw email in incoming email modal

This commit is contained in:
Régis Hanol
2017-03-08 23:15:42 +01:00
parent dfd5b06c82
commit 00380d84c5
7 changed files with 144 additions and 19 deletions

View File

@@ -5,15 +5,39 @@ import IncomingEmail from 'admin/models/incoming-email';
// This controller handles displaying of raw email
export default Ember.Controller.extend(ModalFunctionality, {
rawEmail: "",
textPart: "",
htmlPart: "",
tab: "raw",
showRawEmail: Ember.computed.equal("tab", "raw"),
showTextPart: Ember.computed.equal("tab", "text_part"),
showHtmlPart: Ember.computed.equal("tab", "html_part"),
onShow() { this.send("displayRaw"); },
loadRawEmail(postId) {
return Post.loadRawEmail(postId)
.then(result => this.set("rawEmail", result.raw_email));
.then(result => this.setProperties({
"rawEmail": result.raw_email,
"textPart": result.text_part,
"htmlPart": result.html_part,
}));
},
loadIncomingRawEmail(incomingEmailId) {
return IncomingEmail.loadRawEmail(incomingEmailId)
.then(result => this.set("rawEmail", result.raw_email));
.then(result => this.setProperties({
"rawEmail": result.raw_email,
"textPart": result.text_part,
"htmlPart": result.html_part,
}));
},
actions: {
displayRaw() { this.set("tab", "raw"); },
displayTextPart() { this.set("tab", "text_part"); },
displayHtmlPart() { this.set("tab", "html_part"); }
}
});

View File

@@ -1,7 +1,45 @@
{{#d-modal-body title="raw_email.title" maxHeight="80%"}}
{{#if rawEmail}}
{{textarea value=rawEmail class="raw-email-textarea"}}
{{else}}
{{i18n 'raw_email.not_available'}}
{{/if}}
{{#d-modal-body title="raw_email.title" class="incoming-email-modal" maxHeight="80%"}}
<div class="incoming-email-tabs">
{{d-button action="displayRaw"
label="post.raw_email.displays.raw.button"
title="post.raw_email.displays.raw.title"
class=(if showRawEmail 'active')
}}
{{#if textPart}}
{{d-button action="displayTextPart"
label="post.raw_email.displays.text_part.button"
title="post.raw_email.displays.text_part.title"
class=(if showTextPart 'active')
}}
{{/if}}
{{#if htmlPart}}
{{d-button action="displayHtmlPart"
label="post.raw_email.displays.html_part.button"
title="post.raw_email.displays.html_part.title"
class=(if showHtmlPart 'active')
}}
{{/if}}
</div>
<div class="incoming-email-content">
{{#if showRawEmail}}
{{#if rawEmail}}
{{textarea value=rawEmail}}
{{else}}
{{i18n 'raw_email.not_available'}}
{{/if}}
{{/if}}
{{#if showTextPart}}
{{textarea value=textPart}}
{{/if}}
{{#if showHtmlPart}}
<div class="incoming-email-html-part">
{{{htmlPart}}}
</div>
{{/if}}
</div>
{{/d-modal-body}}