Cómo crear una aplicación NiceGUI de varias páginas totalmente interactiva con panel en tiempo real, operaciones CRUD, carga de archivos y chat asíncrono

importar sys importar subproceso subproceso.run([sys.executable, “-m”, “pip”, “install”, “-q”, “nicegui”]check=True) importar subprocesos, tiempo, aleatorio, asyncio, base64, socket desde fecha y hora importar fecha y hora desde nicegui importar interfaz de usuario, clase de eventos Estado: def __init__(self): self.todos = [
{“id”: 1, “task”: “Explore NiceGUI”, “done”: True, “priority”: “High”},
{“id”: 2, “task”: “Build a dashboard”, “done”: False, “priority”: “Medium”},
{“id”: 3, “task”: “Deploy to production”, “done”: False, “priority”: “Low”},
]
self.next_id = 4 self.metrics = {“usuarios”: 1247, “ingresos”: 8420, “pedidos”: 53} self.series = [random.uniform(20, 80) for _ in range(20)]
auto.mensajes = [{“role”: “assistant”,
“text”: “Hi! Type something and I will echo it back.”}]

state = State() def page_shell(active: str) -> Ninguno: dark = ui.dark_mode() cajón = ui.left_drawer(value=True).classes(“bg-grey-2”) con cajón: ui.label(“Navigation”).classes(“text-lg font-bold p-2”) para etiqueta, ruta, icono en [
(“Dashboard”, “/”, “dashboard”),
(“Todos”, “/todos”, “check_circle”),
(“Form”, “/form”, “edit_note”),
(“Upload”, “/upload”, “upload_file”),
(“Chat”, “/chat”, “chat”),
]: cls = “w-full” + (” bg-primary text-white” if label == active else “”) ui.button(label, on_click=lambda p=path: ui.navigate.to(p), icon=icon).classes(cls).props(“alineación plana=izquierda sin mayúsculas”) con ui.header(elevated=True).classes(“items-center justify-between bg-primary”): con ui.row().classes(“items-center”): ui.button(on_click=drawer.toggle, icon=”menu”).props(“color plano=blanco”) ui.label(“🚀 Tutorial de NiceGUI”).classes(“text-xl font-semibold text-white”) ui.button(icon=”dark_mode”, on_click=dark.toggle).props(“plano color=blanco”) con ui.footer().classes(“bg-grey-3 text-black justify-center”): ui.label(“Construido con NiceGUI · Demostración del tutorial”)