feat(inbox): 素材持久化 CRUD — 数据库表 + API + 前端接入

- 新增 materials 表（id/projectId/description/associatedDate/status/createdAt/updatedAt）
- 新增 4 个后端 API 路由（list/create/get/delete）+ 13 个测试
- 新增 use-materials hooks（TanStack Query）
- 收集箱页面重构为三层架构（InboxPage + MaterialSidebar + MaterialDetailPanel）
- MaterialCard: Popconfirm 删除确认 + 粗粒度时间格式
- MaterialContent: 展示状态标签 + createdAt
- 更新开发文档 backend.md / frontend.md

src/web/features/inbox/components/MaterialDetailPanel.tsx

@@ -0,0 +1,51 @@
+import { Empty, Result, Spin } from "antd";
+
+import { useMaterial } from "../../../shared/hooks/use-materials";
+import { MaterialContent } from "./MaterialContent";
+
+interface MaterialDetailPanelProps {
+  materialId: null | string;
+  projectId: string;
+}
+
+export function MaterialDetailPanel({ materialId, projectId }: MaterialDetailPanelProps) {
+  if (!materialId) {
+    return (
+      <div className="app-inbox-content">
+        <Empty description="请在左侧选择素材" />
+      </div>
+    );
+  }
+
+  return <MaterialDetailPanelInner materialId={materialId} projectId={projectId} />;
+}
+
+function MaterialDetailPanelInner({ materialId, projectId }: MaterialDetailPanelProps) {
+  const { data, error, isLoading } = useMaterial({ materialId, projectId });
+
+  if (isLoading) {
+    return (
+      <div className="app-inbox-content">
+        <Spin />
+      </div>
+    );
+  }
+
+  if (error) {
+    return (
+      <div className="app-inbox-content">
+        <Result subTitle="加载素材详情失败" />
+      </div>
+    );
+  }
+
+  if (!data) {
+    return (
+      <div className="app-inbox-content">
+        <Empty description="请在左侧选择素材" />
+      </div>
+    );
+  }
+
+  return <MaterialContent material={data} />;
+}