题库管理和试卷管理代码提交

packages/examination/src/api/question/index.tsx

@@ -1,10 +1,10 @@
 import axios from '../axios';
 
 /*
-* 查询
+* 查询试题
 */
 export function getList(num: number, page: number, obj:object){
-    const rData = {
+    const data = {
         num:num,
         page:page,
         industryId:obj['industryId'],
@@ -12,28 +12,18 @@ export function getList(num: number, page: number, obj:object){
         questionContent:obj['questionContent']
     };
     return axios({
-        url: "/ex/question/list",
+        url: "/ex/question/getList",
         method: 'post',
-        data: rData
+        data: data
     })
 }
 
 /*
-* 删除(明细)
+* 删除试题
 */
-export function deleteQuestion(id: number) {
+export function delQuestion(ids: any) {
     return axios({
-        url: '/ex/question/delete?id=' + id,
-        method: 'get'
-    });
-}
-
-/*
-* 删除
-*/
-export function deleteQuestionList(ids: any) {
-    return axios({
-        url: '/ex/question/deleteList',
+        url: '/ex/question/delQuestion',
         method: 'post',
         data: ids
     });

packages/examination/src/components/contentMain/index.js

@@ -66,6 +66,7 @@ class ContentMain extends Component {
                     <Route exact path='/questionEdit' component={ QuestionEdit }/>
                     <Route exact path='/examPaperList' component={ ExamPaperList }/>
                     <Route exact path='/examPaperAdd' component={ ExamPaperAdd }/>
+                    <Route exact path='/examPaperView' component={ ExamPaperView }/>
                     <Redirect exact from='/' to='/home'/>
                 </Switch>
             </div>

packages/examination/src/views/examPaper/examPaperList.tsx

@@ -1,6 +1,5 @@
 import React, { Component } from'react';
 import { Form, Input, Button, Table, Select, message, Modal } from 'antd';
-import { TableRowSelection } from 'antd/lib/table/interface';
 import { deleteSingle, deleteMultiple, getList, updatePaperStatus, batchUpdatePaperStatus } from 'api/examPaper';
 import { findIndustry } from 'api/question';
 
@@ -16,14 +15,9 @@ interface States {
     list: any[];
     total: number;
     loading: boolean;
-    currentRow: object;
-    title: string;
-    modalText: string;
-    modalWidth: number | string;
     industryDict: any;
     serviceTypeDict: any;
     selectedRowKeys: number[];
-    isAllSelected: boolean;
 }
 
 class ExamPaperList extends Component<any, States> {
@@ -41,17 +35,9 @@ class ExamPaperList extends Component<any, States> {
             list: [],
             total: 0,
             loading: false,
-            currentRow: {
-                id: 0,
-                status: 0
-            },
-            title: '',
-            modalText: '',
-            modalWidth: 0,
             industryDict: undefined,
             serviceTypeDict: undefined,
-            selectedRowKeys: [],
-            isAllSelected: false,
+            selectedRowKeys: []
         };
     }
 
@@ -79,7 +65,6 @@ class ExamPaperList extends Component<any, States> {
                 list: res.data.data,
                 total: res.data.total,
                 selectedRowKeys: [],
-                isAllSelected: false,
             });
             this.setState({ loading: false });
         }).catch(() => {
@@ -99,7 +84,6 @@ class ExamPaperList extends Component<any, States> {
                     paperName: undefined
                 },
                 selectedRowKeys: [],
-                isAllSelected: false,
             });
         }
     };
@@ -158,28 +142,10 @@ class ExamPaperList extends Component<any, States> {
     };
 
     // 多选
-    onSelectChange = (selectedRowKeys: React.Key[]) => {
+    onChange = (selectedRowKeys: React.Key[]) => {
         this.setState({
             selectedRowKeys: selectedRowKeys as number[],
-            isAllSelected: selectedRowKeys.length === this.state.list.length
-        });
-    };
-
-    // 单选
-    onSelect = (record: any, selected: boolean) => {
-        if (selected) {
-            // 单选时只保留当前选中行
-            this.setState({
-                selectedRowKeys: [record.id],
-                isAllSelected: false
-            });
-        } else {
-            // 取消选中时清空选中行
-            this.setState({
-                selectedRowKeys: [],
-                isAllSelected: false
         });
-        }
     };
 
     // 更新试卷状态
@@ -257,17 +223,6 @@ class ExamPaperList extends Component<any, States> {
 
         const { industryDict, selectedRowKeys } = this.state;
 
-        // 行选择
-        const rowSelection: TableRowSelection<any> = {
-            selectedRowKeys,
-            onChange: this.onSelectChange,
-            onSelect: this.onSelect,
-            getCheckboxProps: (record) => ({
-                checked: selectedRowKeys.includes(record.id),
-                indeterminate: selectedRowKeys.includes(record.id),
-            })
-        };
-
         const columns: any = [
             { title: '序号', dataIndex: 'index', key: 'index', align: 'center', width: 60,
                 render: (_: number, __: number, index: number) => {
@@ -297,13 +252,11 @@ class ExamPaperList extends Component<any, States> {
             { title: '操作', key: 'operation', align: 'center', fixed: 'right', width: 200,
                 render: (record: any) => [
                     <span className='mr10 link' onClick={() => {
-                        this.setState({title: '编辑', modalWidth: '85%'})
                         sessionStorage.setItem('id', String(record.id));
                         sessionStorage.setItem('isEdit', "true");
                         this.props.history.push(`/examPaperAdd`);
                     }}>编辑</span>,
                     <span className='mr10 link' onClick={() => {
-                        this.setState({title: '编辑', modalWidth: '85%'})
                         sessionStorage.setItem('id', String(record.id));
                         this.props.history.push(`/examPaperView`);
                     }}>预览</span>,
@@ -311,7 +264,6 @@ class ExamPaperList extends Component<any, States> {
                         this.updatePaperStatus(record.id, record.paperStatus); // 调用更新状态的方法
                     }}>{record.paperStatus === 0? '启用' : '停用'}</span>, // 根
                     <span className="mr10 link" onClick={() => {
-                        this.setState({title: '删除', modalWidth: '85%'})
                         this.deleteSingle(record.id);
                     }}>删除</span>
                 ]
@@ -409,7 +361,13 @@ class ExamPaperList extends Component<any, States> {
                     columns={columns}
                     rowKey="id"
                     loading={loading}
-                    scroll={{ y: '400px' }}
+                    rowSelection={{
+                        selectedRowKeys: selectedRowKeys,
+                        onChange: this.onChange,
+                        getCheckboxProps: () => ({
+                            disabled: false
+                        })
+                    }}
                     pagination={{
                         total: this.state.total,
                         current: this.state.page,
@@ -419,7 +377,6 @@ class ExamPaperList extends Component<any, States> {
                         onShowSizeChange: selectChange,
                         onChange: changePage
                     }}
-                    rowSelection={rowSelection}
                 />
             </div>
         );

packages/examination/src/views/question/questionAdd.tsx

@@ -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;
 
-// 定义单个试题的状态接口
 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 });
+                    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,7 +247,7 @@ 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');
@@ -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>
+                                <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>
@@ -300,8 +286,7 @@ class QuestionAdd extends Component<any, States> {
                                 >
                                     <Select placeholder="请选择监管行业"
                                             style={{width: 240}}
-                                            allowClear
-                                            value={question.industryId}>
+                                            allowClear>
                                         {
                                             industryDict && industryDict.length > 0 ?
                                                 (() => {
@@ -326,8 +311,7 @@ class QuestionAdd extends Component<any, States> {
                                 >
                                     <Select placeholder="请选择AQ服务类型"
                                             style={{width: 240}}
-                                            allowClear
-                                            value={question.serviceTypeId}>
+                                            allowClear>
                                         {
                                             serviceTypeDict && serviceTypeDict.length > 0 ?
                                                 (() => {
@@ -335,7 +319,8 @@ class QuestionAdd extends Component<any, States> {
                                                     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,9 +331,11 @@ 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}`}
@@ -357,128 +344,88 @@ class QuestionAdd extends Component<any, States> {
                                 >
                                     <Input.TextArea
                                         placeholder="请输入题干内容"
-                                    value={question.questionContent}
                                         style={{width: 1100, height: 60}}
                                     />
                                 </Form.Item>
-                            <Form.Item
-                                style={{marginTop: 10, marginLeft: 40}}
-                            >
-                                <div>
+                            </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)}
-                                            >
+                                                    <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 }}
+                                            name={`answer_${index}`}
                                             value={question.answer ? String(question.answer || '').split('，') : []}
-                                                onChange={(values) => this.handleCheckboxChange(index,'D',values)}>
+                                            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>
@@ -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>
-                    <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;

packages/examination/src/views/question/questionList.tsx

@@ -1,7 +1,6 @@
 import React, { Component } from'react';
 import { Form, Input, Button, Table, Select, message, Modal } from 'antd';
-import { TableRowSelection } from 'antd/lib/table/interface';
-import {deleteQuestion, deleteQuestionList, findIndustry, getList} from 'api/question';
+import { delQuestion, findIndustry, getList } from 'api/question';
 import { dictionary } from "api/dict/index";
 
 const { Option } = Select;
@@ -9,75 +8,68 @@ const { Option } = Select;
 interface States {
     num: number;
     page: number;
+    total: number;
     listQuery: {
-        industryId: string | undefined;
-        serviceTypeId: string | undefined;
-        questionContent: string | undefined;
+        industryId: string;
+        serviceTypeId: string;
+        questionContent: string;
     };
     list: any[];
-    total: number;
     loading: boolean;
-    currentRow: object;
-    title: string;
-    modalText: string;
-    modalWidth: number | string;
     industryDict: any;
     serviceTypeDict: any;
     selectedRowKeys: number[];
-    isAllSelected: boolean;
 }
 
 class QuestionList extends Component<any, States> {
     formRef: any;
+
     constructor(props: any) {
         super(props);
         this.formRef = React.createRef();
         this.state = {
             num: 10,
             page: 1,
+            total: 0,
             listQuery: {
                 industryId: '',
                 serviceTypeId: '',
                 questionContent: ''
             },
             list: [],
-            total: 0,
             loading: false,
-            currentRow: {
-                id: 0,
-                status: 0
-            },
-            title: '',
-            modalText: '',
-            modalWidth: 0,
-            industryDict: undefined,
-            serviceTypeDict: undefined,
+            industryDict: [],
+            serviceTypeDict: [],
             selectedRowKeys: [],
-            isAllSelected: false,
         };
     }
 
     componentDidMount() {
         this.findDict();
-        this.findIndustry();
         this.getList();
     }
 
+    // 字典
+    findDict() {
         // 监管行业
-    findIndustry() {
-        findIndustry().then((res: any) => {
+        findIndustry()
+            .then((res: any) => {
                 if (res.data) {
                     this.setState({ industryDict: res.data });
                 }
+            })
+            .catch(() => {
+                message.error('获取监管行业字典数据失败，请稍后重试');
             });
-    }
-
         // AQ服务类型
-    findDict() {
-        dictionary('serviceTypeDict').then((res) => {
+        dictionary('serviceTypeDict')
+            .then((res) => {
                 if (res.data) {
                     this.setState({ serviceTypeDict: res.data });
                 }
+            })
+            .catch(() => {
+                message.error('获取AQ服务类型字典数据失败，请稍后重试');
             });
     }
 
@@ -85,53 +77,52 @@ class QuestionList extends Component<any, States> {
     getList() {
         this.setState({ loading: true });
         const { num, page, listQuery } = this.state;
-        getList(num, page, listQuery).then((res) => {
+        getList(num, page, listQuery)
+            .then((res) => {
                 this.setState({
-                loading: false,
                     list: res.data.data,
                     total: res.data.total,
                     selectedRowKeys: [],
-                isAllSelected: false,
                 });
-            this.setState({ loading: false });
-        }).catch(() => {
+            })
+            .catch(() => {
+                message.error('获取数据失败');
+            })
+            .finally(() => {
                 this.setState({ loading: false });
             });
     }
 
     // 重置
     handleReset = () => {
-        if (this.formRef.current) {
-            // 重置表单字段
         this.formRef.current.resetFields();
-            // 重置 listQuery 状态
         this.setState({
             listQuery: {
-                    industryId: undefined,
-                    serviceTypeId: undefined,
-                    questionContent: undefined
+                industryId: '',
+                serviceTypeId: '',
+                questionContent: '',
             },
-                selectedRowKeys: [],
-                isAllSelected: false,
         });
-        }
     };
 
-    // 删除（明细）
-    deleteSingle = (id: number) => {
+    // 删除问题
+    handleDeleteQuestion = (id: number) => {
         Modal.confirm({
             title: '确认删除',
             content: '你确定要删除这个问题吗？',
             onOk: () => {
-                deleteQuestion(id).then((res) => {
-                    const isSuccess = res.data;
-                    if (isSuccess) {
+                const idList = [id];
+                delQuestion(idList)
+                    .then((res) => {
+                        const success = res['success'];
+                        if (success) {
                             message.success('删除成功');
                             this.getList();
                         } else {
                             message.error('删除失败，请稍后重试');
                         }
-                }).catch(() => {
+                    })
+                    .catch(() => {
                         message.error('删除时发生错误，请检查');
                     });
             },
@@ -140,21 +131,22 @@ class QuestionList extends Component<any, States> {
         });
     };
 
-    // 删除
-    deleteMultiple = () => {
+    // 批量删除问题
+    handleBatchDeleteQuestions = () => {
         const { selectedRowKeys } = this.state;
-        if (selectedRowKeys.length === 0) {
-            message.warning('请选择要删除的问题');
+
+        if (selectedRowKeys === null || selectedRowKeys.length === 0) {
+            message.warning('请选择要删除的问题').then();
             return;
         }
         Modal.confirm({
             title: '确认删除',
             content: '你确定要删除这些选中的问题吗？',
             onOk: () => {
-                deleteQuestionList(selectedRowKeys)
+                delQuestion(selectedRowKeys)
                     .then((res) => {
-                        const isSuccess = res.data;
-                        if (isSuccess) {
+                        const success = res['success'];
+                        if (success) {
                             message.success('删除成功');
                             this.getList();
                         } else {
@@ -170,94 +162,104 @@ class QuestionList extends Component<any, States> {
         });
     };
 
-    // 多选
-    onSelectChange = (selectedRowKeys: React.Key[]) => {
+    // 行选择
+    onChange = (selectedRowKeys: React.Key[]) => {
         this.setState({
             selectedRowKeys: selectedRowKeys as number[],
-            isAllSelected: selectedRowKeys.length === this.state.list.length
-        });
-    };
-
-    // 单选
-    onSelect = (record: any, selected: boolean) => {
-        if (selected) {
-            // 单选时只保留当前选中行
-            this.setState({
-                selectedRowKeys: [record.id],
-                isAllSelected: false
-            });
-        } else {
-            // 取消选中时清空选中行
-            this.setState({
-                selectedRowKeys: [],
-                isAllSelected: false
         });
-        }
     };
 
     render() {
         const onFinish = (values: object) => {
-            const _listQuery = { ...this.state.listQuery, ...values };
-            this.setState({ listQuery: _listQuery });
+            const listQuery = { ...this.state.listQuery, ...values };
+            this.setState({ listQuery });
             this.getList();
         };
 
-        const { industryDict, serviceTypeDict, selectedRowKeys } = this.state;
-
-        // 行选择
-        const rowSelection: TableRowSelection<any> = {
-            selectedRowKeys,
-            onChange: this.onSelectChange,
-            onSelect: this.onSelect,
-            getCheckboxProps: (record) => ({
-                checked: selectedRowKeys.includes(record.id),
-                indeterminate: selectedRowKeys.includes(record.id),
-            })
-        };
-
-        // 页面跳转
-        const handleAddQuestion = () => {
-            this.props.history.push('/questionAdd');
+        const changePage = (current: number, pageSize?: number) => {
+            setTimeout(() => {
+                this.setState({ page: current, num: pageSize || 20 });
+                this.getList();
+            }, 0);
         };
 
+        const {
+            industryDict,
+            serviceTypeDict,
+            selectedRowKeys,
+            list,
+            loading,
+            page,
+            num
+        } = this.state;
         const columns: any = [
-            { title: '序号', dataIndex: 'index', key: 'index', align: 'center', width: 60,
+            {
+                title: '序号',
+                dataIndex: 'index',
+                key: 'index',
+                align: 'center',
+                width: 60,
                 render: (_: number, __: number, index: number) => {
-                    const { page, num } = this.state;
                     return (page - 1) * num + index + 1;
                 }
             },
-            { title: '监管行业', dataIndex: 'industryId', key: 'industryId', align: 'center', width: 150,
+            {
+                title: '监管行业',
+                dataIndex: 'industryId',
+                key: 'industryId',
+                align: 'center',
+                width: 150,
                 render: (industryId: any) => {
-                    const industry = industryDict?.find((item: { industryId: string | number; industryName: string }) => String(item.industryId) === String(industryId));
+                    const industry = industryDict?.find((item: any) => item.industryId === String(industryId));
                     return industry? industry.industryName : industryId;
                 }
             },
-            { title: 'AQ服务类型', dataIndex: 'serviceTypeId', key: 'serviceTypeId', align: 'center', width: 150,
+            {
+                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) === String(serviceTypeId));
+                    const serviceType = serviceTypeDict?.find((item: any) => item.dictKey === serviceTypeId);
                     return serviceType? serviceType.dictValue : serviceTypeId;
                 }
             },
-            { title: '题型', dataIndex: 'questionTypes', key: 'questionTypes', align: 'center', width: 80,
+            {
+                title: '题型',
+                dataIndex: 'questionTypes',
+                key: 'questionTypes',
+                align: 'center',
+                width: 80,
                 render: (questionTypes: any) => {
-                if (questionTypes === 1) {
-                    return '单选题';
-                } else if (questionTypes === 2) {
-                    return '多选题';
+                    return questionTypes === 1? '单选题' : '多选题';
                 }
-                return questionTypes;}
             },
-            { title: '题干', dataIndex: 'questionContent', key: 'questionContent', align: 'center', width: 450 },
-            { title: '答案', dataIndex: 'answer', key: 'answer', align: 'center', width: 120 },
-            { title: '操作', key: 'operation', align: 'center', fixed: 'right', width: 120,
+            {
+                title: '题干',
+                dataIndex: 'questionContent',
+                key: 'questionContent',
+                align: 'center',
+                width: 450
+            },
+            {
+                title: '答案',
+                dataIndex: 'answer',
+                key: 'answer',
+                align: 'center',
+                width: 120
+            },
+            {
+                title: '操作',
+                key: 'operation',
+                align: 'center',
+                fixed: 'right',
+                width: 120,
                 render: (record: any) => [
                     <span className='mr10 link' onClick={() => {
-                        this.setState({title: '删除', modalWidth: '85%'})
-                        this.deleteSingle(record.id);
+                        this.handleDeleteQuestion(record.id);
                     }}>删除</span>,
                     <span className="mr10 link" onClick={() => {
-                        this.setState({title: '修正', modalWidth: '85%'})
                         sessionStorage.setItem('id', String(record.id));
                         this.props.history.push(`/questionEdit`);
                     }}>修正</span>
@@ -265,39 +267,23 @@ class QuestionList extends Component<any, States> {
             },
         ];
 
-        // 分页切换
-        const changePage = (current: number, pageSize?: number) => {
-            setTimeout(() => {
-                this.setState({page: current, num: pageSize || 20});
-                this.getList();
-            }, 0);
-        };
-
-        // 多少每页
-        const selectChange = (page: number, num: number) => {
-            this.setState({ page, num });
-            this.getList();
-        };
-
-        const { list, loading } = this.state;
-
         return (
-            <div className="container">
             <div className="list-filter">
                 <Form
                     ref={this.formRef}
                     className="filter"
                     layout="inline"
-                        name="basic"
                     onFinish={onFinish}
                 >
                     <Form.Item
                         label="监管行业："
                         name="industryId"
                     >
-                            <Select placeholder="请选择监管行业"
+                        <Select
+                            placeholder="请选择监管行业"
                             style={{ width: 240 }}
-                                    allowClear>
+                            allowClear
+                        >
                             {
                                 industryDict && industryDict.length > 0?
                                     (() => {
@@ -319,9 +305,11 @@ class QuestionList extends Component<any, States> {
                         label="AQ服务类型："
                         name="serviceTypeId"
                     >
-                            <Select placeholder="请选择AQ服务类型"
+                        <Select
+                            placeholder="请选择AQ服务类型"
                             style={{ width: 240 }}
-                                    allowClear>
+                            allowClear
+                        >
                             {
                                 serviceTypeDict && serviceTypeDict.length > 0?
                                     (() => {
@@ -343,7 +331,10 @@ class QuestionList extends Component<any, States> {
                         label="题干条件："
                         name="questionContent"
                     >
-                            <Input placeholder="请输入题干条件" style={{ width: 240 }}/>
+                        <Input
+                            placeholder="请输入题干条件"
+                            style={{ width: 240 }}
+                        />
                     </Form.Item>
                     <Form.Item>
                         <Button type="default" onClick={this.handleReset}>重置</Button>
@@ -352,19 +343,18 @@ class QuestionList extends Component<any, States> {
                         <Button type="primary" htmlType="submit">查询</Button>
                     </Form.Item>
                 </Form>
-                </div>
                 <Form
                     className="filter"
                     layout="inline"
-                    name="basic"
-                    onFinish={onFinish}
-                    style={{ display: 'flex', justifyContent: 'flex-end' }}
+                    style={{ justifyContent: 'flex-end' }}
                 >
                     <Form.Item>
-                        <Button type="default"  onClick={this.deleteMultiple}>删除</Button>
+                        <Button type="default" onClick={this.handleBatchDeleteQuestions}>删除</Button>
                     </Form.Item>
                     <Form.Item>
-                        <Button type="primary" onClick={handleAddQuestion}>新增试题</Button>
+                        <Button type="primary" onClick={() => {
+                            this.props.history.push('/questionAdd');
+                        }}>新增试题</Button>
                     </Form.Item>
                 </Form>
                 <Table
@@ -372,21 +362,24 @@ class QuestionList extends Component<any, States> {
                     columns={columns}
                     rowKey="id"
                     loading={loading}
-                    scroll={{ y: '400px' }}
+                    rowSelection={{
+                        selectedRowKeys: selectedRowKeys,
+                        onChange: this.onChange,
+                        getCheckboxProps: () => ({
+                            disabled: false
+                        })
+                    }}
                     pagination={{
                         total: this.state.total,
                         current: this.state.page,
                         showQuickJumper: true,
                         showSizeChanger: true,
                         showTotal: (total) => `共 ${total} 条`,
-                        onShowSizeChange: selectChange,
                         onChange: changePage
                     }}
-                    rowSelection={rowSelection}
                 />
             </div>
         );
     }
 }
-
 export default QuestionList;