Merge branch 'dev_aliyun' of http://bdgit.educoder.net/Hjqreturn/educoder into dev_aliyun
commit
2e996636a8
@ -0,0 +1,204 @@
|
|||||||
|
import React, {Component} from "react";
|
||||||
|
import '../../signin/css/signincdi.css';
|
||||||
|
import {Pagination,Table} from 'antd';
|
||||||
|
import {getImageUrl} from 'educoder';
|
||||||
|
import axios from 'axios';
|
||||||
|
import LoadingSpin from "../../../../common/LoadingSpin";
|
||||||
|
import NoneDatas from "../../signin/component/NoneDatas";
|
||||||
|
|
||||||
|
|
||||||
|
//条目
|
||||||
|
class Videostatisticslist extends Component {
|
||||||
|
//条目组件
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
|
||||||
|
this.state = {
|
||||||
|
columnsstu: [
|
||||||
|
{
|
||||||
|
title: '序号',
|
||||||
|
dataIndex: 'number',
|
||||||
|
key: 'number',
|
||||||
|
align: "center",
|
||||||
|
className: 'font-14',
|
||||||
|
width: '90px',
|
||||||
|
render: (text, record) => (
|
||||||
|
<span style={{width: '90px'}}>{record.number}</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '视频名称',
|
||||||
|
dataIndex: 'title',
|
||||||
|
key: 'title',
|
||||||
|
align: "center",
|
||||||
|
className: 'font-14 maxnamewidth150s',
|
||||||
|
width: '150px',
|
||||||
|
render: (text, record) => (
|
||||||
|
<span style={{width: '150px'}} className="maxnamewidth150s">{record.title}</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '观看人数(人)',
|
||||||
|
dataIndex: 'people_num',
|
||||||
|
key: 'people_num',
|
||||||
|
align: "center",
|
||||||
|
className: 'font-14',
|
||||||
|
width: '98px',
|
||||||
|
render: (text, record) => (
|
||||||
|
<span style={{width: '98px'}}>{record.people_num}</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '累计观看时长',
|
||||||
|
dataIndex: 'total_time',
|
||||||
|
key: 'total_time',
|
||||||
|
align: "center",
|
||||||
|
className: 'font-14 maxnamewidth150s',
|
||||||
|
width: '150px',
|
||||||
|
render: (text, record) => (
|
||||||
|
<span style={{width: '150px'}} className="maxnamewidth150s">{record.total_time}</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '发布人',
|
||||||
|
dataIndex: 'user_name',
|
||||||
|
key: 'user_name',
|
||||||
|
align: "center",
|
||||||
|
className: 'font-14 maxnamewidth100s',
|
||||||
|
width: '100px',
|
||||||
|
render: (text, record) => (
|
||||||
|
<span style={{width: '100px'}} className="maxnamewidth100s">{record.user_name}</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '详情',
|
||||||
|
dataIndex: 'id',
|
||||||
|
key: 'id',
|
||||||
|
align: "center",
|
||||||
|
className: 'font-14',
|
||||||
|
width: '90px',
|
||||||
|
render: (text, record) => (
|
||||||
|
<span style={{width: '90px',color:'#5091FF'}} className="xiaoshou" onClick={()=>this.props.details()}>详情</span>
|
||||||
|
),
|
||||||
|
}
|
||||||
|
],
|
||||||
|
loading:false,
|
||||||
|
data:[],
|
||||||
|
page:1,
|
||||||
|
limit:10,
|
||||||
|
members_count:0,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
componentDidMount() {
|
||||||
|
this.togetdatas(1);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
componentDidUpdate = (prevProps) => {
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
paginationonChange = (pageNumber) => {
|
||||||
|
this.setState({
|
||||||
|
page: pageNumber,
|
||||||
|
})
|
||||||
|
this.togetdatas(pageNumber);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
togetdatas(page){
|
||||||
|
this.setState({
|
||||||
|
loading:true
|
||||||
|
})
|
||||||
|
const CourseId=this.props.match.params.coursesId;
|
||||||
|
let url=`/courses/${CourseId}/watch_video_histories.json`;
|
||||||
|
axios.get(url,{params:{
|
||||||
|
page:page
|
||||||
|
}
|
||||||
|
}).then((response) => {
|
||||||
|
if(response){
|
||||||
|
this.setState({
|
||||||
|
data:response.data&&response.data.videos?response.data.videos:[],
|
||||||
|
members_count:count,
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
this.setState({
|
||||||
|
loading:false
|
||||||
|
})
|
||||||
|
}).catch((error) => {
|
||||||
|
this.setState({
|
||||||
|
loading:false
|
||||||
|
})
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
render() {
|
||||||
|
let {loading,data,columnsstu,page,members_count,limit}=this.state;
|
||||||
|
return (
|
||||||
|
<React.Fragment>
|
||||||
|
<div className="ws100s mt20">
|
||||||
|
<div className="ws100s edu-back-white">
|
||||||
|
<div className="ws100s teacherentrydivs ">
|
||||||
|
<div className="ws100s sortinxdirection">
|
||||||
|
<div className="ws100s sptits">统计详情</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<style>
|
||||||
|
{
|
||||||
|
`
|
||||||
|
.ysltableo .ant-table-thead > tr > th, .ant-table-tbody > tr > td {
|
||||||
|
padding: 10px 10px;
|
||||||
|
}
|
||||||
|
`
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
{
|
||||||
|
loading===true?
|
||||||
|
<div style={{
|
||||||
|
minHeight: "400px",
|
||||||
|
}} className="ws100s">
|
||||||
|
<LoadingSpin></LoadingSpin>
|
||||||
|
</div>
|
||||||
|
:
|
||||||
|
<div className="ws100s ysltableo teacherentrydivs">
|
||||||
|
{
|
||||||
|
data.length===0?
|
||||||
|
<div style={{
|
||||||
|
minHeight: "400px",
|
||||||
|
}} className="ws100s">
|
||||||
|
<NoneDatas></NoneDatas>
|
||||||
|
</div>
|
||||||
|
:
|
||||||
|
<Table columns={columnsstu} dataSource={data} pagination={false}/>
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="mb30 clearfix educontent mt40 intermediatecenter">
|
||||||
|
{
|
||||||
|
data&&data.length>0?
|
||||||
|
<Pagination showQuickJumper current={this.state.page} onChange={this.paginationonChange}
|
||||||
|
pageSize={this.state.limit}
|
||||||
|
total={this.state.members_count}></Pagination>
|
||||||
|
:""
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</React.Fragment>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Videostatisticslist;
|
Loading…
Reference in new issue