{% extends "YOUCommercantBundle::min.html.twig" %}

{% block container %}

    <style>
        .main-content {
            margin:0!important;
        }
        #list {
            padding:0;
            margin:0;
            list-style:none;
            float:left;
            width:200px;
            height:360px;
            overflow-y:auto;
            overflow-x:hidden;
            background:#fff;
        }
        #list a{
            display: block;
            padding:8px 5px;
            background:#ffffff;
            border-bottom: 1px solid #eee;
        }
        #list a.current {
            color:#fff;
            background:#3399cc;
        }
        #list a i{
            float:right;
            margin-top:3px;
        }
        #list a.create {
            text-align: center;
            font-weight: bold;
        }
        #list a:hover{
            background: #eee;
            color:#3399cc!important;
        }
        #livraison {
            width: 800px;
            height:360px;
        }
        #content {
            height:360px;
            width: 599px;
            border-left:1px solid #eee;
            overflow-y:auto;
            overflow-x:hidden;
            background:#fff;
            margin:0;
        }

        #ajout_categorie {
            float:left;
        }
        #submittarifs {
            float:right;
        }

        #livraison label {
            position:relative;
            top:-4px;
        }

        #liste-livreurs {
            min-height: 131px;
        }
        #liste-livreurs label {
            display:none;
        }

        #liste-livreurs select,#liste-livreurs input,#liste-livreurs div,#liste-livreurs a {
            float:left;
            margin-right:20px;
        }
        #liste-livreurs div {
            margin-right:0;
        }
        #liste-livreurs select {
            width:120px;
        }
        #liste-livreurs input {
            width:90px;
        }
        #liste-livreurs a {
            margin:0;
            float:right;
        }
        .formName {
            float:left;
        }
        .formName label{
            display:inline-block;
            width:100px;
            text-align: left;
            padding-right:5px;
            top:-4px!important;
        }
        .formName input {
            width:175px;
            margin-top: 1px;
        }
        #hidden_form {
            display: none;
        }
        .headname p{
            float:left;
            text-align: center;
            width:90px;
            margin-right:20px;
        }
        .headname p.dest,.headname p.livreur {
            width:120px;
        }
        .headname p.frais {
            width:90px;
        }
        .headname p.frais2 {
            width:95px;
            margin-left:10px;
        }
        #save_add {
            clear: both;
        }
        p.explication {
            clear: both;
            padding-top: 10px;
            text-align: right;
            margin-right: 10px;
            font-size: 11px;
        }
        #ajouterBtn {
            float:right;
            margin-right: 10px;
        }
        .livreur-collection {
            width:505px;
        }
        .inputfrais2 {
            margin-right:0!important;
        }
        #titre {
            height:39px;
            background: #fff;
            font:13px tahoma;
            color:#333;
            text-indent: 20px;;
            line-height: 39px;
            border-bottom: 1px solid #333;
        }
    </style>

    <div id="titre">
        Choisissez un groupe de frais de port pour la livraison de ce produit :
    </div>
    <div id="livraison" class="row-fluid">
        <ul id="list" class="span4">
            <li><a class="create" style="text-align: left;text-indent: 10px;" href="{{  path('you_commercant_livraison_creer') }}"><i class="icon icon-plus" style="float:left;position: relative;left:-10px;"></i> Ajouter un groupe</a></li>

            {% for item in liste %}
                {% if current is defined and current == item.id %}
                    <script>parent.nino_Popup.setValue({id:{{ item.id }},name:"{{ item.name }}"});</script>
                    <li><a class="current" href="{{  path('you_commercant_livraison_afficher',{id:item.id}) }}"><span style="display:block;color:#fff;margin-bottom:3px;font:11px tahoma;">Groupe {{ loop.index }}</span>{{  item.name }} <i class="icon-chevron-right" style="position: relative;top:-8px;"></i></a></li>
                {% else %}
                    <li><a href="{{  path('you_commercant_livraison_afficher',{id:item.id}) }}"><span style="display:block;color:#999;margin-bottom:3px;font:11px tahoma;">Groupe {{ loop.index }}</span>{{  item.name }} <i class="icon-chevron-right" style="position: relative;top:-8px;"></i></a></li>
                {% endif %}
            {% endfor %}

        </ul>
        <div id="content" class="span8">
            {%  block content %}

                {% if livraison is defined %}
                    <h3 style="margin:30px 0 30px 30px;float: left;">{{ livraison.name }}</h3>
                    <a style="float:right;margin:40px 30px 0 0;" href="{{ path('you_commercant_livraison_editer',{id:livraison.id}) }}" class="btn btn-default">Modifier ce groupe</a>
                    <table style="margin:30px;width: 540px;line-height: 30px;clear: both">
                    <tr style="text-align: left;background: #eee">
                        <th style="text-indent: 10px;">Destination</th>
                        <th style="text-indent: 10px;">Livreur</th>
                        <th style="text-indent: 10px;">Tarif TTC</th>
                        <th style="text-indent: 10px;">Tarif 2nd article </th>
                    </tr>
                    {% for item in livraison.choix %}
                        <tr style="padding:5px 5px;">
                            <td style="text-indent: 10px;">{{ item.pays.name }}</td>
                            <td style="text-indent: 10px;">{{ item.livreur.name }}</td>
                            <td style="text-indent: 10px;">{{ item.prix|toeuro }}</td>
                            <td style="text-indent: 10px;">{{ item.prix2|toeuro }}</td>
                        </tr>


                    {% endfor %}
                    </table>
                {% endif %}

            {%  endblock %}
        </div>
    </div>
    <script>

    {% if current is not defined %}
        parent.nino_Popup.setValue({id:false,name:false});
    {% endif %}

    </script>

{%  endblock %}