From 17e162eed9118a68d9d910ad36047576cc2ab981 Mon Sep 17 00:00:00 2001 From: hujunpeng Date: Fri, 7 Mar 2025 17:47:45 +0800 Subject: [PATCH] =?UTF-8?q?=E9=A2=98=E5=BA=93=E7=AE=A1=E7=90=86=E5=92=8C?= =?UTF-8?q?=E8=AF=95=E5=8D=B7=E7=AE=A1=E7=90=86=E4=BB=A3=E7=A0=81=E6=8F=90?= =?UTF-8?q?=E4=BA=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/views/examPaper/examPaperAdd.tsx | 310 ++++++++++++++++-- .../src/views/question/questionList.tsx | 9 +- 2 files changed, 286 insertions(+), 33 deletions(-) diff --git a/packages/examination/src/views/examPaper/examPaperAdd.tsx b/packages/examination/src/views/examPaper/examPaperAdd.tsx index 7e344bc..676fc46 100644 --- a/packages/examination/src/views/examPaper/examPaperAdd.tsx +++ b/packages/examination/src/views/examPaper/examPaperAdd.tsx @@ -1,6 +1,8 @@ -import React, { Component } from'react'; -import { Form, Input, Button, Radio, Checkbox, Select, message } from 'antd'; +import React, { Component } from 'react'; +import {Form, Input, Button, Radio, Checkbox, Select, message, Modal, Table} from 'antd'; import { findIndustry, getRandomQuestions } from 'api/examPaper'; +import { getList} from 'api/question'; +import {dictionary} from "../../api/dict"; const { Option } = Select; @@ -12,6 +14,7 @@ interface optionsState { // 定义单个试题的状态接口 interface QuestionState { id: string; + serviceTypeId: string; questionTypes: string; questionContent: string; answerOptions: optionsState[]; @@ -20,27 +23,57 @@ interface QuestionState { // 定义组件的状态接口 interface States { + num: number; + page: number; + total: number; + listQuery: { + industryId: string | undefined; + serviceTypeId: string | undefined; + questionContent: string | undefined; + }; industryDict: any; + serviceTypeDict: any; isLoading: boolean; questions: QuestionState[]; + isModalVisible: boolean; + selectedParams: any; + selectedQuestionList: QuestionState[]; + questionSelectList: QuestionState[]; + queryCondition: string; } class ExamPaperAdd extends Component { formRef: any; - + formRefSub: any; constructor(props: any) { super(props); this.formRef = React.createRef(); + this.formRefSub = React.createRef(); this.state = { + num: 10, + page: 1, + total: 0, + listQuery: { + industryId: undefined, + serviceTypeId: undefined, + questionContent: undefined + }, industryDict: undefined, + serviceTypeDict: undefined, isLoading: false, - questions: [] + questions: [], + isModalVisible: false, + selectedParams: {}, + selectedQuestionList: [], + questionSelectList: [], + queryCondition: '' }; } // 初期 componentDidMount() { this.findIndustry(); + this.findDict(); } // 监管行业 @@ -52,17 +85,26 @@ class ExamPaperAdd extends Component { }); } + // AQ服务类型 + findDict() { + dictionary('serviceTypeDict').then((res) => { + if (res.data) { + this.setState({ serviceTypeDict: res.data }); + } + }); + } + // 随机生成题目 handleRandomGenerate = () => { this.formRef.current.validateFields(['industryId', 'questionCount']) - .then((values:any) => { + .then((values: any) => { const industryId = values.industryId; const questionCount = values.questionCount; // 随机获取试题 getRandomQuestions(industryId, questionCount) .then((res: any) => { if (res.data) { - if(res.data.length == 0){ + if (res.data.length == 0) { message.warning('题库没题了'); this.setState({ questions: [] }); return; @@ -70,10 +112,12 @@ class ExamPaperAdd extends Component { const newQuestions: QuestionState[] = res.data.map((questionData: any) => { const options = questionData.options.split('，'); const answerOptions = options.map((option: any) => { - const [value, label] = option.split(':'); - return { value, label };}); + const [value, label] = option.split(':'); + return { value, label }; + }); return { id: String(questionData.id), + serviceTypeId: String(questionData.serviceTypeId), questionTypes: String(questionData.questionTypes), questionContent: String(questionData.questionContent), answerOptions: answerOptions, @@ -85,17 +129,133 @@ class ExamPaperAdd extends Component { } else { message.error('未获取到随机题目'); } - }).catch(() => { + }) + .catch(() => { message.error('获取随机题目失败'); }); - }).catch(() => {}); + }) + .catch(() => {}); + }; + + // 打开手动选题模态框 + handleOpenManualSelectionModal = () => { + const { questions } = this.state; + this.formRef.current.validateFields(['industryId', 'questionCount']) + .then((values: any) => { + const industryId = values.industryId; + const questionCount = values.questionCount; + this.setState({ + isModalVisible: true, + selectedParams: { questions, industryId, questionCount } + }); + }) + .catch(() => {}); + }; + + // 关闭手动选题模态框 + handleCloseManualSelectionModal = () => { + this.setState({ isModalVisible: false }); + }; + + // 处理选择试题添加到已选列表 + handleSelectQuestion = (selectedRows:any) => { + const { selectedQuestionList } = this.state; + const newSelectedList = [...selectedQuestionList,...selectedRows]; + this.setState({ selectedQuestionList: newSelectedList }); + }; + + // 处理删除已选试题 + handleDeleteQuestion = (record:any) => { + const { questions } = this.state; + const newQuestion = questions.filter(question => question.id!== record.id); + this.setState({ questions: newQuestion }); + }; + + // 处理查询 + handleQuery = () => { + const { num, page, selectedParams } = this.state; + const industryId = selectedParams.industryId; + const { serviceTypeId } = this.formRefSub.current.getFieldsValue(['serviceTypeId']); + const { questionContent } = this.formRefSub.current.getFieldsValue(['questionContent']); + const listQuery = { + industryId, + serviceTypeId, + questionContent + }; + getList(num, page, listQuery) + .then((res: any) => { + if (res.data) { + this.setState({total: res.data.total}); + const newQuestions: QuestionState[] = res.data.data.map((questionData: any) => { + const options = questionData.options.split('，'); + const answerOptions = options.map((option: any) => { + const [value, label] = option.split(':'); + return { value, label }; + }); + return { + id: String(questionData.id), + serviceTypeId: String(questionData.serviceTypeId), + questionTypes: String(questionData.questionTypes), + questionContent: String(questionData.questionContent), + answerOptions: answerOptions, + answer: String(questionData.answer) + }; + }); + this.setState({ questionSelectList: newQuestions }); + } else { + message.warning('未找到符合条件的试题'); + } + }) + .catch(() => { + message.error('检索试题失败'); + }); }; render() { - const { industryDict, questions, isLoading } = this.state; + const { industryDict, serviceTypeDict, questions, isLoading, isModalVisible, questionSelectList } = this.state; + // 分页切换 + const changePage = (current: number, pageSize?: number) => { + setTimeout(() => { + this.setState({page: current, num: pageSize || 20}); + this.handleQuery(); + }, 0); + }; + + // 多少每页 + const selectChange = (page: number, num: number) => { + this.setState({ page, num }); + this.handleQuery(); + }; const handleListQuestion = () => { this.props.history.push('/examPaperList'); }; + const columns: any = [ + { title: '序号', dataIndex: 'index', align: 'center', width: 60, + render: (_:number, __:number, index:number) => index + 1 + }, + { title: 'AQ服务类型', dataIndex: 'serviceTypeId', key: 'serviceTypeId', align: 'center', width: 150, + render: (serviceTypeId:any) => { + const serviceType = serviceTypeDict?.find((item: { dictKey: string | number; dictValue: string }) => String(item.dictKey) === serviceTypeId); + return serviceType? serviceType.dictValue : serviceTypeId; + } + }, + { title: '题型', dataIndex: 'questionTypes', key: 'questionTypes', align: 'center', width: 80, + render: (questionTypes:any) => { + if (questionTypes === '1') { + return '单选题'; + } else if (questionTypes === '2') { + return '多选题'; + } + return questionTypes;} + }, + { title: '题干', dataIndex: 'questionContent', key: 'questionContent', align: 'center', width: 450 }, + { title: '答案', dataIndex: 'answer', key: 'answer', align: 'center', width: 120 }, + { title: '操作', dataIndex: 'operation', align: 'center', width: 120, + render: (_:number, record:number) => ( + + ) + } + ]; return (
@@ -103,18 +263,18 @@ class ExamPaperAdd extends Component { - + -
+
- {industryDict && industryDict.length > 0 ? ( (() => { let rows = []; @@ -136,47 +296,53 @@ class ExamPaperAdd extends Component { name="questionCount" rules={[{ required: true, message: '请输入题目数量' }]} > - + - + - +
- + -
+

试题详情

- +
{questions.map((question, index) => ( -
- {index + 1}. {question.questionContent} + {index + 1}. {question.questionContent} - {question.questionTypes === '1' ? ( + { question.questionTypes === '1' ? ( {question.answerOptions.map((option) => ( @@ -207,7 +373,7 @@ class ExamPaperAdd extends Component { zIndex: 1000 }} > -
+ + 取消 + , + + ]} + width={1100} + style={{ top: 20 }} + > +
+

已选列表

+
+ + + +
+

试题选择

+
+ + + + + + + + + + +
+
`共 ${total} 条`, + onShowSizeChange: selectChange, + onChange: changePage + }} + /> + ); } diff --git a/packages/examination/src/views/question/questionList.tsx b/packages/examination/src/views/question/questionList.tsx index c3cca8d..fdd01f8 100644 --- a/packages/examination/src/views/question/questionList.tsx +++ b/packages/examination/src/views/question/questionList.tsx @@ -36,9 +36,9 @@ class QuestionList extends Component { num: 10, page: 1, listQuery: { - industryId: undefined, - serviceTypeId: undefined, - questionContent: undefined + industryId: '', + serviceTypeId: '', + questionContent: '' }, list: [], total: 0, @@ -250,7 +250,6 @@ class QuestionList extends Component { }, { title: '题干', dataIndex: 'questionContent', key: 'questionContent', align: 'center', width: 450 }, { title: '答案', dataIndex: 'answer', key: 'answer', align: 'center', width: 120 }, - { title: '题目ID', dataIndex: 'id', key: 'id', width: 120}, { title: '操作', key: 'operation', align: 'center', fixed: 'right', width: 120, render: (record: any) => [ { @@ -362,7 +361,7 @@ class QuestionList extends Component { style={{ display: 'flex', justifyContent: 'flex-end' }} > - +