|
|
|
|
@ -1,207 +0,0 @@
|
|
|
|
|
/** 资质考试 */
|
|
|
|
|
//import { AlignLeftOutlined, PlusOutlined } from '@ant-design/icons';
|
|
|
|
|
import { Switch, Button, Card, Col, List, Menu, Progress, Row, Typography, Space, Divider, Radio, Checkbox, Tag, Dropdown } 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, useState } from 'react';
|
|
|
|
|
import { PlusOutlined, DeleteOutlined, DownloadOutlined, UploadOutlined, EditOutlined, EyeOutlined, EyeInvisibleOutlined, DownOutlined } from '@ant-design/icons';
|
|
|
|
|
//const { Paragraph } = Typography;
|
|
|
|
|
const QuestionBank = () => {
|
|
|
|
|
const [selectedRowsState, setSelectedRows] = useState<API.RuleListItem[]>([]);
|
|
|
|
|
const [expandedDescRowKeys, setExpandedDescRowKeys] = useState<readonly ReactText[]>([]); // 展开解析设置
|
|
|
|
|
const [addType, setAddType] = useState(0);
|
|
|
|
|
const numbers = [];
|
|
|
|
|
for(let i=0;i<50;i++){
|
|
|
|
|
numbers.push({id: `${i}`})
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const dataSource = [
|
|
|
|
|
{
|
|
|
|
|
id: 1,
|
|
|
|
|
name: '下面哪个词语能体现未来思维？',
|
|
|
|
|
type: '单选',
|
|
|
|
|
options: [
|
|
|
|
|
{label: '井底之蛙', value: 'A'},
|
|
|
|
|
{label: '鼠目寸光', value: 'B'},
|
|
|
|
|
{label: '未雨绸缪', value: 'C'},
|
|
|
|
|
{label: '即时行乐', value: 'D'},
|
|
|
|
|
],
|
|
|
|
|
|
|
|
|
|
time: '2022/12/12',
|
|
|
|
|
tag: '生涯理论',
|
|
|
|
|
course: '特质因素理论',
|
|
|
|
|
|
|
|
|
|
answer:'C',
|
|
|
|
|
desc: '该成语意思是天还没有下雨，先把门窗绑牢。比喻事先做好准备工作。该成语意思是天还没有下雨，先把门窗绑牢。比喻事先做好准备工作。该成语意思是天还没有下雨，先把门窗绑牢。比喻事先做好准备工作。该成语意思是天还没有下雨，先把门窗绑牢。比喻事先做好准备工作。',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
id: 2,
|
|
|
|
|
name: 'Ant Design',
|
|
|
|
|
type: '多选',
|
|
|
|
|
image:
|
|
|
|
|
'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg',
|
|
|
|
|
desc: '我是一条测试的描述',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
id: 3,
|
|
|
|
|
name: '蚂蚁金服体验科技',
|
|
|
|
|
type: '判断',
|
|
|
|
|
image:
|
|
|
|
|
'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg',
|
|
|
|
|
desc: '我是一条测试的描述',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
id: 4,
|
|
|
|
|
name: 'TechUI',
|
|
|
|
|
type: '单选',
|
|
|
|
|
image:
|
|
|
|
|
'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg',
|
|
|
|
|
desc: '我是一条测试的描述',
|
|
|
|
|
},
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<PageContainer content={false} extraContent={false} className={styles.questionbank}>
|
|
|
|
|
<ProList<any>
|
|
|
|
|
itemLayout="vertical"
|
|
|
|
|
rowClassName='questionbank-list-item'
|
|
|
|
|
pagination={{
|
|
|
|
|
defaultPageSize: 10,
|
|
|
|
|
showSizeChanger: false,
|
|
|
|
|
}}
|
|
|
|
|
toolBarRender={() => {
|
|
|
|
|
const menu = (
|
|
|
|
|
<Menu onClick={(value)=>setAddType(value)}>
|
|
|
|
|
<Menu.Item key="1">单选</Menu.Item>
|
|
|
|
|
<Menu.Item key="2">多选</Menu.Item>
|
|
|
|
|
<Menu.Item key="3">判断</Menu.Item>
|
|
|
|
|
</Menu>
|
|
|
|
|
);
|
|
|
|
|
return [
|
|
|
|
|
<Dropdown overlay={menu}>
|
|
|
|
|
<Button>
|
|
|
|
|
<PlusOutlined /> 新建 <DownOutlined />
|
|
|
|
|
</Button>
|
|
|
|
|
</Dropdown>,
|
|
|
|
|
<Button key="remove" type="default" danger>
|
|
|
|
|
<DeleteOutlined /> 批量删除
|
|
|
|
|
</Button>,
|
|
|
|
|
<Button key="download" >
|
|
|
|
|
<DownloadOutlined /> 下载模板
|
|
|
|
|
</Button>,
|
|
|
|
|
<Button key="upload" >
|
|
|
|
|
<UploadOutlined /> 批量上传
|
|
|
|
|
</Button>,
|
|
|
|
|
];
|
|
|
|
|
}}
|
|
|
|
|
onRow={(record: any) => {
|
|
|
|
|
return {
|
|
|
|
|
onMouseEnter: () => {
|
|
|
|
|
console.log(record);
|
|
|
|
|
},
|
|
|
|
|
onClick: () => {
|
|
|
|
|
console.log(record);
|
|
|
|
|
},
|
|
|
|
|
};
|
|
|
|
|
}}
|
|
|
|
|
rowKey="id"
|
|
|
|
|
headerTitle={false}
|
|
|
|
|
tooltip={false}
|
|
|
|
|
dataSource={dataSource}
|
|
|
|
|
rowSelection={{
|
|
|
|
|
onChange: (_, selectedRows) => {
|
|
|
|
|
setSelectedRows(selectedRows);
|
|
|
|
|
},
|
|
|
|
|
}}
|
|
|
|
|
// grid={{ gutter: 16, column: 1 }}
|
|
|
|
|
showActions="always"
|
|
|
|
|
showExtra="always"
|
|
|
|
|
metas={{
|
|
|
|
|
title: {
|
|
|
|
|
dataIndex: 'name',
|
|
|
|
|
render: (text: React.ReactNode, record: T, index: number) => `1. ${text}`,
|
|
|
|
|
},
|
|
|
|
|
avatar: {
|
|
|
|
|
dataIndex: 'type',
|
|
|
|
|
valueType: 'text',
|
|
|
|
|
render: (text: React.ReactNode, record: T, index: number) => `[${record.type}]`,
|
|
|
|
|
},
|
|
|
|
|
description: {
|
|
|
|
|
dataIndex: 'options',
|
|
|
|
|
valueType: 'checkbox',
|
|
|
|
|
render: (text: React.ReactNode, record: T, index: number) => {
|
|
|
|
|
return (
|
|
|
|
|
<List
|
|
|
|
|
header={false}
|
|
|
|
|
footer={false}
|
|
|
|
|
bordered={false}
|
|
|
|
|
dataSource={record.options || []}
|
|
|
|
|
renderItem={item => (
|
|
|
|
|
<List.Item>
|
|
|
|
|
<Typography.Text mark={false}>{`${item?.value}. ${item?.label}`}</Typography.Text>
|
|
|
|
|
</List.Item>
|
|
|
|
|
)}
|
|
|
|
|
/>
|
|
|
|
|
);
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
subTitle: { },
|
|
|
|
|
content: {
|
|
|
|
|
render: (text: React.ReactNode, record: T, index: number) => {
|
|
|
|
|
return (
|
|
|
|
|
<Space direction="vertical" style={{border:'solid 1px #f0f0f0;',padding:10}}>
|
|
|
|
|
<Typography>正确答案：{record.answer}</Typography>
|
|
|
|
|
<Typography>解析：{record.desc}</Typography>
|
|
|
|
|
</Space>
|
|
|
|
|
);
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
actions: {
|
|
|
|
|
cardActionProps: 'extra',
|
|
|
|
|
render: (text: React.ReactNode, record: T, _index: number) => {
|
|
|
|
|
return(
|
|
|
|
|
<Row style={{padding:'10px 24px'}}>
|
|
|
|
|
<Col flex={1} style={{textAlign:'left'}}>
|
|
|
|
|
<Space direction="horizontal" size="large">
|
|
|
|
|
<Typography>创建时间：{record.time}</Typography>
|
|
|
|
|
<Typography>标签：{record.tag}</Typography>
|
|
|
|
|
<Typography>所属课程：{record.course}</Typography>
|
|
|
|
|
</Space>
|
|
|
|
|
</Col>
|
|
|
|
|
<Col flex={1} style={{textAlign:'right'}}>
|
|
|
|
|
<Space direction="horizontal" size="middle">
|
|
|
|
|
<a href={record.html_url} target="_blank" rel="noopener noreferrer" key="link">
|
|
|
|
|
<EditOutlined /> 编辑
|
|
|
|
|
</a>
|
|
|
|
|
<a href={record.html_url} target="_blank" rel="noopener noreferrer" key="warning">
|
|
|
|
|
<DeleteOutlined /> 删除
|
|
|
|
|
</a>
|
|
|
|
|
<a
|
|
|
|
|
key="view"
|
|
|
|
|
onClick={()=>{
|
|
|
|
|
setExpandedDescRowKeys([...expandedDescRowKeys, record.id]);
|
|
|
|
|
console.log('record id:', record.id);
|
|
|
|
|
console.log('expandedDescRowKeys', expandedDescRowKeys)
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
<EyeOutlined /> <EyeInvisibleOutlined /> 查看解析
|
|
|
|
|
</a>
|
|
|
|
|
</Space>
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
}}
|
|
|
|
|
/>
|
|
|
|
|
</PageContainer>
|
|
|
|
|
);
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
export default QuestionBank;
|
