From b3e926164b35574f31b6a2a6095fe2f3864ea646 Mon Sep 17 00:00:00 2001 From: "k.triantafyllou" Date: Tue, 5 Jul 2022 16:41:11 +0300 Subject: [PATCH] Change card of a Claim base on new UI --- .../displayClaims.component.html | 57 ++++++++++++------- .../displayClaims.component.less | 17 ++++++ .../displayClaims/displayClaims.component.ts | 1 + .../displayClaims/displayClaims.module.ts | 8 ++- .../claimEntityFormatter.component.ts | 38 +++++++------ .../publicationTitleFormatter.component.ts | 39 ++++--------- 6 files changed, 93 insertions(+), 67 deletions(-) create mode 100644 claims/claim-utils/displayClaims/displayClaims.component.less diff --git a/claims/claim-utils/displayClaims/displayClaims.component.html b/claims/claim-utils/displayClaims/displayClaims.component.html index d862fff3..dcb6460b 100644 --- a/claims/claim-utils/displayClaims/displayClaims.component.html +++ b/claims/claim-utils/displayClaims/displayClaims.component.html @@ -32,11 +32,13 @@ -
+
+
+
-
+
@@ -54,37 +56,48 @@
  • -
    +
    - available - - pending + available + + pending +
    - -
    Claimed by: - {{claim.userMail}} - Claimed date: {{claim.date}}
    - - +
    + Claimed by: + {{claim.userMail}} +
    +
    + Claimed date: + {{claim.date}} +
    +
    +
    + +
    +
    +
    + + +
    - +
diff --git a/claims/claim-utils/displayClaims/displayClaims.component.less b/claims/claim-utils/displayClaims/displayClaims.component.less new file mode 100644 index 00000000..0eadec18 --- /dev/null +++ b/claims/claim-utils/displayClaims/displayClaims.component.less @@ -0,0 +1,17 @@ +@import (reference) "~src/assets/openaire-theme/less/_import-variables"; + +.claim-divider { + 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 b502e4cf..bba6a2bd 100644 --- a/claims/claim-utils/displayClaims/displayClaims.component.ts +++ b/claims/claim-utils/displayClaims/displayClaims.component.ts @@ -24,6 +24,7 @@ import {DropdownFilterComponent} from "../../../utils/dropdown-filter/dropdown-f @Component({ selector: 'displayClaims', templateUrl: 'displayClaims.component.html', + styleUrls: ['displayClaims.component.less'] }) export class DisplayClaimsComponent { @Input() piwikSiteId = null; diff --git a/claims/claim-utils/displayClaims/displayClaims.module.ts b/claims/claim-utils/displayClaims/displayClaims.module.ts index d1a53541..6ecda833 100644 --- a/claims/claim-utils/displayClaims/displayClaims.module.ts +++ b/claims/claim-utils/displayClaims/displayClaims.module.ts @@ -24,6 +24,8 @@ import {LoadingModule} from '../../../utils/loading/loading.module'; import {NoLoadPaging} from "../../../searchPages/searchUtils/no-load-paging.module"; import {IconsModule} from "../../../utils/icons/icons.module"; import {DropdownFilterModule} from "../../../utils/dropdown-filter/dropdown-filter.module"; +import {IconsService} from "../../../utils/icons/icons.service"; +import {link} from "../../../utils/icons/icons"; @NgModule({ imports: [ @@ -40,4 +42,8 @@ import {DropdownFilterModule} from "../../../utils/dropdown-filter/dropdown-filt DisplayClaimsComponent ] }) -export class DisplayClaimsModule { } +export class DisplayClaimsModule { + constructor(private iconsService: IconsService) { + this.iconsService.registerIcons([link]) + } +} diff --git a/claims/claim-utils/entityFormatter/claimEntityFormatter.component.ts b/claims/claim-utils/entityFormatter/claimEntityFormatter.component.ts index e62a5d4a..d48853f4 100644 --- a/claims/claim-utils/entityFormatter/claimEntityFormatter.component.ts +++ b/claims/claim-utils/entityFormatter/claimEntityFormatter.component.ts @@ -1,6 +1,8 @@ import {Component, Input} from '@angular/core'; import {EnvProperties} from '../../../utils/properties/env-properties'; import {ClaimDBContext, ClaimDBProject, ClaimDBResult} from "../claimHelper.class"; +import {OpenaireEntities} from "../../../utils/properties/searchFields"; +import {StringUtils} from "../../../utils/string-utils.class"; //Usage Example " " @@ -9,22 +11,25 @@ import {ClaimDBContext, ClaimDBProject, ClaimDBResult} from "../claimHelper.clas selector: 'claim-entity', template: `
-
{{type == 'publication'?'publication':(type == 'dataset'?'research data':(type == 'other'?'other':'software'))}}
- - Link to {{type == 'publication'?'publication':(type == 'dataset'?'research data':(type == 'other'?'other':'software'))}}: - + [attr.uk-tooptip]="getEntityName(type)"> +
+ {{getEntityName(type)}} +
+
+ Link to: + +
- -
- Link to project: - +
+ Link to:
-
- Link to community: {{entity.title}} +
+ Link to: + {{entity.title}}
` }) @@ -35,13 +40,14 @@ export class ClaimEntityFormatter { @Input() properties: EnvProperties; @Input() externalPortalUrl: string = null; @Input() source: boolean = true; + public openAIREEntities = OpenaireEntities; constructor() { } - - ngOnInit() { + + public getEntityName(entityType:string) { + return StringUtils.getEntityName(entityType); } - - + } diff --git a/claims/claim-utils/entityFormatter/publicationTitleFormatter.component.ts b/claims/claim-utils/entityFormatter/publicationTitleFormatter.component.ts index 566b133a..b51d7761 100644 --- a/claims/claim-utils/entityFormatter/publicationTitleFormatter.component.ts +++ b/claims/claim-utils/entityFormatter/publicationTitleFormatter.component.ts @@ -6,41 +6,24 @@ import {RouterHelper} from '../../../utils/routerHelper.class'; @Component({ selector: 'publication-title', template: ` - - - {{entity.title?entity.title:"[No title available]"}} - - - - - {{entity.title}} - - - - - - + +
+ {{entity.title?entity.title:"[No title available]"}} +
+ + +
+ {{entity.title?entity.title:"[No title available]"}} +
+ ` }) export class PublicationTitleFormatter { - // @Input() title: string; - // @Input() url: string; - // @Input() id: string; @Input() param: string; @Input() path: string; @Input() entity: any; @Input() externalPortalUrl: string = null; public routerHelper: RouterHelper = new RouterHelper(); - - constructor() { - } - - ngOnInit() { - - } - - }