import { Component, OnInit, Input, HostBinding } from "@angular/core";
import { FormGroup } from "@angular/forms";
import { trim } from 'lodash-es';
import { CommonUtils } from '@farris/ui-common';
import { IDynamicBaseControl, IDyanmicHelpControl } from "../../interfaces/dynamic-control.interface";
@Component({
  selector: "dynamic-help",
  template: `
    <div class="farris-group-wrap" [formGroup]="form">
      <div class="form-group farris-form-group">
        <label class="col-form-label">
          <span *ngIf="0" class="farris-label-info text-danger">*</span>
          <span class="farris-label-text">{{control.name}}</span>
        </label>
        <div class="farris-input-wrap" *ngIf="options">
            <farris-lookup-grid
              [formControlName]="control.labelCode"
              [uri]="options?.uri"
              [singleSelect]="options?.singleSelect"
              [displayType]="options?.displayType"
              [idField]="options?.idField"
              [textField]="options?.textField"
              [valueField]="options?.valueField"
              [title]="options?.dialogTitle"
              [mappingFn]="mapping"
              [mapFields]="options?.mapFields"
              [readonly]="options?.readonly"
          ></farris-lookup-grid>
        </div>
      </div>
    </div>
  `,
  styles: []
})
export class HelpComponent implements OnInit {
  @HostBinding('class') className: string;
  @Input()
  control: IDyanmicHelpControl;
  @Input()
  form: FormGroup;
  options: any;
  constructor(private utils: CommonUtils) {}
  ngOnInit() {
    this.options = this.control.control;
    this.className = this.control.className ? this.control.className : 'col-12 col-md-6 col-xl-3 col-el-2';
  }

  /**
   * @param helpData 选中的数据，如果是多选，是数组；如果是单选，是普通对象
   * @param mapFields
   * @param bindingData 帮助所在form的value对象
  */
  mapping =(helpData: any, mapFields: any) => {
    console.log('helpData ', helpData);
    if (mapFields) {
      const helpFields = Object.keys(mapFields);
      helpFields.forEach( (f: any) => {
          let val = '';
          if (helpData) {
              if (helpData instanceof Array) {
                  val = helpData.map( (h: any) => {
                      return this.utils.getValue(f, h);
                  }).join(',');
              } else {
                  val = this.utils.getValue(f, helpData);
              }

          }
          mapFields[f].split(',').forEach( (ff: any) => {
              const field = trim(ff);
              // this.utils.setValue(bindingData, field, val);
              this.form.controls[field].setValue(val);
          });
      });
    }
  }
}