menu changes

ng6-seed/src/app/AwsService/cognito.service.ts

@@ -11,7 +11,8 @@ import {
   CognitoUserSession
 } from "amazon-cognito-identity-js";
 import { environment } from '../../environments/environment';
-import { BehaviorSubject } from 'rxjs';
+
+import { BehaviorSubject,Observable,of } from 'rxjs';
 const sineedge_poolData = { 
   UserPoolId: "ap-south-1_y7dt3iEaX", //ap-south-1_qQ85yQZJO UserName :SPARQ_SINEEDGE_DEV
   ClientId: "291qt4smn5pql6o8cc2hi201lj" // ClientName: SINEEDGE_DEV_WEB
@@ -122,7 +123,32 @@ isloggin:boolean = false;
 //         callback.callbackWithParam(null);
 //     }
 // }
+refresh() {
+  let tokenexp:boolean;
+  this.getCurrentUser().getSession(function (err, session) {
+      if (err) {
+          console.log("CognitoUtil: Can't set the credentials:" + err);
+      }
+
+      else {
+          if (session.isValid()) {
+            tokenexp = session.isValid();
+            of(tokenexp)
+              console.log("CognitoUtil: refreshed successfully");
+              
+          } else {
+            tokenexp = session.isValid();
+              console.log("CognitoUtil: refreshed but session is still not valid");
+              
+          }
+      }
+      
+         return tokenexp;
+      
+  });
+}
 getAccessToken(){
+  this.refresh();
   let jwttoken = '';
   if (this.getCurrentUser() != null) {
     //console.log(JSON.stringify(this.getCurrentUser()));

ng6-seed/src/app/_guard/auth.guard.ts

@@ -27,8 +27,10 @@ export class AuthGuard implements CanActivate, CanActivateChild {
                 return true;
         } else {
             // alert("else");
-            this.router.navigate(['/login']);
+            setTimeout(() => {
+            this.router.navigate(['authentication/login']);
             return false;
+            },1000);
             
         }
     }

ng6-seed/src/app/layouts/admin/admin-layout.component.html

@@ -6,25 +6,25 @@
            <div class="branding text-center">
               <!-- <h2><i class="fa fa-superpowers" aria-hidden="true"></i> <span> OPTIMA</span>
               </h2> --> 
-              <h2><i class="fa fa-superpowers" aria-hidden="true"></i> <span> {{userDep}} </span>
+              <h2><img [src]="'https://download.zoho.com/webdownload?x-service=CLIQ&event-id=0e17e076835b478c3ae33ddb3d3408e239e7c1f79dd4c2a1b626222e2cc1f221a8d3a027733fc52e82bc85cc5b0111d594abef51a345b4a64531af51c8e8c5bd'" style="height: 50px;;"> <span> {{userDep}} </span>
               </h2>
            </div>
            <div class="main-nav">
               <div class="user-pro-wrap">
                  <div class="user-profile-thumb text-center">
                     <div class="user-i">
-                       <img src="assets/images/userpic.jpg" class="rad-full mb-1" width="100" height="100" alt="">
+                       <img [src]="profileurl ||'https://upload.wikimedia.org/wikipedia/commons/thumb/a/ac/No_image_available.svg/1024px-No_image_available.svg.png'" class="rad-full mb-1" width="100" height="100" alt="">
                        <div> <span>{{fullName}}</span></div>
                     </div>
                  </div>
                  <div class="most-used text-center">
-                    <a class="most-link" color="primary">
+                    <a class="most-link" color="primary" (click)="menunav('HOME')">
                        <mat-icon>home</mat-icon>
                     </a>
-                    <a class="most-link" color="primary">
+                    <a class="most-link" color="primary" (click)="menunav('USERS')">
                        <mat-icon>person</mat-icon>
                     </a>
-                    <a class="most-link" color="primary">
+                    <a class="most-link" color="primary" (click)="menunav('SETTINGS')">
                        <mat-icon>settings</mat-icon>
                     </a>
                  </div>
@@ -61,6 +61,23 @@
                           <a [routerLink]="['/', menuitem.state, childitem.state ]" class="relative" mat-ripple>{{ childitem.name | translate }}</a>
                        </mat-list-item>
                     </mat-nav-list>
+                    <!-- Multi-->
+                    <a appAccordionToggle class="relative" mat-ripple href="javascript:;" *ngIf="menuitem.type === 'multi'">
+                        <mat-icon>{{ menuitem.icon }}</mat-icon>
+                        <span>{{ menuitem.name | translate }}</span>
+                        <span fxFlex></span>
+                        <span class="menu-badge mat-{{ badge.type }}" *ngFor="let badge of menuitem.badge">{{ badge.value }}</span>
+                        <mat-icon class="menu-caret">arrow_drop_down</mat-icon>
+                     </a>
+                     <div *ngFor="let multichild of menuitem.multichild" >
+                        <mat-nav-list class="sub-menu" *ngIf="multichild.type === 'sub'">
+                            <mat-list-item *ngFor="let childitem of multichild.children" routerLinkActive="open">
+                               <a [routerLink]="['/', multichild.state, childitem.state ]" class="relative" mat-ripple>{{ childitem.name | translate }}</a>
+                            </mat-list-item>
+                         </mat-nav-list>
+                    </div>
+                     
+                  <!--End-->
                  </mat-list-item>
                  <mat-divider></mat-divider>
   <!--                <mat-list-item>
@@ -124,11 +141,11 @@
                  Lorem ipsum dolor sit amet consectetur.
                  </button>
               </mat-menu>
-              <button [mat-menu-trigger-for]="user1" mat-icon-button class="ml-xs overflow-visible">
+              <!-- <button [mat-menu-trigger-for]="user1" mat-icon-button class="ml-xs overflow-visible">
                  <mat-icon>reorder</mat-icon>
                  <span class="notification-label">3</span>
-              </button>
-              <mat-menu #user1="matMenu" class="opt-menu" x-position="before">
+              </button> -->
+              <!-- <mat-menu #user1="matMenu" class="opt-menu" x-position="before">
                  <div mat-menu-item class="head-menu grad-blue">
                     User Menu
                  </div>
@@ -144,7 +161,7 @@
                     <mat-icon>web</mat-icon>
                     Calendar Settings
                  </button>
-              </mat-menu>
+              </mat-menu> -->
               <button (click)="end.toggle()" mat-icon-button class="ml-xs overflow-visible">
                  <mat-icon>notifications</mat-icon>
                  <span class="notification-label">2</span>
@@ -214,7 +231,7 @@
            Lorem ipsum dolor sit amet consectetur.
            </button>
         </mat-menu>
-        <button [mat-menu-trigger-for]="user1" mat-icon-button class="ml-xs overflow-visible">
+        <!-- <button [mat-menu-trigger-for]="user1" mat-icon-button class="ml-xs overflow-visible">
            <mat-icon>reorder</mat-icon>
            <span class="notification-label">3</span>
         </button>
@@ -234,7 +251,7 @@
               <mat-icon>web</mat-icon>
               Calendar Settings
            </button>
-        </mat-menu>
+        </mat-menu> -->
         <button (click)="end.toggle()" mat-icon-button class="ml-xs overflow-visible">
            <mat-icon>notifications</mat-icon>
            <span class="notification-label">2</span>
@@ -287,6 +304,7 @@
                        </ul>
                     </li>
                  </ul>
+                 
               </li>
            </ul>
         </nav>

ng6-seed/src/app/layouts/admin/admin-layout.component.ts

@@ -19,6 +19,7 @@ import { AwsService } from '../../AwsService/aws.service';
 })
 export class AdminLayoutComponent implements OnInit, OnDestroy {
 
+  profileurl: any;;
   userDep: string;
   fullName: any;
   currentUser: any;
@@ -49,17 +50,31 @@ export class AdminLayoutComponent implements OnInit, OnDestroy {
     this.users.getroles().subscribe(res=>{
       this.currentUser = res;
       if(this.currentUser.dataStatus == true){
+       
       this.currentUser = this.currentUser.records[0];
       this.fullName = this.currentUser.user_first_name +' '+this.currentUser.user_last_name;
       //console.log(this.currentUser);
       if(this.currentUser.fk_entity_id == 1 ){
-          this.userDep = "SINEEGDE";
+          this.userDep = "SineEdge";
       }else if(this.currentUser.fk_entity_id ==2){
-        this.userDep = "LENDOR";
+        this.userDep = "Lender";
 
       }else{
-        this.userDep = "VENDOR";
+        this.userDep = "Vendor";
       }
+      let users= {
+        'userid':this.currentUser.userid,
+        'entityid':this.currentUser.fk_entity_id,
+        'profilepic':this.currentUser.profilepic
+      }
+      this.users.getprofilepic(users).subscribe(res=>{
+        this.profileurl = res;
+        if(this.profileurl.dataStatus == true){
+          
+          this.profileurl = this.profileurl.records;
+          
+        }
+    })
       
     }
     });
@@ -75,6 +90,7 @@ export class AdminLayoutComponent implements OnInit, OnDestroy {
                             });
     }
     
+
     this._router = this.router.events.pipe(filter(event => event instanceof NavigationEnd)).subscribe((event: NavigationEnd) => {
       this.url = event.url;
       if (this.isOver()) {
@@ -232,4 +248,16 @@ export class AdminLayoutComponent implements OnInit, OnDestroy {
       this.router.navigate(['/authentication/login']);
     }) 
   }
+  menunav(active){
+    switch(active){
+        case 'HOME':
+        this.router.navigate(['/home']); 
+        break;
+        case 'USERS':
+        this.router.navigate(['/setting/users/userprofile']);
+        break;
+        case 'SETTING':
+        break;
+    }
+  }
 }

ng6-seed/src/app/settings/users/user-list/user-list.component.html

@@ -1,61 +1,21 @@
-<!-- <div *ngIf="loader">
-    <mat-progress-bar mode="indeterminate" color="accent" class="mb-1"></mat-progress-bar>
- </div>
- <div style="text-align:  right;">
- <button mat-raised-button color="primary" (click)="add()">Add Register</button>
- </div>
 
- <mat-card>
-<div datatable>
-        
-               
-            
-  <table style="border-collapse: collapse">
-         <thead>
-            <th style="text-align:  center;">No</th>
-            <th style="text-align:  center;">FirstName</th>
-            <th style="text-align:  center;">Email</th>
-            <th style="text-align:  center;">Mobile No</th>
-            <th style="text-align:  center;">Action</th>
-            <th style="text-align:  center;">Isactive</th>
-          </thead>
-          <tbody>
-      <tr *ngFor="let us of userdata; let i=index;" >
-          <td style="text-align:  center;">{{i+1}}</td>
-          
-          <td style="text-align:  center;">{{us.user_first_name}} {{us.user_last_name}}</td>
-          <td style="text-align:  center;">{{us.email}}</td>
-          <td style="text-align:  center;">{{us.mobile_no}}</td>
-          <td style="text-align:  center;font-size: 20px"><a (click)="editUserDetails(us.userid,us.aws_name)"><mat-icon>edit</mat-icon></a></td>
-         
-          <td *ngIf="us.isactive ==1" style="text-align:  center;"><a class="active" (click)="isactive(us.userid,us.aws_name)"><mat-icon>done</mat-icon></a></td>
-          
-          <td *ngIf="us.isactive ==0" style="text-align:  center;"><a class="deactive" (click)="isactive(us.userid,us.aws_name)"><mat-icon>close</mat-icon></a></td>
-      </tr>
-    </tbody>
-    
-    </table>
-
-</div>
- </mat-card> -->
 
  <mat-card-content>
-  <div style="text-align: right;">
-    <button mat-raised-button color="primary" (click)="add()"> + Add Register</button>
- </div>
- <br>           
+ <div class="example-container mat-elevation-z8" style="margin-top:26px;">
   <div *ngIf="loader">
     <mat-progress-bar mode="indeterminate" color="accent" class="mb-1"></mat-progress-bar>
  </div>
-
- <div class="example-header">
-   <mat-form-field>
-     <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filter">
-   </mat-form-field>
- </div>
- 
- <div class="example-container mat-elevation-z8">
- 
+    <div class="example-header">
+        <div style="font-size: 26px;">Users</div><hr/>
+        <div fxLayout="row" fxLayoutAlign="start center" class="mb-2" >
+            <mat-form-field dividerColor="primary" class="ml-xs mr-xs" style="width: 30%;">
+          <input matInput (keyup)="applyFilter($event.target.value)"  placeholder="Filter">
+        </mat-form-field>
+          <label style="text-align: right;margin-left:50%;" fxLayoutAlign="start center" fxFlexOffset="50px">
+              <button mat-fab class="mr-1 mb-1" style="margin-top: 7px;"color="primary" (click)="add()"><mat-icon>add</mat-icon></button>
+        </label>
+      </div>
+    </div>
    <mat-table [dataSource]="dataSource" matSort >
  
       <ng-container matColumnDef="SerialNo">
@@ -101,6 +61,6 @@
 
    <!-- <div *ngIf="dataSource.length === 0">No records found</div> -->
  
-   <mat-paginator [pageSizeOptions]="[5, 10, 25, 50, 100]"></mat-paginator>
+   <mat-paginator [pageSizeOptions]="[5, 10, 25, 50, 100]" showFirstLastButtons></mat-paginator>
  </div>
 </mat-card-content>

ng6-seed/src/app/settings/users/user-list/user-list.component.scss

@@ -33,6 +33,7 @@ table {
 .example-header {  
   min-height: 64px;
   padding: 8px 24px 0;
+  background: #fff;
 }
 
 .mat-form-field {
@@ -44,3 +45,47 @@ table {
   overflow: auto;
   max-height: 500px;
 }
+.mat-table {
+  display: table;
+  width: 100%;
+  overflow: auto;
+  max-height: 500px;
+
+  > .mat-header-row, > .mat-row {
+      display: table-row;
+      padding: 0;
+      border: none;
+  
+     > .mat-header-cell, > .mat-cell {
+          display: table-cell;
+          height: 48px;
+          vertical-align: middle;
+
+        border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+      }
+  }
+}
+
+/** Table CSS -nocontent */
+.nocontent {
+ color: red; 
+ font-size: 16px; 
+ text-align:  center;
+}
+
+/** Table CSS - Search(or)Filter Field */
+.mat-form-field {
+ font-size: 14px;
+ width: 100%;
+}
+
+.filter-container {
+ display: flex;
+ flex-direction: column;
+ min-width: 300px;
+}
+
+.filter-header {  
+ min-height: 64px;
+ padding: 8px 24px 0;
+}

ng6-seed/src/app/shared/menu-items/menu-items.ts

@@ -1,4 +1,5 @@
 import { Injectable } from '@angular/core';
+import { state } from '@angular/animations';
 
 export interface BadgeItem {
   type: string;
@@ -11,8 +12,8 @@ export interface ChildrenItems {
   type?: string;
 }
 
-export interface Menu {
-  state: string;
+export interface Multichild {
+  state: any;
   name: string;
   type: string;
   icon: string;
@@ -20,62 +21,65 @@ export interface Menu {
   children?: ChildrenItems[];
 }
 
+export interface Menu {
+  state: any;
+  name: string;
+  type: string;
+  icon: string;
+  badge?: BadgeItem[];
+  children?: ChildrenItems[];
+  multichild?:Multichild[];
+}
+
 const MENUITEMS : Menu[] = [
+  // {
+  //   state: 'home',
+  //   name: 'HOME',
+  //   type: 'link',
+  //   icon: 'explore'
+  // },
   {
-    state: 'home',
-    name: 'HOME',
-    type: 'link',
-    icon: 'explore'
-  },{
-    state:'setting',
+    state: '',
+    name: 'Manage',
+    type: 'multi',
+    icon: 'settings',
+    multichild: [
+      {
+        state:'setting',
     name:'Settings',
     type:'sub',
     icon:'settings',
     children:[
-      {state:'users',name:'User List'},
+      {state:'users',name:'Users'},
       {state:'mastermodule',name:'Master Details'},
-      {state:'entity',name:'Entity Details'}
-    ]
-  },
-  {
-    state:'pdtrigger',
-    name:'PD Trigger',
-    type:'link',
-    icon:'bubble_chart',
-    // children:[
-    //   {state:'pdtriggerlist',name:'Pd Trigger Listing'}
-    // ]
-  },{
-    state: 'template',
+      {state:'entity',name:'Entities'},
+      
+      
+    ],
+      },
+     {
+      state: 'template',
     name: 'Template',
     type: 'sub',
     icon: 'art_track',
     children: [
       {state: 'questions', name: 'Questions'}
     ]
-  },
-  {
-    state: 'authentication',
-    name: 'AUTHENTICATION',
-    type: 'sub',
-    icon: 'security',
-    children: [
-      {state: 'login', name: 'LOGIN'},
-      {state: 'register', name: 'REGISTER'},
-      {state: 'forgot-password', name: 'FORGOT'},
-      {state: 'lockscreen', name: 'LOCKSCREEN'}
+     }
     ]
+    
   },
+  
   {
-    state: 'error',
-    name: 'ERROR',
-    type: 'sub',
-    icon: 'error_outline',
-    children: [
-      {state: '404', name: '404'},
-      {state: '503', name: '503'}
-    ]
+    state:'pdtrigger',
+    name:'Personal Discussion',
+    type:'link',
+    icon:'forum',
+    // children:[
+    //   {state:'pdtriggerlist',name:'Pd Trigger Listing'}
+    // ]
   }
+  
 ];
 
 @Injectable()