Sapui5 là gì

TRƯỜNG ĐẠI HỌC BÁCH KHOA HÀ NỘI
VIỆN CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG
--------- o0o --------

BÁO CÁO THỰC TẬP CÔNG NGHIỆP
Giảng viên: Th.S. Lê Xuân Thành
Sinh viên thực hiện: Nguyễn Đình Quang
MSSV:20146574

Hà Nội, tháng 12, năm 2017

Mục lục
Phần I: Lời mở đầu.
Phần II: Nội dung.
I: Training FSOFT [Đơn vị EKB.ERB]: SAP Fiori.
1.Giới thiệu.
2.SAP Fiori App.
3.Cấu trúc SAP Fiori App.
3.1: Tổng quan.
3.2: SAP Fiori launchpad - Các tính năng chính và khả năng.
3.3: SAP NetWeaver Gateway, OData Services.
4.SAP UI5.
II: Quá trình thực hiện xây dựng Fiori App dựa trên SAP UI5 và sản phẩm
demo.
1.Xây dựng app với View có dạng Master-Detail.
2.View Detail khi click tại Master View.
3.Các chức năng chính bên Master View.
4.Upload file lên server.[Detail View].
5.Smart Table và List Report.
III- Các kiến thức thu được.

Phần I: Lời mở đầu.
Thực tập công nghiệp là một trong những học phần quan trọng đối với những sinh viên sắp
hoàn thành chương trình học bậc đại học do nhà trường hợp tác cùng với các doanh nghiệp,
công ty để tiếp nhận sinh viên, tạo cho sinh viên môi trường học tập cũng như môi trường
làm việc sau khi ra trường. Đợt thực tập 20171 này hết sức có ý nghĩa đối với các sinh viên
toàn khóa, giúp cho các bạn có thể vận dụng những kiến thức đã được học trên ghế nhà
trường vào môi trường làm việc thực tế, được tiếp thu học hỏi những kinh nghiệm của các
anh chị đi trước, mở rộng thêm tầm hiểu biết cũng như những kĩ năng về những công nghệ
mới đang cập nhật hàng ngày, hàng giờ đối với những sinh viên công nghệ thông tin nói
riêng cũng như toàn thể sinh viên Đại học Bách Khoa Hà Nội nói chung.

Phần II: Nội dung.
I: Training: SAP FIORI
1. Giới thiệu
SAP Fiori là trải nghiệm người dung mới cho các ứng dụng, phần mềm của SAP. Nó
cung cấp một bộ các ứng dụng được sử dụng trong các chức năng kinh doanh thông
thường như phê duyệt công việc, ứng dụng tài chính, ứng dụng tính toán cũng như
những ứng dụng tự phục vụ khác.
SAP Fiori cung cấp 300 ứng dụng dựa trên vai trò như nhân sự, sản xuất, tài chính, vv
Khi bạn mở ứng dụng SAP Fiori trên trang chủ, bạn sẽ thấy một hình ảnh của hoa. Đó
là vì Fiori có nghĩa là 'hoa' bằng tiếng Ý.
SAP Fiori cung cấp tất cả các vai trò kinh doanh trong thời gian thực trên các thiết bị
cầm tay tương thích. Nó cung cấp các vai trò kinh doanh trên các chức năng dễ sử
dụng, đơn giản với đáp ứng chưa từng có trên máy tính để bàn, điện thoại thông minh
và máy tính bảng.

SAP Fiori cho phép nhiều ứng dụng thiết bị cho phép người dung bắt đầu quá trình trên

máy tính để bàn / máy tính xách tay và tiếp tục quá trình trên điện thoại thông minh
hoặc trên máy tính bảng. SAP đã phát triển ứng dụng Fiori dựa trên Giao diện người
dung UI5.

2. SAP Fiori App.
Các ứng dụng của SAP Fiori được chia thành ba loại. Chúng được phân
biệt dựa trên chức năng và yêu cầu cơ sở hạ tầng của chúng.
+ Ứng dụng giao dịch
+ Số liệu thống kê
+Ứng dụng phân tích
-Ứng dụng giao dịch:
Các tính năng quan trọng nhất của Ứng dụng Giao dịch là Việc phát hành đầu tiên của SAP Fiori bao gồm 25 ứng dụng giao dịch.
Các ứng dụng giao dịch trong SAP Fiori được sử dụng để thực hiện các
tác vụ giao dịch giống như các giao dịch giữa người quản lý và nhân viên
như yêu cầu để lại, yêu cầu đi lại, v.v.
Các ứng dụng giao dịch chạy tốt nhất trên cơ sở dữ liệu SAP HANA
nhưng có thể được triển khai với bất kỳ cơ sở dữ liệu nào với hiệu suất
chấp nhận được. Các ứng dụng này cho phép người dùng vận hành các
giao dịch SAP đơn giản trên các thiết bị di động cũng như máy tính để bàn
hoặc máy tính xách tay.

-Ứng dụng phân tích:
Các ứng dụng phân tích được sử dụng để cung cấp thông tin thời gian
thực theo vai trò về hoạt động kinh doanh. Các ứng dụng phân tích tích
hợp sức mạnh của SAP HANA với bộ phần mềm SAP. Nó cung cấp thông
tin thời gian thực từ khối lượng lớn dữ liệu trong trình duyệt web frontend.
Sử dụng các ứng dụng Phân tích, bạn có thể giám sát chặt chẽ các chỉ số
KPIs chỉ số hiệu suất chính. Bạn có thể thực hiện tổng hợp phức tạp và
tính toán hoạt động kinh doanh của bạn và phản ứng ngay lập tức theo

những thay đổi trong điều kiện thị trường.
Các ứng dụng phân tích của SAP Fiori chạy trên cơ sở dữ liệu SAP
HANA và sử dụng các mô hình dữ liệu ảo…
3. Cấu trúc SAP Fiori App.
3.1: Tổng quan
+ Các ứng dụng SAP Fiori được xây dựng dựa trên framework
Javascript/HTML5 được gọi là SAP UI5.
+ Hỗ trợ điện thoại thông minh, máy tính bảng và máy tính để bàn.
+ Ứng dụng SAP Fiori được khởi chạy và chạy trong trình khởi chạy
SAP Fiori.
+ Dữ liệu doanh nghiệp được lấy ra khi chạy [thông qua dịch vụ OData].

3.2: SAP Fiori launchpad - Các tính năng chính và khả năng.
Dựa trên vai trò
• Phân bổ ứng dụng thông qua danh mục doanh nghiệp cụ thể theo vai trò
• Các nhóm được xác định trước cho trang chủ FLP
Cá nhân hóa
• Thêm / xóa ứng dụng khỏi trang chủ
• Thay đổi tiêu đề
• Chọn chủ đề tùy chỉnh
Tìm kiếm - trên các ứng dụng và đối tượng kinh doanh
Danh mục chính - điều hướng nhanh, dễ dàng và theo ngữ cảnh
Đáp ứng
Thiết kế thích nghi để chạy trên nhiều thiết bị
• Cấu hình cho phép khởi động các ứng dụng cụ thể
Theming và branding - thông qua thiết kế theme UI

3.3: SAP NetWeaver Gateway, OData Services.
SAP NetWeaver Gateway được sử dụng để thiết lập kết nối giữa bộ phần

mềm SAP và khách hàng mục tiêu, nền tảng và khuôn khổ. Nó cung cấp
các công cụ phát triển và tạo ra để tạo ra các dịch vụ OData cho các công
cụ phát triển khách hàng khác nhau.
SAP NetWeaver Gateway cung cấp một cách dễ dàng hơn cho việc tiêu
thụ logic và nội dung kinh doanh cho hệ thống SAP Back-end trên các

ứng dụng web. Nó cũng làm giảm sự phức tạp để truy cập dữ liệu SAP và
cung cấp giao diện dễ dàng để giảm thời gian phát triển.
SAP NetWeaver Gateway là một công nghệ cung cấp một cách đơn giản
để kết nối các thiết bị, môi trường và nền tảng cho phần mềm SAP dựa
trên các tiêu chuẩn thị trường.
Không gây rối, bất kỳ bộ phần mềm kinh doanh nào của SAP.
Dễ phát triển các API đơn giản và không đòi hỏi bất kỳ kiến thức về công
cụ.
Dựa trên REST, ATOM / OData. Nó cho phép kết nối với các ứng dụng
của SAP sử dụng bất kỳ ngôn ngữ lập trình hoặc mô hình nào, mà không
cần đến kiến thức SAP, bằng cách tận dụng các dịch vụ REST và các giao
thức OData / ATOM.
Nó cung cấp các plugins IDE nổi tiếng như Eclipse, Visual Studio 2010 và
XCode.
4. SAP UI5.
Như đã nêu lên ở trên SAP UI5 được hiểu như là thư viện của SAP Fiori,
SAP Fiori được xây dựng trên nền tảng SAP UI5.
SAP cung cấp các công cụ khác nhau mà người dùng có thể sử dụng để
nâng cao trải nghiệm người dùng của họ để tạo ra các ứng dụng với giao
diện người dùng phong phú cho các ứng dụng kinh doanh Web.
Các ứng dụng dựa trên web mà bạn tạo bằng SAP UI5 cung cấp trải
nghiệm người dùng nhất quán hơn và có thể truy cập được trên các thiết bị
như máy tính bảng, điện thoại thông minh và máy tính xách tay. Sử dụng

cổng NetWeaver với UI5, bạn có thể xác định sự tách biệt rõ ràng giữa
giao diện người dùng và logic kinh doanh.
SAP UI5 cung cấp các tính năng chính sau đây :
Các khái niệm mở rộng ở cấp mã và ứng dụng.
Khả năng tạo các mẫu UI phức tạp và bố cục được xác định trước cho các
trường hợp sử dụng thông thường.
Model-View-Controller [MVC] và phương pháp ràng buộc dữ liệu.
Hỗ trợ tương tác bàn phím và các tính năng truy cập.

SAP UI5 dựa trên các tiêu chuẩn mở như JavaScript, CSS và HTML5.
Theming hỗ trợ dựa trên CSS.
Sau đây là những ưu điểm của việc sử dụng SAP UI trong kinh doanh Nó giúp tăng năng suất.
Tăng sự thích ứng của người dùng.
Ít lỗi thủ công.
Giảm chi phí đào tạo.
Hiệu năng cao của hệ thống SAP.
API được thiết kế hoàn hảo và có thể được tiêu thụ một cách dễ dàng.

II: Quá trình thực hiện xây dựng Fiori App dựa trên SAP UI5 và sản phẩm
demo.
1. Xây dựng app với View có dạng Master-Detail:

Page sẽ đực hiển thị với khung hình bên trái là Master View với danh
sách thông tin được lấy ra từ phía Backend[Data Binding sử dụng
OData Model] và Detail View đựơc hiển thị phía bên phải màn hình
còn lại.
2. Khi click vào từng item tương ứng phía Master View thì các thông tin
tương ứng của item[id, name, …] sẽ được hiển thị tương ứng với item

đó bên Detail View.

3. Các chức năng chính bên Master View.

Xây dựng form search items, sắp xếp, Filter

Đối với các ứng dụng SAP thì Filter là một phần rất quan trong giúp người dung có
thể dễ dàng tìm kiếm thông tin liên quan một cách nhanh chóng và hiệu quả.
Một chức năng quan trọng nữa của app đó là tạo mới items[Create] và data được
lưu vào phía backend thông qua OData Services với phương thức create trong SAP
UI5 tương ứng với phương thức POST http.

4. Upload file lên server.[Detail View]
Cũng giống như tạo, xóa items upload file lên server của app cũng đều
sử dụng những phương thức như Create, Delete, Update, Read trong
SAP
UI5[CRUD][
Demo
CRUD
SAP
UI5:
//www.youtube.com/watch?v=kI9gBuSMvRU]

5. Smart table và List report.
Đối với task này thì chức năng chính cũng được xây dựng dựa trên
Filter như đã nhắc ở trên đó là lọc ccas thông tin cần thiết và view ra
một list các danh sách thông tin items đã được Filter [lọc theo từng
chức năng của mỗi app]

Đối với các yêu cầu như trên ta có thể nắm bắt được các đối tượng
trong SAP UI5, FIORI.
III- Các kiến thức thu được.
1. Thực hành và tìm hiểu về những ứng dụng của ngôn ngữ
Javascript/HTML5 trong SAP[mà đặc biệt là SAP UI5/Fiori].
2. Các kiến thức liên quan đến SAP UI5, Fiori:
+ File Uploader, Odata Services, mô hình MVC, CRUD [tương ứng
với các phương thức POST, UPDATE, DELETE, PUT]
+ Cấu trúc của SAP FIORI[cả về client + server ]
3. Nâng cao được khả năng cũng như tư duy lập trình, nắm bắt được
công nghệ mới đối với Việt Nam đó là SAP hệ thống, ứng dụng
doanh nghiệp hàng đầu thế giới.

Chủ Đề