gerrit.onap Code Review - ccsdk/cds.git/blob

   1 <div class="scrollWrapper">
   2     <div class="row m-0">
   3         <div class="col">
   4             <div class="form-group">
   5                 <label for="exampleInputEmail1">Function Instance Name</label>
   6                 <input type="text" class="form-control" placeholder="Function Instance Name">
   7             </div>
   8             <div class="form-group">
   9                 <label>Function Type</label>
  10                 <label class="attribute-value">component-resource-resolution</label>
  11             </div>
  12             <div class="form-group">
  13                 <label for="exampleFormControlTextarea1">Description</label>
  14                 <textarea class="form-control" id="exampleFormControlTextarea1" rows="3"></textarea>
  15             </div>
  16         </div>
  17     </div>
  18     <!--INTERFACES-->
  19     <div class="accordion" id="accordionExample">
  20         <div class="card">
  21             <div class="card-header row" id="headingOne">
  22                 <button class="btn btn-link" type="button" data-toggle="collapse" data-target="#collapseOne"
  23                     aria-expanded="true" aria-controls="collapseOne">
  24                     Interfaces
  25                 </button>
  26             </div>
  27
  28             <div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordionExample">
  29                 <div class="card-body">
  30                     <!--Inputs & Outputs Tabs-->
  31                     <ul class="nav nav-pills nav-fill mb-3" id="pills-tab" role="tablist">
  32                         <li class="nav-item" role="presentation">
  33                             <a class="nav-link active" id="pills-home-tab" data-toggle="pill" href="#pills-home"
  34                                 role="tab" aria-controls="pills-home" aria-selected="true">Inputs</a>
  35                         </li>
  36                         <li class="nav-item" role="presentation">
  37                             <a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#pills-profile"
  38                                 role="tab" aria-controls="pills-profile" aria-selected="false">Outputs</a>
  39                         </li>
  40                     </ul>
  41                     <div class="tab-content" id="pills-tabContent">
  42                         <div class="tab-pane fade show active" id="pills-home" role="tabpanel"
  43                             aria-labelledby="pills-home-tab">
  44                             <div class="row">
  45                                 <div class="col">
  46                                     <!--list-->
  47                                     <div class="attribute-wrap">
  48                                         <div class="form-group">
  49                                             <label for="exampleFormControlTextarea1">artifact-prefix-names
  50                                                 <i class="icon-required-star" type="button"
  51                                                     aria-hidden="true"></i></label>
  52                                         </div>
  53                                         <div class="custom-control custom-radio custom-control-inline">
  54                                             <input type="radio" id="customRadioInline1" name="customRadioInline1"
  55                                                 class="custom-control-input">
  56                                             <label class="custom-control-label" for="customRadioInline1">Pre-defined
  57                                                 Template</label>
  58                                         </div>
  59                                         <div class="custom-control custom-radio custom-control-inline">
  60                                             <input type="radio" id="customRadioInline2" name="customRadioInline1"
  61                                                 class="custom-control-input">
  62                                             <label class="custom-control-label" for="customRadioInline2">Input Drivin
  63                                                 Template</label>
  64                                         </div>
  65                                         <br />
  66                                         <button type="button" data-toggle="modal" data-target="#templateModal"
  67                                             class="btn btn-select-template"><i class="icon-add-circle" type="button"
  68                                                 aria-hidden="true"></i> Select Template</button>
  69                                     </div>
  70                                     <!--string-->
  71                                     <div class="attribute-wrap">
  72                                         <div class="form-group">
  73                                             <label for="exampleInputEmail1">resoluton-key <i class="icon-required-star"
  74                                                     type="button" aria-hidden="true"></i></label>
  75                                             <input type="text" class="form-control">
  76                                         </div>
  77                                     </div>
  78                                     <!--integer-->
  79                                     <div class="attribute-wrap">
  80                                         <div class="form-group">
  81                                             <label for="exampleInputEmail1">request-id <i class="icon-required-star"
  82                                                     type="button" aria-hidden="true"></i></label>
  83                                             <input type="number" class="form-control" placeholder="" value="356">
  84                                         </div>
  85                                     </div>
  86                                     <!--boolean-->
  87                                     <div class="attribute-wrap">
  88                                         <div class="form-group">
  89                                             <label for="exampleFormControlTextarea1">resolution-summary
  90                                                 <i class="icon-required-star optional-attribute" type="button"
  91                                                     aria-hidden="true"></i></label>
  92                                         </div>
  93                                         <div class="custom-control custom-radio custom-control-inline">
  94                                             <input type="radio" id="customRadioInline1" name="customRadioInline1"
  95                                                 class="custom-control-input">
  96                                             <label class="custom-control-label" for="customRadioInline1">True</label>
  97                                         </div>
  98                                         <div class="custom-control custom-radio custom-control-inline">
  99                                             <input type="radio" id="customRadioInline2" name="customRadioInline1"
 100                                                 class="custom-control-input">
 101                                             <label class="custom-control-label" for="customRadioInline2">False</label>
 102                                         </div>
 103                                     </div>
 104                                     <!-- Add Optional Attributes button -->
 105                                 </div>
 106                             </div>
 107                         </div>
 108                         <div class="tab-pane fade" id="pills-profile" role="tabpanel"
 109                             aria-labelledby="pills-profile-tab">2</div>
 110                     </div>
 111                 </div>
 112             </div>
 113         </div>
 114     </div>
 115     <!--ARTIFACTS-->
 116     <div class="accordion" id="accordionExample1">
 117         <div class="card">
 118             <div class="card-header row" id="headingOne">
 119                 <button class="btn btn-link" type="button" data-toggle="collapse" data-target="#collapseTwo"
 120                     aria-expanded="true" aria-controls="collapseTwo">
 121                     Artifacts
 122                 </button>
 123             </div>
 124
 125             <div id="collapseTwo" class="collapse show" aria-labelledby="headingOne" data-parent="#accordionExample1">
 126                 <div class="card-body">
 127                     <div class="row">
 128                         <div class="col-12" *ngFor="let file of  getKeys(selectedTemplates)">
 129                             <a class="template-mapping-list">
 130                                 <p>{{file}}</p>
 131                                 <span *ngIf="getValue(file).isMapping">Mapping</span>
 132                                 <span *ngIf="getValue(file).isTemplate">Template</span>
 133
 134                                 <a data-toggle="modal" (click)="fileToDelete = file"
 135                                     data-target="#templateDeletionModal" class="accordion-delete deleteTemplate"
 136                                     title="Delete Template"><i class="icon-delete-sm"></i></a>
 137                             </a>
 138
 139                         </div>
 140                     </div>
 141                 </div>
 142             </div>
 143         </div>
 144     </div>
 145 </div>
 146
 147 <!--function - Select Template - Modal-->
 148 <div class="modal fade" id="templateModal" tabindex="-1" role="dialog" aria-labelledby="templateModalTitle"
 149     aria-hidden="true">
 150     <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable" role="document">
 151         <div class="modal-content">
 152             <div class="modal-header">
 153                 <h5 class="modal-title" id="templateModalTitle">
 154                     Select Pre-defined Tempalte Name</h5>
 155                 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
 156                     <img src="assets/img/icon-close.svg" />
 157                 </button>
 158             </div>
 159             <div class="modal-body createAttributeTabs">
 160                 <div class="col-4" *ngFor="let file of  getKeys(templateAndMappingMap)">
 161                     <a class="template-mapping-list float" [ngClass]="{'active':selectedTemplates.has(file)}">
 162                         <p (click)="setTemplate(file)">{{file}}</p>
 163                         <span *ngIf="getValue(file).isMapping">Mapping</span>
 164                         <span *ngIf="getValue(file).isTemplate">Template</span>
 165                     </a>
 166
 167                 </div>
 168
 169             </div>
 170             <div class="modal-footer">
 171                 <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
 172                 <button type="button" class="btn btn-primary" data-dismiss="modal" (click)="addTemplates()">Add
 173                     Templates</button>
 174             </div>
 175         </div>
 176     </div>
 177 </div>
 178
 179 <!-- Delete Modal -->
 180 <div class="modal fade" id="templateDeletionModal" tabindex="-1" role="dialog"
 181     aria-labelledby="templateDeletionModalLabel" aria-hidden="true">
 182     <div class="modal-dialog" role="document">
 183         <div class="modal-content">
 184             <div class="modal-header">
 185                 <h5 class="modal-title" id="templateDeletionModalLabel">Delete Script</h5>
 186                 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
 187                     <img src="assets/img/icon-close.svg" />
 188                 </button>
 189             </div>
 190             <div class="modal-body">
 191                 <p>Are you sure you want to delete Template file
 192                     <span>{{fileToDelete}}</span>?</p>
 193             </div>
 194             <div class="modal-footer">
 195                 <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
 196                 <button type="button" (click)="setTemplate(fileToDelete)" data-dismiss="modal"
 197                     class="btn btn-primary">Delete</button>
 198             </div>
 199         </div>
 200     </div>
 201 </div>