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


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

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

	async componentWillMount() {
		/*
		*添加初始化代码
		*/
		const rtnmsg = await Api.post('tctinf/init', { data: this.model })
		if (rtnmsg.retcod == SUCCESS) {
			const { data } = rtnmsg
			runInAction(() => {
				Object.assign(this.model, data)
			})
		}
		//快照模式下，不必开启校验，否则，静默校验，和记录变动
		!this.loadDisplay() && this.model.openMonitor && this.model.openMonitor() //开启校验	
	}
	componentWillUnmount() {
		this.model.stopMonitor && this.model.stopMonitor()//关闭校验
	}

	tcsgrp_tcslstHeader = [
		// {
		// 	title: <Label itext="索引" />,
		// 	dataIndex: "inr",
		// 	key: "inr",
		// 	width: 100,
		// 	sorter: (r1, r2) => ColSorter(r1.inr, r2.inr),
		// },
		{
			title: <Label itext="归属机构" />,
			dataIndex: "branch",
			key: "branch",
			width: 100,
			sorter: (r1, r2) => ColSorter(r1.branch, r2.branch),
		},
		{
			title: <Label itext="机构名称" />,
			dataIndex: "branchnam",
			key: "branchnam",
			width: 100,
			sorter: (r1, r2) => ColSorter(r1.branchnam, r2.branchnam),
		},
		{
			title: <Label itext="申请日期" />,
			dataIndex: "credat",
			key: "credat",
			width: 150,
			sorter: (r1, r2) => ColSorter(r1.credat, r2.credat),
		},
		{
			title: <Label itext="币种" />,
			dataIndex: "cur",
			key: "cur",
			width: 150,
			sorter: (r1, r2) => ColSorter(r1.cur, r2.cur),
			render: (val, row, index) => {
				let text = val
				let em = CodeTable.curtxt.find(item => item.value == val)
				if (em)
					text = em.label
				return text
			}
		},
		{
			title: <Label itext="金额" />,
			dataIndex: "amt",
			key: "amt",
			width: 100,
			sorter: (r1, r2) => ColSorter(r1.amt, r2.amt),
		},
		{
			title: <Label itext="预算起息日" />,
			dataIndex: "valdat",
			key: "valdat",
			width: 150,
			sorter: (r1, r2) => ColSorter(r1.valdat, r2.valdat),
		},
		{
			title: <Label itext="审批通过日期" />,
			dataIndex: "opndat",
			key: "opndat",
			width: 150,
			sorter: (r1, r2) => ColSorter(r1.opndat, r2.opndat),
		},
		{
			title: <Label itext="状态" />,
			dataIndex: "sta",
			key: "sta",
			width: 100,
			sorter: (r1, r2) => ColSorter(r1.sta, r2.sta),
			render: (val, row, index) => {
				let text = val
				let em = CodeTable.tcssta.find(item => item.value == val)
				if (em)
					text = em.label
				return text
			}
		},
		{
			title: <Label itext="账户行BIC" />,
			dataIndex: "actbnk",
			key: "actbnk",
			width: 150,
			sorter: (r1, r2) => ColSorter(r1.actbnk, r2.actbnk),
		},
		{
			title: <Label itext="账户号名称" />,
			dataIndex: "actbnknam",
			key: "actbnknam",
			width: 150,
			sorter: (r1, r2) => ColSorter(r1.actbnknam, r2.actbnknam),
		},
		{
			title: <Label itext="客户名称" />,
			dataIndex: "cusnam",
			key: "cusnam",
			width: 100,
			sorter: (r1, r2) => ColSorter(r1.cusnam, r2.cusnam),
		},
		// {
		// 	title: <Label itext="付汇原因" />,
		// 	dataIndex: "payinf",
		// 	key: "payinf",
		// 	width: 100,
		// 	sorter: (r1, r2) => ColSorter(r1.payinf, r2.payinf),
		// },
		// {
		// 	title: <Label itext="款项来源" />,
		// 	dataIndex: "payifom",
		// 	key: "payifom",
		// 	width: 100,
		// 	sorter: (r1, r2) => ColSorter(r1.payifom, r2.payifom),
		// },
		{
			title: <Label itext="头寸编号" />,
			dataIndex: "ownref",
			key: "ownref",
			width: 100,
			sorter: (r1, r2) => ColSorter(r1.ownref, r2.ownref),
		},
		{
			title: <Label value="操作" />,
			key: "sel",
			width: 200,
			render: (val, row, index) => {
				return (
					<div>
						<Link to={{ pathname: 'tctame', query: { inr: row.inr } }}>修改</Link>
						<Divider type="vertical" />
						<Link to={{ pathname: 'tctrel', query: { inr: row.inr } }}>审核</Link>
						<Divider type="vertical" />
						{/* <Link to={{ pathname: 'tctame', query: { inr: row.inr } }}>删除</Link> */}
						<Label onClick={() => this.onDel(row)} style={{ color: "blue", cursor: "pointer" }} value="删除" />
					</div>
				)
			}
		},
	]


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

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

		})
	}
	onDel = async (row) => {
		console.log(row)
		let inr = row.inr;
		const rtnmsg = await Api.post('tctinf/del', { params: { inr } })
		if (rtnmsg.retcod == SUCCESS) {
			// Notification.success({ message: '数据提交成功!' })
			this.model.tcsgrp_tcslst = rtnmsg.data.tcsgrp_tcslst;
		}
		else {
			Notification.error({ message: '服务端请求失败!' })
		}
		//余下逻辑处理


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

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

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

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

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

			}
			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={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>
						<Col span={12}>
							<Row className='row'>
								<Col span={5} offset={2}>
									<Label itext="状态" />
								</Col>
								<Col span={14}>
									<SelectItem InputProps={bind("sta")} code={CodeTable.tcssta} desp="状态" path="/tcsgrp/rec/sta" />
								</Col>
							</Row>
						</Col>
					</Row>
					<Row>
						<Col span={23} offset={1}>
							<div style={{ textAlign: "right" }}>
								<Button type="primary" icon="search" onClick={this.onSel} desp="查询" path="/sel">
									<Label itext="查询" />
								</Button>
							</div>
							<Table scroll={{ x: 1900 }} rowKey="inr" columns={this.tcsgrp_tcslstHeader} dataSource={this.model.tcsgrp_tcslst} path="/tcsgrp/tcslst" />
						</Col>
					</Row>
					{/* <div style={{ textAlign: "center" }}>
						<Button style={{ marginLeft: 10, marginRight: 10 }} type="primary" onClick={this.onShenhe} desp="审核" path="/shenhe">
							<Label itext="审核" />
						</Button>
						<Button style={{ marginLeft: 10, marginRight: 10 }} type="primary" onClick={this.onUpdate} desp="修改" path="/update">
							<Label itext="修改" />
						</Button>
						<Button style={{ marginLeft: 10, marginRight: 10 }} icon="delete" onClick={this.onDel} desp="删除" path="/del">
							<Label itext="删除" />
						</Button>
					</div> */}
				</div>
			</Card>
		)
	}
}
