This commit is contained in:
KANE LAZENI 2026-02-16 00:48:23 +00:00
parent af68de26c8
commit 4e1e14636b

View File

@ -49,16 +49,16 @@
name="donneesCarte"
autofocus
AUTOCOMPLETE="OFF"
placeholder="<?= _("Veuillez scanner la carte NFC!")?>">
placeholder="<?= _("Veuillez scanner la carte NFC ou le QR code!")?>">
<div class="reading-indicator" id="reading-indicator">
<i class="fa fa-check-circle"></i> <?= _("Carte détectée") ?>
<i class="fa fa-check-circle"></i> <span id="indicator-text"><?= _("Carte détectée") ?></span>
</div>
<input id="lancerrechercheparcarte" name="lancerrechercheparcarte" class="sr-only" type="submit" value="<?= _("Rechercher") ?>" >
</form>
<div id ="div_wait_nfc"> </div>
<div id="div_wait_nfc"></div>
<?php if (isset($msgErreur) && $msgErreur>" "): ?>
<div class="alert alert-danger" style="height:38px; padding:5px; text-align: center;">
@ -69,30 +69,58 @@
<script>
const inputField = document.getElementById('donneesCarte');
const indicator = document.getElementById('reading-indicator');
const indicatorText = document.getElementById('indicator-text');
// Protection
inputField.addEventListener('contextmenu', e => e.preventDefault());
inputField.addEventListener('copy', e => e.preventDefault());
inputField.addEventListener('cut', e => e.preventDefault());
// Détection du type de scan
function detectScanType(value) {
// QR code commence généralement par un format spécifique
// Ajustez cette logique selon votre format de QR code
if (value.startsWith('QR') || value.includes('|') || value.length > 50) {
return 'qr';
}
return 'nfc';
}
// Feedback visuel pendant la saisie
inputField.addEventListener('input', function() {
if (this.value.length > 0) {
this.classList.add('reading');
indicator.classList.add('active');
// Mise à jour du texte selon le type détecté
const type = detectScanType(this.value);
if (type === 'qr') {
indicatorText.textContent = '<?= _("QR code détecté") ?>';
} else {
indicatorText.textContent = '<?= _("Carte détectée") ?>';
}
} else {
this.classList.remove('reading');
indicator.classList.remove('active');
}
});
// Votre logique existante
// Soumission automatique du formulaire
inputField.addEventListener('change', function () {
// alert(this.value);
if (this.value.length > 3) {
var div_wait_nfc = $('#div_wait_nfc');
div_wait_nfc.html('<div style="padding-top:80px; text-align:center; font-size:14px; color: #4caf50;"><span><i class="fa fa-spinner fa-spin fa-5x" >' + '</span></div>');
this.form.submit();
}
if (this.value.length > 3) {
const type = detectScanType(this.value);
const message = type === 'qr'
? '<?= _("Traitement du QR code...") ?>'
: '<?= _("Lecture de la carte...") ?>';
var div_wait_nfc = $('#div_wait_nfc');
div_wait_nfc.html('<div style="padding-top:80px; text-align:center; font-size:14px; color: #4caf50;"><span><i class="fa fa-spinner fa-spin fa-5x"></i></span><p style="margin-top:20px;">' + message + '</p></div>');
this.form.submit();
}
});
// Focus automatique sur le champ (utile après rafraîchissement)
window.addEventListener('load', function() {
inputField.focus();
});
</script>