{"id":23647,"date":"2023-08-30T05:00:00","date_gmt":"2023-08-30T03:00:00","guid":{"rendered":"https:\/\/sii.pl\/blog\/?p=23647"},"modified":"2024-12-05T09:41:13","modified_gmt":"2024-12-05T08:41:13","slug":"rozszerzenia-standard-fiori-apps","status":"publish","type":"post","link":"https:\/\/sii.pl\/blog\/rozszerzenia-standard-fiori-apps\/","title":{"rendered":"Rozszerzenia standard Fiori Apps"},"content":{"rendered":"\n

Aplikacje standardowe SAP Fiori to portfolio dost\u0119pnych aplikacji, w kt\u00f3rych na starcie otrzymujemy okre\u015blon\u0105 funkcjonalno\u015b\u0107. Bardzo cz\u0119sto s\u0105 w nich przygotowane fragmenty kodu lub opcje do aktywowania, umo\u017cliwiaj\u0105ce dostosowanie ich jeszcze bardziej pod potrzeby biznesowe. Te specjalne fragmenty to tzw. rozszerzenia (ang. enhancements), o kt\u00f3rych b\u0119dzie mowa w tym artykule.<\/p>\n\n\n\n

Kiedy otrzymujemy zadanie rozszerzenia funkcjonalno\u015bci standardowej aplikacji SAP Fiori, istnieje kilka aspekt\u00f3w, kt\u00f3re warto sprawdzi\u0107 przed przyst\u0105pieniem do pracy. Je\u015bli planujemy doda\u0107 nowe pole, istnieje mo\u017cliwo\u015b\u0107, \u017ce jest ono ju\u017c dost\u0119pne do dodania na poziomie serwisu, a informacja o tym mo\u017ce by\u0107 zawarta w dokumentacji. Spr\u00f3bujmy odrobin\u0119 usystematyzowa\u0107 miejsca, kt\u00f3re warto sprawdzi\u0107, aby mie\u0107 pewno\u015b\u0107, \u017ce nasz wyb\u00f3r jest optymalny.<\/p>\n\n\n\n

Dla przyk\u0142adu u\u017cyjemy standardowej aplikacji \u201eRevise Payment Proposals\u201d i spr\u00f3bujemy doda\u0107 nowe pole, takie jak Item text<\/em> w oparciu o analiz\u0119 Rogera Sainsbury\u2019ego.<\/p>\n\n\n\n

Rodzaje rozszerze\u0144<\/strong><\/h2>\n\n\n\n

Personalizacja<\/strong><\/h3>\n\n\n\n

Czasami zdarza si\u0119, \u017ce pole, kt\u00f3re chcemy doda\u0107, jest ju\u017c dost\u0119pne w opcjach personalizacyjnych (ustawieniach widoku). Wystarczy w\u00f3wczas pami\u0119ta\u0107 o sprawdzeniu tego w ustawieniach aplikacji.<\/p>\n\n\n\n

\"Przycisk<\/a>
Ryc. 1 Przycisk ustawienia aplikacji SAP Fiori <\/figcaption><\/figure>\n\n\n\n
\"Lista<\/a>
Ryc. 2 Lista dost\u0119pnych p\u00f3l w ustawieniach<\/figcaption><\/figure>\n\n\n\n

Dostosowanie (ang. customizing)<\/strong><\/h3>\n\n\n\n

W niekt\u00f3rych aplikacjach Fiori dostosowanie mo\u017ce by\u0107 \u0142atwe poprzez u\u017cycie transakcji SPRO \u2013 pole w\u0142\u0105cz\/wy\u0142\u0105cz. Istnieje te\u017c mo\u017cliwo\u015b\u0107 przej\u015bcia do opcji SPRO w uproszczony spos\u00f3b. Aby odblokowa\u0107 mo\u017cliwo\u015b\u0107 korzystania z funkcji ok_code<\/em> w aplikacji, nale\u017cy uruchomi\u0107 \u201eGUI Actions and Settings\u201d:<\/p>\n\n\n\n

\"Dost\u0119pne<\/a>
Ryc. 3 Dost\u0119pne opcje menu dla listy „More”<\/figcaption><\/figure>\n\n\n\n

Nast\u0119pnie zaznaczamy opcj\u0119 \u201eShow OK Code Field\u201d:<\/p>\n\n\n\n

\"Przycisk<\/a>
Ryc. 4 Przycisk ustawienia aplikacji SAP Fiori<\/figcaption><\/figure>\n\n\n\n

W ten spos\u00f3b otrzymujemy dost\u0119p do SPRO bez konieczno\u015bci instalacji natywnego front-endu SAPGUI front-end oraz unikaj\u0105c ogranicze\u0144 zwi\u0105zanych z pobieraniem nowych plik\u00f3w i autoryzacj\u0105 na komputerach korporacyjnych.<\/p>\n\n\n\n

\"Ekran<\/a>
Ryc. 5 Ekran transakcji SPRO<\/figcaption><\/figure>\n\n\n\n

Adaptacja typu run-time (RTA)<\/strong><\/h3>\n\n\n\n

RTA to funkcjonalno\u015b\u0107, kt\u00f3ra umo\u017cliwia przypisanie super u\u017cytkownika, zdolnego do dokonywania podstawowych zmian w aplikacji Fiori. Te zmiany zostan\u0105 zastosowane dla wszystkich u\u017cytkownik\u00f3w, w przeciwie\u0144stwie do personalizacji, kt\u00f3ra pozwala na dostosowanie zmiany tylko dla danego u\u017cytkownika.<\/p>\n\n\n\n

Aby skorzysta\u0107 z adaptacji typu run-time, u\u017cytkownik musi by\u0107 przypisany do roli SAP_UI_FLEX_KEY_USER<\/em> w Gateway\u2019u na front-endzie. W\u00f3wczas opcja Adapt UI<\/em> zostanie udost\u0119pniona w Launchpadzie Fiori. Niestety, na dzie\u0144 dzisiejszy ta opcja  jest dost\u0119pna tylko w aplikacjach wykorzystuj\u0105cych kontrolki SmartForms<\/em> oraz ObjectPage<\/em>, na przyk\u0142ad w aplikacji \u201ePurchase Requisition Item Factsheet\u201d.<\/p>\n\n\n\n

\"Przycisk<\/a>
Ryc. 6 Przycisk ustawienia aplikacji SAP Fiori<\/figcaption><\/figure>\n\n\n\n

Na przedstawionym wy\u017cej przyk\u0142adzie, mo\u017cna u\u017cy\u0107 Trybu Adaptacji UI do wprowadzenia zmian bez u\u017cycia kodu.<\/p>\n\n\n\n

Je\u015bli \u017cadne z powy\u017cszych rozwi\u0105za\u0144 nie pozwala nam na dokonanie potrzebnych zmian w standardowej aplikacji Fiori, pozostaj\u0105 nam dwie bardziej rozbudowane metody \u2013 na front-endzie (SAP WEB IDE) lub na back-endzie (serwis ODATA).<\/p>\n\n\n\n

Rozszerzenia Fiori za pomoc\u0105 SAP WEB IDE<\/strong><\/h2>\n\n\n\n

W pierwszej kolejno\u015bci warto sprawdzi\u0107 dokumentacj\u0119 standardowej aplikacji Fiori w poszukiwaniu tzw. \u201eextension poits\u201d lub \u201ehooks\u201d.<\/p>\n\n\n\n

\"Sekcja<\/a>
Ryc. 7 Sekcja rozszerze\u0144 dokumentacji aplikacji \u201eRevise Payment Proposals\u201d<\/figcaption><\/figure>\n\n\n\n

Je\u015bli zdecydujemy si\u0119 na tak\u0105 zmian\u0119, mo\u017cemy j\u0105 wykona\u0107 na poziomie SAP WEB IDE, np. poprzez zamian\u0119 widoku.<\/p>\n\n\n\n

\"Widok<\/a>
Ryc. 8 Widok opcji rozszerze\u0144 dla zast\u0105pienia oryginalnego widoku w SAP WEB IDE<\/figcaption><\/figure>\n\n\n\n

Gdy zdecydujemy si\u0119 zast\u0105pi\u0107 widok (na przyk\u0142ad „S3”), powstanie w\u00f3wczas nowy projekt z ko\u0144c\u00f3wk\u0105 \u201eExtension\u201d, kt\u00f3ry zawiera kopi\u0119 standardowego widoku.<\/p>\n\n\n\n

\"Lista<\/a>
Ryc. 9 Lista plik\u00f3w rozszerzonej wersji aplikacji<\/figcaption><\/figure>\n\n\n\n

W nowym projekcie, w pliku manifest.json<\/em> znajdzie si\u0119 dodatkowy kod \u0142\u0105cz\u0105cy oryginaln\u0105 aplikacj\u0119 z nasz\u0105 now\u0105, rozszerzon\u0105.<\/p>\n\n\n\n

\"Fragment<\/a>
Ryc. 10 Fragment kodu w pliku manifest.json w aplikacji rozszerzonej<\/figcaption><\/figure>\n\n\n\n

Je\u015bli w przysz\u0142o\u015bci postanowimy usun\u0105\u0107 t\u0119 poprawk\u0119, wystarczy usun\u0105\u0107 dodatkowy kod, a aplikacja powr\u00f3ci do oryginalnego widoku.<\/p>\n\n\n\n

Za pomoc\u0105 WEB IDE mo\u017cemy r\u00f3wnie\u017c zmieni\u0107 t\u0142umaczenia tekst\u00f3w, na przyk\u0142ad dla nowo wprowadzonego pola. Podczas tworzenia projektu typu \u201eextension\u201d w Web IDE jest opcja \u201ei18n Resource Text Customization\u201d.<\/p>\n\n\n\n

\"Widok<\/a>
Ryc. 11 Widok opcji rozszerze\u0144 dla zast\u0105pienia pliku z t\u0142umaczeniami w SAP WEB IDE<\/figcaption><\/figure>\n\n\n\n

Gdy wybierzemy t\u0119 opcj\u0119, plik i18n<\/em> oraz pliki ze standardowej wersji aplikacji zostan\u0105 skopiowane do aplikacji z rozszerzeniem:<\/p>\n\n\n\n

\"Widok<\/a>
Ryc. 12 Widok plik\u00f3w z tekstami t\u0142umacze\u0144 w aplikacji SAP WEB IDE<\/figcaption><\/figure>\n\n\n\n

W\u00f3wczas mo\u017cemy doda\u0107 dodatkowe pole dla wprowadzonej przez nas kolumny.<\/p>\n\n\n\n

\"Fragment<\/a>
Ryc. 13 Fragment kodu w pliku i18n<\/em> odpowiedzialny za t\u0142umaczenie tekstu nowej kolumny<\/figcaption><\/figure>\n\n\n\n

Po dokonaniu zmian, pami\u0119tajmy o wykonaniu deploy\u2019a (\u201edeploy as a new app\u201d). W ten spos\u00f3b rozszerzona aplikacja pojawi si\u0119 jako nowa aplikacja BSP:<\/p>\n\n\n\n

\"Widok<\/a>
Ryc. 14 Widok aplikacji BSP po zlokalizowaniu w systemie SAP<\/figcaption><\/figure>\n\n\n\n

Aby uruchomi\u0107 rozszerzon\u0105 aplikacj\u0119, konieczne jest r\u00f3wnie\u017c odpowiednie skonfigurowanie mapowania kafelka oraz elementu docelowego (Tile and Target Mapping) w katalogu Fiori.<\/p>\n\n\n\n

\"Widok<\/a>
Ryc. 15 Widok do konfiguracji kafelk\u00f3w SAP Fiori Launchpad<\/figcaption><\/figure>\n\n\n\n

Maj\u0105c na uwadze, \u017ce w obiekcie semantycznym konieczne jest u\u017cycie odmiennej nazwy ni\u017c w przypadku aplikacji standardowej:<\/p>\n\n\n\n

\"Miejce<\/a>
Ryc. 16. Miejsce konfiguracji obiektu semantycznego rozszerzonej wersji aplikacji<\/figcaption><\/figure>\n\n\n\n

Podczas tworzenia mapowania docelowego (Target Mapping), adres URL powinien zawiera\u0107 nazw\u0119 nowej aplikacji BSP (mo\u017cna j\u0105 odnale\u017a\u0107 r\u00f3wnie\u017c za pomoc\u0105 transakcji SICF). Natomiast nazwa komponentu mo\u017ce by\u0107 odnaleziona w pliku Component.js<\/em> projektu rozszerzonego:<\/p>\n\n\n\n

\"Fragment<\/a>
Ryc. 17 Fragment kodu z pliku component.js wskazuj\u0105cy nazw\u0119 rozszerzonej aplikacji<\/figcaption><\/figure>\n\n\n\n

Aby przeprowadzi\u0107 test, pami\u0119tajmy o uruchomieniu kafelka z now\u0105 rozszerzon\u0105 aplikacj\u0105.<\/p>\n\n\n\n

Rozszerzenia standardowych us\u0142ug ODATA<\/strong><\/h2>\n\n\n\n

Zgodnie z metodologi\u0105 Sebastiana Gaera, dodawanie nowego pola w serwisie ODATA sk\u0142ada si\u0119 z trzech krok\u00f3w:<\/p>\n\n\n\n

    \n
  1. Najpierw rozszerzamy odpowiedni\u0105 struktur\u0119 ABAP DDIC poprzez komend\u0119 APPEND STRUCTURE.<\/li>\n\n\n\n
  2. Nast\u0119pnie rozszerzamy ODATA Entity w Gateway Model Providerze.<\/li>\n\n\n\n
  3. Na ko\u0144cu wype\u0142niamy dane rozszerzonego pola w Gateway Data Providerze.<\/li>\n<\/ol>\n\n\n\n

    W aplikacji \u201eRevise Payment Proposals\u201d istnieje mo\u017cliwo\u015b\u0107 dodawania \u201ecustom fields\u201d:<\/p>\n\n\n\n

    \"Fragment<\/a>
    Ryc. 18 Fragment dokumentacji aplikacji \u201eRevise Payment Proposals\u201d dotycz\u0105cy \u201ecustomer fields\u201d<\/figcaption><\/figure>\n\n\n\n

    Najpierw tworzymy i aktywujemy w\u0142asne pole w s\u0142owniku \u2013 ZZSGTXT.<\/p>\n\n\n\n

    \"Okienko
    Ryc. 19 Okienko wyboru \u201eData element\u201d w systemie SAP<\/figcaption><\/figure>\n\n\n\n

    Pole to dodajemy do struktury ze standardowej aplikacji:<\/p>\n\n\n\n

    \"Widok<\/a>
    Ryc. 20 Widok struktury ze wskazaniem na nowo dodane pole<\/figcaption><\/figure>\n\n\n\n

    W drugim kroku, pakiet \u201eODATA_REVISE_PAYMENT_PROPOSAL\u201d zawiera zar\u00f3wno klas\u0119 Model Provider, jak i Data Provider dla danego serwisu ODATA.<\/p>\n\n\n\n

    \"Widok<\/a>
    Ryc. 21 Widok dost\u0119pnych klas w aplikacji \u201eRevise Payment Proposal\u201d<\/figcaption><\/figure>\n\n\n\n

    Dodajemy nowe pole dla enitity \u201ePaytProposalInvoice\u201d.<\/p>\n\n\n\n

    \"Widok<\/a>
    Ryc. 22 Widok dost\u0119pnych Entity Sets w aplikacji<\/figcaption><\/figure>\n\n\n\n
    \"Widok
    Ryc. 23 Widok nowo dodanego property dla danego Entity Set \u201ePaytProposalInvoice\u201d<\/figcaption><\/figure>\n\n\n\n

    Przegenerowujemy obiekty typu run-time poprzez klikni\u0119cie przycisku:<\/p>\n\n\n\n

    \"Fragment<\/a>
    Ryc. 24 Fragment Interfejsu transakcji SEGW ze wskazaniem na przycisk regeneruj\u0105cego serwis<\/figcaption><\/figure>\n\n\n\n

    W rezultacie klasa MPC o nazwie CL_FAP_REVISE_PAYMENT_MPC dostaje kilka dodatkowych linii kodu:<\/p>\n\n\n\n

    \"Fragment<\/a>
    Ryc. 25 Fragment kodu z metody \u201eDEFINE_PAYTPROPOSALINVOICE\u201d wskazuj\u0105cy nowo dodane property<\/figcaption><\/figure>\n\n\n\n

    Nast\u0119pnie, aby w kroku trzecim wprowadzi\u0107 dane do nowego pola, musimy zlokalizowa\u0107 metod\u0119: CL_FAP_REVISE_PAYMENT_DPC_EXT->PAYTPROPOSALINVO_GET_ENTITYSET<\/em>.<\/p>\n\n\n\n

    Ta metoda jest ju\u017c zredefiniowana i na samym ko\u0144cu posiada rozszerzenie (enhancement), do kt\u00f3rego mo\u017cemy doda\u0107 kod pobieraj\u0105cy tekst z pola BSEG-SGTXT<\/em> i przekazuj\u0105cy go do tabeli et_entityset<\/em> (zawiera ona dane dla ca\u0142ego zbioru entity).<\/p>\n\n\n\n

    Na sam koniec, pami\u0119tajmy tak\u017ce o dodaniu nowej kolumny w widoku na front-endzie, aby dane z nowego pola prawid\u0142owo si\u0119 wy\u015bwietla\u0142y:<\/p>\n\n\n\n

    \"Fragment<\/a>
    Ryc. 26 Fragment kodu z widoku wskazuj\u0105cy nowododan\u0105 kolumn\u0119 do tabeli z rozszerzonym polem<\/figcaption><\/figure>\n\n\n\n
    \"oferty<\/a><\/figure>\n\n\n\n

    Podsumowanie<\/strong><\/h2>\n\n\n\n

    Serwis ODATA mo\u017ce by\u0107 modyfikowany r\u00f3wnie\u017c przy u\u017cyciu BAdI (Business add-ins), jednak te dodatki nie s\u0105 dost\u0119pne dla wszystkich standardowych aplikacji SAP Fiori. Widoki Fiori mog\u0105 by\u0107 r\u00f3wnie\u017c stworzone na poziomie back-endu za pomoc\u0105 \u2018CDS Views\u2019, a wtedy do rozszerze\u0144 aplikacji mo\u017cna u\u017cywa\u0107 adnotacji (annotations) po stronie back-endu i front-endu. O tym jednak opowiemy w oddzielnym artykule.<\/p>\n\n\n\n

    Podsumowuj\u0105c, rozszerzanie standardowych aplikacji Fiori jest mo\u017cliwe na wiele r\u00f3\u017cnych sposob\u00f3w i zale\u017c\u0105 one do\u015b\u0107 mocno od opcji jakie zosta\u0142y nam udost\u0119pnione przez firm\u0119 SAP. W skrajnych przypadkach mo\u017cemy po prostu wykona\u0107 rozszerzenie ca\u0142ej aplikacji.<\/p>\n\n\n\n

    ***<\/p>\n\n\n\n

    Je\u015bli interesuje Ci\u0119 tematyka SAP, zajrzyj koniecznie do innych artyku\u0142\u00f3w naszych ekspert\u00f3w.<\/a> <\/p>\n\n\n

    \n \n
    \n \n
    \n
    \n \n\n
    <\/div>\n <\/div>\n
    \n \n\n
    <\/div>\n <\/div>\n
    \n \n\n
    <\/div>\n <\/div>\n
    \n \n\n
    <\/div>\n <\/div>\n
    \n \n\n
    <\/div>\n <\/div>\n <\/div>\n \n
    \n
    \n \n\n
    <\/div>\n <\/div>\n
    \n \n\n
    <\/div>\n <\/div>\n
    \n \n\n
    <\/div>\n <\/div>\n
    \n \n\n
    <\/div>\n <\/div>\n
    \n \n\n
    <\/div>\n <\/div>\n <\/div>\n<\/div>\n \n\n
    \n 5\/5 ( votes: 6) <\/div>\n <\/div>\n","protected":false},"excerpt":{"rendered":"

    Aplikacje standardowe SAP Fiori to portfolio dost\u0119pnych aplikacji, w kt\u00f3rych na starcie otrzymujemy okre\u015blon\u0105 funkcjonalno\u015b\u0107. Bardzo cz\u0119sto s\u0105 w nich … Continued<\/a><\/p>\n","protected":false},"author":555,"featured_media":23704,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_editorskit_title_hidden":false,"_editorskit_reading_time":0,"_editorskit_is_block_options_detached":false,"_editorskit_block_options_position":"{}","inline_featured_image":false,"footnotes":""},"categories":[1316],"tags":[548,363,702],"class_list":["post-23647","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-development-na-miekko","tag-sap","tag-aplikacja","tag-sap-fiori"],"acf":[],"aioseo_notices":[],"republish_history":[],"featured_media_url":"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2023\/08\/Rozszerzenia-standard-Fiori-Apps.jpg","category_names":["Development na mi\u0119kko"],"_links":{"self":[{"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/posts\/23647"}],"collection":[{"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/users\/555"}],"replies":[{"embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/comments?post=23647"}],"version-history":[{"count":2,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/posts\/23647\/revisions"}],"predecessor-version":[{"id":29765,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/posts\/23647\/revisions\/29765"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/media\/23704"}],"wp:attachment":[{"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/media?parent=23647"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/categories?post=23647"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/tags?post=23647"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}