FEAT #12071 TIME 1 front update note

src/frontend/app/notes/note-editor.component.html

@@ -21,4 +21,8 @@
         [disabled]="content.trim() == '' || loading">
         <mat-icon fontSet="far" fontIcon="fa-paper-plane fa-2x"></mat-icon>
     </button>
+    <button *ngIf="upMode" color="primary" matSuffix mat-icon-button title="{{lang.validate}}" (click)="updateNote()"
+        [disabled]="content.trim() == '' || loading">
+        <mat-icon fontSet="far" fontIcon="fa-paper-plane fa-2x"></mat-icon>
+    </button>
 </mat-form-field>
\ No newline at end of file

src/frontend/app/notes/note-editor.component.ts

@@ -20,12 +20,20 @@ export class NoteEditorComponent implements AfterViewInit {
     @Input('content') content: string = '';
     @Input('resIds') resIds: any[];
     @Input('addMode') addMode: boolean;
+    @Input('upMode') upMode: boolean;
+    @Input('noteContent') noteContent: string;
+    @Input('noteId') noteId: number;
     @Output('refreshNotes') refreshNotes = new EventEmitter<string>();
 
     constructor(public http: HttpClient) { }
 
-    ngAfterViewInit() {
+    ngOnInit() {
+        if (this.upMode) {
+            this.content = this.noteContent;
+        }
+    }
 
+    ngAfterViewInit() {
     }
 
     addNote() {
@@ -37,6 +45,15 @@ export class NoteEditorComponent implements AfterViewInit {
             });
     }
 
+    updateNote() {
+        this.loading = true;
+        this.http.put("../../rest/notes/" + this.noteId, { value: this.content, resId: this.resIds[0] })
+            .subscribe((data: any) => {
+                this.refreshNotes.emit(this.resIds[0]);
+                this.loading = false;
+            });
+    }
+
     getNoteContent() {
         return this.content;
     }

src/frontend/app/notes/notes-list.component.html

@@ -14,12 +14,16 @@
             <mat-card-subtitle title='{{note.creation_date | fullDate}}' class="dateNote">{{note.creation_date
                 | timeAgo}}</mat-card-subtitle>
             <mat-card-subtitle *ngIf="note.user_id == headerService.user.id" class="removeNote">
-                <button matSuffix mat-icon-button title='{{lang.removeNote}}' (click)="removeNote(note)">
+                <button matSuffix mat-icon-button title='{{lang.editNote}}' class="editNote" (click)="editNote(note)">
+                    <mat-icon fontSet="fas" fontIcon="fa-pencil-alt fa-2x"></mat-icon>
+                </button>
+                <button matSuffix mat-icon-button title='{{lang.removeNote}}' style="color: red;" (click)="removeNote(note)">
                     <mat-icon fontSet="far" fontIcon="fa-trash-alt fa-2x"></mat-icon>
                 </button>
             </mat-card-subtitle>
         </mat-card-header>
-        <mat-card-content>
+        <app-note-editor *ngIf="note.edit" #noteEditor [resIds]="resIds" [upMode]="true" [noteId]="note.id" [noteContent]="note.value" (refreshNotes)="loadNotes($event)" style="margin: 20px;display: flex;"></app-note-editor>
+        <mat-card-content *ngIf="!note.edit">
             <p class="noteTextContent">
                 {{note.value}}
             </p>

src/frontend/app/notes/notes-list.component.scss

@@ -48,13 +48,15 @@
 
 .removeNote {
     position: absolute;
-    font-size: 12px;
-    margin: 0;
     top: 22px;
-    color: red;
     right: 0px;
 }
 
+.editNote {
+    margin-right: -10px;
+    color: $primary;
+}
+
 .noteTextContent {
     white-space: pre-line;
     padding: 30px;

src/frontend/app/notes/notes.component.ts

@@ -80,4 +80,12 @@ export class NotesListComponent implements OnInit {
             })
         ).subscribe();
     }
+
+    editNote(note: any) {
+        if (!note.edit) {
+            note.edit = true;
+        } else {
+            note.edit = false;
+        }
+    }
 }

src/frontend/lang/lang-en.ts

@@ -1471,6 +1471,7 @@ export const LANG_EN = {
     "chooseBAN": "Choose a BAN",
     "click": "Click",
     "removeNote" : "Remove note",
+    "editNote" : "Edit note",
     "noteRemoved" : "Note deleted",
     "confirmRemoveNote" : "Note deletion",
     "inSignatureBook_doc" : "Put the main document in signature book",

src/frontend/lang/lang-fr.ts

@@ -1510,6 +1510,7 @@ export const LANG_FR = {
     "chooseBAN": "Choisissez une BAN",
     "click": "Cliquez",
     "removeNote" : "Supprimer l'annotation",
+    "editNote" : "Modifier l'annotation",
     "noteRemoved" : "Annotation supprimée",
     "confirmRemoveNote" : "Suppression de l'annotation",
     "inSignatureBook_doc" : "Intégrer le document principal au parapheur",

src/frontend/lang/lang-nl.ts

@@ -1496,6 +1496,7 @@ export const LANG_NL = {
     "chooseBAN": "Choose a BAN", //_TO_TRANSLATE
     "click": "Click", //_TO_TRANSLATE
     "removeNote" : "Remove note", //_TO_TRANSLATE
+    "editNote" : "Edit note", //_TO_TRANSLATE
     "noteRemoved" : "Note deleted", //_TO_TRANSLATE
     "confirmRemoveNote" : "Note deletion", //_TO_TRANSLATE
     "inSignatureBook_doc" : "Put the main document in signature book", //_TO_TRANSLATE