314 lines
18 KiB
PHP
314 lines
18 KiB
PHP
<?php
|
|
$this->titre = "INTER-SANTE - Ajout Adhérent";
|
|
$dateAvenant = $_SESSION['dateAvenant_C'];
|
|
?>
|
|
|
|
<div id="div_ajout_adherent" class="container-fluid py-2 animate__animated animate__fadeIn">
|
|
<h1 class="text-primary"><i class="fas fa-user-plus me-2"></i><?= _('Nouvel Adhérent') ?></h1>
|
|
|
|
<div class="card-header d-flex justify-content-between align-items-center py-1">
|
|
<h4 class="fw-bold text-secondary mb-0">
|
|
<?= _("POLICE") ?> : <span class="text-primary"><?= $_SESSION['numeroPolice_C'] ?></span>
|
|
</h4>
|
|
</div>
|
|
|
|
<form method="post" action="Creeradherent/ajouteradherent">
|
|
<input class="sr-only" type="text" id="idPolice" name="idPolice" value="<?= $_SESSION['idPolice_C'] ?>">
|
|
<input class="sr-only" type="text" id="numeroPolice" name="numeroPolice" value="<?= $_SESSION['numeroPolice_C'] ?>">
|
|
|
|
<div class="card shadow-sm border-0 mb-4">
|
|
<div class="card-header bg-light py-1 border-bottom-0">
|
|
<h6 class="mb-0 fw-bold text-secondary text-uppercase small">
|
|
<i class="fas fa-id-card me-2"></i><?= _("Informations Générales & Contrat") ?>
|
|
</h6>
|
|
</div>
|
|
<div class="card-body p-4">
|
|
<div class="row g-3">
|
|
<div class="col-md-6">
|
|
<label class="form-label fw-bold small text-uppercase">
|
|
<?= _("Collège") ?><span class="required-star">*</span>
|
|
</label>
|
|
<select class="form-select border-primary-subtle" id="idCollege" name="idCollege" required autofocus onChange="prorater_prime_adherent();">
|
|
<?php liste_options($college,""); ?>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label fw-bold small text-uppercase">
|
|
<?= _("Avenant") ?><span class="required-star">*</span>
|
|
</label>
|
|
<select class="form-select" id="idAvenant" name="idAvenant" required onChange="changer_avenant_incorporation();">
|
|
<?php liste_options($avenant,""); ?>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="col-md-6">
|
|
<label class="form-label fw-bold small text-uppercase">
|
|
<?= _("Nom de l'adhérent") ?><span class="required-star">*</span>
|
|
</label>
|
|
<input type="text" class="form-control text-uppercase fw-bold" id="nom" name="nom" required>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label fw-bold small text-uppercase">
|
|
<?= _("Prénoms") ?><span class="required-star">*</span>
|
|
</label>
|
|
<input type="text" class="form-control" id="prenoms" name="prenoms" required>
|
|
</div>
|
|
|
|
<div class="col-md-4">
|
|
<label class="form-label fw-bold small text-uppercase">
|
|
<?= _("Nature Pièce") ?><span class="required-star">*</span>
|
|
</label>
|
|
<select class="form-select" id="codeNaturePiece" name="codeNaturePiece" required onChange="controler_piece_beneficiaire();">
|
|
<?php liste_options($naturepiece,""); ?>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label fw-bold small text-uppercase">
|
|
<?= _("N° de Pièce") ?><span class="required-star">*</span>
|
|
</label>
|
|
<input type="text" class="form-control" id="numeroPiece" name="numeroPiece" onblur="controler_piece_beneficiaire();" required autocomplete="off">
|
|
</div>
|
|
<div class="col-md-4 d-flex align-items-end">
|
|
<div id="div_controle_piece" class="w-100"></div>
|
|
</div>
|
|
|
|
<div class="col-md-2">
|
|
<label class="form-label fw-bold small text-uppercase">
|
|
<?= _("Genre") ?><span class="required-star">*</span>
|
|
</label>
|
|
<select class="form-select" id="sexe" name="sexe" required>
|
|
<?php liste_options($sexe,""); ?>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<label class="form-label fw-bold small text-uppercase">
|
|
<?= _("Date de Naissance") ?><span class="required-star">*</span>
|
|
</label>
|
|
<div class="input-group">
|
|
<span class="input-group-text bg-white text-muted"><i class="fas fa-calendar-alt"></i></span>
|
|
<input type="text" class="form-control datepicker" id="dateNaissance" name="dateNaissance" required
|
|
onchange="controle_age($('#dateNaissance').datepicker('getDate'), 'A')">
|
|
</div>
|
|
</div>
|
|
<div class="col-md-2 text-center d-flex align-items-end justify-content-center pb-1">
|
|
<input type="text" id="agepersonne" name="agepersonne" class="form-control-plaintext text-danger fw-bold text-center border-bottom" value="Age : 0" disabled>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label class="form-label fw-bold small text-uppercase">
|
|
<?= _("Groupe Sanguin") ?><span class="required-star">*</span>
|
|
</label>
|
|
<select class="form-select" id="codeGroupeSanguin" name="codeGroupeSanguin" required>
|
|
<?php liste_options($groupesanguin,""); ?>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<label class="form-label fw-bold small text-uppercase">
|
|
<?= _("Situation Familiale") ?><span class="required-star">*</span>
|
|
</label>
|
|
<select class="form-select" id="codeSituationFamille" name="codeSituationFamille" required>
|
|
<?php liste_options($situationfamille,""); ?>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row g-4">
|
|
<div class="col-lg-8">
|
|
<div class="card shadow-sm border-0 h-100">
|
|
<div class="card-header bg-light py-3 border-bottom-0">
|
|
<h6 class="mb-0 fw-bold text-secondary text-uppercase small"><i class="fas fa-map-marker-alt me-2"></i><?= _("Localisation & Contact") ?></h6>
|
|
</div>
|
|
<div class="card-body p-4">
|
|
<div class="row g-3">
|
|
<div class="col-md-4">
|
|
<label class="form-label fw-bold small text-uppercase">
|
|
<?= _("Pays") ?><span class="required-star">*</span>
|
|
</label>
|
|
<select class="form-select" id="codePays" name="codePays" required onChange="ajaxListerVille();">
|
|
<?php liste_options($pays, $codePays); ?>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label fw-bold small text-uppercase">
|
|
<?= (isset($_SESSION['affichagedynamique']['Province'])) ? _($_SESSION['affichagedynamique']['Province']) : _("Province") ?><span class="required-star">*</span>
|
|
</label>
|
|
<div id="listeville">
|
|
<select class="form-select" id="codeVille" name="codeVille" required onChange="ajaxListerLocalite();">
|
|
<?php liste_options($ville, $codeVille); ?>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label fw-bold small text-uppercase">
|
|
<?= (isset($_SESSION['affichagedynamique']['Commune'])) ? _($_SESSION['affichagedynamique']['Commune']) : _("Commune") ?><span class="required-star">*</span>
|
|
</label>
|
|
<div id="listelocalite">
|
|
<select class="form-select" id="codeLocalite" name="codeLocalite" required>
|
|
<?php liste_options($localite, $codeLocalite); ?>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-12">
|
|
<label class="form-label fw-bold small text-uppercase"><?= _("Adresse Géographique") ?></label>
|
|
<input type="text" class="form-control" id="adresseGeo" name="adresseGeo">
|
|
</div>
|
|
|
|
<div class="col-md-6">
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<label class="form-label fw-bold small text-uppercase">
|
|
<?= _("Téléphone Portable") ?><span class="required-star">*</span>
|
|
</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)">
|
|
</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>
|
|
|
|
<div class="col-md-6">
|
|
<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="email" name="email" placeholder="exemple@mail.com">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-4">
|
|
<div class="card border-primary-subtle shadow-sm h-100">
|
|
<div class="card-header bg-office-primary-lighter py-3">
|
|
<h6 class="mb-0 fw-bold text-primary text-uppercase small"><i class="fas fa-check-double me-2"></i><?= _("Validation de l'adhésion") ?></h6>
|
|
</div>
|
|
<div class="card-body p-4 d-flex flex-column justify-content-between">
|
|
<div>
|
|
<div class="mb-3">
|
|
<label class="form-label fw-bold small text-uppercase">
|
|
<?= _("Date d'Entrée") ?><span class="required-star">*</span>
|
|
</label>
|
|
<div id="div_date_avenant">
|
|
<input type="text" class="form-control datepicker fw-bold text-uppercase" id="dateEntree" name="dateEntree"
|
|
value="<?= dateLang($_SESSION['dateAvenant_C'], $_SESSION['lang']) ?>" required onChange="prorater_prime_adherent();">
|
|
</div>
|
|
</div>
|
|
<div class="row g-2 mb-4">
|
|
<div class="col-7">
|
|
<label class="form-label fw-bold small text-uppercase">
|
|
<?= _("Prorata?") ?><span class="required-star">*</span>
|
|
</label>
|
|
<select class="form-select form-select-sm" id="prorata" name="prorata" required onChange="prorater_prime_adherent();">
|
|
<?php liste_options($ouinonprorata,"1",true); ?>
|
|
</select>
|
|
</div>
|
|
<div class="col-5">
|
|
<label class="form-label fw-bold small text-uppercase"><?= _("Enfants") ?></label>
|
|
<input class="form-control form-control-sm text-center fw-bold" type="number" id="nombreEnfants" name="nombreEnfants" min="0" max="10" value="0">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pt-3 border-top">
|
|
<button type="submit" class="btn btn-primary w-100 py-3 fw-bold shadow">
|
|
<i class="fas fa-save me-2"></i> <?= _("ENREGISTRER L'ADHÉRENT") ?>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="div_prime" class="mt-4 animate__animated animate__fadeInUp">
|
|
</div>
|
|
</form>
|
|
|
|
<?php if (isset($msgErreur)): ?>
|
|
<div class="alert alert-danger shadow-sm border-start border-4 border-danger mt-4 d-flex align-items-center animate__animated animate__shakeX" role="alert">
|
|
<i class="fas fa-exclamation-circle me-3 fa-2x"></i>
|
|
<div>
|
|
<strong class="d-block"><?= _("Erreur de saisie") ?></strong>
|
|
<?= $msgErreur ?>
|
|
</div>
|
|
</div>
|
|
<?php endif; ?>
|
|
</div>
|
|
|
|
<script>
|
|
const inputTel = document.getElementById('telephonePortable');
|
|
const checkIgnorer = document.getElementById('ignorerFormat');
|
|
const aideTel = document.getElementById('aideTelephone');
|
|
|
|
// Messages traduits pour le JS
|
|
const msgErreur = "<?= 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.'; ?>";
|
|
|
|
// Fonction pour gérer les messages d'erreur personnalisés
|
|
window.validerMessageTelephone = function(input) {
|
|
if (!checkIgnorer.checked) {
|
|
input.setCustomValidity(msgErreur);
|
|
} else {
|
|
input.setCustomValidity('');
|
|
}
|
|
};
|
|
|
|
// Écouteur sur la checkbox pour activer/désactiver les règles
|
|
checkIgnorer.addEventListener('change', function() {
|
|
if (this.checked) {
|
|
// On retire les contraintes
|
|
inputTel.removeAttribute('pattern');
|
|
inputTel.removeAttribute('title');
|
|
inputTel.setCustomValidity('');
|
|
inputTel.classList.remove('is-invalid');
|
|
aideTel.style.display = 'none'; // On cache l'aide du format requis
|
|
inputTel.placeholder = "<?= _('Entrez le numéro'); ?>";
|
|
} else {
|
|
// On remet les contraintes par défaut
|
|
inputTel.setAttribute('pattern', '^250[0-9]{9,}$');
|
|
inputTel.setAttribute('title', msgErreur);
|
|
aideTel.style.display = 'block';
|
|
inputTel.placeholder = "Ex:250700000001";
|
|
|
|
// On redéclenche la validation visuelle
|
|
inputTel.dispatchEvent(new Event('input'));
|
|
}
|
|
});
|
|
|
|
// Validation visuelle en temps réel (is-valid / is-invalid)
|
|
inputTel.addEventListener('input', function() {
|
|
if (checkIgnorer.checked) {
|
|
this.classList.remove('is-invalid');
|
|
this.classList.add('is-valid');
|
|
return;
|
|
}
|
|
|
|
const pattern = /^250[0-9]{9,}$/;
|
|
if (pattern.test(this.value)) {
|
|
this.classList.remove('is-invalid');
|
|
this.classList.add('is-valid');
|
|
} else {
|
|
this.classList.remove('is-valid');
|
|
this.classList.add('is-invalid');
|
|
}
|
|
});
|
|
</script>
|