radiantrh/Vue/Ficheretrait/index.php

<?php 
    $this->titre = "INTER-SANTE - Récap résiliation"; 
    $nbFactAntiDate = $this->nettoyer($avenant['nbFactAntiDate']);
?>

<input type="hidden" id="tauxRistourne" name="tauxRistourne" value="<?= $this->nettoyer($avenant['tauxRistourne']) ?>">
<button id="btn_pop" name="btn_pop" type="button" class="visually-hidden" data-bs-toggle="modal" data-bs-target="#popdetailassure"></button>

<div id="div_liste" class="container-fluid py-4 animate__animated animate__fadeIn">
    
    <div class="d-flex align-items-center mb-4">
        <div class="bg-primary text-white p-3 rounded-3 shadow-sm me-3">
            <i class="fas fa-file-contract fa-2x"></i>
        </div>
        <div>
            <h1 class="mb-0 fw-bold text-uppercase text-primary"><?= _("Récapitulatif Retrait Assurés") ?></h1>
            <p class="text-muted mb-0"><?= _("Police N°") ?> <span class="badge bg-dark fs-6"><?= $this->nettoyer($_SESSION['numeroPolice_C']) ?></span></p>
        </div>
    </div>

    <div class="row g-4 mb-4">
        <div class="col-md-6">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-header bg-primary bg-opacity-10 border-0 py-3">
                    <h6 class="card-title mb-0 fw-bold text-primary"><i class="fas fa-shield-alt me-2"></i><?= _("Informations Police") ?></h6>
                </div>
                <div class="card-body">
                    <div class="row text-center">
                        <div class="col-4 border-end">
                            <label class="small text-muted d-block"><?= _("Effet") ?></label>
                            <span class="fw-bold"><?= dateLang($this->nettoyer($emission['dateEffet']), $_SESSION['lang']) ?></span>
                        </div>
                        <div class="col-4 border-end">
                            <label class="small text-muted d-block"><?= _("Échéance") ?></label>
                            <span class="fw-bold"><?= dateLang($this->nettoyer($emission['dateEcheance']), $_SESSION['lang']) ?></span>
                        </div>
                        <div class="col-4">
                            <label class="small text-muted d-block"><?= _("Durée") ?></label>
                            <span class="badge bg-primary"><?= $this->nettoyer($emission['dureePolice']) ?> <?= _("Jours") ?></span>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-6">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-header bg-warning bg-opacity-10 border-0 py-3">
                    <h6 class="card-title mb-0 fw-bold text-warning"><i class="fas fa-calendar-check me-2"></i><?= _("Informations Avenant") ?></h6>
                </div>
                <div class="card-body">
                    <div class="row text-center">
                        <div class="col-4 border-end">
                            <label class="small text-muted d-block"><?= _("Effet") ?></label>
                            <span class="fw-bold text-warning"><?= dateLang($this->nettoyer($avenant['dateEffet']), $_SESSION['lang']) ?></span>
                        </div>
                        <div class="col-4 border-end">
                            <label class="small text-muted d-block"><?= _("Échéance") ?></label>
                            <span class="fw-bold text-warning"><?= dateLang($this->nettoyer($avenant['dateEcheance']), $_SESSION['lang']) ?></span>
                        </div>
                        <div class="col-4">
                            <label class="small text-muted d-block"><?= _("Durée") ?></label>
                            <span class="badge bg-warning text-dark"><?= $this->nettoyer($avenant['dureeAvenant']) ?> <?= _("Jours") ?></span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row g-3 mb-5 text-center">
        <div class="col-md-2-4 col-sm-6">
            <div class="p-3 bg-white rounded shadow-sm border-bottom border-4 border-primary h-100">
                <div class="text-muted small mb-1"><?= _("Primes Totales") ?></div>
                <div class="h5 fw-bold mb-0 text-primary"><?= format_N($this->nettoyer($sppolice['primestat'])) ?></div>
            </div>
        </div>
        <div class="col-md-2-4 col-sm-6">
            <div class="p-3 bg-white rounded shadow-sm border-bottom border-4 border-info h-100">
                <div class="text-muted small mb-1"><?= _("Primes Acquises") ?></div>
                <div class="h5 fw-bold mb-0 text-info"><?= format_N($this->nettoyer($sppolice['prime_acquise'])) ?></div>
            </div>
        </div>
        <div class="col-md-2-4 col-sm-6">
            <div class="p-3 bg-white rounded shadow-sm border-bottom border-4 border-danger h-100">
                <div class="text-muted small mb-1"><?= _("Consommations") ?></div>
                <div class="h5 fw-bold mb-0 text-danger"><?= format_N($this->nettoyer($sppolice['consommation'])) ?></div>
            </div>
        </div>
        <div class="col-md-2-4 col-sm-6">
            <div class="p-3 bg-white rounded shadow-sm border-bottom border-4 border-warning h-100">
                <div class="text-muted small mb-1"><?= _("Rapport S/P") ?></div>
                <div class="h5 fw-bold mb-0 text-warning"><?= $this->nettoyer($sppolice['rapportsp']) ?> %</div>
            </div>
        </div>
        <div class="col-md-2-4 col-sm-12">
            <div class="p-3 bg-dark rounded shadow-sm border-bottom border-4 border-success h-100">
                <div class="text-white-50 small mb-1 text-uppercase fw-bold"><?= _("Total Ristourne") ?></div>
                <div class="h4 fw-bold mb-0 text-success"><?= $this->nettoyer($sppolice['tauxRistourne']) ?></div>
            </div>
        </div>
    </div>

    <div class="d-flex align-items-center mb-3">
        <hr class="flex-grow-1">
        <span class="px-3 fw-bold text-muted text-uppercase small"><?= _("Détail des Primes à Ristourner") ?></span>
        <hr class="flex-grow-1">
    </div>

    <div id="div_assure_a_retirer" class="bg-white rounded shadow-sm p-3"> 
        <?php include 'Vue/Ajaxdetailretrait/index.php'; ?>
    </div>
</div>

<div class="modal fade" id="popdetailassure" tabindex="-1" role="dialog" data-bs-backdrop="static" data-bs-keyboard="false">
    <div class="modal-dialog modal-xl modal-dialog-centered shadow-lg"> <div class="modal-content border-0">
            <div class="modal-header bg-light">
                <h5 class="modal-title fw-bold">
                    <i class="fas fa-list-ul me-2 text-primary"></i><?= _("Détail du retrait") ?>
                </h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Fermer"></button>
            </div>
            <div class="modal-body p-0"> <div id="div_selection_assure" class="container-fluid py-3">
            </div>
            </div>
            <div class="modal-footer bg-light border-0">
                <button type="button" class="btn btn-secondary px-4 rounded-pill" data-bs-dismiss="modal"><?= _("Fermer") ?></button>
            </div>
        </div>
    </div>
</div>

<style>
    .col-md-2-4 { flex: 0 0 auto; width: 20%; }
    @media (max-width: 992px) { .col-md-2-4 { width: 50%; } }
    @media (max-width: 576px) { .col-md-2-4 { width: 100%; } }
    
    .shadow-sm { box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important; }
    .shadow-xs { box-shadow: 0 1px 2px rgba(0,0,0,0.05); }
    .min-vh-25 { min-height: 150px; }
</style>