inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2026-09-09 18:03:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #912 from Alfresco/dev-valbano-903

Browse Source 
Dev valbano 903
This commit is contained in:
Maurizio Vitale
2016-10-20 11:38:51 +01:00
committed by GitHub
parent f39f5c4567 17a175d74e
commit 70186c3038
6 changed files with 161 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ng2-components/ng2-activiti-form/src/components/widgets/container/container.widget.html
+3 -3
View File
@@ -1,6 +1,6 @@
<div class="container-widget">
<div *ngIf="content?.isGroup()" class="container-widget__header">
<h4 class="container-widget__header-text"
<div *ngIf="content?.isGroup() && content?.isVisible" class="container-widget__header">
<h4 class="container-widget__header-text" id="container-header"
[class.collapsible]="content?.isCollapsible()">
<button *ngIf="content?.isCollapsible()"
alfresco-mdl-button
@@ -8,7 +8,7 @@
(click)="onExpanderClicked()">
<i class="material-icons">{{ content?.isExpanded ? 'expand_less' : 'expand_more' }}</i>
</button>
<span (click)="onExpanderClicked()">{{content.name}}</span>
<span (click)="onExpanderClicked()" id="container-header-label">{{content.name}}</span>
</h4>
</div>
<div class="mdl-grid" *ngIf="content?.isExpanded">
ng2-components/ng2-activiti-form/src/components/widgets/container/container.widget.spec.ts
+104 -4
View File
@@ -20,13 +20,17 @@ import { FormModel } from './../core/form.model';
import { ContainerModel } from './../core/container.model';
import { FormFieldTypes } from './../core/form-field-types';
import { FormFieldModel } from './../core/form-field.model';
import { ComponentFixture, TestBed, async } from '@angular/core/testing';
import { CoreModule } from 'ng2-alfresco-core';
import { WIDGET_DIRECTIVES } from '../index';
import { fakeFormJson } from '../../../services/assets/widget-visibility.service.mock';
describe('ContainerWidget', () => {
let componentHandler;
beforeEach(() => {
componentHandler = jasmine.createSpyObj('componentHandler', [
componentHandler = jasmine.createSpyObj('componentHandler', [
'upgradeAllRegistered'
]);
@@ -49,7 +53,7 @@ describe('ContainerWidget', () => {
it('should toggle underlying group container', () => {
let container = new ContainerModel(new FormModel(), {
type: FormFieldTypes.GROUP,
type: FormFieldTypes.GROUP,
params: {
allowCollapse: true
}
@@ -67,7 +71,7 @@ describe('ContainerWidget', () => {
it('should toggle only collapsible container', () => {
let container = new ContainerModel(new FormModel(), {
type: FormFieldTypes.GROUP
type: FormFieldTypes.GROUP
});
let widget = new ContainerWidget();
@@ -80,7 +84,7 @@ describe('ContainerWidget', () => {
it('should toggle only group container', () => {
let container = new ContainerModel(new FormModel(), {
type: FormFieldTypes.CONTAINER,
type: FormFieldTypes.CONTAINER,
params: {
allowCollapse: true
}
@@ -108,4 +112,100 @@ describe('ContainerWidget', () => {
widget.fieldChanged(fakeField);
});
describe('when template is ready', () => {
let containerWidgetComponent: ContainerWidget;
let fixture: ComponentFixture<ContainerWidget>;
let element: HTMLElement;
let fakeContainerVisible: ContainerModel;
let fakeContainerInvisible: ContainerModel;
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [CoreModule],
declarations: [WIDGET_DIRECTIVES]
}).compileComponents().then(() => {
fixture = TestBed.createComponent(ContainerWidget);
containerWidgetComponent = fixture.componentInstance;
element = fixture.nativeElement;
});
}));
beforeEach(() => {
componentHandler = jasmine.createSpyObj('componentHandler', ['upgradeAllRegistered', 'upgradeElement']);
window['componentHandler'] = componentHandler;
fakeContainerVisible = new ContainerModel(new FormModel(fakeFormJson), {
fieldType: FormFieldTypes.GROUP,
id: 'fake-cont-id-1',
name: 'fake-cont-1-name',
type: FormFieldTypes.GROUP
});
fakeContainerInvisible = new ContainerModel(new FormModel(fakeFormJson), {
fieldType: FormFieldTypes.GROUP,
id: 'fake-cont-id-2',
name: 'fake-cont-2-name',
type: FormFieldTypes.GROUP
});
fakeContainerVisible.isVisible = true;
fakeContainerInvisible.isVisible = false;
});
afterEach(() => {
fixture.destroy();
TestBed.resetTestingModule();
});
it('should show the container header when it is visible', () => {
containerWidgetComponent.content = fakeContainerVisible;
fixture.detectChanges();
fixture.whenStable()
.then(() => {
expect(element.querySelector('#container-header')).toBeDefined();
expect(element.querySelector('#container-header')).not.toBeNull();
expect(element.querySelector('#container-header-label')).toBeDefined();
expect(element.querySelector('#container-header-label').innerHTML).toContain('fake-cont-1-name');
});
});
it('should not show the container header when it is not visible', () => {
containerWidgetComponent.content = fakeContainerInvisible;
fixture.detectChanges();
fixture.whenStable()
.then(() => {
expect(element.querySelector('#container-header')).toBeNull();
expect(element.querySelector('#container-header-label')).toBeNull();
});
});
it('should hide header when it becomes not visible', () => {
containerWidgetComponent.content = fakeContainerVisible;
containerWidgetComponent.fieldChanged(null);
containerWidgetComponent.formValueChanged.subscribe((res) => {
containerWidgetComponent.content.isVisible = false;
fixture.detectChanges();
fixture.whenStable()
.then(() => {
expect(element.querySelector('#container-header')).toBeNull();
expect(element.querySelector('#container-header-label')).toBeNull();
});
});
});
it('should show header when it becomes visible', () => {
containerWidgetComponent.content = fakeContainerInvisible;
containerWidgetComponent.fieldChanged(null);
containerWidgetComponent.formValueChanged.subscribe((res) => {
containerWidgetComponent.content.isVisible = true;
fixture.detectChanges();
fixture.whenStable()
.then(() => {
expect(element.querySelector('#container-header')).toBeDefined();
expect(element.querySelector('#container-header')).not.toBeNull();
expect(element.querySelector('#container-header-label')).toBeDefined();
expect(element.querySelector('#container-header-label').innerHTML).toContain('fake-cont-2-name');
});
});
});
});
});
ng2-components/ng2-activiti-form/src/components/widgets/core/container.model.spec.ts
+3 -1
View File
@@ -51,7 +51,8 @@ describe('ContainerModel', () => {
type: '<type>',
tab: '<tab>',
numberOfColumns: 2,
params: {}
params: {},
visibilityCondition: {}
};
let container = new ContainerModel(null, json);
Object.keys(json).forEach(key => {
@@ -69,6 +70,7 @@ describe('ContainerModel', () => {
tab: '<tab>',
numberOfColumns: 3,
params: {},
visibilityCondition: {},
fields: {
'1': [
{ id: 'field-1' },
ng2-components/ng2-activiti-form/src/components/widgets/core/container.model.ts
+4
View File
@@ -21,6 +21,7 @@ import { ContainerColumnModel } from './container-column.model';
import { FormFieldTypes } from './form-field-types';
import { FormModel } from './form.model';
import { FormFieldModel } from './form-field.model';
import { WidgetVisibilityModel } from '../../../models/widget-visibility.model';
// TODO: inherit FormFieldModel
export class ContainerModel extends FormWidgetModel {
@@ -32,6 +33,8 @@ export class ContainerModel extends FormWidgetModel {
tab: string;
numberOfColumns: number = 1;
params: FormFieldMetadata = {};
isVisible: boolean = true;
visibilityCondition: WidgetVisibilityModel = null;
columns: ContainerColumnModel[] = [];
isExpanded: boolean = true;
@@ -71,6 +74,7 @@ export class ContainerModel extends FormWidgetModel {
this.tab = json.tab;
this.numberOfColumns = <number> json.numberOfColumns;
this.params = <FormFieldMetadata> json.params || {};
this.visibilityCondition = <WidgetVisibilityModel> json.visibilityCondition;
let columnSize: number = 12;
if (this.numberOfColumns > 1) {
ng2-components/ng2-activiti-form/src/services/widget-visibility.service.spec.ts
+32 -1
View File
@@ -27,7 +27,7 @@ import { WidgetVisibilityService } from './widget-visibility.service';
import { AlfrescoSettingsService, AlfrescoAuthenticationService, AlfrescoApiService } from 'ng2-alfresco-core';
import { TaskProcessVariableModel } from '../models/task-process-variable.model';
import { WidgetVisibilityModel } from '../models/widget-visibility.model';
import { FormModel, FormFieldModel, TabModel } from '../components/widgets/core/index';
import { FormModel, FormFieldModel, TabModel, ContainerModel } from '../components/widgets/core/index';
declare let jasmine: any;
@@ -637,5 +637,36 @@ describe('WidgetVisibilityService (mockBackend)', () => {
expect(tab.isVisible).toBeFalsy();
});
it('should refresh the visibility for container in forms', () => {
visibilityObjTest.leftFormFieldId = 'FIELD_TEST';
visibilityObjTest.operator = '!=';
visibilityObjTest.rightFormFieldId = 'RIGHT_FORM_FIELD_ID';
let contModel = new ContainerModel(fakeFormWithField, {
id: 'fake-container-id',
name: 'fake-container-name',
isVisible: true
});
contModel.visibilityCondition = visibilityObjTest;
fakeFormWithField.fields[0].visibilityCondition = visibilityObjTest;
service.refreshVisibility(fakeFormWithField);
expect(fakeFormWithField.fields[0].isVisible).toBeFalsy();
});
it('should refresh the visibility for single container', () => {
visibilityObjTest.leftFormFieldId = 'FIELD_TEST';
visibilityObjTest.operator = '!=';
visibilityObjTest.rightFormFieldId = 'RIGHT_FORM_FIELD_ID';
let contModel = new ContainerModel(fakeFormWithField, {
id: 'fake-container-id',
name: 'fake-container-name',
isVisible: true
});
contModel.visibilityCondition = visibilityObjTest;
service.refreshContainerVisibility(contModel);
expect(contModel.isVisible).toBeFalsy();
});
});
});
ng2-components/ng2-activiti-form/src/services/widget-visibility.service.ts
+15 -5
View File
@@ -19,7 +19,7 @@ import { Injectable } from '@angular/core';
import { Response, Http, Headers, RequestOptions } from '@angular/http';
import { Observable } from 'rxjs/Rx';
import { AlfrescoSettingsService, AlfrescoAuthenticationService } from 'ng2-alfresco-core';
import { FormModel, FormFieldModel, TabModel } from '../components/widgets/core/index';
import { FormModel, FormFieldModel, TabModel, ContainerModel } from '../components/widgets/core/index';
import { WidgetVisibilityModel } from '../models/widget-visibility.model';
import { TaskProcessVariableModel } from '../models/task-process-variable.model';
@@ -38,9 +38,11 @@ export class WidgetVisibilityService {
form.tabs.map(tabModel => this.refreshTabVisibility(tabModel));
}
if (form && form.fields.length > 0) {
form.fields.map(contModel =>
form.fields.map(contModel => {
this.refreshContainerVisibility(contModel);
contModel.columns.map(contColModel =>
contColModel.fields.map(field => this.refreshFieldVisibility(field))));
contColModel.fields.map(field => this.refreshFieldVisibility(field)));
});
}
}
@@ -50,6 +52,12 @@ export class WidgetVisibilityService {
}
}
refreshContainerVisibility(content: ContainerModel) {
if (content.visibilityCondition) {
content.isVisible = this.evaluateVisibility(content.form, content.visibilityCondition);
}
}
refreshTabVisibility(tab: TabModel) {
if (tab.visibilityCondition) {
tab.isVisible = this.evaluateVisibility(tab.form, tab.visibilityCondition);
@@ -81,8 +89,10 @@ export class WidgetVisibilityService {
}
getLeftValue(form: FormModel, visibilityObj: WidgetVisibilityModel) {
return this.getVariableValue(form, visibilityObj.leftRestResponseId, this.processVarList) ||
this.getFormValue(form, visibilityObj.leftFormFieldId);
if (visibilityObj.leftRestResponseId && visibilityObj.leftRestResponseId !== 'null') {
return this.getVariableValue(form, visibilityObj.leftRestResponseId, this.processVarList);
}
return this.getFormValue(form, visibilityObj.leftFormFieldId);
}
getRightValue(form: FormModel, visibilityObj: WidgetVisibilityModel) {