Uploaded image for project: 'PUBLIC - Liferay Portal Community Edition'
  1. PUBLIC - Liferay Portal Community Edition
  2. LPS-113315

Provide more flexibility to place and resize fragments and widgets in a page so that non-technical users can create dashboard like pages visually (4)




      When using Liferay WEM users may be managing a lot of data of different types and nature (e.g. pages, assets, users, etc. ).

      Dashboards are a popular way to display metrics and key performance indicators (KPIs), enabling them to be examined at a glance by all manner of users before further exploration via additional business analytics (BA) tools. Dashboards help improve decision making by revealing and communicating in-context insight into business performance, displaying KPIs or business metrics using intuitive visualization, including charts, dials, gauges and "traffic lights" that indicate the progress of KPIs toward defined targets.

      Liferay supports creating dashboard through both Widget pages and Dashboard pages. In the case of Widget pages, the layout of the dashboard is fixed, but developers can create custom layout templates with any complexity desired. With Dashboard pages, non-technical users creating a page can define any custom layout using a combination of the provided layout elements (Section, Row). However when creating a dashboard more flexibility to place fragments and widgets as well as resizing them is desired. 

      The goal of this epic is to provide additional mechanisms to empower non-technical users to create and edit dashboard-like layouts using the page editor. 

      The proposed solution is to provide out of the box a new layout component called "Grid Layout". When placed in a page, the user editing the page can use any existing fragment or widget anywhere inside the grid (which will have a "stick to grid" capability to facilitate this task) and then resize them. The "Grid Layout" can be combined with all pre-existing layout components as well as any other fragments, providing very powerful capabilities for creating dashboard-like pages.

      Main functions:

      1. Allow non-technical users to visually create dashboard-like pages
        1. With New layout element called "Grid Layout" that can be placed on a page. 
        2. Existing fragments and widgets can be added inside the "Grid Layout" in any position allowed by its grid.
        3. After adding them, fragments (and widgets if possible) can be resized manually to display better the content.
        4. Fragment/Widget developers will be able to specify a minimum width (for example in terms of bootstrap columns) so that the user cannot make it smaller.
        5. Fragments/Widgets can be allowed to automatically resize in one direction when dynamic data is added (min - max)
      2. Solution developers can leverage this solution too to automate the creation of dashboard-like pages
        1. Pages with "Grid Layout" created with the editor can also be exported into the page-definition JSON format, making them easily reusable and distributed along with the solution code.


      Grabación de pantalla 2021-04-21 a las 13.07.25.mov


        Issue Links



              support-lep@liferay.com SE Support
              tarik.demnati Tarik Demnati (Inactive)
              Wesley Gong Wesley Gong
              0 Vote for this issue
              1 Start watching this issue




                  Version Package