import { Component, Input, Inject, forwardRef, Output, EventEmitter } from '@angular/core';
import { RdComponent } from '../../base/rdComponent';
import { Form } from './form';
import { RdLib } from '../../base/rdLib';

export type FormButtonSize = 'small' | 'medium';

@Component({
  selector: 'rd-submit',
  template: `
    <rd-button [rd-icon]="icon" [rd-size]="size" [rd-color]="color" [rd-text]="text" (rd-click)="submit()" [rd-process]="onProcess" [rd-disabled]="disabled"></rd-button>
  `
})
export class FormSubmit extends RdComponent {
  constructor(@Inject(forwardRef(() => Form)) private form: Form) {
    super();
  }

  @Input("rd-text") text: string = RdLib.localization.translateEn('Submit');
  @Input("rd-icon") icon: string = 'fas fa-save';
  @Input("rd-color") color: string = "green";
  @Input("rd-size") size: FormButtonSize = 'small';
  @Input("rd-disabled") disabled;
  @Input("rd-process") onProcess;

  @Output("rd-click") clickEvent: EventEmitter<any> = new EventEmitter<any>();

  submit = function () {
    if (this.form.validate()) {
      var query = this.form.getQuery();
      this.clickEvent.emit(query);
    }
    else {
      var header = RdLib.localization.translateEn("Form Error");
      var body = RdLib.localization.translateEn("Please fix form warnings to process");
      RdLib.screenOperations.toastr.warning(body, header);
    }
  };
}

@Component({
  selector: 'rd-clean',
  template: `
    <rd-button [rd-icon]="icon" [rd-size]="size" [rd-color]="color" [rd-text]="text" [rd-disabled]="disabled" (rd-click)="clean()"></rd-button>
  `
})
export class FormClean extends RdComponent {
  constructor(@Inject(forwardRef(() => Form)) private form: Form) {
    super();
  }

  @Input("rd-text") text = RdLib.localization.translateEn('Clear');
  @Input("rd-icon") icon = 'fas fa-trash-alt';
  @Input("rd-color") color = "red";
  @Input("rd-size") size = 'small';
  @Input("rd-disabled") disabled;

  @Output("rd-click") clickEvent: EventEmitter<any> = new EventEmitter<any>();

  clean = function () {
    this.form.clean();
    this.clickEvent.emit();
  };
}