import React, {Component} from "react";
import {WordsBtn} from 'educoder';
import {Table,Tooltip,} from "antd";
import {Link,Switch,Route,Redirect} from 'react-router-dom';

class ConclusionEvaluation extends Component {

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

	componentDidMount() {

	}

	render() {
		let {data}=this.props;
		let columns=[{
			title: '总评',
			dataIndex: 'type',
			key: 'type',
			render: (text, record) => (
          <span style={{color:'#FF6800'}}>{record.type}</span>
			),
		}, {
			title: '获得经验值',
			dataIndex: 'empirical',
			key: 'empirical',
			render: (text, record) => (
				<span>
		       <span style={{color:'#FF6800'}}>{record.empirical.minute}</span><span className={"color-grey-9"}>/{record.empirical.total}</span>
				</span>
			),
		}, {
			title: '作业成绩',
			dataIndex: 'grade',
			key: 'grade',
			render: (text, record) => (
				<span>
				  <Tooltip placement="bottom" title={
				  	<pre>
							分数：{record.grade.minute}/总分：{record.grade.total}
						</pre>
					}>
		        <span style={{color:'#FF6800'}}>{record.grade.minute}</span><span className={"color-grey-9"}>/{record.grade.total}</span>
          </Tooltip>
				</span>
			),
		}, {
			title: '耗时',
			key: 'elapsed',
			dataIndex: 'elapsed',

			render: (text, record) => (
				<span  className={"color-grey-9"}>
					{record.elapsed}
        </span>
			),
		}, {
			title: '评测次数',
			key: 'time',
			dataIndex: 'time',
			render: (text, record) => (
				<span>
          {record.time}
        </span>
			),
		}];

		let datas=[];

		datas.push({
			type: data&&data.overall_appraisal,
			empirical: {minute:data&&data.myself_experience,total:data&&data.total_experience},
			grade: {minute:data&&data.work_score,total:data&&data.all_work_score},
			elapsed: data&&data.time_consuming,
			time:data&&data.evaluate_count
		})
		return (
			<div>
				{/*{data===undefined?"":""}*/}
				<style>{`
				.ant-table-thead > tr > th{
				    text-align: center;
				    font-weight: 300;
					}
					.ant-table-tbody > tr > td{
            text-align: center;
            padding: 0px;
					}
					.ant-table-tbody > tr{
					   height:64px;
					}
				`}</style>
				<Table
				  dataSource={datas}
					columns={columns}
				  pagination={false}
					// onChange={this.TablePagination}
				/>
			</div>

		)
	}
}

export default ConclusionEvaluation;