@extends('layouts.master')

@section('meta-tag')
    <meta name="description" content="Manajemen Armada">
@endsection

@section('title', 'Manajemen Armada')
@section('subtitle', 'Manajemen Armada, Buat, Edit, Hapus, dan Lihat Detail Armada')

@section('content')
    <section class="section">
        <div class="card">
            <div class="card-header">
                <h4 class="card-title">Armada</h4>
                <div class="text-end">
                    <a href="{{ route('admin.armada.create') }}" class="btn btn-primary">Tambah Armada</a>
                </div>
            </div>
            <div class="card-body">
                <div class="row mb-4 align-items-end">
                    <div class="col-md-2">
                        <label for="limit" class="form-label">Limit</label>
                        <select name="limit" id="limit" class="form-select">
                            <option value="10">10</option>
                            <option value="25">25</option>
                            <option value="50">50</option>
                            <option value="100">100</option>
                        </select>
                    </div>
                    <div class="col-md-2">
                        <label for="status" class="form-label">Status</label>
                        <select name="status" id="status" class="form-select">
                            <option value="">Semua</option>
                            <option value="1">Tersedia</option>
                            <option value="0">Tidak Tersedia</option>
                        </select>
                    </div>
                    <div class="col-md-4">
                        <label for="search" class="form-label">Search</label>
                        <div class="input-group">
                            <input type="text" name="search" id="search" class="form-control" placeholder="Cari Armada">
                            <button class="btn btn-primary" type="button" onclick="onSearch()">Cari</button>
                            @if(request()->has('search') || request()->has('status') || request()->has('limit'))
                                &nbsp;
                                <a href="{{ route('admin.armada.index') }}" class="btn btn-danger">Reset</a>
                            @endif
                        </div>
                    </div>
                </div>

                <table class="table table-striped">
                    <thead class="bg-primary">
                    <tr>
                        <th scope="col" class="text-white">#</th>
                        <th scope="col" class="text-white">Merk/Model</th>
                        <th scope="col" class="text-white">Kode Armada</th>
                        <th scope="col" class="text-white">Harga Sewa</th>
                        <th scope="col" class="text-white">Gambar</th>
                        <th scope="col" class="text-white">Status</th>
                        <th scope="col" class="text-white">Aksi</th>
                    </tr>
                    </thead>
                    <tbody>
                    @foreach($armadas as $armada)
                        <tr>
                            <th scope="row">{{ $loop->iteration }}</th>
                            <td>{{ $armada->merk_model }}</td>
                            <td>{{ $armada->kode_armada }}</td>
                            <td>{{ $armada->price }}</td>
                            <td>
                                <img src="{{ asset('storage/armada/' . $armada->image) }}" alt="{{ $armada->merk }}"
                                     class="img-fluid" style="width: 75px; height: auto;">
                            </td>
                            <td>
                                @if($armada->status)
                                    <span class="badge bg-success">Tersedia</span>
                                @else
                                    <span class="badge bg-danger">Tidak Tersedia</span>
                                @endif
                            </td>
                            <td>
                                <a href="{{ route('admin.armada.edit', $armada->id) }}"
                                   class="btn btn-warning btn-sm"><i class="bi bi-pencil"></i></a>
                                <button class="btn btn-danger btn-sm" onclick="deleteArmada({{ $armada->id }})"><i
                                        class="bi bi-trash"></i></button>
                            </td>
                        </tr>
                    @endforeach
                    </tbody>
                </table>
                {{ $armadas->links() }}
            </div>
        </div>
    </section>
@endsection

@push('scripts')
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"
            integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
    <script>
        function deleteArmada(id) {
            Swal.fire({
                title: 'Apakah Anda Yakin?',
                text: "Anda tidak akan dapat mengembalikan ini!",
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#3085d6',
                cancelButtonColor: '#d33',
                confirmButtonText: 'Ya, Hapus!'
            }).then((result) => {
                if (result.isConfirmed) {
                    $.ajax({
                        url: '{{ route('admin.armada.destroy',':id') }}'.replace(':id', id),
                        type: 'DELETE',
                        data: {
                            _token: '{{ csrf_token() }}'
                        },
                        success: function (response) {
                            Swal.fire(
                                'Deleted!',
                                'Your file has been deleted.',
                                'success'
                            ).then(() => {
                                window.location.reload();
                            });
                        }
                    });
                }
            });
        }


        function onSearch() {
            let limit = $('#limit').val();
            let status = $('#status').val();
            let search = $('#search').val();

            window.location.href = '{{ route('admin.armada.index') }}?limit=' + limit + '&status=' + status + '&search=' + search;
        }
    </script>
@endpush