fix score setter

master
zhengpengju 3 years ago
parent 4f481c96f6
commit 19ce053d35

@ -64,4 +64,7 @@ ol {
} }
.ant-pro-field-index-column-border{ .ant-pro-field-index-column-border{
background-color: #999 !important; background-color: #999 !important;
}
main{
min-width: 1024px;
} }

@ -43,6 +43,7 @@ export default () => {
const [questionTypeValues, setQuestionTypeValues] = useState([]); // 题型数据[{count:0, score:0, score_harf:0}] const [questionTypeValues, setQuestionTypeValues] = useState([]); // 题型数据[{count:0, score:0, score_harf:0}]
const [questionType, setQuestionType] = useState([]); // 题型 const [questionType, setQuestionType] = useState([]); // 题型
const [passScore, setPassScore] = useState(0)
const [rulesId, setRulesId] = useState(0); // 规则id, 保存新建的rules_id const [rulesId, setRulesId] = useState(0); // 规则id, 保存新建的rules_id
const [subjectId, setSubjectId] = useState<number>(0); // 关联主题id const [subjectId, setSubjectId] = useState<number>(0); // 关联主题id
@ -480,7 +481,7 @@ export default () => {
key="primary" key="primary"
onClick={async () => { onClick={async () => {
/** 获取试卷 */ /** 获取试卷 */
const {question_type_score} = await queryRulesPaper( const {question_type_score, question_list} = await queryRulesPaper(
{ {
rules_id: params?.id || rulesId, rules_id: params?.id || rulesId,
page_number: 1, page_number: 1,
@ -488,6 +489,7 @@ export default () => {
} }
); );
console.log('_data:', question_type_score) console.log('_data:', question_type_score)
setPassScore(question_list[0]?.pass_score)
//questionTypeValues?.map((item,idx)=>{return {...item, score:values[idx]?.score, score_harf:values[idx]?.score_harf}}) //questionTypeValues?.map((item,idx)=>{return {...item, score:values[idx]?.score, score_harf:values[idx]?.score_harf}})
//setQuestionTypeValues() // 更新分值成功后设置组件分值 //setQuestionTypeValues() // 更新分值成功后设置组件分值
handleScoreModalVisible(true) handleScoreModalVisible(true)
@ -660,7 +662,7 @@ export default () => {
return true; return true;
}} }}
> >
<ScoreSetter ref={setterRef} questionTypeValues={questionTypeValues || false} /> <ScoreSetter ref={setterRef} questionTypeValues={questionTypeValues || false} passScore={passScore} />
</ModalForm> </ModalForm>
<ModalForm <ModalForm
// title={`试卷详情`} // title={`试卷详情`}

@ -1,23 +1,15 @@
/** 模拟考试 | 资质考试选题 */ /** 模拟考试 | 资质考试选题 */
//import { AlignLeftOutlined, PlusOutlined } from '@ant-design/icons';
import { Button, InputNumber, message, Space, Form, Input} from 'antd'; import { InputNumber, Space, Form, Input} from 'antd';
//import { FooterToolbar, PageContainer } from '@ant-design/pro-layout'; //import styles from '../style.less';
//import { useRequest } from 'umi'; import { forwardRef, useImperativeHandle, useRef, useState } from 'react';
//import { queryFakeList } from './service'; //import { useParams, useRequest, history, useRouteMatch } from 'umi';
//import type { CardListItemDataType } from './data'; //import { queryCourseView } from '@/pages/course/option/service';
import styles from '../style.less'; import { queryQuestionType } from '@/pages/questionbank/service';
//import SubMenu from 'antd/lib/menu/SubMenu';
//import ProCard from '@ant-design/pro-card';
//import ProList from '@ant-design/pro-list';
import { forwardRef, ReactText, useEffect, useImperativeHandle, useRef, useState } from 'react';
//import { PlusOutlined, DeleteOutlined, DownloadOutlined, UploadOutlined, EditOutlined, EyeOutlined, EyeInvisibleOutlined, DownOutlined } from '@ant-design/icons';
import { useParams, useRequest, history, useRouteMatch } from 'umi';
import { queryCourseView } from '@/pages/course/option/service';
import { queryQuestionList, queryQuestionType } from '@/pages/questionbank/service';
//import ProForm, { ProFormSelect } from '@ant-design/pro-form'; //import ProForm, { ProFormSelect } from '@ant-design/pro-form';
import { ActionType, EditableProTable, ProColumns } from '@ant-design/pro-table'; //import { ActionType, EditableProTable, ProColumns } from '@ant-design/pro-table';
import ProTable from '@ant-design/pro-table'; import ProTable from '@ant-design/pro-table';
import ProForm from '@ant-design/pro-form'; //import ProForm from '@ant-design/pro-form';
export type TableListItem = { export type TableListItem = {
id: string; id: string;
@ -33,29 +25,18 @@ export type TableListItem = {
// React.forwardRef 接受渲染函数作为参数。React 将使用 props 和 ref 作为参数来调用此函数。此函数应返回 React 节点。 // React.forwardRef 接受渲染函数作为参数。React 将使用 props 和 ref 作为参数来调用此函数。此函数应返回 React 节点。
const ScoreSetter = (props: any, ref: any) => { const ScoreSetter = (props: any, ref: any) => {
const [flag, setFlag] = useState([]) // 分数变更标记
const {questionTypeValues } = props const {questionTypeValues, passScore: passScoreValue } = props
const [typeScore, setTypeScore] = useState(questionTypeValues.map((item: { code: number; score: number; score_harf: number; })=>({question_type:item.code, score: item.score, score_harf: item.score_harf}))) ; // 题型分数数组 [{"question_type": "0","score": "3","score_harf": "0"},]
console.log('questionTypeValues::::::::::', questionTypeValues)
//console.log('passScoreValue:::', passScoreValue)
const match = useRouteMatch();
console.log('match', match);
const [typeScore, setTypeScore] = useState(questionTypeValues.map(item=>({question_type:item.code, score: item.score, score_harf: item.score_harf}))) ; // 题型分数数组 [{"question_type": "0","score": "3","score_harf": "0"},]
//const type = history.location.pathname === '/questionbank/attestation' ? 1 : 0 ; // 题库类型 //const type = history.location.pathname === '/questionbank/attestation' ? 1 : 0 ; // 题库类型
const [dataSource, setDataSource] = useState([]);
//const [selectedRowsState, setSelectedRows] = useState<API.RuleListItem[]>([]); //const [selectedRowsState, setSelectedRows] = useState<API.RuleListItem[]>([]);
//const [addType, setAddType] = useState({name: '', value: 0}); //const [addType, setAddType] = useState({name: '', value: 0});
const [sumScore, setSumScore] = useState(0); //const [sumScore, setSumScore] = useState();
const [passScore, setPassScore] = useState(0); // 设置通过分数线 const [passScore, setPassScore] = useState(passScoreValue); // 设置通过分数线
//let sumScore = 0 // 总分 //let sumScore = 0 // 总分
console.log('init........', typeScore) //console.log('init........', typeScore)
const formRef = useRef(); const formRef = useRef<any>();
//setTypeScore(questionTypeValues) // 初始化分值
//const actionRef = useRef<ActionType>();
/** 列表项定义 */ /** 列表项定义 */
const columns: any = [ const columns: any = [
@ -70,7 +51,7 @@ const ScoreSetter = (props: any, ref: any) => {
dataIndex: 'score', dataIndex: 'score',
key: 'code', key: 'code',
width: 400, width: 400,
render: (text, record, index) => render: (_text: any, record: { code: number; }, index: string | number) =>
<Space direction='horizontal'> <Space direction='horizontal'>
<span></span> <span></span>
<Form.Item style={{margin:0}} name={`score[${index}]`}><Input <Form.Item style={{margin:0}} name={`score[${index}]`}><Input
@ -89,13 +70,13 @@ const ScoreSetter = (props: any, ref: any) => {
size="small" size="small"
onChange={(e)=>{ onChange={(e)=>{
const value = e.currentTarget.value; const value = e.currentTarget.value;
console.log('row', index) const scoreData = typeScore?.map((item: { score: any; }, key: string | number)=>{
console.log('v1',value)
const scoreData = typeScore?.map((item, key)=>{
return {...item, score: ((index === key) ? Number(value) : Number(item?.score))} // 题型分数 return {...item, score: ((index === key) ? Number(value) : Number(item?.score))} // 题型分数
}) })
console.log('question',questionTypeValues) // 标记重新设置项(序号)
console.log('scoreData-----------------',scoreData) if(flag.indexOf(index) === -1){
setFlag([...flag, index])
}
setTypeScore(scoreData) setTypeScore(scoreData)
}}/></Form.Item> }}/></Form.Item>
<span></span> <span></span>
@ -113,8 +94,7 @@ const ScoreSetter = (props: any, ref: any) => {
><InputNumber min={0} max={99} maxLength={2} type="number" defaultValue={questionTypeValues ? questionTypeValues[index]?.score_harf : 0} placeholder="请输入" size="small" name='score_harf' onChange={(value)=>{ ><InputNumber min={0} max={99} maxLength={2} type="number" defaultValue={questionTypeValues ? questionTypeValues[index]?.score_harf : 0} placeholder="请输入" size="small" name='score_harf' onChange={(value)=>{
// //
const _data = []; const _data = [];
console.log('typeScore',typeScore) typeScore?.forEach((item: { score_harf: any; }, key: number)=>{
typeScore?.forEach((item, key)=>{
_data.push({...item, score_harf: ((index === key) ? value : item?.score_harf)}) _data.push({...item, score_harf: ((index === key) ? value : item?.score_harf)})
}) })
setTypeScore(_data) setTypeScore(_data)
@ -128,118 +108,93 @@ const ScoreSetter = (props: any, ref: any) => {
title: '题目数量', title: '题目数量',
dataIndex: 'count', dataIndex: 'count',
width: 80, width: 80,
render: (text, _, index) => <>{questionTypeValues ? questionTypeValues[index]?.count : '0'}</>, render: (_text: any, _: any, index: number) => <>{questionTypeValues ? questionTypeValues[index]?.count : '0'}</>,
/*
editable: (text, record, index) => {
return true;
},*/
}, },
{ {
title: '总分值', title: '总分值',
dataIndex: 'score_sum', dataIndex: 'score_sum',
//key: 'age', //key: 'age',
width: 80, width: 80,
render: (text, _, index) => { defaultValue:()=>{ return 123},
{/*console.log('typeScore---', typeScore)*/} render: (_text: any, _: any, index: number) => {
//console.log('typeScore---', typeScore)
//console.log('questionTypeValues',questionTypeValues)
//console.log('==score==',typeScore)
return <> return <>
{(typeScore && questionTypeValues) ? ((typeScore[index]?.score > 0 ? typeScore[index]?.score : 0) * questionTypeValues[index]?.count).toFixed(1) : '0'} {flag?.indexOf(index) === -1 ?
questionTypeValues[index]?.score * questionTypeValues[index].count :
(typeScore && questionTypeValues) ? ((typeScore[index]?.score > 0 ? typeScore[index]?.score : 0) * questionTypeValues[index]?.count).toFixed(1) : '0'
}
</> </>
}, },
} }
]; ];
//const labels = ['A','B','C','D','E']
/** 获取总题数 */ /** 获取总题数 */
let sumQuestion = 0; let sumQuestion = 0;
questionTypeValues?.forEach((item) => { questionTypeValues?.forEach((item: any) => {
sumQuestion += item.count; sumQuestion += item.count;
}); });
// 获取题型
const { data } = useRequest(() => {
return queryQuestionType();
},{
formatResult: (result) => {
const _data = [];
if(result.list){
result.list.forEach((item)=>{
_data.push({
name: item?.name,
code: item?.code,
count: 0,
score_sum: 0,
harf: 0
})
})
}
console.log('_data',_data)
return _data;
}
});
useEffect(() => {
setDataSource(data);
console.log('data', data)
const _typeScore = [];
data?.forEach((item)=>{
_typeScore.push({question_type: item?.code, score: item?.count, score_harf: 0})
})
setTypeScore(_typeScore) // 初始值
//return ()=>{}
}, [data]);
/** 计算总分 */
useEffect(() => {
console.log('typeScore', typeScore)
let _sum = 0;
typeScore?.forEach((item, index)=>{
_sum += (item.score > 0 ? item.score : 0 ) * questionTypeValues[index]?.count;
})
setSumScore(_sum)
//return ()=>{}
}, [typeScore]);
// 暴露组件的方法 接受外部获取的ref // 暴露组件的方法 接受外部获取的ref
useImperativeHandle(ref, () => ({ useImperativeHandle(ref, () => ({
// 构造ref的获取数据方法 // 构造ref的获取数据方法
getData: () => { getData: () => {
return typeScore?.map((item, idx)=>{return {...item, count: questionTypeValues[idx]?.count, sum: item?.score * questionTypeValues[idx]?.count}}); return typeScore?.map((item: any, idx: number)=>{
return {
...item,
count: questionTypeValues[idx]?.count,
sum: item?.score * questionTypeValues[idx]?.count,
}
})
}, },
getValue: () => { getValue: () => {
return passScore; return passScore
}, },
getSum: () => { getSum: () => {
console.log('getSum', sumScore) return typeScore?.map((item: any, key: number)=>{return item?.score * questionTypeValues[key].count})?.reduce((total: number, item: number)=>(total + item)) || 0 ;
return sumScore;
}, },
})); }));
return ( return (
<Form <>
ref={formRef} <Form
> ref={formRef}
<EditableProTable >
title={()=>{ <ProTable
return <Space size="large"><span> {sumQuestion} ,</span><span> {sumScore} </span> 线 title={()=>{
<Form.Item style={{margin:0}} name='pass_socre' initialValue={0}><InputNumber min={0} onChange={(value)=>{ return <Space size="large"><span> {sumQuestion} ,</span><span> {
setPassScore(value) typeScore?.map((item: any, key: number)=>{return item?.score * questionTypeValues[key].count})?.reduce((total: number, item: number)=>(total + item)) || 0
}} /></Form.Item> } </span> 线
</Space>}} <Form.Item style={{margin:0}} name='pass_socre' initialValue={passScore}><InputNumber min={0} onChange={(value)=>{
//formMapRef={formMapRef} setPassScore(value)
//rowKey={'code'} }} /></Form.Item>
bordered </Space>}}
cardProps={{bodyStyle:{padding:0}}} //formMapRef={formMapRef}
recordCreatorProps={false} rowKey={'code'}
search={false} request={async ()=>{
options={false} const result = await queryQuestionType() // 从字典获取题型数据 [{code: 0, name:"单选题"},]
value={dataSource} setTypeScore(questionTypeValues?.map((item: { score: any; score_harf: any; }, key: number)=>{
columns={columns} return {question_type: result.list[key]?.code, score: item?.score, score_harf: (item?.score_harf || 0)}
/> }))
</Form> return {data:questionTypeValues?.map((item: any, key: number)=>({
...item,
code: result.list[key]?.code,
question_type: result.list[key]?.code,
name: result.list[key]?.name,
count: result.list[key]?.count
}))}
}}
bordered
cardProps={{bodyStyle:{padding:0}}}
search={false}
options={false}
columns={columns}
pagination={false}
/>
</Form>
</>
); );
}; };
// forwardRef这个组件能够将其接受的 ref 属性转发到其组件树下 // forwardRef这个组件能够将其接受的 ref 属性转发到其组件树下

@ -276,7 +276,7 @@ export default () => {
}); });
ruleData = data ruleData = data
} }
console.log(ruleData, 'ruleData'); console.log('ruleData', ruleData);
return ( return (
<PageContainer content={''} extraContent={''}> <PageContainer content={''} extraContent={''}>
@ -600,27 +600,50 @@ export default () => {
<div style={{ background: '#ffffff', padding: 24 }}> <div style={{ background: '#ffffff', padding: 24 }}>
<Space direction="vertical" style={{ width: '100%' }}> <Space direction="vertical" style={{ width: '100%' }}>
<strong></strong> <strong></strong>
<Typography> {questions?.length} {paperInfo?.sum_score || '-'}{ console.log('scoreData', scoreData)} </Typography> <Typography> {questions?.length} {/*paperInfo?.sum_score || 0*/} {
questionType?.length > 0 ?
questionType?.map((item) => {
return typeQuestionCount[Number(item.code)] * scoreData?.filter(val=>(val.question_type === Number(item?.code)))[0]?.score || 0;
}).reduce((total, item)=>(total + item)) : 0
} </Typography>
<Divider style={{ margin: '6px 0', opacity: 0.5 }} /> <Divider style={{ margin: '6px 0', opacity: 0.5 }} />
<Space direction="vertical"> <Space direction="vertical">
{questionType.map((item) => { {questionType.map((item) => {
return <Typography>{item?.name} {typeQuestionCount[Number(item.code)]} {typeQuestionCount[Number(item.code)] * scoreData?.filter(val=>(val.question_type === Number(item?.code)))[0]?.score || 0} </Typography> const type_sum = typeQuestionCount[Number(item.code)] * scoreData?.filter(val=>(val.question_type === Number(item?.code)))[0]?.score || 0;
return <Typography>{item?.name} {typeQuestionCount[Number(item.code)]} {type_sum} </Typography>
} }
)} )}
</Space> </Space>
<Divider style={{ margin: '6px 0', opacity: 0.5 }} /> <Divider style={{ margin: '6px 0', opacity: 0.5 }} />
<Button size="large" block onClick={() => { <Button size="large" block onClick={async () => {
const {question_type_score} = await queryQuestionTypeScore({rules_id: (params?.id || rulesId)})
console.log('q:::',question_type_score)
console.log('w:::',question_type_score?.map((item,key)=>({count: typeQuestionCount[key], ...item})))
setQuestionTypeValues(question_type_score?.map((item,key)=>({count: typeQuestionCount[key], ...item})))
/** /**
* *
* [{count: 0, score: 0, score_harf: 0},{count: 0, score: 0, score_harf: 0},{count: 0, score: 0, score_harf: 0}] * [{count: 0, score: 0, score_harf: 0},{count: 0, score: 0, score_harf: 0},{count: 0, score: 0, score_harf: 0}]
*/ */
// //
// 初始值
/*
const _data = [] const _data = []
typeQuestionCount?.forEach((item) => { typeQuestionCount?.forEach((item) => {
_data.push({ count: item, score: 0, score_harf: 0 }) _data.push({ count: item, score: 0, score_harf: 0 })
}) })
setQuestionTypeValues(_data) setQuestionTypeValues(_data)
console.log('typeQuestionCount', typeQuestionCount); */
/** */
//const questionTypeScore = await queryQuestionTypeScore(params?.id || rulesId)
//console.log('q::', questionTypeScore)
console.log('typeQuestionCount', typeQuestionCount);
setPassScore(ruleData?.pass_score)
handleScoreModalVisible(true) handleScoreModalVisible(true)
}}></Button> }}></Button>
<Tooltip defaultVisible={false} zIndex={1} title={<span style={{display:'block', width:152}}></span>} placement="bottom" color='#108ee9'> <Tooltip defaultVisible={false} zIndex={1} title={<span style={{display:'block', width:152}}></span>} placement="bottom" color='#108ee9'>
@ -775,8 +798,8 @@ export default () => {
handleScoreModalVisible(false) handleScoreModalVisible(false)
return true; return true;
}} }}
> >{console.log('q1',questionTypeValues)}{console.log('q2',scoreData)}
<ScoreSetter ref={setterRef} questionTypeValues={questionTypeValues || false} /> <ScoreSetter ref={setterRef} questionTypeValues={questionTypeValues || false} passScore={passScore} />
</ModalForm> </ModalForm>
</PageContainer> </PageContainer>

Loading…
Cancel
Save