Skip to content

X
xiaomai-cloud-class-web
Commit 9ff56087 by zhujian
Options

fix

parent 0186c213
Showing with 93 additions and 49 deletions
src/modules/task-center/data-center/components/CourseTable.tsx
import React, { useEffect, useState } from 'react';
import { withRouter } from "react-router-dom";
import moment from 'moment';
import ExpiredCourseList from '../../train-task/components/ExpiredCourseList';
import ENUM from '../../enum';
import './course.less'
......@@ -8,8 +8,9 @@ function CourseTable(props: any) {
const IndexText = ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十']
const [list, setList] = useState<any[]>([]);
useEffect(() => {
setList(props.info.trainingTaskList || [])
}, [props.info.trainingTaskList])
console.log(props.info, 'rtyuio')
setList(props.info.trainingStageList || [])
}, [props.info.trainingStageList])
return <div className="courseTabContent">
<div className="tips">{`培训目的：${'djkhdsjksdhdsj'}`}</div>
......@@ -29,18 +30,19 @@ function CourseTable(props: any) {
{
`${IndexText[index]}、 `
}
{item.taskName}
{item.stageName}
</div>
{
item.open && <div className="taskItemList">
{
item.courseList.map((_item: any, _index: number) => {
return <div className={_index == item.courseList.length - 1 ? "item noBorder" : "item"}>
item.contentVOList.map((_item: any, _index: number) => {
return <div className={_index == item.contentVOList.length - 1 ? "item noBorder" : "item"}>
<div className="name">
<img className='type-option-icon' src={ENUM.LearningContentIcon[_item.courseType || _item.contentType]} />
<span style={{ marginRight: 4 }}> {`${index + 1}.${_index + 1}`}</span>
{
_item.courseName
_item.contentName
}
{
(_item.courseType == 'LIVE') && <span className='desc'>{ENUM.courseStateShow[_item.courseState].title}</span>
......@@ -64,28 +66,13 @@ function CourseTable(props: any) {
</div>
<div className="expired">
<div className="title">失效课程</div>
<p className="desc">为了不影响学员学习，「未成功开课」的课程已从任务中移出，具体课程如下所示：</p>
<div className="list">
{
list.map((item: any) => {
return <div className="item">
<div className="text">
<span className="icon iconfont" style={{ color: 'rgba(255, 79, 79, 1)' ,marginRight:4}}>&#xe80b;</span>
<span style={{marginRight:24}}>未成功开课</span>
<span className='na'>阶段一</span>
<span className='na'>2.1 入门培训任务</span>
<span >张老师 </span>
<span>|</span>
<span>{moment().format('YYYY-MM-DD HH:mm')}</span>
</div>
<div className="ope">删除记录</div>
</div>
})
}
<div className="list">
<ExpiredCourseList expiredCourseList={list} />
</div>
</div>
</div>
}
......
src/modules/task-center/data-center/components/StudyTable.tsx
import React, { useEffect, useState } from 'react';
import React, { useEffect, useRef, useState } from 'react';
import { Route, withRouter } from "react-router-dom";
import { Row, Input, Select, Tooltip, Col } from 'antd';
import RangePicker from '@/modules/common/DateRangePicker';
......@@ -8,11 +8,13 @@ import ENUM from '../../enum';
import User from '@/common/js/user';
import moment from 'moment';
import UserLearningData from '../UserLearningData';
import { timers } from 'jquery';
const { Search } = Input;
const { Option } = Select;
declare var formatDate: any;
function StudyTable(props: any) {
console.log(props,'rtyjukl')
const [query, setQuery] = useState<any>({
current: 1, size: 10,
taskId: props.taskId,
......@@ -23,6 +25,8 @@ function StudyTable(props: any) {
});
const [list, setList] = useState<any[]>([]);
const [total, setTotal] = useState<any>(0);
const [name, setName] = useState<any>('');
const timer = useRef<any>(null)
useEffect(() => {
getList()
......@@ -31,7 +35,7 @@ function StudyTable(props: any) {
function getList() {
Service.Hades('public/hades/getTaskCustomerRecordPage', query).then((res: any) => {
setList(res.result.records)
setTotal(res.result.tatal)
setTotal(res.result.total)
})
}
......@@ -51,8 +55,12 @@ function StudyTable(props: any) {
},
{
title: '部门',
key: 'learnState2',
dataIndex: 'learnState2',
key: 'departmentNameList',
dataIndex: 'departmentNameList',
render: (val: any, record: any) => {
return <div>{val.join(';')}</div>;
},
},
{
......@@ -67,16 +75,15 @@ function StudyTable(props: any) {
dataIndex: 'learnState',
render: (val: any, record: any) => {
return <div>{ENUM.LearnState[val].text}</div>;
return <div>{ENUM.learnState[val].text}</div>;
},
},
{
title: '学习进度',
key: 'learnState',
dataIndex: 'learnState',
key: 'learnPercentage',
dataIndex: 'learnPercentage',
render: (val: any, record: any) => {
return <div></div>;
return `${val}%`;
},
},
......@@ -109,7 +116,7 @@ function StudyTable(props: any) {
render: (val: any, record: any) => {
return (
<div className='operate-area'>
<span className='operate-item' onClick={() => {console.log(props.match); props.history.push(`${props.match.path}/user-learning-data`);}}>
<span className='operate-item' style={{ color: 'rgba(41, 102, 255, 1)', cursor: 'pointer' }} onClick={() => { console.log(props.match); props.history.push(`${props.match.url}/user-learning-data`); }}>
查看数据
</span>
......@@ -128,9 +135,19 @@ function StudyTable(props: any) {
<span className='label'>学员：</span>
<div className="search">
<Search
value={query.customerName}
value={name}
placeholder='搜索学员名称'
onChange={(e) => {
setName(e.target.value);
clearTimeout(timer.current)
var name = e.target.value
timer.current = setTimeout(() => {
setQuery({
...query,
current: 1,
customerName: name
})
}, 500)
}}
onSearch={() => {
......@@ -152,16 +169,24 @@ function StudyTable(props: any) {
allowClear={true}
value={query.learnState}
onChange={(value) => {
setQuery({
...query,
current: 1,
learnState: value
})
}}
suffixIcon={
<span className='icon iconfont' style={{ fontSize: '12px', color: '#BFBFBF' }}>
&#xe835;
</span>
}>
<Option value='UN_PLAY'>未开始</Option>
<Option value='UNDER_WAY'>进行中</Option>
<Option value='FINISH'>已完成</Option>
{
Object.keys(ENUM.learnState).map((key: any) => {
return <Option value={key}>{ENUM.learnState[key].text}</Option>
})
}
</Select>
</div>
......@@ -178,7 +203,12 @@ function StudyTable(props: any) {
value={query.startTime ? [moment(query.startTime), moment(query.endTime)] : null}
format={'YYYY-MM-DD'}
onChange={(dates: any) => {
setQuery({
...query,
current: 1,
startTime: dates[0]?.startOf('day').valueOf(),
endTime: dates[0]?.endOf('day').valueOf(),
})
}}
/>
......@@ -188,7 +218,17 @@ function StudyTable(props: any) {
</Col>
<Col offset={2} span={1} >
<Tooltip title='清空筛选'>
<span className='resetBtn iconfont icon' onClick={() => { }}>
<span className='resetBtn iconfont icon' onClick={() => {
setName('');
setQuery({
current: 1, size: 10,
taskId: props.taskId,
source: 0,
storeId: User.getStoreId(),
storeUserId: User.getStoreUserId(),
userId: User.getStoreUserId(),
})
}}>
&#xe61b;{' '}
</span>
</Tooltip>
......@@ -196,28 +236,28 @@ function StudyTable(props: any) {
</Row>
</div>
<div style={{marginTop:12}}>
<div style={{ marginTop: 12 }}>
<XMTable
renderEmpty={{
type: 'college',
description: '暂无数据',
}}
rowKey={(record:any) => record.storeCustomerId}
rowKey={(record: any) => record.storeCustomerId}
dataSource={list}
columns={columns}
pagination={false}
className='user-learning-table'
onChange={()=>{}}
onChange={() => { }}
showSorterTooltip={false}
bordered
/>
{list.length > 0 && (
{list && list.length > 0 && (
<div className='box-footer'>
<PageControl
current={query.current - 1}
pageSize={query.size}
total={total}
toPage={(page:any) => {
toPage={(page: any) => {
setQuery({ ...query, current: query.current + 1 })
}}
......
src/modules/task-center/data-center/index.less
......@@ -13,9 +13,10 @@
.left{
display: flex;
.banner{
margin-right: 16px;
padding: 16px;
img{
height: 141px;
width: 194px;
height: 109px;
}
}
.textBox{
......
src/modules/task-center/enum.ts
......@@ -26,6 +26,22 @@ const ENUM: any = {
},
},
learnState: {
UN_FINISH: {
text: "未完成",
},
FINISH: {
text: "已完成",
},
OVERDUE: {
text: "已逾期",
},
},
courseStateShow: {
UN_START: {
title: '待开播',
......
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