【界面设计器】他表字段

阅读之前

你应该:

概述

他表字段是一种可以从关联关系字段中取出对应字段,并平铺在当前模型中的特殊字段。本质上是具有固定【计算公式】的字段。

其主要用于解决GQL在获取关联关系字段时层级过深的问题(非存储的他表字段),也可以用于解决字段冗余的数据同步问题(存储的他表字段)。

这里需要注意的一点是,他表字段的数据同步能力是在客户端进行处理的。无法完全保证数据同步的一致性。

场景描述

为了方便接下来的描述,我们需要先构建一个基本的业务场景,这个场景中包含【商品】、【商品订单】以及【商品订单明细】三个模型。

创建/编辑【商品订单明细】时使用【商品】,【商品】下拉选项中使用【商品编码】 - 【商品名称】格式展示。

在【商品订单明细】展开的表格中展示【商品编码】和【商品名称】,而不是使用【商品】。

其模型定义如下:

商品(Item)
名称 API名称 业务类型 是否多值 长度(单值长度) 关联模型 关联字段
ID id 整数 - - - -
编码 code 文本 128 - - -
名称 name 文本 128 - -
商品订单(ItemOrder)
名称 API名称 业务类型 是否多值 长度(单值长度) 关联模型 关联字段
ID id 整数 128 - -
编码 code 文本 128 - - -
订单明细 details 一对多 - 商品订单明细(ItemOrderDetail) id - orderId
商品订单明细(ItemOrderDetail)
名称 API名称 业务类型 是否多值 长度(单值长度) 关联模型 关联字段
ID id 整数 128 - -
订单 order 多对一 - 商品订单(ItemOrder) orderId - id
订单ID orderId 整数 - - -
商品 item 多对一 - 商品(Item) itemId - id
商品ID itemId 整数 - - -
数量 count 整数 - - -

准备工作

根据模型定义,我们要为【商品】和【商品订单】创建基本的增删改查操作,以此来进行我们接下来的步骤。

(下面仅展示了一些特殊页面,其他页面与基础的增删改查页面没有明显差别)

设计商品订单【表单】视图

将订单明细拖放至页面中,并使用【组件切换】功能将当前的【下拉多选】组件切换至【表格】组件。

image.png

对订单明细所展开的【内嵌表格】进行设计。将【商品】和【数量】两个字段放入表格中。

image.png

设计创建和编辑使用的弹窗视图。(两个按钮都需要设计,这里仅演示创建按钮的设计过程)

image.png

image.png

小贴士:

  • 点击弹窗右上角的X可关闭弹窗设计页面。
  • 左侧【组件库】-【模型】中展示的【当前模型】在选中【订单明细】字段以及它内部的字段或动作时会变为【商品订单明细】关联模型。要想继续设计【商品订单】模型,需要选中任意一个不在【订单明细】字段范围内的组件。在当前视图中可以选中【编码】字段切换至【商品订单】模型。
  • 多模型视图的设计总是需要关注【当前模型】这一信息的。

创建他表字段

目前仅能在界面设计器中通过他表字段组件创建他表字段,在低代码中使用Related定义他表字段。

拖入他表字段,创建【商品编码】字段

image.png

拖入他表字段,创建【商品名称】字段

image.png

隐藏表格中的【商品】字段

image.png

PS:由于他表字段本质上是通过引用的方式取得对象中的值,所以此处不能将该字段直接移除,而是需要隐藏。

在创建/编辑弹窗中添加他表字段并隐藏

image.png

PS:内嵌表格的创建/编辑功能同样会根据元数据进行裁剪,因此要想保证【商品编码】和【商品名称】被正确回填到表格中,这一步骤是必须的。并且为了避免由于使用不同字段导致无法回填的问题,你需要从【组件库】-【模型】中重复使用字段,而不是从【组件】拖入。这并非是他表字段的特性,而是所有内嵌表格都只能通过这种方式进行数据回填。

Oinone社区 作者:oinone原创文章,如若转载,请注明出处:https://doc.oinone.top/designer/60.html

访问Oinone官网:https://www.oinone.top获取数式Oinone低代码应用平台体验

(0)
oinone的头像oinone
上一篇 2023年6月20日 下午4:07
下一篇 2023年11月2日 下午1:58

相关推荐

  • 自定义字段的数据联动

    某种情况下,开发人员期望自定以的字段发生变化后,需要修改其他的字段,这篇文章从两个维度来讲解如果处理数据的联动 界面设计器配置 1: 在界面设计器页面中的的组件区域找到自定义的字段,设计元件 2: 在模型区域,搜索提交方式,如果找到了,就把该字段拖拽进来, 如果找不到,就在元件中的组件区域,拖拽一个文本字段,按照下面的配置进行配置,然后保存 图一是找到了对应…

    2023年11月9日
    74400
  • 集成接口与数据流程的使用

    连接器 点击连接器tab,进入连接器页面,默认选择应用 应用 点击新增应用资源,抽屉打开创建应用的表单 创建应用成功之后,点击应用卡片,进入应用详情页 点击新增API,出现新增API与新增webservice的选项 点击新增API或者新增webservice,抽屉打开新增页面,需设置api名称、url、描述、请求参数、响应结果等信息 数据库 点击数据库tab…

    2023年11月10日
    29500
  • 弹窗或抽屉表单视图rootRecord获取不到对应的数据

    在平台默认的实现中,rootRecord 代表的是根视图的数据。比如,在表格页面点击按钮打开了弹窗,弹窗里面包含一个表单视图,但是该视图获取 rootRecord 却是最外层的视图数据。 如果期望 rootRecord 数据是弹窗的视图数据,需要手动修改表单的 rootRecord。下面的代码演示了如何重写 rootData 以确保其数据是弹窗的数据: @S…

    2023年11月13日
    67100
  • 工作流动态表单最佳实践

    需求背景 为了提高操作效率并简化流程设计过程,应对伙伴们反映的在流程设计器中,即使填写/审批流程相同,不同模型也需重新配置的问题,我们引入了“动态表单”功能。此功能旨在减少重复配置的需求,通过设置节点名称和绑定视图,便可实现审批流程相同而视图不同,从而使得相同的审批流程可以被高效重复利用。 为确保伙伴们能够更加方便的使用动态表单,我们将典型示例整合至“工作流…

    2024年8月22日
    86100
  • 界面设计器的导入导出

    目录 依赖包安装GraphQL的工具登录gql导出生成json文件子业务工程中导入示例代码 简介 通过调用导出接口,将设计器的设计数据与元数据打包导出到文件中。提供了download/export两类接口。 依赖包 <dependency> <groupId>pro.shushi.pamirs.metadata.manager<…

    2024年5月16日
    77100

发表回复

登录后才能评论