import { inject, observer} from 'mobx-react';
import {
    WeaDialog,
    WeaNewScroll,
}from 'ecCom'

import {
	Row,
	Col,
	Icon,
    Spin,
	Modal,
    Table,
    Button,
} from 'antd'
import isEmpty from 'lodash/isEmpty';
import React from 'react'
import { WeaTableNew } from 'comsMobx';
import { toJS } from 'mobx';

const WeaTable = WeaTableNew.WeaTable;

@inject('hrmImportOrg')
@observer
class ImportResult extends React.Component{
    constructor(props){
    	super(props);
  	}
    
    componentDidMount(){
        const { hrmImportOrg } = this.props;
        hrmImportOrg.errorInfo = '';
        //hrmImportOrg.ref=this.refs["scroll"];
    } 

  	getButtons(){
        const { hrmImportOrg } = this.props;
        const { failnum,importStatus} = hrmImportOrg;
        const buttons = [];
        if(importStatus == 'over'){
            if(failnum>0){
                buttons.push(<Button type="primary" onClick={() => this.submit()}>下载错误数据</Button>);
            }
            buttons.push(<Button type="primary" onClick={() => this.submit()}>下载全部数据</Button>);
            buttons.push(<Button type="primary" onClick={() => this.getImportLog()}>导入日志</Button>);
        }
        buttons.push(<Button disabled>更多>></Button>);

        return buttons;
  	}

    reRenderColumns(c){
        c.forEach( item => {
            if(item.dataIndex == 'operatedetail'){
                item.render = function(text, record){
                    return  <span style={{color: '#FF0000'}}>{text}</span>
                }
            }
        });
  	}
    
    cancel(){
        const { hrmImportOrg } = this.props;
        hrmImportOrg.visibleResult = false;
    }

    getImportLog(){
        const { hrmImportOrg } = this.props;
        hrmImportOrg.visibleImportLog = true;
        hrmImportOrg.getImportLogSearchCondition();
        hrmImportOrg.getImportLogDetail();
    }

  	render(){
        const { hrmImportOrg } = this.props;
        const { titleResult, visibleResult, importResultColumns, importProcessLogDatas,failnum, succnum, importResultTip,importResultStore, importStatus,errorInfo } = hrmImportOrg;
        return (
            <div>
                {
                    visibleResult && 
                    <WeaDialog
                        title={titleResult}
                        icon="icon-coms-hrm"
                        iconBgcolor="#217346"
                        visible={visibleResult}
                        closable={true}
                        onCancel={() => this.cancel()}
                        buttons={this.getButtons()}
                        style={{width: 720, height: 340}}
                    >
                    <div className="hrm-import-dialog">
                    {
                        importStatus!='over' || importStatus == 'error'?<div>
                            {
                                errorInfo!=''?<div className="hrm-import-error" dangerouslySetInnerHTML={{ __html: errorInfo }}  />:
                                                <div className="hrm-import-process"><Spin tip="服务器正在处理数据导入，请稍后……"></Spin></div>
                            }
                            <div className="wea-new-table">
                                <WeaNewScroll height={320} ref="scroll">
                                    <Table dataSource={toJS(importProcessLogDatas)} columns={toJS(importResultColumns)} pagination={false}/>
                                </WeaNewScroll>
                            </div>
                        </div>:<div>
                            <div className="hrm-import-result-icon" style={{paddingTop: failnum==0?150:15}}>
                                <div style={{width: 30,height: 30,borderRadius: 25, padding: 8, display: 'inline-block',backgroundColor:succnum>0? '#54D3A2' : '#FF0000' }}>
                                    <Icon type={succnum>0?'check':'cross'} style={{color: '#fff' }} />
                                </div><span style={{paddingLeft:5}}>{importResultTip}</span>
                            </div>
                            {
                                failnum>0&&
                            <WeaTable 
                                    comsWeaTableStore={importResultStore}
                                    bordered
                                    needScroll={true}
                                    pagination={false}
                                    scroll={{y: 246}}
                                    rowKey={(record,index) => index}
                                    getColumns={c => this.reRenderColumns(c)}
                                />
                        }
                    </div>
                    }
                    </div>
                    </WeaDialog>
                }
            </div>
    	)
    }
}

export default ImportResult