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

   1 <!--/*
   2 * ============LICENSE_START=======================================================
   3 * ONAP : CDS
   4 * ================================================================================
   5 * Copyright 2019 TechMahindra
   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 <div cdkDropListGroup>
  21   <div class="sources-container">
  22         <div
  23       cdkDropList
  24       [cdkDropListData]="todo"
  25       class="sources-list"
  26       (cdkDropListDropped)="drop($event)">
  27         <div class="sources-box" *ngFor="let item of todo" cdkDrag>
  28                 <mat-expansion-panel class="expansion-panel">
  29                         <mat-expansion-panel-header>
  30                                 <mat-panel-title>
  31                                         {{item.type}}
  32                                 </mat-panel-title>
  33                         </mat-expansion-panel-header>
  34                         {{item}}
  35                          </mat-expansion-panel>
  36         </div>
  37     </div>
  38   </div>
  39
  40   <div class="list-container">
  41     <h3>Source Options</h3>
  42         <mat-form-field>
  43         <input [(ngModel)]="searchText" type="input" matInput placeholder="search sources">
  44         <button matSuffix mat-icon-button><mat-icon>search</mat-icon></button>
  45         <mat-hint>db,mdsal,input,default,..</mat-hint>
  46         </mat-form-field>
  47         <br><br>
  48     <div
  49       cdkDropList
  50       [cdkDropListData]="sourcesOptions"
  51       class="options-list"
  52       (cdkDropListDropped)="drop($event)">
  53       <div class="options-box" *ngFor="let item of sourcesOptions | search : searchText" cdkDrag>{{item.type}}</div>
  54     </div>
  55   </div>
  56 </div>