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,
	Drawer,
	Input
} from "antd";
import Headplugselection from  "./component/Headplugselection";
import QuestionModal from  "./component/QuestionModal";
import Contentpart from "./component/Contentpart";
import {TPMIndexHOC} from "../tpm/TPMIndexHOC";
import NoneData from './component/NoneData';
import './questioncss/questioncom.css';
import SiderBar from "../tpm/SiderBar";
class Question extends Component {
	constructor(props) {
		super(props);
		this.state = {
        page:1,
			  limit:20,
		    count:50,
			defaultActiveKey:1,
			Headertop:"",
			Footerdown:"",
			visible: false,
			placement: 'right',
			modalsType:false,
			titilesm:"设为公开后，所有成员均可使用试题",
			titiless:"是否设置为公开？",
			titbool:false,
			Contentdata:[],
			difficulty:null,
		}

	}
	//初始化
	componentDidMount(){
		let {defaultActiveKey}= this.state;
    var data={
			public:defaultActiveKey
		};
		this.getdata(data);

		let url=`/users/get_navigation_info.json`;
		axios.get(url, {

		}).then((response) => {
			// //console.log("开始请求/get_navigation_info.json");
			// //console.log(response);
			if(response!=undefined){
				if(response.status===200){
					this.setState({
						Headertop:response.data.top,
						Footerdown:response.data.down
					})
				}
			}
		});
	}

	callback=(key)=>{
		this.setState({
			defaultActiveKey:key,
		})
		var data={
			public:key
		};
		this.getdata(data);

	}

	getdata =(data)=>{
		const url=`/item_banks.json`;
		axios.get((url),{params:data}).then((response) => {
			if(response===null||response===undefined){

				return
			}
			if (response.data.status === 403||response.data.status === 401||response.data.status === 500) {

			}else{

			}
			//console.log("item_banks");
			//console.log(response);
			this.setState({
				Contentdata:response.data
			})
		}).catch((error) => {
			//console.log(error)

		});
	}

	paginationonChange=()=>{

	}
	showDrawer = () => {
		this.setState({
			visible: true,
		});
	};

	onClose = () => {
		this.setState({
			visible: false,
		});
	};

	onChange = e => {
		this.setState({
			placement: e.target.value,
		});
	};

	getContainer = () => {
		return this.container;
	};
	saveContainer = container => {
		this.container = container;
	};

	showmodels=()=>{
	  this.setState({
			modalsType:true,
			titilesm:"设为公开后，所有成员均可使用试题",
			titiless:"是否设置为公开？",
			titbool:false
		})
	};
	showmodelysl=()=>{
		this.setState({
			modalsType:true,
			titilesm:"确认删除后，无法撤销",
			titiless:"是否确认删除？",
			titbool:false
		})
	};



	modalCancel=()=>{
   this.setState({
		 modalsType:false
	 })
	}
	setDownload=()=>{
		this.setState({
			modalsType:false
		})
	}

	setdifficulty=(difficulty)=>{
		this.setState({
			difficulty:difficulty,
		})

		var data={
			public:this.state.defaultActiveKey,
			difficulty:difficulty
		};
		this.getdata(data);
	}
	render() {
		let {page,limit,count,Headertop,visible,placement,modalsType}=this.state;
		return (
			<div className="newMain clearfix" ref={this.saveContainer}>
				<QuestionModal {...this.props}{...this.state} modalsType={modalsType} modalCancel={()=>this.modalCancel()} setDownload={()=>this.setDownload()}></QuestionModal>
				<SiderBar
					{...this.props}
					{...this.state}
					showDrawer={()=>this.showDrawer()}
					Headertop={Headertop}/>
				{/*顶部*/}
				<Headplugselection ></Headplugselection>
				{/*头部*/}
        <Contentpart {...this.state} {...this.props}
										 setdifficulty={(e)=>this.setdifficulty(e)}
										 showmodels={()=>this.showmodels()}
										 showmodelysl={()=>this.showmodelysl()}
										 callback={(e)=>this.callback(e)}></Contentpart>
				{/*分页*/}
				{/*<div className="clearfix mt5">*/}
				{/*<div className="educontent mt10 pb20 w1200s">*/}
				{/*	fenye*/}
				<div className="mb30 clearfix educontent mt40 intermediatecenter">
					<Pagination showQuickJumper current={page} onChange={this.paginationonChange}
											pageSize={limit}
											total={count}></Pagination>
				</div>

				{/*抽屉效果*/}
				<style>
					{
						`
						.ant-drawer-content-wrapper{
						width: 235px;
						}
						.ant-drawer-body{
						   height: 100%;
						   background:rgba(234,234,234,1);
						}
						`
					}
				</style>
				<Drawer
					getContainer={this.getContainer}
					placement={placement}
					closable={false}
					onClose={()=>this.onClose()}
					visible={visible}
				>
					{/*<div className="mt25 mb26">*/}
					{/*	<Input placeholder="未命名试卷" />*/}
					{/*</div>*/}
					{/*<div className="sortinxdirection">*/}
					{/*	<p className="w50s intermediatecenterysls sortinxdirection font-14">单选题</p>*/}
					{/*	<p className="w50s intermediatecenterysls xaxisreverseorder"><i className="iconfont icon-shanchu1 font-14 lg  lh30 icondrawercolor "></i></p>*/}
					{/*</div>*/}

					{/*<div className="intermediatecenter verticallayout mt42">*/}
          {/*      <div className="drawerbutton">*/}
          {/*       试卷预览*/}
					{/*			</div>*/}
					{/*</div>*/}
					<div className="drawernonedatadiv intermediatecenter">
						<NoneData></NoneData>

					</div>
				</Drawer>


			</div>
		)

	}



}
export default SnackbarHOC() (TPMIndexHOC  ( Question ));