You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
411 lines
9.1 KiB
411 lines
9.1 KiB
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,
|
|
Radio,
|
|
Checkbox,
|
|
Form,
|
|
Input,
|
|
Select,
|
|
Cascader,
|
|
Col, Row, InputNumber, DatePicker, AutoComplete,Button,Tag
|
|
} from "antd";
|
|
import './../questioncss/questioncom.css';
|
|
const InputGroup = Input.Group;
|
|
const { Option } = Select;
|
|
const options = [
|
|
{
|
|
value: 'zhejiang',
|
|
label: 'Zhejiang',
|
|
children: [
|
|
{
|
|
value: 'hangzhou',
|
|
label: 'Hangzhou',
|
|
children: [
|
|
{
|
|
value: 'xihu',
|
|
label: 'West Lake',
|
|
},
|
|
],
|
|
},
|
|
],
|
|
},
|
|
{
|
|
value: 'jiangsu',
|
|
label: 'Jiangsu',
|
|
children: [
|
|
{
|
|
value: 'nanjing',
|
|
label: 'Nanjing',
|
|
children: [
|
|
{
|
|
value: 'zhonghuamen',
|
|
label: 'Zhong Hua Men',
|
|
},
|
|
],
|
|
},
|
|
],
|
|
},
|
|
];
|
|
class Itembankstop extends Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.contentMdRef = React.createRef()
|
|
this.state = {
|
|
page:1,
|
|
Knowpoints:[],
|
|
rbtx:"",
|
|
}
|
|
}
|
|
//初始化
|
|
componentDidMount(){
|
|
try {
|
|
this.props.getcontentMdRef(this);
|
|
}catch (e) {
|
|
|
|
}
|
|
//console.log("componentDidMount");
|
|
//console.log(this.state);
|
|
//console.log(this.props);
|
|
// let homeworkid = this.props.match.params.homeworkid;
|
|
// let url = "/homework_commons/" + homeworkid + "/end_groups.json";
|
|
// axios.get(url).then((response) => {
|
|
// if (response.status === 200) {
|
|
// this.setState({})
|
|
// }
|
|
// }).catch((error) => {
|
|
// //console.log(error)
|
|
// });()
|
|
// 题型
|
|
|
|
|
|
|
|
|
|
}
|
|
componentDidUpdate(prevProps) {
|
|
// console.log("componentDidUpdate");
|
|
// console.log(prevProps);
|
|
// console.log(this.props.item_banksedit);
|
|
|
|
if(prevProps.item_banksedit !== this.props.item_banksedit){
|
|
this.handleFormtixing(this.props.item_banksedit.item_type);
|
|
this.handleFormLayoutChange(this.props.item_banksedit.difficulty);
|
|
}
|
|
}
|
|
onChange=(e)=> {
|
|
//console.log(`checked = ${e.target.checked}`);
|
|
}
|
|
Getdatas=()=>{
|
|
return this.handleSubmits();
|
|
}
|
|
handleSubmits=()=>{
|
|
var data=[];
|
|
this.props.form.validateFields((err, values) => {
|
|
data=[]
|
|
if (!err) {
|
|
// //console.log("获取的form 数据");
|
|
// //console.log(values);
|
|
data= values;
|
|
}
|
|
});
|
|
|
|
return data;
|
|
|
|
}
|
|
handleSubmit=(e)=>{
|
|
e.preventDefault();
|
|
this.props.form.validateFields((err, values) => {
|
|
if (!err) {
|
|
//console.log("获取的form 数据");
|
|
//console.log(values);
|
|
|
|
}
|
|
|
|
|
|
});
|
|
}
|
|
|
|
handleFormLayoutChange=(value)=>{
|
|
//难度塞选
|
|
//console.log("难度塞选");
|
|
//console.log(value);
|
|
this.props.form.setFieldsValue({
|
|
rbnd:value+"",
|
|
});
|
|
this.setState({
|
|
rbnd:value+"",
|
|
})
|
|
|
|
}
|
|
handleFormkechen=(value)=>{
|
|
//课程
|
|
//console.log("课程");
|
|
//console.log(value);
|
|
this.props.form.setFieldsValue({
|
|
rbkc:value,
|
|
});
|
|
|
|
}
|
|
|
|
handleFormzhishidian=(value)=>{
|
|
//知识点
|
|
//console.log("知识点");
|
|
//console.log(value);
|
|
this.props.form.setFieldsValue({
|
|
rbzsd:value,
|
|
});
|
|
this.setState({
|
|
Knowpoints:value,
|
|
})
|
|
}
|
|
|
|
handleFormtixing=(value)=>{
|
|
//题型
|
|
console.log("题型");
|
|
console.log(value);
|
|
this.setState({
|
|
rbtx:value+"",
|
|
})
|
|
this.props.form.setFieldsValue({
|
|
rbtx:value+"",
|
|
});
|
|
this.props.setitem_type(value);
|
|
}
|
|
preventDefault=(e)=> {
|
|
e.preventDefault();
|
|
//console.log('Clicked! But prevent default.');
|
|
}
|
|
deletesobject=(item,index)=>{
|
|
var tmp = JSON.parse(JSON.stringify(this.state.Knowpoints));
|
|
for(var i=0;i<tmp.length;i++){
|
|
if(i>=index){
|
|
var pos = this.state.Knowpoints.indexOf(tmp[i]);
|
|
this.state.Knowpoints.splice(pos, 1);
|
|
}
|
|
}
|
|
|
|
this.props.form.setFieldsValue({
|
|
rbzsd:this.state.Knowpoints,
|
|
});
|
|
this.setState({
|
|
Knowpoints:this.state.Knowpoints,
|
|
})
|
|
|
|
// //console.log("deletesobject");
|
|
// //console.log(item);
|
|
// //console.log(index);
|
|
// //console.log(this.state.Knowpoints);
|
|
// //console.log("tmp");
|
|
// //console.log(tmp);
|
|
}
|
|
|
|
|
|
|
|
render() {
|
|
let {page}=this.state;
|
|
const { getFieldDecorator } = this.props.form;
|
|
console.log("renderrenderrender");
|
|
console.log(this.props.item_banksedit);
|
|
console.log("renderrenderrendersssss");
|
|
console.log(this.state.rbtx);
|
|
return (
|
|
|
|
<div className=" clearfix educontent Contentquestionbankstyle w100s w1200fpx mt19" >
|
|
<style>
|
|
{
|
|
`
|
|
.ant-form-item{
|
|
margin-bottom: 0px !important;
|
|
|
|
|
|
}
|
|
.ant-form-explain{
|
|
padding-left:0px !important;
|
|
margin-top: 3px !important;
|
|
}
|
|
.ant-select-selection{
|
|
height: 33px !important;
|
|
}
|
|
.ant-input-group{
|
|
width:258px !important;
|
|
}
|
|
.ant-input {
|
|
height: 33px !important;
|
|
}
|
|
|
|
.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):focus-within {
|
|
outline: 0px solid rgba(24, 144, 255, 0.06) !important;
|
|
}
|
|
|
|
`
|
|
}
|
|
</style>
|
|
<div className="h12"></div>
|
|
<Form onSubmit={this.handleSubmit}>
|
|
<Form.Item
|
|
label="课程"
|
|
>
|
|
{getFieldDecorator("rbkc",
|
|
{
|
|
rules: [{ required: true, message: '请选择课程' }],
|
|
}
|
|
)(
|
|
|
|
<InputGroup compact >
|
|
<Select style={{ width: '258px' }} onChange={this.handleFormkechen} placeholder="请选择...">
|
|
|
|
<Option value="Home">Home</Option>
|
|
<Option value="Company">Company</Option>
|
|
</Select>
|
|
</InputGroup>
|
|
)}
|
|
</Form.Item>
|
|
<Form.Item
|
|
label="知识点"
|
|
>
|
|
{getFieldDecorator("rbzsd",
|
|
{
|
|
rules: [{ required: true, message: '请选择知识点' }],
|
|
}
|
|
)(
|
|
<div className="sortinxdirection">
|
|
<InputGroup compact >
|
|
<Cascader style={{ width: '258px' }} defaultValue={this.state.Knowpoints} options={options} onChange={this.handleFormzhishidian} placeholder="请选择..." />
|
|
</InputGroup>
|
|
|
|
|
|
<div className="sortinxdirection" style={{
|
|
height: "33px",
|
|
lineHeight: "28px",
|
|
|
|
}}>
|
|
|
|
{this.state.Knowpoints === undefined ? "" : this.state.Knowpoints.map((object, index) => {
|
|
return (
|
|
<div className="mytags" style={{
|
|
position: "relative",
|
|
}}>
|
|
<p className="w100s stestcen lh32">{object}</p>
|
|
<i className="iconfont icon-roundclose font-25 lg ml7 icondowncolorss" onClick={()=>this.deletesobject(object,index)}></i>
|
|
</div>
|
|
)
|
|
})}
|
|
|
|
</div>
|
|
</div>
|
|
|
|
)}
|
|
</Form.Item>
|
|
|
|
<Form.Item
|
|
label="题型"
|
|
>
|
|
{getFieldDecorator("rbtx",
|
|
{
|
|
rules: [{ required: true, message: '请选择题型'}],
|
|
}
|
|
)(
|
|
<InputGroup compact>
|
|
<Select style={{ width: '258px' }} defaultValue={this.state.rbtx} value={this.state.rbtx} onChange={this.handleFormtixing} placeholder="请选择...">
|
|
<Option value="SINGLE">单选题</Option>
|
|
<Option value="MULTIPLE">多选题</Option>
|
|
<Option value="JUDGMENT">判断题</Option>
|
|
<Option value="PROGRAM">编程题</Option>
|
|
</Select>
|
|
</InputGroup>
|
|
)}
|
|
</Form.Item>
|
|
|
|
|
|
<style>
|
|
{
|
|
`
|
|
.ant-radio-button-wrapper{
|
|
width:106px !important;
|
|
height:33px !important;
|
|
background:#EEEEEE;
|
|
border-radius:17px !important;
|
|
color:#333333;
|
|
text-align: center !important;
|
|
border:0px !important;
|
|
margin-right: 27px !important;
|
|
margin-top: 6px !important;
|
|
|
|
}
|
|
.ant-radio-button-wrapper-checked {
|
|
width: 106px !important;
|
|
height: 33px !important;
|
|
background: #4CACFF !important;
|
|
border-radius: 17px !important;
|
|
text-align: center !important;
|
|
border:0px !important;
|
|
color: #ffffff !important;
|
|
margin-right: 27px !important;
|
|
margin-top: 6px!important;
|
|
|
|
}
|
|
.ant-radio-button-wrapper:not(:first-child)::before{
|
|
border:0px !important;
|
|
width:0px !important;
|
|
}
|
|
|
|
.ant-radio-button-wrapper{
|
|
border:0px !important;
|
|
}
|
|
.ant-radio-group{
|
|
border:0px !important;
|
|
}
|
|
.ant-radio-group label{
|
|
border:0px !important;
|
|
}
|
|
|
|
.ant-radio-group span{
|
|
border:0px !important;
|
|
}
|
|
|
|
ant-radio-button-wrapper:focus-within {
|
|
outline: 0px solid #ffffff;
|
|
}
|
|
|
|
`
|
|
}
|
|
</style>
|
|
<Form.Item label="难度">
|
|
{getFieldDecorator('rbnd',
|
|
{
|
|
rules: [{ required: true, message: '请选择难度'}],
|
|
}
|
|
)(
|
|
|
|
<Radio.Group defaultValue={this.state.rbnd} onChange={this.handleFormLayoutChange} >
|
|
<Radio.Button value="1">简单</Radio.Button>
|
|
<Radio.Button value="2">适中</Radio.Button>
|
|
<Radio.Button value="3">困难</Radio.Button>
|
|
</Radio.Group>,
|
|
)}
|
|
</Form.Item>
|
|
|
|
{/*<Form.Item>*/}
|
|
{/* <Button type="primary" htmlType="submit" className="login-form-button">*/}
|
|
{/* 提交*/}
|
|
{/* </Button>*/}
|
|
{/*</Form.Item>*/}
|
|
|
|
</Form>
|
|
<div className="h20"></div>
|
|
</div>
|
|
)
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
const Itembankstops = Form.create({ name: 'Itembankstops' })(Itembankstop);
|
|
export default Itembankstops;
|