Sap crm ui cookbook

37

Click here to load reader

description

 

Transcript of Sap crm ui cookbook

Page 1: Sap crm ui  cookbook

Version 3

Consultant’s Cookbook CRM WebClient UI Valid for SAP CRM 2006s SP05 and higher June 2007

Please provide feedback: [email protected]

Page 2: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 2

Change History Version Status/Changes Date

1 Version for CRM2006s SP03, CRMUIF SP4 February 2007 2 Version for CRM2006s SP05, CRMUIF SP7 June 2007 3 Version for CRM2007 December 2007

Icons

Icon Meaning

Caution

Example

Note

Recommendation

Syntax

Page 3: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 3

Contents

0 Introduction...................................................................................................................................................4

1 CRM WebClient UI Architecture..................................................................................................................5

1.1 Introduction .................................................................................................................................................5 1.1.1 CRM WebClient UI Architecture Overview ..............................................................................................5

1.2 CRM WebClient UI Architecture: Software Architecture Layers...........................................................7

1.3 The Business Layer....................................................................................................................................7

1.4 The Presentation Layer ..............................................................................................................................9 1.4.1 Model View Controller Design Pattern Overview.....................................................................................9 1.4.2 CRM WebClient UI Components ...........................................................................................................18 1.4.3 View Set Composition and Navigation...................................................................................................20

2 CRM WebClient UI Enhancements ...........................................................................................................23

2.1 Tool Overview ...........................................................................................................................................23 2.1.1 BSP Component Workbench .................................................................................................................23 2.1.2 UI Configuration .....................................................................................................................................24 2.1.3 Web Service Tool...................................................................................................................................26

2.2 Tutorial: Example for IC WebClient UI Structure and UI Configuration ..............................................28

3 Linked Documents .....................................................................................................................................35

3.1 SAP CRM Web UI Philosophy..................................................................................................................35

3.2 UI Configuration........................................................................................................................................35

3.3 General Framework Concepts.................................................................................................................35

3.4 BI Integration.............................................................................................................................................36

3.5 Enhancements ..........................................................................................................................................36

3.6 Web Service Tool ......................................................................................................................................37

Page 4: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 4

0 Introduction This cookbook is aimed at members of CRM WebClient UI implementation teams, for example, consultants or project leads. It supplements the SAP CRM 2006s standard documentation and has the following structure:

Unit 1 Explains the technical concepts and architecture used by the CRM WebClient UI, such as Business Server Pages (BSPs) and the underlying Business Object Layer (BOL)

Unit 2

Contains tutorials on how to apply changes to the CRM WebClient UI. It also gives an overview of the available tools that enable you to apply changes to the CRM WebClient UI.

Unit 3

Contains reference documents for further information on CRM WebClient UI.

As of SAP CRM Release 2006s, the IC WebClient shares the UI Framework and is a part of the generic CRM WebClient UI. Therefore, you may also consult the SAP CRM documentation for your IC WebClient projects.

We also recommend the following documentation:

TICM Guides and Configuration Guides: SAP Service Marketplace (service.sap.com/crm-inst) -> SAP CRM 2006s:

o Master Guide o Upgrade Guide o Installation Guides o Security Guide o Solution Management Guide o Configuration Guides for all released scenarios

Consultant Documentation: http://help.sap.com -> mySAP Business Suite -> SAP Customer Relationship Management

System Documentation: IMG documentation and related field help, message long texts Release Notes: SAP Service Marketplace (service.sap.com/releasenotes)

We would very much appreciate your feedback about this document. Please send your comments to: [email protected].

Page 5: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 5

1 CRM WebClient UI Architecture

1.1 Introduction In this unit, you will learn the following about the overall architecture of the CRM WebClient UI:

Section 1.1 explains that the CRM WebClient UI is based on the SAP Web Application Server (SAP Web AS) technology

Section 1.2 gives an overview of the layers of the CRM WebClient UI software architecture Section 1.3 focuses on the business layer of the CRM WebClient UI Section 1.4 introduces the BSP technology-based presentation layer of the CRM WebClient UI

The graphics of this chapter visualize the concepts of the software architecture in two different ways:

Abstract graphics explain how the technical elements of the CRM WebClient UI work together in the architecture concept

Screenshots from the Component Workbench (transaction BSP_WD_CMPWB) show how to access these elements in the system and how they are linked together

This way you can compare the concepts to what you see in the system in parallel.

1.1.1 CRM WebClient UI Architecture Overview

The CRM WebClient UI is built to run within a Web browser. Therefore, on the client side it is only necessary to install a Web browser. A SAP Graphical User Interface (SAP GUI) is not necessary. All data displayed in the Web browser is sent by HyperText Transfer Protocol (HTTP) from the SAP Web AS to the client (the Web browser).

Page 6: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 6

© SAP AG 2006; ASM CRM

CRM WebClient and SAP Web Application Server

Web Browser

SAP WebApplication Server

ABAPBusiness Server Pages

(ABAP + HTMLB)

J2EE

70

Internet Communication Manager

RFC

SOAP/XML

HTTP(S)

SMTP

CRM WebClient

HTTP

CRM WebClient UI and SAP Web Application Server

SAP Web AS 70 contains two runtime environments:

ABAP J2EE (Java 2 Enterprise Edition)

The CRM WebClient UI is fully based on the ABAP stack. The user interface (UI) is based on Business Server Page (BSP) technology. BSPs are a blend of ABAP code and BSP extensions. BSP extensions provide HyperText Markup Language Business (HTMLB) tags for a consistent look and feel throughout all applications. HTMLB tags have complex and extensible capabilities that are much more powerful than standard HTML tags. For more information about how HTML tags are used for the CRM WebClient UI, see section 1.4.1.1: Views. The HTTP services of the Internet Communication Manager (ICM) communicate between the Web browser and the BSP runtime. The ICM handles the inbound and outbound connections of the SAP Web AS. It is responsible for caching and works with a great variety of protocols, such as Simple Object Access Protocol (SOAP), HTTPs, and Simple Mail Transfer Protocol (SMTP). The ICM is an integral part of the SAP Web AS. In addition, an Enterprise Portal can be used but is not necessary to run the CRM WebClient UI.

Page 7: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 7

1.2 CRM WebClient UI Architecture: Software Architecture Layers The CRM WebClient UI is based on a multi-layer architecture on the server side:

CRM application & database Business layer

Data of business objects of a CRM WebClient UI session, such as business partners, products, and transactions, are handled by the business layer. For more information, see section 1.2: The Business Layer.

Presentation layer The Business Server Pages (BSPs) are the presentation layer of the CRM WebClient UI. They are the basis for the HTML page running in the Web browser. For more information, see section 1.3: The Presentation Layer.

The layers are strictly separated.

© SAP AG 2006; ASM CRM

Layers of the CRM WebClient Application

Tables

CRM WebClient

Business Server Pages(BSPs)

PresentationLayer

Business Layer

Business Object Layer(BOL)

Business Engine(e.g. mySAP CRM)

Generic Interaction Layer(GenIL)

Appl. Progr. Interfaces(APIs)

CRM WebClient specific Layers

Layers of underlying Business Application

CRM WebClient UI Architecture Layers

This separation allows the connection of any business application, via GenIL and BOL, to the CRM WebClient UI presentation layer. The CRM WebClient UI handles not only CRM business objects and processes, but also ERP system application objects, such as employees from mySAP HCM (Human Capital Management) and ERP sales orders from mySAP SCM (Supply Chain Management).

1.3 The Business Layer The business layer consists of the following:

Page 8: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 8

Business Object Layer (BOL) The BOL stores data of business objects, such as business partners and sales orders, at the runtime of a CRM WebClient UI session. It was implemented to guarantee the separation of the CRM WebClient user interface and the underlying business logic.

Generic Interaction Layer (GenIL) The GenIL handles the data transfer from the BOL to the Application Programming Interfaces (APIs) of the underlying (CRM) business engine (application logic and database tables). In other words, the GenIL connects the BOL to the underlying business logic and database, for example SAP CRM, through the Application Programming Interfaces (APIs) of the underlying application, in most cases APIs of SAP CRM.

© SAP AG 2006; ASM CRM

Business Layer: Overview

Request

Response

userinput

data output

Controller

ViewModel

Presentation Layer (BSP)

BusinessLayer

Business Engine(e.g. my SAP CRM)

BOL: Business Object Layerdata structures of the BOL holding business objects for the CRM WebClient session

GenIL: Generic Interaction LayerGenIL Model and Implementation Classes connecting BOL to CRM APIs

API API API

Business Layer Overview

In the BOL, there are mainly three different types of objects:

Root objects (also called entities) Root objects store business object data during the runtime of a CRM WebClient UI session.

Search objects (also called query services) Dependant Objects

A dependent object is a special type of business object whose attributes cannot be determined solely from the ID of this business object, but instead, only or together with the ID of the superior access object. Example: ONEORDER (BOL component set) -> BTOrder (Root Object) -> BTAdminH (Access Object) -> BTCustomerH (Dependent Object)

Root objects, such as business partners and CRM business transactions, are implemented as hierarchies of data dictionary structures. Each BOL object appears in a tree structure with exactly one root node. The

Page 9: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 9

composition of BOL objects is generic, as the BOL data structures are usually including the structures of the underlying data model of the application. You can use the component workbench (transaction code BSP_WD_CMPWB, button “BOL Model”) to see how business objects are implemented in the BOL. The figure below shows the BOL root object BTOrder (CRM business transactions).

© SAP AG 2006; ASM CRM

Component Workbench: Accessing the BOL Model

BOL Object: CRM Business Transaction

Data Dictionary Structure (double click)

Fields of the structure

New Transaction:BSP_WD_CMPWD

Accessing the BOL in the Component Workbench

For more information on GenIL and BOL customizing:

see Customizing for Customer Relationship Management, by choosing CRM Cross Application Components Generic Interaction Layer/Object Layer Basic Settings.

see links in unit 2.

1.4 The Presentation Layer

1.4.1 Model View Controller Design Pattern Overview

Business Server Pages (BSPs) can be created using different programming paradigms and design patterns. The CRM WebClient UI BSP is based on the Model View Controller (MVC) paradigm. MVC is a widely accepted design pattern for developing object oriented user interfaces (UI). It provides an effective way of relating UI layouts to an underlying data model. A MVC application consists of a:

Model

Page 10: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 10

The model of the CRM WebClient UI BSPs consists of contexts and context nodes that link the fields of a view to the underlying business layer (the BOL). This linking is referred to as binding. Each data field on a view visualizes an attribute of a context node. For more information on context and context nodes, see section 1.4.1.3: Model: Contexts and Context Nodes.

View The view handles the visual output. It is responsible for rendering the output and relevant UI controls, such as data fields and push buttons. All output is received from the controller for rendering. All user input is passed from the view back to the controller for processing. For more information, see section 1.4.1.1: Views.

Controller The controller handles the interaction logic and provides the connection between a view and a model of a MVC application. A controller receives all keyboard and mouse input from the view. Based on these events, the controller can decide how to react, for example, by accessing data from the model or triggering the navigation to a different view. For more information on view controllers, see section 1.4.1.2: Controllers.

IC WebClient 5.0 2006s Delta Knowledge: As of release 2006s, the IC WebClient views are stored in components. The Interfaces of a component – the windows – allow the reuse of the views of a component by other components. This is an improvement compared to the situation in 4.0 and 5.0 where views could not be reused directly . A component is technically a BSP application. (Learn more about components in the IC WebClient Components section of this unit and in unit 2.)

The figure below shows how the view, controller, and model make up the Presentation layer of the CRM WebClient UI.

Page 11: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 11

© SAP AG 2006; ASM CRM

Model View Controller Concept

Request

Response

Controlleruserinput

data output View

Model

Presentation Layer (BSP)

Business Layer (BOL & GenIL)

Tables

Business Engine

CRM WebClient

set

get

Data flow

Control flow

(APIs)

Model View Controller Concept The views and their corresponding controllers and contexts of CRM WebClient UI components can be accessed in the component workbench (Transaction BSP_WD_CMPWB: click on Views in the Bowser Component Structure).

Page 12: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 12

© SAP AG 2006; ASM CRM

Component Workbench: View, Controller and Model

Transaction Code BSP_WD_CMPWBView: Layout

Controller:Class

Model:Context & Context Nodes

Controller:Event Handling & Navigation

Component Workbench Overview

NOTE: In CRM WebClient UI components, each view has its own view controller, for example, view,

BTSHeader.htm, and corresponding controller, BTSHeader.do.

The CRM WebClient UI includes special types of views called view sets. A view set contains placeholders - the view areas – that can be filled with other views. This way, a number of views can be combined on a screen in a particular layout. See figure View Set, View Area, and View.

The different elements of the CRM WebClient UI BSPs are explained in more detail in the following section.

1.4.1.1 Views The layout of CRM WebClient UI views can be implemented in two different ways, both of which rely on HTMLB tags. Both ways are used by the CRM WebClient UI standard delivery layout. Option 1) The layout definition, including the selection, sequence and positioning of fields and labels, is

configured and stored outside of the view by the UI configuration tool. The view contains one special HTMLB tag that is able to read the layout definition that was saved by the configuration tool. To access the tool, select a view in the component workbench and click on tab page Configuration.

Option 2) The layout details are represented by HTMLB tags directly in the view layout coding. HTMLB

tags are used to structure the view layout and to describe all of its UI elements. The view layout definition structures the available space as a grid of columns and rows. Cells of this

Page 13: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 13

grid are filled by HTMLB tags for the various UI elements like fields, navigation links, and buttons. To access the view layout code, double-click on the view on the Structure tab page in the component workbench.

HTMLB is a SAP extension of HTML. HTMLB tags have complex and extensible capabilities that are much more powerful than normal HTML tags. HTMLB tags ensure a consistent look and feel throughout all applications. In addition to standard HTMLB tags, the CRM Web client UI framework makes use of THTMLB and CHTMLB tags. THTMLB are the basic tags (T stands for thin). These tags could also be used directly (Input tag, Table tag...). CHTMLB are the configurable tags (C stands for configurable). These tags are used on the view in case the view can be changed in configuration. The CHTMLB Tags are based on the basic tags but are more complex. For more information about HTMLB tags, see the Tag Browser in transaction SE80. Option 1 is used mainly for the layout of form views (fields and labels and the grid of table views). Option 2 is used for areas of views that contain buttons and navigation links.

IC WebClient 5.0 2006s Delta Knowledge: The new UI configuration tool was introduced with 2006s. It allows changes to major parts of the IC WebClient layout. Many of the layout changes that required changes to the view layout coding (HTMLB tags) in SAP CRM release 4.0 and 5.0 can now be done by the graphical UI configuration tool. Learn more about the UI configuration tool in unit 2.

© SAP AG 2006; ASM CRM

UI Configuration Tool

Field Set with available fields View Layout

Transaction Code BSP_WD_CMPWB

UI Configuration Tool

Page 14: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 14

1.4.1.2 Controllers View controllers consist of:

• Controller definitions • Assigned controller classes

To access the view controller class of a view, see figure Component Workbench Overview. (The controller class can be selected on view structure tab page). The controller class provides important methods that control the behavior of the corresponding view:

Navigation Inbound/outbound plugs are methods that control what happens when navigating to or away from views. For more information on navigation in the CRM WebClient UI, see the Navigation section of this unit and links in unit 2.

Events Event handler methods control the reaction to events, mainly user input. For example, when a user presses a button on a view, the processing of this event takes place in the method, DO_HANDLE_EVENT, of the view controller class.

NOTE: Do not confuse these BSP events, described above, with CRM WebClient UI application

events. The CRM WebClient UI application events can be triggered and handled by CRM WebClient UI alerts and are described in the online help documentation and IMG documentation.

Context and Data Binding Various methods of the view controller class control the initialization of the context and thus the data binding. For more information on contexts and context nodes, see the next section.

In CRM WebClient UI BSP applications, each view has its own view controller. The naming convention is: View name MyView.htm Controller name MyView.do Controller class name CL_CRM_IC_MYVIEW_IMPL

1.4.1.3 Model: Contexts and Context Nodes The model of CRM WebClient UI BSPs consists of contexts and context nodes that link the fields of a BSP view to the underlying BOL data structures. This linking is referred to as data binding. Each data field on a view visualizes an attribute of a context node. Each attribute of the context node is connected to a field in a BOL structure.

Page 15: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 15

© SAP AG 2006; ASM CRM

Data Binding

Controller

View

Presentation Layer (BSP)

CRM APIspassing the data to

CRM Database Tables

BusinessLayer

BOL: Business Object Layerdata structures of the BOL holding business objects for the CRM WebClient session

GenIL: Generic Interaction LayerGenIL Model and Implementation Classes connecting BOL to CRM APIs

Business Engine(e.g. my SAP CRM)

ModelContext with Context Nodes and Attributes

Business Layer: Data Binding

Context nodes and contexts are both implemented as ABAP classes. To find the context nodes, expand the view structure in transaction BSP_WD_CMPWB. For an example, see figure below. In the example, the context class (suffix _CTXT) is an attribute of the view controller class. The context contains several context nodes, such as with suffixes CN00, CN01, and CN02. Each context node class contains one or more attributes. The attributes of context nodes are exchanged with the attributes of corresponding BOL structures.

Page 16: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 16

© SAP AG 2006; ASM CRM

Component Workbench: Context, Context Nodes, Attributes

Context Nodes

Context

Attributes (Fields)

Component Workbench: Context, Context Nodes, Attributes

IC WebClient 5.0 2006s Delta Knowledge: In the SAP CRM releases 4.0 and 5.0, each attribute of a context node was implemented by its own GET and SET methods that read and write this attribute from and to a corresponding field of the BOL structure. As of SAP CRM release 2006s, the attributes of context nodes are implemented in generic getter and setter methods. Therefore individual methods per field are no longer required. As the new getter and setter methods are generic, they also handle fields that have been added to the BOL structures so that these fields no longer have to be implemented separately in the context nodes.

Page 17: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 17

Example for Generic STRUCT setters and getters

Each time a view controller and a view are called, the context manages the instantiation of the context nodes. However, when the view is no longer visible, it is removed from memory. This also removes the context and context nodes and the data. However, sometimes it makes sense to keep the data in memory while a view is not displayed. For example, to pass data from one view to another or in case the user wants to navigate back to the view. Data can be shared between different view controllers so the retrieval of data from the BOL can be reduced. This can be realized by custom controllers that have an unrestricted lifespan.

1.4.1.4 Custom Controllers Besides the view controllers, there is another type of controller, called custom controllers. As described above, the important difference between custom controllers and view controllers is their lifespan. A view and the corresponding controller and context have the same lifespan. When a user navigates away from a view, the view, controller, context, and its data are deleted from the memory immediately. To preserve the data, they can be passed to custom controllers that have an unrestricted lifespan. Data required by different view controllers, or one view controller at different times, can be handled and stored by one custom controller. For this purpose, the contexts can be linked to a custom controller. The contexts are assigned to an attribute, TYPED_CONTEXT, of the custom controller class. This concept makes custom controllers ideal to hold common application data, such as the confirmed business partner or current transaction.

IC WebClient 5.0 2006s Delta Knowledge: Global Data Context As in releases 4.0 and 5.0, custom controllers can be used to share data between the views of a component and to extend the lifespan of data so that they survive the lifespan of a single view. In 2006s, this concept is enhanced by the global data context. The global data context is used to transfer data between components and to extend the lifespan of the data so that they survive the lifespan of a single component. In the IC WebClient, global data contexts are used a lot, as some data needs to be available during the whole session (communication process). Technically, a global data context is a public custom controller of a component.

Page 18: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 18

© SAP AG 2006; ASM CRM

Custom Controller

Presentation Layer (BSP)

Controller

View 1

ModelContext Node

ModelContext Node

Controller

View 2

CustomController

ModelContext Node

Lifespan

Business Layer (BOL, GenIL)

Database

Lifespan Lifespan

1.4.2 CRM WebClient UI Components

The CRM WebClient UI consists of various Components. Components are technically BSP applications. The component workbench (transaction BSP_WD_CMPWB) is the tool used to develop, test and enhance components.

IC WebClient 5.0 2006s Delta Knowledge: The separation of the IC WebClient views into components began in SAP CRM Release 5.0. Here the IC WebClient views were separated into two BSPs:

• The generic BSP IC_BASE that contains all the generic views, such as breadcrumbs, navigation bar, and other parts of the L-shape that are framing the work area.

• The application-specific BSP CRM_IC, which stored the views and view sets that were used to fill the work area of the IC WebClient.

This separation of views into components was continued in the new UI Framework of SAP CRM 2006s.

• The generic Component CRM_UI_FRAME that contains the L-Shape views etc. It is used by all CRM WebClient UI applications, not only by the IC WebClient.

• About thirty Interaction Center application-specific workarea components where the content of the release 5.0 BSP CRM_IC was re-implemented and split into separate components. For example, there is a separate component for the Account Identification, the Sales Order, the Service Order, Product Search, Agent Inbox etc.

Page 19: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 19

• Reuse components that are shared between components. Reuse components allow us to share, for example, the text view or the partner view in the IC WebClient wherever needed in the IC WebClient, for example, on the header and item level of Sales Orders and Service Tickets and other transactions. A more detailed example for a workarea component (service ticket) and a reuse component (service header details) is given in unit 2.

• The IC WebClient Runtime Framework (BSP CRM_IC_RT_REP) was also split up. Each component now contains its own Runtime Framework XML file.

The decoupling into the generic CRM WebClient UI component CRM_UI_FRAME, application specific workarea components and reuse components is visualized in the figure below.

Page 20: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 20

1.4.3 View Set Composition and Navigation

1.4.3.1 View Set, View Area, and View A view set can combine several view areas. A view area can be filled with a view or another view set.

View Set, View Area, and View

Each component contains an XML file called Repository.xml (also called Runtime Repository). This repository describes the view set hierarchy, specifically how the views are filled into the view areas of the view set as well as the navigation between views of a component. You can find the Repository.xml of a component under Pages with Flow Logic in the component workbench. You can see and edit the assignment of views to view areas in the XML files. An easier way to configure the view set composition is through the Runtime Repository Editor of the component workbench. The figure below shows the Main Window of the Account Identification Component CRMCMP_BPIDENT in the Runtime Repository Editor (part of transaction BSP_WD_CMPWB).

Page 21: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 21

View Set Composition: Runtime Repository (part of transaction BSP_WD_CMPWD)

1.4.3.2 Navigation Navigation from view to view is controlled by several elements. First of all, there are outbound and inbound plugs. These plugs are methods of the view controller classes. The outbound plug is a method of the source view (where the navigation starts) and the inbound plug belongs to the target view where the navigation ends. In addition, it is necessary to map the outbound and inbound plugs and thus the source views and the target view of the navigation. This mapping can be done by navigational links. A navigational link consists of an identifier, source view, outbound plug, target view and inbound plug. Navigational links are stored in the runtime repository. As each component has its own runtime repository, navigational links are mainly used when navigating between the views inside the same component or to views of reuse components. If the navigation target is an independent workarea component, the navigation is mediated by mapping tables that are part of the navigation bar customizing and the workarea component repository. It is important to understand that the navigation bar is not only controlling the navigation triggered by the buttons in the navigation bar but also the navigation from one workarea component to another. To learn more about how the navigation in the CRM WebClient UI works, see unit 2.

Page 22: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 22

Navigational Links: Visualization Runtime Repository Editor (Part of BSP_WD_CMPWD)

IC WebClient 5.0 2006s Delta Knowledge: The navigation through navigational links of the repository is still similar to Release 5.0. An important improvement is that the repository can now be edited by the Runtime Repository Editor instead of manually changing the XML code. Differences to the earlier releases are related to the components. When the navigation involves reused components, more than one repository is involved. Here parts of the navigation are delegated from one component to another. In the IC WebClient, reuse components play a major role. Therefore it is important to understand components and the way they expose their views through windows to other components. You can find more information about the component concept and navigation in unit 2. Totally new is the navigation between work area components that is delegated to the navigation bar. Advantages of this concept are that major parts of the IC WebClient navigation are now controlled by IMG customizing rather than by XML or method coding.

Page 23: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 23

2 CRM WebClient UI Enhancements This unit contains tutorials on how to apply changes to the CRM WebClient user interface and its underlying layers.

2.1 Tool Overview This section provides an overview of the tools available to help you change the CRM WebClient UI.

2.1.1 BSP Component Workbench

The new workbench is the central modeling tool for the new CRM UI Framework. The workbench is the Central Access point to:

Components, Windows, Views Runtime repositories Component related BOL Model

The transaction to start the workbench is BSP_WD_CMPWB. Unlike the old IC Workbench (BSP_WD_WORKBENCH, which should not be used any more), the new component workbench supports the following new features:

New elements in object tree (related to componentization concept) o Component Controller o Application Controller (not needed for us) o Window Controller

New Wizards o “Create Window” o “Create Inbound Plug” o “Create Outbound Plug” o “Create Event Handler”

New features o Support of components o Support of dynamic context node attributes

Context node attributes no longer need to be generated out (as long as no special string conversion is needed (currency fields etc.))

All attributes of model entities are implicitly available on the view layout via structure access

Also supported in the configuration tools Other features

“Delete View” “Delete Custom Controller“

The following tools are new with CRM 5.1:

Create Component on initial screen View layout configuration Tool

The appropriate configuration tool appears as a separate tab in the work area for views that contain a configuration tag

Grid configuration tool Table and Tree configuration tool Overview, Home and Work Center Page configuration tool Advanced Search configuration tool

Create Overview, Home and Work Center Page

Page 24: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 24

Runtime repository editor Component Runtime repository is stored as single BSP page (“Repository.xml”)

but editing it is easier using the new tool available in the tree area (replaces the “Runtime Repository Browser” tool)

Can’t be used to edit old-style, fragmented runtime repositories Forward navigation support

Component Test You can easily test the default window of a component by pressing F8

You can create a component directly from the entry screen of the workbench

1. Enter name of the component. 2. Click on Create.

The system generates: BSP application with the name of the component Component controller (BSP controller & corresponding component controller class) Default window named “MainWindow” (BSP controller, corresponding controller class & BSP

view) Runtime repository XML file (BSP page "REPOSITORY.xml”) in the component’s BSP application

For further details please check note 1122248.

2.1.2 UI Configuration

A variety of tools are available to adapt the UI: UI Configuration tool Design Layer Customizing Easy Enhancement Workbench Navigation Bar Customizing Business Role Customizing Changing Skins

Page 25: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 25

UI Configuration Tools: Overview

UI Configuration Tool The UI Configuration tool is an easy-to-use tool for adjusting the CRM standard views to your needs. Project team members and consultants use the tool as follows:

Configure pages o Work center pages o Overview pages o Edit pages o Advanced search pages

Configure blocks o Forms o Tables o Trees

Configure fields Design Layer Customizing The design layer links UI-related settings to a new, generic design object, which spans several views implementing the same business content. The UI-related settings are simple field settings that are likely to be changed by project team members and consultants.

Field visibility: Set a field to ‘Hidden’ / ‘Field excluded from field set’: Field isn‘t available in the UI ConfigTool. (In CoD there is a difference between these two fields – if ‘Hidden’ is chosen, it is still available in the field customizing.)

Rename field labels. Value Help from Dictionary: Generic V- and P-Getter methods, which define the value help (from

DDIC: search help / value table / domain values) and field type (input field, checkbox, DDLB), have been implemented. The new generic V- and P-Getter logic is used only if the indicator is set.

Role and Navigation Bar Customizing

Page 26: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 26

The role and navigation bar customizing controls are based on business roles and determine how the navigation bar is structured and which links appear on the work center/home/report pages and in the direct link group. The main elements are: Business role

The business role is the central object for controlling the navigation bar and the logical links. User assignment

The business role is assigned to an organizational unit in the organizational model. The user is assigned to an organizational unit as well.

Authorizations The business role is assigned to an authorization profile via a “PFCG” role.

Navigation bar profile The navigation bar profile contains direct link groups and work centers. Logical links are assigned to the direct link groups. Work center link groups structure the logical links for work centers. These work center link groups

aren't visible in the application. Customer Enhancements Customer enhancements can be done using the UI Configuration Tool and/or the component enhancement concept. View layout configuration:

Can be done using only the UI Configuration tool Does not require leveraging the component enhancement concept Used for customer specific layout and label changes (including adding new fields via EEW) Customer and SAP configurations are stored separately

Component Enhancements: Enhance the functionality of components, views and controllers provided by SAP Modification free via inheritance and using references Uses replacement concept for components at runtime

You can also create completely new components. In chapter 3, you can find links to documents with more detailed information regarding the different UI configuration tools.

2.1.3 Web Service Tool

Key Concept Web services are open interfaces that allow you to link loosely coupled systems with a technology that does not bind them to any particular programming language or platform. Web services represent an industry-wide standard and are defined by the Web Service Definition Language (WSDL) file. Web services offer you the flexibility to extend an application’s capabilities to support specific business processes without the need for extensive coding or complex integration. For instance, you can use Web services to allow your customers to access your product and price information from their procurement systems and create sales orders in SAP CRM by linking the procurement software to your order management application. Web services can also help you to work offline by uploading data from SAP CRM to an Adobe form that you can modify offline and synchronize later. This way you can pass leads, such as from SAP CRM to your channel partners, via email or send service tickets to service technicians out in the field. They then receive all the information they need and can respond and add new data simply by filling out the form. Web Service Tool in SAP CRM 2006s SAP CRM 2006s provides a new Web service tool that allows you to model your individual Web service interfaces without spending days on ABAP or Java coding. With the Web service tool, you first model your service design object by choosing the needed attributes. Then the tool transforms those service design

Page 27: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 27

objects into Web service interfaces by plugging into the standard SAP NetWeaver Web service application programming interface (API). Uses for Web Service Tool Prior to SAP CRM 2006s, you had to create Web services manually by first creating the needed function modules, and then using the SAP NetWeaver Web service creation wizard to create the respective web service interface. This process could take days or even weeks, depending on the interfaces available to build on. The Web service tool can shorten this time to a couple of hours. Web Service Tool Features Features within the Web service tool that allow you to maintain and manage your Web services include:

• Default values • Ability to change attribute names • Copy functionality

Page 28: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 28

2.2 Tutorial: Example for IC WebClient UI Structure and UI Configuration This tutorial explains how to find out about the components that make up the CRM WebClient UI, and how components are reused and configured. An example is the employee request, which is part of the business role IC_SSC_AGENT (IC Shared Service Center Agent). The employee request is part of the Employee Interaction Center. It looks very similar to the IC service ticket. We therefore assume that the employee request is the same component as the service ticket. There are just some minor differences in the layout, for example, the view in the upper left corner, which displays fewer fields in the employee request than in the service ticket. Our goal is to find out which component the employee request is generally based on. In particular, we want to find out more about the view in the upper left corner and how the layout of this view is distinguished from the standard layout in the service ticket. Follow the next figures for a detailed guided tour through customizing and component configuration.

© SAP AG 2005, Title of Presentation, Speaker Name 5

IC WebClientExample: Employee Request

Page 29: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 29

A Shortcut to find out the component and view name is:

1. Place cursor in the view. 2. Press F2.

This popup gives you the name of the view and the component of the view. With this information, we can go directly to the component workbench to access the UI configuration of the view. However, it can be interesting to get more information, such as the embedding workarea component, the UI Object type, etc. For this reason, we will go through the related customizing step by step to retrieve all the detailed information. First, we have to find out which component is displayed when we click on Employee Request in the Navigation Bar.

Page 30: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 30

© SAP AG 2005, Title of Presentation, Speaker Name 8

Business Role and Navigation Bar Customizing

IMG CRM Business Roles Define Business Role (orIMG CRM IC WebClient Define Business Role)

IMG CRM UI Framework Technical Role Definition Define Navigation Bar Profile (or IMG CRM IC WebClient Basic Functions Define Navigation Bar Profile)

The figure above shows that our business role IC_SSC_AGENT has the navigation bar profile IC-EIC assigned. In the navigation bar profile IC-EIC, the work center for the employee request is IC_BT_ER. (The work center is the button that we see in the navigation bar.) The next figure explains how to find the name of the logical link and the component. As a result, we find out that the employee request is technically a service ticket: component ICCMP_BT_SVT (IC WebClient Service Ticket).

Page 31: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 31

© SAP AG 2005, Title of Presentation, Speaker Name 9

from Workcenter via Logical Link to Component

In the definition of workcenter IC_BT_ER we can see that the logical link IC_BT_SVER is assigned.

The logical link IC_BT_SVER is assigned to target ID IC_BT_SVER. A Target ID is the connection between a Logical Link and an Inbound Plug of a component.

To find the name of the component you can use use the F4 help of the field target ID. The component is ICCMP_BT_SVT which stands for IC WebClient - Service Ticket.

All screens:IMG CRM UI Framework Technical Role Definition Define Navigation Bar Profile (or IMG CRM IC WebClient Basic Functions Define Navigation Bar Profile)

The inbound plug definitions of component ICCMP_BT_SVT are stored in the work area component repository.

IMG CRM UI Framework Technical Role Definition Define Work Area Component Repository The component ICCMP_BT_SVT is the service ticket component. Depending on target ID and inbound plug, a different UI Object type is assigned. The UI Object Type is used as a key for the layout configuration of the service ticket: Object Type BT116_SRVER stands for the employee request layout configuration while BT116_SRVTK stands for the service ticket layout.

Page 32: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 32

The Object Action is not relevant here.

The next figure shows the layout of the main viewset of component ICCMP_BT_SVT in the component workbench:

© SAP AG 2005, Title of Presentation, Speaker Name 12

Component Workbench: Service Ticket Component

IMG CRM UI Framework Technical Role Definition Define Work Area Component Repository

In the Component Workbench (Transaction BSP_WD_CMPWB) the views and view sets of component ICCMP_BT_SVT can be configured.

On the right hand side the layout of the main view set: TicketViewSet can be configured. The view area in the upper left corner is called HeaderDetails.

On the left hand side under Component Usage you can see that the component ICCMP_BT_SVT is reusing other components. For example to display header details the component ICCMP_BTSHEAD is reused.

In the next step we will open component ICCMP_BTSHEAD. You can do this by clicking on the component name under component usages in the embedding component. The workbench supports the forward navigation.

Page 33: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 33

© SAP AG 2005, Title of Presentation, Speaker Name 14

Component Workbench: Service Header “Reuse”-Component Employee Request Specific View Layout

Compare to the view layout below

In the figure above, the view BTSHeader of the reuse component ICCMP_BTSHEAD is configured in the component workbench. Note that the UI Object type BT116_SRVER is part of the configuration key. (This configuration is thus only valid for the employee request and not for the service order/ticket). Only four fields are displayed. Compare this to the layout of the service ticket in the next figure.

Page 34: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 34

© SAP AG 2005, Title of Presentation, Speaker Name 16

Component Workbench: Service Header “Reuse”-Component Default View Layout

The above figure displays the service ticket specific layout of the view BTSHeader of the reuse component ICCMP_BTSHEAD. This layout displays more fields than the layout of the employee request. The last figure in this section gives you an overview of all steps and how the different objects are assigned to each other.

© SAP AG 2005, Title of Presentation, Speaker Name 3

Business Role and NavBar Customzing:Business Role: IC_SSC_AGENT

Navigation Bar: Profile IC-EIC

Workcenter: IC_BT_ER

Logical Link: IC_BT_SVER

Target ID: IC_BT_SVER

Workarea Component Definition:Comp: ICCMP_BT_SVT, Object Type BT116_SRVER

Component Configuration:Comp.: ICCMP_BT_SVTMain ViewSet: TicketViewSet

Component Usage: HeaderDetails

Used Component: ICCMP_BTSHEAD

HeaderDetails

Component Configuration:Comp.: ICCMP_BTSHEADView BTSHeader

View Config. Key: Object Type BT116_SRVER

IC WebClient Component Configuration: OverviewExample: Employee Request

Page 35: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 35

3 Linked Documents This unit describes which additional documents are available in the SAP CRM Web UI learning map on the SAP Service Market Place. You can access the documents by clicking on the hyperlinks in the Step 2: Prepare for your Project area of the learning map.

3.1 SAP CRM Web UI Philosophy CRM Web UI Philosophy This document will help you understand the new CRM WebClient UI.

3.2 UI Configuration UI Configuration Tools This document will help you:

Get an overview of the functions of the UI ConfigTool, Design Layer Customizing, and Business Role Customizing

Learn how to use the UI ConfigTool and Design Layer Customizing in implementation projects to adjust the CRM WebClient UI

Learn how to add customer specific fields to the CRM WebClient UI Navigation Bar and Business Role Customizing This document will help you to:

Get an overview of the functions of Navigation Bar Customizing, Business Role Customizing, and the Transaction Launcher

Learn how to use Navigation Bar Customizing, Business Role Customizing ,and the Transaction Launcher in implementation projects to adjust the CRM WebClient UI

How-to Guide Copy and adjust Skins This document will help you copy a SAP Skin and adjust this new Skin to your needs. How-to Guide Configure Fact Sheets This document will help you to:

Understand the concept of fact sheets Learn how to configure fact sheets

3.3 General Framework Concepts Concepts of Navigation

Page 36: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 36

This document will help you understand the concepts of navigation. How-to Guide UI Object Types This document will help you to:

Understand the concept of UI object types Change SAP UI object types Create your own UI object types

How-to Guide UI Configuration Determination This document will help you understand:

How configuration is determined How labels are determined

How-to Guide Access Objects from outside This document will help you to understand how to access a specific component from outside CRM when considering the launch of the full L-Shape, in order to enable cross-component navigation for the address page.

3.4 BI Integration How-to use the BI Report Component This document will help you understand:

How to use the BI component How to integrate BI reports into the CRM WebClient UI

3.5 Enhancements How-to Guide Framework Enhancements This document will help you to:

Understand the Framework Enhancement Concept Create Enhancement Sets Know which Business Add-ins (BadIs) are provided with the Enhancement Concept

Framework Enhancements: Example This document explains in detail the different enhancement steps. How-to Guide: Compare Runtime Repositories of Enhanced Components with Standard Components This document describes how to use the tool for runtime comparison, in order to identify differences between the runtime repository of an enhanced component and a standard component. This is especially interesting after an upgrade of the CRM system to a higher support package or even higher release. How-to Guide: Drop down list boxes This document will help you to create drop-down list boxes in your component.

Page 37: Sap crm ui  cookbook

CRM WebClient Consultant’s Cookbook for CRM 2006s SP03 Page 37

How-to Guide: Value Helps This document will help you to create value helps (F4 helps) in your component. Integrating views into the upper right area of the Account Identification screen of the Interaction Center This document explains how to integrate your own object components, for example, industry-specific views or Customer views, into the Account Identification page of the CRM WebClient. Business Object Layer (BOL): Application Programming Guide This document describes the runtime programming interface of the Business Object Layer.

3.6 Web Service Tool Create Web Services Quickly with a Web Service Tool This document explains:

How to use Web Services How to create a Web Service with the Web Service Tool

Web Service Tool UIU Contribution Interfaces and Web Service Tool Contribution Interfaces FAQ These documents will help you to enable BOL objects for Web Services