@extends('admin.layouts.default')

{{-- Page title --}}
@section('title')
    Competitors
    @parent
@stop

{{-- page level styles --}}
@section('header_styles')
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/vendors/datatables/css/dataTables.bootstrap.css') }}" />
    <link href="{{ asset('assets/css/pages/tables.css') }}" rel="stylesheet" type="text/css" />
    <link href="{{ asset('assets/css/pages/pareto.css') }}" rel="stylesheet" type="text/css"/>
@stop

{{-- Page content --}}
@section('content')

    <section class="content-header">

    </section>

    <!-- Main content -->
    <section class="content paddingleft_right15">
        <div class="row">
            <div class="panel panel-primary ">
                <div class="panel-heading">
                    <h4 class="panel-title"> <i class="livicon" data-name="user" data-size="16" data-loop="true" data-c="#fff" data-hc="white"></i>
                        Competitors List
                    </h4>
                    <a href="{{ route('admin.new_competitor') }}" class="btn btn-primary btn-sm" style="border: 1px solid #fff;float: right;margin-top: -24px;"> Add New Competitor</a>
                </div>
                <br />
                <div class="panel-body">
                    <div class="table-responsive">

                        <table class="table table-bordered width100" id="competitors">
                            <thead>
                            <tr class="filters">
                                <th>Actions</th>
                                <th>Competitor Names</th>
                                <th>Capacity (EUR)</th>
                                <th>Update</th>
                                <th>User</th>
                            </tr>
                            </thead>
                            <tbody>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>    <!-- row-->
    </section>

@stop

{{-- page level scripts --}}
@section('footer_scripts')
    <script type="text/javascript" src="{{ asset('assets/vendors/datatables/js/jquery.dataTables.js') }}"></script>
    <script type="text/javascript" src="{{ asset('assets/vendors/datatables/js/dataTables.bootstrap.js') }}"></script>
    <script>
        $(function() {
            var table = $('#competitors').DataTable({
                processing: true,
                serverSide: true,
                ajax: '{!! route('admin.competitor_data') !!}',
                columns: [
                    { data: 'action', name: 'Actions', orderable: false, searchable: false},
                    { data: 'Competitor Name/Affiliate', name: 'Competitor Name/Affiliate' },
                    { data: 'Capacity_EUR', name: 'Capacity_EUR' },
                    { data: 'Update', name: 'Update' },
                    { data: 'User', name: 'User' }
                ],
                "order": [[1, "asc"]],

            });
            table.on( 'draw', function () {
                $('.livicon').each(function(){
                    $(this).updateLivicon();
                });
            } );
        });
    </script>
    <div class="modal fade" id="delete_confirm" tabindex="-1" role="dialog" aria-labelledby="user_delete_confirm_title" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content"></div>
        </div>
    </div>
    <script>
        $(function () {
            $('body').on('hidden.bs.modal', '.modal', function () {
                $(this).removeData('bs.modal');
            });
        });
    </script>
@stop