Internal Errigal Collaboration Wiki

This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.
====== Analytical Reports (Bubble App) ======
Updated by Yanjun Wang 13/12/2021


==== Overview ====

Customers are keen to reports to display the ticket state transition diagram, which shows how many and how long it took on the transition of ticket state one from another. Bubble App is developed to show the dynamical tickets status transition diagram and transferred ticket count trend chart based on data from key_stats. The diagram/chart can filter results by changing workflow, user, region, date, form, alarm, technology, priority, start status, the threshold from the sidebar. 

The APP has been integrated with Errigal Common Header, CAS, and Userprofile, also been tracked by Google Analytics.

Repo: https://bitbucket.org/errigal/bubbleapp/src/dev/

----

==== Access and Permissions ====

The APP has been integrated with CAS and Userprofile.

User can visit the APP from either the button on Ticketer -> Admin Options -> Analytical Report, or link directly.

{{ :development:applications:bubble-app-link.png?200 |}}

Permission control is handled by Userprofile.
  * System Admin: System Administrator can access all data and functionality.
  * Supper System Admin: Supper System Administrator can access all data and functionality.
  * End User: Application user without ability to create new user.
  * API User: API User is allowed to access the APIs.


----

==== Details ====

There are two types of reports (panel). 
  * Ticket State Change Report: displays time used between ticket status changes.
  * Ticket State Distribution: displays ticket count distribution over time between two certain statuses.

=== Ticket State Change Report ===

  * The sidebar contains all the filters which are used for filtering ticket state transition results. Workflow Name, Threshold, Start/End Date are required fields to fill in. Any other supported optional filters can be added by **Add Filter**, and easily removed by the minus button behind each filter.
  * The sidebar also contains a special filter: Saved Report, by selecting from its option, pre-saved reports variables will be auto-populated in the below filters. 
    * User can **create** a **new** report(variables) by 
      * Leave the Saved Report dropdown blank
      * Filling all the filters
      * Clicking **Save**
      * Enter a report name and Confirm
      * OR
      * No matter what's value in Saved Report dropdown
      * Filling all the filters
      * Click **Save As New**
      * Enter a report name and Confirm
    * User can **update** an **existing** report(variables) by 
      * Select the report going to be updated from the Saved Report dropdown
      * Filling all the filters you want to update
      * Click **Save**
    * User can **remove** an **existing** report(variables) by 
      * Select the report going to be removed from the Saved Report dropdown
      * Click **Remove**
  * The sidebar is allowed to show/hide by the button above it.
  * The report window for ticket state transition diagram also supported to change to a table view by clicking the table icon at the top-right corner.
  * The second icon at the top-right corner of the report window allows users to print the diagram or export the table. (If there's going to add more features to this report, can be added under this icon.)

{{ :development:applications:bubble-app1.png?600 |}}


=== Ticket State Distribution ===

  * By clicking a link between the ticket state transition diagram's 2 states, another report window will be presented to the user(as below), which shows the below figures, and both of them can be hidden by clicking the legend behind the chart.
    * The total tickets count over a certain time period.
    * The count of tickets at a certain time(minute) moved from one status to another. 
  * By default, the chart will show the main data only(90% of the total tickets count), then the scope of data can be changed by the scroll bar above. The big blue button will show 100% of the data.
  * The Redpoint shows the time that half of the total tickets moved from one status to another.
  * The chart is developed with Amchart4 which also supports download as jpg etc.

{{ :development:applications:bubble-app2.png?600 |}}

----

==== Architecture ====

{{ :development:applications:bubble-app3.png?600 |}}

----

==== Impelmentation ====

  * Ticket State Diagram Report: TicketStateReport.groovy
  * Ticket State Distribution: TicketStateDistributionReport.groovy

Parameter table population is replying on QUARTZ job to run on a daily basis. The SQL query used for the corresponding table is at custom_query table.

----

==== List of Tools & Technologies ====

Backend
  * Java 8
  * Spring Boot 1.5.10
  * Actuator
  * JPA
  * REST
  * Security, Includes CAS
Frontend
  * ReactJS
  * [[https://gojs.net/latest/index.html|GoJS]]
  * [[https://www.amcharts.com/docs/v4/|amCharts]]
  * BubbleJS
Development
  * Jest: helps running unit test on ReactJS Code
  * Storybook: helps speed up React Component Development
Other
  * Ansible
  * Prometheus 

----

==== Key Stats ==== 

Reports have the ability to connect databases via MySQL JDBC connector. For the state diagram report, it queries from key_stat table which is generated and updated by different processes that Marut introduced for Tableau. At the time of 3.11, table names that state diagram report looks up are wf_ticket_status_change and ticket_summary.

----

==== Appendix ====

Project folder:
  * [[https://drive.google.com/drive/folders/0BzOPOur52nscUXdwTll0Sm9XVTA|Reprting Manager]]
  * [[https://drive.google.com/drive/u/0/folders/1pCLg8Nh-fZcnP_LjQZZlpJDQV3WyR3xd|Original]]
  * [[https://drive.google.com/drive/u/0/folders/1znq8MBb4ehOHKFHAzHkk_EuyjmH9p20b|Enhancements]]

R&D Docs: [[https://docs.google.com/document/d/16_xKYkFweTl7xmUn5Wa5is_MlyoVWA-zw_r9Ec1TKxg/edit?usp=sharing|3.11]] [[https://docs.google.com/document/d/1U7czQRRd0ZUrxL33BeZ2Ja1by7RGhdme5xShSO6zIQc/edit?usp=sharing|3.13]] [[https://docs.google.com/document/d/1yFN_HxtRfZXfdaAGmkbhB8eXW8XFHU9DsxFid6ASVtk/edit?usp=sharing|3.14]]
Sidebar

Internal Errigal Collaboration Wiki

User Tools

Site Tools

Page Tools
