@extends('layouts.main', ['title' => 'Item Groups'])
@section('navigation')
    <ul class="breadcrumb">
        <li><a href="{{route('home')}}">Dashboard</a> <span class="divider">/</span></li>
        <li class="active">Item Groups</li>
        </li>
    </ul>
@stop
@section('title')
    Item Groups
@endsection

@section('contentinner')

    @include('errors.errors-list')

    @include('stores.inventories.items.includes.tabs')

    <li class="right btn-group" style="float: right; margin: 10px; margin-top: -10px">
        <div class="btn-group">
            <button class="btn dropdown-toggle" data-toggle="dropdown">
                <i class="icon-th"></i> &nbsp;OPTIONS <span class="caret"></span>
            </button>
            <ul class="dropdown-menu">
                <li><a onclick="create('{{ route('item_groups.create') }}')"><i class="icon-plus"></i> &nbsp;Create Item Groups</a></li>
            </ul>
            
        </div><!--btn-group-->
    </li>

    <!-- Main Table -->
    <div class="row-fluid">
        <div class="span12">
            <table class="table table-bordered table-condensed" id="main_table">
                <thead>
                    <tr>
                        <th width='5px'><input type="checkbox" class="checkall"/></th>
                        <th>Name</th>
                        <th>Description</th>
                        <th width='5px'>Action</th>
                    </tr>
                </thead>
            </table>
        </div><!--span12-->
    </div><!--row-fluid-->

    
    
    <!-- main_modal -->
    <div aria-hidden="false" class="fade hide modal animated" data-backdrop="static" id="main_modal"></div>

    <form action='route("inspection_sheets", ":id")' method='post'>
    {{ csrf_field() }}
    {{ method_field('DELETE') }}
    </form>


    <script>
        var mainDataTable = jQuery('#main_table').DataTable({
            "oLanguage": {
                "sLoadingRecords": "Please wait - loading orders...",
                "sZeroRecords": "No Driver available.",
                "sInfoEmpty": "No entries to display."
            },
            ajax: {
                url: "{{ route('item_groups.indexDatas') }}",
                method: 'POST',
                data: function (d) {},
                error: function (xhr, textStatus, error) {
                    if (textStatus === 'timeout') {
                        alert('Timeout error. The server took too long to send back the data.\nPlease try again.');
                    }
                }
            },
            scrollCollapse: true,
            "sPaginationType": "full_numbers",
            processing: true,
            serverSide: true,
            "columns": [
                {data: 'checkbox'},
                {"class": "link", data: 'name'},
                {"class": "link", data: 'descriptions'},
                {data: 'action'}
            ],
            "bStateSave": true
        });

        
        

        //Ajax function to delete a record
        function deleteRecordFn(id) {
            swal({
                title: "Are you sure?",
                text: "You will not be able to recover this imaginary file!",
                type: "warning",
                showCancelButton: true,
                confirmButtonColor: "#DD6B55",
                confirmButtonText: "Yes, delete it!",
                closeOnConfirm: false
            },
            function () {
                swal({title: "", text: "", timer: 0, showConfirmButton: false});
                
                jQuery.ajax({
                    url: "{{ route('item_groups.destroy', ':id') }}". replace(':id', id),
                    type: 'DELETE',
                    {{--data: {"id":stadiumId, "_token": "{{ csrf_token() }}" },--}}
                    success: function (data) {
                        console.log(data.state + ' ' + data.msg);
                        
                        if (data.state === 'Done') {
                            jQuery.jGrowl(data.msg);
                            mainDataTable.draw();
                        } else if (data.state === 'Fail') {
                            jQuery.jGrowl(data.msg);
                        } else {
                            jQuery.jGrowl('Something went wrong!');
                        }
                    },
                    error: function (data) {
                        jQuery.jGrowl('Fatal error');
                        console.log(data);
                    }
                });
            });
        }
    </script>
@endsection