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