import {Component, ElementRef, OnInit, ViewChild, TemplateRef, ViewEncapsulation} from '@angular/core';
import {FormBuilder, FormControl, FormGroup, Validators} from '@angular/forms';
import {CustomValidators} from 'ng2-validation';
import {FlexTableComponent} from '../../../shared/common/FlexTable.component';
import {FrameRequest} from '../../../shared/frame/frame-request';
import {FrameFunction} from '../../../shared/frame/frame_function';
import {AppComponent} from '../../../app.component';

import { BsModalService } from "ngx-bootstrap/modal/bs-modal.service";

declare var $: any;
@Component({
  selector: 'app-flex-optr',
  templateUrl: './flexOptr.component.html',
  styleUrls: ['./flexOptr.component.scss'],
})

export class FlexOptrComponent extends FlexTableComponent  implements OnInit {

  public query = {
    query:"",
    optrSex: "",
    optrRole: "",
    optrStatus: "",
  }

  public sexItems = [];

  public constructor(
    public bsModalService: BsModalService,
  ) {
    super(bsModalService);
    //编辑页面验证初始化
    let password = new FormControl("", Validators.required);
    let certainPassword = new FormControl( "",CustomValidators.equalTo(password));
    const fb = new FormBuilder();
    this.formModel = fb.group({
      optr_id: [],
      optr_name: ["", Validators.required],
      login_name: ["", Validators.required],
      optr_sex: ["", Validators.required],
      optr_mobile: [
        "",
        Validators.pattern(
          "^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\\d{8}$"
        )
      ],
      optr_tel: [""],
      optr_email: ["", Validators.email],
      passwordGroup: fb.group({
        login_pass: password,
        confirmPassword: certainPassword
      })
    });
  }

  ngOnInit() {
    this.sexItems = [{id: 1,text:'男'},{id: 2,text:'女'}]
  }

  async goEdit(template: TemplateRef<any>,item?){
    FrameFunction.UntouchedForm(this.formModel);
    //新增
    if(!item || item.optr_id === undefined) {
      //初始化数据
      this.item = {'optr_status' : 'Active'};
    } else {
      FrameRequest.requestEntity('frame/optr/find.htm',{optr_id: item.optr_id},(entity) => {
        this.item = entity;
      });
    }
    //modal框展现
    this.bsModalWin = this.bsModalService.show(template, { class: "modal-lg" });
  }

  async delete(item?){
    let checkedArray = [];
    item ? checkedArray[0] = item.optr_id: 
           checkedArray = this.framePager.getCheckedArray((item)=>item.optr_id)

    if(checkedArray.length === 0){
      AppComponent.alert({title:"信息提示",text:"请选择数据!"})
      return;
    }
    AppComponent.confirm("确定删除?",()=>{
      FrameRequest.requestMap('frame/optr/delete.do', {ids:checkedArray.join()}, () => {
        AppComponent.GobalComponent.successMsg('操作员信息保存成功');
      });
    });


  }

  async save() {
    if (!FrameFunction.validForm(this.formModel)) {
      return;
    }
    let operType = this.item.id?"edit":"add" ;
    FrameRequest.requestEntity(`frame/optr/${operType}.htm`, this.item, () => {
      AppComponent.GobalComponent.successMsg('操作员信息保存成功');
    });
  }
  
}
