@extends('admin.layout')

@section('content')
    <!-- Page Heading -->
    <div class="row">
        <div class="col-lg-12">
            <h1 class="page-header">
                Referencje ({{ $references->total() }})
            </h1>
        </div>
    </div>
    <!-- /.row -->

    <div class="row">
        <div class="col-lg-12">
            <button type="button" class="btn btn-primary show-modal-button" data-toggle="modal" data-target="#detailsModal">
                Dodaj nową <i class="glyphicon glyphicon-plus"></i>
            </button>
        </div>
    </div>
    <br/><br/>
    <div class="table-responsive">
        <table class="table table-striped table-bordered">
            <thead>
            <tr>
                <th>ID</th>
                <th>Nazwa</th>
                <th>Osoba</th>
                <th>Adres</th>
                <th>Kontakt</th>
                <th>Akcje</th>
            </tr>
            </thead>
            <tbody>
            @foreach($references as $ref)
                <tr>
                    <td>{{ $ref->id }}</td>
                    <td>{{ $ref->title }}</td>
                    <td>{{ $ref->person }}</td>
                    <td>{{ $ref->company }}</td>
                    <td><a href="mailto:{{ $ref->email }}">{{ $ref->email }}</a><br/>{{ $ref->phone }}</td>
                    <td>

                        <button type="button" class="btn btn-primary show-modal-button" data-toggle="modal" data-target="#detailsModal" data-id="{{ $ref->id }}" data-title="{{ $ref->title }}" data-person="{{ $ref->person }}" data-company="{{ $ref->company }}" data-email="{{ $ref->email }}" data-phone="{{ $ref->phone }}" data-region="{{ $ref->region }}">
                            <i class="glyphicon glyphicon-pencil"></i>
                        </button>
                    </td>
                </tr>
            @endforeach
            </tbody>
        </table>

        {!! $references->render() !!}
    </div>

    <!-- Modal -->
    <div class="modal" id="detailsModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <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" id="myModalLabel">Dodaj/edytuj</h4>
                </div>
                <form method="post" class="reply" id="contact" action="{!! route('admin::references.store') !!}">
                    <div class="modal-body">
                        @include('parts.errors')

                        <input type="hidden" name="id" id="ref_id"/>
                        {!! csrf_field() !!}
                        <fieldset>
                            <div class="row">
                                <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                                    <div class="form-group">
                                        <label>Nazwa: <span>*</span></label>
                                        <input class="form-control" id="title" name="title" type="text" value="" required>
                                    </div>
                                </div>
                                <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                                    <div class="form-group">
                                        <label>Osoba kontaktowa: <span>*</span></label>
                                        <input class="form-control" id="person" name="person" type="text" value="" required>
                                    </div>
                                </div>
                                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                                    <div class="form-group">
                                        <label>Adres: <span>*</span></label>
                                        <textarea class="form-control" id="company" name="company"></textarea>
                                    </div>
                                </div>
                                <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                                    <div class="form-group">
                                        <label>Email: <span>*</span></label>
                                        <input class="form-control" type="email" id="email" name="email" value="" required>
                                    </div>
                                </div>
                                <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                                    <div class="form-group">
                                        <label>Telefon: <span>*</span></label>
                                        <input class="form-control" type="text" id="phone" name="phone" value="" required>
                                    </div>
                                </div>
                                <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                                    <div class="form-group">
                                        <label>Region: <span>*</span></label>
                                        <select id="region" name="region" class="form-control">
                                            @foreach($regions as $key => $name)
                                                <option value="{{ $key }}">{{ $name }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </fieldset>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Zamknij</button>
                        <button type="submit" class="btn btn-primary">Zapisz</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection

@section('extra_scripts')
    <script>
        $("#detailsModal").on("show.bs.modal", function(e) {
            var button = $(e.relatedTarget);
            if (typeof button.data('id') !== 'undefined') {
                $(this).find("#ref_id").val(button.data('id'));
                $(this).find("#title").val(button.data('title'));
                $(this).find("#person").val(button.data('person'));
                $(this).find("#company").val(button.data('company'));
                $(this).find("#email").val(button.data('email'));
                $(this).find("#phone").val(button.data('phone'));
                $(this).find('#region option[value="' + button.data('region') + '"]').prop('selected', true);
            } else {
                $(this).find('form')[0].reset();
            }
        });
    </script>
@endsection