<div style="height: 535px;">
    <div class="row" style="text-align: center; font-size: 20px; background: #4859a5; color: white;padding-top: 10px">
      <div class="col-12" >
        <div class="row">
          <div class="col-6">
              <p style="text-align: left; font-size: 20px; background: #4859a5; color: white;">{{'EXPENSE LIST' | translate}}</p>
          </div>
          <div class="col-6" style="text-align: end;">
              <i class="fas fa-times-circle" (click)="cancel()" style="font-size: 20px;color: red;cursor: pointer"></i>
            </div>
        </div>       
      </div>
    </div>
    <div class="loading" *ngIf="Load">Loading&#8230;</div>
    <div class="row">
      <div class="col-12">
          <table id='test_history' class="table table-striped table-hover" style="overflow-y: hidden;
          overflow-x: hidden;font-size:12px">
          <thead>
            <tr>
              <th style="text-align:center">{{'Vehicle Name' | translate}}</th>
              <th style="text-align:center">{{'Amount' | translate}}</th>
              <th style="text-align:center">{{'Currency' | translate}}</th>
              <th style="text-align:center">{{'Payment Mode' | translate}}</th>
              <th style="text-align:center">{{'Expense type' | translate}}</th>
          </thead>
          <tbody>
            <tr *ngFor="let expObj of expenseArr">
              <td style="text-align: center">{{(expObj.vehicle != null)?expObj.vehicle.Device_Name : "NA"}}</td>
              <td style="text-align: center">{{expObj.amount ? expObj.amount : "0"}}</td>
              <td style="text-align: center">{{expObj.currency}}</td>
              <td style="text-align: center">{{expObj.payment_mode}}</td>
              <td style="text-align: center">{{expObj.type}}</td>
              <td style="text-align: center;cursor:pointer">
                  <div>
                      <i class="fas fa-trash-alt" (click)="delete(expObj)" style="font-size: 20px;color: #2e3e84;cursor: pointer"></i>
                    </div>  
              </td>
            </tr>
          </tbody>
        </table>
      </div>
      
    </div>
   
  </div>