adding sdk changes

adding sdk changes Issue-ID: PORTAL-830 Signed-off-by: Muni Mohan Kunchi <munmohan@att.com> Change-Id: I0c99d3ab15fcf4c3b34d84658b64114dadbe2577
author: Muni Mohan Kunchi <munmohan@att.com> 2020-02-06 13:51:45 -0500
committer: Muni Mohan Kunchi <munmohan@att.com> 2020-02-06 13:54:22 -0500
commit: e3636b96e9938cb89bb90672cf70fff3ae790186 (patch)
tree: 89dd47a4a95150f70e83556a3280cf4cd02daf89 /ecomp-sdk/epsdk-app-os/ngappsrc/src/app
parent: 35d028274a61ce8e77a9fa409877d93d0fce05a8 (diff)
31 files changed, 2620 insertions, 0 deletions
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app-routing.module.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app-routing.module.ts
new file mode 100644
index 00000000..4de2ea84
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app-routing.module.ts
@@ -0,0 +1,53 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+const routes: Routes = [
+    { path: 'v2', loadChildren: () => import('./layout/layout.module').then(m => m.LayoutModule) },
+    { path: 'error', loadChildren: () => import('./server-error/server-error.module').then(m => m.ServerErrorModule) },
+    { path: 'access-denied', loadChildren: () => import('./access-denied/access-denied.module').then(m => m.AccessDeniedModule) },
+    { path: 'not-found', loadChildren: () => import('./not-found/not-found.module').then(m => m.NotFoundModule) },
+    { path: '**', redirectTo: 'not-found' }
+];
+
+@NgModule({
+    imports: [RouterModule.forRoot(routes)],
+    exports: [RouterModule]
+})
+export class AppRoutingModule {}
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.component.html b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.component.html
new file mode 100644
index 00000000..0680b43f
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.component.html
@@ -0,0 +1 @@
+<router-outlet></router-outlet>
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.component.scss b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.component.scss
new file mode 100644
index 00000000..8cacac55
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.component.scss
@@ -0,0 +1,37 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+\ No newline at end of file
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.component.spec.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.component.spec.ts
new file mode 100644
index 00000000..42dab6ea
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.component.spec.ts
@@ -0,0 +1,68 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { APP_BASE_HREF } from '@angular/common';
+
+import { AppComponent } from './app.component';
+import { AppModule } from './app.module';
+
+describe('AppComponent', () => {
+  let component: AppComponent;
+  let fixture: ComponentFixture<AppComponent>;
+
+  beforeEach(
+    async(() => {
+      TestBed.configureTestingModule({
+        imports: [AppModule],
+        providers: [
+          { provide: APP_BASE_HREF, useValue: '/' },
+        ]
+      }).compileComponents();
+    })
+  );
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AppComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.component.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.component.ts
new file mode 100644
index 00000000..472404a9
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.component.ts
@@ -0,0 +1,51 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+    selector: 'app-root',
+    templateUrl: './app.component.html',
+    styleUrls: ['./app.component.scss']
+})
+export class AppComponent implements OnInit {
+    constructor() {
+    }
+
+    ngOnInit() {
+    }
+}
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.module.spec.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.module.spec.ts
new file mode 100644
index 00000000..376189d6
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.module.spec.ts
@@ -0,0 +1,13 @@
+import { AppModule } from './app.module';
+
+describe('AppModule', () => {
+    let appModule: AppModule;
+
+    beforeEach(() => {
+        appModule = new AppModule();
+    });
+
+    it('should create an instance', () => {
+        expect(appModule).toBeTruthy();
+    });
+});
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.module.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.module.ts
new file mode 100644
index 00000000..a86ea759
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/app.module.ts
@@ -0,0 +1,66 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+import { CommonModule } from '@angular/common';
+import { HttpClientModule } from '@angular/common/http';
+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import {FormsModule, ReactiveFormsModule} from '@angular/forms';
+import {MatNativeDateModule} from '@angular/material/core';
+
+import { SidebarService } from './shared/services/index';
+import { AppRoutingModule } from './app-routing.module';
+import { AppComponent } from './app.component';
+import { UserService } from './shared/services/user/user.service';
+
+@NgModule({
+    imports: [
+        CommonModule,
+        BrowserModule,
+        BrowserAnimationsModule,
+        HttpClientModule,
+        AppRoutingModule,
+        FormsModule,
+        MatNativeDateModule,
+        ReactiveFormsModule,
+    ],
+    declarations: [AppComponent],
+    providers: [SidebarService,UserService],
+    bootstrap: [AppComponent]
+})
+export class AppModule {}
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/layout/layout-routing.module.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/layout/layout-routing.module.ts
new file mode 100644
index 00000000..5d39bb94
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/layout/layout-routing.module.ts
@@ -0,0 +1,57 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK 
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { LayoutComponent } from './layout.component';
+
+const routes: Routes = [
+    {
+        path: '',
+        component: LayoutComponent,
+        children: [
+            { path: '', loadChildren: () => import('../pages/pages.module').then(m => m.PagesModule) },
+            
+        ]
+    }
+];
+
+@NgModule({
+    imports: [RouterModule.forChild(routes)],
+    exports: [RouterModule]
+})
+export class LayoutRoutingModule {}
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/material-module.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/material-module.ts
new file mode 100644
index 00000000..aa960f39
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/material-module.ts
@@ -0,0 +1,98 @@
+import {NgModule} from '@angular/core'; 
+import {A11yModule} from '@angular/cdk/a11y'; 
+import {DragDropModule} from '@angular/cdk/drag-drop'; 
+import {PortalModule} from '@angular/cdk/portal'; 
+import {ScrollingModule} from '@angular/cdk/scrolling'; 
+import {CdkStepperModule} from '@angular/cdk/stepper'; 
+import {CdkTableModule} from '@angular/cdk/table'; 
+import {CdkTreeModule} from '@angular/cdk/tree'; 
+import {MatAutocompleteModule} from '@angular/material/autocomplete'; 
+import {MatBadgeModule} from '@angular/material/badge'; 
+import {MatBottomSheetModule} from '@angular/material/bottom-sheet'; 
+import {MatButtonModule} from '@angular/material/button'; 
+import {MatButtonToggleModule} from '@angular/material/button-toggle'; 
+import {MatCardModule} from '@angular/material/card'; 
+import {MatCheckboxModule} from '@angular/material/checkbox'; 
+import {MatChipsModule} from '@angular/material/chips'; 
+import {MatStepperModule} from '@angular/material/stepper'; 
+import {MatDatepickerModule} from '@angular/material/datepicker'; 
+import {MatDialogModule} from '@angular/material/dialog'; 
+import {MatDividerModule} from '@angular/material/divider'; 
+import {MatExpansionModule} from '@angular/material/expansion'; 
+import {MatFormFieldModule} from '@angular/material'; 
+import {MatGridListModule} from '@angular/material/grid-list'; 
+import {MatIconModule} from '@angular/material/icon'; 
+import {MatInputModule} from '@angular/material/input'; 
+import {MatListModule} from '@angular/material/list'; 
+import {MatMenuModule} from '@angular/material/menu'; 
+import {MatNativeDateModule, MatRippleModule} from '@angular/material/core'; 
+import {MatPaginatorModule} from '@angular/material/paginator'; 
+import {MatProgressBarModule} from '@angular/material/progress-bar'; 
+import {MatProgressSpinnerModule} from '@angular/material/progress-spinner'; 
+import {MatRadioModule} from '@angular/material/radio'; 
+import {MatSelectModule} from '@angular/material/select'; 
+import {MatSidenavModule} from '@angular/material/sidenav'; 
+import {MatSliderModule} from '@angular/material/slider'; 
+import {MatSlideToggleModule} from '@angular/material/slide-toggle'; 
+import {MatSnackBarModule} from '@angular/material/snack-bar'; 
+import {MatSortModule} from '@angular/material/sort'; 
+import {MatTableModule} from '@angular/material/table'; 
+import {MatTabsModule} from '@angular/material/tabs'; 
+import {MatToolbarModule} from '@angular/material/toolbar'; 
+import {MatTooltipModule} from '@angular/material/tooltip'; 
+import {MatTreeModule} from '@angular/material/tree'; 
+ 
+ 
+@NgModule({ 
+  exports: [ 
+    A11yModule, 
+    CdkStepperModule, 
+    CdkTableModule, 
+    CdkTreeModule, 
+    DragDropModule, 
+    MatAutocompleteModule, 
+    MatBadgeModule, 
+    MatBottomSheetModule, 
+    MatButtonModule, 
+    MatButtonToggleModule, 
+    MatCardModule, 
+    MatCheckboxModule, 
+    MatChipsModule, 
+    MatStepperModule, 
+    MatDatepickerModule, 
+    MatDialogModule, 
+    MatDividerModule, 
+    MatExpansionModule, 
+    MatFormFieldModule, 
+    MatGridListModule, 
+    MatIconModule, 
+    MatInputModule, 
+    MatListModule, 
+    MatMenuModule, 
+    MatNativeDateModule, 
+    MatPaginatorModule, 
+    MatProgressBarModule, 
+    MatProgressSpinnerModule, 
+    MatRadioModule, 
+    MatRippleModule, 
+    MatSelectModule, 
+    MatSidenavModule, 
+    MatSliderModule, 
+    MatSlideToggleModule, 
+    MatSnackBarModule, 
+    MatSortModule, 
+    MatTableModule, 
+    MatTabsModule, 
+    MatToolbarModule, 
+    MatTooltipModule, 
+    MatTreeModule, 
+    PortalModule, 
+    ScrollingModule, 
+  ] 
+})
+export class MaterialModule {}
+
+
+/**  Copyright 2019 Google Inc. All Rights Reserved.
+    Use of this source code is governed by an MIT-style license that
+    can be found in the LICENSE file at http://angular.io/license */
+\ No newline at end of file
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/ext/profile/.gitignore b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/ext/profile/.gitignore
new file mode 100644
index 00000000..741b049d
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/ext/profile/.gitignore
@@ -0,0 +1,2 @@
+search
+self
+\ No newline at end of file
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/ext/profile/profile.module.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/ext/profile/profile.module.ts
new file mode 100644
index 00000000..9cffa3b3
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/ext/profile/profile.module.ts
@@ -0,0 +1,10 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+@NgModule({
+  declarations: [],
+  imports: [
+    CommonModule
+  ]
+})
+export class ProfileModule { }
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/ext/profile/profile.service.spec.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/ext/profile/profile.service.spec.ts
new file mode 100644
index 00000000..95b69880
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/ext/profile/profile.service.spec.ts
@@ -0,0 +1,12 @@
+import { TestBed } from '@angular/core/testing';
+
+import { ProfileService } from './profile.service';
+
+describe('ProfileService', () => {
+  beforeEach(() => TestBed.configureTestingModule({}));
+
+  it('should be created', () => {
+    const service: ProfileService = TestBed.get(ProfileService);
+    expect(service).toBeTruthy();
+  });
+});
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/ext/profile/profile.service.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/ext/profile/profile.service.ts
new file mode 100644
index 00000000..111cf3f4
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/ext/profile/profile.service.ts
@@ -0,0 +1,62 @@
+import { Injectable } from '@angular/core';
+import { HttpClient, HttpHeaders } from '@angular/common/http';
+import { environment } from 'src/environments/environment';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class ProfileService {
+
+  constructor(private http:HttpClient) { }
+
+  getUserPagination(){
+    return this.http.get(environment.getUserPagination,{ withCredentials: true });         
+  }
+
+
+  getPostSearch(postSearchBean:any)
+  {
+    return this.http.post(environment.postSearch,JSON.stringify({postSearchBean: postSearchBean}),{ withCredentials: true });
+
+  }
+
+  importUser(postSearchBean:any)
+  {
+    return this.http.post(environment.importSearch,JSON.stringify({postSearchBean: postSearchBean}),{ withCredentials: true });
+
+  }
+
+  getPostProfile()
+  {
+    return this.http.get(environment.getPostProfile,{ withCredentials: true });         
+
+  }
+
+  getSelfProfile()
+  {
+    return this.http.get(environment.getSelfProfile,{ withCredentials: true });         
+
+  }
+
+  removeRole(data,profileId)
+  {
+    return this.http.post(environment.removeUserRole+'?profile_id='+profileId,JSON.stringify({role: data}),{ withCredentials: true });
+  }
+
+  addUserRole(data,profileId)
+  {
+    return this.http.post(environment.addUserRole+'?profile_id='+profileId,JSON.stringify({role: data}),{ withCredentials: true });
+  }
+  
+  saveProfile(data,profileId)
+  {
+    return this.http.post(environment.saveProfile+'?profile_id='+profileId,JSON.stringify({profile: data.profile,selectedCountry:data.selectedCountry, selectedState:data.selectedState, selectedTimeZone:data.selectedTimeZone}),{ withCredentials: true });
+
+  }
+
+  toggleProfileActive(profileId){
+   return this.http.get(environment.toggleProfileActive+profileId,{ withCredentials: true });  
+  }
+  
+
+}
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/pages-routing.module.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/pages-routing.module.ts
new file mode 100644
index 00000000..eff5a3d0
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/pages-routing.module.ts
@@ -0,0 +1,39 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule, ActivatedRoute } from '@angular/router';
+import { RoleFunctionsComponent } from './admin/role-functions/role-functions.component';
+import { UsageComponent } from './admin/usage/usage.component';
+import { CacheAdminComponent } from './admin/cache-admin/cache-admin.component';
+import { RolesComponent } from './admin/roles/roles.component';
+import { MenusComponent } from './admin/menus/menus.component';
+import { SearchComponent } from './ext/profile/search/search.component';
+import { SelfComponent } from './ext/profile/self/self.component';
+import { ReportComponent } from './analytics/Report_List/Report/report.component';
+import { RunReportComponent } from './analytics/Report_List/Report/run/run-report/run-report.component';
+import { HeaderTabsWrapperComponent } from './analytics/Report_List/header-tabs-wrapper-component/header-tabs-wrapper.component';
+import { RunReportFormFieldsComponent } from './analytics/Report_List/Report/run/run-report-form-fields/run-report-form-fields.component';
+import { WelcomeDashboardComponent } from './welcome-dashboard/welcome-dashboard.component';
+
+
+
+
+const routes: Routes = [
+  { path: 'admin/role_function_list', component: RoleFunctionsComponent },
+  { path: 'admin/usage_list', component : UsageComponent},
+  { path: 'admin/cache_admin', component :CacheAdminComponent},
+  { path: 'admin/admin', component :RolesComponent},
+  { path: 'admin/admin_menu_edit', component :MenusComponent},
+  { path: 'userProfile', component :SearchComponent},
+  { path: 'userProfile/self_profile', component:SelfComponent},
+  { path: 'report-list', component:ReportComponent},
+  { path: 'create', component: HeaderTabsWrapperComponent},
+  { path: 'reports/:reportMode/:reportId', component: HeaderTabsWrapperComponent},
+  { path: 'run/:reportId', component: RunReportComponent},
+  { path: 'run/:reportId/:queryParameters', component: RunReportFormFieldsComponent},
+  { path: 'welcome/welcome', component :WelcomeDashboardComponent}
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
+})
+export class PagesRoutingModule { }
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/pages.module.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/pages.module.ts
new file mode 100644
index 00000000..47b86c24
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/pages.module.ts
@@ -0,0 +1,147 @@
+import { NgModule } from '@angular/core'; 
+import { CommonModule } from '@angular/common';
+import { PagesComponent } from './pages.component';
+import { PagesRoutingModule } from './pages-routing.module';
+import { AdminComponent } from './admin/admin.component';
+import { RolesComponent } from './admin/roles/roles.component';
+import { RoleFunctionsComponent } from './admin/role-functions/role-functions.component';
+import { UsageComponent } from './admin/usage/usage.component';
+import { CacheAdminComponent } from './admin/cache-admin/cache-admin.component';
+import { MenusComponent } from './admin/menus/menus.component';
+import { NewMenuComponent } from './admin/menus/new-menu/new-menu.component';
+
+import { ReactiveFormsModule, FormsModule } from '@angular/forms';
+import { HttpClientModule } from '@angular/common/http';
+import { MaterialModule } from '../material-module';
+
+
+import { DashboardReportGridComponent } from './analytics/Report_List/Report/definition/dashboard-report-grid/dashboard-report-grid.component';
+import { DataChartComponent } from './analytics/Report_List/Report/definition/dashboard-report-grid/data-chart/data-chart.component';
+import { RunDashboardReportComponent } from './analytics/Report_List/Report/run/run-report/run-dashboard-report/run-dashboard-report.component';
+import { DefinitionComponent } from './analytics/Report_List/Report/definition/definition.component';
+import { MatTabsModule} from '@angular/material';
+import { SQLComponent } from './analytics/Report_List/Report/sql/sql.component';
+import { ColumnsComponent } from './analytics/Report_List/Report/columns/columns.component';
+import { FormFieldsComponent } from './analytics/Report_List/Report/form-fields/form-fields.component';
+import { ChartWizardComponent } from './analytics/Report_List/Report/chart-wizard/chart-wizard.component';
+import { SecurityComponent } from './analytics/Report_List/Report/security/security.component';
+import { LogComponent } from './analytics/Report_List/Report/log/log.component';
+import { RunComponent } from './analytics/Report_List/Report/run/run.component';
+import { MatButtonToggleModule} from '@angular/material/button-toggle';
+import { NgbModule} from '@ng-bootstrap/ng-bootstrap';
+import { DefinitionSaveDialogComponent } from './analytics/Report_List/Report/definition/definition-save-dialog/definition-save-dialog.component';
+import { SQLSaveChangesDialogComponent } from './analytics/Report_List/Report/sql/sql-save-changes-dialog/sql-save-changes-dialog.component';
+import { SQLValidateChangesDialogComponent } from './analytics/Report_List/Report/sql/sql-validate-changes-dialog/sql-validate-changes-dialog.component';
+import { SQLValidateSuccessDialogComponent } from './analytics/Report_List/Report/sql/sql-validate-success-dialog/sql-validate-success-dialog.component';
+import { SQLValidateErrorDialogComponent } from './analytics/Report_List/Report/sql/sql-validate-error-dialog/sql-validate-error-dialog.component';
+import { ReportComponent } from './analytics/Report_List/Report/report.component';
+import { EditDrillDownLinkComponent } from './analytics/Report_List/Report/columns/columns-edit-component/edit-drill-down-link/edit-drill-down-link.component';
+import { FormFieldsAddEditComponent } from './analytics/Report_List/Report/form-fields/form-fields-add-edit/form-fields-add-edit.component';
+import { RunReportFormFieldsComponent } from './analytics/Report_List/Report/run/run-report-form-fields/run-report-form-fields.component';
+import { RunReportResultSetComponent } from './analytics/Report_List/Report/run/run-report-result-set/run-report-result-set.component';
+
+import { ColumnListComponent } from './analytics/Report_List/Report/columns/column-list/column-list.component';
+import { MatTableModule } from '@angular/material/table';
+import { MatPaginatorModule } from '@angular/material/paginator';
+import { MatSortModule } from '@angular/material/sort';
+import { MatIconModule} from '@angular/material/icon';
+import { ColumnsEditComponent } from './analytics/Report_List/Report/columns/columns-edit-component/columns-edit.component';
+import { HeaderTabsComponent } from './analytics/Report_List/header-tabs-component/header-tabs.component';
+import { ReportListComponent } from './analytics/Report_List/report-list.component';
+import { RunReportComponent } from './analytics/Report_List/Report/run/run-report/run-report.component';
+import { HeaderTabsWrapperComponent } from './analytics/Report_List/header-tabs-wrapper-component/header-tabs-wrapper.component';
+import { SearchComponent } from './ext/profile/search/search.component';
+import { SelfComponent } from './ext/profile/self/self.component';
+import { NewRoleComponent } from './admin/roles/new-role/new-role.component';
+import { InformationModalComponent } from '../modals/information-modal/information-modal.component';
+import { NewRoleFunctionComponent } from './admin/role-functions/new-role-function/new-role-function.component';
+import { ConfirmationModalComponent } from '../modals/confirmation-modal/confirmation-modal.component';
+import { WelcomeDashboardComponent } from './welcome-dashboard/welcome-dashboard.component';
+import { BarChartComponent } from './welcome-dashboard/bar-chart/bar-chart.component';
+import { PieChartComponent } from './welcome-dashboard/pie-chart/pie-chart.component';
+import { NoteComponent } from './welcome-dashboard/note/note.component';
+import { GridsterModule } from 'angular-gridster2';
+
+
+
+@NgModule({
+  declarations: [
+    PagesComponent,
+    WelcomeDashboardComponent,
+    BarChartComponent,
+    NoteComponent,
+    PieChartComponent,
+    AdminComponent,
+    RolesComponent,
+    NewRoleComponent,
+    RoleFunctionsComponent,
+    NewRoleFunctionComponent,
+    UsageComponent,
+    CacheAdminComponent,
+    MenusComponent,
+    NewMenuComponent,
+
+    DefinitionComponent,
+    SQLComponent,
+    ColumnsComponent,
+    FormFieldsComponent,
+    ChartWizardComponent,
+    SecurityComponent,
+    LogComponent,
+    RunComponent,
+    DefinitionSaveDialogComponent,
+    SQLSaveChangesDialogComponent,
+    SQLValidateChangesDialogComponent,
+    SQLValidateSuccessDialogComponent,
+    SQLValidateErrorDialogComponent,
+    ReportComponent,
+    DashboardReportGridComponent, 
+    DataChartComponent, 
+    RunDashboardReportComponent,
+    EditDrillDownLinkComponent,
+    FormFieldsAddEditComponent,
+    RunReportFormFieldsComponent,
+    RunReportResultSetComponent,
+
+    ColumnListComponent,
+    ColumnsEditComponent,
+    HeaderTabsComponent,
+    ReportListComponent,
+    RunReportComponent,
+    HeaderTabsWrapperComponent,
+
+    SearchComponent,
+    SelfComponent,
+    InformationModalComponent,
+    ConfirmationModalComponent
+
+  ],
+  imports: [
+    CommonModule,
+    PagesRoutingModule,
+
+    MaterialModule,
+    ReactiveFormsModule,
+    FormsModule,
+    MatTabsModule,
+    HttpClientModule,
+    MatButtonToggleModule,
+    NgbModule,
+
+    FormsModule,
+    ReactiveFormsModule,
+    MatTabsModule,
+    HttpClientModule,
+    MatButtonToggleModule,
+    NgbModule,
+    MatTableModule,
+    MatPaginatorModule,
+    MatSortModule,
+    MatIconModule,
+    GridsterModule
+  ],
+  entryComponents: [InformationModalComponent, ConfirmationModalComponent, NewRoleComponent, NewRoleFunctionComponent, NewMenuComponent],
+  providers: []
+
+})
+export class PagesModule { }
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/bar-chart/bar-chart.component.html b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/bar-chart/bar-chart.component.html
new file mode 100644
index 00000000..16141e6b
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/bar-chart/bar-chart.component.html
@@ -0,0 +1,39 @@
+<!--
+  ============LICENSE_START==========================================
+  ONAP Portal SDK
+  ===================================================================
+  Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+  ===================================================================
+ 
+  Unless otherwise specified, all software contained herein is licensed
+  under the Apache License, Version 2.0 (the "License");
+  you may not use this software except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+              http://www.apache.org/licenses/LICENSE-2.0
+ 
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+ 
+  Unless otherwise specified, all documentation contained herein is licensed
+  under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+  you may not use this documentation except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+              https://creativecommons.org/licenses/by/4.0/
+ 
+  Unless required by applicable law or agreed to in writing, documentation
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+ 
+  ============LICENSE_END============================================
+   
+-->
+<div>
+  <canvas id="fixes-enhancements"></canvas>
+</div>
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/bar-chart/bar-chart.component.scss b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/bar-chart/bar-chart.component.scss
new file mode 100644
index 00000000..8cacac55
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/bar-chart/bar-chart.component.scss
@@ -0,0 +1,37 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+\ No newline at end of file
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/bar-chart/bar-chart.component.spec.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/bar-chart/bar-chart.component.spec.ts
new file mode 100644
index 00000000..697eb9b8
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/bar-chart/bar-chart.component.spec.ts
@@ -0,0 +1,63 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { BarChartComponent } from './bar-chart.component';
+
+describe('BarChartComponent', () => {
+  let component: BarChartComponent;
+  let fixture: ComponentFixture<BarChartComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ BarChartComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(BarChartComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/bar-chart/bar-chart.component.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/bar-chart/bar-chart.component.ts
new file mode 100644
index 00000000..4b7a7811
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/bar-chart/bar-chart.component.ts
@@ -0,0 +1,109 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+
+import { Component, OnInit } from '@angular/core';
+import {Chart} from 'chart.js';
+
+@Component({
+  selector: 'app-bar-chart',
+  templateUrl: './bar-chart.component.html',
+  styleUrls: ['./bar-chart.component.scss']
+})
+export class BarChartComponent implements OnInit {
+  fixesEnhancementBarChart = [];
+    constructor() { }
+  
+    ngOnInit() {
+      this.getLineChart();
+    }
+  
+    getLineChart(){
+        this.fixesEnhancementBarChart = new Chart('fixes-enhancements',{
+          type:'bar',
+          data:{
+            labels:['Q1-2015','Q2-2015','Q3-2015','Q4-2015'],
+            datasets:[
+              {label:'SAMPLE 7',
+                data:[88.87,98.97,37.26,71.70],
+                backgroundColor:'#1f77b4',
+                borderColor:'#1f77b4',
+                fill:false
+              },
+              {label:'SAMPLE 6',
+              data:[11.13,15.17,19.21,75.76],
+                backgroundColor:'#ff7f0e',
+                borderColor:'#ff7f0e',
+                fill:false
+              },
+              {label:'SAMPLE 5',
+              data:[100.00,100.00,100.00,100.00,99.99],
+                backgroundColor:'#3a6657',
+                borderColor:'#3a6657',
+                fill:false
+              },
+              {label:'SAMPLE 4',
+              data:[11.88,12.44,44.76,76.67],
+                backgroundColor:'#ff2e0e',
+                borderColor:'#ff2e0e',
+                fill:false
+              },
+              {label:'SAMPLE 3',
+              data:[80.69,82.42,72.36,72.90],
+                backgroundColor:'#ff0eef',
+                borderColor:'#ff0eef',
+                fill:false
+              },
+              {label:'SAMPLE 2',
+              data:[11.74,22.31,33.15,44.16],
+                backgroundColor:'#ff0e5a',
+                borderColor:'#ff0e5a',
+                fill:false
+              },
+              {label:'SAMPLE 1',
+              data:[95.78,97.61,97.86,98.53],
+                backgroundColor:'#0edbff',
+                borderColor:'#0edbff',
+                fill:false
+              }, 
+            ]
+          }
+        }
+  
+        )
+    }
+}
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/note/note.component.css b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/note/note.component.css
new file mode 100644
index 00000000..5ca96efd
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/note/note.component.css
@@ -0,0 +1,77 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+ 
+.note {
+    background-color: rgb(255, 240, 70);
+    position: relative;
+    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5); 
+    margin-bottom: 1em;
+    border-radius: 10px 10px 0px 0px;
+}
+
+.note_toolbar {
+    background: #7f6c04;
+    border-radius: 8px 8px 0px 0px;
+}
+
+.close {
+    top: 5px;
+    cursor:pointer;
+    color: white;
+    position: relative;
+}
+
+.content {
+    padding: 5px;
+    outline: none;
+    height: 150px;
+    border-radius: 8px;
+    overflow-y: auto;
+    font-size: large;
+}
+
+.footer{
+  text-align: center
+}
+button {
+    cursor: pointer;
+    background: transparent;
+    border: none;
+    font-size: x-large;
+    outline: none;
+}
+\ No newline at end of file
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/note/note.component.html b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/note/note.component.html
new file mode 100644
index 00000000..f842511f
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/note/note.component.html
@@ -0,0 +1,47 @@
+<!--
+  ============LICENSE_START==========================================
+  ONAP Portal SDK
+  ===================================================================
+  Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+  ===================================================================
+ 
+  Unless otherwise specified, all software contained herein is licensed
+  under the Apache License, Version 2.0 (the "License");
+  you may not use this software except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+              http://www.apache.org/licenses/LICENSE-2.0
+ 
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+ 
+  Unless otherwise specified, all documentation contained herein is licensed
+  under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+  you may not use this documentation except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+              https://creativecommons.org/licenses/by/4.0/
+ 
+  Unless required by applicable law or agreed to in writing, documentation
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+ 
+  ============LICENSE_END============================================
+   
+-->
+<div class="note">
+  <div class="note_toolbar">
+	  <span class="close material-icons" (click)="onDismiss($event)">close</span>
+  </div>
+	<div class="content" contenteditable="true" (blur)="onFocusOut($event)">
+		<ng-content></ng-content>
+	</div>
+  <div class="footer">
+	  <button class="material-icons" (click)="record($event)">settings_voice</button>
+  </div>
+</div>
+\ No newline at end of file
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/note/note.component.spec.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/note/note.component.spec.ts
new file mode 100644
index 00000000..953906df
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/note/note.component.spec.ts
@@ -0,0 +1,63 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { NoteComponent } from './note.component';
+
+describe('NoteComponent', () => {
+  let component: NoteComponent;
+  let fixture: ComponentFixture<NoteComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ NoteComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(NoteComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/note/note.component.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/note/note.component.ts
new file mode 100644
index 00000000..9b35bb0d
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/note/note.component.ts
@@ -0,0 +1,80 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+import {Component, HostBinding, EventEmitter, Output, ElementRef} from '@angular/core'
+//declare var webkitSpeechRecognition:any;
+//declare var SpeechRecognition:any;
+@Component({
+  selector:'app-note',
+  templateUrl:'./note.component.html',
+  styleUrls:['./note.component.css']
+})
+
+export class NoteComponent {
+  //SpeechRecognition:any =webkitSpeechRecognition;
+  
+  recognition:any;
+
+  @Output() dismiss = new EventEmitter();
+  @Output() focusout = new EventEmitter();
+  constructor(private el:ElementRef) {
+   const {webkitSpeechRecognition} : IWindow = <IWindow>window;
+    this.recognition = new webkitSpeechRecognition();
+    this.recognition.onresult = (event)=> {
+      this.el.nativeElement.querySelector(".content").innerText += event.results[0][0].transcript
+      console.log(event.results[0][0].transcript) 
+      document.getElementById('toolbar').focus();
+    };
+  }
+  
+  onDismiss(event){
+    this.dismiss.emit(event);
+  }
+  
+  onFocusOut(event){
+    this.focusout.emit(event)
+  }
+
+  record(event) {
+    this.recognition.start();
+  }
+
+}
+
+export interface IWindow extends Window {
+  webkitSpeechRecognition: any;
+}
+\ No newline at end of file
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/pie-chart/pie-chart.component.html b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/pie-chart/pie-chart.component.html
new file mode 100644
index 00000000..e4977f96
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/pie-chart/pie-chart.component.html
@@ -0,0 +1,39 @@
+<!--
+  ============LICENSE_START==========================================
+  ONAP Portal SDK
+  ===================================================================
+  Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+  ===================================================================
+ 
+  Unless otherwise specified, all software contained herein is licensed
+  under the Apache License, Version 2.0 (the "License");
+  you may not use this software except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+              http://www.apache.org/licenses/LICENSE-2.0
+ 
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+ 
+  Unless otherwise specified, all documentation contained herein is licensed
+  under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+  you may not use this documentation except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+              https://creativecommons.org/licenses/by/4.0/
+ 
+  Unless required by applicable law or agreed to in writing, documentation
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+ 
+  ============LICENSE_END============================================
+   
+-->
+<div  style="display: block; height: 250px; width: 450px;">
+    <canvas id="fb-root-causes" style="display: block; height: 250px; width: 450px;"></canvas>
+</div>
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/pie-chart/pie-chart.component.scss b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/pie-chart/pie-chart.component.scss
new file mode 100644
index 00000000..8cacac55
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/pie-chart/pie-chart.component.scss
@@ -0,0 +1,37 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+\ No newline at end of file
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/pie-chart/pie-chart.component.spec.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/pie-chart/pie-chart.component.spec.ts
new file mode 100644
index 00000000..bba08382
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/pie-chart/pie-chart.component.spec.ts
@@ -0,0 +1,63 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PieChartComponent } from './pie-chart.component';
+
+describe('PieChartComponent', () => {
+  let component: PieChartComponent;
+  let fixture: ComponentFixture<PieChartComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ PieChartComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(PieChartComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/pie-chart/pie-chart.component.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/pie-chart/pie-chart.component.ts
new file mode 100644
index 00000000..356c85a6
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/pie-chart/pie-chart.component.ts
@@ -0,0 +1,87 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+
+import { Component, OnInit } from '@angular/core';
+import {Chart} from 'chart.js';
+
+@Component({
+  selector: 'app-pie-chart',
+  templateUrl: './pie-chart.component.html',
+  styleUrls: ['./pie-chart.component.scss']
+})
+export class PieChartComponent implements OnInit {
+
+  userFeedbackRootCausePieChart = [];
+  constructor() { }
+
+  ngOnInit() {
+    this.getPieChart();
+  }
+
+
+  getPieChart(){
+    this.userFeedbackRootCausePieChart = new Chart('fb-root-causes',{
+      type:'doughnut',
+      options:{
+        responsive:true,
+        title:{
+          display:false,
+          text:'ENMT USer Feedback Root Cause Analysis in 2019'
+        },
+        legend:{
+          position:'right'
+        }
+      },
+     
+      data:{
+        labels:['AGPS','OTDOA','CELL_ID',
+                 'ECID','UNKNOWN','RTT','DBH'],
+        datasets:[
+          {label:'Root Causes',
+            data:[17888,131,40,786,1404,1173,95],
+            backgroundColor:["red","orange","yellow","green","blue","#1f77b4","#77b41f"]
+            
+          }         
+        ]
+      }
+    }
+
+    )
+}
+
+}
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/welcome-dashboard.component.css b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/welcome-dashboard.component.css
new file mode 100644
index 00000000..0124786e
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/welcome-dashboard.component.css
@@ -0,0 +1,332 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+ 
+.dashboard-card {
+  position: absolute;
+  top: 15px;
+  left: 15px;
+  right: 15px;
+  bottom: 15px;
+}
+
+.more-button {
+  position: absolute;
+  top: 5px;
+  right: 10px;
+}
+
+.dashboard-card-content {
+  text-align: center;
+}
+
+
+
+
+.dashboard-card {
+  position: absolute;
+  top: 15px;
+  left: 15px;
+  right: 15px;
+  bottom: 15px;
+}
+
+.more-button {
+  position: absolute;
+  top: 5px;
+  right: 10px;
+}
+
+.dashboard-card-content {
+  text-align: center;
+}
+
+.mat-card-header{
+ background: #eceeef
+}
+
+.line {fill:none; stroke:black;stroke-width: 1.5;}
+.line-0 {fill:none; stroke:#1f77b4;stroke-width: 1.5;stroke-dasharray:4,10;}
+.line-1 {fill:none; stroke:#ff7f0e;stroke-width: 1.5;stroke-dasharray:2,5.10;}
+.line-2 {fill:none; stroke:#2ca02c;stroke-width: 1.5;}
+.line-3 {fill:none; stroke:#d62728;stroke-width: 1.5;}
+.line-4 {fill:none; stroke:#9467bd;stroke-width: 1.5;}
+.line-5 {fill:none; stroke:#8c564b;stroke-width: 1.5;}
+.line-6 {fill:none; stroke:#e377c2;stroke-width: 1.5;}
+.line-7 {fill:none; stroke:#7f7f7f;stroke-width: 1.5;}
+.line-8 {fill:none; stroke:#bcbd22;stroke-width: 1.5;}
+.line-9 {fill:none; stroke:b#17becf;stroke-width: 1.5;}
+
+.bar { fill:#aaa; stroke:white;stroke-width: 1;}
+.bar-value { fill:black;font-size: 8pt;}
+.name { font-size: 10pt;text-anchor: middle}
+path {fill:white;stroke:black;stroke-width:0.5;}
+.axis text {
+    font-family: sans-serif;
+    font-size: 11px;
+}
+.axis path,
+.axis line {
+    fill: none;
+    stroke: black;
+}
+.axis_x line {
+    fill: none;
+    stroke: black;
+}
+.chart-title { fill:red;font-size: 18pt;text-anchor: middle;}
+.histogram-bar{fill:blue; stroke:white;stroke-width: 1;}
+.axis-x-text{ fill:blue;font-size: 12pt;}
+.treemap { stroke:black;fill:#777}		
+.treemap-label { font-size: 10pt;text-anchor: middle}
+.packlayout{ stroke:black;}
+.packlayout-label{ font-size: 10pt;text-anchor: middle}
+.pie-inner-title {font-size:9pt;text-anchor:middle;}
+.pieNum {font-size:10pt;text-anchor:middle;}
+.grid {stroke:gray;stroke-dasharray: 4,2;shape-rendering:crispEdges}
+
+.tree-node circle {
+    fill: #fff;
+    stroke: steelblue;
+    stroke-width: 3px;
+}
+.tree-node text { 
+    font: 12px sans-serif; 
+}
+.tree-node-internal text {
+    text-shadow: 0 1px 0 #fff, 0 -1px 0 #fff, 1px 0 0 #fff, -1px 0 0 #fff;
+}
+.tree-node-link {
+    fill: none;
+    stroke: #ccc;
+    stroke-width: 2px;
+}
+.force-links line {
+stroke: #999;
+stroke-opacity: 0.6;
+}
+
+.force-nodes circle {
+stroke: #fff;
+stroke-width: 1.5px;
+}
+
+
+.example-handle {
+  position: absolute;
+  top: 10px;
+  right: 10px;
+  color: #ccc;
+  cursor: move;
+  width: 24px;
+  height: 24px;
+}
+
+.mat-card:not([class*=mat-elevation-z]) {
+  box-shadow: 0 2px 1px -1px rgba(0,0,0,1), 
+              0 1px 1px 0 rgba(0,0,0,1), 
+              0 1px 3px 0 rgba(0,0,0,1);
+}
+
+
+.mat-card-content, .mat-card-subtitle {
+  font-size: 10px;
+}
+
+.mat-card-imp-links{
+  font-size: 12px;
+  text-align:left; 
+}
+
+.mat-card-feedback-enh{
+  font-size: 18px;
+  font-weight: 480;
+  font-family: Roboto,"Helvetica Neue",sans-serif;
+}
+
+
+.app {
+  overflow: auto;
+  margin-bottom: 50px;
+}
+.toolbar {
+  left: 0;
+  bottom: 0;
+  right: 0;
+  height:55px;
+  text-align: center;
+  position: fixed;
+  width: 100%;
+  background-color: gold;
+  border: 10px solid gray;
+  border-bottom: 0;
+  color: gray;
+  font-size: -webkit-xxx-large;
+  font-weight: bold;
+}
+
+button {
+  cursor: pointer;
+  background: transparent;
+  border: none;
+  padding: 10px;
+  font-size: xx-large;
+  outline: none;
+}
+.record {
+float: right;
+}
+
+
+
+/*
+gridster-item div.button-holder {
+  width: 100%;
+  height: 100%;
+ display: flex;
+   flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+*/
+/*
+gridster-item .item-buttons {
+  position: absolute;
+  top: 0;
+  right: 0;
+}*/
+
+/*
+gridster-item .gridster-item-content {
+  width: 100%;
+  height: 100%;
+  align-items: center;
+  justify-content: center;
+  display: flex;
+}
+
+.gridster-item-content {
+  background-color: yellow;
+  height: 100%;
+}
+
+:host {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+.destroy-button {
+  position: absolute;
+  right: 10px;
+  top: 10px;
+  z-index: 100;
+}*/
+
+/*
+.icon-content-gridguide{
+  cursor:move;
+  font-size: 14px; 
+  }
+  .form-row {
+    margin-top: -14px;
+}
+
+.appCatalogue-boarder{
+  background-color: #eee;
+  border: 1px dashed white;
+  
+  overflow-y: auto;
+  overflow-x: hidden;
+  }*/
+
+ /* .gridster {
+    height: calc(100vh - 600px); 
+    width: 100%;
+}*/
+.appCatalogue-boarder{
+  background-color: #eee;
+  border: 1px dashed white;  
+  overflow-y: auto;
+  overflow-x: hidden;
+  
+  }
+
+.gridster-box {
+  height: 100%;
+  border: 1px solid #ccc;
+  background-color: #fff;
+  transition: transform 0.5s ease-out;
+}
+.gridster-box-header {
+  background-color: rgba(245, 245, 245, 0.767);
+  padding: 0 0px 0 10px;
+  border-bottom: 1px solid #ccc;
+  position: relative;
+  height: 50px !important;
+}
+.gridster-box-header h3 {
+  
+  margin-top: 15px;
+  display: inline-block;
+  font-size: medium;
+  font-family: "Omnes-ECOMP-W02", Arial;
+}
+.gridster-box-content {
+  padding: 59px;
+}
+/*
+.gridster-box:hover{
+  transform: scale(1.1);
+}*/
+.gridster-box-header-btns {
+  top: 15px;
+  right: 10px;
+  position: absolute;
+}
+
+td {
+  font-weight: normal;
+  font-family: "Omnes-ECOMP-W02", Arial;
+  border: 1px solid white;
+  color: #1f77b4;
+}
+a{
+  font-weight: normal;
+  color: #1f77b4;
+}
+\ No newline at end of file
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/welcome-dashboard.component.html b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/welcome-dashboard.component.html
new file mode 100644
index 00000000..d010f983
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/welcome-dashboard.component.html
@@ -0,0 +1,200 @@
+<!--
+  ============LICENSE_START==========================================
+  ONAP Portal SDK
+  ===================================================================
+  Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+  ===================================================================
+ 
+  Unless otherwise specified, all software contained herein is licensed
+  under the Apache License, Version 2.0 (the "License");
+  you may not use this software except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+              http://www.apache.org/licenses/LICENSE-2.0
+ 
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+ 
+  Unless otherwise specified, all documentation contained herein is licensed
+  under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+  you may not use this documentation except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+              https://creativecommons.org/licenses/by/4.0/
+ 
+  Unless required by applicable law or agreed to in writing, documentation
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+ 
+  ============LICENSE_END============================================
+   
+-->
+
+<gridster [options]="gridOptions" class="appCatalogue-boarder">
+  <div *ngFor="let item of dashboard">
+      <!--Bar Chart-->
+      <div *ngIf="item.id===2">
+        <gridster-item [item]="item" > 
+          <div class="gridster-box"> 
+            <div class="gridster-box-header">
+              <h3>Call Success Rate</h3>
+              <div class="gridster-box-content">
+                <app-bar-chart></app-bar-chart>
+              </div>      
+              <div  *ngIf="item.hasContent">
+                <button mat-icon-button mat-raised-button class="drag-handler">
+                  <mat-icon>open_with</mat-icon>
+                </button>
+                <button mat-icon-button mat-raised-button class="remove-button" (mousedown)="removeItem($event, item)"
+                        (touchstart)="removeItem($event, item)" matTooltip="Remove">
+                  <mat-icon>delete</mat-icon>
+                </button>
+              </div>
+              <label *ngIf="!item.hasContent">{{item.label}}</label>
+              <button mat-mini-fab *ngIf="!item.hasContent" (mousedown)="removeItem($event, item)"
+                      (touchstart)="removeItem($event, item)" matTooltip="Remove">
+                <mat-icon>delete</mat-icon>
+              </button>
+            </div>
+          </div>
+        </gridster-item>
+      </div>
+
+      <!--  Pie Chart -->
+      <div *ngIf="item.id===3">
+        <gridster-item [item]="item" > 
+            <div class="gridster-box"> 
+              <div class="gridster-box-header">
+                <h3>Call Position Method Distribution on 10/14/2001</h3>
+                <div class="gridster-box-content">
+                  <app-pie-chart></app-pie-chart>
+                </div>      
+                <div  *ngIf="item.hasContent">
+                  <button mat-icon-button mat-raised-button class="drag-handler">
+                    <mat-icon>open_with</mat-icon>
+                  </button>
+                  <button mat-icon-button mat-raised-button class="remove-button" (mousedown)="removeItem($event, item)"
+                          (touchstart)="removeItem($event, item)" matTooltip="Remove">
+                    <mat-icon>delete</mat-icon>
+                  </button>
+                </div>
+                <label *ngIf="!item.hasContent">{{item.label}}</label>
+                <button mat-mini-fab *ngIf="!item.hasContent" (mousedown)="removeItem($event, item)"
+                        (touchstart)="removeItem($event, item)" matTooltip="Remove">
+                  <mat-icon>delete</mat-icon>
+                </button>
+              </div>
+            </div>
+          </gridster-item>
+      </div>
+
+
+      <!--  important links -->
+      <div *ngIf="item.id===4">
+        <gridster-item [item]="item" > 
+          <div class="gridster-box"> 
+            <div class="gridster-box-header">
+                <h3>Important Links</h3>
+                <div class="gridster-box-content">
+                  <div>
+                    <table>
+                      <thead>
+                        <th></th>
+                        <th></th>
+                      </thead>
+                      <tbody>
+                        <tr>
+                          <td>1. <td>
+                          <td><a href="#" target="_blank">Sample Network Simulator</a>
+                        </td>
+                        </tr>               
+                        <tr> 
+                          <td>2. <td>                 
+                          <td><a href="#" target="_blank">Work Space – Shared Folder</a></td>                
+                        </tr>
+                        <tr>
+                          <td>3. <td>
+                          <td><a href="#" target="_blank">Sample Help Documents</a></td>                            
+                        </tr>
+                      </tbody>
+                    </table>
+                  </div>
+                </div>      
+                <div  *ngIf="item.hasContent">
+                  <button mat-icon-button mat-raised-button class="drag-handler">
+                    <mat-icon>open_with</mat-icon>
+                  </button>
+                  <button mat-icon-button mat-raised-button class="remove-button" (mousedown)="removeItem($event, item)"
+                            (touchstart)="removeItem($event, item)" matTooltip="Remove">
+                      <mat-icon>delete</mat-icon>
+                  </button>
+                </div>
+                <label *ngIf="!item.hasContent">{{item.label}}</label>
+                <button mat-mini-fab *ngIf="!item.hasContent" (mousedown)="removeItem($event, item)"
+                          (touchstart)="removeItem($event, item)" matTooltip="Remove">
+                  <mat-icon>delete</mat-icon>
+                </button>
+              </div>
+            </div>
+          </gridster-item>
+        </div>
+
+        <!--  Sticky Notes -->
+        <div *ngIf="item.id===5">
+          <gridster-item [item]="item" > 
+          <div class="gridster-box"> 
+            <div class="gridster-box-header">
+              <h3>Sticky Notes</h3>
+              <div class="gridster-box-content">
+                <mat-card>
+                  <mat-card-header>
+                      <mat-card-title>
+                        Sticky Notes
+                        <button mat-icon-button class="more-button" [matMenuTriggerFor]="menu" aria-label="Toggle menu">
+                          <mat-icon>more_vert</mat-icon>
+                        </button>
+                        <mat-menu #menu="matMenu" xPosition="before">
+                          
+                        </mat-menu>
+                      
+                          <button class="add material-icons" (click)="addNote()" >
+                          note_add
+                          </button>
+                      
+                      </mat-card-title>
+                    </mat-card-header>
+                    <mat-card-content class="dashboard-card-content">
+                      
+                      
+                        <div class="app">
+                          <app-note *ngFor="let note of notes" (dismiss)="deleteNote($event)" (focusout)="saveNote($event)" id="{{note.id}}">{{note.content}}</app-note>
+                        </div>
+                        
+                    </mat-card-content>
+                  </mat-card>
+                </div>      
+                <div  *ngIf="item.hasContent">
+                  <button mat-icon-button mat-raised-button class="drag-handler">
+                    <mat-icon>open_with</mat-icon>
+                  </button>
+                  <button mat-icon-button mat-raised-button class="remove-button" (mousedown)="removeItem($event, item)"
+                      (touchstart)="removeItem($event, item)" matTooltip="Remove">
+                    <mat-icon>delete</mat-icon>
+                  </button>
+                </div>
+                <label *ngIf="!item.hasContent">{{item.label}}</label>
+                <button mat-mini-fab *ngIf="!item.hasContent" (mousedown)="removeItem($event, item)"
+                    (touchstart)="removeItem($event, item)" matTooltip="Remove">
+                  <mat-icon>delete</mat-icon>
+                </button>
+              </div>
+            </div>
+          </gridster-item>
+        </div>
+    </div>
+</gridster>
+\ No newline at end of file
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/welcome-dashboard.component.spec.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/welcome-dashboard.component.spec.ts
new file mode 100644
index 00000000..c4742cb8
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/welcome-dashboard.component.spec.ts
@@ -0,0 +1,80 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+
+import { LayoutModule } from '@angular/cdk/layout';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import {
+  MatButtonModule,
+  MatCardModule,
+  MatGridListModule,
+  MatIconModule,
+  MatMenuModule,
+} from '@angular/material';
+
+import { WelcomeDashboardComponent } from './welcome-dashboard.component';
+
+describe('WelcomeDashboardComponent', () => {
+  let component: WelcomeDashboardComponent;
+  let fixture: ComponentFixture<WelcomeDashboardComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [WelcomeDashboardComponent],
+      imports: [
+        NoopAnimationsModule,
+        LayoutModule,
+        MatButtonModule,
+        MatCardModule,
+        MatGridListModule,
+        MatIconModule,
+        MatMenuModule,
+      ]
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(WelcomeDashboardComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should compile', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/welcome-dashboard.component.ts b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/welcome-dashboard.component.ts
new file mode 100644
index 00000000..99118e3a
--- /dev/null
+++ b/ecomp-sdk/epsdk-app-os/ngappsrc/src/app/pages/welcome-dashboard/welcome-dashboard.component.ts
@@ -0,0 +1,551 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *             https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * ============LICENSE_END============================================
+ *
+ * 
+ */
+
+import { Component, ElementRef, ChangeDetectionStrategy, ViewChild } from '@angular/core';
+import { map } from 'rxjs/operators';
+import { Breakpoints, BreakpointObserver } from '@angular/cdk/layout';
+import * as  ChartConst from 'ng6-o2-chart';
+import { CloudData, CloudOptions } from 'angular-tag-cloud-module';
+import { GoogleChartComponent } from 'angular-google-charts';
+import {
+  CompactType,
+  DisplayGrid,
+  GridsterComponentInterface,
+  GridsterConfig,
+  GridsterItem,
+  GridsterItemComponentInterface,
+  GridType
+} from 'angular-gridster2';
+
+@Component({
+  selector: 'app-welcome-dashboard',
+  templateUrl: './welcome-dashboard.component.html',
+  styleUrls: ['./welcome-dashboard.component.css'],
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+
+
+
+export class WelcomeDashboardComponent {
+  /** Based on the screen size, switch from standard to one column per row */
+ 
+  private bar_chart:GridsterItem;
+  private pie_chart:GridsterItem;
+  private favorite_reports:GridsterItem;
+  private gauge_chart:GridsterItem;
+  private map_chart:GridsterItem;
+  private word_cloud:GridsterItem;
+  private sticky_notes:GridsterItem;
+  private candle_stick_chart:GridsterItem;
+
+
+  @ViewChild('googlechart')
+  googlechart: GoogleChartComponent;
+  chart = {
+    type: 'Gauge',
+    data: [
+      ['Central', 57],
+      ['NorthEast', 72],
+      ['West', 68],
+      ['SouthEast', 75],
+    ],
+    options: {
+      width: 400,
+      height: 200,
+      greenFrom: 0,
+      greenTo: 75,
+      redFrom: 90,
+      redTo: 100,
+      yellowFrom: 75,
+      yellowTo: 90,
+      minorTicks: 20,
+      minCols:1,
+      maxCols:1,
+      minItemCols:1,
+      maxItemRows:1
+    }
+  };
+
+  gridOptions: GridsterConfig;
+  dashboard: Array<GridsterItem>;
+  remove: boolean;
+
+
+  notes = [];
+  recognition:any;
+  
+  cards = [
+    { title: 'Card 1', cols: 2, rows: 1 },
+    { title: 'Card 2', cols: 1, rows: 1 },
+    { title: 'Card 3', cols: 1, rows: 2 },
+    { title: 'Card 4', cols: 1, rows: 1 }
+  ];
+
+  ngOnInit(){  
+    this.gridOptions = {
+      minCols: 6,
+      maxCols: 6,
+      minRows: 10,
+      maxRows: 10,
+      maxItemCols: 50,
+      minItemCols: 1,
+      maxItemRows: 50,
+      minItemRows: 1,
+      maxItemArea: 2500,
+      minItemArea: 1,
+      defaultItemCols: 1,
+      defaultItemRows: 1,
+      setGridSize: true,
+      fixedColWidth: 250,
+      fixedRowHeight: 250,
+      gridType: GridType.ScrollVertical,
+      swap: true,
+      dynamicColumns: true,
+      displayGrid: DisplayGrid.None,
+      draggable: {
+        enabled: true
+      },
+      pushItems: true,
+      resizable: {
+        enabled: true
+      }
+    };
+
+    this.dashboard = [
+      {id:1,cols: 2, rows: 2, y: 0, x: 0, hasContent: true,dragEnabled: true, resizeEnabled: true, label: 'Drag&Resize Enabled'},
+      {id:2,cols: 2, rows: 2, y: 0, x: 2, hasContent: true,dragEnabled: true, resizeEnabled: true, label: 'Drag&Resize Enabled'},
+      {id:3,cols: 2, rows: 2, y: 1, x: 3, hasContent: true,dragEnabled: true, resizeEnabled: true, label: 'Drag&Resize Enabled'},
+      {id:4,cols: 2, rows: 2, y: 1, x: 4, hasContent: true,dragEnabled: true, resizeEnabled: true, label: 'Drag&Resize Enabled'},
+      {id:5,cols: 2, rows: 2, y: 2, x: 1, hasContent: true,dragEnabled: true, resizeEnabled: true, label: 'Drag&Resize Enabled'},
+      {id:6,cols: 2, rows: 2, y: 2, x: 1, hasContent: true,dragEnabled: true, resizeEnabled: true, label: 'Drag&Resize Enabled'},
+      {id:7,cols: 1, rows: 2, y: 1, x: 5, hasContent: true,dragEnabled: true, resizeEnabled: true, label: 'Drag&Resize Enabled'}
+    ];
+  }
+
+
+  removeItem($event, item) {
+    $event.preventDefault();
+    $event.stopPropagation();
+    this.dashboard.splice(this.dashboard.indexOf(item), 1);
+  }
+
+  // addItem() {
+  //   this.dashboard.push({});
+  // }
+  
+  getRandomColor() {
+    var letters = '0123456789ABCDEF';
+    var color = '#';
+    for (var i = 0; i < 6; i++) {
+      color += letters[Math.floor(Math.random() * 16)];
+    }
+    return color;
+  }
+
+  options: CloudOptions = {
+    // if width is between 0 and 1 it will be set to the size of the upper element multiplied by the value 
+    width: 20,
+    height: 20,
+    overflow: true
+  };
+       
+  data: CloudData[] = [
+     {"text":"PALM BEACH","weight":84, color : this.getRandomColor()}
+    ,{"text":"ATLANTA","weight":75, color : this.getRandomColor()}
+    ,{"text":"SCHAUMBURG","weight":70, color : this.getRandomColor()}
+    ,{"text":"RUSSIA","weight":62, color : this.getRandomColor()}
+    ,{"text":"REDMOND","weight":50, color : this.getRandomColor()}
+    ,{"text":"FRISCO","weight":49, color : this.getRandomColor()}
+    ,{"text":"FARMERS BRANCH","weight":44, color : this.getRandomColor()}
+    ,{"text":"RAMON","weight":35, color : this.getRandomColor()}
+    ,{"text":"ALPHARETTA","weight":32, color : this.getRandomColor()}
+    ,{"text":"HANOVER","weight":29, color : this.getRandomColor()}
+    ,{"text":"TUSTIN","weight":27, color : this.getRandomColor()}
+    ,{"text":"SAN ANTONIO","weight":26, color : this.getRandomColor()}
+  ];
+
+  chartType: string;
+  configData: any;
+  barDataJson: any;
+  geoMapDataJson: any;
+  geoOrthographicDataJson: any;
+  choroplethDataJson: any;
+  scatterPlotDataJson: any;
+  lineDataJson: any;
+  histogramDataJson: any;
+  pieDataJson: any;
+  packLayoutDataJson: any;
+  treeMapDataJson: any;
+  stackBarDataJson: any;
+  treeDataJson: any;
+  forceDataJson: any;
+  DataSetJson: string;
+
+  lineTypeName: string;
+  barTypeName: string;
+  pieTypeName: string;
+  scatterPlotTypeName: string;
+  histogramTypeName: string;
+  stackBarTypeName: string;
+  geoMapTypeName: string;
+  geoOrthographicTypeName: string;
+  treeMapTypeName: string;
+  packLayoutTypeName: string;
+  choroplethTypeName: string;
+  treeTypeName: string;
+  forceTypeName: string;
+  breakpointObserver: any;
+
+  constructor(private el:ElementRef) {
+    this.barTypeName       = ChartConst.LINE_CHART_TYPE_NAME;
+    this.lineTypeName     	= ChartConst.LINE_CHART_TYPE_NAME;
+    this.barTypeName     	= ChartConst.BAR_CHART_TYPE_NAME;
+    this.pieTypeName     	= ChartConst.PIE_CHART_TYPE_NAME;
+    this.scatterPlotTypeName 	= ChartConst.SCATTER_PLOT_CHART_TYPE_NAME;
+    this.histogramTypeName     = ChartConst.HISTOGRAM_CHART_TYPE_NAME;
+    this.stackBarTypeName     = ChartConst.STACK_BAR_CHART_TYPE_NAME;
+    this.geoMapTypeName     = ChartConst.GEO_MAP_CHART_TYPE_NAME;
+    this.geoOrthographicTypeName = ChartConst.GEO_ORTHOGRAPHIC_CHART_TYPE_NAME;
+    this.treeMapTypeName     = ChartConst.TREE_MAP_CHART_TYPE_NAME;
+    this.packLayoutTypeName 	= ChartConst.PACK_LAYOUT_CHART_TYPE_NAME;
+    this.choroplethTypeName 	= ChartConst.CHOROPLETH_CHART_TYPE_NAME;
+    this.treeTypeName     	= ChartConst.TREE_CHART_TYPE_NAME;
+    this.forceTypeName     	= ChartConst.FORCE_CHART_TYPE_NAME;
+
+    this.initilizeData();
+
+    this.notes = JSON.parse(localStorage.getItem('notes')) || [{ id: 0,content:'' }];
+
+    const {webkitSpeechRecognition} : IWindow = <IWindow>window;
+    this.recognition = new webkitSpeechRecognition();
+    this.recognition.onresult = (event)=> {
+      console.log(this.el.nativeElement.querySelectorAll(".content")[0]);
+      this.el.nativeElement.querySelectorAll(".content")[0].innerText = event.results[0][0].transcript
+      
+    };
+  }
+
+  updateAllNotes() {
+    console.log(document.querySelectorAll('app-note'));
+    let notes = document.querySelectorAll('app-note');
+
+    notes.forEach((note, index)=>{
+         console.log(note.querySelector('.content').innerHTML)
+         this.notes[note.id].content = note.querySelector('.content').innerHTML;
+    });
+
+    localStorage.setItem('notes', JSON.stringify(this.notes));
+
+  }
+
+  addNote () {
+    this.notes.push({ id: this.notes.length + 1,content:'' });
+    // sort the array
+    this.notes= this.notes.sort((a,b)=>{ return b.id-a.id});
+    localStorage.setItem('notes', JSON.stringify(this.notes));
+  };
+  
+  saveNote(event){
+    const id = event.srcElement.parentElement.parentElement.getAttribute('id');
+    const content = event.target.innerText;
+    event.target.innerText = content;
+    const json = {
+      'id':id,
+      'content':content
+    }
+    this.updateNote(json);
+    localStorage.setItem('notes', JSON.stringify(this.notes));
+    console.log("********* updating note *********")
+  }
+  
+  updateNote(newValue){
+    this.notes.forEach((note, index)=>{
+      if(note.id== newValue.id) {
+        this.notes[index].content = newValue.content;
+      }
+    });
+  }
+  
+  deleteNote(event){
+     const id = event.srcElement.parentElement.parentElement.parentElement.getAttribute('id');
+     this.notes.forEach((note, index)=>{
+      if(note.id== id) {
+        this.notes.splice(index,1);
+        localStorage.setItem('notes', JSON.stringify(this.notes));
+        console.log("********* deleting note *********")
+        return;
+      }
+    });
+  }
+
+   record(event) {
+    this.recognition.start();
+    this.addNote();
+  }
+
+  private initilizeData() {
+    // ConfigData = this.httpClient.get('assets/json/ConfigData.json');
+    this.configData = {
+      // tslint:disable-next-line:quotemark
+      "className": {
+        'axis': 'axis',
+        'axisXBorder': 'axis_x',
+        'axisXText': 'axis-x-text',
+        'bar': 'bar',
+        'barValue': 'bar-value',
+        'line': 'line',
+        'multiLinePrefix': 'line-',
+        'grid': 'grid',
+        'pie': 'pie',
+        'pieInnerTitle': 'pie-inner-title',
+        'pieInnerRadius': 'total',
+        'histogram': 'histogram',
+        'histogramBar': 'histogram-bar',
+        'treemap': 'treemap',
+        'treemapLabel': 'treemap-label',
+        'packlayout': 'packlayout',
+        'packlayoutLabel': 'packlayout-label',
+      },
+      'label': {
+          'display': true,
+      },
+      'title': {
+        'display': false,
+        'name': 'Calls for Cities',
+        'className': 'chart-title',
+        'height': 30,
+        'leftMargin': -20,
+        'bottomMargin': 10
+      },
+      'maxValue': {
+        'auto': true,
+        'x': 100,
+        'y': 100,
+      },
+      'legend': {
+        'display': true,
+        'position':'right',
+        'totalWidth': 80,
+        'initXPos': 5,
+        'initYPos': 10,
+        'rectWidth': 10,
+        'rectHeight': 10,
+        'xSpacing': 2,
+        'ySpacing': 2
+      },
+      'color': {
+        'auto': true, //
+        'defaultColorNumber': 10,
+        'opacity': 1.0,
+        'userColors': [
+          'blue',
+          'red',
+          'green',
+          'yellow',
+          'PaleGoldenrod',
+          'Khaki',
+          'DarkKhaki',
+          'Gold',
+          'Cornsilk',
+          'BlanchedAlmond',
+          'Bisque',
+          'NavajoWhite',
+          'Wheat',
+          'BurlyWood',
+          'Tan',
+          'RosyBrown',
+          'SandyBrown',
+          'Goldenrod',
+          'DarkGoldenrod',
+          'Peru',
+          'Chocolate'
+        ],
+        'focusColor': 'red',
+      },
+      'pie': {
+        'innerRadius': {
+          'percent': 20,
+          'title': 'Total'
+        },
+        'value': {
+          'display': true,
+        },
+        'percent':{
+          'display': false,
+        }
+      },
+      'line': {
+        'legend': 'lineEnd',
+        'interpolate' : 'linear',
+      },
+      'grid': {
+        'x': {
+          'display': true,
+        },
+        'y': {
+          'display': true,
+        },
+      },
+      'margin': {
+        'top': 30,
+        'left': 30,
+        'right': 10,
+        'bottom': 20,
+        'between': 5
+      },
+      'axis': {
+        'rotation': 0,
+        'borderLineWidth': 1,
+        'xLabel': {
+          'leftMargin': 0,
+          'bottomMargin': 5
+        },
+        'yLabel':{
+          'leftMargin': 0,
+          'bottomMargin': 0
+        },
+      },
+      'animation': {
+        'enable': true,
+        'duration': 4000,
+      },
+    };
+
+
+    this.barDataJson =
+    {
+      'series': [
+        'Fixes',
+        'Enhancements'
+      ],
+      'data': [
+        {
+          'x': 'Jan',
+          'y': [44, 50],
+        },
+        {
+          'x': 'Feb',
+          'y': [36, 42],
+        },
+        {
+          'x': 'Mar',
+          'y': [56, 70],
+        },
+        {
+          'x': 'Apr',
+          'y': [60, 73],
+        },
+        {
+          'x': 'May',
+          'y': [47, 82],
+        },
+        {
+          'x': 'Jun',
+          'y': [53, 45],
+        },
+        {
+          'x': 'Jul',
+          'y': [54, 61],
+        },
+        {
+          'x': 'Aug',
+          'y': [53, 71],
+        },
+        {
+          'x': 'Sep',
+          'y': [55, 51],
+        },
+        {
+          'x': 'Oct',
+          'y': [18, 16],
+        },
+      ],
+    };
+    
+    this.histogramDataJson =
+    {
+    	'range':[0,100],
+    	'bins': [0,10,20,30,40,50,60,70,80,90,100],
+    	'data':[
+        11,95,60,44,60,50,35,20,10,22,
+        19,70,65,42,22,33,40,53,52,89,
+        90,55,50,55,65,72,45,35,15,45,
+        50,95,60,26,60,50,35,20,10,33,
+        56,70,65,42,22,33,40,53,52,89,
+        90,55,50,55,28,72,45,35,15,28,
+        50,95,60,44,60,37,35,20,10,22,
+        56,70,65,22,22,37,40,53,52,89,
+        90,55,50,55,65,72,45,35,15,45,
+    	],
+    };
+    
+
+    this.pieDataJson =
+    {
+    	'data':[
+        {
+          'name': 'Data source with Discrepancies',
+          'value':31
+        },
+        {
+          'name': 'Report not functioning',
+          'value':24
+        },
+        {
+          'name': 'Data missing from source',
+          'value':10
+        },
+        {
+          'name': 'Data source reloaded',
+          'value':65
+        },
+        {
+          'name': 'User error',
+          'value':17
+        },{
+          'name': 'NA',
+          'value':239
+        },
+    	],
+    };
+  }
+}
+
+export interface IWindow extends Window {
+  webkitSpeechRecognition: any;
+}
author	Muni Mohan Kunchi <munmohan@att.com>	2020-02-06 13:51:45 -0500
committer	Muni Mohan Kunchi <munmohan@att.com>	2020-02-06 13:54:22 -0500
commit	e3636b96e9938cb89bb90672cf70fff3ae790186 (patch)
tree	89dd47a4a95150f70e83556a3280cf4cd02daf89 /ecomp-sdk/epsdk-app-os/ngappsrc/src/app
parent	35d028274a61ce8e77a9fa409877d93d0fce05a8 (diff)