feat: Day 8-9 - Project Management API completed
Backend: - Create project routes (GET, POST, PUT, DELETE) - Implement projectController with CRUD operations - Create projectService for database operations - Add validation middleware for request validation - Update Prisma schema (add background, researchType, deletedAt fields) - Implement soft delete for projects Frontend: - Create projectApi service module - Update useProjectStore with fetchProjects and loading state - Connect ProjectSelector to real API with loading indicator - Connect CreateProjectDialog to real API with error handling - Connect EditProjectDialog to real API with loading state - Add comprehensive error handling and user feedback Build: Both frontend and backend build successfully
This commit is contained in:
@@ -50,17 +50,20 @@ model Project {
|
|||||||
id String @id @default(uuid())
|
id String @id @default(uuid())
|
||||||
userId String @map("user_id")
|
userId String @map("user_id")
|
||||||
name String
|
name String
|
||||||
description String @db.Text
|
background String @default("") @db.Text
|
||||||
|
researchType String @default("observational") @map("research_type")
|
||||||
conversationCount Int @default(0) @map("conversation_count")
|
conversationCount Int @default(0) @map("conversation_count")
|
||||||
|
|
||||||
createdAt DateTime @default(now()) @map("created_at")
|
createdAt DateTime @default(now()) @map("created_at")
|
||||||
updatedAt DateTime @updatedAt @map("updated_at")
|
updatedAt DateTime @updatedAt @map("updated_at")
|
||||||
|
deletedAt DateTime? @map("deleted_at")
|
||||||
|
|
||||||
user User @relation(fields: [userId], references: [id], onDelete: Cascade)
|
user User @relation(fields: [userId], references: [id], onDelete: Cascade)
|
||||||
conversations Conversation[]
|
conversations Conversation[]
|
||||||
|
|
||||||
@@index([userId])
|
@@index([userId])
|
||||||
@@index([createdAt])
|
@@index([createdAt])
|
||||||
|
@@index([deletedAt])
|
||||||
@@map("projects")
|
@@map("projects")
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
183
backend/src/controllers/projectController.ts
Normal file
183
backend/src/controllers/projectController.ts
Normal file
@@ -0,0 +1,183 @@
|
|||||||
|
import { FastifyRequest, FastifyReply } from 'fastify';
|
||||||
|
import { projectService } from '../services/projectService.js';
|
||||||
|
|
||||||
|
interface ProjectParams {
|
||||||
|
id: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface CreateProjectBody {
|
||||||
|
name: string;
|
||||||
|
background: string;
|
||||||
|
researchType: 'observational' | 'interventional';
|
||||||
|
}
|
||||||
|
|
||||||
|
interface UpdateProjectBody {
|
||||||
|
name?: string;
|
||||||
|
background?: string;
|
||||||
|
researchType?: 'observational' | 'interventional';
|
||||||
|
}
|
||||||
|
|
||||||
|
class ProjectController {
|
||||||
|
// 获取项目列表
|
||||||
|
async getProjects(request: FastifyRequest, reply: FastifyReply) {
|
||||||
|
try {
|
||||||
|
// TODO: 从JWT token中获取真实的userId
|
||||||
|
// 目前使用模拟用户ID
|
||||||
|
const userId = 'user-mock-001';
|
||||||
|
|
||||||
|
const projects = await projectService.getProjectsByUserId(userId);
|
||||||
|
|
||||||
|
return reply.code(200).send({
|
||||||
|
success: true,
|
||||||
|
data: projects,
|
||||||
|
});
|
||||||
|
} catch (error) {
|
||||||
|
request.log.error(error);
|
||||||
|
return reply.code(500).send({
|
||||||
|
success: false,
|
||||||
|
message: '获取项目列表失败',
|
||||||
|
error: error instanceof Error ? error.message : 'Unknown error',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取单个项目详情
|
||||||
|
async getProjectById(
|
||||||
|
request: FastifyRequest<{ Params: ProjectParams }>,
|
||||||
|
reply: FastifyReply
|
||||||
|
) {
|
||||||
|
try {
|
||||||
|
const { id } = request.params;
|
||||||
|
const userId = 'user-mock-001'; // TODO: 从JWT获取
|
||||||
|
|
||||||
|
const project = await projectService.getProjectById(id, userId);
|
||||||
|
|
||||||
|
if (!project) {
|
||||||
|
return reply.code(404).send({
|
||||||
|
success: false,
|
||||||
|
message: '项目不存在或无权访问',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
return reply.code(200).send({
|
||||||
|
success: true,
|
||||||
|
data: project,
|
||||||
|
});
|
||||||
|
} catch (error) {
|
||||||
|
request.log.error(error);
|
||||||
|
return reply.code(500).send({
|
||||||
|
success: false,
|
||||||
|
message: '获取项目详情失败',
|
||||||
|
error: error instanceof Error ? error.message : 'Unknown error',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 创建项目
|
||||||
|
async createProject(request: FastifyRequest, reply: FastifyReply) {
|
||||||
|
try {
|
||||||
|
const body = request.body as CreateProjectBody;
|
||||||
|
const userId = 'user-mock-001'; // TODO: 从JWT获取
|
||||||
|
|
||||||
|
// 检查用户项目数量限制(可选)
|
||||||
|
const projectCount = await projectService.countUserProjects(userId);
|
||||||
|
const MAX_PROJECTS = 50; // 可以配置到环境变量
|
||||||
|
|
||||||
|
if (projectCount >= MAX_PROJECTS) {
|
||||||
|
return reply.code(400).send({
|
||||||
|
success: false,
|
||||||
|
message: `最多只能创建${MAX_PROJECTS}个项目`,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
const project = await projectService.createProject({
|
||||||
|
name: body.name,
|
||||||
|
background: body.background,
|
||||||
|
researchType: body.researchType,
|
||||||
|
userId,
|
||||||
|
});
|
||||||
|
|
||||||
|
return reply.code(201).send({
|
||||||
|
success: true,
|
||||||
|
message: '项目创建成功',
|
||||||
|
data: project,
|
||||||
|
});
|
||||||
|
} catch (error) {
|
||||||
|
request.log.error(error);
|
||||||
|
return reply.code(500).send({
|
||||||
|
success: false,
|
||||||
|
message: '创建项目失败',
|
||||||
|
error: error instanceof Error ? error.message : 'Unknown error',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 更新项目
|
||||||
|
async updateProject(
|
||||||
|
request: FastifyRequest<{ Params: ProjectParams }>,
|
||||||
|
reply: FastifyReply
|
||||||
|
) {
|
||||||
|
try {
|
||||||
|
const { id } = request.params;
|
||||||
|
const body = request.body as UpdateProjectBody;
|
||||||
|
const userId = 'user-mock-001'; // TODO: 从JWT获取
|
||||||
|
|
||||||
|
const project = await projectService.updateProject(id, userId, body);
|
||||||
|
|
||||||
|
if (!project) {
|
||||||
|
return reply.code(404).send({
|
||||||
|
success: false,
|
||||||
|
message: '项目不存在或无权访问',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
return reply.code(200).send({
|
||||||
|
success: true,
|
||||||
|
message: '项目更新成功',
|
||||||
|
data: project,
|
||||||
|
});
|
||||||
|
} catch (error) {
|
||||||
|
request.log.error(error);
|
||||||
|
return reply.code(500).send({
|
||||||
|
success: false,
|
||||||
|
message: '更新项目失败',
|
||||||
|
error: error instanceof Error ? error.message : 'Unknown error',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 删除项目
|
||||||
|
async deleteProject(
|
||||||
|
request: FastifyRequest<{ Params: ProjectParams }>,
|
||||||
|
reply: FastifyReply
|
||||||
|
) {
|
||||||
|
try {
|
||||||
|
const { id } = request.params;
|
||||||
|
const userId = 'user-mock-001'; // TODO: 从JWT获取
|
||||||
|
|
||||||
|
const project = await projectService.deleteProject(id, userId);
|
||||||
|
|
||||||
|
if (!project) {
|
||||||
|
return reply.code(404).send({
|
||||||
|
success: false,
|
||||||
|
message: '项目不存在或无权访问',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
return reply.code(200).send({
|
||||||
|
success: true,
|
||||||
|
message: '项目删除成功',
|
||||||
|
});
|
||||||
|
} catch (error) {
|
||||||
|
request.log.error(error);
|
||||||
|
return reply.code(500).send({
|
||||||
|
success: false,
|
||||||
|
message: '删除项目失败',
|
||||||
|
error: error instanceof Error ? error.message : 'Unknown error',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export const projectController = new ProjectController();
|
||||||
|
|
||||||
@@ -2,6 +2,7 @@ import Fastify from 'fastify';
|
|||||||
import cors from '@fastify/cors';
|
import cors from '@fastify/cors';
|
||||||
import { config } from './config/env.js';
|
import { config } from './config/env.js';
|
||||||
import { testDatabaseConnection, prisma } from './config/database.js';
|
import { testDatabaseConnection, prisma } from './config/database.js';
|
||||||
|
import { projectRoutes } from './routes/projects.js';
|
||||||
|
|
||||||
const fastify = Fastify({
|
const fastify = Fastify({
|
||||||
logger: {
|
logger: {
|
||||||
@@ -51,6 +52,9 @@ fastify.get('/api/v1', async () => {
|
|||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// 注册项目管理路由
|
||||||
|
await fastify.register(projectRoutes, { prefix: '/api/v1' });
|
||||||
|
|
||||||
// 启动服务器
|
// 启动服务器
|
||||||
const start = async () => {
|
const start = async () => {
|
||||||
try {
|
try {
|
||||||
|
|||||||
110
backend/src/middleware/validateProject.ts
Normal file
110
backend/src/middleware/validateProject.ts
Normal file
@@ -0,0 +1,110 @@
|
|||||||
|
import { FastifyRequest, FastifyReply } from 'fastify';
|
||||||
|
|
||||||
|
interface CreateProjectBody {
|
||||||
|
name: string;
|
||||||
|
background?: string;
|
||||||
|
researchType: 'observational' | 'interventional';
|
||||||
|
}
|
||||||
|
|
||||||
|
interface UpdateProjectBody {
|
||||||
|
name?: string;
|
||||||
|
background?: string;
|
||||||
|
researchType?: 'observational' | 'interventional';
|
||||||
|
}
|
||||||
|
|
||||||
|
// 验证创建项目请求
|
||||||
|
export async function validateProjectCreate(request: FastifyRequest, reply: FastifyReply) {
|
||||||
|
const body = request.body as CreateProjectBody;
|
||||||
|
|
||||||
|
// 验证必填字段
|
||||||
|
if (!body.name || typeof body.name !== 'string') {
|
||||||
|
return reply.code(400).send({
|
||||||
|
success: false,
|
||||||
|
message: '项目名称为必填项',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (body.name.trim().length === 0) {
|
||||||
|
return reply.code(400).send({
|
||||||
|
success: false,
|
||||||
|
message: '项目名称不能为空',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (body.name.length > 100) {
|
||||||
|
return reply.code(400).send({
|
||||||
|
success: false,
|
||||||
|
message: '项目名称不能超过100个字符',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 验证研究类型
|
||||||
|
if (!body.researchType) {
|
||||||
|
return reply.code(400).send({
|
||||||
|
success: false,
|
||||||
|
message: '研究类型为必填项',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!['observational', 'interventional'].includes(body.researchType)) {
|
||||||
|
return reply.code(400).send({
|
||||||
|
success: false,
|
||||||
|
message: '研究类型必须是observational或interventional',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 验证项目背景(可选,但有长度限制)
|
||||||
|
if (body.background && body.background.length > 2000) {
|
||||||
|
return reply.code(400).send({
|
||||||
|
success: false,
|
||||||
|
message: '项目背景不能超过2000个字符',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 验证更新项目请求
|
||||||
|
export async function validateProjectUpdate(request: FastifyRequest, reply: FastifyReply) {
|
||||||
|
const body = request.body as UpdateProjectBody;
|
||||||
|
|
||||||
|
// 至少需要更新一个字段
|
||||||
|
if (!body.name && !body.background && !body.researchType) {
|
||||||
|
return reply.code(400).send({
|
||||||
|
success: false,
|
||||||
|
message: '至少需要提供一个要更新的字段',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 验证项目名称
|
||||||
|
if (body.name !== undefined) {
|
||||||
|
if (typeof body.name !== 'string' || body.name.trim().length === 0) {
|
||||||
|
return reply.code(400).send({
|
||||||
|
success: false,
|
||||||
|
message: '项目名称不能为空',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (body.name.length > 100) {
|
||||||
|
return reply.code(400).send({
|
||||||
|
success: false,
|
||||||
|
message: '项目名称不能超过100个字符',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 验证研究类型
|
||||||
|
if (body.researchType && !['observational', 'interventional'].includes(body.researchType)) {
|
||||||
|
return reply.code(400).send({
|
||||||
|
success: false,
|
||||||
|
message: '研究类型必须是observational或interventional',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 验证项目背景
|
||||||
|
if (body.background && body.background.length > 2000) {
|
||||||
|
return reply.code(400).send({
|
||||||
|
success: false,
|
||||||
|
message: '项目背景不能超过2000个字符',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
53
backend/src/routes/projects.ts
Normal file
53
backend/src/routes/projects.ts
Normal file
@@ -0,0 +1,53 @@
|
|||||||
|
import { FastifyInstance, FastifyRequest, FastifyReply } from 'fastify';
|
||||||
|
import { projectController } from '../controllers/projectController.js';
|
||||||
|
import { validateProjectCreate, validateProjectUpdate } from '../middleware/validateProject.js';
|
||||||
|
|
||||||
|
interface ProjectParams {
|
||||||
|
id: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function projectRoutes(fastify: FastifyInstance) {
|
||||||
|
// 获取项目列表
|
||||||
|
fastify.get('/projects', async (request: FastifyRequest, reply: FastifyReply) => {
|
||||||
|
return projectController.getProjects(request, reply);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 获取单个项目详情
|
||||||
|
fastify.get<{ Params: ProjectParams }>(
|
||||||
|
'/projects/:id',
|
||||||
|
async (request: FastifyRequest<{ Params: ProjectParams }>, reply: FastifyReply) => {
|
||||||
|
return projectController.getProjectById(request, reply);
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
// 创建项目
|
||||||
|
fastify.post(
|
||||||
|
'/projects',
|
||||||
|
{
|
||||||
|
preHandler: validateProjectCreate,
|
||||||
|
},
|
||||||
|
async (request: FastifyRequest, reply: FastifyReply) => {
|
||||||
|
return projectController.createProject(request, reply);
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
// 更新项目
|
||||||
|
fastify.put<{ Params: ProjectParams }>(
|
||||||
|
'/projects/:id',
|
||||||
|
{
|
||||||
|
preHandler: validateProjectUpdate,
|
||||||
|
},
|
||||||
|
async (request: FastifyRequest<{ Params: ProjectParams }>, reply: FastifyReply) => {
|
||||||
|
return projectController.updateProject(request, reply);
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
// 删除项目
|
||||||
|
fastify.delete<{ Params: ProjectParams }>(
|
||||||
|
'/projects/:id',
|
||||||
|
async (request: FastifyRequest<{ Params: ProjectParams }>, reply: FastifyReply) => {
|
||||||
|
return projectController.deleteProject(request, reply);
|
||||||
|
}
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
102
backend/src/services/projectService.ts
Normal file
102
backend/src/services/projectService.ts
Normal file
@@ -0,0 +1,102 @@
|
|||||||
|
import { prisma } from '../config/database.js';
|
||||||
|
|
||||||
|
export interface CreateProjectDTO {
|
||||||
|
name: string;
|
||||||
|
background: string;
|
||||||
|
researchType: 'observational' | 'interventional';
|
||||||
|
userId: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface UpdateProjectDTO {
|
||||||
|
name?: string;
|
||||||
|
background?: string;
|
||||||
|
researchType?: 'observational' | 'interventional';
|
||||||
|
}
|
||||||
|
|
||||||
|
class ProjectService {
|
||||||
|
// 获取用户的所有项目
|
||||||
|
async getProjectsByUserId(userId: string) {
|
||||||
|
return prisma.project.findMany({
|
||||||
|
where: {
|
||||||
|
userId,
|
||||||
|
deletedAt: null,
|
||||||
|
},
|
||||||
|
orderBy: {
|
||||||
|
createdAt: 'desc',
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 根据ID获取项目
|
||||||
|
async getProjectById(projectId: string, userId: string) {
|
||||||
|
return prisma.project.findFirst({
|
||||||
|
where: {
|
||||||
|
id: projectId,
|
||||||
|
userId,
|
||||||
|
deletedAt: null,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 创建项目
|
||||||
|
async createProject(data: CreateProjectDTO) {
|
||||||
|
return prisma.project.create({
|
||||||
|
data: {
|
||||||
|
name: data.name,
|
||||||
|
background: data.background,
|
||||||
|
researchType: data.researchType,
|
||||||
|
userId: data.userId,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 更新项目
|
||||||
|
async updateProject(projectId: string, userId: string, data: UpdateProjectDTO) {
|
||||||
|
// 先检查项目是否存在且属于该用户
|
||||||
|
const project = await this.getProjectById(projectId, userId);
|
||||||
|
if (!project) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
return prisma.project.update({
|
||||||
|
where: {
|
||||||
|
id: projectId,
|
||||||
|
},
|
||||||
|
data: {
|
||||||
|
...data,
|
||||||
|
updatedAt: new Date(),
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 软删除项目
|
||||||
|
async deleteProject(projectId: string, userId: string) {
|
||||||
|
// 先检查项目是否存在且属于该用户
|
||||||
|
const project = await this.getProjectById(projectId, userId);
|
||||||
|
if (!project) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
return prisma.project.update({
|
||||||
|
where: {
|
||||||
|
id: projectId,
|
||||||
|
},
|
||||||
|
data: {
|
||||||
|
deletedAt: new Date(),
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 统计用户的项目数量
|
||||||
|
async countUserProjects(userId: string) {
|
||||||
|
return prisma.project.count({
|
||||||
|
where: {
|
||||||
|
userId,
|
||||||
|
deletedAt: null,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export const projectService = new ProjectService();
|
||||||
|
|
||||||
57
frontend/src/api/projectApi.ts
Normal file
57
frontend/src/api/projectApi.ts
Normal file
@@ -0,0 +1,57 @@
|
|||||||
|
import request from './request';
|
||||||
|
import type { Project } from '../stores/useProjectStore';
|
||||||
|
|
||||||
|
export interface ApiResponse<T = any> {
|
||||||
|
success: boolean;
|
||||||
|
data?: T;
|
||||||
|
message?: string;
|
||||||
|
error?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface CreateProjectRequest {
|
||||||
|
name: string;
|
||||||
|
background: string;
|
||||||
|
researchType: 'observational' | 'interventional';
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface UpdateProjectRequest {
|
||||||
|
name?: string;
|
||||||
|
background?: string;
|
||||||
|
researchType?: 'observational' | 'interventional';
|
||||||
|
}
|
||||||
|
|
||||||
|
export const projectApi = {
|
||||||
|
// 获取项目列表
|
||||||
|
getProjects: async (): Promise<ApiResponse<Project[]>> => {
|
||||||
|
const response = await request.get('/projects');
|
||||||
|
return response.data;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 获取单个项目详情
|
||||||
|
getProjectById: async (id: string): Promise<ApiResponse<Project>> => {
|
||||||
|
const response = await request.get(`/projects/${id}`);
|
||||||
|
return response.data;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 创建项目
|
||||||
|
createProject: async (data: CreateProjectRequest): Promise<ApiResponse<Project>> => {
|
||||||
|
const response = await request.post('/projects', data);
|
||||||
|
return response.data;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 更新项目
|
||||||
|
updateProject: async (
|
||||||
|
id: string,
|
||||||
|
data: UpdateProjectRequest
|
||||||
|
): Promise<ApiResponse<Project>> => {
|
||||||
|
const response = await request.put(`/projects/${id}`, data);
|
||||||
|
return response.data;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 删除项目
|
||||||
|
deleteProject: async (id: string): Promise<ApiResponse> => {
|
||||||
|
const response = await request.delete(`/projects/${id}`);
|
||||||
|
return response.data;
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
@@ -1,32 +1,40 @@
|
|||||||
|
import { useState } from 'react';
|
||||||
import { Modal, Form, Input, Radio, message } from 'antd';
|
import { Modal, Form, Input, Radio, message } from 'antd';
|
||||||
import { useProjectStore, Project } from '../stores/useProjectStore';
|
import { useProjectStore } from '../stores/useProjectStore';
|
||||||
|
import { projectApi } from '../api/projectApi';
|
||||||
|
|
||||||
const { TextArea } = Input;
|
const { TextArea } = Input;
|
||||||
|
|
||||||
export const CreateProjectDialog = () => {
|
export const CreateProjectDialog = () => {
|
||||||
const [form] = Form.useForm();
|
const [form] = Form.useForm();
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
const { showCreateDialog, setShowCreateDialog, addProject } = useProjectStore();
|
const { showCreateDialog, setShowCreateDialog, addProject } = useProjectStore();
|
||||||
|
|
||||||
const handleOk = async () => {
|
const handleOk = async () => {
|
||||||
try {
|
try {
|
||||||
const values = await form.validateFields();
|
const values = await form.validateFields();
|
||||||
|
setLoading(true);
|
||||||
|
|
||||||
// 模拟创建项目(后续会调用真实API)
|
// 调用真实API创建项目
|
||||||
const newProject: Project = {
|
const response = await projectApi.createProject({
|
||||||
id: `proj-${Date.now()}`,
|
|
||||||
name: values.name,
|
name: values.name,
|
||||||
background: values.background || '',
|
background: values.background || '',
|
||||||
researchType: values.researchType,
|
researchType: values.researchType,
|
||||||
createdAt: new Date().toISOString(),
|
});
|
||||||
updatedAt: new Date().toISOString(),
|
|
||||||
};
|
|
||||||
|
|
||||||
addProject(newProject);
|
if (response.success && response.data) {
|
||||||
message.success('项目创建成功');
|
addProject(response.data);
|
||||||
form.resetFields();
|
message.success(response.message || '项目创建成功');
|
||||||
setShowCreateDialog(false);
|
form.resetFields();
|
||||||
|
setShowCreateDialog(false);
|
||||||
|
} else {
|
||||||
|
message.error(response.message || '项目创建失败');
|
||||||
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('表单验证失败:', error);
|
console.error('创建项目失败:', error);
|
||||||
|
message.error('项目创建失败');
|
||||||
|
} finally {
|
||||||
|
setLoading(false);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -44,6 +52,7 @@ export const CreateProjectDialog = () => {
|
|||||||
width={600}
|
width={600}
|
||||||
okText="创建"
|
okText="创建"
|
||||||
cancelText="取消"
|
cancelText="取消"
|
||||||
|
confirmLoading={loading}
|
||||||
>
|
>
|
||||||
<Form
|
<Form
|
||||||
form={form}
|
form={form}
|
||||||
|
|||||||
@@ -1,11 +1,13 @@
|
|||||||
import { Modal, Form, Input, Radio, message } from 'antd';
|
import { Modal, Form, Input, Radio, message } from 'antd';
|
||||||
import { useEffect } from 'react';
|
import { useEffect, useState } from 'react';
|
||||||
import { useProjectStore } from '../stores/useProjectStore';
|
import { useProjectStore } from '../stores/useProjectStore';
|
||||||
|
import { projectApi } from '../api/projectApi';
|
||||||
|
|
||||||
const { TextArea } = Input;
|
const { TextArea } = Input;
|
||||||
|
|
||||||
export const EditProjectDialog = () => {
|
export const EditProjectDialog = () => {
|
||||||
const [form] = Form.useForm();
|
const [form] = Form.useForm();
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
const {
|
const {
|
||||||
currentProject,
|
currentProject,
|
||||||
showEditDialog,
|
showEditDialog,
|
||||||
@@ -29,19 +31,27 @@ export const EditProjectDialog = () => {
|
|||||||
|
|
||||||
try {
|
try {
|
||||||
const values = await form.validateFields();
|
const values = await form.validateFields();
|
||||||
|
setLoading(true);
|
||||||
|
|
||||||
// 模拟更新项目(后续会调用真实API)
|
// 调用真实API更新项目
|
||||||
updateProject(currentProject.id, {
|
const response = await projectApi.updateProject(currentProject.id, {
|
||||||
name: values.name,
|
name: values.name,
|
||||||
background: values.background || '',
|
background: values.background || '',
|
||||||
researchType: values.researchType,
|
researchType: values.researchType,
|
||||||
updatedAt: new Date().toISOString(),
|
|
||||||
});
|
});
|
||||||
|
|
||||||
message.success('项目更新成功');
|
if (response.success && response.data) {
|
||||||
setShowEditDialog(false);
|
updateProject(currentProject.id, response.data);
|
||||||
|
message.success(response.message || '项目更新成功');
|
||||||
|
setShowEditDialog(false);
|
||||||
|
} else {
|
||||||
|
message.error(response.message || '项目更新失败');
|
||||||
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('表单验证失败:', error);
|
console.error('更新项目失败:', error);
|
||||||
|
message.error('项目更新失败');
|
||||||
|
} finally {
|
||||||
|
setLoading(false);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -59,6 +69,7 @@ export const EditProjectDialog = () => {
|
|||||||
width={600}
|
width={600}
|
||||||
okText="保存"
|
okText="保存"
|
||||||
cancelText="取消"
|
cancelText="取消"
|
||||||
|
confirmLoading={loading}
|
||||||
>
|
>
|
||||||
<Form
|
<Form
|
||||||
form={form}
|
form={form}
|
||||||
|
|||||||
@@ -1,4 +1,5 @@
|
|||||||
import { Select, Button, Space, Tooltip } from 'antd';
|
import { useEffect } from 'react';
|
||||||
|
import { Select, Button, Space, Tooltip, Spin } from 'antd';
|
||||||
import { PlusOutlined, EditOutlined, FolderOpenOutlined } from '@ant-design/icons';
|
import { PlusOutlined, EditOutlined, FolderOpenOutlined } from '@ant-design/icons';
|
||||||
import { useProjectStore } from '../stores/useProjectStore';
|
import { useProjectStore } from '../stores/useProjectStore';
|
||||||
|
|
||||||
@@ -6,11 +7,18 @@ export const ProjectSelector = () => {
|
|||||||
const {
|
const {
|
||||||
currentProject,
|
currentProject,
|
||||||
projects,
|
projects,
|
||||||
|
loading,
|
||||||
setCurrentProject,
|
setCurrentProject,
|
||||||
setShowCreateDialog,
|
setShowCreateDialog,
|
||||||
setShowEditDialog,
|
setShowEditDialog,
|
||||||
|
fetchProjects,
|
||||||
} = useProjectStore();
|
} = useProjectStore();
|
||||||
|
|
||||||
|
// 组件挂载时获取项目列表
|
||||||
|
useEffect(() => {
|
||||||
|
fetchProjects();
|
||||||
|
}, [fetchProjects]);
|
||||||
|
|
||||||
const handleProjectChange = (projectId: string) => {
|
const handleProjectChange = (projectId: string) => {
|
||||||
if (projectId === 'global') {
|
if (projectId === 'global') {
|
||||||
setCurrentProject(null);
|
setCurrentProject(null);
|
||||||
@@ -29,23 +37,25 @@ export const ProjectSelector = () => {
|
|||||||
<span className="text-sm font-medium text-gray-700">当前项目</span>
|
<span className="text-sm font-medium text-gray-700">当前项目</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Space.Compact block>
|
<Spin spinning={loading} size="small">
|
||||||
<Select
|
<Space.Compact block>
|
||||||
value={currentProject?.id || 'global'}
|
<Select
|
||||||
onChange={handleProjectChange}
|
value={currentProject?.id || 'global'}
|
||||||
style={{ width: '100%' }}
|
onChange={handleProjectChange}
|
||||||
placeholder="选择项目"
|
style={{ width: '100%' }}
|
||||||
>
|
placeholder="选择项目"
|
||||||
<Select.Option value="global">
|
loading={loading}
|
||||||
<span className="text-blue-600">全局快速问答</span>
|
>
|
||||||
</Select.Option>
|
<Select.Option value="global">
|
||||||
|
<span className="text-blue-600">全局快速问答</span>
|
||||||
{projects.map((project) => (
|
|
||||||
<Select.Option key={project.id} value={project.id}>
|
|
||||||
{project.name}
|
|
||||||
</Select.Option>
|
</Select.Option>
|
||||||
))}
|
|
||||||
</Select>
|
{projects.map((project) => (
|
||||||
|
<Select.Option key={project.id} value={project.id}>
|
||||||
|
{project.name}
|
||||||
|
</Select.Option>
|
||||||
|
))}
|
||||||
|
</Select>
|
||||||
|
|
||||||
<Tooltip title="创建新项目">
|
<Tooltip title="创建新项目">
|
||||||
<Button
|
<Button
|
||||||
@@ -64,11 +74,12 @@ export const ProjectSelector = () => {
|
|||||||
)}
|
)}
|
||||||
</Space.Compact>
|
</Space.Compact>
|
||||||
|
|
||||||
{currentProject && (
|
{currentProject && (
|
||||||
<div className="mt-2 text-xs text-gray-500 truncate">
|
<div className="mt-2 text-xs text-gray-500 truncate">
|
||||||
{currentProject.background || '未设置项目背景'}
|
{currentProject.background || '未设置项目背景'}
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
</Spin>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -1,4 +1,6 @@
|
|||||||
import { create } from 'zustand';
|
import { create } from 'zustand';
|
||||||
|
import { projectApi } from '../api/projectApi';
|
||||||
|
import { message } from 'antd';
|
||||||
|
|
||||||
export interface Project {
|
export interface Project {
|
||||||
id: string;
|
id: string;
|
||||||
@@ -16,6 +18,9 @@ interface ProjectState {
|
|||||||
// 所有项目列表
|
// 所有项目列表
|
||||||
projects: Project[];
|
projects: Project[];
|
||||||
|
|
||||||
|
// 加载状态
|
||||||
|
loading: boolean;
|
||||||
|
|
||||||
// 是否显示创建项目对话框
|
// 是否显示创建项目对话框
|
||||||
showCreateDialog: boolean;
|
showCreateDialog: boolean;
|
||||||
|
|
||||||
@@ -30,11 +35,14 @@ interface ProjectState {
|
|||||||
deleteProject: (id: string) => void;
|
deleteProject: (id: string) => void;
|
||||||
setShowCreateDialog: (show: boolean) => void;
|
setShowCreateDialog: (show: boolean) => void;
|
||||||
setShowEditDialog: (show: boolean) => void;
|
setShowEditDialog: (show: boolean) => void;
|
||||||
|
setLoading: (loading: boolean) => void;
|
||||||
|
fetchProjects: () => Promise<void>;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const useProjectStore = create<ProjectState>((set) => ({
|
export const useProjectStore = create<ProjectState>((set) => ({
|
||||||
currentProject: null,
|
currentProject: null,
|
||||||
projects: [],
|
projects: [],
|
||||||
|
loading: false,
|
||||||
showCreateDialog: false,
|
showCreateDialog: false,
|
||||||
showEditDialog: false,
|
showEditDialog: false,
|
||||||
|
|
||||||
@@ -65,5 +73,25 @@ export const useProjectStore = create<ProjectState>((set) => ({
|
|||||||
setShowCreateDialog: (show) => set({ showCreateDialog: show }),
|
setShowCreateDialog: (show) => set({ showCreateDialog: show }),
|
||||||
|
|
||||||
setShowEditDialog: (show) => set({ showEditDialog: show }),
|
setShowEditDialog: (show) => set({ showEditDialog: show }),
|
||||||
|
|
||||||
|
setLoading: (loading) => set({ loading }),
|
||||||
|
|
||||||
|
// 获取项目列表
|
||||||
|
fetchProjects: async () => {
|
||||||
|
try {
|
||||||
|
set({ loading: true });
|
||||||
|
const response = await projectApi.getProjects();
|
||||||
|
if (response.success && response.data) {
|
||||||
|
set({ projects: response.data });
|
||||||
|
} else {
|
||||||
|
message.error(response.message || '获取项目列表失败');
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('获取项目列表失败:', error);
|
||||||
|
message.error('获取项目列表失败');
|
||||||
|
} finally {
|
||||||
|
set({ loading: false });
|
||||||
|
}
|
||||||
|
},
|
||||||
}));
|
}));
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user