{% extends 'base.html.twig' %}
{% block title %}Consulter un cours!{% endblock %}
{% block stylesheets %}{% endblock %}
{% block header %}Mon superbe menu{% endblock %}
{% block body %}
<div class ="col-sm-12 col-xl-6 ">
    <div  class="container-fluid pt-4 px-4">
        <div class =" bg-secondary rounded h-100 p-4">
            <h6 class="mb-4">PAGE DE CONSULTATION D'UN INSTRUMENT</h6>

            <table class="table table-borderless">



    <tr><td>Nom : </td><td>{{instruments.nom}} </td></tr>

    <tr><td>N°Serie : </td><td>{{instruments.numSerie}} </td>
                <td rowspan="9" class="imgEtu">
                    {% set photo = 'img/instrument/' ~ instruments.cheminImage ~ '.jpg' %}
                    <span class="zoom"><img src="{{ asset(photo | trans )}}" title="{{ instruments.cheminImage }}" alt="{{ instruments.cheminImage }}" width="300" height="200"/></span>
                </td>
    </tr>
    <tr><td>Prix d'achat : </td><td>{{instruments.prixAchat}} € </td> </tr>

    <tr><td>Utilisation : </td><td>{{instruments.utilisation}} </td> </tr>
    <tr><td>Marque : </td><td>{{instruments.marque.libelle}} </td> </tr>
    <tr><td>Type : </td><td>{{instruments.typeInstrument.libelle}} </td> </tr>
    <tr><td>Couleur(s) : </td>
        <td>
            <ul>
                {% for couleur in instruments.couleur %}
                <li>{{ couleur.nom }} </li>
                {% endfor %}
            </ul>
        </td>

                <tr>
                    <th>Accessoire(s)</th>
                </tr>
        {% for accessoire in instruments.Accessoires %}
<tr>
                <td>{{ accessoire.libelle }}</td>
</tr>
        {% endfor %}

    <td>
            <form method="post" action="{{ path('instrumentModifier', {'id': instruments.id}) }}">
                <button type="submit" class="btn btn-outline-primary">Modifier</button>
            </form>
    </td>

    <td>
            <form method="post" action="{{ path('listerInstrument', {'id': instruments.id}) }}">
                 <button type="submit" class="btn btn-outline-primary">Liste des instruments</button>
            </form>
    </td>

            </table>


    <h5>Interventions:</h5>
    <div class="card-body pt-0">
        <div class="table-responsive">
            <table class="table mb-0 table-striped table-sm">
                <tr>
                    <th>Date de début :</th>
                    <th>Date de fin :</th>
                    <th>Description :</th>
                    <th>Prix :</th>
                </tr>
                {% for intervention in instruments.Interventions %}
                    <tr>
                        <td>{{ intervention.dateDebut|date("d/m/Y") }}</td>
                        <td>{{ intervention.dateFin|date("d/m/Y") }}</td>
                        <td>{{ intervention.descriptif }}</td>
                        <td>{{ intervention.prix }} €</td>
                    </tr>
                {% endfor %}
            </table>
        </div>
    </div>

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




            {% endblock %}
            {% block javascripts %}{% endblock %}