diff options
Diffstat (limited to 'ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus')
10 files changed, 1289 insertions, 0 deletions
diff --git a/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.component.html b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.component.html new file mode 100644 index 00000000..25ae9665 --- /dev/null +++ b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.component.html @@ -0,0 +1,48 @@ +<!-- + ============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="main-container"> + <div id="page-content"> + <div class="ecomp-main-view-title"> + <h3 class="heading-page">Admin Menu Items</h3> + </div> + <div ng-show="showLoader" class="span loader-container"> + <i class="icon-primary-spinner" role="img" aria-label="Please wait while we load your content"></i> + </div> + <span class="ecomp-spinner" *ngIf="showSpinner"></span> + <rdp-data-table [data]="tableData" [settings]="settings"></rdp-data-table> + </div> +</div>
\ No newline at end of file diff --git a/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.component.scss b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.component.scss new file mode 100644 index 00000000..4e88eeb8 --- /dev/null +++ b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.component.scss @@ -0,0 +1,70 @@ +/* + * ============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============================================ + * + * + */ + + table { + width: 100%; +} + +.mat-form-field { + font-size: 14px; + width: 100%; +} + +td, th { + width: 25%; +} + +td[_ngcontent-c4], th[_ngcontent-c4] { + width: 7%; +} + +::ng-deep .mat-form-field[_ngcontent-c4][_ngcontent-c4] { + font-size: 14px; + width: 20%; + float: left; +} + +rdp-data-table{ + overflow-x : scroll; +} + +:host::ng-deep .mat-header-cell{ + font-weight: bold; + font-size: 14px; + color: #343a40; +}
\ No newline at end of file diff --git a/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.component.spec.ts b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.component.spec.ts new file mode 100644 index 00000000..49fee828 --- /dev/null +++ b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.component.spec.ts @@ -0,0 +1,74 @@ +import { async, ComponentFixture, TestBed, inject } from '@angular/core/testing'; +import { MatTableModule } from '@angular/material/table'; +import { MatPaginatorModule } from '@angular/material/paginator'; +import { MatSortModule } from '@angular/material/sort'; +import { NoopAnimationsModule } from '@angular/platform-browser/animations'; +import { BrowserDynamicTestingModule } from '@angular/platform-browser-dynamic/testing'; +import { NgbModule, NgbModal } from '@ng-bootstrap/ng-bootstrap'; + +import { MenusComponent } from './menus.component'; +import { AdminService } from '../admin.service'; +import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; +import { HttpClientTestingModule } from '@angular/common/http/testing'; +import { MenusService } from './menus.service'; +import { CookieService } from 'ngx-cookie-service'; +import { MockBackend } from '@angular/http/testing'; +import { BaseRequestOptions, Http } from '@angular/http'; +import 'rxjs/add/observable/of'; +import { Observable } from 'rxjs/Observable'; +import { InformationModalComponent } from '../../modals/information-modal/information-modal.component'; + +describe('MenusComponent', () => { + let component: MenusComponent; + let fixture: ComponentFixture<MenusComponent>; + let modalService: any; + let adminService:any; + var stubData={"data":'{"fnMenuItems":{"tableData":{"element":{"active":1}}}}'}; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + schemas:[CUSTOM_ELEMENTS_SCHEMA], + declarations: [ MenusComponent, + InformationModalComponent ], + imports: [ MatTableModule, + MatPaginatorModule, + MatSortModule, + HttpClientTestingModule, + NoopAnimationsModule, + NgbModule.forRoot() + ], + providers:[MenusService,CookieService] + }) + .compileComponents(); + })); + + beforeEach(async() => { + fixture = TestBed.createComponent(MenusComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + modalService = TestBed.get(NgbModal); + adminService=TestBed.get(AdminService); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); + + describe('test getMenus',()=>{ + it('should test getMenus',()=>{ + let spy=spyOn(adminService,'getParentData').and.returnValue(Observable.of('you object')) + component.getParentData(); + expect(spy).toHaveBeenCalled(); + }) + }) + + describe('testing getFunctionCDselectData',()=>{ + it('should test getFunctionCDselectData',()=>{ + let spy=spyOn(adminService,'getFunctionCdList').and.returnValue(Observable.of(1,1)); + component.getFunctionCDselectData(); + expect(spy).toHaveBeenCalled(); + }) + }) + + +}); diff --git a/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.component.ts b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.component.ts new file mode 100644 index 00000000..c6fbc8c4 --- /dev/null +++ b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.component.ts @@ -0,0 +1,203 @@ +/* + * ============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, ViewChild } from '@angular/core'; +import { MatTableDataSource } from '@angular/material/table'; +import { MatPaginator } from '@angular/material/paginator'; +import { MatSort } from '@angular/material/sort'; +import { AdminService } from '../admin.service'; +import { NgbModal, ModalDismissReasons, NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'; +import { InformationModalComponent } from 'src/app/modals/information-modal/information-modal.component'; +import { NewMenuComponent } from './new-menu/new-menu.component'; +import { Column, DataTableSettings, RdpCrudInterface , ColumnTypes} from 'portalsdk-tag-lib'; +import { element } from '@angular/core/src/render3'; +import { MenusService } from './menus.service'; + +@Component({ + selector: 'app-menus', + templateUrl: './menus.component.html', + styleUrls: ['./menus.component.scss'] +}) +export class MenusComponent implements OnInit { + + constructor(public adminService: AdminService, private ngModal: NgbModal, public menuService : MenusService) { } + + // menuHeaders = ["menuId", "label", "paretId", "sortOrder", "action", "functionCd", "active", "servlet", "queryString", "externalUrl", "target", "menuSetCode", "separator", "imageSrc", "Edit", "Delete"]; + + response: any; + result: any; + functionalMenuRes: any; + tableData; + dataSource: MatTableDataSource<[]>; + closeResult: string; + isEditMode: boolean; + showSpinner: boolean; + + public settings; + public columns: any = []; + + activeStatusOptions = [ + {id: '0', name: 'Y'}, + {id: '1', name: 'N'} + ]; + separatorStatusOptions = [ + {id: '0', name: 'Y'}, + {id: '1', name: 'N'} + ]; + functionCDselectData = []; + parentListSelectData = []; + parentList = []; + + @ViewChild(MatPaginator, {}) paginator: MatPaginator; + @ViewChild(MatSort, {}) sort: MatSort; + + ngOnInit() { + this.showSpinner = false; + this.getParentData(); + this.getFunctionCDselectData(); + this.getMenus(); + } + + getMenus() { + console.log(">>>>>>>>>>>>>>> GetMenus calles >>>>>>>>>>>>>>") + this.showSpinner = true; + let response; + this.response = this.adminService.getFnMenuItems(); + this.response.subscribe(data => { + response = data; + + this.functionalMenuRes = JSON.parse(response.data); + this.tableData = this.functionalMenuRes.fnMenuItems; + this.tableData.forEach(element => { + if (element.active) { element.active = "Y"; } + else { element.active = "N"; } + if (element.separator) { element.separator = "Y"; } + else { element.separator = "N"; } + }); + + //rdp table data + let menuIdColumn = new Column("id", "Menu ID", ColumnTypes.TEXT, true, null); + menuIdColumn.isColumnDisabled = true; + this.columns.push(menuIdColumn); + + let label = new Column("label", "Label", ColumnTypes.TEXT, true, null); + label.setIsColumnMandatory = true; + this.columns.push(label); + + let parent = new Column("parentId", "ParentId", ColumnTypes.DROPDOWN, true, this.parentList); + parent.setIsColumnMandatory = true; + this.columns.push(parent); + + let sortOrder = new Column("sortOrder", "Sort Order", ColumnTypes.TEXT, true, null); + sortOrder.setIsColumnMandatory = true; + this.columns.push(sortOrder); + + let action = new Column("action", "Action", ColumnTypes.TEXT, true, null); + action.setIsColumnMandatory = true; + this.columns.push(action); + + let functionCd = new Column("functionCd", "Function", ColumnTypes.DROPDOWN, true, this.functionCDselectData); + functionCd.setIsColumnMandatory = true; + this.columns.push(functionCd); + + let active = new Column("active", "Active", ColumnTypes.DROPDOWN, true, this.activeStatusOptions); + active.setIsColumnMandatory = true; + this.columns.push(active); + + this.columns.push(new Column("servlet", "Servlet", ColumnTypes.TEXT, true, null)); + this.columns.push(new Column("queryString", " Query String", ColumnTypes.TEXT, true, null)); + this.columns.push(new Column("externalUrl", "External URL", ColumnTypes.TEXT, true, null)); + this.columns.push(new Column("target", "Target", ColumnTypes.TEXT, true, null)); + + let menuSetCode = new Column("menuSetCode", "Menu Set Code", ColumnTypes.TEXT, false, null); + menuSetCode.setIsColumnMandatory = true; + this.columns.push(menuSetCode); + + let separator = new Column("separator", "Separator", ColumnTypes.DROPDOWN, false, this.separatorStatusOptions); + separator.setIsColumnMandatory = true; + this.columns.push(separator); + this.columns.push(new Column("imageSrc", "Image Source", ColumnTypes.TEXT, true, null)); + + this.settings = new DataTableSettings() + this.settings.columns = this.columns; + this.settings.isPaginationEnabled = true; + this.settings.paginationsSize = "5"; + this.settings.isReadOnly = false; + this.settings.isTableSearchEnabled = true; + this.settings.applicationService = this.menuService; + + this.showSpinner = false; + + }); + } + + getFunctionCDselectData = function () { + this.adminService.getFunctionCdList() + .subscribe(_data => { + this.result = _data; + if (_data) { + + for(let i = 0; i< _data.length; i++){ + this.functionCDselectData.push({id: i, name: _data[i]}); + } + } + }, error => { + this.showSpinner = false; + console.log(error); + this.openConfirmationModal("", "Function Code Data not available !"); + }); + } + + getParentData() { + this.adminService.getParentData() + .subscribe(_data => { + this.result = _data; + if (_data) { + for(let i = 0; i< _data.length; i++){ + this.parentList.push({id: _data[i][0], name: _data[i][1]}); + } + console.log("Actual parent list : ", this.parentList); + this.menuService.getParentList(this.parentList); + } + }, error => { + this.showSpinner = false; + console.log(error); + }); + } + +} diff --git a/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.module.ts b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.module.ts new file mode 100644 index 00000000..99268e9f --- /dev/null +++ b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.module.ts @@ -0,0 +1,56 @@ +/* + * ============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 { CommonModule } from '@angular/common'; +import { MenusComponent } from './menus.component'; +import { MaterialModule } from 'src/app/material-module'; +import { FormsModule, ReactiveFormsModule } from '@angular/forms'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { NewMenuComponent } from './new-menu/new-menu.component'; +import {RdpModule} from 'portalsdk-tag-lib'; + +@NgModule({ + declarations: [MenusComponent, NewMenuComponent], + imports: [ + CommonModule, FormsModule, ReactiveFormsModule, MatFormFieldModule, RdpModule + ], + exports: [MenusComponent], + bootstrap: [MenusComponent] +}) +export class MenusModule { } diff --git a/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.service.ts b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.service.ts new file mode 100644 index 00000000..912b65bb --- /dev/null +++ b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/menus.service.ts @@ -0,0 +1,198 @@ + +/* + * ============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 { Injectable } from '@angular/core'; +import { HttpClient } from '@angular/common/http'; +import { RdpCrudInterface } from 'portalsdk-tag-lib'; +import { environment } from 'src/environments/environment'; +import { AdminService } from '../admin.service'; +import { BehaviorSubject } from 'rxjs'; + +@Injectable({ + providedIn: 'root' +}) +export class MenusService implements RdpCrudInterface { + + public statusResponse = new BehaviorSubject(""); + public updatedData = new BehaviorSubject<any>({}); + + loadTableData(filter: any, sortActive: any, sortDirection: any, pageIndex: any, pageSize: any): import("rxjs").Observable<any[]> { + throw new Error("Method not implemented."); + } + getTotalRowCount() { + throw new Error("Method not implemented."); + } + + parentDataList: any; + constructor(private http: HttpClient, private adminService: AdminService) { + + } + + + menu = { + action: null, + active: false, + activeAsString: "false", + auditTrail: null, + auditUserId: null, + childMenus: [], + created: null, + createdId: null, + externalUrl: null, + functionCd: null, + id: null, + imageSrc: null, + label: null, + menuLevel: null, + menuSetCode: null, + modified: null, + modifiedId: null, + parentId: null, + parentIdAsString: null, + parentMenu: null, + queryString: null, + rowNum: null, + separator: false, + separatorAsString: false, + servlet: null, + sortOrder: null, + target: null + }; + + add(data: any) { + console.log("Add method is getting called from AppServie data:: ", data); + } + + + update(data: any) { + data.active = this.updateStatus(data.active); + data.separator = this.updateStatus(data.separator); + let keys = Object.keys(data); + let menuCache = this.menu; + keys.forEach(element => { + if (data[element] != null || data[element] != undefined) { + if (element == 'parentId') { + if (isNaN(data[element])) { + menuCache[element] = this.updateParentNameToID(data[element]); + } else{ + menuCache[element] = data[element]; + } + console.log("Parent Id to update : ", menuCache[element]); + } else { + menuCache[element] = data[element]; + } + } + }); + let result = { availableFnMenuItem: menuCache }; + let postData = JSON.stringify(result); + console.log("postData >>>>>>", postData); + this.adminService.updateFnMenuItem(postData) + .subscribe(_data => { + console.log("Response : ", _data); + this.statusResponse.next("200"); + menuCache = this.menu; + }, error => { + console.log("Error : ", error); + menuCache = this.menu; + }); + + } + + delete(data: any) { + console.log("Delete method is getting called from AppServie data::>> " + JSON.stringify(data)); + console.log(data.active); + data.active = this.updateStatus(data.active); + data.separator = this.updateStatus(data.separator); + this.adminService.deleteMenu(data).subscribe(response => { + console.log("Response ", response); + this.statusResponse.next("200"); + }, error => { + console.log("Error : ", error); + }) + } + + private updateStatus(data) { + if (data == 'N') { + return false; + } else { + return true; + } + } + + private updateBooleanValue(data) { + if (data) { + return 'Y'; + } else { + return 'N'; + } + } + + parentList: any; + + getParentList(list) { + this.parentList = list; + } + + private updateParentNameToID(data) { + let val; + this.parentList.forEach(ele => { + if (ele['name'] == data) { + val = ele['id']; + } + }); + console.log("ParentId value ", val); + return val; + } + + get() { + console.log("get method is getting called from MenuServie data:: "); + let response = this.adminService.getFnMenuItems(); + let resp; + response.subscribe(res => { + resp = res; + let responseData = JSON.parse(resp.data).fnMenuItems; + responseData.forEach(element => { + element.active = this.updateBooleanValue(element.active); + element.separator = this.updateBooleanValue(element.separator); + }) + this.updatedData.next(responseData); + }) + } + +} diff --git a/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/new-menu/new-menu.component.html b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/new-menu/new-menu.component.html new file mode 100644 index 00000000..6a5426a8 --- /dev/null +++ b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/new-menu/new-menu.component.html @@ -0,0 +1,137 @@ +<!-- + ============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="container"> + <!--Modal Headers--> + <div class="modal-header"> + <h4 class="modal-title">{{(isEditMode) ? 'Edit Menu Item' : 'Add New Menu Item'}}</h4> + <button type="button" class="close" aria-label="Close" (click)="activeModal.dismiss('Cross')"> + <span aria-hidden="true">×</span> + </button> + </div> + + <!--Modal Body goes here--> + <div class="modal-body"> + <div class="elementsContainer"> + <div class="groupItem"> + <label class="item-label">*Label:</label><br> + <input [(ngModel)]="menu.label" type="text" name="label" id="label"> + </div> + <div class="groupItem"> + <label class="item-label">*Parent:</label><br> + <!-- <input [(ngModel)]="menu.parentId" type="text" name="parentId" id="parent"> --> + <select class="form-field" name="parentSelect" id="parentSelect" [(ngModel)]="menu.parentId"> + <option>{{getParentLabel(menu.parentId, parentListSelectData)}}</option> + <option *ngFor="let option of parentListSelectData" value="{{option[0]}}">{{option[1]}}</option> + </select> + </div> + <div class="groupItem"> + <label class="item-label">*Sort Order</label><br> + <input [(ngModel)]="menu.sortOrder" type="text" name="sortOrder" id="sortOrder"> + </div> + <div class="groupItem"> + <label class="item-label">*Action</label><br> + <input [(ngModel)]="menu.action" type="text" name="action" id="action"> + </div> + </div> + + <br> + + <div class="elementsContainer"> + <div class="groupItem"> + <label class="item-label"><b>*</b>Function:</label><br> + <select class="form-field" name="repeatSelect" id="repeatSelect" [(ngModel)]="menu.functionCd"> + <option>{{menu.functionCd}}</option> + <option *ngFor="let item of functionCDselectData" value="{{item}}" >{{item}}</option> + </select> + </div> + <div class="groupItem"> + <label class="item-label"><b>*</b>Active:</label><br> + <select class="form-field" name="selectActive" ng-model="menu.active"> + <option *ngFor="let active of activeStatusOptions" value="{{active.value}}">{{active.title}}</option> + </select> + </div> + <div class="groupItem"> + <label class="item-label">Servlet:</label><br> + <input [(ngModel)]="menu.servlet" type="text" name="servlet" id="servlet"> + </div> + <div class="groupItem"> + <label class="item-label">Query String:</label><br> + <input [(ngModel)]="menu.queryString" type="text" name="queryString" id="queryString"> + </div> + </div> + + <br> + + <div class="elementsContainer"> + <div class="groupItem"> + <label class="item-label">External URL:</label><br> + <input [(ngModel)]="menu.externalUrl" type="text" name="externalURL" id="externalURL"> + </div> + <div class="groupItem"> + <label class="item-label">Target:</label><br> + <input [(ngModel)]="menu.target" type="text" name="target" id="target"> + </div> + <div class="groupItem"> + <label class="item-label"><b>*</b>Menu Set Code:</label><br> + <input [(ngModel)]="menu.menuSetCode" type="text" name="menuSetCode" id="menuSetCode"> + </div> + <div class="groupItem"> + <label class="item-label"><b>*</b>Separator:</label><br> + <select class="form-field" name="select" ng-model="menu.separator"> + <option *ngFor="let separator of separatorStatusOptions" value="{{separator.value}}">{{separator.title}}</option> + </select> + </div> + </div> + + <br> + + <div class="elementsContainer"> + <div class="groupItem"> + <label class="item-label">Image Source:</label><br> + <input [(ngModel)]="menu.imageSrc" type="text" name="imageSource" id="imageSource"> + </div> + </div> + + </div> + <!--Modal Footer goes Here--> + <div class="modal-footer"> + <button type="button" class="btn btn-primary" (click)="updateFnMenu()">Save</button> + <button type="button" class="btn btn-primary" (click)="activeModal.close('Close')">Cancel</button> + </div> +</div> +
\ No newline at end of file diff --git a/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/new-menu/new-menu.component.scss b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/new-menu/new-menu.component.scss new file mode 100644 index 00000000..a8b5f966 --- /dev/null +++ b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/new-menu/new-menu.component.scss @@ -0,0 +1,71 @@ +/* + * ============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============================================ + * + * + */ + +::ng-deep .modal-dialog { + max-width: 1200px; + width: 883px; + overflow-x: auto; + overflow-y: auto; +} + +table { + width: 100%; +} + +body { + font-family: Roboto, Arial, sans-serif; + margin: 0; +} + +.elementsContainer{ + display: inline-flex; +} + +.groupItem{ + margin-right: 11px; + margin-bottom: 10px; +} + +.form-field{ + height: 30px; + width: 198px +} + +.item-label{ + margin-bottom: 1px; +} diff --git a/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/new-menu/new-menu.component.spec.ts b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/new-menu/new-menu.component.spec.ts new file mode 100644 index 00000000..650f09a6 --- /dev/null +++ b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/new-menu/new-menu.component.spec.ts @@ -0,0 +1,165 @@ +/* + * ============LICENSE_START========================================== + * ONAP Portal SDK + * =================================================================== + * Copyright © 2019 AT&T Intellectual Property. All rights reserved. + * =================================================================== + * + * * Modification Copyright © 2020 IBM. + * =================================================================== + + * 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 {FormsModule} from '@angular/forms'; +import { NewMenuComponent } from './new-menu.component'; +import { HttpClientTestingModule } from '@angular/common/http/testing'; +import { NgbActiveModal, NgbModalModule } from '@ng-bootstrap/ng-bootstrap'; +import { RouterTestingModule } from '@angular/router/testing'; +import { CookieService } from 'ngx-cookie-service'; +import { AdminService } from '../../admin.service'; +import 'rxjs/add/operator/toPromise'; +import { ConfirmationModalComponent } from 'src/app/modals/confirmation-modal/confirmation-modal.component'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import 'rxjs/add/observable/of'; +import { Observable } from 'rxjs/Observable'; +import 'rxjs/add/operator/catch'; +import 'rxjs/add/observable/throw'; +import { BrowserDynamicTestingModule } from '@angular/platform-browser-dynamic/testing'; + + +describe('NewMenuComponent', () => { + let component: NewMenuComponent; + let fixture: ComponentFixture<NewMenuComponent>; + let adminService:AdminService; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ NewMenuComponent,ConfirmationModalComponent ], + imports:[ + FormsModule, + HttpClientTestingModule, + RouterTestingModule, + NgbModalModule, + BrowserAnimationsModule + ], + providers:[ + AdminService, + NgbActiveModal, + CookieService + ], + }) + TestBed.overrideModule(BrowserDynamicTestingModule,{ + set:{ + entryComponents:[ConfirmationModalComponent ] + } + }) + .compileComponents(); + + })); + + beforeEach(() => { + fixture = TestBed.createComponent(NewMenuComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + adminService=TestBed.get(AdminService); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); + + it('testing ngOnInit method for if condition',()=>{ + component.selectedMenu=1; + component.ngOnInit(); + expect(component.menu).toEqual(component.selectedMenu); + }) + + it('testing ngOnInit method for else condition',()=>{ + component.selectedMenu=0; + component.ngOnInit(); + expect(component.menu.menuSetCode).toEqual('APP'); + }) + + it('testing sortItems method',()=>{ + let prop: any; + component.sortItems(prop); + + }) + + it('testing getParentLabel method',()=>{ + component.getParentLabel(1,"data"); + }) + + + it('should test getParentData method1 ',()=>{ + const children="children"; + let spy=spyOn(adminService,'getParentData').and.returnValue(Observable.of('you object')); + component.getParentData(); + expect(spy).toHaveBeenCalled(); + }) + + it('should test getParentData method2 error part ',()=>{ + const children="children"; + let spy=spyOn(adminService,'getParentData').and.returnValue(Observable.throw({status:404})); + component.getParentData(); + expect(spy).toHaveBeenCalled(); + }) + + describe('should test getLeftMenuItems',()=>{ + it('testing getLeftMenuItems',()=>{ + component.getLeftMenuItems(); + }) + }) + + it('testing getFunctionCDselectData method1',()=>{ + let spy=spyOn(adminService,'getFunctionCdList').and.returnValue(Observable.of('your object')); + component.getFunctionCDselectData(); + expect(spy).toHaveBeenCalled(); + expect(component.result).toEqual('your object'); + expect(component.functionCDselectData).toEqual('your object'); + }) + + describe('should test getFunctionCDselectData method2',()=>{ + it('testing getFunctionCDselectData',()=>{ + let spy= spyOn(adminService,'getFunctionCdList').and.returnValue(Observable.throw({status:404})) + component.getFunctionCDselectData(); + expect(spy).toHaveBeenCalled(); + expect(component.showSpinner).toEqual(false); + }) + }) + + it('should test updateFnMenu method',()=>{ + component.menu.label!=null; + component.updateFnMenu(); + }) + +}); diff --git a/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/new-menu/new-menu.component.ts b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/new-menu/new-menu.component.ts new file mode 100644 index 00000000..6e5b0c1a --- /dev/null +++ b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/admin/menus/new-menu/new-menu.component.ts @@ -0,0 +1,267 @@ +/* + * ============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, Input, Output, EventEmitter } from '@angular/core'; +import { NgbActiveModal, NgbModal } from '@ng-bootstrap/ng-bootstrap'; +import { AdminService } from '../../admin.service'; +import { SidebarComponent } from 'src/app/layout/components/sidebar/sidebar.component'; +import { Router } from '@angular/router'; +import { SidebarService } from 'src/app/shared/services'; +import { ConfirmationModalComponent } from 'src/app/modals/confirmation-modal/confirmation-modal.component'; +import { CookieService } from 'ngx-cookie-service'; + +@Component({ + selector: 'app-new-menu', + templateUrl: './new-menu.component.html', + styleUrls: ['./new-menu.component.scss'] +}) +export class NewMenuComponent implements OnInit { + + menu = { + action: null, + active: false, + activeAsString: "false", + auditTrail: null, + auditUserId: null, + childMenus: [], + created: null, + createdId: null, + externalUrl: null, + functionCd: null, + id: null, + imageSrc: null, + label: null, + menuLevel: null, + menuSetCode: null, + modified: null, + modifiedId: null, + parentId: null, + parentIdAsString: null, + parentMenu: null, + queryString: null, + rowNum: null, + separator: false, + separatorAsString: false, + servlet: null, + sortOrder: null, + target: null + } + showSpinner: boolean; + result: any; + //menu: any; + @Input() selectedMenu: any; + @Input() isEditMode: boolean; + @Output() passEntry: EventEmitter<any> = new EventEmitter(); + + statusOptions = [ + {index: 0, value: 'true', title: 'Y'}, + {index: 1, value: 'false', title: 'N'} + ]; + selectedValue = this.statusOptions[0]; + separator = { + availableOptions:[ + {value: 'true', name: 'Y'}, + {value: 'false', name: 'N'} + ], + selectedOption: {value: 'true', name: 'Y'} + } + + activeStatusOptions = [ + {index: 0, value: 'true', title: 'Y'}, + {index: 1, value: 'false', title: 'N'} + ]; + activeSelectedValue = this.activeStatusOptions[0]; + + separatorStatusOptions = [ + {index: 0, value: 'true', title: 'Y'}, + {index: 1, value: 'false', title: 'N'} + ]; + separatorSelectedValue = this.separatorStatusOptions[1]; + + active = { + availableOptions:[ + {value: 'true', name: 'Y'}, + {value: 'false', name: 'N'} + ], + selectedOption: {value: 'true', name: 'Y'} + }; + + functionCDselectData = []; + parentListSelectData = []; + childListSelectData = []; + + constructor(public adminService: AdminService, public activeModal: NgbActiveModal, + public ngmodel: NgbModal, public router: Router, public sidebarService: SidebarService,public cookieService:CookieService) { } + + ngOnInit() { + if(this.selectedMenu){ + this.menu = this.selectedMenu; + }else{ + this.menu.menuSetCode='APP'; + } + this.getFunctionCDselectData(); + this.getParentData(); + } + + getParentData(){ + this.showSpinner = true; + this.adminService.getParentData() + .subscribe( _data => { + this.result = _data; + if(_data){ + this.parentListSelectData= _data; // data from server + let menuItems = this.parentListSelectData; + var heirarchicalMenuItems = []; + var children = []; + for ( var i=0; i<menuItems.length; i++){ + for(var j=0; j<menuItems.length; j++){ + if(menuItems[j][2]==menuItems[i][0]) + children.push( + { + menuId: menuItems[j][0], + label: menuItems[j][1] + } + ); + } + if(children.length!=0){ + heirarchicalMenuItems.push( + { + menuId: menuItems[i][0], + label: menuItems[i][1], + children: children.sort(this.sortItems("label")) + } + + ); + } + children = []; + } + heirarchicalMenuItems.sort(this.sortItems("label")); + this.childListSelectData = heirarchicalMenuItems; + } + }, error => { + this.showSpinner = false; + console.log(error); + }); + } + + sortItems(prop){ + return function(a, b) { + if (a[prop] > b[prop]) { + return 1; + } else if (a[prop] < b[prop]) { + return -1; + } + return 0; + } + } + + getParentLabel(parentId, parentListSelectData){ + var element; + element = parentListSelectData[0]; + for (var i=0; i<parentListSelectData.length; i++){ + element = parentListSelectData[i]; + if (element[0] == parentId) + return element[1]; + else "---"; + } + } + + updateFnMenu(){ + this.showSpinner = true; + if( this.menu && this.menu.imageSrc == "" ) this.menu.imageSrc = "N/A"; + if( this.menu && this.menu.target == "" ) this.menu.target = "N/A"; + if( this.menu && this.menu.externalUrl == "" ) this.menu.externalUrl = "N/A"; + if( this.menu && this.menu.queryString == "" ) this.menu.queryString = "N/A"; + if( this.menu && this.menu.servlet == "" ) this.menu.servlet = "N/A"; + + let validationRule = /^\S{3,}$/; + let selectedFunction = this.menu.functionCd; + var selectedFunctionText = this.menu.functionCd; //selectedFunction.options[selectedFunction.selectedIndex].text; + + if((this.menu.label == null || this.menu.label == "" || (this.menu.label && this.menu.label.trim().length == 0) ) || + this.menu.parentId == null || this.menu.parentId == "" || this.menu.action == null || this.menu.action == "" || + selectedFunctionText == null || selectedFunctionText == "" || this.menu.sortOrder == null || this.menu.sortOrder == "" || + this.menu.menuSetCode == null ||this.menu.menuSetCode == ""){ + + this.openConfirmationModal('','Please provide all the mandatory (*) fields inputs !'); + return; + }else{ + this.menu.parentId=parseFloat(this.menu.parentId); + let data ={availableFnMenuItem: this.menu}; + let postData = JSON.stringify(data); + this.adminService.updateFnMenuItem(postData) + .subscribe( _data => { + this.result = _data; + this.passEntry.emit(this.result); + this.ngmodel.dismissAll(); + }, error => { + this.showSpinner = false; + console.log(error); + this.openConfirmationModal("Error",error); + }); + this.getLeftMenuItems(); + } + + } + + getLeftMenuItems(){ + let sidebarComponent = new SidebarComponent(this.router, this.sidebarService,this.cookieService); + sidebarComponent.ngOnInit(); + } + + getFunctionCDselectData = function(){ + this.adminService.getFunctionCdList() + .subscribe( _data => { + this.result = _data; + if(_data){ + this.functionCDselectData = _data; + } + }, error => { + this.showSpinner = false; + console.log(error); + this.openConfirmationModal("","Function Code Data not available !"); + }); + } + + openConfirmationModal(_title: string, _message: string) { + const modalInfoRef = this.ngmodel.open(ConfirmationModalComponent); + modalInfoRef.componentInstance.title = _title; + modalInfoRef.componentInstance.message = _message; + } + +} |