Clean up Requests page code by moving children request to old component, remove additional REST calls when merging and update component names to make more sense.

This commit is contained in:
Dhruv Bhavsar 2017-08-26 14:11:04 -04:00
parent fc6e212fba
commit 56cf1b56cc
5 changed files with 14 additions and 193 deletions

View file

@ -12,9 +12,8 @@ import { ButtonModule, DialogModule } from 'primeng/primeng';
import { RequestComponent } from './request.component';
import { MovieRequestsComponent } from './movierequests.component';
import { TvRequestsComponent } from './tvrequests.component';
import { TvRequestManageComponent } from './tvrequest-manage.component';
//import { RequestGridComponent } from '../request-grid/request-grid.component';
// import { RequestCardComponent } from '../request-grid/request-card.component';
import { TvRequestChildrenComponent } from './tvrequest-children.component';
import { TreeTableModule } from 'primeng/primeng';
import { IdentityService } from '../services/identity.service';
@ -24,7 +23,7 @@ import { AuthGuard } from '../auth/auth.guard';
const routes: Routes = [
{ path: 'requests', component: RequestComponent, canActivate: [AuthGuard] },
{ path: 'requests/:id', component: TvRequestManageComponent, canActivate: [AuthGuard] },
{ path: 'requests/:id', component: TvRequestChildrenComponent, canActivate: [AuthGuard] },
];
@NgModule({
@ -42,7 +41,7 @@ const routes: Routes = [
RequestComponent,
MovieRequestsComponent,
TvRequestsComponent,
TvRequestManageComponent,
TvRequestChildrenComponent,
],
exports: [
RouterModule

View file

@ -1,25 +1,10 @@
<div *ngIf="childRequests">
<hr />
<div *ngFor="let child of childRequests">
<div class="col-md-12">
<div class="col-md-2">
<span>Requested By: {{child.requestedUser.userName}}</span>
<!--<div *ngFor="let season of child.seasonRequests">
<span>Season {{season.seasonNumber}}</span>
<div>Episodes:</div>
<span *ngFor="let episode of season.episodes">
<span [ngStyle]="{ 'color': getColour(episode) }">{{episode.episodeNumber}}</span>
</span>
<br />
<br />
</div>-->
</div>
@ -92,8 +77,6 @@
<span *ngIf="!ep.available" class="label label-danger">Not Yet Requested</span>
</ng-template>
</td>
</tr>
</tbody>
</table>

View file

@ -1,42 +1,17 @@
import { Component } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Component, Input } from '@angular/core';
import { RequestService } from '../services/request.service';
import { IdentityService } from '../services/identity.service';
import { IChildRequests, IEpisodesRequests, INewSeasonRequests } from '../interfaces/IRequestModel';
import { IChildRequests, IEpisodesRequests } from '../interfaces/IRequestModel';
@Component({
templateUrl: './tvrequest-manage.component.html'
selector:'tvrequests-children',
templateUrl: './tvrequest-children.component.html'
})
export class TvRequestManageComponent {
constructor(private requestService: RequestService, private identityService: IdentityService,
private route: ActivatedRoute) {
this.route.params
.subscribe(params => {
this.tvId = +params['id']; // (+) converts string 'id' to a number
this.requestService.getChildRequests(this.tvId).subscribe(x => {
this.childRequests = this.fixEpisodeSort(x);
});
});
this.isAdmin = this.identityService.hasRole('admin');
export class TvRequestChildrenComponent {
constructor(private requestService: RequestService) {
}
tvId: number;
childRequests: IChildRequests[];
isAdmin: boolean;
public fixEpisodeSort(items: IChildRequests[]) {
items.forEach(function (value) {
value.seasonRequests.forEach(function (requests: INewSeasonRequests) {
requests.episodes.sort(function (a: IEpisodesRequests, b: IEpisodesRequests) {
return a.episodeNumber - b.episodeNumber;
})
})
})
return items;
}
@Input() childRequests: IChildRequests[];
@Input() isAdmin: boolean;
public removeRequest(request: IChildRequests) {
this.requestService.deleteChild(request)
.subscribe();

View file

@ -65,145 +65,10 @@
</div>
<!--This is the section that holds the child seasons if they want to specify specific episodes-->
<div *ngIf="node.leaf">
<hr />
<div *ngIf="node.data">
<div *ngFor="let child of node.data">
<div class="col-md-12">
<div class="col-md-2">
<span>Requested By: {{child.requestedUser.userName}}</span>
</div>
<div class="col-md-1 col-md-push-9">
<!--// TODO ADMIN-->
<form>
<button style="text-align: right" *ngIf="child.CanApprove" (click)="approve(child)" class="btn btn-sm btn-success-outline" type="submit"><i class="fa fa-plus"></i> Approve</button>
</form>
<form>
<button type="button" (click)="deny(child)" class="btn btn-sm btn-danger-outline deny"><i class="fa fa-times"></i> Deny</button>
</form>
<form>
<button type="button" (click)="deny(child)" class="btn btn-sm btn-danger-outline deny"><i class="fa fa-times"></i> Remove</button>
</form>
</div>
</div>
<div class="col-md-12">
<ngb-tabset>
<div *ngFor="let season of child.seasonRequests">
<ngb-tab [id]="season.seasonNumber" [title]="season.seasonNumber">
<ng-template ngbTabContent>
<h2>Season: {{season.seasonNumber}}</h2>
<table class="table table-striped table-hover table-responsive table-condensed">
<thead>
<tr>
<th>
<a>
#
</a>
</th>
<th>
<a>
Title
</a>
</th>
<th>
<a>
Air Date
</a>
</th>
<th>
<a>
Status
</a>
</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let ep of season.episodes">
<td>
{{ep.episodeNumber}}
</td>
<td>
{{ep.title}}
</td>
<td>
{{ep.airDate | date: 'dd/MM/yyyy' }}
</td>
<td>
<span *ngIf="ep.available" class="label label-success">Available</span>
<span *ngIf="ep.approved && !ep.available" class="label label-info">Processing Request</span>
<div *ngIf="ep.requested && !ep.available; then requested else notRequested"></div>
<ng-template #requested>
<span *ngIf="!ep.available" class="label label-warning">Pending Approval</span>
</ng-template>
<ng-template #notRequested>
<span *ngIf="!ep.available" class="label label-danger">Not Yet Requested</span>
</ng-template>
</td>
</tr>
</tbody>
</table>
</ng-template>
</ngb-tab>
</div>
</ngb-tabset>
</div>
<br />
<br />
<hr />
</div>
</div>
<tvrequests-children [childRequests]="node.data" [isAdmin] ="isAdmin"></tvrequests-children>
</div>
</ng-template>
</p-column>
</p-treeTable>
<!--<div *ngFor="let request of tvRequests">-->
<!--<div class="row">
<div class="col-sm-2">
<img class="img-responsive poster" src="{{node.data.posterPath}}" alt="poster">
</div>
<div class="col-sm-5 ">
<div>
<a href="http://www.imdb.com/title/{{node.data.imdbId}}/" target="_blank">
<h4 class="request-title">{{node.data.title}} ({{node.data.releaseDate | date: 'yyyy'}})</h4>
</a>
</div>
<br />
<div>
<span>Status: </span>
<span class="label label-success">{{node.data.status}}</span>
</div>
<div>
<span>Request status: </span>
<span *ngIf="node.data.available" class="label label-success">Available</span>
<span *ngIf="node.data.approved && !node.data.available" class="label label-info">Processing Request</span>
<span *ngIf="node.data.denied" class="label label-danger">Request Denied</span>
<span *ngIf="node.data.deniedReason" title="{{node.data.deniedReason}}"><i class="fa fa-info-circle"></i></span>
<span *ngIf="!node.data.approved && !node.data.availble && !node.data.denied" class="label label-warning">Pending Approval</span>
</div>
<div>Release Date: {{node.data.releaseDate | date}}</div>
<br />
<div>Requested Date: {{node.data.requestedDate | date}}</div>
</div>
<div class="col-sm-3 col-sm-push-3">
<button [routerLink]="[node.data.id]" style="text-align: right" class="btn btn-sm btn-success-outline" type="submit"><i class="fa fa-plus"></i> View</button>
</div>
</div>
<hr />-->
<!--</div>-->
</div>

View file

@ -79,7 +79,6 @@ export class TvRequestsComponent implements OnInit, OnDestroy {
leaf: false
});
}, this)
console.log(temp);
return <TreeNode[]>temp;
}
private subscriptions = new Subject<void>();