diff options
Diffstat (limited to 'catalog-ui/app/scripts/view-models/forms')
14 files changed, 0 insertions, 2055 deletions
diff --git a/catalog-ui/app/scripts/view-models/forms/artifact-form/artifact-form-view-model.ts b/catalog-ui/app/scripts/view-models/forms/artifact-form/artifact-form-view-model.ts deleted file mode 100644 index 092594b0d5..0000000000 --- a/catalog-ui/app/scripts/view-models/forms/artifact-form/artifact-form-view-model.ts +++ /dev/null @@ -1,354 +0,0 @@ -/*- - * ============LICENSE_START======================================================= - * SDC - * ================================================================================ - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. - * ================================================================================ - * 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. - * ============LICENSE_END========================================================= - */ -/// <reference path="../../../references"/> - -module Sdc.ViewModels { - 'use strict'; - import Resource = Sdc.Models.Components.Resource; - - export interface IEditArtifactModel { - artifactResource: Models.ArtifactModel; - artifactTypes: Array<string>; - artifactFile: any; - } - - export interface IArtifactResourceFormViewModelScope extends ng.IScope { - forms:any; - $$childTail: any; - isNew: boolean; - isLoading: boolean; - validationPattern: RegExp; - urlValidationPattern: RegExp; - labelValidationPattern: RegExp; - integerValidationPattern: RegExp; - commentValidationPattern: RegExp; - artifactType: string; - editArtifactResourceModel: IEditArtifactModel; - defaultHeatTimeout: number; - validExtensions: any; - originalArtifactName: string; - editForm: ng.IFormController; - footerButtons: Array<any>; - modalInstanceArtifact:ng.ui.bootstrap.IModalServiceInstance; - - fileExtensions():string; - save(doNotCloseModal?:boolean): void; - saveAndAnother(): void; - close(): void; - getOptions(): Array<string>; - isDeploymentHeat(): boolean; - onFileChange(): void; - setDefaultTimeout(): void; - openEditEnvParametersModal(artifact:Models.ArtifactModel):void; - getFormTitle():string; - fileUploadRequired():string; - isArtifactOwner():boolean; - } - - export class ArtifactResourceFormViewModel { - - private artifactArr:Array<Models.ArtifactModel>; - - static '$inject' = [ - '$scope', - '$modalInstance', - 'artifact', - 'Sdc.Services.CacheService', - 'ValidationPattern', - 'UrlValidationPattern', - 'LabelValidationPattern', - 'IntegerValidationPattern', - 'CommentValidationPattern', - 'ValidationUtils', - '$base64', - '$state', - 'ArtifactsUtils', - '$modal', - '$templateCache', - 'component' - ]; - - private formState:Utils.Constants.FormState; - private entityId:string; - - constructor(private $scope:IArtifactResourceFormViewModelScope, - private $modalInstance:ng.ui.bootstrap.IModalServiceInstance, - private artifact:Models.ArtifactModel, - private cacheService:Services.CacheService, - private ValidationPattern:RegExp, - private UrlValidationPattern:RegExp, - private LabelValidationPattern:RegExp, - private IntegerValidationPattern : RegExp, - private CommentValidationPattern: RegExp, - private ValidationUtils: Sdc.Utils.ValidationUtils, - private $base64:any, - private $state:any, - private artifactsUtils:Sdc.Utils.ArtifactsUtils, - private $modal:ng.ui.bootstrap.IModalService, - private $templateCache:ng.ITemplateCacheService, - private component:Models.Components.Component) { - - - this.entityId = this.component.uniqueId; - this.artifactArr = []; - this.formState = angular.isDefined(artifact.artifactLabel) ? Utils.Constants.FormState.UPDATE : Utils.Constants.FormState.CREATE; - this.initScope(); - } - - private initEntity = ():void => { - this.$scope.editArtifactResourceModel.artifactResource = this.artifact; - this.$scope.originalArtifactName = this.artifact.artifactName; - }; - - - private initFooterButtons = ():void =>{ - - this.$scope.footerButtons = [ - {'name': 'Done', 'css': 'blue', 'callback': this.$scope.save} - ]; - if (this.$scope.isNew){ - this.$scope.footerButtons.push( {'name': 'Add Another', 'css': 'grey', 'disabled': !this.$scope.isNew && 'deployment' === this.$scope.artifactType, 'callback': this.$scope.saveAndAnother}); - } - - }; - - - private initArtifactTypes = ():void => { - - let artifactTypes:any = this.cacheService.get('UIConfiguration'); - - if('deployment' === this.$scope.artifactType) { - - this.$scope.validExtensions = ('HEAT_ENV' == this.artifact.artifactType||this.component.selectedInstance)?//to remove the first condition? - artifactTypes.artifacts.deployment.resourceInstanceDeploymentArtifacts - : this.component.isResource() ? artifactTypes.artifacts.deployment.resourceDeploymentArtifacts - : artifactTypes.artifacts.deployment.serviceDeploymentArtifacts; - - if(this.$scope.validExtensions) { - this.$scope.editArtifactResourceModel.artifactTypes = Object.keys(this.$scope.validExtensions); - } - this.$scope.defaultHeatTimeout = artifactTypes.defaultHeatTimeout; - if(this.$scope.isNew) { - let isHeat='HEAT_ENV' == this.artifact.artifactType; - _.remove(this.$scope.editArtifactResourceModel.artifactTypes, (item:string)=> { - return 'HEAT' == item.substring(0,4)||(!isHeat && item == "VF_MODULES_METADATA") || - _.has(Utils.Constants.ArtifactType.THIRD_PARTY_RESERVED_TYPES, item); - }); - } - - }if (this.$scope.artifactType === 'normal') { - this.$scope.editArtifactResourceModel.artifactTypes = artifactTypes.artifacts.other.map((element:any)=> { - return element.name; - }); - _.remove(this.$scope.editArtifactResourceModel.artifactTypes, (item:string)=> { - return _.has(Utils.Constants.ArtifactType.THIRD_PARTY_RESERVED_TYPES, item) || - _.has(Utils.Constants.ArtifactType.TOSCA, item); - }) - } - - if(this.component.isResource() && (<Resource>this.component).isCsarComponent()) { - _.remove(this.$scope.editArtifactResourceModel.artifactTypes, (item:string) => { - return this.artifactsUtils.isLicenseType(item); - }) - } - - }; - - private initEditArtifactResourceModel = ():void => { - this.$scope.editArtifactResourceModel = { - artifactResource: null, - artifactTypes: null, - artifactFile:{} - }; - - this.initEntity(); - }; - - private initScope = ():void => { - - this.$scope.validationPattern = this.ValidationPattern; - this.$scope.urlValidationPattern = this.UrlValidationPattern; - this.$scope.labelValidationPattern = this.LabelValidationPattern; - this.$scope.integerValidationPattern = this.IntegerValidationPattern; - this.$scope.commentValidationPattern = this.CommentValidationPattern; - this.$scope.isLoading = false; - this.$scope.isNew = (this.formState === Utils.Constants.FormState.CREATE); - this.$scope.artifactType = this.artifactsUtils.getArtifactTypeByState(this.$state.current.name); - this.$scope.modalInstanceArtifact = this.$modalInstance; - - this.initEditArtifactResourceModel(); - this.initArtifactTypes(); - - // In case of edit, show the file name in browse. - if (this.artifact.artifactName!=="" && 'HEAT_ENV'!==this.artifact.artifactType){ - this.$scope.editArtifactResourceModel.artifactFile = {}; - this.$scope.editArtifactResourceModel.artifactFile.filename = this.artifact.artifactName; - } - - //scope methods - this.$scope.isDeploymentHeat = ():boolean => { - return !this.$scope.isNew && this.$scope.artifactType === 'deployment' && - 'HEAT' === this.$scope.editArtifactResourceModel.artifactResource.artifactType.substring(0,4); - }; - this.$scope.onFileChange = ():void => { - if(this.$scope.editArtifactResourceModel.artifactFile && this.$scope.editArtifactResourceModel.artifactFile.filename) { - this.$scope.editArtifactResourceModel.artifactResource.artifactName = this.$scope.editArtifactResourceModel.artifactFile.filename; - } else { - this.$scope.editArtifactResourceModel.artifactResource.artifactName = this.$scope.originalArtifactName; - } - }; - this.$scope.setDefaultTimeout = ():void => { - if(this.$scope.isDeploymentHeat() && !this.$scope.editArtifactResourceModel.artifactResource.timeout) { - this.$scope.editArtifactResourceModel.artifactResource.timeout = this.$scope.defaultHeatTimeout; - } - }; - - this.$scope.fileExtensions = ():string => { - let type:string = this.$scope.editArtifactResourceModel.artifactResource.artifactType; - return type && this.$scope.validExtensions && this.$scope.validExtensions[type].acceptedTypes ? - this.$scope.validExtensions[type].acceptedTypes.join(',') : ""; - }; - - this.$scope.save = (doNotCloseModal?:boolean):void => { - this.$scope.isLoading = true; - this.$scope.editArtifactResourceModel.artifactResource.description = this.ValidationUtils.stripAndSanitize(this.$scope.editArtifactResourceModel.artifactResource.description); - - if (!this.$scope.isDeploymentHeat()) { - this.$scope.editArtifactResourceModel.artifactResource.timeout = null; - } - - if (this.$scope.editArtifactResourceModel.artifactFile) { - this.$scope.editArtifactResourceModel.artifactResource.payloadData = this.$scope.editArtifactResourceModel.artifactFile.base64; - this.$scope.editArtifactResourceModel.artifactResource.artifactName = this.$scope.editArtifactResourceModel.artifactFile.filename; - } - - let onFaild = (response):void => { - this.$scope.isLoading = false; - console.info('onFaild', response); - }; - - let onSuccess = (artifactResource:Models.ArtifactModel):void => { - this.$scope.isLoading = false; - this.$scope.originalArtifactName = ""; - - if(this.$scope.isDeploymentHeat()){ - if(artifactResource.heatParameters) { - this.$scope.openEditEnvParametersModal(artifactResource); - } - } - - if (!doNotCloseModal) { - this.$modalInstance.close(); - //this.artifactArr = []; - } else { - this.$scope.editArtifactResourceModel.artifactFile = null; - angular.element("input[type='file']").val(null); // for support chrome when upload the same file - this.artifactsUtils.addAnotherAfterSave(this.$scope); - } - - }; - - if('HEAT_ENV' == this.artifact.artifactType){ - this.component.uploadInstanceEnvFile(this.$scope.editArtifactResourceModel.artifactResource).then(onSuccess, onFaild); - }else if(this.$scope.isArtifactOwner()){ - this.component.addOrUpdateInstanceArtifact(this.$scope.editArtifactResourceModel.artifactResource).then(onSuccess, onFaild); - }else { - this.component.addOrUpdateArtifact(this.$scope.editArtifactResourceModel.artifactResource).then(onSuccess, onFaild); - } - }; - - this.$scope.isArtifactOwner = ():boolean=> { - return this.component.isService() && !!this.component.selectedInstance; - }; - - this.$scope.saveAndAnother = ():void => { - this.$scope.save(true); - }; - - this.$scope.close = ():void => { - this.$modalInstance.close(); - this.artifactArr = []; - }; - - this.$scope.fileUploadRequired = ():string => { - if (this.$scope.editArtifactResourceModel.artifactFile.filename){ - // This is edit mode - return 'false'; - } else { - return 'true'; - } - }; - - this.$scope.getFormTitle =(): string =>{ - if('HEAT_ENV' == this.artifact.artifactType){ - return 'Update HEAT ENV'; - } - if(this.$scope.isDeploymentHeat()){ - if(!this.$scope.editArtifactResourceModel.artifactResource.artifactChecksum){ - return 'Add HEAT Template'; - } - return 'Update HEAT Template'; - } - if(this.$scope.isNew){ - return 'Add Artifact'; - } - return 'Update Artifact'; - }; - - this.$scope.openEditEnvParametersModal = (artifactResource:Models.ArtifactModel):void => { - - let modalOptions:ng.ui.bootstrap.IModalSettings = { - template: this.$templateCache.get('/app/scripts/view-models/forms/env-parameters-form/env-parameters-form.html'), - controller: 'Sdc.ViewModels.EnvParametersFormViewModel', - size: 'sdc-md', - backdrop: 'static', - resolve: { - artifact: ():Models.ArtifactModel => { - return artifactResource; - }, - component: ():Models.Components.Component => { - return this.component; - } - } - }; - - let modalInstance:ng.ui.bootstrap.IModalServiceInstance = this.$modal.open(modalOptions); - modalInstance - .result - .then(():void => { - }); - }; - - this.$scope.forms = {}; - - this.initFooterButtons(); - - - this.$scope.$watch("forms.editForm.$invalid", (newVal, oldVal) => { - this.$scope.footerButtons[0].disabled = this.$scope.forms.editForm.$invalid; - if(this.$scope.isNew){ - this.$scope.footerButtons[1].disabled = this.$scope.forms.editForm.$invalid; - } - }); - - } - - } -} diff --git a/catalog-ui/app/scripts/view-models/forms/artifact-form/artifact-form-view.html b/catalog-ui/app/scripts/view-models/forms/artifact-form/artifact-form-view.html deleted file mode 100644 index 74a19c8776..0000000000 --- a/catalog-ui/app/scripts/view-models/forms/artifact-form/artifact-form-view.html +++ /dev/null @@ -1,169 +0,0 @@ -<sdc-modal modal="modalInstanceArtifact" type="classic" class="sdc-add-artifact" buttons="footerButtons" header="{{getFormTitle()}}" show-close-button="true" get-close-modal-response="close"> - - <loader data-display="isLoading"></loader> - - <div class="sdc-edit-artifact-form-container" - data-ng-class="{'mandatory-artifact': (editArtifactResourceModel.artifactResource.mandatory && artifactType !=='deployment') || artifactType === 'api'}"> - <form novalidate class="w-sdc-form" name="forms.editForm"> - - <!--------------------- ARTIFACT FILE START--------------------> - <div class="i-sdc-form-item"> - <label class="required">Upload File</label> - <file-upload id="fileUploadElement" - form-element="forms.editForm" - element-required="{{::fileUploadRequired()}}" - element-name="myArtifactFile" - file-model="editArtifactResourceModel.artifactFile" - extensions="{{fileExtensions()}}" - element-disabled="{{!editArtifactResourceModel.artifactResource.artifactType}}" - data-ng-class="{'error': forms.editForm.myArtifactFile.$dirty && forms.editForm.myArtifactFile.$invalid}"></file-upload> - - <div class="input-error-file-upload" data-ng-show="forms.editForm.myArtifactFile.$dirty && forms.editForm.myArtifactFile.$invalid"> - <span ng-show="forms.editForm.myArtifactFile.$error.required && !forms.editForm.myArtifactFile.$error.emptyFile" translate="ADD_ARTIFACT_ERROR_FILE_REQUIRED"></span> - <span ng-show="forms.editForm.myArtifactFile.$error.maxsize" translate="VALIDATION_ERROR_MAX_FILE_SIZE"></span> - <span ng-if="artifactType === 'deployment'" ng-show="forms.editForm.myArtifactFile.$error.filetype" translate="ADD_ARTIFACT_ERROR_VALID_EXTENSIONS" translate-values="{'extensions': '{{fileExtensions()}}' }"></span> - <span ng-show="forms.editForm.myArtifactFile.$error.emptyFile" translate="VALIDATION_ERROR_EMPTY_FILE"></span> - </div> - </div> - <!--------------------- ARTIFACT FILE END --------------------> - - <div class="w-sdc-form-columns-wrapper"> - - <div class="w-sdc-form-column" data-ng-if="artifactType === 'deployment' || (!editArtifactResourceModel.artifactResource.mandatory && artifactType !== 'api')"> - - <div class="i-sdc-form-item" - data-ng-class="{error:(forms.editForm.artifactLabel.$dirty && forms.editForm.artifactLabel.$invalid)}" - data-ng-if="!isDeploymentHeat()"> - <label class="i-sdc-form-label required">Artifact Label</label> - <input class="i-sdc-form-input" - data-ng-maxlength="25" - data-ng-model="editArtifactResourceModel.artifactResource.artifactLabel" - type="text" - name="artifactLabel" - data-required - data-ng-model-options="{ debounce: 200 }" - data-ng-pattern="labelValidationPattern" - maxlength="25" - data-ng-disabled="!isNew" - data-tests-id="artifact-label" - autofocus/> - - <div class="input-error" data-ng-show="forms.editForm.artifactLabel.$dirty && forms.editForm.artifactLabel.$invalid"> - <span ng-show="forms.editForm.artifactLabel.$error.required" translate="ADD_ARTIFACT_ERROR_LABEL_REQUIRED"></span> - <span ng-show="forms.editForm.artifactLabel.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '25' }"></span> - <span ng-show="forms.editForm.artifactLabel.$error.pattern" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED"></span> - </div> - - </div> - - <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.type.$dirty && forms.editForm.type.$invalid)}"> - <label class="i-sdc-form-label required">Type</label> - <select class="i-sdc-form-select" - data-required - name="type" - data-ng-disabled="!isNew" - data-ng-change="setDefaultTimeout()" - data-ng-model="editArtifactResourceModel.artifactResource.artifactType" - data-ng-options="type as type for type in editArtifactResourceModel.artifactTypes track by type | uppercase" - data-tests-id="artifacttype"> - <option value="">Choose Type</option> - </select> - - <div class="input-error" data-ng-show="forms.editForm.type.$dirty && forms.editForm.type.$invalid"> - <span ng-show="forms.editForm.type.$error.required" translate="ADD_ARTIFACT_ERROR_TYPE_REQUIRED"></span> - </div> - - </div> - - <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.timeout.$dirty && forms.editForm.timeout.$invalid)}" data-ng-if="isDeploymentHeat()"> - <label class="i-sdc-form-label">Deployment Timeout (minutes)</label> - <input class="i-sdc-form-input" - data-ng-maxlength="25" - data-ng-model="editArtifactResourceModel.artifactResource.timeout" - type="number" - name="timeout" - min="1" - max="2147483647" - data-ng-disabled="'HEAT_ENV'==editArtifactResourceModel.artifactResource.artifactType" - data-ng-model-options="{ debounce: 200 }" - data-ng-pattern="integerValidationPattern" - data-ng-init="setDefaultTimeout()" - data-ng-change="setDefaultTimeout()" - maxlength="25" - data-tests-id="timeout" /> - - <div class="input-error" data-ng-show="forms.editForm.timeout.$dirty && forms.editForm.timeout.$invalid"> - <span ng-show="forms.editForm.timeout.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '25' }"></span> - <span ng-show="forms.editForm.timeout.$error.pattern" translate="ADD_ARTIFACT_ERROR_TIMEOUT_PATTERN"></span> - <span ng-show="forms.editForm.timeout.$error.min" translate="ADD_ARTIFACT_ERROR_TIMEOUT_MIN"></span> - </div> - - </div> - - </div><!-- w-sdc-form-column --> - - <div class="w-sdc-form-column i-sdc-form-url" data-ng-if="artifactType==='api'"> - - <div class="i-sdc-form-item" - data-ng-class="{error:(forms.editForm.apiUrl.$dirty && forms.editForm.apiUrl.$invalid)}"> - <label class="i-sdc-form-label required">URL</label> - <input class="i-sdc-form-input" - data-ng-maxlength="100" - data-ng-model="editArtifactResourceModel.artifactResource.apiUrl" - data-ng-model-options="{ debounce: 200 }" - type="url" - name="apiUrl" - data-required - ng-pattern="urlValidationPattern" - maxlength="100" - autofocus - invalid-characters=',#?&@$<>~^`\[]{}|")(*!+=;%' /> - - <div class="input-error" data-ng-show="forms.editForm.apiUrl.$dirty && forms.editForm.apiUrl.$invalid"> - <span ng-show="forms.editForm.apiUrl.$error.required" translate="ADD_ARTIFACT_ERROR_APIURL_REQUIRED"></span> - <span ng-show="forms.editForm.apiUrl.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '100' }"></span> - <span ng-show="forms.editForm.apiUrl.$error.url || forms.editForm.apiUrl.$error.pattern || forms.editForm.apiUrl.$error.invalidCharacters" translate="ADD_ARTIFACT_ERROR_APIURL_URL"></span> - </div> - - </div> - - </div><!-- w-sdc-form-column --> - - <div class="w-sdc-form-column"> - - <div class="i-sdc-form-item" - data-ng-class="{error:(forms.editForm.description.$dirty && forms.editForm.description.$invalid)}"> - <label class="i-sdc-form-label required">Description</label> - <textarea class="i-sdc-form-textarea" - data-ng-maxlength="256" - maxlength="256" - data-required - name="description" - data-ng-model="editArtifactResourceModel.artifactResource.description" - data-ng-model-options="{ debounce: 200 }" - data-ng-pattern="commentValidationPattern" - data-tests-id="description"></textarea> - - <div class="input-error" data-ng-show="forms.editForm.description.$dirty && forms.editForm.description.$invalid"> - <span ng-show="forms.editForm.description.$error.required" translate="ADD_ARTIFACT_ERROR_DESCRIPTION_REQUIRED"></span> - <span ng-show="forms.editForm.description.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '256' }"></span> - <span ng-show="forms.editForm.description.$error.pattern" translate="ADD_ARTIFACT_ERROR_DESCRIPTION_PATTERN"></span> - </div> - - <div class="w-sdc-form-column artifact-info" data-ng-show="!isNew && editArtifactResourceModel.artifactResource.esId"> - UUID <span data-ng-bind="editArtifactResourceModel.artifactResource.artifactUUID"></span> - <br /> - Version <span data-ng-bind="editArtifactResourceModel.artifactResource.artifactVersion"></span> - </div> - </div> - - </div><!-- w-sdc-form-column --> - - </div><!-- w-sdc-form-columns-wrapper --> - - <span class="w-sdc-form-note" data-ng-show="forms.editForm.$invalid && false" translate="LABEL_ALL_FIELDS_ARE_MANDATORY"></span> - - </form> - </div> -</sdc-modal> - diff --git a/catalog-ui/app/scripts/view-models/forms/artifact-form/artifact-form.less b/catalog-ui/app/scripts/view-models/forms/artifact-form/artifact-form.less deleted file mode 100644 index 1f77958c88..0000000000 --- a/catalog-ui/app/scripts/view-models/forms/artifact-form/artifact-form.less +++ /dev/null @@ -1,44 +0,0 @@ -.sdc-edit-artifact-form-container { - - .w-sdc-form-note { - .h_9; - display: block; - position: relative; - top: 13px; - } - - .i-sdc-form-textarea{ - min-height: 95px; - } - - .i-sdc-form-url { - padding-bottom: 0px; - } - - &.mandatory-artifact { - .w-sdc-form-column { - width: 100%; - padding: 0; - min-height: initial; - } - } - .w-sdc-form .i-sdc-form-item.upload input[type="file"] { - display: none - } - - .artifact-info { - text-align: left; - color: rgb(140, 140, 140); - font-size: 13px; - margin-top: -10px; - margin-bottom: 5px; - width: 100%; - min-height: initial; - - span { - color: #666666; - padding-left: 4px; - } - } - -} diff --git a/catalog-ui/app/scripts/view-models/forms/attribute-form/attribute-form-view.html b/catalog-ui/app/scripts/view-models/forms/attribute-form/attribute-form-view.html deleted file mode 100644 index 432b32fbd3..0000000000 --- a/catalog-ui/app/scripts/view-models/forms/attribute-form/attribute-form-view.html +++ /dev/null @@ -1,153 +0,0 @@ -<sdc-modal modal="modalInstanceAttribute" type="classic" class="sdc-edit-attribute-container" buttons="footerButtons" header="{{isNew ? 'Add' : 'Update' }} Attribute" show-close-button="true"> - - <div class="sdc-edit-attribute-form-container" > - <form novalidate class="w-sdc-form two-columns" name="forms.editForm" > - - <div class="w-sdc-form-columns-wrapper"> - - <div class="w-sdc-form-column"> - - <!-- Name --> - <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.attributeName.$dirty && forms.editForm.attributeName.$invalid)}"> - <label class="i-sdc-form-label required">Name</label> - <input class="i-sdc-form-input" - data-tests-id="attributeName" - data-ng-maxlength="50" - data-ng-disabled="!isNew" - maxlength="50" - data-ng-model="editAttributeModel.attribute.name" - type="text" - name="attributeName" - data-ng-pattern="propertyNameValidationPattern" - data-required - data-ng-model-options="{ debounce: 200 }" - data-ng-change="validateName()" - autofocus /> - <div class="input-error" data-ng-show="forms.editForm.attributeName.$dirty && forms.editForm.attributeName.$invalid"> - <span ng-show="forms.editForm.attributeName.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Attribute name' }"></span> - <span ng-show="forms.editForm.attributeName.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '128' }"></span> - <span ng-show="forms.editForm.attributeName.$error.pattern" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED"></span> - <span ng-show="forms.editForm.attributeName.$error.nameExist" translate="NEW_ATTRIBUTE_ERROR_NAME_EXISTS"></span> - </div> - </div> - - <!-- Description --> - <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.description.$dirty && forms.editForm.description.$invalid)}"> - <label class="i-sdc-form-label">Description</label> - <textarea class="i-sdc-form-textarea" - data-ng-maxlength="256" - data-ng-disabled="editAttributeModel.attribute.readonly" - maxlength="256" - data-ng-pattern="commentValidationPattern" - name="description" - data-ng-model="editAttributeModel.attribute.description" - data-ng-model-options="{ debounce: 200 }" - data-tests-id="description"></textarea> - <div class="input-error" data-ng-show="forms.editForm.description.$dirty && forms.editForm.description.$invalid"> - <span ng-show="forms.editForm.description.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '256' }"></span> - <span ng-show="forms.editForm.description.$error.pattern" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED"></span> - <span ng-show="forms.editForm.description.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Description' }"></span> - </div> - </div> - - - </div> - - <div class="w-sdc-form-column"> - <!-- Type --> - <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.type.$dirty && forms.editForm.type.$invalid)}"> - <label class="i-sdc-form-label required">Type</label> - <select class="i-sdc-form-select" - data-tests-id="type-field" - data-required - data-ng-disabled="editAttributeModel.attribute.readonly" - name="type" - data-ng-change="onTypeChange()" - data-ng-model="editAttributeModel.attribute.type" - data-ng-options="type for type in editAttributeModel.types"> - <option value="">Choose Type</option> - </select> - <div class="input-error" data-ng-show="forms.editForm.type.$dirty && forms.editForm.type.$invalid"> - <span ng-show="forms.editForm.type.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Type' }"></span> - </div> - </div> - - <!-- schema --> - <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.schema.$dirty && forms.editForm.schema.$invalid)}" - data-ng-if="showSchema()"> - <label class="i-sdc-form-label required">Entry Schema</label> - <select class="i-sdc-form-select" ng-if="isSchemaEditable()" - data-required - name="schema" - data-ng-disabled="editAttributeModel.attribute.readonly" - data-ng-change="onTypeChange(false)" - data-ng-model="editAttributeModel.attribute.schema.property.type" - data-ng-options="type for type in editAttributeModel.simpleTypes"> - <option value="">Choose Schema Type</option> - </select> - <input class="i-sdc-form-input" - ng-if="!isSchemaEditable()" - data-tests-id="schema" - data-ng-disabled="true" - data-ng-model="editAttributeModel.attribute.schema.property.type" - type="text" - name="schema"/> - <div class="input-error" data-ng-show="forms.editForm.schema.$dirty && forms.editForm.schema.$invalid"> - <span ng-show="forms.editForm.schema.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Entry schema' }"></span> - </div> - </div> - - <!-- Default value --> - <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.value.$dirty && forms.editForm.value.$invalid)}"> - <label class="i-sdc-form-label">Default Value</label> - <input class="i-sdc-form-input" - data-tests-id="defaultvalue" - ng-if="!(editAttributeModel.attribute.type == 'boolean')" - data-ng-maxlength="100" - data-ng-disabled="editAttributeModel.attribute.readonly && !isAttributeValueOwner()" - maxlength="100" - data-ng-model="editAttributeModel.attribute[isAttributeValueOwner()?'value':'defaultValue']" - type="text" - name="value" - data-custom-validation="" data-validation-func="validateUniqueKeys" - data-tests-id="defaultvalue" - data-ng-pattern="validationPattern" - data-ng-model-options="{ debounce: 200 }" - data-ng-change="!forms.editForm.value.$error.pattern && ('integer'==editAttributeModel.attribute.type && forms.editForm.value.$setValidity('pattern', validateIntRange(editAttributeModel.attribute.value)) || onValueChange())" - autofocus /> - <select class="i-sdc-form-select" - data-tests-id="booleantype" - ng-if="editAttributeModel.attribute.type == 'boolean'" - data-ng-disabled="editAttributeModel.attribute.readonly && !isAttributeValueOwner()" - name="value" - data-ng-change="onValueChange()" - data-ng-model="editAttributeModel.attribute[isAttributeValueOwner()?'value':'defaultValue']"> - <option value="true">true</option> - <option value="false">false</option> - </select> - <div class="input-error" data-ng-show="forms.editForm.value.$dirty && forms.editForm.value.$invalid"> - <span ng-show="forms.editForm.value.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Default value' }"></span> - <span ng-show="forms.editForm.value.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '100' }"></span> - <span ng-show="forms.editForm.value.$error.pattern" translate="{{getValidationTranslate()}}"></span> - <span ng-show="forms.editForm.value.$error.customValidation" translate="ATTRIBUTE_EDIT_MAP_UNIQUE_KEYS"></span> - </div> - </div> - - <!-- hidden --> - <div class="i-sdc-form-item" data-ng-if="isAttributeValueOwner()"> - <label class="i-sdc-form-label">Hidden</label> - <input class="i-sdc-form-input" - data-tests-id="hidden" - data-ng-disabled="editAttributeModel.attribute.readonly && !isAttributeValueOwner()" - data-ng-model="editAttributeModel.attribute.hidden" - type="checkbox" - name="hidden"/> - </div> - </div> - - </div> - - </form> - </div> - -</sdc-modal> diff --git a/catalog-ui/app/scripts/view-models/forms/attribute-form/attribute-from-view-model.ts b/catalog-ui/app/scripts/view-models/forms/attribute-form/attribute-from-view-model.ts deleted file mode 100644 index d369cfa5d1..0000000000 --- a/catalog-ui/app/scripts/view-models/forms/attribute-form/attribute-from-view-model.ts +++ /dev/null @@ -1,255 +0,0 @@ -/*- - * ============LICENSE_START======================================================= - * SDC - * ================================================================================ - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. - * ================================================================================ - * 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. - * ============LICENSE_END========================================================= - */ -/// <reference path="../../../references"/> - -module Sdc.ViewModels { - 'use strict'; - - export interface IEditAttributeModel { - attribute: Models.AttributeModel; - types: Array<string>; - simpleTypes: Array<string>; - } - - interface IAttributeFormViewModelScope extends ng.IScope { - $$childTail: any; - forms:any; - editForm:ng.IFormController; - footerButtons: Array<any>; - isService: boolean; - editAttributeModel: IEditAttributeModel; - modalInstanceAttribute:ng.ui.bootstrap.IModalServiceInstance; - isNew: boolean; - listRegex: Sdc.Utils.IMapRegex; - mapRegex: Sdc.Utils.IMapRegex; - propertyNameValidationPattern: RegExp; - commentValidationPattern: RegExp; - isLoading: boolean; - validationPattern: RegExp; - - save():void; - close(): void; - onTypeChange():void; - onValueChange(): void; - isAttributeValueOwner():boolean; - validateIntRange(value:string):boolean; - validateUniqueKeys(viewValue:string):boolean; - getValidationTranslate(): string; - showSchema(): boolean; - isSchemaEditable(): boolean; - validateName():void; - } - - export class AttributeFormViewModel { - - static '$inject' = [ - '$scope', - '$modalInstance', - 'attribute', - 'ValidationUtils', - 'CommentValidationPattern', - 'PropertyNameValidationPattern', - 'component' - ]; - - private formState: Sdc.Utils.Constants.FormState; - - - constructor(private $scope:IAttributeFormViewModelScope, - private $modalInstance:ng.ui.bootstrap.IModalServiceInstance, - private attribute: Models.AttributeModel, - private ValidationUtils:Sdc.Utils.ValidationUtils, - private CommentValidationPattern:RegExp, - private PropertyNameValidationPattern: RegExp, - private component: Models.Components.Component) { - this.formState = angular.isDefined(attribute.name) ? Utils.Constants.FormState.UPDATE : Utils.Constants.FormState.CREATE; - this.initScope(); - } - - private initResource = ():void => { - this.$scope.editAttributeModel.attribute = new Sdc.Models.AttributeModel(this.attribute); - if (this.$scope.editAttributeModel.types.indexOf(this.attribute.type) === -1) {//attribute defaulte type is string too? - this.attribute.type = "string"; - } - }; - - private initEditAttributeModel = ():void => { - this.$scope.editAttributeModel = { - attribute: null, - types: ['integer', 'string', 'float', 'boolean', 'list', 'map'], - simpleTypes: ['integer', 'string', 'float', 'boolean'] - }; - - this.initResource(); - }; - - private initScope = ():void => { - - //scope attributes - this.$scope.forms = {}; - this.$scope.propertyNameValidationPattern = this.PropertyNameValidationPattern; - this.$scope.commentValidationPattern = this.CommentValidationPattern; - - this.$scope.modalInstanceAttribute = this.$modalInstance; - this.$scope.listRegex = this.ValidationUtils.getPropertyListPatterns(); - this.$scope.mapRegex = this.ValidationUtils.getPropertyMapPatterns(); - - this.$scope.isNew = (this.formState === Utils.Constants.FormState.CREATE); - this.$scope.isLoading = false; - - this.initEditAttributeModel(); - this.setValidationPattern(); - - //scope methods - this.$scope.save = ():void => { - if(!this.$scope.forms.editForm.$invalid){ - let attribute:Models.AttributeModel = this.$scope.editAttributeModel.attribute; - this.$scope.editAttributeModel.attribute.description = this.ValidationUtils.stripAndSanitize(this.$scope.editAttributeModel.attribute.description); - ////if read only - just closes the modal - if (this.$scope.editAttributeModel.attribute.readonly && !this.$scope.isAttributeValueOwner()) { - this.$modalInstance.close(); - return; - } - this.$scope.isLoading = true; - let onAttributeFaild = (response):void => { - console.info('onFaild', response); - this.$scope.isLoading = false; - }; - - let onAttributeSuccess = (attributeFromBE:Models.AttributeModel):void => { - console.info('onAttributeResourceSuccess : ', attributeFromBE); - this.$scope.isLoading = false; - this.$modalInstance.close(); - }; - - //in case we have uniqueId we call update method - if (this.$scope.isAttributeValueOwner()) { - this.component.updateInstanceAttribute(attribute).then(onAttributeSuccess, onAttributeFaild); - } else { - this.component.addOrUpdateAttribute(attribute).then(onAttributeSuccess, onAttributeFaild); - } - } - }; - - this.$scope.close = ():void => { - this.$modalInstance.close(); - }; - - this.$scope.validateName = ():void => { - let existsAttr: Models.AttributeModel = _.find(this.component.attributes, (attribute:Models.AttributeModel) => { - return attribute.name === this.$scope.editAttributeModel.attribute.name; - }); - if(existsAttr){ - this.$scope.forms.editForm["attributeName"].$setValidity('nameExist', false); - }else{ - this.$scope.forms.editForm["attributeName"].$setValidity('nameExist', true); - } - - }; - - this.$scope.onTypeChange = ():void => { - this.$scope.editAttributeModel.attribute.value = ''; - this.$scope.editAttributeModel.attribute.defaultValue = ''; - this.setValidationPattern(); - }; - - this.$scope.isAttributeValueOwner = ():boolean=> { - return this.component.isService() || !!this.component.selectedInstance; - }; - - this.$scope.onValueChange = ():void => { - if (!this.$scope.editAttributeModel.attribute.value) { - if (this.$scope.isAttributeValueOwner()) { - this.$scope.editAttributeModel.attribute.value = this.$scope.editAttributeModel.attribute.defaultValue; - } - } - }; - - - this.$scope.validateUniqueKeys = (viewValue:string) : boolean => { - if(this.$scope.editAttributeModel.attribute.type === 'map') { - return this.ValidationUtils.validateUniqueKeys(viewValue); - } - else { - return true; //always valid if not a map - } - }; - - this.$scope.validateIntRange = (value:string):boolean => { - return !value || this.ValidationUtils.validateIntRange(value); - }; - - this.$scope.isSchemaEditable = () :boolean => { - let schemaType=this.$scope.editAttributeModel.attribute.schema.property.type; - return this.$scope.editAttributeModel.simpleTypes.indexOf(schemaType) > -1||!schemaType; - }; - - this.$scope.showSchema = () :boolean => { - return ['list', 'map'].indexOf(this.$scope.editAttributeModel.attribute.type) > -1; - }; - - this.$scope.getValidationTranslate = () : string => { - let result = "ATTRIBUTE_EDIT_PATTERN"; - if (this.$scope.showSchema()) { - - result = "ATTRIBUTE_EDIT_" + this.$scope.editAttributeModel.attribute.type.toUpperCase(); - - if(this.$scope.editAttributeModel.attribute.schema.property.type === Utils.Constants.PROPERTY_TYPES.STRING) { - result += "_STRING"; - }else if(this.$scope.editAttributeModel.attribute.schema.property.type === Utils.Constants.PROPERTY_TYPES.BOOLEAN) { - result += "_BOOLEAN"; - } else { - result += "_GENERIC"; - } - } - - return result; - }; - - // Add the done button at the footer. - this.$scope.footerButtons = [ - {'name': 'Done', 'css':'blue', 'callback': this.$scope.save}, - {'name':'Cancel', 'css':'grey', 'callback': this.$scope.close} - ]; - - this.$scope.$watchCollection("forms.editForm.$invalid", (newVal, oldVal) => { - this.$scope.footerButtons[0].disabled = this.$scope.forms.editForm.$invalid; - }); - - } - - - private setValidationPattern = ():void => { - - if(this.$scope.editAttributeModel.attribute.type === 'list') { - this.$scope.validationPattern = this.$scope.listRegex[this.$scope.editAttributeModel.attribute.schema.property.type]; - } - else if(this.$scope.editAttributeModel.attribute.type === 'map') { - this.$scope.validationPattern = this.$scope.mapRegex[this.$scope.editAttributeModel.attribute.schema.property.type]; - } - else{ - this.$scope.validationPattern = this.ValidationUtils.getValidationPattern(this.$scope.editAttributeModel.attribute.type); - } - - }; - - - } -} diff --git a/catalog-ui/app/scripts/view-models/forms/env-parameters-form/env-parameters-form.html b/catalog-ui/app/scripts/view-models/forms/env-parameters-form/env-parameters-form.html deleted file mode 100644 index 69367dc68c..0000000000 --- a/catalog-ui/app/scripts/view-models/forms/env-parameters-form/env-parameters-form.html +++ /dev/null @@ -1,39 +0,0 @@ -<sdc-modal modal="envParametersModal" type="classic" class="sdc-env-form-container" buttons="saveButton" header="{{isInstance()?'HEAT Template':'Update Parameters'}}" show-close-button="true"> - <div class="sdc-env-form-container"> - <div class="w-sdc-modal-body"> - <span class="w-sdc-modal-body-content" data-ng-if="!isInstance()" translate="UPDATE_PARAMETERS_TEXT"></span> - <form novalidate class="" name="editForm"> - <perfect-scrollbar class="perfect-scrollbar w-sdc-form w-sdc-env-form-container"> - <div class="i-sdc-form-item" data-ng-repeat="parameter in heatParameters track by $index"> - <div class="left-column-container"> - <ng-form name="editForm"> - <label class="i-sdc-env-form-label" data-ng-class="{required:parameter.defaultValue}" - data-ng-bind="parameter.name +' (' + parameter.type + ')'" tooltips tooltip-content="{{parameter.name +' (' + parameter.type + ')'}}"></label> - <input class="i-sdc-form-input" data-ng-class="{error:(editForm.currentValue.$invalid)}" - data-ng-model-options="{ debounce: 200 }" - data-ng-model="parameter.currentValue" - type="text" - name="currentValue" - data-ng-pattern="getValidationPattern(parameter.type, 'heat')" - data-ng-required="parameter.defaultValue" - data-ng-change="'json'==parameter.type && editForm.currentValue.$setValidity('pattern', validateJson(parameter.currentValue))" - data-ng-blur="(editForm.currentValue.$error.required && (parameter.currentValue=parameter.defaultValue))" - /> - - <div class="input-error" data-ng-show="editForm.currentValue.$invalid"> - <span ng-show="editForm.currentValue.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Value'}"></span> - <span ng-show="editForm.currentValue.$error.pattern && parameter.type==='string'" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED"></span> - <span ng-show="editForm.currentValue.$error.pattern && !(parameter.type==='string')" translate="VALIDATION_ERROR_TYPE" translate-values="{'type': '{{parameter.type}}'}"></span> - </div> - </ng-form> - </div> - <div class="i-sdc-env-form-label-description"> - <label class="i-sdc-env-form-label" data-ng-bind="parameter.description" tooltips tooltip-content="{{parameter.description}}"></label> - </div> - </div> - </perfect-scrollbar> - <div class="env-file-generation-label" data-ng-if="isInstance()" translate="ENV_FILE_GENERATION"></div> - </form> - </div> - </div> -</sdc-modal> diff --git a/catalog-ui/app/scripts/view-models/forms/env-parameters-form/env-parameters-form.less b/catalog-ui/app/scripts/view-models/forms/env-parameters-form/env-parameters-form.less deleted file mode 100644 index c58c94ab22..0000000000 --- a/catalog-ui/app/scripts/view-models/forms/env-parameters-form/env-parameters-form.less +++ /dev/null @@ -1,74 +0,0 @@ - -.sdc-env-form-container{ - .w-sdc-modal-body{ - padding: 20px 10px 2px 10px; - } - .w-sdc-modal-body-content{ - .b_6; - display: block; - } - - .env-file-generation-label{ - .p_9; - .bold; - margin-bottom: 20px; - } -} - -.w-sdc-env-form-container { - border-top: 1px solid #cdcdcd; - border-bottom: 1px solid #cdcdcd; - height: 356px; - margin: 35px 0 10px 0; - - .w-sdc-form { - text-align: left; - } - .i-sdc-form-item{ - display: inline-block; - .description{ - margin-bottom: 2px; - vertical-align: baseline; - padding: 32px 0 0 0; - text-transform: capitalize; - .b_1; - } - } - .left-column-container{ - width: 250px; - float: left; - .i-sdc-env-form-label { - overflow: hidden; - max-width: 100%; - text-overflow: ellipsis; - display: inline-block; - white-space: nowrap; - - &.required::before { - color: #f33; - content: '*'; - margin-right: 4px; - } - } - } - .i-sdc-env-form-label-description { - float: right; - - .i-sdc-env-form-label { - .p_9; - // height: 20px; - margin: 30px 0px 0px 30px; - overflow: hidden; - max-width: 245px; - text-overflow: ellipsis; - display: inline-block; - white-space: nowrap; - - &.required::before { - color: #f33; - content: '*'; - margin-right: 4px; - } - } - } -} diff --git a/catalog-ui/app/scripts/view-models/forms/env-parameters-form/env-parameters-form.ts b/catalog-ui/app/scripts/view-models/forms/env-parameters-form/env-parameters-form.ts deleted file mode 100644 index d1bae440cc..0000000000 --- a/catalog-ui/app/scripts/view-models/forms/env-parameters-form/env-parameters-form.ts +++ /dev/null @@ -1,149 +0,0 @@ -/*- - * ============LICENSE_START======================================================= - * SDC - * ================================================================================ - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. - * ================================================================================ - * 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. - * ============LICENSE_END========================================================= - */ -/// <reference path="../../../references"/> - -module Sdc.ViewModels { - 'use strict'; - - export interface IEnvParametersFormViewModelScope extends ng.IScope { - isLoading: boolean; - type:string; - heatParameters:any; - editForm:ng.IFormController; - artifactResource:Models.ArtifactModel; - saveButton: Array<any>; - envParametersModal: ng.ui.bootstrap.IModalServiceInstance; - - getValidationPattern(type:string):RegExp; - isInstance():boolean; - validateJson(json:string):boolean; - close(): void; - save():void; - } - - export class EnvParametersFormViewModel { - - - static '$inject' = [ - '$scope', - '$state', - '$modalInstance', - 'artifact', - // 'ArtifactsUtils', - 'ValidationUtils', - 'component' - ]; - - - constructor(private $scope:IEnvParametersFormViewModelScope, - private $state:any, - private $modalInstance:ng.ui.bootstrap.IModalServiceInstance, - private artifact:Models.ArtifactModel, - // private artifactsUtils:Sdc.Utils.ArtifactsUtils, - private ValidationUtils: Sdc.Utils.ValidationUtils, - private component:Models.Components.Component) { - - - this.initScope(); - } - - private updateInstanceHeat = ():void => { - let success =(responseArtifact:Models.ArtifactModel): void => { - this.$scope.isLoading = false; - this.$modalInstance.close(); - }; - - let error = ():void => { - this.$scope.isLoading = false; - console.info('Failed to load save artifact'); - }; - - this.component.addOrUpdateInstanceArtifact(this.$scope.artifactResource).then(success, error); - - }; - - private initScope = ():void => { - this.$scope.envParametersModal = this.$modalInstance; - this.$scope.artifactResource= this.artifact; - this.$scope.heatParameters = angular.copy(this.artifact.heatParameters); - - this.$scope.getValidationPattern = (validationType:string , parameterType?:string):RegExp => { - return this.ValidationUtils.getValidationPattern(validationType, parameterType); - }; - - this.$scope.validateJson = (json:string):boolean => { - if(!json){ - return true; - } - return this.ValidationUtils.validateJson(json); - }; - - this.$scope.isInstance =(): boolean =>{ - return !!this.component.selectedInstance; - }; - - - this.$scope.save = ():void => { - this.$scope.isLoading = true; - this.artifact.heatParameters = this.$scope.heatParameters; - this.artifact.heatParameters.forEach((parameter:any):void => { - /* if ("" === parameter.currentValue) { - parameter.currentValue = null; - }else */ - if(!parameter.currentValue && parameter.defaultValue) { - parameter.currentValue = parameter.defaultValue; - } - }); - - if(this.$scope.isInstance()){ - this.updateInstanceHeat(); - return; - } - - let success =(responseArtifact:Models.ArtifactModel): void => { - this.$scope.isLoading = false; - this.$modalInstance.close(); - - }; - - let error = ():void => { - this.$scope.isLoading = false; - console.info('Failed to load save artifact'); - }; - - this.component.addOrUpdateArtifact(this.$scope.artifactResource).then(success, error); - }; - - this.$scope.saveButton = [ - {'name': 'Save', 'css': 'blue', 'callback': this.$scope.save} - ]; - - this.$scope.close = ():void => { - //this.artifact.heatParameters.forEach((parameter:any):void => { - // if (!parameter.currentValue && parameter.defaultValue) { - // parameter.currentValue = parameter.defaultValue; - // } - //}); - this.$modalInstance.dismiss(); - }; - - }; - } -} diff --git a/catalog-ui/app/scripts/view-models/forms/property-form/property-form-view-model.ts b/catalog-ui/app/scripts/view-models/forms/property-form/property-form-view-model.ts deleted file mode 100644 index c9732aa9a6..0000000000 --- a/catalog-ui/app/scripts/view-models/forms/property-form/property-form-view-model.ts +++ /dev/null @@ -1,330 +0,0 @@ -/*- - * ============LICENSE_START======================================================= - * SDC - * ================================================================================ - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. - * ================================================================================ - * 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. - * ============LICENSE_END========================================================= - */ -/// <reference path="../../../references"/> - -module Sdc.ViewModels { - 'use strict'; - - export interface IEditPropertyModel { - property: Models.PropertyModel; - types: Array<string>; - simpleTypes: Array<string>; - sources: Array<string>; - } - - interface IPropertyFormViewModelScope extends ng.IScope { - forms:any; - editForm:ng.IFormController; - footerButtons: Array<any>; - isNew: boolean; - isLoading: boolean; - isService: boolean; - validationPattern: RegExp; - propertyNameValidationPattern: RegExp; - commentValidationPattern: RegExp; - editPropertyModel: IEditPropertyModel; - modalInstanceProperty:ng.ui.bootstrap.IModalServiceInstance; - currentPropertyIndex:number; - isLastProperty:boolean; - myValue:any; - nonPrimitiveTypes:Array<string>; - dataTypes:Models.DataTypesMap; - isTypeDataType:boolean; - maxLength:number; - - save(doNotCloseModal?:boolean): void; - getValidationPattern(type:string): RegExp; - validateIntRange(value:string):boolean; - close(): void; - onValueChange(): void; - onSchemaTypeChange():void; - onTypeChange(resetSchema:boolean): void; - isPropertyValueOwner():boolean; - showSchema(): boolean; - delete(property:Models.PropertyModel): void; - getPrev(): void; - getNext(): void; - isSimpleType(typeName:string):boolean; - getDefaultValue():any; - } - - export class PropertyFormViewModel { - - static '$inject' = [ - '$scope', - 'Sdc.Services.DataTypesService', - '$modalInstance', - 'property', - 'ValidationPattern', - 'PropertyNameValidationPattern', - 'CommentValidationPattern', - 'ValidationUtils', - 'component', - '$filter', - 'ModalsHandler', - 'filteredProperties', - '$timeout' - ]; - - private formState: Sdc.Utils.Constants.FormState; - - constructor(private $scope:IPropertyFormViewModelScope, - private DataTypesService:Sdc.Services.DataTypesService, - private $modalInstance:ng.ui.bootstrap.IModalServiceInstance, - private property: Models.PropertyModel, - private ValidationPattern:RegExp, - private PropertyNameValidationPattern: RegExp, - private CommentValidationPattern:RegExp, - private ValidationUtils:Sdc.Utils.ValidationUtils, - private component: Models.Components.Component, - private $filter:ng.IFilterService, - private ModalsHandler:Utils.ModalsHandler, - private filteredProperties: Array<Models.PropertyModel>, - private $timeout: ng.ITimeoutService) { - - this.formState = angular.isDefined(property.name) ? Utils.Constants.FormState.UPDATE : Utils.Constants.FormState.CREATE; - this.initScope(); - } - - private initResource = ():void => { - this.$scope.editPropertyModel.property = new Sdc.Models.PropertyModel(this.property); - this.$scope.editPropertyModel.property.type = this.property.type? this.property.type: null; - this.setMaxLength(); - // if (this.$scope.editPropertyModel.types.indexOf(this.property.type) === -1 && !this.$scope.isNew) { - // this.property.type = "string"; - // } - }; - - private initEditPropertyModel = ():void => { - this.$scope.editPropertyModel = { - property: null, - types: Utils.Constants.PROPERTY_DATA.TYPES, - simpleTypes: Utils.Constants.PROPERTY_DATA.SIMPLE_TYPES, - sources: Utils.Constants.PROPERTY_DATA.SOURCES - }; - - this.initResource(); - }; - - private initForNotSimpleType = ():void => { - let property = this.$scope.editPropertyModel.property; - this.$scope.isTypeDataType=this.DataTypesService.isDataTypeForPropertyType(this.$scope.editPropertyModel.property,this.$scope.dataTypes); - if(property.type && this.$scope.editPropertyModel.simpleTypes.indexOf(property.type)==-1){ - if(!(property.value||property.defaultValue)) { - switch (property.type) { - case Utils.Constants.PROPERTY_TYPES.MAP: - this.$scope.myValue = {'':null}; - break; - case Utils.Constants.PROPERTY_TYPES.LIST: - this.$scope.myValue = []; - break; - default: - this.$scope.myValue = {}; - } - }else{ - this.$scope.myValue = JSON.parse(property.value||property.defaultValue); - } - } - }; - - private setMaxLength = ():void => { - switch (this.$scope.editPropertyModel.property.type) { - case Utils.Constants.PROPERTY_TYPES.MAP: - case Utils.Constants.PROPERTY_TYPES.LIST: - this.$scope.maxLength = this.$scope.editPropertyModel.property.schema.property.type == Utils.Constants.PROPERTY_TYPES.JSON? - Utils.Constants.PROPERTY_VALUE_CONSTRAINTS.JSON_MAX_LENGTH: - Utils.Constants.PROPERTY_VALUE_CONSTRAINTS.MAX_LENGTH; - break; - case Utils.Constants.PROPERTY_TYPES.JSON: - this.$scope.maxLength = Utils.Constants.PROPERTY_VALUE_CONSTRAINTS.JSON_MAX_LENGTH; - break; - default: - this.$scope.maxLength = Utils.Constants.PROPERTY_VALUE_CONSTRAINTS.MAX_LENGTH; - } - }; - - - private initScope = ():void => { - - //scope properties - this.$scope.forms = {}; - this.$scope.validationPattern = this.ValidationPattern; - this.$scope.propertyNameValidationPattern = this.PropertyNameValidationPattern; - this.$scope.commentValidationPattern = this.CommentValidationPattern; - this.$scope.isLoading = false; - this.$scope.isNew = (this.formState === Utils.Constants.FormState.CREATE); - this.$scope.isService = this.component.isService(); - this.$scope.modalInstanceProperty = this.$modalInstance; - this.$scope.currentPropertyIndex = _.findIndex(this.filteredProperties, i=> i.name == this.property.name ); - this.$scope.isLastProperty= this.$scope.currentPropertyIndex==(this.filteredProperties.length-1); - - this.initEditPropertyModel(); - - this.DataTypesService.getAllDataTypes().then((response:any) => { - this.$scope.dataTypes = response; - delete response['tosca.datatypes.Root']; - this.$scope.nonPrimitiveTypes =_.filter(Object.keys(response),(type:string)=>{ - return this.$scope.editPropertyModel.types.indexOf(type)==-1; - }); - this.initForNotSimpleType(); - }, (err)=> {}); - - - - - - //scope methods - this.$scope.save = (doNotCloseModal?:boolean):void => { - let property:Models.PropertyModel = this.$scope.editPropertyModel.property; - this.$scope.editPropertyModel.property.description = this.ValidationUtils.stripAndSanitize(this.$scope.editPropertyModel.property.description); - ////if read only - just closes the modal - if (this.$scope.editPropertyModel.property.readonly && !this.$scope.isPropertyValueOwner()) { - this.$modalInstance.close(); - return; - } - - this.$scope.isLoading = true; - - let onPropertyFaild = (response):void => { - console.info('onFaild', response); - this.$scope.isLoading = false; - }; - - let onPropertySuccess = (propertyFromBE:Models.PropertyModel):void => { - console.info('onPropertyResourceSuccess : ', propertyFromBE); - this.$scope.isLoading = false; - - if (!doNotCloseModal) { - this.$modalInstance.close(); - } else { - this.$scope.forms.editForm.$setPristine(); - this.$scope.editPropertyModel.property = new Models.PropertyModel(); - } - }; - - //in case we have uniqueId we call update method - if (this.$scope.isPropertyValueOwner()) { - if(!this.$scope.editPropertyModel.property.simpleType && !this.$scope.isSimpleType(property.type)){ - let myValueString:string = JSON.stringify(this.$scope.myValue); - property.value = myValueString; - } - this.component.updateInstanceProperty(property).then(onPropertySuccess, onPropertyFaild); - } else { - if(!this.$scope.editPropertyModel.property.simpleType && !this.$scope.isSimpleType(property.type)){ - let myValueString:string = JSON.stringify(this.$scope.myValue); - property.defaultValue = myValueString; - }else{ - this.$scope.editPropertyModel.property.defaultValue = this.$scope.editPropertyModel.property.value; - } - this.component.addOrUpdateProperty(property).then(onPropertySuccess, onPropertyFaild); - } - }; - - - this.$scope.isPropertyValueOwner = ():boolean=> { - return this.component.isService() || !!this.component.selectedInstance; - }; - - this.$scope.getPrev = ():void=> { - this.property = this.filteredProperties[--this.$scope.currentPropertyIndex]; - this.initResource(); - this.initForNotSimpleType(); - this.$scope.isLastProperty=false; - }; - - this.$scope.getNext = ():void=> { - this.property = this.filteredProperties[++this.$scope.currentPropertyIndex]; - this.initResource(); - this.initForNotSimpleType(); - this.$scope.isLastProperty= this.$scope.currentPropertyIndex==(this.filteredProperties.length-1); - }; - - this.$scope.isSimpleType = (typeName:string):boolean=>{ - return typeName && this.$scope.editPropertyModel.simpleTypes.indexOf(typeName)!=-1; - }; - - this.$scope.showSchema = () :boolean => { - return [Utils.Constants.PROPERTY_TYPES.LIST, Utils.Constants.PROPERTY_TYPES.MAP].indexOf(this.$scope.editPropertyModel.property.type) > -1; - }; - - this.$scope.getValidationPattern = (type:string):RegExp => { - return this.ValidationUtils.getValidationPattern(type); - }; - - this.$scope.validateIntRange = (value:string):boolean => { - return !value || this.ValidationUtils.validateIntRange(value); - }; - - this.$scope.close = ():void => { - this.$modalInstance.close(); - }; - - // put default value when instance value is empty - this.$scope.onValueChange = ():void => { - if (!this.$scope.editPropertyModel.property.value) { - if (this.$scope.isPropertyValueOwner()) { - this.$scope.editPropertyModel.property.value = this.$scope.editPropertyModel.property.defaultValue; - } - } - }; - - // Add the done button at the footer. - this.$scope.footerButtons = [ - {'name': 'Save', 'css': 'blue', 'callback': this.$scope.save }, - {'name': 'Cancel', 'css': 'grey', 'callback':this.$scope.close } - ]; - - this.$scope.$watch("forms.editForm.$invalid", (newVal, oldVal) => { - this.$scope.footerButtons[0].disabled = this.$scope.forms.editForm.$invalid; - }); - - this.$scope.getDefaultValue = ():any => { - return this.$scope.isPropertyValueOwner() ? this.$scope.editPropertyModel.property.defaultValue : null; - }; - - this.$scope.onTypeChange = ():void => { - this.$scope.editPropertyModel.property.value = ''; - this.$scope.editPropertyModel.property.defaultValue = ''; - this.setMaxLength(); - this.initForNotSimpleType(); - }; - - this.$scope.onSchemaTypeChange = ():void => { - if(this.$scope.editPropertyModel.property.type==Utils.Constants.PROPERTY_TYPES.MAP){ - this.$scope.myValue={'':null}; - }else if(this.$scope.editPropertyModel.property.type==Utils.Constants.PROPERTY_TYPES.LIST){ - this.$scope.myValue=[]; - } - this.setMaxLength(); - }; - - this.$scope.delete = (property:Models.PropertyModel):void => { - let onOk = ():void => { - this.component.deleteProperty(property.uniqueId).then( - this.$scope.close - ); - }; - let title:string = this.$filter('translate')("PROPERTY_VIEW_DELETE_MODAL_TITLE"); - let message:string = this.$filter('translate')("PROPERTY_VIEW_DELETE_MODAL_TEXT", "{'name': '" + property.name + "'}"); - this.ModalsHandler.openConfirmationModal(title, message, false).then(onOk); - }; - } - } -} diff --git a/catalog-ui/app/scripts/view-models/forms/property-form/property-form-view.html b/catalog-ui/app/scripts/view-models/forms/property-form/property-form-view.html deleted file mode 100644 index d593d47a77..0000000000 --- a/catalog-ui/app/scripts/view-models/forms/property-form/property-form-view.html +++ /dev/null @@ -1,219 +0,0 @@ -<sdc-modal modal="modalInstanceProperty" type="classic" class="sdc-edit-property-container" buttons="footerButtons" header="{{isNew ? 'Add' : 'Update' }} Property" show-close-button="true" data-tests-id="sdc-edit-property-container"> - <div class="sdc-modal-top-bar" data-ng-if="!isNew"> - <div class="sdc-modal-top-bar-buttons"> - <span ng-click="delete(editPropertyModel.property)" data-ng-class="{'disabled' : isPropertyValueOwner()||editPropertyModel.property.readonly}" class="sprite-new delete-btn" data-tests-id="delete_property" sdc-smart-tooltip="">Delete</span> - <span class="delimiter"></span> - <span data-ng-click="getPrev()" data-ng-class="{'disabled' : !currentPropertyIndex }" class="sprite-new left-arrow" data-tests-id="get-prev" sdc-smart-tooltip="">Previous</span> - <span data-ng-click="getNext()" data-ng-class="{'disabled' : isLastProperty }" class="sprite-new right-arrow" data-tests-id="get-next" sdc-smart-tooltip="">Next</span> - </div> - </div> - - <div class="sdc-edit-property-form-container" > - <perfect-scrollbar scroll-y-margin-offset="0" include-padding="true" class="scrollbar-container"> - <form novalidate class="w-sdc-form two-columns" name="forms.editForm" > - - <div class="w-sdc-form-columns-wrapper"> - - <div class="w-sdc-form-column"> - - <!-- Name --> - <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.propertyName.$dirty && forms.editForm.propertyName.$invalid)}"> - <label class="i-sdc-form-label" ng-class="{'required': !isService}">Name</label> - <input class="i-sdc-form-input" - data-tests-id="propertyName" - data-ng-maxlength="50" - data-ng-disabled="!isNew || editPropertyModel.property.readonly" - maxlength="50" - data-ng-model="editPropertyModel.property.name" - type="text" - name="propertyName" - data-ng-pattern="propertyNameValidationPattern" - data-required - data-ng-model-options="{ debounce: 200 }" - autofocus /> - - <div class="input-error" data-ng-show="forms.editForm.propertyName.$dirty && forms.editForm.propertyName.$invalid"> - <span ng-show="forms.editForm.propertyName.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Property name' }"></span> - <span ng-show="forms.editForm.propertyName.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '128' }"></span> - <span ng-show="forms.editForm.propertyName.$error.pattern" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED"></span> - </div> - - </div> - - <!-- Input source --> - <!--div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.source.$dirty && forms.editForm.source.$invalid)}"> - <label class="i-sdc-form-label required">Input Source</label> - <select class="i-sdc-form-select" - data-required - name="source" - data-ng-model="editPropertyModel.property.source" - data-ng-options="source for source in editPropertyModel.sources"> - <option value="" >Choose Input Source</option> - </select> - <sdc-error-tooltip data-ng-show="forms.editForm.source.$dirty && forms.editForm.source.$invalid"> - <span ng-show="forms.editForm.source.$error.required">source is required.</span> - </sdc-error-tooltip> - </div--> - - - </div> - - <div class="w-sdc-form-column"> - <div class="w-sdc-form-columns-wrapper"> - <div class="w-sdc-form-column"> - <!-- Type --> - <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.type.$dirty && forms.editForm.type.$invalid)}"> - <label class="i-sdc-form-label" ng-class="{'required': !isService}">Type</label> - <select class="i-sdc-form-select" - data-tests-id="propertyType" - data-required - data-ng-disabled="isPropertyValueOwner() || editPropertyModel.property.readonly" - name="type" - data-ng-change="onTypeChange()" - data-ng-model="editPropertyModel.property.type"> - <option value="">Choose Type</option> - <option data-ng-repeat="type in editPropertyModel.types" - value="{{type}}">{{type}}</option> - <option data-ng-repeat="type in nonPrimitiveTypes" - value="{{type}}">{{type.replace("org.openecomp.datatypes.heat.","")}}</option> - </select> - - <div class="input-error" data-ng-show="forms.editForm.type.$dirty && forms.editForm.type.$invalid"> - <span ng-show="forms.editForm.type.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Type' }"></span> - </div> - </div> - </div> - <div class="w-sdc-form-column" data-ng-if="showSchema()"> - <!-- Entry Schema --> - <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.schemaType.$dirty && forms.editForm.schemaType.$invalid)}"> - <label class="i-sdc-form-label required">Entry Schema</label> - <select class="i-sdc-form-select" - data-required - data-tests-id="schema-type" - data-ng-disabled="isPropertyValueOwner() || editPropertyModel.property.readonly" - name="schemaType" - data-ng-change="onSchemaTypeChange()" - data-ng-model="editPropertyModel.property.schema.property.type"> - <option value="">Choose Schema Type</option> - <option data-ng-repeat="type in editPropertyModel.simpleTypes" - value="{{type}}">{{type}}</option> - <option data-ng-repeat="type in nonPrimitiveTypes" - value="{{type}}">{{type.replace("org.openecomp.datatypes.heat.","")}}</option> - </select> - - <div class="input-error" data-ng-show="forms.editForm.schemaType.$dirty && forms.editForm.schemaType.$invalid"> - <span ng-show="forms.editForm.schemaType.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Entry schema' }"></span> - </div> - </div> - </div> - </div> - - <!-- Constraints by type --> - <div class="i-sdc-form-item" data-ng-if="false"> - <label class="i-sdc-form-label required">Constraints by type</label> - <div> - Should be constraints by type(TBD) - </div> - </div> - - </div> - - </div> - <!-- Description --> - <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.description.$dirty && forms.editForm.description.$invalid)}"> - <label class="i-sdc-form-label">Description</label> - <textarea class="i-sdc-form-textarea" - data-ng-maxlength="256" - data-ng-disabled="isPropertyValueOwner() || editPropertyModel.property.readonly" - maxlength="256" - data-ng-pattern="commentValidationPattern" - name="description" - data-ng-model="editPropertyModel.property.description" - data-ng-model-options="{ debounce: 200 }" - data-tests-id="description" - ></textarea> - - <div class="input-error" data-ng-show="forms.editForm.description.$dirty && forms.editForm.description.$invalid"> - <span ng-show="forms.editForm.description.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '256' }"></span> - <span ng-show="forms.editForm.description.$error.pattern" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED"></span> - <span ng-show="forms.editForm.description.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Description' }"></span> - </div> - </div> - <!-- Default value --> - - <div data-ng-if="dataTypes" class="default-value-section i-sdc-form-item"> - <label class="i-sdc-form-label">Default Value</label> - <div data-ng-if="isTypeDataType"> - <fields-structure value-obj-ref="myValue" - type-name="editPropertyModel.property.type" - parent-form-obj="forms.editForm" - fields-prefix-name="currentPropertyIndex" - read-only="editPropertyModel.property.readonly && !isPropertyValueOwner()" - default-value="{{getDefaultValue()}}" - types="dataTypes" - expand-by-default="true"></fields-structure> - - </div> - <div data-ng-if="!isTypeDataType" ng-switch="editPropertyModel.property.type"> - <div ng-switch-when="map"> - <type-map value-obj-ref="myValue" - schema-property="editPropertyModel.property.schema.property" - parent-form-obj="forms.editForm" - fields-prefix-name="currentPropertyIndex" - read-only="editPropertyModel.property.readonly && !isPropertyValueOwner()" - default-value="{{getDefaultValue()}}" - types="dataTypes" - max-length="maxLength"></type-map> - </div> - <div ng-switch-when="list"> - <type-list value-obj-ref="myValue" - schema-property="editPropertyModel.property.schema.property" - parent-form-obj="forms.editForm" - fields-prefix-name="currentPropertyIndex" - read-only="editPropertyModel.property.readonly && !isPropertyValueOwner()" - default-value="{{getDefaultValue()}}" - types="dataTypes" - max-length="maxLength"></type-list> - </div> - <div ng-switch-default> - <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.value.$dirty && forms.editForm.value.$invalid)}"> - <input class="i-sdc-form-input" - data-tests-id="defaultvalue" - ng-if="!((editPropertyModel.property.simpleType||editPropertyModel.property.type) == 'boolean')" - data-ng-maxlength="maxLength" - data-ng-disabled="editPropertyModel.property.readonly && !isPropertyValueOwner()" - maxlength="{{maxLength}}" - data-ng-model="editPropertyModel.property.value" - type="text" - name="value" - data-ng-pattern="getValidationPattern((editPropertyModel.property.simpleType||editPropertyModel.property.type))" - data-ng-model-options="{ debounce: 200 }" - data-ng-change="!forms.editForm.value.$error.pattern && ('integer'==editPropertyModel.property.type && forms.editForm.value.$setValidity('pattern', validateIntRange(editPropertyModel.property.value)) || onValueChange())" - autofocus /> - <select class="i-sdc-form-select" - data-tests-id="booleantype" - ng-if="(editPropertyModel.property.simpleType||editPropertyModel.property.type) == 'boolean'" - data-ng-disabled="editPropertyModel.property.readonly && !isPropertyValueOwner()" - name="value" - data-ng-change="onValueChange()" - data-ng-model="editPropertyModel.property.value"> - <option value="true">true</option> - <option value="false">false</option> - </select> - - <div class="input-error" data-ng-show="forms.editForm.value.$dirty && forms.editForm.value.$invalid"> - <span ng-show="forms.editForm.value.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Property' }"></span> - <span ng-show="forms.editForm.value.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '{{maxLength}}' }"></span> - <span ng-show="forms.editForm.value.$error.pattern" translate="PROPERTY_EDIT_PATTERN"></span> - <span ng-show="forms.editForm.value.$error.customValidation" translate="PROPERTY_EDIT_MAP_UNIQUE_KEYS"></span> - </div> - </div> - </div> - </div> - </div> - <span class="w-sdc-form-note" data-ng-show="forms.editForm.$invalid && false" translate="LABEL_ALL_FIELDS_ARE_MANDATORY"></span> - </form> - </perfect-scrollbar> - </div> - -</sdc-modal> diff --git a/catalog-ui/app/scripts/view-models/forms/property-form/property-form.less b/catalog-ui/app/scripts/view-models/forms/property-form/property-form.less deleted file mode 100644 index 15e30af4ee..0000000000 --- a/catalog-ui/app/scripts/view-models/forms/property-form/property-form.less +++ /dev/null @@ -1,63 +0,0 @@ -.sdc-edit-property-container { - .scrollbar-container{ - height: 415px; - width: 830px; - .perfect-scrollbar; - } - - form{ - width: 813px; - [name="description"]{ - min-height:50px; - } - } - - .sdc-modal-top-bar{ - height: 40px; - .sdc-modal-top-bar-buttons { - float: right; - - > span:not(.delimiter){ - vertical-align: middle; - .hand; - - &.sprite-new { - text-indent: 100%; - } - &.disabled, &:hover.disabled { - pointer-events: none; - } - } - - .delete-btn{ - margin-right: 6px; - } - - .left-arrow{ - margin-right: 8px; - } - - .delimiter { - height: 20px; - width: 1px; - background-color: #959595; - display: inline-block; - vertical-align: middle; - margin-right: 10px; - } - } - } - - .w-sdc-form-note { - .h_9; - display: block; - position: relative; - top: 13px; - } - - .default-value-section{ - border-top: solid 1px @main_color_a; - padding-top: 15px; - margin-top: 15px; - } -} diff --git a/catalog-ui/app/scripts/view-models/forms/resource-instance-name-form/resource-instance-name-model.ts b/catalog-ui/app/scripts/view-models/forms/resource-instance-name-form/resource-instance-name-model.ts deleted file mode 100644 index b69bf4a2a6..0000000000 --- a/catalog-ui/app/scripts/view-models/forms/resource-instance-name-form/resource-instance-name-model.ts +++ /dev/null @@ -1,105 +0,0 @@ -/*- - * ============LICENSE_START======================================================= - * SDC - * ================================================================================ - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. - * ================================================================================ - * 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. - * ============LICENSE_END========================================================= - */ -/// <reference path="../../../references"/> - -module Sdc.ViewModels { - 'use strict'; - - interface IResourceInstanceViewModelScope extends ng.IScope { - - componentInstanceModel: Sdc.Models.ComponentsInstances.ComponentInstance; - validationPattern: RegExp; - oldName:string; - isAlreadyPressed:boolean; - footerButtons: Array<any>; - forms:any; - modalInstanceName:ng.ui.bootstrap.IModalServiceInstance; - - save(): void; - close(): void; - } - - export class ResourceInstanceNameViewModel { - - static '$inject' = [ - '$scope', - 'ValidationPattern', - '$modalInstance', - 'ComponentInstanceFactory', - 'component' - ]; - - - constructor(private $scope:IResourceInstanceViewModelScope, - private ValidationPattern:RegExp, - private $modalInstance:ng.ui.bootstrap.IModalServiceInstance, - private ComponentInstanceFactory:Utils.ComponentInstanceFactory, - private component:Models.Components.Component) { - - this.initScope(); - } - - - private initScope = ():void => { - this.$scope.forms = {}; - this.$scope.validationPattern = this.ValidationPattern; - this.$scope.componentInstanceModel = Utils.ComponentInstanceFactory.createComponentInstance(this.component.selectedInstance); - this.$scope.oldName = this.component.selectedInstance.name; - this.$scope.modalInstanceName = this.$modalInstance; - - this.$scope.isAlreadyPressed = false; - - - this.$scope.close = ():void => { - this.$modalInstance.dismiss(); - }; - - this.$scope.save = ():void => { - - let onFailed = () => { - this.$scope.isAlreadyPressed = true; - }; - - let onSuccess = (componentInstance:Models.ComponentsInstances.ComponentInstance) => { - this.$modalInstance.close(); - this.$scope.isAlreadyPressed = false; - this.$scope.componentInstanceModel = componentInstance; - //this.component.name = componentInstance.name;//DE219124 - this.component.selectedInstance.name = componentInstance.name; - - }; - - this.$scope.isAlreadyPressed = true; - if (this.$scope.oldName != this.$scope.componentInstanceModel.name) { - this.component.updateComponentInstance(this.$scope.componentInstanceModel).then(onSuccess, onFailed); - } - }; - - this.$scope.footerButtons = [ - {'name': 'OK', 'css': 'blue', 'callback': this.$scope.save, 'disabled': (!this.$scope.componentInstanceModel.name || this.$scope.componentInstanceModel.name === this.$scope.oldName) || this.$scope.isAlreadyPressed}, - {'name': 'Cancel', 'css': 'grey', 'callback': this.$scope.close} - ]; - - this.$scope.$watch("forms.editNameForm.$invalid", (newVal, oldVal) => { - this.$scope.footerButtons[0].disabled = this.$scope.forms.editNameForm.$invalid; - }); - } - } -} diff --git a/catalog-ui/app/scripts/view-models/forms/resource-instance-name-form/resource-instance-name-view.html b/catalog-ui/app/scripts/view-models/forms/resource-instance-name-form/resource-instance-name-view.html deleted file mode 100644 index e04343adbd..0000000000 --- a/catalog-ui/app/scripts/view-models/forms/resource-instance-name-form/resource-instance-name-view.html +++ /dev/null @@ -1,72 +0,0 @@ -<sdc-modal modal="modalInstanceName" type="classic" class="w-sdc-modal-resource-instance-name modal-type-confirmation" buttons="footerButtons" header="Instance Name" show-close-button="true"> - - <form novalidate class="w-sdc-form" name="forms.editNameForm"> - <div class="i-sdc-form-item" data-ng-class="{error:(editNameForm.componentInstanceName.$dirty && editNameForm.resourceInstanceName.$invalid)}"> - <label class="i-sdc-form-label required">Instance Name</label> - <input class="w-sdc-modal-resource-instance-input i-sdc-form-input" - name="componentInstanceName" - data-ng-maxlength="50" - data-ng-model="componentInstanceModel.name" - type="text" - data-required - data-ng-pattern="validationPattern" - maxlength="50" - autofocus - placeholder="Enter instance name..." - data-tests-id="instanceName" - /> - - <div class="input-error" data-ng-show="forms.editNameForm.componentInstanceName.$dirty && forms.editNameForm.componentInstanceName.$invalid"> - <span ng-show="forms.editNameForm.componentInstanceName.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Resource name' }"></span> - <span ng-show="forms.editNameForm.componentInstanceName.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '50' }"></span> - <span ng-show="forms.editNameForm.componentInstanceName.$error.pattern" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED"></span> - </div> - - </div> - </form> - -</sdc-modal> - - - -<!-- - -<div class="w-sdc-modal w-sdc-modal-resource-instance-name"> - <header> - <div class="w-sdc-modal-head"> - Instance Name - </div> - </header> - <div> - <form novalidate class="w-sdc-modal-body w-sdc-form" name="editNameForm"> - <div class="i-sdc-form-item" data-ng-class="{error:(editNameForm.componentInstanceName.$dirty && editNameForm.resourceInstanceName.$invalid)}"> - <label class="i-sdc-form-label required">Instance Name</label> - <input class="w-sdc-modal-resource-instance-input i-sdc-form-input" - name="componentInstanceName" - data-ng-maxlength="50" - data-ng-model="componentInstanceModel.name" - type="text" - data-required - data-ng-pattern="validationPattern" - maxlength="50" - autofocus - placeholder="Enter instance name..." - data-tests-id="instanceName" - /> - - <div class="input-error" data-ng-show="editNameForm.componentInstanceName.$dirty && editNameForm.componentInstanceName.$invalid"> - <span ng-show="editNameForm.componentInstanceName.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Resource name' }"></span> - <span ng-show="editNameForm.componentInstanceName.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '50' }"></span> - <span ng-show="editNameForm.componentInstanceName.$error.pattern" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED"></span> - </div> - - </div> - </form> - - <div class="w-sdc-modal-action"> - <button class="w-sdc-btn-blue" data-ng-click="save()" type="button" data-ng-disabled="(!componentInstanceModel.name || componentInstanceModel.name === oldName) || isAlreadyPressed">Ok</button> - <button class="w-sdc-btn-dark-gray" data-ng-click="close()" type="button">Cancel</button> - </div> - </div> -</div> ---> diff --git a/catalog-ui/app/scripts/view-models/forms/resource-instance-name-form/resource-instance-name.less b/catalog-ui/app/scripts/view-models/forms/resource-instance-name-form/resource-instance-name.less deleted file mode 100644 index 57698bef17..0000000000 --- a/catalog-ui/app/scripts/view-models/forms/resource-instance-name-form/resource-instance-name.less +++ /dev/null @@ -1,29 +0,0 @@ -.w-sdc-modal-resource-instance-name { - - .w-sdc-modal-body { - overflow: visible; - } - - .w-sdc-modal-action { - display: flex; - align-items: center; - justify-content: center; - } - - .w-sdc-modal-resource-instance-input { - .p_1; - border: solid 1px @color_p; - height: 45px; - padding: 0 20px; - margin: 0 auto 0 auto; - display: block; - } - .w-sdc-modal-body { - border-bottom: none; - } - - .w-sdc-form .i-sdc-form-item.error::after { - top: 13px; - } - -} |