Merge pull request #793 from Alfresco/dev-mvitale-784

FilterList is shown twice
This commit is contained in:
VitoAlbano 2016-09-21 16:52:10 +01:00 committed by GitHub
commit d18af7cb09
7 changed files with 41 additions and 62 deletions

View File

@ -1,20 +1,20 @@
<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 href="#scroll-tab-0" class="mdl-layout__tab is-active">APPS</a>
<a href="#scroll-tab-1" class="mdl-layout__tab">TASK LIST</a>
<a href="#scroll-tab-2" class="mdl-layout__tab">PROCESS LIST</a>
<a href="#scroll-tab-3" class="mdl-layout__tab">REPORT</a>
<div class="mdl-layout__tab-bar mdl-js-ripple-effect" #tabheader>
<a id="apps-header" href="#apps" class="mdl-layout__tab is-active">APPS</a>
<a id="tasks-header" href="#tasks" class="mdl-layout__tab">TASK LIST</a>
<a id="processes-header" href="#processes" class="mdl-layout__tab">PROCESS LIST</a>
<a id="report-header" href="#report" class="mdl-layout__tab">REPORT</a>
</div>
</header>
<main class="mdl-layout__content activiti">
<section class="mdl-layout__tab-panel is-active" id="scroll-tab-0">
<main class="mdl-layout__content activiti" #tabmain>
<section class="mdl-layout__tab-panel is-active" id="apps">
<div class="page-content">
<activiti-apps [layoutType]="layoutType" (appClick)="onAppClick($event)" #activitiapps></activiti-apps>
</div>
</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="mdl-grid">
<div class="mdl-cell mdl-cell--2-col task-column mdl-shadow--2dp">
@ -24,7 +24,7 @@
</div>
<div class="mdl-cell mdl-cell--3-col task-column mdl-shadow--2dp">
<span>Task List</span>
<activiti-tasklist *ngIf="isTaskListSelected()" [taskFilter]="taskFilter" [data]="dataTasks"
<activiti-tasklist [taskFilter]="taskFilter" [data]="dataTasks"
(rowClick)="onTaskRowClick($event)" (onSuccess)="onSuccessTaskList($event)"
#activititasklist></activiti-tasklist>
</div>
@ -36,7 +36,7 @@
</div>
</div>
</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="mdl-grid">
@ -61,7 +61,7 @@
</div>
</div>
</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>
</section>
</main>

View File

@ -43,8 +43,6 @@ declare var componentHandler;
})
export class ActivitiDemoComponent implements AfterViewChecked {
currentChoice: string = 'task-list';
@ViewChild('activitiapps')
activitiapps: ActivitiApps;
@ -66,6 +64,15 @@ export class ActivitiDemoComponent implements AfterViewChecked {
@ViewChild('activitiprocessdetails')
activitiprocessdetails: any;
@ViewChild('tabmain')
tabMain: any;
@ViewChild('tabheader')
tabHeader: any;
@Input()
appId: number;
layoutType: string;
currentTaskId: string;
currentProcessInstanceId: string;
@ -81,13 +88,6 @@ export class ActivitiDemoComponent implements AfterViewChecked {
dataTasks: ObjectDataTableAdapter;
dataProcesses: ObjectDataTableAdapter;
@Input()
appId: number;
setChoice($event) {
this.currentChoice = $event.target.value;
}
isProcessListSelected() {
return this.currentChoice === 'process-list';
}
@ -134,6 +134,16 @@ export class ActivitiDemoComponent implements AfterViewChecked {
this.processFilter = 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) {

View File

@ -82,7 +82,7 @@ export class ActivitiProcessFilters implements OnInit, OnChanges {
ngOnChanges(changes: SimpleChanges) {
let appId = changes['appId'];
if (appId && appId.currentValue) {
if (appId && (appId.currentValue || appId.currentValue === null)) {
this.load();
return;
}
@ -93,7 +93,6 @@ export class ActivitiProcessFilters implements OnInit, OnChanges {
* @param tasks
*/
private load() {
this.resetFilter();
if (this.appName) {
this.filterByAppName();
} else {
@ -104,6 +103,7 @@ export class ActivitiProcessFilters implements OnInit, OnChanges {
private filterByAppId(appId) {
this.activiti.getProcessFilters(appId).subscribe(
(res: FilterRepresentationModel[]) => {
this.resetFilter();
res.forEach((filter) => {
this.filterObserver.next(filter);
});

View File

@ -82,7 +82,7 @@ export class ActivitiFilters implements OnInit, OnChanges {
ngOnChanges(changes: SimpleChanges) {
let appId = changes['appId'];
if (appId) {
if (appId && (appId.currentValue || appId.currentValue === null)) {
this.load();
return;
}
@ -93,7 +93,6 @@ export class ActivitiFilters implements OnInit, OnChanges {
* @param tasks
*/
private load() {
this.resetFilter();
if (this.appName) {
this.filterByAppName();
} else {
@ -104,6 +103,7 @@ export class ActivitiFilters implements OnInit, OnChanges {
private filterByAppId(appId) {
this.activiti.getTaskListFilters(appId).subscribe(
(res: FilterRepresentationModel[]) => {
this.resetFilter();
res.forEach((filter) => {
this.filterObserver.next(filter);
this.selectFirstFilter();

View File

@ -15,13 +15,13 @@
<activiti-people [people]="taskPeople"></activiti-people>
</div>
<div class="mdl-cell mdl-cell--4-col">
<activiti-comments [taskId]="taskId" #activiticomments></activiti-comments>
<activiti-comments [taskId]="taskDetails.id" #activiticomments></activiti-comments>
</div>
<div class="mdl-cell mdl-cell--4-col">
<activiti-checklist [taskId]="taskId" #activitichecklist></activiti-checklist>
<activiti-checklist [taskId]="taskDetails.id" #activitichecklist></activiti-checklist>
</div>
</div>
<activiti-form *ngIf="hasFormKey()" [taskId]="taskId"
<activiti-form *ngIf="hasFormKey()" [taskId]="taskDetails.id"
[showTitle]="showTitle"
[showRefreshButton]="showRefreshButton"
[showCompleteButton]="showCompleteButton"

View File

@ -10,9 +10,5 @@
{{taskDetails?.dueDate ? taskDetails.dueDate : ('TASK_DETAILS.DUE.NONE' |translate) }}
</div>
<div class="mdl-cell mdl-cell--4-col">
<span class="activiti-label">{{ 'TASK_DETAILS.LABELS.FORM' | translate }}</span>:
{{taskForm?.name ? taskForm.name : ('TASK_DETAILS.FORM.NONE' | translate) }}
</div>
</div>
</div>

View File

@ -15,10 +15,9 @@
* limitations under the License.
*/
import { Component, Input, OnInit, OnChanges } from '@angular/core';
import { Component, Input, OnInit } from '@angular/core';
import { AlfrescoTranslationService, AlfrescoAuthenticationService } from 'ng2-alfresco-core';
import { TaskDetailsModel } from '../models/task-details.model';
import { FormModel, FormService } from 'ng2-activiti-form';
declare let componentHandler: any;
declare let __moduleName: string;
@ -27,23 +26,19 @@ declare let __moduleName: string;
selector: 'activiti-task-header',
moduleId: __moduleName,
templateUrl: './activiti-task-header.component.html',
styleUrls: ['./activiti-task-header.component.css'],
providers: [ FormService ]
styleUrls: ['./activiti-task-header.component.css']
})
export class ActivitiTaskHeader implements OnInit, OnChanges {
export class ActivitiTaskHeader implements OnInit {
@Input()
taskDetails: TaskDetailsModel;
taskForm: FormModel;
/**
* Constructor
* @param auth
* @param translate
*/
constructor(private auth: AlfrescoAuthenticationService,
private activitiForm: FormService,
private translate: AlfrescoTranslationService) {
if (translate) {
@ -52,29 +47,7 @@ export class ActivitiTaskHeader implements OnInit, OnChanges {
}
ngOnInit() {
if (this.taskDetails && this.taskDetails.formKey) {
this.load(this.taskDetails.id);
}
}
ngOnChanges(change) {
if (this.taskDetails && this.taskDetails.formKey) {
this.load(this.taskDetails.id);
} else {
this.taskForm = null;
}
}
public load(taskId: string) {
if (taskId) {
this.activitiForm.getTaskForm(taskId).subscribe(
(response) => {
this.taskForm = response;
},
(err) => {
console.error(err);
}
);
}
}
}