MaDgIK
/
openaire-library
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

tabs: add disabled tab, 

Content providers add check for other > 0
This commit is contained in:
argirok 2022-04-06 18:02:15 +03:00
parent 9630d27fe8
commit 44bb9772a9
3 changed files with 14 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
landingPages/dataProvider/dataProvider.component.html
View File

@ -122,7 +122,7 @@
[tabTitle]="'Software'" [tabNumber]="fetchSoftware.searchUtils.totalResults"
[tabId]="'software'">
</my-tab>
<my-tab
<my-tab *ngIf="fetchOrps.searchUtils.totalResults > 0"
[tabTitle]="'Other Research'" [tabNumber]="fetchOrps.searchUtils.totalResults"
[tabId]="'other'">

2
utils/tabs/tab.component.ts
View File

@ -28,5 +28,5 @@ export class TabComponent {
@Input('tabId') tabId: string;
@Input('tabIcon') tabIcon: TabIcon;
@Input ('active') active: boolean = false;
// @Input ('loaded') loaded: boolean = false;
@Input ('disabled') disabled: boolean = false;
}

23
utils/tabs/tabs.component.ts
View File

@ -27,12 +27,13 @@ import {TabComponent} from './tab.component';
<ng-container *ngIf="!tab.customClass">
<li [ngClass]="tab.customClass" (click)="selectTab(tab)" >
<ul class="uk-tab">
<li [class.uk-active]="tab.active">
<li [class.uk-active]="tab.active" [class.uk-disabled]="tab.disabled">
<a class="uk-width-1-1 uk-height-1-1 uk-flex uk-flex-center" [ngClass]="tab.tabIcon ? 'uk-flex-column' : ''">
<icon *ngIf="tab.tabIcon" [svg]="tab.tabIcon.svg" [ratio]="tab.tabIcon.ratio?tab.tabIcon.ratio:1" class="uk-margin-small-bottom"
[ngClass]="(selected === tab.tabId)?tab.tabIcon.active:null"></icon>
<div>{{tab.title}}</div>
<div *ngIf="tab.num" class="">({{tab.num | number}})</div>
<div *ngIf="tab.num && !tab.disabled" class="">({{tab.num | number}})</div>
<div *ngIf="tab.disabled" class="">(-)</div>
</a>
</li>
</ul>
@ -50,22 +51,22 @@ import {TabComponent} from './tab.component';
</div>
</div>
</div>
<div class="uk-width-small uk-padding-small">
<ul class="uk-tab">
<ng-container *ngFor="let tab of tabs.toArray(); let i=index">
<ng-container *ngIf="tab.customClass">
<ng-container *ngFor="let tab of tabs.toArray(); let i=index">
<ng-container *ngIf="tab.customClass">
<div class="uk-width-small uk-padding-small">
<ul class="uk-tab">
<li [ngClass]="tab.customClass" (click)="selectTab(tab)" [class.uk-active]="tab.active" >
<a class="uk-width-1-1 uk-height-1-1 uk-flex uk-flex-center" [ngClass]="tab.tabIcon ? 'uk-flex-column' : ''">
<icon *ngIf="tab.tabIcon" [svg]="tab.tabIcon.svg" [ratio]="tab.tabIcon.ratio?tab.tabIcon.ratio:1" class="uk-margin-small-bottom"
[ngClass]="(selected === tab.tabId)?tab.tabIcon.active:null"></icon>
<div>{{tab.title}} {{tab.active}}</div>
<div>{{tab.title}}</div>
<div *ngIf="tab.num" class="number">{{tab.num | number}}</div>
</a>
</li>
</ng-container>
</ng-container>
</ul>
</div>
</ul>
</div>
</ng-container>
</ng-container>
</div>
`