关上 SAP C4C Cloud Application Studio，
进入 Solution Explorer，右键菜单里抉择 Add -> New Item:
新建一个 Business Object，取名 CarPark:
源代码如下：
import AP.FO.BusinessPartner.Global;
import AP.Common.GDT as apCommonGDT;
businessobject CarPark
// *Further Development*
// declare an error message that is called if the BO fails validation
// raises Message_Car_Park_Full
{
// Root node must not be specified, it is created implicitly
//
// Add elements here.
//
// To declare an element as alternative key, use the [AlternativeKey]
// annotation.
//Please note:
// - An alternative key of type UUID exists implicitly for each node, enabling
// the node to be used as an association target.
// - The QueryByElements query is created automatically for each node.
// Code completion is available with CTRL + SPACE.
// *Further Development*
// define an error message to be displayed if the BO fails validation
// message Message_Car_Park_Full text "The car park is full - no spaces available";
// Car Park ID - (the company may have multiple car parks)
// - therefore we use this ID to identify the individual car park
element CarParkID : ID;
// additional information on the car park
element CarParkName : LANGUAGEINDEPENDENT_LONG_Text;
element CarParkDescription : LANGUAGEINDEPENDENT_LONG_Description;
element Number_of_ParkingSpaces : IntegerValue;
// *Further Development*
// add an element to display how many parking spaces are available
// element Number_of_ParkingSpaces_Available : IntegerValue;
// declare an action to calculate the available car spaces
// action Update_AvailableParkingSpaces;
// *Further Development*
// add an element to record location information
// this field is used with a URL mashup to display the location of the car park
// element CarParkLocation : LANGUAGEINDEPENDENT_MEDIUM_Description;
// each car park will have multiple parking spaces
// we create a node with 0 to n parking spaces
node ParkingSpace [0,n] {
// each parking space is assigned a unique identifier
element ParkingSpaceID : ID;
// display the ID of the Employee assigned to the parking space
element ParkingSpace_AssignedEmployeeID : ID;
// a parking space may be designated as a "Disabled Friendly" parking space
element ParkingSpace_Disabled : Indicator;
// is there an electric charging station for this parking space ?
element ParkingSpace_ElectricChargeStation : Indicator;
// display the license plate number of the employee's car
element Vehicle_RegistrationNumber : LANGUAGEINDEPENDENT_MEDIUM_Text;
// for a multi-level car park, we have the possibility to specify a level number
element ParkingSpace_Level : NumberValue;
// we need to create an association to the SAP BO "Employee"
// this allows us to include elements from the Employee BO in our screens
// a parking space may be associated to at most one employee
association ToEmployee [0,1] to Employee;
}
}
激活该 BO，确保 Activation Status 为 Runtime Objects up to date:
BO 激活后，右键菜单抉择 Create Screens：
抉择 Screen Scenario with Thing-Based navigation：
会主动生成很多 SAP Cloud for Customer 屏幕：
双击 QA 关上主动生成的 UI，发现下面曾经有一些来自 BO 低头级别的字段了：
点工具栏上这个 AddFlexLayoutRow 按钮：
呈现一个新的空白行：
将 Toolbox 里的控件 AdvancedListPane 拖到新建的 FlexLayoutRow 里：
选中某一个 column，右键菜单里增加一个新的 column：
当初咱们有了一个表格，蕴含四列：
View 菜单里关上：BO Browser / Data Model，使其显示在屏幕左边：
把 ParkingSpaceID 拖拽到第一列下来：
抉择 No：
从而建设了 UI 字段和 BO 模型字段的绑定关系：
此处查看绑定关系：
显示 employee ID 的字段默认是 input field，须要将其改成 value help：
改成 Object Value Selector：OVS
抉择 /SAP_BYD_APPLICATION_UI/publicovs/employeeid/
EmployeeID: 作为 OVS Component：
把字段：ToEmployee.CurrentCommon.Person.Name.GivenName 拖到第三列：
familyName 拖到第四列：
把 GivenName 的 display type 设置为 Static Text：
左边 properties 下拉菜单里，抉择 AdvancedListPaneVariant: ListPaneVariant：
useToolbar 从 false 改成 true：
设置成 true 之后，多了两个按钮：Add Row 和 Remove.
选中 Add Row 按钮，新建一个 Event handler：
新建一个 operation，类型为 List：
Target List 里，从下拉菜单抉择 /Root/DataList：
给 Remove 按钮也增加一个 event handler：
再增加一个 save action，确保 Row 被删除后主动保留：
选中 identificationRegion:
点击 Advanced：
抉择 CarParkID：
最终成果：
选中 SectionGroup，能够对外面的字段进行地位程序调整：
最初把用户调配到这个新建好的 work center 即可：
当初就能够进行测试了：
更多 Jerry 的原创文章，尽在：” 汪子熙 ”: