first qyality report

py_app/app/routes.py

@@ -1,5 +1,6 @@
 import os
 import mariadb
+from datetime import datetime, timedelta
 from flask import Blueprint, render_template, redirect, url_for, request, flash, session, current_app, jsonify
 from .models import User
 from . import db
@@ -242,15 +243,43 @@ def save_external_db():
     flash('External database settings saved/updated successfully.')
     return redirect(url_for('main.settings'))
 
-@bp.route('/get_report_data')
+@bp.route('/get_report_data', methods=['GET'])
 def get_report_data():
     report = request.args.get('report')
-    # Mock data for demonstration
-    data = {
-        "headers": ["Column 1", "Column 2", "Column 3"],
-        "rows": [
-            [f"Row 1, Col 1 (Report {report})", "Row 1, Col 2", "Row 1, Col 3"],
-            [f"Row 2, Col 1 (Report {report})", "Row 2, Col 2", "Row 2, Col 3"],
-        ],
-    }
+    data = {"headers": [], "rows": []}
+
+    try:
+        conn = get_db_connection()
+        cursor = conn.cursor()
+
+        if report == "1":
+            # Calculate the date 5 days ago
+            five_days_ago = datetime.now() - timedelta(days=5)
+            cursor.execute("""
+                SELECT Id, operator_code, CP_base_code, OC1_code, OC2_code, quality_code, date, time, approved_quantity, rejected_quantity
+                FROM scan1_orders
+                WHERE date >= ?
+                ORDER BY date DESC, time DESC
+            """, (five_days_ago.strftime('%Y-%m-%d'),))
+            rows = cursor.fetchall()
+
+            # Debugging: Print fetched rows
+            print("Fetched rows for report 1:", rows)
+
+            # Define headers based on database column names
+            data["headers"] = ["Id", "Operator Code", "CP Base Code", "OC1 Code", "OC2 Code", "Quality Code", "Date", "Time", "Approved Quantity", "Rejected Quantity"]
+
+            # Convert rows to JSON serializable format
+            data["rows"] = [
+                [str(cell) if isinstance(cell, (datetime, timedelta)) else cell for cell in row]
+                for row in rows
+            ]
+
+        conn.close()
+    except mariadb.Error as e:
+        print(f"Error fetching report data: {e}")
+        data["error"] = "Error fetching report data."
+
+    # Debugging: Print the final data being returned
+    print("Data being returned:", data)
     return jsonify(data)

py_app/app/static/script.js

@@ -128,15 +128,23 @@ document.addEventListener('DOMContentLoaded', () => {
     // Handle report button clicks
     reportButtons.forEach((button) => {
         button.addEventListener('click', () => {
+// Get the text label of the button
+            const reportLabel = button.textContent.trim();
+
+            // Update the title dynamically with the button's text label
+            reportTitle.textContent = `Data for "${reportLabel}"`;
+
+            // Fetch data for the selected report
             const reportNumber = button.dataset.report;
-
-            // Update the title dynamically
-            reportTitle.textContent = `Data for "Report ${reportNumber}"`;
-
-            // Fetch data for the selected report (mocked for now)
             fetch(`/get_report_data?report=${reportNumber}`)
-                .then((response) => response.json())
+                .then((response) => {
+                    if (!response.ok) {
+                        throw new Error(`HTTP error! status: ${response.status}`);
+                    }
+                    return response.json();
+                })
                 .then((data) => {
+console.log("Fetched data:", data); // Debugging
                     populateTable(data);
                 })
                 .catch((error) => {
@@ -197,3 +205,73 @@ document.addEventListener('DOMContentLoaded', () => {
         // Add logic to export the current report as PDF
     });
 });
+document.addEventListener('DOMContentLoaded', () => {
+    const reportButtons = document.querySelectorAll('.report-btn');
+    const reportTitle = document.getElementById('report-title');
+    const reportTable = document.getElementById('report-table');
+
+    // Handle report button clicks
+    reportButtons.forEach((button) => {
+        button.addEventListener('click', () => {
+            const reportNumber = button.dataset.report;
+            // Get the text label of the button
+            const reportLabel = button.textContent.trim();
+            // Update the title dynamically
+            reportTitle.textContent = `Date pentru "${reportLabel}"`;
+
+            // Fetch data for the selected report
+            fetch(`/get_report_data?report=${reportNumber}`)
+                .then((response) => {
+                    if (!response.ok) {
+                        throw new Error(`HTTP error! status: ${response.status}`);
+                    }
+                    return response.json();
+                })
+                .then((data) => {
+                    console.log("Fetched data:", data); // Debugging
+                    populateTable(data);
+                })
+                .catch((error) => {
+                    console.error('Error fetching report data:', error);
+                });
+        });
+    });
+
+    // Populate the table with data
+    function populateTable(data) {
+        const tableHead = reportTable.querySelector('thead tr');
+        const tableBody = reportTable.querySelector('tbody');
+
+        // Clear existing table content
+        tableHead.innerHTML = '';
+        tableBody.innerHTML = '';
+
+        if (data.headers && data.rows) {
+            // Populate table headers
+            data.headers.forEach((header) => {
+                const th = document.createElement('th');
+                th.textContent = header;
+                tableHead.appendChild(th);
+            });
+
+            // Populate table rows
+            data.rows.forEach((row) => {
+                const tr = document.createElement('tr');
+                row.forEach((cell) => {
+                    const td = document.createElement('td');
+                    td.textContent = cell;
+                    tr.appendChild(td);
+                });
+                tableBody.appendChild(tr);
+            });
+        } else {
+            // No data available
+            const tr = document.createElement('tr');
+            const td = document.createElement('td');
+            td.textContent = 'No data available.';
+            td.colSpan = data.headers ? data.headers.length : 1;
+            tr.appendChild(td);
+            tableBody.appendChild(tr);
+        }
+    }
+});

py_app/app/static/style.css

@@ -640,3 +640,31 @@ body.dark-mode .dashboard-full-width-card {
         flex: 1 1 100%; /* Ensure the full-width card spans the entire width */
     }
 }
+
+/* Style for the export description label */
+.export-description {
+    display: block;
+    margin-bottom: 10px;
+    font-size: 1em;
+    font-weight: bold;
+    color: #333; /* Default color for light mode */
+}
+
+/* Dark mode styles for the export description label */
+body.dark-mode .export-description {
+    color: #fefdfd; /* Light color for dark mode */
+}
+
+/* Style for the container holding the last two buttons */
+.form-centered.last-buttons .button-row {
+    display: flex;
+    justify-content: flex-start; /* Align buttons to the left */
+    gap: 10px; /* Add spacing between the buttons */
+}
+
+/* Style for the buttons */
+.form-centered.last-buttons .btn {
+    padding: 5px 10px; /* Make the buttons smaller */
+    font-size: 0.9em; /* Reduce the font size */
+    border-radius: 3px; /* Slightly smaller border radius */
+}

py_app/app/templates/quality.html

@@ -3,23 +3,39 @@
 {% block content %}
 <div class="scan-container">
     <!-- Reports Card -->
-    <div class="card scan-form-card">
+    <div class="card report-form-card">
         <h3>Rapoarte</h3>
         <div class="form-centered">
-            <button class="btn report-btn" data-report="1">Report 1</button>
-            <button class="btn report-btn" data-report="2">Report 2</button>
-            <button class="btn report-btn" data-report="3">Report 3</button>
-            <button class="btn report-btn" data-report="4">Report 4</button>
-            <button class="btn report-btn" data-report="5">Report 5</button>
+            <label class="report-description">Report 1 va exporta toate comenzile scanate la punctele de scanare calitate cu de acum 5 zile</label>
+            <button class="btn report-btn" data-report="1">Raporteaza 5 zile de comenzi</button>
         </div>
         <div class="form-centered">
-            <button class="btn export-btn" id="export-csv">Export the current report as CSV</button>
-            <button class="btn export-btn" id="export-pdf">Export the current report as PDF</button>
+            <label class="report-description">This report: Report 2 exports all approved orders from the database.</label>
+            <button class="btn report-btn" data-report="2">Report 2</button>
+        </div>
+        <div class="form-centered">
+            <label class="report-description">This report: Report 3 exports all rejected orders from the database.</label>
+            <button class="btn report-btn" data-report="3">Report 3</button>
+        </div>
+        <div class="form-centered">
+            <label class="report-description">This report: Report 4 exports all orders with defects from the database.</label>
+            <button class="btn report-btn" data-report="4">Report 4</button>
+        </div>
+        <div class="form-centered">
+            <label class="report-description">This report: Report 5 exports a summary of all orders from the database.</label>
+            <button class="btn report-btn" data-report="5">Report 5</button>
+        </div>
+        <div class="form-centered last-buttons">
+            <label class="export-description">Export current report as:</label>
+            <div class="button-row">
+                <button class="btn export-btn" id="export-csv">Export CSV</button>
+                <button class="btn export-btn" id="export-pdf">Export PDF</button>
+            </div>
         </div>
     </div>
 
     <!-- Data Display Card -->
-    <div class="card scan-table-card">
+    <div class="card report-table-card">
         <h3 id="report-title">No data to display, please select a report.</h3>
         <table class="scan-table" id="report-table">
             <thead>