# 表单关联快速实现项目管理过程中的任务上报

来源快照：`result_data_new_260518.json`

- 来源 ID：`1971533642732427608`
- 模块：低代码平台e-builder
- 目录：专题学习 - 场景专题 - 表单专题
- space ID：`1157961794811633670`
- 原文链接：未提供
- 产品基线：未提供

## 正文

**1.  ****编写目的**  


本期主要讲解项目管理过程中，查看项目详情时快速上报项目任务的场景。当项目较多的时候，如何能够快速的管理当前项目的多个项目计划，针对项目多个计划分别对应的多个项目任务能够快速的进行编辑和填写，提升项目管理过程的效率，降低填错的风险。

本场景利用表单关联功能，查看具体的项目卡片时，关联展示不同的计划，点击具体项目计划时，能根据点击的数据快速联动显示计划对应的任务，并且显示在同一面板且可以进行快速的编辑

实现效果如下：

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693810486091808&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D) 

**2.  ****思路分析**  

上述场景使用了表单功能中的关联，按钮，按钮动作，参数传递以及可编辑表格视图等功能。通过这些功能的组合使用，最终实现了一个页面即可协同处理各项任务的效果。

1）利用e-builder表单关联功能，将每一个项目与之对应的计划关联，并且展示在项目卡片上。快速切换tab页即可查看该项目的所包含的项目计划列表。

2）通过表单自定义按钮，配置打开页面动作，利用参数将打开的页面进行过滤来实现点击【项目任务】按钮，右侧推出与当前项目计划关联的项目任务列表。

3）对打开的项目任务列表开启可编辑列表的样式，可以不用进入详情页即可快速编辑相关项目任务。

**3.  ****操作说明**  

**1.****新建项目表单、项目计划、项目任务表单**

如下图所示， 新建项目信息表单，项目计划、项目任务表单，其中项目计划表单使用关联e-builder字段与项目信息关联；项目任务表单使用关联e-builder字段分别与项目计划、项目信息关联。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693810486091831&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

图1：项目计划与项目信息关联

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693814588858385&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

图2：项目任务与项目计划关联

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693814646841391&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

图3：项目任务与项目信息关联

**2.****开启关联，将每一个项目与之对应的计划关联，并且展示在项目卡片上。**

进入后台表单设置中，选中项目信息表单，切换到关联，开启项目计划关联开关（系统会根据表单关联关系自动生成关联，用户可选择使用系统生成或者自行新增）

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693814658793622&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

图4：开启关联

注意：如果是自己新建的关联，配置动作时需要自己配置参数实现过滤

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693818986430525&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

图5：新建关联配置参数

**3.****项目计划表单配置自定义按钮，一键关联项目任务列表**

后台设置中，选中项目计划表单，切换到按钮，新建自定义按钮 

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693819092803671&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

图6：新建按钮

填写按钮基本信息，配置按钮显示位置为行上

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693823237513220&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

图7：配置按钮显示位置

配置按钮动作并传入参数过滤，右侧推出打开与当前项目计划关联的项目任务列表。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693823349391387&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

图8：配置按钮动作及参数

**4.****项目任务开启可编辑列表**

后台设置，选中项目任务表单，切换到视图，点击进入项目任务表格视图。点击基础设置，切换展示样式为：可编辑列表

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693823349391410&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

图9：进入表格视图配置

开启默认显示编辑模式，即可以指定人员打开列表默认显示为编辑模式，并支持设置是否显示只读、编辑模式切换按钮。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693827674349601&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

  


图10：配置表格视图展示样式

最终效果：

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693831922548784&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)
