<center>
    <h1>Fiche de frais</h1>
    <br>
    <p>Mois de
        <?= $dateHeader ?>
    </p>
</center>
<br>
<!-- 
    Liste des frais forfaitaires
 -->
<h3 class="fw-bold offset-1">Frais forfaitaires</h3>
<div class="col-11 d-flex mx-auto my-3">
    <table class="table table-striped-columns align-middle">
        <thead class="table-dark">
            <tr>
                <th scope="col">Intitulé</th>
                <th scope="col">Quantité</th>
                <th scope="col">Montant</th>
                <th scope="col">Total</th>
            </tr>
        </thead>
        <tbody class="table-group-divider border-secondary-subtle">
            <?php
            foreach ($listeFraisForfaitaire as $key => $value):
                ?>
                <tr>
                    <th scope="row">
                        <?= $value['fLibelle'] ?>
                    </th>
                    <td>
                        <input type="text" name="fraisForfait-<?= $value['fId'] ?>" class="form-control frsFrt"
                            id="<?= $key ?>" value="<?= $value['lfQuantite'] ?>">
                    </td>
                    <td id="mttFrs-<?= $key ?>" data-price="<?= $value['fMontant'] ?>">
                        <?= $value['fMontant'] ?> €
                    </td>
                    <td id="totalFrs-<?= $key ?>">
                        <?= $value['fTotal'] ?>€
                    </td>
                </tr>
                <?php
            endforeach;
            ?>
            <tr>
                <td colspan="3" class="border-0"></td>
                <td class="prixTotalFrsF table-primary"></td>
            </tr>
        </tbody>
    </table>
</div>
<span class="border-3 border-bottom border-black col-10 mx-auto my-5 d-flex"></span>

<!-- 
    Listes des frais Hors Forfaits
 -->
<h3 class="fw-bold offset-1">Hors forfait</h3>
<div class="col-11 d-flex mx-auto my-3">
    <table class="table table-striped-columns align-middle">
        <thead class="table-dark">
            <tr>
                <th>Date</th>
                <th>Libelle</th>
                <th>Montant</th>
                <th>Justificatif</th>
                <th>Valider</th>
            </tr>
        </thead>
        <tbody class="table-group-divider border-secondary-subtle fraisHFGroup">
            <?php
            foreach ($listeFraisHf as $key => $value):
                ?>
                <tr id="fraisHf-<?= $key ?>" class="fraisHF <?= $value['lhRefus'] == 1 ? 'table-danger' : '' ?>">
                    <th scope="row" id="dateFrsHF">
                        <?= $value['lhDate'] ?>
                    </th>
                    <td id="LibelleFrsHF">
                        <?= $value['lhLibelle'] ?>
                    </td>
                    <td id="MttFrsHF">
                        <?= $value['lhMontant'] ?> €
                    </td>
                    <td>
                        <?= $value['lhJustificatif'] == 1 ? 'ok' : 'non fournis' ?>
                    </td>
                    <td>
                        <?php
                        if ($_SESSION['typeU'] === 'comptable') { ?>
                            <button type="button" class="btn btn-outline-primary btnRefuseFraisHf" id="frsSup-<?= $key ?>">
                                Refuser
                            </button>
                        <?php } elseif ($_SESSION['typeU'] === 'visiteur') { ?>
                            <button type="button" class="btn btn-outline-primary btnSuprFraisHf" id="frsSup-<?= $key ?>">
                                Supprimer
                            </button>
                        <?php } ?>
                    </td>
                </tr>
                <?php
            endforeach;
            ?>
            <!-- 
                Formulaire d'ajout de frais HF
             -->
            <tr class="newFraisForm">
                <td>
                    <!-- Date form -->
                    <input name="dateHf" class="form-control" id="dateHf" type="date" min="<?= $dateFormHFMin ?>"
                        max="<?= $dateFormHFMax ?>">
                </td>
                <td><input type="text" name="libelleHf" id="libelleHf" class="form-control"
                        placeholder="saisir un titre"></td>
                <td><input type="text" name="mttHf" id="mttHf" class="form-control" placeholder="Saisir un Montant">
                </td>
                <td><input type="file" class="form-control"></td>
                <td><button type="button" class="btn btn-outline-primary validFraisHF">Valider</button></td>
            </tr>
            <tr>
                <td colspan="2" class="border-0"></td>
                <td class="table-primary" id="total-frais-HF">TOTAL: 0€</td> <!--COMPLETE HERE -->
            </tr>
        </tbody>
    </table>
</div>
<!-- <span class="border-3 border-bottom border-black col-10 mx-auto my-5 d-flex"></span> -->
<!-- TOTAL -->
<div style="position:fixed; bottom:5px; right:5px; margin:0; padding:5px 3px;">
    <button type="button" class="btn btn-primary" id="total-fiche">
        <strong>TOTAL : </strong>
        <?= $totalFraisFiche ?>
    </button>
</div>
<!-- 
<h3 class="fw-bold offset-1">Commentaire (facultatif)</h3>

<div class="col-8 d-flex mx-auto">
    <textarea name="commentaireFiche" id="commentaireFiche" class="form-control border-black"></textarea>
</div>
 -->
<div class="col-3 d-flex mx-auto my-5 justify-content-center">
    <button type="button" class="btn btn-outline-primary btn-lg">Envoyer la Fiche</button>
</div>
<script src="../include/newFiche.js"></script>