mirror of https://github.com/apache/archiva.git
Simplifying component interaction
This commit is contained in:
parent
ec828c8745
commit
069e7af871
|
@ -16,7 +16,7 @@
|
|||
* under the License.
|
||||
*/
|
||||
|
||||
import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
|
||||
import {AfterViewInit, Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
|
||||
import {merge, Observable, Subject} from "rxjs";
|
||||
import {debounceTime, distinctUntilChanged, map, mergeMap, pluck, share, startWith} from "rxjs/operators";
|
||||
import {EntityService} from "../../../model/entity-service";
|
||||
|
@ -47,7 +47,7 @@ import {FieldToggle} from "../../../model/field-toggle";
|
|||
templateUrl: './paginated-entities.component.html',
|
||||
styleUrls: ['./paginated-entities.component.scss']
|
||||
})
|
||||
export class PaginatedEntitiesComponent<T> implements OnInit, FieldToggle {
|
||||
export class PaginatedEntitiesComponent<T> implements OnInit, FieldToggle, AfterViewInit {
|
||||
|
||||
/**
|
||||
* This must be set, if you use the component. This service retrieves the entity data.
|
||||
|
@ -161,11 +161,11 @@ export class PaginatedEntitiesComponent<T> implements OnInit, FieldToggle {
|
|||
}
|
||||
|
||||
toggleField(fieldArray: string[]) {
|
||||
console.log("Changing sort field " + fieldArray);
|
||||
// console.log("Changing sort field " + fieldArray);
|
||||
let sortOrderChanged: boolean = false;
|
||||
let sortFieldChanged: boolean = false;
|
||||
if (!this.compareArrays(this.sortField, fieldArray)) {
|
||||
console.log("Fields differ: " + this.sortField + " - " + fieldArray);
|
||||
// console.log("Fields differ: " + this.sortField + " - " + fieldArray);
|
||||
this.sortField = fieldArray;
|
||||
if (this.sortOrder != 'asc') {
|
||||
this.sortOrder = 'asc';
|
||||
|
@ -178,11 +178,11 @@ export class PaginatedEntitiesComponent<T> implements OnInit, FieldToggle {
|
|||
} else {
|
||||
this.sortOrder = "asc";
|
||||
}
|
||||
console.log("Toggled sort order: " + this.sortOrder);
|
||||
// console.log("Toggled sort order: " + this.sortOrder);
|
||||
sortOrderChanged = true;
|
||||
}
|
||||
if (sortOrderChanged) {
|
||||
console.log("Sort order changed: "+this.sortOrder)
|
||||
//console.log("Sort order changed: "+this.sortOrder)
|
||||
this.sortOrderChange.emit(this.sortOrder);
|
||||
}
|
||||
if (sortFieldChanged) {
|
||||
|
@ -193,4 +193,10 @@ export class PaginatedEntitiesComponent<T> implements OnInit, FieldToggle {
|
|||
}
|
||||
}
|
||||
|
||||
ngAfterViewInit(): void {
|
||||
// We emit the current value to push them to the containing reading components
|
||||
this.sortOrderChange.emit(this.sortOrder);
|
||||
this.sortFieldChange.emit(this.sortField);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -41,10 +41,11 @@ export class SortedTableHeaderRowComponent implements OnInit, AfterViewInit, Aft
|
|||
|
||||
@Input() sortFieldEmitter: EventEmitter<string[]>;
|
||||
@Input() sortOrderEmitter: EventEmitter<string>;
|
||||
@Input() sortFields: string[];
|
||||
@Input() sortOrder: string;
|
||||
@Input() toggleObserver: FieldToggle;
|
||||
|
||||
sortFields: string[];
|
||||
sortOrder: string;
|
||||
|
||||
@ContentChildren(SortedTableHeaderComponent, { descendants: true }) contentChilds: QueryList<SortedTableHeaderComponent>;
|
||||
|
||||
constructor(private readonly viewContainer: ViewContainerRef) {
|
||||
|
@ -58,9 +59,10 @@ export class SortedTableHeaderRowComponent implements OnInit, AfterViewInit, Aft
|
|||
ngAfterContentInit(): void {
|
||||
this.contentChilds.changes.pipe(startWith(this.contentChilds), delay(0)).subscribe(() => {
|
||||
this.contentChilds.forEach((colComponent, index) => {
|
||||
console.log("Children " + colComponent);
|
||||
// console.log("Children " + colComponent);
|
||||
colComponent.registerSortFieldEmitter(this.sortFieldEmitter);
|
||||
colComponent.registerSortOrderEmitter(this.sortOrderEmitter);
|
||||
|
||||
colComponent.sortOrder = this.sortOrder;
|
||||
colComponent.currentFieldArray = this.sortFields;
|
||||
colComponent.toggleObserver = this.toggleObserver;
|
||||
|
@ -70,10 +72,26 @@ export class SortedTableHeaderRowComponent implements OnInit, AfterViewInit, Aft
|
|||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
this.registerSortOrderEmitter(this.sortOrderEmitter);
|
||||
this.registerSortFieldEmitter(this.sortFieldEmitter);
|
||||
}
|
||||
|
||||
ngAfterViewInit(): void {
|
||||
|
||||
}
|
||||
|
||||
registerSortOrderEmitter(emitter : EventEmitter<string>) {
|
||||
emitter.subscribe((order) => {
|
||||
// console.log("header-row: Changing sort order: " + order);
|
||||
this.sortOrder = order
|
||||
});
|
||||
}
|
||||
|
||||
registerSortFieldEmitter(emitter: EventEmitter<string[]>) {
|
||||
emitter.subscribe((fields)=>{
|
||||
// console.log("header-row: Changing sort fields" + fields);
|
||||
this.sortFields = fields;
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -55,7 +55,7 @@ export class SortedTableHeaderComponent implements OnInit, AfterViewChecked {
|
|||
}
|
||||
|
||||
toggleSortField() {
|
||||
console.log("Toggling sort field " + this.fieldArray);
|
||||
// console.log("Toggling sort field " + this.fieldArray);
|
||||
this.toggleObserver.toggleField(this.fieldArray);
|
||||
}
|
||||
|
||||
|
@ -75,7 +75,7 @@ export class SortedTableHeaderComponent implements OnInit, AfterViewChecked {
|
|||
}
|
||||
|
||||
isAscending() :boolean {
|
||||
console.log("Is ascending: " + this.sortOrder);
|
||||
// console.log("header: Is ascending: " + this.sortOrder);
|
||||
return this.sortOrder == 'asc';
|
||||
}
|
||||
|
||||
|
@ -84,7 +84,10 @@ export class SortedTableHeaderComponent implements OnInit, AfterViewChecked {
|
|||
}
|
||||
|
||||
registerSortFieldEmitter(emitter : EventEmitter<string[]>) {
|
||||
emitter.subscribe((field) => this.currentFieldArray = field);
|
||||
emitter.subscribe((field) => {
|
||||
// console.log("header: Change sort field "+field)
|
||||
this.currentFieldArray = field
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -22,8 +22,8 @@
|
|||
|
||||
<table class="table table-striped table-bordered">
|
||||
<thead class="thead-light">
|
||||
<tr sorted [sortFieldEmitter]="parent.sortFieldChange" [sortOrder]="sortOrder" [sortFields]="sortField"
|
||||
[sortOrderEmitter]="parent.sortOrderChange" [toggleObserver]="parent" >
|
||||
<tr sorted [sortFieldEmitter]="parent.sortFieldChange" [sortOrderEmitter]="parent.sortOrderChange"
|
||||
[toggleObserver]="parent" >
|
||||
<app-th-sorted [fieldArray]="['user_id']" contentText="users.list.table.head.user_id"></app-th-sorted>
|
||||
<app-th-sorted contentText="users.list.table.head.fullName" [fieldArray]="['fullName']" ></app-th-sorted>
|
||||
<app-th-sorted contentText="users.list.table.head.email" [fieldArray]="['email']"></app-th-sorted>
|
||||
|
|
Loading…
Reference in New Issue