@extends('layouts.index')

@section('page_title', 'Manage Testimonials')
@section('testimonials_active', 'nav-item active')
@section('pg_name', 'Manage Testimonials')

@section('content')
    <div class="container mt-5">
        <!-- <h1>Manage Testimonials</h1> -->

        @if (session('success'))
            <div class="alert alert-success">
                {{ session('success') }}
            </div>
        @endif

        @if (session('error'))
            <div class="alert alert-danger">
                {{ session('error') }}
            </div>
        @endif

        <table class="table table-bordered mt-3">
            <thead>
                <tr>
                    <th>ID</th>
                    <th>Client Name</th>
                    <th>Picture</th>
                    <th>Title</th>
                    <th>Content</th>
                    <th>Approved</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                <!-- @forelse ($testimonials as $testimonial)
                    <tr>
                        <td>{{ $testimonial->id }}</td>
                        <td>{{ $testimonial->clientName }}</td>
                        <td>
                            <img src="{{ asset('storage/' . $testimonial->clientPicture) }}" alt="Client Picture" width="50">
                        </td>
                        <td>{{ $testimonial->clientTitle }}</td>
                        <td>{{ $testimonial->clientContent }}</td>
                        <td>{{ $testimonial->isApproved ? 'Yes' : 'No' }}</td>
                        <td>
                            <form action="{{ route('testimonials.update', $testimonial->id) }}" method="POST" style="display: inline-block;">
                                @csrf
                                @method('PUT')
                                <input type="hidden" name="isApproved" value="{{ $testimonial->isApproved ? 0 : 1 }}">
                                <button type="submit" class="btn btn-sm btn-{{ $testimonial->isApproved ? 'warning' : 'success' }}">
                                    {{ $testimonial->isApproved ? 'Disapprove' : 'Approve' }}
                                </button>
                            </form>
                            <form action="{{ route('testimonials.destroy', $testimonial->id) }}" method="POST" style="display: inline-block;">
                                @csrf
                                @method('DELETE')
                                <button type="submit" class="btn btn-sm btn-danger">Delete</button>
                            </form>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="7" class="text-center">No testimonials found.</td>
                    </tr>
                @endforelse -->

                @foreach ($testimonials as $testimonial)
    <tr>
        <td>{{ $testimonial->id }}</td>
        <td>{{ $testimonial->clientName }}</td>
        <td>
            <!-- <img src="{{ asset('/storage/' . $testimonial->clientPicture) }}" alt="Client Picture" width="50"> -->
            <!-- <img src="http://192.168.1.119:8001/storage/{{ $testimonial->clientPicture }}" alt="Client Picture" width="50"> -->

            <img src="{{ env('APP_URL') . '/storage/' . $testimonial->clientPicture }}" alt="Client Picture" width="50">


        </td>
        <td>{{ $testimonial->clientTitle }}</td>
        <td>{{ $testimonial->clientContent }}</td>
        <td>{{ $testimonial->isApproved ? 'Yes' : 'No' }}</td>
        <td>
            <!-- Approve/Disapprove Button -->
            <form action="{{ route('testimonials.update', $testimonial->id) }}" method="POST" style="display: inline-block;">
                @csrf
                @method('PUT')
                <input type="hidden" name="isApproved" value="{{ $testimonial->isApproved ? 0 : 1 }}">
                <button type="button" class="btn btn-sm btn-{{ $testimonial->isApproved ? 'warning' : 'success' }}" data-toggle="modal" data-target="#approvedModal{{ $testimonial->id }}">
    {{ $testimonial->isApproved ? 'Disapprove' : 'Approve' }}
</button>

            </form>

            <!-- Delete Button (Triggers Modal) -->
            <button class="btn btn-sm btn-danger" data-toggle="modal" data-target="#deleteModal{{ $testimonial->id }}">
                Delete
            </button>

            <!-- Delete Confirmation Modal -->
            <div class="modal fade" id="deleteModal{{ $testimonial->id }}" tabindex="-1" role="dialog" aria-labelledby="deleteModalTitle" aria-hidden="true">
                <div class="modal-dialog modal-dialog-centered" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title" id="deleteModalTitle">Delete Testimonial</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">×</span>
                            </button>
                        </div>
                        <form action="{{ route('testimonials.destroy', $testimonial->id) }}" method="POST">
                            @csrf
                            @method('DELETE')
                            <div class="modal-body">
                                Are you sure you want to delete <span style="color:red">{{ $testimonial->clientName }}</span> testimonial?
                            </div>
                            <div class="modal-footer">
                                <button type="submit" class="btn btn-danger">Yes, Delete</button>
                                <button type="button" class="btn btn-secondary" data-dismiss="modal">No</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>







 
            <!-- Approve/Disapprove Modal -->
<div class="modal fade" id="approvedModal{{ $testimonial->id }}" tabindex="-1" role="dialog" aria-labelledby="approvedModalTitle" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="approvedModalTitle">Approve/Disapprove Testimonial</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>
            <form action="{{ route('testimonials.update', $testimonial->id) }}" method="POST">
                @csrf
                @method('PUT')
                <input type="hidden" name="isApproved" value="{{ $testimonial->isApproved ? 0 : 1 }}">
                <div class="modal-body">
                    Are you sure you want to {{ $testimonial->isApproved ? 'disapprove' : 'approve' }} the testimonial of 
                    <span style="color: green">
                        {{ $testimonial->clientName }}
                    </span>?
                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-success">Yes, {{ $testimonial->isApproved ? 'Disapprove' : 'Approve' }}</button>
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">No</button>
                </div>
            </form>
        </div>
    </div>
</div>


        </td>
    </tr>
@endforeach

            </tbody>
        </table>

        <!-- Pagination Links -->
        <div class="d-flex justify-content-center mt-3">
            {{ $testimonials->links() }}
        </div>
    </div>
@endsection