135 lines
6.0 KiB
HTML
135 lines
6.0 KiB
HTML
<div class="uk-padding uk-padding-remove-top uk-text-large uk-text-center uk-width">Edit Personal Info</div>
|
|
<div class="uk-flex uk-grid-divider" uk-grid>
|
|
<div *ngIf="showLoading" class="uk-animation-fade uk-width-1-1" role="alert">
|
|
<span class="loading-gif uk-align-center"></span>
|
|
</div>
|
|
<table *ngIf="curatorId != null && curator != null && !showLoading" class="uk-width-1-2 uk-align-center">
|
|
<tbody class="uk-table uk-align-center">
|
|
<tr *ngIf="curator.email != null" >
|
|
<td for="email" class="uk-text-bold uk-text-right">E-mail:</td>
|
|
<td class="uk-text-left">
|
|
{{curator.email}}
|
|
</td>
|
|
</tr>
|
|
<tr *ngIf="curator.name != null">
|
|
<td for="name" class="uk-text-bold uk-text-right">
|
|
Name
|
|
<span class="uk-text-danger uk-text-bold">
|
|
*
|
|
</span>
|
|
:
|
|
</td>
|
|
<td class="uk-text-left">
|
|
<div *ngIf="!curator.name || curator.name === ''" class=" uk-text-danger uk-text-small style=display:none"> Please add name. </div>
|
|
<input type="text"
|
|
class="form-control uk-input uk-width-large@l uk-width-medium@s" id="name"
|
|
[(ngModel)]="curator.name" (input)="onNameChange()" #name="ngModel" required>
|
|
</td>
|
|
</tr>
|
|
<tr *ngIf="photo != null">
|
|
<td for="photo" class="uk-text-bold uk-align-right">Photo:</td>
|
|
<td class="uk-text-left">
|
|
<div class="uk-flex uk-flex-middle">
|
|
<div class="uk-width-1-3">
|
|
<img class="uk-border-circle curator-photo" src="{{photo}}" alt="Curator Photo">
|
|
</div>
|
|
<div uk-form-custom>
|
|
<input id="photo" type="file" (change)="fileChangeEvent($event)" (input)="change()"/>
|
|
<button class="uk-button portal-button" type="button" tabindex="-1">
|
|
Update your photo
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr *ngIf="curator.bio != null">
|
|
<td for="bio" class="uk-text-bold uk-text-right">Biography:</td>
|
|
<td class="uk-text-left">
|
|
<textarea placeholder={{curator.bio}} type="text"
|
|
class="form-control uk-textarea uk-width-large@l uk-width-medium@s" rows="6"
|
|
id="bio"
|
|
[(ngModel)]="curator.bio"
|
|
(input)="change()">
|
|
</textarea>
|
|
</td>
|
|
</tr>
|
|
<tr *ngIf="curator.bio != null">
|
|
<td class="uk-text-right"></td>
|
|
<td class="uk-text-left">
|
|
<div class="uk-text-danger uk-text-bold">
|
|
* Required fields
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="uk-text-right"></td>
|
|
<td>
|
|
<div *ngIf="updateErrorMessage" class="uk-alert uk-alert-danger" role="alert">{{updateErrorMessage}}</div>
|
|
<div *ngIf="warning" class="uk-alert uk-alert-warning" role="alert">{{warning}}</div>
|
|
<div *ngIf="successfulSaveMessage" class="uk-alert uk-alert-success" role="alert">{{successfulSaveMessage}}</div>
|
|
<div *ngIf="successfulResetMessage" class="uk-alert uk-alert-warning" role="alert">{{successfulResetMessage}}</div>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<div *ngIf="curatorId != null && curator != null && !showLoading" class="uk-width-1-2">
|
|
<div class="uk-margin uk-flex uk-flex-middle" uk-grid>
|
|
<h3 class="uk-h3 uk-width-2-5">My Affiliations
|
|
</h3>
|
|
<div class="uk-width-expand ">
|
|
<button class="uk-button portal-button uk-align-right" (click)="initAffiliation()">
|
|
<span uk-icon="plus"></span>
|
|
Add new Affiliation
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<ul class="uk-list uk-list-divider uk-margin uk-height-max-large uk-overflow-auto">
|
|
<li *ngFor="let result of curator.affiliations; let i=index" class="uk-animation-fade uk-margin-auto uk-height-small uk-flex uk-flex-middle" uk-grid>
|
|
<div class="uk-width-1-5 uk-card uk-card-default uk-card-body affiliation-card uk-inline">
|
|
<img class="uk-border-rounded uk-position-center" src="{{result.logoUrl}}" width="80" height="80" alt="{{result.name}}">
|
|
</div>
|
|
<div class="uk-width-3-5">
|
|
<h3 class="uk-h3">{{result.name}}</h3>
|
|
<a href="{{result.websiteUrl}}" class="uk-margin-auto-top" target="_blank">{{result.websiteUrl}}</a>
|
|
</div>
|
|
<div class="uk-width-1-5 uk-card">
|
|
<button class="uk-icon-button uk-icon uk-button-secondary" title="Edit" uk-icon="pencil" (click)="chooseAffiliation(i, 'edit')"></button>
|
|
<button class="uk-icon-button uk-icon uk-button-danger" title="Remove" uk-icon="minus" (click)="chooseAffiliation(i)"></button>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<sticky [enabled]="hasChanged && !!enabled" (save)="updateCurator()" (cancel)="resetForm()"></sticky>
|
|
<modal-alert #affiliationModal [okDisabled]="isEmptyAffiliation()" (alertOutput)="addAffiliation()">
|
|
<table>
|
|
<tbody class="uk-table uk-align-center">
|
|
<tr>
|
|
<td for="name" class="uk-text-bold uk-text-right">Name:</td>
|
|
<td class="uk-text-left">
|
|
<input type="text"
|
|
class="form-control uk-input uk-width-large@l uk-width-medium@s" id="afname"
|
|
[(ngModel)]="affiliation.name" >
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td for="name" class="uk-text-bold uk-text-right">Logo Url:</td>
|
|
<td class="uk-text-left">
|
|
<input type="text"
|
|
class="form-control uk-input uk-width-large@l uk-width-medium@s" id="logourl"
|
|
[(ngModel)]="affiliation.logoUrl">
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td for="name" class="uk-text-bold uk-text-right">Website Url:</td>
|
|
<td class="uk-text-left">
|
|
<input type="text"
|
|
class="form-control uk-input uk-width-large@l uk-width-medium@s" id="websiteurl"
|
|
[(ngModel)]="affiliation.websiteUrl">
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</modal-alert>
|
|
<modal-alert #removeAffiliationModal [okDisabled]="isEmptyAffiliation()" (alertOutput)="removeAffiliation()">
|
|
</modal-alert>
|