gerrit.onap Code Review - dcaegen2/services.git/blob

   1 <!--
   2 ============LICENSE_START=======================================================
   3 ONAP : DataLake
   4 ================================================================================
   5 Copyright 2019 - 2020 QCT
   6 =================================================================================
   7 Licensed under the Apache License, Version 2.0 (the "License");
   8 you may not use this file except in compliance with the License.
   9 You may obtain a copy of the License at
  10
  11      http://www.apache.org/licenses/LICENSE-2.0
  12
  13 Unless required by applicable law or agreed to in writing, software
  14 distributed under the License is distributed on an "AS IS" BASIS,
  15 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  16 See the License for the specific language governing permissions and
  17 limitations under the License.
  18 ============LICENSE_END=========================================================
  19 -->
  20
  21 <mat-tab-group #tabRef [selectedIndex]="this.selectedIndex" (click)="this.onClickMatTab(tabRef.selectedIndex)"
  22   mat-align-tabs="center">
  23   <mat-tab label="Information">
  24     <div class="container p-4">
  25       <div class="form-group">
  26         <div class="row">
  27           <div class="col-md-6">
  28             <label class="dl-emphasis1">{{ "NAME" | translate }}</label>
  29           </div>
  30           <div class="col-md-6">
  31             <label class="dl-emphasis1">{{ "STATUS" | translate }}</label>
  32           </div>
  33         </div>
  34         <div class="row">
  35           <div class="col-md-6">
  36             <!-- For new topic -->
  37             <div *ngIf="isAddingMode()">
  38               <input id="tname" type="text" class="form-control dl-input-text" [(ngModel)]="this.data.name"
  39                 [ngbTypeahead]="search" (focus)="focus$.next($event.target.value)"
  40                 (click)="click$.next($event.target.value)" #instance="ngbTypeahead" />
  41             </div>
  42             <!-- For modified topic -->
  43             <div *ngIf="!isAddingMode()">
  44               <input [(ngModel)]="this.data.name" [disabled]="true" class="form-control dl-input-text" type="text" />
  45             </div>
  46           </div>
  47
  48           <div class="col-md-6">
  49             <label class="dl-switch">
  50               <input id="switch" type="checkbox" [(ngModel)]="this.data.enabled" />
  51               <span class="dl-slider round"></span>
  52             </label>
  53           </div>
  54         </div>
  55       </div>
  56
  57       <div class="form-group">
  58         <div class="row">
  59           <div class="col-md-6">
  60             <label class="dl-emphasis1">{{ "DATA_FORMAT" | translate }}</label>
  61           </div>
  62           <div class="col-md-6">
  63             <label class="dl-emphasis1">{{ "TTL" | translate }} (days)</label>
  64           </div>
  65         </div>
  66         <div class="row">
  67           <div class="col-md-6">
  68             <select [(ngModel)]="this.data.dataFormat" class="custom-select dl-input-text">
  69               <option *ngFor="let item of dataFormats" [selected]="item == this.data.dataFormat">
  70                 {{ item }}
  71               </option>
  72             </select>
  73           </div>
  74           <div class="col-md-6">
  75             <input [(ngModel)]="this.data.ttl" class="form-control dl-input-text" type="text" placeholder="3650"
  76               (input)="this.adminService.onKeyPressNumber($event)" />
  77           </div>
  78         </div>
  79       </div>
  80
  81       <div class="form-group">
  82         <div class="row">
  83           <div class="col-md-6">
  84             <label class="dl-emphasis1">{{
  85               "SAVE_RAW_DATA" | translate
  86             }}</label>
  87           </div>
  88           <div class="col-md-6">
  89             <label class="dl-emphasis1">{{
  90               "CORRELATE_CLEARED_MESSAGE" | translate
  91             }}</label>
  92           </div>
  93         </div>
  94         <div class="row">
  95           <div class="col-md-6">
  96             <div class="input-group">
  97               <div class="input-group-prepend">
  98                 <label class="input-group-text dl-input-chk-label">
  99                   <input [(ngModel)]="this.data.saveRaw" id="chkSaveRaw" type="checkbox" />
 100                   <span class="dl-input-checkmark"></span>
 101                 </label>
 102               </div>
 103               <label class="form-control dl-input-chk" for="chkSaveRaw">
 104                 Save
 105               </label>
 106             </div>
 107           </div>
 108           <div class="col-md-6">
 109             <div class="input-group">
 110               <div class="input-group-prepend">
 111                 <label class="input-group-text dl-input-chk-label">
 112                   <input [(ngModel)]="this.data.correlateClearedMessage" id="chkMsg" type="checkbox" />
 113                   <span class="dl-input-checkmark"></span>
 114                 </label>
 115               </div>
 116               <label class="form-control dl-input-chk" for="chkMsg">
 117                 Correlate
 118               </label>
 119             </div>
 120           </div>
 121         </div>
 122       </div>
 123
 124       <div class="form-group">
 125         <div class="row">
 126           <div class="col-md-6">
 127             <label class="dl-emphasis1">{{
 128               "ID_EXTRACTION" | translate
 129             }}</label>
 130           </div>
 131         </div>
 132         <div class="row">
 133           <div class="col-md-9">
 134             <div class="d-flex row align-items-center" *ngFor="let field of idExFields; let i = index">
 135               <div class="col-md-8 order-1">
 136                 <input [(ngModel)]="field.item" class="form-control dl-input-text" placeholder="/event-header/id"
 137                   type="text" [value]="field.item" (change)="onChangeSaveIdField()" />
 138               </div>
 139               <div class="order-2">
 140                 <button type="button" class="btn dl-icon-enable p-2" (click)="onClickAddIdField(i)">
 141                   <i class="fa fa-plus fa-xs" aria-hidden="true"></i>
 142                 </button>
 143               </div>
 144               <div class="order-3">
 145                 <button type="button" class="btn dl-icon-enable p-2" (click)="onClickDelIdField(i)">
 146                   <i class="fa fa-trash fa-xs" aria-hidden="true"></i>
 147                 </button>
 148               </div>
 149             </div>
 150           </div>
 151         </div>
 152       </div>
 153     </div>
 154   </mat-tab>
 155
 156   <mat-tab label="Kafka">
 157     <div class="container p-4">
 158       <div class="form-group" *ngFor="let item of this.kafkas; let i = index">
 159         <div class="row">
 160           <div class="col-md-6">
 161             <div class="input-group">
 162               <div class="input-group">
 163                 <div class="input-group-prepend">
 164                   <label class="input-group-text dl-input-chk-label">
 165                     <input id="chkSaveRaw{{ i }}" [(ngModel)]="item.checkedToSave" type="checkbox" (change)="
 166                         this.onChabgeSelKafka($event.target.checked, item.id)
 167                       " />
 168                     <span class="dl-input-checkmark"></span>
 169                   </label>
 170                 </div>
 171                 <label class="form-control dl-input-chk" for="chkSaveRaw{{ i }}">
 172                   {{ item.name }}
 173                 </label>
 174               </div>
 175             </div>
 176           </div>
 177         </div>
 178       </div>
 179     </div>
 180   </mat-tab>
 181
 182   <mat-tab label="Sink">
 183     <div class="container p-4">
 184       <div class="form-group" *ngFor="let dbType of this.dbTypeIds">
 185         <div class="row">
 186           <div class="col-md-6">
 187             <label class="dl-emphasis1">{{ dbType }}</label>
 188           </div>
 189         </div>
 190
 191         <div class="row" *ngFor="let db of this.dbs; let i = index">
 192           <div class="col-md-6 p-1" *ngIf="db.dbTypeId == dbType">
 193             <div class="input-group">
 194               <div class="input-group">
 195                 <div class="input-group-prepend">
 196                   <label class="input-group-text dl-input-chk-label">
 197                     <input id="chkSaveRaw{{ i }}" [(ngModel)]="db.checkedToSave" type="checkbox" (change)="
 198                         this.onChabgeSelDb($event.target.checked, db.id)
 199                       " />
 200                     <span class="dl-input-checkmark"></span>
 201                   </label>
 202                 </div>
 203                 <label class="form-control dl-input-chk" for="chkSaveRaw{{ i }}">
 204                   {{ db.name }}
 205                 </label>
 206               </div>
 207             </div>
 208           </div>
 209         </div>
 210       </div>
 211     </div>
 212   </mat-tab>
 213 </mat-tab-group>