My Requirement
I came across the requirement to have a simple, "live" report which brings data from BW and CSV data sources and is extendable in simple manner. In addition, I want to print it out and take with me as PDF.
The Idea
This pointed me out to following (technical) requirements.
1. I want to have a reduced complexity in terms of tabs, screens etc
2. it must be fitting screen on big and smaller devices
3. it should be modular for better extensibility
4. with one click it must be printable
I have taken a look on the components which are available in the scn community package and I have used the M mode for the design.
The Implementation
As layout I have taken standard panels which are positioned by flow layouter (as in Responsive Layout with Flow Layouter SDK) (it can be also made by any other layouter component, eg. Mike's Design Studio 1.6 SDK - Component Layouter). With this, the layout is re-arranging dependent on the screen size.
The layout in general is quite flat, header (Fiori App Header component), small buttons on left and right side (Action Sheet Button component), and then the flowing layout with panels in the middle.
How Does It Work?
PDF,
keep in mind one goal was to have easy PDF export - this is why the size of the panels is as it is. On Left side, you can find a button with action "export to PDF", then, using A4 landscape, the panels are fitting exactly on each page one. So, no effort of getting the data out.
* see function printStatusReport (there are panels listed for print).
Excel,
Another function is to get the data into Excel, so there is a invisible panel, including a crosstab (positioned in the panel, but if you want to make it invisible, do not turn off the visibility, position it with LEFT=-1000 or so. With this, you can export and close the dialog.
Reordering
Only what you have to do, is to add new created panel into the array, method SCRIPT_STARTUP->fillCollectionsPanels().
Visibility
There is another method in the global scripts which is handling visibility of the panels. The method is just looping on the registered panels, adding it as items into the action sheet button (dynamically) and also assigning icon depending on visible state.
KPI Tiles
Those are getting data on startup, but you can also make it bindable directly to the data source, up to you.
Filters
On the right side, there are filters - the most interesting one is the "generic filter" which shows Filter Panel, based on generic ACTION KEY in the component. The corresponding method is in the global scripts
Extensibility?
On this infrastructure, if you want to extend the report, you need only to create new panel, register in 2 places and add new data source. With the automatic visibility switch, you do not need to extend any buttons any more. The layout is flow layout, so you get this panel at the bottom and the report will be simply longer.
Detail Information
Whenever you need some detailed information, you can always add some "dialog" with this part, similar to the export dialog and jump from the main report.
The working App (based on dummy CSV data set)
I hope some of you will find it inspiring.
Closing Words
This app was build with SCN SDK components, you need to install in order to run it. See SCN Design Studio SDK Development Community.
BUT, the idea is (implementable to some extend) w/o SCN extensions.
- SAP Managed Tags:
1 Comment
