import React, { Component, Fragment } from 'react'
import {
	Page, Validator, Notification, FormItem,
	InputItem, Input, Bind, SelectItem, Button, Label, Table, Section, DatePickerItem,ConfirmButton,TextAreaItem
} from '@/components/Common-Library'
import { Divider } from 'antd'
import Api from '@/service/api'
import mUsrrel from '../model'
import CodeTableFactory from '@/components/CodeTable'
import "./index.less"
import { inject, observer } from 'mobx-react'
import { action, observable } from 'mobx'
import { Col, Row, Card } from 'antd'
import { Link } from 'react-router-dom'
import Moment from 'moment'
import Ptspta1 from '@/views/Public/Ptspta1'
// import Bchpicker from './Bchpicker'
const CodeTable = CodeTableFactory.getInstance()

@inject('UserContext')
@inject('i18n')
@observer
export default class UsrrelScreen extends Page {
	@observable
  formBlur = false
  
  @observable
  extra = { inifrm: 'usrrel', usrinr: ''}
  
  //提交按钮的禁用
  @observable
  isDisabled=false;

  @observable
	usg:[]

	constructor(props) {
		super(props)
		this.model = new mUsrrel()
    this.bind = Bind.bind(this)
    this.onRelrow=this.onRelrow.bind(this);
    this.onReprow=this.onReprow.bind(this);
    
  }
  
  //初始化代码
  async componentWillMount() {
    if(this.props.location.state){
      let selflg = this.props.location.state.selflg
			if (selflg)
				this.onSel()
    }else{
		 this.extra.usrinr=this.props.location.query.usrinr;
      const rtnmsg = await Api.post(this.extra.inifrm + '/init', {params:{ usrinr:this.extra.usrinr}})
      if (rtnmsg.retcod == SUCCESS) {
        Object.assign(this.model, rtnmsg.data)
        this.usg=this.props.location.query.usg;
      }
      else {
        Notification.error({ message: '服务端请求失败!' })
      }
    }
    //快照模式下，不必开启校验，否则，静默校验，和记录变动
    !this.loadDisplay() && this.model.openMonitor() //开启校验	
  }

	componentWillUnmount() {
		this.model.stopMonitor&&this.model.stopMonitor()//关闭校验
	}

	//按钮事件
	async onRelrow (){//复核
		this.formBlur=true  //已触发表单提交处理
		Validator.validate(this.model,this.model.descriptor,async(errors,values)=>{
			  
				const rtnmsg = await Api.post('usrrel/relrow',{params: { usrinr:this.extra.usrinr }, data: this.model })
				if(rtnmsg.retcod == SUCCESS)
				{
					Notification.success({message:'复核成功!'})
					this.props.history.push( 'dblusr');
					
				}
				else
				{
				  Notification.error({message:'服务端请求失败!'})
				}
				//余下逻辑处理
					
		})
	}
	
	async onReprow (){//退回
		this.formBlur=true  //已触发表单提交处理
		Validator.validate(this.model,this.model.descriptor,async(errors,values)=>{
			
				const rtnmsg = await Api.post('usrrel/reprow',{params: { usrinr:this.extra.usrinr }, data: this.model })
				if(rtnmsg.retcod == SUCCESS)
				{
					Notification.success({message:'退回成功!'})
					this.props.history.push( 'dblusr');
					
				}
				else
				{
				  Notification.error({message:'服务端请求失败!'})
				}
				//余下逻辑处理
					
		})
	}
  
	onRtn = () => {
		this.props.history.push("dblusr");
	}

	//交易内实现
	renderPage() {
		const bind = this.bind
		const { i18n } = this.props
		const CodeTable = CodeTableFactory.getInstance()

		return (
			<Card title="参与机构用户注册复核" size="small" className="transTitle">
				<div style={{ position: 'relative' }}>
        <Row>
            <Col span={12}>
              <Row className="row">
                <Col span={5} offset={2}>
                <Label itext="用户ID" />
                </Col>
                <Col span={14}>
				<InputItem InputProps={bind("nam")}  disabled={true} maxLength={8}  desp="用户ID" path="/urggrp/rec/nam" />
                </Col>
              </Row>
            </Col>
            <Col span={12}>
              <Row className="row">
                <Col span={5} offset={2}>
                <Label itext="用户名称" />
                </Col>
                <Col span={14}>
				<InputItem InputProps={bind("dspnam")}  disabled={true} maxLength={40}  desp="用户名称" path="/urggrp/rec/dspnam" />
                </Col>
              </Row>
            </Col>
          </Row>

		  <Row>
            <Col span={12}>
              <Row className="row">
                <Col span={5} offset={2}>
                <Label itext="密码" />
                </Col>
                <Col span={14}>
				<InputItem InputProps={{type:"password",...bind("pwd")}} disabled={true} maxLength={100}  desp="密码" path="/urggrp/rec/pwd"/>
                </Col>
              </Row>
            </Col>
            <Col span={12}>
              <Row className="row">
                <Col span={5} offset={2}>
                <Label itext="用户组" />
                </Col>
                <Col span={14}>
				<SelectItem InputProps={bind("usg")} code={this.usg}  disabled={true} desp="用户组" path="/urggrp/rec/usg"/>
                </Col>
              </Row>
            </Col>
          </Row>

		  <Row>
        <Row>
          <Col span={12}>
              <Row className="row">
                <Col span={5} offset={2}>
                <Label itext="归属机构支付行号" />
                </Col>
                <Col span={6}>
                <InputItem InputProps={bind("rmbrpt")}  maxLength={12}  disabled={true} desp="归属机构人行支付行号" path="/urggrp/rec/rmbrpt" />
                </Col>
                {/* <Col span={4} offset={1}>
                <Bchpicker size='small' type="primary" model={this.model}  childEvevnt={this.childEvevnt}  />
                </Col> */}
              </Row>
            </Col>
            <Col span={12}>
              <Row className="row">
                <Col span={5} offset={2}>
                <Label itext="归属机构" />
                </Col>
                <Col span={14}>
                <InputItem InputProps={bind("bchnam")} disabled={true}  maxLength={40}  desp="归属机构中文名称" path="/urggrp/rec/bchnam" />
                </Col>
       
              </Row>
            </Col>
    
          </Row>

         
            <Col span={12}>
              <Row className="row">
                <Col span={5} offset={2}>
                <Label itext="电话" />
                </Col>
                <Col span={14}>
				<InputItem InputProps={bind("tel")}  maxLength={30} disabled={true} desp="电话" path="/urggrp/rec/tel" />
                </Col>
              </Row>
            </Col>
            <Col span={12}>
              <Row className="row">
                <Col span={5} offset={2}>
                <Label itext="电子邮件" />
                </Col>
                <Col span={14}>
				<InputItem InputProps={bind("eml")}  maxLength={80} disabled={true} desp="电子邮件" path="/urggrp/rec/eml" />
                </Col>
              </Row>
            </Col>
          </Row>

          <Row>
            <Col span={12}>
              <Row className="row">
                <Col span={5} offset={2}>
                <Label itext="DC码值" />
                </Col>
                <Col span={14}>
                <InputItem InputProps={bind("ukey")}  disabled={true}  maxLength={32}  desp="ukey的dc码" path="/urggrp/rec/ukey" />
                </Col>
              </Row>
            </Col>
    
          </Row>

         
      
		  <Row type="flex" justify="center">
              <Col>
                <div className="button0">
                  <div className='button2'>
                    {/* 退出按钮 */}
                    <Button type="primary" onClick={this.onRtn}>
                      <Label i18nId="MTABUT_BT000020" />      
                    </Button>
                  </div>
                  <div className='button2'>
                    <ConfirmButton
                      type="primary"
                      onOK={this.onReprow}
                      message="确定退回？"
                    >
                      <Label itext="退回" />
                    </ConfirmButton>
                  </div>
                  <div className='button2'>
                    <ConfirmButton
                      type="primary"
                      onOK={this.onRelrow}
                    //   icon="save"
                      message="确定复核？"
                    >
                      <Label itext="复核" />
                    </ConfirmButton>
                  </div>

              
                  
                </div>
              </Col>
            </Row>
				</div>
			</Card>
		)
	}
}
