SAP CAP篇十:理解Fiori UI的Annoation定义

news2024/12/29 11:48:20

本文目录

  • 本系列此前的文章
  • 官方文档和基础概念
  • SAP CAP对Fiori UI的支持
    • package.json的新增内容
    • `Annotation`定义
      • List Page
    • 生成的Edmx文件
  • 对应代码及branch

本系列此前的文章

SAP CAP篇一: 快速创建一个Service,基于Java的实现
SAP CAP篇二:为Service加上数据库支持
SAP CAP篇三:定义Model
SAP CAP篇四:为CAP添加Fiori Elements程序(1)
SAP CAP篇五:为CAP添加Fiori Elements程序(2)
SAP CAP篇六:为CAP添加Fiori Elements程序(3)
SAP CAP篇七:为CAP添加Fiori Launchpad入口 (Sandbox环境)
SAP CAP篇八:为CAP添加App Router并支持Fiori Launchpad (Sandbox环境)
SAP CAP篇九:升级为SAP CDS 7.0, CAP Java 2以及Spring Boot 3

官方文档和基础概念

官方文档中当然包含了Fiori UI的部分,不过要弄懂整个概念,也得先从OData的部分开始看起。

一切从根源说起:

  • 不论是SAP CAP还是SAP RAP,其实都拓展了OData的定义。
  • OData的设计初衷是格式化REST风格的API,通过$metadata, $count, $filter, $select等定义规范了POST/GET等一系列操作;
  • SAP CDS Annotation其实是在OData的metadata中添加了额外的为了UI(其实这里特指Fiori UI)定义的内容,用来规范Fiori UI程序的组成。
  • SAP CDS Annotation的设计理念应该是,最大简化界面层面的开发,甚至可以不写一行界面代码的方式生成标准、统一的前台程序。

SAP CAP对Fiori UI的支持

理解了上述的基础概念,下面就基于前面几篇的项目,研究下SAP CAP对Fiori UI是如何通过Annotation实现的。

package.json的新增内容

在SAP CAP篇四:为CAP添加Fiori Elements程序(1) 为项目添加Fiori Elements程序时,其实Application Generator自动在项目的package.json文件中添加了如下依赖:

  "devDependencies": {
    "@sap/ux-specification": "^1.102.23"
  }

除了添加的依赖之外,还有如下额外的部分:

  "sapux": [
    "app/manage-books",
    "app/browse-books"
  ],

这里每条新增的项目就对应每个新添加的Fiori Elements。

Annotation定义

上述package.json只是让编译器知道在编译时查找Annotation定义,以输出Annotation相关的定义为Metadata。

Annotation定义则是保存在对应的Annotation CDS文件中。具体来说,在本例中,对应的Annotation定义存放在fiori-service.cds中。

本篇没法具体介绍所有的Annotation,仅使用最常用的List Page来进行说明。

List Page

List Page

List Page由上面的Filter Bar加Table构成。

  • 前者由UI.SelectionFields定义。
  • 后者由UI.LineItem来定义。这里定义的LineItem其实是定义Table中的Column。
annotate service.Books with @(
    UI.SelectionFields: [ ID, title, descr ],
    UI.LineItem : [
        {
            $Type : 'UI.DataField',
            Value : title,
        },
        {
            $Type : 'UI.DataField',
            Value : descr,
        },
        {
            $Type : 'UI.DataField',
            Value : stock,
        },
        {
            $Type : 'UI.DataField',
            Value : price,
        },
        {
            $Type : 'UI.DataField',
            Value : currency_code,
        },
        {
            $Type: 'UI.DataField',
            Value: category_ID
        }
    ]
);

生成的Edmx文件

与SAP CAP Node.js版本不同,SAP CAP Java项目只能通过生成的edmx文件来查看上述Annotation。

参见项目 srv\src\main\resources\edmx文件夹,通常其中有很多xml文件,文件命名中指定了相关的语言版本。

      <Annotations Target="AdminService.Books">
        <Annotation Term="UI.SelectionFields">
          <Collection>
            <PropertyPath>ID</PropertyPath>
            <PropertyPath>title</PropertyPath>
            <PropertyPath>descr</PropertyPath>
          </Collection>
        </Annotation>
        <Annotation Term="UI.LineItem">
          <Collection>
            <Record Type="UI.DataField">
              <PropertyValue Property="Value" Path="title"/>
            </Record>
            <Record Type="UI.DataField">
              <PropertyValue Property="Value" Path="descr"/>
            </Record>
            <Record Type="UI.DataField">
              <PropertyValue Property="Value" Path="stock"/>
            </Record>
            <Record Type="UI.DataField">
              <PropertyValue Property="Value" Path="price"/>
            </Record>
            <Record Type="UI.DataField">
              <PropertyValue Property="Value" Path="currency_code"/>
            </Record>
            <Record Type="UI.DataField">
              <PropertyValue Property="Value" Path="category_ID"/>
            </Record>
          </Collection>
        </Annotation>

对应代码及branch

与本文配套的代码参见这里。

本篇对应的branch是6_cds7

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/754338.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

青岛大学_王卓老师【数据结构与算法】Week05_12_队列的类型定义_学习笔记

本文是个人学习笔记&#xff0c;素材来自青岛大学王卓老师的教学视频。 一方面用于学习记录与分享&#xff0c; 另一方面是想让更多的人看到这么好的《数据结构与算法》的学习视频。 如有侵权&#xff0c;请留言作删文处理。 课程视频链接&#xff1a; 数据结构与算法基础…

【学习笔记】[CTSC2017] 网络

我的评价是毒瘤&#x1f605; 首先想到的肯定是原树上的直径。 于是得到第一个结论&#xff1a;这条边的两个端点一定在直径上。 第二个结论&#xff1a;每个点距离最远的那个点是直径的两个端点之一。 发现直径上形成了一个环。显然这个环的长度应该 ≥ L \ge L ≥L&#…

Mysql分区表----分类、优势、特点、优点

范围分区&#xff08;Range Partitioning、哈希分区&#xff08;Hash Partitioning&#xff09;列 表分区&#xff08;List Partitioning&#xff09;、键值分区&#xff08; Key partition &#xff09; 文章目录 mysql分区表概述&#xff1a;MYSQL分区表简单而言就是将一张大…

跨域问题解决

由于同源策略&#xff0c;需要协议&#xff0c;域名&#xff0c;端口三个都相同才能进行访问&#xff0c;是一种浏览器的保护策略 CORS:Cross Origin Resource Sharing SpringBoot 项目中解决跨域 1.在目标方法中加入CrossOrigin注解 2.添加一种过滤器 分别是允许哪些域&#…

分享几种在家就能做的网赚方式,下班暑假都可以做的副业推荐

在当前的互联网时代中&#xff0c;网上赚钱已经成为受到广泛关注的一个话题。越来越多的人渴望通过利用互联网来实现经济上的自由&#xff0c;然而&#xff0c;同时也面临一些风险和挑战。 尽管网上有很多兼职赚钱的机会&#xff0c;但并不是所有方式都可信赖。有些机会可能会…

JVM_00000

JVM 所谓虚拟机&#xff08;Virtual Machine&#xff09;就是一台虚拟的计算机。它是一款软件&#xff0c;用来执行一系列虚拟计算机指令。大体上&#xff0c;虚拟机可以分为系统虚拟机和程序虚拟机。 Visual Box&#xff0c;VMware就属于系统虚拟机&#xff0c;它们完全是对物…

【动手学习深度学习--逐行代码解析合集】18网络中的网络(NiN)

【动手学习深度学习】逐行代码解析合集 18网络中的网络&#xff08;NiN&#xff09; 视频链接&#xff1a;动手学习深度学习–网络中的网络&#xff08;NiN&#xff09; 课程主页&#xff1a;https://courses.d2l.ai/zh-v2/ 教材&#xff1a;https://zh-v2.d2l.ai/ 1、NiN网络…

IDE/VS项目属性中的 <字符集> 配置项,它到底是干什么用的?

文章目录 概述对配置项的基础测试VS默认的字符集配置Unicode字符集和多字节字符集是否影响文本编辑器 使VS像记事本那样显示文件编码VS下编译UTF-8无BOM的代码文件VS可以搞定ANSI和带BOM的源代码文件VS搞不定UTF-8无BOM的源代码文件乱码字符是怎么翻译出来的?猜猜看再起航 使V…

解决windows上端口占用问题

在开发中总会碰到端口占用问题&#xff0c;最后导致我们项目或服务无法正常启动。 解决方案如下&#xff1a; # 1.根据端口号查进程 例如8082端口 netstat -aon | findstr :8082 # 2.根据进程id查应用名 tasklist|findstr "11376" # 3.根据pid删除进程 taskkill …

检测到错误页面web应用服务器版本信息泄露

详细描述 Web服务器未能正确处理异常请求导致Web服务器版本信息泄露&#xff0c;攻击者收集到服务器信息后可进行进一步针对性攻击。 解决办法 临时修复建议如下&#xff1a; 1、关闭web服务器错误提示。 2、关闭运行平台的错误提示。 3、建立错误机制&#xff0c;不要把真实…

python numpy axis=0,1,2, 分清楚

理解维度问题&#xff0c;记忆右边图片坐标的0,1&#xff0c;2&#xff0c; 就记住了计算方向问题&#xff0c;每个矩阵想象一张图片&#xff0c;多个图片叠加&#xff0c; 哪个维度做&#xff0c;哪个维度就被降维度1&#xff0c;默认无 所以 &#xff08;4,3&#xff0c;2&am…

linux系统管理:常用命令和技巧

目录 0 前言 1 sudo and su 1.1 su: 切换用户 1.2 sudo: 切换用户 2 权限设置&#xff1a;chmod, chown 2.1 chmod&#xff1a;访问权限设置 2.2 chown&#xff1a;设置文件或目录的主人 2.3 chgrp&#xff1a;设计文件或者目录属于哪个组 2.4 查询组成员 2.5 查询某…

搭建微服务工程 【详细步骤】

一、准备阶段 &#x1f349; 本篇文章用到的技术栈 mysqlmybatis[mp]springbootspringcloud alibaba 需要用到的数据库 订单数据库: SET NAMES utf8mb4; SET FOREIGN_KEY_CHECKS 0;-- ---------------------------- -- Table structure for shop_order -- --------------…

Nacos服务注册和配置中心(Config,Eureka,Bus)1

SCA(Spring Cloud Alibaba)核心组件 Spring Cloud是若干个框架的集合&#xff0c;包括spring-cloud-config、spring-cloud-bus等近20个子项目&#xff0c;提供了服务治理、服务网关、智能路由、负载均衡、断路器、监控跟踪、分布式消息队列、配置管理等领域的解决方案,Spring C…

Kafka 深度剖析

1、应用场景 1.1 kafka场景 Kafka最初是由LinkedIn公司采用Scala语言开发&#xff0c;基于ZooKeeper&#xff0c;现在已经捐献给了Apache基金会。目前Kafka已经定位为一个分布式流式处理平台&#xff0c;它以 高吞吐、可持久化、可水平扩展、支持流处理等多种特性而被广泛应用…

Docker安装SonarQube

1.查看稳定版本的SonarQube&#xff0c;注意7.9之后的版本不在支持Mysql。使用PostgreSQL Download | SonarQube | Sonar 2.拉取PostgreSQL和SonarQube docker pull postgres docker pull sonarqube:9.9-community community代表社区版 3.在下面的目录下创建docker-compose…

云计算运维工程师简历怎么写?带简历案例

求职岗位&#xff1a;云计算运维工程师 职位要求&#xff1a; 1&#xff09;熟悉Linux操作系统的和管理与维护&#xff0c;有Linux操作系统性能监控和优化工作经验&#xff1b; 2&#xff09;熟悉日常服务器的数据备份、迁移、扩容等技术工作&#xff0c;能够解决相应运维工作…

H3C-Cloud Lab实验-NAT实验

实验拓扑图&#xff1a; IP地址规划&#xff1a; 实验需求&#xff1a; 1. 按照图示配置 IP 地址 2. 私网 A 通过 R1 接入到互联网&#xff0c;私网 B 通过 R3 接入到互联网 3. 私网 A 内部存在 Vlan10 和 Vlan20&#xff0c;通过 R1 上单臂路由访问外部网络 4. 私网 A 通过…

(数学)+(二分)

cf826-C. Place for a Selfie 给n条直线和m条开口向上的抛物线&#xff0c;问对于每条抛物线来说&#xff0c;存不存在和它不相交的直线&#xff0c;存在的话&#xff0c;输出直线的斜率。 直线与抛物线联立&#xff0c;(b-k)^2-4ac<0则不相交&#xff0c;|b-k|越小越好&…

操作系统16:文件共享和文件保护

目录 1、文件共享 &#xff08;1&#xff09;基于有向无循环图实现文件共享 1.1 - 有向无循环图 DAG(Directed Acyclic Graph) 1.2 - 利用索引结点 &#xff08;2&#xff09;利用符号链接实现文件共享 2、文件保护 &#xff08;1&#xff09;保护域(Protection Domain)…