[Monitor Dashboard | Trunk]: 1. Indicator pages changes. 2. fix create new topic bug.
git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-monitor-portal/trunk/monitor_dashboard@59736 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
parent
3b094da655
commit
4746e10acd
|
|
@ -5,62 +5,8 @@
|
|||
<div *ngIf="loading == false">
|
||||
<div class="sidebar_main_swipe" [class.sidebar_main_active]="open && hasSidebar"
|
||||
[class.sidebar_mini]="!open && hasSidebar" [class.stakeholderPage]="isFrontPage">
|
||||
<div *ngIf="hasHeader" id="header_main" [class.light_header]="isFrontPage" [class.header_full]="!hasSidebar"
|
||||
class=" " style="right: 0; top: 0; position: fixed; width: 100%; z-index:981;" >
|
||||
<!-- <img
|
||||
*ngIf="((!open && !hasMiniMenu) || !hasSidebar) && (properties.environment === 'beta' || properties.environment === 'development')"
|
||||
class="badge"
|
||||
[src]="'assets/common-assets/'+(properties.environment =='beta'?'beta_flag.svg':'prototype_flag.svg')"
|
||||
[alt]="properties.environment">-->
|
||||
<!--<nav class="uk-navbar" [class.uk-light]="!isFrontPage">
|
||||
<div *ngIf="stakeholder" class="uk-navbar-center">
|
||||
<schema2jsonld *ngIf="properties" [URL]="properties.domain + properties.baseLink + '/' + stakeholder.alias"
|
||||
[logoURL]="stakeholder.logoUrl" type="home"
|
||||
[searchActionRoute]="properties.searchLinkToResults" [searchAction]="false"
|
||||
[name]="'Monitor Dashboard | ' + this.stakeholder.name"
|
||||
[description]="stakeholder.name + ' monitoring dashboard'">
|
||||
</schema2jsonld>
|
||||
<ul class="uk-navbar-nav user_actions uk-padding uk-padding-remove-vertical uk-padding-remove-right">
|
||||
<!–<li>
|
||||
<a class="uk-logo uk-navbar-item uk-link uk-margin-left "
|
||||
[routerLink]="'/'+stakeholder.alias">
|
||||
<img *ngIf="stakeholder.logoUrl" [src]="stakeholder.logoUrl" class=" logo uk-responsive-height">
|
||||
</a>
|
||||
</li>–>
|
||||
<li>
|
||||
<a class="uk-logo uk-navbar-item uk-link "
|
||||
[routerLink]="'/'+stakeholder.alias">
|
||||
<div class="uk-text-capitalize uk-h4 uk-text-bold uk-margin-remove">
|
||||
<span> {{stakeholder.name}}</span>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="uk-navbar-right">
|
||||
<ul class="uk-navbar-nav user_actions">
|
||||
<li *ngIf="isFrontPage" title="It is comming soon. Stay tuned!">
|
||||
<a [routerLink]="(isAdmin()?['/admin']:null)">
|
||||
Manage
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<user-mini *ngIf="properties"
|
||||
[user]="user" [dashboard]="true"
|
||||
[redirectUrl]="properties.afterLoginRedirectLink"
|
||||
[logInUrl]=properties.loginUrl [logOutUrl]=properties.logoutUrl
|
||||
[cookieDomain]=properties.cookieDomain
|
||||
[userMenuItems]=userMenuItems>
|
||||
</user-mini>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>-->
|
||||
<!-- <navbar *ngIf="properties && showMenu" portal="monitor" [onlyTop]=false [stakeholder]="stakeholder"-->
|
||||
<!-- [userMenuItems]=userMenuItems [menuItems]=menuItems [user]="user"-->
|
||||
<!-- [showMenu]=showMenu [properties]="properties"></navbar>-->
|
||||
<div class=" " style="right: 0; top: 0; position: fixed; width: 100%; z-index:981;">
|
||||
<navbar *ngIf="properties" [properties]="properties" portal="monitor_dashboard" [header]="menuHeader"
|
||||
|
||||
[userMenuItems]=userMenuItems [menuItems]="menuItems" [user]="user" [offCanvasFlip]="true"></navbar>
|
||||
</div>
|
||||
<dashboard-sidebar *ngIf="stakeholder && isFrontPage" [items]="sideBarItems"
|
||||
|
|
|
|||
|
|
@ -83,12 +83,12 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="uk-position-top-left uk-margin-small-left uk-margin-small-top clickable visibility">
|
||||
<span class="clickable color">
|
||||
<icon [name]="stakeholderUtils.visibilityIcon.get(stakeholder.visibility)"></icon>
|
||||
</span>
|
||||
<span class="clickable color">
|
||||
<icon [name]="stakeholderUtils.visibilityIcon.get(stakeholder.visibility)"></icon>
|
||||
</span>
|
||||
<div #element uk-dropdown="mode: click; pos: bottom-left; delay-hide: 0; flip: false">
|
||||
<ul class="uk-nav uk-dropdown-nav">
|
||||
<li *ngFor="let v of stakeholderUtils.visibility">
|
||||
<li *ngFor="let v of stakeholderUtils.visibility" class="uk-position-relative">
|
||||
<a *ngIf="stakeholder.visibility != v.value"
|
||||
(click)="$event.stopPropagation();changeStakeholderStatus(stakeholder,v.value);hide(element);$event.preventDefault()">
|
||||
<icon [name]="stakeholderUtils.visibilityIcon.get(v.value)" ratio="0.8"></icon>
|
||||
|
|
|
|||
|
|
@ -74,7 +74,7 @@ export class ManageStakeholdersComponent implements OnInit, OnDestroy {
|
|||
});
|
||||
let data = zip(
|
||||
this.stakeholderService.getDefaultStakeholders(this.properties.monitorServiceAPIURL),
|
||||
this.stakeholderService.getStakeholders(this.properties.monitorServiceAPIURL)
|
||||
this.stakeholderService.getMyStakeholders(this.properties.monitorServiceAPIURL)
|
||||
);
|
||||
data.subscribe(res => {
|
||||
this.defaultStakeholders = res[0];
|
||||
|
|
|
|||
|
|
@ -0,0 +1,11 @@
|
|||
.uk-card {
|
||||
min-height: 270px;
|
||||
}
|
||||
|
||||
div[id*="number-"] .uk-card-body {
|
||||
padding-top: 60px;
|
||||
}
|
||||
|
||||
div[id*="chart-"] .uk-card-body {
|
||||
padding-top: 75px;
|
||||
}
|
||||
|
|
@ -1,296 +1,250 @@
|
|||
<div *ngIf="stakeholder && canEdit" >
|
||||
<div class="uk-padding-small md-bg-white" uk-grid>
|
||||
<div *ngIf="filters" class="uk-width-2-3@m uk-width-1-1 uk-child-width-1-3@m uk-child-width-1-1" uk-grid>
|
||||
<div>
|
||||
<div dashboard-input [formInput]="filters.get('chartType')"
|
||||
type="select" [options]="[all].concat(indicatorUtils.allChartTypes)"
|
||||
label="Chart Type"></div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div dashboard-input [formInput]="filters.get('status')"
|
||||
type="select" [options]="[all].concat(stakeholderUtils.visibility)"
|
||||
label="Status"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-width-expand@m uk-width-1-1 uk-flex uk-flex-middle uk-flex-right">
|
||||
<div class="uk-inline uk-width-medium">
|
||||
<span class="uk-position-center-right"><i uk-icon="search" class="uk-icon"></i></span>
|
||||
<div dashboard-input [formInput]="filters.get('keyword')" label="Locate indicator"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class=" ">
|
||||
<div class="uk-flex uk-flex-right">
|
||||
<a class="uk-button uk-button-primary">
|
||||
<icon name="preview"></icon>
|
||||
Preview
|
||||
<i uk-icon="chevron-down" class="uk-icon"></i>
|
||||
</a>
|
||||
<div #element uk-dropdown="mode: click; pos: bottom-right; offset: 5; delay-hide: 0; flip: false"
|
||||
class="uk-padding-remove-horizontal">
|
||||
<ul class="uk-nav uk-dropdown-nav uk-margin-left">
|
||||
<li><a target="_blank" [routerLink]="preview" [queryParams]="{view: 'public'}" (click)="hide(element)">Public</a>
|
||||
</li>
|
||||
<li><a target="_blank" [routerLink]="preview" [queryParams]="{view: 'private'}" (click)="hide(element)">Private</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div *ngIf="stakeholder && canEdit">
|
||||
<div>
|
||||
<div class="uk-flex uk-flex-right">
|
||||
<a class="uk-button uk-button-primary">
|
||||
<icon name="preview"></icon>
|
||||
Preview
|
||||
<i uk-icon="chevron-down" class="uk-icon"></i>
|
||||
</a>
|
||||
<div #element uk-dropdown="mode: click; pos: bottom-right; offset: 5; delay-hide: 0; flip: false"
|
||||
class="uk-padding-remove-horizontal">
|
||||
<ul class="uk-nav uk-dropdown-nav uk-margin-left">
|
||||
<li><a target="_blank" [routerLink]="preview" [queryParams]="{view: 'public'}"
|
||||
(click)="hide(element)">Public</a>
|
||||
</li>
|
||||
<li><a target="_blank" [routerLink]="preview" [queryParams]="{view: 'private'}" (click)="hide(element)">Private</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="numberSections">
|
||||
<h6 class="uk-text-bold">Number Indicators</h6>
|
||||
<div *ngIf="numberSections">
|
||||
<ng-template ngFor [ngForOf]="displayNumbers" let-number let-i="index">
|
||||
<div [id]="'number-' + number._id" [class.section]="isAdministrator"
|
||||
class="uk-grid-match uk-grid-small uk-grid uk-margin-top"
|
||||
uk-sortable="group: number" uk-grid>
|
||||
<div class="tools disable-sortable uk-sortable-nodrag">
|
||||
<div *ngIf="isAdministrator" class="actions">
|
||||
<a [class.uk-disabled]="editing" class="" (click)="createSection(i, 'number')"
|
||||
title="Create a new section"><i
|
||||
uk-icon="icon:plus;ratio:0.8"></i></a>
|
||||
<!--<button class="md-btn md-btn-mini"><i class="material-icons rotate-90">drag_indicator</i></button>-->
|
||||
<a [class.uk-disabled]="editing || number.defaultId " class=""
|
||||
[title]="(number.defaultId?'Default sections cannot be deleted':'Delete section')"
|
||||
(click)="deleteSectionOpen(number, i, 'number', 'delete')"><i uk-icon="icon:close;ratio:0.8"></i>
|
||||
</a>
|
||||
<!-- <ng-container *ngIf="!stakeholder.defaultId">-->
|
||||
<!-- <button [disabled]="editing || number.defaultId " class="md-btn md-btn-mini"-->
|
||||
<!-- [title]="(number.defaultId?'Default sections cannot be deleted':'Delete all related sections')"-->
|
||||
<!-- (click)="deleteSectionOpen(number, i, 'number', 'delete')"><i class="material-icons">highlight_off</i>-->
|
||||
<!-- </button>-->
|
||||
<!-- <button [disabled]="editing || number.defaultId " class="md-btn md-btn-mini"-->
|
||||
<!-- [title]="(number.defaultId?'Default sections cannot be deleted':'Delete section and disconnect related')"-->
|
||||
<!-- (click)="deleteSectionOpen(number, i, 'number', 'disconnect')"><i class="material-icons">link_off</i>-->
|
||||
<!-- </button>-->
|
||||
<!-- </ng-container>-->
|
||||
</div>
|
||||
<ng-template ngFor [ngForOf]="displayNumbers" let-number let-i="index">
|
||||
<div [id]="'number-' + number._id" [class.section]="isAdministrator"
|
||||
class="uk-grid-match uk-grid-small uk-grid uk-margin-top"
|
||||
uk-sortable="group: number" uk-grid>
|
||||
<div class="tools disable-sortable uk-sortable-nodrag">
|
||||
<div *ngIf="isAdministrator" class="actions">
|
||||
<a [class.uk-disabled]="editing" class="" (click)="createSection(i, 'number')"
|
||||
title="Create a new section">
|
||||
<icon name="add"></icon>
|
||||
</a>
|
||||
<!--<button class="md-btn md-btn-mini"><i class="material-icons rotate-90">drag_indicator</i></button>-->
|
||||
<a [title]="(number.defaultId?'Default sections cannot be deleted':'Delete section')"
|
||||
(click)="deleteSectionOpen(number, i, 'number', 'delete')">
|
||||
<icon name="close"></icon>
|
||||
</a>
|
||||
<!-- <ng-container *ngIf="!stakeholder.defaultId">-->
|
||||
<!-- <button [disabled]="editing || number.defaultId " class="md-btn md-btn-mini"-->
|
||||
<!-- [title]="(number.defaultId?'Default sections cannot be deleted':'Delete all related sections')"-->
|
||||
<!-- (click)="deleteSectionOpen(number, i, 'number', 'delete')"><i class="material-icons">highlight_off</i>-->
|
||||
<!-- </button>-->
|
||||
<!-- <button [disabled]="editing || number.defaultId " class="md-btn md-btn-mini"-->
|
||||
<!-- [title]="(number.defaultId?'Default sections cannot be deleted':'Delete section and disconnect related')"-->
|
||||
<!-- (click)="deleteSectionOpen(number, i, 'number', 'disconnect')"><i class="material-icons">link_off</i>-->
|
||||
<!-- </button>-->
|
||||
<!-- </ng-container>-->
|
||||
</div>
|
||||
<div *ngIf="numberSections.at(i)"
|
||||
class="uk-form-row uk-width-1-1 uk-grid-medium uk-flex uk-flex-middle uk-margin-bottom disable-sortable uk-sortable-nodrag"
|
||||
uk-grid>
|
||||
<div dashboard-input class="uk-width-2-3 uk-width-1-3@m" [formInput]="numberSections.at(i).get('title')"
|
||||
label="Add a section title"></div>
|
||||
<div class="uk-width-expand">
|
||||
<button *ngIf="numberSections.at(i).dirty" class="md-btn" [disabled]="editing"
|
||||
</div>
|
||||
<div *ngIf="numberSections.at(i)"
|
||||
class="uk-width-1-1 uk-margin-medium-bottom disable-sortable uk-sortable-nodrag">
|
||||
<div dashboard-input [formInput]="numberSections.at(i).get('title')"
|
||||
[extraLeft]="false" class="uk-width-1-3"
|
||||
placeholder="Write a title for this section">
|
||||
<div [class.uk-invisible]="numberSections.at(i).get('title').pristine">
|
||||
<button class="uk-button uk-button-secondary" [disabled]="editing"
|
||||
(click)="saveSection(numberSections.at(i).value, i, 'number')">
|
||||
Save
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<ng-template ngFor [ngForOf]="number.indicators" let-indicator let-j="index">
|
||||
<div *ngIf="indicator" [id]="indicator._id"
|
||||
[class.uk-width-1-5@m]="indicator.width === 'small'"
|
||||
[class.uk-width-1-3@m]=" indicator.width === 'medium'"
|
||||
[class.uk-width-1-2@m]=" indicator.width === 'large'"
|
||||
[class.disable-sortable]="!canReorder"
|
||||
[class.uk-sortable-nodrag]="!canReorder">
|
||||
<div class="uk-card uk-card-default" [class.md-card-hover]="canReorder">
|
||||
<div class="uk-padding-small uk-padding-remove-bottom ">
|
||||
<ng-container *ngTemplateOutlet="visibilityOptions; context:{indicator: indicator}"></ng-container>
|
||||
<div class="md-card-toolbar-actions uk-float-right" >
|
||||
|
||||
<div class="md-card-dropdown uk-inline">
|
||||
<i uk-icon="more-vertical" class="clickable"></i>
|
||||
<div #element uk-dropdown="mode: click; pos: bottom-right; delay-hide: 0; flip: false"
|
||||
class="uk-padding-remove-horizontal">
|
||||
<ul class="uk-nav uk-dropdown-nav uk-margin-left">
|
||||
<li *ngIf="isAdministrator && !indicator.defaultId && !editing"><a
|
||||
(click)="editNumberIndicatorOpen(number, indicator._id)">Edit</a></li>
|
||||
<ng-template ngFor [ngForOf]="stakeholderUtils.visibility" let-v>
|
||||
<li *ngIf="indicator.visibility != v.value"><a (click)="toggleIndicatorStatus(number._id,
|
||||
indicator, v.value); hide(element)">
|
||||
{{'Make ' + v.label.toLowerCase()}}</a>
|
||||
</li>
|
||||
</ng-template>
|
||||
<hr *ngIf="isAdministrator && !indicator.defaultId" class="uk-nav-divider">
|
||||
<li *ngIf="isAdministrator && !indicator.defaultId && !editing"><a
|
||||
(click)="deleteIndicatorOpen(number, indicator._id, 'number', 'delete');hide(element)">Delete</a>
|
||||
<!-- <ng-container *ngIf="!stakeholder.defaultId">-->
|
||||
<!-- <a (click)="deleteIndicatorOpen(number, indicator._id, 'number', 'delete');hide(element)">Delete from all profiles</a>-->
|
||||
<!-- <a (click)="deleteIndicatorOpen(number, indicator._id, 'number', 'disconnect');hide(element)">Delete and disconnect from all profiles</a>-->
|
||||
<!-- </ng-container>-->
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class=" uk-padding-small uk-padding-remove-top">
|
||||
<div class="">
|
||||
<div class="uk-text-center">
|
||||
{{indicator.name ? indicator.name : 'No title available'}}
|
||||
</div>
|
||||
<div class="uk-width-1-1">
|
||||
{{indicator.description}}
|
||||
</div>
|
||||
<div class="uk-width-1-1">
|
||||
{{indicator.additionalDescription}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<ng-template ngFor [ngForOf]="number.indicators" let-indicator let-j="index">
|
||||
<div *ngIf="indicator" [id]="indicator._id"
|
||||
[class.uk-width-1-5@m]="indicator.width === 'small'"
|
||||
[class.uk-width-1-3@m]=" indicator.width === 'medium'"
|
||||
[class.uk-width-1-2@m]=" indicator.width === 'large'"
|
||||
[class.disable-sortable]="!canReorder"
|
||||
[class.uk-sortable-nodrag]="!canReorder">
|
||||
<div class="uk-card uk-card-default uk-card-body uk-position-relative" [class.uk-card-hover]="canReorder">
|
||||
<ng-container *ngTemplateOutlet="visibilityOptions; context:{indicator: indicator}"></ng-container>
|
||||
<div class="uk-position-top-right uk-margin-small-right uk-margin-small-top clickable">
|
||||
<i uk-icon="more-vertical" (click)="$event.stopPropagation();$event.preventDefault()"></i>
|
||||
<div #element uk-dropdown="mode: click; pos: bottom-right; delay-hide: 0; flip: false">
|
||||
<ul class="uk-nav uk-dropdown-nav">
|
||||
<li *ngIf="isAdministrator && !indicator.defaultId && !editing"><a
|
||||
(click)="editNumberIndicatorOpen(number, indicator._id)">Edit</a></li>
|
||||
<ng-template ngFor [ngForOf]="stakeholderUtils.visibility" let-v>
|
||||
<li *ngIf="indicator.visibility != v.value"><a (click)="toggleIndicatorStatus(number._id,
|
||||
indicator, v.value); hide(element)">
|
||||
{{'Make ' + v.label.toLowerCase()}}</a>
|
||||
</li>
|
||||
</ng-template>
|
||||
<hr *ngIf="isAdministrator && !indicator.defaultId" class="uk-nav-divider">
|
||||
<li *ngIf="isAdministrator && !indicator.defaultId && !editing"><a
|
||||
(click)="deleteIndicatorOpen(number, indicator._id, 'number', 'delete');hide(element)">Delete</a>
|
||||
<!-- <ng-container *ngIf="!stakeholder.defaultId">-->
|
||||
<!-- <a (click)="deleteIndicatorOpen(number, indicator._id, 'number', 'delete');hide(element)">Delete from all profiles</a>-->
|
||||
<!-- <a (click)="deleteIndicatorOpen(number, indicator._id, 'number', 'disconnect');hide(element)">Delete and disconnect from all profiles</a>-->
|
||||
<!-- </ng-container>-->
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
<div *ngIf="isAdministrator" class="disable-sortable uk-sortable-nodrag uk-width-1-3@m">
|
||||
<div class="uk-card uk-card-default clickable" (click)="editNumberIndicatorOpen(number)">
|
||||
<div class="uk-card-body">
|
||||
<div uk-grid class="uk-text-center">
|
||||
<div class="uk-width-1-1 uk-text-center">
|
||||
Create a new number Indicator
|
||||
</div>
|
||||
<div class="uk-width-1-1 uk-flex uk-flex-center">
|
||||
<i uk-icon="plus"></i>
|
||||
</div>
|
||||
<div>
|
||||
<div class="uk-text-center uk-text-bold">
|
||||
{{indicator.name ? indicator.name : 'No title available'}}
|
||||
</div>
|
||||
<div *ngIf="indicator.description" class="uk-width-1-1 uk-text-muted uk-text-small uk-margin-small-top">
|
||||
{{indicator.description}}
|
||||
</div>
|
||||
<div *ngIf="indicator.additionalDescription"
|
||||
class="uk-width-1-1 uk-text-muted uk-text-small uk-margin-small-top">
|
||||
{{indicator.additionalDescription}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
<div *ngIf="isAdministrator" class="new-section uk-margin-top">
|
||||
<div class="tools uk-flex uk-flex-middle">
|
||||
<button class="uk-margin-small-right uk-icon-button portal-button" (click)="createSection(-1, 'number')">
|
||||
<i uk-icon="plus"></i>
|
||||
</button>
|
||||
<span>Create a new section</span>
|
||||
</ng-template>
|
||||
<div *ngIf="isAdministrator" class="disable-sortable uk-sortable-nodrag uk-width-1-1">
|
||||
<div class="uk-width-1-3@l uk-width-1-2@m uk-width-1-1 uk-card uk-card-default uk-card-body clickable" (click)="editNumberIndicatorOpen(number)">
|
||||
<div>
|
||||
<h5 class="uk-text-bold">
|
||||
Create a new number Indicator
|
||||
</h5>
|
||||
<div class="uk-flex uk-flex-center uk-text-secondary uk-margin-large">
|
||||
<icon name="add" ratio="5"></icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
<div *ngIf="isAdministrator">
|
||||
<ng-container *ngTemplateOutlet="new_section; context:{type: 'number'}"></ng-container>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="chartSections" class="uk-margin-large-top">
|
||||
<h6 class="uk-text-bold">Chart Indicators</h6>
|
||||
<div *ngIf="chartSections">
|
||||
<ng-template ngFor [ngForOf]="displayCharts" let-chart let-i="index">
|
||||
<div [id]="'chart-' + chart._id"
|
||||
class="uk-grid-match section uk-grid-small uk-grid uk-margin-top"
|
||||
uk-sortable="group: chart" uk-grid>
|
||||
<div class="tools disable-sortable uk-sortable-nodrag">
|
||||
<div class="actions">
|
||||
<a [class.uk-disabled]="editing" class="" (click)="createSection(i)"
|
||||
title="Create a new section"><i
|
||||
uk-icon="icon:plus;ratio:0.8"></i></a>
|
||||
<!--<button class="md-btn md-btn-mini"><i class="material-icons rotate-90">drag_indicator</i></button>-->
|
||||
<a [class.uk-disabled]="editing || chart.defaultId "
|
||||
[title]="(chart.defaultId?'Default sections cannot be deleted':'Delete section')"
|
||||
class="" (click)="deleteSectionOpen(chart, i, 'chart', 'delete')"><i
|
||||
uk-icon="icon:close;ratio:0.8"></i>
|
||||
</a>
|
||||
<!-- <ng-container *ngIf="!stakeholder.defaultId">-->
|
||||
<!-- <button [disabled]="editing || chart.defaultId " class="md-btn md-btn-mini"-->
|
||||
<!-- [title]="(chart.defaultId?'Default sections cannot be deleted':'Delete all related sections')"-->
|
||||
<!-- (click)="deleteSectionOpen(chart, i, 'chart', 'delete')"><i class="material-icons">highlight_off</i>-->
|
||||
<!-- </button>-->
|
||||
<!-- <button [disabled]="editing || chart.defaultId " class="md-btn md-btn-mini"-->
|
||||
<!-- [title]="(chart.defaultId?'Default sections cannot be deleted':'Delete section and disconnect related')"-->
|
||||
<!-- (click)="deleteSectionOpen(chart, i, 'chart', 'disconnect')"><i class="material-icons">link_off</i>-->
|
||||
<!-- </button>-->
|
||||
<!-- </ng-container>-->
|
||||
</div>
|
||||
<ng-template ngFor [ngForOf]="displayCharts" let-chart let-i="index">
|
||||
<div [id]="'chart-' + chart._id"
|
||||
class="uk-grid-match section uk-grid-small uk-grid uk-margin-top"
|
||||
uk-sortable="group: chart" uk-grid>
|
||||
<div class="tools disable-sortable uk-sortable-nodrag">
|
||||
<div class="actions">
|
||||
<a [class.uk-disabled]="editing" class="" (click)="createSection(i)"
|
||||
title="Create a new section">
|
||||
<icon name="add"></icon>
|
||||
</a>
|
||||
<!--<button class="md-btn md-btn-mini"><i class="material-icons rotate-90">drag_indicator</i></button>-->
|
||||
<a [title]="(chart.defaultId?'Default sections cannot be deleted':'Delete section')"
|
||||
(click)="deleteSectionOpen(chart, i, 'chart', 'delete')">
|
||||
<icon name="close"></icon>
|
||||
</a>
|
||||
<!-- <ng-container *ngIf="!stakeholder.defaultId">-->
|
||||
<!-- <button [disabled]="editing || chart.defaultId " class="md-btn md-btn-mini"-->
|
||||
<!-- [title]="(chart.defaultId?'Default sections cannot be deleted':'Delete all related sections')"-->
|
||||
<!-- (click)="deleteSectionOpen(chart, i, 'chart', 'delete')"><i class="material-icons">highlight_off</i>-->
|
||||
<!-- </button>-->
|
||||
<!-- <button [disabled]="editing || chart.defaultId " class="md-btn md-btn-mini"-->
|
||||
<!-- [title]="(chart.defaultId?'Default sections cannot be deleted':'Delete section and disconnect related')"-->
|
||||
<!-- (click)="deleteSectionOpen(chart, i, 'chart', 'disconnect')"><i class="material-icons">link_off</i>-->
|
||||
<!-- </button>-->
|
||||
<!-- </ng-container>-->
|
||||
</div>
|
||||
<div *ngIf="chartSections.at(i)"
|
||||
class="uk-form-row uk-width-1-1 uk-grid-medium uk-flex uk-flex-middle uk-margin-bottom disable-sortable uk-sortable-nodrag"
|
||||
uk-grid>
|
||||
<div dashboard-input class="uk-width-2-3 uk-width-1-3@m" [formInput]="chartSections.at(i).get('title')"
|
||||
label="Add a section title"></div>
|
||||
<div class="uk-width-expand">
|
||||
<button *ngIf="chartSections.at(i).dirty" class="md-btn" [disabled]="editing"
|
||||
</div>
|
||||
<div *ngIf="chartSections.at(i)"
|
||||
class="uk-width-1-1 uk-margin-medium-bottom disable-sortable uk-sortable-nodrag">
|
||||
<div dashboard-input [formInput]="chartSections.at(i).get('title')"
|
||||
[extraLeft]="false" class="uk-width-1-3"
|
||||
placeholder="Write a title for this section">
|
||||
<div [class.uk-invisible]="chartSections.at(i).get('title').pristine">
|
||||
<button class="uk-button uk-button-secondary" [disabled]="editing"
|
||||
(click)="saveSection(chartSections.at(i).value, i)">
|
||||
Save
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<ng-template ngFor [ngForOf]="chart.indicators" let-indicator let-j="index">
|
||||
<div *ngIf="indicator" [id]="indicator._id"
|
||||
[class.uk-width-1-3@m]="indicator.width === 'small'"
|
||||
[class.uk-width-1-2@m]=" indicator.width === 'medium'"
|
||||
[class.uk-width-1-1@m]="indicator.width === 'large'"
|
||||
[class.disable-sortable]="!canReorder"
|
||||
[class.uk-sortable-nodrag]="!canReorder">
|
||||
<div class="uk-card uk-card-default" [class.md-card-hover]="canReorder">
|
||||
<div class="uk-padding-small uk-padding-remove-bottom ">
|
||||
<ng-container *ngTemplateOutlet="visibilityOptions; context:{indicator: indicator}"></ng-container>
|
||||
<div class="md-card-toolbar-actions uk-float-right" >
|
||||
<div class="md-card-dropdown uk-inline">
|
||||
<i uk-icon="more-vertical" class="clickable"></i>
|
||||
<div #element uk-dropdown="mode: click; pos: bottom-right; delay-hide: 0; flip: false"
|
||||
class="uk-padding-remove-horizontal">
|
||||
<ul class="uk-nav uk-dropdown-nav uk-margin-left">
|
||||
<li *ngIf="!editing"><a (click)="editChartIndicatorOpen(chart, indicator._id);hide(element)">Edit</a>
|
||||
</li>
|
||||
<ng-template ngFor [ngForOf]="stakeholderUtils.visibility" let-v>
|
||||
<li *ngIf="indicator.visibility != v.value"><a (click)="toggleIndicatorStatus(chart._id,
|
||||
</div>
|
||||
<ng-template ngFor [ngForOf]="chart.indicators" let-indicator let-j="index">
|
||||
<div *ngIf="indicator" [id]="indicator._id"
|
||||
[class.uk-width-1-3@m]="indicator.width === 'small'"
|
||||
[class.uk-width-1-2@m]=" indicator.width === 'medium'"
|
||||
[class.uk-width-1-1@m]="indicator.width === 'large'"
|
||||
[class.disable-sortable]="!canReorder"
|
||||
[class.uk-sortable-nodrag]="!canReorder">
|
||||
<div class="uk-card uk-card-default uk-card-body uk-position-relative" [class.uk-card-hover]="canReorder">
|
||||
<ng-container *ngTemplateOutlet="visibilityOptions; context:{indicator: indicator}"></ng-container>
|
||||
<div class="uk-position-top-right uk-margin-small-right uk-margin-small-top clickable">
|
||||
<i uk-icon="more-vertical" (click)="$event.stopPropagation();$event.preventDefault()"></i>
|
||||
<div #element uk-dropdown="mode: click; pos: bottom-right; delay-hide: 0; flip: false">
|
||||
<ul class="uk-nav uk-dropdown-nav">
|
||||
<li *ngIf="!editing"><a
|
||||
(click)="editChartIndicatorOpen(chart, indicator._id);hide(element)">Edit</a>
|
||||
</li>
|
||||
<ng-template ngFor [ngForOf]="stakeholderUtils.visibility" let-v>
|
||||
<li *ngIf="indicator.visibility != v.value"><a (click)="toggleIndicatorStatus(chart._id,
|
||||
indicator, v.value); hide(element)">
|
||||
{{'Make ' + v.label.toLowerCase()}}</a>
|
||||
</li>
|
||||
</ng-template>
|
||||
<hr *ngIf="!indicator.defaultId " class="uk-nav-divider">
|
||||
<li *ngIf="!editing && !indicator.defaultId "><a
|
||||
(click)="deleteIndicatorOpen(chart, indicator._id, 'chart', 'delete');hide(element)">
|
||||
Delete</a>
|
||||
<!-- <a (click)="deleteIndicatorOpen(chart, indicator._id, 'chart', 'delete');hide(element)">Delete from all profiles</a>-->
|
||||
<!-- <a (click)="deleteIndicatorOpen(chart, indicator._id, 'chart', 'disconnect');hide(element)">Delete and disconnect from all profiles</a>-->
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="uk-padding-small uk-padding-remove-top">
|
||||
<div class="">
|
||||
<div class="uk-text-center">
|
||||
{{indicator.name}}
|
||||
</div>
|
||||
<iframe *ngIf="indicator.indicatorPaths[0] && indicator.indicatorPaths[0].source !== 'image' &&
|
||||
safeUrls.get(indicatorUtils.getFullUrl(stakeholder, indicator.indicatorPaths[0]))"
|
||||
[src]="safeUrls.get(indicatorUtils.getFullUrl(stakeholder, indicator.indicatorPaths[0]))"
|
||||
class="uk-width-1-1 uk-height-medium"></iframe>
|
||||
<!-- <div>Uncomment for iframes preview</div>-->
|
||||
<div *ngIf="indicator.indicatorPaths[0] && indicator.indicatorPaths[0].source === 'image'">
|
||||
<img class="uk-width-1-1 uk-height-medium" [src]="indicator.indicatorPaths[0].url">
|
||||
</div>
|
||||
<div class="uk-width-1-1 uk-text-muted uk-text-small">
|
||||
{{indicator.description ? indicator.description : ''}}
|
||||
</div>
|
||||
<div class="uk-width-1-1 uk-text-muted uk-text-small">
|
||||
{{indicator.additionalDescription ? indicator.additionalDescription : ''}}
|
||||
</div>
|
||||
</div>
|
||||
{{'Make ' + v.label.toLowerCase()}}</a>
|
||||
</li>
|
||||
</ng-template>
|
||||
<hr *ngIf="!indicator.defaultId " class="uk-nav-divider">
|
||||
<li *ngIf="!editing && !indicator.defaultId "><a
|
||||
(click)="deleteIndicatorOpen(chart, indicator._id, 'chart', 'delete');hide(element)">
|
||||
Delete</a>
|
||||
<!-- <a (click)="deleteIndicatorOpen(chart, indicator._id, 'chart', 'delete');hide(element)">Delete from all profiles</a>-->
|
||||
<!-- <a (click)="deleteIndicatorOpen(chart, indicator._id, 'chart', 'disconnect');hide(element)">Delete and disconnect from all profiles</a>-->
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
<div class="disable-sortable uk-sortable-nodrag uk-width-1-2@m">
|
||||
<div class="uk-card uk-card-default clickable" (click)="editChartIndicatorOpen(chart)">
|
||||
<div class="uk-card-body">
|
||||
<div >
|
||||
<div class="uk-text-bold">Create a custom indicator</div>
|
||||
<div class="uk-width-1-1">
|
||||
Use our advance tool to create a custom Indicator that suit the needs of your funding
|
||||
KPI's.
|
||||
</div>
|
||||
<div class="uk-width-1-1 uk-flex uk-flex-center">
|
||||
<i uk-icon="plus"></i>
|
||||
</div>
|
||||
<div>
|
||||
<div *ngIf="indicator.name" class="uk-text-center uk-text-bold uk-margin-small-bottom">
|
||||
{{indicator.name}}
|
||||
</div>
|
||||
<iframe *ngIf="indicator.indicatorPaths[0] && indicator.indicatorPaths[0].source !== 'image' &&
|
||||
safeUrls.get(indicatorUtils.getFullUrl(stakeholder, indicator.indicatorPaths[0]))"
|
||||
[src]="safeUrls.get(indicatorUtils.getFullUrl(stakeholder, indicator.indicatorPaths[0]))"
|
||||
class="uk-width-1-1 uk-height-medium"></iframe>
|
||||
<!-- <div>Uncomment for iframes preview</div>-->
|
||||
<div *ngIf="indicator.indicatorPaths[0] && indicator.indicatorPaths[0].source === 'image'">
|
||||
<img class="uk-width-1-1 uk-height-medium" [src]="indicator.indicatorPaths[0].url">
|
||||
</div>
|
||||
<div *ngIf="indicator.description" class="uk-width-1-1 uk-text-muted uk-text-small uk-margin-small-top">
|
||||
{{indicator.description}}
|
||||
</div>
|
||||
<div *ngIf="indicator.additionalDescription"
|
||||
class="uk-width-1-1 uk-text-muted uk-text-small uk-margin-small-top">
|
||||
{{indicator.additionalDescription}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
<div class="new-section uk-margin-top">
|
||||
<div class="tools uk-flex uk-flex-middle">
|
||||
<button [disabled]="editing" class="uk-margin-small-right uk-icon-button portal-button" (click)="createSection()">
|
||||
<i uk-icon="plus"></i>
|
||||
</button>
|
||||
<span>Create a new section</span>
|
||||
</ng-template>
|
||||
<div class="disable-sortable uk-sortable-nodrag uk-width-1-1">
|
||||
<div class="uk-width-1-3@l uk-width-1-2@m uk-width-1-1 uk-card uk-card-default uk-card-body clickable" (click)="editChartIndicatorOpen(chart)">
|
||||
<div>
|
||||
<h5 class="uk-text-bold">
|
||||
Create a custom indicator
|
||||
</h5>
|
||||
<div class="uk-text-muted uk-text-small">
|
||||
Use our advance tool to create a custom Indicator that suit the needs of your funding
|
||||
KPI's.
|
||||
</div>
|
||||
<div class="uk-flex uk-flex-center uk-text-secondary uk-margin-large">
|
||||
<icon name="add" ratio="5"></icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
<ng-container *ngTemplateOutlet="new_section; context:{type: 'chart'}"></ng-container>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<modal-alert #editNumberModal
|
||||
<modal-alert #editNumberModal
|
||||
[classBody]="'large-modal'"
|
||||
(alertOutput)="saveIndicator()"
|
||||
[okDisabled]="numberIndicatorFb && (numberIndicatorFb.invalid || numberIndicatorFb.pristine)">
|
||||
|
|
@ -356,51 +310,47 @@
|
|||
</div>
|
||||
</modal-alert>
|
||||
<modal-alert #editChartModal
|
||||
[classBody]="'large-modal'"
|
||||
[large]="true"
|
||||
(alertOutput)="saveIndicator()"
|
||||
[okDisabled]="chartIndicatorFb && (chartIndicatorFb.invalid || chartIndicatorFb.pristine)">
|
||||
<div *ngIf="chartIndicatorFb" class="uk-padding-small" [formGroup]="chartIndicatorFb">
|
||||
<div dashboard-input class="uk-form-row" [formInput]="chartIndicatorFb.get('name')" label="Title"></div>
|
||||
<div *ngIf="isAdministrator" dashboard-input class="uk-form-row" [formInput]="chartIndicatorFb.get('description')"
|
||||
label="Description" type="textarea">
|
||||
</div>
|
||||
<div dashboard-input class="uk-form-row" [formInput]="chartIndicatorFb.get('additionalDescription')"
|
||||
label="Additional information" type="textarea">
|
||||
</div>
|
||||
<div class="uk-form-row uk-flex uk-flex-middle">
|
||||
<div dashboard-input class="uk-width-small" [formInput]="chartIndicatorFb.get('visibility')"
|
||||
label="Visibility" [options]="stakeholderUtils.visibility" type="select">
|
||||
<div class="uk-grid" uk-grid>
|
||||
<div dashboard-input class="uk-width-1-1" [formInput]="chartIndicatorFb.get('name')" label="Title"></div>
|
||||
<div *ngIf="isAdministrator" dashboard-input class="uk-width-1-1"
|
||||
[formInput]="chartIndicatorFb.get('description')"
|
||||
label="Description" type="textarea">
|
||||
</div>
|
||||
<div dashboard-input class="uk-margin-small-left uk-width-small" [formInput]="chartIndicatorFb.get('width')"
|
||||
<div dashboard-input class="uk-width-1-1" [formInput]="chartIndicatorFb.get('additionalDescription')"
|
||||
label="Additional information" type="textarea">
|
||||
</div>
|
||||
<div dashboard-input class="uk-width-1-2@m" [formInput]="chartIndicatorFb.get('visibility')"
|
||||
label="Status" [options]="stakeholderUtils.visibility" type="select">
|
||||
</div>
|
||||
<div dashboard-input class="uk-width-1-2@m" [formInput]="chartIndicatorFb.get('width')"
|
||||
type="select" [options]="indicatorUtils.indicatorSizes"
|
||||
label="Chart Size">
|
||||
</div>
|
||||
</div>
|
||||
<h5 class="uk-text-bold uk-margin-top uk-margin-bottom">
|
||||
Chart Settings
|
||||
</h5>
|
||||
<div *ngIf="chartIndicatorPaths" formArrayName="indicatorPaths">
|
||||
<div *ngFor="let indicatorPath of chartIndicatorPaths.controls; let i=index"
|
||||
[formGroup]="indicatorPath">
|
||||
<div dashboard-input class="uk-form-row"
|
||||
[title]="indicatorPath.get('url').disabled?'Default chart URLs cannot change':''"
|
||||
[formInput]="indicatorPath.get('url')"
|
||||
label="Chart Url"></div>
|
||||
<div *ngIf="urlParameterizedMessage.length > 0" class="uk-alert-warning uk-alert">
|
||||
{{urlParameterizedMessage}}
|
||||
</div>
|
||||
<div formArrayName="parameters">
|
||||
<div *ngIf="getParameter(i, 'title')" class="uk-form-row">
|
||||
<div dashboard-input
|
||||
[formInput]="getParameter(i, 'title').get('value')"
|
||||
label="Chart Title"></div>
|
||||
<ng-template [ngIf]="chartIndicatorPaths" formArrayName="indicatorPaths">
|
||||
<ng-template ngFor [ngForOf]="chartIndicatorPaths.controls" let-indicatorPath let-i="index"
|
||||
[formGroup]="toFormGroup(indicatorPath)">
|
||||
<div dashboard-input class="uk-width-1-1"
|
||||
[title]="indicatorPath.get('url').disabled?'Default chart URLs cannot change':''"
|
||||
[formInput]="indicatorPath.get('url')"
|
||||
label="Chart Url"></div>
|
||||
<div *ngIf="urlParameterizedMessage.length > 0" class="uk-alert-warning uk-alert uk-width-1-1">
|
||||
{{urlParameterizedMessage}}
|
||||
</div>
|
||||
<div *ngIf="getParameter(i, 'subtitle')" class="uk-form-row">
|
||||
<div dashboard-input
|
||||
[formInput]="getParameter(i, 'subtitle').get('value')"
|
||||
label="Chart Subtitle"></div>
|
||||
</div>
|
||||
<div class="uk-grid-medium uk-form-row" uk-grid>
|
||||
<ng-template formArrayName="parameters">
|
||||
<div *ngIf="getParameter(i, 'title')" class="uk-width-1-1">
|
||||
<div dashboard-input
|
||||
[formInput]="getParameter(i, 'title').get('value')"
|
||||
label="Chart Title"></div>
|
||||
</div>
|
||||
<div *ngIf="getParameter(i, 'subtitle')" class="uk-width-1-1">
|
||||
<div dashboard-input
|
||||
[formInput]="getParameter(i, 'subtitle').get('value')"
|
||||
label="Chart Subtitle"></div>
|
||||
</div>
|
||||
<div *ngIf="!getParameter(i, 'type')" class="uk-width-1-3@s">
|
||||
<div dashboard-input [formInput]="indicatorPath.get('type')"
|
||||
type="select"
|
||||
|
|
@ -436,28 +386,30 @@
|
|||
<div dashboard-input [formInput]="getParameter(i, 'end_year').get('value')"
|
||||
label="Year (To)"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="indicator && indicator.indicatorPaths[i] && indicator.indicatorPaths[i].safeResourceUrl"
|
||||
class="uk-margin-medium-top uk-position-relative">
|
||||
<div *ngIf="(hasDifference(i)) && !indicatorPath.invalid"
|
||||
class="uk-width-1-1 uk-height-medium refresh-iframe">
|
||||
<div class="uk-position-relative uk-height-1-1">
|
||||
<div class="uk-position-center md-color-white uk-text-center clickable"
|
||||
(click)="refreshIndicator()">
|
||||
<div><i class="material-icons md-color-white">refresh</i></div>
|
||||
<span>Click to refresh the graph view</span>
|
||||
</ng-template>
|
||||
<div *ngIf="indicator && indicator.indicatorPaths[i] && indicator.indicatorPaths[i].safeResourceUrl"
|
||||
class="uk-margin-medium-top uk-position-relative uk-width-1-1 uk-flex uk-flex-center">
|
||||
<div *ngIf="(hasDifference(i)) && !indicatorPath.invalid"
|
||||
class="uk-width-1-1 uk-height-large refresh-iframe">
|
||||
<div class="uk-position-relative uk-height-1-1">
|
||||
<div class="uk-position-center uk-text-center clickable"
|
||||
(click)="refreshIndicator()">
|
||||
<div>
|
||||
<icon name="refresh"></icon>
|
||||
</div>
|
||||
<span>Click to refresh the graph view</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<iframe *ngIf="indicator.indicatorPaths[i].source !== 'image'"
|
||||
[src]="indicator.indicatorPaths[i].safeResourceUrl"
|
||||
class="uk-width-1-1 uk-height-large"></iframe>
|
||||
<div *ngIf="indicator.indicatorPaths[i].source === 'image'">
|
||||
<img class="uk-width-1-1 uk-height-large" [src]="indicator.indicatorPaths[i].url">
|
||||
</div>
|
||||
</div>
|
||||
<iframe *ngIf="indicator.indicatorPaths[i].source !== 'image'"
|
||||
[src]="indicator.indicatorPaths[i].safeResourceUrl"
|
||||
class="uk-width-1-1 uk-height-medium"></iframe>
|
||||
<div *ngIf="indicator.indicatorPaths[i].source === 'image'">
|
||||
<img class="uk-width-1-1 uk-height-medium" [src]="indicator.indicatorPaths[i].url">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
</ng-template>
|
||||
</div>
|
||||
</div>
|
||||
</modal-alert>
|
||||
|
|
@ -472,18 +424,18 @@
|
|||
<!-- </span>-->
|
||||
Are you sure you want to proceed?
|
||||
</modal-alert>
|
||||
<!--<modal-alert #deleteAllModal (alertOutput)="deleteIndicator('delete')">-->
|
||||
<!-- You are about to delete <span class="uk-text-bold" *ngIf="indicator && index !== -1">-->
|
||||
<!-- "{{indicator.name ? indicator.name : indicator.indicatorPaths[0].parameters.title}}"</span> indicator permanently.-->
|
||||
<!-- <span class="uk-text-bold">Indicators of all profiles based on this default indicator, will be deleted as well.</span>-->
|
||||
<!-- Are you sure you want to proceed?-->
|
||||
<!--</modal-alert>-->
|
||||
<!--<modal-alert #deleteAndDisconnectModal (alertOutput)="deleteIndicator('disconnect')">-->
|
||||
<!-- You are about to delete <span class="uk-text-bold" *ngIf="indicator && index !== -1">-->
|
||||
<!-- "{{indicator.name ? indicator.name : indicator.indicatorPaths[0].parameters.title}}"</span> indicator permanently.-->
|
||||
<!-- <span class="uk-text-bold">Indicators of all profiles based on this default indicator, will not be marked as copied from default anymore.</span>-->
|
||||
<!-- Are you sure you want to proceed?-->
|
||||
<!--</modal-alert>-->
|
||||
<!--<modal-alert #deleteAllModal (alertOutput)="deleteIndicator('delete')">
|
||||
You are about to delete <span class="uk-text-bold" *ngIf="indicator && index !== -1">
|
||||
"{{indicator.name ? indicator.name : indicator.indicatorPaths[0].parameters.title}}"</span> indicator permanently.
|
||||
<span class="uk-text-bold">Indicators of all profiles based on this default indicator, will be deleted as well.</span>
|
||||
Are you sure you want to proceed?
|
||||
</modal-alert>
|
||||
<modal-alert #deleteAndDisconnectModal (alertOutput)="deleteIndicator('disconnect')">
|
||||
You are about to delete <span class="uk-text-bold" *ngIf="indicator && index !== -1">
|
||||
"{{indicator.name ? indicator.name : indicator.indicatorPaths[0].parameters.title}}"</span> indicator permanently.
|
||||
<span class="uk-text-bold">Indicators of all profiles based on this default indicator, will not be marked as copied from default anymore.</span>
|
||||
Are you sure you want to proceed?
|
||||
</modal-alert>-->
|
||||
<modal-alert #deleteSectionModal (alertOutput)="deleteSection()">
|
||||
You are about to delete this section and its indicators permanently.
|
||||
<div *ngIf="sectionChildrenActionOnDelete == 'delete' && !stakeholder.defaultId" class="uk-text-bold">
|
||||
|
|
@ -494,30 +446,46 @@
|
|||
<!-- </span>-->
|
||||
Are you sure you want to proceed?
|
||||
</modal-alert>
|
||||
<!--<modal-alert #deleteNumberSectionModal (alertOutput)="deleteSection('number')">-->
|
||||
<!-- You are about to delete this section and its indicators permanently.-->
|
||||
<!-- Are you sure you want to proceed?-->
|
||||
<!--</modal-alert>-->
|
||||
<!--<modal-alert #deleteChartSectionModal (alertOutput)="deleteSection()">-->
|
||||
<!-- You are about to delete this section and its indicators permanently.-->
|
||||
<!-- Are you sure you want to proceed?-->
|
||||
<!--</modal-alert>-->
|
||||
<ng-template #visibilityOptions let-indicator="indicator" >
|
||||
<span class="uk-invisible-hover uk-padding-remove" (click)="$event.stopPropagation();$event.preventDefault()">
|
||||
<i [attr.uk-icon]="stakeholderUtils.visibilityIcon.get(indicator.visibility)" class="clickable visibility"></i>
|
||||
<div #element uk-dropdown="mode: click; pos: bottom-left; delay-hide: 0; flip: false">
|
||||
<ul class="uk-nav uk-dropdown-nav">
|
||||
<li *ngFor="let v of stakeholderUtils.visibility" [class.selectedVisibility]="v.value == indicator.visibility">
|
||||
<a
|
||||
*ngIf="indicator.visibility != v.value"
|
||||
(click)="$event.stopPropagation();toggleIndicatorStatus(indicator._id, indicator,v.value);hide(element);$event.preventDefault()">
|
||||
<i [attr.uk-icon]="stakeholderUtils.visibilityIcon.get( v.value)"></i> {{v.label}}</a>
|
||||
<a *ngIf="indicator.visibility == v.value">
|
||||
<i [attr.uk-icon]="stakeholderUtils.visibilityIcon.get( v.value)"></i> {{v.label}} <icon
|
||||
customClass="uk-text-secondary uk-float-right" [ratio]="0.5"
|
||||
name="bullet"></icon></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</span>
|
||||
</ng-template>
|
||||
<!--<modal-alert #deleteNumberSectionModal (alertOutput)="deleteSection('number')">
|
||||
You are about to delete this section and its indicators permanently.
|
||||
Are you sure you want to proceed?
|
||||
</modal-alert>
|
||||
<modal-alert #deleteChartSectionModal (alertOutput)="deleteSection()">
|
||||
You are about to delete this section and its indicators permanently.
|
||||
Are you sure you want to proceed?
|
||||
</modal-alert>-->
|
||||
<ng-template #visibilityOptions let-indicator="indicator">
|
||||
<span class="uk-position-top-left uk-margin-small-left uk-margin-small-top clickable visibility">
|
||||
<span class="clickable color">
|
||||
<icon [name]="stakeholderUtils.visibilityIcon.get(indicator.visibility)"></icon>
|
||||
</span>
|
||||
<div #element uk-dropdown="mode: click; pos: bottom-left; delay-hide: 0; flip: false">
|
||||
<ul class="uk-nav uk-dropdown-nav">
|
||||
<li *ngFor="let v of stakeholderUtils.visibility" class="uk-position-relative">
|
||||
<a *ngIf="indicator.visibility != v.value"
|
||||
(click)="$event.stopPropagation();toggleIndicatorStatus(indicator._id, indicator,v.value);hide(element);$event.preventDefault()">
|
||||
<icon [name]="stakeholderUtils.visibilityIcon.get(v.value)" ratio="0.8"></icon>
|
||||
<span> {{v.label}}</span>
|
||||
</a>
|
||||
<a *ngIf="indicator.visibility == v.value">
|
||||
<icon [name]="stakeholderUtils.visibilityIcon.get(v.value)" [ratio]="0.8"></icon>
|
||||
<span> {{v.label}}</span>
|
||||
<span class="uk-position-center-right">
|
||||
<icon customClass="uk-text-secondary" [ratio]="0.5" name="bullet"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</span>
|
||||
</ng-template>
|
||||
<ng-template #new_section let-type="type">
|
||||
<div class="new-section uk-margin-large-top">
|
||||
<div class="tools uk-flex uk-flex-middle clickable" (click)="createSection(-1, type)">
|
||||
<button class="uk-margin-small-right uk-icon-button uk-button-secondary">
|
||||
<icon name="add" [ratio]="1.5"></icon>
|
||||
</button>
|
||||
<span>Create a new section</span>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
|
|
|
|||
|
|
@ -27,7 +27,6 @@ import {StakeholderService} from "../openaireLibrary/monitor/services/stakeholde
|
|||
import {EnvProperties} from "../openaireLibrary/utils/properties/env-properties";
|
||||
import {Subscriber} from "rxjs";
|
||||
import {LayoutService} from "../openaireLibrary/dashboard/sharedComponents/sidebar/layout.service";
|
||||
import {Option} from "../openaireLibrary/dashboard/sharedComponents/input/input.component";
|
||||
import {Router} from "@angular/router";
|
||||
import {Session} from "../openaireLibrary/login/utils/helper.class";
|
||||
import {UserManagementService} from "../openaireLibrary/services/user-management.service";
|
||||
|
|
@ -36,7 +35,8 @@ declare var UIkit;
|
|||
|
||||
@Component({
|
||||
selector: 'indicators',
|
||||
templateUrl: './indicators.component.html'
|
||||
templateUrl: './indicators.component.html',
|
||||
styleUrls: ['indicators.component.css']
|
||||
})
|
||||
export class IndicatorsComponent implements OnInit, OnDestroy, OnChanges, AfterViewInit {
|
||||
|
||||
|
|
@ -71,11 +71,8 @@ export class IndicatorsComponent implements OnInit, OnDestroy, OnChanges, AfterV
|
|||
/**
|
||||
* Top filters
|
||||
*/
|
||||
@Input()
|
||||
public filters: FormGroup;
|
||||
public all: Option = {
|
||||
value: 'all',
|
||||
label: 'All'
|
||||
};
|
||||
/**
|
||||
* Toggles
|
||||
*/
|
||||
|
|
@ -213,11 +210,6 @@ export class IndicatorsComponent implements OnInit, OnDestroy, OnChanges, AfterV
|
|||
}
|
||||
|
||||
private buildFilters() {
|
||||
this.filters = this.fb.group({
|
||||
chartType: this.fb.control('all'),
|
||||
status: this.fb.control('all'),
|
||||
keyword: this.fb.control('')
|
||||
});
|
||||
this.subscriptions.push(this.filters.get('chartType').valueChanges.subscribe(value => {
|
||||
this.onChartTypeChange(value);
|
||||
}));
|
||||
|
|
@ -380,6 +372,10 @@ export class IndicatorsComponent implements OnInit, OnDestroy, OnChanges, AfterV
|
|||
return this.chartIndicatorFb.get('indicatorPaths') as FormArray;
|
||||
}
|
||||
|
||||
public toFormGroup(value: any): FormGroup {
|
||||
return value as FormGroup
|
||||
}
|
||||
|
||||
public addJsonPath(index: number) {
|
||||
if(index==0 && this.getJsonPath(index).getRawValue()[index].indexOf(",")!=-1){
|
||||
//if in the first path there are more than one paaths comma separated, split them and autogenerate the forms
|
||||
|
|
@ -956,20 +952,22 @@ export class IndicatorsComponent implements OnInit, OnDestroy, OnChanges, AfterV
|
|||
// }
|
||||
|
||||
deleteSectionOpen(section: Section, index: number, type: IndicatorType, childrenAction: string = null) {
|
||||
this.sectionTypeToDelete = type;
|
||||
this.sectionChildrenActionOnDelete = null;
|
||||
if(childrenAction == "delete") {
|
||||
this.sectionChildrenActionOnDelete = childrenAction;
|
||||
} else if(childrenAction == "disconnect") {
|
||||
this.sectionChildrenActionOnDelete = childrenAction;
|
||||
if(!this.editing && !section.defaultId) {
|
||||
this.sectionTypeToDelete = type;
|
||||
this.sectionChildrenActionOnDelete = null;
|
||||
if (childrenAction == "delete") {
|
||||
this.sectionChildrenActionOnDelete = childrenAction;
|
||||
} else if (childrenAction == "disconnect") {
|
||||
this.sectionChildrenActionOnDelete = childrenAction;
|
||||
}
|
||||
|
||||
this.section = section;
|
||||
this.index = index;
|
||||
this.deleteSectionModal.alertTitle = 'Delete Section';
|
||||
this.deleteSectionModal.cancelButtonText = 'No';
|
||||
this.deleteSectionModal.okButtonText = 'Yes';
|
||||
this.deleteSectionModal.open();
|
||||
}
|
||||
|
||||
this.section = section;
|
||||
this.index = index;
|
||||
this.deleteSectionModal.alertTitle = 'Delete Section';
|
||||
this.deleteSectionModal.cancelButtonText = 'No';
|
||||
this.deleteSectionModal.okButtonText = 'Yes';
|
||||
this.deleteSectionModal.open();
|
||||
}
|
||||
|
||||
deleteSection() {
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<div class="uk-text-center">
|
||||
<a [routerLink]="'/admin/' + stakeholder.alias"
|
||||
class="uk-link-heading uk-text-uppercase uk-flex uk-flex-middle uk-flex-center">
|
||||
<span class="" uk-icon="icon:close;ratio:1.8"></span>
|
||||
<icon name="close" ratio="2"></icon>
|
||||
<span *ngIf="open" class="uk-margin-left">Indicators</span>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -14,7 +14,7 @@
|
|||
<li class="uk-visible-toggle"
|
||||
[class.uk-active]="topicIndex == i">
|
||||
<a [routerLink]="'/admin/'+stakeholder.alias + '/indicators/' + topic.alias"
|
||||
class="uk-flex uk-flex-middle">
|
||||
class="uk-flex uk-flex-middle" [title]="topic.name">
|
||||
<span *ngIf="topic.icon"></span>
|
||||
<div class="uk-width-expand uk-position-relative uk-flex uk-flex-middle"
|
||||
[class.uk-flex-center]="open">
|
||||
|
|
@ -69,12 +69,12 @@
|
|||
<span class="uk-position-center" *ngIf="open" uk-icon="icon: chevron-left; ratio:1.5"></span>
|
||||
</div>
|
||||
</aside>
|
||||
<div *ngIf="stakeholder" page-content>
|
||||
<div *ngIf="stakeholder && filters" page-content>
|
||||
<div header>
|
||||
<nav class=" ">
|
||||
<div *ngIf="stakeholder && stakeholder.topics[topicIndex]" class="">
|
||||
<ul *ngIf="stakeholder.topics[topicIndex] && stakeholder.topics[topicIndex].categories.length > 0"
|
||||
class="customTabs uk-tab ignore admin uk-flex uk-flex-middle">
|
||||
<nav>
|
||||
<div *ngIf="stakeholder && stakeholder.topics[topicIndex]">
|
||||
<ul *ngIf="stakeholder.topics[topicIndex]"
|
||||
class="customTabs uk-tab ignore admin uk-flex uk-flex-middle" visibility="true">
|
||||
<ng-template ngFor [ngForOf]="stakeholder.topics[topicIndex].categories" let-category let-i="index">
|
||||
<li class="uk-visible-toggle uk-flex uk-flex-middle"
|
||||
[class.uk-active]="category.alias === stakeholder.topics[topicIndex].categories[categoryIndex].alias">
|
||||
|
|
@ -116,9 +116,8 @@
|
|||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<ul *ngIf=" stakeholder.topics[topicIndex].categories[categoryIndex] &&
|
||||
stakeholder.topics[topicIndex].categories[categoryIndex].subCategories.length > 0"
|
||||
class="uk-subnav uk-subnav-pill subCategoriesTabs ignore admin uk-flex uk-flex-middle">
|
||||
<ul *ngIf=" stakeholder.topics[topicIndex].categories[categoryIndex]"
|
||||
visibility="true" class="uk-subnav uk-subnav-pill subCategoriesTabs ignore admin uk-flex uk-flex-middle">
|
||||
<ng-template ngFor [ngForOf]="stakeholder.topics[topicIndex].categories[categoryIndex].subCategories"
|
||||
let-subCategory let-i="index">
|
||||
<li [class.uk-active]="(subCategory.alias ===
|
||||
|
|
@ -166,11 +165,33 @@
|
|||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
<!--<div class="uk-grid uk-margin-medium" uk-grid>
|
||||
<div *ngIf="filters" class="uk-width-2-3@m uk-width-1-1 uk-child-width-1-3@m uk-child-width-1-1" uk-grid>
|
||||
<div>
|
||||
<div dashboard-input [formInput]="filters.get('chartType')"
|
||||
type="select" [options]="[all].concat(indicatorUtils.allChartTypes)"
|
||||
label="Chart Type"></div>
|
||||
</div>
|
||||
<div>
|
||||
<div dashboard-input [formInput]="filters.get('status')"
|
||||
type="select" [options]="[all].concat(stakeholderUtils.visibility)"
|
||||
label="Status"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-width-expand@m uk-width-1-1 uk-flex uk-flex-middle uk-flex-right">
|
||||
<div class="uk-inline uk-width-medium">
|
||||
<span class="uk-position-center-right"><i uk-icon="search" class="uk-icon"></i></span>
|
||||
<div dashboard-input [formInput]="filters.get('keyword')" label="Locate indicator"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>-->
|
||||
</div>
|
||||
<div inner>
|
||||
<indicators [properties]="properties"
|
||||
[topicIndex]="topicIndex"
|
||||
[categoryIndex]="categoryIndex"
|
||||
[filters]="filters"
|
||||
[subcategoryIndex]="subCategoryIndex"></indicators>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -15,10 +15,11 @@ import {HelperFunctions} from "../openaireLibrary/utils/HelperFunctions.class";
|
|||
import {AlertModal} from "../openaireLibrary/utils/modal/alert";
|
||||
import {Subscriber, Subscription} from "rxjs";
|
||||
import {FormBuilder, FormGroup, Validators} from "@angular/forms";
|
||||
import {StakeholderUtils} from "../utils/indicator-utils";
|
||||
import {IndicatorUtils, StakeholderUtils} from "../utils/indicator-utils";
|
||||
import {StringUtils} from "../openaireLibrary/utils/string-utils.class";
|
||||
import {IDeactivateComponent} from "../openaireLibrary/utils/can-exit.guard";
|
||||
import {LayoutService} from "../openaireLibrary/dashboard/sharedComponents/sidebar/layout.service";
|
||||
import {Option} from "../openaireLibrary/dashboard/sharedComponents/input/input.component";
|
||||
|
||||
declare var UIkit;
|
||||
|
||||
|
|
@ -30,6 +31,7 @@ export class TopicComponent implements OnInit, OnDestroy, IDeactivateComponent {
|
|||
public subscriptions: any[] = [];
|
||||
public properties: EnvProperties;
|
||||
public stakeholderUtils: StakeholderUtils = new StakeholderUtils();
|
||||
public indicatorUtils: IndicatorUtils = new IndicatorUtils();
|
||||
public loading: boolean = true;
|
||||
public stakeholder: Stakeholder;
|
||||
/**
|
||||
|
|
@ -60,7 +62,12 @@ export class TopicComponent implements OnInit, OnDestroy, IDeactivateComponent {
|
|||
@ViewChild('deleteModal') deleteModal: AlertModal;
|
||||
@ViewChild('editModal') editModal: AlertModal;
|
||||
public elementChildrenActionOnDelete: string;
|
||||
|
||||
public filters: FormGroup;
|
||||
public all: Option = {
|
||||
value: 'all',
|
||||
label: 'All'
|
||||
};
|
||||
|
||||
constructor(
|
||||
private route: ActivatedRoute,
|
||||
private router: Router,
|
||||
|
|
@ -89,9 +96,11 @@ export class TopicComponent implements OnInit, OnDestroy, IDeactivateComponent {
|
|||
}
|
||||
this.categoryIndex = 0;
|
||||
this.subCategoryIndex = 0;
|
||||
// console.debug(this. stakeholder.topics[this.topicIndex])
|
||||
// console.debug(this. stakeholder.topics[this.topicIndex].categories)
|
||||
// console.debug( this. stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subCategoryIndex])
|
||||
this.filters = this.fb.group({
|
||||
chartType: this.fb.control('all'),
|
||||
status: this.fb.control('all'),
|
||||
keyword: this.fb.control('')
|
||||
});
|
||||
if (this.topicIndex === -1) {
|
||||
this.navigateToError();
|
||||
} else {
|
||||
|
|
@ -173,7 +182,7 @@ export class TopicComponent implements OnInit, OnDestroy, IDeactivateComponent {
|
|||
}));
|
||||
}
|
||||
|
||||
public editTopicOpen(index=this.topicIndex) {
|
||||
public editTopicOpen(index= -1) {
|
||||
this.index = index;
|
||||
this.type = 'topic';
|
||||
if (index === -1) {
|
||||
|
|
@ -184,14 +193,21 @@ export class TopicComponent implements OnInit, OnDestroy, IDeactivateComponent {
|
|||
this.editOpen();
|
||||
}
|
||||
|
||||
public saveTopic(index=this.topicIndex) {
|
||||
this.index = index;
|
||||
public saveTopic() {
|
||||
if (!this.form.invalid) {
|
||||
let path = [this.stakeholder._id];
|
||||
let callback = (topic: Topic): void => {
|
||||
this.stakeholder.topics[this.index] = topic;
|
||||
if (this.index === -1) {
|
||||
this.stakeholder.topics.push(topic);
|
||||
} else {
|
||||
this.stakeholder.topics[this.index] = HelperFunctions.copy(topic);
|
||||
}
|
||||
};
|
||||
this.save('Topic has been successfully saved', path, this.form.value, callback, true);
|
||||
if (this.index === -1) {
|
||||
this.save('Topic has been successfully created', path, this.form.value, callback);
|
||||
} else {
|
||||
this.save('Topic has been successfully saved', path, this.form.value, callback);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ import {InputModule} from "../openaireLibrary/dashboard/sharedComponents/input/i
|
|||
import {ClickModule} from "../openaireLibrary/utils/click/click.module";
|
||||
import {AdminDashboardGuard} from "../utils/adminDashboard.guard";
|
||||
import {IconsService} from "../openaireLibrary/utils/icons/icons.service";
|
||||
import {preview, bullet, add, earth, lock, group} from "../openaireLibrary/utils/icons/icons";
|
||||
import {preview, bullet, add, earth, lock, group, refresh, close} from "../openaireLibrary/utils/icons/icons";
|
||||
import {IconsModule} from "../openaireLibrary/utils/icons/icons.module";
|
||||
import {PageContentModule} from "../openaireLibrary/dashboard/sharedComponents/page-content/page-content.module";
|
||||
|
||||
|
|
@ -37,6 +37,6 @@ import {PageContentModule} from "../openaireLibrary/dashboard/sharedComponents/p
|
|||
})
|
||||
export class TopicModule {
|
||||
constructor(private iconsService: IconsService) {
|
||||
this.iconsService.registerIcons([preview, bullet, add, earth, lock, group]);
|
||||
this.iconsService.registerIcons([preview, bullet, add, earth, lock, group, refresh, close]);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,3 +6,5 @@
|
|||
@import "tabs-pills.css";
|
||||
@import "card.css";
|
||||
@import "button.css";
|
||||
@import "sortable.css";
|
||||
@import "notification.css";
|
||||
|
|
|
|||
|
|
@ -0,0 +1,19 @@
|
|||
.uk-notification-message {
|
||||
border-radius: 3px;
|
||||
font-size: var(--small-font-size);
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.uk-notification-message.uk-notification-message-success {
|
||||
background-color: #e0f0d5;
|
||||
color: #669a59;
|
||||
}
|
||||
|
||||
.uk-notification-message.uk-notification-message-danger {
|
||||
background-color: #f2dede;
|
||||
color: #b25654;
|
||||
}
|
||||
|
||||
.uk-notification-close.uk-close, .uk-notification-close.uk-close:hover {
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
.dashboard .uk-sortable > * {
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
.dashboard .uk-sortable-drag .uk-card.uk-card-hover {
|
||||
-webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
|
||||
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
|
||||
}
|
||||
|
||||
.dashboard .uk-sortable-drag {
|
||||
overflow: unset !important;
|
||||
}
|
||||
|
||||
.uk-drag .dashboard .disable-sortable {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.dashboard .uk-sortable .uk-sortable-nodrag {
|
||||
cursor: default;
|
||||
}
|
||||
|
|
@ -67,6 +67,7 @@
|
|||
|
||||
#sidebar_switcher_toggle {
|
||||
top: 50%;
|
||||
color: var(--secondary-color);
|
||||
transform: translateY(-50%);
|
||||
position: fixed;
|
||||
background: #ffffff;
|
||||
|
|
|
|||
|
|
@ -71,3 +71,12 @@
|
|||
border: 1px solid var(--primary-color);
|
||||
background-color: var(--primary-color);
|
||||
}
|
||||
|
||||
.uk-subnav[visibility=true], .uk-tab[visibility=true] {
|
||||
margin-left: -50px;
|
||||
}
|
||||
|
||||
.uk-subnav[visibility=true] > li:not(:first-child):not(:last-child) > :first-child,
|
||||
.uk-tab[visibility=true] > li:not(:first-child):not(:last-child) {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -137,6 +137,7 @@
|
|||
|
||||
.stakeholderPage #sidebar_main #sidebar_content, .stakeholderPage #sidebar_switcher_toggle {
|
||||
border-color: var(--monitor-portal-color);
|
||||
color: var(--monitor-portal-color);
|
||||
}
|
||||
|
||||
/* Section Tools*/
|
||||
|
|
@ -154,44 +155,40 @@
|
|||
top: 0;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -100%);
|
||||
width: 50px;
|
||||
max-width: 50px;
|
||||
background: var(--secondary-color);
|
||||
color: var(--contrast-color);
|
||||
-webkit-clip-path: polygon(15% 5%, 100% 5%, 100% 100%, 0% 100%);
|
||||
clip-path: polygon(20% 5%, 80% 5%, 100% 100%, 0% 100%);
|
||||
display: none;
|
||||
}
|
||||
|
||||
.dashboard .section:not(.list-view) {
|
||||
border: white solid 1px;
|
||||
.dashboard .section {
|
||||
border: transparent solid 1px;
|
||||
}
|
||||
|
||||
.dashboard .section:not(.list-view):hover {
|
||||
.dashboard .section:hover {
|
||||
border: var(--secondary-color) solid 1px;
|
||||
}
|
||||
|
||||
.dashboard .section:not(.list-view):hover .tools {
|
||||
.dashboard .section:hover .tools {
|
||||
display: block;
|
||||
width: 50px;
|
||||
background: var(--secondary-color);
|
||||
color: white;
|
||||
-webkit-clip-path: polygon(15% 0%, 100% 0, 100% 100%, 0% 100%);
|
||||
clip-path: polygon(20% 0%, 80% 0, 100% 100%, 0% 100%);
|
||||
}
|
||||
|
||||
.dashboard .section:not(.list-view):hover .tools a {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.dashboard .section:hover .tools .actions a:last-child {
|
||||
margin-left: 3px;
|
||||
.dashboard .section:hover .tools a {
|
||||
color: currentColor;
|
||||
}
|
||||
|
||||
|
||||
/* New section*/
|
||||
.dashboard .new-section {
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
padding-right: 10px;
|
||||
border: #cecece dashed 2px;
|
||||
border: #707070 dashed 1px;
|
||||
border-radius: 2px;
|
||||
background-color: white;
|
||||
min-height: 100px;
|
||||
min-height: 200px;
|
||||
position: relative;
|
||||
box-shadow: 0 2px 6px #00000038;
|
||||
}
|
||||
|
||||
.dashboard .new-section .tools {
|
||||
|
|
@ -201,14 +198,6 @@
|
|||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.dashboard .new-section .tools .md-btn {
|
||||
background-color: var(--secondary-color);
|
||||
position: relative;
|
||||
min-width: 40px;
|
||||
min-height: 40px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.dashboard .new-section .tools .md-btn .material-icons {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
|
|
@ -245,3 +234,14 @@
|
|||
bottom: 3px;
|
||||
left: 3px;
|
||||
}
|
||||
|
||||
.refresh-iframe {
|
||||
background-color: rgba(0, 0, 0, 0.50);
|
||||
border-radius: 4px;
|
||||
position: absolute;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.uk-modal-container .uk-modal-dialog {
|
||||
width: 900px;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue