Skip to content

X
xiaomai-cloud-class-web
Commit 89701440 by yuananting
Options

fix:解决合并区分复制试卷和编辑试卷调用的详情接口的冲突

parents 6f6bbe45 33078815
Showing with 201 additions and 341 deletions
src/modules/teach-tool/paper-manage/OperatePaper.jsx
/* /*
* @Author: yuananting * @Author: yuananting
* @Date: 2021-03-27 16:15:13 * @Date: 2021-03-27 16:15:13
* @LastEditors: wufan * @LastEditors: yuananting
* @LastEditTime: 2021-06-17 09:42:57 * @LastEditTime: 2021-07-01 19:48:48
* @Description: 助学工具-新建/复制/编辑试卷 * @Description: 助学工具-新建/复制/编辑试卷
* @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
import React, { Component } from "react"; import React, { Component } from 'react';
import { import { Form, Button, Input, Table, InputNumber, Tooltip, message, Modal, Spin, Space, Radio } from 'antd';
Form, import { PlusOutlined } from '@ant-design/icons';
Button, import { XMTable } from '@/components';
Input, import ShowTips from '@/components/ShowTips';
Table, import Breadcrumbs from '@/components/Breadcrumbs';
InputNumber, import './OperatePaper.less';
ConfigProvider, import SelectQuestionModal from './modal/SelectQuestionModal';
Empty, import PaperPreviewModal from './modal/PreviewPaperModal';
Tooltip, import User from '@/common/js/user';
message, import AidToolService from '@/domains/aid-tool-domain/AidToolService';
Modal, import Bus from '@/core/bus';
Spin, import { Route, withRouter } from 'react-router-dom';
Space,
Radio,
} from "antd";
import { PlusOutlined } from "@ant-design/icons";
import { XMTable } from "@/components";
import ShowTips from "@/components/ShowTips";
import Breadcrumbs from "@/components/Breadcrumbs";
import "./OperatePaper.less";
import SelectQuestionModal from "./modal/SelectQuestionModal";
import PaperPreviewModal from "./modal/PreviewPaperModal";
import User from "@/common/js/user";
import AidToolService from "@/domains/aid-tool-domain/AidToolService";
import Bus from "@/core/bus";
import { Route, withRouter } from "react-router-dom";
import * as paperEmpty from '../../lottie/paperEmpty/data.json'; import * as paperEmpty from '../../lottie/paperEmpty/data.json';
import AddExam from "@/modules/teach-tool/examination-manager/AddExam"; import AddExam from '@/modules/teach-tool/examination-manager/AddExam';
import _ from "underscore"; import _ from 'underscore';
const questionTypeEnum = { const questionTypeEnum = {
SINGLE_CHOICE: "单选题", SINGLE_CHOICE: '单选题',
MULTI_CHOICE: "多选题", MULTI_CHOICE: '多选题',
JUDGE: "判断题", JUDGE: '判断题',
GAP_FILLING: "填空题", GAP_FILLING: '填空题',
INDEFINITE_CHOICE: "不定项选择题", INDEFINITE_CHOICE: '不定项选择题',
}; };
class OperatePaper extends Component { class OperatePaper extends Component {
formRef = React.createRef(); formRef = React.createRef();
...@@ -50,7 +36,7 @@ class OperatePaper extends Component { ...@@ -50,7 +36,7 @@ class OperatePaper extends Component {
super(props); super(props);
this.state = { this.state = {
formData: { formData: {
categoryId: getParameterByName("categoryId"), // 分类ID categoryId: getParameterByName('categoryId'), // 分类ID
singleChoiceCnt: 0, // 单选题数量 singleChoiceCnt: 0, // 单选题数量
multiChoiceCnt: 0, // 多选题数量 multiChoiceCnt: 0, // 多选题数量
judgeCnt: 0, // 判断题数量 judgeCnt: 0, // 判断题数量
...@@ -73,36 +59,30 @@ class OperatePaper extends Component { ...@@ -73,36 +59,30 @@ class OperatePaper extends Component {
}, },
selectQuestionModal: null, selectQuestionModal: null,
paperPreviewModal: null, paperPreviewModal: null,
quickSortModalVisible: false, // 快捷排序弹窗显隐 quickSortModalVisible: false, // 快捷排序弹窗显隐
selectQuestionList: [], selectQuestionList: [],
currentOperate: "", currentOperate: '',
currentNav: "", currentNav: '',
currentCategoryPapers: [], currentCategoryPapers: [],
loading: false, loading: false,
check: false, check: false,
sorterMethod: "addOrder", sorterMethod: 'addOrder',
sorterBy: [ sorterBy: ['SINGLE_CHOICE', 'MULTI_CHOICE', 'JUDGE', 'GAP_FILLING', 'INDEFINITE_CHOICE'],
"SINGLE_CHOICE",
"MULTI_CHOICE",
"JUDGE",
"GAP_FILLING",
"INDEFINITE_CHOICE",
],
sorterTypeList: [ sorterTypeList: [
{ {
typeKey: "SINGLE_CHOICE", typeKey: 'SINGLE_CHOICE',
}, },
{ {
typeKey: "MULTI_CHOICE", typeKey: 'MULTI_CHOICE',
}, },
{ {
typeKey: "JUDGE", typeKey: 'JUDGE',
}, },
{ {
typeKey: "GAP_FILLING", typeKey: 'GAP_FILLING',
}, },
{ {
typeKey: "INDEFINITE_CHOICE", typeKey: 'INDEFINITE_CHOICE',
}, },
], ],
}; };
...@@ -110,30 +90,26 @@ class OperatePaper extends Component { ...@@ -110,30 +90,26 @@ class OperatePaper extends Component {
componentDidMount() { componentDidMount() {
this.queryCurrentCategoryPapers(); this.queryCurrentCategoryPapers();
switch (getParameterByName("type")) { switch (getParameterByName('type')) {
case "new": case 'new':
this.setState({ currentOperate: "new", currentNav: "新建试卷" }); this.setState({ currentOperate: 'new', currentNav: '新建试卷' });
break; break;
case "edit": case 'edit':
this.setState({ currentOperate: "edit", currentNav: "编辑试卷" }, () => this.setState({ currentOperate: 'edit', currentNav: '编辑试卷' }, () => this.queryPaperDetail('edit'));
this.queryPaperDetail()
);
break; break;
case "copy": case 'copy':
this.setState({ currentOperate: "copy", currentNav: "复制试卷" }, () => this.setState({ currentOperate: 'copy', currentNav: '复制试卷' }, () => this.queryPaperDetail('copy'));
this.queryPaperDetail()
);
break; break;
} }
} }
// 获取当前分类下的所有试卷 // 获取当前分类下的所有试卷
queryCurrentCategoryPapers = () => { queryCurrentCategoryPapers = () => {
const categoryId = getParameterByName("categoryId"); const categoryId = getParameterByName('categoryId');
let params = { let params = {
current: 1, current: 1,
size: 9999, size: 9999,
categoryId: categoryId === "null" ? null : categoryId, categoryId: categoryId === 'null' ? null : categoryId,
paperName: null, // 试卷名称 paperName: null, // 试卷名称
source: 0, source: 0,
tenantId: User.getStoreId(), tenantId: User.getStoreId(),
...@@ -146,14 +122,15 @@ class OperatePaper extends Component { ...@@ -146,14 +122,15 @@ class OperatePaper extends Component {
}; };
// 编辑/复制试卷时获取相应试卷详情 // 编辑/复制试卷时获取相应试卷详情
queryPaperDetail = async () => { queryPaperDetail = async (flag) => {
this.setState({ loading: true }); this.setState({ loading: true });
const { currentOperate } = this.state; const { currentOperate } = this.state;
let query = { let query = {
paperId: getParameterByName("paperId"), paperId: getParameterByName('paperId'),
source: 0, source: 0,
userId: User.getStoreUserId(), userId: User.getStoreUserId(),
tenantId: User.getStoreId(), tenantId: User.getStoreId(),
flag: flag === 'copy',
}; };
const res = await AidToolService.queryPaperDetail(query); const res = await AidToolService.queryPaperDetail(query);
const { result } = res; const { result } = res;
...@@ -163,9 +140,8 @@ class OperatePaper extends Component { ...@@ -163,9 +140,8 @@ class OperatePaper extends Component {
selectQuestionList: questionList, selectQuestionList: questionList,
formData: { formData: {
...result, ...result,
paperId: getParameterByName("paperId"), paperId: getParameterByName('paperId'),
paperName: paperName: currentOperate === 'copy' ? paperName + '（复制）' : paperName,
currentOperate === "copy" ? paperName + "（复制）" : paperName,
}, },
loading: false, loading: false,
}, },
...@@ -188,26 +164,11 @@ class OperatePaper extends Component { ...@@ -188,26 +164,11 @@ class OperatePaper extends Component {
const _selectQuestionList = [...list]; const _selectQuestionList = [...list];
// 各类型题目汇总 // 各类型题目汇总
const singleQuestion = _.filter( const singleQuestion = _.filter(_selectQuestionList, (item) => item.questionType === 'SINGLE_CHOICE');
_selectQuestionList, const multiQuestion = _.filter(_selectQuestionList, (item) => item.questionType === 'MULTI_CHOICE');
(item) => item.questionType === "SINGLE_CHOICE" const judgeQuestion = _.filter(_selectQuestionList, (item) => item.questionType === 'JUDGE');
); const gapQuestion = _.filter(_selectQuestionList, (item) => item.questionType === 'GAP_FILLING');
const multiQuestion = _.filter( const indefiniteQuestion = _.filter(_selectQuestionList, (item) => item.questionType === 'INDEFINITE_CHOICE');
_selectQuestionList,
(item) => item.questionType === "MULTI_CHOICE"
);
const judgeQuestion = _.filter(
_selectQuestionList,
(item) => item.questionType === "JUDGE"
);
const gapQuestion = _.filter(
_selectQuestionList,
(item) => item.questionType === "GAP_FILLING"
);
const indefiniteQuestion = _.filter(
_selectQuestionList,
(item) => item.questionType === "INDEFINITE_CHOICE"
);
// 各类型题目总分值 // 各类型题目总分值
const singleChoiceScore = singleQuestion.reduce((prev, cur) => { const singleChoiceScore = singleQuestion.reduce((prev, cur) => {
...@@ -277,9 +238,7 @@ class OperatePaper extends Component { ...@@ -277,9 +238,7 @@ class OperatePaper extends Component {
const selectQuestionList = [...this.state.selectQuestionList]; const selectQuestionList = [...this.state.selectQuestionList];
const item = selectQuestionList.splice(index + moveLength, 1); const item = selectQuestionList.splice(index + moveLength, 1);
selectQuestionList.splice(index, 0, item[0]); selectQuestionList.splice(index, 0, item[0]);
this.setState({ selectQuestionList }, () => this.setState({ selectQuestionList }, () => this.setFormData(this.state.selectQuestionList));
this.setFormData(this.state.selectQuestionList)
);
}; };
// 移除已选题目 // 移除已选题目
...@@ -287,9 +246,7 @@ class OperatePaper extends Component { ...@@ -287,9 +246,7 @@ class OperatePaper extends Component {
const { selectQuestionList } = this.state; const { selectQuestionList } = this.state;
this.setState( this.setState(
{ {
selectQuestionList: [...selectQuestionList].filter( selectQuestionList: [...selectQuestionList].filter((item) => item.questionId !== delQuestionId),
(item) => item.questionId !== delQuestionId
),
}, },
() => this.setFormData(this.state.selectQuestionList) () => this.setFormData(this.state.selectQuestionList)
); );
...@@ -303,15 +260,12 @@ class OperatePaper extends Component { ...@@ -303,15 +260,12 @@ class OperatePaper extends Component {
if (result != null) { if (result != null) {
return result; return result;
} }
if (["new", "copy"].includes(currentOperate)) { if (['new', 'copy'].includes(currentOperate)) {
if (item.paperName === paperName) { if (item.paperName === paperName) {
result = item; result = item;
} }
} else if (currentOperate === "edit") { } else if (currentOperate === 'edit') {
if ( if (item.paperName === paperName && item.paperId !== getParameterByName('paperId')) {
item.paperName === paperName &&
item.paperId !== getParameterByName("paperId")
) {
result = item; result = item;
} }
} }
...@@ -321,15 +275,15 @@ class OperatePaper extends Component { ...@@ -321,15 +275,15 @@ class OperatePaper extends Component {
validatePaperName = (paperName) => { validatePaperName = (paperName) => {
if (this.state.check && !paperName) { if (this.state.check && !paperName) {
return "请输入试卷名称"; return '请输入试卷名称';
} }
if (this.checkExist(paperName)) { if (this.checkExist(paperName)) {
return "该试卷名称已存在"; return '该试卷名称已存在';
} }
if (paperName && paperName.length > 40) { if (paperName && paperName.length > 40) {
return "试卷名称最多40字"; return '试卷名称最多40字';
} }
}; };
...@@ -337,19 +291,14 @@ class OperatePaper extends Component { ...@@ -337,19 +291,14 @@ class OperatePaper extends Component {
savePaper = (saveType) => { savePaper = (saveType) => {
this.setState({ check: true }); this.setState({ check: true });
const { selectQuestionList, formData, currentOperate } = this.state; const { selectQuestionList, formData, currentOperate } = this.state;
const categoryId = getParameterByName("categoryId"); const categoryId = getParameterByName('categoryId');
const { match } = this.props; const { match } = this.props;
let questionList = []; let questionList = [];
if ( if (!formData.passRate || !formData.paperName || this.checkExist(formData.paperName) || (formData.paperName && formData.paperName.length > 40)) {
!formData.passRate ||
!formData.paperName ||
this.checkExist(formData.paperName) ||
(formData.paperName && formData.paperName.length > 40)
) {
return; return;
} }
if (selectQuestionList.length === 0) { if (selectQuestionList.length === 0) {
return message.warning("请选择题目"); return message.warning('请选择题目');
} }
selectQuestionList.forEach((item, index) => { selectQuestionList.forEach((item, index) => {
...@@ -370,29 +319,23 @@ class OperatePaper extends Component { ...@@ -370,29 +319,23 @@ class OperatePaper extends Component {
}, },
}, },
() => { () => {
if (["new", "copy"].includes(currentOperate)) { if (['new', 'copy'].includes(currentOperate)) {
AidToolService.createPaper(this.state.formData) AidToolService.createPaper(this.state.formData)
.then((res) => { .then((res) => {
if (res.success) { if (res.success) {
if (saveType === "saveToAddExam") { if (saveType === 'saveToAddExam') {
this.setState({formData:{ ...formData, paperId: res.result}},() => { this.setState({ formData: { ...formData, paperId: res.result } }, () => {
window.RCHistory.push({ window.RCHistory.push({
pathname: `${match.url}/exam-operate-page`, pathname: `${match.url}/exam-operate-page`,
}); });
}) });
} else { } else {
message.success( message.success(currentOperate === 'new' ? '新建成功' : '复制成功');
currentOperate === "new" ? "新建成功" : "复制成功"
);
window.RCHistory.push({ window.RCHistory.push({
pathname: `/paper-manage-index?categoryId=${categoryId}`, pathname: `/paper-manage-index?categoryId=${categoryId}`,
}); });
Bus.trigger( Bus.trigger('queryPaperPageList', categoryId, selectQuestionList.length);
"queryPaperPageList", Bus.trigger('queryCategoryTree', 'remain');
categoryId,
selectQuestionList.length
);
Bus.trigger("queryCategoryTree", "remain");
} }
} }
}) })
...@@ -400,34 +343,26 @@ class OperatePaper extends Component { ...@@ -400,34 +343,26 @@ class OperatePaper extends Component {
window.RCHistory.push({ window.RCHistory.push({
pathname: `/paper-manage-index?categoryId=${categoryId}`, pathname: `/paper-manage-index?categoryId=${categoryId}`,
}); });
Bus.trigger( Bus.trigger('queryPaperPageList', categoryId, selectQuestionList.length);
"queryPaperPageList", Bus.trigger('queryCategoryTree', 'remain');
categoryId,
selectQuestionList.length
);
Bus.trigger("queryCategoryTree", "remain");
}); });
} else if (currentOperate === "edit") { } else if (currentOperate === 'edit') {
AidToolService.editPaper({ AidToolService.editPaper({
...this.state.formData, ...this.state.formData,
paperId: getParameterByName("paperId"), paperId: getParameterByName('paperId'),
}) })
.then((res) => { .then((res) => {
if (res.success) { if (res.success) {
if (saveType === "saveToAddExam") { if (saveType === 'saveToAddExam') {
window.RCHistory.push({ window.RCHistory.push({
pathname: `${match.url}/exam-operate-page`, pathname: `${match.url}/exam-operate-page`,
}); });
} else { } else {
message.success("编辑成功"); message.success('编辑成功');
window.RCHistory.push({ window.RCHistory.push({
pathname: `/paper-manage-index?categoryId=${categoryId}`, pathname: `/paper-manage-index?categoryId=${categoryId}`,
}); });
Bus.trigger( Bus.trigger('queryPaperPageList', categoryId, selectQuestionList.length);
"queryPaperPageList",
categoryId,
selectQuestionList.length
);
} }
} }
}) })
...@@ -435,11 +370,7 @@ class OperatePaper extends Component { ...@@ -435,11 +370,7 @@ class OperatePaper extends Component {
window.RCHistory.push({ window.RCHistory.push({
pathname: `/paper-manage-index?categoryId=${categoryId}`, pathname: `/paper-manage-index?categoryId=${categoryId}`,
}); });
Bus.trigger( Bus.trigger('queryPaperPageList', categoryId, selectQuestionList.length);
"queryPaperPageList",
categoryId,
selectQuestionList.length
);
}); });
} }
} }
...@@ -451,7 +382,7 @@ class OperatePaper extends Component { ...@@ -451,7 +382,7 @@ class OperatePaper extends Component {
const { selectQuestionList, formData } = this.state; const { selectQuestionList, formData } = this.state;
const m = ( const m = (
<PaperPreviewModal <PaperPreviewModal
previewPage="paper-operate" previewPage='paper-operate'
paperInfo={{ ...formData, questionList: selectQuestionList }} paperInfo={{ ...formData, questionList: selectQuestionList }}
close={() => { close={() => {
this.setState({ this.setState({
...@@ -466,21 +397,17 @@ class OperatePaper extends Component { ...@@ -466,21 +397,17 @@ class OperatePaper extends Component {
// 取消/返回 // 取消/返回
handleGoBack = () => { handleGoBack = () => {
Modal.confirm({ Modal.confirm({
title: "确定要返回吗？", title: '确定要返回吗？',
content: "返回后，本次编辑的内容将不被保存", content: '返回后，本次编辑的内容将不被保存',
okText: "确认返回", okText: '确认返回',
cancelText: "留在本页", cancelText: '留在本页',
icon: ( icon: <span className='icon iconfont default-confirm-icon'>&#xe6f4;</span>,
<span className="icon iconfont default-confirm-icon">&#xe6f4;</span>
),
onOk: () => { onOk: () => {
window.RCHistory.push({ window.RCHistory.push({
pathname: `/paper-manage-index?categoryId=${getParameterByName( pathname: `/paper-manage-index?categoryId=${getParameterByName('categoryId')}`,
"categoryId"
)}`,
}); });
Bus.trigger("queryCategoryTree", "remain"); Bus.trigger('queryCategoryTree', 'remain');
Bus.trigger("queryPaperPageList", getParameterByName("categoryId"), 0); Bus.trigger('queryPaperPageList', getParameterByName('categoryId'), 0);
}, },
}); });
}; };
...@@ -490,39 +417,39 @@ class OperatePaper extends Component { ...@@ -490,39 +417,39 @@ class OperatePaper extends Component {
const { selectQuestionList } = this.state; const { selectQuestionList } = this.state;
const columns = [ const columns = [
{ {
title: "序号", title: '序号',
dataIndex: "index", dataIndex: 'index',
key: "index", key: 'index',
width: "10%", width: '10%',
render: (val, record, index) => { render: (val, record, index) => {
return <span>{index + 1}</span>; return <span>{index + 1}</span>;
}, },
}, },
{ {
title: "题型", title: '题型',
dataIndex: "questionType", dataIndex: 'questionType',
key: "questionType", key: 'questionType',
width: "12%", width: '12%',
filters: [ filters: [
{ {
text: "单选题", text: '单选题',
value: "SINGLE_CHOICE", value: 'SINGLE_CHOICE',
}, },
{ {
text: "多选题", text: '多选题',
value: "MULTI_CHOICE", value: 'MULTI_CHOICE',
}, },
{ {
text: "判断题", text: '判断题',
value: "JUDGE", value: 'JUDGE',
}, },
{ {
text: "填空题", text: '填空题',
value: "GAP_FILLING", value: 'GAP_FILLING',
}, },
{ {
text: "不定项选择题", text: '不定项选择题',
value: "INDEFINITE_CHOICE", value: 'INDEFINITE_CHOICE',
}, },
], ],
filterMultiple: true, filterMultiple: true,
...@@ -530,26 +457,23 @@ class OperatePaper extends Component { ...@@ -530,26 +457,23 @@ class OperatePaper extends Component {
render: (val) => questionTypeEnum[val], render: (val) => questionTypeEnum[val],
}, },
{ {
title: "题目", title: '题目',
dataIndex: "questionStem", dataIndex: 'questionStem',
key: "questionStem", key: 'questionStem',
ellipsis: { ellipsis: {
showTitle: false, showTitle: false,
}, },
render: (val) => { render: (val) => {
var handleVal = val; var handleVal = val;
handleVal = handleVal.replace(/<(?!img|input).*?>/g, ""); handleVal = handleVal.replace(/<(?!img|input).*?>/g, '');
handleVal = handleVal.replace(/<\s?input[^>]*>/gi, "_、"); handleVal = handleVal.replace(/<\s?input[^>]*>/gi, '_、');
handleVal = handleVal.replace(/\&nbsp\;/gi, " "); handleVal = handleVal.replace(/\&nbsp\;/gi, ' ');
return ( return (
<Tooltip <Tooltip
overlayClassName="aid-tool-list" overlayClassName='aid-tool-list'
title={ title={<div style={{ maxWidth: 700, width: 'auto' }}>{handleVal}</div>}
<div style={{ maxWidth: 700, width: "auto" }}>{handleVal}</div> placement='topLeft'
} overlayStyle={{ maxWidth: 700 }}>
placement="topLeft"
overlayStyle={{ maxWidth: 700 }}
>
{handleVal} {handleVal}
</Tooltip> </Tooltip>
); );
...@@ -558,20 +482,17 @@ class OperatePaper extends Component { ...@@ -558,20 +482,17 @@ class OperatePaper extends Component {
{ {
title: ( title: (
<span> <span>
分值{" "} 分值{' '}
<Tooltip title="多选题和填空题的漏选/半对得分不能高于题目本身分值"> <Tooltip title='多选题和填空题的漏选/半对得分不能高于题目本身分值'>
<span <span className='icon iconfont' style={{ color: '#BFBFBF', fontSize: 14, fontWeight: '400' }}>
className="icon iconfont"
style={{ color: "#BFBFBF", fontSize: 14, fontWeight: "400" }}
>
&#xe7c4; &#xe7c4;
</span> </span>
</Tooltip> </Tooltip>
</span> </span>
), ),
dataIndex: "score", dataIndex: 'score',
key: "score", key: 'score',
width: "12%", width: '12%',
render: (val, record, index) => { render: (val, record, index) => {
return ( return (
<InputNumber <InputNumber
...@@ -582,11 +503,7 @@ class OperatePaper extends Component { ...@@ -582,11 +503,7 @@ class OperatePaper extends Component {
const _selectQuestionList = [...selectQuestionList]; const _selectQuestionList = [...selectQuestionList];
this.setState( this.setState(
{ {
selectQuestionList: _selectQuestionList.map((item) => selectQuestionList: _selectQuestionList.map((item) => (item.questionId === record.questionId ? { ...item, score: value } : item)),
item.questionId === record.questionId
? { ...item, score: value }
: item
),
}, },
() => this.setFormData(this.state.selectQuestionList) () => this.setFormData(this.state.selectQuestionList)
); );
...@@ -596,20 +513,14 @@ class OperatePaper extends Component { ...@@ -596,20 +513,14 @@ class OperatePaper extends Component {
}, },
}, },
{ {
dataIndex: "portionScore", dataIndex: 'portionScore',
key: "portionScore", key: 'portionScore',
width: "18%", width: '18%',
render: (val, record, index) => { render: (val, record, index) => {
return ( return (
["MULTI_CHOICE", "GAP_FILLING", "INDEFINITE_CHOICE"].includes( ['MULTI_CHOICE', 'GAP_FILLING', 'INDEFINITE_CHOICE'].includes(record.questionType) && (
record.questionType
) && (
<div> <div>
{record.questionType === "GAP_FILLING" ? ( {record.questionType === 'GAP_FILLING' ? <span>半对得</span> : <span>漏选得</span>}{' '}
<span>半对得</span>
) : (
<span>漏选得</span>
)}{" "}
<InputNumber <InputNumber
min={0} min={0}
max={record.score - 1} max={record.score - 1}
...@@ -619,9 +530,7 @@ class OperatePaper extends Component { ...@@ -619,9 +530,7 @@ class OperatePaper extends Component {
this.setState( this.setState(
{ {
selectQuestionList: _selectQuestionList.map((item) => selectQuestionList: _selectQuestionList.map((item) =>
item.questionId === record.questionId item.questionId === record.questionId ? { ...item, portionScore: value } : item
? { ...item, portionScore: value }
: item
), ),
}, },
() => this.setFormData(this.state.selectQuestionList) () => this.setFormData(this.state.selectQuestionList)
...@@ -634,43 +543,34 @@ class OperatePaper extends Component { ...@@ -634,43 +543,34 @@ class OperatePaper extends Component {
}, },
}, },
{ {
title: "操作", title: '操作',
dataIndex: "operate", dataIndex: 'operate',
key: "operate", key: 'operate',
width: "16%", width: '16%',
render: (val, record, index) => { render: (val, record, index) => {
return ( return (
<div className="record-operate"> <div className='record-operate'>
<div <div
className={ className={index > 0 ? 'record-operate__item' : 'record-operate__ban'}
index > 0 ? "record-operate__item" : "record-operate__ban"
}
onClick={() => { onClick={() => {
this.handleMoveItem(index, -1); this.handleMoveItem(index, -1);
}} }}>
>
上移 上移
</div> </div>
<span className="record-operate__item split"> | </span> <span className='record-operate__item split'> | </span>
<div <div
className={ className={index < selectQuestionList.length - 1 ? 'record-operate__item' : 'record-operate__ban'}
index < selectQuestionList.length - 1
? "record-operate__item"
: "record-operate__ban"
}
onClick={() => { onClick={() => {
this.handleMoveItem(index, 1); this.handleMoveItem(index, 1);
}} }}>
>
下移 下移
</div> </div>
<span className="record-operate__item split"> | </span> <span className='record-operate__item split'> | </span>
<div <div
className="record-operate__item" className='record-operate__item'
onClick={() => { onClick={() => {
this.handleDelItem(record.questionId); this.handleDelItem(record.questionId);
}} }}>
>
移除 移除
</div> </div>
</div> </div>
...@@ -686,7 +586,7 @@ class OperatePaper extends Component { ...@@ -686,7 +586,7 @@ class OperatePaper extends Component {
const sorterTypeList = [...this.state.sorterTypeList]; const sorterTypeList = [...this.state.sorterTypeList];
const item = sorterTypeList.splice(index + moveLength, 1); const item = sorterTypeList.splice(index + moveLength, 1);
sorterTypeList.splice(index, 0, item[0]); sorterTypeList.splice(index, 0, item[0]);
const sorterBy = _.pluck(sorterTypeList, "typeKey"); const sorterBy = _.pluck(sorterTypeList, 'typeKey');
this.setState({ sorterTypeList, sorterBy }); this.setState({ sorterTypeList, sorterBy });
}; };
...@@ -694,13 +594,9 @@ class OperatePaper extends Component { ...@@ -694,13 +594,9 @@ class OperatePaper extends Component {
quickSorter = (list, sorterMethod, sorterBy) => { quickSorter = (list, sorterMethod, sorterBy) => {
this.setState({ this.setState({
selectQuestionList: selectQuestionList:
sorterMethod === "addOrder" sorterMethod === 'addOrder'
? list.sort((a, b) => a.sorterIndex - b.sorterIndex) ? list.sort((a, b) => a.sorterIndex - b.sorterIndex)
: list.sort( : list.sort((a, b) => sorterBy.indexOf(a.questionTypeEnum || a.questionType) - sorterBy.indexOf(b.questionTypeEnum || b.questionType)),
(a, b) =>
sorterBy.indexOf(a.questionTypeEnum || a.questionType) -
sorterBy.indexOf(b.questionTypeEnum || b.questionType)
),
}); });
}; };
...@@ -739,41 +635,39 @@ class OperatePaper extends Component { ...@@ -739,41 +635,39 @@ class OperatePaper extends Component {
const selectQuestionList = [...this.state.selectQuestionList]; const selectQuestionList = [...this.state.selectQuestionList];
const questionTypeEnum = { const questionTypeEnum = {
SINGLE_CHOICE: "【单选题】", SINGLE_CHOICE: '【单选题】',
MULTI_CHOICE: "【多选题】", MULTI_CHOICE: '【多选题】',
JUDGE: "【判断题】", JUDGE: '【判断题】',
GAP_FILLING: "【填空题】", GAP_FILLING: '【填空题】',
INDEFINITE_CHOICE: "【不定项选择题】", INDEFINITE_CHOICE: '【不定项选择题】',
}; };
const typeColumns = [ const typeColumns = [
{ {
title: "题型", title: '题型',
dataIndex: "typeKey", dataIndex: 'typeKey',
key: "typeKey", key: 'typeKey',
render: (text, record, index) => <span style={{color: '#333333'}}>{questionTypeEnum[text]}</span>, render: (text, record, index) => <span style={{ color: '#333333' }}>{questionTypeEnum[text]}</span>,
}, },
{ {
title: "操作", title: '操作',
key: "action", key: 'action',
align: 'right', align: 'right',
render: (text, record, index) => ( render: (text, record, index) => (
<Space size="middle"> <Space size='middle'>
<span <span
style={{color: index > 0 ? '#2966FF' : '#CCCCCC', cursor: 'pointer'}} style={{ color: index > 0 ? '#2966FF' : '#CCCCCC', cursor: 'pointer' }}
onClick={() => { onClick={() => {
index > 0 && this.handleMoveTypeSorter(index, -1); index > 0 && this.handleMoveTypeSorter(index, -1);
}} }}>
>
上移 上移
</span> </span>
<span style={{color: '#BFBFBF'}}> | </span> <span style={{ color: '#BFBFBF' }}> | </span>
<span <span
style={{color: index < 4 ? '#2966FF' : '#CCCCCC', cursor: 'pointer'}} style={{ color: index < 4 ? '#2966FF' : '#CCCCCC', cursor: 'pointer' }}
onClick={() => { onClick={() => {
index < 4 && this.handleMoveTypeSorter(index, 1); index < 4 && this.handleMoveTypeSorter(index, 1);
}} }}>
>
下移 下移
</span> </span>
</Space> </Space>
...@@ -782,32 +676,26 @@ class OperatePaper extends Component { ...@@ -782,32 +676,26 @@ class OperatePaper extends Component {
]; ];
return ( return (
<div> <div>
<div className="page operate-paper-page"> <div className='page operate-paper-page'>
<Breadcrumbs <Breadcrumbs navList={currentNav} goBack={() => this.handleGoBack()} />
navList={currentNav}
goBack={() => this.handleGoBack()}
/>
<Spin spinning={loading}> <Spin spinning={loading}>
<div className="box"> <div className='box'>
<div className="show-tips"> <div className='show-tips'>
<ShowTips message="请遵守国家相关规定，切勿上传低俗色情、暴力恐怖、谣言诈骗、侵权盗版等相关内容，小麦企学院保有依据国家规定及平台规则进行处理的权利" /> <ShowTips message='请遵守国家相关规定，切勿上传低俗色情、暴力恐怖、谣言诈骗、侵权盗版等相关内容，小麦企学院保有依据国家规定及平台规则进行处理的权利' />
</div> </div>
<Form ref={this.formRef} style={{ marginTop: 24 }}> <Form ref={this.formRef} style={{ marginTop: 24 }}>
<Form.Item <Form.Item
name="paperName" name='paperName'
label="试卷名称：" label='试卷名称：'
required required
validateStatus={ validateStatus={this.validatePaperName(paperName) ? 'error' : ''}
this.validatePaperName(paperName) ? "error" : "" help={this.validatePaperName(paperName)}>
}
help={this.validatePaperName(paperName)}
>
<Input <Input
value={paperName} value={paperName}
autoComplete="off" autoComplete='off'
maxLength={40} maxLength={40}
style={{ width: 300 }} style={{ width: 300 }}
placeholder="请输入试卷名称（40字以内）" placeholder='请输入试卷名称（40字以内）'
onChange={(e) => { onChange={(e) => {
this.setState({ this.setState({
formData: { formData: {
...@@ -820,12 +708,11 @@ class OperatePaper extends Component { ...@@ -820,12 +708,11 @@ class OperatePaper extends Component {
</Form.Item> </Form.Item>
<Form.Item <Form.Item
name="passRate" name='passRate'
label="及格线：" label='及格线：'
required required
validateStatus={check && !passRate ? "error" : ""} validateStatus={check && !passRate ? 'error' : ''}
help={check && !passRate && "请输入及格线"} help={check && !passRate && '请输入及格线'}>
>
<div> <div>
<InputNumber <InputNumber
min={1} min={1}
...@@ -842,9 +729,9 @@ class OperatePaper extends Component { ...@@ -842,9 +729,9 @@ class OperatePaper extends Component {
() => this.setFormData(selectQuestionList) () => this.setFormData(selectQuestionList)
); );
}} }}
/>{" "} />{' '}
% %
<span className="score-info"> <span className='score-info'>
总分（{Number(totalScore) || 0}）*及格线（ 总分（{Number(totalScore) || 0}）*及格线（
{Number(passRate) || 0} {Number(passRate) || 0}
%）=及格分数（ %）=及格分数（
...@@ -853,65 +740,49 @@ class OperatePaper extends Component { ...@@ -853,65 +740,49 @@ class OperatePaper extends Component {
</div> </div>
</Form.Item> </Form.Item>
<Space size={8}> <Space size={8}>
<Button <Button className='choose-btn' type='primary' icon={<PlusOutlined />} onClick={this.chooseQuestion}>
className="choose-btn"
type="primary"
icon={<PlusOutlined />}
onClick={this.chooseQuestion}
>
自选题目 自选题目
</Button> </Button>
<Button <Button
className="choose-btn" className='choose-btn'
onClick={() => { onClick={() => {
this.setState({ this.setState({
quickSortModalVisible: true, quickSortModalVisible: true,
}); });
}} }}>
>
快捷排序 快捷排序
</Button> </Button>
</Space> </Space>
{questionCnt > 0 && ( {questionCnt > 0 && (
<div <div className='paper-info-tip' style={{ margin: '0 auto 12px' }}>
className="paper-info-tip"
style={{ margin: "0 auto 12px" }}
>
总计<span>{totalScore}</span>分，共 总计<span>{totalScore}</span>分，共
<span>{questionCnt}</span> <span>{questionCnt}</span>
题。{" "} 题。 {singleChoiceCnt > 0 && `单选题${singleChoiceCnt}题，共${singleChoiceScore}分；`}
{singleChoiceCnt > 0 && {multiChoiceCnt > 0 && `多选题${multiChoiceCnt}题，共${multiChoiceScore}分；`}
`单选题${singleChoiceCnt}题，共${singleChoiceScore}分；`}
{multiChoiceCnt > 0 &&
`多选题${multiChoiceCnt}题，共${multiChoiceScore}分；`}
{judgeCnt > 0 && `判断题${judgeCnt}题，共${judgeScore}分，`} {judgeCnt > 0 && `判断题${judgeCnt}题，共${judgeScore}分，`}
{gapFillingCnt > 0 && {gapFillingCnt > 0 && `填空题${gapFillingCnt}题，共${gapFillingScore}分，`}
`填空题${gapFillingCnt}题，共${gapFillingScore}分，`} {indefiniteChoiceCnt > 0 && `不定项选择题${indefiniteChoiceCnt}题，共${indefiniteChoiceScore}分`}
{indefiniteChoiceCnt > 0 &&
`不定项选择题${indefiniteChoiceCnt}题，共${indefiniteChoiceScore}分`}
</div> </div>
)} )}
<XMTable <XMTable
className="table-style" className='table-style'
scroll={{ y: 350 }} scroll={{ y: 350 }}
columns={this.parseColumns()} columns={this.parseColumns()}
dataSource={selectQuestionList} dataSource={selectQuestionList}
pagination={false} pagination={false}
renderEmpty={{ renderEmpty={{
image: paperEmpty, image: paperEmpty,
description: <span style={{ display: 'block', paddingBottom: 24 }}>请在左上角添加题目</span> description: <span style={{ display: 'block', paddingBottom: 24 }}>请在左上角添加题目</span>,
}} }}
/> />
</Form> </Form>
</div> </div>
<div className="footer"> <div className='footer'>
<Button onClick={this.handleGoBack}>取消</Button> <Button onClick={this.handleGoBack}>取消</Button>
<Button onClick={this.previewPaper}>预览</Button> <Button onClick={this.previewPaper}>预览</Button>
<Button onClick={() => this.savePaper("saveToAddExam")}> <Button onClick={() => this.savePaper('saveToAddExam')}>保存并组织考试</Button>
保存并组织考试 <Button type='primary' onClick={() => this.savePaper()}>
</Button>
<Button type="primary" onClick={() => this.savePaper()}>
保存 保存
</Button> </Button>
</div> </div>
...@@ -920,8 +791,8 @@ class OperatePaper extends Component { ...@@ -920,8 +791,8 @@ class OperatePaper extends Component {
{paperPreviewModal} {paperPreviewModal}
<Modal <Modal
maskClosable={false} maskClosable={false}
className="type-order-modal" className='type-order-modal'
title="快捷排序" title='快捷排序'
width={560} width={560}
visible={quickSortModalVisible} visible={quickSortModalVisible}
onOk={() => { onOk={() => {
...@@ -934,23 +805,21 @@ class OperatePaper extends Component { ...@@ -934,23 +805,21 @@ class OperatePaper extends Component {
}} }}
onCancel={() => { onCancel={() => {
this.setState({ quickSortModalVisible: false }); this.setState({ quickSortModalVisible: false });
}} }}>
>
<Radio.Group <Radio.Group
onChange={(e) => onChange={(e) =>
this.setState({ this.setState({
sorterMethod: e.target.value, sorterMethod: e.target.value,
}) })
} }
value={sorterMethod} value={sorterMethod}>
> <Radio value={'addOrder'}>按添加顺序排序</Radio>
<Radio value={"addOrder"}>按添加顺序排序</Radio> <Radio value={'typeOrder'}>按题型排序</Radio>
<Radio value={"typeOrder"}>按题型排序</Radio>
</Radio.Group> </Radio.Group>
{sorterMethod === "typeOrder" && ( {sorterMethod === 'typeOrder' && (
<Table <Table
className="type-order-table" className='type-order-table'
style={{marginTop: '24px'}} style={{ marginTop: '24px' }}
showHeader={false} showHeader={false}
columns={typeColumns} columns={typeColumns}
dataSource={sorterTypeList} dataSource={sorterTypeList}
...@@ -963,16 +832,7 @@ class OperatePaper extends Component { ...@@ -963,16 +832,7 @@ class OperatePaper extends Component {
<Route <Route
path={`${match.url}/exam-operate-page`} path={`${match.url}/exam-operate-page`}
render={() => { render={() => {
return ( return <AddExam paperInfo={formData} type={currentOperate === 'edit' ? 'editPaperToAddExam' : 'newPaperToAddExam'} />;
<AddExam
paperInfo={formData}
type={
currentOperate === "edit"
? "editPaperToAddExam"
: "newPaperToAddExam"
}
/>
);
}} }}
/> />
</div> </div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment