ebene/assure
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Version DeepSeek corrigée v1.8

Browse Source
This commit is contained in:
KONE SOREL 2025-12-13 16:21:47 +00:00
parent 06b67fd675
commit 2ac8f83bcb
1 changed files with 174 additions and 195 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

309
Vue/Ajaxconnexioncookie/french.php
View File

@ -72,7 +72,7 @@
<!-- Affichage mobile (cartes) --> <!-- Affichage mobile (cartes) -->
<div class="d-md-none"> <div class="d-md-none">
<!-- VERSION MOBILE AVEC IDs UNIQUES --> <!-- VERSION MOBILE FONCTIONNELLE -->
<span class="login100-form-title" style="font-family: Play-Bold; color:#e5e5e5; margin-top: 5px; margin-bottom:15px; display: block; text-align: center; font-size: 20px;"> <span class="login100-form-title" style="font-family: Play-Bold; color:#e5e5e5; margin-top: 5px; margin-bottom:15px; display: block; text-align: center; font-size: 20px;">
Portail Assuré Portail Assuré
@ -92,15 +92,15 @@
<?php if($maintenance!='1'): ?> <?php if($maintenance!='1'): ?>
<!-- CONTENEUR MOBILE - IDs AVEC SUFFIXE _mobile --> <!-- FORMULAIRE MOBILE AVEC ACTION EXPLICITE -->
<div style="width: 100%; max-width: 300px; margin: 0 auto;"> <form id="form_mobile" method="POST" action="" style="width: 100%; max-width: 300px; margin: 0 auto;">
<!-- Langue --> <!-- Langue -->
<div class="wrap-input100" style="margin-bottom: 15px; text-align: center;"> <div class="wrap-input100" style="margin-bottom: 15px; text-align: center;">
<label for="langue_mobile" style="font-size: 12pt; display: block; margin-bottom: 5px;">Langue</label> <label for="langue_mobile" style="font-size: 12pt; display: block; margin-bottom: 5px;">Langue</label>
<select class="form-select" id="langue_mobile" name="langue_mobile" <select class="form-select" id="langue_mobile" name="langue"
style="width: 100%; height: 40px; border: 2px solid #7D4FFE; border-radius: 9px; background: transparent; font-size: 14px; color: #7D4FFE; text-align: center; padding: 0 10px; box-sizing: border-box;" style="width: 100%; height: 40px; border: 2px solid #7D4FFE; border-radius: 9px; background: transparent; font-size: 14px; color: #7D4FFE; text-align: center; padding: 0 10px; box-sizing: border-box;"
required autocomplete="off" onchange="changerLangueMobile(this.value);"> required autocomplete="off">
<?php liste_options($langues, $_SESSION['lang'], true); ?> <?php liste_options($langues, $_SESSION['lang'], true); ?>
</select> </select>
</div> </div>
@ -109,10 +109,10 @@
<div class="wrap-input100" style="margin-bottom: 15px; text-align: center;"> <div class="wrap-input100" style="margin-bottom: 15px; text-align: center;">
<div class="wrap-input100 validate-input"> <div class="wrap-input100 validate-input">
<label for="codeSociete_mobile" style="font-size: 12pt; display: block; margin-bottom: 5px;">Entité</label> <label for="codeSociete_mobile" style="font-size: 12pt; display: block; margin-bottom: 5px;">Entité</label>
<input class="input100" type="text" name="codeSociete_mobile" id="codeSociete_mobile" value="<?= $codeSociete ?>" <input class="input100" type="text" name="codeSociete" id="codeSociete_mobile" value="<?= $codeSociete ?>"
placeholder="Entité" placeholder="Entité"
style="width: 100%; height: 40px; border: 2px solid #7D4FFE; border-radius: 9px; color: #7D4FFE; text-align: center; padding: 0 10px; box-sizing: border-box;" style="width: 100%; height: 40px; border: 2px solid #7D4FFE; border-radius: 9px; color: #7D4FFE; text-align: center; padding: 0 10px; box-sizing: border-box;"
required AUTOCOMPLETE="off" onChange="changerEntiteMobile(this.value);"> required AUTOCOMPLETE="off">
</div> </div>
</div> </div>
@ -120,7 +120,7 @@
<div id="div_login_portail_mobile" class="wrap-input100" style="margin-bottom: 15px; text-align: center;"> <div id="div_login_portail_mobile" class="wrap-input100" style="margin-bottom: 15px; text-align: center;">
<div class="wrap-input100 validate-input"> <div class="wrap-input100 validate-input">
<label for="login_mobile" style="font-size: 12pt; display: block; margin-bottom: 5px;">Identifiant</label> <label for="login_mobile" style="font-size: 12pt; display: block; margin-bottom: 5px;">Identifiant</label>
<input class="input100" type="text" name="login_mobile" id="login_mobile" value="<?= $codeUtilisateur ?>" <input class="input100" type="text" name="login" id="login_mobile" value="<?= $codeUtilisateur ?>"
placeholder="Identifiant" placeholder="Identifiant"
style="width: 100%; height: 40px; border: 2px solid #7D4FFE; border-radius: 9px; color: #7D4FFE; text-align: center; padding: 0 10px; box-sizing: border-box;" style="width: 100%; height: 40px; border: 2px solid #7D4FFE; border-radius: 9px; color: #7D4FFE; text-align: center; padding: 0 10px; box-sizing: border-box;"
required AUTOCOMPLETE="off"> required AUTOCOMPLETE="off">
@ -130,20 +130,23 @@
<!-- Mot de passe --> <!-- Mot de passe -->
<div class="wrap-input100 validate-input" style="margin-bottom: 20px; text-align: center;"> <div class="wrap-input100 validate-input" style="margin-bottom: 20px; text-align: center;">
<label for="mdp_mobile" style="font-size: 12pt; display: block; margin-bottom: 5px;">Mot de passe</label> <label for="mdp_mobile" style="font-size: 12pt; display: block; margin-bottom: 5px;">Mot de passe</label>
<input class="input100" type="password" name="mdp_mobile" id="mdp_mobile" placeholder="Mot de passe" <input class="input100" type="password" name="mdp" id="mdp_mobile" placeholder="Mot de passe"
style="width: 100%; height: 40px; border: 2px solid #7D4FFE; border-radius: 9px; color: #7D4FFE; text-align: center; padding: 0 10px; box-sizing: border-box;" style="width: 100%; height: 40px; border: 2px solid #7D4FFE; border-radius: 9px; color: #7D4FFE; text-align: center; padding: 0 10px; box-sizing: border-box;"
required AUTOCOMPLETE="off"> required AUTOCOMPLETE="off">
</div> </div>
<!-- Bouton Connexion --> <!-- Champ caché pour l'action -->
<input type="hidden" name="action" value="connexion">
<!-- Bouton Connexion - TYPE SUBMIT -->
<div class="container-login100-form-btn" style="margin-bottom: 20px; text-align: center;"> <div class="container-login100-form-btn" style="margin-bottom: 20px; text-align: center;">
<button type="button" name="btn_connexion_mobile" id="btn_connexion_mobile" class="btn login-btn" <button type="submit" name="btn_connexion" id="btn_connexion_mobile" class="btn login-btn"
style="width: 100%; height: 45px; background: #7D4FFE; color: white; font-size: 16px; font-weight: 700; border-radius: 9px; border: none;"> style="width: 100%; height: 45px; background: #7D4FFE; color: white; font-size: 16px; font-weight: 700; border-radius: 9px; border: none;">
Connexion Connexion
</button> </button>
</div> </div>
</div> </form>
<!-- Footer mobile --> <!-- Footer mobile -->
<div class="footer" style="position: relative; bottom: auto; left: auto; font-size: 11px; text-align: center; padding: 10px; width: 100%; margin-top: 10px;"> <div class="footer" style="position: relative; bottom: auto; left: auto; font-size: 11px; text-align: center; padding: 10px; width: 100%; margin-top: 10px;">
@ -153,208 +156,145 @@
<?php endif; ?> <?php endif; ?>
</div> </div>
<!-- STYLES POUR GÉRER L'AFFICHAGE DESKTOP/MOBILE --> <!-- STYLES ET SCRIPT SIMPLIFIÉS -->
<style> <style>
/* PAR DÉFAUT SUR DESKTOP - MOBILE CACHÉ */ /* SUR MOBILE SEULEMENT */
.d-md-none {
display: none;
}
/* SUR MOBILE - AFFICHER MOBILE, CACHER DESKTOP */
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
.d-md-none { .d-md-none {
display: block !important; display: block !important;
width: 100% !important; width: 100% !important;
max-width: 100% !important; padding: 15px !important;
overflow: hidden !important; box-sizing: border-box !important;
} }
.d-none.d-md-block { .d-none.d-md-block {
display: none !important; display: none !important;
} }
/* Styles mobiles harmonisés */ #form_mobile {
.d-md-none input,
.d-md-none select,
.d-md-none .login-btn {
width: 100% !important;
max-width: 300px !important;
margin-left: auto !important;
margin-right: auto !important;
display: block !important;
}
/* Harmonisation des champs */
.d-md-none input,
.d-md-none select {
height: 40px !important;
border: 2px solid #7D4FFE !important;
border-radius: 9px !important;
padding: 0 15px !important;
box-sizing: border-box !important;
font-size: 14px !important;
}
/* Bouton */
.d-md-none .login-btn {
height: 45px !important;
}
/* Centrage des labels */
.d-md-none label {
text-align: center !important;
display: block !important;
width: 100% !important;
margin-bottom: 5px !important;
}
/* Conteneur principal */
.d-md-none > div:last-child {
width: 100% !important; width: 100% !important;
max-width: 300px !important; max-width: 300px !important;
margin: 0 auto !important; margin: 0 auto !important;
} }
/* Pour très petits écrans */ #form_mobile input,
@media screen and (max-width: 320px) { #form_mobile select,
.d-md-none input, #btn_connexion_mobile {
.d-md-none select, width: 100% !important;
.d-md-none .login-btn { max-width: 300px !important;
max-width: 280px !important; margin: 0 auto !important;
display: block !important;
} }
#form_mobile input,
#form_mobile select {
height: 40px !important;
border: 2px solid #7D4FFE !important;
border-radius: 9px !important;
padding: 0 15px !important;
box-sizing: border-box !important;
}
#btn_connexion_mobile {
height: 45px !important;
}
#form_mobile label {
text-align: center !important;
display: block !important;
width: 100% !important;
margin-bottom: 5px !important;
}
}
/* SUR DESKTOP - CACHER MOBILE */
@media screen and (min-width: 768px) {
.d-md-none {
display: none !important;
} }
} }
</style> </style>
<script> <script>
// LOGIQUE POUR LA VERSION MOBILE // SCRIPT SIMPLE ET FONCTIONNEL POUR MOBILE
// 1. Synchronisation avec le desktop // 1. Initialisation au chargement
function synchroniserAvecDesktop() { document.addEventListener('DOMContentLoaded', function() {
// Liste des champs à synchroniser console.log('Initialisation mobile...');
const champs = [
{mobile: 'langue_mobile', desktop: 'langue'},
{mobile: 'codeSociete_mobile', desktop: 'codeSociete'},
{mobile: 'login_mobile', desktop: 'login'},
{mobile: 'mdp_mobile', desktop: 'mdp'}
];
champs.forEach(champ => { // Récupérer le formulaire desktop pour copier son action
const champMobile = document.getElementById(champ.mobile); const formDesktop = document.querySelector('form');
const champDesktop = document.getElementById(champ.desktop); const formMobile = document.getElementById('form_mobile');
if (champMobile && champDesktop) { if (formDesktop && formMobile) {
// Sync mobile → desktop // Copier l'action du formulaire desktop
champMobile.addEventListener('change', function() { formMobile.action = formDesktop.action || window.location.href;
champDesktop.value = this.value; console.log('Action copiée:', formMobile.action);
});
} // Copier la méthode
}); formMobile.method = formDesktop.method || 'POST';
} }
// 2. Fonctions de changement pour mobile // 2. Gestion des événements de changement
function changerLangueMobile(valeur) { document.getElementById('langue_mobile')?.addEventListener('change', function() {
// Mettre à jour le champ desktop
const desktopLangue = document.getElementById('langue'); const desktopLangue = document.getElementById('langue');
if (desktopLangue) { if (desktopLangue) {
desktopLangue.value = valeur; desktopLangue.value = this.value;
// Appeler la fonction desktop
if (typeof changer_langue_connexion === 'function') { if (typeof changer_langue_connexion === 'function') {
changer_langue_connexion(); changer_langue_connexion();
} }
} }
} });
function changerEntiteMobile(valeur) { document.getElementById('codeSociete_mobile')?.addEventListener('change', function() {
// Mettre à jour le champ desktop
const desktopEntite = document.getElementById('codeSociete'); const desktopEntite = document.getElementById('codeSociete');
if (desktopEntite) { if (desktopEntite) {
desktopEntite.value = valeur; desktopEntite.value = this.value;
// Appeler la fonction desktop
if (typeof changer_entite_portail === 'function') { if (typeof changer_entite_portail === 'function') {
changer_entite_portail(); changer_entite_portail();
} }
} }
} });
// 3. Gestion de la connexion mobile // 3. Validation avant soumission
function gererConnexionMobile() { formMobile?.addEventListener('submit', function(e) {
// Récupérer les valeurs mobiles console.log('Soumission du formulaire mobile...');
const codeSociete = document.getElementById('codeSociete_mobile')?.value.trim();
const login = document.getElementById('login_mobile')?.value.trim(); // Récupérer les valeurs
const mdp = document.getElementById('mdp_mobile')?.value.trim(); const codeSociete = document.getElementById('codeSociete_mobile').value.trim();
const login = document.getElementById('login_mobile').value.trim();
const mdp = document.getElementById('mdp_mobile').value.trim();
// Validation // Validation
if (!codeSociete || !login || !mdp) { if (!codeSociete || !login || !mdp) {
alert('Veuillez remplir tous les champs'); e.preventDefault();
alert('Veuillez remplir tous les champs obligatoires');
return false; return false;
} }
console.log('Connexion mobile:', {codeSociete, login, mdp}); console.log('Données mobiles:', {codeSociete, login, mdp});
// OPTION A: Utiliser le formulaire desktop // OPTION A: Synchroniser avec le desktop avant soumission
const formulaireDesktop = document.querySelector('form'); const desktopForm = document.querySelector('form');
if (formulaireDesktop) { if (desktopForm) {
// Mettre à jour les champs desktop // Copier les valeurs dans le formulaire desktop
document.getElementById('codeSociete').value = codeSociete; document.getElementById('codeSociete').value = codeSociete;
document.getElementById('login').value = login; document.getElementById('login').value = login;
document.getElementById('mdp').value = mdp; document.getElementById('mdp').value = mdp;
document.getElementById('langue').value = document.getElementById('langue_mobile').value; document.getElementById('langue').value = document.getElementById('langue_mobile').value;
// Soumettre // Soumettre le formulaire desktop
formulaireDesktop.submit(); e.preventDefault();
return true; desktopForm.submit();
}
// OPTION B: Si pas de formulaire, utiliser AJAX
// (Adaptez à votre backend)
const formData = new FormData();
formData.append('codeSociete', codeSociete);
formData.append('login', login);
formData.append('mdp', mdp);
formData.append('langue', document.getElementById('langue_mobile').value);
fetch(window.location.href, {
method: 'POST',
body: formData
})
.then(response => response.text())
.then(html => {
document.open();
document.write(html);
document.close();
})
.catch(error => {
console.error('Erreur:', error);
alert('Erreur de connexion');
});
return false; return false;
} }
// 4. Initialisation // OPTION B: Soumettre le formulaire mobile normalement
document.addEventListener('DOMContentLoaded', function() { return true;
// Synchroniser les champs
synchroniserAvecDesktop();
// Gérer le bouton de connexion mobile
const btnMobile = document.getElementById('btn_connexion_mobile');
if (btnMobile) {
btnMobile.addEventListener('click', gererConnexionMobile);
}
// Gérer la touche Entrée
document.querySelectorAll('.d-md-none input').forEach(input => {
input.addEventListener('keypress', function(e) {
if (e.key === 'Enter') {
e.preventDefault();
gererConnexionMobile();
}
});
}); });
// Gestion responsive // 4. Gestion responsive
function verifierAffichage() { function gererAffichageResponsive() {
const isMobile = window.innerWidth <= 767; const isMobile = window.innerWidth <= 767;
if (isMobile) { if (isMobile) {
@ -368,17 +308,56 @@ document.addEventListener('DOMContentLoaded', function() {
} }
} }
// Appliquer gererAffichageResponsive();
verifierAffichage(); window.addEventListener('resize', gererAffichageResponsive);
window.addEventListener('resize', verifierAffichage);
// 5. Debug: Log quand on clique sur le bouton
document.getElementById('btn_connexion_mobile')?.addEventListener('click', function() {
console.log('Bouton connexion mobile cliqué!');
});
}); });
// 5. Fallback: Si l'utilisateur clique sur le bouton desktop en mode mobile // 6. Fallback ultra simple - déclencher la connexion desktop
// (cela ne devrait pas arriver car il est caché, mais au cas où) function soumettreConnexionMobile() {
document.getElementById('btn_connexion')?.addEventListener('click', function(e) { console.log('Fonction soumettreConnexionMobile appelée');
if (window.innerWidth <= 767) {
e.preventDefault(); // Trouver le formulaire desktop
gererConnexionMobile(); const form = document.querySelector('form');
if (form) {
// Copier les valeurs mobiles vers desktop
const valeurs = {
'codeSociete': document.getElementById('codeSociete_mobile')?.value,
'login': document.getElementById('login_mobile')?.value,
'mdp': document.getElementById('mdp_mobile')?.value,
'langue': document.getElementById('langue_mobile')?.value
};
Object.keys(valeurs).forEach(name => {
const input = document.querySelector(`[name="${name}"]`);
if (input && valeurs[name]) {
input.value = valeurs[name];
} }
}); });
console.log('Soumission du formulaire desktop avec valeurs mobiles');
form.submit();
} else {
console.error('Aucun formulaire trouvé!');
alert('Erreur: Impossible de trouver le formulaire de connexion');
}
}
// 7. Liaison directe au bouton (fallback)
setTimeout(function() {
const btnMobile = document.getElementById('btn_connexion_mobile');
if (btnMobile) {
btnMobile.addEventListener('click', function(e) {
console.log('Clic sur bouton mobile détecté');
// Essayer la méthode simple
soumettreConnexionMobile();
e.preventDefault();
return false;
});
}
}, 1000);
</script> </script>