<span *ngIf="show" class="backToList">

  <a (click)="show = !show;" tooltip="Go to listing">Back to List</a>
  
  </span>
<div class="col-lg-12" *ngIf="!show">

<!--/.row-->
<div class="row">
<!--/.col-->
<div class="col-md-12 mb-4">
<!-- Nav tabs -->
  <div class="card">
      <div class="card-header">
        <i class="fa fa-align-justify"></i> View Account Statement Details
    </div>
  <div class="card-body">
    <div class="row">
                      <div class="col-md-2">
                          <div class="input-prepend input-group">
                              <select id="disabledSelect" class="form-control">
                                  <option value="0">From Date</option>
                                 
                              </select>
                          </div>
                      </div>
                      <div class="col-md-2">
                          <div class="input-prepend input-group">
                              <select id="disabledSelect" class="form-control">
                                  <option value="0">To Date</option>
                                  
                              </select>
                          </div>
                      </div>
                       <div class="col-md-3">
                          <div class="input-prepend input-group">
                              <select id="disabledSelect" class="form-control">
                                  <option value="0">University</option>
                                 
                              </select>
                          </div>
                      </div>

                      <div class="col-md-3">
                          <div class="input-prepend input-group">
                              <select id="disabledSelect" class="form-control">
                                  <option value="0">Amount</option>
                                 
                              </select>
                          </div>
                      </div>
                      <div class="col-md-2">
                          <div class="input-prepend input-group">
                              <button type="button" value="Submit" class="btn btn-primary"> <i class="fa fa-search"></i> Search</button>
                          </div>
                      </div>
                  </div>
                  <br>
                    <div class="row">
                      <div class="col-md-4">
                          <div class="input-prepend input-group">
                              <span class="input-group-addon">
                                  <i class="fa fa-search"></i>
                                  </span>
                              <input id="search" class="form-control" type="text" placeholder="search">
                          </div>
                      </div>
                  </div>
      <br>
        <div class="row">
  <div class="col-lg-12 col-xs-12">
    <table class="table table-bordered">
  
      <thead>
        <tr>
         
      <th>Date</th>
          <th>Description</th>
          <th>University</th>
          <th>Form</th>
    <th>Debit</th>
    <th>Credit</th>
    <th>Balance</th>
          <th>Remarks</th>
    
        </tr>
      </thead>
      <tbody>
        <tr>
           
    <td>10/08/2018</td>
        <td>Payment Received</td>
        <td>Anna Uni</td>
           <td><a href="page-link" href="#">FormID 1</a></td>
    <td>0</td>
    <td>10,000</td>
    <td>10,000</td>
          <td>Amount Received by studycenter A</td>
     
     
        
          
        </tr>
        <tr>
           
     <td>11/08/2018</td>
          <td>Fees Adjust</td>
        <td>Anna Uni</td>
           <td><a href="page-link" href="#">FormID 2</a></td>
    <td>0</td>
    <td>15,000</td>
    <td>25,000</td>
           <td>Amount Adjust studycenter A</td>
     
          
    
          
        </tr>
        <tr>
            
     <td>12/08/2018</td>
          <td>Refund</td>
        <td>Anna Uni</td>
          <td><a href="page-link" href="#">FormID 3</a></td>
    <td>5000</td>
    <td>0</td>
    <td>20,000</td>
     <td>Amount Refund</td>
     
         
                                
        </tr>
       
       
      </tbody>
    </table>
    <ul class="pagination">
      <li class="page-item"><a class="page-link" href="#">Prev</a></li>
      <li class="page-item active">
        <a class="page-link" href="#">1</a>
      </li>
      <li class="page-item"><a class="page-link" href="#">2</a></li>
      <li class="page-item"><a class="page-link" href="#">3</a></li>
      <li class="page-item"><a class="page-link" href="#">4</a></li>
      <li class="page-item"><a class="page-link" href="#">Next</a></li>
    </ul>
  </div>
  <!--/.col-->
</div>
    </div>
    <br>
      <!-- <div class="card-footer">
        <div class="form-group row">
          <div class=" col-md-12" align="right">
    
              <button type="button" class="btn btn-sm btn-success"><i class="fa fa-dot-circle-o"></i> Submit</button>
      &nbsp;
              <button type="reset" class="btn btn-sm btn-danger"><i class="fa fa-ban"></i> Reset</button>
          </div>
        </div>
      </div> -->		  
      
   
</div>

</div><!--/.col-->
</div>
</div>

<!--/.row-->

