src/main/resources/META-INF/resources/designer/partials/portfolios/operational_policy_window.html

   1 <!--
   2   ============LICENSE_START=======================================================
   3   ONAP CLAMP
   4   ================================================================================
   5   Copyright (C) 2017-2018 AT&T Intellectual Property. All rights
   6                               reserved.
   7   ================================================================================
   8   Licensed under the Apache License, Version 2.0 (the "License");
   9   you may not use this file except in compliance with the License.
  10   You may obtain a copy of the License at
  11
  12   http://www.apache.org/licenses/LICENSE-2.0
  13
  14   Unless required by applicable law or agreed to in writing, software
  15   distributed under the License is distributed on an "AS IS" BASIS,
  16   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  17   See the License for the specific language governing permissions and
  18   limitations under the License.
  19   ============LICENSE_END============================================
  20   ===================================================================
  21
  22   -->
  23
  24
  25 <style>
  26 .disabled {
  27         background-color: #dddd;
  28 }
  29
  30 label {
  31         text-align: right;
  32         vertical-align: middle;
  33 }
  34
  35 .leftPolicyPanel {
  36         padding: 0 10px 0 0;
  37 }
  38
  39 .idError {
  40         color: red;
  41         padding: 50px 0px;
  42         text-align: center;
  43         display: none;
  44 }
  45
  46 .policyPanel {
  47         background-color: #f5f5f5;
  48         padding: 15px 5px 0 5px;
  49 }
  50
  51 .form-group.clearfix {
  52         display: -webkit-flex;
  53         display: flex;
  54         align-items: center;
  55 }
  56
  57 label {
  58         margin-bottom: 0px;
  59 }
  60
  61 #policyTable {
  62         cursor: pointer;
  63         width: 100%;
  64 }
  65
  66 #policyTable tr {
  67         border-bottom: 1px solid #ddd;
  68         border-collapse: collapse;
  69         text-align: left;
  70         font-size: 12px;
  71         font-weight: normal;
  72 }
  73
  74 #policyTable td {
  75         padding: 8px 10px;
  76 }
  77
  78 #policyTable tr.highlight {
  79         background-color: #f5f5f5;
  80         font-weight: bold;
  81         font-size: 13px;
  82 }
  83
  84 #policyTableHolder {
  85         height: 200px;
  86         width: 100%;
  87         overflow: auto;
  88 }
  89 </style>
  90
  91
  92 <div attribute-test="policywindowproperties" id="configure-widgets"
  93         class="disabled-block-container">
  94         <div attribute-test="policywindowpropertiesh" class="modal-header">
  95                 <button type="button" class="close" ng-click="close(false)"
  96                         aria-hidden="true" style="margin-top: -3px">&times;</button>
  97                 <h4>Operational Policy</h4>
  98         </div>
  99
 100
 101         <div class="modal-body">
 102                 <div attribute-test="policywindowpropertiesb" class="modal-body row">
 103
 104                         <div class="panel panel-default col-sm-9 policyPanel">
 105                                 <form id="operationalPolicyHeaderForm" class="form-horizontal">
 106                                         <div>
 107                                                 <div class="form-group clearfix row">
 108                                                         <label class="col-sm-2">Parent policy</label>
 109                                                         <div class="col-sm-3" style="padding: 0px;">
 110                                                                 <select type="text" id="trigger_policy" name="trigger_policy"
 111                                                                         class="form-control" ng-model="null_dump"
 112                                                                         ng-init="initPolicySelect()"
 113                                                                         ng-options="policy for policy in policy_ids track by policy"></select>
 114                                                         </div>
 115
 116                                                         <label for="timeout" class="col-sm-3"
 117                                                                 style="padding-left: 5px; padding-right: 10px;">Overall
 118                                                                 Time Limit</label>
 119                                                         <div class="col-sm-2" style="padding-left: 0px;">
 120                                                                 <input type="text" ng-pattern="/^[0-9]*$/" ng-model="number"
 121                                                                         class="form-control" id="timeout" name="timeout">
 122                                                         </div>
 123
 124                                                         <label for="abatement" class="col-sm-2">Abatement</label>
 125                                                         <div class="col-sm-3" style="padding: 0px;">
 126                                                                 <input type="checkbox" id="abatement" name="abatement"
 127                                                                         checked="true" class="form-control">
 128                                                         </div>
 129                                                 </div>
 130                                         </div>
 131                                 </form>
 132                                 <div class="panel-heading" style="background-color: white;">
 133                                         <ul id="nav_Tabs" class="nav nav-tabs">
 134                                                 <li class><a id="add_one_more" href="#desc_tab"><span
 135                                                                 class="glyphicon glyphicon-plus" aria-hidden="true"></span></a></li>
 136                                         </ul>
 137                                 </div>
 138                                 <div class="panel-body">
 139                                         <div class="tab-content">
 140                                                 <div id="properties_tab" class="tab-pane fade in active"></div>
 141                                         </div>
 142                                 </div>
 143                         </div>
 144
 145                         <span id="formSpan" style="display: none">
 146                                 <form class="policyProperties" class="form-horizontal"
 147                                         style="border: 2px dotted gray;"
 148                                         title="Operational Policy Properties">
 149
 150                                         <div class="form-group clearfix">
 151                                                 <label class="col-sm-4 control-label" for="id">ID</label>
 152                                                 <div class="col-sm-8">
 153                                                         <input type="text" class="form-control" name="id" id="id"
 154                                                                 ng-keyup="updateTabLabel($event)" />
 155                                                 </div>
 156                                         </div>
 157                                         <div class="form-group clearfix">
 158                                                 <label class="col-sm-4 control-label" for="recipe">Recipe</label>
 159                                                 <div class="col-sm-8">
 160                                                         <select class="form-control" name="recipe" id="recipe"
 161                                                                 enableFilter="true"
 162                                                                 ng-click="updateGuardRecipe($event);initTargetResourceId()"
 163                                                                 ng-model="recipe">
 164                                                                 <option value="Restart">Restart</option>
 165                                                                 <option value="Rebuild">Rebuild</option>
 166                                                                 <option value="Migrate">Migrate</option>
 167                                                                 <option value="Health-Check">Health-Check</option>
 168                                                                 <option value="ModifyConfig">ModifyConfig</option>
 169                                                                 <option value="VF Module Create">VF Module Create</option>
 170                                                                 <option value="VF Module Delete">VF Module Delete</option>
 171                                                                 <option value="Reroute">Reroute</option>
 172                                                         </select>
 173                                                 </div>
 174                                         </div>
 175                                         <div class="form-group clearfix">
 176                                                 <label for="retry" class="col-sm-4 control-label"> Retry</label>
 177                                                 <div class="col-sm-8">
 178                                                         <input type="text" maxlength="5" class="form-control" id="retry"
 179                                                                 ng-pattern="/^[0-9]*$/" ng-model="number" name="retry">
 180                                                         </input>
 181                                                 </div>
 182                                         </div>
 183                                         <div class="form-group clearfix">
 184                                                 <label for="timeout" class="col-sm-4 control-label">
 185                                                         Timeout</label>
 186                                                 <div class="col-sm-8">
 187                                                         <input type="text" maxlength="5" class="form-control"
 188                                                                 id="timeout" ng-pattern="/^[0-9]*$/" ng-model="number"
 189                                                                 name="timeout"></input>
 190                                                 </div>
 191                                         </div>
 192
 193                                         <div class="form-group clearfix">
 194                                                 <label for="actor" class="col-sm-4 control-label"> Actor</label>
 195                                                 <div class="col-sm-8">
 196                                                         <select class="form-control" id="actor" name="actor">
 197                                                                 <option value="APPC">APPC</option>
 198                                                                 <option value="SO">SO</option>
 199                                                                 <option value="VFC">VFC</option>
 200                                                                 <option value="SDNC">SDNC</option>°
 201                                                                 <option value="SDNR">SDNR</option>°
 202                                                         </select>
 203                                                 </div>
 204
 205                                                 <label for="payload" class="col-sm-4 control-label">
 206                                                         Payload (YAML)</label>
 207                                                 <div class="col-sm-8">
 208                                                         <textarea class="form-control" id="payload" name="payload"></textarea>
 209                                                 </div>
 210                                         </div>
 211                                         <div class="form-group clearfix">
 212                                                 <label for="success" class="col-sm-4 control-label">When
 213                                                         Success</label>
 214                                                 <div class="col-sm-8">
 215                                                         <select class="form-control" id="success" name="success"
 216                                                                 ng-model="null_dump"
 217                                                                 ng-options="policy for policy in policy_ids track by policy"></select>
 218                                                 </div>
 219                                         </div>
 220                                         <div class="form-group clearfix">
 221                                                 <label for="failure" class="col-sm-4 control-label">When
 222                                                         Failure</label>
 223                                                 <div class="col-sm-8">
 224                                                         <select class="form-control" id="failure" name="failure"
 225                                                                 ng-model="null_dump"
 226                                                                 ng-options="policy for policy in policy_ids track by policy"></select>
 227                                                 </div>
 228                                         </div>
 229                                         <div class="form-group clearfix">
 230                                                 <label for="failure_timeout" class="col-sm-4 control-label">When
 231                                                         Failure Timeout</label>
 232                                                 <div class="col-sm-8">
 233                                                         <select class="form-control" id="failure_timeout"
 234                                                                 name="failure_timeout" ng-model="null_dump"
 235                                                                 ng-options="policy for policy in policy_ids track by policy"></select>
 236                                                 </div>
 237                                         </div>
 238                                         <div class="form-group clearfix">
 239                                                 <label for="failure_retries" class="col-sm-4 control-label">When
 240                                                         Failure Retries</label>
 241                                                 <div class="col-sm-8">
 242                                                         <select class="form-control" id="failure_retries"
 243                                                                 name="failure_retries" ng-model="null_dump"
 244                                                                 ng-options="policy for policy in policy_ids track by policy"></select>
 245                                                 </div>
 246                                         </div>
 247                                         <div class="form-group clearfix">
 248                                                 <label for="failure_exception" class="col-sm-4 control-label">When
 249                                                         Failure Exception</label>
 250                                                 <div class="col-sm-8">
 251                                                         <select class="form-control" id="failure_exception"
 252                                                                 name="failure_exception" ng-model="null_dump"
 253                                                                 ng-options="policy for policy in policy_ids track by policy"></select>
 254                                                 </div>
 255                                         </div>
 256                                         <div class="form-group clearfix">
 257                                                 <label for="failure_guard" class="col-sm-4 control-label">When
 258                                                         Failure Guard</label>
 259                                                 <div class="col-sm-8">
 260                                                         <select class="form-control" id="failure_guard"
 261                                                                 name="failure_guard" ng-model="null_dump"
 262                                                                 ng-options="policy for policy in policy_ids track by policy"></select>
 263                                                 </div>
 264                                         </div>
 265                                 </form>
 266                                 <form class="policyTarget" class="form-horizontal"
 267                                         title="Operational Policy Target" style="border: 2px dotted gray;">
 268                                         <div class="form-group clearfix">
 269                                                 <label for="type" class="col-sm-4 control-label"> Target
 270                                                         Type</label>
 271                                                 <div class="col-sm-8">
 272                                                         <select class="form-control" name="type" id="type"
 273                                                                 ng-click="initTargetResourceId()" ng-model="type">
 274                                                                 <option value="VFC">VFC</option>
 275                                                                 <option value="VM">VM</option>
 276                                                                 <option value="VNF">VNF</option>
 277                                                         </select>
 278                                                 </div>
 279                                         </div>
 280                                         <div class="form-group clearfix">
 281                                                 <label for="resourceId" class="col-sm-4 control-label">
 282                                                         Target ResourceId</label>
 283                                                 <div class="col-sm-8">
 284                                                         <select class="form-control" name="resourceId" id="resourceId"
 285                                                                 enableFilter="true" ng-click="changeTargetResourceId()"
 286                                                                 ng-model="resourceId">
 287                                                                 <option value=""></option>
 288                                                                 <option value="Other:">Other:</option>
 289                                                         </select>
 290                                                 </div>
 291                                         </div>
 292                                         <div id="metadata">
 293                                                 <div class="form-group clearfix">
 294                                                         <label for="modelInvariantId" class="col-sm-4 control-label">
 295                                                                 Model Invariant Id</label>
 296                                                         <div class="col-sm-8">
 297                                                                 <input class="form-control" name="modelInvariantId"
 298                                                                         id="modelInvariantId" readonly />
 299                                                         </div>
 300                                                 </div>
 301                                                 <div class="form-group clearfix">
 302                                                         <label for="modelVersionId" class="col-sm-4 control-label">
 303                                                                 Model Version Id</label>
 304                                                         <div class="col-sm-8">
 305                                                                 <input class="form-control" name="modelVersionId"
 306                                                                         id="modelVersionId" readonly />
 307                                                         </div>
 308                                                 </div>
 309                                                 <div class="form-group clearfix">
 310                                                         <label for="modelName" class="col-sm-4 control-label">
 311                                                                 Model Name</label>
 312                                                         <div class="col-sm-8">
 313                                                                 <input class="form-control" name="modelName" id="modelName"
 314                                                                         readonly />
 315                                                         </div>
 316                                                 </div>
 317                                                 <div class="form-group clearfix">
 318                                                         <label for="modelVersion" class="col-sm-4 control-label">
 319                                                                 Model Version</label>
 320                                                         <div class="col-sm-8">
 321                                                                 <input class="form-control" name="modelVersion"
 322                                                                         id="modelVersion" readonly />
 323                                                         </div>
 324                                                 </div>
 325                                                 <div class="form-group clearfix">
 326                                                         <label for="modelCustomizationId" class="col-sm-4 control-label">
 327                                                                 Model Customization Id</label>
 328                                                         <div class="col-sm-8">
 329                                                                 <input class="form-control" name="modelCustomizationId"
 330                                                                         id="modelCustomizationId" readonly />
 331                                                         </div>
 332                                                 </div>
 333                                         </div>
 334                                 </form>
 335                                 <div class="form-group clearfix">
 336                                         <label for="enableGuardPolicy" class="col-sm-4 control-label">
 337                                                 Enable Guard Policy</label>
 338                                         <div class="col-sm-8">
 339                                                 <input type="checkbox" class="form-control"
 340                                                         name="enableGuardPolicy" id="enableGuardPolicy">
 341                                         </div>
 342
 343                                         <div class="col-sm-8">
 344                                                 <label for="guardPolicyType" class="col-sm-4 control-label">
 345                                                         Guard Policy Type</label> <select class="form-control"
 346                                                         name="guardPolicyType" id="guardPolicyType"
 347                                                         ng-change="changeGuardPolicyType()" ng-model="guardType">
 348                                                         <option value="GUARD_MIN_MAX">MinMax</option>
 349                                                         <option value="GUARD_YAML">FrequencyLimiter</option>
 350                                                 </select>
 351                                         </div>
 352                                 </div>
 353                                 <form class="guardProperties" class="form-horizontal"
 354                                         title="Guard policy associated" style="border: 2px dotted gray;">
 355
 356                                         <div class="form-group clearfix">
 357                                                 <label class="col-sm-4 control-label" for="id">ID</label>
 358                                                 <div class="col-sm-8">
 359                                                         <input type="text" class="form-control" name="id" id="id" />
 360                                                 </div>
 361                                         </div>
 362                                         <div class="form-group clearfix">
 363                                                 <label class="col-sm-4 control-label" for="recipe">Recipe</label>
 364                                                 <div class="col-sm-8">
 365                                                         <input type="text" class="form-control" name="recipe"
 366                                                                 readonly="readonly" id="recipe" />
 367                                                 </div>
 368                                         </div>
 369                                         <div class="form-group clearfix">
 370                                                 <label class="col-sm-4 control-label" for="clname">ControlLoopName</label>
 371                                                 <div class="col-sm-8">
 372                                                         <input type="text" class="form-control" name="clname"
 373                                                                 readonly="readonly" id="clname" ng-model="clname"/>
 374                                                 </div>
 375                                         </div>
 376
 377
 378                                         <div class="form-group clearfix">
 379
 380                                                 <label for="guardTargets" class="col-sm-4 control-label">Guard
 381                                                         targets</label>
 382                                                 <div class="col-sm-8">
 383                                                         <input class="form-control" name="guardTargets" id="guardTargets" />
 384                                                 </div>
 385                                         </div>
 386
 387                                         <div class="form-group clearfix" id="minMaxGuardPolicyDiv">
 388                                                 <label for="minGuard" class="col-sm-4 control-label"> Min
 389                                                         Guard</label>
 390                                                 <div class="col-sm-8">
 391                                                         <input class="form-control" name="minGuard" id="minGuard" />
 392                                                 </div>
 393                                                 <label for="maxGuard" class="col-sm-4 control-label"> Max
 394                                                         Guard</label>
 395                                                 <div class="col-sm-8">
 396                                                         <input class="form-control" name="maxGuard" id="maxGuard" />
 397                                                 </div>
 398                                         </div>
 399                                         <div class="form-group clearfix"
 400                                                 id="frequencyLimiterGuardPolicyDiv" style="display: none">
 401                                                 <label for="limitGuard" class="col-sm-4 control-label">Limit</label>
 402                                                 <div class="col-sm-8">
 403                                                         <input class="form-control" name="limitGuard" id="limitGuard" />
 404                                                 </div>
 405                                                 <div class="col-sm-8">
 406                                                         <select class="form-control" name="timeUnitsGuard"
 407                                                                 id="timeUnitsGuard">
 408                                                                 <option value=""></option>
 409                                                                 <option value="minute">minute</option>
 410                                                                 <option value="hour">hour</option>
 411                                                                 <option value="day">day</option>
 412                                                                 <option value="week">week</option>
 413                                                                 <option value="month">month</option>
 414                                                                 <option value="year">year</option>
 415
 416                                                         </select> <label for="timeWindowGuard" class="col-sm-4 control-label">Time
 417                                                                 Window</label>
 418                                                 </div>
 419                                                 <div class="col-sm-8">
 420                                                         <input class="form-control" name="timeWindowGuard"
 421                                                                 id="timeWindowGuard" />
 422                                                 </div>
 423                                         </div>
 424                                         <div class="form-group clearfix">
 425                                                 <label for="guardActiveStart" class="col-sm-4 control-label">
 426                                                         Guard Active Start</label>
 427                                                 <div class="col-sm-8">
 428                                                         <input class="form-control" name="guardActiveStart"
 429                                                                 id="guardActiveStart" />
 430                                                 </div>
 431                                                 <label for="guardActiveEnd" class="col-sm-4 control-label">
 432                                                         Guard Active End</label>
 433                                                 <div class="col-sm-8">
 434                                                         <input class="form-control" name="guardActiveEnd"
 435                                                                 id="guardActiveEnd" />
 436                                                 </div>
 437                                         </div>
 438
 439                                 </form>
 440
 441                         </span>
 442                 </div>
 443         </div>
 444
 445         <div attribute-test="policywindowpropertiesf" class="modal-footer">
 446                 <button id="savePropsBtn" class="btn btn-primary">Close</button>
 447                 <button ng-click="close(true)" id="close_button"
 448                         class="btn btn-primary">Cancel</button>
 449         </div>
 450
 451 </div>