ajout de la page de logs

This commit is contained in:
2022-10-23 15:37:07 +02:00
parent 0d7a859adb
commit a39f6b02df
13 changed files with 204 additions and 6 deletions

View File

@@ -7,6 +7,7 @@ import { AccountComponent } from './components/home/workspace/account/account.co
import { ParametresComponent } from './components/home/workspace/parametres/parametres.component';
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 { ProfileService } from './services/profile/profile.service';
@@ -34,6 +35,10 @@ const routes: Routes = [
{
path:"hours",
component:HoursComponent
},
{
path:"logs",
component:LogsComponent
}
],
canActivate: [ProfileService]

View File

@@ -28,6 +28,7 @@ import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatGridListModule } from '@angular/material/grid-list';
import { MatTabsModule } from '@angular/material/tabs';
import { ToastrModule } from 'ngx-toastr';
import { CodeInputModule } from 'angular-code-input';
@@ -42,6 +43,7 @@ import { AccountComponent } from './components/home/workspace/account/account.co
import { ParametresComponent } from './components/home/workspace/parametres/parametres.component';
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';
@NgModule({
declarations: [
@@ -53,7 +55,8 @@ import { HoursComponent } from './components/home/workspace/hours/hours.componen
AccountComponent,
ParametresComponent,
InfosComponent,
HoursComponent
HoursComponent,
LogsComponent
],
imports: [
BrowserModule,
@@ -85,6 +88,7 @@ import { HoursComponent } from './components/home/workspace/hours/hours.componen
MatStepperModule,
MatSlideToggleModule,
MatGridListModule,
MatTabsModule,
FlexLayoutModule,
RouterModule,
FontAwesomeModule,

View File

@@ -11,6 +11,7 @@
<a href="/parameters" mat-button>Paramètres</a>
<a href="/hours" mat-button>Horaires</a>
<a href="/infos" mat-button>Informations</a>
<a href="/logs" mat-button>Logs</a>
<a href="/logout" mat-button>Déconnecter</a>
</div>
</mat-toolbar-row>
@@ -19,8 +20,6 @@
<mat-sidenav-container fxFlexFill>
<mat-sidenav #sidenav>
<mat-nav-list>
<!--<a (click)="sidenav.toggle()" href="" mat-list-item>Fermer</a>
<mat-divider></mat-divider>-->
<div fxLayout="column" fxLayoutAlign="center start">
<button mat-button routerLink="/account" class="menu-button">
<mat-icon>account_circle</mat-icon>
@@ -38,6 +37,10 @@
<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">

View File

@@ -0,0 +1,47 @@
.container {
/* display: flex; */
/*background-color: #b8b8b8;*/
margin-bottom: 100px;
overflow-x: hidden;
overflow-y: auto;
}
.process {
width: 100%;
height: 75%;
}
.mat-card.scrollable-content {
overflow: hidden;
display: flex;
flex-direction: column;
margin-top: 0.2rem;
margin-left: 0.5rem;
margin-right: 0.5rem;
height: 80%;
}
.mat-card.scrollable-content > .mat-card-content {
overflow-y: hidden;
overflow-x: hidden;
}
div.DEBUG {
margin-bottom: 0.2rem;
background-color: lightblue;
}
div.INFO {
margin-bottom: 0.2rem;
background-color: lightgreen;
}
div.WARNING {
margin-bottom: 0.2rem;
background-color: orange;
}
div.ERROR {
margin-bottom: 0.2rem;
background-color: red;
}

View File

@@ -0,0 +1,26 @@
<mat-tab-group animationDuration="0ms" (selectedTabChange)="onTabChanged($event)">
<mat-tab label="Configurateur.log">
<div *ngIf="isProcessing" class="process"
fxLayout="column"
fxLayoutAlign="space-around center">
<mat-spinner></mat-spinner>
</div>
<div *ngIf="!isProcessing" class="container"
fxLayout="column"
fxLayoutAlign="space-around center">
<mat-card class="scrollable-content">
<mat-card-content #myList>
<ng-container *ngIf="confLogs">
<div *ngFor="let log of confLogs; let last = last" class={{log.gravity}}>
{{log.datetime}} - {{log.msg}}<br>
{{last ? scrollToBottom(): ''}}
</div>
</ng-container>
</mat-card-content>
</mat-card>
</div>
</mat-tab>
<mat-tab label="KineIntercom.log">
plop2
</mat-tab>
</mat-tab-group>

View File

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

View File

@@ -0,0 +1,57 @@
import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
import { Router } from '@angular/router';
import { BackendService } from '../../../../services/backend/backend.service';
import { Log } from '../../../../models/log.model';
import { ToastrService } from 'ngx-toastr';
@Component({
selector: 'app-logs',
templateUrl: './logs.component.html',
styleUrls: ['./logs.component.css']
})
export class LogsComponent implements OnInit {
isProcessing:boolean = true;
confLogs:Log[];
appLogs:Log[];
//@ViewChild('myList') myList: ElementRef;
gravity:string[] = ['DEBUG', 'INFO', 'WARNING', 'ERROR'];
constructor( private bs:BackendService,
private router:Router,
private toast:ToastrService ) { }
ngOnInit(): void {
this.isProcessing = false;
}
scrollToBottom(): void {
//this.myList.nativeElement.scrollTop = this.myList.nativeElement.scrollHeight;
console.log("plop");
}
onTabChanged(event:any): void {
switch(event.tab.textLabel) {
case 'Configurateur.log':
console.log("configurateur");
this.bs.retreiveConfLogs().subscribe(
(datas:Log[]) => {
this.confLogs = datas;
this.isProcessing = false;
}, err => {
if(err.status == 401) {
this.router.navigateByUrl("/login");
} else {
this.toast.error("Erreur de mise à jour des horaires");
}
}
);
break;
case 'KineIntercom.log':
console.log("kineintercom");
break;
default:
break;
}
}
}

View File

@@ -8,6 +8,10 @@
/*::-webkit-scrollbar { display: none; }*/
.process {
width: 100%;
height: 75%;
}
form {
width: 70%;

View File

@@ -1,4 +1,9 @@
<div class="container"
<div *ngIf="isProcessing" class="process"
fxLayout="column"
fxLayoutAlign="space-around center">
<mat-spinner></mat-spinner>
</div>
<div *ngIf="!isProcessing" class="container"
fxLayout="column"
fxLayoutAlign="space-around center">
<!-- Params Form -->

View File

@@ -16,6 +16,7 @@ export class ParametresComponent implements OnInit {
slideDisable:boolean=false;
pinChecked:boolean=false;
pinNumber:string="0000";
isProcessing:boolean = true;
constructor(private fb:FormBuilder,
private bs:BackendService,
@@ -51,8 +52,10 @@ export class ParametresComponent implements OnInit {
this.slideDisable = data.pin_actif;
this.pinChecked = data.pin_actif;
this.pinNumber = data.code_pin;
this.isProcessing = false;
}, err => {
this.toast.error("Erreur de récupération des paramètres");
this.isProcessing = false;
}
);
}

View File

@@ -0,0 +1,6 @@
export interface Log {
datetime:string;
header:string;
gravity:string;
msg:string;
}

View File

@@ -5,6 +5,7 @@ import { environment } from '../../../environments/environment';
import { Utilisateur } from '../../models/utilisateur.model';
import { Parameters } from '../../models/parameters.model';
import { Scheduler } from '../../models/scheduler.model';
import { Log } from '../../models/log.model';
@Injectable({
providedIn: 'root'
@@ -115,4 +116,16 @@ export class BackendService {
return this.http.post<any>(host+"/api/configurateur/update_schedulers", val, options);
}
retreiveConfLogs():Observable<Log[]> {
let host=environment.host;
const options = {
headers: new HttpHeaders({
'Content-Type' : 'application/json',
}),
withCredentials: true
};
return this.http.get<Log[]>(host+"/api/configurateur/conf_logs", options);
}
}