Falcon Space. Working with dashboards

Смотреть видео

View an example of Dashboard output

Managing dashboards

This is the output of 4 key indicators, as well as a set of panels for displaying information in tabular or graphical form. 
To create a control panel, do the following: 
through the snippet place on the page dashboard:
<div class="as-dashboard" data-code="code1"></div>


1.Create an element with the specified code code1 in the Dashboards section. Specify the correct permissions for users, roles
2.Create additional panels in the dashboard (link in the Dashboard table)
3.For the panel, specify the code (sets the name of stored procedures), Column(1-12  as part of the Bootstrap markup - how long does the column take).
Type (table, bar, line), Html (if specified, this markup will be displayed in the panel).  Height - в px, % or auto - hire of the pannel. 
4.Creating the necessary stored procedures. For counters this is a stored procedure like dashboard_{dashboardCode}_getCounters,
for table data (type table) - this is dashboard_{dashboardCode}_{panelCode}_getPanelTable, for bar and similar charts -
this is dashboard_{dashboardCode}_{panelCode}_GetPanelChart

Procedure GetCounters

CREATE PROCEDURE [dbo].[dashboard_forAdmin_getCounters]
       @username nvarchar(128)
AS
BEGIN
-- select 1
SELECT
       /*The output result is 4 lines in the specified format
          At the entrance - username */
	'Falcon' Title,
	'Falcon 2. Documentation' Tooltip,
	'fa fa-cogs' Icon,
	'2.0' Number,
	'' AdditionalNumber,
	'Developer documentation' DownTitle,
	'DownLink' DownLink -- the lower link is output if specified DownTitle

-- select 2
SELECT 'Name1' panel1, -- panel code
       'Name2' panel2
END
SELECT 1 returns output details based on numeric indicators.
SELECT 2 returns panel names (if you want to make them dynamic).

Procedure GetPanelTable

CREATE PROCEDURE [dbo].[dashboard_forAdmin_panel1_getPanelTable]
	@username nvarchar(128) -- at the entrance username
AS
BEGIN
      -- At the output, any table with fields (displayed as a table in the panel)
      SELECT isnull(name,'') as name,
             isnull(code,'') as code
      FROM as_trace
      ORDER BY id
END

Procedure GetPanelChart (bar and similar types)

CREATE PROCEDURE [dbo].[dashboard_forAdmin_panel2_getPanelChart]
	@username nvarchar(128) -- at the entrance username
AS
BEGIN
      SELECT 'bar' type, -- defining the type when displaying the graph
             'Graphic 1' title,
             260 width,
             260 height

     /*At the output 2 select
        First-chart settings(1 line)
        The second is data for the graph*/

      SELECT code Title,
             count(*) Value,
             '' Color
      FROM as_trace
      GROUP BY code
END

Procedure GetPanelChart (для line)

You can specify multiple charts in 1 panel.

CREATE PROCEDURE [dbo].[dashboard_forAdmin_panel2_getPanelChart]
	@username nvarchar(128) -- at the entrance username
AS
BEGIN
      -- output 2 requests select
      SELECT 'line' type, -- defining the type when displaying the graph
             'Graphic 1' title,
             260 width,
             260 height,
             '2,35,45,23' CommaLabels -- this is a metric on the abscissus axis (x-axis)

     /*To exit 2 select
        First-chart settings(1 line)
        The second is data for the graph*/

      SELECT 'Graphic 1' title,
             '1,4,5,12' Value,
             '' Color -- if the color is not set, a random value will be used
      UNION
      SELECT 'График 1' title,
             '12,4,2,48' Value,
             '' Color

END

Note

  1. You can cache panel results.to do this, specify a value greater than 0 in The caching in minutes panel field.
  2. If you need additional non-standard functionality on dashboards, you can do this via additional markup in the HTML panel field. 
  3. You can specify in the snippet data-hideDigits='1'and data-hidePanels= '1'to avoid displaying Indicators and Panels on the page. 
  4. You can insert forms, tables, and toolbars (flashLabel) in HTML panels.
  5. You can disable panels by setting the checkbox next to the panelDisabled.
  6. If the panel is single, it is displayed the entire width (without splitting into 2 columns). 
  7. You can include snippets of other components in the dashboard panel layout , i.e. display Tables, Forms, Resources, Metrics, etc.
  8. For tables, you can change the output of cells as for tables, i.e. use the prefixes color_, backcolor_, icon_, progressBar_, progressClass_.
  9. You Can add JS callback after loading the dashboard in the form as.dashboard.callbacks.{dashboardCode}_getItems in the page code.
  10. Graphics are Not clearly displayed on large screens? It is necessary to set the width and height
  11. in SELECT 1 in the dashboard SQL panel
$(function(){
     as.dashboard.callback.forAdmin_getItems = function(data){
        console.log('clGet',data)
     }
});

Panel type progress (progress in % by elements)

The panel query returns the model from Title, Value (in this order).
Value is a number from 0 to 100 (preferably an integer). 

Displayed as follows: 


How can I display an existing table or form in a dashboard? 

  • Specify the HTML table snippet in the markup. 
  • Implementing the table as usual. 
  • similarly, you can output other components, such as Resources, Chat, etc.

Table Documentation

Form Documentation

Falcon Space is a functional web development platform on a narrow stack MS SQL/Bootstrap. Falcon Space Gettting started
{sp-shortDemostandLinks}

SQL-tool for creating personal accounts on the site

The essence of the approach and the history of the creation of Falcon Space
Web platform for creating personal accounts

Falcon Space Platform

This is a reduction in the cost of ownership

at the expense of fewer people to support

This is a quick change

while using the program

This is a modern interface

full adaptation for mobile devices

MS SQL web applications. Affiliate program for developers and web studios

You can develop on your own or collaborate with us on Falcon Space web development using only SQL and HTML.
See examples with SQL code
Platform documentation
Working on MS SQL Server
Note