//-  Copyright (c) 2019 AT&T Intellectual Property.                             #
//-                                                                             #
//-  Licensed under the Apache License, Version 2.0 (the "License");            #
//-  you may not use this file except in compliance with the License.           #
//-  You may obtain a copy of the License at                                    #
//-                                                                             #
//-      http://www.apache.org/licenses/LICENSE-2.0                             #
//-                                                                             #
//-  Unless required by applicable law or agreed to in writing, software        #
//-  distributed under the License is distributed on an "AS IS" BASIS,          #
//-  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.   #
//-  See the License for the specific language governing permissions and        #
//-  limitations under the License.                                             #
//- #############################################################################


mat-card.mb-3
    mat-card-header 
        mat-card-title 
            h4(*ngIf="testHead?.testHeadName") {{ testHead.testHeadName }} 
        mat-card-subtitle(style="margin-bottom: 0px")
            div(*ngIf="testHead?.testHeadDescription") {{testHead.testHeadDescription }}
    mat-card-content
        .row(*ngIf="testHead")
            .col-sm
                mat-form-field(*ngIf="testHead?.hostname")
                    input(matInput, placeholder="Host Name", type="text", [value]="testHead.hostname", disabled, name="host")
            .col-sm
                mat-form-field(style="width:50px", *ngIf="testHead?.port") 
                    input(matInput, placeholder="Port", type="text", [value]="testHead.port", disabled, name="port")
            .col-sm
                mat-form-field(*ngIf="testHead?.resourcePath") 
                    input(matInput, placeholder="Resource Path", type="text", [value]="testHead.resourcePath", disabled, name="path")
            .col-sm
                mat-form-field(*ngIf="testHead?.groupId")
                    input(matInput, placeholder="Group", type="text", [value]="testHead.groupId", disabled, name="group")
            .col-sm
                mat-form-field(style="width:50px",*ngIf="testHead?.isPublic != undefined")
                    input(matInput, placeholder="Is Public", type="text", [value]="testHead.isPublic", disabled, name="public")

div(style="position: relative")
  .row
    .col-12
      .pull-left
        mat-form-field(style="width:110px")
          input(matInput, [matDatepicker]="fromPicker", placeholder="From Date", [(ngModel)]="stats.filters.startDate")
          mat-datepicker-toggle(matSuffix, [for]="fromPicker")
          mat-datepicker(#fromPicker)
        mat-form-field.ml-2(style="width:110px")
          input(matInput, [matDatepicker]="toPicker", placeholder="To Date", [(ngModel)]="stats.filters.endDate")
          mat-datepicker-toggle(matSuffix, [for]="toPicker")
          mat-datepicker(#toPicker)
        button.ml-2(mat-icon-button, (click)="getData()") 
          mat-icon arrow_forward
          
      .pull-right
        mat-form-field
          input(matInput, [ngModel]="totalExecutions", placeholder="Total Executions", disabled)

  .row
    .col-12
      mat-card
        mat-card-content
          app-test-head-executions-line-chart(*ngIf="testHead", height="201px", [testHeadId]="testHead._id", (total)="setTotalExecutions($event)")

//-   .row.mt-2
//-     .col-lg-5
//-       mat-card
//-         mat-card-header
//-           mat-card-title 
//-             h5 Test Results
//-         mat-card-content
//-           app-pie-chart(height="230px")
    
//-     .col-lg-7
//-       mat-card
//-         mat-card-header
//-           mat-card-title 
//-             h5 Test Definition Usage
//-         mat-card-content
//-           app-test-definition-executions-bar-chart(height="230px")
//-   .row.mt-2
    
//-     .col-lg-8
//-       mat-card
//-         mat-card-header
//-           mat-card-title 
//-             h5 Virtual Test Head Executions
//-         mat-card-content
//-           app-test-head-executions-line-chart(height="230px")
    
//-     .col-lg-4
//-       mat-card
//-         mat-card-header
//-           mat-card-title 
//-             h5 Virtual Test Head Usage
//-         mat-card-content
//-           app-test-head-execution-bar-chart(height="230px")