Pages/shows: implement delete button
This commit is contained in:
parent
1b19988279
commit
4b10d3d056
2 changed files with 29 additions and 2 deletions
|
|
@ -6,7 +6,7 @@
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<h5 class="card-title">{{ show.title }}</h5>
|
<h5 class="card-title">{{ show.title }}</h5>
|
||||||
<p class="card-text">{{ show.date | date }}</p>
|
<p class="card-text">{{ show.date | date }}</p>
|
||||||
<button type="button" class="btn btn-outline-danger">
|
<button type="button" class="btn btn-outline-danger" (click)="deleteShow(show)">
|
||||||
<i class="bi bi-trash"></i>
|
<i class="bi bi-trash"></i>
|
||||||
</button>
|
</button>
|
||||||
<button type="button" class="btn btn-outline-warning">
|
<button type="button" class="btn btn-outline-warning">
|
||||||
|
|
|
||||||
|
|
@ -4,10 +4,12 @@ import {Show} from '../../interfaces/show';
|
||||||
import {ShowsApiResponse} from '../../interfaces/shows-api-response';
|
import {ShowsApiResponse} from '../../interfaces/shows-api-response';
|
||||||
import {Toast} from '../../interfaces/toast';
|
import {Toast} from '../../interfaces/toast';
|
||||||
import {ToastService} from '../../services/toast/toast.service';
|
import {ToastService} from '../../services/toast/toast.service';
|
||||||
import {NgbModal} from '@ng-bootstrap/ng-bootstrap';
|
import {NgbModal, NgbModalRef} from '@ng-bootstrap/ng-bootstrap';
|
||||||
import {CreateModalComponent} from '../../components/create-modal/create-modal/create-modal.component';
|
import {CreateModalComponent} from '../../components/create-modal/create-modal/create-modal.component';
|
||||||
import {DatePipe} from '@angular/common';
|
import {DatePipe} from '@angular/common';
|
||||||
import {ShowsApiIdResponse} from '../../interfaces/shows-api-id-response';
|
import {ShowsApiIdResponse} from '../../interfaces/shows-api-id-response';
|
||||||
|
import {DeleteModalComponent} from '../../components/delete-modal/delete-modal.component';
|
||||||
|
import {ShowsApiDeletion} from '../../interfaces/shows-api-deletion';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-shows',
|
selector: 'app-shows',
|
||||||
|
|
@ -60,4 +62,29 @@ export class ShowsComponent {
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
deleteShow(show: Show) {
|
||||||
|
let modal: NgbModalRef = this.modalService.open(DeleteModalComponent)
|
||||||
|
modal.componentInstance.showName = show.title;
|
||||||
|
modal.result.then(
|
||||||
|
(result) => {
|
||||||
|
if (result) {
|
||||||
|
this.api.deleteShw(show._id).subscribe({
|
||||||
|
next: (response: ShowsApiDeletion) => {
|
||||||
|
// Do nothing
|
||||||
|
}, error: (err: any) => {
|
||||||
|
console.log(err)
|
||||||
|
}, complete: () => {
|
||||||
|
this.toastService.show({body: "Show deleted!"})
|
||||||
|
this.shows = this.shows.filter(((s: Show) => s != show))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
(result) => {
|
||||||
|
// Dismissed, do nothing
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue