@extends('management.default.default')

@section('title', 'Partenaires')

@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 nouveau
                                    partenaire</small>
                            </a>

                        </div>
                    </div>
                    <div class="portlet-body">
                        <div class="table-responsive">
                            <table id="example1" class="table table-theme table-striped">
                                <thead>
                                <tr>
                                    <th>Entreprise</th>
                                    <th>URL</th>
                                    <th>Ordre d'affichage</th>
                                    <th></th>
                                </tr>
                                </thead>
                                <tbody>
                                @foreach($partners as $partner)
                                    <tr>
                                        <th><b>{{$partner->name}}</b></th>
                                        <th>{{$partner->url}}</th>
                                        <th class="text-center">
                                            {{$partner->order}}
                                        </th>
                                        <th class="text-center">
                                            <a data-toggle="modal" href="" id="edit"
                                               data-target='#editModal' data-id="{{ $partner->id }}"
                                               style="margin-right: 5px"
                                               title="Editer ce partenaire"><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">
                                    Nouveau partenaire</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">Entreprise : <sup
                                                        class="color-red">*</sup></label>
                                                <input type="text" class="form-control" name="name" required
                                                       placeholder=""/>
                                            </div>
                                        </div>
                                        <br/> <br/>
                                        <div class="col-sm-12">
                                            <div class="form-group">
                                                <label class="text-muted">URL :</label>
                                                <input type="url" class="form-control" name="url"
                                                       placeholder=""/>
                                            </div>
                                        </div>
                                        <div class="col-sm-12">
                                            <div class="form-group">
                                                <label class="text-muted">Image : <sup
                                                        class="color-red">*</sup></label>
                                                <input type="file" class="form-control" name="image" required
                                                       placeholder=""/>
                                            </div>

                                        </div>
                                        <div class="col-sm-12">
                                            <div class="form-group">
                                                <label class="text-muted">Ordre d'affichage : <sup
                                                        class="color-red">*</sup></label>
                                                <input type="number" class="form-control" name="order" min="0" required
                                                       value="1"
                                                       placeholder=""/>
                                            </div>
                                            <br/> <br/>
                                        </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 administrateur</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">Entreprise : <sup
                                                        class="color-red">*</sup></label>
                                                <input type="text" class="form-control" id="name" name="name" required
                                                       placeholder=""/>
                                            </div>
                                        </div>
                                        <br/> <br/>
                                        <div class="col-sm-12">
                                            <div class="form-group">
                                                <label class="text-muted">URL :</label>
                                                <input type="url" class="form-control" id="url" name="url"
                                                       placeholder=""/>
                                            </div>
                                        </div>
                                        <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 class="col-sm-12">
                                            <div class="form-group">
                                                <label class="text-muted">Ordre d'affichage : <sup
                                                        class="color-red">*</sup></label>
                                                <input type="number" class="form-control" id="order" name="order"
                                                       min="0" required value="1"
                                                       placeholder=""/>
                                            </div>
                                            <br/> <br/>
                                        </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 ce
                                                    partenaire</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/partners/' + id + '/edit';
            document.getElementById('deleteLink').href = '/management/partners/' + id + '/delete';

            $.get('/management/partners/' + id, function (data) {
                $('#name').val(data.data.name);
                $('#url').val(data.data.url);
                $('#order').val(data.data.order);
            })
        });
    </script>
@endsection