@extends("admin.layouts.app")
@section("styles")
    <link href="https://cdn.ihouse.ps/admin_assets/assets/global/plugins/select2/css/select2.min.css" rel="stylesheet"
          type="text/css"/>
    <link href="https://cdn.ihouse.ps/admin_assets/assets/global/plugins/select2/css/select2-bootstrap.min.css"
          rel="stylesheet"
          type="text/css"/>
    <style>
        [hidden] {
            display: none !important;
        }

        .btn:not(.md-skip):not(.bs-select-all):not(.bs-deselect-all) {
            text-transform: capitalize;
        }

        #cke_1_contents {
            height: 600px !important;
        }
    </style>
@endsection
@section("content")
    <div class="row">
        <div class="col-md-12">
            <div class="portlet light bordered">
                <div class="portlet-title">
                    <div class="caption font-green">
                        <i class="icon-plus font-green"></i>
                        <span class="caption-subject bold uppercase">ارسال نموذج</span>
                    </div>
                    <div class="actions">

                        <a href="{{ route('admin.message_templates.index') }}" class="btn btn-primary">
                            <i class="fa fa-arrow-left"></i>back to message template
                        </a>


                    </div>
                </div>
                @if ($errors->any())
                    @foreach ($errors->all() as $error)
                        <div dir="rtl" class="alert alert-danger alert-dismissible" role="alert">
                            <strong>{{ 'خطأ !' }}</strong> {{ $error }}
                            <button dir="ltr" type="button" class="close" data-dismiss="alert" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                    @endforeach
                @endif

                {{ Form::open(['route' => "admin.bulk-sms", 'role' => "form"]) }}
                 <div class="row" style="direction: rtl">
                        <div class="col-md-12">
                            <div class="col-md-6">
                                <div class="form-group " >
                                    <label for="status">
                                        ارسال الى
                                    </label>
                                    {!! Form::select("send_to",['ALL_CUSTOMER'=>"جميع الزبائن",'CUSTOMER'=>"اختيار زبون","GROUP"=>'اختيار مجموعة',"FREE_CUSTOMER"=>'مخصص'],null,['class'=>"form-control form-control m-input form-md-floating-label" ,"id"=>"send_to",'placeholder'=>'تحديد المرسل اليه'])!!}
                                </div>
                                <div id="customer_count" class="form-group" style="margin-top: 10px; display: none;">
                                    <label>{{ __(' ملاحظات') }}</label>
                                    <div class="alert alert-warning" id="total_sms_alert"> </div>
                                </div>
                                <div id="group_count" class="form-group" style="margin-top: 10px; display: none;">
                                    <label>{{ __(' ملاحظات') }}</label>
                                    <div class="alert alert-warning" id="total_sms_alert_group"> </div>
                                </div>
                                <div id="free_customer_count" class="form-group" style="margin-top: 10px; display: none;">
                                    <label>{{ __(' ملاحظات') }}</label>
                                    <div class="alert alert-warning" id="total_sms_alert_free_customer"> </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="message_id"><span class="required_lbl">*</span>{{ __('عنوان الرسالة') }}</label>
                                    {!! Form::select(
                                        'message_id',
                                        $messageTemplates->where('status',true)->pluck('title', 'id')->toArray(), // Creates options with 'id' as keys and 'title' as values
                                        null,
                                        [
                                            'class' => 'form-control',
                                            'id' => 'message_id',
                                            'required' => true,
                                            'placeholder' => 'اختر نموذج للارسال',
                                        ]
                                    ) !!}

                                </div>

                                <div id="message_body" class="form-group" style="margin-top: 10px; display: none;">
                                    <label>{{ __('نص الرسالة') }}</label>
                                    <div class="alert alert-info" id="message_body_text"></div>
                                </div>
                            </div>

                        </div>
                        <div class="col-md-12">

                            <div class="col-md-6">
                                <div class="form-group" id="customer_name" style="display: none">
                                    <label for="user_id"><span class="required_lbl">*</span>{{ __('اسم الزبون') }}
                                    </label>
                                    <select name="customer_id"
                                            class="form-control  form-group select2"
                                            id="customer">
                                        <option selected="selected" id="test"></option>
                                    </select>
                                </div>

                                <div class="form-group"  style="display: none" id="group">
                                    <label for="group">
                                        اختر مجموعة للإرسال
                                    </label>
                                    {!! Form::select("group_id",$customerGroup->pluck('name','id')->toArray()??[],null,['class'=>"form-control form-control m-input form-md-floating-label" ,"id"=>"group_id",'placeholder'=>'اختر مجموعة للإرسال'])!!}
                                </div>

                                <div class="form-group" style="display: none" id="free_customer">
                                    <div class="col-md-6">
                                        <label for="name">@lang("اسم المرسل اليه")</label>
                                        {{Form::text("full_name",null,['class'=>'form-control form-control m-input form-md-floating-label'])}}
                                    </div>
                                    <div class="col-md-6">
                                        <label for="name">@lang("رقم المرسل اليه")</label>
                                        {{Form::text("mobile",null,['class'=>'form-control form-control m-input form-md-floating-label'])}}
                                    </div>
                                </div>

                            </div>
                            <div class="col-md-6">
                                <div class="form-group " >
                                    <label for="provider">
                                        اختر مزود الخدمة
                                    </label>
                                    {!! Form::select("provider",config('ihouse.sms_provider'),null,['class'=>"form-control form-control m-input form-md-floating-label" ,"id"=>"provider",'placeholder'=>'اختر مزود الخدمه'])!!}
                                </div>

                            </div>
                        </div>
                    </div>
                    <button type="submit" class="btn btn-outline-primary ml-3">
                        <i class="bx bxs-send"></i>
                        ارسال
                    </button>
                {!! Form::close() !!}


                <hr>

                <div class="">



                    @if(session()->has('smsLog'))
                        @php
                        $log = \App\Models\SmsLog::query()->find(session('smsLog')->id);
    //                        dd($log->total_customers,session('smsLog')->id,$log)

                        @endphp
                            <div class="alert alert-info">
                                <strong>SMS Sending Is Processing</strong>
                                <br>
                                <strong>Bulk SMS request received and will be processed shortly. the log be founded after processed: all record<br>follow the link and refresh after 2 minute</strong>
                            </div>
                        <hr>
                            <a href="{{ route('admin.log-sms-all') }}" class="btn btn-primary">
                                <i class="fa fa-file"></i>show  logs status....!
                            </a>
                    @endif
                       <div class="row">
                           <div class="col-md-12">
                               <div class="col-md-6">
                                   <div id="success-messages-container ">

                                   </div>


                               </div>
                               <div class="col-md-6">
                                   <!-- Error Messages -->
                                   <div id="error-messages-container" >
                                   </div>
                               </div>
                           </div>
                       </div>

                </div>

            </div>

        </div>
        <div class="col-md-12">

        </div>
    </div>

@endsection
@section("scripts")
    <script src="https://cdn.ihouse.ps/js/select2.min.js"></script>

    <script>
        $(document).ready(function () {

            let Url = '{{route('admin.get-customer')}}'
            let placeholder = 'البحث بواسطة الاسم او رقم الجوال او الايميل'

            $('#customer').select2({

                placeholder: placeholder,
                minimumInputLength: 2,
                ajax: {
                    type: 'POST',
                    url: Url,
                    dataType: 'json',
                    data: function (params) {
                        return {
                            q: $.trim(params.term),
                        };
                    },
                    processResults: function (data) {
                        return {
                            results: data
                        };
                    },
                    cache: true
                }
            });
        })


        // Handle Pagination Click
    </script>
<script>
    $(document).ready(function() {
        const messageTemplates = @json($messageTemplates->where('status', true)->mapWithKeys(function($template) {
        return [$template->id => ['body' => $template->body, 'total_sms' => $template->total_sms]];
    }));

        const availableMessages = {{ \App\Models\Customer::query()->count() }}; // Number of customers available
        const groupCounts = @json($customerGroup->mapWithKeys(function($group) {
        return [$group->id => $group->members->count()]; // Assuming `customers_count` holds the number of customers in each group
    }));

        function updateMessageTemplate() {
            updateSendToDetails(); // Call SMS update logic

            const selectedId = $('#message_id').val();

            if (selectedId && messageTemplates[selectedId]) {
                const selectedTemplate = messageTemplates[selectedId];

                console.log("Selected Template:", selectedTemplate);

                // Show the message body
                $('#message_body').show();
                $('#message_body_text').text(selectedTemplate.body);
            } else {
                // Hide the message body if no template is selected
                $('#message_body').hide();
                $('#message_body_text').text('');
            }
        }

        function updateSendToDetails() {
            const sendToValue = $('#send_to').val();
            const selectedId = $('#message_id').val();

            if (!selectedId || !messageTemplates[selectedId]) {
                console.log("No valid template selected.");
                $('#customer_count, #group_count','#free_customer_count').hide();
                $('#total_sms_alert, #total_sms_alert_group','#total_sms_alert_free_customer').text('');
                return;
            }

            const selectedTemplate = messageTemplates[selectedId];
            let totalSmsNeeded = 0;

            if (sendToValue === 'ALL_CUSTOMER') {
                totalSmsNeeded = selectedTemplate.total_sms * availableMessages;
                console.log('All Customers Selected');
                $('#customer_count').show();
                $('#group_count').hide();
                $('#free_customer_count').hide();
                $('#total_sms_alert').text(`إجمالي الرسائل المطلوبة تقريبا هو: ${totalSmsNeeded}. اجمالي عدد الزبائن: ${availableMessages} نص الرسالة يحتوي على: ${selectedTemplate.total_sms} من الرسائل`);

            } else if (sendToValue === 'CUSTOMER') {
                totalSmsNeeded = selectedTemplate.total_sms * 1; // Single customer
                console.log('Single Customer Selected');
                $('#customer_count').show();
                $('#group_count').hide();
                $('#free_customer_count').hide();
                $('#total_sms_alert').text(`إجمالي الرسائل المطلوبة تقريبا هو: ${totalSmsNeeded}. اجمالي عدد الزبائن: 1 نص الرسالة يحتوي على: ${selectedTemplate.total_sms} من الرسائل`);

            }else if (sendToValue === 'FREE_CUSTOMER') {
                totalSmsNeeded = selectedTemplate.total_sms * 1; // Single customer
                console.log('Single Customer Selected');
                $('#free_customer_count').show();
                $('#customer_count').hide();
                $('#group_count').hide();
                $('#total_sms_alert_free_customer').text(`إجمالي الرسائل المطلوبة تقريبا هو: ${totalSmsNeeded}. اجمالي عدد الزبائن: 1 نص الرسالة يحتوي على: ${selectedTemplate.total_sms} من الرسائل`);

            } else if (sendToValue === 'GROUP') {
                const selectedGroupId = $('#group_id').val();
                const groupCustomerCount = groupCounts[selectedGroupId] || 0;
                totalSmsNeeded = selectedTemplate.total_sms * groupCustomerCount;

                console.log('Group Selected:', selectedGroupId, 'Customer Count:', groupCustomerCount);
                $('#group_count').show();
                $('#customer_count').hide();
                $('#free_customer_count').hide();
                $('#total_sms_alert_group').text(`إجمالي الرسائل المطلوبة تقريبا هو: ${totalSmsNeeded}. اجمالي عدد الزبائن في المجموعة: ${groupCustomerCount} نص الرسالة يحتوي على: ${selectedTemplate.total_sms} من الرسائل`);
            } else {
                console.log('Hiding all counts');
                $('#customer_count, #group_count,#free_customer_count').hide();
                $('#total_sms_alert, #total_sms_alert_group,#total_sms_alert_free_customer').text('');
            }

            console.log("Total SMS Needed:", totalSmsNeeded);
        }

        /**
         * Event Handlers
         */
        // Update message template details when a template is selected
        $('#message_id').on('change', updateMessageTemplate);

        // Update SMS calculation when recipient selection changes
        $('#send_to').on('change', function() {
            const sendToValue = $(this).val();

            if (sendToValue === 'CUSTOMER') {
                $('#customer_name').show();
                $('#group, #free_customer').hide();
            } else if (sendToValue === 'GROUP') {
                $('#group').show();
                $('#customer_name, #free_customer').hide();
            } else if (sendToValue === 'FREE_CUSTOMER') {
                $('#free_customer').show();
                $('#customer_name, #group').hide();
            } else {
                $('#customer_name, #group, #free_customer').hide();
            }


            updateSendToDetails(); // Call SMS update logic
        });

        // Update SMS count when group is changed
        $('#group_id').on('change', updateSendToDetails);

        // Trigger initial updates on page load
        $('#message_id').trigger('change');
        $('#send_to').trigger('change');
    });

</script>
@endsection