教师列表

public/react/src/modules/courses/members/ChangeRolePop.js

@@ -0,0 +1,72 @@
+import React, { useState, useEffect } from 'react'
+import { trigger, WordsBtn } from 'educoder'
+import { Input, Checkbox, Popconfirm } from "antd";
+import axios from 'axios'
+
+/** 
+    角色数组, CREATOR: 创建者, PROFESSOR: 教师, ASSISTANT_PROFESSOR: 助教, STUDENT: 学生
+*/
+function ChangeRolePop({ member_roles = [], record, courseId, onChangeRoleSuccess, showNotification }) {
+    const [checkBoxRoles, setCheckBoxRoles] = useState(member_roles)
+    useEffect(() => {
+        setCheckBoxRoles(member_roles)
+    }, [member_roles])
+    function onCheckBoxChange(val) {
+        console.log(val)
+
+        const isTeacher = checkBoxRoles.indexOf('PROFESSOR') 
+        const isAssitant = checkBoxRoles.indexOf('ASSISTANT_PROFESSOR') 
+        const isTeacherNew = val.indexOf('PROFESSOR')
+        const isAssitantNew = val.indexOf('ASSISTANT_PROFESSOR')
+        if (isTeacherNew > -1 && isTeacher == -1 && isAssitantNew > -1) {
+            val.splice(isAssitantNew, 1)
+        }
+        if (isAssitantNew > -1 && isAssitant == -1 && isTeacherNew > -1) {
+            val.splice(isTeacherNew, 1)
+        }
+        
+        setCheckBoxRoles(val)
+    }
+    function onCancel() {
+        setCheckBoxRoles(member_roles)
+    }
+    const onConfirm = async () => {
+        if (checkBoxRoles && checkBoxRoles.length == 0) {
+            showNotification('请至少选择一个角色')
+            return;
+        }
+        const url = `/courses/${courseId}/change_member_role.json`
+        const response = await axios.post(url, {
+            roles: checkBoxRoles,
+            user_id: record.user_id
+        })
+        if (response.data.status == 0) {
+            onChangeRoleSuccess()
+        }
+        console.log(response)
+    }
+    const isAdmin = checkBoxRoles.indexOf('CREATOR') != -1
+    const isTeacher = checkBoxRoles.indexOf('PROFESSOR') != -1
+    const isAssitant = checkBoxRoles.indexOf('ASSISTANT_PROFESSOR') != -1
+    const isStudent = checkBoxRoles.indexOf('STUDENT') != -1
+    return (
+        <Popconfirm 
+            overlayClassName="changeRolePop"
+            placement="bottom"
+            icon={null}
+            onConfirm={onConfirm}
+            onCancel={onCancel}
+            title={
+                <Checkbox.Group style={{ width: '100%' }} onChange={onCheckBoxChange} value={checkBoxRoles}>     
+                    {isAdmin && <Checkbox disabled={isAdmin} value="CREATOR">管理员</Checkbox>}
+                    {!isAdmin && <Checkbox value="PROFESSOR">教师</Checkbox>}
+                    <Checkbox disabled={isAdmin} value="ASSISTANT_PROFESSOR">助教</Checkbox>
+                    <Checkbox value="STUDENT">学生</Checkbox>
+                </Checkbox.Group>
+            }
+            >
+            <WordsBtn style={'blue'}>修改角色</WordsBtn>
+        </Popconfirm>
+    )
+}
+export default ChangeRolePop

public/react/src/modules/courses/members/teacherList.js

@@ -24,6 +24,7 @@ import AddAdminModal from './modal/AddAdminModal'
 import CourseGroupChooserModal from './modal/CourseGroupChooserModal'
 import { ROLE_TEACHER_NUM, ROLE_ASSISTANT_NUM } from './common'
 import CourseGroupChooser from './CourseGroupChooser'
+import ChangeRolePop from './ChangeRolePop'
 
 const Search = Input.Search;
 const ROLE_ADMIN = "管理员"
@@ -38,6 +39,8 @@ function buildColumns(that) {
   const isAdminOrTeacher = that.props.isAdminOrTeacher()
   const { course_groups, filterKey } = that.state
   const showSorter = filterKey == '1' 
+  const courseId = that.props.match.params.coursesId    
+
   const columns = [{
     title: '序号',
     dataIndex: 'name',
@@ -152,10 +155,18 @@ function buildColumns(that) {
               <a onClick={() => that.onAgree(record)} style={{color: '#4CACFF'}}>同意</a> 
             </span> )
         } else {
+
           return (
             <React.Fragment>
               <WordsBtn style2={{ marginRight: '12px' }} onClick={() => that.onDelete(record)} style={'grey'}>删除</WordsBtn>              
-              <Popconfirm 
+              <ChangeRolePop
+                courseId={courseId}
+                record={record}
+                member_roles={record.member_roles}
+                onChangeRoleSuccess={that.onChangeRoleSuccess}
+                showNotification={that.props.showNotification}
+              ></ChangeRolePop>
+              {/* <Popconfirm 
                 placement="bottom"
                 icon={null}
                 title={
@@ -167,7 +178,7 @@ function buildColumns(that) {
                 }
               >
                 <WordsBtn style={'blue'}>修改角色</WordsBtn>
-              </Popconfirm>
+              </Popconfirm> */}
             </React.Fragment>
 
 
@@ -366,6 +377,9 @@ class studentsList extends Component{
       console.log(error);
     });
   }
+  onChangeRoleSuccess = () => {
+    this.fetchAll()
+  } 
   fetchAll = async (argPage) => {
     this.setState({
       isSpin:true