Usiung a type instead of a header in flashmessages

This commit is contained in:
2023-02-12 16:16:49 +01:00
parent 97c758fa4f
commit d4e1acb4e5
2 changed files with 39 additions and 12 deletions

View File

@@ -1,5 +1,18 @@
<ngb-toast <ngb-toast
*ngFor="let flashmessage of flashmessagesService.toasts" *ngFor="let flashmessage of flashmessagesService.toasts"
[header]="flashmessage.header" [autohide]="true" [delay]="flashmessage.delay || 5000" [header]="flashmessage.type" [autohide]="true" [delay]="flashmessage.delay || 1500"
(hiddden)="flashmessagesService.remove(flashmessage)" (hiddden)="flashmessagesService.remove(flashmessage)"
>{{flashmessage.body}}</ngb-toast> >
<ng-container [ngSwitch]="flashmessage.type">
<div *ngSwitchCase="'Success'" class="alert alert-success" role="alert">
{{flashmessage.body}}
</div>
<div *ngSwitchCase="'Info'" class="alert alert-primary" role="alert">
{{flashmessage.body}}
</div>
<div *ngSwitchCase="'Error'" class="alert alert-danger" role="alert">
{{flashmessage.body}}
</div>
</ng-container>
</ngb-toast>

View File

@@ -1,20 +1,34 @@
import {Injectable} from "@angular/core"; import {Injectable} from "@angular/core";
export interface Flashmessage { export interface Flashmessage {
header: string; body: string;
body: string; delay?: number;
delay?: number; type: "Error"|"Success"|"Info";
} }
@Injectable({ providedIn: 'root' }) @Injectable({ providedIn: 'root' })
export class FlashmessagesService { export class FlashmessagesService {
toasts: Flashmessage[] = []; toasts: Flashmessage[] = [];
show(header: string, body: string) { success(body: string) {
this.toasts.push({ header, body }); this.show("Success", body);
} }
remove(toast: Flashmessage) { error(body: string) {
this.toasts = this.toasts.filter(t => t != toast); this.show("Error", body);
} }
show(type: string, body: string) {
if (type == "Success") {
this.toasts.push({ type, body });
} else if (type == "Error") {
this.toasts.push({ type, body });
} else {
this.toasts.push({ type: "Info", body });
}
}
remove(toast: Flashmessage) {
this.toasts = this.toasts.filter(t => t != toast);
}
} }