Successfully!

Error!

Dashboard Design Interface

  • Last update:  2021-03-09
  • I. Overview

    The FineReport dashboard design interface consists of three parts: dashboard body, components, and component settings. Components include parameter panes, blank blocks (Report block, Tab block, Absolute block), charts, widgets, and component library. Component settings include component list and component attributes. As shown below:

    1.png

    II. Dashboard Body

    The main body of the dashboard, form is equivalent to a blank design drawing board. By default, there is a body. After adding a parameter pane, the body and the parameter pane exist under the form at the same time.

    The body is a blank design drawing board under the form. Users can drag and drop components other than the "parameter pane" into the body. The body carries these components so that they will be displayed in a report page during preview.

    After adding components to the body, in the component list on the right, the added components will be displayed in the form of a body subdirectory. As shown below:

    2.png

    Click the body in the selected component list to set the attributes of body. For details, please refer to: Dashboard Framework Style.

    III. Dashboard Component

    Dashboard components include parameter panes, blank blocks (Report block, Tab block, Absolute block), charts, widgets, and component library.


    3.1 Parameter pane

    Similar to the normal report, the parameter pane of the dashboard is also used to carry the parameter widgets. The difference is that the parameter pane of the dashboard can be selected not to be added to the design interface, but the parameter pane of the normal report exists after it is created and cannot be deleted. . How to use it can refer to: Parameter Introduction.


    3.2 Blank block

    Blank blocks include Tab block, Absolute block and Report block.

    1) Tab block

    After adding a Tab block, a Tab block can have multiple Tab tabs. Each tab is equivalent to a blank canvas on which you can add widgets, charts and report block. See Tab block for specific usage.

    When previewing the dashboard, click on the title of the Tab block to jump to the corresponding Tab page, or you can set the Tab page to play in turn. Results as shown below:

    3.gif

    2) Absolute block

    After adding an Absolute block, the Absolute block is equivalent to a blank layout. You can add widgets, charts and report block on it, and you can adjust the layout. For details, see Absolute Layout Block.

    A single absolute block can be displayed as an area after adding a border and a background. When making a large screen, different indicator contents are often displayed in different areas, and each indicator area is rich in content. At this time, add a blank layout is very useful. As shown below:

    4.png

    3) Report block

    The report block component is equivalent to the report of the normal report. It can be made into a table, and other elements such as charts can also be inserted into the cells of the table. After adding, click "Edit" to enter the report block, and the specific usage is the same as that of normal report.

    Note 1: In the report block of the dashboard, the addition of widget is not supported in the cell.

    Note 2: It is not recommended to use text+chart in the report block. If it is a single chart, dragging the chart component directly into the report block is better than inserting the chart in the report block.


    3.3 Chart block

    The chart block can be added directly in the body, or in the Tab block and the Absolute block. The usage of all charts in the chart block is the same as that of normal report. For details, see Chart Introduction.


    3.4 Widget

    Widgets are components that filter data. They can be placed in the parameter pane as a parameter widget, or added to the body, Tab block, and Absolute block as a separate component. As shown below:

    5.png

    As a parameter widget placed in the parameter pane, the widget type supported by the dashboard is basically the same as the widget type supported by the normal report. See WidgetType Introduction for details.


    3.5 Component Library

    In order to allow users to design good-looking dashboards more quickly, Fanruan provides local reuse of components. Users can download their favorite components from Fanruan Market and apply them to dashboard design after installation. For details, see Component Reuse Plugin.

    After the downloaded components are installed, they will appear in the "Component Library", which supports multiple reuse. The components in the component library can be added to the body, Tab block and Absolute block by dragging and dropping, as shown in the following figure:

    6.png

    IV. Component settings

    4.1 Component list

    After adding a component to the dashboard, the component name will be displayed in the component list on the right. Click the component name to select the component. As shown below:

    7.png

    In the toolbar above the component list, there are tool buttons such as cut, copy, paste and delete. After selecting the component, you can perform corresponding operations. As shown below:

    If the tool icon is grayed out, it means that the tool is currently unavailable. Tools such as "Place on the bottom" and "Place on the top" are only supported in the absolute body layout, and will be grayed out under the body adaptive layout.

    8.png

    Note: In the body adaptive layout, in the component list on the right, multiple components are not supported, so batch operations on components, such as batch cutting and batch deletion, are not supported.


    4.2 Component properties

    After selecting the component, in the component settings on the right, you can modify the component name, set the component style, adjust the component size, add events for the component and adapt the component to the mobile terminal. As shown below:

    9.png

    Attachment List


    Theme: Dashboard
    Already the First
    Already the Last
    • Helpful
    • Not helpful
    • Only read

    Doc Feedback