@extends('layouts.master')

@section('content')
<div class="container-xxl">

	<x-breadcrumb model="Package Inquiries"></x-breadcrumb>

	<div class="card">

		<div class="card-body">
			 <div class="d-flex justify-content-end mb-3">
                {{-- <a href="{{ route('admin.package-inquiries.export') }}" class="btn btn-primary">
                    Export Package Inquiries
                </a> --}}
            </div>

			<div class="table-responsive no-wrap">
				<table class="table" id="datatable">

					<x-table.header :headers="['name', 'email', 'Received On', 'seen', 'Actions']" />

					<tbody>
						@forelse ($inquiries as $inquiry)
						<tr>
							<td>{{ $loop->iteration }}</td>
							<x-table.td>{{ $inquiry->first_name." ".$inquiry->last_name }}</x-table.td>
							<x-table.td>{{ $inquiry->email }}</x-table.td>
							<x-table.td>{{ $inquiry->created_at->toDateString() }}</x-table.td>

							<x-table.td>
								<span class="visibility-status">
									{{ $inquiry->seen ? 'Viewed' : 'Not viewed' }}
								</span>
							</x-table.td>

							<td style="width:150px">
								<div class="actions d-flex">
									<a href="#" class="btn btn-sm btn-default" title="View" data-bs-toggle="modal"
										data-bs-target="#viewContact{{ $inquiry->id }}"
										data-inquiry-id="{{ $inquiry->id }}">
										<i class='bx bx-show-alt'></i>
									</a>
									<x-table.delete_btn
										route-destroy="{{ route('admin.package-inquiries.destroy', $inquiry->id) }}" />
								</div>
							</td>
						</tr>

						<div class="modal fade" id="viewContact{{ $inquiry->id }}" tabindex="-1" style="display: none;"
							aria-hidden="true">
							<div class="modal-dialog modal-xl" role="document">
								<div class="modal-content">
									<div class="modal-header">
										<h5 class="modal-title">Inquiry Details</h5>
										<button type="button" class="btn-close" data-bs-dismiss="modal"
											aria-label="Close"></button>
									</div>
									<div class="modal-body"></div>
								</div>
							</div>
						</div>
						@empty
						@endforelse

					</tbody>

				</table>
			</div>
		</div>
	</div>
</div>
@endsection

@push('custom_js')
<script>
	$(document).on('show.bs.modal', '.modal', function(event) {
            let button = $(event.relatedTarget);
            let inquiryId = button.data('inquiry-id');
            let modal = $(this);

            let url = "{{ route('admin.package-inquiries.show', ':id') }}".replace(':id', inquiryId);

            $.ajax({
                url: url,
                type: 'get',
                dataType: 'html',
                success: function(response) {
                    modal.find('.modal-body').html(response);
                    button.closest('tr').find('.visibility-status').text("Viewed");
                }
            });
        });
</script>

@include('_helpers.datatable')
@include('_helpers.swal_delete')
@endpush