hurole
d22fdc9618
## 后端改动 - 添加 Project.envPresets 字段（JSON 格式） - 移除 Deployment.env 字段，统一使用 envVars - 更新部署 DTO，支持 envVars (Record<string, string>) - pipeline-runner 支持解析并注入 envVars 到环境 - 移除稀疏检出模板和相关环境变量 - 优化代码格式（Biome lint & format） ## 前端改动 - 新增 EnvPresetsEditor 组件（支持单选/多选/输入框类型） - 项目创建/编辑界面集成环境预设编辑器 - 部署界面基于预设动态生成环境变量表单 - 移除稀疏检出表单项 - 项目详情页添加环境变量预设配置 tab - 优化部署界面布局（基本参数 & 环境变量分区） ## 文档 - 添加完整文档目录结构（docs/） - 创建设计文档 design-0005（部署流程重构） - 添加 API 文档、架构设计文档等 ## 数据库 - 执行 prisma db push 同步 schema 变更
70 lines
1.9 KiB
TypeScript
70 lines
1.9 KiB
TypeScript
import { Button, Grid, Typography } from '@arco-design/web-react';
|
|
import { IconPlus } from '@arco-design/web-react/icon';
|
|
import { useState } from 'react';
|
|
import { useAsyncEffect } from '../../../hooks/useAsyncEffect';
|
|
import type { Project } from '../types';
|
|
import CreateProjectModal from './components/CreateProjectModal';
|
|
import ProjectCard from './components/ProjectCard';
|
|
import { projectService } from './service';
|
|
|
|
const { Text } = Typography;
|
|
|
|
function ProjectPage() {
|
|
const [projects, setProjects] = useState<Project[]>([]);
|
|
const [createModalVisible, setCreateModalVisible] = useState(false);
|
|
|
|
useAsyncEffect(async () => {
|
|
const response = await projectService.list();
|
|
setProjects(response.data);
|
|
}, []);
|
|
|
|
const handleCreateProject = () => {
|
|
setCreateModalVisible(true);
|
|
};
|
|
|
|
const handleCreateSuccess = (newProject: Project) => {
|
|
setProjects((prev) => [newProject, ...prev]);
|
|
};
|
|
|
|
const handleCreateCancel = () => {
|
|
setCreateModalVisible(false);
|
|
};
|
|
|
|
return (
|
|
<div className="p-6">
|
|
<div className="mb-6 flex items-center justify-between">
|
|
<div>
|
|
<Typography.Title heading={2} className="!m-0 !text-gray-900">
|
|
我的项目
|
|
</Typography.Title>
|
|
<Text type="secondary">管理和查看您的所有项目</Text>
|
|
</div>
|
|
<Button
|
|
type="primary"
|
|
icon={<IconPlus />}
|
|
onClick={handleCreateProject}
|
|
className="!rounded-lg"
|
|
>
|
|
新建项目
|
|
</Button>
|
|
</div>
|
|
|
|
<Grid.Row gutter={[16, 16]}>
|
|
{projects.map((project) => (
|
|
<Grid.Col key={project.id} span={8}>
|
|
<ProjectCard project={project} />
|
|
</Grid.Col>
|
|
))}
|
|
</Grid.Row>
|
|
|
|
<CreateProjectModal
|
|
visible={createModalVisible}
|
|
onCancel={handleCreateCancel}
|
|
onSuccess={handleCreateSuccess}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default ProjectPage;
|