import React,{Component} from 'react'
import {Row,Col} from 'antd'
import './index.less'
import * as ElcLabels from './ElcLabel'




export default class ELCMessage extends Component{
    
    //8个不予展示的字段
    displayArr=["OrigSender","OrigReceiver","OrigSendDate","OrigSendTime","MesgType","MesgRefID","MesgID","MesgDirection"]
    
    output(msgobj,ellist,mty_labels,prePath='',deep=0)
    {   
        mty_labels = mty_labels||{}

        if(typeof msgobj === 'object' && !isNaN(msgobj.length))//数组
        {
            return msgobj.map((item,index)=>{
                if(typeof item === 'object')
                    return  this.output(item,ellist,mty_labels,prePath,deep+1)
                else
                    return this.output(item,ellist,mty_labels,prePath,deep)
            })
            
        }
        else if(typeof msgobj === 'object')   //对象
        {
            if(deep == 0 && msgobj.GrpHdr)
                msgobj = Object.assign({GrpHdr:{}},msgobj) //避免GrpHdr不是第一个key
            for(let key in msgobj)
            {
                let item = msgobj[key]
                let ndeep = deep
                let isObject  = typeof item === 'object'
                if(isObject)
                    ndeep++
                let path = prePath?prePath+'.'+key:key
                if(deep == 0 && isObject)
                {
                    if(!Object.keys(item).length) //空实体，不予显示
                        continue
                    if(path == 'GrpHdr')
                        ellist.push( <Row><p className="elcmsg_header"><span>消息头</span></p></Row>)
                    else
                        ellist.push( <Row><p className="elcmsg_header2"><span>{this.getFirstLevelLabel(mty_labels,path)}</span></p></Row>)
                    
                    this.output(item,ellist,mty_labels,path,ndeep)

                    if(path == 'GrpHdr')
                        ellist.push( <Row><p className="elcmsg_header"><span>消息体</span></p></Row>)
                    continue
                }
                if(isObject)
                {
                    // ellist.push(<Row className="elcmsg_subheader">
                    //     <Col offset={deep -1 } span={24-deep+1}><span>{mty_labels[path]||path}</span></Col>
                        
                    //     </Row> )
                    this.output(item,ellist,mty_labels,path,ndeep)
                    continue
                }
                if(item){
                  let str = path.substring(path.length-4)
                  // console.log(path)
                  let isFirstFloor = this.displayArr.find((item)=>{
                    return item == path
                  })
                  if( str == ".Ccy" || isFirstFloor!=undefined ){
                    continue      //币种在报文上不显示  最外层8个指定字段不显示
                  }else{
                    ellist.push(<Row>
                            <Col offset={0} span={6} className="elcmsg_label"><span>{mty_labels[path]||path}</span></Col>
                            <Col span={18} className="elcmsg_value"><span>{item}</span></Col>
                    </Row>)
                  }
                }
                
            }
            return ellist
        }
        

    }
    getFirstLevelLabel(mty_labels,path)
    {
        if(mty_labels[path])
            return mty_labels[path]
        return ElcLabels.Grp_body_lbl[path] || '消息主体'
    }
    getLabels(mty)
    {
        return ElcLabels[mty]
    }
    render()
    {
        let msg = this.props.message
        if(msg && typeof msg ==='string')
            msg = JSON.parse(msg)
        let ellist = []
        let mty = this.props.mty 
        if(mty)
        {
            mty = mty.charAt(0).toUpperCase() + mty.substring(1).replace(/\./g,'_')
        }
        if(!msg)
            return null
        const mty_labels = this.getLabels(mty)
        this.output(msg,ellist,mty_labels)
        return <div className="elcmsg">
            {
                ellist
            }
        </div>
    }
}

