{{-- Extends layout --}}
@extends('layout.default')

{{-- Content --}}
@section('content')

    <div class="card card-custom">
        <div class="card-header flex-wrap border-0 pt-6 pb-0">
            <div class="card-title">
                <h3 class="card-label">All Agents
                    <div class="text-muted pt-2 font-size-sm">This is a record of all agents in your account</div>
                </h3>
            </div>
            <div class="card-toolbar">
              
                <div>
                <form method="get" class="form" novalidate="novalidate" id="kt_remove_campaign_form" name="kt_remove_campaign_form" Action="{{route('addAgent')}}" enctype="multipart/form-data">

                    {{csrf_field()}}
                    <button type="submit" class="btn btn-success mr-2">
                        </span>Add Agent
                    </button>
                </form>
            </div>
            </div>
        </div>

        <div class="card-body">

            <!--begin::Search Form-->
            <div class="mt-2 mb-5 mt-lg-5 mb-lg-10">
                <div class="row align-items-center">
                    <div class="col-lg-12 col-xl-12">
                        <div class="row align-items-center">
                            <div class="col-md-4 my-2 my-md-0">
                                <div class="d-flex align-items-center ">
                                    <div class="mr-1">
                                        <select name="flag" id="flag" class="form-control" >
                                            <option value="">Choose Status</option>
                                            <option value="1">Active</option>
                                            <option value="2">Inactive</option>
                                        </select>
                                    </div>
                                
                                    <div class="ml-2">
                                        <button type="submit" data-btn="Update Status" id="updateFlag" class="btn btn-primary px-6 font-weight-bold btn_click">
                                        Update Status </button>
                                    </div>  
                                   
                                </div>

                            </div>
                            <div class="col-md-4 my-2 my-md-0"></div>
                          
                            <div class="col-md-2  my-2 my-md-0">
                                <select name="flag" id="updateExport" class="form-control selectpicker"  data-style="btn-success">
                                    <option value="">Export Feature</option>
                                    <option value="1">Enable</option>
                                    <option value="0">Disable</option>
                                </select>
                            </div>

                            <div class="col-md-2 my-2 my-md-0 propertCheck">        
                             <div class="d-flex  ">
                                 <div class="">
                                        <button type="submit" data-btn="Update Status" id="deleteAgent" class="btn btn-danger font-weight-bold btn_click">
                                        Delete Agent </button>
                                    </div> 
                                </div>
                            </div>
                        </div>
                    </div>
                   
                </div>
            </div>
            <!--end::Search Form-->

            <table class="table table-bordered table-hover display" id="agentDatatable"  style="width:100%">
                <thead>
                <tr>
                    <th style="width: 10px;">Select All
                        <label class="checkbox checkbox-outline checkbox-outline-2x checkbox-primary">
                        <input type="checkbox" id="select_all" name="select_all">
                        <span></span>                                    
                        </label>
                    </th>
                    
                    <th>First Name</th>
                    <th>Second Name</th>
                    <th>Email</th>
                    <th>Phone Number</th>
                    <th style="width: 50px !important; ">Status</th>
                    <th style="width: 50px !important;">Export Data</th>
                    <th style="width: 50px !important;">Action</th>
                    <th style="width: 50px !important;">Login as</th>                    
                   
                </tr>
                </thead>
                <tbody>
                
                </tbody>
            </table>
        </div>
    </div>

    
@endsection

{{-- Styles Section --}}
@section('styles')
    <link href="{{ asset('plugins/custom/datatables/datatables.bundle.css') }}" rel="stylesheet" type="text/css"/>
    <link rel="stylesheet" href="{{asset('css/pages/style.css')}}">
@endsection


{{-- Scripts Section --}}
@section('scripts')
    {{-- vendors --}}
    <script src="{{ asset('plugins/custom/datatables/datatables.bundle.js') }}" type="text/javascript"></script>

    {{-- page scripts --}}
    <!-- <script src="{{ asset('js/pages/crud/datatables/basic/basic.js') }}" type="text/javascript"></script> -->
    <script src="{{ asset('js/app.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/admin/agent.js') }}" type="text/javascript"></script>
    <!-- <script src="{{ asset('js/developer/formValidation.js') }}" type="text/javascript"></script> -->
    <script>
        jQuery(document).ready((function () {
            var url = '