Initial commit
This commit is contained in:
14
.dockerignore
Normal file
14
.dockerignore
Normal file
@@ -0,0 +1,14 @@
|
|||||||
|
__pycache__
|
||||||
|
*.pyc
|
||||||
|
*.pyo
|
||||||
|
*.pyd
|
||||||
|
.Python
|
||||||
|
env/
|
||||||
|
venv/
|
||||||
|
.env
|
||||||
|
*.log
|
||||||
|
.git
|
||||||
|
.gitignore
|
||||||
|
.pytest_cache/
|
||||||
|
.coverage
|
||||||
|
htmlcov/
|
||||||
48
.gitignore
vendored
Normal file
48
.gitignore
vendored
Normal file
@@ -0,0 +1,48 @@
|
|||||||
|
# Python
|
||||||
|
__pycache__/
|
||||||
|
*.py[cod]
|
||||||
|
*$py.class
|
||||||
|
*.so
|
||||||
|
.Python
|
||||||
|
venv/
|
||||||
|
env/
|
||||||
|
ENV/
|
||||||
|
.env
|
||||||
|
.venv
|
||||||
|
pip-log.txt
|
||||||
|
pip-delete-this-directory.txt
|
||||||
|
|
||||||
|
# IDE
|
||||||
|
.idea/
|
||||||
|
.vscode/
|
||||||
|
*.swp
|
||||||
|
*.swo
|
||||||
|
|
||||||
|
# Logs
|
||||||
|
*.log
|
||||||
|
|
||||||
|
# Distribution / packaging
|
||||||
|
dist/
|
||||||
|
build/
|
||||||
|
*.egg-info/
|
||||||
|
|
||||||
|
# Unit test / coverage reports
|
||||||
|
htmlcov/
|
||||||
|
.tox/
|
||||||
|
.coverage
|
||||||
|
.coverage.*
|
||||||
|
.cache
|
||||||
|
nosetests.xml
|
||||||
|
coverage.xml
|
||||||
|
*.cover
|
||||||
|
.hypothesis/
|
||||||
|
.pytest_cache/
|
||||||
|
|
||||||
|
# Jupyter Notebook
|
||||||
|
.ipynb_checkpoints
|
||||||
|
|
||||||
|
# Docker
|
||||||
|
.docker/
|
||||||
|
|
||||||
|
# Daten
|
||||||
|
spezexpo.csv
|
||||||
24
Dockerfile
Normal file
24
Dockerfile
Normal file
@@ -0,0 +1,24 @@
|
|||||||
|
# Python 3.11 als Basis-Image
|
||||||
|
FROM python:3.11-slim
|
||||||
|
|
||||||
|
# Arbeitsverzeichnis setzen
|
||||||
|
WORKDIR /app
|
||||||
|
|
||||||
|
# Kopiere requirements.txt
|
||||||
|
COPY requirements.txt .
|
||||||
|
|
||||||
|
# Installiere Abhängigkeiten
|
||||||
|
RUN pip install --no-cache-dir -r requirements.txt
|
||||||
|
|
||||||
|
# Kopiere den Anwendungscode
|
||||||
|
COPY . .
|
||||||
|
|
||||||
|
# Exponiere Port 5000
|
||||||
|
EXPOSE 5000
|
||||||
|
|
||||||
|
# Setze Umgebungsvariablen
|
||||||
|
ENV FLASK_APP=app.py
|
||||||
|
ENV FLASK_ENV=production
|
||||||
|
|
||||||
|
# Starte die Anwendung
|
||||||
|
CMD ["flask", "run", "--host=0.0.0.0"]
|
||||||
169
README.md
Normal file
169
README.md
Normal file
@@ -0,0 +1,169 @@
|
|||||||
|
# medisoftware Kundensuche
|
||||||
|
|
||||||
|
Eine Flask-basierte Webanwendung zur Suche in Kundendaten aus einer CSV-Datei.
|
||||||
|
|
||||||
|
## Features
|
||||||
|
|
||||||
|
- Live-Suche während der Eingabe
|
||||||
|
- Suche nach:
|
||||||
|
- Kundennummer
|
||||||
|
- Name (Vor- und Nachname)
|
||||||
|
- Fachrichtung
|
||||||
|
- Ort
|
||||||
|
- Klickbare Links für:
|
||||||
|
- Telefonnummern (tel:)
|
||||||
|
- E-Mail-Adressen (mailto:)
|
||||||
|
- Adressen (Google Maps)
|
||||||
|
- Kundennummern (KKBefe-System)
|
||||||
|
- Responsive Design mit Bootstrap
|
||||||
|
- Docker-Container-Unterstützung
|
||||||
|
|
||||||
|
## Technische Details
|
||||||
|
|
||||||
|
### Technologie-Stack
|
||||||
|
|
||||||
|
- **Backend**: Python 3.11 mit Flask
|
||||||
|
- **Frontend**: HTML, CSS, JavaScript, Bootstrap 5
|
||||||
|
- **Datenverarbeitung**: pandas, numpy
|
||||||
|
- **Container**: Docker
|
||||||
|
|
||||||
|
### Projektstruktur
|
||||||
|
|
||||||
|
```
|
||||||
|
medi-customers/
|
||||||
|
├── app.py # Flask-Anwendung
|
||||||
|
├── templates/ # HTML-Templates
|
||||||
|
│ └── index.html # Hauptseite
|
||||||
|
├── spezexpo.csv # Kundendaten
|
||||||
|
├── requirements.txt # Python-Abhängigkeiten
|
||||||
|
├── Dockerfile # Docker-Konfiguration
|
||||||
|
└── .dockerignore # Docker-Ignore-Datei
|
||||||
|
```
|
||||||
|
|
||||||
|
### Datenformat
|
||||||
|
|
||||||
|
Die Anwendung erwartet eine CSV-Datei (`spezexpo.csv`) mit folgenden Spalten:
|
||||||
|
- Nummer (Kundennummer)
|
||||||
|
- Vorname
|
||||||
|
- Nachname
|
||||||
|
- Fachrichtung
|
||||||
|
- Strasse
|
||||||
|
- PLZ
|
||||||
|
- Ort
|
||||||
|
- Tel
|
||||||
|
- mail
|
||||||
|
|
||||||
|
## Installation
|
||||||
|
|
||||||
|
### Lokale Entwicklung
|
||||||
|
|
||||||
|
1. Python 3.11 installieren
|
||||||
|
2. Virtuelle Umgebung erstellen und aktivieren:
|
||||||
|
```bash
|
||||||
|
python -m venv venv
|
||||||
|
source venv/bin/activate # Linux/Mac
|
||||||
|
venv\Scripts\activate # Windows
|
||||||
|
```
|
||||||
|
3. Abhängigkeiten installieren:
|
||||||
|
```bash
|
||||||
|
pip install -r requirements.txt
|
||||||
|
```
|
||||||
|
4. Anwendung starten:
|
||||||
|
```bash
|
||||||
|
python app.py
|
||||||
|
```
|
||||||
|
|
||||||
|
### Docker-Container
|
||||||
|
|
||||||
|
1. Docker installieren
|
||||||
|
2. Container bauen:
|
||||||
|
```bash
|
||||||
|
docker build -t medi-customers .
|
||||||
|
```
|
||||||
|
3. Container starten:
|
||||||
|
```bash
|
||||||
|
docker run -d -p 5000:5000 --name medi-customers medi-customers
|
||||||
|
```
|
||||||
|
|
||||||
|
## API-Endpunkte
|
||||||
|
|
||||||
|
### GET /
|
||||||
|
- Rendert die Hauptseite
|
||||||
|
|
||||||
|
### GET /search
|
||||||
|
- Sucht nach Kunden basierend auf dem Query-Parameter
|
||||||
|
- Parameter: `q` (Suchbegriff)
|
||||||
|
- Returns: JSON-Array mit gefundenen Kunden
|
||||||
|
|
||||||
|
## Frontend-Funktionen
|
||||||
|
|
||||||
|
### Suchfunktion
|
||||||
|
- Live-Suche mit 300ms Debounce
|
||||||
|
- Minimale Suchlänge: 2 Zeichen
|
||||||
|
- Suche wird bei Enter-Taste sofort ausgeführt
|
||||||
|
|
||||||
|
### Link-Generierung
|
||||||
|
- `createPhoneLink()`: Erstellt tel:-Links mit führender 0
|
||||||
|
- `createEmailLink()`: Erstellt mailto:-Links
|
||||||
|
- `createAddressLink()`: Erstellt Google Maps-Links
|
||||||
|
- `createCustomerLink()`: Erstellt KKBefe-System-Links
|
||||||
|
|
||||||
|
## Fehlerbehandlung
|
||||||
|
|
||||||
|
- Logging für Backend-Fehler
|
||||||
|
- Benutzerfreundliche Fehlermeldungen im Frontend
|
||||||
|
- Graceful Degradation bei fehlenden Daten
|
||||||
|
|
||||||
|
## Entwicklung
|
||||||
|
|
||||||
|
### Debug-Modus
|
||||||
|
Die Anwendung läuft standardmäßig im Debug-Modus:
|
||||||
|
```bash
|
||||||
|
python app.py
|
||||||
|
```
|
||||||
|
|
||||||
|
### Logging
|
||||||
|
- Backend-Logs werden mit Python's logging-Modul erstellt
|
||||||
|
- Log-Level: DEBUG
|
||||||
|
- Logs werden in der Konsole ausgegeben
|
||||||
|
|
||||||
|
## Wartung
|
||||||
|
|
||||||
|
### Container-Verwaltung
|
||||||
|
```bash
|
||||||
|
# Container stoppen
|
||||||
|
docker stop medi-customers
|
||||||
|
|
||||||
|
# Container starten
|
||||||
|
docker start medi-customers
|
||||||
|
|
||||||
|
# Container-Logs anzeigen
|
||||||
|
docker logs medi-customers
|
||||||
|
|
||||||
|
# Container entfernen
|
||||||
|
docker rm medi-customers
|
||||||
|
```
|
||||||
|
|
||||||
|
### Datenaktualisierung
|
||||||
|
1. CSV-Datei aktualisieren
|
||||||
|
2. Container neu bauen und starten:
|
||||||
|
```bash
|
||||||
|
docker stop medi-customers
|
||||||
|
docker build -t medi-customers .
|
||||||
|
docker run -d -p 5000:5000 --name medi-customers medi-customers
|
||||||
|
```
|
||||||
|
|
||||||
|
## Sicherheit
|
||||||
|
|
||||||
|
- Alle externen Links öffnen sich in neuen Tabs
|
||||||
|
- Sicherheitsattribute für externe Links (noopener, noreferrer)
|
||||||
|
- Input-Validierung im Backend
|
||||||
|
- Fehlerbehandlung für ungültige Daten
|
||||||
|
|
||||||
|
## Browser-Kompatibilität
|
||||||
|
|
||||||
|
Die Anwendung wurde getestet mit:
|
||||||
|
- Chrome (neueste Version)
|
||||||
|
- Firefox (neueste Version)
|
||||||
|
- Edge (neueste Version)
|
||||||
|
- Safari (neueste Version)
|
||||||
62
app.py
Normal file
62
app.py
Normal file
@@ -0,0 +1,62 @@
|
|||||||
|
from flask import Flask, render_template, request, jsonify
|
||||||
|
import pandas as pd
|
||||||
|
import os
|
||||||
|
import logging
|
||||||
|
import numpy as np
|
||||||
|
|
||||||
|
app = Flask(__name__)
|
||||||
|
logging.basicConfig(level=logging.DEBUG)
|
||||||
|
logger = logging.getLogger(__name__)
|
||||||
|
|
||||||
|
def clean_dataframe(df):
|
||||||
|
"""Konvertiert NaN-Werte in None für JSON-Kompatibilität"""
|
||||||
|
return df.replace({np.nan: None})
|
||||||
|
|
||||||
|
# CSV-Datei laden
|
||||||
|
def load_data():
|
||||||
|
try:
|
||||||
|
logger.info("Versuche CSV-Datei zu laden...")
|
||||||
|
if not os.path.exists('spezexpo.csv'):
|
||||||
|
logger.error("CSV-Datei 'spezexpo.csv' nicht gefunden!")
|
||||||
|
return None
|
||||||
|
|
||||||
|
df = pd.read_csv('spezexpo.csv', encoding='utf-8')
|
||||||
|
df = clean_dataframe(df)
|
||||||
|
logger.info(f"CSV-Datei erfolgreich geladen. {len(df)} Einträge gefunden.")
|
||||||
|
return df
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Fehler beim Laden der CSV-Datei: {str(e)}")
|
||||||
|
return None
|
||||||
|
|
||||||
|
@app.route('/')
|
||||||
|
def index():
|
||||||
|
return render_template('index.html')
|
||||||
|
|
||||||
|
@app.route('/search')
|
||||||
|
def search():
|
||||||
|
try:
|
||||||
|
query = request.args.get('q', '').lower()
|
||||||
|
logger.info(f"Suche nach: {query}")
|
||||||
|
|
||||||
|
df = load_data()
|
||||||
|
if df is None:
|
||||||
|
return jsonify({"error": "Datenbank konnte nicht geladen werden"}), 500
|
||||||
|
|
||||||
|
# Suche über verschiedene Felder
|
||||||
|
mask = (
|
||||||
|
df['Vorname'].str.lower().str.contains(query, na=False) |
|
||||||
|
df['Nachname'].str.lower().str.contains(query, na=False) |
|
||||||
|
df['Fachrichtung'].str.lower().str.contains(query, na=False) |
|
||||||
|
df['Ort'].str.lower().str.contains(query, na=False) |
|
||||||
|
df['Nummer'].astype(str).str.contains(query, na=False) # Suche nach Kundennummer
|
||||||
|
)
|
||||||
|
|
||||||
|
results = df[mask].to_dict('records')
|
||||||
|
logger.info(f"{len(results)} Ergebnisse gefunden")
|
||||||
|
return jsonify(results)
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Fehler bei der Suche: {str(e)}")
|
||||||
|
return jsonify({"error": str(e)}), 500
|
||||||
|
|
||||||
|
if __name__ == '__main__':
|
||||||
|
app.run(debug=True)
|
||||||
4
requirements.txt
Normal file
4
requirements.txt
Normal file
@@ -0,0 +1,4 @@
|
|||||||
|
flask==3.0.2
|
||||||
|
pandas==2.2.1
|
||||||
|
numpy==1.26.4
|
||||||
|
python-dotenv==1.0.1
|
||||||
209
templates/index.html
Normal file
209
templates/index.html
Normal file
@@ -0,0 +1,209 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="de">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>medisoftware Kundensuche</title>
|
||||||
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
min-height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.main-content {
|
||||||
|
flex: 1 0 auto;
|
||||||
|
padding: 2rem 0;
|
||||||
|
}
|
||||||
|
.search-container {
|
||||||
|
max-width: 800px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
.result-card {
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
.result-card:hover {
|
||||||
|
transform: translateY(-2px);
|
||||||
|
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
|
||||||
|
}
|
||||||
|
.loading {
|
||||||
|
display: none;
|
||||||
|
text-align: center;
|
||||||
|
margin: 2rem 0;
|
||||||
|
}
|
||||||
|
.phone-link, .email-link, .address-link, .customer-link {
|
||||||
|
text-decoration: none;
|
||||||
|
color: #0d6efd;
|
||||||
|
}
|
||||||
|
.phone-link:hover, .email-link:hover, .address-link:hover, .customer-link:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
.search-icon {
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
color: #6c757d;
|
||||||
|
}
|
||||||
|
.customer-number {
|
||||||
|
color: #6c757d;
|
||||||
|
font-size: 0.9em;
|
||||||
|
}
|
||||||
|
.footer {
|
||||||
|
flex-shrink: 0;
|
||||||
|
text-align: center;
|
||||||
|
padding: 1rem;
|
||||||
|
background-color: #f8f9fa;
|
||||||
|
border-top: 1px solid #dee2e6;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="main-content">
|
||||||
|
<div class="container search-container">
|
||||||
|
<h1 class="text-center mb-4">medisoftware Kundensuche</h1>
|
||||||
|
|
||||||
|
<div class="input-group mb-4 position-relative">
|
||||||
|
<input type="text" id="searchInput" class="form-control form-control-lg"
|
||||||
|
placeholder="Suchen Sie nach Name, Fachrichtung, Ort oder Kundennummer...">
|
||||||
|
<span class="search-icon">🔍</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="loading" class="loading">
|
||||||
|
<div class="spinner-border text-primary" role="status">
|
||||||
|
<span class="visually-hidden">Laden...</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="results" class="mt-4">
|
||||||
|
<!-- Hier werden die Suchergebnisse angezeigt -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<footer class="footer">
|
||||||
|
<p class="mb-0">(c) 2025 <a href="https://medisoftware.de" target="_blank" rel="noopener noreferrer" class="text-decoration-none">medisoftware</a></p>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
let searchTimeout;
|
||||||
|
|
||||||
|
function createPhoneLink(phone) {
|
||||||
|
if (!phone) return 'N/A';
|
||||||
|
// Entferne alle nicht-numerischen Zeichen für den tel: Link
|
||||||
|
const cleaned = phone.replace(/\D/g, '');
|
||||||
|
// Füge immer eine führende 0 hinzu
|
||||||
|
const telLink = '0' + cleaned;
|
||||||
|
// Zeige die ursprüngliche Nummer an
|
||||||
|
return `<a href="tel:${telLink}" class="phone-link">${phone}</a>`;
|
||||||
|
}
|
||||||
|
|
||||||
|
function createEmailLink(email) {
|
||||||
|
if (!email) return 'N/A';
|
||||||
|
return `<a href="mailto:${email}" class="email-link">${email}</a>`;
|
||||||
|
}
|
||||||
|
|
||||||
|
function createAddressLink(street, plz, city) {
|
||||||
|
if (!street || !plz || !city) return 'N/A';
|
||||||
|
const address = `${street}, ${plz} ${city}`;
|
||||||
|
const searchQuery = encodeURIComponent(address);
|
||||||
|
return `<a href="https://www.google.com/maps/search/?api=1&query=${searchQuery}"
|
||||||
|
class="address-link" target="_blank" rel="noopener noreferrer">
|
||||||
|
${address}
|
||||||
|
<span class="ms-1">🗺️</span>
|
||||||
|
</a>`;
|
||||||
|
}
|
||||||
|
|
||||||
|
function createCustomerLink(customerNumber) {
|
||||||
|
if (!customerNumber) return 'N/A';
|
||||||
|
return `<a href="medisw:openkkbefe/P${customerNumber}?NetGrp=4"
|
||||||
|
class="customer-link" target="_blank" rel="noopener noreferrer">
|
||||||
|
${customerNumber}
|
||||||
|
</a>`;
|
||||||
|
}
|
||||||
|
|
||||||
|
function searchCustomers() {
|
||||||
|
const query = document.getElementById('searchInput').value;
|
||||||
|
if (query.length < 2) {
|
||||||
|
document.getElementById('results').innerHTML = '';
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Lade-Animation anzeigen
|
||||||
|
document.getElementById('loading').style.display = 'block';
|
||||||
|
document.getElementById('results').innerHTML = '';
|
||||||
|
|
||||||
|
fetch(`/search?q=${encodeURIComponent(query)}`)
|
||||||
|
.then(response => {
|
||||||
|
if (!response.ok) {
|
||||||
|
return response.json().then(data => {
|
||||||
|
throw new Error(data.error || 'Ein Fehler ist aufgetreten');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return response.json();
|
||||||
|
})
|
||||||
|
.then(data => {
|
||||||
|
const resultsDiv = document.getElementById('results');
|
||||||
|
resultsDiv.innerHTML = '';
|
||||||
|
|
||||||
|
if (data.length === 0) {
|
||||||
|
resultsDiv.innerHTML = '<div class="alert alert-info">Keine Ergebnisse gefunden.</div>';
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
data.forEach(customer => {
|
||||||
|
const card = document.createElement('div');
|
||||||
|
card.className = 'card result-card';
|
||||||
|
card.innerHTML = `
|
||||||
|
<div class="card-body">
|
||||||
|
<h5 class="card-title">
|
||||||
|
${customer.Vorname} ${customer.Nachname}
|
||||||
|
<span class="customer-number ms-2">(Kunde: ${createCustomerLink(customer.Nummer)})</span>
|
||||||
|
</h5>
|
||||||
|
<p class="card-text">
|
||||||
|
<strong>Fachrichtung:</strong> ${customer.Fachrichtung || 'N/A'}<br>
|
||||||
|
<strong>Adresse:</strong> ${createAddressLink(customer.Strasse, customer.PLZ, customer.Ort)}<br>
|
||||||
|
<strong>Telefon:</strong> ${createPhoneLink(customer.Tel)}<br>
|
||||||
|
<strong>E-Mail:</strong> ${createEmailLink(customer.mail)}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
resultsDiv.appendChild(card);
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch(error => {
|
||||||
|
console.error('Fehler:', error);
|
||||||
|
document.getElementById('results').innerHTML =
|
||||||
|
`<div class="alert alert-danger">${error.message}</div>`;
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
// Lade-Animation ausblenden
|
||||||
|
document.getElementById('loading').style.display = 'none';
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Event-Listener für die Live-Suche
|
||||||
|
document.getElementById('searchInput').addEventListener('input', function(e) {
|
||||||
|
// Clear previous timeout
|
||||||
|
clearTimeout(searchTimeout);
|
||||||
|
|
||||||
|
// Set new timeout
|
||||||
|
searchTimeout = setTimeout(() => {
|
||||||
|
searchCustomers();
|
||||||
|
}, 300); // 300ms Verzögerung
|
||||||
|
});
|
||||||
|
|
||||||
|
// Suche bei Enter-Taste
|
||||||
|
document.getElementById('searchInput').addEventListener('keypress', function(e) {
|
||||||
|
if (e.key === 'Enter') {
|
||||||
|
clearTimeout(searchTimeout);
|
||||||
|
searchCustomers();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Reference in New Issue
Block a user