109 lines
4.6 KiB
HTML
109 lines
4.6 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}Quality Module{% endblock %}
|
|
{% block content %}
|
|
<div class="scan-container">
|
|
<!-- Reports Card -->
|
|
<div class="card report-form-card">
|
|
<h3>Reports</h3>
|
|
|
|
<!-- Reports List with Label-Button Layout -->
|
|
<div class="reports-grid">
|
|
<div class="form-centered">
|
|
<label class="report-description">Daily report will export all orders scanned at quality scanning points</label>
|
|
<button class="btn report-btn" data-report="1">Daily Complete Orders Report</button>
|
|
</div>
|
|
<div class="form-centered">
|
|
<label class="report-description">Select day for daily report will export all orders scanned at quality scanning points</label>
|
|
<button class="btn report-btn" id="select-day-report">Select Day Daily Report</button>
|
|
</div>
|
|
<div class="form-centered">
|
|
<label class="report-description">5-day report will export all orders scanned at quality scanning points</label>
|
|
<button class="btn report-btn" data-report="2">5-Day Complete Orders Report</button>
|
|
</div>
|
|
<div class="form-centered">
|
|
<label class="report-description">Report on items with quality issues for the current day</label>
|
|
<button class="btn report-btn" data-report="3">Report on Items with Defects for the Current Day</button>
|
|
</div>
|
|
<div class="form-centered">
|
|
<label class="report-description">Report on items with quality issues for the last 5 days</label>
|
|
<button class="btn report-btn" data-report="4">Report on Items with Defects for the Last 5 Days</button>
|
|
</div>
|
|
<div class="form-centered">
|
|
<label class="report-description">Report all entries from the database</label>
|
|
<button class="btn report-btn" data-report="5">Report Database</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Separator -->
|
|
<div class="report-separator"></div>
|
|
|
|
<!-- Export Section -->
|
|
<div class="export-section">
|
|
<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-excel">Export excell</button> -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Data Display Card -->
|
|
<div class="card report-table-card">
|
|
<h3 id="report-title">No data to display, please select a report.</h3>
|
|
<div class="report-table-container">
|
|
<table class="scan-table" id="report-table">
|
|
<thead>
|
|
<tr>
|
|
<!-- Table headers will be dynamically populated -->
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<!-- Table data will be dynamically populated -->
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Calendar Popup Modal -->
|
|
<div id="calendar-modal" class="modal">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h4>Select Date for Daily Report</h4>
|
|
<span class="close-modal">×</span>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="calendar-container">
|
|
<div class="calendar-header">
|
|
<button id="prev-month" class="calendar-nav"><</button>
|
|
<h3 id="calendar-month-year"></h3>
|
|
<button id="next-month" class="calendar-nav">></button>
|
|
</div>
|
|
<div class="calendar-grid">
|
|
<div class="calendar-weekdays">
|
|
<div>Sun</div>
|
|
<div>Mon</div>
|
|
<div>Tue</div>
|
|
<div>Wed</div>
|
|
<div>Thu</div>
|
|
<div>Fri</div>
|
|
<div>Sat</div>
|
|
</div>
|
|
<div class="calendar-days" id="calendar-days">
|
|
<!-- Days will be populated by JavaScript -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button class="btn btn-secondary" id="cancel-date">Cancel</button>
|
|
<button class="btn btn-primary" id="confirm-date" disabled>Generate Report</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{% endblock %}
|
|
|