@extends('admin.dashboard')
@section('content')
    <section class="contact pad-btm">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="constes m3-h wow fadeInUp">
                        <h4>Contact Form Data</h4>
                    </div>
                    <div class="table-responsive">
                        <table class="datatables-users table dataTable no-footer dtr-column table-hover" id="data-table" aria-describedby="DataTables_Table_0_info">
                            <thead class="border-top">
                            <tr>
                                <th class="text-center">S.No</th>
                                <th class="text-center">User Name</th>
                                <th class="text-center">Email</th>
                                <th class="text-center">Contact No</th>
                                <th class="text-center">Created At</th>
                                <th class="text-center">Action</th>
                            </tr>
                            </thead>
                            <tbody>
                            @if(count($contacts) > 0)
                                @foreach($contacts as $key => $val)
                                    <tr>
                                        <td class="text-center">{{ $counter++ }}</td>
                                        <td class="text-left">{{ $val->user_name }}</td>
                                        <td class="text-left">{{ $val->user_email }}</td>
                                        <td class="text-left">{{ $val->contact_no }}</td>
                                        <td class="text-center">{{ CommonHelper::date_format($val->created_at) }}</td>
                                        <td class="text-center">
                                            <a href="#" data-bs-toggle="modal" onclick="showModal('Message','{{ trim($val->description) }}')" class="text-body">
                                                <i class="ti ti-edit ti-sm me-2"></i>
                                            </a>&nbsp;
                                            <a href="{{ route('deleteContactDetail', ['id' => $val->id]) }}" class="text-body">
                                                <i class="ti ti-trash ti-sm mx-2"></i>
                                            </a>
                                        </td>
                                    </tr>
                                @endforeach
                            @else
                                <tr>
                                    <td class="text-center" style="color: red" colspan="7">No record found !</td>
                                </tr>
                            @endif
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection
@section('script')
    <script>
        $(document).ready(function() {
            $('#data-table').DataTable({
                paging: true,
                lengthMenu: [25, 50, 100, 200],
                dom: '<"top"Bf>rt<"bottom"lp><"clear">', // Customize the DOM structure
                buttons: [
                    'excel', // Enable Excel export button
                    'pdf',   // Enable PDF export button
                    'print',
                    'colvis'
                ]
            });
        });

    </script>
@endsection