Doc: add more documentation

shzlw · Jun 7, 2019 · bce38c6 · bce38c6
1 parent f1b8dcf
commit bce38c6
Show file tree

Hide file tree

Showing 38 changed files with 105 additions and 25 deletions.
diff --git a/db/schema-sqlite.sql b/db/schema-sqlite.sql
@@ -1,4 +1,5 @@
 
+-- v0.5.0
 DROP TABLE IF EXISTS p_group_report;
 DROP TABLE IF EXISTS p_component;
 DROP TABLE IF EXISTS p_report;

diff --git a/docs/_images/screenshots/apikey.jpg b/docs/_images/screenshots/apikey.jpg
diff --git a/docs/_images/screenshots/apikey2.jpg b/docs/_images/screenshots/apikey2.jpg
diff --git a/docs/_images/screenshots/autorefresh.jpg b/docs/_images/screenshots/autorefresh.jpg
diff --git a/docs/_images/screenshots/drillthrough1.jpg b/docs/_images/screenshots/drillthrough1.jpg
diff --git a/docs/_images/screenshots/drillthrough2.jpg b/docs/_images/screenshots/drillthrough2.jpg
diff --git a/docs/_images/screenshots/drillthrough3.jpg b/docs/_images/screenshots/drillthrough3.jpg
diff --git a/docs/_images/screenshots/drillthrough4.jpg b/docs/_images/screenshots/drillthrough4.jpg
diff --git a/docs/_images/screenshots/ds1.jpg b/docs/_images/screenshots/ds1.jpg
diff --git a/docs/_images/screenshots/ds2.jpg b/docs/_images/screenshots/ds2.jpg
diff --git a/docs/_images/screenshots/fullscreen.jpg b/docs/_images/screenshots/fullscreen.jpg
diff --git a/docs/_images/screenshots/group1.jpg b/docs/_images/screenshots/group1.jpg
diff --git a/docs/_images/screenshots/group2.jpg b/docs/_images/screenshots/group2.jpg
diff --git a/docs/_images/screenshots/login.jpg b/docs/_images/screenshots/login.jpg
diff --git a/docs/_images/screenshots/login2.jpg b/docs/_images/screenshots/login2.jpg
diff --git a/docs/_images/screenshots/login3.jpg b/docs/_images/screenshots/login3.jpg
diff --git a/docs/_images/screenshots/report1.jpg b/docs/_images/screenshots/report1.jpg
diff --git a/docs/_images/screenshots/report10.jpg b/docs/_images/screenshots/report10.jpg
diff --git a/docs/_images/screenshots/report11.jpg b/docs/_images/screenshots/report11.jpg
diff --git a/docs/_images/screenshots/report12.jpg b/docs/_images/screenshots/report12.jpg
diff --git a/docs/_images/screenshots/report13.jpg b/docs/_images/screenshots/report13.jpg
diff --git a/docs/_images/screenshots/report14.jpg b/docs/_images/screenshots/report14.jpg
diff --git a/docs/_images/screenshots/report2.jpg b/docs/_images/screenshots/report2.jpg
diff --git a/docs/_images/screenshots/report3.jpg b/docs/_images/screenshots/report3.jpg
diff --git a/docs/_images/screenshots/report4.jpg b/docs/_images/screenshots/report4.jpg
diff --git a/docs/_images/screenshots/report4_1.jpg b/docs/_images/screenshots/report4_1.jpg
diff --git a/docs/_images/screenshots/report5.jpg b/docs/_images/screenshots/report5.jpg
diff --git a/docs/_images/screenshots/report6.jpg b/docs/_images/screenshots/report6.jpg
diff --git a/docs/_images/screenshots/report7.jpg b/docs/_images/screenshots/report7.jpg
diff --git a/docs/_images/screenshots/report8.jpg b/docs/_images/screenshots/report8.jpg
diff --git a/docs/_images/screenshots/report9.jpg b/docs/_images/screenshots/report9.jpg
diff --git a/docs/_images/screenshots/user1.jpg b/docs/_images/screenshots/user1.jpg
diff --git a/docs/_images/screenshots/user2.jpg b/docs/_images/screenshots/user2.jpg
diff --git a/docs/_images/screenshots/user3.jpg b/docs/_images/screenshots/user3.jpg
diff --git a/docs/_images/screenshots/user4.jpg b/docs/_images/screenshots/user4.jpg
diff --git a/docs/quick-start.md b/docs/quick-start.md
@@ -1,59 +1,121 @@
 # Quick Start
 
 ## First time login
-  Use the default login credentials
-    username: admin
-    password: adminadmin
 
-  *screenshot
+Open  http://localhost:6688/poli/login in chrome.
 
-  Enter a new password and login again.
+![login](_images/screenshots/login.jpg)
 
-  *screenshot
+Use the default login credentials.
+
+* username: admin
+* password: adminadmin
+
+![login2](_images/screenshots/login2.jpg)
+
+Enter a new password and login again.
+
+![login3](_images/screenshots/login3.jpg)
 
 ## Create a datasource
-For example, PostgreSQL
 
-    class name: org.postgresql.Driver 
-    usename: postgres
-    url: jdbc:postgresql://localhost/test
+Enter the data source connection information.
+
+![ds1](_images/screenshots/ds1.jpg)
+
+Click ping button to test the connection.
+
+![ds2](_images/screenshots/ds2.jpg)
+
+## Create a report
+
+Click report tab and be ready to create the first report!
 
-*screenshot
+![report1](_images/screenshots/report1.jpg)
 
-## Create a dashboard
+Enter the report name.
+
+![report2](_images/screenshots/report2.jpg)
+
+Click save button. A new report is created!
+
+![report3](_images/screenshots/report3.jpg)
 
-*screenshot
 
 create table transaction (
 	create_date TIMESTAMP,
 	category varchar(100),
 	amount NUMERIC(10, 2)
 )
 
-## Create a static widget
+## Create a static component
+
+Let's create a text box here. Click the edit button to enter report edit mode.
+
+![report4](_images/screenshots/report4.jpg)
+
+Click new component button. Select static and text. Enter the value under config tab.
+
+![report4_1](_images/screenshots/report4_1.jpg)
+
+Click save button. A new text box is created!
 
-Image
+![report5](_images/screenshots/report5.jpg)
 
-*screenshot
+## Create a chart component
 
-## Create a chart widget
+Let's create a pie chart here. Click new component button. Select chart and pie.
 
-Pie
+![report6](_images/screenshots/report6.jpg)
 
-SELECT category, SUM(amount) FROM transaction GROUP BY category;
+Choose a data source and enter a query.
 
-## Create a filter widget
+![report7](_images/screenshots/report7.jpg)
 
-Slicer
+Go to config tab and select the key vand value for pie chart.
 
-SELECT category FROM transaction GROUP BY category;
+![report8](_images/screenshots/report8.jpg)
+
+Click save button. A new pie chart is created!
+
+![report9](_images/screenshots/report9.jpg)
+
+## Create a filter component
+
+Let's create a slicer here. Click new component button. Select filter and slicer. Choose a data source and enter a query.
+
+![report10](_images/screenshots/report10.jpg)
+
+Go to config tab and assign a value to the query parameter.
+
+![report11](_images/screenshots/report11.jpg)
+
+Click save button. A new sclier is created!
+
+![report12](_images/screenshots/report12.jpg)
+
+Now it is time to link the slicer and pie chart together. Edit the pie chart query here to include the query parameter.
+
+![report13](_images/screenshots/report13.jpg)
+
+Save the report. Select the check box in slicer and click apply filters button. The data in pie chart is being filtered! 
+
+![report14](_images/screenshots/report14.jpg)
 
 ## Create a group
 
-Regular
+![group1](_images/screenshots/group1.jpg)
+
+![group2](_images/screenshots/group2.jpg)
 
 ## Create a user
 
+![user1](_images/screenshots/user2.jpg)
+
+![user2](_images/screenshots/user2.jpg)
+
+## View the report
 
+![user3](_images/screenshots/user3.jpg)
 
-## View the dashboard
+![user4](_images/screenshots/user4.jpg)
diff --git a/docs/report-component.md b/docs/report-component.md
@@ -93,6 +93,15 @@ WHERE 1 = 1
 
 Navigate from one widget to another Report with a query parameter being passed along.
 
+![drillthrough1](_images/screenshots/drillthrough1.jpg)
+
+![drillthrough2](_images/screenshots/drillthrough2.jpg)
+
+![drillthrough3](_images/screenshots/drillthrough3.jpg)
+
+![drillthrough4](_images/screenshots/drillthrough4.jpg)
+
+
 > If this component has drill through defined, there will be a --> icon on the title bar.
 
 

diff --git a/docs/report.md b/docs/report.md
@@ -16,17 +16,25 @@ Reports are built with components in Poli that provide insights from the data th
 
 Enable report auto refresh. The refresh rate is in seconds. This will query and refresh the chart data every X seconds. 
 
+![autorefresh](_images/screenshots/autorefresh.jpg)
+
 ## Full screen
 
 The Report will be opened in a new browser tab in the full screen mode.
 
+![fullscreen](_images/screenshots/fullscreen.jpg)
+
 ## Embedded
 
 This mode allows the Report to be embedded into another application. The report data can be dynamically changed if dynamic queries are used to build the chart components. The query parameter can be passed by url search parameters. 
 
+![apikey](_images/screenshots/apikey.jpg)
+
+![apikey2](_images/screenshots/apikey2.jpg)
+
 For example:
 ```html
-<iframe src="http://localhost:6688/poli/workspace/report/full?$toReport=SalesReport$apiKey=ap_12345678&$showControl=true&year=2019"></iframe>
+<iframe src="http://localhost:6688/poli/workspace/report/fullscreen?$toReport=SalesReport$apiKey=ap_12345678&$showControl=true&year=2019"></iframe>
 ```
 
 There are four url search parameters in this example.