{{-- {{dd($tickets)}} --}}
<div id="kt_app_content_container" class="app-container">
    <!--begin::Inbox App - Messages -->
    <div class="d-flex flex-column flex-lg-row">
        <!--begin::Content-->
        <div class="flex-lg-row-fluid ms-lg-7 ms-xl-3">
            <!--begin::Card-->
            <div class="card">
                <div class="card-body p-3">
                    <!--begin::Table-->
                    <div id="kt_inbox_listing_wrapper" class="dataTables_wrapper dt-bootstrap4 no-footer">
                        <div class="table-responsive">
                            <table class="table table-striped table-row-bordered fs-6 gy-5 my-0 no-footer">
                                <!--begin::Table body-->
                                <thead class="fw-semibold fs-6 text-gray-400 text-center">
                                    <tr>
                                        <th></th>
                                        <th class="fw-bold">Name</th>
                                        <th class="fw-bold">Title</th>
                                        <th class="fw-bold">Status</th>
                                        <th class="fw-bold">Action</th>
                                        <th class="fw-bold">Reason</th>
                                        <th class="fw-bold">Date</th>
                                    </tr>
                                </thead>
                                @foreach ($tickets as $ticket)
                                    {{-- {{dd($ticket['user_id'])}} --}}
                                    <tbody>
                                        <tr class="">
                                            <td class="w-25px fs-7 pe-9">
                                                <a href="{{ url('/admin/support/tickets/ticket-details') }}/{{ $ticket->id }}"
                                                    class="text-dark">
                                                    <span class="svg-icon  svg-icon-2x ">
                                                        <!--begin::Svg Icon | path:/var/www/preview.keenthemes.com/metronic/releases/2021-05-14-112058/theme/html/demo1/dist/../src/media/svg/icons/Communication/Group-chat.svg--><svg
                                                            xmlns="http://www.w3.org/2000/svg"
                                                            xmlns:xlink="http://www.w3.org/1999/xlink" width="24px"
                                                            height="24px" viewBox="0 0 24 24" version="1.1">
                                                            <g stroke="none" stroke-width="1" fill="none"
                                                                fill-rule="evenodd">
                                                                <rect x="0" y="0" width="24"
                                                                    height="24" />
                                                                <path
                                                                    d="M16,15.6315789 L16,12 C16,10.3431458 14.6568542,9 13,9 L6.16183229,9 L6.16183229,5.52631579 C6.16183229,4.13107011 7.29290239,3 8.68814808,3 L20.4776218,3 C21.8728674,3 23.0039375,4.13107011 23.0039375,5.52631579 L23.0039375,13.1052632 L23.0206157,17.786793 C23.0215995,18.0629336 22.7985408,18.2875874 22.5224001,18.2885711 C22.3891754,18.2890457 22.2612702,18.2363324 22.1670655,18.1421277 L19.6565168,15.6315789 L16,15.6315789 Z"
                                                                    fill="#000000" />
                                                                <path
                                                                    d="M1.98505595,18 L1.98505595,13 C1.98505595,11.8954305 2.88048645,11 3.98505595,11 L11.9850559,11 C13.0896254,11 13.9850559,11.8954305 13.9850559,13 L13.9850559,18 C13.9850559,19.1045695 13.0896254,20 11.9850559,20 L4.10078614,20 L2.85693427,21.1905292 C2.65744295,21.3814685 2.34093638,21.3745358 2.14999706,21.1750444 C2.06092565,21.0819836 2.01120804,20.958136 2.01120804,20.8293182 L2.01120804,18.32426 C1.99400175,18.2187196 1.98505595,18.1104045 1.98505595,18 Z M6.5,14 C6.22385763,14 6,14.2238576 6,14.5 C6,14.7761424 6.22385763,15 6.5,15 L11.5,15 C11.7761424,15 12,14.7761424 12,14.5 C12,14.2238576 11.7761424,14 11.5,14 L6.5,14 Z M9.5,16 C9.22385763,16 9,16.2238576 9,16.5 C9,16.7761424 9.22385763,17 9.5,17 L11.5,17 C11.7761424,17 12,16.7761424 12,16.5 C12,16.2238576 11.7761424,16 11.5,16 L9.5,16 Z"
                                                                    fill="#000000" opacity="0.3" />
                                                            </g>
                                                        </svg>
                                                        <!--end::Svg Icon-->
                                                    </span></a>
                                            </td>
                                            <td class="w-100px fs-7 pe-9">
                                                {{$ticket->name}}.({{$ticket->email}})
                                             </td> 
                                            <td class="w-100px fs-7 pe-9">
                                                <div class="text-dark mb-1">
                                                    <a href="{{ url('/admin/support/tickets/ticket-details') }}/{{ $ticket->id }}"
                                                        class="text-dark">
                                                        <span class="">{{ $ticket->title }}</span>
                                                    </a>
                                                </div>
                                            </td>
                                            <td class="w-100px fs-7 pe-9">
                                                @if ($ticket->reason == null)
                                                    <span class="badge badge-light-warning close-ticket">Created</span>
                                                @else
                                                    <span class="badge badge-light-danger close-ticket">Closed</span>
                                                @endif
                                            </td>
                                            <td class="w-100px fs-7 pe-9">
                                                @if ($ticket->reason == null)
                                                    <button type="button" class="btn btn-light btn-sm close"
                                                        data-id='{{ $ticket->id }}'>Close</button>
                                                @else
                                                @endif
                                            </td>
                                            <td class="w-100px fs-7 pe-9">
                                                @if ($ticket->reason == null)
                                                    <span class="badge badge-light-warning">Pending</span>
                                                @else
                                                    <span class="fw-semibold">{{ $ticket->reason }}</span>
                                                @endif
                                            </td>
                                            <td class="w-100px fs-7 pe-9">
                                                <span class="fw-semibold">{{ $ticket->created_at }}</span>
                                            </td>
                                        </tr>
                                    </tbody>
                                @endforeach
                            </table>
                        </div>
                        {{-- <div class="row px-9 pt-3 pb-5">
                            <div
                                class="col-sm-12 col-md-5 d-flex align-items-center justify-content-center justify-content-md-start">
                                <div class="dataTables_length" id="kt_inbox_listing_length">
                                    <label>
                                        <select name="kt_inbox_listing_length" aria-controls="kt_inbox_listing"
                                            class="form-select form-select-sm form-select-solid">
                                            <option value="10">10</option>
                                            <option value="25">25</option>
                                            <option value="50">50</option>
                                            <option value="100">100</option>
                                        </select>
                                    </label>
                                </div>
                            </div>
                            <div
                                class="col-sm-12 col-md-7 d-flex align-items-center justify-content-center justify-content-md-end">
                                <div class="dataTables_paginate paging_simple_numbers" id="kt_inbox_listing_paginate">
                                    <ul class="pagination">
                                        <li class="paginate_button page-item previous disabled"
                                            id="kt_inbox_listing_previous"><a href="#"
                                                aria-controls="kt_inbox_listing" data-dt-idx="0" tabindex="0"
                                                class="page-link"><i class="previous"></i></a></li>
                                        <li class="paginate_button page-item active"><a href="#"
                                                aria-controls="kt_inbox_listing" data-dt-idx="1" tabindex="0"
                                                class="page-link">1</a></li>
                                        <li class="paginate_button page-item "><a href="#"
                                                aria-controls="kt_inbox_listing" data-dt-idx="2" tabindex="0"
                                                class="page-link">2</a></li>
                                        <li class="paginate_button page-item next" id="kt_inbox_listing_next"><a
                                                href="#" aria-controls="kt_inbox_listing" data-dt-idx="3"
                                                tabindex="0" class="page-link"><i class="next"></i></a></li>
                                    </ul>
                                </div>
                            </div>
                        </div> --}}
                    </div>
                    <!--end::Table-->
                </div>
            </div>
            <!--end::Card-->
        </div>
        <!--end::Content-->
    </div>
    <!--end::Inbox App - Messages -->
</div>