FEAT #9062 add front param summary sheet

src/app/resource/controllers/SummarySheetController.php

@@ -44,16 +44,7 @@ class SummarySheetController
         }
 
         $queryParamsData = $request->getQueryParams();
-        $queryParamsData['units'] = base64_encode(json_encode([
-            ['label' => 'Informations', 'unit' => 'primaryInformations'],
-            ['label' => 'Informations Secondaires', 'unit' => 'secondaryInformations'],
-            ['label' => 'Liste de diffusion', 'unit' => 'diffusionList'],
-            ['label' => 'Ptit avis les potos.', 'unit' => 'freeField'],
-            ['label' => 'Annotation(s)', 'unit' => 'notes'],
-            ['label' => 'Circuit de visa', 'unit' => 'visaWorkflow'],
-            ['label' => 'Commentaires', 'unit' => 'freeField'],
-            ['unit' => 'qrcode']
-        ]));
+        
         $units = empty($queryParamsData['units']) ? [] : (array)json_decode(base64_decode($queryParamsData['units']));
 
         $basket = BasketModel::getById(['id' => $aArgs['basketId'], 'select' => ['basket_clause', 'basket_res_order', 'basket_name']]);

src/frontend/app/app.module.ts

@@ -23,6 +23,7 @@ import { ActivateUserComponent }                from './activate-user.component'
 
 import { FiltersListComponent }                 from './list/filters/filters-list.component';
 import { FiltersToolComponent }                 from './list/filters/filters-tool.component';
+import { SummarySheetComponent }                from './list/summarySheet/summary-sheet.component';
 
 import { NotesListComponent }                   from './notes/notes.component';
 import { AttachmentsListComponent }             from './attachments/attachments-list.component';
@@ -54,7 +55,8 @@ import { DiffusionsListComponent }             from './diffusions/diffusions-lis
         AttachmentsListComponent,
         DiffusionsListComponent,
         FiltersListComponent,
-        FiltersToolComponent
+        FiltersToolComponent,
+        SummarySheetComponent
     ],
     entryComponents: [
         CustomSnackbarComponent,
@@ -62,7 +64,8 @@ import { DiffusionsListComponent }             from './diffusions/diffusions-lis
         InfoChangePasswordModalComponent,
         NotesListComponent,
         AttachmentsListComponent,
-        DiffusionsListComponent
+        DiffusionsListComponent,
+        SummarySheetComponent
     ],
     providers: [ ShortcutMenuService, HeaderService, FiltersListService ],
     bootstrap: [ AppComponent ]

src/frontend/app/list/filters/filters-tool.component.html

@@ -49,6 +49,10 @@
             <mat-icon fontSet="fas" fontIcon="fa-print fa-2x"></mat-icon>
             <span>{{lang.printResultList}}</span>
         </button>
+        <button mat-menu-item (click)="openSummarySheet();">
+            <mat-icon fontSet="fas" fontIcon="fa-link fa-2x"></mat-icon>
+            <span>Fiche(s) de liaison(s)</span>
+        </button>
         <button mat-menu-item (click)="openListAdmin();">
             <mat-icon fontSet="fas" fontIcon="fa-file-export fa-2x"></mat-icon>
             <span>{{lang.exportDatas}}</span>

src/frontend/app/list/filters/filters-tool.component.ts

@@ -8,6 +8,7 @@ import { FormBuilder, FormGroup } from '@angular/forms';
 import { startWith, map } from 'rxjs/operators';
 import { LatinisePipe } from 'ngx-pipes';
 import { ListAdministrationComponent } from '../../administration/list/list-administration.component';
+import { SummarySheetComponent } from '../summarySheet/summary-sheet.component';
 
 
 declare function $j(selector: any): any;
@@ -282,4 +283,16 @@ export class FiltersToolComponent implements OnInit {
           }
         });
     }
+
+    openSummarySheet(): void {
+        this.dialog.open(SummarySheetComponent, {
+          width: '800px',
+          data: {
+              ownerId   : this.currentBasketInfo.ownerId,
+              groupId   : this.currentBasketInfo.groupId,
+              basketId  : this.currentBasketInfo.basketId,
+              filters   : this.filtersListService.getUrlFilters()
+          }
+        });
+    }
 }

src/frontend/app/list/summarySheet/summary-sheet.component.html

+<div mat-dialog-content>
+    <div *ngIf="loading" class="loader">
+        <mat-spinner></mat-spinner>
+    </div>
+    <div class="row" style="font-size:10px;padding: 10px;">
+        <div class="col-md-4" style="text-align: left;">
+            QrCode
+        </div>
+        <div class="col-md-4" style="text-align: center;">
+            Fiche de liaison <br/> Numéro chrono
+        </div>
+        <div class="col-md-4" style="text-align: right;">
+            Nom de l'application / Date d'impression
+        </div>
+    </div>
+    <div class="row" style="text-align: center;font-weight: bold;font-size: 24px;padding: 10px;">
+        <div class="col-md-12" style="border: solid 1px black;">
+            Objet
+        </div>
+    </div>
+    <div class="row">
+        <div class="col-md-12">
+            <div cdkDropList #dataAvailableList="cdkDropList" [cdkDropListData]="dataAvailable" class="cdk-list"
+                (cdkDropListDropped)="drop($event)">
+                <ng-container *ngFor="let item of dataAvailable">
+                <div class="columns" [class.disabled]="!item.enabled"  *ngIf="item.unit !== 'qrcode'" cdkDrag id="{{item.unit}}"
+                    style="position: relative;">
+                    
+                        <div style="position: absolute;top: 0;">
+                            {{item.label}}
+                        </div>
+                        <div class="row" style="padding-top: 20px;width: 100%;opacity:0.5;">
+                            <div class="{{item.css}}" *ngFor="let itemData of item.desc">
+                                {{itemData}}
+                            </div>
+                        </div>
+                        <mat-slide-toggle [(ngModel)]="item.enabled" color="primary" style="position: absolute;right:10px;"></mat-slide-toggle>
+                    
+                </div>
+            </ng-container>
+            </div>
+        </div>
+    </div>
+</div>
+
+<div mat-dialog-actions class="actions">
+    <button mat-raised-button mat-button color="primary" (click)="genSummarySheets();">Générer les fiches de liaisons</button>
+    <button mat-raised-button mat-button [mat-dialog-close]="">{{lang.cancel}}</button>
+</div>
\ No newline at end of file

src/frontend/app/list/summarySheet/summary-sheet.component.scss

+::ng-deep.mat-dialog-container {
+    position: relative;
+    height: 99vh !important;
+    padding-top: 0px;
+}
+
+.mat-dialog-content {
+    max-height: 92vh;
+    padding-bottom: 10px;
+    overflow-x: hidden;
+}
+
+::ng-deep.mat-expansion-panel-body {
+    padding-bottom: 50px;
+}
+
+.cdk-list {
+    width: 100%;
+    max-width: 100%;
+    border: solid 1px #ccc;
+    min-height: 60px;
+    display: block;
+    background: white;
+    border-radius: 4px;
+    overflow: auto;
+}
+
+.columns {
+    width: 100%;
+    height: 90px;
+    padding: 20px 10px;
+    border-bottom: solid 1px #ccc;
+    color: rgba(0, 0, 0, 0.87);
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    box-sizing: border-box;
+    cursor: move;
+    background: white;
+    font-size: 14px;
+}
+
+.cdk-drag-preview {
+    box-sizing: border-box;
+    border-radius: 4px;
+    box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),
+        0 8px 10px 1px rgba(0, 0, 0, 0.14),
+        0 3px 14px 2px rgba(0, 0, 0, 0.12);
+}
+
+.cdk-drag-placeholder {
+    opacity: 0;
+}
+
+.cdk-drag-animating {
+    transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
+}
+
+.columns:last-child {
+    border: none;
+}
+
+.cdk-list.cdk-drop-list-dragging .columns:not(.cdk-drag-placeholder) {
+    transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
+}
+
+.actions {
+    justify-content: center;
+}
+
+.loader {
+    position: absolute;
+    display: flex;
+    width: 100%;
+    left: 0px;
+    top: 0px;
+    height: 100%;
+    background: #fff9;
+    z-index: 1;
+    align-items: center;
+    justify-content: center;
+}
+
+.disabled {
+    opacity: 0.5;
+}
\ No newline at end of file

src/frontend/app/list/summarySheet/summary-sheet.component.ts

+import { Component, OnInit, ViewChild, Inject } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import { LANG } from '../../translate.component';
+import { NotificationService } from '../../notification.service';
+import { CdkDragDrop, moveItemInArray } from '@angular/cdk/drag-drop';
+import {MAT_DIALOG_DATA} from '@angular/material';
+
+declare function $j(selector: any): any;
+
+@Component({
+    templateUrl : "summary-sheet.component.html",
+    styleUrls   : ['summary-sheet.component.scss'],
+    providers   : [NotificationService],
+})
+export class SummarySheetComponent implements OnInit {
+
+    lang            : any       = LANG;
+    loading         : boolean   = false;
+
+    dataAvailable : any[] = [
+        {
+            unit : 'primaryInformations',
+            label : 'Informations pricipales',
+            css: 'col-md-6 text-center',
+            desc : ['Date du courrier','Date d\'arrivée','Nature', 'Crée le', 'Type de document', 'Opérateur'],
+            enabled : true
+        },
+        {
+            unit : 'senderRecipientInformations',
+            label : 'Informations de destination',
+            css: 'col-md-6 text-center',
+            desc : ['Expéditeur','Destinataire'],
+            enabled : true
+        },
+        {
+            unit : 'secondaryInformations',
+            label : 'Informations secondaires',
+            css: 'col-md-6 text-center',
+            desc : ['Catégorie','Statut','Priorité', 'Date limite de traitement'],
+            enabled : true
+        },
+        {
+            unit : 'diffusionList',
+            label : 'Liste de diffusion',
+            css: 'col-md-12 text-center',
+            desc : ['Attributaire','En copie(s)'],
+            enabled : true
+        },
+        {
+            unit : 'avisWorkflow',
+            label : 'Circuit d\'avis',
+            css: 'col-md-4 text-center',
+            desc : ['Prénom Nom (entité traitante)','Rôle', 'Date de traitement'],
+            enabled : true
+        },
+        {
+            unit : 'visaWorkflow',
+            label : 'Circuit de visa',
+            css: 'col-md-4 text-center',
+            desc : ['Prénom Nom (entité traitante)','Rôle', 'Date de traitement'],
+            enabled : true
+        },
+        {
+            unit : 'notes',
+            label : 'Annotations',
+            css: 'col-md-4 text-center',
+            desc : ['Prénom Nom','Date de création','Contenu'],
+            enabled : true
+        },
+        {
+            unit : 'freeField',
+            label : 'Commentaire(s)',
+            css: 'col-md-12 text-center',
+            desc : ['Note libre'],
+            enabled : true
+        }
+    ];
+
+    constructor(public http: HttpClient, private notify: NotificationService, @Inject(MAT_DIALOG_DATA) public data: any) { }
+
+    ngOnInit(): void {
+       //TO DO GET PARAM SUMMARY SHEET
+    }
+
+    drop(event: CdkDragDrop<string[]>) {
+        if (event.previousContainer === event.container) {
+            moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
+        }
+    }
+
+    genSummarySheets() {
+        this.loading = true;
+        let currElemData: any[] = [{
+            unit : 'qrcode',
+            label : '',
+        }];
+        this.dataAvailable.forEach((element: any) => {
+            if (element.enabled) {
+                currElemData.push({
+                    unit : element.unit,
+                    label : element.label,
+                });
+            }
+        });
+        this.http.get('../../rest/resourcesList/users/' + this.data.ownerId + '/groups/' + this.data.groupId + '/baskets/' + this.data.basketId + '/summarySheets?units=' + btoa(JSON.stringify(currElemData)) + '&init' + this.data.filters, {responseType: "blob"})
+            .subscribe((data) => {
+                let downloadLink = document.createElement('a');
+                downloadLink.href = window.URL.createObjectURL(data);
+                downloadLink.setAttribute('download', "summary_sheet.pdf");
+                document.body.appendChild(downloadLink);
+                downloadLink.click();
+
+                this.loading = false;
+            }, (err: any) => {
+                this.notify.handleErrors(err);
+            });
+    }
+}