Apex 5 - 10.2016 ⇒ Zurück zur Übersicht Apex 5
Aufgabe: Auf der Startseite einer Applikation sollen Hinweise eingeblendet werden
So sieht das dann am Ende aus:
Region anlegen mit dem Typ „Classic Report“
SQL mit den richtigen Namen für die Ergebnisspalten anlegen:
select to_char(news_date,'dd.mm.yyyy') as ALERT_TITLE , news_message as ALERT_DESC , null as ALERT_ACTION from v_page_1_last_news
Region Attributes auswählen und unter „Layout/Apperance“ Template Type „Theme“ und Template „Alerts“ einstellen
Um die Farben und das Icon am Anfang der Meldung anzupassen folgende CSS Klassen in der Seite hinterlegt:
div.t-Alert-wrap { background-color: #e6f7ff; } div.t-Alert-icon { background-color: #ffcc00; } .t-Alert-icon:before { font-family: FontAwesome; top:0; left:-5px; padding-right:10px; font-size: 4rem; content: "\f11e"; } .t-Alert--horizontal .t-Alert-body{ font-size: 2.5rem; color: red; } .t-Alert--horizontal .t-Alert-title{ font-size: 1.6rem; font-weight: bold; }
Zuerst habe ich die passenden Klassen mit Hilfe des Theme Rollers und dem Developer Tool im Chrome Brower entworfen.
Im Globalen Template ist das dann aber etwas unpraktisch, ALLE anderen Alert werden dann auch so dargestellt und das passt bei der Anwendung dann nicht.
Daher den Style dann aus dem globalen Template als <style> Block im der „Page\CSS\Inline“ hinterlegt.
Interessant ist auch die weiteren Layout , die es erlauben statt einem tabellarischen Bericht eine Anzeige mit einzelnen Karten Elemente zu erzeugen. Diese lassen sich dann mit CSS Klassen wieder je nach Geschmack anpassen.
Entsprechend den Platzhaltern das SQL anpassen
SQL mit den richtigen Namen für die Ergebnisspalten anlegen:
select to_char(news_date,'dd.mm.yyyy') as CART_TITLE , news_message as CART_TEXT , null as CART_SUBTEXT from v_page_1_last_news
Mit den Template Optionen kann dann noch ausgewählt werden wieviele Karten nebeneinander dargestellt werden sollen
Kreise mit Wert darstellen, Beschriftung ist der Spaltenname
Entsprechend den Platzhaltern das SQL anpassen
SQL mit den richtigen Namen für die Ergebnisspalten anlegen:
SELECT to_char(news_date,'MMDD') AS Spalten_Name FROM v_page_1_last_news
font-awesome CSS Codes :