{% extends 'base.html.twig' %}

{% block title %}Ration · VetRation{% endblock %}

{% block body %}
    <nav aria-label="breadcrumb" class="mt-3">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ path('planRationnement_list') }}">Plans de rationnement</a></li>
            <li class="breadcrumb-item"><a href="{{ path('planRationnement_edit', {id: ration.planRationnement.id}) }}">{{ ration.planRationnement.nom }}</a></li>
            <li class="breadcrumb-item active" aria-current="page">
                {% if ration.id is not null %}
                    {{ ration.nom }}
                {% else %}
                    Nouvelle ration
                {% endif %}
            </li>
        </ol>
    </nav>
    <div class="h1">
        {% if ration.id is not null %}
            {{ ration.nom }}
        {% else %}
            Nouvelle ration
        {% endif %}
    </div>
    {% include "ration2018/tabs-ration.html.twig" %}
    <div class="p-3">
        {{ form_start(form) }}
            <div class="h2 mt-2">
                Liste des constituants
            </div>
            <ul class="list-group">
                {% if form.rationAliments is defined %}
                    {% for rationAliment in form.rationAliments %}
                        <li class="list-group-item">
                            <div class="row">
                                <div class="col-lg-8 col-12">
                                    <span id="idToToggle{{ rationAliment.vars.value.aliment.id }}" class="toggle-btn">+</span>{{ rationAliment.vars.value.aliment.libelle0 }} - {{ rationAliment.vars.value.aliment.libelle1 }}
                                </div>
                                <div class="col-lg-2 col-4 m-auto">
                                    {{ form_row(rationAliment.quantite) }}
                                </div>
                                <div class="col-lg-1 col-4 m-auto">
                                    {% if rationAliment.vars.value.aliment.type != 'Mineral' %}
                                        {{ form_row(rationAliment.isMB) }}
                                    {% endif %}
                                </div>
                                <div class="col-lg-1 col-4 m-auto">
                                    {% if rationAliment.vars.value.aliment.type == 'Fourrage' %}
                                        {{ form_row(rationAliment.isVolonte) }}
                                    {% endif %}
                                </div>
                                <div class="lineToToggleJS line-to-toggle ms-3 col-11 mb-3" data-id-to-toggle="idToToggle{{ rationAliment.vars.value.aliment.id }}">
                                    <div class="row p-2">
                                        <div class="col">
                                            Valeurs théoriques :
                                        </div>
                                    </div>
                                    <div class="row p-2">
                                        <div class="col">
                                            UFL : {{ rationAliment.vars.value.aliment.UFL|round(2) }}
                                        </div>
                                        <div class="col">
                                            UFV : {{ rationAliment.vars.value.aliment.UFV|round(2) }}
                                        </div>
                                        <div class="col">
                                            PDI : {{ rationAliment.vars.value.aliment.PDI|round(2) }}
                                        </div>
                                        <div class="col">
                                            BPR : {{ rationAliment.vars.value.aliment.BPR|round(2) }}
                                        </div>
                                    </div>
                                    <div class="row p-2">
                                        <div class="col">
                                            MS : {{ rationAliment.vars.value.aliment.MS|round(2) }}
                                        </div>
                                        <div class="col">
                                            CB : {{ rationAliment.vars.value.aliment.CB|round(2) }}
                                        </div>
                                        <div class="col">
                                            UEL : {{ rationAliment.vars.value.aliment.UEL|round(2) }}
                                        </div>
                                        <div class="col">
                                            UEB : {{ rationAliment.vars.value.aliment.UEB|round(2) }}
                                        </div>
                                    </div>
                                    <div class="row p-2">
                                        <div class="col">
                                            Ca : {{ rationAliment.vars.value.aliment.Ca|round(2) }}
                                        </div>
                                        <div class="col">
                                            Mg : {{ rationAliment.vars.value.aliment.Mg|round(2) }}
                                        </div>
                                        <div class="col">
                                            P : {{ rationAliment.vars.value.aliment.P|round(2) }}
                                        </div>
                                        <div class="col">
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </li>
                    {% endfor %}
                {% endif %}
                {% if form.rationMelanges is defined %}
                    {% for rationMelange in form.rationMelanges %}
                        <li class="list-group-item">
                            <div class="row">
                                <div class="col-lg-8 col-12">
                                    <span id="idToToggle{{ rationMelange.vars.value.melange.id }}" class="toggle-btn">+</span>Mélange - {{ rationMelange.vars.value.melange }}
                                </div>
                                <div class="col-lg-2 col-4 m-auto">
                                    {{ form_row(rationMelange.quantite) }}
                                </div>
                                <div class="col-lg-1 col-4 m-auto">
                                    {{ form_row(rationMelange.isMB) }}
                                </div>
                                <div class="col-lg-1 col-4 m-auto">
                                    {{ form_row(rationMelange.isVolonte) }}
                                </div>
                            </div>
                            <div class="lineToToggleJS line-to-toggle ms-3" data-id-to-toggle="idToToggle{{ rationMelange.vars.value.melange.id }}">
                                {% set quantiteTotale = 0 %}
                                {% set UFLTotale = 0 %}
                                {% set UFVTotale = 0 %}
                                {% set PDITotale = 0 %}
                                {% set BPRTotale = 0 %}
                                {% set MSTotale = 0 %}
                                {% set CBTotale = 0 %}
                                {% set UELTotale = 0 %}
                                {% set UEBTotale = 0 %}
                                {% set CaTotale = 0 %}
                                {% set MgTotale = 0 %}
                                {% set PTotale = 0 %}
                                {% for melangeAliment in rationMelange.vars.value.melange.melangeAliments %}
                                    {% set quantiteTotale = quantiteTotale + melangeAliment.quantite %}
                                    {% set UFLTotale = UFLTotale + (melangeAliment.quantite * melangeAliment.aliment.UFL) %}
                                    {% set UFVTotale = UFVTotale + (melangeAliment.quantite * melangeAliment.aliment.UFV) %}
                                    {% set PDITotale = PDITotale + (melangeAliment.quantite * melangeAliment.aliment.PDI) %}
                                    {% set BPRTotale = BPRTotale + (melangeAliment.quantite * melangeAliment.aliment.BPR) %}
                                    {% set MSTotale = MSTotale + (melangeAliment.quantite * melangeAliment.aliment.MS) %}
                                    {% set CBTotale = CBTotale + (melangeAliment.quantite * melangeAliment.aliment.CB) %}
                                    {% set UELTotale = UELTotale + (melangeAliment.quantite * melangeAliment.aliment.UEL) %}
                                    {% set UEBTotale = UEBTotale + (melangeAliment.quantite * melangeAliment.aliment.UEB) %}
                                    {% set CaTotale = CaTotale + (melangeAliment.quantite * melangeAliment.aliment.Ca) %}
                                    {% set MgTotale = MgTotale + (melangeAliment.quantite * melangeAliment.aliment.Mg) %}
                                    {% set PTotale = PTotale + (melangeAliment.quantite * melangeAliment.aliment.P) %}
                                {% endfor %}
                                {% if quantiteTotale > 0 %}
                                    {% set UFLMoyen = UFLTotale / quantiteTotale %}
                                    {% set UFVMoyen = UFVTotale / quantiteTotale %}
                                    {% set PDIMoyen = PDITotale / quantiteTotale %}
                                    {% set BPRMoyen = BPRTotale / quantiteTotale %}
                                    {% set MSMoyen = MSTotale / quantiteTotale %}
                                    {% set CBMoyen = CBTotale / quantiteTotale %}
                                    {% set UELMoyen = UELTotale / quantiteTotale %}
                                    {% set UEBMoyen = UEBTotale / quantiteTotale %}
                                    {% set CaMoyen = CaTotale / quantiteTotale %}
                                    {% set MgMoyen = MgTotale / quantiteTotale %}
                                    {% set PMoyen = PTotale / quantiteTotale %}
                                {% endif %}
                                <div class="row p-2">
                                    <div class="col">
                                        Moyenne pondérée des valeurs théoriques :
                                    </div>
                                </div>
                                <div class="row p-2">
                                    <div class="col">
                                        UFL : {% if UFLMoyen is defined %}{{ UFLMoyen|round(2) }}{% endif %}
                                    </div>
                                    <div class="col">
                                        UFV : {% if UFVMoyen is defined %}{{ UFVMoyen|round(2) }}{% endif %}
                                    </div>
                                    <div class="col">
                                        PDI : {% if PDIMoyen is defined %}{{ PDIMoyen|round(2) }}{% endif %}
                                    </div>
                                    <div class="col">
                                        BPR : {% if BPRMoyen is defined %}{{ BPRMoyen|round(2) }}{% endif %}
                                    </div>
                                </div>
                                <div class="row p-2">
                                    <div class="col">
                                        MS : {% if MSMoyen is defined %}{{ MSMoyen|round(2) }}{% endif %}
                                    </div>
                                    <div class="col">
                                        CB : {% if CBMoyen is defined %}{{ CBMoyen|round(2) }}{% endif %}
                                    </div>
                                    <div class="col">
                                        UEL : {% if UELMoyen is defined %}{{ UELMoyen|round(2) }}{% endif %}
                                    </div>
                                    <div class="col">
                                        UEB : {% if UEBMoyen is defined %}{{ UEBMoyen|round(2) }}{% endif %}
                                    </div>
                                </div>
                                <div class="row p-2">
                                    <div class="col">
                                        Ca : {% if CaMoyen is defined %}{{ CaMoyen|round(2) }}{% endif %}
                                    </div>
                                    <div class="col">
                                        Mg : {% if MgMoyen is defined %}{{ MgMoyen|round(2) }}{% endif %}
                                    </div>
                                    <div class="col">
                                        P : {% if PMoyen is defined %}{{ PMoyen|round(2) }}{% endif %}
                                    </div>
                                    <div class="col">
                                    </div>
                                </div>
                            </div>
                        </li>
                    {% endfor %}
                {% endif %}
            </ul>
            <div class="d-flex justify-content-between">
                <div class="col mt-3">
                    <input type="submit" class="btn btn-outline-dark ms-5" value="Valider" />
                </div>
                <div class="col mt-3">
                    <a href="{{ path('ration2018_print', {id: ration.id}) }}"><button type="button" class="btn btn-outline-dark float-end me-5">Imprimer</button></a>
                </div>
            </div>
        {{ form_end(form) }}
    </div>
    <div class="p-3">
        <div class="h2 mt-3">
            Résultats
        </div>
        <ul class="nav nav-tabs">
            <li class="nav-item">
                <a href="#" class="nav-link tabResultat active" id="equilibreRation">Equilibre de la ration</a>
            </li>
            <li class="nav-item">
                <a href="#" class="nav-link tabResultat" id="valeursAlimentaires">Valeurs alimentaires</a>
            </li>
            <li class="nav-item">
                <a href="#" class="nav-link tabResultat" id="sante">Santé</a>
            </li>
            <li class="nav-item">
                <a href="#" class="nav-link tabResultat" id="energie">Energie</a>
            </li>
            <li class="nav-item">
                <a href="#" class="nav-link tabResultat" id="azote">Azote</a>
            </li>
            <li class="nav-item">
                <a href="#" class="nav-link tabResultat" id="fibre">Fibre</a>
            </li>
            <li class="nav-item">
                <a href="#" class="nav-link tabResultat" id="mineraux">Minéraux</a>
            </li>
            <li class="nav-item">
                <a href="#" class="nav-link tabResultat" id="matiereGrasse">Matière grasse</a>
            </li>
            <li class="nav-item">
                <a href="#" class="nav-link tabResultat" id="acideAmines">Acides aminés</a>
            </li>
        </ul>
        <div id="equilibreRationDiv">
            <div class="row">
                <div class="col-lg-4 col-12">
                    UFL = <span class="{{ apportUFL.couleur }}">{{ apportUFL.valeur|round(apportUFL.precisionUFL) }}</span>
                </div>
                <div class="col-lg-4 col-12">
                    Besoin UFL = {{ besoinUFL.valeur|round(apportUFL.precisionUFL) }}
                </div>
                <div class="col-lg-4 col-12">
                    UFL = <span class="{{ apportUFLParKgMS.couleur }}">{{ apportUFLParKgMS.valeur|round(1) }}</span> /kg MS
                </div>
            </div>
            <div class="row">
                <div class="col-lg-4 col-12">
                    UEL = <span class="{{ apportUEL.couleur }}">{{ apportUEL.valeur|round(1) }}
                </div>
                <div class="col-lg-4 col-12">
                    Capacité d'ingestion = {{ capaciteIngestion.valeur|round(1) }}
                </div>
                <div class="col-lg-4 col-12">
                </div>
            </div>
            <div class="row">
                <div class="col-lg-4 col-12">
                    Apport en PDI = <span class="{{ apportPDI.couleur }}">{{ apportPDI.valeur|round }}</span> g
                </div>
                <div class="col-lg-4 col-12">
                    Besoin PDI = {{ besoinPDI.valeur|round }} g
                </div>
                <div class="col-lg-4 col-12">
                    PDI = {{ apportPDIParKgMS.valeur|round(2) }} g/kg MS
                </div>
            </div>
            <div class="row mt-3">
                <div class="col">
                    dMO : <span>{{ dMO.valeur }} %</span>
                </div>
            </div>
            <div class="row">
                <div class="col">
                    BPR (0 - 3) = <span class="{{ BPR.couleur }}">{{ BPR.valeur|round(2) }}</span> g/kg MS
                </div>
            </div>
            <div class="row mt-3">
                <div class="col">
                    Lait permis (UFL et PDI) = <span class="{{ PL.couleur }}">{{ PL.valeur|round(2) }}</span> kg/j
                </div>
            </div>

            <div class="row mt-3">
                <div class="col">
                    Eau bue = {{ eauBue.valeur|round }} litres (dont {{ eauBueTH.valeur|round }} litres pour la thermoregulation)
                </div>
            </div>
            <div class="row mt-3">
                <div class="col">
                    Coût par animal = {{ coutParAnimal.valeur|round(2) }} € / jour
                </div>
            </div>
            <div class="row">
                <div class="col">
                    Coût pour l'effectif total = {{ coutParEffectifTotal.valeur|round(2) }} € / jour
                </div>
            </div>
            <div class="row">
                <div class="col">
                    Coût par 1000 litres de lait = {{ coutPar1000Lait.valeur|round(2) }} €
                </div>
            </div>
            <div class="row mt-3">
                <div class="col">
                    Taux de substitution global fourrage-concentré = {{ Sg.valeur|round(2) }}
                </div>
            </div>
            <div class="row">
                <div class="col">
                    bVEc = {{ bVEc.valeur|round(2) }}
                </div>
            </div>
        </div>
        <div id="valeursAlimentairesDiv" style="display: none;">
            <table class="table table-striped">
                <thead>
                    <tr>
                    <th style="">Valeurs alimentaires dans la ration</th>
                    <th class="" style="border-radius: 0; text-align: center;">UFL</th>
                    <th class="" style=" text-align: center;">PDI</th>
                    <th class="" style=" text-align: center;">dMO</th>
                    <th class="" style=" text-align: center;">BPR</th>
                    </tr>
                </thead>
                <tbody>
                    {% for listeValeursAlimentairesAliment in listeValeursAlimentairesAliments %}
                        <tr class="">
                            <td style="">{{ listeValeursAlimentairesAliment.nom }}</td>
                            <td style=" text-align: center;">{{ listeValeursAlimentairesAliment.UFL|round(2) }} /kg MS</td>
                            <td style=" text-align: center;">{{ listeValeursAlimentairesAliment.PDI|round }} g/kg MS</td>
                            <td style=" text-align: center;">{{ listeValeursAlimentairesAliment.dMO }} %</td>
                            <td style=" text-align: center;">{{ listeValeursAlimentairesAliment.BPR|round }} g/kg MS</td>
                        </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
        <div id="santeDiv" style="display: none;">
            <div class="row">
                <div class="col">
                    Bilan electrolytique (250 - 200) = <span class="{{ BE.couleur }}">{{ BE.valeur|round }}</span> mEq/kg MS
                </div>
            </div>
            <div class="row">
                <div class="col">
                    MO dégradable du concentré (250 - 300) = <span class="{{ apportConcentreMOD.couleur }}">{{ apportConcentreMOD.valeur|round }}</span> g/kg MS
                </div>
            </div>
            <div class="row">
                <div class="col">
                    Amidon digestible dans le rumen (200 - 250) = <span class="{{ AmiD_ru.couleur }}">{{ AmiD_ru.valeur|round }}</span> g/kg MS
                </div>
            </div>
            <div class="row">
                <div class="col">
                    Proportion de concentré (40 - 50) = <span class="{{ PCO.couleur }}">{{ PCO.valeur|round }}</span> % MS
                </div>
            </div>
            <div class="row">
                <div class="col">
                    Apport en NDF des fourrages (300 - 250) = <span class="{{ apportNDFf.couleur }}">{{ apportNDFf.valeur|round }}</span> g/kg MS
                </div>
            </div>
            <div class="row">
                <div class="col">
                    Apport en NDF (350 - 300) = <span class="{{ apportNDF.couleur }}">{{ apportNDF.valeur|round }}</span> g/kg MS
                </div>
            </div>
            <div class="row mt-3">
                <div class="col">
                    Indice de risque d'acidose (0,8 - 1,2) = <span class="{{ IRA.couleur }}">{{ IRA.valeur|round(2) }}</span>
                </div>
            </div>
            <div class="row mt-3">
                <div class="col">
                    Prévision de pH ruminal (6,2) = <span class="{{ impactHP.couleur }}">{{ impactHP.valeur|round(2) }}</span>
                </div>
            </div>
        </div>
        <div id="energieDiv" style="display: none;">
            <div class="row">
                <div class="col-lg-4 col-12">
                    UFL = <span class="{{ apportUFL.couleur }}">{{ apportUFL.valeur|round(apportUFL.precisionUFL) }}</span>
                </div>
                <div class="col-lg-4 col-12">
                    Besoin UFL = {{ besoinUFL.valeur|round(apportUFL.precisionUFL) }}
                </div>
                <div class="col-lg-4 col-12">
                    UFL = <span class="{{ apportUFLParKgMS.couleur }}">{{ apportUFLParKgMS.valeur|round(1) }}</span> /kg MS
                </div>
            </div>
            <div class="row mt-3">
                <div class="col">
                    Bilan UFL = {{ bilUFL.valeur|round(2) }}
                </div>
            </div>
            <div class="row mt-3">
                <div class="col">
                    Lait permis par les UFL = <span class="{{ laitPermisParUFL.couleur }}">{{ laitPermisParUFL.valeur|round(2) }}</span> kg/j
                </div>
            </div>
            <div class="row">
                <div class="col-3">
                    CH4 produit = {{ productionCH4.valeur|round }} g/j
                </div>
            </div>
        </div>

        <div id="azoteDiv" style="display: none;">
            <div class="row">
                <div class="col-lg-3 col-6">
                    Apport en PDI = <span class="{{ apportPDI.couleur }}">{{ apportPDI.valeur|round }}</span> g
                </div>
                <div class="col-lg-3 col-6">
                    Besoin PDI = {{ besoinPDI.valeur|round }} g
                </div>
                <div class="col-lg-3 col-6">
                    PDI = {{ apportPDIParKgMS.valeur|round(2) }} g/kg MS
                </div>
                <div class="col-lg-3 col-6">
                    Efficacité des PDI = {{ pourcentageEffPDI.valeur|round }} %
                    {% if ration.categorieAnimal == 'vacheLaitiere' %}
                        <br/>
                        [EffPDI Lys/Met = {{ pourcentageEffPDI_LysMet.valeur|round }} % et EffPDI PDI/MS = {{ pourcentageEffPDI_PDIMS.valeur|round }} %]
                    {% endif %}
                </div>
            </div>
            <div class="row">
                <div class="col">
                    BPR (0 - 3) = <span class="{{ BPR.couleur }}">{{ BPR.valeur|round(2) }}</span> g/kg MS
                </div>
            </div>
            <div class="row mt-3">
                <div class="col">
                    Lait permis par les PDI = <span class="{{ laitPermisParPDI.couleur }}">{{ laitPermisParPDI.valeur|round(2) }}</span> kg/j
                </div>
            </div>
            <div class="row mt-3">
                <div class="col">
                    Azote urinaire = {{ azoteUrinaire.valeur|round }} g/j
                </div>
            </div>
            <div class="row">
                <div class="col">
                    Azote fecale = {{ azoteFecale.valeur|round }} g/j
                </div>
            </div>
        </div>
        <div id="fibreDiv" style="display: none;">
            <div class="row">
                <div class="col">
                    Apport en MS = {{ apportMS.valeur|round(2) }} kg
                </div>
            </div>
            <div class="row">
                <div class="col">
                    Apport en CB = <span class="{{ apportCBParKgMS.couleur }}">{{ apportCBParKgMS.valeur|round }}</span> g/kg MS
                </div>
            </div>
            <div class="row">
                <div class="col">
                    Apport en ADF = {{ apportADFParKgMS.valeur|round }} g/kg MS
                </div>
            </div>
            <div class="row">
                <div class="col">
                    Apport en NDF = {{ apportNDFParKgMS.valeur|round }} g/kg MS
                </div>
            </div>
            <div class="row">
                <div class="col">
                    Apport en NDF des fourrages (300 - 250) = <span class="{{ apportNDFf.couleur }}">{{ apportNDFf.valeur|round }}</span> g/kg MS
                </div>
            </div>
            <div class="row">
                <div class="col">
                    Apport en NDF (350 - 300) = <span class="{{ apportNDF.couleur }}">{{ apportNDF.valeur|round }}</span> g/kg MS
                </div>
            </div>
        </div>
        <div id="minerauxDiv" style="display: none;">
            <div class="row">
                <div class="col-lg-3 col-6">
                </div>
                <div class="col-lg-2 col-3">
                    Apport
                </div>
                <div class="col-lg-2 col-3">
                    Besoin
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-6">
                    Calcium abs
                </div>
                <div class="col-lg-2 col-3">
                    <span class="{{ apportCaabs.couleur }}">{{ apportCaabs.valeur|round }} g/j</span> ({{ apportCa.valeur|round }} g/j brut)
                </div>
                <div class="col-lg-2 col-3">
                    {{ besoinCaabs.valeur|round }} g/j
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-6">
                    Phosphore abs
                </div>
                <div class="col-lg-2 col-3">
                    <span class="{{ apportPabs.couleur }}">{{ apportPabs.valeur|round }} g/j</span> ({{ apportP.valeur|round }} g/j brut)
                </div>
                <div class="col-lg-2 col-3">
                    {{ besoinPabs.valeur|round }} g/j
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-6">
                    Magnésium abs
                </div>
                <div class="col-lg-2 col-3">
                    <span class="{{ apportMgabs.couleur }}">{{ apportMgabs.valeur|round }} g/j</span> ({{ apportMg.valeur|round }} g/j brut)
                </div>
                <div class="col-lg-2 col-3">
                    {{ besoinMgabs.valeur|round }} g/j
                </div>
            </div>
            <div class="row mt-3">
                <div class="col">
                    BACA = {{ BACA.valeur|round }} mEq/kg MS
                </div>
            </div>
            <div class="row">
                <div class="col">
                    Bilan electrolytique (250 - 200) = <span class="{{ BE.couleur }}">{{ BE.valeur|round }}</span> mEq/kg MS
                </div>
            </div>
            <div class="row mt-3">
                <div class="col-lg-3 col-6">
                    Sodium
                </div>
                <div class="col-lg-2 col-3">
                    {{ apportNa.valeur|round }} g/j
                </div>
                <div class="col-lg-2 col-3">
                    {{ besoinNa.valeur|round }} g/j
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-6">
                    Chlore
                </div>
                <div class="col-lg-2 col-3">
                    {{ apportCl.valeur|round }} g/j
                </div>
                <div class="col-lg-2 col-3">
                    {{ besoinCl.valeur|round }} g/j
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-6">
                    Potassium
                </div>
                <div class="col-lg-2 col-3">
                    {{ apportK.valeur|round }} g/j
                </div>
                <div class="col-lg-2 col-3">
                    {{ besoinK.valeur|round }} g/j
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-6">
                    Soufre
                </div>
                <div class="col-lg-2 col-3">
                    {{ apportS.valeur|round }} g/j
                </div>
                <div class="col-lg-2 col-3">
                    {{ besoinS.valeur|round }} g/j
                </div>
            </div>
            <div class="row mt-3">
                <div class="col-lg-3 col-6">
                    Cobalt
                </div>
                <div class="col-lg-2 col-3">
                    <span class="{{ apportCo.couleur }}">{{ apportCo.valeur|round }} mg/j</span>
                </div>
                <div class="col-lg-2 col-3">
                    {{ besoinCo.valeur|round }} mg/j
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-6">
                    Selenium
                </div>
                <div class="col-lg-2 col-3">
                    <span class="{{ apportSe.couleur }}">{{ apportSe.valeur|round }} mg/j</span>
                </div>
                <div class="col-lg-2 col-3">
                    {{ besoinSe.valeur|round }} mg/j
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-6">
                    Zinc
                </div>
                <div class="col-lg-2 col-3">
                    <span class="{{ apportZn.couleur }}">{{ apportZn.valeur|round }} mg/j</span>
                </div>
                <div class="col-lg-2 col-3">
                    {{ besoinZn.valeur|round }} mg/j
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-6">
                    Manganèse
                </div>
                <div class="col-lg-2 col-3">
                    <span class="{{ apportMn.couleur }}">{{ apportMn.valeur|round }} mg/j</span>
                </div>
                <div class="col-lg-2 col-3">
                    {{ besoinMn.valeur|round }} mg/j
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-6">
                    Cuivre
                </div>
                <div class="col-lg-2 col-3">
                    <span class="{{ apportCu.couleur }}">{{ apportCu.valeur|round }} mg/j</span>
                </div>
                <div class="col-lg-2 col-3">
                    {{ besoinCu.valeur|round }} mg/j
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-6">
                    Iode
                </div>
                <div class="col-lg-2 col-3">
                    <span class="{{ apportI.couleur }}">{{ apportI.valeur|round }} mg/j</span>
                </div>
                <div class="col-lg-2 col-3">
                    {{ besoinI.valeur|round }} mg/j
                </div>
            </div>
            <div class="row mt-3">
                <div class="col-lg-3 col-6">
                    Vitamine A
                </div>
                <div class="col-lg-2 col-3">
                    <span class="{{ apportVitA.couleur }}">{{ apportVitA.valeur|round }} UI/j</span>
                </div>
                <div class="col-lg-2 col-3">
                    {{ besoinVitA.valeur|round }} UI/j
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-6">
                    Vitamine D
                </div>
                <div class="col-lg-2 col-3">
                    <span class="{{ apportVitD.couleur }}">{{ apportVitD.valeur|round }} UI/j</span>
                </div>
                <div class="col-lg-2 col-3">
                    {{ besoinVitD.valeur|round }} UI/j
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-6">
                    Vitamine E
                </div>
                <div class="col-lg-2 col-3">
                    <span class="{{ apportVitE.couleur }}">{{ apportVitE.valeur|round }} UI/j</span>
                </div>
                <div class="col-lg-2 col-3">
                    {{ besoinVitE.valeur|round }} UI/j
                </div>
            </div>
        </div>
        <div id="matiereGrasseDiv" style="display: none;">
            <div class="row mt-3">
                <div class="col">
                    Production AGV totale dans le rumen = {{ ProdAGVTjour.valeur|round(2) }} mol/j
                </div>
            </div>
            <div class="row">
                <div class="col">
                    Acide acétique = {{ pourcentageAcetate.valeur|round }} mol/100 mol AGV
                </div>
            </div>
            <div class="row">
                <div class="col">
                    Acide propionique = {{ pourcentagePropionate.valeur|round }} mol/100 mol AGV
                </div>
            </div>
            <div class="row">
                <div class="col">
                    Acide butyrique = {{ pourcentageButyrate.valeur|round }} mol/100 mol AGV
                </div>
            </div>
        </div>
        <div id="acideAminesDiv" style="display: none;">
        </div>
    </div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script>
        // Sélectionner toutes les checkboxes qui ont un id se terminant par 'isVolonte'
        const volonteCheckboxes = document.querySelectorAll('input[type="checkbox"][id$="isVolonte"]');
    
        volonteCheckboxes.forEach(function(checkbox) {
            // Ajouter un écouteur d'événements 'change' à chaque checkbox
            checkbox.addEventListener('change', function() {
                // Si cette checkbox est cochée
                if (this.checked) {
                    // Parcourir toutes les autres checkboxes et les décocher
                    volonteCheckboxes.forEach(function(otherCheckbox) {
                        if (otherCheckbox !== checkbox) { // Ignorer la checkbox actuellement modifiée
                            otherCheckbox.checked = false;
                        }
                    });
                }
            });
        });
        const tabResultat = document.querySelectorAll('.tabResultat');

        tabResultat.forEach(function(tab) {
            tab.addEventListener('click', function() {
                tabResultat.forEach(function(otherTab) {
                    otherTab.classList.remove('active');
                });
                tab.classList.add('active');
                const divId = tab.id + 'Div';
                const divs = document.querySelectorAll('div[id$="Div"]');
                divs.forEach(function(div) {
                    div.style.display = 'none';
                });
                document.getElementById(divId).style.display = 'block';
            });
        });
    </script>
{% endblock %}