User story
In CRM WebUI, the sales area of a given opportunity consists of the following fields in assignment block “Organizational Data”. Note the “Sales Office” and “Sales Group” marked with red:
However in Fiori these two fields are not available.
The series of this blog will introduce how to bring these two standard fields into Fiori and provide CRUD operations on them.
As the first step, we need to expose the read operation of these two fields via odata service, which means when we test the odata service read operation, we expect to see both in response stream. Below is the screenshot of response before extension – both fields are missing there.
(1) When the data for Sales area tab in Fiori is read from backend, we make investigation and find out the data for both fields are already returned by one order API and available in the context of standard odata service implementation.
Since there is a MOVE-CORRESPONDING fields to move the opportunity data from one order API result to result structure of odata service, for the read operation, we just need to create two new fields in the structure of ls_entityset with exactly the same name, SALES_OFFICE and SALES_GROUP, then the MOVE-CORRESPONDING will take effect.
(2) The DDIC structure of Opportunity header is enhanced as below:
Add these two fields in service builder as well, re-generate runtime objects and clear model cache in both gateway and backend system to ensure the new fields could be visible in the runtime.
(3) retest the odata service read operation, the sales office and sales group are now available in the read response.
第二部分
In previous blog, the two fields Sales Office and Sales Group have already been exposed via OData service read operation. In this part I will make the two fields visible in Fiori UI. The final UI would look like below:
Step1: find the available extension point in UI to hold the two fields
There is existing extension point in opportunity detail view:
As the first step, our aim is just to display the two fields in Fiori UI without considering format requirement. So we just directly bind the two fields to SalesOfficeCode and SalesGroupCode exposed by blog part1.
This step is quite easy to do. The UI after this step looks like below. We can notice that for the other three standard fields, always the format + ( + + ) is displayed in UI.
The format is defined in xml view as below:
<Text id="salesorganization_Text"
text="{parts: [{path :'json>/SalesOrganizationDescription'},{path : 'json>/SalesOrganization'}],
formatter : 'cus.crm.opportunity.util.Formatter.formatSalesOrganization'}"></Text>
and the simple format function:
formatSalesOrganization : function(SalesOrganizationDescription, SalesOrganizationId){
var SalesOrganization = "";
if(SalesOrganizationId != undefined && SalesOrganizationId != "")
{
SalesOrganization = SalesOrganizationDescription + " (" + SalesOrganizationId + ")";
}
return SalesOrganization;
},
In next step, we will enable the same format function for the two new fields.
Step2: create another two new fields SalesGroupText and SalesOfficeText to hold the description
The steps are also exactly the same as how we create the two fields SalesGroupCode and SalesOfficeCode in blog1: add the fields in DDIC structure and related Odata Model node:
After we have these two fields to store description, we can write the logic to get description by code. All READ-related methods need to be enhanced with this logic. a. redefine method OPPORTUNITIES_GET_ENTITYSET and paste the following source code:
METHOD opportunities_get_entityset.
DATA: lv_otype TYPE otype.
FIELD-SYMBOLS: <opportunity> LIKE LINE OF et_entityset.
CALL METHOD super->opportunities_get_entityset
EXPORTING
iv_entity_name = iv_entity_name
iv_entity_set_name = iv_entity_set_name
iv_source_name = iv_source_name
it_filter_select_options = it_filter_select_options
is_paging = is_paging
it_key_tab = it_key_tab
it_navigation_path = it_navigation_path
it_order = it_order
iv_filter_string = iv_filter_string
iv_search_string = iv_search_string
IMPORTING
et_entityset = et_entityset.
* Note: the single read below is not efficient from performance point of view.
* In production code you can use cl_crm_orgman_interface=>READ_TEXT_MULTI to improve performance
LOOP AT et_entityset ASSIGNING <opportunity>.
IF <opportunity>-sales_group IS NOT INITIAL.
lv_otype = <opportunity>-sales_group+0(1).
CALL METHOD cl_crm_orgman_interface=>read_text_single
EXPORTING
otype = lv_otype
objid = <opportunity>-sales_group+2(8)
IMPORTING
display_text = <opportunity>-sales_group_txt.
ENDIF.
IF <opportunity>-sales_office IS NOT INITIAL.
lv_otype = <opportunity>-sales_office+0(1).
CALL METHOD cl_crm_orgman_interface=>read_text_single
EXPORTING
otype = lv_otype
objid = <opportunity>-sales_office+2(8)
IMPORTING
display_text = <opportunity>-sales_office_txt.
ENDIF.
ENDLOOP.
ENDMETHOD.
b. create a new private method FILL_SALES_TEXT with the following signature:
source code:
METHOD fill_sales_text.
FIELD-SYMBOLS: <opp_header> TYPE cl_crm_opportunity_mpc=>ts_opportunity,
<opp_expand> TYPE crmt_odata_oppt_hdr_expanded,
<opp> TYPE any,
<salegroup_text> TYPE crmt_odata_oppt_header-sales_group_txt,
<saleoffice_text> TYPE crmt_odata_oppt_header-sales_office_txt,
<salegroup_code> TYPE crmt_odata_oppt_header-sales_group,
<saleoffice_code> TYPE crmt_odata_oppt_header-sales_office.
DATA: lv_otype TYPE otype.
IF iv_called_by_expand = abap_false.
ASSIGN cr_entity->* TO <opp_header>.
ASSIGN <opp_header> TO <opp>.
ELSE.
ASSIGN cr_entity->* TO <opp_expand>.
ASSIGN <opp_expand> TO <opp>.
ENDIF.
ASSIGN COMPONENT 'SALES_GROUP' OF STRUCTURE <opp> TO <salegroup_code>.
ASSIGN COMPONENT 'SALES_GROUP_TXT' OF STRUCTURE <opp> TO <salegroup_text>.
ASSIGN COMPONENT 'SALES_OFFICE' OF STRUCTURE <opp> TO <saleoffice_code>.
ASSIGN COMPONENT 'SALES_OFFICE_TXT' OF STRUCTURE <opp> TO <saleoffice_text>.
IF <salegroup_code> IS NOT INITIAL.
lv_otype = <salegroup_code>+0(1).
CALL METHOD cl_crm_orgman_interface=>read_text_single
EXPORTING
otype = lv_otype
objid = <salegroup_code>+2(8)
IMPORTING
display_text = <salegroup_text>.
ENDIF.
IF <saleoffice_code> IS NOT INITIAL.
lv_otype = <saleoffice_code>+0(1).
CALL METHOD cl_crm_orgman_interface=>read_text_single
EXPORTING
otype = lv_otype
objid = <saleoffice_code>+2(8)
IMPORTING
display_text = <saleoffice_text>.
ENDIF.
ENDMETHOD.
c. in DPC_EXT’s method /IWBEP/IF_MGW_APPL_SRV_RUNTIME~GET_ENTITY, call the FILL_SALES_TEXT:
METHOD /iwbep/if_mgw_appl_srv_runtime~get_entity.
CALL METHOD super->/iwbep/if_mgw_appl_srv_runtime~get_entity
EXPORTING
iv_entity_name = iv_entity_name
iv_entity_set_name = iv_entity_set_name
iv_source_name = iv_source_name
it_key_tab = it_key_tab
it_navigation_path = it_navigation_path
io_tech_request_context = io_tech_request_context
IMPORTING
er_entity = er_entity
es_response_context = es_response_context.
CASE iv_entity_name.
WHEN 'Opportunity'.
CALL METHOD fill_sales_text
EXPORTING
iv_called_by_expand = abap_false
CHANGING
cr_entity = er_entity.
WHEN OTHERS.
ENDCASE.
ENDMETHOD.
in DPC_EXT’s method /IWBEP/IF_MGW_APPL_SRV_RUNTIME~GET_EXPANDED_ENTITY, call the method as well:
METHOD /iwbep/if_mgw_appl_srv_runtime~get_expanded_entity.
CALL METHOD super->/iwbep/if_mgw_appl_srv_runtime~get_expanded_entity
EXPORTING
iv_entity_name = iv_entity_name
iv_entity_set_name = iv_entity_set_name
iv_source_name = iv_source_name
it_key_tab = it_key_tab
it_navigation_path = it_navigation_path
io_expand = io_expand
io_tech_request_context = io_tech_request_context
IMPORTING
er_entity = er_entity
es_response_context = es_response_context
et_expanded_clauses = et_expanded_clauses
et_expanded_tech_clauses = et_expanded_tech_clauses.
CASE iv_entity_name.
WHEN 'Opportunity'.
CALL METHOD fill_sales_text
EXPORTING
iv_called_by_expand = abap_true
CHANGING
cr_entity = er_entity.
ENDCASE.
ENDMETHOD.
Once this step is done, you could test your enhanced Odata service read operation and ensure you could see both code and description of SalesGroup and SalesOffice in response.
Step3: change the binding of extension fields
Just change the binding path from code to the converted value formatted by the formatter.
<core:FragmentDefinition xmlns="sap.m" xmlns:core="sap.ui.core" xmlns:ui="sap.ui.layout">
<ui:form.SimpleForm id="salesAreaInfoTabContentBottomExtension">
<ui:content>
<Label id="SalesOfficeLabel" text="Sales Office">
</Label>
<Text id="SalesOffice" text="{parts: [{path :'json>/SalesOfficeText'},{path : 'json>/SalesOfficeCode'}],
formatter : 'cus.crm.opportunity.CRM_OPPRTNTYExtension.UtilExtension.Util.formatSalesOffice'}"></Text>
<Label id="SalesGroupLabel" text="Sales Group">
</Label>
<Text id="SalesGroup" text="{parts: [{path :'json>/SalesGroupText'},{path : 'json>/SalesGroupCode'}],
formatter : 'cus.crm.opportunity.CRM_OPPRTNTYExtension.UtilExtension.Util.formatSalesOffice'}"></Text>
</ui:content>
</ui:form.SimpleForm>
</core:FragmentDefinition>
The complete UI code could be found in github:https://github.com/i042416/testOpportunityExtension/ with commit id: 7489bd487cc40fff1a9dd3b9d3683036961a1061 The complete backend source code could be found from attachment.
要获取更多Jerry的原创文章,请关注公众号"汪子熙":
相关推荐
SAP Fiori 是 SAP 公司推出的一种全新的用户体验(UX)设计,旨在提供更加直观、高效和个性化的企业级应用程序。这个快速指南将带你了解 SAP Fiori 的基本概念、设计原则以及不同类型的 SAP Fiori 应用程序。 首先...
### SAP Fiori 快速指南知识点详述 #### 一、SAP Fiori 简介 SAP Fiori 是一款由 SAP 开发的新...随着 SAP HANA 的普及和技术的发展,SAP Fiori 的应用范围和功能也将不断扩展,成为企业信息化建设不可或缺的一部分。
2. **Fiori库的激活**:在SAP Gateway服务目录中,激活所需的Fiori应用库,这将使Fiori应用能够在Launchpad上显示。 3. **SAML单点登录配置**(可选):如果需要,可以配置SAML单点登录,以实现用户统一认证,提高...
本配置手册旨在指导用户完成SAP Fiori的设置和配置,从而实现SAP Fiori Launchpad的激活。下面是该手册中所涉及到的知识点: 1. 创建管理员账号和测试账号 在SAP Fiori的配置中,需要创建管理员账号和测试账号。...
### SAP Fiori APP 应用快速实施解决办法 #### 一、引言 SAP Fiori 是一种全新的用户界面设计原则和技术框架,旨在为用户提供直观、简洁和一致的体验。本文档将详细介绍如何通过手动配置步骤或使用预定义任务列表...
SAP Fiori 快速启动板是 SAP Fiori 应用的外壳,为应用提供导航、个性化、嵌入支持和应用程序配置等服务。它是 SAP Fiori 应用在移动和桌面设备上的入口点。 快速启动板的组成部分 快速启动板由外壳栏、Me 区域、...
SAP Fiori Launchpad作为移动和桌面设备上的Fiori应用程序入口,为用户提供了一种直观便捷的方式去访问各种业务流程相关的应用。为了确保Fiori Launchpad能够满足不同用户的需求,SAP提供了Launchpad Designer这一...
通过以上概述,我们可以看到 SAP Fiori 2.0 在多个方面进行了显著的改进,既提升了用户体验,又为开发人员提供了更多的灵活性和工具来构建高质量的应用程序。无论是对于系统管理员还是开发人员来说,掌握这些新特性...
SAP fiori的简易开发过程指南,从开发者角度出发,分后面ODATA开发环境和前端SAP UI5环境搭建,以及发布进行了讲解
SAP Fiori 是 SAP 软件和应用程序的新用户体验(UX),提供了一组应用程序,用于常规业务功能,如工作批准,金融应用程序,计算应用程序和各种自助服务应用程序。SAP Fiori 提供了 300 多个基于角色的应用程序,如...
Take a deep dive into SAP Fiori and discover Fiori architecture, Fiori landscape installation, Fiori standard applications, Fiori Launchpad configuration, tools for developing Fiori applications and ...
SAP Fiori SAP Fiori SAP Fiori Architecture Architecture Overview to Deep Overview to Deep Dive -with with focus on S/4 HANA focus on S/4 HANA
同时,本课程还将为参与者提供一个宝贵的机会,了解 SAP Fiori 元素开发的最新趋势和发展方向。 SAP Fiori Elements Development UX 403 是一门非常实用的课程,旨在帮助开发人员快速掌握 SAP Fiori 元素开发的技能...
SAP Fiori是一种创新的用户界面(UI)设计和交付架构,由SAP公司推出,旨在为企业应用程序带来消费级用户体验。SAP Fiori的目标是通过更新最广泛和频繁使用的SAP软件功能的用户界面,为用户提供即时价值,这些功能可以...
2. **SAP UI5**:SAP Fiori的基础是SAP UI5,一个开源的JavaScript库,用于构建响应式和交互式的Web应用。掌握UI5的核心概念,如控制器、模型、视图和组件,对于提升开发效率至关重要。 3. **OData服务**:Fiori...
SAP 计划将所有应用和 UI 技术统一到 SAP Fiori UX 方向上,这意味着无论是在 HANA 平台上的应用、分析工具还是其他任何类型的 SAP 软件,都将采用统一的设计风格和技术框架。 #### 8. SAP Fiori 用户角色 SAP ...
在这个最新的现金流案例中,我们看到SAP Fiori如何帮助用户实时监控和管理公司的财务状况。 测试用例关键点在于验证“现金位置”(Cash Position)瓷砖在SAP Fiori Launchpad中的信息显示是否准确。这个测试用例旨在...
在开发工具方面,教程详细介绍了Eclipse和WEBIDE的使用,这是两个对SAP Fiori开发者来说非常重要的开发环境。对于调试技术,教程同样给予了足够的重视,讲解了调试工具的基本使用。 整个教程的目的是为了帮助开发者...
SAP Fiori 是 SAP 软件和应用程序的新用户体验(UX),提供了一组应用程序,用于常规业务功能,如工作批准,金融应用程序,计算应用程序和各种自助服务应用程序。SAP Fiori 提供 300 多个基于角色的应用程序,如人力...