ske087/quality_recticel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

updated view in label preview

Browse Source
This commit is contained in:
Quality System Admin
2025-10-27 20:25:31 +02:00
parent d142129de6
commit a960285d59
15 changed files with 1889 additions and 685 deletions
Download Patch File Download Diff File Expand all files Collapse all files

214
py_app/app/templates/print_lost_labels.html
View File

@@ -1,170 +1,26 @@
{% extends "base.html" %}
{% block head %}
<style>
/* TABLE STYLING - Same as view_orders.html */
table.view-orders-table.scan-table {
margin: 0 !important;
border-spacing: 0 !important;
border-collapse: collapse !important;
width: 100% !important;
table-layout: fixed !important;
font-size: 11px !important;
}
table.view-orders-table.scan-table thead th {
height: 85px !important;
min-height: 85px !important;
max-height: 85px !important;
vertical-align: middle !important;
text-align: center !important;
white-space: normal !important;
word-wrap: break-word !important;
line-height: 1.3 !important;
padding: 6px 3px !important;
font-size: 11px !important;
background-color: #e9ecef !important;
font-weight: bold !important;
text-transform: none !important;
letter-spacing: 0 !important;
overflow: visible !important;
box-sizing: border-box !important;
border: 1px solid #ddd !important;
text-overflow: clip !important;
position: relative !important;
}
table.view-orders-table.scan-table tbody td {
padding: 4px 2px !important;
font-size: 10px !important;
text-align: center !important;
border: 1px solid #ddd !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
vertical-align: middle !important;
}
table.view-orders-table.scan-table td:nth-child(1) { width: 50px !important; }
table.view-orders-table.scan-table td:nth-child(2) { width: 80px !important; }
table.view-orders-table.scan-table td:nth-child(3) { width: 80px !important; }
table.view-orders-table.scan-table td:nth-child(4) { width: 150px !important; }
table.view-orders-table.scan-table td:nth-child(5) { width: 70px !important; }
table.view-orders-table.scan-table td:nth-child(6) { width: 80px !important; }
table.view-orders-table.scan-table td:nth-child(7) { width: 75px !important; }
table.view-orders-table.scan-table td:nth-child(8) { width: 90px !important; }
table.view-orders-table.scan-table td:nth-child(9) { width: 70px !important; }
table.view-orders-table.scan-table td:nth-child(10) { width: 100px !important; }
table.view-orders-table.scan-table td:nth-child(11) { width: 90px !important; }
table.view-orders-table.scan-table td:nth-child(12) { width: 70px !important; }
table.view-orders-table.scan-table td:nth-child(13) { width: 50px !important; }
table.view-orders-table.scan-table td:nth-child(14) { width: 70px !important; }
table.view-orders-table.scan-table td:nth-child(15) { width: 100px !important; }
table.view-orders-table.scan-table tbody tr:hover td {
background-color: #f8f9fa !important;
}
table.view-orders-table.scan-table tbody tr.selected td {
background-color: #007bff !important;
color: white !important;
}
.report-table-card h3 {
margin: 0 0 15px 0 !important;
padding: 0 !important;
}
.report-table-card {
padding: 15px !important;
}
/* Search card styling */
.search-card {
margin-bottom: 20px;
padding: 20px;
}
.search-field {
width: 100%;
max-width: 400px;
padding: 8px;
font-size: 14px;
border: 1px solid #ddd;
border-radius: 4px;
}
.quantity-field {
width: 100px;
padding: 8px;
font-size: 14px;
border: 1px solid #ddd;
border-radius: 4px;
}
.search-result-table {
margin-top: 15px;
margin-bottom: 15px;
}
.print-btn {
background-color: #28a745;
color: white;
padding: 10px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 14px;
}
.print-btn:hover {
background-color: #218838;
}
.print-btn:disabled {
background-color: #6c757d;
cursor: not-allowed;
}
/* Force barcode SVG elements to be black */
#barcode-display rect,
#vertical-barcode-display rect {
fill: #000000 !important;
stroke: #000000 !important;
}
#barcode-display path,
#vertical-barcode-display path {
fill: #000000 !important;
stroke: #000000 !important;
}
/* Ensure barcode frames have proper contrast */
#barcode-frame,
#vertical-barcode-frame {
background: #ffffff !important;
border: 1px solid #ddd;
}
</style>
<!-- Print Module CSS is now loaded via base.html for all printing pages -->
{% endblock %}
{% block content %}
<!-- ROW 1: Search Card (full width) -->
<div class="scan-container" style="display: flex; flex-direction: column; gap: 0; width: 100%;">
<div class="card search-card" style="width: 100%; max-height: 100px; min-height: 70px; display: flex; align-items: center; flex-wrap: wrap; margin-bottom: 24px;">
<div style="flex: 1 1 300px; min-width: 250px;">
<label for="search-input" style="font-weight: bold;">Search Order (CP...):</label>
<input type="text" id="search-input" class="search-field" placeholder="Type to search..." oninput="searchOrder()" style="margin-left: 10px; max-width: 250px;">
<button id="fetch-matching-btn" class="btn btn-secondary" style="margin-left: 10px; padding: 7px 16px; font-size: 14px;" onclick="fetchMatchingOrders()">Find All</button>
<div class="scan-container lost-labels">
<div class="card search-card">
<div style="display: flex; align-items: center; gap: 15px; flex-wrap: wrap;">
<label for="search-input" style="font-weight: bold; white-space: nowrap;">Search Order (CP...):</label>
<input type="text" id="search-input" class="search-field" placeholder="Type to search..." oninput="searchOrder()" style="flex: 1; min-width: 200px; max-width: 300px;">
<button id="fetch-matching-btn" class="btn btn-secondary" style="padding: 7px 16px; font-size: 14px; white-space: nowrap;" onclick="fetchMatchingOrders()">Find All</button>
</div>
</div>
<!-- ROW 2: Two cards side by side -->
<div style="display: flex; flex-direction: row; gap: 24px; width: 100%; align-items: flex-start;">
<!-- Print Preview Card (left, with all print_module.html controls) -->
<div class="card scan-form-card" style="display: flex; flex-direction: column; justify-content: flex-start; align-items: center; min-height: 700px; width: 330px; flex-shrink: 0; position: relative; padding: 15px;">
<!-- ROW 2: Two cards side by side (25% / 75% layout) -->
<div class="row-container">
<!-- Print Preview Card (left, 25% width) -->
<div class="card scan-form-card" style="display: flex; flex-direction: column; justify-content: flex-start; align-items: center; min-height: 700px; flex: 0 0 25%; position: relative; padding: 15px;">
<div class="label-view-title" style="width: 100%; text-align: center; padding: 0 0 15px 0; font-size: 18px; font-weight: bold; letter-spacing: 0.5px;">Label View</div>
<!-- Pairing Keys Section -->
<div style="width: 100%; text-align: center; margin-bottom: 15px;">
@@ -175,9 +31,9 @@ table.view-orders-table.scan-table tbody tr.selected td {
<a href="{{ url_for('main.download_extension') }}" class="btn btn-info btn-sm" target="_blank" style="font-size: 11px; padding: 4px 12px;">🔑 Manage Keys</a>
</div>
<!-- Label Preview Section -->
<div id="label-preview" style="border: 1px solid #ddd; padding: 10px; position: relative; background: #fafafa; width: 301px; height: 434.7px;">
<div id="label-preview" style="padding: 10px; position: relative; background: #fafafa; width: 301px; height: 434.7px;">
<!-- ...label content rectangle and barcode frames as in print_module.html... -->
<div id="label-content" style="position: absolute; top: 65.7px; left: 11.34px; width: 227.4px; height: 321.3px; border: 2px solid #333; background: white;">
<div id="label-content" style="position: absolute; top: 65.7px; left: 11.34px; width: 227.4px; height: 321.3px; background: white;">
<div style="position: absolute; top: 0; left: 0; right: 0; height: 32.13px; display: flex; align-items: center; justify-content: center; font-weight: bold; font-size: 12px; color: #000; z-index: 10;">INNOFA ROMANIA SRL</div>
<div id="customer-name-row" style="position: absolute; top: 32.13px; left: 0; right: 0; height: 32.13px; display: flex; align-items: center; justify-content: center; font-size: 11px; color: #000;"></div>
<div style="position: absolute; top: 32.13px; left: 0; right: 0; height: 1px; background: #999;"></div>
@@ -204,13 +60,13 @@ table.view-orders-table.scan-table tbody tr.selected td {
<div style="position: absolute; top: 289.17px; left: 0; width: 90.96px; height: 32.13px; display: flex; align-items: center; padding-left: 5px; font-size: 10px; color: #000;">Prod. order</div>
<div id="prod-order-value" style="position: absolute; top: 289.17px; left: 90.96px; width: 136.44px; height: 32.13px; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: bold; color: #000;"></div>
</div>
<div id="barcode-frame" style="position: absolute; top: 395px; left: 50%; transform: translateX(-50%); width: 90%; max-width: 270px; height: 50px; background: white; display: flex; flex-direction: column; align-items: center; justify-content: center;">
<svg id="barcode-display" style="width: 100%; height: 40px;"></svg>
<div id="barcode-text" style="font-size: 8px; font-family: 'Courier New', monospace; margin-top: 2px; text-align: center; font-weight: bold;"></div>
<div id="barcode-frame">
<svg id="barcode-display"></svg>
<div id="barcode-text"></div>
</div>
<div id="vertical-barcode-frame" style="position: absolute; top: 50px; left: 270px; width: 321.3px; height: 40px; background: white; display: flex; align-items: center; justify-content: center; transform: rotate(90deg); transform-origin: left center;">
<svg id="vertical-barcode-display" style="width: 100%; height: 35px;"></svg>
<div id="vertical-barcode-text" style="position: absolute; bottom: -15px; font-size: 7px; font-family: 'Courier New', monospace; text-align: center; font-weight: bold; width: 100%;"></div>
<div id="vertical-barcode-frame">
<svg id="vertical-barcode-display"></svg>
<div id="vertical-barcode-text"></div>
</div>
</div>
<!-- Print Options (copied from print_module.html) -->
@@ -220,17 +76,22 @@ table.view-orders-table.scan-table tbody tr.selected td {
<div id="print-method-label" style="font-size: 12px; font-weight: 600; color: #495057; margin-bottom: 8px;">
📄 Print Method:
</div>
<div class="form-check" style="margin-bottom: 6px;">
<input class="form-check-input" type="radio" name="printMethod" id="qzTrayPrint" value="qztray" checked>
<label class="form-check-label" for="qzTrayPrint" style="font-size: 11px; line-height: 1.2;">
<strong>🖨️ Direct Print</strong> <span id="qztray-status" class="badge badge-success" style="font-size: 9px; padding: 2px 6px;">Ready</span>
</label>
</div>
<div class="form-check" id="pdf-option-container" style="display: none; margin-bottom: 6px;">
<input class="form-check-input" type="radio" name="printMethod" id="pdfGenerate" value="pdf">
<label class="form-check-label" for="pdfGenerate" style="font-size: 11px; line-height: 1.2;">
<strong>📄 PDF Export</strong> <span class="text-muted" style="font-size: 10px;">(fallback)</span>
</label>
<!-- Print method options in horizontal layout -->
<div style="display: flex; gap: 15px; flex-wrap: wrap;">
<div class="form-check" style="margin-bottom: 6px;">
<input class="form-check-input" type="radio" name="printMethod" id="qzTrayPrint" value="qztray" checked>
<label class="form-check-label" for="qzTrayPrint" style="font-size: 11px; line-height: 1.2;">
<strong>🖨️ Direct Print</strong> <span id="qztray-status" class="badge badge-success" style="font-size: 9px; padding: 2px 6px;">Ready</span>
</label>
</div>
<div class="form-check" id="pdf-option-container" style="display: none; margin-bottom: 6px;">
<input class="form-check-input" type="radio" name="printMethod" id="pdfGenerate" value="pdf">
<label class="form-check-label" for="pdfGenerate" style="font-size: 11px; line-height: 1.2;">
<strong>📄 PDF Export</strong> <span class="text-muted" style="font-size: 10px;">(fallback)</span>
</label>
</div>
</div>
</div>
<!-- Printer Selection for QZ Tray (Compact) -->
@@ -277,10 +138,9 @@ table.view-orders-table.scan-table tbody tr.selected td {
</div>
</div>
</div>
<!-- Orders Table Card (right, with load button and notification system) -->
<div class="card scan-table-card" style="min-height: 700px; width: calc(100% - 350px); margin: 0;">
<!-- Orders Table Card (right, 75% width) -->
<div class="card scan-table-card" style="min-height: 700px; flex: 0 0 75%; margin: 0;">
<h3>Data Preview</h3>
<button id="check-db-btn" class="btn btn-primary mb-3">Load Orders</button>
<div class="report-table-container">
<table class="scan-table print-module-table">
<thead>