From b54df0ddd0c6a0372327c5aa3668e5a6458fcd64 Mon Sep 17 00:00:00 2001 From: st782s Date: Thu, 4 May 2017 07:48:42 -0400 Subject: [PORTAL-7] Rebase This rebasing includes common libraries and common overlays projects abstraction of components Change-Id: I9a24a338665c7cd058978e8636bc412d9e2fdce8 Signed-off-by: st782s --- .../microservice-add-details.html | 205 +++++++++++++ .../microservice-add-details.js | 336 +++++++++++++++++++++ .../microservice-add-details.less | 234 ++++++++++++++ 3 files changed, 775 insertions(+) create mode 100644 ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.html create mode 100644 ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.js create mode 100644 ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.less (limited to 'ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details') diff --git a/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.html b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.html new file mode 100644 index 00000000..a8b20739 --- /dev/null +++ b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.html @@ -0,0 +1,205 @@ + +
+
microservice Details
+ +
+
+
+
+
microservice Name
+ + +
+
+ Microservice + Name is required Microservice + Name must be letters, numbers, or underscore +
+
+ +
+ Name not available - choose different + name +
+
+ +
+
microservice Description
+ +
+ Microservice Description is required +
+
+ + + +
+
Client Widgets
+
{{widget.name}}
+
+ +
+
Application Name
+
+
+ +
+
+ +
+ Please select microservice + Application +
+
+ +
+
microservice Endpoint URL
+ + +
+ Microservice Endpoint URL is required +
+
+ +
+
Security Type
+
+
+ +
+
+
+ +
+
Username
+ +
+ +
+
Password
+ +
+ + +
+
+
Test Microservice
+
+
+
Test
+
+
+ +
+
JSON output
+ +
+ +
+
Add User Parameter
+
+
+
+
+ Parameter Key
+
+ Parameter Default Value
+ +
+ +
+ +
+
+ +
+ +
+
+ +
+ +
Active
+
+ +
+ +
+
+ + +
+
+
+ + +
+
diff --git a/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.js b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.js new file mode 100644 index 00000000..f6123349 --- /dev/null +++ b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.js @@ -0,0 +1,336 @@ +/*- + * ================================================================================ + * ECOMP Portal + * ================================================================================ + * Copyright (C) 2017 AT&T Intellectual Property + * ================================================================================ + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file 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. + * ================================================================================ + */ +'use strict'; +(function () { + class MicroserviceAddDetailsCtrl { + constructor($scope, $log, $interval, widgetsCatalogService, applicationsService, adminsService, microserviceService, errorMessageByCode, ECOMP_URL_REGEX, $window,userProfileService, confirmBoxService, $cookies) { + + + let getAvailableApps = () => { + applicationsService.getAppsForSuperAdminAndAccountAdmin().then(apps => { + this.availableApps=[]; + apps.unshift({ + id: 1, + name: "ECOMP Portal" + }); + for(var i = 0; i < apps.length; i++) { + this.availableApps.push({ + id: apps[i].id, + name: apps[i].name + }); + if(this.isEditMode == true && this.service.appId == apps[i].id){ + this.service.application = this.availableApps[i]; + } + } + }).catch(err => { + $log.error(err); + }); + }; + + let getAvailableWidgets = () => { + microserviceService.getWidgetListByService(this.service.id).then(widgets =>{ + this.availableWidgets = []; + for(var i = 0; i < widgets.length; i++){ + this.availableWidgets.push({ + name: widgets[i] + }) + } + }).catch(err => { + $log.error(err); + }); + }; + + + let getAvailableSecurityTypes = () => { + this.availableSecurityTypes = []; + this.availableSecurityTypes.push({ + id: 0, + name: 'No Authentication' + }); + this.availableSecurityTypes.push({ + id: 1, + name: 'Basic Authentication' + }); + this.availableSecurityTypes.push({ + id: 2, + name: 'Cookie based Authentication' + }); + } + + let init = () => { + $log.info('MicroserviceAddDetailsCtrl::init'); + this.service = []; + this.service.parameterList = []; + this.service.active = true; + this.emptyServiceName = false; + this.emptyServiceDesc = false; + this.emptyServiceURL = false; + this.emptyServiceApp = false; + this.dupliateName = false; + this.serviceList = $scope.ngDialogData.list; + + if ($scope.ngDialogData && $scope.ngDialogData.service) { + + this.isEditMode = true; + this.service = _.clone($scope.ngDialogData.service); + + console.log(this.service); + if(this.service.active == 'Y') + this.service.active = true; + else + this.service.active = false; + } else { + this.isEditMode = false; + } + getAvailableApps(); + getAvailableSecurityTypes(); + //getAvailableWidgets(); + + /** + * 0: Basic Authentication + * + * TODO: change the structure + */ + if(this.service.securityType == "No Authentication"){ + this.service.security = this.availableSecurityTypes[0]; + }else if(this.service.securityType == "Basic Authentication"){ + this.service.security = this.availableSecurityTypes[1]; + }else if(this.service.securityType == "Cookie based Authentication"){ + this.service.security = this.availableSecurityTypes[2]; + } + }; + + this.ECOMP_URL_REGEX = ECOMP_URL_REGEX; + this.conflictMessages = {}; + this.scrollApi = {}; + + let resetConflict = fieldName => { + delete this.conflictMessages[fieldName]; + if($scope.widgetForm[fieldName]){ + $scope.widgetForm[fieldName].$setValidity('conflict', true); + } + }; + + this.addParameter = () => { + document.getElementById('microservice-scroll-end').scrollIntoView(); + this.service.parameterList.push({}); + } + + this.closeThisDialog = () => { + $scope.closeThisDialog(true); + } + + this.removeParamItem = (parameter) => { + microserviceService.getUserParameterById(parameter.id).then((res) => { + if(res.length > 0){ + var message = res.length + " users have their own widget parameters. Are you sure you want to delete?"; + confirmBoxService.editItem(message).then(isConfirmed => { + if(isConfirmed){ + microserviceService.deleteUserParameterById(parameter.id).then((res) => { + for(var i = 0; i < this.service.parameterList.length; i++){ + if(this.service.parameterList[i].para_key == parameter.para_key + && this.service.parameterList[i].para_value == parameter.para_value){ + this.service.parameterList.splice(i, 1); + return; + } + } + }); + } + }); + } + else{ + for(var i = 0; i < this.service.parameterList.length; i++){ + if(this.service.parameterList[i].para_key == parameter.para_key + && this.service.parameterList[i].para_value == parameter.para_value){ + this.service.parameterList.splice(i, 1); + return; + } + } + } + }); + + + } + + this.updateServiceName = () => { + this.dupliateName = false; + for(var i = 0; i < this.serviceList.length; i++){ + if(this.serviceList[i].name == this.service.name){ + this.dupliateName = true; + return; + } + } + } + + this.updateDesc = () => { + this.emptyServiceDesc = false; + } + + this.updateURL = () => { + this.emptyServiceURL = false; + } + + this.updateApp = () => { + this.emptyServiceApp = false; + } + + //This is a fix for dropdown selection, due to b2b dropdown only update value field + $scope.$watch('microserviceAddDetails.service.application.name', (newVal, oldVal) => { + for(var i=0;i<$scope.microserviceAddDetails.availableApps.length;i++){ + if($scope.microserviceAddDetails.availableApps[i].name==newVal){ + $scope.microserviceAddDetails.service.application=angular.copy($scope.microserviceAddDetails.availableApps[i]); + } + } + }); + $scope.$watch('microserviceAddDetails.service.security.name', (newVal, oldVal) => { + for(var i=0;i<$scope.microserviceAddDetails.availableSecurityTypes.length;i++){ + if($scope.microserviceAddDetails.availableSecurityTypes[i].name==newVal){ + $scope.microserviceAddDetails.service.security=angular.copy($scope.microserviceAddDetails.availableSecurityTypes[i]); + } + } + }); + + let emptyCookies = () => { + userProfileService.getUserProfile() + .then(profile=> { + $log.info('AppDetailsModalCtrl::emptyCookies profile: ', profile); + $scope.attuid = profile.attuid; + $log.info('user has the following attuid: ' + profile.attuid); + if ($cookies.getObject($scope.attuid + '_widget') != undefined && $cookies.getObject($scope.attuid + '_widget') != null) { + $cookies.remove($scope.attuid + '_widget'); + } + }); + }; + + this.testServiceURL = () =>{ + //console.log(this.service.id); + widgetsCatalogService.getServiceJSON(this.service.id).then(res => { + document.getElementById("microservice-details-input-json").innerHTML = (JSON.stringify(res)); + }); + } + + this.saveChanges = () => { + /* TODO: add form validation */ + + var isValid = true; + this.updateServiceName(); + + if(this.service.name == '' + || this.service.name == undefined){ + this.emptyServiceName = true; + isValid = false; + } + + if(this.dupliateName == true + && this.isEditMode == false){ + isValid = false; + } + + + if(this.service.desc == '' + || this.service.desc == undefined){ + this.emptyServiceDesc = true; + isValid = false; + } + + if(this.service.url == '' + || this.service.url == undefined){ + this.emptyServiceURL = true; + isValid = false; + } + + if(this.service.application == undefined + || this.service.application == null){ + this.emptyServiceApp = true; + isValid = false; + } + + if(!isValid) + return; + + /* + * Check the parameter list, delete those parameters that don't + * have key + */ + for(var i = 0; i < this.service.parameterList.length; i++){ + if(this.service.parameterList[i].para_key == undefined + || this.service.parameterList[i].para_key == null + || this.service.parameterList[i].para_key == ""){ + this.service.parameterList.splice(i, 1); + i--; + } + } + + var securityType; + var username; + var password; + if(this.service.security == undefined || + this.service.security == null) + securityType = "No Authentication"; + else{ + securityType = this.service.security.name; + username = this.service.username; + password = this.service.password; + } + + var active = 'N'; + if(this.service.active == true) + active = 'Y'; + + var newService = { + name: this.service.name, + desc: this.service.desc, + appId: this.service.application.id, + url: this.service.url, + securityType: securityType, + username: username, + password: password, + active: active, + parameterList: this.service.parameterList + }; + + if(this.isEditMode){ + // console.log(this.service.parameterList); + var message = "Are you sure you want to change '" + this.service.name + "'?" + confirmBoxService.editItem(message).then(isConfirmed => { + if(isConfirmed){ + microserviceService.updateService(this.service.id, newService).then(() => { + // TODO: result validation check + this.closeThisDialog(); + }); + } + }); + }else{ + microserviceService.createService(newService).then(() => { + // TODO: result validation check + $scope.closeThisDialog(true); + }); + } + + }; + init(); + $scope.$on('$stateChangeStart', e => { + e.preventDefault(); + }); + } + } + MicroserviceAddDetailsCtrl.$inject = ['$scope', '$log', '$interval', 'widgetsCatalogService', 'applicationsService', 'adminsService', 'microserviceService', 'errorMessageByCode', 'ECOMP_URL_REGEX', '$window','userProfileService', 'confirmBoxService', '$cookies']; + angular.module('ecompApp').controller('MicroserviceAddDetailsCtrl', MicroserviceAddDetailsCtrl); +})(); diff --git a/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.less b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.less new file mode 100644 index 00000000..fa607fee --- /dev/null +++ b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.less @@ -0,0 +1,234 @@ +.microservice-add-details-model{ + height: 550px; + overflow-y: auto; + .title { + .dGray18r; //AT&T Dark Gray + border-bottom: @blue-active 3px solid; + } + .microservice-details-title { + color: #191919; + font-family: "Omnes-ECOMP-W02", Arial;; + font-size: 24px; + padding-bottom: 15px; + padding-top:30px; + margin-left: 25px; + } + .microservice-properties-main { + padding-top: 20px; + padding-left: 20px; + padding-right: 20px; + margin-bottom: 50px; + + height: 100%; + width:100%; + + .microservice-property{ + margin-top: 10px; + position: relative; + .property-label{ + .dGray14r; + } + .checkbox-label{ + display: inline-block; + padding-left: 3px; + } + .checkbox-field{ + padding: 0; + margin: 0; + vertical-align: middle; + position: relative; + top: -1px; + } + } + .add-para-item{ + position: relative; + .add-label-left{ + line-height: 25px; + height: 30px; + vertical-align: middle; + display:inline-block; + + margin-right: 10px; + background: @portalWhite; + .dGray14r; + } + .add-label-right{ + height: 14px; + width: 14px; + display:inline-block; + } + } + .item{ + position: relative; + margin-bottom: 15px; + width:400px; + .service-select{ + select{ + cursor: pointer; + position: relative; + border: 1px solid #5a5a5a; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + line-height: 15px; + height: 32px; + padding-left: 10px; + padding-right: 10px; + border-radius: 0px; + } + display:inline-block; + width: 100%; + } + .error-container{ + position: absolute; + width: 280px; + display: block; + height: 12px; + line-height: 12px; + + .err-message{ + color: @funcRed; + font-size: 9px; + } + .valid-message{ + color: @funcGreen; + font-size: 9px; + } + } + .auth-item-left{ + padding-top: 0; + line-height: 30px; + height: 30px; + vertical-align: middle; + display:inline-block; + width: 15%; + //border-radius: 2px; + //border: 1px solid @portalLGray; + margin-right: 10px; + background: @portalWhite; + white-space: nowrap; + .dGray14r; + } + .auth-item-right{ + display:inline-block; + width: 45%; + border-radius: 2px; + border: 1px solid @portalLGray; + background: @portalWhite; + vertical-align: middle; + } + .para-label-item-left{ + line-height: 30px; + height: 30px; + vertical-align: middle; + display:inline-block; + width: 45%; + margin-right: 10px; + background: @portalWhite; + white-space: nowrap; + .dGray14r; + } + .para-label-item-right{ + line-height: 30px; + height: 30px; + display:inline-block; + width: 45%; + background: @portalWhite; + vertical-align: middle; + white-space: nowrap; + .dGray14r; + } + .para-item-left{ + line-height: 30px; + height: 36px; + margin:3px; + vertical-align: middle; + display:inline-block; + width: 43%; + border-radius: 2px; + border: 1px solid @portalLGray; + margin-right: 10px; + background: @portalWhite; + white-space: nowrap; + .dGray14r; + } + .para-item-middle{ + line-height: 30px; + height: 36px; + margin:3px; + display:inline-block; + width: 43%; + border-radius: 2px; + border: 1px solid @portalLGray; + background: @portalWhite; + vertical-align: middle; + white-space: nowrap; + .dGray14r; + } + .json-field{ + position: relative; + .custom-input-field; + height:80px; + } + .left-test-item{ + display: inline-block; + width: 85%; + background: @portalWhite; + } + + .right-test-item{ + position: relative; + display: inline-block; + width: 15%; + float: right; + } + + .test-button { + .btn-blue; + } + .para-item-right{ + margin-top: 10px; + height: 14px; + width: 14px; + float: right; + display:inline-block; + } + .input-field{ + .custom-input-field; + width: 100%; + } + .textarea-field{ + position: relative; + .custom-input-field; + height:50px; + } + .submit-button { + margin-top: 25px; + position: relative; + float: right; + width: 20%; + .btn-blue; + } + + + + .add-para-button{ + height: 14px; + width: 14px; + float: right; + } + .item-label{ + .dGray14r; + } + } + } +} +.microservice-scrolling-table{ + width: 548px; + margin-left: 16px; + height: 430px; + overflow: auto; +} +#microservice-scroll-end{ + height: 20px; +} \ No newline at end of file -- cgit 1.2.3-korg