diff --git a/client/stillbox/src/app/incidents/incident/incident.component.html b/client/stillbox/src/app/incidents/incident/incident.component.html index 9c19fe7..b60261d 100644 --- a/client/stillbox/src/app/incidents/incident/incident.component.html +++ b/client/stillbox/src/app/incidents/incident/incident.component.html @@ -2,7 +2,17 @@

{{ inc?.name }}

- edit + + + + +
Start
diff --git a/client/stillbox/src/app/incidents/incident/incident.component.scss b/client/stillbox/src/app/incidents/incident/incident.component.scss index 7e8578f..08e0820 100644 --- a/client/stillbox/src/app/incidents/incident/incident.component.scss +++ b/client/stillbox/src/app/incidents/incident/incident.component.scss @@ -21,6 +21,7 @@ .cardHdr { display: flex; flex-flow: row wrap; + margin-bottom: 24px; } .field { @@ -37,6 +38,7 @@ .cardHdr h1 { flex: 1 1; + margin: 0; } .cardHdr a { diff --git a/client/stillbox/src/app/incidents/incident/incident.component.ts b/client/stillbox/src/app/incidents/incident/incident.component.ts index 823fee8..944fe04 100644 --- a/client/stillbox/src/app/incidents/incident/incident.component.ts +++ b/client/stillbox/src/app/incidents/incident/incident.component.ts @@ -1,6 +1,6 @@ import { Component, inject } from '@angular/core'; import { tap } from 'rxjs/operators'; -import { CommonModule } from '@angular/common'; +import { CommonModule, Location } from '@angular/common'; import { BehaviorSubject, merge, Subscription } from 'rxjs'; import { Observable } from 'rxjs'; import { @@ -38,6 +38,7 @@ import { } from '../../calls/calls.component'; import { CallPlayerComponent } from '../../calls/player/call-player/call-player.component'; import { FmtDatePipe } from '../incidents.component'; +import { MatMenuModule } from '@angular/material/menu'; export interface EditDialogData { incID: string; @@ -144,6 +145,7 @@ export class IncidentEditDialogComponent { CallPlayerComponent, FmtDatePipe, MatTableModule, + MatMenuModule, ], templateUrl: './incident.component.html', styleUrl: './incident.component.scss', @@ -171,6 +173,7 @@ export class IncidentComponent { constructor( private route: ActivatedRoute, private incSvc: IncidentsService, + private location: Location, ) {} saveIncName(ev: Event) {} @@ -197,6 +200,19 @@ export class IncidentComponent { dialogRef.afterClosed().subscribe(this.incPrime); } + deleteIncident(incID: string) { + if (confirm('Are you sure you want to delete this incident?')) { + this.incSvc.deleteIncident(incID).subscribe({ + next: () => { + this.location.back(); + }, + error: (err) => { + alert(err); + }, + }); + } + } + ngOnDestroy() { this.subscriptions.unsubscribe(); } diff --git a/client/stillbox/src/styles.scss b/client/stillbox/src/styles.scss index 7d6fd0b..c0d1767 100644 --- a/client/stillbox/src/styles.scss +++ b/client/stillbox/src/styles.scss @@ -6,6 +6,7 @@ // Include the common styles for Angular Material. We include this here so that you only // have to load a single css file for Angular Material in your app. // Be sure that you only ever include this mixin once! +@include mat.core(); @include mat.elevation-classes(); @include mat.app-background(); @@ -237,3 +238,8 @@ textarea { margin-bottom: 40px; justify-content: center; } + +.mat-mdc-menu-item.deleteItem { + color: white; + background-color: red; +}