import { Location } from '@angular/common'; import { Component, Input, OnInit } from '@angular/core'; import { UntypedFormBuilder, UntypedFormControl } from '@angular/forms'; import { ActivatedRoute, Router } from '@angular/router'; import { RecentActivityOrder } from '@app/core/common/enum/recent-activity-order'; import { RecentActivityItem } from '@app/core/model/dashboard/recent-activity-item'; import { DescriptionTemplate } from '@app/core/model/description-template/description-template'; import { Description } from '@app/core/model/description/description'; import { Dmp, DmpUser } from '@app/core/model/dmp/dmp'; import { DmpReference } from '@app/core/model/dmp/dmp-reference'; import { FileFormat } from '@app/core/model/file/file-format.model'; import { Reference } from '@app/core/model/reference/reference'; import { RecentActivityItemLookup } from '@app/core/query/recent-activity-item-lookup.lookup'; import { AuthService } from '@app/core/services/auth/auth.service'; import { DashboardService } from '@app/core/services/dashboard/dashboard.service'; import { DmpService } from '@app/core/services/dmp/dmp.service'; import { MatomoService } from '@app/core/services/matomo/matomo-service'; import { EnumUtils } from '@app/core/services/utilities/enum-utils.service'; import { BaseComponent } from '@common/base/base.component'; import { debounceTime, takeUntil } from 'rxjs/operators'; import { nameof } from 'ts-simple-nameof'; @Component({ selector: 'app-recent-edited-activity', templateUrl: './recent-edited-activity.component.html', styleUrls: ['./recent-edited-activity.component.css'] }) export class RecentEditedActivityComponent extends BaseComponent implements OnInit { lookup: RecentActivityItemLookup = new RecentActivityItemLookup(); pageSize: number = 5; listingItems: RecentActivityItem[]; public formGroup = new UntypedFormBuilder().group({ like: new UntypedFormControl(), order: new UntypedFormControl() }); publicMode = false; order = RecentActivityOrder; totalCount: number; startIndex: number = 0; offsetLess: number = 0; page: number = 1; @Input() isActive: boolean = false; constructor( private route: ActivatedRoute, private router: Router, public enumUtils: EnumUtils, private authentication: AuthService, private dashboardService: DashboardService, private location: Location, private matomoService: MatomoService, private dmpService: DmpService ) { super(); } ngOnInit() { this.matomoService.trackPageView('Recent DMP Activity'); this.route.queryParams.subscribe(params => { if (this.isActive) { let page = (params['page'] === undefined) ? 1 : +params['page']; this.page = (page <= 0) ? 1 : page; this.startIndex = (this.page - 1) * this.pageSize; if (this.page > 1) { this.offsetLess = (this.page - 2) * this.pageSize; } let order = params['order']; if (this.isAuthenticated()) { if (order === undefined || (order != this.order.UpdatedAt && order != this.order.Label && order != this.order.Status)) { order = this.order.UpdatedAt; } } else { //TODO refactor // if (order === undefined || (order != this.order.PUBLISHED && order != this.order.LABEL)) { // order = this.order.PUBLISHED; // } } this.formGroup.get('order').setValue(order); let keyword = (params['keyword'] === undefined || params['keyword'].length <= 0) ? "" : params['keyword']; this.formGroup.get("like").setValue(keyword); this.updateUrl(); } }); this.refresh(); } ngOnChanges() { if (this.isActive) { this.updateUrl(); } } updateUrl() { // let parameters = "?type=dmps" + let parameters = "" + (this.page != 1 ? "&page=" + this.page : "") + //TODO refactor (((this.formGroup.get("order").value != this.order.UpdatedAt && !this.publicMode) || (this.formGroup.get("order").value != this.order.Published && this.publicMode)) ? "&order=" + this.formGroup.get("order").value : "") + (this.formGroup.get("like").value ? ("&keyword=" + this.formGroup.get("like").value) : ""); this.location.go(this.router.url.split('?')[0] + parameters); } public isAuthenticated(): boolean { return this.authentication.currentAccountIsAuthenticated(); } refresh(): void { if (!this.formGroup.get('order').value) { this.formGroup.get('order').setValue(this.order.UpdatedAt); } this.lookup.page = { size: this.pageSize, offset: 0 }; this.lookup.orderField = this.formGroup.get('order').value; this.lookup.like = this.formGroup.get('like').value; this.lookup.project = { fields: [ [nameof(x => x.dmp), nameof(x => x.id)].join('.'), [nameof(x => x.dmp), nameof(x => x.label)].join('.'), [nameof(x => x.dmp), nameof(x => x.status)].join('.'), [nameof(x => x.dmp), nameof(x => x.accessType)].join('.'), [nameof(x => x.dmp), nameof(x => x.version)].join('.'), [nameof(x => x.dmp), nameof(x => x.groupId)].join('.'), [nameof(x => x.dmp), nameof(x => x.updatedAt)].join('.'), [nameof(x => x.dmp), nameof(x => x.descriptions), nameof(x => x.id)].join('.'), [nameof(x => x.dmp), nameof(x => x.descriptions), nameof(x => x.label)].join('.'), [nameof(x => x.dmp), nameof(x => x.dmpUsers), nameof(x => x.id)].join('.'), [nameof(x => x.dmp), nameof(x => x.dmpUsers), nameof(x => x.user.id)].join('.'), [nameof(x => x.dmp), nameof(x => x.dmpUsers), nameof(x => x.role)].join('.'), [nameof(x => x.description), nameof(x => x.id)].join('.'), [nameof(x => x.description), nameof(x => x.label)].join('.'), [nameof(x => x.description), nameof(x => x.status)].join('.'), [nameof(x => x.description), nameof(x => x.updatedAt)].join('.'), [nameof(x => x.description), nameof(x => x.descriptionTemplate), nameof(x => x.id)].join('.'), [nameof(x => x.description), nameof(x => x.descriptionTemplate), nameof(x => x.label)].join('.'), [nameof(x => x.description), nameof(x => x.descriptionTemplate), nameof(x => x.groupId)].join('.'), [nameof(x => x.description), nameof(x => x.dmp), nameof(x => x.id)].join('.'), [nameof(x => x.description), nameof(x => x.dmp), nameof(x => x.label)].join('.'), [nameof(x => x.description), nameof(x => x.dmp), nameof(x => x.accessType)].join('.'), [nameof(x => x.description), nameof(x => x.dmp), nameof(x => x.dmpUsers), nameof(x => x.id)].join('.'), [nameof(x => x.description), nameof(x => x.dmp), nameof(x => x.dmpUsers), nameof(x => x.user.id)].join('.'), [nameof(x => x.description), nameof(x => x.dmp), nameof(x => x.dmpUsers), nameof(x => x.role)].join('.'), [nameof(x => x.description), nameof(x => x.dmp), nameof(x => x.dmpReferences), nameof(x => x.id)].join('.'), [nameof(x => x.description), nameof(x => x.dmp), nameof(x => x.dmpReferences), nameof(x => x.reference), nameof(x => x.id)].join('.'), [nameof(x => x.description), nameof(x => x.dmp), nameof(x => x.dmpReferences), nameof(x => x.reference), nameof(x => x.label)].join('.'), [nameof(x => x.description), nameof(x => x.dmp), nameof(x => x.dmpReferences), nameof(x => x.reference), nameof(x => x.type)].join('.'), [nameof(x => x.description), nameof(x => x.dmp), nameof(x => x.dmpReferences), nameof(x => x.reference), nameof(x => x.reference)].join('.'), ] }; this.dashboardService .getMyRecentActivityItems(this.lookup) .pipe(takeUntil(this._destroyed)) .subscribe(response => { this.listingItems = response; //this.totalCount = response.totalCount; //this.totalCountDmps.emit(this.dmpActivities.length); // if (this.totalCount > 0 && this.totalCount <= (this.page - 1) * this.pageSize && this.page > 1) { // let queryParams = { type: "dmps", page: 1, order: this.formGroup.get("order").value }; // if (this.formGroup.get("like").value) { // queryParams['keyword'] = this.formGroup.get("like").value; // } // this.router.navigate(["/home"], { queryParams: queryParams }) // } // this.totalCount < this.pageSize ? this.totalCountDmps.emit(response.totalCount) : this.totalCountDmps.emit(this.pageSize); // this.totalCountDmps.emit(this.totalCount); // this.dmpActivities.forEach(dmpActivity => { // const recentActivity: RecentActivity = { // activityData: dmpActivity, // activityType: RecentActivityType.Dmp // }; // this.allRecentActivities.push(recentActivity) // }) }); this.formGroup.get('like').valueChanges .pipe(takeUntil(this._destroyed), debounceTime(500)) .subscribe(x => this.refresh()); this.formGroup.get('order').valueChanges .pipe(takeUntil(this._destroyed)) .subscribe(x => this.refresh()); } }