@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">
                        <div class="row">
                            <div class="col-lg-2 col-sm-12" style="margin-top: 32px;">
                                <button class="btn btn-primary btn-block" id="transfer_btn" type="button">تحويل</button>
                            </div>


                            <div class="col-lg-2 col-sm-12" style="margin-top: 32px;">
                                <button class="btn btn-danger  btn-block" id="btn_delete_all" type="button">ارشفه
                                </button>
                            </div>

                            <div class="col-lg-2 col-sm-12" style="margin-top: 32px;">
                                <button class="btn btn-info  btn-block" id="btn_status_all" type="button">تغير حاله
                                </button>
                            </div>

                            <div class="col-lg-2 col-sm-12" style="margin-top: 32px;">
                                <button class="btn btn-primary  btn-block" id="btn_send_all" type="button">ارسال رساله
                                </button>
                            </div>


                            <div class="col-lg-2 col-sm-12" style="margin-top: 32px;">
                                <button class="btn btn-info  btn-block" id="btn_classification_all" type="button">تغير
                                    التصنيف
                                </button>
                            </div>

                            <div class="col-lg-2 col-sm-12" style="margin-top: 32px;">
                                <form action="{{route('download_all_client_in_boot')}}" method="post">
                                    @csrf

                                    <input type="hidden" value="{{$data->pluck('client.uuid')->implode(',')}}" name="all_clients">

                                    <button class="btn btn-primary  btn-block" type="submit">
                                        تنزيل قاعده البيانات
                                    </button>
                                </form>

                            </div>
                        </div>


                    </div>
                    <hr>

                    <div class="card-body">
                        <div class="row">
                            <div class="col">
                                <div class="table-responsive">
                                    <table id="example1" class="table table-bordered table-hover reload-table">
                                        <thead>
                                        <tr>
                                            <th scope="col"><input type="checkbox" id="select-all"></th>
                                            {{--                                            <th scope="col">#</th>--}}
                                            <th scope="col">اسم العميل</th>
                                            <th scope="col">حاله العميل</th>
                                            <th scope="col">تصنيف العميل</th>
                                            <th scope="col">رقم الهاتف</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        @foreach($data as $row)
                                            <tr>
                                                <td><input type="checkbox" name="selected_rows[]"
                                                           value="{{ $row->client->uuid }}"></td>
                                                {{--                                                <td>{{ $loop->index + 1 }}</td>--}}
                                                <td>{{ $row->client->name }}</td>
                                                <td>{{ $row->client->status->name }}</td>
                                                <td>{{ $row->client?->classification?->name }}</td>
                                                <td>{{ $row->client->phone }}</td>
                                            </tr>
                                        @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>

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

    <div class="modal fade" id="send_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="send_all_id" name="send_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 (getInformationDataChanels('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>


    <!-- Modal -->
    <div class="modal fade" id="employee_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">تعين للموظف</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <form action="{{ route('transformationEmployee') }}" method="post">
                        @csrf
                        <input type="hidden" id="trans_all_id" name="trans_all_id" value="">
                        <div class="row">
                            <div class="col">
                                <label>اختر الموظف</label>
                                <select class="form-control p-1" name="employee_id" required>
                                    <option value="" disabled selected>-- اختر من القائمه --
                                    </option>
                                    @foreach (getInformationData('employee')->whereNotIn('id', [auth('employee')->id()]) as $row)
                                        <option value="{{ $row->id }}"
                                                {{ request('employee_id') == $row->id ? 'selected' : '' }}>{{ $row->name }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </div>

                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">اغلاق</button>
                            <button type="submit" class="btn btn-primary">توجيه</button>
                        </div>
                    </form>

                </div>

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


    <div class="modal fade" id="deleted_clients_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">تعين للموظف</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <form action="{{ route('deleted_all_clients') }}" method="post">
                        @csrf
                        <input type="hidden" id="deleted_clients_id" name="deleted_clients_id" value="">

                        <div class="row">
                            <div class="col">
                                <label class="text-danger">هل انت متأكد من عمليه ارشفه المستخدمين</label>
                            </div>
                        </div>

                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">اغلاق</button>
                            <button type="submit" class="btn btn-danger">ارشيف</button>
                        </div>
                    </form>

                </div>

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



    <div class="modal fade" id="status_clients_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"> تحويل الحالات</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <form action="{{ route('status_all_clients') }}" method="post">
                        @csrf
                        <input type="hidden" id="status_clients_id" name="status_clients_id" value="">

                        <div class="row">
                            <div class="col">
                                <label class="text-info">
                                    تحويل الحالات
                                </label>

                                <select class="form-control" name="status_id_choose" required>
                                    <option value="" disabled selected>-- أختر الحاله الجديده --</option>
                                    @foreach (getInformationData('Status') as $row)
                                        <option value="{{ $row->id }}">{{ $row->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>

                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">اغلاق</button>
                            <button type="submit" class="btn btn-info">تغير الحاله</button>
                        </div>
                    </form>

                </div>

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


    <div class="modal fade" id="status_classification_id" 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"> تحويل الحالات</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <form action="{{ route('status_all_clients_classification') }}" method="post">
                        @csrf
                        <input type="hidden" id="status_classification_ids" name="status_classification_ids" value="">

                        <div class="row">
                            <div class="col">
                                <label class="text-info">
                                    تصنيف العملاء
                                </label>

                                <select class="form-control" name="classification_id_choose" required>
                                    <option value="" disabled selected>-- أختر التصنيف الجديده --</option>
                                    @foreach (getInformationData('Classification') as $row)
                                        <option value="{{ $row->id }}">{{ $row->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>

                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">اغلاق</button>
                            <button type="submit" class="btn btn-info">تغير التصنيف</button>
                        </div>
                    </form>

                </div>

            </div>
        </div>
    </div>
@endsection


@section('js')
    <script>
        document.addEventListener("DOMContentLoaded", function () {
            document.querySelector("#select-all").onclick = function () {
                let checkboxes = document.querySelectorAll('input[name="selected_rows[]"]');
                for (let checkbox of checkboxes) {
                    checkbox.checked = this.checked;
                }
            };

            document.querySelector("#transfer_btn").onclick = function () {
                let checkboxes = document.querySelectorAll('input[name="selected_rows[]"]:checked');
                let selectedIds = Array.from(checkboxes).map(checkbox => checkbox.value);

                if (selectedIds.length > 0) {
                    document.getElementById('trans_all_id').value = selectedIds.join(',');
                    $('#employee_all').modal('show');
                } else {
                    Swal.fire({
                        icon: 'error',
                        title: 'حدث خطأ',
                        text: 'يرجى تحديد عناصر لتنفيذ الطلب',
                        showConfirmButton: false,
                        timer: 1500
                    });
                }
            };


            document.querySelector("#btn_delete_all").onclick = function () {
                let checkboxes = document.querySelectorAll('input[name="selected_rows[]"]:checked');
                let selectedIds = Array.from(checkboxes).map(checkbox => checkbox.value);

                if (selectedIds.length > 0) {
                    document.getElementById('deleted_clients_id').value = selectedIds.join(',');
                    $('#deleted_clients_all').modal('show');
                } else {
                    Swal.fire({
                        icon: 'error',
                        title: 'حدث خطأ',
                        text: 'يرجى تحديد عناصر لتنفيذ الطلب',
                        showConfirmButton: false,
                        timer: 1500
                    });
                }
            };


            document.querySelector("#btn_status_all").onclick = function () {
                let checkboxes = document.querySelectorAll('input[name="selected_rows[]"]:checked');
                let selectedIds = Array.from(checkboxes).map(checkbox => checkbox.value);

                if (selectedIds.length > 0) {
                    document.getElementById('status_clients_id').value = selectedIds.join(',');
                    $('#status_clients_all').modal('show');
                } else {
                    Swal.fire({
                        icon: 'error',
                        title: 'حدث خطأ',
                        text: 'يرجى تحديد عناصر لتنفيذ الطلب',
                        showConfirmButton: false,
                        timer: 1500
                    });
                }
            };

            document.querySelector("#btn_classification_all").onclick = function () {
                let checkboxes = document.querySelectorAll('input[name="selected_rows[]"]:checked');
                let selectedIds = Array.from(checkboxes).map(checkbox => checkbox.value);

                if (selectedIds.length > 0) {
                    document.getElementById('status_classification_ids').value = selectedIds.join(',');
                    $('#status_classification_id').modal('show');
                } else {
                    Swal.fire({
                        icon: 'error',
                        title: 'حدث خطأ',
                        text: 'يرجى تحديد عناصر لتنفيذ الطلب',
                        showConfirmButton: false,
                        timer: 1500
                    });
                }
            };


            document.querySelector("#btn_send_all").onclick = function () {
                let checkboxes = document.querySelectorAll('input[name="selected_rows[]"]:checked');
                let selectedIds = Array.from(checkboxes).map(checkbox => checkbox.value);

                if (selectedIds.length > 0) {
                    document.getElementById('send_all_id').value = selectedIds.join(',');
                    $('#send_all').modal('show');
                } else {
                    Swal.fire({
                        icon: 'error',
                        title: 'حدث خطأ',
                        text: 'يرجى تحديد عناصر لتنفيذ الطلب',
                        showConfirmButton: false,
                        timer: 1500
                    });
                }
            };
        });
    </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