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 mDiasel 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, Spin,Card } from 'antd'
import { Popconfirm, message } from 'antd';
import { Divider } from 'antd'
import { Link } from 'react-router-dom'
import { number } from 'prop-types'


const CodeTable = CodeTableFactory.getInstance()


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

    constructor(props)
    {
        super(props)
        this.model = new mDiasel()    
        this.bind = Bind.bind(this)
    }
	
	async componentWillMount() 
	{
		/*
		*添加初始化代码
		*/
		const rtnmsg = await Api.post('trnrel/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()//关闭校验
    }


    cancel= () =>{
		message.error('取消成功');
	}
    onDiap_del= async(row)=>{
      
        let inr = row.inr;
		const rtnmsg = await Api.post('diasel/del', { params: { inr } })
                if(rtnmsg.retcod == SUCCESS)
                {
                    //Notification.success({message:'数据提交成功!'})
                   // Notification.error({message:'删除成功！'})
					this.model.dialst = rtnmsg.data.dialst;
                }
                else
                {
                	Notification.error({message:'删除失败!'})
                }
                //余下逻辑处理
                    
        
	}

    dialstHeader=[
    	{
    		title:<Label itext="机构号" />, 
    		dataIndex:"bchkey",
    		key:"bchkey",
    		width:100,
    		sorter: (r1,r2)=>r1.bchkey-r2.bchkey,
    	},
    	{
    		title:<Label itext="日志码值" />, 
    		dataIndex:"cod",
    		key:"cod",
    		width:100,
    		sorter: (r1,r2)=>r1.cod-r2.cod,
    	},
    	{
    		title:<Label itext="提示日期" />, 
    		dataIndex:"dat",
    		key:"dat",
    		width:100,
    		sorter: (r1,r2)=>r1.dat-r2.dat,
    	},
    	{
    		title:<Label itext="下一步处理交易" />, 
    		dataIndex:"frm",
    		key:"frm",
    		width:100,
    		sorter: (r1,r2)=>r1.frm-r2.frm,
    	},
    	{
    		title:<Label itext="提示信息" />, 
    		dataIndex:"inftxt",
    		key:"inftxt",
    		width:100,
    		sorter: (r1,r2)=>r1.inftxt-r2.inftxt,
    	},
    	{
    		title:<Label itext="关联业务编号" />, 
    		dataIndex:"objref",
    		key:"objref",
    		width:100,
    		sorter: (r1,r2)=>r1.objinr-r2.objinr,
    	},
    	{
    		title:<Label itext="创建柜员" />, 
    		dataIndex:"ownusr",
    		key:"ownusr",
    		width:100,
    		sorter: (r1,r2)=>r1.ownusr-r2.ownusr,
    	},
    	{
    		title:<Label itext="业务概要信息" />, 
    		dataIndex:"nam",
    		key:"nam",
    		width:100,
    		sorter: (r1,r2)=>r1.nam-r2.nam,
    	},
    	{
    		title:<Label itext="日志状态" />, 
    		dataIndex:"diatyp",
    		key:"diatyp",
    		width:100,
    		sorter: (r1,r2)=>r1.diatyp-r2.diatyp,
    		render:(val, row, index)=>{
    			let text = val
    			let em = CodeTable.diatyp.find(item=>item.value==val)
    			if(em)
    				text= em.label 
    			return text
    		}
        },
        {
    		title:<Label itext="操作" />, 

    		width:100,
    		render:(val,row)=>{
				return (
					//<Divider type="vertical" />
					<div>
						{/* <Link to={{ pathname: 'tctame', query: { inr: row.inr } }}>修改</Link>
						<Divider type="vertical" />*/}
				{/*<Popconfirm title="确定删除吗？" okText="Yes" cancelText="No" onCancel={this.cancel} onConfirm={this.onDiap_del}>
				<a href="#">删除</a> 
			
				
				
			  </Popconfirm>*/}
			  <Link to={{ pathname: 'tctopn', query: { inr: row.inr } }}>进入</Link>
						<Divider type="vertical" />
						<Popconfirm title="确定删除吗？" okText="Yes" cancelText="No" onCancel={this.cancel} onConfirm={() => this.onDel(row)}>
				<a href="#">删除</a> 
			  </Popconfirm>			
             {/* <Label onClick={() => this.onDel(row)} style={{ color: "blue", cursor: "pointer" }} value="删除" /> */}
			  </div>
              )
                }
            },
    ]


	
	
    //按钮事件
    onDel = async (row) => {
		//console.log(row)
		let inr = row.inr;
		
		const rtnmsg = await Api.post('diasel/del', { params: { inr } })
		if (rtnmsg.retcod == SUCCESS) {
			// Notification.success({ message: '数据提交成功!' })
			this.model.dialst = rtnmsg.data.dialst;
		}
		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('diasel/sel',{data:this.model})
                if(rtnmsg.retcod == SUCCESS)
                {
                    this.model.dialst = rtnmsg.data['dialst'];
					console.log(this.model)
                    
                }
                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 gutter={16}>
						<Col span={6} offset={2}>
							<Col span={6} className='bchrow'>
                            <Label itext="起始日"  />		
							</Col>
                             <Col span={18} >
                             <DatePickerItem InputProps={bind("begdat")}  desp="起始日" path="/begdat" />
                                 </Col>
                                 </Col>
						<Col span={6} offset={0}>
							<Col span={6} className='bchrow'>
								<Label itext="截止日"  />
							</Col>
							<Col span={18}>
                            <DatePickerItem InputProps={bind("enddat")}  desp="截止日" path="/enddat" />
							</Col>
						</Col>
                        <Col span={6} offset={0}>
							<Col span={7} className='bchrow'>
								<Label itext="业务编号"  />
							</Col>
							<Col span={17}>
                            <InputItem InputProps={bind("ownref")}  maxLength={16}  desp="业务编号" path="/ownref" />
							</Col>
						</Col>
						<div className='bchbutton'>
                          <Button  type="primary" icon="search" onClick={this.onSel} desp="查询" path="/sel">
							<Label   itext="查询"/>
							</Button>  
                    </div>
					</Row>    

                    <Table rowKey="inr" columns={this.dialstHeader}  dataSource={this.model.dialst}   path="/dialst"/>

             <Row gutter={16} >
                <Col span={8} offset={11}>
                  {/* <div className='bchbutton'>
                   <Button  type="primary" icon="search" onClick={this.onSel} desp="查询" path="/sel">
							<Label   itext="查询"/>
							</Button>  
                    </div>*/}
				{/*	<div className='bchbutton'>
                    <Button  icon="delete" onClick={this.onDel} desp="删除" path="/del">
							<Label   itext="删除"/>
                        </Button>
                    </div>}*/}
                    {/* <div className='bchbutton'>
                    <Button  type="primary"  onClick={this.onImp} desp="进入" path="/imp">
							<Label   itext="进入"/>      
                        </Button>
                    </div>  */}
					
                </Col>
            </Row>
	
		</div>
        </Card>
		)
	}
}
