@extends('layouts.app')
@section('title', __('lang_v1.contacts_long_time_not_active_report'))

@section('content')

    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1 class="tw-text-xl md:tw-text-3xl tw-font-bold tw-text-black">{{ __('lang_v1.contacts_long_time_not_active_report') }}</h1>
    </section>

    <!-- Main content -->
    <section class="content">
        <div class="row">
            <div class="col-md-12">
                @component('components.filters', ['title' => __('report.filters')])
                    {!! Form::open([
                        'url' => action([\App\Http\Controllers\ReportController::class, 'getContactsLongTimeNotActive']),
                        'method' => 'get',
                        'id' => 'getContactsLongTimeNotActive_form',
                    ]) !!}
                
                    
                    <div class="col-md-3">
                        <div class="form-group">
                            {!! Form::label('product_sr_date_filter', __('report.date_range') . ':') !!}
                            {!! Form::text('date_range', null, [
                                'placeholder' => __('lang_v1.select_a_date_range'),
                                'class' => 'form-control',
                                'id' => 'product_sr_date_filter',
                                'readonly',
                            ]) !!}
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            {!! Form::label('location_id', __('purchase.business_location') . ':') !!}
                            {!! Form::select('location_id', $business_locations ?? [], null, [
                                'class' => 'form-control select2',
                                'placeholder' => __('messages.all'),
                                'style' => 'width:100%',
                                'id' => 'location_id',
                            ]) !!}
                        </div>
                    </div>

                <div class="col-md-3">
                    <div class="form-group">
                        <label for="cg_filter">@lang('lang_v1.customer_group'):</label>
                        {!! Form::select('cg_filter', $customer_groups, null, ['class' => 'form-control', 'id' => 'cg_filter']) !!}
                    </div>
                </div>
              


                    {!! Form::close() !!}
                @endcomponent
            </div>
        </div>

        <div class="row">
            <div class="col-md-12">
                @component('components.widget', ['class' => 'box-solid'])
                    <table class="table table-bordered table-striped" id="contacts_long_time_not_active_report_table">
                        <thead>
                            <tr>
                                <th>@lang('report.contact_name')</th>
                                <th>@lang('report.contact_id')</th>
 
                                <th>@lang('report.last_transaction_date')</th>

                                <th>@lang('report.time_since_last_transaction')</th>

                                <th>@lang('report.last_transaction_final_total')</th>
                            </tr>
                        </thead>
                    </table>
                @endcomponent
            </div>
        </div>
    </section>
    <!-- /.content -->


@endsection

@section('javascript')
<script>
$(document).ready(function() {
    // تعريف المتغير أولًا
    let contacts_long_time_not_active_report;

    // تهيئة Date Range Picker
    $('#product_sr_date_filter').daterangepicker(
        $.extend(true, {}, dateRangeSettings, {
            startDate: moment().subtract(1, 'month'),  // الشهر الماضي كافتراضي
            endDate: moment()
        }),
        function(start, end) {
            $('#product_sr_date_filter').val(start.format(moment_date_format) + ' ~ ' + end.format(moment_date_format));
            if (contacts_long_time_not_active_report) {
                contacts_long_time_not_active_report.ajax.reload();
            }
        }
    );

    // عند إلغاء التحديد
    $('#product_sr_date_filter').on('cancel.daterangepicker', function(ev, picker) {
        $(this).val('');
        if (contacts_long_time_not_active_report) {
            contacts_long_time_not_active_report.ajax.reload();
        }
    });

    // عند تغيير الموقع
    $('#location_id').change(function() {
        if (contacts_long_time_not_active_report) {
            contacts_long_time_not_active_report.ajax.reload();
        }
    });

     $('#cg_filter').change(function() {
        if (contacts_long_time_not_active_report) {
            contacts_long_time_not_active_report.ajax.reload();
        }
    });

    // تعريف الأعمدة
    const columns = [
        { data: 'contact_name', name: 'name' },
         { data: 'contact_id', name: 'contact_id' },
        { data: 'last_transaction_date', name: 'last_transaction_date' },
        { data: 'time_since_last_transaction', name: 'time_since_last_transaction' },
        { data: 'last_transaction_final_total', name: 'last_transaction_final_total' }
    ];

    // تهيئة DataTable
    contacts_long_time_not_active_report = $('table#contacts_long_time_not_active_report_table').DataTable({
        processing: true,
        serverSide: true,
        fixedHeader: false,
        order: [[1, 'desc']], // ترتيب حسب تاريخ آخر معاملة (العمود الثاني)
        ajax: {
            url: "{{ action([\App\Http\Controllers\ReportController::class, 'getContactsLongTimeNotActive']) }}",
            data: function(d) {
                const dateRange = $('#product_sr_date_filter').val();
                if (dateRange) {
                   var start = '';
                        var end = '';
                        var start_time = $('#start_time').val();
                        var end_time = $('#end_time').val();
                        if ($('#product_sr_date_filter').val()) {
                            start = $('input#product_sr_date_filter')
                                .data('daterangepicker')
                                .startDate.format('YYYY-MM-DD');
                            end = $('input#product_sr_date_filter')
                                .data('daterangepicker')
                                .endDate.format('YYYY-MM-DD');

                            start = moment(start + " " + start_time, "YYYY-MM-DD" + " " +
                                moment_time_format).format('YYYY-MM-DD HH:mm');
                            end = moment(end + " " + end_time, "YYYY-MM-DD" + " " + moment_time_format)
                                .format('YYYY-MM-DD HH:mm');
                        }
                        d.start_date = start;
                        d.end_date = end;
                }
                d.location_id = $('#location_id').val();
                d.cg_filter = $('#cg_filter').val();
            }
        },
        columns: columns,
    
    });
});
</script>
@endsection