import React, { Component, Fragment } from 'react'
import {
    Page, Validator, Notification, FormItem, Table, CheckboxItem, Checkbox, TextAreaItem,
    InputItem, Input, Bind, SelectItem, Button, Label, DatePickerItem, Section, ConfirmButton, Steps
} from '@/components/Common-Library'
import { Row, Col, Spin } from 'antd'
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 { TableExpansion, ContryCodePicker } from '@/components/Business-Library'
import { Link, withRouter } from 'react-router-dom'
import Ptspta from '@/views/Public/Ptspta'
const CodeTable = CodeTableFactory.getInstance()
const { Pre, Next, StepWrapper } = Steps

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

    constructor(props) {
        super(props)
        this.model = props.model
        this.bind = Bind.bind(this)
    }
    @observable
    showChechBox = {
        fwmy: false,
        kjrz: false,
        qttz: false,
        sr: false,
        sy: false,
        wlmx: false,
        zqtz: false,
        zjtz: false,
        zbzy: false,
        hwmy: false,
    }
    // 服务贸易
    tdbgrp_tbclstHeader = [
        {
            title: <Label value="序号" />,
            dsp: `序号`,
            dataIndex: "seqno",
            key: "seqno",
            width: 50,
        },
        {
            title: <Label value="操作类型" />,
            dsp: `操作类型`,
            dataIndex: "listopertype",
            key: "listopertype",
            width: 75,
            render: (val, row, index) => {
                let text = val
                let em = CodeTable.opertype && CodeTable.opertype.find(item => item.value == val)
                if (em)
                    text = em.label
                return text
            }
        },
        {
            title: <Label value="服务贸易交易编码" />,
            dsp: `服务贸易交易编码`,
            dataIndex: "balofpaycode",
            key: "balofpaycode",
            width: 180,
            render: (val, row, index) => {
                let text = val
                let em = CodeTable.rmbreccod && CodeTable.rmbreccod.find(item => item.value == val)
                if (em)
                    text = em.label
                return text
            }
        },
        {
            title: <Label value="服务贸易金额" />,
            dsp: `服务贸易金额`,
            dataIndex: "amt",
            key: "amt",
            width: 120,
        },
        {
            title: <Label value="交易合同号" />,
            dsp: `交易合同号`,
            dataIndex: "contractno",
            key: "contractno",
            width: 120,
        },
    ]
    // 收益及经常转移种类
    tdbgrp_tbhlstHeader = [
        {
            title: <Label value="序号" />,
            dsp: `序号`,
            dataIndex: "seqno",
            key: "seqno",
            width: 50,
        },
        {
            title: <Label value="操作类型" />,
            dsp: `操作类型`,
            dataIndex: "listopertype",
            key: "listopertype",
            width: 75,
            render: (val, row, index) => {
                let text = val
                let em = CodeTable.opertype && CodeTable.opertype.find(item => item.value == val)
                if (em)
                    text = em.label
                return text
            }
        },
        {
            title: <Label value="交易协议号或核准证书编号" />,
            dsp: `交易协议号或核准证书编号`,
            dataIndex: "contractno",
            key: "contractno",
            width: 180,
        },
        {
            title: <Label value="收益及经常转移种类代码" />,
            dsp: `收益及经常转移种类代码`,
            dataIndex: "balofpaycode",
            key: "balofpaycode",
            width: 160,
        },
        {
            title: <Label value="跨境收益与经常转移金额" />,
            dsp: `跨境收益与经常转移金额`,
            dataIndex: "amt",
            key: "amt",
            width: 180,
        },
    ]
    // 物流明细信息
    tdbgrp_tbblstHeader = [
        {
            title: <Label value="序号" />,
            dsp: `序号`,
            dataIndex: "seqno",
            key: "seqno",
            width: 50,
        },
        {
            title: <Label value="操作类型" />,
            dsp: `操作类型`,
            dataIndex: "listopertype",
            key: "listopertype",
            width: 100,
            render: (val, row, index) => {
                let text = val
                let em = CodeTable.opertype && CodeTable.opertype.find(item => item.value == val)
                if (em)
                    text = em.label
                return text
            }
        },
        {
            title: <Label value="进/出口日期" />,
            dsp: `进/出口日期`,
            dataIndex: "customsdate",
            key: "customsdate",
            width: 100,
        },
        {
            title: <Label value="贸易类型" />,
            dsp: `贸易类型`,
            dataIndex: "tradeclass",
            key: "tradeclass",
            width: 100,
            render: (val, row, index) => {
                let text = val
                let em = CodeTable.tradeclass && CodeTable.tradeclass.find(item => item.value == val)
                if (em)
                    text = em.label
                return text
            }
        },
        {
            title: <Label value="报关收付类型" />,
            dsp: `报关收付类型`,
            dataIndex: "balancetype",
            key: "balancetype",
            width: 120,
            render: (val, row, index) => {
                let text = val
                let em = CodeTable.balancetype && CodeTable.balancetype.find(item => item.value == val)
                if (em)
                    text = em.label
                return text
            }
        },
        {
            title: <Label value="对应货值金额" />,
            dsp: `对应货值金额`,
            dataIndex: "customsamt",
            key: "customsamt",
            width: 120,
        },
        {
            title: <Label value="经营单位组织机构代码" />,
            dsp: `经营单位组织机构代码`,
            dataIndex: "custorgcode",
            key: "custorgcode",
            width: 160,
        },
        {
            title: <Label value="报关单经营单位名称" />,
            dsp: `报关单经营单位名称`,
            dataIndex: "custorgname",
            key: "custorgname",
            width: 200,
        },
    ]
    // 证券投资信息
    tdbgrp_tbelstHeader = [
        {
            title: <Label value="序号" />,
            dsp: `序号`,
            dataIndex: "seqno",
            key: "seqno",
            width: 50,
        },
        {
            title: <Label value="操作类型" />,
            dsp: `操作类型`,
            dataIndex: "listopertype",
            key: "listopertype",
            width: 75,
            render: (val, row, index) => {
                let text = val
                let em = CodeTable.opertype && CodeTable.opertype.find(item => item.value == val)
                if (em)
                    text = em.label
                return text
            }
        },
        {
            title: <Label value="证券投资交易编码" />,
            dsp: `证券投资交易编码`,
            dataIndex: "balofpaycode",
            key: "balofpaycode",
            width: 180,
        },
        {
            title: <Label value="证券投资金额" />,
            dsp: `证券投资金额`,
            dataIndex: "amt",
            key: "amt",
            width: 120,
        },
        {
            title: <Label value="证券投资批准号" />,
            dsp: `证券投资批准号`,
            dataIndex: "certificateno",
            key: "certificateno",
            width: 130,
        },
    ]
    // 直接投资信息
    tdbgrp_tbdlstHeader = [
        {
            title: <Label value="序号" />,
            dsp: `序号`,
            dataIndex: "seqno",
            key: "seqno",
            width: 50,
        },
        {
            title: <Label value="操作类型" />,
            dsp: `操作类型`,
            dataIndex: "listopertype",
            key: "listopertype",
            width: 75,
            render: (val, row, index) => {
                let text = val
                let em = CodeTable.opertype && CodeTable.opertype.find(item => item.value == val)
                if (em)
                    text = em.label
                return text
            }
        },
        {
            title: <Label value="直接投资交易编码" />,
            dsp: `直接投资交易编码`,
            dataIndex: "balofpaycode",
            key: "balofpaycode",
            width: 180,
        },
        {
            title: <Label value="直接投资币种" />,
            dsp: `直接投资币种`,
            dataIndex: "currencycode",
            key: "currencycode",
            width: 100,
            render: (val, row, index) => {
                let text = val
                let em = CodeTable.cur && CodeTable.cur.find(item => item.value == val)
                if (em)
                    text = em.label
                return text
            }
        },
        {
            title: <Label value="直接投资金额" />,
            dsp: `直接投资金额`,
            dataIndex: "amt",
            key: "amt",
            width: 120,
        },
        {
            title: <Label value="政府部门核准证书编号" />,
            dsp: `政府部门核准证书编号`,
            dataIndex: "certificateno",
            key: "certificateno",
            width: 100,
        },
        {
            title: <Label value="股东贷款合同号" />,
            dsp: `股东贷款合同号`,
            dataIndex: "lendingno",
            key: "lendingno",
            width: 200,
        },
    ]
    // 资本转移及非生产、非金融资产的收买和放弃
    tdbgrp_tbilstHeader = [
        {
            title: <Label value="序号" />,
            dsp: `序号`,
            dataIndex: "seqno",
            key: "seqno",
            width: 50,
        },
        {
            title: <Label value="操作类型" />,
            dsp: `操作类型`,
            dataIndex: "listopertype",
            key: "listopertype",
            width: 75,
            render: (val, row, index) => {
                let text = val
                let em = CodeTable.opertype && CodeTable.opertype.find(item => item.value == val)
                if (em)
                    text = em.label
                return text
            }
        },
        {
            title: <Label value="交易合同号" />,
            dsp: `交易合同号`,
            dataIndex: "contractno",
            key: "contractno",
            width: 120,
        },
        {
            title: <Label value="类型交易编码" />,
            dsp: `类型交易编码`,
            dataIndex: "balofpaycode",
            key: "balofpaycode",
            width: 120,
        },
        {
            title: <Label value="跨境资本转移及非生产、非金融资产的收买/放弃金额" />,
            dsp: `跨境资本转移及非生产、非金融资产的收买/放弃金额`,
            dataIndex: "amt",
            key: "amt",
            width: 320,
        },
    ]
    // 跨境融资信息
    tdbgrp_tbglstHeader = [
        {
            title: <Label value="序号" />,
            dsp: `序号`,
            dataIndex: "seqno",
            key: "seqno",
            width: 50,
        },
        {
            title: <Label value="操作类型" />,
            dsp: `操作类型`,
            dataIndex: "listopertype",
            key: "listopertype",
            width: 75,
            render: (val, row, index) => {
                let text = val
                let em = CodeTable.opertype && CodeTable.opertype.find(item => item.value == val)
                if (em)
                    text = em.label
                return text
            }
        },
        {
            title: <Label value="跨境融资金额" />,
            dsp: `跨境融资金额`,
            dataIndex: "amt",
            key: "amt",
            width: 120,
        },
        {
            title: <Label value="融资合同备案号" />,
            dsp: `融资合同备案号`,
            dataIndex: "contractno",
            key: "contractno",
            width: 200,
        },
        {
            title: <Label value="跨境融资交易编码" />,
            dsp: `跨境融资交易编码`,
            dataIndex: "balofpaycode",
            key: "balofpaycode",
            width: 160,
        },
    ]
    // 其他投资信息
    tdbgrp_tbflstHeader = [
        {
            title: <Label value="序号" />,
            dsp: `序号`,
            dataIndex: "seqno",
            key: "seqno",
            width: 50,
        },
        {
            title: <Label value="操作类型" />,
            dsp: `操作类型`,
            dataIndex: "listopertype",
            key: "listopertype",
            width: 75,
            render: (val, row, index) => {
                let text = val
                let em = CodeTable.opertype && CodeTable.opertype.find(item => item.value == val)
                if (em)
                    text = em.label
                return text
            }
        },
        {
            title: <Label value="其他投资交易编码" />,
            dsp: `其他投资交易编码`,
            dataIndex: "balofpaycode",
            key: "balofpaycode",
            width: 180,
        },
        {
            title: <Label value="其他投资金额" />,
            dsp: `其他投资金额`,
            dataIndex: "amt",
            key: "amt",
            width: 120,
        },
        {
            title: <Label value="交易合同号" />,
            dsp: `交易合同号`,
            dataIndex: "contractno",
            key: "contractno",
            width: 120,
        },
    ]
    onGetref = async () => {
        const rtnmsg = await Api.post("/cptopn/regmod_getref", { data: this.model })
        if (rtnmsg.retcod == SUCCESS) {
            // Notification.success({ message: 'cptopn/regmod_getref数据提交成功!' })
            this.model.bas2_levyno = rtnmsg.data.bas2_levyno;
        }
        else {
            Notification.error({ message: 'cptopn/regmod_getref服务端请求失败!' })
        }
        //余下逻辑处理
    }
    //交易内实现
    renderPage() {
        const bind = this.bind
        const { i18n } = this.props
        return (
            <div style={{ position: 'relative' }}>
                {/* 1 */}
                <Row >
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="收付汇日期" />
                            </Col>
                            <Col span={14}>
                                <DatePickerItem InputProps={bind("mtabut_paydat")} desp="收付汇日期" path="/mtabut/paydat" />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                {/* 2 3 */}
                <Row type={"flex"}>
                    <Col span={12}>
                        <Row >
                            <Col span={5} offset={2} >
                                <Label value="申报号码" />
                            </Col>
                            <Col span={10} >
                                <InputItem InputProps={bind("bas2_levyno")} maxLength={24} desp="申报号码" path="/rmbmod/tdbgrp/bas/levyno" />
                            </Col>
                            <Col span={4} offset={1} >
                                <Button type="primary" onClick={() => this.onGetref()}>
                                    <Label i18nId="CPTP_BT000084" />
                                </Button>
                            </Col>
                        </Row>
                        <Row >
                            <Col span={5} offset={2}>
                                <Label value="操作类型" />
                            </Col>
                            <Col span={14}>
                                <SelectItem InputProps={bind("bas2_opertype")} code={CodeTable.opertype} desp="操作类型" path="/rmbmod/tdbgrp/bas/opertype" />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="删除原因或申报无误理由" />
                            </Col>
                            <Col span={14}>
                                <TextAreaItem rows={4}
                                    InputProps={bind("bas2_actiondesc")}
                                    // value={this.model[prefix + '_adrblk']}
                                    // onChange={(val) => { this.huan(val) }}
                                    style={{ resize: "none" }} className="section"
                                // InputProps={bind(prefix + '_adrblk')}
                                />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                {/*4 */}
                <Row >
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="银行业务编号" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("bas2_banktrano")} maxLength={22} desp="银行业务编号" path="/rmbmod/tdbgrp/bas/banktrano" />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="银行机构代码" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("bas2_bankorgcode")} maxLength={12} desp="银行机构代码" path="/rmbmod/tdbgrp/bas/bankorgcode" />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                {/* 5 */}
                <Row >
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="银行机构名称" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("bas2_bankorgname")} maxLength={128} desp="银行机构名称" path="/rmbmod/tdbgrp/bas/bankorgname" />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="收款人名称" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("bas2_payeename")} maxLength={200} desp="收款人名称" path="/rmbmod/tdbgrp/bas/payeename" />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                {/* 6 */}
                <Row >
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="付款人名称" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("bas2_payername")} maxLength={128} desp="付款人名称" path="/rmbmod/tdbgrp/bas/payername" />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="交易附言" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("bas2_addword")} maxLength={128} desp="交易附言" path="/rmbmod/tdbgrp/bas/addword" />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                {/* 7 */}
                <Row >
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="中间转汇行" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("bas2_midtransbank")} maxLength={11} desp="中间转汇行" path="/rmbmod/tdbgrp/bas/midtransbank" />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="收款人常驻国家（地区）代码" />
                            </Col>
                            <Col span={10}>
                                <InputItem InputProps={bind("bas2_payeecountrycode")} maxLength={3} desp="收款人常驻国家（地区）代码" path="/rmbmod/tdbgrp/bas/payeecountrycode" />
                            </Col>
                            <Col span={4} offset={1}>
                                {/* /cptopn/codsel_selbut1 
                                /cptopn/codsel_ctyinfsub
                                */}
                                <ContryCodePicker prefix="bas2_payeecountrycode" url="/cptopn/codsel_ctyinfsub" index="codsel_ctylst" model={this.model} />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                {/* 8 */}
                <Row >
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="清算（结算）账户类型" />
                            </Col>
                            <Col span={14}>
                                <SelectItem InputProps={bind("bas2_payeeaccttype")} code={CodeTable.payeraccttype} desp="清算(结算)账户类型" path="/rmbmod/tdbgrp/bas/payeeaccttype" />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="结算方式" />
                            </Col>
                            <Col span={14}>
                                <SelectItem InputProps={bind("bas2_balancemode")} code={CodeTable.balancemode} desp="结算方式" path="/rmbmod/tdbgrp/bas/balancemode" />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                {/* 9 */}
                <Row >
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="清算(结算)账户账号" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("bas2_payeeacct")} maxLength={32} desp="清算(结算)账户账号" path="/rmbmod/tdbgrp/bas/payeeacct" />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                {/* 10 */}
                <Row >
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="收款行SWIFT BIC" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("bas2_swiftbic")} maxLength={11} desp="收款行SWIFT BIC" path="/rmbmod/tdbgrp/bas/swiftbic" />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="原申报号码" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("bas2_orilevyno")} maxLength={24} desp="原申报号码" path="/rmbmod/tdbgrp/bas/orilevyno" />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                {/* 11 */}
                <Row >
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="付款人组织机构代码或身份证件号码" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("bas2_payerorgcode")} maxLength={18} desp="付款人组织机构代码或身份证件号码" path="/rmbmod/tdbgrp/bas/payerorgcode" />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="付款日期" />
                            </Col>
                            <Col span={14}>
                                <DatePickerItem InputProps={bind("bas2_payerdate")} desp="付款日期" path="/rmbmod/tdbgrp/bas/payerdate" />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                {/* 12 */}
                <Row >
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="付款总金额" />
                            </Col>
                            <Col span={14}>
                                <SelectItem InputProps={bind("bas2_payercny")} code={CodeTable.bopcur} desp="付款币种" path="/rmbmod/tdbgrp/bas/payercny" />

                                <InputItem InputProps={bind("bas2_totalamt")} desp="付款总金额" path="/rmbmod/tdbgrp/bas/totalamt" />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="付款人账号" />
                            </Col>
                            <Col span={14}>
                                {/* path好像不对 */}
                                <InputItem InputProps={bind("orcacc")} maxLength={32} desp="付款人账号" path="/cpdgrp/rec/orcacc" />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                <Row >
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label value="付款人属性" />
                            </Col>
                            <Col span={14}>
                                <SelectItem InputProps={bind("bas2_payerattr")} code={CodeTable.payeeattr} desp="付款人属性" path="/rmbmod/tdbgrp/bas/payerattr" />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                {/* （缺少一个币种类型） */}
                {/* <Row>
                    <Col span={5} offset={1}>
                        <CheckboxItem desp="服务贸易" path="/rmbmod/tdap/servicetrade" >服务贸易</CheckboxItem>
                    </Col>
                    <Col span={5} offset={1}>
                        <CheckboxItem desp="直接投资" path="/rmbmod/tdap/directinvest" >直接投资</CheckboxItem>
                    </Col>
                    <Col span={5} offset={1}>
                        <CheckboxItem desp="证券投资" path="/rmbmod/tdap/indirectinvest" >证券投资</CheckboxItem>
                    </Col>
                    <Col span={5} offset={1}>
                        <CheckboxItem desp="其他投资" path="/rmbmod/tdap/otherinvest" >其他投资</CheckboxItem>
                    </Col>
                </Row>
                <Row>
                    <Col span={5} offset={1}>
                        <CheckboxItem  desp="跨境融资" path="/rmbmod/tdap/financing" >跨境融资</CheckboxItem>
                    </Col>
                    <Col span={5} offset={1}>
                        <CheckboxItem desp="收益与经济转移" path="/rmbmod/tdap/proceedstransfer" >收益与经济转移</CheckboxItem>
                    </Col>
                    <Col span={5} offset={1}>
                        <CheckboxItem desp="资本转移" path="/rmbmod/tdap/capitaltransfer" >资本转移</CheckboxItem>
                    </Col>
                    <Col span={5} offset={1}>
                        <CheckboxItem desp="货物贸易" path="/rmbmod/tdagrp/bas/goodstrade" >货物贸易</CheckboxItem>
                    </Col>
                </Row> */}



                <Row style={{ marginBottom: 20, marginTop: 20 }}>
                    <Col span={5} offset={1}>
                        <Checkbox onChange={(value) => { this.showChechBox.hwmy = value }} desp="货物贸易" path="/rmbmod/tdagrp/bas/goodstrade" >货物贸易</Checkbox>
                    </Col>
                    <Col span={5} offset={1}>
                        <Checkbox onChange={(value) => { this.showChechBox.fwmy = value }} desp="服务贸易" path="/rmbmod/tdap/servicetrade" >服务贸易</Checkbox>
                    </Col>
                    <Col span={5} offset={1}>
                        <Checkbox onChange={(value) => { this.showChechBox.zjtz = value }} desp="直接投资" path="/rmbmod/tdap/directinvest" >直接投资</Checkbox>
                    </Col>
                    <Col span={5} offset={1}>
                        <Checkbox onChange={(value) => { this.showChechBox.zqtz = value }} desp="证券投资" path="/rmbmod/tdap/indirectinvest" >证券投资</Checkbox>
                    </Col>
                </Row>
                <Row style={{ marginBottom: 20, marginTop: 20 }}>
                    <Col span={5} offset={1}>
                        <Checkbox onChange={(value) => { this.showChechBox.qttz = value }} desp="其他投资" path="/rmbmod/tdap/otherinvest" >其他投资</Checkbox>
                    </Col>
                    <Col span={5} offset={1}>
                        <Checkbox onChange={(value) => { this.showChechBox.kjrz = value }} desp="跨境融资" path="/rmbmod/tdap/financing" >跨境融资</Checkbox>
                    </Col>
                    <Col span={5} offset={1}>
                        <Checkbox onChange={(value) => { this.showChechBox.sy = value }} desp="收益与经济转移" path="/rmbmod/tdap/proceedstransfer" >收益与经济转移</Checkbox>
                    </Col>
                    <Col span={5} offset={1}>
                        <Checkbox onChange={(value) => { this.showChechBox.zbzy = value }} desp="资本转移" path="/rmbmod/tdap/capitaltransfer" >资本转移</Checkbox>
                    </Col>
                </Row>

                {
                    this.showChechBox.hwmy ? (<div>
                        <Row >
                            <Col span={23} offset={1}>
                                <Label value="支出信息-货物贸易表" />
                            </Col>
                        </Row>
                        <Row >
                            <Col span={12}>
                                <Row className='row'>
                                    <Col span={5} offset={2}>
                                        <Label value="货物贸易收款金额" />
                                    </Col>
                                    <Col span={14}>
                                        <InputItem InputProps={bind("tea_payeramt")} desp="货物贸易付款金额" path="/rmbmod/tdbgrp/tea/payeramt" />
                                    </Col>
                                </Row>
                            </Col>
                            <Col span={12}>
                                <Row className='row'>
                                    <Col span={5} offset={2}>
                                        <Label value="结账期" />
                                    </Col>
                                    <Col span={14}>
                                        <InputItem InputProps={bind("tea_accountperiod")} desp="结账期" path="/rmbmod/tdbgrp/tea/accountperiod" />
                                    </Col>
                                </Row>
                            </Col>
                        </Row>
                        <Row >
                            <Col span={12}>
                                <Row className='row'>
                                    <Col span={5} offset={2}>
                                        <Label value="已报关收款金额" />
                                    </Col>
                                    <Col span={14}>
                                        <InputItem InputProps={bind("tea_customsamt")} desp="已报关付款金额" path="/rmbmod/tdbgrp/tea/customsamt" />
                                    </Col>
                                </Row>
                            </Col>
                            <Col span={12}>
                                <Row className='row'>
                                    <Col span={5} offset={2}>
                                        <Label value="已备案收款金额" />
                                    </Col>
                                    <Col span={14}>
                                        <InputItem InputProps={bind("tea_recordamt")} desp="已备案付款金额" path="/rmbmod/tdbgrp/tea/recordamt" />
                                    </Col>
                                </Row>
                            </Col>
                        </Row>

                        <Row >
                            <Col span={12}>
                                <Row className='row'>
                                    <Col span={5} offset={2}>
                                        <Label value="预收款金额" />
                                    </Col>
                                    <Col span={14}>
                                        <InputItem InputProps={bind("tea_prepayeramt")} desp="预付款金额" path="/rmbmod/tdbgrp/tea/prepayeramt" />
                                    </Col>
                                </Row>
                            </Col>
                            {/* 缺少一个预收款比例 */}
                        </Row>
                        <Row >
                            <Col span={24}>
                                <Row className='row'>
                                    <Col span={7} offset={1}>
                                        <Label value="无货物报关的货物贸易-海关特殊监管区域及保税监管场所进出境物流货物金额" />
                                    </Col>
                                    <Col span={7}>
                                        <InputItem InputProps={bind("tea_onshoreamt")} desp="无货物报关的货物贸易―海关特殊监管区域及保税监管场所进出境物流货物金额" path="/rmbmod/tdbgrp/tea/onshoreamt" />
                                    </Col>
                                </Row>
                            </Col>
                        </Row>
                        <Row >
                            <Col span={12}>
                                <Row className='row'>
                                    <Col span={8} offset={2}>
                                        <Label value="无货物报关的货物贸易-离岸转手买卖金额" />
                                    </Col>
                                    <Col span={14}>
                                        <InputItem InputProps={bind("tea_offshoreamt")} desp="无货物报关的货物贸易―离岸转手买卖金额" path="/rmbmod/tdbgrp/tea/offshoreamt" />
                                    </Col>
                                </Row>
                            </Col>
                            <Col span={12}>
                                <Row className='row'>
                                    <Col span={6} offset={2}>
                                        <Label value="无货物报关的货物贸易-其他金额" />
                                    </Col>
                                    <Col span={14}>
                                        <InputItem InputProps={bind("tea_nogoodsamt")} desp="无货物报关的货物贸易―其他金额" path="/rmbmod/tdbgrp/tea/nogoodsamt" />
                                    </Col>
                                </Row>
                            </Col>
                        </Row>
                        <TableExpansion
                            title={() => "物流明细信息"}
                            rowKey="inr"
                            columns={this.tdbgrp_tbblstHeader}
                            dataSource={this.model.tdbgrp_tbblst}
                            onChange={(value) => { this.model.tdbgrp_tbblst = value }}
                            delete={true}
                            path="/rmbmod/tdagrp/tbblst"
                        />
                    </div>) : null
                }


                {
                    this.showChechBox.fwmy ? <TableExpansion delete={true} onChange={(data) => { this.model.tdbgrp_tbclst = data }} title={() => "服务贸易信息"} rowKey="inr" columns={this.tdbgrp_tbclstHeader} dataSource={this.model.tdbgrp_tbclst} path="/rmbmod/tdbgrp/tbclst" /> : null
                }
                {
                    this.showChechBox.zjtz ? <TableExpansion delete={true} onChange={(data) => { this.model.tdbgrp_tbdlst = data }} title={() => "直接投资信息"} rowKey="inr" columns={this.tdbgrp_tbdlstHeader} dataSource={this.model.tdbgrp_tbdlst} path="/rmbmod/tdbgrp/tbdlst" /> : null
                }
                {
                    this.showChechBox.zqtz ? <TableExpansion delete={true} onChange={(data) => { this.model.tdbgrp_tbelst = data }} title={() => "证券投资信息"} rowKey="inr" columns={this.tdbgrp_tbelstHeader} dataSource={this.model.tdbgrp_tbelst} path="/rmbmod/tdbgrp/tbelst" /> : null
                }
                {
                    this.showChechBox.qttz ? <TableExpansion delete={true} onChange={(data) => { this.model.tdbgrp_tbflst = data }} title={() => "其他投资信息"} rowKey="inr" columns={this.tdbgrp_tbflstHeader} dataSource={this.model.tdbgrp_tbflst} path="/rmbmod/tdbgrp/tbflst" /> : null
                }

                {
                    this.showChechBox.kjrz ? <TableExpansion delete={true} onChange={(data) => { this.model.tdbgrp_tbglst = data }} title={() => "跨境融资信息"} rowKey="inr" columns={this.tdbgrp_tbglstHeader} dataSource={this.model.tdbgrp_tbglst} path="/rmbmod/tdbgrp/tbglst" /> : null
                }
                {
                    this.showChechBox.sy ? <TableExpansion delete={true} onChange={(data) => { this.model.tdbgrp_tbhlst = data }} title={() => "收益与进场转移信息"} rowKey="inr" columns={this.tdbgrp_tbhlstHeader} dataSource={this.model.tdbgrp_tbhlst} path="/rmbmod/tdbgrp/tbhlst" /> : null
                }
                {
                    this.showChechBox.zbzy ? <TableExpansion delete={true} onChange={(data) => { this.model.tdbgrp_tbilst = data }} title={() => "资本转移及非生产、非金融资产的收买和放弃"} rowKey="inr" columns={this.tdbgrp_tbilstHeader} dataSource={this.model.tdbgrp_tbilst} path="/rmbmod/tdbgrp/tbilst" /> : null
                }
            </div >
        )
    }
}
