Skip to content

X
xiaomai-cloud-class-web
Commit 532c00df by zhujian
Options

'feat:考试'

parent 4bbd3b90
Showing with 785 additions and 42 deletions
src/modules/teach-tool/examination-manager/AddExam.less
......@@ -8,11 +8,29 @@
}
}
.paperTitle{
background-color:rgba(247, 248, 249, 1) ;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
line-height: 40px;
border: 2px;
margin: 8px 0;
padding-left: 12px;
img{
width: 20px;
height: 20px;
margin-right: 4px;
position: relative;
top: -2px;
}
}
.table{
border: 1px solid #e8e8e8;
width: 600px;
margin-left: 45px;
margin-top: -10px;
.header,.body-list{
background-color: #fafafa;
display: flex;
......
src/modules/teach-tool/examination-manager/AddExam.tsx
......@@ -206,6 +206,8 @@ function AddExam(props: any) {
};
}
function handleGoBack() {
Modal.confirm({
title: '确定要返回吗？',
......@@ -220,7 +222,7 @@ function AddExam(props: any) {
}
return <div className="page examPage">
<Breadcrumbs navList={"新建考试"} goBack={handleGoBack} />
<Breadcrumbs navList={props.type === 'edit' ? "编辑考试" : "新建考试"} goBack={handleGoBack} />
<div className="box">
<Alert message="请遵守国家相关规定，切勿上传低俗色情、暴力恐怖、谣言诈骗、侵权盗版等相关内容，小麦企培保有依据国家规定及平台规则进行处理的权利" type="info" showIcon />
......@@ -238,46 +240,52 @@ function AddExam(props: any) {
<Input placeholder='请输入试卷名称（40字以内）' maxLength={40} value={examName} onChange={(e) => {
setExamName(e.target.value)
}} style={{ width: 300 }} />
}} style={{ width: 320 }} />
</Form.Item>
<Form.Item label="选择试卷"
validateStatus={(check && !paperId) ? 'error' : ''}
help={check && !paperId && '请选择试卷'}
required>
<span style={{ marginRight: 12, lineHeight: '32px' }}>{paperInfo.paperName}</span> <Button onClick={() => { setShowModal(true) }} >{paperInfo.paperId ? '重新选择' : '选择试卷'}</Button>
<Button onClick={() => { setShowModal(true) }} >{paperInfo.paperId ? '重新选择' : '选择试卷'}</Button>
{
paperInfo.paperId && <div className="paperTitle"><img src="https://image.xiaomaiketang.com/xm/pY5imEhjzw.png" alt=""/> {paperInfo.paperName}</div>
}
</Form.Item>
{
paperInfo.paperId && <div className="table">
<div className="header">
<div className="item">单选题</div>
<div className="item">多选题</div>
<div className="item">判断题</div>
<div className="item">填空题</div>
<div className="item">不定项选择题</div>
<div className="item">合计</div>
</div>
<div className="body-list">
<div className="item">{paperInfo.singleChoiceCnt || 0}题</div>
<div className="item">{paperInfo.multiChoiceCnt || 0}题</div>
<div className="item">{paperInfo.judgeCnt || 0}题</div>
<div className="item">{paperInfo.gapFillingCnt || 0}题</div>
<div className="item long">{paperInfo.indefiniteChoiceCnt || 0}题</div>
<div className="item">{paperInfo.singleChoiceCnt + paperInfo.multiChoiceCnt + paperInfo.judgeCnt + paperInfo.gapFillingCnt + paperInfo.indefiniteChoiceCnt || 0}题</div>
</div>
<div className="body-list">
<div className="item">{paperInfo.singleChoiceScore || 0}分</div>
<div className="item">{paperInfo.multiChoiceScore || 0}分</div>
<div className="item">{paperInfo.judgeScore || 0}分</div>
<div className="item">{paperInfo.gapFillingScore || 0}分</div>
<div className="item long">{paperInfo.indefiniteChoiceScore || 0}分</div>
<div className="item">{paperInfo.totalScore || 0}分</div>
{
paperInfo.paperId && <div className="table">
<div className="header">
<div className="item">单选题</div>
<div className="item">多选题</div>
<div className="item">判断题</div>
<div className="item">填空题</div>
<div className="item">不定项选择题</div>
<div className="item">合计</div>
</div>
<div className="body-list">
<div className="item">{paperInfo.singleChoiceCnt || 0}题</div>
<div className="item">{paperInfo.multiChoiceCnt || 0}题</div>
<div className="item">{paperInfo.judgeCnt || 0}题</div>
<div className="item">{paperInfo.gapFillingCnt || 0}题</div>
<div className="item long">{paperInfo.indefiniteChoiceCnt || 0}题</div>
<div className="item">{paperInfo.singleChoiceCnt + paperInfo.multiChoiceCnt + paperInfo.judgeCnt + paperInfo.gapFillingCnt + paperInfo.indefiniteChoiceCnt || 0}题</div>
</div>
<div className="body-list">
<div className="item">{paperInfo.singleChoiceScore || 0}分</div>
<div className="item">{paperInfo.multiChoiceScore || 0}分</div>
<div className="item">{paperInfo.judgeScore || 0}分</div>
<div className="item">{paperInfo.gapFillingScore || 0}分</div>
<div className="item long">{paperInfo.indefiniteChoiceScore || 0}分</div>
<div className="item">{paperInfo.totalScore || 0}分</div>
</div>
</div>
</div>
}
}
</Form.Item>
<Form.Item label="及格线"
......@@ -297,6 +305,7 @@ function AddExam(props: any) {
help={check && !examStartTime && '请选择考试起止时间'}
required>
<RangePicker
style={{ width: 320 }}
ranges={{
'近七天': [moment(), moment().add(6, 'day').endOf('day')],
'近1个月': [moment(), moment().add(1, 'month').endOf('day')],
......
src/modules/teach-tool/examination-manager/DataAnalysic.tsx
import React, { useState, useRef, useEffect, useContext } from 'react'
import { Route, withRouter } from 'react-router-dom';
import Breadcrumbs from "@/components/Breadcrumbs";
import UserData from './UserData';
import ExamData from './ExamData'
import Service from "@/common/js/service";
import { Tabs } from 'antd';
import User from "@/common/js/user";
import './dataAnalysic.less'
function DataAnalysic() {
const { TabPane } = Tabs;
function DataAnalysic(props: any) {
const examDetailInit: any = {};
const [selectKey, setSelectKey] = useState('user')
const [examDetail, setExamDetail] = useState(examDetailInit);
const { match } = props;
const examId =match.params.id;
useEffect(() => {
queryExamDetail();
}, [])
function queryExamDetail() {
Service.Hades("public/hades/queryExamDetail", {
examId:examId,
tenantId: User.getStoreId(),
userId: User.getStoreUserId(),
source: 0
}).then((res) => {
const { result } = res
setExamDetail(result)
})
}
return <div className="page dataAnalysic">
<Breadcrumbs navList={"考试数据"} goBack={props.history.goBack} />
<div className="box">
<div className="titleBox ">
<span className='tips'></span>
考试名称：{examDetail.examName}
</div>
</div>
<div className="box">
<Tabs activeKey={selectKey} onChange={(key: any) => {
setSelectKey(key)
}}>
<TabPane tab="考试人员数据" key="user">
<UserData examDetail ={examDetail } examId={examId} />
</TabPane>
<TabPane tab="题目数据" key="exam">
<ExamData examDetail ={examDetail } examId={examId}></ExamData>
</TabPane>
</Tabs>
</div>
</div>
}
......
src/modules/teach-tool/examination-manager/ExamData.tsx 0 → 100644
import React, { useState, useRef, useEffect, useContext } from 'react'
import Service from "@/common/js/service";
import { PageControl } from "@/components";
import { Input, Select, Tooltip, Button, Table } from 'antd';
import User from "@/common/js/user";
import moment from 'moment';
import './userData.less'
const { Search } = Input;
const { Option } = Select;
interface sortType {
type: "ascend" | "descend" | null | undefined
}
function ExamData(props: any) {
const sortStatus: sortType = {
type: undefined
}
const examDataInit: any = {};
const queryInit: any = { current: 1, size: 10, };
const [examData, setUserData] = useState(examDataInit);
const [list, setList] = useState([]);
const [query, setQuery] = useState(queryInit);
const [total, setTotal] = useState(0);
const [field, setfield] = useState('');
const [order, setOrder] = useState(sortStatus.type);
const questionTypeList = {
SINGLE_CHOICE: "单选题",
MULTI_CHOICE: "多选题",
JUDGE: "判断题",
GAP_FILLING: "填空题",
INDEFINITE_CHOICE: "不定项选择题",
};
const userTypeEnum = {
WE_COM: '企业微信',
WE_CHAT: '微信'
}
const userExamStateEnum = {
EXAM: '进行中',
LACK_EXAM: '缺考',
FINISH_EXAM: '已考试'
}
const orderEnum = {
currentAccuracy: {
ascend: 'ACCURACY_ASC',
descend: 'ACCURACY_DESC'
},
}
const queryRef = useRef({});
useEffect(() => {
queryExamUserData();
}, [])
useEffect(() => {
queryRef.current = query;
queryExamUserDataList();
}, [query])
function queryExamUserData() {
Service.Hades('public/hades/queryExamQuestionData', {
examId: props.examId,
tenantId: User.getStoreId(),
userId: User.getStoreUserId(),
source: 0
}).then((res) => {
setUserData(res.result)
})
}
function queryExamUserDataList() {
Service.Hades('public/hades/queryExamQuestionDataList', {
...query,
examId: props.examId,
tenantId: User.getStoreId(),
userId: User.getStoreUserId(),
source: 0
}).then((res) => {
setList(res.result.records);
setTotal(parseInt(res.result.total))
})
}
const columns = [
{
title: "序号",
dataIndex: "sort",
width: 60
},
{
title: "题目",
dataIndex: "questionStem",
ellipsis: true,
width: 350
},
{
title: "题型",
dataIndex: "questionType",
render: (text: any) => <span>{(questionTypeList as any)[text]}</span>,
filters: Object.keys(questionTypeList).map((key) => {
return {
text: (questionTypeList as any)[key],
value: key
}
}),
},
{
title: "本次正确率",
dataIndex: "currentAccuracy",
sorter: true,
sortOrder: field === "currentAccuracy" ? order : sortStatus.type,
render: (text: any) => <span>{text*100}%</span>,
},
{
title: <div>历史正确率 <Tooltip
overlayClassName="tool-list"
title='包含本次考试正确率'
placement="top"
overlayStyle={{ maxWidth: 700 }}
> <span style={{ color: 'rgba(191, 191, 191, 1)' }} className="icon iconfont">&#xe61d;</span>
</Tooltip>
</div>,
dataIndex: "totalAccuracy",
render: (text: any) => <span>{text*100}%</span>,
},
];
function onChange(pagination: any, filters: any, sorter: any, extra: any) {
console.log(filters, sorter);
setfield(sorter.field);
setOrder(sorter.order)
console.log(sorter.field, sorter.order, (orderEnum as any)[sorter.field])
let _query: any = { ...queryRef.current };
if (filters.questionType) {
_query.questionType = filters.questionType
} else {
delete _query.questionType
}
_query.order = (orderEnum as any)[sorter.field][sorter.order]
setQuery(_query)
}
function download() {
Service.Hades('anon/hades/exportExamData', {
examId: props.examId,
exportDataType: 'EXAM_QUESTION_DATA',
tenantId: User.getStoreId(),
userId: User.getStoreUserId(),
source: 0
}).then((res) => {
const dom =(document as any).getElementById("load-play-back-excel")
dom.setAttribute('href',res.result);
dom.click();
})
}
return <div className="rr">
<a
target="_blank"
download
id="load-play-back-excel"
style={{ position: "absolute", left: "-10000px" }}
></a>
<div className="dataPanal">
<div className="item">
<div className="num">{examData.singleChoiceAccuracy * 100}%</div>
<div className="percent">正确率</div>
<div className="subTitle"><div className="type"><span className="icon iconfont">&#xe7fa;</span> 单选题 <span>(共{examData.singleChoiceCnt}题)</span></div></div>
</div>
<div className="item">
<div className="num">{examData.multiChoiceAccuracy * 100}%</div>
<div className="percent">正确率</div>
<div className="subTitle"><div className="type"><span className="icon iconfont">&#xe7fb;</span>多选题 <span>(共{examData.multiChoiceCnt}题)</span></div></div>
</div>
<div className="item">
<div className="num">{examData.judgeAccuracy * 100}%</div>
<div className="percent">正确率</div>
<div className="subTitle"><div className="type"><span className="icon iconfont">&#xe7fc;</span>判断题 <span>(共{examData.judgeCnt}题)</span></div></div>
</div>
<div className="item">
<div className="num">{examData.gapFillingAccuracy * 100}%</div>
<div className="percent">正确率</div>
<div className="subTitle"><div className="type"><span className="icon iconfont">&#xe7fd;</span>填空题 <span>(共{examData.gapFillingCnt}题)</span></div></div>
</div>
<div className="item">
<div className="num">{examData.indefiniteChoiceAccuracy * 100}%</div>
<div className="percent">正确率</div>
<div className="subTitle"><div className="type"><span className="icon iconfont">&#xe7fe;</span>不定项选择题 <span>(共{examData.indefiniteChoiceCnt}题)</span></div></div>
</div>
</div>
<Button style={{ marginBottom: 12, marginTop: 12 }} onClick={download} >导出</Button>
<div className="content">
<Table
bordered
size="small"
columns={columns}
dataSource={list}
onChange={onChange}
pagination={false}
>
</Table>
{total > 0 &&
<PageControl
size="small"
current={query.current - 1}
pageSize={query.size}
total={total}
toPage={(page: any) => {
console.log(page)
let _query: any = { ...queryRef.current };
_query.current = page + 1;
setQuery(_query)
}}
/>
}
</div>
</div>
}
export default ExamData;
\ No newline at end of file
src/modules/teach-tool/examination-manager/Index.tsx
import React, { useState, useRef, useEffect, useContext } from 'react'
import { Row, Input, Select, DatePicker, Tooltip, Button, Table, Dropdown, Menu, Modal } from 'antd';
import {Input, Select, DatePicker, Tooltip, Button, Table, Dropdown, Menu, Modal } from 'antd';
import TeacherSelect from '@/modules/common/TeacherSelect';
import { Route, withRouter } from 'react-router-dom';
import Service from "@/common/js/service";
......@@ -8,7 +8,7 @@ import { PageControl } from "@/components";
import AddExam from './AddExam';
import User from "@/common/js/user";
import { XMContext } from "@/store/context";
import StoreService from "@/domains/store-domain/storeService";
import DataAnalysic from './DataAnalysic'
import './index.less'
const { RangePicker } = DatePicker;
const { Search } = Input;
......@@ -28,8 +28,6 @@ function ExaminationManager(props: any) {
type: undefined
}
const sortEnum = {
}
......@@ -129,7 +127,11 @@ function ExaminationManager(props: any) {
ctx.xmState?.userPermission?.SeeExamData() && [<div
key="data"
className="operate__item"
onClick={() => { }}
onClick={() => {
props.history.push({
pathname: `${match.url}/analysic/${record.examId}`
})
}}
>
数据
</div>,
......@@ -173,9 +175,9 @@ function ExaminationManager(props: any) {
})
} else {
props.history.push({
pathname: `${match.url}/edit/${item.examId}`
pathname: `${match.url}/edit/${item.examId}`
})
}
}}
>
......@@ -320,6 +322,7 @@ function ExaminationManager(props: any) {
</div>
<div className="reset-fold-area">
<Tooltip title="清空筛选"><span className="resetBtn iconfont icon" onClick={() => {
setfield('')
setQuery({ current: 1, size: 10, order: 'EXAM_START_TIME_DESC' });
}}>&#xe61b; </span></Tooltip>
<span style={{ cursor: 'pointer' }} className="fold-btn" onClick={() => {
......@@ -377,6 +380,12 @@ function ExaminationManager(props: any) {
getList()
}} />;
}} />
<Route path={`${match.url}/analysic/:id`} render={() => {
return <DataAnalysic />;
}} />
</div>
}
......
src/modules/teach-tool/examination-manager/UserData.tsx 0 → 100644
import React, { useState, useRef, useEffect } from 'react'
import Service from "@/common/js/service";
import { PageControl } from "@/components";
import { Input, Select, Tooltip, Table,Button } from 'antd';
import User from "@/common/js/user";
import moment from 'moment';
import './userData.less'
const { Search } = Input;
const { Option } = Select;
interface sortType {
type: "ascend" | "descend" | null | undefined
}
function DataAnalysic(props: any) {
const sortStatus: sortType = {
type: undefined
}
const useDataInit: any = {};
const queryInit: any = { current: 1, size: 10, };
const [useData, setUserData] = useState(useDataInit);
const [list, setList] = useState([]);
const [query, setQuery] = useState(queryInit);
const [total, setTotal] = useState(0);
const [field, setfield] = useState('');
const [order, setOrder] = useState(sortStatus.type);
const userTypeEnum = {
WE_COM: '企业微信',
WE_CHAT: '微信'
}
const userExamStateEnum = {
EXAM: '进行中',
LACK_EXAM: '缺考',
FINISH_EXAM: '已考试'
}
const ExamPassColorEnum = {
EXAM_FAIL: 'rgba(255, 79, 79, 1)',
EXAM_PASS: 'rgba(59, 189, 170, 1)',
}
const ExamPassEnum = {
EXAM_FAIL: '不及格',
EXAM_PASS: '及格',
}
const userExamStateColorEnum = {
EXAM: 'rgba(35, 143, 255, 1)',
LACK_EXAM: 'rgba(204, 204, 204, 1)',
FINISH_EXAM: 'rgba(47, 200, 60, 1)'
}
const orderEnum = {
score: {
ascend: 'CREATED_ASC',
descend: 'ACCURACY_DESC'
},
examDuration: {
ascend: 'PASS_CNT_ASC',
descend: 'CREATED_DESC'
},
}
const queryRef = useRef({});
useEffect(() => {
queryExamUserData();
}, [])
useEffect(() => {
queryRef.current = query;
// queryExamUserDataList();
}, [query])
function queryExamUserData() {
Service.Hades('public/hades/queryExamUserData', {
examId: props.examId,
tenantId: User.getStoreId(),
userId: User.getStoreUserId(),
source: 0
}).then((res) => {
setUserData(res.result)
})
}
function queryExamUserDataList() {
Service.Hades('public/hades/queryExamUserDataList', {
...query,
examId: props.examId,
tenantId: User.getStoreId(),
userId: User.getStoreUserId(),
source: 0
}).then((res) => {
setList(res.result.records);
setTotal(parseInt(res.result.total))
})
}
const columns = [
{
title: "用户",
dataIndex: "userName",
render: (text: any, record: any) => <span>{text}<span style={{ color: record.userSource === 'WE_COM' ? 'rgba(255, 157, 20, 1)' : 'rgba(29, 204, 101, 1)' }} >@{(userTypeEnum as any)[record.userSource]}</span></span>,
},
{
title: "手机号",
dataIndex: "phone",
},
{
title: "考试状态",
dataIndex: "userExamState",
render: (text: any) => <span> <span className='exstatus' style={{ background: (userExamStateColorEnum as any)[text] }}></span> {(userExamStateEnum as any)[text]}</span>,
},
{
title: "考试成绩",
dataIndex: "score",
sorter: true,
sortOrder: field === "score" ? order : sortStatus.type,
render: (text: any, record: any) => <span> {text} <span style={{ border: `1px solid ${(ExamPassColorEnum as any)[record.examPass]}`, fontSize: 12, color: (ExamPassColorEnum as any)[record.examPass], display: 'inline-block', padding: '0px 2px' }}>{(ExamPassEnum as any)[record.examPass]}</span></span>,
},
{
title: "进入考试时间",
dataIndex: "examStartTime",
render: (text: any) => <span>{moment(text).format("YYYY-MM-DD HH:mm")}</span>,
},
{
title: "考试用时",
dataIndex: "examDuration",
sorter: true,
sortOrder: field === "examDuration" ? order : sortStatus.type,
render: (text: any) => <span>{moment(text).format("HH:mm:ss")}</span>,
},
];
function onChange(pagination: any, filters: any, sorter: any, extra: any) {
setfield(sorter.field);
setOrder(sorter.order)
console.log(sorter.field, sorter.order, (orderEnum as any)[sorter.field])
let _query: any = { ...queryRef.current };
_query.order = (orderEnum as any)[sorter.field][sorter.order]
setQuery(_query)
}
function download(){
Service.Hades('anon/hades/exportExamData', {
examId: props.examId,
exportDataType:'EXAM_USER_DATA',
tenantId: User.getStoreId(),
userId: User.getStoreUserId(),
source: 0
}).then((res) => {
const dom =(document as any).getElementById("load-play-back-excel")
dom.setAttribute('href',res.result);
dom.click();
})
}
return <div className="rr">
<a
target="_blank"
download
id="load-play-back-excel"
style={{ position: "absolute", left: "-10000px" }}
>
111
</a>
<div className="dataPanal">
<div className="item">
<div className="num">{useData.joinCnt || 0}</div>
<div className="percent"></div>
<div className="subTitle">参与人数</div>
</div>
<div className="item">
<div className="num">{useData.finishCnt || 0}</div>
<div className="percent">占比{parseInt(((useData.finishCnt || 0) / (useData.joinCnt || 1)) * 100 + '')}%</div>
<div className="subTitle">完成考试数 (人)</div>
</div>
<div className="item">
<div className="num">{useData.passCnt || 0}</div>
<div className="percent">占比{parseInt(((useData.passCnt || 0) / (useData.finishCnt || 1)) * 100 + '')}%</div>
<div className="subTitle">及格数 (人)</div>
</div>
<div className="item">
<div className="num">{useData.averageScore || 0}</div>
<div className="percent">总分{props.examDetail?.examPaper?.totalScore}</div>
<div className="subTitle">平均分</div>
</div>
<div className="item">
<div className="num">{useData.averageDuration || 0}</div>
<div className="percent"></div>
<div className="subTitle">平均用时</div>
</div>
</div>
<div className="xm-search-filter" style={{ marginTop: 12 }}>
<div style={{ display: 'flex' }}>
<div className="search-condition">
<div className="search-condition__item">
<span className="search-name">用户:</span>
<Search
value={query.examName}
className='search-input'
placeholder="搜索用户名或手机号"
onChange={(e) => {
const _query = { ...query }
_query.searchKey = e.target.value
setQuery(_query);
}}
onSearch={() => { }}
enterButton={<span className="icon iconfont">&#xe832;</span>}
/>
</div>
<div className="search-condition__item">
<span className="search-name">用户类型:</span>
<Select value={query.userSource} placeholder="请选择用户类型" onChange={(val) => {
const _query = { ...query }
_query.userSource = val
setQuery(_query);
}} className='search-input' allowClear>
{
Object.keys(userTypeEnum).map((key: any) => {
return <Option value={key}>{(userTypeEnum as any)[key]}</Option>
})
}
</Select>
</div>
<div className="search-condition__item">
<span className="search-name">考试状态:</span>
<Select value={query.userExamState} placeholder="请选择考试状态" onChange={(val) => {
const _query = { ...query }
_query.userExamState = val
setQuery(_query);
}} className='search-input' allowClear>
{
Object.keys(userExamStateEnum).map((key: any) => {
return <Option value={key}>{(userExamStateEnum as any)[key]}</Option>
})
}
</Select>
</div>
</div>
<div className="reset-fold-area">
<Tooltip title="清空筛选"><span className="resetBtn iconfont icon" onClick={() => {
setfield('')
setQuery({ current: 1, size: 10 });
}}>&#xe61b; </span></Tooltip>
</div>
</div>
</div>
<Button style={{marginBottom:12}} onClick={download} >导出</Button>
<div className="content">
<Table
bordered
size="small"
columns={columns}
dataSource={list}
onChange={onChange}
pagination={false}
>
</Table>
{total > 0 &&
<PageControl
size="small"
current={query.current - 1}
pageSize={query.size}
total={total}
toPage={(page: any) => {
console.log(page)
let _query: any = { ...queryRef.current };
_query.current = page + 1;
setQuery(_query)
}}
/>
}
</div>
</div>
}
export default DataAnalysic;
\ No newline at end of file
src/modules/teach-tool/examination-manager/dataAnalysic.less
.dataAnalysic{
.titleBox{
font-size: 19px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
line-height: 26px;
background: #FFFFFF;
// padding: 20px 24px;
// margin-bottom: 8px;
.tips{
width: 4px;
height: 16px;
background: #336DFF;
display: inline-block;
margin-right: 4px;
}
}
}
\ No newline at end of file
src/modules/teach-tool/examination-manager/userData.less 0 → 100644
.dataPanal{
border-radius: 4px;
border: 1px solid #E8E8E8;
display: flex;
.item{
text-align: center;
width: 29.9%;
position: relative;
.num{
font-size: 26px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
line-height: 26px;
margin-top: 12px;
}
.percent{
margin-top: 6px;
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
line-height: 17px;
height: 20px;
margin-bottom: 18px;
}
.subTitle{
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
line-height: 20px;
margin-bottom: 12px;
}
.type{
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
line-height: 20px;
span{
color: rgba(153, 153, 153, 1);
}
.icon{
color: rgba(204, 204, 204, 1);
font-size: 16px;
margin-right: 4px;
}
}
&:after{
content: '';
width: 0px;
height: 40px;
position: absolute;
width: 1px;
background-color: rgba(232, 232, 232, 1);
top: 40px;
right: 0px;
}
}
.exstatus{
width: 4px;
height: 4px;
background: rgb(35, 143, 255);
display: inline-block;
border-radius: 50%;
position: relative;
top: -4px;
}
}
\ No newline at end of file
src/modules/teach-tool/paper-manage/components/PaperList.less
.paper-list {
.ant-radio-wrapper{
left: -10px;
}
.paper-list-filter {
position: relative;
......
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