@extends('adminlte::page')

@section('title', 'Contact us')

@section('content_header')
    <h1>Contact us</h1>
@stop
@section('content')
    <div class="row">
        <div class="col-md-12">
            <div class="card">
                <!-- /.card-header -->
                <div class="card-body table-responsive">
                
                <form id="download-form" action="{{ route('contactus.download') }}" method="POST" style="margin-bottom: 10px;">
										@csrf
										<!-- <button type="button" class="btn btn-success md-4" onclick="downloadSelected()">Download Selected</button> -->
										<select name="category" id="category" class="form-control col-md-2 mb-2">
                      <option value="">Select Category</option>
                      <option value="{{ route('contactus.category', ['category' => 'oci']) }}">OCI</option>
                      <option value="{{ route('contactus.category', ['category' => 'passport']) }}">Passport</option>
                      <option value="{{ route('contactus.category', ['category' => 'visa']) }}">Visa</option>
                      <option value="{{ route('contactus.category', ['category' => 'pcc']) }}">PCC</option>
                      <option value="{{ route('contactus.category', ['category' => 'pancard']) }}">Pancard</option>
                  </select>

                  <a href="javascript:void(0)" id="filterBtn" class="btn btn-primary">Filter</a>
										<input type="hidden" name="selected_ids" id="selected-ids">
								</form>
                <table class="table table-bordered">
                        <tr>
													<th >Reason</th>
													<th>Name</th>
													<th>Email</th>
													<th>Mobile number</th>
													<th>Message</th>
													<th>Added at</th>
													<th>User time</th>
													<th>Action</th>
                        </tr>
                        @foreach ($store as $contact)
                            <td width="15%">
                                @if(isset($contact->reason->name) && !empty($contact->reason->name))
                                    {{ $contact->reason->name }}
                                @else
                                    N/A
                                @endif
                            </td>
                                <td width="10%">{{$contact->first_name }} {{$contact->last_name }}</td>
                                <td width="10%">{{$contact->email }}</td>
                                <td width="15%">+{{$contact->country_code }} {{$contact->mobile_no }}</td>
                                <td width="30%">
																	@php
																		$message = $contact->message ?? 'Null';
																		$words = explode(' ', $message);
																		$shortMessage = implode(' ', array_slice($words, 0, 30));
																	@endphp
																	<span class="short-message-{{$contact->id}}">
																		{{ $shortMessage }} @if(count($words) > 30)... 
																		<a href="javascript:void(0);" onclick="showFullMessage({{ $contact->id }})">Read More</a>
																		@endif
																	</span>
																	<span class="full-message-{{$contact->id}}" style="display: none;">
																		{{ $message }}
																		<a href="javascript:void(0);" onclick="hideFullMessage({{ $contact->id }})">Show Less</a>
																	</span>
																</td>
																<td width="10%">{{ \Carbon\Carbon::parse($contact->created_at)->format('d/m/Y h:i A') }}</td>
																<td width="10%">
																@if ($contact->user_time)
																	{{ \Carbon\Carbon::parse($contact->user_time)->format('g:i A') }}
																@endif
																</td>
                                <td width="10%">
                                    <a href="{{route('contactus.delete',$contact->id)}}" onclick="return confirm('Are you sure?')">
                                        Delete
                                    </a>
                                </td>
                            </tr>
                        @endforeach
                    </table>
                </div>
                <!-- /.card-body -->

                <div class="box-footer clearfix">
                {{ $store->appends(request()->query())->links() }}
                </div>
            </div>
        </div>
        <!-- /.col -->
    </div>
    <script>
document.getElementById("category").addEventListener("change", function() {
    var selectedValue = this.value;
    var filterBtn = document.getElementById("filterBtn");

    if (selectedValue) {
        filterBtn.href = selectedValue; // Update the link dynamically
    } else {
        filterBtn.href = "javascript:void(0)"; // Reset if no selection
    }
});
</script>
@stop