From a6b5178c7295be4525ee0f607e42f72a12a2e3d6 Mon Sep 17 00:00:00 2001
From: rsanchez <rsanchez@curisit.net>
Date: Wed, 15 Mar 2017 15:45:26 +0000
Subject: [PATCH] #3527 fix - Changes on licenses list and routes

---
 securis/src/main/webapp/src/app/license.list.component.ts   |   51 +++++++++++-----
 securis/src/main/webapp/src/app/resources/licenses.ts       |   32 +++++++---
 securis/src/main/webapp/src/app/license.list.component.html |   54 ++++++++++++-----
 securis/src/main/webapp/src/app/resources/packs.ts          |    6 +
 securis/src/main/webapp/src/app/app.module.ts               |    6 +
 securis/src/main/webapp/src/app/pack.list.component.ts      |    7 +-
 6 files changed, 107 insertions(+), 49 deletions(-)

diff --git a/securis/src/main/webapp/src/app/app.module.ts b/securis/src/main/webapp/src/app/app.module.ts
index 8b4e70e..6a95eba 100644
--- a/securis/src/main/webapp/src/app/app.module.ts
+++ b/securis/src/main/webapp/src/app/app.module.ts
@@ -24,6 +24,8 @@
 import { HeroDetailComponent } from './detail.component';
 import { LoginFormComponent } from './login.form.component';
 import { LicenseListComponent } from './license.list.component';
+import { LicenseFormComponent } from './forms/license.form.component';
+
 
 import { appRoutes, appRoutingProviders } from './app.routes';
 import { requestOptionsProvider, requestBackendProvider } from './common/default.requests.options';
@@ -54,17 +56,19 @@
     LoginFormComponent,
     ErrorCheckerComponent,
     LicenseListComponent,
+    LicenseFormComponent,
     I18nDirective,
     HomeComponent
   ],
   bootstrap: [ HomeComponent ],
-  entryComponents: [ PackFormComponent ],
+  entryComponents: [ PackFormComponent, LicenseFormComponent ],
   providers: [
     SeCurisSession,
     UserService,
     PacksService,
     LicensesService,
     PackFormComponent,
+    LicenseFormComponent,
     ApplicationsService,
     OrganizationsService,
     LicenseTypesService,
diff --git a/securis/src/main/webapp/src/app/license.list.component.html b/securis/src/main/webapp/src/app/license.list.component.html
index 25969b2..ac3b35e 100644
--- a/securis/src/main/webapp/src/app/license.list.component.html
+++ b/securis/src/main/webapp/src/app/license.list.component.html
@@ -1,46 +1,66 @@
 <md-toolbar role="toolbar" class="mat-secondary">
   <span class="push-left-sm">
-      <span class="md-title" i18n>License Packs</span>
+    <button md-icon-button (click)="goBack" color="accent">
+        <md-icon class="md-36">arrow_back</md-icon>
+    </button>
+      <span class="md-title" i18n>Licenses for pack</span>: {{pack?.code}}
   </span>
   <span class="push-left-sm" *ngIf="filteredItems < data.length">
       <span class="md-body-1">{{filteredItems}} of {{data.length}} packs filtered</span>
   </span>
   <td-search-box #searchBox class="push-right-sm" placeholder="Search here" (searchDebounce)="search($event)" flex>
   </td-search-box>
-  <button md-mini-fab color="accent" (click)="createPack()">
+  <button md-mini-fab color="accent" (click)="createLicense()">
       <md-icon>add</md-icon>
     </button>
+  <md-toolbar-row *ngIf="!!pack">
+    <md-chip-list flex="80" style="margin-left: 70px;">
+      <md-chip selected [mdTooltip]="$L.get('field.application_name')" color="primary">{{pack.application_name}} </md-chip>
+      <md-chip selected [mdTooltip]="$L.get('field.organization_id')" color="accent">{{pack.organization_name}} </md-chip>
+      <md-chip selected [mdTooltip]="$L.get('field.license_type_id')" color="accent">{{pack.licensetype_code}} </md-chip>
+      <md-chip selected [mdTooltip]="$L.get('field.num_available')" color="accent">{{pack.num_available}} </md-chip>
+    </md-chip-list>
+  </md-toolbar-row>
 </md-toolbar>
 <md-divider></md-divider>
 <div layout="row" layout-align="center center">
   <div flex="80" layout="column" layout-align="end center" >
-<td-data-table [data]="filteredData" [columns]="columns" style="width: 100%">
-  <template tdDataTableTemplate="used_licenses" let-row="row">
+<td-data-table 
+  [data]="filteredData" 
+  [columns]="columns" 
+  [sortable]="true"
+  [sortBy]="sortBy"
+  (sortChange)="sort($event)"
+  style="width: 100%">
+  <template tdDataTableTemplate="status" let-row="row">
     <div layout="row">
-        <td-notification-count color="secondary" [notifications]="row['num_licenses']">
-        </td-notification-count>
-        <td-notification-count color="primary" [notifications]="row['num_available']">
-        </td-notification-count>
+      <md-chip-list>
+        <md-icon [style]="'color: ' + licenses.getStatusColor(row.status)">brightness_1</md-icon>&nbsp;<span>{{licenses.getStatusName(row.status)}}</span>
+      </md-chip-list>
     </div>
   </template>
-  <template tdDataTableTemplate="code" let-row="row" let-value="value">
-    <div layout="row" layout-align="start center">
-      <span style="white-space: nowrap">{{value}}</span>
+  <template tdDataTableTemplate="email" let-row="row">
+    <div layout="row">
+      <a [href]="'mailto:' + row.email + '?subject=SeCuris'">{{row.email}}</a>
     </div>
   </template>
+  <template tdDataTableTemplate="expiration_date" let-row="row">
+    <div layout="row">
+      <span [class]="isLicenseExpired(row) ? 'warn' : ''" >{{row.expiration_date | date: 'short'}}</span>
+    </div>
+  </template>
+  
   <template tdDataTableTemplate="menu" let-row="row" let-index="index">
     <div layout="row" layout-align="end center">
-      <button md-icon-button (click)="editPack(row)" color="primary"><md-icon>edit</md-icon></button>
-      <button md-icon-button [mdMenuTriggerFor]="packMenu" aria-label="Pack menu">
+      <button md-icon-button (click)="editLicense(row)" color="primary"><md-icon>edit</md-icon></button>
+      <button md-icon-button [mdMenuTriggerFor]="licenseMenu" aria-label="License menu">
         <md-icon>more_vert</md-icon>
       </button>
-       
-      <md-menu #packMenu="mdMenu">
-          <button md-menu-item *ngFor="let action of pack_menu_options" (click)="packAction(action.command, row)" [disabled]="!isActionAvailable(row)">
+      <md-menu #licenseMenu="mdMenu">
+          <button md-menu-item *ngFor="let action of license_menu_options" (click)="licenseAction(action.command, row)" [disabled]="!isActionAvailable(row)">
             <md-icon *ngIf="!!action.icon">{{ action.icon }}</md-icon> {{ action.name }}
           </button>
       </md-menu>
-      <button md-icon-button (click)="showLicenses(row)" color="accent"><md-icon>arrow_forward</md-icon></button>
     </div>
   </template>
 </td-data-table>
diff --git a/securis/src/main/webapp/src/app/license.list.component.ts b/securis/src/main/webapp/src/app/license.list.component.ts
index 9ff77ba..2417192 100644
--- a/securis/src/main/webapp/src/app/license.list.component.ts
+++ b/securis/src/main/webapp/src/app/license.list.component.ts
@@ -1,10 +1,13 @@
-import { Router } from '@angular/router';
+import { LocaleService } from './common/i18n';
+import { ActivatedRoute, Router } from '@angular/router';
 import { MdDialog, MdDialogConfig } from '@angular/material';
 import { TdDataTableService, TdDataTableSortingOrder, ITdDataTableSortChangeEvent, ITdDataTableColumn } from '@covalent/core';
 import { IPageChangeEvent } from '@covalent/core';
 import { Component, AfterViewInit } from '@angular/core';
 import { TdMediaService } from '@covalent/core';
 import { LicensesService } from './resources/licenses';
+import { PacksService } from './resources/packs';
+
 import { LicenseFormComponent } from './forms/license.form.component';
 
 var lic_example = { activation_code: '19fa8d30-29cb-4b59-81b5-3837af8204b6',
@@ -34,12 +37,13 @@
 })
 export class LicenseListComponent implements AfterViewInit {
   data: any[] = [];
+  pack: any = null;
   columns: ITdDataTableColumn[] = [
-    { name: 'code', label: 'Code', tooltip: 'License pack code' },
-    { name: 'application_name', label: 'App name' },
-    { name: 'licensetype_code', label: 'License type' },
-    { name: 'organization_name', label: 'Organization' },
-    { name: 'used_licenses', label: 'Lics', tooltip: 'Initial/Available pack licenses' },
+    { name: 'code', label: 'Code', tooltip: 'License code' },
+    { name: 'full_name', label: 'User name' },
+    { name: 'email', label: 'User email' },
+    { name: 'expiration_date', label: 'Expiration date' },
+    { name: 'status', label: 'Status' },
     { name: 'menu', label: '' }
   ];
 
@@ -50,7 +54,7 @@
   fromRow: number = 1;
   currentPage: number = 1;
   pageSize: number = 10;
-  sortBy: string = 'application_name';
+  sortBy: string = 'expiration_date';
   sortOrder: TdDataTableSortingOrder = TdDataTableSortingOrder.Descending;
   filteredItems = this.data.length;
   license_menu_options : any[] = [{
@@ -73,21 +77,36 @@
 
   constructor(private _dataTableService: TdDataTableService,
     private media: TdMediaService,
+    private $L: LocaleService,
     private router: Router,
+    private route: ActivatedRoute,
     private dialog: MdDialog,
     private licenseForm: LicenseFormComponent,
-    private licenses: LicensesService) {
-      this.licenses.get().subscribe(
-        list => {
-          this.data = list;
-          this.filter();
-        },
-        err => console.error(err)
-      );
+    private licenses: LicensesService,
+    private packs: PacksService) {
   }
 
   ngOnInit(): void {
-    this.filter();
+    this.route.params.subscribe(params => {
+        var packId = +params['id']; // (+) converts string 'id' to a number
+        this.licenses.getByPack(packId).subscribe(
+          list => {
+            this.data = list;
+            this.filter();
+          },
+          err => console.error(err)
+        );
+        this.packs.get(packId).subscribe(
+          packData => {
+            this.pack = packData;
+          },
+          err => console.error(err)
+        );
+      });
+  }
+
+  isLicenseExpired(lic: any): boolean {
+    return lic.expiration_date < (new Date().getTime());
   }
 
   createLicense() : void {
diff --git a/securis/src/main/webapp/src/app/pack.list.component.ts b/securis/src/main/webapp/src/app/pack.list.component.ts
index 7df79ab..5c44a1d 100644
--- a/securis/src/main/webapp/src/app/pack.list.component.ts
+++ b/securis/src/main/webapp/src/app/pack.list.component.ts
@@ -1,4 +1,4 @@
-import { Router } from '@angular/router';
+import { Router, ActivatedRoute } from '@angular/router';
 import { MdDialog, MdDialogConfig } from '@angular/material';
 import { TdDataTableService, TdDataTableSortingOrder, ITdDataTableSortChangeEvent, ITdDataTableColumn } from '@covalent/core';
 import { IPageChangeEvent } from '@covalent/core';
@@ -54,7 +54,7 @@
     { name: 'application_name', label: 'App name' },
     { name: 'licensetype_code', label: 'License type' },
     { name: 'organization_name', label: 'Organization' },
-    { name: 'used_licenses', label: 'Lics', tooltip: 'Initial/Available pack licenses' },
+    { name: 'used_licenses', label: 'Licenses', tooltip: 'Initial/Available pack licenses' },
     { name: 'menu', label: '' }
   ];
 
@@ -87,6 +87,7 @@
   constructor(private _dataTableService: TdDataTableService,
     private media: TdMediaService,
     private router: Router,
+    private route: ActivatedRoute,
     private dialog: MdDialog,
     private $L: LocaleService,
     private packForm: PackFormComponent,
@@ -114,7 +115,7 @@
   }
 
   showLicenses(pack: any) : void {
-    this.router.navigateByUrl('/licenses');
+    this.router.navigate([`${pack.id}/licenses`], {relativeTo: this.route});
   }
 
   editPack(pack: any) : void {
diff --git a/securis/src/main/webapp/src/app/resources/licenses.ts b/securis/src/main/webapp/src/app/resources/licenses.ts
index 74404b8..459f2f5 100644
--- a/securis/src/main/webapp/src/app/resources/licenses.ts
+++ b/securis/src/main/webapp/src/app/resources/licenses.ts
@@ -1,3 +1,4 @@
+import { LocaleService } from '../common/i18n';
 import { Observable } from 'rxjs/Rx';
 import { Injectable } from '@angular/core';
 import { Http, RequestOptions } from '@angular/http';
@@ -21,14 +22,6 @@
 	status: 'AC'
 }
 
-export const PACK_STATUS = {
-	CREATED: 'CR',
-	ACTIVE: 'AC',
-	ONHOLD: 'OH',
-	EXPIRED: 'EX',
-	CANCELLED: 'CA'
-}
-
 export const LIC_STATUS = {
 	CREATED: 'CR',
 	ACTIVE: 'AC',
@@ -38,6 +31,15 @@
 	BLOCKED: 'BL',
 	CANCELLED: 'CA'
 }
+
+export const COLORS_BY_STATUS = {
+		'CR': '#808080',
+		'AC': '#329e5a',
+		'RE': '#2981d4',
+		'EX': '#ea7824',
+		'BL': '#ff0000',
+		'CA': '#a21717'
+};
 
 /**
  * These transitions could be get from server, class License.Status, but
@@ -55,11 +57,10 @@
 	'delete': [LIC_STATUS.CREATED, LIC_STATUS.CANCELLED, LIC_STATUS.BLOCKED]
 }
 
-
-
 @Injectable()
 export class LicensesService extends SeCurisResourceServices {
-	constructor(http: Http) {
+	constructor(http: Http,
+				private $L: LocaleService) {
 		super(http, 'license');
 	}
 
@@ -84,5 +85,14 @@
 		var validStatuses = LIC_ACTIONS_BY_STATUS[action];
 		return lic && validStatuses && validStatuses.indexOf(lic.status) !== -1;
 	}
+
+
+	getStatusName(statusCode: string): string {
+		return this.$L.get(`pack.status.${statusCode}`, this.$L.get('Unknown'));
+	}  
+
+	getStatusColor(statusCode: string): string {
+		return COLORS_BY_STATUS[statusCode] || '#cccccc';
+	}  
 }
 
diff --git a/securis/src/main/webapp/src/app/resources/packs.ts b/securis/src/main/webapp/src/app/resources/packs.ts
index d022dff..6da7c06 100644
--- a/securis/src/main/webapp/src/app/resources/packs.ts
+++ b/securis/src/main/webapp/src/app/resources/packs.ts
@@ -82,7 +82,11 @@
 	}
 
   getStatusName(statusCode: string): string {
-	return this.$L.get(`pack.status.${statusCode}`, this.$L.get('Unknown'));
+  	return this.$L.get(`pack.status.${statusCode}`, this.$L.get('Unknown'));
+  }  
+
+  getStatusColor(statusCode: string): string {
+  	return COLORS_BY_STATUS[statusCode] || '#cccccc';
   }  
 
 }

--
Gitblit v1.3.2