数据中心-数据视图开发-数据视图与统计-O2OA企业应用开发平台-人人都是协同系统开发专家

O2OA(翱途)开发平台提供的数据管理中心，可以让用户通过配置的形式完成对数据的汇总，统计和数据分组展现，查询和搜索数据形成列表数据展现。视图可以用于展现，用于选择以及用于统计。本文主要介绍如何在O2OA中开发和配置数据视图用于展现。

一、先决条件

1、O2Server服务器正常运行，系统安装部署请参考文档《如何在服务器上安装部署O2OA》。

2、以拥有管理员权限或拥有数据中心管理员（QueryManager角色）的用户账号登录O2OA(翱途)开发平台，如：xadmin

二、视图简介

在O2OA中，视图是展现、查询流程和内容管理数据的重要途径，也是各应用进行数据关联的工具。

三、应用入口

点系统的左上角系统图标->应用->数据中心管理->具体应用->视图打开，如下图所示：

三、创建视图

在视图上有三栏，左边是本应用的所有视图列表；中间是编辑区，用来展现视图列，和预览数据；右边是属性区域，可以显示视图属性和列属性。

四、视图属性

U_SF1B$O@$FN@N3L6S$DTEH.png

1、基本

属性名	说明
标识	视图ID
名称	视图名称
别名	视图别名
隐藏视图	隐藏后不会在数据中心的应用中显示
排序号	在数据中心应用中的排序号
视图样式	可以选择视图的显示风格
展开分类	视图默认显示时是否展开分类
显示序号	第一列是否显示条目的序号
最大行数	视图展现的时候返回数据的最多数目
每页行数	视图展现的时候每页的数据数目
隐藏操作条	是否在视图上方显示操作条
选择	是否用户选择视图中的条目
无分类和选择隐藏首列	视图没有分类且不允许选择的时候是否隐藏第一列
无数据显示	视图中的数据条目为0的时候，显示的文本
启用缓存	启用缓存可以加快查询的展现，但是权限会失效
可执行人	允许执行视图的人。和可执行组织同时为空的时候，所有人可执行
可执行组织	允许执行视图的组织
默认选中行脚本	返回true表示打开视图的时候选中。可以通过this.target获取行内容，如下： { "data": { //当前行数据 "bundle": "0d2eda78-6f2b-4972-b659-3277e90b258a", //当前文档id "data": { //列数据 "app": "会议管理", "app1": "会议管理安卓", "number": 0, "processingPerson": "", "status": "FIXED", "subject": "4343", "type": "安卓" } }, node: tr, //行DOM对象 row: {}, //视图中的行对象 view: {} //视图对象 } 样例： if( this.target.data.data.status === "FIXED" ){ return true; }
允许选择行脚本	返回true表示当前行可以被选择。可以通过this.target获取行内容，如下： { "data": { //当前行数据 "bundle": "0d2eda78-6f2b-4972-b659-3277e90b258a", //当前文档id "data": { //列数据 "app": "会议管理", "app1": "会议管理安卓", "number": 0, "processingPerson": "", "status": "FIXED", "subject": "4343", "type": "安卓" } }, view: {} //视图对象 } 样例： if( this.target.data.data.app === "会议管理" ){ return true; }

2、范围

$9DHHANIW_VBVN[7E{90O9KF.png$

参数说明：

属性名	说明
	可以选择流程平台数据或者是内容管理平台的数据
权限	带权限：当前人员只能看到流转过的工作忽略：当前人员可以看到符合过滤条件所有工作，但是没有流转过的不能打开
流转状态	只有选择流程平台数据的时候起作用
选择应用	只对应流程平台应用的数据
选择流程	只对应流程的数据，如果应用和流程同时选择的情，取并集
数据类型	信息类：只显示内容管理栏目或分类里文档类型设置为“信息”的数据数据类：只显示内容管理栏目或分类里文档类型设置为“数据”的数据全部：对文档类型无限制
选择栏目	只显示对应内容管理栏目的数据
选择分类	只显示对应内容管理分类的数据，如果栏目和分类同时选择
拟稿组织	只显示选择的拟稿组织的数据
拟稿人员	只显示选择的拟稿人员的数据
拟稿身份	只显示选择的拟稿身份的数据
时段	只显示符合时段内的数据，允许有偏移量

3、过滤

通过配置视图的过滤来进行过滤和搜索的配置：

当选择“作为默认过滤条件”时，视图在执行的时候既根据该过滤条件进行过滤。

1636299435(1).png

当选择“作为自定义过滤数据”时，用户可以根据配置自定义进行搜索，如下图：

image (1).png

效果如下：

1636299435(1).png

路径：请查看本文的数据路径介绍章节

五、创建视图列

点击添加按钮可以创建视图列：

六、列属性

添加视图列以后，需要对视图进行配置。

LHQJHBHD_@Z_44)0P_3UI%K.png

参数说明：

属性	说明
列标题	表格的标题
列名	列名，当需要操作数据的时候要用到（比如嵌入到表单中选择数据的时候）
默认值	列值为空时的默认值
打开文档	点击该列的时候，是否打开文档
数据路径	请查看本文的数据路径介绍章节
排序	该列是否排序，只有第一个排序列有效
分类	该列是否分类，只能有一个分类列
隐藏	显示的时候，该列是否隐藏
组织对象	如果选是，那么只显示数组第一个值的 name 属性
HTML值	如果选择是，则作为单元格的innerHTML显示
显示脚本	可以通过脚本对列值进行计算。 this.value：为列原来的值 this.entry.data: 该行所有列的值显示脚本最终需要 return 返回值

例如，我们要展现如下表单的数据

我们要创建的列和填写的列属性有：

标题

创建时间

拟稿人

项目名称

报销类型

报销金额

列标题：标题

列名：subject

数据路径：subject

打开文档：是

列标题：拟稿时间

列名：startTime

数据路径：

选择“创建时间”($work.startTime)

排序：降序

列标题：拟稿人

列名：creatorPerson

数据路径：

选择“拟稿人”($work.creatorPerson)

组织对象：是

列标题：项目名称

列名：projectName

数据路径：

projectName

列标题：报销类型

列名：type

数据路径：

type

列标题：报销金额

列名： amount

数据路径：

datatable.total. amount

打开文档选是，则在该列上产生工作链接

可以选择系统自带字段

排序列可以对视图进行排序

组织对象选“是”，则会把全称显示为中文名称

数据路径对应流程数据中的字段

数据路径如果是多层次的，可以用点号(.)隔开。

七、预览视图

创建完视图以后，我们就可以预览效果了，点击预览按钮：

也可以从导航菜单->数据->报销业务打开：

效果如下：

image (3).png

1、点击标题可以打开工作

2、点击“导出Excel”可以导出视图内容

八、数据路径介绍

数据路径是前台和后台进行数据对应的途径。

数据路径是对数据的字段名和层次的描述。

1、数据和数据路径的关系

在视图中我们可能配置流程应用或内容管理应用的数据。

流程实例可能的格式如下：

{
    "$work" : {  //每个流程实例都包含$work标签，这是流程发起的时候系统就会生成的。
        "title" : "" , //标题
        "startTime" : "", //创建时间
        "startTimeMonth": "", //创建月份
        "completedTime": "", //完成时间
        "completedTimeMonth": "", //完成月份
        "creatorPerson": "", //拟稿人
        "creatorIdentity": "", //拟稿人身份
        "creatorUnit": "", //拟稿组织
        "creatorUnitLevelName": "", //拟稿组织层级
        "application": "", //应用ID
        "applicationName": "", //应用名称
        "applicationAlias": "", //应用别名
        "process": "", //流程ID
        "processName": "", //流程名称
        "processAlias": "", //流程别名
        "serial": "", //编号
        "activityType": "", //活动类型
        "activityName": "", //活动名称
        "activityArrivedTime": "", //活动到达时间
        "workId": "", //工作ID
        "workCompletedId": "", //已完成工作ID
        "job": "", //JOB的ID(job)
        "completed": "", //是否已完成(completed)
    },
    //以下为业务数据
    "subject" : "", //标题
    "identity1" : [{ //身份/人员/组织/职务/群组 的存储形式
        {
            "name": "李四",  //身份名称，不唯一
            "unique": "23dd1b53-feed-485d-8c9c-1a4e64ff58a2", //身份唯一标识
            "description": "", //身份描述
            "distinguishedName": "李四@23dd1b53-feed-485d-8c9c-1a4e64ff58a2@I", //身份全称
            "person": "李四@lisi@P", //人员
            "unit": "开发部@kfb@U",  //组织
            "unitName": "开发部",   //组织名称, 不唯一
            "unitLevel": 2,         //组织层级
            "unitLevelName": "浙江兰德纵横/开发部", //组织层级名
            "orderNumber": 24920439 //排序号
        }
        ...
    }] 
    ...
}

对于以上的样例我们可以获取如下数据路径：

含义	数据路径	说明
流程ID	$work.workId	默认数据，包含在$work对象下。
标题	subject	业务数据，文本、布尔值、数字直接填标签。
身份的第一个dn	identity1.0.distinguishedName	业务数据，如果是数组用下标“.0” 来表示第几个数组。
所有身份dn	identity1.*.distinguishedName	业务数据，用*匹配对象数组的所有distinguishedName（平台6.0版本后支持）

内容管理文档可能的格式：

{
    "$document" : { //每个内容管理文档都包含$document标签，这是文档发起的时候系统就会生成的。
        "title" : "", //标题
        "publishTime" : "", //发布时间
        "creatorPerson" : "", //拟稿人
        "creatorIdentity" : "", //拟稿人身份
        "creatorUnitName" : "", //拟稿组织
        "creatorTopUnitName" : "", //拟稿顶级组织
        "appId" : "", //栏目ID
        "appName" : "", //栏目名称
        "categoryId" : "", //分类ID
        "categoryName" : "", //分类名称
        "categoryAlias" : "", //分类别名
        "docid" : "", //文档ID
    },
  //以下为业务数据
    "subject" : "", //标题
    "identity1" : [{ //身份/人员/组织/职务/群组 的存储形式
        {
            "name": "李四",  //身份名称，不唯一
            "unique": "23dd1b53-feed-485d-8c9c-1a4e64ff58a2", //身份唯一标识
            "description": "", //身份描述
            "distinguishedName": "李四@23dd1b53-feed-485d-8c9c-1a4e64ff58a2@I", //身份全称
            "person": "李四@lisi@P", //人员
            "unit": "开发部@kfb@U",  //组织
            "unitName": "开发部",   //组织名称, 不唯一
            "unitLevel": 2,         //组织层级
            "unitLevelName": "浙江兰德纵横/开发部", //组织层级名
            "orderNumber": 24920439 //排序号
        }
        ...
    }] 
    ...
}

对于以上的样例我们可以获取如下数据路径：

含义	数据路径	说明
文档ID	$document.docid	默认数据，包含在$document对象下。
标题	subject	业务数据，文本、布尔值、数字直接填标签。
身份的第一个dn	identity1.0.distinguishedName	业务数据，如果是数组用下标“.0” 来表示第几个数组。
所有身份dn	identity1.*.distinguishedName	业务数据，用*匹配对象数组的所有distinguishedName（平台6.0版本后支持）

2、从表单获取业务数据路径

业务数据通常是在表单设计的时候进行定义的。

在我们创建组件的时候，该组件的标识就是存储数据的标签。

如以下表单：

2021-10-28_16-12-25 (1).png

产生的业务数据可能如下：

{
  //此处省略$work或$document
  "subject": "李四的出差报销申请",
  "creatorPerson": [{
  		"name": "李四",  //身份名称，不唯一
      "unique": "23dd1b53-feed-485d-8c9c-1a4e64ff58a2", //身份唯一标识
      "description": "", //身份描述
      "distinguishedName": "李四@23dd1b53-feed-485d-8c9c-1a4e64ff58a2@I", //身份全称
      "person": "李四@lisi@P", //人员
      "unit": "开发部@kfb@U",  //组织
      "unitName": "开发部",   //组织名称, 不唯一
      "unitLevel": 2,         //组织层级
      "unitLevelName": "浙江兰德纵横/开发部", //组织层级名
      "orderNumber": 24920439 //排序号
	}],
  "creatorUnit": [{
    "id":"1a0c1ad5-4c19-493d-9d32-731d3895a500",
    "name":"开发部",
    "distinguishedName":"开发部@kfb@U",
    "levelName":"浙江兰德纵横/开发部"
  }],
  "place": "上海",
  "projectName": "xx项目",
  "type": "差旅报销",
  "number": 2,
  "account": "李四",
  "receivingAccount": "1234567890123",
  "bankAccount": "某某银行",
  "description": "出差到上海",
  "datatable": { //数据表格标识
    "data":[{
      "subjectName": "动车票",
      "startData": "2022-10-11 12:00:00",
      "endData": "2022-10-11 13:30:00",
      "costDescription": "杭州到上海",
      "amount": 200
    }],
    "total":{
      "amount": 200
    }
  }
}

对于上述业务数据，我们可以获取到的数据路径如下：

含义	数据路径	说明
标题	subject	文本直接填字段标识
创建人名称	creatorPerson.0.name	如果是数组用下标“.0” 来表示第几个数组。
单据张数	number	数字直接填字段标识
报销明细的第一个单据金额	datatable.data.0.amount	数组用下标“.0” 来表示第几个值
报销明细的所有报销金额	datatable.data.*.amount	用*匹配对象数组的所有值（平台6.0版本后支持）
报销总计	datatable.total.amount	数据表格的总计放在total标签中

3、数组格式数据路径

当业务数据中存在数组，如复选框、人员选择框、数据网格时；平台6.0版本后支持使用“*”匹配数组的所有对象。查询出的数据多值默认以逗号隔开。如果只想显示某一个数据，可以用具体下标来代替“*”（例：checkbox.0）。

1、复选框

checkbox.* （复选框标识+“.”+“*”）。

image (4).png

2、人员选择框

org.*.name （人员选择框标识+“.”+“*”+“.”+要显示的属性）。
image (5).png

3、数据表格

datatable.data.*.textfield（数据表格标识+“.data.”+“*”+“.”+对应的字段标识）。

image (6).png

4、脚本中的写法

path与普通字段写法区别

this.view.lookup({
  "view": "cyh_test",
  "application": "测试",
  "filter": [
      //复选框条件写法："path":"checkbox.*"
      {
          "logic":"and",
          "path":"checkbox.*",
          "comparison":"like",
          "value":"111",
          "formatType":"textValue"
      },
      //人员选择框条件写法："path":"projectMenager.*.name"
      {
          "logic":"and",
          "path":"projectMenager.*.name",
          "comparison":"like",
          "value":"袁绪姣",
          "formatType":"textValue"
      },
      //数据表格条件写法："path":"datatable.data.*.textfield"
      {
          "logic":"and",
          "path":"datatable.data.*.textfield",
          "comparison":"like",
          "value":"铅笔3",
          "formatType":"textValue"
      }
  ]
}, function(data){
  var result = data.grid; //得到过滤后的数据
});

七、视图的使用

1、在表单、页面中嵌入视图

可以在表单中使用“嵌入视图”组件

2、选择视图的数据到表单

在表单中使用“选择视图”组件，可以进行流程、内容管理分类直接的数据关联。

image (7).png

当选择结果处理选择 “赋值”的时候：

上图中的 field_1 为本表单的组件标识，column_1 为视图的列名。

当用户选择视图后，会将选中行 column_1 列的值赋值给 field_1 。

当选择结果处理选择 “脚本”的时候，可以通过 this.target.selectedData 来获取用户选择行的数据。数据格式如下：

{[
  bundle : "xxxx", //CMS文档Id/流程jobId
  data : {  //列数据
    column1Name : column1Value, //第一列的列名，第一列的列值
    column2Name : column2Value, //第二列的列名，第二列的列值
    ...
  },
  ...
]}