Files
alfresco-ng2-components/ng2-components/ng2-activiti-analytics

Activiti Analytics Component for Angular 2

Prerequisites

Before you start using this development framework, make sure you have installed all required software and done all the necessary configuration, see this page.

Install

npm install --save ng2-activiti-analytics

Ng2-Charts

npm install ng2-charts chart.js --save

Also make sure you include these dependencies in your index.html file:

    <script src="node_modules/chart.js/dist/Chart.bundle.min.js"></script>

Moment

npm install moment --save

Also make sure you include these dependencies in your index.html file:

    <script src="node_modules/moment/min/moment.min.js"></script>

Material Design Date picker

npm install md-date-time-picker --save

Also make sure you include these dependencies in your index.html file:

    <script src="node_modules/md-date-time-picker/dist/js/mdDateTimePicker.min.js"></script>

Material Design Lite

The style of this component is based on material design, so if you want to visualize it correctly you have to add the material design dependency to your project:

npm install --save material-design-icons material-design-lite

Also make sure you include these dependencies in your index.html file:

<!-- Google Material Design Lite -->
<link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
<script src="node_modules/material-design-lite/material.min.js"></script>
<link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">

Basic usage example Activiti Analytics List

The component shows the list of all the available reports

<analytics-report-list></analytics-report-list>

Events

onSuccess: The event is emitted when the report list are loaded
onError: The event is emitted when an error occur during the loading
reportClick: The event is emitted when the report in the list is selected

Options

No options.

Basic usage example Activiti Analytics

The component shows the charts related to the reportId passed as input

<activiti-analytics [appId]="appId" [reportId]="reportId"></activiti-analytics>

Events

onSuccess: The event is emitted when the report parameters are loaded
onError: The event is emitted when an error occur during the loading

Options

appId: The application id
reportId: The report id
debug: Flag to enable or disable the Form values in the console log

Build from sources

Alternatively you can build component from sources with the following commands:

npm install
npm run build

Build the files and keep watching for changes

$ npm run build:w

Running unit tests

npm test

Running unit tests in browser

npm test-browser

This task rebuilds all the code, runs tslint, license checks and other quality check tools before performing unit testing.

Code coverage

npm run coverage