2

Fiori 应用通过 Adaptation Project 的增强方式分享

 1 year ago
source link: https://blog.51cto.com/jerrywangsap/5433548
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

Fiori 应用通过 Adaptation Project 的增强方式分享

推荐 原创

笔者曾经在 SAP 成都研究院 CRM Fiori开发团队工作时,担任了德国一个著名的灯具制造商客户的CRM Fiori项目的dev angel. 当时客户提出了若干对 CRM Fiori标准应用的增强需求,总的来说分为前台Fiori UI界面的增强(比如增添新的自定义字段)以及后台逻辑的增强。

当时还处于Fiori 1.0时代,还没有直接在浏览器上使用S/4HANA的Key User tool进行新建字段的办法,因此对于前台界面的增强,我给客户的解决方案是使用UI5 XML视图中预留的Extension point,而后台逻辑的增强,则通过UI5 JavaScript controller中的extension hook以及ABAP后台的BAdI实现。

Fiori 应用通过 Adaptation Project 的增强方式分享_前端开发

我和客户四个月的合作非常愉快,最后项目顺利上线,我也收到了德国客户通过邮件发送的感谢信,客户还把这个项目他们做的所有增强代码打成压缩包发送给我,希望SAP能好好分析这些逻辑,评估某些需求是否具有普遍性,将来能否做到SAP标准Fiori应用里,以便更多的客户能受益。这个德国客户在项目实施中的专业程度和一丝不苟的态度,给我留下了深刻的印象。

当时客户的一个实际需求是,创建一个新的自定义字段,并能够让该字段在端到端的业务流程中启用(支持增删改查). 虽然这个需求现在看起来比较常见,但在五年前的Fiori 1.0时代,实现起来还颇费一番功夫,因为前后台都得做一些增强。

Fiori 应用通过 Adaptation Project 的增强方式分享_前端开发_02
Fiori 应用通过 Adaptation Project 的增强方式分享_SAP UI5_03

我当时把完整的增强实现步骤写成博客发在了SAP 社区上,因为步骤较多,总共写了四篇文章才介绍清楚。

最近 Jerry 在 SAP WebIDE 里偶然看到新建菜单里有个名叫Adaptation Project的菜单项,提供了另一种不通过编程即可增强Fiori应用某些行为的方式。

Fiori 应用通过 Adaptation Project 的增强方式分享_前端开发_04

这种新的增强方式是通过Fiori Adaptation Project完成的,通过一个实际的需求来介绍。

我们说SAP应用,最典型的使用方式就是以搜索界面作用入口,在搜索结果的表格控件里点击某条记录进入明细页面开始操作。

由于种种原因,并不是所以的表格控件都提供将数据导出成excel格式的功能。

Fiori 应用通过 Adaptation Project 的增强方式分享_SAP UI5_05

如果搜索结果的表格是通过SAP Fiori Elements技术绘制而成,可以在WebIDE里使用Fiori Adaption Project将excel导出功能启用。

在WebIDE里新建一个Fiori Adaptation Project:

Fiori 应用通过 Adaptation Project 的增强方式分享_JavaScript_06

当我们创建适配项目时,实际是在创建现有应用程序的新变体(variant).

应用程序变体指的是原始应用程序,但包含在适配项目中创建的独立更改集。此外,还为该变体定义了一个应用程序ID,需要在Fiori Launchpad中单独注册。

使用 SAP UI5 Visual Editor 创建 variant.

Adaptation Project 支持的功能有:

  • 可以对应用程序进行语义更改(例如,根据特定条件隐藏字段)

  • 控件属性和绑定可以更改(例如启用或禁用Excel导出智能表)

  • 可以添加自定义XML片段来扩展视图(例如,单击按钮打开自定义对话框)

  • 可以添加自定义业务逻辑(JavaScript)(例如,单击按钮调用odata服务)

  • 扩展I18n文本(例如翻译自定义按钮的标签)

  • 移动控件/部分(例如,在对象页面的两个标准字段之间放置一个自定义字段)

Adaptation Project 同 Fiori Breakout 的区别:

  • 在Fiori Elements应用程序中,创建了用于向智能模板添加自定义UI (XML)和业务逻辑(JavaScript)的 breakout.

  • Breakout 是实际应用程序的一部分。因此,如果应用程序开发团队创建了一个Fiori Element 应用程序,而客户希望通过 breakout 添加自定义逻辑,那么这将是一种修改。

  • Breakout是对智能模板的扩展,是原始应用的一部分,而适应项目是应用的扩展。

下一步需要选择增强哪一个SAP系统的哪一个Fiori应用。如果待增强的Fiori应用位于On-Premises系统,需要预先配置SAP Cloud Connector和SAP云平台上的Destination,否则到了这一步,在SAP UI5 ABAP Repository的下拉列表里将无法看到该系统。

Fiori 应用通过 Adaptation Project 的增强方式分享_应用程序_07

On-Premises系统确定之后,在该系统找到要增强的Fiori应用,通过输入该应用的技术ID来定位。点击Next完成Fiori Adaptation Project的创建向导,这里我们给该project取名s4demo.

Fiori 应用通过 Adaptation Project 的增强方式分享_SAP UI5_08

在WebIDE里邮件该project,选择SAPUI5 Visual Editor,打开这个所见即所得的视图编辑器,

Fiori 应用通过 Adaptation Project 的增强方式分享_JavaScript_09

默认是以Preview模式打开的,点击右上角的Edit按钮进入编辑模式:

Fiori 应用通过 Adaptation Project 的增强方式分享_Fiori_10

在编辑模式里,选中视图上的表格控件,准备开始做属性的修改。
我们注意到这个安全模式的提示,引入这种模式的用意和Android系统以及Windows操作系统的安全模式类似。SAP UI5 Visual Editor的安全模式下,开发者只能针对控件进行受限制的属性修改。

Fiori 应用通过 Adaptation Project 的增强方式分享_Fiori_11

有付出就有回报,虽然修改受到限制,但在安全模式下进行的修改是升级安全的,即将来S/4HANA系统升级后,这些修改仍然得以保留。

Fiori 应用通过 Adaptation Project 的增强方式分享_应用程序_12

为了启用表格的excel导出功能,我们得关掉安全模式:

Fiori 应用通过 Adaptation Project 的增强方式分享_前端开发_13

然后把Use Export to Excel的标志位从默认的false设置成true:

Fiori 应用通过 Adaptation Project 的增强方式分享_SAP UI5_14
Fiori 应用通过 Adaptation Project 的增强方式分享_JavaScript_15

保存修改,在项目文件夹下生成一个名为changes的文件夹,里面记录了这次属性修改的明细。这种将属性修改通过单独的文件保存下来的思路,和SAP C4C里通过Key User Tool或者Cloud Application Studio修改UI视图后生成Change Transaction用来记录修改明细是一致的。

Fiori 应用通过 Adaptation Project 的增强方式分享_Fiori_16

修改完保存之后,再次打开应用,就可以测试这个excel导出功能了。

Fiori 应用通过 Adaptation Project 的增强方式分享_Fiori_17
Fiori 应用通过 Adaptation Project 的增强方式分享_应用程序_18

本地测试通过后,采用和部署SAP标准Fiori应用同样的办法,将这个Adaptation Project部署到对应的S/4HANA系统上。

Fiori 应用通过 Adaptation Project 的增强方式分享_Fiori_19
Fiori 应用通过 Adaptation Project 的增强方式分享_应用程序_20

点击Show Details能得知到底有哪些资源被成功部署了。

Fiori 应用通过 Adaptation Project 的增强方式分享_Fiori_21

成功部署的提示信息:Folder XXXX ( CUSTOMER_BASE) created in LRep.

Fiori 应用通过 Adaptation Project 的增强方式分享_Fiori_22

这个LRep即Layed Repository,S/4HANA里一个分层的存储系统。所谓Layed,体现在这个存储系统引入的分层概念,即Customer Layer,Partner Layer,SAP Layer等。不同的操作者——客户,Partner和SAP标准开发人员,对这些分层存储的资源具有不同的读写权限。

Fiori 应用通过 Adaptation Project 的增强方式分享_SAP UI5_23

在S/4HANA系统里,执行报表/UIF/GET_FILES_4_NS,可以查看到从WebIDE部署到S/4HANA LRep的这些资源:

Fiori 应用通过 Adaptation Project 的增强方式分享_Fiori_24

在第一次运行使用Fiori Adaptation Project增强后的Fiori应用时,存储在LRep Customer Layer的Fiori Adaptation Project里描述的UI5应用修改信息,会和Fiori标准应用的资源做一个合并,产生最后客户在浏览器里看到的,具有Export to Excel按钮的Fiori应用。

Fiori 应用通过 Adaptation Project 的增强方式分享_Fiori_25
Fiori 应用通过 Adaptation Project 的增强方式分享_SAP UI5_26

希望本文能够帮助大家对Fiori应用的又一种增强方式有一个最基础的了解,感谢阅读。

  • 打赏
  • 收藏
  • 评论
  • 分享
  • 举报

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK