@extends('layouts.admin')
@section('content')
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-header">               
                <a href="{{ route('services.add') }}" 
                    class="btn btn-primary float-end mt-n1">
                    <i class="fas fa-plus"></i> New {{ $title }}
                </a>
                <h1 class="h3 mb-3">{{ $title }} <small>List</small></h1>
            </div>
            <div class="card-body">
                <table id="datatables-reponsive" class="table table-responsive" style="width:100%">					
                    <thead>
                        <tr>
                            <th style="width:5%;">No</th>
                            <th style="width:15%">Title</th>
                            <th style="width:60%">Description</th>
                            <th>Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        @if ($services->isEmpty())
                        <tr id="row">
                            <td colspan="5" align="center">Data Kosong</td>
                        </tr>
                        @else
                                                    @endif 
                    </tbody>
                </table>
            </div>           
        </div>
    </div>    
</div>

<!-- Delete Data -->
<div class="modal fade" id="delModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">				
                <h4 class="modal-title"><span class="fa fa-warning"></span> Konfirmasi Hapus</h4>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form action="{{ route('services.destroy') }}" method="POST">
                @csrf
                @method('POST')
                <div class="modal-body">
                    <input type="hidden" id="serviceId" name="serviceId" class="form-control" readonly>
                    <p>Apakah anda akan menghapus data ini ?</p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-dark pull-left" data-bs-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-danger">Hapus</button>
                </div>
            </form>
        </div>
    </div>
</div>
<!-- End Delete Data -->

<script>
 function getId(id){
    $('#serviceId').val(id);
 }
</script>

@endsection