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-2019 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 .withnote {
  62         margin-bottom: 0px;
  63 }
  64
  65 .note {
  66         font-size:10px;
  67         margin-left: 250px;
  68         font-weight: normal;
  69 }
  70
  71 #policyTable {
  72         cursor: pointer;
  73         width: 100%;
  74 }
  75
  76 #policyTable tr {
  77         border-bottom: 1px solid #ddd;
  78         border-collapse: collapse;
  79         text-align: left;
  80         font-size: 12px;
  81         font-weight: normal;
  82 }
  83
  84 #policyTable td {
  85         padding: 8px 10px;
  86 }
  87
  88 #policyTable tr.highlight {
  89         background-color: #f5f5f5;
  90         font-weight: bold;
  91         font-size: 13px;
  92 }
  93
  94 #policyTableHolder {
  95         height: 200px;
  96         width: 100%;
  97         overflow: auto;
  98 }
  99 </style>
 100
 101
 102 <div attribute-test="policywindowproperties" id="configure-widgets"
 103         class="disabled-block-container">
 104         <div attribute-test="policywindowpropertiesh" class="modal-header">
 105                 <button type="button" class="close" ng-click="close(false)"
 106                         aria-hidden="true" style="margin-top: -3px">&times;</button>
 107                 <h4>Operational Policy</h4>
 108         </div>
 109
 110
 111         <div class="modal-body">
 112                 <div attribute-test="policywindowpropertiesb" class="modal-body row">
 113
 114                         <div class="panel panel-default col-sm-10 policyPanel">
 115                                 <form id="operationalPolicyHeaderForm" class="form-horizontal">
 116                                                 <div class="form-group clearfix">
 117                                                         <label class="col-sm-2">Parent policy</label>
 118                                                         <div class="col-sm-3" style="padding: 0px;">
 119                                                                 <select type="text" id="trigger_policy" name="trigger_policy"
 120                                                                         class="form-control" ng-model="null_dump"
 121                                                                         ng-init="initPolicySelect()"
 122                                                                         ng-options="policy for policy in policy_ids track by policy">
 123                                                                         <option value="">-- choose an option --</option>
 124                                                                         </select>
 125                                                         </div>
 126
 127                                                         <label for="timeout" class="col-sm-3"
 128                                                                 style="padding-left: 5px; padding-right: 10px;">Overall
 129                                                                 Time Limit</label>
 130                                                         <div class="col-sm-2" style="padding-left: 0px;">
 131                                                                 <input type="text" ng-pattern="/^[0-9]*$/" ng-model="number"
 132                                                                         class="form-control" id="timeout" name="timeout">
 133                                                         </div>
 134
 135                                                         <label for="abatement" class="col-sm-2">Abatement</label>
 136                                                         <div class="col-sm-2" style="padding-left: 0px;">
 137                                                                 <select class="form-control" id="abatement" name="abatement">
 138                                                                         <option value="false" selected>False</option>
 139                                                                         <option value="true">True</option>
 140                                                                 </select>
 141                                                         </div>
 142                                                 </div>
 143                                                 <div class="form-group clearfix row">
 144                                                     <label class="col-sm-4 control-label" for="clname">ControlLoopName</label>
 145                                                     <div class="col-sm-8">
 146                                                             <input type="text" class="form-control" name="controlLoopName"
 147                                                                     readonly="readonly" id="clname" ng-model="clname"/>
 148                                                     </div>
 149                                                 </div>
 150                                 </form>
 151                                 <div class="panel-heading" style="background-color: white;">
 152                                         <ul id="nav_Tabs" class="nav nav-tabs">
 153                                                 <li class><a id="add_one_more" href="#desc_tab"><span
 154                                                                 class="glyphicon glyphicon-plus" aria-hidden="true"></span></a></li>
 155                                         </ul>
 156                                 </div>
 157                                 <div class="panel-body">
 158                                         <div class="tab-content">
 159                                                 <div id="properties_tab" class="tab-pane fade in active"></div>
 160                                         </div>
 161                                 </div>
 162                         </div>
 163
 164                         <span id="formSpan" style="display: none">
 165                                 <form class="policyProperties" class="form-horizontal"
 166                                         style="border: 2px dotted gray;"
 167                                         title="Operational Policy Properties">
 168
 169                                         <div class="form-group clearfix">
 170                                                 <label class="col-sm-4 control-label" for="id">ID</label>
 171                                                 <div class="col-sm-8">
 172                                                         <input type="text" class="form-control" name="id" id="id"
 173                                                                 ng-keyup="updateTabLabel($event)" />
 174                                                 </div>
 175                                         </div>
 176                                         <div class="form-group clearfix">
 177                                                 <label class="col-sm-4 control-label" for="recipe">Recipe</label>
 178                                                 <div class="col-sm-8">
 179                                                         <select class="form-control" name="recipe" id="recipe"
 180                                                                 enableFilter="true"  ng-model="recipe" ng-click="updateGuardRecipe($event)">
 181                                                                 <option value="">-- choose an option --</option>
 182                                                                 <option value="Restart">Restart</option>
 183                                                                 <option value="Rebuild">Rebuild</option>
 184                                                                 <option value="Migrate">Migrate</option>
 185                                                                 <option value="Health-Check">Health-Check</option>
 186                                                                 <option value="ModifyConfig">ModifyConfig</option>
 187                                                                 <option value="VF Module Create">VF Module Create</option>
 188                                                                 <option value="VF Module Delete">VF Module Delete</option>
 189                                                                 <option value="Reroute">Reroute</option>
 190                                                         </select>
 191                                                 </div>
 192                                         </div>
 193                                         <div class="form-group clearfix">
 194                                                 <label for="retry" class="col-sm-4 control-label"> Retry</label>
 195                                                 <div class="col-sm-8">
 196                                                         <input type="text" maxlength="5" class="form-control" id="retry"
 197                                                                 ng-pattern="/^[0-9]*$/" ng-model="number" name="retry">
 198                                                         </input>
 199                                                 </div>
 200                                         </div>
 201                                         <div class="form-group clearfix">
 202                                                 <label for="timeout" class="col-sm-4 control-label">
 203                                                         Timeout</label>
 204                                                 <div class="col-sm-8">
 205                                                         <input type="text" maxlength="5" class="form-control"
 206                                                                 id="timeout" ng-pattern="/^[0-9]*$/" ng-model="number"
 207                                                                 name="timeout"></input>
 208                                                 </div>
 209                                         </div>
 210
 211                                         <div class="form-group clearfix">
 212                                                 <label for="actor" class="col-sm-4 control-label"> Actor</label>
 213                                                 <div class="col-sm-8">
 214                                                         <select class="form-control" id="actor" name="actor" ng-click="updateGuardActor($event)" ng-model="actor">
 215                                                             <option value="">-- choose an option --</option>
 216                                                                 <option value="APPC">APPC</option>
 217                                                                 <option value="SO">SO</option>
 218                                                                 <option value="VFC">VFC</option>
 219                                                                 <option value="SDNC">SDNC</option>°
 220                                                                 <option value="SDNR">SDNR</option>°
 221                                                         </select>
 222                                                 </div>
 223
 224                                                 <label for="payload" class="col-sm-4 control-label">
 225                                                         Payload (YAML)</label>
 226                                                 <div class="col-sm-8">
 227                                                         <textarea class="form-control" id="payload" name="payload"></textarea>
 228                                                 </div>
 229                                         </div>
 230                                         <div class="form-group clearfix">
 231                                                 <label for="success" class="col-sm-4 control-label">When
 232                                                         Success</label>
 233                                                 <div class="col-sm-8">
 234                                                         <select class="form-control" id="success" name="success"
 235                                                                 ng-model="null_dump"
 236                                                                 ng-options="policy for policy in policy_ids track by policy">
 237                                                                 <option value="">-- choose an option --</option>
 238                                                                 </select>
 239                                                 </div>
 240                                         </div>
 241                                         <div class="form-group clearfix">
 242                                                 <label for="failure" class="col-sm-4 control-label">When
 243                                                         Failure</label>
 244                                                 <div class="col-sm-8">
 245                                                         <select class="form-control" id="failure" name="failure"
 246                                                                 ng-model="null_dump"
 247                                                                 ng-options="policy for policy in policy_ids track by policy">
 248                                                                 <option value="">-- choose an option --</option>
 249                                                                 </select>
 250                                                 </div>
 251                                         </div>
 252                                         <div class="form-group clearfix">
 253                                                 <label for="failure_timeout" class="col-sm-4 control-label">When
 254                                                         Failure Timeout</label>
 255                                                 <div class="col-sm-8">
 256                                                         <select class="form-control" id="failure_timeout"
 257                                                                 name="failure_timeout" ng-model="null_dump"
 258                                                                 ng-options="policy for policy in policy_ids track by policy">
 259                                                                 <option value="">-- choose an option --</option>
 260                                                                 </select>
 261                                                 </div>
 262                                         </div>
 263                                         <div class="form-group clearfix">
 264                                                 <label for="failure_retries" class="col-sm-4 control-label">When
 265                                                         Failure Retries</label>
 266                                                 <div class="col-sm-8">
 267                                                         <select class="form-control" id="failure_retries"
 268                                                                 name="failure_retries" ng-model="null_dump"
 269                                                                 ng-options="policy for policy in policy_ids track by policy">
 270                                                                 <option value="">-- choose an option --</option>
 271                                                                 </select>
 272                                                 </div>
 273                                         </div>
 274                                         <div class="form-group clearfix">
 275                                                 <label for="failure_exception" class="col-sm-4 control-label">When
 276                                                         Failure Exception</label>
 277                                                 <div class="col-sm-8">
 278                                                         <select class="form-control" id="failure_exception"
 279                                                                 name="failure_exception" ng-model="null_dump"
 280                                                                 ng-options="policy for policy in policy_ids track by policy">
 281                                                                 <option value="">-- choose an option --</option>
 282                                                                 </select>
 283                                                 </div>
 284                                         </div>
 285                                         <div class="form-group clearfix">
 286                                                 <label for="failure_guard" class="col-sm-4 control-label">When
 287                                                         Failure Guard</label>
 288                                                 <div class="col-sm-8">
 289                                                         <select class="form-control" id="failure_guard"
 290                                                                 name="failure_guard" ng-model="null_dump"
 291                                                                 ng-options="policy for policy in policy_ids track by policy">
 292                                                                 <option value="">-- choose an option --</option>
 293                                                                 </select>
 294                                                 </div>
 295                                         </div>
 296                                 </form>
 297                                 <form class="policyTarget" class="form-horizontal"
 298                                         title="Operational Policy Target" style="border: 2px dotted gray;">
 299                                         <div class="form-group clearfix">
 300                                                 <label for="type" class="col-sm-4 control-label"> Target
 301                                                         Type</label>
 302                                                 <div class="col-sm-8">
 303                                                         <select class="form-control" name="type" id="type"
 304                                                                 ng-click="initTargetResourceId($event)" ng-model="type">
 305                                                                 <option value="">-- choose an option --</option>
 306                                                                 <option value="VFModule">VFModule</option>
 307                                                                 <option value="VM">VM</option>
 308                                                                 <option value="VNF">VNF</option>
 309                                                         </select>
 310                                                 </div>
 311                                         </div>
 312                                         <div class="form-group clearfix">
 313                                                 <label for="resourceID" class="col-sm-4 control-label">
 314                                                         Target ResourceId</label>
 315                                                 <div class="col-sm-8">
 316                                                         <select class="form-control" name="resourceID" id="resourceID"
 317                                                                 enableFilter="true" ng-click="changeTargetResourceId($event)"
 318                                                                 ng-model="resourceId">
 319                                                                 <option value="">-- choose an option --</option>
 320                                                         </select>
 321                                                 </div>
 322                                         </div>
 323                                         <div id="metadata">
 324                                                 <div class="form-group clearfix">
 325                                                         <label for="modelInvariantId" class="col-sm-4 control-label">
 326                                                                 Model Invariant Id</label>
 327                                                         <div class="col-sm-8">
 328                                                                 <input class="form-control" name="modelInvariantId"
 329                                                                         id="modelInvariantId" readonly />
 330                                                         </div>
 331                                                 </div>
 332                                                 <div class="form-group clearfix">
 333                                                         <label for="modelVersionId" class="col-sm-4 control-label">
 334                                                                 Model Version Id</label>
 335                                                         <div class="col-sm-8">
 336                                                                 <input class="form-control" name="modelVersionId"
 337                                                                         id="modelVersionId" readonly />
 338                                                         </div>
 339                                                 </div>
 340                                                 <div class="form-group clearfix">
 341                                                         <label for="modelName" class="col-sm-4 control-label">
 342                                                                 Model Name</label>
 343                                                         <div class="col-sm-8">
 344                                                                 <input class="form-control" name="modelName" id="modelName"
 345                                                                         readonly />
 346                                                         </div>
 347                                                 </div>
 348                                                 <div class="form-group clearfix">
 349                                                         <label for="modelVersion" class="col-sm-4 control-label">
 350                                                                 Model Version</label>
 351                                                         <div class="col-sm-8">
 352                                                                 <input class="form-control" name="modelVersion"
 353                                                                         id="modelVersion" readonly />
 354                                                         </div>
 355                                                 </div>
 356                                                 <div class="form-group clearfix">
 357                                                         <label for="modelCustomizationId" class="col-sm-4 control-label">
 358                                                                 Model Customization Id</label>
 359                                                         <div class="col-sm-8">
 360                                                                 <input class="form-control" name="modelCustomizationId"
 361                                                                         id="modelCustomizationId" readonly />
 362                                                         </div>
 363                                                 </div>
 364                                         </div>
 365                                 </form>
 366                                 <div class="form-group clearfix">
 367                                         <label for="enableGuardPolicy" class="col-sm-4 control-label">
 368                                                 Enable Guard Policy</label>
 369                                         <div class="col-sm-8">
 370                                                 <input type="checkbox" class="form-control"
 371                                                         name="enableGuardPolicy" id="enableGuardPolicy">
 372                                         </div>
 373
 374                                         <div class="col-sm-8">
 375                                                 <label for="guardPolicyType" class="col-sm-4 control-label">
 376                                                         Guard Policy Type</label> <select class="form-control"
 377                                                         name="guardPolicyType" id="guardPolicyType"
 378                                                         ng-click="changeGuardPolicyType()" ng-model="guardType">
 379                                                         <option value="GUARD_MIN_MAX">MinMax</option>
 380                                                         <option value="GUARD_YAML">FrequencyLimiter</option>
 381                                                 </select>
 382                                         </div>
 383                                 </div>
 384                                 <form class="guardProperties" class="form-horizontal"
 385                                         title="Guard policy associated" style="border: 2px dotted gray;">
 386
 387                                         <div class="form-group clearfix withnote">
 388                                                 <label class="col-sm-4 control-label" for="id">Guard Policy ID</label>
 389                                                 <div class="col-sm-8">
 390                                                         <input type="text" class="form-control" name="id" id="id" ng-blur="changeGuardId()" ng-model="id"/>
 391                                                 </div>
 392                                         </div>
 393                                         <div>
 394                                                 <label class="form-group note">Note: Prefix will be added to Guard Policy ID automatically based on Guard Policy Type</label>
 395                                         </div>
 396                                         <div class="form-group clearfix">
 397                                                 <label class="col-sm-4 control-label" for="recipe">Recipe</label>
 398                                                 <div class="col-sm-8">
 399                                                         <input type="text" class="form-control" name="recipe"
 400                                                                 readonly="readonly" id="recipe"/>
 401                                                 </div>
 402                                         </div>
 403                                         <div class="form-group clearfix">
 404                                                 <label class="col-sm-4 control-label" for="clname">ControlLoopName</label>
 405                                                 <div class="col-sm-8">
 406                                                         <input type="text" class="form-control" name="clname"
 407                                                                 readonly="readonly" id="clname" ng-model="clname"/>
 408                                                 </div>
 409                                         </div>
 410                                         <div class="form-group clearfix">
 411                                             <label for="actor" class="col-sm-4 control-label">Actor</label>
 412                                                 <div class="col-sm-8">
 413                                                     <input type="text" class="form-control" name="actor"
 414                                                                 readonly="readonly" id="actor" />
 415                                                 </div>
 416                                         </div>
 417                                         <div class="form-group clearfix">
 418
 419                                                 <label for="targets" class="col-sm-4 control-label">Guard
 420                                                         targets</label>
 421                                                 <div class="col-sm-8">
 422                                                         <input class="form-control" name="targets" id="targets" />
 423                                                 </div>
 424                                         </div>
 425
 426                                         <div class="form-group clearfix" id="minMaxGuardPolicyDiv">
 427                                                 <label for="min" class="col-sm-4 control-label"> Min
 428                                                         Guard</label>
 429                                                 <div class="col-sm-8">
 430                                                         <input class="form-control" name="min" id="min" />
 431                                                 </div>
 432                                                 <label for="max" class="col-sm-4 control-label"> Max
 433                                                         Guard</label>
 434                                                 <div class="col-sm-8">
 435                                                         <input class="form-control" name="max" id="max" />
 436                                                 </div>
 437                                         </div>
 438                                         <div class="form-group clearfix"
 439                                                 id="frequencyLimiterGuardPolicyDiv" style="display: none">
 440                                                 <label for="limit" class="col-sm-4 control-label">Limit</label>
 441                                                 <div class="col-sm-8">
 442                                                         <input class="form-control" name="limit" id="limit" />
 443                                                 </div>
 444                                                 <label for="timeUnits" class="col-sm-4 control-label">Time Units</label>
 445                                                 <div class="col-sm-8">
 446                                                         <select class="form-control" name="timeUnits"
 447                                                                 id="timeUnits">
 448                                                                 <option value=""></option>
 449                                                                 <option value="minute">minute</option>
 450                                                                 <option value="hour">hour</option>
 451                                                                 <option value="day">day</option>
 452                                                                 <option value="week">week</option>
 453                                                                 <option value="month">month</option>
 454                                                                 <option value="year">year</option>
 455                                                         </select>
 456                                                 </div>
 457                                                 <label for="timeWindow" class="col-sm-4 control-label">Time     Window</label>
 458                                                 <div class="col-sm-8">
 459                                                         <input class="form-control" name="timeWindow" id="timeWindow" />
 460                                                 </div>
 461                                         </div>
 462                                         <div class="form-group clearfix">
 463                                                 <label for="guardActiveStart" class="col-sm-4 control-label">
 464                                                         Guard Active Start</label>
 465                                                 <div class="col-sm-8">
 466                                                         <input class="form-control" name="guardActiveStart"
 467                                                                 id="guardActiveStart"  value="00:00:00Z"/>
 468                                                 </div>
 469                                                 <label for="guardActiveEnd" class="col-sm-4 control-label">
 470                                                         Guard Active End</label>
 471                                                 <div class="col-sm-8">
 472                                                         <input class="form-control" name="guardActiveEnd"
 473                                                                 id="guardActiveEnd" value="00:00:01Z"/>
 474                                                 </div>
 475                                         </div>
 476
 477                                 </form>
 478
 479                         </span>
 480                 </div>
 481         </div>
 482
 483         <div attribute-test="policywindowpropertiesf" class="modal-footer">
 484                 <button id="savePropsBtn" class="btn btn-primary">Close</button>
 485                 <button ng-click="close(true)" id="close_button"
 486                         class="btn btn-primary">Cancel</button>
 487         </div>
 488
 489 </div>