import { WeaUpload, } from 'ecCom';
import { Row, Col,  } from 'antd';
import { toJS } from "mobx"
import PrjForm from "../../prjForm.js"
import { observer } from 'mobx-react';


@observer
export default class TaskNewInfo extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            stageVisiable : 3
        }
    }

    render() {
        const { listStore:{fieldinfo} } = this.props;
        const titleStyle = {
            fontSize : "15px"
        }
        return (
            <Row >
                <PrjForm fieldinfo={fieldinfo} titleStyle={titleStyle}/>
            </Row>
        )
    }


    getTaskInfo = () => {
        const { listStore:{fieldinfo},prefixCls } = this.props;
        return fieldinfo && toJS(fieldinfo).map((item,index)=>
                 (
                    <React.Fragment >
                        <header style={{borderBottom:" 1px solid  #cfcfcf"}} className={`${prefixCls}-card-title`}>
                            <span className={`${prefixCls}-main-card-title`} >{item.title}</span>
                        </header>
                        <section style={{marginLeft:"20px"}}>
                            <Row style={{fontSize:"12px"}}>
                                { this.getTaskInfoItem(item.items) }
                            </Row>
                        </section>
                    </React.Fragment>
                )           
        );
    }

    getTaskInfoItem = (items) => {
        let item = [];
        const { prefixCls } = this.props;
        let stylecss = {'margin-right':'5px','margin-top': '16px'};
        items.map((field,index)=>{
            let dom = {};
            if(field.domkey[0] == "prjprocess"){
                item.push(<Col span="12" style={{lineHeight:"30PX",height:"34px"}}>
                <Col span="6">
                    <span className={`${prefixCls}-field-name`}>{field.label} </span>
                </Col>
                <Col span="18" >
                    <WeaProgress name={field.domkey[0]} percent={field.value || 0} status="active"  />
                </Col>
            </Col>)
            }else if(field.conditionType == "INPUT"){
                item.push(<Col span="12" style={{lineHeight:"30PX"}}>
                    <Col span="6">
                        <span className={`${prefixCls}-field-name`}>{field.label} </span>
                    </Col>
                    <Col span="18" >
                       <span className={`${prefixCls}-cell-label`} dangerouslySetInnerHTML={{ __html: field.value }}></span>
                    </Col>
                </Col>);
            }else if(field.conditionType == "BROWSER"){
                item.push(<Col span="12" style={{lineHeight:"30PX"}}>
                    <Col span="6">
                        <span className={`${prefixCls}-field-name`}>
                        {field.label}
                        </span>
                    </Col>
                    <Col span="18" >
                            {field.browserConditionParam.replaceDatas && field.browserConditionParam.replaceDatas.map((item)=>{
                                if(field.domkey[0] == "manager" || field.domkey[0] == "members" ){
                                    return  <span style={{paddingRight:"10px"}} className={`${prefixCls}-cell-label`}>
                                        <a href={'javaScript:openhrm('+item.id+');'} onClick={e => window.pointerXY(e)} >{item.name}</a>
                                    </span>
                                }
                                if(field.browserConditionParam.linkUrl != ""){
                                    return <span style={{paddingRight:"10px"}} className={`${prefixCls}-cell-label`}>
                                        <a href={field.browserConditionParam.linkUrl+item.id} target="_blank">{item.name}</a>
                                        </span>
                                }else{
                                    return <span className={`${prefixCls}-cell-label`} style={{paddingRight:"10px"}}>{item.name}</span>
                                }
                            })}
                    </Col>
                </Col>)
            }else if (field.conditionType == "SELECT"){
                item.push(<Col span="12" style={{lineHeight:"30PX"}}>
                    <Col span="6">
                        <span className={`${prefixCls}-field-name`}>
                        {field.label}
                        </span>
                    </Col>
                    <Col span="18" >
                            {
                                field.options && field.options.map((item)=>{
                                    if(item.key == field.value){
                                        return item.showname
                                    }
                                })
                            }
                    </Col>
                </Col>)
            }else if (field.conditionType == "CHECKBOX"){
                item.push(<Col span="12" style={{lineHeight:"30PX"}}>
                    <Col span="6">
                        <span className={`${prefixCls}-field-name`}>
                        {field.label}
                        </span>
                    </Col>
                    <Col span="18" className={`${prefixCls}-cell-label`}>
                            {
                                field.value != "1" ? getLabel('30587', '否') : getLabel('163', '是')
                            }
                    </Col>
                </Col>)
            }else if(field.conditionType == "ATTACHEMENT"){
                let domkey = field.domkey[0];
                
              item.push(<Col span="12" style={{lineHeight:"30PX"}}>
              <Col span="6">
                  <span className={`${prefixCls}-field-name`}>
                  {field.label}
                  </span>
              </Col>
              <Col span="18" className={`${prefixCls}-cell-label`}>
                <WeaUpload 
                        name={domkey}
                        uploadId={[domkey]}
                        uploadUrl={(window.ecologyContentPath || '')+"/api/proj/prjutil/fileUpload?accsec="+field.accsec}
                        category={field.accsec}
                        autoUpload={true}
                        showBatchLoad={false}
                        showClearAll={false}
                        multiSelection={true}
                        datas={toJS(field.datas)}
                        maxUploadSize={field.accsize}
                        viewAttr={field.viewAttr}
                        // onUploading={(state)=>{}}
                    />
              </Col>
          </Col>)
            }
            
        });
        return item;
    }
}