@extends('apex-layouts.main')

@section('title',"Dietbox-Shops")

@section('header-right')
    <a href="{{ route('shops.create') }}" class="btn btn-raised btn-primary round btn-min-width mr-1 mb-1"><i
                class="fa fa-plus-circle"></i> </a>
@endsection
@section('content')
    <section id="multi-column">
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-body collapse show">
                        <div class="card-block ">
                            <table class="table table-responsive-lg" id="shops-table">
                                <thead>
                                <tr>
                                    <th>id</th>
                                    <th>title</th>
                                    <th>about</th>
                                    <th>address</th>
                                    <th>lat</th>
                                    <th>long</th>
                                    <th>phone</th>
                                    <th>cover_id</th>
                                    <th>website</th>
                                    <th>active</th>
                                    <th>created_at</th>
                                    <th>action</th>
                                </tr>
                                </thead>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection

@section('scripts')
    <script>
        $(function () {
            $('#shops-table').DataTable({
                processing: true,
                serverSide: true,
                iDisplayLength: 100,
                aaSorting: [[0, "desc"]],
                ajax: '{!! route('shops.data') !!}',
                columns: [
                    {data: 'id'},
                    {data: 'title'},
                    {data: 'about'},
                    {data: 'address'},
                    {data: 'lat'},
                    {data: 'long'},
                    {data: 'phone'},
                    {data: 'cover_id'},
                    {data: 'website'},
                    {data: 'active'},
                    {data: 'created_at'},
                    {data: 'action'},

                ]
            });
        });

    </script>
@stop