<div bsModal #modal="bs-modal" (onShown)="onShown()" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="modal" aria-hidden="true" [config]="{backdrop: 'static'}">
    <div class="modal-dialog modal-md">
      <div class="modal-content">
        <form *ngIf="active" #fleetForm="ngForm" novalidate (ngSubmit)="save()">
          <div class="modal-header">
              <h4 class="modal-title">
              <span>{{"EditingFleets" | localize}}</span>
            </h4>
            <button type="button" class="close" (click)="close()" aria-label="Close">
              <span aria-hidden="true">&times;</span>
            </button>          
          </div>
          <div class="modal-body">
  
            <div class="form-group">
              <label>{{"FleetName" | localize}} * </label>
              <input #fleetName="ngModel" class="form-control" type="text" name="name" [(ngModel)]="fleet.name" required maxlength="32">            
              <validation-messages [formCtrl]="fleetName"></validation-messages>
            </div>
          </div>
          <div class="modal-footer">
            <button [disabled]="saving" type="button" class="btn btn-secondary btn-pill" (click)="close()">{{"Cancel" | localize}}</button>
            <button type="submit" class="btn btn-primary btn-pill" [disabled]="!fleetForm.form.valid" [buttonBusy]="saving" [busyText]="l('SavingWithThreeDot' | localize)">
              <i class="fa fa-save"></i> <span>{{"Save" | localize}}</span>
            </button>
          </div>
        </form>
      </div>
    </div>
  </div>
  