SAP Fiori Elements 学习笔记 - 2021年4月19日
SAP Fiori Elements List Report 里 Smart Table 模板的设计原理: sap.suite.ui.generic.template.fragments.TableColumns 和 sap.suite.ui.generic.template.fragments.TableColumnListItem 分别显示表头和表的行内容。 运行时,这些 fragme
SAP Fiori Elements 在本地测试模式下如何修改 List Report 里字段标签和图标
通过 Jerry 这篇文章 在没有任何前端开发经验的基础上, 创建第一个 SAP Fiori Elements 应用 介绍的步骤,创建一个简单的 SAP Fiori Elements 应用。 在 Visual Studio Code 命令栏里,使用 start-mock,则能够以本地 mock 数据启动这个 Fiori Elements List Report 应用。 在项目工程文件里,找
SAP Fiori Elements 应用里和 Fiori 3 相关的外观设置
SAP Fiori Elements 应用使用了 SAP Fiori 3 的外观。这一点从 Fiori Elements 应用里使用的 css 规则所在的 css 实现文件路径可以发现: http://localhost:8080/resources/sap/m/themes/sap_fiori_3/library.css 修改 css class .sapFAvatarSquare 的 bo
Chrome 浏览器扩展 - Dark Web - Dark Theme for Chrome
Jerry 之前的文章 Chrome 浏览器扩展 - Night Eye ,介绍的 Night Eye 这款 Chrome 浏览器扩展,只有三个月的试用期。因此我又在网上找到了另一款完全免费的 Chrome 浏览器扩展,能够将任何网页的风格设置成暗黑风格。 这个扩展的名称叫做 Dark Web - Dark Theme for Chrome 使用非常方便。安装之后,Chrome 扩展列表里
如何让 Visual Studio Code 里显示 Cypress 的 intelligent code suggestion
如下图所示,把鼠标 hover 在 Visual Studio Code 里打开的 Cypress 代码时: 只会显示 “any”的 popover 对话框出来: 在文件头加上下列这段注释之后: /// <reference types="Cypress" /> 代码自动补全也生效了:
使用 mock 数据在本地运行 SAP Fiori Elements 应用的工作原理
本系列的前两篇文章: 在没有任何前端开发经验的基础上, 创建第一个 SAP Fiori Elements 应用如何使用 mock 数据在本地运行 SAP Fiori Elements 本文研究 Fiori Elements 应用本地运行,而不是连接远程数据库,消费服务器 OData 服务的工作原理。 本地运行 SAP Fiori Elements 应用时,访问的 index.html 为
如何使用 mock 数据在本地运行 SAP Fiori Elements
打开 Jerry 前一篇文章 在没有任何前端开发经验的基础上, 创建第一个 SAP Fiori Elements 应用 创建的 Fiori Elements 应用: 在 localService 文件夹下新建 mockdata 文件夹,这里面存放的就是我们启动 mock server后,在 Fiori Elements 应用里,显示的本地数据。 mockdata 文件夹里的实际内容,请从这
SAP ABAP Platform 1909最新版的 docker 镜像
SAP ABAP Platform, 开发者版本,最新的 1909 Docker 镜像,感兴趣的朋友可以在自己机器上安装试试。安装步骤: https://hub.docker.com/_/sap-abap-trial/plans/ac8a4f9b-ae29-4afa-9b39-25aeea24b821?tab=instructions 该镜像包含的内容见下图,能使用所有ABAP最新特性和编
SAP Fiori 应用里图标(Icon)的渲染原理和使用技巧
这是 Jerry 2021 年的第 27 篇文章,也是汪子熙公众号总共第 298 篇原创文章。 近日,一位 SAP 合作伙伴的开发人员,向我咨询一个关于 SAP Fiori 应用里图标的使用问题。 这位开发人员在 SAP 某标准 Fiori 应用里,发现了一个图标(例如下图红色高亮区域所示的图标), 希望在自己开发的 Fiori 应用里也使用这个图标,但是不知道其对应的 sap-icon://
SAP Fiori Elements 概述
SAP Fiori elements provide designs for UI patterns and predefined templates for common application use cases. SAP Fiori Elements 提供了预定义的模板和 UI 样式,适用于 SAP 应用的通用应用场合。 App developers can use SAP
SAP Cloud Application Programming CatalogService 默认的路径
我的 Service 定义,没有显式声明 service url: 最后 cds watch 的结果:该 Service 的名称:AdminService,去掉了后缀 Service,再把前面的 Admin 转成 lowercase 的结果:admin 同理: 我的 service:
什么是 SAP Fiori Tools
SAP Fiori tools is an extension pack available for Visual Studio Code and SAP Business Application Studio that is designed to increase the efficiency of SAP Fiori elements app development. SAP F
可以公开访问的 SAP gateway demo system ES5/002
SAP gateway demo system,给 SAP 开发人员提供了可以 free 使用的 OData 服务,用来学习 SAP Fiori 和 SAP Fiori Elements 相关的开发。 首先在这个链接里注册一个帐号: https://register.sapdevcenter.com/SUPSignForms/ 之后通过这个链接登陆 ES5/002 系统: https:
SAP OData 服务在 gateway 层出错,应该如何处理?通过一个错误消息来举例说明
在浏览器里访问如下url遇到错误:https://jerry.sap.corp:44300/sap/opu/odata/sap/C_SALESCONTRACTITMFLFMTQ_CDS/$metadata 如何debug这个错误,找到哪一行ABAP code抛出的exception?tcode /IWFND/ERROR_LOG, 选择对应的entry,点Active Source: 在
在没有任何前端开发经验的基础上, 创建第一个 SAP Fiori Elements 应用
这是 Jerry 2021 年的第 26 篇文章,也是汪子熙公众号总共第 297 篇原创文章。 本文绝非标题党。 Jerry 前一篇文章 SAP Cloud Application Programming 介绍 - 2021 更新版,介绍了如何使用 SAP Cloud Application Programming,在本地创建一个 OData 服务,并且利用 SAP CAP SDK,在一个自动
SAP Spartacus 如何借助env-cmd 实现 B2B 和 B2C 功能启动的无缝切换
在之前的 SAP Spartacus 标准开发中,每次我从 Github 上 clone 了最新的代码后,必须手动修改 environment.ts 里的配置值,将 CX_BASE_URL 和 b2b 修改成实际值: 后来我研究了一下 package.json 里定义的脚本:发现使用了 env-cmd 这个工具: env-cmd —no-override -e dev,b2c,
SAP Spartacus unit detail 页面显示后自动 focus 设置的原理
这个自动 focus 设置的效果是:我们从 Spartacus Unit list 页面,随便选择一行,进入明细页面之后: 键盘 focus 会自动停留在 detail 页面(下图右边红色矩形框内)第一个 focusable 的元素上: 敲回车试试: 发现 (i) icon 是 unit 明细页面第一个 focusable 的元素。 这个功能的实现原理:在 unit 明细页面,
JavaScript 里 window, document, screen, body 这几个名词的区别
在下面这个 StackOverflow 的线索里进行了讨论: https://stackoverflow.com/questions/9895202/what-is-the-difference-between-window-screen-and-document-in-javascript window Window is the main JavaScript object root
SAP 基于 ABAP 实现的 gateway 框架里,为什么默认返回100条数据?
Created by Wang, Jerry, last modified on Jan 16, 2015$skip=0&$top=100ODataListBinding.js里,this.loadData的输入参数为100:this.oModel.iSizeLimit 为100:在 sap-ui-core-dbg.js里,同样能看到下面高亮出来的硬编码代码: this.iSizeLim
SQLITE_ERROR - table sap_capire_bookshop_books has no column named currency
在做 SAP Cloud Application Programming 练习时,遇到如下的错误消息:SQLITE_ERROR: table sap_capire_bookshop_books has no column named currency 在我的 schema 定义里,Books entity 里确实存在一个叫做 currency 的字段,但其数据类型为 Currency,来自 @s