@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"><a href="{{route('admin.index')}}">الصفحه الرئسيه</a></li>
                        <li class="breadcrumb-item active">صور العميل</li>
                    </ol>
                </div><!-- /.col -->
            </div><!-- /.row -->
        </div><!-- /.container-fluid -->
    </div>
@endsection


@section('content')

    <div class="row">
        @foreach($data as $row)
            <div class="col-lg-3">
                <div class="container">
                    <div class="card" style="width: 18rem;">

                        @if(file_exists(public_path('captions'.'/'.$row->date_y . '/' . $row->date_m . '/' . $row->date_d . '/' . $row->client->phone . '/' . $row->image_id . '.jpg')))
                            <a href="{{ asset('captions'.'/'.$row->date_y . '/' . $row->date_m . '/' . $row->date_d . '/' . $row->client->phone . '/' . $row->image_id . '.jpg') }}" target="_blank">
                                <img src="{{ asset('captions'.'/'.$row->date_y . '/' . $row->date_m . '/' . $row->date_d . '/' . $row->client->phone . '/' . $row->image_id . '.jpg') }}" class="card-img-top" alt="..." width="50px" height="50px">
                            </a>
                        @elseif(file_exists(public_path('captions'.'/'.$row->date_y . '/' . $row->date_m . '/' . $row->date_d . '/' . $row->client->phone . '/' . $row->image_id . '.mp4')))

                            ملف صوتي 
                        @else
                            <a href="{{ asset('captions'.'/'.$row->date_y . '/' . $row->date_m . '/' . $row->date_d . '/' . $row->client->phone . '/' . $row->image_id . '.pdf') }}" target="_blank">

                                    الملف
                                </a>
                        @endif


                        <div class="card-body">
                            <!-- Button trigger modal -->
                            <button type="button" class="btn btn-primary" data-toggle="modal"
                                    data-target="#exampleModal{{$row->client_id}}">
                                ارسال ملاحظه على الصور
                            </button>


                            <!-- Modal -->
                            <div class="modal fade" id="exampleModal{{$row->client_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">


                                                <input type="hidden" value="{{$row->client_id}}" id="id_client_id">

                                                    <div class="form-outline">
                                                        <textarea class="form-control" id="textAreaExample2" required rows="4"></textarea>
                                                    </div>

                                                <div class="modal-footer">
                                                    <button type="button" class="btn btn-secondary"
                                                            data-dismiss="modal">اغلاق
                                                    </button>
                                                    <button id="sendMessageBtn"
                                                            class="btn btn-info btn-rounded float-end">
                                                        ارسال رساله خاصه
                                                    </button>
                                                </div>
                                            </form>
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        @endforeach
    </div>

@endsection


@section('js')
    <script>
        $(document).ready(function () {
            $('#sendMessageBtn').click(function () {
                var message = $('#textAreaExample2').val();
                var id = $('#id_client_id').val();

                if (message === '') {
                    alert('يجب إدخال قيمة في حقل النص.');
                    return;
                }

                // تعطيل الزر أثناء عملية الإرسال لتجنب تكرار الإرسال
                $('#sendMessageBtn').attr('disabled', 'disabled');

                $.ajax({
                    url: '{{ route('sendMessages') }}',
                    type: 'POST',
                    data: {
                        _token: '{{ csrf_token() }}',
                        id: id,
                        message: message
                    },
                    success: function (response) {
                        alert('تم الارسال');
                        location.reload();

                    },
                    error: function (xhr, status, error) {
                        console.error(error);
                        alert('حدث خطأ أثناء الإرسال');

                        // إعادة تفعيل الزر بعد حدوث خطأ
                        $('#sendMessageBtn').removeAttr('disabled');
                    }
                });
            });
        });
    </script>
@endsection