frappe.pages["route-planner"].on_page_load = function(wrapper) {
    var page = frappe.ui.make_app_page({
        parent: wrapper,
        title: "Route Planner",
        single_column: true
    });
    
    frappe.call({
        method: "westech_r2.api.optimize_routes.get_scheduled_pickups",
        callback: function(r) {
            if (r.message) {
                renderRoutePlanner(page, r.message);
            }
        }
    });
    
    function renderRoutePlanner(page, data) {
        var h = "<div style='padding:20px;'>";
        h += "<h2>Route Planner</h2>";
        h += "<p>Schedule and optimize pickup routes.</p>";
        h += "<div id='route-map' style='width:100%;height:400px;background:#f0f0f0;margin:20px 0;'></div>";
        h += "<button class='btn btn-primary' id='optimize-btn'>Optimize Routes</button>";
        h += "<div id='routes-container' style='margin-top:20px;'></div>";
        h += "</div>";
        $(page.body).html(h);
        
        $("#optimize-btn").on("click", function() {
            frappe.call({
                method: "westech_r2.api.optimize_routes.optimize_routes",
                callback: function(r) {
                    if (r.message) {
                        frappe.show_alert({message: "Routes optimized", indicator: "green"});
                    }
                }
            });
        });
    }
};