组件概述
- Container
-
Container类负责处理项目的路由和状态管理。它使用 Redux 来管理项目的动作和工作流相关的动作。 - 它包含了用于刷新页面、索引问题、创建、显示、获取选项等功能的方法。
- Blocks
-
Blocks组件渲染甘特图中的任务块。它遍历任务集合，并为每个任务创建一个BlockItem。
- BlockItem
-
BlockItem组件负责渲染单个任务块。它显示任务的状态、开始时间和结束时间，并提供一个弹出窗口来显示更多详细信息。
- Grids
-
Grids组件渲染甘特图的网格部分。它根据当前滚动位置和屏幕宽度来决定哪些网格项应该被渲染。
- GridItem
-
GridItem组件负责渲染单个网格项。它会根据今天的日期和标记的任务来设置不同的样式。
- GridEmptyItem
-
GridEmptyItem组件用于填充空的网格项。
- Header
-
Header组件提供了页面的头部功能，如创建新任务、保存过滤器、重置过滤器等。
- HzHeader
-
HzHeader组件渲染水平方向的标题栏，显示月份和每天的日期。
- List
-
List组件是甘特图的主要部分，它负责管理任务列表、处理任务的操作（如编辑、折叠）、设置日期范围等。
- VtHeader
-
VtHeader组件渲染垂直方向的标题栏，显示任务的主题、编号、负责人、进度或状态等信息。
- VtHeaderItem
-
VtHeaderItem组件负责渲染单个任务的垂直标题栏项。
- FilterContainer
-
FilterContainer组件负责处理过滤器相关的工作，如获取过滤器选项、选择过滤器等。
- EditModal
-
EditModal组件提供一个模态框来编辑任务的期望开始时间、结束时间和进度。
逻辑说明
- 任务数据管理
-
List组件是核心组件，它管理任务列表，并负责处理任务的各种操作，如显示、编辑、折叠等。 - 它从服务器获取任务数据，并根据这些数据计算甘特图的显示范围和布局。
- 任务块渲染
-
Blocks组件接收任务集合，并为每个任务创建一个BlockItem组件。 -
BlockItem组件显示任务的详细信息，并提供交互功能，如点击弹出详细信息。
- 网格渲染
-
Grids组件负责渲染甘特图的网格部分。 -
GridItem组件负责渲染单个网格项，并根据任务的开始和结束时间来设置宽度和位置。 -
GridEmptyItem组件用于填充空的网格项。
- 头部显示
-
Header组件提供了页面的头部功能，如创建新任务、保存过滤器等。 -
HzHeader组件显示水平方向的日期信息。 -
VtHeader组件显示垂直方向的任务信息。
- 过滤器管理
-
FilterContainer组件处理过滤器相关的操作，如获取过滤器选项、选择过滤器等。
- 编辑任务
-
EditModal组件提供一个模态框来编辑任务的期望开始时间、结束时间和进度。
协同工作
- Container 组件负责整体的路由和状态管理。
- List 组件是核心组件，负责管理任务列表。
- Blocks 和 BlockItem 组件负责渲染任务块。
- Grids、GridItem 和 GridEmptyItem 组件负责渲染甘特图的网格。
- Header、HzHeader 和 VtHeader 组件负责渲染头部信息。
- FilterContainer 组件负责处理过滤器相关的工作。
- EditModal 组件提供编辑任务的功能。
这些组件通过 Redux 管理状态，并通过事件处理器（如点击事件）相互协作，实现了完整的甘特图功能。
