diff --git a/admin/src/pages/examinationrules/normal/components/QuestionSelector.tsx b/admin/src/pages/examinationrules/normal/components/QuestionSelector.tsx new file mode 100644 index 0000000..d9042df --- /dev/null +++ b/admin/src/pages/examinationrules/normal/components/QuestionSelector.tsx @@ -0,0 +1,180 @@ +/** 资质考试 */ +//import { AlignLeftOutlined, PlusOutlined } from '@ant-design/icons'; +import { Switch, Button, Card, Col, List, Menu, Progress, Row, Typography, Space, Divider, Radio, Checkbox, Tag, Dropdown, Upload, Modal, Form } from 'antd'; +import { PageContainer } from '@ant-design/pro-layout'; +//import { useRequest } from 'umi'; +//import { queryFakeList } from './service'; +//import type { CardListItemDataType } from './data'; +import styles from '../style.less'; +//import SubMenu from 'antd/lib/menu/SubMenu'; +//import ProCard from '@ant-design/pro-card'; +import ProList from '@ant-design/pro-list'; +import { ReactText, useEffect, 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 { queryQuestionById, queryQuestionList, queryQuestionType } from '@/pages/questionbank/service'; +import ProForm, { ProFormSelect } from '@ant-design/pro-form'; +import ProTable, { ActionType, ProColumns } from '@ant-design/pro-table'; + +export type TableListItem = { + id: string; + code: number; + name: string; + creator: string; + status: string; + createdAt: number; + progress: number; + money: number; + memo: string; +}; + +//const { Paragraph } = Typography; + +console.log('first'); +const QuestionSelector = () => { + const actionRef = useRef(); + /** 列表项定义 */ + const columns: ProColumns[] | ProColumns[] = [ + { + title: '序号', + key: 'index', + valueType: 'indexBorder', + render: (text: React.ReactNode, _: any, index: number) => { + if (actionRef && actionRef?.current && actionRef?.current?.pageInfo) { + return `${(actionRef?.current?.pageInfo?.current - 1) * actionRef.current.pageInfo?.pageSize + (index + 1) + }`; + } else { + return ''; + } + }, + width: 48, + }, + { + title: '类型', + dataIndex: 'question_type', + valueType: 'select', + hideInTable: false, + hideInForm: true, + hideInSearch: false, + }, + { + title: '题干', + dataIndex: 'question_stem', + valueType: 'text', + hideInTable: false, + hideInForm: true, + hideInSearch: false, + }, + ]; + const match = useRouteMatch(); + console.log('match', match); + + const type = history.location.pathname === '/questionbank/attestation' ? 1 : 0 ; // 题库类型 + + const [questionType, setQuestionType] = useState([]); + + + const [createModalVisible, handleCreateModalVisible] = useState(false); + const [selectedRowsState, setSelectedRows] = useState([]); + const [expandedDescRowKeys, setExpandedDescRowKeys] = useState([]); // 展开解析设置 + const [addType, setAddType] = useState({name: '', value: 0}); + + const labels = ['A','B','C','D','E'] + + /** 获取题型 */ + const { data } = useRequest(() => { + return queryQuestionType(); + },{ + formatResult: (result) => { + return result.list; + } + }); +/* + const { data: template } = useRequest(() => { + return exportQuestionTemplate(); + }); + */ + useEffect(() => { + setQuestionType(data || []); + return ()=>{ + /** 退出当前页面清空Map */ + //parsingMap.clear(); + } + }, [data]); + + return ( + { + console.log('value', value) + /* + const { create_time } = value; + if (create_time) { + value.begin_time = create_time[0] + value.end_time = create_time[1] + }*/ + const questions = await queryQuestionList({ + ...value, + type: type, + page_number: value?.current || 1, + page_size: value?.pageSize, + }); + // 课程名称及课程标签 + const data = [] + for(let i=0; i { + setSelectedRows(selectedRows); + }, + }} + columns={columns} + // grid={{ gutter: 16, column: 1 }} + + metas={{ + title: { + dataIndex: 'question_stem', + render: (text: React.ReactNode, record: T, index: number) => `1. ${text}`, + }, + avatar: { + dataIndex: 'question_type', + valueType: 'text', + render: (text: React.ReactNode, record: T, index: number) => { + const type = questionType?.filter((item, idx, self)=>{ + return item?.code === record.question_type + }); + return `[${type[0]?.name}]` + }, + }, + description: { + }, + + }} + /> + + ); +}; + +export default QuestionSelector; diff --git a/admin/src/pages/examinationrules/normal/index.tsx b/admin/src/pages/examinationrules/normal/index.tsx index ce30577..d70905e 100644 --- a/admin/src/pages/examinationrules/normal/index.tsx +++ b/admin/src/pages/examinationrules/normal/index.tsx @@ -112,7 +112,7 @@ const ExaminationRules: React.FC = () => { width: 48, }, { - title: '规则名称', + title: '模拟考试名称', dataIndex: 'rules_name', valueType: 'text', hideInTable: false, diff --git a/admin/src/pages/examinationrules/normal/step/index.tsx b/admin/src/pages/examinationrules/normal/step/index.tsx index 8ecaf02..49336ae 100644 --- a/admin/src/pages/examinationrules/normal/step/index.tsx +++ b/admin/src/pages/examinationrules/normal/step/index.tsx @@ -1,4 +1,4 @@ -import React, { useRef } from 'react'; +import React, { useRef, useState } from 'react'; import { history, useParams, useRequest } from 'umi'; import type { ProFormInstance } from '@ant-design/pro-form'; import { ProFormRadio } from '@ant-design/pro-form'; @@ -12,11 +12,16 @@ import ProForm, { ProFormDateRangePicker, } from '@ant-design/pro-form'; import ProCard from '@ant-design/pro-card'; -import { Button, Checkbox, Col, Divider, List, Menu, message, Radio, Row, Space, Typography } from 'antd'; +import { Button, Checkbox, Col, Divider, Dropdown, List, Menu, message, Modal, Radio, Row, Space, Typography, Upload } from 'antd'; import { PageContainer } from '@ant-design/pro-layout'; import ProDescriptions from '@ant-design/pro-descriptions'; import styles from './index.less' import { saveRules, querySubjectList, queryRulesView } from '../../service'; +import { queryCourseView } from '@/pages/course/option/service'; +import { queryQuestionList, queryQuestionById } from '@/pages/questionbank/service'; +import { PlusOutlined, DownOutlined, DeleteOutlined, DownloadOutlined, UploadOutlined, EyeInvisibleOutlined, EyeOutlined, EditOutlined } from '@ant-design/icons'; +import ProList from '@ant-design/pro-list'; +import QuestionSelector from '../components/QuestionSelector'; const waitTime = (time: number = 100) => { @@ -31,11 +36,14 @@ for (let i = 0; i < 50; i++) { numbers.push({ id: `${i}` }) } export default () => { + + const [selectorModalVisible, handleSelectorModalVisible] = useState(false); + const formRef = useRef(); const params = useParams(); console.log(params, 'params'); let ruleData = {} - if (params.id) { + if (params?.id) { console.log(JSON.stringify(params), "878"); const { data } = useRequest(async () => { @@ -223,7 +231,9 @@ export default () => { 判断题 共 { } 题 { } 分 - + @@ -276,6 +286,19 @@ export default () => { + { + handleSelectorModalVisible(false); + }} + footer={null} + > + + ); diff --git a/admin/src/pages/examinationrules/normal/step/style.less b/admin/src/pages/examinationrules/normal/step/style.less new file mode 100644 index 0000000..a59b424 --- /dev/null +++ b/admin/src/pages/examinationrules/normal/step/style.less @@ -0,0 +1,23 @@ +@import '~antd/es/style/themes/default.less'; +.questionbank{ + :global { + .ant-list-split.ant-list-something-after-last-item .ant-spin-container > .ant-list-items > .ant-list-item:last-child{ + border: none; + } + .questionbank-list-item{ + //background: #f0f0f0; + border: solid 1px #f0f0f0 !important; + margin: 15px 0; + } + .ant-list-vertical .ant-list-item-action{ + padding: 0 !important; + margin: 0 -18px -12px -24px !important; + } + .ant-list-item-action li{ + padding: 10px 18px; + background: #f0f0f0; + display: inline-block; + width: 100%; + } + } +} diff --git a/admin/src/pages/questionbank/index.tsx b/admin/src/pages/questionbank/index.tsx index 0a00f3a..30ee1cb 100644 --- a/admin/src/pages/questionbank/index.tsx +++ b/admin/src/pages/questionbank/index.tsx @@ -1,6 +1,6 @@ /** 资质考试 */ //import { AlignLeftOutlined, PlusOutlined } from '@ant-design/icons'; -import { Switch, Button, Card, Col, List, Menu, Progress, Row, Typography, Space, Divider, Radio, Checkbox, Tag, Dropdown, Upload } from 'antd'; +import { Switch, Button, Card, Col, List, Menu, Progress, Row, Typography, Space, Divider, Radio, Checkbox, Tag, Dropdown, Upload, Modal, Form } from 'antd'; import { PageContainer } from '@ant-design/pro-layout'; //import { useRequest } from 'umi'; //import { queryFakeList } from './service'; @@ -9,11 +9,16 @@ import styles from './style.less'; //import SubMenu from 'antd/lib/menu/SubMenu'; //import ProCard from '@ant-design/pro-card'; import ProList from '@ant-design/pro-list'; -import { ReactText, useEffect, useState } from 'react'; +import { ReactText, useEffect, useRef, useState } from 'react'; import { PlusOutlined, DeleteOutlined, DownloadOutlined, UploadOutlined, EditOutlined, EyeOutlined, EyeInvisibleOutlined, DownOutlined } from '@ant-design/icons'; import { exportQuestionTemplate, queryQuestionById, queryQuestionList, queryQuestionType } from './service'; import { useParams, useRequest, history, useRouteMatch } from 'umi'; -import { queryCourseView } from '@/pages/course/option/service'; +import { queryCourseListByTag, queryCourseView, queryTagList } from '@/pages/course/option/service'; +import ProForm, { BetaSchemaForm, ProFormList, ProFormSelect, ProFormText } from '@ant-design/pro-form'; +import { DataItem } from '../dashboard/analysis/data'; +import { ActionType, ProColumns } from '@ant-design/pro-table'; +import ProFormRichEdit from '../course/subject/components/ProFormRichEdit'; +import { TableListItem } from '../course/option/data'; //const { Paragraph } = Typography; const parsingMap = new Map() @@ -23,14 +28,198 @@ const QuestionBank = () => { console.log('match', match); const type = history.location.pathname === '/questionbank/attestation' ? 1 : 0 ; // 题库类型 + const actionRef = useRef(); + /** 表单项定义 */ + const columns: ProColumns[] = [ + { + title: '标签', + valueType: 'select', + dataIndex: 'tags', + sorter: false, + hideInTable: true, + hideInForm: false, + hideInSearch: true, + fieldProps: { + mode: "multiple" + }, + renderText: (val: string) => `${val}`, + request: async () => { + const { data: Items } = await queryTagList({}); + console.log('queryTagList...') + const tags = [] + for (let i = 0; i < Items.length; i++) { + tags.push({ label: Items[i].tag_name, value: Items[i].tag_id }) + } + console.log(tags, 'tags:::'); + return tags; + }, + }, + { + title: '课程', + valueType: 'select', + dataIndex: 'course_ids', + sorter: false, + hideInTable: false, + hideInForm: false, + hideInSearch: true, + fieldProps: { + mode: "multiple" + }, + formItemProps: { + rules: [ + { + required: true, + message: '请填选择课程', + }, + ] + }, + renderText: (val: string) => `${val}`, + dependencies: ['tags'], + request: async (params) => { + const {tags} = params; + const { data: Items } = await queryCourseListByTag({tag_ids: tags?.toString()}); + console.log('queryCourseListByTag...') + const courses = [] + for (let i = 0; i < Items?.length; i++) { + courses.push({ label: Items[i]?.course_name, value: Items[i]?.course_id }) + } + console.log(courses, 'courses:::'); + return courses; + }, + }, + { + title: '题干', + dataIndex: 'question_stem', + valueType: 'text', + hideInTable: false, + hideInDescriptions: false, + hideInForm: false, + hideInSearch: true, + formItemProps: { + rules: [ + { + required: true, + message: '请填题干内容', + }, + ] + }, + }, + { + title: '选项', + dataIndex: 'answers', + valueType: 'text', + sorter: false, + hideInTable: false, + hideInForm: false, + hideInSearch: true, + renderFormItem: (item, { defaultRender, ...rest }, form) => ( + { + return {doms}; + }} + > + {(f, index, action) => { + console.log(f, index, action); + return ( + + ) + }} + + ) + /* + formItemProps: { + rules: [ + { + required: true, + message: '请填写试题解析', + }, + ] + },*/ + }, + { + title: '答案', + dataIndex: 'answertrue', + valueType: 'text', + sorter: false, + hideInTable: false, + hideInForm: false, + hideInSearch: true, + renderFormItem: (item, { defaultRender, ...rest }, form) => ( + + ) + /* + formItemProps: { + rules: [ + { + required: true, + message: '请填写试题解析', + }, + ] + },*/ + }, + { + title: '解析', + dataIndex: 'chapter_describe', + valueType: 'textarea', + sorter: false, + hideInTable: false, + hideInForm: false, + hideInSearch: true, + formItemProps: { + rules: [ + { + required: true, + message: '请填写试题解析', + }, + ] + }, + renderText: (val: string) => (
), + renderFormItem: (item, { defaultRender, ...rest }, form) => ( + + ), + }, + + ] const [questionType, setQuestionType] = useState([]); const [parsing, setParsing] = useState(); - + + const [createModalVisible, handleCreateModalVisible] = useState(false); const [selectedRowsState, setSelectedRows] = useState([]); const [expandedDescRowKeys, setExpandedDescRowKeys] = useState([]); // 展开解析设置 - const [addType, setAddType] = useState(0); + const [addType, setAddType] = useState({name: '', value: 0}); const labels = ['A','B','C','D','E'] @@ -74,13 +263,19 @@ const QuestionBank = () => { }) } const menu = ( - setAddType(value)}> + { + console.log('menu11', value); + console.log('menu11', value.key); + console.log('menuquestionType', ); + setAddType({ name: questionType[Number(value?.key)]?.name, value: Number(value?.key)}); + handleCreateModalVisible(true); + }}> {menuItems} ); return [ - , @@ -299,6 +494,49 @@ const QuestionBank = () => { }, }} /> + { + handleCreateModalVisible(false); + }} + footer={null} + > + + layout="horizontal" + layoutType="Form" + labelCol={{ span: 8 }} + wrapperCol={{ span: 12 }} + onFinish={async (values: any) => { + // 表单处理 + console.log('columns:', columns); + console.log('values:', values); + const success = await handleAddChapter({ + ...values, + subject_id: params?.id || 0, + }); + if(success){ + handleCreateModalVisible(false); + actionRef.current?.reloadAndRest?.(); + } + }} + submitter={{ + render: (props, doms) => ( + + + {doms} + + + ), + }} + // action = '' + title="新建" + columns={columns} + /> + ); };