educoder/public/react/src/modules/question/component/Listjihe.js

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:"简单",
			chakanjiexibool:false,
		}
	}
	//初始化
	componentDidMount(){


	}

	chakanjiexibool=()=>{
		if(this.state.chakanjiexibool===true){
			this.setState({
				chakanjiexibool:false
			})
		}else{
			this.setState({
				chakanjiexibool:true
			})
		}

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

		this.props.getitem_basketss(id);
	}





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

		////console.log("Listjihe");
		////console.log(this.props);
		return (
			<div className={chakanjiexibool===true?"w100s borderwds283  pd20 mb20":"w100s borderwds  pd20 mb20"}>
				{/*顶部*/}
				<div className="w100s sortinxdirection">
					<div className="listjihetixingstitsy">
						{
							this.props.listjihe+1
						}
					</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>
									:""
						  }

					</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>
								:
								<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>
									<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>
									<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.chakanjiexibool()}>
									<i className="iconfont icon-jiexi font-17 lg ml7 lh30 icontianjiadaohangcolors mr5"></i>
									查看解析</p>
						}



					</div>
				</div>
				{
					chakanjiexibool===true?<div>
						<div className="w100s questiontypeheng mt23">

						</div>
						<div className=" sortinxdirection mt15 yldxtit" >
							<p className=" testfondex yldxtit"
								 style={{wordBreak: "break-word"}} dangerouslySetInnerHTML={{__html: markdownToHTML("答案："+items.analysis).replace(/▁/g, "▁▁▁")}}
							>
							</p>
						</div>
						<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;