diff --git a/py_app/app/templates/print_module.html b/py_app/app/templates/print_module.html index 0363ed1..f09cabb 100644 --- a/py_app/app/templates/print_module.html +++ b/py_app/app/templates/print_module.html @@ -7,13 +7,120 @@ position: relative; overflow: hidden; } + +/* Enhanced table styling to match view_orders.html with higher specificity */ +.card.scan-table-card table.print-module-table.scan-table { + width: 100% !important; + margin-bottom: 1rem !important; + color: #212529 !important; + border-collapse: collapse !important; +} + +.card.scan-table-card table.print-module-table.scan-table thead th { + vertical-align: bottom !important; + border-bottom: 2px solid #dee2e6 !important; + background-color: #f8f9fa !important; + padding: 0.25rem 0.4rem !important; + text-align: left !important; + font-weight: 600 !important; + font-size: 10px !important; + line-height: 1.2 !important; +} + +.card.scan-table-card table.print-module-table.scan-table tbody td { + padding: 0.25rem 0.4rem !important; + vertical-align: middle !important; + border-top: 1px solid #dee2e6 !important; + font-size: 9px !important; + line-height: 1.2 !important; +} + +/* HOVER EFFECTS - Higher specificity */ +.card.scan-table-card table.print-module-table.scan-table tbody tr:hover td { + background-color: #f8f9fa !important; + cursor: pointer !important; +} + +.card.scan-table-card table.print-module-table.scan-table tbody tr:not(.selected):hover td { + background-color: #f8f9fa !important; +} + +/* ROW SELECTION STYLES - Maximum specificity */ +.card.scan-table-card table.print-module-table.scan-table tbody tr.selected td { + background-color: #007bff !important; + background: #007bff !important; + color: white !important; + border-color: #0056b3 !important; +} + +.card.scan-table-card table.print-module-table.scan-table tbody tr.selected:hover td { + background-color: #0056b3 !important; + background: #0056b3 !important; + color: white !important; + border-color: #004085 !important; +} + +.card.scan-table-card table.print-module-table.scan-table tbody tr.selected td span { + color: white !important; +} + +/* Additional universal overrides for selection */ +tr.selected td { + background-color: #007bff !important; + background: #007bff !important; + color: white !important; +} + +tbody tr.selected td { + background-color: #007bff !important; + background: #007bff !important; + color: white !important; +} + +table tbody tr.selected td { + background-color: #007bff !important; + background: #007bff !important; + color: white !important; +} + +/* COLUMN WIDTH SPECIFICATIONS - Higher specificity */ +.card.scan-table-card table.print-module-table.scan-table th:nth-child(1), +.card.scan-table-card table.print-module-table.scan-table td:nth-child(1) { width: 50px !important; } /* ID */ +.card.scan-table-card table.print-module-table.scan-table th:nth-child(2), +.card.scan-table-card table.print-module-table.scan-table td:nth-child(2) { width: 80px !important; } /* Comanda Productie */ +.card.scan-table-card table.print-module-table.scan-table th:nth-child(3), +.card.scan-table-card table.print-module-table.scan-table td:nth-child(3) { width: 80px !important; } /* Cod Articol */ +.card.scan-table-card table.print-module-table.scan-table th:nth-child(4), +.card.scan-table-card table.print-module-table.scan-table td:nth-child(4) { width: 150px !important; } /* Descr Com Prod */ +.card.scan-table-card table.print-module-table.scan-table th:nth-child(5), +.card.scan-table-card table.print-module-table.scan-table td:nth-child(5) { width: 70px !important; } /* Cantitate */ +.card.scan-table-card table.print-module-table.scan-table th:nth-child(6), +.card.scan-table-card table.print-module-table.scan-table td:nth-child(6) { width: 80px !important; } /* Data Livrare */ +.card.scan-table-card table.print-module-table.scan-table th:nth-child(7), +.card.scan-table-card table.print-module-table.scan-table td:nth-child(7) { width: 75px !important; } /* Dimensiune */ +.card.scan-table-card table.print-module-table.scan-table th:nth-child(8), +.card.scan-table-card table.print-module-table.scan-table td:nth-child(8) { width: 90px !important; } /* Com Achiz Client */ +.card.scan-table-card table.print-module-table.scan-table th:nth-child(9), +.card.scan-table-card table.print-module-table.scan-table td:nth-child(9) { width: 70px !important; } /* Nr Linie */ +.card.scan-table-card table.print-module-table.scan-table th:nth-child(10), +.card.scan-table-card table.print-module-table.scan-table td:nth-child(10) { width: 100px !important; } /* Customer Name */ +.card.scan-table-card table.print-module-table.scan-table th:nth-child(11), +.card.scan-table-card table.print-module-table.scan-table td:nth-child(11) { width: 90px !important; } /* Customer Art Nr */ +.card.scan-table-card table.print-module-table.scan-table th:nth-child(12), +.card.scan-table-card table.print-module-table.scan-table td:nth-child(12) { width: 70px !important; } /* Open Order */ +.card.scan-table-card table.print-module-table.scan-table th:nth-child(13), +.card.scan-table-card table.print-module-table.scan-table td:nth-child(13) { width: 50px !important; } /* Line */ +.card.scan-table-card table.print-module-table.scan-table th:nth-child(14), +.card.scan-table-card table.print-module-table.scan-table td:nth-child(14) { width: 70px !important; } /* Printed */ +.card.scan-table-card table.print-module-table.scan-table th:nth-child(15), +.card.scan-table-card table.print-module-table.scan-table td:nth-child(15) { width: 100px !important; } /* Created */ {% endblock %} {% block content %} -
+
-
+

Label Preview

@@ -106,9 +213,9 @@
-
+
-
+
@@ -130,25 +237,25 @@
-
+

Data Preview (Unprinted Orders)

- +
- - - + + + - - - - - + + + + + @@ -169,79 +276,81 @@ document.getElementById('check-db-btn').addEventListener('click', function() { .then(data => { const tbody = document.getElementById('unprinted-orders-table'); tbody.innerHTML = ''; - data.forEach(order => { + data.forEach((order, index) => { const tr = document.createElement('tr'); + tr.dataset.orderId = order.id; + tr.dataset.orderIndex = index; + tr.style.cursor = 'pointer'; tr.innerHTML = ` - - - - - - + + + + + - - - - - - - - + + + + + + + - `; + + // Add click event for row selection + tr.addEventListener('click', function() { + console.log('Row clicked:', order.order_number); + + // Remove selection from other rows + document.querySelectorAll('.print-module-table tbody tr').forEach(row => { + row.classList.remove('selected'); + // Clear inline styles + const cells = row.querySelectorAll('td'); + cells.forEach(cell => { + cell.style.backgroundColor = ''; + cell.style.color = ''; + }); + }); + + // Select this row + this.classList.add('selected'); + console.log('Row selected, classes:', this.className); + + // Force visual selection with inline styles + const cells = this.querySelectorAll('td'); + cells.forEach(cell => { + cell.style.backgroundColor = '#007bff'; + cell.style.color = 'white'; + }); + + // Update label preview with selected order data + updateLabelPreview(order); + }); + tbody.appendChild(tr); }); - // Update the label preview with customer name from first row + // Update the label preview with first row by default if (data.length > 0) { - const customerName = data[0].customer_name || 'N/A'; - document.getElementById('customer-name-row').textContent = customerName; + updateLabelPreview(data[0]); - // Update quantity ordered value - const quantity = data[0].cantitate || '0'; - document.getElementById('quantity-ordered-value').textContent = quantity; - - // Update client order info (Com.Achiz.Client - Nr. Linie) - const comAchizClient = data[0].com_achiz_client || ''; - const nrLinie = data[0].nr_linie_com_client || ''; - const clientOrderInfo = comAchizClient && nrLinie ? `${comAchizClient}-${nrLinie}` : 'N/A'; - document.getElementById('client-order-info').textContent = clientOrderInfo; - - // Update vertical barcode with client order info or default - const verticalBarcodeData = clientOrderInfo !== 'N/A' ? clientOrderInfo : '000000-00'; - document.getElementById('vertical-barcode-text').textContent = verticalBarcodeData; - - // Update delivery date (using data_livrare column) - const deliveryDate = data[0].data_livrare ? new Date(data[0].data_livrare).toLocaleDateString() : 'N/A'; - document.getElementById('delivery-date-value').textContent = deliveryDate; - - // Update size (using dimensiune column) - const size = data[0].dimensiune || 'N/A'; - document.getElementById('size-value').textContent = size; - - // Update description (Descr. Com. Prod) - const description = data[0].descr_com_prod || 'N/A'; - document.getElementById('description-value').textContent = description; - - // Update article code (using customer_article_number column) - const articleCode = data[0].customer_article_number || 'N/A'; - document.getElementById('article-code-value').textContent = articleCode; - - // Update prod order (comanda_productie - cantitate) - const comandaProductie = data[0].comanda_productie || ''; - const cantitate = data[0].cantitate || ''; - const prodOrder = comandaProductie && cantitate ? `${comandaProductie}-${cantitate}` : 'N/A'; - document.getElementById('prod-order-value').textContent = prodOrder; - - // Update barcode with the same prod order data - document.getElementById('barcode-text').textContent = prodOrder; + // Auto-select first row + setTimeout(() => { + const firstRow = document.querySelector('.print-module-table tbody tr'); + if (firstRow) { + firstRow.classList.add('selected'); + } + }, 100); } else { document.getElementById('customer-name-row').textContent = 'No data available'; document.getElementById('quantity-ordered-value').textContent = '0'; @@ -269,5 +378,50 @@ document.getElementById('check-db-btn').addEventListener('click', function() { document.getElementById('vertical-barcode-text').textContent = '000000-00'; }); }); + +// Function to update label preview with selected order data +function updateLabelPreview(order) { + const customerName = order.customer_name || 'N/A'; + document.getElementById('customer-name-row').textContent = customerName; + + // Update quantity ordered value + const quantity = order.cantitate || '0'; + document.getElementById('quantity-ordered-value').textContent = quantity; + + // Update client order info (Com.Achiz.Client - Nr. Linie) + const comAchizClient = order.com_achiz_client || ''; + const nrLinie = order.nr_linie_com_client || ''; + const clientOrderInfo = comAchizClient && nrLinie ? `${comAchizClient}-${nrLinie}` : 'N/A'; + document.getElementById('client-order-info').textContent = clientOrderInfo; + + // Update vertical barcode with client order info or default + const verticalBarcodeData = clientOrderInfo !== 'N/A' ? clientOrderInfo : '000000-00'; + document.getElementById('vertical-barcode-text').textContent = verticalBarcodeData; + + // Update delivery date (using data_livrare column) + const deliveryDate = order.data_livrare ? new Date(order.data_livrare).toLocaleDateString() : 'N/A'; + document.getElementById('delivery-date-value').textContent = deliveryDate; + + // Update size (using dimensiune column) + const size = order.dimensiune || 'N/A'; + document.getElementById('size-value').textContent = size; + + // Update description (Descr. Com. Prod) + const description = order.descr_com_prod || 'N/A'; + document.getElementById('description-value').textContent = description; + + // Update article code (using customer_article_number column) + const articleCode = order.customer_article_number || 'N/A'; + document.getElementById('article-code-value').textContent = articleCode; + + // Update prod order (comanda_productie - cantitate) + const comandaProductie = order.comanda_productie || ''; + const cantitate = order.cantitate || ''; + const prodOrder = comandaProductie && cantitate ? `${comandaProductie}-${cantitate}` : 'N/A'; + document.getElementById('prod-order-value').textContent = prodOrder; + + // Update barcode with the same prod order data + document.getElementById('barcode-text').textContent = prodOrder; +} {% endblock %} \ No newline at end of file
IDComanda ProductieCod ArticolDescr. Com. ProdComanda
Productie		Cod
Articol		Descr. Com.
Prod		 Cantitate Data
Livrare		 DimensiuneCom.Achiz.ClientNr. LinieCustomer NameCustomer Art. Nr.Open OrderCom.Achiz.
Client		Nr.
Linie		Customer
Name		Customer
Art. Nr.		Open
Order		 Line Printed Created${order.id}${order.comanda_productie}${order.cod_articol || '-'}${order.descr_com_prod}${order.cantitate} + ${order.id}${order.comanda_productie}${order.cod_articol || '-'}${order.descr_com_prod}${order.cantitate} ${order.data_livrare ? new Date(order.data_livrare).toLocaleDateString() : '-'} ${order.dimensiune || '-'}${order.com_achiz_client || '-'}${order.nr_linie_com_client || '-'}${order.customer_name || '-'}${order.customer_article_number || '-'}${order.open_for_order || '-'}${order.line_number || '-'} + ${order.dimensiune || '-'}${order.com_achiz_client || '-'}${order.nr_linie_com_client || '-'}${order.customer_name || '-'}${order.customer_article_number || '-'}${order.open_for_order || '-'}${order.line_number || '-'} ${order.printed_labels == 1 ? '✓ Yes' : '✗ No'} + ${order.created_at ? new Date(order.created_at).toLocaleString() : '-'}