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

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