import React, {
	Component
} from 'react';
import {
	observer
} from 'mobx-react';
import {
	Row,
	Col,
	Button
} from 'antd';
import {
	i18n
} from '../../public/i18n';
import isEmpty from 'lodash/isEmpty';

@observer
export default class Result extends Component {
	constructor(props) {
		super(props);
	}

	componentDidMount() {}

	componentWillReceiveProps(nextProps) {}

	render() {
		const {
			store
		} = this.props;
		const {
			resultMessage,
			refreshResult
		} = store;

		const beginInInfo = i18n.label.authTransferBeginIn(),
			finishedInfo = i18n.label.authTransferFinished(),
			transferInfo = i18n.label.transferTarget(),
			deleteInfo = i18n.label.deleteTarget(),
			copyTo = i18n.label.copyTo(),
			transferTo = i18n.label.transferTo(),
			authTransferTotalCount = i18n.label.authTransferTotalCount(),
			authTransferDeleteFinished = i18n.label.authTransferDeleteFinished(),
			authTransferCopyFinished = i18n.label.authTransferCopyFinished(),
			authTransferTransFinished = i18n.label.authTransferTransFinished();

		let processInfoStr = '',
			transferInfoStr = '',
			transferAnalysis = '';
		if (resultMessage.isFinished) {
			processInfoStr = finishedInfo.replace('{beginTime}', `<span class='beginTime'>${resultMessage.beginTime}</span>`)
				.replace('{endTime}', `<span class='endTime'>${resultMessage.endTime}</span>`)
				.replace('{processTime}', `<span class='processTime'>${resultMessage.processTime}</span>`);
			switch (resultMessage.authorityTag) {
				case 'transfer':
					transferAnalysis = authTransferTransFinished.replace('{param}', `<span class='count'>${resultMessage.succCount || resultMessage.totalCount}</span>`);
					break;
				case 'copy':
					transferAnalysis = authTransferCopyFinished.replace('{param}', `<span class='count'>${resultMessage.succCount || resultMessage.totalCount}</span>`);
					break;
				case 'delete':
					transferAnalysis = authTransferDeleteFinished.replace('{param}', `<span class='count'>${resultMessage.succCount || resultMessage.totalCount}</span>`);
					break;
			}
		} else {
			processInfoStr = beginInInfo.replace('{beginTime}', `<span class='beginTime'>${resultMessage.beginTime}</span>`);
			transferAnalysis = authTransferTotalCount.replace('{param}', `<span class='count'>${resultMessage.succCount || resultMessage.totalCount}</span>`);
		}
		if (resultMessage.authorityTag != 'delete') {
			transferInfoStr = transferInfo.replace('{param}', resultMessage.from)
				.replace('{op}', `<span class='op'>${resultMessage.authorityTag === 'copy' ? copyTo : transferTo}</span>`);
			transferInfoStr = `${transferInfoStr}${resultMessage.to}`;
		} else {
			transferInfoStr = `<span class='op'>${deleteInfo}</span>${resultMessage.from}`
		}

		return (
			<div className='content'>
				<div className='lbl' dangerouslySetInnerHTML={{__html: processInfoStr}}></div>
				<div className='lbl' dangerouslySetInnerHTML={{__html: transferInfoStr}}></div>
				<div className='list'>
				{
					resultMessage.processDataList && resultMessage.processDataList.length > 0 
					?
					resultMessage.processDataList.map((item, index) => {
						const {title, value, tips} = item;
						let itemValue = value;
						if(!isEmpty(tips)){
							itemValue = (
								<span>
									<span>{value}</span>
									<span style={{marginLeft: '8px', color: 'red'}}>({tips})</span>
								</span>
							)
						}
						return (
							<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@4f04ii@${index}`} gutter={8} className='record'>
								<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@kurogl@${index}`} span={10}>{title}:</Col>
								<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@6ipvmh@${index}`} span={14} className='count'>{itemValue}</Col>
							</Row>
						)
					})
					:
					<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@70r4ys`} gutter={8} className='record'>{i18n.message.dataNone()}</Row>
				}
				</div>
				<div className='analysis' dangerouslySetInnerHTML={{__html: transferAnalysis}}></div>
			</div>
		)
	}
}