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

const CodeTable = CodeTableFactory.getInstance()


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

	@observable
	bchlevelLst= []

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

	componentWillUnmount() {
	}


	async componentWillMount() {
		if (this.props.location.state) {
			let selflg = this.props.location.state.selflg
			if (selflg)
				this.onSel()
		} else {
			const rtnmsg = await Api.post('dblbcl/init', {})
			if (rtnmsg.retcod == SUCCESS) {
				Object.assign(this.model, rtnmsg.data)
				this.bchlevelLst = rtnmsg.codetable['bclp_bchkey'];
			}
			else {
				Notification.error({ message: '服务端请求失败!' })
			}
    }
    
    //快照模式下，不必开启校验，否则，静默校验，和记录变动
		!this.loadDisplay() && this.model.openMonitor && this.model.openMonitor() //开启校验
  }
    componentWillUnmount()
    {
        this.model.stopMonitor&&this.model.stopMonitor()//关闭校验
    }



	bclp_bcllstHeader = [
		{
			title: <Label value="机构" />,
			dataIndex: "bchkey",
			key: "bchkey",
			width: 100,
			render: (val, row, index) => {
				let text = val
				let em = null;
				this.bchlevelLst.map((item) => {
					if (item.value == val) {
						em = item
					}
				})
				if (em)
					text = em.label
				return text
			}
		},
		{
			title: <Label value="业务品种" />,
			dataIndex: "busrou",
			key: "busrou",
			width: 100,
			render: (val, row, index) => {
				let text = val
				let em = null;
				CodeTable.busrou.map((item) => {
					if (item.value == val) {
						em = item
					}
				})
				if (em)
					text = em.label
				return text
			}
		},
		{
			title: <Label value="经办方式" />,
			dataIndex: "exeflg",
			key: "exeflg",
			width: 100,
			render: (val, row, index) => {
				let text = val
				let em = null;
				CodeTable.exetyp.map((item) => {
					if (item.value == val) {
						em = item
					}
				})
				if (em)
					text = em.label
				return text
			}
		},
		{
			title: <Label value="登记方式" />,
			dataIndex: "regflg",
			key: "regflg",
			width: 100,
			render: (val, row, index) => {
				let text = val
				let em = null;
				CodeTable.regflg.map((item) => {
					if (item.value == val) {
						em = item
					}
				})
				if (em)
					text = em.label
				return text
			}
		},
		{
			title: <Label value="上收单证中心" />,
			dataIndex: "upbchkey",
			key: "upbchkey",
			width: 160,
			render: (val, row, index) => {
				let text = val
				let em = null;
				this.bchlevelLst.map((item) => {
					if (item.value == val) {
						em = item
					}
				})
				if (em)
					text = em.label
				return text
			}
		},
		{
			title: '操作',
			dataIndex: "op",
			key: "op",
			width: 120,
			render: (val, row, index) => {
				return (
					<div>
						<Link to={{ pathname: 'dbebcl', query: { inr: row.inr } }}>修改</Link>
						<Divider type="vertical" />
						<Link to={{ pathname: 'dbibcl', query: { inr: row.inr } }}>明细</Link>
						<Divider type="vertical" />
						<Link to={{ pathname: 'dbdbcl', query: { inr: row.inr } }}>删除</Link>
					</div>
				)
			}
		},
	]


	// autp_autlstHeader = [
	// 	{
	// 		title: <Label value="机构" />,
	// 		dataIndex: "bchkey",
	// 		key: "bchkey",
	// 		width: 100,
	// 	},
	// 	{
	// 		title: <Label value="业务品种" />,
	// 		dataIndex: "busrou",
	// 		key: "busrou",
	// 		width: 100,
	// 	},
	// 	{
	// 		title: <Label value="经办方式" />,
	// 		dataIndex: "exeflg",
	// 		key: "exeflg",
	// 		width: 100,
	// 	},
	// 	{
	// 		title: <Label value="登记方式" />,
	// 		dataIndex: "regflg",
	// 		key: "regflg",
	// 		width: 100,
	// 	},
	// 	{
	// 		title: <Label value="上收单证中心" />,
	// 		dataIndex: "upbchkey",
	// 		key: "upbchkey",
	// 		width: 100,
	// 	},
	// 	{
	// 		title: '操作',
	// 		dataIndex: "op",
	// 		key: "op",
	// 		width: 120,
	// 		render: (val, row, index) => {
	// 			return (
	// 				<div>
	// 					<Link to={{ pathname: 'dbebcl', query: { inr: row.inr } }}>修改</Link>
	// 					<Divider type="vertical" />
	// 					<Link to={{ pathname: 'dblbcl2', query: { inr: row.inr } }}>明细</Link>
	// 					<Divider type="vertical" />
	// 					<Link to={{ pathname: 'dblbcl2', query: { inr: row.inr } }}>删除</Link>
	// 				</div>
	// 			)
	// 		}
	// 	},
	// ]


	//按钮事件
	onAdd = () => {
		// this.props.history.push('dbaaut')
		// this.props.history.push('dblbcl2')
		this.props.history.push('dbabcl')
	}

	onSel = () => {
		this.formBlur = true  //已触发表单提交处理
		Validator.validate(this.model, this.model.descriptor, async (errors, values) => {
			if (errors)
				return
			const rtnmsg = await Api.post('dblbcl/sel', { data: this.model })
			if (rtnmsg.retcod == SUCCESS) {
				//Notification.success({message:'数据提交成功!'})
				this.model.bclp_bcllst = rtnmsg.data.bclp_bcllst;
				console.log(this.model.bclp_bcllst)
			}
			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 value={"归属机构"} />
										</Col>
										<Col span={14}>
											<SelectItem InputProps={bind("bclp_bchkey")} code={this.bchlevelLst} desp="归属机构" path="/autp/bchkey" />
										</Col>
									</Row>
								</Col>
							</Row>
						</Col>
					</Row>
					<div className='button0'>
						<div className='button2'>
							<Button type="primary" icon="search" onClick={this.onSel} desp="查询" path="/mtabut/sel">
								<Label value="查询" desp="查询" />
							</Button>
						</div>
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
					 <div className='button2'>
							<Button type="primary" onClick={this.onAdd}>
								<Label i18nId="MTABUT_BT000182" />
							</Button>
						</div>
					</div>
					<Row >
						<Col span={23} style={{ marginLeft: 40 }}>
							<Table rowKey="inr" columns={this.bclp_bcllstHeader} dataSource={this.model.bclp_bcllst} path="/autp/autlst" />
						</Col>
					</Row>
				</div>
			</Card>
		)
	}
}
