2016-12-14 15:14:37 +00:00

113 lines
6.1 KiB
HTML

<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
<header class="mdl-layout__header">
<!-- TABS -->
<div class="mdl-layout__tab-bar mdl-js-ripple-effect">
<a id="tasks-header" href="#tasks" class="mdl-layout__tab is-active">TASKS</a>
<a id="processes-header" href="#processes" class="mdl-layout__tab">PROCESSES</a>
<a id="report-header" href="#report" class="mdl-layout__tab">REPORTS</a>
</div>
</header>
<main class="mdl-layout__content activiti">
<!-- TASKS COMPONENT -->
<section class="mdl-layout__tab-panel is-active" id="tasks">
<div class="page-content">
<div class="mdl-grid">
<div class="mdl-cell mdl-cell--2-col task-column mdl-shadow--2dp">
<span>Task Filters</span>
<activiti-start-task [appId]="appId" (onSuccess)="onStartTaskSuccess($event)"></activiti-start-task>
<activiti-filters [appId]="appId" (filterClick)="onTaskFilterClick($event)" (onSuccess)="onSuccessTaskFilterList($event)"
#activitifilter></activiti-filters>
</div>
<div class="mdl-cell mdl-cell--3-col task-column mdl-shadow--2dp list-column">
<span>Task List</span>
<activiti-tasklist *ngIf="taskFilter?.hasFilter()" [appId]="taskFilter.appId"
[processDefinitionKey]="taskFilter.filter.processDefinitionKey"
[name]="taskFilter.filter.name"
[assignment]="taskFilter.filter.assignment"
[state]="taskFilter.filter.state"
[sort]="taskFilter.filter.sort"
[data]="dataTasks"
(rowClick)="onTaskRowClick($event)" (onSuccess)="onSuccessTaskList($event)"
#activititasklist></activiti-tasklist>
</div>
<div class="mdl-cell mdl-cell--7-col task-column mdl-shadow--2dp">
<span>Task Details</span>
<activiti-task-details [taskId]="currentTaskId" (formCompleted)="onFormCompleted($event)"
#activitidetails></activiti-task-details>
</div>
</div>
</div>
</section>
<!-- PROCESS COMPONENT -->
<section class="mdl-layout__tab-panel" id="processes">
<div class="page-content">
<div class="page-content">
<div class="mdl-grid">
<div class="mdl-cell mdl-cell--2-col task-column">
<span>Process Filters</span>
<button type="button" (click)="navigateStartProcess()" class="mdl-button" data-automation-id="btn-start-process">Start Process</button>
<activiti-process-instance-filters [appId]="appId"
(filterClick)="onProcessFilterClick($event)"
(onSuccess)="onSuccessProcessFilterList($event)"></activiti-process-instance-filters>
</div>
<div class="mdl-cell mdl-cell--3-col task-column list-column">
<span>Process List</span>
<activiti-process-instance-list *ngIf="processFilter?.hasFilter()" [appId]="processFilter.appId"
[processDefinitionKey]="processFilter.filter.processDefinitionKey"
[name]="processFilter.filter.name"
[state]="processFilter.filter.state"
[sort]="processFilter.filter.sort"
[data]="dataProcesses"
(rowClick)="onProcessRowClick($event)"
(onSuccess)="onSuccessProcessList($event)"></activiti-process-instance-list>
</div>
<div class="mdl-cell mdl-cell--7-col task-column" *ngIf="!isStartProcessMode()">
<span>Process Details</span>
<activiti-process-instance-details [processInstanceId]="currentProcessInstanceId"
(activitiprocesslist)="taskFormCompleted()"
(processCancelled)="processCancelled()"></activiti-process-instance-details>
</div>
<div class="mdl-cell mdl-cell--7-col task-column" *ngIf="isStartProcessMode()">
<span>Start Process</span>
<activiti-start-process [appId]="appId" (start)="onStartProcessInstance($event)"></activiti-start-process>
</div>
</div>
</div>
</div>
</section>
<!-- ANALYTICS COMPONENT -->
<section class="mdl-layout__tab-panel" id="report">
<div class="page-content">
<div class="mdl-grid">
<div class="mdl-cell mdl-cell--4-col task-column mdl-shadow--2dp">
<analytics-report-list
(reportClick)="onReportClick($event)"
#analyticsreportlist >
</analytics-report-list>
</div>
<div class="mdl-cell mdl-cell--8-col task-column mdl-shadow--2dp">
<activiti-analytics *ngIf="report"
[appId]="appId"
[reportId]="report.id"
(editReport)="onEditReport($event)">
</activiti-analytics>
</div>
</div>
</div>
</section>
</main>
</div>