Fix my claims and admin claims pages with new UI.

This commit is contained in:
Konstantinos Triantafyllou 2022-07-05 17:48:28 +03:00
parent 8c349cc817
commit db5c95fe24
6 changed files with 47 additions and 54 deletions

View File

@ -81,13 +81,12 @@
</div> </div>
</div> </div>
</div> </div>
<div> <div class="uk-visible@m">
<div class="claim-divider"> <div class="claim-divider">
<icon class="uk-position-center uk-background-default" name="link" customClass="uk-text-primary" ratio="2" [flex]="true"></icon> <icon class="uk-position-center uk-background-default" name="link" customClass="uk-text-primary" ratio="2" [flex]="true"></icon>
</div> </div>
</div> </div>
<div class="uk-width-1-3 uk-width-2-5@m uk-flex uk-flex-column uk-flex-center"> <div class="uk-width-1-2@m uk-width-1-1 uk-flex uk-flex-column uk-flex-center">
<!-- <span class="title">Link to:</span> -->
<claim-entity [entity]="claim.source" [type]="claim.sourceType" [source]="false" [properties]=properties <claim-entity [entity]="claim.source" [type]="claim.sourceType" [source]="false" [properties]=properties
[externalPortalUrl]=externalPortalUrl></claim-entity> [externalPortalUrl]=externalPortalUrl></claim-entity>
</div> </div>

View File

@ -15,21 +15,21 @@ import {StringUtils} from "../../../utils/string-utils.class";
<div *ngIf="source" class="uk-text-small"> <div *ngIf="source" class="uk-text-small">
{{getEntityName(type)}} {{getEntityName(type)}}
</div> </div>
<div class="uk-flex uk-flex-middle"> <div class="uk-flex">
<span *ngIf="!source" class="uk-text-meta uk-margin-small-right uk-text-large">Link to:</span> <span *ngIf="!source" class="uk-text-meta uk-margin-small-right uk-text-large uk-text-nowrap">Link to:</span>
<publication-title [entity]="entity" param="id" <publication-title [entity]="entity" param="id"
path="/search/result" [externalPortalUrl]=externalPortalUrl></publication-title> path="/search/result" [externalPortalUrl]=externalPortalUrl></publication-title>
</div> </div>
</div> </div>
<div *ngIf="type == 'project'" [attr.uk-tooptip]="getEntityName(type)" <div *ngIf="type == 'project'" [attr.uk-tooptip]="getEntityName(type)"
class="uk-flex uk-flex-middle"> class="uk-flex">
<span class="uk-text-meta uk-margin-small-right uk-text-large">Link to:</span> <span class="uk-text-meta uk-margin-small-right uk-text-large uk-text-nowrap">Link to:</span>
<project-title [project]="entity" [searchLink]=properties.searchLinkToProject <project-title [project]="entity" [searchLink]=properties.searchLinkToProject
[externalPortalUrl]=externalPortalUrl></project-title> [externalPortalUrl]=externalPortalUrl></project-title>
</div> </div>
<div *ngIf="type == 'context'" uk-tooltip="Concept" class="uk-flex uk-flex-middle uk-text-large"> <div *ngIf="type == 'context'" class="uk-flex uk-text-large">
<span class="uk-text-meta uk-margin-small-right">Link to:</span> <span class="uk-text-meta uk-margin-small-right uk-text-nowrap">Link to:</span>
<span class="uk-text-truncate">{{entity.title}}</span> <span class="uk-text-truncate" uk-tooltip="Concept">{{entity.title}}</span>
</div> </div>
` `
}) })

View File

@ -7,24 +7,26 @@ import {properties} from "../../../../../environments/environment";
@Component({ @Component({
selector: 'project-title', selector: 'project-title',
template: ` template: `
<span *ngIf="externalPortalUrl" class="project-title uk-text-large"> <ng-container>
<span><a <h6 class="uk-margin-remove multi-line-ellipsis lines-2">
[href]="externalPortalUrl + projectUrl + '?projectId='+project['openaireId']">{{(project['acronym'] ? ('[' + project['acronym'] + '] ') : '')}}{{project['name']}}</a></span> <p class="uk-margin-remove">
</span> <a *ngIf="externalPortalUrl" [href]="externalPortalUrl + projectUrl + '?projectId='+project['openaireId']" class="uk-link uk-link-heading">
<span *ngIf="!externalPortalUrl" class="project-title uk-text-large"> {{(project['acronym'] ? ('[' + project['acronym'] + '] ') : '')}}{{project['name']}}
<span><a [queryParams]="routerHelper.createQueryParam('projectId',project['openaireId'])" </a>
routerLinkActive="router-link-active" <a *ngIf="!externalPortalUrl" [routerLink]="projectUrl" [queryParams]="routerHelper.createQueryParam('projectId',project['openaireId'])" class="uk-link uk-link-heading">
[routerLink]="projectUrl">{{(project['acronym'] ? ('[' + project['acronym'] + '] ') : '')}}{{project['name']}} </a></span> {{(project['acronym'] ? ('[' + project['acronym'] + '] ') : '')}}{{project['name']}}
</span> </a>
</p>
<span *ngIf="project['funderName']"> </h6>
<span class="uk-text-muted title"> Funder: </span>{{project['funderName']}} </ng-container>
<span *ngIf="project['funderName']" class="uk-margin-small-top">
<span class="uk-text-muted">Funder: </span>{{project['funderName']}}
</span> </span>
` `
}) })
export class ProjectTitleFormatter { export class ProjectTitleFormatter {
@Input() project: string[]; @Input() project: any;
@Input() searchLink: string; @Input() searchLink: string;
@Input() externalPortalUrl: string = null; @Input() externalPortalUrl: string = null;
public url: string; public url: string;

View File

@ -6,15 +6,13 @@ import {RouterHelper} from '../../../utils/routerHelper.class';
@Component({ @Component({
selector: 'publication-title', selector: 'publication-title',
template: ` template: `
<ng-container *ngIf="!externalPortalUrl && entity.openaireId"> <ng-container *ngIf="entity.openaireId">
<h6 class="uk-margin-remove"> <h6 class="uk-margin-remove multi-line-ellipsis lines-2">
<a [queryParams]="routerHelper.createQueryParam(param,entity.openaireId)" <p class="uk-margin-remove">
<a *ngIf="!externalPortalUrl" [queryParams]="routerHelper.createQueryParam(param,entity.openaireId)"
[routerLink]="path" class="uk-link uk-link-heading">{{entity.title?entity.title:"[No title available]"}}</a> [routerLink]="path" class="uk-link uk-link-heading">{{entity.title?entity.title:"[No title available]"}}</a>
</h6> <a *ngIf="externalPortalUrl" [href]="externalPortalUrl + path+'?'+param+'='+entity.openaireId" class="uk-link uk-link-heading custom-external">{{entity.title?entity.title:"[No title available]"}}</a>
</ng-container> </p>
<ng-container *ngIf="externalPortalUrl && entity.openaireId">
<h6 class="uk-margin-remove">
<a [href]="externalPortalUrl + path+'?'+param+'='+entity.openaireId" class="uk-link uk-link-heading custom-external">{{entity.title?entity.title:"[No title available]"}}</a>
</h6> </h6>
</ng-container> </ng-container>
` `

View File

@ -10,13 +10,13 @@ import {Subscriber} from "rxjs";
@Component({ @Component({
selector: 'claims-admin', selector: 'claims-admin',
template: ` template: `
<div id="tm-main" [class]="((isConnect)?'':'uk-section') +' uk-padding-remove-top tm-middle'"> <div class="uk-section">
<div uk-grid class="uk-margin-small-top"> <div uk-grid class="uk-margin-small-top">
<div class="tm-main uk-width-1-1@s uk-width-1-1@m uk-width-1-1@l uk-row-first "> <div class="tm-main uk-width-1-1@s uk-width-1-1@m uk-width-1-1@l uk-row-first ">
<div [class.uk-container]="!isConnect" [class.uk-container-large]="!isConnect"> <div [class.uk-container]="!isConnect" [class.uk-container-large]="!isConnect">
<div *ngIf="!isConnect" class="uk-article-title custom-article-title"> <h1 *ngIf="!isConnect" class="uk-h2">
Manage links Manage links
</div> </h1>
<div> <div>
<displayClaims *ngIf="user" [user]="user" [enableDelete]=true [myClaims]=false <displayClaims *ngIf="user" [user]="user" [enableDelete]=true [myClaims]=false
[isAdmin]=true [fetchBy]="(fetchId=='openaire')?null:fetchBy" [isAdmin]=true [fetchBy]="(fetchId=='openaire')?null:fetchBy"

View File

@ -8,19 +8,15 @@ import {Subscriber} from "rxjs";
@Component({ @Component({
selector: 'my-claims', selector: 'my-claims',
template: ` template: `
<div id="tm-main" class=" uk-section uk-padding-remove-top tm-middle"> <div class="uk-section">
<div class="uk-grid uk-margin-small-top" >
<div class="tm-main uk-width-1-1@s uk-width-1-1@m uk-width-1-1@l uk-row-first ">
<div class="uk-container uk-container-large"> <div class="uk-container uk-container-large">
<div class="uk-article-title custom-article-title"> <h1 class="uk-h2 uk-margin-remove">
My links My links
</div> </h1>
<div class="uk-text-meta">
<div class=" ">
Manage your links in OpenAIRE Manage your links in OpenAIRE
</div> </div>
<div> <div class="uk-margin-top">
<displayClaims *ngIf="user" [user]="user" [enableDelete]=true [myClaims]=true [isAdmin]=false [showUserEmail]=false <displayClaims *ngIf="user" [user]="user" [enableDelete]=true [myClaims]=true [isAdmin]=false [showUserEmail]=false
[claimsInfoURL]=claimsInfoURL [communityId]=communityId [claimsInfoURL]=claimsInfoURL [communityId]=communityId
[piwikSiteId]="piwikSiteId" pageTitle="My links"> [piwikSiteId]="piwikSiteId" pageTitle="My links">
@ -28,8 +24,6 @@ import {Subscriber} from "rxjs";
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
` `
}) })