Tctp.js

import React, { Component, Fragment } from 'react'
import {
    Page, Validator, Notification, FormItem, DatePickerItem, TextAreaItem, CheckboxItem,
    InputItem, Input, Bind, SelectItem, Button, Label, Image, Table
} from '@/components/Common-Library'
import Api from '@/service/api'
import mTctame from '../model'
import CodeTableFactory from '@/components/CodeTable'
import "./index.less"
import { inject, observer } from 'mobx-react'
import { action, observable } from 'mobx'

import { Row, Col, Card } from 'antd'

const CodeTable = CodeTableFactory.getInstance()


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

    constructor(props) {
        super(props)
        this.model = new mTctame()
        this.bind = Bind.bind(this)
    }

    async componentWillMount() {
		/*
		*添加初始化代码
		*/
        //快照模式下，不必开启校验，否则，静默校验，和记录变动
        !this.loadDisplay() && this.model.openMonitor() //开启校验	
    }
    componentWillUnmount() {
        this.model.stopMonitor()//关闭校验
    }



    //按钮事件
    onSav = () => {
        this.formBlur = true  //已触发表单提交处理
        Validator.validate(this.model, this.model.descriptor, async (errors, values) => {
            if (errors)
                return
            const rtnmsg = await Api.post('tctame/sav', { data: this.model })
            if (rtnmsg.retcod == SUCCESS) {
                Notification.success({ message: '数据提交成功!' })

            }
            else {
                Notification.error({ message: '服务端请求失败!' })
            }
            //余下逻辑处理

        })
    }
    onGetref = () => {
        this.formBlur = true  //已触发表单提交处理
        Validator.validate(this.model, this.model.descriptor, async (errors, values) => {
            if (errors)
                return
            const rtnmsg = await Api.post('tctame/getref', { data: this.model })
            if (rtnmsg.retcod == SUCCESS) {
                Notification.success({ message: '数据提交成功!' })

            }
            else {
                Notification.error({ message: '服务端请求失败!' })
            }
            //余下逻辑处理

        })
    }
    onRtn = () => {
        this.formBlur = true  //已触发表单提交处理
        Validator.validate(this.model, this.model.descriptor, async (errors, values) => {
            if (errors)
                return
            const rtnmsg = await Api.post('tctame/rtn', { data: this.model })
            if (rtnmsg.retcod == SUCCESS) {
                Notification.success({ message: '数据提交成功!' })

            }
            else {
                Notification.error({ message: '服务端请求失败!' })
            }
            //余下逻辑处理

        })
    }


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

        return (
            <div style={{ position: 'relative' }}>
                <Row >
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label itext="头寸编号" />
                            </Col>
                            <Col span={11}>
                                <InputItem InputProps={bind("ownref")} maxLength={16} desp="头寸编号" path="/tcsgrp/rec/ownref" />
                            </Col>
                            <Col span={2} offset={1}>
                                <Button type="primary" onClick={this.onGetref} desp="Get Ref." path="/mtabut/getref">
                                    <Label itext="获取" />
                                </Button>
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label itext="归属机构" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("branch")} maxLength={8} desp="归属机构" path="/tcsgrp/rec/branch" />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                <Row>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label itext="机构名称" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("branchnam")} maxLength={40} desp="机构名称" path="/tcsgrp/rec/branchnam" />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label itext="申请日期" />
                            </Col>
                            <Col span={14}>
                                <DatePickerItem InputProps={bind("credat")} desp="申请日期" path="/tcsgrp/rec/credat" />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                <Row>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label itext="币种" />
                                <Label itext="金额" />
                            </Col>
                            <Col span={6}>
                                <SelectItem InputProps={bind("cur")} code={CodeTable.curtxt} desp="币种" path="/tcsgrp/rec/cur" />
                            </Col>
                            <Col span={7} offset={1}>
                                <InputItem InputProps={bind("amt")} desp="金额" path="/tcsgrp/rec/amt" />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label itext="预算起息日" />
                            </Col>
                            <Col span={14}>
                                <DatePickerItem InputProps={bind("valdat")} desp="预算起息日" path="/tcsgrp/rec/valdat" />
                            </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("opndat")} desp="审批通过日期" path="/tcsgrp/rec/opndat" />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label itext="状态" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("sta")} maxLength={1} desp="状态" path="/tcsgrp/rec/sta" />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                <Row>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label itext="账户行BIC" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("actbnk")} maxLength={12} desp="账户行BIC" path="/tcsgrp/rec/actbnk" />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label itext="账户号名称" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("actbnknam")} maxLength={40} desp="账户号名称" path="/tcsgrp/rec/actbnknam" />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                <Row>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label itext="客户名称" />
                            </Col>
                            <Col span={14}>
                                <InputItem InputProps={bind("cusnam")} maxLength={60} desp="客户名称" path="/tcsgrp/rec/cusnam" />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label itext="付汇原因" />
                            </Col>
                            <Col span={14}>
                                <TextAreaItem InputProps={bind("payinf")} desp="付汇原因" path="/tcsgrp/rec/payinf" />
                            </Col>
                        </Row>
                    </Col>
                </Row>
                <Row>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label itext="款项来源" />
                            </Col>
                            <Col span={14}>
                                <TextAreaItem InputProps={bind("payifom")} desp="款项来源" path="/tcsgrp/rec/payifom" />
                            </Col>
                        </Row>
                    </Col>
                    <Col span={12}>
                        <Row className='row'>
                            <Col span={5} offset={2}>
                                <Label itext="退回原因" />
                            </Col>
                            <Col span={14}>
                                <TextAreaItem InputProps={bind("rtnmsg")} desp="退回原因" path="/tcsgrp/rec/rtnmsg" />
                            </Col>
                        </Row>
                    </Col>
                </Row>
            </div>
        )
    }
}