diff options
Diffstat (limited to 'ecomp-portal-FE-common/client/app/views/microservice-onboarding')
6 files changed, 963 insertions, 0 deletions
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 @@ +<!--
+ ================================================================================
+ 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.
+ ================================================================================
+ -->
+<div class="microservice-add-details-model">
+ <div id="microservice-add-details-title" class="title">microservice Details</div>
+
+ <div id="microservices" class="microservice-scrolling-table">
+ <div class="microservice-properties-main"
+ scroll-top="microserviceAddDetails.scrollApi">
+ <form id="microservices-details-form" name="serviceForm" novalidate
+ autocomplete="off">
+ <div class="item required">
+ <div class="item-label">microservice Name</div>
+ <input id="microservice-details-input-name" class="table-search-field"
+ type="text" name="name" ng-pattern="/^[\w -]*$/" maxlength="100"
+ ng-model="microserviceAddDetails.service.name"
+ ng-change="microserviceAddDetails.updateServiceName()"
+ ng-disabled="microserviceAddDetails.isEditMode" required />
+
+ <div class="error-container"
+ ng-show="(microserviceAddDetails.emptyServiceName || serviceForm.name.$dirty)">
+ <div ng-messages="serviceForm.name.$error" class="error-container">
+ <small id="microservices-details-input-name-required"
+ class="err-message" ng-message="required">Microservice
+ Name is required</small> <small
+ id="microservices-details-input-name-pattern"
+ class="err-message" ng-message="pattern">Microservice
+ Name must be letters, numbers, or underscore</small>
+ </div>
+ </div>
+
+ <div class="error-container"
+ ng-show="microserviceAddDetails.isEditMode == false && microserviceAddDetails.dupliateName == true">
+ <small id="microservices-details-input-name-dupliated"
+ class="err-message">Name not available - choose different
+ name </small>
+ </div>
+ </div>
+
+ <div class="item required">
+ <div class="item-label">microservice Description</div>
+ <textarea b2b-reset b2b-reset-textarea id="widgets-details-input-desc"
+ name="desc" ng-model="microserviceAddDetails.service.desc"
+ ng-change="microserviceAddDetails.updateDesc()"></textarea>
+ <div class="error-container"
+ ng-show="(microserviceAddDetails.emptyServiceDesc
+ || (serviceForm.desc.$dirty && microserviceAddDetails.service.desc == ''))">
+ <small id="microservices-details-input-desc-required"
+ class="err-message">Microservice Description is required</small>
+ </div>
+ </div>
+
+
+
+ <div class="item"
+ ng-show="microserviceAddDetails.isEditMode && microserviceAddDetails.availableWidgets.length > 0">
+ <div class="item-label">Client Widgets</div>
+ <div ng-repeat="widget in microserviceAddDetails.availableWidgets">{{widget.name}}</div>
+ </div>
+
+ <div class="item required">
+ <div class="item-label">Application Name</div>
+ <div class="service-select">
+ <div class="table-dropdown">
+ <select id="microservice-details-input-app" name="app" b2b-dropdown placeholder-text="Select Application" ng-model="microserviceAddDetails.service.application.name" ng-change="microserviceAddDetails.updateApp()">
+ <option b2b-dropdown-list option-repeat="d in microserviceAddDetails.availableApps" value="{{d.name}}">{{d.name}}</option>
+ </select>
+ </div>
+ </div>
+
+ <div class="error-container"
+ ng-show="(microserviceAddDetails.emptyServiceApp
+ || (serviceForm.app.$dirty && microserviceAddDetails.service.application == null))">
+ <small id="microservices-details-input-url-required"
+ class="err-message">Please select microservice
+ Application</small>
+ </div>
+ </div>
+
+ <div class="item required">
+ <div class="item-label">microservice Endpoint URL</div>
+ <input id="microservice-details-input-endpoint-url"
+ class="table-search-field" ng-model="microserviceAddDetails.service.url"
+ ng-change="microserviceAddDetails.updateURL()" type="text"
+ name="url" maxlength="200" />
+
+ <div class="error-container"
+ ng-show="(microserviceAddDetails.emptyServiceURL
+ || (serviceForm.url.$dirty && microserviceAddDetails.service.url == ''))">
+ <small id="microservices-details-input-url-required"
+ class="err-message">Microservice Endpoint URL is required</small>
+ </div>
+ </div>
+
+ <div class="item required">
+ <div class="item-label">Security Type</div>
+ <div class="service-select">
+ <div class="table-dropdown">
+ <select id="microservice-details-input-security-type" name="microservice-details-input-security-type" b2b-dropdown placeholder-text="Select Application" ng-model="microserviceAddDetails.service.security.name" ng-change="microserviceAddDetails.updateApp()">
+ <option b2b-dropdown-list option-repeat="d in microserviceAddDetails.availableSecurityTypes" value="{{d.name}}">{{d.name}}</option>
+ </select>
+ </div>
+ </div>
+ </div>
+
+ <div class="item"
+ ng-show="microserviceAddDetails.service.security.id == 1">
+ <div class="item-label">Username</div>
+ <input id="microservice-details-input-username" class="table-search-field"
+ type="text" name="username" maxlength="100"
+ ng-model="microserviceAddDetails.service.username" />
+ </div>
+
+ <div class="item"
+ ng-show="microserviceAddDetails.service.security.id == 1">
+ <div class="item-label">Password</div>
+ <input id="microservice-details-input-password" class="table-search-field"
+ type="password" name="password" maxlength="100"
+ ng-model="microserviceAddDetails.service.password" />
+ </div>
+
+
+ <div class="item" ng-show="microserviceAddDetails.isEditMode">
+ <div class="left-test-item">
+ <div class="item-label">Test Microservice</div>
+ </div>
+ <div class="right-test-item">
+ <div id="microservice-details-test-button" class="test-button"
+ ng-click="microserviceAddDetails.testServiceURL()">Test</div>
+ </div>
+ </div>
+
+ <div class="item" ng-show="microserviceAddDetails.isEditMode">
+ <div class="item-label">JSON output</div>
+ <textarea id="microservice-details-input-json" class="json-field"
+ name="json"></textarea>
+ </div>
+
+ <div class="add-para-item">
+ <div class="item-label add-label-left">Add User Parameter</div>
+ <div class="icon-primary-accordion-plus"
+ ng-click="microserviceAddDetails.addParameter()"></div>
+ </div>
+ <div class="item">
+ <div class="para-label-item-left"
+ ng-show="microserviceAddDetails.service.parameterList.length > 0">
+ Parameter Key</div>
+ <div class="para-label-item-right"
+ ng-show="microserviceAddDetails.service.parameterList.length > 0">
+ Parameter Default Value</div>
+
+ <div id="microservice-details-user-paramters"
+ ng-repeat="parameter in microserviceAddDetails.service.parameterList">
+
+ <div class="para-item-left">
+ <input id="microservice-details-input-user-parameter-key"
+ class="table-search-field" type="text" name="param-key" maxlength="200"
+ ng-model="parameter.para_key" />
+ </div>
+ <div class="para-item-middle">
+ <input id="microservice-details-input-user-parameter-value"
+ class="table-search-field" type="text" name="param-value"
+ maxlength="200" ng-model="parameter.para_value" />
+ </div>
+
+ <div class="icon-primary-accordion-minus para-item-right"
+ ng-click="microserviceAddDetails.removeParamItem(parameter)"></div>
+ </div>
+
+ <div class="microservice-property">
+ <input id="microservices-checkbox-app-is-enabled" type="checkbox"
+ class="checkbox-field"
+ ng-model="microserviceAddDetails.service.active" />
+ <div class="property-label checkbox-label">Active</div>
+ </div>
+
+ </div>
+
+ <div id="microservice-scroll-end"></div>
+ <div class="dialog-control">
+ <button class="btn btn-alt btn-small" id="microservice-details-save-button" ng-click="microserviceAddDetails.saveChanges()">Save</button>
+ <button class="btn btn-alt btn-small" id="microservice-details-close-button" ng-click="microserviceAddDetails.closeThisDialog()">Close</button>
+ </div>
+ </form>
+ </div>
+
+
+ </div>
+</div>
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 diff --git a/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.controller.js b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.controller.js new file mode 100644 index 00000000..6e711b75 --- /dev/null +++ b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.controller.js @@ -0,0 +1,87 @@ +'use strict'; +(function () { + class MicroserviceOnboardingCtrl { + constructor($log, applicationsService, microserviceService, ngDialog, confirmBoxService, + userProfileService, $cookies, $scope) { + + + let getOnboardingServices = () => { + microserviceService.getServiceList().then(res => { + $scope.serviceList = res; + }).catch(err => { + $log.error('MicroserviceOnboardingCtrl::getOnboardingServices caught error', err); + }); + }; + + + + let init = () => { + $scope.serviceList = []; + getOnboardingServices(); + this.serviceTableHeaders = [ + {name: 'Microservice Name', value: 'name', isSortable: false}, + {name: 'Service Endpoint URL', value: 'url', isSortable: false}, + {name: 'Security Type', value: 'securityType', isSortable: false} + ]; + }; + + this.openAddNewMicroserviceModal = (selectedService) => { + let data = null; + if(selectedService){ + if(!selectedService.id){ + $log.error('MicroserviceOnboardingCtrl:openAddNewMicroserviceModal:service id not found'); + return; + } + data = { + service:selectedService, + list: $scope.serviceList + } + }else{ + data = { + list: $scope.serviceList + } + } + + ngDialog.open({ + templateUrl: 'app/views/microservice-onboarding/microservice-add-details/microservice-add-details.html', + controller: 'MicroserviceAddDetailsCtrl', + controllerAs: 'microserviceAddDetails', + data: data + }).closePromise.then(needUpdate => { + if(needUpdate.value === true){ + getOnboardingServices(); + } + }); + }; + + this.deleteService = service => { + confirmBoxService.deleteItem(service.name).then(isConfirmed => { + if(isConfirmed){ + if(!service || !service.id){ + $log.error('MicroserviceOnboardingCtrl::deleteService: No service or ID... cannot delete'); + return; + } + microserviceService.deleteService(service.id).then((res) => { + if(res.status == "WARN"){ + confirmBoxService.showInformation("Failed: widgets " + res.response + " are assoicated with this microservice!"); + }else{ + $scope.serviceList.splice($scope.serviceList.indexOf(service), 1); + } + }).catch(err => { + $log.error('MicroserviceOnboardingCtrl::deleteService error:',err); + }); + } + }).catch(err => { + $log.error('MicroserviceOnboardingCtrl::deleteService error:',err); + }); + + + }; + + init(); + } + } + MicroserviceOnboardingCtrl.$inject = ['$log', 'applicationsService', 'microserviceService', 'ngDialog', 'confirmBoxService', + 'userProfileService','$cookies', '$scope']; + angular.module('ecompApp').controller('MicroserviceOnboardingCtrl', MicroserviceOnboardingCtrl); +})();
\ No newline at end of file diff --git a/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.less b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.less new file mode 100644 index 00000000..7565b432 --- /dev/null +++ b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.less @@ -0,0 +1,26 @@ +.microservice-onboarding{ + //.bg_portalWhite;//white for 1702 + .bg_portalGray; // gray for 1610 + position: @page-main-position; + top: @page-main-top; + left: @page-main-left; + right: @page-main-right; + bottom: @page-main-bottom; + padding-top: @padding-top; + overflow-y: @page-main-overflow-y; + padding-left: @padding-left-side; + + .microservices-table { + width: @table-width; + margin: 0 auto; + + .add-button{ + width: 180px; + } + } + + .delete-microservice{ + .ico_trash_default; + } + +}
\ No newline at end of file diff --git a/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.tpl.html b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.tpl.html new file mode 100644 index 00000000..e3b3128a --- /dev/null +++ b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.tpl.html @@ -0,0 +1,75 @@ +<!--
+ ================================================================================
+ 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.
+ ================================================================================
+ -->
+<div class="w-ecomp-main">
+ <div class="w-ecomp-main-container">
+ <div class="microservice-onboarding" id="page-content">
+ <div id="microservice-onboarding-title"
+ class="w-ecomp-main-view-title">Microservice Onboarding</div>
+ <div class="microservices-table">
+ <div class="table-control">
+ <div class="table-control-buttons">
+ <button class="btn btn-alt btn-small" id="microservice-onboarding-button-add" ng-click="microserviceOnboarding.openAddNewMicroserviceModal()">
+ <i class="icon-people-userbookmark" aria-hidden="true"></i> Add Microservice
+ </button>
+ </div>
+ <div>
+ <div class="c-ecomp-b2b-abs-table default">
+ <table b2b-table table-data="serviceList"
+ search-string="microserviceOnboarding.searchString"
+ view-per-page="microserviceOnboarding.viewPerPageIgnored"
+ current-page="microserviceOnboarding.currentPageIgnored"
+ total-page="microserviceOnboarding.totalPageIgnored">
+ <thead b2b-table-row type="header">
+ <tr>
+ <th id="microservice-catalog-th-header-name"
+ ng-repeat="header in microserviceOnboarding.serviceTableHeaders"
+ b2b-table-header key="{{header.value}}"
+ sortable="{{header.isSortable}}">{{header.name}}</th>
+ <th id="microservices-catalog-th-header-delete"
+ b2b-table-header sortable="false">Delete</th>
+ </tr>
+ </thead>
+ <tbody b2b-table-row type="body" class="table-body"
+ row-repeat="rowData in serviceList">
+
+ <tr>
+ <td b2b-table-body
+ ng-repeat="header in microserviceOnboarding.serviceTableHeaders"
+ ng-click="microserviceOnboarding.openAddNewMicroserviceModal(rowData)">
+ <div
+ id="microservices-catalog-microservice-name-{{rowData.id}}"
+ ng-bind="rowData[header.value]"></div>
+ </td>
+
+ <td b2b-table-body>
+ <div id="microservice-onboarding-div-delete-{{$index}}"
+ class="icon-misc-trash"
+ ng-click="microserviceOnboarding.deleteService(rowData)"></div>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
|