Schritt-für-Schritt Anleitung für einen schnellen Einstieg in die S10 Entwicklung. Ziel ist eine einfache S10 Anwendung zur Anzeige von Informationen zu einer eingegebenen Materialnummer:
Als Ausgangsbasis generieren wir mit den S10 Utilities eine Anwendung, die dann erweitert wird:
Der Quickstart-Guide ist in folgende Schritte unterteilt:
- Generieren einer S10 Anwendung auf Basis der Tabelle MARA
- Anpassen der Konfiguration der Anwendung und des Anmeldebilds
- Erweitern der HTML-Views der generierten Anwendung
- Erweitern der ABAP-Klassen der generierten Anwendung
-
Das S10 Framework wurde bereits im SAP-System installiert
(Details im Kapitel "Serverinstallation")
-
Die erforderlichen Berechtigungen sind vorhanden
(Details im Kapitel "Berechtigungen")
-
Die Entwicklungsumgebung wurde eingerichtet
(Details im Kapitel Entwicklungsumgebung")
Starten Sie zunächst die Transaktion /S10/UTIL und wählen Sie den Reiter "Transaktion generieren".
Da wir Materialstammdaten anzeigen möchten, geben wir die Tabelle MARA an, selektieren den Transaktionstyp "Anzeigen" und wählen bei den Feldern zunächst in diesem Beispiel nur die Materialnummer aus. Da wir neben der Materialnummer auch automatisch die Beschreibung anzeigen möchten, selektieren wir den Eintrag in der Spalte "Text".
Durch den Button "Sichern und generieren" werden nun alle Anwendungsteile im vorher angegebenen Verzeichnis gespeichert sowie das ABAP-Programm generiert.
Um die Anwendung zu testen, muss diese noch in das SAP-MIME-Repository übertragen werden. Das lokale Entwickeln und Testen ist ebenfalls möglich und wird im Kapitel "Lokale Entwicklung" genauer beschrieben. Ganze Verzeichnisstrukturen können Sie mit dem SAP-Programm "BSP_UPDATE_MIMEREPOS" (Transaktion SE38) übertragen:
Sie können nun die Anwendung einmal testen, in dem Sie die entsprechende Adresse im Browser eingeben. Ist alles richtig konfiguriert, sollte das Einstiegsbild der generierten Anwendung erscheinen:
Das S10 Framework kümmert sich um die Anmeldung am SAP-System, benötigt dafür aber einige Informationen.
In diesem Beispiel gibt der Benutzer seinen Benutzernamen sowie Passwort an, die übrigen Parameter sind direkt im Coding der HTML-Seite angegeben, z.B. der Mandant. Die HTML Seite für die Anmeldung befindet sich immer an folgender Stelle im MIME-Repository und muss dort angepasst werden:
Name der S10 Anwendung/classes/user/views.xy
(wobei xy für den Sprachenschlüssel der Anmeldesprache steht, z.B. views.de für Deutsch):
Über Rechtsklick auf die Datei im MIME-Repository können Sie die Datei ändern bzw. herunterladen.
Prinzipiell können Sie die Seite ändern und gestalten, wie Sie möchten. Das S10 Generierungstool fügt für jede generierte Tabelle einen Eintrag in der Dropdown-Liste hinzu, der Wert ist dann auch gleichzeitig der aufgerufene ABAP-Programmname. Sie können die einzelnen Teile später zu einer einzelnen Anwendung zusammenfügen und einen festen Programmnamen angeben.
Anpassen der Parameter in der JavaScript Methode "dologon", Details dazu in der Dokumentation zu "S10Logon()":
// set logon parameters and S10 start configuration; var logon_client = '100'; var logon_language = document.getElementById('language').value; var classname = "main"; var progname = document.getElementById('tables').value; S10Logon(logon_client, logon_user, logon_password, logon_language, classname, progname);
Das Generierungstool hat eine ablauffähige Anwendung generiert, die eine Materialauswahl sowie zugehörige Detailansicht anbietet.
In der Regel möchte man jedoch weitere Felder anzeigen, die nicht unbedingt in der angegebenen Tabelle direkt enthalten sind. Zwar werden vom Generierungstool auch Views bzw. CDS-Views unterstützt, wir können jedoch die notwendigen Felder auch selbst hinzufügen und die Daten selbst in einer ABAP-Methode besorgen. In diesem Beispiel soll der Preis des Materials angezeigt werden. Zudem möchten wir den aktuellen Mandanten in der Titelleiste einblenden.
Wir erweitern zunächst den Headerbereich, dieser befindet sich in dem generierten View "mara_manger.start.html":
<div class="headerarea" style="width: 100%; padding: 10px;"> <!--show current client-->
<span class="output" style="margin-left: 10px;">Mandant</span> <span class="output" name="mandt"></span> <span class="output" name="mtext" style="margin-left: 20px;"></span> </div>
Wir haben also zwei S10-Felder eingefügt, die über name= mit einer ABAP-Klasse verbunden werden: mandt und mtext.
Das gleiche machen wir mit der Detailansicht zum Material (mara_manager.displayhead.html) und fügen hier drei weitere Felder ein:
<!-- header fields --> <div style="background-color: lightgray"> <div class="infoblock" style="width:400px; height:50px;"> <label class="label output" for="mymara.matnr" name="mymara.matnr"></label> <br> <span class='output' name="mymara.matnr"></span> <span class='output' name='mymara.matnr@text'></span> </div> <!-- Outputfield for price --> <div class="infoblock" style="width:400px; height:50px;"> <label class='label' name="mymara.price@label"></label> <br> <span class="output" name="mymara.price"></span> <span class="output" name="mymara.pricewaers"></span> </div> </div>
Wir verwenden ein eigenes Objekt "mymara", das in der ABAP-Klasse definiert wird. Die Felder gehören also zu dieser Klasse, nicht der aktiven Anwendungsklasse. Die Bezeichnung des Feldes "price" können wir vom S10 Framework automatisch durch den Zusatz @label ermitteln lassen.
Um die im HTML-View angegebenen Felder mit Daten zu versorgen, müssen diese in der zugehörigen ABAP-Klasse definiert und die Daten gelesen werden, falls dies nicht vom S10 Framework automatisch geschieht (z.B. bei @label oder @text Anweisungen). Wir erweitern daher zunächst die Klasse "mara_manager" um die Felder mandt und mtext, die den aktuellen Mandanten sowie Beschreibung in der Titelzeile anzeigen sollen:
class mara_manager definition inheriting from /s10/any. public section. * table fields for list view, plus key fields data: new_matnr type mara-matnr, search_matnr type mara-matnr, mymara type ref to mara_detail, mandt type t000-mandt, mtext type t000-mtext.
Die Daten können wir nun in einer Methode, die beim Start der Anwendung aufgerufen wird, lesen:
class mara_manager implementation. * start display method start. create object mymara. * read client text and city from client table T000 select single mandt mtext into (mandt,mtext) from t000 where mandt = sy-mandt. s10nextscreen( 'start'). endmethod.
Dies sorgt jedoch dafür, dass jedes Mal, wenn der Startscreen aufgerufen wird, eine Datenbankabfrage durchgeführt wird.
Besser ist daher, eine build-Methode zu verwenden, so dass Daten nicht unnötig oft gelesen werden bzw. auch nur, falls sie vom Front-End tatsächlich angezeigt werden sollen. Der entsprechende S10-Mechanismus ist in der Dokumentation unter "build-Methoden" ausführlicher beschrieben. Wir werden dies für die zusätzlich eingefügten Felder des Materials jedoch tun.
Zunächst deklarieren wir die neuen Felder, wobei zusätzlich durch das Feld "unit_price" eine Verbindung definiert wird zwischen dem Preis und der zugehörigen Einheit. Dadurch ist das S10 Framework in der Lage, das Feld entsprechend der Einheit zu formatieren, Details sind in der Dokumentation unter " s10getuservalue()" beschrieben:
class mara_detail definition inheriting from /s10/any. public section. * table fields for detail view, plus key fields data: matnr type mara-matnr, " Material using Text price type konp-kbetr, pricewaers type konp-konwa, priceunit type konp-kmein, unit_price type string value 'pricewaers'. methods: build_price importing matnr type mara-matnr exporting price type konp-kbetr pricewaers type konp-konwa priceunit type konp-kmein.
Die Methode "build_price" hat als Importing-Parameter die Materialnummer (MATNR), das heißt, sie wird aufgerufen, sobald sich die Materialnummer ändert und ist folgendermaßen implementiert:
method build_price. price = 0. * read condition table for standard price PPR0 and amount=1 select single konp~kbetr konp~konwa konp~kmein into (price,pricewaers,priceunit) from konp join a304 on a304~knumh = konp~knumh where a304~matnr = matnr and konp~kappl = 'V' and konp~kschl = 'PPR0' and konp~kpein = 1. endmethod.
Komponente S10 Framework