mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
Show the TaskList when an app is select
This commit is contained in:
@@ -1,20 +1,20 @@
|
|||||||
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
|
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
|
||||||
<header class="mdl-layout__header">
|
<header class="mdl-layout__header">
|
||||||
<!-- Tabs -->
|
<!-- Tabs -->
|
||||||
<div class="mdl-layout__tab-bar mdl-js-ripple-effect">
|
<div class="mdl-layout__tab-bar mdl-js-ripple-effect" #tabheader>
|
||||||
<a href="#scroll-tab-0" class="mdl-layout__tab is-active">APPS</a>
|
<a id="apps-header" href="#apps" class="mdl-layout__tab is-active">APPS</a>
|
||||||
<a href="#scroll-tab-1" class="mdl-layout__tab">TASK LIST</a>
|
<a id="tasks-header" href="#tasks" class="mdl-layout__tab">TASK LIST</a>
|
||||||
<a href="#scroll-tab-2" class="mdl-layout__tab">PROCESS LIST</a>
|
<a id="processes-header" href="#processes" class="mdl-layout__tab">PROCESS LIST</a>
|
||||||
<a href="#scroll-tab-3" class="mdl-layout__tab">REPORT</a>
|
<a id="report-header" href="#report" class="mdl-layout__tab">REPORT</a>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
<main class="mdl-layout__content activiti">
|
<main class="mdl-layout__content activiti" #tabmain>
|
||||||
<section class="mdl-layout__tab-panel is-active" id="scroll-tab-0">
|
<section class="mdl-layout__tab-panel is-active" id="apps">
|
||||||
<div class="page-content">
|
<div class="page-content">
|
||||||
<activiti-apps [layoutType]="layoutType" (appClick)="onAppClick($event)" #activitiapps></activiti-apps>
|
<activiti-apps [layoutType]="layoutType" (appClick)="onAppClick($event)" #activitiapps></activiti-apps>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<section class="mdl-layout__tab-panel" id="scroll-tab-1">
|
<section class="mdl-layout__tab-panel" id="tasks">
|
||||||
<div class="page-content">
|
<div class="page-content">
|
||||||
<div class="mdl-grid">
|
<div class="mdl-grid">
|
||||||
<div class="mdl-cell mdl-cell--2-col task-column mdl-shadow--2dp">
|
<div class="mdl-cell mdl-cell--2-col task-column mdl-shadow--2dp">
|
||||||
@@ -24,7 +24,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="mdl-cell mdl-cell--3-col task-column mdl-shadow--2dp">
|
<div class="mdl-cell mdl-cell--3-col task-column mdl-shadow--2dp">
|
||||||
<span>Task List</span>
|
<span>Task List</span>
|
||||||
<activiti-tasklist *ngIf="isTaskListSelected()" [taskFilter]="taskFilter" [data]="dataTasks"
|
<activiti-tasklist [taskFilter]="taskFilter" [data]="dataTasks"
|
||||||
(rowClick)="onTaskRowClick($event)" (onSuccess)="onSuccessTaskList($event)"
|
(rowClick)="onTaskRowClick($event)" (onSuccess)="onSuccessTaskList($event)"
|
||||||
#activititasklist></activiti-tasklist>
|
#activititasklist></activiti-tasklist>
|
||||||
</div>
|
</div>
|
||||||
@@ -36,7 +36,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<section class="mdl-layout__tab-panel" id="scroll-tab-2">
|
<section class="mdl-layout__tab-panel" id="processes">
|
||||||
<div class="page-content">
|
<div class="page-content">
|
||||||
<div class="page-content">
|
<div class="page-content">
|
||||||
<div class="mdl-grid">
|
<div class="mdl-grid">
|
||||||
@@ -61,7 +61,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<section class="mdl-layout__tab-panel" id="scroll-tab-3">
|
<section class="mdl-layout__tab-panel" id="report">
|
||||||
<div class="page-content"><!-- Your content goes here --></div>
|
<div class="page-content"><!-- Your content goes here --></div>
|
||||||
</section>
|
</section>
|
||||||
</main>
|
</main>
|
||||||
|
@@ -43,8 +43,6 @@ declare var componentHandler;
|
|||||||
})
|
})
|
||||||
export class ActivitiDemoComponent implements AfterViewChecked {
|
export class ActivitiDemoComponent implements AfterViewChecked {
|
||||||
|
|
||||||
currentChoice: string = 'task-list';
|
|
||||||
|
|
||||||
@ViewChild('activitiapps')
|
@ViewChild('activitiapps')
|
||||||
activitiapps: ActivitiApps;
|
activitiapps: ActivitiApps;
|
||||||
|
|
||||||
@@ -66,6 +64,15 @@ export class ActivitiDemoComponent implements AfterViewChecked {
|
|||||||
@ViewChild('activitiprocessdetails')
|
@ViewChild('activitiprocessdetails')
|
||||||
activitiprocessdetails: any;
|
activitiprocessdetails: any;
|
||||||
|
|
||||||
|
@ViewChild('tabmain')
|
||||||
|
tabMain: any;
|
||||||
|
|
||||||
|
@ViewChild('tabheader')
|
||||||
|
tabHeader: any;
|
||||||
|
|
||||||
|
@Input()
|
||||||
|
appId: number;
|
||||||
|
|
||||||
layoutType: string;
|
layoutType: string;
|
||||||
currentTaskId: string;
|
currentTaskId: string;
|
||||||
currentProcessInstanceId: string;
|
currentProcessInstanceId: string;
|
||||||
@@ -81,13 +88,6 @@ export class ActivitiDemoComponent implements AfterViewChecked {
|
|||||||
dataTasks: ObjectDataTableAdapter;
|
dataTasks: ObjectDataTableAdapter;
|
||||||
dataProcesses: ObjectDataTableAdapter;
|
dataProcesses: ObjectDataTableAdapter;
|
||||||
|
|
||||||
@Input()
|
|
||||||
appId: number;
|
|
||||||
|
|
||||||
setChoice($event) {
|
|
||||||
this.currentChoice = $event.target.value;
|
|
||||||
}
|
|
||||||
|
|
||||||
isProcessListSelected() {
|
isProcessListSelected() {
|
||||||
return this.currentChoice === 'process-list';
|
return this.currentChoice === 'process-list';
|
||||||
}
|
}
|
||||||
@@ -134,6 +134,16 @@ export class ActivitiDemoComponent implements AfterViewChecked {
|
|||||||
|
|
||||||
this.processFilter = null;
|
this.processFilter = null;
|
||||||
this.currentProcessInstanceId = null;
|
this.currentProcessInstanceId = null;
|
||||||
|
|
||||||
|
this.changeTab('apps','tasks');
|
||||||
|
}
|
||||||
|
|
||||||
|
changeTab(origin: string, destination: string) {
|
||||||
|
this.tabMain.nativeElement.children[origin].classList.remove('is-active');
|
||||||
|
this.tabMain.nativeElement.children[destination].classList.add('is-active');
|
||||||
|
|
||||||
|
this.tabHeader.nativeElement.children[`${origin}-header`].classList.remove('is-active');
|
||||||
|
this.tabHeader.nativeElement.children[`${destination}-header`].classList.add('is-active');
|
||||||
}
|
}
|
||||||
|
|
||||||
onTaskFilterClick(event: FilterRepresentationModel) {
|
onTaskFilterClick(event: FilterRepresentationModel) {
|
||||||
|
Reference in New Issue
Block a user