mirror of
https://github.com/DSpace/dspace-angular.git
synced 2025-10-07 18:14:17 +00:00
65528: ComCol flat tree with actual backend comm/coll
> TODO FIX: Last subcom and coll are undefined
This commit is contained in:
@@ -1,27 +1,31 @@
|
|||||||
import {CommunityForList, CommunityListService} from './CommunityListService';
|
import {CommunityListService} from './CommunityListService';
|
||||||
import {CollectionViewer, DataSource} from '@angular/cdk/typings/collections';
|
import {CollectionViewer, DataSource} from '@angular/cdk/typings/collections';
|
||||||
import {BehaviorSubject, Observable, of} from 'rxjs';
|
import {BehaviorSubject, Observable, of} from 'rxjs';
|
||||||
import {catchError, finalize, map, take} from 'rxjs/operators';
|
import {catchError, finalize, map, take, tap} from 'rxjs/operators';
|
||||||
|
import {Community} from '../core/shared/community.model';
|
||||||
|
import {Collection} from '../core/shared/collection.model';
|
||||||
|
|
||||||
export interface CommunityFlatNode {
|
export interface FlatNode {
|
||||||
expandable: boolean;
|
expandable: boolean;
|
||||||
name: string;
|
name: string;
|
||||||
|
handle: string;
|
||||||
level: number;
|
level: number;
|
||||||
isExpanded?: boolean;
|
isExpanded?: boolean;
|
||||||
parent?: CommunityFlatNode;
|
parent?: FlatNode;
|
||||||
community: CommunityForList;
|
community: Community;
|
||||||
}
|
}
|
||||||
|
|
||||||
export class CommunityListDataSource implements DataSource<CommunityFlatNode> {
|
export class CommunityListDataSource implements DataSource<FlatNode> {
|
||||||
|
|
||||||
private communityListSubject = new BehaviorSubject<CommunityFlatNode[]>([]);
|
private communityListSubject = new BehaviorSubject<FlatNode[]>([]);
|
||||||
private loadingSubject = new BehaviorSubject<boolean>(false);
|
private loadingSubject = new BehaviorSubject<boolean>(false);
|
||||||
|
|
||||||
public loading$ = this.loadingSubject.asObservable();
|
public loading$ = this.loadingSubject.asObservable();
|
||||||
|
|
||||||
constructor(private communityListService: CommunityListService) {}
|
constructor(private communityListService: CommunityListService) {
|
||||||
|
}
|
||||||
|
|
||||||
connect(collectionViewer: CollectionViewer): Observable<CommunityFlatNode[]> {
|
connect(collectionViewer: CollectionViewer): Observable<FlatNode[]> {
|
||||||
return this.communityListSubject.asObservable();
|
return this.communityListSubject.asObservable();
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -30,7 +34,7 @@ export class CommunityListDataSource implements DataSource<CommunityFlatNode> {
|
|||||||
this.loadingSubject.complete();
|
this.loadingSubject.complete();
|
||||||
}
|
}
|
||||||
|
|
||||||
loadCommunities(expandedNodes: CommunityFlatNode[]) {
|
loadCommunities(expandedNodes: FlatNode[]) {
|
||||||
this.loadingSubject.next(true);
|
this.loadingSubject.next(true);
|
||||||
|
|
||||||
this.communityListService.getCommunityList()
|
this.communityListService.getCommunityList()
|
||||||
@@ -38,45 +42,74 @@ export class CommunityListDataSource implements DataSource<CommunityFlatNode> {
|
|||||||
take(1),
|
take(1),
|
||||||
catchError(() => of([])),
|
catchError(() => of([])),
|
||||||
finalize(() => this.loadingSubject.next(false)),
|
finalize(() => this.loadingSubject.next(false)),
|
||||||
map((result: CommunityForList[]) => {
|
map((result: Community[]) => {
|
||||||
const communityFlatNodes: CommunityFlatNode[] = [];
|
const flatNodes = this.transformListOfCommunities(result, 0, [], null, expandedNodes);
|
||||||
const level = 0;
|
return flatNodes;
|
||||||
return this.transformListOfCommunities(result, level, communityFlatNodes, null, expandedNodes);
|
|
||||||
})
|
})
|
||||||
)
|
)
|
||||||
.subscribe((communityFlatNode) => {
|
.subscribe((flatNodes) => {
|
||||||
this.communityListSubject.next(communityFlatNode)
|
this.communityListSubject.next(flatNodes)
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
transformListOfCommunities(listOfCommunities: CommunityForList[],
|
transformListOfCommunities(listOfCommunities: Community[],
|
||||||
level: number,
|
level: number,
|
||||||
communityFlatNodes: CommunityFlatNode[],
|
flatNodes: FlatNode[],
|
||||||
parent: CommunityFlatNode,
|
parent: FlatNode,
|
||||||
expandedNodes: CommunityFlatNode[]): CommunityFlatNode[] {
|
expandedNodes: FlatNode[]): FlatNode[] {
|
||||||
level++;
|
level++;
|
||||||
|
if (undefined !== listOfCommunities) {
|
||||||
for (const community of listOfCommunities) {
|
for (const community of listOfCommunities) {
|
||||||
const hasSubComs = ((!!community.subcoms && community.subcoms.length > 0));
|
|
||||||
let expanded = false;
|
let expanded = false;
|
||||||
if (expandedNodes != null) {
|
if (expandedNodes != null) {
|
||||||
const expandedNodesFound = expandedNodes.filter((node) => (node.name === community.name));
|
const expandedNodesFound = expandedNodes.filter((node) => (node.handle === community.handle));
|
||||||
expanded = (expandedNodesFound.length > 0);
|
expanded = (expandedNodesFound.length > 0);
|
||||||
}
|
}
|
||||||
console.log(community.name + 'is expanded: ' + expanded);
|
const communityFlatNode: FlatNode = {
|
||||||
const communityFlatNode: CommunityFlatNode = {
|
expandable: true,
|
||||||
expandable: hasSubComs,
|
|
||||||
name: community.name,
|
name: community.name,
|
||||||
|
handle: community.handle,
|
||||||
level: level,
|
level: level,
|
||||||
isExpanded: expanded,
|
isExpanded: expanded,
|
||||||
|
parent: parent,
|
||||||
community: community,
|
community: community,
|
||||||
parent: parent
|
|
||||||
}
|
}
|
||||||
communityFlatNodes.push(communityFlatNode);
|
flatNodes.push(communityFlatNode);
|
||||||
if (hasSubComs && communityFlatNode.isExpanded) {
|
if (expanded) {
|
||||||
this.transformListOfCommunities(community.subcoms, level, communityFlatNodes, communityFlatNode, expandedNodes);
|
// TODO FIX: Retrieves last subcom or coll as undefined
|
||||||
|
let subcoms: Community[] = [];
|
||||||
|
community.subcommunities.pipe(
|
||||||
|
tap((v) => console.log('subcom tap', v)),
|
||||||
|
take(1)).subscribe((results) => {
|
||||||
|
subcoms = results.payload.page;
|
||||||
|
if (subcoms.length > 0) {
|
||||||
|
this.transformListOfCommunities(subcoms, level, flatNodes, communityFlatNode, expandedNodes);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
let coll: Collection[] = [];
|
||||||
|
community.collections.pipe(
|
||||||
|
tap((v) => console.log('col tap ' ,v)),
|
||||||
|
take(1),
|
||||||
|
)
|
||||||
|
.subscribe((results) => {
|
||||||
|
coll = results.payload.page;
|
||||||
|
for (const collection of coll) {
|
||||||
|
const collectionFlatNode: FlatNode = {
|
||||||
|
expandable: false,
|
||||||
|
name: collection.name,
|
||||||
|
handle: collection.handle,
|
||||||
|
level: level,
|
||||||
|
isExpanded: false,
|
||||||
|
parent: parent,
|
||||||
|
community: community,
|
||||||
|
}
|
||||||
|
flatNodes.push(collectionFlatNode);
|
||||||
|
}
|
||||||
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return communityFlatNodes;
|
}
|
||||||
|
return flatNodes;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@@ -1,24 +1,41 @@
|
|||||||
import {Injectable} from '@angular/core';
|
import {Injectable} from '@angular/core';
|
||||||
import {Observable, of} from 'rxjs';
|
import {Observable, of} from 'rxjs';
|
||||||
|
import {CommunityDataService} from '../core/data/community-data.service';
|
||||||
export interface CommunityForList {
|
import {PaginationComponentOptions} from '../shared/pagination/pagination-component-options.model';
|
||||||
name: string;
|
import {SortDirection, SortOptions} from '../core/cache/models/sort-options.model';
|
||||||
subcoms?: CommunityForList[];
|
import {take} from 'rxjs/operators';
|
||||||
collections?: string[];
|
import {Community} from '../core/shared/community.model';
|
||||||
parent?: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
@Injectable()
|
@Injectable()
|
||||||
export class CommunityListService {
|
export class CommunityListService {
|
||||||
|
|
||||||
private comList: CommunityForList[] = [
|
communities: Community[];
|
||||||
{name: 'com1', subcoms: [{name: 'subcom1', subcoms: [{name: 'subsubcom1'}], collections: null, parent: 'com1'}], collections: ['col1', 'col2'], parent: null},
|
|
||||||
{name: 'com2', subcoms: [{name: 'subcom2', subcoms: null, collections: null, parent: 'com2'}, {name: 'subcom3', subcoms: null, collections: null, parent: 'com2'}], collections: ['col3', 'col4'], parent: null},
|
|
||||||
{name: 'com3', subcoms: [{name: 'subcom4', subcoms: null, collections: null, parent: 'com3'}], collections: ['col5'], parent: null},
|
|
||||||
];
|
|
||||||
|
|
||||||
public getCommunityList(): Observable<CommunityForList[]> {
|
config: PaginationComponentOptions;
|
||||||
return of(this.comList);
|
sortConfig: SortOptions;
|
||||||
|
|
||||||
|
constructor(private cds: CommunityDataService) {
|
||||||
|
this.config = new PaginationComponentOptions();
|
||||||
|
this.config.id = 'top-level-pagination';
|
||||||
|
this.config.pageSize = 100;
|
||||||
|
this.config.currentPage = 1;
|
||||||
|
this.sortConfig = new SortOptions('dc.title', SortDirection.ASC);
|
||||||
|
this.initTopCommunityList()
|
||||||
|
}
|
||||||
|
|
||||||
|
private initTopCommunityList(): void {
|
||||||
|
this.cds.findTop({
|
||||||
|
currentPage: this.config.currentPage,
|
||||||
|
elementsPerPage: this.config.pageSize,
|
||||||
|
sort: { field: this.sortConfig.field, direction: this.sortConfig.direction }
|
||||||
|
}).pipe(take(1)).subscribe((results) => {
|
||||||
|
this.communities = results.payload.page;
|
||||||
|
console.log('ping', this.communities);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
public getCommunityList(): Observable<Community[]> {
|
||||||
|
return of(this.communities);
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@@ -1,6 +1,6 @@
|
|||||||
import {Component, OnInit} from '@angular/core';
|
import {Component, OnInit} from '@angular/core';
|
||||||
import {CommunityListService} from '../CommunityListService';
|
import {CommunityListService} from '../CommunityListService';
|
||||||
import {CommunityFlatNode, CommunityListDataSource} from '../CommunityListDataSource';
|
import {FlatNode, CommunityListDataSource} from '../CommunityListDataSource';
|
||||||
import {FlatTreeControl} from '@angular/cdk/tree';
|
import {FlatTreeControl} from '@angular/cdk/tree';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
@@ -10,9 +10,9 @@ import {FlatTreeControl} from '@angular/cdk/tree';
|
|||||||
})
|
})
|
||||||
export class CommunityListComponent implements OnInit {
|
export class CommunityListComponent implements OnInit {
|
||||||
|
|
||||||
private expandedNodes: CommunityFlatNode[] = [];
|
private expandedNodes: FlatNode[] = [];
|
||||||
|
|
||||||
treeControl = new FlatTreeControl<CommunityFlatNode>(
|
treeControl = new FlatTreeControl<FlatNode>(
|
||||||
(node) => node.level, (node) => node.expandable
|
(node) => node.level, (node) => node.expandable
|
||||||
);
|
);
|
||||||
|
|
||||||
@@ -25,14 +25,14 @@ export class CommunityListComponent implements OnInit {
|
|||||||
this.dataSource.loadCommunities(null);
|
this.dataSource.loadCommunities(null);
|
||||||
}
|
}
|
||||||
|
|
||||||
hasChild = (_: number, node: CommunityFlatNode) => node.expandable;
|
hasChild = (_: number, node: FlatNode) => node.expandable;
|
||||||
|
|
||||||
shouldRender(node: CommunityFlatNode) {
|
shouldRender(node: FlatNode) {
|
||||||
const parent = node.parent;
|
const parent = node.parent;
|
||||||
return !parent || parent.isExpanded;
|
return !parent || parent.isExpanded;
|
||||||
}
|
}
|
||||||
|
|
||||||
toggleExpanded(node: CommunityFlatNode) {
|
toggleExpanded(node: FlatNode) {
|
||||||
if (node.isExpanded) {
|
if (node.isExpanded) {
|
||||||
this.expandedNodes = this.expandedNodes.filter((node2) => node2.name !== node.name);
|
this.expandedNodes = this.expandedNodes.filter((node2) => node2.name !== node.name);
|
||||||
node.isExpanded = false;
|
node.isExpanded = false;
|
||||||
@@ -41,7 +41,6 @@ export class CommunityListComponent implements OnInit {
|
|||||||
node.isExpanded = true;
|
node.isExpanded = true;
|
||||||
}
|
}
|
||||||
this.dataSource.loadCommunities(this.expandedNodes);
|
this.dataSource.loadCommunities(this.expandedNodes);
|
||||||
console.log('Nr of expanded nodes' + this.expandedNodes.length);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user