EOS Low-Code Platform 8 EOS Low-Code Platform 8
产品简介
学习指南
更新说明
安装与集成
上线指南
初见EOS
低代码开发手册
专业代码开发手册
智能体开发手册
专题场景实战
公共服务框架
应用运行治理
运维指南
  • 在表单中触发嵌套资源容器查询
  • 1.场景介绍
  • 2.数据模型与页面准备
  • 2.1 实体关系
  • 2.3 前置准备
  • 3.效果展示
  • 4.实现思路
  • 5.操作步骤
  • 5.1 订单表单添加供应商下拉选择框和全局变量
  • 5.2 订单表单添加资源容器引用订单详情表单
  • 5.3 订单详情表单添加资源容器引用供应商默认视图
  • 5.4 供应商默认视图添加快速筛选条件
  • 5.5 查询按钮开发
  • 6.注意事项

# 在表单中触发嵌套资源容器查询

# 1.场景介绍

在订单管理业务中,订单表单通过资源容器嵌套了订单详情表单,订单详情表单中又通过资源容器嵌套了供应商默认视图。业务人员希望在订单表单页面中选择供应商,点击查询按钮后,直接让最内层的供应商视图按所选供应商进行过滤,而无需逐层进入内层页面手动查询。

本文以订单、订单详情、供应商三个实体的关联关系为基础,讲解如何在订单表单中配置下拉选择框和自定义查询按钮,将选中的供应商作为查询条件传递到嵌套的供应商视图中,触发供应商条件查询。

# 2.数据模型与页面准备

# 2.1 实体关系

订单、订单详情、供应商、物料、规格等实体之间的关联关系如下图所示:

# 2.3 前置准备

参照实体关系图完成实体的创建、关联关系建立以及页面生成。本文在此基础上进行嵌套查询的配置。

# 3.效果展示

页面嵌套结构:

订单表单(供应商下拉选择框 + 查询按钮)→ 资源容器引用订单详情表单 → 订单详情表单中的资源容器引用供应商默认视图。

运行效果示例:在订单表单的「供应商」下拉框中选择某一供应商,点击「查询」按钮后,最内层供应商视图会自动刷新,仅展示与该供应商匹配的数据。 效果见下图:

# 4.实现思路

将订单表单中下拉选择框选中的供应商值通过全局变量传递到供应商默认视图,再通过查询按钮事件逐层获取嵌套的资源容器对象(订单详情表单 → 供应商默认视图,最终调用供应商默认视图的 doQuery() 触发条件搜索。

  1. 在订单表单中添加全局变量,用于存储下拉选择框选中的供应商值。
  2. 在供应商默认视图中添加快速筛选条件,根据供应商编码或名称进行查询,默认值设置为订单表单中的全局变量。
  3. 在订单表单的查询按钮点击事件中,通过 getFrameAsync 逐层获取嵌套的资源容器对象:先获取订单详情表单,再从订单详情表单中获取嵌套的供应商默认视图,最后调用供应商默认视图的 doQuery() 触发供应商视图的条件查询。

# 5.操作步骤

# 5.1 订单表单添加供应商下拉选择框和全局变量

  1. 进入订单表单页面,添加供应商下拉选择框和全局变量。
  1. 在订单表单中添加按钮组件,显示名称为"查询",用于触发嵌套资源容器的查询。

# 5.2 订单表单添加资源容器引用订单详情表单

在订单表单中添加资源容器,引用订单详情表单。

  1. 在订单表单中拖入资源容器组件,字段名设为 detailsframe。
  2. 页面资源选择"订单详情(表单)"。
  3. 绑定层级建议选择"字段"。

# 5.3 订单详情表单添加资源容器引用供应商默认视图

进入订单详情表单,添加资源容器引用供应商默认视图。

  1. 打开订单详情表单页面。
  2. 在表单中拖入资源容器组件,字段名设为 supplierView。
  3. 页面资源选择"供应商-默认视图"。
  4. 绑定层级建议选择"字段"。

# 5.4 供应商默认视图添加快速筛选条件

进入供应商默认视图的视图设置,添加快速筛选条件,使视图能够接收订单表单传递的供应商值。

  1. 打开供应商默认视图,点击"视图设置"。

  2. 配置快速筛选条件,选择供应商名称字段,设置筛选默认值为全局变量: supplier。

# 5.5 查询按钮开发

在订单表单的查询按钮点击事件中,通过代码逐层获取嵌套资源容器对象,最终调用供应商默认视图的 doQuery() 触发其条件查询。

// 第一层:拿订单表单中的资源容器里的表单,资源容器字段名为:detailsframe
this.Api.getFrameAsync('detailsframe').then(formFrame => {
  // 第二层:从订单详情表单里拿嵌套的供应商视图,订单详情表单中使用资源容器引用供应商视图,字段名为:supplierView
  formFrame.Api.getFrameAsync('supplierView').then(viewFrame => {
  //触发供应商视图的查询
    viewFrame.Api.doQuery()
  })
})

代码说明:

方法 说明
this.Api.getFrameAsync('detailsframe') 获取订单表单中字段名为 detailsframe 的资源容器(订单详情表单)对象
formFrame.Api.getFrameAsync('supplierView') 从订单详情表单中获取字段名为 supplierView 的资源容器(供应商默认视图 )对象
viewFrame.Api.doQuery() 调用供应商默认视图的查询方法,触发条件搜索

说明:getFrameAsync 为异步方法,需通过 then 回调获取下一层对象。如果嵌套层级更多,可按相同方式继续逐层获取。本例通过 getFrameAsync 先拿到订单详情表单,再从订单详情表单中拿到供应商默认视图,最后调用供应商默认视图的 doQuery() 触发查询;表单与视图同样支持 doQuery()。查询条件本身通过资源容器扩展属性从外层逐层透传,无需在代码中手动传参。

# 6.注意事项

  1. 字段名一致性:代码中的资源容器字段名(如 detailsframe、supplierView)必须与实际配置的字段名完全一致,否则无法获取到对应的容器对象。
  2. 绑定层级选择:建议将绑定层级设置为"字段",避免数据串扰。
  3. 全局变量传递:确保全局变量在下拉选择框值变化时能够实时更新,供应商默认视图的快速筛选用此变量作为默认值才能正确接收查询条件。
  4. 异步加载时序:资源容器内的页面可能需要一定加载时间,如果在页面加载初期触发查询可能获取不到容器对象,建议在表单加载完成后再触发查询操作。

← js调用接口如何修改请求头与响应头 数据实体生成的SDO代码调用示例 →