@extends(config('manager.views.layouts.master'))

@section('content')
    <div id="app">
        <ul class="breadcrumb">
            <li class="active">Trabalhe conosco</li>
        </ul>

        <div class="page-header clearfix">
            <h2 class="pull-left">Trabalhe conosco</h2>

            <div class="pull-right" style="margin-top: 10px;">

            </div><!-- .pull-right -->
        </div><!-- .page-header -->

        @include('manager::partials.messages')

        <form action="{{ route('manager.applications.index') }}" class="form-inline well">
            <input type="text" name="name" class="form-control" value="{{ request('name') }}" placeholder="Nome..." maxlength="255" autofocus>
            <input type="text" name="city" class="form-control" value="{{ request('city') }}" placeholder="Cidade..." maxlength="255">

            <button type="submit" class="btn btn-primary">Filtrar</button>
            <a href="{{ route('manager.applications.index') }}" class="btn btn-default">Limpar filtros</a>
        </form>

        <table class="table table-bordered table-striped table-hover">
            <thead>
                <tr>
                    <th>Nome</th>
                    <th>E-mail</th>
                    <th>Telefone</th>
                    <th>Localização</th>
                    <th>Data do cadastro</th>
                    <th width="130">Ações</th>
                </tr>
            </thead>
            <tbody>
                @foreach ($applications as $application)
                    <tr>
                        <td>{{ $application->name }}</td>
                        <td>{{ $application->email }}</td>
                        <td>{{ $application->phone }}</td>
                        <td>
                            @if ($application->city)
                                {{ $application->city }}/{{ $application->state }}
                            @endif
                        </td>
                        <td>{{ $application->present->created_at }}</td>
                        <td>
                            <div class="btn-group btn-group-sm">
                                <a href="{{ route('manager.applications.show', $application->id) }}" class="btn btn-default" title="Ver" v-on:click.prevent="find({{ $application->id }})">
                                    <span class="glyphicon glyphicon-search"></span> ver
                                </a>

                                <a href="{{ route('manager.applications.destroy', $application->id) }}" class="btn btn-default" data-delete="true" title="Excluir">
                                    <span class="glyphicon glyphicon-trash"></span> excluir
                                </a>
                            </div><!-- .btn-group -->
                        </td>
                    </tr>
                @endforeach
            </tbody>
        </table><!-- .table -->

        @if ($applications->count() === 0)
            <h3 class="text-center">Nenhum candidato encontrado.</h3>
        @endif

        {!! $applications->appends(request('page'))->render() !!}

        <div class="modal fade" id="modal-application">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title">Informações do candidato</h4>
                    </div>

                    <div class="modal-body">
                        <table class="table table-bordered">
                            <tr>
                                <th>Nome</th>
                                <td>@{{ application.name }}</td>
                            </tr>
                            <tr>
                                <th>E-mail</th>
                                <td>@{{ application.email }}</td>
                            </tr>
                            <tr>
                                <th>Telefone</th>
                                <td>@{{ application.phone }}</td>
                            </tr>
                            <tr>
                                <th>Celular</th>
                                <td>@{{ application.phone }}</td>
                            </tr>
                            <tr>
                                <th>Localidade</th>
                                <td>@{{ application.city }}/@{{ application.state }}</td>
                            </tr>
                            <tr>
                                <th>Área</th>
                                <td>@{{ application.area }}</td>
                            </tr>
                            <tr>
                                <th>Currículo</th>
                                <td><a href="/manager/curriculos/@{{ application.id }}/curriculo" class="btn btn-primary btn-sm" target="_blank">Abrir currículo</a></td>
                            </tr>
                        </table>
                    </div><!-- /.modal-body -->
                </div><!-- /.modal-content -->
            </div><!-- /.modal-dialog -->
        </div><!-- /.modal -->
    </div>
@stop

@section('scripts')
    @parent
    <script>
        var ApplicationShow = new Vue({
            el: '#app',

            data: {
                application: {}
            },

            methods: {
                find: function(id) {
                    var _this = this;

                    this.$http.get('/manager/curriculos/' + id).then(function(response) {
                        _this.application = response.json();
                        $('#modal-application').modal('show');
                    });
                }
            },

            created: function() {

            }
        });
    </script>
@stop