radiantrh/Vue/Accueil/index.php
2025-12-31 09:24:00 +00:00

196 lines
10 KiB
PHP

<div class="container text-primary">
<h1><i class="fas fa-tachometer-alt"></i> <?= _('Tableau de bord') ?></h1>
<!-- KPIs -->
<div class="kpis">
<div class="card">
<h3><?= _('Total Contrats')?></h3>
<div class="value"><?= number_format($kpis["nbPolice"]) ?></div>
</div>
<div class="card">
<h3><?= _('Total Assurés')?></h3>
<div class="sub-values">
<div class="sub-item">
<span><?= _('Adhérents') ?> :</span>
<strong><?= format_N($kpis["nbAdherent"]) ?></strong>
</div>
<div class="sub-item">
<span><?= _('Ayants droits') ?> :</span>
<strong><?= format_N($kpis["nbDependant"]) ?></strong>
</div>
</div>
</div>
<div class="card">
<h3><?= _('Primes')?></h3>
<div class="sub-values">
<div class="sub-item">
<span><?= _('Statistique') ?> :</span>
<strong class="text-success"><?= format_N($kpis["primeNetteStat"]).' '.$_SESSION['devise_C'] ?></strong>
</div>
<div class="sub-item">
<span><?= _('TTC') ?> :</span>
<strong><?= format_N($kpis["primeTtc"]).' '.$_SESSION['devise_C'] ?></strong>
</div>
</div>
</div>
<div class="card">
<h3><?= _('Sinistres')?></h3>
<div class="sub-values">
<div class="sub-item">
<span><?= _('Montant') ?> :</span>
<strong class="text-danger"><?= format_N($kpis["montantApayer"]).' '.$_SESSION['devise_C'] ?></strong>
</div>
<div class="sub-item">
<span><?= _('Rapport S/P') ?> :</span>
<?php if($kpis["rapportSp"] > 65 && $kpis["rapportSp"] <= 80):?>
<strong class="text-warning"><?= $kpis["rapportSp"].'%' ?></strong>
<?php elseif($kpis["rapportSp"] > 80):?>
<strong class="text-danger"><?= $kpis["rapportSp"].'%' ?></strong>
<?php else:?>
<strong class="text-primary"><?= $kpis["rapportSp"].'%' ?></strong>
<?php endif;?>
</div>
</div>
</div>
</div>
<div class="grid-1">
<div class="card">
<section class="accordion-section">
<h2 class="accordion-header">
<i class="fas fa-file-contract text-primary"></i>
<span class="accordion-title"><?= _("Liste des contrats")?></span>
<i class="accordion-icon bi bi-chevron-down"></i>
</h2>
<div class="accordion-content">
<div class="table-responsive">
<table class="table table-striped table-bordered table-hover table-condensed tabliste compact w-100" style="font-size:10pt; white-space:nowrap;">
<thead>
<tr>
<th style="text-align:center"> <?= _("No Police") ?> </th>
<th style="text-align:center"> <?= _("ID Police") ?> </th>
<th style="text-align:center">Type</th>
<th style="text-align:center"> <?= _("Effet") ?> </th>
<th style="text-align:center"> <?= _("Échéance") ?> </th>
<th style="text-align:center"> <?= _("Type Avenant") ?> </th>
<th style="text-align:center"> <?= _("État") ?> </th>
<th style="text-align:center"> <?= _("Prime") ?> </th>
<th style="text-align:center"> <?= _("Sinistres") ?> </th>
<th style="text-align:center"> <?= _("R S/P") ?> </th>
<!-- Colonnes cachées pour recherche -->
<th data-hidden="true">NoPoliceHidden</th>
<th data-hidden="true">IdPoliceHidden</th>
</tr>
</thead>
<tbody>
<?php foreach ($polices as $police):
$id = $this->nettoyer($police['idPolice']);
$nopol = $this->nettoyer($police['numeroPolice']);
?>
<tr>
<!-- Boutons visibles -->
<td align="center">
<input type="button" class="form-control btn btn-primary" value="<?= $nopol ?>"
onClick="selectionner_police(<?= $id ?>,'<?= $nopol ?>');">
</td>
<td align="center">
<input type="button" class="form-control btn btn-info" value="<?= $id ?>"
onClick="selectionner_police(<?= $id ?>,'<?= $nopol ?>');">
</td>
<!-- Autres colonnes -->
<td align='center'><?= $this->nettoyer($police['typeContrat']) ?></td>
<td align='center'><?= dateLang($this->nettoyer($police['dateEffet']), $_SESSION['lang'])?></td>
<td align='center'><?= dateLang($this->nettoyer($police['dateEcheance']), $_SESSION['lang']) ?></td>
<td align='center'><?= $this->nettoyer($police['typeAvenant']) ?></td>
<td align='center'><?= $this->nettoyer($police['etatPolice']) ?></td>
<td align='center'><?= format_N($this->nettoyer($police['primeNetteStat'])) ?></td>
<td align='center'><?= format_N($this->nettoyer($police['montantApayer'])) ?></td>
<?php if($police["rapportSp"] > 65 && $police["rapportSp"] <= 80):?>
<td align='center' class="text-warning"><?= $police["rapportSp"].'%' ?></td>
<?php elseif($police["rapportSp"] > 80):?>
<td align='center' class="text-danger"><?= $police["rapportSp"].'%' ?></td>
<?php else:?>
<td align='center' class="text-primary"><?= $police["rapportSp"].'%' ?></td>
<?php endif;?>
<!-- Colonnes cachées -->
<td><?= $nopol ?></td>
<td><?= $id ?></td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
</div>
</section>
<section class="accordion-section">
<h2 class="accordion-header">
<i class="fas fa-chart-line text-primary"></i>
<span class="accordion-title"><?= _("Graphiques sinistres")?></span>
<i class="accordion-icon bi bi-chevron-down"></i>
</h2>
<div class="accordion-content">
<button id="graphiqueBtn" class="btn btn-primary" onclick="graphique_sinistre();">
<i class="fas fa-sync-alt me-2"></i> <?= _('Actualiser') ?>
</button>
<div id="div_graphique">
<canvas id="claimsChart"></canvas>
<canvas id="claimsMonthChart"></canvas>
<canvas id="lossRatioChart"></canvas>
</div>
</div>
</section>
</div>
</div>
</div>
<!-- ======================================================= -->
<!-- CHARGEMENT DES LIBRAIRIES GRAPHIQUES ET PDF ICI -->
<!-- Pour éviter de les recharger à chaque appel Ajax -->
<!-- ======================================================= -->
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.1/dist/chart.umd.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
// Laisser Bootstrap gérer les accordéons - suppression du script conflictuel
// Bootstrap s'occupe déjà du fonctionnement des accordéons
// Si vous voulez garder votre système personnalisé pour les grandes sections,
// assurez-vous qu'il ne cible pas les mêmes éléments que Bootstrap
const sectionHeaders = document.querySelectorAll('.accordion-section .accordion-header');
sectionHeaders.forEach(header => {
header.addEventListener('click', function() {
// Vérifier si cet accordéon est géré par Bootstrap
if (!this.querySelector('[data-bs-toggle="collapse"]')) {
const content = this.nextElementSibling;
const isCurrentlyActive = this.classList.contains('active');
// Fermer toutes les sections d'abord
document.querySelectorAll('.accordion-section .accordion-content').forEach(content => {
content.style.display = 'none';
});
document.querySelectorAll('.accordion-section .accordion-header').forEach(header => {
header.classList.remove('active');
});
// Si la section n'était pas active, l'ouvrir
if (!isCurrentlyActive) {
this.classList.add('active');
content.style.display = 'block';
}
}
});
});
});
</script>