@extends('layouts.master')

@section('page_title', 'Call Status Details')
@section('title', 'Call Status Details')
@section('main_item', 'Oder')
@section('sub_item', 'Call Status Details')

@section('content')
    <style>
        div.dt-buttons {
            position: relative;
            float: right;
        }

        div.dataTables_filter {
            margin-top: 7px
        }
    </style>



    <div class="col-md-12" style="padding-bottom: 20px;padding-right: 30px;">
        <form action="{{ route('reports.new_callindex') }}" method="get" id="filter_form">
            <div class="btn-group" role="group" aria-label="Basic example" style="float: right;">
                <a href="{{ route('reports.new_callindex') }}" id="pending" class="btn btn-primary  submit-filters"
                    data-type="pending">Pending
                </a>
                <a href="{{ route('reports.new_callindex') }}" id="confirm" class="btn btn-primary  submit-filters"
                    data-type="confirm">Confirm
                </a>
                <a href="{{ route('reports.new_callindex') }}" id="not_confirm" class="btn btn-primary  submit-filters"
                    data-type="not_confirm">Not Confirm
                </a>
                <a href="{{ route('reports.new_callindex') }}" id="hold_oders" class="btn btn-primary  submit-filters"
                    data-type="hold_oders">Hold Orders
                </a>
                <a href="{{ route('reports.new_callindex') }}" id="cancel" class="btn btn-primary  submit-filters"
                    data-type="cancel">Cancel Orders
                </a>
            </div>
    </div>
    <div class="col-12">
        <div class="card">


            <div id="accordion">

                <div class="border-bottom card-header" style="background-color: white; cursor: pointer;" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                    <h4 class="mb-0 header-title">
                        Filter
                    </h4>
                </div>


            <div id="collapseOne" class="collapse show mt-3" aria-labelledby="headingOne" data-parent="#accordion">

            <div class="card-body">

                <div class="row">
                    <input type="hidden" id="status" name="status">
                    <div class="col-md-3" @if ($settings->business_location != '1') style="display: none" @endif>
                        <div class="form-group">
                            <label class="required" style="font-weight: bold" for="activate_code">business
                                Location</label>
                            <select class="form-control form-select-lg mb-3" id="business_location_id" name="business_location_id">
                                <option value="">All</option>
                                @if (Auth::user()->role_id == '1')
                                    @foreach ($users_access_location as $business_location)
                                        @if ($business_location->is_active == '1')
                                            <option value="{{ $business_location->id }}"
                                                @if (request('business_location_id') == $business_location->id) selected @endif>
                                                {{ $business_location->name }}
                                            </option>
                                        @else
                                        @endif
                                    @endforeach
                                @else
                                    @foreach ($users_access_location as $business_location)
                                        @if ($business_location->is_active == '1')
                                            <option value="{{ $business_location->business_location_id }}"
                                                @if (request('business_location_id') == $business_location->business_location_id) selected @endif>
                                                {{ $business_location->name }}
                                            </option>
                                        @else
                                        @endif
                                    @endforeach
                                @endif
                            </select>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label style="font-weight: bold" for="supplier">Customer Name</label>
                            <input id="customer_name" name="customer_name" type="text" class="form-control"
                                placeholder="Search for Customer Name..." aria-label="Search for Customer Name..."
                                value="{{ request('customer_name') }}">
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label style="font-weight: bold" for="supplier">Customer Mobile Number</label>
                            <input id="mobile" name="mobile" type="number" class="form-control"
                                placeholder="Search for Customer Mobile Number..."
                                aria-label="Search for Customer Mobile Number..." value="{{ request('mobile') }}">
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label for="reportrange" style="font-weight: bold"> Date </label>
                            <div class="input-group">
                               
                                <input type="text" class="form-control" name="dates" id="date"
                                    value="{{ request('dates') }}"
                                    readonly>
                         
                                <div class="input-group-append">
                                    <span class="input-group-text"><i class="dripicons-calendar"></i></span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3" >
                        <div class="form-group">
                            <label class="required" style="font-weight: bold" for="activate_code">Resources</label>
                            <select class="form-control select2" id="resources" name="resources">
                                <option value="">All</option>
                                <option value="whats_app" {{ request('resources') == 'whats_app' ? 'selected' : '' }}>Whats App</option>
                                <option value="face_book_leeds" {{ request('resources') == 'face_book_leeds' ? 'selected' : '' }}>Face Book Leeds</option>
                                <option value="face_book_massenger" {{ request('resources') == 'face_book_massenger' ? 'selected' : '' }}>Face Book Massenger</option>
                                <option value="bulk_order" {{ request('resources') == 'bulk_order' ? 'selected' : '' }}>Bulk Order</option>
                                <option value="daraz" {{ request('resources') == 'daraz' ? 'selected' : '' }}>Daraz</option>
                                <option value="voucher" {{ request('resources') == 'voucher' ? 'selected' : '' }}>Voucher Order</option>
                                <option value="tamil_order" {{ request('resources') == 'tamil_order' ? 'selected' : '' }}>Tamil Order</option>
                                <option value="missed_call" {{ request('resources') == 'missed_call' ? 'selected' : '' }}>Missed Call</option>
                                <option value="follow_up" {{ request('resources') == 'follow_up' ? 'selected' : '' }}>Follow Up</option>
                                <option value="exchange" {{ request('resources') == 'exchange' ? 'selected' : '' }}>Exchange</option>
                                <option value="re_arrange" {{ request('resources') == 're_arrange' ? 'selected' : '' }}>Re arrange</option>
                                <option value="gift" {{ request('resources') == 'gift' ? 'selected' : '' }}>Gift</option>
                                <option value="contact_person" {{ request('resources') == 'contact_person' ? 'selected' : '' }}>Contact person</option>
                                <option value="flagship_store" {{ request('resources') == 'flagship_store' ? 'selected' : '' }}>Flagship store</option>
                                <option value="meta" {{ request('resources') == 'meta' ? 'selected' : '' }}>Meta</option>
                                <option value="online" {{ request('resources') == 'online' ? 'selected' : '' }}>Online</option>
                                <option value="call_order" {{ request('resources') == 'call_order' ? 'selected' : '' }}>Call order</option>
                                <option value="tiktok_order" {{ request('resources') == 'tiktok_order' ? 'selected' : '' }}>TikTok Order</option>
                            </select>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <label class="form-label" style="font-weight: bold">Sort As</label>
                        <select class="form-control select2" name="sort">
                            <option value="">All</option>
                            <option value="desc" @if (request('sort') == 'desc') selected @endif>Descending</option>
                            <option value="asc" @if (request('sort') == 'asc') selected @endif>Ascending</option>
                        </select>
                    </div>
                    <div class="col-md-3" @if ($settings->order_batch_enable != '1') style="display: none" @endif>
                        <div class="form-group">
                            <label class="required" style="font-weight: bold" for="activate_code">Campaign Name</label>
                            <select class="form-control select2" id="order_batch" name="order_batch">
                                <option value="">All</option>
                                @foreach ($order_batch_ids as $order_batch_id)
                                    <option value="{{ $order_batch_id->id }}"
                                        @if (request('order_batch') == $order_batch_id->id) selected @endif>{{ $order_batch_id->batch_name }}
                                    </option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label style="font-weight: bold" for="ref_no">Order ID</label>
                            <input id="ref_no" name="ref_no" type="text" class="form-control"
                                placeholder="Search for..." aria-label="Search for..." value="{{ request('ref_no') }}">
                        </div>
                    </div>
                    <div class="col-md-3" @if ($settings->product_filter_enable != '1') style="display: none" @endif>
                        <div class="form-group">
                            <label style="font-weight: bold" for="p_name">Product Name</label>
                            <select class="form-control select2" id="p_name" name="p_name">
                                <option value="">All</option>
                                @foreach ($products as $product)
                                    <option value="{{ $product->id }}"
                                        @if (request('p_name') == $product->id) selected @endif>{{ $product->product_name }}
                                    </option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                </div>
                <div>
                    <button type="submit" class="btn btn-primary px-5 py-2" id="btn-search"
                        data-type="table">Filter</button>
                    <a href="{{ route('reports.new_callindex') }}" class="btn btn-danger px-5 py-2">Reset</a>
                </div>

                <input type="hidden" name="data_type" id="data_type" value="{{ request('data_type') }}">
                </form>
            </div>
        </div>
    </div>
        </div>
    </div>

    <div class="col-md-12 mt-2" style="width: 1180px;">
        <div class="card">
            <div class="card-body">
                  {{-- <div>
                    <a href="{{ route('reports.new_callindex', request()->query()) }}"
                        class="btn btn-primary float-right px-5 mb-3 submit-filters" 
                        data-type="excel">
                        Download Excel
                     </a>
                </div> --}}
                <div class="table-responsive dash-social">
                    <table id="salesTable" class="table table-hover" style="width:100%">
                        <thead class="thead-dark">
                            <tr>
                                <th>Action</th>
                                <th>Call Status</th>
                                <th>Order ID</th>
                                <th>Waybill No</th>
                                <th>Resources</th>
                                <th>Orders Count</th>                                
                                {{-- <th>Business Location</th> --}}
                                <th>Customer</th>
                                <th>Mobile No</th>
                                <th>Address</th>
                                <th>City</th>
                                <th>Invoice Total</th>
                                <th>Product Name</th>
                                <th>Product Sku</th>
                                <th>Last Status</th>
                                <th>Remark</th>
                                <th>Next Call Date</th>
                                <th>Call Attempt</th>
                                <th>Sale Date</th>
                                <th>Updated</th>
                                
                                
                            </tr>
                            <!--end tr-->
                        </thead>
                        <tbody>
                            @foreach ($sales as $sale)
                                <tr>
                                    <td>
                                        <div class="dropdown">
                                            <button class="btn {{ $sale->call_status == 'cancel' ? 'btn-info' : 'btn-secondary' }} dropdown-toggle" type="button"
                                                id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true"
                                                aria-expanded="false" {{ $sale->call_status == 'cancel' ? 'disabled' : '' }}>Action
                                            </button>
                                            <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                                                <a href="{{ url('orders/' . $sale->id . '/edit') }}" 
                                                    class="dropdown-item" data-toggle="tooltip" data-placement="top" 
                                                    title="Edit Order" {{ $settings->multi_tab == 1 ? 'target="_blank"' : '' }}>
                                                    <i class="fas fa-edit text-success font-16"></i> Edit
                                                </a>
                                            </div>
                                        </div>
                                    </td>
                                    <td>
                                        <span class="badge badge-{{ $sale->call_status == 'pending' ? 'warning' : ($sale->call_status == 'confirm' ? 'success' : ($sale->call_status == 'not_confirm' ? 'secondary' : ($sale->call_status == 'cancel' ? 'danger' : 'info'))) }}">
                                            {{ ucfirst(str_replace('_', ' ', $sale->call_status)) }}
                                        </span>
                                        @if ($sale->call_status != 'cancel')
                                            <a href="javascript:void(0)" id="add" data-href="{{ url('call-status/' . $sale->id . '/add') }}"
                                                class="dropdown-item"><i class="fa fa-edit text-success font-16"></i></a>
                                        @endif
                                    </td>
                                    <td>{{ $sale->invoice_no ?? $sale->ref_no ?? 'N/A' }}</td>
                                    <td>{{ $sale->waybill_no ? $sale->waybill_prefix . $sale->waybill_no . $sale->waybill_postfix : 'N/A' }}</td>
                                    <td>
                                        @php
                                            $resource_badges = [
                                                'whats_app' => ['color' => 'warning'],
                                                'face_book_leeds' => ['color' => 'success'],
                                                'face_book_massenger' => ['color' => 'secondary'],
                                                'bulk_order' => ['color' => 'danger'],
                                                'daraz' => ['color' => 'primary'],
                                                'follow_up' => ['color' => 'primary', 'bg' => '#996633'],
                                                'tamil_order' => ['color' => 'primary', 'bg' => '#6600ff'],
                                                'missed_call' => ['color' => 'primary', 'bg' => '#cc9900'],
                                                'call_order' => ['color' => '', 'bg' => '#897004', 'text' => 'white'],
                                                'voucher' => ['color' => 'primary', 'bg' => '#16a085'],
                                                'flagship_store' => ['color' => 'primary', 'bg' => '#1e3799'],
                                                'meta' => ['color' => 'primary', 'bg' => '#0e6655'],
                                                'online' => ['color' => 'primary', 'bg' => '#922b21'],
                                                'tiktok_order' => ['color' => 'primary', 'bg' => '#fcbe8f']
                                            ];                                          
                                            $resource = $sale->resources ?? 'N/A';
                                            $badge = $resource_badges[$resource] ?? ['color' => 'info']; 
                                            $bgColor = $badge['bg'] ?? ''; 
                                            $textColor = $badge['text'] ?? 'white';
                                        @endphp
                                    
                                        <span class="badge badge-{{ $badge['color'] }}" 
                                              style="background: {{ $bgColor }}; color: {{ $textColor }};">
                                            {{ ucfirst(str_replace('_', ' ', $resource)) }}
                                        </span>
                                        @if ($sale->call_status != 'cancel')
                                            <a href="javascript:void(0)" id="resources_change_status"
                                                data-href="{{ route('oder.resources_status', $sale->id) }}"
                                                class="mr-2 dropdown-item"><i class="fa fa-edit text-success font-16"></i></a>
                                        @endif
                                    <td>
                                        <a href="{{ url('customers/' . $sale->contact_id) }}" class="dropdown-item">
                                            <span class="badge badge-success" style="text-align: center; font-size: 16px">
                                                {{ $sale->customerOrdersCount() }}
                                            </span>
                                        </a>
                                    </td>
                                    </td>


                                    {{-- <td>{{ $sale->business_locations->name ?? 'N/A' }}</td> --}}
                                    <td>
                                        {{ $sale->customer->name }}
                                        <a href="javascript:void(0);" class="edit-name" data-id="{{ $sale->id }}">
                                            <i class="fa fa-edit text-success ml-2"></i>
                                        </a>
                                    </td>
                                    <td>
                                        {{ $sale->customer->mobile }} <br>{{ $sale->customer->mobile_2 }}
                                        <a href="javascript:void(0);" class="edit-mobile" data-id="{{ $sale->id }}">
                                            <i class="fa fa-edit text-success ml-2"></i>
                                        </a>
                                    </td>
                                    <td>
                                        {{ $sale->customer->landmark }}
                                        <a href="javascript:void(0);" class="edit-landmark" data-id="{{ $sale->id }}">
                                            <i class="fa fa-edit text-success ml-2"></i>
                                        </a>
                                    </td>
                                    <td>
                                        {{ $sale->getCustomerCityName() ?? 'N/A' }}
                                        <a href="javascript:void(0);" class="edit-city" data-id="{{ $sale->id }}">
                                            <i class="fa fa-edit text-success ml-2"></i>
                                        </a>
                                    </td>


                                    <td>{{ number_format($sale->invoice_nettotal, 2) }}</td>
                                    <td>{{ $sale->saleItems->pluck('product.product_name')->implode(', ') }}</td>
                                    <td>{{ $sale->saleItems->pluck('product.sku')->implode(', ') }}</td>
                                    <td>
                                        <span class="badge badge-info">{{ $sale->callStatuses->last()->call_status_reason ?? 'N/A' }}</span>
                                    </td>
                                    <td>{{ $sale->callStatuses->first()->remark ?? 'N/A' }}</td>
                                    <td>{{ optional($sale->callStatuses->first())->next_call_date ? \Carbon\Carbon::parse($sale->callStatuses->first()->next_call_date)->format('Y-m-d') : 'N/A' }}</td>
                                    <td>{{ $sale->callStatuses->count() }}</td>
                                    <td>{{ Carbon\Carbon::parse($sale->sale_date)->toDateString() }}</td>
                                    <td>{{ Carbon\Carbon::parse($sale->updated_at)->toDateString() }}</td>

                                </tr>
                            @endforeach
                        </tbody>

                        <tfoot>
                            <tr>
                                <th colspan="10" style="text-align: center"></th>
                                <th style="font-weight: bold">Total</th>
                                <th colspan="1"></th>
                            </tr>
                        </tfoot>
                    </table>
                    <div class="d-flex justify-content-end">
                        {{ $sales->appends($_GET)->links() }}
                    </div>
                    @php
                    $count = $sales->count();
                @endphp

                    <div>
                        <span style="font-weight: bold">Total Count&nbsp;&nbsp;
                            {{ $count }}
                        </span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <input class="form-check-input" id="customer_profile_enable" type="text" name="customer_profile_enable"
        value="{{ $settings->customer_profile_enable }}" hidden>
    <input class="form-check-input" id="order_batch_enable" type="text" name="order_batch_enable"
        value="{{ $settings->order_batch_enable }}" hidden>
    <div id="call-status" class="modal fade"></div>
    <div id="status-gender" class="modal fade"></div>
    <div id="status-resources" class="modal fade"></div>

    <input type="hidden" id="enable_all_date_for_call_list" value="{{ $settings->enable_all_date_for_call_list == '1' ? '1' : '0' }}">
    <!-- model for update -->
    <div class="modal fade" id="editFieldModal" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-md" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title" id="modalTitle">Edit</h5>
              <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body">
              <!-- AJAX content here -->
            </div>
          </div>
        </div>
      </div>
@endsection
@section('scripts')
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script>
    <script>
        $(document).on('change', '#reportrange ,#status, #business_location_id, #id', function() {
            table.ajax.reload();
        })

        $(document).on('click', '.date_range ', function() {
            let report = $(this).attr('id');
            $('#status').val(report);
            localStorage.setItem("dropstatus", report);
            table.ajax.reload();
        })

        $(document).ready(function() {
            setInterval(function() {
                location.reload();
                // console.log('hi');
            }, 300000);
        });

        $(document).on('click', '#add', function() {
            $('#call-status').load($(this).data('href'), function() {
                $('#mdate').bootstrapMaterialDatePicker({
                    weekStart: 0,
                    time: false
                });
                $('#call-status').modal('show');
            })
        });
        $(document).on('change', '#call_status', function() {
            let val = $(this).val();

            if (val === 'hold_oders') {
                $('.response').attr('hidden', true);
                $('.call_date').attr('hidden', false);
            } else {
                $('.response').attr('hidden', false);
                $('.call_date').attr('hidden', true);
                $('.next_call_date').val('');
            }
            if (val === 'confirm' || val === 'cancel' || val === 'not_confirm') {
                $('#call_status_sms').prop('checked', true);
                $("#call_status_sms").prop("disabled", false);
            } else {
                $('#call_status_sms').prop('checked', false);
                $("#call_status_sms").prop("disabled", true);
            }
        })

        $(document).on('click', '#update_payment', function() {
            let call_status = $('#call_status').val();
            let call_status_reason = $('#call_status-reson').val();
            let next_call_date = $('.next_call_date').val();
            let id = $('#sale_id').val();
            let user_ids = $('#user_ids').val();
            let remark = $('#remark').val();
            var call_status_sms = "0";
            if ($('#call_status_sms').prop("checked") == true) {
                call_status_sms = "1";
            }
            let url = "{{ route('call-status.update-status') }}";
            $.ajax({
                method: 'POST',
                url: url,
                data: {
                    "_token": "{{ csrf_token() }}",
                    'call_status': call_status,
                    'id': id,
                    'user_ids': user_ids,
                    'remark': remark,
                    'call_status_reason': call_status_reason,
                    'next_call_date': next_call_date,
                    'call_status_sms': call_status_sms
                },
                success: function(response) {
                    if (response == 'ok') {
                        $('#call-status').modal('hide');
                        document.location.reload();
                        table.ajax.reload();
                    }
                }
            });
        });
        $(document).on('click', '#gender_change_status', function() {
            $('#status-gender').load($(this).data('href'), function() {
                $('#mdate').bootstrapMaterialDatePicker({
                    weekStart: 0,
                    time: false
                });
                $('#status-gender').modal('show');
            })
        });

        $(document).on('click', '#update_gender_status', function() {
            let gender = $('#gender').val();
            let id = $('#sale_id').val();
            let url = "{{ route('gender-status.update-status') }}";
            $.ajax({
                method: 'POST',
                url: url,
                data: {
                    "_token": "{{ csrf_token() }}",
                    'gender': gender,
                    'id': id,
                },
                success: function(response) {
                    $('#status-gender').modal('hide');
                    $.toast({
                        heading: 'Successfully update.!',
                        text: response.msg,
                        position: 'top-right',
                        bgColor: '#1ecab8',
                        icon: 'success',
                        showHideTransition: 'fade',
                        loaderBg: '#ecf0f1'
                    })
                    document.location.reload();
                    
                }
            });
        });
        $(document).on('click', '#resources_change_status', function() {
            $('#status-resources').load($(this).data('href'), function() {
                $('#mdate').bootstrapMaterialDatePicker({
                    weekStart: 0,
                    time: false
                });
                $('#status-resources').modal('show');
            })
        });

        $(document).on('click', '#update_resources_status', function() {
            let resources = $('#resources_new').val();
            let id = $('#sale_id').val();
            let url = "{{ route('resources-status.update-status') }}";
            $.ajax({
                method: 'POST',
                url: url,
                data: {
                    "_token": "{{ csrf_token() }}",
                    'resources': resources,
                    'id': id,
                },
                success: function(response) {
                    $('#status-resources').modal('hide');
                    $.toast({
                        heading: 'Successfully update.!',
                        text: response.msg,
                        position: 'top-right',
                        bgColor: '#1ecab8',
                        icon: 'success',
                        showHideTransition: 'fade',
                        loaderBg: '#ecf0f1'
                    })
                    document.location.reload();
                    table.ajax.reload();
                }
            });
        });
        $(document).on('click', '.submit-filters', function(e) {
            e.preventDefault()
            let data_type = $(this).data('type');
            $('#data_type').val(data_type);
            $('#filter_form').submit();
        });

        var enableAllDateForCallList = document.getElementById('enable_all_date_for_call_list').value;

        var start;
        if (enableAllDateForCallList === '1') {
            start = moment('2020-01-01');
        } else {
            start = moment().subtract(29, 'days');
        }
        var end = moment();

        function cb(start, end) {
            $('#date span').html(start.format('MM-DD-YYYY') + ' - ' + end.format('MM-DD-YYYY'));
        }
        var current_year = (new Date()).getFullYear() + "-01-01";
        $('#date').daterangepicker({
            startDate: start,
            endDate: end,
            ranges: {
                'All Data': ['2020-01-01', moment()],
                'Today': [moment(), moment()],
                'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
                'Day before yesterday': [moment().subtract(2, 'days'), moment().subtract(2, 'days')],
                'Last 7 Days': [moment().subtract(6, 'days'), moment()],
                'Last 30 Days': [moment().subtract(29, 'days'), moment()],
                'This Month': [moment().startOf('month'), moment().endOf('month')],
                'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf(
                    'month')],
                'Last 6 Months': [moment().subtract(5, 'month'), moment()],
            },
            locale: {
                format: 'Y-MM-DD'
            }
        }, cb);
        $(document).ready(function() {
            var getUrlParameter = function getUrlParameter(sParam) {
                var sPageURL = decodeURIComponent(window.location.search.substring(1)),
                    sURLVariables = sPageURL.split('&'),
                    sParameterName,
                    i;
                for (i = 0; i < sURLVariables.length; i++) {
                    sParameterName = sURLVariables[i].split('=');

                    if (sParameterName[0] === sParam) {
                        return sParameterName[1] === undefined ? true : sParameterName[1];
                    }
                }
            };
            var report_date = getUrlParameter('dates');
            myString = report_date.split('+-+').join('/');
            var result = myString.split('/');
            $('#date').daterangepicker({
                startDate: result[0],
                endDate: result[1],
                ranges: {
                    'All Data': ['2020-01-01', moment()],
                    'Today': [moment(), moment()],
                    'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
                    'Last 7 Days': [moment().subtract(6, 'days'), moment()],
                    'Last 30 Days': [moment().subtract(29, 'days'), moment()],
                    'This Month': [moment().startOf('month'), moment().endOf('month')],
                    'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1,
                        'month').endOf('month')]
                },
                locale: {
                    format: 'Y-M-DD'
                }
            });

        });

        document.addEventListener('DOMContentLoaded', function () {
            const storedDataType = document.getElementById('data_type').value;            
            if (storedDataType) {
                document.querySelectorAll('.submit-filters').forEach(function (button) {
                    if (button.getAttribute('data-type') === storedDataType) {
                        button.classList.add('active');
                    }
                });
            }
        });

    </script>
    <script>
  $(document).ready(function() {
    $('#salesTable').DataTable({
        dom: 'Bfrtip',
        buttons: [
            {
                extend: 'excelHtml5',
                text: 'Download Excel',
                className: 'btn btn-primary float-right px-5 mb-3',
                exportOptions: {
                    columns: ':not(:first-child)' // Excludes the first column from export
                }
            }
        ],
        searching: false,
        responsive: true
    });
});
        </script>
        <script>
            $(document).ready(function () {
                // Edit name
                $(document).on('click', '.edit-name', function () {
                    let id = $(this).data('id');
                    $.ajax({
                        url: '/sales/' + id + '/edit-name',
                        success: function (res) {
                            $('#modalTitle').text('Edit Name');
                            $('#editFieldModal .modal-body').html(res);
                            $('#editFieldModal').modal('show');
                        }
                    });
                });
            
                // Edit mobile
                $(document).on('click', '.edit-mobile', function () {
                    let id = $(this).data('id');
                    $.ajax({
                        url: '/sales/' + id + '/edit-mobile',
                        success: function (res) {
                            $('#modalTitle').text('Edit Mobile');
                            $('#editFieldModal .modal-body').html(res);
                            $('#editFieldModal').modal('show');
                        }
                    });
                });
            
                // Edit landmark
                $(document).on('click', '.edit-landmark', function () {
                    let id = $(this).data('id');
                    $.ajax({
                        url: '/sales/' + id + '/edit-landmark',
                        success: function (res) {
                            $('#modalTitle').text('Edit Landmark');
                            $('#editFieldModal .modal-body').html(res);
                            $('#editFieldModal').modal('show');
                        }
                    });
                });
            
                // Edit city
                $(document).on('click', '.edit-city', function () {
                    let id = $(this).data('id');
                    $.ajax({
                        url: '/sales/' + id + '/edit-city',
                        success: function (res) {
                            $('#modalTitle').text('Edit City');
                            $('#editFieldModal .modal-body').html(res);
                            $('#editFieldModal').modal('show');
                        }
                    });
                });
            });
            </script>

<script>
    $(document).on('submit', '#update-name-form', function(e) {
        e.preventDefault();
        
        let id = $(this).data('id');
        let formData = $(this).serialize();
    
        $.ajax({
            type: 'POST',
            url: '/sales/' + id + '/update-name',
            data: formData,
            success: function(response) {
                if (response.success) {
                    $.toast({
                        heading: 'Successfully update.!',
                        text: response.message,
                        position: 'top-right',
                        bgColor: '#1ecab8',
                        icon: 'success',
                        showHideTransition: 'fade',
                        loaderBg: '#ecf0f1'
                    })
                    setTimeout(function() {
                        document.location.reload(); // Reload the page after 3 seconds
                    }, 3000);
                    $('#editFieldModal').modal('hide');
                    // Optionally reload the page or refresh the table row
                    //location.reload(); 
                }
            },
            error: function(xhr) {
                $.toast({
                heading: 'Error!',
                text: 'Something went wrong. Please try again later.', // Customize the error message
                position: 'top-right',
                bgColor: '#FF6347', // Red background for error
                icon: 'error',
                showHideTransition: 'fade',
                loaderBg: '#ecf0f1'
                });
            }
        });
    });
        $(document).on('submit', '#update-mobile-form', function(e) {
        e.preventDefault();

        let id = $(this).data('id');
        let formData = $(this).serialize();

        $.ajax({
            type: 'POST',
            url: '/sales/' + id + '/update-mobile',
            data: formData,
            success: function(response) {
                if (response.success) {
                    $.toast({
                        heading: 'Successfully update.!',
                        text: response.message,
                        position: 'top-right',
                        bgColor: '#1ecab8',
                        icon: 'success',
                        showHideTransition: 'fade',
                        loaderBg: '#ecf0f1'
                    })
                    setTimeout(function() {
                        document.location.reload(); // Reload the page after 3 seconds
                    }, 3000);
                    $('#editFieldModal').modal('hide');
                    //location.reload(); // optionally reload just the row
                }
            },
            error: function(xhr) {
                $.toast({
                heading: 'Error!',
                text: 'Something went wrong. Please try again later.', // Customize the error message
                position: 'top-right',
                bgColor: '#FF6347', // Red background for error
                icon: 'error',
                showHideTransition: 'fade',
                loaderBg: '#ecf0f1'
            });
            }
        });
    });

    $(document).on('submit', '#update-address-form', function(e) {
        e.preventDefault();

        let id = $(this).data('id');
        let formData = $(this).serialize();

        $.ajax({
            type: 'POST',
            url: '/sales/' + id + '/update-address',
            data: formData,
            success: function(response) {
                if (response.success) {
                    // You can use a toast too
                    $.toast({
                        heading: 'Successfully update.!',
                        text: response.message,
                        position: 'top-right',
                        bgColor: '#1ecab8',
                        icon: 'success',
                        showHideTransition: 'fade',
                        loaderBg: '#ecf0f1'
                    })
                    setTimeout(function() {
                        document.location.reload(); // Reload the page after 3 seconds
                    }, 3000);
                    $('#editFieldModal').modal('hide');
                    
                   // location.reload(); // or refresh row
                }
            },
            error: function(xhr) {
                $.toast({
                heading: 'Error!',
                text: 'Something went wrong. Please try again later.', // Customize the error message
                position: 'top-right',
                bgColor: '#FF6347', // Red background for error
                icon: 'error',
                showHideTransition: 'fade',
                loaderBg: '#ecf0f1'
            });
            }
        });
    });
   

    $(document).on('submit', '#update-city-form', function(e) {
    e.preventDefault();

    let id = $(this).data('id');
    let formData = $(this).serialize();
    let modal = new bootstrap.Modal(document.getElementById('editFieldModal'));
    
    $.ajax({
        type: 'POST',
        url: '/sales/' + id + '/update-city',
        data: formData,
        success: function(response) {
            if (response.success) {
                // Show success toast
                alert(response.message);

                // Hide modal and reload page after 3 seconds
                
                    $('#editFieldModal').modal('hide');  // Hide modal
                    document.location.reload();  // Reload the page after 3 seconds
                
            }
        },
        error: function(xhr) {
            alert('Something went wrong. Please try again later.');
        }
    });
});
    </script>
    
@endsection