update:1.修复大纲展开功能bug，按顺序展开 2.优化大纲细化UI展示，大纲设置为卷 3.实现角色关系修改功能 4.优化提示词避免出现过多特殊符号 5.优化向导页面的AI生产进度页面和灵感模式保持统一，支持重试 6.优化项目生成过长中断添加自动恢复逻辑

2025-11-26 14:56:13 +08:00
parent 42fdad71aa
commit 8121c04af9
18 changed files with 2094 additions and 1307 deletions
@@ -0,0 +1,127 @@
+import React from 'react';
+import { Modal, Spin } from 'antd';
+import { LoadingOutlined } from '@ant-design/icons';
+
+interface SSEProgressModalProps {
+  visible: boolean;
+  progress: number;
+  message: string;
+  title?: string;
+  showPercentage?: boolean;
+  showIcon?: boolean;
+}
+
+/**
+ * 统一的SSE进度显示Modal组件
+ * 用于在Modal中显示AI生成进度，样式与SSELoadingOverlay保持一致
+ */
+export const SSEProgressModal: React.FC<SSEProgressModalProps> = ({
+  visible,
+  progress,
+  message,
+  title = 'AI生成中...',
+  showPercentage = true,
+  showIcon = true,
+}) => {
+  if (!visible) return null;
+
+  return (
+    <Modal
+      title={null}
+      open={visible}
+      footer={null}
+      closable={false}
+      centered
+      width={500}
+      maskClosable={false}
+      keyboard={false}
+      styles={{
+        body: {
+          padding: '40px 40px 32px',
+        }
+      }}
+    >
+      <div>
+        {/* 标题和图标 */}
+        {showIcon && (
+          <div style={{
+            textAlign: 'center',
+            marginBottom: 24
+          }}>
+            <Spin 
+              indicator={<LoadingOutlined style={{ fontSize: 48, color: '#1890ff' }} spin />} 
+            />
+            <div style={{
+              fontSize: 20,
+              fontWeight: 'bold',
+              marginTop: 16,
+              color: '#262626'
+            }}>
+              {title}
+            </div>
+          </div>
+        )}
+
+        {/* 进度条 */}
+        <div style={{
+          marginBottom: showPercentage ? 16 : 24
+        }}>
+          <div style={{
+            height: 12,
+            background: '#f0f0f0',
+            borderRadius: 6,
+            overflow: 'hidden',
+            marginBottom: showPercentage ? 12 : 0
+          }}>
+            <div style={{
+              height: '100%',
+              background: progress === 100 
+                ? 'linear-gradient(90deg, #52c41a 0%, #73d13d 100%)'
+                : 'linear-gradient(90deg, #1890ff 0%, #40a9ff 100%)',
+              width: `${progress}%`,
+              transition: 'all 0.3s ease',
+              borderRadius: 6,
+              boxShadow: progress > 0 ? '0 0 10px rgba(24, 144, 255, 0.3)' : 'none'
+            }} />
+          </div>
+          
+          {/* 进度百分比 */}
+          {showPercentage && (
+            <div style={{
+              textAlign: 'center',
+              fontSize: 32,
+              fontWeight: 'bold',
+              color: progress === 100 ? '#52c41a' : '#1890ff',
+              marginBottom: 8
+            }}>
+              {progress}%
+            </div>
+          )}
+        </div>
+
+        {/* 状态消息 */}
+        <div style={{
+          textAlign: 'center',
+          fontSize: 16,
+          color: '#595959',
+          minHeight: 24,
+          padding: '0 20px',
+          marginBottom: 16
+        }}>
+          {message || '准备生成...'}
+        </div>
+
+        {/* 提示文字 */}
+        <div style={{
+          textAlign: 'center',
+          fontSize: 13,
+          color: '#8c8c8c'
+        }}>
+          请勿关闭页面，生成过程需要一定时间
+        </div>
+      </div>
+    </Modal>
+  );
+};
+
+export default SSEProgressModal;