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

import XinYongZheng from './XinYongZheng'

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

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

    constructor(props) {
        super(props)
        this.model = props.model
        this.bind = Bind.bind(this)
        this.state={
          data:null
        }
    }

    link = (path) => {
			this.props.history.push({pathname:path,query:{inr:this.model.inr1}});
		}
		 
    cfgfil_cfgaHeader = [
			{
				title: <Label itext="交易名称" />,
				dataIndex: "frmnam",
				key: "frmnam", 
				width: 100,
				render: (val, row) => {
						if (row.alwflg == 0) {
								return (<a href='javascript:;' onClick={() => { this.link(row.frm) }} >{val}</a>)
						} else if (row.alwflg == 1) {
								return (<Tooltip title={row.res}>
										<span style={{ cursor: 'pointer', color: '#999' }}>{val}</span>
								</Tooltip>)
						}
				}
		}, 
    ]

    onRefClear=()=>{
      if(!this.model.ownref1){
        this.model.clear()
        this.model.cfgfil_cfga=this.props.cfgfil_cfga
        this.model.cfgfil_cfgb=this.props.cfgfil_cfgb
      }
    }

    childEvevnt = childDate => {
      this.child = childDate;
    }

    handleClick=()=>{
      this.child.handleClick();
    }

    //交易内实现
    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)} extra={this.props.extra} model={this.model} />
                {/* 第一行 */}
                <Row>
                    <Col span={12}>
                        <Row className="row">
                            <Col span={5} offset={2}>
                                {/* 业务编号 */}
                                <Label itext="业务编号" />
                            </Col>
                            <Col span={6}>
                              <InputItem InputProps={{...bind("ownref1"),onBlur:this.onRefClear,onPressEnter:this.handleClick}}  maxLength={20}  desp="业务编号" path="/dedgrp/rec/ownref" />
                            </Col>
                            <Col span={1} offset={1}>
                              <XinYongZheng type="primary"  model={this.model}  childEvevnt={this.childEvevnt} />
                            </Col>
                            <Col span={1} offset={2}>
                              <CheckboxItem InputProps={bind("detmod_clsflg")}  desp="闭卷业务" path="/detmod/clsflg" />
                            </Col>
                            <Col span={3}>
                                {/* 闭卷业务 */}
                                <Label itext="闭卷业务" />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className="row">
                            <Col span={5} offset={2}>
                                {/* 概要描述 */}
                                <Label itext="概要描述" />
                            </Col>
                            <Col span={14}>
                              <InputItem InputProps={bind("nam1")}  maxLength={40}  desp="概要描述" path="/dedgrp/rec/nam" disabled={true} />
                            </Col>
                        </Row>
                    </Col>
                </Row>

                {/* 第二行 */}
                <Row>
                    <Col span={12}>
                        <Row className="row">
                          <Col span={5} offset={2}>
								            <Label itext="信用证金额" trn="bmtrgf" />
						            	</Col>
						            	<Col span={6}>
								            <SelectItem InputProps={bind("max1_cur")} code={CodeTable.curtxt}  desp="Currency" path="/dedgrp/cbs/max/cur" disabled={true} />
							            </Col>
							            <Col span={7} offset={1}>
                            <InputItem   InputProps={ {...bind("max1_amt"), type:"amount", cur:this.model.max1_cur} } disabled={true} />
							            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                      <Row className="row">
                        <Col span={5} offset={2}>
                            {/* 申请人名称 */}
                            <Label itext="受益人" />
                        </Col>
                        <Col span={14}>
                          <InputItem InputProps={bind("pts2_namcn")}  maxLength={100}  desp="客户中文名称" path="/dedgrp/ben/pts/namcn" disabled={true} />
                        </Col>
                      </Row>
                    </Col>
                </Row>

                {/* 第三行 */}
                <Row>
                    <Col span={12}>
                      <Row className="row">
                        <Col span={5} offset={2}>
                          <Label itext="信用证余额" trn="bmtrgf" />
                        </Col>
                        <Col span={6}>
                          <SelectItem InputProps={bind("opn11_cur")} code={CodeTable.curtxt}  desp="Currency" path="/dedgrp/cbs/opn1/cur" disabled={true}  />
                        </Col>
                        <Col span={7} offset={1}>
                          <InputItem   InputProps={ {...bind("opn11_amt"), type:"amount", cur:this.model.opn11_cur} } disabled={true} />
                        </Col>
                      </Row>
                    </Col>
                    <Col span={12}>
                      <Row className="row">
                        <Col span={5} offset={2}>
                            {/* 受益人名称 */}
                            <Label itext="申请人" />
                        </Col>
                        <Col span={14}>
                          <InputItem InputProps={bind("pts1_namcn")}  maxLength={100}  desp="客户中文名称" path="/dedgrp/apl/pts/namcn" disabled={true}  />
                        </Col>
                      </Row>
                    </Col>
                </Row >

                {/* 第四行 */}
                <Row>
                    <Col span={12}>
                            <Row className="row">
                                <Col span={5} offset={2}>
                                    <Label itext="信用证兑付方式" />
                                </Col>
                                <Col span={14}>
                                <SelectItem InputProps={bind("avbby")} code={CodeTable.avbby}  desp="信用证对付方式" path="/dedgrp/rec/avbby" disabled={true}  />
                                </Col>
                            </Row>
                    </Col>
                    <Col span={12}>
                      <Row className="row">
                        <Col span={5} offset={2}>
                            {/* 通知行名称 */}
                            <Label itext="开证行" />
                        </Col>
                        <Col span={14}>
                          <InputItem InputProps={bind("pts3_namcn")}  maxLength={100}  desp="客户中文名称" path="/dedgrp/iss/pts/namcn" disabled={true}   />
                        </Col>
                      </Row>
                    </Col>
                </Row >

                <Row>
                    <Col span={12}>
                        <Row className="row">
                            <Col span={5} offset={2}>
                                {/* 用证对付方式 */}
                                <Label itext="开立日期" />
                            </Col>
                            <Col span={14}>
                                <DatePickerItem InputProps={bind("opndat1")}  desp="开立日期" path="/dedgrp/rec/opndat" disabled={true}   />
                            </Col>
                        </Row> 
                    </Col>
                    <Col span={12}>
                      <Row className="row">
                        <Col span={5} offset={2}>
                            {/* 有效地点 */}
                            <Label itext="有效地点" />
                        </Col>
                        <Col span={14}>
                          <InputItem InputProps={bind("expplc")}  maxLength={100}  desp="有效地点" path="/dedgrp/rec/expplc" disabled={true}   />
                        </Col>
                      </Row>
                    </Col>
                </Row >

                <Row>
                    <Col span={12}>
                        <Row className="row">
                            <Col span={5} offset={2}>
                                <Label itext="有效日期" />
                            </Col>
                            <Col span={14}>
                              <DatePickerItem InputProps={bind("expdat")}  desp="有效日期" path="/dedgrp/rec/expdat"  disabled={true} />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}></Col>
                </Row >
                
								<Row>
									<Col span={12}>
										<Row className="row">
											<Col span={23} offset={1}>
												<Table rowKey="inr" columns={this.cfgfil_cfgaHeader}  dataSource={this.model.cfgfil_cfga}   path="/cfgfil/cfga"/>
											</Col>
										</Row>
									</Col>
									<Col span={12}></Col>
                </Row>
            </div >
        )
    }
}
