gerrit.onap Code Review - sdc.git/blob

   1 <div class="workspace-deployment-artifact">
   2
   3     <div data-tests-id="add-deployment-artifact-button" ng-if="!isViewMode()" data-ng-class="{'disabled': isDisableMode()}" data-tests-id="add-property-button" class="add-btn" data-ng-click="addOrUpdate({})">Add</div>
   4
   5     <div class="table-container-flex">
   6
   7         <div class="table" data-ng-class="{'view-mode': isViewMode()}">
   8             <loader data-display="isLoading"></loader>
   9             <div class="head flex-container">
  10                 <div class="table-header head-row hand flex-item" data-ng-repeat="header in tableHeadersList track by $index" data-ng-click="sort(header.property)">{{header.title}}
  11                     <span data-ng-if="sortBy === header.property" class="table-header-sort-arrow" data-ng-class="{'down': reverse, 'up':!reverse}"> </span>
  12                 </div>
  13                 <div class="table-no-text-header head-row flex-item"></div>
  14             </div>
  15
  16             <form class="body" name="editForm">
  17
  18                 <perfect-scrollbar scroll-y-margin-offset="0" include-padding="true" class="scrollbar-container">
  19
  20                     <!-- Artifact row -->
  21                     <div ng-if="noArtifactsToShow()" data-ng-class="{'disabled': isDisableMode()}" class="no-row-text" translate="DEPLOYMENT_ARTIFACT_NO_ARTIFACTS_TO_DISPLAY"></div>
  22                     <div data-ng-repeat-start="artifact in artifacts | orderBy:sortBy:reverse track by $index"
  23                          class="flex-container data-row"
  24                          data-ng-class="{'selected': artifact.selected || undefined==artifact.selected && updateInProgress}"
  25                          data-ng-if="artifact.esId">
  26
  27                         <div class="table-col-general flex-item"  data-ng-click="update(artifact)">
  28
  29                             <span class="sprite table-arrow" data-tests-id="{{artifact.artifactDisplayName}}" data-ng-class="{'opened': artifact.selected || undefined==artifact.selected && updateInProgress}"></span>
  30                             {{artifact.artifactDisplayName}}
  31                         </div>
  32
  33                         <div class="table-col-general flex-item" data-tests-id="{{artifact.artifactType}}">
  34                             {{artifact.artifactType}}
  35                         </div>
  36                         <div class="table-col-general flex-item" data-tests-id="{{artifact.timeout}}">
  37                             {{artifact.timeout? artifact.timeout:''}}
  38                         </div>
  39
  40                         <div class="table-btn-col flex-item">
  41                             <button class="table-edit-btn" data-tests-id="edit_{{artifact.artifactDisplayName}}"
  42                                     data-ng-if="!isViewMode() && !artifact.isHEAT() && !artifact.isThirdParty() && !isLicenseArtifact(artifact)" data-ng-click="addOrUpdate(artifact)"></button>
  43                             <button class="table-delete-btn" data-tests-id="delete_{{artifact.artifactDisplayName}}"
  44                                     data-ng-if="!isViewMode() && !artifact.isHEAT() && !artifact.isThirdParty() && !isLicenseArtifact(artifact)" data-ng-click="delete(artifact)"> </button>
  45                              <button class="table-download-btn" download-artifact  data-tests-id="download_{{artifact.artifactDisplayName}}"
  46                                      data-ng-if="artifact.artifactName" component="component" artifact="artifact"></button>
  47
  48
  49                         </div>
  50                     </div>
  51                     <div data-ng-repeat-end="" data-ng-if="artifact.selected || undefined==artifact.selected && updateInProgress" class="w-sdc-form item-opened">
  52                         <!-- Artifact panel opened -->
  53
  54                         <!-- Description field -->
  55                         <div class="w-sdc-form-item" ng-form="descriptionForm" data-ng-class="{error:(descriptionForm.$dirty && descriptionForm.$invalid)}">
  56                             <label class="i-sdc-env-form-label required">Description</label>
  57                                 <textarea class="i-sdc-form-textarea {{$index}}" data-ng-class="{'view-mode': isViewMode()}"
  58                                           data-ng-maxlength="256"
  59                                           maxlength="256"
  60                                           data-ng-required="true"
  61                                           name="description"
  62                                           data-ng-model="artifact.description"
  63                                           data-ng-model-options="{ debounce: 200 }"
  64                                           data-ng-pattern="getValidationPattern('string')"
  65                                           ng-readonly="isViewMode()"
  66                                           data-tests-id="description">
  67                                 </textarea>
  68
  69                             <div class="input-error" data-ng-show="descriptionForm.$dirty && descriptionForm.$invalid">
  70                                 <span ng-show="descriptionForm.$error.required" translate="ADD_ARTIFACT_ERROR_DESCRIPTION_REQUIRED"></span>
  71                                 <span ng-show="descriptionForm.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '256' }"></span>
  72                                 <span ng-show="descriptionForm.$error.pattern" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED"></span>
  73                             </div>
  74
  75                         </div>
  76
  77                         <!-- Parameters in 2 columns -->
  78                         <div class="w-sdc-form-columns-wrapper" data-ng-if="artifact.heatParameters">
  79                             <!-- Left column -->
  80                             <div class="w-sdc-form-column">
  81                                 <div class="i-sdc-form-item" ng-form="parameterForm"
  82                                      data-ng-repeat="parameter in artifact.heatParameters.slice(0, artifact.heatParameters.length%2+artifact.heatParameters.length/2) track by $index">
  83                                     <label class="i-sdc-env-form-label" data-ng-class="{required:parameter.defaultValue}" tooltip-side="top" sdc-smart-tooltip>{{parameter.name +' (' + parameter.type + ')'}}</label>
  84                                     <span class="parameter-description" tooltips tooltip-side="top" tooltip-content="{{parameter.description}}">?</span>
  85                                     <input class="i-sdc-form-input" data-ng-class="{error:(parameterForm.currentValue.$invalid),'view-mode': isViewMode() }"
  86                                            data-ng-model-options="{ debounce: 200 }"
  87                                            data-ng-model="parameter.currentValue"
  88                                            type="text"
  89                                            name="currentValue"
  90                                            data-ng-pattern="getValidationPattern(parameter.type, 'heat')"
  91                                            data-ng-required="parameter.defaultValue"
  92                                            data-ng-change="'json'==parameter.type && parameterForm.currentValue.$setValidity('pattern', validateJson(parameter.currentValue))"
  93                                            data-ng-blur="!parameterForm.currentValue.$error.pattern && resetValue(parameter)"
  94                                         />
  95
  96                                     <div class="input-error" data-ng-show="parameterForm.currentValue.$invalid">
  97                                         <span ng-show="parameterForm.currentValue.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Value'}"></span>
  98                                         <span ng-show="parameterForm.currentValue.$error.pattern && parameter.type==='string'" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED"></span>
  99                                         <span ng-show="parameterForm.currentValue.$error.pattern && !(parameter.type==='string')" translate="VALIDATION_ERROR_TYPE" translate-values="{'type': '{{parameter.type}}'}"></span>
 100                                     </div>
 101                                 </div>
 102                             </div>
 103
 104                             <!-- Right column -->
 105                             <div class="w-sdc-form-column">
 106                                 <div class="i-sdc-form-item" ng-form="parameterForm" data-ng-repeat="parameter in artifact.heatParameters.slice(artifact.heatParameters.length%2+artifact.heatParameters.length/2) track by $index">
 107                                     <label class="i-sdc-env-form-label" data-ng-class="{required:parameter.defaultValue}" tooltip-side="top" sdc-smart-tooltip>{{parameter.name +' (' + parameter.type + ')'}}</label>
 108                                     <span class="parameter-description" tooltips tooltip-side="top" tooltip-content="{{parameter.description}}">?</span>
 109                                     <input class="i-sdc-form-input" data-ng-class="{error:(parameterForm.currentValue.$invalid), 'view-mode': isViewMode()}"
 110                                            data-ng-model-options="{ debounce: 200 }"
 111                                            data-ng-model="parameter.currentValue"
 112                                            type="text"
 113                                            name="currentValue"
 114                                            data-ng-pattern="getValidationPattern(parameter.type, 'heat')"
 115                                            data-ng-required="parameter.defaultValue"
 116                                            data-ng-change="'json'==parameter.type && parameterForm.currentValue.$setValidity('pattern', validateJson(parameter.currentValue))"
 117                                            data-ng-blur="!parameterForm.currentValue.$error.pattern && resetValue(parameter)"
 118                                         />
 119
 120                                     <div class="input-error" data-ng-show="parameterForm.currentValue.$invalid">
 121                                         <span ng-show="parameterForm.currentValue.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Value'}"></span>
 122                                         <span ng-show="parameterForm.currentValue.$error.pattern && parameter.type==='string'" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED"></span>
 123                                         <span ng-show="parameterForm.currentValue.$error.pattern && !(parameter.type==='string')" translate="VALIDATION_ERROR_TYPE" translate-values="{'type': '{{parameter.type}}'}"></span>
 124                                     </div>
 125                                 </div>
 126                             </div>
 127
 128
 129                         </div><!-- Close: Parameters in 2 columns -->
 130                     </div><!-- Close: Artifact panel opened -->
 131
 132                     <!-- Add artifacts buttons -->
 133                     <button class="add-button" data-ng-repeat="artifact in artifacts track by $index"
 134                             type="button"
 135                             data-ng-show="!artifact.esId"
 136                             data-ng-if="!viewModeOrCsarComponent()"
 137                             data-ng-class="{'disabled': isDisableMode() || component.isCsarComponent()}"
 138                             data-tests-id="{{artifact.artifactDisplayName}} deployment_artifact"
 139                             translate="DEPLOYMENT_ARTIFACT_BUTTON_ADD_HEAT"
 140                             translate-values="{'name': '{{artifact.artifactDisplayName}}'}"
 141                             data-ng-click="addOrUpdate(artifact)"></button>
 142
 143                     <!-- Top add button -->
 144                     <button class="add-button" type="button" data-ng-if="!isViewMode()" data-ng-class="{'disabled': isDisableMode()}" translate="DEPLOYMENT_ARTIFACT_BUTTON_ADD_OTHER" data-ng-click="addOrUpdate({})"></button>
 145                 </perfect-scrollbar>
 146             </form>
 147         </div>
 148     </div>
 149 </div>