From 0530069478608ca03411a9e55c0fa26015b2c221 Mon Sep 17 00:00:00 2001
From: Alex ORLUC <alex.orluc@maarch.org>
Date: Wed, 12 Feb 2020 14:35:43 +0100
Subject: [PATCH] FEAT #12072 TIME 2 front attach list email
---
.../sended-resource-list.component.scss | 2 +-
.../sended-resource-page.component.html | 46 ++++-
.../sended-resource-page.component.scss | 8 +-
.../sended-resource-page.component.ts | 159 +++++++++++++++---
4 files changed, 188 insertions(+), 27 deletions(-)
diff --git a/src/frontend/app/sendedResource/sended-resource-list.component.scss b/src/frontend/app/sendedResource/sended-resource-list.component.scss
index 5cbda1e3019..fd3455ed6b8 100644
--- a/src/frontend/app/sendedResource/sended-resource-list.component.scss
+++ b/src/frontend/app/sendedResource/sended-resource-list.component.scss
@@ -89,7 +89,7 @@
padding: 5px;
display: flex;
font-size: 10px;
- opacity: 0.5;
+ //opacity: 0.5;
width: 100%;
}
diff --git a/src/frontend/app/sendedResource/sended-resource-page/sended-resource-page.component.html b/src/frontend/app/sendedResource/sended-resource-page/sended-resource-page.component.html
index 20f1575db56..fc786c4f661 100644
--- a/src/frontend/app/sendedResource/sended-resource-page/sended-resource-page.component.html
+++ b/src/frontend/app/sendedResource/sended-resource-page/sended-resource-page.component.html
@@ -7,7 +7,7 @@
</button></h1>
<mat-dialog-content class="modal-container">
<mat-form-field>
- <span matPrefix>De : </span>
+ <span matPrefix class="attachLabel">De : </span>
<mat-select [(ngModel)]="currentSender">
<mat-option *ngFor="let email of availableSenders |Â sortBy: 'label'" [value]="email">
{{email.label}} ({{email.email}})
@@ -19,7 +19,7 @@
</mat-form-field>
<mat-form-field>
- <span matPrefix>À : </span>
+ <span matPrefix class="attachLabel">À : </span>
<mat-chip-list id="recipients-list" #recipientsList cdkDropList [cdkDropListConnectedTo]="['copies-list','invcopies-list']" [cdkDropListData]="recipients" (cdkDropListDropped)="drop($event)">
<mat-chip cdkDrag class="recipients" *ngFor="let recipient of recipients" [selectable]="selectable" removable
(removed)="remove(recipient, 'recipients')">
@@ -38,7 +38,7 @@
</mat-form-field>
<mat-form-field *ngIf="showCopies">
- <span matPrefix>Cc : </span>
+ <span matPrefix class="attachLabel">Cc : </span>
<mat-chip-list id="copies-list" #copiesList cdkDropList [cdkDropListConnectedTo]="['recipients-list','invcopies-list']" [cdkDropListData]="copies" (cdkDropListDropped)="drop($event)">
<mat-chip cdkDrag class="copy" *ngFor="let copy of copies" [selectable]="selectable" removable
(removed)="remove(copy, 'copies')">
@@ -57,7 +57,7 @@
</mat-form-field>
<mat-form-field *ngIf="showInvisibleCopies">
- <span matPrefix>Cci : </span>
+ <span matPrefix class="attachLabel">Cci : </span>
<mat-chip-list id="invcopies-list" #invCopiesList cdkDropList [cdkDropListConnectedTo]="['recipients-list','copies-list']" [cdkDropListData]="copies" (cdkDropListDropped)="drop($event)">
<mat-chip class="copy" *ngFor="let invCopy of invisibleCopies" [selectable]="selectable" removable
(removed)="remove(invCopy, 'invisibleCopies')">
@@ -75,8 +75,44 @@
</mat-autocomplete>
</mat-form-field>
<mat-form-field floatLabel="never">
- <input matInput placeholder="Sujet" [(ngModel)]="emailsubject">
+ <input matInput placeholder="Sujet" [(ngModel)]="emailsubject" maxlength="70">
+ <button mat-icon-button matSuffix (click)="$event.stopPropagation();" [matMenuTriggerFor]="mainDocListMenu">
+ <mat-icon class="fa fa-file" color="primary"></mat-icon>
+ </button>
+ <mat-menu #mainDocListMenu="matMenu">
+ <button mat-menu-item *ngFor="let doc of mainDocList" (click)="toggleAttachMail(doc,'maindocument','original')">{{doc.label}}</button>
+ </mat-menu>
+
+ <button mat-icon-button matSuffix (click)="$event.stopPropagation();" [matMenuTriggerFor]="notesListMenu">
+ <mat-icon class="fas fa-pen-square" color="primary"></mat-icon>
+ </button>
+ <mat-menu #notesListMenu="matMenu">
+ <button mat-menu-item *ngFor="let note of notesList" (click)="toggleAttachMail(note,'note','original')">{{note.label}}</button>
+ </mat-menu>
+ <button mat-icon-button matSuffix (click)="$event.stopPropagation();" [matMenuTriggerFor]="attachListMenu">
+ <mat-icon class="fa fa-paperclip" color="primary"></mat-icon>
+ </button>
+ <mat-menu #attachListMenu="matMenu">
+ <button mat-menu-item *ngFor="let attach of attachmentsList" (click)="toggleAttachMail(attach,'attachment','original')">{{attach.label}}</button>
+ </mat-menu>
</mat-form-field>
+ <mat-chip-list>
+ <mat-chip class="copy" *ngIf="emailAttach.document.isLinked" [selectable]="selectable" removable
+ (removed)="removeAttachMail(0, 'document')">
+ <i class="fa fa-file attachLabel"></i> {{emailAttach.document.label}}
+ <mat-icon matChipRemove class="fa fa-times"></mat-icon>
+ </mat-chip>
+ <mat-chip class="copy" *ngFor="let item of emailAttach.attachments; let i=index;" [selectable]="selectable" removable
+ (removed)="removeAttachMail(i, 'attachments')">
+ <i class="fa fa-paperclip attachLabel"></i> {{item.label}}
+ <mat-icon matChipRemove class="fa fa-times"></mat-icon>
+ </mat-chip>
+ <mat-chip class="copy" *ngFor="let item of emailAttach.notes; let i=index;" [selectable]="selectable" removable
+ (removed)="removeAttachMail(i, 'notes')">
+ <i class="fas fa-pen-square attachLabel"></i> {{item.label}}
+ <mat-icon matChipRemove class="fa fa-times"></mat-icon>
+ </mat-chip>
+ </mat-chip-list>
<div class="models">
<mat-form-field appearance="outline" style="font-size: 11px;">
<mat-label>Modèle(s) de mail</mat-label>
diff --git a/src/frontend/app/sendedResource/sended-resource-page/sended-resource-page.component.scss b/src/frontend/app/sendedResource/sended-resource-page/sended-resource-page.component.scss
index 089cc5dbd38..6505fb123db 100644
--- a/src/frontend/app/sendedResource/sended-resource-page/sended-resource-page.component.scss
+++ b/src/frontend/app/sendedResource/sended-resource-page/sended-resource-page.component.scss
@@ -7,8 +7,7 @@
.recipients,
.copy {
- font-size: 10px !important;
- font-size: 10px;
+ font-size: 12px !important;
padding: 5px !important;
min-height: auto;
height: auto;
@@ -25,9 +24,14 @@
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 20px;
+ padding-top: 10px;
}
.activeButton {
color: $secondary;
font-weight: bold;
+}
+
+.attachLabel {
+ color: $primary;
}
\ No newline at end of file
diff --git a/src/frontend/app/sendedResource/sended-resource-page/sended-resource-page.component.ts b/src/frontend/app/sendedResource/sended-resource-page/sended-resource-page.component.ts
index a56df623e01..50a013eb87b 100644
--- a/src/frontend/app/sendedResource/sended-resource-page/sended-resource-page.component.ts
+++ b/src/frontend/app/sendedResource/sended-resource-page/sended-resource-page.component.ts
@@ -25,6 +25,10 @@ export class SendedResourcePageComponent implements OnInit {
availableEmailModels: any[] = [];
availableSignEmailModels: any[] = [];
+ mainDocList: any[] = [];
+ notesList: any[] = [];
+ attachmentsList: any[] = [];
+
resourceData: any = null;
availableSenders: any[] = [];
currentSender: any = {};
@@ -52,12 +56,14 @@ export class SendedResourcePageComponent implements OnInit {
language: this.lang.langISO.replace('-', '_'),
language_url: `../../node_modules/tinymce-i18n/langs/${this.lang.langISO.replace('-', '_')}.js`,
menubar: false,
+ statusbar: false,
plugins: [
'autolink', 'autoresize'
],
external_plugins: {
'maarch_b64image': "../../src/frontend/plugins/tinymce/maarch_b64image/plugin.min.js"
},
+ toolbar_sticky: true,
toolbar_drawer: 'floating',
toolbar:
'undo redo | fontselect fontsizeselect | bold italic underline strikethrough forecolor | maarch_b64image | \
@@ -66,6 +72,14 @@ export class SendedResourcePageComponent implements OnInit {
}
emailsubject: string = '';
+ emailAttach: any = {
+ document: {
+ isLinked: false,
+ original: false
+ },
+ notes: [],
+ attachments: []
+ };
constructor(
public http: HttpClient,
@@ -77,7 +91,10 @@ export class SendedResourcePageComponent implements OnInit {
async ngOnInit(): Promise<void> {
+ this.emailAttach.document.id = this.data.resId;
+
this.loading = false;
+ this.getAttachElements();
this.getResourceData();
this.initEmailModelsList();
this.getUserEmails();
@@ -139,7 +156,22 @@ export class SendedResourcePageComponent implements OnInit {
this.http.post(`../../rest/templates/${templateId}/mergeEmail`, { data: { resId: this.data.resId } }).pipe(
tap((data: any) => {
- this.tinymceInput += data.mergedDocument;
+
+ var div = document.createElement('div');
+
+ div.innerHTML = this.tinymceInput.trim();
+
+ if (div.getElementsByClassName('signature').length > 0) {
+
+ const signatureContent = div.getElementsByClassName('signature')[0].innerHTML;
+
+ div.getElementsByClassName('signature')[0].remove();
+
+ this.tinymceInput = `${div.innerHTML}${data.mergedDocument}<div class="signature">${signatureContent}</div>`;
+
+ } else {
+ this.tinymceInput += data.mergedDocument;
+ }
}),
catchError((err) => {
this.notify.handleSoftErrors(err);
@@ -188,6 +220,7 @@ export class SendedResourcePageComponent implements OnInit {
tap((data: any) => {
this.resourceData = data;
this.emailsubject = `[${this.resourceData.chrono}] ${this.resourceData.subject}`;
+ this.emailAttach.document.label = this.resourceData.subject;
if (!this.functions.empty(this.resourceData.senders)) {
this.resourceData.senders.forEach((sender: any) => {
@@ -231,6 +264,49 @@ export class SendedResourcePageComponent implements OnInit {
).subscribe();
}
+ getAttachElements() {
+
+ this.mainDocList = [
+ {
+ id: 100,
+ label: 'Réservation Bal',
+ typeLabel: 'Document principal',
+ pdfVersion: 131,
+ creator: 'Bernard Blier',
+ size: '40ko'
+ }
+ ];
+ this.attachmentsList = [
+ {
+ id: 100,
+ label: 'je suis une pj',
+ typeLabel: 'Projet de réponse',
+ pdfVersion: 131,
+ creator: 'Bernard Blier',
+ size: '40ko'
+ },
+ {
+ id: 102,
+ label: 'je suis une pj 2',
+ typeLabel: 'Projet de réponse',
+ pdfVersion: 131,
+ creator: 'Bernard Blier',
+ size: '40ko'
+ }
+ ];
+
+ this.notesList = [
+ {
+ id: 100,
+ label: 'Je suis une note',
+ typeLabel: 'Note',
+ pdfVersion: null,
+ creator: 'Bernard Blier',
+ size: null
+ }
+ ];
+ }
+
initEmailsList() {
this.recipientsInput.valueChanges.pipe(
debounceTime(300),
@@ -243,7 +319,7 @@ export class SendedResourcePageComponent implements OnInit {
let label = '';
if (contact.type === 'user') {
label = `${contact.firstname} ${contact.lastname} (${contact.email})`;
- } else if(contact.type === 'contactGroup') {
+ } else if (contact.type === 'contactGroup') {
label = `${contact.firstname} ${contact.lastname}`;
} else {
label = `${contact.lastname} (${contact.email})`;
@@ -294,22 +370,9 @@ export class SendedResourcePageComponent implements OnInit {
}
onSubmit() {
- const data = {
- document: {
- id: this.data.resId,
- isLinked: false,
- original: false
- },
- sender: this.currentSender,
- recipients: this.recipients.map(recipient => recipient.email),
- cc: this.copies.map(copy => copy.email),
- cci: this.invisibleCopies.map((invCopy => invCopy.email)),
- object: this.emailsubject,
- body: this.tinymceInput,
- isHtml: true,
- status: 'WAITING'
- };
- this.http.post(`../../rest/emails`, data).pipe(
+ console.log(this.formatEmail());
+
+ /*this.http.post(`../../rest/emails`, this.formatEmail()).pipe(
tap(() => {
this.notify.success("Email en cours d'envoi...")
this.dialogRef.close('success');
@@ -318,7 +381,7 @@ export class SendedResourcePageComponent implements OnInit {
this.notify.handleSoftErrors(err);
return of(false);
})
- ).subscribe();
+ ).subscribe();*/
}
drop(event: CdkDragDrop<string[]>) {
@@ -330,4 +393,62 @@ export class SendedResourcePageComponent implements OnInit {
event.currentIndex);
}
}
+
+ toggleAttachMail(item: any, type: string, mode: string) {
+ if (type === 'maindocument') {
+ if (this.emailAttach.document.isLinked === false) {
+ this.emailAttach.document.isLinked = true;
+ this.emailAttach.document.original = mode === 'pdf' ? false : true;
+ }
+ } else if (type === 'attachment') {
+ if (this.emailAttach.attachments.filter((attach: any) => attach.id === item.id).length === 0) {
+ this.emailAttach.attachments.push({
+ id: item.id,
+ label: item.label,
+ original: mode === 'pdf' ? false : true
+ });
+ }
+ } else if (type === 'note') {
+ if (this.emailAttach.notes.filter((noteId: any) => noteId === item.id).length === 0) {
+ this.emailAttach.notes.push({
+ id: item.id,
+ label: item.label
+ });
+ }
+ }
+ }
+
+ removeAttachMail(index: number, type: string) {
+ console.log(index);
+ console.log(type);
+
+ if (type === 'document') {
+ this.emailAttach.document.isLinked = true;
+ this.emailAttach.document.original = false;
+ } else if (type === 'attachments') {
+ this.emailAttach.attachments.splice(index, 1);
+ } else if (type === 'notes') {
+ this.emailAttach.notes.splice(index, 1);
+ }
+ }
+
+ formatEmail() {
+ Object.keys(this.emailAttach).forEach(element => {
+ if (this.functions.empty(this.emailAttach[element])) {
+ delete this.emailAttach[element];
+ }
+ });
+ const data = {
+ sender: this.currentSender,
+ recipients: this.recipients.map(recipient => recipient.email),
+ cc: this.copies.map(copy => copy.email),
+ cci: this.invisibleCopies.map((invCopy => invCopy.email)),
+ object: this.emailsubject,
+ body: this.tinymceInput,
+ isHtml: true,
+ status: 'WAITING'
+ };
+
+ return Object.assign({}, this.emailAttach, data);
+ }
}
\ No newline at end of file
--
GitLab