收口大鱼结果页失败状态弹窗

扩展 PlatformStatusDialog 支持自定义图标标签与动作按钮透传
BigFishResultView 改用共享状态弹窗承接发布失败提示
更新 PlatformUiKit 收口文档与团队决策记录

src/components/big-fish-result/BigFishResultView.tsx

@@ -23,9 +23,9 @@ import { PlatformIconBadge } from '../common/PlatformIconBadge';
 import { PlatformIconButton } from '../common/PlatformIconButton';
 import { PlatformMediaFrame } from '../common/PlatformMediaFrame';
 import { PlatformPillBadge } from '../common/PlatformPillBadge';
+import { PlatformStatusDialog } from '../common/PlatformStatusDialog';
 import { PlatformStatusMessage } from '../common/PlatformStatusMessage';
 import { PlatformSubpanel } from '../common/PlatformSubpanel';
-import { UnifiedConfirmDialog } from '../common/UnifiedConfirmDialog';
 
 type BigFishAssetStudioTarget =
   | {
@@ -619,32 +619,25 @@ function BigFishResultErrorModal({
   onClose: () => void;
 }) {
   return (
-    <UnifiedConfirmDialog
-      open
+    <PlatformStatusDialog
+      status="error"
       title="发布失败"
+      description={message}
       onClose={onClose}
-      closeOnBackdrop={false}
-      showCloseButton={false}
-      confirmLabel="知道了"
-      confirmClassName="w-full justify-center border-slate-950 bg-slate-950 text-white"
-      size="sm"
+      icon={<Waves className="h-4 w-4" />}
+      iconLabel="发布失败提示"
+      iconClassName="mt-0.5 bg-[var(--platform-button-danger-fill)] text-[var(--platform-button-danger-text)]"
+      action={{
+        label: '知道了',
+        onClick: onClose,
+        surface: 'platform',
+        className: 'border-slate-950 bg-slate-950 text-white',
+      }}
       zIndexClassName="z-[160]"
       overlayClassName="bg-slate-950/58"
       panelClassName="border-red-100/80 bg-white text-slate-950 shadow-2xl"
-      footerClassName="border-t-0 px-5 pb-5 pt-0"
-    >
-      <div className="flex items-start gap-3">
-        <PlatformIconBadge
-          icon={<Waves className="h-4 w-4" />}
-          label="发布失败提示"
-          tone="danger"
-          className="mt-0.5"
-        />
-        <div className="min-w-0 flex-1 text-sm leading-6 text-slate-600">
-          {message}
-        </div>
-      </div>
-    </UnifiedConfirmDialog>
+      bodyClassName="px-5 pb-5 pt-6 text-center"
+    />
   );
 }
 

src/components/common/PlatformStatusDialog.test.tsx

@@ -1,5 +1,6 @@
 /* @vitest-environment jsdom */
 
+import { Waves } from 'lucide-react';
 import { fireEvent, render, screen } from '@testing-library/react';
 import { expect, test, vi } from 'vitest';
 
@@ -65,3 +66,33 @@ test('supports blocking confirming state without close action', () => {
 
   expect(onClose).not.toHaveBeenCalled();
 });
+
+test('supports custom badge icon label and action button styling', () => {
+  render(
+    <PlatformStatusDialog
+      status="error"
+      title="发布失败"
+      description="还缺少 16 个基础动作"
+      onClose={vi.fn()}
+      icon={<Waves className="h-4 w-4" />}
+      iconLabel="发布失败提示"
+      iconClassName="bg-[var(--platform-button-danger-fill)] text-[var(--platform-button-danger-text)]"
+      action={{
+        label: '知道了',
+        onClick: vi.fn(),
+        surface: 'platform',
+        className: 'border-slate-950 bg-slate-950 text-white',
+      }}
+    />,
+  );
+
+  const badge = screen.getByLabelText('发布失败提示');
+  const action = screen.getByRole('button', { name: '知道了' });
+
+  expect(badge.className).toContain('bg-[var(--platform-button-danger-fill)]');
+  expect(badge.className).toContain(
+    'text-[var(--platform-button-danger-text)]',
+  );
+  expect(action.className).toContain('border-slate-950');
+  expect(action.className).toContain('bg-slate-950');
+});

src/components/common/PlatformStatusDialog.tsx

@@ -10,6 +10,11 @@ import {
 import { PlatformActionButton } from './PlatformActionButton';
 import { PlatformIconBadge } from './PlatformIconBadge';
 import { UnifiedModal } from './UnifiedModal';
+import type {
+  PlatformActionButtonSize,
+  PlatformActionButtonSurface,
+  PlatformActionButtonTone,
+} from './platformActionButtonModel';
 
 export type PlatformStatusDialogStatus =
   | 'success'
@@ -22,6 +27,11 @@ type PlatformStatusDialogAction = {
   label: string;
   onClick: () => void;
   disabled?: boolean;
+  tone?: PlatformActionButtonTone;
+  surface?: PlatformActionButtonSurface;
+  size?: PlatformActionButtonSize;
+  fullWidth?: boolean;
+  className?: string;
 };
 
 type PlatformStatusDialogProps = {
@@ -37,6 +47,8 @@ type PlatformStatusDialogProps = {
   panelClassName?: string;
   bodyClassName?: string;
   iconClassName?: string;
+  icon?: ReactNode;
+  iconLabel?: string;
 };
 
 type PlatformStatusVisualConfig = {
@@ -97,8 +109,11 @@ export function PlatformStatusDialog({
   panelClassName = DEFAULT_PANEL_CLASS,
   bodyClassName = DEFAULT_BODY_CLASS,
   iconClassName,
+  icon,
+  iconLabel,
 }: PlatformStatusDialogProps) {
   const visualConfig = getStatusVisualConfig(status);
+  const badgeIcon = icon ?? visualConfig.icon;
 
   return (
     <UnifiedModal
@@ -118,7 +133,8 @@ export function PlatformStatusDialog({
       bodyClassName={bodyClassName}
     >
       <PlatformIconBadge
-        icon={visualConfig.icon}
+        icon={badgeIcon}
+        label={iconLabel}
         size="xl"
         tone="neutral"
         className={[
@@ -139,10 +155,11 @@ export function PlatformStatusDialog({
       ) : null}
       {action ? (
         <PlatformActionButton
-          surface="profile"
-          fullWidth
-          size="md"
-          className="mt-5"
+          fullWidth={action.fullWidth ?? true}
+          size={action.size ?? 'md'}
+          tone={action.tone}
+          surface={action.surface ?? 'profile'}
+          className={['mt-5', action.className].filter(Boolean).join(' ')}
           onClick={action.onClick}
           disabled={action.disabled}
         >