ajout du bouton d'extinction du système et de sa fenêtre de confirmation

src/app/app.module.ts

@@ -46,6 +46,7 @@ import { ParametresComponent } from './components/home/workspace/parametres/para
 import { InfosComponent } from './components/home/workspace/infos/infos.component';
 import { HoursComponent } from './components/home/workspace/hours/hours.component';
 import { LogsComponent } from './components/home/workspace/logs/logs.component';
+import { ConfirmComponent } from './components/dialog/confirm/confirm.component';
 
 @NgModule({
 	declarations: [
@@ -58,7 +59,8 @@ import { LogsComponent } from './components/home/workspace/logs/logs.component';
 		ParametresComponent,
 		InfosComponent,
 		HoursComponent,
-  		LogsComponent
+		LogsComponent,
+		ConfirmComponent
 	],
 	imports: [
 		BrowserModule,

src/app/components/dialog/confirm/confirm.component.css

@@ -0,0 +1,8 @@
+.mat-dialog-container {
+	background-color: lightblue;
+}
+
+.mat-raised-button {
+	margin-left: 1rem;
+	margin-right: 1rem;
+}

src/app/components/dialog/confirm/confirm.component.html

@@ -0,0 +1,8 @@
+<h2 mat-dialog-title>{{title}}</h2>
+<mat-dialog-content>
+	{{text}}
+</mat-dialog-content>
+<mat-dialog-actions align="center">
+	<button mat-raised-button color="warn" (click)="sendAnswer(false)">{{labelNOK}}</button>
+	<button mat-raised-button color="primary" (click)="sendAnswer(true)">{{labelOK}}</button>
+</mat-dialog-actions>

src/app/components/dialog/confirm/confirm.component.spec.ts

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

src/app/components/dialog/confirm/confirm.component.ts

@@ -0,0 +1,31 @@
+import { Component, OnInit, Inject } from '@angular/core';
+import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
+
+@Component({
+	selector: 'app-confirm',
+	templateUrl: './confirm.component.html',
+	styleUrls: ['./confirm.component.css']
+})
+export class ConfirmComponent implements OnInit {
+	title:string;
+	text:string;
+	labelOK: string;
+	labelNOK: string;
+
+	constructor(
+		@Inject(MAT_DIALOG_DATA) public data:any,
+		public dialogRef: MatDialogRef<ConfirmComponent>
+	) {
+		this.title = data.title;
+		this.text = data.text;
+		this.labelOK = data.labelOK;
+		this.labelNOK = data.labelNOK;
+	}
+
+	ngOnInit(): void {
+	}
+
+	sendAnswer(val:boolean): void {
+		this.dialogRef.close(val);
+	}
+}

src/app/components/home/home.component.css

@@ -4,4 +4,6 @@
 
 .menu-button {
 	padding: 0.5rem 1.5rem 0.2rem 0.5rem;
+	width: 100%;
+	text-align: start;
 }

src/app/components/home/home.component.html

@@ -20,27 +20,27 @@
 <mat-sidenav-container fxFlexFill>
 	<mat-sidenav #sidenav>
 		<mat-nav-list>
-			<div fxLayout="column" fxLayoutAlign="center start">
-			<button mat-button routerLink="/account" class="menu-button">
-				<mat-icon>account_circle</mat-icon>
-				<span>  Compte</span>
-			</button>
-			<button mat-button routerLink="/parameters" class="menu-button">
-				<mat-icon>build</mat-icon>
-				<span>  Paramètres</span>
-			</button>
-			<button mat-button routerLink="/hours" class="menu-button">
-				<mat-icon>calendar_today</mat-icon>
-				<span>  Horaires</span>
-			</button>
-			<button mat-button routerLink="/infos" class="menu-button">
-				<mat-icon>perm_device_information</mat-icon>
-				<span>  Informations</span>
-			</button>
-			<button mat-button routerLink="/logs" class="menu-button">
-				<mat-icon>list_alt</mat-icon>
-				<span>  Logs</span>
-			</button>
+			<div fxLayout="column" fxLayoutAlign="start start">
+				<button mat-button routerLink="/account" class="menu-button">
+					<mat-icon>account_circle</mat-icon>
+					<span>  Compte</span>
+				</button>
+				<button mat-button routerLink="/parameters" class="menu-button">
+					<mat-icon>build</mat-icon>
+					<span>  Paramètres</span>
+				</button>
+				<button mat-button routerLink="/hours" class="menu-button">
+					<mat-icon>calendar_today</mat-icon>
+					<span>  Horaires</span>
+				</button>
+				<button mat-button routerLink="/infos" class="menu-button">
+					<mat-icon>perm_device_information</mat-icon>
+					<span>  Informations</span>
+				</button>
+				<button mat-button routerLink="/logs" class="menu-button">
+					<mat-icon>list_alt</mat-icon>
+					<span>  Logs</span>
+				</button>
 			</div>
 			<mat-divider></mat-divider>
 			<button mat-button (click)="logout()" class="menu-button">

src/app/components/home/workspace/hours/hours.component.ts

@@ -71,9 +71,9 @@ export class HoursComponent implements OnInit {
 			days:this.schedule
 		};
 		if(this.defaultOp == "Manuel ON") {
-			this.setTimeoutDisabledButton(60);
+			this.setTimeoutDisabledButton(90);
 		} else {
-			this.setTimeoutDisabledButton(15);
+			this.setTimeoutDisabledButton(20);
 		}
 		this.bs.updateScheduler(sched).subscribe(
 			data => {

src/app/components/home/workspace/infos/infos.component.html

@@ -120,5 +120,6 @@
 			</div>
 		</mat-card-content>
 	</mat-card>
-	<button mat-raised-button color="warn" (click)="onReboot()">Redémarrer le système</button>
+	<button mat-raised-button color="accent" (click)="onReboot()"><b>Redémarrer le système</b></button>
+	<button mat-raised-button color="warn" (click)="onShutdown()"><b>Eteindre le système</b></button>
 </div>

src/app/components/home/workspace/infos/infos.component.ts

@@ -1,5 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import { Router } from '@angular/router';
+import { MatDialog } from '@angular/material/dialog';
+import { ConfirmComponent } from '../../../dialog/confirm/confirm.component';
 import { BackendService } from '../../../../services/backend/backend.service';
 import { Info } from '../../../../models/info.model';
 import { ToastrService } from 'ngx-toastr';
@@ -20,6 +22,7 @@ export class InfosComponent implements OnInit {
 
 	constructor( private bs:BackendService,
 			 private router:Router,
+			 public dialog: MatDialog,
 			 private toast:ToastrService ) { }
 
 	ngOnInit(): void {
@@ -90,4 +93,37 @@ export class InfosComponent implements OnInit {
 			}
 		)
 	}
+
+	onShutdown():void {
+		var title:string = "Confirmation";
+		let text:string = "Voulez-vous arrêter le système ?";
+		const myDialog = this.dialog.open(ConfirmComponent, {
+			disableClose: true,
+			data: {
+				title: title,
+				text: text,
+				labelOK: 'Confirmer',
+				labelNOK: 'Annuler'
+			}
+		});
+
+		myDialog.afterClosed().subscribe(
+			data => {
+				if(data) {
+					this.bs.shutdownSys().subscribe(
+						data => {
+							this.toast.info("Arrêt du système ...");
+							this.router.navigateByUrl("/login");
+						}, err => {
+							if(err.status == 401) {
+								this.router.navigateByUrl("/login");
+							} else {
+								this.toast.error(err.error.description);
+							}
+						}
+					)
+				}
+			}
+		);
+	}
 }

src/app/services/backend/backend.service.ts

@@ -171,4 +171,15 @@ export class BackendService {
 		};
 		return this.http.post<any>(host+"/api/configurateur/reboot", {}, options);
 	}
+
+	shutdownSys():Observable<any> {
+		let host=environment.host;
+		const options = {
+			headers: new HttpHeaders({
+				'Content-Type' : 'application/json',
+			}),
+			withCredentials: true
+		};
+		return this.http.post<any>(host+"/api/configurateur/shutdown", {}, options);
+	}
 }