Denys Vuika bf05b5df05 [ADF-1744] content projection for toolbar and info drawer (#2476)
* content projection for toolbar and info drawer

* unit tests
2017-10-16 18:21:07 +01:00

230 lines
12 KiB
HTML

<mat-tab-group [(selectedIndex)]="activeTab">
<mat-tab id="tasks-header" href="#tasks" label="{{'PS-TAB.TASKS-TAB' | translate}}">
<div class="page-content">
<div class="activiti-demo-grid" fxLayout="row" fxLayout.lt-lg="column" fxLayoutAlign="stretch">
<div class="activiti-demo-grid-item activiti-demo-tasks-menu" fxFlex.gt-md="225px">
<div class="activiti-demo-list-buttons">
<button color="primary" mat-raised-button data-automation-id="btn-start-task" class="activiti-demo-list-buttons-start" (click)="navigateStartTask()">
<mat-icon>add</mat-icon>
<span>{{'PS-TAB.START-TASK' | translate}}</span>
</button>
</div>
<adf-accordion>
<adf-accordion-group [heading]="'Tasks'" [isSelected]="true" [isOpen]="true"
[headingIcon]="'assignment'">
<adf-filters
[filterParam]="{name:'MY tasks'}"
[appId]="appId"
[hasIcon]="false"
(filterClick)="onTaskFilterClick($event)"
(onSuccess)="onSuccessTaskFilterList($event)"
#activitifilter>
</adf-filters>
</adf-accordion-group>
</adf-accordion>
</div>
<div class="activiti-demo-grid-item activiti-demo-tasks-list" fxFlex.gt-md="335px" [ngClass.gt-md]="{'small-pagination': true}"
*ngIf="taskFilter && !isStartTaskMode()">
<adf-tasklist
[appId]="taskFilter?.appId"
[page]="taskPage"
[size]="taskPagination.maxItems"
[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)="onTaskRowDblClick($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>
-->
</adf-tasklist>
<adf-pagination
(changePageNumber)="onChangePageNumber($event)"
(changePageSize)="onChangePageSize($event)"
(nextPage)="onNextPage($event)"
(prevPage)="onPrevPage($event)"
[pagination]="taskPagination"
[supportedPageSizes]="[2, 4, 6, 8, 10, 12]">
</adf-pagination>
</div>
<div class="activiti-demo-grid-item activiti-demo-tasks-details" *ngIf="!isStartTaskMode()" fxFlex.gt-md="1 1 auto">
<adf-task-details #activitidetails
[debugMode]="true"
[taskId]="currentTaskId"
[fieldValidators]="fieldValidators"
(formCompleted)="onFormCompleted($event)"
(formContentClicked)="onFormContentClick($event)"
(taskCreated)="onTaskCreated($event)"
(assignTask)="onAssignTask()"
(taskDeleted)="onTaskDeleted($event)">
</adf-task-details>
<hr>
<div *ngIf="currentTaskId">
{{'PS-TAB.AUDIT-LOG' | translate}}
<button
adf-task-audit
[task-id]="currentTaskId"
[download]="true"
mat-icon-button (clicked)="onAuditClick($event)" (error)="onAuditError($event)">
<mat-icon>assignment_ind</mat-icon>
</button>
<hr>
</div>
<mat-card>
<mat-card-content>
<activiti-task-attachments
[taskId]="currentTaskId">
</activiti-task-attachments>
</mat-card-content>
</mat-card>
</div>
<div class="activiti-demo-grid-item activiti-demo-tasks-start" *ngIf="isStartTaskMode()" fxFlex.gt-md="1 1 auto">
<adf-start-task
[appId]="appId"
(success)="onStartTaskSuccess($event)"
(cancel)="onCancelStartTask()">
</adf-start-task>
</div>
</div>
</div>
</mat-tab>
<mat-tab id="processes-header" href="#processes"
label="{{'PS-TAB.PROCESSES-TAB' | translate}}">
<div class="page-content">
<div class="activiti-demo-grid" fxLayout="row" fxLayout.lt-lg="column" fxLayoutAlign="stretch">
<div class="activiti-demo-grid-item activiti-demo-processes-menu" fxFlex.gt-md="225px">
<div class="activiti-demo-list-buttons">
<button
color="primary"
mat-raised-button
class="activiti-demo-list-buttons-start"
data-automation-id="btn-start-process"
(click)="navigateStartProcess()">
<mat-icon>add</mat-icon>
<span>{{'PS-TAB.START-PROCESS' | translate}}</span>
</button>
</div>
<adf-accordion>
<adf-accordion-group [heading]="'Processes'" [isSelected]="true" [isOpen]="true"
[headingIcon]="'assessment'">
<adf-process-instance-filters
[filterParam]="{index: 0}"
[appId]="appId"
(filterClick)="onProcessFilterClick($event)"
(onSuccess)="onSuccessProcessFilterList($event)">
</adf-process-instance-filters>
</adf-accordion-group>
</adf-accordion>
</div>
<div class="activiti-demo-grid-item activiti-demo-processes-list activiti-demo-list" fxFlex.gt-md="335px" [ngClass.gt-md]="{'small-pagination': true}"
*ngIf="processFilter && !isStartProcessMode()">
<adf-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)"
(row-dblclick)="onProcessRowDblClick($event)"
(onSuccess)="onSuccessProcessList($event)">
<!-- 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>
-->
</adf-process-instance-list>
</div>
<div class="activiti-demo-grid-item activiti-demo-processes-details" *ngIf="!isStartProcessMode()" fxFlex.gt-md="1 1 auto">
<adf-process-instance-details
[processInstanceId]="currentProcessInstanceId"
(processCancelled)="processCancelled()"
(showProcessDiagram)="onShowProcessDiagram($event)"
(taskClick)="onProcessDetailsTaskClick($event)">
</adf-process-instance-details>
<hr>
<div *ngIf="currentProcessInstanceId">
{{'PS-TAB.AUDIT-LOG' | translate}}
<button adf-process-audit
[process-id]="currentProcessInstanceId"
[download]="true" mat-icon-button
[format]="'pdf'"
(clicked)="onAuditClick($event)"
(error)="onAuditError($event)">
<mat-icon>assignment_ind</mat-icon>
</button>
<hr>
</div>
<mat-card>
<mat-card-content>
<activiti-process-attachments
[processId]="currentProcessInstanceId">
</activiti-process-attachments>
</mat-card-content>
</mat-card>
</div>
<div class="activiti-demo-grid-item activiti-demo-processes-start" fxFlex.gt-md="1 1 auto"
*ngIf="isStartProcessMode()">
<adf-start-process
[appId]="appId"
(start)="onStartProcessInstance($event)"
(cancel)="onCancelProcessInstance()">
</adf-start-process>
</div>
</div>
</div>
</mat-tab>
<mat-tab id="report-header" href="#report"
label="{{'PS-TAB.REPORTS-TAB' | translate}}">
<div class="activiti-demo-grid" fxLayout="row" fxLayout.lt-lg="column" fxLayoutAlign="stretch">
<div class="activiti-demo-grid-item activiti-demo-reports-menu" fxFlex.gt-md="300px">
<span><h5>Report List</h5></span>
<hr>
<analytics-report-list
[appId]="appId"
[selectFirst]="selectFirstReport"
(reportClick)="onReportClick($event)"
#analyticsreportlist>
</analytics-report-list>
</div>
<div class="activiti-demo-grid-item activiti-demo-reports-details" fxFlex.gt-md="1 1 auto">
<adf-analytics
*ngIf="report"
[appId]="appId"
[reportId]="report.id"
[hideParameters]="false"
(editReport)="onEditReport($event)"
(reportSaved)="onReportSaved($event)"
(reportDeleted)="onReportDeleted()">
</adf-analytics>
<div *ngIf="!report">
<span>{{'ANALYTICS_REPORT.NO_REPORT_MESSAGE' | translate}}</span>
</div>
</div>
</div>
</mat-tab>
</mat-tab-group>
<div *ngIf="fileShowed">
<adf-viewer
[(showViewer)]="fileShowed"
[blobFile]="content"
[displayName]="contentName"
[overlayMode]="true">
</adf-viewer>
</div>