SAP FIORI专题之三：使用fiori element构建list

1 关于fiori element以及CDS VIEW由来

坦白来讲，fiori现在推广应用情况并不太妙，尤其在国内，招聘者寥寥无几，纠其主要原因我理解有以下几点：

1.环境难寻，想找一个能在互联网上发布的环境，而且配置好的环境，真的太难了。还是感谢提供账号练习的。

2.前端工程师本来就挺稀缺的，哪有前端工程师去学UI5，有3大框架够学个五年了。学SAP UI5只为了调用SAP后端服务，在spring cloud大行其道的情况下，连阿里的框架都没人用了，SAP想从中分一部分力量出来吸引客户，难啊。

3.所以，我认为SAP的策略，就应该化繁为简，其吸引的开发群体，是原先搞ABAP的那部分人，构建前端工程就像调用alv类似的，只需要调整一些参数就够了。所以fiori element应用而生（虽然在国内没大力推广出来）

废话不多说，还是直接上代码，只有让我等小白快速构建个应用，跑起来，才能有学下去的信心，才有可能“兼顾”搞个fiori。就像SAP云端的最新studio，就不能让我一键发布啊，还配置来配置去的，连webide资料都少的可怜，更何况你新框架，那个操作手册就不能图文并茂，真正傻瓜式的指导做下去吗？

吐槽下。。。。sap进入门槛确实比较高，比较难，所以也造就了顾问工资相对较高，有利有弊，咱不应该享受红利却大加埋怨。。

2 构建list

2.1 构建CDS VIEW

可以简单理解为SQL+注解，可以将部分运算功能下沉到数据库。

2.1.1.切换到abap控制台

2.1.2.创建一个abap项目

2.1.3 建CDS核心业务对象

@AbapCatalog.sqlViewName: 'ZLGZ_SALEORDER'
@AbapCatalog.compiler.compareFilter: true
@AccessControl.authorizationCheck: #CHECK
@EndUserText.label: '李钢柱核心业务对象'
define view ZLGZSALEORDER as select from vbak  {
     key vbeln as Vbeln,
    erdat as Erdat,
    erzet as Erzet,
    ernam as Ernam,
    vbtyp as Vbtyp,
    trvog as Trvog,
    auart as Auart,
    augru as Augru,
    netwr as Netwr,
    waerk as Waerk,
    vkorg as Vkorg,
    vtweg as Vtweg,
    spart as Spart,
    vkgrp as Vkgrp
    
}

激活，右键预览数据，open with datapriev

2.2 后端发布

CDS VIEW构建完后，可以直接注解发布，也可以后端发布

2.2.1 SEGW新建

2.2.2 建ET集

选择与前端CDS VIEW一样的字段

设置主键

2.2.3 生成接口

2.2.4 将数据集映射到CDS VIEW

1.右键数据集，映射到CDS

2.选择映射

3.关联字段

2.2.5 勾选一些特性

1.字段是否可以创建、可更新、可排序、空、过滤等

2.整条记录是否可删除、更新、分页等

2.2.6 发布服务

2.3 前端

2.3.1 从list模板创建

暂时不添加注解文件

绑定数据集

2.3.2 运行

2.4 添加条目汇总

1.新建annotations文件夹以及annotation0.xml文件

2.在本地annotation下添加：

选择头信息

输入描述，以及值取值来源

2.5 添加默认显示字段

3.在本地annotation下添加，lineitem，用来显示默认展示的字段

在行里面再添加datafield

最终展示如下：

这样默认运行就展示这些字段了，也有汇总了

2.6 添加允许多选

2.7 搜索帮助

1.查看vbak有的搜索帮助，发现VBELN有搜索帮助，具体怎么建心的搜索帮助参考历史贴

2.在SEGW导入搜索帮助

3.前端代码调整

2.8 下拉列表形式的搜索帮助，创建日期只显示日期

1.MPC类，将define方法重定义

2.9 如果想删除，也可以调用bapi

2.10 下拉列表搜索帮助进一步过滤

1. 在Manifest找到sap.ui5下面的extends, 添加如下代码,其中zlgz_cds_saleszlgz_cds_sales代表工程的ID

	"extends": {
			"extensions": {
				"sap.ui.controllerExtensions": {
					"sap.suite.ui.generic.template.ListReport.view.ListReport": {
						"controllerName": "zlgz_cds_saleszlgz_cds_sales.ext.controller.Message",
						"sap.ui.generic.app": {
							"SalesOrderSet": {
								"EntitySet": "CdsSalesSet",
								"Actions": {
									"onMessage": {
										"id": "messageID",
										"text": "Message",
										"press": "onMessage",
										"requiresSelection": false
									}
								}
							}
						}
					}
				}
			}
		},

2. 在工程目录中添加如下文件

3. 在Message.controller.js中添加如下代码

sap.ui.controller("zlgz_cds_saleszlgz_cds_sales.ext.controller.Message", {
	onInit: function() {},
	onExit: function() {},
	onBeforeRendering: function() {},
	onAfterRendering: function() {},
	onMessage: function(oEvent){
		sap.m.MessageToast.show("OK!");
	}
});

4. 在Component.js中添加如下红框内的代码：

5.测试结果

2.11 启用webide的UI Adaptation Editor，设置excel导出

2.12 设置选择条件为单选

2.13 利用对象object page进行单行详细页面设计

可以链接到详细页面，后面再继续深化吧