Ombi/src/Ombi/wwwroot/app/requests/tvrequests.component.html

<div class="form-group">
    <div>
        <input type="text" class="form-control form-control-custom" placeholder="Search" (keyup)="search($event)">
    </div>
</div>
<br />

<div infinite-scroll
     [infiniteScrollDistance]="1"
     [infiniteScrollThrottle]="100"
     (scrolled)="loadMore()">


    <div *ngFor="let request of tvRequests">


        <div class="row">
            <div class="col-sm-2">

                <img class="img-responsive" src="{{request.posterPath}}" alt="poster">

            </div>

            <div class="col-sm-5 ">
                <div>
                    <a href="http://www.imdb.com/title/{{request.imdbId}}/" target="_blank">
                        <h4 class="request-title">{{request.title}} ({{request.releaseDate | date: 'yyyy'}})</h4>
                    </a>
                </div>
                <br />
                <div>
                    <span>Status: </span>
                    <span class="label label-success">{{request.status}}</span>
                </div>
                <div *ngIf="!request.hasChildRequests">
                    <div>
                        <span>Request status: </span>
                        <span *ngIf="request.available" class="label label-success">Available</span>
                        <span *ngIf="request.approved && !request.available" class="label label-info">Processing Request</span>
                        <span *ngIf="request.denied" class="label label-danger">Request Denied</span>
                        <span *ngIf="request.deniedReason" title="{{request.deniedReason}}"><i class="fa fa-info-circle"></i></span>
                        <span *ngIf="!request.approved && !request.availble && !request.denied" class="label label-warning">Pending Approval</span>

                    </div>
                    <div *ngIf="request.denied">
                        Denied: <i style="color:red;" class="fa fa-check"></i>

                    </div>


                    <div>Release Date: {{request.releaseDate | date}}</div>
                    <br />

                    <!--{{#if_eq type "tv"}}
                    {{#if episodes}}
                    Episodes: <span class="customTooltip" data-tooltip-content="#{{requestId}}toolTipContent"><i class="fa fa-info-circle"></i></span>
                    {{else}}
                    <div>@UI.Requests_SeasonsRequested: {{seriesRequested}}</div>

                    {{/if}}
                    {{/if_eq}}-->
                    <div *ngIf="request.requestedUsers">Requested By: <span *ngFor="let user of request.requestedUsers">{{user}} </span></div>

                    <div>Requested Date: {{request.requestedDate | date}}</div>
                    <!--{{#if admin}}
                    {{#if currentRootPath}}
                    <div class="{{requestId}}rootPathMain">Root Path: <span id="{{requestId}}currentRootPath">{{currentRootPath}}</span></div>
                    {{/if}}
                    {{/if}}
                    <div>
                        {{#if_eq issueId 0}}
                        @*Nothing*@
                        {{else}}
                        @UI.Issues_Issue: <a href="@formAction/issues/{{issueId}}"><i class="fa fa-check"></i></a>
                        {{/if_eq}}
                    </div>-->

                </div>
                <!--Child Requests-->

                <button type="button" class="btn btn-sm btn-info-outline" data-toggle="collapse" [attr.data-target]="'#' + request.id +'childRequests'">Children</button>
                <div id="{{request.id}}childRequests" class="collapse">

                    <div *ngFor="let child of request.childRequests">
                        <hr />
                        <div *ngIf="request.requestedUsers">
                            Requested By: <span *ngFor="let user of request.requestedUsers">{{user}} </span>
                        </div>
                        <div *ngIf="child.seasonRequests">
                            Seasons Requested: <span *ngFor="let s of child.seasonRequests">{{s.seasonNumber}} </span>
                        </div>
                        <div>
                            <span>Request status: </span>
                            <span *ngIf="request.available" class="label label-success">Available</span>
                            <span *ngIf="request.approved && !request.available" class="label label-info">Processing Request</span>
                            <span *ngIf="request.denied" class="label label-danger">Request Denied</span>
                            <span *ngIf="request.deniedReason" title="{{request.deniedReason}}"><i class="fa fa-info-circle"></i></span>
                            <span *ngIf="!request.approved && !request.availble && !request.denied" class="label label-warning">Pending Approval</span>

                        </div>
                    </div>

                </div>

            </div>
            <div class="col-sm-3 col-sm-push-3">
                <div *ngIf="isAdmin">
                    <div *ngIf="!request.approved">
                        <form>
                            <input name="requestId" type="text" value="{{request.requestId}}" hidden="hidden" />
                            <div *ngIf="request.hasQualities" class="btn-group btn-split">
                                <button type="button" (click)="approve(request)" class="btn btn-sm btn-success-outline approve"><i class="fa fa-plus"></i> Approve</button>
                                <button type="button" class="btn btn-success-outline dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                    <span class="caret"></span>
                                    <span class="sr-only">Toggle Dropdown</span>
                                </button>

                                <!--<ul class="dropdown-menu">
                                    {{#each qualities}}
                                    <li><a href="#" class="approve-with-quality" id="{{id}}">{{name}}</a></li>
                                    {{/each}}
                                </ul>-->
                            </div>


                            <button *ngIf="!request.hasQualities" (click)="approve(request)" style="text-align: right" class="btn btn-sm btn-success-outline approve" type="submit"><i class="fa fa-plus"></i> Approve</button>
                        </form>







                        <!--<form method="POST" action="@formAction/requests/changeRootFolder{{#if_eq type "tv"}}tv{{else}}movie{{/if_eq}}" id="changeFolder{{requestId}}">
                            <input name="requestId" type="text" value="{{requestId}}" hidden="hidden"/>
                            {{#if_eq hasRootFolders true}}
                            <div class="btn-group btn-split">
                                <button type="button" class="btn btn-sm btn-success-outline" id="changeRootFolderBtn{{requestId}}" custom-button="{{requestId}}">@*<i class="fa fa-plus"></i>*@ Change Root Folder</button>
                                <button type="button" class="btn btn-success-outline dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                    <span class="caret"></span>
                                    <span class="sr-only">@UI.Requests_ToggleDropdown</span>
                                </button>
                                <ul class="dropdown-menu">
                                    {{#each rootFolders}}
                                    <li><a href="#" class="change-root-folder" id="{{id}}" requestId="{{requestId}}">{{path}}</a></li>
                                    {{/each}}
                                </ul>
                            </div>
                            {{/if_eq}}
                        </form>-->



                        <div *ngIf="!request.denied">
                            <form>
                                <input name="requestId" type="text" value="{{request.requestId}}" hidden="hidden" />
                                <input name="reason" type="text" hidden="hidden" />
                                <div class="btn-group btn-split">
                                    <button type="button" (click)="deny(request)" class="btn btn-sm btn-danger-outline deny"><i class="fa fa-times"></i> Deny</button>
                                    <button type="button" class="btn btn-danger-outline dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                        <span class="caret"></span>
                                        <span class="sr-only">@UI.Requests_ToggleDropdown</span>
                                    </button>
                                    <ul class="dropdown-menu">
                                        <li><a class="deny-with-reason" id="denyReason{{request.requestId}}" href="#" data-toggle="modal" data-target="#denyReasonModal">Deny with a reason</a></li>
                                    </ul>
                                </div>
                            </form>
                        </div>
                    </div>
                    <form>
                        <button (click)="removeRequest(request)" style="text-align: right" class="btn btn-sm btn-danger-outline delete"><i class="fa fa-minus"></i> Remove</button>
                    </form>

                    <form>
                        <button *ngIf="request.available" (click)="changeAvailability(request, false)" style="text-align: right" value="false" class="btn btn-sm btn-info-outline change"><i class="fa fa-minus"></i> Mark Unavailable</button>
                        <button *ngIf="!request.available" (click)="changeAvailability(request, true)" style="text-align: right" value="true" class="btn btn-sm btn-success-outline change"><i class="fa fa-plus"></i> Mark Available</button>
                    </form>




                </div>


                <input name="requestId" type="text" value="{{request.requestId}}" hidden="hidden" />
                <div class="dropdown">
                    <button id="{{request.requestId}}" class="btn btn-sm btn-primary-outline dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                        <i class="fa fa-plus"></i> Report Issue
                        <span class="caret"></span>
                    </button>
                    <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
                        <li><a issue-select="0">@UI.Issues_WrongAudio</a></li>
                        <li><a issue-select="1">@UI.Issues_NoSubs</a></li>
                        <li><a issue-select="2">@UI.Issues_WrongContent</a></li>
                        <li><a issue-select="3">@UI.Issues_Playback</a></li>
                        <li><a issue-select="4" data-toggle="modal" data-target="#myModal">@UI.Issues_Other</a></li>
                    </ul>
                </div>

            </div>
        </div>
        <hr />




    </div>
</div>