|
|
|
@ -1,5 +1,5 @@
|
|
|
|
import React,{ Component } from "react";
|
|
|
|
import React,{ Component } from "react";
|
|
|
|
import { Input,Checkbox,Table, Pagination, Modal,Menu ,Spin, Tooltip , Divider } from "antd";
|
|
|
|
import { Input,Checkbox,Table, Pagination, Modal,Menu ,Spin, Tooltip , Divider, Popconfirm } from "antd";
|
|
|
|
import ClipboardJS from 'clipboard'
|
|
|
|
import ClipboardJS from 'clipboard'
|
|
|
|
import '../css/Courses.css'
|
|
|
|
import '../css/Courses.css'
|
|
|
|
import '../css/members.css'
|
|
|
|
import '../css/members.css'
|
|
|
|
@ -14,6 +14,8 @@ import _ from 'lodash'
|
|
|
|
import NoneData from "../coursesPublic/NoneData"
|
|
|
|
import NoneData from "../coursesPublic/NoneData"
|
|
|
|
import DownloadMessageysl from "../../modals/DownloadMessageysl";
|
|
|
|
import DownloadMessageysl from "../../modals/DownloadMessageysl";
|
|
|
|
import CreateGroupByImportModal from './modal/CreateGroupByImportModal'
|
|
|
|
import CreateGroupByImportModal from './modal/CreateGroupByImportModal'
|
|
|
|
|
|
|
|
import ChangeRolePop from './ChangeRolePop'
|
|
|
|
|
|
|
|
import "./studentsList.css"
|
|
|
|
|
|
|
|
|
|
|
|
const Search =Input.Search;
|
|
|
|
const Search =Input.Search;
|
|
|
|
const TYPE_STUDENTS = 1
|
|
|
|
const TYPE_STUDENTS = 1
|
|
|
|
@ -22,6 +24,7 @@ const TYPE_COURSE_GOURP_CHILD = 3
|
|
|
|
const buildColumns = (that,isParent) => {
|
|
|
|
const buildColumns = (that,isParent) => {
|
|
|
|
const { course_groups , sortedInfo } = that.state
|
|
|
|
const { course_groups , sortedInfo } = that.state
|
|
|
|
let showSorter = isParent==true
|
|
|
|
let showSorter = isParent==true
|
|
|
|
|
|
|
|
const courseId = that.props.match.params.coursesId
|
|
|
|
const columns=[{
|
|
|
|
const columns=[{
|
|
|
|
title: '序号',
|
|
|
|
title: '序号',
|
|
|
|
dataIndex: 'id',
|
|
|
|
dataIndex: 'id',
|
|
|
|
@ -32,19 +35,21 @@ const buildColumns = (that,isParent) => {
|
|
|
|
render: (id, student, index) => {
|
|
|
|
render: (id, student, index) => {
|
|
|
|
return (that.state.page - 1) * 20 + index + 1
|
|
|
|
return (that.state.page - 1) * 20 + index + 1
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}, {
|
|
|
|
},
|
|
|
|
title: '用户id',
|
|
|
|
// {
|
|
|
|
dataIndex: 'login',
|
|
|
|
// title: '用户id',
|
|
|
|
key: 'login',
|
|
|
|
// dataIndex: 'login',
|
|
|
|
align:'center',
|
|
|
|
// key: 'login',
|
|
|
|
width:"10%",
|
|
|
|
// align:'center',
|
|
|
|
className:"color-grey-6",
|
|
|
|
// width:"10%",
|
|
|
|
render: (login, record) => {
|
|
|
|
// className:"color-grey-6",
|
|
|
|
return <span className="color-dark overflowHidden1" style={{maxWidth: '160px'}}
|
|
|
|
// render: (login, record) => {
|
|
|
|
title={login && login.length > 10 ? login : ''}
|
|
|
|
// return <span className="color-dark overflowHidden1" style={{maxWidth: '160px'}}
|
|
|
|
>{login}</span>
|
|
|
|
// title={login && login.length > 10 ? login : ''}
|
|
|
|
}
|
|
|
|
// >{login}</span>
|
|
|
|
}, {
|
|
|
|
// }
|
|
|
|
|
|
|
|
// },
|
|
|
|
|
|
|
|
{
|
|
|
|
title: '姓名',
|
|
|
|
title: '姓名',
|
|
|
|
dataIndex: 'name',
|
|
|
|
dataIndex: 'name',
|
|
|
|
key: 'name',
|
|
|
|
key: 'name',
|
|
|
|
@ -69,14 +74,45 @@ const buildColumns = (that,isParent) => {
|
|
|
|
return <span className="color-dark overflowHidden1 " title={student_id && student_id.length > 10 ? student_id : ''}
|
|
|
|
return <span className="color-dark overflowHidden1 " title={student_id && student_id.length > 10 ? student_id : ''}
|
|
|
|
style={{maxWidth: '160px'}} >{student_id}</span>
|
|
|
|
style={{maxWidth: '160px'}} >{student_id}</span>
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}];
|
|
|
|
}
|
|
|
|
|
|
|
|
, {
|
|
|
|
|
|
|
|
title: '手机号',
|
|
|
|
|
|
|
|
dataIndex: 'user_phone',
|
|
|
|
|
|
|
|
key: 'user_phone',
|
|
|
|
|
|
|
|
align:'center',
|
|
|
|
|
|
|
|
width:"10%",
|
|
|
|
|
|
|
|
className:"color-grey-6",
|
|
|
|
|
|
|
|
// sorter: true,
|
|
|
|
|
|
|
|
// sortDirections: sortDirections,
|
|
|
|
|
|
|
|
// sortOrder: sortedInfo.columnKey === 'user_phone' && sortedInfo.order,
|
|
|
|
|
|
|
|
render: (user_phone, record) => {
|
|
|
|
|
|
|
|
return <span className="color-dark overflowHidden1 " title={user_phone && user_phone.length > 10 ? user_phone : ''}
|
|
|
|
|
|
|
|
style={{maxWidth: '160px'}} >{user_phone}</span>
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
, {
|
|
|
|
|
|
|
|
title: '邮箱',
|
|
|
|
|
|
|
|
dataIndex: 'user_mail',
|
|
|
|
|
|
|
|
key: 'user_mail',
|
|
|
|
|
|
|
|
align:'center',
|
|
|
|
|
|
|
|
width:"10%",
|
|
|
|
|
|
|
|
className:"color-grey-6",
|
|
|
|
|
|
|
|
// sorter: true,
|
|
|
|
|
|
|
|
// sortDirections: sortDirections,
|
|
|
|
|
|
|
|
// sortOrder: sortedInfo.columnKey === 'user_mail' && sortedInfo.order,
|
|
|
|
|
|
|
|
render: (user_mail, record) => {
|
|
|
|
|
|
|
|
return <span className="color-dark overflowHidden1 " title={user_mail && user_mail.length > 10 ? user_mail : ''}
|
|
|
|
|
|
|
|
style={{maxWidth: '160px'}} >{user_mail}</span>
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
];
|
|
|
|
if (course_groups && course_groups.length) {
|
|
|
|
if (course_groups && course_groups.length) {
|
|
|
|
columns.push({
|
|
|
|
columns.push({
|
|
|
|
title: '分班',
|
|
|
|
title: '分班',
|
|
|
|
dataIndex: 'course_group_name',
|
|
|
|
dataIndex: 'course_group_name',
|
|
|
|
key: 'course_group_name',
|
|
|
|
key: 'course_group_name',
|
|
|
|
align:'center',
|
|
|
|
align:'center',
|
|
|
|
width:"40%",
|
|
|
|
width:"25%",
|
|
|
|
className:"color-grey-6",
|
|
|
|
className:"color-grey-6",
|
|
|
|
sorter:showSorter,
|
|
|
|
sorter:showSorter,
|
|
|
|
sortDirections: sortDirections,
|
|
|
|
sortDirections: sortDirections,
|
|
|
|
@ -95,14 +131,36 @@ const buildColumns = (that,isParent) => {
|
|
|
|
const isAdmin = that.props.isAdmin()
|
|
|
|
const isAdmin = that.props.isAdmin()
|
|
|
|
if (isAdmin) {
|
|
|
|
if (isAdmin) {
|
|
|
|
columns.unshift({
|
|
|
|
columns.unshift({
|
|
|
|
title: '',
|
|
|
|
title: '',
|
|
|
|
dataIndex: 'check',
|
|
|
|
dataIndex: 'check',
|
|
|
|
key: 'check',
|
|
|
|
key: 'check',
|
|
|
|
render: (text, item) => {
|
|
|
|
render: (text, item) => {
|
|
|
|
return <Checkbox value={item.course_member_id} key={item.course_member_id} ></Checkbox>
|
|
|
|
return <Checkbox value={item.course_member_id} key={item.course_member_id} ></Checkbox>
|
|
|
|
},
|
|
|
|
},
|
|
|
|
width:"5%"
|
|
|
|
width:"5%"
|
|
|
|
})
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
columns.push({
|
|
|
|
|
|
|
|
title: '操作',
|
|
|
|
|
|
|
|
key: 'action',
|
|
|
|
|
|
|
|
width: '20%',
|
|
|
|
|
|
|
|
align:'center',
|
|
|
|
|
|
|
|
render: (text, record) => {
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
|
|
|
<React.Fragment>
|
|
|
|
|
|
|
|
<WordsBtn style2={{ marginRight: '12px' }} onClick={() => that.onDelete(record)} style={'grey'}>删除学生</WordsBtn>
|
|
|
|
|
|
|
|
<ChangeRolePop
|
|
|
|
|
|
|
|
courseId={courseId}
|
|
|
|
|
|
|
|
record={record}
|
|
|
|
|
|
|
|
member_roles={record.member_roles}
|
|
|
|
|
|
|
|
onChangeRoleSuccess={that.onChangeRoleSuccess}
|
|
|
|
|
|
|
|
showNotification={that.props.showNotification}
|
|
|
|
|
|
|
|
></ChangeRolePop>
|
|
|
|
|
|
|
|
</React.Fragment>
|
|
|
|
|
|
|
|
)
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
return columns;
|
|
|
|
return columns;
|
|
|
|
@ -242,7 +300,9 @@ class studentsList extends Component{
|
|
|
|
onChange=()=>{
|
|
|
|
onChange=()=>{
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
onChangeRoleSuccess = () => {
|
|
|
|
|
|
|
|
this.fetchAll()
|
|
|
|
|
|
|
|
}
|
|
|
|
componentDidMount() {
|
|
|
|
componentDidMount() {
|
|
|
|
this.setState({
|
|
|
|
this.setState({
|
|
|
|
isSpin:true
|
|
|
|
isSpin:true
|
|
|
|
@ -451,11 +511,13 @@ class studentsList extends Component{
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// 多选
|
|
|
|
// 多选
|
|
|
|
onDelete = () => {
|
|
|
|
onDelete = (record) => {
|
|
|
|
const len = this.state.checkBoxValues.length
|
|
|
|
if (!record) {
|
|
|
|
if (len == 0) {
|
|
|
|
const len = this.state.checkBoxValues.length
|
|
|
|
this.props.showNotification('请先从列表选择要删除的学生')
|
|
|
|
if (len == 0) {
|
|
|
|
return;
|
|
|
|
this.props.showNotification('请先从列表选择要删除的学生')
|
|
|
|
|
|
|
|
return;
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
this.props.confirm({
|
|
|
|
this.props.confirm({
|
|
|
|
@ -465,7 +527,7 @@ class studentsList extends Component{
|
|
|
|
let id = this.props.match.params.coursesId
|
|
|
|
let id = this.props.match.params.coursesId
|
|
|
|
let url=`/courses/${id}/delete_from_course.json`;
|
|
|
|
let url=`/courses/${id}/delete_from_course.json`;
|
|
|
|
axios.post((url), {
|
|
|
|
axios.post((url), {
|
|
|
|
students: this.state.checkBoxValues.map(item => {return {course_member_id: item} }),
|
|
|
|
students: [{course_member_id: record.course_member_id}] // this.state.checkBoxValues.map(item => {return {course_member_id: item} }),
|
|
|
|
}).then((result)=>{
|
|
|
|
}).then((result)=>{
|
|
|
|
if (result.data.status == 0) {
|
|
|
|
if (result.data.status == 0) {
|
|
|
|
this.props.showNotification('删除成功')
|
|
|
|
this.props.showNotification('删除成功')
|
|
|
|
@ -701,7 +763,7 @@ class studentsList extends Component{
|
|
|
|
<div className="clearfix stu_head" style={{paddingLeft: '15px'}}>
|
|
|
|
<div className="clearfix stu_head" style={{paddingLeft: '15px'}}>
|
|
|
|
{isAdmin && <Checkbox className="fl" onChange={this.onCheckAll} checked={checkAllValue} >已选 {checkBoxValues.length} 个</Checkbox>}
|
|
|
|
{isAdmin && <Checkbox className="fl" onChange={this.onCheckAll} checked={checkAllValue} >已选 {checkBoxValues.length} 个</Checkbox>}
|
|
|
|
<div className="studentList_operation_ul">
|
|
|
|
<div className="studentList_operation_ul">
|
|
|
|
{isAdmin && <li className="li_line"><a href="javascript:void(0)" className="color-grey-9" onClick={this.onDelete}>删除</a></li>}
|
|
|
|
{/* {isAdmin && <li className="li_line"><a href="javascript:void(0)" className="color-grey-9" onClick={this.onDelete}>删除</a></li>} */}
|
|
|
|
{isAdmin && <li className="drop_down">
|
|
|
|
{isAdmin && <li className="drop_down">
|
|
|
|
移动到...<i className="iconfont icon-xiajiantou font-12 ml2"></i>
|
|
|
|
移动到...<i className="iconfont icon-xiajiantou font-12 ml2"></i>
|
|
|
|
<ul className="drop_down_menu" style={{"right":"0px","left":"unset", width: '200px', maxHeight: '324px', overflowY: 'auto'}}>
|
|
|
|
<ul className="drop_down_menu" style={{"right":"0px","left":"unset", width: '200px', maxHeight: '324px', overflowY: 'auto'}}>
|
|
|
|
@ -752,7 +814,7 @@ class studentsList extends Component{
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<Spin size="large" spinning={this.state.isSpin}>
|
|
|
|
<Spin size="large" spinning={this.state.isSpin}>
|
|
|
|
<div className="clearfix stu_table">
|
|
|
|
<div className="clearfix stu_table">
|
|
|
|
{!this.state.isSpin && <Checkbox.Group style={{ width: '100%' }} onChange={this.onCheckBoxChange} value={checkBoxValues}>
|
|
|
|
{students && students.length && <Checkbox.Group style={{ width: '100%' }} onChange={this.onCheckBoxChange} value={checkBoxValues}>
|
|
|
|
<Table columns={buildColumns(this,isParent)} dataSource={students} onChange={this.onTableChange} pagination={false}></Table>
|
|
|
|
<Table columns={buildColumns(this,isParent)} dataSource={students} onChange={this.onTableChange} pagination={false}></Table>
|
|
|
|
</Checkbox.Group> }
|
|
|
|
</Checkbox.Group> }
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
