import { Component, OnInit, ChangeDetectorRef, Injector, Input, ViewChild, ElementRef, Output, EventEmitter } from '@angular/core';
import { LocaleService } from '@farris/ui-locale';
@Component({
  selector: 'farris-batch-edit-dialog',
  templateUrl: './batch-edit-dialog.component.html',
  styleUrls: ['batch-edit-dialog.component.css']
})
export class BatchEditDialogComponent implements OnInit {
  @ViewChild("header") header: ElementRef;
  // 输入组件
  public inputs = [];
  /**
   * grid列
   * @description 数据格式
   * ```json
   *  { id: "name", label: "姓名", dataType:"boolean" },
   * ```
   */
  @Input() fields = [];
  /**
   * grid列对应的编辑器
   * @description 数据格式
   * ```json
   * {
   *   field: "sex",
   *   editor: {
   *      controlType: "textbox"
   *   }
   * }
   * ```
   */
  @Input() eidtors = [];
  /**
   * 弹窗实例
   */
  @Input() dialogRef = null;

  @Input() title: string = null;
  @Input() rows: number = 1;
  @Output() confirmed = new EventEmitter();
  @Output() canceled = new EventEmitter();

  constructor(private injector: Injector, private cdr: ChangeDetectorRef, private localeService: LocaleService) { }

  ngOnInit() {
    this.inputs.push({
      fields: this.fields.slice(0),
      field: '',
      controlType: 'default',
      id: 'input0',
      value: null,
      options: {}
    });
    this.cdr.markForCheck();
  }
  public cancel(event: any) {
    this.canceled.emit({ instance: this, event });
  }
  public confirm(event: any) {
    this.confirmed.emit({ instance: this, event });
  }
  /**
   * 新增字段编辑行
   */
  public appendRow() {
    const fields = this.computeFields() || [];
    // 不对新增字段做限制
    /*
    if(fields.length<1){
        return;
    }*/
    this.inputs.push({
      fields,
      controlType: 'default',
      value: null,
      id: 'input' + this.inputs.length,
    });
    this.cdr.markForCheck();
  }
  /**
   * 删除字段编辑行
   * @param event event
   * @param row row
   */
  public removeRow(event: any, row: number) {
    this.inputs.splice(row, 1);
    this.updateFields();
    this.cdr.markForCheck();
  }
  /**
   * 编辑字段发生变化
   * @param event event
   * @param row row
   */
  public onFieldChanged(event: any, row: number) {
    const { value: field = null } = event || {};
    const input = this.inputs[row];
    // 更新当前行字段
    input.fields = this.computeFields();
    input.field = field;
    const fieldInfo = this.fields.find(item => item.id === field);
    const dataType = fieldInfo && fieldInfo.dataType || null;
    input.dataType = dataType;
    if (field) {
      const editorInfo = this.eidtors.find(item => item.field === field);
      // 更新当前行编辑器
      if (editorInfo && editorInfo.editor) {
        input.controlType = editorInfo.editor.controlType || 'default';
        input.options = editorInfo.editor.options || {};
      }
    }
    this.updateFields();
  }
  /**
   * 帮助选择数据后的回调
   * @param event event
   */
  public onSelectRows(event: any) {
    const { field = null, rows = [] } = event || {};
    if (field) {
      const item = this.inputs.find(input => input.field === field);
      item.value = rows;
    }
  }
  /**
   * 计算当前行可以选择的字段
   * @param appendField 要添加的字段
   */
  private computeFields(appendField?: any) {
    const others = this.fields.filter(field => {
      if (appendField && field.id === appendField) {
        return true;
      }
      return !this.inputs.find(input => input.field === field.id);
    });
    return others;
  }
  /**
   * 更新所有行可以选择的字段
   */
  private updateFields() {
    this.inputs.forEach(input => {
      input.fields = this.computeFields(input.field);
    });
    this.cdr.markForCheck();
  }
}