#77 Started adding a job-summary component, #82 Removed some unnecess…

…ary imports from app.component.ts
NerdCats · Jun 23, 2016 · 14c34b4 · 14c34b4
1 parent 433ef96
commit 14c34b4
Show file tree

Hide file tree

Showing 7 changed files with 87 additions and 14 deletions.
diff --git a/app/app.component.ts b/app/app.component.ts
@@ -1,20 +1,17 @@
-import { Component, ViewChild } from '@angular/core';
+import { Component } from '@angular/core';
 import { Title } from '@angular/platform-browser';
 import { RouteConfig, ROUTER_DIRECTIVES } from '@angular/router-deprecated';
 
 import { AppSettings } from './shared/app.settings';
-import { WrapHeaderComponent } from './wrapHeader/WrapHeader.component';
 import { NavbarComponent } from './navbar/navbar.component';
-import { ConfirmEmailComponent } from './account/confirm-email/confirm-email.component';
-import { OrderComponent } from './order/order.component';
 import { LoginService } from './account/login/login.service'
 import { Routes } from './shared/router.config';
 import { SecureRouterOutlet } from './shared/secure-router-outlet.directive';
 
 @Component({
   selector: 'webcat',
   templateUrl: 'app/app.component.html',
-  directives: [ROUTER_DIRECTIVES, NavbarComponent, WrapHeaderComponent, SecureRouterOutlet, OrderComponent],
+  directives: [ROUTER_DIRECTIVES, NavbarComponent, SecureRouterOutlet],
   providers: [Title, LoginService]
 
 })

diff --git a/app/dashboard/dashboard.component.html b/app/dashboard/dashboard.component.html
@@ -43,13 +43,15 @@
                 <!-- Main Content -->
                 <!-- uiView:  -->
                 <div>
-                    <div class="row">
-                        <div class="col-lg-8">
-                            <job-history></job-history>
+                    <div>
+                        <div class="row">
+                            <job-summary></job-summary>
                         </div>
                     </div>
+                    <div class="row">
+                        <job-history></job-history>
+                    </div>
                 </div>
-
             </div>
             <!-- End Page Content -->
         </div>

diff --git a/app/dashboard/dashboard.component.ts b/app/dashboard/dashboard.component.ts
@@ -1,11 +1,12 @@
 import { Component, OnInit } from '@angular/core';
 import { Router, ROUTER_DIRECTIVES } from '@angular/router-deprecated';
 import { JobHistoryComponent } from '../job/job-history/job-history.component';
+import { JobSummaryComponent } from '../job/job-summary/job-summary.component';
 
 @Component({
     selector: 'dashboard',
     templateUrl: 'app/dashboard/dashboard.component.html',
-    directives: [ROUTER_DIRECTIVES, JobHistoryComponent]
+    directives: [ROUTER_DIRECTIVES, JobHistoryComponent, JobSummaryComponent]
 })
 export class DashboardComponent implements OnInit {
     isSideBarOpen: boolean = true;

diff --git a/app/job/job-history/job-history.component.ts b/app/job/job-history/job-history.component.ts
@@ -1,10 +1,8 @@
 import {Component, OnInit, Input} from '@angular/core';
 import {Observable} from 'rxjs/Observable';
-import {HTTP_PROVIDERS } from '@angular/http';
 
 import {JobService} from '../shared/job.service';
-import {PageEnvelope, Pagination} from '../../shared/pagination';
-import {Job, JobState} from '../shared/job';
+import {Job} from '../shared/job';
 
 import {ComponentServiceStatus} from '../../shared/component-service-status';
 
@@ -19,7 +17,7 @@ export type ComponentMode = "WIDGET" | "FULL";
     selector: 'job-history',
     templateUrl: 'app/job/job-history/job-history.component.html',
     directives: [ProgressBubbleComponent, WidgetHeaderComponent, WidgetBodyComponent],
-    providers: [JobService, HTTP_PROVIDERS]
+    providers: [JobService]
 })
 export class JobHistoryComponent implements OnInit {
     @Input()

diff --git a/app/job/job-summary/job-summary.component.css b/app/job/job-summary/job-summary.component.css
@@ -0,0 +1,3 @@
+.widget-icon {
+    margin-bottom: 5px;
+}
diff --git a/app/job/job-summary/job-summary.component.html b/app/job/job-summary/job-summary.component.html
@@ -0,0 +1,47 @@
+<div class="widget">
+    <widget-header title="Job Summary" icon="fa-list-alt">
+    </widget-header>
+    <widget-body>
+        <div *ngIf="status=='IN_PROGRESS'">
+            <progress-bubble></progress-bubble>
+        </div>
+        <div class="row">
+            <div class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
+                <div class="widget-content">
+                    <div class="widget-icon green pull-left">
+                        <i class="fa fa-check" aria-hidden="true"></i>
+                    </div>
+                    <div class="title">16</div>
+                    <div class="comment">Completed</div>
+                </div>
+            </div>
+            <div class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
+                <div class="widget-content">
+                    <div class="widget-icon blue pull-left">
+                        <i class="fa fa-play" aria-hidden="true"></i>
+                    </div>
+                    <div class="title">16</div>
+                    <div class="comment">In Progress</div>
+                </div>
+            </div>
+            <div class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
+                <div class="widget-content">
+                    <div class="widget-icon orange pull-left">
+                        <i class="fa fa-ellipsis-h" aria-hidden="true"></i>
+                    </div>
+                    <div class="title">16</div>
+                    <div class="comment">Pending</div>
+                </div>
+            </div>
+            <div class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
+                <div class="widget-content">
+                    <div class="widget-icon red pull-left">
+                        <i class="fa fa-times" aria-hidden="true"></i>
+                    </div>
+                    <div class="title">16</div>
+                    <div class="comment">Cancelled</div>
+                </div>
+            </div>
+        </div>
+    </widget-body>
+</div>
diff --git a/app/job/job-summary/job-summary.component.ts b/app/job/job-summary/job-summary.component.ts
@@ -0,0 +1,25 @@
+import { Component, OnInit } from '@angular/core';
+
+import {ProgressBubbleComponent} from '../../common/progress-bubble/progress-bubble.component';
+import {WidgetHeaderComponent} from '../../common/widget-header/widget-header.component';
+import {WidgetBodyComponent} from '../../common/widget-body/widget-body.component';
+
+import {JobService} from '../shared/job.service';
+import {Job} from '../shared/job';
+
+@Component({
+    selector: 'job-summary',
+    templateUrl: 'app/job/job-summary/job-summary.component.html',
+    directives: [ProgressBubbleComponent, WidgetBodyComponent, WidgetHeaderComponent],
+    styleUrls: ['app/job/job-summary/job-summary.component.css']
+})
+export class JobSummaryComponent implements OnInit {
+    completedJobCount: number;
+    inprogressJobCount: number;
+    pendingJobCount: number;
+    cancelledJobCount: number;
+
+    constructor() { }
+
+    ngOnInit() { }
+}