Files
qing-yu-club-front/src/views/upload-questions/pages/single-box/index.jsx
秋水浮尘 0cb65254f4 feat: 改造
2023-12-02 23:31:54 +08:00

66 lines
1.8 KiB
JavaScript

import React, { Component } from 'react'
import BriefQuestions from '../../components/brief-questions'
import JudgeQuestions from '../../components/judge-questions'
import MultipleQuestions from '../../components/multiple-questions'
import SingleQuestions from '../../components/single-questions'
import UploadLeftLayout from '../../components/upload-left-layout'
import { uploadLayout } from '../../constant'
import './index.less'
export default class SingleBox extends Component {
constructor(props) {
super(props)
this.state = {
layoutList: uploadLayout,
currentIndex: 0
}
}
/**
* 切换题型
* @param {*} id
*/
onChangeQuestionsType = layoutIndex => {
let { layoutList, currentIndex } = this.state
if (currentIndex === layoutIndex) {
return
}
let list = layoutList.map((item, index) => {
let flag = false
if (layoutIndex === index) {
flag = true
}
return {
...item,
active: flag
}
})
this.setState({
layoutList: list,
currentIndex: layoutIndex
})
}
render() {
const { currentIndex, layoutList } = this.state
return (
<div style={{ display: 'flex' }}>
<UploadLeftLayout layoutList={layoutList} onChange={this.onChangeQuestionsType} />
<div className='upload-questions-modular'>{this.changeReander(currentIndex)}</div>
</div>
)
}
changeReander = i => {
switch (i) {
case 0:
return <BriefQuestions questionsType={i + 1} key={`question_${i}`} />
case 1:
return <SingleQuestions questionsType={i + 1} key={`question_${i}`} />
case 2:
return <MultipleQuestions questionsType={i + 1} key={`question_${i}`} />
case 3:
return <JudgeQuestions questionsType={i + 1} key={`question_${i}`} />
}
}
}