Got the tv requests panel working!

pull/3895/head
Jamie Rees 6 years ago
parent b68e9fc080
commit 9fae71d32c

@ -1,78 +1,79 @@
<mat-accordion class="mat-elevation-z8">
<mat-expansion-panel *ngFor="let request of tvRequest">
<mat-expansion-panel-header>
<mat-panel-title>
<div *ngIf="request.approved && !request.available">{{'Common.ProcessingRequest' | translate}}</div>
<div *ngIf="request.requested && !request.approved && !request.available">
{{'Common.PendingApproval' | translate}}
</div>
<div *ngIf="!request.requested && !request.available && !request.approved">
{{'Common.NotRequested' | translate}}
</div>
<div *ngIf="request.available">{{'Common.Available' | translate}}
</div>
</mat-panel-title>
<mat-panel-description>
Requested By '{{request.requestedUser.userAlias}}' on
{{request.requestedDate | amLocal | amDateFormat: 'LL' }}
</mat-panel-description>
</mat-expansion-panel-header>
<mat-tab-group *ngFor="let season of request.seasonRequests">
<mat-tab label="{{ 'Requests.Season' | translate }} {{season.seasonNumber}}">
<table mat-table [dataSource]="season.episodes" class="mat-elevation-z8">
<ng-container matColumnDef="number">
<th mat-header-cell *matHeaderCellDef> {{ 'Requests.Number' | translate }} </th>
<td mat-cell *matCellDef="let element"> {{element.episodeNumber}} </td>
</ng-container>
<ng-container matColumnDef="title">
<th mat-header-cell *matHeaderCellDef> {{ 'Requests.GridTitle' | translate }} </th>
<td mat-cell *matCellDef="let element"> {{element.title}} </td>
</ng-container>
<ng-container matColumnDef="airDate">
<th mat-header-cell *matHeaderCellDef> {{ 'Requests.AirDate' | translate }} </th>
<td mat-cell *matCellDef="let element"> {{element.airDate | amLocal | amDateFormat: 'L' }}</td>
</ng-container>
<ng-container matColumnDef="status">
<th mat-header-cell *matHeaderCellDef> {{ 'Requests.GridStatus' | translate }} </th>
<td mat-cell *matCellDef="let ep">
<span *ngIf="request.denied" class="label label-danger" id="deniedLabel"
[translate]="'Common.Denied'">
<i class="fa fa-check" matTooltip="{{request.deniedReason}}"></i>
</span>
<span *ngIf="!request.denied && ep.available" class="label label-success"
id="availableLabel" [translate]="'Common.Available'"></span>
<span *ngIf="!request.denied &&ep.approved && !ep.available" class="label label-info"
id="processingRequestLabel" [translate]="'Common.ProcessingRequest'"></span>
<div *ngIf="!request.denied && !ep.approved">
<div *ngIf="!ep.available"><span class="label label-warning" id="pendingApprovalLabel"
[translate]="'Common.PendingApproval'"></span></div>
</div>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-tab>
</mat-tab-group>
<button mat-raised-button color="accent">Approve</button>
</mat-expansion-panel>
</mat-accordion>
<mat-expansion-panel *ngFor="let request of tvRequest">
<mat-expansion-panel-header>
<mat-panel-title>
<div *ngIf="request.approved && !request.available && !request.denied">{{'Common.ProcessingRequest' | translate}}</div>
<div *ngIf="request.denied && !request.available">{{'Common.Denied' | translate}}</div>
<div *ngIf="request.requested && !request.approved && !request.available">
{{'Common.PendingApproval' | translate}}
</div>
<div *ngIf="!request.requested && !request.available && !request.approved">
{{'Common.NotRequested' | translate}}
</div>
<div *ngIf="request.available">{{'Common.Available' | translate}}
</div>
</mat-panel-title>
<mat-panel-description>
Requested By '{{request.requestedUser.userAlias}}' on
{{request.requestedDate | amLocal | amDateFormat: 'LL' }}
<span *ngIf="request.denied"> - {{request.deniedReason}}</span>
</mat-panel-description>
</mat-expansion-panel-header>
<mat-tab-group>
<mat-tab *ngFor="let season of request.seasonRequests" label="{{ 'Requests.Season' | translate }} {{season.seasonNumber}}">
<table mat-table [dataSource]="season.episodes" class="mat-elevation-z8">
<ng-container matColumnDef="number">
<th mat-header-cell *matHeaderCellDef> {{ 'Requests.Number' | translate }} </th>
<td mat-cell *matCellDef="let element"> {{element.episodeNumber}} </td>
</ng-container>
<ng-container matColumnDef="title">
<th mat-header-cell *matHeaderCellDef> {{ 'Requests.GridTitle' | translate }} </th>
<td mat-cell *matCellDef="let element"> {{element.title}} </td>
</ng-container>
<ng-container matColumnDef="airDate">
<th mat-header-cell *matHeaderCellDef> {{ 'Requests.AirDate' | translate }} </th>
<td mat-cell *matCellDef="let element"> {{element.airDate | amLocal | amDateFormat: 'L' }}</td>
</ng-container>
<ng-container matColumnDef="status">
<th mat-header-cell *matHeaderCellDef> {{ 'Requests.GridStatus' | translate }} </th>
<td mat-cell *matCellDef="let ep">
<span *ngIf="request.denied" id="deniedLabel" [translate]="'Common.Denied'">
</span>
<span *ngIf="!request.denied && ep.available" id="availableLabel" [translate]="'Common.Available'"></span>
<span *ngIf="!request.denied &&ep.approved && !ep.available" class="label label-info" id="processingRequestLabel"
[translate]="'Common.ProcessingRequest'"></span>
<div *ngIf="!request.denied && !ep.approved">
<div *ngIf="!ep.available"><span class="label label-warning" id="pendingApprovalLabel" [translate]="'Common.PendingApproval'"></span></div>
</div>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-tab>
</mat-tab-group>
<div *ngIf="isAdmin">
<button *ngIf="!request.approved" mat-raised-button color="accent" (click)="approve(request);"> {{ 'Common.Approve' | translate }}</button>
<button *ngIf="!request.available" mat-raised-button color="warn" (click)="changeAvailability(request, true);">{{ 'Requests.MarkAvailable' | translate }}</button>
<button *ngIf="request.available" mat-raised-button color="warn" (click)="changeAvailability(request, false);">{{ 'Requests.MarkUnavailable' | translate }}</button>
<button *ngIf="!request.denied" mat-raised-button color="danger" (click)="deny(request);">{{ 'Requests.Deny' | translate }}</button>
</div>
</mat-expansion-panel>
</mat-accordion>

@ -1,16 +1,87 @@
import { Component, ViewEncapsulation, Input, OnInit } from "@angular/core";
import { IChildRequests } from "../../../../../interfaces";
import { Component, Input } from "@angular/core";
import { IChildRequests, RequestType } from "../../../../../interfaces";
import { RequestService } from "../../../../../services/request.service";
import { MessageService } from "../../../../../services";
import { MatDialog } from "@angular/material";
import { DenyDialogComponent } from "../../../shared/deny-dialog/deny-dialog.component";
@Component({
templateUrl: "./tv-requests-panel.component.html",
styleUrls: ["./tv-requests-panel.component.scss"],
selector: "tv-requests-panel"
})
export class TvRequestsPanelComponent implements OnInit {
export class TvRequestsPanelComponent {
@Input() public tvRequest: IChildRequests[];
@Input() public isAdmin: boolean;
public displayedColumns: string[] = ['number', 'title', 'airDate', 'status'];
public ngOnInit(): void {
//
constructor(private requestService: RequestService, private messageService: MessageService,
public dialog: MatDialog) {
}
public async approve(request: IChildRequests) {
const result = await this.requestService.approveChild({
id: request.id
}).toPromise();
if (result.result) {
request.approved = true;
request.denied = false;
request.seasonRequests.forEach((season) => {
season.episodes.forEach((ep) => {
ep.approved = true;
});
});
this.messageService.send("Request has been approved", "Ok");
} else {
this.messageService.send(result.errorMessage, "Ok");
}
}
public changeAvailability(request: IChildRequests, available: boolean) {
request.available = available;
request.seasonRequests.forEach((season) => {
season.episodes.forEach((ep) => {
ep.available = available;
});
});
if (available) {
this.requestService.markTvAvailable({ id: request.id }).subscribe(x => {
if (x.result) {
this.messageService.send(
`This request is now available`);
} else {
this.messageService.send("Request Available", x.message ? x.message : x.errorMessage);
request.approved = false;
}
});
} else {
this.requestService.markTvUnavailable({ id: request.id }).subscribe(x => {
if (x.result) {
this.messageService.send(
`This request is now unavailable`);
} else {
this.messageService.send("Request Available", x.message ? x.message : x.errorMessage);
request.approved = false;
}
});
}
}
public async deny(request: IChildRequests) {
const dialogRef = this.dialog.open(DenyDialogComponent, {
width: '250px',
data: {requestId: request.id, requestType: RequestType.tvShow}
});
dialogRef.afterClosed().subscribe(result => {
request.denied = true;
request.seasonRequests.forEach((season) => {
season.episodes.forEach((ep) => {
ep.approved = false;
});
});
});
}
}

@ -78,7 +78,7 @@
Requests
</mat-panel-title>
</mat-expansion-panel-header>
<tv-requests-panel [tvRequest]="tvRequest"></tv-requests-panel>
<tv-requests-panel [tvRequest]="tvRequest" [isAdmin]="isAdmin"></tv-requests-panel>
</mat-expansion-panel>
</mat-accordion>

@ -1,4 +1,4 @@
import { Component, ViewEncapsulation } from "@angular/core";
import { Component, ViewEncapsulation, OnInit } from "@angular/core";
import { ImageService, SearchV2Service, MessageService, RequestService } from "../../../services";
import { ActivatedRoute } from "@angular/router";
import { DomSanitizer } from "@angular/platform-browser";
@ -7,31 +7,39 @@ import { MatDialog } from "@angular/material";
import { YoutubeTrailerComponent } from "../shared/youtube-trailer.component";
import { EpisodeRequestComponent } from "../../../shared/episode-request/episode-request.component";
import { IChildRequests } from "../../../interfaces";
import { AuthService } from "../../../auth/auth.service";
@Component({
templateUrl: "./tv-details.component.html",
styleUrls: ["../../media-details.component.scss"],
encapsulation: ViewEncapsulation.None
})
export class TvDetailsComponent {
export class TvDetailsComponent implements OnInit {
public tv: ISearchTvResultV2;
public tvRequest: IChildRequests[];
public fromSearch: boolean;
public isAdmin: boolean;
private tvdbId: number;
constructor(private searchService: SearchV2Service, private route: ActivatedRoute,
private sanitizer: DomSanitizer, private imageService: ImageService,
public dialog: MatDialog, public messageService: MessageService, private requestService: RequestService) {
public dialog: MatDialog, public messageService: MessageService, private requestService: RequestService,
private auth: AuthService) {
this.route.params.subscribe((params: any) => {
this.tvdbId = params.tvdbId;
this.fromSearch = params.search;
this.load();
});
}
public async ngOnInit() {
await this.load();
}
public async load() {
this.isAdmin = this.auth.hasRole("admin") || this.auth.hasRole("poweruser");
if (this.fromSearch) {
this.tv = await this.searchService.getTvInfoWithMovieDbId(this.tvdbId);
this.tvdbId = this.tv.id;
@ -39,7 +47,7 @@ export class TvDetailsComponent {
this.tv = await this.searchService.getTvInfo(this.tvdbId);
}
if(this.tv.requestId) {
if (this.tv.requestId) {
this.tvRequest = await this.requestService.getChildRequests(this.tv.requestId).toPromise();
}

Loading…
Cancel
Save