实现 P0 自动分配、离线留言与可嵌入 Widget SDK

- 会话创建时按负载自动分配在线客服，无客服则进入离线模式
- 新增 /api/widget/leave-message 沉淀联系方式与留言事件
- 访客端离线留言表单；工作台展示离线留言/自动分配事件
- 提供 public/widget.js + /widget/embed 嵌入方案

web/src/pages/WidgetPreview.tsx

@@ -1,9 +1,10 @@
 import VisitorChat from '@/widgets/VisitorChat'
 
 const WidgetPreview = () => {
+  const origin = typeof window !== 'undefined' ? window.location.origin : 'https://your-host'
+
   return (
     <div className="min-h-screen bg-neutral-100 relative overflow-hidden">
-      {/* 模拟宿主站点骨架，贴近设计稿模糊背景 */}
       <div className="max-w-[960px] mx-auto px-6 py-10 opacity-40 select-none pointer-events-none">
         <div className="h-10 w-3/5 bg-neutral-200 rounded mb-4" />
         <div className="h-4 w-[90%] bg-neutral-200 rounded mb-3" />
@@ -15,16 +16,28 @@ const WidgetPreview = () => {
         </div>
         <div className="h-4 w-[85%] bg-neutral-200 rounded mb-3" />
         <div className="h-4 w-[70%] bg-neutral-200 rounded mb-3" />
-        <div className="h-4 w-4/5 bg-neutral-200 rounded mb-6" />
         <div className="h-[200px] w-full bg-neutral-200 rounded-lg" />
       </div>
-      <div className="absolute inset-0 flex items-start justify-center pt-16 pointer-events-none">
-        <div className="text-center pointer-events-auto">
-          <h1 className="text-xl font-semibold text-neutral-700 mb-1">访客 Widget 预览</h1>
-          <p className="text-sm text-neutral-400">右下角为可嵌入聊天组件 · 消息会写入数据库</p>
+
+      <div className="absolute top-6 left-1/2 -translate-x-1/2 w-full max-w-xl px-4 pointer-events-auto">
+        <div className="bg-white/95 backdrop-blur border border-neutral-200 rounded-xl shadow-sm p-4">
+          <h1 className="text-base font-semibold text-neutral-800 m-0 mb-1">访客 Widget 预览</h1>
+          <p className="text-xs text-neutral-500 m-0 mb-3">
+            右下角为聊天组件。任意站点可嵌入下方脚本（iframe 版 SDK）。
+          </p>
+          <pre className="m-0 text-[11px] leading-relaxed bg-neutral-50 border border-neutral-100 rounded-lg p-3 overflow-x-auto text-neutral-700 whitespace-pre-wrap">
+            {`<script src="${origin}/widget.js" data-id="WK_8a3f2e"></script>`}
+          </pre>
+          <p className="text-[11px] text-neutral-400 mt-2 mb-0">
+            也可打开独立嵌入页：
+            <a className="text-blue-600 ml-1" href="/widget/embed?channel_key=WK_8a3f2e&embedded=1" target="_blank" rel="noreferrer">
+              /widget/embed
+            </a>
+          </p>
         </div>
       </div>
-      <VisitorChat defaultOpen />
+
+      <VisitorChat defaultOpen channelKey="WK_8a3f2e" />
     </div>
   )
 }