From b4e05a4a1628cc16d4c9d1aa1b489dda855b1617 Mon Sep 17 00:00:00 2001 From: lanyuanxiaoyao Date: Mon, 8 Jun 2026 10:51:17 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E6=94=B6=E9=9B=86=E7=AE=B1=E5=8F=B3?= =?UTF-8?q?=E4=BE=A7=E5=8C=BA=E5=9F=9F=E5=B8=83=E5=B1=80=E4=BC=98=E5=8C=96?= =?UTF-8?q?=E2=80=94=E2=80=94=E4=B8=8A=E4=B8=8B=E4=B8=A4=E6=AE=B5=E5=BC=8F?= =?UTF-8?q?=EF=BC=8C=E6=93=8D=E4=BD=9C=E6=A0=8F=E5=9B=BA=E5=AE=9A=E5=BA=95?= =?UTF-8?q?=E9=83=A8=E5=A7=8B=E7=BB=88=E6=98=BE=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../inbox/components/MaterialContent.tsx | 16 +--- .../inbox/components/MaterialDetailPanel.tsx | 91 +++++++++---------- .../features/inbox/components/constants.ts | 10 ++ src/web/styles.css | 17 +++- 4 files changed, 73 insertions(+), 61 deletions(-) create mode 100644 src/web/features/inbox/components/constants.ts diff --git a/src/web/features/inbox/components/MaterialContent.tsx b/src/web/features/inbox/components/MaterialContent.tsx index c14c31d..a57cb7c 100644 --- a/src/web/features/inbox/components/MaterialContent.tsx +++ b/src/web/features/inbox/components/MaterialContent.tsx @@ -1,22 +1,14 @@ import { Card, Descriptions, Tag, Typography } from "antd"; -import type { Material, MaterialStatus, MaterialType } from "../types"; +import type { Material, MaterialType } from "../types"; import { formatRelativeTime } from "../../../shared/utils/time"; +import { STATUS_MAP } from "./constants"; interface MaterialContentProps { material: Material; } -const STATUS_MAP: Record = { - approved: { color: "green", label: "已通过" }, - discarded: { color: "red", label: "已放弃" }, - failed: { color: "magenta", label: "失败" }, - pending: { color: "gold", label: "待处理" }, - processing: { color: "blue", label: "处理中" }, - review: { color: "orange", label: "待审核" }, -}; - const MATERIAL_TYPE_LABELS: Record = { general: "通用", meeting: "会议", @@ -27,7 +19,7 @@ export function MaterialContent({ material }: MaterialContentProps) { const typeLabel = MATERIAL_TYPE_LABELS[material.materialType] ?? material.materialType; return ( -
+ <> 素材详情 {material.description} @@ -52,6 +44,6 @@ export function MaterialContent({ material }: MaterialContentProps) { {formatRelativeTime(material.createdAt)} -
+ ); } diff --git a/src/web/features/inbox/components/MaterialDetailPanel.tsx b/src/web/features/inbox/components/MaterialDetailPanel.tsx index 73dfea5..4fffc63 100644 --- a/src/web/features/inbox/components/MaterialDetailPanel.tsx +++ b/src/web/features/inbox/components/MaterialDetailPanel.tsx @@ -1,9 +1,8 @@ import { CheckOutlined, CloseOutlined, RedoOutlined } from "@ant-design/icons"; -import { App as AntApp, Button, Empty, Result, Space, Spin } from "antd"; - -import type { Material } from "../types"; +import { App as AntApp, Button, Empty, Result, Space, Spin, Tag } from "antd"; import { useMaterial } from "../../../shared/hooks/use-materials"; +import { STATUS_MAP } from "./constants"; import { MaterialContent } from "./MaterialContent"; interface MaterialDetailPanelProps { @@ -23,8 +22,10 @@ export function MaterialDetailPanel({ }: MaterialDetailPanelProps) { if (!materialId) { return ( -
- +
+
+ +
); } @@ -46,24 +47,30 @@ function MaterialDetailPanelInner({ materialId, onApprove, onDiscard, onRetry, p if (isLoading) { return ( -
- +
+
+ +
); } if (error) { return ( -
- +
+
+ +
); } if (!data || !materialId) { return ( -
- +
+
+ +
); } @@ -97,44 +104,32 @@ function MaterialDetailPanelInner({ materialId, onApprove, onDiscard, onRetry, p } }; + const statusInfo = STATUS_MAP[data.status] ?? { color: "default", label: data.status }; + return ( -
- - +
+
+ +
+
+ {statusInfo.label} + {data.status === "review" ? ( + + + + + ) : data.status === "failed" ? ( + + + + ) : null} +
); } - -interface ActionButtonsProps { - material: Material; - onApprove: () => Promise; - onDiscard: () => Promise; - onRetry: () => Promise; -} - -function ActionButtons({ material, onApprove, onDiscard, onRetry }: ActionButtonsProps) { - if (material.status === "review") { - return ( - - - - - ); - } - - if (material.status === "failed") { - return ( - - - - ); - } - - return null; -} diff --git a/src/web/features/inbox/components/constants.ts b/src/web/features/inbox/components/constants.ts new file mode 100644 index 0000000..00c0899 --- /dev/null +++ b/src/web/features/inbox/components/constants.ts @@ -0,0 +1,10 @@ +import type { MaterialStatus } from "../types"; + +export const STATUS_MAP: Record = { + approved: { color: "green", label: "已通过" }, + discarded: { color: "red", label: "已放弃" }, + failed: { color: "magenta", label: "失败" }, + pending: { color: "gold", label: "待处理" }, + processing: { color: "blue", label: "处理中" }, + review: { color: "orange", label: "待审核" }, +}; diff --git a/src/web/styles.css b/src/web/styles.css index a29c676..393602f 100644 --- a/src/web/styles.css +++ b/src/web/styles.css @@ -338,16 +338,31 @@ body { overflow: hidden; } -.app-inbox-content { +.app-inbox-panel { display: flex; flex: 1; flex-direction: column; min-height: 0; min-width: 0; +} + +.app-inbox-content { + flex: 1; + min-height: 0; padding: var(--ant-padding-xl); overflow-y: auto; } +.app-inbox-action-bar { + display: flex; + flex-shrink: 0; + align-items: center; + justify-content: space-between; + padding: var(--ant-padding-sm) var(--ant-padding-xl); + border-top: 1px solid var(--ant-color-border-secondary); + background: var(--ant-color-bg-container); +} + .app-inbox-datepicker { width: 100%; }