<div>
  <div class="user-task-header">
    <div class="user-task-option user-task-left" ></div>
    <div class="user-task-title">{{ data.title }}</div>
    <div class="user-task-option user-task-right" (click)="saveTask()">Done</div>
  </div>
  <div class="user-task-content">
    <div *ngFor="let field of data.fields" class="user-task-field-wrapper">
		<div #iconTarget class="user-task-field-icon">{{field.label.substring(0, 1)}}</div> <!-- Changed by Pravin K on 23-MAY-20[added first char] -->
		<div [ngSwitch]="field.type" class="user-task-field">

        <div *ngSwitchCase="'dd'">
          <mat-form-field ref="user-task">
            <mat-label>{{ field.label }}</mat-label>
            <mat-select id="{{field.id}}" (selectionChange)="onddChange($event, iconTarget, field.id)">
              <mat-option *ngFor="let option of field.options" [value]="option">
                {{ option }}
              </mat-option>
            </mat-select>
          </mat-form-field>
        </div>

        <div *ngSwitchCase="'tf'">
        	<div *ngIf = "field.autosuggest ; else elseBlock">
					<!-- [(ngModel)]="filterValue" 
						[required]="filterMandatory"
						[placeholder] = "filterDescr"
						[minlength]="auto_fill_len"
						[chipValue] = "displayMetadata"
						(onChangeValue) = "autosuggestChange()"
					-->
					<bb-autosuggest #elm id="{{field.id}}" class="ang-filter-input"
						[uxDesign] = "'UX3'"
						[dataSource]= "userList"
						[chipEnable] = "false"
						[chipValue] = "field.autosuggest.selectedUser"
						[displayMetadata] = "displayMetadata"
						[isPophelp]="true"
						placeholder = "{{field.label}}"
						(onSelectionChange)="changeSelection($event, field.id)" style="width: 100%;">
					</bb-autosuggest> 
        	</div>
        	<ng-template #elseBlock>
		          <mat-form-field ref="user-task">
					<input matInput [value]= "field.value ||''"  id="{{field.id}}" placeholder="{{field.label}}" (blur)="onTfChange($event, iconTarget, field.id)"/>
				</mat-form-field>
        	</ng-template>
        	<!-- <div *ngIf = "!field.autosuggest" >	</div> -->
        </div>
      </div>
    </div>
  </div>
</div>
