@extends('master.back')

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

	<!-- Page Heading -->
    <div class="card mb-4">
        <div class="card-body d-flex justify-content-between align-items-center">
            <h3 class="mb-0 bc-title"><b>All Pre Orders</b></h3>
        </div>
    </div>

	<!-- Data Table -->
	<div class="card shadow mb-4">
		<div class="card-body">
			@include('alerts.alerts')

			<div class="gd-responsive-table">
				<table class="table table-bordered table-striped" width="100%" cellspacing="0">
					<thead>
						<tr>
							<th>#</th>
							<th>Name</th>
							<th>Product</th>
							<th>Address</th>
							<th>Phone</th>
							<th>Created At</th>
							<th>{{ __('Actions') }}</th>
						</tr>
					</thead>
					<tbody>
						@forelse($datas as $data)
							<tr>
								<td>{{ $loop->iteration }}</td>
								<td>{{ $data->name }}</td>
								<td>{{ $data->product_name }}</td>
								<td>{{ $data->address }}</td>
								<td>{{ $data->phone }}</td>
								<td>{{ $data->created_at->format('d M, Y h:i A') }}</td>
								<td>
									<button class="btn btn-danger btn-sm" data-toggle="modal"
										data-target="#confirm-delete"
										data-href="{{ route('back.preorders.delete', $data->id) }}">
										Delete
									</button>
								</td>
							</tr>
						@empty
							<tr>
								<td colspan="7" class="text-center">No Pre Orders Found</td>
							</tr>
						@endforelse
					</tbody>
				</table>
			</div>

			<div class="mt-3">
				{{ $datas->links() }}
			</div>
		</div>
	</div>
</div>

{{-- DELETE MODAL --}}
<div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" aria-labelledby="confirm-deleteModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">

      <div class="modal-header">
        <h5 class="modal-title">{{ __('Confirm Delete?') }}</h5>
        <button class="close" type="button" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">×</span>
        </button>
      </div>

      <div class="modal-body">
        {{ __('You are going to delete this pre-order. Do you want to delete it?') }}
      </div>

      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">{{ __('Cancel') }}</button>
        <form action="" class="d-inline btn-ok" method="POST">
            @csrf
            @method('DELETE')
            <button type="submit" class="btn btn-danger">{{ __('Delete') }}</button>
        </form>
      </div>
    </div>
  </div>
</div>
@endsection

@section('scripts')
<script>
    $('#confirm-delete').on('show.bs.modal', function(e) {
        $(this).find('.btn-ok').attr('action', $(e.relatedTarget).data('href'));
    });
</script>
@endsection