From 8dc5f5a380282b6dfaa80b158e477bd312e0722c Mon Sep 17 00:00:00 2001
From: "hamza.hramchi" <hamza.hramchi@xelians.fr>
Date: Thu, 17 Sep 2020 18:37:59 +0200
Subject: [PATCH] FEAT #13271 TIME 0:30 create page administration
---
.../administration-routing.module.ts | 3 +
.../administration/administration.module.ts | 5 +-
.../searchAdv/search-adv.component.html | 182 +++++++
.../searchAdv/search-adv.component.scss | 268 ++++++++++
.../searchAdv/search-adv.component.ts | 456 ++++++++++++++++++
5 files changed, 913 insertions(+), 1 deletion(-)
create mode 100644 src/frontend/app/administration/searchAdv/search-adv.component.html
create mode 100644 src/frontend/app/administration/searchAdv/search-adv.component.scss
create mode 100644 src/frontend/app/administration/searchAdv/search-adv.component.ts
diff --git a/src/frontend/app/administration/administration-routing.module.ts b/src/frontend/app/administration/administration-routing.module.ts
index 5a0d0a34a39..40ece125599 100755
--- a/src/frontend/app/administration/administration-routing.module.ts
+++ b/src/frontend/app/administration/administration-routing.module.ts
@@ -53,6 +53,8 @@ import { IssuingSiteListComponent } from './registered-mail/issuing-site/issuing
import { IssuingSiteComponent } from './registered-mail/issuing-site/issuing-site.component';
import { RegisteredMailListComponent } from './registered-mail/registered-mail-list.component';
import { RegisteredMailComponent } from './registered-mail/registered-mail.component';
+import { SearchAdministrationComponent } from './searchAdv/search-adv.component';
+
@NgModule({
imports: [
@@ -127,6 +129,7 @@ import { RegisteredMailComponent } from './registered-mail/registered-mail.compo
{ path: 'issuingSites', canActivate: [AppGuard], component: IssuingSiteListComponent },
{ path: 'issuingSites/new', canActivate: [AppGuard], component: IssuingSiteComponent },
{ path: 'issuingSites/:id', canActivate: [AppGuard], component: IssuingSiteComponent },
+ { path : 'searchAdv', canActivate : [AppGuard], component : SearchAdministrationComponent}
]),
],
exports: [
diff --git a/src/frontend/app/administration/administration.module.ts b/src/frontend/app/administration/administration.module.ts
index 6ae785ec75b..77564f54a03 100755
--- a/src/frontend/app/administration/administration.module.ts
+++ b/src/frontend/app/administration/administration.module.ts
@@ -75,6 +75,8 @@ import { RegisteredMailComponent } from './registered-mail/registered-mail.compo
import { IssuingSiteListComponent } from './registered-mail/issuing-site/issuing-site-list.component';
import { IssuingSiteComponent } from './registered-mail/issuing-site/issuing-site.component';
import { RegisteredMailListComponent } from './registered-mail/registered-mail-list.component';
+import { SearchAdministrationComponent } from './searchAdv/search-adv.component';
+
@NgModule({
imports: [
@@ -156,7 +158,8 @@ import { RegisteredMailListComponent } from './registered-mail/registered-mail-l
RegisteredMailComponent,
IssuingSiteListComponent,
IssuingSiteComponent,
- RegisteredMailListComponent
+ RegisteredMailListComponent,
+ SearchAdministrationComponent
],
entryComponents: [
AccountLinkComponent,
diff --git a/src/frontend/app/administration/searchAdv/search-adv.component.html b/src/frontend/app/administration/searchAdv/search-adv.component.html
new file mode 100644
index 00000000000..0c0760ca0d9
--- /dev/null
+++ b/src/frontend/app/administration/searchAdv/search-adv.component.html
@@ -0,0 +1,182 @@
+<div class="formType ratio-2 col-sm-12">
+ <div class="formType-title">
+ {{'lang.options' | translate}}
+ </div>
+ <mat-form-field class="eventList" appearance="outline">
+ <mat-label>{{'lang.tabProcessPosition' | translate}}</mat-label>
+ <mat-select [(ngModel)]="selectedProcessTool.defaultTab">
+ <mat-option *ngFor="let tool of processTool | sortBy: 'label'" [value]="tool.id">
+ {{tool.label}}
+ </mat-option>
+ </mat-select>
+ </mat-form-field>
+ <div style="padding: 10px;">
+ <mat-slide-toggle color="primary" [(ngModel)]="selectedProcessTool.canUpdateData"
+ (change)="toggleCanUpdate($event.checked)">{{'lang.canUpdateData' | translate}}</mat-slide-toggle>
+ </div>
+ <div style="padding: 10px;">
+ <mat-slide-toggle color="primary" [(ngModel)]="selectedProcessTool.canUpdateModel"
+ [disabled]="!selectedProcessTool.canUpdateData">{{'lang.canUpdateIndexingModel' | translate}}
+ </mat-slide-toggle>
+ </div>
+</div>
+<hr />
+<mat-toolbar class="editorTool">
+ <span>
+ <button color="primary" *ngIf="displayMode=='label'" mat-icon-button (click)="toggleData()"
+ title="{{'lang.preview' | translate}}">
+ <mat-icon fontSet="fas" fontIcon="fa-eye"></mat-icon>
+ </button>
+ <button color="primary" *ngIf="displayMode=='sample'" mat-icon-button (click)="toggleData()"
+ title="{{'lang.edition' | translate}}">
+ <mat-icon fontSet="fas" fontIcon="fa-edit"></mat-icon>
+ </button>
+ <button color="primary" mat-button [title]="'lang.templateUsed' | translate" [matMenuTriggerFor]="menu">
+ {{selectedTemplateDisplayedSecondaryData}} <i class="fas fa-columns"></i>
+ </button>
+ <mat-menu #menu="matMenu">
+ <button mat-menu-item *ngFor="let colNum of templateDisplayedSecondaryData" (click)="selectedTemplateDisplayedSecondaryData=colNum">{{colNum}} colonne(s)</button>
+ </mat-menu>
+ </span>
+ <span class="area">
+ <form>
+ <mat-form-field appearance="outline" floatLabel="never">
+ <input id="availableData" name="availableData" type="text" matInput [formControl]="dataControl"
+ placeholder="{{'lang.availableDatas' | translate}}" [matAutocomplete]="auto">
+ <mat-autocomplete #auto="matAutocomplete" (optionSelected)="addData($event)">
+ <mat-option *ngFor="let item of filteredDataOptions | async" [value]="item" class="dataList">
+ <span class="optionContent">
+ <span class="dataIcon">
+ <i color="primary" class="fa {{item.icon}} fa-2x"></i>
+ </span>
+ <span class="dataLabel">
+ {{item.label}}
+ </span>
+ </span>
+ </mat-option>
+ </mat-autocomplete>
+ </mat-form-field>
+ </form>
+ </span>
+ <span>
+ <button color="warn" mat-button (click)="removeAllData()" style="float:right;"
+ [disabled]="displayMode=='sample'">
+ {{'lang.eraseAll' | translate}}
+ </button>
+ </span>
+</mat-toolbar>
+<mat-card>
+ <ng-container *ngIf="(displayedSecondaryData.length > 0 && displayMode=='sample') || displayMode=='label'">
+ <mat-toolbar class="secondaryInformations example-list column-{{selectedTemplateDisplayedSecondaryData}}-list" cdkDropListOrientation="horizontal" cdkDropList
+ [cdkDropListData]="displayedSecondaryData" (cdkDropListDropped)="drop($event)">
+ <ng-container *ngFor="let item of displayedSecondaryData;let itData=index">
+ <span class="example-box" *ngIf="item.value != 'getFolders'" cdkDrag>
+ <button *ngIf="displayMode=='label'" color="primary" mat-icon-button [matMenuTriggerFor]="menu">
+ <mat-icon fontSet="fas" fontIcon="fa-ellipsis-v fa-2x"></mat-icon>
+ </button>
+ <mat-menu #menu="matMenu">
+ <button mat-menu-item (click)="removeData(item,itData)">
+ <mat-icon class="secondaryInformations_icon" color="warn" fontSet="fas"
+ fontIcon="fa-trash fa-2x"></mat-icon>
+ <span>{{'lang.delete' | translate}}</span>
+ </button>
+ <mat-divider></mat-divider>
+ <button [class.isSelectedMenu]="item.cssClasses.indexOf('boldFontData') > -1" mat-menu-item
+ (click)="setStyle(item,'boldFontData')">
+ <mat-icon class="secondaryInformations_icon" fontSet="fas" fontIcon="fa-bold fa-2x">
+ </mat-icon>
+ <span>{{'lang.fontBold' | translate}}</span>
+ </button>
+ <button [class.isSelectedMenu]="item.cssClasses.indexOf('align_leftData') > -1" mat-menu-item
+ (click)="setStyle(item,'align_leftData')">
+ <mat-icon class="secondaryInformations_icon" fontSet="fas" fontIcon="fa-align-left fa-2x">
+ </mat-icon>
+ <span>{{'lang.alignLeft' | translate}}</span>
+ </button>
+ <button [class.isSelectedMenu]="item.cssClasses.indexOf('align_centerData') > -1" mat-menu-item
+ (click)="setStyle(item,'align_centerData')">
+ <mat-icon class="secondaryInformations_icon" fontSet="fas" fontIcon="fa-align-center fa-2x">
+ </mat-icon>
+ <span>{{'lang.alignCenter' | translate}}</span>
+ </button>
+ <button [class.isSelectedMenu]="item.cssClasses.indexOf('align_rightData') > -1" mat-menu-item
+ (click)="setStyle(item,'align_rightData')">
+ <mat-icon class="secondaryInformations_icon" fontSet="fas" fontIcon="fa-align-right fa-2x">
+ </mat-icon>
+ <span>{{'lang.alignRight' | translate}}</span>
+ </button>
+ <button [class.isSelectedMenu]="item.cssClasses.indexOf('bigFontData') > -1" mat-menu-item
+ (click)="setStyle(item,'bigFontData')">
+ <mat-icon class="secondaryInformations_icon" fontSet="fas" fontIcon="fa-text-height fa-2x">
+ </mat-icon>
+ <span>{{'lang.fontBig' | translate}}</span>
+ </button>
+ </mat-menu>
+ <span style="width:100%;" [class]="item.cssClasses.join(' ')">
+ <i class="fa {{item.icon}}"></i>
+ <span class="secondaryInformations_label" [innerHTML]="item[displayMode]"></span>
+ </span>
+ </span>
+ </ng-container>
+ </mat-toolbar>
+ </ng-container>
+ <div class="resultRow newRow">
+ <span class="resultCol" *ngFor="let item of displayedMainData;let i=index" [class]="item.cssClasses.join(' ')">
+ <span *ngIf="i == 0">
+ <mat-icon *ngIf="displayMode=='label'" color="primary" class="fm fm-letter fm-2x"></mat-icon>
+ <mat-icon *ngIf="displayMode=='sample'" color="warn" class="fm fm-letter-status-inprogress fm-2x">
+ </mat-icon><br />
+ <span class="resultCol_chrono">{{item[displayMode]}}</span>
+ </span>
+ <span *ngIf="i == 1">
+ {{item[displayMode]}}
+ </span>
+ </span>
+ <mat-button-toggle-group class="actions" multiple>
+ <button color="primary" mat-icon-button title="{{'lang.notes' | translate}}"
+ [disabled]="displayMode == 'label'">
+ <mat-icon [matBadgeHidden]="displayMode == 'label'" fontSet="fas" matBadge="2"
+ fontIcon="fa-comments fa-2x"></mat-icon>
+ </button>
+ <button color="primary" mat-icon-button title="{{'lang.attachments' | translate}}"
+ [disabled]="displayMode == 'label'">
+ <mat-icon [matBadgeHidden]="displayMode == 'label'" fontSet="fas" matBadge="7"
+ fontIcon="fa-paperclip fa-2x"></mat-icon>
+ </button>
+ <button color="primary" mat-icon-button title="{{'lang.diffusionList' | translate}}"
+ [disabled]="displayMode == 'label'">
+ <mat-icon fontSet="fas" fontIcon="fa-sitemap fa-2x"></mat-icon>
+ </button>
+ <button color="primary" mat-icon-button title="{{'lang.linkDetails' | translate}}"
+ [disabled]="displayMode == 'label'">
+ <mat-icon fontSet="fas" fontIcon="fa-info-circle fa-2x"></mat-icon>
+ </button>
+ </mat-button-toggle-group>
+ </div>
+ <div *ngFor="let item of displayedSecondaryData;let itData=index" class="folder-info">
+ <ng-container *ngIf="item.value=='getFolders'">
+ <button *ngIf="displayMode=='label'" color="primary" mat-icon-button [matMenuTriggerFor]="menu">
+ <mat-icon fontSet="fas" fontIcon="fa-ellipsis-v fa-2x"></mat-icon>
+ </button>
+ <mat-menu #menu="matMenu">
+ <button mat-menu-item (click)="removeData(item,itData)">
+ <mat-icon class="secondaryInformations_icon" color="warn" fontSet="fas" fontIcon="fa-trash fa-2x">
+ </mat-icon>
+ <span>{{'lang.delete' | translate}}</span>
+ </button>
+ </mat-menu>
+ <span class="badge badge-folder"><i class="fa fa-folder"></i>
+ {{item[displayMode]}}</span>
+ </ng-container>
+ </div>
+</mat-card>
+<div class="row">
+ <div class="col-md-12 text-center" style="margin-top:30px;">
+ <button color="primary" mat-raised-button (click)="saveTemplate()" [disabled]="checkModif()">
+ {{'lang.validate' | translate}}
+ </button>
+ <button color="default" mat-raised-button (click)="cancelModification()" [disabled]="checkModif()">
+ {{'lang.cancel' | translate}}
+ </button>
+ </div>
+</div>
\ No newline at end of file
diff --git a/src/frontend/app/administration/searchAdv/search-adv.component.scss b/src/frontend/app/administration/searchAdv/search-adv.component.scss
new file mode 100644
index 00000000000..30338c7659c
--- /dev/null
+++ b/src/frontend/app/administration/searchAdv/search-adv.component.scss
@@ -0,0 +1,268 @@
+@import '../../../css/vars.scss';
+
+.availableData {
+ margin: 10px;
+ display: flex;
+}
+
+.secondaryInformations {
+ border: solid 1px #F9983066;
+ font-size: 10px;
+ height: 30px;
+ color: #666;
+
+ &_icon {
+ height: auto;
+ }
+
+ &_label {
+ width: 100%;
+ }
+}
+
+.resultRow {
+ align-items: center;
+ display: flex;
+ padding: 5px;
+
+ &-mobile {
+ font-size: 80%;
+ }
+}
+
+.resultCol {
+ flex: 1;
+ overflow: hidden;
+ text-overflow: ellipsis;
+
+ &-mobile {
+ overflow: inherit;
+ text-overflow: inherit;
+ word-break: break-all;
+ }
+
+ &_chrono {
+ color: rgba(0, 0, 0, 0.4);
+ font-size: 90%;
+ }
+}
+
+.actions {
+ text-align: right;
+ box-shadow: none;
+ border: none;
+ flex: 1;
+ justify-content: flex-end;
+ overflow: inherit;
+}
+
+.elemToDrag {
+ flex: 1;
+ border: dashed 1px;
+ padding: 10px;
+ height: 10px;
+ line-height: 0px;
+ cursor: move;
+ margin-right: 5px;
+ margin-left: 5px;
+}
+
+.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;
+ background: white;
+ font-size: 14px;
+}
+
+.mat-badge-content {
+ background: #F99830;
+}
+
+.example-list {
+ display: grid;
+ gap: 10px;
+ height: auto;
+ max-width: 100%;
+ border-radius: 4px;
+ // overflow: hidden;
+ border: solid 1px #F9983066;
+ font-size: 10px;
+ background: #f5f5f5;
+}
+
+.example-box {
+ // padding: 20px 10px;
+ //border-right: solid 1px #ccc;
+ color: #666;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: space-between;
+ box-sizing: border-box;
+ cursor: move;
+ background: #f5f5f5;
+ flex-grow: 1;
+ flex-basis: 0;
+ height: 20px;
+}
+
+.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);
+}
+
+.example-box:last-child {
+ border: none;
+}
+
+.example-list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder) {
+ transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
+}
+
+.editorTool {
+ display: flex;
+ height: 44px;
+ font-size: 10px;
+ margin-bottom: 30px;
+
+ .area {
+ flex: 1;
+
+ form {
+ width: 100%;
+ }
+ }
+
+ .separator {
+ border-left: solid 1px #666;
+ height: 70%;
+ margin-left: 10px;
+ margin-right: 10px;
+ }
+
+ .mat-form-field {
+ height: 35px;
+ }
+
+ ::ng-deep .mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-outline {
+ background: inherit;
+ }
+
+ ::ng-deep .mat-form-field-outline {
+ background: white;
+ }
+}
+
+.optionContent {
+ display: flex !important;
+
+ .dataIcon {
+ width: 30px;
+
+ i {
+ font-size: 14px;
+ }
+ }
+
+ .dataLabel {
+ flex: 1;
+ }
+}
+
+.isSelectedMenu {
+ background: rgba(249, 152, 48, 0.14);
+}
+
+.align_leftData {
+ text-align: left;
+}
+
+.align_centerData {
+ text-align: center;
+}
+
+.align_rightData {
+ text-align: right;
+}
+
+.boldFontData {
+ font-weight: bold;
+}
+
+.bigFontData {
+ font-size: 14px;
+}
+
+.smallFontData {
+ font-size: 10px;
+}
+
+.normalData {
+ flex: 1;
+}
+
+.longData {
+ flex: 3;
+}
+
+.eventList {
+ padding-top: 10px;
+}
+
+.badge-folder {
+ cursor: default;
+ background: $primary;
+ margin: 5px;
+ font-size: 8px;
+ max-width: 250px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+
+.formType {
+ align-items: center;
+ // display: flex;
+ // margin: 10px;
+ margin-bottom: 10px;
+ border-radius: 4px;
+ border: solid 1px #ccc;
+ position: relative;
+ padding: 10px;
+
+ &-title {
+ white-space: pre;
+ overflow: hidden;
+ max-width: 85%;
+ text-overflow: ellipsis;
+ z-index: 1;
+ font-size: 10px;
+ font-weight: bold;
+ background: white;
+ position: absolute;
+ top: -7px;
+ left: 10px;
+ padding: 0px;
+ margin: 0px;
+ color: #135f7f;
+ }
+}
diff --git a/src/frontend/app/administration/searchAdv/search-adv.component.ts b/src/frontend/app/administration/searchAdv/search-adv.component.ts
new file mode 100644
index 00000000000..8c2855e36de
--- /dev/null
+++ b/src/frontend/app/administration/searchAdv/search-adv.component.ts
@@ -0,0 +1,456 @@
+import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import { TranslateService } from '@ngx-translate/core';
+import { NotificationService } from '../../../service/notification/notification.service';
+import { FormControl } from '@angular/forms';
+import { CdkDragDrop, moveItemInArray } from '@angular/cdk/drag-drop';
+import { startWith, map, tap, catchError } from 'rxjs/operators';
+import { Observable } from 'rxjs/internal/Observable';
+import { of } from 'rxjs/internal/observable/of';
+
+declare var $: any;
+
+
+@Component({
+ templateUrl: 'search-adv.component.html',
+ styleUrls: ['search-adv.component.scss'],
+})
+
+export class SearchAdministrationComponent implements OnInit {
+
+
+ loading: boolean = false;
+
+ displayedMainData: any = [
+ {
+ 'value': 'chronoNumberShort',
+ 'label': this.translate.instant('lang.chronoNumberShort'),
+ 'sample': 'MAARCH/2019A/1',
+ 'cssClasses': ['align_centerData', 'normalData'],
+ 'icon': ''
+ },
+ {
+ 'value': 'object',
+ 'label': this.translate.instant('lang.object'),
+ 'sample': this.translate.instant('lang.objectSample'),
+ 'cssClasses': ['longData'],
+ 'icon': ''
+ }
+ ];
+
+ availableData: any = [
+ {
+ 'value': 'getPriority',
+ 'label': this.translate.instant('lang.getPriority'),
+ 'sample': this.translate.instant('lang.getPrioritySample'),
+ 'cssClasses': ['align_leftData'],
+ 'icon': 'fa-traffic-light'
+ },
+ {
+ 'value': 'getCategory',
+ 'label': this.translate.instant('lang.getCategory'),
+ 'sample': this.translate.instant('lang.incoming'),
+ 'cssClasses': ['align_leftData'],
+ 'icon': 'fa-exchange-alt'
+ },
+ {
+ 'value': 'getDoctype',
+ 'label': this.translate.instant('lang.getDoctype'),
+ 'sample': this.translate.instant('lang.getDoctypeSample'),
+ 'cssClasses': ['align_leftData'],
+ 'icon': 'fa-suitcase'
+ },
+ {
+ 'value': 'getAssignee',
+ 'label': this.translate.instant('lang.getAssignee'),
+ 'sample': this.translate.instant('lang.getAssigneeSample'),
+ 'cssClasses': ['align_leftData'],
+ 'icon': 'fa-sitemap'
+ },
+ {
+ 'value': 'getRecipients',
+ 'label': this.translate.instant('lang.getRecipients'),
+ 'sample': 'Patricia PETIT',
+ 'cssClasses': ['align_leftData'],
+ 'icon': 'fa-user'
+ },
+ {
+ 'value': 'getSenders',
+ 'label': this.translate.instant('lang.getSenders'),
+ 'sample': 'Alain DUBOIS (MAARCH)',
+ 'cssClasses': ['align_leftData'],
+ 'icon': 'fa-book'
+ },
+ {
+ 'value': 'getCreationAndProcessLimitDates',
+ 'label': this.translate.instant('lang.getCreationAndProcessLimitDates'),
+ 'sample': this.translate.instant('lang.getCreationAndProcessLimitDatesSample'),
+ 'cssClasses': ['align_leftData'],
+ 'icon': 'fa-calendar'
+ },
+ {
+ 'value': 'getVisaWorkflow',
+ 'label': this.translate.instant('lang.getVisaWorkflow'),
+ 'sample': '<i color="accent" class="fa fa-check"></i> Barbara BAIN -> <i class="fa fa-hourglass-half"></i> <b>Bruno BOULE</b> -> <i class="fa fa-hourglass-half"></i> Patricia PETIT',
+ 'cssClasses': ['align_leftData'],
+ 'icon': 'fa-list-ol'
+ },
+ {
+ 'value': 'getSignatories',
+ 'label': this.translate.instant('lang.getSignatories'),
+ 'sample': 'Denis DAULL, Patricia PETIT',
+ 'cssClasses': ['align_leftData'],
+ 'icon': 'fa-certificate'
+ },
+ {
+ 'value': 'getModificationDate',
+ 'label': this.translate.instant('lang.getModificationDate'),
+ 'sample': '01-01-2019',
+ 'cssClasses': ['align_leftData'],
+ 'icon': 'fa-calendar-check'
+ },
+ {
+ 'value': 'getOpinionLimitDate',
+ 'label': this.translate.instant('lang.getOpinionLimitDate'),
+ 'sample': '01-01-2019',
+ 'cssClasses': ['align_leftData'],
+ 'icon': 'fa-stopwatch'
+ },
+ {
+ 'value': 'getParallelOpinionsNumber',
+ 'label': this.translate.instant('lang.getParallelOpinionsNumber'),
+ 'sample': this.translate.instant('lang.getParallelOpinionsNumberSample'),
+ 'cssClasses': ['align_leftData'],
+ 'icon': 'fa-comment-alt'
+ },
+ {
+ 'value': 'getFolders',
+ 'label': this.translate.instant('lang.getFolders'),
+ 'sample': this.translate.instant('lang.getFoldersSample'),
+ 'cssClasses': ['align_leftData'],
+ 'icon': 'fa-folder'
+ },
+ {
+ 'value': 'getResId',
+ 'label': this.translate.instant('lang.getResId'),
+ 'sample': this.translate.instant('lang.getResIdSample'),
+ 'cssClasses': ['align_leftData'],
+ 'icon': 'fa-envelope'
+ }, {
+ 'value': 'getBarcode',
+ 'label': this.translate.instant('lang.getBarcode'),
+ 'sample': this.translate.instant('lang.getBarcodeSample'),
+ 'cssClasses': ['align_leftData'],
+ 'icon': 'fa-barcode'
+ }
+ ];
+ availableDataClone: any = [];
+
+ displayedSecondaryData: any = [];
+ displayedSecondaryDataClone: any = [];
+
+ displayMode: string = 'label';
+ dataControl = new FormControl();
+ filteredDataOptions: Observable<string[]>;
+ listEvent: any[] = [
+ {
+ id: 'detailDoc',
+ value: 'documentDetails'
+ },
+ {
+ id: 'eventVisaMail',
+ value: 'signatureBookAction'
+ },
+ {
+ id: 'eventProcessDoc',
+ value: 'processDocument'
+ },
+ {
+ id: 'eventViewDoc',
+ value: 'viewDoc'
+ }
+ ];
+
+ templateDisplayedSecondaryData: number[] = [1, 2, 3, 4, 5, 6, 7];
+ selectedTemplateDisplayedSecondaryData: number = 7;
+ selectedTemplateDisplayedSecondaryDataClone: number = 7;
+
+ selectedListEvent: string = null;
+ selectedListEventClone: string = null;
+
+ processTool: any[] = [
+ {
+ id: 'dashboard',
+ icon: 'fas fa-columns',
+ label: this.translate.instant('lang.newsFeed'),
+ },
+ {
+ id: 'history',
+ icon: 'fas fa-history',
+ label: this.translate.instant('lang.history'),
+ },
+ {
+ id: 'notes',
+ icon: 'fas fa-pen-square',
+ label: this.translate.instant('lang.notesAlt'),
+ },
+ {
+ id: 'attachments',
+ icon: 'fas fa-paperclip',
+ label: this.translate.instant('lang.attachments'),
+ },
+ {
+ id: 'linkedResources',
+ icon: 'fas fa-link',
+ label: this.translate.instant('lang.links'),
+ },
+ {
+ id: 'diffusionList',
+ icon: 'fas fa-share-alt',
+ label: this.translate.instant('lang.diffusionList'),
+ },
+ {
+ id: 'emails',
+ icon: 'fas fa-envelope',
+ label: this.translate.instant('lang.mailsSentAlt'),
+ },
+ {
+ id: 'visaCircuit',
+ icon: 'fas fa-list-ol',
+ label: this.translate.instant('lang.visaWorkflow'),
+ },
+ {
+ id: 'opinionCircuit',
+ icon: 'fas fa-comment-alt',
+ label: this.translate.instant('lang.avis'),
+ },
+ {
+ id: 'info',
+ icon: 'fas fa-info-circle',
+ label: this.translate.instant('lang.informations'),
+ }
+ ];
+ selectedProcessTool: any = {
+ defaultTab: null,
+ canUpdateData: false,
+ canUpdateModel: false,
+ canUpdateDocuments: false,
+ };
+ selectedProcessToolClone: string = null;
+
+ searchAdv: any = { list_event: {}, list_display: {} };
+
+ constructor(public translate: TranslateService, public http: HttpClient, private notify: NotificationService) { }
+
+ async ngOnInit(): Promise<void> {
+ await this.initCustomFields();
+ this.filteredDataOptions = this.dataControl.valueChanges
+ .pipe(
+ startWith(''),
+ map(value => this._filterData(value))
+ );
+
+ this.availableDataClone = JSON.parse(JSON.stringify(this.availableData));
+ this.displayedSecondaryData = [];
+ let indexData: number = 0;
+ this.selectedTemplateDisplayedSecondaryData = this.searchAdv.list_display.templateColumns;
+ this.selectedTemplateDisplayedSecondaryDataClone = this.selectedTemplateDisplayedSecondaryData;
+ /*this.searchAdv.list_display.subInfos.forEach((element: any) => {
+ indexData = this.availableData.map((e: any) => e.value).indexOf(element.value);
+ this.availableData[indexData].cssClasses = element.cssClasses;
+ this.displayedSecondaryData.push(this.availableData[indexData]);
+ this.availableData.splice(indexData, 1);
+ });*/
+ this.selectedListEvent = this.searchAdv.list_event;
+ this.selectedListEventClone = this.selectedListEvent;
+
+ if (this.searchAdv.list_event === 'processDocument') {
+ this.selectedProcessTool.defaultTab = this.searchAdv.list_event_data === null ? 'dashboard' : this.searchAdv.list_event_data.defaultTab;
+ this.selectedProcessTool.canUpdateData = this.searchAdv.list_event_data === null ? false : this.searchAdv.list_event_data.canUpdateData;
+ this.selectedProcessTool.canUpdateModel = this.searchAdv.list_event_data === null ? false : this.searchAdv.list_event_data.canUpdateModel;
+ } else if (this.searchAdv.list_event === 'signatureBookAction') {
+ this.selectedProcessTool.canUpdateDocuments = this.searchAdv.list_event_data === null ? false : this.searchAdv.list_event_data.canUpdateDocuments;
+ }
+
+ this.selectedProcessToolClone = JSON.parse(JSON.stringify(this.selectedProcessTool));
+ this.displayedSecondaryDataClone = JSON.parse(JSON.stringify(this.displayedSecondaryData));
+ }
+
+ initCustomFields() {
+ return new Promise((resolve, reject) => {
+
+ this.http.get('../rest/customFields').pipe(
+ map((data: any) => {
+ data.customFields = data.customFields.map((info: any) => {
+ return {
+ 'value': 'indexingCustomField_' + info.id,
+ 'label': info.label,
+ 'sample': this.translate.instant('lang.customField') + info.id,
+ 'cssClasses': ['align_leftData'],
+ 'icon': 'fa-hashtag'
+ };
+ });
+ return data.customFields;
+ }),
+ tap((customs) => {
+ console.log(customs);
+ this.availableData = this.availableData.concat(customs);
+ resolve(true);
+
+ }),
+ catchError((err: any) => {
+ this.notify.handleErrors(err);
+ return of(false);
+ })
+ ).subscribe();
+ });
+ }
+
+ toggleData() {
+ this.dataControl.disabled ? this.dataControl.enable() : this.dataControl.disable();
+
+ if (this.displayMode === 'label') {
+ this.displayMode = 'sample';
+ } else {
+ this.displayMode = 'label';
+ }
+
+ }
+
+ setStyle(item: any, value: string) {
+ const typeFont = value.split('_');
+
+ if (typeFont.length === 2) {
+ item.cssClasses.forEach((element: any, it: number) => {
+ if (element.includes(typeFont[0]) && element !== value) {
+ item.cssClasses.splice(it, 1);
+ }
+ });
+ }
+
+ const index = item.cssClasses.indexOf(value);
+
+ if (index === -1) {
+ item.cssClasses.push(value);
+ } else {
+ item.cssClasses.splice(index, 1);
+ }
+ }
+
+ addData(event: any) {
+ const i = this.availableData.map((e: any) => e.value).indexOf(event.option.value.value);
+ this.displayedSecondaryData.push(event.option.value);
+ this.availableData.splice(i, 1);
+ $('#availableData').blur();
+ this.dataControl.setValue('');
+ }
+
+ removeData(data: any, i: number) {
+ this.availableData.push(data);
+ this.displayedSecondaryData.splice(i, 1);
+ this.dataControl.setValue('');
+ }
+
+ removeAllData() {
+ this.availableData = this.availableData.concat(this.displayedSecondaryData);
+ this.displayedSecondaryData = [];
+ this.dataControl.setValue('');
+ }
+
+ drop(event: CdkDragDrop<string[]>) {
+ if (event.previousContainer === event.container) {
+ moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
+ }
+ }
+
+ saveTemplate() {
+ let objToSend = {};
+ const template: any = [];
+ this.displayedSecondaryData.forEach((element: any) => {
+ template.push(
+ {
+ 'value': element.value,
+ 'cssClasses': element.cssClasses,
+ 'icon': element.icon,
+ }
+ );
+ });
+
+ objToSend = {
+ templateColumns: this.selectedTemplateDisplayedSecondaryData,
+ subInfos: template
+ };
+
+ this.http.put('../rest/baskets/' + this.searchAdv.basket_id + '/groups/' + this.searchAdv.group_id, { 'list_display': objToSend, 'list_event': this.selectedListEvent, 'list_event_data': this.selectedProcessTool })
+ .subscribe(() => {
+ this.displayedSecondaryDataClone = JSON.parse(JSON.stringify(this.displayedSecondaryData));
+ this.searchAdv.list_display = template;
+ this.searchAdv.list_event = this.selectedListEvent;
+ this.selectedListEventClone = this.selectedListEvent;
+ this.searchAdv.list_event_data = this.selectedProcessTool;
+ this.selectedProcessToolClone = JSON.parse(JSON.stringify(this.selectedProcessTool));
+ this.selectedTemplateDisplayedSecondaryDataClone = JSON.parse(JSON.stringify(this.selectedTemplateDisplayedSecondaryData));
+ this.notify.success(this.translate.instant('lang.modificationsProcessed'));
+ }, (err) => {
+ this.notify.error(err.error.errors);
+ });
+ }
+
+ private _filterData(value: any): string[] {
+ let filterValue = '';
+
+ if (typeof value === 'string') {
+ filterValue = value.toLowerCase();
+ } else if (value !== null) {
+ filterValue = value.label.toLowerCase();
+ }
+ return this.availableData.filter((option: any) => option.label.toLowerCase().includes(filterValue));
+ }
+
+ checkModif() {
+ if (JSON.stringify(this.displayedSecondaryData) === JSON.stringify(this.displayedSecondaryDataClone) && this.selectedListEvent === this.selectedListEventClone && JSON.stringify(this.selectedProcessTool) === JSON.stringify(this.selectedProcessToolClone) && JSON.stringify(this.selectedTemplateDisplayedSecondaryData) === JSON.stringify(this.selectedTemplateDisplayedSecondaryDataClone)) {
+ return true;
+ } else {
+ return false;
+ }
+ }
+
+ cancelModification() {
+ this.displayedSecondaryData = JSON.parse(JSON.stringify(this.displayedSecondaryDataClone));
+ this.selectedListEvent = this.selectedListEventClone;
+ this.selectedProcessTool = JSON.parse(JSON.stringify(this.selectedProcessToolClone));
+ this.availableData = JSON.parse(JSON.stringify(this.availableDataClone));
+ this.selectedTemplateDisplayedSecondaryData = JSON.parse(JSON.stringify(this.selectedTemplateDisplayedSecondaryDataClone));
+
+ let indexData: number = 0;
+ this.displayedSecondaryData.forEach((element: any) => {
+ indexData = this.availableData.map((e: any) => e.value).indexOf(element.value);
+ this.availableData.splice(indexData, 1);
+ });
+ this.dataControl.setValue('');
+ }
+
+ hasFolder() {
+ if (this.displayedSecondaryData.map((data: any) => data.value).indexOf('getFolders') > -1) {
+ return true;
+ } else {
+ return false;
+ }
+ }
+
+ changeEventList(ev: any) {
+ if (ev.value === 'processDocument') {
+ this.selectedProcessTool = {
+ defaultTab: 'dashboard'
+ };
+ } else {
+ this.selectedProcessTool = {};
+ }
+ }
+
+ toggleCanUpdate(state: boolean) {
+ if (!state) {
+ this.selectedProcessTool.canUpdateModel = state;
+ }
+ }
+}
--
GitLab