Skip to content

X
xiaomai-cloud-class-web
Commit 50ceb59d by zhujian
Options

fix:数据联调

parent 254df036
Showing with 36 additions and 19 deletions
src/modules/task-center/data-center/Index.tsx
......@@ -11,7 +11,7 @@ import './index.less'
const { TabPane } = Tabs;
function DataCenter(props: any) {
const { match: { params: { planId } } } = props;
const { match: { params: { taskId } } } = props;
const [info, setInfo] = useState<any>({})
const [tabKey, setTabKey] = useState<any>('')
......@@ -40,10 +40,11 @@ function DataCenter(props: any) {
}, [])
function getInfo() {
Service.Hades('public/hades/getTrainingPlanDetail', { planId }).then((res: any) => {
res.result.trainingTaskList.map((item: any) => {
Service.Hades('/public/hades/getTrainingTaskDetail', { taskId }).then((res: any) => {
res.result.trainingStageList.map((item: any) => {
item.open = true
})
res.result.cover =res.result.courseMediaVOS.filter((item:any) => item.contentType === 'COVER')[0]
setInfo(res.result)
})
}
......@@ -57,7 +58,7 @@ function DataCenter(props: any) {
/>
<div className="content">
<DataInfo info={info} />
<Tabs defaultActiveKey={'study'} onChange={() => { }}>
<Tabs defaultActiveKey={'course'} onChange={() => { }}>
{
tabList.map((item: any) => {
return <TabPane tab={item.name} key={item.key}>
......
src/modules/task-center/data-center/components/DataInfo.tsx
......@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react';
import { withRouter } from "react-router-dom";
import { Progress } from 'antd';
import ENUM from '../../enum'
import moment from 'moment'
const defaultCover = 'https://image.xiaomaiketang.com/xm/rEAetaTEh3.png';
function DataInfo(props: any) {
......@@ -9,22 +10,28 @@ function DataInfo(props: any) {
return <div className="infoBox">
<div className="left">
<div className="banner">
<img src={props.info.coverUrl || defaultCover} alt="" />
<img src={ props.info.cover|| defaultCover} alt="" />
</div>
<div className="textBox">
<div className="nameBox">
<div className="name">{props.info.planName}</div>
<div className="status" style={{ color: ENUM.trainStatus[props.info.status || 'UN_START'].color, background: ENUM.trainStatus[props.info.status || 'UN_START'].background }}>{ENUM.trainStatus[props.info.status || 'UN_START'].text}</div>
<div className="name">{props.info.taskName}</div>
<div className="status" style={{ color: ENUM.trainStatus[props.info.taskState || 'UN_START'].color, background: ENUM.trainStatus[props.info.taskState || 'UN_START'].background }}>{ENUM.trainStatus[props.info.taskState || 'UN_START'].text}</div>
</div>
<div className="info">
<span> {`创建人: 文小白 `}</span>
<span style={{ marginLeft: 24 }}> {`培训时间：2021-07-01 00:00 至 2021-08-17 00:00`}</span>
<span> {`创建人: ${props.info.createName} `}</span>
<span style={{ marginLeft: 24 }}> {`培训时间：${moment(props.info.startTime).format('YYYY-MM-DD HH:mm')} 至 ${moment(props.info.endTime).format('YYYY-MM-DD HH:mm')}`}</span>
</div>
<div className="info">
<div className="item">{`任务数: 98`}</div>
<div className="item"><span className="icon iconfont" style={{color:'rgba(41, 102, 255, 1)'}}>&#xe617;</span>{`课程：98`}</div>
<div className="item"><span className="icon iconfont" style={{color:'rgba(255, 105, 0, 1)'}} >&#xe61c;</span>{`作业：4`}</div>
<div className="item"><span className="icon iconfont" style={{color:'rgba(255, 79, 79, 1)'}} >&#xe619;</span>{`考试：4`}</div>
<div className="item">{`任务数:${props.info.contentNum}`}</div>
{
!!props.info.courseNum && <div className="item"><span className="icon"><img src="https://image.xiaomaiketang.com/xm/6C2GjSpnDp.png" alt="" /></span>{`课程：${props.info.courseNum}`}</div>
}
{/* <div className="item"><span className="icon"><img src="https://image.xiaomaiketang.com/xm/6C2GjSpnDp.png" alt="" /></span>{`作业：4`}</div> */}
{
!!props.info.examNum && <div className="item"><span className="icon"><img src="https://image.xiaomaiketang.com/xm/fCDPp2Eenc.png" alt="" /></span>{`考试：${props.info.examNum}`}</div>
}
</div>
</div>
......@@ -32,12 +39,12 @@ function DataInfo(props: any) {
</div>
<div className="right">
<div className="prog">
<Progress type="circle" width={85} percent={75} strokeWidth={10} format={percent => <div className='wcl'>{`${percent}% `} <div>完成率</div></div>} />
<Progress type="circle" width={85} percent={75} strokeWidth={10} format={percent => <div className='wcl'>{`${(parseInt(props.info.finishCustomerNum /(props.info.cultureCustomerNum)*100 as any))}% `} <div>完成率</div></div>} />
</div>
<div className="num">
<div className="item"> {`指派人数：${12}`}</div>
<div className="item">{`学习人数：${12}`}</div>
<div className="item">{`完成人数：${12}`}</div>
<div className="item"> {`指派人数：${props.info.cultureCustomerNum}`}</div>
<div className="item">{`学习人数：${props.info.cultureCustomerNum}`}</div>
<div className="item">{`完成人数：${props.info.finishCustomerNum}`}</div>
</div>
</div>
</div>
......
src/modules/task-center/data-center/index.less
......@@ -46,6 +46,15 @@
}
.info{
margin-bottom: 12px;
.icon{
position: relative;
top: -2px;
margin-right: 8px;
img{
width: 20px;
}
}
span,.item{
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
......
src/modules/task-center/train-task/TrainTaskPage.jsx
......@@ -91,7 +91,7 @@ function TrainTaskPage(props) {
<TrainFilter onChange={queryChange} />
<TrainList trainListData={trainListData} storeTaskNum={storeTaskNum} query={query} totalCount={totalCount} onChange={queryChange} />
</div>
<Route path={`${match.url}/data`} component={DataCenter} />
<Route path={`${match.url}/data/:taskId`} component={DataCenter} />
</div>
);
}
......
src/modules/task-center/train-task/components/TrainList.jsx
......@@ -288,7 +288,7 @@ function TrainList(props) {
<div
className='operate__item'
onClick={() => {
props.history.push(`${match.path}/data?planId=${record.planId}`);
props.history.push(`${match.path}/data/${record.taskId}`);
}}>
数据
</div>
......
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