[Library | Trunk]: 1. Icons remove line-height. 2. Role-users: Fix UI

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@60534 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
k.triantafyllou 2021-03-01 17:32:21 +00:00
parent 61a50fbf69
commit 39dada9c53
6 changed files with 41 additions and 26 deletions

View File

@ -43,15 +43,16 @@
<div *ngIf="(showActive && active.length > 0) || (!showActive && pending.length > 0)">
<div class="uk-card uk-card-default uk-card-body uk-text-small uk-margin-bottom"
*ngFor="let item of (showActive)?active:pending">
<div class="uk-grid uk-grid-divider uk-flex uk-flex-middle" uk-grid>
<div class="uk-width-3-4@l uk-width-1-2@m">
<div class="uk-grid uk-grid-divider uk-flex-middle" uk-grid>
<div class="uk-width-expand@m uk-width-1-1">
<div class="uk-padding-small uk-padding-remove-horizontal">
<span class="uk-text-muted">Email: </span>
<span class="uk-text-bold">{{(showActive) ? item.email : item}}</span>
</div>
</div>
<div *ngIf="isCurator || !showActive" class="uk-width-expand">
<div class="uk-padding-small uk-padding-remove-horizontal uk-flex uk-flex-center">
<div *ngIf="isCurator || !showActive" class="uk-width-auto@m uk-width-1-1">
<div class="uk-width-1-1 uk-flex uk-flex-center">
<div class="uk-padding-small uk-padding-remove-horizontal">
<a (click)="openDeleteModal(item)" class="uk-button action uk-flex uk-flex-middle">
<icon name="remove_circle_outline" ratio="0.7" [flex]="true"></icon>
<span class="uk-margin-small-left">{{showActive ? ('Remove ' + role) : 'Cancel invitation'}}</span>
@ -63,6 +64,7 @@
</div>
</div>
</div>
</div>
</div>
<modal-alert #inviteModal (alertOutput)="invite()" [okDisabled]="invited && invited.invalid">
<div class="uk-padding uk-padding-remove-horizontal">

View File

@ -1,17 +1,20 @@
<div page-content>
<div header>
<ng-content></ng-content>
<div [class.uk-invisible]="loading" class="uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
<div [class.uk-invisible]="loading"
class="uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
<div search-input [control]="filterForm.controls.keyword" [showSearch]="false" placeholder="Search"
[bordered]="true" colorClass="uk-text-secondary" toggleTitle="locate subscribers"></div>
<div>
<a *ngIf="exists" class="uk-text-uppercase uk-flex uk-flex-middle" [class.uk-disabled]="!subscriberInvite || subscriberInvite.loading" (click)="openInviteModal()">
<a *ngIf="exists" class="uk-text-uppercase uk-flex uk-flex-middle"
[class.uk-disabled]="!subscriberInvite || subscriberInvite.loading" (click)="openInviteModal()">
<button class="uk-icon-button large uk-button-secondary">
<icon name="person_add"></icon>
</button>
<button class="uk-button uk-button-link uk-margin-small-left uk-text-secondary">Invite Subscribers</button>
</a>
<a *ngIf="!exists && isPortalAdmin" class="uk-text-uppercase uk-flex uk-flex-middle" (click)="openCreateRoleModal()">
<a *ngIf="!exists && isPortalAdmin" class="uk-text-uppercase uk-flex uk-flex-middle"
(click)="openCreateRoleModal()">
<button class="uk-icon-button large uk-button-secondary">
<icon name="person_add"></icon>
</button>
@ -39,15 +42,16 @@
<div class="uk-card uk-card-default uk-card-body uk-text-small uk-margin-bottom"
*ngFor="let item of showSubscribers.slice((page - 1)*pageSize, page*pageSize)">
<div class="uk-grid uk-grid-divider uk-flex uk-flex-middle" uk-grid>
<div class="uk-width-3-4@l uk-width-1-2@m">
<div class="uk-width-expand@m uk-width-1-1">
<div class="uk-padding-small uk-padding-remove-horizontal">
<span class="uk-text-muted">Email: </span>
<span class="uk-text-bold">{{item.email}}</span>
</div>
</div>
<div class="uk-width-expand">
<div class="uk-padding-small uk-padding-remove-horizontal uk-flex uk-flex-center">
<a (click)="openDeleteModal(item)" class="uk-button action uk-flex uk-flex-middle">
<div class="uk-width-auto@m uk-width-1-1">
<div class="uk-width-1-1 uk-flex uk-flex-center">
<div class="uk-padding-small uk-padding-remove-horizontal">
<a (click)="openDeleteModal(item)" class="uk-button action uk-flex uk-flex-middle" [class.uk-disabled]="!!item.isManager">
<icon name="remove_circle_outline" ratio="0.7" [flex]="true"></icon>
<span class="uk-margin-small-left">Remove subscriber</span>
</a>
@ -56,6 +60,7 @@
</div>
</div>
</div>
</div>
<no-load-paging *ngIf="showSubscribers.length > pageSize" [type]="'subscribers'"
(pageChange)="updatePage($event)"
[page]="page" [pageSize]="pageSize"
@ -65,7 +70,8 @@
</div>
</div>
</div>
<modal-alert *ngIf="user" #inviteModal (alertOutput)="subscriberInvite.invite()" [okDisabled]="!subscriberInvite.valid" [large]="true">
<modal-alert *ngIf="user" #inviteModal (alertOutput)="subscriberInvite.invite()" [okDisabled]="!subscriberInvite.valid"
[large]="true">
<div class="uk-padding uk-padding-remove-horizontal">
<subscriber-invite #subscriberInvite [user]="user"></subscriber-invite>
</div>

View File

@ -18,6 +18,7 @@ import {Role, Session, User} from "../../../login/utils/helper.class";
import {UserManagementService} from "../../../services/user-management.service";
import {Router} from "@angular/router";
import {SubscriberInviteComponent} from "../../../sharedComponents/subscriber-invite/subscriber-invite.component";
import {zip} from "rxjs";
declare var UIkit;
@ -38,6 +39,7 @@ export class SubscribersComponent implements OnInit, OnDestroy, OnChanges {
@Input()
public message: string = null;
public user: User = null;
public managers: any[];
public subscribers: any[];
public showSubscribers: any[];
public subs: any[] = [];
@ -93,8 +95,14 @@ export class SubscribersComponent implements OnInit, OnDestroy, OnChanges {
updateList() {
this.loading = true;
this.subs.push(this.userRegistryService.getActiveEmail(this.type, this.id, 'member').subscribe(users => {
this.subscribers = users;
let data = zip(this.userRegistryService.getActiveEmail(this.type, this.id, 'manager'),
this.userRegistryService.getActiveEmail(this.type, this.id, 'member'));
this.subs.push(data.subscribe(users => {
this.managers = users[0];
this.subscribers = users[1];
this.subscribers.forEach(subscriber => {
subscriber['isManager'] = this.managers.find(manager => manager.email === subscriber.email);
});
this.filterBySearch(this.filterForm.value.keyword);
this.loading = false;
this.exists = true;

View File

@ -63,6 +63,6 @@ export class IconsComponent implements OnInit{
fill: this.fill,
stroke: this.stroke
};
this.elementRef.nativeElement.style = 'line-height: ' + this.ratio*20 + 'px;';
//this.elementRef.nativeElement.style = 'line-height: ' + this.ratio*20 + 'px; height: 20px';
}
}

View File

@ -15,9 +15,7 @@ declare var UIkit: any;
<h6 *ngIf="isDashboard" class="uk-text-bold">{{alertTitle}}</h6>
</div>
<div class="uk-margin">
<div [hidden]=!alertMessage>
{{message}}
</div>
<div *ngIf="message" [hidden]=!alertMessage [innerHTML]="message | safeHtml"></div>
<ng-content></ng-content>
</div>
<div class="uk-grid uk-flex uk-flex-middle">

View File

@ -4,9 +4,10 @@ import { FormsModule } from '@angular/forms';
import {AlertModal} from './alert';
import {ModalModule} from './modal.module';
import {SafeHtmlPipeModule} from "../pipes/safeHTMLPipe.module";
@NgModule({
imports: [ CommonModule, FormsModule, ModalModule ],
imports: [CommonModule, FormsModule, ModalModule, SafeHtmlPipeModule],
declarations: [
AlertModal
],