mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-31 17:38:48 +00:00
#ADF-696 Now accordion opens/closes on click of group header along with emitting heading click event (#1936)
This commit is contained in:
committed by
Eugenio Romano
parent
eae9064213
commit
8b7b57efe6
@@ -1,10 +1,10 @@
|
|||||||
<div class="adf-panel adf-panel-default" [ngClass]="{'adf-panel-open': isOpen}">
|
<div class="adf-panel adf-panel-default" [ngClass]="{'adf-panel-open': isOpen}">
|
||||||
<div class="adf-panel-heading" [ngClass]="{'adf-panel-heading-selected': isSelected}" (click)="onHeadingClick()">
|
<div class="adf-panel-heading" [ngClass]="{'adf-panel-heading-selected': isSelected}" (click)="toggleOpen($event)">
|
||||||
<div id="heading-icon" *ngIf="hasHeadingIcon()" class="adf-panel-heading-icon">
|
<div id="heading-icon" *ngIf="hasHeadingIcon()" class="adf-panel-heading-icon">
|
||||||
<i class="material-icons">{{headingIcon}}</i>
|
<i class="material-icons">{{headingIcon}}</i>
|
||||||
</div>
|
</div>
|
||||||
<div id="heading-text" class="adf-panel-heading-text">{{heading}}</div>
|
<div id="heading-text" class="adf-panel-heading-text">{{heading}}</div>
|
||||||
<div id="accordion-button" *ngIf="hasAccordionIcon" class="adf-panel-heading-toggle" (click)="toggleOpen($event)">
|
<div id="accordion-button" *ngIf="hasAccordionIcon" class="adf-panel-heading-toggle">
|
||||||
<i class="material-icons">{{getAccordionIcon()}}</i>
|
<i class="material-icons">{{getAccordionIcon()}}</i>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@@ -107,8 +107,8 @@ describe('AccordionGroupComponent', () => {
|
|||||||
expect(headName).toEqual(heading);
|
expect(headName).toEqual(heading);
|
||||||
done();
|
done();
|
||||||
});
|
});
|
||||||
|
let header = element.querySelector('.adf-panel-heading');
|
||||||
component.onHeadingClick();
|
header.click();
|
||||||
});
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
@@ -79,13 +79,11 @@ export class AccordionGroupComponent implements OnDestroy {
|
|||||||
toggleOpen(event: MouseEvent): void {
|
toggleOpen(event: MouseEvent): void {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
this.isOpen = !this.isOpen;
|
this.isOpen = !this.isOpen;
|
||||||
|
this.headingClick.emit(this.heading);
|
||||||
}
|
}
|
||||||
|
|
||||||
getAccordionIcon(): string {
|
getAccordionIcon(): string {
|
||||||
return this.isOpen ? 'expand_less' : 'expand_more';
|
return this.isOpen ? 'expand_less' : 'expand_more';
|
||||||
}
|
}
|
||||||
|
|
||||||
onHeadingClick() {
|
|
||||||
this.headingClick.emit(this.heading);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user