From e9a082736c16b457764926ab08711ede085128b4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9D=A8=E6=A0=91=E6=9E=97?= <904079904@qq.com>
Date: Mon, 16 Mar 2020 20:00:35 +0800
Subject: [PATCH] =?UTF-8?q?=E8=A7=86=E9=A2=91=E7=BB=9F=E8=AE=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../component/Videostatisticscomtwo.js        | 369 +++++++++---------
 .../component/Videostatisticslist.js          | 124 +++++-
 2 files changed, 306 insertions(+), 187 deletions(-)

diff --git a/public/react/src/modules/courses/videostatistics/component/Videostatisticscomtwo.js b/public/react/src/modules/courses/videostatistics/component/Videostatisticscomtwo.js
index 80122b60e..1918d6adb 100644
--- a/public/react/src/modules/courses/videostatistics/component/Videostatisticscomtwo.js
+++ b/public/react/src/modules/courses/videostatistics/component/Videostatisticscomtwo.js
@@ -1,13 +1,12 @@
 import React, {Component} from "react";
 import '../../signin/css/signincdi.css';
-import {Pagination,Table, Menu, Dropdown} from 'antd';
-import {getImageUrl,sortDirections} from 'educoder';
+import {Pagination, Table, Menu, Dropdown} from 'antd';
+import {getImageUrl, sortDirections} from 'educoder';
 import axios from 'axios';
 import LoadingSpin from "../../../../common/LoadingSpin";
 import NoneDatas from "../../signin/component/NoneDatas";
 
 
-
 //条目
 class Videostatisticscom extends Component {
 	//条目组件
@@ -15,10 +14,10 @@ class Videostatisticscom extends Component {
 		super(props);
 
 		this.state = {
-			data:[],
-			page:1,
-			limit:10,
-			members_count:0,
+			data: [],
+			page: 1,
+			limit: 10,
+			members_count: 0,
 			columnsstu: [
 				{
 					title: '序号',
@@ -50,8 +49,8 @@ class Videostatisticscom extends Component {
 					className: 'font-14',
 					width: '98px',
 					render: (text, record) => (
-						<span style={{width: '98px'}}>{record.is_finished===true?
-							<span style={{color:"#5091FF"}}>是</span>:<span style={{color:"#E02020"}}>否</span>}</span>
+						<span style={{width: '98px'}}>{record.is_finished === true ?
+							<span style={{color: "#5091FF"}}>是</span> : <span style={{color: "#E02020"}}>否</span>}</span>
 					),
 				},
 				{
@@ -88,7 +87,7 @@ class Videostatisticscom extends Component {
 					className: 'font-14 maxnamewidth100s',
 					width: '100px',
 					render: (text, record) => (
-						<span style={{width: '100px',color:'#5091FF'}} className="xiaoshou" >{record.start_at}</span>
+						<span style={{width: '100px', color: '#5091FF'}} className="xiaoshou">{record.start_at}</span>
 					),
 				},
 				{
@@ -99,40 +98,40 @@ class Videostatisticscom extends Component {
 					className: 'font-14 maxnamewidth100s',
 					width: '100px',
 					render: (text, record) => (
-						<span style={{width: '100px',color:'#5091FF'}} className="xiaoshou" >{record.end_at}</span>
+						<span style={{width: '100px', color: '#5091FF'}} className="xiaoshou">{record.end_at}</span>
 					),
 				}
 			],
-			loading:false,
-			order:undefined,
-			course_groups:[],
-			fbbool:false,
-			groupsid:null,
+			loading: false,
+			order: undefined,
+			course_groups: [],
+			fbbool: false,
+			groupsid: null,
 		}
 	}
 
 	componentDidMount() {
 		this.setState({
-			order:undefined
+			order: undefined
 		})
-    if(this.props.isAdmin()){
-    	//老师
-			const CourseId=this.props.match.params.coursesId;
+		if (this.props.isAdmin()) {
+			//老师
+			const CourseId = this.props.match.params.coursesId;
 
-			var data={
-				id:CourseId,
-				page:this.state.page,
+			var data = {
+				id: CourseId,
+				page: this.state.page,
 			}
-    	this.getdatas(data);
+			this.getdatas(data);
 
-		}else{
-    	//学生
-    	var data={
-				page:this.state.page,
+		} else {
+			//学生
+			var data = {
+				page: this.state.page,
 			}
 			this.getdatas(data);
 		}
-    this.fenbans();
+		this.fenbans();
 	}
 
 	componentDidUpdate = (prevProps) => {
@@ -141,21 +140,21 @@ class Videostatisticscom extends Component {
 	}
 
 	//分班
-	fenbans=()=>{
-		const CourseId=this.props.match.params.coursesId;
-		let url=`/courses/${CourseId}/course_groups.json`;
+	fenbans = () => {
+		const CourseId = this.props.match.params.coursesId;
+		let url = `/courses/${CourseId}/course_groups.json`;
 		axios.get(url).then((response) => {
-     if(response){
-     	console.log("分班");
-     	console.log("response");
-			 console.log(response);
-			 this.setState({
-				 course_groups:response.data.course_groups,
-				 current_group_id:response.data.current_group_id,
-				 none_group_member_count:response.data.none_group_member_count,
-				 group_count:response.data.group_count,
-			 })
-		 }
+			if (response) {
+				console.log("分班");
+				console.log("response");
+				console.log(response);
+				this.setState({
+					course_groups: response.data.course_groups,
+					current_group_id: response.data.current_group_id,
+					none_group_member_count: response.data.none_group_member_count,
+					group_count: response.data.group_count,
+				})
+			}
 
 		}).catch((error) => {
 
@@ -163,101 +162,117 @@ class Videostatisticscom extends Component {
 	}
 
 	//学生
-	getdatas=(data)=>{
+	getdatas = (data) => {
 		this.setState({
-			loading:true
+			loading: true
 		})
-		const CourseId=this.props.match.params.coursesId;
-		let url="";
-		if(this.props.isAdmin()){
-			url=`/course_videos/${this.props.tisid}/watch_histories.json`;
-		}else {
-			url=`/courses/${CourseId}/own_watch_histories.json`;
+		const CourseId = this.props.match.params.coursesId;
+		let url = "";
+		if (this.props.isAdmin()) {
+			url = `/course_videos/${this.props.tisid}/watch_histories.json`;
+		} else {
+			url = `/courses/${CourseId}/own_watch_histories.json`;
 		}
-		axios.get(url,{params:data}).then((response) => {
-			if(response){
-				if(response.data){
-					if(response.data.data.length>0){
-						let datalists=[];
+		axios.get(url, {params: data}).then((response) => {
+			if (response) {
+				if (response.data) {
+					if (response.data.data.length > 0) {
+						let datalists = [];
 						for (var i = 0; i < response.data.data.length; i++) {
 							datalists.push({
 								number: (parseInt(page) - 1) * parseInt(limit) + (i + 1),
-								user_name:response.data.data[i].user_name,
-								is_finished:response.data.data[i].is_finished,
-								total_duration:response.data.data[i].total_duration,
-								feq:response.data.data[i].feq,
-								start_at:response.data.data[i].start_at,
-								end_at:response.data.data[i].end_at,
+								user_name: response.data.data[i].user_name,
+								is_finished: response.data.data[i].is_finished,
+								total_duration: response.data.data[i].total_duration,
+								feq: response.data.data[i].feq,
+								start_at: response.data.data[i].start_at,
+								end_at: response.data.data[i].end_at,
 							})
 						}
 
 						this.setState({
-							data:datalists,
-							members_count:response.data.count,
+							data: datalists,
+							members_count: response.data.count,
 						})
-					}else{
+					} else {
 						this.setState({
-							data:[],
-							members_count:response.data.count,
+							data: [],
+							members_count: response.data.count,
 						})
 					}
-				}else{
+				} else {
 					this.setState({
-						data:[],
-						members_count:response.data.count,
+						data: [],
+						members_count: response.data.count,
 					})
 				}
 
 
-
-				}
+			}
 			this.setState({
-				loading:false
+				loading: false
 			})
 		}).catch((error) => {
 			this.setState({
-				loading:false
+				loading: false
 			})
 		});
 	}
 
 
-
 	paginationonChange = (pageNumber) => {
 		this.setState({
 			page: pageNumber,
 		})
-	}
-	fenbanone=()=>{
-		  if(this.state.fbbool===false){
-				this.setState({
-					fbbool:true
-				})
-			}else{
-				this.setState({
-					fbbool:false
-				})
+		let data = {}
+		if (this.props.isAdmin()) {
+			//老师
+			const CourseId = this.props.match.params.coursesId;
+				data = {
+					id: CourseId,
+					page: pageNumber,
+					group_id: this.state.groupsid,
+					order: this.state.order,
+				}
+		} else {
+			//学生
+			data = {
+				page: pageNumber,
+				order: this.state.order,
 			}
+		}
+		this.getdatas(data);
+	}
+	fenbanone = () => {
+		if (this.state.fbbool === false) {
+			this.setState({
+				fbbool: true
+			})
+		} else {
+			this.setState({
+				fbbool: false
+			})
+		}
 	}
-	setcourse_groups=(id)=>{
+	setcourse_groups = (id) => {
 		this.setState({
-			groupsid:id
+			groupsid: id
 		})
 //老师
-		const CourseId=this.props.match.params.coursesId;
-
-		var data={};
-		if(id){
-			data={
-				id:CourseId,
-				page:this.state.page,
-				group_id:id
+		const CourseId = this.props.match.params.coursesId;
+
+		var data = {};
+		if (id) {
+			data = {
+				id: CourseId,
+				page: this.state.page,
+				group_id: id
 			}
 
-		}else {
-			data={
-				id:CourseId,
-				page:this.state.page
+		} else {
+			data = {
+				id: CourseId,
+				page: this.state.page
 			}
 		}
 		this.getdatas(data);
@@ -270,39 +285,39 @@ class Videostatisticscom extends Component {
 		} else {
 			try {
 				//学生学号排序
-				if (sorter.columnKey === "total_duration"||sorter.columnKey === "feq") {
-					let mysorder="";
+				if (sorter.columnKey === "total_duration" || sorter.columnKey === "feq") {
+					let mysorder = "";
 					if (sorter.order === "ascend") {
-						if(sorter.columnKey === "total_duration"){
-							mysorder="total_duration-asc";
-						}else{
-							mysorder="freq-asc";
+						if (sorter.columnKey === "total_duration") {
+							mysorder = "total_duration-asc";
+						} else {
+							mysorder = "freq-asc";
 
 						}
 						//升序
-						let data={}
-						if(this.props.isAdmin()){
+						let data = {}
+						if (this.props.isAdmin()) {
 							//老师
-							const CourseId=this.props.match.params.coursesId;
-							if(groupsid){
-								data={
-									id:CourseId,
-									page:this.state.page,
-									order:mysorder,
+							const CourseId = this.props.match.params.coursesId;
+							if (groupsid) {
+								data = {
+									id: CourseId,
+									page: this.state.page,
+									order: mysorder,
 								}
-							}else{
-								data={
-									id:CourseId,
-									page:this.state.page,
-									group_id:this.state.groupsid,
-									order:mysorder,
+							} else {
+								data = {
+									id: CourseId,
+									page: this.state.page,
+									group_id: this.state.groupsid,
+									order: mysorder,
 								}
 							}
-						}else{
+						} else {
 							//学生
-							 data={
-								page:this.state.page,
-								 order:mysorder,
+							data = {
+								page: this.state.page,
+								order: mysorder,
 							}
 						}
 
@@ -311,43 +326,43 @@ class Videostatisticscom extends Component {
 							order: mysorder,
 						})
 					} else if (sorter.order === "descend") {
-						if(sorter.columnKey === "total_duration"){
-							mysorder="total_duration-desc";
+						if (sorter.columnKey === "total_duration") {
+							mysorder = "total_duration-desc";
 
-						}else{
-							mysorder="freq-desc";
+						} else {
+							mysorder = "freq-desc";
 
 						}
 						//降序
-						let data={}
-						if(this.props.isAdmin()){
+						let data = {}
+						if (this.props.isAdmin()) {
 							//老师
-							const CourseId=this.props.match.params.coursesId;
-							if(groupsid){
-								data={
-									id:CourseId,
-									page:this.state.page,
-									order:mysorder,
+							const CourseId = this.props.match.params.coursesId;
+							if (groupsid) {
+								data = {
+									id: CourseId,
+									page: this.state.page,
+									order: mysorder,
 								}
-							}else{
-								data={
-									id:CourseId,
-									page:this.state.page,
-									group_id:this.state.groupsid,
-									order:mysorder,
+							} else {
+								data = {
+									id: CourseId,
+									page: this.state.page,
+									group_id: this.state.groupsid,
+									order: mysorder,
 								}
 							}
-						}else{
+						} else {
 							//学生
-							data={
-								page:this.state.page,
-								order:mysorder,
+							data = {
+								page: this.state.page,
+								order: mysorder,
 							}
 						}
 
 						this.getdatas(data);
 						this.setState({
-							order:mysorder,
+							order: mysorder,
 						})
 
 
@@ -362,30 +377,29 @@ class Videostatisticscom extends Component {
 	}
 
 
-
 	render() {
-  let {loading,data,page,limit,members_count,columnsstu,fbbool,course_groups}=this.state;
-		const  isAdmin =this.props.isAdmin();
+		let {loading, data, page, limit, members_count, columnsstu, fbbool, course_groups} = this.state;
+		const isAdmin = this.props.isAdmin();
 
 		const menu = (
 			<Menu>
 				<Menu.Item>
-					<a onClick={()=>this.setcourse_groups(null)}>
+					<a onClick={() => this.setcourse_groups(null)}>
 						<p className="maxnamewidth200s">全部</p>
 					</a>
 				</Menu.Item>
 				{
-					course_groups&&course_groups.length>0?
+					course_groups && course_groups.length > 0 ?
 						(
-							course_groups.map((item,key) => {
-									return (
-										<Menu.Item>
-											<a  onClick={()=>this.setcourse_groups(item.id)} key={key}>
-												<p className="maxnamewidth200s">{item.name}</p>
-											</a>
-										</Menu.Item>
-									)
-								})
+							course_groups.map((item, key) => {
+								return (
+									<Menu.Item>
+										<a onClick={() => this.setcourse_groups(item.id)} key={key}>
+											<p className="maxnamewidth200s">{item.name}</p>
+										</a>
+									</Menu.Item>
+								)
+							})
 						)
 						:
 						""
@@ -394,30 +408,37 @@ class Videostatisticscom extends Component {
 		);
 		return (
 			<React.Fragment>
-				<div className="ws100s" >
+				<div className="ws100s">
 					<div className="ws100s teacherentrydivs edu-back-white ">
 						<div className="ws100s sortinxdirection">
 							<div className="ws50s sptits">视频名称视频名称…</div>
 							<div className="ws50s sptitss xaxisreverseorder font-14" style={{
-								color:"#5091FF",
+								color: "#5091FF",
 								lineHeight: "42px",
 							}}>
-               <div className="xiaoshou" onClick={()=>this.props.tisticsbools(false,null)}>
-								 <span className="mr5 xiaoshou">视频统计总览</span><i className="iconfont icon-fanhui  font-13 xiaoshou"></i>
-							 </div>
-								<div className="xiaoshou"  onClick={()=>this.fenbanone()}>
-									<Dropdown  getPopupContainer={trigger => trigger.parentNode}   overlay={menu} placement="bottomCenter" >
+								<div className="xiaoshou" onClick={() => this.props.tisticsbools(false, null)}>
+									<span className="mr5 xiaoshou">视频统计总览</span><i className="iconfont icon-fanhui  font-13 xiaoshou"></i>
+								</div>
+								{
+									isAdmin === true ?
+										<div className="xiaoshou" onClick={() => this.fenbanone()}>
+											<Dropdown getPopupContainer={trigger => trigger.parentNode} overlay={menu}
+																placement="bottomCenter">
 								   <span>
 										 	<span className="mr5 xiaoshou">分班</span>
 										 {
-											 fbbool===true?
+											 fbbool === true ?
 												 <i className="iconfont icon-sanjiaoxing-down  font-13 mr32 xiaoshou"></i>
 												 :
 												 <i className="iconfont icon-sanjiaoxing-up  font-13 mr32 xiaoshou"></i>
 										 }
 									 </span>
-									</Dropdown>
-								</div>
+											</Dropdown>
+										</div>
+										:
+										""
+								}
+
 							</div>
 						</div>
 
@@ -432,7 +453,7 @@ class Videostatisticscom extends Component {
 							}
 						</style>
 						{
-							loading===true?
+							loading === true ?
 								<div style={{
 									minHeight: "400px",
 								}} className="ws100s">
@@ -441,7 +462,7 @@ class Videostatisticscom extends Component {
 								:
 								<div className="ws100s ysltableo teacherentrydivs">
 									{
-										data.length===0?
+										data.length === 0 ?
 											<div style={{
 												minHeight: "400px",
 											}} className="ws100s">
@@ -465,11 +486,11 @@ class Videostatisticscom extends Component {
 
 					<div className="mb30 clearfix educontent mt40 intermediatecenter">
 						{
-							data&&data.length>0?
+							data && data.length > 0 ?
 								<Pagination showQuickJumper current={this.state.page} onChange={this.paginationonChange}
 														pageSize={this.state.limit}
 														total={this.state.members_count}></Pagination>
-								:""
+								: ""
 						}
 
 					</div>
diff --git a/public/react/src/modules/courses/videostatistics/component/Videostatisticslist.js b/public/react/src/modules/courses/videostatistics/component/Videostatisticslist.js
index 3ec3af0fa..6fa666b3c 100644
--- a/public/react/src/modules/courses/videostatistics/component/Videostatisticslist.js
+++ b/public/react/src/modules/courses/videostatistics/component/Videostatisticslist.js
@@ -1,6 +1,6 @@
 import React, {Component} from "react";
 import '../../signin/css/signincdi.css';
-import {Pagination,Table} from 'antd';
+import {Pagination,Table,sortDirections} from 'antd';
 import {getImageUrl} from 'educoder';
 import axios from 'axios';
 import LoadingSpin from "../../../../common/LoadingSpin";
@@ -44,6 +44,8 @@ class Videostatisticslist extends Component {
 					align: "center",
 					className: 'font-14',
 					width: '98px',
+					sorter: true,
+					sortDirections: sortDirections,
 					render: (text, record) => (
 						<span style={{width: '98px'}}>{record.people_num}</span>
 					),
@@ -55,6 +57,8 @@ class Videostatisticslist extends Component {
 					align: "center",
 					className: 'font-14 maxnamewidth150s',
 					width: '150px',
+					sorter: true,
+					sortDirections: sortDirections,
 					render: (text, record) => (
 						<span style={{width: '150px'}} className="maxnamewidth150s">{record.total_time}</span>
 					),
@@ -87,11 +91,16 @@ class Videostatisticslist extends Component {
 			page:1,
 			limit:10,
 			members_count:0,
+			order:undefined,
 		}
 	}
 
 	componentDidMount() {
-		this.togetdatas(1);
+		let data={
+			page:1,
+			order:this.state.order
+		}
+		this.togetdatas(data);
 
 	}
 
@@ -103,27 +112,59 @@ class Videostatisticslist extends Component {
 		this.setState({
 			page: pageNumber,
 		})
-   this.togetdatas(pageNumber);
+		let data={
+			page:pageNumber,
+			order:this.state.order
+		}
+   this.togetdatas(data);
 	}
 
 
-	togetdatas(page){
+	togetdatas(data){
 		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
-			}
+		axios.get(url,{params:data
 		}).then((response) => {
-			if(response){
-				this.setState({
-					data:response.data&&response.data.videos?response.data.videos:[],
-					members_count:response.data.count,
-				})
+			if (response) {
+				if (response.data) {
+					if (response.data.videos.length > 0) {
+						let datalists = [];
+						for (var i = 0; i < response.data.videos.length; i++) {
+							datalists.push({
+								number: (parseInt(page) - 1) * parseInt(limit) + (i + 1),
+								title: response.data.videos[i].title,
+								people_num: response.data.videos[i].people_num,
+								total_time: response.data.videos[i].total_time,
+								user_name: response.data.videos[i].user_name,
+								id: response.data.videos[i].id,
+x							})
+						}
+
+						this.setState({
+							data: datalists,
+							members_count: response.data.count,
+						})
+					} else {
+						this.setState({
+							data: [],
+							members_count: response.data.count,
+						})
+					}
+				} else {
+					this.setState({
+						data: [],
+						members_count: response.data.count,
+					})
+				}
+
 
 			}
+
+
+
 			this.setState({
 				loading:false
 			})
@@ -135,6 +176,57 @@ class Videostatisticslist extends Component {
 	}
 
 
+	//实训作业tbale 列表塞选数据
+	table1handleChange = (pagination, filters, sorter) => {
+		if (JSON.stringify(sorter) === "{}") {
+			//没有选择
+		} else {
+			try {
+				//学生学号排序
+				if (sorter.columnKey === "people_num"||sorter.columnKey === "total_time") {
+					let mysorder="";
+					if (sorter.order === "ascend") {
+						if(sorter.columnKey === "people_num"){
+							mysorder="people_num-asc";
+						}else{
+							mysorder="total_time-asc";
+
+						}
+						//升序
+						let data={
+							page:this.state.page,
+							order:mysorder
+						}
+						this.togetdatas(data);
+						this.setState({
+							order: mysorder,
+						})
+					} else if (sorter.order === "descend") {
+						if(sorter.columnKey === "people_num"){
+							mysorder="people_num-desc";
+						}else{
+							mysorder="total_time-desc";
+
+						}
+						//降序
+						let data={
+							page:this.state.page,
+							order:mysorder
+						}
+						this.togetdatas(data);
+						this.setState({
+							order: mysorder,
+						})
+					}
+				}
+			} catch (e) {
+
+			}
+
+		}
+
+	}
+
 
 
 	render() {
@@ -175,7 +267,13 @@ class Videostatisticslist extends Component {
 												<NoneDatas></NoneDatas>
 											</div>
 											:
-											<Table columns={columnsstu} dataSource={data} pagination={false}/>
+											<Table
+												columns={columnsstu}
+												dataSource={data}
+												pagination={false}
+												onChange={this.table1handleChange}
+
+											/>
 									}