@extends ('../welcome')
@section ('content')
<style>
    .pagination nav .relative.z-0.inline-flex {
        display: inline-flex;
    }

    .pagination nav .hidden {
        display: unset !important;
    }

    .pagination nav .flex-1.justify-between {
        padding: 15px 0
    }

    .pagination nav .flex.justify-between.flex-1 {
        display: none
    }
</style>
<form>
    <div class="card card-info card-outline collapsed-card">
        <div class="card-header" class="btn btn-tool" data-card-widget="collapse">
            <div class="card-title" style="font-weight:bold; font-size:20px">
                Filter
            </div>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-6">
                    <div class="form-group">
                        <label for="projects">Select User</label>
                        <select name="user_id" id="users" class="select2 custom-select form-control-border">
                            <option></option>
                            @foreach ($users as $user)
                            <option {{request()->get('user_id') == $user->id ? 'selected' : ''}} value="{{ $user->id }}">{{ $user->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="name">Lead Name</label>
                        <input class="form-control" type="text" id="name" name="name" value="{{request()->get('name')}}">
                    </div>
                    <div class="form-group">
                        <label for="phone">Lead Phone</label>
                        <input class="form-control" type="number" id="phone" name="phone" value="{{request()->get('phone')}}">
                    </div>
                    <div class="form-group">
                        <label for="date">Date From</label>
                        <input class="form-control" type="date" id="date" name="from_date" value="{{request()->get('from_date')}}">
                    </div>
                    <div class="form-group">
                        <label for="date">Date To</label>
                        <input class="form-control" type="date" id="date" name="to_date" value="{{request()->get('to_date')}}">
                    </div>
                </div>
                <div class="col-6">
                    <div class="form-group">
                        <label for="campaigns">Select Campaign</label>
                        <select name="campaigns[]" id="campaigns" class="select2 custom-select form-control-border" multiple>
                            <option></option>
                            @foreach ($campaigns as $campaign)
                            <option {{request()->get('campaigns') ? (in_array($campaign->id,request()->get('campaigns')) ? 'selected' : '') : ''}} value="{{ $campaign->id }}">{{ $campaign->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="form-group">
                        <label class="col-2" title="Source">Lead Target</label>

                        <select name="source_id[]" class="select2 custom-select form-control-border col-8" multiple>
                            @forelse($sources as $source)
                            <option value="{{ $source->id }}">{{ $source->name }}</option>
                            @empty
                            @endforelse
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="name">Source</label>
                        <input class="form-control" type="text" id="source" name="source" value="{{request()->get('source')}}">
                    </div>
                    <div class="form-group">
                        <label for="phone">Status</label>
                        <input class="form-control" type="text" id="status" name="status" value="{{request()->get('status')}}">
                    </div>
                </div>
            </div>
            <div>
            </div class="col-12">
            <a href="{{ url()->current() }}" class="btn btn-default" style="margin-left:15px;">Reset</a>
            <button type="submit" class="btn btn-info" style="float:left">filter</button>
        </div>
    </div>
    </div>
    </div>
</form>
<section class="content">
    <div class="container-fluid">
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-header">
                        <form action='{{route('leads.export')}}' method='post'>
                            @if(auth()->user()->isAbleTo('leads-create'))
                            <a href="{{route('leads.create')}}">
                                <button class="btn btn-square btn-info" type="button">Create Lead</button>
                            </a>
                            @endif
                            @if(auth()->user()->isAbleTo('leads-import'))
                            <a href="{{route('leads.importView')}}">
                                <button class="btn btn-square btn-secondary" type="button">Import Leads</button>
                            </a>
                            @endif
                            <!--@if(auth()->user()->isAbleTo('leads-export'))-->
                            <!--    @csrf-->
                            <!--    <input type="hidden" value="{{$_GET['user_id'] ?? ''}}" name="user_id">-->
                            <!--    <input type="hidden" value="{{$_GET['name'] ?? ''}}" name="name">-->
                            <!--    <input type="hidden" value="{{$_GET['phone'] ?? ''}}" name="phone">-->
                            <!--    <input type="hidden" value="{{$_GET['source'] ?? ''}}" name="source">-->
                            <!--    <input type="hidden" value="{{$_GET['status'] ?? ''}}" name="status">-->
                            <!--    <input type="hidden" value="{{$_GET['date'] ?? ''}}" name="date">-->


                            <!--    <button class="btn btn-square btn-primary" type="submit">Export Leads</button>-->
                            <!--@endif-->
                            @if(auth()->user()->isAbleTo('leads-archive'))
                            <a href="{{route('leads.archive')}}">
                                <button class="btn btn-square btn-warning" type="button">Archive</button>
                            </a>
                            @endif
                            @if(auth()->user()->hasRole('SuperAdmin') || Auth::user()->isAbleTo('leads-ChangeStatus'))

                            <div class="btn-group">
                                <button type="button" class="btn btn-default">Action</button>
                                <button type="button" class="btn btn-default dropdown-toggle dropdown-icon" data-toggle="dropdown">
                                    <span class="sr-only">Toggle Dropdown</span>
                                </button>
                                <div class="dropdown-menu" role="menu">
                                    @if(auth()->user()->hasRole('SuperAdmin'))
                                    <a class="dropdown-item" data-toggle="modal" onClick="clickbutton(this)" data-target='#assignedUserModal' href="#">Assigned User</a>
                                    <a class="dropdown-item" data-toggle="modal" onClick="changeStatus(this)" data-target='#statusModal' href="#">Status</a>

                                    <a class="dropdown-item" data-toggle="modal" onClick="changeAll(this)" data-target='#UserOptionsModal' href="#">Both</a>


                                    @endif
                                </div>
                            </div>
                            @endif
                        </form>

                    </div>

                    <div class="card-body">
                        <label>Total Leads: {{count($leads)}}</label>
                        <table id="leads" class="table table-bordered table-striped table-responsive">
                            <thead>
                                <tr>
                                    <th><input type="checkbox" id="selectAll" class="sub_chk"></th>
                                    <!--<th class="filters">ID</th>-->
                                    <th class="filters">Name</th>
                                    <!--<th class="filters">Email</th>-->
                                    <th class="filters">Phone Number</th>
                                    <th class="filters">Source</th>
                                    <th class="filters">Campaign</th>
                                    <th class="filters">Status</th>
                                    <!--<th class="filters">comunication</th>-->
                                    <th class="filters">Assigned User</th>
                                    <th class="filters">Comment</th>
                                    <th class="filters">Date Comment</th>
                                    <th class="filters">Created At</th>
                                    <th class="filters">Action</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($leads as $lead)
                                <tr>
                                    <td><input type="checkbox" id="chk_lead" class="checkboxAll sub_chk" data-id="{{$lead->id}}">
                                    </td>
                                    <!--<td>{{$lead->id}}</td>-->
                                    <td>{{$lead->name}}</td>
                                    <!--<td>{{$lead->email}}</td>-->
                                    <!-- Phone number -->
                                    <td>
                                        @foreach($lead->phone_numbers as $phone_number)
                                        <li>{{$phone_number->phone}}</li>
                                        @endforeach
                                    </td>
                                    <td>{{$lead->came_from}}</td>
                                    <td>{{$lead->campaign?->name}}</td>

                                    @if($lead->status == 'new')
                                    <td class="badge badge-primary" style=" margin-top:12px;margin-left:10px;">
                                        {{ucwords($lead->status)}}
                                    </td>
                                    @elseif($lead->status == 'in-process')
                                    <td class="badge badge-secondry" style=" margin-top:12px;margin-left:10px;">
                                        {{ucwords($lead->status)}}
                                    </td>
                                    @elseif($lead->status == 'interestad')
                                    <td class="badge badge-info" style=" margin-top:12px;margin-left:10px;">
                                        {{ucwords($lead->status)}}
                                    </td>
                                    @elseif($lead->status == 'not_interested')
                                    <td class="badge badge-light" style=" margin-top:12px;margin-left:10px;">
                                        {{ucwords($lead->status)}}
                                    </td>
                                    @elseif($lead->status == 'wait')
                                    <td class="badge badge-warning" style=" margin-top:12px;margin-left:10px;">
                                        {{ucwords($lead->status)}}
                                    </td>
                                    @elseif($lead->status == 'follow_up')
                                    <td class="badge badge-purple" style=" margin-top:12px;margin-left:10px;">
                                        {{ucwords($lead->status)}}
                                    </td>
                                    @elseif($lead->status == 'recycled')
                                    <td class="badge badge-dark" style=" margin-top:12px;margin-left:10px;">
                                        {{ucwords($lead->status)}}
                                    </td>
                                    @elseif($lead->status == 'converted')
                                    <td class="badge badge-success" style=" margin-top:12px;margin-left:10px;">
                                        {{ucwords($lead->status)}}
                                    </td>
                                    @else
                                    <td class="badge badge-danger" style=" margin-top:12px;margin-left:10px;">
                                        {{ucwords($lead->status)}}
                                    </td>
                                    @endif
                                    <!--<td>{{$lead->type}}</td>-->
                                    <td>
                                        @forelse($lead->users as $user)
                                        <li>{{$user->name}}</li>
                                        @empty
                                        --
                                        @endforelse
                                    </td>
                                    <td>
                                        {{$lead->streams->last()?->comment}}
                                    </td>
                                    <td>
                                        {{$lead->streams->last()?->created_at}}
                                    </td>

                                    <td>{{$lead->created_at->setTimezone('Africa/Cairo')}}</td>
                                    <td>
                                        @if(auth()->user()->isAbleTo('leads-update'))
                                        @if($lead->is_client == 0)
                                        <a class="btn btn-primary" title="Edit" href="{{ route('leads.edit',$lead->id) }}">
                                            <i class="fa fa-pen"></i>
                                        </a>
                                        @endif
                                        @endif
                                        <a class="btn btn-warning" title="Show" href="{{ route('leads.show',$lead->id) }}">
                                            <i class="fa fa-eye"></i>
                                        </a>
                                        @if(auth()->user()->isAbleTo('leads-delete'))
                                        <button onClick="clickDeletebutton(this)" title="Delete" class="btn btn-danger" data-id="{{$lead->id}}" data-toggle="modal" data-target="#exampleModalCenter">
                                            <i class="fa fa-ban"></i>
                                        </button>
                                        @endif
                                        @if($lead->is_client == 0)
                                        <a class="btn btn-dark" title="Call" href="{{route('communications.create',$lead->id)}}">
                                            <i class="fas fa-phone"></i>
                                        </a>
                                        @endif
                                        <!--@if(auth()->user()->isAbleTo('clients-create'))-->
                                        <!--@if($lead->is_client == 1)-->
                                        <!--<button class="btn btn-info" disabled style="padding: 0px;">-->
                                        <!--    <a style="cursor:no-drop;" class="btn btn-info" title="Client-Profile"-->
                                        <!--        href="#">-->
                                        <!--        <i class="fa fa-file-signature"></i>-->
                                        <!--    </a>-->
                                        <!--</button>-->
                                        <!--@else-->
                                        <!--<button class="btn" style="padding: 0px;">-->
                                        <!--    <a class="btn btn-info" title="Client-Profile"-->
                                        <!--        href="{{route('clients.create',$lead->id)}}">-->
                                        <!--        <i class="fa fa-file-signature"></i>-->
                                        <!--    </a>-->
                                        <!--</button>-->
                                        <!--@endif-->
                                        <!--@endif-->
                                    </td>
                                </tr>
                                @endforeach
                            </tbody>
                            <tfoot>
                                <tr>
                                    <th></th>
                                    <!--<th>id</th>-->
                                    <th>name</th>
                                    <!--<th>email</th>-->
                                    <th>phoneNumber</th>
                                    <th>source</th>
                                    <th>campaign</th>
                                    <th>status</th>
                                    <!--<th>Communication</th>-->
                                    <th>user</th>
                                    <th>Comment</th>
                                    <th>created</th>
                                    <th>action</th>
                                </tr>
                            </tfoot>
                        </table>
                        <div class="pagination">
                            {{ $leads->appends($_GET)->links() }}
                        </div>

                        <div id="assignedUserModal" class="modal fade">
                            <div class="modal-dialog">
                                <form id="leadData">
                                    <div class="modal-content">
                                        <div class="modal-body">
                                            <select name="user_id" class="select2 custom-select form-control-border" id="user_id">
                                                @foreach ($users as $user)
                                                <option value="{{$user->id}}">{{$user->name}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                        <button type="submit" class="btn btn-primary yes" type="button">Submit</button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                    <div id="statusModal" class="modal fade">
                        <div class="modal-dialog">
                            <form id="leadData">
                                <div class="modal-content">
                                    <div class="modal-body">
                                        <select name="status" class="select2 custom-select form-control-border" id="status">
                                            <option value="new">New</option>
                                            <option value="in-process">In-Process</option>
                                            <option value="interestad">Interestad</option>
                                            <option value="not_interested">Not Interested</option>
                                            <option value="wait">Wait</option>
                                            <option value="follow_up">Follow Up</option>
                                            <option value="recycled">Recycled</option>
                                            <option value="converted">Converted</option>
                                            <option value="dead">Dead</option>
                                        </select>
                                    </div>
                                    <button type="submit" class="btn btn-primary yes" type="button">Submit</button>
                                </div>
                            </form>
                        </div>
                    </div>

                    <div id="UserOptionsModal" class="modal fade">
                        <div class="modal-dialog">
                            <form id="leadData">
                                <div class="modal-content">
                                    <div class="modal-body">
                                        <select name="user_id" class="select2 custom-select form-control-border" id="user_id">
                                            @foreach ($users as $user)
                                            <option value="{{$user->id}}">{{$user->name}}</option>
                                            @endforeach
                                        </select>
                                        <select name="status" class="select2 custom-select form-control-border" id="status">
                                            <option value="new">New</option>
                                            <option value="in-process">In-Process</option>
                                            <option value="interestad">Interested</option>
                                            <option value="not_interested">Not Interested</option>
                                            <option value="wait">Wait</option>
                                            <option value="follow_up">Follow Up</option>
                                            <option value="recycled">Recycled</option>
                                            <option value="converted">Converted</option>
                                            <option value="dead">Dead</option>
                                            <option value="Purchased_with_others">Purchased with others</option>
                                            <option value="Interested_in_other_projects">Interested in other projects</option>
                                            <option value="Low_Budget">Low Budget</option>
                                            <option value="Not_Qualified">Not Qualified</option>
                                            <option value="Broker">Broker</option>
                                            <option value="Spam_Lead">Spam Lead</option>
                                        </select>
                                    </div>
                                    <button type="submit" class="btn btn-primary yes" type="button">Submit</button>
                                </div>
                            </form>
                        </div>
                    </div>

                    <div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenter" aria-hidden="true">
                        <div class="modal-dialog modal-dialog-centered" role="document">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h5 class="modal-title">Delete Record</h5>
                                    <button class="btn-close" type="button" data-dismiss="modal" aria-label="Close"></button>
                                </div>
                                <div class="modal-body">
                                    <p>Are you sure to delete this record ?</p>
                                </div>
                                <form class="modal-footer" method="post">
                                    @csrf
                                    @method('DELETE')
                                    <button class="btn btn-secondary" type="button" data-dismiss="modal">Close</button>
                                    <button type="submit" class="btn btn-primary yes" type="button">Yes</button>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </div>


</section>
<script>
    clickbutton = (e) => {
        var leadIds = $('.sub_chk:checkbox:checked').map(function() {
            return $(this).data('id')
        }).get();
        var route = "{{route('leads.bulkAction',':id')}}";
        route = route.replace(':id', leadIds);
        $('#assignedUserModal').find($('form')).attr('action', route);
    }

    changeAll = (e) => {
        var leadIds = $('.sub_chk:checkbox:checked').map(function() {
            return $(this).data('id')
        }).get();
        var route = "{{route('leads.bulkAction',':id')}}";
        route = route.replace(':id', leadIds);
        $('#UserOptionsModal').find($('form')).attr('action', route);
    }

    changeStatus = (e) => {
        var leadIds = $('.sub_chk:checkbox:checked').map(function() {
            return $(this).data('id')
        }).get();
        var route = "{{route('leads.bulkAction',':id')}}";
        route = route.replace(':id', leadIds);
        $('#statusModal').find($('form')).attr('action', route);
    }
    clickDeletebutton = (e) => {
        const modelId = e.getAttribute("data-id");
        var route = "{{route('leads.destroy',':id')}}";
        route = route.replace(':id', modelId);
        $('#exampleModalCenter').find($('form')).attr('action', route);
    }
</script>
@endsection