@extends('layouts.main_without_top_button', ['title' => 'BORDER EXPENSES | ' . config('app.name')])

@section('title') BORDER EXPENSES @stop
@section('navigation')
    <ul class="breadcrumb">
        <li><a href="{{route('home')}}">Dashboard</a> <span class="divider">/</span></li>
        <li><a href="">Finance</a> <span class="divider">/</span></li>
        <li><a href="">Settings</a> <span class="divider">/</span></li>
        <li class="active">Border Expenses</li>
    </ul>
@stop
@section('contentinner')
    <div class="tabbable">
        @include('financial_accounts.settings.includes.profile')
        <div class="tab-content">
            <div class="tab-pane active">
                <div class="row-fluid" style="margin-bottom: 8px;">
                    <div class="span12  profile-left">

                        {{--<div class="msghead" style="margin-top: -20px;margin-bottom: 5px">--}}
                            {{--<ul class="msghead_menu">--}}
                                {{--<li class="right btn-group">--}}
                                    {{--<a class="btn" onclick="create('{{ route('border_expenses.create') }}')"><span class="icon icon-plus"></span>NEW BORDER EXPENSE</a>--}}
                                {{--</li>--}}
                            {{--</ul>--}}
                            {{--<span class="clearall"></span>--}}
                        {{--</div><!--msghead-->--}}

                        <table class="table table-striped table-condensed table-bordered" id="main_table" width="100%">
                            <thead>
                            <tr>
                                <td style="width: 20px;">S/N</td>
                                <th>Border Name</th>
                                {{--<th>Account</th>--}}
                                {{--<th>Amount</th>--}}
                                {{--<th>Currency</th>--}}
                                <th style="width: 20px;">Action</th>
                            </tr>
                            </thead>
                        </table>

                    </div><!--span6-->
                </div><!--row-fluid-->
            </div><!--tab-pane-->
        </div><!--tabcontent-->
    </div><!--tabbable-->
    <script>
        var oTable = jQuery('#main_table').on('error.dt', function (e, settings, techNote, message) {
            console.log('An error has been reported by DataTables: ', message);
            $.jGrowl("ERROR LOADING DATA!", {header: 'Important'});
            stopSpinner();
        })
        .DataTable({
            "oLanguage": {
                "sLoadingRecords": startSpinner(),
                "sZeroRecords": "No Route records to display.",
                "sProcessing": "Please wait - loading records...",
                "sInfoEmpty": "No entries to display."
            },
            "initComplete": function (settings, json) {
                stopSpinner();
            },
            ajax: {
                url: '{{ route("border_expenses.datatable.index") }}',
                data: function (d) {}
            },
            scrollCollapse: true,
            "sPaginationType": "full_numbers",
            processing: true,
            serverSide: true,
            "order":[[0,'asc']],
            "columns": [
                {"class": "link", data: 'id'},
                {"class": "link", data: 'border'},
//                {"class": "link", data: 'account'},
//                {"class": "link", data: 'amount'},
//                {"class": "link", data: 'currency'},
                {"class": "link", data: 'action'}
            ],
            "bStateSave": true
        });

        function editFn(id) {
            var url = '{{ route("border_expenses.edit", ":id") }}' . replace(':id', id);
            edit(url);
        }
        function destroyFn(id) {
            var url = '{{ route("border_expenses.destroy", ":id") }}' . replace(':id', id);
            destroy(url);
        }
    </script>
@endsection