服务数据集

服务数据集支持将服务请求返回的 JSON 数组，映射为数据模型。支持的请求包括应用内的服务接口，以及 OpenAPI 接口等。

同时，服务数据集还支持通过 JsonPath 配合正则表达式，从请求的 header 或 body 数据中获取返回的记录数、JSON 数组和错误信息。

区别于其他类型的数据集，服务数据集并不是从数据库的角度来获取数据，而是从 API 请求来获取。对于返回列表数据的 API 接口来说，可以通过服务数据集更方便地在前端展示和使用。

服务数据集和其他动态数据集一样，是通过 DBRest 请求访问的，即调用 DBRest API 访问服务数据集，服务数据集再转调相应的服务 API 实现获取数据、编辑数据。

添加服务数据集

在动态数据集的右侧，点击+按钮，可以创建新的服务数据集：

1705921166008

1705921166008

保存路径

  • 数据集的模型描述文件

xxx.data.m 保存在当前模块的根目录下，比如 main 模块的根目录下：

image-20240123113830801

在 .data.m 文件中，会使用 <class type="sql" 来标识 SQL 数据集：

image-20240123113811207

同时在文件中，也能找到之前定义的内容：

image-20240123113947013

使用服务

选择服务

在服务数据集中，点击“选择 API-服务模型”，弹出选择服务窗口

1721986400509

这里列出了应用内所有服务，以及配置好的租户内其它应用的服务

1721986478141

设置查询参数

选择一个服务后，服务的参数会自动作为数据集参数，注意其中的“是否输入”属性，是否输入为是的参数，可以从前端赋值。

特别说明

  • 服务中通常使用 page 和 size 这两个参数获取分页数据
  • DBrest 使用 limit 和 offset 请求分页数据
  • 因此 page 和 size 这两个参数由系统接管，自动实现从 limit 和 offset 到 page 和 size 的转换，所以是否输入为否

1721986521788

添加数据列

如果服务返回数据集的集合，如下图所示，返回分页数据返回“订单主表”集合

1721986555918

在结构中，点击“自动同步”按钮，可将服务返回数据集的结构作为服务数据集的结构

1721986583760

添加服务数据组件

在前端页面上，可以看到后端定义的服务数据集，添加到页面上使用

1721986624952

给参数赋值

如果服务数据集有输入参数，在服务数据组件上，会列出参数，支持给参数赋值

1721986678437

查询数据

调用数据组件的刷新方法 refreshData 查询数据，limit 和 offset 自动转换为 page 和 size，其它参数正常传递

1721986738573

使用 OpenAPI

选择 OpenAPI

在服务数据集中，点击“选择 API-OpenApi”，弹出选择 OpenApi 窗口

1745924575855

输入 ApiDoc 的地址，例如本例使用宠物商店的 ApiDoc，地址为：https://petstore3.swagger.io/api/v3/openapi.json。点击确定按钮，下方显示出宠物商店的 OpenAPI，展开 OpenAPI 显示 API 列表，选择其中一个 API，点击确定按钮

1745924756293

系统根据 ApiDoc 中对于这个 API 的描述，自动填充服务名、请求名称、请求路径、HTTP 方法和请求参数，如下图所示

1745924788196

配置查询数据及结构

API 返回 JSON 数组

如果 API 返回 JSON 数组，数组中的每一项是数据集的一行，如下图所示

1745979287580

切换到“结构”，使用自动同步或 + 添加列，如下图所示

1745925393669

API 返回 JSON 对象

如果 API 返回 JSON 对象，某个键下面是 JSON 数组，如下图所示

1745979509262

配置“查询返回”，在“数据集”中写入 JSON 数组的 JSONPath，如下图所示

1745925753618

切换到“结构”，使用自动同步或 + 添加列，如下图所示

1745979615407

配置分页参数及总记录数

如果 API 分页返回数据，那么需要配置分页参数（例如：page 和 size）和总记录数

分页参数

数据组件使用 limit 和 offset 请求分页数据，API 分页参数通过配置计算表达式，从 limit 和 offset 计算得出，示例如下

<service>
    <!-- 数据集参数,通过命名自动映射到数据查询api参数 -->
    <param>
        <field label="page" name="page" kind="in" editor="" dataType="Integer" private="true" defaultValue="" value="expr:#query['offset']/#query['limit']+1" constraint="" error=""/>
        <field label="size" name="size" kind="in" editor="" dataType="Integer" private="true" defaultValue="" value="expr:#query['limit']" constraint="" error=""/>
constraint="" error=""/>
    </param>

总记录数

在查询返回的配置中，设置“记录数”，支持 API 在 header 和 body 中返回总记录数

  • 在 header 中返回记录数，输入总记录数所在的 header 参数名，如下图所示

1745983087920

  • 在 body 中返回记录数，输入总记录数所在的 JSONPath，如下图所示

1745925859346

数据组件刷新后，获取到总记录数，如下图所示

1745979803689

在页面上使用服务数据集

在页面上添加服务数据组件，如果服务数据集只配置了查询 API，则只能用于查询数据

1745984233168

在服务数据集上设置的查询参数，可以在数据组件的“参数”中设置相应的值，如下图所示，这些值会成为调用 API 的参数

1745984197343

返回树形数据

系统支持两种树形数据：二维表数据和 JSON 嵌套数据

二维表树形数据

数据格式

二维表树形数据格式如下图所示，数据中包含主键 fid 和父节点主键 parentId，系统根据这两个值，推导出树形数据

1722304594868

数据加载方式

二维树形数据支持全部加载和懒加载

全部加载

定义一个服务，返回全部数据

1722319639004

使用服务数据集

添加服务数据集

1722322460352

设置为树形数据

1722322549103

在页面上添加服务数据集，服务数据集执行刷新方法 refreshData，就会调用服务，同时将服务返回的数据加载到服务数据集中

1722322842383

运行效果如下图所示

1722322776148

使用服务

添加静态数据集，用于在页面上存储树形数据，提供给树组件使用

1722321635627

静态数据集设置为树形数据

1722321710952

页面上添加服务和静态数据集，在静态数据集的刷新事件中，发送服务请求，将返回的数据加载到数据组件中

1722321848644

静态数据集的刷新事件，代码如下

    onTreeAllDataCustomRefresh = (event) => {
        event.promise = this.comp("serviceRequest0").send().then(({data})=>{
            event.source.loadData(data);
        })
    }

运行效果如下图所示

1722322159240

懒加载

定义一个服务，传入父 ID 参数，父 ID 为空时，返回根数据，否则返回子节点数据

1722323296878

使用服务数据集

目前暂不支持

使用服务

添加静态数据集，用于在页面上存储树形数据，提供给树组件使用

1722321635627

静态数据集设置为树形数据

1722321710952

页面上添加服务和静态数据集，在静态数据集的刷新事件中，发送服务请求，传入展开的父节点 ID，将返回的子节点数据加载到数据组件中

1722323473460

在树组件的展开收起事件中，获取展开的父节点 ID

1722323630030

静态数据集的刷新事件和树组件的展开收起事件，代码如下

    onTreeLevelDataCustomRefresh = (event) => {
        event.promise = this.comp("serviceRequest2").send({
            parentId:this.expandedKey
        }).then(({data})=>{
            event.source.loadData(data,{parentRow:this.expandedKey});
        })
    }

    onTree4Expand = ({expandedKeys,extra}) => {
        if(extra.expanded){
            this.expandedKey = extra.node.fid;
        }
    }

运行效果如下图所示

1722324607899

JSON 嵌套树形数据

数据格式

JSON 嵌套树形数据格式如下图所示，数据中包括子节点 children，本身已形成树形数据

1722305219490

数据加载方式

JSON 树形数据只支持全部加载

全部加载

定义一个服务，返回 JSON 嵌套数据

1722324820330

使用服务数据集

添加服务数据集

1723010750222

虽然 JSON 嵌套数据，不需要父节点列，但是设置为树形数据需要父节点列，因此添加父节点列

1723011230718

设置为树形数据

1723010850049

在页面上添加服务数据集，子节点列选择 children，如下图所示。服务数据集执行刷新方法 refreshData，就会调用服务，同时将服务返回的数据加载到服务数据集中

1723011334804

运行效果如下图所示

1723011029251

使用服务

添加静态数据集，用于在页面上存储树形数据，提供给树组件使用。虽然 JSON 嵌套数据，不需要父节点列，但是设置为树形数据需要父节点列，因此添加父节点列

1722324922911

静态数据集设置为树形数据

1722324966027

页面上添加服务和静态数据集，在静态数据集的刷新事件中，发送服务请求，将返回的数据加载到数据组件中

1722325559294

静态数据集的刷新事件，代码如下

    onJsonDataCustomRefresh = (event) => {
        event.promise = this.comp("serviceRequest1").send().then(({data})=>{
            event.source.loadData(data,{buildTreeData:true});
        })
    }

运行效果如下图所示

1722325795078

results matching ""

    No results matching ""