新功能: - 项目-模板绑定管理系统 - 支持主要/次要模板绑定类型 - 绑定优先级和状态管理 - 批量绑定操作 - 绑定关系的CRUD操作 - 素材-模特绑定管理系统 - 素材与模特的关联管理 - 批量绑定/解绑操作 - 绑定统计和分析 - 素材编辑对话框 架构改进: - 新增项目-模板绑定数据模型和仓库层 - 新增素材-模特绑定业务服务层 - 完善的API命令层实现 - 响应式前端界面设计 用户体验优化: - 统一的通知系统 - 增强的加载状态组件 - 流畅的交互动画 - 优雅的确认对话框 测试覆盖: - 单元测试和集成测试 - 业务逻辑验证 - API接口测试 技术栈: - 后端: Rust + Tauri + SQLite - 前端: React + TypeScript + TailwindCSS - 状态管理: Zustand - 测试: Vitest + Rust测试框架 配置更新: - 更新数据库迁移脚本 - 完善测试配置 - 优化构建流程
112 lines
3.7 KiB
TypeScript
112 lines
3.7 KiB
TypeScript
|
|
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
|
|
import { ProjectList } from './components/ProjectList';
|
|
import { ProjectForm } from './components/ProjectForm';
|
|
import { ProjectDetails } from './pages/ProjectDetails';
|
|
import Models from './pages/Models';
|
|
import AiClassificationSettings from './pages/AiClassificationSettings';
|
|
import TemplateManagement from './pages/TemplateManagement';
|
|
import { MaterialModelBinding } from './pages/MaterialModelBinding';
|
|
import Navigation from './components/Navigation';
|
|
import { NotificationSystem, useNotifications } from './components/NotificationSystem';
|
|
import { useProjectStore } from './store/projectStore';
|
|
import { useUIStore } from './store/uiStore';
|
|
import { CreateProjectRequest, UpdateProjectRequest } from './types/project';
|
|
import "./App.css";
|
|
import './styles/design-system.css';
|
|
import './styles/animations.css';
|
|
/**
|
|
* 主应用组件
|
|
* 遵循 Tauri 开发规范的应用架构设计
|
|
*/
|
|
function App() {
|
|
const { createProject, updateProject } = useProjectStore();
|
|
const {
|
|
showCreateProjectModal,
|
|
showEditProjectModal,
|
|
editingProject,
|
|
closeCreateProjectModal,
|
|
closeEditProjectModal
|
|
} = useUIStore();
|
|
|
|
// 通知系统
|
|
const { notifications, removeNotification, success, error } = useNotifications();
|
|
|
|
// 处理创建项目
|
|
const handleCreateProject = async (data: CreateProjectRequest) => {
|
|
try {
|
|
await createProject(data);
|
|
success('项目创建成功', `项目"${data.name}"已创建`);
|
|
closeCreateProjectModal();
|
|
} catch (err) {
|
|
const errorMessage = err instanceof Error ? err.message : '未知错误';
|
|
error('项目创建失败', errorMessage);
|
|
throw err;
|
|
}
|
|
};
|
|
|
|
// 处理更新项目
|
|
const handleUpdateProject = async (data: UpdateProjectRequest) => {
|
|
if (!editingProject) return;
|
|
|
|
try {
|
|
await updateProject(editingProject.id, data);
|
|
success('项目更新成功', `项目"${data.name}"已更新`);
|
|
closeEditProjectModal();
|
|
} catch (err) {
|
|
const errorMessage = err instanceof Error ? err.message : '未知错误';
|
|
error('项目更新失败', errorMessage);
|
|
throw err;
|
|
}
|
|
};
|
|
|
|
return (
|
|
<Router>
|
|
<div className="min-h-screen bg-gradient-to-br from-gray-50 via-white to-gray-50">
|
|
{/* 导航栏 */}
|
|
<Navigation />
|
|
|
|
{/* 主要内容区域 */}
|
|
<main className="container mx-auto px-4 sm:px-6 lg:px-8 py-4 sm:py-6 lg:py-8 max-w-7xl">
|
|
<Routes>
|
|
<Route path="/" element={<ProjectList />} />
|
|
<Route path="/project/:id" element={<ProjectDetails />} />
|
|
<Route path="/models" element={<Models />} />
|
|
<Route path="/ai-classification-settings" element={<AiClassificationSettings />} />
|
|
<Route path="/templates" element={<TemplateManagement />} />
|
|
<Route path="/material-model-binding" element={<MaterialModelBinding />} />
|
|
</Routes>
|
|
</main>
|
|
|
|
{/* 创建项目模态框 */}
|
|
{showCreateProjectModal && (
|
|
<ProjectForm
|
|
onSubmit={handleCreateProject}
|
|
onCancel={closeCreateProjectModal}
|
|
/>
|
|
)}
|
|
|
|
{/* 编辑项目模态框 */}
|
|
{showEditProjectModal && editingProject && (
|
|
<ProjectForm
|
|
initialData={editingProject}
|
|
onSubmit={handleUpdateProject}
|
|
onCancel={closeEditProjectModal}
|
|
isEdit={true}
|
|
/>
|
|
)}
|
|
|
|
{/* 通知系统 */}
|
|
<NotificationSystem
|
|
notifications={notifications}
|
|
onRemove={removeNotification}
|
|
position="top-right"
|
|
maxNotifications={5}
|
|
/>
|
|
</div>
|
|
</Router>
|
|
);
|
|
}
|
|
|
|
export default App;
|