@extends('petugas.layouts.layout_dashboard')

@section("title") Form @endsection

@section("breadcrumb")
    <li class="breadcrumb-item"><a href="{{route('petugas.dashboard.index')}}">Dashboard</a></li>
    <li class="breadcrumb-item"><a href="{{route('petugas.jenis_koleksi.index')}}">Jenis Koleksi</a></li>
    <li class="breadcrumb-item">@yield("title")</li>
@endsection

@section('header-scripts')
{{--    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.21/css/jquery.dataTables.css">--}}

{{--    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.js"></script>--}}
@endsection

@section('footer-scripts')
    @include('petugas.components.notification')

    <script>
        $(function () {
            // $.fn.dataTable.Buttons.defaults.dom.button.className = 'btn btn-primary'
            var t = $('#datatable').DataTable({
                processing: true,
                serverSide: true,
                pageLength: 50,
                ajax: {
                    url: "{{ route('petugas.jenis_koleksi.show',$jk->id) }}"
                },
                columnDefs: [{
                    orderable: false,
                    data: null,
                    className: '',
                    targets: 0,
                    defaultContent: ''
                }],
                // order: [[5, 'asc']],
                columns: [
                    {data: 'btn_ordering'},
                    {data: 'nama_field'},
                    {data: 'field_asli'},
                    // {data: 'active'},
                    {
                        data: 'active', render: function (data) {
                            if (data > 0) {
                                return '<i class="fa fa-check text-success" aria-hidden="true"></i> <span class="text-success">Aktif</span>';
                            }
                            return '<i class="fa fa-close text-danger" aria-hidden="true"></i> <span class="text-danger">Tidak Aktif</span>';

                        }},
                    {data: 'action'},
                ],


            });

            // t.on( 'draw.dt order.dt search.dt', function () {
            //     var PageInfo = $('#datatable').DataTable().page.info();
            //     t.column(0, {search:'applied',page: 'current'}).nodes().each( function (cell, i) {
            //         cell.innerHTML = i + 1 + PageInfo.start;
            //     } );
            // } );
        });
    </script>
@endsection

@section("content")

    <div class="row">
        <div class="col-md-12">
            <div class="card ">
                <div class="card-header card-header-rose card-header-icon">
                    <div class="card-icon">
                        <i class="material-icons">assignment</i>
                    </div>
                    <h4 class="card-title">Form Jenis Koleksi</h4>
                </div>
                <div class="card-body ">
                    <div class="row">
                        <div class="col-md-6">
                        </div>
                        <div class="col-md-6 text-right">
                            <a href="{{route('petugas.jenis_koleksi.index')}}" class="ml-1 btn btn-rose btn-sm">
                                Kembali
                            </a>
                        </div>
                    </div>

                    <div class="table-responsive " style="padding-bottom: 50px">
                        <table class="table table-striped table-bordered" id="datatable">
                            <thead>
                            <tr>
                                <th class="text-left">Ordering</th>
                                <th class="text-left">Nama Field</th>
                                <th class="text-left">Field Asli</th>
                                <th class="text-left">Active</th>
                                <th style="width: 200px">Action</th>
                            </tr>
                            </thead>
                            <tbody>

                            </tbody>
                        </table>
                    </div>

{{--                    <div class="table-responsive">--}}
{{--                        <table class="table table-striped table-no-bordered dataTable dtr-inline">--}}
{{--                            <thead>--}}
{{--                            <tr>--}}
{{--                                <th><b>No</b></th>--}}
{{--                                <th class="text-left"><b>Nama Field</b></th>--}}
{{--                                <th class="text-left"><b>Field Asli</b></th>--}}
{{--                                <th class="text-center"><b>Ordering</b></th>--}}
{{--                                <th class="text-center"><b>Active</b></th>--}}
{{--                                <th class="text-right"><b>Action</b></th>--}}
{{--                            </tr>--}}
{{--                            </thead>--}}
{{--                            <tbody>--}}
{{--                            @foreach($jkf as $key => $jkf_pus)--}}
{{--                                <tr>--}}
{{--                                    <td>{{ ($jkf->currentpage()-1) * $jkf->perpage() + $key + 1 }}</td>--}}
{{--                                    <td >{{$jkf_pus->nama_field}}</td>--}}
{{--                                    <td >{{$jkf_pus->field_asli}}</td>--}}
{{--                                    <td class="td-actions text-center">--}}
{{--                                        <a class="btn btn-warning btn-round text-white btn-sm"--}}
{{--                                           href="{{ route('petugas.jenis_koleksi_field.update_order_up',[$jkf_pus->id]) }}">--}}
{{--                                            <i class="material-icons">keyboard_arrow_up</i>--}}
{{--                                        </a>--}}
{{--                                        {{$jkf_pus->ordering}}--}}
{{--                                        <a class="btn btn-warning btn-round text-white btn-sm"--}}
{{--                                           href="{{ route('petugas.jenis_koleksi_field.update_order_down',[$jkf_pus->id]) }}">--}}
{{--                                            <i class="material-icons">keyboard_arrow_down</i>--}}
{{--                                        </a>--}}
{{--                                    </td>--}}
{{--                                    <td class="text-center">--}}
{{--                                        @if ($jkf_pus->active > 0)--}}
{{--                                            <span class="badge badge-success">--}}
{{--                                            Yes--}}
{{--                                            </span>--}}
{{--                                        @else--}}
{{--                                            <span class="badge badge-danger">--}}
{{--                                            No--}}
{{--                                            </span>--}}
{{--                                        @endif--}}
{{--                                    </td>--}}
{{--                                    <td class="td-actions text-right">--}}
{{--                                        <a class="btn btn-info text-white btn-sm"--}}
{{--                                           href="{{ route('petugas.jenis_koleksi_field.edit',[$jkf_pus->id]) }}">--}}
{{--                                            <i class="material-icons">edit</i>--}}
{{--                                        </a>--}}
{{--                                    </td>--}}
{{--                                </tr>--}}
{{--                            @endforeach--}}
{{--                            </tbody>--}}
{{--                        </table>--}}
{{--                    </div>--}}
{{--                    <div class="row">--}}
{{--                        <div class="col-sm-12">--}}
{{--                            {{$jkf->appends(Request::all())->links()}}--}}
{{--                        </div>--}}
{{--                    </div>--}}

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