routes updated

public/components/orders-crud.js

@@ -1,4 +1,6 @@
 import { api } from "../lib/api.js";
+import { on } from "../lib/bus.js";
+import { navigateToItem } from "../lib/router.js";
 
 function formatDate(dateStr) {
   if (!dateStr) return "—";
@@ -237,9 +239,21 @@ class OrdersCrud extends HTMLElement {
 
   connectedCallback() {
     this.shadowRoot.getElementById("btnRefresh").onclick = () => this.loadOrders();
+    
+    // Escuchar cambios de ruta para deep-linking
+    this._unsubRouter = on("router:viewChanged", ({ view, params }) => {
+      if (view === "orders" && params.id) {
+        this.selectOrderById(params.id);
+      }
+    });
+    
     this.loadOrders();
   }
 
+  disconnectedCallback() {
+    this._unsubRouter?.();
+  }
+
   async loadOrders() {
     const container = this.shadowRoot.getElementById("ordersTable");
     container.innerHTML = `<div class="empty">Cargando pedidos...</div>`;
@@ -248,6 +262,15 @@ class OrdersCrud extends HTMLElement {
       const result = await api.listRecentOrders({ limit: 50 });
       this.orders = result.items || [];
       this.renderTable();
+      
+      // Si hay un pedido pendiente de selección (deep-link), seleccionarlo
+      if (this._pendingOrderId) {
+        const order = this.orders.find(o => o.id === this._pendingOrderId);
+        if (order) {
+          this.selectOrder(order, { updateUrl: false });
+        }
+        this._pendingOrderId = null;
+      }
     } catch (e) {
       console.error("[orders-crud] Error loading orders:", e);
       container.innerHTML = `<div class="empty">Error cargando pedidos: ${e.message}</div>`;
@@ -319,10 +342,29 @@ class OrdersCrud extends HTMLElement {
     });
   }
 
-  selectOrder(order) {
+  selectOrder(order, { updateUrl = true } = {}) {
     this.selectedOrder = order;
     this.renderTable();
     this.renderDetail();
+    
+    // Actualizar URL
+    if (updateUrl && order) {
+      navigateToItem("orders", order.id);
+    }
+  }
+
+  selectOrderById(orderId) {
+    const id = parseInt(orderId);
+    if (!id) return;
+    
+    // Si ya tenemos los pedidos cargados, buscar y seleccionar
+    const order = this.orders.find(o => o.id === id);
+    if (order) {
+      this.selectOrder(order, { updateUrl: false });
+    } else {
+      // Guardar el ID pendiente para seleccionar después de cargar
+      this._pendingOrderId = id;
+    }
   }
 
   renderDetail() {