@extends('app.app-master') 

@section('content')
 <div class="container-fluid mt-2">
<div class="card">
    <div class="card-header bg-darkblue">Leads</div>
    
        <div class="card-header">
            
            <div id="accordion">
               
                   <div class="card">
    <div class="card-header" id="headingOne">
      <h5 class="mb-0">
          <div class="row">
             <div class="col-md-2">
            <button class="btn btn-primary mr-2" type="button" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">              <span class="btn-label"><i class="fas fa-filter">  
                </i>
            </span>SHOW FILTER </button>
        </div>
              <div class="input-group col-md-10 d-flex flex-row-reverse">
        <div class="input-group-append">
    <button class="btn btn-outline-secondary nonbtn" type="button">
        <i class="fas fa-search"></i>
    </button>
  </div>
  <input type="text" class="form-control col-md-2" placeholder="Search here" aria-label="Recipient's username" aria-describedby="basic-addon2">
  
            </div>
          </div>
       
          
      </h5>
    </div>

    <div id="collapseOne" class="collapse" aria-labelledby="headingOne" data-parent="#accordion">
      <div class="card-body">
    <div class="row">
<div class="col-md-2">
   <div class="form-group">

    <select class="form-control" id="exampleFormControlSelect1">
    <option selected="true" disabled="disabled">Choose ID</option>

    </select>
  </div>
</div>
<div class="col-md-2">
   <div class="form-group">

    <select class="form-control" id="exampleFormControlSelect1">
    <option selected="true" disabled="disabled">Choose Email</option>

    </select>
  </div>
</div>
<div class="col-md-2">
   <div class="form-group">

    <select class="form-control" id="exampleFormControlSelect1">
    <option selected="true" disabled="disabled">Start Name</option>

    </select>
  </div>
</div>
<div class="col-md-1">
    <div class="form-group ">

    <select class="form-control" id="exampleFormControlSelect1">
  <option selected="true" disabled="disabled"> Gender</option>

    </select>
  </div>
</div>
<div class="col-md-2">
    <div class="form-group ">

    <select class="form-control" id="exampleFormControlSelect1">
  <option selected="true" disabled="disabled">Choose Phone</option>

    </select>
  </div>
</div>
                
<div class="col-md-1">
    <div class="form-group ">

    <select class="form-control" id="exampleFormControlSelect1">
  <option selected="true" disabled="disabled">Score</option>

    </select>
  </div>
</div>
                                <div class="col-md-2">
    <div class="form-group ">

    <select class="form-control" id="exampleFormControlSelect1">
  <option selected="true" disabled="disabled">Promo ID</option>

    </select>
  </div>
</div>
    </div>
      </div>
    </div>
  </div> 
                </div>
  
 </div>
        <div class="card-header table-responsive">
            <table class="table table-striped">
                    <thead>
                        <tr>
                            <th scope="col">ID &nbsp;<i class="fas fa-sort"></i></th>
                            <th scope="col" >E-MAIL&nbsp;<i class="fas fa-sort"></i></th>
                            <th scope="col" class="text-center">NAME &nbsp;<i class="fas fa-sort"></i></th>
                             <th scope="col" class="text-center">GENDER&nbsp;<i class="fas fa-sort"></i></th>
                             <th scope="col" class="text-center">PHONE&nbsp;<i class="fas fa-sort"></i></th>
                             <th scope="col" class="text-center">SCORE&nbsp;<i class="fas fa-sort"></i></th>
                             <th scope="col" class="text-center">PROMO ID&nbsp;<i class="fas fa-sort"></i></th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>

                            <td>Bonus#1</td>
                            <td>Email@gmail.com</td>
                            <td class="text-center">
                                John Doe
                            </td>
                            <td class="text-center">Male</td>
                            <td class="text-center">123456789</td>
                            <td class="text-center">100</td>
                            <td class="text-center">id#1</td>
                        </tr>
                         <tr>

                            <td>Bonus#1</td>
                            <td>Email@gmail.com</td>
                            <td class="text-center">
                                John Doe
                            </td>
                            <td class="text-center">Male</td>
                            <td class="text-center">123456789</td>
                            <td class="text-center">100</td>
                            <td class="text-center">id#1</td>
                        </tr>
                         <tr>

                            <td>Bonus#1</td>
                            <td>Email@gmail.com</td>
                            <td class="text-center">
                                John Doe
                            </td>
                            <td class="text-center">Male</td>
                            <td class="text-center">123456789</td>
                            <td class="text-center">100</td>
                            <td class="text-center">id#1</td>
                        </tr>
                    </tbody>
    </table>
          

</div>
    <div class="card-header pagination-center">
        <ul class="pagination float-right">

    <li class="paginate_button page-item previous disabled" id="table_id_previous">
        <a href="#" aria-controls="table_id" data-dt-idx="0" tabindex="0" class="page-link1"><i class="fas fa-chevron-circle-left"></i></a></li>
    <li class="paginate_button page-item previous disabled pages" id="table_id_previous">
        <a href="#" aria-controls="table_id" data-dt-idx="0" tabindex="0" class="page-link">Page <span class="pageno ml-1 mr-1">3</span> of 12 </a></li>

    <li class="paginate_button page-item previous disabled" id="table_id_previous">
        <a href="#" aria-controls="table_id" data-dt-idx="0" tabindex="0" class="page-link2"><i class="fas fa-chevron-circle-right"></i></a></li>

    </ul>        
    </div> 
        </div>
        
    
     </div>

@endsection