@extends('layouts.layout-2')

@section('content')

    <h4 class="font-weight-bold py-3 mb-4">
        Reisebausteine / Bausteine
    </h4>

    <div class="card">
        <div class="card-datatable table-responsive">
            <table class="datatables-customer table table-striped table-bordered">

                <thead>
                <tr>
                    <th style="max-width: 60px;">&nbsp;</th>
                    <th>{{__('Name')}}</th>
                    <th>{{__('Typ')}}</th>
                    <th>{{__('Land')}}</th>
                    <th>{{__('Ort(e)')}}</th>
                    <th>{{__('sichbar')}}</th>
                    <th style="max-width: 60px;">&nbsp;</th>

                </tr>
                </thead>
            </table>
        </div>

        <div class="ml-3 mb-2">
            <a href="{{ route('iq_travel_item_detail', ['new']) }}" class="btn btn-sm btn-primary">Neuen Reisebaustein anlegen</a>
        </div>
    </div>

    <script>
        $( document ).ready(function() {
            $('.datatables-customer').dataTable({
                "processing": true,
                "serverSide": true,
                "ajax": '{!! route('data_table_travel_items') !!}',
                "order": [[ 1, "desc" ]],
                "columns": [
                    { data: 'action_edit', orderable: false, searchable: false},
                    { data: 'name', name: 'name' },
                    { data: 'draft_type', name: 'draft_type', orderable: false, searchable: false },
                    { data: 'country', name: 'country', orderable: false, searchable: false },
                    { data: 'travel_places', name: 'travel_places', orderable: false, searchable: false },
                    { data: 'active', name: 'active' },
                    { data: 'action_delete', orderable: false, searchable: false},
                ],
                "bLengthChange": false,
                "iDisplayLength": 100,
                "language": {
                    "url": "/js/German.json"
                }
            });
        });
    </script>



@endsection