import React, { useState } from 'react';
import { useParams, useNavigate } from 'react-router-dom';
import Layout from '../components/Layout/Layout';
import Card, { CardHeader, CardContent } from '../components/common/Card';
import Button from '../components/common/Button';
import PromptList from '../components/Prompt/PromptList';
import DslFileList from '../components/DslFile/DslFileList';
import DslFileUploader from '../components/DslFile/DslFileUploader';
import CategoryBadge from '../components/Category/CategoryBadge';
import { useApp } from '../contexts/AppContext';
import { exportPromptGroupToZip } from '../utils/exportUtils';
const PromptGroupDetailPage: React.FC = () => {
const { id } = useParams<{ id: string }>();
const navigate = useNavigate();
const {
promptGroups,
categories,
updatePromptGroup,
deletePromptGroup,
addPrompt,
updatePrompt,
deletePrompt
} = useApp();
const [activeTab, setActiveTab] = useState<'prompts' | 'dslFiles'>('prompts');
if (!id) {
return
提示词组ID无效
;
}
const promptGroup = promptGroups.find(group => group._id === id);
if (!promptGroup) {
return (
未找到提示词组
该提示词组可能已被删除
);
}
const category = categories.find(c => c._id === promptGroup.category);
const handleDeletePromptGroup = () => {
if (window.confirm('确定要删除此提示词组吗?此操作不可撤销,所有相关提示词和文件都将被删除。')) {
deletePromptGroup(promptGroup._id);
navigate('/');
}
};
const handleExportPromptGroup = () => {
exportPromptGroupToZip(promptGroup);
};
const formatDate = (date: string | Date) => {
const dateObj = typeof date === 'string' ? new Date(date) : date;
return dateObj.toLocaleDateString('zh-CN', {
year: 'numeric',
month: 'long',
day: 'numeric'
});
};
return (
导出
}
>
{promptGroup.name}
{category &&
}
{promptGroup.description || '无描述'}
创建于 {formatDate(promptGroup.createdAt)}
•
更新于 {formatDate(promptGroup.updatedAt)}
{activeTab === 'prompts' && (
addPrompt(promptGroup._id, promptData)}
onUpdatePrompt={(promptId, promptData) => updatePrompt(promptGroup._id, promptId, promptData)}
onDeletePrompt={(promptId) => deletePrompt(promptGroup._id, promptId)}
/>
)}
{activeTab === 'dslFiles' && (
)}
);
};
export default PromptGroupDetailPage;