feat: Add Blade templates for ops QR interface (Phase 2)

Create state-driven UI templates: Main Template (ops/order-detail.blade.php): - Display order summary with status, type, customer, date - Render QR code SVG for shop-floor access - Conditionally include state-specific action forms - Show order items, packing details, shipment info Action Templates: - ops/actions/packing.blade.php: Form to input weight/dimensions - ops/actions/inspection.blade.php: Pass/Fail inspection with optional notes - ops/actions/read-only.blade.php: Status display for read-only states Error Pages: - ops/order-not-found.blade.php: Invalid/expired QR token - ops/unauthorized.blade.php: Insufficient permissions All forms use AJAX submission with confirmation dialogs
2026-01-02 18:57:21 +02:00
parent 74525e8955
commit bb6b92df10
6 changed files with 430 additions and 0 deletions
@@ -0,0 +1,81 @@
+<!-- Inspection Actions -->
+<div class="bg-white rounded-lg shadow-md p-6 mb-8">
+    <h2 class="text-2xl font-bold mb-4">🔍 Inspection</h2>
+    
+    <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
+        <!-- Inspection Passed -->
+        <div class="border-2 border-green-200 rounded-lg p-4">
+            <h3 class="text-lg font-semibold text-green-700 mb-3">✓ Passed Inspection</h3>
+            <p class="text-gray-600 mb-4">Quality check completed - proceed to packing</p>
+            
+            <form action="{{ route('ops.order.inspection-passed', $order) }}" method="POST">
+                @csrf
+                <button
+                    type="submit"
+                    class="w-full bg-green-600 hover:bg-green-700 text-white font-bold py-2 px-4 rounded transition duration-200"
+                >
+                    Mark as Passed
+                </button>
+            </form>
+        </div>
+
+        <!-- Inspection Failed -->
+        <div class="border-2 border-red-200 rounded-lg p-4">
+            <h3 class="text-lg font-semibold text-red-700 mb-3">✗ Flag Issue</h3>
+            <p class="text-gray-600 mb-4">Quality issue detected - needs review</p>
+            
+            <form id="inspectionFailedForm" action="{{ route('ops.order.inspection-failed', $order) }}" method="POST" class="space-y-3">
+                @csrf
+                
+                <textarea
+                    name="issue_description"
+                    required
+                    maxlength="500"
+                    rows="3"
+                    placeholder="Describe the quality issue..."
+                    class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-red-500"
+                ></textarea>
+                
+                <button
+                    type="submit"
+                    class="w-full bg-red-600 hover:bg-red-700 text-white font-bold py-2 px-4 rounded transition duration-200"
+                >
+                    Flag & Move to Review
+                </button>
+            </form>
+
+            <script>
+                document.getElementById('inspectionFailedForm').addEventListener('submit', async function(e) {
+                    e.preventDefault();
+                    
+                    if (!confirm('Flag this order for review? It will be moved to review status.')) {
+                        return;
+                    }
+                    
+                    const formData = new FormData(this);
+                    
+                    try {
+                        const response = await fetch(this.action, {
+                            method: 'POST',
+                            headers: {
+                                'Accept': 'application/json',
+                            },
+                            body: formData,
+                        });
+                        
+                        const data = await response.json();
+                        
+                        if (response.ok) {
+                            alert('✓ Issue flagged - order moved to review');
+                            window.location.reload();
+                        } else {
+                            alert('Error: ' + (data.message || data.error || 'Unknown error'));
+                        }
+                    } catch (error) {
+                        alert('Error submitting form: ' + error.message);
+                    }
+                });
+            </script>
+        </div>
+    </div>
+</div>