Merge branch 'master' of http://10.10.14.176:3000/web/syzx
commit
7890ee9dd0
@ -0,0 +1,105 @@
|
||||
import type { FC } from 'react';
|
||||
import {
|
||||
ModalForm,
|
||||
ProFormSelect,
|
||||
ProFormDateTimePicker,
|
||||
ProFormText,
|
||||
ProFormTextArea,
|
||||
} from '@ant-design/pro-form';
|
||||
import type { BasicListItemDataType } from '../data';
|
||||
import styles from '../style.less';
|
||||
import { Button, Result } from 'antd';
|
||||
|
||||
type OperationModalProps = {
|
||||
done: boolean;
|
||||
visible: boolean;
|
||||
current: Partial<BasicListItemDataType> | undefined;
|
||||
onDone: () => void;
|
||||
onSubmit: (values: BasicListItemDataType) => void;
|
||||
};
|
||||
|
||||
const OperationModal: FC<OperationModalProps> = (props) => {
|
||||
const { done, visible, current, onDone, onSubmit, children } = props;
|
||||
if (!visible) {
|
||||
return null;
|
||||
}
|
||||
return (
|
||||
<ModalForm<BasicListItemDataType>
|
||||
visible={visible}
|
||||
title={done ? null : `任务${current ? '编辑' : '添加'}`}
|
||||
className={styles.standardListForm}
|
||||
width={640}
|
||||
onFinish={async (values) => {
|
||||
onSubmit(values);
|
||||
}}
|
||||
initialValues={current}
|
||||
submitter={{
|
||||
render: (_, dom) => (done ? null : dom),
|
||||
}}
|
||||
trigger={<>{children}</>}
|
||||
modalProps={{
|
||||
onCancel: () => onDone(),
|
||||
destroyOnClose: true,
|
||||
bodyStyle: done ? { padding: '72px 0' } : {},
|
||||
}}
|
||||
>
|
||||
{!done ? (
|
||||
<>
|
||||
<ProFormText
|
||||
name="title"
|
||||
label="任务名称"
|
||||
rules={[{ required: true, message: '请输入任务名称' }]}
|
||||
placeholder="请输入"
|
||||
/>
|
||||
<ProFormDateTimePicker
|
||||
name="createdAt"
|
||||
label="开始时间"
|
||||
rules={[{ required: true, message: '请选择开始时间' }]}
|
||||
fieldProps={{
|
||||
style: {
|
||||
width: '100%',
|
||||
},
|
||||
}}
|
||||
placeholder="请选择"
|
||||
/>
|
||||
<ProFormSelect
|
||||
name="owner"
|
||||
label="任务负责人"
|
||||
rules={[{ required: true, message: '请选择任务负责人' }]}
|
||||
options={[
|
||||
{
|
||||
label: '付晓晓',
|
||||
value: 'xiao',
|
||||
},
|
||||
{
|
||||
label: '周毛毛',
|
||||
value: 'mao',
|
||||
},
|
||||
]}
|
||||
placeholder="请选择管理员"
|
||||
/>
|
||||
<ProFormTextArea
|
||||
name="subDescription"
|
||||
label="产品描述"
|
||||
rules={[{ message: '请输入至少五个字符的产品描述!', min: 5 }]}
|
||||
placeholder="请输入至少五个字符"
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
<Result
|
||||
status="success"
|
||||
title="操作成功"
|
||||
subTitle="一系列的信息描述,很短同样也可以带标点。"
|
||||
extra={
|
||||
<Button type="primary" onClick={onDone}>
|
||||
知道了
|
||||
</Button>
|
||||
}
|
||||
className={styles.formResult}
|
||||
/>
|
||||
)}
|
||||
</ModalForm>
|
||||
);
|
||||
};
|
||||
|
||||
export default OperationModal;
|
@ -0,0 +1,189 @@
|
||||
/** 模拟考试 */
|
||||
//import { AlignLeftOutlined, PlusOutlined } from '@ant-design/icons';
|
||||
import { Button, message } from 'antd';
|
||||
//import { FooterToolbar, 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 { 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 type { ActionType, ProColumns } from '@ant-design/pro-table';
|
||||
import ProTable from '@ant-design/pro-table';
|
||||
import { manualPaper } from '../service';
|
||||
|
||||
export type TableListItem = {
|
||||
id: string;
|
||||
code: number;
|
||||
name: string;
|
||||
creator: string;
|
||||
status: string;
|
||||
createdAt: number;
|
||||
progress: number;
|
||||
money: number;
|
||||
memo: string;
|
||||
};
|
||||
|
||||
// React.forwardRef 接受渲染函数作为参数。React 将使用 props 和 ref 作为参数来调用此函数。此函数应返回 React 节点。
|
||||
const QuestionSelector = (props: any, ref: any) => {
|
||||
|
||||
const actionRef = useRef<ActionType>();
|
||||
/** 列表项定义 */
|
||||
const columns: ProColumns<TableListItem>[] | ProColumns<TableListItem>[] = [
|
||||
{
|
||||
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,
|
||||
width: 100,
|
||||
request: async () => {
|
||||
const { list: Items } = await queryQuestionType();
|
||||
const types = []
|
||||
for (let i = 0; i < Items.length; i++) {
|
||||
types.push({text: Items[i]?.name, label: Items[i]?.name, value: Items[i]?.code })
|
||||
}
|
||||
return types;
|
||||
},
|
||||
render: (text: React.ReactNode, _: any, index: number) => {
|
||||
return text;
|
||||
},
|
||||
|
||||
},
|
||||
{
|
||||
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 [selectedRowsState, setSelectedRows] = useState<API.RuleListItem[]>([]);
|
||||
const [addType, setAddType] = useState({name: '', value: 0});
|
||||
|
||||
const labels = ['A','B','C','D','E']
|
||||
|
||||
/** 获取题型 */
|
||||
const { data } = useRequest(() => {
|
||||
return queryQuestionType();
|
||||
},{
|
||||
formatResult: (result) => {
|
||||
return result.list;
|
||||
}
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
setQuestionType(data || []);
|
||||
return ()=>{
|
||||
}
|
||||
}, [data]);
|
||||
|
||||
// 暴露组件的方法 接受外部获取的ref
|
||||
useImperativeHandle(ref, () => ({
|
||||
// 构造ref的获取数据方法
|
||||
getSelectedRows: () => {
|
||||
return selectedRowsState;
|
||||
},
|
||||
}));
|
||||
return (
|
||||
<>
|
||||
<ProTable
|
||||
pagination={{
|
||||
defaultPageSize: 10,
|
||||
showSizeChanger: false,
|
||||
}}
|
||||
actionRef={actionRef}
|
||||
toolBarRender={false}
|
||||
rowKey="id"
|
||||
headerTitle={false}
|
||||
tooltip={false}
|
||||
request={async (value) => {
|
||||
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<questions?.table_List.length; i++){
|
||||
const { data: course } = await queryCourseView({
|
||||
course_id: questions?.table_List[i]?.course_id
|
||||
});
|
||||
data[i] = {...questions?.table_List[i], course_name:course?.course_name, tag_name:course?.tag_name, };
|
||||
}
|
||||
return {
|
||||
current: questions?.pageNumber,
|
||||
data: data,
|
||||
pageSize: questions?.pageSize,
|
||||
success: true,
|
||||
total: questions?.totalRow || 0,
|
||||
};
|
||||
}}
|
||||
//dataSource={dataSource}
|
||||
rowSelection={{
|
||||
onChange: (_, selectedRows) => {
|
||||
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, _: number) => {
|
||||
const _type = questionType?.filter((item, idx, self)=>{
|
||||
return item?.code === record.question_type
|
||||
});
|
||||
return `[${_type[0]?.name}]`
|
||||
},
|
||||
},
|
||||
description: {
|
||||
},
|
||||
}}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
};
|
||||
// forwardRef这个组件能够将其接受的 ref 属性转发到其组件树下
|
||||
export default forwardRef( QuestionSelector );
|
Loading…
Reference in new issue