-
diff --git a/src/app/topic/indicators.component.ts b/src/app/topic/indicators.component.ts
index 85aaef5..3d7a05a 100644
--- a/src/app/topic/indicators.component.ts
+++ b/src/app/topic/indicators.component.ts
@@ -34,7 +34,8 @@ export class IndicatorsComponent implements OnInit, OnDestroy, OnChanges, AfterV
public preview: string;
public indicatorUtils: IndicatorUtils = new IndicatorUtils();
public indicatorFb: FormGroup;
- public sectionFbs: FormArray;
+ public chartSections: FormArray;
+ public numberSections: FormArray;
/**
* Editable indicator
*/
@@ -73,6 +74,7 @@ export class IndicatorsComponent implements OnInit, OnDestroy, OnChanges, AfterV
ngOnInit(): void {
this.buildFilters();
+ this.buildSections();
}
ngOnDestroy(): void {
@@ -172,6 +174,31 @@ export class IndicatorsComponent implements OnInit, OnDestroy, OnChanges, AfterV
}));
}
+ private buildSections() {
+ this.numberSections = this.fb.array([]);
+ this.numbers.forEach(section => {
+ this.numberSections.push(this.fb.group({
+ _id: this.fb.control(section._id),
+ title: this.fb.control(section.title),
+ stakeholderAlias: this.fb.control(section.stakeholderAlias),
+ defaultId: this.fb.control(section.defaultId),
+ type: this.fb.control(section.type),
+ indicators: this.fb.control(section.indicators)
+ }));
+ });
+ this.chartSections = this.fb.array([]);
+ this.charts.forEach(section => {
+ this.chartSections.push(this.fb.group({
+ _id: this.fb.control(section._id),
+ title: this.fb.control(section.title),
+ stakeholderAlias: this.fb.control(section.stakeholderAlias),
+ defaultId: this.fb.control(section.defaultId),
+ type: this.fb.control(section.type),
+ indicators: this.fb.control(section.indicators)
+ }));
+ });
+ }
+
filterCharts() {
this.displayCharts = this.filterChartType(this.filterPrivacy(
this.filterStatus(this.filterByKeyword(HelperFunctions.copy(this.charts), this.filters.value.keyword),
@@ -508,4 +535,8 @@ export class IndicatorsComponent implements OnInit, OnDestroy, OnChanges, AfterV
indicator.isPublic = isPublic;
});
}
+
+ createSection(index: number = -1) {
+
+ }
}
diff --git a/src/assets/env-properties.json b/src/assets/env-properties.json
index b88abc1..3052733 100644
--- a/src/assets/env-properties.json
+++ b/src/assets/env-properties.json
@@ -37,9 +37,9 @@
"piwikBaseUrl" :"https://analytics.openaire.eu/piwik.php?idsite=",
"piwikSiteId" : "80",
- "loginUrl" :"http://scoobydoo.di.uoa.gr:8080/dnet-openaire-users-1.0.0-SNAPSHOT/openid_connect_login",
+ "loginUrl" :"http://rudie.di.uoa.gr:8080/dnet-openaire-users-1.0.0-SNAPSHOT/openid_connect_login",
- "userInfoUrl" : "http://scoobydoo.di.uoa.gr:8080/dnet-openaire-users-1.0.0-SNAPSHOT/api/users/getUserInfo?accessToken=",
+ "userInfoUrl" : "http://rudie.di.uoa.gr:8080/dnet-openaire-users-1.0.0-SNAPSHOT/api/users/getUserInfo?accessToken=",
"logoutUrl" :"https://aai.openaire.eu/proxy/saml2/idp/SingleLogoutService.php?ReturnTo=",
diff --git a/src/assets/monitor-custom.css b/src/assets/monitor-custom.css
index d372fad..3360889 100644
--- a/src/assets/monitor-custom.css
+++ b/src/assets/monitor-custom.css
@@ -19,9 +19,13 @@
--connect-portal-lower-tone: #b48536;
--develop-portal-lower-tone: #9f4e7e;
+
+ /* Dashboard variables*/
--sidebar-width: 320px;
--sidebar-font-size: 16px;
--header-height: 70px;
+ --primary-color: #0d47a1;
+ --secondary-color: #1CA9D5;
--monitor-header-menu-height: 100px;
}
@@ -44,6 +48,12 @@
/*}*/
+.double-header #header_menu a {
+ user-select: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+}
+
.double-header #header_main .uk-navbar-nav > li > a {
font-size: 20px;
font-family: 'Open Sans';
@@ -94,15 +104,15 @@
.double-header #header_main{
top: var(--monitor-header-menu-height);
}
-.double-header #header_menu{
+.double-header #header_menu {
position: fixed;
top: 0;
left: 0;
height:var(--monitor-header-menu-height);
background:white;
z-index: 1215;
-
}
+
.double-header #header_menu .uk-navbar-nav > li.uk-active a span {
-webkit-box-shadow: inset 0 -2px 0 #333;
box-shadow: inset 0 -2px 0 #333;
@@ -128,46 +138,24 @@
max-height: 80px;
}
-.stakeholderPage #style_switcher{
+.stakeholderPage #style_switcher {
top:200px;
}
-.loginLink.light{
- color: white !important;
+
+/* Login Box*/
+.dashboard .double-header .login {
+ color: rgba(0,0,0,.54);
font-weight: bold;
}
-circle.userBox.light{
- stroke: white;
- fill: white;
-}
-
-text.userBox.light {
- stroke: #0d47a1;
- fill: #0d47a1;
-}
-
-svg .icon.userBox.light{
- stroke: #0d47a1;
- fill: none;
-}
-
-svg .loginLink.userBox.light{
- stroke: white;
- fill: none;
-}
-
-.loginLink.dark{
- color: rgba(0,0,0,.54) !important;
- font-weight: bold;
-}
-
-circle.userBox.dark, svg .icon.userBox.dark, svg .loginLink.userBox.dark{
+.dashboard .double-header circle, .dashboard .double-header .login svg,
+.dashboard .double-header svg svg *, .dashboard .double-header .login svg * {
stroke: rgba(0,0,0,.54);
fill: none;
}
-text.userBox.dark {
+.dashboard .double-header text {
stroke: rgba(0,0,0,.54);
fill: rgba(0,0,0,.54);
}
diff --git a/src/assets/theme-assets/dashboard-custom.css b/src/assets/theme-assets/dashboard-custom.css
index 90db930..3657522 100644
--- a/src/assets/theme-assets/dashboard-custom.css
+++ b/src/assets/theme-assets/dashboard-custom.css
@@ -4,6 +4,8 @@
--sidebar-font-size: 16px;
--header-height: 70px;
--list-card-max-width: 1220px;
+ --primary-color: #0d47a1;
+ --secondary-color: #1CA9D5;
*/
/* Global css*/
@@ -15,6 +17,12 @@ html .dashboard {
cursor: pointer !important;
}
+.dashboard #hide_controls #toggle *, .dashboard #header_main a, .dashboard #sidebar_main a {
+ user-select: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+}
+
/* On link hover, his items with this class will be displayed*/
.dashboard li > a .onHover {
display: none;
@@ -25,7 +33,7 @@ html .dashboard {
display: block;
}
-/* Custom height of header, change var: header-height*/
+/* Sidebar with hide controls*/
.dashboard #sidebar_main {
display: flex;
flex-direction: column;
@@ -76,19 +84,13 @@ html .dashboard {
}
.dashboard #hide_controls #toggle:hover, .dashboard #hide_controls #toggle:not(.sidebar_main_open) {
- color: #0d47a1;
+ color: var(--primary-color);
}
.dashboard #hide_controls:hover #toggle:hover .material-icons,
.dashboard #hide_controls #toggle:not(.sidebar_main_open) .material-icons {
- color: #0d47a1;
- border: #0d47a1 solid 1px;
-}
-
-.dashboard #hide_controls #toggle * {
- user-select: none;
- -webkit-user-select: none;
- -moz-user-select: none;
+ color: var(--primary-color);
+ border: var(--primary-color) solid 1px;
}
.dashboard #hide_controls #toggle .material-icons {
@@ -177,6 +179,7 @@ html .dashboard {
align-items: center;
}
+/* Header */
body.dashboard {
padding-top: var(--header-height);
}
@@ -201,7 +204,36 @@ body.dashboard {
margin: calc(var(--header-height) - 48px) 0;
}
-/* Custom card*/
+.dashboard #header_main .material-icons {
+ color: white;
+}
+
+.dashboard #header_main .login {
+ color: white;
+ font-weight: bold;
+}
+
+.dashboard #header_main circle, .dashboard #header_main .login svg {
+ stroke: white;
+ fill: white;
+}
+
+.dashboard #header_main text {
+ stroke: var(--primary-color);
+ fill: var(--primary-color);
+}
+
+.dashboard #header_main svg svg *{
+ stroke: var(--primary-color);
+ fill: none;
+}
+
+.dashboard #header_main .login svg *{
+ stroke: white;
+ fill: none;
+}
+
+/* Card */
.dashboard .md-card .md-card-content {
color: rgba(0, 0, 0, 0.8);
}
@@ -210,21 +242,11 @@ body.dashboard {
color: rgba(0, 0, 0, 0.8);
}
-@media only screen and (max-width: 767px) {
- .dashboard .md-card .md-card-toolbar .md-card-toolbar-actions span {
- display: none;
- }
-}
-
.dashboard .md-card .md-card-toolbar .md-card-toolbar-heading-text {
font-weight: 700;
float: none;
}
-.dashboard .max-width-large {
- max-width: 1220px;
-}
-
/* Breadcrumb*/
.dashboard #breadcrumbs {
background: inherit;
@@ -245,7 +267,7 @@ body.dashboard {
}
/* Notification */
-/* Change z-index, because of sidebar and header z-index is bigger that default */
+/* Change z-index, because of sidebar's and header's z-index are bigger that default */
.dashboard .uk-notification {
z-index: 2000;
}
@@ -269,7 +291,6 @@ body.dashboard {
font-size: 16px;
}
-
.dashboard .uk-notification-close.uk-icon.uk-close svg {
display: none;
}
@@ -288,6 +309,7 @@ body.dashboard {
}
/* Modal*/
+
.dashboard .uk-modal .large-modal {
width: 800px;
}
@@ -318,6 +340,11 @@ body.dashboard {
cursor: default;
}
+/* List view*/
+.dashboard .list-view {
+ max-width: 1220px;
+}
+
/* Section Tools*/
.dashboard .section {
@@ -336,21 +363,34 @@ body.dashboard {
display: none;
}
-.dashboard .section:hover {
- border: rgb(28, 169, 213) solid 1px;
+.dashboard .section:not(.list-view):hover {
+ border: var(--secondary-color) solid 1px;
}
-.dashboard .section:hover .tools {
+.dashboard .section:not(.list-view):hover .tools {
display: block;
}
.dashboard .section:hover .tools .md-btn-group .md-btn-mini {
- border-top-left-radius: 0;
border-bottom-left-radius: 0;
padding: 0;
- background-color: rgb(28, 169, 213);
-webkit-box-shadow: none;
box-shadow: none;
+ margin-left: -1px !important;
+}
+
+.dashboard .section:hover .tools .md-btn-group .md-btn-mini:first-child {
+ border-top-left-radius: 5px;
+}
+
+.dashboard .section:hover .tools .md-btn-group .md-btn-mini:last-child {
+ border-top-right-radius: 5px;
+}
+
+.dashboard .section .md-btn {
+ background-color: var(--secondary-color);
+ width: 20px;
+ color: white;
}
.dashboard .section:hover .tools .md-btn-group .md-btn-mini * {
@@ -359,16 +399,46 @@ body.dashboard {
.dashboard .section:hover .tools .md-btn-group::before {
content: "";
- border-bottom: 25px solid rgb(28, 169, 213);
+ border-bottom: 25px solid var(--secondary-color);
border-left:solid 12px transparent;
width: 0;
+ margin-left: -1px;
+ border-top-right-radius: 5px;
}
.dashboard .section:hover .tools .md-btn-group::after {
content: "";
- border-bottom: 25px solid rgb(28, 169, 213);
- border-right:solid 12px transparent;
+ border-bottom: 25px solid var(--secondary-color);
+ border-right: solid 12px transparent;
width: 0;
+ margin-left: -1px;
+ border-top-left-radius: 5px;
+}
+
+/* New section*/
+.dashboard .new-section {
+ padding-top: 10px;
+ padding-bottom: 10px;
+ padding-right: 10px;
+ border: #cecece dashed 2px;
+ background-color: white;
+ min-height: 100px;
+ position: relative;
+}
+
+.dashboard .new-section .tools {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+}
+
+.dashboard .new-section .tools .md-btn.add {
+ background-color: var(--secondary-color);
+ min-width: 40px;
+ min-height: 40px;
+ padding: 2px 8px;
+ border-radius: 50%;
}
/* Dropdown*/
@@ -385,7 +455,7 @@ body.dashboard {
}
/* Badge */
-.badge {
+.dashboard .badge {
height: 75px;
position: absolute;
top: 0;
@@ -393,15 +463,31 @@ body.dashboard {
z-index: 1;
}
-.small-badge {
+.dashboard .badge.small-badge {
height: 70px;
}
-.right-badge{
+.dashboard .badge.right-badge {
top: 0;
- left: auto;
+ left: auto;
transform: rotate(90deg);
right: 0;
-
+}
+
+/* Login Icon*/
+
+.loginLink.dark{
+ color: rgba(0,0,0,.54) !important;
+ font-weight: bold;
+}
+
+circle.userBox.dark, svg .icon.userBox.dark, svg .loginLink.userBox.dark{
+ stroke: rgba(0,0,0,.54);
+ fill: none;
+}
+
+text.userBox.dark {
+ stroke: rgba(0,0,0,.54);
+ fill: rgba(0,0,0,.54);
}