From 2783c878c1345e1d159fda9797678cb9721222ba Mon Sep 17 00:00:00 2001 From: Vincent BENOIT Date: Mon, 28 Mar 2022 15:38:55 +0200 Subject: [PATCH] =?UTF-8?q?Resutat=20apr=C3=A8s=20le=20cours=20n=C2=B05=20?= =?UTF-8?q?et=20les=20sub/pub=20avec=20Subject?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../employee-item/employee-item.component.ts | 8 ++--- .../employees-list.component.html | 2 +- .../employees-list.component.ts | 5 --- .../employees-navbar.component.ts | 12 +++---- .../employees/employees.component.html | 4 +-- .../employees/employees.component.ts | 32 +++++++++++++------ src/app/services/event.driver.service.ts | 13 ++++++++ src/app/state/employee.state.ts | 3 +- tsconfig.json | 1 + 9 files changed, 52 insertions(+), 28 deletions(-) create mode 100644 src/app/services/event.driver.service.ts diff --git a/src/app/components/employees/employees-list/employee-item/employee-item.component.ts b/src/app/components/employees/employees-list/employee-item/employee-item.component.ts index 471af71..3afb90f 100644 --- a/src/app/components/employees/employees-list/employee-item/employee-item.component.ts +++ b/src/app/components/employees/employees-list/employee-item/employee-item.component.ts @@ -1,6 +1,7 @@ import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; import { Employee } from '../../../../model/employee.model'; import { AppDataState, DataStateEnum, EmployeeActionsTypes, ActEvent } from '../../../../state/employee.state'; +import { EventDriverService } from '../../../../services/event.driver.service'; @Component({ selector: 'app-employee-item', @@ -9,19 +10,18 @@ import { AppDataState, DataStateEnum, EmployeeActionsTypes, ActEvent } from '../ }) export class EmployeeItemComponent implements OnInit { @Input() employee?:Employee; - @Output() evtEmit:EventEmitter=new EventEmitter(); - constructor() { } + constructor(private evDrivenService:EventDriverService) { } ngOnInit(): void { } onDelete(val:Employee) { - this.evtEmit.emit({ + this.evDrivenService.publishEvent({ type:EmployeeActionsTypes.DELETE_EMPLOYEE, payload:val }); } onEdit(val:Employee) { - this.evtEmit.emit({ + this.evDrivenService.publishEvent({ type:EmployeeActionsTypes.EDIT_EMPLOYEE, payload:val }); } diff --git a/src/app/components/employees/employees-list/employees-list.component.html b/src/app/components/employees/employees-list/employees-list.component.html index 051965c..ea98d52 100644 --- a/src/app/components/employees/employees-list/employees-list.component.html +++ b/src/app/components/employees/employees-list/employees-list.component.html @@ -16,7 +16,7 @@ - + diff --git a/src/app/components/employees/employees-list/employees-list.component.ts b/src/app/components/employees/employees-list/employees-list.component.ts index 405c2ec..141cba7 100644 --- a/src/app/components/employees/employees-list/employees-list.component.ts +++ b/src/app/components/employees/employees-list/employees-list.component.ts @@ -10,14 +10,9 @@ import { Observable, of } from 'rxjs'; }) export class EmployeesListComponent implements OnInit { @Input() employeesInput$:Observable>|null=null; - @Output() evtEmit:EventEmitter=new EventEmitter(); readonly DataStateEnum=DataStateEnum; constructor() { } ngOnInit(): void { } - - onActionEvent($event:ActEvent) { - this.evtEmit.emit($event); - } } diff --git a/src/app/components/employees/employees-navbar/employees-navbar.component.ts b/src/app/components/employees/employees-navbar/employees-navbar.component.ts index 8a299b4..3d04c03 100644 --- a/src/app/components/employees/employees-navbar/employees-navbar.component.ts +++ b/src/app/components/employees/employees-navbar/employees-navbar.component.ts @@ -1,5 +1,6 @@ -import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { EmployeeActionsTypes, ActEvent } from '../../../state/employee.state'; +import { EventDriverService } from '../../../services/event.driver.service'; @Component({ selector: 'app-employees-navbar', @@ -8,21 +9,20 @@ import { EmployeeActionsTypes, ActEvent } from '../../../state/employee.state'; }) export class EmployeesNavbarComponent implements OnInit { - @Output() evtEmit:EventEmitter=new EventEmitter(); - constructor() { } + constructor(private evDriveService:EventDriverService) { } ngOnInit(): void { } onGetAllEmployees() { - this.evtEmit.emit({type:EmployeeActionsTypes.GET_ALL_EMPLOYEES}); + this.evDriveService.publishEvent({type:EmployeeActionsTypes.GET_ALL_EMPLOYEES}); } onSearch(val:any) { - this.evtEmit.emit({type:EmployeeActionsTypes.SEARCH_EMPLOYEES, payload:val}); + this.evDriveService.publishEvent({type:EmployeeActionsTypes.SEARCH_EMPLOYEES, payload:val}); } onNewEmployee() { - this.evtEmit.emit({type:EmployeeActionsTypes.NEW_EMPLOYEE}); + this.evDriveService.publishEvent({type:EmployeeActionsTypes.NEW_EMPLOYEE}); } } diff --git a/src/app/components/employees/employees.component.html b/src/app/components/employees/employees.component.html index 7cc757e..51814f3 100644 --- a/src/app/components/employees/employees.component.html +++ b/src/app/components/employees/employees.component.html @@ -1,2 +1,2 @@ - - + + diff --git a/src/app/components/employees/employees.component.ts b/src/app/components/employees/employees.component.ts index 9868e84..d9b8d0b 100644 --- a/src/app/components/employees/employees.component.ts +++ b/src/app/components/employees/employees.component.ts @@ -1,8 +1,9 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, OnDestroy } from '@angular/core'; import { EmployeesService } from '../../services/employees.service'; +import { EventDriverService } from '../../services/event.driver.service'; import { Employee } from '../../model/employee.model'; import { AppDataState, DataStateEnum, EmployeeActionsTypes, ActEvent } from '../../state/employee.state'; -import { Observable, of } from 'rxjs'; +import { Observable, of, Subscription } from 'rxjs'; import { catchError, map, startWith } from 'rxjs/operators'; import { Router } from '@angular/router'; @@ -11,13 +12,23 @@ import { Router } from '@angular/router'; templateUrl: './employees.component.html', styleUrls: ['./employees.component.css'] }) -export class EmployeesComponent implements OnInit { +export class EmployeesComponent implements OnInit, OnDestroy { employees$:Observable>|null=null; readonly DataStateEnum=DataStateEnum; + sub:Subscription; - constructor(private employeesService:EmployeesService, private router:Router) { } + constructor(private employeesService:EmployeesService, private router:Router, private evDriveService:EventDriverService) { + } - ngOnInit(): void { } + ngOnInit(): void { + this.sub=this.evDriveService.sourceEventSubjectObservable.subscribe((actionEv:ActEvent)=>{ + this.onActionEvent(actionEv); + }); + } + + ngOnDestroy(): void { + this.sub.unsubscribe(); + } onActionEvent($event: ActEvent) { switch($event.type) { @@ -68,10 +79,13 @@ export class EmployeesComponent implements OnInit { } onDelete(val:Employee) { - this.employeesService.deleteEmployee(val).subscribe( - data=>{ - this.onGetAllEmployees(); - }); + let v=confirm("Etes vous sûre?"); + if(v==true) { + this.employeesService.deleteEmployee(val).subscribe( + data=>{ + this.onGetAllEmployees(); + }); + } } onNewEmployee() { diff --git a/src/app/services/event.driver.service.ts b/src/app/services/event.driver.service.ts new file mode 100644 index 0000000..5d2fed7 --- /dev/null +++ b/src/app/services/event.driver.service.ts @@ -0,0 +1,13 @@ +import { Injectable } from '@angular/core'; +import { Subject } from 'rxjs'; +import { ActEvent } from '../state/employee.state'; + +@Injectable({providedIn:"root"}) +export class EventDriverService { + sourceEventSubject:Subject=new Subject(); + sourceEventSubjectObservable=this.sourceEventSubject.asObservable(); + + publishEvent(event:ActEvent) { + this.sourceEventSubject.next(event); + } +} diff --git a/src/app/state/employee.state.ts b/src/app/state/employee.state.ts index f328337..d8e1cf0 100644 --- a/src/app/state/employee.state.ts +++ b/src/app/state/employee.state.ts @@ -8,7 +8,8 @@ export enum EmployeeActionsTypes { export interface ActEvent { type:EmployeeActionsTypes, - payload?:any + payload?:any, + errMsg?:string } export enum DataStateEnum { diff --git a/tsconfig.json b/tsconfig.json index f531992..0f091e0 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -10,6 +10,7 @@ "noPropertyAccessFromIndexSignature": true, "noImplicitReturns": true, "noFallthroughCasesInSwitch": true, + "strictPropertyInitialization": false, "sourceMap": true, "declaration": false, "downlevelIteration": true,