diff --git a/demo/web/static/index.html b/demo/web/static/index.html
index fad328c..ca6269c 100644
--- a/demo/web/static/index.html
+++ b/demo/web/static/index.html
@@ -299,19 +299,41 @@ const intentLabels = {high: '高意向', medium: '中意向', low: '低意向'};
 const dealStatusLabels = {closed: '已成交', pending: '待确认', cancelled: '已取消'};
 
 // --- 路由 ---
+const ROUTES = {
+  'dashboard': () => loadDashboard(),
+  'products': () => loadProducts(),
+  'product-form': () => {},
+  'salespersons': () => loadSalespersons(),
+  'customers': () => loadCustomers(),
+  'customer-detail': () => {},
+  'deals': () => loadDeals(),
+  'analysis': () => loadAnalysis(),
+  'deal-form': () => loadDealForm(),
+};
+
+/** 导航到指定页面，更新 URL hash */
 function showPanel(name) {
+  location.hash = name;
+}
+
+/** 根据 hash 路由渲染对应面板 */
+function handleRoute() {
+  const hash = location.hash.slice(1) || 'dashboard';
+  const parts = hash.split('/');
+  const name = parts[0];
   document.querySelectorAll('.panel').forEach(p => p.classList.add('hidden'));
   const panel = document.getElementById(name + '-panel');
   if (panel) panel.classList.remove('hidden');
-  if (name === 'dashboard') loadDashboard();
-  if (name === 'products') loadProducts();
-  if (name === 'salespersons') loadSalespersons();
-  if (name === 'customers') loadCustomers();
-  if (name === 'deals') loadDeals();
-  if (name === 'analysis') loadAnalysis();
-  if (name === 'deal-form') loadDealForm();
+  // 执行路由对应的加载函数
+  if (ROUTES[name]) ROUTES[name]();
+  // 客户详情带 ID：#customer-detail/15
+  if (name === 'customer-detail' && parts[1]) {
+    showCustomerDetail(parseInt(parts[1]));
+  }
 }
 
+window.addEventListener('hashchange', handleRoute);
+
 // --- API 封装 ---
 async function api(path, options) {
   const res = await fetch(API + path, options);
@@ -635,7 +657,12 @@ function toggleSummary() {
 async function showCustomerDetail(id) {
   currentCustomerId = id;
   currentMsgPage = 1;
-  showPanel('customer-detail');
+  // 如果 hash 已经是 customer-detail/id 则直接渲染，否则更新 hash 触发路由
+  const expectedHash = `customer-detail/${id}`;
+  if (location.hash.slice(1) !== expectedHash) {
+    location.hash = expectedHash;
+    return;
+  }
 
   const customer = await api(`/customers/${id}`);
   const info = document.getElementById('detail-info');
@@ -1068,7 +1095,7 @@ function escapeHtml(s) {
 }
 
 // --- 初始化 ---
-showPanel('dashboard');
+handleRoute();
 </script>
 </body>
 </html>