@extends('layouts.app')

@section('title','Countries')

@section('content')
<div class="row">
    <div class="col-md-12">
        <div class="panel panel-default">
            <div class="panel-heading">List of Countries</div>
            <div class="panel-body">
                @if(count($companies)>0)
                <table class="table table-striped table-responsive">
                    <thead>
                        <tr>
                            <th>Name</th>
                            <th>Country</th>
                            <th>Website</th>
                            <th>Image</th>
                            <th>Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($companies as $company)
                        <tr>
                            <td>{{ $company->name }}</td>
                            <td>{{ $company->country->name }}</td>
                            <td><a target="_blank" href="{{ $company->url }}">{{ $company->url }}</a></td>
                            <td><img src="{{ asset('images/'.$company->image) }}" class="img-responsive img-thumbnail" alt="{{ $company->name }}"></td>
                            <td class="text-center"><p> <a id="deleteCompany" data-id="{{ $company->id }}" href="#" class="btn btn-danger" data-toggle="modal" data-target="#deleteModal">Delete</a> </p></td>
                        </tr>
                        @endforeach
                    </tbody>                                        
                </table>
                {{ $companies->links() }}
                @else
                No companies found.
                @endif
            </div>
        </div>
    </div>
</div>

<div id="deleteModal" class="modal fade" role="dialog">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Delete company</h4>
            </div>
            <div class="modal-body">
                <p>Are you sure you want to delete this company?</p>
                <form id="deleteCompanyForm" method="POST" action="{{ url('/admin/company') }}">
                    {{ csrf_field() }}
                    <input id="company_id" type="hidden" name="company_id" value="">
                    <input type="hidden" name="_method" value="DELETE">
                    <input type="submit" name="submit" value="Yes" class="btn btn-success">
                    <button type="button" class="btn btn-danger" data-dismiss="modal">No</button>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>
@endsection

@section('footer')

<script type="text/javascript">
  $(document).on('click','#deleteCompany',function(){
    var file = $(this).data('id');
    $("#deleteCompanyForm #company_id").val(file);
});
</script>

@endsection

