@extends('backend.layouts.app')

@section('content')
<div class="p-3">
    <div class="p-2 header-title-container">
        <span class="mb-0 mx-2">Client Feedback</span>
    </div>
    <button type="button" class="btn m-2" style="width: 10%; background-color: #fa6f10;"><a href="{{ url('admin/feedbacks/create') }}" class="text-decoration-none text-white">Add Feedback</a></button>
</div>

<div class="p-3">
    <div class="card-body">
        <table id="myTable" class="table table-striped" style="width:100%">
            <thead>
                <tr>
                    <th>Client Image</th>
                    <th>Client Name</th>
                    <th>Title</th>
                    <th>Content</th>
                    <th>Action</th>
                </tr>
            </thead>

            <tbody>
                @foreach ($comments as $items)
                <tr>
                    <td class="w-25"><img src="{{ asset('uploads/feedbacks/' . $items->image) }}" height="80" alt=""></td>
                    <td>{{ $items->name }}</td>
                    <td>{{ $items->position }}</td>
                    <td>{{ Str::limit(html_entity_decode(strip_tags($items->content)), 80, '...') }}</td>
                    <td>
                        <!-- <button class="btn btn-success btn-block mb-1" data-bs-toggle="modal" data-bs-target="#modal{{ $items->id }}">View</button> -->

                        <a href="{{ url('admin/feedbacks/' . $items->id) }}/edit">
                            <button class="btn btn-primary btn-block mb-2 ">Edit</button>
                        </a>
                        <form method="POST" action="{{ url('admin/feedbacks/' . $items->id) }}">@csrf
                            @method('DELETE')
                            <button class="btn btn-danger btn-block mb-2 ">Delete</button>
                        </form>

                        <!-- <div class="modal fade" id="modal{{ $items->id }}" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
                            <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
                                <div class="modal-content">
                                    <div class="modal-header border-bottom-0 view-modal">
                                        <h5 class="modal-title" id="exampleModalLabel">{{ $items->name }}</h5>
                                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                    </div>
                                    <div class="modal-body view-modal">
                                        {!! $items->content !!}
                                    </div>
                                    
                                </div>
                            </div>
                        </div> -->
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>

<style>
    select {
        color: #fa6f10;
        font-weight: bold;
    }

    option {
        font-weight: bold;
    }

    input {
        color: #fa6f10;
        font-weight: bold;
    }

    .paginate_button {
        color: #fa6f10 !important;
        font-weight: bold !important;
    }
</style>
@endsection