@app.route('/api/temperatures') def get_temps(): fridge_id = request.args.get('fridge_id', 1) hours = int(request.args.get('hours', 24)) conn = sqlite3.connect('fridge.db') c = conn.cursor() since = datetime.now() - timedelta(hours=hours) c.execute('''SELECT recorded_at, temp FROM temperature_logs WHERE fridge_id = ? AND recorded_at > ? ORDER BY recorded_at''', (fridge_id, since)) data = ['time': row[0], 'temp': row[1] for row in c.fetchall()] conn.close() return jsonify(data)
@app.route('/') def index(): return render_template('graph.html') grafic temperatura frigider magazin alimentar
def init_db(): conn = sqlite3.connect('fridge.db') c = conn.cursor() c.execute('''CREATE TABLE IF NOT EXISTS fridge_sensors (id INTEGER PRIMARY KEY, name TEXT, min_temp REAL, max_temp REAL)''') c.execute('''CREATE TABLE IF NOT EXISTS temperature_logs (id INTEGER PRIMARY KEY, fridge_id INTEGER, temp REAL, recorded_at TEXT)''') # Insert demo fridge if empty c.execute("SELECT COUNT(*) FROM fridge_sensors") if c.fetchone()[0] == 0: c.execute("INSERT INTO fridge_sensors (name, min_temp, max_temp) VALUES (?,?,?)", ('Dairy Cooler', 0.0, 4.0)) conn.commit() conn.close() Frontend (HTML + Chart
function fetchAndRender() const fridgeId = $('#fridgeSelect').val(); const hours = $('#periodSelect').val(); $.get( /api/temperatures?fridge_id=$fridgeId&hours=$hours , function(data) const times = data.map(d => new Date(d.time).toLocaleTimeString([], hour:'2-digit', minute:'2-digit')); const temps = data.map(d => d.temp); Frontend (HTML + Chart.js) templates/graph.html <
if (chart) chart.destroy(); const ctx = document.getElementById('tempChart').getContext('2d'); chart = new Chart(ctx, type: 'line', data: labels: times, datasets: [] , options: responsive: true, plugins: tooltip: callbacks: label: (ctx) => `$ctx.raw°C` , annotation: annotations: safeZone: type: 'box', yMin: 0, yMax: 4, backgroundColor: 'rgba(0,255,0,0.1)' , scales: y: title: display: true, text: 'Temperature (°C)' , min: -2, max: 8, grid: , x: title: display: true, text: 'Time' ); // Count violations const violations = temps.filter(t => t > 4 );
if == ' main ': init_db() app.run(debug=True) 4. Frontend (HTML + Chart.js) templates/graph.html <!DOCTYPE html> <html> <head> <title>Refrigerator Temperature Graph | Food Store</title> <script src="https://cdn.jsdelivr.net/npm/chart.js"></script> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <style> body font-family: Arial; padding: 20px; background: #f4f7fc; .card background: white; border-radius: 12px; padding: 20px; margin-bottom: 20px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); h2 color: #1e466e; canvas max-height: 400px; width: 100%; .violation color: red; font-weight: bold; .safe color: green; select, button padding: 8px 12px; margin: 5px; font-size: 1rem; </style> </head> <body> <div class="card"> <h2>📊 Temperature Graph – Food Store Refrigerator</h2> <label>Select Fridge: </label> <select id="fridgeSelect"> <option value="1">Dairy Cooler (0°C..4°C)</option> </select> <label>Period: </label> <select id="periodSelect"> <option value="6">Last 6 hours</option> <option value="24" selected>Last 24 hours</option> <option value="48">Last 48 hours</option> </select> <button id="refreshBtn">🔄 Refresh Graph</button> <div style="margin-top: 10px;"> <span class="safe">✅ Safe zone (0°C – 4°C)</span> | <span class="violation">⚠️ Violation (>4°C or <0°C)</span> </div> </div> <div class="card"> <canvas id="tempChart" width="800" height="400"></canvas> </div> <script> let chart;
@app.route('/api/log', methods=['POST']) def log_temp(): fridge_id = request.json['fridge_id'] temp = request.json['temperature'] conn = sqlite3.connect('fridge.db') c = conn.cursor() c.execute("INSERT INTO temperature_logs (fridge_id, temp, recorded_at) VALUES (?,?,?)", (fridge_id, temp, datetime.now().isoformat())) conn.commit() conn.close() return jsonify('status': 'ok')