import React, { Component, Fragment } from 'react'
import {
	Page,Validator,Notification,FormItem,DatePickerItem,TextAreaItem,CheckboxItem,Checkbox,
    InputItem,Input,Bind,SelectItem,Button,Label,Image,Table,Steps
} from '@/components/Common-Library'
import Api from '@/service/api'
import CodeTableFactory from '@/components/CodeTable'
import "./index.less"
import { inject, observer } from 'mobx-react'
import { action, observable } from 'mobx'

import { DatePicker,Card,Divider,Row, Col, Popconfirm, Modal, Spin } from 'antd';
import { PtyPicker } from '@/components/Business-Library'
import { Link, withRouter } from 'react-router-dom'
import Ptspta1 from '@/views/Public/Ptspta1'
import Business from '@/views/Public/Business'
const { Pre, Next, StepWrapper } = Steps
const CodeTable = CodeTableFactory.getInstance()
const confirm = Modal.confirm

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

	constructor(props) {
		super(props)
		this.model = props.model
		this.bind = Bind.bind(this)
	}
    
	detmod_dedlstHeader=[
    	{
    		title:<Label itext="通知业务编号" />, 
    		dataIndex:"ownref",
    		key:"ownref",
    		width:100,
    		sorter: (r1,r2)=>ColSorter(r1.ownref,r2.ownref),
    	},
    	{
    		title:<Label itext="概要描述" />, 
    		dataIndex:"nam",
    		key:"nam",
    		width:100,
    		sorter: (r1,r2)=>ColSorter(r1.nam,r2.nam),
    	},
    	{
    		title:<Label itext="开立日期" />, 
    		dataIndex:"opndat",
    		key:"opndat",
    		width:100,
    		sorter: (r1,r2)=>ColSorter(r1.opndat,r2.opndat),
    	},
    	{
    		title:<Label itext="开证类型" />, 
    		dataIndex:"isstyp",
    		key:"isstyp",
    		width:100,
    		sorter: (r1,r2)=>ColSorter(r1.isstyp,r2.isstyp),
    		render:(val, row, index)=>{
    			let text = val
    			let em = CodeTable.isstyp.find(item=>item.value==val)
    			if(em)
    				text= em.label
    			return text
    		}
    	},
    	{
    		title:<Label itext="贸易方式" />, 
    		dataIndex:"trdtyp",
    		key:"trdtyp",
    		width:100,
    		sorter: (r1,r2)=>ColSorter(r1.trdtyp,r2.trdtyp),
    		render:(val, row, index)=>{
    			let text = val
    			let em = CodeTable.trdtyp.find(item=>item.value==val)
    			if(em)
    				text= em.label
    			return text
    		}
    	},
    	{
    		title:<Label itext="兑付方式" />, 
    		dataIndex:"avbby",
    		key:"avbby",
    		width:100,
    		sorter: (r1,r2)=>ColSorter(r1.avbby,r2.avbby),
    		render:(val, row, index)=>{
    			let text = val
    			let em = CodeTable.avbby.find(item=>item.value==val)
    			if(em)
    				text= em.label
    			return text
    		}
    	},
    	{
    		title:<Label itext="效期" />, 
    		dataIndex:"tenmaxday",
    		key:"tenmaxday",
    		width:100,
    		sorter: (r1,r2)=>ColSorter(r1.tenmaxday,r2.tenmaxday),
    	},
    	{
    		title:<Label itext="闭卷日期" />, 
    		dataIndex:"clsdat",
    		key:"clsdat",
    		width:100,
    		sorter: (r1,r2)=>ColSorter(r1.clsdat,r2.clsdat),
    	},
    	{
    		title:<Label itext="经办柜员" />, 
    		dataIndex:"ownusr",
    		key:"ownusr",
    		width:100,
    		sorter: (r1,r2)=>ColSorter(r1.ownusr,r2.ownusr),
    	},
        {
            title: '操作',
            dataIndex: "op",
            key: "op",
            width: 120,
            render: (val, row, index) => {
                return (
                    <div>
                        <Label onClick={() => this.onGetinfded(row.inr) } style={{ color: "blue", cursor: "pointer" }} value="明细" />
						<Divider type="vertical" />
						<Link to={{ pathname: 'detopn', query: { dedinr: 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('infded/sel',{data:this.model})
                if(rtnmsg.retcod == SUCCESS)
                {
                    this.model.detmod_dedlst = rtnmsg.data.detmod_dedlst;
                    //Notification.success({message:'数据提交成功!'})
                    
                }
                else
                {
                	Notification.error({message:'服务端请求失败!'})
                }
                //余下逻辑处理
                    
        })
    }	
    onGetinfded= async(inr)=>{
        this.formBlur=true  //已触发表单提交处理
        Validator.validate(this.model,this.model.descriptor,async(errors,values)=>{
                if(errors)
                    return 
                const rtnmsg = await Api.post('infded/detmod_getinfded',{params: {dedinr:inr}})
                if(rtnmsg.retcod == SUCCESS)
                {
                    Object.assign(this.model,rtnmsg.data)
                    this.props.extra.bchlevelLst = rtnmsg.codetable.ownbch;
                    this.props.steps.go('明细');
                   // Notification.success({message:'数据提交成功!'})

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

    renderPage(){
    	const bind = this.bind
        const {i18n} = this.props
             
        return (
            <div style={{ position: 'relative' }}>
              <Row>
                <Col span={12}>
                  <Row className="row">
                    <Col span={5} offset={2}>
                      <Label itext="开始日期(开立)"/>
                    </Col>
                    <Col span={14}>
                      <DatePickerItem InputProps={bind("detmod_stadat")} />
                    </Col>
                  </Row>
                </Col>
                <Col span={12}>
                  <Row className="row">
                    <Col span={5} offset={2}>
                      <Label itext="闭卷业务"/>
                    </Col>
                    <Col span={14}>
                      <CheckboxItem InputProps={bind("detmod_clsflg")} />
                    </Col>
                  </Row>
                </Col>
              </Row>
              <Row>
                <Col span={12}>
                  <Row className="row">
                    <Col span={5} offset={2}>
                      <Label itext="结束日期(开立)"/>
                    </Col>
                    <Col span={14}>
                      <DatePickerItem InputProps={bind("detmod_enddat")} />
                    </Col>
                  </Row>
                </Col>
                <Col span={12}>
                  <Row className="row">
                    <Col span={5} offset={2}>
                      <Label itext="业务编号"/>
                    </Col>
                    <Col span={14}>
                      <InputItem InputProps={bind("detmod_ownref")}/>
                    </Col>
                  </Row>
                </Col>
              </Row>

                <div className='button0'>
                <div className='button2'>
                    <Button  type="primary" icon="search" onClick={this.onSel} desp="查询" path="/mtabut/sel">
		            <Label   itext="查询"/>
	                </Button>
                </div>
                </div>
                 <Row >
                    <Col span={23} style={{ marginLeft: 40 }}>
                      <Table key="inr"
                        pagination={{ pageSize: 10, hideOnSinglePage: true }} 
                        columns={this.detmod_dedlstHeader}  
                        dataSource={this.model.detmod_dedlst} />
                    </Col>
                </Row>
                

        </div>           
		)
        }
}
