awf-test-lib 0.1.24 → 0.1.25

package/src/lib/shared/contact-support/contact-support.component.ts

@@ -0,0 +1,188 @@
+import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+
+import { MessageService } from 'primeng/api';
+import { DetailedPmJob } from '../../models/detailedPmJob.model';
+import { PmJobStatus } from '../../models/pmJobStatus';
+import { Reason } from '../../models/reason.model';
+import { ReasonCode } from '../../models/reasonCode';
+import { ReasonContact } from '../../models/reasonContact';
+
+@Component({
+    selector: 'app-contact-support',
+    templateUrl: './contact-support.component.html',
+    styleUrls: ['./contact-support.component.scss'],
+    providers: [MessageService]
+})
+
+export class ContactSupportComponent implements OnInit, OnChanges {
+    @Input() displaycontactSupport!: boolean;
+    @Input() globaltranslate!: any;
+    @Input() translate!: any;
+    @Input() showDate!: boolean;
+    @Input() detailedPmJob!: DetailedPmJob;
+    @Input() reasonContact!: string;
+    @Input() reasons!: Reason[];
+    @Output() sendDetailedPm = new EventEmitter<any>();
+    @Output() sendForm: EventEmitter<any> = new EventEmitter();
+    @Output() closeContactSupport = new EventEmitter<boolean>();
+    form!: FormGroup;
+    dates!: Date[];
+    loading = false;
+    submitted = false;
+    minDate!: Date;
+    maxDate!: Date;
+    displayNumber = false;
+
+    selectedReason!: Reason;
+
+    constructor(private messageService: MessageService, private formBuilder: FormBuilder) { }
+    ngOnChanges(changes: SimpleChanges): void {
+        this.loadDatas();
+    }
+
+    ngOnInit(): void {
+        this.loadDatas();
+    }
+
+    loadDatas() {
+        this.filterReasons();
+        this.setDateRules();
+        this.loadForm();
+    }
+
+    filterReasons() {
+        if (this.reasons && this.reasonContact === ReasonContact.MoreDatesFormPm) {
+            this.selectedReason = this.reasons[0];
+            this.reasons = this.reasons.filter(x => x.code === ReasonCode.MPM)
+        }
+        if (this.reasons && this.reasonContact === ReasonContact.CancelFormPm) {
+            this.selectedReason = this.reasons[2];
+            this.reasons = this.reasons.filter(x => x.code === ReasonCode.CPM)
+        }
+        if (this.detailedPmJob.status === PmJobStatus.DONE) {
+            this.reasons = this.reasons.filter(x => x.code === ReasonCode.OTH)
+        }
+        if (this.detailedPmJob.status === PmJobStatus.VALIDATED) {
+            this.reasons = this.reasons.filter(x => x.code !== ReasonCode.MPM)
+        }
+    }
+
+
+    cancelContactSupport() {
+
+        this.closeContactSupport.emit(true);
+        this.messageService.add({ severity: 'error', summary: this.globaltranslate.summaryReject, detail: this.globaltranslate.detailReject });
+
+
+
+    }
+    get f() {
+        return this.form.controls;
+    }
+
+
+
+    setDateRules() {
+        let today = new Date();
+        let month = today.getMonth();
+        let year = today.getFullYear();
+        let prevMonth = (month === 0) ? 11 : month - 1;
+        let prevYear = (prevMonth === 11) ? year - 1 : year;
+        this.minDate = new Date();
+        this.minDate.setMonth(month);
+        this.minDate.setFullYear(prevYear);
+
+    }
+
+    loadForm() {
+        let name = sessionStorage.getItem('userName') ?  sessionStorage.getItem('userName')  :  localStorage.getItem('userName') ;
+        let email = sessionStorage.getItem('email') ? sessionStorage.getItem('email') : localStorage.getItem('email');
+        let phone = sessionStorage.getItem('mobilePhoneNumber') ? sessionStorage.getItem('mobilePhoneNumber')  : localStorage.getItem('mobilePhoneNumber'); 
+
+        this.form = this.formBuilder.group({
+            name: [name !== 'null' ? name : '', [Validators.required, Validators.minLength(3)]],
+            email: [email !== 'null' ? email : '', [Validators.required, Validators.email]],
+            phone: [this.checkPhone(phone) ? phone : '', [Validators.required]],
+            extentionOrComment: [''],
+            reason: [{ value: '' }, [Validators.required]],
+            system: [{ value: this.detailedPmJob.systemName + ' ' + this.detailedPmJob.systemId, disabled: true }, [Validators.required]],
+            workOrder: [{ value: this.detailedPmJob.pmJob.workorderNumber, disabled: true }, [Validators.required]],
+            message: ['', (this.reasonContact === ReasonContact.MoreDatesFormPm) ? [] : [Validators.required, Validators.minLength(15)]],
+        });
+    }
+    
+checkPhone(phone : any): boolean{
+    if (phone == null || phone == 'null' || phone == undefined || phone.length  == 0) {
+        return false;
+    } else {
+        return true
+    }
+}
+   
+contacted() {
+        this.sendContactMeEmailMethode();
+
+    }
+    contact() {
+        this.displayNumber = true;
+
+    }
+
+    closeNumber() {
+        this.displayNumber = false;
+    }
+
+    sendContactMeEmailMethode() {
+       
+        if(this.form.value.reason.name == "Demander d'autres dates de PM"){
+            this.reasonContact =ReasonContact.MoreDatesFormPm;
+        }
+        this.detailedPmJob.name = this.form.value.name;
+        this.detailedPmJob.phone = this.form.value.phone;
+        this.detailedPmJob.extentionOrComment = this.form.value.extentionOrComment;
+        this.detailedPmJob.email = this.form.value.email;
+      //  this.detailedPmJob.reason = (this.reasonContact === ReasonContact.MoreDatesFormPm) ? this.reasons[0].name : this.form.value.reason.name;
+        this.detailedPmJob.reason = this.form.value.reason.name;
+        this.detailedPmJob.extentionOrComment = this.form.value.extentionOrComment;
+        this.detailedPmJob.comment = this.form.value.message;
+        this.detailedPmJob.reasonContact = this.reasonContact;
+        this.detailedPmJob.futureStatus = this.slectsFutureStatus(this.form.value.reason.code);
+        this.sendDetailedPm.emit(this.detailedPmJob);
+    }
+
+    slectsFutureStatus(status: any) {
+        switch (status) {
+            case ReasonCode.MPM: return PmJobStatus.WAITING;
+            case ReasonCode.RPM: return PmJobStatus.REPORTED;
+            case ReasonCode.CPM: return PmJobStatus.CANCELLED;
+            case ReasonCode.SDI: return PmJobStatus.DESINSTALLED;
+            case ReasonCode.OTH: return PmJobStatus.OTHER;
+            default: return "Erreur";
+        }
+    }
+
+
+
+    onSubmit() {
+        this.submitted = true;
+        if (this.form.invalid) {
+            this.messageService.add({ severity: 'error', summary: this.globaltranslate.summaryError, detail: this.globaltranslate.invalidForm });
+            return;
+        }
+        this.contacted();
+    }
+
+    preventStringKeypress(event: any): void {
+        if (
+            isNaN(Number(String.fromCharCode(event.charCode))) ||
+            String.fromCharCode(event.charCode) === ' '
+        ) {
+            event.preventDefault();
+        }
+    }
+
+}
+
+
+

package/src/lib/shared/dashboard/dashboard.component.html

@@ -0,0 +1,81 @@
+<div class="GE">
+    <div class="home">
+        <h3 class="title">{{translate.title}}</h3>
+        <div class="row">
+            <div class="col-md-8">
+                <div class="row">
+                    <div class="col-md-12 card-bg" style="cursor: pointer;" routerLink="./systems">
+                    <div class="conteur">
+                        <img class="d-block mx-auto" height="60px" src="assets/img/GEPortal/tools.png">
+                         <h3 class="counter text-center mt-4">{{systems.length}} &nbsp; {{translate.systems}}</h3>
+                     </div>
+                    </div>
+                </div>
+                <br>
+
+                <div class="row">
+                    <div class="col-md-12 card-bg" style="cursor: pointer;" routerLink="./maintenance">
+                        <div class="conteur conteur bg--primary">
+                           <img class="d-block mx-auto " height="60px" src="assets/img/GEPortal/calendar-check.png">
+                            <h3 class="counter text-center mt-4">{{toBeScheduledMaintenanceList.length}} &nbsp; {{translate.upComing}}</h3>
+                        </div>
+                    </div>
+                    <!-- <div class="col-md-6 card-bg">
+                        <div class="d-block mx-auto conteur bg--primary">
+                            <img class="d-block mx-auto"  height="60px" src="assets/img/GEPortal/calendar-check.png">
+                            <h3 class="counter text-center mt-4"> {{alreadyScheduledMaintenanceList.length}} &nbsp; {{translate.toValidate}}</h3>
+                        </div>
+                    </div> -->
+                </div> 
+                <div class="row mt-4">
+                    <div class="col-md-12 card-bg">
+                        <div class="conteur">
+                            <h4> {{translate.upcoming}}</h4>
+                            <p-table [value]="toBeScheduledMaintenanceList" responsiveLayout="scroll">
+                                <ng-template pTemplate="header">
+                                    <tr>
+                                        <th>{{translate.name}}</th>
+                                        <th>{{translate.systemId}}</th>
+                                        <th>{{translate.workorderId}}</th>
+                                        <th>{{translate.endDateTime}}</th>
+                                    </tr>
+                                </ng-template> 
+                                <ng-template pTemplate="body" let-product>
+                                    <tr>
+                                        <td>{{product.systemName }}</td>
+                                        <td>{{product.systemId }}</td>
+                                        <td>{{product.pmJob.workorderNumber}}</td>
+                                        <td>{{product.pmJob.endDateTime | date: "EEE dd MMM yyyy":"":language}} </td>
+                                    </tr>
+                                </ng-template>
+                            </p-table>
+
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="col-md-4" >
+                <div routerLink="./contact" class="card- d-grid text-center justify-content-center align-items-center p-5" style="cursor: pointer;">
+                    <img src="assets/img/GEPortal/phone.png" width="80px" class="img-fluid mx-auto">
+                    <h5 class="mt-5"> {{ translate.contact}}</h5>
+                </div>
+                <div class="card- d-grid mt-4 p-4">
+                    <h4>{{ translate.profil}}</h4>
+                    <div class="d-flex align-items-center mb-3 mt-4"> <img src="assets/img/GEPortal/user.png">
+                        <p>&nbsp;{{name}}</p>
+                    </div>
+                    <div class="d-flex align-items-center mb-3"> <img src="assets/img/GEPortal/mail.png">
+                        <p>&nbsp;{{email}}</p>
+                    </div>
+                    <!-- <div class="d-flex align-items-center mb-3"> <img src="assets/img/GEPortal/map.png">
+                        <p>31 rue marseille France</p>
+                    </div> -->
+                    <div class="d-flex align-items-center mb-3"> <img src="assets/img/GEPortal/phone-call.png">
+                        <p>&nbsp;{{number}}</p>
+                    </div>
+                </div>
+            </div>
+
+        </div>
+    </div>
+</div>

package/src/lib/shared/dashboard/dashboard.component.scss

@@ -0,0 +1,5 @@
+h3 {
+    &.counter {
+        font-size: 20px;
+    }
+}

package/src/lib/shared/dashboard/dashboard.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DashboardComponent } from './dashboard.component';
+
+describe('DashboardComponent', () => {
+  let component: DashboardComponent;
+  let fixture: ComponentFixture<DashboardComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ DashboardComponent ]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(DashboardComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/shared/dashboard/dashboard.component.ts

@@ -0,0 +1,23 @@
+import { Component, OnChanges,Input, SimpleChanges } from '@angular/core';
+import { DetailedPmJob } from '../../models/detailedPmJob.model';
+import { System } from '../../models/system';
+
+
+@Component({
+  selector: 'awf-dashboard',
+  templateUrl: './dashboard.component.html',
+  styleUrls: ['./dashboard.component.scss']
+})
+export class DashboardComponent implements OnChanges {
+  @Input() name!: string;
+  @Input() email!: string;
+  @Input() number!: string;
+  @Input() systems!: System[] ;
+  @Input() toBeScheduledMaintenanceList: DetailedPmJob[] = [];
+  @Input() alreadyScheduledMaintenanceList: DetailedPmJob[] = [];
+  @Input() translate!: any; 
+  languageStored : string | null  = localStorage.getItem("lang");
+  language: string = this.languageStored ? this.languageStored  :  navigator.language.substr(0, 2).toLowerCase();
+  constructor() { }
+  ngOnChanges(changes: SimpleChanges): void {}
+}

package/src/lib/shared/maintenance-list/maintenance-list.component.html

@@ -0,0 +1,105 @@
+<p-table #dt [value]="maintenanceList" responsiveLayout="stack" [rows]="10" [showCurrentPageReport]="true" [rowsPerPageOptions]="[5,10,25,50]" 
+[globalFilterFields]="['systemId','pmJob.caseId','systemName','pmJob.workorderNumber','pmJob.startDateTime','pmJob.endDateTime','pmJob.case_type','pmJob.case_category','status']"
+[paginator]="true"  [rowHover]="true" dataKey="id" [currentPageReportTemplate]="globaltranslate.countPages" [first]="first">
+    <ng-template pTemplate="caption">
+        <div>
+            <span class="p-input-icon-left">
+                <i class="pi pi-search"></i>
+                <input pInputText type="text" (input)="applyFilterGlobal($event, 'contains')"
+                    [placeholder]="globaltranslate.search" />
+            </span>
+        </div>
+    </ng-template>
+    <ng-template pTemplate="header" let-columns>
+        <tr>
+            <!-- <th pSortableColumn="caseId">Case Id <p-sortIcon field="caseId"></p-sortIcon> -->
+            <th pSortableColumn="systemName">{{translate.maintenanceList.system}}
+                <p-sortIcon field="systemName"></p-sortIcon>
+            <th pSortableColumn="room">{{translate.maintenanceList.room}}
+                <p-sortIcon field="room"></p-sortIcon>
+            <th pSortableColumn="systemId">System Id
+                <p-sortIcon field="systemId"></p-sortIcon>
+            <th pSortableColumn="pmJob.workorderNumber">{{translate.maintenanceList.workOrder}}
+                <p-sortIcon field="pmJob.workorderNumber"></p-sortIcon>
+            <th pSortableColumn="pmJob.startDateTime">{{translate.maintenanceList.startDate}}
+                <p-sortIcon field="pmJob.startDateTime"></p-sortIcon>
+            <th pSortableColumn="pmJob.caseType">{{translate.maintenanceList.type}}
+                <p-sortIcon field="pmJob.caseType"></p-sortIcon>
+            <th pSortableColumn="status">{{translate.maintenanceList.status}}
+                <p-sortIcon field="status"></p-sortIcon>
+            <th>{{translate.maintenanceList.NbrLinks}}
+            <th> Action</th>
+        </tr>
+    </ng-template>
+    <ng-template pTemplate="body" let-product let-columns="columns">
+        <tr>   
+            <td>{{product.systemName }} </td>
+            <td>{{product.room }}</td>
+            <td>{{product.systemId }}</td>
+            <td>{{product.pmJob.workorderNumber }}</td>
+            <td>{{product.pmJob.startDateTime | date: "EEE dd MMM yyyy":"":language}}</td>
+            <td *ngIf="product.pmJob.caseType === 'Planned Maintenance'">{{translate.maintenanceList.typePlanned}}</td>
+            <td *ngIf="product.pmJob.caseType === 'QARA'">{{translate.maintenanceList.typeQARA}}</td>
+            <td>
+                <span [class]="'product-status status-' + product.status"
+                      [pTooltip]="getStatusTooltip(product.status)">
+                      {{transformStatus(product.status)}}
+                </span>
+            </td>
+            <td *ngIf="product.pmJob.groupList !== null " (click)="showLinks(product)"> <span class="circle">{{product.pmJob.groupList.length }}</span> <i class="pi pi-link" style="font-size: 1rem"></i> </td>
+            <td *ngIf="product.pmJob.groupList === null" (click)="showLinks(product)"> <span class="circlelinked">{{product.pmJob.groupList.length }}</span> <i class="pi pi-link" style="font-size: 1rem"></i> </td>
+            <td>
+                <button pButton pRipple type="button" label="" icon="pi pi-calendar" class="p-button-rounded" #actualTarget (click)="selectElement(product)" (click)="op.toggle($event)" [disabled]="((product.status ==='late'  || product.status ==='accepted') && !isAlreadyScheduled) || product.status ==='waiting'"></button>
+            </td>
+        </tr>
+    </ng-template>
+    <ng-template pTemplate="summary">
+        <div class="p-d-flex p-ai-center p-jc-between">
+            {{globaltranslate.count}} {{maintenanceList ? maintenanceList.length : 0 }} {{globaltranslate.elements}}.
+        </div>
+    </ng-template>
+</p-table>
+
+<p-toast position="top-center"></p-toast>
+<p-overlayPanel #op [dismissable]="true" [showCloseIcon]="false" [showTransitionOptions]="'0ms'" [hideTransitionOptions]="'0ms'">
+    <ng-template pTemplate>
+
+        <button style="width: 100%;" *ngIf="!isAlreadyScheduled" icon="pi pi-thumbs-up" (click)="confirmDialog()" [label]="translate.maintenanceList.confirmDate" class="p-button-text p-button-raised" pButton pRipple type="button">
+        </button>
+        <hr *ngIf="!isAlreadyScheduled">
+        <button style="width: 100%;" *ngIf="!isAlreadyScheduled && (alternativeDatesList !== null) " icon="pi pi-calendar-plus" (click)="proposeAnotherDate()" [label]="translate.maintenanceList.chooseAnotherDate" class="p-button-text p-button-raised" pButton pRipple type="button"></button>
+        <hr *ngIf="!isAlreadyScheduled && (alternativeDatesList!==null) ">
+        <button style="width: 100%;" icon="pi pi-phone" (click)="contactSupport(false)" [label]="translate.maintenanceList.contactSuppor" class="p-button-text p-button-raised" pButton pRipple type="button"></button>
+        <hr *ngIf="isWithLinks">
+        <button style="width: 100%;" icon="pi pi-link" *ngIf="isWithLinks" (click)="showLinks()" [label]="translate.maintenanceList.showLinks" class="p-button-text p-button-raised" pButton pRipple type="button"></button>
+        <hr *ngIf="isAlreadyScheduled && pmSelectedStatus ==='validated'">
+        <button style="width: 100%;" *ngIf="isAlreadyScheduled && pmSelectedStatus ==='validated'" icon="pi pi-pencil" (click)="editPm()" [label]="translate.maintenanceList.cancel" class="p-button-text p-button-raised" pButton pRipple type="button">
+        </button>
+    </ng-template>
+</p-overlayPanel>
+
+<div *ngIf="displaycontactSupport " >
+    <app-contact-support [reasonContact]="reasonContact" (closeContactSupport)="closeContactSupport($event)" (sendDetailedPm)="sendContactMeForm($event)" [detailedPmJob] ="maintenanceSelected" [globaltranslate]="globaltranslate"  [reasons]="reasons" [translate]="translate.contactSupport" [displaycontactSupport]="displaycontactSupport" [showDate]="showDate" ></app-contact-support>
+</div>
+<div *ngIf="displayConfirmDialog">
+    <app-confirm-dialog  [detailedPmJobLinkedList]="detailedPmJobLinkedList"   [isProposedDate]="isProposedDate" [globaltranslate]="globaltranslate" [translate]="translate.confirmDialog"
+        [startDateTime]="startDateTime" [endDateTime]="endDateTime" [displayConfirmDialog]="displayConfirmDialog" (closeConfirmDialog)="closeConfirmDialog($event)">
+    </app-confirm-dialog>
+</div>
+<div *ngIf="displayConfirmDialogContact">
+    <app-confirm-dialog-contact  [detailedPmJobLinkedList]="detailedPmJobLinkedList"    [globaltranslate]="globaltranslate" [translate]="translate.confirmDialogContact"
+        [startDateTime]="startDateTime" [endDateTime]="endDateTime" [displayConfirmDialogContact]="displayConfirmDialogContact" (closeConfirmDialogContact)="closeConfirmDialogContact($event)">
+    </app-confirm-dialog-contact >
+</div>
+<div *ngIf="displayConfirmedDateInfo">
+    <app-confirmed-date-information [moreDates]="moreDates" [globaltranslate]="globaltranslate" [translate]="translate.confirmDateInformation" [startDateTime]="startDateTime" [endDateTime]="endDateTime" [displayConfirmedDateInfos]="displayConfirmedDateInfo" (closeConfirmedDateInfo)="closeConfirmedDateInfo()"></app-confirmed-date-information>
+</div>
+<div *ngIf="displayAnotherDate && alternativeDatesList">
+    <app-choose-another-date [globaltranslate]="globaltranslate" [translate]="translate.chooseAnotherDate" [alternativeDatesList]="alternativeDatesList" [displayAnotherDate]="displayAnotherDate" (closeAnotherDate)="closeAnotherDate($event)" (acceptDate)="acceptDate($event)">
+    </app-choose-another-date>
+</div>
+<div *ngIf="displayShowLinks && selectedWorkorderId">
+    <app-show-links [status]="status" [selectedWorkorderId]="selectedWorkorderId" [translate]="translate" [globaltranslate]="globaltranslate" [displayShowLinks]="displayShowLinks" (closeShowLinks)="closeShowLinks()" [detailedPmJobLinkedList]="detailedPmJobLinkedList"></app-show-links>
+</div>
+
+

package/src/lib/shared/maintenance-list/maintenance-list.component.scss

@@ -0,0 +1,26 @@
+span.circle {
+    background: #f86359;
+    border-radius: 50%;
+    -moz-border-radius: 50%;
+    -webkit-border-radius: 50%;
+    color: #f8f8f8;
+    display: inline-block;
+    font-weight: bold;
+    line-height: 20px;
+    margin-right: 5px;
+    text-align: center;
+    width: 20px;
+    &linked {
+        background: #80a161;
+        border-radius: 50%;
+        -moz-border-radius: 50%;
+        -webkit-border-radius: 50%;
+        color: #ffffff;
+        display: inline-block;
+        font-weight: bold;
+        line-height: 20px;
+        margin-right: 5px;
+        text-align: center;
+        width: 20px;
+    }
+}

package/src/lib/shared/maintenance-list/maintenance-list.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MaintenanceListComponent } from './maintenance-list.component';
+
+describe('MaintenanceListComponent', () => {
+    let component: MaintenanceListComponent;
+    let fixture: ComponentFixture<MaintenanceListComponent>;
+
+    beforeEach(async () => {
+        await TestBed.configureTestingModule({
+            declarations: [ MaintenanceListComponent ]
+        })
+            .compileComponents();
+    });
+
+    beforeEach(() => {
+        fixture = TestBed.createComponent(MaintenanceListComponent);
+        component = fixture.componentInstance;
+        fixture.detectChanges();
+    });
+
+    it('should create', () => {
+        expect(component).toBeTruthy();
+    });
+});