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