Statt die Vorgangstabelle direkt in den Detailbereich der Grundliste einzublenden, enthält der aufgeklappte Detailbereich eine Drucktaste "Vorgänge anzeigen", mit der sich die Vorgänge separat anzeigen lassen.

Dem Benutzer stehen nun auch in der Vorgangstabelle alle S10-Möglichkeiten zur Selektion der Daten und zur Layoutkonfiguration zur Verfügung.

Auch die Sortierung nach einzelnen Spalten und das Auf- und Zuklappen des Filterbereichs funktionieren genau wie in der Grundliste:

Ein Klick auf den Rückwärtspfeil führt zurück in die Grundliste, und zwar genau an die Stelle, von der wir gestartet waren. Der gesamte Zustand der Grundliste, einschließlich der angewendeten Filter, Sortierung und aufgeklappten Details, bleibt unverändert.

Nun zur Implementierung. Wir bauen die Vorgangstabelle nicht direkt in das ABAP-Programm für die Grundliste ein, sondern verwenden dazu ein separates ABAP-Programm. Dies ist technisch anspruchsvoller, bietet jedoch folgende Vorteile:

• Wir können die Vorgangstabelle ebenfalls mit dem S10 Generator erzeugen.
• Die Implementierung der Vorgangstabelle ist unabhängig von der Implementierung der Grundliste.
• Die Vorgangstabelle kann auch aus anderen S10-Anwendungen heraus aufgerufen werden.

Vorgehensweise:

1. Die Anzeige der Vorgänge mit Transaktion /s10/util als separate Liste generieren

Wir verwenden als Ausgangstabelle die Tabelle AFVC der Vorgänge.

Bitte dabei beachten:

• Eher zu viele Spalten als zu wenige aufnehmen, denn durch die Layoutdefinition können wir die Anzeige später auf die benötigten Spalten einschränken. Analog bei den Filtern.
• Später sollen nur die Vorgänge eines einzelnen Auftrags angezeigt werden. Im Prinzip wäre daher die Auftragsnummer als Selektion sinnvoll, hier gibt es aber eine kleine Schwierigkeit: Die Auftragsnummer ist von SAP nicht direkt in der Vorgangstabelle AFVC abgelegt. Stattdessen gibt es in der AFVC eine "Plannummer" AUFPL, die über eine separate Tabelle dem Auftrag zugeordnet ist (Tabelle AFKO). WIr nehmen daher die Plannummer als Filterkriterium auf.  Es genügt dabei, sie als unsichtbare Selektion zu definieren, die dem Benutzer nicht angezeigt wird, aber später intern zur Selektion genutzt wird:

2. In der Detailanzeige der Auftragsliste eine Drucktaste "Vorgänge anzeigen" aufnehmen (HTML)

 <div class="infoblock" style="padding: 4px;"
            data-s10title="Link Vorgangstabelle" name="display_items">

    <button type="button" class="button"
            onclick="S10Apply('display_items');">
                Vorgänge anzeigen
    </button>
</div>

Der Name "display_items" des "infoblock" ist dabei beliebig. Durch die onclick-Angabe der Drucktaste rufen wir die Methode "display_items" auf, in der wir im nächsten Schritt die Anzeige der Vorgangstabelle aufrufen werden.

Tipp: Die direkte Ausgabe der Vorgangsliste aus Tutorial 10 in der HTML-Datei belassen, sodass später in der Layoutdefinition entschieden werden kann, ob die Vorgänge direkt im Detailbereich angezeigt oder über die Drucktaste eingeblendet werden. Optional können dann auch sowohl die Drucktaste als auch die direkte Anzeige im Layout eingeschaltet werden, wobei die unmittelbar angezeigte Vorgangstabelle dazu am besten auf eine Maximalhöhe, z.B. 200px, beschränkt wird (style='max-heigth:200px' im "infoblock" in HTML). Der Benutzer hat dann eine kleine scrollbare Vorabanzeige und kann für die volle Anzeige die Drucktaste verwenden:

3. In der Konfiguration der Detailsicht den "Link Vorgangstabelle" statt "Vorgangstabelle" auswählen  (oder beide, siehe Tipp oben)

4. In der ABAP-Klasse der Grundliste eine Methode "display_items" zum Aufruf der Vorgangsliste implementieren

Durch die Drucktaste "Vorgänge anzeigen" wird die Methode "display_items" der Grundliste (Klasse "viaufkst_manager") aufgerufen. Dort implementieren wir nun den Aufruf der Vorgangstabelle:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18

* method to display items in a separate screen
  method display_items.

* read current entry in tabviaufk
    read table tabviaufk
        index s10contextinfo( )->rownumber
          assigning field-symbol(<viaufk>).

* create object to display the items
    data:  iw_order_items type ref to /s10/any.
    create object iw_order_items type ('\PROGRAM=ZZS10_IW_ORDER_ITEMS\CLASS=MAIN').

* call up method to display items, pass order number
   call method  iw_order_items->('DISPLAY')
      exporting
        aufnr = <viaufk>->aufnr.

  endmethod.

    Erläuterungen:

• Zeile 5: Wir besorgen uns über s10contextinfo() aus der HTML-Anzeige die Nummer der aktuellen Zeile in der Grundtabelle "tabviaufk", damit wir später in Zeile 16  auf die aktuelle Auftragsnummer mit <viaufk>->aufnr zugreifen können. Denn die zuletzt aufgeklappte Auftragszeile ist nicht unbedingt die Zeile, zu der der Benutzer die Vorgangsliste abruft: er kann ja die Detailsicht für mehrere Aufträge öffnen und später in einer der Detailsichten auf "Vorgänge anzeigen" klicken.
• Zeile 10: Eine Objektreferenz "iw_order_items" wird angelegt. Als Klasse geben wir /s10/any an - was die Oberklasse des zu erzeugenden Objekts ist - da die eigentliche Klasse in einem anderen Programm definiert ist. Die angegebene Notation ist die Standard-ABAP-Notation für Klassen in externen Programmen.
• Zeile 11: Hier wird das Object "iw_orderitems" erzeugt. Das Programm heisst "ZZS10_IW_ORDER_ITEMS", das wir als Kopie der generierten Vorgangsliste ablegen (siehe nächster Punkt), die Klasse ist "MAIN".
• Zeile 14: Wir rufen die Methode 'display' des erzeugten Objekts auf.

Bei häufiger genutzen Objekten ist es praktisch, die externe Klasse (bei uns also die Klasse zur  Anzeige der Auftragsvorgänge) in der ABAP Klassenbibliothek SE24 zu definieren, zum Beispiel unter dem Namen /ABC/IW_DISPLAY_ORDERITEMS wobei /ABC/ Ihr Namensraum wäre. Das Anlegen des Objekts und der Methodenaufruf lassen sich dann einfacher formulieren:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

* method to display items in a separate screen
  method display_items.

* read current entry in tabviaufk
    read table tabviaufk
        index s10contextinfo( )->rownumber
          assigning field-symbol(<viaufk>).

* create object to display the items
    data(iw_order_items) = new /abc/iw_display_orderitems( ).

* call up method to display items, pass order number
    iw_order_items->display( <viaufk>->aufnr ).

endmethod.

5.  In der ABAP-Klasse "main" der Vorgangsliste eine Methode "display" zur Anzeige der Vorgänge implementieren

Kopieren Sie das für die Anzeige der Vorgänge generierte ABAP-Programm, z.B. "ZZS10_AFVC", am besten zunächst unter einem anderen Namen, denn sonst überschreibt man sich bei einer erneuten Generierung leicht das Programm, und die eingefügten Methoden sind wieder weg. Wir haben hier für unser Beispiel den Programmnamen "ZZS10_IW_ORDER_ITEMS" gewählt.

DIe Deklaration der neuen Methode "display" erfolgt in der Klasse "main":

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

* main class for this application
class main definition inheriting from /s10/any.

  public section.

    data: my_afvc_manager type ref to afvc_manager.

    methods:
      logon,
      display
        importing
          aufnr type aufk-aufnr.

endclass.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

* display item table in popup
  method display.

*  create manager object
    create object my_afvc_manager.

* set defaults
    my_afvc_manager->set_defaults( ).

* set aufnr
     my_afvc_manager->header_aufnr = aufnr.


* determine aufpl from afko
    select single aufpl from afko into my_afvc_manager->search_aufpl
        where aufnr = aufnr.

* not found ?
    if sy-subrc ne 0.
      s10errormessage( |Invalid order number specified when calling ZZS10_IW_ORDER_ITEMS->DISPLAY: | && aufnr ).
    endif.


* start display
    my_afvc_manager->s10dialog( 'display_items').

  endmethod.

Erläuterungen:

• Zeilen 5 bis 8: Identisch mit der bereits generierten "logon"-Methode. Durch set_defaults(  ) werden eventuelle Filter-Festwerte eingetragen, falls sie in der Generierungs-Konfiguration gesetzt wurden.
• Zeile 11: Wir übertragen die Auftragsnummer in ein Attribut der Klasse, um später im Kopf der Vorgangsliste die Auftragsnummer anzeigen zu können:
  

class afvc_manager definition inheriting from /s10/any.

  public section.

* header data
   data: header_aufnr type aufk-aufnr.
...

• Zeile 15: Hier lesen wir die Plannummer "AUFPL" zum Auftrag aus der Tabelle "AFKO". Falls der Auftrag nicht existiert, erfolgt eine Fehlermeldung. Die Plannummer wird in das generierte Selektionsfeld "search_aufpl" gesetzt.
• Zeile 25: Nun rufen wir die HTML-Seite "display_items" im Dialog-Modus auf, das heißt die Grundliste bleibt erhalten und wird nach Rückkehr aus der Vorgangsanzeige wieder aktiv. Die HTML-Seite "display_items müssen wir noch anlegen (Schritt 6).

Wenn wir den Ablauf nun testen, erfolgt eine Fehlermeldung, da die HTML-Datei noch nicht existiert:

6.  Die HTML-Datei "display_items.html" anlegen

Dazu kopieren wir den Ordner "afvc_manager" aus dem generierten Projektordner der Vorgangsanzeige in unser eigenes Projekt. Anschliessend benennen wir dort die HTML-Datei "list.html" in "display_items.html" um. Damit funktioniert die Anzeige schon:

Allerdings noch nicht die Rückkehr in die Grundliste. Wir müssen dazu noch im Kopf der HTML-Seite  den "Zurück"-Button statt "Beenden" einfügen und ergänzen die Anzeige der Auftragsnummer. Der Beginn der HTML-Datei "display_items.html" ist dann wie folgt:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link rel='stylesheet' type='text/css' href='../../../style/s10.style.css'>
    <link rel='stylesheet' type='text/css' href='../../../style/custom.style.css'>
    <script src='../../synactiveS10/synactiveS10.java.js'></script>

    <title>Vorgänge</title>
</head>
<body style="width: 100%; margin: 0px; padding: 0px;" onload='init();' class="colorscheme9">

    <div class="toolbar">

        <button type="button" class="button back" onclick="S10Apply('exit_display_items');">
            &#9664;&#xFE0E;
        </button>

        <b>Vorgänge zum Auftrag <span class='output' name="header_aufnr"></span></b>

        <span style="float: right;" class="tablefilterinfo"></span>

    </div>

    <!-- filter -->
    <div class="tablefilteractive">
...

Erläuterungen zur HTML-Datei:

• Zeile 15: Für die "Zurück" Taste wird das Unicode-Symbol &#9664 verwendet. Das anschließende &#xFE0E ist der sogenannte "text presentation selector"; er legt fest, dass das Symbol als Text, nicht als "emoji" angezeigt werden soll, was sonst unter iOS der Fall wäre. DIe CSS-Zusatzklasse "back" ist in "style.css" definiert; sie zeigt den Button ohne Rahmen mit transparentem Hintergrund an.
  
  
• Zeile 19: Hier wird die Klassenvariable "header_aufnr" in den Text eingefügt.

Nun fehlt nur noch die Implementierung der Routine "exit_display_items" zur Rückkehr von den Vorgängen in die Auftragsliste:

7.  In der ABAP-Klasse "afvc_manager" der Vorgangsliste eine Methode "exit_display_items" zur Rückkehr in die Grundliste implementieren

 Dazu genügt der Aufruf von s10exitdialog( ):

1
2
3
4

* return from itemdisplay
  method exit_display_items.
    s10exitdialog( ).
  endmethod.

Damit ist unsere Implementierung der separat angezeigten Vorgangsliste komplett.