update:1.项目管理-世界观生成添加重新生成世界观按钮 2.项目目标字数支持修改，优化进度展示 3.修复本地创建账号user_id过长导致保存项目报错
This commit is contained in:
xiamuceer
@@ -1,6 +1,6 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { Card, Button, Empty, Modal, message, Spin, Row, Col, Statistic, Space, Tag, Progress, Typography, Tooltip, Badge, Alert, Upload, Checkbox, Divider, Switch, Dropdown } from 'antd';
|
||||
import { Card, Button, Empty, Modal, message, Spin, Row, Col, Statistic, Space, Tag, Progress, Typography, Tooltip, Badge, Alert, Upload, Checkbox, Divider, Switch, Dropdown, Form, Input, InputNumber } from 'antd';
|
||||
import { EditOutlined, DeleteOutlined, BookOutlined, RocketOutlined, CalendarOutlined, FileTextOutlined, TrophyOutlined, FireOutlined, SettingOutlined, InfoCircleOutlined, CloseOutlined, UploadOutlined, DownloadOutlined, ApiOutlined, MoreOutlined, BulbOutlined } from '@ant-design/icons';
|
||||
import { projectApi } from '../services/api';
|
||||
import { useStore } from '../store';
|
||||
@@ -27,6 +27,10 @@ export default function ProjectList() {
|
||||
includeWritingStyles: true,
|
||||
includeGenerationHistory: true,
|
||||
});
|
||||
const [editModalVisible, setEditModalVisible] = useState(false);
|
||||
const [editingProject, setEditingProject] = useState<any>(null);
|
||||
const [editForm] = Form.useForm();
|
||||
const [updating, setUpdating] = useState(false);
|
||||
|
||||
const { refreshProjects, deleteProject } = useProjectSync();
|
||||
|
||||
@@ -72,6 +76,45 @@ export default function ProjectList() {
|
||||
});
|
||||
};
|
||||
|
||||
const handleEditProject = (project: any) => {
|
||||
setEditingProject(project);
|
||||
editForm.setFieldsValue({
|
||||
description: project.description || '',
|
||||
target_words: project.target_words || 0,
|
||||
});
|
||||
setEditModalVisible(true);
|
||||
};
|
||||
|
||||
const handleCloseEditModal = () => {
|
||||
setEditModalVisible(false);
|
||||
setEditingProject(null);
|
||||
editForm.resetFields();
|
||||
};
|
||||
|
||||
const handleUpdateProject = async () => {
|
||||
try {
|
||||
const values = await editForm.validateFields();
|
||||
setUpdating(true);
|
||||
|
||||
await projectApi.updateProject(editingProject.id, {
|
||||
description: values.description,
|
||||
target_words: values.target_words,
|
||||
});
|
||||
|
||||
message.success('项目更新成功');
|
||||
handleCloseEditModal();
|
||||
await refreshProjects();
|
||||
} catch (error: any) {
|
||||
if (error.errorFields) {
|
||||
message.error('请检查表单填写');
|
||||
} else {
|
||||
message.error('更新失败，请重试');
|
||||
}
|
||||
} finally {
|
||||
setUpdating(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleEnterProject = (id: string) => {
|
||||
// 简化后直接进入项目，不再检查向导状态
|
||||
navigate(`/project/${id}`);
|
||||
@@ -783,15 +826,26 @@ export default function ProjectList() {
|
||||
{formatDate(project.updated_at)}
|
||||
</Text>
|
||||
<Space size={8}>
|
||||
<Tooltip title="编辑">
|
||||
<Button
|
||||
type="text"
|
||||
size="small"
|
||||
icon={<EditOutlined />}
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
handleEditProject(project);
|
||||
}}
|
||||
/>
|
||||
</Tooltip>
|
||||
<Tooltip title="删除">
|
||||
<Button
|
||||
type="text"
|
||||
<Button
|
||||
type="text"
|
||||
size="small"
|
||||
danger
|
||||
icon={<DeleteOutlined />}
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
handleDelete(project.id);
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
handleDelete(project.id);
|
||||
}}
|
||||
/>
|
||||
</Tooltip>
|
||||
@@ -1087,6 +1141,65 @@ export default function ProjectList() {
|
||||
</Space>
|
||||
</Modal>
|
||||
|
||||
{/* 编辑项目对话框 */}
|
||||
<Modal
|
||||
title={`编辑项目: ${editingProject?.title || ''}`}
|
||||
open={editModalVisible}
|
||||
onOk={handleUpdateProject}
|
||||
onCancel={handleCloseEditModal}
|
||||
confirmLoading={updating}
|
||||
okText="保存"
|
||||
cancelText="取消"
|
||||
width={window.innerWidth <= 768 ? '90%' : 600}
|
||||
centered
|
||||
styles={{
|
||||
body: {
|
||||
maxHeight: window.innerWidth <= 768 ? '60vh' : 'auto',
|
||||
overflowY: 'auto',
|
||||
padding: window.innerWidth <= 768 ? '16px' : '24px'
|
||||
}
|
||||
}}
|
||||
>
|
||||
<Form
|
||||
form={editForm}
|
||||
layout="vertical"
|
||||
autoComplete="off"
|
||||
>
|
||||
<Form.Item
|
||||
label="项目简介"
|
||||
name="description"
|
||||
rules={[
|
||||
{ max: 1000, message: '简介不能超过1000字' }
|
||||
]}
|
||||
>
|
||||
<Input.TextArea
|
||||
rows={4}
|
||||
placeholder="请输入项目简介（选填）"
|
||||
showCount
|
||||
maxLength={1000}
|
||||
/>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
label="目标字数"
|
||||
name="target_words"
|
||||
rules={[
|
||||
{ type: 'number', min: 0, message: '目标字数不能为负数' },
|
||||
{ type: 'number', max: 2147483647, message: '目标字数超出范围' }
|
||||
]}
|
||||
>
|
||||
<InputNumber
|
||||
style={{ width: '100%' }}
|
||||
placeholder="请输入目标字数（选填，最大21亿字）"
|
||||
min={0}
|
||||
max={2147483647}
|
||||
step={1000}
|
||||
addonAfter="字"
|
||||
/>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</Modal>
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,9 +1,10 @@
|
||||
import { Card, Descriptions, Empty, Typography, Button, Modal, Form, Input, message } from 'antd';
|
||||
import { GlobalOutlined, EditOutlined } from '@ant-design/icons';
|
||||
import { Card, Descriptions, Empty, Typography, Button, Modal, Form, Input, message, Space } from 'antd';
|
||||
import { GlobalOutlined, EditOutlined, SyncOutlined } from '@ant-design/icons';
|
||||
import { useState } from 'react';
|
||||
import { useStore } from '../store';
|
||||
import { cardStyles } from '../components/CardStyles';
|
||||
import { projectApi } from '../services/api';
|
||||
import { projectApi, wizardStreamApi } from '../services/api';
|
||||
import { SSELoadingOverlay } from '../components/SSELoadingOverlay';
|
||||
|
||||
const { Title, Paragraph } = Typography;
|
||||
const { TextArea } = Input;
|
||||
@@ -13,6 +14,111 @@ export default function WorldSetting() {
|
||||
const [isEditModalVisible, setIsEditModalVisible] = useState(false);
|
||||
const [editForm] = Form.useForm();
|
||||
const [isSaving, setIsSaving] = useState(false);
|
||||
const [isRegenerating, setIsRegenerating] = useState(false);
|
||||
const [regenerateProgress, setRegenerateProgress] = useState(0);
|
||||
const [regenerateMessage, setRegenerateMessage] = useState('');
|
||||
const [isPreviewModalVisible, setIsPreviewModalVisible] = useState(false);
|
||||
const [newWorldData, setNewWorldData] = useState<{
|
||||
time_period: string;
|
||||
location: string;
|
||||
atmosphere: string;
|
||||
rules: string;
|
||||
} | null>(null);
|
||||
const [isSavingPreview, setIsSavingPreview] = useState(false);
|
||||
|
||||
// AI重新生成世界观
|
||||
const handleRegenerate = async () => {
|
||||
if (!currentProject) return;
|
||||
|
||||
Modal.confirm({
|
||||
title: '确认重新生成',
|
||||
content: '确定要使用AI重新生成世界观设定吗？这将替换当前的世界观内容。',
|
||||
centered: true,
|
||||
okText: '确认重新生成',
|
||||
cancelText: '取消',
|
||||
onOk: async () => {
|
||||
setIsRegenerating(true);
|
||||
setRegenerateProgress(0);
|
||||
setRegenerateMessage('准备重新生成世界观...');
|
||||
|
||||
try {
|
||||
await wizardStreamApi.regenerateWorldBuildingStream(
|
||||
currentProject.id,
|
||||
{},
|
||||
{
|
||||
onProgress: (msg: string, progress: number) => {
|
||||
setRegenerateProgress(progress);
|
||||
setRegenerateMessage(msg);
|
||||
},
|
||||
onChunk: (chunk: string) => {
|
||||
// 可以在这里显示生成的内容片段（可选）
|
||||
console.log('生成片段:', chunk);
|
||||
},
|
||||
onResult: (result: any) => {
|
||||
// 保存新生成的数据
|
||||
const newData = {
|
||||
time_period: result.time_period,
|
||||
location: result.location,
|
||||
atmosphere: result.atmosphere,
|
||||
rules: result.rules,
|
||||
};
|
||||
setNewWorldData(newData);
|
||||
},
|
||||
onError: (errorMsg: string) => {
|
||||
console.error('重新生成失败:', errorMsg);
|
||||
message.error(errorMsg || '重新生成失败，请重试');
|
||||
},
|
||||
onComplete: () => {
|
||||
setIsRegenerating(false);
|
||||
setRegenerateProgress(0);
|
||||
setRegenerateMessage('');
|
||||
// 显示预览对话框
|
||||
setIsPreviewModalVisible(true);
|
||||
}
|
||||
}
|
||||
);
|
||||
} catch (error) {
|
||||
console.error('重新生成出错:', error);
|
||||
message.error('重新生成出错，请重试');
|
||||
setIsRegenerating(false);
|
||||
setRegenerateProgress(0);
|
||||
setRegenerateMessage('');
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 确认保存重新生成的内容
|
||||
const handleConfirmSave = async () => {
|
||||
if (!currentProject || !newWorldData) return;
|
||||
|
||||
setIsSavingPreview(true);
|
||||
try {
|
||||
const updatedProject = await projectApi.updateProject(currentProject.id, {
|
||||
world_time_period: newWorldData.time_period,
|
||||
world_location: newWorldData.location,
|
||||
world_atmosphere: newWorldData.atmosphere,
|
||||
world_rules: newWorldData.rules,
|
||||
});
|
||||
|
||||
setCurrentProject(updatedProject);
|
||||
message.success('世界观已更新！');
|
||||
setIsPreviewModalVisible(false);
|
||||
setNewWorldData(null);
|
||||
} catch (error) {
|
||||
console.error('保存失败:', error);
|
||||
message.error('保存失败，请重试');
|
||||
} finally {
|
||||
setIsSavingPreview(false);
|
||||
}
|
||||
};
|
||||
|
||||
// 取消保存，关闭预览
|
||||
const handleCancelSave = () => {
|
||||
setIsPreviewModalVisible(false);
|
||||
setNewWorldData(null);
|
||||
message.info('已取消，保持原有内容');
|
||||
};
|
||||
|
||||
if (!currentProject) return null;
|
||||
|
||||
@@ -75,21 +181,30 @@ export default function WorldSetting() {
|
||||
<GlobalOutlined style={{ fontSize: 24, marginRight: 12, color: '#1890ff' }} />
|
||||
<h2 style={{ margin: 0 }}>世界设定</h2>
|
||||
</div>
|
||||
<Button
|
||||
type="primary"
|
||||
icon={<EditOutlined />}
|
||||
onClick={() => {
|
||||
editForm.setFieldsValue({
|
||||
world_time_period: currentProject.world_time_period || '',
|
||||
world_location: currentProject.world_location || '',
|
||||
world_atmosphere: currentProject.world_atmosphere || '',
|
||||
world_rules: currentProject.world_rules || '',
|
||||
});
|
||||
setIsEditModalVisible(true);
|
||||
}}
|
||||
>
|
||||
编辑世界观
|
||||
</Button>
|
||||
<Space>
|
||||
<Button
|
||||
icon={<SyncOutlined />}
|
||||
onClick={handleRegenerate}
|
||||
disabled={isRegenerating}
|
||||
>
|
||||
AI重新生成
|
||||
</Button>
|
||||
<Button
|
||||
type="primary"
|
||||
icon={<EditOutlined />}
|
||||
onClick={() => {
|
||||
editForm.setFieldsValue({
|
||||
world_time_period: currentProject.world_time_period || '',
|
||||
world_location: currentProject.world_location || '',
|
||||
world_atmosphere: currentProject.world_atmosphere || '',
|
||||
world_rules: currentProject.world_rules || '',
|
||||
});
|
||||
setIsEditModalVisible(true);
|
||||
}}
|
||||
>
|
||||
编辑世界观
|
||||
</Button>
|
||||
</Space>
|
||||
</div>
|
||||
|
||||
{/* 可滚动内容区域 */}
|
||||
@@ -302,6 +417,101 @@ export default function WorldSetting() {
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</Modal>
|
||||
|
||||
{/* AI重新生成加载遮罩 */}
|
||||
<SSELoadingOverlay
|
||||
loading={isRegenerating}
|
||||
progress={regenerateProgress}
|
||||
message={regenerateMessage}
|
||||
/>
|
||||
|
||||
{/* 预览重新生成的内容模态框 */}
|
||||
<Modal
|
||||
title="预览重新生成的世界观"
|
||||
open={isPreviewModalVisible}
|
||||
centered
|
||||
width={900}
|
||||
onOk={handleConfirmSave}
|
||||
onCancel={handleCancelSave}
|
||||
confirmLoading={isSavingPreview}
|
||||
okText="确认替换"
|
||||
cancelText="取消"
|
||||
okButtonProps={{ danger: true }}
|
||||
>
|
||||
{newWorldData && (
|
||||
<div style={{ maxHeight: '60vh', overflowY: 'auto' }}>
|
||||
<div style={{ marginBottom: 24, padding: 16, background: '#fff7e6', border: '1px solid #ffd591', borderRadius: 8 }}>
|
||||
<Typography.Text type="warning" strong>
|
||||
⚠️ 注意：点击"确认替换"将会用新内容替换当前的世界观设定
|
||||
</Typography.Text>
|
||||
</div>
|
||||
|
||||
<div style={{ marginBottom: 24 }}>
|
||||
<Title level={5} style={{ color: '#1890ff', marginBottom: 12 }}>
|
||||
时间设定
|
||||
</Title>
|
||||
<Paragraph style={{
|
||||
fontSize: 15,
|
||||
lineHeight: 1.8,
|
||||
padding: 16,
|
||||
background: '#f5f5f5',
|
||||
borderRadius: 8,
|
||||
borderLeft: '4px solid #1890ff'
|
||||
}}>
|
||||
{newWorldData.time_period}
|
||||
</Paragraph>
|
||||
</div>
|
||||
|
||||
<div style={{ marginBottom: 24 }}>
|
||||
<Title level={5} style={{ color: '#52c41a', marginBottom: 12 }}>
|
||||
地点设定
|
||||
</Title>
|
||||
<Paragraph style={{
|
||||
fontSize: 15,
|
||||
lineHeight: 1.8,
|
||||
padding: 16,
|
||||
background: '#f5f5f5',
|
||||
borderRadius: 8,
|
||||
borderLeft: '4px solid #52c41a'
|
||||
}}>
|
||||
{newWorldData.location}
|
||||
</Paragraph>
|
||||
</div>
|
||||
|
||||
<div style={{ marginBottom: 24 }}>
|
||||
<Title level={5} style={{ color: '#faad14', marginBottom: 12 }}>
|
||||
氛围设定
|
||||
</Title>
|
||||
<Paragraph style={{
|
||||
fontSize: 15,
|
||||
lineHeight: 1.8,
|
||||
padding: 16,
|
||||
background: '#f5f5f5',
|
||||
borderRadius: 8,
|
||||
borderLeft: '4px solid #faad14'
|
||||
}}>
|
||||
{newWorldData.atmosphere}
|
||||
</Paragraph>
|
||||
</div>
|
||||
|
||||
<div style={{ marginBottom: 0 }}>
|
||||
<Title level={5} style={{ color: '#f5222d', marginBottom: 12 }}>
|
||||
规则设定
|
||||
</Title>
|
||||
<Paragraph style={{
|
||||
fontSize: 15,
|
||||
lineHeight: 1.8,
|
||||
padding: 16,
|
||||
background: '#f5f5f5',
|
||||
borderRadius: 8,
|
||||
borderLeft: '4px solid #f5222d'
|
||||
}}>
|
||||
{newWorldData.rules}
|
||||
</Paragraph>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</Modal>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user