<ion-header>
  <!-- <button class="nav_btn nav_back floatLeft">
  <ion-back-button>
  </ion-back-button>
  </button> -->
  <div class="nav_title floatLeft">
  <h4>Treatment Authorizations</h4>
  </div>
  <div class="clear"></div>
 </ion-header>
 <ion-content>
  <div class="list_wrapper">
  <ul *ngIf = "treatment_authorization">
  <li *ngFor= "let treatment_details of treatment_authorization ; let i=index">
  <div class="list_main" (click)="toggleGroup(i)" [ngClass]="{active:isGroupShown(i)}">
  <div class="col-10 floatLeft">
  <p>Name</p>
  <h3><strong>{{treatment_details.name}}</strong></h3>
  </div>
  <!-- <div class="col floatLeft borderNone">
  <p></p>
  <h3>06/12/2019</h3>
  </div> -->
  <div class="clear"></div>
  </div>
  <div class="list_sub" *ngIf="isGroupShown(i)">
  <div class="list_bar">
  <div class="col floatLeft">
  <p>Treatment Description</p>
  <h3>Test</h3>
  </div>
  <div class="col floatLeft borderNone">
  <p>Treatment Type</p>
  <h3>{{treatment_details.treatment_type}}</h3>
  </div>
   <div class="clear"></div>
  </div>
  <div class="list_bar">
  <div class="col floatLeft">
  <p>Times Per Day</p>
  <h3>{{treatment_details.times_per_day}}</h3>
  </div>
  <div class="col floatLeft borderNone">
  <p>Time of First Treatment</p>
  <h3>{{treatment_details.dte_of_first_treat}} {{treatment_details.time_of_first_treat}}</h3>
  </div>
  <div class="clear"></div>
  </div>
  <div class="list_bar">
    <div class="col floatLeft">
    <p>Expiry Date</p>
    <h3>{{treatment_details.expiry_date}}</h3>
    </div>
    
    <div class="clear"></div>
    </div>
  </div>
  </li>
  <!-- <li>
  <div class="list_main" (click)="toggleGroup(1)" [ngClass]="{active:isGroupShown(1)}">
  <div class="col floatLeft">
  <p>Name</p>
  <h3><strong>Medication Authorizations</strong></h3>
  </div>
  <div class="col floatLeft borderNone">
  <p>Expiry Date</p>
  <h3>06/12/2019</h3>
  </div>
  <div class="clear"></div>
  </div>
  <div class="list_sub" *ngIf="isGroupShown(1)">
  <div class="list_bar">
  <div class="col floatLeft">
  <p>Name of medicine</p>
  <h3>Potassium Chloride</h3>
  </div>
  <div class="col floatLeft borderNone">
  <p>Times Per Day</p>
  <h3>2 Days</h3>
  </div>
  <div class="clear"></div>
  </div>
  <div class="list_bar">
  <div class="col floatLeft">
  <p>Tme of first medication</p>
  <h3>06/11/2019 11:00 AM</h3>
  </div>
  <div class="col floatLeft borderNone">
  <p>Quantity Available</p>
  <h3>20</h3>
  </div>
  <div class="clear"></div>
  </div>
  </div>
  </li> -->
  </ul>
  </div>
 </ion-content>
 
