mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-19 17:14:57 +00:00
f3de023ab3
* extra DOM events for DataTable - support for ‘row-click’ DOM event (bubbling) - support for ‘row-dblclick’ DOM event (bubbling) - DataRowEvent exposes ‘sender’ property to simplify access to component from within handlers - readme and test updates * fix unit tests
145 lines
8.5 KiB
HTML
145 lines
8.5 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" [class.is-active]="activeTab === 'tasks'" (click)="activeTab = 'tasks'">TASKS</a>
|
|
<a id="processes-header" href="#processes" class="mdl-layout__tab" [class.is-active]="activeTab === 'processes'" (click)="activeTab = 'processes'">PROCESSES</a>
|
|
<a id="report-header" href="#report" class="mdl-layout__tab" [class.is-active]="activeTab === 'reports'" (click)="activeTab = 'reports'">REPORTS</a>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="mdl-layout__content activiti">
|
|
|
|
<!-- TASKS COMPONENT -->
|
|
|
|
<section class="mdl-layout__tab-panel" [class.is-active]="activeTab === 'tasks'" id="tasks">
|
|
<div class="page-content">
|
|
<div class="mdl-grid">
|
|
<div class="mdl-cell mdl-cell--2-col task-column mdl-shadow--2dp">
|
|
<span><h5>Task Filters</h5></span>
|
|
<hr>
|
|
<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><h5>Task List</h5></span>
|
|
<hr>
|
|
<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"
|
|
[landingTaskId]="currentTaskId"
|
|
(rowClick)="onTaskRowClick($event)"
|
|
(onSuccess)="onSuccessTaskList($event)"
|
|
(row-click)="onRowClick($event)"
|
|
(row-dblclick)="onRowDblClick($event)"
|
|
#activititasklist>
|
|
<!-- Custom column definition demo -->
|
|
<!--
|
|
<data-columns>
|
|
<data-column key="name" title="NAME" class="full-width name-column"></data-column>
|
|
<data-column key="created" title="Created" class="hidden"></data-column>
|
|
</data-columns>
|
|
-->
|
|
</activiti-tasklist>
|
|
</div>
|
|
<div class="mdl-cell mdl-cell--7-col task-column mdl-shadow--2dp">
|
|
<activiti-task-details #activitidetails
|
|
[taskId]="currentTaskId"
|
|
(formCompleted)="onFormCompleted($event)"
|
|
(taskCreated)="onTaskCreated($event)">
|
|
</activiti-task-details>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<!-- PROCESS COMPONENT -->
|
|
|
|
<section class="mdl-layout__tab-panel" [class.is-active]="activeTab === 'processes'" id="processes">
|
|
<div class="page-content" *ngIf="activeTab === 'processes'">
|
|
<div class="page-content">
|
|
<div class="mdl-grid">
|
|
<div class="mdl-cell mdl-cell--2-col task-column mdl-shadow--2dp">
|
|
<span><h5>Process Filters</h5></span>
|
|
<hr>
|
|
<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 mdl-shadow--2dp" *ngIf="processFilter && !isStartProcessMode()">
|
|
<span><h5>Process List</h5></span>
|
|
<hr>
|
|
<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 task-column mdl-shadow--2dp" *ngIf="!isStartProcessMode()"
|
|
[class.mdl-cell--7-col]="processFilter && !isStartProcessMode()"
|
|
[class.mdl-cell--10-col]="!processFilter || isStartProcessMode()">
|
|
<span><h5>Process Details</h5></span>
|
|
<hr>
|
|
<activiti-process-instance-details
|
|
[processInstanceId]="currentProcessInstanceId"
|
|
(processCancelled)="processCancelled()"
|
|
(taskClick)="onProcessDetailsTaskClick($event)">
|
|
</activiti-process-instance-details>
|
|
</div>
|
|
<div class="mdl-cell mdl-cell--10-col task-column mdl-shadow--2dp" *ngIf="isStartProcessMode()">
|
|
<span><h5>Start Process</h5></span>
|
|
<hr>
|
|
<activiti-start-process [appId]="appId" (start)="onStartProcessInstance($event)"></activiti-start-process>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<!-- ANALYTICS COMPONENT -->
|
|
|
|
<section class="mdl-layout__tab-panel" [class.is-active]="activeTab === 'reports'" id="report">
|
|
<div class="page-content" *ngIf="activeTab === 'reports'">
|
|
<div class="mdl-grid">
|
|
<div class="mdl-cell mdl-cell--4-col task-column mdl-shadow--2dp">
|
|
<span><h5>Report List</h5></span>
|
|
<hr>
|
|
<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"
|
|
[hideParameters]="false"
|
|
(editReport)="onEditReport($event)"
|
|
(reportSaved)="onReportSaved()"
|
|
(reportDeleted)="onReportDeleted()">
|
|
</activiti-analytics>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
</main>
|
|
</div>
|