|
|
|
|
@ -4,91 +4,95 @@ import { dictionary } from "api/dict/index"; |
|
|
|
|
import { add, findIndustry } from 'api/question'; |
|
|
|
|
import * as XLSX from 'xlsx'; |
|
|
|
|
import { saveAs } from 'file-saver'; |
|
|
|
|
import { CheckboxValueType } from 'antd/lib/checkbox/Group'; |
|
|
|
|
|
|
|
|
|
const { Option } = Select; |
|
|
|
|
const { Option} = Select; |
|
|
|
|
|
|
|
|
|
// 定义单个试题的状态接口
|
|
|
|
|
interface QuestionState { |
|
|
|
|
questionTypes: string; |
|
|
|
|
industryId: string | null; |
|
|
|
|
serviceTypeId: string | null; |
|
|
|
|
industryId: string; |
|
|
|
|
serviceTypeId: string; |
|
|
|
|
questionContent: string; |
|
|
|
|
answerOptions: { [key: string]: string }; |
|
|
|
|
answer: string | null; |
|
|
|
|
optionA: string; |
|
|
|
|
optionB: string; |
|
|
|
|
optionC: string; |
|
|
|
|
optionD: string; |
|
|
|
|
answer: string; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 定义组件的状态接口
|
|
|
|
|
interface States { |
|
|
|
|
industryDict: any; |
|
|
|
|
serviceTypeDict: any; |
|
|
|
|
isLoading: boolean; |
|
|
|
|
questions: QuestionState[]; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
class QuestionAdd extends Component<any, States> { |
|
|
|
|
formRef: any; |
|
|
|
|
fileInputRef: any; |
|
|
|
|
|
|
|
|
|
constructor(props: any) { |
|
|
|
|
super(props); |
|
|
|
|
this.formRef = React.createRef(); |
|
|
|
|
this.fileInputRef = React.createRef(); |
|
|
|
|
this.state = { |
|
|
|
|
industryDict: undefined, |
|
|
|
|
serviceTypeDict: undefined, |
|
|
|
|
isLoading: false, |
|
|
|
|
industryDict: [], |
|
|
|
|
serviceTypeDict: [], |
|
|
|
|
questions: [ |
|
|
|
|
{ |
|
|
|
|
questionTypes: '1', |
|
|
|
|
industryId: '', |
|
|
|
|
serviceTypeId: '', |
|
|
|
|
questionContent: '', |
|
|
|
|
answerOptions: { A: '', B: '', C: '', D: ''}, |
|
|
|
|
answer: null, |
|
|
|
|
industryId: null, |
|
|
|
|
serviceTypeId: null |
|
|
|
|
optionA: '', |
|
|
|
|
optionB: '', |
|
|
|
|
optionC: '', |
|
|
|
|
optionD: '', |
|
|
|
|
answer: '' |
|
|
|
|
} |
|
|
|
|
] |
|
|
|
|
}; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 初期
|
|
|
|
|
componentDidMount() { |
|
|
|
|
this.getDict(); |
|
|
|
|
this.findIndustry(); |
|
|
|
|
this.findDict(); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 字典
|
|
|
|
|
getDict() { |
|
|
|
|
// 服务类型
|
|
|
|
|
dictionary('serviceTypeDict').then((res) => { |
|
|
|
|
findDict() { |
|
|
|
|
// 监管行业
|
|
|
|
|
findIndustry() |
|
|
|
|
.then((res: any) => { |
|
|
|
|
if (res.data) { |
|
|
|
|
this.setState({ serviceTypeDict: res.data }); |
|
|
|
|
this.setState({ industryDict: res.data }); |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
.catch(() => { |
|
|
|
|
message.error('获取监管行业字典数据失败，请稍后重试'); |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 行业
|
|
|
|
|
findIndustry() { |
|
|
|
|
// 监管行业
|
|
|
|
|
findIndustry().then((res) => { |
|
|
|
|
// AQ服务类型
|
|
|
|
|
dictionary('serviceTypeDict') |
|
|
|
|
.then((res) => { |
|
|
|
|
if (res.data) { |
|
|
|
|
this.setState({ industryDict: res.data }); |
|
|
|
|
this.setState({ serviceTypeDict: res.data }); |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
.catch(() => { |
|
|
|
|
message.error('获取AQ服务类型字典数据失败，请稍后重试'); |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 题型
|
|
|
|
|
// 题型切换
|
|
|
|
|
handleQuestionTypeChange = (index: number, value: string) => { |
|
|
|
|
this.setState((prevState) => { |
|
|
|
|
const questions = [...prevState.questions]; |
|
|
|
|
questions[index].questionTypes = value; |
|
|
|
|
questions[index].answer = null; |
|
|
|
|
questions[index].answer = ''; |
|
|
|
|
return { |
|
|
|
|
questions |
|
|
|
|
}; |
|
|
|
|
}); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
// 单选框
|
|
|
|
|
// 单选框Change
|
|
|
|
|
handleRadioChange = (index: number, value: string) => { |
|
|
|
|
this.setState((prevState) => { |
|
|
|
|
const questions = [...prevState.questions]; |
|
|
|
|
@ -99,33 +103,13 @@ class QuestionAdd extends Component<any, States> { |
|
|
|
|
}); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
// 多选框
|
|
|
|
|
handleCheckboxChange = (index: number, type: string, values: (string | number | boolean)[] | null) => { |
|
|
|
|
// 多选框Change
|
|
|
|
|
handleCheckboxChange = (index: number, values: CheckboxValueType[]) => { |
|
|
|
|
this.setState((prevState) => { |
|
|
|
|
const questions = [...prevState.questions]; |
|
|
|
|
const currentAnswer = questions[index].answer || ''; |
|
|
|
|
const currentSelectedArray = currentAnswer? currentAnswer.split('，') : []; |
|
|
|
|
if (!values || values.length === 0) { |
|
|
|
|
const newSelectedArray = currentSelectedArray.filter(val => val!== type); |
|
|
|
|
newSelectedArray.sort(); |
|
|
|
|
questions[index].answer = newSelectedArray.join('，'); |
|
|
|
|
} else { |
|
|
|
|
const stringValues = values.map((val) => String(val)); |
|
|
|
|
const newSelectedArray = Array.from(new Set([...currentSelectedArray, ...stringValues])); |
|
|
|
|
newSelectedArray.sort(); |
|
|
|
|
questions[index].answer = newSelectedArray.join('，'); |
|
|
|
|
} |
|
|
|
|
return { |
|
|
|
|
questions |
|
|
|
|
}; |
|
|
|
|
}); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
// 答案
|
|
|
|
|
handleAnswerOptionChange = (index: number, option: string, value: string) => { |
|
|
|
|
this.setState((prevState) => { |
|
|
|
|
const questions = [...prevState.questions]; |
|
|
|
|
questions[index].answerOptions[option] = value; |
|
|
|
|
stringValues.sort(); |
|
|
|
|
questions[index].answer = stringValues.join('，'); |
|
|
|
|
return { |
|
|
|
|
questions |
|
|
|
|
}; |
|
|
|
|
@ -139,12 +123,14 @@ class QuestionAdd extends Component<any, States> { |
|
|
|
|
...prevState.questions, |
|
|
|
|
{ |
|
|
|
|
questionTypes: '1', |
|
|
|
|
industryId: '', |
|
|
|
|
serviceTypeId: '', |
|
|
|
|
questionContent: '', |
|
|
|
|
answerOptions: { A: '', B: '', C: '', D: ''}, |
|
|
|
|
answerDisabled: false, |
|
|
|
|
answer: null, |
|
|
|
|
industryId: null, |
|
|
|
|
serviceTypeId: null |
|
|
|
|
optionA: '', |
|
|
|
|
optionB: '', |
|
|
|
|
optionC: '', |
|
|
|
|
optionD: '', |
|
|
|
|
answer: '' |
|
|
|
|
} |
|
|
|
|
] |
|
|
|
|
})); |
|
|
|
|
@ -163,36 +149,39 @@ class QuestionAdd extends Component<any, States> { |
|
|
|
|
|
|
|
|
|
// 处理表单提交
|
|
|
|
|
handleSubmit = () => { |
|
|
|
|
this.setState({ isLoading: true }); |
|
|
|
|
this.formRef.current.validateFields().then((values: Record<string, any>) => { |
|
|
|
|
this.formRef.current.validateFields().then((values: any) => { |
|
|
|
|
const questions = this.state.questions.map((question, index) => { |
|
|
|
|
const industryId = values[`industryId_${index}`]; |
|
|
|
|
const serviceTypeId = values[`serviceTypeId_${index}`]; |
|
|
|
|
const questionContent = values[`questionContent_${index}`]; |
|
|
|
|
const optionA = values[`optionA_${index}`] |
|
|
|
|
const optionB = values[`optionB_${index}`]; |
|
|
|
|
const optionC = values[`optionC_${index}`]; |
|
|
|
|
const optionD = values[`optionD_${index}`]; |
|
|
|
|
return { |
|
|
|
|
...question, |
|
|
|
|
industryId, |
|
|
|
|
serviceTypeId, |
|
|
|
|
questionContent |
|
|
|
|
questionContent, |
|
|
|
|
optionA, |
|
|
|
|
optionB, |
|
|
|
|
optionC, |
|
|
|
|
optionD, |
|
|
|
|
}; |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
add(questions).then((res) => { |
|
|
|
|
const count = res.data; |
|
|
|
|
if (count>0) { |
|
|
|
|
message.success(`成功新增 ${count} 条试题`); |
|
|
|
|
this.setState({ isLoading: false }); |
|
|
|
|
if (count > 0) { |
|
|
|
|
message.success(`新增成功`); |
|
|
|
|
this.props.history.push('/questionList'); |
|
|
|
|
} else { |
|
|
|
|
message.error('新增试题失败，请稍后重试'); |
|
|
|
|
this.setState({ isLoading: false }); |
|
|
|
|
} |
|
|
|
|
}).catch(() => { |
|
|
|
|
message.error('新增试题时发生错误，请检查'); |
|
|
|
|
this.setState({ isLoading: false }); |
|
|
|
|
}); |
|
|
|
|
}).catch(() => { |
|
|
|
|
this.setState({ isLoading: false }); |
|
|
|
|
}); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
@ -222,14 +211,12 @@ class QuestionAdd extends Component<any, States> { |
|
|
|
|
const question: QuestionState = { |
|
|
|
|
questionTypes: String(row[0]), |
|
|
|
|
industryId: String(row[1]), |
|
|
|
|
serviceTypeId: String(row[2]).trim().toLowerCase(), |
|
|
|
|
serviceTypeId: String(row[2]), |
|
|
|
|
questionContent: String(row[3]), |
|
|
|
|
answerOptions: { |
|
|
|
|
A: String(row[4]), |
|
|
|
|
B: String(row[5]), |
|
|
|
|
C: String(row[6]), |
|
|
|
|
D: String(row[7]) |
|
|
|
|
}, |
|
|
|
|
optionA: String(row[4]), |
|
|
|
|
optionB: String(row[5]), |
|
|
|
|
optionC: String(row[6]), |
|
|
|
|
optionD: String(row[7]), |
|
|
|
|
answer: String(row[8]) |
|
|
|
|
}; |
|
|
|
|
return question; |
|
|
|
|
@ -237,14 +224,15 @@ class QuestionAdd extends Component<any, States> { |
|
|
|
|
this.setState({ questions: newQuestions }, () => { |
|
|
|
|
const formValues = {}; |
|
|
|
|
newQuestions.forEach((question, index) => { |
|
|
|
|
formValues[`questionContent_${index}`] = question.questionContent; |
|
|
|
|
formValues[`questionTypes_${index}`] = question.questionTypes; |
|
|
|
|
formValues[`industryId_${index}`] = question.industryId; |
|
|
|
|
formValues[`serviceTypeId_${index}`] = question.serviceTypeId; |
|
|
|
|
formValues[`questionContent_${index}`] = question.questionContent; |
|
|
|
|
formValues[`answer_${index}`] = question.answer; |
|
|
|
|
formValues[`answerOption_A_${index}`] = question.answerOptions.A; |
|
|
|
|
formValues[`answerOption_B_${index}`] = question.answerOptions.B; |
|
|
|
|
formValues[`answerOption_C_${index}`] = question.answerOptions.C; |
|
|
|
|
formValues[`answerOption_D_${index}`] = question.answerOptions.D; |
|
|
|
|
formValues[`optionA_${index}`] = question.optionA; |
|
|
|
|
formValues[`optionB_${index}`] = question.optionB; |
|
|
|
|
formValues[`optionC_${index}`] = question.optionC; |
|
|
|
|
formValues[`optionD_${index}`] = question.optionD; |
|
|
|
|
}); |
|
|
|
|
this.formRef.current.setFieldsValue(formValues); |
|
|
|
|
}); |
|
|
|
|
@ -259,20 +247,20 @@ class QuestionAdd extends Component<any, States> { |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
render() { |
|
|
|
|
const { industryDict, serviceTypeDict, questions, isLoading } = this.state; |
|
|
|
|
const { industryDict, serviceTypeDict, questions } = this.state; |
|
|
|
|
// 使用 this.props.history 进行页面跳转
|
|
|
|
|
const handleListQuestion = () => { |
|
|
|
|
this.props.history.push('/questionList'); |
|
|
|
|
}; |
|
|
|
|
return ( |
|
|
|
|
<div className="container" > |
|
|
|
|
<div style={{ textAlign: 'right'}}> |
|
|
|
|
<Button type="default" style={{ marginRight: 10 }} onClick={this.downloadTemplate}>下载模版</Button> |
|
|
|
|
<div className="container"> |
|
|
|
|
<div style={{textAlign: 'right'}}> |
|
|
|
|
<Button type="default" style={{marginRight: 10}} onClick={this.downloadTemplate}>下载模版</Button> |
|
|
|
|
<Button type="default" onClick={this.handleImportClick}>一键导入</Button> |
|
|
|
|
<input |
|
|
|
|
type="file" |
|
|
|
|
ref={this.fileInputRef} |
|
|
|
|
style={{ display: 'none' }} |
|
|
|
|
style={{display: 'none'}} |
|
|
|
|
accept=".xlsx,.xls" |
|
|
|
|
onChange={this.handleFileChange} |
|
|
|
|
/> |
|
|
|
|
@ -280,14 +268,12 @@ class QuestionAdd extends Component<any, States> { |
|
|
|
|
<Form |
|
|
|
|
ref={this.formRef} |
|
|
|
|
layout="inline" |
|
|
|
|
className="ant-bg-light" |
|
|
|
|
> |
|
|
|
|
{questions.map((question, index) => ( |
|
|
|
|
<div key={index} style={{ marginBottom: 30 }}> |
|
|
|
|
<div style={{ display: 'flex' }}> |
|
|
|
|
<Form.Item> |
|
|
|
|
<div key={index} style={{marginBottom: 30}}> |
|
|
|
|
<div style={{display: 'flex'}}> |
|
|
|
|
<Form.Item name={`questionTypes_${index}`}> |
|
|
|
|
<Radio.Group |
|
|
|
|
value={question.questionTypes} |
|
|
|
|
onChange={(e) => this.handleQuestionTypeChange(index, e.target.value)}> |
|
|
|
|
<Radio.Button value="1">单选题</Radio.Button> |
|
|
|
|
<Radio.Button value="2">多选题</Radio.Button> |
|
|
|
|
@ -296,14 +282,13 @@ class QuestionAdd extends Component<any, States> { |
|
|
|
|
<Form.Item |
|
|
|
|
label="监管行业：" |
|
|
|
|
name={`industryId_${index}`} |
|
|
|
|
rules={[{ required: true, message: '请选择监管行业' }]} |
|
|
|
|
rules={[{required: true, message: '请选择监管行业'}]} |
|
|
|
|
> |
|
|
|
|
<Select placeholder="请选择监管行业" |
|
|
|
|
style={{ width: 240 }} |
|
|
|
|
allowClear |
|
|
|
|
value={question.industryId}> |
|
|
|
|
style={{width: 240}} |
|
|
|
|
allowClear> |
|
|
|
|
{ |
|
|
|
|
industryDict && industryDict.length > 0? |
|
|
|
|
industryDict && industryDict.length > 0 ? |
|
|
|
|
(() => { |
|
|
|
|
let rows = []; |
|
|
|
|
for (let i = 0; i < industryDict.length; i++) { |
|
|
|
|
@ -322,20 +307,20 @@ class QuestionAdd extends Component<any, States> { |
|
|
|
|
<Form.Item |
|
|
|
|
label="AQ服务类型：" |
|
|
|
|
name={`serviceTypeId_${index}`} |
|
|
|
|
rules={[{ required: true, message: '请选择AQ服务类型' }]} |
|
|
|
|
rules={[{required: true, message: '请选择AQ服务类型'}]} |
|
|
|
|
> |
|
|
|
|
<Select placeholder="请选择AQ服务类型" |
|
|
|
|
style={{ width: 240 }} |
|
|
|
|
allowClear |
|
|
|
|
value={question.serviceTypeId}> |
|
|
|
|
style={{width: 240}} |
|
|
|
|
allowClear> |
|
|
|
|
{ |
|
|
|
|
serviceTypeDict && serviceTypeDict.length > 0? |
|
|
|
|
serviceTypeDict && serviceTypeDict.length > 0 ? |
|
|
|
|
(() => { |
|
|
|
|
let rows = []; |
|
|
|
|
for (let i = 0; i < serviceTypeDict.length; i++) { |
|
|
|
|
const item = serviceTypeDict[i]; |
|
|
|
|
rows.push( |
|
|
|
|
<Option value={String(item.dictKey).trim().toLowerCase()}>{item.dictValue}</Option> |
|
|
|
|
<Option |
|
|
|
|
value={String(item.dictKey)}>{item.dictValue}</Option> |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|
return rows; |
|
|
|
|
@ -346,143 +331,105 @@ class QuestionAdd extends Component<any, States> { |
|
|
|
|
</Select> |
|
|
|
|
</Form.Item> |
|
|
|
|
<Form.Item> |
|
|
|
|
{index > 0 && (<Button type="link" onClick={() => this.deleteQuestion(index)}>X</Button>)} |
|
|
|
|
{index > 0 && ( |
|
|
|
|
<Button type="link" onClick={() => this.deleteQuestion(index)}>X</Button>)} |
|
|
|
|
</Form.Item> |
|
|
|
|
</div> |
|
|
|
|
<div style={{display: 'flex'}}> |
|
|
|
|
<Form.Item |
|
|
|
|
label="题干：" |
|
|
|
|
name={`questionContent_${index}`} |
|
|
|
|
style={{marginTop: 10 }} |
|
|
|
|
rules={[{ required: true, message: '请输入题干内容' }]} |
|
|
|
|
style={{marginTop: 10}} |
|
|
|
|
rules={[{required: true, message: '请输入题干内容'}]} |
|
|
|
|
> |
|
|
|
|
<Input.TextArea |
|
|
|
|
placeholder="请输入题干内容" |
|
|
|
|
value={question.questionContent} |
|
|
|
|
style={{ width: 1100, height: 60 }} |
|
|
|
|
style={{width: 1100, height: 60}} |
|
|
|
|
/> |
|
|
|
|
</Form.Item> |
|
|
|
|
<Form.Item |
|
|
|
|
style={{marginTop: 10, marginLeft: 40}} |
|
|
|
|
> |
|
|
|
|
<div> |
|
|
|
|
<div style={{ display: 'flex' }}> |
|
|
|
|
{question.questionTypes === '1'? ( |
|
|
|
|
</div> |
|
|
|
|
<div style={{marginTop: 10, marginLeft: 40}}> |
|
|
|
|
<div style={{display: 'flex'}}> |
|
|
|
|
{question.questionTypes === '1' ? ( |
|
|
|
|
<Form.Item> |
|
|
|
|
<Radio.Group |
|
|
|
|
name={`answer_${index}`} |
|
|
|
|
value={question.answer} |
|
|
|
|
onChange={(e) => this.handleRadioChange(index, e.target.value)} |
|
|
|
|
> |
|
|
|
|
<div style={{display: 'flex'}}> |
|
|
|
|
<Form.Item rules={[{required: true, message: '请选择选项'}]}> |
|
|
|
|
<Radio value="A">A</Radio> |
|
|
|
|
<Input |
|
|
|
|
placeholder="请输入答案" |
|
|
|
|
value={question.answerOptions.A} |
|
|
|
|
style={{ width: 490}} |
|
|
|
|
onChange={(e) => this.handleAnswerOptionChange(index, 'A', e.target.value)} |
|
|
|
|
/> |
|
|
|
|
</Radio.Group> |
|
|
|
|
) : ( |
|
|
|
|
<Checkbox.Group |
|
|
|
|
value={question.answer? String(question.answer || '').split('，') : []} |
|
|
|
|
onChange={(values) => this.handleCheckboxChange(index,'A', values,)}> |
|
|
|
|
<Checkbox value="A">A</Checkbox> |
|
|
|
|
<Input |
|
|
|
|
placeholder="请输入答案" |
|
|
|
|
value={question.answerOptions.A} |
|
|
|
|
style={{ width: 500}} |
|
|
|
|
onChange={(e) => this.handleAnswerOptionChange(index, 'A', e.target.value)} |
|
|
|
|
/> |
|
|
|
|
</Checkbox.Group> |
|
|
|
|
)} |
|
|
|
|
{question.questionTypes === '1'? ( |
|
|
|
|
<Radio.Group |
|
|
|
|
value={question.answer} |
|
|
|
|
onChange={(e) => this.handleRadioChange(index, e.target.value)} |
|
|
|
|
style={{ marginLeft: 20 }} |
|
|
|
|
> |
|
|
|
|
</Form.Item> |
|
|
|
|
<Form.Item name={`optionA_${index}`} rules={[{required: true, message: '请输入答案A'}]}> |
|
|
|
|
<Input placeholder="请输入答案" style={{width: 490}}/> |
|
|
|
|
</Form.Item> |
|
|
|
|
<Form.Item> |
|
|
|
|
<Radio value="B">B</Radio> |
|
|
|
|
<Input |
|
|
|
|
placeholder="请输入答案" |
|
|
|
|
value={question.answerOptions.B} |
|
|
|
|
style={{ width: 490}} |
|
|
|
|
onChange={(e) => this.handleAnswerOptionChange(index, 'B', e.target.value)} |
|
|
|
|
/> |
|
|
|
|
</Radio.Group> |
|
|
|
|
) : ( |
|
|
|
|
<Checkbox.Group |
|
|
|
|
style={{ marginLeft: 20 }} |
|
|
|
|
value={question.answer? String(question.answer || '').split('，') : []} |
|
|
|
|
onChange={(values) => this.handleCheckboxChange(index,'B',values)}> |
|
|
|
|
<Checkbox value="B">B</Checkbox> |
|
|
|
|
<Input |
|
|
|
|
placeholder="请输入答案" |
|
|
|
|
value={question.answerOptions.B} |
|
|
|
|
style={{ width: 500}} |
|
|
|
|
onChange={(e) => this.handleAnswerOptionChange(index, 'B', e.target.value)} |
|
|
|
|
/> |
|
|
|
|
</Checkbox.Group> |
|
|
|
|
)} |
|
|
|
|
</Form.Item> |
|
|
|
|
<Form.Item name={`optionB_${index}`} rules={[{required: true, message: '请输入答案B'}]}> |
|
|
|
|
<Input placeholder="请输入答案" style={{width: 490}}/> |
|
|
|
|
</Form.Item> |
|
|
|
|
</div> |
|
|
|
|
<div style={{ display: 'flex', marginTop: 10 }}> |
|
|
|
|
{question.questionTypes === '1'? ( |
|
|
|
|
<Radio.Group |
|
|
|
|
value={question.answer} |
|
|
|
|
onChange={(e) => this.handleRadioChange(index, e.target.value)} |
|
|
|
|
> |
|
|
|
|
<div style={{display: 'flex', marginTop: 10}}> |
|
|
|
|
<Form.Item> |
|
|
|
|
<Radio value="C">C</Radio> |
|
|
|
|
<Input |
|
|
|
|
placeholder="请输入答案" |
|
|
|
|
value={question.answerOptions.C} |
|
|
|
|
style={{ width: 490}} |
|
|
|
|
onChange={(e) => this.handleAnswerOptionChange(index, 'C', e.target.value)} |
|
|
|
|
/> |
|
|
|
|
</Radio.Group> |
|
|
|
|
) : ( |
|
|
|
|
<Checkbox.Group |
|
|
|
|
value={question.answer? String(question.answer || '').split('，') : []} |
|
|
|
|
onChange={(values) => this.handleCheckboxChange(index,'C', values)}> |
|
|
|
|
<Checkbox value="C">C</Checkbox> |
|
|
|
|
<Input |
|
|
|
|
placeholder="请输入答案" |
|
|
|
|
value={question.answerOptions.C} |
|
|
|
|
style={{ width: 500}} |
|
|
|
|
onChange={(e) => this.handleAnswerOptionChange(index, 'C', e.target.value)} |
|
|
|
|
/> |
|
|
|
|
</Checkbox.Group> |
|
|
|
|
)} |
|
|
|
|
{question.questionTypes === '1'? ( |
|
|
|
|
<Radio.Group |
|
|
|
|
value={question.answer} |
|
|
|
|
onChange={(e) => this.handleRadioChange(index, e.target.value)} |
|
|
|
|
style={{ marginLeft: 20 }} |
|
|
|
|
> |
|
|
|
|
</Form.Item> |
|
|
|
|
<Form.Item name={`optionC_${index}`} rules={[{required: true, message: '请输入答案C'}]}> |
|
|
|
|
<Input placeholder="请输入答案" style={{width: 490}}/> |
|
|
|
|
</Form.Item> |
|
|
|
|
<Form.Item> |
|
|
|
|
<Radio value="D">D</Radio> |
|
|
|
|
<Input |
|
|
|
|
placeholder="请输入答案" |
|
|
|
|
value={question.answerOptions.D} |
|
|
|
|
style={{ width: 490}} |
|
|
|
|
onChange={(e) => this.handleAnswerOptionChange(index, 'D', e.target.value)} |
|
|
|
|
/> |
|
|
|
|
</Form.Item> |
|
|
|
|
<Form.Item name={`optionD_${index}`} rules={[{required: true, message: '请输入答案D'}]}> |
|
|
|
|
<Input placeholder="请输入答案" style={{width: 490}}/> |
|
|
|
|
</Form.Item> |
|
|
|
|
</div> |
|
|
|
|
</Radio.Group> |
|
|
|
|
</Form.Item> |
|
|
|
|
|
|
|
|
|
) : ( |
|
|
|
|
<Checkbox.Group |
|
|
|
|
style={{ marginLeft: 20 }} |
|
|
|
|
value={question.answer? String(question.answer || '').split('，') : []} |
|
|
|
|
onChange={(values) => this.handleCheckboxChange(index,'D',values)}> |
|
|
|
|
name={`answer_${index}`} |
|
|
|
|
value={question.answer ? String(question.answer || '').split('，') : []} |
|
|
|
|
onChange={(values) => this.handleCheckboxChange(index, values)} |
|
|
|
|
> |
|
|
|
|
<div style={{display: 'flex'}}> |
|
|
|
|
<Form.Item> |
|
|
|
|
<Checkbox value="A">A</Checkbox> |
|
|
|
|
</Form.Item> |
|
|
|
|
<Form.Item name={`optionA_${index}`} rules={[{required: true, message: '请输入答案A'}]}> |
|
|
|
|
<Input placeholder="请输入答案" style={{width: 490}}/> |
|
|
|
|
</Form.Item> |
|
|
|
|
<Form.Item> |
|
|
|
|
<Checkbox value="B">B</Checkbox> |
|
|
|
|
</Form.Item> |
|
|
|
|
<Form.Item name={`optionB_${index}`} rules={[{required: true, message: '请输入答案B'}]}> |
|
|
|
|
<Input placeholder="请输入答案" style={{width: 490}}/> |
|
|
|
|
</Form.Item> |
|
|
|
|
</div> |
|
|
|
|
<div style={{display: 'flex', marginTop: 10}}> |
|
|
|
|
<Form.Item> |
|
|
|
|
<Checkbox value="C">C</Checkbox> |
|
|
|
|
</Form.Item> |
|
|
|
|
<Form.Item name={`optionC_${index}`} rules={[{required: true, message: '请输入答案C'}]}> |
|
|
|
|
<Input placeholder="请输入答案" style={{width: 490}}/> |
|
|
|
|
</Form.Item> |
|
|
|
|
<Form.Item> |
|
|
|
|
<Checkbox value="D">D</Checkbox> |
|
|
|
|
<Input |
|
|
|
|
placeholder="请输入答案" |
|
|
|
|
value={question.answerOptions.D} |
|
|
|
|
style={{ width: 500}} |
|
|
|
|
onChange={(e) => this.handleAnswerOptionChange(index, 'D', e.target.value)} |
|
|
|
|
/> |
|
|
|
|
</Form.Item> |
|
|
|
|
<Form.Item name={`optionD_${index}`} rules={[{required: true, message: '请输入答案D'}]}> |
|
|
|
|
<Input placeholder="请输入答案" style={{width: 490}}/> |
|
|
|
|
</Form.Item> |
|
|
|
|
</div> |
|
|
|
|
</Checkbox.Group> |
|
|
|
|
)} |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</Form.Item> |
|
|
|
|
</div> |
|
|
|
|
))} |
|
|
|
|
</Form> |
|
|
|
|
<div style={{ textAlign: 'right'}}> |
|
|
|
|
<div style={{textAlign: 'right'}}> |
|
|
|
|
<Button type="default" onClick={this.addNewQuestion}> |
|
|
|
|
新增试题 |
|
|
|
|
</Button> |
|
|
|
|
@ -493,13 +440,12 @@ class QuestionAdd extends Component<any, States> { |
|
|
|
|
bottom: 10, |
|
|
|
|
right: 10, |
|
|
|
|
width: '100%', |
|
|
|
|
backgroundColor: 'white', |
|
|
|
|
zIndex: 1000 |
|
|
|
|
}}> |
|
|
|
|
<Button type="default" htmlType="button" onClick={handleListQuestion} style={{ marginRight: 10 }}> |
|
|
|
|
<Button type="default" htmlType="button" onClick={handleListQuestion} style={{marginRight: 10}}> |
|
|
|
|
取消 |
|
|
|
|
</Button> |
|
|
|
|
<Button type="primary" htmlType="submit" loading={isLoading} onClick={this.handleSubmit}> |
|
|
|
|
<Button type="primary" htmlType="submit" onClick={this.handleSubmit}> |
|
|
|
|
确定添加 |
|
|
|
|
</Button> |
|
|
|
|
</div> |
|
|
|
|
@ -507,4 +453,5 @@ class QuestionAdd extends Component<any, States> { |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
export default QuestionAdd; |
hujunpeng
3 months ago