import React, {Component} from "react";
import {Link, NavLink} from 'react-router-dom';
import {WordsBtn, ActionBtn,SnackbarHOC,getImageUrl,markdownToHTML} from 'educoder';
import axios from 'axios';
import {
	notification,
	Spin,
	Table,
	Pagination,
	Radio
} from "antd";
import './../questioncss/questioncom.css';
const tagArray = [
	'A．', 'B．', 'C．', 'D．', 'E．', 'F．', 'G．', 'H．', 'I．',
	'J．', 'K．', 'L．', 'M．', 'N．', 'O．', 'P．', 'Q．', 'R．',
	'S．', 'T．', 'U．', 'V．', 'W．', 'X．', 'Y．', 'Z．'
]
class Listjihe extends Component {
	constructor(props) {
		super(props);
		this.state = {
			page:1,
			name:"单选题",
			nd:"简单",
		}
	}
	//初始化
	componentDidMount(){


	}

	//选用
	Selectingpracticaltraining=(id)=>{
		 let data={
			 item_ids:[id]
		 }
     this.props.getitem_baskets(data);
	}
	//撤销
	Selectingpracticaltrainings=(id)=>{

		this.props.getitem_basketss(id);
	}





	render() {
		let {page,name,nd}=this.state;
		let {defaultActiveKey,items,listjihe,chakanjiexiboolindex,keindex}=this.props;

		// 编程答案
		var rightkey=null

		if(items){
			if(items.item_type){
				if(items.item_type==="PROGRAM"){
				}else{
					if(items.choices){
						if(items.choices.length>0){

							var arr= items.choices;
							for(let data of arr) {
								if(data.is_answer===true){
									rightkey=data.choice_text;
									break;
								}
							}
						}
					}
				}
			}

		}


		return (
			<div className={chakanjiexiboolindex===keindex?"w100s borderwds283  pd20 mb20 listjihecolors":"w100s borderwds  pd20 mb20 listjihecolors"}>
				{/*顶部*/}
				<div className="w100s sortinxdirection">
					<div className="listjihetixingstitsy">
						{
							this.props.listjihe
						}
					</div>
					<div className="listjihetixingstitsy">
						.
					</div>
					<div className="ml10 w100s listjihetixingstit markdown-body"  style={{wordBreak: "break-word"}} dangerouslySetInnerHTML={{__html: markdownToHTML(items&&items.name).replace(/▁/g, "▁▁▁")}}>
					</div>
				</div>
				{/*内容*/}
				<div className="w100s sortinxdirection ">
					{items.item_type==="JUDGMENT"?
         <p className="w100s listjihetixingstits sortinxdirection ">
					 {
						 items === undefined ||items === null? "" : items.choices.map((object, index) => {
							 return (
								 <p className={index===1? "sortinxdirection  ml10":"sortinxdirection  " }  >
									 <Radio checked={object.is_answer}>
										 {object.choice_text}
									 </Radio>
								 </p>
							 )
						 })
					 }
				</p>:
						items.item_type==="PROGRAM"?
							<p className="w100s listjihetixingstitssy sortinxdirection ">
											<p className={"sortinxdirection  mt15"} >
												<p style={{wordBreak: "break-word"}} dangerouslySetInnerHTML={{__html: markdownToHTML(items.program_attr.description).replace(/▁/g, "▁▁▁")}}></p>
											</p>
							</p>
						:
					<p className="w100s listjihetixingstits verticallayout ">
						{
							items === undefined ||items === null? "" : items.choices.map((object, index) => {
								return (
									<p className={index===0?"sortinxdirection":"sortinxdirection  mt15"} >
										{tagArray[index]}
										<p style={{wordBreak: "break-word"}} dangerouslySetInnerHTML={{__html: markdownToHTML(object.choice_text).replace(/▁/g, "▁▁▁")}}></p>
									</p>
								)
							})
						}
					</p>
					}
				</div>


				<div className="w100s sortinxdirection mt10">
					<p className="listjihetixing">难度：<span >{items.difficulty===1?"简单":items.difficulty===2?"适中":items.difficulty===3?"困难":""}</span></p>
					<p className="ml30 listjihetixing">题型：<span >{items.item_type==="SINGLE"?"单选题":items.item_type==="MULTIPLE"?"多选题":items.item_type==="JUDGMENT"?"判断题":items.item_type==="PROGRAM"?"编程题":""}</span></p>
				</div>
				{/*更新时间*/}
				<div className="w100s sortinxdirection">
					<div className="w50s listjihetixingstit sortinxdirection">
           <p className="updatetimes lh30">更新时间：{items.update_time}</p>
						{
							this.props.defaultActiveKey==="0"||this.props.defaultActiveKey===0?
								""
								:
								<p className="updatetimes lh30 ml45">创建者：{items.author.name}</p>
						}
							{
								items.item_type==="PROGRAM"?
									<p className="updatetimes lh30 ml45">编程语言：{items.program_attr.language}</p>
									:""
						  }
						{
							items.item_type==="PROGRAM"?
								items.program_attr.status===0?
									<p className="updatetimes lh30 ml45 nofabu mt5">未发布</p>
									:""
								:""
						}
					</div>
					<div className="w50s xaxisreverseorder">
						{
							items.choosed===true?
								<p className="selectionss  xiaoshou" onClick={()=>this.Selectingpracticaltrainings(items.id)}>
									<i className="iconfont icon-jianhao font-12 lg ml7 lh30 icontianjiadaohangcolor mr10"></i>
									<span>撤销</span></p>
								:
									items.item_type==="PROGRAM"?
										items.program_attr.status===0?
											<p className="selectionys  jinzhixiaoshou" >
												<i className="iconfont icon-tianjiadaohang font-12 lg ml7 lh30 icontianjiadaohangcolor mr10"></i>
												<span>选用</span>
											</p>
											:
										<p className="selection  xiaoshou" onClick={()=>this.Selectingpracticaltraining(items.id)}>
											<i className="iconfont icon-tianjiadaohang font-12 lg ml7 lh30 icontianjiadaohangcolor mr10"></i>
											<span>选用</span>
										</p>
										:
								<p className="selection  xiaoshou" onClick={()=>this.Selectingpracticaltraining(items.id)}>
									<i className="iconfont icon-tianjiadaohang font-12 lg ml7 lh30 icontianjiadaohangcolor mr10"></i>
									<span>选用</span>
								</p>
						}
						{
							defaultActiveKey===0||defaultActiveKey==="0"?
								<div className="xaxisreverseorder">
									<p className="viewparsings  xiaoshou mr25" onClick={()=>this.props.showmodelysl(items.id)}>
										<i className="iconfont icon-shanchu1 font-17 lg ml7 lh30 icontianjiadaohangcolors mr5"></i>
										<span>删除</span>
									</p>
									{
										items.item_type==="PROGRAM"?
											<a href={`/problems/${items.program_attr.identifier}/edit`}>
												<p className="viewparsings  xiaoshou mr25" >
													<i className="iconfont icon-bianji2 font-17 lg ml7 lh30 icontianjiadaohangcolors mr5"></i>
													<span>编辑</span>
												</p>
											</a>
											:
											<a href={`/question/edit/${items.id}`}>
												<p className="viewparsings  xiaoshou mr25" >
													<i className="iconfont icon-bianji2 font-17 lg ml7 lh30 icontianjiadaohangcolors mr5"></i>
													<span>编辑</span>
												</p>
											</a>
									}
									{
										items.public===false?
											items.item_type==="PROGRAM"?
												items.program_attr.status===0?
													""
													:
												<p className="viewparsings  xiaoshou mr25" onClick={()=>this.props.showmodels(items.id)}>
													<i className="iconfont icon-gongkai font-17 lg ml7 lh30 icontianjiadaohangcolors mr5"></i>
													<span>公开</span>
												</p>
												:
											<p className="viewparsings  xiaoshou mr25" onClick={()=>this.props.showmodels(items.id)}>
												<i className="iconfont icon-gongkai font-17 lg ml7 lh30 icontianjiadaohangcolors mr5"></i>
												<span>公开</span>
											</p>
											:
										""
									}

								</div>
								:""
						}
						{
							items.item_type==="PROGRAM"?
                  ""
								:
								<p className="viewparsings  xiaoshou mr25" onClick={()=>this.props.chakanjiexibool(keindex)}>
									<i className="iconfont icon-jiexi font-17 lg ml7 lh30 icontianjiadaohangcolors mr5"></i>
									查看解析</p>
						}



					</div>
				</div>
				{
					chakanjiexiboolindex===keindex?<div>
						<div className="w100s questiontypeheng mt23">

						</div>
						<div className=" sortinxdirection mt15 yldxtit" >
							<p className=" testfondex yldxtit"
								 style={{wordBreak: "break-word"}} dangerouslySetInnerHTML={{__html: markdownToHTML("答案："+rightkey).replace(/▁/g, "▁▁▁")}}
							>
							</p>
						</div>
						{
							items&&items.analysis?
								""
								:""
						}
						<div className=" sortinxdirection mt15 yldxtit" >
							<p className=" testfondex yldxtit"
								 style={{wordBreak: "break-word"}} dangerouslySetInnerHTML={{__html: markdownToHTML("解析："+items.analysis).replace(/▁/g, "▁▁▁")}}
							>
							</p>
						</div>
					</div>:""
				}


			</div>
		)

	}

}
export default Listjihe;