From cafe0e4926f0d9762cd59a71ce1779743db34771 Mon Sep 17 00:00:00 2001 From: Alex Martzios Date: Thu, 28 Mar 2024 13:07:11 +0200 Subject: [PATCH] [develop | DONE | ADDED] displayClaims: add bulk delete functionality for claims, change the claims cards to a more compact claims list --- .../displayClaims.component.html | 109 ++++++++++-------- .../displayClaims.component.less | 10 -- .../displayClaims/displayClaims.component.ts | 68 +++++++++-- .../claimEntityFormatter.component.ts | 17 +-- .../projectTitleFormatter.component.ts | 2 +- 5 files changed, 133 insertions(+), 73 deletions(-) diff --git a/claims/claim-utils/displayClaims/displayClaims.component.html b/claims/claim-utils/displayClaims/displayClaims.component.html index bdcc74b3..94034a2e 100644 --- a/claims/claim-utils/displayClaims/displayClaims.component.html +++ b/claims/claim-utils/displayClaims/displayClaims.component.html @@ -56,57 +56,76 @@
No links found
- +
+ +
+ diff --git a/claims/claim-utils/displayClaims/displayClaims.component.less b/claims/claim-utils/displayClaims/displayClaims.component.less index 0eadec18..e322586c 100644 --- a/claims/claim-utils/displayClaims/displayClaims.component.less +++ b/claims/claim-utils/displayClaims/displayClaims.component.less @@ -4,14 +4,4 @@ position: relative; padding: 0 20px; height: 100%; - - &::before { - content: ''; - position: absolute; - top: 0; - left: 50%; - right: 0; - bottom: 0; - border-left: @global-border-width solid @global-border; - } } diff --git a/claims/claim-utils/displayClaims/displayClaims.component.ts b/claims/claim-utils/displayClaims/displayClaims.component.ts index 9e5ccf97..8f24cf4d 100644 --- a/claims/claim-utils/displayClaims/displayClaims.component.ts +++ b/claims/claim-utils/displayClaims/displayClaims.component.ts @@ -52,6 +52,7 @@ export class DisplayClaimsComponent implements OnInit, OnDestroy { lastIndexDate = null; public filterForm: FormGroup; public entities: string[] = []; + selected = []; allOptions: Option[] = [ {label: OpenaireEntities.PUBLICATIONS, value: "publication"}, @@ -310,23 +311,34 @@ export class DisplayClaimsComponent implements OnInit, OnDestroy { } isSelected(value: string) { - return this.filterForm && this.filterForm.get('entities').value.find(entity => entity === value) + return this.filterForm && this.filterForm.get('entities').value.find(entity => entity === value); } - deleteOpen(index: number) { + deleteOpen(index: number = null) { this.index = index; this.deleteModal.alertTitle = 'Delete Confirmation'; - this.deleteModal.message = 'Are you sure you want to delete this link?'; + this.deleteModal.message = 'Are you sure you want to delete ' + (this.index != null ? '1' : this.selected.length) + ' link(s)?'; this.deleteModal.okButtonText = 'Yes'; this.deleteModal.open(); } delete() { - this.subscriptions.push(this._claimService.deleteBulk([this.claims[this.index].id], this.properties.claimsAPIURL).subscribe( + let claimsToBeDeleted = ((this.index != null) ? [this.claims[this.index].id] : this.selected.map(claim => claim.id)); + console.log(claimsToBeDeleted); + this.subscriptions.push(this._claimService.deleteBulk(claimsToBeDeleted, this.properties.claimsAPIURL).subscribe( res => { - this.claims.splice(this.index, 1); - this.resultsNum = this.resultsNum - 1; - NotificationHandler.rise('Link has been deleted successfully'); + if (this.index != null) { + this.claims.splice(this.index, 1); + this.resultsNum = this.resultsNum - 1; + NotificationHandler.rise('Link has been deleted successfully'); + } else { + claimsToBeDeleted.forEach(claimId => { + this.claims.splice(this.claims.findIndex((id) => id == claimId), 1); + }); + this.resultsNum = this.resultsNum - claimsToBeDeleted.length; + NotificationHandler.rise(claimsToBeDeleted.length + ' links have been deleted successfully'); + } + this.selected = []; let goToPage = this.page; if (this.totalPages(this.resultsNum) < this.page && this.page > 0) { goToPage = this.page - 1; @@ -334,7 +346,8 @@ export class DisplayClaimsComponent implements OnInit, OnDestroy { this.goTo(goToPage); }, err => { this.handleErrors(err, "Error deleting claim with id: " + this.claims[this.index].id); - })); + } + )); } pageChange($event) { @@ -362,7 +375,44 @@ export class DisplayClaimsComponent implements OnInit, OnDestroy { } return totalPages; } - + + selectClaim(item: any, event) { + let value = event.currentTarget.checked; + if (value) { + this.selected.push(item); + } else { + for (var _i = 0; _i < this.selected.length; _i++) { + let claim = this.selected[_i]; + if (claim['id'] == item.id) { + this.selected.splice(_i, 1); + } + } + } + } + + selectAll(event) { + let value = event.currentTarget.checked; + if (value) { + this.selected = []; + for (let _i = 0; _i < this.claims.length; _i++) { + let claim = this.claims[_i]; + this.selected.push(claim); + } + } else { + this.selected = []; + } + } + + isSelectedClaim(id: string) { + for (let _i = 0; _i < this.selected.length; _i++) { + let claim = this.selected[_i]; + if (claim['id'] == id) { + return true; + } + } + return false; + } + private updateDescription(description: string) { this._meta.updateTag({content: description}, "name='description'"); this._meta.updateTag({content: description}, "property='og:description'"); diff --git a/claims/claim-utils/entityFormatter/claimEntityFormatter.component.ts b/claims/claim-utils/entityFormatter/claimEntityFormatter.component.ts index 6102d684..547e4c16 100644 --- a/claims/claim-utils/entityFormatter/claimEntityFormatter.component.ts +++ b/claims/claim-utils/entityFormatter/claimEntityFormatter.component.ts @@ -15,21 +15,22 @@ import {StringUtils} from "../../../utils/string-utils.class";
{{getEntityName(type)}}
-
- Link to: +
+ Link to:
-
- Link to: +
+ Link to:
-
- Link to: - {{entity.title}} +
+ Link to: +
+ {{entity.title}} +
` }) diff --git a/claims/claim-utils/entityFormatter/projectTitleFormatter.component.ts b/claims/claim-utils/entityFormatter/projectTitleFormatter.component.ts index 92557d9a..14ee0e60 100644 --- a/claims/claim-utils/entityFormatter/projectTitleFormatter.component.ts +++ b/claims/claim-utils/entityFormatter/projectTitleFormatter.component.ts @@ -20,7 +20,7 @@ import {properties} from "../../../../../environments/environment"; - Funder: {{project['funderName']}} + Funder: {{project['funderName']}} ` })