summaryrefslogtreecommitdiffstats
path: root/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details
diff options
context:
space:
mode:
authorst782s <statta@research.att.com>2017-05-04 07:48:42 -0400
committerst782s <statta@research.att.com>2017-05-04 12:28:17 -0400
commitb54df0ddd0c6a0372327c5aa3668e5a6458fcd64 (patch)
treee69cfa9b314a801bd187cf0145d1d4306436229c /ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details
parent39d1e62c84041831bfc52cca73b5ed5efaf57d27 (diff)
[PORTAL-7] Rebase
This rebasing includes common libraries and common overlays projects abstraction of components Change-Id: I9a24a338665c7cd058978e8636bc412d9e2fdce8 Signed-off-by: st782s <statta@research.att.com>
Diffstat (limited to 'ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details')
-rw-r--r--ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.html125
-rw-r--r--ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.js171
-rw-r--r--ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.less195
3 files changed, 491 insertions, 0 deletions
diff --git a/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.html b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.html
new file mode 100644
index 00000000..91027f9e
--- /dev/null
+++ b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.html
@@ -0,0 +1,125 @@
+<div class="account-add-details-modal">
+ <div id="account-add-details-title" class="account-details-title">Account
+ Details</div>
+
+ <div id="accounts">
+ <div class="account-properties-main"
+ scroll-top="accountAddDetails.scrollApi">
+ <form id="accounts-details-form" name="serviceForm" novalidate
+ autocomplete="off">
+ <div class="item required">
+ <div class="item-label">Account Name</div>
+ <input id="account-details-input-name"
+ type="text" name="name" ng-pattern="/^[\w -]*$/" maxlength="100"
+ ng-model="accountAddDetails.account.applicationName"
+ ng-change="accountAddDetails.updateAccountName()" required />
+
+ <div class="error-container"
+ ng-show="(accountAddDetails.emptyAccountName || serviceForm.name.$dirty)">
+ <div ng-messages="serviceForm.name.$error" class="error-container">
+ <small id="accounts-details-input-name-required"
+ class="err-message" ng-message="required">account Name
+ is required</small> <small id="accounts-details-input-name-pattern"
+ class="err-message" ng-message="pattern">account Name
+ must be letters, numbers, or underscore</small>
+ </div>
+ </div>
+
+ <div class="error-container"
+ ng-show="accountAddDetails.dupliateName == true">
+ <small id="accounts-details-input-name-dupliated"
+ class="err-message">Name not available - choose different
+ name </small>
+ </div>
+ </div>
+
+ <div class="item required">
+ <div class="item-label">Username</div>
+ <input id="account-details-input-username"
+ type="text" name="username" maxlength="100"
+ ng-model="accountAddDetails.account.username"
+ ng-change="accountAddDetails.updateUsername()" />
+
+ <div class="error-container"
+ ng-show="(accountAddDetails.emptyAccountUsername
+ || (serviceForm.username.$dirty && accountAddDetails.account.username == ''))">
+ <small id="account-details-input-username-required"
+ class="err-message">Username is required</small>
+ </div>
+
+ </div>
+
+ <div class="item">
+ <div class="item-label">Password</div>
+ <input id="account-details-input-password"
+ type="password" name="password" maxlength="100"
+ ng-model="accountAddDetails.account.password" />
+ </div>
+
+ <div class="item">
+ <div class="item-label">Retype Password</div>
+ <input id="account-details-input-repassword"
+ type="password" name="repassword" maxlength="100"
+ ng-model="accountAddDetails.account.repassword"
+ ng-change="accountAddDetails.confirmPassword()" />
+
+ <div class="error-container"
+ ng-show="accountAddDetails.passwordMatched == false">
+ <small id="accounts-details-input-name-dupliated"
+ class="err-message">Password does not match the confirm
+ password</small>
+ </div>
+ </div>
+
+
+ <div class="add-endpoint-item">
+ <div class="item-label add-label-left">Add Endpoint</div>
+ <div class="icon-add add-label-right"
+ ng-click="accountAddDetails.addEndpoint()"></div>
+ </div>
+ <div class="item">
+ <div class="item-label"
+ ng-show="accountAddDetails.account.endpointList.length > 0">
+ Account endpoint</div>
+
+ <div id="account-details-user-paramters"
+ ng-repeat="endpoint in accountAddDetails.account.endpointList">
+
+ <div class="endpoint-item-left">
+ <input id="account-details-input-endpoint-name"
+ type="text" name="endpointName"
+ maxlength="200" ng-model="endpoint.name"
+ ng-change="accountAddDetails.updateAccountEndpoint(endpoint)"/>
+ </div>
+
+ <div class="icon-circle-action-remove endpoint-item-middle"
+ ng-click="accountAddDetails.removeEndpointItem(endpoint)"></div>
+
+ <div class="error-container endpoint-item-right"
+ ng-show="endpoint.valid == false">
+ <small id="accounts-details-input-invalid-endpoint"
+ class="err-message">Invalid end point format</small>
+ </div>
+
+ </div>
+
+ <div class="account-property">
+ <input id="accounts-checkbox-app-is-enabled" type="checkbox"
+ class="checkbox-field"
+ ng-model="accountAddDetails.account.active" />
+ <div class="property-label checkbox-label">Active</div>
+ </div>
+ <div class="item">
+ <div id="account-details-next-button" class="submit-button"
+ ng-click="accountAddDetails.closeThisDialog()">close</div>
+ <div id="account-details-next-button" class="submit-button"
+ ng-click="accountAddDetails.saveChanges()">Save</div>
+ </div>
+ </div>
+
+ </form>
+ </div>
+
+
+ </div>
+</div>
diff --git a/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.js b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.js
new file mode 100644
index 00000000..ff89dce3
--- /dev/null
+++ b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.js
@@ -0,0 +1,171 @@
+'use strict';
+(function () {
+ class AccountAddDetailsCtrl {
+ constructor($scope, $log, $interval, basicAuthAccountSerivce, errorMessageByCode, ECOMP_URL_REGEX, $window, confirmBoxService, $cookies) {
+
+
+ this.addEndpoint = () => {
+ this.account.endpointList.push({
+ valid: true
+ });
+ }
+
+ let init = () => {
+ this.account = [];
+ this.account.endpointList = [];
+ this.passwordMatched = true;
+ this.dupliateName = false;
+ this.emptyAccountName = false;
+ this.emptyAccountUsername = false;
+ this.accountList = $scope.ngDialogData.list;
+
+ if ($scope.ngDialogData && $scope.ngDialogData.account) {
+ this.isEditMode = true;
+ this.account = _.clone($scope.ngDialogData.account);
+ this.account.repassword = this.account.password;
+ this.account.endpointList = this.account.endpoints;
+ if(this.account.isActive == 'Y')
+ this.account.active = true;
+ else
+ this.account.active = false;
+ } else {
+ this.isEditMode = false;
+ this.account.active = true;
+ }
+ console.log(this.account);
+ };
+
+ let resetConflict = fieldName => {
+ delete this.conflictMessages[fieldName];
+ if($scope.widgetForm[fieldName]){
+ $scope.widgetForm[fieldName].$setValidity('conflict', true);
+ }
+ };
+
+
+ this.closeThisDialog = () => {
+ $scope.closeThisDialog(true);
+ }
+
+ this.removeEndpointItem = (endpoint) => {
+ for(var i = 0; i < this.account.endpointList.length; i++){
+ if(this.account.endpointList[i].name == endpoint.name){
+ this.account.endpointList.splice(i, 1);
+ return;
+ }
+ }
+ }
+
+ this.confirmPassword = () => {
+ this.passwordMatched = true;
+ }
+
+ this.updateUsername = () => {
+ this.emptyAccountUsername = false;
+ }
+
+ this.updateAccountName = () => {
+ this.dupliateName = false;
+ for(var i = 0; i < this.accountList.length; i++){
+ if(this.accountList[i].applicationName == this.account.applicationName){
+ this.dupliateName = true;
+ return;
+ }
+ }
+ }
+
+ this.updateAccountEndpoint = (endpoint) => {
+ endpoint.valid = true;
+ }
+
+ this.saveChanges = () => {
+
+ var isValid = true;
+ var r = /\/[^ "]+$/;
+
+ for(var i = 0; i < this.account.endpointList.length; i++){
+ if(this.account.endpointList[i].name == undefined
+ || this.account.endpointList[i].name == null
+ || this.account.endpointList[i].name == ""){
+ this.account.endpointList.splice(i, 1);
+ i--;
+ }else{
+ if(!this.account.endpointList[i].name.startsWith("/")){
+ this.account.endpointList[i].name = "/" + this.account.endpointList[i].name;
+ }
+ if(!r.test(this.account.endpointList[i].name)){
+ this.account.endpointList[i].valid = false;
+ isValid = false;
+ }
+
+ }
+ }
+
+ if(this.account.applicationName == ''
+ || this.account.applicationName == undefined){
+ this.emptyAccountName = true;
+ isValid = false;
+ }
+
+ if(this.account.username == ''
+ || this.account.username == undefined){
+ this.emptyAccountUsername = true;
+ isValid = false;
+ }
+
+ if(this.dupliateName == true){
+ isValid = false;
+ }
+
+ if(this.account.password != this.account.repassword){
+ this.passwordMatched = false;
+ isValid = false;
+ }
+
+ if(!isValid)
+ return;
+
+
+
+ var active = 'N';
+ if(this.account.active == true)
+ active = 'Y';
+
+ var newAccount = {
+ applicationName: this.account.applicationName,
+ username: this.account.username,
+ password: this.account.password,
+ endpoints: this.account.endpointList,
+ isActive: active
+ };
+
+
+ if(this.isEditMode){
+ var message = "Are you sure you want to change '" + this.account.applicationName + "'?"
+ confirmBoxService.editItem(message).then(isConfirmed => {
+ if(isConfirmed){
+ basicAuthAccountSerivce.updateAccount(this.account.id, newAccount).then(() => {
+ $scope.closeThisDialog(true);
+ });
+ }
+ });
+ }else{
+ basicAuthAccountSerivce.createAccount(newAccount).then(() => {
+ $scope.closeThisDialog(true);
+ });
+ }
+
+
+
+ }
+
+
+ init();
+ $scope.$on('$stateChangeStart', e => {
+ e.preventDefault();
+ });
+ }
+ }
+ AccountAddDetailsCtrl.$inject = ['$scope', '$log', '$interval', 'basicAuthAccountSerivce', 'errorMessageByCode', 'ECOMP_URL_REGEX', '$window', 'confirmBoxService', '$cookies'];
+ angular.module('ecompApp').controller('AccountAddDetailsCtrl', AccountAddDetailsCtrl);
+})(); \ No newline at end of file
diff --git a/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.less b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.less
new file mode 100644
index 00000000..6a916d6c
--- /dev/null
+++ b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.less
@@ -0,0 +1,195 @@
+.account-add-details-modal{
+ height: 550px;
+
+ overflow-y: auto;
+
+ .account-details-title {
+ color: #191919;
+ font-family: "Omnes-ECOMP-W02", Arial;;
+ font-size: 24px;
+ padding-bottom: 15px;
+ padding-top:30px;
+ margin-left: 25px;
+ }
+ .account-properties-main {
+ padding-top: 20px;
+ padding-left: 20px;
+ padding-right: 20px;
+ margin-bottom: 50px;
+
+ height: 100%;
+ width:100%;
+
+ .account-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-endpoint-item{
+ position: relative;
+ .add-label-left{
+ line-height: 25px;
+ height: 30px;
+ vertical-align: middle;
+ display:inline-block;
+ margin-right: 10px;
+ .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 @attLGray;
+ margin-right: 10px;
+ //background: @attWhite;
+ white-space: nowrap;
+ .dGray14r;
+ }
+ .auth-item-right{
+ display:inline-block;
+ width: 45%;
+ border-radius: 2px;
+ border: 1px solid;
+ //background: @attWhite;
+ vertical-align: middle;
+ }
+
+ .endpoint-item-left{
+ line-height: 30px;
+ height: 30px;
+ vertical-align: middle;
+ display:inline-block;
+ width: 80%;
+ //border-radius: 2px;
+ //border: 1px solid;
+ margin-right: 10px;
+ //background: @attWhite;
+ white-space: nowrap;
+ .dGray14r;
+ }
+ .endpoint-item-middle{
+ margin-top: 10px;
+ height: 14px;
+ width: 14px;
+ display:inline-block;
+ }
+
+ .endpoint-item-right{
+ margin-left: 5px;
+ width: 15%;
+ height: 30px;
+ display:inline-block;
+ }
+
+ .endpoint-label-item-left{
+ line-height: 30px;
+ height: 30px;
+ vertical-align: middle;
+ display:inline-block;
+ width: 80%;
+ margin-right: 10px;
+ //background: @attWhite;
+ white-space: nowrap;
+ .dGray14r;
+ }
+ .endpoint-label-item-right{
+ line-height: 30px;
+ height: 30px;
+ display:inline-block;
+ width: 20%;
+ //background: @attWhite;
+ vertical-align: middle;
+ white-space: nowrap;
+ .dGray14r;
+ }
+
+
+ .textarea-field{
+ position: relative;
+ .custom-input-field;
+ height:50px;
+ }
+ .submit-button {
+ margin-top: 25px;
+ position: relative;
+ float: right;
+ width: 20%;
+ .btn-blue;
+ }
+
+
+
+ .add-endpoint-button{
+ height: 14px;
+ width: 14px;
+ float: right;
+ }
+ .item-label{
+ .dGray14r;
+ }
+ }
+ }
+}
+#account-scroll-end{
+ height: 20px;
+} \ No newline at end of file