import React, { Component, Fragment } from 'react'
import {
    Page, Validator, Notification, FormItem,
    InputItem, Input, Bind, SelectItem, Button, Label, Table, Section, DatePickerItem
} from '@/components/Common-Library'
import { Divider } from 'antd'
import Api from '@/service/api'
import mDblxrt from '../model'
import CodeTableFactory from '@/components/CodeTable'
import "./index.less"
import { inject, observer } from 'mobx-react'
import { action, observable } from 'mobx'
import { Col, Row } from 'antd'
import { Link } from 'react-router-dom'
import Moment from 'moment'
import {Card} from 'antd'
const CodeTable = CodeTableFactory.getInstance()

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

    constructor(props) {
        super(props)
        this.model = new mDblxrt()
        this.model.openValidate() //开启校验
        this.bind = Bind.bind(this)
    }

    componentWillUnmount() {
        this.model.closeValidate()//关闭校验
    }
	
	componentWillMount() {
		 if (this.props.location.state) {
             let selflg = this.props.location.state.selflg
		     if (selflg)
				this.onSel()
		 }	
	}

    xrtlstHeader = [
        {
            title: <Label i18nId="DBLXRT_TH000092" />,
            dataIndex: "begdat",
            key: "begdat",
            width: 100,
            render: (val, row, index) => {
                var res = Moment(val).format('YYYY-MM-DD')
                return res
            }
        },
        {
            title: <Label i18nId="DBLXRT_TH000087" />,
            dataIndex: "begtim",
            key: "begtim",
            width: 100,
            render: (val, row, index) => {
                if (val) {
                    var res = Moment(val).format('YYYY-MM-DD')
                    return res
                } else {
                    return val
                }
            }
        },
        {
            title: <Label i18nId="DBLXRT_TH000088" />,
            dataIndex: "midrat",
            key: "midrat",
            width: 100,
        },
        {
            title: <Label i18nId="DBLXRT_TH000089" />,
            dataIndex: "buyrat",
            key: "buyrat",
            width: 100,
        },
        {
            title: <Label i18nId="DBLXRT_TH000090" />,
            dataIndex: "selrat",
            key: "selrat",
            width: 100,
        },
        {
            title: <Label i18nId="DBLXRT_TH000091" />,
            dataIndex: "cshbuyrat",
            key: "cshbuyrat",
            width: 100,
        },
        {
            title: <Label i18nId="DBLXRT_TH000086" />,
            dataIndex: "cshselrat",
            key: "cshselrat",
            width: 100,
        },
        {
            title: '操作',
            dataIndex: "op",
            key: "op",
            width: 120,
            render: (val, row, index) => {
                return (
                    <div>
                        <Link to={{ pathname: 'dbixrt', query: { inr: row.inr } }}>明细</Link>
                    </div>
                )
            }
        },
    ]


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

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

        })
    }


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

        return (
		<Card title="汇率查询" size="small" className="transTitle">
            <div style={{ position: 'relative' }}>
                <Row>
                    <Col span={20}>

                        <Row>
                            <Col span={12}>
                                <Row className='row'>
                                    <Col span={5} offset={2}>
                                        <Label i18nId={"XRTP_LT000002"} />
                                    </Col>
                                    <Col span={14}>
                                        <SelectItem InputProps={bind("xrtp_cur")} code={CodeTable.curtxt} />
                                    </Col>
                                </Row>
                            </Col>
                            <Col span={12}>
                                <Row className='row'>
                                    <Col span={5} offset={2}>
                                        <Label i18nId={"XRTP_LT000004"} />
                                    </Col>
                                    <Col span={14}>
                                        <DatePickerItem InputProps={bind("xrtp_xrtdat")} className='datepicker' />
                                    </Col>
                                </Row>
                            </Col>
                        </Row>


                    </Col>
                </Row>
                <div className='button0'>
                    <div className='button2'>
                        <Button type="primary" icon="search" onClick={this.onSel}>
                            <Label i18nId="MTABUT_BT000022" />
                        </Button>
                    </div>
                </div>
                <Row >
                    <Col span={23} style={{ marginLeft: 40 }}>
                        <Table pagination={{ pageSize: 10, hideOnSinglePage: true }} columns={this.xrtlstHeader} dataSource={this.model.xrtp_xrtlst} />
                    </Col>
                </Row>
            </div>
			</Card>
        )
    }
}
