elpatron/medi-customers
1
0
Fork 0
Code Issues Pull Requests Actions Packages Releases Activity

Fix: Performance-Optimierungen und verbessertes Highlighting in index.html

Browse Source
This commit is contained in:
elpatron
2025-03-20 10:14:54 +01:00
parent c1b55c3579
commit f46947b6d4
1 changed files with 22 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
templates/index.html
View File

@@ -138,9 +138,12 @@
}
function highlightText(text, searchTerm) {
if (!searchTerm) return text;
const regex = new RegExp(`(${searchTerm})`, 'gi');
return text.replace(regex, '<mark>$1</mark>');
if (!searchTerm || !text) return text;
// Escapen von Sonderzeichen im Suchbegriff
const escapedSearchTerm = searchTerm.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
// Erstelle einen regulären Ausdruck ohne Wortgrenzen
const regex = new RegExp(escapedSearchTerm, 'gi');
return text.replace(regex, '<mark>$&</mark>');
}
function createAddressLink(street, plz, city) {
@@ -191,8 +194,8 @@
return isIPInSubnet(clientIP, trimmedRange);
});
const adjustedNumber = adjustCustomerNumber(nummer);
if (isAllowed) {
const adjustedNumber = adjustCustomerNumber(nummer);
return `<a href="medisw:openkkbefe/P${adjustedNumber}?NetGrp=4" class="customer-link">${nummer}</a>`;
} else {
return nummer;
@@ -232,6 +235,9 @@
function displayResults(results) {
const resultsDiv = document.getElementById('results');
const resultCount = document.getElementById('resultCount');
const generalSearchTerm = document.getElementById('q').value;
const nameSearchTerm = document.getElementById('nameInput').value;
const fachrichtungSearchTerm = document.getElementById('fachrichtungInput').value;
if (!results || results.length === 0) {
resultsDiv.innerHTML = '<p>Keine Ergebnisse gefunden.</p>';
@@ -253,7 +259,7 @@
<div class="card mb-1">
<div class="card-body py-1">
<div class="d-flex justify-content-between align-items-start">
<h5 class="card-title mb-1">${customer.name}</h5>
<h5 class="card-title mb-1">${highlightText(customer.name, generalSearchTerm || nameSearchTerm)}</h5>
<div class="d-flex align-items-center gap-2">
<span class="badge ${(customer.tag || 'medisoft') === 'medisoft' ? 'bg-primary' : 'bg-warning text-dark'}">${(customer.tag || 'medisoft').toUpperCase()}</span>
<button class="btn btn-sm btn-outline-primary" onclick="copyCustomerLink('${customer.nummer}')">
@@ -262,7 +268,7 @@
</div>
</div>
<div class="card-text">
${createFieldIfValue('Nummer', customer.nummer)}
${createFieldIfValue('Nummer', customer.nummer, createCustomerLink)}
${createFieldIfValue('Adresse', (customer.strasse && customer.plz && customer.ort) ? true : false,
() => createAddressLink(customer.strasse, customer.plz, customer.ort))}
${createFieldIfValue('Telefon', customer.telefon, createPhoneLink)}
@@ -270,7 +276,7 @@
${createFieldIfValue('Handy', customer.handy, createPhoneLink)}
${createFieldIfValue('Telefon Firma', customer.tele_firma, createPhoneLink)}
${createFieldIfValue('E-Mail', customer.email, createEmailLink)}
${createFieldIfValue('Fachrichtung', customer.fachrichtung)}
${createFieldIfValue('Fachrichtung', highlightText(customer.fachrichtung, generalSearchTerm || fachrichtungSearchTerm))}
${createFieldIfValue('Kontakt 1', customer.kontakt1, createPhoneLink)}
${createFieldIfValue('Kontakt 2', customer.kontakt2, createPhoneLink)}
${createFieldIfValue('Kontakt 3', customer.kontakt3, createPhoneLink)}
@@ -296,6 +302,13 @@
const fachrichtung = document.getElementById('fachrichtungInput').value;
const selectedTag = document.getElementById('tagFilter').value;
// Prüfe, ob mindestens ein Suchfeld einen Wert hat
if (!q && !name && !ort && !nummer && !plz && !fachrichtung) {
document.getElementById('results').innerHTML = '';
document.getElementById('resultCount').textContent = '';
return;
}
// Zeige das Lade-Icon
document.getElementById('loading').style.display = 'block';
@@ -359,7 +372,8 @@
searchInputs.forEach((input, index) => {
input.addEventListener('input', function() {
clearTimeout(searchTimeout);
searchTimeout = setTimeout(searchCustomers, 300);
// Erhöhe das Debounce-Intervall auf 500ms
searchTimeout = setTimeout(searchCustomers, 500);
// Reset-Icon anzeigen/verstecken
resetIcons[index].classList.toggle('visible', this.value.length > 0);