[angular-16-irish-monitor | WIP]: Add optional extend-theme variables import in all component less files. Add relativeTo in slider tabs

This commit is contained in:
Konstantinos Triantafyllou 2023-11-15 10:35:44 +02:00
parent a8c91dc04c
commit 920f3a454a
12 changed files with 30 additions and 13 deletions

View File

@ -1,4 +1,5 @@
@import (reference) "~src/assets/openaire-theme/less/color.less"; @import (reference) "~src/assets/openaire-theme/less/color.less";
@import (optional) "~src/assets/extend-theme/less/color.less";
.setType(@color) { .setType(@color) {
border-bottom: 4px solid fade(@color, 30%); border-bottom: 4px solid fade(@color, 30%);
@ -20,4 +21,12 @@
&.organization { &.organization {
.setType(@organization-color); .setType(@organization-color);
} }
&.country {
.setType(@country-color);
}
&.datasource {
.setType(@datasource-color);
}
} }

View File

@ -1,4 +1,5 @@
@import (reference) "~src/assets/openaire-theme/less/_import-variables"; @import (reference) "~src/assets/openaire-theme/less/_import-variables";
@import (optional) "~src/assets/extend-theme/less/_import-variables";
.number-preview { .number-preview {
border: @global-border-width solid @global-border; border: @global-border-width solid @global-border;

View File

@ -1225,6 +1225,7 @@ export class IndicatorsComponent extends IndicatorStakeholderBaseComponent imple
let duplicates = 0; let duplicates = 0;
charts = this.migrateFromOldImportJsonFile(charts); charts = this.migrateFromOldImportJsonFile(charts);
for (let chart of charts) { for (let chart of charts) {
chart.visibility = this.showVisibility?chart.visibility:this.stakeholderUtils.defaultValue(this.stakeholderUtils.visibilities);
if (!sectionsToSave[chart['sectionIndex']]) { if (!sectionsToSave[chart['sectionIndex']]) {
let sectionToSave = new Section(chart['sectionType'] ? chart['sectionType'] : chart['type'], chart['sectionTitle']); let sectionToSave = new Section(chart['sectionType'] ? chart['sectionType'] : chart['type'], chart['sectionTitle']);
sectionToSave.indicators = []; sectionToSave.indicators = [];

View File

@ -659,10 +659,6 @@ export class TopicComponent extends StakeholderBaseComponent implements OnInit,
}); });
} }
private navigateToError() {
this._router.navigate([this.properties.errorLink], {queryParams: {'page': this._router.url}});
}
get isCurator(): boolean { get isCurator(): boolean {
return Session.isPortalAdministrator(this.user) || Session.isCurator(this.stakeholder.type, this.user); return Session.isPortalAdministrator(this.user) || Session.isCurator(this.stakeholder.type, this.user);
} }

View File

@ -26,6 +26,10 @@ export abstract class StakeholderBaseComponent extends BaseComponent {
get showLocale() { get showLocale() {
return this.stakeholderUtils.showField(this.stakeholderUtils.locales); return this.stakeholderUtils.showField(this.stakeholderUtils.locales);
} }
protected navigateToError() {
this._router.navigate([this.properties.errorLink], {queryParams: {'page': this._router.url}});
}
} }
@Directive() @Directive()

View File

@ -204,6 +204,7 @@ export abstract class MonitorIndicatorStakeholderBaseComponent extends Indicator
//clear numbers when filters change //clear numbers when filters change
this.numberResults.clear(); this.numberResults.clear();
let urls: Map<string, [number, number][]> = new Map<string, [number, number][]>(); let urls: Map<string, [number, number][]> = new Map<string, [number, number][]>();
console.log(this.activeSubCategory.numbers);
this.activeSubCategory.numbers.forEach((section, i) => { this.activeSubCategory.numbers.forEach((section, i) => {
section.indicators.forEach((number, j) => { section.indicators.forEach((number, j) => {
if (this.hasPermission(number.visibility)) { if (this.hasPermission(number.visibility)) {
@ -255,10 +256,6 @@ export abstract class MonitorIndicatorStakeholderBaseComponent extends Indicator
} }
} }
protected navigateToError() {
this._router.navigate([this.properties.errorLink], {queryParams: {'page': this._router.url}});
}
public getUrlByStakeHolder(indicatorPath: IndicatorPath) { public getUrlByStakeHolder(indicatorPath: IndicatorPath) {
return this.sanitizer.bypassSecurityTrustResourceUrl( return this.sanitizer.bypassSecurityTrustResourceUrl(
this.indicatorUtils.getChartUrl(indicatorPath.source, this.getFullUrl(indicatorPath))); this.indicatorUtils.getChartUrl(indicatorPath.source, this.getFullUrl(indicatorPath)));

View File

@ -1,4 +1,5 @@
@import "~src/assets/openaire-theme/less/_import-variables"; @import (reference) "~src/assets/openaire-theme/less/_import-variables";
@import (optional) "~src/assets/extend-theme/less/_import-variables";
#notifications-switcher { #notifications-switcher {
top: 480px !important; top: 480px !important;

View File

@ -1,4 +1,5 @@
@import (reference) "~src/assets/openaire-theme/less/_import-variables"; @import (reference) "~src/assets/openaire-theme/less/_import-variables";
@import (optional) "~src/assets/extend-theme/less/_import-variables";
@sdgs: #E6233D, #DF9F00, #19A220, #D70023, #FF0B00, #00BFE8, #FFC300, #B10240, #FF5D00, @sdgs: #E6233D, #DF9F00, #19A220, #D70023, #FF0B00, #00BFE8, #FFC300, #B10240, #FF5D00,
#F50D86, #FF8A00, #CA8A03, #2B772B, #0098DF, #00B91C, #0069A2, #1C336A; #F50D86, #FF8A00, #CA8A03, #2B772B, #0098DF, #00B91C, #0069A2, #1C336A;

View File

@ -1,5 +1,6 @@
@import (reference) "~src/assets/openaire-theme/less/color.less";
@import (reference) "~src/assets/openaire-theme/less/_import-variables.less"; @import (reference) "~src/assets/openaire-theme/less/_import-variables.less";
@import (optional) "~src/assets/extend-theme/less/_import-variables.less";
.setType(@color, @position: left) { .setType(@color, @position: left) {
border-@{position}: 4px solid fade(@color, 30%); border-@{position}: 4px solid fade(@color, 30%);

View File

@ -45,12 +45,15 @@ export abstract class BaseComponent implements OnDestroy {
/** /**
* Initialize router params and data (should be called in the constructor of a component with router-outlet) * Initialize router params and data (should be called in the constructor of a component with router-outlet)
* */ * */
initRouterParams(route: ActivatedRoute = null) { initRouterParams(route: ActivatedRoute = null, navigationChange: ((event: NavigationEnd) => void) = null) {
if (route) { if (route) {
this.params = new BehaviorSubject<Params>(null); this.params = new BehaviorSubject<Params>(null);
this.data = new BehaviorSubject<Data>(null); this.data = new BehaviorSubject<Data>(null);
this.subscriptions.push(this._router.events.subscribe(event => { this.subscriptions.push(this._router.events.subscribe(event => {
if (event instanceof NavigationEnd) { if (event instanceof NavigationEnd) {
if(navigationChange) {
navigationChange(event);
}
let r = route; let r = route;
while (r.firstChild) { while (r.firstChild) {
r = r.firstChild; r = r.firstChild;

View File

@ -1,4 +1,5 @@
import {Component, Input} from "@angular/core"; import {Component, Input} from "@angular/core";
import {ActivatedRoute} from "@angular/router";
@Component({ @Component({
selector: 'slider-tab', selector: 'slider-tab',
@ -22,4 +23,6 @@ export class SliderTabComponent {
@Input() @Input()
public customClass: string = ''; public customClass: string = '';
@Input() tabTemplate: any; @Input() tabTemplate: any;
@Input()
public relativeTo: ActivatedRoute = null;
} }

View File

@ -43,7 +43,7 @@ declare var UIkit;
</ng-container> </ng-container>
<ng-container *ngIf="type === 'dynamic'"> <ng-container *ngIf="type === 'dynamic'">
<li *ngFor="let tab of leftTabs; let i=index;" [class.uk-active]="tab.active" [style.max-width]="(position === 'horizontal')?'50%':null"> <li *ngFor="let tab of leftTabs; let i=index;" [class.uk-active]="tab.active" [style.max-width]="(position === 'horizontal')?'50%':null">
<a [routerLink]="tab.routerLink" [queryParams]="tab.queryParams" [ngClass]="tab.customClass" <a [routerLink]="tab.routerLink" [queryParams]="tab.queryParams" [ngClass]="tab.customClass" [relativeTo]="tab.relativeTo"
(click)="showActive(i)" (click)="showActive(i)"
class="uk-text-capitalize uk-text-truncate uk-display-block"> class="uk-text-capitalize uk-text-truncate uk-display-block">
<span *ngIf="tab.title">{{tab.title}}</span> <span *ngIf="tab.title">{{tab.title}}</span>
@ -52,7 +52,7 @@ declare var UIkit;
</li> </li>
<li *ngFor="let tab of rightTabs; let i=index;" [style.max-width]="(position === 'horizontal')?'50%':null" [class.uk-active]="tab.active" <li *ngFor="let tab of rightTabs; let i=index;" [style.max-width]="(position === 'horizontal')?'50%':null" [class.uk-active]="tab.active"
[ngClass]="i === 0?'uk-flex-1 uk-flex uk-flex-right':''"> [ngClass]="i === 0?'uk-flex-1 uk-flex uk-flex-right':''">
<a [routerLink]="tab.routerLink" [queryParams]="tab.queryParams" [ngClass]="tab.customClass" <a [routerLink]="tab.routerLink" [queryParams]="tab.queryParams" [ngClass]="tab.customClass" [relativeTo]="tab.relativeTo"
(click)="showActive(i)" (click)="showActive(i)"
class="uk-text-capitalize uk-text-truncate uk-display-block"> class="uk-text-capitalize uk-text-truncate uk-display-block">
<span *ngIf="tab.title">{{tab.title}}</span> <span *ngIf="tab.title">{{tab.title}}</span>