import React, { Component, Fragment } from 'react'
import {
	Page, Validator, Notification, FormItem,
	InputItem, Input, Bind, SelectItem, Button, Label, DatePickerItem, Section, ConfirmButton, Steps
} from '@/components/Common-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} from 'antd';
import { PtyPicker } from '@/components/Business-Library'
import { Link, withRouter } from 'react-router-dom'
import Ptspta from '@/views/Public/Ptspta'
import Business from '@/views/Public/Business'
import Ptspta1 from '@/views/Public/Ptspta1'

const { Pre, Next, StepWrapper } = Steps
const CodeTable = CodeTableFactory.getInstance()
const confirm = Modal.confirm

@withRouter
@inject('UserContext')
@inject('i18n')
@observer
export default class DetpScreen extends Page {
	@observable
	formBlur = false

	constructor(props) {
		super(props)
		this.model = props.model
		this.bind = Bind.bind(this)
		this.pageHide = true

	}

	//交易内实现
	renderPage() {
		const bind = this.bind
		const { i18n } = this.props
		const { bchlevelLst } = this.props.extra
		//const {next,pre} = this.props.steps
		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)}  steps={this.props.steps} extra={this.props.extra}  model={this.model} />
				{/* 第一行 */}
				<Row>
				<Col span={12}>
					<Ptspta1 model={this.model} argArr={{ desc: "委托行", prefix: 'pts2', url: 'ditopn/agep_ptysel', flg: 'C', datakey: '\\ditp\\agep\\ptslst' }}  />
				</Col>
				<Col span={12}>
					<Ptspta1 model={this.model} argArr={{ desc: "转让行", prefix: 'pts', url: 'ditopn/a2bp_ptysel', flg: 'C', datakey: '\\ditp\\a2bp\\ptslst' }}  />
				</Col>


				</Row>
				{/* 第二行 */}
				<Row>
					<Col span={12}>
						<Row className="row" >
							<Col span={5} offset={2}>
								{/* 合同编号*/}
								<Label itext="合同编号"  />	
							</Col>
							<Col span={14}>
							<InputItem InputProps={bind("conno")}  maxLength={35}  desp="合同编号" path="/didgrp/rec/conno" />
							</Col>
							<Col span={3}>
						
							</Col>
							<Col span={5} offset={2}>
								{/* 合同金额 */}
								<Label itext="合同金额"  />
							</Col>
							<Col span={6}>
								<SelectItem InputProps={{
									...bind("concur"), onChange: val => {
										this.model.concur = val
										this.model.liqtyp = ""
										this.model.swftyp = ""
									}
								}}
									code={CodeTable.curtxt} />
							</Col>
							<Col span={7} offset={1}>
								<InputItem InputProps={bind("conamt")} />
							</Col>

							<Col span={5} offset={2}>
								{/* 分批装运货物/分次提供服务*/}
								<Label itext="分批装运货物/分次服务"  />	
							</Col>
							<Col span={14}>
							<SelectItem InputProps={bind("shppar")} code={CodeTable.allow}  desp="分批装运货物/分次提供服务" path="/didgrp/rec/shppar"/>
							</Col>
							<Col span={3}>
						
							</Col>
						
						</Row>
					</Col>
					<Col span={12}>
					<Ptspta1 model={this.model} argArr={{ desc: "保兑行", prefix: 'pts5', url: 'ditopn/conp_ptysel', flg: 'C', datakey: '\\ditp\\conp\\ptslst' }}  />
					</Col>
				</Row>
				{/* 第三行 */}
				<Row>
					<Col span={12}>
						<Row className="row" type='flex'>
						<Col span={5} offset={2}>
								{/* 分期装运/提供服务*/}
								<Label itext="分期装运/提供服务"  />	
							</Col>
							<Col span={14}>
							<SelectItem InputProps={bind("shpper")} code={CodeTable.allow}  desp="分期装运/提供服务" path="/didgrp/rec/shpper"/>
							</Col>
							<Col span={3}>
						
							</Col>	
							<Col span={5} offset={2}>
								{/* 转运*/}
								<Label itext="转运"  />	
							</Col>
							<Col span={14}>
							<SelectItem InputProps={bind("shptrs")} code={CodeTable.allow}  desp="转运" path="/didgrp/rec/shptrs"/>
							</Col>
							<Col span={3}>
						
							</Col>	
							<Col span={5} offset={2}>
								{/* 是否可转让*/}
								<Label itext="是否可转让"  />	
							</Col>
							<Col span={14}>
							<SelectItem InputProps={bind("traflg")} code={CodeTable.yesno}  desp="是否可转让" path="/didgrp/rec/traflg"/>
							</Col>
							<Col span={3}>
						
							</Col>
						</Row>
					</Col>
					<Col span={12}>
					<Ptspta1 model={this.model} argArr={{ desc: "议付行", prefix: 'pts6', url: 'ditopn/negp_ptysel', flg: 'C', datakey: '\\ditp\\negp\\ptslst' }}  />
					</Col>
				</Row>
				{/* 第四行 */}
				{/* 第五行 */}
				<Row>
					<Col span={12}>
						<Row className="row">
						<Col span={5} offset={2}>
								{/* 保兑标志*/}
								<Label itext="保兑标志"  />	
							</Col>
							<Col span={14}>
							<SelectItem InputProps={bind("cfmflg")} code={CodeTable.yesno}  desp="保兑标志" path="/didgrp/rec/cfmflg"/>
							</Col>
							<Col span={3}>
						
							</Col>
						</Row>
					</Col>
					<Col span={12}>
						<Row className="row">
							<Col span={5} offset={2}>
								{/* 指定议付行 */}
								<Label i18nId={"指定议付行"} />
							</Col>
							<Col span={14}>
							<SelectItem InputProps={bind("negflg")} code={CodeTable.design}  desp="指定议付行" path="/didgrp/rec/negflg"/>
							</Col>
							
						</Row>
					</Col>
				</Row>

				<Row>
					<Col span={24}>
						<Row className="row">
							<Col span={4} offset={1}>
								{/* 货物运输或交货方式/服务方式 */}
								<Label i18nId={"货物运输或交货方式/服务方式"} />
							</Col>
							<Col span={10} >
							<InputItem InputProps={bind("tratyp")}  maxLength={20}  desp="货物运输或交货方式/服务方式" path="/didgrp/rec/tratyp" />
							</Col>
						</Row>
					</Col>
					
				</Row>

				{/* 第六行 */}
				<Row>
					<Col span={24}>
						<Row className="row">
							<Col span={4} offset={1}>
								{/* 分期装运/提供服务约定 */}
								<Label i18nId={"分期装运/提供服务约定"} />
							</Col>
							<Col span={10} >
							<InputItem InputProps={bind("trdapt")}  maxLength={100}  desp="分期装运/提供服务约定" path="/didgrp/rec/trdapt" />
							</Col>
						</Row>
					</Col>
					
				</Row>

				{/* 第八行 */}
				<Row>
					<Col span={24}>
						<Row className="row">
							<Col span={4} offset={1}>
								{/* 交单期限 */}
								<Label i18nId={"交单期限"} />
							</Col>
							<Col span={10} >
							<InputItem InputProps={bind("preper")}  maxLength={100}  desp="交单期限" path="/didgrp/rec/preper" />
							</Col>
						</Row>
					</Col>
					
				</Row>
				{/* 第九行 */}



				{/* 第十一行 */}
				<Row>
					<Col span={24}>
						<Row className="row">
							<Col span={4} offset={1}>
								{/* 货物装运地(港) */}
								<Label i18nId={"货物装运地(港)"} />
							</Col>
							<Col span={10} >
							<InputItem InputProps={bind("shpfro")}  maxLength={100}  desp="货物装运地(港)" path="/didgrp/rec/shpfro" />
							</Col>
						</Row>
					</Col>
					
				</Row>
				<Row>
					<Col span={24}>
						<Row className="row">
							<Col span={4} offset={1}>
								{/* 货物目的地、交货地（港） */}
								<Label i18nId={"货物目的地、交货地（港）"} />
							</Col>
							<Col span={10} >
							<InputItem InputProps={bind("shpto")}  maxLength={100}  desp="货物目的地、交货地（港）" path="/didgrp/rec/shpto" />
							</Col>
						</Row>
					</Col>
					
				</Row>
				<Row>
					<Col span={24}>
						<Row className="row">
							<Col span={4} offset={1}>
								{/* 服务提供地点 */}
								<Label i18nId={"服务提供地点）"} />
							</Col>
							<Col span={10} >
							<InputItem InputProps={bind("shppro")}  maxLength={100}  desp="服务提供地点" path="/didgrp/rec/shppro" />
							</Col>
						</Row>
					</Col>
					
				</Row>
				<Row>
					<Col span={24}>
						<Row className="row">
							<Col span={4} offset={1}>
								{/* 有效地点） */}
								<Label i18nId={"有效地点"} />
							</Col>
							<Col span={10} >
							<InputItem InputProps={bind("expplc")}  maxLength={100}  desp="有效地点" path="/didgrp/rec/expplc" />
							</Col>
						</Row>
					</Col>
					
				</Row>
			</div >
		)
	}
}
