import React, {Component} from "react";
import {Link, NavLink} from 'react-router-dom';
import {WordsBtn, ActionBtn,SnackbarHOC,getImageUrl} from 'educoder';
import axios from 'axios';
import {
	notification,
	Spin,
	Table,
	Pagination,
	Tabs,
	Input,
	Popover
} from "antd";
import './../questioncss/questioncom.css';
import Contentquestionbank from "./Contentquestionbank";
import Listjihe from "./Listjihe";
const { TabPane } = Tabs;
const Search = Input.Search;
class Contentpart extends Component {
	constructor(props) {
		super(props);
		this.state = {
			page:1,

		}
	}
	//初始化
	componentDidMount(){


	}


	setdatafuns=(value)=>{

	}

	setdatafunsval=(e)=>{

	}
	render() {
		let {page}=this.state;
		let {defaultActiveKey}=this.props;
		const content = (
			<div className="questiontypes" style={{
				width:'93px',
				height:'161px',
			}}>
				<p className="questiontype ">单选题</p>
				<p className="questiontypeheng"></p>
				<p className="questiontype ">多选题</p>
				<p className="questiontypeheng"></p>
				<p className="questiontype ">判断题</p>
				<p className="questiontypeheng"></p>
				<p className="questiontype ">编程题</p>
				<p className="questiontypeheng"></p>

			</div>
		);
		const contents = (
			<div  className="questiontypes" style={{
				width:'93px',
				height:'120px',
			}}>
				<p className="questiontype " onClick={()=>this.props.setdifficulty(1)}>简单</p>
				<p className="questiontypeheng"></p>
				<p className="questiontype " onClick={()=>this.props.setdifficulty(2)}>适中</p>
				<p className="questiontypeheng"></p>
				<p className="questiontype " onClick={()=>this.props.setdifficulty(3)}>困难</p>
				<p className="questiontypeheng"></p>
			</div>
		);

		const buttonWidth = 70;
		console.log("Contentpart");
		console.log(this.props);
		return (
			<div className=" clearfix mt5">
				<div className="educontent mt10 pb20 w1200s">
					<div className="w1200ms contentparttit" style={{
						position: "relative",
					}}>
						<style>
							{
								`
								.contentparttit .ant-tabs-nav  .ant-tabs-tab{
								margin: 10px 10px 10px 0 !important;
								}
								.contentparttit .ant-tabs-nav .ant-tabs-ink-bar{
								width: 31px !important;
								left: 14px;
								}
								`
							}
						</style>
						<Tabs defaultActiveKey={defaultActiveKey} onChange={(e)=>this.props.callback(e)}>
							<TabPane tab="公共" key="1">
							</TabPane>
							<TabPane tab="我的" key="0">
							</TabPane>
						</Tabs>

						<div className=" mt19" style={{
							position:"absolute",
							top: "0px",
							right:" 0px",
							paddingRight: "20px",
						}}>
							<style>
								{
									`
									.xaxisreverseorder .ant-input-group-addon{
									width: 60px !important;
									
									}
									
									.xaxisreverseorder .ant-input-lg {
    height: 41px;}
                 
                  .ant-popover{
                       top: 348px !important;
                   }
                   
                   
                  .ant-popover-inner-content {
                   padding:0px !important;
                   }
   
									`
								}
							</style>
						 <div className="xaxisreverseorder">
							 {
								 defaultActiveKey===0||defaultActiveKey==="0"?
									 <a href={'/question/newitem'}>
									 <div className="newbutoon">
										 <p className="newbutoontes" >新增</p>
									 </div>
									 </a>
									 :""
							 }
							 <Popover  placement="bottom"  content={contents} trigger="click" visible={this.props.visiblemys} onVisibleChange={()=>this.props.handleVisibleChange(true)}>
							 <div className=" sortinxdirection mr10">

							 <div className="subjecttit">
								 难度
							 </div>
								 <i className="iconfont icon-sanjiaoxing-down font-12 lg ml7 icondowncolor"></i>
							 </div>
							 </Popover>



							 <Popover  placement="bottom" content={content} trigger="click">
							 <div className="sortinxdirection mr40">
							 <div className="subjecttit">
								 题型
							 </div>
								 <i className="iconfont icon-sanjiaoxing-down font-12 lg ml7 icondowncolor"></i>
							 </div>
							 </Popover>
							 <Search
								 style={{ width: "347px",marginRight:"60px",}}
								 placeholder="请输入题目名称、内容"
								 enterButton
								 size="large"
								 onInput={(e)=>this.setdatafunsval(e)}
								 onSearch={ (value)=>this.setdatafuns(value)} />
						 </div>

						</div>
					</div>
					{/*内容*/}
					<div className=" w100s mb10">
					{
						defaultActiveKey===1||defaultActiveKey==="1"?
							<Contentquestionbank {...this.props} {...this.state} ></Contentquestionbank>
							:""
					}
					{
						defaultActiveKey===0||defaultActiveKey==="0"?
							<Contentquestionbank {...this.props} {...this.state} ></Contentquestionbank>
							:""
					}
					</div>
					{/*列表集合*/}
					<div className=" w100s">
						{this.props.Contentdata.items === undefined ||this.props.Contentdata.items === null? "" : this.props.Contentdata.items.map((object, index) => {
							return (
								<Listjihe {...this.state} {...this.props} items={object} showmodels={()=>this.props.showmodels()} showmodelysl={()=>this.props.showmodelysl()}>

								</Listjihe>
							)
						})}



					</div>












				</div>


			</div>
		)

	}



}
export default Contentpart