import React,{Component,Fragment} from 'react'
import PropTypes from 'prop-types'
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 mDberol from '../model'
import CodeTableFactory from '@/components/CodeTable'
import "./index.less"
import { inject, observer } from 'mobx-react'
import { action, observable,runInAction } from 'mobx'


const CodeTable = CodeTableFactory.getInstance()


@inject('UserContext')
@inject('i18n')
@observer
export default class DberolScreen extends Page
{
    static childContextTypes = {
        trn: PropTypes.string,
    }
    getChildContext () {
        return {trn:'dberol'}
    }
    
    
    @observable
    formBlur=false

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

    rolp_fillstHeader=[
    	{
    		title:<Label itext="交易码" />, 
    		dataIndex:"frm",
    		key:"frm",
    		width:100,
    		sorter: (r1,r2)=>ColSorter(r1.frm,r2.frm),
    	},
    	{
    		title:<Label itext="交易名" />, 
    		dataIndex:"frmnam",
    		key:"frmnam",
    		width:100,
    		sorter: (r1,r2)=>ColSorter(r1.frmnam,r2.frmnam),
    	},
    	{
    		title:<Label itext="交易级别" />, 
    		dataIndex:"frmlev",
    		key:"frmlev",
    		width:100,
    		sorter: (r1,r2)=>ColSorter(r1.frmlev,r2.frmlev),
    	},
    	{
    		title:<Label itext="交易组别" />, 
    		dataIndex:"frmgrp",
    		key:"frmgrp",
    		width:100,
    		sorter: (r1,r2)=>ColSorter(r1.frmgrp,r2.frmgrp),
    	},
    	{
    		title:<Label itext="选中" />, 
    		dataIndex:"choose",
    		key:"choose",
    		width:100,
    		sorter: (r1,r2)=>ColSorter(r1.choose,r2.choose),
    	},
    ]


    //按钮事件
    onSav= ()=>{
        this.formBlur=true  //已触发表单提交处理
        Validator.validate(this.model,this.model.descriptor,async(errors,values)=>{
                if(errors)
                    return 
                const rtnmsg = await Api.post('dberol/sav',{data:this.model})
                if(rtnmsg.retcod == SUCCESS)
                {
                    Notification.success({message:'数据提交成功!'})
                    
                }
                else
                {
                	Notification.error({message:'服务端请求失败!'})
                }
                //余下逻辑处理
                    
        })
    }
    onRtn= ()=>{
        this.formBlur=true  //已触发表单提交处理
        Validator.validate(this.model,this.model.descriptor,async(errors,values)=>{
                if(errors)
                    return 
                const rtnmsg = await Api.post('dberol/rtn',{data:this.model})
                if(rtnmsg.retcod == SUCCESS)
                {
                    Notification.success({message:'数据提交成功!'})
                    
                }
                else
                {
                	Notification.error({message:'服务端请求失败!'})
                }
                //余下逻辑处理
                    
        })
    }
    onChk= ()=>{
        this.formBlur=true  //已触发表单提交处理
        Validator.validate(this.model,this.model.descriptor,async(errors,values)=>{
                if(errors)
                    return 
                const rtnmsg = await Api.post('dberol/chk',{data:this.model})
                if(rtnmsg.retcod == SUCCESS)
                {
                    Notification.success({message:'数据提交成功!'})
                    
                }
                else
                {
                	Notification.error({message:'服务端请求失败!'})
                }
                //余下逻辑处理
                    
        })
    }
    

    //交易内实现
    renderPage(){
    	const bind = this.bind
        const {i18n} = this.props
             
        return (
        	<div className="transPage">

	
	<Label itext="角色编码" trn="dberol" />	
	<InputItem InputProps={bind("extkey")}  maxLength={8}  desp="角色编码" path="/rolgrp/rec/extkey" />

	
	<Label itext="角色名称" trn="dberol" />	
	<InputItem InputProps={bind("rolnam")}  maxLength={40}  desp="角色名称" path="/rolgrp/rec/rolnam" />
	<Button  type="primary" icon="save"
		  onClick={this.onSav} desp="Save" path="/mtabut/sav">
		<Label   itext="提交"/>
	</Button>

	
	<Label itext="级别" trn="dberol" />	
	<SelectItem InputProps={bind("rollev")}   desp="级别" path="/rolgrp/rec/rollev"/>

	
	<Label itext="备注" trn="dberol" />	
	<TextAreaItem InputProps={bind("remark")} desp="备注" path="/rolgrp/rec/remark"/>
	<Button  type="primary"  onClick={this.onChk} desp="Check" path="/mtabut/chk">
		<Label   itext="检查"/>
	</Button>
	<Button  type="primary"  onClick={this.onRtn} desp="退出" path="/mtabut/rtn">
		<Label   itext="返回"/>
	</Button>

	
	<Label itext="权限菜单维护" trn="dberol" />	
	<Table rowKey="inr" columns={this.rolp_fillstHeader}  dataSource={this.model.rolp_fillst}   path="/rolp/fillst"/>

	
	<Label itext="唯一编号" trn="dberol" />	
	<InputItem InputProps={bind("inr")}  maxLength={8}  desp="唯一编号" path="/rolgrp/rec/inr" />

	
	<Label itext="创建时间" trn="dberol" />	
	<DatePickerItem InputProps={bind("credat")}  desp="创建时间" path="/rolgrp/rec/credat" />

	
	<Label itext="实体" trn="dberol" />	
	<InputItem InputProps={bind("etyextkey")}  maxLength={16}  desp="实体" path="/rolgrp/rec/etyextkey" />
		</div>
		)
	}
}
