@extends("../dashboard._blank")
@include("../dashboard.Boutique.check_is_user_boutique")

@section("sidebar")
    @include("../dashboard._sidebar")
@endsection

@section("content")
    <style>
        #categorieModal .modal-dialog {
            -webkit-transform: translate(0,-50%);
            -o-transform: translate(0,-50%);
            transform: translate(0,-50%);
            top: 50%;
            margin: 0 auto;
        }

        #categorieViewModal .modal-dialog {
            -webkit-transform: translate(0,-50%);
            -o-transform: translate(0,-50%);
            transform: translate(0,-50%);
            top: 50%;
            margin: 0 auto;
        }
        .form-control{
            width:100%;
        }
        .form-control{
            width: 100%;
        }
        /*.dataTables_length{*/
        /*    margin-bottom: 10px;*/
        /*}*/
        /*.dt-buttons btn-group{*/
        /*    margin-bottom: 10px;*/
        /*}*/
        .btn{
            border-radius: 0px;
        }
    </style>
    <!-- page content -->
    <div class="right_col" role="main">
        <div>
            <div class="clearfix"></div>
            <div class="container">
                <div class="row add-btn-container">
                    <button data-target="#shippingCreateModal" data-toggle="modal" class="add-btn btn btn-primary pull-right"> <i class="fa fa-plus"></i> Ajouter un nouveau plan tarifaire</button>
                </div>
                <!-- form -->
                <div class="row">
                    <h2 class="col-12">
                        <a href="{{route('livraisons.index')}}" class="btn btn-default btn-sm"><i class="fa fa-long-arrow-alt-left"></i></a>    GRILLES TARIFAIRES
                    </h2>
                    <h2 class="col-12">
                        <img src="{{$service->logo}}" alt="" width="50px" height="50px" style="border-radius: 50%;border: 1px solid #ddd">
                        {{$service->name}}
                    </h2>
                    <div class="col-sm-12 col-xs-12 col-lg-12" style="margin-top: 20px;">
                                       <div class="container">
                                           <div class="row">
                                               <table   class="table table-responsive-xs table-striped table-bordered">
                                                   <thead>
                                                   <tr>
                                                       <th>Pays</th>
                                                       <th>Documents</th>
                                                       <td>Actions</td>
                                                   </tr>
                                                   </thead>
                                                   <tbody>
                                                   @php $serviceapp=new App\ServiceShipping(); @endphp
                                                    @foreach($grilles as $grille)
                                                        @php $countries= json_decode($grille->countries,true); @endphp
                                                        <tr>
                                                            <td>
                                                            @for($i=0;$i<count($countries);$i++)
                                                                <span class="badge badge-dark">{{$countries[$i]}}</span>
                                                            @endfor
                                                            </td>
                                                            <td>
                                                                <a href="{{$grille->filename}}" target="_blank">{{'grille tarifiare'}}</a>
                                                            </td>
                                                            <td>
                                                                <a href="" class="btn btn-sm btn-warning">changer le status</a>
                                                                <a href="" class="btn btn-sm btn-danger">supprimer</a>
                                                            </td>
                                                        </tr>
                                                        @endforeach
                                                   </tbody>
                                               </table>
                                           </div>
                                       </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div id="shippingCreateModal" class="modal fade" data-backdrop="static" data-keyboard="false">
        <div class="modal-md modal-dialog">

                <div class="modal-content">
                    <div class="modal-header" style="background: #00ba9d;">
                        <h4 class="modal-title text-left" style="color: #f1f1f1;"><i class="fa fa-shipping-car"></i> Nouveau plan tarifaire pour le service de livraison {{$service->name}}</h4>
                    </div>
                    <div class="modal-body">
                        <div class="card col-md-12 col-lg-12 col-xs-12" id="form-container">
                            <div class="card-body row">
                                <div style="text-align: center;display:none" class="form-loader text-center"><img style="width: 7%;" src="{{asset('images/livraison-loader.gif')}}"></div>
                                <div class="error-container" style="display: none;">
                                </div>
                                   <form class="col-md-12" method="post" action="{{route('livraisons.storePlanTarifaire')}}" enctype="multipart/form-data">
                                       @csrf
                                       <section id="second_section">
                                           <h2>Plan tarifaire par pays</h2>
                                           <input type="hidden" name="service_slug" value="{{$service->slug}}">
                                           <div class="form-group">
                                               <button type="button" class="btn btn-warning btn-sm add_plan">Ajouter un nouveau plan tarifaire par pays</button>
                                           </div>
                                           <div class="planTarifaire">
                                               <div class="section">
                                           <div class="form-group">
                                               <label for="pays_provenance">Pays </label>
                                               <select id="pays_provenance" data-placeholder="Choisissez le pays" multiple name="countries[][]" class="form-control choosen">
                                                   <option>Choisissez le pays </option>
                                                   @foreach ($pays as $country)
                                                       <option value="{{$country->name}}"> {{$country->name}}</option>
                                                   @endforeach
                                               </select>
                                           </div>
                                           <div class="form-group">
                                               <label for="plan_tarifaire">Plan tarifaire <span style="color: red">(pdf *)</span></label>
                                               <input type="file" id="plan_tarifaire" class="form-control" name="filename[]">
                                           </div>
                                               <button class="btn btn-danger btn-sm delete_section_plan"><i class="fa fa-trash"></i></button>
                                           </div>
                                           </div>
                                           <br><br>
                                           <div class="form-group pull-right">
                                               <button type="submit" class="btn btn-primary">Ajouter</button>
                                               <button type="button" class="btn btn-dark close-form-btn" data-dismiss="modal">Annuler</button>
                                           </div>
                                       </section>

                                    </form>

                            </div>
                        </div>
                    </div>
                </div>

        </div>
    </div>


    <!-- /page content -->
@endsection
@section('script')
    @include('dashboard.MoyenLivraisons.scripts.scripts')
    @stop