@extends('admin.layouts.master')


@section('title')
    تقرير عن القنوات
@endsection

@section('css')
@endsection


@section('content-header')
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0 text-dark">تقرير عن القنوات</h1>
                </div><!-- /.col -->
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item active">تقرير عن القنوات</li>
                    </ol>
                </div><!-- /.col -->
            </div><!-- /.row -->
        </div><!-- /.container-fluid -->
    </div>
@endsection


@section('content')
    <div class="container-fluid">
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-header">
                        <form action="{{ route('post_chanel') }}" method="post">
                            @csrf

                            <div class="row">
                                <div class="col">
                                    <label>القنوات</label>
                                    <select class="form-control" name="channel_id" required>
                                        <option value="" disabled selected>-- اختر من القائمه --</option>
                                        @foreach (getInformationDataChanels('channel') as $row)
                                            <option value="{{ $row->id }}"
                                                {{ isset($data) && $row->id == $channel ? 'selected' : null }}>
                                                {{ $row->name }}</option>
                                        @endforeach

                                    </select>
                                </div>
                            </div>


                            <br>


                            <div class="row">
                                <div class="col">
                                    <label>تاريخ البدايه</label>
                                    <input type="datetime-local" name="start_data" class="form-control"
                                        value="{{ isset($data) ? $start_data : null }}">
                                </div>

                                <div class="col">
                                    <label>تاريخ النهايه</label>
                                    <input type="datetime-local" name="end_data" class="form-control"
                                        value="{{ isset($data) ? $end_data : null }}">
                                </div>
                            </div>

                            <br>
                            <div class="row">
                                <div class="col">
                                    <button class="btn btn-success">بحث</button>
                                </div>
                            </div>

                        </form>
                    </div>
                    <hr>

                    <div class="card-body">
                        @isset($data)
                            <div class="row">


                                <div class="col">
                                    <button type="button" class="btn btn-success">
                                        عدد العملاء {{ $data->count() }}
                                    </button>
                                </div>

                                <div class="col">
                                    <form action="{{ route('download_data_chanel') }}" method="post">
                                        @csrf

                                        <input type="hidden" name="channel_id" value="{{ isset($data) ? $channel : null }}">
                                        <input type="hidden" name="start_data"
                                            value="{{ isset($data) ? $start_data : null }}">
                                        <input type="hidden" name="end_data" value="{{ isset($data) ? $end_data : null }}">
                                        <button class="btn btn-info">تنزيل قاعده البيانات</button>
                                    </form>
                                </div>


                                <div class="col">
                                    <form action="{{ route('download_count_chanel') }}" method="post">
                                        @csrf

                                        <input type="hidden" name="channel_id" value="{{ isset($data) ? $channel : null }}">
                                        <input type="hidden" name="start_data"
                                            value="{{ isset($data) ? $start_data : null }}">
                                        <input type="hidden" name="end_data" value="{{ isset($data) ? $end_data : null }}">
                                        <button class="btn btn-danger">
                                            تنزيل اعداد العملاء
                                        </button>
                                    </form>

                                </div>

                            </div>

                            <br>
                            @include('admin.Reports.table')

                            <br>
                        @endisset
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade" id="delete_all" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel" style="font-family: 'Cairo', sans-serif;">ارسال </h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <form action="{{ route('sendNewMessages') }}" method="post">
                        @csrf
                        <input type="hidden" id="delete_all_id" name="delete_all_id" value=''>

                        <div class="row">
                            <div class="col">
                                <label>اسم القناه</label>
                                <select class="form-control" name="whatsapp_id" required>
                                    <option value="" disabled selected>-- اختر اسم القناه --</option>
                                    @foreach (getInformationData('channel') as $ClientWhatsapp)
                                        <option value="{{ $ClientWhatsapp->id }}">{{ $ClientWhatsapp->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>

                        <br>

                        <div class="row">
                            <div class="col">
                                <label>نوع الرسالة</label>
                                <select class="form-control" name="type" required onchange="handleAjaxResponse()"
                                    id="typeStatus">
                                    <option value="" disabled selected>-- اختر نوع الرد --</option>
                                    <option value="button">بوت</option>
                                    <option value="message">رساله خاصه</option>
                                </select>
                            </div>
                        </div>

                        <br>

                        <div class="row" id="button" style="display: none;">
                            <div class="col">
                                <label>قائمة الزر</label>
                                <select class="form-control" name="send_button_id">
                                    <option value="" disabled selected>-- اختر القائمة --</option>
                                    @foreach (getInformationData('ReplyBoot') as $button)
                                        <option value="{{ $button->id }}">{{ $button->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>

                        <br>

                        <div class="row" id="message" style="display: none;">
                            <div class="col">
                                <label>نص الرسالة</label>
                                <textarea class="form-control" name="messages" rows="5"></textarea>
                            </div>
                        </div>


                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">اغلاق</button>
                            <button type="submit" class="btn btn-primary">ارسال البيانات</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection


@section('js')
    <script>
        function CheckAll(className, elem) {
            var elements = document.getElementsByClassName(className);
            var l = elements.length;
            if (elem.checked) {
                for (var i = 0; i < l; i++) {
                    elements[i].checked = true;
                }
            } else {
                for (var i = 0; i < l; i++) {
                    elements[i].checked = false;
                }
            }
        }

        $(function() {
            $("#btn_delete_all").click(function() {
                var selected = new Array();
                $("#example1 input[type=checkbox]:checked").each(function() {
                    if (this.value !== 'on') { // تحقق من عدم وجود القيمة "on"
                        selected.push(this.value);
                    }
                });
                if (selected.length > 0) {
                    $('#delete_all').modal('show');
                    $('input#delete_all_id').val(selected);
                } else {
                    alert('لم يتم تحديد أي شيء');
                }
            });
        });
    </script>


    <script>
        function handleAjaxResponse() {
            var selectedType = document.getElementById('typeStatus').value;

            var buttonDiv = document.getElementById('button');
            var messageDiv = document.getElementById('message');

            // Reset display properties for all divs
            buttonDiv.style.display = 'none';
            messageDiv.style.display = 'none';

            // Show the corresponding div based on the selected type
            if (selectedType === 'button') {
                buttonDiv.style.display = 'block';
            } else if (selectedType === 'message') {
                messageDiv.style.display = 'block';
            }
        }
    </script>
@endsection