11.4 测试与发布（作业批改智能体开发）

《扣子编程：从零开始搭建智能体 卢欣欣 清华大学出版社》【摘要 书评 试读】- 京东图书

《扣子编程：从零开始搭建智能体》全书案例持续更新-CSDN博客

在“小睿智评”智能体的功能与参数配置全部就绪后，为确保系统交付质量，需进行系统功能测试。测试范围涵盖输入引导、作业批改、学情报告生成及错题数据入库等关键功能。其中，批改功能的测试结果如图11-37所示。

图11-37 批改测试

经过多轮测试无误后，单击智能体页面右上角的“发布”按钮，按照系统引导完成发布，最后可将智能体链接分享给用户使用。

11.5拓展提升：从对话式交互到可视化应用

前文构建的智能体采用纯对话式方式进行交互，底层完全依赖11.3.2节讲解的工作流驱动。这种“一次输入、全程自动”的机制有效简化了操作流程，但是其在交互颗粒度与灵活性上存在明显局限：其一，批阅结果结构化不足，阅读体验欠佳；其二，每次批阅均强制触发学情报告生成流程，用户缺乏按需控制权，导致响应等待时间较长。针对自动化执行与灵活交互之间的矛盾，本节将引入可视化UI组件，搭建具备完整用户界面的应用程序，以实现更精细的流程控制与体验升级。

11.5.1解耦与拆分工作流

11.3.2节创建的原始工作流将作业批改、学情分析与错题入库整合为单一流程。现在，为满足前端UI按需调用的灵活性需求，需对该单体工作流进行解耦拆分，重构为三个相互独立的工作流。具体操作步骤如下。

1.作业批改工作流（correct）

基于原工作流复制副本。将作业批改“大模型”节点的右侧输出端点直接连接至“结束”节点，并删除结束节点中关于学情报告的输出变量，使其仅返回批改结果。最后，删除其他多余节点，改造后的工作流如图11-38所示。

图11-38 批改测试

2.学情报告工作流（generate_report）

再次复制原工作流，仅保留学情分析分支的节点，删除批改与入库的相关节点。将“开始”节点的输入变量更改为String类型的correct_result（批改结果数据），以此承接上游传入的批改数据。改造后的工作流如图11-39所示。

图11-39 批改测试

3.数据入库工作流（error2db）

同理，复制原工作流并仅保留错题入库分支节点，删除无关分支。将“开始”节点的输入变量同样修改为String类型的correct_result，用于接收传入的批改数据。改造后的工作流如图11-40所示。

图11-40 批改测试

11.5.2创建应用

“应用”是扣子平台提供的一种带可视化界面的工具，本节介绍应用的创建方式。

步骤1：进入创建应用入口。在扣子编程首页中，将鼠标悬停在“低代码模式”右侧的“更多”链接上，文字会变成“打开应用开发”，如图11-41所示。单击该链接进入创建应用页面。

图11-41 创建应用

步骤2：选择应用模板。在应用模板窗口中，选择“创建空白应用”。

图11-42 选择应用模板

步骤3：填写应用基本信息。在弹出的“创建应用”对话框中填写应用名称、应用介绍、并生成应用图标。最后，单击“确认”按钮完成应用的创建，如图11-43所示。

图11-43 填写应用信息

应用创建成功后，系统自动跳转至如图11-43所示的应用编辑页面，在该页面中主要由左侧的“资源”区域和右侧的“编辑”区域组成。

图11-44 应用编辑页面

11.5.3批改作业功能的实现

步骤1：创建页面。单击编辑区域上方的“用户界面”标签，切换到界面编辑模式。然后，选择“小程序和H5”类型，单击“开始搭建”按钮，完成作业批改页面的创建，如图11-45所示。

图11-45 创建页面

步骤2：添加布局容器。为使页面排版更加整齐规范，从左侧“布局组件”库中拖拽“容器”组件至画布中。然后，选中该容器，在右侧属性面板中，将其高度设置为“适应内容”，如图11-46所示。

图11-46 添加容器

步骤3：添加页面元素。从左侧“输入组件”和“展示组件”分类中，依次拖拽“图片上传”“按钮”“Markdown”组件至容器内部，如图11-47所示。

图11-47 添加页面元素

步骤4：绑定作业批改工作流。选中页面中的“开始批改”按钮，在右侧属性设置中单击“事件”按钮切换至事件模式。然后，单击“+ 新建”按钮添加事件，事件类型选择“点击时”触发，执行动作选择“调用工作流”，并从资源库中导入11.5.1节创建的批改工作流correct，如图11-48所示。

图11-48 绑定事件

工作流导入后会显示工作流入参配置，单击变量图标，在弹出的列表中选择“ImageUpload1”组件下的“value”值（即用户上传的图片文件），单击“确定”按钮完成绑定操作，如图11-49所示。

图11-49 工作流入参配置

步骤4：设置Markdown组件的内容。选中该组件，在右侧属性面板的“内容”设置中单击“绑定数据”按钮。然后，单击绑定变量图标，在变量绑定列表中，选择工作流correct的输出数据data，完成批改结果的回显绑定，如图11-50所示。

图11-50 设置Markdown显示内容

步骤5：预览测试。单击页面右上角的“预览”按钮进入预览模式。在打开的预览界面中，单击图片上传区域，导入一幅本地作业图片。最后，单击“开始批改”按钮触发工作流，执行结果如图11-51所示。

.

图11-51 作业批改页面测试结果

11.5.4批改作业功能的优化

作业批改工作流的执行耗时较长，用户单击“开始批改”按钮后，页面若长时间处于无反馈的停滞状态，极易造成系统卡死的误判。为提升交互体验，需引入状态反馈与防重复提交机制，具体从以下两个维度进行优化。

1.增加加载状态提示

步骤1：添加提示信息。在Markdown组件上方拖入一个“文本”组件，将其显示内容修改为“正在批改中，请等待~”，如图11-52所示。

图11-52 添加文本组件

步骤2：配置条件可见性。选中文本组件，在右侧属性面板的“可见性”设置中添加条件，配置为：当工作流correct的状态为“加载中”时，显示该组件；其余状态则默认隐藏，如图11-53所示。

图11-53 文本组件的可见性设置

2.设置按钮防重复提交

步骤3：配置按钮禁用逻辑。选中“开始批改”按钮，在右侧属性面板的“状态”设置中添加条件，配置为：当工作流correct的状态为“加载中”时，禁用该按钮，以防止用户重复点击造成多次触发工作流，如图11-54所示。

图11-54 按钮组件的状态设置

完成上述优化配置后，再次进入预览模式。单击“开始批改”按钮时，页面将显示“正在批改中，请等待~”的加载提示并禁用“开始批改”按钮，待工作流执行完毕后自动恢复正常状态，优化后的执行效果如图11-55所示。

图11-55 测试结果

11.5.5收藏错题功能的实现

步骤1：添加“收藏错题”按钮。从左侧“输入组件”库中拖拽一个“按钮”组件至画布，放置于“开始批改”按钮的下方，并将其显示文本修改为“收藏错题”，如图11-56所示。

图11-56 添加按钮组件

步骤2：配置按钮禁用逻辑。由于“收藏错题”操作依赖于批改结果，须在批改工作流执行完毕后方可触发。选中该按钮，在右侧属性面板的“状态”设置中，为“何时禁用”添加条件：当工作流correct处于“尚未调用”“加载中”或“请求错误”任意状态时，禁用该按钮，如图11-57所示。

图11-57 按钮的状态设置

步骤3：绑定错题入库工作流。 选中“收藏错题”按钮，在右侧属性面板中切换至“事件”模式新建事件。配置事件类型为“点击时”触发，执行动作为“调用工作流”，并从资源库中导入11.5.1节创建的数据入库工作流error2db。同时，按需配置工作流调用成功与失败时的提示信息，如图11-58所示。

图11-58 绑定事件

步骤4：预览测试。单击页面右上角的“预览”按钮进入预览模式。首先上传作业图片并等待批改完成，然后单击“收藏错题”按钮。最后，进入后台数据库核验错题数据是否成功写入。前端应用执行结果如图11-59所示。

图11-59 测试结果