<?php
/**
 * Rig N Dig - Live Order Tracker (Pioneer Suite)
 * Public Tracking Interface
 */
require_once __DIR__ . '/config/config.php';
require_once __DIR__ . '/includes/functions.php';

$pageTitle = 'Live Technical Tracker';
$invoice = null;
$error = '';
$milestone = 'processed';

if (isset($_GET['inv'])) {
    $inv_num = sanitize($_GET['inv']);
    $invoice = Database::fetchOne("
        SELECT i.*, c.company_name as customer_name 
        FROM invoices i 
        LEFT JOIN customers c ON i.customer_id = c.id 
        WHERE i.invoice_number = ?
    ", [$inv_num]);
    
    if (!$invoice) {
        $error = "Asset ID not found in the tracking network.";
    } else {
        $milestone = $invoice['milestone'] ?? 'processed';
        $certs = Database::fetchAll("SELECT * FROM certificates WHERE invoice_id = ?", [$invoice['id']]);
    }
}

include __DIR__ . '/includes/header.php';
?>

<section class="min-h-screen pt-32 pb-20 bg-navy-950">
    <div class="max-w-4xl mx-auto px-4">
        <!-- Search Header -->
        <div class="text-center mb-12">
            <h1 class="text-4xl font-black font-display text-white mb-4 italic tracking-tighter">TECHNICAL <span class="text-orange-500">TRACKER</span></h1>
            <p class="text-gray-500 font-bold text-xs uppercase tracking-widest">Real-Time Industrial Asset Movement Protocol</p>
        </div>

        <div class="card-dark p-8 border-orange-600/20 mb-12">
            <form method="GET" class="flex gap-4">
                <input type="text" name="inv" value="<?= e($_GET['inv'] ?? '') ?>" placeholder="Enter Invoice or Asset ID (e.g. INV-00001)" class="input-field flex-1 text-center font-mono text-lg tracking-widest" required>
                <button type="submit" class="btn-primary px-8 font-black uppercase tracking-widest text-xs">Analyze Status</button>
            </form>
            <?php if ($error): ?>
                <div class="mt-4 text-center text-red-500 text-xs font-bold uppercase tracking-widest"><?= $error ?></div>
            <?php endif; ?>
        </div>

        <?php if ($invoice): ?>
        <!-- Tracking Matrix -->
        <div class="mb-16">
            <div class="flex items-center justify-between mb-8 pb-4 border-b border-navy-700">
                <div>
                    <h2 class="text-lg font-black text-white uppercase tracking-tight">Order Identification: <span class="text-orange-500"><?= e($invoice['invoice_number']) ?></span></h2>
                    <p class="text-xs text-gray-500 font-bold uppercase tracking-widest mt-1">Client: <?= e($invoice['customer_name']) ?></p>
                </div>
                <div class="text-right">
                    <div class="text-[10px] font-black text-gray-400 uppercase tracking-widest">Verification Status</div>
                    <div class="text-xs font-black text-green-500 uppercase flex items-center gap-1 justify-end">
                        <span class="w-1.5 h-1.5 rounded-full bg-green-500 animate-pulse"></span> Authentic
                    </div>
                </div>
            </div>

            <!-- Milestone Timeline -->
            <div class="relative py-12 px-6">
                <!-- Vertical Progress Line -->
                <div class="absolute left-1/2 top-0 w-px h-full bg-navy-800 -translate-x-1/2"></div>
                
                <?php
                $steps = [
                    ['processed', 'Order Processed', 'RFP confirmed and technical specs audited.', '⚙️'],
                    ['sourcing', 'Global Sourcing', 'Procurement from international hubs initiated.', '🌐'],
                    ['workshop', 'Workshop/Manufacturing', 'Precision machining or assembly in progress.', '🏗️'],
                    ['testing', 'Technical Validation', 'Quality control and API compliance testing.', '🎯'],
                    ['dispatched', 'Asset Dispatched', 'Transit to client headquarters or rig site.', '🚛'],
                    ['delivered', 'Final Delivery', 'Material received and technical handover complete.', '🏁'],
                ];
                
                $reached = false;
                $active_found = false;
                foreach ($steps as $i => [$code, $name, $desc, $icon]): 
                    $is_done = false;
                    $is_active = false;
                    
                    if (!$active_found) {
                        if ($code === $milestone) {
                            $is_active = true;
                            $active_found = true;
                        } else {
                            $is_done = true;
                        }
                    }
                ?>
                <div class="relative z-10 grid grid-cols-2 gap-20 mb-16 last:mb-0">
                    <!-- Left: Metadata (Even steps right, Odd steps left design) -->
                    <div class="<?= $i % 2 === 0 ? 'text-right' : 'order-2 text-left' ?>">
                        <div class="text-2xl mb-2 opacity-50"><?= $icon ?></div>
                        <h4 class="text-sm font-black <?= $is_done ? 'text-orange-500' : ($is_active ? 'text-white' : 'text-gray-600') ?> uppercase tracking-widest mb-2"><?= $name ?></h4>
                        <p class="text-xs text-gray-500 leading-relaxed font-medium"><?= $desc ?></p>
                    </div>
                    
                    <!-- Middle: Node -->
                    <div class="absolute left-1/2 -translate-x-1/2 flex flex-col items-center">
                        <div class="w-8 h-8 rounded-xl <?= $is_done ? 'bg-orange-600 shadow-[0_0_15px_rgba(255,107,0,0.4)]' : ($is_active ? 'bg-white border-4 border-orange-600' : 'bg-navy-900 border border-navy-700') ?> flex items-center justify-center transition-all duration-500">
                            <?php if ($is_done): ?>
                                <span class="text-xs">✓</span>
                            <?php elseif ($is_active): ?>
                                <span class="w-2 h-2 bg-orange-600 rounded-full animate-ping"></span>
                            <?php endif; ?>
                        </div>
                    </div>

                    <!-- Right: Aesthetic Spacer -->
                    <div class="<?= $i % 2 === 0 ? 'order-2' : '' ?>"></div>
                </div>
                <?php endforeach; ?>
            </div>
        </div>

        <!-- Technical Vault for Client -->
        <?php if (!empty($certs)): ?>
        <div class="card-dark p-8 border-navy-700 border-t-2 border-t-orange-600">
            <h3 class="text-sm font-black text-white uppercase tracking-widest mb-6 flex items-center gap-3">
                <span class="text-orange-500 text-lg">🛡️</span>
                Technical Asset Vault
            </h3>
            <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                <?php foreach ($certs as $c): ?>
                <div class="bg-navy-900 p-4 rounded-xl border border-white/5 flex items-center justify-between group hover:border-orange-600/50 transition-all">
                    <div>
                        <div class="text-xs font-bold text-white"><?= e($c['title']) ?></div>
                        <div class="text-[9px] text-gray-500 font-bold uppercase tracking-[0.2em] mt-1"><?= e($c['cert_type']) ?> — SN: <?= e($c['serial_number']) ?></div>
                    </div>
                    <a href="/uploads/<?= e($c['file_path']) ?>" target="_blank" class="bg-navy-800 text-orange-500 w-10 h-10 flex items-center justify-center rounded-lg group-hover:bg-orange-600 group-hover:text-white transition-all">💾</a>
                </div>
                <?php endforeach; ?>
            </div>
        </div>
        <?php endif; ?>

        <?php endif; ?>
    </div>
</section>

<?php include __DIR__ . '/includes/footer.php'; ?>
