frappe.pages["load-detail"].on_page_load = function(wrapper) {
    var page = frappe.ui.make_app_page({
        parent: wrapper,
        title: "Load Detail",
        single_column: true
    });
    
    var loadName = frappe.utils.get_url_arg("load");
    if (!loadName) {
        $(page.body).html("<div style='padding:40px;text-align:center;'><h2>No load specified</h2><p>Use ?load=MMDDYYYY-XXXX</p></div>");
        return;
    }
    
    frappe.call({
        method: "frappe.client.get",
        args: { doctype: "Load", name: loadName },
        callback: function(r) {
            if (r.message) { showLoad(page, r.message); }
            else { $(page.body).html("<div style='padding:40px;text-align:center;'><h2>Load not found</h2></div>"); }
        }
    });
    
    function showLoad(page, load) {
        var h = "<div style='padding:20px;'>";
        h += "<div style='background:#f8f9fa;padding:15px;border-radius:8px;margin-bottom:20px;'>";
        h += "<h2>Load: " + load.name + "</h2>";
        h += "<div>In Date: " + (load.incoming_date || "N/A") + " | Customer: " + (load.customer_name || load.customer_number || "N/A") + "</div>";
        h += "<div>Devices: " + (load.total_devices || 0) + " | Weight: " + (load.total_weight || 0) + " lbs</div>";
        h += "</div>";
        h += "<button class='btn btn-primary' onclick='window.print()' style='margin-bottom:15px;'>Print Data Tracking Worksheet</button> ";
        h += "<a href='/app/load/" + encodeURIComponent(load.name) + "' class='btn btn-default' style='margin-bottom:15px;'>Open Form View</a> ";
        h += "<a href='/app/load-update?load=" + encodeURIComponent(load.name) + "' class='btn btn-default' style='margin-bottom:15px;'>Edit Load</a>";
        h += "<table style='width:100%;border-collapse:collapse;font-size:13px;margin-top:20px;'>";
        h += "<thead><tr style='background:#37474f;color:white;'>";
        h += "<th>Material Type</th><th>Count</th><th>Rcv Status</th><th>Send To</th>";
        h += "<th>Recv'd</th><th>HDD Out</th><th>Dis Send To</th>";
        h += "<th>Sanitized</th><th>Test Status</th><th>Test Send</th>";
        h += "<th>R2 Sent</th><th>Phys</th><th>HDD Need</th><th>HDD Phys</th><th>HDD Logic</th>";
        h += "</tr></thead><tbody>";
        
        if (load.material_items && load.material_items.length > 0) {
            load.material_items.forEach(function(item) {
                h += "<tr style='border-bottom:1px solid #e0e0e0;'>";
                h += "<td><strong>" + (item.material_type || "") + "</strong></td>";
                h += "<td style='text-align:right;'>" + (item.total_count || 0) + "</td>";
                h += "<td>" + (item.initial_data_status || "") + "</td>";
                h += "<td>" + (item.send_to || "") + "</td>";
                h += "<td style='text-align:right;'>" + (item.devices_received || 0) + "</td>";
                h += "<td style='text-align:right;'>" + (item.hdd_removed || 0) + "</td>";
                h += "<td>" + (item.disassembly_send_to || "") + "</td>";
                h += "<td style='text-align:right;'>" + (item.units_sanitized_software || 0) + "</td>";
                h += "<td>" + (item.test_data_status || "") + "</td>";
                h += "<td>" + (item.test_send_to || "") + "</td>";
                h += "<td style='text-align:right;'>" + (item.r2_units_sent || 0) + "</td>";
                h += "<td style='text-align:right;'>" + (item.units_physical_destruction || 0) + "</td>";
                h += "<td style='text-align:right;'>" + (item.hdd_needs_sanitize || 0) + "</td>";
                h += "<td style='text-align:right;'>" + (item.hdd_physical_destruction || 0) + "</td>";
                h += "<td style='text-align:right;'>" + (item.hdd_logical_sanitization || 0) + "</td>";
                h += "</tr>";
            });
        }
        h += "</tbody></table></div>";
        $(page.body).html(h);
    }
};