@extends('layout')

@section('content_title')
    Fajták listája
@endsection

@section('top_button')
    <a class="btn btn-labeled btn-outline-primary" href="{{ route('master_data.breeds.create') }}"><span class="btn-label btn-label-spaced"><i class="fa fa-plus"></i>Új rögzítés</span></a>
@endsection

@section('content')
    <form action="{{ route('master_data.breeds.filter') }}" class="filter" method="post">
        @csrf
        <div class="dflex aifend">
            <div class="form-row align-items-end f1">
                <div class="form-group col-lg-2">
                    <input type="text" class="form-control" name="name" id="name" value="{{ old('name', $filter['name']) }}" placeholder="Név">
                </div>
                <div class="form-group col-lg-2">
                    {!! html_select('enabled', $filter['enabled_list'], old('enabled', $filter['enabled']), $errors, false, 'form-control enabled') !!}
                </div>
            </div>
            <div class="dflex aicenter">
                <button class="btn btn-sm btn-primary">Keresés</button>
                <button class="btn btn-sm btn-outline-primary" name="clear">Törlés</button>
            </div>
        </div>
    </form>
    <table class="table table-striped datatable-basic">
        <thead>
        <tr>
            <th>Név</th>
            <th>Aktív</th>
            <th width="60" class="text-right">&nbsp;</th>
        </tr>
        </thead>
    </table>
@endsection

@push('scripts')
    <script>
        $(function() {
            $('.datatable-basic').DataTable({
                orderCellsTop: true,
                fixedHeader: true,
                language: {
                    url: '/js/datatable_hu.json'
                },
                pageLength: 30,
                dom: '<"datatable-scroll"t><"datatable-footer"ip>',
                processing: true,
                serverSide: true,
                stateSave: true,
                ajax: {
                    url: '{{ route('master_data.breeds.data') }}',
                    type: 'POST'
                },
                columns: [
                    {data: 'name'},
                    {
                        data: 'enabled', render: function (data, type, row) {
                            return data ? 'igen' : 'nem';
                        }
                    },
                    {data: 'actions', searchable: false, sortable: false, className: 'text-right nowrap'}
                ],
                order: [[0, 'asc']]
            });
        });
    </script>
@endpush