@extends('adminlte::page')

@section('title', 'ORBI Dashboard')

@section('content_header')
    <h1>Direct leads</h1>
    {{-- <small>Direct leads</small> --}}
@stop

@section('content')
    <div class="card card-dark">
        <div class="card-header">
            <h3 class="card-title"></h3>
            <div class="card-tools">
                <a href="{{ route('direct_leads.create') }}" class="btn btn-dark"><i class="fas fa-plus"></i> Add direct lead
                </a>
            </div>
        </div>

        <div class="card-body">
            <table class="table table-bordered directLead-datatable">
                <thead>
                    <tr>
                        <th>Name</th>
                        <th>Phone</th>
                        <th>Email</th>  
                        <th>Source</th>
                        <th>Actions</th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </div>
@stop

@section('js')

    <script type="text/javascript">
        $(function() {

            var dataTable = $('.directLead-datatable').DataTable({
                processing: true,
                serverSide: true,
                pageLength: 10,
                searching: true,
                'ajax': {
                    'url': "{{ route('leads.index') }}",
                    'data': function(data) {
                    }
                },
                columns: [

                    {
                        data: 'name',
                        name: 'name'
                    },
                    {
                        data: 'phone_number',
                        name: 'phone_number',
                    },
                    {
                        data: 'email',
                        name: 'email',
                    },
                    { data: 'source', 
                      name: 'source'
                    },
                    {
                        data: 'action',
                        name: 'action',
                        orderable: false,
                        searchable: false
                    },
                ]
            });

            $('#search_keyword').keyup(function() {
                dataTable.draw();
            });

        });
  
        $(document).on('click', '.delete-directLead', function () {
            var id = $(this).data('id');
            var url = "{{ route('direct_leads.destroy', ':id') }}".replace(':id', id);
            
            $.ajax({
                url: url,
                type: 'POST',
                data: {
                    _method: 'POST',
                    _token: "{{ csrf_token() }}"
                },
                success: function (response) {
                    if (response.success) {
                        sessionStorage.setItem('delete_success', 'lead deleted successfully.');
                        location.reload(); // Reload page after setting message
                    } 
                        },
                error: function (xhr) {
                    alert('Something went wrong!');
                }
            });
        });
           // Show the message after reload
           $(document).ready(function () {
            var successMessage = sessionStorage.getItem('delete_success');
            if (successMessage) {
                $('.card-body').prepend('<div class="alert alert-success">' + successMessage + '</div>');
                sessionStorage.removeItem('delete_success'); // Remove message after showing
            }
        });
</script>
@stop