@extends('management.default.default')

@section('title', 'Avis client')

@section('content')
    <div class="section-admin container-fluid">
        <div class="row">
            <div class="col-sm-12">
                <div class="portlet portlet-bordered">
                    <div class="portlet-title">
                        <div class="caption caption-lighter">
                            <span class="caption-subject text-uppercase"></span>
                        </div>
                        <div class="actions">
                            <a data-placement="top" class="tip-top text-success "
                               style="cursor: pointer"
                               data-original-title=""
                               data-toggle="modal"
                               data-target="#modalForm">
                                <i class="fa fa-plus"></i> <small class=" mar-right-10">Ajouter un nouvel avis</small>
                            </a>

                        </div>
                    </div>
                    <div class="portlet-body">
                        <div class="table-responsive">
                            <table id="example1" class="table table-theme table-striped">
                                <thead>
                                <tr>
                                    <th>Nom</th>
                                    <th>Entreprise</th>
                                    <th class="text-center">Visible au public</th>
                                    <th></th>
                                </tr>
                                </thead>
                                <tbody>
                                @foreach($feedbacks as $feedback)
                                    <tr>
                                        <th><b>{{$feedback->name}}</b></th>
                                        <th>{{$feedback->company}}</th>
                                        <th class="text-center">
                                            @if($feedback->is_verified)
                                                <span class="label label-success">Oui</span>
                                            @else
                                                <span class="label label-danger">Non</span>
                                            @endif
                                        </th>
                                        <th class="text-center">
                                            <a data-toggle="modal" href="" id="edit"
                                               data-target='#editModal' data-id="{{ $feedback->id }}"
                                               style="margin-right: 5px"
                                               title="Editer cet avis"><i
                                                    class="fa fa-edit"></i> </a>
                                        </th>
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="modal centered fade" id="modalForm" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content modal-background">
                <div class="modal-body pad-top-50 pad-bot-50 pad-left-50 pad-right-50">
                    <div class="container-fluid">
                        <div class="row">
                            <div class="col-md-12">
                                <h3 id="LoginPanel"
                                    class="no-margin-top mar-bot-10 text-uppercase text-center letter-spacing-1">
                                    Nouvel avis</h3>

                                <form class="form-theme mar-top-30" method="post" action=""
                                      enctype="multipart/form-data">
                                    @csrf

                                    <div class="row">
                                        <div class="col-sm-12">
                                            <div class="form-group">
                                                <label class="text-muted">Nom : <sup
                                                        class="color-red">*</sup></label>
                                                <input type="text" class="form-control" name="name" required
                                                       placeholder=""/>
                                            </div>
                                        </div>
                                        <div class="col-sm-12">
                                            <div class="form-group">
                                                <label class="text-muted">Entreprise :</label>
                                                <input type="text" class="form-control" name="company"
                                                       placeholder=""/>
                                            </div>
                                        </div>
                                        <div class="col-sm-12">
                                            <div class="form-group">
                                                <label class="text-muted">Message : <sup
                                                        class="color-red">*</sup></label>
                                                <textarea type="text" class="form-control" name="message" required
                                                ></textarea>
                                            </div>
                                        </div>
                                        <br/> <br/>
                                        <div class="col-sm-12">
                                            <div class="form-group">
                                                <label class="text-muted">Image (Logo) : </label>
                                                <input type="file" class="form-control" name="image"
                                                       placeholder=""/>
                                            </div>

                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-sm-12">
                                            <div class="text-center">
                                                <button type="submit" class="btn btn-theme btn-full-width">Ajouter
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="modal centered fade" id="editModal" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content modal-background">
                <div class="modal-body pad-top-50 pad-bot-50 pad-left-50 pad-right-50">
                    <div class="container-fluid">
                        <div class="row">
                            <div class="col-md-12">
                                <h3 id="LoginPanel"
                                    class="no-margin-top mar-bot-10 text-uppercase text-center letter-spacing-1">
                                    Edition avis</h3>

                                <form id="formEdit" class="form-theme mar-top-30" method="post" action=""
                                      enctype="multipart/form-data">
                                    @csrf

                                    <div class="row">
                                        <div class="col-sm-12">
                                            <div class="form-group">
                                                <label class="text-muted">Nom : <sup
                                                        class="color-red">*</sup></label>
                                                <input type="text" class="form-control" name="name" required id="name"
                                                       placeholder=""/>
                                            </div>
                                        </div>
                                        <div class="col-sm-12">
                                            <div class="form-group">
                                                <label class="text-muted">Entreprise :</label>
                                                <input type="text" class="form-control" name="company" id="company"
                                                       placeholder=""/>
                                            </div>
                                        </div>
                                        <div class="col-sm-12">
                                            <div class="form-group">
                                                <label class="text-muted">Message : <sup
                                                        class="color-red">*</sup></label>
                                                <textarea type="text" class="form-control" name="message" required
                                                          id="message"
                                                ></textarea>
                                            </div>
                                        </div>

                                        <div class="col-sm-12">
                                            <div class="form-group">
                                                <label class="text-muted">Visible au public : <sup
                                                        class="color-red">*</sup></label>
                                                <select class="form-control" id="is_verified" required
                                                        name="is_verified">
                                                    <option value="1">Oui</option>
                                                    <option value="0">Non</option>
                                                </select>
                                            </div>
                                        </div>

                                        <br/> <br/>
                                        <div class="col-sm-12">
                                            <div class="form-group">
                                                <label class="text-muted">Image :</label>
                                                <input type="file" class="form-control" name="image"
                                                       placeholder=""/>
                                            </div>

                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-sm-12">
                                            <div class="text-center">
                                                <button type="submit" class="btn btn-theme btn-full-width">Modifier
                                                </button>
                                                <br/><br/>

                                                <a id="deleteLink" style="color: red" href="">Supprimer cet avis</a>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('script')
    <script>
        $('body').on('click', '#edit', function (event) {
            event.preventDefault();

            var id = $(this).data('id');

            document.getElementById('formEdit').action = '/management/feedbacks/' + id + '/edit';
            document.getElementById('deleteLink').href = '/management/feedbacks/' + id + '/delete';

            $.get('/management/feedbacks/' + id, function (data) {
                $('#name').val(data.data.name);
                $('#company').val(data.data.company);
                $('#message').val(data.data.message);
                $('#is_verified').val(data.data.is_verified ? 1 : 0);
            })
        });
    </script>
@endsection