From dbcc7bbb9b7bc3353ce082e659da25ef359aeaf0 Mon Sep 17 00:00:00 2001
From: caicai8 <1149225589@qq.com>
Date: Wed, 19 Feb 2020 17:19:17 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9C=AA=E5=88=86=E7=8F=AD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../courses/members/CourseGroupList.js        | 11 +++--
 .../courses/members/CourseGroupListTable.js   | 33 +++++++-------
 .../modules/courses/members/studentsList.css  | 43 +++++++++++++++++++
 .../modules/courses/members/studentsList.js   | 22 +++++++---
 4 files changed, 85 insertions(+), 24 deletions(-)

diff --git a/public/react/src/modules/courses/members/CourseGroupList.js b/public/react/src/modules/courses/members/CourseGroupList.js
index afec12fa9..597357a9f 100644
--- a/public/react/src/modules/courses/members/CourseGroupList.js
+++ b/public/react/src/modules/courses/members/CourseGroupList.js
@@ -133,7 +133,12 @@ function CourseGroupList(props) {
                 modalsType={DownloadType}
             />
             <Titlesearchsection
-                title={"分班列表"}
+                title={
+                    <ul className="course_publicNav">
+                        <li className="active">分班列表</li>
+                        <li onClick={() => {props.history.push(`/courses/${courseId}/course_groups/0`)}}>未分班</li>
+                    </ul>
+                }
                 searchValue={ searchValue }
                 onInputSearchChange={onInputSearchChange}
                 allowClearonChange={onInputSearchChange}
@@ -211,12 +216,12 @@ function CourseGroupList(props) {
                 onPressEnter={onPressEnter}
             ></Titlesearchsection>
 
-            {!!none_group_member_count && <div className="mt20 E9F8FF padding20-30 pointer" onClick={() => {props.history.push(`/courses/${courseId}/course_groups/0`)}}>
+            {/* {!!none_group_member_count && <div className="mt20 E9F8FF padding20-30 pointer" onClick={() => {props.history.push(`/courses/${courseId}/course_groups/0`)}}>
                 <span>未分班：</span>
                 <span style={{color: '#999999'}}>{none_group_member_count}个学生</span>
 
                 <WordsBtn style="blue" className="fr">查看</WordsBtn>
-            </div>}
+            </div>} */}
 
             <Spin size="large" spinning={isSpin}>
                 {course_groups && !!course_groups.length ?
diff --git a/public/react/src/modules/courses/members/CourseGroupListTable.js b/public/react/src/modules/courses/members/CourseGroupListTable.js
index 5551faee3..2b02afcd7 100644
--- a/public/react/src/modules/courses/members/CourseGroupListTable.js
+++ b/public/react/src/modules/courses/members/CourseGroupListTable.js
@@ -5,7 +5,7 @@ import axios from 'axios'
 
 import { WordsBtn, trigger, on, off, getUrl, downloadFile , sortDirections } from 'educoder'
 import ClipboardJS from 'clipboard'
-
+import './studentsList.css';
 /** 
     角色数组, CREATOR: 创建者, PROFESSOR: 教师, ASSISTANT_PROFESSOR: 助教, STUDENT: 学生
     course_members_count: 0
@@ -103,10 +103,23 @@ function CourseGroupListTable(props) {
                 dataIndex: 'invite_code',
                 key: 'invite_code',
                 align:'center',
-                width:"10%",
+                width:"21%",
                 className:"color-grey-6",
                 render: (invite_code, record, index) => {
-                    return invite_code
+                    return <React.Fragment>
+                        <span>{invite_code}</span>
+                        {isAdmin && 
+                            <Tooltip title={
+                                <div>
+                                    <div>成员可以通过邀请码主动加入分班</div>
+                                    <div>点击复制邀请码</div>
+                                </div>
+                            }>
+                                <WordsBtn data-clipboard-text={record.invite_code} 
+                                    className={`copyBtn_${record.id} codeBtnStyle codeBtn_yellow ml10`} style={''}>复制</WordsBtn>    
+                            </Tooltip>
+                            }
+                    </React.Fragment>
                 }
             } : {
                 title: '你当前所在分班',
@@ -127,22 +140,12 @@ function CourseGroupListTable(props) {
             dataIndex: 'setting',
             key: 'setting',
             align:'center',
-            width:"25%",
+            width:"14%",
             className:"color-grey-6",
             render: (none, record, index) => {
                 return <React.Fragment>
                     {!isCourseEnd && isAdmin && <WordsBtn style2={{ marginRight: '12px' }} onClick={() => onDelete(record)} style={'grey'}>删除分班</WordsBtn>}
-                    {isAdmin && 
-                    <Tooltip title={
-                        <div>
-                            <div>成员可以通过邀请码主动加入分班</div>
-                            <div>点击复制邀请码</div>
-                        </div>
-                    }>
-                        <WordsBtn style2={{ marginRight: '12px' }} data-clipboard-text={record.invite_code} 
-                            className={`copyBtn_${record.id}`} style={''}>复制邀请码</WordsBtn>    
-                    </Tooltip>
-                    }  
+                      
                     {isStudent && <WordsBtn style2={{ marginRight: '12px' }} onClick={() => addToDir(record)} style={''}>加入分班</WordsBtn>}        
                     <WordsBtn  onClick={() => onGoDetail(record)} style={''}>查看</WordsBtn>              
                 </React.Fragment>
diff --git a/public/react/src/modules/courses/members/studentsList.css b/public/react/src/modules/courses/members/studentsList.css
index b2a41c7e6..bd7b88ed1 100644
--- a/public/react/src/modules/courses/members/studentsList.css
+++ b/public/react/src/modules/courses/members/studentsList.css
@@ -5,4 +5,47 @@
 
 .E9F8FF{
     background-color: #E9F8FF;
+}
+
+.codeBtnStyle{
+    height: 18px;
+    line-height: 18px;
+    padding:0px 5px;
+    cursor: pointer;
+    font-size: 12px;
+    border-radius: 2px;
+}
+.codeBtn_yellow{
+    border:1px solid #FF6B06;
+    color: #FF6B06!important;
+}
+.codeBtn_green{
+    border:1px solid #00BA38;
+    color: #00BA38!important;
+}
+
+.codeBtn_blue{
+    border:1px solid #4CACFF;
+    color: #4CACFF!important;
+}
+
+.course_publicNav{
+    display: flex;
+}
+.course_publicNav li{
+    position: relative;
+    margin-right: 30px;
+    cursor: pointer;
+}
+.course_publicNav li.active{
+    color: #4CACFF
+}
+.course_publicNav li.active::after{
+    position: absolute;
+    width: 100%;
+    height: 2px;
+    content: '';
+    left: 0px;
+    bottom: -33px;
+    background: #4CACFF;
 }
\ No newline at end of file
diff --git a/public/react/src/modules/courses/members/studentsList.js b/public/react/src/modules/courses/members/studentsList.js
index aff19d041..af83d0a49 100644
--- a/public/react/src/modules/courses/members/studentsList.js
+++ b/public/react/src/modules/courses/members/studentsList.js
@@ -741,12 +741,22 @@ class studentsList extends Component{
         <Titlesearchsection
           title={isParent ? (pageType == TYPE_STUDENTS ? "全部学生" : "学生列表"):
             <React.Fragment>
-              <span>
-                <Tooltip title="返回至分班列表">
-                  <i className="icon-zuojiantou iconfont font-14" onClick={() => { this.props.history.push(`/courses/${courseId}/course_groups`)}}
-                    style={{color: '#212121', verticalAlign: 'initial', marginRight: '14px' }}
-                  ></i>
-                </Tooltip>{course_group_name || '未分班'}</span>
+              {
+                course_group_name ? 
+                <span>
+                  <Tooltip title="返回至分班列表">
+                    <i className="icon-zuojiantou iconfont font-14" onClick={() => { this.props.history.push(`/courses/${courseId}/course_groups`)}}
+                      style={{color: '#212121', verticalAlign: 'initial', marginRight: '14px' }}
+                    ></i>
+                  </Tooltip>{course_group_name}
+                </span>
+                :
+                <ul className="course_publicNav">
+                  <li onClick={() => { this.props.history.push(`/courses/${courseId}/course_groups`)}}>分班列表</li>
+                  <li className="active">未分班</li>
+                </ul>
+              }
+              
               {isAdmin && invite_code && <React.Fragment>
                 <span className="color-grey-9 font-16 ml10">邀请码：</span>
                 <span className="color-orange font-16">