import { Component, EventEmitter, Output } from '@angular/core';
import { NavParams } from 'ionic-angular'
import { ModalOption } from '../type'

const defaultOption: ModalOption = {
  title: '温馨提示',
  content: '',
  icon: false,
  okText:'确认',
  cancelText:'取消'
}

@Component({
  selector: 'modal-alertWithClose',
  template:'<a class="absolute right-px-15 top-px-15" (click)="cancel()">'+
  '<img src="assets/images/public/icon-modal-close.png" style="height:14px;">'+
  '</a>'+
  '<div class="modal-icon pt-3 pb text-center" *ngIf="option.icon"' +
  ' [innerHtml]="option.icon"></div>' +
  '<div class="modal-body"' +
  ' [innerHtml]="option.content">' +
  '</div>' +
  '<div class="clearfix">' +
  '<a (click)="ok()"' +
  ' style="border-bottom-left-radius:5px;border-bottom-right-radius:5px;"' +
  ' class="block text-center white f16 bg-primary pv-px-15 {{option.okClass}}"' +
  ' [innerHtml]="option.okText"></a>' +
  '</div>' +
  '<div [innerHtml]="option.extra"></div>'
})
export class ModalAlertWithCloseComponent {
  option: ModalOption = defaultOption;

  constructor(params: NavParams) {
    this.option = Object.assign({},this.option,params.data);
  }

  // 点击确定
  @Output() okEvent = new EventEmitter();
  ok = (event) => {
    if(event) event.preventDefault();
    if(event) event.stopPropagation();
    this.okEvent.emit(true);
  }

  // 点击取消
  @Output() cancelEvent = new EventEmitter();
  cancel = (event) => {
    if(event) event.preventDefault();
    if(event) event.stopPropagation();
    this.cancelEvent.emit(false);
  }
}