import React, { Component, Fragment } from 'react'
import {
	Bind,
	Page, Steps
} from '@/components/Common-Library'
import Api from '@/service/api'
import mDbitsk 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 } from 'antd'
import Basic from './Basic'
import Basic2 from './Basic2'
import { TableExpansion } from '@/components/Business-Library'

const StepItem = Steps.Item
const CodeTable = CodeTableFactory.getInstance()

@inject('UserContext')
@inject('i18n')
@observer
export default class DbitskScreen extends Page {
	@observable
	formBlur = false
	@observable
	codetable = {}
	constructor(props) {
		super(props)
		this.model = new mDbitsk()
		// this.model.openValidate() //开启校验
		this.bind = Bind.bind(this)
	}

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

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

		return (
			<Card title="任务分配设置" size="small" className="transTitle">
				<Steps>
					<StepItem title="柜员任务设置">
						<Basic model={this.model} codetable={this.codetable} extra={this.extra} />
					</StepItem>
					<StepItem title="任务分配设置">
						<Basic2 model={this.model} codetable={this.codetable} extra={this.extra} />
					</StepItem>
				</Steps>
			</Card>
		)
	}
}
