前言
汉得飞搭aPaaS低代码平台（FEIDA，以下简称“飞搭”）是基于低代码理念打造的融合 aPaaS 平台，助力企业快速搭建业务应用。作为 HZERO 生态的重要组成部分，致力于充分融合 HZERO 的各平台能力，提供企业用户在线化灵活搭建业务应用的能力，支撑企业普惠化（低门槛、高协作）、敏态化（高效率） 和低成本化地快速响应市场变化，加速复杂业务场景落地。
概要介绍
左树右表页面作为一种常见的数据结构展示方式，以其清晰的层级结构展示、丰富的数据操作功能和广泛的应用场景，成为了许多系统中不可或缺的一部分。在需要同时展示具有层级结构的数据及其属性时，左树右表是一种非常有效的页面设计方式，飞搭支持用户通过模板快速进行左树右表页面的创建。
本篇将从以下几个模块进行左树右表页面搭建的介绍：
- 左树右表页面适用场景
介绍常见的可以使用左树右表模板创建页面的业务场景和飞搭实现效果；
- 左树右表页面配置说明
介绍在飞搭如何通过模板快速创建和配置生成左树右表页面；
- 左树右表页面高阶配置
介绍在生成的左树右表页面上进行更多配置，以满足用户的个性化需求。
『一』 适用场景
01. 常见场景
组织结构管理：
左树右表页面常用于展示企业、机构或组织的层级结构，如公司的部门组织结构、学校的班级组织结构等；
文件系统管理：
在文件系统中，左树右表页面可以用来表示目录结构，每个节点代表一个文件夹或文件；
商品分类和标签管理：
在电商网站或商品管理系统中，左树右表页面可以用来表示商品分类和标签的层级关系；
导航菜单管理：
在网站或应用程序中，左树右表页面可以用来表示导航菜单的结构，用户可以通过左树右表页面方便地浏览和管理网站的导航菜单。
02. 实现效果
以组织结构管理场景为例，下图为左树右表页面可支持的功能效果：
1. 左侧树以层级结构展示：
左树右表页面能够清晰地展示数据的层级关系，用户可以通过点击左侧部门组织架构树的部门节点，快速定位到某部门，并联动查看其部门下的员工详细信息；
2. 右侧列表支持数据操作：
支持对该部门查询到的员工信息列表进行新建、删除、编辑、查询等操作，满足用户在不同场景下的数据处理需求；
3. 树表支持数据筛选和排序：
用户可以根据需要，筛选和排序树组件与列表组件中的数据，以便更快速地找到所需信息；
4. 动态交互：
左树右表页面支持动态交互效果，如点击展开/折叠部门的节点。
『二』 配置说明
01. 选择模板
点击<从模板新建>按钮，点开新建页面弹窗，选择【左树右表】模板，点击下一步；
02. 创建功能页面
维护功能名称、页面名称等页面基础信息；
03. 配置页面
进行页面信息的配置：
关系查询：
开启关系查询，生成左树右表页面时会为页面自动创建关系， 右侧列表根据左侧树选择的数据进行查询，此时列表业务对象只能选择和树业务对象具备主从关系的业务对象；关闭关系查询则在生成页面时不会自动创建关系和查询。
树组件配置：
选择树组件所属领域与业务对象，以及构成树组件的必输属性：显示字段、标识字段、父级标识字段。
-
显示字段是树组件进行层级展开/收起的显示名称字段；
-
标识字段建议用户选择具有唯一性的字段；
3. 父级标识字段用于记录一条数据父节点的标识字段，判断当前数据的父节点是哪条数据，以形成树结构中的父子关系。
列表配置：
开启关系查询时可选择和树业务对象具备主从关系的业务对象，未开启关系查询则可选择所有业务对象。
『三』 高阶配置
01. 树组件根节点联动查询子节点所有数据
用户可修改树组件与列表组件默认生成的关系配置，当父级部门编码与子级部门编码支持模糊匹配时，可将组件<关联字段>的模糊类型修改为“全模糊”；
预览页面点击父级部门时，可联动查询到当前父级部门下所有子级部门的员工数据。
02. 树组件的交互配置
树组件支持配置<自定义节点图标>、<默认排序>等属性，同时可在树组件按钮区新建按钮，配置对应的事件流，进行交互操作；
当前场景中，在部门管理树组件中新建并配置<编辑>图标按钮，点击打开编辑部门信息弹窗，支持编辑修改选中部门的基础信息。
- 布局组件的样式配置
左树右表页面使用的布局容器组件也支持进行样式编辑，在当前场景中，为树组件与列表组件所在的布局容器配置<边框颜色>、<边框类型>等样式；
预览可查看布局容器配置后的左树右表页面样式。
结语
飞搭低代码平台作为 HZERO 生态的重要组成部分，致力于充分融合 HZERO 的各平台能力，提供企业用户在线化灵活搭建业务应用的能力，支撑企业普惠化（低门槛、高协作）、敏态化（高效率）和低成本化地快速响应市场变化，加速复杂业务场景落地。
左树右表页面具有结构清晰、操作方便、功能性强、页面空间利用率高、收起/展开灵活等优点，在需要同时展示具有层级结构的数据及其属性时，左树右表是一种非常有效的页面设计方式。通过飞搭的左树右表页面模板，可助力用户快速搭建符合以上需求的页面，用户只需根据个性化需求进行页面的快速调整后即可使用。
接下来，我们将持续推出飞搭平台专题系列教程，帮助您更好地掌握飞搭平台的使用技巧，敬请期待！
联系我们
1. 如果您想了解飞搭更详细的功能介绍和产品信息请查阅我们的产品文档：
请在PC端打开 👉汉得焱牛开放平台
open.hand-china.com/document-ce…
2. 如果您有疑问或者建议，可以通过开放平台进行工单反馈，问题分类请选择【产品/汉得aPaaS平台-飞搭】：
请在PC端打开👉汉得焱牛开放平台
3. 相关产品咨询或更多信息了解，欢迎联系我们
邮箱：openhand@vip.hand-china.com
