This commit is contained in:
KONE SOREL 2026-03-31 17:14:38 +00:00
parent a9ae652fd5
commit b6294b21cc

View File

@ -157,199 +157,279 @@
</div>
</div>
<div class="card-body">
<!-- Photo et informations principales -->
<div class="row">
<!-- Photo -->
<div class="col-12 col-md-3 text-center mb-4">
<?php if ($beneficiaire['faceRegistered']=="1"): ?>
<img
src="<?=$photoAssureCrypte?>"
class="img-fluid rounded-circle shadow"
style="width: 120px; height: 120px; object-fit: cover; cursor:pointer;"
data-bs-toggle="modal"
data-bs-target="#pop_photo"
alt="Photo du bénéficiaire">
<?php else: ?>
<div class="bg-light rounded-circle d-flex align-items-center justify-content-center mx-auto mb-2"
style="width: 120px; height: 120px; border:1px solid #000 !important;">
<i class="fas fa-user fa-3x text-secondary photo-vide"></i>
</div>
<?php if ($faceRegistered!="1" && $_SESSION['assureAjoutPhoto']=="1"):
?>
<!-- Boutons radios - Version mobile first avec largeur réduite -->
<div class="card-body p-4">
<!-- ===== SECTION PRINCIPALE : Photo + Infos personnelles ===== -->
<div class="row g-4 align-items-start">
<!-- ── Photo / Avatar ── -->
<div class="col-12 col-md-3 text-center">
<?php if ($beneficiaire['faceRegistered'] == "1"): ?>
<!-- Photo enregistrée cliquable pour agrandissement -->
<img
src="<?= $photoAssureCrypte ?>"
class="rounded-circle shadow-sm object-fit-cover border border-2 border-primary-subtle"
style="width:120px; height:120px; cursor:pointer;"
data-bs-toggle="modal"
data-bs-target="#pop_photo"
alt="<?= _('Photo du bénéficiaire') ?>">
<?php else: ?>
<!-- Avatar vide -->
<div class="rounded-circle border d-flex align-items-center justify-content-center bg-light mx-auto mb-3"
style="width:120px; height:120px;">
<i class="fas fa-user fa-3x text-secondary photo-vide"></i>
</div>
<?php if ($faceRegistered != "1" && $_SESSION['assureAjoutPhoto'] == "1"): ?>
<!-- ── Choix du mode d'ajout de photo ── -->
<div class="mb-3">
<div class="d-grid gap-2 mx-auto" style="max-width: 400px;">
<div class="form-check form-check-card py-2 px-3 rounded border">
<input class="form-check-input" type="radio" name="photo_choice" id="prendre_photo_radio" value="" checked>
<label class="form-check-label w-100 d-block fw-medium" for="prendre_photo_radio">
<i class="fas fa-camera me-2 text-primary"></i><?= _("Prendre une photo") ?>
<!-- Boutons radio : Prendre / Choisir -->
<div class="d-grid gap-2 mx-auto" style="max-width:360px;">
<div class="form-check form-check-card border rounded px-3 py-2 text-start">
<input class="form-check-input"
type="radio"
name="photo_choice"
id="prendre_photo_radio"
value=""
checked>
<label class="form-check-label fw-medium w-100" for="prendre_photo_radio">
<i class="fas fa-camera me-2 text-primary"></i>
<?= _("Prendre une photo") ?>
</label>
</div>
<div class="form-check form-check-card py-2 px-3 rounded border">
<input class="form-check-input" type="radio" name="photo_choice" id="choisir_photo_radio" value="choisir">
<label class="form-check-label w-100 d-block fw-medium" for="choisir_photo_radio">
<i class="fas fa-folder-open me-2 text-primary"></i><?= _("Choisir une photo") ?>
<div class="form-check form-check-card border rounded px-3 py-2 text-start">
<input class="form-check-input"
type="radio"
name="photo_choice"
id="choisir_photo_radio"
value="choisir">
<label class="form-check-label fw-medium w-100" for="choisir_photo_radio">
<i class="fas fa-folder-open me-2 text-primary"></i>
<?= _("Choisir une photo") ?>
</label>
</div>
</div>
</div><!-- /d-grid -->
</div><!-- /mb-3 -->
<!-- ── Panneau : Prendre une photo (visible par défaut) ── -->
<div id="div_prendre_photo" class="mx-auto" style="max-width:360px;">
<!-- Bouton caché déclenché par JS pour ouvrir la modal de reconnaissance faciale -->
<button id="btn_pop_save_face"
name="btn_pop_save_face"
type="button"
class="sr-only visually-hidden"
data-bs-toggle="modal"
data-bs-target="#pop_rec_faciale">
</button>
<button type="button"
class="btn btn-primary w-100 py-3 fw-bold btn_autre"
onclick="javascript:ebene_init_photo_face();">
<i class="fas fa-camera me-2 fs-5"></i>
<?= _("Lancer l'appareil photo") ?>
</button>
</div>
<!-- Div pour "Prendre une photo" -->
<div id="div_prendre_photo" class="mt-2 mb-2">
<div class="mx-auto" style="max-width: 400px;">
<button class="sr-only" id="btn_pop_save_face" name="btn_pop_save_face" type="button" data-bs-toggle="modal" data-bs-target="#pop_rec_faciale"></button>
<button class="btn btn-primary w-100 py-3 fw-bold btn_autre" type="button" onClick="javascript:ebene_init_photo_face();">
<i class="fas fa-camera me-2 fs-5"></i><?= _("Lancer l'appareil photo") ?>
</button>
</div>
</div>
<!-- Div pour "Choisir une photo" -->
<div id="div_choisir_photo" class="d-none">
<div class="mx-auto" style="max-width: 400px;">
<div class="d-grid gap-2 mt-2 mb-2">
<form enctype="multipart/form-data" action="Fichebeneficiaire/<?= $_SESSION['idBeneficiaire_C'] ?>/" method="post">
<input class="form-control form-control-lg" name="fichier_upload" type="file" id="fichier_upload" accept="image/*" />
<button type="submit" name="submit" class="btn btn-success btn-lg w-100 py-3 btn_autre">
<i class="fas fa-upload me-2 fs-5"></i><?= _("Envoyer la photo") ?>
</button>
</form>
<!-- ── Panneau : Choisir une photo (masqué par défaut) ── -->
<div id="div_choisir_photo" class="d-none mx-auto" style="max-width:360px;">
<form enctype="multipart/form-data"
action="Fichebeneficiaire/<?= $_SESSION['idBeneficiaire_C'] ?>/"
method="post">
<div class="d-grid gap-2 mt-2">
<input class="form-control form-control-lg"
type="file"
name="fichier_upload"
id="fichier_upload"
accept="image/*">
<button type="submit"
name="submit"
class="btn btn-success btn-lg w-100 py-3 btn_autre">
<i class="fas fa-upload me-2 fs-5"></i>
<?= _("Envoyer la photo") ?>
</button>
</div>
<h4 style="text-align: center">
<?php if ($message>" "): ?>
<div class="col-12 alert alert-danger">
<?= $message ?>
</div>
<?php endif; ?>
</h4>
</div>
</div>
<?php endif;?>
<?php endif; ?>
</div>
<!-- Informations personnelles -->
<div class="col-12 col-md-9">
<div class="row">
<div class="col-12 mb-2">
<h3 class="text-primary mb-1"><?= $beneficiaire['nomBeneficiaire'] . ' ' . $beneficiaire['prenomsBeneficiaire'] ?></h3>
<p class="text-muted mb-0"><?= _("Né(e) le").": ".dateLang($this->nettoyer($beneficiaire['dateNaissance']))." => ".$this->nettoyer($beneficiaire['age'])." "._("an(s)") ?></p>
</div>
<div class="col-12 col-md-6">
<div class="mb-2">
<small class="text-muted"><?= _("N° Adhérent") ?></small>
<p class="fw-bold mb-0"><?= $beneficiaire['numeroAdherent'] ?></p>
</div>
<div class="mb-2">
<small class="text-muted"><?= _("Lien Parenté") ?></small>
<p class="fw-bold mb-0"><?= $lienparente ?></p>
</div>
</form>
<?php if ($message > " "): ?>
<div class="alert alert-danger mt-2 small" role="alert">
<?= $message ?>
</div>
<?php endif; ?>
</div><!-- /div_choisir_photo -->
<?php endif; ?>
<?php endif; ?>
</div><!-- /col Photo -->
<!-- ── Informations personnelles ── -->
<div class="col-12 col-md-9">
<div class="row g-3">
<!-- Nom complet + Date de naissance -->
<div class="col-12">
<h3 class="text-primary mb-1 fw-bold">
<?= $beneficiaire['nomBeneficiaire'] . ' ' . $beneficiaire['prenomsBeneficiaire'] ?>
</h3>
<p class="text-muted mb-0 small">
<i class="fas fa-birthday-cake me-1"></i>
<?= _("Né(e) le") . " : " . dateLang($this->nettoyer($beneficiaire['dateNaissance']))
. "" . $this->nettoyer($beneficiaire['age']) . " " . _("an(s)") ?>
</p>
</div>
<!-- Colonne gauche : Adhérent / Lien Parenté / Genre -->
<div class="col-12 col-sm-6">
<div class="mb-2">
<small class="text-muted"><?= _("Genre") ?></small>
<p class="fw-bold mb-0"><?= $sexe ?></p>
</div>
</div>
<div class="col-12 col-md-6">
<?php if($codeLienParente != "A"): ?>
<div class="mb-4">
<small class="text-muted"><?= _("Mobile") ?></small>
<p class="fw-bold mb-0"><?= $beneficiaire['telephonePortable'] ?></p>
</div>
<?php else : ?>
<div class="mb-4">
<div class="d-flex justify-content-between align-items-center">
<label class="form-label text-muted small">
<?= _("Mobile") ?>
</label>
<div class="form-check mb-1">
<input class="form-check-input" type="checkbox" id="ignorerFormat" name="ignorerFormat">
<label class="form-check-label small text-muted" for="ignorerFormat">
<?= est_anglophone() ? "Free format" : "Format libre"; ?>
</label>
</div>
</div>
<div class="input-group">
<span class="input-group-text bg-white text-muted"><i class="fas fa-mobile-alt"></i></span>
<input type="tel"
class="form-control"
id="telephonePortable"
name="telephonePortable"
placeholder="Ex:250700000001"
required
pattern="^250[0-9]{9,}$"
title="<?= est_anglophone() ? "The number must start with 250 and contain at least 12 digits." : "Le numéro doit commencer par 250 et comporter au moins 12 chiffres.";?>"
oninput="this.setCustomValidity('')"
oninvalid="validerMessageTelephone(this)"
onchange="javascript:maj_mobile_beneficiaire();"
value="<?= $beneficiaire['telephonePortable'] ?>">
</div>
<div id="aideTelephone" class="form-text text-muted small">
<i class="fas fa-info-circle"></i> <?= est_anglophone() ? 'Required format: 250XXXXXXXXX (min. 12 digits)' : 'Format requis : 250XXXXXXXXX (min. 12 chiffres)'; ?>
</div>
</div>
<?php endif; ?>
<div class="mb-1">
<?php if($codeLienParente != "A"): ?>
<div class="mb-1">
<small class="text-muted"><?= _("Email") ?></small>
<p class="fw-bold mb-0"><?= $beneficiaire['emailBeneficiaire'] ?></p>
</div>
<?php else : ?>
<div class="input-group">
<label class="form-label fw-bold small text-uppercase mb-1"><?= _("E-mail") ?></label>
<div class="input-group pt-1">
<span class="input-group-text bg-white text-muted"><i class="fas fa-envelope"></i></span>
<input type="email"
class="form-control"
id="emailBeneficiaire"
name="emailBeneficiaire"
placeholder="exemple@mail.com"
onchange="javascript:maj_mobile_beneficiaire();"
value="<?= $beneficiaire['emailBeneficiaire'] ?>">>
</div>
<?php endif; ?>
<small class="text-muted d-block"><?= _("N° Adhérent") ?></small>
<span class="fw-bold"><?= $beneficiaire['numeroAdherent'] ?></span>
</div>
<div class="mb-2">
<small class="text-muted"><?= _("État") ?></small>
<?php if ($estcouvert) : ?>
<span class="badge bg-success"><?= $etatbeneficiaire ?></span>
<?php else: ?>
<span class="badge bg-danger"><?= _("Non couvert") ?></span>
<?php endif; ?>
</div>
</div>
</div>
</div>
</div>
<hr>
<!-- Informations de police -->
<div class="row">
<div class="col-12 col-md-6">
<div class="mb-2">
<small class="text-muted"><?= _("Souscripteur") ?></small>
<p class="fw-bold mb-0"><?= $beneficiaire['nomClient'] ?></p>
</div>
</div>
<div class="col-12 col-md-6">
<div class="mb-2">
<small class="text-muted"><?= _("Collège / N° Police") ?></small>
<p class="fw-bold mb-0"><?= $beneficiaire['libelleCollege'] ?> / <?= $beneficiaire['numeroPolice'] ?></p>
</div>
</div>
</div>
</div>
<div class="mb-2">
<small class="text-muted d-block"><?= _("Lien Parenté") ?></small>
<span class="fw-bold"><?= $lienparente ?></span>
</div>
<div class="mb-2">
<small class="text-muted d-block"><?= _("Genre") ?></small>
<span class="fw-bold"><?= $sexe ?></span>
</div>
</div><!-- /col gauche -->
<!-- Colonne droite : Mobile / Email / État -->
<div class="col-12 col-sm-6">
<!-- Mobile -->
<div class="mb-2">
<?php if ($codeLienParente != "A"): ?>
<!-- Lecture seule pour les non-adhérents principaux -->
<small class="text-muted d-block"><?= _("Mobile") ?></small>
<span class="fw-bold"><?= $beneficiaire['telephonePortable'] ?></span>
<?php else: ?>
<!-- Champ éditable pour l'adhérent principal -->
<div class="d-flex justify-content-between align-items-center mb-1">
<label class="form-label small text-muted mb-0" for="telephonePortable">
<?= _("Mobile") ?>
</label>
<div class="form-check mb-0">
<input class="form-check-input"
type="checkbox"
id="ignorerFormat"
name="ignorerFormat">
<label class="form-check-label small text-muted" for="ignorerFormat">
<?= est_anglophone() ? "Free format" : "Format libre" ?>
</label>
</div>
</div>
<div class="input-group input-group-sm">
<span class="input-group-text bg-white text-muted">
<i class="fas fa-mobile-alt"></i>
</span>
<input type="tel"
class="form-control"
id="telephonePortable"
name="telephonePortable"
placeholder="Ex : 250700000001"
required
pattern="^250[0-9]{9,}$"
title="<?= est_anglophone()
? "The number must start with 250 and contain at least 12 digits."
: "Le numéro doit commencer par 250 et comporter au moins 12 chiffres." ?>"
oninput="this.setCustomValidity('')"
oninvalid="validerMessageTelephone(this)"
onchange="javascript:maj_mobile_beneficiaire();"
value="<?= $beneficiaire['telephonePortable'] ?>">
</div>
<div class="form-text text-muted small mt-1">
<i class="fas fa-info-circle me-1"></i>
<?= est_anglophone()
? "Required format: 250XXXXXXXXX (min. 12 digits)"
: "Format requis : 250XXXXXXXXX (min. 12 chiffres)" ?>
</div>
<?php endif; ?>
</div><!-- /Mobile -->
<!-- Email -->
<div class="mb-2">
<?php if ($codeLienParente != "A"): ?>
<!-- Lecture seule -->
<small class="text-muted d-block"><?= _("Email") ?></small>
<span class="fw-bold"><?= $beneficiaire['emailBeneficiaire'] ?></span>
<?php else: ?>
<!-- Champ éditable -->
<label class="form-label small text-muted mb-1" for="emailBeneficiaire">
<?= _("E-mail") ?>
</label>
<div class="input-group input-group-sm">
<span class="input-group-text bg-white text-muted">
<i class="fas fa-envelope"></i>
</span>
<input type="email"
class="form-control"
id="emailBeneficiaire"
name="emailBeneficiaire"
placeholder="exemple@mail.com"
onchange="javascript:maj_email_beneficiaire();"
value="<?= $beneficiaire['emailBeneficiaire'] ?>">
</div>
<?php endif; ?>
</div><!-- /Email -->
<!-- État / Couverture -->
<div class="mb-2">
<small class="text-muted d-block"><?= _("État") ?></small>
<?php if ($estcouvert): ?>
<span class="badge bg-success fs-6 px-3 py-1">
<i class="fas fa-check-circle me-1"></i><?= $etatbeneficiaire ?>
</span>
<?php else: ?>
<span class="badge bg-danger fs-6 px-3 py-1">
<i class="fas fa-times-circle me-1"></i><?= _("Non couvert") ?>
</span>
<?php endif; ?>
</div><!-- /État -->
</div><!-- /col droite -->
</div><!-- /row infos -->
</div><!-- /col Infos personnelles -->
</div><!-- /row principale -->
<hr class="my-4">
<!-- ===== SECTION : Informations de police ===== -->
<div class="row g-3">
<div class="col-12 col-sm-6">
<small class="text-muted d-block"><?= _("Souscripteur") ?></small>
<span class="fw-bold"><?= $beneficiaire['nomClient'] ?></span>
</div>
<div class="col-12 col-sm-6">
<small class="text-muted d-block"><?= _("Collège / N° Police") ?></small>
<span class="fw-bold">
<?= $beneficiaire['libelleCollege'] ?> / <?= $beneficiaire['numeroPolice'] ?>
</span>
</div>
</div><!-- /row police -->
</div><!-- /card-body -->
</div>
<!-- Section des plafonds et consommations -->