Added adminLTE makeover and making it finally look like a widget

NerdCats · Apr 11, 2017 · 26d4f4d · 26d4f4d
1 parent a3e7adb
commit 26d4f4d
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 2 deletions.
diff --git a/src/app/ui-toolbox/bar-chart/bar-chart.component.ts b/src/app/ui-toolbox/bar-chart/bar-chart.component.ts
@@ -16,6 +16,7 @@ import { LoggerService } from '../../shared/index';
 export class BarChartComponent implements Widget {
     options: any;
     data: any;
+    title: any;
 
     isDataAvailable: boolean = false;
 
@@ -31,7 +32,9 @@ export class BarChartComponent implements Widget {
 
     setWidgetConfig(widgetConfig: WidgetConfig) {
         if (widgetConfig) {
-            if (!this.options && widgetConfig.config) {
+            if (widgetConfig.config) {
+                this.title = widgetConfig.config.title.text;
+                delete widgetConfig.config.title;
                 this.options = widgetConfig.config;
             }
 

diff --git a/src/app/ui-toolbox/bar-chart/bar-chart.html b/src/app/ui-toolbox/bar-chart/bar-chart.html
@@ -1 +1,15 @@
-<p-chart #chart *ngIf="isDataAvailable" type="bar" [data]="data" [options]="options"></p-chart>
+<div class="col-md 8" *ngIf="isDataAvailable">
+    <div class="box box-success">
+        <div class="box-header with-border">
+            <h3 class="box-title pull-left">{{title}}</h3>
+            <div class="box-tools pull-right">
+                <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>
+                </button>
+                <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
+            </div>
+        </div>
+        <div class="box-body no-padding">
+            <p-chart #chart type="bar" [data]="data" [options]="options"></p-chart>
+        </div>
+    </div>
+</div>