import React, { Component, Fragment } from 'react'
import {
	Page, Validator, Notification, FormItem,BottomBtn, Table,
	InputItem, Input, Bind, SelectItem, Button, Label, DatePickerItem, Section, ConfirmButton, Steps
} from '@/components/Common-Library'
//import { ButtonModal,PtyPicker, ModalTest } from '@/components/Business-Library'
import Api from '@/service/api'
import CodeTableFactory from '@/components/CodeTable'
import "./index.less"
import { inject, observer } from 'mobx-react'
import { action, observable } from 'mobx'
import { Row, Col, Popconfirm, Modal ,Spin,Divider} from 'antd';
import { PtyPicker } from '@/components/Business-Library'
import { Link, withRouter } from 'react-router-dom'
import Ptspta from '@/views/Public/Ptspta'
import Ptspta1 from '@/views/Public/Ptspta1'
import Business from '@/views/Public/Business'
const { Pre, Next, StepWrapper } = Steps
const CodeTable = CodeTableFactory.getInstance()
const confirm = Modal.confirm
@withRouter
@inject('UserContext')
@inject('i18n')
@observer
export default class CptadvBasicScreen extends Page {
	@observable
	formBlur = false

	constructor(props) {
		super(props)
		this.model = props.model
		this.bind = Bind.bind(this)
	}
   
   onTabFocus(){
		console.log('#我被选中#')
	}
	
	onTabBlur(){
		//this.goNext();
		console.log('#我已离开#')
	}
	// 获取业务编号 按钮事件
	async onGetref() {
		const rtnmsg = await Api.post(this.props.extra.inifrm + '/getref', { data: this.model })
		if (rtnmsg.retcod == SUCCESS) {
			// Notification.success({ message: '数据提交成功!' })
			this.model.ownref = rtnmsg.data.ownref;
		}
		else {
			Notification.error({ message: '服务端请求失败!' })
		}
		//余下逻辑处理

	}
  /*//退出按钮
	onRtn = async () => {
		this.com.wrappedInstance.wrappedInstance.onRtn();
	}
	// 暂存按钮
	onPed = async () => {
		 this.com.wrappedInstance.wrappedInstance.onPed();
	}
	// 校验 按钮
	onChk = () => {
		this.formBlur=true
		this.com.wrappedInstance.wrappedInstance.onChk();
	}
	
	async onRecal() {
		this.formBlur = true  //已触发表单提交处理
		const rtnmsg = await Api.post(this.props.extra.inifrm + '/setmod_ast', { data: this.model })
		if (rtnmsg.retcod == SUCCESS) {
			this.model.fegmod_feslst = rtnmsg.data.fegmod_feslst;
			this.model.glgmod_glslst = rtnmsg.data.glgmod_glslst;
		}
		else {
			Notification.error({ message: '服务端请求失败!' })
		}
		//余下逻辑处理
	}*/

	//清算路径
	onLiqtyp = () => {
		const liqtyp1 = [
			{ label: '01-SWIFT支付', value: 'SWT' },
			{ label: '02-境内外币支付', value: 'FMT' },
			{ label: '03-行内划转', value: 'ZZT' },
		]
		const liqtyp2 = [
			{ label: '03-行内划转', value: 'ZZT' },
			{ label: '04-跨境人民币支付', value: 'CIP' },
			{ label: '05-人民币大额支付', value: 'CMT' },
		]
		const cur = this.model.max_cur
		return (<SelectItem InputProps={{
			...this.bind("liqtyp"), disabled: !cur,
			onChange: val => {
				this.model.liqtyp = val
				this.model.swftyp = ""
			}
		}}
			code={!cur ? CodeTable.liqtyp : cur == 'CNY' ? liqtyp2 : liqtyp1}
		/>)

	}
	//报文类型 
	onSwftyp = () => {
		const swfcod = {
			SWT: [
				{ label: 'MT103', value: '103' },
				{ label: 'MT103+MT202', value: '103202' },
			],
			FMT: [
				{ label: 'FMT100', value: 'F00' },
				{ label: 'FMT101', value: 'F01' },
			],
			CIP: [
				{ label: 'CIPS001', value: 'C00' },
				{ label: 'CIPS101', value: 'C01' },
			],
			CMT: [
				{ label: 'CMT100', value: 'CM0' },
			],
		}
		swfcod.ZZT = swfcod.SWT
		const liqtyp = this.model.liqtyp
		return (
			<SelectItem InputProps={{ ...this.bind("swftyp"), disabled: (!liqtyp || liqtyp == 'ZZT') }} code={swfcod[liqtyp]} />
			//<SelectItem InputProps={{...this.bind("swftyp"),disabled: ( !liqtyp||liqtyp=='ZZT')}}  code={swfcod[liqtyp]}   />
		)
	}
	
	
	//交易内实现
	renderPage() {
		const bind = this.bind
		const { i18n } = this.props
		const { bchlevelLst } = this.props.extra
		if (this.props.flag == true) {
			return <Spin style={{ width: "100%", justifyContent: "center" }} spinning={this.props.flag} />
		}
		return (
			<div style={{ position: 'relative' }}>
			    <Business  wrappedComponentRef={ref => (this.com = ref)} page={this} extra={this.props.extra}  model={this.model} />
				{/*第一行*/}

				<Row>
					<Col span={12}>
						<Row className='row'>
							<Col span={5} offset={2}>
								{/* 业务编号 label框 */}
								<Label i18nId={"CPTP_LT000054"} />
							</Col>
							<Col span={10}>
								{/* 业务编号 输入框 // \cpdgrp\rec\ownref    业务编号 */}
								<InputItem InputProps={bind("ownref")} disabled={true} />
							</Col>
							<Col span={4} offset={1}>
								{/* 业务编号 查询按钮 */}
								<Button type="primary" onClick={() => this.onGetref()}>
									<Label i18nId="CPTP_BT000091" />
								</Button>
							</Col>
						</Row>
					</Col>
					<Col span={12}>
						<Row className='row'>
							<Col span={5} offset={2}>
								{/* 业务归属机构 label框 */}
								<Label i18nId={"CPTP_LT000052"} />
							</Col>
							<Col span={14}>
								{/* // \cpdgrp\rec\branchinr    所属机构 业务归属机构 选择输入框 动态码表?? */}
								<SelectItem InputProps={bind("ownbch")} code={bchlevelLst} />
							</Col>
						</Row>
					</Col>

				</Row>
				{/*第二行*/}
				<Row >
					<Col span={12}>
						<Row className='row'>
							<Col span={5} offset={2}>
								{/* 汇款方式 label框 */}
								<Label i18nId={"CPTP_LT000060"} />
							</Col>
							<Col span={14}>
								{/* // \cpdgrp\rec\paytyp    汇款方式  汇款方式 选择输入框 */}
								<SelectItem InputProps={bind("paytyp")} code={CodeTable.paytyp} />
							</Col>
						</Row>
					</Col>
					<Col span={12}>
						<Row className='row'>
							<Col span={5} offset={2}>
								{/* 客户经理 label框 */}
								<Label i18nId={"CPTP_LT000059"} />
							</Col>
							<Col span={14}>
								{/* // \cpdgrp\orc\pty\ownusr    客户经理 客户经理 输入框 */}
								<InputItem InputProps={bind("pty_ownusr")} />
							</Col>
						</Row>
					</Col>
				</Row>
				<Row>
					<Col span={12}>
						<Row className='row'>
							<Col span={5} offset={2}>
								{/* 收款币种金额 label框 */}
								<Label i18nId={"CPTP_LT000062"} />
							</Col>
							<Col span={5}>
								<SelectItem InputProps={{
									...bind("max_cur"), onChange: val => {
										this.model.max_cur = val
										this.model.liqtyp = ""
										this.model.swftyp = ""
									}
								}}
									code={CodeTable.curtxt} />
							</Col>
							<Col span={8} offset={1}>
								<InputItem   InputProps={{...bind("max_amt"),type:"amount",cur:this.model.max_cur}} />
							</Col>
						</Row>
					</Col>
					<Col span={12}>
						<Row className='row'>
							<Col span={5} offset={2}>
								{/* 起息日 label框 */}
								<Label i18nId={"CPTP_LT000063"} />
							</Col>
							<Col span={14}>
								{/* // \cpdgrp\rec\valdat    起息日 起息日 选择输入框 */}
								<DatePickerItem InputProps={bind("valdat")} />
							</Col>
						</Row>
					</Col>
				</Row>
				
				{/*第三行*/}
				<Row >
					<Col span={12}>
						<Row className='row'>
							<Col span={5} offset={2}>
								{/* 汇款类型 label框 */}
								<Label i18nId={"CPTP_LT000061"} />
							</Col>
							<Col span={14}>
								{/* // \cpdgrp\rec\cpdflg    汇款类型  汇款类型 选择输入框 */}
								<SelectItem InputProps={bind("cpdflg")} code={CodeTable.custyp} />
							</Col>
						</Row>
					</Col>
					<Col span={12}>
						<Row className='row'>
							<Col span={5} offset={2}>
								{/* 解付方式 label框 */}
								<Label i18nId={"CPTP_LT000064"} />
							</Col>
							<Col span={14}>
								{/* // \cpdgrp\rec\diptyp    解付方式  解付方式 选择输入框 */}
								<SelectItem InputProps={bind("diptyp")} code={CodeTable.diptyp} />
							</Col>
						</Row>
					</Col>
				</Row>
					{/* 第五行 */}
				<Row>
				   	<Col span={12}>
						<Row className='row'>
							<Col span={5} offset={2}>
								{/* 清算路径 label框 */}
								<Label i18nId={"CPTP_LT000065"} />
							</Col>
							<Col span={14}>
								{/* // \cpdgrp\rec\liqtyp    清算路径 清算路径 选择输入框 
								<SelectItem InputProps={bind("liqtyp")} code={CodeTable.liqtyp} />*/}
								{this.onLiqtyp()}
							</Col>
						</Row>
					</Col>
					
					<Col span={12}>
						<Row className='row'>
							<Col span={5} offset={2}>
								{/* 报文类型 label框 */}
								<Label i18nId={"CPTP_LT000066"} />
							</Col>
							<Col span={14}>
								{/*  // \cpdgrp\rec\swftyp    报文类型  报文类型 选择输入框 
								<SelectItem InputProps={bind("swftyp")} code={CodeTable.swftyp} />*/}
									{this.onSwftyp()}
							</Col>
						</Row>
					</Col>
					
				
				</Row>
				{/*第四行*/}
				<Row >
				  <Col span={12}>
						<Row className='row'>
							<Col span={5} offset={2}>
								{/* 收款人国别 label框 */}
								<Label i18nId={"CPTP_LT000088"} />
							</Col>
							<Col span={14}>
								{/* // \cpdgrp\rec\stacty    交易对手国别 收款人国别 选择输入框 */}
								<SelectItem InputProps={bind("stacty")} code={this.props.extra.stactyLst} />
							</Col>
						</Row>
					</Col>
					
					<Col span={12}>
						<Row className='row'>
							<Col span={5} offset={2}>
								{/* 汇款人性质 label框 */}
								<Label i18nId={"CPTP_LT000087"} />
							</Col>
							<Col span={14}>
								{/* // \bopmod\dbagrp\bas\custype    收款人类型  汇款人性质 选择输入框 */}
								<SelectItem InputProps={bind("custyp")} code={CodeTable.ptytyp} desp="汇款人性质" path="/cpdgrp/rec/custyp" />
							</Col>
						</Row>
					</Col>
				</Row>
			
				
				{/*第七行*/}
				{/* 四个查询 用public中的组件 */}
				
					<Row>
					<Col span={12}>
						<Ptspta  model={this.model} argArr={{ desc: "收款人", prefix: 'pts', url: 'cptadv/pyep_ptysel', flg: 'C', datakey: '\\cptp\\pyep\\ptslst' }} formBlur={this.formBlur}/>
					</Col>
					<Col span={12}>
						<Ptspta  model={this.model} argArr={{ desc: "汇款人", prefix: 'pts1', url: 'cptadv/orcp_ptysel', flg: 'C', datakey: '\\cptp\\orcp\\ptslst' }} formBlur={this.formBlur}/>
					</Col>
				</Row>
				
				{/*
				<Row>
					<Ptspta
						// ref={ref => {
						// 	this.orcp = ref
						// }}
						model={this.model}
						argArr={{
							desc: "收款人",
							prefix: 'pts',
							url: 'cptadv/pyep_ptysel',
							flg: 'C',
							datakey: '\\cptp\\pyep\\ptslst'
						}} />
					<Ptspta
						//  ref={ref => {
						// 	this.orcp = ref
						// }}
						model={this.model}
						argArr={{
							desc: "汇款人",
							prefix: 'pts1',
							url: 'cptadv/orcp_ptysel',
							flg: 'C',
							datakey: '\\cptp\\orcp\\ptslst'
						}} />
				</Row>*/}
				{/*第八行*/}
				<Row >
					<Col span={12}>
						<Row className='row'>
							<Col span={5} offset={2}>
								{/* 收款人账号 label框 */}
								<Label i18nId={"CPTP_LT000069"} />
							</Col>
							<Col span={14}>
								{/* // \cpdgrp\rec\pyeacc    收款人账号 收款人账号？ 输入框 */}
								<InputItem InputProps={bind("pyeacc")} />
							</Col>
						</Row>
					</Col>
					<Col span={12}>
						<Row className='row'>
							<Col span={5} offset={2}>
								{/* 汇款人账号 label框 */}
								<Label i18nId={"CPTP_LT000070"} />
							</Col>
							<Col span={14}>
								{/* // \cpdgrp\rec\orcacc    付款人账号 汇款人账号？ 输入框 */}
								<InputItem InputProps={bind("orcacc")} />
							</Col>
						</Row>
					</Col>
					<Col span={12}>
					</Col>
				</Row>
				
					<Row>
					<Col span={12}>
						<Ptspta  model={this.model} argArr={{ desc: "我行账户行", prefix: 'pts2', url: 'cptadv/pybp_ptysel', flg: 'B', datakey: '\\cptp\\pybp\\ptslst' }} formBlur={this.formBlur}/>
					</Col>
					<Col span={12}>
						<Ptspta  model={this.model} argArr={{ desc: "汇款人账户行", prefix: 'pts3', url: 'cptadv/orip_ptysel', flg: 'B', datakey: '\\cptp\\orip\\ptslst' }} formBlur={this.formBlur}/>
					</Col>
				</Row>
				{/*第九行*
				<Row>
					<Ptspta
						// ref={ref => {
						// 	this.orcp = ref
						// }}
						model={this.model}
						argArr={{
							desc: "我行账户行",
							prefix: 'pts2',
							url: 'cptadv/orip_ptysel',
							flg: 'B',
							datakey: '\\cptp\\orip\\ptslst'
						}} />
					<Ptspta
						//  ref={ref => {
						// 	this.orcp = ref
						// }}
						model={this.model}
						argArr={{
							desc: "汇款人账户行",
							prefix: 'pts3',
							url: 'cptadv/pybp_ptysel',
							flg: 'B',
							datakey: '\\cptp\\pybp\\ptslst'
						}} />
				</Row>
				
				<Row type="flex" justify="center">
					<Col>
						<div type="primary"  className='button2'>
							<ConfirmButton
								onOK={this.onRtn}
								title=""
								message="确定退出？"
							>
								<Label i18nId="MTABUT_BT000464" />
							</ConfirmButton>
						</div>
						<div type="primary"  className='button2'>
							<ConfirmButton
								onOK={this.onPed}
								title=""
								message="确定暂存？"
							>
								<Label i18nId="MTABUT_BT000398" />
							</ConfirmButton>
						</div>
						<div className='button2'>
							<Button type="primary" onClick={this.onChk}>
								<Label i18nId="MTABUT_BT000180" />
							</Button>
						</div>
					</Col>
				</Row>*/}
				
				{/* */}     <BottomBtn _this={this} /> 
			</div >
		)
	}
}
