<div class="row wrapper border-bottom white-bg page-heading">
     <div class="col-lg-10">
        <h2>FBO Clients</h2>
        <!-- <ol class="breadcrumb">
           <li>
              <a href="index.dashboard">Home</a>
           </li>
           <li class="active">
              <strong>Clients</strong>
           </li>
        </ol> -->
     </div>
     <div class="col-lg-2">
     </div>
  </div>
  <div class="wrapper wrapper-content animated fadeInRight">
     <div class="row">
        <div class="col-sm-8">
           <div class="ibox">

              <div class="ibox-content">

                    <div class="pull-left">
                       <span class="text-muted small pull-right"></span>
                       <h5 style="font-size: 24px;font-weight: 100;">Clients</h5>
                    </div>
                    <div class="pull-right">
                      <button type="button" class="btn btn-w-m btn-warning" ui-sref="index.dashboard">+ Add Client</button>
                    </div>
                    <div class="clearfix"></div>
                 

                 <!-- <p>
                    All clients need to be verified before you can send email and set a project.
                 </p> -->

                 <div class="input-group" style="width: 70%;">

                    <!-- <input type="text" placeholder="Search client " class="input form-control" ng-keyup="$event.keyCode == 13 && searchData()" ng-model="searchQuery"> -->
                    <input type="text" placeholder="Search client " class="input form-control" ng-model="searchQuery">

                    <span class="input-group-btn">

                    <button type="button" class="btn btn btn-primary"> <i class="fa fa-search"></i> Search</button>

                    </span>
                 </div>
                 <div class="clients-list">

                    <ul class="nav nav-tabs" id="tabClient">

                       <span class="pull-right small text-muted">{{clientLength}} Clients</span>

                       <li class="active customTab1"><a data-toggle="tab" ng-click="fboAdmin()" id="fbo"><i class="fa fa-user"></i> FBO Clients</a></li>
                       <li class="customTab2"><a data-toggle="tab" ng-click="fboDept()" id="flightDetp"><i class="fa fa-briefcase"></i> FBO Department Clients</a></li>

                    </ul>
                    <div class="tab-content">
                       <div id="tab-1" class="tab-pane">
                          <div class="full-height-scroll">
                             <div class="table-responsive">
                                <table class="table table-striped table-hover">
                                   <tbody>

                                      <tr ng-repeat="client in fboClient | filter : searchQuery" ui-sref="index.updateFBO({id: client.user.id})" style="cursor: pointer;">

                                         <td class="client-link">{{client.user.companyName}}</td>

                                         <td> {{client.user.firstName}}</td>
                                         <td><i class="fa fa-flag"></i> {{client.user.lastName}}</td>

                                         <td class="client-status"><span ng-if="client.user.account.user.status == 'ACTIVE'" class="label label-primary">{{client.user.account.user.status}}</span><span ng-if="client.user.account.user.status == 'INACTIVE'" class="label label-danger">{{client.user.account.user.status}}</span><span ng-if="client.user.account.user.status == 'PENDING'" class="label label-default">{{client.user.account.user.status}}</span></td>

                                      </tr>

                                   </tbody>
                                </table>
                             </div>
                          </div>
                       </div>
                       <div id="tab-2" class="tab-pane">
                          <div class="full-height-scroll">
                             <div class="table-responsive">
                                <table class="table table-striped table-hover">
                                   <tbody>

                                      <tr ng-repeat="dept in fboDeptList | filter : searchQuery" ui-sref="index.updateFBODept({id: dept.user.id})" style="cursor: pointer;">

                                         <td><a data-toggle="tab" href="#company-1" class="client-link">{{dept.user.companyName}}</a></td>

                                         <td>{{dept.user.firstName}}</td>
                                         <td><i class="fa fa-flag"></i> {{dept.user.lastName}}</td>

                                         <td class="client-status"><span ng-if="dept.user.account.user.status == 'ACTIVE'" class="label label-primary">{{dept.user.account.user.status}}</span><span ng-if="dept.user.account.user.status == 'INACTIVE'" class="label label-danger">{{dept.user.account.user.status}}</span><span ng-if="dept.user.account.user.status == 'PENDING'" class="label label-default">{{dept.user.account.user.status}}</span></td>

                                      </tr>
                                   </tbody>
                                </table>
                             </div>
                          </div>
                       </div>
                    </div>
                 </div>
              </div>
           </div>
        </div>
     </div>
  </div>